var xl=Object.defineProperty,_l=Object.defineProperties;var wl=Object.getOwnPropertyDescriptors;var Qr=Object.getOwnPropertySymbols;var Sl=Object.prototype.hasOwnProperty,Cl=Object.prototype.propertyIsEnumerable;var ei=(se,V,e)=>V in se?xl(se,V,{enumerable:!0,configurable:!0,writable:!0,value:e}):se[V]=e,ti=(se,V)=>{for(var e in V||(V={}))Sl.call(V,e)&&ei(se,e,V[e]);if(Qr)for(var e of Qr(V))Cl.call(V,e)&&ei(se,e,V[e]);return se},ni=(se,V)=>_l(se,wl(V));(self.webpackChunk_grafana_ui=self.webpackChunk_grafana_ui||[]).push([[179],{"./src/Intro.story.mdx":function(se,V,e){"use strict";e.r(V),e.d(V,{__page:function(){return i}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/dist/esm/index.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),l=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),f=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function x(O){const m=Object.assign({h1:"h1",blockquote:"blockquote",p:"p",strong:"strong",a:"a",h2:"h2",ul:"ul",li:"li",h3:"h3",code:"code"},(0,l.ah)(),O.components);return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(f.h_,{title:"Docs Overview/Intro",parameters:{options:{isToolshown:!1},id:1}}),`
`,(0,a.jsx)(m.h1,{children:"Grafana design system"}),`
`,(0,a.jsxs)(m.blockquote,{children:[`
`,(0,a.jsxs)(m.p,{children:[(0,a.jsx)(m.strong,{children:"@grafana/ui is currently in BETA"}),"."]}),`
`]}),`
`,(0,a.jsxs)(m.p,{children:["With the design system @grafana/ui, we want to democratize development. This library of reusable ",(0,a.jsx)(m.a,{href:"https://github.com/grafana/grafana",children:"Grafana"})," components and guidelines helps you with contribution and plugin development."]}),`
`,(0,a.jsx)(m.h2,{children:"Our vision"}),`
`,(0,a.jsx)(m.p,{children:"Grafana Labs started @grafana/ui to make contributing to Grafana as easy as possible for Grafanistas and community members of all fields. We want to create a component library that results in:"}),`
`,(0,a.jsxs)(m.ul,{children:[`
`,(0,a.jsx)(m.li,{children:"Understanding of how each component works and how you can use it to create a great user experience."}),`
`,(0,a.jsx)(m.li,{children:"Short development times and consistent code quality."}),`
`,(0,a.jsx)(m.li,{children:"A beautiful, visually consistent Grafana experience."}),`
`,(0,a.jsx)(m.li,{children:"Transparency about how we work and what we do."}),`
`]}),`
`,(0,a.jsx)(m.h3,{children:"Maintained by Grafana Labs and you"}),`
`,(0,a.jsxs)(m.p,{children:["Grafana Labs has a task force that helps create and maintain components. We make sure that components are documented and easy to use. The current status of the @grafana/ui development is available on ",(0,a.jsx)(m.a,{href:"https://github.com/grafana/grafana/projects/26",children:"GitHub"}),". Feel free to contribute!"]}),`
`,(0,a.jsx)(m.h3,{children:"How to get involved"}),`
`,(0,a.jsxs)(m.p,{children:["When we notice that we need to change something, we determine together what the change should be, then we put the change in place and communicate it publicly. Developers and designers create and improve @grafana/ui together. Throughout the process, we strive to involve you and meet your needs. We are looking forward to discussing your design and improvement ideas on ",(0,a.jsx)(m.a,{href:"https://github.com/grafana/grafana/projects/26",children:"GitHub"}),"."]}),`
`,(0,a.jsx)(m.h2,{children:"Get started"}),`
`,(0,a.jsxs)(m.ul,{children:[`
`,(0,a.jsxs)(m.li,{children:[`
`,(0,a.jsxs)(m.p,{children:[(0,a.jsx)(m.strong,{children:"Explore UI components"}),`
Click on any of the component in the sidebar to see how they look, and how to configure them. Each component pages contains documentation of its properties, as well as code examples for how to use it.`]}),`
`]}),`
`,(0,a.jsxs)(m.li,{children:[`
`,(0,a.jsx)(m.p,{children:(0,a.jsx)(m.strong,{children:"Try them out"})}),`
`,(0,a.jsxs)(m.ul,{children:[`
`,(0,a.jsxs)(m.li,{children:["Experiment with different properties, by clicking ",(0,a.jsx)(m.strong,{children:"Canvas"})," at the top of each component page."]}),`
`,(0,a.jsxs)(m.li,{children:["Change the properties under ",(0,a.jsx)(m.strong,{children:"Knobs"})," in the bottom panel."]}),`
`]}),`
`]}),`
`,(0,a.jsxs)(m.li,{children:[`
`,(0,a.jsxs)(m.p,{children:[(0,a.jsx)(m.strong,{children:"Use them"}),`
Once you've found the right component for your use case, click the `,(0,a.jsx)(m.strong,{children:"Story"})," tab to see the code implementation, or look at examples under ",(0,a.jsx)(m.strong,{children:"Docs"}),"."]}),`
`,(0,a.jsxs)(m.p,{children:["For more details, refer to the ",(0,a.jsx)(m.a,{href:"https://github.com/grafana/grafana/tree/main/packages/grafana-ui",children:"package source"}),"."]}),`
`]}),`
`]}),`
`,(0,a.jsx)(m.h2,{children:"Installation"}),`
`,(0,a.jsx)(m.p,{children:(0,a.jsx)(m.code,{children:"yarn add @grafana/ui"})}),`
`,(0,a.jsx)(m.p,{children:(0,a.jsx)(m.code,{children:"npm install @grafana/ui"})}),`
`,(0,a.jsx)(m.h2,{children:"Related links"}),`
`,(0,a.jsxs)(m.ul,{children:[`
`,(0,a.jsx)(m.li,{children:(0,a.jsx)(m.a,{href:"https://grafana.com/tutorials/build-a-panel-plugin/#0",children:"Build a panel plugin tutorial"})}),`
`,(0,a.jsx)(m.li,{children:(0,a.jsx)(m.a,{href:"https://grafana.com/docs/grafana/latest/plugins/developing/development/",children:"Plugin Developer guide"})}),`
`,(0,a.jsx)(m.li,{children:(0,a.jsx)(m.a,{href:"https://github.com/grafana/simple-react-panel",children:"Boilerplate Panel Plugin"})}),`
`,(0,a.jsx)(m.li,{children:(0,a.jsx)(m.a,{href:"https://grafana.com/tutorials/",children:"Grafana Tutorials"})}),`
`]})]})}function d(O={}){const{wrapper:m}=Object.assign({},(0,l.ah)(),O.components);return m?(0,a.jsx)(m,Object.assign({},O,{children:(0,a.jsx)(x,O)})):x(O)}const i=()=>{throw new Error("Docs-only story")};i.parameters={docsOnly:!0};const c={title:"Docs Overview/Intro",parameters:{options:{isToolshown:!1},id:1},includeStories:["__page"]},E={};c.parameters=c.parameters||{},c.parameters.docs=ni(ti({},c.parameters.docs||{}),{page:()=>t.createElement(n.aT,{mdxStoryNameToKey:E,mdxComponentAnnotations:c},t.createElement(d,null))}),V.default=c},"./src/components/Alert/Alert.mdx":function(se,V,e){"use strict";var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),a=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),l=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),f=e("./src/components/Alert/Alert.tsx");function x(i){const c=Object.assign({h1:"h1",p:"p",hr:"hr",ol:"ol",li:"li",a:"a",br:"br",h2:"h2",strong:"strong",ul:"ul",code:"code",h3:"h3",h4:"h4",pre:"pre",em:"em"},(0,a.ah)(),i.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(l.h_,{title:"MDX|Alert",component:f.b}),`
`,(0,n.jsx)(c.h1,{children:"Alert"}),`
`,(0,n.jsx)(c.p,{children:"An alert displays an important message in a way that attracts the user's attention without interrupting the user's task."}),`
`,(0,n.jsx)(c.hr,{}),`
`,(0,n.jsx)(c.p,{children:"About Alert component:"}),`
`,(0,n.jsxs)(c.ol,{children:[`
`,(0,n.jsx)(c.li,{children:(0,n.jsx)(c.a,{href:"#behaviors",children:"Behaviors"})}),`
`,(0,n.jsx)(c.li,{children:(0,n.jsx)(c.a,{href:"#types",children:"Types"})}),`
`,(0,n.jsx)(c.li,{children:(0,n.jsx)(c.a,{href:"#message-type",children:"Message type"})}),`
`,(0,n.jsx)(c.li,{children:(0,n.jsx)(c.a,{href:"#main-elements",children:"Main elements"})}),`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.a,{href:"#usage",children:"Usage:"}),(0,n.jsx)(c.br,{}),`
`,"5.1. ",(0,n.jsx)(c.a,{href:"#alert-inline",children:"Inline banner"}),(0,n.jsx)(c.br,{}),`
`,"5.2. ",(0,n.jsx)(c.a,{href:"#alert-toast",children:"Toast"})]}),`
`]}),`
`,(0,n.jsx)("br",{}),`
`,(0,n.jsx)("br",{}),`
`,(0,n.jsx)("br",{}),`
`,(0,n.jsxs)(c.h2,{children:[(0,n.jsx)("a",{name:"behaviors"})," Behaviors"]}),`
`,(0,n.jsxs)(c.ol,{children:[`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.strong,{children:"Persistent"}),": They are usually urgent and intrusive, require immediate attention and require action to be dismissed."]}),`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.strong,{children:"Passive"}),": Are informational, report a system issue that does not require any action by users.",`
`,(0,n.jsx)("br",{}),`
`]}),`
`]}),`
`,(0,n.jsxs)(c.h2,{children:[(0,n.jsx)("a",{name:"types"}),"Types"]}),`
`,(0,n.jsx)(c.p,{children:"Within Grafana, we have two different types of alerts and they can be used depending on the context and content."}),`
`,(0,n.jsxs)(c.ol,{children:[`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.strong,{children:(0,n.jsx)(c.a,{href:"#alert-inline",children:"Inline banner"})}),":",`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"To notify users of the status of an action. They appear at the top or bottom of the main content area"}),`
`,(0,n.jsx)(c.li,{children:"Passive or Persistent"}),`
`]}),`
`]}),`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.strong,{children:(0,n.jsx)(c.a,{href:"#alert-toast",children:"Toast"})}),":",`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"These temporary window elements are used to display short messages; they appear at the top-right corner of the screen and can be dismissed by clicking the [x] or it will disappear after a few seconds"}),`
`,(0,n.jsxs)(c.li,{children:["Passive",`
`,(0,n.jsx)("br",{}),`
`]}),`
`]}),`
`]}),`
`]}),`
`,(0,n.jsxs)(c.h2,{children:[(0,n.jsx)("a",{name:"message-type"}),"Message Type"]}),`
`,(0,n.jsxs)(c.ol,{children:[`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.strong,{children:"Informational"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"To provide information to users, and don\u2019t interrupt any current actions"}),`
`,(0,n.jsx)(c.li,{children:"Does not require immediate action and can be dismissed by a user clicking the [X] or passively display until the display timer expires"}),`
`,(0,n.jsxs)(c.li,{children:["Shows blue color on the background and uses the ",(0,n.jsx)(c.code,{children:"info-circle"})," icon"]}),`
`]}),`
`]}),`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.strong,{children:"Success"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"To confirm a task is completed as expected or an action is successful."}),`
`,(0,n.jsx)(c.li,{children:"Typically does not require further action and can be dismissed automatically or persist in a nonintrusive manner"}),`
`,(0,n.jsxs)(c.li,{children:["Shows green color on the background and uses the ",(0,n.jsx)(c.code,{children:"check"})," icon"]}),`
`]}),`
`]}),`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.strong,{children:"Warning"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"To inform users that an action is undesirable"}),`
`,(0,n.jsx)(c.li,{children:"Often persists until users have taken action to dismiss the notification or taken steps to resolve the issue"}),`
`,(0,n.jsxs)(c.li,{children:["Shows yellow color on background and uses the ",(0,n.jsx)(c.code,{children:"exclamation-triangle"})," icon"]}),`
`]}),`
`]}),`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.strong,{children:"Error"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"To inform that an action hasn't happened as expected, usually something has failed and the user is expected to take action"}),`
`,(0,n.jsx)(c.li,{children:"Always persists until the user has taken steps to remedy the issue that triggered the notification"}),`
`,(0,n.jsxs)(c.li,{children:["Shows red color on background and uses the ",(0,n.jsx)(c.code,{children:"exclamation-triangle"})," icon",`
`,(0,n.jsx)("br",{}),`
`]}),`
`]}),`
`]}),`
`]}),`
`,(0,n.jsxs)(c.h2,{children:[(0,n.jsx)("a",{name:"main-elements"}),"Main elements"]}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsxs)(c.li,{children:[`
`,(0,n.jsx)(c.p,{children:"Icon status: represents the importance of the message through the color and icon for each status."}),`
`]}),`
`,(0,n.jsxs)(c.li,{children:[`
`,(0,n.jsx)(c.p,{children:"Alert title: should be explicit, clear and short, conveying the most important part of the information."}),`
`]}),`
`,(0,n.jsxs)(c.li,{children:[`
`,(0,n.jsx)(c.p,{children:"Details: precise description for the notification, telling users what they need to do."}),`
`]}),`
`,(0,n.jsxs)(c.li,{children:[`
`,(0,n.jsx)(c.p,{children:"Button and text links: only persistent notifications should contain text links or buttons."}),`
`]}),`
`,(0,n.jsxs)(c.li,{children:[`
`,(0,n.jsx)(c.p,{children:"Close icon: appears when the notification can be dismissed by the user."}),`
`,(0,n.jsx)("br",{}),`
`]}),`
`]}),`
`,(0,n.jsxs)(c.h2,{children:[(0,n.jsx)("a",{name:"usage"}),"Usage"]}),`
`,(0,n.jsx)("br",{}),`
`,(0,n.jsxs)(c.h3,{children:[(0,n.jsx)("a",{name:"alert-inline"})," Inline Banner"]}),`
`,(0,n.jsx)(c.p,{children:"Inline Banners are task-oriented alerts that notify users of the status of an action or system. These alerts are contextual \u2014 appearing above or below main content areas \u2014 allowing users to address issues or to read messages quickly."}),`
`,(0,n.jsx)(c.h4,{children:"Do's"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"Use the appropriate status for the message (info/success/warning/error)."}),`
`,(0,n.jsx)(c.li,{children:"Use plain, simple language for the messages to ensure users understand them and know how to address them."}),`
`,(0,n.jsx)(c.li,{children:"Focus on notifications if they are relevant to the users' current workflow and should be addressed immediately."}),`
`]}),`
`,(0,n.jsx)(c.h4,{children:"Don'ts"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"Do not use Primary calls to actions."}),`
`,(0,n.jsx)(c.li,{children:"Do not hide other content with inline notifications."}),`
`,(0,n.jsx)(c.li,{children:"Do not repeat the alert copy/title on the details message."}),`
`]}),`
`,(0,n.jsx)(c.h4,{children:"When to use"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"To inform at that time how to continue a task in which users must perform an action."}),`
`,(0,n.jsx)(c.li,{children:"To provide some options for users to take action."}),`
`,(0,n.jsx)(c.li,{children:"To explain in detail the reasons why something can\u2019t be done by users."}),`
`]}),`
`,(0,n.jsx)(c.h4,{children:"Placement"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"Should be placed immediately above or below the related element."}),`
`]}),`
`,(0,n.jsx)(c.pre,{children:(0,n.jsx)(c.code,{className:"language-jsx",children:`<Alert title={title} severity={severity} buttonContent={buttonContent} onRemove={onRemove}>
  <VerticalGroup>
    <div>Child content that includes some alert details, like maybe what actually happened.</div>
  </VerticalGroup>
</Alert>
`})}),`
`,(0,n.jsxs)(c.h3,{children:[(0,n.jsx)("a",{name:"alert-toast"}),"Toast"]}),`
`,(0,n.jsx)(c.p,{children:"Toast notifications are short messages that appear in the top-right corner of the page and are automatically hidden after a certain amount of time \u2013 they provide live notifications, without interrupting the user experience or requiring an action to be taken."}),`
`,(0,n.jsx)(c.h4,{children:"Do's"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsxs)(c.li,{children:["Use this component using ",(0,n.jsx)(c.code,{children:"AppEvents"})," and ",(0,n.jsx)(c.code,{children:"getAppEvents()"}),"."]}),`
`,(0,n.jsxs)(c.li,{children:["Show the ",(0,n.jsx)(c.code,{children:"Toast"})," publishing the ",(0,n.jsx)(c.code,{children:"appEvent"})," with the proper type and payload needed."]}),`
`]}),`
`,(0,n.jsx)(c.pre,{children:(0,n.jsx)(c.code,{className:"language-jsx",children:`import { AppEvents } from '@grafana/data';
import { getAppEvents } from '@grafana/runtime';

const appEvents = getAppEvents();
appEvents.publish({
  type: AppEvents.alertSuccess.name,
  payload: [text + ': ' + resp.status + ' (' + resp.statusText + ')'],
});
`})}),`
`,(0,n.jsx)(c.h4,{children:"Don'ts"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsxs)(c.li,{children:["Do not use this component directly. Instead, emit the ",(0,n.jsx)(c.code,{children:"appEvent"})," to trigger it's appearance."]}),`
`]}),`
`,(0,n.jsx)(c.h4,{children:"When to use"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"To convey general confirmation or non-critical actions."}),`
`,(0,n.jsx)(c.li,{children:"Immediately after an event is taken, such as a permission is updated or some Dashboards are imported or deleted."}),`
`,(0,n.jsxs)(c.li,{children:["Status according to use cases:",`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.em,{children:"Success"}),": When any action is successful, it is confirmed when a task is completed as expected."]}),`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.em,{children:"Warning"}),": It is used to report a current status that users should be aware of or that could have serious consequences."]}),`
`,(0,n.jsxs)(c.li,{children:[(0,n.jsx)(c.em,{children:"Error"}),": Inform users of an error, and sometimes provide more information about how to fix the error."]}),`
`]}),`
`]}),`
`]}),`
`,(0,n.jsx)(c.h4,{children:"Placement"}),`
`,(0,n.jsxs)(c.ul,{children:[`
`,(0,n.jsx)(c.li,{children:"Slide in and out from the top right corner of the page."}),`
`]}),`
`,(0,n.jsx)(c.pre,{children:(0,n.jsx)(c.code,{className:"language-jsx",children:`<Alert title={title} severity={severity} onRemove={onRemove} elevated>
  <VerticalGroup>
    <div>Child content that includes some alert details, like maybe what actually happened.</div>
  </VerticalGroup>
</Alert>
`})}),`
`,(0,n.jsx)(l.$4,{of:f.b})]})}function d(i={}){const{wrapper:c}=Object.assign({},(0,a.ah)(),i.components);return c?(0,n.jsx)(c,Object.assign({},i,{children:(0,n.jsx)(x,i)})):x(i)}V.Z=d},"./src/components/ColorPicker/ColorPicker.mdx":function(se,V,e){"use strict";var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),a=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),l=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),f=e("./src/components/ColorPicker/ColorPicker.tsx");function x(i){const c=Object.assign({h1:"h1",p:"p",code:"code",h2:"h2"},(0,a.ah)(),i.components);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(l.h_,{title:"Pickers and Editors/ColorPicker/ColorPicker"}),`
`,(0,n.jsx)(c.h1,{children:"ColorPicker"}),`
`,(0,n.jsxs)(c.p,{children:["The ",(0,n.jsx)(c.code,{children:"ColorPicker"})," component group consists of several building blocks that are combined in Grafana to create the ",(0,n.jsx)(c.code,{children:"ColorPicker"}),": popover, pickers and palettes. There are different combinations of these building blocks depending on where the ",(0,n.jsx)(c.code,{children:"ColorPicker"})," is used in Grafana."]}),`
`,(0,n.jsxs)(c.p,{children:["The ",(0,n.jsx)(c.code,{children:"Popover"})," is a tabbed view where you can switch between ",(0,n.jsx)(c.code,{children:"Palettes"}),". The ",(0,n.jsx)(c.code,{children:"NamedColorsPalette"})," shows an arrangement of preset colors, while the ",(0,n.jsx)(c.code,{children:"SpectrumPalette"})," is an unlimited HSB color picker. The preset colors are optimized to work well with both light and dark theme. ",(0,n.jsx)(c.code,{children:"Popover"})," is triggered, for example, by the series legend of graphs, or by ",(0,n.jsx)(c.code,{children:"Pickers"}),"."]}),`
`,(0,n.jsxs)(c.p,{children:["The ",(0,n.jsx)(c.code,{children:"Pickers"})," are single circular color fields that show the currently picked color. On click, they open the ",(0,n.jsx)(c.code,{children:"Popover"}),"."]}),`
`,(0,n.jsx)(c.h2,{children:"ColorPickerInput"}),`
`,(0,n.jsx)(c.p,{children:"Color picker component, modified to be used inside forms. Supports all usual input props. Allows manually typing in color value as well as selecting it from the popover."}),`
`,(0,n.jsxs)(c.p,{children:["The format in which the color is returned to the ",(0,n.jsx)(c.code,{children:"onChange"})," callback can be customised via ",(0,n.jsx)(c.code,{children:"returnColorAs"})," prop."]}),`
`,(0,n.jsx)(l.xP,{of:f.zH})]})}function d(i={}){const{wrapper:c}=Object.assign({},(0,a.ah)(),i.components);return c?(0,n.jsx)(c,Object.assign({},i,{children:(0,n.jsx)(x,i)})):x(i)}V.Z=d},"../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!./.storybook/grafana.dark.scss":function(se,V,e){"use strict";var t=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/runtime/noSourceMaps.js"),n=e.n(t),a=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/runtime/api.js"),l=e.n(a),f=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!../../.yarn/__virtual__/rc-drawer-virtual-5d31b5508a/2/yarn/cache/rc-drawer-npm-6.1.3-ecc7753ecb-09fa308531.zip/node_modules/rc-drawer/assets/index.css"),x=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!../../.yarn/__virtual__/rc-time-picker-virtual-915362c357/2/yarn/cache/rc-time-picker-npm-3.7.3-0eb473aed2-9069ae590f.zip/node_modules/rc-time-picker/assets/index.css"),d=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!../../.yarn/__virtual__/rc-slider-virtual-872a602656/2/yarn/cache/rc-slider-npm-10.1.1-badf105b39-8df66142f1.zip/node_modules/rc-slider/assets/index.css"),i=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!../../../yarn/cache/uplot-npm-1.6.24-51171f5ab7-253e389dc6.zip/node_modules/uplot/dist/uPlot.min.css"),c=l()(n());c.i(f.Z),c.i(x.Z),c.i(d.Z),c.i(i.Z),c.push([se.id,`.hide-text{font:0/0 a;color:rgba(0,0,0,0);text-shadow:none;background-color:rgba(0,0,0,0);border:0}.input-block-level{display:block;width:100%;min-height:18px;box-sizing:border-box}.animate-height{max-height:0;overflow:hidden}.animate-height--open{max-height:1000px;overflow:auto;transition:max-height 250ms ease-in-out}@keyframes spin-clockwise{0%{transform:rotate(0deg) scaleX(-1)}100%{transform:rotate(359deg) scaleX(-1)}}.spin-clockwise{animation:spin-clockwise 3s infinite linear}/*! normalize.css commit fe56763 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:rgba(0,0,0,0)}a:active{outline:0}a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}@-ms-viewport{width:device-width}[tabindex="-1"]:focus{outline:none !important}html{font-size:14px;height:100%}body{font-family:"Inter","Helvetica","Arial",sans-serif;font-size:14px;line-height:1.5714285714;color:#ccccdc;background-color:#111217;height:100%;width:100%;position:absolute}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:8px}p{margin-top:0;margin-bottom:16px}abbr[title]{cursor:help;border-bottom:1px dotted #8e8e8e}address{margin-bottom:16px;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:0}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:500}dd{margin-bottom:8px;margin-left:0}blockquote{margin:0 0 16px}pre{margin-top:0;margin-bottom:16px}figure{margin:0 0 16px}img{vertical-align:middle}[role=button]{cursor:pointer}a,area,button,[role=button],input,label,select,summary,textarea{touch-action:manipulation}table{background-color:rgba(0,0,0,0)}caption{padding-top:4px 8px;padding-bottom:4px 8px;color:rgba(204,204,220,.65);text-align:left;caption-side:bottom}th{text-align:left}label{display:inline-block}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}input,button,select,textarea{margin:0;line-height:inherit;border-radius:0}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;padding:0;margin-bottom:8px;font-size:24px;line-height:inherit}input[type=search]{-webkit-appearance:none}output{display:inline-block}[hidden]{display:none !important}hr{margin-top:16px;margin-bottom:16px;border:0;border-top:1px solid #343436}small,.small{font-size:12px;font-weight:normal}.small-xs{font-size:10px}mark,.mark{background:#f5b73d}h1,h2,h3,h4,h5,h6{font-weight:500}ul,ol{padding:0}ul ul,ul ol,ol ol,ol ul{margin-bottom:0}li{line-height:1.5714285714}ul.unstyled,ol.unstyled{margin-left:0;list-style:none}ul.inline,ol.inline{margin-left:0;list-style:none}ul.inline>li,ol.inline>li{display:inline-block;padding-left:5px;padding-right:5px}dl{margin-bottom:1.5714285714}dt,dd{line-height:1.5714285714}dt{font-weight:500}dd{margin-left:.7857142857}.dl-horizontal::after{content:"";display:table;clear:both}.dl-horizontal dt{float:left;width:160px;clear:left;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dl-horizontal dd{margin-left:180px}abbr[title]{cursor:help;border-bottom:1px dotted #8e8e8e}abbr.initialism{font-size:90%;text-transform:uppercase}blockquote{padding:0 0 0 15px;margin:0 0 1.5714285714;border-left:5px solid #b3b3b3}blockquote p{margin-bottom:0;font-size:17.5px;font-weight:300;line-height:1.25}blockquote small{display:block;line-height:1.5714285714;color:#8e8e8e}blockquote small:before{content:"\u2014\xA0"}blockquote.pull-right{float:right;padding-right:15px;padding-left:0;border-right:5px solid #b3b3b3;border-left:0}blockquote.pull-right p,blockquote.pull-right small{text-align:right}blockquote.pull-right small:before{content:""}blockquote.pull-right small:after{content:"\xA0\u2014"}q:before,q:after,blockquote:before,blockquote:after{content:""}address{display:block;margin-bottom:1.5714285714;font-style:normal;line-height:1.5714285714}a.external-link,.grafana-info-box a{color:#6e9fff;text-decoration:normal}a.external-link:hover,.grafana-info-box a:hover{color:#6e9fff;text-decoration:underline}.link{color:#ccccdc;cursor:pointer}.link:hover{color:#fff}.pointer{cursor:pointer}.markdown-html img{max-width:100%}.markdown-html ul,.markdown-html ol{padding-left:24px;margin-bottom:16px}.markdown-html table{margin-bottom:16px}.markdown-html table td,.markdown-html table th{padding:4px 8px}.markdown-html table th{font-weight:500;background:#22252b}.markdown-html table,.markdown-html th,.markdown-html td{border:1px solid rgba(204,204,220,.15);border-collapse:collapse}.markdown-html a{color:#6e9fff;text-decoration:none}.markdown-html a:hover{color:#6e9fff;text-decoration:underline}.markdown-html p:last-child{margin-bottom:0}.markdown-html table:last-child,.markdown-html ul:last-child,.markdown-html ol:last-child{margin-bottom:0}.no-wrap{white-space:nowrap}th{font-weight:500}canvas{display:block}select,input[type=file]{height:32px;line-height:32px}select{width:220px;border:1px solid rgba(204,204,220,.15);background-color:#111217}select[multiple],select[size]{height:auto}select:focus,input[type=file]:focus,input[type=radio]:focus,input[type=checkbox]:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input::placeholder,textarea::placeholder{color:rgba(204,204,220,.6)}.input-mini{width:60px}.input-small{width:90px}.input-medium{width:150px}.input-large{width:210px}.input-xlarge{width:270px}.input-xxlarge{width:530px}input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{cursor:not-allowed;background-color:rgba(204,204,220,.04)}input[type=radio][disabled],input[type=checkbox][disabled],input[type=radio][readonly],input[type=checkbox][readonly]{cursor:not-allowed;background-color:rgba(0,0,0,0)}input[type=text].input-fluid{width:100%;box-sizing:border-box;padding:10px;font-size:16px;-moz-box-sizing:border-box;height:100%}input[type=checkbox].cr1{display:none}.editor-option label.cr1{display:inline-block;margin:5px 0 1px 0}label.cr1{display:inline-block;height:18px;position:relative;clear:none;text-indent:2px;margin:0 0 0px 0;padding:0 0 0 20px;vertical-align:top;background:url("../img/checkbox.png") left top no-repeat;cursor:pointer}input[type=checkbox].cr1:checked+label{background:url("../img/checkbox.png") 0px -18px no-repeat}.gf-fluid-input{border:none;display:block;overflow:hidden;padding-right:10px}.gf-fluid-input input[type=text]{width:100%;padding:5px 6px;height:100%;box-sizing:border-box}.gf-fluid-input textarea{width:100%;padding:5px 6px;height:100%;box-sizing:border-box}.form-control-success,.form-control-warning,.form-control-danger{padding-right:32px;background-repeat:no-repeat;background-position:center right 8px;background-size:16px 16px}.has-success .text-help,.has-success .form-control-label,.has-success .radio,.has-success .checkbox,.has-success .radio-inline,.has-success .checkbox-inline,.has-success.radio label,.has-success.checkbox label,.has-success.radio-inline label,.has-success.checkbox-inline label,.has-success .custom-control{color:#1a7f4b}.has-success .form-control{border-color:#1a7f4b}.has-success .input-group-addon{color:#1a7f4b;border-color:#1a7f4b;background-color:#80e5b1}.has-success .form-control-feedback{color:#1a7f4b}.has-success .form-control-success{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E")}.has-warning .text-help,.has-warning .form-control-label,.has-warning .radio,.has-warning .checkbox,.has-warning .radio-inline,.has-warning .checkbox-inline,.has-warning.radio label,.has-warning.checkbox label,.has-warning.radio-inline label,.has-warning.checkbox-inline label,.has-warning .custom-control{color:#f5b73d}.has-warning .form-control{border-color:#f5b73d}.has-warning .input-group-addon{color:#f5b73d;border-color:#f5b73d;background-color:#fff}.has-warning .form-control-feedback{color:#f5b73d}.has-warning .form-control-warning{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f0ad4e' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E")}.has-danger .text-help,.has-danger .form-control-label,.has-danger .radio,.has-danger .checkbox,.has-danger .radio-inline,.has-danger .checkbox-inline,.has-danger.radio label,.has-danger.checkbox label,.has-danger.radio-inline label,.has-danger.checkbox-inline label,.has-danger .custom-control{color:#d10e5c}.has-danger .form-control{border-color:#d10e5c}.has-danger .input-group-addon{color:#d10e5c;border-color:#d10e5c;background-color:#fab1ce}.has-danger .form-control-feedback{color:#d10e5c}.has-danger .form-control-danger{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E")}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-box-shadow:0 0 0px 1000px #111217 inset !important;-webkit-text-fill-color:#ccccdc !important;box-shadow:0 0 0px 1000px #111217 inset;border:1px solid #111217}.container{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px}@media(min-width: 544px){.container{max-width:576px}}@media(min-width: 769px){.container{max-width:720px}}@media(min-width: 992px){.container{max-width:940px}}@media(min-width: 1200px){.container{max-width:1080px}}.container-fluid{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px}.row{display:flex;flex-wrap:wrap;margin-left:-16px;margin-right:-16px}@media(min-width: 0px){.col-xs{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-xs-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-xs-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-xs-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-xs-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-xs-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-xs-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-xs-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-xs-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-xs-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-xs-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-xs-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-xs-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-xs-0{right:auto}.pull-xs-1{right:8.3333333333%}.pull-xs-2{right:16.6666666667%}.pull-xs-3{right:25%}.pull-xs-4{right:33.3333333333%}.pull-xs-5{right:41.6666666667%}.pull-xs-6{right:50%}.pull-xs-7{right:58.3333333333%}.pull-xs-8{right:66.6666666667%}.pull-xs-9{right:75%}.pull-xs-10{right:83.3333333333%}.pull-xs-11{right:91.6666666667%}.pull-xs-12{right:100%}.push-xs-0{left:auto}.push-xs-1{left:8.3333333333%}.push-xs-2{left:16.6666666667%}.push-xs-3{left:25%}.push-xs-4{left:33.3333333333%}.push-xs-5{left:41.6666666667%}.push-xs-6{left:50%}.push-xs-7{left:58.3333333333%}.push-xs-8{left:66.6666666667%}.push-xs-9{left:75%}.push-xs-10{left:83.3333333333%}.push-xs-11{left:91.6666666667%}.push-xs-12{left:100%}.offset-xs-1{margin-left:8.3333333333%}.offset-xs-2{margin-left:16.6666666667%}.offset-xs-3{margin-left:25%}.offset-xs-4{margin-left:33.3333333333%}.offset-xs-5{margin-left:41.6666666667%}.offset-xs-6{margin-left:50%}.offset-xs-7{margin-left:58.3333333333%}.offset-xs-8{margin-left:66.6666666667%}.offset-xs-9{margin-left:75%}.offset-xs-10{margin-left:83.3333333333%}.offset-xs-11{margin-left:91.6666666667%}}@media(min-width: 544px){.col-sm{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-sm-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-sm-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-sm-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-sm-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-sm-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-sm-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-sm-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-sm-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-sm-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-sm-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-sm-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-sm-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-sm-0{right:auto}.pull-sm-1{right:8.3333333333%}.pull-sm-2{right:16.6666666667%}.pull-sm-3{right:25%}.pull-sm-4{right:33.3333333333%}.pull-sm-5{right:41.6666666667%}.pull-sm-6{right:50%}.pull-sm-7{right:58.3333333333%}.pull-sm-8{right:66.6666666667%}.pull-sm-9{right:75%}.pull-sm-10{right:83.3333333333%}.pull-sm-11{right:91.6666666667%}.pull-sm-12{right:100%}.push-sm-0{left:auto}.push-sm-1{left:8.3333333333%}.push-sm-2{left:16.6666666667%}.push-sm-3{left:25%}.push-sm-4{left:33.3333333333%}.push-sm-5{left:41.6666666667%}.push-sm-6{left:50%}.push-sm-7{left:58.3333333333%}.push-sm-8{left:66.6666666667%}.push-sm-9{left:75%}.push-sm-10{left:83.3333333333%}.push-sm-11{left:91.6666666667%}.push-sm-12{left:100%}.offset-sm-0{margin-left:0%}.offset-sm-1{margin-left:8.3333333333%}.offset-sm-2{margin-left:16.6666666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.3333333333%}.offset-sm-5{margin-left:41.6666666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.3333333333%}.offset-sm-8{margin-left:66.6666666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.3333333333%}.offset-sm-11{margin-left:91.6666666667%}}@media(min-width: 769px){.col-md{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-md-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-md-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-md-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-md-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-md-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-md-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-md-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-md-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-md-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-md-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-md-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-md-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-md-0{right:auto}.pull-md-1{right:8.3333333333%}.pull-md-2{right:16.6666666667%}.pull-md-3{right:25%}.pull-md-4{right:33.3333333333%}.pull-md-5{right:41.6666666667%}.pull-md-6{right:50%}.pull-md-7{right:58.3333333333%}.pull-md-8{right:66.6666666667%}.pull-md-9{right:75%}.pull-md-10{right:83.3333333333%}.pull-md-11{right:91.6666666667%}.pull-md-12{right:100%}.push-md-0{left:auto}.push-md-1{left:8.3333333333%}.push-md-2{left:16.6666666667%}.push-md-3{left:25%}.push-md-4{left:33.3333333333%}.push-md-5{left:41.6666666667%}.push-md-6{left:50%}.push-md-7{left:58.3333333333%}.push-md-8{left:66.6666666667%}.push-md-9{left:75%}.push-md-10{left:83.3333333333%}.push-md-11{left:91.6666666667%}.push-md-12{left:100%}.offset-md-0{margin-left:0%}.offset-md-1{margin-left:8.3333333333%}.offset-md-2{margin-left:16.6666666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.3333333333%}.offset-md-5{margin-left:41.6666666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.3333333333%}.offset-md-8{margin-left:66.6666666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.3333333333%}.offset-md-11{margin-left:91.6666666667%}}@media(min-width: 992px){.col-lg{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-lg-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-lg-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-lg-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-lg-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-lg-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-lg-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-lg-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-lg-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-lg-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-lg-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-lg-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-lg-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-lg-0{right:auto}.pull-lg-1{right:8.3333333333%}.pull-lg-2{right:16.6666666667%}.pull-lg-3{right:25%}.pull-lg-4{right:33.3333333333%}.pull-lg-5{right:41.6666666667%}.pull-lg-6{right:50%}.pull-lg-7{right:58.3333333333%}.pull-lg-8{right:66.6666666667%}.pull-lg-9{right:75%}.pull-lg-10{right:83.3333333333%}.pull-lg-11{right:91.6666666667%}.pull-lg-12{right:100%}.push-lg-0{left:auto}.push-lg-1{left:8.3333333333%}.push-lg-2{left:16.6666666667%}.push-lg-3{left:25%}.push-lg-4{left:33.3333333333%}.push-lg-5{left:41.6666666667%}.push-lg-6{left:50%}.push-lg-7{left:58.3333333333%}.push-lg-8{left:66.6666666667%}.push-lg-9{left:75%}.push-lg-10{left:83.3333333333%}.push-lg-11{left:91.6666666667%}.push-lg-12{left:100%}.offset-lg-0{margin-left:0%}.offset-lg-1{margin-left:8.3333333333%}.offset-lg-2{margin-left:16.6666666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.3333333333%}.offset-lg-5{margin-left:41.6666666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.3333333333%}.offset-lg-8{margin-left:66.6666666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.3333333333%}.offset-lg-11{margin-left:91.6666666667%}}@media(min-width: 1200px){.col-xl{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-xl-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-xl-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-xl-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-xl-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-xl-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-xl-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-xl-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-xl-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-xl-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-xl-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-xl-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-xl-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-xl-0{right:auto}.pull-xl-1{right:8.3333333333%}.pull-xl-2{right:16.6666666667%}.pull-xl-3{right:25%}.pull-xl-4{right:33.3333333333%}.pull-xl-5{right:41.6666666667%}.pull-xl-6{right:50%}.pull-xl-7{right:58.3333333333%}.pull-xl-8{right:66.6666666667%}.pull-xl-9{right:75%}.pull-xl-10{right:83.3333333333%}.pull-xl-11{right:91.6666666667%}.pull-xl-12{right:100%}.push-xl-0{left:auto}.push-xl-1{left:8.3333333333%}.push-xl-2{left:16.6666666667%}.push-xl-3{left:25%}.push-xl-4{left:33.3333333333%}.push-xl-5{left:41.6666666667%}.push-xl-6{left:50%}.push-xl-7{left:58.3333333333%}.push-xl-8{left:66.6666666667%}.push-xl-9{left:75%}.push-xl-10{left:83.3333333333%}.push-xl-11{left:91.6666666667%}.push-xl-12{left:100%}.offset-xl-0{margin-left:0%}.offset-xl-1{margin-left:8.3333333333%}.offset-xl-2{margin-left:16.6666666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.3333333333%}.offset-xl-5{margin-left:41.6666666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.3333333333%}.offset-xl-8{margin-left:66.6666666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.3333333333%}.offset-xl-11{margin-left:91.6666666667%}}/*!
 *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */@font-face{font-family:"FontAwesome";src:url("./public/fonts/fontawesome-webfont.eot?v=4.7.0");src:url("./public/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"),url("./public/fonts/fontawesome-webfont.woff2?v=4.7.0") format("woff2"),url("./public/fonts/fontawesome-webfont.woff?v=4.7.0") format("woff"),url("./public/fonts/fontawesome-webfont.ttf?v=4.7.0") format("truetype"),url("./public/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.3333333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em !important}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.2857142857em;text-align:center}.fa-ul{padding-left:0;margin-left:2.1428571429em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.1428571429em;width:2.1428571429em;top:.1428571429em;text-align:center}.fa-li.fa-lg{left:-1.8571428571em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\uF000"}.fa-music:before{content:"\uF001"}.fa-search:before{content:"\uF002"}.fa-envelope-o:before{content:"\uF003"}.fa-heart:before{content:"\uF004"}.fa-star:before{content:"\uF005"}.fa-star-o:before{content:"\uF006"}.fa-user:before{content:"\uF007"}.fa-film:before{content:"\uF008"}.fa-th-large:before{content:"\uF009"}.fa-th:before{content:"\uF00A"}.fa-th-list:before{content:"\uF00B"}.fa-check:before{content:"\uF00C"}.fa-remove:before,.fa-close:before,.fa-times:before{content:"\uF00D"}.fa-search-plus:before{content:"\uF00E"}.fa-search-minus:before{content:"\uF010"}.fa-power-off:before{content:"\uF011"}.fa-signal:before{content:"\uF012"}.fa-gear:before,.fa-cog:before{content:"\uF013"}.fa-trash-o:before{content:"\uF014"}.fa-home:before{content:"\uF015"}.fa-file-o:before{content:"\uF016"}.fa-clock-o:before{content:"\uF017"}.fa-road:before{content:"\uF018"}.fa-download:before{content:"\uF019"}.fa-arrow-circle-o-down:before{content:"\uF01A"}.fa-arrow-circle-o-up:before{content:"\uF01B"}.fa-inbox:before{content:"\uF01C"}.fa-play-circle-o:before{content:"\uF01D"}.fa-rotate-right:before,.fa-repeat:before{content:"\uF01E"}.fa-refresh:before{content:"\uF021"}.fa-list-alt:before{content:"\uF022"}.fa-lock:before{content:"\uF023"}.fa-flag:before{content:"\uF024"}.fa-headphones:before{content:"\uF025"}.fa-volume-off:before{content:"\uF026"}.fa-volume-down:before{content:"\uF027"}.fa-volume-up:before{content:"\uF028"}.fa-qrcode:before{content:"\uF029"}.fa-barcode:before{content:"\uF02A"}.fa-tag:before{content:"\uF02B"}.fa-tags:before{content:"\uF02C"}.fa-book:before{content:"\uF02D"}.fa-bookmark:before{content:"\uF02E"}.fa-print:before{content:"\uF02F"}.fa-camera:before{content:"\uF030"}.fa-font:before{content:"\uF031"}.fa-bold:before{content:"\uF032"}.fa-italic:before{content:"\uF033"}.fa-text-height:before{content:"\uF034"}.fa-text-width:before{content:"\uF035"}.fa-align-left:before{content:"\uF036"}.fa-align-center:before{content:"\uF037"}.fa-align-right:before{content:"\uF038"}.fa-align-justify:before{content:"\uF039"}.fa-list:before{content:"\uF03A"}.fa-dedent:before,.fa-outdent:before{content:"\uF03B"}.fa-indent:before{content:"\uF03C"}.fa-video-camera:before{content:"\uF03D"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\uF03E"}.fa-pencil:before{content:"\uF040"}.fa-map-marker:before{content:"\uF041"}.fa-adjust:before{content:"\uF042"}.fa-tint:before{content:"\uF043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\uF044"}.fa-share-square-o:before{content:"\uF045"}.fa-check-square-o:before{content:"\uF046"}.fa-arrows:before{content:"\uF047"}.fa-step-backward:before{content:"\uF048"}.fa-fast-backward:before{content:"\uF049"}.fa-backward:before{content:"\uF04A"}.fa-play:before{content:"\uF04B"}.fa-pause:before{content:"\uF04C"}.fa-stop:before{content:"\uF04D"}.fa-forward:before{content:"\uF04E"}.fa-fast-forward:before{content:"\uF050"}.fa-step-forward:before{content:"\uF051"}.fa-eject:before{content:"\uF052"}.fa-chevron-left:before{content:"\uF053"}.fa-chevron-right:before{content:"\uF054"}.fa-plus-circle:before{content:"\uF055"}.fa-minus-circle:before{content:"\uF056"}.fa-times-circle:before{content:"\uF057"}.fa-check-circle:before{content:"\uF058"}.fa-question-circle:before{content:"\uF059"}.fa-info-circle:before{content:"\uF05A"}.fa-crosshairs:before{content:"\uF05B"}.fa-times-circle-o:before{content:"\uF05C"}.fa-check-circle-o:before{content:"\uF05D"}.fa-ban:before{content:"\uF05E"}.fa-arrow-left:before{content:"\uF060"}.fa-arrow-right:before{content:"\uF061"}.fa-arrow-up:before{content:"\uF062"}.fa-arrow-down:before{content:"\uF063"}.fa-mail-forward:before,.fa-share:before{content:"\uF064"}.fa-expand:before{content:"\uF065"}.fa-compress:before{content:"\uF066"}.fa-plus:before{content:"\uF067"}.fa-minus:before{content:"\uF068"}.fa-asterisk:before{content:"\uF069"}.fa-exclamation-circle:before{content:"\uF06A"}.fa-gift:before{content:"\uF06B"}.fa-leaf:before{content:"\uF06C"}.fa-fire:before{content:"\uF06D"}.fa-eye:before{content:"\uF06E"}.fa-eye-slash:before{content:"\uF070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\uF071"}.fa-plane:before{content:"\uF072"}.fa-calendar:before{content:"\uF073"}.fa-random:before{content:"\uF074"}.fa-comment:before{content:"\uF075"}.fa-magnet:before{content:"\uF076"}.fa-chevron-up:before{content:"\uF077"}.fa-chevron-down:before{content:"\uF078"}.fa-retweet:before{content:"\uF079"}.fa-shopping-cart:before{content:"\uF07A"}.fa-folder:before{content:"\uF07B"}.fa-folder-open:before{content:"\uF07C"}.fa-arrows-v:before{content:"\uF07D"}.fa-arrows-h:before{content:"\uF07E"}.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\uF080"}.fa-twitter-square:before{content:"\uF081"}.fa-facebook-square:before{content:"\uF082"}.fa-camera-retro:before{content:"\uF083"}.fa-key:before{content:"\uF084"}.fa-gears:before,.fa-cogs:before{content:"\uF085"}.fa-comments:before{content:"\uF086"}.fa-thumbs-o-up:before{content:"\uF087"}.fa-thumbs-o-down:before{content:"\uF088"}.fa-star-half:before{content:"\uF089"}.fa-heart-o:before{content:"\uF08A"}.fa-sign-out:before{content:"\uF08B"}.fa-linkedin-square:before{content:"\uF08C"}.fa-thumb-tack:before{content:"\uF08D"}.fa-external-link:before{content:"\uF08E"}.fa-sign-in:before{content:"\uF090"}.fa-trophy:before{content:"\uF091"}.fa-github-square:before{content:"\uF092"}.fa-upload:before{content:"\uF093"}.fa-lemon-o:before{content:"\uF094"}.fa-phone:before{content:"\uF095"}.fa-square-o:before{content:"\uF096"}.fa-bookmark-o:before{content:"\uF097"}.fa-phone-square:before{content:"\uF098"}.fa-twitter:before{content:"\uF099"}.fa-facebook-f:before,.fa-facebook:before{content:"\uF09A"}.fa-github:before{content:"\uF09B"}.fa-unlock:before{content:"\uF09C"}.fa-credit-card:before{content:"\uF09D"}.fa-feed:before,.fa-rss:before{content:"\uF09E"}.fa-hdd-o:before{content:"\uF0A0"}.fa-bullhorn:before{content:"\uF0A1"}.fa-bell:before{content:"\uF0F3"}.fa-certificate:before{content:"\uF0A3"}.fa-hand-o-right:before{content:"\uF0A4"}.fa-hand-o-left:before{content:"\uF0A5"}.fa-hand-o-up:before{content:"\uF0A6"}.fa-hand-o-down:before{content:"\uF0A7"}.fa-arrow-circle-left:before{content:"\uF0A8"}.fa-arrow-circle-right:before{content:"\uF0A9"}.fa-arrow-circle-up:before{content:"\uF0AA"}.fa-arrow-circle-down:before{content:"\uF0AB"}.fa-globe:before{content:"\uF0AC"}.fa-wrench:before{content:"\uF0AD"}.fa-tasks:before{content:"\uF0AE"}.fa-filter:before{content:"\uF0B0"}.fa-briefcase:before{content:"\uF0B1"}.fa-arrows-alt:before{content:"\uF0B2"}.fa-group:before,.fa-users:before{content:"\uF0C0"}.fa-chain:before,.fa-link:before{content:"\uF0C1"}.fa-cloud:before{content:"\uF0C2"}.fa-flask:before{content:"\uF0C3"}.fa-cut:before,.fa-scissors:before{content:"\uF0C4"}.fa-copy:before,.fa-files-o:before{content:"\uF0C5"}.fa-paperclip:before{content:"\uF0C6"}.fa-save:before,.fa-floppy-o:before{content:"\uF0C7"}.fa-square:before{content:"\uF0C8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\uF0C9"}.fa-list-ul:before{content:"\uF0CA"}.fa-list-ol:before{content:"\uF0CB"}.fa-strikethrough:before{content:"\uF0CC"}.fa-underline:before{content:"\uF0CD"}.fa-table:before{content:"\uF0CE"}.fa-magic:before{content:"\uF0D0"}.fa-truck:before{content:"\uF0D1"}.fa-pinterest:before{content:"\uF0D2"}.fa-pinterest-square:before{content:"\uF0D3"}.fa-google-plus-square:before{content:"\uF0D4"}.fa-google-plus:before{content:"\uF0D5"}.fa-money:before{content:"\uF0D6"}.fa-caret-down:before{content:"\uF0D7"}.fa-caret-up:before{content:"\uF0D8"}.fa-caret-left:before{content:"\uF0D9"}.fa-caret-right:before{content:"\uF0DA"}.fa-columns:before{content:"\uF0DB"}.fa-unsorted:before,.fa-sort:before{content:"\uF0DC"}.fa-sort-down:before,.fa-sort-desc:before{content:"\uF0DD"}.fa-sort-up:before,.fa-sort-asc:before{content:"\uF0DE"}.fa-envelope:before{content:"\uF0E0"}.fa-linkedin:before{content:"\uF0E1"}.fa-rotate-left:before,.fa-undo:before{content:"\uF0E2"}.fa-legal:before,.fa-gavel:before{content:"\uF0E3"}.fa-dashboard:before,.fa-tachometer:before{content:"\uF0E4"}.fa-comment-o:before{content:"\uF0E5"}.fa-comments-o:before{content:"\uF0E6"}.fa-flash:before,.fa-bolt:before{content:"\uF0E7"}.fa-sitemap:before{content:"\uF0E8"}.fa-umbrella:before{content:"\uF0E9"}.fa-paste:before,.fa-clipboard:before{content:"\uF0EA"}.fa-lightbulb-o:before{content:"\uF0EB"}.fa-exchange:before{content:"\uF0EC"}.fa-cloud-download:before{content:"\uF0ED"}.fa-cloud-upload:before{content:"\uF0EE"}.fa-user-md:before{content:"\uF0F0"}.fa-stethoscope:before{content:"\uF0F1"}.fa-suitcase:before{content:"\uF0F2"}.fa-bell-o:before{content:"\uF0A2"}.fa-coffee:before{content:"\uF0F4"}.fa-cutlery:before{content:"\uF0F5"}.fa-file-text-o:before{content:"\uF0F6"}.fa-building-o:before{content:"\uF0F7"}.fa-hospital-o:before{content:"\uF0F8"}.fa-ambulance:before{content:"\uF0F9"}.fa-medkit:before{content:"\uF0FA"}.fa-fighter-jet:before{content:"\uF0FB"}.fa-beer:before{content:"\uF0FC"}.fa-h-square:before{content:"\uF0FD"}.fa-plus-square:before{content:"\uF0FE"}.fa-angle-double-left:before{content:"\uF100"}.fa-angle-double-right:before{content:"\uF101"}.fa-angle-double-up:before{content:"\uF102"}.fa-angle-double-down:before{content:"\uF103"}.fa-angle-left:before{content:"\uF104"}.fa-angle-right:before{content:"\uF105"}.fa-angle-up:before{content:"\uF106"}.fa-angle-down:before{content:"\uF107"}.fa-desktop:before{content:"\uF108"}.fa-laptop:before{content:"\uF109"}.fa-tablet:before{content:"\uF10A"}.fa-mobile-phone:before,.fa-mobile:before{content:"\uF10B"}.fa-circle-o:before{content:"\uF10C"}.fa-quote-left:before{content:"\uF10D"}.fa-quote-right:before{content:"\uF10E"}.fa-spinner:before{content:"\uF110"}.fa-circle:before{content:"\uF111"}.fa-mail-reply:before,.fa-reply:before{content:"\uF112"}.fa-github-alt:before{content:"\uF113"}.fa-folder-o:before{content:"\uF114"}.fa-folder-open-o:before{content:"\uF115"}.fa-smile-o:before{content:"\uF118"}.fa-frown-o:before{content:"\uF119"}.fa-meh-o:before{content:"\uF11A"}.fa-gamepad:before{content:"\uF11B"}.fa-keyboard-o:before{content:"\uF11C"}.fa-flag-o:before{content:"\uF11D"}.fa-flag-checkered:before{content:"\uF11E"}.fa-terminal:before{content:"\uF120"}.fa-code:before{content:"\uF121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\uF122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\uF123"}.fa-location-arrow:before{content:"\uF124"}.fa-crop:before{content:"\uF125"}.fa-code-fork:before{content:"\uF126"}.fa-unlink:before,.fa-chain-broken:before{content:"\uF127"}.fa-question:before{content:"\uF128"}.fa-info:before{content:"\uF129"}.fa-exclamation:before{content:"\uF12A"}.fa-superscript:before{content:"\uF12B"}.fa-subscript:before{content:"\uF12C"}.fa-eraser:before{content:"\uF12D"}.fa-puzzle-piece:before{content:"\uF12E"}.fa-microphone:before{content:"\uF130"}.fa-microphone-slash:before{content:"\uF131"}.fa-shield:before{content:"\uF132"}.fa-calendar-o:before{content:"\uF133"}.fa-fire-extinguisher:before{content:"\uF134"}.fa-rocket:before{content:"\uF135"}.fa-maxcdn:before{content:"\uF136"}.fa-chevron-circle-left:before{content:"\uF137"}.fa-chevron-circle-right:before{content:"\uF138"}.fa-chevron-circle-up:before{content:"\uF139"}.fa-chevron-circle-down:before{content:"\uF13A"}.fa-html5:before{content:"\uF13B"}.fa-css3:before{content:"\uF13C"}.fa-anchor:before{content:"\uF13D"}.fa-unlock-alt:before{content:"\uF13E"}.fa-bullseye:before{content:"\uF140"}.fa-ellipsis-h:before{content:"\uF141"}.fa-ellipsis-v:before{content:"\uF142"}.fa-rss-square:before{content:"\uF143"}.fa-play-circle:before{content:"\uF144"}.fa-ticket:before{content:"\uF145"}.fa-minus-square:before{content:"\uF146"}.fa-minus-square-o:before{content:"\uF147"}.fa-level-up:before{content:"\uF148"}.fa-level-down:before{content:"\uF149"}.fa-check-square:before{content:"\uF14A"}.fa-pencil-square:before{content:"\uF14B"}.fa-external-link-square:before{content:"\uF14C"}.fa-share-square:before{content:"\uF14D"}.fa-compass:before{content:"\uF14E"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\uF150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\uF151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\uF152"}.fa-euro:before,.fa-eur:before{content:"\uF153"}.fa-gbp:before{content:"\uF154"}.fa-dollar:before,.fa-usd:before{content:"\uF155"}.fa-rupee:before,.fa-inr:before{content:"\uF156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\uF157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\uF158"}.fa-won:before,.fa-krw:before{content:"\uF159"}.fa-bitcoin:before,.fa-btc:before{content:"\uF15A"}.fa-file:before{content:"\uF15B"}.fa-file-text:before{content:"\uF15C"}.fa-sort-alpha-asc:before{content:"\uF15D"}.fa-sort-alpha-desc:before{content:"\uF15E"}.fa-sort-amount-asc:before{content:"\uF160"}.fa-sort-amount-desc:before{content:"\uF161"}.fa-sort-numeric-asc:before{content:"\uF162"}.fa-sort-numeric-desc:before{content:"\uF163"}.fa-thumbs-up:before{content:"\uF164"}.fa-thumbs-down:before{content:"\uF165"}.fa-youtube-square:before{content:"\uF166"}.fa-youtube:before{content:"\uF167"}.fa-xing:before{content:"\uF168"}.fa-xing-square:before{content:"\uF169"}.fa-youtube-play:before{content:"\uF16A"}.fa-dropbox:before{content:"\uF16B"}.fa-stack-overflow:before{content:"\uF16C"}.fa-instagram:before{content:"\uF16D"}.fa-flickr:before{content:"\uF16E"}.fa-adn:before{content:"\uF170"}.fa-bitbucket:before{content:"\uF171"}.fa-bitbucket-square:before{content:"\uF172"}.fa-tumblr:before{content:"\uF173"}.fa-tumblr-square:before{content:"\uF174"}.fa-long-arrow-down:before{content:"\uF175"}.fa-long-arrow-up:before{content:"\uF176"}.fa-long-arrow-left:before{content:"\uF177"}.fa-long-arrow-right:before{content:"\uF178"}.fa-apple:before{content:"\uF179"}.fa-windows:before{content:"\uF17A"}.fa-android:before{content:"\uF17B"}.fa-linux:before{content:"\uF17C"}.fa-dribbble:before{content:"\uF17D"}.fa-skype:before{content:"\uF17E"}.fa-foursquare:before{content:"\uF180"}.fa-trello:before{content:"\uF181"}.fa-female:before{content:"\uF182"}.fa-male:before{content:"\uF183"}.fa-gittip:before,.fa-gratipay:before{content:"\uF184"}.fa-sun-o:before{content:"\uF185"}.fa-moon-o:before{content:"\uF186"}.fa-archive:before{content:"\uF187"}.fa-bug:before{content:"\uF188"}.fa-vk:before{content:"\uF189"}.fa-weibo:before{content:"\uF18A"}.fa-renren:before{content:"\uF18B"}.fa-pagelines:before{content:"\uF18C"}.fa-stack-exchange:before{content:"\uF18D"}.fa-arrow-circle-o-right:before{content:"\uF18E"}.fa-arrow-circle-o-left:before{content:"\uF190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\uF191"}.fa-dot-circle-o:before{content:"\uF192"}.fa-wheelchair:before{content:"\uF193"}.fa-vimeo-square:before{content:"\uF194"}.fa-turkish-lira:before,.fa-try:before{content:"\uF195"}.fa-plus-square-o:before{content:"\uF196"}.fa-space-shuttle:before{content:"\uF197"}.fa-slack:before{content:"\uF198"}.fa-envelope-square:before{content:"\uF199"}.fa-wordpress:before{content:"\uF19A"}.fa-openid:before{content:"\uF19B"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\uF19C"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\uF19D"}.fa-yahoo:before{content:"\uF19E"}.fa-google:before{content:"\uF1A0"}.fa-reddit:before{content:"\uF1A1"}.fa-reddit-square:before{content:"\uF1A2"}.fa-stumbleupon-circle:before{content:"\uF1A3"}.fa-stumbleupon:before{content:"\uF1A4"}.fa-delicious:before{content:"\uF1A5"}.fa-digg:before{content:"\uF1A6"}.fa-pied-piper-pp:before{content:"\uF1A7"}.fa-pied-piper-alt:before{content:"\uF1A8"}.fa-drupal:before{content:"\uF1A9"}.fa-joomla:before{content:"\uF1AA"}.fa-language:before{content:"\uF1AB"}.fa-fax:before{content:"\uF1AC"}.fa-building:before{content:"\uF1AD"}.fa-child:before{content:"\uF1AE"}.fa-paw:before{content:"\uF1B0"}.fa-spoon:before{content:"\uF1B1"}.fa-cube:before{content:"\uF1B2"}.fa-cubes:before{content:"\uF1B3"}.fa-behance:before{content:"\uF1B4"}.fa-behance-square:before{content:"\uF1B5"}.fa-steam:before{content:"\uF1B6"}.fa-steam-square:before{content:"\uF1B7"}.fa-recycle:before{content:"\uF1B8"}.fa-automobile:before,.fa-car:before{content:"\uF1B9"}.fa-cab:before,.fa-taxi:before{content:"\uF1BA"}.fa-tree:before{content:"\uF1BB"}.fa-spotify:before{content:"\uF1BC"}.fa-deviantart:before{content:"\uF1BD"}.fa-soundcloud:before{content:"\uF1BE"}.fa-database:before{content:"\uF1C0"}.fa-file-pdf-o:before{content:"\uF1C1"}.fa-file-word-o:before{content:"\uF1C2"}.fa-file-excel-o:before{content:"\uF1C3"}.fa-file-powerpoint-o:before{content:"\uF1C4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\uF1C5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\uF1C6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\uF1C7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\uF1C8"}.fa-file-code-o:before{content:"\uF1C9"}.fa-vine:before{content:"\uF1CA"}.fa-codepen:before{content:"\uF1CB"}.fa-jsfiddle:before{content:"\uF1CC"}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\uF1CD"}.fa-circle-o-notch:before{content:"\uF1CE"}.fa-ra:before,.fa-resistance:before,.fa-rebel:before{content:"\uF1D0"}.fa-ge:before,.fa-empire:before{content:"\uF1D1"}.fa-git-square:before{content:"\uF1D2"}.fa-git:before{content:"\uF1D3"}.fa-y-combinator-square:before,.fa-yc-square:before,.fa-hacker-news:before{content:"\uF1D4"}.fa-tencent-weibo:before{content:"\uF1D5"}.fa-qq:before{content:"\uF1D6"}.fa-wechat:before,.fa-weixin:before{content:"\uF1D7"}.fa-send:before,.fa-paper-plane:before{content:"\uF1D8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\uF1D9"}.fa-history:before{content:"\uF1DA"}.fa-circle-thin:before{content:"\uF1DB"}.fa-header:before{content:"\uF1DC"}.fa-paragraph:before{content:"\uF1DD"}.fa-sliders:before{content:"\uF1DE"}.fa-share-alt:before{content:"\uF1E0"}.fa-share-alt-square:before{content:"\uF1E1"}.fa-bomb:before{content:"\uF1E2"}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:"\uF1E3"}.fa-tty:before{content:"\uF1E4"}.fa-binoculars:before{content:"\uF1E5"}.fa-plug:before{content:"\uF1E6"}.fa-slideshare:before{content:"\uF1E7"}.fa-twitch:before{content:"\uF1E8"}.fa-yelp:before{content:"\uF1E9"}.fa-newspaper-o:before{content:"\uF1EA"}.fa-wifi:before{content:"\uF1EB"}.fa-calculator:before{content:"\uF1EC"}.fa-paypal:before{content:"\uF1ED"}.fa-google-wallet:before{content:"\uF1EE"}.fa-cc-visa:before{content:"\uF1F0"}.fa-cc-mastercard:before{content:"\uF1F1"}.fa-cc-discover:before{content:"\uF1F2"}.fa-cc-amex:before{content:"\uF1F3"}.fa-cc-paypal:before{content:"\uF1F4"}.fa-cc-stripe:before{content:"\uF1F5"}.fa-bell-slash:before{content:"\uF1F6"}.fa-bell-slash-o:before{content:"\uF1F7"}.fa-trash:before{content:"\uF1F8"}.fa-copyright:before{content:"\uF1F9"}.fa-at:before{content:"\uF1FA"}.fa-eyedropper:before{content:"\uF1FB"}.fa-paint-brush:before{content:"\uF1FC"}.fa-birthday-cake:before{content:"\uF1FD"}.fa-area-chart:before{content:"\uF1FE"}.fa-pie-chart:before{content:"\uF200"}.fa-line-chart:before{content:"\uF201"}.fa-lastfm:before{content:"\uF202"}.fa-lastfm-square:before{content:"\uF203"}.fa-toggle-off:before{content:"\uF204"}.fa-toggle-on:before{content:"\uF205"}.fa-bicycle:before{content:"\uF206"}.fa-bus:before{content:"\uF207"}.fa-ioxhost:before{content:"\uF208"}.fa-angellist:before{content:"\uF209"}.fa-cc:before{content:"\uF20A"}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:"\uF20B"}.fa-meanpath:before{content:"\uF20C"}.fa-buysellads:before{content:"\uF20D"}.fa-connectdevelop:before{content:"\uF20E"}.fa-dashcube:before{content:"\uF210"}.fa-forumbee:before{content:"\uF211"}.fa-leanpub:before{content:"\uF212"}.fa-sellsy:before{content:"\uF213"}.fa-shirtsinbulk:before{content:"\uF214"}.fa-simplybuilt:before{content:"\uF215"}.fa-skyatlas:before{content:"\uF216"}.fa-cart-plus:before{content:"\uF217"}.fa-cart-arrow-down:before{content:"\uF218"}.fa-diamond:before{content:"\uF219"}.fa-ship:before{content:"\uF21A"}.fa-user-secret:before{content:"\uF21B"}.fa-motorcycle:before{content:"\uF21C"}.fa-street-view:before{content:"\uF21D"}.fa-heartbeat:before{content:"\uF21E"}.fa-venus:before{content:"\uF221"}.fa-mars:before{content:"\uF222"}.fa-mercury:before{content:"\uF223"}.fa-intersex:before,.fa-transgender:before{content:"\uF224"}.fa-transgender-alt:before{content:"\uF225"}.fa-venus-double:before{content:"\uF226"}.fa-mars-double:before{content:"\uF227"}.fa-venus-mars:before{content:"\uF228"}.fa-mars-stroke:before{content:"\uF229"}.fa-mars-stroke-v:before{content:"\uF22A"}.fa-mars-stroke-h:before{content:"\uF22B"}.fa-neuter:before{content:"\uF22C"}.fa-genderless:before{content:"\uF22D"}.fa-facebook-official:before{content:"\uF230"}.fa-pinterest-p:before{content:"\uF231"}.fa-whatsapp:before{content:"\uF232"}.fa-server:before{content:"\uF233"}.fa-user-plus:before{content:"\uF234"}.fa-user-times:before{content:"\uF235"}.fa-hotel:before,.fa-bed:before{content:"\uF236"}.fa-viacoin:before{content:"\uF237"}.fa-train:before{content:"\uF238"}.fa-subway:before{content:"\uF239"}.fa-medium:before{content:"\uF23A"}.fa-yc:before,.fa-y-combinator:before{content:"\uF23B"}.fa-optin-monster:before{content:"\uF23C"}.fa-opencart:before{content:"\uF23D"}.fa-expeditedssl:before{content:"\uF23E"}.fa-battery-4:before,.fa-battery:before,.fa-battery-full:before{content:"\uF240"}.fa-battery-3:before,.fa-battery-three-quarters:before{content:"\uF241"}.fa-battery-2:before,.fa-battery-half:before{content:"\uF242"}.fa-battery-1:before,.fa-battery-quarter:before{content:"\uF243"}.fa-battery-0:before,.fa-battery-empty:before{content:"\uF244"}.fa-mouse-pointer:before{content:"\uF245"}.fa-i-cursor:before{content:"\uF246"}.fa-object-group:before{content:"\uF247"}.fa-object-ungroup:before{content:"\uF248"}.fa-sticky-note:before{content:"\uF249"}.fa-sticky-note-o:before{content:"\uF24A"}.fa-cc-jcb:before{content:"\uF24B"}.fa-cc-diners-club:before{content:"\uF24C"}.fa-clone:before{content:"\uF24D"}.fa-balance-scale:before{content:"\uF24E"}.fa-hourglass-o:before{content:"\uF250"}.fa-hourglass-1:before,.fa-hourglass-start:before{content:"\uF251"}.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\uF252"}.fa-hourglass-3:before,.fa-hourglass-end:before{content:"\uF253"}.fa-hourglass:before{content:"\uF254"}.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:"\uF255"}.fa-hand-stop-o:before,.fa-hand-paper-o:before{content:"\uF256"}.fa-hand-scissors-o:before{content:"\uF257"}.fa-hand-lizard-o:before{content:"\uF258"}.fa-hand-spock-o:before{content:"\uF259"}.fa-hand-pointer-o:before{content:"\uF25A"}.fa-hand-peace-o:before{content:"\uF25B"}.fa-trademark:before{content:"\uF25C"}.fa-registered:before{content:"\uF25D"}.fa-creative-commons:before{content:"\uF25E"}.fa-gg:before{content:"\uF260"}.fa-gg-circle:before{content:"\uF261"}.fa-tripadvisor:before{content:"\uF262"}.fa-odnoklassniki:before{content:"\uF263"}.fa-odnoklassniki-square:before{content:"\uF264"}.fa-get-pocket:before{content:"\uF265"}.fa-wikipedia-w:before{content:"\uF266"}.fa-safari:before{content:"\uF267"}.fa-chrome:before{content:"\uF268"}.fa-firefox:before{content:"\uF269"}.fa-opera:before{content:"\uF26A"}.fa-internet-explorer:before{content:"\uF26B"}.fa-tv:before,.fa-television:before{content:"\uF26C"}.fa-contao:before{content:"\uF26D"}.fa-500px:before{content:"\uF26E"}.fa-amazon:before{content:"\uF270"}.fa-calendar-plus-o:before{content:"\uF271"}.fa-calendar-minus-o:before{content:"\uF272"}.fa-calendar-times-o:before{content:"\uF273"}.fa-calendar-check-o:before{content:"\uF274"}.fa-industry:before{content:"\uF275"}.fa-map-pin:before{content:"\uF276"}.fa-map-signs:before{content:"\uF277"}.fa-map-o:before{content:"\uF278"}.fa-map:before{content:"\uF279"}.fa-commenting:before{content:"\uF27A"}.fa-commenting-o:before{content:"\uF27B"}.fa-houzz:before{content:"\uF27C"}.fa-vimeo:before{content:"\uF27D"}.fa-black-tie:before{content:"\uF27E"}.fa-fonticons:before{content:"\uF280"}.fa-reddit-alien:before{content:"\uF281"}.fa-edge:before{content:"\uF282"}.fa-credit-card-alt:before{content:"\uF283"}.fa-codiepie:before{content:"\uF284"}.fa-modx:before{content:"\uF285"}.fa-fort-awesome:before{content:"\uF286"}.fa-usb:before{content:"\uF287"}.fa-product-hunt:before{content:"\uF288"}.fa-mixcloud:before{content:"\uF289"}.fa-scribd:before{content:"\uF28A"}.fa-pause-circle:before{content:"\uF28B"}.fa-pause-circle-o:before{content:"\uF28C"}.fa-stop-circle:before{content:"\uF28D"}.fa-stop-circle-o:before{content:"\uF28E"}.fa-shopping-bag:before{content:"\uF290"}.fa-shopping-basket:before{content:"\uF291"}.fa-hashtag:before{content:"\uF292"}.fa-bluetooth:before{content:"\uF293"}.fa-bluetooth-b:before{content:"\uF294"}.fa-percent:before{content:"\uF295"}.fa-gitlab:before{content:"\uF296"}.fa-wpbeginner:before{content:"\uF297"}.fa-wpforms:before{content:"\uF298"}.fa-envira:before{content:"\uF299"}.fa-universal-access:before{content:"\uF29A"}.fa-wheelchair-alt:before{content:"\uF29B"}.fa-question-circle-o:before{content:"\uF29C"}.fa-blind:before{content:"\uF29D"}.fa-audio-description:before{content:"\uF29E"}.fa-volume-control-phone:before{content:"\uF2A0"}.fa-braille:before{content:"\uF2A1"}.fa-assistive-listening-systems:before{content:"\uF2A2"}.fa-asl-interpreting:before,.fa-american-sign-language-interpreting:before{content:"\uF2A3"}.fa-deafness:before,.fa-hard-of-hearing:before,.fa-deaf:before{content:"\uF2A4"}.fa-glide:before{content:"\uF2A5"}.fa-glide-g:before{content:"\uF2A6"}.fa-signing:before,.fa-sign-language:before{content:"\uF2A7"}.fa-low-vision:before{content:"\uF2A8"}.fa-viadeo:before{content:"\uF2A9"}.fa-viadeo-square:before{content:"\uF2AA"}.fa-snapchat:before{content:"\uF2AB"}.fa-snapchat-ghost:before{content:"\uF2AC"}.fa-snapchat-square:before{content:"\uF2AD"}.fa-pied-piper:before{content:"\uF2AE"}.fa-first-order:before{content:"\uF2B0"}.fa-yoast:before{content:"\uF2B1"}.fa-themeisle:before{content:"\uF2B2"}.fa-google-plus-circle:before,.fa-google-plus-official:before{content:"\uF2B3"}.fa-fa:before,.fa-font-awesome:before{content:"\uF2B4"}.fa-handshake-o:before{content:"\uF2B5"}.fa-envelope-open:before{content:"\uF2B6"}.fa-envelope-open-o:before{content:"\uF2B7"}.fa-linode:before{content:"\uF2B8"}.fa-address-book:before{content:"\uF2B9"}.fa-address-book-o:before{content:"\uF2BA"}.fa-vcard:before,.fa-address-card:before{content:"\uF2BB"}.fa-vcard-o:before,.fa-address-card-o:before{content:"\uF2BC"}.fa-user-circle:before{content:"\uF2BD"}.fa-user-circle-o:before{content:"\uF2BE"}.fa-user-o:before{content:"\uF2C0"}.fa-id-badge:before{content:"\uF2C1"}.fa-drivers-license:before,.fa-id-card:before{content:"\uF2C2"}.fa-drivers-license-o:before,.fa-id-card-o:before{content:"\uF2C3"}.fa-quora:before{content:"\uF2C4"}.fa-free-code-camp:before{content:"\uF2C5"}.fa-telegram:before{content:"\uF2C6"}.fa-thermometer-4:before,.fa-thermometer:before,.fa-thermometer-full:before{content:"\uF2C7"}.fa-thermometer-3:before,.fa-thermometer-three-quarters:before{content:"\uF2C8"}.fa-thermometer-2:before,.fa-thermometer-half:before{content:"\uF2C9"}.fa-thermometer-1:before,.fa-thermometer-quarter:before{content:"\uF2CA"}.fa-thermometer-0:before,.fa-thermometer-empty:before{content:"\uF2CB"}.fa-shower:before{content:"\uF2CC"}.fa-bathtub:before,.fa-s15:before,.fa-bath:before{content:"\uF2CD"}.fa-podcast:before{content:"\uF2CE"}.fa-window-maximize:before{content:"\uF2D0"}.fa-window-minimize:before{content:"\uF2D1"}.fa-window-restore:before{content:"\uF2D2"}.fa-times-rectangle:before,.fa-window-close:before{content:"\uF2D3"}.fa-times-rectangle-o:before,.fa-window-close-o:before{content:"\uF2D4"}.fa-bandcamp:before{content:"\uF2D5"}.fa-grav:before{content:"\uF2D6"}.fa-etsy:before{content:"\uF2D7"}.fa-imdb:before{content:"\uF2D8"}.fa-ravelry:before{content:"\uF2D9"}.fa-eercast:before{content:"\uF2DA"}.fa-microchip:before{content:"\uF2DB"}.fa-snowflake-o:before{content:"\uF2DC"}.fa-superpowers:before{content:"\uF2DD"}.fa-wpexplorer:before{content:"\uF2DE"}.fa-meetup:before{content:"\uF2E0"}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}@font-face{font-family:"grafana-icons";src:url("../fonts/grafana-icons.eot?okx5td");src:url("../fonts/grafana-icons.eot?okx5td#iefix") format("embedded-opentype"),url("../fonts/grafana-icons.ttf?okx5td") format("truetype"),url("../fonts/grafana-icons.woff?okx5td") format("woff"),url("../fonts/grafana-icons.svg?okx5td#grafana-icons") format("svg");font-weight:normal;font-style:normal}.icon-gf{font-family:"grafana-icons" !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;display:inline-block;vertical-align:middle;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-gf-fw{width:1.2857142857em;text-align:center}.inline-icon-gf{vertical-align:middle}.icon-gf-raintank_wordmark:before{content:"\uE600"}.micon-gf-raintank_icn:before{content:"\uE601"}.icon-gf-raintank_r-icn:before{content:"\uE905"}.icon-gf-check-alt:before{content:"\uE603"}.icon-gf-check:before{content:"\uE604"}.icon-gf-collector:before{content:"\uE605"}.icon-gf-dashboard:before{content:"\uE606"}.icon-gf-panel:before{content:"\uE904"}.icon-gf-endpoint-tiny:before{content:"\uE608"}.icon-gf-critical:before{content:"\uE610"}.icon-gf-online:before{content:"\uE611"}.icon-gf-event-error:before{content:"\uE623"}.icon-gf-event:before{content:"\uE624"}.icon-gf-sadface:before{content:"\uE907"}.icon-gf-private-collector:before{content:"\uE612"}.icon-gf-alert:before{content:"\uE61F"}.icon-gf-alert-disabled:before{content:"\uE621"}.icon-gf-refresh:before{content:"\uE613"}.icon-gf-save:before{content:"\uE614"}.icon-gf-share:before{content:"\uE616"}.icon-gf-star:before{content:"\uE617"}.icon-gf-search:before{content:"\uE618"}.icon-gf-settings:before{content:"\uE615"}.icon-gf-add:before{content:"\uE619"}.icon-gf-remove:before{content:"\uE61A"}.icon-gf-video:before{content:"\uE61B"}.icon-gf-bulk_action:before{content:"\uE61C"}.icon-gf-grabber:before{content:"\uE90B"}.icon-gf-users:before{content:"\uE622"}.icon-gf-globe:before{content:"\uE61D"}.icon-gf-snapshot:before{content:"\uE61E"}.icon-gf-play-grafana-icon:before{content:"\uE629"}.icon-gf-grafana-icon:before{content:"\uE625"}.icon-gf-email:before{content:"\uE628"}.icon-gf-stopwatch:before{content:"\uE626"}.icon-gf-skull:before{content:"\uE900"}.icon-gf-probe:before{content:"\uE901"}.icon-gf-apps:before{content:"\uE902"}@font-face{font-family:"Roboto Mono";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/roboto/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSh0mQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Roboto Mono";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/roboto/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSh0mQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7SUc.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7SUc.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7SUc.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7SUc.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7SUc.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7SUc.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7SUc.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7SUc.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7SUc.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7SUc.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7SUc.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7SUc.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}code,pre{font-family:"Roboto Mono",monospace;font-size:12px;background-color:#141414;color:#ccccdc;border:1px solid #343436;border-radius:4px}code{color:#ccccdc;white-space:nowrap;padding:2px 5px;margin:0 2px}code.code--small{font-size:10px;padding:2px;margin:0 2px}pre{display:block;margin:0 0 1.5714285714;line-height:1.5714285714;word-break:break-all;word-wrap:break-word;white-space:pre;white-space:pre-wrap;background-color:#141414;padding:10px}pre.pre--no-style{background:rgba(0,0,0,0);border:none;padding:0px}pre.prettyprint{margin-bottom:1.5714285714}pre code{padding:0;color:inherit;white-space:pre;white-space:pre-wrap;background-color:rgba(0,0,0,0);border:0}.gicon{line-height:1;display:inline-block;width:1.1057142857em;height:1.1057142857em;text-align:center;background-repeat:no-repeat;background-position:center;background-size:contain;vertical-align:middle}.icon--has-hover{opacity:.7}.icon--has-hover:hover{opacity:1}.gicon-add-annotation{background-image:url("../img/icons_dark_theme/icon_add_annotation.svg")}.gicon-add-annotation-alt{background-image:url("../img/icons_dark_theme/icon_add_annotation_alt.svg")}.gicon-add-datasources{background-image:url("../img/icons_dark_theme/icon_add_data_sources.svg")}.gicon-add-user{background-image:url("../img/icons_dark_theme/icon_add_user.svg")}.gicon-add-team{background-image:url("../img/icons_dark_theme/icon_add_team.svg")}.gicon-add-panel{background-image:url("../img/icons_dark_theme/icon_add_panel.svg")}.gicon-add-link{background-image:url("../img/icons_dark_theme/icon_add_link.svg")}.gicon-add-variable{background-image:url("../img/icons_dark_theme/icon_add_variable.svg")}.gicon-add-alert-notification-channel{background-image:url("../img/icons_dark_theme/icon_add_notification_channel.svg")}.gicon-alert{background-image:url("../img/icons_dark_theme/icon_alert.svg")}.gicon-remove{background-image:url("../img/icons_dark_theme/icon_remove.svg")}.gicon-arrow-left{background-image:url("../img/icons_dark_theme/icon_arrow_left.svg")}.gicon-arrow-left-circle{background-image:url("../img/icons_dark_theme/icon_arrow_left_circle.svg")}.gicon-alert-alt{background-image:url("../img/icons_dark_theme/icon_alert_alt.svg")}.gicon-alert-rules{background-image:url("../img/icons_dark_theme/icon_alert_rules.svg")}.gicon-alert-notification-channel{background-image:url("../img/icons_dark_theme/icon_notification_channels.svg")}.gicon-annotation{background-image:url("../img/icons_dark_theme/icon_annotation.svg")}.gicon-annotation-alt{background-image:url("../img/icons_dark_theme/icon_annotation_alt.svg")}.gicon-apikeys{background-image:url("../img/icons_dark_theme/icon_apikeys.svg")}.gicon-branding{background-image:url("../img/grafana_icon.svg")}.gicon-cog{background-image:url("../img/icons_dark_theme/icon_cog.svg")}.gicon-dashboard{background-image:url("../img/icons_dark_theme/icon_dashboard.svg")}.gicon-dashboard-starred{background-image:url("../img/icons_dark_theme/icon_dashboard_fav.svg")}.gicon-dashboard-list{background-image:url("../img/icons_dark_theme/icon_dashboard_list.svg")}.gicon-dashboard-new{background-image:url("../img/icons_dark_theme/icon_new_dashboard.svg")}.gicon-dashboard-import{background-image:url("../img/icons_dark_theme/icon_import_dashboard.svg")}.gicon-datasources{background-image:url("../img/icons_dark_theme/icon_data_sources.svg")}.gicon-editor{background-image:url("../img/icons_dark_theme/icon_editor.svg")}.gicon-folder-new{background-image:url("../img/icons_dark_theme/icon_add_folder.svg")}.gicon-home{background-image:url("../img/icons_dark_theme/icon_home.svg")}.gicon-json{background-image:url("../img/icons_dark_theme/icon_json.svg")}.gicon-link{background-image:url("../img/icons_dark_theme/icon_link.svg")}.gicon-manage{background-image:url("../img/icons_dark_theme/icon_sitemap.svg")}.gicon-org{background-image:url("../img/icons_dark_theme/icon_org.svg")}.gicon-playlists{background-image:url("../img/icons_dark_theme/icon_playlist.svg")}.gicon-plugins{background-image:url("../img/icons_dark_theme/icon_plugins.svg")}.gicon-preferences{background-image:url("../img/icons_dark_theme/icon_preferences.svg")}.gicon-question{background-image:url("../img/icons_dark_theme/icon_question.svg")}.gicon-shield{background-image:url("../img/icons_dark_theme/icon_shield.svg")}.gicon-snapshots{background-image:url("../img/icons_dark_theme/icon_snapshots.svg")}.gicon-team{background-image:url("../img/icons_dark_theme/icon_team.svg")}.gicon-user{background-image:url("../img/icons_dark_theme/icon_user.svg")}.gicon-variable{background-image:url("../img/icons_dark_theme/icon_variable.svg")}.gicon-viewer{background-image:url("../img/icons_dark_theme/icon_viewer.svg")}.gicon-zoom-out{background-image:url("../img/icons_dark_theme/icon_zoom_out.svg")}.gicon-explore{background-image:url("../img/icons_dark_theme/icon_explore.svg")}.gicon-reports{background-image:url("../img/icons_dark_theme/icon_reports.svg")}.sidemenu .gicon-dashboard{background-image:url("../img/icons_dark_theme/icon_dashboard.svg")}.sidemenu .gicon-alert{background-image:url("../img/icons_dark_theme/icon_alert.svg")}.sidemenu .gicon-cog{background-image:url("../img/icons_dark_theme/icon_cog.svg")}.sidemenu .gicon-question{background-image:url("../img/icons_dark_theme/icon_question.svg")}.sidemenu .gicon-explore{background-image:url("../img/icons_dark_theme/icon_explore.svg")}.sidemenu .gicon-shield{background-image:url("../img/icons_dark_theme/icon_shield.svg")}.sidemenu .gicon-reports{background-image:url("../img/icons_dark_theme/icon_reports.svg")}.fa--permissions-list{min-width:20px;padding-right:5px}.panel-editor-tabs .gicon-advanced-active,.add-panel-widget__icon .gicon-advanced-active{background-image:url("../img/icons_dark_theme/icon_advanced_active.svg")}.panel-editor-tabs .gicon-advanced,.add-panel-widget__icon .gicon-advanced{background-image:url("../img/icons_dark_theme/icon_advanced.svg")}.panel-editor-tabs .gicon-alert-active,.add-panel-widget__icon .gicon-alert-active{background-image:url("../img/icons_dark_theme/icon_alerting_active.svg")}.panel-editor-tabs .gicon-alert,.add-panel-widget__icon .gicon-alert{background-image:url("../img/icons_dark_theme/icon_alerting.svg")}.panel-editor-tabs .gicon-queries-active,.add-panel-widget__icon .gicon-queries-active{background-image:url("../img/icons_dark_theme/icon_query_active.svg")}.panel-editor-tabs .gicon-queries,.add-panel-widget__icon .gicon-queries{background-image:url("../img/icons_dark_theme/icon_query.svg")}.panel-editor-tabs .gicon-visualization-active,.add-panel-widget__icon .gicon-visualization-active{background-image:url("../img/icons_dark_theme/icon_visualize_active.svg")}.panel-editor-tabs .gicon-visualization,.add-panel-widget__icon .gicon-visualization{background-image:url("../img/icons_dark_theme/icon_visualize.svg")}.clearfix::after{content:"";display:table;clear:both}.highlight-word{color:#eb7b18}.emphasis-word{font-weight:500;color:#fff}.close{opacity:.2;float:right;font-size:20px;font-weight:bold;line-height:1.5714285714;color:#000;text-shadow:0 1px 0 #fff}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer;opacity:.4}button.close{padding:0;cursor:pointer;background:rgba(0,0,0,0);border:0;-webkit-appearance:none}.pull-right{float:right !important}.pull-left{float:left !important}.hide{display:none}.show{display:block}.invisible{visibility:hidden !important}.affix{position:fixed}.d-inline-block{display:inline-block}.absolute{position:absolute}.flex-grow-1{flex-grow:1}.flex-shrink-1{flex-shrink:1}.flex-shrink-0{flex-shrink:0}.flex-flow-column-nowrap{display:flex;flex-flow:column nowrap}.center-vh{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;justify-items:center}.align-items-center{display:flex;flex-direction:row nowrap;align-items:center}input.validation-error,input.ng-dirty.ng-invalid{box-shadow:inset 0 0px 5px #d10e5c}input.invalid{box-shadow:inset 0 0px 5px #d10e5c}[ng\\:cloak],[ng-cloak],.ng-cloak{display:none !important}.m-x-auto{margin-right:auto !important;margin-left:auto !important}.m-a-0{margin:0 0 !important}.m-t-0{margin-top:0 !important}.m-r-0{margin-right:0 !important}.m-b-0{margin-bottom:0 !important}.m-l-0{margin-left:0 !important}.m-x-0{margin-right:0 !important;margin-left:0 !important}.m-y-0{margin-top:0 !important;margin-bottom:0 !important}.m-a-1{margin:16px 16px !important}.m-t-1{margin-top:16px !important}.m-r-1{margin-right:16px !important}.m-b-1{margin-bottom:16px !important}.m-l-1{margin-left:16px !important}.m-x-1{margin-right:16px !important;margin-left:16px !important}.m-y-1{margin-top:16px !important;margin-bottom:16px !important}.m-a-2{margin:24px 24px !important}.m-t-2{margin-top:24px !important}.m-r-2{margin-right:24px !important}.m-b-2{margin-bottom:24px !important}.m-l-2{margin-left:24px !important}.m-x-2{margin-right:24px !important;margin-left:24px !important}.m-y-2{margin-top:24px !important;margin-bottom:24px !important}.m-a-3{margin:48px 48px !important}.m-t-3{margin-top:48px !important}.m-r-3{margin-right:48px !important}.m-b-3{margin-bottom:48px !important}.m-l-3{margin-left:48px !important}.m-x-3{margin-right:48px !important;margin-left:48px !important}.m-y-3{margin-top:48px !important;margin-bottom:48px !important}.p-a-0{padding:0 0 !important}.p-t-0{padding-top:0 !important}.p-r-0{padding-right:0 !important}.p-b-0{padding-bottom:0 !important}.p-l-0{padding-left:0 !important}.p-x-0{padding-right:0 !important;padding-left:0 !important}.p-y-0{padding-top:0 !important;padding-bottom:0 !important}.p-a-1{padding:16px 16px !important}.p-t-1{padding-top:16px !important}.p-r-1{padding-right:16px !important}.p-b-1{padding-bottom:16px !important}.p-l-1{padding-left:16px !important}.p-x-1{padding-right:16px !important;padding-left:16px !important}.p-y-1{padding-top:16px !important;padding-bottom:16px !important}.p-a-2{padding:24px 24px !important}.p-t-2{padding-top:24px !important}.p-r-2{padding-right:24px !important}.p-b-2{padding-bottom:24px !important}.p-l-2{padding-left:24px !important}.p-x-2{padding-right:24px !important;padding-left:24px !important}.p-y-2{padding-top:24px !important;padding-bottom:24px !important}.p-a-3{padding:48px 48px !important}.p-t-3{padding-top:48px !important}.p-r-3{padding-right:48px !important}.p-b-3{padding-bottom:48px !important}.p-l-3{padding-left:48px !important}.p-x-3{padding-right:48px !important;padding-left:48px !important}.p-y-3{padding-top:48px !important;padding-bottom:48px !important}.pos-f-t{position:fixed;top:0;right:0;left:0;z-index:1000}.max-width{width:100%}.width-auto{width:auto}.width-1{width:16px !important}.width-2{width:32px !important}.width-3{width:48px !important}.width-4{width:64px !important}.width-5{width:80px !important}.width-6{width:96px !important}.width-7{width:112px !important}.width-8{width:128px !important}.width-9{width:144px !important}.width-10{width:160px !important}.width-11{width:176px !important}.width-12{width:192px !important}.width-13{width:208px !important}.width-14{width:224px !important}.width-15{width:240px !important}.width-16{width:256px !important}.width-17{width:272px !important}.width-18{width:288px !important}.width-19{width:304px !important}.width-20{width:320px !important}.width-21{width:336px !important}.width-22{width:352px !important}.width-23{width:368px !important}.width-24{width:384px !important}.width-25{width:400px !important}.width-26{width:416px !important}.width-27{width:432px !important}.width-28{width:448px !important}.width-29{width:464px !important}.width-30{width:480px !important}.max-width-1{max-width:16px !important;flex-grow:1}.max-width-2{max-width:32px !important;flex-grow:1}.max-width-3{max-width:48px !important;flex-grow:1}.max-width-4{max-width:64px !important;flex-grow:1}.max-width-5{max-width:80px !important;flex-grow:1}.max-width-6{max-width:96px !important;flex-grow:1}.max-width-7{max-width:112px !important;flex-grow:1}.max-width-8{max-width:128px !important;flex-grow:1}.max-width-9{max-width:144px !important;flex-grow:1}.max-width-10{max-width:160px !important;flex-grow:1}.max-width-11{max-width:176px !important;flex-grow:1}.max-width-12{max-width:192px !important;flex-grow:1}.max-width-13{max-width:208px !important;flex-grow:1}.max-width-14{max-width:224px !important;flex-grow:1}.max-width-15{max-width:240px !important;flex-grow:1}.max-width-16{max-width:256px !important;flex-grow:1}.max-width-17{max-width:272px !important;flex-grow:1}.max-width-18{max-width:288px !important;flex-grow:1}.max-width-19{max-width:304px !important;flex-grow:1}.max-width-20{max-width:320px !important;flex-grow:1}.max-width-21{max-width:336px !important;flex-grow:1}.max-width-22{max-width:352px !important;flex-grow:1}.max-width-23{max-width:368px !important;flex-grow:1}.max-width-24{max-width:384px !important;flex-grow:1}.max-width-25{max-width:400px !important;flex-grow:1}.max-width-26{max-width:416px !important;flex-grow:1}.max-width-27{max-width:432px !important;flex-grow:1}.max-width-28{max-width:448px !important;flex-grow:1}.max-width-29{max-width:464px !important;flex-grow:1}.max-width-30{max-width:480px !important;flex-grow:1}.min-width-1{min-width:16px !important}.min-width-2{min-width:32px !important}.min-width-3{min-width:48px !important}.min-width-4{min-width:64px !important}.min-width-5{min-width:80px !important}.min-width-6{min-width:96px !important}.min-width-7{min-width:112px !important}.min-width-8{min-width:128px !important}.min-width-9{min-width:144px !important}.min-width-10{min-width:160px !important}.min-width-11{min-width:176px !important}.min-width-12{min-width:192px !important}.min-width-13{min-width:208px !important}.min-width-14{min-width:224px !important}.min-width-15{min-width:240px !important}.min-width-16{min-width:256px !important}.min-width-17{min-width:272px !important}.min-width-18{min-width:288px !important}.min-width-19{min-width:304px !important}.min-width-20{min-width:320px !important}.min-width-21{min-width:336px !important}.min-width-22{min-width:352px !important}.min-width-23{min-width:368px !important}.min-width-24{min-width:384px !important}.min-width-25{min-width:400px !important}.min-width-26{min-width:416px !important}.min-width-27{min-width:432px !important}.min-width-28{min-width:448px !important}.min-width-29{min-width:464px !important}.min-width-30{min-width:480px !important}.offset-width-1{margin-left:16px !important}.offset-width-2{margin-left:32px !important}.offset-width-3{margin-left:48px !important}.offset-width-4{margin-left:64px !important}.offset-width-5{margin-left:80px !important}.offset-width-6{margin-left:96px !important}.offset-width-7{margin-left:112px !important}.offset-width-8{margin-left:128px !important}.offset-width-9{margin-left:144px !important}.offset-width-10{margin-left:160px !important}.offset-width-11{margin-left:176px !important}.offset-width-12{margin-left:192px !important}.offset-width-13{margin-left:208px !important}.offset-width-14{margin-left:224px !important}.offset-width-15{margin-left:240px !important}.offset-width-16{margin-left:256px !important}.offset-width-17{margin-left:272px !important}.offset-width-18{margin-left:288px !important}.offset-width-19{margin-left:304px !important}.offset-width-20{margin-left:320px !important}.offset-width-21{margin-left:336px !important}.offset-width-22{margin-left:352px !important}.offset-width-23{margin-left:368px !important}.offset-width-24{margin-left:384px !important}.offset-width-25{margin-left:400px !important}.offset-width-26{margin-left:416px !important}.offset-width-27{margin-left:432px !important}.offset-width-28{margin-left:448px !important}.offset-width-29{margin-left:464px !important}.offset-width-30{margin-left:480px !important}@keyframes onAutoFillStart{}@keyframes onAutoFillCancel{}input:-webkit-autofill{animation-name:onAutoFillStart;transition:transform 1ms}input:not(:-webkit-autofill){animation-name:onAutoFillCancel}.ui-list{margin:0;padding:0;list-style:none}.ui-list>li{margin-bottom:4px}.ui-list>li:last-child{margin-bottom:0}.add-panel-widget-container{height:100%}.add-panel-widget{height:100%}.add-panel-widget__header{top:0;position:absolute;padding:0 8px;display:flex;align-items:center;width:100%;cursor:move;background:#111217;box-shadow:inset 0px -4px 14px #1f1f20;border-bottom:1px solid #111217}.add-panel-widget__header .gicon{font-size:30px;margin-right:16px}.add-panel-widget__header:hover{transition:background-color .1s ease-in-out;background-color:rgba(204,204,220,.16)}.add-panel-widget__title{font-size:14px;font-weight:500;margin-right:32px}.add-panel-widget__link{margin:0 8px;width:170px;height:88px !important;flex-direction:column !important}.add-panel-widget__icon{margin-bottom:8px}.add-panel-widget__icon .gicon{color:#fff;height:44px;width:53px;position:relative;left:5px}.add-panel-widget__create{display:inherit;margin-bottom:24px;margin-top:55px}.add-panel-widget__actions{display:inherit}.add-panel-widget__action{margin:0 4px}.add-panel-widget__btn-container{height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column}.ps{overflow:hidden !important;overflow-anchor:none;-ms-overflow-style:none;touch-action:auto;-ms-touch-action:auto}.ps__rail-x{display:none;opacity:0;transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;height:15px;bottom:0px;position:absolute}.ps__rail-y{display:none;opacity:0;transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;width:15px;right:0;position:absolute}.ps--active-x>.ps__rail-x,.ps--active-y>.ps__rail-y{display:block;background-color:rgba(0,0,0,0)}.ps--focus>.ps__rail-x,.ps--focus>.ps__rail-y,.ps--scrolling-x>.ps__rail-x,.ps--scrolling-y>.ps__rail-y{opacity:.6}.ps__rail-x:hover,.ps__rail-y:hover,.ps__rail-x:focus,.ps__rail-y:focus{background-color:rgba(0,0,0,0);opacity:.9}.ps__thumb-x{background-color:#aaa;border-radius:6px;height:6px;bottom:2px;position:absolute}.ps__thumb-y{background-color:#414350;background-image:linear-gradient(to bottom, #404357, #424345);background-repeat:repeat-x;border-radius:6px;width:6px;right:0px;position:absolute}@supports(-ms-overflow-style: none){.ps{overflow:auto !important}}@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none){.ps{overflow:auto !important}}.ps__rail-x:hover,.ps__rail-y:hover,.ps__rail-x:focus,.ps__rail-y:focus{background-color:rgba(0,0,0,0);opacity:.9}.no-overlay-scrollbar ::-webkit-scrollbar{width:8px;height:8px}.no-overlay-scrollbar ::-webkit-scrollbar:hover{height:8px}.no-overlay-scrollbar ::-webkit-scrollbar-button:start:decrement,.no-overlay-scrollbar ::-webkit-scrollbar-button:end:increment{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:horizontal:decrement{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:horizontal:increment{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:vertical:decrement{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:vertical:increment{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:horizontal:decrement:active{background-image:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:horizontal:increment:active{background-image:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:vertical:decrement:active{background-image:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:vertical:increment:active{background-image:none}.no-overlay-scrollbar ::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,0)}.no-overlay-scrollbar ::-webkit-scrollbar-thumb:vertical{height:50px;background:-webkit-gradient(linear, left top, right top, color-stop(0%, #404357), color-stop(100%, #424345));border:1px solid #000;border-top:1px solid #000;border-left:1px solid #000}.no-overlay-scrollbar ::-webkit-scrollbar-thumb:horizontal{width:50px;background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #404357), color-stop(100%, #424345));border:1px solid #000;border-top:1px solid #000;border-left:1px solid #000}.baron{overflow:hidden}.main-view.baron{width:unset}.baron__clipper{position:relative;overflow:hidden}.baron__scroller{overflow-y:scroll;-ms-overflow-style:none;-moz-box-sizing:border-box;box-sizing:border-box;margin:0;border:0;padding:0;width:100%;height:100%;-webkit-overflow-scrolling:touch}.baron__scroller::-webkit-scrollbar{width:0;height:0}.baron__track{display:none;position:absolute;top:0;right:0;bottom:0}.baron._scrollbar .baron__track{display:block}.baron__free{position:absolute;top:0;bottom:0;right:0}.baron__bar{display:none;position:absolute;right:0;z-index:1;background:#999;width:15px;transition:background-color .2s linear,opacity .2s linear;opacity:0}.baron._scrollbar .baron__bar{display:block;background-color:#414350;background-image:linear-gradient(to bottom, #404357, #424345);background-repeat:repeat-x;border-radius:6px;width:6px;right:0px;position:absolute}.baron._scrollbar .baron__bar:hover,.baron._scrollbar .baron__bar:focus{opacity:.9}.panel-hover-highlight .baron__track .baron__bar{opacity:.6}.baron._scrolling>.baron__track .baron__bar{opacity:.9}.baron__control{display:none}.baron.panel-content--scrollable{width:calc(100% - 2px)}.baron.panel-content--scrollable .baron__scroller{padding-top:1px}.scroll-margin-helper{margin-right:12px}.btn{display:inline-flex;align-items:center;justify-content:center;font-weight:500;line-height:1.5714285714;font-size:14px;text-align:center;vertical-align:middle;cursor:pointer;border:none;height:32px;padding:0 16px;font-size:14px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.btn:focus,.btn.focus,.btn:active:focus,.btn:active.focus,.btn.active:focus,.btn.active.focus{outline:none}.btn:focus,.btn:hover{text-decoration:none}.btn.focus{text-decoration:none}.btn:active,.btn.active{background-image:none;outline:0}.btn.disabled,.btn[disabled],.btn:disabled{cursor:not-allowed;opacity:.65;box-shadow:none;pointer-events:none}.btn--radius-left-0{border-top-left-radius:0;border-bottom-left-radius:0}.btn--radius-right-0{border-top-right-radius:0;border-bottom-right-radius:0}.btn-large{padding:11px 24px;font-size:18px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;font-weight:normal;height:48px}.btn-large .gicon{margin-right:8px;filter:brightness(100)}.btn-small{padding:4px 8px;font-size:12px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;height:24px}.btn-mini{padding:4px 8px;font-size:12px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;height:height-smpx}.btn-link{color:#b3b3b3;background:rgba(0,0,0,0)}.btn-success,.btn-primary{color:#fff;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#4979db;background-image:linear-gradient(to bottom, #3D71D9, rgb(90, 134, 222));background-repeat:repeat-x;border-color:#3d71d9}.btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active,.btn-success.disabled,.btn-success[disabled],.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active,.btn-primary.disabled,.btn-primary[disabled]{color:#fff;background-image:none;background-color:#3d71d9}.btn-secondary{color:#fff;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#2a2a2c;background-image:linear-gradient(to bottom, #262628, #303032);background-repeat:repeat-x;border-color:#262628}.btn-secondary:hover,.btn-secondary:focus,.btn-secondary:active,.btn-secondary.active,.btn-secondary.disabled,.btn-secondary[disabled]{color:#fff;background-image:none;background-color:#262628}.btn-danger{color:#fff;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#d31c66;background-image:linear-gradient(to bottom, #D10E5C, rgb(215, 50, 116));background-repeat:repeat-x;border-color:#d10e5c}.btn-danger:hover,.btn-danger:focus,.btn-danger:active,.btn-danger.active,.btn-danger.disabled,.btn-danger[disabled]{color:#fff;background-image:none;background-color:#d10e5c}.btn-secondary{color:#ccccdc;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#2a2a2c;background-image:linear-gradient(to bottom, #262628, #303032);background-repeat:repeat-x;border-color:#262628}.btn-secondary:hover,.btn-secondary:focus,.btn-secondary:active,.btn-secondary.active,.btn-secondary.disabled,.btn-secondary[disabled]{color:#ccccdc;background-image:none;background-color:#262628}.btn-inverse{color:#ccccdc;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#2a2a2c;background-image:linear-gradient(to bottom, #262628, #303032);background-repeat:repeat-x;border-color:#262628;box-shadow:none}.btn-inverse:hover,.btn-inverse:focus,.btn-inverse:active,.btn-inverse.active,.btn-inverse.disabled,.btn-inverse[disabled]{color:#ccccdc;background-image:none;background-color:#262628}.btn-transparent{background-color:rgba(0,0,0,0)}.btn-outline-primary{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff}.btn-outline-primary:hover{color:#fff;background-color:#3d71d9}.btn-outline-primary:focus,.btn-outline-primary.focus{color:#fff;background-color:#3d71d9}.btn-outline-primary:active,.btn-outline-primary.active,.open>.btn-outline-primary.dropdown-toggle{color:#fff;background-color:#3d71d9}.btn-outline-primary:active:hover,.btn-outline-primary:active:focus,.btn-outline-primary:active.focus,.btn-outline-primary.active:hover,.btn-outline-primary.active:focus,.btn-outline-primary.active.focus,.open>.btn-outline-primary.dropdown-toggle:hover,.open>.btn-outline-primary.dropdown-toggle:focus,.open>.btn-outline-primary.dropdown-toggle.focus{color:#fff;background-color:#1f4aa0;border-color:#193a7e}.btn-outline-primary.disabled:focus,.btn-outline-primary.disabled.focus,.btn-outline-primary:disabled:focus,.btn-outline-primary:disabled.focus{border-color:#92afea}.btn-outline-primary.disabled:hover,.btn-outline-primary:disabled:hover{border-color:#92afea}.btn-outline-secondary{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff}.btn-outline-secondary:hover{color:#fff;background-color:#303032}.btn-outline-secondary:focus,.btn-outline-secondary.focus{color:#fff;background-color:#303032}.btn-outline-secondary:active,.btn-outline-secondary.active,.open>.btn-outline-secondary.dropdown-toggle{color:#fff;background-color:#303032}.btn-outline-secondary:active:hover,.btn-outline-secondary:active:focus,.btn-outline-secondary:active.focus,.btn-outline-secondary.active:hover,.btn-outline-secondary.active:focus,.btn-outline-secondary.active.focus,.open>.btn-outline-secondary.dropdown-toggle:hover,.open>.btn-outline-secondary.dropdown-toggle:focus,.open>.btn-outline-secondary.dropdown-toggle.focus{color:#fff;background-color:#060606;border-color:#000}.btn-outline-secondary.disabled:focus,.btn-outline-secondary.disabled.focus,.btn-outline-secondary:disabled:focus,.btn-outline-secondary:disabled.focus{border-color:#626267}.btn-outline-secondary.disabled:hover,.btn-outline-secondary:disabled:hover{border-color:#626267}.btn-outline-inverse{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff}.btn-outline-inverse:hover{color:#fff;background-color:#262628}.btn-outline-inverse:focus,.btn-outline-inverse.focus{color:#fff;background-color:#262628}.btn-outline-inverse:active,.btn-outline-inverse.active,.open>.btn-outline-inverse.dropdown-toggle{color:#fff;background-color:#262628}.btn-outline-inverse:active:hover,.btn-outline-inverse:active:focus,.btn-outline-inverse:active.focus,.btn-outline-inverse.active:hover,.btn-outline-inverse.active:focus,.btn-outline-inverse.active.focus,.open>.btn-outline-inverse.dropdown-toggle:hover,.open>.btn-outline-inverse.dropdown-toggle:focus,.open>.btn-outline-inverse.dropdown-toggle.focus{color:#fff;background-color:#000;border-color:#000}.btn-outline-inverse.disabled:focus,.btn-outline-inverse.disabled.focus,.btn-outline-inverse:disabled:focus,.btn-outline-inverse:disabled.focus{border-color:#58585c}.btn-outline-inverse.disabled:hover,.btn-outline-inverse:disabled:hover{border-color:#58585c}.btn-outline-danger{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff}.btn-outline-danger:hover{color:#fff;background-color:#d10e5c}.btn-outline-danger:focus,.btn-outline-danger.focus{color:#fff;background-color:#d10e5c}.btn-outline-danger:active,.btn-outline-danger.active,.open>.btn-outline-danger.dropdown-toggle{color:#fff;background-color:#d10e5c}.btn-outline-danger:active:hover,.btn-outline-danger:active:focus,.btn-outline-danger:active.focus,.btn-outline-danger.active:hover,.btn-outline-danger.active:focus,.btn-outline-danger.active.focus,.open>.btn-outline-danger.dropdown-toggle:hover,.open>.btn-outline-danger.dropdown-toggle:focus,.open>.btn-outline-danger.dropdown-toggle.focus{color:#fff;background-color:#800938;border-color:#5a0627}.btn-outline-danger.disabled:focus,.btn-outline-danger.disabled.focus,.btn-outline-danger:disabled:focus,.btn-outline-danger:disabled.focus{border-color:#f35292}.btn-outline-danger.disabled:hover,.btn-outline-danger:disabled:hover{border-color:#f35292}.btn-outline-disabled{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff;box-shadow:none;cursor:default}.btn-outline-disabled:hover{color:#fff;background-color:#555}.btn-outline-disabled:focus,.btn-outline-disabled.focus{color:#fff;background-color:#555}.btn-outline-disabled:active,.btn-outline-disabled.active,.open>.btn-outline-disabled.dropdown-toggle{color:#fff;background-color:#555}.btn-outline-disabled:active:hover,.btn-outline-disabled:active:focus,.btn-outline-disabled:active.focus,.btn-outline-disabled.active:hover,.btn-outline-disabled.active:focus,.btn-outline-disabled.active.focus,.open>.btn-outline-disabled.dropdown-toggle:hover,.open>.btn-outline-disabled.dropdown-toggle:focus,.open>.btn-outline-disabled.dropdown-toggle.focus{color:#fff;background-color:#2a2a2a;border-color:#151515}.btn-outline-disabled.disabled:focus,.btn-outline-disabled.disabled.focus,.btn-outline-disabled:disabled:focus,.btn-outline-disabled:disabled.focus{border-color:#888}.btn-outline-disabled.disabled:hover,.btn-outline-disabled:disabled:hover{border-color:#888}.btn-outline-disabled:hover,.btn-outline-disabled:active,.btn-outline-disabled:active:hover,.btn-outline-disabled:focus{color:#555;background-color:rgba(0,0,0,0);border-color:#555}.btn-p-x-2{padding-left:20px;padding-right:20px}.btn-p-x-0{padding-left:0;padding-right:0}.btn-service{position:relative}.btn-service--github{background-color:#464646;border:1px solid #393939}.btn-service--github .btn-service-icon{font-size:24px;border-right:1px solid #393939}.btn-service--gitlab{background-color:#fc6d26;border:1px solid #e24329}.btn-service--gitlab .btn-service-icon{font-size:24px;border-right:1px solid #e24329}.btn-service--google{background-color:#e84d3c;border:1px solid #b83e31}.btn-service--google .btn-service-icon{font-size:24px;border-right:1px solid #b83e31}.btn-service--azuread{background-color:#2f2f2f;border:1px solid #2f2f2f}.btn-service--azuread .btn-service-icon{font-size:24px;border-right:1px solid #2f2f2f}.btn-service--grafanacom{background-color:#262628;border:1px solid #393939}.btn-service--grafanacom .btn-service-icon{font-size:24px;border-right:1px solid #393939}.btn-service--okta{background-color:#2f2f2f;border:1px solid #393939}.btn-service--okta .btn-service-icon{font-size:24px;border-right:1px solid #393939}.btn-service--oauth{background-color:#262628;border:1px solid #393939}.btn-service--oauth .btn-service-icon{font-size:24px;border-right:1px solid #393939}.btn-service-icon{position:absolute;left:0;height:100%;top:0;padding-left:8px;padding-right:8px;width:35px;text-align:center}.btn-service-icon::before{position:relative;top:4px}.btn-service--grafanacom .btn-service-icon{background-image:url(../img/grafana_mask_icon_white.svg);background-repeat:no-repeat;background-position:50%;background-size:60%}.btn-service--azuread .btn-service-icon{background-image:url(../img/microsoft_auth_icon.svg);background-repeat:no-repeat;background-position:50%;background-size:60%}.btn-service--okta .btn-service-icon{background-image:url(../img/okta_logo_white.png);background-repeat:no-repeat;background-position:50%;background-size:60%}.toggle-btn{background:#22252b;color:rgba(204,204,220,.65);box-shadow:none}.toggle-btn:first-child{border-radius:2px 0 0 2px;margin:0}.toggle-btn:last-child{border-radius:0 2px 2px 0;margin-left:0 !important}.toggle-btn.active{background-color:#2d3139;color:#ccccdc}.toggle-btn.active:hover{cursor:default}.btn-loading span{animation-name:blink;animation-duration:1.4s;animation-iteration-count:infinite;animation-fill-mode:both}.btn-loading span:nth-child(2){animation-delay:.2s}.btn-loading span:nth-child(3){animation-delay:.4s}@keyframes blink{0%{opacity:.2;font-size:14}20%{opacity:1;font-size:18}100%{opacity:.2;font-size:14}}.nav{margin:0;list-style:none}.nav>li>a{display:block}.nav>.pull-right{float:right}.nav-tabs::after{content:"";display:table;clear:both}.nav-tabs>li{float:left}.nav-tabs>li>a{padding-right:12px;padding-left:12px;margin-right:2px;line-height:14px}.nav-tabs{border-bottom:1px solid #555;padding-left:10px;margin:0 0 10px 0}.nav-tabs>li{margin-bottom:-1px}.nav-tabs>.active>a,.nav-tabs>.active>a:hover,.nav-tabs>.active>a:focus{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;border-color:#555;border-bottom:1px solid #181b1f;color:#ccccdc}.tab-content>.tab-pane{display:none}.tab-content>.active{display:block}.modal-body .nav-tabs{border-bottom:none}.modal-body .nav-tabs>li>a{border:none;border-radius:0}.modal-body .nav-tabs>li>a:hover,.modal-body .nav-tabs>li>a:focus{border-bottom:1px solid #33a2e5}.modal-body .nav-tabs>.active>a,.modal-body .nav-tabs>.active>a:hover,.modal-body .nav-tabs>.active>a:focus{border:none;border-bottom:1px solid #33a2e5;color:#ccccdc}.gf-tabs{float:left;position:relative;top:1px}.gf-tabs::after{content:"";display:table;clear:both}.gf-tabs-item{float:left;list-style:none}.gf-tabs-link{padding:10px 15px 9px;margin-right:8px;position:relative;display:block;border:solid rgba(0,0,0,0);border-width:0 1px 1px;border-radius:3px 3px 0 0;color:#ccccdc}.gf-tabs-link i{margin-right:5px}.gf-tabs-link .gicon{position:relative;top:-2px}.gf-tabs-link:hover,.gf-tabs-link:focus{color:#fff}.gf-tabs-link.active,.gf-tabs-link.active:hover,.gf-tabs-link.active:focus{border-color:#eb7b18 #343436 rgba(0,0,0,0);background:#111217;color:#ccccdc;overflow:hidden}.gf-tabs-link.active::before,.gf-tabs-link.active:hover::before,.gf-tabs-link.active:focus::before{display:block;content:" ";position:absolute;left:0;right:0;height:2px;top:0;background-image:linear-gradient(270deg, #F55F3E 0%, #FF8833 100%)}.gf-tabs-link.active--panel{background:#181b1f !important}.alert{padding:15px 20px;margin-bottom:4px;border-left:3px solid #d10e5c;background:#22252b;position:relative;border-radius:2px;display:flex;flex-direction:row;align-items:center}.alert-success{border-color:#1a7f4b}.alert-danger,.alert-error{border-color:#d10e5c}.alert-info{border-color:#f5b73d}.alert-warning{border-color:#f5b73d}.page-alert-list{z-index:8000;min-width:400px;max-width:600px;position:fixed;right:10px;top:60px}.alert-close{padding:0 0 0 16px;border:none;background:none;display:flex;align-items:center}.alert-close .fa{align-self:flex-end;font-size:21px;color:rgba(255,255,255,.75)}.alert-title{font-weight:500}.alert-icon{padding:0 16px 0 0;display:flex;align-items:center;justify-content:center;width:35px}.alert-icon .fa{font-size:21px}.alert-body{overflow-wrap:break-word;word-break:break-word;flex-grow:1}.alert-icon-on-top{align-items:flex-start}@media(max-width: 768px){.page-alert-list{min-width:0;top:30px;width:calc(100% - 20px);max-height:calc(100% - 60px);overflow-y:auto}}gf-form-switch[disabled] .gf-form-switch,gf-form-switch[disabled] .gf-form-switch-container{cursor:default;pointer-events:none !important}gf-form-switch[disabled] .gf-form-switch .gf-form-label,gf-form-switch[disabled] .gf-form-switch-container .gf-form-label{color:rgba(204,204,220,.65)}.gf-form-switch-container-react{display:flex;flex-shrink:0}.gf-form-switch-container{display:flex;cursor:pointer;margin-right:4px}.gf-form-switch{display:flex;position:relative;width:56px;height:32px;background:#111217;border:1px solid rgba(204,204,220,.15);border-radius:2px;align-items:center;justify-content:center}.gf-form-switch input{opacity:0;width:0;height:0}.gf-form-switch--transparent{background:rgba(0,0,0,0);border:0;width:40px}.gf-form-switch__slider{background:#555;border-radius:8px;height:16px;width:32px;display:block;position:relative}.gf-form-switch__slider::before{position:absolute;content:"";height:12px;width:12px;left:2px;top:2px;background:#1f1f20;transition:.4s;border-radius:50%;box-shadow:0 0 3px #000}input:checked+.gf-form-switch__slider{background:#5794f2}input:checked+.gf-form-switch__slider::before{transform:translateX(16px)}.gf-form-checkbox{position:relative;display:flex;width:50px;height:32px;background:#111217;border:1px solid rgba(204,204,220,.15);border-left:none;border-radius:2px;align-items:center;justify-content:center}.gf-form-checkbox input{opacity:0;width:0;height:0;appearance:none}.gf-form-checkbox--transparent{background:rgba(0,0,0,0);border:none;width:23px;height:auto;position:relative;padding-left:8px}.gf-form-checkbox--table-cell{width:20px;background:rgba(0,0,0,0);height:auto;border:none;position:relative;top:-5px}.gf-form-switch__checkbox{height:16px;width:16px;border-radius:3px;border:1px solid #555;background:#141414;display:flex;align-items:center;justify-content:center}input:checked+.gf-form-switch__checkbox::before{font-family:"FontAwesome";content:"\uF00C";color:#141414}input:checked+.gf-form-switch__checkbox{background:linear-gradient(0deg, #eb7b18, #d44a3a);border:none}.tooltip{position:absolute;z-index:1040;display:block;visibility:visible;line-height:1.4;font-weight:500;opacity:0}.tooltip.in{opacity:1}.tooltip.top{margin-top:-3px;padding:5px 0}.tooltip.right{margin-left:3px;padding:0 5px}.tooltip.bottom{margin-top:3px;padding:5px 0}.tooltip.left{margin-left:-3px;padding:0 5px}.tooltip-inner{max-width:400px;padding:8px 16px;padding:4px 8px;color:#ccccdc;text-align:center;text-decoration:none;background-color:#22252b;border-radius:2px}.tooltip-arrow{position:absolute;width:0;height:0;border-color:rgba(0,0,0,0);border-style:solid}.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-width:5px 5px 0;border-top-color:#22252b}.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#22252b}.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-width:5px 0 5px 5px;border-left-color:#22252b}.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-width:0 5px 5px;border-bottom-color:#22252b}.grafana-tooltip{position:absolute;top:-1000;left:0;color:#ccccdc;padding:10px;font-size:11pt;font-weight:200;background-color:#22252b;border-radius:5px;z-index:9999;max-width:800px;max-height:600px;overflow:hidden;line-height:14px}.grafana-tooltip a{color:#ccccdc}.grafana-tooltip a.external-link,.grafana-tooltip .grafana-info-box a,.grafana-info-box .grafana-tooltip a{color:#6e9fff}.grafana-tip{padding-left:5px}.label,.badge{display:inline-block;padding:2px 4px;font-size:11.844px;font-weight:500;line-height:14px;color:#fff;vertical-align:baseline;white-space:nowrap;text-shadow:0 -1px 0 rgba(0,0,0,.25);background-color:#555}.label-tag{background-color:#93c;color:#f2f2f2;white-space:nowrap;border-radius:3px;text-shadow:none;font-size:12px;padding:0px 6px;line-height:20px;height:20px}.label-tag svg{margin-bottom:0}.label-tag .icon-tag{position:relative;top:1px;padding-right:4px}.label-tag.muted{opacity:.85;background-color:#7a29a3;color:rgba(204,204,220,.65)}.label-tag:hover{opacity:.85;background-color:#7a29a3}.label-tag--gray{opacity:.85;background-color:#555;border-color:#8e8e8e}.label-tag--gray:hover{background-color:#555}.graph-panel{display:flex;flex-direction:column;height:100%}@media(min-width: 544px){.graph-panel--legend-right{flex-direction:row}.graph-panel--legend-right .graph-legend{flex:0 1 10px;max-height:100%;overflow-y:initial}.graph-panel--legend-right .graph-legend-series{display:block;padding-left:4px}.graph-panel--legend-right .graph-legend-table .graph-legend-series{display:table-row}}.graph-panel__chart{position:relative;cursor:crosshair;flex-grow:1;min-height:65%}.datapoints-warning{position:absolute;top:50%;left:50%;z-index:10;margin-top:-50px;margin-left:-100px;width:200px;text-align:center;cursor:auto;padding:10px}.graph-legend{display:flex;flex:0 1 auto;max-height:35%;margin:0;text-align:center;overflow-y:auto;padding-top:6px;position:relative}.graph-legend .popover-content{padding:0}.graph-legend-alias{background:rgba(0,0,0,0);border:none}.graph-legend-content{position:relative}.graph-legend-icon{position:relative;padding-right:4px;top:1px}.graph-legend-icon,.graph-legend-alias,.graph-legend-value{display:inline;white-space:nowrap;font-size:12px;text-align:left}.graph-legend-icon.current::before,.graph-legend-alias.current::before,.graph-legend-value.current::before{content:"Current: "}.graph-legend-icon.max::before,.graph-legend-alias.max::before,.graph-legend-value.max::before{content:"Max: "}.graph-legend-icon.min::before,.graph-legend-alias.min::before,.graph-legend-value.min::before{content:"Min: "}.graph-legend-icon.total::before,.graph-legend-alias.total::before,.graph-legend-value.total::before{content:"Total: "}.graph-legend-icon.avg::before,.graph-legend-alias.avg::before,.graph-legend-value.avg::before{content:"Avg: "}.graph-legend-icon .fa{font-size:135%;position:relative;top:1px}.graph-legend-series{float:left;white-space:nowrap;padding-left:10px;display:flex;align-items:center}.graph-legend-series--right-y{float:right}.graph-panel--legend-right .graph-legend-series--right-y{float:left}.graph-legend-value{padding-left:6px}.graph-legend-table{padding-right:5px;padding-left:5px}.graph-legend-table .graph-legend-series{display:table-row;float:none;padding-left:0}.graph-legend-table .graph-legend-series--right-y{float:none}.graph-legend-table .graph-legend-series--right-y .graph-legend-alias::after{content:"(right-y)";padding:0 5px;color:rgba(204,204,220,.65)}.graph-legend-table td,.graph-legend-table .graph-legend-alias,.graph-legend-table .graph-legend-icon,.graph-legend-table .graph-legend-value{float:none;display:table-cell;white-space:nowrap;padding:2px;text-align:right}.graph-legend-table .graph-legend-icon{cursor:pointer}.graph-legend-table .graph-legend-value{padding-left:15px}.graph-legend-table .graph-legend-alias{text-align:left;max-width:650px;text-overflow:ellipsis;overflow:hidden}.graph-legend-table .graph-legend-series:nth-child(even){background:#22252b}.graph-legend-table .graph-legend-value.current::before,.graph-legend-table .graph-legend-value.max::before,.graph-legend-table .graph-legend-value.min::before,.graph-legend-table .graph-legend-value.total::before,.graph-legend-table .graph-legend-value.avg::before{content:""}.graph-legend-table th{text-align:right;padding:0px 10px 1px 0;font-weight:bold;color:#33a2e5;font-size:85%;white-space:nowrap}.graph-legend-series__table-name{display:flex;align-items:center}.graph-legend-series-hidden .graph-legend-value,.graph-legend-series-hidden .graph-legend-alias{color:rgba(204,204,220,.6)}.graph-legend-popover{width:210px}.graph-legend-popover label{display:inline-block}.graph-legend-popover .btn{padding:1px 3px;margin-right:0px;line-height:initial}.annotation-tags{color:#93c}.graph-series-override__properties{margin-left:16px}.graph-tooltip{white-space:nowrap;font-size:12px;background-color:#141414;color:#ccccdc}.graph-tooltip .graph-tooltip-time{text-align:center;position:relative;top:-3px;padding:2px;font-weight:500;color:#ccccdc}.graph-tooltip .graph-tooltip-list-item{display:table-row}.graph-tooltip .graph-tooltip-list-item--highlight{color:#fff;font-weight:500}.graph-tooltip .graph-tooltip-series-name{display:table-cell;padding:2px;max-width:650px;text-overflow:ellipsis;overflow:hidden}.graph-tooltip .graph-tooltip-value{display:table-cell;font-weight:500;padding-left:15px;text-align:right}.graph-annotation .label-tag{margin-right:4px;margin-top:8px}.graph-annotation .graph-annotation__header{background:#22252b;padding:4px 8px;display:flex;flex-wrap:nowrap}.graph-annotation .graph-annotation__title{font-weight:500;padding-right:16px;overflow:hidden;display:inline-block;white-space:nowrap;text-overflow:ellipsis;flex-grow:1}.graph-annotation .graph-annotation__edit-icon{padding-left:16px}.graph-annotation .graph-annotation__time{color:rgba(204,204,220,.65);font-style:italic;font-weight:normal;display:inline-block;position:relative;top:1px}.graph-annotation .graph-annotation__body{padding:8px}.graph-annotation .graph-annotation__user img{border-radius:50%;width:16px;height:16px}.graph-annotation a[href]{color:#33a2e5;text-decoration:underline}.left-yaxis-label{top:50%;left:8px;transform:translateX(-50%) translateY(-50%) rotate(-90deg)}.right-yaxis-label{top:50%;right:8px;transform:translateX(50%) translateY(-50%) rotate(90deg)}.axisLabel{display:inline-block;color:#ccccdc;font-size:12px;position:absolute;text-align:center}.alert-handle-wrapper{position:absolute;user-select:none}.alert-handle-wrapper .alert-handle{z-index:10;position:relative;float:right;box-shadow:none;background:#22252b;cursor:move;width:100px;font-size:12px;border-radius:4px;text-align:left;color:rgba(204,204,220,.65)}.alert-handle-wrapper .alert-handle:hover{background-color:#303032}.alert-handle-wrapper .alert-handle .icon-gf{font-size:14px;position:relative;top:0px;float:left;border-right:1px solid #343436;padding:6px 4px 4px 6px}.alert-handle-wrapper .alert-handle-value{border-left:1px solid #1f1f20;padding:4px 8px;padding:7px;line-height:24px;height:24px}.alert-handle-wrapper .alert-handle-value .alert-handle-grip{background:url("../img/grab_dark.svg") no-repeat 50% 50%;background-size:8px;float:right;width:16px;height:24px;margin-right:2px}.alert-handle-wrapper--T1{right:-222px;width:245px}.alert-handle-wrapper--T1 .alert-handle-line{width:145px}.alert-handle-wrapper--T0{right:-104px;width:129px}.alert-handle-wrapper--T0 .alert-handle-line{width:28px}.alert-handle-wrapper--no-value .alert-handle-line{display:none}.alert-handle-wrapper .alert-handle-line{float:left;height:2px;margin-top:13px;z-index:0;position:relative}.alert-handle-wrapper .alert-handle-line--critical{background-color:rgba(237,46,24,.6)}.alert-handle-wrapper .alert-handle-line--warning{background-color:rgba(247,149,32,.6)}.thresholds-form-disabled{filter:blur(3px)}.submenu-controls{display:flex;flex-direction:row;flex-wrap:wrap;align-content:flex-start;align-items:flex-start;gap:8px 16px;padding:0 0 8px 0}.submenu-item{display:inline-block}.submenu-item .fa-caret-down{font-size:75%;padding-left:8px}.submenu-item .gf-form{margin-bottom:0}.variable-link-wrapper{display:inline-block;position:relative}.progress-tracker-container{height:100%;display:flex;align-items:center}.progress-tracker-close-btn{color:rgba(204,204,220,.65);position:absolute;z-index:10;top:8px;right:8px;font-size:18px;background-color:rgba(0,0,0,0);border:none}.progress-tracker-close-btn:hover{color:#fff}.progress-tracker{display:flex;width:100%;padding:0;align-items:center}.progress-step{text-align:center;position:relative;flex:1 1 0%;margin:0;padding:0;color:rgba(204,204,220,.65);height:84px;min-width:60px}.progress-step::after{content:"";display:block;position:absolute;z-index:0;top:29px;bottom:29px;right:-30px;width:100%;height:2px;border-top:2px solid #555}.progress-step:first-child::after{left:50%}.progress-step:last-child::after{right:50%}.progress-step.active .progress-step-cta{display:inline-flex}.progress-step.active .progress-title{font-weight:400}.progress-step.active .progress-text{display:none}.progress-step.active .progress-marker .icon-gf{color:#eb7b18;-webkit-text-fill-color:rgba(0,0,0,0);background:linear-gradient(270deg, #F55F3E 0%, #FF8833 100%);-webkit-background-clip:text;text-decoration:none}.progress-step.active .progress-marker .gicon{opacity:1}.progress-step.completed .progress-marker{color:#6ccf8e}.progress-step.completed .progress-marker .icon-gf::before{content:"\uE604"}.progress-step.completed .progress-text{text-decoration:line-through}.progress-step-cta{padding:4px 7px;font-size:12px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;color:#fff;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#4979db;background-image:linear-gradient(to bottom, #3D71D9, rgb(90, 134, 222));background-repeat:repeat-x;border-color:#3d71d9;display:none}.progress-step-cta:hover,.progress-step-cta:focus,.progress-step-cta:active,.progress-step-cta.active,.progress-step-cta.disabled,.progress-step-cta[disabled]{color:#fff;background-image:none;background-color:#3d71d9}.progress-marker{display:flex;justify-content:center;align-items:center;position:relative;width:60px;height:60px;padding-bottom:2px;z-index:1;background-color:#181b1f;margin-left:auto;margin-right:auto;color:rgba(204,204,220,.65);font-size:35px;vertical-align:sub}.progress-text{display:block;overflow:hidden;text-overflow:ellipsis;color:rgba(204,204,220,.65)}.progress-marker{color:rgba(204,204,220,.65);text-decoration:none;font-size:35px;vertical-align:sub}.progress-marker .gicon{opacity:.7}a.progress-link:hover .progress-marker,a.progress-link:hover .progress-text{color:#fff}a.progress-link:hover:hover .progress-marker.completed{color:#6ccf8e}.piechart-panel{position:relative;display:table;width:100%;height:100%}.piechart-panel .piechart-container{top:10px;margin:auto}.piechart-panel .piechart-container svg{width:100%;height:100%}.piechart-panel .piechart-tooltip{white-space:nowrap;font-size:12px;background-color:#141414;color:#d8d9da;opacity:0;position:absolute}.piechart-panel .piechart-tooltip .piechart-tooltip-time{text-align:center;position:relative;padding:2px;font-weight:bold;color:#d8d9da}.piechart-panel .piechart-tooltip .piechart-tooltip-time .piechart-tooltip-value{display:table-cell;font-weight:bold;padding:15px;text-align:right}.pluginlist-section-header{margin-bottom:16px;color:rgba(204,204,220,.65)}.pluginlist-section{margin-bottom:16px}.pluginlist-link{display:block;margin:3px;padding:7px;background:#22252b;box-shadow:none;border-radius:2px}.pluginlist-link:hover{background:#282b31}.pluginlist-icon{vertical-align:sub;font-size:2rem;margin-right:8px}.pluginlist-image{width:17px}.pluginlist-title{margin-right:5.3333333333px}.pluginlist-version{font-size:12px;color:rgba(204,204,220,.65)}.pluginlist-message{float:right;font-size:12px}.pluginlist-message--update:hover{border-bottom:1px solid #ccccdc}.pluginlist-message--enable{color:#6e9fff}.pluginlist-message--enable:hover{border-bottom:1px solid #6e9fff}.pluginlist-message--no-update{color:rgba(204,204,220,.65)}.pluginlist-emphasis{font-weight:500}.singlestat-panel{position:relative;display:table;width:100%;height:100%}.singlestat-panel-value-container{display:table-cell;vertical-align:middle;text-align:center;position:relative;z-index:1;font-weight:500;line-height:1}.panel-container--no-title .singlestat-panel-value-container{padding-bottom:0}.singlestat-panel-prefix{padding-right:20px}#flotGaugeValue0{font-weight:500}.table-panel-content{padding:0}.table-panel-content .panel-title-container{padding-bottom:4px}.table-panel-scroll{overflow:auto}.table-panel-container{padding-top:2.2em;position:relative}.table-panel-footer{text-align:center;font-size:90%;line-height:2px}.table-panel-footer ul{position:relative;display:inline-block;margin-left:0;margin-bottom:0}.table-panel-footer ul>li{display:inline}.table-panel-footer ul>li>a{float:left;padding:4px 12px;text-decoration:none;border-left-width:0}.table-panel-footer ul>li>a:hover{background-color:#22252b}.table-panel-footer ul>li>a.active{font-weight:bold;color:#33a2e5}.table-panel-table{width:100%;border-collapse:collapse}.table-panel-table th{padding:0}.table-panel-table th:first-child .table-panel-table-header-inner{padding-left:15px}.table-panel-table td{padding:.45em 1.1em;border-bottom:2px solid #111217;border-right:2px solid #111217}.table-panel-table td:first-child{padding-left:15px}.table-panel-table td:last-child{border-right:none}.table-panel-table td.table-panel-cell-pre{white-space:pre}.table-panel-table td.table-panel-cell-link{padding:0}.table-panel-table td.table-panel-cell-link a{padding:.45em 0 .45em 1.1em;height:100%;display:inline-block;text-decoration:underline;text-underline-position:under}.table-panel-table td.cell-highlighted:hover{background-color:#22252b}.table-panel-table td:hover .table-panel-filter-link{visibility:visible}.table-panel-filter-link{visibility:hidden;color:rgba(204,204,220,.65);float:right;display:block;padding:0 5px}.table-panel-header-bg{background:#22252b;border-top:2px solid #111217;border-bottom:2px solid #111217;height:2em;position:absolute;top:0;right:0;left:0}.table-panel-table-header-inner{padding:.3em 0 .45em 1.1em;text-align:left;color:#33a2e5;position:absolute;top:0}.table-panel-width-hack{visibility:hidden;height:0px;line-height:0px}.table-panel-color-cell{color:#fff}.table-panel-color-cell a{color:#fff}.table-panel-color-row{color:#fff}.table-panel-color-row a{color:#fff}.heatmap-canvas-wrapper{cursor:crosshair}.heatmap-panel{position:relative}.heatmap-panel .axis .tick text{fill:#ccccdc;color:#ccccdc;font-size:11px}.heatmap-panel .axis .tick line{opacity:.4;stroke:rgba(204,204,220,.65)}.heatmap-panel svg{pointer-events:none}.heatmap-panel svg rect{pointer-events:visiblePainted}.heatmap-tooltip{white-space:nowrap;font-size:12px;background-color:#141414;color:#ccccdc}.heatmap-histogram rect{fill:rgba(204,204,220,.65)}.heatmap-crosshair line{stroke:#89093c;stroke-width:1}.heatmap-selection{stroke-width:1;fill:rgba(102,102,102,.4);stroke:rgba(102,102,102,.8)}.heatmap-legend-wrapper{margin:0 16px;padding-top:4px}.heatmap-legend-wrapper::after{content:"";display:table;clear:both}.heatmap-legend-wrapper svg{width:100%;max-width:300px;height:18px;float:left;white-space:nowrap}.heatmap-legend-wrapper .heatmap-legend-values{display:inline-block}.heatmap-legend-wrapper .axis .tick text{fill:#ccccdc;color:#ccccdc;font-size:11px}.heatmap-legend-wrapper .axis .tick line{opacity:.4;stroke:rgba(204,204,220,.65)}.heatmap-legend-wrapper .axis .tick .domain{opacity:.4;stroke:rgba(204,204,220,.65)}.bootstrap-tagsinput{display:inline-block;padding:0 0 0 6px;vertical-align:middle;max-width:100%;line-height:22px;background-color:#111217;border:1px solid rgba(204,204,220,.15)}.bootstrap-tagsinput input{display:inline-block;border:none;margin:0px;border-radius:0;padding:8px 6px;height:100%;width:70px;box-sizing:border-box}.bootstrap-tagsinput input.gf-form-input--has-help-icon{padding-right:32px}.bootstrap-tagsinput .tag{margin-right:2px;color:#fff}.bootstrap-tagsinput .tag [data-role=remove]{margin-left:8px;cursor:pointer}.bootstrap-tagsinput .tag [data-role=remove]::after{content:"x";padding:0px 2px}.bootstrap-tagsinput .tag [data-role=remove]:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05)}.bootstrap-tagsinput .tag [data-role=remove]:hover:active{box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.tag-filter{flex-grow:1}.tag-filter .label-tag{margin-left:6px;cursor:pointer}.tag-filter .label-tag .fa.fa-remove{margin-right:3px}.tag-filter-option{position:relative;text-align:left;width:100%;display:block;border-radius:0;cursor:pointer;padding:2px 0}.tag-count-label{margin-left:3px}.tag-filter-values{display:inline}.tag-filter-values .label-tag{margin:6px 6px 0px 0px;font-size:11px;cursor:pointer}.tag-filter-values .label-tag .fa.fa-remove{margin-right:3px}.grafana-options-table{width:100%}.grafana-options-table th{text-align:left;padding:5px 10px;border-bottom:4px solid #181b1f}.grafana-options-table tr td{background-color:#22252b;padding:5px 10px;white-space:nowrap;border-bottom:4px solid #181b1f}.grafana-options-table tr td.nobg{background-color:rgba(0,0,0,0)}.grafana-options-table .max-width-btns{padding-right:0px}.grafana-options-table .max-width-btns .btn{box-sizing:border-box;width:100%}.max-width{overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;white-space:nowrap}.grafana-list-item{display:block;padding:1px 10px;line-height:34px;background-color:#22252b;margin-bottom:4px;cursor:pointer}.search-results-container{display:block;padding:16px;position:relative;flex-grow:10;margin-bottom:16px;background:#181b1f;border:1px solid rgba(204,204,220,.07);border-radius:3px;height:unset}.search-results-container .label-tag{margin-top:2px;margin-left:6px;font-size:11px;padding:2px 6px}.search-results-container .selected .search-result-tag{opacity:.7;color:#fff}.search-section{background:#181b1f;border-bottom:1px solid #2c3235;padding:0px 4px 4px 4px;margin-bottom:3px}.search-section__header{font-size:1rem;padding:7px 4px 3px 0;color:rgba(204,204,220,.65);display:flex;flex-grow:1}.search-section__header:hover,.search-section__header.selected{color:#ccccdc}.search-section__header:hover .search-section__header__link{opacity:1}.search-section__header__icon{padding:5px 0px;width:43px;text-align:center}.search-section__header__toggle{padding:5px}.search-section__header__text{flex-grow:1;line-height:24px}.search-section__header__link{padding:2px 10px 0;color:rgba(204,204,220,.65);opacity:0;transition:opacity 150ms ease-in-out}.search-item{display:block;margin:3px;padding:7px;background:#22252b;box-shadow:none;border-radius:2px;display:flex;flex-grow:1;align-items:center;height:auto;min-height:37px;white-space:initial;padding:0px}.search-item:hover{background:#282b31}.search-item:hover,.search-item.selected{background:#282b31}.search-item:hover .search-item__body-title,.search-item.selected .search-item__body-title{color:#fff}.search-item__body{flex:1 1 auto;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:0 10px}.search-item__body-folder-title{color:rgba(204,204,220,.65);font-size:10px;line-height:11px;position:relative;top:-1px}.search-item__icon{display:flex;align-items:center;flex:0 0 auto;font-size:19px;padding:0 2px 0 10px}.search-item__tags{display:none;padding:10px}.search-item__actions{flex:0 0 auto;padding:0 10px 0 0}.search-item__actions__item{display:inline-block;opacity:0;width:0;transition:all .2s ease-in-out}.search-item__actions__item .fa-star,.search-item__actions__item .fa-star-o{color:#eb7b18;line-height:37px}.search-item:hover .search-item__actions__item{width:15px;opacity:1}.search-button-row{text-align:center;padding:32px 16px;background:#181b1f}@media(min-width: 769px){.search-item__tags{display:flex;flex:1 1 auto;flex-wrap:wrap;justify-content:flex-end;margin-top:-2px}}.gf-form{display:flex;flex-direction:row;align-items:flex-start;text-align:left;position:relative;margin-bottom:4px}.gf-form--offset-1{margin-left:16px}.gf-form--grow{flex-grow:1}.gf-form--flex-end{justify-content:flex-end}.gf-form--align-center{align-content:center}.gf-form--alt{flex-direction:column;align-items:flex-start}.gf-form--alt .gf-form-label{padding:4px 0}.gf-form--has-input-icon{position:relative;margin-right:4px}.gf-form--has-input-icon .gf-form-input-icon{position:absolute;top:8px;font-size:18px;left:10px;color:rgba(204,204,220,.6)}.gf-form--has-input-icon>input{padding-left:35px}.gf-form--has-input-icon>input:focus+.gf-form-input-icon{color:rgba(204,204,220,.65)}.gf-form--has-input-icon .Select--multi .Select-multi-value-wrapper,.gf-form--has-input-icon .Select-placeholder{padding-left:30px}.gf-form-disabled{color:rgba(204,204,220,.65)}.gf-form-disabled .gf-form-select-wrapper::after{color:rgba(204,204,220,.65)}.gf-form-disabled a,.gf-form-disabled .gf-form-input{color:rgba(204,204,220,.65)}.gf-form-group{margin-bottom:40px}.gf-form-inline{display:flex;flex-direction:row;flex-wrap:wrap;align-content:flex-start}.gf-form-inline--nowrap{flex-wrap:nowrap}.gf-form-inline--xs-view-flex-column{flex-direction:row;flex-wrap:nowrap}@media(max-width: 543px){.gf-form-inline--xs-view-flex-column{flex-direction:column}}.gf-form-inline .select-container{margin-right:4px}.gf-form-inline .gf-form-spacing{margin-right:4px}.gf-form-button-row{padding-top:24px}.gf-form-button-row a,.gf-form-button-row button{margin-right:16px}.gf-form-label{display:flex;align-items:center;padding:0 8px;flex-shrink:0;font-weight:500;font-size:12px;background-color:#22252b;height:32px;line-height:32px;margin-right:4px;border-radius:2px;justify-content:space-between;border:none}.gf-form-label--grow{flex-grow:1}.gf-form-label--error{color:#ff5286}.gf-form-label--transparent{background-color:rgba(0,0,0,0);border:0;text-align:right;padding-left:0px}.gf-form-label--variable{color:#6e9fff;background:#181b1f;border:1px solid rgba(204,204,220,.07)}.gf-form-label--dashlink{background:#181b1f;border:1px solid rgba(204,204,220,.07)}.gf-form-label--justify-left{justify-content:left}.gf-form-label--btn{border:none;border-radius:2px}.gf-form-label--btn:hover{background:#282b31;color:#ccccdc}.gf-form-label:disabled{color:rgba(204,204,220,.65)}.gf-form-label+.gf-form-label{margin-right:4px}.gf-form-pre{display:block !important;flex-grow:1;margin:0;margin-right:4px;border:1px solid rgba(0,0,0,0);border-left:none;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.gf-form-textarea{max-width:650px}.gf-form-input{display:block;width:100%;height:32px;padding:0 8px;font-size:14px;line-height:18px;color:#ccccdc;background-color:#111217;background-image:none;background-clip:padding-box;border:1px solid rgba(204,204,220,.15);border-radius:2px;margin-right:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}textarea.gf-form-input{overflow:auto;white-space:pre-wrap;padding:6px 8px;min-height:32px;height:auto}.gf-form-input::-ms-expand{background-color:rgba(0,0,0,0);border:0;display:none}.gf-form-input:focus{border-color:#6e9fff;outline:none}.gf-form-input::placeholder{color:rgba(204,204,220,.6);opacity:1}.gf-form-input:disabled,.gf-form-input[readonly]{background-color:rgba(204,204,220,.04);opacity:1}.gf-form-input:disabled{cursor:not-allowed}.gf-form-input.gf-size-auto{width:auto}.gf-form-input--dropdown{padding-right:24px;position:relative;display:flex;align-items:center}.gf-form-input--dropdown::after{position:absolute;top:36%;right:11px;font-size:11px;background-color:rgba(0,0,0,0);color:#ccccdc;font:normal normal normal 12px/1 FontAwesome;content:"\uF0D7";pointer-events:none}.gf-form-input--small{padding-top:4px;padding-bottom:4px;font-size:12px}.gf-form-input--plaintext{white-space:unset}.gf-form-input--has-help-icon{padding-right:32px}.gf-form-hint{width:100%}.gf-form-hint-text{display:block;text-align:right;padding-top:.5em}.gf-form-select-wrapper{position:relative;background-color:#111217;margin-right:4px}.gf-form-select-wrapper .gf-form-select-icon{position:absolute;z-index:1;left:0 8px;top:50%;margin-top:-7px}.gf-form-select-wrapper .gf-form-select-icon+.gf-form-input{position:relative;z-index:2;padding-left:32px;background-color:rgba(0,0,0,0)}.gf-form-select-wrapper .gf-form-select-icon+.gf-form-input option{color:#000}.gf-form-select-wrapper .gf-form-input{margin-right:0;line-height:32px}.gf-form-select-wrapper select.gf-form-input{text-indent:.01px;text-overflow:"";padding-right:32px;appearance:none}.gf-form-select-wrapper select.gf-form-input:-moz-focusring{outline:none;color:rgba(0,0,0,0);text-shadow:0 0 0 #ccccdc}.gf-form-select-wrapper select.gf-form-input.ng-empty{color:rgba(204,204,220,.65)}.gf-form-select-wrapper::after{position:absolute;top:36%;right:11px;background-color:rgba(0,0,0,0);color:#ccccdc;font:normal normal normal 12px/1 FontAwesome;content:"\uF0D7";pointer-events:none;font-size:11px}.gf-form-select-wrapper--has-help-icon::after{right:32px}.gf-form--v-stretch{align-items:stretch}.gf-form-btn{padding:0 8px;margin-right:4px;line-height:18px;font-size:12px;flex-shrink:0;flex-grow:0}.natural-language-inputinput[type=number]{font-size:14px;line-height:18px;margin:-6px -5px 0 5px;padding:4px}.gf-form-dropdown-typeahead{position:relative}.gf-form-dropdown-typeahead::after{position:absolute;top:35%;right:8px;background-color:rgba(0,0,0,0);color:#ccccdc;font:normal normal normal 12px/1 FontAwesome;content:"\uF0D7";pointer-events:none;font-size:11px}.gf-form-help-icon{flex-grow:0;color:rgba(204,204,220,.65)}.gf-form-help-icon--bold{color:#fff;padding-left:0}.gf-form-help-icon--right-absolute{position:absolute;right:16px;top:6px}.gf-form-help-icon--right-normal{float:right}.gf-form-help-icon--header{margin-bottom:2px}.gf-form-help-icon--small-padding{padding-left:4px}.gf-form-help-icon:hover{color:#ccccdc}select.gf-form-input~.gf-form-help-icon{right:10px}.gf-form-icon--right-absolute{position:absolute;right:16px;top:10px;color:rgba(204,204,220,.65)}.cta-form{position:relative;padding:24px;background-color:#22252b;margin-bottom:24px;border-top:3px solid #1a7f4b}.cta-form__close{background:rgba(0,0,0,0);padding:4px 8px 4px 9px;border:none;position:absolute;right:0;top:-2px;font-size:14px}.cta-form__close:hover{color:#fff}.cta-form__bar{display:flex;align-items:center;align-content:center;margin-bottom:20px}.cta-form__bar-header{font-size:1.2857142857rem;padding-right:20px}.navbar-page-btn{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:flex;align-items:center;margin:0;font-size:18px;min-height:55px}.navbar-page-btn .gicon{top:-2px;position:relative;font-size:17px;line-height:8px;opacity:.75;margin-right:10px;display:none}@media(min-width: 769px){.navbar-page-btn .gicon{display:inline-block}}.navbar-page-btn .navbar-page-btn__folder-icon{display:none}@media(min-width: 769px){.navbar-page-btn .navbar-page-btn__folder-icon{display:inline-block}}.filter-controls-filters{display:inline-block;margin-bottom:40px}.tab-pane>.filter-controls-filters{margin-top:20px}.filter-controls-actions{margin:0 0 10px;padding:0;list-style:none}.filter-controls-actions>li{display:inline-block;margin-right:10px}.filter-controls-actions-selected{text-transform:uppercase}.filter-list{margin:0;padding:0;list-style:none}.filter-list>li{padding:10px;margin-bottom:2px;background:#181b1f}.filter-list>li:last-child{margin:0}.filter-list-card{display:table;width:100%;margin:0;padding:0;list-style:none}.filter-list-card>li{display:table-cell;vertical-align:top}.filter-list-card-select{width:23px;padding-right:5px}.filter-list-card-title{display:block;font-size:16px;font-weight:normal}.filter-list-card-image{width:50px;padding:5px 50px 5px 5px}.filter-list-card-status{color:#777;font-size:12px}.filter-list-card-state{display:inline-block;padding:5px 0 0 28px;background:0 bottom no-repeat;background-size:24px auto;font-size:14px;text-transform:uppercase}.filter-list-card-state.online{background-image:url("/img/online.svg");color:#6ccf8e}.filter-list-card-state.warn{background-image:url("/img/warn-tiny.svg");color:#f8d06b}.filter-list-card-state.critical{background-image:url("/img/critical.svg");color:#ff5286}.filter-list-card-controls{float:right}.filter-list-card-links,.filter-list-card-config,.filter-list-card-expand{display:inline-block;vertical-align:middle}.filter-list-card-link{display:block;color:#777;text-align:right}.filter-list-card-link>a{color:#777}.filter-list-card-config{padding:8px 8px 8px 16px;color:#777;font-size:25px}.filter-list-card-config>a{color:#777}.filter-list-card-expand{width:20px;padding:8px 0 8px 8px;color:#aaa;font-size:30px;text-align:center;cursor:pointer}.filter-list-card-details{padding:20px 0 0 30px}.filter-list-card-details-heading{font-weight:normal}.filter-list-card-details-heading>a{float:right;color:#33a2e5;font-size:12px}.filter-table *{box-sizing:border-box}.filter-table{width:100%;border-collapse:separate}.filter-table tbody tr:nth-child(odd){background:#1c1f23}.filter-table th{width:auto;padding:4px 8px;text-align:left;line-height:30px;height:30px;white-space:nowrap}.filter-table td{padding:4px 8px;line-height:30px;height:30px;white-space:nowrap}.filter-table td.filter-table__switch-cell{padding:0;border-right:3px solid #111217}.filter-table .link-td{padding:0;line-height:30px;height:30px;white-space:nowrap}.filter-table .link-td.filter-table__switch-cell{padding:0;border-right:3px solid #111217}.filter-table .link-td a{display:block;padding:0px 8px;height:30px}.filter-table .ellipsis{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filter-table .expanded{border-color:#181b1f}.filter-table .expanded>td{padding-bottom:0}.filter-table .filter-table__avatar{width:25px;height:25px;border-radius:50%}.filter-table--hover tbody tr:hover{background:#23262a}.filter-table__weak-italic{font-style:italic;color:rgba(204,204,220,.65)}.editor-row{vertical-align:top}.section{margin-right:42px;vertical-align:top;display:inline-block}div.editor-option{vertical-align:top;display:inline-block;margin-right:10px}div.editor-option label{display:block}.slate-query-field{font-size:14px;font-family:"Roboto Mono",monospace;height:auto;word-break:break-word;overflow:auto}.slate-query-field__wrapper{position:relative;display:inline-block;padding:6px 8px;min-height:32px;width:100%;color:#ccccdc;background-color:#111217;background-image:none;border:1px solid rgba(204,204,220,.15);border-radius:2px;transition:all .3s;line-height:18px}.slate-query-field__wrapper--disabled{background-color:inherit;cursor:not-allowed}.slate-typeahead .typeahead{position:relative;z-index:1030;border-radius:2px;border:1px solid rgba(204,204,220,.07);max-height:66vh;overflow-y:scroll;overflow-x:hidden;outline:none;list-style:none;background:#181b1f;color:#ccccdc;box-shadow:0 5px 10px 0 #000}.slate-typeahead .typeahead-group__title{color:rgba(204,204,220,.65);font-size:12px;line-height:1.5714285714;padding:8px}.slate-typeahead .typeahead-item{height:auto;font-family:"Roboto Mono",monospace;padding:8px 8px 8px 16px;font-size:12px;text-overflow:ellipsis;overflow:hidden;z-index:1;display:block;white-space:nowrap;cursor:pointer;transition:color .3s cubic-bezier(0.645, 0.045, 0.355, 1),border-color .3s cubic-bezier(0.645, 0.045, 0.355, 1),background .3s cubic-bezier(0.645, 0.045, 0.355, 1),padding .15s cubic-bezier(0.645, 0.045, 0.355, 1)}.slate-typeahead .typeahead-item__selected{background-color:#343436}.slate-typeahead .typeahead-item__selected .typeahead-item-hint{font-size:10px;color:#ccccdc;white-space:normal}.slate-typeahead .typeahead-match{color:#ecbb13;border-bottom:1px solid #ecbb13;padding:inherit;background:inherit}.slate-query-field .token.comment,.slate-query-field .token.block-comment,.slate-query-field .token.prolog,.slate-query-field .token.doctype,.slate-query-field .token.cdata,.prism-syntax-highlight .token.comment,.prism-syntax-highlight .token.block-comment,.prism-syntax-highlight .token.prolog,.prism-syntax-highlight .token.doctype,.prism-syntax-highlight .token.cdata{color:rgba(204,204,220,.65)}.slate-query-field .token.variable,.slate-query-field .token.entity,.prism-syntax-highlight .token.variable,.prism-syntax-highlight .token.entity{color:#ccccdc}.slate-query-field .token.property,.slate-query-field .token.tag,.slate-query-field .token.constant,.slate-query-field .token.symbol,.slate-query-field .token.deleted,.prism-syntax-highlight .token.property,.prism-syntax-highlight .token.tag,.prism-syntax-highlight .token.constant,.prism-syntax-highlight .token.symbol,.prism-syntax-highlight .token.deleted{color:#ff5286}.slate-query-field .token.attr-value,.slate-query-field .token.selector,.slate-query-field .token.string,.slate-query-field .token.char,.slate-query-field .token.builtin,.slate-query-field .token.inserted,.prism-syntax-highlight .token.attr-value,.prism-syntax-highlight .token.selector,.prism-syntax-highlight .token.string,.prism-syntax-highlight .token.char,.prism-syntax-highlight .token.builtin,.prism-syntax-highlight .token.inserted{color:#6ccf8e}.slate-query-field .token.boolean,.slate-query-field .token.number,.slate-query-field .token.operator,.slate-query-field .token.url,.prism-syntax-highlight .token.boolean,.prism-syntax-highlight .token.number,.prism-syntax-highlight .token.operator,.prism-syntax-highlight .token.url{color:#fe85fc}.slate-query-field .token.function,.slate-query-field .token.attr-name,.slate-query-field .token.function-name,.slate-query-field .token.atrule,.slate-query-field .token.keyword,.slate-query-field .token.class-name,.prism-syntax-highlight .token.function,.prism-syntax-highlight .token.attr-name,.prism-syntax-highlight .token.function-name,.prism-syntax-highlight .token.atrule,.prism-syntax-highlight .token.keyword,.prism-syntax-highlight .token.class-name{color:#6e9fff}.slate-query-field .token.punctuation,.slate-query-field .token.regex,.slate-query-field .token.important,.prism-syntax-highlight .token.punctuation,.prism-syntax-highlight .token.regex,.prism-syntax-highlight .token.important{color:#eb7b18}.slate-query-field .token.important,.prism-syntax-highlight .token.important{font-weight:normal}.slate-query-field .token.bold,.prism-syntax-highlight .token.bold{font-weight:bold}.slate-query-field .token.italic,.prism-syntax-highlight .token.italic{font-style:italic}.slate-query-field .token.entity,.prism-syntax-highlight .token.entity{cursor:help}.slate-query-field .namespace,.prism-syntax-highlight .namespace{opacity:.7}.typeahead{max-height:300px;overflow-y:auto}.typeahead strong{color:#ecbb13}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1050;background-color:rgba(204,204,220,.16)}.modal-backdrop,.modal-backdrop.fade.in{opacity:.7}.modal{position:fixed;z-index:1060;width:100%;background:#111217;box-shadow:0 3px 7px rgba(0,0,0,.3);background-clip:padding-box;outline:none;max-width:750px;left:0;right:0;margin-left:auto;margin-right:auto;top:10%}.modal-header{background:#111217;box-shadow:inset 0px -4px 14px #1f1f20;border-bottom:1px solid #111217;display:flex;align-items:center;justify-content:space-between}.modal-header-title{font-size:18px;float:left;padding-top:8px;margin:0 16px}.modal-header-close{float:right;padding:9px 16px}.modal-body{position:relative}.modal-content{padding:32px}.modal-content--has-scroll{max-height:calc(100vh - 400px);position:relative}.modal-form{margin-bottom:0}.modal-footer{padding:14px 15px 15px;border-top:1px solid #181b1f;background-color:#181b1f;text-align:right}.modal-footer::after{content:"";display:table;clear:both}.modal--narrow{max-width:500px}.confirm-modal{max-width:500px}.confirm-modal .confirm-modal-icon{padding-top:41px;font-size:280%;color:#1a7f4b;padding-bottom:20px}.confirm-modal .confirm-modal-text{font-size:1.2857142857rem;color:#ccccdc;margin-bottom:32px;padding-top:16px}.confirm-modal .confirm-modal-text2{font-size:14px;padding-top:16px}.confirm-modal .confirm-modal-buttons{margin-bottom:16px}.confirm-modal .confirm-modal-buttons button{margin-right:8px}.confirm-modal .modal-content-confirm-text{margin-bottom:32px}.confirm-modal .modal-content-confirm-text span{text-align:center}.share-modal-body .share-modal-options{margin:11px 0px 33px 0px;display:inline-block}.share-modal-body .share-modal-big-icon{margin-right:8px;margin-top:-7px}.share-modal-body .share-modal-info-text{margin-top:5px}.share-modal-body .share-modal-info-text strong{color:#fff;font-weight:500}.share-modal-body .share-modal-header{display:flex;margin:0px 0 22px 0}.share-modal-body .share-modal-content{flex-grow:1}.share-modal-body .share-modal-link{max-width:716px;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis}.dropup,.dropdown{position:relative}.dropdown-toggle:active,.open .dropdown-toggle{outline:0}.dropdown-desc{position:relative;top:-3px;width:250px;font-size:12px;margin-left:22px;color:#8e8e8e;white-space:normal}.caret{display:inline-block;width:0;height:0;vertical-align:top;border-top:4px solid rgba(204,204,220,.65);border-right:4px solid rgba(0,0,0,0);border-left:4px solid rgba(0,0,0,0);content:""}.dropdown .caret{margin-top:8px;margin-left:2px}.dropdown-menu{position:absolute;top:100%;left:0;z-index:1030;display:none;float:left;min-width:140px;margin:2px 0 0;list-style:none;background-color:#181b1f;border:1px solid rgba(204,204,220,.07);text-align:left}.dropdown-menu.pull-left{right:0;left:auto}.dropdown-menu .divider{height:1px;margin:8px 0;overflow:hidden;background-color:rgba(204,204,220,.07);border-bottom:1px solid rgba(204,204,220,.07)}.dropdown-menu>li>a,.dropdown-menu>li>button{display:block;padding:3px 20px 3px 15px;clear:both;font-weight:normal;line-height:1.5714285714;color:#ccccdc;white-space:nowrap}.dropdown-menu>li>a i,.dropdown-menu>li>button i{display:inline-block;margin-right:10px;color:rgba(204,204,220,.6);position:relative;top:3px}.dropdown-menu>li>a .gicon,.dropdown-menu>li>button .gicon{opacity:.7;width:18px;height:14px}.dropdown-menu--menu{background:#181b1f;box-shadow:0px 8px 24px #010409;margin-top:0px}.dropdown-menu--menu>li>a,.dropdown-menu--menu>li>button{display:flex;padding:5px 10px;border-left:2px solid rgba(0,0,0,0)}.dropdown-menu--menu>li>a:hover,.dropdown-menu--menu>li>button:hover{color:#fff;background:rgba(204,204,220,.16) !important}.dropdown-item-text{flex-grow:1}.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus,.dropdown-submenu:hover>a,.dropdown-submenu:focus>a,.dropdown-menu>li>button:hover,.dropdown-menu>li>button:focus,.dropdown-submenu:hover>button,.dropdown-submenu:focus>button{text-decoration:none;color:#fff;background-color:#343436}.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus,.dropdown-menu>.active>button,.dropdown-menu>.active>button:hover,.dropdown-menu>.active>button:focus{color:#fff;text-decoration:none;outline:0;background-color:#343436}.dropdown-menu>.disabled>a,.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus,.dropdown-menu>.disabled>button,.dropdown-menu>.disabled>button:hover,.dropdown-menu>.disabled>button:focus{color:#8e8e8e}.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus,.dropdown-menu>.disabled>button:hover,.dropdown-menu>.disabled>button:focus{text-decoration:none;background-color:rgba(0,0,0,0);background-image:none;cursor:default}.open>.dropdown-menu{display:block}.open>.dropdown>.dropdown-menu{display:block}.open.cascade-open .dropdown-menu{display:block}.dropdown-backdrop{position:fixed;left:0;right:0;bottom:0;top:0;z-index:1020}.pull-right>.dropdown-menu{left:100%;right:unset}.dropup .caret,.navbar-fixed-bottom .dropdown .caret{border-top:0;border-bottom:4px solid #000;content:""}.dropup .dropdown-menu,.navbar-fixed-bottom .dropdown .dropdown-menu{top:auto;bottom:0;margin-bottom:1px}.dropdown-submenu{position:relative}.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:0px;margin-left:-1px}.dropdown-submenu:hover>.dropdown-menu{display:block}.dropup .dropdown-submenu>.dropdown-menu{top:auto;bottom:0;margin-top:0;margin-bottom:-2px}.dropdown-submenu:hover>a::after,.dropdown-submenu:hover>button::after{border-left-color:#fff}.dropdown-submenu.pull-left{float:none !important}.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;width:100%;margin-left:2px}.dropdown-submenu.pull-right{float:none !important}.dropdown .dropdown-menu .nav-header{padding-left:20px;padding-right:20px}.typeahead{z-index:1030}.dropdown-menu-item-shortcut{display:block;margin-left:16px;color:rgba(204,204,220,.65);min-width:47px}.dropdown-menu.dropdown-menu--new li a,.dropdown-menu.dropdown-menu--new li button{padding:8px 16px;border-left:2px solid #181b1f;background:#181b1f}.dropdown-menu.dropdown-menu--new li a i,.dropdown-menu.dropdown-menu--new li button i{display:inline-block;padding-right:21px}.dropdown-menu.dropdown-menu--new li a:hover,.dropdown-menu.dropdown-menu--new li button:hover{color:#fff;background:#22252b}.page-dashboard .footer{display:none}.footer{color:#8e8e8e;padding:16px 0 16px 0;font-size:12px;position:relative;width:98%}.footer a{color:#8e8e8e}.footer a:hover{color:#d8d9da;text-decoration:underline}.footer a i{display:inline-block;padding-right:2px}.footer ul{list-style:none}.footer li{display:inline-block}.footer li::after{content:" | ";padding:0 8px}.footer li:last-child::after{padding-left:0;content:""}.login-page .footer{display:block;bottom:16px;position:absolute;padding:16px 0 16px 0;color:#ccccdc}.login-page .footer a{color:#ccccdc}.login-page .footer a:hover{color:#fff}@media(max-width: 991px){.login-page .footer{display:none}}.grafana-info-box{position:relative;padding:24px;background-color:#22252b;border-left:3px solid #3d71d9;margin-bottom:16px;margin-right:4px;box-shadow:none;flex-grow:1}.grafana-info-box h5{margin-bottom:16px}.grafana-info-box ul{padding-left:24px}.grafana-info-box code{font-family:"Roboto Mono",monospace;font-size:12px;background-color:#141414;color:#ccccdc;border:1px solid #343436;border-radius:4px}.grafana-info-box p:last-child{margin-bottom:0}.grafana-info-box--max-lg{max-width:992px}.grafana-info-box__close{text-align:center;display:block;color:#ccccdc !important;height:0;position:relative;top:-9px}.drop-element.drop-error{max-width:100%;max-height:100%}.drop-element.drop-error .drop-content{border-radius:6px;position:relative;font-weight:500;background:#d10e5c;color:#fff;padding:8px;word-wrap:break-word;max-width:280px;border:1px solid #d10e5c}.drop-element.drop-error .drop-content:before{content:"";display:block;position:absolute;width:0;height:0;border-color:rgba(0,0,0,0);border-width:10px;border-style:solid}.drop-element.drop-error.drop-wide .drop-content{max-width:560px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-center .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-center .drop-content:before{top:100%;left:50%;margin-left:-10px;border-top-color:#d10e5c}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-center .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-center .drop-content:before{bottom:100%;left:50%;margin-left:-10px;border-bottom-color:#d10e5c}.drop-element.drop-error.drop-element-attached-right.drop-element-attached-middle .drop-content{margin-right:10px}.drop-element.drop-error.drop-element-attached-right.drop-element-attached-middle .drop-content:before{left:100%;top:50%;margin-top:-10px;border-left-color:#d10e5c}.drop-element.drop-error.drop-element-attached-left.drop-element-attached-middle .drop-content{margin-left:10px}.drop-element.drop-error.drop-element-attached-left.drop-element-attached-middle .drop-content:before{right:100%;top:50%;margin-top:-10px;border-right-color:#d10e5c}.drop-element.drop-error.drop-element-attached-left.drop-target-attached-center .drop-content{left:-20px}.drop-element.drop-error.drop-element-attached-right.drop-target-attached-center .drop-content{left:20px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content:before{bottom:100%;left:10px;border-bottom-color:#d10e5c}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content:before{bottom:100%;right:10px;border-bottom-color:#d10e5c}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content:before{top:100%;left:10px;border-top-color:#d10e5c}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content:before{top:100%;right:10px;border-top-color:#d10e5c}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content:before{bottom:100%;left:10px;border-bottom-color:#d10e5c}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content:before{bottom:100%;right:10px;border-bottom-color:#d10e5c}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content:before{top:100%;left:10px;border-top-color:#d10e5c}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content:before{top:100%;right:10px;border-top-color:#d10e5c}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content:before{top:10px;left:100%;border-left-color:#d10e5c}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content:before{top:10px;right:100%;border-right-color:#d10e5c}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content:before{bottom:10px;left:100%;border-left-color:#d10e5c}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content:before{bottom:10px;right:100%;border-right-color:#d10e5c}.drop-element.drop-popover{max-width:100%;max-height:100%}.drop-element.drop-popover .drop-content{border-radius:6px;position:relative;font-weight:500;background:#181b1f;color:#ccccdc;padding:8px;word-wrap:break-word;max-width:280px;border:1px solid rgba(204,204,220,.07)}.drop-element.drop-popover .drop-content:before{content:"";display:block;position:absolute;width:0;height:0;border-color:rgba(0,0,0,0);border-width:10px;border-style:solid}.drop-element.drop-popover.drop-wide .drop-content{max-width:560px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-center .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-center .drop-content:before{top:100%;left:50%;margin-left:-10px;border-top-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-center .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-center .drop-content:before{bottom:100%;left:50%;margin-left:-10px;border-bottom-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-right.drop-element-attached-middle .drop-content{margin-right:10px}.drop-element.drop-popover.drop-element-attached-right.drop-element-attached-middle .drop-content:before{left:100%;top:50%;margin-top:-10px;border-left-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-left.drop-element-attached-middle .drop-content{margin-left:10px}.drop-element.drop-popover.drop-element-attached-left.drop-element-attached-middle .drop-content:before{right:100%;top:50%;margin-top:-10px;border-right-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-left.drop-target-attached-center .drop-content{left:-20px}.drop-element.drop-popover.drop-element-attached-right.drop-target-attached-center .drop-content{left:20px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content:before{bottom:100%;left:10px;border-bottom-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content:before{bottom:100%;right:10px;border-bottom-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content:before{top:100%;left:10px;border-top-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content:before{top:100%;right:10px;border-top-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content:before{bottom:100%;left:10px;border-bottom-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content:before{bottom:100%;right:10px;border-bottom-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content:before{top:100%;left:10px;border-top-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content:before{top:100%;right:10px;border-top-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content:before{top:10px;left:100%;border-left-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content:before{top:10px;right:100%;border-right-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content:before{bottom:10px;left:100%;border-left-color:rgba(204,204,220,.07)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content:before{bottom:10px;right:100%;border-right-color:rgba(204,204,220,.07)}.drop-element.drop-help{max-width:100%;max-height:100%}.drop-element.drop-help .drop-content{border-radius:6px;position:relative;font-weight:500;background:#22252b;color:#ccccdc;padding:8px;word-wrap:break-word;max-width:280px;border:1px solid #22252b}.drop-element.drop-help .drop-content:before{content:"";display:block;position:absolute;width:0;height:0;border-color:rgba(0,0,0,0);border-width:10px;border-style:solid}.drop-element.drop-help.drop-wide .drop-content{max-width:560px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-center .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-center .drop-content:before{top:100%;left:50%;margin-left:-10px;border-top-color:#22252b}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-center .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-center .drop-content:before{bottom:100%;left:50%;margin-left:-10px;border-bottom-color:#22252b}.drop-element.drop-help.drop-element-attached-right.drop-element-attached-middle .drop-content{margin-right:10px}.drop-element.drop-help.drop-element-attached-right.drop-element-attached-middle .drop-content:before{left:100%;top:50%;margin-top:-10px;border-left-color:#22252b}.drop-element.drop-help.drop-element-attached-left.drop-element-attached-middle .drop-content{margin-left:10px}.drop-element.drop-help.drop-element-attached-left.drop-element-attached-middle .drop-content:before{right:100%;top:50%;margin-top:-10px;border-right-color:#22252b}.drop-element.drop-help.drop-element-attached-left.drop-target-attached-center .drop-content{left:-20px}.drop-element.drop-help.drop-element-attached-right.drop-target-attached-center .drop-content{left:20px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content:before{bottom:100%;left:10px;border-bottom-color:#22252b}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content:before{bottom:100%;right:10px;border-bottom-color:#22252b}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content:before{top:100%;left:10px;border-top-color:#22252b}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content:before{top:100%;right:10px;border-top-color:#22252b}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content:before{bottom:100%;left:10px;border-bottom-color:#22252b}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content:before{bottom:100%;right:10px;border-bottom-color:#22252b}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content:before{top:100%;left:10px;border-top-color:#22252b}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content:before{top:100%;right:10px;border-top-color:#22252b}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content:before{top:10px;left:100%;border-left-color:#22252b}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content:before{top:10px;right:100%;border-right-color:#22252b}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content:before{bottom:10px;left:100%;border-left-color:#22252b}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content:before{bottom:10px;right:100%;border-right-color:#22252b}.drop-element.drop-help{transform:translateZ(0);transition:opacity 100ms;opacity:0}.drop-element.drop-help .drop-content{transition:transform .2s cubic-bezier(0, 0, 0.265, 1);transform:scale(0.8) translateZ(0)}.drop-element.drop-help.drop-open{display:none}.drop-element.drop-help.drop-open-transitionend{display:block}.drop-element.drop-help.drop-after-open{transition:none;opacity:1}.drop-element.drop-help.drop-after-open .drop-content{transform:scale(1) translateZ(0)}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-center .drop-content{transform-origin:50% calc(100% + 0%)}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-center .drop-content{transform-origin:50% 0%}.drop-element.drop-help.drop-element-attached-right.drop-element-attached-middle .drop-content{transform-origin:calc(100% + 0%) 50%}.drop-element.drop-help.drop-element-attached-left.drop-element-attached-middle .drop-content{transform-origin:-0% 50%}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{transform-origin:0 0%}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{transform-origin:100% 0%}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{transform-origin:0 calc(100% + 0%)}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{transform-origin:100% calc(100% + 0%)}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 0}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 0}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 100%}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 100%}.drop-element.drop-error{transform:translateZ(0);transition:opacity 100ms;opacity:0}.drop-element.drop-error .drop-content{transition:transform .2s cubic-bezier(0, 0, 0.265, 1);transform:scale(0.8) translateZ(0)}.drop-element.drop-error.drop-open{display:none}.drop-element.drop-error.drop-open-transitionend{display:block}.drop-element.drop-error.drop-after-open{transition:none;opacity:1}.drop-element.drop-error.drop-after-open .drop-content{transform:scale(1) translateZ(0)}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-center .drop-content{transform-origin:50% calc(100% + 0%)}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-center .drop-content{transform-origin:50% 0%}.drop-element.drop-error.drop-element-attached-right.drop-element-attached-middle .drop-content{transform-origin:calc(100% + 0%) 50%}.drop-element.drop-error.drop-element-attached-left.drop-element-attached-middle .drop-content{transform-origin:-0% 50%}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{transform-origin:0 0%}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{transform-origin:100% 0%}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{transform-origin:0 calc(100% + 0%)}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{transform-origin:100% calc(100% + 0%)}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 0}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 0}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 100%}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 100%}.drop-element.drop-popover{transform:translateZ(0);transition:opacity 100ms;opacity:0}.drop-element.drop-popover .drop-content{transition:transform .2s cubic-bezier(0, 0, 0.265, 1);transform:scale(0.8) translateZ(0)}.drop-element.drop-popover.drop-open{display:none}.drop-element.drop-popover.drop-open-transitionend{display:block}.drop-element.drop-popover.drop-after-open{transition:none;opacity:1}.drop-element.drop-popover.drop-after-open .drop-content{transform:scale(1) translateZ(0)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-center .drop-content{transform-origin:50% calc(100% + 0%)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-center .drop-content{transform-origin:50% 0%}.drop-element.drop-popover.drop-element-attached-right.drop-element-attached-middle .drop-content{transform-origin:calc(100% + 0%) 50%}.drop-element.drop-popover.drop-element-attached-left.drop-element-attached-middle .drop-content{transform-origin:-0% 50%}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{transform-origin:0 0%}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{transform-origin:100% 0%}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{transform-origin:0 calc(100% + 0%)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{transform-origin:100% calc(100% + 0%)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 0}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 0}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 100%}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 100%}.drop-element{z-index:10000;position:absolute;display:none;opacity:0}.drop-element.drop-open{display:block}.drop-element,.drop-element *{box-sizing:border-box}.drop-popover-close{position:absolute;top:-5px;right:0;font-size:18px}.drop-help a{color:#f4f5f8}.drop-help a:hover{color:#fff}.drop-hide-out-of-bounds.drop-open.drop-help.drop-out-of-bounds,.drop-hide-out-of-bounds.drop-open-transitionend.drop-help.drop-out-of-bounds{display:none}.drop-element.drop-popover .drop-content{box-shadow:0px 8px 24px #010409}.drop-element.drop-popover--form .drop-content{max-width:none;padding:0}.drop-element.drop-popover--annotation .drop-content{padding:0}.drop-popover.gf-color-picker .drop-content{width:210px}.drop-popover.drop-popover--transparent .drop-content{border:none;background:none;padding:0;max-width:none}.drop-popover.drop-popover--transparent .drop-content:before{display:none}.query-keyword{font-weight:500;color:#6e9fff !important}.query-segment-operator{color:#eb7b18 !important}.query-placeholder{color:#8e8e8e}.tight-form-func{background:#22252b}.tight-form-func.show-function-controls{padding-top:5px;min-width:100px;text-align:center}input[type=text].tight-form-func-param{font-size:12px;background:rgba(0,0,0,0);border:none;margin:0;padding:0}.tight-form-func-controls{text-align:center}.tight-form-func-controls .fa-arrow-left{float:left;position:relative;top:2px}.tight-form-func-controls .fa-arrow-right{float:right;position:relative;top:2px}.tight-form-func-controls .fa-remove{margin-left:10px}.grafana-metric-options{margin-top:25px}.tight-form-func{background:#22252b}.tight-form-func.show-function-controls{padding-top:5px;min-width:100px;text-align:center}.rst-text::before{content:" "}.rst-unknown.rst-directive{font-family:monospace;margin-bottom:16px;word-wrap:break-word}.rst-interpreted_text{font-family:monospace;display:inline}.rst-bullet-list{padding-left:24px;margin-bottom:16px}.rst-paragraph:last-child{margin-bottom:0}.drop-element.drop-popover.drop-function-def .drop-content{max-width:416px}.rst-literal-block .rst-text{display:block}.query-editor-row{margin-bottom:2px}.query-editor-row:hover .query-editor-row__actions{display:flex}.query-editor-row--disabled .query-keyword{color:rgba(204,204,220,.65)}.query-editor-row__action{margin-left:3px;background:rgba(0,0,0,0);border:none;box-shadow:none}.query-editor-row__action:hover{color:#ccccdc}.query-editor-row__body{margin:2px 0 10px 40px;background:#111217}.query-editor-row__body--collapsed{display:none}.tabbed-view{display:flex;flex-direction:column;height:100%;flex-grow:1}.tabbed-view.tabbed-view--new{padding:0 0 0 0;height:100%}.tabbed-view-header{box-shadow:inset 0px -4px 14px #1f1f20;border-bottom:1px solid #111217;padding:0 16px}.tabbed-view-header::after{content:"";display:table;clear:both}.tabbed-view-title{float:left;padding-top:8px;margin:0 48px 0 0}.tabbed-view-close-btn{float:right;margin:0;background-color:rgba(0,0,0,0);border:none;padding:10px 15px 9px;color:#ccccdc}.tabbed-view-close-btn i{font-size:120%}.tabbed-view-close-btn:hover{color:#fff}.tabbed-view-body{padding:32px 16px 16px 16px;display:flex;flex-direction:column;flex:1}.tabbed-view-body--small{min-height:0px;padding-bottom:0px}.section-heading{font-size:14px;margin-bottom:8px}.query-part{background-color:#22252b}.query-part.show-function-controls{padding-top:5px;min-width:100px;text-align:center}.query-part .query-part__last{display:none}.query-part:hover .query-part__last{display:inline}.query-part:hover{background:#282b31}.query-part__link{cursor:pointer}.query-part__link--no-value{color:rgba(204,204,220,.65)}json-tree .json-tree-key{vertical-align:middle}json-tree .expandable{position:relative}json-tree .expandable::before{pointer-events:none}json-tree .expandable::before,json-tree .expandable>.json-tree-key{cursor:pointer}json-tree .json-tree-branch-preview{display:inline-block;vertical-align:middle}json-tree ul{padding-left:16px}json-tree li,json-tree ul{list-style:none}json-tree li{line-height:18px}json-tree .json-tree-key{color:#6e9fff;padding:5px 10px 5px 15px}json-tree .json-tree-key::after{content:":"}json-tree json-node.expandable::before{content:"\u25B6";position:absolute;left:0px;font-size:8px;transition:transform .1s ease}json-tree json-node.expandable.expanded::before{transform:rotate(90deg)}json-tree .json-tree-leaf-value,json-tree .json-tree-branch-preview{word-break:break-all}json-tree .json-tree-branch-preview{overflow:hidden;font-style:italic;max-width:40%;height:1.5em;opacity:.7}.edit-tab-with-sidemenu{display:flex;flex-direction:row}.edit-tab-content{flex-grow:1;min-width:0}.edit-sidemenu-aside{margin-right:32px}.edit-sidemenu{width:100%;list-style:none}.edit-sidemenu li.active{border-image:linear-gradient(0.01deg, #F55F3E 0.01%, #FF8833 99.99%);border-image-slice:1;border-style:solid;border-top:0;border-right:0;border-bottom:0;border-left-width:2px}.edit-sidemenu a{display:block;color:#ccccdc;margin:0 0 1.5rem 1rem;white-space:nowrap}.column-styles-heading{border-bottom:1px solid #555}@media(max-width: 768px){.edit-tab-with-sidemenu{flex-direction:column}.edit-sidemenu-aside{width:100%;margin-bottom:2rem}.edit-sidemenu li{float:left}.edit-sidemenu a{margin:.3rem 1rem}}.dashboard-row{display:flex;align-items:center;height:100%}.dashboard-row--collapsed{background:#181b1f}.dashboard-row--collapsed .dashboard-row__panel_count{display:inline-block}.dashboard-row--collapsed .dashboard-row__drag{visibility:visible;opacity:1}.dashboard-row--collapsed .dashboard-row__toggle-target{flex:1;cursor:pointer;margin-right:15px}.dashboard-row:hover .dashboard-row__actions,.dashboard-row:focus-within .dashboard-row__actions{opacity:1}.dashboard-row__title{flex-grow:0;font-size:1.1428571429rem;font-weight:500;color:#ccccdc;background:rgba(0,0,0,0);border:none}.dashboard-row__title .fa{color:rgba(204,204,220,.65);font-size:10px;padding:0 8px}.dashboard-row__actions{color:rgba(204,204,220,.65);opacity:0;transition:200ms opacity ease-in 200ms}.dashboard-row__actions button{color:rgba(204,204,220,.65);padding-left:16px;background:rgba(0,0,0,0);border:none}.dashboard-row__actions button:hover{color:#fff}.dashboard-row__panel_count{padding-left:16px;color:rgba(204,204,220,.65);font-style:italic;font-size:12px;font-weight:normal;display:none}.dashboard-row__drag{cursor:move;width:16px;height:100%;background:url("../img/grab_dark.svg") no-repeat 50% 50%;background-size:8px;visibility:hidden;position:absolute;top:0;right:0}.json-formatter-row{font-family:monospace}.json-formatter-row,.json-formatter-row a,.json-formatter-row a:hover{color:#ccccdc;text-decoration:none}.json-formatter-row .json-formatter-row{margin-left:16px}.json-formatter-row .json-formatter-children.json-formatter-empty{opacity:.5;margin-left:16px}.json-formatter-row .json-formatter-children.json-formatter-empty::after{display:none}.json-formatter-row .json-formatter-children.json-formatter-empty.json-formatter-object::after{content:"No properties"}.json-formatter-row .json-formatter-children.json-formatter-empty.json-formatter-array::after{content:"[]"}.json-formatter-row .json-formatter-string{color:#23d662;white-space:pre-wrap;word-wrap:break-word;word-break:break-all}.json-formatter-row .json-formatter-number{color:#6e9fff}.json-formatter-row .json-formatter-boolean{color:#6e9fff}.json-formatter-row .json-formatter-null{color:#eec97d}.json-formatter-row .json-formatter-undefined{color:#ef8fbe}.json-formatter-row .json-formatter-function{color:#fd48cb}.json-formatter-row .json-formatter-date{background-color:fade(rgb(204, 204, 220), 5%)}.json-formatter-row .json-formatter-url{text-decoration:underline;color:#027bff;cursor:pointer}.json-formatter-row .json-formatter-bracket{color:#9494ff}.json-formatter-row .json-formatter-key{color:#23a0db;cursor:pointer;padding-right:2px;margin-right:4px}.json-formatter-row .json-formatter-constructor-name{cursor:pointer}.json-formatter-row .json-formatter-array-comma{margin-right:4px}.json-formatter-row .json-formatter-toggler{line-height:16px;font-size:10px;vertical-align:middle;opacity:.6;cursor:pointer;padding-right:2px}.json-formatter-row .json-formatter-toggler::after{display:inline-block;transition:transform 100ms ease-in;content:"\u25BA"}.json-formatter-row>a>.json-formatter-preview-text{opacity:0;transition:opacity .15s ease-in;font-style:italic}.json-formatter-row:hover>a>.json-formatter-preview-text{opacity:.6}.json-formatter-row.json-formatter-open>.json-formatter-toggler-link .json-formatter-toggler::after{transform:rotate(90deg)}.json-formatter-row.json-formatter-open>.json-formatter-children::after{display:inline-block}.json-formatter-row.json-formatter-open>a>.json-formatter-preview-text{display:none}.json-formatter-row.json-formatter-open.json-formatter-empty::after{display:block}.gf-code-editor{min-height:36px;min-width:280px;flex-grow:1;margin-right:4px}.gf-code-editor.ace_editor{font-family:"Roboto Mono",monospace;font-size:14px;min-height:50px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;border:1px solid rgba(204,204,220,.15)}.gf-code-editor .ace_content{z-index:0}.ace_editor.ace_autocomplete{font-family:"Roboto Mono",monospace;font-size:14px;background-color:#181b1f !important;color:#ccccdc !important;border:1px solid rgba(204,204,220,.07) !important;width:550px !important}.ace_editor.ace_autocomplete .ace_scroller .ace_selected,.ace_editor.ace_autocomplete .ace_scroller .ace_active-line,.ace_editor.ace_autocomplete .ace_scroller .ace_line-hover{color:#fff;background-color:#343436 !important}.ace_editor.ace_autocomplete .ace_scroller .ace_line-hover{border-color:rgba(0,0,0,0)}.ace_editor.ace_autocomplete .ace_scroller .ace_completion-highlight{color:#ecbb13}.ace_editor.ace_autocomplete .ace_scroller .ace_rightAlignedText{color:rgba(204,204,220,.65);z-index:0}.ace_tooltip.ace_doc-tooltip{font-family:"Roboto Mono",monospace;font-size:12px;background-color:#22252b;color:#ccccdc;background-image:none;border:1px solid rgba(204,204,220,.07);padding:8px 16px}.ace_tooltip.ace_doc-tooltip hr{background-color:#ccccdc;margin:8px 0}.ace_tooltip.ace_doc-tooltip code{padding:0px 1px;margin:0px}.ace_tooltip{border-radius:3px}.ace_hidden-cursors .ace_cursor{opacity:0 !important}.react-grid-layout{position:relative;transition:height 200ms ease}.react-grid-item{transition:all 200ms ease;transition-property:left,top}.react-grid-item img{pointer-events:none;user-select:none}.react-grid-item.cssTransforms{transition-property:transform}.react-grid-item.resizing{z-index:1;will-change:width,height}.react-grid-item.react-draggable-dragging{transition:none;z-index:3;will-change:transform}.react-grid-item.dropping{visibility:hidden}.react-grid-item.react-grid-placeholder{background:red;opacity:.2;transition-duration:100ms;z-index:2;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.react-grid-item>.react-resizable-handle{position:absolute;width:20px;height:20px}.react-grid-item>.react-resizable-handle::after{content:"";position:absolute;right:3px;bottom:3px;width:5px;height:5px;border-right:2px solid rgba(0, 0, 0, 0.4);border-bottom:2px solid rgba(0, 0, 0, 0.4)}.react-resizable-hide>.react-resizable-handle{display:none}.react-grid-item>.react-resizable-handle.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-w,.react-grid-item>.react-resizable-handle.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-n,.react-grid-item>.react-resizable-handle.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.react-resizable{position:relative}.react-resizable-handle{position:absolute;width:20px;height:20px;background-repeat:no-repeat;background-origin:content-box;box-sizing:border-box;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+");background-position:bottom right;padding:0 3px 3px 0}.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-resizable-handle-w,.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-resizable-handle-n,.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.react-resizable-handle{visibility:hidden}.react-grid-item,#grafana-portal-container{touch-action:initial !important}.react-grid-item:hover .react-resizable-handle,#grafana-portal-container:hover .react-resizable-handle{visibility:visible}.panel-in-fullscreen .react-grid-layout{height:auto !important}.panel-in-fullscreen .react-grid-item{display:none !important;transition-property:none !important}.panel-in-fullscreen .react-grid-item--fullscreen{display:block !important;position:unset !important;transform:translate(0px, 0px) !important}.panel-in-fullscreen .panel-header:hover{background-color:inherit}.panel-in-fullscreen .panel-title-container{cursor:pointer}.panel-in-fullscreen .react-resizable-handle{display:none}.panel-in-fullscreen .react-grid-layout{transition-property:none}@media(max-width: 768px){.react-grid-item{display:block !important;transition-property:none !important;position:unset !important;transform:translate(0px, 0px) !important;margin-bottom:16px}}.react-grid-item.react-grid-placeholder{box-shadow:0 0 4px #3274d9;background:#0a1f40;z-index:-1;opacity:unset}.theme-dark .react-grid-item>.react-resizable-handle::after{border-right:2px solid #555;border-bottom:2px solid #555}.theme-light .react-grid-item>.react-resizable-handle::after{border-right:2px solid #b3b3b3;border-bottom:2px solid #b3b3b3}.react-grid-item.resizing.panel,.react-grid-item.panel.dropdown-menu-open,.react-grid-item.react-draggable-dragging.panel{z-index:1030}.react-grid-item.cssTransforms{transition-property:none}.animated .react-grid-item.cssTransforms{transition-property:transform}.dashboard-list .search-results-container{padding:5px 0 0 0}.search-results{margin-top:32px}.search-results-filter-row{height:35px;display:flex;justify-content:space-between;align-items:center}.search-results-filter-row .gf-form-button-row{padding-top:0}.search-results-filter-row .gf-form-button-row button:last-child{margin-right:0}.search-results-filter-row__filters{display:flex}.search-results-filter-row__filters-item{width:150px;margin-right:0}.page-header{margin-top:16px}.page-header .btn{float:right;margin-left:16px}.page-header .btn .fa{position:relative;top:1px}@media(min-width: 769px){.page-header{margin-top:0}}.page-header__inner{flex-grow:1;display:flex;padding:24px 0}.page-header__title{font-size:1.7142857143rem;margin-bottom:1px;padding-top:16px}.page-header__img{position:relative;top:10px;height:50px}.page-header__icon{font-size:50px;width:50px;height:50px;position:relative;color:rgba(204,204,220,.65)}.page-header__icon.fa{top:10px}.page-header__icon.gicon{top:10px}.page-header__icon.icon-gf{top:3px}.page-header__logo{margin:-1px 16px -1px 0;color:rgba(204,204,220,.65)}.page-header__sub-title{color:rgba(204,204,220,.65)}.page-header-stamps-type{color:rgba(204,204,220,.6);text-transform:uppercase}.page-header__select-nav{margin-bottom:10px;max-width:100%}@media(min-width: 992px){.page-header__select-nav{display:none}}.page-header__link{color:#ccccdc;text-decoration:underline}.page-header__tabs{display:none}@media(min-width: 992px){.page-header__tabs{display:block}}.page-breadcrumbs{display:flex;padding:10px 0;line-height:.5}.breadcrumb{display:inline-block;box-shadow:0 0 15px 1px rgba(0,0,0,.35);overflow:hidden;border-radius:5px;counter-reset:flag}.dashboard-settings{position:fixed;height:100%;width:100%;top:0;left:0;right:0;bottom:0;z-index:1020;background:#111217;display:flex;flex-direction:column}.dashboard-settings__body{min-height:100%;width:100%;display:flex;flex-direction:row;background:#181b1f}.dashboard-settings__aside{display:flex;flex-direction:column;margin-top:16px}.dashboard-settings__aside-header{color:rgba(204,204,220,.65);font-size:1.5714285714rem;padding-right:60px;white-space:nowrap;margin-bottom:16px}.dashboard-settings__aside-header i{font-size:25px;position:relative;top:1px;padding-right:5px}.dashboard-settings__header{font-size:1.5714285714rem;margin-bottom:16px}.dashboard-settings__subheader{color:rgba(204,204,220,.65);font-style:italic}.dashboard-settings__nav-item{padding:8px 40px 8px 8px;color:rgba(204,204,220,.65);font-size:14px;line-height:20px;position:relative;border-left:2px solid rgba(0,0,0,0)}.dashboard-settings__nav-item.active{color:#ccccdc;font-weight:500}.dashboard-settings__nav-item.active::before{content:"";position:absolute;top:0;left:0;bottom:0;width:4px;border-radius:4px;background:linear-gradient(0.01deg, #F55F3E 0.01%, #FF8833 99.99%)}.dashboard-settings__nav-item .gicon{margin-bottom:2px;margin-right:4px}.dashboard-settings__nav-item .fa{font-size:17px;width:16px;margin-right:4px}.dashboard-settings__aside-actions{display:flex;flex-direction:column;height:100%;flex-grow:1;margin:40px 32px 0 0}.dashboard-settings__aside-actions button{margin-bottom:8px}.dashboard-settings__json-save-button{margin-top:16px}.toolbar{display:flex;align-content:center;align-items:center;padding:16px;position:relative;flex:0 0 auto}.toolbar__heading{font-size:18px;padding-right:20px}.toolbar__left{display:flex;flex-grow:1;align-items:center}.toolbar__main{padding:0 8px;font-size:14px;line-height:18px;color:#ccccdc;background-color:#111217;height:32px;border:1px solid rgba(204,204,220,.15);border-radius:2px;display:flex;align-items:center;cursor:pointer}.toolbar__main .fa{margin-left:20px;display:inline-block;position:relative}.toolbar__main-image{margin-right:10px;display:inline-block;width:20px;height:20px}.toolbar__close{flex-grow:1;text-align:left}.add-data-source-header{margin-bottom:32px;padding-top:16px;text-align:center}.add-data-source-search{display:flex;justify-content:center;margin-bottom:24px}.add-data-source-category{margin-bottom:16px}.add-data-source-category__header{font-size:1.1428571429rem;margin-bottom:8px}.add-data-source-item{padding:16px;display:flex;align-items:center;cursor:pointer;background:#111217;border:1px solid rgba(0,0,0,0);border-radius:3px;margin-bottom:2px}.add-data-source-item:hover{box-shadow:0 0 4px #6e9fff;background:#071124;border:1px solid #6e9fff;color:#fff}.add-data-source-item:hover .add-data-source-item-actions{opacity:1;transition:.15s opacity ease-in-out}.add-data-source-item-text-wrapper{display:flex;flex-direction:column;flex-grow:1}.add-data-source-item-desc{font-size:12px;color:rgba(204,204,220,.65)}.add-data-source-item-badge{margin-top:6px}.add-data-source-item-text{font-size:1.1428571429rem}.add-data-source-item-logo{margin-right:24px;margin-left:8px;width:55px;max-height:55px}.add-data-source-item-actions{opacity:0;padding-left:16px;display:flex;align-items:center}.add-data-source-item-actions>button{margin-left:16px;cursor:pointer}.add-datasource-item-actions__btn-icon{margin-left:8px}.add-data-source-more{text-align:center;margin:32px}.page-loader-wrapper{padding-top:100px;display:flex;align-items:center;justify-content:center;flex-direction:column}.page-loader-wrapper__spinner{font-size:32px;margin-bottom:8px}.page-loader-wrapper__text{font-size:14px}.toggle-button-group{display:flex}.toggle-button-group .btn{color:#ccccdc;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#2a2a2c;background-image:linear-gradient(to bottom, #262628, #303032);background-repeat:repeat-x;border-color:#262628;height:32px;padding:7px 10px;font-weight:500;font-size:12px;border-radius:0;border-right:1px solid #161719}.toggle-button-group .btn:hover,.toggle-button-group .btn:focus,.toggle-button-group .btn:active,.toggle-button-group .btn.active,.toggle-button-group .btn.disabled,.toggle-button-group .btn[disabled]{color:#ccccdc;background-image:none;background-color:#262628}.toggle-button-group .btn.active{background:linear-gradient(90deg, #eb7b18, #d44a3a);box-shadow:inset 0 0 4px #000;border-right:0;color:#fff}.toggle-button-group .btn.active:hover{cursor:default}.toggle-button-group .btn:first-child{border-radius:2px 0 0 2px;margin:0}.toggle-button-group .btn:last-child{border-radius:0 2px 2px 0;margin-left:0}.toggle-button-group--padded{padding-left:2px}.popover-box{background-color:#181b1f;color:#ccccdc;border:1px solid rgba(204,204,220,.07);border-radius:2px;max-width:500px}.popover-box__header{background-color:rgba(204,204,220,.07);padding:6px 10px;display:flex}.popover-box__title{font-weight:500;padding-right:16px;overflow:hidden;display:inline-block;white-space:nowrap;text-overflow:ellipsis;flex-grow:1}.popover-box__body{padding:20px 10px 10px 10px}.popover-box__close{cursor:pointer}.panel-header:hover{transition:background-color .1s ease-in-out;background-color:rgba(204,204,220,.16)}.panel-container--no-title .panel-header{position:absolute;left:min(50px,10%);right:min(50px,10%);z-index:10}.panel-container--no-title .panel-header:hover{left:0;right:0}.panel-container--no-title .panel-content{height:100%}.panel-title-container{cursor:move;word-wrap:break-word;display:block}.panel-title{border:0px;font-weight:500;position:relative;width:100%;display:flex;flex-wrap:nowrap;justify-content:center;height:32px;line-height:32px;align-items:center}.panel-menu-container{width:0px;height:19px;display:inline-block}.panel-menu-toggle{position:absolute;top:calc(50% - 9px);color:rgba(204,204,220,.65);cursor:pointer;margin:2px 0 0 2px;visibility:hidden;opacity:0}.panel-menu-toggle:hover{color:#fff}.panel-loading{position:absolute;top:0px;right:4px;z-index:11;font-size:18px;color:rgba(204,204,220,.65)}.panel-loading:hover{cursor:pointer}.panel-empty{display:flex;align-items:center;height:100%;width:100%}.panel-empty p{text-align:center;color:rgba(204,204,220,.65);font-size:18px;width:100%}.panel-menu{top:25px;left:-100px}.panel-info-corner-inner{width:0;height:0;position:absolute;left:0;bottom:0}.panel-info-corner{background:none;border:none;color:rgba(204,204,220,.65);cursor:pointer;position:absolute;display:none;left:0;width:32px;height:32px;z-index:2;top:0}.panel-info-corner .fa{position:absolute;top:6px;left:6px;font-size:75%;z-index:3}.panel-info-corner--info{display:block}.panel-info-corner--info .panel-info-corner-inner{border-left:32px solid #252a30;border-right:none;border-bottom:32px solid rgba(0,0,0,0)}.panel-info-corner--info .fa:before{content:"\uF129"}.panel-info-corner--links{display:block}.panel-info-corner--links .panel-info-corner-inner{border-left:32px solid #252a30;border-right:none;border-bottom:32px solid rgba(0,0,0,0)}.panel-info-corner--links .fa{left:4px}.panel-info-corner--links .fa:before{content:"\uF08E"}.panel-info-corner--error{display:block;color:#fff}.panel-info-corner--error .panel-info-corner-inner{border-left:32px solid #d10e5c;border-right:none;border-bottom:32px solid rgba(0,0,0,0)}.panel-info-corner--error .fa:before{content:"\uF12A"}.panel-info-content{overflow:auto}.panel-info-content code{white-space:normal;word-wrap:break-word}.panel-info-content pre>code{display:block}.panel-info-content .panel-info-corner-links{list-style:none;padding-left:0}.panel-time-info{font-weight:500;float:right;margin-right:8px;color:#33a2e5;font-size:85%;position:absolute;right:0}.rc-cascader{font-size:12px}.rc-cascader-dropdown{position:absolute;z-index:9999}.rc-cascader-dropdown-hidden{display:none}.rc-cascader-menus{overflow:hidden;background:#111217;border:1px solid rgba(204,204,220,.07);border-radius:2px;box-shadow:0 5px 10px 0 #000;white-space:nowrap}.rc-cascader-menus.slide-up-enter,.rc-cascader-menus.slide-up-appear{animation-duration:.3s;animation-fill-mode:both;transform-origin:0 0;opacity:0;animation-timing-function:cubic-bezier(0.08, 0.82, 0.17, 1);animation-play-state:paused}.rc-cascader-menus.slide-up-enter.slide-up-enter-active.rc-cascader-menus-placement-bottomLeft,.rc-cascader-menus.slide-up-appear.slide-up-appear-active.rc-cascader-menus-placement-bottomLeft{animation-name:SlideUpIn;animation-play-state:running}.rc-cascader-menus.slide-up-enter.slide-up-enter-active.rc-cascader-menus-placement-topLeft,.rc-cascader-menus.slide-up-appear.slide-up-appear-active.rc-cascader-menus-placement-topLeft{animation-name:SlideDownIn;animation-play-state:running}.rc-cascader-menus.slide-up-leave{animation-duration:.3s;animation-fill-mode:both;transform-origin:0 0;opacity:1;animation-timing-function:cubic-bezier(0.6, 0.04, 0.98, 0.34);animation-play-state:paused}.rc-cascader-menus.slide-up-leave.slide-up-leave-active.rc-cascader-menus-placement-bottomLeft{animation-name:SlideUpOut;animation-play-state:running}.rc-cascader-menus.slide-up-leave.slide-up-leave-active.rc-cascader-menus-placement-topLeft{animation-name:SlideDownOut;animation-play-state:running}.rc-cascader-menu{display:inline-block;max-width:50vw;height:192px;list-style:none;margin:0;padding:0;border-right:1px solid rgba(204,204,220,.07);overflow:auto}.rc-cascader-menu:last-child{border-right:0}.rc-cascader-menu-item{height:32px;line-height:32px;padding:0 2.5em 0 16px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all .3s ease;position:relative}.rc-cascader-menu-item:hover{background:rgba(204,204,220,.16)}.rc-cascader-menu-item-disabled{cursor:not-allowed;color:rgba(204,204,220,.65)}.rc-cascader-menu-item-disabled:hover{background:rgba(0,0,0,0)}.rc-cascader-menu-item-disabled:after{position:absolute;right:12px;content:"loading";color:rgba(204,204,220,.65);font-style:italic}.rc-cascader-menu-item-active{color:#fff;background:rgba(204,204,220,.12)}.rc-cascader-menu-item-active:hover{background:rgba(204,204,220,.16)}.rc-cascader-menu-item-expand{position:relative}.rc-cascader-menu-item-expand:after{content:">";font-size:12px;color:rgba(204,204,220,.65);position:absolute;right:16px;top:0;line-height:32px}@keyframes SlideUpIn{0%{opacity:0;transform-origin:0% 0%;transform:scaleY(0.8)}100%{opacity:1;transform-origin:0% 0%;transform:scaleY(1)}}@keyframes SlideUpOut{0%{opacity:1;transform-origin:0% 0%;transform:scaleY(1)}100%{opacity:0;transform-origin:0% 0%;transform:scaleY(0.8)}}@keyframes SlideDownIn{0%{opacity:0;transform-origin:0% 100%;transform:scaleY(0.8)}100%{opacity:1;transform-origin:0% 100%;transform:scaleY(1)}}@keyframes SlideDownOut{0%{opacity:1;transform-origin:0% 100%;transform:scaleY(1)}100%{opacity:0;transform-origin:0% 100%;transform:scaleY(0.8)}}.gf-form-select-box__control{width:100%;margin-right:4px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;background-color:#111217;border:1px solid rgba(204,204,220,.15);color:#ccccdc;cursor:default;height:32px;outline:none;overflow:hidden;position:relative}.gf-form-select-box__control--is-focused{background-color:#111217;border-color:#6e9fff;outline:none;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #6e9fff}.gf-form-select-box__control--is-disabled{background-color:rgba(204,204,220,.04)}.gf-form-select-box__control--menu-right .gf-form-select-box__menu{right:0;left:unset}.gf-form-select-box__input input{line-height:inherit}.gf-form-select-box__menu{background:#181b1f;box-shadow:0px 8px 24px #010409;position:absolute;z-index:1030;min-width:100%}.gf-form-select-box__menu-notice--no-options{background-color:#111217;padding:10px}.gf-form-select-box__menu-list{overflow-y:auto;max-height:300px;max-width:600px}.tag-filter .gf-form-select-box__menu{width:100%}.gf-form-select-box__multi-value{display:inline;margin:0 6px 0 0;cursor:pointer}.gf-form-select-box__multi-value__remove{text-align:center;display:inline-block;margin-left:2px;position:relative}.gf-form-select-box__multi-value__label{display:inline;vertical-align:middle}.gf-form-select-box__option{border-left:2px solid rgba(0,0,0,0);white-space:nowrap;background-color:#111217}.gf-form-select-box__option.gf-form-select-box__option--is-focused{color:#fff;background:rgba(204,204,220,.16);border-image:linear-gradient(0.01deg, #F55F3E 0.01%, #FF8833 99.99%);border-image-slice:1;border-style:solid;border-top:0;border-right:0;border-bottom:0;border-left-width:2px}.gf-form-select-box__option.gf-form-select-box__option--is-selected .fa{color:#fff}.gf-form-select-box__placeholder{color:rgba(204,204,220,.6)}.gf-form-select-box__control--is-focused .gf-form-select-box__placeholder{display:none}.gf-form-select-box__value-container{display:inline-block;padding:6px 20px 6px 10px;vertical-align:middle}.gf-form-select-box__value-container>div{display:inline-block;vertical-align:middle}.gf-form-select-box__indicators{position:absolute;height:100%;right:8px;top:1px;display:inline-block;text-align:right}.gf-form-input--form-dropdown{padding:0;border:0;overflow:visible;position:relative}.gf-form--has-input-icon .gf-form-select-box__value-container{padding-left:30px}.gf-form-select-box__desc-option{display:flex;align-items:center;justify-content:flex-start;justify-items:center;cursor:pointer;padding:7px 10px;width:100%}.gf-form-select-box__desc-option__body{display:flex;flex-direction:column;flex-grow:1;padding-right:10px;font-weight:500}.gf-form-select-box__desc-option__desc{font-weight:normal;font-size:12px;color:rgba(204,204,220,.65)}.gf-form-select-box__desc-option__img{width:16px;margin-right:10px}.gf-form-select-box__option-group__header{display:flex;align-items:center;justify-content:flex-start;justify-items:center;cursor:pointer;padding:7px 10px;width:100%;border-bottom:1px solid #343436;text-transform:capitalize}.gf-form-select-box__option-group__header .fa{padding-right:2px}.gf-form-select-box-button-select{height:auto}.select-button{display:flex;align-items:center}.rc-time-picker-input,.rc-time-picker-panel-input-wrap,.rc-time-picker-panel-inner{background-color:#111217;color:#ccccdc;border-color:rgba(204,204,220,.15);font-size:14px}.rc-time-picker-input{padding:0 8px;height:32px}.rc-time-picker-panel{width:176px}.rc-time-picker-panel-select{width:50%}.rc-time-picker-panel-select:only-child{width:100%}.rc-time-picker-panel-select .rc-time-picker-panel-select-option-selected{background-color:rgba(204,204,220,.16)}.rc-time-picker-panel-select li:hover{background-color:rgba(204,204,220,.16)}.rc-time-picker-panel-narrow{max-width:none}.uplot{font-family:inherit}.u-select{background:rgba(120,120,130,.2)}.u-cursor-x{border-right:1px dashed rgba(120,120,130,.5)}.u-cursor-y{width:100%;border-bottom:1px dashed rgba(120,120,130,.5)}.shared-crosshair:not(.plot-active) .u-cursor-pt{display:none !important}.login-form{margin-bottom:16px;width:100%}.panel{height:100%}.panel-height-helper{display:block;height:100%}.panel-container{background-color:#181b1f;border:1px solid rgba(204,204,220,.07);position:relative;border-radius:2px;height:100%;width:100%;display:flex;flex-direction:column;flex:1 1 0;box-shadow:none}.panel-container--transparent{background-color:rgba(0,0,0,0);border:1px solid rgba(0,0,0,0);box-shadow:none}.panel-container:hover .panel-menu-toggle{visibility:visible;transition:opacity .1s ease-in .2s;opacity:1}.panel-container--is-editing{height:auto}.panel-container--absolute{position:absolute}.panel-content{padding:8px;width:100%;flex-grow:1;contain:strict;height:calc(100% - 32px)}.panel-content--no-padding{padding:0}div.flot-text{color:#ccccdc !important}.dashboard-solo .footer,.dashboard-solo .sidemenu{display:none}.template-variable{color:#6e9fff}.panel-solo{position:fixed;bottom:0;right:0;margin:0;left:0;top:0;width:"100%";height:"100%"}.panel-solo .panel-container{border:none}.panel-solo .panel-menu-toggle,.panel-solo .panel-menu{display:none}.playlist-description{width:555px;margin-bottom:20px}.playlist-search-container{z-index:1000;position:relative;width:700px;box-shadow:0px 0px 55px 0px #000;background-color:#181b1f}.playlist-search-container .label-tag{margin-left:6px;font-size:11px;padding:2px 6px}.playlist-search-switches{position:absolute;top:8px;right:11px}.playlist-search-containerwrapper{margin-bottom:15px}.playlist-search-field-wrapper input{width:100%;padding:8px 8px;height:100%;box-sizing:border-box}.playlist-search-field-wrapper button{margin:0 4px 0 0}.playlist-search-field-wrapper>span{display:block;overflow:hidden}.playlist-search-results-container{min-height:100px;overflow:auto;display:block;line-height:28px}.playlist-search-results-container .search-item:hover,.playlist-search-results-container .search-item.selected{background-color:#282b31}.playlist-search-results-container .selected .search-result-tag{opacity:.7;color:#fff}.playlist-search-results-container .fa-star,.playlist-search-results-container .fa-star-o{padding-left:13px}.playlist-search-results-container .fa-star{color:#eb7b18}.playlist-search-results-container .search-result-link .fa{padding-right:10px}.playlist-search-results-container .search-item{display:block;padding:3px 10px;white-space:nowrap;background-color:#22252b;margin-bottom:4px}.playlist-search-results-container .search-item .search-result-icon:before{content:"\uF009"}.playlist-search-results-container .search-item.search-item-dash-home .search-result-icon:before{content:"\uF015"}.playlist-search-results-container .search-result-tags{float:right}.playlist-search-results-container .search-result-actions{float:right;padding-left:20px}.playlist-available-list td{line-height:28px;max-width:335px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.playlist-available-list .add-dashboard{text-align:center}.playlist-available-list .fa-star{color:#eb7b18}.playlist-column-header{border-bottom:thin solid #555;padding-bottom:3px;margin-bottom:15px}.selected-playlistitem-settings{text-align:right}.admin-settings-section{color:#6e9fff;font-weight:500}td.admin-settings-key{padding-left:20px}.admin-list-table{margin-bottom:20px}.admin-list-paging{float:right}.admin-list-paging li{display:inline-block;padding-left:10px;margin-bottom:5px}.admin-list-table .team-permissions{padding-right:120px}.alert-state-paused,.alert-state-pending{color:rgba(204,204,220,.65);font-weight:500}.alert-state-ok{color:#6ccf8e;font-weight:500}.alert-state-warning{color:#f8d06b;font-weight:500}.alert-state-critical{color:#ff5286;font-weight:500}.alert-notify-emails{width:400px;border-right:1px solid #000}.alert-notify-emails .bootstrap-tagsinput{width:394px}.alert-notify-emails .bootstrap-tagsinput input{border:0}.panel-alert-icon{display:none}.panel-has-alert .panel-alert-icon{display:inline-block}.panel-alert-state--alerting svg.panel-alert-icon{color:#ff5286;animation:alerting-panel 1s cubic-bezier(1, 0.1, 0.73, 1) 0s infinite alternate}.panel-alert-state--ok svg.panel-alert-icon{color:#6ccf8e}.panel-alert-state--pending svg.panel-alert-icon{color:#f8d06b}@keyframes alerting-panel{100%{transform:scale(1.2)}}.alert-rule-list{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;list-style-type:none}.alert-rule-item{display:flex;align-items:center;width:100%;height:100%;background:#22252b;box-shadow:none;padding:4px 8px;border-radius:4px;margin-bottom:4px}.alert-rule-item__body{display:flex;flex-direction:column;flex-grow:1;justify-content:center;overflow:hidden}.alert-rule-item__icon{display:flex;justify-content:center;align-items:center;width:40px;padding:0 4px 0 2px}.alert-rule-item__icon .icon-gf,.alert-rule-item__icon .fa{font-size:200%;position:relative;top:2px}.alert-rule-item__header{display:flex;flex-direction:column;justify-content:space-between}.alert-rule-item__name{font-size:14px;margin:0;font-weight:500}.alert-list__btn{margin:0 2px;display:flex;align-items:center;justify-content:center}.alert-rule-item__text{font-weight:bold;font-size:12px;margin:0}.alert-rule-item__time{color:rgba(204,204,220,.65);font-weight:normal;white-space:nowrap}.alert-rule-item__info{font-weight:normal;flex-grow:2;display:flex;align-items:flex-end}.alert-rule-item__actions{display:flex;align-items:center}.alert-tesint{display:flex}.diff-indent-0{padding-left:0px;margin-left:10px}.diff-indent-1{padding-left:21px;margin-left:10px}.diff-indent-2{padding-left:42px;margin-left:10px}.diff-indent-3{padding-left:63px;margin-left:10px}.diff-indent-4{padding-left:84px;margin-left:10px}.diff-indent-5{padding-left:105px;margin-left:10px}.diff-indent-6{padding-left:126px;margin-left:10px}.diff-indent-7{padding-left:147px;margin-left:10px}.diff-indent-8{padding-left:168px;margin-left:10px}.diff-indent-9{padding-left:189px;margin-left:10px}.diff-indent-10{padding-left:210px;margin-left:10px}.diff-indent-11{padding-left:231px;margin-left:10px}.diff-indent-12{padding-left:252px;margin-left:10px}.diff-indent-13{padding-left:273px;margin-left:10px}.diff-indent-14{padding-left:294px;margin-left:10px}.diff-indent-15{padding-left:315px;margin-left:10px}.diff-indent-16{padding-left:336px;margin-left:10px}.delta-html{background:#22252b;padding-top:5px;padding-bottom:5px;user-select:none}.diff-line{color:#ccccdc;font-family:"Roboto Mono",monospace;font-size:12px;line-height:2;margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:relative}.diff-line:after{left:-40px}.diff-line-number{color:rgba(204,204,220,.65);display:inline-block;font-size:10px;line-height:2.3;text-align:right;width:30px}.diff-line-number-hide{visibility:hidden}.diff-line-icon{color:#ececec;font-size:10px;float:right;position:relative;top:2px;right:10px}.diff-json-new,.diff-json-old,.diff-json-deleted,.diff-json-added{color:#ececec}.diff-json-new .diff-line-number,.diff-json-old .diff-line-number,.diff-json-deleted .diff-line-number,.diff-json-added .diff-line-number{color:#ccccdc}.diff-json-new{background-color:#457740}.diff-json-old{background-color:#a04338}.diff-json-added{background-color:#5a86de}.diff-json-deleted{background-color:#d73274}.diff-value{user-select:all}.diff-circle{margin-right:.5em}.diff-circle *{margin-bottom:1px}.diff-circle-changed{color:#f59433}.diff-circle-added{color:#29d761}.diff-circle-deleted{color:#fd474a}.diff-item-added,.diff-item-deleted{list-style:none}.diff-group{background:#22252b;font-size:16px;font-style:normal;padding:10px 15px;margin:16px 0}.diff-group .diff-group{padding:0 5px}.diff-group-name{display:inline-block;width:100%;font-size:16px;padding-left:1.75em;margin:0 0 14px 0}.diff-summary-key{padding-left:.25em}.diff-list{padding-left:40px}.diff-list .diff-list{padding-left:0}.diff-item{color:#8e8e8e;line-height:2.5}.diff-item>div{display:inline}.diff-item-changeset{list-style:none}.diff-label{background-color:rgba(204,204,220,.16);border-radius:3px;color:#fff;display:inline;font-size:14px;margin:0 5px;padding:3px 8px}.diff-linenum{float:right}.diff-arrow{color:#fff}.diff-block{width:100%;display:inline-block}.diff-block-title{font-size:16px;display:inline-block}.diff-title{font-size:16px}.diff-change-container{margin:0 0;padding-left:3em;padding-right:0}.diff-change-group{width:100%;color:#ccccdc;margin-bottom:14px}.diff-change-item{display:inline-block}.diff-change-title{font-size:16px}.bullet-position-container{position:relative;left:-6px}.diff-list-circle{margin-bottom:3px}.signup-page-container{position:fixed;top:0;left:0;right:0;bottom:0;height:100%;width:100%;background-image:url(/img/background_tease.jpg)}.signup-page-container .signup-logo-container{width:150px;margin:0 auto;padding:80px 0}.error-container{display:flex;flex-direction:row}.error-row{display:flex;flex-direction:row}.error-column{display:flex;flex-direction:column}.error-space-between{justify-content:space-between}.graph-box{width:62%;padding:32px 16px}.info-box{width:38%;padding:32px 16px}.graph-percentage{padding:0 0 18px}.image-box{padding:8px}.left-margin{padding:0 0 0 64px}.current-box{justify-content:flex-end}.current-text{color:#33a2e5;font-weight:bold;line-height:14px}.error-link{color:#eb7b18}.error-minus{color:#7eb26d;padding:0 8px;line-height:21px}.graph-percentage p{text-align:right;margin:0;line-height:14px}.graph-text{margin:0}@media(max-width: 768px){.graph-box{width:50%}.info-box{width:50%}}@media(max-width: 543px){.error-container{flex-direction:column}.graph-box{width:100%}.info-box{width:100%}.error-full-width{width:100%}}.explore-active-button{box-shadow:0px 0px 4px rgba(255,120,10,.5);border:1px solid #ff780a !important;color:#ff780a !important}.explore-input-margin{margin-right:4px}.graph-legend{flex-wrap:wrap}.query-row-break{flex-basis:100%}.explore .prom-query-field-info{margin:.25em .5em .5em;display:flex}.explore .prom-query-field-info details{margin-left:1em}.ReactTable{border:none}.ReactTable .rt-table{min-height:90px}.ReactTable .rt-thead.-header{box-shadow:none;background:#22252b;border-top:2px solid #111217;border-bottom:2px solid #111217;height:2em}.ReactTable .rt-thead.-header .rt-th{text-align:left;color:#33a2e5;font-weight:500}.ReactTable .rt-thead .rt-td,.ReactTable .rt-thead .rt-th{padding:.45em 0 .45em 1.1em;border-right:none;box-shadow:none}.ReactTable .rt-tbody .rt-td{padding:.45em 0 .45em 1.1em;border-bottom:2px solid #111217;border-right:2px solid #111217}.ReactTable .rt-tbody .rt-td:last-child{border-right:none}.ReactTable .-pagination{border-top:none;box-shadow:none;margin-top:8px}.ReactTable .-pagination .-btn{color:#33a2e5;background:#22252b}.ReactTable .-pagination input,.ReactTable .-pagination select{color:#ccccdc;background-color:#111217}.ReactTable .-loading{background:#111217}.ReactTable .-loading.-active{opacity:.8}.ReactTable .-loading>div{color:#ccccdc}.ReactTable .rt-tr .rt-td:last-child{text-align:right}.ReactTable .rt-noData{top:60px;z-index:inherit}.rc-cascader-menu-item-loading:after{position:absolute;right:12px;content:"loading";color:#767980;font-style:italic}.rc-cascader-menu{vertical-align:top;scrollbar-width:thin}.cheat-sheet-item{margin:24px 0}.cheat-sheet-item__title{font-size:1.5714285714rem}.cheat-sheet-item__example{margin:4px 0;text-align:left;border:none;background:rgba(0,0,0,0);display:block}.query-type-toggle{margin-left:5px}.query-type-toggle .btn.active{background-color:#111217;background-image:none;background-clip:padding-box;border:1px solid rgba(204,204,220,.15);border-radius:2px;box-shadow:none;color:#ccccdc}.sidebar-content{width:calc(100% - 210px)}@media(min-width: 769px){.sidebar-container{display:flex;flex-direction:row;flex-wrap:wrap}}@media(min-width: 769px){.page-sidebar{width:154px;margin-left:56px}}.page-sidebar-section{margin-bottom:32px}.get-more-plugins-link{color:#b3b3b3;font-size:12px;position:relative;top:16px}.get-more-plugins-link:hover{color:#fff}.get-more-plugins-link img{vertical-align:top}@media(max-width: 768px){.get-more-plugins-link{display:none}}.plugin-info-list-item{white-space:nowrap;max-width:154px;text-overflow:ellipsis;overflow:hidden}.plugin-info-list-item img,.plugin-info-list-item i{width:16px;margin-right:4px;margin-bottom:1px}.view-mode--inactive .react-resizable-handle,.view-mode--tv .react-resizable-handle,.view-mode--kiosk .react-resizable-handle,.view-mode--inactive .add-row-panel-hint,.view-mode--tv .add-row-panel-hint,.view-mode--kiosk .add-row-panel-hint,.view-mode--inactive .dash-row-menu-container,.view-mode--tv .dash-row-menu-container,.view-mode--kiosk .dash-row-menu-container,.view-mode--inactive .panel-info-corner--info,.view-mode--tv .panel-info-corner--info,.view-mode--kiosk .panel-info-corner--info,.view-mode--inactive .panel-info-corner--links,.view-mode--tv .panel-info-corner--links,.view-mode--kiosk .panel-info-corner--links{display:none}.view-mode--tv .sidemenu,.view-mode--kiosk .sidemenu{position:fixed;background-color:rgba(0,0,0,0);box-shadow:none}.view-mode--tv .sidemenu .sidemenu__top,.view-mode--kiosk .sidemenu .sidemenu__top,.view-mode--tv .sidemenu .sidemenu__bottom,.view-mode--kiosk .sidemenu .sidemenu__bottom,.view-mode--tv .sidemenu .sidemenu__logo_small_breakpoint,.view-mode--kiosk .sidemenu .sidemenu__logo_small_breakpoint{display:none}@media(max-width: 768px){.view-mode--tv .sidemenu .sidemenu__logo,.view-mode--kiosk .sidemenu .sidemenu__logo{display:block}}.view-mode--tv .page-toolbar,.view-mode--kiosk .page-toolbar{padding-left:60px}.view-mode--tv .page-toolbar--fullscreen,.view-mode--kiosk .page-toolbar--fullscreen{padding-left:16px}.view-mode--tv .submenu-controls,.view-mode--kiosk .submenu-controls{display:none}.view-mode--kiosk .sidemenu,.view-mode--kiosk .page-toolbar{display:none}.view-mode--kiosk .submenu-controls{display:none}@media(max-width: 768px){nav.page-toolbar--fullscreen{padding-left:16px}}`,""]),V.Z=c},"../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!./.storybook/grafana.light.scss":function(se,V,e){"use strict";var t=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/runtime/noSourceMaps.js"),n=e.n(t),a=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/runtime/api.js"),l=e.n(a),f=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!../../.yarn/__virtual__/rc-drawer-virtual-5d31b5508a/2/yarn/cache/rc-drawer-npm-6.1.3-ecc7753ecb-09fa308531.zip/node_modules/rc-drawer/assets/index.css"),x=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!../../.yarn/__virtual__/rc-time-picker-virtual-915362c357/2/yarn/cache/rc-time-picker-npm-3.7.3-0eb473aed2-9069ae590f.zip/node_modules/rc-time-picker/assets/index.css"),d=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!../../.yarn/__virtual__/rc-slider-virtual-872a602656/2/yarn/cache/rc-slider-npm-10.1.1-badf105b39-8df66142f1.zip/node_modules/rc-slider/assets/index.css"),i=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!../../../yarn/cache/uplot-npm-1.6.24-51171f5ab7-253e389dc6.zip/node_modules/uplot/dist/uPlot.min.css"),c=l()(n());c.i(f.Z),c.i(x.Z),c.i(d.Z),c.i(i.Z),c.push([se.id,`.hide-text{font:0/0 a;color:rgba(0,0,0,0);text-shadow:none;background-color:rgba(0,0,0,0);border:0}.input-block-level{display:block;width:100%;min-height:18px;box-sizing:border-box}.animate-height{max-height:0;overflow:hidden}.animate-height--open{max-height:1000px;overflow:auto;transition:max-height 250ms ease-in-out}@keyframes spin-clockwise{0%{transform:rotate(0deg) scaleX(-1)}100%{transform:rotate(359deg) scaleX(-1)}}.spin-clockwise{animation:spin-clockwise 3s infinite linear}/*! normalize.css commit fe56763 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:rgba(0,0,0,0)}a:active{outline:0}a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}@-ms-viewport{width:device-width}[tabindex="-1"]:focus{outline:none !important}html{font-size:14px;height:100%}body{font-family:"Inter","Helvetica","Arial",sans-serif;font-size:14px;line-height:1.5714285714;color:#24292e;background-color:#f4f5f5;height:100%;width:100%;position:absolute}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:8px}p{margin-top:0;margin-bottom:16px}abbr[title]{cursor:help;border-bottom:1px dotted #8e8e8e}address{margin-bottom:16px;font-style:normal;line-height:inherit}ol,ul,dl{margin-top:0;margin-bottom:0}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:500}dd{margin-bottom:8px;margin-left:0}blockquote{margin:0 0 16px}pre{margin-top:0;margin-bottom:16px}figure{margin:0 0 16px}img{vertical-align:middle}[role=button]{cursor:pointer}a,area,button,[role=button],input,label,select,summary,textarea{touch-action:manipulation}table{background-color:rgba(0,0,0,0)}caption{padding-top:4px 8px;padding-bottom:4px 8px;color:rgba(36,41,46,.75);text-align:left;caption-side:bottom}th{text-align:left}label{display:inline-block}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}input,button,select,textarea{margin:0;line-height:inherit;border-radius:0}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{display:block;width:100%;padding:0;margin-bottom:8px;font-size:24px;line-height:inherit}input[type=search]{-webkit-appearance:none}output{display:inline-block}[hidden]{display:none !important}hr{margin-top:16px;margin-bottom:16px;border:0;border-top:1px solid #d8d9da}small,.small{font-size:12px;font-weight:normal}.small-xs{font-size:10px}mark,.mark{background:#fad34a}h1,h2,h3,h4,h5,h6{font-weight:500}ul,ol{padding:0}ul ul,ul ol,ol ol,ol ul{margin-bottom:0}li{line-height:1.5714285714}ul.unstyled,ol.unstyled{margin-left:0;list-style:none}ul.inline,ol.inline{margin-left:0;list-style:none}ul.inline>li,ol.inline>li{display:inline-block;padding-left:5px;padding-right:5px}dl{margin-bottom:1.5714285714}dt,dd{line-height:1.5714285714}dt{font-weight:500}dd{margin-left:.7857142857}.dl-horizontal::after{content:"";display:table;clear:both}.dl-horizontal dt{float:left;width:160px;clear:left;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dl-horizontal dd{margin-left:180px}abbr[title]{cursor:help;border-bottom:1px dotted #8e8e8e}abbr.initialism{font-size:90%;text-transform:uppercase}blockquote{padding:0 0 0 15px;margin:0 0 1.5714285714;border-left:5px solid #b3b3b3}blockquote p{margin-bottom:0;font-size:17.5px;font-weight:300;line-height:1.25}blockquote small{display:block;line-height:1.5714285714;color:#8e8e8e}blockquote small:before{content:"\u2014\xA0"}blockquote.pull-right{float:right;padding-right:15px;padding-left:0;border-right:5px solid #b3b3b3;border-left:0}blockquote.pull-right p,blockquote.pull-right small{text-align:right}blockquote.pull-right small:before{content:""}blockquote.pull-right small:after{content:"\xA0\u2014"}q:before,q:after,blockquote:before,blockquote:after{content:""}address{display:block;margin-bottom:1.5714285714;font-style:normal;line-height:1.5714285714}a.external-link,.grafana-info-box a{color:#1f62e0;text-decoration:normal}a.external-link:hover,.grafana-info-box a:hover{color:#1f62e0;text-decoration:underline}.link{color:#24292e;cursor:pointer}.link:hover{color:#000}.pointer{cursor:pointer}.markdown-html img{max-width:100%}.markdown-html ul,.markdown-html ol{padding-left:24px;margin-bottom:16px}.markdown-html table{margin-bottom:16px}.markdown-html table td,.markdown-html table th{padding:4px 8px}.markdown-html table th{font-weight:500;background:#f4f5f5}.markdown-html table,.markdown-html th,.markdown-html td{border:1px solid rgba(36,41,46,.3);border-collapse:collapse}.markdown-html a{color:#1f62e0;text-decoration:none}.markdown-html a:hover{color:#1f62e0;text-decoration:underline}.markdown-html p:last-child{margin-bottom:0}.markdown-html table:last-child,.markdown-html ul:last-child,.markdown-html ol:last-child{margin-bottom:0}.no-wrap{white-space:nowrap}th{font-weight:500}canvas{display:block}select,input[type=file]{height:32px;line-height:32px}select{width:220px;border:1px solid rgba(36,41,46,.3);background-color:#fff}select[multiple],select[size]{height:auto}select:focus,input[type=file]:focus,input[type=radio]:focus,input[type=checkbox]:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}input::placeholder,textarea::placeholder{color:rgba(36,41,46,.5)}.input-mini{width:60px}.input-small{width:90px}.input-medium{width:150px}.input-large{width:210px}.input-xlarge{width:270px}.input-xxlarge{width:530px}input[disabled],select[disabled],textarea[disabled],input[readonly],select[readonly],textarea[readonly]{cursor:not-allowed;background-color:rgba(36,41,46,.04)}input[type=radio][disabled],input[type=checkbox][disabled],input[type=radio][readonly],input[type=checkbox][readonly]{cursor:not-allowed;background-color:rgba(0,0,0,0)}input[type=text].input-fluid{width:100%;box-sizing:border-box;padding:10px;font-size:16px;-moz-box-sizing:border-box;height:100%}input[type=checkbox].cr1{display:none}.editor-option label.cr1{display:inline-block;margin:5px 0 1px 0}label.cr1{display:inline-block;height:18px;position:relative;clear:none;text-indent:2px;margin:0 0 0px 0;padding:0 0 0 20px;vertical-align:top;background:url("../img/checkbox_white.png") left top no-repeat;cursor:pointer}input[type=checkbox].cr1:checked+label{background:url("../img/checkbox_white.png") 0px -18px no-repeat}.gf-fluid-input{border:none;display:block;overflow:hidden;padding-right:10px}.gf-fluid-input input[type=text]{width:100%;padding:5px 6px;height:100%;box-sizing:border-box}.gf-fluid-input textarea{width:100%;padding:5px 6px;height:100%;box-sizing:border-box}.form-control-success,.form-control-warning,.form-control-danger{padding-right:32px;background-repeat:no-repeat;background-position:center right 8px;background-size:16px 16px}.has-success .text-help,.has-success .form-control-label,.has-success .radio,.has-success .checkbox,.has-success .radio-inline,.has-success .checkbox-inline,.has-success.radio label,.has-success.checkbox label,.has-success.radio-inline label,.has-success.checkbox-inline label,.has-success .custom-control{color:#1b855e}.has-success .form-control{border-color:#1b855e}.has-success .input-group-addon{color:#1b855e;border-color:#1b855e;background-color:#86e6c3}.has-success .form-control-feedback{color:#1b855e}.has-success .form-control-success{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E")}.has-warning .text-help,.has-warning .form-control-label,.has-warning .radio,.has-warning .checkbox,.has-warning .radio-inline,.has-warning .checkbox-inline,.has-warning.radio label,.has-warning.checkbox label,.has-warning.radio-inline label,.has-warning.checkbox-inline label,.has-warning .custom-control{color:#fad34a}.has-warning .form-control{border-color:#fad34a}.has-warning .input-group-addon{color:#fad34a;border-color:#fad34a;background-color:#fff}.has-warning .form-control-feedback{color:#fad34a}.has-warning .form-control-warning{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f0ad4e' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E")}.has-danger .text-help,.has-danger .form-control-label,.has-danger .radio,.has-danger .checkbox,.has-danger .radio-inline,.has-danger .checkbox-inline,.has-danger.radio label,.has-danger.checkbox label,.has-danger.radio-inline label,.has-danger.checkbox-inline label,.has-danger .custom-control{color:#e0226e}.has-danger .form-control{border-color:#e0226e}.has-danger .input-group-addon{color:#e0226e;border-color:#e0226e;background-color:#f9d5e3}.has-danger .form-control-feedback{color:#e0226e}.has-danger .form-control-danger{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E")}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill,textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-box-shadow:0 0 0px 1000px #fff inset !important;-webkit-text-fill-color:#24292e !important;box-shadow:0 0 0px 1000px #fff inset;border:1px solid #fff}.container{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px}@media(min-width: 544px){.container{max-width:576px}}@media(min-width: 769px){.container{max-width:720px}}@media(min-width: 992px){.container{max-width:940px}}@media(min-width: 1200px){.container{max-width:1080px}}.container-fluid{margin-left:auto;margin-right:auto;padding-left:16px;padding-right:16px}.row{display:flex;flex-wrap:wrap;margin-left:-16px;margin-right:-16px}@media(min-width: 0px){.col-xs{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-xs-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-xs-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-xs-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-xs-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-xs-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-xs-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-xs-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-xs-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-xs-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-xs-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-xs-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-xs-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-xs-0{right:auto}.pull-xs-1{right:8.3333333333%}.pull-xs-2{right:16.6666666667%}.pull-xs-3{right:25%}.pull-xs-4{right:33.3333333333%}.pull-xs-5{right:41.6666666667%}.pull-xs-6{right:50%}.pull-xs-7{right:58.3333333333%}.pull-xs-8{right:66.6666666667%}.pull-xs-9{right:75%}.pull-xs-10{right:83.3333333333%}.pull-xs-11{right:91.6666666667%}.pull-xs-12{right:100%}.push-xs-0{left:auto}.push-xs-1{left:8.3333333333%}.push-xs-2{left:16.6666666667%}.push-xs-3{left:25%}.push-xs-4{left:33.3333333333%}.push-xs-5{left:41.6666666667%}.push-xs-6{left:50%}.push-xs-7{left:58.3333333333%}.push-xs-8{left:66.6666666667%}.push-xs-9{left:75%}.push-xs-10{left:83.3333333333%}.push-xs-11{left:91.6666666667%}.push-xs-12{left:100%}.offset-xs-1{margin-left:8.3333333333%}.offset-xs-2{margin-left:16.6666666667%}.offset-xs-3{margin-left:25%}.offset-xs-4{margin-left:33.3333333333%}.offset-xs-5{margin-left:41.6666666667%}.offset-xs-6{margin-left:50%}.offset-xs-7{margin-left:58.3333333333%}.offset-xs-8{margin-left:66.6666666667%}.offset-xs-9{margin-left:75%}.offset-xs-10{margin-left:83.3333333333%}.offset-xs-11{margin-left:91.6666666667%}}@media(min-width: 544px){.col-sm{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-sm-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-sm-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-sm-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-sm-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-sm-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-sm-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-sm-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-sm-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-sm-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-sm-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-sm-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-sm-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-sm-0{right:auto}.pull-sm-1{right:8.3333333333%}.pull-sm-2{right:16.6666666667%}.pull-sm-3{right:25%}.pull-sm-4{right:33.3333333333%}.pull-sm-5{right:41.6666666667%}.pull-sm-6{right:50%}.pull-sm-7{right:58.3333333333%}.pull-sm-8{right:66.6666666667%}.pull-sm-9{right:75%}.pull-sm-10{right:83.3333333333%}.pull-sm-11{right:91.6666666667%}.pull-sm-12{right:100%}.push-sm-0{left:auto}.push-sm-1{left:8.3333333333%}.push-sm-2{left:16.6666666667%}.push-sm-3{left:25%}.push-sm-4{left:33.3333333333%}.push-sm-5{left:41.6666666667%}.push-sm-6{left:50%}.push-sm-7{left:58.3333333333%}.push-sm-8{left:66.6666666667%}.push-sm-9{left:75%}.push-sm-10{left:83.3333333333%}.push-sm-11{left:91.6666666667%}.push-sm-12{left:100%}.offset-sm-0{margin-left:0%}.offset-sm-1{margin-left:8.3333333333%}.offset-sm-2{margin-left:16.6666666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.3333333333%}.offset-sm-5{margin-left:41.6666666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.3333333333%}.offset-sm-8{margin-left:66.6666666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.3333333333%}.offset-sm-11{margin-left:91.6666666667%}}@media(min-width: 769px){.col-md{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-md-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-md-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-md-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-md-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-md-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-md-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-md-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-md-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-md-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-md-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-md-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-md-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-md-0{right:auto}.pull-md-1{right:8.3333333333%}.pull-md-2{right:16.6666666667%}.pull-md-3{right:25%}.pull-md-4{right:33.3333333333%}.pull-md-5{right:41.6666666667%}.pull-md-6{right:50%}.pull-md-7{right:58.3333333333%}.pull-md-8{right:66.6666666667%}.pull-md-9{right:75%}.pull-md-10{right:83.3333333333%}.pull-md-11{right:91.6666666667%}.pull-md-12{right:100%}.push-md-0{left:auto}.push-md-1{left:8.3333333333%}.push-md-2{left:16.6666666667%}.push-md-3{left:25%}.push-md-4{left:33.3333333333%}.push-md-5{left:41.6666666667%}.push-md-6{left:50%}.push-md-7{left:58.3333333333%}.push-md-8{left:66.6666666667%}.push-md-9{left:75%}.push-md-10{left:83.3333333333%}.push-md-11{left:91.6666666667%}.push-md-12{left:100%}.offset-md-0{margin-left:0%}.offset-md-1{margin-left:8.3333333333%}.offset-md-2{margin-left:16.6666666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.3333333333%}.offset-md-5{margin-left:41.6666666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.3333333333%}.offset-md-8{margin-left:66.6666666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.3333333333%}.offset-md-11{margin-left:91.6666666667%}}@media(min-width: 992px){.col-lg{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-lg-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-lg-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-lg-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-lg-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-lg-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-lg-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-lg-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-lg-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-lg-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-lg-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-lg-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-lg-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-lg-0{right:auto}.pull-lg-1{right:8.3333333333%}.pull-lg-2{right:16.6666666667%}.pull-lg-3{right:25%}.pull-lg-4{right:33.3333333333%}.pull-lg-5{right:41.6666666667%}.pull-lg-6{right:50%}.pull-lg-7{right:58.3333333333%}.pull-lg-8{right:66.6666666667%}.pull-lg-9{right:75%}.pull-lg-10{right:83.3333333333%}.pull-lg-11{right:91.6666666667%}.pull-lg-12{right:100%}.push-lg-0{left:auto}.push-lg-1{left:8.3333333333%}.push-lg-2{left:16.6666666667%}.push-lg-3{left:25%}.push-lg-4{left:33.3333333333%}.push-lg-5{left:41.6666666667%}.push-lg-6{left:50%}.push-lg-7{left:58.3333333333%}.push-lg-8{left:66.6666666667%}.push-lg-9{left:75%}.push-lg-10{left:83.3333333333%}.push-lg-11{left:91.6666666667%}.push-lg-12{left:100%}.offset-lg-0{margin-left:0%}.offset-lg-1{margin-left:8.3333333333%}.offset-lg-2{margin-left:16.6666666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.3333333333%}.offset-lg-5{margin-left:41.6666666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.3333333333%}.offset-lg-8{margin-left:66.6666666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.3333333333%}.offset-lg-11{margin-left:91.6666666667%}}@media(min-width: 1200px){.col-xl{position:relative;flex-basis:0;flex-grow:1;max-width:100%;min-height:1px;padding-right:16px;padding-left:16px}.col-xl-1{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-xl-2{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-xl-3{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 25%;max-width:25%}.col-xl-4{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-xl-5{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-xl-6{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 50%;max-width:50%}.col-xl-7{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-xl-8{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-xl-9{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 75%;max-width:75%}.col-xl-10{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-xl-11{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-xl-12{position:relative;min-height:1px;padding-right:16px;padding-left:16px;flex:0 0 100%;max-width:100%}.pull-xl-0{right:auto}.pull-xl-1{right:8.3333333333%}.pull-xl-2{right:16.6666666667%}.pull-xl-3{right:25%}.pull-xl-4{right:33.3333333333%}.pull-xl-5{right:41.6666666667%}.pull-xl-6{right:50%}.pull-xl-7{right:58.3333333333%}.pull-xl-8{right:66.6666666667%}.pull-xl-9{right:75%}.pull-xl-10{right:83.3333333333%}.pull-xl-11{right:91.6666666667%}.pull-xl-12{right:100%}.push-xl-0{left:auto}.push-xl-1{left:8.3333333333%}.push-xl-2{left:16.6666666667%}.push-xl-3{left:25%}.push-xl-4{left:33.3333333333%}.push-xl-5{left:41.6666666667%}.push-xl-6{left:50%}.push-xl-7{left:58.3333333333%}.push-xl-8{left:66.6666666667%}.push-xl-9{left:75%}.push-xl-10{left:83.3333333333%}.push-xl-11{left:91.6666666667%}.push-xl-12{left:100%}.offset-xl-0{margin-left:0%}.offset-xl-1{margin-left:8.3333333333%}.offset-xl-2{margin-left:16.6666666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.3333333333%}.offset-xl-5{margin-left:41.6666666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.3333333333%}.offset-xl-8{margin-left:66.6666666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.3333333333%}.offset-xl-11{margin-left:91.6666666667%}}/*!
 *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */@font-face{font-family:"FontAwesome";src:url("./public/fonts/fontawesome-webfont.eot?v=4.7.0");src:url("./public/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"),url("./public/fonts/fontawesome-webfont.woff2?v=4.7.0") format("woff2"),url("./public/fonts/fontawesome-webfont.woff?v=4.7.0") format("woff"),url("./public/fonts/fontawesome-webfont.ttf?v=4.7.0") format("truetype"),url("./public/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");font-weight:normal;font-style:normal}.fa{display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.3333333333em;line-height:.75em;vertical-align:-15%}.fa-2x{font-size:2em !important}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.2857142857em;text-align:center}.fa-ul{padding-left:0;margin-left:2.1428571429em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.1428571429em;width:2.1428571429em;top:.1428571429em;text-align:center}.fa-li.fa-lg{left:-1.8571428571em}.fa-border{padding:.2em .25em .15em;border:solid .08em #eee;border-radius:.1em}.fa-pull-left{float:left}.fa-pull-right{float:right}.fa.fa-pull-left{margin-right:.3em}.fa.fa-pull-right{margin-left:.3em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:fa-spin 2s infinite linear;animation:fa-spin 2s infinite linear}.fa-pulse{-webkit-animation:fa-spin 1s infinite steps(8);animation:fa-spin 1s infinite steps(8)}@-webkit-keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes fa-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fa-rotate-90{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";-webkit-transform:scale(-1, 1);-ms-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";-webkit-transform:scale(1, -1);-ms-transform:scale(1, -1);transform:scale(1, -1)}:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270,:root .fa-flip-horizontal,:root .fa-flip-vertical{filter:none}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\uF000"}.fa-music:before{content:"\uF001"}.fa-search:before{content:"\uF002"}.fa-envelope-o:before{content:"\uF003"}.fa-heart:before{content:"\uF004"}.fa-star:before{content:"\uF005"}.fa-star-o:before{content:"\uF006"}.fa-user:before{content:"\uF007"}.fa-film:before{content:"\uF008"}.fa-th-large:before{content:"\uF009"}.fa-th:before{content:"\uF00A"}.fa-th-list:before{content:"\uF00B"}.fa-check:before{content:"\uF00C"}.fa-remove:before,.fa-close:before,.fa-times:before{content:"\uF00D"}.fa-search-plus:before{content:"\uF00E"}.fa-search-minus:before{content:"\uF010"}.fa-power-off:before{content:"\uF011"}.fa-signal:before{content:"\uF012"}.fa-gear:before,.fa-cog:before{content:"\uF013"}.fa-trash-o:before{content:"\uF014"}.fa-home:before{content:"\uF015"}.fa-file-o:before{content:"\uF016"}.fa-clock-o:before{content:"\uF017"}.fa-road:before{content:"\uF018"}.fa-download:before{content:"\uF019"}.fa-arrow-circle-o-down:before{content:"\uF01A"}.fa-arrow-circle-o-up:before{content:"\uF01B"}.fa-inbox:before{content:"\uF01C"}.fa-play-circle-o:before{content:"\uF01D"}.fa-rotate-right:before,.fa-repeat:before{content:"\uF01E"}.fa-refresh:before{content:"\uF021"}.fa-list-alt:before{content:"\uF022"}.fa-lock:before{content:"\uF023"}.fa-flag:before{content:"\uF024"}.fa-headphones:before{content:"\uF025"}.fa-volume-off:before{content:"\uF026"}.fa-volume-down:before{content:"\uF027"}.fa-volume-up:before{content:"\uF028"}.fa-qrcode:before{content:"\uF029"}.fa-barcode:before{content:"\uF02A"}.fa-tag:before{content:"\uF02B"}.fa-tags:before{content:"\uF02C"}.fa-book:before{content:"\uF02D"}.fa-bookmark:before{content:"\uF02E"}.fa-print:before{content:"\uF02F"}.fa-camera:before{content:"\uF030"}.fa-font:before{content:"\uF031"}.fa-bold:before{content:"\uF032"}.fa-italic:before{content:"\uF033"}.fa-text-height:before{content:"\uF034"}.fa-text-width:before{content:"\uF035"}.fa-align-left:before{content:"\uF036"}.fa-align-center:before{content:"\uF037"}.fa-align-right:before{content:"\uF038"}.fa-align-justify:before{content:"\uF039"}.fa-list:before{content:"\uF03A"}.fa-dedent:before,.fa-outdent:before{content:"\uF03B"}.fa-indent:before{content:"\uF03C"}.fa-video-camera:before{content:"\uF03D"}.fa-photo:before,.fa-image:before,.fa-picture-o:before{content:"\uF03E"}.fa-pencil:before{content:"\uF040"}.fa-map-marker:before{content:"\uF041"}.fa-adjust:before{content:"\uF042"}.fa-tint:before{content:"\uF043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\uF044"}.fa-share-square-o:before{content:"\uF045"}.fa-check-square-o:before{content:"\uF046"}.fa-arrows:before{content:"\uF047"}.fa-step-backward:before{content:"\uF048"}.fa-fast-backward:before{content:"\uF049"}.fa-backward:before{content:"\uF04A"}.fa-play:before{content:"\uF04B"}.fa-pause:before{content:"\uF04C"}.fa-stop:before{content:"\uF04D"}.fa-forward:before{content:"\uF04E"}.fa-fast-forward:before{content:"\uF050"}.fa-step-forward:before{content:"\uF051"}.fa-eject:before{content:"\uF052"}.fa-chevron-left:before{content:"\uF053"}.fa-chevron-right:before{content:"\uF054"}.fa-plus-circle:before{content:"\uF055"}.fa-minus-circle:before{content:"\uF056"}.fa-times-circle:before{content:"\uF057"}.fa-check-circle:before{content:"\uF058"}.fa-question-circle:before{content:"\uF059"}.fa-info-circle:before{content:"\uF05A"}.fa-crosshairs:before{content:"\uF05B"}.fa-times-circle-o:before{content:"\uF05C"}.fa-check-circle-o:before{content:"\uF05D"}.fa-ban:before{content:"\uF05E"}.fa-arrow-left:before{content:"\uF060"}.fa-arrow-right:before{content:"\uF061"}.fa-arrow-up:before{content:"\uF062"}.fa-arrow-down:before{content:"\uF063"}.fa-mail-forward:before,.fa-share:before{content:"\uF064"}.fa-expand:before{content:"\uF065"}.fa-compress:before{content:"\uF066"}.fa-plus:before{content:"\uF067"}.fa-minus:before{content:"\uF068"}.fa-asterisk:before{content:"\uF069"}.fa-exclamation-circle:before{content:"\uF06A"}.fa-gift:before{content:"\uF06B"}.fa-leaf:before{content:"\uF06C"}.fa-fire:before{content:"\uF06D"}.fa-eye:before{content:"\uF06E"}.fa-eye-slash:before{content:"\uF070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\uF071"}.fa-plane:before{content:"\uF072"}.fa-calendar:before{content:"\uF073"}.fa-random:before{content:"\uF074"}.fa-comment:before{content:"\uF075"}.fa-magnet:before{content:"\uF076"}.fa-chevron-up:before{content:"\uF077"}.fa-chevron-down:before{content:"\uF078"}.fa-retweet:before{content:"\uF079"}.fa-shopping-cart:before{content:"\uF07A"}.fa-folder:before{content:"\uF07B"}.fa-folder-open:before{content:"\uF07C"}.fa-arrows-v:before{content:"\uF07D"}.fa-arrows-h:before{content:"\uF07E"}.fa-bar-chart-o:before,.fa-bar-chart:before{content:"\uF080"}.fa-twitter-square:before{content:"\uF081"}.fa-facebook-square:before{content:"\uF082"}.fa-camera-retro:before{content:"\uF083"}.fa-key:before{content:"\uF084"}.fa-gears:before,.fa-cogs:before{content:"\uF085"}.fa-comments:before{content:"\uF086"}.fa-thumbs-o-up:before{content:"\uF087"}.fa-thumbs-o-down:before{content:"\uF088"}.fa-star-half:before{content:"\uF089"}.fa-heart-o:before{content:"\uF08A"}.fa-sign-out:before{content:"\uF08B"}.fa-linkedin-square:before{content:"\uF08C"}.fa-thumb-tack:before{content:"\uF08D"}.fa-external-link:before{content:"\uF08E"}.fa-sign-in:before{content:"\uF090"}.fa-trophy:before{content:"\uF091"}.fa-github-square:before{content:"\uF092"}.fa-upload:before{content:"\uF093"}.fa-lemon-o:before{content:"\uF094"}.fa-phone:before{content:"\uF095"}.fa-square-o:before{content:"\uF096"}.fa-bookmark-o:before{content:"\uF097"}.fa-phone-square:before{content:"\uF098"}.fa-twitter:before{content:"\uF099"}.fa-facebook-f:before,.fa-facebook:before{content:"\uF09A"}.fa-github:before{content:"\uF09B"}.fa-unlock:before{content:"\uF09C"}.fa-credit-card:before{content:"\uF09D"}.fa-feed:before,.fa-rss:before{content:"\uF09E"}.fa-hdd-o:before{content:"\uF0A0"}.fa-bullhorn:before{content:"\uF0A1"}.fa-bell:before{content:"\uF0F3"}.fa-certificate:before{content:"\uF0A3"}.fa-hand-o-right:before{content:"\uF0A4"}.fa-hand-o-left:before{content:"\uF0A5"}.fa-hand-o-up:before{content:"\uF0A6"}.fa-hand-o-down:before{content:"\uF0A7"}.fa-arrow-circle-left:before{content:"\uF0A8"}.fa-arrow-circle-right:before{content:"\uF0A9"}.fa-arrow-circle-up:before{content:"\uF0AA"}.fa-arrow-circle-down:before{content:"\uF0AB"}.fa-globe:before{content:"\uF0AC"}.fa-wrench:before{content:"\uF0AD"}.fa-tasks:before{content:"\uF0AE"}.fa-filter:before{content:"\uF0B0"}.fa-briefcase:before{content:"\uF0B1"}.fa-arrows-alt:before{content:"\uF0B2"}.fa-group:before,.fa-users:before{content:"\uF0C0"}.fa-chain:before,.fa-link:before{content:"\uF0C1"}.fa-cloud:before{content:"\uF0C2"}.fa-flask:before{content:"\uF0C3"}.fa-cut:before,.fa-scissors:before{content:"\uF0C4"}.fa-copy:before,.fa-files-o:before{content:"\uF0C5"}.fa-paperclip:before{content:"\uF0C6"}.fa-save:before,.fa-floppy-o:before{content:"\uF0C7"}.fa-square:before{content:"\uF0C8"}.fa-navicon:before,.fa-reorder:before,.fa-bars:before{content:"\uF0C9"}.fa-list-ul:before{content:"\uF0CA"}.fa-list-ol:before{content:"\uF0CB"}.fa-strikethrough:before{content:"\uF0CC"}.fa-underline:before{content:"\uF0CD"}.fa-table:before{content:"\uF0CE"}.fa-magic:before{content:"\uF0D0"}.fa-truck:before{content:"\uF0D1"}.fa-pinterest:before{content:"\uF0D2"}.fa-pinterest-square:before{content:"\uF0D3"}.fa-google-plus-square:before{content:"\uF0D4"}.fa-google-plus:before{content:"\uF0D5"}.fa-money:before{content:"\uF0D6"}.fa-caret-down:before{content:"\uF0D7"}.fa-caret-up:before{content:"\uF0D8"}.fa-caret-left:before{content:"\uF0D9"}.fa-caret-right:before{content:"\uF0DA"}.fa-columns:before{content:"\uF0DB"}.fa-unsorted:before,.fa-sort:before{content:"\uF0DC"}.fa-sort-down:before,.fa-sort-desc:before{content:"\uF0DD"}.fa-sort-up:before,.fa-sort-asc:before{content:"\uF0DE"}.fa-envelope:before{content:"\uF0E0"}.fa-linkedin:before{content:"\uF0E1"}.fa-rotate-left:before,.fa-undo:before{content:"\uF0E2"}.fa-legal:before,.fa-gavel:before{content:"\uF0E3"}.fa-dashboard:before,.fa-tachometer:before{content:"\uF0E4"}.fa-comment-o:before{content:"\uF0E5"}.fa-comments-o:before{content:"\uF0E6"}.fa-flash:before,.fa-bolt:before{content:"\uF0E7"}.fa-sitemap:before{content:"\uF0E8"}.fa-umbrella:before{content:"\uF0E9"}.fa-paste:before,.fa-clipboard:before{content:"\uF0EA"}.fa-lightbulb-o:before{content:"\uF0EB"}.fa-exchange:before{content:"\uF0EC"}.fa-cloud-download:before{content:"\uF0ED"}.fa-cloud-upload:before{content:"\uF0EE"}.fa-user-md:before{content:"\uF0F0"}.fa-stethoscope:before{content:"\uF0F1"}.fa-suitcase:before{content:"\uF0F2"}.fa-bell-o:before{content:"\uF0A2"}.fa-coffee:before{content:"\uF0F4"}.fa-cutlery:before{content:"\uF0F5"}.fa-file-text-o:before{content:"\uF0F6"}.fa-building-o:before{content:"\uF0F7"}.fa-hospital-o:before{content:"\uF0F8"}.fa-ambulance:before{content:"\uF0F9"}.fa-medkit:before{content:"\uF0FA"}.fa-fighter-jet:before{content:"\uF0FB"}.fa-beer:before{content:"\uF0FC"}.fa-h-square:before{content:"\uF0FD"}.fa-plus-square:before{content:"\uF0FE"}.fa-angle-double-left:before{content:"\uF100"}.fa-angle-double-right:before{content:"\uF101"}.fa-angle-double-up:before{content:"\uF102"}.fa-angle-double-down:before{content:"\uF103"}.fa-angle-left:before{content:"\uF104"}.fa-angle-right:before{content:"\uF105"}.fa-angle-up:before{content:"\uF106"}.fa-angle-down:before{content:"\uF107"}.fa-desktop:before{content:"\uF108"}.fa-laptop:before{content:"\uF109"}.fa-tablet:before{content:"\uF10A"}.fa-mobile-phone:before,.fa-mobile:before{content:"\uF10B"}.fa-circle-o:before{content:"\uF10C"}.fa-quote-left:before{content:"\uF10D"}.fa-quote-right:before{content:"\uF10E"}.fa-spinner:before{content:"\uF110"}.fa-circle:before{content:"\uF111"}.fa-mail-reply:before,.fa-reply:before{content:"\uF112"}.fa-github-alt:before{content:"\uF113"}.fa-folder-o:before{content:"\uF114"}.fa-folder-open-o:before{content:"\uF115"}.fa-smile-o:before{content:"\uF118"}.fa-frown-o:before{content:"\uF119"}.fa-meh-o:before{content:"\uF11A"}.fa-gamepad:before{content:"\uF11B"}.fa-keyboard-o:before{content:"\uF11C"}.fa-flag-o:before{content:"\uF11D"}.fa-flag-checkered:before{content:"\uF11E"}.fa-terminal:before{content:"\uF120"}.fa-code:before{content:"\uF121"}.fa-mail-reply-all:before,.fa-reply-all:before{content:"\uF122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\uF123"}.fa-location-arrow:before{content:"\uF124"}.fa-crop:before{content:"\uF125"}.fa-code-fork:before{content:"\uF126"}.fa-unlink:before,.fa-chain-broken:before{content:"\uF127"}.fa-question:before{content:"\uF128"}.fa-info:before{content:"\uF129"}.fa-exclamation:before{content:"\uF12A"}.fa-superscript:before{content:"\uF12B"}.fa-subscript:before{content:"\uF12C"}.fa-eraser:before{content:"\uF12D"}.fa-puzzle-piece:before{content:"\uF12E"}.fa-microphone:before{content:"\uF130"}.fa-microphone-slash:before{content:"\uF131"}.fa-shield:before{content:"\uF132"}.fa-calendar-o:before{content:"\uF133"}.fa-fire-extinguisher:before{content:"\uF134"}.fa-rocket:before{content:"\uF135"}.fa-maxcdn:before{content:"\uF136"}.fa-chevron-circle-left:before{content:"\uF137"}.fa-chevron-circle-right:before{content:"\uF138"}.fa-chevron-circle-up:before{content:"\uF139"}.fa-chevron-circle-down:before{content:"\uF13A"}.fa-html5:before{content:"\uF13B"}.fa-css3:before{content:"\uF13C"}.fa-anchor:before{content:"\uF13D"}.fa-unlock-alt:before{content:"\uF13E"}.fa-bullseye:before{content:"\uF140"}.fa-ellipsis-h:before{content:"\uF141"}.fa-ellipsis-v:before{content:"\uF142"}.fa-rss-square:before{content:"\uF143"}.fa-play-circle:before{content:"\uF144"}.fa-ticket:before{content:"\uF145"}.fa-minus-square:before{content:"\uF146"}.fa-minus-square-o:before{content:"\uF147"}.fa-level-up:before{content:"\uF148"}.fa-level-down:before{content:"\uF149"}.fa-check-square:before{content:"\uF14A"}.fa-pencil-square:before{content:"\uF14B"}.fa-external-link-square:before{content:"\uF14C"}.fa-share-square:before{content:"\uF14D"}.fa-compass:before{content:"\uF14E"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\uF150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\uF151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\uF152"}.fa-euro:before,.fa-eur:before{content:"\uF153"}.fa-gbp:before{content:"\uF154"}.fa-dollar:before,.fa-usd:before{content:"\uF155"}.fa-rupee:before,.fa-inr:before{content:"\uF156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\uF157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\uF158"}.fa-won:before,.fa-krw:before{content:"\uF159"}.fa-bitcoin:before,.fa-btc:before{content:"\uF15A"}.fa-file:before{content:"\uF15B"}.fa-file-text:before{content:"\uF15C"}.fa-sort-alpha-asc:before{content:"\uF15D"}.fa-sort-alpha-desc:before{content:"\uF15E"}.fa-sort-amount-asc:before{content:"\uF160"}.fa-sort-amount-desc:before{content:"\uF161"}.fa-sort-numeric-asc:before{content:"\uF162"}.fa-sort-numeric-desc:before{content:"\uF163"}.fa-thumbs-up:before{content:"\uF164"}.fa-thumbs-down:before{content:"\uF165"}.fa-youtube-square:before{content:"\uF166"}.fa-youtube:before{content:"\uF167"}.fa-xing:before{content:"\uF168"}.fa-xing-square:before{content:"\uF169"}.fa-youtube-play:before{content:"\uF16A"}.fa-dropbox:before{content:"\uF16B"}.fa-stack-overflow:before{content:"\uF16C"}.fa-instagram:before{content:"\uF16D"}.fa-flickr:before{content:"\uF16E"}.fa-adn:before{content:"\uF170"}.fa-bitbucket:before{content:"\uF171"}.fa-bitbucket-square:before{content:"\uF172"}.fa-tumblr:before{content:"\uF173"}.fa-tumblr-square:before{content:"\uF174"}.fa-long-arrow-down:before{content:"\uF175"}.fa-long-arrow-up:before{content:"\uF176"}.fa-long-arrow-left:before{content:"\uF177"}.fa-long-arrow-right:before{content:"\uF178"}.fa-apple:before{content:"\uF179"}.fa-windows:before{content:"\uF17A"}.fa-android:before{content:"\uF17B"}.fa-linux:before{content:"\uF17C"}.fa-dribbble:before{content:"\uF17D"}.fa-skype:before{content:"\uF17E"}.fa-foursquare:before{content:"\uF180"}.fa-trello:before{content:"\uF181"}.fa-female:before{content:"\uF182"}.fa-male:before{content:"\uF183"}.fa-gittip:before,.fa-gratipay:before{content:"\uF184"}.fa-sun-o:before{content:"\uF185"}.fa-moon-o:before{content:"\uF186"}.fa-archive:before{content:"\uF187"}.fa-bug:before{content:"\uF188"}.fa-vk:before{content:"\uF189"}.fa-weibo:before{content:"\uF18A"}.fa-renren:before{content:"\uF18B"}.fa-pagelines:before{content:"\uF18C"}.fa-stack-exchange:before{content:"\uF18D"}.fa-arrow-circle-o-right:before{content:"\uF18E"}.fa-arrow-circle-o-left:before{content:"\uF190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\uF191"}.fa-dot-circle-o:before{content:"\uF192"}.fa-wheelchair:before{content:"\uF193"}.fa-vimeo-square:before{content:"\uF194"}.fa-turkish-lira:before,.fa-try:before{content:"\uF195"}.fa-plus-square-o:before{content:"\uF196"}.fa-space-shuttle:before{content:"\uF197"}.fa-slack:before{content:"\uF198"}.fa-envelope-square:before{content:"\uF199"}.fa-wordpress:before{content:"\uF19A"}.fa-openid:before{content:"\uF19B"}.fa-institution:before,.fa-bank:before,.fa-university:before{content:"\uF19C"}.fa-mortar-board:before,.fa-graduation-cap:before{content:"\uF19D"}.fa-yahoo:before{content:"\uF19E"}.fa-google:before{content:"\uF1A0"}.fa-reddit:before{content:"\uF1A1"}.fa-reddit-square:before{content:"\uF1A2"}.fa-stumbleupon-circle:before{content:"\uF1A3"}.fa-stumbleupon:before{content:"\uF1A4"}.fa-delicious:before{content:"\uF1A5"}.fa-digg:before{content:"\uF1A6"}.fa-pied-piper-pp:before{content:"\uF1A7"}.fa-pied-piper-alt:before{content:"\uF1A8"}.fa-drupal:before{content:"\uF1A9"}.fa-joomla:before{content:"\uF1AA"}.fa-language:before{content:"\uF1AB"}.fa-fax:before{content:"\uF1AC"}.fa-building:before{content:"\uF1AD"}.fa-child:before{content:"\uF1AE"}.fa-paw:before{content:"\uF1B0"}.fa-spoon:before{content:"\uF1B1"}.fa-cube:before{content:"\uF1B2"}.fa-cubes:before{content:"\uF1B3"}.fa-behance:before{content:"\uF1B4"}.fa-behance-square:before{content:"\uF1B5"}.fa-steam:before{content:"\uF1B6"}.fa-steam-square:before{content:"\uF1B7"}.fa-recycle:before{content:"\uF1B8"}.fa-automobile:before,.fa-car:before{content:"\uF1B9"}.fa-cab:before,.fa-taxi:before{content:"\uF1BA"}.fa-tree:before{content:"\uF1BB"}.fa-spotify:before{content:"\uF1BC"}.fa-deviantart:before{content:"\uF1BD"}.fa-soundcloud:before{content:"\uF1BE"}.fa-database:before{content:"\uF1C0"}.fa-file-pdf-o:before{content:"\uF1C1"}.fa-file-word-o:before{content:"\uF1C2"}.fa-file-excel-o:before{content:"\uF1C3"}.fa-file-powerpoint-o:before{content:"\uF1C4"}.fa-file-photo-o:before,.fa-file-picture-o:before,.fa-file-image-o:before{content:"\uF1C5"}.fa-file-zip-o:before,.fa-file-archive-o:before{content:"\uF1C6"}.fa-file-sound-o:before,.fa-file-audio-o:before{content:"\uF1C7"}.fa-file-movie-o:before,.fa-file-video-o:before{content:"\uF1C8"}.fa-file-code-o:before{content:"\uF1C9"}.fa-vine:before{content:"\uF1CA"}.fa-codepen:before{content:"\uF1CB"}.fa-jsfiddle:before{content:"\uF1CC"}.fa-life-bouy:before,.fa-life-buoy:before,.fa-life-saver:before,.fa-support:before,.fa-life-ring:before{content:"\uF1CD"}.fa-circle-o-notch:before{content:"\uF1CE"}.fa-ra:before,.fa-resistance:before,.fa-rebel:before{content:"\uF1D0"}.fa-ge:before,.fa-empire:before{content:"\uF1D1"}.fa-git-square:before{content:"\uF1D2"}.fa-git:before{content:"\uF1D3"}.fa-y-combinator-square:before,.fa-yc-square:before,.fa-hacker-news:before{content:"\uF1D4"}.fa-tencent-weibo:before{content:"\uF1D5"}.fa-qq:before{content:"\uF1D6"}.fa-wechat:before,.fa-weixin:before{content:"\uF1D7"}.fa-send:before,.fa-paper-plane:before{content:"\uF1D8"}.fa-send-o:before,.fa-paper-plane-o:before{content:"\uF1D9"}.fa-history:before{content:"\uF1DA"}.fa-circle-thin:before{content:"\uF1DB"}.fa-header:before{content:"\uF1DC"}.fa-paragraph:before{content:"\uF1DD"}.fa-sliders:before{content:"\uF1DE"}.fa-share-alt:before{content:"\uF1E0"}.fa-share-alt-square:before{content:"\uF1E1"}.fa-bomb:before{content:"\uF1E2"}.fa-soccer-ball-o:before,.fa-futbol-o:before{content:"\uF1E3"}.fa-tty:before{content:"\uF1E4"}.fa-binoculars:before{content:"\uF1E5"}.fa-plug:before{content:"\uF1E6"}.fa-slideshare:before{content:"\uF1E7"}.fa-twitch:before{content:"\uF1E8"}.fa-yelp:before{content:"\uF1E9"}.fa-newspaper-o:before{content:"\uF1EA"}.fa-wifi:before{content:"\uF1EB"}.fa-calculator:before{content:"\uF1EC"}.fa-paypal:before{content:"\uF1ED"}.fa-google-wallet:before{content:"\uF1EE"}.fa-cc-visa:before{content:"\uF1F0"}.fa-cc-mastercard:before{content:"\uF1F1"}.fa-cc-discover:before{content:"\uF1F2"}.fa-cc-amex:before{content:"\uF1F3"}.fa-cc-paypal:before{content:"\uF1F4"}.fa-cc-stripe:before{content:"\uF1F5"}.fa-bell-slash:before{content:"\uF1F6"}.fa-bell-slash-o:before{content:"\uF1F7"}.fa-trash:before{content:"\uF1F8"}.fa-copyright:before{content:"\uF1F9"}.fa-at:before{content:"\uF1FA"}.fa-eyedropper:before{content:"\uF1FB"}.fa-paint-brush:before{content:"\uF1FC"}.fa-birthday-cake:before{content:"\uF1FD"}.fa-area-chart:before{content:"\uF1FE"}.fa-pie-chart:before{content:"\uF200"}.fa-line-chart:before{content:"\uF201"}.fa-lastfm:before{content:"\uF202"}.fa-lastfm-square:before{content:"\uF203"}.fa-toggle-off:before{content:"\uF204"}.fa-toggle-on:before{content:"\uF205"}.fa-bicycle:before{content:"\uF206"}.fa-bus:before{content:"\uF207"}.fa-ioxhost:before{content:"\uF208"}.fa-angellist:before{content:"\uF209"}.fa-cc:before{content:"\uF20A"}.fa-shekel:before,.fa-sheqel:before,.fa-ils:before{content:"\uF20B"}.fa-meanpath:before{content:"\uF20C"}.fa-buysellads:before{content:"\uF20D"}.fa-connectdevelop:before{content:"\uF20E"}.fa-dashcube:before{content:"\uF210"}.fa-forumbee:before{content:"\uF211"}.fa-leanpub:before{content:"\uF212"}.fa-sellsy:before{content:"\uF213"}.fa-shirtsinbulk:before{content:"\uF214"}.fa-simplybuilt:before{content:"\uF215"}.fa-skyatlas:before{content:"\uF216"}.fa-cart-plus:before{content:"\uF217"}.fa-cart-arrow-down:before{content:"\uF218"}.fa-diamond:before{content:"\uF219"}.fa-ship:before{content:"\uF21A"}.fa-user-secret:before{content:"\uF21B"}.fa-motorcycle:before{content:"\uF21C"}.fa-street-view:before{content:"\uF21D"}.fa-heartbeat:before{content:"\uF21E"}.fa-venus:before{content:"\uF221"}.fa-mars:before{content:"\uF222"}.fa-mercury:before{content:"\uF223"}.fa-intersex:before,.fa-transgender:before{content:"\uF224"}.fa-transgender-alt:before{content:"\uF225"}.fa-venus-double:before{content:"\uF226"}.fa-mars-double:before{content:"\uF227"}.fa-venus-mars:before{content:"\uF228"}.fa-mars-stroke:before{content:"\uF229"}.fa-mars-stroke-v:before{content:"\uF22A"}.fa-mars-stroke-h:before{content:"\uF22B"}.fa-neuter:before{content:"\uF22C"}.fa-genderless:before{content:"\uF22D"}.fa-facebook-official:before{content:"\uF230"}.fa-pinterest-p:before{content:"\uF231"}.fa-whatsapp:before{content:"\uF232"}.fa-server:before{content:"\uF233"}.fa-user-plus:before{content:"\uF234"}.fa-user-times:before{content:"\uF235"}.fa-hotel:before,.fa-bed:before{content:"\uF236"}.fa-viacoin:before{content:"\uF237"}.fa-train:before{content:"\uF238"}.fa-subway:before{content:"\uF239"}.fa-medium:before{content:"\uF23A"}.fa-yc:before,.fa-y-combinator:before{content:"\uF23B"}.fa-optin-monster:before{content:"\uF23C"}.fa-opencart:before{content:"\uF23D"}.fa-expeditedssl:before{content:"\uF23E"}.fa-battery-4:before,.fa-battery:before,.fa-battery-full:before{content:"\uF240"}.fa-battery-3:before,.fa-battery-three-quarters:before{content:"\uF241"}.fa-battery-2:before,.fa-battery-half:before{content:"\uF242"}.fa-battery-1:before,.fa-battery-quarter:before{content:"\uF243"}.fa-battery-0:before,.fa-battery-empty:before{content:"\uF244"}.fa-mouse-pointer:before{content:"\uF245"}.fa-i-cursor:before{content:"\uF246"}.fa-object-group:before{content:"\uF247"}.fa-object-ungroup:before{content:"\uF248"}.fa-sticky-note:before{content:"\uF249"}.fa-sticky-note-o:before{content:"\uF24A"}.fa-cc-jcb:before{content:"\uF24B"}.fa-cc-diners-club:before{content:"\uF24C"}.fa-clone:before{content:"\uF24D"}.fa-balance-scale:before{content:"\uF24E"}.fa-hourglass-o:before{content:"\uF250"}.fa-hourglass-1:before,.fa-hourglass-start:before{content:"\uF251"}.fa-hourglass-2:before,.fa-hourglass-half:before{content:"\uF252"}.fa-hourglass-3:before,.fa-hourglass-end:before{content:"\uF253"}.fa-hourglass:before{content:"\uF254"}.fa-hand-grab-o:before,.fa-hand-rock-o:before{content:"\uF255"}.fa-hand-stop-o:before,.fa-hand-paper-o:before{content:"\uF256"}.fa-hand-scissors-o:before{content:"\uF257"}.fa-hand-lizard-o:before{content:"\uF258"}.fa-hand-spock-o:before{content:"\uF259"}.fa-hand-pointer-o:before{content:"\uF25A"}.fa-hand-peace-o:before{content:"\uF25B"}.fa-trademark:before{content:"\uF25C"}.fa-registered:before{content:"\uF25D"}.fa-creative-commons:before{content:"\uF25E"}.fa-gg:before{content:"\uF260"}.fa-gg-circle:before{content:"\uF261"}.fa-tripadvisor:before{content:"\uF262"}.fa-odnoklassniki:before{content:"\uF263"}.fa-odnoklassniki-square:before{content:"\uF264"}.fa-get-pocket:before{content:"\uF265"}.fa-wikipedia-w:before{content:"\uF266"}.fa-safari:before{content:"\uF267"}.fa-chrome:before{content:"\uF268"}.fa-firefox:before{content:"\uF269"}.fa-opera:before{content:"\uF26A"}.fa-internet-explorer:before{content:"\uF26B"}.fa-tv:before,.fa-television:before{content:"\uF26C"}.fa-contao:before{content:"\uF26D"}.fa-500px:before{content:"\uF26E"}.fa-amazon:before{content:"\uF270"}.fa-calendar-plus-o:before{content:"\uF271"}.fa-calendar-minus-o:before{content:"\uF272"}.fa-calendar-times-o:before{content:"\uF273"}.fa-calendar-check-o:before{content:"\uF274"}.fa-industry:before{content:"\uF275"}.fa-map-pin:before{content:"\uF276"}.fa-map-signs:before{content:"\uF277"}.fa-map-o:before{content:"\uF278"}.fa-map:before{content:"\uF279"}.fa-commenting:before{content:"\uF27A"}.fa-commenting-o:before{content:"\uF27B"}.fa-houzz:before{content:"\uF27C"}.fa-vimeo:before{content:"\uF27D"}.fa-black-tie:before{content:"\uF27E"}.fa-fonticons:before{content:"\uF280"}.fa-reddit-alien:before{content:"\uF281"}.fa-edge:before{content:"\uF282"}.fa-credit-card-alt:before{content:"\uF283"}.fa-codiepie:before{content:"\uF284"}.fa-modx:before{content:"\uF285"}.fa-fort-awesome:before{content:"\uF286"}.fa-usb:before{content:"\uF287"}.fa-product-hunt:before{content:"\uF288"}.fa-mixcloud:before{content:"\uF289"}.fa-scribd:before{content:"\uF28A"}.fa-pause-circle:before{content:"\uF28B"}.fa-pause-circle-o:before{content:"\uF28C"}.fa-stop-circle:before{content:"\uF28D"}.fa-stop-circle-o:before{content:"\uF28E"}.fa-shopping-bag:before{content:"\uF290"}.fa-shopping-basket:before{content:"\uF291"}.fa-hashtag:before{content:"\uF292"}.fa-bluetooth:before{content:"\uF293"}.fa-bluetooth-b:before{content:"\uF294"}.fa-percent:before{content:"\uF295"}.fa-gitlab:before{content:"\uF296"}.fa-wpbeginner:before{content:"\uF297"}.fa-wpforms:before{content:"\uF298"}.fa-envira:before{content:"\uF299"}.fa-universal-access:before{content:"\uF29A"}.fa-wheelchair-alt:before{content:"\uF29B"}.fa-question-circle-o:before{content:"\uF29C"}.fa-blind:before{content:"\uF29D"}.fa-audio-description:before{content:"\uF29E"}.fa-volume-control-phone:before{content:"\uF2A0"}.fa-braille:before{content:"\uF2A1"}.fa-assistive-listening-systems:before{content:"\uF2A2"}.fa-asl-interpreting:before,.fa-american-sign-language-interpreting:before{content:"\uF2A3"}.fa-deafness:before,.fa-hard-of-hearing:before,.fa-deaf:before{content:"\uF2A4"}.fa-glide:before{content:"\uF2A5"}.fa-glide-g:before{content:"\uF2A6"}.fa-signing:before,.fa-sign-language:before{content:"\uF2A7"}.fa-low-vision:before{content:"\uF2A8"}.fa-viadeo:before{content:"\uF2A9"}.fa-viadeo-square:before{content:"\uF2AA"}.fa-snapchat:before{content:"\uF2AB"}.fa-snapchat-ghost:before{content:"\uF2AC"}.fa-snapchat-square:before{content:"\uF2AD"}.fa-pied-piper:before{content:"\uF2AE"}.fa-first-order:before{content:"\uF2B0"}.fa-yoast:before{content:"\uF2B1"}.fa-themeisle:before{content:"\uF2B2"}.fa-google-plus-circle:before,.fa-google-plus-official:before{content:"\uF2B3"}.fa-fa:before,.fa-font-awesome:before{content:"\uF2B4"}.fa-handshake-o:before{content:"\uF2B5"}.fa-envelope-open:before{content:"\uF2B6"}.fa-envelope-open-o:before{content:"\uF2B7"}.fa-linode:before{content:"\uF2B8"}.fa-address-book:before{content:"\uF2B9"}.fa-address-book-o:before{content:"\uF2BA"}.fa-vcard:before,.fa-address-card:before{content:"\uF2BB"}.fa-vcard-o:before,.fa-address-card-o:before{content:"\uF2BC"}.fa-user-circle:before{content:"\uF2BD"}.fa-user-circle-o:before{content:"\uF2BE"}.fa-user-o:before{content:"\uF2C0"}.fa-id-badge:before{content:"\uF2C1"}.fa-drivers-license:before,.fa-id-card:before{content:"\uF2C2"}.fa-drivers-license-o:before,.fa-id-card-o:before{content:"\uF2C3"}.fa-quora:before{content:"\uF2C4"}.fa-free-code-camp:before{content:"\uF2C5"}.fa-telegram:before{content:"\uF2C6"}.fa-thermometer-4:before,.fa-thermometer:before,.fa-thermometer-full:before{content:"\uF2C7"}.fa-thermometer-3:before,.fa-thermometer-three-quarters:before{content:"\uF2C8"}.fa-thermometer-2:before,.fa-thermometer-half:before{content:"\uF2C9"}.fa-thermometer-1:before,.fa-thermometer-quarter:before{content:"\uF2CA"}.fa-thermometer-0:before,.fa-thermometer-empty:before{content:"\uF2CB"}.fa-shower:before{content:"\uF2CC"}.fa-bathtub:before,.fa-s15:before,.fa-bath:before{content:"\uF2CD"}.fa-podcast:before{content:"\uF2CE"}.fa-window-maximize:before{content:"\uF2D0"}.fa-window-minimize:before{content:"\uF2D1"}.fa-window-restore:before{content:"\uF2D2"}.fa-times-rectangle:before,.fa-window-close:before{content:"\uF2D3"}.fa-times-rectangle-o:before,.fa-window-close-o:before{content:"\uF2D4"}.fa-bandcamp:before{content:"\uF2D5"}.fa-grav:before{content:"\uF2D6"}.fa-etsy:before{content:"\uF2D7"}.fa-imdb:before{content:"\uF2D8"}.fa-ravelry:before{content:"\uF2D9"}.fa-eercast:before{content:"\uF2DA"}.fa-microchip:before{content:"\uF2DB"}.fa-snowflake-o:before{content:"\uF2DC"}.fa-superpowers:before{content:"\uF2DD"}.fa-wpexplorer:before{content:"\uF2DE"}.fa-meetup:before{content:"\uF2E0"}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}@font-face{font-family:"grafana-icons";src:url("../fonts/grafana-icons.eot?okx5td");src:url("../fonts/grafana-icons.eot?okx5td#iefix") format("embedded-opentype"),url("../fonts/grafana-icons.ttf?okx5td") format("truetype"),url("../fonts/grafana-icons.woff?okx5td") format("woff"),url("../fonts/grafana-icons.svg?okx5td#grafana-icons") format("svg");font-weight:normal;font-style:normal}.icon-gf{font-family:"grafana-icons" !important;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;display:inline-block;vertical-align:middle;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-gf-fw{width:1.2857142857em;text-align:center}.inline-icon-gf{vertical-align:middle}.icon-gf-raintank_wordmark:before{content:"\uE600"}.micon-gf-raintank_icn:before{content:"\uE601"}.icon-gf-raintank_r-icn:before{content:"\uE905"}.icon-gf-check-alt:before{content:"\uE603"}.icon-gf-check:before{content:"\uE604"}.icon-gf-collector:before{content:"\uE605"}.icon-gf-dashboard:before{content:"\uE606"}.icon-gf-panel:before{content:"\uE904"}.icon-gf-endpoint-tiny:before{content:"\uE608"}.icon-gf-critical:before{content:"\uE610"}.icon-gf-online:before{content:"\uE611"}.icon-gf-event-error:before{content:"\uE623"}.icon-gf-event:before{content:"\uE624"}.icon-gf-sadface:before{content:"\uE907"}.icon-gf-private-collector:before{content:"\uE612"}.icon-gf-alert:before{content:"\uE61F"}.icon-gf-alert-disabled:before{content:"\uE621"}.icon-gf-refresh:before{content:"\uE613"}.icon-gf-save:before{content:"\uE614"}.icon-gf-share:before{content:"\uE616"}.icon-gf-star:before{content:"\uE617"}.icon-gf-search:before{content:"\uE618"}.icon-gf-settings:before{content:"\uE615"}.icon-gf-add:before{content:"\uE619"}.icon-gf-remove:before{content:"\uE61A"}.icon-gf-video:before{content:"\uE61B"}.icon-gf-bulk_action:before{content:"\uE61C"}.icon-gf-grabber:before{content:"\uE90B"}.icon-gf-users:before{content:"\uE622"}.icon-gf-globe:before{content:"\uE61D"}.icon-gf-snapshot:before{content:"\uE61E"}.icon-gf-play-grafana-icon:before{content:"\uE629"}.icon-gf-grafana-icon:before{content:"\uE625"}.icon-gf-email:before{content:"\uE628"}.icon-gf-stopwatch:before{content:"\uE626"}.icon-gf-skull:before{content:"\uE900"}.icon-gf-probe:before{content:"\uE901"}.icon-gf-apps:before{content:"\uE902"}@font-face{font-family:"Roboto Mono";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/roboto/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSh0mQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Roboto Mono";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/roboto/L0xTDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vrtSM1J-gEPT5Ese6hmHSh0mQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7SUc.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7SUc.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7SUc.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7SUc.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7SUc.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7SUc.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2JL7SUc.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa0ZL7SUc.woff2) format("woff2");unicode-range:U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2ZL7SUc.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1pL7SUc.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa2pL7SUc.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa25L7SUc.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(./public/fonts/inter/UcC73FwrK3iLTeHuS_fvQtMwCp50KnMa1ZL7.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}code,pre{font-family:"Roboto Mono",monospace;font-size:12px;background-color:#f4f5f8;color:#24292e;border:1px solid #d8d9da;border-radius:4px}code{color:#24292e;white-space:nowrap;padding:2px 5px;margin:0 2px}code.code--small{font-size:10px;padding:2px;margin:0 2px}pre{display:block;margin:0 0 1.5714285714;line-height:1.5714285714;word-break:break-all;word-wrap:break-word;white-space:pre;white-space:pre-wrap;background-color:#f4f5f8;padding:10px}pre.pre--no-style{background:rgba(0,0,0,0);border:none;padding:0px}pre.prettyprint{margin-bottom:1.5714285714}pre code{padding:0;color:inherit;white-space:pre;white-space:pre-wrap;background-color:rgba(0,0,0,0);border:0}.gicon{line-height:1;display:inline-block;width:1.1057142857em;height:1.1057142857em;text-align:center;background-repeat:no-repeat;background-position:center;background-size:contain;vertical-align:middle}.icon--has-hover{opacity:.7}.icon--has-hover:hover{opacity:1}.gicon-add-annotation{background-image:url("../img/icons_light_theme/icon_add_annotation.svg")}.gicon-add-annotation-alt{background-image:url("../img/icons_light_theme/icon_add_annotation_alt.svg")}.gicon-add-datasources{background-image:url("../img/icons_light_theme/icon_add_data_sources.svg")}.gicon-add-user{background-image:url("../img/icons_light_theme/icon_add_user.svg")}.gicon-add-team{background-image:url("../img/icons_light_theme/icon_add_team.svg")}.gicon-add-panel{background-image:url("../img/icons_light_theme/icon_add_panel.svg")}.gicon-add-link{background-image:url("../img/icons_light_theme/icon_add_link.svg")}.gicon-add-variable{background-image:url("../img/icons_light_theme/icon_add_variable.svg")}.gicon-add-alert-notification-channel{background-image:url("../img/icons_light_theme/icon_add_notification_channel.svg")}.gicon-alert{background-image:url("../img/icons_light_theme/icon_alert.svg")}.gicon-remove{background-image:url("../img/icons_light_theme/icon_remove.svg")}.gicon-arrow-left{background-image:url("../img/icons_light_theme/icon_arrow_left.svg")}.gicon-arrow-left-circle{background-image:url("../img/icons_light_theme/icon_arrow_left_circle.svg")}.gicon-alert-alt{background-image:url("../img/icons_light_theme/icon_alert_alt.svg")}.gicon-alert-rules{background-image:url("../img/icons_light_theme/icon_alert_rules.svg")}.gicon-alert-notification-channel{background-image:url("../img/icons_light_theme/icon_notification_channels.svg")}.gicon-annotation{background-image:url("../img/icons_light_theme/icon_annotation.svg")}.gicon-annotation-alt{background-image:url("../img/icons_light_theme/icon_annotation_alt.svg")}.gicon-apikeys{background-image:url("../img/icons_light_theme/icon_apikeys.svg")}.gicon-branding{background-image:url("../img/grafana_icon.svg")}.gicon-cog{background-image:url("../img/icons_light_theme/icon_cog.svg")}.gicon-dashboard{background-image:url("../img/icons_light_theme/icon_dashboard.svg")}.gicon-dashboard-starred{background-image:url("../img/icons_light_theme/icon_dashboard_fav.svg")}.gicon-dashboard-list{background-image:url("../img/icons_light_theme/icon_dashboard_list.svg")}.gicon-dashboard-new{background-image:url("../img/icons_light_theme/icon_new_dashboard.svg")}.gicon-dashboard-import{background-image:url("../img/icons_light_theme/icon_import_dashboard.svg")}.gicon-datasources{background-image:url("../img/icons_light_theme/icon_data_sources.svg")}.gicon-editor{background-image:url("../img/icons_light_theme/icon_editor.svg")}.gicon-folder-new{background-image:url("../img/icons_light_theme/icon_add_folder.svg")}.gicon-home{background-image:url("../img/icons_light_theme/icon_home.svg")}.gicon-json{background-image:url("../img/icons_light_theme/icon_json.svg")}.gicon-link{background-image:url("../img/icons_light_theme/icon_link.svg")}.gicon-manage{background-image:url("../img/icons_light_theme/icon_sitemap.svg")}.gicon-org{background-image:url("../img/icons_light_theme/icon_org.svg")}.gicon-playlists{background-image:url("../img/icons_light_theme/icon_playlist.svg")}.gicon-plugins{background-image:url("../img/icons_light_theme/icon_plugins.svg")}.gicon-preferences{background-image:url("../img/icons_light_theme/icon_preferences.svg")}.gicon-question{background-image:url("../img/icons_light_theme/icon_question.svg")}.gicon-shield{background-image:url("../img/icons_light_theme/icon_shield.svg")}.gicon-snapshots{background-image:url("../img/icons_light_theme/icon_snapshots.svg")}.gicon-team{background-image:url("../img/icons_light_theme/icon_team.svg")}.gicon-user{background-image:url("../img/icons_light_theme/icon_user.svg")}.gicon-variable{background-image:url("../img/icons_light_theme/icon_variable.svg")}.gicon-viewer{background-image:url("../img/icons_light_theme/icon_viewer.svg")}.gicon-zoom-out{background-image:url("../img/icons_light_theme/icon_zoom_out.svg")}.gicon-explore{background-image:url("../img/icons_light_theme/icon_explore.svg")}.gicon-reports{background-image:url("../img/icons_light_theme/icon_reports.svg")}.sidemenu .gicon-dashboard{background-image:url("../img/icons_dark_theme/icon_dashboard.svg")}.sidemenu .gicon-alert{background-image:url("../img/icons_dark_theme/icon_alert.svg")}.sidemenu .gicon-cog{background-image:url("../img/icons_dark_theme/icon_cog.svg")}.sidemenu .gicon-question{background-image:url("../img/icons_dark_theme/icon_question.svg")}.sidemenu .gicon-explore{background-image:url("../img/icons_dark_theme/icon_explore.svg")}.sidemenu .gicon-shield{background-image:url("../img/icons_dark_theme/icon_shield.svg")}.sidemenu .gicon-reports{background-image:url("../img/icons_dark_theme/icon_reports.svg")}.fa--permissions-list{min-width:20px;padding-right:5px}.panel-editor-tabs .gicon-advanced-active,.add-panel-widget__icon .gicon-advanced-active{background-image:url("../img/icons_light_theme/icon_advanced_active.svg")}.panel-editor-tabs .gicon-advanced,.add-panel-widget__icon .gicon-advanced{background-image:url("../img/icons_light_theme/icon_advanced.svg")}.panel-editor-tabs .gicon-alert-active,.add-panel-widget__icon .gicon-alert-active{background-image:url("../img/icons_light_theme/icon_alerting_active.svg")}.panel-editor-tabs .gicon-alert,.add-panel-widget__icon .gicon-alert{background-image:url("../img/icons_light_theme/icon_alerting.svg")}.panel-editor-tabs .gicon-queries-active,.add-panel-widget__icon .gicon-queries-active{background-image:url("../img/icons_light_theme/icon_query_active.svg")}.panel-editor-tabs .gicon-queries,.add-panel-widget__icon .gicon-queries{background-image:url("../img/icons_light_theme/icon_query.svg")}.panel-editor-tabs .gicon-visualization-active,.add-panel-widget__icon .gicon-visualization-active{background-image:url("../img/icons_light_theme/icon_visualize_active.svg")}.panel-editor-tabs .gicon-visualization,.add-panel-widget__icon .gicon-visualization{background-image:url("../img/icons_light_theme/icon_visualize.svg")}.clearfix::after{content:"";display:table;clear:both}.highlight-word{color:#eb7b18}.emphasis-word{font-weight:500;color:#000}.close{opacity:.2;float:right;font-size:20px;font-weight:bold;line-height:1.5714285714;color:#000;text-shadow:0 1px 0 #fff}.close:hover,.close:focus{color:#000;text-decoration:none;cursor:pointer;opacity:.4}button.close{padding:0;cursor:pointer;background:rgba(0,0,0,0);border:0;-webkit-appearance:none}.pull-right{float:right !important}.pull-left{float:left !important}.hide{display:none}.show{display:block}.invisible{visibility:hidden !important}.affix{position:fixed}.d-inline-block{display:inline-block}.absolute{position:absolute}.flex-grow-1{flex-grow:1}.flex-shrink-1{flex-shrink:1}.flex-shrink-0{flex-shrink:0}.flex-flow-column-nowrap{display:flex;flex-flow:column nowrap}.center-vh{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;justify-items:center}.align-items-center{display:flex;flex-direction:row nowrap;align-items:center}input.validation-error,input.ng-dirty.ng-invalid{box-shadow:inset 0 0px 5px #e0226e}input.invalid{box-shadow:inset 0 0px 5px #e0226e}[ng\\:cloak],[ng-cloak],.ng-cloak{display:none !important}.m-x-auto{margin-right:auto !important;margin-left:auto !important}.m-a-0{margin:0 0 !important}.m-t-0{margin-top:0 !important}.m-r-0{margin-right:0 !important}.m-b-0{margin-bottom:0 !important}.m-l-0{margin-left:0 !important}.m-x-0{margin-right:0 !important;margin-left:0 !important}.m-y-0{margin-top:0 !important;margin-bottom:0 !important}.m-a-1{margin:16px 16px !important}.m-t-1{margin-top:16px !important}.m-r-1{margin-right:16px !important}.m-b-1{margin-bottom:16px !important}.m-l-1{margin-left:16px !important}.m-x-1{margin-right:16px !important;margin-left:16px !important}.m-y-1{margin-top:16px !important;margin-bottom:16px !important}.m-a-2{margin:24px 24px !important}.m-t-2{margin-top:24px !important}.m-r-2{margin-right:24px !important}.m-b-2{margin-bottom:24px !important}.m-l-2{margin-left:24px !important}.m-x-2{margin-right:24px !important;margin-left:24px !important}.m-y-2{margin-top:24px !important;margin-bottom:24px !important}.m-a-3{margin:48px 48px !important}.m-t-3{margin-top:48px !important}.m-r-3{margin-right:48px !important}.m-b-3{margin-bottom:48px !important}.m-l-3{margin-left:48px !important}.m-x-3{margin-right:48px !important;margin-left:48px !important}.m-y-3{margin-top:48px !important;margin-bottom:48px !important}.p-a-0{padding:0 0 !important}.p-t-0{padding-top:0 !important}.p-r-0{padding-right:0 !important}.p-b-0{padding-bottom:0 !important}.p-l-0{padding-left:0 !important}.p-x-0{padding-right:0 !important;padding-left:0 !important}.p-y-0{padding-top:0 !important;padding-bottom:0 !important}.p-a-1{padding:16px 16px !important}.p-t-1{padding-top:16px !important}.p-r-1{padding-right:16px !important}.p-b-1{padding-bottom:16px !important}.p-l-1{padding-left:16px !important}.p-x-1{padding-right:16px !important;padding-left:16px !important}.p-y-1{padding-top:16px !important;padding-bottom:16px !important}.p-a-2{padding:24px 24px !important}.p-t-2{padding-top:24px !important}.p-r-2{padding-right:24px !important}.p-b-2{padding-bottom:24px !important}.p-l-2{padding-left:24px !important}.p-x-2{padding-right:24px !important;padding-left:24px !important}.p-y-2{padding-top:24px !important;padding-bottom:24px !important}.p-a-3{padding:48px 48px !important}.p-t-3{padding-top:48px !important}.p-r-3{padding-right:48px !important}.p-b-3{padding-bottom:48px !important}.p-l-3{padding-left:48px !important}.p-x-3{padding-right:48px !important;padding-left:48px !important}.p-y-3{padding-top:48px !important;padding-bottom:48px !important}.pos-f-t{position:fixed;top:0;right:0;left:0;z-index:1000}.max-width{width:100%}.width-auto{width:auto}.width-1{width:16px !important}.width-2{width:32px !important}.width-3{width:48px !important}.width-4{width:64px !important}.width-5{width:80px !important}.width-6{width:96px !important}.width-7{width:112px !important}.width-8{width:128px !important}.width-9{width:144px !important}.width-10{width:160px !important}.width-11{width:176px !important}.width-12{width:192px !important}.width-13{width:208px !important}.width-14{width:224px !important}.width-15{width:240px !important}.width-16{width:256px !important}.width-17{width:272px !important}.width-18{width:288px !important}.width-19{width:304px !important}.width-20{width:320px !important}.width-21{width:336px !important}.width-22{width:352px !important}.width-23{width:368px !important}.width-24{width:384px !important}.width-25{width:400px !important}.width-26{width:416px !important}.width-27{width:432px !important}.width-28{width:448px !important}.width-29{width:464px !important}.width-30{width:480px !important}.max-width-1{max-width:16px !important;flex-grow:1}.max-width-2{max-width:32px !important;flex-grow:1}.max-width-3{max-width:48px !important;flex-grow:1}.max-width-4{max-width:64px !important;flex-grow:1}.max-width-5{max-width:80px !important;flex-grow:1}.max-width-6{max-width:96px !important;flex-grow:1}.max-width-7{max-width:112px !important;flex-grow:1}.max-width-8{max-width:128px !important;flex-grow:1}.max-width-9{max-width:144px !important;flex-grow:1}.max-width-10{max-width:160px !important;flex-grow:1}.max-width-11{max-width:176px !important;flex-grow:1}.max-width-12{max-width:192px !important;flex-grow:1}.max-width-13{max-width:208px !important;flex-grow:1}.max-width-14{max-width:224px !important;flex-grow:1}.max-width-15{max-width:240px !important;flex-grow:1}.max-width-16{max-width:256px !important;flex-grow:1}.max-width-17{max-width:272px !important;flex-grow:1}.max-width-18{max-width:288px !important;flex-grow:1}.max-width-19{max-width:304px !important;flex-grow:1}.max-width-20{max-width:320px !important;flex-grow:1}.max-width-21{max-width:336px !important;flex-grow:1}.max-width-22{max-width:352px !important;flex-grow:1}.max-width-23{max-width:368px !important;flex-grow:1}.max-width-24{max-width:384px !important;flex-grow:1}.max-width-25{max-width:400px !important;flex-grow:1}.max-width-26{max-width:416px !important;flex-grow:1}.max-width-27{max-width:432px !important;flex-grow:1}.max-width-28{max-width:448px !important;flex-grow:1}.max-width-29{max-width:464px !important;flex-grow:1}.max-width-30{max-width:480px !important;flex-grow:1}.min-width-1{min-width:16px !important}.min-width-2{min-width:32px !important}.min-width-3{min-width:48px !important}.min-width-4{min-width:64px !important}.min-width-5{min-width:80px !important}.min-width-6{min-width:96px !important}.min-width-7{min-width:112px !important}.min-width-8{min-width:128px !important}.min-width-9{min-width:144px !important}.min-width-10{min-width:160px !important}.min-width-11{min-width:176px !important}.min-width-12{min-width:192px !important}.min-width-13{min-width:208px !important}.min-width-14{min-width:224px !important}.min-width-15{min-width:240px !important}.min-width-16{min-width:256px !important}.min-width-17{min-width:272px !important}.min-width-18{min-width:288px !important}.min-width-19{min-width:304px !important}.min-width-20{min-width:320px !important}.min-width-21{min-width:336px !important}.min-width-22{min-width:352px !important}.min-width-23{min-width:368px !important}.min-width-24{min-width:384px !important}.min-width-25{min-width:400px !important}.min-width-26{min-width:416px !important}.min-width-27{min-width:432px !important}.min-width-28{min-width:448px !important}.min-width-29{min-width:464px !important}.min-width-30{min-width:480px !important}.offset-width-1{margin-left:16px !important}.offset-width-2{margin-left:32px !important}.offset-width-3{margin-left:48px !important}.offset-width-4{margin-left:64px !important}.offset-width-5{margin-left:80px !important}.offset-width-6{margin-left:96px !important}.offset-width-7{margin-left:112px !important}.offset-width-8{margin-left:128px !important}.offset-width-9{margin-left:144px !important}.offset-width-10{margin-left:160px !important}.offset-width-11{margin-left:176px !important}.offset-width-12{margin-left:192px !important}.offset-width-13{margin-left:208px !important}.offset-width-14{margin-left:224px !important}.offset-width-15{margin-left:240px !important}.offset-width-16{margin-left:256px !important}.offset-width-17{margin-left:272px !important}.offset-width-18{margin-left:288px !important}.offset-width-19{margin-left:304px !important}.offset-width-20{margin-left:320px !important}.offset-width-21{margin-left:336px !important}.offset-width-22{margin-left:352px !important}.offset-width-23{margin-left:368px !important}.offset-width-24{margin-left:384px !important}.offset-width-25{margin-left:400px !important}.offset-width-26{margin-left:416px !important}.offset-width-27{margin-left:432px !important}.offset-width-28{margin-left:448px !important}.offset-width-29{margin-left:464px !important}.offset-width-30{margin-left:480px !important}@keyframes onAutoFillStart{}@keyframes onAutoFillCancel{}input:-webkit-autofill{animation-name:onAutoFillStart;transition:transform 1ms}input:not(:-webkit-autofill){animation-name:onAutoFillCancel}.ui-list{margin:0;padding:0;list-style:none}.ui-list>li{margin-bottom:4px}.ui-list>li:last-child{margin-bottom:0}.add-panel-widget-container{height:100%}.add-panel-widget{height:100%}.add-panel-widget__header{top:0;position:absolute;padding:0 8px;display:flex;align-items:center;width:100%;cursor:move;background:#f4f5f5;box-shadow:inset 0px -3px 10px #f4f5f8;border-bottom:1px solid #f4f5f5}.add-panel-widget__header .gicon{font-size:30px;margin-right:16px}.add-panel-widget__header:hover{transition:background-color .1s ease-in-out;background-color:rgba(36,41,46,.12)}.add-panel-widget__title{font-size:14px;font-weight:500;margin-right:32px}.add-panel-widget__link{margin:0 8px;width:170px;height:88px !important;flex-direction:column !important}.add-panel-widget__icon{margin-bottom:8px}.add-panel-widget__icon .gicon{color:#fff;height:44px;width:53px;position:relative;left:5px}.add-panel-widget__create{display:inherit;margin-bottom:24px;margin-top:55px}.add-panel-widget__actions{display:inherit}.add-panel-widget__action{margin:0 4px}.add-panel-widget__btn-container{height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column}.ps{overflow:hidden !important;overflow-anchor:none;-ms-overflow-style:none;touch-action:auto;-ms-touch-action:auto}.ps__rail-x{display:none;opacity:0;transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;height:15px;bottom:0px;position:absolute}.ps__rail-y{display:none;opacity:0;transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;width:15px;right:0;position:absolute}.ps--active-x>.ps__rail-x,.ps--active-y>.ps__rail-y{display:block;background-color:rgba(0,0,0,0)}.ps--focus>.ps__rail-x,.ps--focus>.ps__rail-y,.ps--scrolling-x>.ps__rail-x,.ps--scrolling-y>.ps__rail-y{opacity:.6}.ps__rail-x:hover,.ps__rail-y:hover,.ps__rail-x:focus,.ps__rail-y:focus{background-color:rgba(0,0,0,0);opacity:.9}.ps__thumb-x{background-color:#aaa;border-radius:6px;height:6px;bottom:2px;position:absolute}.ps__thumb-y{background-color:#d8d9da;background-image:linear-gradient(to bottom, #d8d9da, #d8d9da);background-repeat:repeat-x;border-radius:6px;width:6px;right:0px;position:absolute}@supports(-ms-overflow-style: none){.ps{overflow:auto !important}}@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none){.ps{overflow:auto !important}}.ps__rail-x:hover,.ps__rail-y:hover,.ps__rail-x:focus,.ps__rail-y:focus{background-color:rgba(0,0,0,0);opacity:.9}.no-overlay-scrollbar ::-webkit-scrollbar{width:8px;height:8px}.no-overlay-scrollbar ::-webkit-scrollbar:hover{height:8px}.no-overlay-scrollbar ::-webkit-scrollbar-button:start:decrement,.no-overlay-scrollbar ::-webkit-scrollbar-button:end:increment{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:horizontal:decrement{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:horizontal:increment{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:vertical:decrement{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:vertical:increment{display:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:horizontal:decrement:active{background-image:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:horizontal:increment:active{background-image:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:vertical:decrement:active{background-image:none}.no-overlay-scrollbar ::-webkit-scrollbar-button:vertical:increment:active{background-image:none}.no-overlay-scrollbar ::-webkit-scrollbar-track-piece{background-color:rgba(0,0,0,0)}.no-overlay-scrollbar ::-webkit-scrollbar-thumb:vertical{height:50px;background:-webkit-gradient(linear, left top, right top, color-stop(0%, #d8d9da), color-stop(100%, #d8d9da));border:1px solid #fbfbfb;border-top:1px solid #fbfbfb;border-left:1px solid #fbfbfb}.no-overlay-scrollbar ::-webkit-scrollbar-thumb:horizontal{width:50px;background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #d8d9da), color-stop(100%, #d8d9da));border:1px solid #fbfbfb;border-top:1px solid #fbfbfb;border-left:1px solid #fbfbfb}.baron{overflow:hidden}.main-view.baron{width:unset}.baron__clipper{position:relative;overflow:hidden}.baron__scroller{overflow-y:scroll;-ms-overflow-style:none;-moz-box-sizing:border-box;box-sizing:border-box;margin:0;border:0;padding:0;width:100%;height:100%;-webkit-overflow-scrolling:touch}.baron__scroller::-webkit-scrollbar{width:0;height:0}.baron__track{display:none;position:absolute;top:0;right:0;bottom:0}.baron._scrollbar .baron__track{display:block}.baron__free{position:absolute;top:0;bottom:0;right:0}.baron__bar{display:none;position:absolute;right:0;z-index:1;background:#999;width:15px;transition:background-color .2s linear,opacity .2s linear;opacity:0}.baron._scrollbar .baron__bar{display:block;background-color:#d8d9da;background-image:linear-gradient(to bottom, #d8d9da, #d8d9da);background-repeat:repeat-x;border-radius:6px;width:6px;right:0px;position:absolute}.baron._scrollbar .baron__bar:hover,.baron._scrollbar .baron__bar:focus{opacity:.9}.panel-hover-highlight .baron__track .baron__bar{opacity:.6}.baron._scrolling>.baron__track .baron__bar{opacity:.9}.baron__control{display:none}.baron.panel-content--scrollable{width:calc(100% - 2px)}.baron.panel-content--scrollable .baron__scroller{padding-top:1px}.scroll-margin-helper{margin-right:12px}.btn{display:inline-flex;align-items:center;justify-content:center;font-weight:500;line-height:1.5714285714;font-size:14px;text-align:center;vertical-align:middle;cursor:pointer;border:none;height:32px;padding:0 16px;font-size:14px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.btn:focus,.btn.focus,.btn:active:focus,.btn:active.focus,.btn.active:focus,.btn.active.focus{outline:none}.btn:focus,.btn:hover{text-decoration:none}.btn.focus{text-decoration:none}.btn:active,.btn.active{background-image:none;outline:0}.btn.disabled,.btn[disabled],.btn:disabled{cursor:not-allowed;opacity:.65;box-shadow:none;pointer-events:none}.btn--radius-left-0{border-top-left-radius:0;border-bottom-left-radius:0}.btn--radius-right-0{border-top-right-radius:0;border-bottom-right-radius:0}.btn-large{padding:11px 24px;font-size:18px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;font-weight:normal;height:48px}.btn-large .gicon{margin-right:8px;filter:brightness(100)}.btn-small{padding:4px 8px;font-size:12px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;height:24px}.btn-mini{padding:4px 8px;font-size:12px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;height:height-smpx}.btn-link{color:#555;background:rgba(0,0,0,0)}.btn-success,.btn-primary{color:#fff;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#3368ca;background-image:linear-gradient(to bottom, #3871DC, rgb(44, 90, 176));background-repeat:repeat-x;border-color:#3871dc}.btn-success:hover,.btn-success:focus,.btn-success:active,.btn-success.active,.btn-success.disabled,.btn-success[disabled],.btn-primary:hover,.btn-primary:focus,.btn-primary:active,.btn-primary.active,.btn-primary.disabled,.btn-primary[disabled]{color:#fff;background-image:none;background-color:#3871dc}.btn-secondary{color:#fff;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#e4e4e5;background-image:linear-gradient(to bottom, #ececec, #d8d9da);background-repeat:repeat-x;border-color:#ececec}.btn-secondary:hover,.btn-secondary:focus,.btn-secondary:active,.btn-secondary.active,.btn-secondary.disabled,.btn-secondary[disabled]{color:#fff;background-image:none;background-color:#ececec}.btn-danger{color:#fff;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#ce1f65;background-image:linear-gradient(to bottom, #E0226E, rgb(179, 27, 88));background-repeat:repeat-x;border-color:#e0226e}.btn-danger:hover,.btn-danger:focus,.btn-danger:active,.btn-danger.active,.btn-danger.disabled,.btn-danger[disabled]{color:#fff;background-image:none;background-color:#e0226e}.btn-secondary{color:#24292e;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#e4e4e5;background-image:linear-gradient(to bottom, #ececec, #d8d9da);background-repeat:repeat-x;border-color:#ececec}.btn-secondary:hover,.btn-secondary:focus,.btn-secondary:active,.btn-secondary.active,.btn-secondary.disabled,.btn-secondary[disabled]{color:#24292e;background-image:none;background-color:#ececec}.btn-inverse{color:#555;text-shadow:0 1px 0 rgba(255,255,255,.4);background-color:#e4e4e5;background-image:linear-gradient(to bottom, #ececec, #d8d9da);background-repeat:repeat-x;border-color:#ececec;box-shadow:none}.btn-inverse:hover,.btn-inverse:focus,.btn-inverse:active,.btn-inverse.active,.btn-inverse.disabled,.btn-inverse[disabled]{color:#555;background-image:none;background-color:#ececec}.btn-transparent{background-color:rgba(0,0,0,0)}.btn-outline-primary{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff}.btn-outline-primary:hover{color:#fff;background-color:#3871dc}.btn-outline-primary:focus,.btn-outline-primary.focus{color:#fff;background-color:#3871dc}.btn-outline-primary:active,.btn-outline-primary.active,.open>.btn-outline-primary.dropdown-toggle{color:#fff;background-color:#3871dc}.btn-outline-primary:active:hover,.btn-outline-primary:active:focus,.btn-outline-primary:active.focus,.btn-outline-primary.active:hover,.btn-outline-primary.active:focus,.btn-outline-primary.active.focus,.open>.btn-outline-primary.dropdown-toggle:hover,.open>.btn-outline-primary.dropdown-toggle:focus,.open>.btn-outline-primary.dropdown-toggle.focus{color:#fff;background-color:#1c4aa1;border-color:#163a7e}.btn-outline-primary.disabled:focus,.btn-outline-primary.disabled.focus,.btn-outline-primary:disabled:focus,.btn-outline-primary:disabled.focus{border-color:#8fafeb}.btn-outline-primary.disabled:hover,.btn-outline-primary:disabled:hover{border-color:#8fafeb}.btn-outline-secondary{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff}.btn-outline-secondary:hover{color:#fff;background-color:#d8d9da}.btn-outline-secondary:focus,.btn-outline-secondary.focus{color:#fff;background-color:#d8d9da}.btn-outline-secondary:active,.btn-outline-secondary.active,.open>.btn-outline-secondary.dropdown-toggle{color:#fff;background-color:#d8d9da}.btn-outline-secondary:active:hover,.btn-outline-secondary:active:focus,.btn-outline-secondary:active.focus,.btn-outline-secondary.active:hover,.btn-outline-secondary.active:focus,.btn-outline-secondary.active.focus,.open>.btn-outline-secondary.dropdown-toggle:hover,.open>.btn-outline-secondary.dropdown-toggle:focus,.open>.btn-outline-secondary.dropdown-toggle.focus{color:#fff;background-color:#acaeb0;border-color:#97999c}.btn-outline-secondary.disabled:focus,.btn-outline-secondary.disabled.focus,.btn-outline-secondary:disabled:focus,.btn-outline-secondary:disabled.focus{border-color:#fff}.btn-outline-secondary.disabled:hover,.btn-outline-secondary:disabled:hover{border-color:#fff}.btn-outline-inverse{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff}.btn-outline-inverse:hover{color:#fff;background-color:#ececec}.btn-outline-inverse:focus,.btn-outline-inverse.focus{color:#fff;background-color:#ececec}.btn-outline-inverse:active,.btn-outline-inverse.active,.open>.btn-outline-inverse.dropdown-toggle{color:#fff;background-color:#ececec}.btn-outline-inverse:active:hover,.btn-outline-inverse:active:focus,.btn-outline-inverse:active.focus,.btn-outline-inverse.active:hover,.btn-outline-inverse.active:focus,.btn-outline-inverse.active.focus,.open>.btn-outline-inverse.dropdown-toggle:hover,.open>.btn-outline-inverse.dropdown-toggle:focus,.open>.btn-outline-inverse.dropdown-toggle.focus{color:#fff;background-color:#c1c1c1;border-color:#acacac}.btn-outline-inverse.disabled:focus,.btn-outline-inverse.disabled.focus,.btn-outline-inverse:disabled:focus,.btn-outline-inverse:disabled.focus{border-color:#fff}.btn-outline-inverse.disabled:hover,.btn-outline-inverse:disabled:hover{border-color:#fff}.btn-outline-danger{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff}.btn-outline-danger:hover{color:#fff;background-color:#e0226e}.btn-outline-danger:focus,.btn-outline-danger.focus{color:#fff;background-color:#e0226e}.btn-outline-danger:active,.btn-outline-danger.active,.open>.btn-outline-danger.dropdown-toggle{color:#fff;background-color:#e0226e}.btn-outline-danger:active:hover,.btn-outline-danger:active:focus,.btn-outline-danger:active.focus,.btn-outline-danger.active:hover,.btn-outline-danger.active:focus,.btn-outline-danger.active.focus,.open>.btn-outline-danger.dropdown-toggle:hover,.open>.btn-outline-danger.dropdown-toggle:focus,.open>.btn-outline-danger.dropdown-toggle.focus{color:#fff;background-color:#961549;border-color:#721037}.btn-outline-danger.disabled:focus,.btn-outline-danger.disabled.focus,.btn-outline-danger:disabled:focus,.btn-outline-danger:disabled.focus{border-color:#ed7ba9}.btn-outline-danger.disabled:hover,.btn-outline-danger:disabled:hover{border-color:#ed7ba9}.btn-outline-disabled{color:#fff;background-image:none;background-color:rgba(0,0,0,0);border:1px solid #fff;box-shadow:none;cursor:default}.btn-outline-disabled:hover{color:#fff;background-color:#555}.btn-outline-disabled:focus,.btn-outline-disabled.focus{color:#fff;background-color:#555}.btn-outline-disabled:active,.btn-outline-disabled.active,.open>.btn-outline-disabled.dropdown-toggle{color:#fff;background-color:#555}.btn-outline-disabled:active:hover,.btn-outline-disabled:active:focus,.btn-outline-disabled:active.focus,.btn-outline-disabled.active:hover,.btn-outline-disabled.active:focus,.btn-outline-disabled.active.focus,.open>.btn-outline-disabled.dropdown-toggle:hover,.open>.btn-outline-disabled.dropdown-toggle:focus,.open>.btn-outline-disabled.dropdown-toggle.focus{color:#fff;background-color:#2a2a2a;border-color:#151515}.btn-outline-disabled.disabled:focus,.btn-outline-disabled.disabled.focus,.btn-outline-disabled:disabled:focus,.btn-outline-disabled:disabled.focus{border-color:#888}.btn-outline-disabled.disabled:hover,.btn-outline-disabled:disabled:hover{border-color:#888}.btn-outline-disabled:hover,.btn-outline-disabled:active,.btn-outline-disabled:active:hover,.btn-outline-disabled:focus{color:#555;background-color:rgba(0,0,0,0);border-color:#555}.btn-p-x-2{padding-left:20px;padding-right:20px}.btn-p-x-0{padding-left:0;padding-right:0}.btn-service{position:relative}.btn-service--github{background-color:#464646;border:1px solid #393939}.btn-service--github .btn-service-icon{font-size:24px;border-right:1px solid #393939}.btn-service--gitlab{background-color:#fc6d26;border:1px solid #e24329}.btn-service--gitlab .btn-service-icon{font-size:24px;border-right:1px solid #e24329}.btn-service--google{background-color:#e84d3c;border:1px solid #b83e31}.btn-service--google .btn-service-icon{font-size:24px;border-right:1px solid #b83e31}.btn-service--azuread{background-color:#2f2f2f;border:1px solid #2f2f2f}.btn-service--azuread .btn-service-icon{font-size:24px;border-right:1px solid #2f2f2f}.btn-service--grafanacom{background-color:#262628;border:1px solid #393939}.btn-service--grafanacom .btn-service-icon{font-size:24px;border-right:1px solid #393939}.btn-service--okta{background-color:#2f2f2f;border:1px solid #393939}.btn-service--okta .btn-service-icon{font-size:24px;border-right:1px solid #393939}.btn-service--oauth{background-color:#262628;border:1px solid #393939}.btn-service--oauth .btn-service-icon{font-size:24px;border-right:1px solid #393939}.btn-service-icon{position:absolute;left:0;height:100%;top:0;padding-left:8px;padding-right:8px;width:35px;text-align:center}.btn-service-icon::before{position:relative;top:4px}.btn-service--grafanacom .btn-service-icon{background-image:url(../img/grafana_mask_icon_white.svg);background-repeat:no-repeat;background-position:50%;background-size:60%}.btn-service--azuread .btn-service-icon{background-image:url(../img/microsoft_auth_icon.svg);background-repeat:no-repeat;background-position:50%;background-size:60%}.btn-service--okta .btn-service-icon{background-image:url(../img/okta_logo_white.png);background-repeat:no-repeat;background-position:50%;background-size:60%}.toggle-btn{background:#f4f5f5;color:rgba(36,41,46,.75);box-shadow:none}.toggle-btn:first-child{border-radius:2px 0 0 2px;margin:0}.toggle-btn:last-child{border-radius:0 2px 2px 0;margin-left:0 !important}.toggle-btn.active{background-color:#fff;color:#24292e}.toggle-btn.active:hover{cursor:default}.btn-loading span{animation-name:blink;animation-duration:1.4s;animation-iteration-count:infinite;animation-fill-mode:both}.btn-loading span:nth-child(2){animation-delay:.2s}.btn-loading span:nth-child(3){animation-delay:.4s}@keyframes blink{0%{opacity:.2;font-size:14}20%{opacity:1;font-size:18}100%{opacity:.2;font-size:14}}.nav{margin:0;list-style:none}.nav>li>a{display:block}.nav>.pull-right{float:right}.nav-tabs::after{content:"";display:table;clear:both}.nav-tabs>li{float:left}.nav-tabs>li>a{padding-right:12px;padding-left:12px;margin-right:2px;line-height:14px}.nav-tabs{border-bottom:1px solid #8e8e8e;padding-left:10px;margin:0 0 10px 0}.nav-tabs>li{margin-bottom:-1px}.nav-tabs>.active>a,.nav-tabs>.active>a:hover,.nav-tabs>.active>a:focus{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;border-color:#8e8e8e;border-bottom:1px solid #fff;color:#24292e}.tab-content>.tab-pane{display:none}.tab-content>.active{display:block}.modal-body .nav-tabs{border-bottom:none}.modal-body .nav-tabs>li>a{border:none;border-radius:0}.modal-body .nav-tabs>li>a:hover,.modal-body .nav-tabs>li>a:focus{border-bottom:1px solid #1f62e0}.modal-body .nav-tabs>.active>a,.modal-body .nav-tabs>.active>a:hover,.modal-body .nav-tabs>.active>a:focus{border:none;border-bottom:1px solid #1f62e0;color:#24292e}.gf-tabs{float:left;position:relative;top:1px}.gf-tabs::after{content:"";display:table;clear:both}.gf-tabs-item{float:left;list-style:none}.gf-tabs-link{padding:10px 15px 9px;margin-right:8px;position:relative;display:block;border:solid rgba(0,0,0,0);border-width:0 1px 1px;border-radius:3px 3px 0 0;color:#24292e}.gf-tabs-link i{margin-right:5px}.gf-tabs-link .gicon{position:relative;top:-2px}.gf-tabs-link:hover,.gf-tabs-link:focus{color:#000}.gf-tabs-link.active,.gf-tabs-link.active:hover,.gf-tabs-link.active:focus{border-color:#eb7b18 #ececec rgba(0,0,0,0);background:#f4f5f5;color:#24292e;overflow:hidden}.gf-tabs-link.active::before,.gf-tabs-link.active:hover::before,.gf-tabs-link.active:focus::before{display:block;content:" ";position:absolute;left:0;right:0;height:2px;top:0;background-image:linear-gradient(90deg, #FF8833 0%, #F53E4C 100%)}.gf-tabs-link.active--panel{background:#fff !important}.alert{padding:15px 20px;margin-bottom:4px;border-left:3px solid #e0226e;background:#f4f5f5;position:relative;border-radius:2px;display:flex;flex-direction:row;align-items:center}.alert-success{border-color:#1b855e}.alert-danger,.alert-error{border-color:#e0226e}.alert-info{border-color:#fad34a}.alert-warning{border-color:#fad34a}.page-alert-list{z-index:8000;min-width:400px;max-width:600px;position:fixed;right:10px;top:60px}.alert-close{padding:0 0 0 16px;border:none;background:none;display:flex;align-items:center}.alert-close .fa{align-self:flex-end;font-size:21px;color:rgba(255,255,255,.75)}.alert-title{font-weight:500}.alert-icon{padding:0 16px 0 0;display:flex;align-items:center;justify-content:center;width:35px}.alert-icon .fa{font-size:21px}.alert-body{overflow-wrap:break-word;word-break:break-word;flex-grow:1}.alert-icon-on-top{align-items:flex-start}@media(max-width: 768px){.page-alert-list{min-width:0;top:30px;width:calc(100% - 20px);max-height:calc(100% - 60px);overflow-y:auto}}gf-form-switch[disabled] .gf-form-switch,gf-form-switch[disabled] .gf-form-switch-container{cursor:default;pointer-events:none !important}gf-form-switch[disabled] .gf-form-switch .gf-form-label,gf-form-switch[disabled] .gf-form-switch-container .gf-form-label{color:rgba(36,41,46,.75)}.gf-form-switch-container-react{display:flex;flex-shrink:0}.gf-form-switch-container{display:flex;cursor:pointer;margin-right:4px}.gf-form-switch{display:flex;position:relative;width:56px;height:32px;background:#fff;border:1px solid rgba(36,41,46,.3);border-radius:2px;align-items:center;justify-content:center}.gf-form-switch input{opacity:0;width:0;height:0}.gf-form-switch--transparent{background:rgba(0,0,0,0);border:0;width:40px}.gf-form-switch__slider{background:#ececec;border-radius:8px;height:16px;width:32px;display:block;position:relative}.gf-form-switch__slider::before{position:absolute;content:"";height:12px;width:12px;left:2px;top:2px;background:#fbfbfb;transition:.4s;border-radius:50%;box-shadow:0 0 3px #161719}input:checked+.gf-form-switch__slider{background:#1f60c4}input:checked+.gf-form-switch__slider::before{transform:translateX(16px)}.gf-form-checkbox{position:relative;display:flex;width:50px;height:32px;background:#fff;border:1px solid rgba(36,41,46,.3);border-left:none;border-radius:2px;align-items:center;justify-content:center}.gf-form-checkbox input{opacity:0;width:0;height:0;appearance:none}.gf-form-checkbox--transparent{background:rgba(0,0,0,0);border:none;width:23px;height:auto;position:relative;padding-left:8px}.gf-form-checkbox--table-cell{width:20px;background:rgba(0,0,0,0);height:auto;border:none;position:relative;top:-5px}.gf-form-switch__checkbox{height:16px;width:16px;border-radius:3px;border:1px solid #b3b3b3;background:#f4f5f8;display:flex;align-items:center;justify-content:center}input:checked+.gf-form-switch__checkbox::before{font-family:"FontAwesome";content:"\uF00C";color:#fbfbfb}input:checked+.gf-form-switch__checkbox{background:linear-gradient(0deg, #ff9830, #e55400);border:none}.tooltip{position:absolute;z-index:1040;display:block;visibility:visible;line-height:1.4;font-weight:500;opacity:0}.tooltip.in{opacity:1}.tooltip.top{margin-top:-3px;padding:5px 0}.tooltip.right{margin-left:3px;padding:0 5px}.tooltip.bottom{margin-top:3px;padding:5px 0}.tooltip.left{margin-left:-3px;padding:0 5px}.tooltip-inner{max-width:400px;padding:8px 16px;padding:4px 8px;color:#24292e;text-align:center;text-decoration:none;background-color:#f4f5f5;border-radius:2px}.tooltip-arrow{position:absolute;width:0;height:0;border-color:rgba(0,0,0,0);border-style:solid}.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-width:5px 5px 0;border-top-color:#f4f5f5}.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#f4f5f5}.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-width:5px 0 5px 5px;border-left-color:#f4f5f5}.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-width:0 5px 5px;border-bottom-color:#f4f5f5}.grafana-tooltip{position:absolute;top:-1000;left:0;color:#24292e;padding:10px;font-size:11pt;font-weight:200;background-color:#f4f5f5;border-radius:5px;z-index:9999;max-width:800px;max-height:600px;overflow:hidden;line-height:14px}.grafana-tooltip a{color:#2f363c}.grafana-tooltip a.external-link,.grafana-tooltip .grafana-info-box a,.grafana-info-box .grafana-tooltip a{color:#6e9fff}.grafana-tip{padding-left:5px}.label,.badge{display:inline-block;padding:2px 4px;font-size:11.844px;font-weight:500;line-height:14px;color:#fff;vertical-align:baseline;white-space:nowrap;text-shadow:0 -1px 0 rgba(0,0,0,.25);background-color:#555}.label-tag{background-color:#93c;color:#f2f2f2;white-space:nowrap;border-radius:3px;text-shadow:none;font-size:12px;padding:0px 6px;line-height:20px;height:20px}.label-tag svg{margin-bottom:0}.label-tag .icon-tag{position:relative;top:1px;padding-right:4px}.label-tag.muted{opacity:.85;background-color:#7a29a3;color:rgba(36,41,46,.75)}.label-tag:hover{opacity:.85;background-color:#7a29a3}.label-tag--gray{opacity:.85;background-color:#555;border-color:#8e8e8e}.label-tag--gray:hover{background-color:#555}.graph-panel{display:flex;flex-direction:column;height:100%}@media(min-width: 544px){.graph-panel--legend-right{flex-direction:row}.graph-panel--legend-right .graph-legend{flex:0 1 10px;max-height:100%;overflow-y:initial}.graph-panel--legend-right .graph-legend-series{display:block;padding-left:4px}.graph-panel--legend-right .graph-legend-table .graph-legend-series{display:table-row}}.graph-panel__chart{position:relative;cursor:crosshair;flex-grow:1;min-height:65%}.datapoints-warning{position:absolute;top:50%;left:50%;z-index:10;margin-top:-50px;margin-left:-100px;width:200px;text-align:center;cursor:auto;padding:10px}.graph-legend{display:flex;flex:0 1 auto;max-height:35%;margin:0;text-align:center;overflow-y:auto;padding-top:6px;position:relative}.graph-legend .popover-content{padding:0}.graph-legend-alias{background:rgba(0,0,0,0);border:none}.graph-legend-content{position:relative}.graph-legend-icon{position:relative;padding-right:4px;top:1px}.graph-legend-icon,.graph-legend-alias,.graph-legend-value{display:inline;white-space:nowrap;font-size:12px;text-align:left}.graph-legend-icon.current::before,.graph-legend-alias.current::before,.graph-legend-value.current::before{content:"Current: "}.graph-legend-icon.max::before,.graph-legend-alias.max::before,.graph-legend-value.max::before{content:"Max: "}.graph-legend-icon.min::before,.graph-legend-alias.min::before,.graph-legend-value.min::before{content:"Min: "}.graph-legend-icon.total::before,.graph-legend-alias.total::before,.graph-legend-value.total::before{content:"Total: "}.graph-legend-icon.avg::before,.graph-legend-alias.avg::before,.graph-legend-value.avg::before{content:"Avg: "}.graph-legend-icon .fa{font-size:135%;position:relative;top:1px}.graph-legend-series{float:left;white-space:nowrap;padding-left:10px;display:flex;align-items:center}.graph-legend-series--right-y{float:right}.graph-panel--legend-right .graph-legend-series--right-y{float:left}.graph-legend-value{padding-left:6px}.graph-legend-table{padding-right:5px;padding-left:5px}.graph-legend-table .graph-legend-series{display:table-row;float:none;padding-left:0}.graph-legend-table .graph-legend-series--right-y{float:none}.graph-legend-table .graph-legend-series--right-y .graph-legend-alias::after{content:"(right-y)";padding:0 5px;color:rgba(36,41,46,.75)}.graph-legend-table td,.graph-legend-table .graph-legend-alias,.graph-legend-table .graph-legend-icon,.graph-legend-table .graph-legend-value{float:none;display:table-cell;white-space:nowrap;padding:2px;text-align:right}.graph-legend-table .graph-legend-icon{cursor:pointer}.graph-legend-table .graph-legend-value{padding-left:15px}.graph-legend-table .graph-legend-alias{text-align:left;max-width:650px;text-overflow:ellipsis;overflow:hidden}.graph-legend-table .graph-legend-series:nth-child(even){background:#f4f5f5}.graph-legend-table .graph-legend-value.current::before,.graph-legend-table .graph-legend-value.max::before,.graph-legend-table .graph-legend-value.min::before,.graph-legend-table .graph-legend-value.total::before,.graph-legend-table .graph-legend-value.avg::before{content:""}.graph-legend-table th{text-align:right;padding:0px 10px 1px 0;font-weight:bold;color:#1f62e0;font-size:85%;white-space:nowrap}.graph-legend-series__table-name{display:flex;align-items:center}.graph-legend-series-hidden .graph-legend-value,.graph-legend-series-hidden .graph-legend-alias{color:rgba(36,41,46,.5)}.graph-legend-popover{width:210px}.graph-legend-popover label{display:inline-block}.graph-legend-popover .btn{padding:1px 3px;margin-right:0px;line-height:initial}.annotation-tags{color:#93c}.graph-series-override__properties{margin-left:16px}.graph-tooltip{white-space:nowrap;font-size:12px;background-color:#ececec;color:#24292e}.graph-tooltip .graph-tooltip-time{text-align:center;position:relative;top:-3px;padding:2px;font-weight:500;color:#24292e}.graph-tooltip .graph-tooltip-list-item{display:table-row}.graph-tooltip .graph-tooltip-list-item--highlight{color:#000;font-weight:500}.graph-tooltip .graph-tooltip-series-name{display:table-cell;padding:2px;max-width:650px;text-overflow:ellipsis;overflow:hidden}.graph-tooltip .graph-tooltip-value{display:table-cell;font-weight:500;padding-left:15px;text-align:right}.graph-annotation .label-tag{margin-right:4px;margin-top:8px}.graph-annotation .graph-annotation__header{background:#f4f5f5;padding:4px 8px;display:flex;flex-wrap:nowrap}.graph-annotation .graph-annotation__title{font-weight:500;padding-right:16px;overflow:hidden;display:inline-block;white-space:nowrap;text-overflow:ellipsis;flex-grow:1}.graph-annotation .graph-annotation__edit-icon{padding-left:16px}.graph-annotation .graph-annotation__time{color:rgba(36,41,46,.75);font-style:italic;font-weight:normal;display:inline-block;position:relative;top:1px}.graph-annotation .graph-annotation__body{padding:8px}.graph-annotation .graph-annotation__user img{border-radius:50%;width:16px;height:16px}.graph-annotation a[href]{color:#1f62e0;text-decoration:underline}.left-yaxis-label{top:50%;left:8px;transform:translateX(-50%) translateY(-50%) rotate(-90deg)}.right-yaxis-label{top:50%;right:8px;transform:translateX(50%) translateY(-50%) rotate(90deg)}.axisLabel{display:inline-block;color:#24292e;font-size:12px;position:absolute;text-align:center}.alert-handle-wrapper{position:absolute;user-select:none}.alert-handle-wrapper .alert-handle{z-index:10;position:relative;float:right;box-shadow:none;background:#f4f5f5;cursor:move;width:100px;font-size:12px;border-radius:4px;text-align:left;color:rgba(36,41,46,.75)}.alert-handle-wrapper .alert-handle:hover{background-color:#d8d9da}.alert-handle-wrapper .alert-handle .icon-gf{font-size:14px;position:relative;top:0px;float:left;border-right:1px solid #d8d9da;padding:6px 4px 4px 6px}.alert-handle-wrapper .alert-handle-value{border-left:1px solid #fbfbfb;padding:4px 8px;padding:7px;line-height:24px;height:24px}.alert-handle-wrapper .alert-handle-value .alert-handle-grip{background:url("../img/grab_light.svg") no-repeat 50% 50%;background-size:8px;float:right;width:16px;height:24px;margin-right:2px}.alert-handle-wrapper--T1{right:-222px;width:245px}.alert-handle-wrapper--T1 .alert-handle-line{width:145px}.alert-handle-wrapper--T0{right:-104px;width:129px}.alert-handle-wrapper--T0 .alert-handle-line{width:28px}.alert-handle-wrapper--no-value .alert-handle-line{display:none}.alert-handle-wrapper .alert-handle-line{float:left;height:2px;margin-top:13px;z-index:0;position:relative}.alert-handle-wrapper .alert-handle-line--critical{background-color:rgba(237,46,24,.6)}.alert-handle-wrapper .alert-handle-line--warning{background-color:rgba(247,149,32,.6)}.thresholds-form-disabled{filter:blur(3px)}.submenu-controls{display:flex;flex-direction:row;flex-wrap:wrap;align-content:flex-start;align-items:flex-start;gap:8px 16px;padding:0 0 8px 0}.submenu-item{display:inline-block}.submenu-item .fa-caret-down{font-size:75%;padding-left:8px}.submenu-item .gf-form{margin-bottom:0}.variable-link-wrapper{display:inline-block;position:relative}.progress-tracker-container{height:100%;display:flex;align-items:center}.progress-tracker-close-btn{color:rgba(36,41,46,.75);position:absolute;z-index:10;top:8px;right:8px;font-size:18px;background-color:rgba(0,0,0,0);border:none}.progress-tracker-close-btn:hover{color:#000}.progress-tracker{display:flex;width:100%;padding:0;align-items:center}.progress-step{text-align:center;position:relative;flex:1 1 0%;margin:0;padding:0;color:rgba(36,41,46,.75);height:84px;min-width:60px}.progress-step::after{content:"";display:block;position:absolute;z-index:0;top:29px;bottom:29px;right:-30px;width:100%;height:2px;border-top:2px solid #b3b3b3}.progress-step:first-child::after{left:50%}.progress-step:last-child::after{right:50%}.progress-step.active .progress-step-cta{display:inline-flex}.progress-step.active .progress-title{font-weight:400}.progress-step.active .progress-text{display:none}.progress-step.active .progress-marker .icon-gf{color:#eb7b18;-webkit-text-fill-color:rgba(0,0,0,0);background:linear-gradient(90deg, #FF8833 0%, #F53E4C 100%);-webkit-background-clip:text;text-decoration:none}.progress-step.active .progress-marker .gicon{opacity:1}.progress-step.completed .progress-marker{color:#0a764e}.progress-step.completed .progress-marker .icon-gf::before{content:"\uE604"}.progress-step.completed .progress-text{text-decoration:line-through}.progress-step-cta{padding:4px 7px;font-size:12px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;color:#fff;text-shadow:0px 1px 0 rgba(0,0,0,.1);background-color:#3368ca;background-image:linear-gradient(to bottom, #3871DC, rgb(44, 90, 176));background-repeat:repeat-x;border-color:#3871dc;display:none}.progress-step-cta:hover,.progress-step-cta:focus,.progress-step-cta:active,.progress-step-cta.active,.progress-step-cta.disabled,.progress-step-cta[disabled]{color:#fff;background-image:none;background-color:#3871dc}.progress-marker{display:flex;justify-content:center;align-items:center;position:relative;width:60px;height:60px;padding-bottom:2px;z-index:1;background-color:#fff;margin-left:auto;margin-right:auto;color:rgba(36,41,46,.75);font-size:35px;vertical-align:sub}.progress-text{display:block;overflow:hidden;text-overflow:ellipsis;color:rgba(36,41,46,.75)}.progress-marker{color:rgba(36,41,46,.75);text-decoration:none;font-size:35px;vertical-align:sub}.progress-marker .gicon{opacity:.7}a.progress-link:hover .progress-marker,a.progress-link:hover .progress-text{color:#000}a.progress-link:hover:hover .progress-marker.completed{color:#0a764e}.piechart-panel{position:relative;display:table;width:100%;height:100%}.piechart-panel .piechart-container{top:10px;margin:auto}.piechart-panel .piechart-container svg{width:100%;height:100%}.piechart-panel .piechart-tooltip{white-space:nowrap;font-size:12px;background-color:#141414;color:#d8d9da;opacity:0;position:absolute}.piechart-panel .piechart-tooltip .piechart-tooltip-time{text-align:center;position:relative;padding:2px;font-weight:bold;color:#d8d9da}.piechart-panel .piechart-tooltip .piechart-tooltip-time .piechart-tooltip-value{display:table-cell;font-weight:bold;padding:15px;text-align:right}.pluginlist-section-header{margin-bottom:16px;color:rgba(36,41,46,.75)}.pluginlist-section{margin-bottom:16px}.pluginlist-link{display:block;margin:3px;padding:7px;background:#fbfbfb;box-shadow:none;border-radius:2px}.pluginlist-link:hover{background:#f4f5f8}.pluginlist-icon{vertical-align:sub;font-size:2rem;margin-right:8px}.pluginlist-image{width:17px}.pluginlist-title{margin-right:5.3333333333px}.pluginlist-version{font-size:12px;color:rgba(36,41,46,.75)}.pluginlist-message{float:right;font-size:12px}.pluginlist-message--update:hover{border-bottom:1px solid #24292e}.pluginlist-message--enable{color:#1f62e0}.pluginlist-message--enable:hover{border-bottom:1px solid #1f62e0}.pluginlist-message--no-update{color:rgba(36,41,46,.75)}.pluginlist-emphasis{font-weight:500}.singlestat-panel{position:relative;display:table;width:100%;height:100%}.singlestat-panel-value-container{display:table-cell;vertical-align:middle;text-align:center;position:relative;z-index:1;font-weight:500;line-height:1}.panel-container--no-title .singlestat-panel-value-container{padding-bottom:0}.singlestat-panel-prefix{padding-right:20px}#flotGaugeValue0{font-weight:500}.table-panel-content{padding:0}.table-panel-content .panel-title-container{padding-bottom:4px}.table-panel-scroll{overflow:auto}.table-panel-container{padding-top:2.2em;position:relative}.table-panel-footer{text-align:center;font-size:90%;line-height:2px}.table-panel-footer ul{position:relative;display:inline-block;margin-left:0;margin-bottom:0}.table-panel-footer ul>li{display:inline}.table-panel-footer ul>li>a{float:left;padding:4px 12px;text-decoration:none;border-left-width:0}.table-panel-footer ul>li>a:hover{background-color:#f4f5f5}.table-panel-footer ul>li>a.active{font-weight:bold;color:#1f62e0}.table-panel-table{width:100%;border-collapse:collapse}.table-panel-table th{padding:0}.table-panel-table th:first-child .table-panel-table-header-inner{padding-left:15px}.table-panel-table td{padding:.45em 1.1em;border-bottom:2px solid #f4f5f5;border-right:2px solid #f4f5f5}.table-panel-table td:first-child{padding-left:15px}.table-panel-table td:last-child{border-right:none}.table-panel-table td.table-panel-cell-pre{white-space:pre}.table-panel-table td.table-panel-cell-link{padding:0}.table-panel-table td.table-panel-cell-link a{padding:.45em 0 .45em 1.1em;height:100%;display:inline-block;text-decoration:underline;text-underline-position:under}.table-panel-table td.cell-highlighted:hover{background-color:#f4f5f5}.table-panel-table td:hover .table-panel-filter-link{visibility:visible}.table-panel-filter-link{visibility:hidden;color:rgba(36,41,46,.75);float:right;display:block;padding:0 5px}.table-panel-header-bg{background:#fbfbfb;border-top:2px solid #f4f5f5;border-bottom:2px solid #f4f5f5;height:2em;position:absolute;top:0;right:0;left:0}.table-panel-table-header-inner{padding:.3em 0 .45em 1.1em;text-align:left;color:#1f62e0;position:absolute;top:0}.table-panel-width-hack{visibility:hidden;height:0px;line-height:0px}.table-panel-color-cell{color:#fff}.table-panel-color-cell a{color:#fff}.table-panel-color-row{color:#fff}.table-panel-color-row a{color:#fff}.heatmap-canvas-wrapper{cursor:crosshair}.heatmap-panel{position:relative}.heatmap-panel .axis .tick text{fill:#24292e;color:#24292e;font-size:11px}.heatmap-panel .axis .tick line{opacity:.4;stroke:rgba(36,41,46,.75)}.heatmap-panel svg{pointer-events:none}.heatmap-panel svg rect{pointer-events:visiblePainted}.heatmap-tooltip{white-space:nowrap;font-size:12px;background-color:#ececec;color:#24292e}.heatmap-histogram rect{fill:rgba(36,41,46,.75)}.heatmap-crosshair line{stroke:#9f164d;stroke-width:1}.heatmap-selection{stroke-width:1;fill:rgba(102,102,102,.4);stroke:rgba(102,102,102,.8)}.heatmap-legend-wrapper{margin:0 16px;padding-top:4px}.heatmap-legend-wrapper::after{content:"";display:table;clear:both}.heatmap-legend-wrapper svg{width:100%;max-width:300px;height:18px;float:left;white-space:nowrap}.heatmap-legend-wrapper .heatmap-legend-values{display:inline-block}.heatmap-legend-wrapper .axis .tick text{fill:#24292e;color:#24292e;font-size:11px}.heatmap-legend-wrapper .axis .tick line{opacity:.4;stroke:rgba(36,41,46,.75)}.heatmap-legend-wrapper .axis .tick .domain{opacity:.4;stroke:rgba(36,41,46,.75)}.bootstrap-tagsinput{display:inline-block;padding:0 0 0 6px;vertical-align:middle;max-width:100%;line-height:22px;background-color:#fff;border:1px solid rgba(36,41,46,.3)}.bootstrap-tagsinput input{display:inline-block;border:none;margin:0px;border-radius:0;padding:8px 6px;height:100%;width:70px;box-sizing:border-box}.bootstrap-tagsinput input.gf-form-input--has-help-icon{padding-right:32px}.bootstrap-tagsinput .tag{margin-right:2px;color:#fff}.bootstrap-tagsinput .tag [data-role=remove]{margin-left:8px;cursor:pointer}.bootstrap-tagsinput .tag [data-role=remove]::after{content:"x";padding:0px 2px}.bootstrap-tagsinput .tag [data-role=remove]:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05)}.bootstrap-tagsinput .tag [data-role=remove]:hover:active{box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.tag-filter{flex-grow:1}.tag-filter .label-tag{margin-left:6px;cursor:pointer}.tag-filter .label-tag .fa.fa-remove{margin-right:3px}.tag-filter-option{position:relative;text-align:left;width:100%;display:block;border-radius:0;cursor:pointer;padding:2px 0}.tag-count-label{margin-left:3px}.tag-filter-values{display:inline}.tag-filter-values .label-tag{margin:6px 6px 0px 0px;font-size:11px;cursor:pointer}.tag-filter-values .label-tag .fa.fa-remove{margin-right:3px}.grafana-options-table{width:100%}.grafana-options-table th{text-align:left;padding:5px 10px;border-bottom:4px solid #fff}.grafana-options-table tr td{background-color:#fbfbfb;padding:5px 10px;white-space:nowrap;border-bottom:4px solid #fff}.grafana-options-table tr td.nobg{background-color:rgba(0,0,0,0)}.grafana-options-table .max-width-btns{padding-right:0px}.grafana-options-table .max-width-btns .btn{box-sizing:border-box;width:100%}.max-width{overflow:hidden;text-overflow:ellipsis;-o-text-overflow:ellipsis;white-space:nowrap}.grafana-list-item{display:block;padding:1px 10px;line-height:34px;background-color:#fbfbfb;margin-bottom:4px;cursor:pointer}.search-results-container{display:block;padding:16px;position:relative;flex-grow:10;margin-bottom:16px;background:#fff;border:1px solid rgba(36,41,46,.12);border-radius:3px;height:unset}.search-results-container .label-tag{margin-top:2px;margin-left:6px;font-size:11px;padding:2px 6px}.search-results-container .selected .search-result-tag{opacity:.7;color:#fff}.search-section{background:#fff;border-bottom:1px solid #e9edf2;padding:0px 4px 4px 4px;margin-bottom:3px}.search-section__header{font-size:1rem;padding:7px 4px 3px 0;color:rgba(36,41,46,.75);display:flex;flex-grow:1}.search-section__header:hover,.search-section__header.selected{color:#24292e}.search-section__header:hover .search-section__header__link{opacity:1}.search-section__header__icon{padding:5px 0px;width:43px;text-align:center}.search-section__header__toggle{padding:5px}.search-section__header__text{flex-grow:1;line-height:24px}.search-section__header__link{padding:2px 10px 0;color:rgba(36,41,46,.75);opacity:0;transition:opacity 150ms ease-in-out}.search-item{display:block;margin:3px;padding:7px;background:#fbfbfb;box-shadow:none;border-radius:2px;display:flex;flex-grow:1;align-items:center;height:auto;min-height:37px;white-space:initial;padding:0px}.search-item:hover{background:#f4f5f8}.search-item:hover,.search-item.selected{background:#f4f5f8}.search-item:hover .search-item__body-title,.search-item.selected .search-item__body-title{color:#000}.search-item__body{flex:1 1 auto;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:0 10px}.search-item__body-folder-title{color:rgba(36,41,46,.75);font-size:10px;line-height:11px;position:relative;top:-1px}.search-item__icon{display:flex;align-items:center;flex:0 0 auto;font-size:19px;padding:0 2px 0 10px}.search-item__tags{display:none;padding:10px}.search-item__actions{flex:0 0 auto;padding:0 10px 0 0}.search-item__actions__item{display:inline-block;opacity:0;width:0;transition:all .2s ease-in-out}.search-item__actions__item .fa-star,.search-item__actions__item .fa-star-o{color:#eb7b18;line-height:37px}.search-item:hover .search-item__actions__item{width:15px;opacity:1}.search-button-row{text-align:center;padding:32px 16px;background:#fff}@media(min-width: 769px){.search-item__tags{display:flex;flex:1 1 auto;flex-wrap:wrap;justify-content:flex-end;margin-top:-2px}}.gf-form{display:flex;flex-direction:row;align-items:flex-start;text-align:left;position:relative;margin-bottom:4px}.gf-form--offset-1{margin-left:16px}.gf-form--grow{flex-grow:1}.gf-form--flex-end{justify-content:flex-end}.gf-form--align-center{align-content:center}.gf-form--alt{flex-direction:column;align-items:flex-start}.gf-form--alt .gf-form-label{padding:4px 0}.gf-form--has-input-icon{position:relative;margin-right:4px}.gf-form--has-input-icon .gf-form-input-icon{position:absolute;top:8px;font-size:18px;left:10px;color:rgba(36,41,46,.5)}.gf-form--has-input-icon>input{padding-left:35px}.gf-form--has-input-icon>input:focus+.gf-form-input-icon{color:rgba(36,41,46,.75)}.gf-form--has-input-icon .Select--multi .Select-multi-value-wrapper,.gf-form--has-input-icon .Select-placeholder{padding-left:30px}.gf-form-disabled{color:rgba(36,41,46,.75)}.gf-form-disabled .gf-form-select-wrapper::after{color:rgba(36,41,46,.75)}.gf-form-disabled a,.gf-form-disabled .gf-form-input{color:rgba(36,41,46,.75)}.gf-form-group{margin-bottom:40px}.gf-form-inline{display:flex;flex-direction:row;flex-wrap:wrap;align-content:flex-start}.gf-form-inline--nowrap{flex-wrap:nowrap}.gf-form-inline--xs-view-flex-column{flex-direction:row;flex-wrap:nowrap}@media(max-width: 543px){.gf-form-inline--xs-view-flex-column{flex-direction:column}}.gf-form-inline .select-container{margin-right:4px}.gf-form-inline .gf-form-spacing{margin-right:4px}.gf-form-button-row{padding-top:24px}.gf-form-button-row a,.gf-form-button-row button{margin-right:16px}.gf-form-label{display:flex;align-items:center;padding:0 8px;flex-shrink:0;font-weight:500;font-size:12px;background-color:#f4f5f5;height:32px;line-height:32px;margin-right:4px;border-radius:2px;justify-content:space-between;border:none}.gf-form-label--grow{flex-grow:1}.gf-form-label--error{color:#cf0e5b}.gf-form-label--transparent{background-color:rgba(0,0,0,0);border:0;text-align:right;padding-left:0px}.gf-form-label--variable{color:#1f62e0;background:#fff;border:1px solid rgba(36,41,46,.12)}.gf-form-label--dashlink{background:#fff;border:1px solid rgba(36,41,46,.12)}.gf-form-label--justify-left{justify-content:left}.gf-form-label--btn{border:none;border-radius:2px}.gf-form-label--btn:hover{background:#f4f5f8;color:#24292e}.gf-form-label:disabled{color:rgba(36,41,46,.75)}.gf-form-label+.gf-form-label{margin-right:4px}.gf-form-pre{display:block !important;flex-grow:1;margin:0;margin-right:4px;border:1px solid rgba(0,0,0,0);border-left:none;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}.gf-form-textarea{max-width:650px}.gf-form-input{display:block;width:100%;height:32px;padding:0 8px;font-size:14px;line-height:18px;color:#24292e;background-color:#fff;background-image:none;background-clip:padding-box;border:1px solid rgba(36,41,46,.3);border-radius:2px;margin-right:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}textarea.gf-form-input{overflow:auto;white-space:pre-wrap;padding:6px 8px;min-height:32px;height:auto}.gf-form-input::-ms-expand{background-color:rgba(0,0,0,0);border:0;display:none}.gf-form-input:focus{border-color:#5794f2;outline:none}.gf-form-input::placeholder{color:rgba(36,41,46,.5);opacity:1}.gf-form-input:disabled,.gf-form-input[readonly]{background-color:rgba(36,41,46,.04);opacity:1}.gf-form-input:disabled{cursor:not-allowed}.gf-form-input.gf-size-auto{width:auto}.gf-form-input--dropdown{padding-right:24px;position:relative;display:flex;align-items:center}.gf-form-input--dropdown::after{position:absolute;top:36%;right:11px;font-size:11px;background-color:rgba(0,0,0,0);color:#24292e;font:normal normal normal 12px/1 FontAwesome;content:"\uF0D7";pointer-events:none}.gf-form-input--small{padding-top:4px;padding-bottom:4px;font-size:12px}.gf-form-input--plaintext{white-space:unset}.gf-form-input--has-help-icon{padding-right:32px}.gf-form-hint{width:100%}.gf-form-hint-text{display:block;text-align:right;padding-top:.5em}.gf-form-select-wrapper{position:relative;background-color:#fff;margin-right:4px}.gf-form-select-wrapper .gf-form-select-icon{position:absolute;z-index:1;left:0 8px;top:50%;margin-top:-7px}.gf-form-select-wrapper .gf-form-select-icon+.gf-form-input{position:relative;z-index:2;padding-left:32px;background-color:rgba(0,0,0,0)}.gf-form-select-wrapper .gf-form-select-icon+.gf-form-input option{color:#000}.gf-form-select-wrapper .gf-form-input{margin-right:0;line-height:32px}.gf-form-select-wrapper select.gf-form-input{text-indent:.01px;text-overflow:"";padding-right:32px;appearance:none}.gf-form-select-wrapper select.gf-form-input:-moz-focusring{outline:none;color:rgba(0,0,0,0);text-shadow:0 0 0 #24292e}.gf-form-select-wrapper select.gf-form-input.ng-empty{color:rgba(36,41,46,.75)}.gf-form-select-wrapper::after{position:absolute;top:36%;right:11px;background-color:rgba(0,0,0,0);color:#24292e;font:normal normal normal 12px/1 FontAwesome;content:"\uF0D7";pointer-events:none;font-size:11px}.gf-form-select-wrapper--has-help-icon::after{right:32px}.gf-form--v-stretch{align-items:stretch}.gf-form-btn{padding:0 8px;margin-right:4px;line-height:18px;font-size:12px;flex-shrink:0;flex-grow:0}.natural-language-inputinput[type=number]{font-size:14px;line-height:18px;margin:-6px -5px 0 5px;padding:4px}.gf-form-dropdown-typeahead{position:relative}.gf-form-dropdown-typeahead::after{position:absolute;top:35%;right:8px;background-color:rgba(0,0,0,0);color:#24292e;font:normal normal normal 12px/1 FontAwesome;content:"\uF0D7";pointer-events:none;font-size:11px}.gf-form-help-icon{flex-grow:0;color:rgba(36,41,46,.75)}.gf-form-help-icon--bold{color:#000;padding-left:0}.gf-form-help-icon--right-absolute{position:absolute;right:16px;top:6px}.gf-form-help-icon--right-normal{float:right}.gf-form-help-icon--header{margin-bottom:2px}.gf-form-help-icon--small-padding{padding-left:4px}.gf-form-help-icon:hover{color:#24292e}select.gf-form-input~.gf-form-help-icon{right:10px}.gf-form-icon--right-absolute{position:absolute;right:16px;top:10px;color:rgba(36,41,46,.75)}.cta-form{position:relative;padding:24px;background-color:#f4f5f8;margin-bottom:24px;border-top:3px solid #1b855e}.cta-form__close{background:rgba(0,0,0,0);padding:4px 8px 4px 9px;border:none;position:absolute;right:0;top:-2px;font-size:14px}.cta-form__close:hover{color:#000}.cta-form__bar{display:flex;align-items:center;align-content:center;margin-bottom:20px}.cta-form__bar-header{font-size:1.2857142857rem;padding-right:20px}.navbar-page-btn{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:flex;align-items:center;margin:0;font-size:18px;min-height:52px}.navbar-page-btn .gicon{top:-2px;position:relative;font-size:17px;line-height:8px;opacity:.75;margin-right:10px;display:none}@media(min-width: 769px){.navbar-page-btn .gicon{display:inline-block}}.navbar-page-btn .navbar-page-btn__folder-icon{display:none}@media(min-width: 769px){.navbar-page-btn .navbar-page-btn__folder-icon{display:inline-block}}.filter-controls-filters{display:inline-block;margin-bottom:40px}.tab-pane>.filter-controls-filters{margin-top:20px}.filter-controls-actions{margin:0 0 10px;padding:0;list-style:none}.filter-controls-actions>li{display:inline-block;margin-right:10px}.filter-controls-actions-selected{text-transform:uppercase}.filter-list{margin:0;padding:0;list-style:none}.filter-list>li{padding:10px;margin-bottom:2px;background:#fff}.filter-list>li:last-child{margin:0}.filter-list-card{display:table;width:100%;margin:0;padding:0;list-style:none}.filter-list-card>li{display:table-cell;vertical-align:top}.filter-list-card-select{width:23px;padding-right:5px}.filter-list-card-title{display:block;font-size:16px;font-weight:normal}.filter-list-card-image{width:50px;padding:5px 50px 5px 5px}.filter-list-card-status{color:#777;font-size:12px}.filter-list-card-state{display:inline-block;padding:5px 0 0 28px;background:0 bottom no-repeat;background-size:24px auto;font-size:14px;text-transform:uppercase}.filter-list-card-state.online{background-image:url("/img/online.svg");color:#0a764e}.filter-list-card-state.warn{background-image:url("/img/warn-tiny.svg");color:#8a6c00}.filter-list-card-state.critical{background-image:url("/img/critical.svg");color:#cf0e5b}.filter-list-card-controls{float:right}.filter-list-card-links,.filter-list-card-config,.filter-list-card-expand{display:inline-block;vertical-align:middle}.filter-list-card-link{display:block;color:#777;text-align:right}.filter-list-card-link>a{color:#777}.filter-list-card-config{padding:8px 8px 8px 16px;color:#777;font-size:25px}.filter-list-card-config>a{color:#777}.filter-list-card-expand{width:20px;padding:8px 0 8px 8px;color:#aaa;font-size:30px;text-align:center;cursor:pointer}.filter-list-card-details{padding:20px 0 0 30px}.filter-list-card-details-heading{font-weight:normal}.filter-list-card-details-heading>a{float:right;color:#1f62e0;font-size:12px}.filter-table *{box-sizing:border-box}.filter-table{width:100%;border-collapse:separate}.filter-table tbody tr:nth-child(odd){background:#f9f9f9}.filter-table th{width:auto;padding:4px 8px;text-align:left;line-height:30px;height:30px;white-space:nowrap}.filter-table td{padding:4px 8px;line-height:30px;height:30px;white-space:nowrap}.filter-table td.filter-table__switch-cell{padding:0;border-right:3px solid #f4f5f5}.filter-table .link-td{padding:0;line-height:30px;height:30px;white-space:nowrap}.filter-table .link-td.filter-table__switch-cell{padding:0;border-right:3px solid #f4f5f5}.filter-table .link-td a{display:block;padding:0px 8px;height:30px}.filter-table .ellipsis{display:block;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.filter-table .expanded{border-color:#fff}.filter-table .expanded>td{padding-bottom:0}.filter-table .filter-table__avatar{width:25px;height:25px;border-radius:50%}.filter-table--hover tbody tr:hover{background:#f2f2f2}.filter-table__weak-italic{font-style:italic;color:rgba(36,41,46,.75)}.editor-row{vertical-align:top}.section{margin-right:42px;vertical-align:top;display:inline-block}div.editor-option{vertical-align:top;display:inline-block;margin-right:10px}div.editor-option label{display:block}.slate-query-field{font-size:14px;font-family:"Roboto Mono",monospace;height:auto;word-break:break-word;overflow:auto}.slate-query-field__wrapper{position:relative;display:inline-block;padding:6px 8px;min-height:32px;width:100%;color:#24292e;background-color:#fff;background-image:none;border:1px solid rgba(36,41,46,.3);border-radius:2px;transition:all .3s;line-height:18px}.slate-query-field__wrapper--disabled{background-color:inherit;cursor:not-allowed}.slate-typeahead .typeahead{position:relative;z-index:1030;border-radius:2px;border:1px solid rgba(36,41,46,.12);max-height:66vh;overflow-y:scroll;overflow-x:hidden;outline:none;list-style:none;background:#fff;color:#24292e;box-shadow:0 5px 10px 0 #ececec}.slate-typeahead .typeahead-group__title{color:rgba(36,41,46,.75);font-size:12px;line-height:1.5714285714;padding:8px}.slate-typeahead .typeahead-item{height:auto;font-family:"Roboto Mono",monospace;padding:8px 8px 8px 16px;font-size:12px;text-overflow:ellipsis;overflow:hidden;z-index:1;display:block;white-space:nowrap;cursor:pointer;transition:color .3s cubic-bezier(0.645, 0.045, 0.355, 1),border-color .3s cubic-bezier(0.645, 0.045, 0.355, 1),background .3s cubic-bezier(0.645, 0.045, 0.355, 1),padding .15s cubic-bezier(0.645, 0.045, 0.355, 1)}.slate-typeahead .typeahead-item__selected{background-color:#f4f5f8}.slate-typeahead .typeahead-item__selected .typeahead-item-hint{font-size:10px;color:#24292e;white-space:normal}.slate-typeahead .typeahead-match{color:#ecbb13;border-bottom:1px solid #ecbb13;padding:inherit;background:inherit}.slate-query-field .token.comment,.slate-query-field .token.block-comment,.slate-query-field .token.prolog,.slate-query-field .token.doctype,.slate-query-field .token.cdata,.prism-syntax-highlight .token.comment,.prism-syntax-highlight .token.block-comment,.prism-syntax-highlight .token.prolog,.prism-syntax-highlight .token.doctype,.prism-syntax-highlight .token.cdata{color:rgba(36,41,46,.75)}.slate-query-field .token.variable,.slate-query-field .token.entity,.prism-syntax-highlight .token.variable,.prism-syntax-highlight .token.entity{color:#24292e}.slate-query-field .token.property,.slate-query-field .token.tag,.slate-query-field .token.constant,.slate-query-field .token.symbol,.slate-query-field .token.deleted,.prism-syntax-highlight .token.property,.prism-syntax-highlight .token.tag,.prism-syntax-highlight .token.constant,.prism-syntax-highlight .token.symbol,.prism-syntax-highlight .token.deleted{color:#cf0e5b}.slate-query-field .token.attr-value,.slate-query-field .token.selector,.slate-query-field .token.string,.slate-query-field .token.char,.slate-query-field .token.builtin,.slate-query-field .token.inserted,.prism-syntax-highlight .token.attr-value,.prism-syntax-highlight .token.selector,.prism-syntax-highlight .token.string,.prism-syntax-highlight .token.char,.prism-syntax-highlight .token.builtin,.prism-syntax-highlight .token.inserted{color:#0a764e}.slate-query-field .token.boolean,.slate-query-field .token.number,.slate-query-field .token.operator,.slate-query-field .token.url,.prism-syntax-highlight .token.boolean,.prism-syntax-highlight .token.number,.prism-syntax-highlight .token.operator,.prism-syntax-highlight .token.url{color:#fe85fc}.slate-query-field .token.function,.slate-query-field .token.attr-name,.slate-query-field .token.function-name,.slate-query-field .token.atrule,.slate-query-field .token.keyword,.slate-query-field .token.class-name,.prism-syntax-highlight .token.function,.prism-syntax-highlight .token.attr-name,.prism-syntax-highlight .token.function-name,.prism-syntax-highlight .token.atrule,.prism-syntax-highlight .token.keyword,.prism-syntax-highlight .token.class-name{color:#1f62e0}.slate-query-field .token.punctuation,.slate-query-field .token.regex,.slate-query-field .token.important,.prism-syntax-highlight .token.punctuation,.prism-syntax-highlight .token.regex,.prism-syntax-highlight .token.important{color:#eb7b18}.slate-query-field .token.important,.prism-syntax-highlight .token.important{font-weight:normal}.slate-query-field .token.bold,.prism-syntax-highlight .token.bold{font-weight:bold}.slate-query-field .token.italic,.prism-syntax-highlight .token.italic{font-style:italic}.slate-query-field .token.entity,.prism-syntax-highlight .token.entity{cursor:help}.slate-query-field .namespace,.prism-syntax-highlight .namespace{opacity:.7}.typeahead{max-height:300px;overflow-y:auto}.typeahead strong{color:#ecbb13}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1050;background-color:#fff}.modal-backdrop,.modal-backdrop.fade.in{opacity:.7}.modal{position:fixed;z-index:1060;width:100%;background:#f4f5f5;box-shadow:0 3px 7px rgba(0,0,0,.3);background-clip:padding-box;outline:none;max-width:750px;left:0;right:0;margin-left:auto;margin-right:auto;top:10%}.modal-header{background:#f4f5f5;box-shadow:inset 0px -3px 10px #f4f5f8;border-bottom:1px solid #f4f5f5;display:flex;align-items:center;justify-content:space-between}.modal-header-title{font-size:18px;float:left;padding-top:8px;margin:0 16px}.modal-header-close{float:right;padding:9px 16px}.modal-body{position:relative}.modal-content{padding:32px}.modal-content--has-scroll{max-height:calc(100vh - 400px);position:relative}.modal-form{margin-bottom:0}.modal-footer{padding:14px 15px 15px;border-top:1px solid #fff;background-color:#fff;text-align:right}.modal-footer::after{content:"";display:table;clear:both}.modal--narrow{max-width:500px}.confirm-modal{max-width:500px}.confirm-modal .confirm-modal-icon{padding-top:41px;font-size:280%;color:#1b855e;padding-bottom:20px}.confirm-modal .confirm-modal-text{font-size:1.2857142857rem;color:#24292e;margin-bottom:32px;padding-top:16px}.confirm-modal .confirm-modal-text2{font-size:14px;padding-top:16px}.confirm-modal .confirm-modal-buttons{margin-bottom:16px}.confirm-modal .confirm-modal-buttons button{margin-right:8px}.confirm-modal .modal-content-confirm-text{margin-bottom:32px}.confirm-modal .modal-content-confirm-text span{text-align:center}.share-modal-body .share-modal-options{margin:11px 0px 33px 0px;display:inline-block}.share-modal-body .share-modal-big-icon{margin-right:8px;margin-top:-7px}.share-modal-body .share-modal-info-text{margin-top:5px}.share-modal-body .share-modal-info-text strong{color:#000;font-weight:500}.share-modal-body .share-modal-header{display:flex;margin:0px 0 22px 0}.share-modal-body .share-modal-content{flex-grow:1}.share-modal-body .share-modal-link{max-width:716px;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis}.dropup,.dropdown{position:relative}.dropdown-toggle:active,.open .dropdown-toggle{outline:0}.dropdown-desc{position:relative;top:-3px;width:250px;font-size:12px;margin-left:22px;color:#8e8e8e;white-space:normal}.caret{display:inline-block;width:0;height:0;vertical-align:top;border-top:4px solid rgba(36,41,46,.75);border-right:4px solid rgba(0,0,0,0);border-left:4px solid rgba(0,0,0,0);content:""}.dropdown .caret{margin-top:8px;margin-left:2px}.dropdown-menu{position:absolute;top:100%;left:0;z-index:1030;display:none;float:left;min-width:140px;margin:2px 0 0;list-style:none;background-color:#fff;border:1px solid rgba(36,41,46,.12);text-align:left}.dropdown-menu.pull-left{right:0;left:auto}.dropdown-menu .divider{height:1px;margin:8px 0;overflow:hidden;background-color:rgba(36,41,46,.12);border-bottom:1px solid rgba(36,41,46,.12)}.dropdown-menu>li>a,.dropdown-menu>li>button{display:block;padding:3px 20px 3px 15px;clear:both;font-weight:normal;line-height:1.5714285714;color:#161719;white-space:nowrap}.dropdown-menu>li>a i,.dropdown-menu>li>button i{display:inline-block;margin-right:10px;color:rgba(36,41,46,.5);position:relative;top:3px}.dropdown-menu>li>a .gicon,.dropdown-menu>li>button .gicon{opacity:.7;width:18px;height:14px}.dropdown-menu--menu{background:#fff;box-shadow:0px 13px 20px 1px rgba(24,26,27,.18);margin-top:0px}.dropdown-menu--menu>li>a,.dropdown-menu--menu>li>button{display:flex;padding:5px 10px;border-left:2px solid rgba(0,0,0,0)}.dropdown-menu--menu>li>a:hover,.dropdown-menu--menu>li>button:hover{color:#000;background:rgba(36,41,46,.12) !important}.dropdown-item-text{flex-grow:1}.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus,.dropdown-submenu:hover>a,.dropdown-submenu:focus>a,.dropdown-menu>li>button:hover,.dropdown-menu>li>button:focus,.dropdown-submenu:hover>button,.dropdown-submenu:focus>button{text-decoration:none;color:#24292e;background-color:#f4f5f8}.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus,.dropdown-menu>.active>button,.dropdown-menu>.active>button:hover,.dropdown-menu>.active>button:focus{color:#24292e;text-decoration:none;outline:0;background-color:#f4f5f8}.dropdown-menu>.disabled>a,.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus,.dropdown-menu>.disabled>button,.dropdown-menu>.disabled>button:hover,.dropdown-menu>.disabled>button:focus{color:#8e8e8e}.dropdown-menu>.disabled>a:hover,.dropdown-menu>.disabled>a:focus,.dropdown-menu>.disabled>button:hover,.dropdown-menu>.disabled>button:focus{text-decoration:none;background-color:rgba(0,0,0,0);background-image:none;cursor:default}.open>.dropdown-menu{display:block}.open>.dropdown>.dropdown-menu{display:block}.open.cascade-open .dropdown-menu{display:block}.dropdown-backdrop{position:fixed;left:0;right:0;bottom:0;top:0;z-index:1020}.pull-right>.dropdown-menu{left:100%;right:unset}.dropup .caret,.navbar-fixed-bottom .dropdown .caret{border-top:0;border-bottom:4px solid #000;content:""}.dropup .dropdown-menu,.navbar-fixed-bottom .dropdown .dropdown-menu{top:auto;bottom:0;margin-bottom:1px}.dropdown-submenu{position:relative}.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:0px;margin-left:-1px}.dropdown-submenu:hover>.dropdown-menu{display:block}.dropup .dropdown-submenu>.dropdown-menu{top:auto;bottom:0;margin-top:0;margin-bottom:-2px}.dropdown-submenu:hover>a::after,.dropdown-submenu:hover>button::after{border-left-color:#24292e}.dropdown-submenu.pull-left{float:none !important}.dropdown-submenu.pull-left>.dropdown-menu{left:-100%;width:100%;margin-left:2px}.dropdown-submenu.pull-right{float:none !important}.dropdown .dropdown-menu .nav-header{padding-left:20px;padding-right:20px}.typeahead{z-index:1030}.dropdown-menu-item-shortcut{display:block;margin-left:16px;color:rgba(36,41,46,.75);min-width:47px}.dropdown-menu.dropdown-menu--new li a,.dropdown-menu.dropdown-menu--new li button{padding:8px 16px;border-left:2px solid #202226;background:#202226}.dropdown-menu.dropdown-menu--new li a i,.dropdown-menu.dropdown-menu--new li button i{display:inline-block;padding-right:21px}.dropdown-menu.dropdown-menu--new li a:hover,.dropdown-menu.dropdown-menu--new li button:hover{color:#000;background:#f4f5f5}.page-dashboard .footer{display:none}.footer{color:#555;padding:16px 0 16px 0;font-size:12px;position:relative;width:98%}.footer a{color:#555}.footer a:hover{color:#161719;text-decoration:underline}.footer a i{display:inline-block;padding-right:2px}.footer ul{list-style:none}.footer li{display:inline-block}.footer li::after{content:" | ";padding:0 8px}.footer li:last-child::after{padding-left:0;content:""}.login-page .footer{display:block;bottom:16px;position:absolute;padding:16px 0 16px 0;color:#24292e}.login-page .footer a{color:#24292e}.login-page .footer a:hover{color:#000}@media(max-width: 991px){.login-page .footer{display:none}}.grafana-info-box{position:relative;padding:24px;background-color:#f4f5f8;border-left:3px solid #3871dc;margin-bottom:16px;margin-right:4px;box-shadow:none;flex-grow:1}.grafana-info-box h5{margin-bottom:16px}.grafana-info-box ul{padding-left:24px}.grafana-info-box code{font-family:"Roboto Mono",monospace;font-size:12px;background-color:#f4f5f8;color:#24292e;border:1px solid #d8d9da;border-radius:4px}.grafana-info-box p:last-child{margin-bottom:0}.grafana-info-box--max-lg{max-width:992px}.grafana-info-box__close{text-align:center;display:block;color:#24292e !important;height:0;position:relative;top:-9px}.drop-element.drop-error{max-width:100%;max-height:100%}.drop-element.drop-error .drop-content{border-radius:6px;position:relative;font-weight:500;background:#e0226e;color:#fff;padding:8px;word-wrap:break-word;max-width:280px;border:1px solid #e0226e}.drop-element.drop-error .drop-content:before{content:"";display:block;position:absolute;width:0;height:0;border-color:rgba(0,0,0,0);border-width:10px;border-style:solid}.drop-element.drop-error.drop-wide .drop-content{max-width:560px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-center .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-center .drop-content:before{top:100%;left:50%;margin-left:-10px;border-top-color:#e0226e}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-center .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-center .drop-content:before{bottom:100%;left:50%;margin-left:-10px;border-bottom-color:#e0226e}.drop-element.drop-error.drop-element-attached-right.drop-element-attached-middle .drop-content{margin-right:10px}.drop-element.drop-error.drop-element-attached-right.drop-element-attached-middle .drop-content:before{left:100%;top:50%;margin-top:-10px;border-left-color:#e0226e}.drop-element.drop-error.drop-element-attached-left.drop-element-attached-middle .drop-content{margin-left:10px}.drop-element.drop-error.drop-element-attached-left.drop-element-attached-middle .drop-content:before{right:100%;top:50%;margin-top:-10px;border-right-color:#e0226e}.drop-element.drop-error.drop-element-attached-left.drop-target-attached-center .drop-content{left:-20px}.drop-element.drop-error.drop-element-attached-right.drop-target-attached-center .drop-content{left:20px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content:before{bottom:100%;left:10px;border-bottom-color:#e0226e}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content:before{bottom:100%;right:10px;border-bottom-color:#e0226e}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content:before{top:100%;left:10px;border-top-color:#e0226e}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content:before{top:100%;right:10px;border-top-color:#e0226e}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content:before{bottom:100%;left:10px;border-bottom-color:#e0226e}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content:before{bottom:100%;right:10px;border-bottom-color:#e0226e}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content:before{top:100%;left:10px;border-top-color:#e0226e}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content:before{top:100%;right:10px;border-top-color:#e0226e}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content:before{top:10px;left:100%;border-left-color:#e0226e}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content:before{top:10px;right:100%;border-right-color:#e0226e}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content:before{bottom:10px;left:100%;border-left-color:#e0226e}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content:before{bottom:10px;right:100%;border-right-color:#e0226e}.drop-element.drop-popover{max-width:100%;max-height:100%}.drop-element.drop-popover .drop-content{border-radius:6px;position:relative;font-weight:500;background:#fff;color:#24292e;padding:8px;word-wrap:break-word;max-width:280px;border:1px solid rgba(36,41,46,.12)}.drop-element.drop-popover .drop-content:before{content:"";display:block;position:absolute;width:0;height:0;border-color:rgba(0,0,0,0);border-width:10px;border-style:solid}.drop-element.drop-popover.drop-wide .drop-content{max-width:560px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-center .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-center .drop-content:before{top:100%;left:50%;margin-left:-10px;border-top-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-center .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-center .drop-content:before{bottom:100%;left:50%;margin-left:-10px;border-bottom-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-right.drop-element-attached-middle .drop-content{margin-right:10px}.drop-element.drop-popover.drop-element-attached-right.drop-element-attached-middle .drop-content:before{left:100%;top:50%;margin-top:-10px;border-left-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-left.drop-element-attached-middle .drop-content{margin-left:10px}.drop-element.drop-popover.drop-element-attached-left.drop-element-attached-middle .drop-content:before{right:100%;top:50%;margin-top:-10px;border-right-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-left.drop-target-attached-center .drop-content{left:-20px}.drop-element.drop-popover.drop-element-attached-right.drop-target-attached-center .drop-content{left:20px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content:before{bottom:100%;left:10px;border-bottom-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content:before{bottom:100%;right:10px;border-bottom-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content:before{top:100%;left:10px;border-top-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content:before{top:100%;right:10px;border-top-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content:before{bottom:100%;left:10px;border-bottom-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content:before{bottom:100%;right:10px;border-bottom-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content:before{top:100%;left:10px;border-top-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content:before{top:100%;right:10px;border-top-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content:before{top:10px;left:100%;border-left-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content:before{top:10px;right:100%;border-right-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content:before{bottom:10px;left:100%;border-left-color:rgba(36,41,46,.12)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content:before{bottom:10px;right:100%;border-right-color:rgba(36,41,46,.12)}.drop-element.drop-help{max-width:100%;max-height:100%}.drop-element.drop-help .drop-content{border-radius:6px;position:relative;font-weight:500;background:#f4f5f5;color:#24292e;padding:8px;word-wrap:break-word;max-width:280px;border:1px solid #f4f5f5}.drop-element.drop-help .drop-content:before{content:"";display:block;position:absolute;width:0;height:0;border-color:rgba(0,0,0,0);border-width:10px;border-style:solid}.drop-element.drop-help.drop-wide .drop-content{max-width:560px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-center .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-center .drop-content:before{top:100%;left:50%;margin-left:-10px;border-top-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-center .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-center .drop-content:before{bottom:100%;left:50%;margin-left:-10px;border-bottom-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-right.drop-element-attached-middle .drop-content{margin-right:10px}.drop-element.drop-help.drop-element-attached-right.drop-element-attached-middle .drop-content:before{left:100%;top:50%;margin-top:-10px;border-left-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-left.drop-element-attached-middle .drop-content{margin-left:10px}.drop-element.drop-help.drop-element-attached-left.drop-element-attached-middle .drop-content:before{right:100%;top:50%;margin-top:-10px;border-right-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-left.drop-target-attached-center .drop-content{left:-20px}.drop-element.drop-help.drop-element-attached-right.drop-target-attached-center .drop-content{left:20px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-middle .drop-content:before{bottom:100%;left:10px;border-bottom-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-middle .drop-content:before{bottom:100%;right:10px;border-bottom-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-middle .drop-content:before{top:100%;left:10px;border-top-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-middle .drop-content:before{top:100%;right:10px;border-top-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content:before{bottom:100%;left:10px;border-bottom-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{margin-top:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content:before{bottom:100%;right:10px;border-bottom-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content:before{top:100%;left:10px;border-top-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{margin-bottom:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content:before{top:100%;right:10px;border-top-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content:before{top:10px;left:100%;border-left-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content:before{top:10px;right:100%;border-right-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{margin-right:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content:before{bottom:10px;left:100%;border-left-color:#f4f5f5}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{margin-left:10px}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content:before{bottom:10px;right:100%;border-right-color:#f4f5f5}.drop-element.drop-help{transform:translateZ(0);transition:opacity 100ms;opacity:0}.drop-element.drop-help .drop-content{transition:transform .2s cubic-bezier(0, 0, 0.265, 1);transform:scale(0.8) translateZ(0)}.drop-element.drop-help.drop-open{display:none}.drop-element.drop-help.drop-open-transitionend{display:block}.drop-element.drop-help.drop-after-open{transition:none;opacity:1}.drop-element.drop-help.drop-after-open .drop-content{transform:scale(1) translateZ(0)}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-center .drop-content{transform-origin:50% calc(100% + 0%)}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-center .drop-content{transform-origin:50% 0%}.drop-element.drop-help.drop-element-attached-right.drop-element-attached-middle .drop-content{transform-origin:calc(100% + 0%) 50%}.drop-element.drop-help.drop-element-attached-left.drop-element-attached-middle .drop-content{transform-origin:-0% 50%}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{transform-origin:0 0%}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{transform-origin:100% 0%}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{transform-origin:0 calc(100% + 0%)}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{transform-origin:100% calc(100% + 0%)}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 0}.drop-element.drop-help.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 0}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 100%}.drop-element.drop-help.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 100%}.drop-element.drop-error{transform:translateZ(0);transition:opacity 100ms;opacity:0}.drop-element.drop-error .drop-content{transition:transform .2s cubic-bezier(0, 0, 0.265, 1);transform:scale(0.8) translateZ(0)}.drop-element.drop-error.drop-open{display:none}.drop-element.drop-error.drop-open-transitionend{display:block}.drop-element.drop-error.drop-after-open{transition:none;opacity:1}.drop-element.drop-error.drop-after-open .drop-content{transform:scale(1) translateZ(0)}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-center .drop-content{transform-origin:50% calc(100% + 0%)}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-center .drop-content{transform-origin:50% 0%}.drop-element.drop-error.drop-element-attached-right.drop-element-attached-middle .drop-content{transform-origin:calc(100% + 0%) 50%}.drop-element.drop-error.drop-element-attached-left.drop-element-attached-middle .drop-content{transform-origin:-0% 50%}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{transform-origin:0 0%}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{transform-origin:100% 0%}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{transform-origin:0 calc(100% + 0%)}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{transform-origin:100% calc(100% + 0%)}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 0}.drop-element.drop-error.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 0}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 100%}.drop-element.drop-error.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 100%}.drop-element.drop-popover{transform:translateZ(0);transition:opacity 100ms;opacity:0}.drop-element.drop-popover .drop-content{transition:transform .2s cubic-bezier(0, 0, 0.265, 1);transform:scale(0.8) translateZ(0)}.drop-element.drop-popover.drop-open{display:none}.drop-element.drop-popover.drop-open-transitionend{display:block}.drop-element.drop-popover.drop-after-open{transition:none;opacity:1}.drop-element.drop-popover.drop-after-open .drop-content{transform:scale(1) translateZ(0)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-center .drop-content{transform-origin:50% calc(100% + 0%)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-center .drop-content{transform-origin:50% 0%}.drop-element.drop-popover.drop-element-attached-right.drop-element-attached-middle .drop-content{transform-origin:calc(100% + 0%) 50%}.drop-element.drop-popover.drop-element-attached-left.drop-element-attached-middle .drop-content{transform-origin:-0% 50%}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-bottom .drop-content{transform-origin:0 0%}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-bottom .drop-content{transform-origin:100% 0%}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-top .drop-content{transform-origin:0 calc(100% + 0%)}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-top .drop-content{transform-origin:100% calc(100% + 0%)}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 0}.drop-element.drop-popover.drop-element-attached-top.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 0}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-right.drop-target-attached-left .drop-content{transform-origin:calc(100% + 0%) 100%}.drop-element.drop-popover.drop-element-attached-bottom.drop-element-attached-left.drop-target-attached-right .drop-content{transform-origin:0% 100%}.drop-element{z-index:10000;position:absolute;display:none;opacity:0}.drop-element.drop-open{display:block}.drop-element,.drop-element *{box-sizing:border-box}.drop-popover-close{position:absolute;top:-5px;right:0;font-size:18px}.drop-help a{color:#f4f5f8}.drop-help a:hover{color:#fff}.drop-hide-out-of-bounds.drop-open.drop-help.drop-out-of-bounds,.drop-hide-out-of-bounds.drop-open-transitionend.drop-help.drop-out-of-bounds{display:none}.drop-element.drop-popover .drop-content{box-shadow:0px 13px 20px 1px rgba(24,26,27,.18)}.drop-element.drop-popover--form .drop-content{max-width:none;padding:0}.drop-element.drop-popover--annotation .drop-content{padding:0}.drop-popover.gf-color-picker .drop-content{width:210px}.drop-popover.drop-popover--transparent .drop-content{border:none;background:none;padding:0;max-width:none}.drop-popover.drop-popover--transparent .drop-content:before{display:none}.query-keyword{font-weight:500;color:#1f62e0 !important}.query-segment-operator{color:#eb7b18 !important}.query-placeholder{color:#8e8e8e}.tight-form-func{background:#f4f5f5}.tight-form-func.show-function-controls{padding-top:5px;min-width:100px;text-align:center}input[type=text].tight-form-func-param{font-size:12px;background:rgba(0,0,0,0);border:none;margin:0;padding:0}.tight-form-func-controls{text-align:center}.tight-form-func-controls .fa-arrow-left{float:left;position:relative;top:2px}.tight-form-func-controls .fa-arrow-right{float:right;position:relative;top:2px}.tight-form-func-controls .fa-remove{margin-left:10px}.grafana-metric-options{margin-top:25px}.tight-form-func{background:#f4f5f5}.tight-form-func.show-function-controls{padding-top:5px;min-width:100px;text-align:center}.rst-text::before{content:" "}.rst-unknown.rst-directive{font-family:monospace;margin-bottom:16px;word-wrap:break-word}.rst-interpreted_text{font-family:monospace;display:inline}.rst-bullet-list{padding-left:24px;margin-bottom:16px}.rst-paragraph:last-child{margin-bottom:0}.drop-element.drop-popover.drop-function-def .drop-content{max-width:416px}.rst-literal-block .rst-text{display:block}.query-editor-row{margin-bottom:2px}.query-editor-row:hover .query-editor-row__actions{display:flex}.query-editor-row--disabled .query-keyword{color:rgba(36,41,46,.75)}.query-editor-row__action{margin-left:3px;background:rgba(0,0,0,0);border:none;box-shadow:none}.query-editor-row__action:hover{color:#24292e}.query-editor-row__body{margin:2px 0 10px 40px;background:#f4f5f5}.query-editor-row__body--collapsed{display:none}.tabbed-view{display:flex;flex-direction:column;height:100%;flex-grow:1}.tabbed-view.tabbed-view--new{padding:0 0 0 0;height:100%}.tabbed-view-header{box-shadow:inset 0px -3px 10px #f4f5f8;border-bottom:1px solid #f4f5f5;padding:0 16px}.tabbed-view-header::after{content:"";display:table;clear:both}.tabbed-view-title{float:left;padding-top:8px;margin:0 48px 0 0}.tabbed-view-close-btn{float:right;margin:0;background-color:rgba(0,0,0,0);border:none;padding:10px 15px 9px;color:#24292e}.tabbed-view-close-btn i{font-size:120%}.tabbed-view-close-btn:hover{color:#000}.tabbed-view-body{padding:32px 16px 16px 16px;display:flex;flex-direction:column;flex:1}.tabbed-view-body--small{min-height:0px;padding-bottom:0px}.section-heading{font-size:14px;margin-bottom:8px}.query-part{background-color:#f4f5f5}.query-part.show-function-controls{padding-top:5px;min-width:100px;text-align:center}.query-part .query-part__last{display:none}.query-part:hover .query-part__last{display:inline}.query-part:hover{background:#eff0f0}.query-part__link{cursor:pointer}.query-part__link--no-value{color:rgba(36,41,46,.75)}json-tree .json-tree-key{vertical-align:middle}json-tree .expandable{position:relative}json-tree .expandable::before{pointer-events:none}json-tree .expandable::before,json-tree .expandable>.json-tree-key{cursor:pointer}json-tree .json-tree-branch-preview{display:inline-block;vertical-align:middle}json-tree ul{padding-left:16px}json-tree li,json-tree ul{list-style:none}json-tree li{line-height:18px}json-tree .json-tree-key{color:#1f62e0;padding:5px 10px 5px 15px}json-tree .json-tree-key::after{content:":"}json-tree json-node.expandable::before{content:"\u25B6";position:absolute;left:0px;font-size:8px;transition:transform .1s ease}json-tree json-node.expandable.expanded::before{transform:rotate(90deg)}json-tree .json-tree-leaf-value,json-tree .json-tree-branch-preview{word-break:break-all}json-tree .json-tree-branch-preview{overflow:hidden;font-style:italic;max-width:40%;height:1.5em;opacity:.7}.edit-tab-with-sidemenu{display:flex;flex-direction:row}.edit-tab-content{flex-grow:1;min-width:0}.edit-sidemenu-aside{margin-right:32px}.edit-sidemenu{width:100%;list-style:none}.edit-sidemenu li.active{border-image:linear-gradient(0.01deg, #F53E4C -31.2%, #FF8833 113.07%);border-image-slice:1;border-style:solid;border-top:0;border-right:0;border-bottom:0;border-left-width:2px}.edit-sidemenu a{display:block;color:#24292e;margin:0 0 1.5rem 1rem;white-space:nowrap}.column-styles-heading{border-bottom:1px solid #555}@media(max-width: 768px){.edit-tab-with-sidemenu{flex-direction:column}.edit-sidemenu-aside{width:100%;margin-bottom:2rem}.edit-sidemenu li{float:left}.edit-sidemenu a{margin:.3rem 1rem}}.dashboard-row{display:flex;align-items:center;height:100%}.dashboard-row--collapsed{background:#fff}.dashboard-row--collapsed .dashboard-row__panel_count{display:inline-block}.dashboard-row--collapsed .dashboard-row__drag{visibility:visible;opacity:1}.dashboard-row--collapsed .dashboard-row__toggle-target{flex:1;cursor:pointer;margin-right:15px}.dashboard-row:hover .dashboard-row__actions,.dashboard-row:focus-within .dashboard-row__actions{opacity:1}.dashboard-row__title{flex-grow:0;font-size:1.1428571429rem;font-weight:500;color:#24292e;background:rgba(0,0,0,0);border:none}.dashboard-row__title .fa{color:rgba(36,41,46,.75);font-size:10px;padding:0 8px}.dashboard-row__actions{color:rgba(36,41,46,.75);opacity:0;transition:200ms opacity ease-in 200ms}.dashboard-row__actions button{color:rgba(36,41,46,.75);padding-left:16px;background:rgba(0,0,0,0);border:none}.dashboard-row__actions button:hover{color:#000}.dashboard-row__panel_count{padding-left:16px;color:rgba(36,41,46,.75);font-style:italic;font-size:12px;font-weight:normal;display:none}.dashboard-row__drag{cursor:move;width:16px;height:100%;background:url("../img/grab_dark.svg") no-repeat 50% 50%;background-size:8px;visibility:hidden;position:absolute;top:0;right:0}.json-formatter-row{font-family:monospace}.json-formatter-row,.json-formatter-row a,.json-formatter-row a:hover{color:#000;text-decoration:none}.json-formatter-row .json-formatter-row{margin-left:16px}.json-formatter-row .json-formatter-children.json-formatter-empty{opacity:.5;margin-left:16px}.json-formatter-row .json-formatter-children.json-formatter-empty::after{display:none}.json-formatter-row .json-formatter-children.json-formatter-empty.json-formatter-object::after{content:"No properties"}.json-formatter-row .json-formatter-children.json-formatter-empty.json-formatter-array::after{content:"[]"}.json-formatter-row .json-formatter-string{color:green;white-space:pre-wrap;word-wrap:break-word;word-break:break-all}.json-formatter-row .json-formatter-number{color:#3871dc}.json-formatter-row .json-formatter-boolean{color:#e0226e}.json-formatter-row .json-formatter-null{color:#855a00}.json-formatter-row .json-formatter-undefined{color:#ca0b69}.json-formatter-row .json-formatter-function{color:#ff20ed}.json-formatter-row .json-formatter-date{background-color:fade(black, 5%)}.json-formatter-row .json-formatter-url{text-decoration:underline;color:#3871dc;cursor:pointer}.json-formatter-row .json-formatter-bracket{color:#3871dc}.json-formatter-row .json-formatter-key{color:#00008b;cursor:pointer;padding-right:2px;margin-right:4px}.json-formatter-row .json-formatter-constructor-name{cursor:pointer}.json-formatter-row .json-formatter-array-comma{margin-right:4px}.json-formatter-row .json-formatter-toggler{line-height:16px;font-size:10px;vertical-align:middle;opacity:.6;cursor:pointer;padding-right:2px}.json-formatter-row .json-formatter-toggler::after{display:inline-block;transition:transform 100ms ease-in;content:"\u25BA"}.json-formatter-row>a>.json-formatter-preview-text{opacity:0;transition:opacity .15s ease-in;font-style:italic}.json-formatter-row:hover>a>.json-formatter-preview-text{opacity:.6}.json-formatter-row.json-formatter-open>.json-formatter-toggler-link .json-formatter-toggler::after{transform:rotate(90deg)}.json-formatter-row.json-formatter-open>.json-formatter-children::after{display:inline-block}.json-formatter-row.json-formatter-open>a>.json-formatter-preview-text{display:none}.json-formatter-row.json-formatter-open.json-formatter-empty::after{display:block}.gf-code-editor{min-height:36px;min-width:280px;flex-grow:1;margin-right:4px}.gf-code-editor.ace_editor{font-family:"Roboto Mono",monospace;font-size:14px;min-height:50px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;border:1px solid rgba(36,41,46,.3)}.gf-code-editor .ace_content{z-index:0}.ace_editor.ace_autocomplete{font-family:"Roboto Mono",monospace;font-size:14px;background-color:#fff !important;color:#161719 !important;border:1px solid rgba(36,41,46,.12) !important;width:550px !important}.ace_editor.ace_autocomplete .ace_scroller .ace_selected,.ace_editor.ace_autocomplete .ace_scroller .ace_active-line,.ace_editor.ace_autocomplete .ace_scroller .ace_line-hover{color:#24292e;background-color:#f4f5f8 !important}.ace_editor.ace_autocomplete .ace_scroller .ace_line-hover{border-color:rgba(0,0,0,0)}.ace_editor.ace_autocomplete .ace_scroller .ace_completion-highlight{color:#ecbb13}.ace_editor.ace_autocomplete .ace_scroller .ace_rightAlignedText{color:rgba(36,41,46,.75);z-index:0}.ace_tooltip.ace_doc-tooltip{font-family:"Roboto Mono",monospace;font-size:12px;background-color:#f4f5f5;color:#24292e;background-image:none;border:1px solid rgba(36,41,46,.12);padding:8px 16px}.ace_tooltip.ace_doc-tooltip hr{background-color:#24292e;margin:8px 0}.ace_tooltip.ace_doc-tooltip code{padding:0px 1px;margin:0px}.ace_tooltip{border-radius:3px}.ace_hidden-cursors .ace_cursor{opacity:0 !important}.react-grid-layout{position:relative;transition:height 200ms ease}.react-grid-item{transition:all 200ms ease;transition-property:left,top}.react-grid-item img{pointer-events:none;user-select:none}.react-grid-item.cssTransforms{transition-property:transform}.react-grid-item.resizing{z-index:1;will-change:width,height}.react-grid-item.react-draggable-dragging{transition:none;z-index:3;will-change:transform}.react-grid-item.dropping{visibility:hidden}.react-grid-item.react-grid-placeholder{background:red;opacity:.2;transition-duration:100ms;z-index:2;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.react-grid-item>.react-resizable-handle{position:absolute;width:20px;height:20px}.react-grid-item>.react-resizable-handle::after{content:"";position:absolute;right:3px;bottom:3px;width:5px;height:5px;border-right:2px solid rgba(0, 0, 0, 0.4);border-bottom:2px solid rgba(0, 0, 0, 0.4)}.react-resizable-hide>.react-resizable-handle{display:none}.react-grid-item>.react-resizable-handle.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-w,.react-grid-item>.react-resizable-handle.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-n,.react-grid-item>.react-resizable-handle.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.react-resizable{position:relative}.react-resizable-handle{position:absolute;width:20px;height:20px;background-repeat:no-repeat;background-origin:content-box;box-sizing:border-box;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+");background-position:bottom right;padding:0 3px 3px 0}.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-resizable-handle-w,.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-resizable-handle-n,.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.react-resizable-handle{visibility:hidden}.react-grid-item,#grafana-portal-container{touch-action:initial !important}.react-grid-item:hover .react-resizable-handle,#grafana-portal-container:hover .react-resizable-handle{visibility:visible}.panel-in-fullscreen .react-grid-layout{height:auto !important}.panel-in-fullscreen .react-grid-item{display:none !important;transition-property:none !important}.panel-in-fullscreen .react-grid-item--fullscreen{display:block !important;position:unset !important;transform:translate(0px, 0px) !important}.panel-in-fullscreen .panel-header:hover{background-color:inherit}.panel-in-fullscreen .panel-title-container{cursor:pointer}.panel-in-fullscreen .react-resizable-handle{display:none}.panel-in-fullscreen .react-grid-layout{transition-property:none}@media(max-width: 768px){.react-grid-item{display:block !important;transition-property:none !important;position:unset !important;transform:translate(0px, 0px) !important;margin-bottom:16px}}.react-grid-item.react-grid-placeholder{box-shadow:0 0 4px #5794f2;background:#e5eefd;z-index:-1;opacity:unset}.theme-dark .react-grid-item>.react-resizable-handle::after{border-right:2px solid #555;border-bottom:2px solid #555}.theme-light .react-grid-item>.react-resizable-handle::after{border-right:2px solid #b3b3b3;border-bottom:2px solid #b3b3b3}.react-grid-item.resizing.panel,.react-grid-item.panel.dropdown-menu-open,.react-grid-item.react-draggable-dragging.panel{z-index:1030}.react-grid-item.cssTransforms{transition-property:none}.animated .react-grid-item.cssTransforms{transition-property:transform}.dashboard-list .search-results-container{padding:5px 0 0 0}.search-results{margin-top:32px}.search-results-filter-row{height:35px;display:flex;justify-content:space-between;align-items:center}.search-results-filter-row .gf-form-button-row{padding-top:0}.search-results-filter-row .gf-form-button-row button:last-child{margin-right:0}.search-results-filter-row__filters{display:flex}.search-results-filter-row__filters-item{width:150px;margin-right:0}.page-header{margin-top:16px}.page-header .btn{float:right;margin-left:16px}.page-header .btn .fa{position:relative;top:1px}@media(min-width: 769px){.page-header{margin-top:0}}.page-header__inner{flex-grow:1;display:flex;padding:24px 0}.page-header__title{font-size:1.7142857143rem;margin-bottom:1px;padding-top:16px}.page-header__img{position:relative;top:10px;height:50px}.page-header__icon{font-size:50px;width:50px;height:50px;position:relative;color:rgba(36,41,46,.75)}.page-header__icon.fa{top:10px}.page-header__icon.gicon{top:10px}.page-header__icon.icon-gf{top:3px}.page-header__logo{margin:-1px 16px -1px 0;color:rgba(36,41,46,.75)}.page-header__sub-title{color:rgba(36,41,46,.75)}.page-header-stamps-type{color:rgba(36,41,46,.5);text-transform:uppercase}.page-header__select-nav{margin-bottom:10px;max-width:100%}@media(min-width: 992px){.page-header__select-nav{display:none}}.page-header__link{color:#24292e;text-decoration:underline}.page-header__tabs{display:none}@media(min-width: 992px){.page-header__tabs{display:block}}.page-breadcrumbs{display:flex;padding:10px 0;line-height:.5}.breadcrumb{display:inline-block;box-shadow:0 0 15px 1px rgba(0,0,0,.35);overflow:hidden;border-radius:5px;counter-reset:flag}.dashboard-settings{position:fixed;height:100%;width:100%;top:0;left:0;right:0;bottom:0;z-index:1020;background:#f4f5f5;display:flex;flex-direction:column}.dashboard-settings__body{min-height:100%;width:100%;display:flex;flex-direction:row;background:#fff}.dashboard-settings__aside{display:flex;flex-direction:column;margin-top:16px}.dashboard-settings__aside-header{color:rgba(36,41,46,.75);font-size:1.5714285714rem;padding-right:60px;white-space:nowrap;margin-bottom:16px}.dashboard-settings__aside-header i{font-size:25px;position:relative;top:1px;padding-right:5px}.dashboard-settings__header{font-size:1.5714285714rem;margin-bottom:16px}.dashboard-settings__subheader{color:rgba(36,41,46,.75);font-style:italic}.dashboard-settings__nav-item{padding:8px 40px 8px 8px;color:rgba(36,41,46,.75);font-size:14px;line-height:20px;position:relative;border-left:2px solid rgba(0,0,0,0)}.dashboard-settings__nav-item.active{color:#24292e;font-weight:500}.dashboard-settings__nav-item.active::before{content:"";position:absolute;top:0;left:0;bottom:0;width:4px;border-radius:4px;background:linear-gradient(0.01deg, #F53E4C -31.2%, #FF8833 113.07%)}.dashboard-settings__nav-item .gicon{margin-bottom:2px;margin-right:4px}.dashboard-settings__nav-item .fa{font-size:17px;width:16px;margin-right:4px}.dashboard-settings__aside-actions{display:flex;flex-direction:column;height:100%;flex-grow:1;margin:40px 32px 0 0}.dashboard-settings__aside-actions button{margin-bottom:8px}.dashboard-settings__json-save-button{margin-top:16px}.toolbar{display:flex;align-content:center;align-items:center;padding:16px;position:relative;flex:0 0 auto}.toolbar__heading{font-size:18px;padding-right:20px}.toolbar__left{display:flex;flex-grow:1;align-items:center}.toolbar__main{padding:0 8px;font-size:14px;line-height:18px;color:#24292e;background-color:#fff;height:32px;border:1px solid rgba(36,41,46,.3);border-radius:2px;display:flex;align-items:center;cursor:pointer}.toolbar__main .fa{margin-left:20px;display:inline-block;position:relative}.toolbar__main-image{margin-right:10px;display:inline-block;width:20px;height:20px}.toolbar__close{flex-grow:1;text-align:left}.add-data-source-header{margin-bottom:32px;padding-top:16px;text-align:center}.add-data-source-search{display:flex;justify-content:center;margin-bottom:24px}.add-data-source-category{margin-bottom:16px}.add-data-source-category__header{font-size:1.1428571429rem;margin-bottom:8px}.add-data-source-item{padding:16px;display:flex;align-items:center;cursor:pointer;background:#f4f5f5;border:1px solid rgba(0,0,0,0);border-radius:3px;margin-bottom:2px}.add-data-source-item:hover{box-shadow:0 0 4px #1f62e0;background:#fbfcfe;border:1px solid #1f62e0;color:#000}.add-data-source-item:hover .add-data-source-item-actions{opacity:1;transition:.15s opacity ease-in-out}.add-data-source-item-text-wrapper{display:flex;flex-direction:column;flex-grow:1}.add-data-source-item-desc{font-size:12px;color:rgba(36,41,46,.75)}.add-data-source-item-badge{margin-top:6px}.add-data-source-item-text{font-size:1.1428571429rem}.add-data-source-item-logo{margin-right:24px;margin-left:8px;width:55px;max-height:55px}.add-data-source-item-actions{opacity:0;padding-left:16px;display:flex;align-items:center}.add-data-source-item-actions>button{margin-left:16px;cursor:pointer}.add-datasource-item-actions__btn-icon{margin-left:8px}.add-data-source-more{text-align:center;margin:32px}.page-loader-wrapper{padding-top:100px;display:flex;align-items:center;justify-content:center;flex-direction:column}.page-loader-wrapper__spinner{font-size:32px;margin-bottom:8px}.page-loader-wrapper__text{font-size:14px}.toggle-button-group{display:flex}.toggle-button-group .btn{color:#555;text-shadow:0 1px 0 rgba(255,255,255,.4);background-color:#e4e4e5;background-image:linear-gradient(to bottom, #ececec, #d8d9da);background-repeat:repeat-x;border-color:#ececec;height:32px;padding:7px 10px;font-weight:500;font-size:12px;border-radius:0;border-right:1px solid #f4f5f8}.toggle-button-group .btn:hover,.toggle-button-group .btn:focus,.toggle-button-group .btn:active,.toggle-button-group .btn.active,.toggle-button-group .btn.disabled,.toggle-button-group .btn[disabled]{color:#555;background-image:none;background-color:#ececec}.toggle-button-group .btn.active{background:#eb7b18;box-shadow:inset 0 0 4px #fff;border-right:0;color:#fff}.toggle-button-group .btn.active:hover{cursor:default}.toggle-button-group .btn:first-child{border-radius:2px 0 0 2px;margin:0}.toggle-button-group .btn:last-child{border-radius:0 2px 2px 0;margin-left:0}.toggle-button-group--padded{padding-left:2px}.popover-box{background-color:#fff;color:#24292e;border:1px solid rgba(36,41,46,.12);border-radius:2px;max-width:500px}.popover-box__header{background-color:rgba(36,41,46,.12);padding:6px 10px;display:flex}.popover-box__title{font-weight:500;padding-right:16px;overflow:hidden;display:inline-block;white-space:nowrap;text-overflow:ellipsis;flex-grow:1}.popover-box__body{padding:20px 10px 10px 10px}.popover-box__close{cursor:pointer}.panel-header:hover{transition:background-color .1s ease-in-out;background-color:rgba(36,41,46,.12)}.panel-container--no-title .panel-header{position:absolute;left:min(50px,10%);right:min(50px,10%);z-index:10}.panel-container--no-title .panel-header:hover{left:0;right:0}.panel-container--no-title .panel-content{height:100%}.panel-title-container{cursor:move;word-wrap:break-word;display:block}.panel-title{border:0px;font-weight:500;position:relative;width:100%;display:flex;flex-wrap:nowrap;justify-content:center;height:32px;line-height:32px;align-items:center}.panel-menu-container{width:0px;height:19px;display:inline-block}.panel-menu-toggle{position:absolute;top:calc(50% - 9px);color:rgba(36,41,46,.75);cursor:pointer;margin:2px 0 0 2px;visibility:hidden;opacity:0}.panel-menu-toggle:hover{color:#000}.panel-loading{position:absolute;top:0px;right:4px;z-index:11;font-size:18px;color:rgba(36,41,46,.75)}.panel-loading:hover{cursor:pointer}.panel-empty{display:flex;align-items:center;height:100%;width:100%}.panel-empty p{text-align:center;color:rgba(36,41,46,.75);font-size:18px;width:100%}.panel-menu{top:25px;left:-100px}.panel-info-corner-inner{width:0;height:0;position:absolute;left:0;bottom:0}.panel-info-corner{background:none;border:none;color:rgba(36,41,46,.75);cursor:pointer;position:absolute;display:none;left:0;width:32px;height:32px;z-index:2;top:0}.panel-info-corner .fa{position:absolute;top:6px;left:6px;font-size:75%;z-index:3}.panel-info-corner--info{display:block}.panel-info-corner--info .panel-info-corner-inner{border-left:32px solid #fff;border-right:none;border-bottom:32px solid rgba(0,0,0,0)}.panel-info-corner--info .fa:before{content:"\uF129"}.panel-info-corner--links{display:block}.panel-info-corner--links .panel-info-corner-inner{border-left:32px solid #fff;border-right:none;border-bottom:32px solid rgba(0,0,0,0)}.panel-info-corner--links .fa{left:4px}.panel-info-corner--links .fa:before{content:"\uF08E"}.panel-info-corner--error{display:block;color:#fff}.panel-info-corner--error .panel-info-corner-inner{border-left:32px solid #e0226e;border-right:none;border-bottom:32px solid rgba(0,0,0,0)}.panel-info-corner--error .fa:before{content:"\uF12A"}.panel-info-content{overflow:auto}.panel-info-content code{white-space:normal;word-wrap:break-word}.panel-info-content pre>code{display:block}.panel-info-content .panel-info-corner-links{list-style:none;padding-left:0}.panel-time-info{font-weight:500;float:right;margin-right:8px;color:#1f62e0;font-size:85%;position:absolute;right:0}.rc-cascader{font-size:12px}.rc-cascader-dropdown{position:absolute;z-index:9999}.rc-cascader-dropdown-hidden{display:none}.rc-cascader-menus{overflow:hidden;background:#f4f5f5;border:1px solid rgba(36,41,46,.12);border-radius:2px;box-shadow:0 5px 10px 0 #ececec;white-space:nowrap}.rc-cascader-menus.slide-up-enter,.rc-cascader-menus.slide-up-appear{animation-duration:.3s;animation-fill-mode:both;transform-origin:0 0;opacity:0;animation-timing-function:cubic-bezier(0.08, 0.82, 0.17, 1);animation-play-state:paused}.rc-cascader-menus.slide-up-enter.slide-up-enter-active.rc-cascader-menus-placement-bottomLeft,.rc-cascader-menus.slide-up-appear.slide-up-appear-active.rc-cascader-menus-placement-bottomLeft{animation-name:SlideUpIn;animation-play-state:running}.rc-cascader-menus.slide-up-enter.slide-up-enter-active.rc-cascader-menus-placement-topLeft,.rc-cascader-menus.slide-up-appear.slide-up-appear-active.rc-cascader-menus-placement-topLeft{animation-name:SlideDownIn;animation-play-state:running}.rc-cascader-menus.slide-up-leave{animation-duration:.3s;animation-fill-mode:both;transform-origin:0 0;opacity:1;animation-timing-function:cubic-bezier(0.6, 0.04, 0.98, 0.34);animation-play-state:paused}.rc-cascader-menus.slide-up-leave.slide-up-leave-active.rc-cascader-menus-placement-bottomLeft{animation-name:SlideUpOut;animation-play-state:running}.rc-cascader-menus.slide-up-leave.slide-up-leave-active.rc-cascader-menus-placement-topLeft{animation-name:SlideDownOut;animation-play-state:running}.rc-cascader-menu{display:inline-block;max-width:50vw;height:192px;list-style:none;margin:0;padding:0;border-right:1px solid rgba(36,41,46,.12);overflow:auto}.rc-cascader-menu:last-child{border-right:0}.rc-cascader-menu-item{height:32px;line-height:32px;padding:0 2.5em 0 16px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:all .3s ease;position:relative}.rc-cascader-menu-item:hover{background:rgba(36,41,46,.12)}.rc-cascader-menu-item-disabled{cursor:not-allowed;color:rgba(36,41,46,.75)}.rc-cascader-menu-item-disabled:hover{background:rgba(0,0,0,0)}.rc-cascader-menu-item-disabled:after{position:absolute;right:12px;content:"loading";color:rgba(36,41,46,.75);font-style:italic}.rc-cascader-menu-item-active{color:#000;background:rgba(36,41,46,.08)}.rc-cascader-menu-item-active:hover{background:rgba(36,41,46,.12)}.rc-cascader-menu-item-expand{position:relative}.rc-cascader-menu-item-expand:after{content:">";font-size:12px;color:rgba(36,41,46,.75);position:absolute;right:16px;top:0;line-height:32px}@keyframes SlideUpIn{0%{opacity:0;transform-origin:0% 0%;transform:scaleY(0.8)}100%{opacity:1;transform-origin:0% 0%;transform:scaleY(1)}}@keyframes SlideUpOut{0%{opacity:1;transform-origin:0% 0%;transform:scaleY(1)}100%{opacity:0;transform-origin:0% 0%;transform:scaleY(0.8)}}@keyframes SlideDownIn{0%{opacity:0;transform-origin:0% 100%;transform:scaleY(0.8)}100%{opacity:1;transform-origin:0% 100%;transform:scaleY(1)}}@keyframes SlideDownOut{0%{opacity:1;transform-origin:0% 100%;transform:scaleY(1)}100%{opacity:0;transform-origin:0% 100%;transform:scaleY(0.8)}}.gf-form-select-box__control{width:100%;margin-right:4px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;background-color:#fff;border:1px solid rgba(36,41,46,.3);color:#24292e;cursor:default;height:32px;outline:none;overflow:hidden;position:relative}.gf-form-select-box__control--is-focused{background-color:#fff;border-color:#5794f2;outline:none;box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px #5794f2}.gf-form-select-box__control--is-disabled{background-color:rgba(36,41,46,.04)}.gf-form-select-box__control--menu-right .gf-form-select-box__menu{right:0;left:unset}.gf-form-select-box__input input{line-height:inherit}.gf-form-select-box__menu{background:#fff;box-shadow:0px 13px 20px 1px rgba(24,26,27,.18);position:absolute;z-index:1030;min-width:100%}.gf-form-select-box__menu-notice--no-options{background-color:#fff;padding:10px}.gf-form-select-box__menu-list{overflow-y:auto;max-height:300px;max-width:600px}.tag-filter .gf-form-select-box__menu{width:100%}.gf-form-select-box__multi-value{display:inline;margin:0 6px 0 0;cursor:pointer}.gf-form-select-box__multi-value__remove{text-align:center;display:inline-block;margin-left:2px;position:relative}.gf-form-select-box__multi-value__label{display:inline;vertical-align:middle}.gf-form-select-box__option{border-left:2px solid rgba(0,0,0,0);white-space:nowrap;background-color:#fff}.gf-form-select-box__option.gf-form-select-box__option--is-focused{color:#24292e;background:rgba(36,41,46,.12);border-image:linear-gradient(0.01deg, #F53E4C -31.2%, #FF8833 113.07%);border-image-slice:1;border-style:solid;border-top:0;border-right:0;border-bottom:0;border-left-width:2px}.gf-form-select-box__option.gf-form-select-box__option--is-selected .fa{color:#7b8087}.gf-form-select-box__placeholder{color:rgba(36,41,46,.5)}.gf-form-select-box__control--is-focused .gf-form-select-box__placeholder{display:none}.gf-form-select-box__value-container{display:inline-block;padding:6px 20px 6px 10px;vertical-align:middle}.gf-form-select-box__value-container>div{display:inline-block;vertical-align:middle}.gf-form-select-box__indicators{position:absolute;height:100%;right:8px;top:1px;display:inline-block;text-align:right}.gf-form-input--form-dropdown{padding:0;border:0;overflow:visible;position:relative}.gf-form--has-input-icon .gf-form-select-box__value-container{padding-left:30px}.gf-form-select-box__desc-option{display:flex;align-items:center;justify-content:flex-start;justify-items:center;cursor:pointer;padding:7px 10px;width:100%}.gf-form-select-box__desc-option__body{display:flex;flex-direction:column;flex-grow:1;padding-right:10px;font-weight:500}.gf-form-select-box__desc-option__desc{font-weight:normal;font-size:12px;color:rgba(36,41,46,.75)}.gf-form-select-box__desc-option__img{width:16px;margin-right:10px}.gf-form-select-box__option-group__header{display:flex;align-items:center;justify-content:flex-start;justify-items:center;cursor:pointer;padding:7px 10px;width:100%;border-bottom:1px solid #d8d9da;text-transform:capitalize}.gf-form-select-box__option-group__header .fa{padding-right:2px}.gf-form-select-box-button-select{height:auto}.select-button{display:flex;align-items:center}.rc-time-picker-input,.rc-time-picker-panel-input-wrap,.rc-time-picker-panel-inner{background-color:#fff;color:#24292e;border-color:rgba(36,41,46,.3);font-size:14px}.rc-time-picker-input{padding:0 8px;height:32px}.rc-time-picker-panel{width:176px}.rc-time-picker-panel-select{width:50%}.rc-time-picker-panel-select:only-child{width:100%}.rc-time-picker-panel-select .rc-time-picker-panel-select-option-selected{background-color:rgba(36,41,46,.12)}.rc-time-picker-panel-select li:hover{background-color:rgba(36,41,46,.12)}.rc-time-picker-panel-narrow{max-width:none}.uplot{font-family:inherit}.u-select{background:rgba(120,120,130,.2)}.u-cursor-x{border-right:1px dashed rgba(120,120,130,.5)}.u-cursor-y{width:100%;border-bottom:1px dashed rgba(120,120,130,.5)}.shared-crosshair:not(.plot-active) .u-cursor-pt{display:none !important}.login-form{margin-bottom:16px;width:100%}.panel{height:100%}.panel-height-helper{display:block;height:100%}.panel-container{background-color:#fff;border:1px solid rgba(36,41,46,.12);position:relative;border-radius:2px;height:100%;width:100%;display:flex;flex-direction:column;flex:1 1 0;box-shadow:none}.panel-container--transparent{background-color:rgba(0,0,0,0);border:1px solid rgba(0,0,0,0);box-shadow:none}.panel-container:hover .panel-menu-toggle{visibility:visible;transition:opacity .1s ease-in .2s;opacity:1}.panel-container--is-editing{height:auto}.panel-container--absolute{position:absolute}.panel-content{padding:8px;width:100%;flex-grow:1;contain:strict;height:calc(100% - 32px)}.panel-content--no-padding{padding:0}div.flot-text{color:#24292e !important}.dashboard-solo .footer,.dashboard-solo .sidemenu{display:none}.template-variable{color:#1f62e0}.panel-solo{position:fixed;bottom:0;right:0;margin:0;left:0;top:0;width:"100%";height:"100%"}.panel-solo .panel-container{border:none}.panel-solo .panel-menu-toggle,.panel-solo .panel-menu{display:none}.playlist-description{width:555px;margin-bottom:20px}.playlist-search-container{z-index:1000;position:relative;width:700px;box-shadow:0px 0px 55px 0px #000;background-color:#fff}.playlist-search-container .label-tag{margin-left:6px;font-size:11px;padding:2px 6px}.playlist-search-switches{position:absolute;top:8px;right:11px}.playlist-search-containerwrapper{margin-bottom:15px}.playlist-search-field-wrapper input{width:100%;padding:8px 8px;height:100%;box-sizing:border-box}.playlist-search-field-wrapper button{margin:0 4px 0 0}.playlist-search-field-wrapper>span{display:block;overflow:hidden}.playlist-search-results-container{min-height:100px;overflow:auto;display:block;line-height:28px}.playlist-search-results-container .search-item:hover,.playlist-search-results-container .search-item.selected{background-color:#f4f5f8}.playlist-search-results-container .selected .search-result-tag{opacity:.7;color:#fff}.playlist-search-results-container .fa-star,.playlist-search-results-container .fa-star-o{padding-left:13px}.playlist-search-results-container .fa-star{color:#eb7b18}.playlist-search-results-container .search-result-link .fa{padding-right:10px}.playlist-search-results-container .search-item{display:block;padding:3px 10px;white-space:nowrap;background-color:#fbfbfb;margin-bottom:4px}.playlist-search-results-container .search-item .search-result-icon:before{content:"\uF009"}.playlist-search-results-container .search-item.search-item-dash-home .search-result-icon:before{content:"\uF015"}.playlist-search-results-container .search-result-tags{float:right}.playlist-search-results-container .search-result-actions{float:right;padding-left:20px}.playlist-available-list td{line-height:28px;max-width:335px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.playlist-available-list .add-dashboard{text-align:center}.playlist-available-list .fa-star{color:#eb7b18}.playlist-column-header{border-bottom:thin solid #555;padding-bottom:3px;margin-bottom:15px}.selected-playlistitem-settings{text-align:right}.admin-settings-section{color:#1f62e0;font-weight:500}td.admin-settings-key{padding-left:20px}.admin-list-table{margin-bottom:20px}.admin-list-paging{float:right}.admin-list-paging li{display:inline-block;padding-left:10px;margin-bottom:5px}.admin-list-table .team-permissions{padding-right:120px}.alert-state-paused,.alert-state-pending{color:rgba(36,41,46,.75);font-weight:500}.alert-state-ok{color:#0a764e;font-weight:500}.alert-state-warning{color:#8a6c00;font-weight:500}.alert-state-critical{color:#cf0e5b;font-weight:500}.alert-notify-emails{width:400px;border-right:1px solid #000}.alert-notify-emails .bootstrap-tagsinput{width:394px}.alert-notify-emails .bootstrap-tagsinput input{border:0}.panel-alert-icon{display:none}.panel-has-alert .panel-alert-icon{display:inline-block}.panel-alert-state--alerting svg.panel-alert-icon{color:#cf0e5b;animation:alerting-panel 1s cubic-bezier(1, 0.1, 0.73, 1) 0s infinite alternate}.panel-alert-state--ok svg.panel-alert-icon{color:#0a764e}.panel-alert-state--pending svg.panel-alert-icon{color:#8a6c00}@keyframes alerting-panel{100%{transform:scale(1.2)}}.alert-rule-list{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;list-style-type:none}.alert-rule-item{display:flex;align-items:center;width:100%;height:100%;background:#f4f5f5;box-shadow:none;padding:4px 8px;border-radius:4px;margin-bottom:4px}.alert-rule-item__body{display:flex;flex-direction:column;flex-grow:1;justify-content:center;overflow:hidden}.alert-rule-item__icon{display:flex;justify-content:center;align-items:center;width:40px;padding:0 4px 0 2px}.alert-rule-item__icon .icon-gf,.alert-rule-item__icon .fa{font-size:200%;position:relative;top:2px}.alert-rule-item__header{display:flex;flex-direction:column;justify-content:space-between}.alert-rule-item__name{font-size:14px;margin:0;font-weight:500}.alert-list__btn{margin:0 2px;display:flex;align-items:center;justify-content:center}.alert-rule-item__text{font-weight:bold;font-size:12px;margin:0}.alert-rule-item__time{color:rgba(36,41,46,.75);font-weight:normal;white-space:nowrap}.alert-rule-item__info{font-weight:normal;flex-grow:2;display:flex;align-items:flex-end}.alert-rule-item__actions{display:flex;align-items:center}.alert-tesint{display:flex}.diff-indent-0{padding-left:0px;margin-left:10px}.diff-indent-1{padding-left:21px;margin-left:10px}.diff-indent-2{padding-left:42px;margin-left:10px}.diff-indent-3{padding-left:63px;margin-left:10px}.diff-indent-4{padding-left:84px;margin-left:10px}.diff-indent-5{padding-left:105px;margin-left:10px}.diff-indent-6{padding-left:126px;margin-left:10px}.diff-indent-7{padding-left:147px;margin-left:10px}.diff-indent-8{padding-left:168px;margin-left:10px}.diff-indent-9{padding-left:189px;margin-left:10px}.diff-indent-10{padding-left:210px;margin-left:10px}.diff-indent-11{padding-left:231px;margin-left:10px}.diff-indent-12{padding-left:252px;margin-left:10px}.diff-indent-13{padding-left:273px;margin-left:10px}.diff-indent-14{padding-left:294px;margin-left:10px}.diff-indent-15{padding-left:315px;margin-left:10px}.diff-indent-16{padding-left:336px;margin-left:10px}.delta-html{background:#f4f5f5;padding-top:5px;padding-bottom:5px;user-select:none}.diff-line{color:#24292e;font-family:"Roboto Mono",monospace;font-size:12px;line-height:2;margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:relative}.diff-line:after{left:-40px}.diff-line-number{color:rgba(36,41,46,.75);display:inline-block;font-size:10px;line-height:2.3;text-align:right;width:30px}.diff-line-number-hide{visibility:hidden}.diff-line-icon{color:#d8d9da;font-size:10px;float:right;position:relative;top:2px;right:10px}.diff-json-new,.diff-json-old,.diff-json-deleted,.diff-json-added{color:#fbfbfb}.diff-json-new .diff-line-number,.diff-json-old .diff-line-number,.diff-json-deleted .diff-line-number,.diff-json-added .diff-line-number{color:#d8d9da}.diff-json-new{background-color:#664e33}.diff-json-old{background-color:#5a372a}.diff-json-added{background-color:#2c5ab0}.diff-json-deleted{background-color:#b31b58}.diff-value{user-select:all}.diff-circle{margin-right:.5em}.diff-circle *{margin-bottom:1px}.diff-circle-changed{color:#f59433}.diff-circle-added{color:#29d761}.diff-circle-deleted{color:#fd474a}.diff-item-added,.diff-item-deleted{list-style:none}.diff-group{background:#f4f5f5;font-size:16px;font-style:normal;padding:10px 15px;margin:16px 0}.diff-group .diff-group{padding:0 5px}.diff-group-name{display:inline-block;width:100%;font-size:16px;padding-left:1.75em;margin:0 0 14px 0}.diff-summary-key{padding-left:.25em}.diff-list{padding-left:40px}.diff-list .diff-list{padding-left:0}.diff-item{color:#8e8e8e;line-height:2.5}.diff-item>div{display:inline}.diff-item-changeset{list-style:none}.diff-label{background-color:rgba(36,41,46,.12);border-radius:3px;color:#8e8e8e;display:inline;font-size:14px;margin:0 5px;padding:3px 8px}.diff-linenum{float:right}.diff-arrow{color:#161719}.diff-block{width:100%;display:inline-block}.diff-block-title{font-size:16px;display:inline-block}.diff-title{font-size:16px}.diff-change-container{margin:0 0;padding-left:3em;padding-right:0}.diff-change-group{width:100%;color:#24292e;margin-bottom:14px}.diff-change-item{display:inline-block}.diff-change-title{font-size:16px}.bullet-position-container{position:relative;left:-6px}.diff-list-circle{margin-bottom:3px}.signup-page-container{position:fixed;top:0;left:0;right:0;bottom:0;height:100%;width:100%;background-image:url(/img/background_tease.jpg)}.signup-page-container .signup-logo-container{width:150px;margin:0 auto;padding:80px 0}.error-container{display:flex;flex-direction:row}.error-row{display:flex;flex-direction:row}.error-column{display:flex;flex-direction:column}.error-space-between{justify-content:space-between}.graph-box{width:62%;padding:32px 16px}.info-box{width:38%;padding:32px 16px}.graph-percentage{padding:0 0 18px}.image-box{padding:8px}.left-margin{padding:0 0 0 64px}.current-box{justify-content:flex-end}.current-text{color:#1f62e0;font-weight:bold;line-height:14px}.error-link{color:#eb7b18}.error-minus{color:#7eb26d;padding:0 8px;line-height:21px}.graph-percentage p{text-align:right;margin:0;line-height:14px}.graph-text{margin:0}@media(max-width: 768px){.graph-box{width:50%}.info-box{width:50%}}@media(max-width: 543px){.error-container{flex-direction:column}.graph-box{width:100%}.info-box{width:100%}.error-full-width{width:100%}}.explore-active-button{box-shadow:0px 0px 4px rgba(234,161,51,.6);border:1px solid #ff780a !important;color:#ff780a !important}.explore-input-margin{margin-right:4px}.graph-legend{flex-wrap:wrap}.query-row-break{flex-basis:100%}.explore .prom-query-field-info{margin:.25em .5em .5em;display:flex}.explore .prom-query-field-info details{margin-left:1em}.ReactTable{border:none}.ReactTable .rt-table{min-height:90px}.ReactTable .rt-thead.-header{box-shadow:none;background:#fbfbfb;border-top:2px solid #f4f5f5;border-bottom:2px solid #f4f5f5;height:2em}.ReactTable .rt-thead.-header .rt-th{text-align:left;color:#1f62e0;font-weight:500}.ReactTable .rt-thead .rt-td,.ReactTable .rt-thead .rt-th{padding:.45em 0 .45em 1.1em;border-right:none;box-shadow:none}.ReactTable .rt-tbody .rt-td{padding:.45em 0 .45em 1.1em;border-bottom:2px solid #f4f5f5;border-right:2px solid #f4f5f5}.ReactTable .rt-tbody .rt-td:last-child{border-right:none}.ReactTable .-pagination{border-top:none;box-shadow:none;margin-top:8px}.ReactTable .-pagination .-btn{color:#1f62e0;background:#fbfbfb}.ReactTable .-pagination input,.ReactTable .-pagination select{color:#24292e;background-color:#fff}.ReactTable .-loading{background:#fff}.ReactTable .-loading.-active{opacity:.8}.ReactTable .-loading>div{color:#24292e}.ReactTable .rt-tr .rt-td:last-child{text-align:right}.ReactTable .rt-noData{top:60px;z-index:inherit}.rc-cascader-menu-item-loading:after{position:absolute;right:12px;content:"loading";color:#767980;font-style:italic}.rc-cascader-menu{vertical-align:top;scrollbar-width:thin}.cheat-sheet-item{margin:24px 0}.cheat-sheet-item__title{font-size:1.5714285714rem}.cheat-sheet-item__example{margin:4px 0;text-align:left;border:none;background:rgba(0,0,0,0);display:block}.query-type-toggle{margin-left:5px}.query-type-toggle .btn.active{background-color:#fff;background-image:none;background-clip:padding-box;border:1px solid rgba(36,41,46,.3);border-radius:2px;box-shadow:none;color:#24292e}.sidebar-content{width:calc(100% - 210px)}@media(min-width: 769px){.sidebar-container{display:flex;flex-direction:row;flex-wrap:wrap}}@media(min-width: 769px){.page-sidebar{width:154px;margin-left:56px}}.page-sidebar-section{margin-bottom:32px}.get-more-plugins-link{color:#b3b3b3;font-size:12px;position:relative;top:16px}.get-more-plugins-link:hover{color:#000}.get-more-plugins-link img{vertical-align:top}@media(max-width: 768px){.get-more-plugins-link{display:none}}.plugin-info-list-item{white-space:nowrap;max-width:154px;text-overflow:ellipsis;overflow:hidden}.plugin-info-list-item img,.plugin-info-list-item i{width:16px;margin-right:4px;margin-bottom:1px}.view-mode--inactive .react-resizable-handle,.view-mode--tv .react-resizable-handle,.view-mode--kiosk .react-resizable-handle,.view-mode--inactive .add-row-panel-hint,.view-mode--tv .add-row-panel-hint,.view-mode--kiosk .add-row-panel-hint,.view-mode--inactive .dash-row-menu-container,.view-mode--tv .dash-row-menu-container,.view-mode--kiosk .dash-row-menu-container,.view-mode--inactive .panel-info-corner--info,.view-mode--tv .panel-info-corner--info,.view-mode--kiosk .panel-info-corner--info,.view-mode--inactive .panel-info-corner--links,.view-mode--tv .panel-info-corner--links,.view-mode--kiosk .panel-info-corner--links{display:none}.view-mode--tv .sidemenu,.view-mode--kiosk .sidemenu{position:fixed;background-color:rgba(0,0,0,0);box-shadow:none}.view-mode--tv .sidemenu .sidemenu__top,.view-mode--kiosk .sidemenu .sidemenu__top,.view-mode--tv .sidemenu .sidemenu__bottom,.view-mode--kiosk .sidemenu .sidemenu__bottom,.view-mode--tv .sidemenu .sidemenu__logo_small_breakpoint,.view-mode--kiosk .sidemenu .sidemenu__logo_small_breakpoint{display:none}@media(max-width: 768px){.view-mode--tv .sidemenu .sidemenu__logo,.view-mode--kiosk .sidemenu .sidemenu__logo{display:block}}.view-mode--tv .page-toolbar,.view-mode--kiosk .page-toolbar{padding-left:60px}.view-mode--tv .page-toolbar--fullscreen,.view-mode--kiosk .page-toolbar--fullscreen{padding-left:16px}.view-mode--tv .submenu-controls,.view-mode--kiosk .submenu-controls{display:none}.view-mode--kiosk .sidemenu,.view-mode--kiosk .page-toolbar{display:none}.view-mode--kiosk .submenu-controls{display:none}@media(max-width: 768px){nav.page-toolbar--fullscreen{padding-left:16px}}`,""]),V.Z=c},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/dataframe/processDataFrame.ts":function(se,V,e){"use strict";e.d(V,{sV:function(){return re},fu:function(){return R},LI:function(){return $},aY:function(){return W},aK:function(){return P},og:function(){return Y}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts");const l=(Z,te=!1)=>{const Pe=Z.values;switch(Z.type){case a.fS.number:return w(Pe,te);case a.fS.string:return _(Pe,te);case a.fS.boolean:return m(Pe,te);case a.fS.time:return typeof Z.values.get(0)=="number"?E(Pe,te):O(Pe,te);default:return C(te)}},f=(Z,te)=>{if(!Z||!te)return c(Z,te);if((0,t.isNumber)(Z)&&(0,t.isNumber)(te))return x(Z,te);if((0,n.D2)(Z)&&(0,n.D2)(te)){if((0,n.CQ)(Z).isBefore(te))return-1;if((0,n.CQ)(te).isBefore(Z))return 1}return 0},x=(Z,te)=>Z-te,d=(Z,te)=>!Z||!te?c(Z,te):Z.localeCompare(te),i=(Z,te)=>c(Z,te),c=(Z,te)=>!Z&&te?1:Z&&!te?-1:0,E=(Z,te)=>{let Pe=Z.toArray(),he=te?-1:1;return(ie,Ce)=>he*(Pe[ie]-Pe[Ce])},O=(Z,te)=>(Pe,he)=>{const ie=Z.get(Pe),Ce=Z.get(he);return te?f(Ce,ie):f(ie,Ce)},m=(Z,te)=>(Pe,he)=>{const ie=Z.get(Pe),Ce=Z.get(he);return te?i(Ce,ie):i(ie,Ce)},w=(Z,te)=>(Pe,he)=>{const ie=Z.get(Pe),Ce=Z.get(he);return te?x(Ce,ie):x(ie,Ce)},_=(Z,te)=>(Pe,he)=>{const ie=Z.get(Pe),Ce=Z.get(he);return te?d(Ce,ie):d(ie,Ce)},C=Z=>(te,Pe)=>Z?x(Pe,te):x(te,Pe);var b=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/vectorToArray.ts");class g{constructor(te,Pe){this.source=te,this.order=Pe}get length(){return this.source.length}get(te){return this.source.get(this.order[te])}toArray(){return(0,b.n)(this)}toJSON(){return(0,b.n)(this)}getOrderArray(){return this.order}}var v=Object.defineProperty,y=Object.defineProperties,h=Object.getOwnPropertyDescriptors,s=Object.getOwnPropertySymbols,o=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable,u=(Z,te,Pe)=>te in Z?v(Z,te,{enumerable:!0,configurable:!0,writable:!0,value:Pe}):Z[te]=Pe,p=(Z,te)=>{for(var Pe in te||(te={}))o.call(te,Pe)&&u(Z,Pe,te[Pe]);if(s)for(var Pe of s(te))r.call(te,Pe)&&u(Z,Pe,te[Pe]);return Z},S=(Z,te)=>y(Z,h(te)),k=(Z,te)=>{var Pe={};for(var he in Z)o.call(Z,he)&&te.indexOf(he)<0&&(Pe[he]=Z[he]);if(Z!=null&&s)for(var he of s(Z))te.indexOf(he)<0&&r.call(Z,he)&&(Pe[he]=Z[he]);return Pe};function D(Z){const te=Z.columns.map(Pe=>{const he=Pe,{text:ie,type:Ce}=he,Le=k(he,["text","type"]);return{name:ie!=null&&ie.length?ie:Pe,config:Le||{},values:new ArrayVector,type:Ce&&Object.values(FieldType).includes(Ce)?Ce:FieldType.other}});if(!isArray(Z.rows))throw new Error(`Expected table rows to be array, got ${typeof Z.rows}.`);for(const Pe of Z.rows)for(let he=0;he<te.length;he++)te[he].values.buffer.push(Pe[he]);for(const Pe of te)if(Pe.type===FieldType.other){const he=R(Pe);he&&(Pe.type=he)}return{fields:te,refId:Z.refId,meta:Z.meta,name:Z.name,length:Z.rows.length}}function M(Z){const te=[],Pe=[],he=Z.datapoints||Z.points;for(const Ce of he)Pe.push(Ce[0]),te.push(Ce[1]);const ie=[{name:TIME_SERIES_TIME_FIELD_NAME,type:FieldType.time,config:{},values:new ArrayVector(te)},{name:TIME_SERIES_VALUE_FIELD_NAME,type:FieldType.number,config:{unit:Z.unit},values:new ArrayVector(Pe),labels:Z.tags}];return Z.title&&(ie[1].config.displayNameFromDS=Z.title),{name:Z.target||Z.name,refId:Z.refId,meta:Z.meta,fields:ie,length:Pe.length}}function I(Z){const te=new ArrayVector,Pe=new ArrayVector;for(let he=0;he<Z.data.length;he++){const ie=Z.data[he];te.buffer.push(ie[1]),Pe.buffer.push(ie[0])}return{name:Z.label,fields:[{name:Z.label||TIME_SERIES_VALUE_FIELD_NAME,type:FieldType.number,config:{},values:te},{name:TIME_SERIES_TIME_FIELD_NAME,type:FieldType.time,config:{unit:"dateTimeAsIso"},values:Pe}],length:te.buffer.length}}function T(Z){const te=[{name:Z.target,type:FieldType.other,labels:Z.tags,config:{unit:Z.unit,filterable:Z.filterable},values:new ArrayVector}];for(const Pe of Z.datapoints)te[0].values.buffer.push(Pe);return{name:Z.target,refId:Z.target,meta:{json:!0},fields:te,length:Z.datapoints.length}}const j=/^\s*(-?(\d*\.?\d+|\d+\.?\d*)(e[-+]?\d+)?|NAN)\s*$/i;function K(Z,te){return Z&&(Z=Z.toLowerCase(),Z==="date"||Z==="time")?FieldType.time:$(te)}function F(Z){return Z instanceof Date||isDateTime(Z)?FieldType.time:isNumber(Z)?FieldType.number:isString(Z)?FieldType.string:isBoolean(Z)?FieldType.boolean:FieldType.other}function $(Z){return Z instanceof Date||(0,n.v9)(Z)?a.fS.time:(0,t.isNumber)(Z)?a.fS.number:(0,t.isString)(Z)?j.test(Z)?a.fS.number:Z==="true"||Z==="TRUE"||Z==="True"||Z==="false"||Z==="FALSE"||Z==="False"?a.fS.boolean:a.fS.string:(0,t.isBoolean)(Z)?a.fS.boolean:a.fS.other}function R(Z){if(Z.name){const te=Z.name.toLowerCase();if(te==="date"||te==="time")return a.fS.time}for(let te=0;te<Z.values.length;te++){const Pe=Z.values.get(te);if(Pe!=null)return $(Pe)}}const U=(Z,te=!1)=>{for(const Pe of Z.fields)if(!Pe.type||Pe.type===FieldType.other||te)return S(p({},Z),{fields:Z.fields.map(he=>he.type&&he.type!==FieldType.other&&!te?he:S(p({},he),{type:R(he)||FieldType.other}))});return Z},H=Z=>Boolean(Z&&Z.hasOwnProperty("columns")),W=Z=>Boolean(Z&&Z.hasOwnProperty("fields"));function oe(Z){var te,Pe;if("fields"in Z)return"length"in Z&&((Pe=(te=Z.fields[0])==null?void 0:te.values)==null?void 0:Pe.get)?Z:new MutableDataFrame(Z);if(Z.hasOwnProperty("type")&&Z.type==="docs")return T(Z);if(Z.hasOwnProperty("datapoints")||Z.hasOwnProperty("points"))return M(Z);if(Z.hasOwnProperty("data"))return Z.hasOwnProperty("schema")?dataFrameFromJSON(Z):I(Z);if(Z.hasOwnProperty("columns"))return D(Z);if(Array.isArray(Z))return new ArrayDataFrame(Z);throw console.warn("Can not convert",Z),new Error("Unsupported data format")}const Q=Z=>{const{fields:te}=Z,Pe=Z.length,he=[];if(te.length===2){const{timeField:ie,timeIndex:Ce}=re(Z);if(ie){const we=te[Ce===0?1:0],ue=te[Ce];for(let Ie=0;Ie<Pe;Ie++)he.push([we.values.get(Ie),ue.values.get(Ie)]);return{alias:Z.name,target:getFieldDisplayName(we,Z),datapoints:he,unit:te[0].config?te[0].config.unit:void 0,refId:Z.refId,meta:Z.meta}}}for(let ie=0;ie<Pe;ie++){const Ce=[];for(let Le=0;Le<te.length;Le++)Ce.push(te[Le].values.get(ie));he.push(Ce)}return Z.meta&&Z.meta.json?{alias:te[0].name||Z.name,target:te[0].name||Z.name,datapoints:te[0].values.toArray(),filterable:te[0].config?te[0].config.filterable:void 0,type:"docs"}:{columns:te.map(ie=>{const{name:Ce,config:Le}=ie;if(Le){const we=k(Le,[]);return we.text=Ce,we}return{text:Ce}}),type:"table",refId:Z.refId,meta:Z.meta,rows:he}};function P(Z,te,Pe=!1){const he=Z.fields[te];if(!he)return Z;const ie=[];for(let Le=0;Le<Z.length;Le++)ie.push(Le);const Ce=l(he,Pe);return ie.sort(Ce),S(p({},Z),{fields:Z.fields.map(Le=>S(p({},Le),{values:new g(Le.values,ie)}))})}function ae(Z){return S(p({},Z),{fields:Z.fields.map(te=>{const Pe=[...te.values.toArray()];return Pe.reverse(),S(p({},te),{values:new ArrayVector(Pe)})})})}function q(Z,te){const Pe=[];for(const he of Z.fields)Pe.push(he.values.get(te));return Pe}function Y(Z){return ve(Z)}function ve(Z,te){return{fields:(te?Z.fields.filter(te):Z.fields).map(ie=>{let Ce=ie.values.toArray();return Ce instanceof Float64Array&&(Ce=(0,b.n)(ie.values)),{name:ie.name,type:ie.type,config:ie.config,values:Ce,labels:ie.labels}}),refId:Z.refId,meta:Z.meta,name:Z.name}}const re=Z=>{for(let te=0;te<Z.fields.length;te++)if(Z.fields[te].type===a.fS.time)return{timeField:Z.fields[te],timeIndex:te};return{}};function je(Z){const te=U(oe(Z));if(te.fields&&te.fields.length)for(const Pe of te.fields)Pe.state=null;return te}function me(Z){return!Z||!isArray(Z)?[]:Z.map(te=>je(te))}function ne(Z,te){const{series:Pe,annotations:he}=Z;if(Z.state===LoadingState.Loading&&Pe.length===0)return te||(te=Z),S(p({},te),{state:LoadingState.Loading,request:Z.request});const ie=performance.now(),Ce=Pe.map(ue=>je(ue)),Le=me(he),we=performance.now();return S(p({},Z),{series:Ce,annotations:Le,timings:{dataProcessingTime:we-ie}})}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/common.ts":function(se,V,e){"use strict";e.d(V,{Z:function(){return l}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/time.ts");let n=()=>t.Ys;const a=f=>{n=f!=null?f:n},l=f=>{var x,d;return(d=(x=f==null?void 0:f.timeZone)!=null?x:n())!=null?d:t.Ys}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/datemath.ts":function(se,V,e){"use strict";e.d(V,{JY:function(){return d},Qc:function(){return x},fM:function(){return f}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts");const l=["y","M","w","d","h","m","s","Q"];function f(E){return E?!!(typeof E=="string"&&(E.substring(0,3)==="now"||E.includes("||"))):!1}function x(E,O,m,w){if(!!E){if(typeof E!="string")return(0,a.v9)(E)?E:(0,t.isDate)(E)?(0,a.CQ)(E):void 0;{let _,C="",b,g;return E.substring(0,3)==="now"?(_=(0,a.GY)(m),C=E.substring(3)):(b=E.indexOf("||"),b===-1?(g=E,C=""):(g=E.substring(0,b),C=E.substring(b+2)),_=(0,a.CQ)(g,a.VJ)),C.length?i(C,_,O,w):_}}}function d(E){const O=x(E);return O&&(0,a.v9)(O)?O.isValid():!1}function i(E,O,m,w=0){const _=E.replace(/\s/g,""),C=O;let b=0;const g=_.length;for(;b<g;){const v=_.charAt(b++);let y,h,s,o=!1;if(v==="/")y=0;else if(v==="+")y=1;else if(v==="-")y=2;else return;if(isNaN(parseInt(_.charAt(b),10)))h=1;else if(_.length===2)h=parseInt(_.charAt(b),10);else{const r=b;for(;!isNaN(parseInt(_.charAt(b),10));)if(b++,b>10)return;h=parseInt(_.substring(r,b),10)}if(y===0&&h!==1)return;if(s=_.charAt(b++),s==="f"&&(s=_.charAt(b++),o=!0),(0,t.includes)(l,s))y===0?m?o?c(w,C,s,m):C.endOf(s):o?c(w,C,s,m):C.startOf(s):y===1?C.add(h,s):y===2&&C.subtract(h,s);else return}return C}function c(E,O,m,w){switch(m){case"y":return w?c(E,O,m,!1).add(11,"M").endOf("M"):O.subtract((O.month()-E+12)%12,"M").startOf("M"),O;case"Q":return w?c(E,O,m,!1).add(2,"M").endOf("M"):O.subtract((O.month()-E+3)%3,"M").startOf("M"),O;default:return}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formats.ts":function(se,V,e){"use strict";e.d(V,{Ji:function(){return l},U6:function(){return f}});const t="YYYY-MM-DD HH:mm:ss",n="YYYY-MM-DD HH:mm:ss.SSS";class a{constructor(){this.fullDate=t,this.fullDateMS=n,this.interval={millisecond:"HH:mm:ss.SSS",second:"HH:mm:ss",minute:"HH:mm",hour:"MM/DD HH:mm",day:"MM/DD",month:"YYYY-MM",year:"YYYY"}}update(i){this.fullDate=i.fullDate,this.interval=i.interval,i.useBrowserLocale&&this.useBrowserLocale()}useBrowserLocale(){this.fullDate=l({year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"}),this.fullDateMS=this.fullDate.replace("ss","ss.SSS"),this.interval.millisecond=l({hour:"2-digit",minute:"2-digit",second:"2-digit",hour12:!1},null,this.interval.second).replace("ss","ss.SSS"),this.interval.second=l({hour:"2-digit",minute:"2-digit",second:"2-digit",hour12:!1},null,this.interval.second),this.interval.minute=l({hour:"2-digit",minute:"2-digit",hour12:!1},null,this.interval.minute),this.interval.hour=l({month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",hour12:!1},null,this.interval.hour),this.interval.day=l({month:"2-digit",day:"2-digit",hour12:!1},null,this.interval.day),this.interval.month=l({year:"numeric",month:"2-digit",hour12:!1},null,this.interval.month)}getTimeFieldUnit(i){return`time:${i?this.fullDateMS:this.fullDate}`}}function l(d,i,c){if(x())return c!=null?c:t;!i&&navigator&&(i=[...navigator.languages]);const E=new Intl.DateTimeFormat(i||void 0,d),O=E.formatToParts(new Date),w={year:"YYYY",month:"MM",day:"DD",hour:E.resolvedOptions().hour12?"hh":"HH",minute:"mm",second:"ss",weekday:"ddd",era:"N",dayPeriod:"A",timeZoneName:"Z"};return O.map(_=>w[_.type]||_.value).join("")}const f=new a,x=()=>!("DateTimeFormat"in Intl)||!("formatToParts"in Intl.DateTimeFormat.prototype)},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formatter.ts":function(se,V,e){"use strict";e.d(V,{E8:function(){return d},Hk:function(){return c},dq:function(){return f}});var t=e("../../../yarn/cache/moment-timezone-npm-0.5.41-89ab1cea80-30bf42265f.zip/node_modules/moment-timezone/index.js"),n=e.n(t),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/common.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formats.ts");const f=(m,w)=>O(m,(0,a.Z)(w)).format(E(w)),x=(m,w)=>O(m,getTimeZone(w)).format(),d=(m,w)=>O(m,(0,a.Z)(w)).fromNow(),i=(m,w)=>O(m,getTimeZone(w)).format(`${systemDateFormats.fullDate} z`),c=(m,w)=>O(m,(0,a.Z)(w)).format("z"),E=m=>{var w,_;return m!=null&&m.defaultWithMS?(w=m==null?void 0:m.format)!=null?w:l.U6.fullDateMS:(_=m==null?void 0:m.format)!=null?_:l.U6.fullDate},O=(m,w)=>{const _=m,C=n().tz.zone(w);if(C&&C.name)return n().utc(_).tz(C.name);switch(w){case"utc":return n().utc(_);default:return n().utc(_).local()}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts":function(se,V,e){"use strict";e.d(V,{CQ:function(){return O},C_:function(){return m},D2:function(){return d},GY:function(){return w},Ks:function(){return E},VJ:function(){return a},v9:function(){return i},zh:function(){return c}});var t=e("../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/moment.js"),n=e.n(t);const a=n().ISO_8601,l=g=>{moment.locale(g)},f=()=>moment.locale(),x=()=>moment.localeData(),d=g=>g===null||typeof g=="string"||typeof g=="number"||g instanceof Date||Array.isArray(g)&&g.every(v=>typeof v=="string"||typeof v=="number")||i(g),i=g=>n().isMoment(g),c=(g,v)=>n().utc(g,v),E=(g,v)=>n().duration(g,v),O=(g,v)=>n()(g,v),m=g=>O(g),w=(g,v,y)=>g==="utc"?c(v,y):O(v,y),_=g=>moment.weekdays().findIndex(v=>v.toLowerCase()===g.toLowerCase()),C=g=>["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"].findIndex(v=>v.toLowerCase()===g.toLowerCase()),b=g=>{const v="-weekStart",y=f().replace(v,""),h=g?C(g):-1;h!==-1?moment.locale(y+v,{parentLocale:y,week:{dow:h}}):l(y)}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/parser.ts":function(se,V,e){"use strict";e.d(V,{J:function(){return c}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t),a=e("../../../yarn/cache/moment-timezone-npm-0.5.41-89ab1cea80-30bf42265f.zip/node_modules/moment-timezone/index.js"),l=e.n(a),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/common.ts"),x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/datemath.ts"),d=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formats.ts"),i=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts");const c=(m,w)=>(0,i.v9)(m)?m:typeof m=="string"?E(m,w):O(m,w),E=(m,w)=>{var _;if(m.indexOf("now")!==-1)return(0,x.JY)(m)&&(0,x.Qc)(m,w==null?void 0:w.roundUp,w==null?void 0:w.timeZone,w==null?void 0:w.fiscalYearStartMonth)||l()();const C=(0,f.Z)(w),b=l().tz.zone(C),g=(_=w==null?void 0:w.format)!=null?_:d.U6.fullDate;if(b&&b.name)return l().tz(m,g,b.name);switch((0,t.lowerCase)(C)){case"utc":return l().utc(m,g);default:return l()(m,g)}},O=(m,w)=>{const _=m,C=(0,f.Z)(w),b=l().tz.zone(C);if(b&&b.name)return l().tz(_,b.name);switch((0,t.lowerCase)(C)){case"utc":return l().utc(_);default:return l()(_)}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/rangeutil.ts":function(se,V,e){"use strict";e.d(V,{eu:function(){return m},ix:function(){return C},kj:function(){return g},s3:function(){return v},yW:function(){return _}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/datemath.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formatter.ts"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/parser.ts");const d={s:{display:"second"},m:{display:"minute"},h:{display:"hour"},d:{display:"day"},w:{display:"week"},M:{display:"month"},y:{display:"year"}},i=[{from:"now/d",to:"now/d",display:"Today"},{from:"now/d",to:"now",display:"Today so far"},{from:"now/w",to:"now/w",display:"This week"},{from:"now/w",to:"now",display:"This week so far"},{from:"now/M",to:"now/M",display:"This month"},{from:"now/M",to:"now",display:"This month so far"},{from:"now/y",to:"now/y",display:"This year"},{from:"now/y",to:"now",display:"This year so far"},{from:"now-1d/d",to:"now-1d/d",display:"Yesterday"},{from:"now-2d/d",to:"now-2d/d",display:"Day before yesterday"},{from:"now-7d/d",to:"now-7d/d",display:"This day last week"},{from:"now-1w/w",to:"now-1w/w",display:"Previous week"},{from:"now-1M/M",to:"now-1M/M",display:"Previous month"},{from:"now-1Q/fQ",to:"now-1Q/fQ",display:"Previous fiscal quarter"},{from:"now-1y/y",to:"now-1y/y",display:"Previous year"},{from:"now-1y/fy",to:"now-1y/fy",display:"Previous fiscal year"},{from:"now-5m",to:"now",display:"Last 5 minutes"},{from:"now-15m",to:"now",display:"Last 15 minutes"},{from:"now-30m",to:"now",display:"Last 30 minutes"},{from:"now-1h",to:"now",display:"Last 1 hour"},{from:"now-3h",to:"now",display:"Last 3 hours"},{from:"now-6h",to:"now",display:"Last 6 hours"},{from:"now-12h",to:"now",display:"Last 12 hours"},{from:"now-24h",to:"now",display:"Last 24 hours"},{from:"now-2d",to:"now",display:"Last 2 days"},{from:"now-7d",to:"now",display:"Last 7 days"},{from:"now-30d",to:"now",display:"Last 30 days"},{from:"now-90d",to:"now",display:"Last 90 days"},{from:"now-6M",to:"now",display:"Last 6 months"},{from:"now-1y",to:"now",display:"Last 1 year"},{from:"now-2y",to:"now",display:"Last 2 years"},{from:"now-5y",to:"now",display:"Last 5 years"},{from:"now/fQ",to:"now",display:"This fiscal quarter so far"},{from:"now/fQ",to:"now/fQ",display:"This fiscal quarter"},{from:"now/fy",to:"now",display:"This fiscal year so far"},{from:"now/fy",to:"now/fy",display:"This fiscal year"}],c=[{from:"now",to:"now+1m",display:"Next minute"},{from:"now",to:"now+5m",display:"Next 5 minutes"},{from:"now",to:"now+15m",display:"Next 15 minutes"},{from:"now",to:"now+30m",display:"Next 30 minutes"},{from:"now",to:"now+1h",display:"Next hour"},{from:"now",to:"now+3h",display:"Next 3 hours"},{from:"now",to:"now+6h",display:"Next 6 hours"},{from:"now",to:"now+12h",display:"Next 12 hours"},{from:"now",to:"now+24h",display:"Next 24 hours"},{from:"now",to:"now+2d",display:"Next 2 days"},{from:"now",to:"now+7d",display:"Next 7 days"},{from:"now",to:"now+30d",display:"Next 30 days"},{from:"now",to:"now+90d",display:"Next 90 days"},{from:"now",to:"now+6M",display:"Next 6 months"},{from:"now",to:"now+1y",display:"Next year"},{from:"now",to:"now+2y",display:"Next 2 years"},{from:"now",to:"now+5y",display:"Next 5 years"}],E={};(0,t.each)(i,I=>{E[I.from+" to "+I.to]=I}),(0,t.each)(c,I=>{E[I.from+" to "+I.to]=I});function O(I){const T=I.indexOf("+")!==0;I.indexOf("now")===-1&&(I=(T?"now-":"now")+I);let j=E[I+" to now"];if(j)return j;T?j={from:I,to:"now"}:j={from:"now",to:I};const K=/^now([-+])(\d+)(\w)/.exec(I);if(K){const F=K[3],$=parseInt(K[2],10),R=d[F];R&&(j.display=T?"Last ":"Next ",j.display+=$+" "+R.display,j.section=R.section,$>1&&(j.display+="s"))}else j.display=j.from+" to "+j.to,j.invalid=!0;return j}function m(I,T){const j=E[I.from.toString()+" to "+I.to.toString()];if(j)return j.display;const K={timeZone:T};if((0,f.v9)(I.from)&&(0,f.v9)(I.to))return(0,l.dq)(I.from,K)+" to "+(0,l.dq)(I.to,K);if((0,f.v9)(I.from)){const F=a.Qc(I.to,!0,"utc");return F?(0,l.dq)(I.from,K)+" to "+(0,l.E8)(F,K):""}if((0,f.v9)(I.to)){const F=a.Qc(I.from,!1,"utc");return F?(0,l.E8)(F,K)+" to "+(0,l.dq)(I.to,K):""}return I.to.toString()==="now"?O(I.from).display:I.from.toString()+" to "+I.to.toString()}const w=I=>I.indexOf("$")===0||I.indexOf("+$")===0?!0:O(I).invalid!==!0,_=(I,T)=>{if((0,f.v9)(I.from))return(0,l.Hk)(I.from,{timeZone:T});const j=a.Qc(I.from,!0);return j?(0,l.Hk)(j,{timeZone:T}):""},C=(I,T,j)=>{const K=(0,x.J)(I.from,{roundUp:!1,timeZone:T,fiscalYearStartMonth:j}),F=(0,x.J)(I.to,{roundUp:!0,timeZone:T,fiscalYearStartMonth:j});return a.fM(I.from)||a.fM(I.to)?{from:K,to:F,raw:I}:{from:K,to:F,raw:{from:K,to:F}}};function b(I){return typeof I=="string"?I.indexOf("now")>=0:!1}function g(I){return typeof I.raw.from=="string"&&I.raw.from.indexOf("f")>0?!0:typeof I.raw.to=="string"&&I.raw.to.indexOf("f")>0}function v(I){return b(I.from)||b(I.to)}function y(I){const T=Math.floor(I/31536e3);if(T)return T+"y";const j=Math.floor(I%31536e3/86400);if(j)return j+"d";const K=Math.floor(I%31536e3%86400/3600);if(K)return K+"h";const F=Math.floor(I%31536e3%86400%3600/60);if(F)return F+"m";const $=Math.floor(I%31536e3%86400%3600%60);if($)return $+"s";const R=Math.floor(I*1e3);return R?R+"ms":"less than a millisecond"}function h(I){const T=Number((I/1e3).toFixed()),j=Math.floor(T/60/60),K=Math.floor(T/60)-j*60,F=Number((T%60).toFixed());let $=j?j+"h":"",R=K?K+"min":"",U=F?F+"sec":"";return $&&R?$=$+" ":$=$,(R||$)&&U?R=R+" ":R=R,$+R+U||"less than 1sec"}function s(I,T,j){let K=1;j&&(K=S(j));let F=k((I.to.valueOf()-I.from.valueOf())/T);return K>F&&(F=K),{intervalMs:F,interval:y(F/1e3)}}const o=/(-?\d+(?:\.\d+)?)(ms|[Mwdhmsy])/,r={y:31536e3,M:2592e3,w:604800,d:86400,h:3600,m:60,s:1,ms:.001};function u(I){if(Number(I))return{sec:r.s,type:"s",count:parseInt(I,10)};const T=I.match(o);if(!T||!has(r,T[2]))throw new Error(`Invalid interval string, has to be either unit-less or end with one of the following units: "${Object.keys(r).join(", ")}"`);return{sec:r[T[2]],type:T[2],count:parseInt(T[1],10)}}function p(I){const T=u(I);return T.sec*T.count}function S(I){const T=u(I);return T.sec*1e3*T.count}function k(I){switch(!0){case I<10:return 1;case I<15:return 10;case I<35:return 20;case I<75:return 50;case I<150:return 100;case I<350:return 200;case I<750:return 500;case I<1500:return 1e3;case I<3500:return 2e3;case I<7500:return 5e3;case I<12500:return 1e4;case I<17500:return 15e3;case I<25e3:return 2e4;case I<45e3:return 3e4;case I<9e4:return 6e4;case I<21e4:return 12e4;case I<45e4:return 3e5;case I<75e4:return 6e5;case I<105e4:return 9e5;case I<15e5:return 12e5;case I<27e5:return 18e5;case I<54e5:return 36e5;case I<9e6:return 72e5;case I<162e5:return 108e5;case I<324e5:return 216e5;case I<864e5:return 432e5;case I<6048e5:return 864e5;case I<18144e5:return 6048e5;case I<36288e5:return 2592e6;default:return 31536e6}}function D(I,T=dateTime()){const j=T.unix()-I.from.unix(),K=T.unix()-I.to.unix();return{from:j,to:K}}function M(I,T=dateTime()){const j=dateTime(T).subtract(I.from,"s"),K=I.to===0?dateTime(T):dateTime(T).subtract(I.to,"s");return{from:j,to:K,raw:{from:j,to:K}}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/timezones.ts":function(se,V,e){"use strict";e.d(V,{$8:function(){return y},Pr:function(){return g},RQ:function(){return C},Vs:function(){return b}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t),a=e("../../../yarn/cache/moment-timezone-npm-0.5.41-89ab1cea80-30bf42265f.zip/node_modules/moment-timezone/index.js"),l=e.n(a),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/common.ts"),x=Object.defineProperty,d=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(p,S,k)=>S in p?x(p,S,{enumerable:!0,configurable:!0,writable:!0,value:k}):p[S]=k,w=(p,S)=>{for(var k in S||(S={}))E.call(S,k)&&m(p,k,S[k]);if(c)for(var k of c(S))O.call(S,k)&&m(p,k,S[k]);return p},_=(p,S)=>d(p,i(S)),C=(p=>(p.default="",p.localBrowserTime="browser",p.utc="utc",p))(C||{});const b=p=>{switch((0,f.Z)({timeZone:p})){case"browser":return"Local browser time";case"utc":return"UTC";default:return p}},g=(p,S)=>{const k=h(p,S);return k||o(p,S)},v=(0,t.memoize)((p=!1)=>{const S=[];return p===!0?S.push("","browser","utc"):p&&S.push(...p),l().tz.names().reduce((k,D)=>{const M=u[D];return!Array.isArray(M)||M.length===0||k.push(D),k},S)}),y=(0,t.memoize)((p=!1)=>{const k=v(p).reduce((D,M)=>{var I,T;const j=M.indexOf("/");if(j===-1){const F="";return D[F]=(I=D[F])!=null?I:[],D[F].push(M),D}const K=M.slice(0,j);return D[K]=(T=D[K])!=null?T:[],D[K].push(M),D},{});return Object.keys(k).map(D=>({name:D,zones:k[D]}))}),h=(p,S)=>{var k,D,M,I;switch(p){case"utc":return{name:"Coordinated Universal Time",ianaName:"UTC",zone:p,countries:[],abbreviation:"UTC, GMT",offsetInMins:0};case"":{const T=(0,f.Z)(),K=(k=T==="browser"||T==="utc"?h(T,S):o(T,S))!=null?k:{};return _(w({countries:(D=u[T])!=null?D:[],abbreviation:"",offsetInMins:0},K),{ianaName:K.ianaName,name:"Default",zone:p})}case"browser":{const T=l().tz.guess(!0),j=(M=o(T,S))!=null?M:{};return _(w({countries:(I=u[T])!=null?I:[],abbreviation:"Your local time",offsetInMins:new Date().getTimezoneOffset()},j),{name:"Browser Time",ianaName:j.ianaName,zone:p})}default:return}},s=p=>/^(\+|\-).+/.test(p)?"":p,o=(p,S)=>{var k;const D=l().tz.zone(p);if(!!D)return{name:p,ianaName:D.name,zone:p,countries:(k=u[p])!=null?k:[],abbreviation:s(D.abbr(S)),offsetInMins:D.utcOffset(S)}},r={AF:"Afghanistan",AX:"Aland Islands",AL:"Albania",DZ:"Algeria",AS:"American Samoa",AD:"Andorra",AO:"Angola",AI:"Anguilla",AQ:"Antarctica",AG:"Antigua And Barbuda",AR:"Argentina",AM:"Armenia",AW:"Aruba",AU:"Australia",AT:"Austria",AZ:"Azerbaijan",BS:"Bahamas",BH:"Bahrain",BD:"Bangladesh",BB:"Barbados",BY:"Belarus",BE:"Belgium",BZ:"Belize",BJ:"Benin",BM:"Bermuda",BT:"Bhutan",BO:"Bolivia",BA:"Bosnia And Herzegovina",BW:"Botswana",BV:"Bouvet Island",BR:"Brazil",IO:"British Indian Ocean Territory",BN:"Brunei Darussalam",BG:"Bulgaria",BF:"Burkina Faso",BI:"Burundi",KH:"Cambodia",CM:"Cameroon",CA:"Canada",CV:"Cape Verde",KY:"Cayman Islands",CF:"Central African Republic",TD:"Chad",CL:"Chile",CN:"China",CX:"Christmas Island",CC:"Cocos (Keeling) Islands",CO:"Colombia",KM:"Comoros",CG:"Congo",CD:"Congo, Democratic Republic",CK:"Cook Islands",CR:"Costa Rica",CI:"Cote D'Ivoire",HR:"Croatia",CU:"Cuba",CY:"Cyprus",CZ:"Czech Republic",DK:"Denmark",DJ:"Djibouti",DM:"Dominica",DO:"Dominican Republic",EC:"Ecuador",EG:"Egypt",SV:"El Salvador",GQ:"Equatorial Guinea",ER:"Eritrea",EE:"Estonia",ET:"Ethiopia",FK:"Falkland Islands (Malvinas)",FO:"Faroe Islands",FJ:"Fiji",FI:"Finland",FR:"France",GF:"French Guiana",PF:"French Polynesia",TF:"French Southern Territories",GA:"Gabon",GM:"Gambia",GE:"Georgia",DE:"Germany",GH:"Ghana",GI:"Gibraltar",GR:"Greece",GL:"Greenland",GD:"Grenada",GP:"Guadeloupe",GU:"Guam",GT:"Guatemala",GG:"Guernsey",GN:"Guinea",GW:"Guinea-Bissau",GY:"Guyana",HT:"Haiti",HM:"Heard Island & Mcdonald Islands",VA:"Holy See (Vatican City State)",HN:"Honduras",HK:"Hong Kong",HU:"Hungary",IS:"Iceland",IN:"India",ID:"Indonesia",IR:"Iran (Islamic Republic Of)",IQ:"Iraq",IE:"Ireland",IM:"Isle Of Man",IL:"Israel",IT:"Italy",JM:"Jamaica",JP:"Japan",JE:"Jersey",JO:"Jordan",KZ:"Kazakhstan",KE:"Kenya",KI:"Kiribati",KR:"Korea",KW:"Kuwait",KG:"Kyrgyzstan",LA:"Lao People's Democratic Republic",LV:"Latvia",LB:"Lebanon",LS:"Lesotho",LR:"Liberia",LY:"Libyan Arab Jamahiriya",LI:"Liechtenstein",LT:"Lithuania",LU:"Luxembourg",MO:"Macao",MK:"Macedonia",MG:"Madagascar",MW:"Malawi",MY:"Malaysia",MV:"Maldives",ML:"Mali",MT:"Malta",MH:"Marshall Islands",MQ:"Martinique",MR:"Mauritania",MU:"Mauritius",YT:"Mayotte",MX:"Mexico",FM:"Micronesia (Federated States Of)",MD:"Moldova",MC:"Monaco",MN:"Mongolia",ME:"Montenegro",MS:"Montserrat",MA:"Morocco",MZ:"Mozambique",MM:"Myanmar",NA:"Namibia",NR:"Nauru",NP:"Nepal",NL:"Netherlands",AN:"Netherlands Antilles",NC:"New Caledonia",NZ:"New Zealand",NI:"Nicaragua",NE:"Niger",NG:"Nigeria",NU:"Niue",NF:"Norfolk Island",MP:"Northern Mariana Islands",NO:"Norway",OM:"Oman",PK:"Pakistan",PW:"Palau",PS:"Palestine, State of",PA:"Panama",PG:"Papua New Guinea",PY:"Paraguay",PE:"Peru",PH:"Philippines",PN:"Pitcairn",PL:"Poland",PT:"Portugal",PR:"Puerto Rico",QA:"Qatar",RE:"Reunion",RO:"Romania",RU:"Russian Federation",RW:"Rwanda",BL:"Saint Barthelemy",SH:"Saint Helena",KN:"Saint Kitts And Nevis",LC:"Saint Lucia",MF:"Saint Martin",PM:"Saint Pierre And Miquelon",VC:"Saint Vincent And Grenadines",WS:"Samoa",SM:"San Marino",ST:"Sao Tome And Principe",SA:"Saudi Arabia",SN:"Senegal",RS:"Serbia",SC:"Seychelles",SL:"Sierra Leone",SG:"Singapore",SK:"Slovakia",SI:"Slovenia",SB:"Solomon Islands",SO:"Somalia",ZA:"South Africa",GS:"South Georgia And Sandwich Isl.",ES:"Spain",LK:"Sri Lanka",SD:"Sudan",SR:"Suriname",SJ:"Svalbard And Jan Mayen",SZ:"Swaziland",SE:"Sweden",CH:"Switzerland",SY:"Syrian Arab Republic",TW:"Taiwan",TJ:"Tajikistan",TZ:"Tanzania",TH:"Thailand",TL:"Timor-Leste",TG:"Togo",TK:"Tokelau",TO:"Tonga",TT:"Trinidad And Tobago",TN:"Tunisia",TR:"Turkey",TM:"Turkmenistan",TC:"Turks And Caicos Islands",TV:"Tuvalu",UG:"Uganda",UA:"Ukraine",AE:"United Arab Emirates",GB:"United Kingdom",US:"United States",UM:"United States Outlying Islands",UY:"Uruguay",UZ:"Uzbekistan",VU:"Vanuatu",VE:"Venezuela",VN:"Viet Nam",VG:"Virgin Islands, British",VI:"Virgin Islands, U.S.",WF:"Wallis And Futuna",EH:"Western Sahara",YE:"Yemen",ZM:"Zambia",ZW:"Zimbabwe"},u=(()=>l().tz.countries().reduce((p,S)=>l().tz.zonesForCountry(S).reduce((D,M)=>{D[M]||(D[M]=[]);const I=r[S];return I&&D[M].push({code:S,name:I}),D},p),{}))()},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/events/common.ts":function(se,V,e){"use strict";e.d(V,{es:function(){return n},xH:function(){return a}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/events/types.ts");class n extends t.R{}n.type="data-hover";class a extends t.m{}a.type="data-hover-clear";class l extends t.R{}l.type="data-select";class f extends t.R{}f.type="annotation-event";class x extends t.R{}x.type="dashboard-loaded"},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/events/types.ts":function(se,V,e){"use strict";e.d(V,{R:function(){return n},m:function(){return t}});class t{constructor(){this.type=this.__proto__.constructor.type}}class n extends t{constructor(l){super(),this.payload=l}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/displayProcessor.ts":function(se,V,e){"use strict";e.d(V,{U_:function(){return S}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/parser.ts"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts");function f(T){return typeof T=="number"?T:T===""||T===null||T===void 0||Array.isArray(T)?NaN:typeof T=="boolean"?T?1:0:(0,t.toNumber)(T)}var x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/string.ts"),d=(T=>(T.ValueToText="value",T.RangeToText="range",T.RegexToText="regex",T.SpecialValue="special",T))(d||{}),i=(T=>(T.True="true",T.False="false",T.Null="null",T.NaN="nan",T.NullAndNaN="null+nan",T.Empty="empty",T))(i||{}),c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(T,j,K)=>j in T?c(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,b=(T,j)=>{for(var K in j||(j={}))w.call(j,K)&&C(T,K,j[K]);if(m)for(var K of m(j))_.call(j,K)&&C(T,K,j[K]);return T},g=(T,j)=>E(T,O(j));function v(T,j){for(const K of T)switch(K.type){case d.ValueToText:if(j==null)continue;const F=K.options[j];if(F)return F;break;case d.RangeToText:if(j==null)continue;const $=parseFloat(j);if(isNaN($)||!isNaN(K.options.from)&&$<K.options.from||!isNaN(K.options.to)&&$>K.options.to)continue;return K.options.result;case d.RegexToText:if(j==null||typeof j!="string")continue;const H=(0,x.jO)(K.options.pattern);if(j.match(H)){const W=b({},K.options.result);return W.text!=null&&(W.text=j.replace(H,K.options.result.text||"")),W}case d.SpecialValue:switch(K.options.match){case i.Null:{if(j==null)return K.options.result;break}case i[NaN]:{if(isNaN(j))return K.options.result;break}case i.NullAndNaN:{if(isNaN(j)||j==null)return K.options.result;break}case i.True:{if(j===!0||j==="true")return K.options.result;break}case i.False:{if(j===!1||j==="false")return K.options.result;break}case i.Empty:{if(j==="")return K.options.result;break}}}return null}function y(T){return(typeof T=="number"||typeof T=="string"&&T.trim()!=="")&&!isNaN(T)}var h=(T=>(T[T.ValueToText=1]="ValueToText",T[T.RangeToText=2]="RangeToText",T))(h||{});function s(T,j){var K,F,$,R;const U=[];let H=T.mappingType;if(T.mappingType||(T.valueMaps&&T.valueMaps.length?H=1:T.rangeMaps&&T.rangeMaps.length&&(H=2)),H===1)for(let W=0;W<T.valueMaps.length;W++){const oe=T.valueMaps[W];U.push(o(g(b({},oe),{id:W,type:MappingType.ValueToText}),((F=(K=T.fieldConfig)==null?void 0:K.defaults)==null?void 0:F.thresholds)||j))}else if(H===2)for(let W=0;W<T.rangeMaps.length;W++){const oe=T.rangeMaps[W];U.push(o(g(b({},oe),{id:W,type:MappingType.RangeToText}),((R=($=T.fieldConfig)==null?void 0:$.defaults)==null?void 0:R.thresholds)||j))}return U}function o(T,j){const K={type:MappingType.ValueToText,options:{}},F=[];let $;const R=parseFloat(T.text);if(j&&!isNaN(R)){const U=getActiveThreshold(R,j.steps);U&&U.color&&($=U.color)}switch(T.type){case 1:case MappingType.ValueToText:T.value!=null&&(T.value==="null"?F.push({type:MappingType.SpecialValue,options:{match:SpecialValueMatch.Null,result:{text:T.text,color:$}}}):K.options[String(T.value)]={text:T.text,color:$});break;case 2:case MappingType.RangeToText:T.from==="null"||T.to==="null"?F.push({type:MappingType.SpecialValue,options:{match:SpecialValueMatch.Null,result:{text:T.text,color:$}}}):F.push({type:MappingType.RangeToText,options:{from:+T.from,to:+T.to,result:{text:T.text,color:$}}});break}return Object.keys(K.options).length>0&&F.unshift(K),F[0]}var r=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),u=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/scale.ts");const p={dateTimeAsIso:!0,dateTimeAsIsoNoDateIfToday:!0,dateTimeAsUS:!0,dateTimeAsUSNoDateIfToday:!0,dateTimeAsLocal:!0,dateTimeAsLocalNoDateIfToday:!0,dateTimeFromNow:!0};function S(T){var j,K;if(!T||(0,t.isEmpty)(T)||!T.field)return k;const F=T.field,$=(j=F.config)!=null?j:{};let R=$.unit,U=R&&(p[R]||R.startsWith("time:")),H=!1;if(F.type===l.fS.time&&!U){if(R="dateTimeAsSystem",U=!0,F.values&&F.values.length>1){let ve=F.values.get(0),re=F.values.get(F.values.length-1);typeof ve=="string"?(ve=(0,n.J)(ve).unix(),re=(0,n.J)(re).unix()):(ve/=1e3,re/=1e3),H=Math.abs(re-ve)<60}}else if(F.type===l.fS.boolean)(0,r.br)(R)||(R="bool");else if(!R&&F.type===l.fS.string)R="string";else if(F.type===l.fS.enum)return D(T.theme,(K=$.type)==null?void 0:K.enum);const W=R==null?void 0:R.startsWith("currency"),oe=(0,r.br)(R),Q=F.type===l.fS.number,ae=!U&&!W&&!oe&&!(R==="locale")&&Q&&$.decimals==null,q=(0,r.Cf)(R||"none"),Y=(0,u.NI)(F,T.theme);return(ve,re)=>{const{mappings:je}=$,me=R==="string";U&&typeof ve=="string"&&(ve=(0,a.zh)(ve).valueOf());let ne=me?NaN:f(ve),Z,te,Pe,he,ie,Ce;if(je&&je.length>0){const we=v(je,ve);we&&(we.text!=null&&(Z=we.text),we.color!=null&&(he=T.theme.visualization.getColorByName(we.color)),we.icon!=null&&(ie=we.icon))}if(!Number.isNaN(ne)){if(Z==null&&!(0,t.isBoolean)(ve)){let we;ae&&re!=null?(we=q(ne,re,null,T.timeZone,H),we.text=+we.text+""):we=q(ne,$.decimals,null,T.timeZone,H),Z=we.text,Pe=we.suffix,te=we.prefix}if(he==null){const we=Y(ne);he=we.color,Ce=we.percent}}if(Z==null&&(0,t.isArray)(ve)&&(Z=(0,t.join)(ve,", ")),Z==null&&(Z=(0,t.toString)(ve),Z||($.noValue?Z=$.noValue:Z="")),!he){const we=Y(-1/0);he=we.color,Ce=we.percent}const Le={text:Z,numeric:ne,prefix:te,suffix:Pe,color:he};return ie!=null&&(Le.icon=ie),Ce!=null&&(Le.percent=Ce),Le}}function k(T){return{text:(0,t.toString)(T),numeric:f(T)}}function D(T,j){var K,F;const $={text:(K=j==null?void 0:j.text)!=null?K:[],color:(F=j==null?void 0:j.color)!=null?F:[]};return $.color=$.color.map(R=>T.visualization.getColorByName(R)),R=>{if(R==null)return{text:"",numeric:NaN};const U=+R;let H=$.text[U];H==null&&(H=`${R}`);let W=$.color[U];if(W==null){const{palette:oe}=T.visualization;W=oe[U%oe.length],$.color[U]=W}return{text:H,numeric:U,color:W}}}function M(){return T=>({text:getFieldTypeFromValue(T)==="other"?`${JSON.stringify(T,I())}`:`${T}`,numeric:null})}const I=()=>{const T=new WeakSet;return(j,K)=>{if(typeof K=="object"&&K!==null){if(T.has(K))return;T.add(K)}return K}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/fieldColor.ts":function(se,V,e){"use strict";e.d(V,{QY:function(){return i},WO:function(){return f},fD:function(){return d}});var t=e("../../../yarn/cache/d3-interpolate-npm-3.0.1-77ddca7977-a42ba314e2.zip/node_modules/d3-interpolate/src/rgb.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/fieldColor.ts"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/Registry.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/thresholds.ts");const f=new a.B(()=>[{id:n.S.Fixed,name:"Single color",description:"Set a specific color",getCalculator:E},{id:n.S.Thresholds,name:"From thresholds",isByValue:!0,description:"Derive colors from thresholds",getCalculator:(O,m)=>(w,_,C)=>{const b=C!=null?C:l.yM;return m.visualization.getColorByName(b.color)}},new x({id:n.S.PaletteClassic,name:"Classic palette",isContinuous:!1,isByValue:!1,getColors:O=>O.visualization.palette}),new x({id:n.S.ContinuousGrYlRd,name:"Green-Yellow-Red",isContinuous:!0,isByValue:!0,getColors:O=>["green","yellow","red"]}),new x({id:n.S.ContinuousRdYlGr,name:"Red-Yellow-Green",isContinuous:!0,isByValue:!0,getColors:O=>["red","yellow","green"]}),new x({id:n.S.ContinuousBlYlRd,name:"Blue-Yellow-Red",isContinuous:!0,isByValue:!0,getColors:O=>["dark-blue","super-light-yellow","dark-red"]}),new x({id:n.S.ContinuousYlRd,name:"Yellow-Red",isContinuous:!0,isByValue:!0,getColors:O=>["super-light-yellow","dark-red"]}),new x({id:n.S.ContinuousBlPu,name:"Blue-Purple",isContinuous:!0,isByValue:!0,getColors:O=>["blue","purple"]}),new x({id:n.S.ContinuousYlBl,name:"Yellow-Blue",isContinuous:!0,isByValue:!0,getColors:O=>["super-light-yellow","dark-blue"]}),new x({id:n.S.ContinuousBlues,name:"Blues",isContinuous:!0,isByValue:!0,getColors:O=>["panel-bg","dark-blue"]}),new x({id:n.S.ContinuousReds,name:"Reds",isContinuous:!0,isByValue:!0,getColors:O=>["panel-bg","dark-red"]}),new x({id:n.S.ContinuousGreens,name:"Greens",isContinuous:!0,isByValue:!0,getColors:O=>["panel-bg","dark-green"]}),new x({id:n.S.ContinuousPurples,name:"Purples",isContinuous:!0,isByValue:!0,getColors:O=>["panel-bg","dark-purple"]})]);class x{constructor(m){this.id=m.id,this.name=m.name,this.description=m.description,this.getNamedColors=m.getColors,this.isContinuous=m.isContinuous,this.isByValue=m.isByValue}getColors(m){return this.getNamedColors?this.colorCache&&this.colorCacheTheme===m?this.colorCache:(this.colorCache=this.getNamedColors(m).map(m.visualization.getColorByName),this.colorCacheTheme=m,this.colorCache):[]}getInterpolator(){return this.interpolator||(this.interpolator=(0,t.hD)(this.colorCache)),this.interpolator}getCalculator(m,w){const _=this.getColors(w);return this.isByValue?this.isContinuous?(C,b,g)=>this.getInterpolator()(b):(C,b,g)=>_[b*(_.length-1)]:(C,b,g)=>{var v,y;const h=(y=(v=m.state)==null?void 0:v.seriesIndex)!=null?y:0;return _[h%_.length]}}}function d(O){var m,w;return f.get((w=(m=O.config.color)==null?void 0:m.mode)!=null?w:n.S.Thresholds)}function i(O){return f.get(O!=null?O:n.S.Thresholds)}function c(O,m){var w,_,C;const b=d(O);if(!b.isByValue)return{color:b.getCalculator(O,m)(0,0),threshold:fallBackTreshold,percent:1};const g=getScaleCalculator(O,m),v=(_=(w=O.config.color)==null?void 0:w.seriesBy)!=null?_:"last",h=(C=reduceField({field:O,reducers:[v]})[v])!=null?C:0;return g(h)}function E(O,m){return()=>{var w,_;return m.visualization.getColorByName((_=(w=O.config.color)==null?void 0:w.fixedColor)!=null?_:n.R)}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/fieldState.ts":function(se,V,e){"use strict";e.d(V,{C:function(){return l},n:function(){return a}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/labels.ts");function a(i,c){if(i.name)return i.name;const E=[];for(const O of i.fields)O.labels&&Object.keys(O.labels).length>0&&E.push(O);return E.length===1?(0,n.aA)(E[0].labels):c===void 0?i.fields.filter(O=>O.type!==t.fS.time).map(O=>l(O,i)).join(", "):i.refId?`Series (${i.refId})`:`Series (${c})`}function l(i,c,E){var O,m;const w=(O=i.state)==null?void 0:O.displayName,_=Boolean(E&&E.length>1);if(w&&_===((m=i.state)==null?void 0:m.multipleFrames))return w;const C=f(i,c,E);return i.state=i.state||{},i.state.displayName=C,i.state.multipleFrames=_,C}function f(i,c,E){var O,m,w;const _=((O=i.config)==null?void 0:O.displayName)&&((m=i.config)==null?void 0:m.displayName.length);let C=_?i.config.displayName:i.name;if(_)return C;if(c&&((w=i.config)==null?void 0:w.displayNameFromDS))return i.config.displayNameFromDS;if(i.type===t.fS.time&&!i.labels)return C!=null?C:t.Ls;let b=[],g=!1;if(E&&E.length>1){for(let h=1;h<E.length;h++)if(E[h].name!==E[h-1].name){g=!0;break}}let v=!1,y=!1;if(g&&(c==null?void 0:c.name)&&(b.push(c.name),v=!0),i.name&&i.name!==t.M5&&b.push(i.name),i.labels&&c){let h=d(E!=null?E:[c]);if(h)i.labels[h]&&(b.push(i.labels[h]),y=!0);else{let s=(0,n.aA)(i.labels);s&&(b.push(s),y=!0)}}return c&&!v&&!y&&i.name===t.M5&&c.name&&c.name.length>0&&(b.push(c.name),v=!0),b.length?C=b.join(" "):i.name?C=i.name:C=t.M5,C===i.name&&(C=x(i,c)),C}function x(i,c){let E=0,O=!1;if(c)for(let m=0;m<c.fields.length;m++){const w=c.fields[m];if(i===w){if(O=!0,E>0){E++;break}}else if(i.name===w.name&&(E++,O))break}return E?`${i.name} ${E}`:i.name}function d(i){let c=null;for(let E=0;E<i.length;E++){const O=i[E];for(const m of O.fields)if(!!m.labels){for(const w in m.labels)if(c===null)c=w;else if(w!==c)return null}}return c}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/scale.ts":function(se,V,e){"use strict";e.d(V,{NI:function(){return w},dz:function(){return C},xD:function(){return b}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/fieldReducer.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/fieldColor.ts"),x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/thresholds.ts"),d=Object.defineProperty,i=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable,O=(g,v,y)=>v in g?d(g,v,{enumerable:!0,configurable:!0,writable:!0,value:y}):g[v]=y,m=(g,v)=>{for(var y in v||(v={}))c.call(v,y)&&O(g,y,v[y]);if(i)for(var y of i(v))E.call(v,y)&&O(g,y,v[y]);return g};function w(g,v){var y,h;if(g.type===l.fS.boolean)return _(g,v);const o=(0,f.fD)(g).getCalculator(g,v),r=(h=(y=g.state)==null?void 0:y.range)!=null?h:C(g);return u=>{let p=0;u!==-1/0&&(p=(u-r.min)/r.delta,Number.isNaN(p)&&(p=0));const S=(0,x.pD)(g,u,p);return{percent:p,threshold:S,color:o(u,p,S)}}}function _(g,v){const y={color:v.visualization.getColorByName("green"),percent:1,threshold:void 0},h={color:v.visualization.getColorByName("red"),percent:0,threshold:void 0},s=(0,f.fD)(g);if(s.isContinuous&&s.getColors){const o=s.getColors(v);y.color=o[o.length-1],h.color=o[0]}return o=>Boolean(o)?y:h}function C(g){if(g.type!==l.fS.number)return{min:0,max:100,delta:100};let v=g.config.min,y=g.config.max;if(!(0,t.isNumber)(v)||!(0,t.isNumber)(y))if(g.values&&g.values.length){const h=(0,a.Kx)({field:g,reducers:[a.gz.min,a.gz.max]});(0,t.isNumber)(v)||(v=h[a.gz.min]),(0,t.isNumber)(y)||(y=h[a.gz.max])}else v=0,y=100;return{min:v,max:y,delta:y-v}}function b(g,v){var y;const{config:h}=g;let{min:s,max:o}=h;return(0,t.isNumber)(s)&&(0,t.isNumber)(o)?h:v||!((y=g.state)!=null&&y.range)?m(m({},h),C(g)):m(m({},h),g.state.range)}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/thresholds.ts":function(se,V,e){"use strict";e.d(V,{pD:function(){return f},yM:function(){return a}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/fieldColor.ts"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/thresholds.ts");const a={value:0,color:t.R};function l(d,i){if(!i||i.length===0)return a;let c=i[0];for(const E of i)if(d>=E.value)c=E;else break;return c}function f(d,i,c){const{thresholds:E}=d.config;return(E==null?void 0:E.mode)===n.H.Percentage?l(c*100,E==null?void 0:E.steps):l(i,E==null?void 0:E.steps)}function x(d){return d.sort((i,c)=>i.value-c.value)}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/index.ts":function(se,V,e){"use strict";e.d(V,{QX:function(){return n}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/sanitize.ts");const n={escapeHtml:t.Xv,hasAnsiCodes:t.oT,sanitize:t.Nw,sanitizeTextPanelContent:t.he,sanitizeUrl:t.Nm,sanitizeSVGContent:t.Is}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/sanitize.ts":function(se,V,e){"use strict";e.d(V,{Is:function(){return y},Nm:function(){return h},Nw:function(){return g},Xv:function(){return o},he:function(){return v},oT:function(){return s}});var t=e("../../../yarn/cache/@braintree-sanitize-url-npm-6.0.2-a8e98c2fde-6a9dfd4081.zip/node_modules/@braintree/sanitize-url/dist/index.js"),n=e("../../../yarn/cache/dompurify-npm-2.4.5-ce1b7c62a7-d6d3c3b320.zip/node_modules/dompurify/dist/purify.js"),a=e.n(n),l=e("../../../yarn/cache/xss-npm-1.0.14-eb6e57872e-77c6a60a5f.zip/node_modules/xss/lib/index.js"),f=e.n(l),x=Object.defineProperty,d=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(r,u,p)=>u in r?x(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,w=(r,u)=>{for(var p in u||(u={}))E.call(u,p)&&m(r,p,u[p]);if(c)for(var p of c(u))O.call(u,p)&&m(r,p,u[p]);return r},_=(r,u)=>d(r,i(u));const C=Object.keys(l.whiteList).reduce((r,u)=>{var p;return r[u]=(p=l.whiteList[u])==null?void 0:p.concat(["class","style"]),r},{}),b=new l.FilterXSS({whiteList:C,css:{whiteList:_(w({},l.getDefaultCSSWhiteList()),{"flex-direction":!0,"flex-wrap":!0,"flex-basis":!0,"flex-grow":!0,"flex-shrink":!0,"flex-flow":!0,gap:!0,order:!0,"justify-content":!0,"justify-items":!0,"justify-self":!0,"align-items":!0,"align-content":!0,"align-self":!0})}});function g(r){try{return a().sanitize(r,{USE_PROFILES:{html:!0},FORBID_TAGS:["form","input"]})}catch(u){return console.error("String could not be sanitized",r),o(r)}}function v(r){try{return b.process(r)}catch(u){return console.error("String could not be sanitized",r),"Text string could not be sanitized"}}function y(r){return a().sanitize(r,{USE_PROFILES:{svg:!0,svgFilters:!0}})}function h(r){return(0,t.N)(r)}function s(r){return/\u001b\[\d{1,2}m/.test(r)}function o(r){return String(r).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/'/g,"&#39;").replace(/"/g,"&quot;")}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/string.ts":function(se,V,e){"use strict";e.d(V,{GE:function(){return d},jO:function(){return E},x6:function(){return i}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t);const l="([\\"+["(","[","{","}","]",")","\\","|","*","+","-",".","?","<",">","#","&","^","$"].join("\\")+"])",f=new RegExp(l,"g"),x=new RegExp("(\\\\)"+l,"g");function d(g){return g&&g.replace(f,"\\$1")}function i(g){return g&&g.replace(x,"$2")}function c(g){return g?g[0]==="/":!1}function E(g){if(!c(g))return new RegExp(`^${g}$`);const v=g.match(new RegExp("^/(.*?)/(g?i?m?y?s?)$"));if(!v)throw new Error(`'${g}' is not a valid regular expression.`);return new RegExp(v[1],v[2])}function O(g){if(!g)return 0;const v=parseInt(g,10),y=g.slice(String(v).length),h=1e3,s=h*60,o=s*60,r=o*24;switch(y){case"s":return v*h;case"m":return v*s;case"h":return v*o;case"d":return v*r;default:if(!y)return isNaN(v)?0:v;throw new Error("Not supported unit: "+y)}}function m(g){return g!=null&&Number.isFinite(g)?g.toString():""}function w(g){if(!g)return;const v=parseInt(g,10);return isNaN(v)?void 0:v}function _(g){if(!g)return;const v=parseFloat(g);return isNaN(v)?void 0:v}function C(g){const v=camelCase(g);return v.charAt(0).toUpperCase()+v.substring(1)}function b(g){return g.replace(/[\\^$*+?.()|[\]{}\/]/g,"\\$&")}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts":function(se,V,e){"use strict";e.d(V,{$n:function(){return g},Fq:function(){return C},_4:function(){return _},_j:function(){return b},cG:function(){return i},k$:function(){return d},mi:function(){return m}});var t=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js"),n=Math.pow;function a(v,y=0,h=1){return Math.min(Math.max(y,v),h)}function l(v){v=v.slice(1);const y=new RegExp(`.{1,${v.length>=6?2:1}}`,"g");let h=v.match(y);return h&&h[0].length===1&&(h=h.map(s=>s+s)),h?`rgb${h.length===4?"a":""}(${h.map((s,o)=>o<3?parseInt(s,16):Math.round(parseInt(s,16)/255*1e3)/1e3).join(", ")})`:""}function f(v){const y=v.toString(16);return y.length===1?`0${y}`:y}function x(v){if(v.indexOf("#")===0)return v;const{values:y}=E(v);return`#${y.map(h=>f(h)).join("")}`}function d(v){if(v[0]==="#")return v;const y=(0,t.Z)(v);return y.getAlpha()===1?y.toHexString():y.toHex8String()}function i(v){return v.startsWith("rgb")?v:(0,t.Z)(v).toRgbString()}function c(v){const y=E(v),{values:h}=y,s=h[0],o=h[1]/100,r=h[2]/100,u=o*Math.min(r,1-r),p=(D,M=(D+s/30)%12)=>r-u*Math.max(Math.min(M-3,9-M,1),-1);let S="rgb";const k=[Math.round(p(0)*255),Math.round(p(8)*255),Math.round(p(4)*255)];return y.type==="hsla"&&(S+="a",k.push(h[3])),O({type:S,values:k})}function E(v){if(typeof v!="string")return v;if(v.charAt(0)==="#")return E(l(v));const y=v.indexOf("("),h=v.substring(0,y);if(["rgb","rgba","hsl","hsla","color"].indexOf(h)===-1)throw new Error(`Unsupported '${v}' color. The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()`);let s=v.substring(y+1,v.length-1),o;if(h==="color"){if(s=s.split(" "),o=s.shift(),s.length===4&&s[3].charAt(0)==="/"&&(s[3]=s[3].slice(1)),["srgb","display-p3","a98-rgb","prophoto-rgb","rec-2020"].indexOf(o)===-1)throw new Error(`Unsupported ${o} color space. The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.`)}else s=s.split(",");return s=s.map(r=>parseFloat(r)),{type:h,values:s,colorSpace:o}}function O(v){const{type:y,colorSpace:h}=v;let s=v.values;return y.indexOf("rgb")!==-1?s=s.map((o,r)=>r<3?parseInt(o,10):o):y.indexOf("hsl")!==-1&&(s[1]=`${s[1]}%`,s[2]=`${s[2]}%`),y.indexOf("color")!==-1?s=`${h} ${s.join(" ")}`:s=`${s.join(", ")}`,`${y}(${s})`}function m(v,y,h){const s=w(v),o=w(y,h);return(Math.max(s,o)+.05)/(Math.min(s,o)+.05)}function w(v,y){const h=E(v);let s=h.type==="hsl"?E(c(v)).values:h.values;if(y&&h.type==="rgba"){const r=E(y),u=s[3];s[0]=s[0]*u+r.values[0]*(1-u),s[1]=s[1]*u+r.values[1]*(1-u),s[2]=s[2]*u+r.values[2]*(1-u)}const o=s.map(r=>(h.type!=="color"&&(r/=255),r<=.03928?r/12.92:n((r+.055)/1.055,2.4)));return Number((.2126*o[0]+.7152*o[1]+.0722*o[2]).toFixed(3))}function _(v,y=.15){return w(v)>.5?b(v,y):g(v,y)}function C(v,y){if(v==="")return"#000000";if(y=a(y),v[0]==="#"){if(v.length===9)v=v.substring(0,7);else if(v.length<=5){let s="#";for(let o=1;o<4;o++)s+=v[o]+v[o];v=s}return v+Math.round(y*255).toString(16).padStart(2,"0")}else{if(v[3]==="(")return v.replace(")",`, ${y})`);if(v[4]==="(")return v.substring(0,v.lastIndexOf(","))+`, ${y})`}const h=E(v);return h.type==="color"?h.values[3]=`/${y}`:h.values[3]=y,O(h)}function b(v,y){const h=E(v);if(y=a(y),h.type.indexOf("hsl")!==-1)h.values[2]*=1-y;else if(h.type.indexOf("rgb")!==-1||h.type.indexOf("color")!==-1)for(let s=0;s<3;s+=1)h.values[s]*=1-y;return O(h)}function g(v,y){const h=E(v);if(y=a(y),h.type.indexOf("hsl")!==-1)h.values[2]+=(100-h.values[2])*y;else if(h.type.indexOf("rgb")!==-1)for(let s=0;s<3;s+=1)h.values[s]+=(255-h.values[s])*y;else if(h.type.indexOf("color")!==-1)for(let s=0;s<3;s+=1)h.values[s]+=(1-h.values[s])*y;return O(h)}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/createTheme.ts":function(se,V,e){"use strict";e.d(V,{j:function(){return J}});function t(){const fe=["xs","sm","md","lg","xl","xxl"],xe="px",We={xs:0,sm:544,md:769,lg:992,xl:1200,xxl:1440};function Ue(it){return`@media (min-width:${typeof it=="number"?it:We[it]}${xe})`}function at(it){return`@media (max-width:${(typeof it=="number"?it:We[it])-5/100}${xe})`}return{values:We,up:Ue,down:at,keys:fe,unit:xe}}var n=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts");const l={white:"#FFFFFF",black:"#000000",gray25:"#2c3235",gray15:"#22252b",gray10:"#181b1f",gray05:"#111217",darkLayer0:"#18181A",darkLayer1:"#212124",darkLayer2:"#2a2a2f",darkBorder1:"#34343B",darkBorder2:"#64646B",gray90:"#F4F5F5",gray100:"#F4F5F5",gray80:"#D0D1D3",lightBorder1:"#E4E7E7",blueDarkMain:"#3D71D9",blueDarkText:"#6E9FFF",redDarkMain:"#D10E5C",redDarkText:"#FF5286",greenDarkMain:"#1A7F4B",greenDarkText:"#6CCF8E",orangeDarkMain:"#F5B73D",orangeDarkText:"#F8D06B",blueLightMain:"#3871DC",blueLightText:"#1F62E0",redLightMain:"#E0226E",redLightText:"#CF0E5B",greenLightMain:"#1B855E",greenLightText:"#0A764E",orangeLightMain:"#FAD34A",orangeLightText:"#8A6C00"};var f=Object.defineProperty,x=Object.defineProperties,d=Object.getOwnPropertyDescriptors,i=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable,O=(L,fe,xe)=>fe in L?f(L,fe,{enumerable:!0,configurable:!0,writable:!0,value:xe}):L[fe]=xe,m=(L,fe)=>{for(var xe in fe||(fe={}))c.call(fe,xe)&&O(L,xe,fe[xe]);if(i)for(var xe of i(fe))E.call(fe,xe)&&O(L,xe,fe[xe]);return L},w=(L,fe)=>x(L,d(fe)),_=(L,fe)=>{var xe={};for(var We in L)c.call(L,We)&&fe.indexOf(We)<0&&(xe[We]=L[We]);if(L!=null&&i)for(var We of i(L))fe.indexOf(We)<0&&E.call(L,We)&&(xe[We]=L[We]);return xe};class C{constructor(){this.mode="dark",this.whiteBase="204, 204, 220",this.border={weak:`rgba(${this.whiteBase}, 0.07)`,medium:`rgba(${this.whiteBase}, 0.15)`,strong:`rgba(${this.whiteBase}, 0.25)`},this.text={primary:`rgb(${this.whiteBase})`,secondary:`rgba(${this.whiteBase}, 0.65)`,disabled:`rgba(${this.whiteBase}, 0.6)`,link:l.blueDarkText,maxContrast:l.white},this.primary={main:l.blueDarkMain,text:l.blueDarkText,border:l.blueDarkText},this.secondary={main:`rgba(${this.whiteBase}, 0.16)`,shade:`rgba(${this.whiteBase}, 0.20)`,text:this.text.primary,contrastText:`rgb(${this.whiteBase})`,border:this.border.strong},this.info=this.primary,this.error={main:l.redDarkMain,text:l.redDarkText},this.success={main:l.greenDarkMain,text:l.greenDarkText},this.warning={main:l.orangeDarkMain,text:l.orangeDarkText},this.background={canvas:l.gray05,primary:l.gray10,secondary:l.gray15},this.action={hover:`rgba(${this.whiteBase}, 0.16)`,selected:`rgba(${this.whiteBase}, 0.12)`,focus:`rgba(${this.whiteBase}, 0.16)`,hoverOpacity:.08,disabledText:this.text.disabled,disabledBackground:`rgba(${this.whiteBase}, 0.04)`,disabledOpacity:.38},this.gradients={brandHorizontal:"linear-gradient(270deg, #F55F3E 0%, #FF8833 100%)",brandVertical:"linear-gradient(0.01deg, #F55F3E 0.01%, #FF8833 99.99%)"},this.contrastThreshold=3,this.hoverFactor=.03,this.tonalOffset=.15}}class b{constructor(){this.mode="light",this.blackBase="36, 41, 46",this.primary={main:l.blueLightMain,border:l.blueLightText,text:l.blueLightText},this.text={primary:`rgba(${this.blackBase}, 1)`,secondary:`rgba(${this.blackBase}, 0.75)`,disabled:`rgba(${this.blackBase}, 0.50)`,link:this.primary.text,maxContrast:l.black},this.border={weak:`rgba(${this.blackBase}, 0.12)`,medium:`rgba(${this.blackBase}, 0.30)`,strong:`rgba(${this.blackBase}, 0.40)`},this.secondary={main:`rgba(${this.blackBase}, 0.16)`,shade:`rgba(${this.blackBase}, 0.20)`,contrastText:`rgba(${this.blackBase},  1)`,text:this.text.primary,border:this.border.strong},this.info={main:l.blueLightMain,text:l.blueLightText},this.error={main:l.redLightMain,text:l.redLightText,border:l.redLightText},this.success={main:l.greenLightMain,text:l.greenLightText},this.warning={main:l.orangeLightMain,text:l.orangeLightText},this.background={canvas:l.gray90,primary:l.white,secondary:l.gray100},this.action={hover:`rgba(${this.blackBase}, 0.12)`,selected:`rgba(${this.blackBase}, 0.08)`,hoverOpacity:.08,focus:`rgba(${this.blackBase}, 0.12)`,disabledBackground:`rgba(${this.blackBase}, 0.04)`,disabledText:this.text.disabled,disabledOpacity:.38},this.gradients={brandHorizontal:"linear-gradient(90deg, #FF8833 0%, #F53E4C 100%)",brandVertical:"linear-gradient(0.01deg, #F53E4C -31.2%, #FF8833 113.07%)"},this.contrastThreshold=3,this.hoverFactor=.03,this.tonalOffset=.2}}function g(L){var fe;const xe=new C,We=new b,Ue=((fe=L.mode)!=null?fe:"dark")==="dark"?xe:We,at=L,{primary:it=Ue.primary,secondary:_t=Ue.secondary,info:wt=Ue.info,warning:ee=Ue.warning,success:_e=Ue.success,error:ge=Ue.error,tonalOffset:de=Ue.tonalOffset,hoverFactor:Ee=Ue.hoverFactor,contrastThreshold:ze=Ue.contrastThreshold}=at,le=_(at,["primary","secondary","info","warning","success","error","tonalOffset","hoverFactor","contrastThreshold"]);function ye(Be,Xe=ze){return(0,a.mi)(xe.text.maxContrast,Be,Ue.background.primary)>=Xe?xe.text.maxContrast:We.text.maxContrast}const Se=({color:Be,name:Xe})=>{if(Be=w(m({},Be),{name:Xe}),!Be.main)throw new Error(`Missing main color for ${Xe}`);return Be.text||(Be.text=Be.main),Be.border||(Be.border=Be.text),Be.shade||(Be.shade=Ue.mode==="light"?(0,a._j)(Be.main,de):(0,a.$n)(Be.main,de)),Be.transparent||(Be.transparent=Ue.mode==="light"?(0,a.Fq)(Be.main,.08):(0,a.Fq)(Be.main,.15)),Be.contrastText||(Be.contrastText=ye(Be.main)),Be};return(0,n.merge)(w(m({},Ue),{primary:Se({color:it,name:"primary"}),secondary:Se({color:_t,name:"secondary"}),info:Se({color:wt,name:"info"}),error:Se({color:ge,name:"error"}),success:Se({color:_e,name:"success"}),warning:Se({color:ee,name:"warning"}),getContrastText:ye,emphasize:(Be,Xe)=>(0,a._4)(Be,Xe!=null?Xe:Ee)}),le)}function v(L,fe){const xe={padding:1,headerHeight:4,background:L.background.primary,borderColor:L.border.weak,boxShadow:"none"},We={borderColor:L.border.medium,borderHover:L.border.strong,text:L.text.primary,background:L.mode==="dark"?L.background.canvas:L.background.primary};return{height:{sm:3,md:4,lg:6},input:We,panel:xe,dropdown:{background:We.background},tooltip:{background:L.background.secondary,text:L.text.primary},dashboard:{background:L.background.canvas,padding:1},overlay:{background:L.mode==="dark"?"rgba(63, 62, 62, 0.45)":"rgba(208, 209, 211, 0.24)"},sidemenu:{width:57},menuTabs:{height:41},textHighlight:{text:L.warning.contrastText,background:L.warning.main},horizontalDrawer:{defaultHeight:400}}}function y(L){return L.mode==="dark"?{z1:"0px 1px 2px rgba(24, 26, 27, 0.75)",z2:"0px 4px 8px rgba(24, 26, 27, 0.75)",z3:"0px 8px 24px rgb(1,4,9)"}:{z1:"0px 1px 2px rgba(24, 26, 27, 0.2)",z2:"0px 4px 8px rgba(24, 26, 27, 0.2)",z3:"0px 13px 20px 1px rgba(24, 26, 27, 0.18)"}}function h(L){var fe;const xe=(fe=L.borderRadius)!=null?fe:2;return{radius:{default:"2px",pill:"9999px",circle:"100%"},borderRadius:at=>`${(at!=null?at:1)*xe}px`}}function s(L={}){const{gridSize:fe=8}=L,xe=Ue=>typeof Ue=="string"?Ue:Ue*fe,We=(...Ue)=>(Ue.length===0&&(Ue[0]=1),Ue.map(at=>{const it=xe(at);return typeof it=="number"?`${it}px`:it}).join(" "));return We.gridSize=fe,We}var o=Math.pow;const r={easeInOut:"cubic-bezier(0.4, 0, 0.2, 1)",easeOut:"cubic-bezier(0.0, 0, 0.2, 1)",easeIn:"cubic-bezier(0.4, 0, 1, 1)",sharp:"cubic-bezier(0.4, 0, 0.6, 1)"},u={shortest:150,shorter:200,short:250,standard:300,complex:375,enteringScreen:225,leavingScreen:195};function p(L=["all"],fe={}){const{duration:xe=u.standard,easing:We=r.easeInOut,delay:Ue=0}=fe;return(Array.isArray(L)?L:[L]).map(at=>`${at} ${typeof xe=="string"?xe:k(xe)} ${We} ${typeof Ue=="string"?Ue:k(Ue)}`).join(",")}function S(L){if(!L)return 0;const fe=L/36;return Math.round((4+15*o(fe,.25)+fe/5)*10)}function k(L){return`${Math.round(L)}ms`}function D(){return{create:p,duration:u,easing:r,getAutoHeightDuration:S}}var M=Object.defineProperty,I=Object.getOwnPropertySymbols,T=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable,K=(L,fe,xe)=>fe in L?M(L,fe,{enumerable:!0,configurable:!0,writable:!0,value:xe}):L[fe]=xe,F=(L,fe)=>{for(var xe in fe||(fe={}))T.call(fe,xe)&&K(L,xe,fe[xe]);if(I)for(var xe of I(fe))j.call(fe,xe)&&K(L,xe,fe[xe]);return L};const $='"Inter", "Helvetica", "Arial", sans-serif',R="'Roboto Mono', monospace";function U(L,fe={}){const{fontFamily:xe=$,fontFamilyMonospace:We=R,fontSize:Ue=14,fontWeightLight:at=300,fontWeightRegular:it=400,fontWeightMedium:_t=500,fontWeightBold:wt=500,htmlFontSize:ee=14}=fe,_e=Ue/14,ge=le=>`${le/ee*_e}rem`,de=(le,ye,Se,Be,Xe)=>{if(Se%2!==0||ye%2!==0)throw new Error("Font size and line height should be integer multiples of 2 to prevent issues with alignment");return F(F({fontFamily:xe,fontWeight:le,fontSize:ge(ye),lineHeight:Se/ye},xe===$?{letterSpacing:`${H(Be/ye)}em`}:{}),Xe)},Ee={h1:de(it,28,32,-.25),h2:de(it,24,28,0),h3:de(it,22,24,0),h4:de(it,18,22,.25),h5:de(it,16,22,0),h6:de(_t,14,22,.15),body:de(it,Ue,22,.15),bodySmall:de(it,12,18,.15)};return F({htmlFontSize:ee,pxToRem:ge,fontFamily:xe,fontFamilyMonospace:We,fontSize:Ue,fontWeightLight:at,fontWeightRegular:it,fontWeightMedium:_t,fontWeightBold:wt,size:{base:"14px",xs:"10px",sm:"12px",md:"14px",lg:"18px"}},Ee)}function H(L){return Math.round(L*1e5)/1e5}var W=(L=>(L.Light="light",L.Dark="dark",L))(W||{}),oe=Object.defineProperty,Q=Object.defineProperties,P=Object.getOwnPropertyDescriptors,ae=Object.getOwnPropertySymbols,q=Object.prototype.hasOwnProperty,Y=Object.prototype.propertyIsEnumerable,ve=(L,fe,xe)=>fe in L?oe(L,fe,{enumerable:!0,configurable:!0,writable:!0,value:xe}):L[fe]=xe,re=(L,fe)=>{for(var xe in fe||(fe={}))q.call(fe,xe)&&ve(L,xe,fe[xe]);if(ae)for(var xe of ae(fe))Y.call(fe,xe)&&ve(L,xe,fe[xe]);return L},je=(L,fe)=>Q(L,P(fe));function me(L){const fe={name:"Grafana Default",typography:{fontFamily:{sansSerif:L.typography.fontFamily,monospace:L.typography.fontFamilyMonospace},size:{base:`${L.typography.fontSize}px`,xs:L.typography.size.xs,sm:L.typography.size.sm,md:L.typography.size.md,lg:L.typography.size.lg},heading:{h1:L.typography.h1.fontSize,h2:L.typography.h2.fontSize,h3:L.typography.h3.fontSize,h4:L.typography.h4.fontSize,h5:L.typography.h5.fontSize,h6:L.typography.h6.fontSize},weight:{light:L.typography.fontWeightLight,regular:L.typography.fontWeightRegular,semibold:L.typography.fontWeightMedium,bold:L.typography.fontWeightBold},lineHeight:{xs:L.typography.bodySmall.lineHeight,sm:L.typography.bodySmall.lineHeight,md:L.typography.body.lineHeight,lg:L.typography.h2.lineHeight},link:{decoration:"none",hoverDecoration:"none"}},breakpoints:{xs:`${L.breakpoints.values.xs}px`,sm:`${L.breakpoints.values.sm}px`,md:`${L.breakpoints.values.md}px`,lg:`${L.breakpoints.values.lg}px`,xl:`${L.breakpoints.values.xl}px`,xxl:`${L.breakpoints.values.xxl}px`},spacing:{base:L.spacing.gridSize,insetSquishMd:L.spacing(.5,1),d:L.spacing(2),xxs:L.spacing(.25),xs:L.spacing(.5),sm:L.spacing(1),md:L.spacing(2),lg:L.spacing(3),xl:L.spacing(4),gutter:L.spacing(4),formSpacingBase:L.spacing.gridSize,formMargin:`${L.spacing.gridSize*4}px`,formFieldsetMargin:`${L.spacing.gridSize*2}px`,formInputHeight:L.spacing.gridSize*4,formButtonHeight:L.spacing.gridSize*4,formInputPaddingHorizontal:`${L.spacing.gridSize}px`,formInputAffixPaddingHorizontal:`${L.spacing.gridSize/2}px`,formInputMargin:`${L.spacing.gridSize*2}px`,formLabelPadding:"0 0 0 2px",formLabelMargin:`0 0 ${L.spacing.gridSize/2+"px"} 0`,formValidationMessagePadding:"4px 8px",formValidationMessageMargin:"4px 0 0 0",inlineFormMargin:"4px"},border:{radius:{sm:L.shape.borderRadius(1),md:L.shape.borderRadius(2),lg:L.shape.borderRadius(3)},width:{sm:"1px"}},height:{sm:L.spacing.gridSize*L.components.height.sm,md:L.spacing.gridSize*L.components.height.md,lg:L.spacing.gridSize*L.components.height.lg},panelPadding:L.components.panel.padding*L.spacing.gridSize,panelHeaderHeight:L.spacing.gridSize*L.components.panel.headerHeight,zIndex:L.zIndex},xe=je(re({},ne),{black:"#000000",white:"#ffffff",dark1:"#141414",dark2:"#161719",dark3:"#1f1f20",dark4:"#212124",dark5:"#222426",dark6:"#262628",dark7:"#292a2d",dark8:"#2f2f32",dark9:"#343436",dark10:"#424345",gray1:"#555555",gray2:"#8e8e8e",gray3:"#b3b3b3",gray4:"#d8d9da",gray5:"#ececec",gray6:"#f4f5f8",gray7:"#fbfbfb",redBase:"#e02f44",redShade:"#c4162a",greenBase:"#299c46",greenShade:"#23843b",red:"#d44a3a",yellow:"#ecbb13",purple:"#9933cc",variable:"#32d1df",orange:"#eb7b18",orangeDark:"#ff780a"}),We={bg1:L.colors.background.primary,bg2:L.colors.background.secondary,bg3:L.colors.action.hover,dashboardBg:L.colors.background.canvas,bgBlue1:L.colors.primary.main,bgBlue2:L.colors.primary.shade},Ue={border1:L.colors.border.weak,border2:L.colors.border.medium,border3:L.colors.border.strong},at={textStrong:L.colors.text.maxContrast,textHeading:L.colors.text.primary,text:L.colors.text.primary,textSemiWeak:L.colors.text.secondary,textWeak:L.colors.text.secondary,textFaint:L.colors.text.disabled,textBlue:L.colors.primary.text},it={formLabel:L.colors.text.primary,formDescription:L.colors.text.secondary,formInputBg:L.components.input.background,formInputBgDisabled:L.colors.action.disabledBackground,formInputBorder:L.components.input.borderColor,formInputBorderHover:L.components.input.borderHover,formInputBorderActive:L.colors.primary.border,formInputBorderInvalid:L.colors.error.border,formInputPlaceholderText:L.colors.text.disabled,formInputText:L.components.input.text,formInputDisabledText:L.colors.action.disabledText,formFocusOutline:L.colors.primary.main,formValidationMessageText:L.colors.error.contrastText,formValidationMessageBg:L.colors.error.main};return je(re({},fe),{type:L.colors.mode==="dark"?W.Dark:W.Light,isDark:L.isDark,isLight:L.isLight,name:L.name,palette:je(re({},xe),{brandPrimary:xe.orange,brandSuccess:L.colors.success.main,brandWarning:L.colors.warning.main,brandDanger:L.colors.error.main,queryRed:L.colors.error.text,queryGreen:L.colors.success.text,queryPurple:"#fe85fc",queryOrange:xe.orange,online:L.colors.success.main,warn:L.colors.success.main,critical:L.colors.success.main}),colors:je(re(re(re(re({},We),Ue),it),at),{bodyBg:L.colors.background.canvas,panelBg:L.components.panel.background,panelBorder:L.components.panel.borderColor,pageHeaderBg:L.colors.background.canvas,pageHeaderBorder:L.colors.background.canvas,dropdownBg:it.formInputBg,dropdownShadow:xe.black,dropdownOptionHoverBg:We.bg2,link:L.colors.text.primary,linkDisabled:L.colors.text.disabled,linkHover:L.colors.text.maxContrast,linkExternal:L.colors.text.link}),shadows:{listItem:"none"},visualization:L.visualization})}const ne={gray98:"#f7f8fa",gray97:"#f1f5f9",gray95:"#e9edf2",gray90:"#dce1e6",gray85:"#c7d0d9",gray70:"#9fa7b3",gray60:"#7b8087",gray33:"#464c54",gray25:"#2c3235",gray15:"#202226",gray10:"#141619",gray05:"#0b0c0e",blue95:"#5794f2",blue85:"#33a2e5",blue80:"#3274d9",blue77:"#1f60c4",red88:"#e02f44"};var Z=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/fieldColor.ts");function te(L){const fe=L.mode==="light"?he():Pe(),xe={};for(const at of fe)for(const it of at.shades)if(xe[it.name]=it.color,it.aliases)for(const _t of it.aliases)xe[_t]=it.color;xe.transparent="rgba(0,0,0,0)",xe["panel-bg"]=L.background.primary,xe.text=L.text.primary;const We=at=>{if(!at)return Z.R;const it=xe[at];if(it)return it;if(at[0]==="#"||at.indexOf("rgb")>-1)return at;const _t=Ce[at.toLowerCase()];return _t?(xe[at]=_t,_t):at},Ue=ie();return{hues:fe,palette:Ue,getColorByName:We}}function Pe(){return[{name:"red",shades:[{color:"#FFA6B0",name:"super-light-red"},{color:"#FF7383",name:"light-red"},{color:"#F2495C",name:"red",primary:!0},{color:"#E02F44",name:"semi-dark-red"},{color:"#C4162A",name:"dark-red"}]},{name:"orange",shades:[{color:"#FFCB7D",name:"super-light-orange",aliases:[]},{color:"#FFB357",name:"light-orange",aliases:[]},{color:"#FF9830",name:"orange",aliases:[],primary:!0},{color:"#FF780A",name:"semi-dark-orange",aliases:[]},{color:"#FA6400",name:"dark-orange",aliases:[]}]},{name:"yellow",shades:[{color:"#FFF899",name:"super-light-yellow",aliases:[]},{color:"#FFEE52",name:"light-yellow",aliases:[]},{color:"#FADE2A",name:"yellow",aliases:[],primary:!0},{color:"#F2CC0C",name:"semi-dark-yellow",aliases:[]},{color:"#E0B400",name:"dark-yellow",aliases:[]}]},{name:"green",shades:[{color:"#C8F2C2",name:"super-light-green",aliases:[]},{color:"#96D98D",name:"light-green",aliases:[]},{color:"#73BF69",name:"green",aliases:[],primary:!0},{color:"#56A64B",name:"semi-dark-green",aliases:[]},{color:"#37872D",name:"dark-green",aliases:[]}]},{name:"blue",shades:[{color:"#C0D8FF",name:"super-light-blue",aliases:[]},{color:"#8AB8FF",name:"light-blue",aliases:[]},{color:"#5794F2",name:"blue",aliases:[],primary:!0},{color:"#3274D9",name:"semi-dark-blue",aliases:[]},{color:"#1F60C4",name:"dark-blue",aliases:[]}]},{name:"purple",shades:[{color:"#DEB6F2",name:"super-light-purple",aliases:[]},{color:"#CA95E5",name:"light-purple",aliases:[]},{color:"#B877D9",name:"purple",aliases:[],primary:!0},{color:"#A352CC",name:"semi-dark-purple",aliases:[]},{color:"#8F3BB8",name:"dark-purple",aliases:[]}]}]}function he(){return[{name:"red",shades:[{color:"#FF7383",name:"super-light-red"},{color:"#F2495C",name:"light-red"},{color:"#E02F44",name:"red",primary:!0},{color:"#C4162A",name:"semi-dark-red"},{color:"#AD0317",name:"dark-red"}]},{name:"orange",shades:[{color:"#FFB357",name:"super-light-orange",aliases:[]},{color:"#FF9830",name:"light-orange",aliases:[]},{color:"#FF780A",name:"orange",aliases:[],primary:!0},{color:"#FA6400",name:"semi-dark-orange",aliases:[]},{color:"#E55400",name:"dark-orange",aliases:[]}]},{name:"yellow",shades:[{color:"#FFEE52",name:"super-light-yellow",aliases:[]},{color:"#FADE2A",name:"light-yellow",aliases:[]},{color:"#F2CC0C",name:"yellow",aliases:[],primary:!0},{color:"#E0B400",name:"semi-dark-yellow",aliases:[]},{color:"#CC9D00",name:"dark-yellow",aliases:[]}]},{name:"green",shades:[{color:"#96D98D",name:"super-light-green",aliases:[]},{color:"#73BF69",name:"light-green",aliases:[]},{color:"#56A64B",name:"green",aliases:[],primary:!0},{color:"#37872D",name:"semi-dark-green",aliases:[]},{color:"#19730E",name:"dark-green",aliases:[]}]},{name:"blue",shades:[{color:"#8AB8FF",name:"super-light-blue",aliases:[]},{color:"#5794F2",name:"light-blue",aliases:[]},{color:"#3274D9",name:"blue",aliases:[],primary:!0},{color:"#1F60C4",name:"semi-dark-blue",aliases:[]},{color:"#1250B0",name:"dark-blue",aliases:[]}]},{name:"purple",shades:[{color:"#CA95E5",name:"super-light-purple",aliases:[]},{color:"#B877D9",name:"light-purple",aliases:[]},{color:"#A352CC",name:"purple",aliases:[],primary:!0},{color:"#8F3BB8",name:"semi-dark-purple",aliases:[]},{color:"#7C2EA3",name:"dark-purple",aliases:[]}]}]}function ie(){return["green","semi-dark-yellow","light-blue","semi-dark-orange","red","blue","purple","#705DA0","dark-green","yellow","#447EBC","#C15C17","#890F02","#0A437C","#6D1F62","#584477","#B7DBAB","#F4D598","#70DBED","#F9BA8F","#F29191","#82B5D8","#E5A8E2","#AEA2E0","#629E51","#E5AC0E","#64B0C8","#E0752D","#BF1B00","#0A50A1","#962D82","#614D93","#9AC48A","#F2C96D","#65C5DB","#F9934E","#EA6460","#5195CE","#D683CE","#806EB7","#3F6833","#967302","#2F575E","#99440A","#58140C","#052B51","#511749","#3F2B5B","#E0F9D7","#FCEACA","#CFFAFF","#F9E2D2","#FCE2DE","#BADFF4","#F9D9F9","#DEDAF7"]}const Ce={aliceblue:"#f0f8ff",antiquewhite:"#faebd7",aqua:"#00ffff",aquamarine:"#7fffd4",azure:"#f0ffff",beige:"#f5f5dc",bisque:"#ffe4c4",black:"#000000",blanchedalmond:"#ffebcd",blue:"#0000ff",blueviolet:"#8a2be2",brown:"#a52a2a",burlywood:"#deb887",cadetblue:"#5f9ea0",chartreuse:"#7fff00",chocolate:"#d2691e",coral:"#ff7f50",cornflowerblue:"#6495ed",cornsilk:"#fff8dc",crimson:"#dc143c",cyan:"#00ffff",darkblue:"#00008b",darkcyan:"#008b8b",darkgoldenrod:"#b8860b",darkgray:"#a9a9a9",darkgreen:"#006400",darkkhaki:"#bdb76b",darkmagenta:"#8b008b",darkolivegreen:"#556b2f",darkorange:"#ff8c00",darkorchid:"#9932cc",darkred:"#8b0000",darksalmon:"#e9967a",darkseagreen:"#8fbc8f",darkslateblue:"#483d8b",darkslategray:"#2f4f4f",darkturquoise:"#00ced1",darkviolet:"#9400d3",deeppink:"#ff1493",deepskyblue:"#00bfff",dimgray:"#696969",dodgerblue:"#1e90ff",firebrick:"#b22222",floralwhite:"#fffaf0",forestgreen:"#228b22",fuchsia:"#ff00ff",gainsboro:"#dcdcdc",ghostwhite:"#f8f8ff",gold:"#ffd700",goldenrod:"#daa520",gray:"#808080",green:"#008000",greenyellow:"#adff2f",honeydew:"#f0fff0",hotpink:"#ff69b4","indianred ":"#cd5c5c",indigo:"#4b0082",ivory:"#fffff0",khaki:"#f0e68c",lavender:"#e6e6fa",lavenderblush:"#fff0f5",lawngreen:"#7cfc00",lemonchiffon:"#fffacd",lightblue:"#add8e6",lightcoral:"#f08080",lightcyan:"#e0ffff",lightgoldenrodyellow:"#fafad2",lightgrey:"#d3d3d3",lightgreen:"#90ee90",lightpink:"#ffb6c1",lightsalmon:"#ffa07a",lightseagreen:"#20b2aa",lightskyblue:"#87cefa",lightslategray:"#778899",lightsteelblue:"#b0c4de",lightyellow:"#ffffe0",lime:"#00ff00",limegreen:"#32cd32",linen:"#faf0e6",magenta:"#ff00ff",maroon:"#800000",mediumaquamarine:"#66cdaa",mediumblue:"#0000cd",mediumorchid:"#ba55d3",mediumpurple:"#9370d8",mediumseagreen:"#3cb371",mediumslateblue:"#7b68ee",mediumspringgreen:"#00fa9a",mediumturquoise:"#48d1cc",mediumvioletred:"#c71585",midnightblue:"#191970",mintcream:"#f5fffa",mistyrose:"#ffe4e1",moccasin:"#ffe4b5",navajowhite:"#ffdead",navy:"#000080",oldlace:"#fdf5e6",olive:"#808000",olivedrab:"#6b8e23",orange:"#ffa500",orangered:"#ff4500",orchid:"#da70d6",palegoldenrod:"#eee8aa",palegreen:"#98fb98",paleturquoise:"#afeeee",palevioletred:"#d87093",papayawhip:"#ffefd5",peachpuff:"#ffdab9",peru:"#cd853f",pink:"#ffc0cb",plum:"#dda0dd",powderblue:"#b0e0e6",purple:"#800080",rebeccapurple:"#663399",red:"#ff0000",rosybrown:"#bc8f8f",royalblue:"#4169e1",saddlebrown:"#8b4513",salmon:"#fa8072",sandybrown:"#f4a460",seagreen:"#2e8b57",seashell:"#fff5ee",sienna:"#a0522d",silver:"#c0c0c0",skyblue:"#87ceeb",slateblue:"#6a5acd",slategray:"#708090",snow:"#fffafa",springgreen:"#00ff7f",steelblue:"#4682b4",tan:"#d2b48c",teal:"#008080",thistle:"#d8bfd8",tomato:"#ff6347",turquoise:"#40e0d0",violet:"#ee82ee",wheat:"#f5deb3",white:"#ffffff",whitesmoke:"#f5f5f5",yellow:"#ffff00",yellowgreen:"#9acd32"},Le={navbarFixed:1e3,sidemenu:1020,dropdown:1030,typeahead:1030,tooltip:1040,modalBackdrop:1050,modal:1060,portal:1061};var we=Object.defineProperty,ue=Object.defineProperties,Ie=Object.getOwnPropertyDescriptors,qe=Object.getOwnPropertySymbols,Je=Object.prototype.hasOwnProperty,Ze=Object.prototype.propertyIsEnumerable,Oe=(L,fe,xe)=>fe in L?we(L,fe,{enumerable:!0,configurable:!0,writable:!0,value:xe}):L[fe]=xe,ce=(L,fe)=>{for(var xe in fe||(fe={}))Je.call(fe,xe)&&Oe(L,xe,fe[xe]);if(qe)for(var xe of qe(fe))Ze.call(fe,xe)&&Oe(L,xe,fe[xe]);return L},pe=(L,fe)=>ue(L,Ie(fe));function J(L={}){const{colors:fe={},spacing:xe={},shape:We={},typography:Ue={}}=L,at=g(fe),it=t(),_t=s(xe),wt=h(We),ee=U(at,Ue),_e=y(at),ge=D(),de=v(at,_e),Ee=te(at),ze={name:at.mode==="dark"?"Dark":"Light",isDark:at.mode==="dark",isLight:at.mode==="light",colors:at,breakpoints:it,spacing:_t,shape:wt,components:de,typography:ee,shadows:_e,transitions:ge,visualization:Ee,zIndex:ce({},Le),flags:{}};return pe(ce({},ze),{v1:me(ze)})}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/fieldReducer.ts":function(se,V,e){"use strict";e.d(V,{Kx:function(){return w},TB:function(){return _},gz:function(){return m}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/data.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/Registry.ts"),x=Object.defineProperty,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(r,u,p)=>u in r?x(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,O=(r,u)=>{for(var p in u||(u={}))i.call(u,p)&&E(r,p,u[p]);if(d)for(var p of d(u))c.call(u,p)&&E(r,p,u[p]);return r},m=(r=>(r.sum="sum",r.max="max",r.min="min",r.logmin="logmin",r.mean="mean",r.variance="variance",r.stdDev="stdDev",r.last="last",r.first="first",r.count="count",r.range="range",r.diff="diff",r.diffperc="diffperc",r.delta="delta",r.step="step",r.firstNotNull="firstNotNull",r.lastNotNull="lastNotNull",r.changeCount="changeCount",r.distinctCount="distinctCount",r.allIsZero="allIsZero",r.allIsNull="allIsNull",r.allValues="allValues",r.uniqueValues="uniqueValues",r))(m||{});function w(r){var u;const{field:p,reducers:S}=r;if(!p||!S||S.length<1)return{};if((u=p.state)!=null&&u.calcs){const K=[];for(const F of S)p.state.calcs.hasOwnProperty(F)||K.push(F);if(K.length<1)return O({},p.state.calcs)}p.state||(p.state={});const k=_.list(S);if(p.values.length<1){const K=O({},p.state.calcs);for(const F of k)K[F.id]=F.emptyInputResult!==null?F.emptyInputResult:null;return p.state.calcs=K}const{nullValueMode:M}=p.config,I=M===a.Gl.Ignore,T=M===a.Gl.AsZero;if(k.length===1&&k[0].reduce){const K=k[0].reduce(p,I,T);return p.state.calcs=O(O({},p.state.calcs),K),K}let j=C(p,I,T);for(const K of k)!j.hasOwnProperty(K.id)&&K.reduce&&(j=O(O({},j),K.reduce(p,I,T)));return p.state.calcs=O(O({},p.state.calcs),j),j}const _=new f.B(()=>[{id:"lastNotNull",name:"Last *",description:"Last non-null value",standard:!0,aliasIds:["current"],reduce:y},{id:"last",name:"Last",description:"Last value",standard:!0,reduce:v},{id:"firstNotNull",name:"First *",description:"First non-null value",standard:!0,reduce:g},{id:"first",name:"First",description:"First Value",standard:!0,reduce:b},{id:"min",name:"Min",description:"Minimum Value",standard:!0},{id:"max",name:"Max",description:"Maximum Value",standard:!0},{id:"mean",name:"Mean",description:"Average Value",standard:!0,aliasIds:["avg"]},{id:"variance",name:"Variance",description:"Variance of all values in a field",standard:!1,reduce:h},{id:"stdDev",name:"StdDev",description:"Standard deviation of all values in a field",standard:!1,reduce:h},{id:"sum",name:"Total",description:"The sum of all values",emptyInputResult:0,standard:!0,aliasIds:["total"]},{id:"count",name:"Count",description:"Number of values in response",emptyInputResult:0,standard:!0},{id:"range",name:"Range",description:"Difference between minimum and maximum values",standard:!0},{id:"delta",name:"Delta",description:"Cumulative change in value",standard:!0},{id:"step",name:"Step",description:"Minimum interval between values",standard:!0},{id:"diff",name:"Difference",description:"Difference between first and last values",standard:!0},{id:"logmin",name:"Min (above zero)",description:"Used for log min scale",standard:!0},{id:"allIsZero",name:"All Zeros",description:"All values are zero",emptyInputResult:!1,standard:!0},{id:"allIsNull",name:"All Nulls",description:"All values are null",emptyInputResult:!0,standard:!0},{id:"changeCount",name:"Change Count",description:"Number of times the value changes",standard:!1,reduce:s},{id:"distinctCount",name:"Distinct Count",description:"Number of distinct values",standard:!1,reduce:o},{id:"diffperc",name:"Difference percent",description:"Percentage difference between first and last values",standard:!0},{id:"allValues",name:"All values",description:"Returns an array with all values",standard:!1,reduce:r=>({allValues:r.values.toArray()})},{id:"uniqueValues",name:"All unique values",description:"Returns an array with all unique values",standard:!1,reduce:r=>({uniqueValues:[...new Set(r.values.toArray())]})}]);function C(r,u,p){const S={sum:0,max:-Number.MAX_VALUE,min:Number.MAX_VALUE,logmin:Number.MAX_VALUE,mean:null,last:null,first:null,lastNotNull:null,firstNotNull:null,count:0,nonNullCount:0,allIsNull:!0,allIsZero:!0,range:null,diff:null,delta:0,step:Number.MAX_VALUE,diffperc:0,previousDeltaUp:!0},k=r.values;S.count=u?k.length:k.toArray().filter(M=>M!=null).length;const D=r.type===l.fS.number||l.fS.time;for(let M=0;M<k.length;M++){let I=k.get(M);if(M===0&&(S.first=I),S.last=I,I===null){if(u)continue;p&&(I=0)}if(I!=null){const T=S.firstNotNull===null;if(T&&(S.firstNotNull=I),D){if(S.sum+=I,S.allIsNull=!1,S.nonNullCount++,!T){const j=I-S.lastNotNull;S.step>j&&(S.step=j),S.lastNotNull>I?(S.previousDeltaUp=!1,M===k.length-1&&(S.delta+=I)):(S.previousDeltaUp?S.delta+=j:S.delta+=I,S.previousDeltaUp=!0)}I>S.max&&(S.max=I),I<S.min&&(S.min=I),I<S.logmin&&I>0&&(S.logmin=I)}I!==0&&(S.allIsZero=!1),S.lastNotNull=I}}return S.max===-Number.MAX_VALUE&&(S.max=null),S.min===Number.MAX_VALUE&&(S.min=null),S.step===Number.MAX_VALUE&&(S.step=null),S.nonNullCount>0&&(S.mean=S.sum/S.nonNullCount),S.allIsNull&&(S.allIsZero=!1),S.max!==null&&S.min!==null&&(S.range=S.max-S.min),(0,t.isNumber)(S.firstNotNull)&&(0,t.isNumber)(S.lastNotNull)&&(S.diff=S.lastNotNull-S.firstNotNull),(0,t.isNumber)(S.firstNotNull)&&(0,t.isNumber)(S.diff)&&(S.diffperc=S.diff/S.firstNotNull),S}function b(r,u,p){return{first:r.values.get(0)}}function g(r,u,p){const S=r.values;for(let k=0;k<S.length;k++){const D=S.get(k);if(D!=null&&D!==void 0)return{firstNotNull:D}}return{firstNotNull:null}}function v(r,u,p){const S=r.values;return{last:S.get(S.length-1)}}function y(r,u,p){const S=r.values;let k=S.length-1;for(;k>=0;){const D=S.get(k--);if(D!=null&&D!==void 0)return{lastNotNull:D}}return{lastNotNull:null}}function h(r,u,p){if(!(r.type===l.fS.number||r.type===l.fS.time))return{variance:0,stdDev:0};let S=0,k=0,D=0;const M=r.values;for(let I=0;I<M.length;I++){const T=M.get(I);if(T!=null){D++;let j=k;k+=(T-j)/D,S+=(T-j)*(T-k)}}if(D>0){const I=S/D;return{variance:I,stdDev:Math.sqrt(I)}}return{variance:0,stdDev:0}}function s(r,u,p){const S=r.values;let k=0,D=!0,M=null;for(let I=0;I<S.length;I++){let T=S.get(I);if(T===null){if(u)continue;p&&(T=0)}!D&&M!==T&&k++,D=!1,M=T}return{changeCount:k}}function o(r,u,p){const S=r.values,k=new Set;for(let D=0;D<S.length;D++){let M=S.get(D);if(M===null){if(u)continue;p&&(M=0)}k.add(M)}return{distinctCount:k.size}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/matchers.ts":function(se,V,e){"use strict";e.d(V,{Ls:function(){return Je},Ac:function(){return Ze},sq:function(){return ce},b9:function(){return pe}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/Registry.ts"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/matchers/ids.ts");const l={id:a.mi.byType,name:"Field Type",description:"match based on the field type",defaultOptions:n.fS.number,get:L=>(fe,xe,We)=>L===fe.type,getOptionsDisplayText:L=>`Field type: ${L}`},f={id:a.mi.numeric,name:"Numeric Fields",description:"Fields with type number",get:()=>l.get(n.fS.number),getOptionsDisplayText:()=>"Numeric Fields"},x={id:a.mi.time,name:"Time Fields",description:"Fields with type time",get:()=>l.get(n.fS.time),getOptionsDisplayText:()=>"Time Fields"};function d(){return[l,f,x]}var i=e("../grafana-schema/src/common/common.gen.ts"),c=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/fieldReducer.ts");function E(L,fe,xe){switch((L==null||xe==null)&&(L==null&&(L="null"),xe==null&&(xe="null"),(fe===i.Bd.GTE||fe===i.Bd.LTE)&&(fe=i.Bd.EQ)),fe){case i.Bd.EQ:return`${L}`==`${xe}`;case i.Bd.NEQ:return`${L}`!=`${xe}`;case i.Bd.GT:return L>xe;case i.Bd.GTE:return L>=xe;case i.Bd.LT:return L<xe;case i.Bd.LTE:return L<=xe;default:return!1}}function O(L){return L===c.gz.allIsNull||L===c.gz.allIsZero}const m={id:a.mi.byValue,name:"By value (reducer)",description:"Reduce a field to a single value and test for inclusion",defaultOptions:{reducer:c.gz.allIsZero,op:i.Bd.GTE,value:0},get:L=>{if(!L||!L.reducer)return()=>!1;let{reducer:fe,op:xe,value:We}=L;const Ue=O(fe);return xe||(xe=i.Bd.EQ),(at,it,_t)=>{const wt=(0,c.Kx)({field:at,reducers:[fe]})[fe];return Ue?Boolean(wt):E(wt,xe,We)}},getOptionsDisplayText:L=>`By value (${L.reducer})`};var w=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/fieldState.ts"),_=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/string.ts"),C=(L=>(L.exclude="exclude",L.include="include",L))(C||{});const b={id:a.mi.byName,name:"Field Name",description:"match the field name",defaultOptions:"",get:L=>(fe,xe,We)=>L===fe.name||(0,w.C)(fe,xe,We)===L,getOptionsDisplayText:L=>`Field name: ${L}`},g={id:a.mi.byNames,name:"Field Names",description:"match any of the given the field names",defaultOptions:{mode:"include",names:[]},get:L=>{const{names:fe,mode:xe="include"}=L,We=new Set(fe!=null?fe:[]),Ue=(at,it,_t)=>We.has(at.name)||We.has((0,w.C)(at,it,_t));return xe==="exclude"?(at,it,_t)=>!Ue(at,it,_t):Ue},getOptionsDisplayText:L=>{const{names:fe,mode:xe}=L,We=(fe!=null?fe:[]).join(", ");return xe==="exclude"?`All except: ${We}`:`All of: ${We}`}},v={id:a.mi.byRegexp,name:"Field Name by Regexp",description:"match the field name by a given regexp pattern",defaultOptions:"/.*/",get:L=>{const fe=s(L);return(xe,We,Ue)=>{const at=(0,w.C)(xe,We,Ue);return!!fe&&fe.test(at)}},getOptionsDisplayText:L=>`Field name by pattern: ${L}`},y={id:a.mi.byFrameRefID,name:"Fields by frame refId",description:"match all fields returned in data frame with refId.",defaultOptions:"",get:L=>(fe,xe,We)=>xe.refId===L,getOptionsDisplayText:L=>`Math all fields returned by query with reference ID: ${L}`},h={id:a.mi.byRegexpOrNames,name:"Field Name by Regexp or Names",description:"match the field name by a given regexp pattern or given names",defaultOptions:{pattern:"/.*/",names:[]},get:L=>{var fe;const xe=v.get((L==null?void 0:L.pattern)||""),We=g.get({mode:"include",names:(fe=L==null?void 0:L.names)!=null?fe:[]});return(Ue,at,it)=>We(Ue,at,it)||xe(Ue,at,it)},getOptionsDisplayText:L=>{var fe,xe,We;const Ue=(fe=L==null?void 0:L.pattern)!=null?fe:"",at=(We=(xe=L==null?void 0:L.names)==null?void 0:xe.join(","))!=null?We:"";return`Field name by pattern: ${Ue} or names: ${at}`}},s=L=>{if(!!L)try{return(0,_.jO)(L)}catch(fe){console.error(fe);return}},o={id:a.E4.byName,name:"Frame Name",description:"match the frame name",defaultOptions:"/.*/",get:L=>{const fe=(0,_.jO)(L);return xe=>fe.test(xe.name||"")},getOptionsDisplayText:L=>`Frame name: ${L}`};function r(){return[b,v,g,h,y]}function u(){return[o]}const p={id:a.Ff.anyMatch,name:"Any",description:"Any child matches (OR)",excludeFromPicker:!0,defaultOptions:[],get:L=>{const fe=L.map(xe=>ce(xe));return(xe,We,Ue)=>{for(const at of fe)if(at(xe,We,Ue))return!0;return!1}},getOptionsDisplayText:L=>{let fe="";for(const xe of L){fe.length>0&&(fe+=" OR ");const We=Je.get(xe.id);fe+=We.getOptionsDisplayText?We.getOptionsDisplayText(xe):We.name}return fe}},S={id:a.Ff.anyMatch,name:"Any",description:"Any child matches (OR)",excludeFromPicker:!0,defaultOptions:[],get:L=>{const fe=L.map(xe=>pe(xe));return xe=>{for(const We of fe)if(We(xe))return!0;return!1}},getOptionsDisplayText:L=>{let fe="";for(const xe of L){fe.length>0&&(fe+=" OR ");const We=Ze.get(xe.id);fe+=We.getOptionsDisplayText?We.getOptionsDisplayText(xe):We.name}return fe}},k={id:a.Ff.allMatch,name:"All",description:"Everything matches (AND)",excludeFromPicker:!0,defaultOptions:[],get:L=>{const fe=L.map(xe=>ce(xe));return(xe,We,Ue)=>{for(const at of fe)if(!at(xe,We,Ue))return!1;return!0}},getOptionsDisplayText:L=>{let fe="";for(const xe of L){fe.length>0&&(fe+=" AND ");const We=Je.get(xe.id);fe+=We.getOptionsDisplayText?We.getOptionsDisplayText(xe):We.name}return fe}},D={id:a.Ff.allMatch,name:"All",description:"Everything matches (AND)",excludeFromPicker:!0,defaultOptions:[],get:L=>{const fe=L.map(xe=>pe(xe));return xe=>{for(const We of fe)if(!We(xe))return!1;return!0}},getOptionsDisplayText:L=>{let fe="";for(const xe of L){fe.length>0&&(fe+=" AND ");const We=Ze.get(xe.id);fe+=We.getOptionsDisplayText?We.getOptionsDisplayText(xe):We.name}return fe}},M={id:a.Ff.invertMatch,name:"NOT",description:"Inverts other matchers",excludeFromPicker:!0,get:L=>{const fe=ce(L);return(xe,We,Ue)=>!fe(xe,We,Ue)},getOptionsDisplayText:L=>{const fe=Je.get(L.id);return"NOT "+(fe.getOptionsDisplayText?fe.getOptionsDisplayText(L.options):fe.name)}},I={id:a.Ff.invertMatch,name:"NOT",description:"Inverts other matchers",excludeFromPicker:!0,get:L=>{const fe=pe(L);return xe=>!fe(xe)},getOptionsDisplayText:L=>{const fe=Ze.get(L.id);return"NOT "+(fe.getOptionsDisplayText?fe.getOptionsDisplayText(L.options):fe.name)}},T=L=>!0,j=L=>!0,K=L=>!1,F=L=>L.type!==FieldType.time,$=L=>!1,R={id:a.Ff.alwaysMatch,name:"All Fields",description:"Always Match",get:L=>T,getOptionsDisplayText:L=>"Always"},U={id:a.Ff.alwaysMatch,name:"All Frames",description:"Always Match",get:L=>j,getOptionsDisplayText:L=>"Always"},H={id:a.Ff.neverMatch,name:"No Fields",description:"Never Match",excludeFromPicker:!0,get:L=>K,getOptionsDisplayText:L=>"Never"},W={id:a.Ff.neverMatch,name:"No Frames",description:"Never Match",get:L=>$,getOptionsDisplayText:L=>"Never"};function oe(){return[p,k,M,R,H]}function Q(){return[S,D,I,U,W]}const P={id:a.E4.byRefId,name:"Query refId",description:"match the refId",defaultOptions:"A",get:L=>{const fe=(0,_.jO)(L);return xe=>fe.test(xe.refId||"")},getOptionsDisplayText:L=>`RefID: ${L}`};function ae(){return[P]}const q={id:a.mi.first,name:"First Field",description:"The first field in the frame",get:L=>(fe,xe,We)=>fe===xe.fields[0],getOptionsDisplayText:()=>"First field"},Y={id:a.mi.firstTimeField,name:"First time field",description:"The first field of type time in a frame",get:L=>(fe,xe,We)=>fe.type===n.fS.time&&fe===xe.fields.find(Ue=>Ue.type===n.fS.time),getOptionsDisplayText:()=>"First time field"};function ve(){return[q,Y]}const re={id:a.mE.equal,name:"Is equal",description:"Match where value for given field is equal to options value.",get:L=>(fe,xe)=>xe.values.get(fe)==L.value,getOptionsDisplayText:()=>"Matches all rows where field is null.",isApplicable:()=>!0,getDefaultOptions:()=>({value:""})},je={id:a.mE.notEqual,name:"Is not equal",description:"Match where value for given field is not equal to options value.",get:L=>(fe,xe)=>xe.values.get(fe)!=L.value,getOptionsDisplayText:()=>"Matches all rows where field is not null.",isApplicable:()=>!0,getDefaultOptions:()=>({value:""})},me=()=>[re,je],ne={id:a.mE.isNull,name:"Is null",description:"Match where value for given field is null.",get:()=>(L,fe)=>fe.values.get(L)==null,getOptionsDisplayText:()=>"Matches all rows where field is null.",isApplicable:()=>!0,getDefaultOptions:()=>({})},Z={id:a.mE.isNotNull,name:"Is not null",description:"Match where value for given field is not null.",get:()=>(L,fe)=>fe.values.get(L)!=null,getOptionsDisplayText:()=>"Matches all rows where field is not null.",isApplicable:()=>!0,getDefaultOptions:()=>({})},te=()=>[ne,Z],Pe={id:a.mE.greater,name:"Is greater",description:"Match when field value is greater than option.",get:L=>(fe,xe)=>{const We=xe.values.get(fe);return isNaN(We)?!1:We>L.value},getOptionsDisplayText:L=>`Matches all rows where field value is greater than: ${L.value}.`,isApplicable:L=>L.type===n.fS.number,getDefaultOptions:()=>({value:0})},he={id:a.mE.greaterOrEqual,name:"Is greater or equal",description:"Match when field value is greater than or equal to option.",get:L=>(fe,xe)=>{const We=xe.values.get(fe);return isNaN(We)?!1:We>=L.value},getOptionsDisplayText:L=>`Matches all rows where field value is greater than or equal to: ${L.value}.`,isApplicable:L=>L.type===n.fS.number,getDefaultOptions:()=>({value:0})},ie={id:a.mE.lower,name:"Is lower",description:"Match when field value is lower than option.",get:L=>(fe,xe)=>{const We=xe.values.get(fe);return isNaN(We)?!1:We<L.value},getOptionsDisplayText:L=>`Matches all rows where field value is lower than: ${L.value}.`,isApplicable:L=>L.type===n.fS.number,getDefaultOptions:()=>({value:0})},Ce={id:a.mE.lowerOrEqual,name:"Is lower or equal",description:"Match when field value is lower or equal than option.",get:L=>(fe,xe)=>{const We=xe.values.get(fe);return isNaN(We)?!1:We<=L.value},getOptionsDisplayText:L=>`Matches all rows where field value is lower or equal than: ${L.value}.`,isApplicable:L=>L.type===n.fS.number,getDefaultOptions:()=>({value:0})},Le=()=>[Pe,he,ie,Ce],we={id:a.mE.between,name:"Is between",description:"Match when field value is between given option values.",get:L=>(fe,xe)=>{const We=xe.values.get(fe);return isNaN(We)?!1:We>L.from&&We<L.to},getOptionsDisplayText:L=>`Matches all rows where field value is between ${L.from} and ${L.to}.`,isApplicable:L=>L.type===n.fS.number,getDefaultOptions:()=>({from:0,to:100})},ue=()=>[we],Ie={id:a.mE.regex,name:"Regex",description:"Match when field value is matching regex.",get:L=>{const fe=new RegExp(L.value);return(xe,We)=>{const Ue=We.values.get(xe);return fe.test(Ue)}},getOptionsDisplayText:L=>`Matches all rows where field value is matching regex: ${L.value}`,isApplicable:()=>!0,getDefaultOptions:()=>({value:".*"})},qe=()=>[Ie],Je=new t.B(()=>[...oe(),...d(),...r(),...ve(),m]),Ze=new t.B(()=>[...Q(),...u(),...ae()]),Oe=new t.B(()=>[...te(),...Le(),...me(),...ue(),...qe()]);function ce(L){const fe=Je.get(L.id);if(!fe)throw new Error("Unknown field matcher: "+L.id);return fe.get(L.options)}function pe(L){const fe=Ze.get(L.id);if(!fe)throw new Error("Unknown frame matcher: "+L.id);return fe.get(L.options)}function J(L){const fe=Oe.get(L.id);if(!fe)throw new Error("Unknown value matcher: "+L.id);return fe.get(L.options)}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/matchers/ids.ts":function(se,V,e){"use strict";e.d(V,{E4:function(){return a},Ff:function(){return t},mE:function(){return l},mi:function(){return n}});var t=(f=>(f.anyMatch="anyMatch",f.allMatch="allMatch",f.invertMatch="invertMatch",f.alwaysMatch="alwaysMatch",f.neverMatch="neverMatch",f))(t||{}),n=(f=>(f.numeric="numeric",f.time="time",f.first="first",f.firstTimeField="firstTimeField",f.byType="byType",f.byName="byName",f.byNames="byNames",f.byRegexp="byRegexp",f.byRegexpOrNames="byRegexpOrNames",f.byFrameRefID="byFrameRefID",f.byValue="byValue",f))(n||{}),a=(f=>(f.byName="byName",f.byRefId="byRefId",f.byIndex="byIndex",f))(a||{}),l=(f=>(f.regex="regex",f.isNull="isNull",f.isNotNull="isNotNull",f.greater="greater",f.greaterOrEqual="greaterOrEqual",f.lower="lower",f.lowerOrEqual="lowerOrEqual",f.equal="equal",f.notEqual="notEqual",f.between="between",f))(l||{})},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/data.ts":function(se,V,e){"use strict";e.d(V,{Gl:function(){return a},Gu:function(){return t},fQ:function(){return l}});var t=(f=>(f.NotStarted="NotStarted",f.Loading="Loading",f.Streaming="Streaming",f.Done="Done",f.Error="Error",f))(t||{});const n=null;var a=(f=>(f.Null="null",f.Ignore="connected",f.AsZero="null as zero",f))(a||{});const l=f=>Boolean(f)},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts":function(se,V,e){"use strict";e.d(V,{Ls:function(){return a},M5:function(){return n},fS:function(){return t}});var t=(f=>(f.time="time",f.number="number",f.string="string",f.boolean="boolean",f.trace="trace",f.geo="geo",f.enum="enum",f.other="other",f.frame="frame",f))(t||{});const n="Value",a="Time",l="Metric"},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/fieldColor.ts":function(se,V,e){"use strict";e.d(V,{R:function(){return n},S:function(){return t}});var t=(a=>(a.Thresholds="thresholds",a.PaletteClassic="palette-classic",a.PaletteSaturated="palette-saturated",a.ContinuousGrYlRd="continuous-GrYlRd",a.ContinuousRdYlGr="continuous-RdYlGr",a.ContinuousBlYlRd="continuous-BlYlRd",a.ContinuousYlRd="continuous-YlRd",a.ContinuousBlPu="continuous-BlPu",a.ContinuousYlBl="continuous-YlBl",a.ContinuousBlues="continuous-blues",a.ContinuousReds="continuous-reds",a.ContinuousGreens="continuous-greens",a.ContinuousPurples="continuous-purples",a.Fixed="fixed",a))(t||{});const n="#808080"},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts":function(se,V,e){"use strict";e.d(V,{Mo:function(){return n},_S:function(){return t},iJ:function(){return a}});const t={google:!0,microsoft:!0,github:!0,gitlab:!0,okta:!0,discord:!0,hipchat:!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,apps:!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,"expand-arrows":!0,at:!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,"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,filter:!0,flip:!0,folder:!0,font:!0,fire:!0,"folder-open":!0,"folder-plus":!0,"folder-upload":!0,forward:!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-movepane-left":!0,"gf-movepane-right":!0,"gf-portrait":!0,"gf-service-account":!0,"gf-show-context":!0,grafana:!0,"graph-bar":!0,"grafana-ml":!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,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,"sort-amount-down":!0,"sort-amount-up":!0,"square-shape":!0,star:!0,"step-backward":!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,unlock:!0,upload:!0,user:!0,"users-alt":!0,"user-arrows":!0,"vertical-align-bottom":!0,"vertical-align-center":!0,"vertical-align-top":!0,"wrap-text":!0,rss:!0,x:!0};function n(l){return!l||typeof l!="string"?!1:l in t}function a(l){if(n(l))return l}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/panel.ts":function(se,V,e){"use strict";e.d(V,{wm:function(){return a}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t),a=(d=>(d.Auto="auto",d.Vertical="vertical",d.Horizontal="horizontal",d))(a||{}),l=(d=>(d[d.Best=100]="Best",d[d.Good=70]="Good",d[d.OK=50]="OK",d))(l||{});class f{constructor(i,c){this.list=[],this.data=i,this.panel=c,this.dataSummary=this.computeDataSummary()}getListAppender(i){return new x(this.list,i)}computeDataSummary(){var i,c;const E=((i=this.data)==null?void 0:i.series)||[];let O=0,m=0,w=0,_=0,C=0,b=0,g;for(const v of E){_+=v.length,(c=v.meta)!=null&&c.preferredVisualisationType&&(g=v.meta.preferredVisualisationType);for(const y of v.fields)switch(b++,y.type){case FieldType.number:O+=1;break;case FieldType.time:m+=1;break;case FieldType.string:w+=1;break}v.length>C&&(C=v.length)}return{numberFieldCount:O,timeFieldCount:m,stringFieldCount:w,rowCountTotal:_,rowCountMax:C,fieldCount:b,preferredVisualisationType:g,frameCount:E.length,hasData:_>0,hasTimeField:m>0,hasNumberField:O>0,hasStringField:w>0}}getList(){return this.list}}class x{constructor(i,c){this.list=i,this.defaults=c}append(i){this.list.push(defaultsDeep(i,this.defaults))}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/plugin.ts":function(se,V,e){"use strict";e.d(V,{BV:function(){return t},Xy:function(){return a}});var t=(i=>(i.alpha="alpha",i.beta="beta",i.stable="stable",i.deprecated="deprecated",i))(t||{}),n=(i=>(i.panel="panel",i.datasource="datasource",i.app="app",i.renderer="renderer",i.secretsmanager="secretsmanager",i))(n||{}),a=(i=>(i.internal="internal",i.valid="valid",i.invalid="invalid",i.modified="modified",i.missing="missing",i))(a||{}),l=(i=>(i.grafana="grafana",i.commercial="commercial",i.community="community",i.private="private",i.core="core",i))(l||{}),f=(i=>(i.missingSignature="signatureMissing",i.invalidSignature="signatureInvalid",i.modifiedSignature="signatureModified",i))(f||{}),x=(i=>(i.dashboard="dashboard",i.page="page",i.panel="panel",i.datasource="datasource",i))(x||{});class d{addConfigPage(c){return this.configPages||(this.configPages=[]),this.configPages.push(c),this}setChannelSupport(c){return console.warn("[deprecation] plugin is using ignored option: setChannelSupport",this.meta),this}constructor(){this.meta={}}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/thresholds.ts":function(se,V,e){"use strict";e.d(V,{H:function(){return t}});var t=(n=>(n.Absolute="absolute",n.Percentage="percentage",n))(t||{})},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/time.ts":function(se,V,e){"use strict";e.d(V,{JK:function(){return f},Ys:function(){return a}});var t=e("../grafana-schema/src/common/common.gen.ts"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts");const a=t.iT,l="YYYY-MM-DD HH:mm:ss";function f(){const d=(0,n.CQ)();return{from:(0,n.CQ)(d).subtract(6,"hour"),to:d,raw:{from:"now-6h",to:"now"}}}function x(){return{from:600,to:0}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/Registry.ts":function(se,V,e){"use strict";e.d(V,{B:function(){return n}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/plugin.ts");class n{constructor(l){this.init=l,this.ordered=[],this.byId=new Map,this.initialized=!1,this.setInit=f=>{if(this.initialized)throw new Error("Registry already initialized");this.init=f},this.init=l}getIfExists(l){if(this.initialized||this.initialize(),l)return this.byId.get(l)}initialize(){if(this.init)for(const l of this.init())this.register(l);this.sort(),this.initialized=!0}get(l){const f=this.getIfExists(l);if(!f)throw new Error(`"${l}" not found in: ${this.list().map(x=>x.id)}`);return f}selectOptions(l,f){this.initialized||this.initialize();const x={options:[],current:[]},d={};if(l)for(const i of l)d[i]={};for(const i of this.ordered){if(i.excludeFromPicker||f&&!f(i))continue;const c={value:i.id,label:i.name,description:i.description};i.state===t.BV.alpha&&(c.label+=" (alpha)"),x.options.push(c),d[i.id]&&(d[i.id]=c)}return l&&(x.current=Object.values(d)),x}list(l){if(this.initialized||this.initialize(),l){const f=[];for(const x of l){const d=this.getIfExists(x);d&&f.push(d)}return f}return this.ordered}isEmpty(){return this.initialized||this.initialize(),this.ordered.length===0}register(l){if(this.byId.has(l.id))throw new Error("Duplicate Key:"+l.id);if(this.byId.set(l.id,l),this.ordered.push(l),l.aliasIds)for(const f of l.aliasIds)this.byId.has(f)||this.byId.set(f,l);this.initialized&&this.sort()}sort(){}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/labels.ts":function(se,V,e){"use strict";e.d(V,{aA:function(){return m}});var t=Object.defineProperty,n=Object.getOwnPropertySymbols,a=Object.prototype.hasOwnProperty,l=Object.prototype.propertyIsEnumerable,f=(w,_,C)=>_ in w?t(w,_,{enumerable:!0,configurable:!0,writable:!0,value:C}):w[_]=C,x=(w,_)=>{for(var C in _||(_={}))a.call(_,C)&&f(w,C,_[C]);if(n)for(var C of n(_))l.call(_,C)&&f(w,C,_[C]);return w};const d=/\b(\w+)(!?=~?)"([^"\n]*?)"/g;function i(w){const _={};return w.replace(d,(C,b,g,v)=>(_[b]=v,"")),_}function c(w){return w.reduce((_,C)=>{if(!C)throw new Error("Need parsed labels to find common labels.");return Object.keys(C).forEach(b=>{(_[b]===void 0||_[b]!==C[b])&&delete _[b]}),Object.keys(_).forEach(b=>{C[b]===void 0&&delete _[b]}),_},x({},w[0]))}function E(w,_){const C=x({},w);return Object.keys(_).forEach(b=>{delete C[b]}),C}function O(w,_){if(!w)return!0;for(const[C,b]of Object.entries(w))if(!_||_[C]!==b)return!1;return!0}function m(w,_="",C){if(!w||Object.keys(w).length===0)return _;const g=Object.keys(w).sort().map(v=>`${v}="${w[v]}"`).join(", ");return C?g:["{",g,"}"].join("")}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/location.ts":function(se,V,e){"use strict";e.d(V,{u:function(){return O}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/index.ts"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/url.ts");let a={appSubUrl:""},l,f;const x=m=>{try{return new URL(m)}catch(w){return}},d=m=>{var w;const _=x(m);if(_&&_.origin!==window.location.origin)return m;const C=(w=a.appSubUrl)!=null?w:"",b=C.endsWith("/")?1:0,g=m.startsWith("http");let v=C;return(!m.startsWith("/")||g)&&(v=`${window.location.origin}${C}`),m.length>0&&m.indexOf(v)===0?m.slice(v.length-b):m},i=m=>m.startsWith("/")?`${a.appSubUrl}${d(m)}`:m,O={initialize:m=>{a=m.config,l=m.getTimeRangeForUrl,f=m.getVariablesUrlParams},stripBaseFromUrl:d,assureBaseUrl:i,updateSearchParams:(m,w)=>{const _=new URLSearchParams(w);try{const C=new URL(m);return _.forEach((b,g)=>C.searchParams.set(g,b)),C.href}catch(C){const b=new URLSearchParams(m);return _.forEach((g,v)=>{b.set(v,g)}),"?"+b.toString()}},getTimeRangeUrlParams:()=>l?n.Cj.toUrlParams(l()):null,getVariablesUrlParams:m=>{if(!f)return null;const w=f(m);return n.Cj.toUrlParams(w)},getUrlForPartial:(m,w)=>{const _=n.Cj.parseKeyValue(m.search.startsWith("?")?m.search.substring(1):m.search);for(const C of Object.keys(w))w[C]===null||w[C]===void 0?delete _[C]:_[C]=w[C];return i(n.Cj.renderUrl(m.pathname,_))},processUrl:m=>a.disableSanitizeHtml?m:t.QX.sanitizeUrl(m)}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/url.ts":function(se,V,e){"use strict";e.d(V,{Cj:function(){return i},S:function(){return c}});/**
 * @preserve jquery-param (c) 2015 KNOWLEDGECODE | MIT
 */function t(E,O){return O&&Object.keys(O).length>0&&(E+="?"+a(O)),E}function n(E,O){return encodeURIComponent(E).replace(/%40/gi,"@").replace(/%3A/gi,":").replace(/%24/g,"$").replace(/%2C/gi,",").replace(/%3B/gi,";").replace(/%20/g,O?"%20":"+").replace(/[!'()*]/g,function(m){return"%"+m.charCodeAt(0).toString(16).toUpperCase()})}function a(E){const O=[],m=/\[\]$/,w=b=>Object.prototype.toString.call(b)==="[object Array]",_=(b,g)=>{if(g=typeof g=="function"?g():g===null||g===void 0?"":g,typeof g!="boolean")O[O.length]=n(b,!0)+"="+n(g,!0);else{const v=g?"":"="+n("false",!0);O[O.length]=n(b,!0)+v}},C=(b,g)=>{let v,y,h;if(b)if(w(g))for(v=0,y=g.length;v<y;v++)m.test(b)?_(b,g[v]):C(b,g[v]);else if(g&&String(g)==="[object Object]")for(h in g)C(b+"["+h+"]",g[h]);else _(b,g);else if(w(g))for(v=0,y=g.length;v<y;v++)_(g[v].name,g[v].value);else for(h in g)C(h,g[h]);return O};return C("",E).join("&")}function l(E,O){if(O!=null&&O!==""){const m=E.indexOf("?");m!==-1?E.length-m>1&&(E+="&"):E+="?",E+=O}return E}function f(){const O=window.location.search.substring(1).split("&"),m={};for(const w of O){const _=w.split("=");if(_.length>1){const C=decodeURIComponent(_[0]),b=decodeURIComponent(_[1]);C in m?m[C]=[...m[C],b]:m[C]=[b]}else if(_.length===1){const C=decodeURIComponent(_[0]);m[C]=!0}}return m}function x(E){const O={},m=(E||"").split("&");for(let w of m){let _,C,b;if(w&&(C=w=w.replace(/\+/g,"%20"),_=w.indexOf("="),_!==-1&&(C=w.substring(0,_),b=w.substring(_+1)),C=d(C),C!==void 0)){b=b!==void 0?d(b):!0;let g;typeof b=="string"&&b!==""?g=b==="true"||b==="false"?b==="true":b:g=b,O.hasOwnProperty(C)?Array.isArray(O[C])?O[C].push(b):O[C]=[O[C],isNaN(g)?b:g]:O[C]=isNaN(g)?b:g}}return O}function d(E){try{return decodeURIComponent(E)}catch(O){return}}const i={renderUrl:t,toUrlParams:a,appendQueryToUrl:l,getUrlSearchParams:f,parseKeyValue:x};function c(E,O){return O!==void 0&&console.warn("`compact` parameter is deprecated and will be removed in a future release"),JSON.stringify(E)}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts":function(se,V,e){"use strict";e.d(V,{IR:function(){return Le},zc:function(){return je},Cf:function(){return Oe},QW:function(){return pe},br:function(){return Ce},SP:function(){return Ie},Qj:function(){return ue},SR:function(){return qe},vb:function(){return Je},FH:function(){return te},bn:function(){return he},q2:function(){return ie}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js");function n(J,L){return J===null?{text:""}:{text:te(J,L),suffix:"%"}}function a(J,L){return J===null?{text:""}:{text:te(100*J,L),suffix:"%"}}function l(J,L){if(J==null)return{text:""};const fe=f(J,L);return fe.text.substring(0,1)==="-"?fe.text="-0x"+fe.text.substring(1):fe.text="0x"+fe.text,fe}function f(J,L){return J==null?{text:""}:{text:parseFloat(te(J,L)).toString(16).toUpperCase()}}function x(J,L){return J==null?{text:""}:{text:J.toExponential(L!=null?L:void 0)}}var d=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formatter.ts"),i=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formats.ts"),c=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),E=(J=>(J.Year="year",J.Month="month",J.Week="week",J.Day="day",J.Hour="hour",J.Minute="minute",J.Second="second",J.Millisecond="millisecond",J))(E||{});const O=["year","month","week","day","hour","minute","second","millisecond"],m={year:31536e3,month:2592e3,week:604800,day:86400,hour:3600,minute:60,second:1,millisecond:.001};function w(J,L){return J===null?{text:""}:Math.abs(J)<1e3?{text:te(J,L),suffix:" ns"}:Math.abs(J)<1e6?he(J/1e3,L," \xB5s"):Math.abs(J)<1e9?he(J/1e6,L," ms"):Math.abs(J)<6e10?he(J/1e9,L," s"):Math.abs(J)<36e11?he(J/6e10,L," min"):Math.abs(J)<864e11?he(J/36e11,L," hour"):he(J/864e11,L," day")}function _(J,L){return J===null?{text:""}:Math.abs(J)<1e3?{text:te(J,L),suffix:" \xB5s"}:Math.abs(J)<1e6?he(J/1e3,L," ms"):he(J/1e6,L," s")}function C(J,L,fe){return J===null?{text:""}:Math.abs(J)<1e3?{text:te(J,L),suffix:" ms"}:Math.abs(J)<6e4?he(J/1e3,L," s"):Math.abs(J)<36e5?he(J/6e4,L," min"):Math.abs(J)<864e5?he(J/36e5,L," hour"):Math.abs(J)<31536e6?he(J/864e5,L," day"):he(J/31536e6,L," year")}function b(J,L){if(J!=null&&L!==null&&L!==void 0)return J-L}function g(J,L){return J===null?{text:""}:J===0?{text:"0",suffix:" s"}:Math.abs(J)<1e-6?he(J*1e9,L," ns"):Math.abs(J)<.001?he(J*1e6,L," \xB5s"):Math.abs(J)<1?he(J*1e3,L," ms"):Math.abs(J)<60?{text:te(J,L),suffix:" s"}:Math.abs(J)<3600?he(J/60,L," min"):Math.abs(J)<86400?he(J/3600,L," hour"):Math.abs(J)<604800?he(J/86400,L," day"):Math.abs(J)<31536e3?he(J/604800,L," week"):he(J/31556900,L," year")}function v(J,L){return J===null?{text:""}:Math.abs(J)<60?{text:te(J,L),suffix:" min"}:Math.abs(J)<1440?he(J/60,L," hour"):Math.abs(J)<10080?he(J/1440,L," day"):Math.abs(J)<604800?he(J/10080,L," week"):he(J/525948,L," year")}function y(J,L){return J===null?{text:""}:Math.abs(J)<24?{text:te(J,L),suffix:" hour"}:Math.abs(J)<168?he(J/24,L," day"):Math.abs(J)<8760?he(J/168,L," week"):he(J/8760,L," year")}function h(J,L){return J===null?{text:""}:Math.abs(J)<7?{text:te(J,L),suffix:" day"}:Math.abs(J)<365?he(J/7,L," week"):he(J/365,L," year")}function s(J,L,fe){if(J===null)return{text:""};if(J===0)return{text:"0",suffix:" "+fe+"s"};if(J<0){const at=s(-J,L,fe);return at.suffix||(at.suffix=""),at.suffix+=" ago",at}J*=m[fe]*1e3;const xe=[];let We=!1,Ue=0;L!=null&&(Ue=L);for(let at=0;at<O.length&&Ue>=0;at++){const it=m[O[at]]*1e3,_t=J/it;if(_t>=1||We){We=!0;const wt=Math.floor(_t),ee=O[at]+(wt!==1?"s":"");xe.push(wt+" "+ee),J=J%it,Ue--}}return{text:xe.join(", ")}}function o(J,L){if(J===null)return{text:""};if(J<1e3)return{text:(0,c.zh)(J).format("SSS\\m\\s")};if(J<6e4){let Ue="ss\\s:SSS\\m\\s";return L===0&&(Ue="ss\\s"),{text:(0,c.zh)(J).format(Ue)}}if(J<36e5){let Ue="mm\\m:ss\\s:SSS\\m\\s";return L===0?Ue="mm\\m":L===1&&(Ue="mm\\m:ss\\s"),{text:(0,c.zh)(J).format(Ue)}}let fe="mm\\m:ss\\s:SSS\\m\\s";const xe=`${("0"+Math.floor((0,c.Ks)(J,"milliseconds").asHours())).slice(-2)}h`;return L===0?fe="":L===1?fe="mm\\m":L===2&&(fe="mm\\m:ss\\s"),{text:fe?`${xe}:${(0,c.zh)(J).format(fe)}`:xe}}function r(J,L){return s(J,L,"millisecond")}function u(J,L){return s(J,L,"second")}function p(J){if(J<0){const Ue=p(-J);return Ue.suffix||(Ue.suffix=""),Ue.suffix+=" ago",Ue}const L=[],fe=Math.floor(J/3600),xe=Math.floor(J%3600/60),We=Math.floor(J%3600%60);return fe>9?L.push(""+fe):L.push("0"+fe),xe>9?L.push(""+xe):L.push("0"+xe),We>9?L.push(""+We):L.push("0"+We),{text:L.join(":")}}function S(J){if(J<0){const We=S(-J);return We.suffix||(We.suffix=""),We.suffix+=" ago",We}let L="";const fe=Math.floor(J/(24*3600));fe>0&&(L=fe+" d ");const xe=p(J-fe*24*3600);return{text:L+xe.text}}function k(J,L){return g(J/100,L)}function D(J,L){return o(J,L)}function M(J,L){return o(J*1e3,L)}function I(J,L){return(fe,xe,We,Ue)=>L&&(0,c.CQ)().isSame(fe,"day")?{text:(0,d.dq)(fe,{format:L,timeZone:Ue})}:{text:(0,d.dq)(fe,{format:J,timeZone:Ue})}}const T=I("YYYY-MM-DD HH:mm:ss"),j=I("YYYY-MM-DD HH:mm:ss","HH:mm:ss"),K=I("MM/DD/YYYY h:mm:ss a"),F=I("MM/DD/YYYY h:mm:ss a","h:mm:ss a");function $(){return I((0,i.Ji)({year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"}))}function R(){return I((0,i.Ji)({year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"}),(0,i.Ji)({hour:"2-digit",minute:"2-digit",second:"2-digit"}))}function U(J,L,fe,xe,We){return{text:(0,d.dq)(J,{format:We?i.U6.fullDateMS:i.U6.fullDate,timeZone:xe})}}function H(J,L,fe,xe){return{text:(0,d.E8)(J,{timeZone:xe})}}function W(J,L){const xe=ue(1e3,["","K","M","B","T"]);return(We,Ue,at)=>{var it;if(We==null)return{text:""};const _t=We<0;_t&&(We=Math.abs(We));const wt=xe(We,Ue,at);return L?wt.suffix=wt.suffix!==void 0?`${wt.suffix}${J}`:void 0:wt.prefix=J,_t&&(wt.prefix=`-${(it=wt.prefix)!=null&&it.length?wt.prefix:""}`),wt}}const oe=["f","p","n","\xB5","m","","k","M","G","T","P","E","Z","Y"],Q=oe.indexOf("");function P(J){const L=oe.findIndex(fe=>fe.normalize("NFKD")===J.normalize("NFKD"));return L<0?0:L-Q}const ae=["","Ki","Mi","Gi","Ti","Pi","Ei","Zi","Yi"];function q(J,L=0){const fe=ae.map(xe=>" "+xe+J);return ue(1024,fe,L)}function Y(J,L=0){const fe=oe.map(xe=>" "+xe+J);return ue(1e3,fe,Q+L)}const ve=()=>[{name:"Misc",formats:[{name:"Number",id:"none",fn:ie("")},{name:"String",id:"string",fn:Je},{name:"short",id:"short",fn:ue(1e3,[""," K"," Mil"," Bil"," Tri"," Quadr"," Quint"," Sext"," Sept"])},{name:"Percent (0-100)",id:"percent",fn:n},{name:"Percent (0.0-1.0)",id:"percentunit",fn:a},{name:"Humidity (%H)",id:"humidity",fn:ie("%H")},{name:"Decibel",id:"dB",fn:ie("dB")},{name:"Hexadecimal (0x)",id:"hex0x",fn:l},{name:"Hexadecimal",id:"hex",fn:f},{name:"Scientific notation",id:"sci",fn:x},{name:"Locale format",id:"locale",fn:Ie},{name:"Pixels",id:"pixel",fn:ie("px")}]},{name:"Acceleration",formats:[{name:"Meters/sec\xB2",id:"accMS2",fn:ie("m/sec\xB2")},{name:"Feet/sec\xB2",id:"accFS2",fn:ie("f/sec\xB2")},{name:"G unit",id:"accG",fn:ie("g")}]},{name:"Angle",formats:[{name:"Degrees (\xB0)",id:"degree",fn:ie("\xB0")},{name:"Radians",id:"radian",fn:ie("rad")},{name:"Gradian",id:"grad",fn:ie("grad")},{name:"Arc Minutes",id:"arcmin",fn:ie("arcmin")},{name:"Arc Seconds",id:"arcsec",fn:ie("arcsec")}]},{name:"Area",formats:[{name:"Square Meters (m\xB2)",id:"areaM2",fn:ie("m\xB2")},{name:"Square Feet (ft\xB2)",id:"areaF2",fn:ie("ft\xB2")},{name:"Square Miles (mi\xB2)",id:"areaMI2",fn:ie("mi\xB2")}]},{name:"Computation",formats:[{name:"FLOP/s",id:"flops",fn:Y("FLOPS")},{name:"MFLOP/s",id:"mflops",fn:Y("FLOPS",2)},{name:"GFLOP/s",id:"gflops",fn:Y("FLOPS",3)},{name:"TFLOP/s",id:"tflops",fn:Y("FLOPS",4)},{name:"PFLOP/s",id:"pflops",fn:Y("FLOPS",5)},{name:"EFLOP/s",id:"eflops",fn:Y("FLOPS",6)},{name:"ZFLOP/s",id:"zflops",fn:Y("FLOPS",7)},{name:"YFLOP/s",id:"yflops",fn:Y("FLOPS",8)}]},{name:"Concentration",formats:[{name:"parts-per-million (ppm)",id:"ppm",fn:ie("ppm")},{name:"parts-per-billion (ppb)",id:"conppb",fn:ie("ppb")},{name:"nanogram per cubic meter (ng/m\xB3)",id:"conngm3",fn:ie("ng/m\xB3")},{name:"nanogram per normal cubic meter (ng/Nm\xB3)",id:"conngNm3",fn:ie("ng/Nm\xB3")},{name:"microgram per cubic meter (\u03BCg/m\xB3)",id:"con\u03BCgm3",fn:ie("\u03BCg/m\xB3")},{name:"microgram per normal cubic meter (\u03BCg/Nm\xB3)",id:"con\u03BCgNm3",fn:ie("\u03BCg/Nm\xB3")},{name:"milligram per cubic meter (mg/m\xB3)",id:"conmgm3",fn:ie("mg/m\xB3")},{name:"milligram per normal cubic meter (mg/Nm\xB3)",id:"conmgNm3",fn:ie("mg/Nm\xB3")},{name:"gram per cubic meter (g/m\xB3)",id:"congm3",fn:ie("g/m\xB3")},{name:"gram per normal cubic meter (g/Nm\xB3)",id:"congNm3",fn:ie("g/Nm\xB3")},{name:"milligrams per decilitre (mg/dL)",id:"conmgdL",fn:ie("mg/dL")},{name:"millimoles per litre (mmol/L)",id:"conmmolL",fn:ie("mmol/L")}]},{name:"Currency",formats:[{name:"Dollars ($)",id:"currencyUSD",fn:W("$")},{name:"Pounds (\xA3)",id:"currencyGBP",fn:W("\xA3")},{name:"Euro (\u20AC)",id:"currencyEUR",fn:W("\u20AC")},{name:"Yen (\xA5)",id:"currencyJPY",fn:W("\xA5")},{name:"Rubles (\u20BD)",id:"currencyRUB",fn:W("\u20BD")},{name:"Hryvnias (\u20B4)",id:"currencyUAH",fn:W("\u20B4")},{name:"Real (R$)",id:"currencyBRL",fn:W("R$")},{name:"Danish Krone (kr)",id:"currencyDKK",fn:W("kr",!0)},{name:"Icelandic Kr\xF3na (kr)",id:"currencyISK",fn:W("kr",!0)},{name:"Norwegian Krone (kr)",id:"currencyNOK",fn:W("kr",!0)},{name:"Swedish Krona (kr)",id:"currencySEK",fn:W("kr",!0)},{name:"Czech koruna (czk)",id:"currencyCZK",fn:W("czk")},{name:"Swiss franc (CHF)",id:"currencyCHF",fn:W("CHF")},{name:"Polish Z\u0142oty (PLN)",id:"currencyPLN",fn:W("PLN")},{name:"Bitcoin (\u0E3F)",id:"currencyBTC",fn:W("\u0E3F")},{name:"Milli Bitcoin (\u0E3F)",id:"currencymBTC",fn:W("mBTC")},{name:"Micro Bitcoin (\u0E3F)",id:"currency\u03BCBTC",fn:W("\u03BCBTC")},{name:"South African Rand (R)",id:"currencyZAR",fn:W("R")},{name:"Indian Rupee (\u20B9)",id:"currencyINR",fn:W("\u20B9")},{name:"South Korean Won (\u20A9)",id:"currencyKRW",fn:W("\u20A9")},{name:"Indonesian Rupiah (Rp)",id:"currencyIDR",fn:W("Rp")},{name:"Philippine Peso (PHP)",id:"currencyPHP",fn:W("PHP")},{name:"Vietnamese Dong (VND)",id:"currencyVND",fn:W("\u0111",!0)}]},{name:"Data",formats:[{name:"bytes(IEC)",id:"bytes",fn:q("B")},{name:"bytes(SI)",id:"decbytes",fn:Y("B")},{name:"bits(IEC)",id:"bits",fn:q("b")},{name:"bits(SI)",id:"decbits",fn:Y("b")},{name:"kibibytes",id:"kbytes",fn:q("B",1)},{name:"kilobytes",id:"deckbytes",fn:Y("B",1)},{name:"mebibytes",id:"mbytes",fn:q("B",2)},{name:"megabytes",id:"decmbytes",fn:Y("B",2)},{name:"gibibytes",id:"gbytes",fn:q("B",3)},{name:"gigabytes",id:"decgbytes",fn:Y("B",3)},{name:"tebibytes",id:"tbytes",fn:q("B",4)},{name:"terabytes",id:"dectbytes",fn:Y("B",4)},{name:"pebibytes",id:"pbytes",fn:q("B",5)},{name:"petabytes",id:"decpbytes",fn:Y("B",5)}]},{name:"Data rate",formats:[{name:"packets/sec",id:"pps",fn:Y("p/s")},{name:"bytes/sec(IEC)",id:"binBps",fn:q("B/s")},{name:"bytes/sec(SI)",id:"Bps",fn:Y("B/s")},{name:"bits/sec(IEC)",id:"binbps",fn:q("b/s")},{name:"bits/sec(SI)",id:"bps",fn:Y("b/s")},{name:"kibibytes/sec",id:"KiBs",fn:q("B/s",1)},{name:"kibibits/sec",id:"Kibits",fn:q("b/s",1)},{name:"kilobytes/sec",id:"KBs",fn:Y("B/s",1)},{name:"kilobits/sec",id:"Kbits",fn:Y("b/s",1)},{name:"mebibytes/sec",id:"MiBs",fn:q("B/s",2)},{name:"mebibits/sec",id:"Mibits",fn:q("b/s",2)},{name:"megabytes/sec",id:"MBs",fn:Y("B/s",2)},{name:"megabits/sec",id:"Mbits",fn:Y("b/s",2)},{name:"gibibytes/sec",id:"GiBs",fn:q("B/s",3)},{name:"gibibits/sec",id:"Gibits",fn:q("b/s",3)},{name:"gigabytes/sec",id:"GBs",fn:Y("B/s",3)},{name:"gigabits/sec",id:"Gbits",fn:Y("b/s",3)},{name:"tebibytes/sec",id:"TiBs",fn:q("B/s",4)},{name:"tebibits/sec",id:"Tibits",fn:q("b/s",4)},{name:"terabytes/sec",id:"TBs",fn:Y("B/s",4)},{name:"terabits/sec",id:"Tbits",fn:Y("b/s",4)},{name:"pebibytes/sec",id:"PiBs",fn:q("B/s",5)},{name:"pebibits/sec",id:"Pibits",fn:q("b/s",5)},{name:"petabytes/sec",id:"PBs",fn:Y("B/s",5)},{name:"petabits/sec",id:"Pbits",fn:Y("b/s",5)}]},{name:"Date & time",formats:[{name:"Datetime ISO",id:"dateTimeAsIso",fn:T},{name:"Datetime ISO (No date if today)",id:"dateTimeAsIsoNoDateIfToday",fn:j},{name:"Datetime US",id:"dateTimeAsUS",fn:K},{name:"Datetime US (No date if today)",id:"dateTimeAsUSNoDateIfToday",fn:F},{name:"Datetime local",id:"dateTimeAsLocal",fn:$()},{name:"Datetime local (No date if today)",id:"dateTimeAsLocalNoDateIfToday",fn:R()},{name:"Datetime default",id:"dateTimeAsSystem",fn:U},{name:"From Now",id:"dateTimeFromNow",fn:H}]},{name:"Energy",formats:[{name:"Watt (W)",id:"watt",fn:Y("W")},{name:"Kilowatt (kW)",id:"kwatt",fn:Y("W",1)},{name:"Megawatt (MW)",id:"megwatt",fn:Y("W",2)},{name:"Gigawatt (GW)",id:"gwatt",fn:Y("W",3)},{name:"Milliwatt (mW)",id:"mwatt",fn:Y("W",-1)},{name:"Watt per square meter (W/m\xB2)",id:"Wm2",fn:ie("W/m\xB2")},{name:"Volt-Ampere (VA)",id:"voltamp",fn:Y("VA")},{name:"Kilovolt-Ampere (kVA)",id:"kvoltamp",fn:Y("VA",1)},{name:"Volt-Ampere reactive (VAr)",id:"voltampreact",fn:Y("VAr")},{name:"Kilovolt-Ampere reactive (kVAr)",id:"kvoltampreact",fn:Y("VAr",1)},{name:"Watt-hour (Wh)",id:"watth",fn:Y("Wh")},{name:"Watt-hour per Kilogram (Wh/kg)",id:"watthperkg",fn:Y("Wh/kg")},{name:"Kilowatt-hour (kWh)",id:"kwatth",fn:Y("Wh",1)},{name:"Kilowatt-min (kWm)",id:"kwattm",fn:Y("W-Min",1)},{name:"Ampere-hour (Ah)",id:"amph",fn:Y("Ah")},{name:"Kiloampere-hour (kAh)",id:"kamph",fn:Y("Ah",1)},{name:"Milliampere-hour (mAh)",id:"mamph",fn:Y("Ah",-1)},{name:"Joule (J)",id:"joule",fn:Y("J")},{name:"Electron volt (eV)",id:"ev",fn:Y("eV")},{name:"Ampere (A)",id:"amp",fn:Y("A")},{name:"Kiloampere (kA)",id:"kamp",fn:Y("A",1)},{name:"Milliampere (mA)",id:"mamp",fn:Y("A",-1)},{name:"Volt (V)",id:"volt",fn:Y("V")},{name:"Kilovolt (kV)",id:"kvolt",fn:Y("V",1)},{name:"Millivolt (mV)",id:"mvolt",fn:Y("V",-1)},{name:"Decibel-milliwatt (dBm)",id:"dBm",fn:Y("dBm")},{name:"Ohm (\u03A9)",id:"ohm",fn:Y("\u03A9")},{name:"Kiloohm (k\u03A9)",id:"kohm",fn:Y("\u03A9",1)},{name:"Megaohm (M\u03A9)",id:"Mohm",fn:Y("\u03A9",2)},{name:"Farad (F)",id:"farad",fn:Y("F")},{name:"Microfarad (\xB5F)",id:"\xB5farad",fn:Y("F",-2)},{name:"Nanofarad (nF)",id:"nfarad",fn:Y("F",-3)},{name:"Picofarad (pF)",id:"pfarad",fn:Y("F",-4)},{name:"Femtofarad (fF)",id:"ffarad",fn:Y("F",-5)},{name:"Henry (H)",id:"henry",fn:Y("H")},{name:"Millihenry (mH)",id:"mhenry",fn:Y("H",-1)},{name:"Microhenry (\xB5H)",id:"\xB5henry",fn:Y("H",-2)},{name:"Lumens (Lm)",id:"lumens",fn:Y("Lm")}]},{name:"Flow",formats:[{name:"Gallons/min (gpm)",id:"flowgpm",fn:ie("gpm")},{name:"Cubic meters/sec (cms)",id:"flowcms",fn:ie("cms")},{name:"Cubic feet/sec (cfs)",id:"flowcfs",fn:ie("cfs")},{name:"Cubic feet/min (cfm)",id:"flowcfm",fn:ie("cfm")},{name:"Litre/hour",id:"litreh",fn:ie("L/h")},{name:"Litre/min (L/min)",id:"flowlpm",fn:ie("L/min")},{name:"milliLitre/min (mL/min)",id:"flowmlpm",fn:ie("mL/min")},{name:"Lux (lx)",id:"lux",fn:ie("lux")}]},{name:"Force",formats:[{name:"Newton-meters (Nm)",id:"forceNm",fn:Y("Nm")},{name:"Kilonewton-meters (kNm)",id:"forcekNm",fn:Y("Nm",1)},{name:"Newtons (N)",id:"forceN",fn:Y("N")},{name:"Kilonewtons (kN)",id:"forcekN",fn:Y("N",1)}]},{name:"Hash rate",formats:[{name:"hashes/sec",id:"Hs",fn:Y("H/s")},{name:"kilohashes/sec",id:"KHs",fn:Y("H/s",1)},{name:"megahashes/sec",id:"MHs",fn:Y("H/s",2)},{name:"gigahashes/sec",id:"GHs",fn:Y("H/s",3)},{name:"terahashes/sec",id:"THs",fn:Y("H/s",4)},{name:"petahashes/sec",id:"PHs",fn:Y("H/s",5)},{name:"exahashes/sec",id:"EHs",fn:Y("H/s",6)}]},{name:"Mass",formats:[{name:"milligram (mg)",id:"massmg",fn:Y("g",-1)},{name:"gram (g)",id:"massg",fn:Y("g")},{name:"pound (lb)",id:"masslb",fn:ie("lb")},{name:"kilogram (kg)",id:"masskg",fn:Y("g",1)},{name:"metric ton (t)",id:"masst",fn:ie("t")}]},{name:"Length",formats:[{name:"millimeter (mm)",id:"lengthmm",fn:Y("m",-1)},{name:"inch (in)",id:"lengthin",fn:ie("in")},{name:"feet (ft)",id:"lengthft",fn:ie("ft")},{name:"meter (m)",id:"lengthm",fn:Y("m")},{name:"kilometer (km)",id:"lengthkm",fn:Y("m",1)},{name:"mile (mi)",id:"lengthmi",fn:ie("mi")}]},{name:"Pressure",formats:[{name:"Millibars",id:"pressurembar",fn:Y("bar",-1)},{name:"Bars",id:"pressurebar",fn:Y("bar")},{name:"Kilobars",id:"pressurekbar",fn:Y("bar",1)},{name:"Pascals",id:"pressurepa",fn:Y("Pa")},{name:"Hectopascals",id:"pressurehpa",fn:ie("hPa")},{name:"Kilopascals",id:"pressurekpa",fn:ie("kPa")},{name:"Inches of mercury",id:"pressurehg",fn:ie('"Hg')},{name:"PSI",id:"pressurepsi",fn:ue(1e3,["psi","ksi","Mpsi"])}]},{name:"Radiation",formats:[{name:"Becquerel (Bq)",id:"radbq",fn:Y("Bq")},{name:"curie (Ci)",id:"radci",fn:Y("Ci")},{name:"Gray (Gy)",id:"radgy",fn:Y("Gy")},{name:"rad",id:"radrad",fn:Y("rad")},{name:"Sievert (Sv)",id:"radsv",fn:Y("Sv")},{name:"milliSievert (mSv)",id:"radmsv",fn:Y("Sv",-1)},{name:"microSievert (\xB5Sv)",id:"radusv",fn:Y("Sv",-2)},{name:"rem",id:"radrem",fn:Y("rem")},{name:"Exposure (C/kg)",id:"radexpckg",fn:Y("C/kg")},{name:"roentgen (R)",id:"radr",fn:Y("R")},{name:"Sievert/hour (Sv/h)",id:"radsvh",fn:Y("Sv/h")},{name:"milliSievert/hour (mSv/h)",id:"radmsvh",fn:Y("Sv/h",-1)},{name:"microSievert/hour (\xB5Sv/h)",id:"radusvh",fn:Y("Sv/h",-2)}]},{name:"Rotational Speed",formats:[{name:"Revolutions per minute (rpm)",id:"rotrpm",fn:ie("rpm")},{name:"Hertz (Hz)",id:"rothz",fn:Y("Hz")},{name:"Radians per second (rad/s)",id:"rotrads",fn:ie("rad/s")},{name:"Degrees per second (\xB0/s)",id:"rotdegs",fn:ie("\xB0/s")}]},{name:"Temperature",formats:[{name:"Celsius (\xB0C)",id:"celsius",fn:ie("\xB0C")},{name:"Fahrenheit (\xB0F)",id:"fahrenheit",fn:ie("\xB0F")},{name:"Kelvin (K)",id:"kelvin",fn:ie("K")}]},{name:"Time",formats:[{name:"Hertz (1/s)",id:"hertz",fn:Y("Hz")},{name:"nanoseconds (ns)",id:"ns",fn:w},{name:"microseconds (\xB5s)",id:"\xB5s",fn:_},{name:"milliseconds (ms)",id:"ms",fn:C},{name:"seconds (s)",id:"s",fn:g},{name:"minutes (m)",id:"m",fn:v},{name:"hours (h)",id:"h",fn:y},{name:"days (d)",id:"d",fn:h},{name:"duration (ms)",id:"dtdurationms",fn:r},{name:"duration (s)",id:"dtdurations",fn:u},{name:"duration (hh:mm:ss)",id:"dthms",fn:p},{name:"duration (d hh:mm:ss)",id:"dtdhms",fn:S},{name:"Timeticks (s/100)",id:"timeticks",fn:k},{name:"clock (ms)",id:"clockms",fn:D},{name:"clock (s)",id:"clocks",fn:M}]},{name:"Throughput",formats:[{name:"counts/sec (cps)",id:"cps",fn:qe("c/s")},{name:"ops/sec (ops)",id:"ops",fn:qe("ops/s")},{name:"requests/sec (rps)",id:"reqps",fn:qe("req/s")},{name:"reads/sec (rps)",id:"rps",fn:qe("rd/s")},{name:"writes/sec (wps)",id:"wps",fn:qe("wr/s")},{name:"I/O ops/sec (iops)",id:"iops",fn:qe("io/s")},{name:"counts/min (cpm)",id:"cpm",fn:qe("c/m")},{name:"ops/min (opm)",id:"opm",fn:qe("ops/m")},{name:"requests/min (rpm)",id:"reqpm",fn:qe("req/m")},{name:"reads/min (rpm)",id:"rpm",fn:qe("rd/m")},{name:"writes/min (wpm)",id:"wpm",fn:qe("wr/m")}]},{name:"Velocity",formats:[{name:"meters/second (m/s)",id:"velocityms",fn:ie("m/s")},{name:"kilometers/hour (km/h)",id:"velocitykmh",fn:ie("km/h")},{name:"miles/hour (mph)",id:"velocitymph",fn:ie("mph")},{name:"knot (kn)",id:"velocityknot",fn:ie("kn")}]},{name:"Volume",formats:[{name:"millilitre (mL)",id:"mlitre",fn:Y("L",-1)},{name:"litre (L)",id:"litre",fn:Y("L")},{name:"cubic meter",id:"m3",fn:ie("m\xB3")},{name:"Normal cubic meter",id:"Nm3",fn:ie("Nm\xB3")},{name:"cubic decimeter",id:"dm3",fn:ie("dm\xB3")},{name:"gallons",id:"gallons",fn:ie("gal")}]},{name:"Boolean",formats:[{name:"True / False",id:"bool",fn:Le("True","False")},{name:"Yes / No",id:"bool_yes_no",fn:Le("Yes","No")},{name:"On / Off",id:"bool_on_off",fn:Le("On","Off")}]}];var re=Math.pow;function je(J){var L,fe;return`${(L=J.prefix)!=null?L:""}${J.text}${(fe=J.suffix)!=null?fe:""}`}let me=[];const ne={};let Z=!1;function te(J,L){if(J===null)return"";if(J===Number.NEGATIVE_INFINITY||J===Number.POSITIVE_INFINITY)return J.toLocaleString();if(L==null&&(L=Pe(J)),J===0)return J.toFixed(L);const fe=L?Math.pow(10,Math.max(0,L)):1,xe=String(Math.round(J*fe)/fe);if(xe.indexOf("e")!==-1||J===0)return xe;const We=xe.indexOf("."),Ue=We===-1?0:xe.length-We-1;return Ue<L?(Ue?xe:xe+".")+String(fe).slice(1,L-Ue+1):xe}function Pe(J){const L=Math.abs(J);let xe=-Math.floor(Math.log(L)/Math.LN10)+1;const We=Math.pow(10,-xe);return L/We>2.25&&++xe,J%1===0&&(xe=0),Math.max(0,xe)}function he(J,L,fe){return{text:te(J,L),suffix:fe}}function ie(J,L){return(fe,xe)=>{if(fe===null)return{text:""};const We=te(fe,xe);return J?L?{text:We,prefix:J}:{text:We,suffix:" "+J}:{text:We}}}function Ce(J){return J&&J.startsWith("bool")}function Le(J,L){return fe=>({text:fe?J:L})}const we=(J,L)=>Math.log10(L)/Math.log10(J);function ue(J,L,fe=0){return(xe,We)=>{if(xe==null)return{text:""};if(xe===Number.NEGATIVE_INFINITY||xe===Number.POSITIVE_INFINITY||isNaN(xe))return{text:xe.toLocaleString()};const Ue=xe===0?0:Math.floor(we(J,Math.abs(xe))),at=L[(0,t.clamp)(fe+Ue,0,L.length-1)];return{text:te(xe/re(J,(0,t.clamp)(Ue,-fe,L.length-fe-1)),We),suffix:at}}}function Ie(J,L){return J==null?{text:""}:{text:J.toLocaleString(void 0,{maximumFractionDigits:L!=null?L:void 0})}}function qe(J){const fe=ue(1e3,["","K","M","B","T"]);return(xe,We,Ue)=>{if(xe===null)return{text:""};const at=fe(xe,We,Ue);return at.suffix+=" "+J,at}}function Je(J){return{text:`${J}`}}function Ze(){me=ve();for(const J of me)for(const L of J.formats)ne[L.id]=L.fn;[{from:"farenheit",to:"fahrenheit"}].forEach(J=>{const L=ne[J.to];L&&(ne[J.from]=L)}),Z=!0}function Oe(J){if(!J)return ie("");Z||Ze();const L=ne[J];if(!L&&J){let fe=J.indexOf(":");if(fe>0){const xe=J.substring(0,fe),We=J.substring(fe+1);if(xe==="prefix")return ie(We,!0);if(xe==="suffix")return ie(We,!1);if(xe==="time")return I(We);if(xe==="si"){const Ue=P(We.charAt(0)),at=Ue===0?We:We.substring(1);return Y(at,Ue)}if(xe==="count")return qe(We);if(xe==="currency")return W(We);if(xe==="bool"){if(fe=We.indexOf("/"),fe>=0){const Ue=We.substring(0,fe),at=We.substring(fe+1);return Le(Ue,at)}return Le(We,"-")}}return ie(J)}return L}function ce(){return Z||Ze(),ne}function pe(){return Z||Ze(),me.map(J=>({text:J.name,submenu:J.formats.map(L=>({text:L.name,value:L.id}))}))}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/ArrayVector.ts":function(se,V,e){"use strict";e.d(V,{G:function(){return n}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/FunctionalVector.ts");class n extends t.G{constructor(l){super(),this.buffer=l||[]}get length(){return this.buffer.length}add(l){this.buffer.push(l)}get(l){return this.buffer[l]}set(l,f){this.buffer[l]=f}reverse(){this.buffer.reverse()}toArray(){return this.buffer}toJSON(){return this.buffer}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/FunctionalVector.ts":function(se,V,e){"use strict";e.d(V,{G:function(){return n}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/vectorToArray.ts");class n{*iterator(){for(let f=0;f<this.length;f++)yield this.get(f)}[Symbol.iterator](){return this.iterator()}forEach(f){return a(this).forEach(f)}map(f){return a(this).map(f)}filter(f){return a(this).filter(f)}toArray(){return(0,t.n)(this)}toJSON(){return this.toArray()}}function a(l){return{*[Symbol.iterator](){for(let f=0;f<l.length;f++)yield l.get(f)},forEach(f){for(let x=0;x<l.length;x++)f(l.get(x))},map(f){const x=[];for(let d=0;d<l.length;d++)x.push(f(l.get(d),d));return x},filter(f){const x=[];for(const d of this)f(d)&&x.push(d);return x}}}},"../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/vectorToArray.ts":function(se,V,e){"use strict";e.d(V,{n:function(){return t}});function t(n){const a=Array(n.length);for(let l=0;l<n.length;l++)a[l]=n.get(l);return a}},"./src/components/Alert/InlineBanner.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return g},WithActions:function(){return v}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/components/Alert/Alert.tsx"),l=e("./src/components/Layout/Layout.tsx"),f=e("./src/utils/storybook/withCenteredStory.tsx"),x=e("./src/components/Alert/Alert.mdx"),d=Object.defineProperty,i=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable,O=(y,h,s)=>h in y?d(y,h,{enumerable:!0,configurable:!0,writable:!0,value:s}):y[h]=s,m=(y,h)=>{for(var s in h||(h={}))c.call(h,s)&&O(y,s,h[s]);if(i)for(var s of i(h))E.call(h,s)&&O(y,s,h[s]);return y},w=`import { action } from '@storybook/addon-actions';
import { ComponentStory, Meta } from '@storybook/react';
import React from 'react';

import { Alert, AlertVariant, VerticalGroup } from '@grafana/ui';

import { withCenteredStory, withHorizontallyCenteredStory } from '../../utils/storybook/withCenteredStory';
import mdx from '../Alert/Alert.mdx';

const severities: AlertVariant[] = ['error', 'warning', 'info', 'success'];

const meta: Meta = {
  title: 'Overlays/Alert/InlineBanner',
  component: Alert,
  decorators: [withCenteredStory, withHorizontallyCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: { exclude: ['onRemove'] },
  },
  argTypes: {
    severity: {
      control: { type: 'select', options: severities },
    },
  },
};

export const Basic: ComponentStory<typeof Alert> = (args) => {
  return (
    <div>
      <Alert {...args}>
        <VerticalGroup>
          <div>Child content that includes some alert details, like maybe what actually happened.</div>
        </VerticalGroup>
      </Alert>
    </div>
  );
};

Basic.args = {
  severity: 'error',
  title: 'Basic',
};

export const WithActions: ComponentStory<typeof Alert> = (args) => {
  return (
    <Alert {...args}>
      <VerticalGroup>
        <div>Child content that includes some alert details, like maybe what actually happened.</div>
      </VerticalGroup>
    </Alert>
  );
};

WithActions.args = {
  title: 'With action',
  severity: 'error',
  onRemove: action('Remove button clicked'),
  buttonContent: 'Close',
};

export default meta;
`,_={Basic:{startLoc:{col:51,line:29},endLoc:{col:1,line:39},startBody:{col:51,line:29},endBody:{col:1,line:39}},WithActions:{startLoc:{col:57,line:46},endLoc:{col:1,line:54},startBody:{col:57,line:46},endBody:{col:1,line:54}}};const C=["error","warning","info","success"],b={title:"Overlays/Alert/InlineBanner",component:a.b,decorators:[f.BU,f.zT],parameters:{docs:{page:x.Z},controls:{exclude:["onRemove"]}},argTypes:{severity:{control:{type:"select",options:C}}}},g=y=>n.createElement("div",null,n.createElement(a.b,m({},y),n.createElement(l.wc,null,n.createElement("div",null,"Child content that includes some alert details, like maybe what actually happened."))));g.args={severity:"error",title:"Basic"};const v=y=>n.createElement(a.b,m({},y),n.createElement(l.wc,null,n.createElement("div",null,"Child content that includes some alert details, like maybe what actually happened.")));v.args={title:"With action",severity:"error",onRemove:(0,t.action)("Remove button clicked"),buttonContent:"Close"},V.default=b,g.parameters=m({storySource:{source:`(args) => {
  return (
    <div>
      <Alert {...args}>
        <VerticalGroup>
          <div>Child content that includes some alert details, like maybe what actually happened.</div>
        </VerticalGroup>
      </Alert>
    </div>
  );
}`}},g.parameters),v.parameters=m({storySource:{source:`(args) => {
  return (
    <Alert {...args}>
      <VerticalGroup>
        <div>Child content that includes some alert details, like maybe what actually happened.</div>
      </VerticalGroup>
    </Alert>
  );
}`}},v.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Alert/InlineBanner.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Alert/InlineBanner.story.tsx#Meta"})}catch(y){}},"./src/components/Alert/Toast.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Toast:function(){return h}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/components/Alert/Alert.tsx"),l=e("./src/components/Layout/Layout.tsx"),f=e("./src/utils/storybook/withCenteredStory.tsx"),x=e("./src/components/Alert/Alert.mdx"),d=Object.defineProperty,i=Object.defineProperties,c=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(s,o,r)=>o in s?d(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,_=(s,o)=>{for(var r in o||(o={}))O.call(o,r)&&w(s,r,o[r]);if(E)for(var r of E(o))m.call(o,r)&&w(s,r,o[r]);return s},C=(s,o)=>i(s,c(o)),b=null,g={Toast:{startLoc:{col:51,line:32},endLoc:{col:1,line:42},startBody:{col:51,line:32},endBody:{col:1,line:42}}};const v=["error","warning","info","success"],y={title:"Overlays/Alert/Toast",component:a.b,decorators:[f.BU,f.zT],parameters:{docs:{page:x.Z},controls:{exclude:["onRemove"]}},argTypes:{severity:{control:{type:"select",options:v}}},args:{title:"Toast",severity:"error",onRemove:(0,t.action)("Remove button clicked")}},h=s=>n.createElement("div",{className:"page-alert-list"},n.createElement(a.b,C(_({},s),{elevated:!0}),n.createElement(l.wc,null,n.createElement("div",null,"Child content that includes some alert details, like maybe what actually happened."))));V.default=y,h.parameters=_({storySource:{source:`(args) => {
  return (
    <div className="page-alert-list">
      <Alert {...args} elevated>
        <VerticalGroup>
          <div>Child content that includes some alert details, like maybe what actually happened.</div>
        </VerticalGroup>
      </Alert>
    </div>
  );
}`}},h.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Alert/Toast.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Alert/Toast.story.tsx#ComponentMeta"})}catch(s){}},"./src/components/Badge/Badge.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return s},default:function(){return o}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Badge/Badge.tsx"),a=e("./src/utils/storybook/icons.ts"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),x=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),d=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function i(r){const u=Object.assign({h2:"h2",p:"p",code:"code"},(0,x.ah)(),r.components);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(d.h_,{title:"MDX|Badge",component:n.C}),`
`,(0,f.jsx)(u.h2,{children:"Badge"}),`
`,(0,f.jsxs)(u.p,{children:["The badge component adds meta information to other content, for example about release status or new elements. You can add any ",(0,f.jsx)(u.code,{children:"Icon"})," component or use the badge without an icon."]}),`
`,(0,f.jsx)(d.xP,{of:n.C})]})}function c(r={}){const{wrapper:u}=Object.assign({},(0,x.ah)(),r.components);return u?(0,f.jsx)(u,Object.assign({},r,{children:(0,f.jsx)(i,r)})):i(r)}var E=c,O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(r,u,p)=>u in r?O(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,b=(r,u)=>{for(var p in u||(u={}))w.call(u,p)&&C(r,p,u[p]);if(m)for(var p of m(u))_.call(u,p)&&C(r,p,u[p]);return r},g=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { Badge } from '@grafana/ui';

import { iconOptions } from '../../utils/storybook/icons';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './Badge.mdx';

const meta: ComponentMeta<typeof Badge> = {
  title: 'Data Display/Badge',
  component: Badge,
  decorators: [withCenteredStory],
  parameters: {
    docs: { page: mdx },
  },
  argTypes: {
    icon: { options: iconOptions, control: { type: 'select' } },
    color: { control: 'select' },
    text: { control: 'text' },
  },
};

const Template: ComponentStory<typeof Badge> = (args) => <Badge {...args} />;

export const Basic = Template.bind({});

Basic.args = {
  text: 'Badge label',
  color: 'blue',
  icon: 'rocket',
};

export default meta;
`,v={Basic:{startLoc:{col:47,line:25},endLoc:{col:76,line:25},startBody:{col:47,line:25},endBody:{col:76,line:25}}};const y={title:"Data Display/Badge",component:n.C,decorators:[l.BU],parameters:{docs:{page:E}},argTypes:{icon:{options:a.N,control:{type:"select"}},color:{control:"select"},text:{control:"text"}}},s=(r=>t.createElement(n.C,b({},r))).bind({});s.args={text:"Badge label",color:"blue",icon:"rocket"};var o=y;s.parameters=b({storySource:{source:"(args) => <Badge {...args} />"}},s.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Badge/Badge.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Badge/Badge.story.tsx#ComponentMeta"})}catch(r){}},"./src/components/BarGauge/BarGauge.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{barGaugeHorizontal:function(){return k},barGaugeVertical:function(){return S},default:function(){return D}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/thresholds.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/displayProcessor.ts"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/panel.ts"),x=e("./src/components/BarGauge/BarGauge.tsx"),d=e("../grafana-schema/src/common/common.gen.ts"),i=e("./src/themes/ThemeContext.tsx"),c=e("./src/utils/storybook/withCenteredStory.tsx"),E=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),O=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),m=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function w(M){const I=Object.assign({h1:"h1",h2:"h2",pre:"pre",code:"code"},(0,O.ah)(),M.components);return(0,E.jsxs)(E.Fragment,{children:[(0,E.jsx)(m.h_,{title:"MDX|BarGauge",component:x.xf}),`
`,(0,E.jsx)(I.h1,{children:"BarGauge"}),`
`,(0,E.jsx)(I.h2,{children:"Usage"}),`
`,(0,E.jsx)(I.pre,{children:(0,E.jsx)(I.code,{className:"language-tsx",children:`import { BarGauge, BarGaugeDisplayMode } from '@grafana/ui';
import { VizOrientation, ThresholdsMode, Field, FieldType, getDisplayProcessor } from '@grafana/data';

const field: Partial<Field> = {
  type: FieldType.number,
  config: {
    min: minValue,
    max: maxValue,
    thresholds: {
      mode: ThresholdsMode.Absolute,
      steps: [
        { value: -Infinity, color: 'green' },
        { value: threshold1Value, color: threshold1Color },
        { value: threshold2Value, color: threshold2Color },
      ],
    },
  },
};
field.display = getDisplayProcessor({ field });

const value = {
  text: value.toString(),
  title: title,
  numeric: value,
};

//...
<BarGauge
  value={70}
  field={field.config}
  display={field.display}
  value={value}
  orientation={VizOrientation.Vertical}
  displayMode={BarGaugeDisplayMode.Basic}
/>;
`})}),`
`,(0,E.jsx)(m.xP,{of:x.xf})]})}function _(M={}){const{wrapper:I}=Object.assign({},(0,O.ah)(),M.components);return I?(0,E.jsx)(I,Object.assign({},M,{children:(0,E.jsx)(w,M)})):w(M)}var C=_,b=Object.defineProperty,g=Object.getOwnPropertySymbols,v=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable,h=(M,I,T)=>I in M?b(M,I,{enumerable:!0,configurable:!0,writable:!0,value:T}):M[I]=T,s=(M,I)=>{for(var T in I||(I={}))v.call(I,T)&&h(M,T,I[T]);if(g)for(var T of g(I))y.call(I,T)&&h(M,T,I[T]);return M},o=`import { Story, Meta } from '@storybook/react';
import React from 'react';

import { VizOrientation, ThresholdsMode, Field, FieldType, getDisplayProcessor } from '@grafana/data';
import { BarGauge, BarGaugeDisplayMode } from '@grafana/ui';

import { useTheme2 } from '../../themes';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { Props } from './BarGauge';
import mdx from './BarGauge.mdx';

const meta: Meta = {
  title: 'Visualizations/BarGauge',
  component: BarGauge,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: [
        'theme',
        'field',
        'value',
        'display',
        'orientation',
        'text',
        'onClick',
        'className',
        'alignmentFactors',
      ],
    },
  },
  args: {
    numeric: 70,
    title: 'Title',
    minValue: 0,
    maxValue: 100,
    threshold1Value: 40,
    threshold1Color: 'orange',
    threshold2Value: 60,
    threshold2Color: 'red',
    displayMode: BarGaugeDisplayMode.Gradient,
    lcdCellWidth: 12,
    itemSpacing: 8,
    showUnfilled: true,
  },
  argTypes: {
    displayMode: {
      control: {
        type: 'select',
        options: [BarGaugeDisplayMode.Lcd, BarGaugeDisplayMode.Gradient, BarGaugeDisplayMode.Basic],
      },
    },
    width: { control: { type: 'range', min: 200, max: 800 } },
    height: { control: { type: 'range', min: 200, max: 800 } },
    threshold1Color: { control: 'color' },
    threshold2Color: { control: 'color' },
  },
};

interface StoryProps extends Partial<Props> {
  numeric: number;
  title: string;
  minValue: number;
  maxValue: number;
  threshold1Color: string;
  threshold2Color: string;
  threshold1Value: number;
  threshold2Value: number;
}

const AddBarGaugeStory = (storyProps: StoryProps) => {
  const theme = useTheme2();

  const field: Partial<Field> = {
    type: FieldType.number,
    config: {
      min: storyProps.minValue,
      max: storyProps.maxValue,
      thresholds: {
        mode: ThresholdsMode.Absolute,
        steps: [
          { value: -Infinity, color: 'green' },
          { value: storyProps.threshold1Value, color: storyProps.threshold1Color },
          { value: storyProps.threshold2Value, color: storyProps.threshold2Color },
        ],
      },
    },
  };
  field.display = getDisplayProcessor({ field, theme });

  const props: Partial<Props> = {
    theme,
    lcdCellWidth: storyProps.lcdCellWidth,
    itemSpacing: storyProps.itemSpacing,
    showUnfilled: storyProps.showUnfilled,
    width: storyProps.width,
    height: storyProps.height,
    value: {
      text: storyProps.numeric.toString(),
      title: storyProps.title,
      numeric: storyProps.numeric,
    },
    displayMode: storyProps.displayMode,
    orientation: storyProps.orientation,
    field: field.config!,
    display: field.display!,
  };

  return <BarGauge {...props} />;
};

export const barGaugeVertical: Story<StoryProps> = AddBarGaugeStory.bind({});
barGaugeVertical.args = {
  height: 500,
  width: 100,
  orientation: VizOrientation.Vertical,
};

export const barGaugeHorizontal: Story<StoryProps> = AddBarGaugeStory.bind({});
barGaugeHorizontal.args = {
  height: 100,
  width: 500,
  orientation: VizOrientation.Horizontal,
};

export default meta;
`,r={barGaugeVertical:{startLoc:{col:25,line:74},endLoc:{col:1,line:113},startBody:{col:25,line:74},endBody:{col:1,line:113}},barGaugeHorizontal:{startLoc:{col:25,line:74},endLoc:{col:1,line:113},startBody:{col:25,line:74},endBody:{col:1,line:113}}};const u={title:"Visualizations/BarGauge",component:x.xf,decorators:[c.BU],parameters:{docs:{page:C},controls:{exclude:["theme","field","value","display","orientation","text","onClick","className","alignmentFactors"]}},args:{numeric:70,title:"Title",minValue:0,maxValue:100,threshold1Value:40,threshold1Color:"orange",threshold2Value:60,threshold2Color:"red",displayMode:d.QH.Gradient,lcdCellWidth:12,itemSpacing:8,showUnfilled:!0},argTypes:{displayMode:{control:{type:"select",options:[d.QH.Lcd,d.QH.Gradient,d.QH.Basic]}},width:{control:{type:"range",min:200,max:800}},height:{control:{type:"range",min:200,max:800}},threshold1Color:{control:"color"},threshold2Color:{control:"color"}}},p=M=>{const I=(0,i.l4)(),T={type:n.fS.number,config:{min:M.minValue,max:M.maxValue,thresholds:{mode:a.H.Absolute,steps:[{value:-1/0,color:"green"},{value:M.threshold1Value,color:M.threshold1Color},{value:M.threshold2Value,color:M.threshold2Color}]}}};T.display=(0,l.U_)({field:T,theme:I});const j={theme:I,lcdCellWidth:M.lcdCellWidth,itemSpacing:M.itemSpacing,showUnfilled:M.showUnfilled,width:M.width,height:M.height,value:{text:M.numeric.toString(),title:M.title,numeric:M.numeric},displayMode:M.displayMode,orientation:M.orientation,field:T.config,display:T.display};return t.createElement(x.xf,s({},j))},S=p.bind({});S.args={height:500,width:100,orientation:f.wm.Vertical};const k=p.bind({});k.args={height:100,width:500,orientation:f.wm.Horizontal};var D=u;S.parameters=s({storySource:{source:`(storyProps: StoryProps) => {
  const theme = useTheme2();

  const field: Partial<Field> = {
    type: FieldType.number,
    config: {
      min: storyProps.minValue,
      max: storyProps.maxValue,
      thresholds: {
        mode: ThresholdsMode.Absolute,
        steps: [
          { value: -Infinity, color: 'green' },
          { value: storyProps.threshold1Value, color: storyProps.threshold1Color },
          { value: storyProps.threshold2Value, color: storyProps.threshold2Color },
        ],
      },
    },
  };
  field.display = getDisplayProcessor({ field, theme });

  const props: Partial<Props> = {
    theme,
    lcdCellWidth: storyProps.lcdCellWidth,
    itemSpacing: storyProps.itemSpacing,
    showUnfilled: storyProps.showUnfilled,
    width: storyProps.width,
    height: storyProps.height,
    value: {
      text: storyProps.numeric.toString(),
      title: storyProps.title,
      numeric: storyProps.numeric,
    },
    displayMode: storyProps.displayMode,
    orientation: storyProps.orientation,
    field: field.config!,
    display: field.display!,
  };

  return <BarGauge {...props} />;
}`}},S.parameters),k.parameters=s({storySource:{source:`(storyProps: StoryProps) => {
  const theme = useTheme2();

  const field: Partial<Field> = {
    type: FieldType.number,
    config: {
      min: storyProps.minValue,
      max: storyProps.maxValue,
      thresholds: {
        mode: ThresholdsMode.Absolute,
        steps: [
          { value: -Infinity, color: 'green' },
          { value: storyProps.threshold1Value, color: storyProps.threshold1Color },
          { value: storyProps.threshold2Value, color: storyProps.threshold2Color },
        ],
      },
    },
  };
  field.display = getDisplayProcessor({ field, theme });

  const props: Partial<Props> = {
    theme,
    lcdCellWidth: storyProps.lcdCellWidth,
    itemSpacing: storyProps.itemSpacing,
    showUnfilled: storyProps.showUnfilled,
    width: storyProps.width,
    height: storyProps.height,
    value: {
      text: storyProps.numeric.toString(),
      title: storyProps.title,
      numeric: storyProps.numeric,
    },
    displayMode: storyProps.displayMode,
    orientation: storyProps.orientation,
    field: field.config!,
    display: field.display!,
  };

  return <BarGauge {...props} />;
}`}},k.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BarGauge/BarGauge.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/BarGauge/BarGauge.story.tsx#Meta"})}catch(M){}},"./src/components/BigValue/BigValue.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return Ce},default:function(){return Le}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/ArrayVector.ts"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/utils/storybook/withCenteredStory.tsx"),x=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),d=e("./src/components/Button/Button.tsx"),i=e("./src/components/FormattedValueDisplay/FormattedValueDisplay.tsx"),c=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js"),E=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/panel.ts"),O=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),m=e("../grafana-schema/src/common/common.gen.ts"),w=e("./src/utils/colors.ts"),_=e("./src/utils/measureText.ts"),C=e("./src/components/Sparkline/Sparkline.tsx"),b=Object.defineProperty,g=Object.defineProperties,v=Object.getOwnPropertyDescriptors,y=Object.getOwnPropertySymbols,h=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,o=(we,ue,Ie)=>ue in we?b(we,ue,{enumerable:!0,configurable:!0,writable:!0,value:Ie}):we[ue]=Ie,r=(we,ue)=>{for(var Ie in ue||(ue={}))h.call(ue,Ie)&&o(we,Ie,ue[Ie]);if(y)for(var Ie of y(ue))s.call(ue,Ie)&&o(we,Ie,ue[Ie]);return we},u=(we,ue)=>g(we,v(ue));const p=1.2,S=30,k=500;class D{constructor(ue){this.props=ue;var Ie;const{width:qe,height:Je,value:Ze,text:Oe}=ue;this.valueColor=(Ie=Ze.color)!=null?Ie:"gray",this.panelPadding=Je>100?12:8,this.textValues=$(ue),this.justifyCenter=F(ue.justifyMode,this.textValues.title),this.valueToAlignTo=this.textValues.valueToAlignTo,this.titleToAlignTo=this.textValues.titleToAlignTo,this.titleFontSize=0,this.valueFontSize=0,this.chartHeight=0,this.chartWidth=0,this.maxTextWidth=qe-this.panelPadding*2,this.maxTextHeight=Je-this.panelPadding*2,Oe&&(Oe.titleSize&&(this.titleFontSize=Oe.titleSize,this.titleToAlignTo=void 0),Oe.valueSize&&(this.valueFontSize=Oe.valueSize,this.valueToAlignTo=""))}getTitleStyles(){const ue={fontSize:`${this.titleFontSize}px`,lineHeight:p};return this.props.parentOrientation===E.wm.Horizontal&&this.justifyCenter&&(ue.paddingRight="0.75ch"),(this.props.colorMode===R.Background||this.props.colorMode===R.BackgroundSolid)&&(ue.color=(0,w.bM)(this.valueColor,this.props.theme.isDark)),ue}getValueStyles(){const ue={fontSize:this.valueFontSize,fontWeight:k,lineHeight:p,position:"relative",zIndex:1};switch(this.justifyCenter&&(ue.textAlign="center"),this.props.colorMode){case R.Value:ue.color=this.valueColor;break;case R.Background:case R.BackgroundSolid:ue.color=(0,w.bM)(this.valueColor,this.props.theme.isDark);break;case R.None:ue.color=this.props.theme.colors.text.primary;break}return ue}getValueAndTitleContainerStyles(){const ue={display:"flex"};return this.justifyCenter&&(ue.alignItems="center",ue.justifyContent="center",ue.flexGrow=1),ue}getPanelStyles(){const{width:ue,height:Ie,theme:qe,colorMode:Je}=this.props,Ze={width:`${ue}px`,height:`${Ie}px`,padding:`${this.panelPadding}px`,borderRadius:qe.shape.borderRadius(),position:"relative",display:"flex"},Oe=qe.isDark?1:-.7;switch(Je){case R.Background:const ce=(0,c.Z)(this.valueColor).darken(15*Oe).spin(8).toRgbString(),pe=(0,c.Z)(this.valueColor).darken(5*Oe).spin(-8).toRgbString();Ze.background=`linear-gradient(120deg, ${ce}, ${pe})`;break;case R.BackgroundSolid:Ze.background=(0,c.Z)(this.valueColor).toString();break;case R.Value:Ze.background="transparent";break}return this.justifyCenter&&(Ze.alignItems="center",Ze.flexDirection="row"),Ze}renderChart(){var ue;const{sparkline:Ie,colorMode:qe}=this.props;if(!Ie||((ue=Ie.y)==null?void 0:ue.type)!==a.fS.number)return null;let Je,Ze;switch(qe){case R.Background:case R.BackgroundSolid:Je="rgba(255,255,255,0.4)",Ze=(0,c.Z)(this.valueColor).brighten(40).toRgbString();break;case R.None:case R.Value:default:Ze=this.valueColor,Je=(0,c.Z)(this.valueColor).setAlpha(.2).toRgbString();break}const Oe={custom:{drawStyle:m.l8.Line,lineWidth:1,fillColor:Je,lineColor:Ze}};return t.createElement("div",{style:this.getChartStyles()},t.createElement(C.b,{height:this.chartHeight,width:this.chartWidth,sparkline:Ie,config:Oe,theme:this.props.theme}))}getChartStyles(){return{position:"absolute",right:0,bottom:0}}}class M extends D{constructor(ue){var Ie,qe;super(ue);const Je=(Ie=this.titleToAlignTo)!=null&&Ie.length?.3:1;this.valueToAlignTo.length&&(this.valueFontSize=(0,_.MX)(this.valueToAlignTo,this.maxTextWidth*Je,this.maxTextHeight,p,void 0,k)),(qe=this.titleToAlignTo)!=null&&qe.length&&(this.titleFontSize=(0,_.MX)(this.titleToAlignTo,this.maxTextWidth*.6,this.maxTextHeight,p,S),this.titleFontSize=Math.min(this.valueFontSize*.7,this.titleFontSize))}getValueAndTitleContainerStyles(){const ue=super.getValueAndTitleContainerStyles();return ue.flexDirection="row",ue.alignItems="center",ue.flexGrow=1,this.justifyCenter||(ue.justifyContent="space-between"),ue}renderChart(){return null}getPanelStyles(){const ue=super.getPanelStyles();return ue.alignItems="center",ue}}class I extends D{constructor(ue){var Ie;super(ue);const{width:qe,height:Je}=ue,Ze=.5,Oe=.6,ce=1-Oe,pe=.4;this.chartWidth=qe,this.chartHeight=Je*Ze,(Ie=this.titleToAlignTo)!=null&&Ie.length&&(this.titleFontSize=(0,_.MX)(this.titleToAlignTo,this.maxTextWidth*Oe,this.maxTextHeight*pe,p,S)),this.valueToAlignTo.length&&(this.valueFontSize=(0,_.MX)(this.valueToAlignTo,this.maxTextWidth*ce,this.maxTextHeight*Ze,p,void 0,k))}getValueAndTitleContainerStyles(){const ue=super.getValueAndTitleContainerStyles();return ue.flexDirection="row",ue.flexGrow=1,this.justifyCenter||(ue.justifyContent="space-between"),ue}getPanelStyles(){const ue=super.getPanelStyles();return ue.flexDirection="row",ue.justifyContent="space-between",ue}}class T extends D{constructor(ue){var Ie,qe;super(ue);const{width:Je,height:Ze}=ue,Oe=.15,ce=.25;let pe=0;this.chartHeight=Ze*ce,this.chartWidth=Je,(Ie=this.titleToAlignTo)!=null&&Ie.length&&(this.titleFontSize=(0,_.MX)(this.titleToAlignTo,this.maxTextWidth,Ze*Oe,p,S),pe=this.titleFontSize*p),this.valueToAlignTo.length&&(this.valueFontSize=(0,_.MX)(this.valueToAlignTo,this.maxTextWidth,this.maxTextHeight-this.chartHeight-pe,p,void 0,k)),(qe=this.titleToAlignTo)!=null&&qe.length&&(this.titleFontSize=Math.min(this.valueFontSize*.7,this.titleFontSize)),this.chartHeight=Ze-this.titleFontSize*p-this.valueFontSize*p}getValueAndTitleContainerStyles(){const ue=super.getValueAndTitleContainerStyles();return ue.flexDirection="column",ue.justifyContent="center",ue}getPanelStyles(){const ue=super.getPanelStyles();return ue.flexDirection="column",ue}}class j extends D{constructor(ue){var Ie,qe;super(ue);const{height:Je}=ue,Ze=.15;let Oe=0;(Ie=this.titleToAlignTo)!=null&&Ie.length&&(this.titleFontSize=(0,_.MX)(this.titleToAlignTo,this.maxTextWidth,Je*Ze,p,S),Oe=this.titleFontSize*p),this.valueToAlignTo.length&&(this.valueFontSize=(0,_.MX)(this.valueToAlignTo,this.maxTextWidth,this.maxTextHeight-Oe,p,void 0,k)),(qe=this.titleToAlignTo)!=null&&qe.length&&(this.titleFontSize=Math.min(this.valueFontSize*.7,this.titleFontSize))}getValueAndTitleContainerStyles(){const ue=super.getValueAndTitleContainerStyles();return ue.flexDirection="column",ue.flexGrow=1,ue}renderChart(){return null}getPanelStyles(){const ue=super.getPanelStyles();return ue.alignItems="center",ue}}function K(we){const{width:ue,height:Ie,sparkline:qe}=we;return ue/Ie>2.5?Ie>50&&!!qe&&qe.y.values.length>1?new I(we):new M(we):Ie>100&&qe&&qe.y.values.length>1?new T(we):new j(we)}function F(we,ue){return we===H.Center?!0:(ue!=null?ue:"").length===0}function $(we){const{value:ue,alignmentFactors:Ie,count:qe}=we;let{textMode:Je}=we;const Ze=Ie?Ie.title:ue.title,Oe=(0,O.zc)(Ie||ue);switch(Je===W.Auto&&(qe!=null?qe:1)===1&&(Je=W.Value),Je){case W.Name:return u(r({},ue),{title:void 0,prefix:void 0,suffix:void 0,text:ue.title||"",titleToAlignTo:void 0,valueToAlignTo:Ze!=null?Ze:"",tooltip:(0,O.zc)(ue)});case W.Value:return u(r({},ue),{title:void 0,titleToAlignTo:void 0,valueToAlignTo:Oe,tooltip:ue.title});case W.None:return{numeric:ue.numeric,color:ue.color,title:void 0,text:"",titleToAlignTo:void 0,valueToAlignTo:"1",tooltip:`Name: ${ue.title}
Value: ${(0,O.zc)(ue)}`};case W.ValueAndName:default:return u(r({},ue),{titleToAlignTo:Ze,valueToAlignTo:Oe})}}try{K.displayName="buildLayout",K.__docgenInfo={description:"",displayName:"buildLayout",props:{height:{defaultValue:null,description:"Height of the component",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"Width of the component",name:"width",required:!0,type:{name:"number"}},value:{defaultValue:null,description:"Value displayed as Big Value",name:"value",required:!0,type:{name:"DisplayValue"}},sparkline:{defaultValue:null,description:"Sparkline values for showing a graph under/behind the value",name:"sparkline",required:!1,type:{name:"FieldSparkline"}},onClick:{defaultValue:null,description:"onClick handler for the value",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"Custom styling",name:"className",required:!1,type:{name:"string"}},colorMode:{defaultValue:null,description:"Color mode for coloring the value or the background",name:"colorMode",required:!0,type:{name:"enum",value:[{value:'"background"'},{value:'"background_solid"'},{value:'"none"'},{value:'"value"'}]}},graphMode:{defaultValue:null,description:"Show a graph behind/under the value",name:"graphMode",required:!0,type:{name:"enum",value:[{value:'"none"'},{value:'"line"'},{value:'"area"'}]}},justifyMode:{defaultValue:null,description:"Auto justify value and text or center it",name:"justifyMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"center"'}]}},alignmentFactors:{defaultValue:null,description:"Factors that should influence the positioning of the text",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},text:{defaultValue:null,description:"Explicit font size control",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},textMode:{defaultValue:null,description:"Specify which text should be visible in the BigValue",name:"textMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"value"'},{value:'"value_and_name"'},{value:'"name"'},{value:'"none"'}]}},hasLinks:{defaultValue:null,description:"If true disables the tooltip",name:"hasLinks",required:!1,type:{name:"boolean"}},parentOrientation:{defaultValue:null,description:"The orientation of the parent container",name:"parentOrientation",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},count:{defaultValue:null,description:`If part of a series of stat panes, this is the total number.
Used by BigValueTextMode.Auto text mode.`,name:"count",required:!1,type:{name:"number"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValueLayout.tsx#buildLayout"]={docgenInfo:K.__docgenInfo,name:"buildLayout",path:"src/components/BigValue/BigValueLayout.tsx#buildLayout"})}catch(we){}try{D.displayName="BigValueLayout",D.__docgenInfo={description:"",displayName:"BigValueLayout",props:{height:{defaultValue:null,description:"Height of the component",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"Width of the component",name:"width",required:!0,type:{name:"number"}},value:{defaultValue:null,description:"Value displayed as Big Value",name:"value",required:!0,type:{name:"DisplayValue"}},sparkline:{defaultValue:null,description:"Sparkline values for showing a graph under/behind the value",name:"sparkline",required:!1,type:{name:"FieldSparkline"}},onClick:{defaultValue:null,description:"onClick handler for the value",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"Custom styling",name:"className",required:!1,type:{name:"string"}},colorMode:{defaultValue:null,description:"Color mode for coloring the value or the background",name:"colorMode",required:!0,type:{name:"enum",value:[{value:'"background"'},{value:'"background_solid"'},{value:'"none"'},{value:'"value"'}]}},graphMode:{defaultValue:null,description:"Show a graph behind/under the value",name:"graphMode",required:!0,type:{name:"enum",value:[{value:'"none"'},{value:'"line"'},{value:'"area"'}]}},justifyMode:{defaultValue:null,description:"Auto justify value and text or center it",name:"justifyMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"center"'}]}},alignmentFactors:{defaultValue:null,description:"Factors that should influence the positioning of the text",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},text:{defaultValue:null,description:"Explicit font size control",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},textMode:{defaultValue:null,description:"Specify which text should be visible in the BigValue",name:"textMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"value"'},{value:'"value_and_name"'},{value:'"name"'},{value:'"none"'}]}},hasLinks:{defaultValue:null,description:"If true disables the tooltip",name:"hasLinks",required:!1,type:{name:"boolean"}},parentOrientation:{defaultValue:null,description:"The orientation of the parent container",name:"parentOrientation",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},count:{defaultValue:null,description:`If part of a series of stat panes, this is the total number.
Used by BigValueTextMode.Auto text mode.`,name:"count",required:!1,type:{name:"number"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValueLayout.tsx#BigValueLayout"]={docgenInfo:D.__docgenInfo,name:"BigValueLayout",path:"src/components/BigValue/BigValueLayout.tsx#BigValueLayout"})}catch(we){}try{M.displayName="WideNoChartLayout",M.__docgenInfo={description:"",displayName:"WideNoChartLayout",props:{height:{defaultValue:null,description:"Height of the component",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"Width of the component",name:"width",required:!0,type:{name:"number"}},value:{defaultValue:null,description:"Value displayed as Big Value",name:"value",required:!0,type:{name:"DisplayValue"}},sparkline:{defaultValue:null,description:"Sparkline values for showing a graph under/behind the value",name:"sparkline",required:!1,type:{name:"FieldSparkline"}},onClick:{defaultValue:null,description:"onClick handler for the value",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"Custom styling",name:"className",required:!1,type:{name:"string"}},colorMode:{defaultValue:null,description:"Color mode for coloring the value or the background",name:"colorMode",required:!0,type:{name:"enum",value:[{value:'"background"'},{value:'"background_solid"'},{value:'"none"'},{value:'"value"'}]}},graphMode:{defaultValue:null,description:"Show a graph behind/under the value",name:"graphMode",required:!0,type:{name:"enum",value:[{value:'"none"'},{value:'"line"'},{value:'"area"'}]}},justifyMode:{defaultValue:null,description:"Auto justify value and text or center it",name:"justifyMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"center"'}]}},alignmentFactors:{defaultValue:null,description:"Factors that should influence the positioning of the text",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},text:{defaultValue:null,description:"Explicit font size control",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},textMode:{defaultValue:null,description:"Specify which text should be visible in the BigValue",name:"textMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"value"'},{value:'"value_and_name"'},{value:'"name"'},{value:'"none"'}]}},hasLinks:{defaultValue:null,description:"If true disables the tooltip",name:"hasLinks",required:!1,type:{name:"boolean"}},parentOrientation:{defaultValue:null,description:"The orientation of the parent container",name:"parentOrientation",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},count:{defaultValue:null,description:`If part of a series of stat panes, this is the total number.
Used by BigValueTextMode.Auto text mode.`,name:"count",required:!1,type:{name:"number"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValueLayout.tsx#WideNoChartLayout"]={docgenInfo:M.__docgenInfo,name:"WideNoChartLayout",path:"src/components/BigValue/BigValueLayout.tsx#WideNoChartLayout"})}catch(we){}try{I.displayName="WideWithChartLayout",I.__docgenInfo={description:"",displayName:"WideWithChartLayout",props:{height:{defaultValue:null,description:"Height of the component",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"Width of the component",name:"width",required:!0,type:{name:"number"}},value:{defaultValue:null,description:"Value displayed as Big Value",name:"value",required:!0,type:{name:"DisplayValue"}},sparkline:{defaultValue:null,description:"Sparkline values for showing a graph under/behind the value",name:"sparkline",required:!1,type:{name:"FieldSparkline"}},onClick:{defaultValue:null,description:"onClick handler for the value",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"Custom styling",name:"className",required:!1,type:{name:"string"}},colorMode:{defaultValue:null,description:"Color mode for coloring the value or the background",name:"colorMode",required:!0,type:{name:"enum",value:[{value:'"background"'},{value:'"background_solid"'},{value:'"none"'},{value:'"value"'}]}},graphMode:{defaultValue:null,description:"Show a graph behind/under the value",name:"graphMode",required:!0,type:{name:"enum",value:[{value:'"none"'},{value:'"line"'},{value:'"area"'}]}},justifyMode:{defaultValue:null,description:"Auto justify value and text or center it",name:"justifyMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"center"'}]}},alignmentFactors:{defaultValue:null,description:"Factors that should influence the positioning of the text",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},text:{defaultValue:null,description:"Explicit font size control",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},textMode:{defaultValue:null,description:"Specify which text should be visible in the BigValue",name:"textMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"value"'},{value:'"value_and_name"'},{value:'"name"'},{value:'"none"'}]}},hasLinks:{defaultValue:null,description:"If true disables the tooltip",name:"hasLinks",required:!1,type:{name:"boolean"}},parentOrientation:{defaultValue:null,description:"The orientation of the parent container",name:"parentOrientation",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},count:{defaultValue:null,description:`If part of a series of stat panes, this is the total number.
Used by BigValueTextMode.Auto text mode.`,name:"count",required:!1,type:{name:"number"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValueLayout.tsx#WideWithChartLayout"]={docgenInfo:I.__docgenInfo,name:"WideWithChartLayout",path:"src/components/BigValue/BigValueLayout.tsx#WideWithChartLayout"})}catch(we){}try{T.displayName="StackedWithChartLayout",T.__docgenInfo={description:"",displayName:"StackedWithChartLayout",props:{height:{defaultValue:null,description:"Height of the component",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"Width of the component",name:"width",required:!0,type:{name:"number"}},value:{defaultValue:null,description:"Value displayed as Big Value",name:"value",required:!0,type:{name:"DisplayValue"}},sparkline:{defaultValue:null,description:"Sparkline values for showing a graph under/behind the value",name:"sparkline",required:!1,type:{name:"FieldSparkline"}},onClick:{defaultValue:null,description:"onClick handler for the value",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"Custom styling",name:"className",required:!1,type:{name:"string"}},colorMode:{defaultValue:null,description:"Color mode for coloring the value or the background",name:"colorMode",required:!0,type:{name:"enum",value:[{value:'"background"'},{value:'"background_solid"'},{value:'"none"'},{value:'"value"'}]}},graphMode:{defaultValue:null,description:"Show a graph behind/under the value",name:"graphMode",required:!0,type:{name:"enum",value:[{value:'"none"'},{value:'"line"'},{value:'"area"'}]}},justifyMode:{defaultValue:null,description:"Auto justify value and text or center it",name:"justifyMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"center"'}]}},alignmentFactors:{defaultValue:null,description:"Factors that should influence the positioning of the text",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},text:{defaultValue:null,description:"Explicit font size control",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},textMode:{defaultValue:null,description:"Specify which text should be visible in the BigValue",name:"textMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"value"'},{value:'"value_and_name"'},{value:'"name"'},{value:'"none"'}]}},hasLinks:{defaultValue:null,description:"If true disables the tooltip",name:"hasLinks",required:!1,type:{name:"boolean"}},parentOrientation:{defaultValue:null,description:"The orientation of the parent container",name:"parentOrientation",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},count:{defaultValue:null,description:`If part of a series of stat panes, this is the total number.
Used by BigValueTextMode.Auto text mode.`,name:"count",required:!1,type:{name:"number"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValueLayout.tsx#StackedWithChartLayout"]={docgenInfo:T.__docgenInfo,name:"StackedWithChartLayout",path:"src/components/BigValue/BigValueLayout.tsx#StackedWithChartLayout"})}catch(we){}try{j.displayName="StackedWithNoChartLayout",j.__docgenInfo={description:"",displayName:"StackedWithNoChartLayout",props:{height:{defaultValue:null,description:"Height of the component",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"Width of the component",name:"width",required:!0,type:{name:"number"}},value:{defaultValue:null,description:"Value displayed as Big Value",name:"value",required:!0,type:{name:"DisplayValue"}},sparkline:{defaultValue:null,description:"Sparkline values for showing a graph under/behind the value",name:"sparkline",required:!1,type:{name:"FieldSparkline"}},onClick:{defaultValue:null,description:"onClick handler for the value",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"Custom styling",name:"className",required:!1,type:{name:"string"}},colorMode:{defaultValue:null,description:"Color mode for coloring the value or the background",name:"colorMode",required:!0,type:{name:"enum",value:[{value:'"background"'},{value:'"background_solid"'},{value:'"none"'},{value:'"value"'}]}},graphMode:{defaultValue:null,description:"Show a graph behind/under the value",name:"graphMode",required:!0,type:{name:"enum",value:[{value:'"none"'},{value:'"line"'},{value:'"area"'}]}},justifyMode:{defaultValue:null,description:"Auto justify value and text or center it",name:"justifyMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"center"'}]}},alignmentFactors:{defaultValue:null,description:"Factors that should influence the positioning of the text",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},text:{defaultValue:null,description:"Explicit font size control",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},textMode:{defaultValue:null,description:"Specify which text should be visible in the BigValue",name:"textMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"value"'},{value:'"value_and_name"'},{value:'"name"'},{value:'"none"'}]}},hasLinks:{defaultValue:null,description:"If true disables the tooltip",name:"hasLinks",required:!1,type:{name:"boolean"}},parentOrientation:{defaultValue:null,description:"The orientation of the parent container",name:"parentOrientation",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},count:{defaultValue:null,description:`If part of a series of stat panes, this is the total number.
Used by BigValueTextMode.Auto text mode.`,name:"count",required:!1,type:{name:"number"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValueLayout.tsx#StackedWithNoChartLayout"]={docgenInfo:j.__docgenInfo,name:"StackedWithNoChartLayout",path:"src/components/BigValue/BigValueLayout.tsx#StackedWithNoChartLayout"})}catch(we){}var R=(we=>(we.Background="background",we.BackgroundSolid="background_solid",we.None="none",we.Value="value",we))(R||{}),U=(we=>(we.None="none",we.Line="line",we.Area="area",we))(U||{}),H=(we=>(we.Auto="auto",we.Center="center",we))(H||{}),W=(we=>(we.Auto="auto",we.Value="value",we.ValueAndName="value_and_name",we.Name="name",we.None="none",we))(W||{});class oe extends t.PureComponent{render(){const{onClick:ue,className:Ie,hasLinks:qe,theme:Je}=this.props,Ze=K(this.props),Oe=Ze.getPanelStyles(),ce=Ze.getValueAndTitleContainerStyles(),pe=Ze.getValueStyles(),J=Ze.getTitleStyles(),L=Ze.textValues,fe=qe?void 0:L.tooltip;return ue?t.createElement("button",{type:"button",className:(0,x.cx)((0,d.gN)(Je),Ie),style:Oe,onClick:ue,title:fe},t.createElement("div",{style:ce},L.title&&t.createElement("div",{style:J},L.title),t.createElement(i.W,{value:L,style:pe})),Ze.renderChart()):t.createElement("div",{className:Ie,style:Oe,title:fe},t.createElement("div",{style:ce},L.title&&t.createElement("div",{style:J},L.title),t.createElement(i.W,{value:L,style:pe})),Ze.renderChart())}}oe.defaultProps={justifyMode:"auto"};try{W.displayName="BigValueTextMode",W.__docgenInfo={description:"Options for how the value & title are to be displayed",displayName:"BigValueTextMode",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValue.tsx#BigValueTextMode"]={docgenInfo:W.__docgenInfo,name:"BigValueTextMode",path:"src/components/BigValue/BigValue.tsx#BigValueTextMode"})}catch(we){}try{oe.displayName="BigValue",oe.__docgenInfo={description:"",displayName:"BigValue",props:{height:{defaultValue:null,description:"Height of the component",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"Width of the component",name:"width",required:!0,type:{name:"number"}},value:{defaultValue:null,description:"Value displayed as Big Value",name:"value",required:!0,type:{name:"DisplayValue"}},sparkline:{defaultValue:null,description:"Sparkline values for showing a graph under/behind the value",name:"sparkline",required:!1,type:{name:"FieldSparkline"}},onClick:{defaultValue:null,description:"onClick handler for the value",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"Custom styling",name:"className",required:!1,type:{name:"string"}},colorMode:{defaultValue:null,description:"Color mode for coloring the value or the background",name:"colorMode",required:!0,type:{name:"enum",value:[{value:'"background"'},{value:'"background_solid"'},{value:'"none"'},{value:'"value"'}]}},graphMode:{defaultValue:null,description:"Show a graph behind/under the value",name:"graphMode",required:!0,type:{name:"enum",value:[{value:'"none"'},{value:'"line"'},{value:'"area"'}]}},justifyMode:{defaultValue:{value:"BigValueJustifyMode.Auto"},description:"Auto justify value and text or center it",name:"justifyMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"center"'}]}},alignmentFactors:{defaultValue:null,description:"Factors that should influence the positioning of the text",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},text:{defaultValue:null,description:"Explicit font size control",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},textMode:{defaultValue:null,description:"Specify which text should be visible in the BigValue",name:"textMode",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"value"'},{value:'"value_and_name"'},{value:'"name"'},{value:'"none"'}]}},hasLinks:{defaultValue:null,description:"If true disables the tooltip",name:"hasLinks",required:!1,type:{name:"boolean"}},parentOrientation:{defaultValue:null,description:"The orientation of the parent container",name:"parentOrientation",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},count:{defaultValue:null,description:`If part of a series of stat panes, this is the total number.
Used by BigValueTextMode.Auto text mode.`,name:"count",required:!1,type:{name:"number"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValue.tsx#BigValue"]={docgenInfo:oe.__docgenInfo,name:"BigValue",path:"src/components/BigValue/BigValue.tsx#BigValue"})}catch(we){}var Q=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),P=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),ae=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function q(we){const ue=Object.assign({h1:"h1",p:"p",a:"a",h3:"h3",h4:"h4",code:"code",ul:"ul",li:"li",pre:"pre"},(0,P.ah)(),we.components);return(0,Q.jsxs)(Q.Fragment,{children:[(0,Q.jsx)(ae.h_,{title:"MDX|BigValue",component:oe}),`
`,(0,Q.jsx)(ue.h1,{children:"BigValue"}),`
`,(0,Q.jsxs)(ue.p,{children:["Component for showing a value based on a ",(0,Q.jsx)(ue.a,{href:"https://github.com/grafana/grafana/blob/main/packages/grafana-data/src/types/displayValue.ts#L5",children:"DisplayValue"}),"."]}),`
`,(0,Q.jsx)(ue.h3,{children:"Display properties"}),`
`,(0,Q.jsx)(ue.p,{children:"There are a few properties that will determine the look of the BigValue."}),`
`,(0,Q.jsx)(ue.h4,{children:"Justify mode"}),`
`,(0,Q.jsx)(ue.p,{children:"There are two modes for aligning text, auto and center."}),`
`,(0,Q.jsx)(ue.h4,{children:"Graph mode"}),`
`,(0,Q.jsxs)(ue.p,{children:["You can control graph shown in BigValue with the ",(0,Q.jsx)(ue.code,{children:"GraphMode"})," property. ",(0,Q.jsx)(ue.code,{children:"GraphMode.Area"}),` renders a
graph in the behind the value. `,(0,Q.jsx)(ue.code,{children:"GrapMode.None"})," will hide it."]}),`
`,(0,Q.jsx)(ue.h4,{children:"Color mode"}),`
`,(0,Q.jsxs)(ue.p,{children:[(0,Q.jsx)(ue.code,{children:"ColorMode"}),` controls which part of the component that should have the color from thresholds or field config,
`,(0,Q.jsx)(ue.code,{children:"ColorMode.Background"})," and ",(0,Q.jsx)(ue.code,{children:"ColorMode.Value"}),"."]}),`
`,(0,Q.jsxs)(ue.p,{children:["Note, ",(0,Q.jsx)(ue.code,{children:"ColorMode.Value"})," will only set the color for the value."]}),`
`,(0,Q.jsx)(ue.h4,{children:"Text mode"}),`
`,(0,Q.jsx)(ue.p,{children:"There are four variants to render text:"}),`
`,(0,Q.jsxs)(ue.ul,{children:[`
`,(0,Q.jsxs)(ue.li,{children:[(0,Q.jsx)(ue.code,{children:"TextMode.Auto"})," - Show value and name if there's more than on BigValue in the same pane."]}),`
`,(0,Q.jsxs)(ue.li,{children:[(0,Q.jsx)(ue.code,{children:"TextMode.Value"})," - Show only the value."]}),`
`,(0,Q.jsxs)(ue.li,{children:[(0,Q.jsx)(ue.code,{children:"TextMode.ValueAndName"})," - Show value and the name."]}),`
`,(0,Q.jsxs)(ue.li,{children:[(0,Q.jsx)(ue.code,{children:"TextMode.None"})," - Do not show any value or name."]}),`
`]}),`
`,(0,Q.jsx)(ue.h3,{children:"Example usage"}),`
`,(0,Q.jsxs)(ue.p,{children:["An example usage is in the ",(0,Q.jsx)(ue.a,{href:"https://grafana.com/docs/grafana/latest/panels/visualizations/stat-panel/",children:"Stat panel"}),"."]}),`
`,(0,Q.jsx)(ue.pre,{children:(0,Q.jsx)(ue.code,{className:"language-tsx",children:`import { DisplayValue } from '@grafana/data';
import {
  BigValue,
  BigValueColorMode,
  BigValueGraphMode,
  BigValueJustifyMode,
  BigValueTextMode,
  useTheme,
} from '@grafana/ui';

const bigValue: DisplayValue = {
  color: 'red',
  value: '5000',
  numeric: 5000,
  title: 'Volume',
};

return (
  <BigValue
    theme={useTheme()}
    justifyMode={BigValueJustifyMode.Auto}
    graphMode={BigValueGraphMode.Area}
    colorMode={BigValueColorMode.Value}
    textMode={BigValueTextMode.Auto}
    value={bigValue}
  />
);
`})}),`
`,(0,Q.jsx)(ue.h3,{children:"Props"}),`
`,(0,Q.jsx)(ae.xP,{of:oe})]})}function Y(we={}){const{wrapper:ue}=Object.assign({},(0,P.ah)(),we.components);return ue?(0,Q.jsx)(ue,Object.assign({},we,{children:(0,Q.jsx)(q,we)})):q(we)}var ve=Y,re=Object.defineProperty,je=Object.getOwnPropertySymbols,me=Object.prototype.hasOwnProperty,ne=Object.prototype.propertyIsEnumerable,Z=(we,ue,Ie)=>ue in we?re(we,ue,{enumerable:!0,configurable:!0,writable:!0,value:Ie}):we[ue]=Ie,te=(we,ue)=>{for(var Ie in ue||(ue={}))me.call(ue,Ie)&&Z(we,Ie,ue[Ie]);if(je)for(var Ie of je(ue))ne.call(ue,Ie)&&Z(we,Ie,ue[Ie]);return we},Pe=`import { Story, Meta } from '@storybook/react';
import React from 'react';

import { ArrayVector, FieldSparkline, FieldType } from '@grafana/data';

import { useTheme2 } from '../../themes';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import {
  BigValue,
  BigValueColorMode,
  BigValueGraphMode,
  BigValueJustifyMode,
  BigValueTextMode,
  Props,
} from './BigValue';
import mdx from './BigValue.mdx';

const meta: Meta = {
  title: 'Visualizations/BigValue',
  component: BigValue,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['value', 'sparkline', 'onClick', 'className', 'alignmentFactors', 'text', 'count', 'theme'],
    },
  },
  argTypes: {
    width: { control: { type: 'range', min: 200, max: 800 } },
    height: { control: { type: 'range', min: 200, max: 800 } },
    colorMode: {
      control: { type: 'select', options: [BigValueColorMode.Value, BigValueColorMode.Background] },
    },
    graphMode: { control: { type: 'select', options: [BigValueGraphMode.Area, BigValueGraphMode.None] } },
    justifyMode: { control: { type: 'select', options: [BigValueJustifyMode.Auto, BigValueJustifyMode.Center] } },
    textMode: {
      control: {
        type: 'radio',
        options: [
          BigValueTextMode.Auto,
          BigValueTextMode.Name,
          BigValueTextMode.ValueAndName,
          BigValueTextMode.None,
          BigValueTextMode.Value,
        ],
      },
    },
    color: { control: 'color' },
  },
};

interface StoryProps extends Partial<Props> {
  numeric: number;
  title: string;
  color: string;
  valueText: string;
}

export const Basic: Story<StoryProps> = ({
  valueText,
  title,
  colorMode,
  graphMode,
  height,
  width,
  color,
  textMode,
  justifyMode,
}) => {
  const theme = useTheme2();
  const sparkline: FieldSparkline = {
    y: {
      name: '',
      values: new ArrayVector([1, 2, 3, 4, 3]),
      type: FieldType.number,
      state: { range: { min: 1, max: 4, delta: 3 } },
      config: {},
    },
  };

  return (
    <BigValue
      theme={theme}
      width={width}
      height={height}
      colorMode={colorMode}
      graphMode={graphMode}
      textMode={textMode}
      justifyMode={justifyMode}
      value={{
        text: valueText,
        numeric: 5022,
        color: color,
        title,
      }}
      sparkline={graphMode === BigValueGraphMode.None ? undefined : sparkline}
    />
  );
};

Basic.args = {
  valueText: '$5022',
  title: 'Total Earnings',
  colorMode: BigValueColorMode.Value,
  graphMode: BigValueGraphMode.Area,
  justifyMode: BigValueJustifyMode.Auto,
  width: 400,
  height: 300,
  color: 'red',
  textMode: BigValueTextMode.Auto,
};

export default meta;
`,he={Basic:{startLoc:{col:40,line:62},endLoc:{col:1,line:102},startBody:{col:40,line:62},endBody:{col:1,line:102}}};const ie={title:"Visualizations/BigValue",component:oe,decorators:[f.BU],parameters:{docs:{page:ve},controls:{exclude:["value","sparkline","onClick","className","alignmentFactors","text","count","theme"]}},argTypes:{width:{control:{type:"range",min:200,max:800}},height:{control:{type:"range",min:200,max:800}},colorMode:{control:{type:"select",options:[R.Value,R.Background]}},graphMode:{control:{type:"select",options:[U.Area,U.None]}},justifyMode:{control:{type:"select",options:[H.Auto,H.Center]}},textMode:{control:{type:"radio",options:[W.Auto,W.Name,W.ValueAndName,W.None,W.Value]}},color:{control:"color"}}},Ce=({valueText:we,title:ue,colorMode:Ie,graphMode:qe,height:Je,width:Ze,color:Oe,textMode:ce,justifyMode:pe})=>{const J=(0,l.l4)(),L={y:{name:"",values:new n.G([1,2,3,4,3]),type:a.fS.number,state:{range:{min:1,max:4,delta:3}},config:{}}};return t.createElement(oe,{theme:J,width:Ze,height:Je,colorMode:Ie,graphMode:qe,textMode:ce,justifyMode:pe,value:{text:we,numeric:5022,color:Oe,title:ue},sparkline:qe===U.None?void 0:L})};Ce.args={valueText:"$5022",title:"Total Earnings",colorMode:R.Value,graphMode:U.Area,justifyMode:H.Auto,width:400,height:300,color:"red",textMode:W.Auto};var Le=ie;Ce.parameters=te({storySource:{source:`({
  valueText,
  title,
  colorMode,
  graphMode,
  height,
  width,
  color,
  textMode,
  justifyMode,
}) => {
  const theme = useTheme2();
  const sparkline: FieldSparkline = {
    y: {
      name: '',
      values: new ArrayVector([1, 2, 3, 4, 3]),
      type: FieldType.number,
      state: { range: { min: 1, max: 4, delta: 3 } },
      config: {},
    },
  };

  return (
    <BigValue
      theme={theme}
      width={width}
      height={height}
      colorMode={colorMode}
      graphMode={graphMode}
      textMode={textMode}
      justifyMode={justifyMode}
      value={{
        text: valueText,
        numeric: 5022,
        color: color,
        title,
      }}
      sparkline={graphMode === BigValueGraphMode.None ? undefined : sparkline}
    />
  );
}`}},Ce.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BigValue/BigValue.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/BigValue/BigValue.story.tsx#Meta"})}catch(we){}},"./src/components/Button/Button.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return u},Examples:function(){return r},default:function(){return o}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/Card/Card.tsx"),l=e("./src/components/Layout/Layout.tsx"),f=e("./src/components/Button/Button.tsx"),x=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),d=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),i=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function c(p){const S=Object.assign({h1:"h1",h2:"h2",p:"p",code:"code",ol:"ol",li:"li"},(0,d.ah)(),p.components);return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(i.h_,{title:"MDX|Button",component:f.zx}),`
`,(0,x.jsx)(S.h1,{children:"Button"}),`
`,(0,x.jsx)(S.h2,{children:"Primary"}),`
`,(0,x.jsxs)(S.p,{children:['Used for "call to action", i.e. triggering the main action. There should never be more than one on a page. If you need multiple buttons for different actions, decide which action is the most important and make that the primary ',(0,x.jsx)(S.code,{children:"Button"}),". All other ",(0,x.jsx)(S.code,{children:"Button"})," components should be secondary."]}),`
`,(0,x.jsxs)(S.p,{children:["If there is no primary action, all ",(0,x.jsx)(S.code,{children:"Button"})," components should be secondary."]}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)("div",{children:[(0,x.jsx)(f.zx,{variant:"primary",size:"sm",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Small"})}),(0,x.jsx)(f.zx,{variant:"primary",size:"md",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Medium"})}),(0,x.jsx)(f.zx,{variant:"primary",size:"lg",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Large"})})]})}),`
`,(0,x.jsx)(S.h2,{children:"Secondary"}),`
`,(0,x.jsxs)(S.p,{children:["The secondary ",(0,x.jsx)(S.code,{children:"Button"})," is the default button style and can trigger various actions. How it is used depends on its surroundings:"]}),`
`,(0,x.jsxs)(S.ol,{children:[`
`,(0,x.jsxs)(S.li,{children:["When next to the primary ",(0,x.jsx)(S.code,{children:"Button"}),', the Secondary style can for example be used for "Cancel" or "Abort" actions.']}),`
`,(0,x.jsxs)(S.li,{children:["When there is no main important action on a given page, all ",(0,x.jsx)(S.code,{children:"Button"})," components should use the secondary style."]}),`
`]}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)("div",{children:[(0,x.jsx)(f.zx,{variant:"secondary",size:"sm",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Small"})}),(0,x.jsx)(f.zx,{variant:"secondary",size:"md",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Medium"})}),(0,x.jsx)(f.zx,{variant:"secondary",size:"lg",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Large"})})]})}),`
`,(0,x.jsx)(S.h2,{children:"Destructive"}),`
`,(0,x.jsxs)(S.p,{children:["Used for triggering a removing or deleting action. Because of its dominant coloring, it should be used sparingly. If you need multiple Destructive ",(0,x.jsx)(S.code,{children:"Button"})," components in one view, we recommend using a secondary ",(0,x.jsx)(S.code,{children:"Button"})," or Link variant instead and only use the Destructive variant to double confirm."]}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)("div",{children:[(0,x.jsx)(f.zx,{variant:"destructive",size:"sm",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Small"})}),(0,x.jsx)(f.zx,{variant:"destructive",size:"md",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Medium"})}),(0,x.jsx)(f.zx,{variant:"destructive",size:"lg",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Large"})})]})}),`
`,(0,x.jsx)(S.h2,{children:"Text"}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)("div",{children:[(0,x.jsx)(f.zx,{fill:"text",size:"sm",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Small"})}),(0,x.jsx)(f.zx,{fill:"text",size:"md",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Medium"})}),(0,x.jsx)(f.zx,{fill:"text",size:"lg",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Large"})})]})}),`
`,(0,x.jsx)(i.$4,{of:f.zx}),`
`,(0,x.jsx)(S.h2,{children:"Links"}),`
`,(0,x.jsxs)(S.p,{children:["To add an anchor that looks like a button use the ",(0,x.jsx)(S.code,{children:"<LinkButton>"})," component and pass a href prop."]}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)("div",{children:[(0,x.jsx)(f.Qj,{href:"/",size:"sm",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Small"})}),(0,x.jsx)(f.Qj,{href:"/",size:"md",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Medium"})}),(0,x.jsx)(f.Qj,{href:"/",size:"lg",style:{margin:"5px"},children:(0,x.jsx)(S.p,{children:"Large"})})]})})]})}function E(p={}){const{wrapper:S}=Object.assign({},(0,d.ah)(),p.components);return S?(0,x.jsx)(S,Object.assign({},p,{children:(0,x.jsx)(c,p)})):c(p)}var O=E,m=e("./src/components/Button/ButtonGroup.tsx"),w=Object.defineProperty,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(p,S,k)=>S in p?w(p,S,{enumerable:!0,configurable:!0,writable:!0,value:k}):p[S]=k,v=(p,S)=>{for(var k in S||(S={}))C.call(S,k)&&g(p,k,S[k]);if(_)for(var k of _(S))b.call(S,k)&&g(p,k,S[k]);return p},y=null,h={Examples:{startLoc:{col:55,line:39},endLoc:{col:1,line:105},startBody:{col:55,line:39},endBody:{col:1,line:105}},Basic:{startLoc:{col:52,line:107},endLoc:{col:95,line:107},startBody:{col:52,line:107},endBody:{col:95,line:107}}};const s=["lg","md","sm"];var o={title:"Buttons/Button",component:f.zx,decorators:[n.BU],parameters:{docs:{page:O}},argTypes:{size:{options:s},tooltip:{control:"text"},className:{table:{disable:!0}}}};const r=()=>t.createElement(l.wc,null,f.NC.map(p=>t.createElement(l.wc,{key:p},t.createElement(l.Lh,{spacing:"lg"},f.jg.map(S=>t.createElement(l.wc,{spacing:"lg",key:`${p}-${S}`},s.map(k=>t.createElement(f.zx,{variant:S,fill:p,size:k,key:k},S," ",k)),t.createElement(f.zx,{variant:S,fill:p,disabled:!0},S," disabled")))),t.createElement("div",{style:{padding:"20px 0",width:"100%"}}))),t.createElement(l.Lh,{spacing:"lg"},t.createElement("div",null,"With icon and text"),t.createElement(f.zx,{icon:"cloud",size:"sm"},"Configure"),t.createElement(f.zx,{icon:"cloud"},"Configure"),t.createElement(f.zx,{icon:"cloud",size:"lg"},"Configure")),t.createElement("div",null),t.createElement(l.Lh,{spacing:"lg"},t.createElement("div",null,"With icon only"),t.createElement(f.zx,{icon:"cloud",size:"sm"}),t.createElement(f.zx,{icon:"cloud",size:"md"}),t.createElement(f.zx,{icon:"cloud",size:"lg"})),t.createElement("div",null),t.createElement(f.zx,{icon:"plus",fullWidth:!0},"Button with fullWidth"),t.createElement("div",null),t.createElement(l.Lh,{spacing:"lg"},t.createElement("div",null,"Inside ButtonGroup"),t.createElement(m.h,null,t.createElement(f.zx,{icon:"sync"},"Run query"),t.createElement(f.zx,{icon:"angle-down"}))),t.createElement(a.Z,null,t.createElement(a.Z.Heading,null,"Button inside card"),t.createElement(a.Z.Actions,null,f.jg.map(p=>t.createElement(f.zx,{variant:p,key:p},p)),t.createElement(f.zx,{variant:"primary",disabled:!0},"Disabled")))),u=p=>t.createElement(f.zx,v({},p));u.args={children:"Example button",size:"md",variant:"primary",fill:"solid",type:"button"},r.parameters=v({storySource:{source:`() => {
  return (
    <VerticalGroup>
      {allButtonFills.map((buttonFill) => (
        <VerticalGroup key={buttonFill}>
          <HorizontalGroup spacing="lg">
            {allButtonVariants.map((variant) => (
              <VerticalGroup spacing="lg" key={\`\${buttonFill}-\${variant}\`}>
                {sizes.map((size) => (
                  <Button variant={variant} fill={buttonFill} size={size} key={size}>
                    {variant} {size}
                  </Button>
                ))}
                <Button variant={variant} fill={buttonFill} disabled>
                  {variant} disabled
                </Button>
              </VerticalGroup>
            ))}
          </HorizontalGroup>
          <div style={{ padding: '20px 0', width: '100%' }} />
        </VerticalGroup>
      ))}
      <HorizontalGroup spacing="lg">
        <div>With icon and text</div>
        <Button icon="cloud" size="sm">
          Configure
        </Button>
        <Button icon="cloud">Configure</Button>
        <Button icon="cloud" size="lg">
          Configure
        </Button>
      </HorizontalGroup>
      <div />
      <HorizontalGroup spacing="lg">
        <div>With icon only</div>
        <Button icon="cloud" size="sm" />
        <Button icon="cloud" size="md" />
        <Button icon="cloud" size="lg" />
      </HorizontalGroup>
      <div />
      <Button icon="plus" fullWidth>
        Button with fullWidth
      </Button>
      <div />
      <HorizontalGroup spacing="lg">
        <div>Inside ButtonGroup</div>
        <ButtonGroup>
          <Button icon="sync">Run query</Button>
          <Button icon="angle-down" />
        </ButtonGroup>
      </HorizontalGroup>
      <Card>
        <Card.Heading>Button inside card</Card.Heading>
        <Card.Actions>
          {allButtonVariants.map((variant) => (
            <Button variant={variant} key={variant}>
              {variant}
            </Button>
          ))}
          <Button variant="primary" disabled>
            Disabled
          </Button>
        </Card.Actions>
      </Card>
    </VerticalGroup>
  );
}`}},r.parameters),u.parameters=v({storySource:{source:"(args: ButtonProps) => <Button {...args} />"}},u.parameters)},"./src/components/ButtonCascader/ButtonCascader.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{default:function(){return $},simple:function(){return K},withIcon:function(){return F}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("../../.yarn/__virtual__/rc-cascader-virtual-49e17f6cc6/2/yarn/cache/rc-cascader-npm-3.8.0-8c3d54b44b-eb6cb454c8.zip/node_modules/rc-cascader/es/index.js"),l=e("./src/themes/stylesFactory.ts"),f=e("./src/themes/ThemeContext.tsx"),x=e("./src/components/Button/Button.tsx"),d=e("./src/components/Cascader/optionMappings.ts"),i=e("./src/components/Icon/Icon.tsx"),c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(R,U,H)=>U in R?c(R,U,{enumerable:!0,configurable:!0,writable:!0,value:H}):R[U]=H,b=(R,U)=>{for(var H in U||(U={}))w.call(U,H)&&C(R,H,U[H]);if(m)for(var H of m(U))_.call(U,H)&&C(R,H,U[H]);return R},g=(R,U)=>E(R,O(U)),v=(R,U)=>{var H={};for(var W in R)w.call(R,W)&&U.indexOf(W)<0&&(H[W]=R[W]);if(R!=null&&m)for(var W of m(R))U.indexOf(W)<0&&_.call(R,W)&&(H[W]=R[W]);return H};const y=(0,l.B)(R=>({popup:n.iv`
      label: popup;
      z-index: ${R.zIndex.dropdown};
    `,icons:{right:n.iv`
        margin: 1px 0 0 4px;
      `,left:n.iv`
        margin: -1px 4px 0 0;
      `}})),h=R=>{const U=R,{onChange:H,className:W,loadData:oe,icon:Q,buttonProps:P,hideDownIcon:ae,variant:q,disabled:Y}=U,ve=v(U,["onChange","className","loadData","icon","buttonProps","hideDownIcon","variant","disabled"]),re=(0,f.l4)(),je=y(re);let me=R.children;return ae||(me=[R.children,t.createElement(i.J,{key:"down-icon",name:"angle-down",className:je.icons.right})]),t.createElement(a.Z,g(b({onChange:(0,d.K)(H),loadData:(0,d.p)(oe),dropdownClassName:je.popup},ve),{expandIcon:null}),t.createElement(x.zx,b({icon:Q,disabled:Y,variant:q},P!=null?P:{}),me))};h.displayName="ButtonCascader";try{h.displayName="ButtonCascader",h.__docgenInfo={description:"",displayName:"ButtonCascader",props:{options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"CascaderOption[]"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string[]"}},fieldNames:{defaultValue:null,description:"",name:"fieldNames",required:!1,type:{name:"{ label: string; value: string; children: string; }"}},loadData:{defaultValue:null,description:"",name:"loadData",required:!1,type:{name:"((selectedOptions: CascaderOption[]) => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((value: string[], selectedOptions: CascaderOption[]) => void)"}},onPopupVisibleChange:{defaultValue:null,description:"",name:"onPopupVisibleChange",required:!1,type:{name:"((visible: boolean) => void)"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},buttonProps:{defaultValue:null,description:"",name:"buttonProps",required:!1,type:{name:"ButtonProps"}},hideDownIcon:{defaultValue:null,description:"",name:"hideDownIcon",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ButtonCascader/ButtonCascader.tsx#ButtonCascader"]={docgenInfo:h.__docgenInfo,name:"ButtonCascader",path:"src/components/ButtonCascader/ButtonCascader.tsx#ButtonCascader"})}catch(R){}var s=e("./src/utils/storybook/withCenteredStory.tsx"),o=Object.defineProperty,r=Object.getOwnPropertySymbols,u=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable,S=(R,U,H)=>U in R?o(R,U,{enumerable:!0,configurable:!0,writable:!0,value:H}):R[U]=H,k=(R,U)=>{for(var H in U||(U={}))u.call(U,H)&&S(R,H,U[H]);if(r)for(var H of r(U))p.call(U,H)&&S(R,H,U[H]);return R},D=(R,U)=>{var H={};for(var W in R)u.call(R,W)&&U.indexOf(W)<0&&(H[W]=R[W]);if(R!=null&&r)for(var W of r(R))U.indexOf(W)<0&&p.call(R,W)&&(H[W]=R[W]);return H},M=`import { ComponentStory, ComponentMeta } from '@storybook/react';
import React from 'react';

import { ButtonCascader } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

const meta: ComponentMeta<typeof ButtonCascader> = {
  title: 'Forms/Cascader/ButtonCascader',
  component: ButtonCascader,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['className', 'value', 'fieldNames', 'loadData', 'onChange', 'onPopupVisibleChange'],
    },
  },
  args: {
    disabled: false,
    children: 'Click me!',
    options: [
      {
        label: 'A',
        value: 'A',
        children: [
          { label: 'B', value: 'B' },
          { label: 'C', value: 'C' },
        ],
      },
      { label: 'D', value: 'D' },
    ],
  },
  argTypes: {
    icon: { control: { type: 'select', options: ['plus', 'minus', 'table'] } },
    options: { control: 'object' },
  },
};

const Template: ComponentStory<typeof ButtonCascader> = ({ children, ...args }) => {
  return <ButtonCascader {...args}>{children}</ButtonCascader>;
};

export const simple = Template.bind({});

export const withIcon = Template.bind({});
withIcon.args = {
  icon: 'plus',
};

export default meta;
`,I={simple:{startLoc:{col:56,line:38},endLoc:{col:1,line:40},startBody:{col:56,line:38},endBody:{col:1,line:40}},withIcon:{startLoc:{col:56,line:38},endLoc:{col:1,line:40},startBody:{col:56,line:38},endBody:{col:1,line:40}}};const T={title:"Forms/Cascader/ButtonCascader",component:h,decorators:[s.BU],parameters:{controls:{exclude:["className","value","fieldNames","loadData","onChange","onPopupVisibleChange"]}},args:{disabled:!1,children:"Click me!",options:[{label:"A",value:"A",children:[{label:"B",value:"B"},{label:"C",value:"C"}]},{label:"D",value:"D"}]},argTypes:{icon:{control:{type:"select",options:["plus","minus","table"]}},options:{control:"object"}}},j=R=>{var U=R,{children:H}=U,W=D(U,["children"]);return t.createElement(h,k({},W),H)},K=j.bind({}),F=j.bind({});F.args={icon:"plus"};var $=T;K.parameters=k({storySource:{source:`({ children, ...args }) => {
  return <ButtonCascader {...args}>{children}</ButtonCascader>;
}`}},K.parameters),F.parameters=k({storySource:{source:`({ children, ...args }) => {
  return <ButtonCascader {...args}>{children}</ButtonCascader>;
}`}},F.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ButtonCascader/ButtonCascader.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ButtonCascader/ButtonCascader.story.tsx#ComponentMeta"})}catch(R){}},"./src/components/Card/Card.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{AsLink:function(){return k},Basic:function(){return S},Full:function(){return T},NotSelected:function(){return K},Selected:function(){return j},WithActions:function(){return I},WithMedia:function(){return M},WithTags:function(){return D},default:function(){return F}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/Button/Button.tsx"),l=e("./src/components/IconButton/IconButton.tsx"),f=e("./src/components/Layout/Layout.tsx"),x=e("./src/components/Tags/TagList.tsx"),d=e("./src/components/Card/Card.tsx"),i=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),c=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),E=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");const O="https://grafana.com/static/assets/img/apple-touch-icon.png";function m($){const R=Object.assign({h1:"h1",h2:"h2",h3:"h3",p:"p",code:"code",pre:"pre",blockquote:"blockquote",strong:"strong",a:"a"},(0,c.ah)(),$.components);return d.Z||C("Card",!1),d.Z.Actions||C("Card.Actions",!0),d.Z.Description||C("Card.Description",!0),d.Z.Figure||C("Card.Figure",!0),d.Z.Heading||C("Card.Heading",!0),d.Z.Meta||C("Card.Meta",!0),d.Z.SecondaryActions||C("Card.SecondaryActions",!0),d.Z.Tags||C("Card.Tags",!0),(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(E.h_,{title:"MDX/Card",component:d.Z}),`
`,(0,i.jsx)(R.h1,{children:"Card"}),`
`,(0,i.jsx)(R.h2,{children:"Usage"}),`
`,(0,i.jsx)(R.h3,{children:"Basic"}),`
`,(0,i.jsxs)(R.p,{children:["A basic ",(0,i.jsx)(R.code,{children:"Card"})," component expects at least a heading, used as a title."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card>
  <Card.Heading>Filter by name</Card.Heading>
  <Card.Description>Filter data by query.</Card.Description>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"Filter by name"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Filter data by query."})]})}),`
`,(0,i.jsx)(R.h3,{children:"Multiple metadata elements"}),`
`,(0,i.jsxs)(R.p,{children:["For providing metadata elements, which can be any extra information for the card, ",(0,i.jsx)(R.code,{children:"Card.Meta"})," component should be used. If metadata consists of multiple strings, each of them has to be escaped (wrapped in brackets ",(0,i.jsx)(R.code,{children:"{}"}),") or better passed in as an array."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card>
  <Card.Heading>Test dashboard</Card.Heading>
  <Card.Meta>{['Folder: Test', 'Views: 100']}</Card.Meta>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"Test dashboard"}),`
`,(0,i.jsx)(d.Z.Meta,{children:["Folder: Test","Views: 100"]})]})}),`
`,(0,i.jsxs)(R.p,{children:["Metadata also accepts HTML elements, which could be links, for example. For elements, that are not strings, a ",(0,i.jsx)(R.code,{children:"key"})," prop has to be manually specified."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card>
  <Card.Heading>Test dashboard</Card.Heading>
  <Card.Meta>
    Grafana
    <a key="prom-link" href="https://ops-us-east4.grafana.net/api/prom">
      https://ops-us-east4.grafana.net/api/prom
    </a>
  </Card.Meta>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"Test dashboard"}),(0,i.jsxs)(d.Z.Meta,{children:[(0,i.jsx)(R.p,{children:"Grafana"}),(0,i.jsx)("a",{href:"https://ops-us-east4.grafana.net/api/prom",children:(0,i.jsx)(R.p,{children:"https://ops-us-east4.grafana.net/api/prom"})},"prom-link")]})]})}),`
`,(0,i.jsxs)(R.p,{children:["The separator for multiple metadata elements defaults to a vertical line ",(0,i.jsx)(R.code,{children:"|"}),", but can be customised."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card>
  <Card.Heading>Test dashboard</Card.Heading>
  <Card.Meta separator={'-'}>
    Grafana
    <a key="prom-link" href="https://ops-us-east4.grafana.net/api/prom">
      https://ops-us-east4.grafana.net/api/prom
    </a>
  </Card.Meta>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"Test dashboard"}),(0,i.jsxs)(d.Z.Meta,{separator:"-",children:[(0,i.jsx)(R.p,{children:"Grafana"}),(0,i.jsx)("a",{href:"https://ops-us-east4.grafana.net/api/prom",children:(0,i.jsx)(R.p,{children:"https://ops-us-east4.grafana.net/api/prom"})},"prom-link")]})]})}),`
`,(0,i.jsx)(R.h3,{children:"Tags"}),`
`,(0,i.jsxs)(R.p,{children:["Tags can be rendered inside the Card, by being wrapped in ",(0,i.jsx)(R.code,{children:"Card.Tags"})," component. Note that this component does not provide any tag styling and that should be handled by the children. It is recommended to use it with Grafana-UI's ",(0,i.jsx)(R.code,{children:"TagList"})," component."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card>
  <Card.Heading>Test dashboard</Card.Heading>
  <Card.Description>Card with a list of tags</Card.Description>
  <Card.Tags>
    <TagList tags={['tag1', 'tag2', 'tag3']} onClick={(tag) => console.log(tag)} />
  </Card.Tags>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"Test dashboard"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Card with a list of tags"}),(0,i.jsx)(d.Z.Tags,{children:(0,i.jsx)(x.P,{tags:["tag1","tag2","tag3"],onClick:U=>console.log(U)})})]})}),`
`,(0,i.jsx)(R.h3,{children:"As a link"}),`
`,(0,i.jsxs)(R.p,{children:["Card can be used as a clickable link item by specifying ",(0,i.jsx)(R.code,{children:"href"})," prop."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card href="https://grafana.com">
  <Card.Heading>Redirect to Grafana</Card.Heading>
  <Card.Description>Clicking this card will redirect to grafana website</Card.Description>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{href:"https://grafana.com",children:[(0,i.jsx)(d.Z.Heading,{children:"Redirect to Grafana"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Clicking this card will redirect to grafana website"})]})}),`
`,(0,i.jsx)(R.h3,{children:"As a button"}),`
`,(0,i.jsxs)(R.p,{children:["Card can be used as a clickable buttons item by specifying ",(0,i.jsx)(R.code,{children:"onClick"})," prop."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card onClick={() => alert('Hello, Grafana!')}>
  <Card.Heading>Hello, Grafana</Card.Heading>
  <Card.Description>Clicking this card will create an alert</Card.Description>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{onClick:()=>alert("Hello, Grafana!"),children:[(0,i.jsx)(d.Z.Heading,{children:"Hello, Grafana"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Clicking this card will create an alert"})]})}),`
`,(0,i.jsxs)(R.blockquote,{children:[`
`,(0,i.jsxs)(R.p,{children:[(0,i.jsx)(R.strong,{children:"Note"}),": When used in conjunction with ",(0,i.jsx)(R.a,{href:"#multiple-metadata-elements",children:"Metadata elements"}),`, clicking on any element
inside `,(0,i.jsx)(R.code,{children:"<Card.Meta>"})," will prevent the card action to be executed (either ",(0,i.jsx)(R.code,{children:"href"})," to be followed or ",(0,i.jsx)(R.code,{children:"onClick"})," to be called)."]}),`
`,(0,i.jsx)(R.p,{children:"Example:"}),`
`]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card onClick={() => alert('Hello, Grafana!')}>
  <Card.Heading>Hello, Grafana</Card.Heading>
  <Card.Meta>Clicking on this text (Meta) WILL NOT trigger the alert!</Card.Meta>
  <Card.Description>Clicking on this text (Description) WILL trigger the alert!</Card.Description>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{onClick:()=>alert("Hello, Grafana!"),children:[(0,i.jsx)(d.Z.Heading,{children:"Hello, Grafana"}),`
`,(0,i.jsx)(d.Z.Meta,{children:"Clicking on this text (Meta) WILL NOT trigger the alert!"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Clicking on this text (Description) WILL trigger the alert!"})]})}),`
`,(0,i.jsx)(R.h3,{children:"Inside a list item"}),`
`,(0,i.jsxs)(R.p,{children:["To render cards in a list, it is possible to nest them inside ",(0,i.jsx)(R.code,{children:"li"})," items."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<ul>
  <li>
    <Card>
      <Card.Heading>List card item</Card.Heading>
      <Card.Description>Card that is rendered inside li element.</Card.Description>
    </Card>
  </li>
  <li>
    <Card>
      <Card.Heading>List card item</Card.Heading>
      <Card.Description>Card that is rendered inside li element.</Card.Description>
    </Card>
  </li>
  <li>
    <Card>
      <Card.Heading>List card item</Card.Heading>
      <Card.Description>Card that is rendered inside li element.</Card.Description>
    </Card>
  </li>
  <li>
    <Card>
      <Card.Heading>List card item</Card.Heading>
      <Card.Description>Card that is rendered inside li element.</Card.Description>
    </Card>
  </li>
</ul>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)("ul",{style:{padding:"20px",maxWidth:"800px",listStyle:"none",display:"grid"},children:[(0,i.jsx)("li",{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"List card item"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Card that is rendered inside li element."})]})}),(0,i.jsx)("li",{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"List card item"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Card that is rendered inside li element."})]})}),(0,i.jsx)("li",{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"List card item"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Card that is rendered inside li element."})]})}),(0,i.jsx)("li",{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"List card item"}),`
`,(0,i.jsx)(d.Z.Description,{children:"Card that is rendered inside li element."})]})})]})}),`
`,(0,i.jsx)(R.h3,{children:"With media elements"}),`
`,(0,i.jsxs)(R.p,{children:["Cards can also be rendered with media content such icons or images. Such elements need to be wrapped in ",(0,i.jsx)(R.code,{children:"Card.Figure"})," component."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card>
  <Card.Heading>1-ops-tools1-fallback</Card.Heading>
  <Card.Figure>
    <img src={logo} alt="Grafana Logo" width="40" height="40" />
  </Card.Figure>
  <Card.Meta>
    Grafana
    <a key="prom-link" href="https://ops-us-east4.grafana.net/api/prom">
      https://ops-us-east4.grafana.net/api/prom
    </a>
  </Card.Meta>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"1-ops-tools1-fallback"}),(0,i.jsx)(d.Z.Figure,{children:(0,i.jsx)("img",{src:O,alt:"Grafana Logo",width:"40",height:"40"})}),(0,i.jsxs)(d.Z.Meta,{children:[(0,i.jsx)(R.p,{children:"Grafana"}),(0,i.jsx)("a",{href:"https://ops-us-east4.grafana.net/api/prom",children:(0,i.jsx)(R.p,{children:"https://ops-us-east4.grafana.net/api/prom"})},"prom-link")]})]})}),`
`,(0,i.jsx)(R.h3,{children:"Action Cards"}),`
`,(0,i.jsxs)(R.p,{children:["Cards also accept primary and secondary actions. Usually the primary actions are displayed as buttons while secondary actions are displayed as icon buttons. The actions need to be wrappd in ",(0,i.jsx)(R.code,{children:"Card.Actions"})," and ",(0,i.jsx)(R.code,{children:"Card.SecondaryActions"})," components respectively."]}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card>
  <Card.Heading>1-ops-tools1-fallback</Card.Heading>
  <Card.Meta>
    Grafana
    <a key="prom-link" href="https://ops-us-east4.grafana.net/api/prom">
      https://ops-us-east4.grafana.net/api/prom
    </a>
  </Card.Meta>
  <Card.Figure>
    <img src={logo} alt="Grafana Logo" width="40" height="40" />
  </Card.Figure>
  <Card.Actions>
    <Button key="settings" variant="secondary">
      Settings
    </Button>
    <Button key="explore" variant="secondary">
      Explore
    </Button>
  </Card.Actions>
  <Card.SecondaryActions>
    <IconButton key="showAll" name="apps" tooltip="Show all dashboards for this data source" />
    <IconButton key="delete" name="trash-alt" tooltip="Delete this data source" />
  </Card.SecondaryActions>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{children:[(0,i.jsx)(d.Z.Heading,{children:"1-ops-tools1-fallback"}),(0,i.jsxs)(d.Z.Meta,{children:[(0,i.jsx)(R.p,{children:"Grafana"}),(0,i.jsx)("a",{href:"https://ops-us-east4.grafana.net/api/prom",children:(0,i.jsx)(R.p,{children:"https://ops-us-east4.grafana.net/api/prom"})},"prom-link")]}),(0,i.jsx)(d.Z.Figure,{children:(0,i.jsx)("img",{src:O,alt:"Grafana Logo",width:"40",height:"40"})}),(0,i.jsxs)(d.Z.Actions,{children:[(0,i.jsx)(a.zx,{variant:"secondary",children:(0,i.jsx)(R.p,{children:"Settings"})},"settings"),(0,i.jsx)(a.zx,{variant:"secondary",children:(0,i.jsx)(R.p,{children:"Explore"})},"explore")]}),(0,i.jsxs)(d.Z.SecondaryActions,{children:[(0,i.jsx)(l.h,{name:"apps",tooltip:"Show all dashboards for this data source"},"showAll"),(0,i.jsx)(l.h,{name:"trash-alt",tooltip:"Delete this data source"},"delete")]})]})}),`
`,(0,i.jsx)(R.h3,{children:"Disabled state"}),`
`,(0,i.jsx)(R.p,{children:"Card can have a disabled state, effectively making it and its actions non-clickable. If there are any actions, they will be disabled instead of the whole card."}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card disabled>
  <Card.Heading>1-ops-tools1-fallback</Card.Heading>
  <Card.Meta>
    Grafana
    <a key="prom-link" href="https://ops-us-east4.grafana.net/api/prom">
      https://ops-us-east4.grafana.net/api/prom
    </a>
  </Card.Meta>
  <Card.Figure>
    <img src={logo} alt="Grafana Logo" width="40" height="40" />
  </Card.Figure>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{disabled:!0,children:[(0,i.jsx)(d.Z.Heading,{children:"1-ops-tools1-fallback"}),(0,i.jsxs)(d.Z.Meta,{children:[(0,i.jsx)(R.p,{children:"Grafana"}),(0,i.jsx)("a",{href:"https://ops-us-east4.grafana.net/api/prom",children:(0,i.jsx)(R.p,{children:"https://ops-us-east4.grafana.net/api/prom"})},"prom-link")]}),(0,i.jsx)(d.Z.Figure,{children:(0,i.jsx)("img",{src:O,alt:"Grafana Logo",width:"40",height:"40"})})]})}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card disabled>
  <Card.Heading>1-ops-tools1-fallback</Card.Heading>
  <Card.Meta>
    Grafana
    <a key="prom-link" href="https://ops-us-east4.grafana.net/api/prom">
      https://ops-us-east4.grafana.net/api/prom
    </a>
  </Card.Meta>
  <Card.Figure>
    <img src={logo} alt="Grafana Logo" width="40" height="40" />
  </Card.Figure>
  <Card.Actions>
    <Button key="settings" variant="secondary">
      Settings
    </Button>
    <Button key="explore" variant="secondary">
      Explore
    </Button>
  </Card.Actions>
  <Card.SecondaryActions>
    <IconButton key="showAll" name="apps" tooltip="Show all dashboards for this data source" />
    <IconButton key="delete" name="trash-alt" tooltip="Delete this data source" />
  </Card.SecondaryActions>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{disabled:!0,children:[(0,i.jsx)(d.Z.Heading,{children:"1-ops-tools1-fallback"}),(0,i.jsxs)(d.Z.Meta,{children:[(0,i.jsx)(R.p,{children:"Grafana"}),(0,i.jsx)("a",{href:"https://ops-us-east4.grafana.net/api/prom",children:(0,i.jsx)(R.p,{children:"https://ops-us-east4.grafana.net/api/prom"})},"prom-link")]}),(0,i.jsx)(d.Z.Figure,{children:(0,i.jsx)("img",{src:O,alt:"Grafana Logo",width:"40",height:"40"})}),(0,i.jsxs)(d.Z.Actions,{children:[(0,i.jsx)(a.zx,{variant:"secondary",children:(0,i.jsx)(R.p,{children:"Settings"})},"settings"),(0,i.jsx)(a.zx,{variant:"secondary",children:(0,i.jsx)(R.p,{children:"Explore"})},"explore")]}),(0,i.jsxs)(d.Z.SecondaryActions,{children:[(0,i.jsx)(l.h,{name:"apps",tooltip:"Show all dashboards for this data source"},"showAll"),(0,i.jsx)(l.h,{name:"trash-alt",tooltip:"Delete this data source"},"delete")]})]})}),`
`,(0,i.jsx)(R.h3,{children:"Selectable"}),`
`,(0,i.jsx)(R.pre,{children:(0,i.jsx)(R.code,{className:"language-jsx",children:`<Card isSelected disabled>
  <Card.Heading>Option #1</Card.Heading>
  <Card.Meta>This is a really great option, you won't regret it.</Card.Meta>
  <Card.Figure>
    <img src={logo} alt="Grafana Logo" width="40" height="40" />
  </Card.Figure>
</Card>
`})}),`
`,(0,i.jsx)(E.MB,{children:(0,i.jsxs)(d.Z,{isSelected:!0,disabled:!0,children:[(0,i.jsx)(d.Z.Heading,{children:"Option #1"}),`
`,(0,i.jsx)(d.Z.Description,{children:"This is a really great option, you won't regret it."}),(0,i.jsx)(d.Z.Figure,{children:(0,i.jsx)("img",{src:O,alt:"Grafana Logo",width:"40",height:"40"})})]})}),`
`,(0,i.jsx)(R.h3,{children:"Props"}),`
`,(0,i.jsx)(E.xP,{of:d.Z})]})}function w($={}){const{wrapper:R}=Object.assign({},(0,c.ah)(),$.components);return R?(0,i.jsx)(R,Object.assign({},$,{children:(0,i.jsx)(m,$)})):m($)}var _=w;function C($,R){throw new Error("Expected "+(R?"component":"object")+" `"+$+"` to be defined: you likely forgot to import, pass, or provide it.")}var b=Object.defineProperty,g=Object.getOwnPropertySymbols,v=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable,h=($,R,U)=>R in $?b($,R,{enumerable:!0,configurable:!0,writable:!0,value:U}):$[R]=U,s=($,R)=>{for(var U in R||(R={}))v.call(R,U)&&h($,U,R[U]);if(g)for(var U of g(R))y.call(R,U)&&h($,U,R[U]);return $},o=null,r={Basic:{startLoc:{col:50,line:29},endLoc:{col:1,line:39},startBody:{col:50,line:29},endBody:{col:1,line:39}},AsLink:{startLoc:{col:51,line:41},endLoc:{col:1,line:64},startBody:{col:51,line:41},endBody:{col:1,line:64}},WithTags:{startLoc:{col:53,line:66},endLoc:{col:1,line:76},startBody:{col:53,line:66},endBody:{col:1,line:76}},WithMedia:{startLoc:{col:54,line:78},endLoc:{col:1,line:93},startBody:{col:54,line:78},endBody:{col:1,line:93}},WithActions:{startLoc:{col:56,line:94},endLoc:{col:1,line:121},startBody:{col:56,line:94},endBody:{col:1,line:121}},Full:{startLoc:{col:49,line:123},endLoc:{col:1,line:158},startBody:{col:49,line:123},endBody:{col:1,line:158}},Selected:{startLoc:{col:53,line:160},endLoc:{col:1,line:170},startBody:{col:53,line:160},endBody:{col:1,line:170}},NotSelected:{startLoc:{col:56,line:172},endLoc:{col:1,line:182},startBody:{col:56,line:172},endBody:{col:1,line:182}}};const u="https://grafana.com/static/assets/img/apple-touch-icon.png",p={title:"General/Card",component:d.Z,decorators:[n.BU],parameters:{docs:{page:_},controls:{exclude:["onClick","href","heading","description","className"]}}},S=({disabled:$})=>t.createElement(d.Z,{disabled:$},t.createElement(d.Z.Heading,null,"Filter by name"),t.createElement(d.Z.Description,null,"Filter data by query. This is useful if you are sharing the results from a different panel that has many queries and you want to only visualize a subset of that in this panel.")),k=({disabled:$})=>t.createElement(f.wc,null,t.createElement(d.Z,{href:"https://grafana.com",disabled:$},t.createElement(d.Z.Heading,null,"Filter by name"),t.createElement(d.Z.Description,null,"Filter data by query. This is useful if you are sharing the results from a different panel that has many queries and you want to only visualize a subset of that in this panel.")),t.createElement(d.Z,{href:"https://grafana.com",disabled:$},t.createElement(d.Z.Heading,null,"Filter by name2"),t.createElement(d.Z.Description,null,"Filter data by query. This is useful if you are sharing the results from a different panel that has many queries and you want to only visualize a subset of that in this panel.")),t.createElement(d.Z,{href:"https://grafana.com",disabled:$},t.createElement(d.Z.Heading,null,"Production system overview"),t.createElement(d.Z.Meta,null,"Meta tags"))),D=({disabled:$})=>t.createElement(d.Z,{disabled:$},t.createElement(d.Z.Heading,null,"Elasticsearch \u2013 Custom Templated Query"),t.createElement(d.Z.Meta,null,"Elastic Search"),t.createElement(d.Z.Tags,null,t.createElement(x.P,{tags:["elasticsearch","test","testdata"],onClick:R=>console.log("tag",R)}))),M=({disabled:$})=>t.createElement(d.Z,{disabled:$},t.createElement(d.Z.Heading,null,"1-ops-tools1-fallback"),t.createElement(d.Z.Meta,null,"Prometheus",t.createElement("a",{key:"link2",href:"https://ops-us-east4.grafana.net/api/prom"},"https://ops-us-east4.grafana.net/api/prom")),t.createElement(d.Z.Figure,null,t.createElement("img",{src:u,alt:"Prometheus Logo",height:"40",width:"40"}))),I=({disabled:$})=>t.createElement(d.Z,{disabled:$},t.createElement(d.Z.Heading,null,"1-ops-tools1-fallback"),t.createElement(d.Z.Meta,null,"Prometheus",t.createElement("a",{key:"link2",href:"https://ops-us-east4.grafana.net/api/prom"},"https://ops-us-east4.grafana.net/api/prom")),t.createElement(d.Z.Figure,null,t.createElement("img",{src:u,alt:"Prometheus Logo",height:"40",width:"40"})),t.createElement(d.Z.Actions,null,t.createElement(a.zx,{key:"settings",variant:"secondary"},"Settings"),t.createElement(a.zx,{key:"explore",variant:"secondary"},"Explore")),t.createElement(d.Z.SecondaryActions,null,t.createElement(l.h,{key:"showAll",name:"apps",tooltip:"Show all dashboards for this data source"}),t.createElement(l.h,{key:"delete",name:"trash-alt",tooltip:"Delete this data source"}))),T=({disabled:$})=>t.createElement(d.Z,{disabled:$},t.createElement(d.Z.Heading,null,"Card title"),t.createElement(d.Z.Description,null,"Description, body text. Greetings! Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."),t.createElement(d.Z.Meta,null,["Subtitle","Meta info 1","Meta info 2"],t.createElement("a",{key:"link",href:"https://ops-us-east4.grafana.net/api/prom"},"https://ops-us-east4.grafana.net/api/prom")),t.createElement(d.Z.Figure,null,t.createElement("img",{src:u,alt:"Prometheus Logo",height:"40",width:"40"})),t.createElement(d.Z.Actions,null,t.createElement(a.zx,{key:"settings",variant:"secondary"},"Main action"),t.createElement(a.zx,{key:"explore",variant:"secondary"},"2nd action")),t.createElement(d.Z.SecondaryActions,null,t.createElement(l.h,{key:"comment-alt",name:"comment-alt",tooltip:"Tooltip content"}),t.createElement(l.h,{key:"copy",name:"copy",tooltip:"Tooltip content"}),t.createElement(l.h,{key:"link",name:"link",tooltip:"Tooltip content"}),t.createElement(l.h,{key:"star",name:"star",tooltip:"Tooltip content"}),t.createElement(l.h,{key:"delete",name:"trash-alt",tooltip:"Delete this data source"}))),j=()=>t.createElement(d.Z,{isSelected:!0},t.createElement(d.Z.Heading,null,"Spaces"),t.createElement(d.Z.Description,null,"Spaces are the superior form of indenting code."),t.createElement(d.Z.Figure,null,t.createElement("img",{src:u,alt:"Grafana Logo",width:"40",height:"40"}))),K=()=>t.createElement(d.Z,{isSelected:!1},t.createElement(d.Z.Heading,null,"Tabs"),t.createElement(d.Z.Description,null,"Tabs are the preferred way of indentation."),t.createElement(d.Z.Figure,null,t.createElement("img",{src:u,alt:"Grafana Logo",width:"40",height:"40"})));var F=p;S.parameters=s({storySource:{source:`({ disabled }) => {
  return (
    <Card disabled={disabled}>
      <Card.Heading>Filter by name</Card.Heading>
      <Card.Description>
        Filter data by query. This is useful if you are sharing the results from a different panel that has many queries
        and you want to only visualize a subset of that in this panel.
      </Card.Description>
    </Card>
  );
}`}},S.parameters),k.parameters=s({storySource:{source:`({ disabled }) => {
  return (
    <VerticalGroup>
      <Card href="https://grafana.com" disabled={disabled}>
        <Card.Heading>Filter by name</Card.Heading>
        <Card.Description>
          Filter data by query. This is useful if you are sharing the results from a different panel that has many
          queries and you want to only visualize a subset of that in this panel.
        </Card.Description>
      </Card>
      <Card href="https://grafana.com" disabled={disabled}>
        <Card.Heading>Filter by name2</Card.Heading>
        <Card.Description>
          Filter data by query. This is useful if you are sharing the results from a different panel that has many
          queries and you want to only visualize a subset of that in this panel.
        </Card.Description>
      </Card>
      <Card href="https://grafana.com" disabled={disabled}>
        <Card.Heading>Production system overview</Card.Heading>
        <Card.Meta>Meta tags</Card.Meta>
      </Card>
    </VerticalGroup>
  );
}`}},k.parameters),D.parameters=s({storySource:{source:`({ disabled }) => {
  return (
    <Card disabled={disabled}>
      <Card.Heading>Elasticsearch \u2013 Custom Templated Query</Card.Heading>
      <Card.Meta>Elastic Search</Card.Meta>
      <Card.Tags>
        <TagList tags={['elasticsearch', 'test', 'testdata']} onClick={(tag) => console.log('tag', tag)} />
      </Card.Tags>
    </Card>
  );
}`}},D.parameters),M.parameters=s({storySource:{source:`({ disabled }) => {
  return (
    <Card disabled={disabled}>
      <Card.Heading>1-ops-tools1-fallback</Card.Heading>
      <Card.Meta>
        Prometheus
        <a key="link2" href="https://ops-us-east4.grafana.net/api/prom">
          https://ops-us-east4.grafana.net/api/prom
        </a>
      </Card.Meta>
      <Card.Figure>
        <img src={logo} alt="Prometheus Logo" height="40" width="40" />
      </Card.Figure>
    </Card>
  );
}`}},M.parameters),I.parameters=s({storySource:{source:`({ disabled }) => {
  return (
    <Card disabled={disabled}>
      <Card.Heading>1-ops-tools1-fallback</Card.Heading>
      <Card.Meta>
        Prometheus
        <a key="link2" href="https://ops-us-east4.grafana.net/api/prom">
          https://ops-us-east4.grafana.net/api/prom
        </a>
      </Card.Meta>
      <Card.Figure>
        <img src={logo} alt="Prometheus Logo" height="40" width="40" />
      </Card.Figure>
      <Card.Actions>
        <Button key="settings" variant="secondary">
          Settings
        </Button>
        <Button key="explore" variant="secondary">
          Explore
        </Button>
      </Card.Actions>
      <Card.SecondaryActions>
        <IconButton key="showAll" name="apps" tooltip="Show all dashboards for this data source" />
        <IconButton key="delete" name="trash-alt" tooltip="Delete this data source" />
      </Card.SecondaryActions>
    </Card>
  );
}`}},I.parameters),T.parameters=s({storySource:{source:`({ disabled }) => {
  return (
    <Card disabled={disabled}>
      <Card.Heading>Card title</Card.Heading>
      <Card.Description>
        Description, body text. Greetings! Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
        laboris nisi ut aliquip ex ea commodo consequat.
      </Card.Description>
      <Card.Meta>
        {['Subtitle', 'Meta info 1', 'Meta info 2']}
        <a key="link" href="https://ops-us-east4.grafana.net/api/prom">
          https://ops-us-east4.grafana.net/api/prom
        </a>
      </Card.Meta>
      <Card.Figure>
        <img src={logo} alt="Prometheus Logo" height="40" width="40" />
      </Card.Figure>
      <Card.Actions>
        <Button key="settings" variant="secondary">
          Main action
        </Button>
        <Button key="explore" variant="secondary">
          2nd action
        </Button>
      </Card.Actions>
      <Card.SecondaryActions>
        <IconButton key="comment-alt" name="comment-alt" tooltip="Tooltip content" />
        <IconButton key="copy" name="copy" tooltip="Tooltip content" />
        <IconButton key="link" name="link" tooltip="Tooltip content" />
        <IconButton key="star" name="star" tooltip="Tooltip content" />
        <IconButton key="delete" name="trash-alt" tooltip="Delete this data source" />
      </Card.SecondaryActions>
    </Card>
  );
}`}},T.parameters),j.parameters=s({storySource:{source:`() => {
  return (
    <Card isSelected>
      <Card.Heading>Spaces</Card.Heading>
      <Card.Description>Spaces are the superior form of indenting code.</Card.Description>
      <Card.Figure>
        <img src={logo} alt="Grafana Logo" width="40" height="40" />
      </Card.Figure>
    </Card>
  );
}`}},j.parameters),K.parameters=s({storySource:{source:`() => {
  return (
    <Card isSelected={false}>
      <Card.Heading>Tabs</Card.Heading>
      <Card.Description>Tabs are the preferred way of indentation.</Card.Description>
      <Card.Figure>
        <img src={logo} alt="Grafana Logo" width="40" height="40" />
      </Card.Figure>
    </Card>
  );
}`}},K.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Card/Card.story.tsx#ComponentMeta"})}catch($){}},"./src/components/Cascader/Cascader.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Simple:function(){return o},WithCustomValue:function(){return u},WithDisplayAllSelectedLevels:function(){return p},WithInitialValue:function(){return r},WithOptionsStateUpdate:function(){return S},default:function(){return k}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Cascader/Cascader.tsx"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function d(D){const M=Object.assign({h1:"h1",p:"p",code:"code"},(0,f.ah)(),D.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(x.h_,{title:"MDX|Cascader",component:n.v}),`
`,(0,l.jsx)(M.h1,{children:"Cascader"}),`
`,(0,l.jsxs)(M.p,{children:["The cascader component is a ",(0,l.jsx)(M.code,{children:"Select"})," with a cascading flyout menu. When you have lots of options in your select, they can be hard to navigate from a regular dropdown list. In that case you can use the cascader to organize your options into groups hierarchically. Just like in the ",(0,l.jsx)(M.code,{children:"Select"})," component, the cascader input doubles as a search field to quickly jump to a selection without navigating the list."]}),`
`,(0,l.jsxs)(M.p,{children:["You can either use the ",(0,l.jsx)(M.code,{children:"Simple"})," cascader component for an empty input as default state or use the ",(0,l.jsx)(M.code,{children:"initialValue"})," or ",(0,l.jsx)(M.code,{children:"allowCustomValue"})," fields to pre-fill your cascader. Initial value means that one of the options from your cascaded list is pre-selected. Custom value means that apart from existing options from the list, your users can add custom values to the list by typing them in the ",(0,l.jsx)(M.code,{children:"Select"})," input."]}),`
`,(0,l.jsx)(x.xP,{of:n.v})]})}function i(D={}){const{wrapper:M}=Object.assign({},(0,f.ah)(),D.components);return M?(0,l.jsx)(M,Object.assign({},D,{children:(0,l.jsx)(d,D)})):d(D)}var c=i,E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(D,M,I)=>M in D?E(D,M,{enumerable:!0,configurable:!0,writable:!0,value:I}):D[M]=I,C=(D,M)=>{for(var I in M||(M={}))m.call(M,I)&&_(D,I,M[I]);if(O)for(var I of O(M))w.call(M,I)&&_(D,I,M[I]);return D},b=`import { ComponentStory, ComponentMeta } from '@storybook/react';
import React from 'react';

import { Cascader } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { CascaderOption } from './Cascader';
import mdx from './Cascader.mdx';

const onSelect = (val: string) => console.log(val);
const options = [
  {
    label: 'First',
    value: '1',
    items: [
      {
        label: 'Second',
        value: '2',
      },
      {
        label: 'Third',
        value: '3',
      },
      {
        label: 'Fourth',
        value: '4',
      },
    ],
  },
  {
    label: 'FirstFirst',
    value: '5',
  },
];

const meta: ComponentMeta<typeof Cascader> = {
  title: 'Forms/Cascader',
  component: Cascader,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: [
        'placeholder',
        'initialValue',
        'changeOnSelect',
        'onSelect',
        'loadData',
        'onChange',
        'onPopupVisibleChange',
        'formatCreateLabel',
      ],
    },
  },
  args: {
    onSelect,
    options,
  },
  argTypes: {
    width: { control: { type: 'range', min: 0, max: 70 } },
  },
};

const Template: ComponentStory<typeof Cascader> = (args) => <Cascader {...args} />;

export const Simple = Template.bind({});
Simple.args = {
  separator: '',
};

export const WithInitialValue = Template.bind({});
WithInitialValue.args = {
  initialValue: '3',
};

export const WithCustomValue = Template.bind({});
WithCustomValue.args = {
  initialValue: 'Custom Initial Value',
  allowCustomValue: true,
  formatCreateLabel: (val) => 'Custom Label' + val,
};

export const WithDisplayAllSelectedLevels = Template.bind({});
WithDisplayAllSelectedLevels.args = {
  displayAllSelectedLevels: true,
  separator: ',',
};

export const WithOptionsStateUpdate = () => {
  const [updatedOptions, setOptions] = React.useState<CascaderOption[]>([
    {
      label: 'Initial state option',
      value: 'initial',
    },
  ]);

  setTimeout(() => setOptions(options), 2000);

  return <Cascader options={updatedOptions} onSelect={onSelect} />;
};

export default meta;
`,g={Simple:{startLoc:{col:50,line:67},endLoc:{col:82,line:67},startBody:{col:50,line:67},endBody:{col:82,line:67}},WithInitialValue:{startLoc:{col:50,line:67},endLoc:{col:82,line:67},startBody:{col:50,line:67},endBody:{col:82,line:67}},WithCustomValue:{startLoc:{col:50,line:67},endLoc:{col:82,line:67},startBody:{col:50,line:67},endBody:{col:82,line:67}},WithDisplayAllSelectedLevels:{startLoc:{col:50,line:67},endLoc:{col:82,line:67},startBody:{col:50,line:67},endBody:{col:82,line:67}},WithOptionsStateUpdate:{startLoc:{col:38,line:92},endLoc:{col:1,line:103},startBody:{col:38,line:92},endBody:{col:1,line:103}}};const v=D=>console.log(D),y=[{label:"First",value:"1",items:[{label:"Second",value:"2"},{label:"Third",value:"3"},{label:"Fourth",value:"4"}]},{label:"FirstFirst",value:"5"}],h={title:"Forms/Cascader",component:n.v,decorators:[a.BU],parameters:{docs:{page:c},controls:{exclude:["placeholder","initialValue","changeOnSelect","onSelect","loadData","onChange","onPopupVisibleChange","formatCreateLabel"]}},args:{onSelect:v,options:y},argTypes:{width:{control:{type:"range",min:0,max:70}}}},s=D=>t.createElement(n.v,C({},D)),o=s.bind({});o.args={separator:""};const r=s.bind({});r.args={initialValue:"3"};const u=s.bind({});u.args={initialValue:"Custom Initial Value",allowCustomValue:!0,formatCreateLabel:D=>"Custom Label"+D};const p=s.bind({});p.args={displayAllSelectedLevels:!0,separator:","};const S=()=>{const[D,M]=t.useState([{label:"Initial state option",value:"initial"}]);return setTimeout(()=>M(y),2e3),t.createElement(n.v,{options:D,onSelect:v})};var k=h;o.parameters=C({storySource:{source:"(args) => <Cascader {...args} />"}},o.parameters),r.parameters=C({storySource:{source:"(args) => <Cascader {...args} />"}},r.parameters),u.parameters=C({storySource:{source:"(args) => <Cascader {...args} />"}},u.parameters),p.parameters=C({storySource:{source:"(args) => <Cascader {...args} />"}},p.parameters),S.parameters=C({storySource:{source:`() => {
  const [updatedOptions, setOptions] = React.useState<CascaderOption[]>([
    {
      label: 'Initial state option',
      value: 'initial',
    },
  ]);

  setTimeout(() => setOptions(options), 2000);

  return <Cascader options={updatedOptions} onSelect={onSelect} />;
}`}},S.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Cascader/Cascader.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Cascader/Cascader.story.tsx#ComponentMeta"})}catch(D){}},"./src/components/ClickOutsideWrapper/ClickOutsideWrapper.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{basic:function(){return h},default:function(){return s}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),x=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),d=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function i(o){const r=Object.assign({h1:"h1",p:"p",code:"code",pre:"pre"},(0,x.ah)(),o.components);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(d.h_,{title:"MDX|ClickOutsideWrapper",component:l.L}),`
`,(0,f.jsx)(r.h1,{children:"ClickOutsideWrapper"}),`
`,(0,f.jsxs)(r.p,{children:["A wrapper component that detects clicks outside of the elements by attaching event listener to ",(0,f.jsx)(r.code,{children:"window"})," or ",(0,f.jsx)(r.code,{children:"document"}),` objects.
Useful for components that require an action being triggered when a click outside has occurred, for example closing an overlay or popup.`]}),`
`,(0,f.jsx)(r.h1,{children:"Usage"}),`
`,(0,f.jsx)(r.pre,{children:(0,f.jsx)(r.code,{className:"language-jsx",children:`<ClickOutsideWrapper onClick={() => console.log('Clicked outside')}>
  <div style={{ width: '300px' }}>Container</div>
</ClickOutsideWrapper>
`})}),`
`,(0,f.jsx)(d.xP,{of:l.L})]})}function c(o={}){const{wrapper:r}=Object.assign({},(0,x.ah)(),o.components);return r?(0,f.jsx)(r,Object.assign({},o,{children:(0,f.jsx)(i,o)})):i(o)}var E=c,O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(o,r,u)=>r in o?O(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,b=(o,r)=>{for(var u in r||(r={}))w.call(r,u)&&C(o,u,r[u]);if(m)for(var u of m(r))_.call(r,u)&&C(o,u,r[u]);return o},g=`import { action } from '@storybook/addon-actions';
import { ComponentMeta } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { ClickOutsideWrapper } from './ClickOutsideWrapper';
import mdx from './ClickOutsideWrapper.mdx';

const meta: ComponentMeta<typeof ClickOutsideWrapper> = {
  title: 'Layout/ClickOutsideWrapper',
  component: ClickOutsideWrapper,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

export const basic = () => {
  return (
    <ClickOutsideWrapper onClick={action('Clicked outside')}>
      <div style={{ width: '300px', border: '1px solid grey', padding: '20px' }}>Container</div>
    </ClickOutsideWrapper>
  );
};

export default meta;
`,v={basic:{startLoc:{col:21,line:21},endLoc:{col:1,line:27},startBody:{col:21,line:21},endBody:{col:1,line:27}}};const y={title:"Layout/ClickOutsideWrapper",component:l.L,decorators:[a.BU],parameters:{docs:{page:E}}},h=()=>n.createElement(l.L,{onClick:(0,t.action)("Clicked outside")},n.createElement("div",{style:{width:"300px",border:"1px solid grey",padding:"20px"}},"Container"));var s=y;h.parameters=b({storySource:{source:`() => {
  return (
    <ClickOutsideWrapper onClick={action('Clicked outside')}>
      <div style={{ width: '300px', border: '1px solid grey', padding: '20px' }}>Container</div>
    </ClickOutsideWrapper>
  );
}`}},h.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ClickOutsideWrapper/ClickOutsideWrapper.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ClickOutsideWrapper/ClickOutsideWrapper.story.tsx#ComponentMeta"})}catch(o){}},"./src/components/Collapse/CollapsableSection.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return p},default:function(){return S}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("./src/components/Collapse/CollapsableSection.tsx"),x=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),d=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),i=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function c(k){const D=Object.assign({h1:"h1",p:"p"},(0,d.ah)(),k.components);return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(i.h_,{title:"MDX|CollapsableSection",component:f.s}),`
`,(0,x.jsx)(D.h1,{children:"Collapsable Section"}),`
`,(0,x.jsx)(D.p,{children:"A simple container for enabling collapsing/expanding of content."}),`
`,(0,x.jsx)(i.xP,{of:f.s})]})}function E(k={}){const{wrapper:D}=Object.assign({},(0,d.ah)(),k.components);return D?(0,x.jsx)(D,Object.assign({},k,{children:(0,x.jsx)(c,k)})):c(k)}var O=E,m=Object.defineProperty,w=Object.defineProperties,_=Object.getOwnPropertyDescriptors,C=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,v=(k,D,M)=>D in k?m(k,D,{enumerable:!0,configurable:!0,writable:!0,value:M}):k[D]=M,y=(k,D)=>{for(var M in D||(D={}))b.call(D,M)&&v(k,M,D[M]);if(C)for(var M of C(D))g.call(D,M)&&v(k,M,D[M]);return k},h=(k,D)=>w(k,_(D)),s=(k,D)=>{var M={};for(var I in k)b.call(k,I)&&D.indexOf(I)<0&&(M[I]=k[I]);if(k!=null&&C)for(var I of C(k))D.indexOf(I)<0&&g.call(k,I)&&(M[I]=k[I]);return M},o=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { CollapsableSection, Props } from './CollapsableSection';
import mdx from './CollapsableSection.mdx';

const meta: ComponentMeta<typeof CollapsableSection> = {
  title: 'Layout/CollapsableSection',
  component: CollapsableSection,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['className', 'contentClassName', 'onToggle', 'labelId', 'isOpen'],
    },
  },
  args: {
    isOpen: false,
    loading: false,
    label: 'Collapsable section title',
    children: 'Collapsed content data',
  },
  argTypes: {
    label: { control: 'text' },
  },
};

export const Basic: ComponentStory<typeof CollapsableSection> = ({ children, ...args }: Props) => {
  const [, updateArgs] = useArgs();

  const onToggle = (isOpen: boolean) => {
    action('onToggle fired')({ isOpen });
    updateArgs({ isOpen });
  };

  return (
    <div>
      <CollapsableSection {...args} onToggle={onToggle}>
        <>{children}</>
      </CollapsableSection>
    </div>
  );
};

export default meta;
`,r={Basic:{startLoc:{col:64,line:34},endLoc:{col:1,line:49},startBody:{col:64,line:34},endBody:{col:1,line:49}}};const u={title:"Layout/CollapsableSection",component:f.s,decorators:[l.BU],parameters:{docs:{page:O},controls:{exclude:["className","contentClassName","onToggle","labelId","isOpen"]}},args:{isOpen:!1,loading:!1,label:"Collapsable section title",children:"Collapsed content data"},argTypes:{label:{control:"text"}}},p=k=>{var D=k,{children:M}=D,I=s(D,["children"]);const[,T]=(0,n.D8)(),j=K=>{(0,t.action)("onToggle fired")({isOpen:K}),T({isOpen:K})};return a.createElement("div",null,a.createElement(f.s,h(y({},I),{onToggle:j}),a.createElement(a.Fragment,null,M)))};var S=u;p.parameters=y({storySource:{source:`({ children, ...args }: Props) => {
  const [, updateArgs] = useArgs();

  const onToggle = (isOpen: boolean) => {
    action('onToggle fired')({ isOpen });
    updateArgs({ isOpen });
  };

  return (
    <div>
      <CollapsableSection {...args} onToggle={onToggle}>
        <>{children}</>
      </CollapsableSection>
    </div>
  );
}`}},p.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Collapse/CollapsableSection.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Collapse/CollapsableSection.story.tsx#ComponentMeta"})}catch(k){}},"./src/components/Collapse/Collapse.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return Q},Controlled:function(){return P},default:function(){return ae}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/components/Button/Button.tsx"),i=e("./src/components/Icon/Icon.tsx"),c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(q,Y,ve)=>Y in q?c(q,Y,{enumerable:!0,configurable:!0,writable:!0,value:ve}):q[Y]=ve,b=(q,Y)=>{for(var ve in Y||(Y={}))w.call(Y,ve)&&C(q,ve,Y[ve]);if(m)for(var ve of m(Y))_.call(Y,ve)&&C(q,ve,Y[ve]);return q},g=(q,Y)=>E(q,O(Y)),v=(q,Y)=>{var ve={};for(var re in q)w.call(q,re)&&Y.indexOf(re)<0&&(ve[re]=q[re]);if(q!=null&&m)for(var re of m(q))Y.indexOf(re)<0&&_.call(q,re)&&(ve[re]=q[re]);return ve};const y=q=>({collapse:f.iv`
    label: collapse;
    margin-bottom: ${q.spacing(1)};
    background-color: ${q.colors.background.primary};
    border: 1px solid ${q.colors.border.medium};
    position: relative;
    border-radius: ${q.shape.radius.default};
    width: 100%;
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
  `,collapseBody:f.iv`
    label: collapse__body;
    padding: ${q.spacing(q.components.panel.padding)};
    padding-top: 0;
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
  `,bodyContentWrapper:f.iv`
    label: bodyContentWrapper;
    flex: 1;
    overflow: hidden;
  `,loader:f.iv`
    label: collapse__loader;
    height: 2px;
    position: relative;
    overflow: hidden;
    background: none;
    margin: ${q.spacing(.5)};
  `,loaderActive:f.iv`
    label: collapse__loader_active;
    &:after {
      content: ' ';
      display: block;
      width: 25%;
      top: 0;
      top: -50%;
      height: 250%;
      position: absolute;
      animation: loader 2s cubic-bezier(0.17, 0.67, 0.83, 0.67) 500ms;
      animation-iteration-count: 100;
      left: -25%;
      background: ${q.colors.primary.main};
    }
    @keyframes loader {
      from {
        left: -25%;
        opacity: 0.1;
      }
      to {
        left: 100%;
        opacity: 1;
      }
    }
  `,header:f.iv`
    label: collapse__header;
    padding: ${q.spacing(1,2,1,2)};
    display: flex;
    transition: all 0.1s linear;
  `,headerCollapsed:f.iv`
    label: collapse__header--collapsed;
    padding: ${q.spacing(1,2,1,2)};
  `,headerLabel:f.iv`
    label: collapse__header-label;
    font-weight: ${q.typography.fontWeightMedium};
    margin-right: ${q.spacing(1)};
    font-size: ${q.typography.size.md};
  `,icon:f.iv`
    label: collapse__icon;
    margin: ${q.spacing(.25,1,0,-1)};
  `}),h=q=>{var Y=q,{isOpen:ve,onToggle:re}=Y,je=v(Y,["isOpen","onToggle"]);const[me,ne]=(0,a.useState)(ve);return a.createElement(s,g(b({isOpen:me,collapsible:!0},je),{onToggle:()=>{ne(!me),re&&re(!me)}}))},s=({isOpen:q,label:Y,loading:ve,collapsible:re,onToggle:je,className:me,children:ne})=>{const Z=(0,x.wW)(d.gN),te=(0,x.wW)(y),Pe=()=>{je&&je(!q)},he=(0,f.cx)([te.collapse,me]),ie=ve?(0,f.cx)([te.loader,te.loaderActive]):(0,f.cx)([te.loader]),Ce=re?(0,f.cx)([te.header]):(0,f.cx)([te.headerCollapsed]);return a.createElement("div",{className:he},a.createElement("button",{type:"button",className:(0,f.cx)(Z,Ce),onClick:Pe},re&&a.createElement(i.J,{className:te.icon,name:q?"angle-down":"angle-right"}),a.createElement("div",{className:(0,f.cx)([te.headerLabel])},Y)),q&&a.createElement("div",{className:(0,f.cx)([te.collapseBody])},a.createElement("div",{className:ie}),a.createElement("div",{className:te.bodyContentWrapper},ne)))};s.displayName="Collapse";try{s.displayName="Collapse",s.__docgenInfo={description:"",displayName:"Collapse",props:{isOpen:{defaultValue:null,description:"Expand or collapse te content",name:"isOpen",required:!1,type:{name:"boolean"}},label:{defaultValue:null,description:"Element or text for the Collapse header",name:"label",required:!0,type:{name:"ReactNode"}},loading:{defaultValue:null,description:"Indicates loading state of the content",name:"loading",required:!1,type:{name:"boolean"}},collapsible:{defaultValue:null,description:"Toggle collapsed header icon",name:"collapsible",required:!1,type:{name:"boolean"}},onToggle:{defaultValue:null,description:"Callback for the toggle functionality",name:"onToggle",required:!1,type:{name:"((isOpen: boolean) => void)"}},className:{defaultValue:null,description:"Additional class name for the root element",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Collapse/Collapse.tsx#Collapse"]={docgenInfo:s.__docgenInfo,name:"Collapse",path:"src/components/Collapse/Collapse.tsx#Collapse"})}catch(q){}var o=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),r=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),u=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function p(q){const Y=Object.assign({h1:"h1",p:"p",h2:"h2",pre:"pre",code:"code"},(0,r.ah)(),q.components);return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(Y.h1,{children:"Collapse"}),`
`,(0,o.jsx)(Y.p,{children:"A content area, which can be horizontally collapsed and expanded. Can be used to hide extra information on the page."}),`
`,(0,o.jsx)(Y.h2,{children:"Usage"}),`
`,(0,o.jsx)(Y.pre,{children:(0,o.jsx)(Y.code,{className:"language-jsx",children:`const [isOpen, setIsOpen] = useState(false);

<Collapse label="Collapse panel" isOpen={isOpen} onToggle={() => setIsOpen(!isOpen)}>
  <p>Panel data</p>
</Collapse>;
`})}),`
`,(0,o.jsx)(u.xP,{of:s})]})}function S(q={}){const{wrapper:Y}=Object.assign({},(0,r.ah)(),q.components);return Y?(0,o.jsx)(Y,Object.assign({},q,{children:(0,o.jsx)(p,q)})):p(q)}var k=S,D=Object.defineProperty,M=Object.defineProperties,I=Object.getOwnPropertyDescriptors,T=Object.getOwnPropertySymbols,j=Object.prototype.hasOwnProperty,K=Object.prototype.propertyIsEnumerable,F=(q,Y,ve)=>Y in q?D(q,Y,{enumerable:!0,configurable:!0,writable:!0,value:ve}):q[Y]=ve,$=(q,Y)=>{for(var ve in Y||(Y={}))j.call(Y,ve)&&F(q,ve,Y[ve]);if(T)for(var ve of T(Y))K.call(Y,ve)&&F(q,ve,Y[ve]);return q},R=(q,Y)=>M(q,I(Y)),U=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { withCenteredStory, withHorizontallyCenteredStory } from '../../utils/storybook/withCenteredStory';

import { Collapse, ControlledCollapse } from './Collapse';
import mdx from './Collapse.mdx';

const EXCLUDED_PROPS = ['className', 'onToggle'];

const meta: ComponentMeta<typeof Collapse> = {
  title: 'Layout/Collapse',
  component: Collapse,
  decorators: [withCenteredStory, withHorizontallyCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: EXCLUDED_PROPS,
    },
  },
  args: {
    children: 'Panel data',
    isOpen: false,
    label: 'Collapse panel',
    collapsible: true,
  },
  argTypes: {
    onToggle: { action: 'toggled' },
  },
};

export const Basic: ComponentStory<typeof Collapse> = (args) => {
  const [, updateArgs] = useArgs();
  return (
    <Collapse
      {...args}
      onToggle={() => {
        action('onToggle')({ isOpen: !args.isOpen });
        updateArgs({ isOpen: !args.isOpen });
      }}
    >
      <p>{args.children}</p>
    </Collapse>
  );
};

export const Controlled: ComponentStory<typeof ControlledCollapse> = (args) => {
  return (
    <ControlledCollapse {...args}>
      <p>{args.children}</p>
    </ControlledCollapse>
  );
};
Controlled.parameters = {
  controls: {
    exclude: [...EXCLUDED_PROPS, 'isOpen'],
  },
};

export default meta;
`,H={Basic:{startLoc:{col:54,line:36},endLoc:{col:1,line:49},startBody:{col:54,line:36},endBody:{col:1,line:49}},Controlled:{startLoc:{col:69,line:51},endLoc:{col:1,line:57},startBody:{col:69,line:51},endBody:{col:1,line:57}}};const W=["className","onToggle"],oe={title:"Layout/Collapse",component:s,decorators:[l.BU,l.zT],parameters:{docs:{page:k},controls:{exclude:W}},args:{children:"Panel data",isOpen:!1,label:"Collapse panel",collapsible:!0},argTypes:{onToggle:{action:"toggled"}}},Q=q=>{const[,Y]=(0,n.D8)();return a.createElement(s,R($({},q),{onToggle:()=>{(0,t.action)("onToggle")({isOpen:!q.isOpen}),Y({isOpen:!q.isOpen})}}),a.createElement("p",null,q.children))},P=q=>a.createElement(h,$({},q),a.createElement("p",null,q.children));P.parameters={controls:{exclude:[...W,"isOpen"]}};var ae=oe;Q.parameters=$({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  return (
    <Collapse
      {...args}
      onToggle={() => {
        action('onToggle')({ isOpen: !args.isOpen });
        updateArgs({ isOpen: !args.isOpen });
      }}
    >
      <p>{args.children}</p>
    </Collapse>
  );
}`}},Q.parameters),P.parameters=$({storySource:{source:`(args) => {
  return (
    <ControlledCollapse {...args}>
      <p>{args.children}</p>
    </ControlledCollapse>
  );
}`}},P.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Collapse/Collapse.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Collapse/Collapse.story.tsx#ComponentMeta"})}catch(q){}},"./src/components/ColorPicker/ColorPicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return H},Input:function(){return oe},SeriesPicker:function(){return W},default:function(){return Q}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("./src/components/ColorPicker/ColorPicker.tsx"),f=e("./src/themes/ThemeContext.tsx"),x=e("./src/components/Button/Button.tsx"),d=e("./src/utils/storybook/withCenteredStory.tsx"),i=e("./src/utils/storybook/withTheme.tsx"),c=e("./src/components/ColorPicker/ColorPicker.mdx"),E=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),O=e("../../.yarn/__virtual__/react-colorful-virtual-2349db95c0/2/yarn/cache/react-colorful-npm-5.6.1-ba0c706357-e432b7cb0d.zip/node_modules/react-colorful/dist/index.mjs"),m=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useThrottleFn.js"),w=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts"),_=e("./src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx"),C=e("./src/components/ColorPicker/ColorInput.tsx"),b=e("./src/components/ColorPicker/SpectrumPalette.tsx"),g=Object.defineProperty,v=Object.defineProperties,y=Object.getOwnPropertyDescriptors,h=Object.getOwnPropertySymbols,s=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,r=(P,ae,q)=>ae in P?g(P,ae,{enumerable:!0,configurable:!0,writable:!0,value:q}):P[ae]=q,u=(P,ae)=>{for(var q in ae||(ae={}))s.call(ae,q)&&r(P,q,ae[q]);if(h)for(var q of h(ae))o.call(ae,q)&&r(P,q,ae[q]);return P},p=(P,ae)=>v(P,y(ae)),S=(P,ae)=>{var q={};for(var Y in P)s.call(P,Y)&&ae.indexOf(Y)<0&&(q[Y]=P[Y]);if(P!=null&&h)for(var Y of h(P))ae.indexOf(Y)<0&&o.call(P,Y)&&(q[Y]=P[Y]);return q};const k=(0,a.forwardRef)((P,ae)=>{var q=P,{value:Y="",onChange:ve,returnColorAs:re="rgb"}=q,je=S(q,["value","onChange","returnColorAs"]);const[me,ne]=(0,a.useState)(Y),[Z,te]=(0,a.useState)(!1),Pe=(0,f.l4)(),he=(0,f.wW)(D),ie=(0,f.wW)(b.W);return(0,m.Z)(Ce=>{if(Ce===Y)return;if(!Ce){ve("");return}const Le=Pe.visualization.getColorByName(Ce);ve(re==="rgb"?w.cG(Le):w.k$(Le))},500,[me]),a.createElement(_.L,{onClick:()=>te(!1)},a.createElement("div",{className:he.wrapper},Z&&!je.disabled&&a.createElement(O.ef,{"data-testid":"color-popover",color:me,onChange:ne,className:(0,E.cx)(ie.root,he.picker)}),a.createElement(C.Z,p(u({},je),{theme:Pe,color:me,onChange:ne,buttonAriaLabel:"Open color picker",onClick:()=>te(!0),onBlur:()=>te(!1),ref:ae,isClearable:!0}))))});k.displayName="ColorPickerInput";const D=P=>({wrapper:E.iv`
      position: relative;
    `,picker:E.iv`
      &.react-colorful {
        position: absolute;
        width: 100%;
        z-index: 11;
        bottom: 36px;
      }
    `,inner:E.iv`
      position: absolute;
    `});try{k.displayName="ColorPickerInput",k.__docgenInfo={description:"",displayName:"ColorPickerInput",props:{prefix:{defaultValue:null,description:"Show an icon as a prefix in the input",name:"prefix",required:!1,type:{name:"ReactNode"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(color: string) => void"}},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"}},value:{defaultValue:{value:""},description:"",name:"value",required:!1,type:{name:"string"}},loading:{defaultValue:null,description:"Show a loading indicator as a suffix in the input",name:"loading",required:!1,type:{name:"boolean"}},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"}},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"}},returnColorAs:{defaultValue:{value:"rgb"},description:"Format for returning the color in onChange callback, defaults to 'rgb'",name:"returnColorAs",required:!1,type:{name:"enum",value:[{value:'"rgb"'},{value:'"hex"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/ColorPickerInput.tsx#ColorPickerInput"]={docgenInfo:k.__docgenInfo,name:"ColorPickerInput",path:"src/components/ColorPicker/ColorPickerInput.tsx#ColorPickerInput"})}catch(P){}var M=Object.defineProperty,I=Object.getOwnPropertySymbols,T=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable,K=(P,ae,q)=>ae in P?M(P,ae,{enumerable:!0,configurable:!0,writable:!0,value:q}):P[ae]=q,F=(P,ae)=>{for(var q in ae||(ae={}))T.call(ae,q)&&K(P,q,ae[q]);if(I)for(var q of I(ae))j.call(ae,q)&&K(P,q,ae[q]);return P},$=null,R={Basic:{startLoc:{col:57,line:33},endLoc:{col:1,line:43},startBody:{col:57,line:33},endBody:{col:1,line:43}},SeriesPicker:{startLoc:{col:70,line:45},endLoc:{col:1,line:73},startBody:{col:70,line:45},endBody:{col:1,line:73}},Input:{startLoc:{col:62,line:75},endLoc:{col:1,line:86},startBody:{col:62,line:75},endBody:{col:1,line:86}}};const U={title:"Pickers and Editors/ColorPicker",component:l.zH,subcomponents:{SeriesColorPicker:l.sp,ColorPickerInput:k},decorators:[d.BU],parameters:{docs:{page:c.Z},controls:{exclude:["onChange","onColorChange"]}},args:{enableNamedColors:!1,color:"#00ff00"}},H=({color:P,enableNamedColors:ae})=>{const[,q]=(0,n.D8)();return(0,i.A)(l.zH,{enableNamedColors:ae,color:P,onChange:Y=>{(0,t.action)("Color changed")(Y),q({color:Y})}})},W=({color:P,enableNamedColors:ae})=>{const[,q]=(0,n.D8)(),Y=(0,f.wW)(x.gN);return a.createElement(l.sp,{enableNamedColors:ae,yaxis:1,onToggleAxis:()=>{},color:P,onChange:ve=>{(0,t.action)("Color changed")(ve),q({color:ve})}},({ref:ve,showColorPicker:re,hideColorPicker:je})=>a.createElement("button",{type:"button",ref:ve,onMouseLeave:je,onClick:re,style:{color:P},className:Y},"Open color picker"))},oe=({color:P})=>{const[,ae]=(0,n.D8)();return a.createElement(k,{value:P,onChange:q=>{(0,t.action)("Color changed")(q),ae({color:q})}})};var Q=U;H.parameters=F({storySource:{source:`({ color, enableNamedColors }) => {
  const [, updateArgs] = useArgs();
  return renderComponentWithTheme(ColorPicker, {
    enableNamedColors,
    color,
    onChange: (color: string) => {
      action('Color changed')(color);
      updateArgs({ color });
    },
  });
}`}},H.parameters),W.parameters=F({storySource:{source:`({ color, enableNamedColors }) => {
  const [, updateArgs] = useArgs();
  const clearButton = useStyles2(clearButtonStyles);
  return (
    <SeriesColorPicker
      enableNamedColors={enableNamedColors}
      yaxis={1}
      onToggleAxis={() => {}}
      color={color}
      onChange={(color) => {
        action('Color changed')(color);
        updateArgs({ color });
      }}
    >
      {({ ref, showColorPicker, hideColorPicker }) => (
        <button
          type="button"
          ref={ref}
          onMouseLeave={hideColorPicker}
          onClick={showColorPicker}
          style={{ color }}
          className={clearButton}
        >
          Open color picker
        </button>
      )}
    </SeriesColorPicker>
  );
}`}},W.parameters),oe.parameters=F({storySource:{source:`({ color }) => {
  const [, updateArgs] = useArgs();
  return (
    <ColorPickerInput
      value={color}
      onChange={(color) => {
        action('Color changed')(color);
        updateArgs({ color });
      }}
    />
  );
}`}},oe.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/ColorPicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ColorPicker/ColorPicker.story.tsx#ComponentMeta"})}catch(P){}},"./src/components/ColorPicker/ColorPickerPopover.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{basic:function(){return _},seriesColorPickerPopover:function(){return C}});var t=e("./src/utils/storybook/withCenteredStory.tsx"),n=e("./src/utils/storybook/withTheme.tsx"),a=e("./src/components/ColorPicker/ColorPickerPopover.tsx"),l=e("./src/components/ColorPicker/SeriesColorPickerPopover.tsx"),f=Object.defineProperty,x=Object.getOwnPropertySymbols,d=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable,c=(b,g,v)=>g in b?f(b,g,{enumerable:!0,configurable:!0,writable:!0,value:v}):b[g]=v,E=(b,g)=>{for(var v in g||(g={}))d.call(g,v)&&c(b,v,g[v]);if(x)for(var v of x(g))i.call(g,v)&&c(b,v,g[v]);return b},O=`import { ComponentMeta } from '@storybook/react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';
import { renderComponentWithTheme } from '../../utils/storybook/withTheme';

import { ColorPickerPopover } from './ColorPickerPopover';
import { SeriesColorPickerPopover } from './SeriesColorPickerPopover';

const meta: ComponentMeta<typeof ColorPickerPopover> = {
  title: 'Pickers and Editors/ColorPicker/Popovers',
  component: ColorPickerPopover,
  subcomponents: { SeriesColorPickerPopover },
  decorators: [withCenteredStory],
};

export const basic = () => {
  return renderComponentWithTheme(ColorPickerPopover, {
    color: '#BC67E6',
    onChange: (color: string) => {
      console.log(color);
    },
  });
};

export const seriesColorPickerPopover = () => {
  return renderComponentWithTheme(SeriesColorPickerPopover, {
    color: '#BC67E6',
    onChange: (color: string) => {
      console.log(color);
    },
  });
};

export default meta;
`,m={basic:{startLoc:{col:21,line:16},endLoc:{col:1,line:23},startBody:{col:21,line:16},endBody:{col:1,line:23}},seriesColorPickerPopover:{startLoc:{col:40,line:25},endLoc:{col:1,line:32},startBody:{col:40,line:25},endBody:{col:1,line:32}}};const w={title:"Pickers and Editors/ColorPicker/Popovers",component:a.h,subcomponents:{SeriesColorPickerPopover:l.j},decorators:[t.BU]},_=()=>(0,n.A)(a.h,{color:"#BC67E6",onChange:b=>{console.log(b)}}),C=()=>(0,n.A)(l.j,{color:"#BC67E6",onChange:b=>{console.log(b)}});V.default=w,_.parameters=E({storySource:{source:`() => {
  return renderComponentWithTheme(ColorPickerPopover, {
    color: '#BC67E6',
    onChange: (color: string) => {
      console.log(color);
    },
  });
}`}},_.parameters),C.parameters=E({storySource:{source:`() => {
  return renderComponentWithTheme(SeriesColorPickerPopover, {
    color: '#BC67E6',
    onChange: (color: string) => {
      console.log(color);
    },
  });
}`}},C.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/ColorPickerPopover.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ColorPicker/ColorPickerPopover.story.tsx#ComponentMeta"})}catch(b){}},"./src/components/ColorPicker/NamedColorsPalette.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{NamedColors:function(){return _}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/ColorPicker/ColorPicker.mdx"),l=e("./src/components/ColorPicker/NamedColorsPalette.tsx"),f=Object.defineProperty,x=Object.getOwnPropertySymbols,d=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable,c=(C,b,g)=>b in C?f(C,b,{enumerable:!0,configurable:!0,writable:!0,value:g}):C[b]=g,E=(C,b)=>{for(var g in b||(b={}))d.call(b,g)&&c(C,g,b[g]);if(x)for(var g of x(b))i.call(b,g)&&c(C,g,b[g]);return C},O=`import { Meta, Story } from '@storybook/react';
import React, { useState } from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './ColorPicker.mdx';
import { NamedColorsPalette, NamedColorsPaletteProps } from './NamedColorsPalette';

const meta: Meta = {
  title: 'Pickers and Editors/ColorPicker/Palettes/NamedColorsPalette',
  component: NamedColorsPalette,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['theme', 'color'],
    },
  },
  argTypes: {
    selectedColor: { control: { type: 'select', options: ['green', 'red', 'light-blue', 'yellow'] } },
  },
};

interface StoryProps extends Partial<NamedColorsPaletteProps> {
  selectedColor: string;
}

export const NamedColors: Story<StoryProps> = ({ selectedColor }) => {
  const [color, setColor] = useState('green');
  return <NamedColorsPalette color={color} onChange={setColor} />;
};

NamedColors.args = {
  color: 'green',
};

export default meta;
`,m={NamedColors:{startLoc:{col:46,line:30},endLoc:{col:1,line:33},startBody:{col:46,line:30},endBody:{col:1,line:33}}};const w={title:"Pickers and Editors/ColorPicker/Palettes/NamedColorsPalette",component:l.V,decorators:[n.BU],parameters:{docs:{page:a.Z},controls:{exclude:["theme","color"]}},argTypes:{selectedColor:{control:{type:"select",options:["green","red","light-blue","yellow"]}}}},_=({selectedColor:C})=>{const[b,g]=(0,t.useState)("green");return t.createElement(l.V,{color:b,onChange:g})};_.args={color:"green"},V.default=w,_.parameters=E({storySource:{source:`({ selectedColor }) => {
  const [color, setColor] = useState('green');
  return <NamedColorsPalette color={color} onChange={setColor} />;
}`}},_.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/NamedColorsPalette.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/ColorPicker/NamedColorsPalette.story.tsx#Meta"})}catch(C){}},"./src/components/ColorPicker/SpectrumPalette.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Simple:function(){return b}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/utils/storybook/withTheme.tsx"),f=e("./src/components/ColorPicker/ColorPicker.mdx"),x=e("./src/components/ColorPicker/SpectrumPalette.tsx"),d=Object.defineProperty,i=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable,O=(g,v,y)=>v in g?d(g,v,{enumerable:!0,configurable:!0,writable:!0,value:y}):g[v]=y,m=(g,v)=>{for(var y in v||(v={}))c.call(v,y)&&O(g,y,v[y]);if(i)for(var y of i(v))E.call(v,y)&&O(g,y,v[y]);return g},w=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';
import { renderComponentWithTheme } from '../../utils/storybook/withTheme';

import mdx from './ColorPicker.mdx';
import SpectrumPalette from './SpectrumPalette';

const meta: ComponentMeta<typeof SpectrumPalette> = {
  title: 'Pickers and Editors/ColorPicker/Palettes/SpectrumPalette',
  component: SpectrumPalette,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['onChange'],
    },
  },
  args: {
    color: 'red',
  },
};

export const Simple: ComponentStory<typeof SpectrumPalette> = ({ color }) => {
  const [, updateArgs] = useArgs();
  return renderComponentWithTheme(SpectrumPalette, {
    color,
    onChange: (color: string) => {
      action('Color changed')(color);
      updateArgs({ color });
    },
  });
};

export default meta;
`,_={Simple:{startLoc:{col:62,line:28},endLoc:{col:1,line:37},startBody:{col:62,line:28},endBody:{col:1,line:37}}};const C={title:"Pickers and Editors/ColorPicker/Palettes/SpectrumPalette",component:x.Z,decorators:[a.BU],parameters:{docs:{page:f.Z},controls:{exclude:["onChange"]}},args:{color:"red"}},b=({color:g})=>{const[,v]=(0,n.D8)();return(0,l.A)(x.Z,{color:g,onChange:y=>{(0,t.action)("Color changed")(y),v({color:y})}})};V.default=C,b.parameters=m({storySource:{source:`({ color }) => {
  const [, updateArgs] = useArgs();
  return renderComponentWithTheme(SpectrumPalette, {
    color,
    onChange: (color: string) => {
      action('Color changed')(color);
      updateArgs({ color });
    },
  });
}`}},b.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/SpectrumPalette.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ColorPicker/SpectrumPalette.story.tsx#ComponentMeta"})}catch(g){}},"./src/components/ConfirmButton/ConfirmButton.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return k},Delete:function(){return M},WithCustomButton:function(){return D},default:function(){return I}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/themes/stylesFactory.ts"),x=e("./src/components/Button/Button.tsx");class d extends n.PureComponent{constructor(){super(...arguments),this.mainButtonRef=n.createRef(),this.confirmButtonRef=n.createRef(),this.state={showConfirm:!1},this.onClickButton=j=>{j&&j.preventDefault(),this.setState({showConfirm:!0},()=>{this.props.autoFocus&&this.confirmButtonRef.current&&this.confirmButtonRef.current.focus()}),this.props.onClick&&this.props.onClick()},this.onClickCancel=j=>{j&&j.preventDefault(),this.setState({showConfirm:!1},()=>{var K;(K=this.mainButtonRef.current)==null||K.focus()}),this.props.onCancel&&this.props.onCancel()},this.onConfirm=j=>{j&&j.preventDefault(),this.props.onConfirm(),this.props.closeOnConfirm&&this.setState({showConfirm:!1})}}render(){const{theme:j,className:K,size:F,disabled:$,confirmText:R,confirmVariant:U,children:H}=this.props,W=c(j),oe=(0,a.cx)(K,this.state.showConfirm?W.buttonHide:W.buttonShow,$&&W.buttonDisabled),Q=(0,a.cx)(W.confirmButton,this.state.showConfirm?W.confirmButtonShow:W.confirmButtonHide),P=$?()=>{}:this.onClickButton;return n.createElement("span",{className:W.buttonContainer},n.createElement("div",{className:(0,a.cx)($&&W.disabled)},typeof H=="string"?n.createElement("span",{className:oe},n.createElement(x.zx,{size:F,fill:"text",onClick:P,ref:this.mainButtonRef},H)):n.createElement("span",{className:oe,onClick:P},H)),n.createElement("span",{className:Q},n.createElement(x.zx,{size:F,variant:U,onClick:this.onConfirm,ref:this.confirmButtonRef},R),n.createElement(x.zx,{size:F,fill:"text",onClick:this.onClickCancel},"Cancel")))}}const i=(0,l.HE)(d),c=(0,f.B)(T=>({buttonContainer:a.iv`
      display: flex;
      align-items: center;
      justify-content: flex-end;
    `,buttonDisabled:a.iv`
      text-decoration: none;
      color: ${T.colors.text.primary};
      opacity: 0.65;
      pointer-events: none;
    `,buttonShow:a.iv`
      opacity: 1;
      transition: opacity 0.1s ease;
      z-index: 2;
    `,buttonHide:a.iv`
      opacity: 0;
      transition: opacity 0.1s ease, visibility 0 0.1s;
      visibility: hidden;
      z-index: 0;
    `,confirmButton:a.iv`
      align-items: flex-start;
      background: ${T.colors.background.primary};
      display: flex;
      position: absolute;
      pointer-events: none;
    `,confirmButtonShow:a.iv`
      z-index: 1;
      opacity: 1;
      transition: opacity 0.08s ease-out, transform 0.1s ease-out;
      transform: translateX(0);
      pointer-events: all;
    `,confirmButtonHide:a.iv`
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.12s ease-in, transform 0.14s ease-in, visibility 0s 0.12s;
      transform: translateX(100px);
    `,disabled:a.iv`
      cursor: not-allowed;
    `}));i.defaultProps={size:"md",confirmText:"Save",disabled:!1,confirmVariant:"primary"},i.displayName="ConfirmButton";try{i.displayName="ConfirmButton",i.__docgenInfo={description:"",displayName:"ConfirmButton",props:{className:{defaultValue:null,description:"Custom button styles",name:"className",required:!1,type:{name:"string"}},onClick:{defaultValue:null,description:"Optional on click handler for the original button",name:"onClick",required:!1,type:{name:"(() => void)"}},size:{defaultValue:{value:"md"},description:"Button size",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'}]}},autoFocus:{defaultValue:null,description:"Move focus to button when mounted",name:"autoFocus",required:!1,type:{name:"boolean"}},disabled:{defaultValue:{value:"false"},description:"Disable button click action",name:"disabled",required:!1,type:{name:"boolean"}},onConfirm:{defaultValue:null,description:"Confirm action callback",name:"onConfirm",required:!0,type:{name:"() => void"}},confirmText:{defaultValue:{value:"Save"},description:"Text for the Confirm button",name:"confirmText",required:!1,type:{name:"string"}},confirmVariant:{defaultValue:{value:"primary"},description:"Variant of the Confirm button",name:"confirmVariant",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},closeOnConfirm:{defaultValue:null,description:"Hide confirm actions when after of them is clicked",name:"closeOnConfirm",required:!1,type:{name:"boolean"}},onCancel:{defaultValue:null,description:"Callback for the cancel action",name:"onCancel",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ConfirmButton/ConfirmButton.tsx#ConfirmButton"]={docgenInfo:i.__docgenInfo,name:"ConfirmButton",path:"src/components/ConfirmButton/ConfirmButton.tsx#ConfirmButton"})}catch(T){}var E=e("./src/utils/storybook/withCenteredStory.tsx"),O=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),m=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),w=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function _(T){const j=Object.assign({h1:"h1",p:"p",h2:"h2",code:"code",pre:"pre"},(0,m.ah)(),T.components);return(0,O.jsxs)(O.Fragment,{children:[(0,O.jsx)(w.h_,{title:"MDX|ConfirmButton",component:i}),`
`,(0,O.jsx)(j.h1,{children:"ConfirmButton"}),`
`,(0,O.jsx)(j.p,{children:"The ConfirmButton is an interactive component that adds a double-confirm option to a clickable action. When clicked, the action is replaced by an inline confirmation with the option to cancel. In Grafana, this is used, for example, for editing values in settings tables."}),`
`,(0,O.jsx)(j.h2,{children:"Variants"}),`
`,(0,O.jsxs)(j.p,{children:["There are four variants of the ",(0,O.jsx)(j.code,{children:"ConfirmButton"}),": primary, secondary, destructive, and link. The primary and secondary variants include a primary or secondary ",(0,O.jsx)(j.code,{children:"Button"})," component. The primary and secondary variant should be used to confirm actions like saving or adding data. The destructive variant includes a destructive ",(0,O.jsx)(j.code,{children:"Button"})," component. The destructive variant should be used to double-confirm a deletion or removal of an element. The link variant doesn't include any button and double-confirms as links instead."]}),`
`,(0,O.jsx)(j.p,{children:"Apart from the button variant, you can also modify the button size and the button text."}),`
`,(0,O.jsx)(j.h2,{children:"Usage"}),`
`,(0,O.jsx)(j.pre,{children:(0,O.jsx)(j.code,{className:"language-jsx",children:`<ConfirmButton
  closeOnConfirm
  size="md"
  confirmText="Are you sure?"
  confirmVariant="secondary"
  onConfirm={() => {
    console.log('Action confirmed!');
  }}
>
  Click me
</ConfirmButton>
`})}),`
`,(0,O.jsx)(w.xP,{of:i})]})}function C(T={}){const{wrapper:j}=Object.assign({},(0,m.ah)(),T.components);return j?(0,O.jsx)(j,Object.assign({},T,{children:(0,O.jsx)(_,T)})):_(T)}var b=C;const g=({size:T,disabled:j,onConfirm:K,"aria-label":F,closeOnConfirm:$})=>n.createElement(i,{confirmText:"Delete",confirmVariant:"destructive",size:T||"md",disabled:j,onConfirm:K,closeOnConfirm:$},n.createElement(x.zx,{"aria-label":F,variant:"destructive",icon:"times",size:T||"sm"}));try{g.displayName="DeleteButton",g.__docgenInfo={description:"",displayName:"DeleteButton",props:{onConfirm:{defaultValue:null,description:"Confirm action callback",name:"onConfirm",required:!0,type:{name:"() => void"}},size:{defaultValue:null,description:"Button size",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'}]}},disabled:{defaultValue:null,description:"Disable button click action",name:"disabled",required:!1,type:{name:"boolean"}},"aria-label":{defaultValue:null,description:"",name:"aria-label",required:!1,type:{name:"string"}},closeOnConfirm:{defaultValue:null,description:"Close after delete button is clicked",name:"closeOnConfirm",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ConfirmButton/DeleteButton.tsx#DeleteButton"]={docgenInfo:g.__docgenInfo,name:"DeleteButton",path:"src/components/ConfirmButton/DeleteButton.tsx#DeleteButton"})}catch(T){}var v=Object.defineProperty,y=Object.getOwnPropertySymbols,h=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,o=(T,j,K)=>j in T?v(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,r=(T,j)=>{for(var K in j||(j={}))h.call(j,K)&&o(T,K,j[K]);if(y)for(var K of y(j))s.call(j,K)&&o(T,K,j[K]);return T},u=null,p={Basic:{startLoc:{col:40,line:50},endLoc:{col:1,line:65},startBody:{col:40,line:50},endBody:{col:1,line:65}},WithCustomButton:{startLoc:{col:51,line:67},endLoc:{col:1,line:84},startBody:{col:51,line:67},endBody:{col:1,line:84}},Delete:{startLoc:{col:41,line:86},endLoc:{col:1,line:96},startBody:{col:41,line:86},endBody:{col:1,line:96}}};const S={title:"Buttons/ConfirmButton",component:i,decorators:[E.BU],subcomponents:{DeleteButton:g},parameters:{docs:{page:b},controls:{exclude:["className","onClick","onCancel","onConfirm"]}},args:{buttonText:"Edit",confirmText:"Save",size:"md",confirmVariant:"primary",disabled:!1,closeOnConfirm:!0},argTypes:{confirmVariant:{control:{type:"select"},options:["primary","secondary","destructive","link"]},size:{control:{type:"select"},options:["xs","sm","md","lg"]}}},k=T=>n.createElement(i,{closeOnConfirm:T.closeOnConfirm,size:T.size,confirmText:T.confirmText,disabled:T.disabled,confirmVariant:T.confirmVariant,onConfirm:()=>{(0,t.action)("Saved")("save!")}},T.buttonText),D=T=>n.createElement(i,{closeOnConfirm:T.closeOnConfirm,size:T.size,confirmText:T.confirmText,disabled:T.disabled,confirmVariant:T.confirmVariant,onConfirm:()=>{(0,t.action)("Saved")("save!")}},n.createElement(x.zx,{size:T.size,variant:"secondary",icon:"pen"},T.buttonText)),M=T=>n.createElement(g,{size:T.size,disabled:T.disabled,onConfirm:()=>{(0,t.action)("Deleted")("delete!")}});var I=S;k.parameters=r({storySource:{source:`(args) => {
  return (
    <ConfirmButton
      closeOnConfirm={args.closeOnConfirm}
      size={args.size}
      confirmText={args.confirmText}
      disabled={args.disabled}
      confirmVariant={args.confirmVariant}
      onConfirm={() => {
        action('Saved')('save!');
      }}
    >
      {args.buttonText}
    </ConfirmButton>
  );
}`}},k.parameters),D.parameters=r({storySource:{source:`(args) => {
  return (
    <ConfirmButton
      closeOnConfirm={args.closeOnConfirm}
      size={args.size}
      confirmText={args.confirmText}
      disabled={args.disabled}
      confirmVariant={args.confirmVariant}
      onConfirm={() => {
        action('Saved')('save!');
      }}
    >
      <Button size={args.size} variant="secondary" icon="pen">
        {args.buttonText}
      </Button>
    </ConfirmButton>
  );
}`}},D.parameters),M.parameters=r({storySource:{source:`(args) => {
  return (
    <DeleteButton
      size={args.size}
      disabled={args.disabled}
      onConfirm={() => {
        action('Deleted')('delete!');
      }}
    />
  );
}`}},M.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ConfirmButton/ConfirmButton.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/ConfirmButton/ConfirmButton.story.tsx#Meta"})}catch(T){}},"./src/components/ConfirmModal/ConfirmModal.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{AlternativeAction:function(){return T},Basic:function(){return I},WithConfirmation:function(){return j},default:function(){return K}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),l=e("../grafana-e2e-selectors/src/selectors/index.ts"),f=e("./src/components/Layout/Layout.tsx"),x=e("./src/components/Input/Input.tsx"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/components/Button/Button.tsx"),c=e("./src/components/Modal/Modal.tsx");const E=({isOpen:F,title:$,body:R,description:U,confirmText:H,confirmVariant:W="destructive",confirmationText:oe,dismissText:Q="Cancel",dismissVariant:P="secondary",alternativeText:ae,modalClass:q,icon:Y="exclamation-triangle",onConfirm:ve,onDismiss:re,onAlternative:je,confirmButtonVariant:me="destructive"})=>{const[ne,Z]=(0,n.useState)(Boolean(oe)),te=(0,d.wW)(O),Pe=(0,n.useRef)(null),he=ie=>{Z((oe==null?void 0:oe.localeCompare(ie.currentTarget.value))!==0)};return(0,n.useEffect)(()=>{var ie;F&&((ie=Pe.current)==null||ie.focus())},[F]),(0,n.useEffect)(()=>{F&&Z(Boolean(oe))},[F,oe]),n.createElement(c.u,{className:(0,a.cx)(te.modal,q),title:$,icon:Y,isOpen:F,onDismiss:re},n.createElement("div",{className:te.modalText},R,U?n.createElement("div",{className:te.modalDescription},U):null,oe?n.createElement("div",{className:te.modalConfirmationInput},n.createElement(f.Lh,null,n.createElement(x.I,{placeholder:`Type ${oe} to confirm`,onChange:he}))):null),n.createElement(c.u.ButtonRow,null,n.createElement(i.zx,{variant:P,onClick:re,fill:"outline"},Q),n.createElement(i.zx,{variant:me,onClick:ve,disabled:ne,ref:Pe,"aria-label":l.wl.pages.ConfirmModal.delete},H),je?n.createElement(i.zx,{variant:"primary",onClick:je},ae):null))},O=F=>({modal:a.iv`
    width: 500px;
  `,modalText:(0,a.iv)({fontSize:F.typography.h5.fontSize,color:F.colors.text.primary}),modalDescription:(0,a.iv)({fontSize:F.typography.body.fontSize}),modalConfirmationInput:(0,a.iv)({paddingTop:F.spacing(1)})});try{E.displayName="ConfirmModal",E.__docgenInfo={description:"",displayName:"ConfirmModal",props:{isOpen:{defaultValue:null,description:"Toggle modal's open/closed state",name:"isOpen",required:!0,type:{name:"boolean"}},title:{defaultValue:null,description:"Title for the modal header",name:"title",required:!0,type:{name:"string"}},body:{defaultValue:null,description:"Modal content",name:"body",required:!0,type:{name:"ReactNode"}},description:{defaultValue:null,description:"Modal description",name:"description",required:!1,type:{name:"ReactNode"}},confirmText:{defaultValue:null,description:"Text for confirm button",name:"confirmText",required:!0,type:{name:"string"}},confirmVariant:{defaultValue:{value:"destructive"},description:"Variant for confirm button",name:"confirmVariant",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},dismissText:{defaultValue:{value:"Cancel"},description:"Text for dismiss button",name:"dismissText",required:!1,type:{name:"string"}},dismissVariant:{defaultValue:{value:"secondary"},description:"Variant for dismiss button",name:"dismissVariant",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},icon:{defaultValue:{value:"exclamation-triangle"},description:"Icon for the modal header",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},modalClass:{defaultValue:null,description:"Additional styling for modal container",name:"modalClass",required:!1,type:{name:"string"}},confirmationText:{defaultValue:null,description:"Text user needs to fill in before confirming",name:"confirmationText",required:!1,type:{name:"string"}},alternativeText:{defaultValue:null,description:"Text for alternative button",name:"alternativeText",required:!1,type:{name:"string"}},confirmButtonVariant:{defaultValue:{value:"destructive"},description:"Confirm button variant",name:"confirmButtonVariant",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},onConfirm:{defaultValue:null,description:"Confirm action callback",name:"onConfirm",required:!0,type:{name:"() => void"}},onDismiss:{defaultValue:null,description:"Dismiss action callback",name:"onDismiss",required:!0,type:{name:"() => void"}},onAlternative:{defaultValue:null,description:"Alternative action callback",name:"onAlternative",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ConfirmModal/ConfirmModal.tsx#ConfirmModal"]={docgenInfo:E.__docgenInfo,name:"ConfirmModal",path:"src/components/ConfirmModal/ConfirmModal.tsx#ConfirmModal"})}catch(F){}var m=e("./src/utils/storybook/withCenteredStory.tsx"),w=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),_=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),C=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function b(F){const $=Object.assign({h1:"h1",p:"p",pre:"pre",code:"code"},(0,_.ah)(),F.components);return(0,w.jsxs)(w.Fragment,{children:[(0,w.jsx)(C.h_,{title:"MDX|ConfirmModal",component:E}),`
`,(0,w.jsx)($.h1,{children:"ConfirmModal"}),`
`,(0,w.jsx)($.p,{children:"Used to request user for action confirmation, e.g. deleting items. Triggers provided 'onConfirm' callback."}),`
`,(0,w.jsx)($.h1,{children:"Usage"}),`
`,(0,w.jsx)($.pre,{children:(0,w.jsx)($.code,{className:"language-jsx",children:`<ConfirmModal
  isOpen={false}
  title="Delete user"
  body="Are you sure you want to delete this user?"
  confirmText="Confirm"
  icon="exclamation-triangle"
  onConfirm={() => console.log('Confirm action')}
  onDismiss={() => console.log('Dismiss action')}
/>
`})}),`
`,(0,w.jsx)(C.xP,{of:E})]})}function g(F={}){const{wrapper:$}=Object.assign({},(0,_.ah)(),F.components);return $?(0,w.jsx)($,Object.assign({},F,{children:(0,w.jsx)(b,F)})):b(F)}var v=g,y=Object.defineProperty,h=Object.getOwnPropertySymbols,s=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,r=(F,$,R)=>$ in F?y(F,$,{enumerable:!0,configurable:!0,writable:!0,value:R}):F[$]=R,u=(F,$)=>{for(var R in $||($={}))s.call($,R)&&r(F,R,$[R]);if(h)for(var R of h($))o.call($,R)&&r(F,R,$[R]);return F},p=`import { action } from '@storybook/addon-actions';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { ConfirmModal } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './ConfirmModal.mdx';

const defaultExcludes = ['onConfirm', 'onDismiss', 'onAlternative'];

const meta: ComponentMeta<typeof ConfirmModal> = {
  title: 'Overlays/ConfirmModal',
  component: ConfirmModal,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: defaultExcludes,
    },
  },
  argTypes: {
    icon: { control: { type: 'select', options: ['exclamation-triangle', 'power', 'cog', 'lock', 'trash-alt'] } },
    body: { control: { type: 'text' } },
    description: { control: { type: 'text' } },
  },
};

const defaultActions = {
  onConfirm: () => {
    action('Confirmed')('delete');
  },
  onDismiss: () => {
    action('Dismiss')('close');
  },
  onAlternative: () => {
    action('Alternative')('alternative');
  },
};

export const Basic: ComponentStory<typeof ConfirmModal> = ({
  title,
  body,
  description,
  confirmText,
  confirmButtonVariant,
  dismissText,
  icon,
  isOpen,
}) => {
  const { onConfirm, onDismiss } = defaultActions;
  return (
    <ConfirmModal
      isOpen={isOpen}
      title={title}
      body={body}
      description={description}
      confirmText={confirmText}
      confirmButtonVariant={confirmButtonVariant}
      dismissText={dismissText}
      icon={icon}
      onConfirm={onConfirm}
      onDismiss={onDismiss}
    />
  );
};

Basic.parameters = {
  controls: {
    exclude: [...defaultExcludes, 'alternativeText', 'confirmationText'],
  },
};

Basic.args = {
  title: 'Delete user',
  body: 'Are you sure you want to delete this user?',
  description: 'Removing the user will not remove any dashboards the user has created',
  confirmText: 'Delete',
  confirmButtonVariant: 'destructive',
  dismissText: 'Cancel',
  icon: 'exclamation-triangle',
  isOpen: true,
};

export const AlternativeAction: ComponentStory<typeof ConfirmModal> = ({
  title,
  body,
  description,
  confirmText,
  dismissText,
  icon,
  alternativeText,
  isOpen,
}) => {
  const { onConfirm, onDismiss, onAlternative } = defaultActions;
  return (
    <ConfirmModal
      isOpen={isOpen}
      title={title}
      body={body}
      description={description}
      confirmText={confirmText}
      dismissText={dismissText}
      alternativeText={alternativeText}
      icon={icon}
      onConfirm={onConfirm}
      onDismiss={onDismiss}
      onAlternative={onAlternative}
    />
  );
};

AlternativeAction.parameters = {
  controls: {
    exclude: [...defaultExcludes, 'confirmationText', 'confirmButtonVariant'],
  },
};

AlternativeAction.args = {
  title: 'Delete row',
  body: 'Are you sure you want to remove this row and all its panels?',
  alternativeText: 'Delete row only',
  confirmText: 'Yes',
  dismissText: 'Cancel',
  icon: 'trash-alt',
  isOpen: true,
};

export const WithConfirmation: ComponentStory<typeof ConfirmModal> = ({
  title,
  body,
  description,
  confirmationText,
  confirmText,
  dismissText,
  icon,
  isOpen,
}) => {
  const { onConfirm, onDismiss } = defaultActions;
  return (
    <ConfirmModal
      isOpen={isOpen}
      title={title}
      body={body}
      confirmationText={confirmationText}
      description={description}
      confirmText={confirmText}
      dismissText={dismissText}
      icon={icon}
      onConfirm={onConfirm}
      onDismiss={onDismiss}
    />
  );
};

WithConfirmation.parameters = {
  controls: {
    exclude: [...defaultExcludes, 'alternativeText', 'confirmButtonVariant'],
  },
};

WithConfirmation.args = {
  title: 'Delete',
  body: 'Do you want to delete this notification channel?',
  description: 'Deleting this notification channel will not delete from alerts any references to it',
  confirmationText: 'Delete',
  confirmText: 'Delete',
  dismissText: 'Cancel',
  icon: 'trash-alt',
  isOpen: true,
};

export default meta;
`,S={Basic:{startLoc:{col:58,line:44},endLoc:{col:1,line:69},startBody:{col:58,line:44},endBody:{col:1,line:69}},AlternativeAction:{startLoc:{col:70,line:88},endLoc:{col:1,line:114},startBody:{col:70,line:88},endBody:{col:1,line:114}},WithConfirmation:{startLoc:{col:69,line:132},endLoc:{col:1,line:157},startBody:{col:69,line:132},endBody:{col:1,line:157}}};const k=["onConfirm","onDismiss","onAlternative"],D={title:"Overlays/ConfirmModal",component:E,decorators:[m.BU],parameters:{docs:{page:v},controls:{exclude:k}},argTypes:{icon:{control:{type:"select",options:["exclamation-triangle","power","cog","lock","trash-alt"]}},body:{control:{type:"text"}},description:{control:{type:"text"}}}},M={onConfirm:()=>{(0,t.action)("Confirmed")("delete")},onDismiss:()=>{(0,t.action)("Dismiss")("close")},onAlternative:()=>{(0,t.action)("Alternative")("alternative")}},I=({title:F,body:$,description:R,confirmText:U,confirmButtonVariant:H,dismissText:W,icon:oe,isOpen:Q})=>{const{onConfirm:P,onDismiss:ae}=M;return n.createElement(E,{isOpen:Q,title:F,body:$,description:R,confirmText:U,confirmButtonVariant:H,dismissText:W,icon:oe,onConfirm:P,onDismiss:ae})};I.parameters={controls:{exclude:[...k,"alternativeText","confirmationText"]}},I.args={title:"Delete user",body:"Are you sure you want to delete this user?",description:"Removing the user will not remove any dashboards the user has created",confirmText:"Delete",confirmButtonVariant:"destructive",dismissText:"Cancel",icon:"exclamation-triangle",isOpen:!0};const T=({title:F,body:$,description:R,confirmText:U,dismissText:H,icon:W,alternativeText:oe,isOpen:Q})=>{const{onConfirm:P,onDismiss:ae,onAlternative:q}=M;return n.createElement(E,{isOpen:Q,title:F,body:$,description:R,confirmText:U,dismissText:H,alternativeText:oe,icon:W,onConfirm:P,onDismiss:ae,onAlternative:q})};T.parameters={controls:{exclude:[...k,"confirmationText","confirmButtonVariant"]}},T.args={title:"Delete row",body:"Are you sure you want to remove this row and all its panels?",alternativeText:"Delete row only",confirmText:"Yes",dismissText:"Cancel",icon:"trash-alt",isOpen:!0};const j=({title:F,body:$,description:R,confirmationText:U,confirmText:H,dismissText:W,icon:oe,isOpen:Q})=>{const{onConfirm:P,onDismiss:ae}=M;return n.createElement(E,{isOpen:Q,title:F,body:$,confirmationText:U,description:R,confirmText:H,dismissText:W,icon:oe,onConfirm:P,onDismiss:ae})};j.parameters={controls:{exclude:[...k,"alternativeText","confirmButtonVariant"]}},j.args={title:"Delete",body:"Do you want to delete this notification channel?",description:"Deleting this notification channel will not delete from alerts any references to it",confirmationText:"Delete",confirmText:"Delete",dismissText:"Cancel",icon:"trash-alt",isOpen:!0};var K=D;I.parameters=u({storySource:{source:`({
  title,
  body,
  description,
  confirmText,
  confirmButtonVariant,
  dismissText,
  icon,
  isOpen,
}) => {
  const { onConfirm, onDismiss } = defaultActions;
  return (
    <ConfirmModal
      isOpen={isOpen}
      title={title}
      body={body}
      description={description}
      confirmText={confirmText}
      confirmButtonVariant={confirmButtonVariant}
      dismissText={dismissText}
      icon={icon}
      onConfirm={onConfirm}
      onDismiss={onDismiss}
    />
  );
}`}},I.parameters),T.parameters=u({storySource:{source:`({
  title,
  body,
  description,
  confirmText,
  dismissText,
  icon,
  alternativeText,
  isOpen,
}) => {
  const { onConfirm, onDismiss, onAlternative } = defaultActions;
  return (
    <ConfirmModal
      isOpen={isOpen}
      title={title}
      body={body}
      description={description}
      confirmText={confirmText}
      dismissText={dismissText}
      alternativeText={alternativeText}
      icon={icon}
      onConfirm={onConfirm}
      onDismiss={onDismiss}
      onAlternative={onAlternative}
    />
  );
}`}},T.parameters),j.parameters=u({storySource:{source:`({
  title,
  body,
  description,
  confirmationText,
  confirmText,
  dismissText,
  icon,
  isOpen,
}) => {
  const { onConfirm, onDismiss } = defaultActions;
  return (
    <ConfirmModal
      isOpen={isOpen}
      title={title}
      body={body}
      confirmationText={confirmationText}
      description={description}
      confirmText={confirmText}
      dismissText={dismissText}
      icon={icon}
      onConfirm={onConfirm}
      onDismiss={onDismiss}
    />
  );
}`}},j.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ConfirmModal/ConfirmModal.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ConfirmModal/ConfirmModal.story.tsx#ComponentMeta"})}catch(F){}},"./src/components/ContextMenu/ContextMenu.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return I},WithState:function(){return T},default:function(){return j}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/components/IconButton/IconButton.tsx"),f=e("./src/components/ContextMenu/ContextMenu.tsx"),x=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),d=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),i=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),c=e("./src/components/ContextMenu/WithContextMenu.tsx");function E(K){const F=Object.assign({h1:"h1",p:"p",h3:"h3",code:"code",h4:"h4",pre:"pre"},(0,d.ah)(),K.components);return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(F.h1,{children:"ContextMenu"}),`
`,(0,x.jsx)(F.p,{children:"A menu displaying additional options when it's not possible to show them at all times due to a space constraint."}),`
`,(0,x.jsx)(F.h3,{children:"Usage"}),`
`,(0,x.jsxs)(F.p,{children:["There are controlled and uncontrolled versions of the component available. With the controlled component (",(0,x.jsx)(F.code,{children:"ContextMenu"}),") the open/close logic needs to be handled separately. Uncontrolled component (",(0,x.jsx)(F.code,{children:"WithContextMenu"}),") handles this logic internally."]}),`
`,(0,x.jsx)(F.h4,{children:"Controlled component"}),`
`,(0,x.jsx)(F.pre,{children:(0,x.jsx)(F.code,{className:"language-jsx",children:`<ContextMenu
  x={10}
  y={11}
  onClose={() => {}}
  items={[{ label: 'Test', items: [{ label: 'First' }, { label: 'Second' }] }]}
/>
`})}),`
`,(0,x.jsx)(F.h4,{children:"Uncontrolled component"}),`
`,(0,x.jsx)(F.pre,{children:(0,x.jsx)(F.code,{className:"language-jsx",children:`<WithContextMenu getContextMenuItems={() => [{ label: 'Test', items: [{ label: 'First' }, { label: 'Second' }] }]}>
  {({ openMenu }) => <IconButton name="info-circle" onClick={openMenu} />}
</WithContextMenu>
`})}),`
`,(0,x.jsx)(F.h3,{children:"Props of ContextMenu"}),`
`,(0,x.jsx)(i.xP,{of:f.x}),`
`,(0,x.jsx)(F.h3,{children:"Props of WithContextMenu"}),`
`,(0,x.jsx)(i.xP,{of:c.z})]})}function O(K={}){const{wrapper:F}=Object.assign({},(0,d.ah)(),K.components);return F?(0,x.jsx)(F,Object.assign({},K,{children:(0,x.jsx)(E,K)})):E(K)}var m=O,w=e("./src/components/Menu/MenuGroup.tsx"),_=e("./src/components/Menu/MenuItem.tsx");const C=[{label:"Test",items:[{label:"First",ariaLabel:"First"},{label:"Second",ariaLabel:"Second"},{label:"Third",ariaLabel:"Third"},{label:"Fourth",ariaLabel:"Fourth"},{label:"Fifth",ariaLabel:"Fifth"}]}],b=()=>C.map((K,F)=>n.createElement(w.k,{key:`${K.label}${F}`,label:K.label},K.items.map($=>n.createElement(_.s,{key:$.label,label:$.label}))));var g=Object.defineProperty,v=Object.defineProperties,y=Object.getOwnPropertyDescriptors,h=Object.getOwnPropertySymbols,s=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,r=(K,F,$)=>F in K?g(K,F,{enumerable:!0,configurable:!0,writable:!0,value:$}):K[F]=$,u=(K,F)=>{for(var $ in F||(F={}))s.call(F,$)&&r(K,$,F[$]);if(h)for(var $ of h(F))o.call(F,$)&&r(K,$,F[$]);return K},p=(K,F)=>v(K,y(F)),S=null,k={Basic:{startLoc:{col:57,line:37},endLoc:{col:1,line:39},startBody:{col:57,line:37},endBody:{col:1,line:39}},WithState:{startLoc:{col:65,line:41},endLoc:{col:1,line:47},startBody:{col:65,line:41},endBody:{col:1,line:47}}};const D={title:"General/ContextMenu",component:f.x,decorators:[a.BU],parameters:{docs:{page:m},controls:{exclude:["renderMenuItems","renderHeader","onClose","children"]}},args:{x:200,y:300,focusOnOpen:!0,renderMenuItems:b}},M=()=>n.createElement("h6",null,"Menu"),I=K=>n.createElement(f.x,p(u({},K),{onClose:()=>(0,t.action)("onClose")("closed menu"),renderHeader:M})),T=K=>n.createElement(c.z,u({},K),({openMenu:F})=>n.createElement(l.h,{name:"info-circle",onClick:F}));var j=D;I.parameters=u({storySource:{source:`(args: ContextMenuProps) => {
  return <ContextMenu {...args} onClose={() => action('onClose')('closed menu')} renderHeader={renderHeader} />;
}`}},I.parameters),T.parameters=u({storySource:{source:`(args: WithContextMenuProps) => {
  return (
    <WithContextMenu {...args}>
      {({ openMenu }) => <IconButton name="info-circle" onClick={openMenu} />}
    </WithContextMenu>
  );
}`}},T.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ContextMenu/ContextMenu.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ContextMenu/ContextMenu.story.tsx#ComponentMeta"})}catch(K){}},"./src/components/DataSourceSettings/DataSourceHttpSettings.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return kn},default:function(){return Gn}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),f=e("../grafana-e2e-selectors/src/selectors/index.ts"),x=e("./src/themes/ThemeContext.tsx"),d=e("../../../yarn/cache/classnames-npm-2.3.2-d2fdae468d-2c62199789.zip/node_modules/classnames/index.js"),i=e.n(d),c=e("./src/components/Icon/Icon.tsx"),E=e("./src/components/Tooltip/Tooltip.tsx"),O=Object.defineProperty,m=Object.defineProperties,w=Object.getOwnPropertyDescriptors,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(Ae,De,Fe)=>De in Ae?O(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,v=(Ae,De)=>{for(var Fe in De||(De={}))C.call(De,Fe)&&g(Ae,Fe,De[Fe]);if(_)for(var Fe of _(De))b.call(De,Fe)&&g(Ae,Fe,De[Fe]);return Ae},y=(Ae,De)=>m(Ae,w(De)),h=(Ae,De)=>{var Fe={};for(var xt in Ae)C.call(Ae,xt)&&De.indexOf(xt)<0&&(Fe[xt]=Ae[xt]);if(Ae!=null&&_)for(var xt of _(Ae))De.indexOf(xt)<0&&b.call(Ae,xt)&&(Fe[xt]=Ae[xt]);return Fe};const s=Ae=>{var De=Ae,{children:Fe,isFocused:xt,isInvalid:Qt,className:Xt,htmlFor:tn,tooltip:qt,width:cn,interactive:ln}=De,Dn=h(De,["children","isFocused","isInvalid","className","htmlFor","tooltip","width","interactive"]);const zn=i()(Xt,`gf-form-label width-${cn||"10"}`,{"gf-form-label--is-focused":xt,"gf-form-label--is-invalid":Qt});return a.createElement("label",y(v({className:zn},Dn),{htmlFor:tn}),Fe,qt&&a.createElement(E.u,{placement:"top",content:qt,theme:"info",interactive:ln},a.createElement(c.J,{tabIndex:0,name:"info-circle",size:"sm",style:{marginLeft:"10px"}})))},o=s;try{s.displayName="FormLabel",s.__docgenInfo={description:"",displayName:"FormLabel",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},htmlFor:{defaultValue:null,description:"",name:"htmlFor",required:!1,type:{name:"string"}},isFocused:{defaultValue:null,description:"",name:"isFocused",required:!1,type:{name:"boolean"}},isInvalid:{defaultValue:null,description:"",name:"isInvalid",required:!1,type:{name:"boolean"}},tooltip:{defaultValue:null,description:"",name:"tooltip",required:!1,type:{name:"PopoverContent"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:'number | "auto"'}},interactive:{defaultValue:null,description:"Make tooltip interactive",name:"interactive",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FormLabel/FormLabel.tsx#FormLabel"]={docgenInfo:s.__docgenInfo,name:"FormLabel",path:"src/components/FormLabel/FormLabel.tsx#FormLabel"})}catch(Ae){}try{o.displayName="InlineFormLabel",o.__docgenInfo={description:"",displayName:"InlineFormLabel",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},htmlFor:{defaultValue:null,description:"",name:"htmlFor",required:!1,type:{name:"string"}},isFocused:{defaultValue:null,description:"",name:"isFocused",required:!1,type:{name:"boolean"}},isInvalid:{defaultValue:null,description:"",name:"isInvalid",required:!1,type:{name:"boolean"}},tooltip:{defaultValue:null,description:"",name:"tooltip",required:!1,type:{name:"PopoverContent"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:'number | "auto"'}},interactive:{defaultValue:null,description:"Make tooltip interactive",name:"interactive",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FormLabel/FormLabel.tsx#InlineFormLabel"]={docgenInfo:o.__docgenInfo,name:"InlineFormLabel",path:"src/components/FormLabel/FormLabel.tsx#InlineFormLabel"})}catch(Ae){}var r=Object.defineProperty,u=Object.defineProperties,p=Object.getOwnPropertyDescriptors,S=Object.getOwnPropertySymbols,k=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable,M=(Ae,De,Fe)=>De in Ae?r(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,I=(Ae,De)=>{for(var Fe in De||(De={}))k.call(De,Fe)&&M(Ae,Fe,De[Fe]);if(S)for(var Fe of S(De))D.call(De,Fe)&&M(Ae,Fe,De[Fe]);return Ae},T=(Ae,De)=>u(Ae,p(De)),j=(Ae,De)=>{var Fe={};for(var xt in Ae)k.call(Ae,xt)&&De.indexOf(xt)<0&&(Fe[xt]=Ae[xt]);if(Ae!=null&&S)for(var xt of S(Ae))De.indexOf(xt)<0&&D.call(Ae,xt)&&(Fe[xt]=Ae[xt]);return Fe};const K={labelWidth:6,inputWidth:12},F=Ae=>{var De=Ae,{label:Fe,tooltip:xt,labelWidth:Qt,inputWidth:Xt,inputEl:tn,className:qt,interactive:cn}=De,ln=j(De,["label","tooltip","labelWidth","inputWidth","inputEl","className","interactive"]);const Dn=$();return a.createElement("div",{className:(0,l.cx)(Dn.formField,qt)},a.createElement(o,{width:Qt,tooltip:xt,interactive:cn},Fe),tn||a.createElement("input",T(I({type:"text",className:`gf-form-input ${Xt?`width-${Xt}`:""}`},ln),{disabled:ln.disabled})))};F.displayName="FormField",F.defaultProps=K;const $=()=>({formField:l.iv`
      display: flex;
      flex-direction: row;
      align-items: flex-start;
      text-align: left;
      position: relative;
    `});try{F.displayName="FormField",F.__docgenInfo={description:`Default form field including label used in Grafana UI. Default input element is simple <input />. You can also pass
custom inputEl if required in which case inputWidth and inputProps are ignored.`,displayName:"FormField",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"string"}},tooltip:{defaultValue:null,description:"",name:"tooltip",required:!1,type:{name:"PopoverContent"}},labelWidth:{defaultValue:{value:"6"},description:"",name:"labelWidth",required:!1,type:{name:"number"}},inputWidth:{defaultValue:{value:"12"},description:"",name:"inputWidth",required:!1,type:{name:"number | null"}},inputEl:{defaultValue:null,description:"",name:"inputEl",required:!1,type:{name:"ReactNode"}},interactive:{defaultValue:null,description:"Make tooltip interactive",name:"interactive",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FormField/FormField.tsx#FormField"]={docgenInfo:F.__docgenInfo,name:"FormField",path:"src/components/FormField/FormField.tsx#FormField"})}catch(Ae){}var R=e("./src/components/Forms/InlineField.tsx"),U=(Ae=>(Ae.onBlur="onBlur",Ae.onFocus="onFocus",Ae.onChange="onChange",Ae))(U||{});const H=(Ae,De)=>{const Fe=De.reduce((xt,Qt)=>Qt.rule(Ae)?xt:xt.concat(Qt.errorMessage),[]);return Fe.length>0?Fe:null},W=(Ae,De)=>De&&De[Ae],oe=(Ae,De)=>({rule:Fe=>!!Fe.match(Ae),errorMessage:De||"Value is not valid"});var Q=Object.defineProperty,P=Object.defineProperties,ae=Object.getOwnPropertyDescriptors,q=Object.getOwnPropertySymbols,Y=Object.prototype.hasOwnProperty,ve=Object.prototype.propertyIsEnumerable,re=(Ae,De,Fe)=>De in Ae?Q(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,je=(Ae,De)=>{for(var Fe in De||(De={}))Y.call(De,Fe)&&re(Ae,Fe,De[Fe]);if(q)for(var Fe of q(De))ve.call(De,Fe)&&re(Ae,Fe,De[Fe]);return Ae},me=(Ae,De)=>P(Ae,ae(De)),ne=(Ae,De)=>{var Fe={};for(var xt in Ae)Y.call(Ae,xt)&&De.indexOf(xt)<0&&(Fe[xt]=Ae[xt]);if(Ae!=null&&q)for(var xt of q(Ae))De.indexOf(xt)<0&&ve.call(Ae,xt)&&(Fe[xt]=Ae[xt]);return Fe},Z=(Ae,De,Fe)=>new Promise((xt,Qt)=>{var Xt=cn=>{try{qt(Fe.next(cn))}catch(ln){Qt(ln)}},tn=cn=>{try{qt(Fe.throw(cn))}catch(ln){Qt(ln)}},qt=cn=>cn.done?xt(cn.value):Promise.resolve(cn.value).then(Xt,tn);qt((Fe=Fe.apply(Ae,De)).next())}),te=(Ae=>(Ae.Invalid="invalid",Ae.Valid="valid",Ae))(te||{});class Pe extends a.PureComponent{constructor(){super(...arguments),this.state={error:null},this.validatorAsync=De=>Fe=>{const xt=H(Fe.target.value,De);this.setState(Qt=>me(je({},Qt),{error:xt?xt[0]:null}))},this.populateEventPropsWithStatus=(De,Fe)=>{const xt=je({},De);return Fe&&Object.keys(U).forEach(Qt=>{(W(Qt,Fe)||De[Qt])&&(xt[Qt]=Xt=>Z(this,null,function*(){Xt.persist(),W(Qt,Fe)&&(yield this.validatorAsync(Fe[Qt]).apply(this,[Xt])),De[Qt]&&De[Qt].apply(null,[Xt,this.status])}))}),xt}}get status(){return this.state.error?"invalid":"valid"}get isInvalid(){return this.status==="invalid"}render(){const De=this.props,{validationEvents:Fe,className:xt,hideErrorMessage:Qt,inputRef:Xt}=De,tn=ne(De,["validationEvents","className","hideErrorMessage","inputRef"]),{error:qt}=this.state,cn=i()("gf-form-input",{invalid:this.isInvalid},xt),ln=this.populateEventPropsWithStatus(tn,Fe);return a.createElement("div",{style:{flexGrow:1}},a.createElement("input",me(je({},ln),{ref:Xt,className:cn})),qt&&!Qt&&a.createElement("span",null,qt))}}Pe.defaultProps={className:""};try{Pe.displayName="Input",Pe.__docgenInfo={description:"",displayName:"Input",props:{validationEvents:{defaultValue:null,description:"",name:"validationEvents",required:!1,type:{name:"ValidationEvents"}},hideErrorMessage:{defaultValue:null,description:"",name:"hideErrorMessage",required:!1,type:{name:"boolean"}},inputRef:{defaultValue:null,description:"",name:"inputRef",required:!1,type:{name:"LegacyRef<HTMLInputElement>"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"((event: FocusEvent<HTMLInputElement, Element>, status?: LegacyInputStatus) => void)"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"((event: FocusEvent<HTMLInputElement, Element>, status?: LegacyInputStatus) => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((event: ChangeEvent<HTMLInputElement>, status?: LegacyInputStatus) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Legacy/Input/Input.tsx#Input"]={docgenInfo:Pe.__docgenInfo,name:"Input",path:"src/components/Forms/Legacy/Input/Input.tsx#Input"})}catch(Ae){}var he=e("./src/components/Select/Select.tsx"),ie=e("./src/components/Switch/Switch.tsx"),Ce=e("./src/components/TagsInput/TagsInput.tsx"),Le=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),we=e("./src/components/Button/Button.tsx"),ue=Object.defineProperty,Ie=Object.getOwnPropertySymbols,qe=Object.prototype.hasOwnProperty,Je=Object.prototype.propertyIsEnumerable,Ze=(Ae,De,Fe)=>De in Ae?ue(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,Oe=(Ae,De)=>{for(var Fe in De||(De={}))qe.call(De,Fe)&&Ze(Ae,Fe,De[Fe]);if(Ie)for(var Fe of Ie(De))Je.call(De,Fe)&&Ze(Ae,Fe,De[Fe]);return Ae},ce=(Ae,De)=>{var Fe={};for(var xt in Ae)qe.call(Ae,xt)&&De.indexOf(xt)<0&&(Fe[xt]=Ae[xt]);if(Ae!=null&&Ie)for(var xt of Ie(Ae))De.indexOf(xt)<0&&Je.call(Ae,xt)&&(Fe[xt]=Ae[xt]);return Fe};const pe=()=>({noRadiusInput:l.iv`
      border-bottom-right-radius: 0 !important;
      border-top-right-radius: 0 !important;
    `,noRadiusButton:l.iv`
      border-bottom-left-radius: 0 !important;
      border-top-left-radius: 0 !important;
    `}),J=Ae=>{var De=Ae,{label:Fe="Password",labelWidth:xt,inputWidth:Qt=12,onReset:Xt,isConfigured:tn,tooltip:qt,placeholder:cn="Password",interactive:ln}=De,Dn=ce(De,["label","labelWidth","inputWidth","onReset","isConfigured","tooltip","placeholder","interactive"]);const zn=pe();return a.createElement(F,{label:Fe,tooltip:qt,interactive:ln,labelWidth:xt,inputEl:tn?a.createElement(a.Fragment,null,a.createElement("input",Oe({type:"text",className:(0,l.cx)(`gf-form-input width-${Qt}`,zn.noRadiusInput),disabled:!0,value:"configured"},(0,Le.omit)(Dn,"value"))),a.createElement(we.zx,{onClick:Xt,variant:"secondary",type:"button"},"Reset")):a.createElement("input",Oe({type:"password",className:`gf-form-input width-${Qt}`,placeholder:cn},Dn))})};J.displayName="SecretFormField";try{J.displayName="SecretFormField",J.__docgenInfo={description:`Form field that has 2 states configured and not configured. If configured it will not show its contents and adds
a reset button that will clear the input and makes it accessible. In non configured state it behaves like normal
form field. This is used for passwords or anything that is encrypted on the server and is later returned encrypted
to the user (like datasource passwords).`,displayName:"SecretFormField",props:{onReset:{defaultValue:null,description:"",name:"onReset",required:!0,type:{name:"(event: SyntheticEvent<HTMLButtonElement, Event>) => void"}},isConfigured:{defaultValue:null,description:"",name:"isConfigured",required:!0,type:{name:"boolean"}},label:{defaultValue:{value:"Password"},description:"",name:"label",required:!1,type:{name:"string"}},tooltip:{defaultValue:null,description:"",name:"tooltip",required:!1,type:{name:"PopoverContent"}},labelWidth:{defaultValue:null,description:"",name:"labelWidth",required:!1,type:{name:"number"}},inputWidth:{defaultValue:{value:"12"},description:"",name:"inputWidth",required:!1,type:{name:"number"}},placeholder:{defaultValue:{value:"Password"},description:"",name:"placeholder",required:!1,type:{name:"string"}},interactive:{defaultValue:null,description:"",name:"interactive",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/SecretFormField/SecretFormField.tsx#SecretFormField"]={docgenInfo:J.__docgenInfo,name:"SecretFormField",path:"src/components/SecretFormField/SecretFormField.tsx#SecretFormField"})}catch(Ae){}var L=Object.defineProperty,fe=Object.defineProperties,xe=Object.getOwnPropertyDescriptors,We=Object.getOwnPropertySymbols,Ue=Object.prototype.hasOwnProperty,at=Object.prototype.propertyIsEnumerable,it=(Ae,De,Fe)=>De in Ae?L(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,_t=(Ae,De)=>{for(var Fe in De||(De={}))Ue.call(De,Fe)&&it(Ae,Fe,De[Fe]);if(We)for(var Fe of We(De))at.call(De,Fe)&&it(Ae,Fe,De[Fe]);return Ae},wt=(Ae,De)=>fe(Ae,xe(De));const ee=({dataSourceConfig:Ae,onChange:De})=>{const Fe=Ae.secureJsonData?Ae.secureJsonData.basicAuthPassword:"",xt=()=>{De(wt(_t({},Ae),{secureJsonData:wt(_t({},Ae.secureJsonData),{basicAuthPassword:""}),secureJsonFields:wt(_t({},Ae.secureJsonFields),{basicAuthPassword:!1})}))},Qt=Xt=>{De(wt(_t({},Ae),{secureJsonData:wt(_t({},Ae.secureJsonData),{basicAuthPassword:Xt.currentTarget.value})}))};return a.createElement(a.Fragment,null,a.createElement(R._,{disabled:Ae.readOnly},a.createElement(F,{label:"User",labelWidth:10,inputWidth:18,placeholder:"user",value:Ae.basicAuthUser,onChange:Xt=>De(wt(_t({},Ae),{basicAuthUser:Xt.currentTarget.value}))})),a.createElement(R._,{disabled:Ae.readOnly},a.createElement(J,{isConfigured:!!(Ae.secureJsonFields&&Ae.secureJsonFields.basicAuthPassword),value:Fe||"",inputWidth:18,labelWidth:10,onReset:xt,onChange:Qt})))};try{ee.displayName="BasicAuthSettings",ee.__docgenInfo={description:"",displayName:"BasicAuthSettings",props:{defaultUrl:{defaultValue:null,description:"The default url for the data source",name:"defaultUrl",required:!0,type:{name:"string"}},showAccessOptions:{defaultValue:null,description:"Show the http access help box",name:"showAccessOptions",required:!1,type:{name:"boolean"}},sigV4AuthToggleEnabled:{defaultValue:null,description:"Show the SigV4 auth toggle option",name:"sigV4AuthToggleEnabled",required:!1,type:{name:"boolean"}},azureAuthSettings:{defaultValue:null,description:"Azure authentication settings *",name:"azureAuthSettings",required:!1,type:{name:"AzureAuthSettings"}},renderSigV4Editor:{defaultValue:null,description:"If SIGV4 is enabled, provide an editor for SIGV4 connection config  *",name:"renderSigV4Editor",required:!1,type:{name:"ReactNode"}},dataSourceConfig:{defaultValue:null,description:"The configuration object of the data source",name:"dataSourceConfig",required:!0,type:{name:"DataSourceSettings<any, any>"}},onChange:{defaultValue:null,description:"Callback for handling changes to the configuration object",name:"onChange",required:!0,type:{name:"(config: DataSourceSettings<any, any>) => void"}},showForwardOAuthIdentityOption:{defaultValue:null,description:"Show the Forward OAuth identity option",name:"showForwardOAuthIdentityOption",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DataSourceSettings/BasicAuthSettings.tsx#BasicAuthSettings"]={docgenInfo:ee.__docgenInfo,name:"BasicAuthSettings",path:"src/components/DataSourceSettings/BasicAuthSettings.tsx#BasicAuthSettings"})}catch(Ae){}var _e=e("./src/themes/stylesFactory.ts"),ge=Object.defineProperty,de=Object.defineProperties,Ee=Object.getOwnPropertyDescriptors,ze=Object.getOwnPropertySymbols,le=Object.prototype.hasOwnProperty,ye=Object.prototype.propertyIsEnumerable,Se=(Ae,De,Fe)=>De in Ae?ge(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,Be=(Ae,De)=>{for(var Fe in De||(De={}))le.call(De,Fe)&&Se(Ae,Fe,De[Fe]);if(ze)for(var Fe of ze(De))ye.call(De,Fe)&&Se(Ae,Fe,De[Fe]);return Ae},Xe=(Ae,De)=>de(Ae,Ee(De));const st=(0,_e.B)(()=>({layout:l.iv`
      display: flex;
      align-items: center;
      margin-bottom: 4px;
      > * {
        margin-left: 4px;
        margin-bottom: 0;
        height: 100%;
        &:first-child,
        &:last-child {
          margin-left: 0;
        }
      }
    `})),mt=({header:Ae,onBlur:De,onChange:Fe,onRemove:xt,onReset:Qt})=>{const Xt=st();return a.createElement("div",{className:Xt.layout},a.createElement(F,{label:"Header",name:"name",placeholder:"X-Custom-Header",labelWidth:5,value:Ae.name||"",onChange:tn=>Fe(Xe(Be({},Ae),{name:tn.target.value})),onBlur:De}),a.createElement(J,{label:"Value","aria-label":"Value",name:"value",isConfigured:Ae.configured,value:Ae.value,labelWidth:5,inputWidth:Ae.configured?11:12,placeholder:"Header Value",onReset:()=>Qt(Ae.id),onChange:tn=>Fe(Xe(Be({},Ae),{value:tn.target.value})),onBlur:De}),a.createElement(we.zx,{type:"button","aria-label":"Remove header",variant:"secondary",size:"xs",onClick:tn=>xt(Ae.id)},a.createElement(c.J,{name:"trash-alt"})))};mt.displayName="CustomHeaderRow";class rt extends a.PureComponent{constructor(De){super(De),this.state={headers:[]},this.updateSettings=()=>{const{headers:Xt}=this.state,tn=Object.fromEntries(Object.entries(this.props.dataSourceConfig.jsonData).filter(([cn,ln])=>!cn.startsWith("httpHeaderName"))),qt=Object.fromEntries(Object.entries(this.props.dataSourceConfig.secureJsonData||{}).filter(([cn,ln])=>!cn.startsWith("httpHeaderValue")));for(const[cn,ln]of Xt.entries())tn[`httpHeaderName${cn+1}`]=ln.name,ln.configured||(qt[`httpHeaderValue${cn+1}`]=ln.value);this.props.onChange(Xe(Be({},this.props.dataSourceConfig),{jsonData:tn,secureJsonData:qt}))},this.onHeaderAdd=()=>{this.setState(Xt=>({headers:[...Xt.headers,{id:(0,Le.uniqueId)(),name:"",value:"",configured:!1}]}))},this.onHeaderChange=(Xt,tn)=>{this.setState(({headers:qt})=>({headers:qt.map((cn,ln)=>Xt!==ln?cn:Be({},tn))}))},this.onHeaderReset=Xt=>{this.setState(({headers:tn})=>({headers:tn.map((qt,cn)=>qt.id!==Xt?qt:Xe(Be({},qt),{value:"",configured:!1}))}))},this.onHeaderRemove=Xt=>{this.setState(({headers:tn})=>({headers:tn.filter(qt=>qt.id!==Xt)}),this.updateSettings)};const{jsonData:Fe,secureJsonData:xt,secureJsonFields:Qt}=this.props.dataSourceConfig;this.state={headers:Object.keys(Fe).sort().filter(Xt=>Xt.startsWith("httpHeaderName")).map((Xt,tn)=>({id:(0,Le.uniqueId)(),name:Fe[Xt],value:xt!==void 0?xt[Xt]:"",configured:Qt&&Qt[`httpHeaderValue${tn+1}`]||!1}))}}render(){const{headers:De}=this.state,{dataSourceConfig:Fe}=this.props;return a.createElement("div",{className:"gf-form-group"},a.createElement("div",{className:"gf-form"},a.createElement("h6",null,"Custom HTTP Headers")),a.createElement("div",null,De.map((xt,Qt)=>a.createElement(mt,{key:xt.id,header:xt,onChange:Xt=>{this.onHeaderChange(Qt,Xt)},onBlur:this.updateSettings,onRemove:this.onHeaderRemove,onReset:this.onHeaderReset}))),!Fe.readOnly&&a.createElement("div",{className:"gf-form"},a.createElement(we.zx,{variant:"secondary",icon:"plus",type:"button",onClick:xt=>{this.onHeaderAdd()}},"Add header")))}}var lt=null;try{mt.displayName="CustomHeaderRow",mt.__docgenInfo={description:"",displayName:"CustomHeaderRow",props:{dataSourceConfig:{defaultValue:null,description:"",name:"dataSourceConfig",required:!0,type:{name:"DataSourceSettings<any, any>"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(config: DataSourceSettings<DataSourceJsonData, {}>) => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DataSourceSettings/CustomHeadersSettings.tsx#CustomHeaderRow"]={docgenInfo:mt.__docgenInfo,name:"CustomHeaderRow",path:"src/components/DataSourceSettings/CustomHeadersSettings.tsx#CustomHeaderRow"})}catch(Ae){}var ft=Object.defineProperty,St=Object.defineProperties,gt=Object.getOwnPropertyDescriptors,pt=Object.getOwnPropertySymbols,ut=Object.prototype.hasOwnProperty,Ot=Object.prototype.propertyIsEnumerable,Wt=(Ae,De,Fe)=>De in Ae?ft(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,Ht=(Ae,De)=>{for(var Fe in De||(De={}))ut.call(De,Fe)&&Wt(Ae,Fe,De[Fe]);if(pt)for(var Fe of pt(De))Ot.call(De,Fe)&&Wt(Ae,Fe,De[Fe]);return Ae},on=(Ae,De)=>St(Ae,gt(De));const un=26,mn=({dataSourceConfig:Ae,onChange:De,showForwardOAuthIdentityOption:Fe=!0})=>a.createElement(a.Fragment,null,a.createElement("div",{className:"gf-form-inline"},a.createElement(R._,{label:"TLS Client Auth",labelWidth:un,disabled:Ae.readOnly},a.createElement(ie.x,{id:"http-settings-tls-client-auth",value:Ae.jsonData.tlsAuth||!1,onChange:xt=>De(on(Ht({},Ae.jsonData),{tlsAuth:xt.currentTarget.checked}))})),a.createElement(R._,{label:"With CA Cert",tooltip:"Needed for verifying self-signed TLS Certs",labelWidth:un,disabled:Ae.readOnly},a.createElement(ie.x,{id:"http-settings-ca-cert",value:Ae.jsonData.tlsAuthWithCACert||!1,onChange:xt=>De(on(Ht({},Ae.jsonData),{tlsAuthWithCACert:xt.currentTarget.checked}))}))),a.createElement("div",{className:"gf-form-inline"},a.createElement(R._,{label:"Skip TLS Verify",labelWidth:un,disabled:Ae.readOnly},a.createElement(ie.x,{id:"http-settings-skip-tls-verify",value:Ae.jsonData.tlsSkipVerify||!1,onChange:xt=>De(on(Ht({},Ae.jsonData),{tlsSkipVerify:xt.currentTarget.checked}))}))),Fe&&a.createElement("div",{className:"gf-form-inline"},a.createElement(R._,{label:"Forward OAuth Identity",tooltip:"Forward the user's upstream OAuth identity to the data source (Their access token gets passed along).",labelWidth:un,disabled:Ae.readOnly},a.createElement(ie.x,{id:"http-settings-forward-oauth",value:Ae.jsonData.oauthPassThru||!1,onChange:xt=>De(on(Ht({},Ae.jsonData),{oauthPassThru:xt.currentTarget.checked}))}))));try{mn.displayName="HttpProxySettings",mn.__docgenInfo={description:"",displayName:"HttpProxySettings",props:{dataSourceConfig:{defaultValue:null,description:"The configuration object of the data source",name:"dataSourceConfig",required:!0,type:{name:"DataSourceSettings<any, any>"}},onChange:{defaultValue:null,description:"Callback for handling changes to the configuration object",name:"onChange",required:!0,type:{name:"(config: DataSourceSettings<any, any>) => void"}},showForwardOAuthIdentityOption:{defaultValue:{value:"true"},description:"Show the Forward OAuth identity option",name:"showForwardOAuthIdentityOption",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DataSourceSettings/HttpProxySettings.tsx#HttpProxySettings"]={docgenInfo:mn.__docgenInfo,name:"HttpProxySettings",path:"src/components/DataSourceSettings/HttpProxySettings.tsx#HttpProxySettings"})}catch(Ae){}var wn=e("./src/components/Forms/InlineFieldRow.tsx"),Gt=e("./src/components/Input/Input.tsx"),hn=e("./src/components/TextArea/TextArea.tsx");const fn=({hasCert:Ae,label:De,onChange:Fe,onClick:xt,placeholder:Qt})=>a.createElement(wn.Z,null,a.createElement(R._,{label:De,labelWidth:14,disabled:Ae},Ae?a.createElement(Gt.I,{type:"text",value:"configured",width:24}):a.createElement(hn.K,{rows:7,onChange:Fe,placeholder:Qt,required:!0})),Ae&&a.createElement(we.zx,{variant:"secondary",onClick:xt,style:{marginLeft:4}},"Reset"));try{fn.displayName="CertificationKey",fn.__docgenInfo={description:"",displayName:"CertificationKey",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"string"}},hasCert:{defaultValue:null,description:"",name:"hasCert",required:!0,type:{name:"boolean"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(event: ChangeEvent<HTMLTextAreaElement>) => void"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!0,type:{name:"(event: MouseEvent<HTMLButtonElement, MouseEvent>) => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DataSourceSettings/CertificationKey.tsx#CertificationKey"]={docgenInfo:fn.__docgenInfo,name:"CertificationKey",path:"src/components/DataSourceSettings/CertificationKey.tsx#CertificationKey"})}catch(Ae){}var Hn=Object.defineProperty,va=Object.defineProperties,ia=Object.getOwnPropertyDescriptors,ba=Object.getOwnPropertySymbols,ta=Object.prototype.hasOwnProperty,na=Object.prototype.propertyIsEnumerable,la=(Ae,De,Fe)=>De in Ae?Hn(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,$e=(Ae,De)=>{for(var Fe in De||(De={}))ta.call(De,Fe)&&la(Ae,Fe,De[Fe]);if(ba)for(var Fe of ba(De))na.call(De,Fe)&&la(Ae,Fe,De[Fe]);return Ae},He=(Ae,De)=>va(Ae,ia(De));const Ye=({dataSourceConfig:Ae,onChange:De})=>{const Fe=Ae.secureJsonFields&&Ae.secureJsonFields.tlsCACert,xt=Ae.secureJsonFields&&Ae.secureJsonFields.tlsClientCert,Qt=Ae.secureJsonFields&&Ae.secureJsonFields.tlsClientKey,Xt=Ae.jsonData&&Ae.jsonData.serverName,tn=ln=>Dn=>{Dn.preventDefault();const zn=$e({},Ae.secureJsonFields);zn[ln]=!1,De(He($e({},Ae),{secureJsonFields:zn}))},qt=ln=>Dn=>{const zn=$e({},Ae.secureJsonData);zn[ln]=Dn.currentTarget.value,De(He($e({},Ae),{secureJsonData:zn}))},cn=ln=>{const Dn=He($e({},Ae.jsonData),{serverName:ln.currentTarget.value});De(He($e({},Ae),{jsonData:Dn}))};return a.createElement("div",{className:"gf-form-group"},a.createElement("div",{className:(0,l.cx)("gf-form",l.iv`
            align-items: baseline;
          `)},a.createElement("h6",null,"TLS/SSL Auth Details"),a.createElement(E.u,{placement:"right-end",content:"TLS/SSL Certs are encrypted and stored in the Grafana database.",theme:"info"},a.createElement("div",{className:"gf-form-help-icon gf-form-help-icon--right-normal"},a.createElement(c.J,{name:"info-circle",size:"xs",style:{marginLeft:"10px"}})))),a.createElement("div",null,Ae.jsonData.tlsAuthWithCACert&&a.createElement(fn,{hasCert:!!Fe,onChange:qt("tlsCACert"),placeholder:"Begins with -----BEGIN CERTIFICATE-----",label:"CA Cert",onClick:tn("tlsCACert")}),Ae.jsonData.tlsAuth&&a.createElement(a.Fragment,null,a.createElement("div",{className:"gf-form"},a.createElement(F,{label:"ServerName",labelWidth:7,inputWidth:30,placeholder:"domain.example.com",value:Xt&&Ae.jsonData.serverName,onChange:cn})),a.createElement(fn,{hasCert:!!xt,label:"Client Cert",onChange:qt("tlsClientCert"),placeholder:"Begins with -----BEGIN CERTIFICATE-----",onClick:tn("tlsClientCert")}),a.createElement(fn,{hasCert:!!Qt,label:"Client Key",placeholder:"Begins with -----BEGIN RSA PRIVATE KEY-----",onChange:qt("tlsClientKey"),onClick:tn("tlsClientKey")}))))};try{Ye.displayName="TLSAuthSettings",Ye.__docgenInfo={description:"",displayName:"TLSAuthSettings",props:{dataSourceConfig:{defaultValue:null,description:"The configuration object of the data source",name:"dataSourceConfig",required:!0,type:{name:"DataSourceSettings<any, any>"}},onChange:{defaultValue:null,description:"Callback for handling changes to the configuration object",name:"onChange",required:!0,type:{name:"(config: DataSourceSettings<any, any>) => void"}},showForwardOAuthIdentityOption:{defaultValue:null,description:"Show the Forward OAuth identity option",name:"showForwardOAuthIdentityOption",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DataSourceSettings/TLSAuthSettings.tsx#TLSAuthSettings"]={docgenInfo:Ye.__docgenInfo,name:"TLSAuthSettings",path:"src/components/DataSourceSettings/TLSAuthSettings.tsx#TLSAuthSettings"})}catch(Ae){}var yt=Object.defineProperty,bt=Object.defineProperties,It=Object.getOwnPropertyDescriptors,Lt=Object.getOwnPropertySymbols,zt=Object.prototype.hasOwnProperty,Vt=Object.prototype.propertyIsEnumerable,Ut=(Ae,De,Fe)=>De in Ae?yt(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,Kt=(Ae,De)=>{for(var Fe in De||(De={}))zt.call(De,Fe)&&Ut(Ae,Fe,De[Fe]);if(Lt)for(var Fe of Lt(De))Vt.call(De,Fe)&&Ut(Ae,Fe,De[Fe]);return Ae},xn=(Ae,De)=>bt(Ae,It(De));const rn=[{label:"Server (default)",value:"proxy"},{label:"Browser",value:"direct"}],Bn={label:"Server (default)",value:"proxy"},_n=()=>a.createElement("div",{className:"grafana-info-box m-t-2"},a.createElement("p",null,"Access mode controls how requests to the data source will be handled.",a.createElement("strong",null,"\xA0",a.createElement("i",null,"Server"))," ","should be the preferred way if nothing else is stated."),a.createElement("div",{className:"alert-title"},"Server access mode (Default):"),a.createElement("p",null,"All requests will be made from the browser to Grafana backend/server which in turn will forward the requests to the data source and by that circumvent possible Cross-Origin Resource Sharing (CORS) requirements. The URL needs to be accessible from the grafana backend/server if you select this access mode."),a.createElement("div",{className:"alert-title"},"Browser access mode:"),a.createElement("p",null,"All requests will be made from the browser directly to the data source and may be subject to Cross-Origin Resource Sharing (CORS) requirements. The URL needs to be accessible from the browser if you select this access mode.")),Fn=26,An=Ae=>{const{defaultUrl:De,dataSourceConfig:Fe,onChange:xt,showAccessOptions:Qt,sigV4AuthToggleEnabled:Xt,showForwardOAuthIdentityOption:tn,azureAuthSettings:qt,renderSigV4Editor:cn}=Ae;let ln;const[Dn,zn]=(0,a.useState)(!1),Za=(0,x.l4)(),Nn=(0,a.useCallback)(vn=>{xt(Kt(Kt({},Fe),vn))},[Fe,xt]);switch(Fe.access){case"direct":ln=a.createElement(a.Fragment,null,"Your access method is ",a.createElement("em",null,"Browser"),", this means the URL needs to be accessible from the browser.");break;case"proxy":ln=a.createElement(a.Fragment,null,"Your access method is ",a.createElement("em",null,"Server"),", this means the URL needs to be accessible from the grafana backend/server.");break;default:ln="Specify a complete HTTP URL (for example http://your_server:8080)"}const Ga=a.createElement(he.Ph,{"aria-label":"Access",className:"width-20 gf-form-input",options:rn,value:rn.filter(vn=>vn.value===Fe.access)[0]||Bn,onChange:vn=>Nn({access:vn.value}),disabled:Fe.readOnly}),Pa=/^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/.test(Fe.url),fa=l.iv`
    box-shadow: inset 0 0px 5px ${Za.v1.palette.red};
  `,Ya=(0,l.cx)({["width-20"]:!0,[fa]:!Pa}),ja=a.createElement(Pe,{className:Ya,placeholder:De,value:Fe.url,"aria-label":f.wl.components.DataSource.DataSourceHttpSettings.urlInput,onChange:vn=>Nn({url:vn.currentTarget.value}),disabled:Fe.readOnly}),Da=(qt==null?void 0:qt.azureAuthSupported)&&qt.getAzureAuthEnabled(Fe)||!1;return a.createElement("div",{className:"gf-form-group"},a.createElement(a.Fragment,null,a.createElement("h3",{className:"page-heading"},"HTTP"),a.createElement("div",{className:"gf-form-group"},a.createElement("div",{className:"gf-form"},a.createElement(F,{label:"URL",labelWidth:13,tooltip:ln,inputEl:ja})),Qt&&a.createElement(a.Fragment,null,a.createElement("div",{className:"gf-form-inline"},a.createElement("div",{className:"gf-form"},a.createElement(F,{label:"Access",labelWidth:13,inputWidth:20,inputEl:Ga})),a.createElement("div",{className:"gf-form"},a.createElement("button",{type:"button",className:"gf-form-label query-keyword pointer",onClick:()=>zn(vn=>!vn)},"Help\xA0",a.createElement(c.J,{name:Dn?"angle-down":"angle-right",style:{marginBottom:0}})))),Dn&&a.createElement(_n,null)),Fe.access==="proxy"&&a.createElement("div",{className:"gf-form-group"},a.createElement("div",{className:"gf-form"},a.createElement(o,{width:13,tooltip:"Grafana proxy deletes forwarded cookies by default. Specify cookies by name that should be forwarded to the data source."},"Allowed cookies"),a.createElement(Ce.B,{tags:Fe.jsonData.keepCookies,width:40,onChange:vn=>Nn({jsonData:xn(Kt({},Fe.jsonData),{keepCookies:vn})}),disabled:Fe.readOnly})),a.createElement("div",{className:"gf-form"},a.createElement(F,{label:"Timeout",type:"number",labelWidth:13,inputWidth:20,tooltip:"HTTP request timeout in seconds",placeholder:"Timeout in seconds","aria-label":"Timeout in seconds",value:Fe.jsonData.timeout,onChange:vn=>{Nn({jsonData:xn(Kt({},Fe.jsonData),{timeout:parseInt(vn.currentTarget.value,10)})})},disabled:Fe.readOnly}))))),a.createElement(a.Fragment,null,a.createElement("h3",{className:"page-heading"},"Auth"),a.createElement("div",{className:"gf-form-group"},a.createElement("div",{className:"gf-form-inline"},a.createElement(R._,{label:"Basic auth",labelWidth:Fn,disabled:Fe.readOnly},a.createElement(ie.x,{id:"http-settings-basic-auth",value:Fe.basicAuth,onChange:vn=>{Nn({basicAuth:vn.currentTarget.checked})}})),a.createElement(R._,{label:"With Credentials",tooltip:"Whether credentials such as cookies or auth headers should be sent with cross-site requests.",labelWidth:Fn,disabled:Fe.readOnly},a.createElement(ie.x,{id:"http-settings-with-credentials",value:Fe.withCredentials,onChange:vn=>{Nn({withCredentials:vn.currentTarget.checked})}}))),(qt==null?void 0:qt.azureAuthSupported)&&a.createElement("div",{className:"gf-form-inline"},a.createElement(R._,{label:"Azure Authentication",tooltip:"Use Azure authentication for Azure endpoint.",labelWidth:Fn,disabled:Fe.readOnly},a.createElement(ie.x,{id:"http-settings-azure-auth",value:Da,onChange:vn=>{Nn(qt.setAzureAuthEnabled(Fe,vn.currentTarget.checked))}}))),Xt&&a.createElement("div",{className:"gf-form-inline"},a.createElement(R._,{label:"SigV4 auth",labelWidth:Fn,disabled:Fe.readOnly},a.createElement(ie.x,{id:"http-settings-sigv4-auth",value:Fe.jsonData.sigV4Auth||!1,onChange:vn=>{Nn({jsonData:xn(Kt({},Fe.jsonData),{sigV4Auth:vn.currentTarget.checked})})}}))),Fe.access==="proxy"&&a.createElement(mn,{dataSourceConfig:Fe,onChange:vn=>Nn({jsonData:vn}),showForwardOAuthIdentityOption:tn})),Fe.basicAuth&&a.createElement(a.Fragment,null,a.createElement("h6",null,"Basic Auth Details"),a.createElement("div",{className:"gf-form-group"},a.createElement(ee,Kt({},Ae)))),(qt==null?void 0:qt.azureAuthSupported)&&Da&&qt.azureSettingsUI&&a.createElement(qt.azureSettingsUI,{dataSourceConfig:Fe,onChange:xt}),Fe.jsonData.sigV4Auth&&Xt&&cn,(Fe.jsonData.tlsAuth||Fe.jsonData.tlsAuthWithCACert)&&a.createElement(Ye,{dataSourceConfig:Fe,onChange:xt}),Fe.access==="proxy"&&a.createElement(rt,{dataSourceConfig:Fe,onChange:xt})))};try{An.displayName="DataSourceHttpSettings",An.__docgenInfo={description:"",displayName:"DataSourceHttpSettings",props:{defaultUrl:{defaultValue:null,description:"The default url for the data source",name:"defaultUrl",required:!0,type:{name:"string"}},showAccessOptions:{defaultValue:null,description:"Show the http access help box",name:"showAccessOptions",required:!1,type:{name:"boolean"}},sigV4AuthToggleEnabled:{defaultValue:null,description:"Show the SigV4 auth toggle option",name:"sigV4AuthToggleEnabled",required:!1,type:{name:"boolean"}},azureAuthSettings:{defaultValue:null,description:"Azure authentication settings *",name:"azureAuthSettings",required:!1,type:{name:"AzureAuthSettings"}},renderSigV4Editor:{defaultValue:null,description:"If SIGV4 is enabled, provide an editor for SIGV4 connection config  *",name:"renderSigV4Editor",required:!1,type:{name:"ReactNode"}},dataSourceConfig:{defaultValue:null,description:"The configuration object of the data source",name:"dataSourceConfig",required:!0,type:{name:"DataSourceSettings<any, any>"}},onChange:{defaultValue:null,description:"Callback for handling changes to the configuration object",name:"onChange",required:!0,type:{name:"(config: DataSourceSettings<any, any>) => void"}},showForwardOAuthIdentityOption:{defaultValue:null,description:"Show the Forward OAuth identity option",name:"showForwardOAuthIdentityOption",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DataSourceSettings/DataSourceHttpSettings.tsx#DataSourceHttpSettings"]={docgenInfo:An.__docgenInfo,name:"DataSourceHttpSettings",path:"src/components/DataSourceSettings/DataSourceHttpSettings.tsx#DataSourceHttpSettings"})}catch(Ae){}var Sn=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),ua=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),sn=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function pa(Ae){const De=Object.assign({h1:"h1",p:"p",h3:"h3",code:"code",a:"a",pre:"pre"},(0,ua.ah)(),Ae.components);return(0,Sn.jsxs)(Sn.Fragment,{children:[(0,Sn.jsx)(sn.h_,{title:"MDX|DataSourceHttpSettings",component:An}),`
`,(0,Sn.jsx)(De.h1,{children:"DataSourceHttpSettings"}),`
`,(0,Sn.jsx)(De.p,{children:"Component for displaying the configuration options for a data source plugin."}),`
`,(0,Sn.jsx)(De.h3,{children:"When to use"}),`
`,(0,Sn.jsxs)(De.p,{children:["It is used in a ",(0,Sn.jsx)(De.code,{children:"ConfigEditor"}),` for data source plugins. You can find more examples in our core data source
plugins `,(0,Sn.jsx)(De.a,{href:"https://github.com/grafana/grafana/tree/main/public/app/plugins/datasource",children:"here"}),"."]}),`
`,(0,Sn.jsx)(De.h3,{children:"Example usage"}),`
`,(0,Sn.jsx)(De.pre,{children:(0,Sn.jsx)(De.code,{className:"language-jsx",children:`export const ConfigEditor = (props: Props) => {
  const { options, onOptionsChange } = props;
  return (
    <>
      <DataSourceHttpSettings
        defaultUrl="http://localhost:9090"
        dataSourceConfig={options}
        showAccessOptions={true}
        onChange={onOptionsChange}
        sigV4AuthEnabled={false}
      />

      {/* Additional configuration settings for your data source plugin.*/}
    </>
  );
};
`})}),`
`,(0,Sn.jsx)(sn.xP,{of:An})]})}function sa(Ae={}){const{wrapper:De}=Object.assign({},(0,ua.ah)(),Ae.components);return De?(0,Sn.jsx)(De,Object.assign({},Ae,{children:(0,Sn.jsx)(pa,Ae)})):pa(Ae)}var Rn=sa,gn=Object.defineProperty,ma=Object.defineProperties,Ta=Object.getOwnPropertyDescriptors,ya=Object.getOwnPropertySymbols,ke=Object.prototype.hasOwnProperty,Ne=Object.prototype.propertyIsEnumerable,Ge=(Ae,De,Fe)=>De in Ae?gn(Ae,De,{enumerable:!0,configurable:!0,writable:!0,value:Fe}):Ae[De]=Fe,Et=(Ae,De)=>{for(var Fe in De||(De={}))ke.call(De,Fe)&&Ge(Ae,Fe,De[Fe]);if(ya)for(var Fe of ya(De))Ne.call(De,Fe)&&Ge(Ae,Fe,De[Fe]);return Ae},Jt=(Ae,De)=>ma(Ae,Ta(De)),an=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { DataSourceSettings } from '@grafana/data';

import { DataSourceHttpSettings } from './DataSourceHttpSettings';
import mdx from './DataSourceHttpSettings.mdx';

const settingsMock: DataSourceSettings<any, any> = {
  id: 4,
  orgId: 1,
  uid: 'x',
  name: 'gdev-influxdb',
  type: 'influxdb',
  typeName: 'Influxdb',
  typeLogoUrl: '',
  access: 'direct',
  url: 'http://localhost:8086',
  user: 'grafana',
  database: 'site',
  basicAuth: false,
  basicAuthUser: '',
  withCredentials: false,
  isDefault: false,
  jsonData: {
    timeInterval: '15s',
    httpMode: 'GET',
    keepCookies: ['cookie1', 'cookie2'],
    serverName: '',
  },
  secureJsonData: {
    password: true,
  },
  secureJsonFields: {},
  readOnly: true,
};

const meta: ComponentMeta<typeof DataSourceHttpSettings> = {
  title: 'Data Source/DataSourceHttpSettings',
  component: DataSourceHttpSettings,
  parameters: {
    controls: {
      exclude: ['onChange'],
    },
    docs: {
      page: mdx,
    },
  },
  args: {
    dataSourceConfig: settingsMock,
    defaultUrl: 'http://localhost:9999',
  },
};

export const Basic: ComponentStory<typeof DataSourceHttpSettings> = (args) => {
  const [, updateArgs] = useArgs();
  return (
    <DataSourceHttpSettings
      {...args}
      onChange={(change: typeof settingsMock) => {
        action('onChange')(change);
        updateArgs({ dataSourceConfig: change });
      }}
    />
  );
};

export default meta;
`,Cn={Basic:{startLoc:{col:68,line:57},endLoc:{col:1,line:68},startBody:{col:68,line:57},endBody:{col:1,line:68}}};const Tn={title:"Data Source/DataSourceHttpSettings",component:An,parameters:{controls:{exclude:["onChange"]},docs:{page:Rn}},args:{dataSourceConfig:{id:4,orgId:1,uid:"x",name:"gdev-influxdb",type:"influxdb",typeName:"Influxdb",typeLogoUrl:"",access:"direct",url:"http://localhost:8086",user:"grafana",database:"site",basicAuth:!1,basicAuthUser:"",withCredentials:!1,isDefault:!1,jsonData:{timeInterval:"15s",httpMode:"GET",keepCookies:["cookie1","cookie2"],serverName:""},secureJsonData:{password:!0},secureJsonFields:{},readOnly:!0},defaultUrl:"http://localhost:9999"}},kn=Ae=>{const[,De]=(0,n.D8)();return a.createElement(An,Jt(Et({},Ae),{onChange:Fe=>{(0,t.action)("onChange")(Fe),De({dataSourceConfig:Fe})}}))};var Gn=Tn;kn.parameters=Et({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  return (
    <DataSourceHttpSettings
      {...args}
      onChange={(change: typeof settingsMock) => {
        action('onChange')(change);
        updateArgs({ dataSourceConfig: change });
      }}
    />
  );
}`}},kn.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DataSourceSettings/DataSourceHttpSettings.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DataSourceSettings/DataSourceHttpSettings.story.tsx#ComponentMeta"})}catch(Ae){}},"./src/components/DateTimePickers/DatePicker/DatePicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return r},default:function(){return u}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/Button/Button.tsx"),l=e("./src/components/DateTimePickers/DatePicker/DatePicker.tsx"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),x=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),d=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function i(p){const S=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,x.ah)(),p.components);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(S.h1,{children:"DatePicker"}),`
`,(0,f.jsx)(S.p,{children:"A component with a calendar view for selecting a date."}),`
`,(0,f.jsx)(S.h3,{children:"Usage"}),`
`,(0,f.jsx)(S.pre,{children:(0,f.jsx)(S.code,{className:"language-tsx",children:`import React, { useState } from 'react';
import { DatePicker, Button } from '@grafana/ui';

const [date, setDate] = useState<Date>(new Date());
const [open, setOpen] = useState(false);

return (
  <>
    <Button onClick={() => setOpen(true)}>Show Calendar</Button>
    <DatePicker isOpen={open} value={date} onChange={(newDate) => setDate(newDate)} onClose={() => setOpen(false)} />
  </>
);
`})}),`
`,(0,f.jsx)(S.h3,{children:"Props"}),`
`,(0,f.jsx)(d.$4,{of:l.M})]})}function c(p={}){const{wrapper:S}=Object.assign({},(0,x.ah)(),p.components);return S?(0,f.jsx)(S,Object.assign({},p,{children:(0,f.jsx)(i,p)})):i(p)}var E=c,O=Object.defineProperty,m=Object.defineProperties,w=Object.getOwnPropertyDescriptors,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(p,S,k)=>S in p?O(p,S,{enumerable:!0,configurable:!0,writable:!0,value:k}):p[S]=k,v=(p,S)=>{for(var k in S||(S={}))C.call(S,k)&&g(p,k,S[k]);if(_)for(var k of _(S))b.call(S,k)&&g(p,k,S[k]);return p},y=(p,S)=>m(p,w(S)),h=`import { ComponentMeta } from '@storybook/react';
import React, { useState } from 'react';

import { withCenteredStory } from '../../../utils/storybook/withCenteredStory';
import { Button } from '../../Button/Button';

import { DatePicker, DatePickerProps } from './DatePicker';
import mdx from './DatePicker.mdx';

const meta: ComponentMeta<typeof DatePicker> = {
  title: 'Pickers and Editors/TimePickers/Pickers And Editors/DatePicker',
  component: DatePicker,
  decorators: [withCenteredStory],
  argTypes: {
    minDate: { control: 'date' },
  },
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['onChange', 'onClose', 'value', 'isOpen'],
    },
  },
};

export const Basic = (args: DatePickerProps) => {
  const [date, setDate] = useState<Date>(new Date());
  const [open, setOpen] = useState(false);

  if (args?.minDate !== undefined) {
    args.minDate = new Date(args.minDate);
  }

  args = {
    ...args,
    isOpen: open,
    value: date,
    onChange: (newDate) => setDate(newDate),
    onClose: () => setOpen(false),
  };

  return (
    <>
      <Button onClick={() => setOpen(true)}>Show Calendar</Button>
      <DatePicker {...args} />
    </>
  );
};

export default meta;
`,s={Basic:{startLoc:{col:21,line:27},endLoc:{col:1,line:49},startBody:{col:21,line:27},endBody:{col:1,line:49}}};const o={title:"Pickers and Editors/TimePickers/Pickers And Editors/DatePicker",component:l.M,decorators:[n.BU],argTypes:{minDate:{control:"date"}},parameters:{docs:{page:E},controls:{exclude:["onChange","onClose","value","isOpen"]}}},r=p=>{const[S,k]=(0,t.useState)(new Date),[D,M]=(0,t.useState)(!1);return(p==null?void 0:p.minDate)!==void 0&&(p.minDate=new Date(p.minDate)),p=y(v({},p),{isOpen:D,value:S,onChange:I=>k(I),onClose:()=>M(!1)}),t.createElement(t.Fragment,null,t.createElement(a.zx,{onClick:()=>M(!0)},"Show Calendar"),t.createElement(l.M,v({},p)))};var u=o;r.parameters=v({storySource:{source:`(args: DatePickerProps) => {
  const [date, setDate] = useState<Date>(new Date());
  const [open, setOpen] = useState(false);

  if (args?.minDate !== undefined) {
    args.minDate = new Date(args.minDate);
  }

  args = {
    ...args,
    isOpen: open,
    value: date,
    onChange: (newDate) => setDate(newDate),
    onClose: () => setOpen(false),
  };

  return (
    <>
      <Button onClick={() => setOpen(true)}>Show Calendar</Button>
      <DatePicker {...args} />
    </>
  );
}`}},r.parameters);try{r.displayName="Basic",r.__docgenInfo={description:"",displayName:"Basic",props:{isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!0,type:{name:"() => void"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: Date) => void"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"Date"}},minDate:{defaultValue:null,description:"",name:"minDate",required:!1,type:{name:"Date"}},maxDate:{defaultValue:null,description:"",name:"maxDate",required:!1,type:{name:"Date"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/DatePicker/DatePicker.story.tsx#Basic"]={docgenInfo:r.__docgenInfo,name:"Basic",path:"src/components/DateTimePickers/DatePicker/DatePicker.story.tsx#Basic"})}catch(p){}try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/DatePicker/DatePicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/DatePicker/DatePicker.story.tsx#ComponentMeta"})}catch(p){}},"./src/components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return oe},default:function(){return Q}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/components/Input/Input.tsx"),c=e("./src/components/DateTimePickers/DatePicker/DatePicker.tsx"),E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(P,ae,q)=>ae in P?E(P,ae,{enumerable:!0,configurable:!0,writable:!0,value:q}):P[ae]=q,C=(P,ae)=>{for(var q in ae||(ae={}))m.call(ae,q)&&_(P,q,ae[q]);if(O)for(var q of O(ae))w.call(ae,q)&&_(P,q,ae[q]);return P},b=(P,ae)=>{var q={};for(var Y in P)m.call(P,Y)&&ae.indexOf(Y)<0&&(q[Y]=P[Y]);if(P!=null&&O)for(var Y of O(P))ae.indexOf(Y)<0&&w.call(P,Y)&&(q[Y]=P[Y]);return q};const g=P=>(0,x.CQ)(P).format("L"),v=P=>{var ae=P,{value:q,minDate:Y,maxDate:ve,onChange:re,closeOnSelect:je,placeholder:me="Date"}=ae,ne=b(ae,["value","minDate","maxDate","onChange","closeOnSelect","placeholder"]);const[Z,te]=a.useState(!1),Pe=(0,d.wW)(y);return a.createElement("div",{className:Pe.container},a.createElement(i.I,C({type:"text",autoComplete:"off",placeholder:me,value:q&&g(q),onClick:()=>te(!0),onChange:he=>{he.target.value===""&&re("")},className:Pe.input},ne)),a.createElement(c.M,{isOpen:Z,value:q&&typeof q!="string"?q:(0,x.CQ)().toDate(),minDate:Y,maxDate:ve,onChange:he=>{re(he),je&&te(!1)},onClose:()=>te(!1)}))},y=()=>({container:f.iv`
      position: relative;
    `,input:f.iv`
    /* hides the native Calendar picker icon given when using type=date */
    input[type='date']::-webkit-inner-spin-button,
    input[type='date']::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
    `});try{g.displayName="formatDate",g.__docgenInfo={description:"",displayName:"formatDate",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.tsx#formatDate"]={docgenInfo:g.__docgenInfo,name:"formatDate",path:"src/components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.tsx#formatDate"})}catch(P){}try{v.displayName="DatePickerWithInput",v.__docgenInfo={description:"",displayName:"DatePickerWithInput",props:{value:{defaultValue:null,description:"Value selected by the DatePicker",name:"value",required:!1,type:{name:"string | Date"}},minDate:{defaultValue:null,description:"The minimum date the value can be set to",name:"minDate",required:!1,type:{name:"Date"}},maxDate:{defaultValue:null,description:"The maximum date the value can be set to",name:"maxDate",required:!1,type:{name:"Date"}},onChange:{defaultValue:null,description:"Handles changes when a new date is selected",name:"onChange",required:!0,type:{name:"(value: string | Date) => void"}},closeOnSelect:{defaultValue:null,description:"Hide the calendar when date is selected",name:"closeOnSelect",required:!1,type:{name:"boolean"}},placeholder:{defaultValue:{value:"Date"},description:"Text that appears when the input has no text",name:"placeholder",required:!1,type:{name:"string"}},prefix:{defaultValue:null,description:"Show an icon as a prefix in the input",name:"prefix",required:!1,type:{name:"ReactNode"}},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"}},loading:{defaultValue:null,description:"Show a loading indicator as a suffix in the input",name:"loading",required:!1,type:{name:"boolean"}},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"}},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!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.tsx#DatePickerWithInput"]={docgenInfo:v.__docgenInfo,name:"DatePickerWithInput",path:"src/components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.tsx#DatePickerWithInput"})}catch(P){}var h=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),s=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),o=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function r(P){const ae=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,s.ah)(),P.components);return(0,h.jsxs)(h.Fragment,{children:[(0,h.jsx)(ae.h1,{children:"DatePickerWithInput"}),`
`,(0,h.jsx)(ae.p,{children:"An input with a calendar view, used to select a date."}),`
`,(0,h.jsx)(ae.h3,{children:"Usage"}),`
`,(0,h.jsx)(ae.pre,{children:(0,h.jsx)(ae.code,{className:"language-tsx",children:`import React, { useState } from 'react';
import { DatePickerWithInput } from '@grafana/ui';

const [date, setDate] = useState<Date | string>(new Date());
return <DatePickerWithInput width={40} value={date} onChange={(newDate) => setDate(newDate)} />;
`})}),`
`,(0,h.jsx)(ae.h3,{children:"Props"}),`
`,(0,h.jsx)(o.$4,{of:v})]})}function u(P={}){const{wrapper:ae}=Object.assign({},(0,s.ah)(),P.components);return ae?(0,h.jsx)(ae,Object.assign({},P,{children:(0,h.jsx)(r,P)})):r(P)}var p=u,S=Object.defineProperty,k=Object.defineProperties,D=Object.getOwnPropertyDescriptors,M=Object.getOwnPropertySymbols,I=Object.prototype.hasOwnProperty,T=Object.prototype.propertyIsEnumerable,j=(P,ae,q)=>ae in P?S(P,ae,{enumerable:!0,configurable:!0,writable:!0,value:q}):P[ae]=q,K=(P,ae)=>{for(var q in ae||(ae={}))I.call(ae,q)&&j(P,q,ae[q]);if(M)for(var q of M(ae))T.call(ae,q)&&j(P,q,ae[q]);return P},F=(P,ae)=>k(P,D(ae)),$=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentStory, ComponentMeta } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../../utils/storybook/withCenteredStory';

import { DatePickerWithInput } from './DatePickerWithInput';
import mdx from './DatePickerWithInput.mdx';

const today = new Date();

// minimum date is initially set to 1 month before to allow the user
// to quickly see its effects
const minimumDate = new Date();
minimumDate.setMonth(minimumDate.getMonth() - 1);

const meta: ComponentMeta<typeof DatePickerWithInput> = {
  title: 'Pickers and Editors/TimePickers/DatePickerWithInput',
  component: DatePickerWithInput,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['value', 'onChange', 'prefix', 'suffix', 'width', 'invalid', 'loading', 'addonBefore', 'addonAfter'],
    },
  },
  args: {
    value: today,
    minDate: minimumDate,
    closeOnSelect: true,
    placeholder: 'Date',
  },
  argTypes: {
    minDate: { control: 'date' },
  },
};

export const Basic: ComponentStory<typeof DatePickerWithInput> = (args) => {
  const [, updateArgs] = useArgs();

  // the minDate arg can change from Date object to number, we need to handle this
  // scenario to avoid a crash in the component's story.
  const minDateVal = typeof args.minDate === 'number' ? new Date(args.minDate) : args.minDate;

  return (
    <DatePickerWithInput
      {...args}
      width={40}
      minDate={minDateVal}
      onChange={(newValue) => {
        action('on selected')(newValue);
        updateArgs({ value: newValue });
      }}
    />
  );
};

export default meta;
`,R={Basic:{startLoc:{col:65,line:41},endLoc:{col:1,line:59},startBody:{col:65,line:41},endBody:{col:1,line:59}}};const U=new Date,H=new Date;H.setMonth(H.getMonth()-1);const W={title:"Pickers and Editors/TimePickers/DatePickerWithInput",component:v,decorators:[l.BU],parameters:{docs:{page:p},controls:{exclude:["value","onChange","prefix","suffix","width","invalid","loading","addonBefore","addonAfter"]}},args:{value:U,minDate:H,closeOnSelect:!0,placeholder:"Date"},argTypes:{minDate:{control:"date"}}},oe=P=>{const[,ae]=(0,n.D8)(),q=typeof P.minDate=="number"?new Date(P.minDate):P.minDate;return a.createElement(v,F(K({},P),{width:40,minDate:q,onChange:Y=>{(0,t.action)("on selected")(Y),ae({value:Y})}}))};var Q=W;oe.parameters=K({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();

  // the minDate arg can change from Date object to number, we need to handle this
  // scenario to avoid a crash in the component's story.
  const minDateVal = typeof args.minDate === 'number' ? new Date(args.minDate) : args.minDate;

  return (
    <DatePickerWithInput
      {...args}
      width={40}
      minDate={minDateVal}
      onChange={(newValue) => {
        action('on selected')(newValue);
        updateArgs({ value: newValue });
      }}
    />
  );
}`}},oe.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.story.tsx#ComponentMeta"})}catch(P){}},"./src/components/DateTimePickers/DateTimePicker/DateTimePicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return he},OnlyWorkingHoursEnabled:function(){return Pe},default:function(){return ie}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),x=e("../../.yarn/__virtual__/@react-aria-dialog-virtual-6e50988279/2/yarn/cache/@react-aria-dialog-npm-3.3.1-c100ba6958-ba924f07a7.zip/node_modules/@react-aria/dialog/dist/module.js"),d=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),i=e("../../.yarn/__virtual__/@react-aria-overlays-virtual-34e54d82d1/2/yarn/cache/@react-aria-overlays-npm-3.10.1-f232007f1a-b83ec155d3.zip/node_modules/@react-aria/overlays/dist/module.js"),c=e("../../.yarn/__virtual__/react-calendar-virtual-6c20028e3a/2/yarn/cache/react-calendar-npm-4.0.0-8f03cd673a-a470ea1eab.zip/node_modules/react-calendar/dist/esm/index.js"),E=e("../../.yarn/__virtual__/react-popper-virtual-6baf84772d/2/yarn/cache/react-popper-npm-2.3.0-1045578379-837111c987.zip/node_modules/react-popper/lib/esm/usePopper.js"),O=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useMedia.js"),m=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formatter.ts"),w=e("./src/components/Portal/Portal.tsx"),_=e("./src/components/Button/Button.tsx"),C=e("./src/components/Forms/InlineField.tsx"),b=e("./src/components/Input/Input.tsx"),g=e("./src/components/Icon/Icon.tsx"),v=e("./src/components/Layout/Layout.tsx"),y=e("./src/themes/ThemeContext.tsx"),h=e("./src/components/Modal/getModalStyles.ts"),s=e("./src/components/DateTimePickers/TimeOfDayPicker.tsx"),o=e("./src/components/DateTimePickers/TimeRangePicker/CalendarBody.tsx"),r=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/datemath.ts"),u=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/parser.ts");function p(Ce,Le,we){return(0,a.v9)(Ce)?Ce.isValid():r.fM(Ce)?r.JY(Ce):(0,u.J)(Ce,{roundUp:Le,timeZone:we}).isValid()}var S=Object.defineProperty,k=Object.getOwnPropertySymbols,D=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable,I=(Ce,Le,we)=>Le in Ce?S(Ce,Le,{enumerable:!0,configurable:!0,writable:!0,value:we}):Ce[Le]=we,T=(Ce,Le)=>{for(var we in Le||(Le={}))D.call(Le,we)&&I(Ce,we,Le[we]);if(k)for(var we of k(Le))M.call(Le,we)&&I(Ce,we,Le[we]);return Ce};const j=({date:Ce,maxDate:Le,minDate:we,label:ue,onChange:Ie,disabledHours:qe,disabledMinutes:Je,disabledSeconds:Ze,showSeconds:Oe=!0})=>{const[ce,pe]=(0,n.useState)(!1),J=(0,n.useRef)(null),{overlayProps:L,underlayProps:fe}=(0,i.Ir)({onClose:()=>pe(!1),isDismissable:!0,isOpen:ce,shouldCloseOnInteractOutside:ze=>{const le=document.getElementsByClassName(s.F)[0];return!(le&&le.contains(ze))}},J),{dialogProps:xe}=(0,x.R)({},J),We=(0,y.l4)(),{modalBackdrop:Ue}=(0,h.J)(We),at=(0,O.Z)(`(min-width: ${We.breakpoints.values.lg}px)`),it=(0,y.wW)($),[_t,wt]=(0,n.useState)(),[ee,_e]=(0,n.useState)(),ge=(0,E.D)(_t,ee,{placement:"bottom-start"}),de=(0,n.useCallback)(ze=>{pe(!1),Ie(ze)},[Ie]),Ee=(0,n.useCallback)(ze=>{ze.preventDefault(),pe(!0)},[pe]);return n.createElement("div",{"data-testid":"date-time-picker",style:{position:"relative"}},n.createElement(K,{date:Ce,onChange:Ie,isFullscreen:at,onOpen:Ee,label:ue,ref:wt,showSeconds:Oe}),ce?at?n.createElement(w.h_,null,n.createElement(d.MT,{contain:!0,autoFocus:!0,restoreFocus:!0},n.createElement("div",T(T({ref:J},L),xe),n.createElement(F,{date:Ce,onChange:de,isFullscreen:!0,onClose:()=>pe(!1),maxDate:Le,minDate:we,ref:_e,style:ge.styles.popper,showSeconds:Oe,disabledHours:qe,disabledMinutes:Je,disabledSeconds:Ze})))):n.createElement(w.h_,null,n.createElement("div",T({className:Ue},fe)),n.createElement(d.MT,{contain:!0,autoFocus:!0,restoreFocus:!0},n.createElement("div",T(T({ref:J},L),xe),n.createElement("div",{className:it.modal},n.createElement(F,{date:Ce,maxDate:Le,minDate:we,onChange:de,isFullscreen:!1,onClose:()=>pe(!1),showSeconds:Oe,disabledHours:qe,disabledMinutes:Je,disabledSeconds:Ze}))))):null)},K=n.forwardRef(({date:Ce,label:Le,onChange:we,isFullscreen:ue,onOpen:Ie,showSeconds:qe=!0},Je)=>{const Ze=qe?"YYYY-MM-DD HH:mm:ss":"YYYY-MM-DD HH:mm",[Oe,ce]=(0,n.useState)(()=>({value:Ce?(0,m.dq)(Ce):(0,m.dq)((0,a.CQ)()),invalid:!1}));(0,n.useEffect)(()=>{Ce&&ce({invalid:!p((0,m.dq)(Ce,{format:Ze})),value:(0,a.v9)(Ce)?(0,m.dq)(Ce,{format:Ze}):Ce})},[Ce,Ze]);const pe=(0,n.useCallback)(fe=>{const xe=!p(fe.currentTarget.value);ce({value:fe.currentTarget.value,invalid:xe})},[]),J=(0,n.useCallback)(()=>{(0,a.v9)(Oe.value)&&we((0,a.CQ)(Oe.value))},[Oe.value,we]),L=n.createElement(_.zx,{"aria-label":"Time picker",icon:"calendar-alt",variant:"secondary",onClick:Ie});return n.createElement(C._,{label:Le,invalid:!!(Oe.value&&Oe.invalid),className:f.iv`
          margin-bottom: 0;
        `},n.createElement(b.I,{onChange:pe,addonAfter:L,value:Oe.value,onBlur:J,"data-testid":"date-time-input",placeholder:"Select date/time",ref:Je}))});K.displayName="DateTimeInput";const F=n.forwardRef(({date:Ce,onClose:Le,onChange:we,isFullscreen:ue,maxDate:Ie,minDate:qe,style:Je,showSeconds:Ze=!0,disabledHours:Oe,disabledMinutes:ce,disabledSeconds:pe},J)=>{const L=(0,y.wW)(o.mg),fe=(0,y.wW)($),[xe,We]=(0,n.useState)(()=>Ce&&Ce.isValid()?Ce.toDate():new Date),Ue=(0,n.useCallback)(it=>{Array.isArray(it)||We(_t=>(it.setHours(_t.getHours()),it.setMinutes(_t.getMinutes()),it.setSeconds(_t.getSeconds()),it))},[]),at=(0,n.useCallback)(it=>{We(it.toDate())},[]);return n.createElement("div",{className:(0,f.cx)(fe.container,{[fe.fullScreen]:ue}),style:Je,ref:J},n.createElement(c.ZP,{next2Label:null,prev2Label:null,value:xe,nextLabel:n.createElement(g.J,{name:"angle-right"}),nextAriaLabel:"Next month",prevLabel:n.createElement(g.J,{name:"angle-left"}),prevAriaLabel:"Previous month",onChange:Ue,locale:"en",className:L.body,tileClassName:L.title,maxDate:Ie,minDate:qe}),n.createElement("div",{className:fe.time},n.createElement(s.y,{showSeconds:Ze,onChange:at,value:(0,a.CQ)(xe),disabledHours:Oe,disabledMinutes:ce,disabledSeconds:pe})),n.createElement(v.Lh,null,n.createElement(_.zx,{type:"button",onClick:()=>we((0,a.CQ)(xe))},"Apply"),n.createElement(_.zx,{variant:"secondary",type:"button",onClick:Le},"Cancel")))});F.displayName="DateTimeCalendar";const $=Ce=>({container:f.iv`
    padding: ${Ce.spacing(1)};
    border: 1px ${Ce.colors.border.weak} solid;
    border-radius: ${Ce.shape.borderRadius(1)};
    background-color: ${Ce.colors.background.primary};
    z-index: ${Ce.zIndex.modal};
  `,fullScreen:f.iv`
    position: absolute;
  `,time:f.iv`
    margin-bottom: ${Ce.spacing(2)};
  `,modal:f.iv`
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: ${Ce.zIndex.modal};
    max-width: 280px;
  `});try{K.displayName="DateTimeInput",K.__docgenInfo={description:"",displayName:"DateTimeInput",props:{date:{defaultValue:null,description:"Input date for the component",name:"date",required:!1,type:{name:"DateTime"}},onChange:{defaultValue:null,description:"Callback for returning the selected date",name:"onChange",required:!0,type:{name:"(date: DateTime) => void"}},label:{defaultValue:null,description:"label for the input field",name:"label",required:!1,type:{name:"ReactNode"}},maxDate:{defaultValue:null,description:"Set the latest selectable date",name:"maxDate",required:!1,type:{name:"Date"}},minDate:{defaultValue:null,description:"Set the minimum selectable date",name:"minDate",required:!1,type:{name:"Date"}},showSeconds:{defaultValue:{value:"true"},description:"Display seconds on the time picker",name:"showSeconds",required:!1,type:{name:"boolean"}},disabledHours:{defaultValue:null,description:"Set the hours that can't be selected",name:"disabledHours",required:!1,type:{name:"(() => number[])"}},disabledMinutes:{defaultValue:null,description:"Set the minutes that can't be selected",name:"disabledMinutes",required:!1,type:{name:"(() => number[])"}},disabledSeconds:{defaultValue:null,description:"Set the seconds that can't be selected",name:"disabledSeconds",required:!1,type:{name:"(() => number[])"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/DateTimePicker/DateTimePicker.tsx#DateTimeInput"]={docgenInfo:K.__docgenInfo,name:"DateTimeInput",path:"src/components/DateTimePickers/DateTimePicker/DateTimePicker.tsx#DateTimeInput"})}catch(Ce){}var R=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),U=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),H=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function W(Ce){const Le=Object.assign({h1:"h1",p:"p",em:"em",h3:"h3",pre:"pre",code:"code"},(0,U.ah)(),Ce.components);return(0,R.jsxs)(R.Fragment,{children:[(0,R.jsx)(Le.h1,{children:"DateTimePicker"}),`
`,(0,R.jsxs)(Le.p,{children:["A component for selecting a date ",(0,R.jsx)(Le.em,{children:"and"})," time."]}),`
`,(0,R.jsx)(Le.h3,{children:"Usage"}),`
`,(0,R.jsx)(Le.pre,{children:(0,R.jsx)(Le.code,{className:"language-tsx",children:`import React, { useState } from 'react';
import { DateTime, dateTime } from '@grafana/data';
import { DateTimePicker } from '@grafana/ui';

const [date, setDate] = useState<DateTime>(dateTime('2021-05-05 12:00:00'));
return <DateTimePicker label="Date" date={date} onChange={setDate} />;
`})}),`
`,(0,R.jsx)(Le.h3,{children:"With disbled hours, minutes or seconds"}),`
`,(0,R.jsx)(Le.pre,{children:(0,R.jsx)(Le.code,{className:"language-tsx",children:`import React, { useState } from 'react';
import { DateTime, dateTime } from '@grafana/data';
import { DateTimePicker } from '@grafana/ui';

const [date, setDate] = useState<DateTime>(dateTime('2021-05-05 12:00:00'));
return (
  <DateTimePicker
    label="Date"
    date={date}
    onChange={setDate}
    disabledHours={() => [0, 1, 2]}
    disabledMinutes={() => [10, 15, 30]}
    disabledSeconds={() => [5, 10, 15, 20]}
  />
);
`})}),`
`,(0,R.jsx)(Le.h3,{children:"Props"}),`
`,(0,R.jsx)(H.$4,{of:j})]})}function oe(Ce={}){const{wrapper:Le}=Object.assign({},(0,U.ah)(),Ce.components);return Le?(0,R.jsx)(Le,Object.assign({},Ce,{children:(0,R.jsx)(W,Ce)})):W(Ce)}var Q=oe,P=Object.defineProperty,ae=Object.getOwnPropertySymbols,q=Object.prototype.hasOwnProperty,Y=Object.prototype.propertyIsEnumerable,ve=(Ce,Le,we)=>Le in Ce?P(Ce,Le,{enumerable:!0,configurable:!0,writable:!0,value:we}):Ce[Le]=we,re=(Ce,Le)=>{for(var we in Le||(Le={}))q.call(Le,we)&&ve(Ce,we,Le[we]);if(ae)for(var we of ae(Le))Y.call(Le,we)&&ve(Ce,we,Le[we]);return Ce},je=`import { action } from '@storybook/addon-actions';
import { ComponentStory, ComponentMeta } from '@storybook/react';
import React, { useState } from 'react';

import { dateTime, DateTime } from '@grafana/data';

import { withCenteredStory } from '../../../utils/storybook/withCenteredStory';

import { DateTimePicker } from './DateTimePicker';
import mdx from './DateTimePicker.mdx';

const today = new Date();

// minimum date is initially set to 7 days before to allow the user
// to quickly see its effects
const minimumDate = new Date();
minimumDate.setDate(minimumDate.getDate() - 7);

const meta: ComponentMeta<typeof DateTimePicker> = {
  title: 'Pickers and Editors/TimePickers/DateTimePicker',
  decorators: [withCenteredStory],
  component: DateTimePicker,
  argTypes: {
    date: {
      table: { disable: true },
    },
    onChange: {
      table: { disable: true },
    },
    minDate: { control: 'date' },
    maxDate: { control: 'date' },
    showSeconds: { control: 'boolean' },
  },
  args: {
    minDate: minimumDate,
    maxDate: today,
    showSeconds: true,
  },
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

export const OnlyWorkingHoursEnabled: ComponentStory<typeof DateTimePicker> = ({
  label,
  minDate,
  maxDate,
  showSeconds,
}) => {
  const [date, setDate] = useState<DateTime>(dateTime(today));
  // the minDate arg can change from Date object to number, we need to handle this
  // scenario to avoid a crash in the component's story.
  const minDateVal = typeof minDate === 'number' ? new Date(minDate) : minDate;
  const maxDateVal = typeof maxDate === 'number' ? new Date(maxDate) : maxDate;

  return (
    <DateTimePicker
      label={label}
      disabledHours={() => [0, 1, 2, 3, 4, 5, 6, 19, 20, 21, 22, 23]}
      minDate={minDateVal}
      maxDate={maxDateVal}
      date={date}
      showSeconds={showSeconds}
      onChange={(newValue) => {
        action('on change')(newValue);
        setDate(newValue);
      }}
    />
  );
};

export const Basic: ComponentStory<typeof DateTimePicker> = ({ label, minDate, maxDate, showSeconds }) => {
  const [date, setDate] = useState<DateTime>(dateTime(today));
  // the minDate arg can change from Date object to number, we need to handle this
  // scenario to avoid a crash in the component's story.
  const minDateVal = typeof minDate === 'number' ? new Date(minDate) : minDate;
  const maxDateVal = typeof maxDate === 'number' ? new Date(maxDate) : maxDate;

  return (
    <DateTimePicker
      label={label}
      minDate={minDateVal}
      maxDate={maxDateVal}
      date={date}
      showSeconds={showSeconds}
      onChange={(newValue) => {
        action('on change')(newValue);
        setDate(newValue);
      }}
    />
  );
};

Basic.args = {
  label: 'Date',
};

export default meta;
`,me={OnlyWorkingHoursEnabled:{startLoc:{col:78,line:46},endLoc:{col:1,line:72},startBody:{col:78,line:46},endBody:{col:1,line:72}},Basic:{startLoc:{col:60,line:74},endLoc:{col:1,line:94},startBody:{col:60,line:74},endBody:{col:1,line:94}}};const ne=new Date,Z=new Date;Z.setDate(Z.getDate()-7);const te={title:"Pickers and Editors/TimePickers/DateTimePicker",decorators:[l.BU],component:j,argTypes:{date:{table:{disable:!0}},onChange:{table:{disable:!0}},minDate:{control:"date"},maxDate:{control:"date"},showSeconds:{control:"boolean"}},args:{minDate:Z,maxDate:ne,showSeconds:!0},parameters:{docs:{page:Q}}},Pe=({label:Ce,minDate:Le,maxDate:we,showSeconds:ue})=>{const[Ie,qe]=(0,n.useState)((0,a.CQ)(ne)),Je=typeof Le=="number"?new Date(Le):Le,Ze=typeof we=="number"?new Date(we):we;return n.createElement(j,{label:Ce,disabledHours:()=>[0,1,2,3,4,5,6,19,20,21,22,23],minDate:Je,maxDate:Ze,date:Ie,showSeconds:ue,onChange:Oe=>{(0,t.action)("on change")(Oe),qe(Oe)}})},he=({label:Ce,minDate:Le,maxDate:we,showSeconds:ue})=>{const[Ie,qe]=(0,n.useState)((0,a.CQ)(ne)),Je=typeof Le=="number"?new Date(Le):Le,Ze=typeof we=="number"?new Date(we):we;return n.createElement(j,{label:Ce,minDate:Je,maxDate:Ze,date:Ie,showSeconds:ue,onChange:Oe=>{(0,t.action)("on change")(Oe),qe(Oe)}})};he.args={label:"Date"};var ie=te;Pe.parameters=re({storySource:{source:`({
  label,
  minDate,
  maxDate,
  showSeconds,
}) => {
  const [date, setDate] = useState<DateTime>(dateTime(today));
  // the minDate arg can change from Date object to number, we need to handle this
  // scenario to avoid a crash in the component's story.
  const minDateVal = typeof minDate === 'number' ? new Date(minDate) : minDate;
  const maxDateVal = typeof maxDate === 'number' ? new Date(maxDate) : maxDate;

  return (
    <DateTimePicker
      label={label}
      disabledHours={() => [0, 1, 2, 3, 4, 5, 6, 19, 20, 21, 22, 23]}
      minDate={minDateVal}
      maxDate={maxDateVal}
      date={date}
      showSeconds={showSeconds}
      onChange={(newValue) => {
        action('on change')(newValue);
        setDate(newValue);
      }}
    />
  );
}`}},Pe.parameters),he.parameters=re({storySource:{source:`({ label, minDate, maxDate, showSeconds }) => {
  const [date, setDate] = useState<DateTime>(dateTime(today));
  // the minDate arg can change from Date object to number, we need to handle this
  // scenario to avoid a crash in the component's story.
  const minDateVal = typeof minDate === 'number' ? new Date(minDate) : minDate;
  const maxDateVal = typeof maxDate === 'number' ? new Date(maxDate) : maxDate;

  return (
    <DateTimePicker
      label={label}
      minDate={minDateVal}
      maxDate={maxDateVal}
      date={date}
      showSeconds={showSeconds}
      onChange={(newValue) => {
        action('on change')(newValue);
        setDate(newValue);
      }}
    />
  );
}`}},he.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/DateTimePicker/DateTimePicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/DateTimePicker/DateTimePicker.story.tsx#ComponentMeta"})}catch(Ce){}},"./src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return Le},default:function(){return we}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),x=e("../../.yarn/__virtual__/@react-aria-dialog-virtual-6e50988279/2/yarn/cache/@react-aria-dialog-npm-3.3.1-c100ba6958-ba924f07a7.zip/node_modules/@react-aria/dialog/dist/module.js"),d=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),i=e("../../.yarn/__virtual__/@react-aria-overlays-virtual-34e54d82d1/2/yarn/cache/@react-aria-overlays-npm-3.10.1-f232007f1a-b83ec155d3.zip/node_modules/@react-aria/overlays/dist/module.js"),c=e("../../.yarn/__virtual__/react-popper-virtual-6baf84772d/2/yarn/cache/react-popper-npm-2.3.0-1045578379-837111c987.zip/node_modules/react-popper/lib/esm/usePopper.js"),E=e("./src/themes/ThemeContext.tsx"),O=e("./src/utils/i18n.tsx"),m=e("./src/components/Button/Button.tsx"),w=e("./src/components/CustomScrollbar/CustomScrollbar.tsx"),_=e("./src/components/Forms/Field.tsx"),C=e("./src/components/Icon/Icon.tsx"),b=e("./src/components/Input/Input.tsx"),g=e("./src/components/Portal/Portal.tsx"),v=e("./src/components/Tooltip/Tooltip.tsx"),y=e("./src/components/DateTimePickers/TimeRangePicker/TimePickerTitle.tsx"),h=e("./src/components/DateTimePickers/TimeRangePicker/TimeRangeList.tsx"),s=e("./src/components/DateTimePickers/options.ts");const o=/^now$|^now\-(\d{1,10})([wdhms])$/,r=ue=>({from:k(ue.from),to:k(ue.to)}),u=ue=>{const Ie=M(ue.from),qe=M(ue.to);return{from:Ie,to:qe,display:`${Ie} to ${qe}`}},p=(ue,Ie=Date.now())=>S(ue)?k(ue)>Math.ceil(Ie/1e3)?{isValid:!1,errorMessage:"Can not enter value prior to January 1, 1970."}:{isValid:!0}:{isValid:!1,errorMessage:"Value not in relative time format."},S=ue=>o.test(ue),k=ue=>{const Ie=o.exec(ue);if(!Ie||Ie.length!==3)return 0;const[,qe,Je]=Ie,Ze=parseInt(qe,10);return isNaN(Ze)?0:Ze*D[Je]},D={w:604800,d:86400,h:3600,m:60,s:1},M=ue=>ue<=0?"now":ue>=D.w&&ue%D.w===0?`now-${ue/D.w}w`:ue>=D.d&&ue%D.d===0?`now-${ue/D.d}d`:ue>=D.h&&ue%D.h===0?`now-${ue/D.h}h`:ue>=D.m&&ue%D.m===0?`now-${ue/D.m}m`:`now-${ue}s`;var I=Object.defineProperty,T=Object.defineProperties,j=Object.getOwnPropertyDescriptors,K=Object.getOwnPropertySymbols,F=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable,R=(ue,Ie,qe)=>Ie in ue?I(ue,Ie,{enumerable:!0,configurable:!0,writable:!0,value:qe}):ue[Ie]=qe,U=(ue,Ie)=>{for(var qe in Ie||(Ie={}))F.call(Ie,qe)&&R(ue,qe,Ie[qe]);if(K)for(var qe of K(Ie))$.call(Ie,qe)&&R(ue,qe,Ie[qe]);return ue},H=(ue,Ie)=>T(ue,j(Ie));const W=s.r.filter(ue=>S(ue.from));function oe(ue){const{timeRange:Ie,onChange:qe}=ue,[Je,Ze]=(0,a.useState)(!1),Oe=(0,a.useCallback)(()=>Ze(!1),[]),ce=u(Ie),[pe,J]=(0,a.useState)({value:ce.from,validation:p(ce.from)}),[L,fe]=(0,a.useState)({value:ce.to,validation:p(ce.to)}),xe=(0,a.useRef)(null),{overlayProps:We,underlayProps:Ue}=(0,i.Ir)({onClose:()=>Ze(!1),isDismissable:!0,isOpen:Je},xe),{dialogProps:at}=(0,x.R)({},xe),[it,_t]=(0,a.useState)(null),[wt,ee]=(0,a.useState)(null),_e=(0,c.D)(it,wt,{placement:"auto-start"}),ge=(0,E.wW)(ae(pe.validation.errorMessage,L.validation.errorMessage)),de=le=>{const ye=r(le);!ye||(Oe(),J(H(U({},pe),{value:le.from})),fe(H(U({},L),{value:le.to})),qe(ye))},Ee=(0,a.useCallback)(le=>{le.stopPropagation(),le.preventDefault(),Ze(!Je)},[Je]),ze=le=>{if(le.preventDefault(),!L.validation.isValid||!pe.validation.isValid)return;const ye=r({from:pe.value,to:L.value,display:""});!ye||(qe(ye),Ze(!1))};return a.createElement("div",{className:ge.container,ref:_t},a.createElement("button",{className:ge.pickerInput,type:"button",onClick:Ee},a.createElement("span",{className:ge.clockIcon},a.createElement(C.J,{name:"clock-nine"})),a.createElement("span",null,ce.from," to ",ce.to),a.createElement("span",{className:ge.caretIcon},a.createElement(C.J,{name:Je?"angle-up":"angle-down",size:"lg"}))),Je&&a.createElement(g.h_,null,a.createElement("div",U({role:"presentation",className:ge.backdrop},Ue)),a.createElement(d.MT,{contain:!0,autoFocus:!0,restoreFocus:!0},a.createElement("div",U(U({ref:xe},We),at),a.createElement("div",U({className:ge.content,ref:ee,style:_e.styles.popper},_e.attributes),a.createElement("div",{className:ge.body},a.createElement(w.Z,{className:ge.leftSide,hideHorizontalTrack:!0},a.createElement(h.V,{title:(0,O.t)("time-picker.time-range.example-title","Example time ranges"),options:W,onChange:de,value:ce})),a.createElement("div",{className:ge.rightSide},a.createElement("div",{className:ge.title},a.createElement(y.r,null,a.createElement(v.u,{content:a.createElement(Q,null),placement:"bottom",theme:"info"},a.createElement("div",null,a.createElement(O.c,{i18nKey:"time-picker.time-range.specify"},"Specify time range ",a.createElement(C.J,{name:"info-circle"})))))),a.createElement(_.g,{label:"From",invalid:!pe.validation.isValid,error:pe.validation.errorMessage},a.createElement(b.I,{onClick:le=>le.stopPropagation(),onBlur:()=>J(H(U({},pe),{validation:p(pe.value)})),onChange:le=>J(H(U({},pe),{value:le.currentTarget.value})),value:pe.value})),a.createElement(_.g,{label:"To",invalid:!L.validation.isValid,error:L.validation.errorMessage},a.createElement(b.I,{onClick:le=>le.stopPropagation(),onBlur:()=>fe(H(U({},L),{validation:p(L.value)})),onChange:le=>fe(H(U({},L),{value:le.currentTarget.value})),value:L.value})),a.createElement(m.zx,{"aria-label":"TimePicker submit button",onClick:ze},"Apply time range"))))))))}const Q=()=>{const ue=(0,E.wW)(P);return a.createElement(a.Fragment,null,a.createElement("div",{className:ue.supported},"Supported formats: ",a.createElement("code",{className:ue.tooltip},"now-[digit]s/m/h/d/w")),a.createElement("div",null,"Example: to select a time range from 10 minutes ago to now"),a.createElement("code",{className:ue.tooltip},"From: now-10m To: now"),a.createElement("div",{className:ue.link},"For more information see"," ",a.createElement("a",{href:"https://grafana.com/docs/grafana/latest/dashboards/time-range-controls/"},"docs ",a.createElement(C.J,{name:"external-link-alt"})),"."))},P=ue=>({supported:f.iv`
    margin-bottom: ${ue.spacing(1)};
  `,tooltip:f.iv`
    margin: 0;
  `,link:f.iv`
    margin-top: ${ue.spacing(1)};
  `}),ae=(ue,Ie)=>qe=>{const Je=(0,b.H)({theme:qe,invalid:!1}),Oe=250+q(qe,ue)+q(qe,Ie);return{backdrop:f.iv`
      position: fixed;
      z-index: ${qe.zIndex.modalBackdrop};
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
    `,container:f.iv`
      display: flex;
      position: relative;
    `,pickerInput:(0,f.cx)(Je.input,Je.wrapper,f.iv`
        display: flex;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;
        padding-right: 0;
        padding-left: 0;
        line-height: ${qe.spacing.gridSize*qe.components.height.md-2}px;
      `),caretIcon:(0,f.cx)(Je.suffix,f.iv`
        position: relative;
        margin-left: ${qe.spacing(.5)};
      `),clockIcon:(0,f.cx)(Je.prefix,f.iv`
        position: relative;
        margin-right: ${qe.spacing(.5)};
      `),content:f.iv`
      background: ${qe.colors.background.primary};
      box-shadow: ${qe.shadows.z3};
      position: absolute;
      z-index: ${qe.zIndex.modal};
      width: 500px;
      top: 100%;
      border-radius: ${qe.shape.radius.default};
      border: 1px solid ${qe.colors.border.weak};
      left: 0;
      white-space: normal;
    `,body:f.iv`
      display: flex;
      height: ${Oe}px;
    `,description:f.iv`
      color: ${qe.colors.text.secondary};
      font-size: ${qe.typography.size.sm};
    `,leftSide:f.iv`
      width: 50% !important;
      border-right: 1px solid ${qe.colors.border.medium};
    `,rightSide:f.iv`
      width: 50%;
      padding: ${qe.spacing(1)};
    `,title:f.iv`
      margin-bottom: ${qe.spacing(1)};
    `}};function q(ue,Ie){return Ie?Ie.length>34?ue.spacing.gridSize*6.5:ue.spacing.gridSize*4:0}try{oe.displayName="RelativeTimeRangePicker",oe.__docgenInfo={description:"",displayName:"RelativeTimeRangePicker",props:{timeRange:{defaultValue:null,description:"",name:"timeRange",required:!0,type:{name:"RelativeTimeRange"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(timeRange: RelativeTimeRange) => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx#RelativeTimeRangePicker"]={docgenInfo:oe.__docgenInfo,name:"RelativeTimeRangePicker",path:"src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.tsx#RelativeTimeRangePicker"})}catch(ue){}var Y=Object.defineProperty,ve=Object.defineProperties,re=Object.getOwnPropertyDescriptors,je=Object.getOwnPropertySymbols,me=Object.prototype.hasOwnProperty,ne=Object.prototype.propertyIsEnumerable,Z=(ue,Ie,qe)=>Ie in ue?Y(ue,Ie,{enumerable:!0,configurable:!0,writable:!0,value:qe}):ue[Ie]=qe,te=(ue,Ie)=>{for(var qe in Ie||(Ie={}))me.call(Ie,qe)&&Z(ue,qe,Ie[qe]);if(je)for(var qe of je(Ie))ne.call(Ie,qe)&&Z(ue,qe,Ie[qe]);return ue},Pe=(ue,Ie)=>ve(ue,re(Ie)),he=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../../utils/storybook/withCenteredStory';

import { RelativeTimeRangePicker } from './RelativeTimeRangePicker';

const meta: ComponentMeta<typeof RelativeTimeRangePicker> = {
  title: 'Pickers and Editors/TimePickers/RelativeTimeRangePicker',
  component: RelativeTimeRangePicker,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['onChange'],
    },
  },
  args: {
    timeRange: {
      from: 900,
      to: 0,
    },
  },
};

export const Basic: ComponentStory<typeof RelativeTimeRangePicker> = (args) => {
  const [, updateArgs] = useArgs();
  return (
    <RelativeTimeRangePicker
      {...args}
      onChange={(value) => {
        action('onChange')(value);
        updateArgs({ timeRange: value });
      }}
    />
  );
};

export default meta;
`,ie={Basic:{startLoc:{col:69,line:27},endLoc:{col:1,line:38},startBody:{col:69,line:27},endBody:{col:1,line:38}}};const Ce={title:"Pickers and Editors/TimePickers/RelativeTimeRangePicker",component:oe,decorators:[l.BU],parameters:{controls:{exclude:["onChange"]}},args:{timeRange:{from:900,to:0}}},Le=ue=>{const[,Ie]=(0,n.D8)();return a.createElement(oe,Pe(te({},ue),{onChange:qe=>{(0,t.action)("onChange")(qe),Ie({timeRange:qe})}}))};var we=Ce;Le.parameters=te({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  return (
    <RelativeTimeRangePicker
      {...args}
      onChange={(value) => {
        action('onChange')(value);
        updateArgs({ timeRange: value });
      }}
    />
  );
}`}},Le.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.story.tsx#ComponentMeta"})}catch(ue){}},"./src/components/DateTimePickers/TimeOfDayPicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return y}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),f=e("./src/components/DateTimePickers/TimeOfDayPicker.tsx"),x=e("./src/utils/storybook/withCenteredStory.tsx"),d=Object.defineProperty,i=Object.defineProperties,c=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(h,s,o)=>s in h?d(h,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):h[s]=o,_=(h,s)=>{for(var o in s||(s={}))O.call(s,o)&&w(h,o,s[o]);if(E)for(var o of E(s))m.call(s,o)&&w(h,o,s[o]);return h},C=(h,s)=>i(h,c(s)),b=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { dateTime } from '@grafana/data';
import { TimeOfDayPicker } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

const meta: ComponentMeta<typeof TimeOfDayPicker> = {
  title: 'Pickers and Editors/TimePickers/TimeOfDayPicker',
  component: TimeOfDayPicker,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['onChange'],
    },
  },
  args: {
    value: dateTime(Date.now()),
  },
  argTypes: { value: { control: 'date' } },
};

export const Basic: ComponentStory<typeof TimeOfDayPicker> = (args) => {
  const [, updateArgs] = useArgs();
  return (
    <TimeOfDayPicker
      {...args}
      onChange={(newValue) => {
        action('on selected')(newValue);
        updateArgs({ value: newValue });
      }}
    />
  );
};

export default meta;
`,g={Basic:{startLoc:{col:61,line:26},endLoc:{col:1,line:37},startBody:{col:61,line:26},endBody:{col:1,line:37}}};const v={title:"Pickers and Editors/TimePickers/TimeOfDayPicker",component:f.y,decorators:[x.BU],parameters:{controls:{exclude:["onChange"]}},args:{value:(0,l.CQ)(Date.now())},argTypes:{value:{control:"date"}}},y=h=>{const[,s]=(0,n.D8)();return a.createElement(f.y,C(_({},h),{onChange:o=>{(0,t.action)("on selected")(o),s({value:o})}}))};V.default=v,y.parameters=_({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  return (
    <TimeOfDayPicker
      {...args}
      onChange={(newValue) => {
        action('on selected')(newValue);
        updateArgs({ value: newValue });
      }}
    />
  );
}`}},y.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeOfDayPicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/TimeOfDayPicker.story.tsx#ComponentMeta"})}catch(h){}},"./src/components/DateTimePickers/TimeRangeInput.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return ae},default:function(){return q}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/time.ts"),x=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),d=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/datemath.ts"),i=e("../grafana-e2e-selectors/src/selectors/index.ts"),c=e("./src/themes/stylesFactory.ts"),E=e("./src/themes/ThemeContext.tsx"),O=e("./src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx"),m=e("./src/components/Icon/Icon.tsx"),w=e("./src/components/Input/Input.tsx"),_=e("./src/components/DateTimePickers/TimeRangePicker.tsx"),C=e("./src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx"),b=e("./src/components/DateTimePickers/options.ts");const g=Y=>d.JY(Y.from)&&d.JY(Y.to),v=()=>{},y=({value:Y,onChange:ve,onChangeTimeZone:re=v,clearable:je,hideTimeZone:me=!0,timeZone:ne="browser",placeholder:Z="Select time range",isReversed:te=!0,hideQuickRanges:Pe=!1,disabled:he=!1})=>{const[ie,Ce]=(0,a.useState)(!1),Le=(0,E.l4)(),we=h(Le,he),ue=Ze=>{Ze.stopPropagation(),Ze.preventDefault(),!he&&Ce(!ie)},Ie=()=>{Ce(!1)},qe=Ze=>{Ie(),ve(Ze)},Je=Ze=>{Ze.stopPropagation();const Oe=(0,l.CQ)(null),ce=(0,l.CQ)(null);ve({from:Oe,to:ce,raw:{from:Oe,to:ce}})};return a.createElement("div",{className:we.container},a.createElement("button",{type:"button",className:we.pickerInput,"aria-label":i.wl.components.TimePicker.openButton,onClick:ue},g(Y)?a.createElement(_.sU,{value:Y,timeZone:ne}):a.createElement("span",{className:we.placeholder},Z),!he&&a.createElement("span",{className:we.caretIcon},g(Y)&&je&&a.createElement(m.J,{className:we.clearIcon,name:"times",size:"lg",onClick:Je}),a.createElement(m.J,{name:ie?"angle-up":"angle-down",size:"lg"}))),ie&&a.createElement(O.L,{includeButtonPress:!1,onClick:Ie},a.createElement(C.x,{timeZone:ne,value:g(Y)?Y:(0,f.JK)(),onChange:qe,quickOptions:b.r,onChangeTimeZone:re,className:we.content,hideTimeZone:me,isReversed:te,hideQuickRanges:Pe})))},h=(0,c.B)((Y,ve=!1)=>{const re=(0,w.H)({theme:Y,invalid:!1});return{container:x.iv`
      display: flex;
      position: relative;
    `,content:x.iv`
      margin-left: 0;
      position: absolute;
      top: 116%;
      z-index: ${Y.zIndex.dropdown};
    `,pickerInput:(0,x.cx)(re.input,ve&&re.inputDisabled,re.wrapper,x.iv`
        display: flex;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;
        padding-right: 0;
        line-height: ${Y.spacing.gridSize*4-2}px;
      `),caretIcon:(0,x.cx)(re.suffix,x.iv`
        position: relative;
        top: -1px;
        margin-left: ${Y.spacing(.5)};
      `),clearIcon:x.iv`
      margin-right: ${Y.spacing(.5)};
      &:hover {
        color: ${Y.colors.text.maxContrast};
      }
    `,placeholder:x.iv`
      color: ${Y.colors.text.disabled};
      opacity: 1;
    `}});try{y.displayName="TimeRangeInput",y.__docgenInfo={description:"",displayName:"TimeRangeInput",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"TimeRange"}},timeZone:{defaultValue:{value:"browser"},description:"",name:"timeZone",required:!1,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(timeRange: TimeRange) => void"}},onChangeTimeZone:{defaultValue:{value:"() => {}"},description:"",name:"onChangeTimeZone",required:!1,type:{name:"((timeZone: string) => void)"}},hideTimeZone:{defaultValue:{value:"true"},description:"",name:"hideTimeZone",required:!1,type:{name:"boolean"}},placeholder:{defaultValue:{value:"Select time range"},description:"",name:"placeholder",required:!1,type:{name:"string"}},clearable:{defaultValue:null,description:"",name:"clearable",required:!1,type:{name:"boolean"}},isReversed:{defaultValue:{value:"true"},description:"Controls horizontal alignment of the picker menu",name:"isReversed",required:!1,type:{name:"boolean"}},hideQuickRanges:{defaultValue:{value:"false"},description:"Controls visibility of the preset time ranges (e.g. **Last 5 minutes**) in the picker menu",name:"hideQuickRanges",required:!1,type:{name:"boolean"}},disabled:{defaultValue:{value:"false"},description:"",name:"disabled",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangeInput.tsx#TimeRangeInput"]={docgenInfo:y.__docgenInfo,name:"TimeRangeInput",path:"src/components/DateTimePickers/TimeRangeInput.tsx#TimeRangeInput"})}catch(Y){}var s=e("./src/utils/storybook/withCenteredStory.tsx"),o=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),r=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),u=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function p(Y){const ve=Object.assign({h1:"h1",p:"p",code:"code",pre:"pre",h3:"h3"},(0,r.ah)(),Y.components);return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(ve.h1,{children:"TimeRangeInput"}),`
`,(0,o.jsxs)(ve.p,{children:["A variant of ",(0,o.jsx)(ve.code,{children:"TimeRangePicker"})," for use in forms."]}),`
`,(0,o.jsxs)(ve.p,{children:[(0,o.jsx)(ve.code,{children:"dateTime(null)"})," can be used to provide empty time range value. The shape of the return value on input clear is:"]}),`
`,(0,o.jsx)(ve.pre,{children:(0,o.jsx)(ve.code,{className:"language-javascript",children:`{
  from: dateTime(null),
  to: dateTime(null),
  raw: {
    from: dateTime(null),
    to: dateTime(null),
  },
};
`})}),`
`,(0,o.jsxs)(ve.p,{children:[(0,o.jsx)(ve.code,{children:"dateMath.isValid()"})," from ",(0,o.jsx)(ve.code,{children:"@grafana/data"})," can be used to check for a valid time range value."]}),`
`,(0,o.jsx)(ve.h3,{children:"Usage"}),`
`,(0,o.jsx)(ve.pre,{children:(0,o.jsx)(ve.code,{className:"language-jsx",children:`import { TimeRangeInput } from '@grafana/ui';

<TimeRangeInput
  value={timeRange}
  onChange={(range) => console.log('range', range)}
  onChangeTimeZone={(tz) => console.log('timezone', tz)}
/>;
`})}),`
`,(0,o.jsx)(ve.h3,{children:"Props"}),`
`,(0,o.jsx)(u.xP,{of:y})]})}function S(Y={}){const{wrapper:ve}=Object.assign({},(0,r.ah)(),Y.components);return ve?(0,o.jsx)(ve,Object.assign({},Y,{children:(0,o.jsx)(p,Y)})):p(Y)}var k=S,D=Object.defineProperty,M=Object.defineProperties,I=Object.getOwnPropertyDescriptors,T=Object.getOwnPropertySymbols,j=Object.prototype.hasOwnProperty,K=Object.prototype.propertyIsEnumerable,F=(Y,ve,re)=>ve in Y?D(Y,ve,{enumerable:!0,configurable:!0,writable:!0,value:re}):Y[ve]=re,$=(Y,ve)=>{for(var re in ve||(ve={}))j.call(ve,re)&&F(Y,re,ve[re]);if(T)for(var re of T(ve))K.call(ve,re)&&F(Y,re,ve[re]);return Y},R=(Y,ve)=>M(Y,I(ve)),U=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { dateTime, DefaultTimeZone, isDateTime, TimeRange } from '@grafana/data';
import { TimeRangeInput } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './TimeRangeInput.mdx';

const now = dateTime(Date.now());

const isOnRangeClear = (value: TimeRange) => {
  return (
    !value.from.isValid() &&
    !value.to.isValid() &&
    isDateTime(value.raw.from) &&
    !value.raw.from.isValid() &&
    isDateTime(value.raw.to) &&
    !value.raw.to.isValid()
  );
};

const nullRange = {
  from: null,
  to: null,
  raw: {
    from: null,
    to: null,
  },
};

const meta: ComponentMeta<typeof TimeRangeInput> = {
  title: 'Pickers and Editors/TimePickers/TimeRangeInput',
  component: TimeRangeInput,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['onChange', 'onChangeTimeZone'],
    },
    docs: {
      page: mdx,
    },
  },
  args: {
    value: {
      from: now.subtract(6, 'h'),
      to: now,
      raw: {
        from: 'now-6h',
        to: 'now',
      },
    },
    timeZone: DefaultTimeZone,
  },
};

export const Basic: ComponentStory<typeof TimeRangeInput> = (args) => {
  const [, updateArgs] = useArgs();
  return (
    <TimeRangeInput
      {...args}
      onChange={(value) => {
        action('onChange fired')(value);
        // Need some special logic to handle when the range is cleared since
        // storybook controls don't support null datetimes
        updateArgs({
          value: isOnRangeClear(value) ? nullRange : value,
        });
      }}
      onChangeTimeZone={(timeZone) => {
        action('onChangeTimeZone fired')(timeZone);
        updateArgs({
          timeZone,
        });
      }}
    />
  );
};

export default meta;
`,H={Basic:{startLoc:{col:60,line:60},endLoc:{col:1,line:81},startBody:{col:60,line:60},endBody:{col:1,line:81}}};const W=(0,l.CQ)(Date.now()),oe=Y=>!Y.from.isValid()&&!Y.to.isValid()&&(0,l.v9)(Y.raw.from)&&!Y.raw.from.isValid()&&(0,l.v9)(Y.raw.to)&&!Y.raw.to.isValid(),Q={from:null,to:null,raw:{from:null,to:null}},P={title:"Pickers and Editors/TimePickers/TimeRangeInput",component:y,decorators:[s.BU],parameters:{controls:{exclude:["onChange","onChangeTimeZone"]},docs:{page:k}},args:{value:{from:W.subtract(6,"h"),to:W,raw:{from:"now-6h",to:"now"}},timeZone:f.Ys}},ae=Y=>{const[,ve]=(0,n.D8)();return a.createElement(y,R($({},Y),{onChange:re=>{(0,t.action)("onChange fired")(re),ve({value:oe(re)?Q:re})},onChangeTimeZone:re=>{(0,t.action)("onChangeTimeZone fired")(re),ve({timeZone:re})}}))};var q=P;ae.parameters=$({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  return (
    <TimeRangeInput
      {...args}
      onChange={(value) => {
        action('onChange fired')(value);
        // Need some special logic to handle when the range is cleared since
        // storybook controls don't support null datetimes
        updateArgs({
          value: isOnRangeClear(value) ? nullRange : value,
        });
      }}
      onChangeTimeZone={(timeZone) => {
        action('onChangeTimeZone fired')(timeZone);
        updateArgs({
          timeZone,
        });
      }}
    />
  );
}`}},ae.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangeInput.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/TimeRangeInput.story.tsx#ComponentMeta"})}catch(Y){}},"./src/components/DateTimePickers/TimeRangePicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return o}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/time.ts"),x=e("./src/components/DateTimePickers/TimeRangePicker.tsx"),d=e("./src/utils/storybook/withCenteredStory.tsx"),i=Object.defineProperty,c=Object.defineProperties,E=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(r,u,p)=>u in r?i(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,C=(r,u)=>{for(var p in u||(u={}))m.call(u,p)&&_(r,p,u[p]);if(O)for(var p of O(u))w.call(u,p)&&_(r,p,u[p]);return r},b=(r,u)=>c(r,E(u)),g=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { dateTime, DefaultTimeZone } from '@grafana/data';
import { TimeRangePicker } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

const to = dateTime();
const from = to.subtract(6, 'h');

const meta: ComponentMeta<typeof TimeRangePicker> = {
  title: 'Pickers and Editors/TimePickers/TimeRangePicker',
  component: TimeRangePicker,
  decorators: [withCenteredStory],
  args: {
    value: {
      from,
      to,
      raw: {
        from: 'now-6h',
        to: 'now',
      },
    },
    timeZone: DefaultTimeZone,
    history: [],
  },
  parameters: {
    controls: {
      exclude: [
        'onChange',
        'onChangeTimeZone',
        'onChangeFiscalYearStartMonth',
        'onMoveBackward',
        'onMoveForward',
        'onZoom',
        'timeSyncButton',
      ],
    },
  },
};

export const Basic: ComponentStory<typeof TimeRangePicker> = (args) => {
  const [, updateArgs] = useArgs();
  return (
    <TimeRangePicker
      {...args}
      onChange={(value) => {
        action('onChange')(value);
        updateArgs({
          value,
          history: args.history ? [...args.history, value] : [value],
        });
      }}
      onChangeTimeZone={(timeZone) => {
        action('onChangeTimeZone')(timeZone);
        updateArgs({
          timeZone,
        });
      }}
      onMoveBackward={action('onMoveBackward')}
      onMoveForward={action('onMoveForward')}
      onZoom={action('onZoom')}
    />
  );
};

export default meta;
`,v={Basic:{startLoc:{col:61,line:45},endLoc:{col:1,line:68},startBody:{col:61,line:45},endBody:{col:1,line:68}}};const y=(0,l.CQ)(),h=y.subtract(6,"h"),s={title:"Pickers and Editors/TimePickers/TimeRangePicker",component:x.Xc,decorators:[d.BU],args:{value:{from:h,to:y,raw:{from:"now-6h",to:"now"}},timeZone:f.Ys,history:[]},parameters:{controls:{exclude:["onChange","onChangeTimeZone","onChangeFiscalYearStartMonth","onMoveBackward","onMoveForward","onZoom","timeSyncButton"]}}},o=r=>{const[,u]=(0,n.D8)();return a.createElement(x.Xc,b(C({},r),{onChange:p=>{(0,t.action)("onChange")(p),u({value:p,history:r.history?[...r.history,p]:[p]})},onChangeTimeZone:p=>{(0,t.action)("onChangeTimeZone")(p),u({timeZone:p})},onMoveBackward:(0,t.action)("onMoveBackward"),onMoveForward:(0,t.action)("onMoveForward"),onZoom:(0,t.action)("onZoom")}))};V.default=s,o.parameters=C({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  return (
    <TimeRangePicker
      {...args}
      onChange={(value) => {
        action('onChange')(value);
        updateArgs({
          value,
          history: args.history ? [...args.history, value] : [value],
        });
      }}
      onChangeTimeZone={(timeZone) => {
        action('onChangeTimeZone')(timeZone);
        updateArgs({
          timeZone,
        });
      }}
      onMoveBackward={action('onMoveBackward')}
      onMoveForward={action('onMoveForward')}
      onZoom={action('onZoom')}
    />
  );
}`}},o.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/TimeRangePicker.story.tsx#ComponentMeta"})}catch(r){}},"./src/components/DateTimePickers/TimeZonePicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return v}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("./src/components/DateTimePickers/TimeZonePicker.tsx"),f=e("./src/utils/storybook/withCenteredStory.tsx"),x=Object.defineProperty,d=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(y,h,s)=>h in y?x(y,h,{enumerable:!0,configurable:!0,writable:!0,value:s}):y[h]=s,w=(y,h)=>{for(var s in h||(h={}))E.call(h,s)&&m(y,s,h[s]);if(c)for(var s of c(h))O.call(h,s)&&m(y,s,h[s]);return y},_=(y,h)=>d(y,i(h)),C=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { TimeZonePicker } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

const meta: ComponentMeta<typeof TimeZonePicker> = {
  title: 'Pickers and Editors/TimePickers/TimeZonePicker',
  component: TimeZonePicker,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['inputId', 'onChange', 'onBlur'],
    },
  },
  args: {
    value: 'Europe/Stockholm',
  },
  argTypes: {
    includeInternal: {
      control: {
        type: 'boolean',
      },
    },
  },
};

export const Basic: ComponentStory<typeof TimeZonePicker> = (args) => {
  const [, updateArgs] = useArgs();
  return (
    <TimeZonePicker
      {...args}
      onChange={(newValue) => {
        action('on selected')(newValue);
        updateArgs({ value: newValue });
      }}
      onBlur={action('onBlur')}
    />
  );
};

export default meta;
`,b={Basic:{startLoc:{col:60,line:31},endLoc:{col:1,line:43},startBody:{col:60,line:31},endBody:{col:1,line:43}}};const g={title:"Pickers and Editors/TimePickers/TimeZonePicker",component:l.O,decorators:[f.BU],parameters:{controls:{exclude:["inputId","onChange","onBlur"]}},args:{value:"Europe/Stockholm"},argTypes:{includeInternal:{control:{type:"boolean"}}}},v=y=>{const[,h]=(0,n.D8)();return a.createElement(l.O,_(w({},y),{onChange:s=>{(0,t.action)("on selected")(s),h({value:s})},onBlur:(0,t.action)("onBlur")}))};V.default=g,v.parameters=w({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  return (
    <TimeZonePicker
      {...args}
      onChange={(newValue) => {
        action('on selected')(newValue);
        updateArgs({ value: newValue });
      }}
      onBlur={action('onBlur')}
    />
  );
}`}},v.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeZonePicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/TimeZonePicker.story.tsx#ComponentMeta"})}catch(y){}},"./src/components/DateTimePickers/WeekStartPicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return s},default:function(){return o}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../grafana-e2e-selectors/src/selectors/index.ts"),f=e("./src/components/Select/Select.tsx");const x=[{value:"",label:"Default"},{value:"saturday",label:"Saturday"},{value:"sunday",label:"Sunday"},{value:"monday",label:"Monday"}],d=r=>{var u;const{onChange:p,width:S,autoFocus:k=!1,onBlur:D,value:M,disabled:I=!1,inputId:T}=r,j=(0,a.useCallback)(K=>{K.value!==void 0&&p(K.value)},[p]);return a.createElement(f.Ph,{inputId:T,value:(u=x.find(K=>K.value===M))==null?void 0:u.value,placeholder:l.wl.components.WeekStartPicker.placeholder,autoFocus:k,openMenuOnFocus:!0,width:S,options:x,onChange:j,onBlur:D,disabled:I})};try{d.displayName="WeekStartPicker",d.__docgenInfo={description:"",displayName:"WeekStartPicker",props:{onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(weekStart: string) => void"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"number"}},autoFocus:{defaultValue:null,description:"",name:"autoFocus",required:!1,type:{name:"boolean"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"",name:"inputId",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/WeekStartPicker.tsx#WeekStartPicker"]={docgenInfo:d.__docgenInfo,name:"WeekStartPicker",path:"src/components/DateTimePickers/WeekStartPicker.tsx#WeekStartPicker"})}catch(r){}var i=e("./src/utils/storybook/withCenteredStory.tsx"),c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(r,u,p)=>u in r?c(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,b=(r,u)=>{for(var p in u||(u={}))w.call(u,p)&&C(r,p,u[p]);if(m)for(var p of m(u))_.call(u,p)&&C(r,p,u[p]);return r},g=(r,u)=>E(r,O(u)),v=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { WeekStartPicker } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

const meta: ComponentMeta<typeof WeekStartPicker> = {
  title: 'Pickers and Editors/TimePickers/WeekStartPicker',
  component: WeekStartPicker,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['onBlur', 'onChange', 'inputId'],
    },
  },
};

export const Basic: ComponentStory<typeof WeekStartPicker> = (args) => {
  const [, updateArgs] = useArgs();
  return (
    <WeekStartPicker
      {...args}
      onChange={(newValue) => {
        action('onChange')(newValue);
        updateArgs({ value: newValue });
      }}
      onBlur={action('onBlur')}
    />
  );
};

export default meta;
`,y={Basic:{startLoc:{col:61,line:21},endLoc:{col:1,line:33},startBody:{col:61,line:21},endBody:{col:1,line:33}}};const h={title:"Pickers and Editors/TimePickers/WeekStartPicker",component:d,decorators:[i.BU],parameters:{controls:{exclude:["onBlur","onChange","inputId"]}}},s=r=>{const[,u]=(0,n.D8)();return a.createElement(d,g(b({},r),{onChange:p=>{(0,t.action)("onChange")(p),u({value:p})},onBlur:(0,t.action)("onBlur")}))};var o=h;s.parameters=b({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  return (
    <WeekStartPicker
      {...args}
      onChange={(newValue) => {
        action('onChange')(newValue);
        updateArgs({ value: newValue });
      }}
      onBlur={action('onBlur')}
    />
  );
}`}},s.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/WeekStartPicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/DateTimePickers/WeekStartPicker.story.tsx#ComponentMeta"})}catch(r){}},"./src/components/Drawer/Drawer.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Global:function(){return q},InLine:function(){return ve},LongContent:function(){return Y},WithTabs:function(){return re},default:function(){return je}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("../../.yarn/__virtual__/@react-aria-dialog-virtual-6e50988279/2/yarn/cache/@react-aria-dialog-npm-3.3.1-c100ba6958-ba924f07a7.zip/node_modules/@react-aria/dialog/dist/module.js"),l=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),f=e("../../.yarn/__virtual__/@react-aria-overlays-virtual-34e54d82d1/2/yarn/cache/@react-aria-overlays-npm-3.10.1-f232007f1a-b83ec155d3.zip/node_modules/@react-aria/overlays/dist/module.js"),x=e("../../.yarn/__virtual__/rc-drawer-virtual-5d31b5508a/2/yarn/cache/rc-drawer-npm-6.1.3-ecc7753ecb-09fa308531.zip/node_modules/rc-drawer/es/index.js"),d=e("../grafana-e2e-selectors/src/selectors/index.ts"),i=e("./src/themes/ThemeContext.tsx"),c=e("./src/components/CustomScrollbar/CustomScrollbar.tsx"),E=e("./src/components/IconButton/IconButton.tsx"),O=Object.defineProperty,m=Object.defineProperties,w=Object.getOwnPropertyDescriptors,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(me,ne,Z)=>ne in me?O(me,ne,{enumerable:!0,configurable:!0,writable:!0,value:Z}):me[ne]=Z,v=(me,ne)=>{for(var Z in ne||(ne={}))C.call(ne,Z)&&g(me,Z,ne[Z]);if(_)for(var Z of _(ne))b.call(ne,Z)&&g(me,Z,ne[Z]);return me},y=(me,ne)=>m(me,w(ne));function h({children:me,inline:ne=!1,onClose:Z,closeOnMaskClick:te=!0,scrollableContent:Pe=!1,title:he,subtitle:ie,width:Ce="40%",expandable:Le=!1,tabs:we}){const ue=(0,i.wW)(s),[Ie,qe]=(0,t.useState)(!1),[Je,Ze]=(0,t.useState)(!1),Oe=Ie?"100%":Ce,ce=t.useRef(null),{dialogProps:pe,titleProps:J}=(0,a.R)({},ce),{overlayProps:L}=(0,f.Ir)({isDismissable:!1,isOpen:Je,onClose:Z},ce);(0,t.useEffect)(()=>{Ze(!0)},[]);const fe=t.createElement("div",{className:ue.content},me),xe={};return ne&&(xe.position="absolute"),t.createElement(x.Z,{open:Je,onClose:Z,placement:"right",width:Oe,getContainer:ne?void 0:"body",style:xe,className:ue.drawerContent,rootClassName:ue.drawer,motion:{motionAppear:!0,motionName:ue.drawerMotion},maskClassName:ue.mask,maskClosable:te,maskMotion:{motionAppear:!0,motionName:ue.maskMotion}},t.createElement(l.MT,{restoreFocus:!0,contain:!0,autoFocus:!0},t.createElement("div",y(v(v({"aria-label":typeof he=="string"?d.wl.components.Drawer.General.title(he):d.wl.components.Drawer.General.title("no title"),className:ue.container},L),pe),{ref:ce}),typeof he=="string"&&t.createElement("div",{className:ue.header},t.createElement("div",{className:ue.actions},Le&&!Ie&&t.createElement(E.h,{name:"angle-left",size:"xl",onClick:()=>qe(!0),"aria-label":d.wl.components.Drawer.General.expand}),Le&&Ie&&t.createElement(E.h,{name:"angle-right",size:"xl",onClick:()=>qe(!1),"aria-label":d.wl.components.Drawer.General.contract}),t.createElement(E.h,{name:"times",size:"xl",onClick:Z,"aria-label":d.wl.components.Drawer.General.close})),t.createElement("div",{className:ue.titleWrapper},t.createElement("h3",v({},J),he),typeof ie=="string"&&t.createElement("div",{className:"muted"},ie),typeof ie!="string"&&ie,we&&t.createElement("div",{className:ue.tabsWrapper},we))),typeof he!="string"&&he,t.createElement("div",{className:ue.contentScroll},Pe?t.createElement(c.$,{autoHeightMin:"100%"},fe):fe))))}const s=me=>({container:n.iv`
      display: flex;
      flex-direction: column;
      height: 100%;
      flex: 1 1 0;
    `,drawer:n.iv`
      .rc-drawer-content-wrapper {
        box-shadow: ${me.shadows.z3};

        ${me.breakpoints.down("sm")} {
          width: 100% !important;
        }
      }
    `,drawerContent:n.iv`
      background-color: ${me.colors.background.primary} !important;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      z-index: ${me.zIndex.dropdown};
    `,drawerMotion:n.iv`
      &-appear {
        transform: translateX(100%);
        transition: none !important;

        &-active {
          transition: ${me.transitions.create("transform")} !important;
          transform: translateX(0);
        }
      }
    `,mask:n.iv`
      background-color: ${me.components.overlay.background} !important;
      backdrop-filter: blur(1px);
    `,maskMotion:n.iv`
      &-appear {
        opacity: 0;

        &-active {
          opacity: 1;
          transition: ${me.transitions.create("opacity")};
        }
      }
    `,header:n.iv`
      background-color: ${me.colors.background.canvas};
      flex-grow: 0;
      padding-top: ${me.spacing(.5)};
    `,actions:n.iv`
      display: flex;
      align-items: baseline;
      justify-content: flex-end;
    `,titleWrapper:n.iv`
      margin-bottom: ${me.spacing(3)};
      padding: ${me.spacing(0,1,0,3)};
      overflow-wrap: break-word;
    `,content:(0,n.iv)({padding:me.spacing(2),height:"100%",flexGrow:1}),contentScroll:(0,n.iv)({minHeight:0,flex:1}),tabsWrapper:(0,n.iv)({paddingLeft:me.spacing(2),margin:me.spacing(3,-1,-3,-3)})});try{h.displayName="Drawer",h.__docgenInfo={description:"",displayName:"Drawer",props:{title:{defaultValue:null,description:"Title shown at the top of the drawer",name:"title",required:!1,type:{name:"ReactNode"}},subtitle:{defaultValue:null,description:"Subtitle shown below the title",name:"subtitle",required:!1,type:{name:"ReactNode"}},closeOnMaskClick:{defaultValue:{value:"true"},description:"Should the Drawer be closable by clicking on the mask, defaults to true",name:"closeOnMaskClick",required:!1,type:{name:"boolean"}},inline:{defaultValue:{value:"false"},description:"Render the drawer inside a container on the page",name:"inline",required:!1,type:{name:"boolean"}},width:{defaultValue:{value:"40%"},description:"Either a number in px or a string with unit postfix",name:"width",required:!1,type:{name:"string | number"}},expandable:{defaultValue:{value:"false"},description:"Should the Drawer be expandable to full width",name:"expandable",required:!1,type:{name:"boolean"}},tabs:{defaultValue:null,description:"Tabs",name:"tabs",required:!1,type:{name:"ReactNode"}},scrollableContent:{defaultValue:{value:"false"},description:"Set to true if the component rendered within in drawer content has its own scroll",name:"scrollableContent",required:!1,type:{name:"boolean"}},onClose:{defaultValue:null,description:"Callback for closing the drawer",name:"onClose",required:!0,type:{name:"() => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Drawer/Drawer.tsx#Drawer"]={docgenInfo:h.__docgenInfo,name:"Drawer",path:"src/components/Drawer/Drawer.tsx#Drawer"})}catch(me){}var o=e("./src/components/Button/Button.tsx"),r=e("./src/components/Tabs/TabsBar.tsx"),u=e("./src/components/Tabs/Tab.tsx"),p=e("./src/utils/storybook/withCenteredStory.tsx"),S=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),k=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),D=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function M(me){const ne=Object.assign({h1:"h1",h3:"h3",p:"p",a:"a",pre:"pre",code:"code"},(0,k.ah)(),me.components);return(0,S.jsxs)(S.Fragment,{children:[(0,S.jsx)(D.h_,{title:"MDX|Drawer",component:h}),`
`,(0,S.jsx)(ne.h1,{children:"Drawer"}),`
`,(0,S.jsx)(ne.h3,{children:"When to use"}),`
`,(0,S.jsx)(ne.p,{children:"Drawer is a slide in overlay that can be used to display additional information without hiding the main page content. It can be anchored to the left or right edge of the screen."}),`
`,(0,S.jsxs)(ne.p,{children:["One example of the Drawer in use is in Grafana's ",(0,S.jsx)(ne.a,{href:"https://grafana.com/docs/grafana/latest/panels/inspect-panel/",children:"panel inspector"}),"."]}),`
`,(0,S.jsx)(ne.h3,{children:"Usage"}),`
`,(0,S.jsx)(ne.pre,{children:(0,S.jsx)(ne.code,{className:"language-tsx",children:`import { Drawer } from '@grafana/ui';

onClose = () => {
  // handle the show or hide Drawer logic
};

return (
  <Drawer title="This a Drawer" width="60%" onClose={this.onClose}>
    <div>Put your Drawer content here</div>
  </Drawer>
);
`})}),`
`,(0,S.jsx)(D.xP,{of:h})]})}function I(me={}){const{wrapper:ne}=Object.assign({},(0,k.ah)(),me.components);return ne?(0,S.jsx)(ne,Object.assign({},me,{children:(0,S.jsx)(M,me)})):M(me)}var T=I,j=Object.defineProperty,K=Object.defineProperties,F=Object.getOwnPropertyDescriptors,$=Object.getOwnPropertySymbols,R=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable,H=(me,ne,Z)=>ne in me?j(me,ne,{enumerable:!0,configurable:!0,writable:!0,value:Z}):me[ne]=Z,W=(me,ne)=>{for(var Z in ne||(ne={}))R.call(ne,Z)&&H(me,Z,ne[Z]);if($)for(var Z of $(ne))U.call(ne,Z)&&H(me,Z,ne[Z]);return me},oe=(me,ne)=>K(me,F(ne)),Q=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React, { useState } from 'react';

import { Button, Drawer, Tab, TabsBar } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './Drawer.mdx';

const meta: ComponentMeta<typeof Drawer> = {
  title: 'Overlays/Drawer',
  component: Drawer,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['onClose', 'tabs'],
    },
  },
  args: {
    closeOnMaskClick: true,
    scrollableContent: false,
    width: '40%',
    expandable: false,
    subtitle: 'This is a subtitle.',
  },
  argTypes: {
    title: { control: { type: 'text' } },
    width: { control: { type: 'text' } },
    subtitle: { control: { type: 'text' } },
  },
};

export const Global: ComponentStory<typeof Drawer> = (args) => {
  const [isOpen, setIsOpen] = useState(false);
  return (
    <>
      <Button onClick={() => setIsOpen(true)}>Open drawer</Button>
      {isOpen && (
        <Drawer {...args} onClose={() => setIsOpen(false)}>
          <div style={{ padding: '10px' }}>
            <ul>
              <li>this</li>
              <li>is</li>
              <li>a</li>
              <li>list</li>
              <li>of</li>
              <li>menu</li>
              <li>items</li>
            </ul>
          </div>
        </Drawer>
      )}
    </>
  );
};

Global.args = {
  title: 'Drawer title',
};

export const LongContent: ComponentStory<typeof Drawer> = (args) => {
  const [isOpen, setIsOpen] = useState(false);
  return (
    <>
      <Button onClick={() => setIsOpen(true)}>Open drawer</Button>
      {isOpen && (
        <Drawer {...args} onClose={() => setIsOpen(false)}>
          <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
            dolore magna aliqua. Iaculis nunc sed augue lacus viverra vitae. Malesuada pellentesque elit eget gravida
            cum sociis. Pretium vulputate sapien nec sagittis aliquam malesuada bibendum arcu. Cras adipiscing enim eu
            turpis egestas. Ut lectus arcu bibendum at varius. Nulla pellentesque dignissim enim sit amet venenatis
            urna. Tempus urna et pharetra pharetra massa massa ultricies mi quis. Vitae congue mauris rhoncus aenean.
            Enim ut tellus elementum sagittis vitae et.
          </p>
          <p>
            Arcu non odio euismod lacinia at quis risus sed vulputate. Sit amet consectetur adipiscing elit ut. Dictum
            fusce ut placerat orci nulla pellentesque dignissim. Lectus nulla at volutpat diam ut venenatis tellus. Sed
            cras ornare arcu dui. Eget mauris pharetra et ultrices neque ornare aenean euismod. Mi quis hendrerit dolor
            magna. Commodo viverra maecenas accumsan lacus vel facilisis. Eget mi proin sed libero enim sed. Magna ac
            placerat vestibulum lectus mauris ultrices eros in. Mattis nunc sed blandit libero volutpat.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
        </Drawer>
      )}
    </>
  );
};
LongContent.args = {
  title: 'Drawer title with long content',
};

export const InLine: ComponentStory<typeof Drawer> = (args) => {
  const [isOpen, setIsOpen] = useState(false);
  return (
    <>
      <div
        style={{
          height: '300px',
          width: '500px',
          border: '1px solid white',
          position: 'relative',
          overflow: 'hidden',
        }}
      >
        <Button onClick={() => setIsOpen(true)}>Open drawer</Button>
        {isOpen && (
          <Drawer {...args} onClose={() => setIsOpen(false)}>
            <ul>
              <li>this</li>
              <li>is</li>
              <li>a</li>
              <li>list</li>
              <li>of</li>
              <li>menu</li>
              <li>items</li>
            </ul>
          </Drawer>
        )}
      </div>
    </>
  );
};
InLine.args = {
  title: 'Drawer title inline',
  inline: true,
};

export const WithTabs: ComponentStory<typeof Drawer> = (args) => {
  const [isOpen, setIsOpen] = useState(false);
  const [activeTab, setActiveTab] = useState('options');

  const tabs = (
    <TabsBar>
      <Tab label={'Options'} active={activeTab === 'options'} onChangeTab={() => setActiveTab('options')} />
      <Tab
        label={'Changes'}
        active={activeTab === 'changes'}
        onChangeTab={() => setActiveTab('changes')}
        counter={10}
      />
    </TabsBar>
  );

  return (
    <>
      <Button onClick={() => setIsOpen(true)}>Open drawer</Button>
      {isOpen && (
        <Drawer {...args} tabs={tabs} onClose={() => setIsOpen(false)}>
          {activeTab === 'options' && <div>Here are some options</div>}
          {activeTab === 'changes' && <div>Here are some changes</div>}
        </Drawer>
      )}
    </>
  );
};
WithTabs.args = {
  title: 'Drawer title with tabs',
};

export default meta;
`,P={Global:{startLoc:{col:53,line:36},endLoc:{col:1,line:58},startBody:{col:53,line:36},endBody:{col:1,line:58}},LongContent:{startLoc:{col:58,line:64},endLoc:{col:1,line:140},startBody:{col:58,line:64},endBody:{col:1,line:140}},InLine:{startLoc:{col:53,line:145},endLoc:{col:1,line:175},startBody:{col:53,line:145},endBody:{col:1,line:175}},WithTabs:{startLoc:{col:55,line:181},endLoc:{col:1,line:208},startBody:{col:55,line:181},endBody:{col:1,line:208}}};const ae={title:"Overlays/Drawer",component:h,decorators:[p.BU],parameters:{docs:{page:T},controls:{exclude:["onClose","tabs"]}},args:{closeOnMaskClick:!0,scrollableContent:!1,width:"40%",expandable:!1,subtitle:"This is a subtitle."},argTypes:{title:{control:{type:"text"}},width:{control:{type:"text"}},subtitle:{control:{type:"text"}}}},q=me=>{const[ne,Z]=(0,t.useState)(!1);return t.createElement(t.Fragment,null,t.createElement(o.zx,{onClick:()=>Z(!0)},"Open drawer"),ne&&t.createElement(h,oe(W({},me),{onClose:()=>Z(!1)}),t.createElement("div",{style:{padding:"10px"}},t.createElement("ul",null,t.createElement("li",null,"this"),t.createElement("li",null,"is"),t.createElement("li",null,"a"),t.createElement("li",null,"list"),t.createElement("li",null,"of"),t.createElement("li",null,"menu"),t.createElement("li",null,"items")))))};q.args={title:"Drawer title"};const Y=me=>{const[ne,Z]=(0,t.useState)(!1);return t.createElement(t.Fragment,null,t.createElement(o.zx,{onClick:()=>Z(!0)},"Open drawer"),ne&&t.createElement(h,oe(W({},me),{onClose:()=>Z(!1)}),t.createElement("p",null,"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Iaculis nunc sed augue lacus viverra vitae. Malesuada pellentesque elit eget gravida cum sociis. Pretium vulputate sapien nec sagittis aliquam malesuada bibendum arcu. Cras adipiscing enim eu turpis egestas. Ut lectus arcu bibendum at varius. Nulla pellentesque dignissim enim sit amet venenatis urna. Tempus urna et pharetra pharetra massa massa ultricies mi quis. Vitae congue mauris rhoncus aenean. Enim ut tellus elementum sagittis vitae et."),t.createElement("p",null,"Arcu non odio euismod lacinia at quis risus sed vulputate. Sit amet consectetur adipiscing elit ut. Dictum fusce ut placerat orci nulla pellentesque dignissim. Lectus nulla at volutpat diam ut venenatis tellus. Sed cras ornare arcu dui. Eget mauris pharetra et ultrices neque ornare aenean euismod. Mi quis hendrerit dolor magna. Commodo viverra maecenas accumsan lacus vel facilisis. Eget mi proin sed libero enim sed. Magna ac placerat vestibulum lectus mauris ultrices eros in. Mattis nunc sed blandit libero volutpat."),t.createElement("p",null,"Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit. Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat. Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam. Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo."),t.createElement("p",null,"Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit. Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat. Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam. Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo."),t.createElement("p",null,"Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit. Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat. Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam. Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo."),t.createElement("p",null,"Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit. Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat. Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam. Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo."),t.createElement("p",null,"Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit. Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat. Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam. Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.")))};Y.args={title:"Drawer title with long content"};const ve=me=>{const[ne,Z]=(0,t.useState)(!1);return t.createElement(t.Fragment,null,t.createElement("div",{style:{height:"300px",width:"500px",border:"1px solid white",position:"relative",overflow:"hidden"}},t.createElement(o.zx,{onClick:()=>Z(!0)},"Open drawer"),ne&&t.createElement(h,oe(W({},me),{onClose:()=>Z(!1)}),t.createElement("ul",null,t.createElement("li",null,"this"),t.createElement("li",null,"is"),t.createElement("li",null,"a"),t.createElement("li",null,"list"),t.createElement("li",null,"of"),t.createElement("li",null,"menu"),t.createElement("li",null,"items")))))};ve.args={title:"Drawer title inline",inline:!0};const re=me=>{const[ne,Z]=(0,t.useState)(!1),[te,Pe]=(0,t.useState)("options"),he=t.createElement(r.J,null,t.createElement(u.O,{label:"Options",active:te==="options",onChangeTab:()=>Pe("options")}),t.createElement(u.O,{label:"Changes",active:te==="changes",onChangeTab:()=>Pe("changes"),counter:10}));return t.createElement(t.Fragment,null,t.createElement(o.zx,{onClick:()=>Z(!0)},"Open drawer"),ne&&t.createElement(h,oe(W({},me),{tabs:he,onClose:()=>Z(!1)}),te==="options"&&t.createElement("div",null,"Here are some options"),te==="changes"&&t.createElement("div",null,"Here are some changes")))};re.args={title:"Drawer title with tabs"};var je=ae;q.parameters=W({storySource:{source:`(args) => {
  const [isOpen, setIsOpen] = useState(false);
  return (
    <>
      <Button onClick={() => setIsOpen(true)}>Open drawer</Button>
      {isOpen && (
        <Drawer {...args} onClose={() => setIsOpen(false)}>
          <div style={{ padding: '10px' }}>
            <ul>
              <li>this</li>
              <li>is</li>
              <li>a</li>
              <li>list</li>
              <li>of</li>
              <li>menu</li>
              <li>items</li>
            </ul>
          </div>
        </Drawer>
      )}
    </>
  );
}`}},q.parameters),Y.parameters=W({storySource:{source:`(args) => {
  const [isOpen, setIsOpen] = useState(false);
  return (
    <>
      <Button onClick={() => setIsOpen(true)}>Open drawer</Button>
      {isOpen && (
        <Drawer {...args} onClose={() => setIsOpen(false)}>
          <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
            dolore magna aliqua. Iaculis nunc sed augue lacus viverra vitae. Malesuada pellentesque elit eget gravida
            cum sociis. Pretium vulputate sapien nec sagittis aliquam malesuada bibendum arcu. Cras adipiscing enim eu
            turpis egestas. Ut lectus arcu bibendum at varius. Nulla pellentesque dignissim enim sit amet venenatis
            urna. Tempus urna et pharetra pharetra massa massa ultricies mi quis. Vitae congue mauris rhoncus aenean.
            Enim ut tellus elementum sagittis vitae et.
          </p>
          <p>
            Arcu non odio euismod lacinia at quis risus sed vulputate. Sit amet consectetur adipiscing elit ut. Dictum
            fusce ut placerat orci nulla pellentesque dignissim. Lectus nulla at volutpat diam ut venenatis tellus. Sed
            cras ornare arcu dui. Eget mauris pharetra et ultrices neque ornare aenean euismod. Mi quis hendrerit dolor
            magna. Commodo viverra maecenas accumsan lacus vel facilisis. Eget mi proin sed libero enim sed. Magna ac
            placerat vestibulum lectus mauris ultrices eros in. Mattis nunc sed blandit libero volutpat.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
          <p>
            Cursus in hac habitasse platea dictumst quisque sagittis purus. Viverra adipiscing at in tellus. Semper eget
            duis at tellus at urna condimentum. Egestas fringilla phasellus faucibus scelerisque eleifend. Sem nulla
            pharetra diam sit amet nisl. Ut ornare lectus sit amet est placerat in egestas erat. Id neque aliquam
            vestibulum morbi blandit cursus risus. In iaculis nunc sed augue. Eu volutpat odio facilisis mauris sit.
            Quisque egestas diam in arcu cursus euismod. At quis risus sed vulputate odio ut enim blandit volutpat.
            Cursus risus at ultrices mi tempus imperdiet nulla malesuada. Sed adipiscing diam donec adipiscing tristique
            risus nec. Id neque aliquam vestibulum morbi. Pretium nibh ipsum consequat nisl vel pretium lectus quam.
            Platea dictumst quisque sagittis purus sit. Nascetur ridiculus mus mauris vitae ultricies leo.
          </p>
        </Drawer>
      )}
    </>
  );
}`}},Y.parameters),ve.parameters=W({storySource:{source:`(args) => {
  const [isOpen, setIsOpen] = useState(false);
  return (
    <>
      <div
        style={{
          height: '300px',
          width: '500px',
          border: '1px solid white',
          position: 'relative',
          overflow: 'hidden',
        }}
      >
        <Button onClick={() => setIsOpen(true)}>Open drawer</Button>
        {isOpen && (
          <Drawer {...args} onClose={() => setIsOpen(false)}>
            <ul>
              <li>this</li>
              <li>is</li>
              <li>a</li>
              <li>list</li>
              <li>of</li>
              <li>menu</li>
              <li>items</li>
            </ul>
          </Drawer>
        )}
      </div>
    </>
  );
}`}},ve.parameters),re.parameters=W({storySource:{source:`(args) => {
  const [isOpen, setIsOpen] = useState(false);
  const [activeTab, setActiveTab] = useState('options');

  const tabs = (
    <TabsBar>
      <Tab label={'Options'} active={activeTab === 'options'} onChangeTab={() => setActiveTab('options')} />
      <Tab
        label={'Changes'}
        active={activeTab === 'changes'}
        onChangeTab={() => setActiveTab('changes')}
        counter={10}
      />
    </TabsBar>
  );

  return (
    <>
      <Button onClick={() => setIsOpen(true)}>Open drawer</Button>
      {isOpen && (
        <Drawer {...args} tabs={tabs} onClose={() => setIsOpen(false)}>
          {activeTab === 'options' && <div>Here are some options</div>}
          {activeTab === 'changes' && <div>Here are some changes</div>}
        </Drawer>
      )}
    </>
  );
}`}},re.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Drawer/Drawer.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Drawer/Drawer.story.tsx#ComponentMeta"})}catch(me){}},"./src/components/Dropdown/Dropdown.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Examples:function(){return r},default:function(){return u}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/StoryExample.tsx"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/components/Button/Button.tsx"),f=e("./src/components/Layout/Layout.tsx"),x=e("./src/components/Menu/Menu.tsx"),d=e("./src/components/Dropdown/Dropdown.tsx"),i=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),c=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),E=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function O(p){const S=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,c.ah)(),p.components);return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(E.h_,{title:"MDX|Dropdown",component:d.L}),`
`,(0,i.jsx)(S.h1,{children:"Dropdown"}),`
`,(0,i.jsx)(S.p,{children:"Hook up a menu or other overlay to any trigger."}),`
`,(0,i.jsx)(S.h3,{children:"When to use"}),`
`,(0,i.jsx)(S.p,{children:`When you want a button, link or icon button to open a Menu or Popover. By default the trigger is click but it can be changed to show on hover using the
trigger property.`}),`
`,(0,i.jsx)(S.h3,{children:"Usage"}),`
`,(0,i.jsx)(S.pre,{children:(0,i.jsx)(S.code,{className:"language-tsx",children:`import { Dropdown, Menu, Button } from '@grafana/ui';

const menu = (
  <Menu>
    <Menu.Item label="Google" />
    <Menu.Item label="Filter" />
  </Menu>
);

return (
  <Dropdown overlay={menu}>
    <Button icon="bars" />
  </Dropdown>
);
`})}),`
`,(0,i.jsx)(E.xP,{of:d.L})]})}function m(p={}){const{wrapper:S}=Object.assign({},(0,c.ah)(),p.components);return S?(0,i.jsx)(S,Object.assign({},p,{children:(0,i.jsx)(O,p)})):O(p)}var w=m,_=Object.defineProperty,C=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,v=(p,S,k)=>S in p?_(p,S,{enumerable:!0,configurable:!0,writable:!0,value:k}):p[S]=k,y=(p,S)=>{for(var k in S||(S={}))b.call(S,k)&&v(p,k,S[k]);if(C)for(var k of C(S))g.call(S,k)&&v(p,k,S[k]);return p},h=null,s={Examples:{startLoc:{col:7,line:27},endLoc:{col:1,line:51},startBody:{col:7,line:27},endBody:{col:1,line:51}}};const o={title:"Overlays/Dropdown",component:d.L,decorators:[a.BU],parameters:{docs:{page:w},controls:{exclude:["className"]}}},r=function(){const S=t.createElement(x.v,null,t.createElement(x.v.Item,{label:"View settings"}),t.createElement(x.v.Item,{label:"Edit actions"}),t.createElement(x.v.Item,{label:"Share"}),t.createElement(x.v.Item,{label:"Delete"}));return t.createElement(f.wc,null,t.createElement(n.E,{name:"Button + defaults"},t.createElement(d.L,{overlay:S},t.createElement(l.zx,{variant:"secondary"},"Button"))),t.createElement(n.E,{name:"Icon button, placement=bottom-start"},t.createElement(d.L,{overlay:S,placement:"bottom-start"},t.createElement(l.zx,{variant:"secondary",icon:"bars"}))))};r.parameters={controls:{hideNoControlsWarning:!0,include:[]}};var u=o;r.parameters=y({storySource:{source:`function Examples() {
  const menu = (
    <Menu>
      <Menu.Item label="View settings" />
      <Menu.Item label="Edit actions" />
      <Menu.Item label="Share" />
      <Menu.Item label="Delete" />
    </Menu>
  );

  return (
    <VerticalGroup>
      <StoryExample name="Button + defaults">
        <Dropdown overlay={menu}>
          <Button variant="secondary">Button</Button>
        </Dropdown>
      </StoryExample>
      <StoryExample name="Icon button, placement=bottom-start">
        <Dropdown overlay={menu} placement="bottom-start">
          <Button variant="secondary" icon="bars" />
        </Dropdown>
      </StoryExample>
    </VerticalGroup>
  );
}`}},r.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Dropdown/Dropdown.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Dropdown/Dropdown.story.tsx#ComponentMeta"})}catch(p){}},"./src/components/EmptySearchResult/EmptySearchResult.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return o},default:function(){return r}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),l=e("./src/themes/ThemeContext.tsx");const f=({children:u})=>{const p=(0,l.wW)(x);return t.createElement("div",{className:p.container},u)},x=u=>({container:a.iv`
      border-left: 3px solid ${u.colors.info.main};
      background-color: ${u.colors.background.secondary};
      padding: ${u.spacing(2)};
      min-width: 350px;
      border-radius: ${u.shape.radius.default};
      margin-bottom: ${u.spacing(4)};
    `});try{f.displayName="EmptySearchResult",f.__docgenInfo={description:"",displayName:"EmptySearchResult",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/EmptySearchResult/EmptySearchResult.tsx#EmptySearchResult"]={docgenInfo:f.__docgenInfo,name:"EmptySearchResult",path:"src/components/EmptySearchResult/EmptySearchResult.tsx#EmptySearchResult"})}catch(u){}var d=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),i=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),c=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function E(u){const p=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,i.ah)(),u.components);return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(p.h1,{children:"EmptySearchResult"}),`
`,(0,d.jsx)(p.p,{children:"A styled container for a message, displayed when no search results are found. Used in the visualizations search, among others."}),`
`,(0,d.jsx)(p.h3,{children:"Usage"}),`
`,(0,d.jsx)(p.pre,{children:(0,d.jsx)(p.code,{className:"language-jsx",children:`import { EmptySearchResult } from '@grafana/ui';

<EmptySearchResult>Could not find anything matching your query</EmptySearchResult>;
`})}),`
`,(0,d.jsx)(p.h3,{children:"Props"}),`
`,(0,d.jsx)(c.$4,{of:f})]})}function O(u={}){const{wrapper:p}=Object.assign({},(0,i.ah)(),u.components);return p?(0,d.jsx)(p,Object.assign({},u,{children:(0,d.jsx)(E,u)})):E(u)}var m=O,w=Object.defineProperty,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(u,p,S)=>p in u?w(u,p,{enumerable:!0,configurable:!0,writable:!0,value:S}):u[p]=S,v=(u,p)=>{for(var S in p||(p={}))C.call(p,S)&&g(u,S,p[S]);if(_)for(var S of _(p))b.call(p,S)&&g(u,S,p[S]);return u},y=`import { ComponentMeta } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '@grafana/ui/src/utils/storybook/withCenteredStory';

import { EmptySearchResult } from './EmptySearchResult';
import mdx from './EmptySearchResult.mdx';

const meta: ComponentMeta<typeof EmptySearchResult> = {
  title: 'Visualizations/EmptySearchResult',
  component: EmptySearchResult,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

export const Basic = () => {
  return <EmptySearchResult>Could not find anything matching your query</EmptySearchResult>;
};

export default meta;
`,h={Basic:{startLoc:{col:21,line:20},endLoc:{col:1,line:22},startBody:{col:21,line:20},endBody:{col:1,line:22}}};const s={title:"Visualizations/EmptySearchResult",component:f,decorators:[n.BU],parameters:{docs:{page:m}}},o=()=>t.createElement(f,null,"Could not find anything matching your query");var r=s;o.parameters=v({storySource:{source:`() => {
  return <EmptySearchResult>Could not find anything matching your query</EmptySearchResult>;
}`}},o.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/EmptySearchResult/EmptySearchResult.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/EmptySearchResult/EmptySearchResult.story.tsx#ComponentMeta"})}catch(u){}},"./src/components/ErrorBoundary/ErrorBoundary.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return K},BoundaryAlert:function(){return $},WithStack:function(){return F},default:function(){return R}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/Alert/Alert.tsx"),l=e("./src/components/Button/Button.tsx"),f=e("../../../yarn/cache/@sentry-minimal-npm-6.19.7-7527a9814c-9153ac426e.zip/node_modules/@sentry/minimal/esm/index.js"),x=e("../../../yarn/cache/@grafana-faro-core-npm-1.0.2-cf380fd4b8-09c3c6687b.zip/node_modules/@grafana/faro-core/dist/esm/sdk/registerFaro.js"),d=e("./src/components/ErrorBoundary/ErrorWithStack.tsx"),i=Object.defineProperty,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(U,H,W)=>H in U?i(U,H,{enumerable:!0,configurable:!0,writable:!0,value:W}):U[H]=W,w=(U,H)=>{for(var W in H||(H={}))E.call(H,W)&&m(U,W,H[W]);if(c)for(var W of c(H))O.call(H,W)&&m(U,W,H[W]);return U};class _ extends t.PureComponent{constructor(){super(...arguments),this.state={error:null,errorInfo:null}}componentDidCatch(H,W){var oe,Q;(0,f.Tb)(H,{contexts:{react:{componentStack:W.componentStack}}}),(Q=(oe=x.s)==null?void 0:oe.api)==null||Q.pushError(H),this.setState({error:H,errorInfo:W}),this.props.onError&&this.props.onError(H)}componentDidUpdate(H){const{dependencies:W,onRecover:oe}=this.props;if(this.state.error&&W&&H.dependencies){for(let Q=0;Q<W.length;Q++)if(W[Q]!==H.dependencies[Q]){this.setState({error:null,errorInfo:null}),oe&&oe();break}}}render(){const{children:H}=this.props,{error:W,errorInfo:oe}=this.state;return H({error:W,errorInfo:oe})}}class C extends t.PureComponent{render(){const{title:H,children:W,style:oe,dependencies:Q}=this.props;return t.createElement(_,{dependencies:Q},({error:P,errorInfo:ae})=>ae?oe==="alertbox"?t.createElement(a.b,{title:H||""},t.createElement("details",{style:{whiteSpace:"pre-wrap"}},P&&P.toString(),t.createElement("br",null),ae.componentStack)):t.createElement(d.X,{title:H||"",error:P,errorInfo:ae}):W)}}C.defaultProps={title:"An unexpected error happened",style:"alertbox"};function b(U,H={}){const W=oe=>React.createElement(C,w({},H),React.createElement(U,w({},oe)));return W.displayName="WithErrorBoundary",W}try{b.displayName="withErrorBoundary",b.__docgenInfo={description:"HOC for wrapping a component in an error boundary.",displayName:"withErrorBoundary",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ErrorBoundary/ErrorBoundary.tsx#withErrorBoundary"]={docgenInfo:b.__docgenInfo,name:"withErrorBoundary",path:"src/components/ErrorBoundary/ErrorBoundary.tsx#withErrorBoundary"})}catch(U){}try{_.displayName="ErrorBoundary",_.__docgenInfo={description:"",displayName:"ErrorBoundary",props:{dependencies:{defaultValue:null,description:"Will re-render children after error if recover values changes",name:"dependencies",required:!1,type:{name:"unknown[]"}},onError:{defaultValue:null,description:"Callback called on error",name:"onError",required:!1,type:{name:"((error: Error) => void)"}},onRecover:{defaultValue:null,description:"Callback error state is cleared due to recover props change",name:"onRecover",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ErrorBoundary/ErrorBoundary.tsx#ErrorBoundary"]={docgenInfo:_.__docgenInfo,name:"ErrorBoundary",path:"src/components/ErrorBoundary/ErrorBoundary.tsx#ErrorBoundary"})}catch(U){}try{C.displayName="ErrorBoundaryAlert",C.__docgenInfo={description:"",displayName:"ErrorBoundaryAlert",props:{title:{defaultValue:{value:"An unexpected error happened"},description:"Title for the error boundary alert",name:"title",required:!1,type:{name:"string"}},children:{defaultValue:null,description:"Component to be wrapped with an error boundary",name:"children",required:!1,type:{name:"ReactNode"}},style:{defaultValue:{value:"alertbox"},description:"'page' will render full page error with stacktrace. 'alertbox' will render an <Alert />. Default 'alertbox'",name:"style",required:!1,type:{name:"enum",value:[{value:'"page"'},{value:'"alertbox"'}]}},dependencies:{defaultValue:null,description:"Will re-render children after error if recover values changes",name:"dependencies",required:!1,type:{name:"unknown[]"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ErrorBoundary/ErrorBoundary.tsx#ErrorBoundaryAlert"]={docgenInfo:C.__docgenInfo,name:"ErrorBoundaryAlert",path:"src/components/ErrorBoundary/ErrorBoundary.tsx#ErrorBoundaryAlert"})}catch(U){}var g=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),v=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),y=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function h(U){const H=Object.assign({h1:"h1",p:"p",a:"a",h3:"h3",pre:"pre",code:"code"},(0,v.ah)(),U.components);return(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(H.h1,{children:"ErrorBoundary"}),`
`,(0,g.jsxs)(H.p,{children:["A React component that catches errors in child components. Useful for logging or displaying a fallback UI in case of errors. More information about error boundaries is available at ",(0,g.jsx)(H.a,{href:"https://reactjs.org/docs/error-boundaries.html",children:"React documentation website"}),"."]}),`
`,(0,g.jsx)(H.h3,{children:"Usage"}),`
`,(0,g.jsx)(H.pre,{children:(0,g.jsx)(H.code,{className:"language-jsx",children:`import { ErrorBoundary, Alert } from '@grafana/ui';

<ErrorBoundary>
  {({ error }) => {
    if (error) {
      return <Alert title={error.message} />;
    }
    return <Component />;
  }}
</ErrorBoundary>;
`})}),`
`,(0,g.jsx)(H.h1,{children:"ErrorBoundaryAlert"}),`
`,(0,g.jsx)(H.p,{children:"An error boundary component with built-in alert to display in case of error."}),`
`,(0,g.jsx)(H.h3,{children:"Usage"}),`
`,(0,g.jsx)(H.pre,{children:(0,g.jsx)(H.code,{className:"language-jsx",children:`import { ErrorBoundaryAlert } from '@grafana/ui';

<ErrorBoundaryAlert>
  <Component />
</ErrorBoundaryAlert>;
`})}),`
`,(0,g.jsx)(H.h3,{children:"Props"}),`
`,(0,g.jsx)(y.$4,{of:C}),`
`,(0,g.jsx)(H.h1,{children:"ErrorWithStack"}),`
`,(0,g.jsx)(H.p,{children:"A component that displays error together with its stack trace."}),`
`,(0,g.jsx)(H.h3,{children:"Usage"}),`
`,(0,g.jsx)(H.pre,{children:(0,g.jsx)(H.code,{className:"language-jsx",children:`import { ErrorWithStack } from '@grafana/ui';

<ErrorWithStack error={new Error('Test error')} title={'Unexpected error'} errorInfo={null} />;
`})}),`
`,(0,g.jsx)(H.h3,{children:"Props"}),`
`,(0,g.jsx)(y.$4,{of:d.X}),`
`,(0,g.jsx)(H.h1,{children:"withErrorBoundary"}),`
`,(0,g.jsx)(H.p,{children:"a HOC to conveniently wrap component in an error boundary"}),`
`,(0,g.jsx)(H.h3,{children:"Usage"}),`
`,(0,g.jsx)(H.pre,{children:(0,g.jsx)(H.code,{className:"language-jsx",children:`import { withErrorBoundary } from '@grafana/ui';

interface MyCompProps {}

const MyComp = withErrorBoundary(
  (props: MyCompProps) => {
    return <>...</>;
  },
  { style: 'page' }
);
`})})]})}function s(U={}){const{wrapper:H}=Object.assign({},(0,v.ah)(),U.components);return H?(0,g.jsx)(H,Object.assign({},U,{children:(0,g.jsx)(h,U)})):h(U)}var o=s,r=Object.defineProperty,u=Object.getOwnPropertySymbols,p=Object.prototype.hasOwnProperty,S=Object.prototype.propertyIsEnumerable,k=(U,H,W)=>H in U?r(U,H,{enumerable:!0,configurable:!0,writable:!0,value:W}):U[H]=W,D=(U,H)=>{for(var W in H||(H={}))p.call(H,W)&&k(U,W,H[W]);if(u)for(var W of u(H))S.call(H,W)&&k(U,W,H[W]);return U},M=`import { ComponentMeta } from '@storybook/react';
import React, { useState } from 'react';

import { withCenteredStory } from '@grafana/ui/src/utils/storybook/withCenteredStory';

import { Alert } from '../Alert/Alert';
import { Button } from '../Button';

import { ErrorBoundary, ErrorBoundaryAlert } from './ErrorBoundary';
import mdx from './ErrorBoundary.mdx';
import { ErrorWithStack } from './ErrorWithStack';

const meta: ComponentMeta<typeof ErrorBoundary> = {
  title: 'General/ErrorBoundary',
  component: ErrorBoundary,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

const BuggyComponent = () => {
  const [count, setCount] = useState(0);

  if (count > 2) {
    throw new Error('Crashed');
  }

  return (
    <div>
      <p>Increase the count to 3 to trigger error</p>
      <Button onClick={() => setCount(count + 1)}>{count.toString()}</Button>
    </div>
  );
};

export const Basic = () => {
  return (
    <ErrorBoundary>
      {({ error }) => {
        if (error) {
          return <Alert title={error.message} />;
        }
        return <BuggyComponent />;
      }}
    </ErrorBoundary>
  );
};

export const WithStack = () => {
  return <ErrorWithStack error={new Error('Test error')} title={'Unexpected error'} errorInfo={null} />;
};

export const BoundaryAlert = () => {
  return (
    <ErrorBoundaryAlert>
      <BuggyComponent />
    </ErrorBoundaryAlert>
  );
};

export default meta;
`,I={Basic:{startLoc:{col:21,line:39},endLoc:{col:1,line:50},startBody:{col:21,line:39},endBody:{col:1,line:50}},WithStack:{startLoc:{col:25,line:52},endLoc:{col:1,line:54},startBody:{col:25,line:52},endBody:{col:1,line:54}},BoundaryAlert:{startLoc:{col:29,line:56},endLoc:{col:1,line:62},startBody:{col:29,line:56},endBody:{col:1,line:62}}};const T={title:"General/ErrorBoundary",component:_,decorators:[n.BU],parameters:{docs:{page:o}}},j=()=>{const[U,H]=(0,t.useState)(0);if(U>2)throw new Error("Crashed");return t.createElement("div",null,t.createElement("p",null,"Increase the count to 3 to trigger error"),t.createElement(l.zx,{onClick:()=>H(U+1)},U.toString()))},K=()=>t.createElement(_,null,({error:U})=>U?t.createElement(a.b,{title:U.message}):t.createElement(j,null)),F=()=>t.createElement(d.X,{error:new Error("Test error"),title:"Unexpected error",errorInfo:null}),$=()=>t.createElement(C,null,t.createElement(j,null));var R=T;K.parameters=D({storySource:{source:`() => {
  return (
    <ErrorBoundary>
      {({ error }) => {
        if (error) {
          return <Alert title={error.message} />;
        }
        return <BuggyComponent />;
      }}
    </ErrorBoundary>
  );
}`}},K.parameters),F.parameters=D({storySource:{source:`() => {
  return <ErrorWithStack error={new Error('Test error')} title={'Unexpected error'} errorInfo={null} />;
}`}},F.parameters),$.parameters=D({storySource:{source:`() => {
  return (
    <ErrorBoundaryAlert>
      <BuggyComponent />
    </ErrorBoundaryAlert>
  );
}`}},$.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ErrorBoundary/ErrorBoundary.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ErrorBoundary/ErrorBoundary.story.tsx#ComponentMeta"})}catch(U){}},"./src/components/FileDropzone/FileDropzone.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return Y},OnlyAcceptingCertainFiles:function(){return re},WithCustomFileList:function(){return ve},default:function(){return je}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),l=e("../../.yarn/__virtual__/react-dropzone-virtual-5036820731/2/yarn/cache/react-dropzone-npm-14.2.3-b5d5b11ea4-174b744d5c.zip/node_modules/react-dropzone/dist/es/index.js"),f=e("../../.yarn/__virtual__/react-dropzone-virtual-5036820731/2/yarn/cache/react-dropzone-npm-14.2.3-b5d5b11ea4-174b744d5c.zip/node_modules/react-dropzone/dist/es/utils/index.js"),x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/components/Alert/Alert.tsx"),c=e("./src/components/Icon/Icon.tsx"),E=e("./src/components/FileDropzone/FileListItem.tsx"),O=Object.defineProperty,m=Object.defineProperties,w=Object.getOwnPropertyDescriptors,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(me,ne,Z)=>ne in me?O(me,ne,{enumerable:!0,configurable:!0,writable:!0,value:Z}):me[ne]=Z,v=(me,ne)=>{for(var Z in ne||(ne={}))C.call(ne,Z)&&g(me,Z,ne[Z]);if(_)for(var Z of _(ne))b.call(ne,Z)&&g(me,Z,ne[Z]);return me},y=(me,ne)=>m(me,w(ne));function h({options:me,children:ne,readAs:Z,onLoad:te,fileListRenderer:Pe,onFileRemove:he}){const[ie,Ce]=(0,t.useState)([]),[Le,we]=(0,t.useState)([]),ue=(0,x.Cf)("decbytes")(me!=null&&me.maxSize?me==null?void 0:me.maxSize:0),Ie=(0,t.useCallback)((Ue,at)=>{Ce(it=>it.map(_t=>(_t.id===Ue.id&&at(_t),_t)))},[]),qe=(0,t.useCallback)((Ue,at,it)=>{let _t=Ue.map(S);if((me==null?void 0:me.multiple)===!1?Ce(_t):Ce(wt=>[...wt,..._t]),fe(at),me!=null&&me.onDrop)me.onDrop(Ue,at,it);else for(const wt of _t){const ee=new FileReader,_e=()=>{Z?ee[Z](wt.file):ee.readAsText(wt.file)};Ie(wt,ge=>{ge.abortUpload=()=>{ee.abort()},ge.retryUpload=()=>{Ie(wt,de=>{de.error=null,de.progress=void 0}),_e()}}),ee.onabort=()=>{Ie(wt,ge=>{ge.error=new DOMException("Aborted")})},ee.onprogress=ge=>{Ie(wt,de=>{de.progress=ge.loaded})},ee.onload=()=>{te==null||te(ee.result)},ee.onerror=()=>{Ie(wt,ge=>{ge.error=ee.error})},_e()}},[te,me,Z,Ie]),Je=Ue=>{const at=ie.filter(it=>Ue.id!==it.id);Ce(at),he==null||he(Ue)},{getRootProps:Ze,getInputProps:Oe,isDragActive:ce}=(0,l.uI)(y(v({},me),{useFsAccessApi:!1,onDrop:qe,accept:o(me==null?void 0:me.accept)})),pe=(0,d.l4)(),J=k(pe,ce),L=ie.map(Ue=>Pe?Pe(Ue,Je):t.createElement(E.K,{key:Ue.id,file:Ue,removeFile:Je})),fe=Ue=>{let at=[];Ue.map(it=>{it.errors.map(_t=>{at.findIndex(wt=>wt.code===_t.code&&wt.message===_t.message)===-1&&at.push(_t)})}),we(at)},xe=Ue=>t.createElement("div",{className:J.errorAlert},t.createElement(i.b,{title:"Upload failed",severity:"error",onRemove:We},Ue.map(at=>{switch(at.code){case f.jK.FileTooLarge:return t.createElement("div",{key:at.message+at.code},"File is larger than ",(0,x.zc)(ue));default:return t.createElement("div",{key:at.message+at.code},at.message)}}))),We=()=>{we([])};return t.createElement("div",{className:J.container},t.createElement("div",v({"data-testid":"dropzone"},Ze({className:J.dropzone})),t.createElement("input",v({},Oe())),ne!=null?ne:t.createElement(r,{primaryText:u(ie,me)})),Le.length>0&&xe(Le),t.createElement("div",{className:J.acceptContainer},(me==null?void 0:me.accept)&&t.createElement("small",{className:(0,n.cx)(J.small,J.acceptMargin,J.acceptedFiles)},p(me.accept)),(me==null?void 0:me.maxSize)&&t.createElement("small",{className:(0,n.cx)(J.small,J.acceptMargin)},`Max file size: ${(0,x.zc)(ue)}`)),L)}function s(me){return["txt","json","csv","xls","yml"].some(ne=>me.match(ne))?"text/plain":"application/octet-stream"}function o(me){return(0,a.isString)(me)?{[s(me)]:[me]}:Array.isArray(me)?me.reduce((ne,Z)=>{const te=s(Z);return ne[te]=ne[te]?[...ne[te],Z]:[Z],ne},{}):me}function r({primaryText:me="Upload file",secondaryText:ne="Drag and drop here or browse"}){const Z=(0,d.l4)(),te=k(Z);return t.createElement("div",{className:te.iconWrapper},t.createElement(c.J,{name:"upload",size:"xxl"}),t.createElement("h3",null,me),t.createElement("small",{className:te.small},ne))}function u(me,ne){return(ne==null?void 0:ne.multiple)===void 0||(ne==null?void 0:ne.multiple)?"Upload file":me.length?"Replace file":"Upload file"}function p(me){return(0,a.isString)(me)?`Accepted file type: ${me}`:Array.isArray(me)?`Accepted file types: ${me.join(", ")}`:`Accepted file types: ${Object.values(me).flat().join(", ")}`}function S(me){return{id:(0,a.uniqueId)("file"),file:me,error:null}}function k(me,ne){return{container:n.iv`
      display: flex;
      flex-direction: column;
      width: 100%;
    `,dropzone:n.iv`
      display: flex;
      flex: 1;
      flex-direction: column;
      align-items: center;
      padding: ${me.spacing(6)};
      border-radius: 2px;
      border: 2px dashed ${me.colors.border.medium};
      background-color: ${ne?me.colors.background.secondary:me.colors.background.primary};
      cursor: pointer;
    `,iconWrapper:n.iv`
      display: flex;
      flex-direction: column;
      align-items: center;
    `,acceptContainer:n.iv`
      display: flex;
    `,acceptedFiles:n.iv`
      flex-grow: 1;
    `,acceptMargin:n.iv`
      margin: ${me.spacing(2,0,1)};
    `,small:n.iv`
      color: ${me.colors.text.secondary};
    `,errorAlert:n.iv`
      padding-top: 10px;
    `}}try{h.displayName="FileDropzone",h.__docgenInfo={description:"",displayName:"FileDropzone",props:{children:{defaultValue:null,description:"Use the children property to have custom dropzone view.",name:"children",required:!1,type:{name:"ReactNode"}},options:{defaultValue:{value:`{
maxSize: Infinity,
minSize: 0,
multiple: true,
useFsAccessApi: false,
maxFiles: 0,
}`},description:"Use this property to override the default behaviour for the react-dropzone options.",name:"options",required:!1,type:{name:"BackwardsCompatibleDropzoneOptions"}},readAs:{defaultValue:null,description:"Use this to change the FileReader's read.",name:"readAs",required:!1,type:{name:"enum",value:[{value:'"readAsArrayBuffer"'},{value:'"readAsText"'},{value:'"readAsBinaryString"'},{value:'"readAsDataURL"'}]}},onLoad:{defaultValue:null,description:"Use the onLoad function to get the result from FileReader.",name:"onLoad",required:!1,type:{name:"((result: string | ArrayBuffer | null) => void)"}},fileListRenderer:{defaultValue:null,description:`The fileListRenderer property can be used to overwrite the list of files. To not to show
any list return null in the function.`,name:"fileListRenderer",required:!1,type:{name:"((file: DropzoneFile, removeFile: (file: DropzoneFile) => void) => ReactNode)"}},onFileRemove:{defaultValue:null,description:"",name:"onFileRemove",required:!1,type:{name:"((file: DropzoneFile) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileDropzone/FileDropzone.tsx#FileDropzone"]={docgenInfo:h.__docgenInfo,name:"FileDropzone",path:"src/components/FileDropzone/FileDropzone.tsx#FileDropzone"})}catch(me){}try{s.displayName="getMimeTypeByExtension",s.__docgenInfo={description:"",displayName:"getMimeTypeByExtension",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileDropzone/FileDropzone.tsx#getMimeTypeByExtension"]={docgenInfo:s.__docgenInfo,name:"getMimeTypeByExtension",path:"src/components/FileDropzone/FileDropzone.tsx#getMimeTypeByExtension"})}catch(me){}try{o.displayName="transformAcceptToNewFormat",o.__docgenInfo={description:"",displayName:"transformAcceptToNewFormat",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileDropzone/FileDropzone.tsx#transformAcceptToNewFormat"]={docgenInfo:o.__docgenInfo,name:"transformAcceptToNewFormat",path:"src/components/FileDropzone/FileDropzone.tsx#transformAcceptToNewFormat"})}catch(me){}try{r.displayName="FileDropzoneDefaultChildren",r.__docgenInfo={description:"",displayName:"FileDropzoneDefaultChildren",props:{primaryText:{defaultValue:{value:"Upload file"},description:"",name:"primaryText",required:!1,type:{name:"string"}},secondaryText:{defaultValue:{value:"Drag and drop here or browse"},description:"",name:"secondaryText",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileDropzone/FileDropzone.tsx#FileDropzoneDefaultChildren"]={docgenInfo:r.__docgenInfo,name:"FileDropzoneDefaultChildren",path:"src/components/FileDropzone/FileDropzone.tsx#FileDropzoneDefaultChildren"})}catch(me){}var D=e("./src/utils/storybook/withCenteredStory.tsx"),M=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),I=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),T=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function j(me){const ne=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,I.ah)(),me.components);return(0,M.jsxs)(M.Fragment,{children:[(0,M.jsx)(ne.h1,{children:"FileDropzone"}),`
`,(0,M.jsx)(ne.p,{children:"A dropzone component to use for file uploads."}),`
`,(0,M.jsx)(ne.h3,{children:"Usage"}),`
`,(0,M.jsx)(ne.pre,{children:(0,M.jsx)(ne.code,{className:"language-jsx",children:`import { FileDropzone } from '@grafana/ui';

<FileDropzone onLoad={(result) => console.log(result)} />;
`})}),`
`,(0,M.jsx)(ne.h3,{children:"Props"}),`
`,(0,M.jsx)(T.xP,{of:h})]})}function K(me={}){const{wrapper:ne}=Object.assign({},(0,I.ah)(),me.components);return ne?(0,M.jsx)(ne,Object.assign({},me,{children:(0,M.jsx)(j,me)})):j(me)}var F=K,$=Object.defineProperty,R=Object.getOwnPropertySymbols,U=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable,W=(me,ne,Z)=>ne in me?$(me,ne,{enumerable:!0,configurable:!0,writable:!0,value:Z}):me[ne]=Z,oe=(me,ne)=>{for(var Z in ne||(ne={}))U.call(ne,Z)&&W(me,Z,ne[Z]);if(R)for(var Z of R(ne))H.call(ne,Z)&&W(me,Z,ne[Z]);return me},Q=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { FileDropzone } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './FileDropzone.mdx';

const meta: ComponentMeta<typeof FileDropzone> = {
  title: 'Forms/FileDropzone',
  component: FileDropzone,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

const Template: ComponentStory<typeof FileDropzone> = (args) => <FileDropzone {...args} />;

export const Basic = Template.bind({});

export const WithCustomFileList = Template.bind({});
WithCustomFileList.args = {
  fileListRenderer: (file) => <div>Custom rendered item {file.file.name}</div>,
};

export const OnlyAcceptingCertainFiles = Template.bind({});
OnlyAcceptingCertainFiles.args = {
  options: { accept: { 'application/json': ['.json'] } },
};

export default meta;
`,P={Basic:{startLoc:{col:54,line:21},endLoc:{col:90,line:21},startBody:{col:54,line:21},endBody:{col:90,line:21}},WithCustomFileList:{startLoc:{col:54,line:21},endLoc:{col:90,line:21},startBody:{col:54,line:21},endBody:{col:90,line:21}},OnlyAcceptingCertainFiles:{startLoc:{col:54,line:21},endLoc:{col:90,line:21},startBody:{col:54,line:21},endBody:{col:90,line:21}}};const ae={title:"Forms/FileDropzone",component:h,decorators:[D.BU],parameters:{docs:{page:F}}},q=me=>t.createElement(h,oe({},me)),Y=q.bind({}),ve=q.bind({});ve.args={fileListRenderer:me=>t.createElement("div",null,"Custom rendered item ",me.file.name)};const re=q.bind({});re.args={options:{accept:{"application/json":[".json"]}}};var je=ae;Y.parameters=oe({storySource:{source:"(args) => <FileDropzone {...args} />"}},Y.parameters),ve.parameters=oe({storySource:{source:"(args) => <FileDropzone {...args} />"}},ve.parameters),re.parameters=oe({storySource:{source:"(args) => <FileDropzone {...args} />"}},re.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileDropzone/FileDropzone.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/FileDropzone/FileDropzone.story.tsx#ComponentMeta"})}catch(me){}},"./src/components/FileDropzone/FileListItem.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{FileListItem:function(){return y},default:function(){return h}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/FileDropzone/FileListItem.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function d(s){const o=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,f.ah)(),s.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(o.h1,{children:"FileListItem"}),`
`,(0,l.jsx)(o.p,{children:"A FileListItem component used for the FileDropzone component to show uploaded files."}),`
`,(0,l.jsx)(o.h3,{children:"Usage"}),`
`,(0,l.jsx)(o.pre,{children:(0,l.jsx)(o.code,{className:"language-jsx",children:`import { FileListItem } from '@grafana/ui';

<FileListItem file={{ file: { name: 'someFile.jpg', size: 12345 } }} />;
`})}),`
`,(0,l.jsx)(o.h3,{children:"Props"}),`
`,(0,l.jsx)(x.xP,{of:a.K})]})}function i(s={}){const{wrapper:o}=Object.assign({},(0,f.ah)(),s.components);return o?(0,l.jsx)(o,Object.assign({},s,{children:(0,l.jsx)(d,s)})):d(s)}var c=i,E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?E(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=`import { Meta, Story } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { FileListItem as FileListItemComponent, FileListItemProps } from './FileListItem';
import mdx from './FileListItem.mdx';

const meta: Meta = {
  title: 'Forms/FileListItem',
  component: FileListItemComponent,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
  argTypes: {
    abortUpload: { action: 'abortUpload' },
    retryUpload: { action: 'retryUpload' },
    removeFile: { action: 'removeFile' },
  },
  args: {
    file: { file: { name: 'some-file.jpg', size: 123456 }, id: '1', error: new DOMException('error') },
  },
};

export const FileListItem: Story<FileListItemProps> = (args) => {
  return <FileListItemComponent {...args} />;
};

export default meta;
`,g={FileListItem:{startLoc:{col:54,line:28},endLoc:{col:1,line:30},startBody:{col:54,line:28},endBody:{col:1,line:30}}};const v={title:"Forms/FileListItem",component:a.K,decorators:[n.BU],parameters:{docs:{page:c}},argTypes:{abortUpload:{action:"abortUpload"},retryUpload:{action:"retryUpload"},removeFile:{action:"removeFile"}},args:{file:{file:{name:"some-file.jpg",size:123456},id:"1",error:new DOMException("error")}}},y=s=>t.createElement(a.K,C({},s));var h=v;y.parameters=C({storySource:{source:`(args) => {
  return <FileListItemComponent {...args} />;
}`}},y.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileDropzone/FileListItem.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/FileDropzone/FileListItem.story.tsx#Meta"})}catch(s){}},"./src/components/FileUpload/FileUpload.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return D},default:function(){return M}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("../../../yarn/cache/uuid-npm-9.0.0-46c41e3e43-8dd2c83c43.zip/node_modules/uuid/dist/esm-browser/v4.js"),l=e("../grafana-e2e-selectors/src/selectors/index.ts"),f=e("./src/themes/ThemeContext.tsx"),x=e("./src/themes/mixins.ts"),d=e("./src/utils/file.ts"),i=e("./src/components/Button/Button.tsx"),c=e("./src/components/Icon/Icon.tsx");const E=({onFileUpload:I,className:T,children:j="Upload file",accept:K="*",size:F="md",showFileName:$})=>{const R=(0,f.wW)(O(F)),[U,H]=(0,t.useState)(""),W=(0,a.Z)(),oe=(0,t.useCallback)(Q=>{var P,ae,q;const Y=(ae=(P=Q.currentTarget)==null?void 0:P.files)==null?void 0:ae[0];Y&&H((q=Y.name)!=null?q:""),I(Q)},[I]);return t.createElement(t.Fragment,null,t.createElement("input",{type:"file",id:W,className:R.fileUpload,onChange:oe,multiple:!1,accept:K,"data-testid":l.wl.components.FileUpload.inputField}),t.createElement("label",{htmlFor:W,className:(0,n.cx)(R.labelWrapper,T)},t.createElement(c.J,{name:"upload",className:R.icon}),j),$&&U&&t.createElement("span",{"aria-label":"File name",className:R.fileName,"data-testid":l.wl.components.FileUpload.fileNameSpan},(0,d.O)(U)))},O=I=>T=>{const j=(0,i.fW)({theme:T,variant:"primary",size:I,iconOnly:!1}),K=(0,x.SV)(T);return{fileUpload:(0,n.iv)({height:"0.1px",opacity:"0",overflow:"hidden",position:"absolute",width:"0.1px",zIndex:-1,"&:focus + label":K,"&:focus-visible + label":K}),labelWrapper:j.button,icon:j.icon,fileName:(0,n.iv)({marginLeft:T.spacing(.5)})}};try{E.displayName="FileUpload",E.__docgenInfo={description:"",displayName:"FileUpload",props:{onFileUpload:{defaultValue:null,description:"Callback function to handle uploaded file",name:"onFileUpload",required:!0,type:{name:"(event: FormEvent<HTMLInputElement>) => void"}},accept:{defaultValue:{value:"*"},description:"Accepted file extensions",name:"accept",required:!1,type:{name:"string"}},className:{defaultValue:null,description:"Overwrite or add to style",name:"className",required:!1,type:{name:"string"}},size:{defaultValue:{value:"md"},description:"Button size",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'}]}},showFileName:{defaultValue:null,description:"Show the file name",name:"showFileName",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileUpload/FileUpload.tsx#FileUpload"]={docgenInfo:E.__docgenInfo,name:"FileUpload",path:"src/components/FileUpload/FileUpload.tsx#FileUpload"})}catch(I){}var m=e("./src/utils/storybook/withCenteredStory.tsx"),w=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),_=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),C=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function b(I){const T=Object.assign({h1:"h1",p:"p",code:"code",h3:"h3",pre:"pre"},(0,_.ah)(),I.components);return(0,w.jsxs)(w.Fragment,{children:[(0,w.jsx)(T.h1,{children:"FileUpload"}),`
`,(0,w.jsxs)(T.p,{children:["A button-styled input that triggers file upload popup. Button text and accepted file extensions can be customized via ",(0,w.jsx)(T.code,{children:"label"})," and ",(0,w.jsx)(T.code,{children:"accepted"})," props respectively."]}),`
`,(0,w.jsx)(T.h3,{children:"Usage"}),`
`,(0,w.jsx)(T.pre,{children:(0,w.jsx)(T.code,{className:"language-jsx",children:`import { FileUpload } from '@grafana/ui';

<FileUpload
  onFileUpload={({ currentTarget }) => console.log('file', currentTarget?.files && currentTarget.files[0])}
/>;
`})}),`
`,(0,w.jsx)(T.h3,{children:"Props"}),`
`,(0,w.jsx)(C.xP,{of:E})]})}function g(I={}){const{wrapper:T}=Object.assign({},(0,_.ah)(),I.components);return T?(0,w.jsx)(T,Object.assign({},I,{children:(0,w.jsx)(b,I)})):b(I)}var v=g,y=Object.defineProperty,h=Object.getOwnPropertySymbols,s=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,r=(I,T,j)=>T in I?y(I,T,{enumerable:!0,configurable:!0,writable:!0,value:j}):I[T]=j,u=(I,T)=>{for(var j in T||(T={}))s.call(T,j)&&r(I,j,T[j]);if(h)for(var j of h(T))o.call(T,j)&&r(I,j,T[j]);return I},p=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { FileUpload } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './FileUpload.mdx';

const meta: ComponentMeta<typeof FileUpload> = {
  title: 'Forms/FileUpload',
  component: FileUpload,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['className', 'onFileUpload'],
    },
  },
  argTypes: {
    size: {
      control: {
        type: 'select',
      },
      options: ['xs', 'sm', 'md', 'lg'],
    },
  },
};

export const Basic: ComponentStory<typeof FileUpload> = (args) => {
  return (
    <FileUpload
      size={args.size}
      onFileUpload={({ currentTarget }) => console.log('file', currentTarget?.files && currentTarget.files[0])}
    />
  );
};
Basic.args = {
  size: 'md',
};

export default meta;
`,S={Basic:{startLoc:{col:56,line:32},endLoc:{col:1,line:39},startBody:{col:56,line:32},endBody:{col:1,line:39}}};const k={title:"Forms/FileUpload",component:E,decorators:[m.BU],parameters:{docs:{page:v},controls:{exclude:["className","onFileUpload"]}},argTypes:{size:{control:{type:"select"},options:["xs","sm","md","lg"]}}},D=I=>t.createElement(E,{size:I.size,onFileUpload:({currentTarget:T})=>console.log("file",(T==null?void 0:T.files)&&T.files[0])});D.args={size:"md"};var M=k;D.parameters=u({storySource:{source:`(args) => {
  return (
    <FileUpload
      size={args.size}
      onFileUpload={({ currentTarget }) => console.log('file', currentTarget?.files && currentTarget.files[0])}
    />
  );
}`}},D.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileUpload/FileUpload.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/FileUpload/FileUpload.story.tsx#ComponentMeta"})}catch(I){}},"./src/components/FilterPill/FilterPill.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return S},Example:function(){return k},default:function(){return D}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/types/icon.ts"),l=e("./src/components/Layout/Layout.tsx"),f=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/components/Button/Button.tsx"),i=e("./src/components/Icon/Icon.tsx");const c=({label:M,selected:I,onClick:T,icon:j="check"})=>{const K=(0,x.wW)(E),F=(0,x.wW)(d.gN);return t.createElement("button",{type:"button",className:(0,f.cx)(F,K.wrapper,I&&K.selected),onClick:T},t.createElement("span",null,M),I&&t.createElement(i.J,{name:j,className:K.icon}))},E=M=>({wrapper:f.iv`
      background: ${M.colors.background.secondary};
      border-radius: ${M.shape.borderRadius(8)};
      padding: ${M.spacing(0,2)};
      font-size: ${M.typography.bodySmall.fontSize};
      font-weight: ${M.typography.fontWeightMedium};
      line-height: ${M.typography.bodySmall.lineHeight};
      color: ${M.colors.text.secondary};
      display: flex;
      align-items: center;
      height: 32px;

      &:hover {
        background: ${M.colors.action.hover};
        color: ${M.colors.text.primary};
      }
    `,selected:f.iv`
      color: ${M.colors.text.primary};
      background: ${M.colors.action.selected};

      &:hover {
        background: ${M.colors.action.focus};
      }
    `,icon:f.iv`
      margin-left: ${M.spacing(.5)};
    `});try{c.displayName="FilterPill",c.__docgenInfo={description:"",displayName:"FilterPill",props:{selected:{defaultValue:null,description:"",name:"selected",required:!0,type:{name:"boolean"}},label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"string"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!0,type:{name:"MouseEventHandler<HTMLElement>"}},icon:{defaultValue:{value:"check"},description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FilterPill/FilterPill.tsx#FilterPill"]={docgenInfo:c.__docgenInfo,name:"FilterPill",path:"src/components/FilterPill/FilterPill.tsx#FilterPill"})}catch(M){}var O=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),m=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),w=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function _(M){const I=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,m.ah)(),M.components);return(0,O.jsxs)(O.Fragment,{children:[(0,O.jsx)(I.h1,{children:"FilterPill"}),`
`,(0,O.jsx)(I.p,{children:"A component used for quick toggling on/off filters. Mostly used in inline form components and transformation/query editors."}),`
`,(0,O.jsx)(I.h3,{children:"Usage"}),`
`,(0,O.jsx)(I.pre,{children:(0,O.jsx)(I.code,{className:"language-jsx",children:`import { FilterPill } from '@grafana/ui';

<FilterPill label={'Test'} onClick={() => console.log('toggle')} />;
`})}),`
`,(0,O.jsx)(I.h3,{children:"Props"}),`
`,(0,O.jsx)(w.xP,{of:c})]})}function C(M={}){const{wrapper:I}=Object.assign({},(0,m.ah)(),M.components);return I?(0,O.jsx)(I,Object.assign({},M,{children:(0,O.jsx)(_,M)})):_(M)}var b=C,g=Object.defineProperty,v=Object.getOwnPropertySymbols,y=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,s=(M,I,T)=>I in M?g(M,I,{enumerable:!0,configurable:!0,writable:!0,value:T}):M[I]=T,o=(M,I)=>{for(var T in I||(I={}))y.call(I,T)&&s(M,T,I[T]);if(v)for(var T of v(I))h.call(I,T)&&s(M,T,I[T]);return M},r=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React, { useState } from 'react';

import { withCenteredStory } from '@grafana/ui/src/utils/storybook/withCenteredStory';

import { getAvailableIcons } from '../../types';
import { HorizontalGroup } from '../Layout/Layout';

import { FilterPill } from './FilterPill';
import mdx from './FilterPill.mdx';

const meta: ComponentMeta<typeof FilterPill> = {
  title: 'General/FilterPill',
  component: FilterPill,
  decorators: [withCenteredStory],
  argTypes: {
    icon: { control: { type: 'select', options: getAvailableIcons() } },
    onClick: { action: 'Pill Clicked' },
  },
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

export const Basic: ComponentStory<typeof FilterPill> = (args) => {
  return <FilterPill {...args} />;
};

export const Example = () => {
  const [selected, setSelected] = useState('Stockholm');
  const elements = ['Singapore', 'Paris', 'Stockholm', 'New York', 'London'];

  return (
    <HorizontalGroup>
      {elements.map((item) => (
        <FilterPill key={item} label={item} selected={item === selected} onClick={() => setSelected(item)} />
      ))}
    </HorizontalGroup>
  );
};

Basic.args = {
  selected: false,
  label: 'Test',
  icon: undefined,
};

export default meta;
`,u={Basic:{startLoc:{col:56,line:27},endLoc:{col:1,line:29},startBody:{col:56,line:27},endBody:{col:1,line:29}},Example:{startLoc:{col:23,line:31},endLoc:{col:1,line:42},startBody:{col:23,line:31},endBody:{col:1,line:42}}};const p={title:"General/FilterPill",component:c,decorators:[n.BU],argTypes:{icon:{control:{type:"select",options:(0,a.BI)()}},onClick:{action:"Pill Clicked"}},parameters:{docs:{page:b}}},S=M=>t.createElement(c,o({},M)),k=()=>{const[M,I]=(0,t.useState)("Stockholm"),T=["Singapore","Paris","Stockholm","New York","London"];return t.createElement(l.Lh,null,T.map(j=>t.createElement(c,{key:j,label:j,selected:j===M,onClick:()=>I(j)})))};S.args={selected:!1,label:"Test",icon:void 0};var D=p;S.parameters=o({storySource:{source:`(args) => {
  return <FilterPill {...args} />;
}`}},S.parameters),k.parameters=o({storySource:{source:`() => {
  const [selected, setSelected] = useState('Stockholm');
  const elements = ['Singapore', 'Paris', 'Stockholm', 'New York', 'London'];

  return (
    <HorizontalGroup>
      {elements.map((item) => (
        <FilterPill key={item} label={item} selected={item === selected} onClick={() => setSelected(item)} />
      ))}
    </HorizontalGroup>
  );
}`}},k.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FilterPill/FilterPill.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/FilterPill/FilterPill.story.tsx#ComponentMeta"})}catch(M){}},"./src/components/FormattedValueDisplay/FormattedValueDisplay.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{basic:function(){return y},default:function(){return h}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/FormattedValueDisplay/FormattedValueDisplay.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function d(s){const o=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,f.ah)(),s.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(o.h1,{children:"FormattedValueDisplay"}),`
`,(0,l.jsx)(o.p,{children:"Used to display a value, which also supports prefix and suffix."}),`
`,(0,l.jsx)(o.h3,{children:"Usage"}),`
`,(0,l.jsx)(o.pre,{children:(0,l.jsx)(o.code,{className:"language-jsx",children:`<FormattedValueDisplay value={{ text: 'Test value' }} style={{ fontSize: 12 }} />
`})}),`
`,(0,l.jsx)(o.h3,{children:"Props"}),`
`,(0,l.jsx)(x.xP,{of:a.W})]})}function i(s={}){const{wrapper:o}=Object.assign({},(0,f.ah)(),s.components);return o?(0,l.jsx)(o,Object.assign({},s,{children:(0,l.jsx)(d,s)})):d(s)}var c=i,E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?E(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=`import { ComponentMeta } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '@grafana/ui/src/utils/storybook/withCenteredStory';

import { FormattedValueDisplay } from './FormattedValueDisplay';
import mdx from './FormattedValueDisplay.mdx';

const meta: ComponentMeta<typeof FormattedValueDisplay> = {
  title: 'Visualizations/FormattedValueDisplay',
  component: FormattedValueDisplay,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

export const basic = () => {
  return <FormattedValueDisplay value={{ text: 'Test value' }} style={{ fontSize: 12 }} />;
};

export default meta;
`,g={basic:{startLoc:{col:21,line:20},endLoc:{col:1,line:22},startBody:{col:21,line:20},endBody:{col:1,line:22}}};const v={title:"Visualizations/FormattedValueDisplay",component:a.W,decorators:[n.BU],parameters:{docs:{page:c}}},y=()=>t.createElement(a.W,{value:{text:"Test value"},style:{fontSize:12}});var h=v;y.parameters=C({storySource:{source:`() => {
  return <FormattedValueDisplay value={{ text: 'Test value' }} style={{ fontSize: 12 }} />;
}`}},y.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FormattedValueDisplay/FormattedValueDisplay.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/FormattedValueDisplay/FormattedValueDisplay.story.tsx#ComponentMeta"})}catch(s){}},"./src/components/Forms/Checkbox.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return h},InAField:function(){return o},StackedList:function(){return s},default:function(){return r}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Layout/Layout.tsx"),a=e("./src/components/Forms/Checkbox.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function d(u){const p=Object.assign({h1:"h1",h3:"h3",p:"p",code:"code",strong:"strong",pre:"pre"},(0,f.ah)(),u.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(x.h_,{title:"MDX|Checkbox",component:a.X}),`
`,(0,l.jsx)(p.h1,{children:"Checkbox"}),`
`,(0,l.jsx)(p.h3,{children:"When to use"}),`
`,(0,l.jsxs)(p.p,{children:["Checked represents true, un-checked represent false. So you can use them to select a binary option or multiple options in a set. ",(0,l.jsx)(p.code,{children:"Checkbox"})," can be used in groups, where the single checkboxes have no dependencies. That means that selecting one doesn\u2019t affect any other ",(0,l.jsx)(p.code,{children:"Checkbox"}),". When adding a description to your ",(0,l.jsx)(p.code,{children:"Checkbox"}),', write positive statements so that "checked" means "yes" and not "no". That way, you can avoid confusion.']}),`
`,(0,l.jsxs)(p.p,{children:[(0,l.jsx)(p.strong,{children:"DO:"}),` [ ] Hide options
`,(0,l.jsx)(p.strong,{children:"DON'T:"})," [ ] Do not show options"]}),`
`,(0,l.jsxs)(p.p,{children:["Checkboxes typically only trigger changes after sending a form. If your component should trigger a change immediately, it's better to use a toggle switch instead. Furthermore, checkboxes are not mutually exclusive. That means that selecting one will not disable the others or impact them in any other way. If you want to offer a mutually exclusive choice, use ",(0,l.jsx)(p.code,{children:"RadioButtonGroup"})," or a ",(0,l.jsx)(p.code,{children:"Select"})," dropdown."]}),`
`,(0,l.jsxs)(p.p,{children:[(0,l.jsx)(p.strong,{children:"DO:"}),`
Show series
[ ] A-series
[ ] B-series
[ ] C-series`]}),`
`,(0,l.jsxs)(p.p,{children:[(0,l.jsx)(p.strong,{children:"DON'T:"}),`
Show only
[ ] A-series
[ ] B-series
[ ] C-series`]}),`
`,(0,l.jsx)(p.h3,{children:"Usage"}),`
`,(0,l.jsx)(p.pre,{children:(0,l.jsx)(p.code,{className:"language-jsx",children:`import { Forms } from '@grafana/ui';

<Checkbox value={true|false} label={...} description={...} onChange={...} />
`})}),`
`,(0,l.jsx)(p.h3,{children:"Props"}),`
`,(0,l.jsx)(x.xP,{of:a.X})]})}function i(u={}){const{wrapper:p}=Object.assign({},(0,f.ah)(),u.components);return p?(0,l.jsx)(p,Object.assign({},u,{children:(0,l.jsx)(d,u)})):d(u)}var c=i,E=e("./src/components/Forms/Field.tsx"),O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(u,p,S)=>p in u?O(u,p,{enumerable:!0,configurable:!0,writable:!0,value:S}):u[p]=S,b=(u,p)=>{for(var S in p||(p={}))w.call(p,S)&&C(u,S,p[S]);if(m)for(var S of m(p))_.call(p,S)&&C(u,S,p[S]);return u},g=null,v={Basic:{startLoc:{col:54,line:23},endLoc:{col:1,line:34},startBody:{col:54,line:23},endBody:{col:1,line:34}},StackedList:{startLoc:{col:27,line:42},endLoc:{col:1,line:64},startBody:{col:27,line:42},endBody:{col:1,line:64}},InAField:{startLoc:{col:57,line:66},endLoc:{col:1,line:74},startBody:{col:57,line:66},endBody:{col:1,line:74}}};const y={title:"Forms/Checkbox",component:a.X,parameters:{docs:{page:c},controls:{exclude:["value","htmlValue"]}}},h=u=>{const[p,S]=(0,t.useState)(!1),k=(0,t.useCallback)(D=>S(D.currentTarget.checked),[S]);return t.createElement("div",null,t.createElement(a.X,b({value:p,onChange:k},u)))};h.args={label:"Skip TLS cert validation",description:"Set to true if you want to skip TLS cert validation",disabled:!1};const s=()=>t.createElement("div",null,t.createElement(n.wc,null,t.createElement(a.X,{defaultChecked:!0,label:"Skip TLS cert validation",description:"Set to true if you want to skip TLS cert validation"}),t.createElement(a.X,{defaultChecked:!0,label:"Another checkbox",description:"Another long description that does not make any sense"}),t.createElement(a.X,{defaultChecked:!0,label:"Another checkbox times 2",description:"Another long description that does not make any sense or does it?"}))),o=u=>t.createElement("div",null,t.createElement(E.g,b({},u),t.createElement(a.X,{name:"hide",id:"hide",defaultChecked:!0})));o.args={label:"Hidden",description:"Annotation queries can be toggled on or of at the top of the dashboard. With this option checked this toggle will be hidden.",disabled:!1};var r=y;h.parameters=b({storySource:{source:`(args) => {
  const [checked, setChecked] = useState(false);
  const onChange = useCallback(
    (e: React.FormEvent<HTMLInputElement>) => setChecked(e.currentTarget.checked),
    [setChecked]
  );
  return (
    <div>
      <Checkbox value={checked} onChange={onChange} {...args} />
    </div>
  );
}`}},h.parameters),s.parameters=b({storySource:{source:`() => {
  return (
    <div>
      <VerticalGroup>
        <Checkbox
          defaultChecked={true}
          label="Skip TLS cert validation"
          description="Set to true if you want to skip TLS cert validation"
        />
        <Checkbox
          defaultChecked={true}
          label="Another checkbox"
          description="Another long description that does not make any sense"
        />
        <Checkbox
          defaultChecked={true}
          label="Another checkbox times 2"
          description="Another long description that does not make any sense or does it?"
        />
      </VerticalGroup>
    </div>
  );
}`}},s.parameters),o.parameters=b({storySource:{source:`(args) => {
  return (
    <div>
      <Field {...args}>
        <Checkbox name="hide" id="hide" defaultChecked={true} />
      </Field>
    </div>
  );
}`}},o.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Checkbox.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/Checkbox.story.tsx#ComponentMeta"})}catch(u){}},"./src/components/Forms/Field.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{HorizontalLayout:function(){return s},Simple:function(){return h},default:function(){return o}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Input/Input.tsx"),a=e("./src/components/Switch/Switch.tsx"),l=e("./src/components/Forms/Field.tsx"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),x=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),d=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function i(r){const u=Object.assign({h1:"h1",p:"p",code:"code",h3:"h3",pre:"pre"},(0,x.ah)(),r.components);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(d.h_,{title:"MDX|Field",component:l.g}),`
`,(0,f.jsx)(u.h1,{children:"Field"}),`
`,(0,f.jsxs)(u.p,{children:[(0,f.jsx)(u.code,{children:"Field"})," is the basic component for rendering form elements together with labels and description"]}),`
`,(0,f.jsx)(u.h3,{children:"Usage"}),`
`,(0,f.jsx)(u.pre,{children:(0,f.jsx)(u.code,{className:"language-jsx",children:`import { Forms } from '@grafana/ui';

<Field label={...} description={...}>
  <Input id="userName"  onChange={...}/>
</Field>
`})}),`
`,(0,f.jsx)(u.h3,{children:"Props"}),`
`,(0,f.jsx)(d.xP,{of:l.g})]})}function c(r={}){const{wrapper:u}=Object.assign({},(0,x.ah)(),r.components);return u?(0,f.jsx)(u,Object.assign({},r,{children:(0,f.jsx)(i,r)})):i(r)}var E=c,O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(r,u,p)=>u in r?O(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,b=(r,u)=>{for(var p in u||(u={}))w.call(u,p)&&C(r,p,u[p]);if(m)for(var p of m(u))_.call(u,p)&&C(r,p,u[p]);return r},g=null,v={Simple:{startLoc:{col:52,line:30},endLoc:{col:1,line:36},startBody:{col:52,line:30},endBody:{col:1,line:36}},HorizontalLayout:{startLoc:{col:62,line:48},endLoc:{col:1,line:61},startBody:{col:62,line:48},endBody:{col:1,line:61}}};const y={title:"Forms/Field",component:l.g,argTypes:{label:{control:{type:"text"}},description:{control:{type:"text"}},error:{control:{type:"text"}}},parameters:{docs:{page:E},knobs:{disabled:!0},controls:{exclude:["children","className"]}}},h=r=>t.createElement("div",null,t.createElement(l.g,b({},r),t.createElement(n.I,{id:"thisField"})));h.args={label:"Graphite API key",description:"Your Graphite instance API key",disabled:!1,invalid:!1,loading:!1,error:"Not valid input",horizontal:!1};const s=r=>{const[u,p]=(0,t.useState)(!1),S=(0,t.useCallback)(k=>p(k.currentTarget.checked),[p]);return t.createElement("div",null,t.createElement(l.g,b({},r),t.createElement(a.r,{checked:u,onChange:S})))};s.args={label:"Show labels",description:"Display threshold labels",disabled:!1,invalid:!1,loading:!1,error:"Not valid input",horizontal:!0};var o=y;h.parameters=b({storySource:{source:`(args) => (
  <div>
    <Field {...args}>
      <Input id="thisField" />
    </Field>
  </div>
)`}},h.parameters),s.parameters=b({storySource:{source:`(args) => {
  const [checked, setChecked] = useState(false);
  const onChange = useCallback(
    (e: React.FormEvent<HTMLInputElement>) => setChecked(e.currentTarget.checked),
    [setChecked]
  );
  return (
    <div>
      <Field {...args}>
        <Switch checked={checked} onChange={onChange} />
      </Field>
    </div>
  );
}`}},s.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Field.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/Field.story.tsx#ComponentMeta"})}catch(r){}},"./src/components/Forms/FieldArray.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Simple:function(){return $},default:function(){return F}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Forms/Form.tsx"),a=e("./src/components/Layout/Layout.tsx"),l=e("./src/components/Input/Input.tsx"),f=e("./src/components/Button/Button.tsx"),x=e("./src/utils/storybook/withCenteredStory.tsx"),d=e("./src/utils/storybook/withStoryContainer.tsx"),i=e("../../.yarn/__virtual__/react-hook-form-virtual-2f92bbcc72/2/yarn/cache/react-hook-form-npm-7.5.3-f9cc466c62-fbfaa3b664.zip/node_modules/react-hook-form/dist/index.esm.js"),c=Object.defineProperty,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(R,U,H)=>U in R?c(R,U,{enumerable:!0,configurable:!0,writable:!0,value:H}):R[U]=H,_=(R,U)=>{for(var H in U||(U={}))O.call(U,H)&&w(R,H,U[H]);if(E)for(var H of E(U))m.call(U,H)&&w(R,H,U[H]);return R},C=(R,U)=>{var H={};for(var W in R)O.call(R,W)&&U.indexOf(W)<0&&(H[W]=R[W]);if(R!=null&&E)for(var W of E(R))U.indexOf(W)<0&&m.call(R,W)&&(H[W]=R[W]);return H};const b=R=>{var U=R,{name:H,control:W,children:oe}=U,Q=C(U,["name","control","children"]);const{fields:P,append:ae,prepend:q,remove:Y,swap:ve,move:re,insert:je}=(0,i.Dq)(_({control:W,name:H},Q));return oe({fields:P,append:ae,prepend:q,remove:Y,swap:ve,move:re,insert:je})};try{b.displayName="FieldArray",b.__docgenInfo={description:"",displayName:"FieldArray",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},keyName:{defaultValue:null,description:"",name:"keyName",required:!1,type:{name:"enum",value:[{value:'"id"'}]}},control:{defaultValue:null,description:"",name:"control",required:!1,type:{name:"Control<FieldValues>"}},shouldUnregister:{defaultValue:null,description:"",name:"shouldUnregister",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/FieldArray.tsx#FieldArray"]={docgenInfo:b.__docgenInfo,name:"FieldArray",path:"src/components/Forms/FieldArray.tsx#FieldArray"})}catch(R){}var g=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),v=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),y=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function h(R){const U=Object.assign({h1:"h1",p:"p",code:"code",a:"a",h3:"h3",pre:"pre"},(0,v.ah)(),R.components);return(0,g.jsxs)(g.Fragment,{children:[(0,g.jsx)(y.h_,{title:"MDX|FieldArray",component:b}),`
`,(0,g.jsx)(U.h1,{children:"FieldArray"}),`
`,(0,g.jsxs)(U.p,{children:[(0,g.jsx)(U.code,{children:"FieldArray"})," provides a way to render a list of dynamic inputs. It exposes the functionality of ",(0,g.jsx)(U.code,{children:"useFieldArray"})," in ",(0,g.jsx)(U.a,{href:"https://react-hook-form.com/advanced-usage/#FieldArrays",children:"react-hook-form"}),". ",(0,g.jsx)(U.code,{children:"FieldArray"})," must be wrapped at some level by a ",(0,g.jsx)(U.code,{children:"<Form>"})," element."]}),`
`,(0,g.jsx)(U.h3,{children:"Usage"}),`
`,(0,g.jsx)(U.pre,{children:(0,g.jsx)(U.code,{className:"language-jsx",children:`import { Form, FieldArray } from '@grafana/ui';

<Form onSubmit={() => console.log('form submitted')}>
  ({control, register}) => (
    <FieldArray control={control} name="People">
      {({ fields, append }) => (
          <div>
              {fields.map((field, index) => (
                  <div key={field.id}>
                      <Input key={index} {...register(\`people[\${index}].firstName\` as const)} value={field.firstName} />
                      <Input {...register(\`people[\${index}].lastName\` as const)} value={field.lastName} />
                  </div>
              ))}
              <Button onClick={() => append({firstName: 'Roger', lastName: 'Waters'})}>Append</Button>
          </div>
      )}
    </FieldArray>
  )
</Form>;
`})}),`
`,(0,g.jsx)(U.h3,{children:"FieldArray API"}),`
`,(0,g.jsxs)(U.p,{children:["The ",(0,g.jsx)(U.code,{children:"FieldArray"})," component exposes its API via render prop. Properties exposed are: ",(0,g.jsx)(U.code,{children:"fields"}),", ",(0,g.jsx)(U.code,{children:"append"}),", ",(0,g.jsx)(U.code,{children:"prepend"}),", ",(0,g.jsx)(U.code,{children:"remove"}),", ",(0,g.jsx)(U.code,{children:"swap"}),", ",(0,g.jsx)(U.code,{children:"move"}),", ",(0,g.jsx)(U.code,{children:"insert"})]}),`
`,(0,g.jsx)(U.h3,{children:"Props"}),`
`,(0,g.jsx)(y.xP,{of:b})]})}function s(R={}){const{wrapper:U}=Object.assign({},(0,v.ah)(),R.components);return U?(0,g.jsx)(U,Object.assign({},R,{children:(0,g.jsx)(h,R)})):h(R)}var o=s,r=Object.defineProperty,u=Object.defineProperties,p=Object.getOwnPropertyDescriptors,S=Object.getOwnPropertySymbols,k=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable,M=(R,U,H)=>U in R?r(R,U,{enumerable:!0,configurable:!0,writable:!0,value:H}):R[U]=H,I=(R,U)=>{for(var H in U||(U={}))k.call(U,H)&&M(R,H,U[H]);if(S)for(var H of S(U))D.call(U,H)&&M(R,H,U[H]);return R},T=(R,U)=>u(R,p(U)),j=`import { Meta, Story } from '@storybook/react';
import React from 'react';
import { FieldValues } from 'react-hook-form';

import { Form, Input, Button, HorizontalGroup } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';
import { withStoryContainer } from '../../utils/storybook/withStoryContainer';

import { FieldArray } from './FieldArray';
import mdx from './FieldArray.mdx';

export default {
  title: 'Forms/FieldArray',
  component: FieldArray,
  decorators: [withStoryContainer, withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['name', 'keyName', 'control', 'shouldUnregister'],
    },
  },
  argTypes: {
    containerWidth: { control: { type: 'range', min: 100, max: 500, step: 10 } },
    containerHeight: { control: { type: 'range', min: 100, max: 500, step: 10 } },
  },
} as Meta;

export const Simple: Story = (args) => {
  const defaultValues: FieldValues = {
    people: [{ firstName: 'Janis', lastName: 'Joplin' }],
  };
  return (
    <Form onSubmit={(values) => console.log(values)} defaultValues={defaultValues}>
      {({ control, register }) => (
        <div>
          <FieldArray control={control} name="people">
            {({ fields, append }) => (
              <>
                <div style={{ marginBottom: '1rem' }}>
                  {fields.map((field, index) => (
                    <HorizontalGroup key={field.id}>
                      <Input
                        key={field.id}
                        {...register(\`people.\${index}.firstName\` as const)}
                        defaultValue={field.firstName}
                      />
                      <Input
                        key={field.id}
                        {...register(\`people.\${index}.lastName\` as const)}
                        defaultValue={field.lastName}
                      />
                    </HorizontalGroup>
                  ))}
                </div>
                <Button
                  style={{ marginRight: '1rem' }}
                  onClick={() => append({ firstName: 'Roger', lastName: 'Waters' })}
                >
                  Add another
                </Button>
              </>
            )}
          </FieldArray>
          <Button type="submit">Submit</Button>
        </div>
      )}
    </Form>
  );
};
Simple.args = {
  containerWidth: 300,
  containerHeight: 0,
  showBoundaries: false,
};
`,K={Simple:{startLoc:{col:29,line:31},endLoc:{col:1,line:72},startBody:{col:29,line:31},endBody:{col:1,line:72}}},F={title:"Forms/FieldArray",component:b,decorators:[d.r,x.BU],parameters:{docs:{page:o},controls:{exclude:["name","keyName","control","shouldUnregister"]}},argTypes:{containerWidth:{control:{type:"range",min:100,max:500,step:10}},containerHeight:{control:{type:"range",min:100,max:500,step:10}}}};const $=R=>{const U={people:[{firstName:"Janis",lastName:"Joplin"}]};return t.createElement(n.l,{onSubmit:H=>console.log(H),defaultValues:U},({control:H,register:W})=>t.createElement("div",null,t.createElement(b,{control:H,name:"people"},({fields:oe,append:Q})=>t.createElement(t.Fragment,null,t.createElement("div",{style:{marginBottom:"1rem"}},oe.map((P,ae)=>t.createElement(a.Lh,{key:P.id},t.createElement(l.I,T(I({key:P.id},W(`people.${ae}.firstName`)),{defaultValue:P.firstName})),t.createElement(l.I,T(I({key:P.id},W(`people.${ae}.lastName`)),{defaultValue:P.lastName}))))),t.createElement(f.zx,{style:{marginRight:"1rem"},onClick:()=>Q({firstName:"Roger",lastName:"Waters"})},"Add another"))),t.createElement(f.zx,{type:"submit"},"Submit")))};$.args={containerWidth:300,containerHeight:0,showBoundaries:!1},$.parameters=I({storySource:{source:`(args) => {
  const defaultValues: FieldValues = {
    people: [{ firstName: 'Janis', lastName: 'Joplin' }],
  };
  return (
    <Form onSubmit={(values) => console.log(values)} defaultValues={defaultValues}>
      {({ control, register }) => (
        <div>
          <FieldArray control={control} name="people">
            {({ fields, append }) => (
              <>
                <div style={{ marginBottom: '1rem' }}>
                  {fields.map((field, index) => (
                    <HorizontalGroup key={field.id}>
                      <Input
                        key={field.id}
                        {...register(\`people.\${index}.firstName\` as const)}
                        defaultValue={field.firstName}
                      />
                      <Input
                        key={field.id}
                        {...register(\`people.\${index}.lastName\` as const)}
                        defaultValue={field.lastName}
                      />
                    </HorizontalGroup>
                  ))}
                </div>
                <Button
                  style={{ marginRight: '1rem' }}
                  onClick={() => append({ firstName: 'Roger', lastName: 'Waters' })}
                >
                  Add another
                </Button>
              </>
            )}
          </FieldArray>
          <Button type="submit">Submit</Button>
        </div>
      )}
    </Form>
  );
}`}},$.parameters)},"./src/components/Forms/FieldSet.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return $},default:function(){return R}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/themes/stylesFactory.ts"),f=e("./src/components/Forms/Legend.tsx"),x=Object.defineProperty,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(U,H,W)=>H in U?x(U,H,{enumerable:!0,configurable:!0,writable:!0,value:W}):U[H]=W,O=(U,H)=>{for(var W in H||(H={}))i.call(H,W)&&E(U,W,H[W]);if(d)for(var W of d(H))c.call(H,W)&&E(U,W,H[W]);return U},m=(U,H)=>{var W={};for(var oe in U)i.call(U,oe)&&H.indexOf(oe)<0&&(W[oe]=U[oe]);if(U!=null&&d)for(var oe of d(U))H.indexOf(oe)<0&&c.call(U,oe)&&(W[oe]=U[oe]);return W};const w=U=>{var H=U,{label:W,children:oe,className:Q}=H,P=m(H,["label","children","className"]);const ae=(0,a.l4)(),q=_(ae);return t.createElement("fieldset",O({className:(0,n.cx)(q.wrapper,Q)},P),W&&t.createElement(f.D,null,W),oe)},_=(0,l.B)(U=>({wrapper:n.iv`
      margin-bottom: ${U.spacing(4)};

      &:last-child {
        margin-bottom: 0;
      }
    `}));try{w.displayName="FieldSet",w.__docgenInfo={description:"",displayName:"FieldSet",props:{label:{defaultValue:null,description:"Label for the fieldset's legend",name:"label",required:!1,type:{name:"ReactNode"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/FieldSet.tsx#FieldSet"]={docgenInfo:w.__docgenInfo,name:"FieldSet",path:"src/components/Forms/FieldSet.tsx#FieldSet"})}catch(U){}var C=e("./src/components/Forms/Form.tsx"),b=e("./src/components/Forms/Field.tsx"),g=e("./src/components/Input/Input.tsx"),v=e("./src/utils/storybook/withCenteredStory.tsx"),y=e("./src/components/Button/Button.tsx"),h=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),s=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),o=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function r(U){const H=Object.assign({h1:"h1",p:"p",a:"a",h3:"h3",pre:"pre",code:"code"},(0,s.ah)(),U.components);return(0,h.jsxs)(h.Fragment,{children:[(0,h.jsx)(H.h1,{children:"FieldSet"}),`
`,(0,h.jsxs)(H.p,{children:["Component used to group form elements inside a form, equivalent to HTML's ",(0,h.jsx)(H.a,{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/fieldset",children:"fieldset"}),` tag.
Accepts optional label, which, if provided, is used as a text for the set's legend.`]}),`
`,(0,h.jsx)(H.h3,{children:"Usage"}),`
`,(0,h.jsx)(H.pre,{children:(0,h.jsx)(H.code,{className:"language-jsx",children:`import { FieldSet } from '@grafana/ui';

<Form onSubmit={() => console.log('Submit')}>
  {() => (
    <>
      <FieldSet label="Details">
        <Field label="Name">
          <Input name="name" />
        </Field>
        <Field label="Email">
          <Input name="email" />
        </Field>
      </FieldSet>

      <FieldSet label="Preferences">
        <Field label="Color">
          <Input name="color" />
        </Field>
        <Field label="Font size">
          <Input name="fontsize" />
        </Field>
      </FieldSet>
      <Button variant="primary">Save</Button>
    </>
  )}
</Form>;
`})}),`
`,(0,h.jsx)(H.h3,{children:"Props"}),`
`,(0,h.jsx)(o.xP,{of:w})]})}function u(U={}){const{wrapper:H}=Object.assign({},(0,s.ah)(),U.components);return H?(0,h.jsx)(H,Object.assign({},U,{children:(0,h.jsx)(r,U)})):r(U)}var p=u,S=Object.defineProperty,k=Object.getOwnPropertySymbols,D=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable,I=(U,H,W)=>H in U?S(U,H,{enumerable:!0,configurable:!0,writable:!0,value:W}):U[H]=W,T=(U,H)=>{for(var W in H||(H={}))D.call(H,W)&&I(U,W,H[W]);if(k)for(var W of k(H))M.call(H,W)&&I(U,W,H[W]);return U},j=null,K={Basic:{startLoc:{col:54,line:32},endLoc:{col:1,line:56},startBody:{col:54,line:32},endBody:{col:1,line:56}}};const F={title:"Forms/FieldSet",component:w,decorators:[v.BU],args:{label:"Default label"},parameters:{docs:{page:p},controls:{exclude:["children"]}},argTypes:{label:{control:"text"}}},$=U=>t.createElement(C.l,{onSubmit:()=>console.log("Submit")},()=>t.createElement(t.Fragment,null,t.createElement(w,T({},U),t.createElement(b.g,{label:"Name"},t.createElement(g.I,{name:"name"})),t.createElement(b.g,{label:"Email"},t.createElement(g.I,{name:"email"})),t.createElement(b.g,{label:"Color"},t.createElement(g.I,{name:"color"})),t.createElement(b.g,{label:"Font size"},t.createElement(g.I,{name:"fontsize"}))),t.createElement(y.zx,{variant:"primary"},"Save")));var R=F;$.parameters=T({storySource:{source:`(args: Props) => {
  return (
    <Form onSubmit={() => console.log('Submit')}>
      {() => (
        <>
          <FieldSet {...args}>
            <Field label="Name">
              <Input name="name" />
            </Field>
            <Field label="Email">
              <Input name="email" />
            </Field>
            <Field label="Color">
              <Input name="color" />
            </Field>
            <Field label="Font size">
              <Input name="fontsize" />
            </Field>
          </FieldSet>
          <Button variant="primary">Save</Button>
        </>
      )}
    </Form>
  );
}`}},$.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/FieldSet.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/FieldSet.story.tsx#ComponentMeta"})}catch(U){}},"./src/components/Forms/FieldValidationMessage.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return v},default:function(){return y}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Forms/FieldValidationMessage.tsx"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),l=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),f=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function x(h){const s=Object.assign({h1:"h1",p:"p",h3:"h3",code:"code",pre:"pre"},(0,l.ah)(),h.components);return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(f.h_,{title:"MDX|FieldValidationMessage",component:n.S}),`
`,(0,a.jsx)(s.h1,{children:"FieldValidationMessage"}),`
`,(0,a.jsx)(s.p,{children:"Component for displaying a validation error message under an element."}),`
`,(0,a.jsx)(s.h3,{children:"Example usage"}),`
`,(0,a.jsxs)(s.p,{children:["An example usage of this is in out ",(0,a.jsx)(s.code,{children:"FormField"})," component."]}),`
`,(0,a.jsx)(s.pre,{children:(0,a.jsx)(s.code,{className:"language-tsx",children:`export const CustomFormField = () => {
  return (
    <div>
      Label
      <div>
        <input />
        {error && <FormValidationMessage>Invalid input</FormValidationMessage>}
      </div>
    </div>
  );
};
`})}),`
`,(0,a.jsx)(f.xP,{of:n.S})]})}function d(h={}){const{wrapper:s}=Object.assign({},(0,l.ah)(),h.components);return s?(0,a.jsx)(s,Object.assign({},h,{children:(0,a.jsx)(x,h)})):x(h)}var i=d,c=Object.defineProperty,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(h,s,o)=>s in h?c(h,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):h[s]=o,_=(h,s)=>{for(var o in s||(s={}))O.call(s,o)&&w(h,o,s[o]);if(E)for(var o of E(s))m.call(s,o)&&w(h,o,s[o]);return h},C=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { FieldValidationMessage } from './FieldValidationMessage';
import mdx from './FieldValidationMessage.mdx';

const meta: ComponentMeta<typeof FieldValidationMessage> = {
  title: 'Forms/FieldValidationMessage',
  component: FieldValidationMessage,
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['className'],
    },
  },
  args: {
    horizontal: false,
    children: 'Invalid input message',
  },
  argTypes: {
    children: { name: 'message' },
  },
};

export const Basic: ComponentStory<typeof FieldValidationMessage> = (args) => {
  return <FieldValidationMessage horizontal={args.horizontal}>{args.children}</FieldValidationMessage>;
};

export default meta;
`,b={Basic:{startLoc:{col:68,line:27},endLoc:{col:1,line:29},startBody:{col:68,line:27},endBody:{col:1,line:29}}};const g={title:"Forms/FieldValidationMessage",component:n.S,parameters:{docs:{page:i},controls:{exclude:["className"]}},args:{horizontal:!1,children:"Invalid input message"},argTypes:{children:{name:"message"}}},v=h=>t.createElement(n.S,{horizontal:h.horizontal},h.children);var y=g;v.parameters=_({storySource:{source:`(args) => {
  return <FieldValidationMessage horizontal={args.horizontal}>{args.children}</FieldValidationMessage>;
}`}},v.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/FieldValidationMessage.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/FieldValidationMessage.story.tsx#ComponentMeta"})}catch(h){}},"./src/components/Forms/Form.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{AsyncValidation:function(){return W},Basic:function(){return U},DefaultValues:function(){return H},default:function(){return F}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Forms/Form.tsx"),a=e("./src/components/Forms/Legend.tsx"),l=e("./src/components/Forms/Field.tsx"),f=e("./src/components/Input/Input.tsx"),x=e("./src/components/TextArea/TextArea.tsx"),d=e("./src/components/Forms/Checkbox.tsx"),i=e("./src/components/Switch/Switch.tsx"),c=e("../../.yarn/__virtual__/react-hook-form-virtual-2f92bbcc72/2/yarn/cache/react-hook-form-npm-7.5.3-f9cc466c62-fbfaa3b664.zip/node_modules/react-hook-form/dist/index.esm.js");const E=c.Qr;try{E.displayName="InputControl",E.__docgenInfo={description:"",displayName:"InputControl",props:{render:{defaultValue:null,description:"",name:"render",required:!0,type:{name:"({ field, fieldState, formState, }: { field: ControllerRenderProps<TFieldValues, TName>; fieldState: ControllerFieldState; formState: UseFormStateReturn<TFieldValues>; }) => ReactElement<...>"}},name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},rules:{defaultValue:null,description:"",name:"rules",required:!1,type:{name:'Omit<Partial<{ required: string | ValidationRule<boolean>; min: ValidationRule<string | number>; max: ValidationRule<string | number>; ... 7 more ...; shouldUnregister?: boolean; }>, "valueAsNumber" | ... 1 more ... | "setValueAs">'}},shouldUnregister:{defaultValue:null,description:"",name:"shouldUnregister",required:!1,type:{name:"boolean"}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"unknown"}},control:{defaultValue:null,description:"",name:"control",required:!1,type:{name:"Control<TFieldValues>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/InputControl.tsx#InputControl"]={docgenInfo:E.__docgenInfo,name:"InputControl",path:"src/components/InputControl.tsx#InputControl"})}catch(Q){}var O=e("./src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx"),m=e("./src/components/Select/Select.tsx"),w=e("./src/components/Button/Button.tsx"),_=e("./src/utils/storybook/withCenteredStory.tsx"),C=e("./src/utils/storybook/withStoryContainer.tsx"),b=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),g=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),v=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function y(Q){const P=Object.assign({h1:"h1",p:"p",a:"a",h2:"h2",pre:"pre",code:"code",h3:"h3",h4:"h4",ul:"ul",li:"li"},(0,g.ah)(),Q.components);return(0,b.jsxs)(b.Fragment,{children:[(0,b.jsx)(v.h_,{title:"MDX|Form",component:n.l}),`
`,(0,b.jsx)(P.h1,{children:"Form"}),`
`,(0,b.jsxs)(P.p,{children:["Form component provides a way to build simple forms at Grafana. It is built on top of ",(0,b.jsx)(P.a,{href:"https://react-hook-form.com/",children:"react-hook-form"})," library and incorporates the same concepts while adjusting the API slightly."]}),`
`,(0,b.jsx)(P.h2,{children:"Usage"}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-tsx",children:`import { Forms } from '@grafana/ui';

interface UserDTO {
  name: string;
  email: string;
  //...
}

const defaultUser: Partial<UserDTO> = {
  name: 'Roger Waters',
  // ...
}

<Form
  defaultValues={defaultUser}
  onSubmit={async (user: UserDTO) => await createUser(user)}
>{({register, errors}) => {
  return (
    <Field>
      <Input {...register("name")}/>
      <Input {...register("email", {required: true})} type="email" />
      <Button type="submit">Create User</Button>
    </Field>
  )
}}</Form>
`})}),`
`,(0,b.jsx)(P.h3,{children:"Form API"}),`
`,(0,b.jsxs)(P.p,{children:[(0,b.jsx)(P.code,{children:"Form"})," component exposes API via render prop. Three properties are exposed: ",(0,b.jsx)(P.code,{children:"register"}),", ",(0,b.jsx)(P.code,{children:"errors"})," and ",(0,b.jsx)(P.code,{children:"control"})]}),`
`,(0,b.jsx)(P.h4,{children:(0,b.jsx)(P.code,{children:"register"})}),`
`,(0,b.jsxs)(P.p,{children:[(0,b.jsx)(P.code,{children:"register"})," allows registering form elements (inputs, selects, radios, etc) in the form. In order to do that you need to invoke the function itself and spread the props into the input. For example:"]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`<Input {...register('inputName')} />
`})}),`
`,(0,b.jsxs)(P.p,{children:["The first argument for ",(0,b.jsx)(P.code,{children:"register"})," is the field name. It also accepts an object, which describes validation rules for a given input:"]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`<Input
  {...register("inputName", {
    required: true,
    minLength: 10,
    validate: v => { // custom validation rule }
  })}
/>
`})}),`
`,(0,b.jsxs)(P.p,{children:["See ",(0,b.jsx)(P.a,{href:"#validation",children:"Validation"})," for examples on validation and validation rules."]}),`
`,(0,b.jsx)(P.h4,{children:(0,b.jsx)(P.code,{children:"errors"})}),`
`,(0,b.jsxs)(P.p,{children:[(0,b.jsx)(P.code,{children:"errors"})," is an object that contains validation errors of the form. To show error message and invalid input indication in your form, wrap input element with ",(0,b.jsx)(P.code,{children:"<Field ...>"})," component and pass ",(0,b.jsx)(P.code,{children:"invalid"})," and ",(0,b.jsx)(P.code,{children:"error"})," props to it:"]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`<Field label="Name" invalid={!!errors.name} error="Name is required">
  <Input {...register('name', { required: true })} />
</Field>
`})}),`
`,(0,b.jsx)(P.h4,{children:(0,b.jsx)(P.code,{children:"control"})}),`
`,(0,b.jsxs)(P.p,{children:["By default ",(0,b.jsx)(P.code,{children:"Form"}),` component assumes form elements are uncontrolled (https://reactjs.org/docs/glossary.html#controlled-vs-uncontrolled-components).
There are some components like `,(0,b.jsx)(P.code,{children:"RadioButton"})," or ",(0,b.jsx)(P.code,{children:"Select"}),` that are controlled-only and require some extra work. To make
them work with the form, you need to render those using `,(0,b.jsx)(P.code,{children:"InputControl"})," component:"]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`import { Form, Field, InputControl } from '@grafana/ui';

// render function
<Form ...>{({register, errors, control}) => (
  <>
    <Field label="RadioButtonExample">
      <InputControl
        {/* Render InputControl as controlled input (RadioButtonGroup) */}
        render={({field}) => <RadioButtonGroup {...field} options={...} />}
        {/* Pass control exposed from Form render prop */}
        control={control}
        name="radio"
      />
    </Field>

    <Field label="SelectExample">
      <InputControl
        {/* Render InputControl as controlled input (Select) */}
        render={({field}) => <Select {...field} options={...} />}
        {/* Pass control exposed from Form render prop */}
        control={control}
        name="select"
      />
    </Field>
  </>
)}
</Form>
`})}),`
`,(0,b.jsxs)(P.p,{children:["In case we want to modify the selected value before passing it to the form, we can use the ",(0,b.jsx)(P.code,{children:"onChange"})," callback from the render's ",(0,b.jsx)(P.code,{children:"field"})," argument:"]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`<Field label="SelectExample">
  <InputControl
    {/* Here \`value\` has a nested \`value\` property, which we want to save onto the form. */}
    render={(field: {onChange, ...field}) => <Select {...field} onChange={(value) => onChange(value.value)}/>}
    control={control}
    name="select"
  />
</Field>
`})}),`
`,(0,b.jsxs)(P.p,{children:["Note that ",(0,b.jsx)(P.code,{children:"field"})," also contains ",(0,b.jsx)(P.code,{children:"ref"})," prop, which is passed down to the rendered component by default. In case if that component doesn't support this prop, it will need to be removed before spreading the ",(0,b.jsx)(P.code,{children:"field"}),"."]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`<Field label="SelectExample">
  <InputControl
     {/*Remove \`ref\` prop, so it doesn't get passed down to the component that doesn't support it. */}
    render={(field: {onChange, ref, ...field}) => <Select {...field} onChange={(value) => onChange(value.value)}/>}
    control={control}
    name="select"
  />
</Field>
`})}),`
`,(0,b.jsx)(P.h3,{children:"Default values"}),`
`,(0,b.jsxs)(P.p,{children:["Default values of the form can be passed either via ",(0,b.jsx)(P.code,{children:"defaultValues"})," property on the ",(0,b.jsx)(P.code,{children:"Form"}),` element, or directly on
form's input via `,(0,b.jsx)(P.code,{children:"defaultValue"}),` prop.
Note that changing/updating `,(0,b.jsx)(P.code,{children:"defaultValues"}),` passed to the form will reset the form's state, which might be undesirable in
case it has both controlled and uncontrolled components. In that case it's better to pass `,(0,b.jsx)(P.code,{children:"defaultValue"})," to each form component separately."]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`// Passing default values to the Form

interface FormDTO {
  name: string;
  isAdmin: boolean;
}

const defaultValues: FormDto {
  name: 'Roger Waters',
  isAdmin: false,
}

<Form defaultValues={defaultValues} ...>{...}</Form>
`})}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`// Passing default value directly to form inputs

interface FormDTO {
  name: string;
  isAdmin: boolean;
}

const defaultValues: FormDto {
  name: 'Roger Waters',
  isAdmin: false,
}

<Form ...>{
  ({register}) => (
    <>
      <Input {...register("name")} defaultValue={default.name} />
    </>
  )}
</Form>
`})}),`
`,(0,b.jsx)(P.h3,{children:"Validation"}),`
`,(0,b.jsxs)(P.p,{children:["Validation can be performed either synchronously or asynchronously. What's important here is that the validation function must return either a ",(0,b.jsx)(P.code,{children:"boolean"})," or a ",(0,b.jsx)(P.code,{children:"string"}),"."]}),`
`,(0,b.jsx)(P.h4,{children:"Basic required example"}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`<Form ...>{
  ({register, errors}) => (
    <>
      <Field invalid={!!errors.name} error={errors.name && 'Name is required'}
      <Input
        {...register("name", { required: true })}
        defaultValue={default.name}
      />
    </>
  )}
</Form>
`})}),`
`,(0,b.jsx)(P.h4,{children:"Required with synchronous custom validation"}),`
`,(0,b.jsxs)(P.p,{children:["One important thing to note is that if you want to provide different error messages for different kind of validation errors you'll need to return a ",(0,b.jsx)(P.code,{children:"string"})," instead of a ",(0,b.jsx)(P.code,{children:"boolean"}),"."]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`<Form ...>{
  ({register, errors}) => (
    <>
      <Field invalid={!!errors.name} error={errors.name?.message }
      <Input
        defaultValue={default.name}
        {...register("name", {
          required: 'Name is required',
          validation: v => {
            return v !== 'John' && 'Name must be John'
          },
        )}
      />
    </>
  )}
</Form>
`})}),`
`,(0,b.jsx)(P.h4,{children:"Asynchronous validation"}),`
`,(0,b.jsx)(P.p,{children:"For cases when you might want to validate fields asynchronously (on the backend or via some service) you can provide an asynchronous function to the field."}),`
`,(0,b.jsxs)(P.p,{children:["Consider this function that simulates a call to some service. Remember, if you want to display an error message replace ",(0,b.jsx)(P.code,{children:"return true"})," or ",(0,b.jsx)(P.code,{children:"return false"})," with ",(0,b.jsx)(P.code,{children:"return 'your error message'"}),"."]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`validateAsync = (newValue: string) => {
  try {
    (await new Promise()) <
      ValidateResult >
      ((resolve, reject) => {
        setTimeout(() => {
          reject('Something went wrong...');
        }, 2000);
      });
    return true;
  } catch (e) {
    return false;
  }
};
`})}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`<Form ...>{
  ({register, errors}) => (
    <>
      <Field invalid={!!errors.name} error={errors.name?.message}
      <Input
        defaultValue={default.name}
        {...register("name", {
          required: 'Name is required',
          validation: async v => {
            return  await validateAsync(v);
          },
        )}
      />
    </>
  )}
</Form>
`})}),`
`,(0,b.jsx)(P.h3,{children:"Upgrading to v8"}),`
`,(0,b.jsxs)(P.p,{children:["Version 8 of Grafana-UI is using version 7 of ",(0,b.jsx)(P.code,{children:"react-hook-form"})," (previously version 5 was used), which introduced a few breaking changes to the ",(0,b.jsx)(P.code,{children:"Form"})," API. The detailed list of changes can be found in the library's migration guides:"]}),`
`,(0,b.jsxs)(P.ul,{children:[`
`,(0,b.jsx)(P.li,{children:(0,b.jsx)(P.a,{href:"https://react-hook-form.com/migrate-v5-to-v6/",children:"Migration guide v5 to v6"})}),`
`,(0,b.jsx)(P.li,{children:(0,b.jsx)(P.a,{href:"https://react-hook-form.com/migrate-v6-to-v7/",children:"Migration guide v6 to v7"})}),`
`]}),`
`,(0,b.jsx)(P.p,{children:"In a nutshell, the two most important changes are:"}),`
`,(0,b.jsxs)(P.ul,{children:[`
`,(0,b.jsxs)(P.li,{children:["register method is no longer passed as a ",(0,b.jsx)(P.code,{children:"ref"}),", but instead its result is spread onto the input component:"]}),`
`]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`-(<input ref={register({ required: true })} name="test" />) + <input {...register('test', { required: true })} />;
`})}),`
`,(0,b.jsxs)(P.ul,{children:[`
`,(0,b.jsxs)(P.li,{children:[(0,b.jsx)(P.code,{children:"InputControl"}),"'s ",(0,b.jsx)(P.code,{children:"as"})," prop has been replaced with ",(0,b.jsx)(P.code,{children:"render"}),", which has ",(0,b.jsx)(P.code,{children:"field"})," and ",(0,b.jsx)(P.code,{children:"fieldState"})," objects as arguments. ",(0,b.jsx)(P.code,{children:"onChange"}),", ",(0,b.jsx)(P.code,{children:"onBlur"}),", ",(0,b.jsx)(P.code,{children:"value"}),", ",(0,b.jsx)(P.code,{children:"name"}),", and ",(0,b.jsx)(P.code,{children:"ref"})," are parts of ",(0,b.jsx)(P.code,{children:"field"}),"."]}),`
`]}),`
`,(0,b.jsx)(P.pre,{children:(0,b.jsx)(P.code,{className:"language-jsx",children:`- <Controller as={<input />} />
+ <Controller render={({ field }) => <input {...field} />}
// or
+ <Controller render={({ field, fieldState }) => <input {...field} />} />
`})}),`
`,(0,b.jsx)(P.h3,{children:"Props"}),`
`,(0,b.jsx)(v.xP,{of:n.l})]})}function h(Q={}){const{wrapper:P}=Object.assign({},(0,g.ah)(),Q.components);return P?(0,b.jsx)(P,Object.assign({},Q,{children:(0,b.jsx)(y,Q)})):y(Q)}var s=h,o=Object.defineProperty,r=Object.defineProperties,u=Object.getOwnPropertyDescriptors,p=Object.getOwnPropertySymbols,S=Object.prototype.hasOwnProperty,k=Object.prototype.propertyIsEnumerable,D=(Q,P,ae)=>P in Q?o(Q,P,{enumerable:!0,configurable:!0,writable:!0,value:ae}):Q[P]=ae,M=(Q,P)=>{for(var ae in P||(P={}))S.call(P,ae)&&D(Q,ae,P[ae]);if(p)for(var ae of p(P))k.call(P,ae)&&D(Q,ae,P[ae]);return Q},I=(Q,P)=>r(Q,u(P)),T=(Q,P,ae)=>new Promise((q,Y)=>{var ve=me=>{try{je(ae.next(me))}catch(ne){Y(ne)}},re=me=>{try{je(ae.throw(me))}catch(ne){Y(ne)}},je=me=>me.done?q(me.value):Promise.resolve(me.value).then(ve,re);je((ae=ae.apply(Q,P)).next())}),j=null,K={Basic:{startLoc:{col:21,line:128},endLoc:{col:1,line:130},startBody:{col:21,line:128},endBody:{col:1,line:130}},DefaultValues:{startLoc:{col:29,line:132},endLoc:{col:1,line:146},startBody:{col:29,line:132},endBody:{col:1,line:146}},AsyncValidation:{startLoc:{col:38,line:148},endLoc:{col:1,line:177},startBody:{col:38,line:148},endBody:{col:1,line:177}}},F={title:"Forms/Form",decorators:[C.r,_.BU],parameters:{docs:{page:s}}};const $=[{label:"Option 1",value:"option1"},{label:"Option 2",value:"option2"},{label:"Option 3",value:"option3"}],R=Q=>t.createElement(n.l,{defaultValues:Q,onSubmit:P=>{console.log(P)}},({register:P,control:ae,errors:q})=>console.log(q)||t.createElement(t.Fragment,null,t.createElement(a.D,null,"Edit user"),t.createElement(l.g,{label:"Name",invalid:!!q.name,error:"Name is required"},t.createElement(f.I,I(M({},P("name",{required:!0})),{placeholder:"Roger Waters"}))),t.createElement(l.g,{label:"Email",invalid:!!q.email,error:"E-mail is required"},t.createElement(f.I,I(M({},P("email",{required:!0})),{id:"email",placeholder:"roger.waters@grafana.com"}))),t.createElement(l.g,{label:"Username"},t.createElement(f.I,I(M({},P("username")),{placeholder:"mr.waters"}))),t.createElement(l.g,{label:"Nested object"},t.createElement(f.I,I(M({},P("nested.path")),{placeholder:"Nested path"}))),t.createElement(l.g,{label:"Textarea",invalid:!!q.text,error:"Text is required"},t.createElement(x.K,I(M({},P("text",{required:!0})),{placeholder:"Long text"}))),t.createElement(l.g,{label:"Checkbox",invalid:!!q.checkbox,error:"We need your consent"},t.createElement(d.X,I(M({},P("checkbox",{required:!0})),{label:"Do you consent?"}))),t.createElement(l.g,{label:"Switch"},t.createElement(i.r,M({name:"switch"},P))),t.createElement(l.g,{label:"RadioButton"},t.createElement(E,{name:"radio",control:ae,render:({field:Y})=>t.createElement(O.S,I(M({},Y),{options:$}))})),t.createElement(l.g,{label:"Select",invalid:!!q.select,error:"Select is required"},t.createElement(E,{name:"select",control:ae,rules:{required:!0},render:({field:Y})=>t.createElement(m.Ph,I(M({},Y),{options:$}))})),t.createElement(w.zx,{type:"submit"},"Update"))),U=()=>t.createElement(t.Fragment,null,R()),H=()=>{const Q=[{name:"Roger Waters",nested:{path:"Nested path default value"},radio:"option2",select:"option1",switch:!0}];return t.createElement(t.Fragment,null,R(Q[0]))},W=({passAsyncValidation:Q})=>t.createElement(t.Fragment,null,t.createElement(n.l,{onSubmit:P=>{alert("Submitted successfully!")}},({register:P,control:ae,errors:q,formState:Y})=>console.log(q)||t.createElement(t.Fragment,null,t.createElement(a.D,null,"Edit user"),t.createElement(l.g,{label:"Name",invalid:!!q.name,error:"Username is already taken"},t.createElement(f.I,M({placeholder:"Roger Waters"},P("name",{validate:oe(Q)})))),t.createElement(w.zx,{type:"submit",disabled:Y.isSubmitting},"Submit"))));W.args={passAsyncValidation:!0};const oe=Q=>()=>T(void 0,null,function*(){try{return yield new Promise((P,ae)=>{setTimeout(()=>{Q?P():ae("Something went wrong...")},2e3)}),!0}catch(P){return console.log(P),!1}});U.parameters=M({storySource:{source:`() => {
  return <>{renderForm()}</>;
}`}},U.parameters),H.parameters=M({storySource:{source:`() => {
  const defaultValues = [
    {
      name: 'Roger Waters',
      nested: {
        path: 'Nested path default value',
      },
      radio: 'option2',
      select: 'option1',
      switch: true,
    },
  ];

  return <>{renderForm(defaultValues[0])}</>;
}`}},H.parameters),W.parameters=M({storySource:{source:`({ passAsyncValidation }) => {
  return (
    <>
      <Form
        onSubmit={(data: FormDTO) => {
          alert('Submitted successfully!');
        }}
      >
        {({ register, control, errors, formState }) =>
          (console.log(errors) as any) || (
            <>
              <Legend>Edit user</Legend>

              <Field label="Name" invalid={!!errors.name} error="Username is already taken">
                <Input
                  placeholder="Roger Waters"
                  {...register('name', { validate: validateAsync(passAsyncValidation) })}
                />
              </Field>

              <Button type="submit" disabled={formState.isSubmitting}>
                Submit
              </Button>
            </>
          )
        }
      </Form>
    </>
  );
}`}},W.parameters)},"./src/components/Forms/InlineField.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{basic:function(){return u},default:function(){return I},error:function(){return M},grow:function(){return S},multiple:function(){return D},withSelect:function(){return k},withTooltip:function(){return p}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/components/Input/Input.tsx"),l=e("./src/components/Select/Select.tsx"),f=e("./src/components/Forms/InlineField.tsx"),x=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),d=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),i=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function c(T){const j=Object.assign({h1:"h1",p:"p",code:"code",pre:"pre"},(0,d.ah)(),T.components);return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(j.h1,{children:"InlineField"}),`
`,(0,x.jsxs)(j.p,{children:["A basic component for rendering form elements, like ",(0,x.jsx)(j.code,{children:"Input"}),", ",(0,x.jsx)(j.code,{children:"Select"}),", ",(0,x.jsx)(j.code,{children:"Checkbox"}),", etc, inline together with ",(0,x.jsx)(j.code,{children:"InlineLabel"}),". If the child element has ",(0,x.jsx)(j.code,{children:"id"})," specified, the label's ",(0,x.jsx)(j.code,{children:"htmlFor"})," attribute, pointing to the id, will be added."]}),`
`,(0,x.jsxs)(j.p,{children:["The width of the ",(0,x.jsx)(j.code,{children:"InlineLabel"})," can be modified via ",(0,x.jsx)(j.code,{children:"labelWidth"})," prop, which is a multiple of 8px. For example, an ",(0,x.jsx)(j.code,{children:"InlineField"})," with ",(0,x.jsx)(j.code,{children:"labelWidth={20}"})," will have a label 160px wide."]}),`
`,(0,x.jsxs)(j.p,{children:["If ",(0,x.jsx)(j.code,{children:"tooltip"})," prop is provided, an info icon with supplied tooltip content will be rendered inside the label."]}),`
`,(0,x.jsx)(j.h1,{children:"Usage"}),`
`,(0,x.jsx)(j.pre,{children:(0,x.jsx)(j.code,{className:"language-jsx",children:`<InlineField label="Inline field">
  <Input placeholder="Inline input" />
</InlineField>
`})}),`
`,(0,x.jsx)(i.xP,{of:f._})]})}function E(T={}){const{wrapper:j}=Object.assign({},(0,d.ah)(),T.components);return j?(0,x.jsx)(j,Object.assign({},T,{children:(0,x.jsx)(c,T)})):c(T)}var O=E,m=Object.defineProperty,w=Object.defineProperties,_=Object.getOwnPropertyDescriptors,C=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,v=(T,j,K)=>j in T?m(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,y=(T,j)=>{for(var K in j||(j={}))b.call(j,K)&&v(T,K,j[K]);if(C)for(var K of C(j))g.call(j,K)&&v(T,K,j[K]);return T},h=(T,j)=>w(T,_(j)),s=null,o={basic:{startLoc:{col:57,line:30},endLoc:{col:1,line:36},startBody:{col:57,line:30},endBody:{col:1,line:36}},withTooltip:{startLoc:{col:63,line:51},endLoc:{col:1,line:57},startBody:{col:63,line:51},endBody:{col:1,line:57}},grow:{startLoc:{col:56,line:65},endLoc:{col:1,line:71},startBody:{col:56,line:65},endBody:{col:1,line:71}},withSelect:{startLoc:{col:62,line:79},endLoc:{col:1,line:92},startBody:{col:62,line:79},endBody:{col:1,line:92}},multiple:{startLoc:{col:60,line:99},endLoc:{col:1,line:113},startBody:{col:60,line:99},endBody:{col:1,line:113}},error:{startLoc:{col:57,line:115},endLoc:{col:1,line:121},startBody:{col:57,line:115},endBody:{col:1,line:121}}};const r={title:"Forms/InlineField",component:f._,argTypes:{label:{control:{type:"text"}},labelWidth:{control:{type:"number"}},tooltip:{control:{type:"text"}},error:{control:{type:"text"}}},parameters:{docs:{page:O},controls:{exclude:["htmlFor","className","children"]}}},u=T=>n.createElement(f._,y({},T),n.createElement(a.I,{placeholder:"Inline input"}));u.args={label:"Inline field",transparent:!1,grow:!1,shrink:!1,disabled:!1,interactive:!1,loading:!1,required:!1,invalid:!1,validationMessageHorizontalOverflow:!1};const p=T=>n.createElement(f._,y({},T),n.createElement(a.I,{placeholder:"Inline input"}));p.args=h(y({tooltip:"Tooltip"},u.args),{label:"Label"});const S=T=>n.createElement(f._,y({},T),n.createElement(a.I,{placeholder:"Inline input"}));S.args=h(y({},u.args),{label:"Label",grow:!0});const k=T=>n.createElement(f._,y({},T),n.createElement(l.Ph,{width:16,onChange:(0,t.action)("item selected"),options:[{value:1,label:"One"},{value:2,label:"Two"}]}));k.args=h(y({},u.args),{label:"Select option"});const D=()=>n.createElement(n.Fragment,null,n.createElement(f._,{label:"Field 1"},n.createElement(a.I,{placeholder:"Inline input"})),n.createElement(f._,{label:"Field 2"},n.createElement(a.I,{placeholder:"Inline input"})),n.createElement(f._,{label:"Field 3"},n.createElement(a.I,{placeholder:"Inline input"}))),M=T=>n.createElement(f._,y({},T),n.createElement(a.I,{placeholder:"Inline input"}));M.args=h(y({},u.args),{label:"Label",error:"Error",invalid:!0});var I=r;u.parameters=y({storySource:{source:`(args) => {
  return (
    <InlineField {...args}>
      <Input placeholder="Inline input" />
    </InlineField>
  );
}`}},u.parameters),p.parameters=y({storySource:{source:`(args) => {
  return (
    <InlineField {...args}>
      <Input placeholder="Inline input" />
    </InlineField>
  );
}`}},p.parameters),S.parameters=y({storySource:{source:`(args) => {
  return (
    <InlineField {...args}>
      <Input placeholder="Inline input" />
    </InlineField>
  );
}`}},S.parameters),k.parameters=y({storySource:{source:`(args) => {
  return (
    <InlineField {...args}>
      <Select
        width={16}
        onChange={action('item selected')}
        options={[
          { value: 1, label: 'One' },
          { value: 2, label: 'Two' },
        ]}
      />
    </InlineField>
  );
}`}},k.parameters),D.parameters=y({storySource:{source:`() => {
  return (
    <>
      <InlineField label="Field 1">
        <Input placeholder="Inline input" />
      </InlineField>
      <InlineField label="Field 2">
        <Input placeholder="Inline input" />
      </InlineField>
      <InlineField label="Field 3">
        <Input placeholder="Inline input" />
      </InlineField>
    </>
  );
}`}},D.parameters),M.parameters=y({storySource:{source:`(args) => {
  return (
    <InlineField {...args}>
      <Input placeholder="Inline input" />
    </InlineField>
  );
}`}},M.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/InlineField.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/InlineField.story.tsx#ComponentMeta"})}catch(T){}},"./src/components/Forms/InlineFieldRow.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{default:function(){return h},single:function(){return y}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Input/Input.tsx"),a=e("./src/components/Forms/InlineField.tsx"),l=e("./src/components/Forms/InlineFieldRow.tsx"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),x=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js");function d(s){const o=Object.assign({h1:"h1",p:"p",code:"code",h3:"h3",pre:"pre"},(0,x.ah)(),s.components);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(o.h1,{children:"InlineFieldRow"}),`
`,(0,f.jsxs)(o.p,{children:["Used to align multiple ",(0,f.jsx)(o.code,{children:"InlineField"})," components in one row. The row will wrap if the width of the children exceeds its own. Equivalent to the div with ",(0,f.jsx)(o.code,{children:"gf-form-inline"}),` class name.
Multiple `,(0,f.jsx)(o.code,{children:"InlineFieldRow"}),"s vertically stack on each other."]}),`
`,(0,f.jsx)(o.h3,{children:"Usage"}),`
`,(0,f.jsx)(o.pre,{children:(0,f.jsx)(o.code,{className:"language-jsx",children:`<InlineFieldRow>
  <InlineField label="Label Row 1">
    <Input placeholder="Label" />
  </InlineField>
  <InlineField label="Label Row 1">
    <Input placeholder="Label" />
  </InlineField>
</InlineFieldRow>
`})})]})}function i(s={}){const{wrapper:o}=Object.assign({},(0,x.ah)(),s.components);return o?(0,f.jsx)(o,Object.assign({},s,{children:(0,f.jsx)(d,s)})):d(s)}var c=i,E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?E(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=null,g={single:{startLoc:{col:22,line:20},endLoc:{col:1,line:44},startBody:{col:22,line:20},endBody:{col:1,line:44}}};const v={title:"Forms/InlineFieldRow",component:l.Z,parameters:{docs:{page:c}}},y=()=>t.createElement("div",{style:{width:"100%"}},t.createElement(l.Z,null,t.createElement(a._,{label:"Label Row 1"},t.createElement(n.I,{placeholder:"Label"})),t.createElement(a._,{label:"Label Row 1"},t.createElement(n.I,{placeholder:"Label"}))),t.createElement(l.Z,null,t.createElement(a._,{label:"Label Row 2"},t.createElement(n.I,{placeholder:"Label"})),t.createElement(a._,{label:"Label Row 2"},t.createElement(n.I,{placeholder:"Label"})),t.createElement(a._,{label:"Label Row 2 Grow",grow:!0},t.createElement(n.I,{placeholder:"Label"}))));var h=v;y.parameters=C({storySource:{source:`() => {
  return (
    <div style={{ width: '100%' }}>
      <InlineFieldRow>
        <InlineField label="Label Row 1">
          <Input placeholder="Label" />
        </InlineField>
        <InlineField label="Label Row 1">
          <Input placeholder="Label" />
        </InlineField>
      </InlineFieldRow>
      <InlineFieldRow>
        <InlineField label="Label Row 2">
          <Input placeholder="Label" />
        </InlineField>
        <InlineField label="Label Row 2">
          <Input placeholder="Label" />
        </InlineField>
        <InlineField label="Label Row 2 Grow" grow>
          <Input placeholder="Label" />
        </InlineField>
      </InlineFieldRow>
    </div>
  );
}`}},y.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/InlineFieldRow.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/InlineFieldRow.story.tsx#ComponentMeta"})}catch(s){}},"./src/components/Forms/InlineLabel.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return s},WithTooltip:function(){return o},default:function(){return r}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Forms/InlineLabel.tsx"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),l=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),f=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function x(u){const p=Object.assign({h1:"h1",p:"p",code:"code",pre:"pre"},(0,l.ah)(),u.components);return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(p.h1,{children:"InlineLabel"}),`
`,(0,a.jsxs)(p.p,{children:["A horizontal variant of ",(0,a.jsx)(p.code,{children:"Label"}),", primarily used in query editors. Can be combined with form components that expect a label, eg. ",(0,a.jsx)(p.code,{children:"Input"}),", ",(0,a.jsx)(p.code,{children:"Select"}),", ",(0,a.jsx)(p.code,{children:"Checkbox"}),`.
If you need to add additional explanation, use the tooltip prop, which will render an info icon with tooltip inside the label.
For query editor readability, the label text should be as short as possible (4 words or fewer).`]}),`
`,(0,a.jsx)(p.h1,{children:"Usage"}),`
`,(0,a.jsx)(p.pre,{children:(0,a.jsx)(p.code,{className:"language-jsx",children:`<InlineLabel width="auto" tooltip="Tooltip content">
  Simple label
</InlineLabel>
`})}),`
`,(0,a.jsx)(f.xP,{of:n.W})]})}function d(u={}){const{wrapper:p}=Object.assign({},(0,l.ah)(),u.components);return p?(0,a.jsx)(p,Object.assign({},u,{children:(0,a.jsx)(x,u)})):x(u)}var i=d,c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(u,p,S)=>p in u?c(u,p,{enumerable:!0,configurable:!0,writable:!0,value:S}):u[p]=S,b=(u,p)=>{for(var S in p||(p={}))w.call(p,S)&&C(u,S,p[S]);if(m)for(var S of m(p))_.call(p,S)&&C(u,S,p[S]);return u},g=(u,p)=>E(u,O(p)),v=`import { ComponentMeta } from '@storybook/react';
import React from 'react';

import { InlineLabel, Props } from './InlineLabel';
import mdx from './InlineLabel.mdx';

const meta: ComponentMeta<typeof InlineLabel> = {
  title: 'Forms/InlineLabel',
  component: InlineLabel,
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['as'],
    },
  },
  argTypes: {
    children: {
      control: 'text',
    },
    tooltip: {
      control: 'text',
    },
    width: {
      control: 'text',
    },
  },
};

export const Basic = (args: Props) => <InlineLabel {...args} />;

Basic.args = {
  children: 'Simple text',
  width: 'auto',
  tooltip: undefined,
  transparent: false,
  interactive: false,
};

Basic.parameters = {
  controls: {
    exclude: ['as', 'tooltip', 'interactive'],
  },
};

export const WithTooltip = (args: Props) => <InlineLabel {...args} />;

WithTooltip.args = {
  ...Basic.args,
  tooltip: 'Info text',
};

export default meta;
`,y={Basic:{startLoc:{col:21,line:31},endLoc:{col:63,line:31},startBody:{col:21,line:31},endBody:{col:63,line:31}},WithTooltip:{startLoc:{col:27,line:47},endLoc:{col:69,line:47},startBody:{col:27,line:47},endBody:{col:69,line:47}}};const h={title:"Forms/InlineLabel",component:n.W,parameters:{docs:{page:i},controls:{exclude:["as"]}},argTypes:{children:{control:"text"},tooltip:{control:"text"},width:{control:"text"}}},s=u=>t.createElement(n.W,b({},u));s.args={children:"Simple text",width:"auto",tooltip:void 0,transparent:!1,interactive:!1},s.parameters={controls:{exclude:["as","tooltip","interactive"]}};const o=u=>t.createElement(n.W,b({},u));o.args=g(b({},s.args),{tooltip:"Info text"});var r=h;s.parameters=b({storySource:{source:"(args: Props) => <InlineLabel {...args} />"}},s.parameters),o.parameters=b({storySource:{source:"(args: Props) => <InlineLabel {...args} />"}},o.parameters);try{s.displayName="Basic",s.__docgenInfo={description:"",displayName:"Basic",props:{tooltip:{defaultValue:null,description:`Content for the labels tooltip. If provided, an info icon with the tooltip content
will be displayed`,name:"tooltip",required:!1,type:{name:"PopoverContent"}},width:{defaultValue:null,description:"Custom width for the label",name:"width",required:!1,type:{name:'number | "auto"'}},transparent:{defaultValue:null,description:"Make labels's background transparent",name:"transparent",required:!1,type:{name:"boolean"}},interactive:{defaultValue:null,description:"Make tooltip interactive",name:"interactive",required:!1,type:{name:"boolean"}},as:{defaultValue:null,description:"Controls which element the InlineLabel should be rendered into",name:"as",required:!1,type:{name:"ElementType<any>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/InlineLabel.story.tsx#Basic"]={docgenInfo:s.__docgenInfo,name:"Basic",path:"src/components/Forms/InlineLabel.story.tsx#Basic"})}catch(u){}try{o.displayName="WithTooltip",o.__docgenInfo={description:"",displayName:"WithTooltip",props:{tooltip:{defaultValue:null,description:`Content for the labels tooltip. If provided, an info icon with the tooltip content
will be displayed`,name:"tooltip",required:!1,type:{name:"PopoverContent"}},width:{defaultValue:null,description:"Custom width for the label",name:"width",required:!1,type:{name:'number | "auto"'}},transparent:{defaultValue:null,description:"Make labels's background transparent",name:"transparent",required:!1,type:{name:"boolean"}},interactive:{defaultValue:null,description:"Make tooltip interactive",name:"interactive",required:!1,type:{name:"boolean"}},as:{defaultValue:null,description:"Controls which element the InlineLabel should be rendered into",name:"as",required:!1,type:{name:"ElementType<any>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/InlineLabel.story.tsx#WithTooltip"]={docgenInfo:o.__docgenInfo,name:"WithTooltip",path:"src/components/Forms/InlineLabel.story.tsx#WithTooltip"})}catch(u){}try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/InlineLabel.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/InlineLabel.story.tsx#ComponentMeta"})}catch(u){}},"./src/components/Forms/Label.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{categorised:function(){return y},default:function(){return h},simple:function(){return v}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Forms/Label.tsx"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),l=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),f=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function x(s){const o=Object.assign({h1:"h1",p:"p",code:"code",h3:"h3"},(0,l.ah)(),s.components);return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(f.h_,{title:"MDX|Label",component:n._}),`
`,(0,a.jsx)(o.h1,{children:"Label"}),`
`,(0,a.jsxs)(o.p,{children:['The label component can be used to label form inputs with a heading/"Option name" and a description. To automatically have the right arrangement of this component with a form input, use the ',(0,a.jsx)(o.code,{children:"Field"})," component. There is also a categorised variant of the label, where the heading shows nested categories before the actual option name."]}),`
`,(0,a.jsx)(o.p,{children:"This label component is used in full-page forms in Grafana, for example in the datasource settings. In some parts of Grafana, there are inline forms which do not use this type of label."}),`
`,(0,a.jsx)(o.h3,{children:"Props"}),`
`,(0,a.jsx)(f.xP,{of:n._})]})}function d(s={}){const{wrapper:o}=Object.assign({},(0,l.ah)(),s.components);return o?(0,a.jsx)(o,Object.assign({},s,{children:(0,a.jsx)(x,s)})):x(s)}var i=d,c=Object.defineProperty,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(s,o,r)=>o in s?c(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,_=(s,o)=>{for(var r in o||(o={}))O.call(o,r)&&w(s,r,o[r]);if(E)for(var r of E(o))m.call(o,r)&&w(s,r,o[r]);return s},C=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { Label } from './Label';
import mdx from './Label.mdx';

const meta: ComponentMeta<typeof Label> = {
  title: 'Forms/Label',
  component: Label,
  argTypes: {
    children: { control: { type: 'text' } },
    description: { control: { type: 'text' } },
  },
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

export const simple: ComponentStory<typeof Label> = (args) => {
  return <Label {...args} />;
};

simple.parameters = {
  controls: { exclude: ['category'] },
};

simple.args = {
  children: 'Option name',
  description: 'Option description',
};

export const categorised: ComponentStory<typeof Label> = (args) => {
  return <Label {...args} />;
};

categorised.args = {
  children: 'Option name',
  description: 'Option description',
  category: ['Category', 'Nested category'],
};

export default meta;
`,b={simple:{startLoc:{col:52,line:21},endLoc:{col:1,line:23},startBody:{col:52,line:21},endBody:{col:1,line:23}},categorised:{startLoc:{col:57,line:34},endLoc:{col:1,line:36},startBody:{col:57,line:34},endBody:{col:1,line:36}}};const g={title:"Forms/Label",component:n._,argTypes:{children:{control:{type:"text"}},description:{control:{type:"text"}}},parameters:{docs:{page:i}}},v=s=>t.createElement(n._,_({},s));v.parameters={controls:{exclude:["category"]}},v.args={children:"Option name",description:"Option description"};const y=s=>t.createElement(n._,_({},s));y.args={children:"Option name",description:"Option description",category:["Category","Nested category"]};var h=g;v.parameters=_({storySource:{source:`(args) => {
  return <Label {...args} />;
}`}},v.parameters),y.parameters=_({storySource:{source:`(args) => {
  return <Label {...args} />;
}`}},y.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Label.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/Label.story.tsx#ComponentMeta"})}catch(s){}},"./src/components/Forms/Legend.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return y},default:function(){return h}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Forms/Legend.tsx"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),l=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),f=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function x(s){const o=Object.assign({h1:"h1",h3:"h3",p:"p",code:"code",pre:"pre"},(0,l.ah)(),s.components),{Meta:r}=o;return r||c("Meta",!0),(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(r,{title:"MDX|Legend",component:n.D}),`
`,(0,a.jsx)(o.h1,{children:"Legend"}),`
`,(0,a.jsx)(o.h3,{children:"When to use"}),`
`,(0,a.jsxs)(o.p,{children:["Legend should be used to add a caption to a group of related form elements that have been grouped toegheter into a ",(0,a.jsx)(o.code,{children:"FieldSet"}),"."]}),`
`,(0,a.jsx)(o.h3,{children:"Usage"}),`
`,(0,a.jsx)(o.pre,{children:(0,a.jsx)(o.code,{className:"language-jsx",children:`import { Forms } from '@grafana/ui';

<Legend>{label}</Legend>;
`})}),`
`,(0,a.jsx)(o.h3,{children:"Props"}),`
`,(0,a.jsx)(f.xP,{of:n.D})]})}function d(s={}){const{wrapper:o}=Object.assign({},(0,l.ah)(),s.components);return o?(0,a.jsx)(o,Object.assign({},s,{children:(0,a.jsx)(x,s)})):x(s)}var i=d;function c(s,o){throw new Error("Expected "+(o?"component":"object")+" `"+s+"` to be defined: you likely forgot to import, pass, or provide it.")}var E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?E(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { Legend } from '@grafana/ui';

import mdx from './Legend.mdx';

const meta: ComponentMeta<typeof Legend> = {
  title: 'Forms/Legend',
  component: Legend,
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['description'],
    },
  },
  argTypes: {
    children: { name: 'Label' },
  },
};

export const Basic: ComponentStory<typeof Legend> = (args) => {
  return <Legend>{args.children}</Legend>;
};
Basic.args = {
  children: 'Form section',
};

export default meta;
`,g={Basic:{startLoc:{col:52,line:24},endLoc:{col:1,line:26},startBody:{col:52,line:24},endBody:{col:1,line:26}}};const v={title:"Forms/Legend",component:n.D,parameters:{docs:{page:i},controls:{exclude:["description"]}},argTypes:{children:{name:"Label"}}},y=s=>t.createElement(n.D,null,s.children);y.args={children:"Form section"};var h=v;y.parameters=C({storySource:{source:`(args) => {
  return <Legend>{args.children}</Legend>;
}`}},y.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Legend.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/Legend.story.tsx#ComponentMeta"})}catch(s){}},"./src/components/Forms/RadioButtonGroup/RadioButtonGroup.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{RadioButtons:function(){return v},default:function(){return y}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),l=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),f=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function x(h){const s=Object.assign({h1:"h1",p:"p",code:"code",h3:"h3",pre:"pre",h4:"h4"},(0,l.ah)(),h.components);return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(f.h_,{title:"MDX|RadioButtonGroup",component:n.S}),`
`,(0,a.jsx)(s.h1,{children:"RadioButtonGroup"}),`
`,(0,a.jsxs)(s.p,{children:[(0,a.jsx)(s.code,{children:"RadioButtonGroup"})," is used to select a single value from multiple mutually exclusive options."]}),`
`,(0,a.jsx)(s.h3,{children:"When to use"}),`
`,(0,a.jsxs)(s.p,{children:["Use ",(0,a.jsx)(s.code,{children:"RadioButtonGroup"})," for mutually exclusive selections if there are up to four options available. This is because the ",(0,a.jsx)(s.code,{children:"RadioButtonGroup"})," cannot have more than one row and should still accommodate small resolutions. For a mutually exclusive selection of more than four options, use ",(0,a.jsx)(s.code,{children:"Select"})," component."]}),`
`,(0,a.jsxs)(s.p,{children:["Radio buttons can only exist in this type of group. If you want one single option, it's better to use ",(0,a.jsx)(s.code,{children:"Switch"})," instead. To offer multiple choices within the same group or context which are not mutually exclusive, use ",(0,a.jsx)(s.code,{children:"Checkbox"})," instead."]}),`
`,(0,a.jsx)(s.h3,{children:"Usage"}),`
`,(0,a.jsx)(s.pre,{children:(0,a.jsx)(s.code,{className:"language-jsx",children:`import { RadioButtonGroup } from '@grafana/ui';

<RadioButtonGroup options={...} value={...} onChange={...} />
`})}),`
`,(0,a.jsx)(s.h4,{children:"Disabling options"}),`
`,(0,a.jsxs)(s.p,{children:["To disable some options pass those options to the ",(0,a.jsx)(s.code,{children:"RadioButtonGroup"})," via ",(0,a.jsx)(s.code,{children:"disabledOptions"})," property:"]}),`
`,(0,a.jsx)(s.pre,{children:(0,a.jsx)(s.code,{className:"language-jsx",children:`
const options = [
  { label: 'Prometheus', value: 'prometheus' },
  { label: 'Graphite', value: 'graphite' },
  { label: 'Elastic', value: 'elastic' },
  { label: 'InfluxDB', value: 'influx' },
];

const disabledOptions = ['prometheus', 'elastic'];


<RadioButtonGroup
  options={options}
  disabledOptions={disabledOptions}
  value={...}
  onChange={...}
/>
`})}),`
`,(0,a.jsx)(f.xP,{of:n.S})]})}function d(h={}){const{wrapper:s}=Object.assign({},(0,l.ah)(),h.components);return s?(0,a.jsx)(s,Object.assign({},h,{children:(0,a.jsx)(x,h)})):x(h)}var i=d,c=Object.defineProperty,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(h,s,o)=>s in h?c(h,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):h[s]=o,_=(h,s)=>{for(var o in s||(s={}))O.call(s,o)&&w(h,o,s[o]);if(E)for(var o of E(s))m.call(s,o)&&w(h,o,s[o]);return h},C=`import { Meta, Story } from '@storybook/react';
import React, { useState } from 'react';

import { RadioButtonGroup } from './RadioButtonGroup';
import mdx from './RadioButtonGroup.mdx';

const meta: Meta = {
  title: 'Forms/RadioButtonGroup',
  component: RadioButtonGroup,
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['className', 'options', 'value', 'onChange'],
    },
  },
  argTypes: {
    disabledOptions: {
      name: 'Disabled item',
      control: { type: 'select' },
      options: ['', 'graphite', 'prometheus', 'elastic'],
    },
    size: { control: { type: 'select' }, options: ['sm', 'md'] },
  },
};

export const RadioButtons: Story = (args) => {
  const [selected, setSelected] = useState('elastic');

  const options = [
    { label: 'Prometheus', value: 'prometheus' },
    { label: 'Graphite', value: 'graphite', icon: 'cloud' },
    { label: 'Elastic', value: 'elastic' },
  ];

  const optionsWithOnlyIcons = [
    { description: 'Prometheus', value: 'prometheus', icon: 'gf-interpolation-linear' },
    { description: 'Graphite', value: 'graphite', icon: 'gf-interpolation-smooth' },
    { description: 'Elastic', value: 'elastic', icon: 'gf-interpolation-step-after' },
  ];

  return (
    <div style={{ width: '100%' }}>
      <div style={{ marginBottom: '32px' }}>
        <h5>Full width</h5>
        <RadioButtonGroup
          options={options}
          disabled={args.disabled}
          disabledOptions={args.disabledOptions}
          value={selected}
          onChange={(v) => setSelected(v!)}
          size={args.size}
          fullWidth={args.fullWidth}
        />
      </div>
      <div style={{ marginBottom: '32px' }}>
        <h5>Auto width</h5>
        <RadioButtonGroup
          options={options}
          disabled={args.disabled}
          disabledOptions={args.disabledOptions}
          value={selected}
          onChange={(v) => setSelected(v!)}
          size={args.size}
        />
      </div>
      <div style={{ marginBottom: '32px' }}>
        <h5>With only icons and descriptions</h5>
        <RadioButtonGroup
          options={optionsWithOnlyIcons}
          value={selected}
          onChange={(v) => setSelected(v!)}
          size={args.size}
        />
      </div>
    </div>
  );
};
RadioButtons.args = {
  disabled: false,
  disabledOptions: '',
  size: 'md',
  fullWidth: true,
};

export default meta;
`,b={RadioButtons:{startLoc:{col:35,line:28},endLoc:{col:1,line:79},startBody:{col:35,line:28},endBody:{col:1,line:79}}};const g={title:"Forms/RadioButtonGroup",component:n.S,parameters:{docs:{page:i},controls:{exclude:["className","options","value","onChange"]}},argTypes:{disabledOptions:{name:"Disabled item",control:{type:"select"},options:["","graphite","prometheus","elastic"]},size:{control:{type:"select"},options:["sm","md"]}}},v=h=>{const[s,o]=(0,t.useState)("elastic"),r=[{label:"Prometheus",value:"prometheus"},{label:"Graphite",value:"graphite",icon:"cloud"},{label:"Elastic",value:"elastic"}],u=[{description:"Prometheus",value:"prometheus",icon:"gf-interpolation-linear"},{description:"Graphite",value:"graphite",icon:"gf-interpolation-smooth"},{description:"Elastic",value:"elastic",icon:"gf-interpolation-step-after"}];return t.createElement("div",{style:{width:"100%"}},t.createElement("div",{style:{marginBottom:"32px"}},t.createElement("h5",null,"Full width"),t.createElement(n.S,{options:r,disabled:h.disabled,disabledOptions:h.disabledOptions,value:s,onChange:p=>o(p),size:h.size,fullWidth:h.fullWidth})),t.createElement("div",{style:{marginBottom:"32px"}},t.createElement("h5",null,"Auto width"),t.createElement(n.S,{options:r,disabled:h.disabled,disabledOptions:h.disabledOptions,value:s,onChange:p=>o(p),size:h.size})),t.createElement("div",{style:{marginBottom:"32px"}},t.createElement("h5",null,"With only icons and descriptions"),t.createElement(n.S,{options:u,value:s,onChange:p=>o(p),size:h.size})))};v.args={disabled:!1,disabledOptions:"",size:"md",fullWidth:!0};var y=g;v.parameters=_({storySource:{source:`(args) => {
  const [selected, setSelected] = useState('elastic');

  const options = [
    { label: 'Prometheus', value: 'prometheus' },
    { label: 'Graphite', value: 'graphite', icon: 'cloud' },
    { label: 'Elastic', value: 'elastic' },
  ];

  const optionsWithOnlyIcons = [
    { description: 'Prometheus', value: 'prometheus', icon: 'gf-interpolation-linear' },
    { description: 'Graphite', value: 'graphite', icon: 'gf-interpolation-smooth' },
    { description: 'Elastic', value: 'elastic', icon: 'gf-interpolation-step-after' },
  ];

  return (
    <div style={{ width: '100%' }}>
      <div style={{ marginBottom: '32px' }}>
        <h5>Full width</h5>
        <RadioButtonGroup
          options={options}
          disabled={args.disabled}
          disabledOptions={args.disabledOptions}
          value={selected}
          onChange={(v) => setSelected(v!)}
          size={args.size}
          fullWidth={args.fullWidth}
        />
      </div>
      <div style={{ marginBottom: '32px' }}>
        <h5>Auto width</h5>
        <RadioButtonGroup
          options={options}
          disabled={args.disabled}
          disabledOptions={args.disabledOptions}
          value={selected}
          onChange={(v) => setSelected(v!)}
          size={args.size}
        />
      </div>
      <div style={{ marginBottom: '32px' }}>
        <h5>With only icons and descriptions</h5>
        <RadioButtonGroup
          options={optionsWithOnlyIcons}
          value={selected}
          onChange={(v) => setSelected(v!)}
          size={args.size}
        />
      </div>
    </div>
  );
}`}},v.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/RadioButtonGroup/RadioButtonGroup.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Forms/RadioButtonGroup/RadioButtonGroup.story.tsx#Meta"})}catch(h){}},"./src/components/Forms/RadioButtonList/RadioButtonList.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{ControlledComponent:function(){return D},Default:function(){return S},DisabledCheckedOption:function(){return I},DisabledList:function(){return T},DisabledOptions:function(){return M},Dots:function(){return j},LongLabels:function(){return k},default:function(){return K}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("./src/themes/ThemeContext.tsx");const l=({id:F,name:$,label:R,checked:U,disabled:H,description:W,onChange:oe})=>{const Q=(0,a.wW)(f);return t.createElement("label",{title:W,className:Q.label},t.createElement("input",{id:F,name:$,type:"radio",checked:U,disabled:H,className:Q.input,onChange:()=>oe&&oe(F)}),R)},f=F=>({input:n.iv`
    position: relative;
    appearance: none;
    outline: none;
    background-color: ${F.colors.background.canvas};
    margin: 0;
    width: ${F.spacing(2)} !important; /* TODO How to overcome this? Checkbox does the same 🙁 */
    height: ${F.spacing(2)};
    border: 1px solid ${F.colors.border.medium};
    border-radius: 50%;
    margin: 3px 0; /* Space for box-shadow when focused */

    :checked {
      background-color: ${F.v1.palette.white};
      border: 5px solid ${F.colors.primary.main};
    }

    :disabled {
      background-color: ${F.colors.action.disabledBackground} !important;
      border-color: ${F.colors.border.weak};
    }

    :disabled:checked {
      border: 1px solid ${F.colors.border.weak};
    }

    :disabled:checked::after {
      content: '';
      width: 6px;
      height: 6px;
      background-color: ${F.colors.text.disabled};
      border-radius: 50%;
      display: inline-block;
      position: absolute;
      top: 4px;
      left: 4px;
    }

    :focus {
      outline: none !important;
      box-shadow: 0 0 0 1px ${F.colors.background.canvas}, 0 0 0 3px ${F.colors.primary.main};
    }
  `,label:n.iv`
    font-size: ${F.typography.fontSize};
    line-height: 22px; /* 16px for the radio button and 6px for the focus shadow */
    display: grid;
    grid-template-columns: ${F.spacing(2)} auto;
    gap: ${F.spacing(1)};
  `});try{l.displayName="RadioButtonDot",l.__docgenInfo={description:"",displayName:"RadioButtonDot",props:{id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},checked:{defaultValue:null,description:"",name:"checked",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"ReactNode"}},description:{defaultValue:null,description:"",name:"description",required:!1,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((id: string) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/RadioButtonList/RadioButtonDot.tsx#RadioButtonDot"]={docgenInfo:l.__docgenInfo,name:"RadioButtonDot",path:"src/components/Forms/RadioButtonList/RadioButtonDot.tsx#RadioButtonDot"})}catch(F){}var x=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js");function d({name:F,id:$,options:R,value:U,onChange:H,className:W,disabled:oe,disabledOptions:Q=[]}){const P=(0,a.wW)(i),ae=$!=null?$:(0,x.uniqueId)("radiogroup-list-");return t.createElement("div",{id:$,className:(0,n.cx)(P.container,W),role:"radiogroup"},R.map((q,Y)=>{const ve=`${ae}-${Y}`,re=U&&U===q.value,je=oe||Q.some(ne=>ne===q.value),me=()=>H&&q.value&&H(q.value);return t.createElement(l,{key:ve,id:ve,name:F,label:q.label,description:q.description,checked:re,disabled:je,onChange:me})}))}const i=F=>({container:n.iv`
    display: grid;
    gap: ${F.spacing(1)};
  `});try{d.displayName="RadioButtonList",d.__docgenInfo={description:"",displayName:"RadioButtonList",props:{name:{defaultValue:null,description:"A name of a radio group. Used to group multiple radio inputs into a single group",name:"name",required:!0,type:{name:"string"}},id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string"}},options:{defaultValue:null,description:"An array of available options",name:"options",required:!0,type:{name:"SelectableValue<T>[]"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"T"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((value: T) => void)"}},disabled:{defaultValue:null,description:"Disables all elements in the list",name:"disabled",required:!1,type:{name:"boolean"}},disabledOptions:{defaultValue:{value:"[]"},description:"Disables subset of elements in the list. Compares values using the === operator",name:"disabledOptions",required:!1,type:{name:"T[]"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/RadioButtonList/RadioButtonList.tsx#RadioButtonList"]={docgenInfo:d.__docgenInfo,name:"RadioButtonList",path:"src/components/Forms/RadioButtonList/RadioButtonList.tsx#RadioButtonList"})}catch(F){}var c=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),E=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),O=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function m(F){const $=Object.assign({h1:"h1",p:"p",code:"code",h2:"h2",a:"a",h3:"h3",pre:"pre"},(0,E.ah)(),F.components);return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(O.h_,{title:"MDX|RadioButtonList",component:d}),`
`,(0,c.jsx)($.h1,{children:"RadioButtonList"}),`
`,(0,c.jsxs)($.p,{children:[(0,c.jsx)($.code,{children:"RadioButtonList"})," is used to select a single value from multiple mutually exclusive options usually in a vertical manner."]}),`
`,(0,c.jsx)($.h2,{children:"When to use"}),`
`,(0,c.jsxs)($.p,{children:["Use ",(0,c.jsx)($.code,{children:"RadioButtonList"}),` for mutually exclusive selections.
Contrary to the `,(0,c.jsx)($.a,{href:"?path=/docs/forms-radiobuttongroup--radio-buttons",children:"RadioButtonGroup"})," component, ",(0,c.jsx)($.code,{children:"RadioButtonList"})," can contain more than four options because by default it lays out the items vertically."]}),`
`,(0,c.jsxs)($.p,{children:["This component should be used instead of ",(0,c.jsx)($.a,{href:"?path=/docs/forms-select--basic",children:"Select"})," when there is a need for the user to see all of the options available without clicking and scrolling the dropdown."]}),`
`,(0,c.jsx)($.h2,{children:"Usage"}),`
`,(0,c.jsx)($.h3,{children:"Basic radio group"}),`
`,(0,c.jsx)($.pre,{children:(0,c.jsx)($.code,{className:"language-jsx",children:`import { RadioButtonList } from '@grafana/ui';

<RadioButtonGroup options={...} value={...} onChange={...} />

`})}),`
`,(0,c.jsx)($.h3,{children:"Disabled options"}),`
`,(0,c.jsxs)($.p,{children:["You can disable some options by passing them to the ",(0,c.jsx)($.code,{children:"disabledOptions"}),` prop.
Keep in mind the `,(0,c.jsx)($.code,{children:"disabledOptions"})," are compared with options' values by the ",(0,c.jsx)($.code,{children:"==="})," operator."]}),`
`,(0,c.jsx)($.pre,{children:(0,c.jsx)($.code,{className:"language-jsx",children:`import { RadioButtonList } from '@grafana/ui';

const options = [
  { label: 'Prometheus', value: 'prometheus' },
  { label: 'Graphite', value: 'graphite' },
  { label: 'Elastic', value: 'elastic' },
  { label: 'InfluxDB', value: 'influx' },
];

const disabledOptions = ['prometheus', 'elastic'];


<RadioButtonGroup
  options={options}
  disabledOptions={disabledOptions}
  value={...}
  onChange={...}
/>
`})}),`
`,(0,c.jsx)($.h3,{children:"Changing layout"}),`
`,(0,c.jsxs)($.p,{children:["The ",(0,c.jsx)($.code,{children:"RadioButtonList"})," layout uses CSS Grid, so it is effortless to split the list into multiple columns"]}),`
`,(0,c.jsx)($.pre,{children:(0,c.jsx)($.code,{className:"language-jsx",children:`import { RadioButtonList } from '@grafana/ui';

<RadioButtonGroup
  options={...}
  value={...}
  onChange={...}
  className={css\`
    grid-template-columns: 1fr 1fr 1fr;
  \`}
/>

`})}),`
`,(0,c.jsx)(O.xP,{of:d})]})}function w(F={}){const{wrapper:$}=Object.assign({},(0,E.ah)(),F.components);return $?(0,c.jsx)($,Object.assign({},F,{children:(0,c.jsx)(m,F)})):m(F)}var _=w,C=Object.defineProperty,b=Object.getOwnPropertySymbols,g=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable,y=(F,$,R)=>$ in F?C(F,$,{enumerable:!0,configurable:!0,writable:!0,value:R}):F[$]=R,h=(F,$)=>{for(var R in $||($={}))g.call($,R)&&y(F,R,$[R]);if(b)for(var R of b($))v.call($,R)&&y(F,R,$[R]);return F},s=null,o={Default:{startLoc:{col:63,line:72},endLoc:{col:1,line:76},startBody:{col:63,line:72},endBody:{col:1,line:76}},LongLabels:{startLoc:{col:66,line:78},endLoc:{col:1,line:82},startBody:{col:66,line:78},endBody:{col:1,line:82}},ControlledComponent:{startLoc:{col:72,line:84},endLoc:{col:1,line:99},startBody:{col:72,line:84},endBody:{col:1,line:99}},DisabledOptions:{startLoc:{col:63,line:72},endLoc:{col:1,line:76},startBody:{col:63,line:72},endBody:{col:1,line:76}},DisabledCheckedOption:{startLoc:{col:72,line:84},endLoc:{col:1,line:99},startBody:{col:72,line:84},endBody:{col:1,line:99}},DisabledList:{startLoc:{col:63,line:72},endLoc:{col:1,line:76},startBody:{col:63,line:72},endBody:{col:1,line:76}},Dots:{startLoc:{col:27,line:117},endLoc:{col:1,line:144},startBody:{col:27,line:117},endBody:{col:1,line:144}}};const r=[{label:"Option 1",value:"opt-1",description:"A description of Option 1"},{label:"Option 2",value:"opt-2",description:"A description of Option 2"},{label:"Option 3",value:"opt-3",description:"A description of Option 3"},{label:"Option 4",value:"opt-4",description:"A description of Option 4"},{label:"Option 5",value:"opt-5",description:"A description of Option 5"}],u={title:"Forms/RadioButtonList",component:d,parameters:{controls:{exclude:["name","id","keySelector","onChange","className","value"]},docs:{page:_}},argTypes:{value:{options:r.map(F=>F.value)},disabledOptions:{control:"multi-select",options:r.map(F=>F.value)}},args:{options:r,disabled:!1}},p=[{value:"opt-1",label:"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua"},{value:"opt-2",label:"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat."},{value:"opt-3",label:"Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum"},{value:"opt-4",label:"Nulla posuere sollicitudin aliquam ultrices sagittis orci a scelerisque purus. Congue quisque egestas diam in. Sit amet mattis vulputate enim nulla aliquet porttitor lacus. Augue lacus viverra vitae congue eu consequat ac."},{value:"opt-5",label:"Aliquam malesuada bibendum arcu vitae elementum curabitur vitae nunc sed. Elit eget gravida cum sociis natoque penatibus et magnis dis. Varius sit amet mattis vulputate. Et ultrices neque ornare aenean euismod elementum nisi quis eleifend."}],S=({disabled:F,disabledOptions:$})=>t.createElement("div",null,t.createElement(d,{name:"default",options:r,disabled:F,disabledOptions:$})),k=({disabled:F,disabledOptions:$})=>t.createElement("div",null,t.createElement(d,{name:"default",options:p,disabled:F,disabledOptions:$})),D=({disabled:F,disabledOptions:$})=>{const[R,U]=(0,t.useState)(r[0].value);return t.createElement("div",null,t.createElement(d,{name:"default",options:r,value:R,onChange:U,disabled:F,disabledOptions:$}))},M=S.bind({});M.args={disabledOptions:["opt-4","opt-5"]};const I=D.bind({});I.args={value:"opt-2",disabledOptions:["opt-1","opt-2","opt-3"]};const T=S.bind({});T.args={disabled:!0};const j=()=>{const F=({title:$,children:R})=>t.createElement("div",{style:{marginBottom:20}},t.createElement("h5",null,$),R);return t.createElement("div",null,t.createElement(F,{title:"Default"},t.createElement(l,{id:"1",name:"default-empty",label:"Radio label",checked:!1})),t.createElement(F,{title:"Checked"},t.createElement(l,{id:"2",name:"default-checked",label:"Radio label",checked:!0})),t.createElement(F,{title:"Disabled default"},t.createElement(l,{id:"3",name:"disabled-default-empty",label:"Radio label",disabled:!0})),t.createElement(F,{title:"Disabled checked"},t.createElement(l,{id:"4",name:"disabled-default-checked",label:"Radio label",checked:!0,disabled:!0})))};j.parameters={controls:{hideNoControlsWarning:!0}};var K=u;S.parameters=h({storySource:{source:`({ disabled, disabledOptions }) => (
  <div>
    <RadioButtonList name="default" options={defaultOptions} disabled={disabled} disabledOptions={disabledOptions} />
  </div>
)`}},S.parameters),k.parameters=h({storySource:{source:`({ disabled, disabledOptions }) => (
  <div>
    <RadioButtonList name="default" options={longTextOptions} disabled={disabled} disabledOptions={disabledOptions} />
  </div>
)`}},k.parameters),D.parameters=h({storySource:{source:`({ disabled, disabledOptions }) => {
  const [selected, setSelected] = useState<string>(defaultOptions[0].value!);

  return (
    <div>
      <RadioButtonList
        name="default"
        options={defaultOptions}
        value={selected}
        onChange={setSelected}
        disabled={disabled}
        disabledOptions={disabledOptions}
      />
    </div>
  );
}`}},D.parameters),M.parameters=h({storySource:{source:`({ disabled, disabledOptions }) => (
  <div>
    <RadioButtonList name="default" options={defaultOptions} disabled={disabled} disabledOptions={disabledOptions} />
  </div>
)`}},M.parameters),I.parameters=h({storySource:{source:`({ disabled, disabledOptions }) => {
  const [selected, setSelected] = useState<string>(defaultOptions[0].value!);

  return (
    <div>
      <RadioButtonList
        name="default"
        options={defaultOptions}
        value={selected}
        onChange={setSelected}
        disabled={disabled}
        disabledOptions={disabledOptions}
      />
    </div>
  );
}`}},I.parameters),T.parameters=h({storySource:{source:`({ disabled, disabledOptions }) => (
  <div>
    <RadioButtonList name="default" options={defaultOptions} disabled={disabled} disabledOptions={disabledOptions} />
  </div>
)`}},T.parameters),j.parameters=h({storySource:{source:`() => {
  const Wrapper = ({ title, children }: React.PropsWithChildren<{ title: string }>) => (
    <div style={{ marginBottom: 20 }}>
      <h5>{title}</h5>
      {children}
    </div>
  );

  return (
    <div>
      <Wrapper title="Default">
        <RadioButtonDot id="1" name="default-empty" label="Radio label" checked={false} />
      </Wrapper>

      <Wrapper title="Checked">
        <RadioButtonDot id="2" name="default-checked" label="Radio label" checked />
      </Wrapper>

      <Wrapper title="Disabled default">
        <RadioButtonDot id="3" name="disabled-default-empty" label="Radio label" disabled />
      </Wrapper>

      <Wrapper title="Disabled checked">
        <RadioButtonDot id="4" name="disabled-default-checked" label="Radio label" checked disabled />
      </Wrapper>
    </div>
  );
}`}},j.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/RadioButtonList/RadioButtonList.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Forms/RadioButtonList/RadioButtonList.story.tsx#ComponentMeta"})}catch(F){}},"./src/components/Icon/Icon.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{IconsOverview:function(){return k},default:function(){return D}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts"),l=e("./src/components/Icon/Icon.tsx"),f=e("./src/components/Forms/Field.tsx"),x=e("./src/components/Input/Input.tsx"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/types/icon.ts"),c=e("./src/utils/storybook/withCenteredStory.tsx"),E=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),O=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),m=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function w(M){const I=Object.assign({h1:"h1",p:"p",a:"a",h3:"h3",code:"code",pre:"pre"},(0,O.ah)(),M.components);return(0,E.jsxs)(E.Fragment,{children:[(0,E.jsx)(m.h_,{title:"MDX|Icon",component:l.J}),`
`,(0,E.jsx)(I.h1,{children:"Icon"}),`
`,(0,E.jsxs)(I.p,{children:["Grafana's wrapper component over ",(0,E.jsx)(I.a,{href:"https://fontawesome.com/",children:"Font Awesome"})," and Unicons icons"]}),`
`,(0,E.jsx)(I.h3,{children:"Changing icon size"}),`
`,(0,E.jsxs)(I.p,{children:["By default ",(0,E.jsx)(I.code,{children:"Icon"})," has width and height of ",(0,E.jsx)(I.code,{children:"16px"})," and font-size of ",(0,E.jsx)(I.code,{children:"14px"}),". Pass ",(0,E.jsx)(I.code,{children:"className"})," to control icon's size:"]}),`
`,(0,E.jsx)(I.pre,{children:(0,E.jsx)(I.code,{className:"language-jsx",children:`import { css } from '@emotion/css';

<Icon name="check" />;
`})}),`
`,(0,E.jsx)(m.xP,{of:l.J})]})}function _(M={}){const{wrapper:I}=Object.assign({},(0,O.ah)(),M.components);return I?(0,E.jsx)(I,Object.assign({},M,{children:(0,E.jsx)(w,M)})):w(M)}var C=_,b=Object.defineProperty,g=Object.getOwnPropertySymbols,v=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable,h=(M,I,T)=>I in M?b(M,I,{enumerable:!0,configurable:!0,writable:!0,value:T}):M[I]=T,s=(M,I)=>{for(var T in I||(I={}))v.call(I,T)&&h(M,T,I[T]);if(g)for(var T of g(I))y.call(I,T)&&h(M,T,I[T]);return M},o=`import { css } from '@emotion/css';
import { ComponentMeta } from '@storybook/react';
import React, { ChangeEvent, useState } from 'react';

import { toIconName, IconName } from '@grafana/data';
import { Input, Field, Icon } from '@grafana/ui';

import { useTheme2 } from '../../themes';
import { getAvailableIcons } from '../../types';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './Icon.mdx';

const meta: ComponentMeta<typeof Icon> = {
  title: 'Docs overview/Icon',
  component: Icon,
  decorators: [withCenteredStory],
  parameters: {
    options: {
      showPanel: false,
    },
    docs: {
      page: mdx,
    },
  },
};

const IconWrapper = ({ name }: { name: IconName }) => {
  const theme = useTheme2();
  const borderColor = theme.colors.border.medium;

  return (
    <div
      className={css\`
        width: 150px;
        padding: 12px;
        border: 1px solid \${borderColor};
        text-align: center;

        &:hover {
          background: \${borderColor};
        }
      \`}
    >
      <Icon name={name} />
      <div
        className={css\`
          padding-top: 16px;
          word-break: break-all;
          font-family: \${theme.typography.fontFamilyMonospace};
          font-size: \${theme.typography.size.xs};
        \`}
      >
        {name}
      </div>
    </div>
  );
};

const icons = [...getAvailableIcons()];
icons.sort((a, b) => a.localeCompare(b));

export const IconsOverview = () => {
  const [filter, setFilter] = useState('');

  const searchIcon = (event: ChangeEvent<HTMLInputElement>) => {
    setFilter(event.target.value);
  };

  return (
    <div
      className={css\`
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: auto;
        width: 100%;
      \`}
    >
      <Field
        className={css\`
          width: 300px;
        \`}
      >
        <Input onChange={searchIcon} placeholder="Search icons by name" />
      </Field>
      <div
        className={css\`
          display: flex;
          flex-wrap: wrap;
        \`}
      >
        {icons
          .filter((val) => val.includes(filter))
          .map((i) => {
            return <IconWrapper name={toIconName(i)!} key={i} />;
          })}
      </div>
    </div>
  );
};

export default meta;
`,r={IconsOverview:{startLoc:{col:29,line:63},endLoc:{col:1,line:101},startBody:{col:29,line:63},endBody:{col:1,line:101}}};const u={title:"Docs overview/Icon",component:l.J,decorators:[c.BU],parameters:{options:{showPanel:!1},docs:{page:C}}},p=({name:M})=>{const I=(0,d.l4)(),T=I.colors.border.medium;return n.createElement("div",{className:t.iv`
        width: 150px;
        padding: 12px;
        border: 1px solid ${T};
        text-align: center;

        &:hover {
          background: ${T};
        }
      `},n.createElement(l.J,{name:M}),n.createElement("div",{className:t.iv`
          padding-top: 16px;
          word-break: break-all;
          font-family: ${I.typography.fontFamilyMonospace};
          font-size: ${I.typography.size.xs};
        `},M))},S=[...(0,i.BI)()];S.sort((M,I)=>M.localeCompare(I));const k=()=>{const[M,I]=(0,n.useState)(""),T=j=>{I(j.target.value)};return n.createElement("div",{className:t.iv`
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: auto;
        width: 100%;
      `},n.createElement(f.g,{className:t.iv`
          width: 300px;
        `},n.createElement(x.I,{onChange:T,placeholder:"Search icons by name"})),n.createElement("div",{className:t.iv`
          display: flex;
          flex-wrap: wrap;
        `},S.filter(j=>j.includes(M)).map(j=>n.createElement(p,{name:(0,a.iJ)(j),key:j}))))};var D=u;k.parameters=s({storySource:{source:`() => {
  const [filter, setFilter] = useState('');

  const searchIcon = (event: ChangeEvent<HTMLInputElement>) => {
    setFilter(event.target.value);
  };

  return (
    <div
      className={css\`
        display: flex;
        flex-direction: column;
        height: 100%;
        overflow: auto;
        width: 100%;
      \`}
    >
      <Field
        className={css\`
          width: 300px;
        \`}
      >
        <Input onChange={searchIcon} placeholder="Search icons by name" />
      </Field>
      <div
        className={css\`
          display: flex;
          flex-wrap: wrap;
        \`}
      >
        {icons
          .filter((val) => val.includes(filter))
          .map((i) => {
            return <IconWrapper name={toIconName(i)!} key={i} />;
          })}
      </div>
    </div>
  );
}`}},k.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Icon/Icon.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Icon/Icon.story.tsx#ComponentMeta"})}catch(M){}},"./src/components/IconButton/IconButton.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return r},Examples:function(){return o},default:function(){return p}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("./src/components/Layout/Layout.tsx"),x=e("./src/components/IconButton/IconButton.tsx"),d=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),i=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),c=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function E(S){const k=Object.assign({h1:"h1",p:"p",code:"code"},(0,i.ah)(),S.components);return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(c.h_,{title:"MDX|IconButton",component:x.h}),`
`,(0,d.jsx)(k.h1,{children:"IconButton"}),`
`,(0,d.jsx)(k.p,{children:"This component looks like just an icon but behaves like a button. It fulfils an action when you click it and has hover and focus states. You can choose which icon size you would like to use."}),`
`,(0,d.jsxs)(k.p,{children:[(0,d.jsx)(k.code,{children:"IconButton"})," is best used when an actual button would look out of place, for example when you want to place a solitary clickable icon next to text. An example where an ",(0,d.jsx)(k.code,{children:"IconButton"})," is used in Grafana is the top left back arrow in the panel edit mode."]}),`
`,(0,d.jsx)(c.xP,{of:x.h})]})}function O(S={}){const{wrapper:k}=Object.assign({},(0,i.ah)(),S.components);return k?(0,d.jsx)(k,Object.assign({},S,{children:(0,d.jsx)(E,S)})):E(S)}var m=O,w=Object.defineProperty,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(S,k,D)=>k in S?w(S,k,{enumerable:!0,configurable:!0,writable:!0,value:D}):S[k]=D,v=(S,k)=>{for(var D in k||(k={}))C.call(k,D)&&g(S,D,k[D]);if(_)for(var D of _(k))b.call(k,D)&&g(S,D,k[D]);return S},y=null,h={Examples:{startLoc:{col:24,line:38},endLoc:{col:1,line:46},startBody:{col:24,line:38},endBody:{col:1,line:46}},Basic:{startLoc:{col:56,line:48},endLoc:{col:1,line:50},startBody:{col:56,line:48},endBody:{col:1,line:50}}};const s={title:"Buttons/IconButton",component:x.h,decorators:[l.BU],parameters:{docs:{page:m}},args:{name:"apps",size:"md",iconType:"default",tooltip:"sample tooltip message",tooltipPlacement:"top",variant:"secondary",ariaLabel:"sample aria-label content"},argTypes:{tooltip:{control:"text"}}},o=()=>n.createElement("div",null,n.createElement(u,{background:"canvas"}),n.createElement(u,{background:"primary"}),n.createElement(u,{background:"secondary"})),r=S=>n.createElement(x.h,v({},S)),u=({background:S})=>{const k=(0,a.l4)(),D=["sm","md","lg","xl","xxl"],M=["search","trash-alt","arrow-left","times"],I=["secondary","primary","destructive"];return n.createElement("div",{className:t.iv`
        padding: 30px;
        background: ${k.colors.background[S]};
        button {
          margin-right: 8px;
          margin-left: 8px;
          margin-bottom: 8px;
        }
      `},n.createElement(f.wc,{spacing:"md"},n.createElement("div",null,S),I.map(T=>n.createElement("div",{key:T},M.map(j=>D.map(K=>n.createElement("span",{key:j+K},n.createElement(x.h,{name:j,size:K,variant:T}))))))))};var p=s;o.parameters=v({storySource:{source:`() => {
  return (
    <div>
      <RenderScenario background="canvas" />
      <RenderScenario background="primary" />
      <RenderScenario background="secondary" />
    </div>
  );
}`}},o.parameters),r.parameters=v({storySource:{source:`(args: IconButtonProps) => {
  return <IconButton {...args} />;
}`}},r.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/IconButton/IconButton.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/IconButton/IconButton.story.tsx#ComponentMeta"})}catch(S){}},"./src/components/InfoBox/InfoBox.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{default:function(){return Oe},featureInfoBox:function(){return Ze},infoBox:function(){return qe}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=Object.defineProperty,a=Object.defineProperties,l=Object.getOwnPropertyDescriptors,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(ce,pe,J)=>pe in ce?n(ce,pe,{enumerable:!0,configurable:!0,writable:!0,value:J}):ce[pe]=J,c=(ce,pe)=>{for(var J in pe||(pe={}))x.call(pe,J)&&i(ce,J,pe[J]);if(f)for(var J of f(pe))d.call(pe,J)&&i(ce,J,pe[J]);return ce},E=(ce,pe)=>a(ce,l(pe)),O=(ce=>(ce.CloudAlerting="cloud-alerting",ce.UnifiedAlerting="unified-alerting",ce.Dashboard="dashboard",ce.Explore="explore",ce.Correlations="correlations",ce.Unknown="unknown",ce.PanelEditor="panel-editor",ce.PanelViewer="panel-viewer",ce))(O||{});class m extends null{constructor(){super(...arguments),this._extensionConfigs=[]}init(pe){}setRootPage(pe){return this.root=pe,this}setComponentsFromLegacyExports(pe){if(pe.ConfigCtrl&&(this.angularConfigCtrl=pe.ConfigCtrl),this.meta&&this.meta.includes){for(const J of this.meta.includes)if(J.type===PluginIncludeType.page&&J.component&&!pe[J.component]){console.warn("App Page uses unknown component: ",J.component,this.meta);continue}}}get extensionConfigs(){return this._extensionConfigs}configureExtensionLink(pe){return this._extensionConfigs.push(E(c({},pe),{type:PluginExtensionTypes.link})),this}}var w=(ce=>(ce.alpha="alpha",ce.beta="beta",ce))(w||{}),_=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),C=e("./src/themes/ThemeContext.tsx"),b=e("./src/themes/stylesFactory.ts"),g=e("./src/components/Alert/Alert.tsx"),v=e("./src/components/Icon/Icon.tsx"),y=Object.defineProperty,h=Object.defineProperties,s=Object.getOwnPropertyDescriptors,o=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable,p=(ce,pe,J)=>pe in ce?y(ce,pe,{enumerable:!0,configurable:!0,writable:!0,value:J}):ce[pe]=J,S=(ce,pe)=>{for(var J in pe||(pe={}))r.call(pe,J)&&p(ce,J,pe[J]);if(o)for(var J of o(pe))u.call(pe,J)&&p(ce,J,pe[J]);return ce},k=(ce,pe)=>h(ce,s(pe)),D=(ce,pe)=>{var J={};for(var L in ce)r.call(ce,L)&&pe.indexOf(L)<0&&(J[L]=ce[L]);if(ce!=null&&o)for(var L of o(ce))pe.indexOf(L)<0&&u.call(ce,L)&&(J[L]=ce[L]);return J};const M=t.memo(t.forwardRef((ce,pe)=>{var J=ce,{title:L,className:fe,children:xe,branded:We,url:Ue,urlTitle:at,onDismiss:it,severity:_t="info"}=J,wt=D(J,["title","className","children","branded","url","urlTitle","onDismiss","severity"]);const ee=(0,C.wW)(I);return t.createElement(g.b,k(S({severity:_t,className:fe},wt),{ref:pe,title:L}),t.createElement("div",null,xe),Ue&&t.createElement("a",{href:Ue,className:(0,_.cx)("external-link",ee.docsLink),target:"_blank",rel:"noreferrer"},t.createElement(v.J,{name:"book"})," ",at||"Read more"))}));M.displayName="InfoBox";const I=(0,b.B)(ce=>({docsLink:_.iv`
      display: inline-block;
      margin-top: ${ce.spacing(2)};
    `}));try{M.displayName="InfoBox",M.__docgenInfo={description:"",displayName:"InfoBox",props:{title:{defaultValue:null,description:"Title of the box",name:"title",required:!1,type:{name:"string | Element"}},url:{defaultValue:null,description:"Url of the read more link",name:"url",required:!1,type:{name:"string"}},urlTitle:{defaultValue:null,description:"Text of the read more link",name:"urlTitle",required:!1,type:{name:"string"}},branded:{defaultValue:null,description:"Indicates whether or not box should be rendered with Grafana branding background",name:"branded",required:!1,type:{name:"boolean"}},severity:{defaultValue:null,description:"Color variant of the box",name:"severity",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"warning"'},{value:'"error"'},{value:'"info"'}]}},onDismiss:{defaultValue:null,description:"Call back to be performed when box is dismissed",name:"onDismiss",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/InfoBox/InfoBox.tsx#InfoBox"]={docgenInfo:M.__docgenInfo,name:"InfoBox",path:"src/components/InfoBox/InfoBox.tsx#InfoBox"})}catch(ce){}var T=e("./src/components/Layout/Layout.tsx"),j=e("./src/components/Badge/Badge.tsx"),K=Object.defineProperty,F=Object.getOwnPropertySymbols,$=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable,U=(ce,pe,J)=>pe in ce?K(ce,pe,{enumerable:!0,configurable:!0,writable:!0,value:J}):ce[pe]=J,H=(ce,pe)=>{for(var J in pe||(pe={}))$.call(pe,J)&&U(ce,J,pe[J]);if(F)for(var J of F(pe))R.call(pe,J)&&U(ce,J,pe[J]);return ce},W=(ce,pe)=>{var J={};for(var L in ce)$.call(ce,L)&&pe.indexOf(L)<0&&(J[L]=ce[L]);if(ce!=null&&F)for(var L of F(ce))pe.indexOf(L)<0&&R.call(ce,L)&&(J[L]=ce[L]);return J};const oe=t.memo(t.forwardRef((ce,pe)=>{var J=ce,{title:L,featureState:fe}=J,xe=W(J,["title","featureState"]);const We=(0,C.wW)(Q),Ue=fe?t.createElement(t.Fragment,null,t.createElement("div",{className:We.badge},t.createElement(P,{featureState:fe})),t.createElement("h3",null,L)):t.createElement("h3",null,L);return t.createElement(M,H({branded:!0,title:Ue,urlTitle:"Read documentation",ref:pe},xe))}));oe.displayName="FeatureInfoBox";const Q=ce=>({badge:_.iv`
      margin-bottom: ${ce.spacing(1)};
    `}),P=({featureState:ce,tooltip:pe})=>{const J=ae(ce);return t.createElement(j.C,{text:J.text,color:J.color,icon:J.icon,tooltip:pe})};function ae(ce){switch(ce){case w.alpha:return{text:"Alpha",icon:"exclamation-triangle",color:"orange"}}return{text:"Beta",icon:"rocket",color:"blue"}}try{oe.displayName="FeatureInfoBox",oe.__docgenInfo={description:"",displayName:"FeatureInfoBox",props:{title:{defaultValue:null,description:"",name:"title",required:!0,type:{name:"string"}},featureState:{defaultValue:null,description:"",name:"featureState",required:!1,type:{name:"enum",value:[{value:'"alpha"'},{value:'"beta"'}]}},severity:{defaultValue:null,description:"Color variant of the box",name:"severity",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"warning"'},{value:'"error"'},{value:'"info"'}]}},onDismiss:{defaultValue:null,description:"Call back to be performed when box is dismissed",name:"onDismiss",required:!1,type:{name:"(() => void)"}},url:{defaultValue:null,description:"Url of the read more link",name:"url",required:!1,type:{name:"string"}},branded:{defaultValue:null,description:"Indicates whether or not box should be rendered with Grafana branding background",name:"branded",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/InfoBox/FeatureInfoBox.tsx#FeatureInfoBox"]={docgenInfo:oe.__docgenInfo,name:"FeatureInfoBox",path:"src/components/InfoBox/FeatureInfoBox.tsx#FeatureInfoBox"})}catch(ce){}var q=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),Y=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),ve=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function re(ce){const pe=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,Y.ah)(),ce.components);return(0,q.jsxs)(q.Fragment,{children:[(0,q.jsx)(ve.h_,{title:"MDX|InfoBox",component:M}),`
`,(0,q.jsx)(pe.h1,{children:"InfoBox"}),`
`,(0,q.jsx)(pe.p,{children:"A component for displaying information in different levels of severity (Success, Warning, Error, Info)."}),`
`,(0,q.jsx)(pe.h3,{children:"Example usage"}),`
`,(0,q.jsx)(pe.p,{children:"This component can be found in the settings for various data sources."}),`
`,(0,q.jsx)(pe.pre,{children:(0,q.jsx)(pe.code,{className:"language-tsx",children:`<InfoBox title="Example info box" severity="info" url="http://url.to.some.documentation" onDismiss={dissmisInfoBox} />
`})}),`
`,(0,q.jsx)(ve.xP,{of:M})]})}function je(ce={}){const{wrapper:pe}=Object.assign({},(0,Y.ah)(),ce.components);return pe?(0,q.jsx)(pe,Object.assign({},ce,{children:(0,q.jsx)(re,ce)})):re(ce)}var me=je,ne=Object.defineProperty,Z=Object.getOwnPropertySymbols,te=Object.prototype.hasOwnProperty,Pe=Object.prototype.propertyIsEnumerable,he=(ce,pe,J)=>pe in ce?ne(ce,pe,{enumerable:!0,configurable:!0,writable:!0,value:J}):ce[pe]=J,ie=(ce,pe)=>{for(var J in pe||(pe={}))te.call(pe,J)&&he(ce,J,pe[J]);if(Z)for(var J of Z(pe))Pe.call(pe,J)&&he(ce,J,pe[J]);return ce},Ce=`import { Meta, ComponentStory } from '@storybook/react';
import React from 'react';

import { FeatureState } from '@grafana/data';
import { InfoBox, FeatureInfoBox, VerticalGroup } from '@grafana/ui';

import { FeatureInfoBoxProps } from './FeatureInfoBox';
import mdx from './InfoBox.mdx';

const meta: Meta = {
  title: 'Layout/InfoBox',
  component: InfoBox,
  decorators: [],
  parameters: {
    docs: {
      page: mdx,
    },
    knobs: {
      disable: true,
    },
    controls: {
      exclude: ['onDismiss', 'children'],
    },
  },
  argTypes: {
    featureState: {
      control: { type: 'select', options: ['alpha', 'beta', undefined] },
    },
  },
};

const defaultProps: FeatureInfoBoxProps = {
  title: 'A title',
  severity: 'info',
  url: 'http://www.grafana.com',
  featureState: FeatureState.beta,

  children: (
    <p>
      The database user should only be granted SELECT permissions on the specified database &amp; tables you want to
      query. Grafana does not validate that queries are safe so queries can contain any SQL statement. For example,
      statements like <code>USE otherdb;</code> and <code>DROP TABLE user;</code> would be executed. To protect against
      this we <strong>Highly</strong> recommend you create a specific MySQL user with restricted permissions.
    </p>
  ),
};

const InfoBoxTemplate: ComponentStory<typeof InfoBox> = (args) => {
  return (
    <VerticalGroup>
      <div>Deprecrated component, use Alert with info severity</div>
      <InfoBox {...args} />;
    </VerticalGroup>
  );
};
export const infoBox = InfoBoxTemplate.bind({});
infoBox.args = defaultProps;

const FeatureInfoBoxTemplate: ComponentStory<typeof FeatureInfoBox> = (args) => {
  return (
    <VerticalGroup>
      <div>Deprecrated component, use Alert with info severity</div>
      <FeatureInfoBox {...args} />
    </VerticalGroup>
  );
};

export const featureInfoBox = FeatureInfoBoxTemplate.bind({});
featureInfoBox.args = defaultProps;

export default meta;
`,Le={infoBox:{startLoc:{col:56,line:48},endLoc:{col:1,line:55},startBody:{col:56,line:48},endBody:{col:1,line:55}},featureInfoBox:{startLoc:{col:70,line:59},endLoc:{col:1,line:66},startBody:{col:70,line:59},endBody:{col:1,line:66}}};const we={title:"Layout/InfoBox",component:M,decorators:[],parameters:{docs:{page:me},knobs:{disable:!0},controls:{exclude:["onDismiss","children"]}},argTypes:{featureState:{control:{type:"select",options:["alpha","beta",void 0]}}}},ue={title:"A title",severity:"info",url:"http://www.grafana.com",featureState:w.beta,children:t.createElement("p",null,"The database user should only be granted SELECT permissions on the specified database & tables you want to query. Grafana does not validate that queries are safe so queries can contain any SQL statement. For example, statements like ",t.createElement("code",null,"USE otherdb;")," and ",t.createElement("code",null,"DROP TABLE user;")," would be executed. To protect against this we ",t.createElement("strong",null,"Highly")," recommend you create a specific MySQL user with restricted permissions.")},qe=(ce=>t.createElement(T.wc,null,t.createElement("div",null,"Deprecrated component, use Alert with info severity"),t.createElement(M,ie({},ce)),";")).bind({});qe.args=ue;const Ze=(ce=>t.createElement(T.wc,null,t.createElement("div",null,"Deprecrated component, use Alert with info severity"),t.createElement(oe,ie({},ce)))).bind({});Ze.args=ue;var Oe=we;qe.parameters=ie({storySource:{source:`(args) => {
  return (
    <VerticalGroup>
      <div>Deprecrated component, use Alert with info severity</div>
      <InfoBox {...args} />;
    </VerticalGroup>
  );
}`}},qe.parameters),Ze.parameters=ie({storySource:{source:`(args) => {
  return (
    <VerticalGroup>
      <div>Deprecrated component, use Alert with info severity</div>
      <FeatureInfoBox {...args} />
    </VerticalGroup>
  );
}`}},Ze.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/InfoBox/InfoBox.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/InfoBox/InfoBox.story.tsx#Meta"})}catch(ce){}},"./src/components/Input/AutoSizeInput.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Simple:function(){return W},default:function(){return oe}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/measureText.ts"),a=e("./src/components/Input/Input.tsx"),l=Object.defineProperty,f=Object.defineProperties,x=Object.getOwnPropertyDescriptors,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(Q,P,ae)=>P in Q?l(Q,P,{enumerable:!0,configurable:!0,writable:!0,value:ae}):Q[P]=ae,O=(Q,P)=>{for(var ae in P||(P={}))i.call(P,ae)&&E(Q,ae,P[ae]);if(d)for(var ae of d(P))c.call(P,ae)&&E(Q,ae,P[ae]);return Q},m=(Q,P)=>f(Q,x(P)),w=(Q,P)=>{var ae={};for(var q in Q)i.call(Q,q)&&P.indexOf(q)<0&&(ae[q]=Q[q]);if(Q!=null&&d)for(var q of d(Q))P.indexOf(q)<0&&c.call(Q,q)&&(ae[q]=Q[q]);return ae};const _=t.forwardRef((Q,P)=>{const ae=Q,{defaultValue:q="",minWidth:Y=10,maxWidth:ve,onCommitChange:re,onKeyDown:je,onBlur:me}=ae,ne=w(ae,["defaultValue","minWidth","maxWidth","onCommitChange","onKeyDown","onBlur"]),[Z,te]=t.useState(q),[Pe,he]=t.useState(Y);return(0,t.useEffect)(()=>{he(C(Z.toString(),Y,ve))},[Z,ve,Y]),t.createElement(a.I,m(O({},ne),{ref:P,value:Z.toString(),onChange:ie=>{te(ie.currentTarget.value)},width:Pe,onBlur:ie=>{me?me(ie):re&&re(ie)},onKeyDown:ie=>{je?je(ie):ie.key==="Enter"&&re&&re(ie)},"data-testid":"autosize-input"}))});function C(Q,P,ae){if(!Q)return P;const q=3,Y=(0,n.X1)(Q.toString(),14).width/8+q;return P&&Y<P?P:ae&&Y>ae?ae:Y}_.displayName="AutoSizeInput";try{_.displayName="AutoSizeInput",_.__docgenInfo={description:"",displayName:"AutoSizeInput",props:{prefix:{defaultValue:null,description:"Show an icon as a prefix in the input",name:"prefix",required:!1,type:{name:"ReactNode"}},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"}},loading:{defaultValue:null,description:"Show a loading indicator as a suffix in the input",name:"loading",required:!1,type:{name:"boolean"}},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"}},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"}},minWidth:{defaultValue:null,description:"Sets the min-width to a multiple of 8px. Default value is 10",name:"minWidth",required:!1,type:{name:"number"}},maxWidth:{defaultValue:null,description:"Sets the max-width to a multiple of 8px.",name:"maxWidth",required:!1,type:{name:"number"}},onCommitChange:{defaultValue:null,description:"onChange function that will be run on onBlur and onKeyPress with enter",name:"onCommitChange",required:!1,type:{name:"((event: FormEvent<HTMLInputElement>) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Input/AutoSizeInput.tsx#AutoSizeInput"]={docgenInfo:_.__docgenInfo,name:"AutoSizeInput",path:"src/components/Input/AutoSizeInput.tsx#AutoSizeInput"})}catch(Q){}var b=e("./src/components/Button/Button.tsx"),g=e("./src/utils/storybook/icons.ts"),v=e("./src/utils/storybook/withCenteredStory.tsx"),y=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),h=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),s=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),o=e("./src/components/Forms/Field.tsx"),r=e("./src/components/Icon/Icon.tsx");function u(Q){const P=Object.assign({h1:"h1",p:"p",code:"code",h2:"h2",pre:"pre"},(0,h.ah)(),Q.components);return(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(P.h1,{children:"AutoSizeInput"}),`
`,(0,y.jsxs)(P.p,{children:["You can use it or regular text input. When used, AutoSizeInput resizes itself to the current content. For an array of data or tree-structured data, consider using ",(0,y.jsx)(P.code,{children:"Select"})," or ",(0,y.jsx)(P.code,{children:"Cascader"})," respectively."]}),`
`,(0,y.jsx)(P.h2,{children:"Prefix and suffix"}),`
`,(0,y.jsxs)(P.p,{children:["To add more context to the input, you can add either text or an icon before or after the input using the ",(0,y.jsx)(P.code,{children:"prefix"})," and ",(0,y.jsx)(P.code,{children:"suffix"}),". Here are some examples for you to try in the canvas!"]}),`
`,(0,y.jsx)(P.pre,{children:(0,y.jsx)(P.code,{className:"language-jsx",children:`<AutoSizeInput prefix={<Icon name="search" />} />
`})}),`
`,(0,y.jsx)(s.MB,{children:(0,y.jsx)(_,{prefix:(0,y.jsx)(r.J,{name:"search"})})}),`
`,(0,y.jsx)(P.h2,{children:"Usage in forms with Field"}),`
`,(0,y.jsxs)(P.p,{children:["Use ",(0,y.jsx)(P.code,{children:"AutoSizeInput"}),"with the",(0,y.jsx)(P.code,{children:"Field"}),"component to get labels and descriptions. Also, you can use",(0,y.jsx)(P.code,{children:"AutoSizeInput"}),"with the",(0,y.jsx)(P.code,{children:"required"}),"attribute for validation. See the",(0,y.jsx)(P.code,{children:"Field"})," component for more information."]}),`
`,(0,y.jsx)(P.pre,{children:(0,y.jsx)(P.code,{className:"language-jsx",children:`<Field label="Important information" description="This information is very important, so you really need to fill it in">
  <AutoSizeInput name="importantInput" required />
</Field>
`})}),`
`,(0,y.jsx)(s.MB,{children:(0,y.jsx)(o.g,{label:"Important information!",description:"Please enter the relevant information.",children:(0,y.jsx)(_,{name:"importantInput",required:!0})})}),`
`,(0,y.jsx)(s.xP,{of:_})]})}function p(Q={}){const{wrapper:P}=Object.assign({},(0,h.ah)(),Q.components);return P?(0,y.jsx)(P,Object.assign({},Q,{children:(0,y.jsx)(u,Q)})):u(Q)}var S=p,k=e("./src/components/Input/storyUtils.tsx"),D=Object.defineProperty,M=Object.getOwnPropertySymbols,I=Object.prototype.hasOwnProperty,T=Object.prototype.propertyIsEnumerable,j=(Q,P,ae)=>P in Q?D(Q,P,{enumerable:!0,configurable:!0,writable:!0,value:ae}):Q[P]=ae,K=(Q,P)=>{for(var ae in P||(P={}))I.call(P,ae)&&j(Q,ae,P[ae]);if(M)for(var ae of M(P))T.call(P,ae)&&j(Q,ae,P[ae]);return Q},F=`import { Story, Meta } from '@storybook/react';
import React from 'react';

import { Button, AutoSizeInput } from '@grafana/ui';

import { iconOptions } from '../../utils/storybook/icons';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './AutoSizeInput.mdx';
import { parseAccessory } from './storyUtils';

const icons: { [key: string]: string | undefined } = { ...iconOptions };
Object.keys(icons).forEach((key) => {
  icons[key] = \`icon-\${icons[key]}\`;
});

const prefixSuffixOpts = {
  Text: '$',
  ...icons,
};

const meta: Meta = {
  title: 'Forms/Input/AutoSizeInput',
  component: AutoSizeInput,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['prefix', 'suffix', 'addonBefore', 'addonAfter'],
    },
  },
  args: {
    type: 'text',
    width: 40,
    prefixVisible: '',
    suffixVisible: '',
    invalid: false,
    loading: false,
  },
  argTypes: {
    prefixVisible: {
      control: {
        type: 'select',
        options: prefixSuffixOpts,
      },
    },
    suffixVisible: {
      control: {
        type: 'select',
        options: prefixSuffixOpts,
      },
    },
    type: {
      control: {
        type: 'select',
        options: ['text', 'number', 'password'],
      },
    },
    minWidth: { control: { type: 'range', min: 10, max: 200, step: 10 } },
  },
};

export const Simple: Story = (args) => {
  const addonAfter = <Button variant="secondary">Load</Button>;
  const addonBefore = <div style={{ display: 'flex', alignItems: 'center', padding: '5px' }}>AutoSizeInput</div>;
  const prefix = parseAccessory(args.prefixVisible);
  const suffix = parseAccessory(args.suffixVisible);

  return (
    <AutoSizeInput
      disabled={args.disabled}
      prefix={prefix}
      invalid={args.invalid}
      width={args.width}
      suffix={suffix}
      loading={args.loading}
      addonBefore={args.before && addonBefore}
      addonAfter={args.after && addonAfter}
      type={args.type}
      placeholder={args.placeholder}
      minWidth={args.minWidth}
    />
  );
};
Simple.args = {
  disabled: false,
  before: false,
  after: false,
  placeholder: 'Enter your name here...',
};

export default meta;
`,$={Simple:{startLoc:{col:29,line:65},endLoc:{col:1,line:86},startBody:{col:29,line:65},endBody:{col:1,line:86}}};const R=K({},g.N);Object.keys(R).forEach(Q=>{R[Q]=`icon-${R[Q]}`});const U=K({Text:"$"},R),H={title:"Forms/Input/AutoSizeInput",component:_,decorators:[v.BU],parameters:{docs:{page:S},controls:{exclude:["prefix","suffix","addonBefore","addonAfter"]}},args:{type:"text",width:40,prefixVisible:"",suffixVisible:"",invalid:!1,loading:!1},argTypes:{prefixVisible:{control:{type:"select",options:U}},suffixVisible:{control:{type:"select",options:U}},type:{control:{type:"select",options:["text","number","password"]}},minWidth:{control:{type:"range",min:10,max:200,step:10}}}},W=Q=>{const P=t.createElement(b.zx,{variant:"secondary"},"Load"),ae=t.createElement("div",{style:{display:"flex",alignItems:"center",padding:"5px"}},"AutoSizeInput"),q=(0,k.J)(Q.prefixVisible),Y=(0,k.J)(Q.suffixVisible);return t.createElement(_,{disabled:Q.disabled,prefix:q,invalid:Q.invalid,width:Q.width,suffix:Y,loading:Q.loading,addonBefore:Q.before&&ae,addonAfter:Q.after&&P,type:Q.type,placeholder:Q.placeholder,minWidth:Q.minWidth})};W.args={disabled:!1,before:!1,after:!1,placeholder:"Enter your name here..."};var oe=H;W.parameters=K({storySource:{source:`(args) => {
  const addonAfter = <Button variant="secondary">Load</Button>;
  const addonBefore = <div style={{ display: 'flex', alignItems: 'center', padding: '5px' }}>AutoSizeInput</div>;
  const prefix = parseAccessory(args.prefixVisible);
  const suffix = parseAccessory(args.suffixVisible);

  return (
    <AutoSizeInput
      disabled={args.disabled}
      prefix={prefix}
      invalid={args.invalid}
      width={args.width}
      suffix={suffix}
      loading={args.loading}
      addonBefore={args.before && addonBefore}
      addonAfter={args.after && addonAfter}
      type={args.type}
      placeholder={args.placeholder}
      minWidth={args.minWidth}
    />
  );
}`}},W.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Input/AutoSizeInput.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Input/AutoSizeInput.story.tsx#Meta"})}catch(Q){}},"./src/components/Input/Input.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Simple:function(){return D},WithFieldValidation:function(){return M},default:function(){return I}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Input/Input.tsx"),a=e("./src/components/Button/Button.tsx"),l=e("./src/components/Forms/Field.tsx"),f=e("./src/types/icon.ts"),x=e("./src/utils/storybook/withCenteredStory.tsx"),d=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),i=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),c=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),E=e("./src/components/Icon/Icon.tsx");function O(T){const j=Object.assign({h1:"h1",p:"p",code:"code",h2:"h2",pre:"pre"},(0,i.ah)(),T.components);return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(j.h1,{children:"Input"}),`
`,(0,d.jsxs)(j.p,{children:["Used for regular text input. For an array of data or tree-structured data, consider using ",(0,d.jsx)(j.code,{children:"Select"})," or ",(0,d.jsx)(j.code,{children:"Cascader"})," respectively."]}),`
`,(0,d.jsx)(j.h2,{children:"Prefix and suffix"}),`
`,(0,d.jsxs)(j.p,{children:["To add more context to the input you can add either text or an icon before or after the input. You can use the ",(0,d.jsx)(j.code,{children:"prefix"})," and ",(0,d.jsx)(j.code,{children:"suffix"})," props for this. Try some examples in the canvas!"]}),`
`,(0,d.jsx)(j.pre,{children:(0,d.jsx)(j.code,{className:"language-jsx",children:`<Input prefix={<Icon name="search" />} />
`})}),`
`,(0,d.jsx)(c.MB,{children:(0,d.jsx)(n.I,{prefix:(0,d.jsx)(E.J,{name:"search"})})}),`
`,(0,d.jsx)(j.h2,{children:"Usage in forms with Field"}),`
`,(0,d.jsxs)(j.p,{children:[(0,d.jsx)(j.code,{children:"Input"})," should be used with the ",(0,d.jsx)(j.code,{children:"Field"})," component to get labels and descriptions. It can also be used for validation by using the ",(0,d.jsx)(j.code,{children:"required"})," attribute. See the ",(0,d.jsx)(j.code,{children:"Field"})," component for more information."]}),`
`,(0,d.jsx)(j.pre,{children:(0,d.jsx)(j.code,{className:"language-jsx",children:`<Field label="Important information" description="This information is very important, so you really need to fill it in">
  <Input name="importantInput" required />
</Field>
`})}),`
`,(0,d.jsx)(c.MB,{children:(0,d.jsx)(l.g,{label:"Important information",description:"This information is very important, so you really need to fill it in",children:(0,d.jsx)(n.I,{name:"importantInput",required:!0})})}),`
`,(0,d.jsx)(c.xP,{of:n.I})]})}function m(T={}){const{wrapper:j}=Object.assign({},(0,i.ah)(),T.components);return j?(0,d.jsx)(j,Object.assign({},T,{children:(0,d.jsx)(O,T)})):O(T)}var w=m,_=e("./src/components/Input/storyUtils.tsx"),C=Object.defineProperty,b=Object.defineProperties,g=Object.getOwnPropertyDescriptors,v=Object.getOwnPropertySymbols,y=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,s=(T,j,K)=>j in T?C(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,o=(T,j)=>{for(var K in j||(j={}))y.call(j,K)&&s(T,K,j[K]);if(v)for(var K of v(j))h.call(j,K)&&s(T,K,j[K]);return T},r=(T,j)=>b(T,g(j)),u=`import { Story, Meta } from '@storybook/react';
import React, { useState } from 'react';

import { KeyValue } from '@grafana/data';
import { Field, Button, Input } from '@grafana/ui';

import { getAvailableIcons } from '../../types';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './Input.mdx';
import { parseAccessory } from './storyUtils';

const prefixSuffixOpts = {
  None: null,
  Text: '$',
  ...getAvailableIcons().reduce<KeyValue<string>>((prev, c) => {
    return {
      ...prev,
      [\`Icon: \${c}\`]: \`icon-\${c}\`,
    };
  }, {}),
};

const meta: Meta = {
  title: 'Forms/Input',
  component: Input,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['prefix', 'suffix', 'addonBefore', 'addonAfter'],
    },
  },
  args: {
    type: 'text',
    width: 40,
    prefixVisible: '',
    suffixVisible: '',
    invalid: false,
    loading: false,
  },
  argTypes: {
    prefixVisible: {
      control: {
        type: 'select',
        options: prefixSuffixOpts,
      },
    },
    suffixVisible: {
      control: {
        type: 'select',
        options: prefixSuffixOpts,
      },
    },
    type: {
      control: {
        type: 'select',
        options: ['text', 'number', 'password'],
      },
    },
    // validation: { name: 'Validation regex (will do a partial match if you do not anchor it)' },
    width: { control: { type: 'range', min: 10, max: 200, step: 10 } },
  },
};

export const Simple: Story = (args) => {
  const addonAfter = <Button variant="secondary">Load</Button>;
  const addonBefore = <div style={{ display: 'flex', alignItems: 'center', padding: '5px' }}>Input</div>;
  const prefix = parseAccessory(args.prefixVisible);
  const suffix = parseAccessory(args.suffixVisible);

  return (
    <Input
      disabled={args.disabled}
      width={args.width}
      prefix={prefix}
      invalid={args.invalid}
      suffix={suffix}
      loading={args.loading}
      addonBefore={args.before && addonBefore}
      addonAfter={args.after && addonAfter}
      type={args.type}
      placeholder={args.placeholder}
    />
  );
};
Simple.args = {
  disabled: false,
  before: false,
  after: false,
  placeholder: 'Enter your name here...',
};

export const WithFieldValidation: Story = (args) => {
  const [value, setValue] = useState('');

  return (
    <div>
      <Field invalid={value === ''} error={value === '' ? 'This input is required' : ''}>
        <Input value={value} onChange={(e) => setValue(e.currentTarget.value)} {...args} />
      </Field>
    </div>
  );
};

export default meta;
`,p={Simple:{startLoc:{col:29,line:68},endLoc:{col:1,line:88},startBody:{col:29,line:68},endBody:{col:1,line:88}},WithFieldValidation:{startLoc:{col:42,line:96},endLoc:{col:1,line:106},startBody:{col:42,line:96},endBody:{col:1,line:106}}};const S=o({None:null,Text:"$"},(0,f.BI)().reduce((T,j)=>r(o({},T),{[`Icon: ${j}`]:`icon-${j}`}),{})),k={title:"Forms/Input",component:n.I,decorators:[x.BU],parameters:{docs:{page:w},controls:{exclude:["prefix","suffix","addonBefore","addonAfter"]}},args:{type:"text",width:40,prefixVisible:"",suffixVisible:"",invalid:!1,loading:!1},argTypes:{prefixVisible:{control:{type:"select",options:S}},suffixVisible:{control:{type:"select",options:S}},type:{control:{type:"select",options:["text","number","password"]}},width:{control:{type:"range",min:10,max:200,step:10}}}},D=T=>{const j=t.createElement(a.zx,{variant:"secondary"},"Load"),K=t.createElement("div",{style:{display:"flex",alignItems:"center",padding:"5px"}},"Input"),F=(0,_.J)(T.prefixVisible),$=(0,_.J)(T.suffixVisible);return t.createElement(n.I,{disabled:T.disabled,width:T.width,prefix:F,invalid:T.invalid,suffix:$,loading:T.loading,addonBefore:T.before&&K,addonAfter:T.after&&j,type:T.type,placeholder:T.placeholder})};D.args={disabled:!1,before:!1,after:!1,placeholder:"Enter your name here..."};const M=T=>{const[j,K]=(0,t.useState)("");return t.createElement("div",null,t.createElement(l.g,{invalid:j==="",error:j===""?"This input is required":""},t.createElement(n.I,o({value:j,onChange:F=>K(F.currentTarget.value)},T))))};var I=k;D.parameters=o({storySource:{source:`(args) => {
  const addonAfter = <Button variant="secondary">Load</Button>;
  const addonBefore = <div style={{ display: 'flex', alignItems: 'center', padding: '5px' }}>Input</div>;
  const prefix = parseAccessory(args.prefixVisible);
  const suffix = parseAccessory(args.suffixVisible);

  return (
    <Input
      disabled={args.disabled}
      width={args.width}
      prefix={prefix}
      invalid={args.invalid}
      suffix={suffix}
      loading={args.loading}
      addonBefore={args.before && addonBefore}
      addonAfter={args.after && addonAfter}
      type={args.type}
      placeholder={args.placeholder}
    />
  );
}`}},D.parameters),M.parameters=o({storySource:{source:`(args) => {
  const [value, setValue] = useState('');

  return (
    <div>
      <Field invalid={value === ''} error={value === '' ? 'This input is required' : ''}>
        <Input value={value} onChange={(e) => setValue(e.currentTarget.value)} {...args} />
      </Field>
    </div>
  );
}`}},M.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Input/Input.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Input/Input.story.tsx#Meta"})}catch(T){}},"./src/components/InteractiveTable/InteractiveTable.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return ue},WithCustomCell:function(){return Ze},WithRowExpansion:function(){return qe},default:function(){return Oe}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),l=e("../../.yarn/__virtual__/react-table-virtual-45b6697169/2/yarn/cache/react-table-npm-7.8.0-61488af438-44ca0fb848.zip/node_modules/react-table/index.js"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/data.ts"),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/components/Icon/Icon.tsx"),i=e("./src/components/IconButton/IconButton.tsx"),c=Object.defineProperty,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(ce,pe,J)=>pe in ce?c(ce,pe,{enumerable:!0,configurable:!0,writable:!0,value:J}):ce[pe]=J,_=(ce,pe)=>{for(var J in pe||(pe={}))O.call(pe,J)&&w(ce,J,pe[J]);if(E)for(var J of E(pe))m.call(pe,J)&&w(ce,J,pe[J]);return ce};const C=n.iv`
  display: flex;
  align-items: center;
  height: 100%;
`;function b({row:ce,__rowID:pe}){return t.createElement("div",{className:C},t.createElement(i.h,_({tooltip:"toggle row expanded","aria-controls":pe,name:ce.isExpanded?"angle-down":"angle-right","aria-expanded":ce.isExpanded},ce.getToggleRowExpandedProps())))}try{b.displayName="ExpanderCell",b.__docgenInfo={description:"",displayName:"ExpanderCell",props:{data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"readonly K[]"}},initialState:{defaultValue:null,description:"",name:"initialState",required:!1,type:{name:"Partial<TableState<K>>"}},stateReducer:{defaultValue:null,description:"",name:"stateReducer",required:!1,type:{name:"((newState: TableState<K>, action: ActionType, previousState: TableState<K>, instance?: TableInstance<K>) => TableState<...>)"}},useControlledState:{defaultValue:null,description:"",name:"useControlledState",required:!1,type:{name:"((state: TableState<K>, meta: MetaBase<K>) => TableState<K>)"}},defaultColumn:{defaultValue:null,description:"",name:"defaultColumn",required:!1,type:{name:"Partial<Column<K>>"}},getSubRows:{defaultValue:null,description:"",name:"getSubRows",required:!1,type:{name:"((originalRow: K, relativeIndex: number) => K[])"}},getRowId:{defaultValue:null,description:"",name:"getRowId",required:!1,type:{name:"((originalRow: K, relativeIndex: number, parent?: Row<K>) => string)"}},autoResetHiddenColumns:{defaultValue:null,description:"",name:"autoResetHiddenColumns",required:!1,type:{name:"boolean"}},column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"ColumnInstance<K>"}},row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"Row<K>"}},cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<K, void>"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"void"}},__rowID:{defaultValue:null,description:"",name:"__rowID",required:!0,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/InteractiveTable/ExpanderCell.tsx#ExpanderCell"]={docgenInfo:b.__docgenInfo,name:"ExpanderCell",path:"src/components/InteractiveTable/ExpanderCell.tsx#ExpanderCell"})}catch(ce){}var g=Object.defineProperty,v=Object.getOwnPropertySymbols,y=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,s=(ce,pe,J)=>pe in ce?g(ce,pe,{enumerable:!0,configurable:!0,writable:!0,value:J}):ce[pe]=J,o=(ce,pe)=>{for(var J in pe||(pe={}))y.call(pe,J)&&s(ce,J,pe[J]);if(v)for(var J of v(pe))h.call(pe,J)&&s(ce,J,pe[J]);return ce};const r="__expander";function u(ce){return[{id:r,Cell:b,disableSortBy:!0,width:0},...ce.map(pe=>o({id:pe.id,accessor:pe.id,Header:pe.header||(()=>null),sortType:pe.sortType||"alphanumeric",disableSortBy:!Boolean(pe.sortType),width:pe.disableGrow?0:void 0,visible:pe.visible},pe.cell&&{Cell:pe.cell}))]}var p=Object.defineProperty,S=Object.defineProperties,k=Object.getOwnPropertyDescriptors,D=Object.getOwnPropertySymbols,M=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable,T=(ce,pe,J)=>pe in ce?p(ce,pe,{enumerable:!0,configurable:!0,writable:!0,value:J}):ce[pe]=J,j=(ce,pe)=>{for(var J in pe||(pe={}))M.call(pe,J)&&T(ce,J,pe[J]);if(D)for(var J of D(pe))I.call(pe,J)&&T(ce,J,pe[J]);return ce},K=(ce,pe)=>S(ce,k(pe)),F=(ce,pe)=>{var J={};for(var L in ce)M.call(ce,L)&&pe.indexOf(L)<0&&(J[L]=ce[L]);if(ce!=null&&D)for(var L of D(ce))pe.indexOf(L)<0&&I.call(ce,L)&&(J[L]=ce[L]);return J};const $=ce=>({table:n.iv`
    border-radius: ${ce.shape.borderRadius()};
    border: solid 1px ${ce.colors.border.weak};
    background-color: ${ce.colors.background.secondary};
    width: 100%;

    td {
      padding: ${ce.spacing(1)};
    }

    td,
    th {
      min-width: ${ce.spacing(3)};
    }
  `,evenRow:n.iv`
    background: ${ce.colors.background.primary};
  `,disableGrow:n.iv`
    width: 0%;
  `,header:n.iv`
    &,
    & > button {
      position: relative;
      white-space: nowrap;
      padding: ${ce.spacing(1)};
    }
    & > button {
      &:after {
        content: '\\00a0';
      }
      width: 100%;
      height: 100%;
      background: none;
      border: none;
      padding-right: ${ce.spacing(2.5)};
      text-align: left;
      &:hover {
        background-color: ${ce.colors.emphasize(ce.colors.background.secondary,.05)};
      }
    }
  `,sortableHeader:n.iv`
    /* increases selector's specificity so that it always takes precedence over default styles  */
    && {
      padding: 0;
    }
  `});function R({data:ce,className:pe,columns:J,renderExpandedRow:L,getRowId:fe}){const xe=(0,x.wW)($),We=(0,t.useMemo)(()=>u(J),[J]),Ue=U(),at=(0,t.useCallback)(ge=>`${Ue}-${ge.id}`.replace(/\s/g,""),[Ue]),{getTableProps:it,getTableBodyProps:_t,headerGroups:wt,rows:ee,prepareRow:_e}=(0,l.useTable)({columns:We,data:ce,autoResetExpanded:!1,autoResetSortBy:!1,disableMultiSort:!0,getRowId:fe,initialState:{hiddenColumns:[!L&&r,...We.filter(ge=>!(!ge.visible||ge.visible(ce))).map(ge=>ge.id).filter(f.fQ)].filter(f.fQ)}},l.useSortBy,l.useExpanded);return ee.forEach(_e),t.createElement("table",K(j({},it()),{className:(0,n.cx)(xe.table,pe)}),t.createElement("thead",null,wt.map(ge=>{const de=ge.getHeaderGroupProps(),{key:Ee}=de,ze=F(de,["key"]);return t.createElement("tr",j({key:Ee},ze),ge.headers.map(le=>{const ye=le.getHeaderProps(),{key:Se}=ye,Be=F(ye,["key"]);return t.createElement("th",j(j({key:Se,className:(0,n.cx)(xe.header,{[xe.disableGrow]:le.width===0,[xe.sortableHeader]:le.canSort})},Be),le.isSorted&&{"aria-sort":le.isSortedDesc?"descending":"ascending"}),t.createElement(W,{column:le}))}))})),t.createElement("tbody",j({},_t()),ee.map((ge,de)=>{const Ee=(0,n.cx)(de%2===0&&xe.evenRow),ze=ge.getRowProps(),{key:le}=ze,ye=F(ze,["key"]),Se=at(ge);return t.createElement(t.Fragment,{key:le},t.createElement("tr",j({className:Ee},ye),ge.cells.map(Be=>{const Xe=Be.getCellProps(),{key:st}=Xe,mt=F(Xe,["key"]);return t.createElement("td",j({key:st},mt),Be.render("Cell",{__rowID:Se}))})),ge.isExpanded&&L&&t.createElement("tr",K(j({className:Ee},ye),{id:Se}),t.createElement("td",{colSpan:ge.cells.length},L(ge.original))))})))}const U=()=>(0,t.useMemo)(()=>(0,a.uniqueId)("InteractiveTable"),[]),H=ce=>({sortIcon:n.iv`
    position: absolute;
    top: ${ce.spacing(1)};
  `});function W({column:{canSort:ce,render:pe,isSorted:J,isSortedDesc:L,getSortByToggleProps:fe}}){const xe=(0,x.wW)(H),{onClick:We}=fe(),Ue=t.createElement(t.Fragment,null,pe("Header"),J&&t.createElement("span",{"aria-hidden":"true",className:xe.sortIcon},t.createElement(d.J,{name:L?"angle-down":"angle-up"})));return ce?t.createElement("button",{type:"button",onClick:We},Ue):Ue}try{R.displayName="InteractiveTable",R.__docgenInfo={description:"",displayName:"InteractiveTable",props:{columns:{defaultValue:null,description:"Table's columns definition. Must be memoized.",name:"columns",required:!0,type:{name:"Column<TableData>[]"}},data:{defaultValue:null,description:"The data to display in the table. Must be memoized.",name:"data",required:!0,type:{name:"TableData[]"}},renderExpandedRow:{defaultValue:null,description:"Render function for the expanded row. if not provided, the tables rows will not be expandable.",name:"renderExpandedRow",required:!1,type:{name:"((row: TableData) => ReactNode)"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},getRowId:{defaultValue:null,description:"Must return a unique id for each row",name:"getRowId",required:!0,type:{name:"((originalRow: TableData, relativeIndex: number, parent?: Row<TableData> | undefined) => string) | undefined"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/InteractiveTable/InteractiveTable.tsx#InteractiveTable"]={docgenInfo:R.__docgenInfo,name:"InteractiveTable",path:"src/components/InteractiveTable/InteractiveTable.tsx#InteractiveTable"})}catch(ce){}var oe=e("./src/components/Button/Button.tsx"),Q=e("./src/utils/storybook/withCenteredStory.tsx"),P=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),ae=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),q=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),Y=e("./src/components/Badge/Badge.tsx");function ve(ce){const pe=Object.assign({h1:"h1",p:"p",a:"a",h3:"h3",h4:"h4",code:"code",h5:"h5",pre:"pre",h2:"h2"},(0,ae.ah)(),ce.components);return(0,P.jsxs)(P.Fragment,{children:[(0,P.jsx)(q.h_,{title:"MDX|InteractiveTable",component:R}),`
`,(0,P.jsx)(pe.h1,{children:"InteractiveTable"}),`
`,(0,P.jsx)(Y.C,{text:"Alpha",icon:"rocket",color:"blue",tooltip:"This component is still experimental."}),`
`,(0,P.jsx)(pe.p,{children:`The InteractiveTable is used to display and select data efficiently.
It allows for the display and modification of detailed information.
With additional functionality it allows for batch editing, as needed by your feature's users.`}),`
`,(0,P.jsxs)(pe.p,{children:["It is a wrapper around ",(0,P.jsx)(pe.a,{href:"https://react-table-v7.tanstack.com/",children:"React Table"}),", for more informations about it, refer to the ",(0,P.jsx)(pe.a,{href:"https://react-table.tanstack.com/docs/overview",children:"official documentation"}),"."]}),`
`,(0,P.jsx)(pe.h3,{children:"When to use"}),`
`,(0,P.jsx)(pe.p,{children:"The InteractiveTable can be used to allow users to perform administrative tasks workflows."}),`
`,(0,P.jsx)(pe.h3,{children:"When not to use"}),`
`,(0,P.jsx)(pe.p,{children:`Avoid using the InteractiveTable where mobile or responsiveness may be a requirement.
Consider an alternative pattern where the user is presented with a summary list and can click/tap to an individual page for each row in that list.`}),`
`,(0,P.jsx)(pe.h3,{children:"Usage"}),`
`,(0,P.jsx)(q.xP,{of:R}),`
`,(0,P.jsxs)(pe.h4,{children:["About ",(0,P.jsx)(pe.code,{children:"columns"})," and ",(0,P.jsx)(pe.code,{children:"data"})," Props"]}),`
`,(0,P.jsxs)(pe.p,{children:["To avoid unnecessary rerenders, ",(0,P.jsx)(pe.code,{children:"columns"})," and ",(0,P.jsx)(pe.code,{children:"data"})," must be memoized."]}),`
`,(0,P.jsxs)(pe.p,{children:["Columns are rendered in the same order defined in the ",(0,P.jsx)(pe.code,{children:"columns"}),` prop.
Each Cell's content is automatically rendered by matching the `,(0,P.jsx)(pe.code,{children:"id"})," of the column to the key of each object in the ",(0,P.jsx)(pe.code,{children:"data"})," array prop."]}),`
`,(0,P.jsx)(pe.h5,{children:"Example"}),`
`,(0,P.jsx)(pe.pre,{children:(0,P.jsx)(pe.code,{className:"language-tsx",children:`interface TableData {
  projectName: string;
  repository: string;
}

const columns = useMemo<Array<Column<TableData>>>(
  () => [
    id: 'projectName'
    header: "Project Name"
  ],
  [
    id: 'repository',
    header: "Repository"
  ],
  []
);

const data = useMemo<Array<TableData>>(
  () => [
    {
      projectName: 'Grafana',
      repository: 'https://github.com/grafana/grafana',
   }
  ],
  [
    {
      projectName: 'Loki';
      repository: 'https://github.com/grafana/loki';
    }
  ],
  []
);
`})}),`
`,(0,P.jsx)(pe.h2,{children:"Examples"}),`
`,(0,P.jsx)(pe.h3,{children:"With row expansion"}),`
`,(0,P.jsx)(pe.p,{children:`Individual rows can be expanded to display additional details or reconfigure properties previously defined when the row was created.
The expanded row area should be used to declutter the primary presentation of data, carefully consider what the user needs to know at first glance and what can be hidden behind the Row Expander button.`}),`
`,(0,P.jsx)(pe.p,{children:"In general, data-types that are consistent across all dataset are in the primary table, variances are pushed to the expanded section for each individual row."}),`
`,(0,P.jsx)(q.oG,{id:"experimental-interactivetable--with-row-expansion"}),`
`,(0,P.jsxs)(pe.p,{children:["Row expansion is enabled whenever the ",(0,P.jsx)(pe.code,{children:"renderExpanded"})," prop is provided. The ",(0,P.jsx)(pe.code,{children:"renderExpanded"})," function is called with the row's data and should return a ReactNode."]}),`
`,(0,P.jsx)(pe.pre,{children:(0,P.jsx)(pe.code,{className:"language-tsx",children:`interface TableData {
  datasource: string;
  repo: string;
  description: string;
}

const tableData: TableData[] = [
  //...
];

const columns: Array<Column<TableData>> = [
  //...
];

const ExpandedCell = ({ description }: TableData) => {
  return <p>{description}</p>;
};

export const MyComponent = () => {
  return (
    <InteractiveTable
      columns={columns}
      data={tableData}
      getRowId={(r) => r.datasource}
      renderExpandedRow={ExpandedCell}
    />
  );
};
`})}),`
`,(0,P.jsx)(pe.h3,{children:"Custom Cell Rendering"}),`
`,(0,P.jsxs)(pe.p,{children:["Individual cells can be rendered using custom content dy defining a ",(0,P.jsx)(pe.code,{children:"cell"})," property on the column definition."]}),`
`,(0,P.jsx)(q.oG,{id:"experimental-interactivetable--with-custom-cell"}),`
`,(0,P.jsx)(pe.pre,{children:(0,P.jsx)(pe.code,{className:"language-tsx",children:`interface TableData {
  datasource: string;
  repo: string;
}

const RepoCell = ({
  row: {
    original: { repo },
  },
}: CellProps<WithCustomCellData, void>) => {
  return (
    <LinkButton href={repo} size="sm" icon="external-link-alt">
      Open on GitHub
    </LinkButton>
  );
};

const tableData: WithCustomCellData[] = [
  {
    datasource: 'Prometheus',
    repo: 'https://github.com/prometheus/prometheus',
  },
  {
    datasource: 'Loki',
    repo: 'https://github.com/grafana/loki',
  },
  {
    datasource: 'Tempo',
    repo: 'https://github.com/grafana/tempo',
  },
];

const columns: Array<Column<WithCustomCellData>> = [
  { id: 'datasource', header: 'Data Source' },
  { id: 'repo', header: 'Repo', cell: RepoCell },
];

export const MyComponent = () => {
  return <InteractiveTable columns={columns} data={tableData} getRowId={(r) => r.datasource} />;
};
`})})]})}function re(ce={}){const{wrapper:pe}=Object.assign({},(0,ae.ah)(),ce.components);return pe?(0,P.jsx)(pe,Object.assign({},ce,{children:(0,P.jsx)(ve,ce)})):ve(ce)}var je=re,me=Object.defineProperty,ne=Object.getOwnPropertySymbols,Z=Object.prototype.hasOwnProperty,te=Object.prototype.propertyIsEnumerable,Pe=(ce,pe,J)=>pe in ce?me(ce,pe,{enumerable:!0,configurable:!0,writable:!0,value:J}):ce[pe]=J,he=(ce,pe)=>{for(var J in pe||(pe={}))Z.call(pe,J)&&Pe(ce,J,pe[J]);if(ne)for(var J of ne(pe))te.call(pe,J)&&Pe(ce,J,pe[J]);return ce},ie=null,Ce={Basic:{startLoc:{col:62,line:34},endLoc:{col:1,line:55},startBody:{col:62,line:34},endBody:{col:1,line:55}},WithRowExpansion:{startLoc:{col:73,line:67},endLoc:{col:1,line:99},startBody:{col:73,line:67},endBody:{col:1,line:99}},WithCustomCell:{startLoc:{col:71,line:118},endLoc:{col:1,line:140},startBody:{col:71,line:118},endBody:{col:1,line:140}}};const Le=["className","renderExpandedRow","getRowId"],we={title:"Experimental/InteractiveTable",component:R,decorators:[Q.BU],parameters:{docs:{page:je},controls:{exclude:Le}},args:{},argTypes:{}},ue=ce=>{const pe=(0,t.useMemo)(()=>[{id:"header2",header:"With missing values",sortType:"number",disableGrow:!0},{id:"noheader",sortType:"number"}],[]),J=(0,t.useMemo)(()=>[{header1:"a",header2:1},{header1:"b",noheader:"This column doesn't have an header"},{header1:"c",noheader:"But it's still sortable"}],[]);return t.createElement(R,{columns:pe,data:J,getRowId:L=>L.header1})},Ie=({description:ce})=>t.createElement("p",null,ce),qe=ce=>{const pe=[{datasource:"Prometheus",repo:"https://github.com/prometheus/prometheus",description:"Open source time series database & alerting."},{datasource:"Loki",repo:"https://github.com/grafana/loki",description:"Like Prometheus but for logs. OSS logging solution from Grafana Labs."},{datasource:"Tempo",repo:"https://github.com/grafana/tempo",description:"High volume, minimal dependency trace storage. OSS tracing solution from Grafana Labs."}],J=[{id:"datasource",header:"Data Source"},{id:"repo",header:"Repo"}];return t.createElement(R,{columns:J,data:pe,getRowId:L=>L.datasource,renderExpandedRow:Ie})},Je=({row:{original:{repo:ce}}})=>t.createElement(oe.Qj,{href:ce,size:"sm",icon:"external-link-alt"},"Open on GithHub"),Ze=ce=>{const pe=[{datasource:"Prometheus",repo:"https://github.com/prometheus/prometheus"},{datasource:"Loki",repo:"https://github.com/grafana/loki"},{datasource:"Tempo",repo:"https://github.com/grafana/tempo"}],J=[{id:"datasource",header:"Data Source"},{id:"repo",header:"Repo",cell:Je}];return t.createElement(R,{columns:J,data:pe,getRowId:L=>L.datasource})};var Oe=we;ue.parameters=he({storySource:{source:`(args) => {
  const columns = useMemo<Array<Column<TableData>>>(
    () => [
      { id: 'header2', header: 'With missing values', sortType: 'number', disableGrow: true },
      {
        id: 'noheader',
        sortType: 'number',
      },
    ],
    []
  );
  const data: TableData[] = useMemo(
    () => [
      { header1: 'a', header2: 1 },
      { header1: 'b', noheader: "This column doesn't have an header" },
      { header1: 'c', noheader: "But it's still sortable" },
    ],
    []
  );

  return <InteractiveTable columns={columns} data={data} getRowId={(r) => r.header1} />;
}`}},ue.parameters),qe.parameters=he({storySource:{source:`(args) => {
  const tableData: WithRowExpansionData[] = [
    {
      datasource: 'Prometheus',
      repo: 'https://github.com/prometheus/prometheus',
      description: 'Open source time series database & alerting.',
    },
    {
      datasource: 'Loki',
      repo: 'https://github.com/grafana/loki',
      description: 'Like Prometheus but for logs. OSS logging solution from Grafana Labs.',
    },
    {
      datasource: 'Tempo',
      repo: 'https://github.com/grafana/tempo',
      description: 'High volume, minimal dependency trace storage. OSS tracing solution from Grafana Labs.',
    },
  ];

  const columns: Array<Column<WithRowExpansionData>> = [
    { id: 'datasource', header: 'Data Source' },
    { id: 'repo', header: 'Repo' },
  ];

  return (
    <InteractiveTable
      columns={columns}
      data={tableData}
      getRowId={(r) => r.datasource}
      renderExpandedRow={ExpandedCell}
    />
  );
}`}},qe.parameters),Ze.parameters=he({storySource:{source:`(args) => {
  const tableData: WithCustomCellData[] = [
    {
      datasource: 'Prometheus',
      repo: 'https://github.com/prometheus/prometheus',
    },
    {
      datasource: 'Loki',
      repo: 'https://github.com/grafana/loki',
    },
    {
      datasource: 'Tempo',
      repo: 'https://github.com/grafana/tempo',
    },
  ];

  const columns: Array<Column<WithCustomCellData>> = [
    { id: 'datasource', header: 'Data Source' },
    { id: 'repo', header: 'Repo', cell: RepoCell },
  ];

  return <InteractiveTable columns={columns} data={tableData} getRowId={(r) => r.datasource} />;
}`}},Ze.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/InteractiveTable/InteractiveTable.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/InteractiveTable/InteractiveTable.story.tsx#ComponentMeta"})}catch(ce){}},"./src/components/Layout/Layout.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Horizontal:function(){return o},Vertical:function(){return r},default:function(){return s}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Layout/Layout.tsx"),a=e("./src/components/Button/Button.tsx"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("./src/utils/storybook/withStoryContainer.tsx"),x=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),d=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),i=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),c=e("./src/components/Select/Select.tsx");function E(u){const p=Object.assign({h1:"h1",h2:"h2",p:"p",code:"code",h3:"h3"},(0,d.ah)(),u.components);return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(p.h1,{children:"Layout"}),`
`,(0,x.jsx)(p.h2,{children:"Generic"}),`
`,(0,x.jsx)(p.p,{children:"Used for aligning items in specified orientation. Useful for multiple elements that need to be arranged in rows or columns."}),`
`,(0,x.jsxs)(p.p,{children:["Expects multiple elements as ",(0,x.jsx)(p.code,{children:"children"})," prop. This is the base for more specialised ",(0,x.jsx)(p.code,{children:"Horizontal-"})," and ",(0,x.jsx)(p.code,{children:"VerticalGroup"})," components."]}),`
`,(0,x.jsx)(p.h3,{children:"Props"}),`
`,(0,x.jsx)(i.xP,{of:n.Ar}),`
`,(0,x.jsx)(p.h2,{children:"Horizontal"}),`
`,(0,x.jsx)(p.p,{children:"Used for horizontally aligning several elements (e.g. Button, Select) with a predefined spacing between them."}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)(n.Lh,{children:[(0,x.jsx)(a.zx,{children:"Button 1"}),`
`,(0,x.jsx)(a.zx,{children:"Button 2"}),`
`,(0,x.jsx)(a.zx,{children:"Button 3"})]})}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)(n.Lh,{children:[(0,x.jsx)(c.Ph,{width:25,onChange:()=>{},options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}]}),(0,x.jsx)(c.Ph,{width:25,onChange:()=>{},options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}]}),(0,x.jsx)(c.Ph,{width:25,onChange:()=>{},options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}]})]})}),`
`,(0,x.jsx)(p.h2,{children:"Vertical"}),`
`,(0,x.jsx)(p.p,{children:"Used for vertically aligning several elements (e.g. Button, Select) with a predefined spacing between them."}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)(n.wc,{children:[(0,x.jsx)(a.zx,{children:"Button 1"}),`
`,(0,x.jsx)(a.zx,{children:"Button 2"}),`
`,(0,x.jsx)(a.zx,{children:"Button 3"})]})}),`
`,(0,x.jsx)(i.MB,{children:(0,x.jsxs)(n.wc,{justify:"center",children:[(0,x.jsx)(c.Ph,{width:25,onChange:()=>{},options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}]}),(0,x.jsx)(c.Ph,{width:25,onChange:()=>{},options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}]}),(0,x.jsx)(c.Ph,{width:25,onChange:()=>{},options:[{value:1,label:"Option 1"},{value:2,label:"Option 2"}]})]})})]})}function O(u={}){const{wrapper:p}=Object.assign({},(0,d.ah)(),u.components);return p?(0,x.jsx)(p,Object.assign({},u,{children:(0,x.jsx)(E,u)})):E(u)}var m=O,w=Object.defineProperty,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(u,p,S)=>p in u?w(u,p,{enumerable:!0,configurable:!0,writable:!0,value:S}):u[p]=S,v=(u,p)=>{for(var S in p||(p={}))C.call(p,S)&&g(u,S,p[S]);if(_)for(var S of _(p))b.call(p,S)&&g(u,S,p[S]);return u},y=`import { Story, Meta } from '@storybook/react';
import React from 'react';

import { Button, VerticalGroup, HorizontalGroup } from '@grafana/ui';

import { withCenteredStory, withHorizontallyCenteredStory } from '../../utils/storybook/withCenteredStory';
import { withStoryContainer } from '../../utils/storybook/withStoryContainer';

import { Layout, LayoutProps } from './Layout';
import mdx from './Layout.mdx';

export default {
  title: 'Layout/Groups',
  component: Layout,
  decorators: [withStoryContainer, withCenteredStory, withHorizontallyCenteredStory],
  subcomponents: { HorizontalGroup, VerticalGroup },
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['orientation'],
    },
  },
  args: {
    justify: 'flex-start',
    spacing: 'sm',
    align: 'center',
    wrap: false,
    width: '100%',
    containerWidth: 300,
    containerHeight: 0,
    showBoundaries: false,
  },
  argTypes: {
    containerWidth: { control: { type: 'range', min: 100, max: 500, step: 10 } },
    containerHeight: { control: { type: 'range', min: 100, max: 500, step: 10 } },
    justify: {
      control: {
        type: 'select',
        options: ['flex-start', 'flex-end', 'space-between', 'center'],
      },
    },
    align: {
      control: {
        type: 'select',
        options: ['flex-start', 'flex-end', 'center', 'normal'],
      },
    },
    spacing: {
      control: {
        type: 'select',
        options: ['xs', 'sm', 'md', 'lg'],
      },
    },
  },
} as Meta;

export const Horizontal: Story<LayoutProps> = (args) => {
  return (
    <HorizontalGroup {...args}>
      <Button>Save</Button>
      <Button>Cancel</Button>
    </HorizontalGroup>
  );
};

export const Vertical: Story<LayoutProps> = (args) => {
  return (
    <VerticalGroup {...args}>
      <Button>Save</Button>
      <Button>Cancel</Button>
    </VerticalGroup>
  );
};
`,h={Horizontal:{startLoc:{col:46,line:59},endLoc:{col:1,line:66},startBody:{col:46,line:59},endBody:{col:1,line:66}},Vertical:{startLoc:{col:44,line:68},endLoc:{col:1,line:75},startBody:{col:44,line:68},endBody:{col:1,line:75}}},s={title:"Layout/Groups",component:n.Ar,decorators:[f.r,l.BU,l.zT],subcomponents:{HorizontalGroup:n.Lh,VerticalGroup:n.wc},parameters:{docs:{page:m},controls:{exclude:["orientation"]}},args:{justify:"flex-start",spacing:"sm",align:"center",wrap:!1,width:"100%",containerWidth:300,containerHeight:0,showBoundaries:!1},argTypes:{containerWidth:{control:{type:"range",min:100,max:500,step:10}},containerHeight:{control:{type:"range",min:100,max:500,step:10}},justify:{control:{type:"select",options:["flex-start","flex-end","space-between","center"]}},align:{control:{type:"select",options:["flex-start","flex-end","center","normal"]}},spacing:{control:{type:"select",options:["xs","sm","md","lg"]}}}};const o=u=>t.createElement(n.Lh,v({},u),t.createElement(a.zx,null,"Save"),t.createElement(a.zx,null,"Cancel")),r=u=>t.createElement(n.wc,v({},u),t.createElement(a.zx,null,"Save"),t.createElement(a.zx,null,"Cancel"));o.parameters=v({storySource:{source:`(args) => {
  return (
    <HorizontalGroup {...args}>
      <Button>Save</Button>
      <Button>Cancel</Button>
    </HorizontalGroup>
  );
}`}},o.parameters),r.parameters=v({storySource:{source:`(args) => {
  return (
    <VerticalGroup {...args}>
      <Button>Save</Button>
      <Button>Cancel</Button>
    </VerticalGroup>
  );
}`}},r.parameters)},"./src/components/LoadingBar/LoadingBar.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return r},default:function(){return u}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/components/LoadingBar/LoadingBar.tsx"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/utils/storybook/DashboardStoryCanvas.tsx"),x=e("./src/utils/storybook/withCenteredStory.tsx"),d=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),i=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),c=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function E(p){const S=Object.assign({h1:"h1",p:"p",pre:"pre",code:"code"},(0,i.ah)(),p.components);return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(c.h_,{title:"MDX|LoadingBar",component:a.F}),`
`,(0,d.jsx)(S.h1,{children:"LoadingBar"}),`
`,(0,d.jsx)(S.p,{children:"The LoadingBar is used as a simple loading slider animation in the top of its container."}),`
`,(0,d.jsx)(c.MB,{children:(0,d.jsx)("div",{style:{height:"200px",width:"400px"},children:(0,d.jsx)(a.F,{containerWidth:400,height:2,width:128})})}),`
`,(0,d.jsx)(S.pre,{children:(0,d.jsx)(S.code,{className:"language-jsx",children:`<div style={{ height: '200px', width: '400px' }}>
  <LoadingBar containerWidth={400} height={2} width={128} />
</div>
`})}),`
`,(0,d.jsx)(c.$4,{of:a.F})]})}function O(p={}){const{wrapper:S}=Object.assign({},(0,i.ah)(),p.components);return S?(0,d.jsx)(S,Object.assign({},p,{children:(0,d.jsx)(E,p)})):E(p)}var m=O,w=Object.defineProperty,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(p,S,k)=>S in p?w(p,S,{enumerable:!0,configurable:!0,writable:!0,value:k}):p[S]=k,v=(p,S)=>{for(var k in S||(S={}))C.call(S,k)&&g(p,k,S[k]);if(_)for(var k of _(S))b.call(S,k)&&g(p,k,S[k]);return p},y=`import { css } from '@emotion/css';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { GrafanaTheme2 } from '@grafana/data';
import { LoadingBar, LoadingBarProps, useStyles2 } from '@grafana/ui';

import { DashboardStoryCanvas } from '../../utils/storybook/DashboardStoryCanvas';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './LoadingBar.mdx';

const meta: ComponentMeta<typeof LoadingBar> = {
  title: 'General/LoadingBar',
  component: LoadingBar,
  decorators: [withCenteredStory],
  parameters: {
    controls: {},
    docs: {
      page: mdx,
    },
  },
};

const getStyles = (theme: GrafanaTheme2) => {
  const { borderColor } = theme.components.panel;

  return {
    container: css({
      label: 'placeholder-container',
      width: '400px',
      height: '200px',
      border: \`1px solid \${borderColor}\`,
      borderRadius: '3px',
    }),
  };
};

export const Basic: ComponentStory<typeof LoadingBar> = (args: LoadingBarProps) => {
  const styles = useStyles2(getStyles);

  return (
    <DashboardStoryCanvas>
      <div className={styles.container}>
        <LoadingBar {...args} />
      </div>
    </DashboardStoryCanvas>
  );
};

Basic.args = {
  width: 400,
};

export default meta;
`,h={Basic:{startLoc:{col:56,line:39},endLoc:{col:1,line:49},startBody:{col:56,line:39},endBody:{col:1,line:49}}};const s={title:"General/LoadingBar",component:a.F,decorators:[x.BU],parameters:{controls:{},docs:{page:m}}},o=p=>{const{borderColor:S}=p.components.panel;return{container:(0,t.iv)({label:"placeholder-container",width:"400px",height:"200px",border:`1px solid ${S}`,borderRadius:"3px"})}},r=p=>{const S=(0,l.wW)(o);return n.createElement(f.C,null,n.createElement("div",{className:S.container},n.createElement(a.F,v({},p))))};r.args={width:400};var u=s;r.parameters=v({storySource:{source:`(args: LoadingBarProps) => {
  const styles = useStyles2(getStyles);

  return (
    <DashboardStoryCanvas>
      <div className={styles.container}>
        <LoadingBar {...args} />
      </div>
    </DashboardStoryCanvas>
  );
}`}},r.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/LoadingBar/LoadingBar.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/LoadingBar/LoadingBar.story.tsx#ComponentMeta"})}catch(p){}},"./src/components/LoadingPlaceholder/LoadingPlaceholder.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return y},default:function(){return h}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/LoadingPlaceholder/LoadingPlaceholder.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function d(s){const o=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,f.ah)(),s.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(o.h1,{children:"LoadingPlaceholder"}),`
`,(0,l.jsx)(o.p,{children:"Loading indicator with a text. Used to alert a user to wait for an activity to complete."}),`
`,(0,l.jsx)(o.h3,{children:"Usage"}),`
`,(0,l.jsx)(o.pre,{children:(0,l.jsx)(o.code,{className:"language-jsx",children:`<LoadingPlaceholder text="Loading..." />
`})}),`
`,(0,l.jsx)(o.h3,{children:"Props"}),`
`,(0,l.jsx)(x.xP,{of:a.u})]})}function i(s={}){const{wrapper:o}=Object.assign({},(0,f.ah)(),s.components);return o?(0,l.jsx)(o,Object.assign({},s,{children:(0,l.jsx)(d,s)})):d(s)}var c=i,E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?E(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=`import { ComponentStory, ComponentMeta } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { LoadingPlaceholder, LoadingPlaceholderProps } from './LoadingPlaceholder';
import mdx from './LoadingPlaceholder.mdx';

const meta: ComponentMeta<typeof LoadingPlaceholder> = {
  title: 'General/LoadingPlaceholder',
  component: LoadingPlaceholder,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
  argTypes: {
    text: {
      control: { type: 'text' },
    },
  },
};

export const Basic: ComponentStory<typeof LoadingPlaceholder> = (args: LoadingPlaceholderProps) => {
  return <LoadingPlaceholder {...args} />;
};

Basic.args = {
  text: 'Loading...',
};

export default meta;
`,g={Basic:{startLoc:{col:64,line:25},endLoc:{col:1,line:27},startBody:{col:64,line:25},endBody:{col:1,line:27}}};const v={title:"General/LoadingPlaceholder",component:a.u,decorators:[n.BU],parameters:{docs:{page:c}},argTypes:{text:{control:{type:"text"}}}},y=s=>t.createElement(a.u,C({},s));y.args={text:"Loading..."};var h=v;y.parameters=C({storySource:{source:`(args: LoadingPlaceholderProps) => {
  return <LoadingPlaceholder {...args} />;
}`}},y.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/LoadingPlaceholder/LoadingPlaceholder.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/LoadingPlaceholder/LoadingPlaceholder.story.tsx#ComponentMeta"})}catch(s){}},"./src/components/Menu/Menu.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Examples:function(){return U},default:function(){return H}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/FormattedValueDisplay/FormattedValueDisplay.tsx"),f=e("./src/components/Layout/Layout.tsx"),x=e("./src/components/VizLegend/SeriesIcon.tsx"),d=Object.defineProperty,i=Object.defineProperties,c=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(W,oe,Q)=>oe in W?d(W,oe,{enumerable:!0,configurable:!0,writable:!0,value:Q}):W[oe]=Q,_=(W,oe)=>{for(var Q in oe||(oe={}))O.call(oe,Q)&&w(W,Q,oe[Q]);if(E)for(var Q of E(oe))m.call(oe,Q)&&w(W,Q,oe[Q]);return W},C=(W,oe)=>i(W,c(oe)),b=(W,oe)=>{var Q={};for(var P in W)O.call(W,P)&&oe.indexOf(P)<0&&(Q[P]=W[P]);if(W!=null&&E)for(var P of E(W))oe.indexOf(P)<0&&m.call(W,P)&&(Q[P]=W[P]);return Q};const g=W=>{var oe=W,{getContextMenuSource:Q,timeZone:P,itemsGroup:ae,dimensions:q,contextDimensions:Y}=oe,ve=b(oe,["getContextMenuSource","timeZone","itemsGroup","dimensions","contextDimensions"]);const re=Q(),je=ae?ae.map(Z=>{var te;return C(_({},Z),{items:(te=Z.items)==null?void 0:te.filter(Pe=>Pe.label)})}):[],me=()=>{var Z;if(!re)return null;let te;if((q==null?void 0:q.yAxis)&&((Z=Y==null?void 0:Y.yAxis)==null?void 0:Z[1])){const he=getValueFromDimension(q.yAxis,Y.yAxis[0],Y.yAxis[1]),ie=re.series.valueField.display;te=ie(he)}const Pe=dateTimeFormat(re.datapoint[0],{defaultWithMS:re.series.hasMsResolution,timeZone:P});return React.createElement(v,{timestamp:Pe,seriesColor:re.series.color,displayName:re.series.alias||re.series.label,displayValue:te})},ne=()=>je==null?void 0:je.map((Z,te)=>React.createElement(MenuGroup,{key:`${Z.label}${te}`,label:Z.label},(Z.items||[]).map(Pe=>React.createElement(MenuItem,{key:`${Pe.label}`,url:Pe.url,label:Pe.label,target:Pe.target,icon:Pe.icon,active:Pe.active,onClick:Pe.onClick}))));return React.createElement(ContextMenu,C(_({},ve),{renderMenuItems:ne,renderHeader:me}))},v=({timestamp:W,seriesColor:oe,displayName:Q,displayValue:P})=>{const ae=(0,a.wW)(y);return t.createElement("div",{className:ae.wrapper},t.createElement("strong",null,W),t.createElement(f.Lh,null,t.createElement("div",null,t.createElement(x.F,{color:oe}),t.createElement("span",{className:ae.displayName},Q)),P&&t.createElement(l.W,{value:P})))};function y(W){return{wrapper:n.iv`
      padding: ${W.spacing(.5)} ${W.spacing(1)};
      font-size: ${W.typography.size.sm};
      z-index: ${W.zIndex.tooltip};
    `,displayName:n.iv`
      white-space: nowrap;
      padding-left: ${W.spacing(.5)};
    `}}try{g.displayName="GraphContextMenu",g.__docgenInfo={description:"",displayName:"GraphContextMenu",props:{x:{defaultValue:null,description:"Starting horizontal position for the menu",name:"x",required:!0,type:{name:"number"}},y:{defaultValue:null,description:"Starting vertical position for the menu",name:"y",required:!0,type:{name:"number"}},onClose:{defaultValue:null,description:"Callback for closing the menu",name:"onClose",required:!1,type:{name:"(() => void)"}},focusOnOpen:{defaultValue:null,description:"On menu open focus the first element",name:"focusOnOpen",required:!1,type:{name:"boolean"}},renderMenuItems:{defaultValue:null,description:"RenderProp function that returns menu items to display",name:"renderMenuItems",required:!1,type:{name:"(() => ReactNode)"}},renderHeader:{defaultValue:null,description:"A function that returns header element",name:"renderHeader",required:!1,type:{name:"(() => ReactNode)"}},getContextMenuSource:{defaultValue:null,description:"",name:"getContextMenuSource",required:!0,type:{name:"() => FlotDataPoint | null"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},itemsGroup:{defaultValue:null,description:"",name:"itemsGroup",required:!1,type:{name:"MenuGroupProps[]"}},dimensions:{defaultValue:null,description:"",name:"dimensions",required:!1,type:{name:"GraphDimensions"}},contextDimensions:{defaultValue:null,description:"",name:"contextDimensions",required:!1,type:{name:"ContextDimensions<any>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Graph/GraphContextMenu.tsx#GraphContextMenu"]={docgenInfo:g.__docgenInfo,name:"GraphContextMenu",path:"src/components/Graph/GraphContextMenu.tsx#GraphContextMenu"})}catch(W){}try{v.displayName="GraphContextMenuHeader",v.__docgenInfo={description:"",displayName:"GraphContextMenuHeader",props:{timestamp:{defaultValue:null,description:"",name:"timestamp",required:!0,type:{name:"string"}},seriesColor:{defaultValue:null,description:"",name:"seriesColor",required:!0,type:{name:"string"}},displayName:{defaultValue:null,description:"",name:"displayName",required:!0,type:{name:"string"}},displayValue:{defaultValue:null,description:"",name:"displayValue",required:!0,type:{name:"FormattedValue"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Graph/GraphContextMenu.tsx#GraphContextMenuHeader"]={docgenInfo:v.__docgenInfo,name:"GraphContextMenuHeader",path:"src/components/Graph/GraphContextMenu.tsx#GraphContextMenuHeader"})}catch(W){}var h=e("./src/utils/storybook/StoryExample.tsx"),s=e("./src/components/Menu/Menu.tsx"),o=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),r=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),u=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function p(W){const oe=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,r.ah)(),W.components);return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(u.h_,{title:"MDX|Menu",component:s.v}),`
`,(0,o.jsx)(oe.h1,{children:"Menu"}),`
`,(0,o.jsx)(oe.p,{children:"A simple menu component."}),`
`,(0,o.jsx)(oe.h3,{children:"When to use"}),`
`,(0,o.jsx)(oe.p,{children:"When you need to display a list of actions or navigation options in a dropdown."}),`
`,(0,o.jsx)(oe.h3,{children:"Usage"}),`
`,(0,o.jsx)(oe.pre,{children:(0,o.jsx)(oe.code,{className:"language-tsx",children:`import { Dropdown, Menu, Button } from '@grafana/ui';
const menu = (
  <Menu>
    <Menu.Item label="Google" />
    <Menu.Divider />
    <Menu.Item label="Delete" icon="trash-alt" destructive />
  </Menu>
);
return (
  <Dropdown overlay={menu}>
    <Button icon="bars" />
  </Dropdown>
);
`})}),`
`,(0,o.jsx)(u.xP,{of:s.v})]})}function S(W={}){const{wrapper:oe}=Object.assign({},(0,r.ah)(),W.components);return oe?(0,o.jsx)(oe,Object.assign({},W,{children:(0,o.jsx)(p,W)})):p(W)}var k=S,D=Object.defineProperty,M=Object.getOwnPropertySymbols,I=Object.prototype.hasOwnProperty,T=Object.prototype.propertyIsEnumerable,j=(W,oe,Q)=>oe in W?D(W,oe,{enumerable:!0,configurable:!0,writable:!0,value:Q}):W[oe]=Q,K=(W,oe)=>{for(var Q in oe||(oe={}))I.call(oe,Q)&&j(W,Q,oe[Q]);if(M)for(var Q of M(oe))T.call(oe,Q)&&j(W,Q,oe[Q]);return W},F=null,$={Examples:{startLoc:{col:7,line:31},endLoc:{col:1,line:136},startBody:{col:7,line:31},endBody:{col:1,line:136}}};const R={title:"General/Menu",component:s.v,argTypes:{},parameters:{docs:{page:k},knobs:{disabled:!0},controls:{disabled:!0},actions:{disabled:!0}}},U=function(){return t.createElement(f.wc,null,t.createElement(h.E,{name:"Plain"},t.createElement(s.v,null,t.createElement(s.v.Item,{label:"Google"}),t.createElement(s.v.Item,{label:"Filter"}),t.createElement(s.v.Item,{label:"Active",active:!0}),t.createElement(s.v.Item,{label:"I am a link",url:"http://google.com",target:"_blank"}),t.createElement(s.v.Item,{label:"With destructive prop set",destructive:!0}))),t.createElement(h.E,{name:"With icons and a divider"},t.createElement(s.v,null,t.createElement(s.v.Item,{label:"Google",icon:"search-plus"}),t.createElement(s.v.Item,{label:"Filter",icon:"filter"}),t.createElement(s.v.Item,{label:"History",icon:"history"}),t.createElement(s.v.Divider,null),t.createElement(s.v.Item,{label:"With destructive prop set",icon:"trash-alt",destructive:!0}))),t.createElement(h.E,{name:"With disabled items"},t.createElement(s.v,null,t.createElement(s.v.Item,{label:"Google",icon:"search-plus"}),t.createElement(s.v.Item,{label:"Disabled action",icon:"history",disabled:!0}),t.createElement(s.v.Item,{label:"Disabled link",icon:"external-link-alt",url:"http://google.com",target:"_blank",disabled:!0}),t.createElement(s.v.Item,{label:"Submenu",icon:"apps",childItems:[t.createElement(s.v.Item,{key:"subitem1",label:"subitem1",icon:"history",disabled:!0}),t.createElement(s.v.Item,{key:"subitem2",label:"subitem2",icon:"apps"})]}),t.createElement(s.v.Item,{label:"Disabled submenu",icon:"apps",disabled:!0,childItems:[t.createElement(s.v.Item,{key:"subitem1",label:"subitem1",icon:"history"}),t.createElement(s.v.Item,{key:"subitem2",label:"subitem2",icon:"apps"})]}),t.createElement(s.v.Item,{label:"Disabled destructive action",icon:"trash-alt",destructive:!0,disabled:!0}))),t.createElement(h.E,{name:"With header & groups"},t.createElement(s.v,{header:t.createElement(v,{timestamp:"2020-11-25 19:04:25",seriesColor:"#00ff00",displayName:"A-series",displayValue:{text:"128",suffix:"km/h"}}),ariaLabel:"Menu header"},t.createElement(s.v.Group,{label:"Group 1"},t.createElement(s.v.Item,{label:"item1",icon:"history"}),t.createElement(s.v.Item,{label:"item2",icon:"filter"})),t.createElement(s.v.Group,{label:"Group 2"},t.createElement(s.v.Item,{label:"item1",icon:"history"})))),t.createElement(h.E,{name:"With submenu and shortcuts"},t.createElement(s.v,null,t.createElement(s.v.Item,{label:"item1",icon:"history",shortcut:"q p"}),t.createElement(s.v.Item,{label:"Item with a very long title",icon:"apps",childItems:[t.createElement(s.v.Item,{key:"subitem1",label:"subitem1",icon:"history"}),t.createElement(s.v.Item,{key:"subitem2",label:"subitem2",icon:"apps"}),t.createElement(s.v.Item,{key:"subitem3",label:"subitem3",icon:"search-plus",childItems:[t.createElement(s.v.Item,{key:"subitem1",label:"subitem1",icon:"history"}),t.createElement(s.v.Item,{key:"subitem2",label:"subitem2",icon:"apps"}),t.createElement(s.v.Item,{key:"subitem3",label:"subitem3",icon:"search-plus"})]})],shortcut:"p s"}),t.createElement(s.v.Item,{label:"item3",icon:"filter",childItems:[t.createElement(s.v.Item,{key:"subitem1",label:"subitem1",icon:"history"}),t.createElement(s.v.Item,{key:"subitem2",label:"subitem2",icon:"apps"}),t.createElement(s.v.Item,{key:"subitem3",label:"subitem3",icon:"search-plus"})]}))))};var H=R;U.parameters=K({storySource:{source:`function Examples() {
  return (
    <VerticalGroup>
      <StoryExample name="Plain">
        <Menu>
          <Menu.Item label="Google" />
          <Menu.Item label="Filter" />
          <Menu.Item label="Active" active />
          <Menu.Item label="I am a link" url="http://google.com" target="_blank" />
          <Menu.Item label="With destructive prop set" destructive />
        </Menu>
      </StoryExample>
      <StoryExample name="With icons and a divider">
        <Menu>
          <Menu.Item label="Google" icon="search-plus" />
          <Menu.Item label="Filter" icon="filter" />
          <Menu.Item label="History" icon="history" />
          <Menu.Divider />
          <Menu.Item label="With destructive prop set" icon="trash-alt" destructive />
        </Menu>
      </StoryExample>
      <StoryExample name="With disabled items">
        <Menu>
          <Menu.Item label="Google" icon="search-plus" />
          <Menu.Item label="Disabled action" icon="history" disabled />
          <Menu.Item label="Disabled link" icon="external-link-alt" url="http://google.com" target="_blank" disabled />
          <Menu.Item
            label="Submenu"
            icon="apps"
            childItems={[
              <Menu.Item key="subitem1" label="subitem1" icon="history" disabled />,
              <Menu.Item key="subitem2" label="subitem2" icon="apps" />,
            ]}
          />
          <Menu.Item
            label="Disabled submenu"
            icon="apps"
            disabled
            childItems={[
              <Menu.Item key="subitem1" label="subitem1" icon="history" />,
              <Menu.Item key="subitem2" label="subitem2" icon="apps" />,
            ]}
          />
          <Menu.Item label="Disabled destructive action" icon="trash-alt" destructive disabled />
        </Menu>
      </StoryExample>
      <StoryExample name="With header & groups">
        <Menu
          header={
            <GraphContextMenuHeader
              timestamp="2020-11-25 19:04:25"
              seriesColor="#00ff00"
              displayName="A-series"
              displayValue={{
                text: '128',
                suffix: 'km/h',
              }}
            />
          }
          ariaLabel="Menu header"
        >
          <Menu.Group label="Group 1">
            <Menu.Item label="item1" icon="history" />
            <Menu.Item label="item2" icon="filter" />
          </Menu.Group>
          <Menu.Group label="Group 2">
            <Menu.Item label="item1" icon="history" />
          </Menu.Group>
        </Menu>
      </StoryExample>
      <StoryExample name="With submenu and shortcuts">
        <Menu>
          <Menu.Item label="item1" icon="history" shortcut="q p" />
          <Menu.Item
            label="Item with a very long title"
            icon="apps"
            childItems={[
              <Menu.Item key="subitem1" label="subitem1" icon="history" />,
              <Menu.Item key="subitem2" label="subitem2" icon="apps" />,
              <Menu.Item
                key="subitem3"
                label="subitem3"
                icon="search-plus"
                childItems={[
                  <Menu.Item key="subitem1" label="subitem1" icon="history" />,
                  <Menu.Item key="subitem2" label="subitem2" icon="apps" />,
                  <Menu.Item key="subitem3" label="subitem3" icon="search-plus" />,
                ]}
              />,
            ]}
            shortcut="p s"
          />
          <Menu.Item
            label="item3"
            icon="filter"
            childItems={[
              <Menu.Item key="subitem1" label="subitem1" icon="history" />,
              <Menu.Item key="subitem2" label="subitem2" icon="apps" />,
              <Menu.Item key="subitem3" label="subitem3" icon="search-plus" />,
            ]}
          />
        </Menu>
      </StoryExample>
    </VerticalGroup>
  );
}`}},U.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Menu/Menu.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Menu/Menu.story.tsx#ComponentMeta"})}catch(W){}},"./src/components/Modal/Modal.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return j},UsingContentClassName:function(){return $},WithTabs:function(){return F},default:function(){return R}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/common-tags-npm-1.8.2-2c30ba69b3-767a6255a8.zip/node_modules/common-tags/es/index.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("./src/components/Modal/Modal.tsx"),f=e("./src/components/Button/Button.tsx"),x=e("./src/components/Tabs/Tab.tsx"),d=e("./src/components/Tabs/TabsBar.tsx"),i=e("./src/components/Modal/ModalHeader.tsx");const c=({icon:U,title:H,tabs:W,activeTab:oe,onChangeTab:Q})=>a.createElement(i.x,{icon:U,title:H},a.createElement(d.J,{hideBorder:!0},W.map((P,ae)=>a.createElement(x.O,{key:`${P.value}-${ae}`,label:P.label,icon:P.icon,suffix:P.tabSuffix,active:P.value===oe,onChangeTab:()=>Q(P)}))));try{c.displayName="ModalTabsHeader",c.__docgenInfo={description:"",displayName:"ModalTabsHeader",props:{icon:{defaultValue:null,description:"",name:"icon",required:!0,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},title:{defaultValue:null,description:"",name:"title",required:!0,type:{name:"string"}},tabs:{defaultValue:null,description:"",name:"tabs",required:!0,type:{name:"ModalTab[]"}},activeTab:{defaultValue:null,description:"",name:"activeTab",required:!0,type:{name:"string"}},onChangeTab:{defaultValue:null,description:"",name:"onChangeTab",required:!0,type:{name:"(tab: ModalTab) => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Modal/ModalTabsHeader.tsx#ModalTabsHeader"]={docgenInfo:c.__docgenInfo,name:"ModalTabsHeader",path:"src/components/Modal/ModalTabsHeader.tsx#ModalTabsHeader"})}catch(U){}var E=e("./src/components/Tabs/TabContent.tsx"),O=e("./src/types/icon.ts"),m=e("./src/utils/storybook/withCenteredStory.tsx"),w=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),_=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),C=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function b(U){const H=Object.assign({h1:"h1",p:"p"},(0,_.ah)(),U.components);return(0,w.jsxs)(w.Fragment,{children:[(0,w.jsx)(C.h_,{title:"MDX|Modal",component:l.u}),`
`,(0,w.jsx)(H.h1,{children:"Modal"}),`
`,(0,w.jsx)(H.p,{children:"Generic Modal component"}),`
`,(0,w.jsx)(C.xP,{of:l.u}),`
`,(0,w.jsx)(H.h1,{children:"ModalTabsHeader"}),`
`,(0,w.jsx)(H.p,{children:"Custom header element with tabs"}),`
`,(0,w.jsx)(C.xP,{of:c})]})}function g(U={}){const{wrapper:H}=Object.assign({},(0,_.ah)(),U.components);return H?(0,w.jsx)(H,Object.assign({},U,{children:(0,w.jsx)(b,U)})):b(U)}var v=g,y=Object.defineProperty,h=Object.defineProperties,s=Object.getOwnPropertyDescriptors,o=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable,p=(U,H,W)=>H in U?y(U,H,{enumerable:!0,configurable:!0,writable:!0,value:W}):U[H]=W,S=(U,H)=>{for(var W in H||(H={}))r.call(H,W)&&p(U,W,H[W]);if(o)for(var W of o(H))u.call(H,W)&&p(U,W,H[W]);return U},k=(U,H)=>h(U,s(H)),D=(U,H)=>{var W={};for(var oe in U)r.call(U,oe)&&H.indexOf(oe)<0&&(W[oe]=U[oe]);if(U!=null&&o)for(var oe of o(U))H.indexOf(oe)<0&&u.call(U,oe)&&(W[oe]=U[oe]);return W},M=`import { css, cx } from '@emotion/css';
import { Story, Meta } from '@storybook/react';
import { oneLineTrim } from 'common-tags';
import React, { useState } from 'react';

import { Button, Modal, ModalTabsHeader, TabContent } from '@grafana/ui';

import { getAvailableIcons } from '../../types';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './Modal.mdx';

const meta: Meta = {
  title: 'Overlays/Modal',
  component: Modal,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['className', 'contentClassName', 'onDismiss', 'onClickBackdrop'],
    },
  },
  args: {
    body: oneLineTrim(\`Id incididunt do pariatur qui labore. Sint culpa irure cillum et ullamco proident. Deserunt ipsum velit dolore est enim proident dolore consectetur. Et cillum tempor pariatur et. Est tempor cillum ad id nulla. Cillum ut proident
    magna do cillum consequat reprehenderit excepteur. Pariatur culpa id excepteur reprehenderit consequat qui qui sit
    consectetur esse enim mollit incididunt. Ea excepteur nisi mollit reprehenderit eiusmod tempor. Eiusmod incididunt
    occaecat velit consectetur dolor cillum anim commodo fugiat cupidatat ut tempor officia. Aliquip fugiat occaecat
    excepteur consectetur ullamco consectetur exercitation occaecat sint sint incididunt cillum minim. Sint aliquip ea
    pariatur anim. Veniam laboris mollit in voluptate exercitation sint deserunt dolor ullamco ex dolor. Enim
    reprehenderit ut Lorem aliquip est laborum in. Aliqua in ut aute elit nulla amet. Ex proident pariatur ex in
    aliquip. Labore eu Lorem sint aliqua reprehenderit ipsum veniam aliquip laborum dolor deserunt cupidatat velit
    amet.\`),
  },
  argTypes: {
    icon: {
      control: {
        type: 'select',
        options: getAvailableIcons(),
      },
    },
    title: {
      control: {
        type: 'text',
      },
    },
  },
};

export const Basic: Story = ({ body, title, ...args }) => {
  return (
    <Modal title={title} {...args}>
      {body}
      <Modal.ButtonRow>
        <Button variant="secondary" fill="outline">
          Cancel
        </Button>
        <Button>Button1</Button>
      </Modal.ButtonRow>
    </Modal>
  );
};
Basic.args = {
  title: 'My Modal',
  icon: 'exclamation-triangle',
  isOpen: true,
  closeOnEscape: false,
  iconTooltip: 'icon tooltip',
};

const tabs = [
  { label: '1st child', value: 'first', active: true },
  { label: '2nd child', value: 'second', active: false },
  { label: '3rd child', value: 'third', active: false },
];

export const WithTabs: Story = (args) => {
  const [activeTab, setActiveTab] = useState('first');
  const modalHeader = (
    <ModalTabsHeader
      title={args.title}
      icon={args.icon}
      tabs={tabs}
      activeTab={activeTab}
      onChangeTab={(t) => {
        setActiveTab(t.value);
      }}
    />
  );
  return (
    <div>
      <Modal title={modalHeader} isOpen={true}>
        <TabContent>
          {activeTab === tabs[0].value && <div>{args.body}</div>}
          {activeTab === tabs[1].value && <div>Second tab content</div>}
          {activeTab === tabs[2].value && <div>Third tab content</div>}
        </TabContent>
      </Modal>
    </div>
  );
};
WithTabs.args = {
  title: 'My Modal',
  icon: 'cog',
};

export const UsingContentClassName: Story = ({ title, body, ...args }) => {
  const override = {
    modalContent: css\`
      background-color: darkorange;
    \`,
  };
  return (
    <Modal title={title} {...args} contentClassName={cx(override.modalContent)}>
      {body}
    </Modal>
  );
};
UsingContentClassName.args = {
  title: 'Using contentClassName to override background',
  icon: 'exclamation-triangle',
  isOpen: true,
  closeOnEscape: false,
  iconTooltip: 'icon tooltip',
};

export default meta;
`,I={Basic:{startLoc:{col:28,line:51},endLoc:{col:1,line:63},startBody:{col:28,line:51},endBody:{col:1,line:63}},WithTabs:{startLoc:{col:31,line:78},endLoc:{col:1,line:102},startBody:{col:31,line:78},endBody:{col:1,line:102}},UsingContentClassName:{startLoc:{col:44,line:108},endLoc:{col:1,line:119},startBody:{col:44,line:108},endBody:{col:1,line:119}}};const T={title:"Overlays/Modal",component:l.u,decorators:[m.BU],parameters:{docs:{page:v},controls:{exclude:["className","contentClassName","onDismiss","onClickBackdrop"]}},args:{body:(0,n.IV)(`Id incididunt do pariatur qui labore. Sint culpa irure cillum et ullamco proident. Deserunt ipsum velit dolore est enim proident dolore consectetur. Et cillum tempor pariatur et. Est tempor cillum ad id nulla. Cillum ut proident
    magna do cillum consequat reprehenderit excepteur. Pariatur culpa id excepteur reprehenderit consequat qui qui sit
    consectetur esse enim mollit incididunt. Ea excepteur nisi mollit reprehenderit eiusmod tempor. Eiusmod incididunt
    occaecat velit consectetur dolor cillum anim commodo fugiat cupidatat ut tempor officia. Aliquip fugiat occaecat
    excepteur consectetur ullamco consectetur exercitation occaecat sint sint incididunt cillum minim. Sint aliquip ea
    pariatur anim. Veniam laboris mollit in voluptate exercitation sint deserunt dolor ullamco ex dolor. Enim
    reprehenderit ut Lorem aliquip est laborum in. Aliqua in ut aute elit nulla amet. Ex proident pariatur ex in
    aliquip. Labore eu Lorem sint aliqua reprehenderit ipsum veniam aliquip laborum dolor deserunt cupidatat velit
    amet.`)},argTypes:{icon:{control:{type:"select",options:(0,O.BI)()}},title:{control:{type:"text"}}}},j=U=>{var H=U,{body:W,title:oe}=H,Q=D(H,["body","title"]);return a.createElement(l.u,S({title:oe},Q),W,a.createElement(l.u.ButtonRow,null,a.createElement(f.zx,{variant:"secondary",fill:"outline"},"Cancel"),a.createElement(f.zx,null,"Button1")))};j.args={title:"My Modal",icon:"exclamation-triangle",isOpen:!0,closeOnEscape:!1,iconTooltip:"icon tooltip"};const K=[{label:"1st child",value:"first",active:!0},{label:"2nd child",value:"second",active:!1},{label:"3rd child",value:"third",active:!1}],F=U=>{const[H,W]=(0,a.useState)("first"),oe=a.createElement(c,{title:U.title,icon:U.icon,tabs:K,activeTab:H,onChangeTab:Q=>{W(Q.value)}});return a.createElement("div",null,a.createElement(l.u,{title:oe,isOpen:!0},a.createElement(E.I,null,H===K[0].value&&a.createElement("div",null,U.body),H===K[1].value&&a.createElement("div",null,"Second tab content"),H===K[2].value&&a.createElement("div",null,"Third tab content"))))};F.args={title:"My Modal",icon:"cog"};const $=U=>{var H=U,{title:W,body:oe}=H,Q=D(H,["title","body"]);const P={modalContent:t.iv`
      background-color: darkorange;
    `};return a.createElement(l.u,k(S({title:W},Q),{contentClassName:(0,t.cx)(P.modalContent)}),oe)};$.args={title:"Using contentClassName to override background",icon:"exclamation-triangle",isOpen:!0,closeOnEscape:!1,iconTooltip:"icon tooltip"};var R=T;j.parameters=S({storySource:{source:`({ body, title, ...args }) => {
  return (
    <Modal title={title} {...args}>
      {body}
      <Modal.ButtonRow>
        <Button variant="secondary" fill="outline">
          Cancel
        </Button>
        <Button>Button1</Button>
      </Modal.ButtonRow>
    </Modal>
  );
}`}},j.parameters),F.parameters=S({storySource:{source:`(args) => {
  const [activeTab, setActiveTab] = useState('first');
  const modalHeader = (
    <ModalTabsHeader
      title={args.title}
      icon={args.icon}
      tabs={tabs}
      activeTab={activeTab}
      onChangeTab={(t) => {
        setActiveTab(t.value);
      }}
    />
  );
  return (
    <div>
      <Modal title={modalHeader} isOpen={true}>
        <TabContent>
          {activeTab === tabs[0].value && <div>{args.body}</div>}
          {activeTab === tabs[1].value && <div>Second tab content</div>}
          {activeTab === tabs[2].value && <div>Third tab content</div>}
        </TabContent>
      </Modal>
    </div>
  );
}`}},F.parameters),$.parameters=S({storySource:{source:`({ title, body, ...args }) => {
  const override = {
    modalContent: css\`
      background-color: darkorange;
    \`,
  };
  return (
    <Modal title={title} {...args} contentClassName={cx(override.modalContent)}>
      {body}
    </Modal>
  );
}`}},$.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Modal/Modal.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Modal/Modal.story.tsx#Meta"})}catch(U){}},"./src/components/PageLayout/PageToolbar.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Examples:function(){return R},default:function(){return U}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/components/Layout/Layout.tsx"),l=e("./src/components/ToolbarButton/ToolbarButton.tsx"),f=e("./src/utils/storybook/StoryExample.tsx"),x=e("./src/utils/storybook/withCenteredStory.tsx"),d=e("./src/components/IconButton/IconButton.tsx"),i=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),c=e("../grafana-e2e-selectors/src/selectors/index.ts"),E=e("../../.yarn/__virtual__/react-router-dom-virtual-02f01fd472/2/yarn/cache/react-router-dom-npm-5.3.0-aa9adb5bec-47584fd629.zip/node_modules/react-router-dom/esm/react-router-dom.js"),O=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/location.ts"),m=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/index.ts"),w=Object.defineProperty,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(H,W,oe)=>W in H?w(H,W,{enumerable:!0,configurable:!0,writable:!0,value:oe}):H[W]=oe,v=(H,W)=>{for(var oe in W||(W={}))C.call(W,oe)&&g(H,oe,W[oe]);if(_)for(var oe of _(W))b.call(W,oe)&&g(H,oe,W[oe]);return H},y=(H,W)=>{var oe={};for(var Q in H)C.call(H,Q)&&W.indexOf(Q)<0&&(oe[Q]=H[Q]);if(H!=null&&_)for(var Q of _(H))W.indexOf(Q)<0&&b.call(H,Q)&&(oe[Q]=H[Q]);return oe};const h=(0,n.forwardRef)((H,W)=>{var oe=H,{href:Q,children:P}=oe,ae=y(oe,["href","children"]);const q=O.u.stripBaseFromUrl(m.QX.sanitizeUrl(Q!=null?Q:""));return n.createElement(E.rU,v({ref:W,to:q},ae),P)});h.displayName="Link";try{h.displayName="Link",h.__docgenInfo={description:"",displayName:"Link",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Link/Link.tsx#Link"]={docgenInfo:h.__docgenInfo,name:"Link",path:"src/components/Link/Link.tsx#Link"})}catch(H){}var s=e("./src/components/ToolbarButton/ToolbarButtonRow.tsx"),o=e("./src/themes/ThemeContext.tsx"),r=e("./src/themes/mixins.ts"),u=e("./src/components/Icon/Icon.tsx");const p=n.memo(({title:H,section:W,parent:oe,pageIcon:Q,onGoBack:P,children:ae,titleHref:q,parentHref:Y,leftItems:ve,isFullscreen:re,className:je,"aria-label":me,buttonOverflowAlignment:ne="right",forceShowLeftItems:Z=!1})=>{const te=(0,o.wW)(S),Pe=(0,i.cx)("page-toolbar",te.toolbar,{["page-toolbar--fullscreen"]:re,[te.noPageIcon]:!Q},je),he=n.createElement(n.Fragment,null,n.createElement("span",{className:te.truncateText},H),W&&n.createElement("span",{className:te.pre}," / ",W));return n.createElement("nav",{className:Pe,"aria-label":me},n.createElement("div",{className:te.leftWrapper},Q&&!P&&n.createElement("div",{className:te.pageIcon},n.createElement(u.J,{name:Q,size:"lg","aria-hidden":!0})),P&&n.createElement("div",{className:te.pageIcon},n.createElement(d.h,{name:"arrow-left",tooltip:"Go back (Esc)",tooltipPlacement:"bottom",size:"xxl","aria-label":c.wl.components.BackButton.backArrow,onClick:P})),n.createElement("nav",{"aria-label":"Search links",className:te.navElement},oe&&Y&&n.createElement(n.Fragment,null,n.createElement(h,{"aria-label":`Search dashboard in the ${oe} folder`,className:(0,i.cx)(te.titleText,te.parentLink,te.titleLink,te.truncateText),href:Y},oe," ",n.createElement("span",{className:te.parentIcon})),q&&n.createElement("span",{className:(0,i.cx)(te.titleText,te.titleDivider),"aria-hidden":!0},"/")),(H||Boolean(ve==null?void 0:ve.length))&&n.createElement("div",{className:te.titleWrapper},H&&n.createElement("h1",{className:te.h1Styles},q?n.createElement(h,{"aria-label":"Search dashboard by name",className:(0,i.cx)(te.titleText,te.titleLink),href:q},he):n.createElement("div",{className:te.titleText},he)),ve==null?void 0:ve.map((ie,Ce)=>n.createElement("div",{className:(0,i.cx)(te.leftActionItem,{[te.forceShowLeftActionItems]:Z}),key:Ce},ie))))),n.createElement(s.R,{alignment:ne},n.Children.toArray(ae).filter(Boolean)))});p.displayName="PageToolbar";const S=H=>{const{spacing:W,typography:oe}=H,Q=(0,r.SV)(H);return{pre:i.iv`
      white-space: pre;
    `,toolbar:i.iv`
      align-items: center;
      background: ${H.colors.background.canvas};
      display: flex;
      gap: ${H.spacing(2)};
      justify-content: space-between;
      padding: ${H.spacing(1.5,2)};

      ${H.breakpoints.down("md")} {
        padding-left: 53px;
      }
    `,noPageIcon:i.iv`
      ${H.breakpoints.down("md")} {
        padding-left: ${H.spacing(2)};
      }
    `,leftWrapper:i.iv`
      display: flex;
      flex-wrap: nowrap;
      max-width: 70%;
    `,pageIcon:i.iv`
      display: none;
      ${H.breakpoints.up("sm")} {
        display: flex;
        padding-right: ${H.spacing(1)};
        align-items: center;
      }
    `,truncateText:i.iv`
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    `,titleWrapper:i.iv`
      display: flex;
      margin: 0;
      min-width: 0;
    `,navElement:i.iv`
      display: flex;
      align-items: center;
      min-width: 0;
    `,h1Styles:i.iv`
      margin: ${W(0,1,0,0)};
      line-height: inherit;
      flex-grow: 1;
      min-width: 0;
    `,parentIcon:i.iv`
      margin-left: ${H.spacing(.5)};
    `,titleText:i.iv`
      display: flex;
      font-size: ${oe.size.lg};
      margin: 0;
      max-width: 300px;
      border-radius: ${H.shape.radius.default};
    `,titleLink:i.iv`
      &:focus-visible {
        ${Q}
      }
    `,titleDivider:i.iv`
      padding: ${W(0,.5,0,.5)};
      display: none;
      ${H.breakpoints.up("md")} {
        display: unset;
      }
    `,parentLink:i.iv`
      display: none;
      ${H.breakpoints.up("md")} {
        display: unset;
        flex: 1;
      }
    `,leftActionItem:i.iv`
      display: none;
      align-items: center;
      padding-right: ${W(.5)};
      ${H.breakpoints.up("md")} {
        display: flex;
      }
    `,forceShowLeftActionItems:i.iv`
      display: flex;
    `}};try{p.displayName="PageToolbar",p.__docgenInfo={description:"",displayName:"PageToolbar",props:{pageIcon:{defaultValue:null,description:"",name:"pageIcon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"string"}},section:{defaultValue:null,description:"",name:"section",required:!1,type:{name:"string"}},parent:{defaultValue:null,description:"",name:"parent",required:!1,type:{name:"string"}},onGoBack:{defaultValue:null,description:"",name:"onGoBack",required:!1,type:{name:"(() => void)"}},titleHref:{defaultValue:null,description:"",name:"titleHref",required:!1,type:{name:"string"}},parentHref:{defaultValue:null,description:"",name:"parentHref",required:!1,type:{name:"string"}},leftItems:{defaultValue:null,description:"",name:"leftItems",required:!1,type:{name:"ReactNode[]"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},isFullscreen:{defaultValue:null,description:"",name:"isFullscreen",required:!1,type:{name:"boolean"}},"aria-label":{defaultValue:null,description:"",name:"aria-label",required:!1,type:{name:"string"}},buttonOverflowAlignment:{defaultValue:null,description:"",name:"buttonOverflowAlignment",required:!1,type:{name:"enum",value:[{value:'"right"'},{value:'"left"'}]}},forceShowLeftItems:{defaultValue:null,description:`Forces left items to be visible on small screens.
By default left items are hidden on small screens.`,name:"forceShowLeftItems",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PageLayout/PageToolbar.tsx#PageToolbar"]={docgenInfo:p.__docgenInfo,name:"PageToolbar",path:"src/components/PageLayout/PageToolbar.tsx#PageToolbar"})}catch(H){}var k=Object.defineProperty,D=Object.getOwnPropertySymbols,M=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable,T=(H,W,oe)=>W in H?k(H,W,{enumerable:!0,configurable:!0,writable:!0,value:oe}):H[W]=oe,j=(H,W)=>{for(var oe in W||(W={}))M.call(W,oe)&&T(H,oe,W[oe]);if(D)for(var oe of D(W))I.call(W,oe)&&T(H,oe,W[oe]);return H},K=null,F={Examples:{startLoc:{col:24,line:20},endLoc:{col:1,line:57},startBody:{col:24,line:20},endBody:{col:1,line:57}}};const $={title:"Layout/PageToolbar",component:p,decorators:[x.BU],parameters:{}},R=()=>n.createElement(a.wc,null,n.createElement(f.E,{name:"With non clickable title"},n.createElement(p,{pageIcon:"bell",title:"Dashboard"},n.createElement(l.h,{icon:"panel-add"}),n.createElement(l.h,{icon:"sync"},"Sync"))),n.createElement(f.E,{name:"With clickable title and parent"},n.createElement(p,{pageIcon:"apps",title:"A very long dashboard name",parent:"A long folder name",titleHref:"",parentHref:"",leftItems:[n.createElement(d.h,{name:"share-alt",size:"lg",key:"share"}),n.createElement(d.h,{name:"favorite",iconType:"mono",size:"lg",key:"favorite"})]},n.createElement(l.h,{icon:"panel-add"}),n.createElement(l.h,{icon:"share-alt"}),n.createElement(l.h,{icon:"sync"},"Sync"),n.createElement(l.h,{icon:"cog"},"Settings "))),n.createElement(f.E,{name:"Go back version"},n.createElement(p,{title:"Service overview / Edit panel",onGoBack:()=>(0,t.action)("Go back")},n.createElement(l.h,{icon:"cog"}),n.createElement(l.h,{icon:"save"}),n.createElement(l.h,null,"Discard"),n.createElement(l.h,null,"Apply"))));var U=$;R.parameters=j({storySource:{source:`() => {
  return (
    <VerticalGroup>
      <StoryExample name="With non clickable title">
        <PageToolbar pageIcon="bell" title="Dashboard">
          <ToolbarButton icon="panel-add" />
          <ToolbarButton icon="sync">Sync</ToolbarButton>
        </PageToolbar>
      </StoryExample>
      <StoryExample name="With clickable title and parent">
        <PageToolbar
          pageIcon="apps"
          title="A very long dashboard name"
          parent="A long folder name"
          titleHref=""
          parentHref=""
          leftItems={[
            <IconButton name="share-alt" size="lg" key="share" />,
            <IconButton name="favorite" iconType="mono" size="lg" key="favorite" />,
          ]}
        >
          <ToolbarButton icon="panel-add" />
          <ToolbarButton icon="share-alt" />
          <ToolbarButton icon="sync">Sync</ToolbarButton>
          <ToolbarButton icon="cog">Settings </ToolbarButton>
        </PageToolbar>
      </StoryExample>
      <StoryExample name="Go back version">
        <PageToolbar title="Service overview / Edit panel" onGoBack={() => action('Go back')}>
          <ToolbarButton icon="cog" />
          <ToolbarButton icon="save" />
          <ToolbarButton>Discard</ToolbarButton>
          <ToolbarButton>Apply</ToolbarButton>
        </PageToolbar>
      </StoryExample>
    </VerticalGroup>
  );
}`}},R.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PageLayout/PageToolbar.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/PageLayout/PageToolbar.story.tsx#ComponentMeta"})}catch(H){}},"./src/components/Pagination/Pagination.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{WithPages:function(){return y},default:function(){return h}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Pagination/Pagination.tsx"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function d(s){const o=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,f.ah)(),s.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(x.h_,{title:"MDX|Pagination",component:n.t}),`
`,(0,l.jsx)(o.h1,{children:"Pagination"}),`
`,(0,l.jsx)(o.p,{children:"Component used for rendering a page selector below paginated content."}),`
`,(0,l.jsx)(o.h3,{children:"Usage"}),`
`,(0,l.jsx)(o.pre,{children:(0,l.jsx)(o.code,{className:"language-tsx",children:`<div>
  <div>Page 1 content</div>
  <Pagination currentPage={1} numberOfPages={5} onNavigate={() => fetchPage(2)} />
</div>
`})}),`
`,(0,l.jsx)(x.xP,{of:n.t})]})}function i(s={}){const{wrapper:o}=Object.assign({},(0,f.ah)(),s.components);return o?(0,l.jsx)(o,Object.assign({},s,{children:(0,l.jsx)(d,s)})):d(s)}var c=i,E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?E(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React, { useState } from 'react';

import { Pagination } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './Pagination.mdx';

const meta: ComponentMeta<typeof Pagination> = {
  title: 'Buttons/Pagination',
  component: Pagination,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['currentPage', 'onNavigate'],
    },
  },
  argTypes: {
    numberOfPages: {
      control: {
        type: 'number',
        min: 1,
      },
    },
  },
};

export const WithPages: ComponentStory<typeof Pagination> = ({ numberOfPages, hideWhenSinglePage }) => {
  const [page, setPage] = useState(1);
  return (
    <Pagination
      numberOfPages={numberOfPages}
      currentPage={page}
      onNavigate={setPage}
      hideWhenSinglePage={hideWhenSinglePage}
    />
  );
};
WithPages.args = {
  numberOfPages: 5,
  hideWhenSinglePage: false,
};

export default meta;
`,g={WithPages:{startLoc:{col:60,line:32},endLoc:{col:1,line:42},startBody:{col:60,line:32},endBody:{col:1,line:42}}};const v={title:"Buttons/Pagination",component:n.t,decorators:[a.BU],parameters:{docs:{page:c},controls:{exclude:["currentPage","onNavigate"]}},argTypes:{numberOfPages:{control:{type:"number",min:1}}}},y=({numberOfPages:s,hideWhenSinglePage:o})=>{const[r,u]=(0,t.useState)(1);return t.createElement(n.t,{numberOfPages:s,currentPage:r,onNavigate:u,hideWhenSinglePage:o})};y.args={numberOfPages:5,hideWhenSinglePage:!1};var h=v;y.parameters=C({storySource:{source:`({ numberOfPages, hideWhenSinglePage }) => {
  const [page, setPage] = useState(1);
  return (
    <Pagination
      numberOfPages={numberOfPages}
      currentPage={page}
      onNavigate={setPage}
      hideWhenSinglePage={hideWhenSinglePage}
    />
  );
}`}},y.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Pagination/Pagination.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Pagination/Pagination.story.tsx#ComponentMeta"})}catch(s){}},"./src/components/PanelChrome/PanelChrome.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return wt},Examples:function(){return it},ExamplesHoverHeader:function(){return _t},default:function(){return ze}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useInterval.js"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/data.ts"),x=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),d=e("./src/themes/ThemeContext.tsx");const i={gray98:"#f7f8fa",gray97:"#f1f5f9",gray95:"#e9edf2",gray90:"#dce1e6",gray85:"#c7d0d9",gray70:"#9fa7b3",gray60:"#7b8087",gray33:"#464c54",gray25:"#2c3235",gray15:"#202226",gray10:"#141619",gray05:"#0b0c0e",blue95:"#5794f2",blue85:"#33a2e5",blue80:"#3274d9",blue77:"#1f60c4",red88:"#e02f44"},c=8,E={name:"Grafana Default",typography:{fontFamily:{sansSerif:'"Inter", "Helvetica", "Arial", sans-serif',monospace:"'Roboto Mono', monospace"},size:{base:"14px",xs:"10px",sm:"12px",md:"14px",lg:"18px"},heading:{h1:"28px",h2:"24px",h3:"21px",h4:"18px",h5:"16px",h6:"14px"},weight:{light:300,regular:400,semibold:500,bold:500},lineHeight:{xs:1,sm:1.1,md:1.5,lg:2},link:{decoration:"none",hoverDecoration:"none"}},breakpoints:{xs:"0",sm:"544px",md:"769px",lg:"992px",xl:"1200px",xxl:"1440px"},spacing:{base:c,insetSquishMd:"4px 8px",d:"16px",xxs:"2px",xs:"4px",sm:"8px",md:"16px",lg:"24px",xl:"32px",gutter:"30px",formSpacingBase:c,formMargin:`${c*4}px`,formFieldsetMargin:`${c*2}px`,formInputHeight:c*4,formButtonHeight:c*4,formInputPaddingHorizontal:`${c}px`,formInputAffixPaddingHorizontal:`${c/2}px`,formInputMargin:`${c*2}px`,formLabelPadding:"0 0 0 2px",formLabelMargin:`0 0 ${c/2+"px"} 0`,formValidationMessagePadding:"4px 8px",formValidationMessageMargin:"4px 0 0 0",inlineFormMargin:"4px"},border:{radius:{sm:"2px",md:"3px",lg:"5px"},width:{sm:"1px"}},height:{sm:24,md:32,lg:48},panelPadding:8,panelHeaderHeight:28,zIndex:{navbarFixed:1e3,sidemenu:1020,dropdown:1030,typeahead:1030,tooltip:1040,modalBackdrop:1050,modal:1060,portal:1061}};var O=null,m=e("./src/components/Icon/Icon.tsx"),w=e("./src/components/Tooltip/Tooltip.tsx");const _=({error:le,onClick:ye})=>{const Se=(0,d.wW)(C);return le?a.createElement(w.u,{theme:"error",content:le},a.createElement(m.J,{onClick:ye,className:(0,x.cx)(Se.icon,{[Se.clickable]:!!ye}),size:"sm",name:"exclamation-triangle"})):null},C=()=>({clickable:(0,x.iv)({cursor:"pointer"}),icon:(0,x.iv)({color:`${i.red88}`})});try{_.displayName="ErrorIndicator",_.__docgenInfo={description:"",displayName:"ErrorIndicator",props:{error:{defaultValue:null,description:"",name:"error",required:!1,type:{name:"string"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/ErrorIndicator.tsx#ErrorIndicator"]={docgenInfo:_.__docgenInfo,name:"ErrorIndicator",path:"src/components/PanelChrome/ErrorIndicator.tsx#ErrorIndicator"})}catch(le){}var b=e("../grafana-e2e-selectors/src/selectors/index.ts");const g=({onCancel:le,loading:ye})=>{const Se=(0,d.wW)(v);return ye?a.createElement(w.u,{content:"Cancel query"},a.createElement(m.J,{className:(0,x.cx)("spin-clockwise",{[Se.clickable]:!!le}),name:"sync",size:"sm",onClick:le,"aria-label":b.wl.components.LoadingIndicator.icon})):null},v=()=>({clickable:(0,x.iv)({cursor:"pointer"})});try{g.displayName="LoadingIndicator",g.__docgenInfo={description:"",displayName:"LoadingIndicator",props:{loading:{defaultValue:null,description:"",name:"loading",required:!0,type:{name:"boolean"}},onCancel:{defaultValue:null,description:"",name:"onCancel",required:!0,type:{name:"() => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/LoadingIndicator.tsx#LoadingIndicator"]={docgenInfo:g.__docgenInfo,name:"LoadingIndicator",path:"src/components/PanelChrome/LoadingIndicator.tsx#LoadingIndicator"})}catch(le){}function y({children:le,delay:ye}){const[Se,Be]=(0,a.useState)(!1);return(0,a.useEffect)(()=>{window.setTimeout(()=>{Be(!0)},ye)},[le,ye]),a.createElement(a.Fragment,null,Se?le:null)}try{y.displayName="DelayRender",y.__docgenInfo={description:"Delay the rendering of the children by N amount of milliseconds",displayName:"DelayRender",props:{delay:{defaultValue:null,description:"",name:"delay",required:!0,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/utils/DelayRender.tsx#DelayRender"]={docgenInfo:y.__docgenInfo,name:"DelayRender",path:"src/utils/DelayRender.tsx#DelayRender"})}catch(le){}var h=e("./src/components/LoadingBar/LoadingBar.tsx"),s=e("./src/components/Dropdown/Dropdown.tsx"),o=e("./src/components/ToolbarButton/ToolbarButton.tsx");function r({menu:le,title:ye,placement:Se="bottom",offset:Be,dragClassCancel:Xe,menuButtonClass:st,onVisibleChange:mt,onOpenMenu:rt}){const lt=ye?b.wl.components.Panels.Panel.menu(ye):"panel-menu-button",ft=(0,a.useCallback)(St=>(St&&rt&&rt(),mt),[rt,mt]);return a.createElement(s.L,{overlay:le,placement:Se,offset:Be,onVisibleChange:ft},a.createElement(o.h,{"aria-label":`Menu for panel with ${ye?`title ${ye}`:"no title"}`,title:"Menu",icon:"ellipsis-v",iconSize:"md",narrow:!0,"data-testid":lt,className:(0,x.cx)(st,Xe)}))}try{r.displayName="PanelMenu",r.__docgenInfo={description:"",displayName:"PanelMenu",props:{menu:{defaultValue:null,description:"",name:"menu",required:!0,type:{name:"ReactElement<any, string | JSXElementConstructor<any>> | (() => ReactElement<any, string | JSXElementConstructor<any>>)"}},menuButtonClass:{defaultValue:null,description:"",name:"menuButtonClass",required:!1,type:{name:"string"}},dragClassCancel:{defaultValue:null,description:"",name:"dragClassCancel",required:!1,type:{name:"string"}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"string"}},placement:{defaultValue:{value:"bottom"},description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}},offset:{defaultValue:null,description:"",name:"offset",required:!1,type:{name:"[number, number]"}},onVisibleChange:{defaultValue:null,description:"",name:"onVisibleChange",required:!1,type:{name:"((state: boolean) => void)"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/PanelMenu.tsx#PanelMenu"]={docgenInfo:r.__docgenInfo,name:"PanelMenu",path:"src/components/PanelChrome/PanelMenu.tsx#PanelMenu"})}catch(le){}function u({menu:le,title:ye,dragClass:Se,children:Be,offset:Xe=-32,onOpenMenu:st}){const mt=(0,d.wW)(p),rt=(0,a.useRef)(null),lt=(0,a.useCallback)(pt=>{var ut;(ut=rt.current)==null||ut.setPointerCapture(pt.pointerId)},[]),ft=(0,a.useCallback)(pt=>{var ut;(ut=rt.current)==null||ut.releasePointerCapture(pt.pointerId)},[]),[St,gt]=(0,a.useState)(!1);return Be===void 0||a.Children.count(Be)===0?null:a.createElement("div",{className:(0,x.cx)(mt.container,{"show-on-hover":!St}),style:{top:`${Xe}px`},"data-testid":"hover-header-container"},Se&&a.createElement("div",{className:(0,x.cx)(mt.square,mt.draggable,Se),onPointerDown:lt,onPointerUp:ft,ref:rt},a.createElement(m.J,{name:"expand-arrows",className:mt.draggableIcon})),!ye&&a.createElement("h6",{className:(0,x.cx)(mt.untitled,mt.draggable,Se)},"Untitled"),Be,le&&a.createElement(r,{menu:le,title:ye,placement:"bottom",menuButtonClass:mt.menuButton,onVisibleChange:gt,onOpenMenu:st}))}function p(le){return{hidden:(0,x.iv)({visibility:"hidden",opacity:"0"}),container:(0,x.iv)({label:"hover-container-widget",transition:"all .1s linear",display:"flex",position:"absolute",zIndex:1,right:0,boxSizing:"content-box",alignItems:"center",background:le.colors.background.secondary,color:le.colors.text.primary,border:`1px solid ${le.colors.border.weak}`,borderRadius:le.shape.radius.default,height:le.spacing(4),boxShadow:le.shadows.z1}),square:(0,x.iv)({display:"flex",justifyContent:"center",alignItems:"center",width:le.spacing(4),height:"100%"}),draggable:(0,x.iv)({cursor:"move",[le.breakpoints.down("md")]:{display:"none"}}),menuButton:(0,x.iv)({background:"inherit",border:"none","&:hover":{background:le.colors.secondary.main}}),untitled:(0,x.iv)({color:le.colors.text.disabled,fontStyle:"italic",padding:le.spacing(0,1),marginBottom:0}),draggableIcon:(0,x.iv)({transform:"rotate(45deg)",color:le.colors.text.secondary,"&:hover":{color:le.colors.text.primary}})}}try{u.displayName="HoverWidget",u.__docgenInfo={description:"",displayName:"HoverWidget",props:{menu:{defaultValue:null,description:"",name:"menu",required:!1,type:{name:"ReactElement<any, string | JSXElementConstructor<any>> | (() => ReactElement<any, string | JSXElementConstructor<any>>)"}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"string"}},offset:{defaultValue:{value:"-32"},description:"",name:"offset",required:!1,type:{name:"number"}},dragClass:{defaultValue:null,description:"",name:"dragClass",required:!1,type:{name:"string"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/HoverWidget.tsx#HoverWidget"]={docgenInfo:u.__docgenInfo,name:"HoverWidget",path:"src/components/PanelChrome/HoverWidget.tsx#HoverWidget"})}catch(le){}var S=e("./src/themes/mixins.ts"),k=e("./src/components/Button/Button.tsx"),D=Object.defineProperty,M=Object.defineProperties,I=Object.getOwnPropertyDescriptors,T=Object.getOwnPropertySymbols,j=Object.prototype.hasOwnProperty,K=Object.prototype.propertyIsEnumerable,F=(le,ye,Se)=>ye in le?D(le,ye,{enumerable:!0,configurable:!0,writable:!0,value:Se}):le[ye]=Se,$=(le,ye)=>{for(var Se in ye||(ye={}))j.call(ye,Se)&&F(le,Se,ye[Se]);if(T)for(var Se of T(ye))K.call(ye,Se)&&F(le,Se,ye[Se]);return le},R=(le,ye)=>M(le,I(ye)),U=(le,ye)=>{var Se={};for(var Be in le)j.call(le,Be)&&ye.indexOf(Be)<0&&(Se[Be]=le[Be]);if(le!=null&&T)for(var Be of T(le))ye.indexOf(Be)<0&&K.call(le,Be)&&(Se[Be]=le[Be]);return Se};const H=(0,a.forwardRef)((le,ye)=>{var Se=le,{className:Be,children:Xe,href:st,onClick:mt,target:rt,title:lt}=Se,ft=U(Se,["className","children","href","onClick","target","title"]);const St=(0,d.wW)(W);return st?a.createElement("a",$({ref:ye,href:st,onClick:mt,target:rt,title:lt,className:(0,x.cx)(St.linkItem,Be)},ft),Xe):mt?a.createElement(k.zx,{ref:ye,className:(0,x.cx)(St.item,Be),variant:"secondary",fill:"text",onClick:mt},Xe):a.createElement("span",$({ref:ye,className:(0,x.cx)(St.item,Be)},ft),Xe)});H.displayName="TitleItem";const W=le=>{const ye=(0,x.iv)({color:`${le.colors.text.secondary}`,label:"panel-header-item",cursor:"auto",border:"none",borderRadius:`${le.shape.borderRadius()}`,padding:`${le.spacing(0,1)}`,height:`${le.spacing(le.components.panel.headerHeight)}`,display:"flex",alignItems:"center",justifyContent:"center","&:focus, &:focus-visible":R($({},(0,S.SV)(le)),{zIndex:1}),"&: focus:not(:focus-visible)":(0,S.Cq)(le),"&:hover ":{boxShadow:`${le.shadows.z1}`,background:`${le.colors.background.secondary}`,color:`${le.colors.text.primary}`}});return{item:ye,linkItem:(0,x.cx)(ye,(0,x.iv)({cursor:"pointer"}))}};try{H.displayName="TitleItem",H.__docgenInfo={description:"",displayName:"TitleItem",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((e: any, origin?: any) => void)"}},href:{defaultValue:null,description:"",name:"href",required:!1,type:{name:"string"}},target:{defaultValue:null,description:"",name:"target",required:!1,type:{name:"enum",value:[{value:'"_blank"'},{value:'"_self"'}]}},title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/TitleItem.tsx#TitleItem"]={docgenInfo:H.__docgenInfo,name:"TitleItem",path:"src/components/PanelChrome/TitleItem.tsx#TitleItem"})}catch(le){}function oe({description:le,className:ye}){const Se=(0,d.wW)(Q),Be=()=>{const Xe=typeof le=="function"?le():le;return a.createElement("div",{className:"panel-info-content markdown-html"},a.createElement("div",{dangerouslySetInnerHTML:{__html:Xe}}))};return le!==""?a.createElement(w.u,{interactive:!0,content:Be},a.createElement(H,{className:(0,x.cx)(ye,Se.description)},a.createElement(m.J,{name:"info-circle",size:"md"}))):null}const Q=le=>({description:(0,x.iv)({code:{whiteSpace:"normal",wordWrap:"break-word"},"pre > code":{display:"block"}})});try{oe.displayName="PanelDescription",oe.__docgenInfo={description:"",displayName:"PanelDescription",props:{description:{defaultValue:null,description:"",name:"description",required:!0,type:{name:"string | (() => string)"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/PanelDescription.tsx#PanelDescription"]={docgenInfo:oe.__docgenInfo,name:"PanelDescription",path:"src/components/PanelChrome/PanelDescription.tsx#PanelDescription"})}catch(le){}function P({message:le,onClick:ye,ariaLabel:Se="status"}){const Be=(0,d.wW)(ae);return a.createElement(o.h,{className:Be.buttonStyles,onClick:ye,variant:"destructive",icon:"exclamation-triangle",iconSize:"md",tooltip:le||"","aria-label":Se})}const ae=le=>{const{headerHeight:ye,padding:Se}=le.components.panel;return{buttonStyles:(0,x.iv)({label:"panel-header-state-button",display:"flex",alignItems:"center",justifyContent:"center",padding:le.spacing(Se),width:le.spacing(ye),height:le.spacing(ye),borderRadius:le.shape.radius.default})}};try{P.displayName="PanelStatus",P.__docgenInfo={description:"",displayName:"PanelStatus",props:{message:{defaultValue:null,description:"",name:"message",required:!1,type:{name:"string"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((e: SyntheticEvent<Element, Event>) => void)"}},ariaLabel:{defaultValue:{value:"status"},description:"",name:"ariaLabel",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/PanelStatus.tsx#PanelStatus"]={docgenInfo:P.__docgenInfo,name:"PanelStatus",path:"src/components/PanelChrome/PanelStatus.tsx#PanelStatus"})}catch(le){}function q({width:le,height:ye,children:Se,padding:Be="md",title:Xe="",description:st="",displayMode:mt="default",titleItems:rt,menu:lt,dragClass:ft,dragClassCancel:St,hoverHeader:gt=!1,hoverHeaderOffset:pt,loadingState:ut,statusMessage:Ot,statusMessageOnClick:Wt,leftItems:Ht,actions:on,onCancelQuery:un,onOpenMenu:mn}){const wn=(0,d.l4)(),Gt=(0,d.wW)(je),hn=!gt,fn="show-on-hover",Hn=ve(wn,hn),{contentStyle:va,innerWidth:ia,innerHeight:ba}=re(Be,wn,le,Hn,ye),ta={height:Hn,cursor:ft?"move":"auto"},na={width:le,height:ye};mt==="transparent"&&(na.backgroundColor="transparent",na.border="none"),Ht&&(on=Ht);const la=Xe?b.wl.components.Panels.Panel.title(Xe):"Panel",$e=a.createElement(a.Fragment,null,Xe&&a.createElement("h6",{title:Xe,className:Gt.title},Xe),a.createElement("div",{className:(0,x.cx)(Gt.titleItems,St),"data-testid":"title-items-container"},a.createElement(oe,{description:st,className:St}),rt),ut===f.Gu.Streaming&&a.createElement(w.u,{content:un?"Stop streaming":"Streaming"},a.createElement(H,{className:St,"data-testid":"panel-streaming",onClick:un},a.createElement(m.J,{name:"circle-mono",size:"md",className:Gt.streaming}))),ut===f.Gu.Loading&&un&&a.createElement(y,{delay:2e3},a.createElement(w.u,{content:"Cancel query"},a.createElement(H,{className:(0,x.cx)(St,Gt.pointer),"data-testid":"panel-cancel-query",onClick:un},a.createElement(m.J,{name:"sync-slash",size:"md"})))),a.createElement("div",{className:Gt.rightAligned},on&&a.createElement("div",{className:Gt.rightActions},Y(on,He=>He))));return a.createElement("div",{className:Gt.container,style:na,"data-testid":la},a.createElement("div",{className:Gt.loadingBarContainer},ut===f.Gu.Loading?a.createElement(h.F,{width:le,ariaLabel:"Panel loading bar"}):null),gt&&a.createElement(a.Fragment,null,a.createElement(u,{menu:lt,title:Xe,offset:pt,dragClass:ft,onOpenMenu:mn},$e),Ot&&a.createElement("div",{className:Gt.errorContainerFloating},a.createElement(P,{message:Ot,onClick:Wt,ariaLabel:"Panel status"}))),hn&&a.createElement("div",{className:(0,x.cx)(Gt.headerContainer,ft),style:ta,"data-testid":"header-container"},Ot&&a.createElement("div",{className:St},a.createElement(P,{message:Ot,onClick:Wt,ariaLabel:"Panel status"})),$e,lt&&a.createElement(r,{menu:lt,title:Xe,placement:"bottom-end",menuButtonClass:(0,x.cx)(Gt.menuItem,St,fn),onOpenMenu:mn})),a.createElement("div",{className:Gt.content,style:va},Se(ia,ba)))}const Y=(le,ye)=>{const Se=a.Children.toArray(le).filter(Boolean);return Se.length>0?ye(Se):null},ve=(le,ye)=>ye?le.spacing.gridSize*le.components.panel.headerHeight:0,re=(le,ye,Se,Be,Xe)=>{const st=(le==="md"?ye.components.panel.padding:0)*ye.spacing.gridSize,mt=st*2,rt=1*2,lt=Se-mt-rt,ft=Xe-Be-mt-rt;return{contentStyle:{padding:st},innerWidth:lt,innerHeight:ft}},je=le=>{const{background:ye,borderColor:Se,padding:Be}=le.components.panel;return{container:(0,x.iv)({label:"panel-container",backgroundColor:ye,border:`1px solid ${Se}`,position:"relative",borderRadius:le.shape.borderRadius(1),height:"100%",display:"flex",flexDirection:"column",flex:"1 1 0",".show-on-hover":{visibility:"hidden",opacity:"0"},"&:focus-visible, &:hover":{".show-on-hover":{visibility:"visible",opacity:"1"}},"&:focus-visible":{outline:`1px solid ${le.colors.action.focus}`},"&:focus-within":{".show-on-hover":{visibility:"visible",opacity:"1"}}}),loadingBarContainer:(0,x.iv)({label:"panel-loading-bar-container",position:"absolute",top:0,width:"100%",overflow:"hidden"}),content:(0,x.iv)({label:"panel-content",flexGrow:1,contain:"strict"}),headerContainer:(0,x.iv)({label:"panel-header",display:"flex",alignItems:"center"}),pointer:(0,x.iv)({cursor:"pointer"}),streaming:(0,x.iv)({label:"panel-streaming",marginRight:0,color:le.colors.success.text,"&:hover":{color:le.colors.success.text}}),title:(0,x.iv)({label:"panel-title",marginBottom:0,padding:le.spacing(0,Be),textOverflow:"ellipsis",overflow:"hidden",whiteSpace:"nowrap",fontSize:le.typography.h6.fontSize,fontWeight:le.typography.h6.fontWeight}),items:(0,x.iv)({display:"flex"}),item:(0,x.iv)({display:"flex",justifyContent:"center",alignItems:"center"}),hiddenMenu:(0,x.iv)({visibility:"hidden"}),menuItem:(0,x.iv)({label:"panel-menu",border:"none",background:le.colors.secondary.main,"&:hover":{background:le.colors.secondary.shade}}),errorContainerFloating:(0,x.iv)({label:"error-container",position:"absolute",left:0,top:0,zIndex:le.zIndex.tooltip}),rightActions:(0,x.iv)({display:"flex",padding:le.spacing(0,Be),gap:le.spacing(1)}),rightAligned:(0,x.iv)({label:"right-aligned-container",marginLeft:"auto",display:"flex",alignItems:"center"}),titleItems:(0,x.iv)({display:"flex",height:"100%"})}};try{q.displayName="PanelChrome",q.__docgenInfo={description:"",displayName:"PanelChrome",props:{width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},padding:{defaultValue:{value:"md"},description:"",name:"padding",required:!1,type:{name:"enum",value:[{value:'"md"'},{value:'"none"'}]}},hoverHeaderOffset:{defaultValue:null,description:"",name:"hoverHeaderOffset",required:!1,type:{name:"number"}},title:{defaultValue:{value:""},description:"",name:"title",required:!1,type:{name:"string"}},description:{defaultValue:{value:""},description:"",name:"description",required:!1,type:{name:"string | (() => string)"}},titleItems:{defaultValue:null,description:"",name:"titleItems",required:!1,type:{name:"ReactNode"}},menu:{defaultValue:null,description:"",name:"menu",required:!1,type:{name:"ReactElement<any, string | JSXElementConstructor<any>> | (() => ReactElement<any, string | JSXElementConstructor<any>>)"}},dragClass:{defaultValue:null,description:"",name:"dragClass",required:!1,type:{name:"string"}},dragClassCancel:{defaultValue:null,description:"",name:"dragClassCancel",required:!1,type:{name:"string"}},hoverHeader:{defaultValue:{value:"false"},description:"",name:"hoverHeader",required:!1,type:{name:"boolean"}},loadingState:{defaultValue:null,description:`Use only to indicate loading or streaming data in the panel.
Any other values of loadingState are ignored.`,name:"loadingState",required:!1,type:{name:"enum",value:[{value:'"NotStarted"'},{value:'"Loading"'},{value:'"Streaming"'},{value:'"Done"'},{value:'"Error"'}]}},statusMessage:{defaultValue:null,description:"Used to display status message (used for panel errors currently)",name:"statusMessage",required:!1,type:{name:"string"}},statusMessageOnClick:{defaultValue:null,description:"Handle opening error details view (like inspect / error tab)",name:"statusMessageOnClick",required:!1,type:{name:"((e: SyntheticEvent<Element, Event>) => void)"}},leftItems:{defaultValue:null,description:"@deprecated use `actions' instead",name:"leftItems",required:!1,type:{name:"ReactNode[]"}},actions:{defaultValue:null,description:"",name:"actions",required:!1,type:{name:"ReactNode"}},displayMode:{defaultValue:{value:"default"},description:"",name:"displayMode",required:!1,type:{name:"enum",value:[{value:'"default"'},{value:'"transparent"'}]}},onCancelQuery:{defaultValue:null,description:"",name:"onCancelQuery",required:!1,type:{name:"(() => void)"}},onOpenMenu:{defaultValue:null,description:"callback when opening the panel menu",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/PanelChrome.tsx#PanelChrome"]={docgenInfo:q.__docgenInfo,name:"PanelChrome",path:"src/components/PanelChrome/PanelChrome.tsx#PanelChrome"})}catch(le){}const me=q;me.LoadingIndicator=g,me.ErrorIndicator=_,me.TitleItem=H;var ne=e("./src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx"),Z=e("./src/utils/storybook/DashboardStoryCanvas.tsx"),te=e("./src/utils/storybook/withCenteredStory.tsx"),Pe=e("./src/components/Layout/Layout.tsx"),he=e("./src/components/Menu/Menu.tsx"),ie=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),Ce=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),Le=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function we(le){const ye=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code",div:"div",h4:"h4"},(0,Ce.ah)(),le.components);return q||qe("PanelChrome",!1),q.LoadingIndicator||qe("PanelChrome.LoadingIndicator",!0),(0,ie.jsxs)(ie.Fragment,{children:[(0,ie.jsx)(Le.h_,{title:"MDX|PanelChrome",component:q}),`
`,(0,ie.jsx)(ye.h1,{children:"PanelChrome"}),`
`,(0,ie.jsx)(ye.p,{children:"Component used for rendering content wrapped in the same style as grafana panels"}),`
`,(0,ie.jsx)(ye.h3,{children:"Basic Usage: Title, Description and Content"}),`
`,(0,ie.jsx)(ye.pre,{children:(0,ie.jsx)(ye.code,{className:"language-tsx",children:`<PanelChrome
  title="My awesome panel title"
  description="Here I will put a description that explains a bit more this panel"
  width={400}
  height={200}
>
  {(innerwidth, innerheight) => {
    return (
      <div
        style={{
          width: innerwidth,
          height: innerheight,
          background: 'white',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        New panel with old API
      </div>
    );
  }}
</PanelChrome>
`})}),`
`,(0,ie.jsx)(Le.Xz,{children:(0,ie.jsx)(q,{title:"My awesome panel title",description:"Here I will put a description that explains a bit more this panel",width:400,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" Content"})})}),`
`,(0,ie.jsx)(ye.h3,{children:"Menu: Standard & Hover"}),`
`,(0,ie.jsx)(ye.pre,{children:(0,ie.jsx)(ye.code,{className:"language-tsx",children:`<PanelChrome
  title="My awesome panel title"
  hoverHeader={<true || false>}
  menu={() => (
    <Menu>
      <Menu.Item label="View" icon="eye" />
      <Menu.Item label="Edit" icon="edit" />
      <Menu.Item label="Share" icon="share-alt" />
      <Menu.Divider />
      <Menu.Item label="Remove" icon="trash-alt" />
    </Menu>
  )}
  description="Here I will put a description that explains a bit more this panel"
  width={400}
  height={200}
>
  {(innerwidth, innerheight) => {
    return (
      <div
        style={{
          width: innerwidth,
          height: innerheight,
          background: 'white',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        New panel with old API
      </div>
    );
  }}
</PanelChrome>
`})}),`
`,(0,ie.jsx)(Le.Xz,{children:(0,ie.jsxs)(Pe.Lh,{spacing:"md",align:"flex-start",wrap:!0,children:[(0,ie.jsx)(q,{title:"My awesome panel title",menu:()=>(0,ie.jsxs)(he.v,{children:[(0,ie.jsx)(he.v.Item,{label:"View",icon:"eye"}),(0,ie.jsx)(he.v.Item,{label:"Edit",icon:"edit"}),(0,ie.jsx)(he.v.Item,{label:"Share",icon:"share-alt"}),(0,ie.jsx)(he.v.Divider,{}),(0,ie.jsx)(he.v.Item,{label:"Remove",icon:"trash-alt"})]}),description:"Here I will put a description that explains a bit more this panel",width:400,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" Content with fixed header"})}),(0,ie.jsx)(q,{title:"My awesome panel title",menu:()=>(0,ie.jsxs)(he.v,{children:[(0,ie.jsx)(he.v.Item,{label:"View",icon:"eye"}),(0,ie.jsx)(he.v.Item,{label:"Edit",icon:"edit"}),(0,ie.jsx)(he.v.Item,{label:"Share",icon:"share-alt"}),(0,ie.jsx)(he.v.Divider,{}),(0,ie.jsx)(he.v.Item,{label:"Remove",icon:"trash-alt"})]}),hoverHeader:!0,description:"Here I will put a description that explains a bit more this panel",width:400,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" Content with hoverHeader=true"})})]})}),`
`,(0,ie.jsx)(ye.h3,{children:"States: Loading , Streaming, Error"}),`
`,(0,ie.jsx)(ye.pre,{children:(0,ie.jsx)(ye.code,{className:"language-tsx",children:`<PanelChrome
  title="My awesome panel title"
  loadingState={<Loading.Loading || Loading.Streaming>}
  statusMessage='Error text'
  statusMessageOnClick={action('ErrorIndicator: onClick fired')}
  width={400}
  height={200}
>
  {(innerwidth, innerheight) => {
    return (
      <div
        style={{
          width: innerwidth,
          height: innerheight,
          background: 'rgba(230,0,0,0.05)',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        New panel with old API
      </div>
    );
  }}
</PanelChrome>
`})}),`
`,(0,ie.jsx)(Le.Xz,{children:(0,ie.jsxs)(Pe.Lh,{spacing:"md",align:"flex-start",wrap:!0,children:[(0,ie.jsx)(q,{title:"My awesome panel title",loadingState:f.Gu.Loading,width:400,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" Data is loading"})}),(0,ie.jsx)(q,{title:"My awesome panel title",loadingState:f.Gu.Streaming,width:400,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" Data is Streaming"})}),(0,ie.jsx)(q,{title:"My awesome panel title",statusMessage:"Error text",statusMessageOnClick:(0,t.action)("ErrorIndicator: onClick fired"),width:400,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" There is an error"})})]})}),`
`,(0,ie.jsx)(ye.h3,{children:"Extra options? Title items and actions"}),`
`,(0,ie.jsx)(ye.pre,{children:(0,ie.jsx)(ye.code,{className:"language-tsx",children:`<PanelChrome
  title="My awesome panel title"
  titleItems={
    <div>
      <Button fill="text" icon="github" variant="secondary" tooltip="extra content to render" />
      <Button fill="text" icon="sliders-v-alt" variant="secondary" tooltip="extra content2 to render" />
    </div>
  }
  actions={
    <Button size="sm" variant="secondary" key="A">
      Breakdown
    </Button>
  }
  width={500}
  height={200}
>
  {(innerwidth, innerheight) => {
    return (
      <div
        style={{
          width: innerwidth,
          height: innerheight,
          background: 'rgba(230,0,0,0.05)',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        New panel with old API
      </div>
    );
  }}
</PanelChrome>
`})}),`
`,(0,ie.jsx)(Le.Xz,{children:(0,ie.jsx)(q,{title:"My awesome panel title",titleItems:(0,ie.jsxs)(ye.div,{children:[(0,ie.jsx)(k.zx,{fill:"text",icon:"github",variant:"secondary",tooltip:"extra content to render"}),(0,ie.jsx)(k.zx,{fill:"text",icon:"sliders-v-alt",variant:"secondary",tooltip:"extra content2 to render"})]}),actions:(0,ie.jsx)(k.zx,{size:"sm",variant:"secondary",children:" Breakdown"},"A"),width:500,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" Content"})})}),`
`,(0,ie.jsx)(ye.h3,{children:"Migration from old PanelChrome (before v9.4.0)"}),`
`,(0,ie.jsx)(ye.h4,{children:"Before"}),`
`,(0,ie.jsx)(ye.pre,{children:(0,ie.jsx)(ye.code,{className:"language-tsx",children:`<PanelChrome
  title="My awesome panel title"
  leftItems={[<PanelChrome.LoadingIndicator loading={isRefreshing} onCancel={onCancelQuery} key="loading-indicator" />]}
  width={400}
  height={200}
>
  {(innerwidth, innerheight) => {
    return (
      <div
        style={{
          width: innerwidth,
          height: innerheight,
          background: 'white',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        New panel with old API
      </div>
    );
  }}
</PanelChrome>
`})}),`
`,(0,ie.jsx)(Le.Xz,{children:(0,ie.jsx)(q,{title:"My awesome panel title",leftItems:[(0,ie.jsx)(q.LoadingIndicator,{loading:!0,onCancel:(0,t.action)("CancelQuery: onClick fired")},"loading-indicator")],width:400,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" Content"})})}),`
`,(0,ie.jsx)(ye.h4,{children:"After"}),`
`,(0,ie.jsx)(ye.pre,{children:(0,ie.jsx)(ye.code,{className:"language-tsx",children:`<PanelChrome
  title="My awesome panel title"
  loadingState={LoadingState.Loading}
  onCancelQuery={onCancelQuery}
  width={400}
  height={200}
>
  {(innerwidth, innerheight) => {
    return (
      <div
        style={{
          width: innerwidth,
          height: innerheight,
          background: 'white',
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'center',
        }}
      >
        New panel with old API
      </div>
    );
  }}
</PanelChrome>
`})}),`
`,(0,ie.jsx)(Le.Xz,{children:(0,ie.jsx)(q,{title:"My awesome panel title",loadingState:f.Gu.Loading,onCancelQuery:(0,t.action)("CancelQuery: onClick fired"),width:400,height:200,children:(Se,Be)=>(0,ie.jsx)(ye.div,{style:{width:Se,height:Be,background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"},children:" Content"})})})]})}function ue(le={}){const{wrapper:ye}=Object.assign({},(0,Ce.ah)(),le.components);return ye?(0,ie.jsx)(ye,Object.assign({},le,{children:(0,ie.jsx)(we,le)})):we(le)}var Ie=ue;function qe(le,ye){throw new Error("Expected "+(ye?"component":"object")+" `"+le+"` to be defined: you likely forgot to import, pass, or provide it.")}var Je=Object.defineProperty,Ze=Object.getOwnPropertySymbols,Oe=Object.prototype.hasOwnProperty,ce=Object.prototype.propertyIsEnumerable,pe=(le,ye,Se)=>ye in le?Je(le,ye,{enumerable:!0,configurable:!0,writable:!0,value:Se}):le[ye]=Se,J=(le,ye)=>{for(var Se in ye||(ye={}))Oe.call(ye,Se)&&pe(le,Se,ye[Se]);if(Ze)for(var Se of Ze(ye))ce.call(ye,Se)&&pe(le,Se,ye[Se]);return le},L=null,fe={Examples:{startLoc:{col:24,line:91},endLoc:{col:1,line:240},startBody:{col:24,line:91},endBody:{col:1,line:240}},ExamplesHoverHeader:{startLoc:{col:35,line:242},endLoc:{col:1,line:301},startBody:{col:35,line:242},endBody:{col:1,line:301}},Basic:{startLoc:{col:57,line:303},endLoc:{col:1,line:313},startBody:{col:57,line:303},endBody:{col:1,line:313}}};const xe={title:"Visualizations/PanelChrome",component:me,decorators:[te.BU],parameters:{controls:{exclude:["children"]},docs:{page:Ie}}};function We(){return{background:"rgba(230,0,0,0.05)",display:"flex",alignItems:"center",justifyContent:"center"}}function Ue(le,ye){const Se={width:400,height:150,children:()=>{}};(0,n.merge)(Se,ye);const Be=We();return a.createElement(me,J({},Se),(Xe,st)=>a.createElement("div",{style:J({width:Xe,height:st},Be)},le))}const at=a.createElement(he.v,null,a.createElement(he.v.Item,{label:"View",icon:"eye"}),a.createElement(he.v.Item,{label:"Edit",icon:"edit"}),a.createElement(he.v.Item,{label:"Share",icon:"share-alt"}),a.createElement(he.v.Item,{label:"Explore",icon:"compass"}),a.createElement(he.v.Item,{label:"Inspect",icon:"info-circle",childItems:[a.createElement(he.v.Item,{key:"subitem1",label:"Data"}),a.createElement(he.v.Item,{key:"subitem2",label:"Query"}),a.createElement(he.v.Item,{key:"subitem3",label:"Panel JSON"})]}),a.createElement(he.v.Item,{label:"More",icon:"cube",childItems:[a.createElement(he.v.Item,{key:"subitem1",label:"Duplicate"}),a.createElement(he.v.Item,{key:"subitem2",label:"Copy"}),a.createElement(he.v.Item,{key:"subitem3",label:"Create library panel"}),a.createElement(he.v.Item,{key:"subitem4",label:"Hide legend"}),a.createElement(he.v.Item,{key:"subitem5",label:"Get help"})]}),a.createElement(he.v.Divider,null),a.createElement(he.v.Item,{label:"Remove",icon:"trash-alt"})),it=()=>{const[le,ye]=(0,a.useState)(!0);return(0,l.Z)(()=>ye(!0),5e3),a.createElement(Z.C,null,a.createElement("div",null,a.createElement(Pe.Lh,{spacing:"md",align:"flex-start",wrap:!0},Ue("Has statusMessage",{title:"Default title",statusMessage:"Error text",statusMessageOnClick:(0,t.action)("ErrorIndicator: onClick fired")}),Ue("No padding, has statusMessage",{padding:"none",title:"Default title",statusMessage:"Error text",statusMessageOnClick:(0,t.action)("ErrorIndicator: onClick fired")}),Ue("No title, loadingState is Error, no statusMessage",{loadingState:f.Gu.Error}),Ue("loadingState is Streaming",{title:"Default title",loadingState:f.Gu.Streaming}),Ue("loadingState is Loading",{title:"Default title",loadingState:f.Gu.Loading}),Ue("Default panel: no non-required props"),Ue("No padding",{padding:"none"}),Ue("Very long title",{title:"Very long title that should get ellipsis when there is no more space"}),Ue("No title, streaming loadingState",{loadingState:f.Gu.Streaming}),Ue("Error status, menu",{title:"Default title",menu:at,statusMessage:"Error text",statusMessageOnClick:(0,t.action)("ErrorIndicator: onClick fired")}),Ue("No padding; has statusMessage, menu",{padding:"none",title:"Default title",menu:at,statusMessage:"Error text",statusMessageOnClick:(0,t.action)("ErrorIndicator: onClick fired")}),Ue("No title, loadingState is Error, no statusMessage, menu",{menu:at,loadingState:f.Gu.Error}),Ue("loadingState is Streaming, menu",{title:"Default title",menu:at,loadingState:f.Gu.Streaming}),Ue("loadingState is Loading, menu",{title:"Default title",menu:at,loadingState:f.Gu.Loading}),Ue("Deprecated error indicator",{title:"Default title",leftItems:[a.createElement(me.ErrorIndicator,{key:"errorIndicator",error:"Error text",onClick:(0,t.action)("ErrorIndicator: onClick fired")})]}),Ue("No padding, deprecated loading indicator",{padding:"none",title:"Default title",leftItems:[a.createElement(me.LoadingIndicator,{loading:le,onCancel:()=>ye(!1),key:"loading-indicator"})]}),Ue("Display mode = transparent",{title:"Default title",displayMode:"transparent",menu:at}),Ue("Actions with button no menu",{title:"Actions with button no menu",actions:a.createElement(k.zx,{size:"sm",variant:"secondary",key:"A"},"Breakdown")}),Ue("Panel with two actions",{title:"I have two buttons",actions:[a.createElement(k.zx,{size:"sm",variant:"secondary",key:"A"},"Breakdown"),a.createElement(k.zx,{size:"sm",variant:"secondary",icon:"times",key:"B"})]}),Ue("With radio button",{title:"I have a radio button",actions:[a.createElement(ne.S,{key:"radio-button-group",size:"sm",value:"A",options:[{label:"Graph",value:"A"},{label:"Table",value:"B"}]})]}),Ue("Panel with action link",{title:"Panel with action link",actions:a.createElement("a",{className:"external-link",href:"/some/page"},"Error details",a.createElement(m.J,{name:"arrow-right"}))}),Ue("Action and menu (should be rare)",{title:"Action and menu",menu:at,actions:a.createElement(k.zx,{size:"sm",variant:"secondary"},"Breakdown")}))))},_t=()=>a.createElement(Z.C,null,a.createElement("div",null,a.createElement(Pe.Lh,{spacing:"md",align:"flex-start",wrap:!0},Ue("Title items, menu, hover header",{title:"Default title",description:"This is a description",menu:at,hoverHeader:!0,dragClass:"draggable",titleItems:a.createElement(me.TitleItem,{title:"Online"},a.createElement(m.J,{name:"heart"}))}),Ue("Multiple title items",{title:"Default title",menu:at,hoverHeader:!0,dragClass:"draggable",titleItems:[a.createElement(me.TitleItem,{title:"Online",key:"A"},a.createElement(m.J,{name:"heart"})),a.createElement(me.TitleItem,{title:"Link",key:"B",onClick:()=>{}},a.createElement(m.J,{name:"external-link-alt"}))]}),Ue("Hover header, loading loadingState",{loadingState:f.Gu.Loading,hoverHeader:!0,title:"I am a hover header",dragClass:"draggable"}),Ue("No title, Hover header",{hoverHeader:!0,dragClass:"draggable"}),Ue("Should not have drag icon",{title:"No drag icon",hoverHeader:!0}),Ue("With action link",{title:"With link in hover header",hoverHeader:!0,actions:a.createElement("a",{className:"external-link",href:"/some/page"},"Error details",a.createElement(m.J,{name:"arrow-right"}))})))),wt=le=>{const ye=We();return a.createElement(me,J({},le),(Se,Be)=>a.createElement("div",{style:J({height:Be,width:Se},ye)},"Panel in a loading state"))},ee=[],_e=[a.createElement(me.LoadingIndicator,{key:"loadingIndicator",loading:!0,onCancel:(0,t.action)("LoadingIndicator: onCancel fired")})],ge=[a.createElement(me.ErrorIndicator,{key:"errorIndicator",error:"Error text",onClick:(0,t.action)("ErrorIndicator: onClick fired")})],de={LoadingIcon:_e,ErrorIcon:ge,Default:ee},Ee="Description text with very long descriptive words that describe what is going on in the panel and not beyond. Or maybe beyond, not up to us.";wt.argTypes={description:{control:{type:"text"}},leftItems:{options:Object.keys(de),mapping:de,control:{type:"select",labels:{LoadingIcon:"With loading icon",ErrorIcon:"With error icon",Default:"Default (no elements)"}}}},wt.args={width:400,height:200,title:"Very long title that should get ellipsis when there is no more space",description:Ee,menu:at};var ze=xe;it.parameters=J({storySource:{source:`() => {
  const [loading, setLoading] = useState(true);

  useInterval(() => setLoading(true), 5000);

  return (
    <DashboardStoryCanvas>
      <div>
        <HorizontalGroup spacing="md" align="flex-start" wrap>
          {renderPanel('Has statusMessage', {
            title: 'Default title',
            statusMessage: 'Error text',
            statusMessageOnClick: action('ErrorIndicator: onClick fired'),
          })}
          {renderPanel('No padding, has statusMessage', {
            padding: 'none',
            title: 'Default title',
            statusMessage: 'Error text',
            statusMessageOnClick: action('ErrorIndicator: onClick fired'),
          })}
          {renderPanel('No title, loadingState is Error, no statusMessage', {
            loadingState: LoadingState.Error,
          })}
          {renderPanel('loadingState is Streaming', {
            title: 'Default title',
            loadingState: LoadingState.Streaming,
          })}

          {renderPanel('loadingState is Loading', {
            title: 'Default title',
            loadingState: LoadingState.Loading,
          })}

          {renderPanel('Default panel: no non-required props')}
          {renderPanel('No padding', {
            padding: 'none',
          })}
          {renderPanel('Very long title', {
            title: 'Very long title that should get ellipsis when there is no more space',
          })}
          {renderPanel('No title, streaming loadingState', {
            loadingState: LoadingState.Streaming,
          })}
          {renderPanel('Error status, menu', {
            title: 'Default title',
            menu,
            statusMessage: 'Error text',
            statusMessageOnClick: action('ErrorIndicator: onClick fired'),
          })}
          {renderPanel('No padding; has statusMessage, menu', {
            padding: 'none',
            title: 'Default title',
            menu,
            statusMessage: 'Error text',
            statusMessageOnClick: action('ErrorIndicator: onClick fired'),
          })}
          {renderPanel('No title, loadingState is Error, no statusMessage, menu', {
            menu,
            loadingState: LoadingState.Error,
          })}
          {renderPanel('loadingState is Streaming, menu', {
            title: 'Default title',
            menu,
            loadingState: LoadingState.Streaming,
          })}
          {renderPanel('loadingState is Loading, menu', {
            title: 'Default title',
            menu,
            loadingState: LoadingState.Loading,
          })}
          {renderPanel('Deprecated error indicator', {
            title: 'Default title',
            leftItems: [
              <PanelChrome.ErrorIndicator
                key="errorIndicator"
                error="Error text"
                onClick={action('ErrorIndicator: onClick fired')}
              />,
            ],
          })}
          {renderPanel('No padding, deprecated loading indicator', {
            padding: 'none',
            title: 'Default title',
            leftItems: [
              <PanelChrome.LoadingIndicator
                loading={loading}
                onCancel={() => setLoading(false)}
                key="loading-indicator"
              />,
            ],
          })}
          {renderPanel('Display mode = transparent', {
            title: 'Default title',
            displayMode: 'transparent',
            menu,
          })}
          {renderPanel('Actions with button no menu', {
            title: 'Actions with button no menu',
            actions: (
              <Button size="sm" variant="secondary" key="A">
                Breakdown
              </Button>
            ),
          })}
          {renderPanel('Panel with two actions', {
            title: 'I have two buttons',
            actions: [
              <Button size="sm" variant="secondary" key="A">
                Breakdown
              </Button>,
              <Button size="sm" variant="secondary" icon="times" key="B" />,
            ],
          })}
          {renderPanel('With radio button', {
            title: 'I have a radio button',
            actions: [
              <RadioButtonGroup
                key="radio-button-group"
                size="sm"
                value="A"
                options={[
                  { label: 'Graph', value: 'A' },
                  { label: 'Table', value: 'B' },
                ]}
              />,
            ],
          })}
          {renderPanel('Panel with action link', {
            title: 'Panel with action link',
            actions: (
              <a className="external-link" href="/some/page">
                Error details
                <Icon name="arrow-right" />
              </a>
            ),
          })}
          {renderPanel('Action and menu (should be rare)', {
            title: 'Action and menu',
            menu,
            actions: (
              <Button size="sm" variant="secondary">
                Breakdown
              </Button>
            ),
          })}
        </HorizontalGroup>
      </div>
    </DashboardStoryCanvas>
  );
}`}},it.parameters),_t.parameters=J({storySource:{source:`() => {
  return (
    <DashboardStoryCanvas>
      <div>
        <HorizontalGroup spacing="md" align="flex-start" wrap>
          {renderPanel('Title items, menu, hover header', {
            title: 'Default title',
            description: 'This is a description',
            menu,
            hoverHeader: true,
            dragClass: 'draggable',
            titleItems: (
              <PanelChrome.TitleItem title="Online">
                <Icon name="heart" />
              </PanelChrome.TitleItem>
            ),
          })}
          {renderPanel('Multiple title items', {
            title: 'Default title',
            menu,
            hoverHeader: true,
            dragClass: 'draggable',
            titleItems: [
              <PanelChrome.TitleItem title="Online" key="A">
                <Icon name="heart" />
              </PanelChrome.TitleItem>,
              <PanelChrome.TitleItem title="Link" key="B" onClick={() => {}}>
                <Icon name="external-link-alt" />
              </PanelChrome.TitleItem>,
            ],
          })}
          {renderPanel('Hover header, loading loadingState', {
            loadingState: LoadingState.Loading,
            hoverHeader: true,
            title: 'I am a hover header',
            dragClass: 'draggable',
          })}
          {renderPanel('No title, Hover header', {
            hoverHeader: true,
            dragClass: 'draggable',
          })}
          {renderPanel('Should not have drag icon', {
            title: 'No drag icon',
            hoverHeader: true,
          })}
          {renderPanel('With action link', {
            title: 'With link in hover header',
            hoverHeader: true,
            actions: (
              <a className="external-link" href="/some/page">
                Error details
                <Icon name="arrow-right" />
              </a>
            ),
          })}
        </HorizontalGroup>
      </div>
    </DashboardStoryCanvas>
  );
}`}},_t.parameters),wt.parameters=J({storySource:{source:`(args: PanelChromeProps) => {
  const contentStyle = getContentStyle();

  return (
    <PanelChrome {...args}>
      {(width: number, height: number) => (
        <div style={{ height, width, ...contentStyle }}>Panel in a loading state</div>
      )}
    </PanelChrome>
  );
}`}},wt.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelChrome/PanelChrome.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/PanelChrome/PanelChrome.story.tsx#ComponentMeta"})}catch(le){}},"./src/components/PanelContainer/PanelContainer.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return M},default:function(){return I}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),l=e("./src/themes/ThemeContext.tsx"),f=Object.defineProperty,x=Object.getOwnPropertySymbols,d=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable,c=(T,j,K)=>j in T?f(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,E=(T,j)=>{for(var K in j||(j={}))d.call(j,K)&&c(T,K,j[K]);if(x)for(var K of x(j))i.call(j,K)&&c(T,K,j[K]);return T},O=(T,j)=>{var K={};for(var F in T)d.call(T,F)&&j.indexOf(F)<0&&(K[F]=T[F]);if(T!=null&&x)for(var F of x(T))j.indexOf(F)<0&&i.call(T,F)&&(K[F]=T[F]);return K};const m=T=>{var j=T,{children:K,className:F}=j,$=O(j,["children","className"]);const R=(0,l.wW)(w);return t.createElement("div",E({className:(0,a.cx)(R,F)},$),K)},w=T=>a.iv`
    background-color: ${T.components.panel.background};
    border: 1px solid ${T.components.panel.borderColor};
    border-radius: ${T.shape.radius.default};
  `;try{m.displayName="PanelContainer",m.__docgenInfo={description:"",displayName:"PanelContainer",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelContainer/PanelContainer.tsx#PanelContainer"]={docgenInfo:m.__docgenInfo,name:"PanelContainer",path:"src/components/PanelContainer/PanelContainer.tsx#PanelContainer"})}catch(T){}var _=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),C=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),b=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function g(T){const j=Object.assign({h1:"h1",p:"p"},(0,C.ah)(),T.components);return(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(b.h_,{title:"MDX|PanelContainer",component:m}),`
`,(0,_.jsx)(j.h1,{children:"PanelContainer"}),`
`,(0,_.jsx)(j.p,{children:"The PanelContainer is used as a simple background for storing other components."})]})}function v(T={}){const{wrapper:j}=Object.assign({},(0,C.ah)(),T.components);return j?(0,_.jsx)(j,Object.assign({},T,{children:(0,_.jsx)(g,T)})):g(T)}var y=v,h=Object.defineProperty,s=Object.getOwnPropertySymbols,o=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable,u=(T,j,K)=>j in T?h(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,p=(T,j)=>{for(var K in j||(j={}))o.call(j,K)&&u(T,K,j[K]);if(s)for(var K of s(j))r.call(j,K)&&u(T,K,j[K]);return T},S=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { PanelContainer } from './PanelContainer';
import mdx from './PanelContainer.mdx';

const meta: ComponentMeta<typeof PanelContainer> = {
  title: 'General/PanelContainer',
  component: PanelContainer,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

export const Basic: ComponentStory<typeof PanelContainer> = () => {
  return (
    <PanelContainer>
      <h1>Here could be your component</h1>
    </PanelContainer>
  );
};

export default meta;
`,k={Basic:{startLoc:{col:60,line:20},endLoc:{col:1,line:26},startBody:{col:60,line:20},endBody:{col:1,line:26}}};const D={title:"General/PanelContainer",component:m,decorators:[n.BU],parameters:{docs:{page:y}}},M=()=>t.createElement(m,null,t.createElement("h1",null,"Here could be your component"));var I=D;M.parameters=p({storySource:{source:`() => {
  return (
    <PanelContainer>
      <h1>Here could be your component</h1>
    </PanelContainer>
  );
}`}},M.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PanelContainer/PanelContainer.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/PanelContainer/PanelContainer.story.tsx#ComponentMeta"})}catch(T){}},"./src/components/PluginSignatureBadge/PluginSignatureBadge.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return M},default:function(){return I}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/plugin.ts"),a=e("./src/components/Badge/Badge.tsx"),l=Object.defineProperty,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(T,j,K)=>j in T?l(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,c=(T,j)=>{for(var K in j||(j={}))x.call(j,K)&&i(T,K,j[K]);if(f)for(var K of f(j))d.call(j,K)&&i(T,K,j[K]);return T},E=(T,j)=>{var K={};for(var F in T)x.call(T,F)&&j.indexOf(F)<0&&(K[F]=T[F]);if(T!=null&&f)for(var F of f(T))j.indexOf(F)<0&&d.call(T,F)&&(K[F]=T[F]);return K};const O=T=>{var j=T,{status:K}=j,F=E(j,["status"]);const $=m(K);return t.createElement(a.C,c({text:$.text,color:$.color,icon:$.icon,tooltip:$.tooltip},F))};O.displayName="PluginSignatureBadge";function m(T){switch(T||(T=n.Xy.invalid),T){case n.Xy.internal:return{text:"Core",color:"blue",tooltip:"Core plugin that is bundled with Grafana"};case n.Xy.valid:return{text:"Signed",icon:"lock",color:"green",tooltip:"Signed and verified plugin"};case n.Xy.invalid:return{text:"Invalid signature",icon:"exclamation-triangle",color:"red",tooltip:"Invalid plugin signature"};case n.Xy.modified:return{text:"Modified signature",icon:"exclamation-triangle",color:"red",tooltip:"Valid signature but content has been modified"};case n.Xy.missing:return{text:"Missing signature",icon:"exclamation-triangle",color:"red",tooltip:"Missing plugin signature"};default:return{text:"Unsigned",icon:"exclamation-triangle",color:"red",tooltip:"Unsigned external plugin"}}}try{O.displayName="PluginSignatureBadge",O.__docgenInfo={description:"",displayName:"PluginSignatureBadge",props:{status:{defaultValue:null,description:"",name:"status",required:!1,type:{name:"enum",value:[{value:'"internal"'},{value:'"valid"'},{value:'"invalid"'},{value:'"modified"'},{value:'"missing"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PluginSignatureBadge/PluginSignatureBadge.tsx#PluginSignatureBadge"]={docgenInfo:O.__docgenInfo,name:"PluginSignatureBadge",path:"src/components/PluginSignatureBadge/PluginSignatureBadge.tsx#PluginSignatureBadge"})}catch(T){}var w=e("./src/utils/storybook/withCenteredStory.tsx"),_=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),C=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),b=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function g(T){const j=Object.assign({h1:"h1",p:"p",h2:"h2"},(0,C.ah)(),T.components);return(0,_.jsxs)(_.Fragment,{children:[(0,_.jsx)(b.h_,{title:"MDX|PluginSignatureBadge",component:O}),`
`,(0,_.jsx)(j.h1,{children:"Plugin Signature Badge"}),`
`,(0,_.jsx)(j.p,{children:`The Plugin Signature Badge can be found in each information plugin card of the configuration plugins panel (Grafana menu > Configuration > Plugins).
This is a security measure to make sure plugins haven't been tampered with. Upon loading, Grafana checks to see the plugin signature status.`}),`
`,(0,_.jsx)(j.h2,{children:"Badges:"}),`
`,(0,_.jsx)(j.p,{children:"1.- Core: this badge indicates that the plugin has been built into Grafana."}),`
`,(0,_.jsx)(b.MB,{children:(0,_.jsx)(O,{status:"internal"})}),`
`,(0,_.jsx)(j.p,{children:"2.- Signed: the plugin's signature was successfully verified."}),`
`,(0,_.jsx)(b.MB,{children:(0,_.jsx)(O,{status:"valid"})}),`
`,(0,_.jsx)(j.p,{children:"3.- Invalid signature: this plugin has a invalid signature."}),`
`,(0,_.jsx)(b.MB,{children:(0,_.jsx)(O,{status:"invalid"})}),`
`,(0,_.jsx)(j.p,{children:"4.- Modified signature: this plugin has changed since it was signed. This may indicate malicious intent."}),`
`,(0,_.jsx)(b.MB,{children:(0,_.jsx)(O,{status:"modified"})}),`
`,(0,_.jsx)(j.p,{children:"5.- Unsigned: the plugin is not signed. In this case, as upon loading Grafana checks the plugins signature, Grafana will not load or start it. Furthermore, it will write an error message to the server log."}),`
`,(0,_.jsx)(b.MB,{children:(0,_.jsx)(O,{status:"unsigned"})}),`
`,(0,_.jsx)(b.xP,{of:O})]})}function v(T={}){const{wrapper:j}=Object.assign({},(0,C.ah)(),T.components);return j?(0,_.jsx)(j,Object.assign({},T,{children:(0,_.jsx)(g,T)})):g(T)}var y=v,h=Object.defineProperty,s=Object.getOwnPropertySymbols,o=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable,u=(T,j,K)=>j in T?h(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,p=(T,j)=>{for(var K in j||(j={}))o.call(j,K)&&u(T,K,j[K]);if(s)for(var K of s(j))r.call(j,K)&&u(T,K,j[K]);return T},S=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { PluginSignatureStatus } from '@grafana/data';
import { PluginSignatureBadge } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './PluginSignatureBadge.mdx';

const meta: ComponentMeta<typeof PluginSignatureBadge> = {
  title: 'Data Display/PluginSignatureBadge',
  decorators: [withCenteredStory],
  component: PluginSignatureBadge,
  argTypes: {
    status: {
      control: {
        type: 'select',
      },
      options: [
        PluginSignatureStatus.missing,
        PluginSignatureStatus.invalid,
        PluginSignatureStatus.modified,
        PluginSignatureStatus.valid,
        PluginSignatureStatus.internal,
      ],
    },
  },
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

export const Basic: ComponentStory<typeof PluginSignatureBadge> = (args) => {
  return <PluginSignatureBadge status={args.status} />;
};
Basic.args = {
  status: PluginSignatureStatus.valid,
};

export default meta;
`,k={Basic:{startLoc:{col:66,line:36},endLoc:{col:1,line:38},startBody:{col:66,line:36},endBody:{col:1,line:38}}};const D={title:"Data Display/PluginSignatureBadge",decorators:[w.BU],component:O,argTypes:{status:{control:{type:"select"},options:[n.Xy.missing,n.Xy.invalid,n.Xy.modified,n.Xy.valid,n.Xy.internal]}},parameters:{docs:{page:y}}},M=T=>t.createElement(O,{status:T.status});M.args={status:n.Xy.valid};var I=D;M.parameters=p({storySource:{source:`(args) => {
  return <PluginSignatureBadge status={args.status} />;
}`}},M.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/PluginSignatureBadge/PluginSignatureBadge.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/PluginSignatureBadge/PluginSignatureBadge.story.tsx#ComponentMeta"})}catch(T){}},"./src/components/QueryField/QueryField.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return na},default:function(){return la}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),l=e("../../../yarn/cache/classnames-npm-2.3.2-d2fdae468d-2c62199789.zip/node_modules/classnames/index.js"),f=e.n(l),x=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),d=e("../../.yarn/__virtual__/slate-plain-serializer-virtual-53ea7f149a/2/yarn/cache/slate-plain-serializer-npm-0.7.13-18e29a2d32-835a8c2a09.zip/node_modules/slate-plain-serializer/lib/slate-plain-serializer.es.js"),i=e("../../.yarn/__virtual__/slate-react-virtual-60ac50304b/2/yarn/cache/slate-react-npm-0.22.10-eca32f2ffc-1ecddaf0f6.zip/node_modules/slate-react/lib/slate-react.es.js"),c=e("../grafana-e2e-selectors/src/selectors/index.ts"),E=e("../../.yarn/__virtual__/slate-virtual-7ce6150b2f/2/yarn/cache/slate-npm-0.47.9-61a6086a90-a128d1eaa4.zip/node_modules/slate/lib/slate.es.js");const O={document:{nodes:[{match:[{type:"paragraph"},{type:"code_block"},{type:"code_line"}]}]},inlines:{}},m=($e,He)=>{const Ye=$e.split(`
`).map(bt=>E.gO.create({type:"code_line",nodes:[E.xv.create(bt)]})),yt=E.gO.create({data:{syntax:He},type:"code_block",nodes:Ye});return E.BB.create({nodes:[yt]})},w=($e,He)=>{const Ye=m($e,He);return E.B4.create({document:Ye})};var _=e("../../.yarn/__virtual__/react-dom-virtual-48394057d2/2/yarn/cache/react-dom-npm-17.0.2-f551215af1-1c1eaa3bca.zip/node_modules/react-dom/index.js"),C=e("../../.yarn/__virtual__/react-window-virtual-9886da65d9/2/yarn/cache/react-window-npm-1.8.8-1f85a45c48-a19f43b901.zip/node_modules/react-window/dist/index.esm.js"),b=e("./src/themes/ThemeContext.tsx"),g=($e=>($e.GroupTitle="GroupTitle",$e))(g||{}),v=e("../../../yarn/cache/calculate-size-npm-1.1.1-466c9f6cd7-8f1bfad7a9.zip/node_modules/calculate-size/lib/index.js");const y=$e=>$e.reduce((He,{items:Ye,label:yt})=>(He.push({label:yt,kind:g.GroupTitle}),Ye.reduce((bt,It)=>(bt.push(It),bt),He)),[]),h=$e=>$e.reduce((He,Ye)=>He.length<Ye.label.length?Ye.label:He,""),s=($e,He,Ye)=>{const yt=(0,v.Z)(Ye,{font:$e.typography.fontFamilyMonospace,fontSize:$e.typography.bodySmall.fontSize,fontWeight:"normal"}),bt=r(yt.width,$e),It=o(yt.height,$e),Lt=u(It,He);return{listWidth:bt,listHeight:Lt,itemHeight:It}},o=($e,He)=>{const Ye=He.spacing.gridSize*2;return $e+Ye},r=($e,He)=>{const Ye=He.spacing.gridSize*3,yt=800;return Math.min(Math.max($e+Ye,200),yt)},u=($e,He)=>{const Ye=Math.min(He.length,10),yt=100,bt=Ye*$e;return Math.max(bt,yt)};var p=e("../../../yarn/cache/marked-npm-4.2.12-59aaa5afdc-bd551cd610.zip/node_modules/marked/lib/marked.esm.js"),S=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/sanitize.ts"),k=Object.defineProperty,D=Object.defineProperties,M=Object.getOwnPropertyDescriptors,I=Object.getOwnPropertySymbols,T=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable,K=($e,He,Ye)=>He in $e?k($e,He,{enumerable:!0,configurable:!0,writable:!0,value:Ye}):$e[He]=Ye,F=($e,He)=>{for(var Ye in He||(He={}))T.call(He,Ye)&&K($e,Ye,He[Ye]);if(I)for(var Ye of I(He))j.call(He,Ye)&&K($e,Ye,He[Ye]);return $e},$=($e,He)=>D($e,M(He));let R=!1;const U={pedantic:!1,gfm:!0,smartLists:!0,smartypants:!1,xhtml:!1,breaks:!1};function H($e,He){R||(p.TU.setOptions(F({},U)),R=!0);let Ye;He!=null&&He.breaks&&(Ye=$(F({},U),{breaks:!0}));const yt=(0,p.TU)($e||"",Ye);return He!=null&&He.noSanitize?yt:(0,S.he)(yt)}function W($e,He){R||(marked.setOptions(F({},U)),R=!0);const Ye=marked($e||"");return He!=null&&He.noSanitize?Ye:sanitizeTextPanelContent(Ye)}const oe=($e,He,Ye)=>({typeaheadItem:a.iv`
      label: type-ahead-item;
      z-index: 11;
      padding: ${$e.spacing(1,1,1,2)};
      border: ${$e.colors.border.medium};
      overflow-y: scroll;
      overflow-x: hidden;
      outline: none;
      background: ${$e.colors.background.secondary};
      color: ${$e.colors.text};
      box-shadow: 0 0 20px ${$e.v1.colors.dropdownShadow};
      visibility: ${Ye===!0?"visible":"hidden"};
      width: 250px;
      min-height: ${He+parseInt($e.spacing(.25),10)}px;
      position: relative;
      word-break: break-word;
    `}),Q=({item:$e,height:He})=>{const Ye=$e&&!!$e.documentation,yt=$e?$e.label:"",bt=H($e==null?void 0:$e.documentation),It=(0,b.l4)(),Lt=oe(It,He,Ye);return t.createElement("div",{className:(0,a.cx)([Lt.typeaheadItem])},t.createElement("b",null,yt),t.createElement("hr",null),t.createElement("div",{dangerouslySetInnerHTML:{__html:bt}}))};try{Q.displayName="TypeaheadInfo",Q.__docgenInfo={description:"",displayName:"TypeaheadInfo",props:{item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"CompletionItem"}},height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Typeahead/TypeaheadInfo.tsx#TypeaheadInfo"]={docgenInfo:Q.__docgenInfo,name:"TypeaheadInfo",path:"src/components/Typeahead/TypeaheadInfo.tsx#TypeaheadInfo"})}catch($e){}var P=e("../../.yarn/__virtual__/react-highlight-words-virtual-894e62e9bf/2/yarn/cache/react-highlight-words-npm-0.20.0-02e799bf4d-6794b6fe40.zip/node_modules/react-highlight-words/dist/main.js"),ae=e.n(P);function q($e,He){const Ye=[];return $e.forEach(yt=>{Ye.push(yt.start,yt.end+1)}),Ye[0]!==0&&Ye.unshift(0),Ye[Ye.length-1]!==He&&Ye.push(He),Ye}const Y=$e=>{let{highlightParts:He,text:Ye,highlightClassName:yt}=$e;if(!(He!=null&&He.length))return null;let bt=[],It=q(He,Ye.length),Lt=He[0].start===0;for(let zt=1;zt<It.length;zt++){let Vt=It[zt-1],Ut=It[zt];bt.push((0,t.createElement)(Lt?"mark":"span",{key:zt-1,className:Lt?yt:void 0},Ye.substring(Vt,Ut))),Lt=!Lt}return t.createElement("div",null,bt)};try{Y.displayName="PartialHighlighter",Y.__docgenInfo={description:"",displayName:"PartialHighlighter",props:{text:{defaultValue:null,description:"",name:"text",required:!0,type:{name:"string"}},highlightParts:{defaultValue:null,description:"",name:"highlightParts",required:!0,type:{name:"HighlightPart[]"}},highlightClassName:{defaultValue:null,description:"",name:"highlightClassName",required:!0,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Typeahead/PartialHighlighter.tsx#PartialHighlighter"]={docgenInfo:Y.__docgenInfo,name:"PartialHighlighter",path:"src/components/Typeahead/PartialHighlighter.tsx#PartialHighlighter"})}catch($e){}const ve=$e=>({typeaheadItem:a.iv`
    border: none;
    background: none;
    text-align: left;
    label: type-ahead-item;
    height: auto;
    font-family: ${$e.typography.fontFamilyMonospace};
    padding: ${$e.spacing(1,1,1,2)};
    font-size: ${$e.typography.bodySmall.fontSize};
    text-overflow: ellipsis;
    overflow: hidden;
    z-index: 11;
    display: block;
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
      background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
  `,typeaheadItemSelected:a.iv`
    label: type-ahead-item-selected;
    background-color: ${$e.colors.background.secondary};
  `,typeaheadItemMatch:a.iv`
    label: type-ahead-item-match;
    color: ${$e.v1.palette.yellow};
    border-bottom: 1px solid ${$e.v1.palette.yellow};
    padding: inherit;
    background: inherit;
  `,typeaheadItemGroupTitle:a.iv`
    label: type-ahead-item-group-title;
    color: ${$e.colors.text.secondary};
    font-size: ${$e.typography.bodySmall.fontSize};
    line-height: ${$e.typography.body.lineHeight};
    padding: ${$e.spacing(1)};
  `}),re=$e=>{const He=(0,b.wW)(ve),{isSelected:Ye,item:yt,prefix:bt,style:It,onMouseEnter:Lt,onMouseLeave:zt,onClickItem:Vt}=$e,Ut=Ye?(0,a.cx)([He.typeaheadItem,He.typeaheadItemSelected]):(0,a.cx)([He.typeaheadItem]),Kt=(0,a.cx)([He.typeaheadItemMatch]),xn=(0,a.cx)([He.typeaheadItemGroupTitle]),rn=yt.label||"";return yt.kind===g.GroupTitle?t.createElement("li",{className:xn,style:It},t.createElement("span",null,rn)):t.createElement("li",{role:"none"},t.createElement("button",{role:"menuitem",className:Ut,style:It,onMouseDown:Vt,onMouseEnter:Lt,onMouseLeave:zt,type:"button"},yt.highlightParts!==void 0?t.createElement(Y,{text:rn,highlightClassName:Kt,highlightParts:yt.highlightParts}):t.createElement(ae(),{textToHighlight:rn,searchWords:[bt!=null?bt:""],autoEscape:!0,highlightClassName:Kt})))};try{re.displayName="TypeaheadItem",re.__docgenInfo={description:"",displayName:"TypeaheadItem",props:{isSelected:{defaultValue:null,description:"",name:"isSelected",required:!0,type:{name:"boolean"}},item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"CompletionItem"}},style:{defaultValue:null,description:"",name:"style",required:!0,type:{name:"CSSProperties"}},prefix:{defaultValue:null,description:"",name:"prefix",required:!1,type:{name:"string"}},onClickItem:{defaultValue:null,description:"",name:"onClickItem",required:!1,type:{name:"((event: MouseEvent<Element, MouseEvent>) => void)"}},onMouseEnter:{defaultValue:null,description:"",name:"onMouseEnter",required:!1,type:{name:"(() => void)"}},onMouseLeave:{defaultValue:null,description:"",name:"onMouseLeave",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Typeahead/TypeaheadItem.tsx#TypeaheadItem"]={docgenInfo:re.__docgenInfo,name:"TypeaheadItem",path:"src/components/Typeahead/TypeaheadItem.tsx#TypeaheadItem"})}catch($e){}const je=($e,He)=>$e-He*Math.floor($e/He);class me extends t.PureComponent{constructor(){super(...arguments),this.listRef=(0,t.createRef)(),this.state={hoveredItem:null,typeaheadIndex:null,allItems:[],listWidth:-1,listHeight:-1,itemHeight:-1},this.componentDidMount=()=>{this.props.menuRef&&this.props.menuRef(this),document.addEventListener("selectionchange",this.handleSelectionChange);const He=y(this.props.groupedItems),Ye=h(He),{listWidth:yt,listHeight:bt,itemHeight:It}=s(this.context,He,Ye);this.setState({listWidth:yt,listHeight:bt,itemHeight:It,allItems:He})},this.componentWillUnmount=()=>{document.removeEventListener("selectionchange",this.handleSelectionChange)},this.handleSelectionChange=()=>{this.forceUpdate()},this.componentDidUpdate=(He,Ye)=>{if(this.state.typeaheadIndex!==null&&Ye.typeaheadIndex!==this.state.typeaheadIndex&&this.listRef&&this.listRef.current){if(this.state.typeaheadIndex===1){this.listRef.current.scrollToItem(0);return}this.listRef.current.scrollToItem(this.state.typeaheadIndex)}if((0,x.isEqual)(He.groupedItems,this.props.groupedItems)===!1){const yt=y(this.props.groupedItems),bt=h(yt),{listWidth:It,listHeight:Lt,itemHeight:zt}=s(this.context,yt,bt);this.setState({listWidth:It,listHeight:Lt,itemHeight:zt,allItems:yt,typeaheadIndex:null})}},this.onMouseEnter=He=>{this.setState({hoveredItem:He})},this.onMouseLeave=()=>{this.setState({hoveredItem:null})},this.moveMenuIndex=He=>{const Ye=this.state.allItems.length;if(Ye){const yt=this.state.typeaheadIndex||0;let bt=je(yt+He,Ye);this.state.allItems[bt].kind===g.GroupTitle&&(bt=je(bt+He,Ye)),this.setState({typeaheadIndex:bt});return}},this.insertSuggestion=()=>{this.props.onSelectSuggestion&&this.state.typeaheadIndex!==null&&this.props.onSelectSuggestion(this.state.allItems[this.state.typeaheadIndex])}}get menuPosition(){if(!window.getSelection)return"";const He=window.getSelection(),Ye=He&&He.anchorNode;if(Ye&&Ye.parentElement){const yt=Ye.parentElement.getBoundingClientRect(),bt=window.scrollX,It=window.scrollY;return`position: absolute; display: flex; top: ${yt.top+It+yt.height+6}px; left: ${yt.left+bt-2}px`}return""}render(){const{prefix:He,isOpen:Ye=!1,origin:yt}=this.props,{allItems:bt,listWidth:It,listHeight:Lt,itemHeight:zt,hoveredItem:Vt,typeaheadIndex:Ut}=this.state,Kt=Vt||Ut,xn=bt[Vt||Ut||0];return t.createElement(ne,{origin:yt,isOpen:Ye,style:this.menuPosition},t.createElement("ul",{role:"menu",className:"typeahead","data-testid":"typeahead"},t.createElement(C.t7,{ref:this.listRef,itemCount:bt.length,itemSize:zt,itemKey:rn=>{const Bn=bt&&bt[rn];return Bn?`${rn}-${Bn.label}`:`${rn}`},width:It,height:Lt},({index:rn,style:Bn})=>{const _n=bt&&bt[rn];return _n?t.createElement(re,{onClickItem:()=>this.props.onSelectSuggestion?this.props.onSelectSuggestion(_n):{},isSelected:Ut===null?!1:bt[Ut]===_n,item:_n,prefix:He,style:Bn,onMouseEnter:()=>this.onMouseEnter(rn),onMouseLeave:this.onMouseLeave}):null})),Kt&&t.createElement(Q,{height:Lt,item:xn}))}}me.contextType=b.Ni;class ne extends t.PureComponent{constructor(He){super(He);const{index:Ye=0,origin:yt="query",style:bt}=He;this.node=document.createElement("div"),this.node.setAttribute("style",bt),this.node.classList.add("slate-typeahead",`slate-typeahead-${yt}-${Ye}`),document.body.appendChild(this.node)}componentWillUnmount(){document.body.removeChild(this.node)}render(){return this.props.isOpen?(this.node.setAttribute("style",this.props.style),this.node.classList.add("slate-typeahead--open"),_.createPortal(this.props.children,this.node)):(this.node.classList.remove("slate-typeahead--open"),null)}}try{me.displayName="Typeahead",me.__docgenInfo={description:"",displayName:"Typeahead",props:{origin:{defaultValue:null,description:"",name:"origin",required:!0,type:{name:"string"}},groupedItems:{defaultValue:null,description:"",name:"groupedItems",required:!0,type:{name:"CompletionItemGroup[]"}},prefix:{defaultValue:null,description:"",name:"prefix",required:!1,type:{name:"string"}},menuRef:{defaultValue:null,description:"",name:"menuRef",required:!1,type:{name:"((el: Typeahead) => void)"}},onSelectSuggestion:{defaultValue:null,description:"",name:"onSelectSuggestion",required:!1,type:{name:"((suggestion: CompletionItem) => void)"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Typeahead/Typeahead.tsx#Typeahead"]={docgenInfo:me.__docgenInfo,name:"Typeahead",path:"src/components/Typeahead/Typeahead.tsx#Typeahead"})}catch($e){}function Z($e,He){let Ye=0,yt=$e.indexOf(He);He=He.replace(/\s/g,"");const bt=[];if(yt!==-1)return{distance:0,found:!0,ranges:[{start:yt,end:yt+He.length-1}]};for(const It of He){const Lt=$e.indexOf(It,yt);if(Lt===-1)return{distance:1/0,ranges:[],found:!1};if(yt!==-1&&(Ye+=Lt-yt),yt=Lt+1,bt.length===0)bt.push({start:Lt,end:Lt});else{const zt=(0,x.last)(bt);Lt===zt.end+1?zt.end++:bt.push({start:Lt,end:Lt})}}return{distance:Ye,ranges:bt,found:!0}}var te=($e=>($e.Word="Word",$e.Prefix="Prefix",$e.Fuzzy="Fuzzy",$e))(te||{});const Ce={Word:($e,He)=>$e.filter(Ye=>(Ye.filterText||Ye.label).includes(He)),Prefix:($e,He)=>$e.filter(Ye=>(Ye.filterText||Ye.label).startsWith(He)),Fuzzy:($e,He)=>(He=He.toLowerCase(),$e.filter(Ye=>{const{distance:yt,ranges:bt,found:It}=Z(Ye.label.toLowerCase(),He);return It?(Ye.sortValue=yt,Ye.highlightParts=bt,!0):!1}))};var we="prism-token",ue=Object.defineProperty,Ie=Object.defineProperties,qe=Object.getOwnPropertyDescriptors,Je=Object.getOwnPropertySymbols,Ze=Object.prototype.hasOwnProperty,Oe=Object.prototype.propertyIsEnumerable,ce=($e,He,Ye)=>He in $e?ue($e,He,{enumerable:!0,configurable:!0,writable:!0,value:Ye}):$e[He]=Ye,pe=($e,He)=>{for(var Ye in He||(He={}))Ze.call(He,Ye)&&ce($e,Ye,He[Ye]);if(Je)for(var Ye of Je(He))Oe.call(He,Ye)&&ce($e,Ye,He[Ye]);return $e},J=($e,He)=>Ie($e,qe(He)),L=($e,He,Ye)=>new Promise((yt,bt)=>{var It=Vt=>{try{zt(Ye.next(Vt))}catch(Ut){bt(Ut)}},Lt=Vt=>{try{zt(Ye.throw(Vt))}catch(Ut){bt(Ut)}},zt=Vt=>Vt.done?yt(Vt.value):Promise.resolve(Vt.value).then(It,Lt);zt((Ye=Ye.apply($e,He)).next())});const fe=250;function xe({onTypeahead:$e,cleanText:He,onWillApplySuggestion:Ye,portalOrigin:yt}){let bt,It={groupedItems:[],typeaheadPrefix:"",typeaheadContext:"",typeaheadText:""};const Lt=(0,x.debounce)(We,fe),zt=Vt=>{It=pe(pe({},It),Vt)};return{onBlur:(Vt,Ut,Kt)=>(It=J(pe({},It),{groupedItems:[]}),Kt()),onClick:(Vt,Ut,Kt)=>(It=J(pe({},It),{groupedItems:[]}),Kt()),onKeyDown:(Vt,Ut,Kt)=>{const rn=It.groupedItems.length;switch(Vt.key){case"Escape":{if(rn)return Vt.preventDefault(),It=J(pe({},It),{groupedItems:[]}),Ut.insertText("");break}case"ArrowDown":case"ArrowUp":if(rn){Vt.preventDefault(),bt.moveMenuIndex(Vt.key==="ArrowDown"?1:-1);return}break;case"Enter":{if(!(Vt.shiftKey||Vt.ctrlKey)&&rn)return Vt.preventDefault(),bt.insertSuggestion();break}case"Tab":{if(rn)return Vt.preventDefault(),bt.insertSuggestion();break}default:{Vt.key.length===1&&Lt(Ut,zt,$e,He);break}}return Kt()},commands:{selectSuggestion:(Vt,Ut)=>{const Kt=It.groupedItems;if(!Kt||!Kt.length)return Vt;const xn=Vt.applyTypeahead(Ut);return Lt(Vt,zt,$e,He),xn},applyTypeahead:(Vt,Ut)=>{let Kt=Ut.insertText||Ut.label;const xn=Ut.kind==="function",rn=Ut.move||0,Bn=rn>0?rn:0,_n=rn<0?-rn:0,{typeaheadPrefix:Fn,typeaheadText:An,typeaheadContext:Sn}=It;Ye&&(Kt=Ye(Kt,{groupedItems:It.groupedItems,typeaheadContext:Sn,typeaheadPrefix:Fn,typeaheadText:An}));const ua=Ut.deleteBackwards||Fn.length,pa=(He?He(An):An).length-Fn.length,sa=An.indexOf(Fn),gn=Fn&&(pa>0&&sa>-1||Kt===An)&&!xn?pa+sa:0;if(Kt.match(/\n/)){const ma=m(Kt);return Vt.deleteBackward(ua).deleteForward(gn).insertFragment(ma).focus(),Vt}return It=J(pe({},It),{groupedItems:[]}),Vt.snapshotSelection().deleteBackward(ua).deleteForward(gn).insertText(Kt).moveForward(Bn).moveBackward(_n).focus(),Vt}},renderEditor(Vt,Ut,Kt){if(Ut.value.selection.isExpanded)return Kt();const xn=Kt();return t.createElement(t.Fragment,null,xn,t.createElement(me,{menuRef:rn=>bt=rn,origin:yt,prefix:It.typeaheadPrefix,isOpen:!!It.groupedItems.length,groupedItems:It.groupedItems,onSelectSuggestion:Ut.selectSuggestion}))}}}const We=($e,He,Ye,yt)=>L(void 0,null,function*(){if(!Ye)return;const{value:bt}=$e,{selection:It}=bt,Lt=bt.document.getClosestBlock(bt.focusBlock.key),zt=bt.selection.start.offset-1,Vt=Lt&&Lt.getDecorations($e),Ut=Vt?Vt.filter(sn=>sn.start.offset<=zt&&sn.end.offset>zt&&sn.type===we).toArray():[],Kt=Vt&&Vt.filter(sn=>sn.end.offset<=zt&&sn.type===we&&sn.data.get("className").includes("label-key")).last(),xn=Kt&&bt.focusText.text.slice(Kt.start.offset,Kt.end.offset),rn=Ut.map(sn=>sn.data.get("className")).join(" ").split(" ").filter(sn=>sn.length);let Bn=bt.focusText.text,_n=Bn.slice(0,It.focus.offset);Ut.length&&(Bn=bt.focusText.text.slice(Ut[0].start.offset,Ut[0].end.offset),_n=bt.focusText.text.slice(Ut[0].start.offset,It.focus.offset));const Fn=_n.match(/(?:!?=~?"?|")(.*)/);Fn?_n=Fn[1]:yt&&(_n=yt(_n));const{suggestions:An,context:Sn}=yield Ye({prefix:_n,text:Bn,value:bt,wrapperClasses:rn,labelKey:xn||void 0,editor:$e}),ua=An.map(sn=>{if(!sn.items)return sn;const pa=sn.searchFunctionType||(sn.prefixMatch?te.Prefix:te.Word),sa=Ce[pa];let Rn=pe({},sn);return _n&&(sn.skipFilter||(Rn.items=Rn.items.filter(gn=>(gn.filterText||gn.label).length>=_n.length),Rn.items=sa(Rn.items,_n)),Rn.items=Rn.items.filter(gn=>{var ma;return!(gn.insertText===_n||((ma=gn.filterText)!=null?ma:gn.label)===_n)})),sn.skipSort||(Rn.items=(0,x.sortBy)(Rn.items,gn=>gn.sortText===void 0?gn.sortValue!==void 0?gn.sortValue:gn.label:gn.sortText||gn.label)),Rn}).filter(sn=>sn.items&&sn.items.length);He({groupedItems:ua,typeaheadPrefix:_n,typeaheadContext:Sn,typeaheadText:Bn}),$e.blur().focus()});try{xe.displayName="SuggestionsPlugin",xe.__docgenInfo={description:"",displayName:"SuggestionsPlugin",props:{onTypeahead:{defaultValue:null,description:"",name:"onTypeahead",required:!1,type:{name:"((typeahead: TypeaheadInput) => Promise<TypeaheadOutput>)"}},cleanText:{defaultValue:null,description:"",name:"cleanText",required:!1,type:{name:"((text: string) => string)"}},onWillApplySuggestion:{defaultValue:null,description:"",name:"onWillApplySuggestion",required:!1,type:{name:"((suggestion: string, state: SuggestionsState) => string)"}},portalOrigin:{defaultValue:null,description:"",name:"portalOrigin",required:!0,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/slate-plugins/suggestions.tsx#SuggestionsPlugin"]={docgenInfo:xe.__docgenInfo,name:"SuggestionsPlugin",path:"src/slate-plugins/suggestions.tsx#SuggestionsPlugin"})}catch($e){}function Ue({handler:$e}){return{onKeyDown(He,Ye,yt){return $e&&He.key==="Enter"&&(He.shiftKey||He.ctrlKey)?(He.preventDefault(),$e(He),Ye):yt()}}}function at($e){let He=$e.length-$e.trimLeft().length;if(He){let Ye=$e[0];for(;--He;)Ye+=$e[0];return Ye}return""}function it(){return{onKeyDown($e,He,Ye){const yt=He.value;if(yt.selection.isExpanded)return Ye();if($e.key==="Enter"){$e.preventDefault();const{startBlock:bt}=yt,It=bt.text,Lt=at(It);return He.splitBlock().insertText(Lt).focus()}return Ye()}}}function _t(){return{onKeyDown($e,He,Ye){const yt=He.value;if(yt.selection.isExpanded)return Ye();if($e.key==="k"&&$e.ctrlKey){$e.preventDefault();const bt=yt.anchorText.text,It=yt.selection.anchor.offset,zt=bt.length-It;return He.deleteForward(zt),!0}return Ye()}}}var wt=e("../../../yarn/cache/is-hotkey-npm-0.2.0-c11e0b0bdb-97d295cfd8.zip/node_modules/is-hotkey/lib/index.js");const ee=(0,wt.TB)("mod+l");function _e(){return{onKeyDown($e,He,Ye){if(ee($e)){$e.preventDefault();const{focusBlock:yt,document:bt}=He.value;He.moveAnchorToStartOfBlock(),bt.getNextBlock(yt.key)?He.moveFocusToStartOfNextBlock():He.moveFocusToEndOfText()}else return Ye();return!0}}}const ge=(0,wt.TB)("mod+["),de=(0,wt.TB)("shift+tab"),Ee=(0,wt.TB)("mod+]"),ze="  ",le=($e,He,Ye)=>{const{startBlock:yt,endBlock:bt,selection:{start:{offset:It,key:Lt},end:{offset:zt,key:Vt}}}=He.value;if(d.Z.serialize(He.value)==="")return;$e.preventDefault();const Ut=yt.getFirstText();Ut&&It===0&&Lt===Ut.key&&zt===Ut.text.length&&Vt===Ut.key||!yt.equals(bt)?ye(He,"right"):He.insertText(ze)},ye=($e,He)=>{const Ye=$e.value.selection,yt=$e.value.document.getLeafBlocksAtRange(Ye).toArray();if(He==="left")for(const bt of yt){const It=bt.text.length-bt.text.trimLeft().length,Lt=bt.getFirstText().key,zt={anchor:{key:Lt,offset:It,path:[]},focus:{key:Lt,offset:It,path:[]}};$e.deleteBackwardAtRange(E.e6.create(zt),Math.min(ze.length,It))}else{const{startText:bt}=$e.value,It=bt.text.slice(0,Ye.start.offset),Lt=/^\s*$/.test(It);for(const zt of yt)$e.insertTextByKey(zt.getFirstText().key,0,ze);Lt&&$e.moveStartBackward(ze.length)}};function Se(){return{onKeyDown($e,He,Ye){if(ge($e)||de($e))$e.preventDefault(),ye(He,"left");else if(Ee($e))$e.preventDefault(),ye(He,"right");else if($e.key==="Tab")le($e,He,Ye);else return Ye();return!0}}}var Be=Object.defineProperty,Xe=Object.defineProperties,st=Object.getOwnPropertyDescriptors,mt=Object.getOwnPropertySymbols,rt=Object.prototype.hasOwnProperty,lt=Object.prototype.propertyIsEnumerable,ft=($e,He,Ye)=>He in $e?Be($e,He,{enumerable:!0,configurable:!0,writable:!0,value:Ye}):$e[He]=Ye,St=($e,He)=>{for(var Ye in He||(He={}))rt.call(He,Ye)&&ft($e,Ye,He[Ye]);if(mt)for(var Ye of mt(He))lt.call(He,Ye)&&ft($e,Ye,He[Ye]);return $e},gt=($e,He)=>Xe($e,st(He));const pt=($e,He,Ye)=>{if(!$e.length)return;const yt=$e.slice(0,-1).join("").length+$e.length-1;return $e.join(`
`).slice(He,yt+Ye)},ut=$e=>$e==null?void 0:$e.replace(/[\uFEFF]/g,"");function Ot(){const $e={onCopy(He,Ye,yt){He.preventDefault();const{document:bt,selection:It}=Ye.value,{start:{offset:Lt},end:{offset:zt}}=It,Vt=bt.getLeafBlocksAtRange(It).toArray().map(Kt=>Kt.text),Ut=ut(pt(Vt,Lt,zt));return Ut&&He.clipboardData&&He.clipboardData.setData("Text",Ut),!0},onPaste(He,Ye,yt){if(He.preventDefault(),He.clipboardData){const bt=ut(He.clipboardData.getData("Text")),It=bt==null?void 0:bt.split(`
`);if(It&&It.length){Ye.insertText(It[0]);for(const Lt of It.slice(1))Ye.splitBlock().insertText(Lt)}}return!0}};return gt(St({},$e),{onCut(He,Ye,yt){return $e.onCopy(He,Ye,yt),Ye.deleteAtRange(Ye.value.selection),!0}})}var Wt=e("./src/themes/mixins.ts");class Ht extends t.PureComponent{constructor(He,Ye){super(He,Ye),this.lastExecutedValue=null,this.mounted=!1,this.editor=null,this.onChange=(zt,Vt)=>{const Ut=zt.document!==this.state.value.document,Kt=this.state.value;this.props.onRichValueChange&&this.props.onRichValueChange(zt),this.setState({value:zt},()=>{if(Ut){const xn=d.Z.serialize(Kt)!==d.Z.serialize(zt);xn&&Vt&&this.runOnChangeAndRunQuery(),xn&&!Vt&&this.runOnChangeDebounced()}})},this.runOnChange=()=>{const{onChange:zt}=this.props,Vt=d.Z.serialize(this.state.value);zt&&zt(this.cleanText(Vt))},this.runOnRunQuery=()=>{const{onRunQuery:zt}=this.props;zt&&(zt(),this.lastExecutedValue=this.state.value)},this.runOnChangeAndRunQuery=()=>{this.runOnChange(),this.runOnRunQuery()},this.handleBlur=(zt,Vt,Ut)=>{const{onBlur:Kt}=this.props;if(Kt)Kt();else{const xn=this.lastExecutedValue?d.Z.serialize(this.lastExecutedValue):"",rn=d.Z.serialize(Vt.value);xn!==rn&&this.runOnChangeAndRunQuery()}return Ut()},this.runOnChangeDebounced=(0,x.debounce)(this.runOnChange,500);const{onTypeahead:yt,cleanText:bt,portalOrigin:It,onWillApplySuggestion:Lt}=He;this.plugins=[xe({onTypeahead:yt,cleanText:bt,portalOrigin:It,onWillApplySuggestion:Lt}),Ue({handler:this.runOnChangeAndRunQuery}),it(),_t(),_e(),Se(),Ot(),...He.additionalPlugins||[]].filter(zt=>zt),this.state={suggestions:[],typeaheadContext:null,typeaheadPrefix:"",typeaheadText:"",value:w(He.query||"",He.syntax)}}componentDidMount(){this.mounted=!0}componentWillUnmount(){this.mounted=!1}componentDidUpdate(He,Ye){const{query:yt,syntax:bt,syntaxLoaded:It}=this.props;if(!He.syntaxLoaded&&It&&this.editor){const zt=this.editor.insertText(" ").deleteBackward(1);this.onChange(zt.value,!0)}const{value:Lt}=this.state;yt!==He.query&&yt!==d.Z.serialize(Lt)&&this.setState({value:w(yt||"",bt)})}cleanText(He){return He.replace(/[\r]/g,"")}render(){const{disabled:He,theme:Ye}=this.props,yt=f()("slate-query-field__wrapper",{"slate-query-field__wrapper--disabled":He}),bt=un(Ye);return t.createElement("div",{className:(0,a.cx)(yt,bt.wrapper)},t.createElement("div",{className:"slate-query-field","aria-label":c.wl.components.QueryField.container},t.createElement(i.ML,{ref:It=>this.editor=It,schema:O,autoCorrect:!1,readOnly:this.props.disabled,onBlur:this.handleBlur,onClick:this.props.onClick,onChange:It=>{this.onChange(It.value,!1)},placeholder:this.props.placeholder,plugins:this.plugins,spellCheck:!1,value:this.state.value})))}}const on=(0,b.HE)(Ht),un=$e=>{const He=(0,Wt.SV)($e);return{wrapper:a.iv`
      &:focus-within {
        ${He}
      }
    `}};try{Ht.displayName="UnThemedQueryField",Ht.__docgenInfo={description:`Renders an editor field.
Pass initial value as initialQuery and listen to changes in props.onValueChanged.
This component can only process strings. Internally it uses Slate Value.
Implement props.onTypeahead to use suggestions, see PromQueryField.tsx as an example.`,displayName:"UnThemedQueryField",props:{additionalPlugins:{defaultValue:null,description:"",name:"additionalPlugins",required:!1,type:{name:"Plugin<Editor>[]"}},cleanText:{defaultValue:null,description:"",name:"cleanText",required:!1,type:{name:"((text: string) => string)"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},query:{defaultValue:null,description:"",name:"query",required:!1,type:{name:"string | null"}},onRunQuery:{defaultValue:null,description:"",name:"onRunQuery",required:!1,type:{name:"(() => void)"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((value: string) => void)"}},onRichValueChange:{defaultValue:null,description:"",name:"onRichValueChange",required:!1,type:{name:"((value: Value) => void)"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"EventHook<MouseEvent<Element, MouseEvent>>"}},onTypeahead:{defaultValue:null,description:"",name:"onTypeahead",required:!1,type:{name:"((typeahead: TypeaheadInput) => Promise<TypeaheadOutput>)"}},onWillApplySuggestion:{defaultValue:null,description:"",name:"onWillApplySuggestion",required:!1,type:{name:"((suggestion: string, state: SuggestionsState) => string)"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},portalOrigin:{defaultValue:null,description:"",name:"portalOrigin",required:!0,type:{name:"string"}},syntax:{defaultValue:null,description:"",name:"syntax",required:!1,type:{name:"string"}},syntaxLoaded:{defaultValue:null,description:"",name:"syntaxLoaded",required:!1,type:{name:"boolean"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/QueryField/QueryField.tsx#UnThemedQueryField"]={docgenInfo:Ht.__docgenInfo,name:"UnThemedQueryField",path:"src/components/QueryField/QueryField.tsx#UnThemedQueryField"})}catch($e){}try{on.displayName="QueryField",on.__docgenInfo={description:"",displayName:"QueryField",props:{placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((value: string) => void)"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"EventHook<MouseEvent<Element, MouseEvent>>"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},additionalPlugins:{defaultValue:null,description:"",name:"additionalPlugins",required:!1,type:{name:"Plugin<Editor>[]"}},cleanText:{defaultValue:null,description:"",name:"cleanText",required:!1,type:{name:"((text: string) => string)"}},query:{defaultValue:null,description:"",name:"query",required:!1,type:{name:"string | null"}},onRunQuery:{defaultValue:null,description:"",name:"onRunQuery",required:!1,type:{name:"(() => void)"}},onRichValueChange:{defaultValue:null,description:"",name:"onRichValueChange",required:!1,type:{name:"((value: Value) => void)"}},onTypeahead:{defaultValue:null,description:"",name:"onTypeahead",required:!1,type:{name:"((typeahead: TypeaheadInput) => Promise<TypeaheadOutput>)"}},onWillApplySuggestion:{defaultValue:null,description:"",name:"onWillApplySuggestion",required:!1,type:{name:"((suggestion: string, state: SuggestionsState) => string)"}},portalOrigin:{defaultValue:null,description:"",name:"portalOrigin",required:!0,type:{name:"string"}},syntax:{defaultValue:null,description:"",name:"syntax",required:!1,type:{name:"string"}},syntaxLoaded:{defaultValue:null,description:"",name:"syntaxLoaded",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/QueryField/QueryField.tsx#QueryField"]={docgenInfo:on.__docgenInfo,name:"QueryField",path:"src/components/QueryField/QueryField.tsx#QueryField"})}catch($e){}var mn=Object.defineProperty,wn=Object.getOwnPropertySymbols,Gt=Object.prototype.hasOwnProperty,hn=Object.prototype.propertyIsEnumerable,fn=($e,He,Ye)=>He in $e?mn($e,He,{enumerable:!0,configurable:!0,writable:!0,value:Ye}):$e[He]=Ye,Hn=($e,He)=>{for(var Ye in He||(He={}))Gt.call(He,Ye)&&fn($e,Ye,He[Ye]);if(wn)for(var Ye of wn(He))hn.call(He,Ye)&&fn($e,Ye,He[Ye]);return $e},va=($e,He,Ye)=>new Promise((yt,bt)=>{var It=Vt=>{try{zt(Ye.next(Vt))}catch(Ut){bt(Ut)}},Lt=Vt=>{try{zt(Ye.throw(Vt))}catch(Ut){bt(Ut)}},zt=Vt=>Vt.done?yt(Vt.value):Promise.resolve(Vt.value).then(It,Lt);zt((Ye=Ye.apply($e,He)).next())}),ia=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { TypeaheadInput } from '../../types';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { QueryField, QueryFieldProps } from './QueryField';

const meta: ComponentMeta<typeof QueryField> = {
  title: 'Data Source/QueryField',
  component: QueryField,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: [
        'onTypeahead',
        'onChange',
        'onBlur',
        'onClick',
        'onRunQuery',
        'onRichValueChange',
        'onWillApplySuggestion',
        'portalOrigin',
        'additionalPlugins',
        'cleanText',
        'syntax',
        'syntaxLoaded',
      ],
    },
  },
  argTypes: {
    query: {
      control: 'text',
    },
  },
};

export const Basic: ComponentStory<typeof QueryField> = (args: Omit<QueryFieldProps, 'theme'>) => (
  <QueryField {...args} />
);

Basic.args = {
  onTypeahead: async (_input: TypeaheadInput) => ({
    suggestions: [],
  }),
  query: 'Query text',
  placeholder: 'Placeholder text',
  disabled: false,
};

export default meta;
`,ba={Basic:{startLoc:{col:56,line:38},endLoc:{col:1,line:40},startBody:{col:56,line:38},endBody:{col:1,line:40}}};const ta={title:"Data Source/QueryField",component:on,decorators:[n.BU],parameters:{controls:{exclude:["onTypeahead","onChange","onBlur","onClick","onRunQuery","onRichValueChange","onWillApplySuggestion","portalOrigin","additionalPlugins","cleanText","syntax","syntaxLoaded"]}},argTypes:{query:{control:"text"}}},na=$e=>t.createElement(on,Hn({},$e));na.args={onTypeahead:$e=>va(void 0,null,function*(){return{suggestions:[]}}),query:"Query text",placeholder:"Placeholder text",disabled:!1};var la=ta;na.parameters=Hn({storySource:{source:`(args: Omit<QueryFieldProps, 'theme'>) => (
  <QueryField {...args} />
)`}},na.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/QueryField/QueryField.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/QueryField/QueryField.story.tsx#ComponentMeta"})}catch($e){}},"./src/components/RefreshPicker/RefreshPicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Examples:function(){return je},default:function(){return me}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../.yarn/__virtual__/@storybook-addons-virtual-81f58af7f3/2/yarn/cache/@storybook-addons-npm-6.5.16-f82ac7ef6c-0463150e4c.zip/node_modules/@storybook/addons/dist/esm/hooks.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../../yarn/cache/date-fns-npm-2.29.3-fef7e3c72c-e01cf5b62a.zip/node_modules/date-fns/esm/formatDuration/index.js"),f=Object.defineProperty,x=Object.defineProperties,d=Object.getOwnPropertyDescriptors,i=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable,O=(ne,Z,te)=>Z in ne?f(ne,Z,{enumerable:!0,configurable:!0,writable:!0,value:te}):ne[Z]=te,m=(ne,Z)=>{for(var te in Z||(Z={}))c.call(Z,te)&&O(ne,te,Z[te]);if(i)for(var te of i(Z))E.call(Z,te)&&O(ne,te,Z[te]);return ne},w=(ne,Z)=>x(ne,d(Z));const _={years:["y","Y","years"],months:["M","months"],weeks:["w","W","weeks"],days:["d","D","days"],hours:["h","H","hours"],minutes:["m","minutes"],seconds:["s","S","seconds"]};function C(ne,Z=!0){if(isAfter(ne.start,ne.end))return"";const te=intervalToDuration(ne);return Object.entries(te).reduce((Pe,[he,ie])=>ie&&ie!==0&&!(he==="seconds"&&!Z&&Pe)?Pe+`${Pe!==""?" ":""}${ie}${_[he][0]}`:Pe,"")}function b(ne){return ne.split(" ").reduce((Z,te)=>{const Pe=te.match(/(\d+)(.+)/),he=Pe==null?void 0:Pe[1],ie=Pe==null?void 0:Pe[2];if(!(he&&ie))return Z;const Ce=Object.entries(_).find(([we,ue])=>ue==null?void 0:ue.includes(Pe[2])),Le=parseInt(he,10);return Ce?w(m({},Z),{[Ce[0]]:Le}):Z},{})}function g(ne,Z){return add(ne,Z)}function v(ne){const Z=new Date;return g(Z,ne).getTime()-Z.getTime()}function y(ne){return!isNaN(Date.parse(ne))}function h(ne){var Z;for(const te of ne.trim().split(" ")){const Pe=te.match(/(\d+)(.+)/);if(Pe===null||Pe.length!==3||!((Z=Object.entries(_).find(([ie,Ce])=>Ce==null?void 0:Ce.includes(Pe[2])))==null?void 0:Z[0]))return!1}return!0}function s(ne){const Z=["h","m","s","ms","us","\xB5s","ns"];for(const te of ne.trim().split(" ")){const Pe=te.match(/([0-9]*[.]?[0-9]+)(.+)/);if(Pe===null||Pe.length!==3||!Z.includes(Pe[2]))return!1}return!0}var o=e("../grafana-e2e-selectors/src/selectors/index.ts"),r=e("./src/utils/i18n.tsx"),u=e("./src/components/Button/ButtonGroup.tsx"),p=e("./src/components/Dropdown/ButtonSelect.tsx"),S=e("./src/components/ToolbarButton/ToolbarButton.tsx");const k=["5s","10s","30s","1m","5m","15m","30m","1h","2h","1d"],D=class extends a.PureComponent{constructor(ne){super(ne),this.onChangeSelect=Z=>{const{onIntervalChanged:te}=this.props;te&&Z.value!=null&&te(Z.value)}}getVariant(){return this.props.isLive?"primary":this.props.isLoading?"destructive":this.props.primary?"primary":this.props.isOnCanvas?"canvas":"default"}render(){const{onRefresh:ne,intervals:Z,tooltip:te,value:Pe,text:he,isLoading:ie,noIntervalPicker:Ce,width:Le}=this.props,we=Pe||"",ue=this.getVariant(),Ie=T({intervals:Z}),qe=Ie.find(({value:L})=>L===we),Je=I(D.offOption.value);let Ze=qe||Je;Ze.label===Je.label&&(Ze={value:""});const Oe=Ze.ariaLabel,ce=(0,r.t)("refresh-picker.aria-label.duration-selected","Choose refresh time interval with current interval {{durationAriaLabel}} selected",{durationAriaLabel:Oe}),pe=(0,r.t)("refresh-picker.aria-label.choose-interval","Auto refresh turned off. Choose refresh time interval"),J=Ze.value===""?pe:ce;return a.createElement(u.h,{className:"refresh-picker"},a.createElement(S.h,{"aria-label":he,tooltip:te,onClick:ne,variant:ue,icon:ie?"fa fa-spinner":"sync",style:Le?{width:Le}:void 0,"data-testid":o.wl.components.RefreshPicker.runButtonV2},he),!Ce&&a.createElement(p.d,{value:Ze,options:Ie,onChange:this.onChangeSelect,variant:ue,title:(0,r.t)("refresh-picker.select-button.auto-refresh","Set auto refresh interval"),"data-testid":o.wl.components.RefreshPicker.intervalButtonV2,"aria-label":J}))}};let M=D;M.offOption={label:"Off",value:"",ariaLabel:"Turn off auto refresh"},M.liveOption={label:"Live",value:"LIVE",ariaLabel:"Turn on live streaming"},M.isLive=ne=>ne===D.liveOption.value;function I(ne){return ne===M.liveOption.value?{label:(0,r.t)("refresh-picker.live-option.label","Live"),value:"LIVE",ariaLabel:(0,r.t)("refresh-picker.live-option.aria-label","Turn on live streaming")}:{label:(0,r.t)("refresh-picker.off-option.label","Off"),value:"",ariaLabel:(0,r.t)("refresh-picker.off-option.aria-label","Turn off auto refresh")}}function T({intervals:ne=k}={}){const Z=ne.map(te=>{const Pe=b(te),he=(0,l.Z)(Pe);return{label:te,value:te,ariaLabel:he}});return Z.unshift(I(M.offOption.value)),Z}try{I.displayName="translateOption",I.__docgenInfo={description:"",displayName:"translateOption",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/RefreshPicker/RefreshPicker.tsx#translateOption"]={docgenInfo:I.__docgenInfo,name:"translateOption",path:"src/components/RefreshPicker/RefreshPicker.tsx#translateOption"})}catch(ne){}try{T.displayName="intervalsToOptions",T.__docgenInfo={description:"",displayName:"intervalsToOptions",props:{intervals:{defaultValue:{value:"['5s', '10s', '30s', '1m', '5m', '15m', '30m', '1h', '2h', '1d']"},description:"",name:"intervals",required:!1,type:{name:"string[]"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/RefreshPicker/RefreshPicker.tsx#intervalsToOptions"]={docgenInfo:T.__docgenInfo,name:"intervalsToOptions",path:"src/components/RefreshPicker/RefreshPicker.tsx#intervalsToOptions"})}catch(ne){}try{M.displayName="RefreshPicker",M.__docgenInfo={description:"",displayName:"RefreshPicker",props:{intervals:{defaultValue:null,description:"",name:"intervals",required:!1,type:{name:"string[]"}},onRefresh:{defaultValue:null,description:"",name:"onRefresh",required:!1,type:{name:"(() => void)"}},onIntervalChanged:{defaultValue:null,description:"",name:"onIntervalChanged",required:!0,type:{name:"(interval: string) => void"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string"}},tooltip:{defaultValue:null,description:"",name:"tooltip",required:!1,type:{name:"string"}},isLoading:{defaultValue:null,description:"",name:"isLoading",required:!1,type:{name:"boolean"}},isLive:{defaultValue:null,description:"",name:"isLive",required:!1,type:{name:"boolean"}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"string"}},noIntervalPicker:{defaultValue:null,description:"",name:"noIntervalPicker",required:!1,type:{name:"boolean"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string"}},primary:{defaultValue:null,description:"",name:"primary",required:!1,type:{name:"boolean"}},isOnCanvas:{defaultValue:null,description:"",name:"isOnCanvas",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/RefreshPicker/RefreshPicker.tsx#RefreshPicker"]={docgenInfo:M.__docgenInfo,name:"RefreshPicker",path:"src/components/RefreshPicker/RefreshPicker.tsx#RefreshPicker"})}catch(ne){}try{M.isLive.displayName="RefreshPicker.isLive",M.isLive.__docgenInfo={description:"",displayName:"RefreshPicker.isLive",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/RefreshPicker/RefreshPicker.tsx#RefreshPicker.isLive"]={docgenInfo:M.isLive.__docgenInfo,name:"RefreshPicker.isLive",path:"src/components/RefreshPicker/RefreshPicker.tsx#RefreshPicker.isLive"})}catch(ne){}var j=e("./src/utils/storybook/withCenteredStory.tsx"),K=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),F=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),$=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function R(ne){const Z=Object.assign({h1:"h1",p:"p",strong:"strong"},(0,F.ah)(),ne.components);return(0,K.jsxs)(K.Fragment,{children:[(0,K.jsx)($.h_,{title:"MDX|RefreshPicker",component:M}),`
`,(0,K.jsx)(Z.h1,{children:"Refresh Picker"}),`
`,(0,K.jsx)(Z.p,{children:"This component is used on dashboards to refresh visualizations. Grafana does not do this automatically, queries run on their own schedule according to the panel settings. Grafana cancels any pending requests when a new refresh is triggered."}),`
`,(0,K.jsxs)(Z.p,{children:[(0,K.jsx)(Z.strong,{children:"The refresh icon:"})," will immediately run the query and refresh the visualizations."]}),`
`,(0,K.jsxs)(Z.p,{children:[(0,K.jsx)(Z.strong,{children:"The down arrow:"})," will display a list of refresh intervals. If one of them is selected the dashboard will regularly refresh according to that schedule."]}),`
`,(0,K.jsxs)($.MB,{children:[(0,K.jsx)(M,{tooltip:"Run query"}),(0,K.jsx)(M,{text:"Run query",tooltip:"Run query"}),(0,K.jsx)(M,{text:"Run query",isLoading:!0,tooltip:"Run query",value:"1h"})]}),`
`,(0,K.jsx)($.xP,{of:M})]})}function U(ne={}){const{wrapper:Z}=Object.assign({},(0,F.ah)(),ne.components);return Z?(0,K.jsx)(Z,Object.assign({},ne,{children:(0,K.jsx)(R,ne)})):R(ne)}var H=U,W=Object.defineProperty,oe=Object.getOwnPropertySymbols,Q=Object.prototype.hasOwnProperty,P=Object.prototype.propertyIsEnumerable,ae=(ne,Z,te)=>Z in ne?W(ne,Z,{enumerable:!0,configurable:!0,writable:!0,value:te}):ne[Z]=te,q=(ne,Z)=>{for(var te in Z||(Z={}))Q.call(Z,te)&&ae(ne,te,Z[te]);if(oe)for(var te of oe(Z))P.call(Z,te)&&ae(ne,te,Z[te]);return ne},Y=`import { action } from '@storybook/addon-actions';
import { useArgs } from '@storybook/client-api';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { RefreshPicker } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './RefreshPicker.mdx';

const meta: ComponentMeta<typeof RefreshPicker> = {
  title: 'Pickers and Editors/RefreshPicker',
  component: RefreshPicker,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      sort: 'alpha',
    },
  },
  args: {
    isLoading: false,
    isLive: false,
    width: 'auto',
    text: 'Run query',
    tooltip: 'My tooltip text goes here',
    value: '1h',
    primary: false,
    noIntervalPicker: false,
    intervals: ['5s', '10s', '30s', '1m', '5m', '15m', '30m', '1h', '2h', '1d'],
  },
};

export const Examples: ComponentStory<typeof RefreshPicker> = (args) => {
  const [, updateArgs] = useArgs();
  const onIntervalChanged = (interval: string) => {
    action('onIntervalChanged fired')(interval);
    updateArgs({ value: interval });
  };

  const onRefresh = () => {
    action('onRefresh fired')();
  };

  return (
    <RefreshPicker
      tooltip={args.tooltip}
      value={args.value}
      text={args.text}
      isLoading={args.isLoading}
      intervals={args.intervals}
      width={args.width}
      onIntervalChanged={onIntervalChanged}
      onRefresh={onRefresh}
      noIntervalPicker={args.noIntervalPicker}
      primary={args.primary}
    />
  );
};

export default meta;
`,ve={Examples:{startLoc:{col:62,line:37},endLoc:{col:1,line:62},startBody:{col:62,line:37},endBody:{col:1,line:62}}};const re={title:"Pickers and Editors/RefreshPicker",component:M,decorators:[j.BU],parameters:{docs:{page:H},controls:{sort:"alpha"}},args:{isLoading:!1,isLive:!1,width:"auto",text:"Run query",tooltip:"My tooltip text goes here",value:"1h",primary:!1,noIntervalPicker:!1,intervals:["5s","10s","30s","1m","5m","15m","30m","1h","2h","1d"]}},je=ne=>{const[,Z]=(0,n.D8)(),te=he=>{(0,t.action)("onIntervalChanged fired")(he),Z({value:he})},Pe=()=>{(0,t.action)("onRefresh fired")()};return a.createElement(M,{tooltip:ne.tooltip,value:ne.value,text:ne.text,isLoading:ne.isLoading,intervals:ne.intervals,width:ne.width,onIntervalChanged:te,onRefresh:Pe,noIntervalPicker:ne.noIntervalPicker,primary:ne.primary})};var me=re;je.parameters=q({storySource:{source:`(args) => {
  const [, updateArgs] = useArgs();
  const onIntervalChanged = (interval: string) => {
    action('onIntervalChanged fired')(interval);
    updateArgs({ value: interval });
  };

  const onRefresh = () => {
    action('onRefresh fired')();
  };

  return (
    <RefreshPicker
      tooltip={args.tooltip}
      value={args.value}
      text={args.text}
      isLoading={args.isLoading}
      intervals={args.intervals}
      width={args.width}
      onIntervalChanged={onIntervalChanged}
      onRefresh={onRefresh}
      noIntervalPicker={args.noIntervalPicker}
      primary={args.primary}
    />
  );
}`}},je.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/RefreshPicker/RefreshPicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/RefreshPicker/RefreshPicker.story.tsx#ComponentMeta"})}catch(ne){}},"./src/components/RenderUserContentAsHTML/RenderUserContentAsHTML.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return k},default:function(){return D}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/index.ts"),a=Object.defineProperty,l=Object.getOwnPropertySymbols,f=Object.prototype.hasOwnProperty,x=Object.prototype.propertyIsEnumerable,d=(M,I,T)=>I in M?a(M,I,{enumerable:!0,configurable:!0,writable:!0,value:T}):M[I]=T,i=(M,I)=>{for(var T in I||(I={}))f.call(I,T)&&d(M,T,I[T]);if(l)for(var T of l(I))x.call(I,T)&&d(M,T,I[T]);return M},c=(M,I)=>{var T={};for(var j in M)f.call(M,j)&&I.indexOf(j)<0&&(T[j]=M[j]);if(M!=null&&l)for(var j of l(M))I.indexOf(j)<0&&x.call(M,j)&&(T[j]=M[j]);return T};function E(M){var I=M,{component:T,content:j}=I,K=c(I,["component","content"]);return t.createElement(T||"span",i({dangerouslySetInnerHTML:{__html:n.QX.sanitize(j)}},K))}try{E.displayName="RenderUserContentAsHTML",E.__docgenInfo={description:"",displayName:"RenderUserContentAsHTML",props:{component:{defaultValue:null,description:"",name:"component",required:!1,type:{name:"enum",value:[{value:'"object"'},{value:'"title"'},{value:'"slot"'},{value:'"style"'},{value:'"link"'},{value:'"table"'},{value:'"button"'},{value:'"form"'},{value:'"label"'},{value:'"cite"'},{value:'"data"'},{value:'"span"'},{value:'"summary"'},{value:'"body"'},{value:'"a"'},{value:'"abbr"'},{value:'"address"'},{value:'"area"'},{value:'"article"'},{value:'"aside"'},{value:'"audio"'},{value:'"b"'},{value:'"base"'},{value:'"bdi"'},{value:'"bdo"'},{value:'"big"'},{value:'"blockquote"'},{value:'"br"'},{value:'"canvas"'},{value:'"caption"'},{value:'"code"'},{value:'"col"'},{value:'"colgroup"'},{value:'"datalist"'},{value:'"dd"'},{value:'"del"'},{value:'"details"'},{value:'"dfn"'},{value:'"dialog"'},{value:'"div"'},{value:'"dl"'},{value:'"dt"'},{value:'"em"'},{value:'"embed"'},{value:'"fieldset"'},{value:'"figcaption"'},{value:'"figure"'},{value:'"footer"'},{value:'"h1"'},{value:'"h2"'},{value:'"h3"'},{value:'"h4"'},{value:'"h5"'},{value:'"h6"'},{value:'"head"'},{value:'"header"'},{value:'"hgroup"'},{value:'"hr"'},{value:'"html"'},{value:'"i"'},{value:'"iframe"'},{value:'"img"'},{value:'"input"'},{value:'"ins"'},{value:'"kbd"'},{value:'"keygen"'},{value:'"legend"'},{value:'"li"'},{value:'"main"'},{value:'"map"'},{value:'"mark"'},{value:'"menu"'},{value:'"menuitem"'},{value:'"meta"'},{value:'"meter"'},{value:'"nav"'},{value:'"noscript"'},{value:'"ol"'},{value:'"optgroup"'},{value:'"option"'},{value:'"output"'},{value:'"p"'},{value:'"param"'},{value:'"picture"'},{value:'"pre"'},{value:'"progress"'},{value:'"q"'},{value:'"rp"'},{value:'"rt"'},{value:'"ruby"'},{value:'"s"'},{value:'"samp"'},{value:'"script"'},{value:'"section"'},{value:'"select"'},{value:'"small"'},{value:'"source"'},{value:'"strong"'},{value:'"sub"'},{value:'"sup"'},{value:'"template"'},{value:'"tbody"'},{value:'"td"'},{value:'"textarea"'},{value:'"tfoot"'},{value:'"th"'},{value:'"thead"'},{value:'"time"'},{value:'"tr"'},{value:'"track"'},{value:'"u"'},{value:'"ul"'},{value:'"var"'},{value:'"video"'},{value:'"wbr"'},{value:'"webview"'}]}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/RenderUserContentAsHTML/RenderUserContentAsHTML.tsx#RenderUserContentAsHTML"]={docgenInfo:E.__docgenInfo,name:"RenderUserContentAsHTML",path:"src/components/RenderUserContentAsHTML/RenderUserContentAsHTML.tsx#RenderUserContentAsHTML"})}catch(M){}var O=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),m=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),w=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function _(M){const I=Object.assign({h1:"h1",p:"p",h3:"h3",code:"code",pre:"pre"},(0,m.ah)(),M.components),{Meta:T}=I;return T||g("Meta",!0),(0,O.jsxs)(O.Fragment,{children:[(0,O.jsx)(T,{title:"MDX|RenderUserContentAsHTML",component:E}),`
`,(0,O.jsx)(I.h1,{children:"RenderUserContentAsHTML"}),`
`,(0,O.jsx)(I.p,{children:"Abstraction layer component for sanitizing and rendering an html content."}),`
`,(0,O.jsx)(I.h3,{children:"When to use"}),`
`,(0,O.jsxs)(I.p,{children:["This should be use as replacement for ",(0,O.jsx)(I.code,{children:"dangerouslySetInnerHTML"})," as this centralizes the sanitation of contents over the app."]}),`
`,(0,O.jsx)(I.h3,{children:"Usage"}),`
`,(0,O.jsx)(I.pre,{children:(0,O.jsx)(I.code,{className:"language-jsx",children:`<RenderUserContentAsHTML content="sample content" />
`})}),`
`,(0,O.jsx)(I.h3,{children:"Props"}),`
`,(0,O.jsx)(w.xP,{of:E})]})}function C(M={}){const{wrapper:I}=Object.assign({},(0,m.ah)(),M.components);return I?(0,O.jsx)(I,Object.assign({},M,{children:(0,O.jsx)(_,M)})):_(M)}var b=C;function g(M,I){throw new Error("Expected "+(I?"component":"object")+" `"+M+"` to be defined: you likely forgot to import, pass, or provide it.")}var v=Object.defineProperty,y=Object.getOwnPropertySymbols,h=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,o=(M,I,T)=>I in M?v(M,I,{enumerable:!0,configurable:!0,writable:!0,value:T}):M[I]=T,r=(M,I)=>{for(var T in I||(I={}))h.call(I,T)&&o(M,T,I[T]);if(y)for(var T of y(I))s.call(I,T)&&o(M,T,I[T]);return M},u=null,p={Basic:{startLoc:{col:69,line:25},endLoc:{col:1,line:27},startBody:{col:69,line:25},endBody:{col:1,line:27}}};const S={title:"General/RenderUserContentAsHTML",component:E,parameters:{docs:{page:b}},argTypes:{content:{control:{type:"text"}},component:{control:{type:"text"}}}},k=M=>t.createElement(E,r({},M));k.args={content:'<a href="#">sample html anchor tag link</a>'};var D=S;k.parameters=r({storySource:{source:`(props) => {
  return <RenderUserContentAsHTML {...props} />;
}`}},k.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/RenderUserContentAsHTML/RenderUserContentAsHTML.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/RenderUserContentAsHTML/RenderUserContentAsHTML.story.tsx#ComponentMeta"})}catch(M){}},"./src/components/SecretInput/SecretInput.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{basic:function(){return R},default:function(){return F},secretIsConfigured:function(){return U}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/Button/Button.tsx"),l=e("./src/components/Input/Input.tsx"),f=e("./src/components/Layout/Layout.tsx"),x=Object.defineProperty,d=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(H,W,oe)=>W in H?x(H,W,{enumerable:!0,configurable:!0,writable:!0,value:oe}):H[W]=oe,w=(H,W)=>{for(var oe in W||(W={}))E.call(W,oe)&&m(H,oe,W[oe]);if(c)for(var oe of c(W))O.call(W,oe)&&m(H,oe,W[oe]);return H},_=(H,W)=>d(H,i(W)),C=(H,W)=>{var oe={};for(var Q in H)E.call(H,Q)&&W.indexOf(Q)<0&&(oe[Q]=H[Q]);if(H!=null&&c)for(var Q of c(H))W.indexOf(Q)<0&&O.call(H,Q)&&(oe[Q]=H[Q]);return oe};const b="configured",g="Reset",v=H=>{var W=H,{isConfigured:oe,onReset:Q}=W,P=C(W,["isConfigured","onReset"]);return t.createElement(f.Lh,null,!oe&&t.createElement(l.I,_(w({},P),{type:"password"})),oe&&t.createElement(l.I,_(w({},P),{type:"text",disabled:!0,value:b})),oe&&t.createElement(a.zx,{onClick:Q,variant:"secondary"},g))};try{v.displayName="SecretInput",v.__docgenInfo={description:"",displayName:"SecretInput",props:{prefix:{defaultValue:null,description:"Show an icon as a prefix in the input",name:"prefix",required:!1,type:{name:"ReactNode"}},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"}},loading:{defaultValue:null,description:"Show a loading indicator as a suffix in the input",name:"loading",required:!1,type:{name:"boolean"}},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"}},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"}},isConfigured:{defaultValue:null,description:"TRUE if the secret was already configured. (It is needed as often the backend doesn't send back the actual secret, only the information that it was configured)",name:"isConfigured",required:!0,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/SecretInput/SecretInput.tsx#SecretInput"]={docgenInfo:v.__docgenInfo,name:"SecretInput",path:"src/components/SecretInput/SecretInput.tsx#SecretInput"})}catch(H){}var y=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),h=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),s=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function o(H){const W=Object.assign({h1:"h1",p:"p",strong:"strong",em:"em",ul:"ul",li:"li",h3:"h3",pre:"pre",code:"code"},(0,h.ah)(),H.components);return(0,y.jsxs)(y.Fragment,{children:[(0,y.jsx)(W.h1,{children:"Secret Input"}),`
`,(0,y.jsxs)(W.p,{children:["Used for secret/password input. It has 2 states: ",(0,y.jsx)(W.strong,{children:(0,y.jsx)(W.em,{children:"configured"})})," and ",(0,y.jsx)(W.strong,{children:(0,y.jsx)(W.em,{children:"not configured"})}),"."]}),`
`,(0,y.jsxs)(W.ul,{children:[`
`,(0,y.jsx)(W.li,{children:`If configured it will disable the input and add a reset button that will
clear the input and make it accessible.`}),`
`,(0,y.jsx)(W.li,{children:"In non configured state it behaves like a normal password input."}),`
`]}),`
`,(0,y.jsx)(W.p,{children:`This is used for passwords or anything that is encrypted on the server and is
later returned encrypted to the user (like datasource passwords).`}),`
`,(0,y.jsx)(W.h3,{children:"Usage"}),`
`,(0,y.jsx)(W.pre,{children:(0,y.jsx)(W.code,{className:"language-tsx",children:`import {SecretInput} from '@grafana/ui';

<SecretInput
  value={...}
  isConfigured={...}
  onChange={...}
  onReset={...}
/>
`})}),`
`,(0,y.jsx)(s.xP,{of:v})]})}function r(H={}){const{wrapper:W}=Object.assign({},(0,h.ah)(),H.components);return W?(0,y.jsx)(W,Object.assign({},H,{children:(0,y.jsx)(o,H)})):o(H)}var u=r,p=Object.defineProperty,S=Object.getOwnPropertySymbols,k=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable,M=(H,W,oe)=>W in H?p(H,W,{enumerable:!0,configurable:!0,writable:!0,value:oe}):H[W]=oe,I=(H,W)=>{for(var oe in W||(W={}))k.call(W,oe)&&M(H,oe,W[oe]);if(S)for(var oe of S(W))D.call(W,oe)&&M(H,oe,W[oe]);return H},T=`import { ComponentStory, ComponentMeta } from '@storybook/react';
import React, { useState, ChangeEvent } from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { SecretInput } from './SecretInput';
import mdx from './SecretInput.mdx';

const meta: ComponentMeta<typeof SecretInput> = {
  title: 'Forms/SecretInput',
  component: SecretInput,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: [
        'prefix',
        'suffix',
        'addonBefore',
        'addonAfter',
        'type',
        'disabled',
        'invalid',
        'loading',
        'before',
        'after',
      ],
    },
  },
  args: {
    width: 50,
    placeholder: 'Enter your secret...',
  },
  argTypes: {
    width: { control: { type: 'range', min: 10, max: 200, step: 10 } },
  },
};

export default meta;

const Template: ComponentStory<typeof SecretInput> = (args) => {
  const [secret, setSecret] = useState('');

  return (
    <SecretInput
      width={args.width}
      value={secret}
      isConfigured={args.isConfigured}
      placeholder={args.placeholder}
      onChange={(event: ChangeEvent<HTMLInputElement>) => setSecret(event.target.value.trim())}
      onReset={() => setSecret('')}
    />
  );
};

export const basic = Template.bind({});

basic.args = {
  isConfigured: false,
};

export const secretIsConfigured = Template.bind({});

secretIsConfigured.args = {
  isConfigured: true,
};
`,j={basic:{startLoc:{col:53,line:43},endLoc:{col:1,line:56},startBody:{col:53,line:43},endBody:{col:1,line:56}},secretIsConfigured:{startLoc:{col:53,line:43},endLoc:{col:1,line:56},startBody:{col:53,line:43},endBody:{col:1,line:56}}},F={title:"Forms/SecretInput",component:v,decorators:[n.BU],parameters:{docs:{page:u},controls:{exclude:["prefix","suffix","addonBefore","addonAfter","type","disabled","invalid","loading","before","after"]}},args:{width:50,placeholder:"Enter your secret..."},argTypes:{width:{control:{type:"range",min:10,max:200,step:10}}}};const $=H=>{const[W,oe]=(0,t.useState)("");return t.createElement(v,{width:H.width,value:W,isConfigured:H.isConfigured,placeholder:H.placeholder,onChange:Q=>oe(Q.target.value.trim()),onReset:()=>oe("")})},R=$.bind({});R.args={isConfigured:!1};const U=$.bind({});U.args={isConfigured:!0},R.parameters=I({storySource:{source:`(args) => {
  const [secret, setSecret] = useState('');

  return (
    <SecretInput
      width={args.width}
      value={secret}
      isConfigured={args.isConfigured}
      placeholder={args.placeholder}
      onChange={(event: ChangeEvent<HTMLInputElement>) => setSecret(event.target.value.trim())}
      onReset={() => setSecret('')}
    />
  );
}`}},R.parameters),U.parameters=I({storySource:{source:`(args) => {
  const [secret, setSecret] = useState('');

  return (
    <SecretInput
      width={args.width}
      value={secret}
      isConfigured={args.isConfigured}
      placeholder={args.placeholder}
      onChange={(event: ChangeEvent<HTMLInputElement>) => setSecret(event.target.value.trim())}
      onReset={() => setSecret('')}
    />
  );
}`}},U.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/SecretInput/SecretInput.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/SecretInput/SecretInput.story.tsx#ComponentMeta"})}catch(H){}},"./src/components/SecretTextArea/SecretTextArea.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{basic:function(){return j},default:function(){return F},secretIsConfigured:function(){return K}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/components/Button/Button.tsx"),x=e("./src/components/Layout/Layout.tsx"),d=e("./src/components/TextArea/TextArea.tsx"),i=Object.defineProperty,c=Object.defineProperties,E=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=($,R,U)=>R in $?i($,R,{enumerable:!0,configurable:!0,writable:!0,value:U}):$[R]=U,C=($,R)=>{for(var U in R||(R={}))m.call(R,U)&&_($,U,R[U]);if(O)for(var U of O(R))w.call(R,U)&&_($,U,R[U]);return $},b=($,R)=>c($,E(R)),g=($,R)=>{var U={};for(var H in $)m.call($,H)&&R.indexOf(H)<0&&(U[H]=$[H]);if($!=null&&O)for(var H of O($))R.indexOf(H)<0&&w.call($,H)&&(U[H]=$[H]);return U};const v="configured",y="Reset",h=$=>({configuredStyle:a.iv`
      min-height: ${$.spacing($.components.height.md)};
      padding-top: ${$.spacing(.5)};
      resize: none;
    `}),s=$=>{var R=$,{isConfigured:U,onReset:H}=R,W=g(R,["isConfigured","onReset"]);const oe=(0,l.wW)(h);return t.createElement(x.Lh,null,!U&&t.createElement(d.K,C({},W)),U&&t.createElement(d.K,b(C({},W),{rows:1,disabled:!0,value:v,className:(0,a.cx)(oe.configuredStyle)})),U&&t.createElement(f.zx,{onClick:H,variant:"secondary"},y))};try{s.displayName="SecretTextArea",s.__docgenInfo={description:`Text area that does not disclose an already configured value but lets the user reset the current value and enter a new one.
Typically useful for asymmetric cryptography keys.`,displayName:"SecretTextArea",props:{invalid:{defaultValue:null,description:"Show an invalid state around the input",name:"invalid",required:!1,type:{name:"boolean"}},isConfigured:{defaultValue:null,description:"TRUE if the secret was already configured. (It is needed as often the backend doesn't send back the actual secret, only the information that it was configured)",name:"isConfigured",required:!0,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/SecretTextArea/SecretTextArea.tsx#SecretTextArea"]={docgenInfo:s.__docgenInfo,name:"SecretTextArea",path:"src/components/SecretTextArea/SecretTextArea.tsx#SecretTextArea"})}catch($){}var o=Object.defineProperty,r=Object.getOwnPropertySymbols,u=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable,S=($,R,U)=>R in $?o($,R,{enumerable:!0,configurable:!0,writable:!0,value:U}):$[R]=U,k=($,R)=>{for(var U in R||(R={}))u.call(R,U)&&S($,U,R[U]);if(r)for(var U of r(R))p.call(R,U)&&S($,U,R[U]);return $},D=`import { ComponentStory, ComponentMeta } from '@storybook/react';
import React, { useState, ChangeEvent } from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { SecretTextArea } from './SecretTextArea';

const meta: ComponentMeta<typeof SecretTextArea> = {
  title: 'Forms/SecretTextArea',
  component: SecretTextArea,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: [
        'prefix',
        'suffix',
        'addonBefore',
        'addonAfter',
        'type',
        'disabled',
        'invalid',
        'loading',
        'before',
        'after',
      ],
    },
  },
  args: {
    rows: 3,
    cols: 30,
    placeholder: 'Enter your secret...',
  },
  argTypes: {
    rows: { control: { type: 'range', min: 1, max: 50, step: 1 } },
    cols: { control: { type: 'range', min: 1, max: 200, step: 10 } },
  },
};

const Template: ComponentStory<typeof SecretTextArea> = (args) => {
  const [secret, setSecret] = useState('');

  return (
    <SecretTextArea
      rows={args.rows}
      cols={args.cols}
      value={secret}
      isConfigured={args.isConfigured}
      placeholder={args.placeholder}
      onChange={(event: ChangeEvent<HTMLTextAreaElement>) => setSecret(event.target.value.trim())}
      onReset={() => setSecret('')}
    />
  );
};

export const basic = Template.bind({});

basic.args = {
  isConfigured: false,
};

export const secretIsConfigured = Template.bind({});

secretIsConfigured.args = {
  isConfigured: true,
};

export default meta;
`,M={basic:{startLoc:{col:56,line:39},endLoc:{col:1,line:53},startBody:{col:56,line:39},endBody:{col:1,line:53}},secretIsConfigured:{startLoc:{col:56,line:39},endLoc:{col:1,line:53},startBody:{col:56,line:39},endBody:{col:1,line:53}}};const I={title:"Forms/SecretTextArea",component:s,decorators:[n.BU],parameters:{controls:{exclude:["prefix","suffix","addonBefore","addonAfter","type","disabled","invalid","loading","before","after"]}},args:{rows:3,cols:30,placeholder:"Enter your secret..."},argTypes:{rows:{control:{type:"range",min:1,max:50,step:1}},cols:{control:{type:"range",min:1,max:200,step:10}}}},T=$=>{const[R,U]=(0,t.useState)("");return t.createElement(s,{rows:$.rows,cols:$.cols,value:R,isConfigured:$.isConfigured,placeholder:$.placeholder,onChange:H=>U(H.target.value.trim()),onReset:()=>U("")})},j=T.bind({});j.args={isConfigured:!1};const K=T.bind({});K.args={isConfigured:!0};var F=I;j.parameters=k({storySource:{source:`(args) => {
  const [secret, setSecret] = useState('');

  return (
    <SecretTextArea
      rows={args.rows}
      cols={args.cols}
      value={secret}
      isConfigured={args.isConfigured}
      placeholder={args.placeholder}
      onChange={(event: ChangeEvent<HTMLTextAreaElement>) => setSecret(event.target.value.trim())}
      onReset={() => setSecret('')}
    />
  );
}`}},j.parameters),K.parameters=k({storySource:{source:`(args) => {
  const [secret, setSecret] = useState('');

  return (
    <SecretTextArea
      rows={args.rows}
      cols={args.cols}
      value={secret}
      isConfigured={args.isConfigured}
      placeholder={args.placeholder}
      onChange={(event: ChangeEvent<HTMLTextAreaElement>) => setSecret(event.target.value.trim())}
      onReset={() => setSecret('')}
    />
  );
}`}},K.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/SecretTextArea/SecretTextArea.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/SecretTextArea/SecretTextArea.story.tsx#ComponentMeta"})}catch($){}},"./src/components/Segment/Segment.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{ArrayOptions:function(){return W},ArrayOptionsWithPlaceholder:function(){return P},ArrayOptionsWithPrimitiveValue:function(){return Q},Basic:function(){return je},CustomLabelField:function(){return ve},CustomOptionsAllowed:function(){return q},GroupedArrayOptions:function(){return ae},HtmlAttributes:function(){return re},default:function(){return me}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/components/Icon/Icon.tsx"),l=e("./src/components/Segment/SegmentSection.tsx"),f=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),x=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/components/Forms/InlineLabel.tsx"),c=e("./src/components/Segment/styles.ts"),E=e("./src/components/Segment/useExpandableLabel.tsx"),O=e("./src/components/Segment/SegmentSelect.tsx"),m=Object.defineProperty,w=Object.defineProperties,_=Object.getOwnPropertyDescriptors,C=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,v=(ne,Z,te)=>Z in ne?m(ne,Z,{enumerable:!0,configurable:!0,writable:!0,value:te}):ne[Z]=te,y=(ne,Z)=>{for(var te in Z||(Z={}))b.call(Z,te)&&v(ne,te,Z[te]);if(C)for(var te of C(Z))g.call(Z,te)&&v(ne,te,Z[te]);return ne},h=(ne,Z)=>w(ne,_(Z)),s=(ne,Z)=>{var te={};for(var Pe in ne)b.call(ne,Pe)&&Z.indexOf(Pe)<0&&(te[Pe]=ne[Pe]);if(ne!=null&&C)for(var Pe of C(ne))Z.indexOf(Pe)<0&&g.call(ne,Pe)&&(te[Pe]=ne[Pe]);return te};function o(ne){var Z=ne,{options:te,value:Pe,onChange:he,Component:ie,className:Ce,allowCustomValue:Le,allowEmptyValue:we,placeholder:ue,disabled:Ie,inputMinWidth:qe,inputPlaceholder:Je,onExpandedChange:Ze,autofocus:Oe=!1}=Z,ce=s(Z,["options","value","onChange","Component","className","allowCustomValue","allowEmptyValue","placeholder","disabled","inputMinWidth","inputPlaceholder","onExpandedChange","autofocus"]);const[pe,J,L,fe]=(0,E._)(Oe,Ze),xe=qe?Math.max(qe,J):J,We=(0,d.wW)(c.N);if(!L){const Ue=(0,x.isObject)(Pe)?Pe.label:Pe;return n.createElement(pe,{disabled:Ie,Component:ie||n.createElement(i.W,{className:(0,f.cx)(We.segment,{[We.queryPlaceholder]:ue!==void 0&&!Pe,[We.disabled]:Ie},Ce)},Ue||ue)})}return n.createElement(O.V,h(y({},ce),{value:Pe&&!(0,x.isObject)(Pe)?{value:Pe}:Pe,placeholder:Je,options:te,width:xe,onClickOutside:()=>fe(!1),allowCustomValue:Le,allowEmptyValue:we,onChange:Ue=>{fe(!1),he(Ue)}}))}try{o.displayName="Segment",o.__docgenInfo={description:"",displayName:"Segment",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"T | SelectableValue<T>"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(item: SelectableValue<T>) => void"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"SelectableValue<T>[]"}},inputMinWidth:{defaultValue:null,description:"",name:"inputMinWidth",required:!1,type:{name:"number"}},Component:{defaultValue:null,description:"",name:"Component",required:!1,type:{name:"ReactElement<any, string | JSXElementConstructor<any>>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},onExpandedChange:{defaultValue:null,description:"",name:"onExpandedChange",required:!1,type:{name:"((expanded: boolean) => void)"}},autofocus:{defaultValue:{value:"false"},description:"",name:"autofocus",required:!1,type:{name:"boolean"}},allowEmptyValue:{defaultValue:null,description:"",name:"allowEmptyValue",required:!1,type:{name:"boolean"}},inputPlaceholder:{defaultValue:null,description:"",name:"inputPlaceholder",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Segment/Segment.tsx#Segment"]={docgenInfo:o.__docgenInfo,name:"Segment",path:"src/components/Segment/Segment.tsx#Segment"})}catch(ne){}var r=Object.defineProperty,u=Object.defineProperties,p=Object.getOwnPropertyDescriptors,S=Object.getOwnPropertySymbols,k=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable,M=(ne,Z,te)=>Z in ne?r(ne,Z,{enumerable:!0,configurable:!0,writable:!0,value:te}):ne[Z]=te,I=(ne,Z)=>{for(var te in Z||(Z={}))k.call(Z,te)&&M(ne,te,Z[te]);if(S)for(var te of S(Z))D.call(Z,te)&&M(ne,te,Z[te]);return ne},T=(ne,Z)=>u(ne,p(Z)),j=null,K={ArrayOptions:{startLoc:{col:28,line:31},endLoc:{col:1,line:45},startBody:{col:28,line:31},endBody:{col:1,line:45}},ArrayOptionsWithPrimitiveValue:{startLoc:{col:46,line:52},endLoc:{col:1,line:66},startBody:{col:46,line:52},endBody:{col:1,line:66}},ArrayOptionsWithPlaceholder:{startLoc:{col:43,line:68},endLoc:{col:1,line:83},startBody:{col:43,line:68},endBody:{col:1,line:83}},GroupedArrayOptions:{startLoc:{col:35,line:85},endLoc:{col:1,line:99},startBody:{col:35,line:85},endBody:{col:1,line:99}},CustomOptionsAllowed:{startLoc:{col:36,line:101},endLoc:{col:1,line:116},startBody:{col:36,line:101},endBody:{col:1,line:116}},CustomLabelField:{startLoc:{col:32,line:120},endLoc:{col:1,line:134},startBody:{col:32,line:120},endBody:{col:1,line:134}},HtmlAttributes:{startLoc:{col:30,line:136},endLoc:{col:1,line:152},startBody:{col:30,line:136},endBody:{col:1,line:152}},Basic:{startLoc:{col:84,line:154},endLoc:{col:1,line:174},startBody:{col:84,line:154},endBody:{col:1,line:174}}};const F=n.createElement("span",{className:"gf-form-label query-part"},n.createElement(a.J,{name:"plus-circle"})),$=ne=>({label:ne,value:ne}),R=["Option1","Option2","OptionWithLooongLabel","Option4"].map($),U=[{label:"Names",options:["Jane","Tom","Lisa"].map($)},{label:"Prime",options:[2,3,5,7,11,13].map($)}],H=({options:ne,children:Z})=>n.createElement(n.Fragment,null,n.createElement(l.f,{label:"Segment Name"},Z,n.createElement(o,{Component:F,onChange:({value:te})=>(0,t.action)("New value added")(te),options:ne}))),W=()=>{const[ne,Z]=(0,n.useState)(R[0]);return n.createElement(H,{options:R},n.createElement(o,{value:ne,options:R,onChange:te=>{Z(te),(0,t.action)("Segment value changed")(te.value)}}))},oe={title:"Data Source/Segment/SegmentSync",component:o},Q=()=>{const[ne,Z]=(0,n.useState)("Option1");return n.createElement(H,{options:R},n.createElement(o,{value:ne,options:R,onChange:({value:te})=>{Z(te),(0,t.action)("Segment value changed")(te)}}))},P=()=>{const[ne,Z]=(0,n.useState)(void 0);return n.createElement(H,{options:R},n.createElement(o,{value:ne,options:R,placeholder:"Enter a value",onChange:te=>{Z(te),(0,t.action)("Segment value changed")(te.value)}}))},ae=()=>{const[ne,Z]=(0,n.useState)(U[0].options[0]);return n.createElement(H,{options:R},n.createElement(o,{value:ne,options:U,onChange:te=>{Z(te),(0,t.action)("Segment value changed")(te.value)}}))},q=()=>{const[ne,Z]=(0,n.useState)(R[0]);return n.createElement(H,{options:R},n.createElement(o,{allowCustomValue:!0,value:ne,options:R,onChange:({value:te})=>{Z(te),(0,t.action)("Segment value changed")(te)}}))},Y=({value:ne})=>n.createElement("div",{className:"gf-form-label"},"custom(",ne,")"),ve=()=>{const[ne,Z]=(0,n.useState)(U[0].options[0].value);return n.createElement(H,{options:R},n.createElement(o,{Component:n.createElement(Y,{value:ne}),options:U,onChange:({value:te})=>{Z(te),(0,t.action)("Segment value changed")(te)}}))},re=()=>{const[ne,Z]=(0,n.useState)(R[0]);return n.createElement(H,{options:R},n.createElement(o,{"data-testid":"segment-test",id:"segment-id",value:ne,options:U,onChange:({value:te})=>{Z(te),(0,t.action)("Segment value changed")(te)}}))},je=ne=>{const[Z,te]=(0,n.useState)(ne.value),Pe=T(I({},ne),{value:Z,onChange:({value:he})=>{te(he),(0,t.action)("onChange fired")(he)},onExpandedChange:he=>(0,t.action)("onExpandedChange fired")({expanded:he})});return n.createElement(l.f,{label:"Segment:"},n.createElement(o,I({},Pe)))};je.parameters={controls:{exclude:["onChange","onExpandedChange","Component","className","value"]}},je.args={value:void 0,options:R,inputMinWidth:0,allowCustomValue:!1,placeholder:"Placeholder text",disabled:!1,autofocus:!1,allowEmptyValue:!1,inputPlaceholder:"Start typing..."};var me=oe;W.parameters=I({storySource:{source:`() => {
  const [value, setValue] = useState<any>(options[0]);
  return (
    <SegmentFrame options={options}>
      <Segment
        value={value}
        options={options}
        onChange={(item) => {
          setValue(item);
          action('Segment value changed')(item.value);
        }}
      />
    </SegmentFrame>
  );
}`}},W.parameters),Q.parameters=I({storySource:{source:`() => {
  const [value, setValue] = useState('Option1');
  return (
    <SegmentFrame options={options}>
      <Segment
        value={value}
        options={options}
        onChange={({ value }) => {
          setValue(value);
          action('Segment value changed')(value);
        }}
      />
    </SegmentFrame>
  );
}`}},Q.parameters),P.parameters=I({storySource:{source:`() => {
  const [value, setValue] = useState<any>(undefined);
  return (
    <SegmentFrame options={options}>
      <Segment
        value={value}
        options={options}
        placeholder="Enter a value"
        onChange={(item) => {
          setValue(item);
          action('Segment value changed')(item.value);
        }}
      />
    </SegmentFrame>
  );
}`}},P.parameters),ae.parameters=I({storySource:{source:`() => {
  const [value, setValue] = useState<any>(groupedOptions[0].options[0]);
  return (
    <SegmentFrame options={options}>
      <Segment
        value={value}
        options={groupedOptions}
        onChange={(item) => {
          setValue(item);
          action('Segment value changed')(item.value);
        }}
      />
    </SegmentFrame>
  );
}`}},ae.parameters),q.parameters=I({storySource:{source:`() => {
  const [value, setValue] = useState(options[0]);
  return (
    <SegmentFrame options={options}>
      <Segment
        allowCustomValue
        value={value}
        options={options}
        onChange={({ value }) => {
          setValue(value);
          action('Segment value changed')(value);
        }}
      />
    </SegmentFrame>
  );
}`}},q.parameters),ve.parameters=I({storySource:{source:`() => {
  const [value, setValue] = useState<any>(groupedOptions[0].options[0].value);
  return (
    <SegmentFrame options={options}>
      <Segment
        Component={<CustomLabelComponent value={value} />}
        options={groupedOptions}
        onChange={({ value }) => {
          setValue(value);
          action('Segment value changed')(value);
        }}
      />
    </SegmentFrame>
  );
}`}},ve.parameters),re.parameters=I({storySource:{source:`() => {
  const [value, setValue] = useState<any>(options[0]);
  return (
    <SegmentFrame options={options}>
      <Segment
        data-testid="segment-test"
        id="segment-id"
        value={value}
        options={groupedOptions}
        onChange={({ value }) => {
          setValue(value);
          action('Segment value changed')(value);
        }}
      />
    </SegmentFrame>
  );
}`}},re.parameters),je.parameters=I({storySource:{source:`(
  args: SegmentSyncProps<string>
) => {
  const [value, setValue] = useState(args.value);

  const props: SegmentSyncProps<string> = {
    ...args,
    value,
    onChange: ({ value }) => {
      setValue(value);
      action('onChange fired')(value);
    },
    onExpandedChange: (expanded) => action('onExpandedChange fired')({ expanded }),
  };

  return (
    <SegmentSection label="Segment:">
      <Segment<string> {...props} />
    </SegmentSection>
  );
}`}},je.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Segment/Segment.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Segment/Segment.story.tsx#ComponentMeta"})}catch(ne){}},"./src/components/Segment/SegmentAsync.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{ArrayOptions:function(){return q},ArrayOptionsWithPrimitiveValue:function(){return ve},Basic:function(){return he},CustomLabel:function(){return Z},CustomOptionsAllowed:function(){return me},CustomStateMessageHandler:function(){return te},GroupedArrayOptions:function(){return je},HtmlAttributes:function(){return Pe},default:function(){return ie}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/components/Icon/Icon.tsx"),l=e("./src/components/Segment/SegmentSection.tsx"),f=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),x=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),d=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useAsyncFn.js"),i=e("./src/themes/ThemeContext.tsx"),c=e("./src/utils/i18n.tsx"),E=e("./src/components/Forms/InlineLabel.tsx"),O=e("./src/components/Segment/SegmentSelect.tsx"),m=e("./src/components/Segment/styles.ts"),w=e("./src/components/Segment/useExpandableLabel.tsx"),_=Object.defineProperty,C=Object.defineProperties,b=Object.getOwnPropertyDescriptors,g=Object.getOwnPropertySymbols,v=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable,h=(Ce,Le,we)=>Le in Ce?_(Ce,Le,{enumerable:!0,configurable:!0,writable:!0,value:we}):Ce[Le]=we,s=(Ce,Le)=>{for(var we in Le||(Le={}))v.call(Le,we)&&h(Ce,we,Le[we]);if(g)for(var we of g(Le))y.call(Le,we)&&h(Ce,we,Le[we]);return Ce},o=(Ce,Le)=>C(Ce,b(Le)),r=(Ce,Le)=>{var we={};for(var ue in Ce)v.call(Ce,ue)&&Le.indexOf(ue)<0&&(we[ue]=Ce[ue]);if(Ce!=null&&g)for(var ue of g(Ce))Le.indexOf(ue)<0&&y.call(Ce,ue)&&(we[ue]=Ce[ue]);return we};function u(Ce){var Le=Ce,{value:we,onChange:ue,loadOptions:Ie,reloadOptionsOnChange:qe=!1,Component:Je,className:Ze,allowCustomValue:Oe,allowEmptyValue:ce,disabled:pe,placeholder:J,inputMinWidth:L,inputPlaceholder:fe,autofocus:xe=!1,onExpandedChange:We,noOptionMessageHandler:Ue=p}=Le,at=r(Le,["value","onChange","loadOptions","reloadOptionsOnChange","Component","className","allowCustomValue","allowEmptyValue","disabled","placeholder","inputMinWidth","inputPlaceholder","autofocus","onExpandedChange","noOptionMessageHandler"]),it;const[_t,wt]=(0,d.Z)(Ie,[Ie]),[ee,_e,ge,de]=(0,w._)(xe,We),Ee=L?Math.max(L,_e):_e,ze=(0,i.wW)(m.N);if(!ge){const le=(0,x.isObject)(we)?we.label:we;return n.createElement(ee,{onClick:qe?void 0:wt,disabled:pe,Component:Je||n.createElement(E.W,{className:(0,f.cx)(ze.segment,{[ze.queryPlaceholder]:J!==void 0&&!we,[ze.disabled]:pe},Ze)},le||J)})}return n.createElement(O.V,o(s({},at),{value:we&&!(0,x.isObject)(we)?{value:we}:we,placeholder:fe,options:(it=_t.value)!=null?it:[],loadOptions:qe?wt:void 0,width:Ee,noOptionsMessage:Ue(_t),allowCustomValue:Oe,allowEmptyValue:ce,onClickOutside:()=>{de(!1)},onChange:le=>{de(!1),ue(le)}}))}function p(Ce){return Ce.loading?(0,c.t)("grafana-ui.segment-async.loading","Loading options..."):Ce.error?(0,c.t)("grafana-ui.segment-async.error","Failed to load options"):!Array.isArray(Ce.value)||Ce.value.length===0?(0,c.t)("grafana-ui.segment-async.no-options","No options found"):""}try{u.displayName="SegmentAsync",u.__docgenInfo={description:"",displayName:"SegmentAsync",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"T | SelectableValue<T>"}},loadOptions:{defaultValue:null,description:"",name:"loadOptions",required:!0,type:{name:"(query?: string | undefined) => Promise<SelectableValue<T>[]>"}},reloadOptionsOnChange:{defaultValue:{value:"false"},description:`If true options will be reloaded when user changes the value in the input,
otherwise, options will be loaded when the segment is clicked`,name:"reloadOptionsOnChange",required:!1,type:{name:"boolean"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(item: SelectableValue<T>) => void"}},noOptionMessageHandler:{defaultValue:null,description:"",name:"noOptionMessageHandler",required:!1,type:{name:"((state: AsyncState<SelectableValue<T>[]>) => string)"}},inputMinWidth:{defaultValue:null,description:"",name:"inputMinWidth",required:!1,type:{name:"number"}},Component:{defaultValue:null,description:"",name:"Component",required:!1,type:{name:"ReactElement<any, string | JSXElementConstructor<any>>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},onExpandedChange:{defaultValue:null,description:"",name:"onExpandedChange",required:!1,type:{name:"((expanded: boolean) => void)"}},autofocus:{defaultValue:{value:"false"},description:"",name:"autofocus",required:!1,type:{name:"boolean"}},allowEmptyValue:{defaultValue:null,description:"",name:"allowEmptyValue",required:!1,type:{name:"boolean"}},inputPlaceholder:{defaultValue:null,description:"",name:"inputPlaceholder",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Segment/SegmentAsync.tsx#SegmentAsync"]={docgenInfo:u.__docgenInfo,name:"SegmentAsync",path:"src/components/Segment/SegmentAsync.tsx#SegmentAsync"})}catch(Ce){}var S=Object.defineProperty,k=Object.defineProperties,D=Object.getOwnPropertyDescriptors,M=Object.getOwnPropertySymbols,I=Object.prototype.hasOwnProperty,T=Object.prototype.propertyIsEnumerable,j=(Ce,Le,we)=>Le in Ce?S(Ce,Le,{enumerable:!0,configurable:!0,writable:!0,value:we}):Ce[Le]=we,K=(Ce,Le)=>{for(var we in Le||(Le={}))I.call(Le,we)&&j(Ce,we,Le[we]);if(M)for(var we of M(Le))T.call(Le,we)&&j(Ce,we,Le[we]);return Ce},F=(Ce,Le)=>k(Ce,D(Le)),$=(Ce,Le,we)=>new Promise((ue,Ie)=>{var qe=Oe=>{try{Ze(we.next(Oe))}catch(ce){Ie(ce)}},Je=Oe=>{try{Ze(we.throw(Oe))}catch(ce){Ie(ce)}},Ze=Oe=>Oe.done?ue(Oe.value):Promise.resolve(Oe.value).then(qe,Je);Ze((we=we.apply(Ce,Le)).next())}),R=null,U={ArrayOptions:{startLoc:{col:28,line:39},endLoc:{col:1,line:53},startBody:{col:28,line:39},endBody:{col:1,line:53}},ArrayOptionsWithPrimitiveValue:{startLoc:{col:46,line:60},endLoc:{col:1,line:74},startBody:{col:46,line:60},endBody:{col:1,line:74}},GroupedArrayOptions:{startLoc:{col:35,line:81},endLoc:{col:1,line:95},startBody:{col:35,line:81},endBody:{col:1,line:95}},CustomOptionsAllowed:{startLoc:{col:36,line:97},endLoc:{col:1,line:112},startBody:{col:36,line:97},endBody:{col:1,line:112}},CustomLabel:{startLoc:{col:27,line:116},endLoc:{col:1,line:130},startBody:{col:27,line:116},endBody:{col:1,line:130}},CustomStateMessageHandler:{startLoc:{col:41,line:132},endLoc:{col:1,line:187},startBody:{col:41,line:132},endBody:{col:1,line:187}},HtmlAttributes:{startLoc:{col:30,line:189},endLoc:{col:1,line:205},startBody:{col:30,line:189},endBody:{col:1,line:205}},Basic:{startLoc:{col:85,line:207},endLoc:{col:1,line:248},startBody:{col:85,line:207},endBody:{col:1,line:248}}};const H=n.createElement("span",{className:"gf-form-label query-part"},n.createElement(a.J,{name:"plus"})),W=Ce=>({label:Ce,value:Ce}),oe=["Option1","Option2","OptionWithLooongLabel","Option4"].map(W),Q=Ce=>new Promise(Le=>setTimeout(()=>Le(Ce),2e3)),P=()=>new Promise((Ce,Le)=>setTimeout(()=>Le(Error("Could not find data")),2e3)),ae=({loadOptions:Ce,children:Le})=>n.createElement(n.Fragment,null,n.createElement(l.f,{label:"Segment Name"},Le,n.createElement(u,{Component:H,onChange:we=>(0,t.action)("New value added")(we),loadOptions:()=>Ce(oe)}))),q=()=>{const[Ce,Le]=(0,n.useState)(oe[0]);return n.createElement(ae,{loadOptions:()=>Q(oe)},n.createElement(u,{value:Ce,loadOptions:()=>Q(oe),onChange:we=>{Le(we),(0,t.action)("Segment value changed")(we.value)}}))},Y={title:"Data Source/Segment/SegmentAsync",component:u},ve=()=>{const[Ce,Le]=(0,n.useState)(oe[0].value);return n.createElement(ae,{loadOptions:()=>Q(oe)},n.createElement(u,{value:Ce,loadOptions:()=>Q(oe),onChange:({value:we})=>{Le(we),(0,t.action)("Segment value changed")(we)}}))},re=[{label:"Names",options:["Jane","Tom","Lisa"].map(W)},{label:"Prime",options:[2,3,5,7,11,13].map(W)}],je=()=>{const[Ce,Le]=(0,n.useState)(re[0].options[0]);return n.createElement(ae,{loadOptions:()=>Q(re)},n.createElement(u,{value:Ce,loadOptions:()=>Q(re),onChange:we=>{Le(we),(0,t.action)("Segment value changed")(we.value)}}))},me=()=>{const[Ce,Le]=(0,n.useState)(re[0].options[0]);return n.createElement(ae,{loadOptions:()=>Q(re)},n.createElement(u,{allowCustomValue:!0,value:Ce,loadOptions:()=>Q(oe),onChange:we=>{Le(we),(0,t.action)("Segment value changed")(we.value)}}))},ne=({value:Ce})=>n.createElement("div",{className:"gf-form-label"},"custom(",Ce,")"),Z=()=>{const[Ce,Le]=(0,n.useState)(re[0].options[0].value);return n.createElement(ae,{loadOptions:()=>Q(re)},n.createElement(u,{Component:n.createElement(ne,{value:Ce}),loadOptions:()=>Q(re),onChange:({value:we})=>{Le(we),(0,t.action)("Segment value changed")(we)}}))},te=()=>{const Ce=ue=>ue.loading?"You're going too fast for me, please wait...":ue.error?"Outch ! We encountered an error...":!Array.isArray(ue.value)||ue.value.length===0?"It is empty :)":"",[Le,we]=(0,n.useState)(oe[0]);return n.createElement(n.Fragment,null,n.createElement(ae,{loadOptions:()=>Q(re)},n.createElement(u,{value:Le,noOptionMessageHandler:Ce,loadOptions:()=>Q(re),onChange:({value:ue})=>{we(ue),(0,t.action)("Segment value changed")(ue)}})),n.createElement(ae,{loadOptions:()=>Q([])},n.createElement(u,{value:Le,noOptionMessageHandler:Ce,loadOptions:()=>Q([]),onChange:({value:ue})=>{we(ue),(0,t.action)("Segment value changed")(ue)}})),n.createElement(ae,{loadOptions:()=>P()},n.createElement(u,{value:Le,noOptionMessageHandler:Ce,loadOptions:()=>P(),onChange:({value:ue})=>{we(ue),(0,t.action)("Segment value changed")(ue)}})))},Pe=()=>{const[Ce,Le]=(0,n.useState)(oe[0]);return n.createElement(ae,{loadOptions:()=>Q(oe)},n.createElement(u,{"data-testid":"segment-async-test",id:"segment-async",value:Ce,loadOptions:()=>Q(oe),onChange:we=>{Le(we),(0,t.action)("Segment value changed")(we.value)}}))},he=Ce=>{const[Le,we]=(0,n.useState)(Ce.value),ue=F(K({},Ce),{value:Le,loadOptions:(Ie="")=>$(void 0,null,function*(){(0,t.action)("loadOptions fired")({query:Ie});const qe=yield Q(oe);return Ie?qe.filter(Je=>{var Ze;return(Ze=Je.label)==null?void 0:Ze.includes(Ie)}):Q(oe)}),onChange:({value:Ie})=>{we(Ie),(0,t.action)("onChange fired")(Ie)},onExpandedChange:Ie=>(0,t.action)("onExpandedChange fired")({expanded:Ie}),noOptionMessageHandler:Ie=>((0,t.action)("noOptionMessageHandler fired")(Ie),Ie.loading?"Loading...":Ie.error?"Failed to load options":!Array.isArray(Ie.value)||Ie.value.length===0?"No options found":"")});return n.createElement(l.f,{label:"Segment:"},n.createElement(u,K({},ue)))};he.parameters={controls:{exclude:["value","loadOptions","onChange","noOptionMessageHandler","Component","className","onExpandedChange"]}},he.args={inputMinWidth:0,allowCustomValue:!1,reloadOptionsOnChange:!1,placeholder:"Placeholder text",disabled:!1,autofocus:!1,allowEmptyValue:!1,inputPlaceholder:"Start typing..."};var ie=Y;q.parameters=K({storySource:{source:`() => {
  const [value, setValue] = useState<any>(options[0]);
  return (
    <SegmentFrame loadOptions={() => loadOptions(options)}>
      <SegmentAsync
        value={value}
        loadOptions={() => loadOptions(options)}
        onChange={(item) => {
          setValue(item);
          action('Segment value changed')(item.value);
        }}
      />
    </SegmentFrame>
  );
}`}},q.parameters),ve.parameters=K({storySource:{source:`() => {
  const [value, setValue] = useState(options[0].value);
  return (
    <SegmentFrame loadOptions={() => loadOptions(options)}>
      <SegmentAsync
        value={value}
        loadOptions={() => loadOptions(options)}
        onChange={({ value }) => {
          setValue(value);
          action('Segment value changed')(value);
        }}
      />
    </SegmentFrame>
  );
}`}},ve.parameters),je.parameters=K({storySource:{source:`() => {
  const [value, setValue] = useState(groupedOptions[0].options[0]);
  return (
    <SegmentFrame loadOptions={() => loadOptions(groupedOptions)}>
      <SegmentAsync
        value={value}
        loadOptions={() => loadOptions(groupedOptions)}
        onChange={(item) => {
          setValue(item);
          action('Segment value changed')(item.value);
        }}
      />
    </SegmentFrame>
  );
}`}},je.parameters),me.parameters=K({storySource:{source:`() => {
  const [value, setValue] = useState(groupedOptions[0].options[0]);
  return (
    <SegmentFrame loadOptions={() => loadOptions(groupedOptions)}>
      <SegmentAsync
        allowCustomValue
        value={value}
        loadOptions={() => loadOptions(options)}
        onChange={(item) => {
          setValue(item);
          action('Segment value changed')(item.value);
        }}
      />
    </SegmentFrame>
  );
}`}},me.parameters),Z.parameters=K({storySource:{source:`() => {
  const [value, setValue] = useState(groupedOptions[0].options[0].value);
  return (
    <SegmentFrame loadOptions={() => loadOptions(groupedOptions)}>
      <SegmentAsync
        Component={<CustomLabelComponent value={value} />}
        loadOptions={() => loadOptions(groupedOptions)}
        onChange={({ value }) => {
          setValue(value);
          action('Segment value changed')(value);
        }}
      />
    </SegmentFrame>
  );
}`}},Z.parameters),te.parameters=K({storySource:{source:`() => {
  const stateToTextFunction = (state: AsyncState<Array<SelectableValue<string>>>) => {
    if (state.loading) {
      return "You're going too fast for me, please wait...";
    }

    if (state.error) {
      return 'Outch ! We encountered an error...';
    }

    if (!Array.isArray(state.value) || state.value.length === 0) {
      return 'It is empty :)';
    }

    return '';
  };

  const [value, setValue] = useState<any>(options[0]);
  return (
    <>
      <SegmentFrame loadOptions={() => loadOptions(groupedOptions)}>
        <SegmentAsync
          value={value}
          noOptionMessageHandler={stateToTextFunction}
          loadOptions={() => loadOptions(groupedOptions)}
          onChange={({ value }) => {
            setValue(value);
            action('Segment value changed')(value);
          }}
        />
      </SegmentFrame>
      <SegmentFrame loadOptions={() => loadOptions([])}>
        <SegmentAsync
          value={value}
          noOptionMessageHandler={stateToTextFunction}
          loadOptions={() => loadOptions([])}
          onChange={({ value }) => {
            setValue(value);
            action('Segment value changed')(value);
          }}
        />
      </SegmentFrame>
      <SegmentFrame loadOptions={() => loadOptionsErr()}>
        <SegmentAsync
          value={value}
          noOptionMessageHandler={stateToTextFunction}
          loadOptions={() => loadOptionsErr()}
          onChange={({ value }) => {
            setValue(value);
            action('Segment value changed')(value);
          }}
        />
      </SegmentFrame>
    </>
  );
}`}},te.parameters),Pe.parameters=K({storySource:{source:`() => {
  const [value, setValue] = useState<any>(options[0]);
  return (
    <SegmentFrame loadOptions={() => loadOptions(options)}>
      <SegmentAsync
        data-testid="segment-async-test"
        id="segment-async"
        value={value}
        loadOptions={() => loadOptions(options)}
        onChange={(item) => {
          setValue(item);
          action('Segment value changed')(item.value);
        }}
      />
    </SegmentFrame>
  );
}`}},Pe.parameters),he.parameters=K({storySource:{source:`(
  args: SegmentAsyncProps<string>
) => {
  const [value, setValue] = useState(args.value);

  const props: SegmentAsyncProps<string> = {
    ...args,
    value,
    loadOptions: async (query = '') => {
      action('loadOptions fired')({ query });
      const result = await loadOptions(options);
      if (query) {
        return result.filter((data) => data.label?.includes(query));
      }
      return loadOptions(options);
    },
    onChange: ({ value }) => {
      setValue(value);
      action('onChange fired')(value);
    },
    onExpandedChange: (expanded) => action('onExpandedChange fired')({ expanded }),
    noOptionMessageHandler: (state) => {
      action('noOptionMessageHandler fired')(state);
      if (state.loading) {
        return 'Loading...';
      }
      if (state.error) {
        return 'Failed to load options';
      }
      if (!Array.isArray(state.value) || state.value.length === 0) {
        return 'No options found';
      }
      return '';
    },
  };

  return (
    <SegmentSection label="Segment:">
      <SegmentAsync<string> {...props} />
    </SegmentSection>
  );
}`}},he.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Segment/SegmentAsync.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Segment/SegmentAsync.story.tsx#ComponentMeta"})}catch(Ce){}},"./src/components/Segment/SegmentInput.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return P},BasicInput:function(){return R},BasicInputWithHtmlAttributes:function(){return W},BasicInputWithPlaceholder:function(){return H},InputWithAutoFocus:function(){return Q},default:function(){return ae}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/components/Segment/SegmentSection.tsx"),l=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),f=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/lib/useClickAway.js"),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/utils/measureText.ts"),i=e("./src/components/Forms/InlineLabel.tsx"),c=e("./src/components/Segment/styles.ts"),E=e("./src/components/Segment/useExpandableLabel.tsx"),O=Object.defineProperty,m=Object.defineProperties,w=Object.getOwnPropertyDescriptors,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(q,Y,ve)=>Y in q?O(q,Y,{enumerable:!0,configurable:!0,writable:!0,value:ve}):q[Y]=ve,v=(q,Y)=>{for(var ve in Y||(Y={}))C.call(Y,ve)&&g(q,ve,Y[ve]);if(_)for(var ve of _(Y))b.call(Y,ve)&&g(q,ve,Y[ve]);return q},y=(q,Y)=>m(q,w(Y)),h=(q,Y)=>{var ve={};for(var re in q)C.call(q,re)&&Y.indexOf(re)<0&&(ve[re]=q[re]);if(q!=null&&_)for(var re of _(q))Y.indexOf(re)<0&&b.call(q,re)&&(ve[re]=q[re]);return ve};const s=14;function o(q){var Y=q,{value:ve,onChange:re,Component:je,className:me,placeholder:ne,inputPlaceholder:Z,disabled:te,autofocus:Pe=!1,onExpandedChange:he}=Y,ie=h(Y,["value","onChange","Component","className","placeholder","inputPlaceholder","disabled","autofocus","onExpandedChange"]);const Ce=(0,n.useRef)(null),[Le,we]=(0,n.useState)(ve),[ue,Ie]=(0,n.useState)((0,d.X1)((ve||"").toString(),s).width),[qe,,Je,Ze]=(0,E._)(Pe,he),Oe=(0,x.wW)(c.N);if((0,f.Z)(Ce,()=>{Ze(!1),re(Le)}),!Je)return n.createElement(qe,{disabled:te,Component:je||n.createElement(i.W,{className:(0,l.cx)(Oe.segment,{[Oe.queryPlaceholder]:ne!==void 0&&!Le,[Oe.disabled]:te},me)},ve||ne)});const ce=l.iv`
    width: ${Math.max(ue+20,32)}px;
  `;return n.createElement("input",y(v({},ie),{ref:Ce,autoFocus:!0,className:(0,l.cx)("gf-form gf-form-input",ce),value:Le,placeholder:Z,onChange:pe=>{const{width:J}=(0,d.X1)(pe.target.value,s);Ie(J),we(pe.target.value)},onBlur:()=>{Ze(!1),re(Le)},onKeyDown:pe=>{[13,27].includes(pe.keyCode)&&(Ze(!1),re(Le))}}))}try{o.displayName="SegmentInput",o.__docgenInfo={description:"",displayName:"SegmentInput",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string | number"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(text: string | number) => void"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},Component:{defaultValue:null,description:"",name:"Component",required:!1,type:{name:"ReactElement<any, string | JSXElementConstructor<any>>"}},onExpandedChange:{defaultValue:null,description:"",name:"onExpandedChange",required:!1,type:{name:"((expanded: boolean) => void)"}},autofocus:{defaultValue:{value:"false"},description:"",name:"autofocus",required:!1,type:{name:"boolean"}},inputPlaceholder:{defaultValue:null,description:"",name:"inputPlaceholder",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Segment/SegmentInput.tsx#SegmentInput"]={docgenInfo:o.__docgenInfo,name:"SegmentInput",path:"src/components/Segment/SegmentInput.tsx#SegmentInput"})}catch(q){}var r=e("./src/components/Icon/Icon.tsx"),u=Object.defineProperty,p=Object.defineProperties,S=Object.getOwnPropertyDescriptors,k=Object.getOwnPropertySymbols,D=Object.prototype.hasOwnProperty,M=Object.prototype.propertyIsEnumerable,I=(q,Y,ve)=>Y in q?u(q,Y,{enumerable:!0,configurable:!0,writable:!0,value:ve}):q[Y]=ve,T=(q,Y)=>{for(var ve in Y||(Y={}))D.call(Y,ve)&&I(q,ve,Y[ve]);if(k)for(var ve of k(Y))M.call(Y,ve)&&I(q,ve,Y[ve]);return q},j=(q,Y)=>p(q,S(Y)),K=null,F={BasicInput:{startLoc:{col:26,line:15},endLoc:{col:1,line:28},startBody:{col:26,line:15},endBody:{col:1,line:28}},BasicInputWithPlaceholder:{startLoc:{col:41,line:35},endLoc:{col:1,line:49},startBody:{col:41,line:35},endBody:{col:1,line:49}},BasicInputWithHtmlAttributes:{startLoc:{col:44,line:51},endLoc:{col:1,line:66},startBody:{col:44,line:51},endBody:{col:1,line:66}},InputWithAutoFocus:{startLoc:{col:34,line:83},endLoc:{col:1,line:101},startBody:{col:34,line:83},endBody:{col:1,line:101}},Basic:{startLoc:{col:94,line:103},endLoc:{col:1,line:123},startBody:{col:94,line:103},endBody:{col:1,line:123}}};const $=({children:q})=>n.createElement(n.Fragment,null,n.createElement(a.f,{label:"Segment Name"},q)),R=()=>{const[q,Y]=(0,n.useState)("some text");return n.createElement($,null,n.createElement(o,{value:q,onChange:ve=>{Y(ve),(0,t.action)("Segment value changed")(ve)}}))},U={title:"Data Source/Segment/SegmentInput",component:o},H=()=>{const[q,Y]=(0,n.useState)("");return n.createElement($,null,n.createElement(o,{placeholder:"add text",value:q,onChange:ve=>{Y(ve),(0,t.action)("Segment value changed")(ve)}}))},W=()=>{const[q,Y]=(0,n.useState)("some text");return n.createElement($,null,n.createElement(o,{"data-testid":"segment-input-test",id:"segment-input",value:q,onChange:ve=>{Y(ve),(0,t.action)("Segment value changed")(ve)}}))},oe=({initialValue:q})=>{const[Y,ve]=(0,n.useState)(q);return n.createElement(o,{placeholder:"add text",autofocus:!0,value:Y,onChange:re=>{ve(re),(0,t.action)("Segment value changed")(re)}})},Q=()=>{const[q,Y]=(0,n.useState)([]);return n.createElement($,null,q.map((ve,re)=>n.createElement(ve,{initialValue:"test",key:re})),n.createElement("button",{type:"button",className:"gf-form-label query-part",onClick:()=>{Y([...q,oe])}},n.createElement(r.J,{name:"plus"})))},P=q=>{const[Y,ve]=(0,n.useState)(q.value),re=j(T({},q),{value:Y,onChange:je=>{ve(je),(0,t.action)("onChange fired")({value:je})},onExpandedChange:je=>(0,t.action)("onExpandedChange fired")({expanded:je})});return n.createElement(a.f,{label:"Segment:"},n.createElement(o,T({},re)))};P.parameters={controls:{exclude:["value","onChange","Component","className","onExpandedChange"]}},P.args={value:"Initial input value",placeholder:"Placeholder text",disabled:!1,autofocus:!1,inputPlaceholder:"Start typing..."};var ae=U;R.parameters=T({storySource:{source:`() => {
  const [value, setValue] = useState('some text');
  return (
    <SegmentFrame>
      <SegmentInput
        value={value}
        onChange={(text) => {
          setValue(text as string);
          action('Segment value changed')(text);
        }}
      />
    </SegmentFrame>
  );
}`}},R.parameters),H.parameters=T({storySource:{source:`() => {
  const [value, setValue] = useState('');
  return (
    <SegmentFrame>
      <SegmentInput
        placeholder="add text"
        value={value}
        onChange={(text) => {
          setValue(text as string);
          action('Segment value changed')(text);
        }}
      />
    </SegmentFrame>
  );
}`}},H.parameters),W.parameters=T({storySource:{source:`() => {
  const [value, setValue] = useState('some text');
  return (
    <SegmentFrame>
      <SegmentInput
        data-testid="segment-input-test"
        id="segment-input"
        value={value}
        onChange={(text) => {
          setValue(text as string);
          action('Segment value changed')(text);
        }}
      />
    </SegmentFrame>
  );
}`}},W.parameters),Q.parameters=T({storySource:{source:`() => {
  const [inputComponents, setInputComponents] = useState<any>([]);
  return (
    <SegmentFrame>
      {inputComponents.map((InputComponent: any, i: number) => (
        <InputComponent initialValue="test" key={i} />
      ))}
      <button
        type="button"
        className="gf-form-label query-part"
        onClick={() => {
          setInputComponents([...inputComponents, InputComponent]);
        }}
      >
        <Icon name="plus" />
      </button>
    </SegmentFrame>
  );
}`}},Q.parameters),P.parameters=T({storySource:{source:`(
  args: SegmentInputProps<string | number>
) => {
  const [value, setValue] = useState(args.value);

  const props: SegmentInputProps<string | number> = {
    ...args,
    value,
    onChange: (value) => {
      setValue(value);
      action('onChange fired')({ value });
    },
    onExpandedChange: (expanded) => action('onExpandedChange fired')({ expanded }),
  };

  return (
    <SegmentSection label="Segment:">
      <SegmentInput<string | number> {...props} />
    </SegmentSection>
  );
}`}},P.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Segment/SegmentInput.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Segment/SegmentInput.story.tsx#ComponentMeta"})}catch(q){}},"./src/components/Select/Select.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{AutoMenuPlacement:function(){return W},Basic:function(){return I},BasicSelectAsync:function(){return H},BasicSelectPlainValue:function(){return j},BasicVirtualizedList:function(){return T},CustomValueCreation:function(){return Q},MultiPlainValue:function(){return F},MultiSelectAsync:function(){return U},MultiSelectBasic:function(){return R},MultiSelectWithOptionGroups:function(){return $},SelectWithOptionDescriptions:function(){return K},WidthAuto:function(){return oe},default:function(){return P}});var t=e("../../../yarn/cache/@popperjs-core-npm-2.11.6-5bcdc104bd-47fb328cec.zip/node_modules/@popperjs/core/lib/enums.js"),n=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts"),f=e("./src/components/Select/Select.tsx"),x=e("./src/components/Icon/Icon.tsx"),d=e("./src/types/icon.ts"),i=e("./src/utils/storybook/withCenteredStory.tsx"),c=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),E=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),O=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function m(ae){const q=Object.assign({h1:"h1",p:"p",code:"code",ul:"ul",li:"li",h2:"h2",h3:"h3",strong:"strong",pre:"pre"},(0,E.ah)(),ae.components);return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(q.h1,{children:"Select variants"}),`
`,(0,c.jsxs)(q.p,{children:["Select is an input with the ability to search and create new values. It should be used when you have a list of options. If the data has a tree structure, consider using ",(0,c.jsx)(q.code,{children:"Cascader"}),` instead.
Select has some features:`]}),`
`,(0,c.jsxs)(q.ul,{children:[`
`,(0,c.jsx)(q.li,{children:"Search a list of values"}),`
`,(0,c.jsx)(q.li,{children:"Select multiple values"}),`
`,(0,c.jsx)(q.li,{children:"Select from async data"}),`
`,(0,c.jsx)(q.li,{children:"Create custom values that aren't in the list"}),`
`]}),`
`,(0,c.jsx)(q.h2,{children:"Select"}),`
`,(0,c.jsxs)(q.p,{children:["Select is the base for every component on this page. The approaches mentioned here are also applicable to ",(0,c.jsx)(q.code,{children:"AsyncSelect"}),", ",(0,c.jsx)(q.code,{children:"MultiSelect"}),", ",(0,c.jsx)(q.code,{children:"AsyncMultiSelect"}),"."]}),`
`,(0,c.jsx)(q.h3,{children:"Options format"}),`
`,(0,c.jsx)(q.p,{children:"There are four properties for each option:"}),`
`,(0,c.jsxs)(q.ul,{children:[`
`,(0,c.jsxs)(q.li,{children:[(0,c.jsx)(q.code,{children:"label"})," - Text that is visible in the menu."]}),`
`,(0,c.jsxs)(q.li,{children:[(0,c.jsx)(q.code,{children:"value"})," - Could be anything, but is usually a string. Used to identify what is ",(0,c.jsx)(q.strong,{children:"actually"})," selected."]}),`
`,(0,c.jsxs)(q.li,{children:[(0,c.jsx)(q.code,{children:"description"})," - Longer description that describes the choice. Use this sparingly."]}),`
`,(0,c.jsxs)(q.li,{children:[(0,c.jsx)(q.code,{children:"imgUrl"})," - URL to an image. Use this when an image or icon provides more context for the option."]}),`
`]}),`
`,(0,c.jsx)(q.pre,{children:(0,c.jsx)(q.code,{className:"language-jsx",children:`const options = [
  { label: 'Basic option', value: 0 },
  { label: 'Option with description', value: 1, description: 'this is a description' },
  {
    label: 'Option with description and image',
    value: 2,
    description: 'This is a very elaborate description, describing all the wonders in the world.',
    imgUrl: 'https://placekitten.com/40/40',
  },
];
`})}),`
`,(0,c.jsx)(q.h3,{children:"Creatable option"}),`
`,(0,c.jsxs)(q.p,{children:["Creatable option is used when you want to be able to add a custom value to the list of options. ",(0,c.jsx)(q.code,{children:"allowCustomValue"})," needs to be true and you must handle the value creation with ",(0,c.jsx)(q.code,{children:"onCreateOption"}),"."]}),`
`,(0,c.jsx)(q.pre,{children:(0,c.jsx)(q.code,{className:"language-jsx",children:`import { Select } from "@grafana/ui";

const SelectComponent = () => {
  const [value, setValue] = useState<SelectableValue<number>>();

  return (
    <Select
      options={option}
      value={value}
      allowCustomValue
      onCreateOption={customValue => {
        setValue(customValue);
      }}
    />
  );
};
`})}),`
`,(0,c.jsx)(q.h2,{children:"AsyncSelect"}),`
`,(0,c.jsxs)(q.p,{children:["Like regular Select, but handles fetching options asynchronously. Use the ",(0,c.jsx)(q.code,{children:"loadOptions"})," prop for the async function that loads the options. If ",(0,c.jsx)(q.code,{children:"defaultOptions"})," is set to ",(0,c.jsx)(q.code,{children:"true"}),", ",(0,c.jsx)(q.code,{children:"loadOptions"})," will be called when the component is mounted."]}),`
`,(0,c.jsx)(q.pre,{children:(0,c.jsx)(q.code,{className:"language-jsx",children:`
import { AsyncSelect } from '@grafana/ui';

const basicSelectAsync = () => {
  const [value, setValue] = useState<SelectableValue<string>>();

  return (
    <AsyncSelect
      loadOptions={loadAsyncOptions}
      defaultOptions
      value={value}
      onChange={v => {
        setValue(v);
      }}
    />
  );
};

`})}),`
`,(0,c.jsx)(q.p,{children:"Where the async function could look like this:"}),`
`,(0,c.jsx)(q.pre,{children:(0,c.jsx)(q.code,{className:"language-tsx",children:`const loadAsyncOptions = () => {
  return new Promise<Array<SelectableValue<string>>>((resolve) => {
    setTimeout(() => {
      resolve(options);
    }, 2000);
  });
};
`})}),`
`,(0,c.jsx)(q.h2,{children:"MultiSelect"}),`
`,(0,c.jsx)(q.p,{children:"Possible to Select multiple values at the same time."}),`
`,(0,c.jsx)(q.pre,{children:(0,c.jsx)(q.code,{className:"language-tsx",children:`import { MultiSelect } from '@grafana/ui';

const multiSelect = () => {
  const [value, setValue] = useState<Array<SelectableValue<string>>>([]);

  return (
    <>
      <MultiSelect
        options={options}
        value={value}
        onChange={(v) => {
          setValue(v);
        }}
      />
    </>
  );
};
`})}),`
`,(0,c.jsx)(q.h2,{children:"AsyncMultiSelect"}),`
`,(0,c.jsxs)(q.p,{children:["Like MultiSelect but handles data asynchronously with the ",(0,c.jsx)(q.code,{children:"loadOptions"})," prop."]}),`
`,(0,c.jsx)(q.h1,{children:"Testing"}),`
`,(0,c.jsxs)(q.p,{children:["Using React Testing Library, you can select the ",(0,c.jsx)(q.code,{children:"<Select />"})," using its matching label, such as the label assigned with the ",(0,c.jsx)(q.code,{children:"inputId"})," prop. Use the ",(0,c.jsx)(q.code,{children:"react-select-event"})," package to select values from the options."]}),`
`,(0,c.jsx)(q.pre,{children:(0,c.jsx)(q.code,{className:"language-tsx",children:`import { render, screen } from '@testing-library/react';
import selectEvent from 'react-select-event';
import { Select } from '@grafana/ui';

it('should call onChange', () => {
  const onChange = jest.fn();

  render(
    <>
      <label htmlFor="my-select">My select</label>
      <Select onChange={onChange} options={options} inputId="my-select" />
    </>
  );

  const selectEl = screen.getByLabelText('My select');
  expect(selectEl).toBeInTheDocument();

  await selectEvent.select(selectEl, 'Option 2', { container: document.body });
  expect(onChange).toHaveBeenCalledWith({
    label: 'Option 2',
    value: 2,
  });
});
`})}),`
`,(0,c.jsx)(q.h1,{children:"Props"}),`
`,(0,c.jsx)(O.xP,{of:f.Ph})]})}function w(ae={}){const{wrapper:q}=Object.assign({},(0,E.ah)(),ae.components);return q?(0,c.jsx)(q,Object.assign({},ae,{children:(0,c.jsx)(m,ae)})):m(ae)}var _=w,C=e("./src/components/Select/mockOptions.tsx"),b=Object.defineProperty,g=Object.defineProperties,v=Object.getOwnPropertyDescriptors,y=Object.getOwnPropertySymbols,h=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,o=(ae,q,Y)=>q in ae?b(ae,q,{enumerable:!0,configurable:!0,writable:!0,value:Y}):ae[q]=Y,r=(ae,q)=>{for(var Y in q||(q={}))h.call(q,Y)&&o(ae,Y,q[Y]);if(y)for(var Y of y(q))s.call(q,Y)&&o(ae,Y,q[Y]);return ae},u=(ae,q)=>g(ae,v(q)),p=null,S={Basic:{startLoc:{col:40,line:91},endLoc:{col:1,line:107},startBody:{col:40,line:91},endBody:{col:1,line:107}},BasicVirtualizedList:{startLoc:{col:55,line:108},endLoc:{col:1,line:125},startBody:{col:55,line:108},endBody:{col:1,line:125}},BasicSelectPlainValue:{startLoc:{col:56,line:129},endLoc:{col:1,line:145},startBody:{col:56,line:129},endBody:{col:1,line:145}},SelectWithOptionDescriptions:{startLoc:{col:51,line:149},endLoc:{col:1,line:178},startBody:{col:51,line:149},endBody:{col:1,line:178}},MultiPlainValue:{startLoc:{col:38,line:183},endLoc:{col:1,line:199},startBody:{col:38,line:183},endBody:{col:1,line:199}},MultiSelectWithOptionGroups:{startLoc:{col:50,line:201},endLoc:{col:1,line:221},startBody:{col:50,line:201},endBody:{col:1,line:221}},MultiSelectBasic:{startLoc:{col:39,line:223},endLoc:{col:1,line:240},startBody:{col:39,line:223},endBody:{col:1,line:240}},MultiSelectAsync:{startLoc:{col:39,line:247},endLoc:{col:1,line:263},startBody:{col:39,line:247},endBody:{col:1,line:263}},BasicSelectAsync:{startLoc:{col:39,line:268},endLoc:{col:1,line:284},startBody:{col:39,line:268},endBody:{col:1,line:284}},AutoMenuPlacement:{startLoc:{col:40,line:286},endLoc:{col:1,line:305},startBody:{col:40,line:286},endBody:{col:1,line:305}},WidthAuto:{startLoc:{col:32,line:310},endLoc:{col:1,line:330},startBody:{col:32,line:310},endBody:{col:1,line:330}},CustomValueCreation:{startLoc:{col:42,line:332},endLoc:{col:1,line:357},startBody:{col:42,line:332},endBody:{col:1,line:357}}};const k={title:"Forms/Select",component:f.Ph,decorators:[i.BU,i.zT],subcomponents:{AsyncSelect:f.qb,MultiSelect:f.NU,AsyncMultiSelect:f.M8},parameters:{docs:{page:_},controls:{exclude:["getOptionValue","getOptionLabel","formatCreateLabel","filterOption","className","components","defaultValue","id","inputId","onBlur","onChange","onCloseMenu","onCreateOption","onInputChange","onKeyDown","onOpenMenu","prefix","renderControl","options","isOptionDisabled","maxVisibleValues","aria-label","noOptionsMessage","menuPosition","isValidNewOption","value"]}},args:{width:0,disabled:!1,isLoading:!1,invalid:!1,icon:"arrow-down"},argTypes:{width:{control:{type:"range",min:1,max:100}},icon:{control:{type:"select",options:(0,d.BI)()}}}},D=()=>new Promise(ae=>{setTimeout(()=>{ae((0,C.u)())},2e3)}),M=ae=>{var q;return a.createElement(x.J,{name:(q=(0,l.iJ)(ae))!=null?q:"question-circle"})},I=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(a.Fragment,null,a.createElement(f.Ph,r({options:(0,C.u)(),value:q,onChange:ve=>{Y(ve),(0,n.action)("onChange")(ve)}},ae)))},T=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(a.Fragment,null,a.createElement(f.Ph,r({options:(0,C.R)(),virtualized:!0,value:q,onChange:ve=>{Y(ve),(0,n.action)("onChange")(ve)}},ae)))},j=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(a.Fragment,null,a.createElement(f.Ph,r({options:(0,C.u)(),value:q,onChange:ve=>{Y(ve.value),(0,n.action)("onChange")(ve)},prefix:M(ae.icon)},ae)))},K=ae=>{const[q,Y]=(0,a.useState)(),ve=[{label:"Basic option",value:0},{label:"Option with description",value:1,description:"this is a description"},{label:"Option with description and image",value:2,description:"This is a very elaborate description, describing all the wonders in the world.",imgUrl:"https://placekitten.com/40/40"}];return a.createElement(a.Fragment,null,a.createElement(f.Ph,r({options:ve,value:q,onChange:re=>{Y(re.value),(0,n.action)("onChange")(re)},prefix:M(ae.icon)},ae)))},F=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(a.Fragment,null,a.createElement(f.NU,r({options:(0,C.u)(),value:q,onChange:ve=>{Y(ve.map(re=>re.value))},prefix:M(ae.icon)},ae)))},$=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(a.Fragment,null,a.createElement(f.NU,r({options:[{label:"1",value:"1"},{label:"2",value:"2",options:[{label:"5",value:"5"}]}],value:q,onChange:ve=>{Y(ve.map(re=>re.value)),(0,n.action)("onChange")(ve)},prefix:M(ae.icon)},ae)))},R=ae=>{const[q,Y]=(0,a.useState)([]);return a.createElement(a.Fragment,null,a.createElement(f.NU,r({options:(0,C.u)(),value:q,onChange:ve=>{Y(ve),(0,n.action)("onChange")(ve)},prefix:M(ae.icon)},ae)))};R.args={isClearable:!1,closeMenuOnSelect:!1,maxVisibleValues:5};const U=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(f.M8,r({loadOptions:D,defaultOptions:!0,value:q,onChange:ve=>{Y(ve),(0,n.action)("onChange")(ve)},prefix:M(ae.icon)},ae))};U.args={allowCustomValue:!1};const H=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(f.qb,r({loadOptions:D,defaultOptions:!0,value:q,onChange:ve=>{Y(ve),(0,n.action)("onChange")(ve)},prefix:M(ae.icon)},ae))},W=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(a.Fragment,null,a.createElement("div",{style:{width:"100%",height:"95vh",display:"flex",alignItems:"flex-end"}},a.createElement(f.Ph,r({options:(0,C.u)(),value:q,onChange:ve=>{Y(ve),(0,n.action)("onChange")(ve)},prefix:M(ae.icon)},ae))))};W.args={menuPlacement:t.d7};const oe=ae=>{const[q,Y]=(0,a.useState)();return a.createElement(a.Fragment,null,a.createElement("div",{style:{width:"100%"}},a.createElement(f.Ph,u(r({options:(0,C.u)(),value:q,onChange:ve=>{Y(ve),(0,n.action)("onChange")(ve)},prefix:M(ae.icon)},ae),{width:"auto"}))))},Q=ae=>{const[q,Y]=(0,a.useState)(),[ve,re]=(0,a.useState)([]),je=(0,C.u)();return a.createElement(a.Fragment,null,a.createElement(f.Ph,r({options:[...je,...ve],value:q,onChange:me=>{Y(me),(0,n.action)("onChange")(me)},allowCustomValue:ae.allowCustomValue,onCreateOption:me=>{const ne={value:me,label:me};re([...ve,ne]),Y(ne),(0,n.action)("onCreateOption")(me)},prefix:M(ae.icon)},ae)))};Q.args={allowCustomValue:!0};var P=k;I.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<SelectableValue<string>>();

  return (
    <>
      <Select
        options={generateOptions()}
        value={value}
        onChange={(v) => {
          setValue(v);
          action('onChange')(v);
        }}
        {...args}
      />
    </>
  );
}`}},I.parameters),T.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<SelectableValue<string>>();

  return (
    <>
      <Select
        options={generateThousandsOfOptions()}
        virtualized
        value={value}
        onChange={(v) => {
          setValue(v);
          action('onChange')(v);
        }}
        {...args}
      />
    </>
  );
}`}},T.parameters),j.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<string>();
  return (
    <>
      <Select
        options={generateOptions()}
        value={value}
        onChange={(v) => {
          setValue(v.value);
          action('onChange')(v);
        }}
        prefix={getPrefix(args.icon)}
        {...args}
      />
    </>
  );
}`}},j.parameters),K.parameters=r({storySource:{source:`(args) => {
  // TODO this is not working with new Select

  const [value, setValue] = useState<number>();
  const options = [
    { label: 'Basic option', value: 0 },
    { label: 'Option with description', value: 1, description: 'this is a description' },
    {
      label: 'Option with description and image',
      value: 2,
      description: 'This is a very elaborate description, describing all the wonders in the world.',
      imgUrl: 'https://placekitten.com/40/40',
    },
  ];

  return (
    <>
      <Select
        options={options}
        value={value}
        onChange={(v) => {
          setValue(v.value);
          action('onChange')(v);
        }}
        prefix={getPrefix(args.icon)}
        {...args}
      />
    </>
  );
}`}},K.parameters),F.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<string[]>();

  return (
    <>
      <MultiSelect
        options={generateOptions()}
        value={value}
        onChange={(v) => {
          setValue(v.map((v: any) => v.value));
        }}
        prefix={getPrefix(args.icon)}
        {...args}
      />
    </>
  );
}`}},F.parameters),$.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<string[]>();

  return (
    <>
      <MultiSelect
        options={[
          { label: '1', value: '1' },
          { label: '2', value: '2', options: [{ label: '5', value: '5' }] },
        ]}
        value={value}
        onChange={(v) => {
          setValue(v.map((v: any) => v.value));
          action('onChange')(v);
        }}
        prefix={getPrefix(args.icon)}
        {...args}
      />
    </>
  );
}`}},$.parameters),R.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<Array<SelectableValue<string>>>([]);

  return (
    <>
      <MultiSelect
        options={generateOptions()}
        value={value}
        onChange={(v) => {
          setValue(v);
          action('onChange')(v);
        }}
        prefix={getPrefix(args.icon)}
        {...args}
      />
    </>
  );
}`}},R.parameters),U.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<Array<SelectableValue<string>>>();

  return (
    <AsyncMultiSelect
      loadOptions={loadAsyncOptions}
      defaultOptions
      value={value}
      onChange={(v) => {
        setValue(v);
        action('onChange')(v);
      }}
      prefix={getPrefix(args.icon)}
      {...args}
    />
  );
}`}},U.parameters),H.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<SelectableValue<string>>();

  return (
    <AsyncSelect
      loadOptions={loadAsyncOptions}
      defaultOptions
      value={value}
      onChange={(v) => {
        setValue(v);
        action('onChange')(v);
      }}
      prefix={getPrefix(args.icon)}
      {...args}
    />
  );
}`}},H.parameters),W.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<SelectableValue<string>>();

  return (
    <>
      <div style={{ width: '100%', height: '95vh', display: 'flex', alignItems: 'flex-end' }}>
        <Select
          options={generateOptions()}
          value={value}
          onChange={(v) => {
            setValue(v);
            action('onChange')(v);
          }}
          prefix={getPrefix(args.icon)}
          {...args}
        />
      </div>
    </>
  );
}`}},W.parameters),oe.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<SelectableValue<string>>();

  return (
    <>
      <div style={{ width: '100%' }}>
        <Select
          options={generateOptions()}
          value={value}
          onChange={(v) => {
            setValue(v);
            action('onChange')(v);
          }}
          prefix={getPrefix(args.icon)}
          {...args}
          width="auto"
        />
      </div>
    </>
  );
}`}},oe.parameters),Q.parameters=r({storySource:{source:`(args) => {
  const [value, setValue] = useState<SelectableValue<string>>();
  const [customOptions, setCustomOptions] = useState<Array<SelectableValue<string>>>([]);
  const options = generateOptions();
  return (
    <>
      <Select
        options={[...options, ...customOptions]}
        value={value}
        onChange={(v) => {
          setValue(v);
          action('onChange')(v);
        }}
        allowCustomValue={args.allowCustomValue}
        onCreateOption={(v) => {
          const customValue: SelectableValue<string> = { value: v, label: v };
          setCustomOptions([...customOptions, customValue]);
          setValue(customValue);
          action('onCreateOption')(v);
        }}
        prefix={getPrefix(args.icon)}
        {...args}
      />
    </>
  );
}`}},Q.parameters);try{j.displayName="BasicSelectPlainValue",j.__docgenInfo={description:"Uses plain values instead of SelectableValue<T>",displayName:"BasicSelectPlainValue",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.story.tsx#BasicSelectPlainValue"]={docgenInfo:j.__docgenInfo,name:"BasicSelectPlainValue",path:"src/components/Select/Select.story.tsx#BasicSelectPlainValue"})}catch(ae){}try{K.displayName="SelectWithOptionDescriptions",K.__docgenInfo={description:"Uses plain values instead of SelectableValue<T>",displayName:"SelectWithOptionDescriptions",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.story.tsx#SelectWithOptionDescriptions"]={docgenInfo:K.__docgenInfo,name:"SelectWithOptionDescriptions",path:"src/components/Select/Select.story.tsx#SelectWithOptionDescriptions"})}catch(ae){}try{F.displayName="MultiPlainValue",F.__docgenInfo={description:"Uses plain values instead of SelectableValue<T>",displayName:"MultiPlainValue",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.story.tsx#MultiPlainValue"]={docgenInfo:F.__docgenInfo,name:"MultiPlainValue",path:"src/components/Select/Select.story.tsx#MultiPlainValue"})}catch(ae){}try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Select/Select.story.tsx#Meta"})}catch(ae){}},"./src/components/Slider/RangeSlider.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return T},Vertical:function(){return j},default:function(){return K}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("../../.yarn/__virtual__/@emotion-react-virtual-b3c85744cb/2/yarn/cache/@emotion-react-npm-11.10.6-655b70ad8d-4762042e39.zip/node_modules/@emotion/react/dist/emotion-react.browser.esm.js"),l=e("../../.yarn/__virtual__/rc-slider-virtual-872a602656/2/yarn/cache/rc-slider-npm-10.1.1-badf105b39-8df66142f1.zip/node_modules/rc-slider/es/index.js"),f=e("./src/themes/ThemeContext.tsx"),x=e("../../.yarn/__virtual__/rc-tooltip-virtual-4ca352178a/2/yarn/cache/rc-tooltip-npm-5.3.1-a31ddddf92-93a99dd8f8.zip/node_modules/rc-tooltip/es/index.js"),d=Object.defineProperty,i=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable,O=(F,$,R)=>$ in F?d(F,$,{enumerable:!0,configurable:!0,writable:!0,value:R}):F[$]=R,m=(F,$)=>{for(var R in $||($={}))c.call($,R)&&O(F,R,$[R]);if(i)for(var R of i($))E.call($,R)&&O(F,R,$[R]);return F},w=(F,$)=>{var R={};for(var U in F)c.call(F,U)&&$.indexOf(U)<0&&(R[U]=F[U]);if(F!=null&&i)for(var U of i(F))$.indexOf(U)<0&&E.call(F,U)&&(R[U]=F[U]);return R};const _=F=>{const $=F,{value:R,children:U,visible:H,placement:W,tipFormatter:oe}=$,Q=w($,["value","children","visible","placement","tipFormatter"]),P=(0,t.useRef)(),ae=(0,t.useRef)(null),q=(0,f.wW)(C);function Y(){ae.current!==null&&cancelAnimationFrame(ae.current)}function ve(){ae.current=requestAnimationFrame(()=>{var re,je;(je=(re=P.current)==null?void 0:re.forcePopupAlign)==null||je.call(re)})}return(0,t.useEffect)(()=>(H?ve():Y(),Y),[R,H]),t.createElement(x.Z,m({overlayClassName:q.tooltip,placement:W,overlay:oe!=null?oe:R,overlayInnerStyle:{minHeight:"auto"},ref:P,visible:H},Q),U)},C=F=>({tooltip:(0,n.iv)({position:"absolute",display:"block",visibility:"visible",fontSize:F.typography.bodySmall.fontSize,opacity:.9,padding:3})});var b=_;try{_.displayName="HandleTooltip",_.__docgenInfo={description:"",displayName:"HandleTooltip",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"number"}},visible:{defaultValue:null,description:"",name:"visible",required:!0,type:{name:"boolean"}},placement:{defaultValue:null,description:"",name:"placement",required:!0,type:{name:"enum",value:[{value:'"top"'},{value:'"right"'}]}},tipFormatter:{defaultValue:null,description:"",name:"tipFormatter",required:!1,type:{name:"((value: number) => ReactNode)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Slider/HandleTooltip.tsx#HandleTooltip"]={docgenInfo:_.__docgenInfo,name:"HandleTooltip",path:"src/components/Slider/HandleTooltip.tsx#HandleTooltip"})}catch(F){}var g=e("./src/components/Slider/styles.ts");const v=({min:F,max:$,onChange:R,onAfterChange:U,orientation:H="horizontal",reverse:W,step:oe,formatTooltipResult:Q,value:P,tooltipAlwaysVisible:ae=!0})=>{const q=(0,t.useCallback)(ne=>{const Z=typeof ne=="number"?[ne,ne]:ne;R==null||R(Z)},[R]),Y=(0,t.useCallback)(ne=>{const Z=typeof ne=="number"?[ne,ne]:ne;U==null||U(Z)},[U]),ve=H==="horizontal",re=(0,f.l4)(),je=(0,g.W)(re,ve),me=(ne,Z)=>t.createElement(b,{value:Z.value,visible:ae||Z.dragging,tipFormatter:Q,placement:ve?"top":"right"},ne);return t.createElement("div",{className:(0,n.cx)(je.container,je.slider)},t.createElement(a.xB,{styles:je.tooltip}),t.createElement(l.Z,{min:F,max:$,step:oe,defaultValue:P,range:!0,onChange:q,onAfterChange:Y,vertical:!ve,reverse:W,handleRender:me}))};v.displayName="RangeSlider";try{v.displayName="RangeSlider",v.__docgenInfo={description:"",displayName:"RangeSlider",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) => string | number)"}},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:{value:"true"},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!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Slider/RangeSlider.tsx#RangeSlider"]={docgenInfo:v.__docgenInfo,name:"RangeSlider",path:"src/components/Slider/RangeSlider.tsx#RangeSlider"})}catch(F){}var y=Object.defineProperty,h=Object.defineProperties,s=Object.getOwnPropertyDescriptors,o=Object.getOwnPropertySymbols,r=Object.prototype.hasOwnProperty,u=Object.prototype.propertyIsEnumerable,p=(F,$,R)=>$ in F?y(F,$,{enumerable:!0,configurable:!0,writable:!0,value:R}):F[$]=R,S=(F,$)=>{for(var R in $||($={}))r.call($,R)&&p(F,R,$[R]);if(o)for(var R of o($))u.call($,R)&&p(F,R,$[R]);return F},k=(F,$)=>h(F,s($)),D=null,M={Basic:{startLoc:{col:57,line:27},endLoc:{col:1,line:33},startBody:{col:57,line:27},endBody:{col:1,line:33}},Vertical:{startLoc:{col:60,line:35},endLoc:{col:1,line:41},startBody:{col:60,line:35},endBody:{col:1,line:41}}};const I={title:"Forms/Slider/Range",component:v,parameters:{controls:{exclude:["tooltipAlwaysVisible"]}},argTypes:{orientation:{control:{type:"select",options:["horizontal","vertical"]}},step:{control:{type:"number",min:1}}},args:{min:0,max:100,orientation:"horizontal",reverse:!1,step:void 0}},T=F=>t.createElement("div",{style:{width:"200px",height:"200px"}},t.createElement(v,k(S({},F),{value:[10,62]}))),j=F=>t.createElement("div",{style:{width:"200px",height:"200px"}},t.createElement(v,k(S({},F),{value:[10,62],orientation:"vertical"})));var K=I;T.parameters=S({storySource:{source:`(args) => {
  return (
    <div style={{ width: '200px', height: '200px' }}>
      <RangeSlider {...args} value={[10, 62]} />
    </div>
  );
}`}},T.parameters),j.parameters=S({storySource:{source:`(args) => {
  return (
    <div style={{ width: '200px', height: '200px' }}>
      <RangeSlider {...args} value={[10, 62]} orientation="vertical" />
    </div>
  );
}`}},j.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Slider/RangeSlider.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Slider/RangeSlider.story.tsx#ComponentMeta"})}catch(F){}},"./src/components/Slider/Slider.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return v},WithMarks:function(){return y},default:function(){return h}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("../../.yarn/__virtual__/@emotion-react-virtual-b3c85744cb/2/yarn/cache/@emotion-react-npm-11.10.6-655b70ad8d-4762042e39.zip/node_modules/@emotion/react/dist/emotion-react.browser.esm.js"),l=e("../../.yarn/__virtual__/rc-slider-virtual-872a602656/2/yarn/cache/rc-slider-npm-10.1.1-badf105b39-8df66142f1.zip/node_modules/rc-slider/es/index.js"),f=e("./src/themes/ThemeContext.tsx"),x=e("./src/components/Input/Input.tsx"),d=e("./src/components/Slider/styles.ts");const i=({min:s,max:o,onChange:r,onAfterChange:u,orientation:p="horizontal",reverse:S,step:k,value:D,ariaLabelForHandle:M,marks:I,included:T})=>{const j=p==="horizontal",K=(0,f.l4)(),F=(0,d.W)(K,j,Boolean(I)),$=l.Z,[R,U]=(0,t.useState)(D!=null?D:s),H=(0,t.useCallback)(q=>{const Y=typeof q=="number"?q:q[0];U(Y),r==null||r(Y)},[U,r]),W=(0,t.useCallback)(q=>{let Y=+q.target.value;Number.isNaN(Y)&&(Y=0),U(Y),r&&r(Y),u&&u(Y)},[r,u]),oe=(0,t.useCallback)(q=>{const Y=+q.target.value;Y>o?U(o):Y<s&&U(s)},[o,s]),Q=(0,t.useCallback)(q=>{const Y=typeof q=="number"?q:q[0];u==null||u(Y)},[u]),P=j?[]:[F.sliderInputVertical],ae=j?[]:[F.sliderInputFieldVertical];return t.createElement("div",{className:(0,n.cx)(F.container,F.slider)},t.createElement(a.xB,{styles:F.tooltip}),t.createElement("div",{className:(0,n.cx)(F.sliderInput,...P)},t.createElement($,{min:s,max:o,step:k,defaultValue:D,value:R,onChange:H,onAfterChange:Q,vertical:!j,reverse:S,ariaLabelForHandle:M,marks:I,included:T}),t.createElement(x.I,{type:"text",className:(0,n.cx)(F.sliderInputField,...ae),value:R,onChange:W,onBlur:oe,min:s,max:o})))};i.displayName="Slider";try{i.displayName="Slider",i.__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!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Slider/Slider.tsx#Slider"]={docgenInfo:i.__docgenInfo,name:"Slider",path:"src/components/Slider/Slider.tsx#Slider"})}catch(s){}var c=Object.defineProperty,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(s,o,r)=>o in s?c(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,_=(s,o)=>{for(var r in o||(o={}))O.call(o,r)&&w(s,r,o[r]);if(E)for(var r of E(o))m.call(o,r)&&w(s,r,o[r]);return s},C=`import { ComponentStory, ComponentMeta } from '@storybook/react';
import React from 'react';

import { Slider } from '@grafana/ui';

const meta: ComponentMeta<typeof Slider> = {
  title: 'Forms/Slider',
  component: Slider,
  parameters: {
    controls: {
      exclude: ['formatTooltipResult', 'onChange', 'onAfterChange', 'value', 'tooltipAlwaysVisible'],
    },
    knobs: {
      disabled: true,
    },
  },
  argTypes: {
    orientation: { control: { type: 'select', options: ['horizontal', 'vertical'] } },
    step: { control: { type: 'number', min: 1 } },
  },
  args: {
    min: 0,
    max: 100,
    value: 10,
    orientation: 'horizontal',
    reverse: false,
    included: true,
    step: undefined,
  },
};

export const Basic: ComponentStory<typeof Slider> = (args) => {
  return (
    <div style={{ width: '300px', height: '300px' }}>
      <Slider {...args} />
    </div>
  );
};

export const WithMarks: ComponentStory<typeof Slider> = (args) => {
  return (
    <div style={{ width: '300px', height: '300px' }}>
      <Slider {...args} />
    </div>
  );
};
WithMarks.args = {
  marks: { 0: '0', 25: '25', 50: '50', 75: '75', 100: '100' },
};

export default meta;
`,b={Basic:{startLoc:{col:52,line:32},endLoc:{col:1,line:38},startBody:{col:52,line:32},endBody:{col:1,line:38}},WithMarks:{startLoc:{col:56,line:40},endLoc:{col:1,line:46},startBody:{col:56,line:40},endBody:{col:1,line:46}}};const g={title:"Forms/Slider",component:i,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}},v=s=>t.createElement("div",{style:{width:"300px",height:"300px"}},t.createElement(i,_({},s))),y=s=>t.createElement("div",{style:{width:"300px",height:"300px"}},t.createElement(i,_({},s)));y.args={marks:{0:"0",25:"25",50:"50",75:"75",100:"100"}};var h=g;v.parameters=_({storySource:{source:`(args) => {
  return (
    <div style={{ width: '300px', height: '300px' }}>
      <Slider {...args} />
    </div>
  );
}`}},v.parameters),y.parameters=_({storySource:{source:`(args) => {
  return (
    <div style={{ width: '300px', height: '300px' }}>
      <Slider {...args} />
    </div>
  );
}`}},y.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Slider/Slider.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Slider/Slider.story.tsx#ComponentMeta"})}catch(s){}},"./src/components/Spinner/Spinner.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return y},default:function(){return h}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Spinner/Spinner.tsx"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function d(s){const o=Object.assign({h1:"h1",p:"p",code:"code"},(0,f.ah)(),s.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(x.h_,{title:"MDX|Spinner",component:n.$}),`
`,(0,l.jsx)(o.h1,{children:"Spinner"}),`
`,(0,l.jsxs)(o.p,{children:["Spinner is ",(0,l.jsx)(o.code,{children:"fa-spinner"})," icon animated. It is used to alert a user to wait for an activity to complete."]}),`
`,(0,l.jsx)(x.MB,{children:(0,l.jsxs)("div",{children:[(0,l.jsx)(n.$,{}),(0,l.jsx)(n.$,{className:"my-spin-div",iconClassName:"my-spinner-classname",size:24})]})}),`
`,(0,l.jsx)(x.xP,{of:n.$})]})}function i(s={}){const{wrapper:o}=Object.assign({},(0,f.ah)(),s.components);return o?(0,l.jsx)(o,Object.assign({},s,{children:(0,l.jsx)(d,s)})):d(s)}var c=i,E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?E(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=`import { Meta, Story } from '@storybook/react';
import React from 'react';

import { Spinner } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { Props } from './Spinner';
import mdx from './Spinner.mdx';

const meta: Meta = {
  title: 'Visualizations/Spinner',
  component: Spinner,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['className', 'iconClassName', 'style', 'inline'],
    },
  },
  argTypes: {
    backgroundColor: { control: { type: 'color' } },
    color: { control: { type: 'color' } },
  },
};

interface StoryProps extends Partial<Props> {
  backgroundColor: string;
  color: string;
  withStyle: boolean;
}

export const Basic: Story<StoryProps> = (args) => {
  return (
    <div>
      <Spinner
        style={
          args.withStyle === true
            ? {
                backgroundColor: \`\${args.backgroundColor}\`,
                color: \`\${args.color}\`,
              }
            : {}
        }
        size={args.size}
      />
    </div>
  );
};
Basic.args = {
  backgroundColor: 'white',
  color: 'red',
  size: 34,
  withStyle: false,
};

export default meta;
`,g={Basic:{startLoc:{col:40,line:35},endLoc:{col:1,line:51},startBody:{col:40,line:35},endBody:{col:1,line:51}}};const v={title:"Visualizations/Spinner",component:n.$,decorators:[a.BU],parameters:{docs:{page:c},controls:{exclude:["className","iconClassName","style","inline"]}},argTypes:{backgroundColor:{control:{type:"color"}},color:{control:{type:"color"}}}},y=s=>t.createElement("div",null,t.createElement(n.$,{style:s.withStyle===!0?{backgroundColor:`${s.backgroundColor}`,color:`${s.color}`}:{},size:s.size}));y.args={backgroundColor:"white",color:"red",size:34,withStyle:!1};var h=v;y.parameters=C({storySource:{source:`(args) => {
  return (
    <div>
      <Spinner
        style={
          args.withStyle === true
            ? {
                backgroundColor: \`\${args.backgroundColor}\`,
                color: \`\${args.color}\`,
              }
            : {}
        }
        size={args.size}
      />
    </div>
  );
}`}},y.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Spinner/Spinner.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Spinner/Spinner.story.tsx#Meta"})}catch(s){}},"./src/components/StatsPicker/StatsPicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Picker:function(){return v},default:function(){return y}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/fieldReducer.ts"),f=e("./src/components/Select/Select.tsx");class x extends n.PureComponent{constructor(){super(...arguments),this.checkInput=()=>{const{stats:s,allowMultiple:o,defaultStat:r,onChange:u}=this.props,p=l.TB.list(s);if(p.length!==s.length){const S=p.map(D=>D.id),k=(0,a.difference)(s,S);console.warn("Unknown stats",k,s),u(p.map(D=>D.id))}!o&&s.length>1&&(console.warn("Removing extra stat",s),u([s[0]])),r&&s.length<1&&u([r])},this.onSelectionChange=s=>{const{onChange:o}=this.props;Array.isArray(s)?o(s.map(r=>r.value)):o(s&&s.value?[s.value]:[])}}componentDidMount(){this.checkInput()}componentDidUpdate(s){this.checkInput()}render(){const{stats:s,allowMultiple:o,defaultStat:r,placeholder:u,className:p,menuPlacement:S,width:k,inputId:D}=this.props,M=l.TB.selectOptions(s);return n.createElement(f.Ph,{value:M.current,className:p,isClearable:!r,isMulti:o,width:k,isSearchable:!0,options:M.options,placeholder:u,onChange:this.onSelectionChange,menuPlacement:S,inputId:D})}}x.defaultProps={allowMultiple:!1};try{x.displayName="StatsPicker",x.__docgenInfo={description:"",displayName:"StatsPicker",props:{placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(stats: string[]) => void"}},stats:{defaultValue:null,description:"",name:"stats",required:!0,type:{name:"string[]"}},allowMultiple:{defaultValue:{value:"false"},description:"",name:"allowMultiple",required:!1,type:{name:"boolean"}},defaultStat:{defaultValue:null,description:"",name:"defaultStat",required:!1,type:{name:"string"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"number"}},menuPlacement:{defaultValue:null,description:"",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},inputId:{defaultValue:null,description:"",name:"inputId",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/StatsPicker/StatsPicker.tsx#StatsPicker"]={docgenInfo:x.__docgenInfo,name:"StatsPicker",path:"src/components/StatsPicker/StatsPicker.tsx#StatsPicker"})}catch(h){}var d=e("./src/utils/storybook/withCenteredStory.tsx"),i=Object.defineProperty,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(h,s,o)=>s in h?i(h,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):h[s]=o,w=(h,s)=>{for(var o in s||(s={}))E.call(s,o)&&m(h,o,s[o]);if(c)for(var o of c(s))O.call(s,o)&&m(h,o,s[o]);return h},_=`import { action } from '@storybook/addon-actions';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React, { PureComponent } from 'react';

import { StatsPicker } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

interface State {
  stats: string[];
}

class WrapperWithState extends PureComponent<any, State> {
  constructor(props: any) {
    super(props);
    this.state = {
      stats: this.toStatsArray(props.initialReducers),
    };
  }

  toStatsArray = (txt: string): string[] => {
    if (!txt) {
      return [];
    }
    return txt.split(',').map((v) => v.trim());
  };

  componentDidUpdate(prevProps: any) {
    const { initialReducers } = this.props;
    if (initialReducers !== prevProps.initialReducers) {
      console.log('Changing initial reducers');
      this.setState({ stats: this.toStatsArray(initialReducers) });
    }
  }

  render() {
    const { placeholder, allowMultiple, menuPlacement, width } = this.props;
    const { stats } = this.state;

    return (
      <StatsPicker
        placeholder={placeholder}
        allowMultiple={allowMultiple}
        stats={stats}
        onChange={(stats: string[]) => {
          action('Picked:')(stats);
          this.setState({ stats });
        }}
        menuPlacement={menuPlacement}
        width={width}
      />
    );
  }
}

const meta: ComponentMeta<typeof StatsPicker> = {
  title: 'Pickers and Editors/StatsPicker',
  component: StatsPicker,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['onChange', 'stats', 'defaultStat', 'className'],
    },
  },
};

export const Picker: ComponentStory<typeof StatsPicker> = (args) => {
  return (
    <div>
      <WrapperWithState {...args} />
    </div>
  );
};
Picker.args = {
  placeholder: 'placeholder',
  allowMultiple: false,
  menuPlacement: 'auto',
  width: 10,
};

export default meta;
`,C={Picker:{startLoc:{col:58,line:67},endLoc:{col:1,line:73},startBody:{col:58,line:67},endBody:{col:1,line:73}}};class b extends n.PureComponent{constructor(s){super(s),this.toStatsArray=o=>o?o.split(",").map(r=>r.trim()):[],this.state={stats:this.toStatsArray(s.initialReducers)}}componentDidUpdate(s){const{initialReducers:o}=this.props;o!==s.initialReducers&&(console.log("Changing initial reducers"),this.setState({stats:this.toStatsArray(o)}))}render(){const{placeholder:s,allowMultiple:o,menuPlacement:r,width:u}=this.props,{stats:p}=this.state;return n.createElement(x,{placeholder:s,allowMultiple:o,stats:p,onChange:S=>{(0,t.action)("Picked:")(S),this.setState({stats:S})},menuPlacement:r,width:u})}}const g={title:"Pickers and Editors/StatsPicker",component:x,decorators:[d.BU],parameters:{controls:{exclude:["onChange","stats","defaultStat","className"]}}},v=h=>n.createElement("div",null,n.createElement(b,w({},h)));v.args={placeholder:"placeholder",allowMultiple:!1,menuPlacement:"auto",width:10};var y=g;v.parameters=w({storySource:{source:`(args) => {
  return (
    <div>
      <WrapperWithState {...args} />
    </div>
  );
}`}},v.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/StatsPicker/StatsPicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/StatsPicker/StatsPicker.story.tsx#ComponentMeta"})}catch(h){}},"./src/components/Switch/Switch.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Controlled:function(){return o},Uncontrolled:function(){return r},default:function(){return u}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Switch/Switch.tsx"),a=e("./src/components/Forms/InlineField.tsx"),l=e("./src/utils/storybook/withCenteredStory.tsx"),f=e("./src/components/Forms/Field.tsx"),x=e("./src/components/Forms/InlineFieldRow.tsx"),d=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),i=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),c=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function E(p){const S=Object.assign({h1:"h1",h3:"h3",p:"p",code:"code",pre:"pre"},(0,i.ah)(),p.components);return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(c.h_,{title:"MDX|Switch",component:n.r}),`
`,(0,d.jsx)(S.h1,{children:"Switch"}),`
`,(0,d.jsx)(S.h3,{children:"When to use"}),`
`,(0,d.jsxs)(S.p,{children:[(0,d.jsx)(S.code,{children:"Switch"})," is a representation of an on-off state \u2013 like a light switch. So you can use ",(0,d.jsx)(S.code,{children:"Switch"})," to toggle binary states."]}),`
`,(0,d.jsxs)(S.p,{children:["Switches trigger changes immediately. If your component should trigger a change only after sending a form, it's better to use either ",(0,d.jsx)(S.code,{children:"RadioButtonGroup"})," or ",(0,d.jsx)(S.code,{children:"Checkbox"})," instead. Furthermore, switches cannot be grouped \u2013 each ",(0,d.jsx)(S.code,{children:"Switch"})," triggers an independent state. If you want multiple mutually exclusive choices, the ",(0,d.jsx)(S.code,{children:"RadioButtonGroup"})," is the better option. To offer multiple choices within the same group or context which are not mutually exclusive, use ",(0,d.jsx)(S.code,{children:"Checkbox"})," instead."]}),`
`,(0,d.jsx)(S.h3,{children:"Usage"}),`
`,(0,d.jsx)(S.pre,{children:(0,d.jsx)(S.code,{className:"language-jsx",children:`import { Switch } from '@grafana/ui';

<Switch disabled={...} value={...} onChange={...} />
`})}),`
`,(0,d.jsx)(S.h3,{children:"Props"}),`
`,(0,d.jsx)(c.xP,{of:n.r}),`
`,(0,d.jsx)(S.h1,{children:"InlineSwitch"}),`
`,(0,d.jsx)(S.h3,{children:"When to use"}),`
`,(0,d.jsx)(S.p,{children:"Same as for Switch but for inline forms."})]})}function O(p={}){const{wrapper:S}=Object.assign({},(0,i.ah)(),p.components);return S?(0,d.jsx)(S,Object.assign({},p,{children:(0,d.jsx)(E,p)})):E(p)}var m=O,w=Object.defineProperty,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(p,S,k)=>S in p?w(p,S,{enumerable:!0,configurable:!0,writable:!0,value:k}):p[S]=k,v=(p,S)=>{for(var k in S||(S={}))C.call(S,k)&&g(p,k,S[k]);if(_)for(var k of _(S))b.call(S,k)&&g(p,k,S[k]);return p},y=null,h={Controlled:{startLoc:{col:57,line:28},endLoc:{col:1,line:57},startBody:{col:57,line:28},endBody:{col:1,line:57}},Uncontrolled:{startLoc:{col:59,line:59},endLoc:{col:1,line:66},startBody:{col:59,line:59},endBody:{col:1,line:66}}};const s={title:"Forms/Switch",component:n.r,decorators:[l.BU,l.zT],parameters:{docs:{page:m}},args:{disabled:!1,value:!1,transparent:!1}},o=p=>t.createElement("div",null,t.createElement("div",{style:{marginBottom:"32px"}},t.createElement(f.g,{label:"Normal switch",description:"For horizontal forms"},t.createElement(n.r,{value:p.value,disabled:p.disabled,transparent:p.transparent}))),t.createElement("div",{style:{marginBottom:"32px"}},t.createElement(x.Z,null,t.createElement(a._,{label:"My switch"},t.createElement(n.x,{value:p.value,disabled:p.disabled,transparent:p.transparent})))),t.createElement("div",{style:{marginBottom:"32px"}},t.createElement("div",null,"just inline switch with show label"),t.createElement("span",null,t.createElement(n.x,{label:"Raw data",showLabel:!0,value:p.value,disabled:p.disabled,transparent:p.transparent})))),r=p=>{const[S,k]=(0,t.useState)(p.value),D=(0,t.useCallback)(M=>k(M.currentTarget.checked),[k]);return t.createElement(n.r,{value:S,disabled:p.disabled,transparent:p.transparent,onChange:D})};var u=s;o.parameters=v({storySource:{source:`(args) => {
  return (
    <div>
      <div style={{ marginBottom: '32px' }}>
        <Field label="Normal switch" description="For horizontal forms">
          <Switch value={args.value} disabled={args.disabled} transparent={args.transparent} />
        </Field>
      </div>
      <div style={{ marginBottom: '32px' }}>
        <InlineFieldRow>
          <InlineField label="My switch">
            <InlineSwitch value={args.value} disabled={args.disabled} transparent={args.transparent} />
          </InlineField>
        </InlineFieldRow>
      </div>
      <div style={{ marginBottom: '32px' }}>
        <div>just inline switch with show label</div>
        <span>
          <InlineSwitch
            label="Raw data"
            showLabel={true}
            value={args.value}
            disabled={args.disabled}
            transparent={args.transparent}
          />
        </span>
      </div>
    </div>
  );
}`}},o.parameters),r.parameters=v({storySource:{source:`(args) => {
  const [checked, setChecked] = useState(args.value);
  const onChange = useCallback(
    (e: React.FormEvent<HTMLInputElement>) => setChecked(e.currentTarget.checked),
    [setChecked]
  );
  return <Switch value={checked} disabled={args.disabled} transparent={args.transparent} onChange={onChange} />;
}`}},r.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Switch/Switch.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Switch/Switch.story.tsx#ComponentMeta"})}catch(p){}},"./src/components/Table/Table.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{BarGaugeCell:function(){return gr},Basic:function(){return Ko},ColoredCells:function(){return hr},Footer:function(){return vr},Pagination:function(){return $o},SubTables:function(){return br},default:function(){return cl}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/dataframe/processDataFrame.ts");function f(B,A){return A.type||(A.name==="time"||A.name==="Time"?A.type=a.fS.time:A.type=(0,l.LI)(B)),A.type===a.fS.number?z=>parseFloat(z):A.type===a.fS.boolean?z=>!(z[0]==="F"||z[0]==="f"||z[0]==="0"):z=>z}var x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/ArrayVector.ts"),d=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/FunctionalVector.ts"),i=Object.defineProperty,c=Object.defineProperties,E=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(B,A,z)=>A in B?i(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,C=(B,A)=>{for(var z in A||(A={}))m.call(A,z)&&_(B,z,A[z]);if(O)for(var z of O(A))w.call(A,z)&&_(B,z,A[z]);return B},b=(B,A)=>c(B,E(A));const g=void 0;class v extends d.G{constructor(A,z){if(super(),this.fields=[],this.first=new x.G,this.parsers=void 0,this.creator=z||(be=>new x.G(be)),A){const{name:be,refId:Me,meta:et,fields:tt}=A;if(be&&(this.name=be),Me&&(this.refId=Me),et&&(this.meta=et),tt)for(const vt of tt)this.addField(vt)}Object.defineProperty(this,"length",{enumerable:!0,get:()=>this.first.length})}get length(){return this.first.length}addFieldFor(A,z){return this.addField({name:z||"",type:(0,l.LI)(A)})}addField(A,z){let be;A.values&&(Array.isArray(A.values)?be=A.values:be=A.values.toArray());let Me=A.type;!Me&&(A.name==="time"||A.name==="Time")?Me=a.fS.time:(!Me&&be&&be.length&&(Me=(0,l.LI)(be[0])),Me||(Me=a.fS.other));let et=A.name;et||(et=`Field ${this.fields.length+1}`);const tt=b(C({},A),{name:et,type:Me,config:A.config||{},values:this.creator(be)});if(Me===a.fS.other&&(Me=(0,l.fu)(tt),Me&&(tt.type=Me)),this.fields.push(tt),this.first=this.fields[0].values,z)for(;tt.values.length<z;)tt.values.add(g);else this.validate();return tt}validate(){const A=this.fields.reduce((z,be)=>Math.max(z,be.values.length),0);for(const z of this.fields)for(;z.values.length!==A;)z.values.add(g)}reverse(){for(const A of this.fields)A.values.reverse()}setParser(A,z){return this.parsers||(this.parsers=new Map),this.parsers.set(A,z),z}parseValue(A,z){var be;let Me=(be=this.parsers)==null?void 0:be.get(A);return Me||(Me=this.setParser(A,f(z,A))),Me(z)}appendRow(A){for(let z=this.fields.length;z<A.length;z++)this.addField({name:`Field ${z+1}`,type:(0,l.LI)(A[z])});if(this.length<1)for(let z=0;z<this.fields.length;z++){const be=this.fields[z];(!be.type||be.type===a.fS.other)&&(be.type=(0,l.LI)(A[z]))}for(let z=0;z<this.fields.length;z++){const be=this.fields[z];let Me=A[z];be.type!==a.fS.string&&(0,t.isString)(Me)&&(Me=this.parseValue(be,Me)),be.values.add(Me)}}add(A){const z=A;for(const be of this.fields){let Me=z[be.name];be.type!==a.fS.string&&(0,t.isString)(Me)&&(Me=this.parseValue(be,Me)),Me===void 0&&(Me=g),be.values.add(Me)}}set(A,z){if(A>this.length)throw new Error("Unable to set value beyond current length");const be=z||{};for(const Me of this.fields)Me.values.set(A,be[Me.name])}get(A){const z={};for(const be of this.fields)z[be.name]=be.values.get(A);return z}toJSON(){return(0,l.og)(this)}}var y=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),h=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/thresholds.ts"),s=e("../../.yarn/__virtual__/react-table-virtual-45b6697169/2/yarn/cache/react-table-npm-7.8.0-61488af438-44ca0fb848.zip/node_modules/react-table/index.js"),o=e("../../.yarn/__virtual__/react-window-virtual-9886da65d9/2/yarn/cache/react-window-npm-1.8.8-1f85a45c48-a19f43b901.zip/node_modules/react-window/dist/index.esm.js"),r=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/fieldReducer.ts"),u=e("../grafana-schema/src/common/common.gen.ts"),p=e("./src/themes/ThemeContext.tsx"),S=e("./src/components/CustomScrollbar/CustomScrollbar.tsx"),k=e("./src/components/Pagination/Pagination.tsx"),D=e("../grafana-e2e-selectors/src/selectors/index.ts"),M=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js");const I=B=>{const A=M.iv`
    width: 100%;
    list-style: none;
  `,z=M.iv`
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  `;return B.value&&!Array.isArray(B.value)?n.createElement("span",null,B.value):B.value&&Array.isArray(B.value)&&B.value.length>0?n.createElement("ul",{className:A},B.value.map((be,Me)=>{const et=Object.keys(be)[0];return n.createElement("li",{className:z,key:Me},n.createElement("span",null,et),n.createElement("span",null,be[et]))})):T},T=()=>n.createElement("span",null,"\xA0");try{I.displayName="FooterCell",I.__docgenInfo={description:"",displayName:"FooterCell",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"FooterItem"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/FooterCell.tsx#FooterCell"]={docgenInfo:I.__docgenInfo,name:"FooterCell",path:"src/components/Table/FooterCell.tsx#FooterCell"})}catch(B){}var j=Object.defineProperty,K=Object.defineProperties,F=Object.getOwnPropertyDescriptors,$=Object.getOwnPropertySymbols,R=Object.prototype.hasOwnProperty,U=Object.prototype.propertyIsEnumerable,H=(B,A,z)=>A in B?j(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,W=(B,A)=>{for(var z in A||(A={}))R.call(A,z)&&H(B,z,A[z]);if($)for(var z of $(A))U.call(A,z)&&H(B,z,A[z]);return B},oe=(B,A)=>K(B,F(A)),Q=(B,A)=>{var z={};for(var be in B)R.call(B,be)&&A.indexOf(be)<0&&(z[be]=B[be]);if(B!=null&&$)for(var be of $(B))A.indexOf(be)<0&&U.call(B,be)&&(z[be]=B[be]);return z};function P(B){const{totalColumnsWidth:A,footerGroups:z,isPaginationVisible:be,tableStyles:Me}=B,et=D.wl.components.Panels.Visualization.Table;return n.createElement("div",{style:{position:be?"relative":"absolute",width:A?`${A}px`:"100%",bottom:"0px"}},z.map(tt=>{const vt=tt.getFooterGroupProps(),{key:Ct}=vt,kt=Q(vt,["key"]);return n.createElement("div",oe(W({className:Me.tfoot},kt),{key:Ct,"data-testid":et.footer}),tt.headers.map(At=>ae(At,Me)))}))}function ae(B,A){var z;const be=B.getHeaderProps();return be?(be.style=(z=be.style)!=null?z:{},be.style.position="absolute",be.style.justifyContent=B.justifyContent,n.createElement("div",W({className:A.headerCell},be),B.render("Footer"))):null}function q(B,A,z){if(A===void 0)return T;if(z){if(A[B]===void 0)return T;const be=r.TB.get(r.gz.count).name;return I({value:[{[be]:String(A[B])}]})}return I({value:A[B]})}try{P.displayName="FooterRow",P.__docgenInfo={description:"",displayName:"FooterRow",props:{totalColumnsWidth:{defaultValue:null,description:"",name:"totalColumnsWidth",required:!0,type:{name:"number"}},footerGroups:{defaultValue:null,description:"",name:"footerGroups",required:!0,type:{name:"HeaderGroup<{}>[]"}},footerValues:{defaultValue:null,description:"",name:"footerValues",required:!0,type:{name:"FooterItem[]"}},isPaginationVisible:{defaultValue:null,description:"",name:"isPaginationVisible",required:!0,type:{name:"boolean"}},tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/FooterRow.tsx#FooterRow"]={docgenInfo:P.__docgenInfo,name:"FooterRow",path:"src/components/Table/FooterRow.tsx#FooterRow"})}catch(B){}var Y=e("./src/types/icon.ts"),ve=e("./src/components/Icon/Icon.tsx"),re=e("./src/components/Tooltip/Popover.tsx"),je=e("./src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx"),me=e("./src/components/Layout/Layout.tsx"),ne=e("./src/components/Forms/Label.tsx"),Z=e("./src/components/IconButton/IconButton.tsx"),te=e("./src/components/Button/Button.tsx"),Pe=e("./src/components/FilterInput/FilterInput.tsx"),he=e("./src/components/Forms/Checkbox.tsx"),ie=e("./src/themes/stylesFactory.ts");const Ce=28,Le=Ce*5,we=({options:B,values:A,caseSensitive:z,onChange:be})=>{const Me=(0,p.l4)(),et=ue(Me),[tt,vt]=(0,n.useState)(""),Ct=(0,n.useMemo)(()=>new RegExp(tt,z?void 0:"i"),[tt,z]),kt=(0,n.useMemo)(()=>B.filter($t=>$t.label===void 0?!1:Ct.test($t.label)),[B,Ct]),At=Me.spacing.gridSize,jt=(0,n.useMemo)(()=>Math.min(kt.length*Ce,Le)+At,[At,kt.length]),nn=(0,n.useCallback)($t=>{vt($t)},[vt]),Nt=(0,n.useCallback)($t=>jn=>{const Vn=jn.currentTarget.checked?A.concat($t):A.filter(Ln=>Ln.value!==$t.value);be(Vn)},[be,A]);return n.createElement(me.wc,{spacing:"md"},n.createElement(Pe.H,{placeholder:"Filter values",onChange:nn,value:tt}),!kt.length&&n.createElement(ne._,null,"No values"),kt.length&&n.createElement(o.t7,{height:jt,itemCount:kt.length,itemSize:Ce,width:"100%",className:et.filterList},({index:$t,style:jn})=>{const Vn=kt[$t],{value:Ln,label:Kn}=Vn,da=A.find($n=>$n.value===Ln)!==void 0;return n.createElement("div",{className:et.filterListRow,style:jn,title:Kn},n.createElement(he.X,{value:da,label:Kn,onChange:Nt(Vn)}))}))},ue=(0,ie.B)(B=>({filterList:M.iv`
    label: filterList;
  `,filterListRow:M.iv`
    label: filterListRow;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: ${B.spacing(.5)};

    :hover {
      background-color: ${B.colors.action.hover};
    }
  `}));try{we.displayName="FilterList",we.__docgenInfo={description:"",displayName:"FilterList",props:{values:{defaultValue:null,description:"",name:"values",required:!0,type:{name:"SelectableValue<any>[]"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"SelectableValue<any>[]"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(options: SelectableValue<any>[]) => void"}},caseSensitive:{defaultValue:null,description:"",name:"caseSensitive",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/FilterList.tsx#FilterList"]={docgenInfo:we.__docgenInfo,name:"FilterList",path:"src/components/Table/FilterList.tsx#FilterList"})}catch(B){}var Ie=e("../../../yarn/cache/memoize-one-npm-6.0.0-8b2a2cd020-f185ea69f7.zip/node_modules/memoize-one/dist/memoize-one.esm.js"),qe=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/fieldState.ts");function Je(B){return B.fields.length>2?!1:Boolean(B.fields.find(A=>A.type===a.fS.time))}function Ze(B){return!B.find(A=>!Je(A))}function Oe(B){for(let A=0;A<B.length;A++){const z=getTimeField(B[A]);if(z.timeField!==void 0&&z.timeIndex!==void 0)return!0}return!1}var ce=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/displayProcessor.ts"),pe=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/scale.ts"),J=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/panel.ts"),L=e("./src/components/BarGauge/BarGauge.tsx");const fe=B=>B().map(A=>({label:A.title,ariaLabel:A.title,url:A.href,target:A.target,icon:`${A.target==="_blank"?"external-link-alt":"link"}`,onClick:A.onClick})),xe=B=>/\/explore\?.*&(left|right)=\[(.*\,){2,}(.*){1}\]/.test(B);var We=e("./src/components/ContextMenu/WithContextMenu.tsx"),Ue=e("./src/components/Menu/MenuGroup.tsx"),at=e("./src/components/Menu/MenuItem.tsx"),it=Object.defineProperty,_t=Object.defineProperties,wt=Object.getOwnPropertyDescriptors,ee=Object.getOwnPropertySymbols,_e=Object.prototype.hasOwnProperty,ge=Object.prototype.propertyIsEnumerable,de=(B,A,z)=>A in B?it(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Ee=(B,A)=>{for(var z in A||(A={}))_e.call(A,z)&&de(B,z,A[z]);if(ee)for(var z of ee(A))ge.call(A,z)&&de(B,z,A[z]);return B},ze=(B,A)=>_t(B,wt(A));const le=({children:B,links:A,style:z})=>{const be=[{items:fe(A),label:"Data links"}],Me=be[0].items.length,et=()=>be.map((vt,Ct)=>n.createElement(Ue.k,{key:`${vt.label}${Ct}`,label:vt.label},(vt.items||[]).map(kt=>n.createElement(at.s,{key:kt.label,url:kt.url,label:kt.label,target:kt.target,icon:kt.icon,active:kt.active,onClick:kt.onClick})))),tt=M.iv`
    cursor: context-menu;
  `;if(Me>1)return n.createElement(We.z,{renderMenuItems:et},({openMenu:vt})=>B({openMenu:vt,targetClassName:tt}));{const vt=A()[0];return n.createElement("a",{href:vt.href,onClick:vt.onClick,target:vt.target,title:vt.title,style:ze(Ee({},z),{overflow:"hidden",display:"flex"}),"aria-label":D.wl.components.DataLinksContextMenu.singleLink},B({}))}};try{le.displayName="DataLinksContextMenu",le.__docgenInfo={description:"",displayName:"DataLinksContextMenu",props:{links:{defaultValue:null,description:"",name:"links",required:!0,type:{name:"() => LinkModel<any>[]"}},style:{defaultValue:null,description:"",name:"style",required:!1,type:{name:"CSSProperties"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DataLinks/DataLinksContextMenu.tsx#DataLinksContextMenu"]={docgenInfo:le.__docgenInfo,name:"DataLinksContextMenu",path:"src/components/DataLinks/DataLinksContextMenu.tsx#DataLinksContextMenu"})}catch(B){}var ye=Object.defineProperty,Se=Object.defineProperties,Be=Object.getOwnPropertyDescriptors,Xe=Object.getOwnPropertySymbols,st=Object.prototype.hasOwnProperty,mt=Object.prototype.propertyIsEnumerable,rt=(B,A,z)=>A in B?ye(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,lt=(B,A)=>{for(var z in A||(A={}))st.call(A,z)&&rt(B,z,A[z]);if(Xe)for(var z of Xe(A))mt.call(A,z)&&rt(B,z,A[z]);return B},ft=(B,A)=>Se(B,Be(A));const St={mode:h.H.Absolute,steps:[{color:"blue",value:-1/0},{color:"green",value:20}]},gt=B=>{var A;const{field:z,innerWidth:be,tableStyles:Me,cell:et,cellProps:tt,row:vt}=B,Ct=z.display(et.value),kt=ct(z);let At=(0,pe.xD)(z,!1);At.thresholds||(At=ft(lt({},At),{thresholds:St}));let jt=u.QH.Gradient,nn;kt.type===u.h2.Gauge&&(jt=(A=kt.mode)!=null?A:u.QH.Gradient,nn=kt.valueDisplayMode!==void 0?kt.valueDisplayMode:u.M8.Text);const Nt=()=>(0,t.isFunction)(z.getLinks)?z.getLinks({valueRowIndex:vt.index}):[],$t=Boolean(Nt().length),jn=pt(z,Ct,et.row.index),Vn=Ln=>{const{openMenu:Kn,targetClassName:da}=Ln;return n.createElement(L.xf,{width:be,height:Me.cellHeightInner,field:At,display:z.display,text:{valueSize:14},value:Ct,orientation:J.wm.Horizontal,theme:Me.theme,alignmentFactors:jn,onClick:Kn,className:da,itemSpacing:1,lcdCellWidth:8,displayMode:jt,valueDisplayMode:nn})};return n.createElement("div",ft(lt({},tt),{className:Me.cellContainer}),$t&&n.createElement(le,{links:Nt,style:{display:"flex",width:"100%"}},Ln=>Vn(Ln)),!$t&&Vn({}))};function pt(B,A,z){var be;let Me=(be=B.state)==null?void 0:be.alignmentFactors;if(Me)return Me.text.length<A.text.length&&(Me.text=A.text),Me;{Me=lt({},A);const et=Math.min(B.values.length,z+1e3);for(let tt=z+1;tt<et;tt++)B.display(B.values.get(tt)).text.length>Me.text.length&&(Me.text=A.text);return B.state?B.state.alignmentFactors=Me:B.state={alignmentFactors:Me},Me}}try{gt.displayName="BarGaugeCell",gt.__docgenInfo={description:"",displayName:"BarGaugeCell",props:{tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},cellProps:{defaultValue:null,description:"",name:"cellProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"Field<any, Vector<any>>"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},innerWidth:{defaultValue:null,description:"",name:"innerWidth",required:!0,type:{name:"number"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"readonly any[]"}},initialState:{defaultValue:null,description:"",name:"initialState",required:!1,type:{name:"Partial<TableState<any>>"}},stateReducer:{defaultValue:null,description:"",name:"stateReducer",required:!1,type:{name:"((newState: TableState<any>, action: ActionType, previousState: TableState<any>, instance?: TableInstance<any>) => TableState<...>)"}},useControlledState:{defaultValue:null,description:"",name:"useControlledState",required:!1,type:{name:"((state: TableState<any>, meta: MetaBase<any>) => TableState<any>)"}},defaultColumn:{defaultValue:null,description:"",name:"defaultColumn",required:!1,type:{name:"Partial<Column<any>>"}},getSubRows:{defaultValue:null,description:"",name:"getSubRows",required:!1,type:{name:"((originalRow: any, relativeIndex: number) => any[])"}},getRowId:{defaultValue:null,description:"",name:"getRowId",required:!1,type:{name:"((originalRow: any, relativeIndex: number, parent?: Row<any>) => string)"}},autoResetHiddenColumns:{defaultValue:null,description:"",name:"autoResetHiddenColumns",required:!1,type:{name:"boolean"}},column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"ColumnInstance<any>"}},row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"Row<any>"}},cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<any, any>"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"any"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/BarGaugeCell.tsx#BarGaugeCell"]={docgenInfo:gt.__docgenInfo,name:"BarGaugeCell",path:"src/components/Table/BarGaugeCell.tsx#BarGaugeCell"})}catch(B){}var ut=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js");const Ot=(B,A)=>{let z;if(B.getLinks&&(z=B.getLinks({valueRowIndex:A.index})),!!z){for(let be=0;be<(z==null?void 0:z.length);be++)if(z[be].onClick){const Me=z[be].onClick;z[be].onClick=et=>{et.ctrlKey||et.metaKey||et.shiftKey||(et.preventDefault(),Me(et,{field:B,rowIndex:A.index}))}}return z}};var Wt=e("./src/utils/colors.ts"),Ht=e("./src/utils/i18n.tsx"),on=e("../../.yarn/__virtual__/react-popper-virtual-6baf84772d/2/yarn/cache/react-popper-npm-2.3.0-1045578379-837111c987.zip/node_modules/react-popper/lib/esm/usePopper.js"),un=e("./src/components/Portal/Portal.tsx"),mn=Object.defineProperty,wn=Object.defineProperties,Gt=Object.getOwnPropertyDescriptors,hn=Object.getOwnPropertySymbols,fn=Object.prototype.hasOwnProperty,Hn=Object.prototype.propertyIsEnumerable,va=(B,A,z)=>A in B?mn(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,ia=(B,A)=>{for(var z in A||(A={}))fn.call(A,z)&&va(B,z,A[z]);if(hn)for(var z of hn(A))Hn.call(A,z)&&va(B,z,A[z]);return B},ba=(B,A)=>wn(B,Gt(A));function ta({referenceElement:B,children:A,suffixIcon:z,placement:be}){const[Me,et]=(0,n.useState)(null),tt=(0,on.D)(B,Me,{placement:be}),vt=(0,p.wW)(na),Ct=(0,p.wW)($e);return n.createElement(un.h_,null,n.createElement("div",ba(ia({style:ia({display:"inline-block"},tt.styles.popper)},tt.attributes.popper),{ref:et}),n.createElement("span",{className:(0,M.cx)(vt.root,Ct[be])},A&&n.createElement("span",null,A),z&&n.createElement(ve.J,{name:z}))))}const na=B=>({root:(0,M.iv)(ba(ia({},B.typography.bodySmall),{willChange:"transform",background:B.components.tooltip.background,color:B.components.tooltip.text,padding:B.spacing(.5,1.5),borderRadius:100,display:"inline-flex",gap:B.spacing(.5),alignItems:"center"}))}),la=(B,A)=>(0,M.F4)({from:{opacity:0,transform:`translate(${B}, ${A})`},to:{opacity:1,transform:"translate(0, 0px)"}}),$e=B=>{const z=la(0,B.spacing(1)),be=la(0,B.spacing(1*-1)),Me=la(B.spacing(1),0),et=la(B.spacing(1*-1),0);return{top:(0,M.iv)({marginBottom:B.spacing(1),animation:`${z} ease-out 100ms`}),bottom:(0,M.iv)({marginTop:B.spacing(1),animation:`${be} ease-out 100ms`}),left:(0,M.iv)({marginRight:B.spacing(1),animation:`${Me} ease-out 100ms`}),right:(0,M.iv)({marginLeft:B.spacing(1),animation:`${et} ease-out 100ms`})}};try{ta.displayName="InlineToast",ta.__docgenInfo={description:"",displayName:"InlineToast",props:{suffixIcon:{defaultValue:null,description:"",name:"suffixIcon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},referenceElement:{defaultValue:null,description:"",name:"referenceElement",required:!0,type:{name:"HTMLElement | null"}},placement:{defaultValue:null,description:"",name:"placement",required:!0,type:{name:"enum",value:[{value:'"top"'},{value:'"right"'},{value:'"bottom"'},{value:'"left"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/InlineToast/InlineToast.tsx#InlineToast"]={docgenInfo:ta.__docgenInfo,name:"InlineToast",path:"src/components/InlineToast/InlineToast.tsx#InlineToast"})}catch(B){}var He=Object.defineProperty,Ye=Object.defineProperties,yt=Object.getOwnPropertyDescriptors,bt=Object.getOwnPropertySymbols,It=Object.prototype.hasOwnProperty,Lt=Object.prototype.propertyIsEnumerable,zt=(B,A,z)=>A in B?He(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Vt=(B,A)=>{for(var z in A||(A={}))It.call(A,z)&&zt(B,z,A[z]);if(bt)for(var z of bt(A))Lt.call(A,z)&&zt(B,z,A[z]);return B},Ut=(B,A)=>Ye(B,yt(A)),Kt=(B,A)=>{var z={};for(var be in B)It.call(B,be)&&A.indexOf(be)<0&&(z[be]=B[be]);if(B!=null&&bt)for(var be of bt(B))A.indexOf(be)<0&&Lt.call(B,be)&&(z[be]=B[be]);return z},xn=(B,A,z)=>new Promise((be,Me)=>{var et=Ct=>{try{vt(z.next(Ct))}catch(kt){Me(kt)}},tt=Ct=>{try{vt(z.throw(Ct))}catch(kt){Me(kt)}},vt=Ct=>Ct.done?be(Ct.value):Promise.resolve(Ct.value).then(et,tt);vt((z=z.apply(B,A)).next())});const rn=2*1e3;function Bn(B){var A=B,{onClipboardCopy:z,onClipboardError:be,children:Me,getText:et,icon:tt,variant:vt}=A,Ct=Kt(A,["onClipboardCopy","onClipboardError","children","getText","icon","variant"]);const kt=(0,p.wW)(Fn),[At,jt]=(0,n.useState)(!1);(0,n.useEffect)(()=>{let $t;return At&&($t=setTimeout(()=>{jt(!1)},rn)),()=>{window.clearTimeout($t)}},[At]);const nn=(0,n.useRef)(null),Nt=(0,n.useCallback)(()=>xn(this,null,function*(){const $t=et();try{yield _n($t,nn),jt(!0),z==null||z($t)}catch(jn){be==null||be($t,jn)}}),[et,z,be]);return n.createElement(n.Fragment,null,At&&n.createElement(ta,{placement:"top",referenceElement:nn.current},n.createElement(Ht.c,{i18nKey:"clipboard-button.inline-toast.success"},"Copied")),n.createElement(te.zx,Ut(Vt({onClick:Nt,icon:tt,variant:At?"success":vt,"aria-label":At?"Copied":void 0},Ct),{className:(0,M.cx)(kt.button,At&&kt.successButton),ref:nn}),Me,At&&n.createElement("div",{className:kt.successOverlay},n.createElement(ve.J,{name:"check"}))))}const _n=(B,A)=>xn(void 0,null,function*(){var z;if(navigator.clipboard&&window.isSecureContext)return navigator.clipboard.writeText(B);{const be=document.createElement("textarea");(z=A.current)==null||z.appendChild(be),be.value=B,be.focus(),be.select(),document.execCommand("copy"),be.remove()}}),Fn=B=>({button:(0,M.iv)({position:"relative"}),successButton:(0,M.iv)({"> *":(0,M.iv)({visibility:"hidden"})}),successOverlay:(0,M.iv)({position:"absolute",top:0,bottom:0,right:0,left:0,visibility:"visible"})});try{Bn.displayName="ClipboardButton",Bn.__docgenInfo={description:"",displayName:"ClipboardButton",props:{getText:{defaultValue:null,description:"A function that returns text to be copied",name:"getText",required:!0,type:{name:"() => string"}},onClipboardCopy:{defaultValue:null,description:"Callback when the text has been successfully copied",name:"onClipboardCopy",required:!1,type:{name:"((copiedText: string) => void)"}},onClipboardError:{defaultValue:null,description:"Callback when there was an error copying the text",name:"onClipboardError",required:!1,type:{name:"((copiedText: string, error: unknown) => void)"}},size:{defaultValue:null,description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'}]}},variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},fill:{defaultValue:null,description:"",name:"fill",required:!1,type:{name:"enum",value:[{value:'"text"'},{value:'"solid"'},{value:'"outline"'}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},fullWidth:{defaultValue:null,description:"",name:"fullWidth",required:!1,type:{name:"boolean"}},type:{defaultValue:null,description:"",name:"type",required:!1,type:{name:"enum",value:[{value:'"submit"'},{value:'"reset"'},{value:'"button"'}]}},tooltip:{defaultValue:null,description:"Tooltip content to display on hover",name:"tooltip",required:!1,type:{name:"PopoverContent"}},tooltipPlacement:{defaultValue:null,description:"Position of the tooltip",name:"tooltipPlacement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ClipboardButton/ClipboardButton.tsx#ClipboardButton"]={docgenInfo:Bn.__docgenInfo,name:"ClipboardButton",path:"src/components/ClipboardButton/ClipboardButton.tsx#ClipboardButton"})}catch(B){}var An=e("./src/components/Modal/Modal.tsx"),Sn=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/Registry.ts");const ua=new Sn.B;var sn=e("./src/components/LoadingPlaceholder/LoadingPlaceholder.tsx"),pa=e("./src/components/ErrorBoundary/ErrorWithStack.tsx"),sa=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useAsync.js"),Rn=Object.defineProperty,gn=Object.defineProperties,ma=Object.getOwnPropertyDescriptors,Ta=Object.getOwnPropertySymbols,ya=Object.prototype.hasOwnProperty,ke=Object.prototype.propertyIsEnumerable,Ne=(B,A,z)=>A in B?Rn(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Ge=(B,A)=>{for(var z in A||(A={}))ya.call(A,z)&&Ne(B,z,A[z]);if(Ta)for(var z of Ta(A))ke.call(A,z)&&Ne(B,z,A[z]);return B},Et=(B,A)=>gn(B,ma(A)),Jt=(B,A,z)=>new Promise((be,Me)=>{var et=Ct=>{try{vt(z.next(Ct))}catch(kt){Me(kt)}},tt=Ct=>{try{vt(z.throw(Ct))}catch(kt){Me(kt)}},vt=Ct=>Ct.done?be(Ct.value):Promise.resolve(Ct.value).then(et,tt);vt((z=z.apply(B,A)).next())});const an=B=>{const A=(0,sa.Z)(()=>Jt(void 0,null,function*(){return yield B}));return Et(Ge({},A),{dependency:A.value})};var Cn=Object.defineProperty,En=Object.getOwnPropertySymbols,Tn=Object.prototype.hasOwnProperty,kn=Object.prototype.propertyIsEnumerable,Gn=(B,A,z)=>A in B?Cn(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Ae=(B,A)=>{for(var z in A||(A={}))Tn.call(A,z)&&Gn(B,z,A[z]);if(En)for(var z of En(A))kn.call(A,z)&&Gn(B,z,A[z]);return B};const De=B=>{const{loading:A,error:z,dependency:be}=an(e.e(462).then(e.bind(e,"./src/components/Monaco/ReactMonacoEditor.tsx")));if(A)return n.createElement(sn.u,{text:""});if(z)return n.createElement(pa.X,{title:"React Monaco Editor failed to load",error:z,errorInfo:{componentStack:(z==null?void 0:z.stack)||""}});const Me=be.ReactMonacoEditor;return n.createElement(Me,Ae({},B))};try{De.displayName="ReactMonacoEditorLazy",De.__docgenInfo={description:"",displayName:"ReactMonacoEditorLazy",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Monaco/ReactMonacoEditorLazy.tsx#ReactMonacoEditorLazy"]={docgenInfo:De.__docgenInfo,name:"ReactMonacoEditorLazy",path:"src/components/Monaco/ReactMonacoEditorLazy.tsx#ReactMonacoEditorLazy"})}catch(B){}var Fe=(B=>(B.Method="method",B.Field="field",B.Property="property",B.Constant="constant",B.Text="text",B))(Fe||{}),xt=Object.defineProperty,Qt=Object.defineProperties,Xt=Object.getOwnPropertyDescriptors,tn=Object.getOwnPropertySymbols,qt=Object.prototype.hasOwnProperty,cn=Object.prototype.propertyIsEnumerable,ln=(B,A,z)=>A in B?xt(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Dn=(B,A)=>{for(var z in A||(A={}))qt.call(A,z)&&ln(B,z,A[z]);if(tn)for(var z of tn(A))cn.call(A,z)&&ln(B,z,A[z]);return B},zn=(B,A)=>Qt(B,Xt(A));function Za(B){for(let A=B.length-1;A>0;A--){const z=B.charAt(A);if(z==="$")return{index:A,prefix:B.substring(A)};if(z===" "||z==="	"||z==='"'||z==="'")return{index:A+1,prefix:B.substring(A+1)}}return{index:0,prefix:B}}function Nn(B,A,z,be){var Me;const et=[];for(const tt of z)A&&!tt.label.startsWith(A)||et.push(zn(Dn({},tt),{kind:Ga(B,tt.kind),range:be,insertText:(Me=tt.insertText)!=null?Me:tt.label}));return et}function Ga(B,A){switch(A){case Fe.Method:return B.languages.CompletionItemKind.Method;case Fe.Field:return B.languages.CompletionItemKind.Field;case Fe.Property:return B.languages.CompletionItemKind.Property;case Fe.Constant:return B.languages.CompletionItemKind.Constant;case Fe.Text:return B.languages.CompletionItemKind.Text}return B.languages.CompletionItemKind.Text}function Pa(B,A,z){if(!(!A||!z))return B.languages.registerCompletionItemProvider(A,{triggerCharacters:["$"],provideCompletionItems:(be,Me,et)=>{const tt={startLineNumber:Me.lineNumber,endLineNumber:Me.lineNumber,startColumn:Me.column,endColumn:Me.column};if(et.triggerCharacter==="$")return tt.startColumn=Me.column-1,{suggestions:Nn(B,"$",z(),tt)};const vt=be.getValueInRange({startLineNumber:Me.lineNumber,startColumn:1,endLineNumber:Me.lineNumber,endColumn:Me.column}),{index:Ct,prefix:kt}=Za(vt);tt.startColumn=Ct+1;const At=Nn(B,kt,z(),tt);if(At.length)return{suggestions:At}}})}var fa=Object.defineProperty,Ya=Object.getOwnPropertySymbols,ja=Object.prototype.hasOwnProperty,Da=Object.prototype.propertyIsEnumerable,vn=(B,A,z)=>A in B?fa(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,xa=(B,A)=>{for(var z in A||(A={}))ja.call(A,z)&&vn(B,z,A[z]);if(Ya)for(var z of Ya(A))Da.call(A,z)&&vn(B,z,A[z]);return B};class Qe extends n.PureComponent{constructor(A){super(A),this.loadCustomLanguage=()=>{const{language:z}=this.props,be=ua.getIfExists(z);return be?be.init():Promise.resolve()},this.getEditorValue=()=>"",this.onBlur=()=>{const{onBlur:z}=this.props;z&&z(this.getEditorValue())},this.onSave=()=>{const{onSave:z}=this.props;z&&z(this.getEditorValue())},this.handleBeforeMount=z=>{this.monaco=z;const{language:be,getSuggestions:Me,onBeforeEditorMount:et}=this.props;Me&&(this.completionCancel=Pa(z,be,Me)),et==null||et(z)},this.handleOnMount=(z,be)=>{var Me;const{onChange:et,onEditorDidMount:tt}=this.props;this.getEditorValue=()=>z.getValue(),z.addCommand(be.KeyMod.CtrlCmd|be.KeyCode.KeyS,this.onSave);const vt=this.loadCustomLanguage();tt&&(vt.then(()=>tt(z,be)),(Me=z.getModel())==null||Me.onDidChangeContent(()=>et==null?void 0:et(z.getValue())))}}componentWillUnmount(){this.completionCancel&&this.completionCancel.dispose()}componentDidUpdate(A){const{getSuggestions:z,language:be}=this.props,Me=A.language!==be;if(A.getSuggestions!==z||Me){if(this.completionCancel&&this.completionCancel.dispose(),!this.monaco){console.warn("Monaco instance not loaded yet");return}z&&(this.completionCancel=Pa(this.monaco,be,z))}Me&&this.loadCustomLanguage()}render(){var A,z;const{theme:be,language:Me,width:et,height:tt,showMiniMap:vt,showLineNumbers:Ct,readOnly:kt,monacoOptions:At}=this.props,jt=(A=this.props.value)!=null?A:"",nn=jt.length>100,Nt=(z=this.props.containerStyles)!=null?z:no(be).container,$t={wordWrap:"off",tabSize:2,codeLens:!1,contextmenu:!1,minimap:{enabled:nn&&vt,renderCharacters:!1},readOnly:kt,lineNumbersMinChars:4,lineDecorationsWidth:1*be.spacing.gridSize,overviewRulerBorder:!1,automaticLayout:!0,padding:{top:.5*be.spacing.gridSize,bottom:.5*be.spacing.gridSize},fixedOverflowWidgets:!0};return Ct||($t.glyphMargin=!1,$t.folding=!1,$t.lineNumbers="off",$t.lineNumbersMinChars=0),n.createElement("div",{className:Nt,onBlur:this.onBlur,"aria-label":D.wl.components.CodeEditor.container},n.createElement(De,{width:et,height:tt,language:Me,value:jt,options:xa(xa({},$t),At!=null?At:{}),beforeMount:this.handleBeforeMount,onMount:this.handleOnMount}))}}const za=(0,p.HE)(Qe),no=B=>({container:M.iv`
      border-radius: ${B.shape.borderRadius()};
      border: 1px solid ${B.components.input.borderColor};
    `});try{za.displayName="CodeEditor",za.__docgenInfo={description:"",displayName:"CodeEditor",props:{onBlur:{defaultValue:null,description:"Handler to be performed when editor is blurred",name:"onBlur",required:!1,type:{name:"CodeEditorChangeHandler"}},onChange:{defaultValue:null,description:"Handler to be performed whenever the text inside the editor changes",name:"onChange",required:!1,type:{name:"CodeEditorChangeHandler"}},height:{defaultValue:null,description:"",name:"height",required:!1,type:{name:"string | number"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"string | number"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string"}},readOnly:{defaultValue:null,description:"",name:"readOnly",required:!1,type:{name:"boolean"}},language:{defaultValue:null,description:"",name:"language",required:!0,type:{name:"string"}},showMiniMap:{defaultValue:null,description:"",name:"showMiniMap",required:!1,type:{name:"boolean"}},showLineNumbers:{defaultValue:null,description:"",name:"showLineNumbers",required:!1,type:{name:"boolean"}},monacoOptions:{defaultValue:null,description:"",name:"monacoOptions",required:!1,type:{name:"MonacoOptionsWithGrafanaDefaults"}},onBeforeEditorMount:{defaultValue:null,description:"Callback before the editor has mounted that gives you raw access to monaco",name:"onBeforeEditorMount",required:!1,type:{name:'((monaco: typeof import("/yarn/cache/monaco-editor-npm-0.34.0-2a8aa5269e-10a28c1fe0.zip/node_modules/monaco-editor/esm/vs/editor/editor.api")) => void)'}},onEditorDidMount:{defaultValue:null,description:"Callback after the editor has mounted that gives you raw access to monaco",name:"onEditorDidMount",required:!1,type:{name:'((editor: IStandaloneCodeEditor, monaco: typeof import("/yarn/cache/monaco-editor-npm-0.34.0-2a8aa5269e-10a28c1fe0.zip/node_modules/monaco-editor/esm/vs/editor/editor.api")) => void)'}},onSave:{defaultValue:null,description:"Handler to be performed when Cmd/Ctrl+S is pressed",name:"onSave",required:!1,type:{name:"CodeEditorChangeHandler"}},getSuggestions:{defaultValue:null,description:"Language agnostic suggestion completions -- typically for template variables",name:"getSuggestions",required:!1,type:{name:"CodeEditorSuggestionProvider"}},containerStyles:{defaultValue:null,description:"",name:"containerStyles",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Monaco/CodeEditor.tsx#CodeEditor"]={docgenInfo:za.__docgenInfo,name:"CodeEditor",path:"src/components/Monaco/CodeEditor.tsx#CodeEditor"})}catch(B){}function Fa({value:B,onDismiss:A,mode:z}){let be=B;if((0,t.isString)(B))try{B=JSON.parse(B)}catch(et){}else be=JSON.stringify(B,null," ");let Me=be;return z==="code"&&(Me=JSON.stringify(B,null," ")),n.createElement(An.u,{onDismiss:A,isOpen:!0,title:"Inspect value"},z==="code"?n.createElement(za,{width:"100%",height:500,language:"json",showLineNumbers:!0,showMiniMap:(Me&&Me.length)>100,value:Me,readOnly:!0}):n.createElement("pre",null,Me),n.createElement(An.u.ButtonRow,null,n.createElement(Bn,{icon:"copy",getText:()=>Me},"Copy to Clipboard")))}try{Fa.displayName="TableCellInspectModal",Fa.__docgenInfo={description:"",displayName:"TableCellInspectModal",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"any"}},onDismiss:{defaultValue:null,description:"",name:"onDismiss",required:!0,type:{name:"() => void"}},mode:{defaultValue:null,description:"",name:"mode",required:!0,type:{name:"enum",value:[{value:'"text"'},{value:'"code"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/TableCellInspectModal.tsx#TableCellInspectModal"]={docgenInfo:Fa.__docgenInfo,name:"TableCellInspectModal",path:"src/components/Table/TableCellInspectModal.tsx#TableCellInspectModal"})}catch(B){}const Na="=",co="!=";var Wa=Object.defineProperty,_a=Object.getOwnPropertySymbols,Xa=Object.prototype.hasOwnProperty,ao=Object.prototype.propertyIsEnumerable,Ja=(B,A,z)=>A in B?Wa(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,ka=(B,A)=>{for(var z in A||(A={}))Xa.call(A,z)&&Ja(B,z,A[z]);if(_a)for(var z of _a(A))ao.call(A,z)&&Ja(B,z,A[z]);return B};function aa({field:B,cell:A,previewMode:z,showFilters:be,onCellFilterAdded:Me}){var et;const[tt,vt]=(0,n.useState)(!1),Ct=fo(B)==="flex-end",kt=Boolean((et=B.config.custom)==null?void 0:et.inspect),At={size:"sm",tooltipPlacement:"top"},jt=(0,n.useCallback)(Nt=>{Me&&Me({key:B.name,operator:Na,value:A.value})},[A,B,Me]),nn=(0,n.useCallback)(Nt=>{Me&&Me({key:B.name,operator:co,value:A.value})},[A,B,Me]);return n.createElement(n.Fragment,null,n.createElement("div",{className:`cellActions ${Ct?"cellActionsLeft":""}`},n.createElement(me.Lh,{spacing:"xs"},kt&&n.createElement(Z.h,ka({name:"eye",tooltip:"Inspect value",onClick:()=>{vt(!0)}},At)),be&&n.createElement(Z.h,ka({name:"search-plus",onClick:jt,tooltip:"Filter for value"},At)),be&&n.createElement(Z.h,ka({name:"search-minus",onClick:nn,tooltip:"Filter out value"},At)))),tt&&n.createElement(Fa,{mode:z,value:A.value,onDismiss:()=>{vt(!1)}}))}try{aa.displayName="CellActions",aa.__docgenInfo={description:"",displayName:"CellActions",props:{previewMode:{defaultValue:null,description:"",name:"previewMode",required:!0,type:{name:"enum",value:[{value:'"text"'},{value:'"code"'}]}},tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},cellProps:{defaultValue:null,description:"",name:"cellProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"Field<any, Vector<any>>"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},innerWidth:{defaultValue:null,description:"",name:"innerWidth",required:!0,type:{name:"number"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"readonly any[]"}},initialState:{defaultValue:null,description:"",name:"initialState",required:!1,type:{name:"Partial<TableState<any>>"}},stateReducer:{defaultValue:null,description:"",name:"stateReducer",required:!1,type:{name:"((newState: TableState<any>, action: ActionType, previousState: TableState<any>, instance?: TableInstance<any>) => TableState<...>)"}},useControlledState:{defaultValue:null,description:"",name:"useControlledState",required:!1,type:{name:"((state: TableState<any>, meta: MetaBase<any>) => TableState<any>)"}},defaultColumn:{defaultValue:null,description:"",name:"defaultColumn",required:!1,type:{name:"Partial<Column<any>>"}},getSubRows:{defaultValue:null,description:"",name:"getSubRows",required:!1,type:{name:"((originalRow: any, relativeIndex: number) => any[])"}},getRowId:{defaultValue:null,description:"",name:"getRowId",required:!1,type:{name:"((originalRow: any, relativeIndex: number, parent?: Row<any>) => string)"}},autoResetHiddenColumns:{defaultValue:null,description:"",name:"autoResetHiddenColumns",required:!1,type:{name:"boolean"}},column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"ColumnInstance<any>"}},row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"Row<any>"}},cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<any, any>"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"any"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/CellActions.tsx#CellActions"]={docgenInfo:aa.__docgenInfo,name:"CellActions",path:"src/components/Table/CellActions.tsx#CellActions"})}catch(B){}var oo=Object.defineProperty,Va=Object.defineProperties,ca=Object.getOwnPropertyDescriptors,dn=Object.getOwnPropertySymbols,On=Object.prototype.hasOwnProperty,bn=Object.prototype.propertyIsEnumerable,Mn=(B,A,z)=>A in B?oo(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Sa=(B,A)=>{for(var z in A||(A={}))On.call(A,z)&&Mn(B,z,A[z]);if(dn)for(var z of dn(A))bn.call(A,z)&&Mn(B,z,A[z]);return B},Yn=(B,A)=>Va(B,ca(A));const Ca=B=>{var A,z;const{field:be,cell:Me,tableStyles:et,row:tt,cellProps:vt}=B,Ct=Boolean((A=be.config.custom)==null?void 0:A.inspect),kt=be.display(Me.value);let At;n.isValidElement(Me.value)?At=Me.value:At=(0,y.zc)(kt);const jt=B.onCellFilterAdded&&be.config.filterable,nn=jt&&Me.value!==void 0||Ct,Nt=ct(be),$t=Qa(et,Nt,kt,Ct),jn=Boolean((z=Ot(be,tt))==null?void 0:z.length),Vn=(0,p.wW)(te._7);return n.createElement("div",Yn(Sa({},vt),{className:$t}),!jn&&n.createElement("div",{className:et.cellText},At),jn&&n.createElement(le,{links:()=>Ot(be,tt)||[]},Ln=>Ln.openMenu?n.createElement("button",{className:(0,M.cx)(Vn,Ha(et,Nt,Ln.targetClassName)),onClick:Ln.openMenu},At):n.createElement("div",{className:Ha(et,Nt,Ln.targetClassName)},At)),nn&&n.createElement(aa,Yn(Sa({},B),{previewMode:"text",showFilters:jt})))};function Qa(B,A,z,be=!1){var Me;const et=B.theme.isDark?1:-.7;let tt,vt;if(A.type===u.h2.ColorText)tt=z.color;else if(A.type===u.h2.ColorBackground){const Ct=(Me=A.mode)!=null?Me:u.v7.Gradient;if(Ct===u.v7.Basic)tt=(0,Wt.bM)(z.color,B.theme.isDark),vt=(0,ut.Z)(z.color).toRgbString();else if(Ct===u.v7.Gradient){const kt=(0,ut.Z)(z.color).darken(10*et).spin(5);tt=(0,Wt.bM)(z.color,B.theme.isDark),vt=`linear-gradient(120deg, ${kt.toRgbString()}, ${z.color})`}}return tt!==void 0||vt!==void 0?B.buildCellContainerStyle(tt,vt,!be):be?B.cellContainerNoOverflow:B.cellContainer}function Ha(B,A,z){return A.type===u.h2.Auto?(0,M.cx)(B.cellLink,z):(0,M.cx)(B.cellLinkForColoredCell,z)}try{Ca.displayName="DefaultCell",Ca.__docgenInfo={description:"",displayName:"DefaultCell",props:{tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},cellProps:{defaultValue:null,description:"",name:"cellProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"Field<any, Vector<any>>"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},innerWidth:{defaultValue:null,description:"",name:"innerWidth",required:!0,type:{name:"number"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"readonly any[]"}},initialState:{defaultValue:null,description:"",name:"initialState",required:!1,type:{name:"Partial<TableState<any>>"}},stateReducer:{defaultValue:null,description:"",name:"stateReducer",required:!1,type:{name:"((newState: TableState<any>, action: ActionType, previousState: TableState<any>, instance?: TableInstance<any>) => TableState<...>)"}},useControlledState:{defaultValue:null,description:"",name:"useControlledState",required:!1,type:{name:"((state: TableState<any>, meta: MetaBase<any>) => TableState<any>)"}},defaultColumn:{defaultValue:null,description:"",name:"defaultColumn",required:!1,type:{name:"Partial<Column<any>>"}},getSubRows:{defaultValue:null,description:"",name:"getSubRows",required:!1,type:{name:"((originalRow: any, relativeIndex: number) => any[])"}},getRowId:{defaultValue:null,description:"",name:"getRowId",required:!1,type:{name:"((originalRow: any, relativeIndex: number, parent?: Row<any>) => string)"}},autoResetHiddenColumns:{defaultValue:null,description:"",name:"autoResetHiddenColumns",required:!1,type:{name:"boolean"}},column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"ColumnInstance<any>"}},row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"Row<any>"}},cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<any, any>"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"any"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/DefaultCell.tsx#DefaultCell"]={docgenInfo:Ca.__docgenInfo,name:"DefaultCell",path:"src/components/Table/DefaultCell.tsx#DefaultCell"})}catch(B){}var Xn=e("../../../yarn/cache/ol-npm-7.2.2-c7f462f458-025b58ad79.zip/node_modules/ol/format/WKT.js"),Ia=e("../../../yarn/cache/ol-npm-7.2.2-c7f462f458-025b58ad79.zip/node_modules/ol/geom/Geometry.js"),ro=Object.defineProperty,eo=Object.defineProperties,io=Object.getOwnPropertyDescriptors,Ua=Object.getOwnPropertySymbols,Oa=Object.prototype.hasOwnProperty,vo=Object.prototype.propertyIsEnumerable,Ma=(B,A,z)=>A in B?ro(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,bo=(B,A)=>{for(var z in A||(A={}))Oa.call(A,z)&&Ma(B,z,A[z]);if(Ua)for(var z of Ua(A))vo.call(A,z)&&Ma(B,z,A[z]);return B},yo=(B,A)=>eo(B,io(A));function yn(B){const{cell:A,tableStyles:z,cellProps:be}=B;let Me="";return A.value instanceof Ia.Z?Me=new Xn.Z().writeGeometry(A.value,{featureProjection:"EPSG:3857",dataProjection:"EPSG:4326"}):A.value!=null&&(Me=`${A.value}`),n.createElement("div",yo(bo({},be),{className:z.cellContainer}),n.createElement("div",{className:z.cellText,style:{fontFamily:"monospace"}},Me))}try{yn.displayName="GeoCell",yn.__docgenInfo={description:"",displayName:"GeoCell",props:{tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},cellProps:{defaultValue:null,description:"",name:"cellProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"Field<any, Vector<any>>"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},innerWidth:{defaultValue:null,description:"",name:"innerWidth",required:!0,type:{name:"number"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"readonly any[]"}},initialState:{defaultValue:null,description:"",name:"initialState",required:!1,type:{name:"Partial<TableState<any>>"}},stateReducer:{defaultValue:null,description:"",name:"stateReducer",required:!1,type:{name:"((newState: TableState<any>, action: ActionType, previousState: TableState<any>, instance?: TableInstance<any>) => TableState<...>)"}},useControlledState:{defaultValue:null,description:"",name:"useControlledState",required:!1,type:{name:"((state: TableState<any>, meta: MetaBase<any>) => TableState<any>)"}},defaultColumn:{defaultValue:null,description:"",name:"defaultColumn",required:!1,type:{name:"Partial<Column<any>>"}},getSubRows:{defaultValue:null,description:"",name:"getSubRows",required:!1,type:{name:"((originalRow: any, relativeIndex: number) => any[])"}},getRowId:{defaultValue:null,description:"",name:"getRowId",required:!1,type:{name:"((originalRow: any, relativeIndex: number, parent?: Row<any>) => string)"}},autoResetHiddenColumns:{defaultValue:null,description:"",name:"autoResetHiddenColumns",required:!1,type:{name:"boolean"}},column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"ColumnInstance<any>"}},row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"Row<any>"}},cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<any, any>"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"any"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/GeoCell.tsx#GeoCell"]={docgenInfo:yn.__docgenInfo,name:"GeoCell",path:"src/components/Table/GeoCell.tsx#GeoCell"})}catch(B){}var Un=Object.defineProperty,La=Object.defineProperties,To=Object.getOwnPropertyDescriptors,uo=Object.getOwnPropertySymbols,Po=Object.prototype.hasOwnProperty,xo=Object.prototype.propertyIsEnumerable,po=(B,A,z)=>A in B?Un(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Go=(B,A)=>{for(var z in A||(A={}))Po.call(A,z)&&po(B,z,A[z]);if(uo)for(var z of uo(A))xo.call(A,z)&&po(B,z,A[z]);return B},Do=(B,A)=>La(B,To(A));const _o=B=>{var A;const{field:z,cell:be,tableStyles:Me,row:et,cellProps:tt}=B,vt=z.display(be.value),Ct=Boolean((A=Ot(z,et))==null?void 0:A.length),kt=(0,p.wW)(te._7);return n.createElement("div",Do(Go({},tt),{className:Me.cellContainer}),!Ct&&n.createElement("img",{src:vt.text,className:Me.imageCell,alt:""}),Ct&&n.createElement(le,{style:{height:"100%"},links:()=>Ot(z,et)||[]},At=>{const jt=n.createElement("img",{src:vt.text,className:Me.imageCell,alt:""});return At.openMenu?n.createElement(te.zx,{className:(0,M.cx)(kt),onClick:At.openMenu},jt):jt}))};try{_o.displayName="ImageCell",_o.__docgenInfo={description:"",displayName:"ImageCell",props:{tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},cellProps:{defaultValue:null,description:"",name:"cellProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"Field<any, Vector<any>>"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},innerWidth:{defaultValue:null,description:"",name:"innerWidth",required:!0,type:{name:"number"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"readonly any[]"}},initialState:{defaultValue:null,description:"",name:"initialState",required:!1,type:{name:"Partial<TableState<any>>"}},stateReducer:{defaultValue:null,description:"",name:"stateReducer",required:!1,type:{name:"((newState: TableState<any>, action: ActionType, previousState: TableState<any>, instance?: TableInstance<any>) => TableState<...>)"}},useControlledState:{defaultValue:null,description:"",name:"useControlledState",required:!1,type:{name:"((state: TableState<any>, meta: MetaBase<any>) => TableState<any>)"}},defaultColumn:{defaultValue:null,description:"",name:"defaultColumn",required:!1,type:{name:"Partial<Column<any>>"}},getSubRows:{defaultValue:null,description:"",name:"getSubRows",required:!1,type:{name:"((originalRow: any, relativeIndex: number) => any[])"}},getRowId:{defaultValue:null,description:"",name:"getRowId",required:!1,type:{name:"((originalRow: any, relativeIndex: number, parent?: Row<any>) => string)"}},autoResetHiddenColumns:{defaultValue:null,description:"",name:"autoResetHiddenColumns",required:!1,type:{name:"boolean"}},column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"ColumnInstance<any>"}},row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"Row<any>"}},cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<any, any>"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"any"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/ImageCell.tsx#ImageCell"]={docgenInfo:_o.__docgenInfo,name:"ImageCell",path:"src/components/Table/ImageCell.tsx#ImageCell"})}catch(B){}var Yo=Object.defineProperty,Xo=Object.defineProperties,Jo=Object.getOwnPropertyDescriptors,zo=Object.getOwnPropertySymbols,Qo=Object.prototype.hasOwnProperty,Fo=Object.prototype.propertyIsEnumerable,No=(B,A,z)=>A in B?Yo(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Wo=(B,A)=>{for(var z in A||(A={}))Qo.call(A,z)&&No(B,z,A[z]);if(zo)for(var z of zo(A))Fo.call(A,z)&&No(B,z,A[z]);return B},ko=(B,A)=>Xo(B,Jo(A));function Ka(B){var A,z;const{cell:be,tableStyles:Me,cellProps:et,field:tt,row:vt}=B,Ct=Boolean((A=tt.config.custom)==null?void 0:A.inspect),kt=M.iv`
    cursor: pointer;
    font-family: monospace;
  `;let At=be.value,jt=At;if((0,t.isString)(At))try{At=JSON.parse(At)}catch($t){}else jt=JSON.stringify(At,null," ");const nn=Boolean((z=Ot(tt,vt))==null?void 0:z.length),Nt=(0,p.wW)(te._7);return n.createElement("div",ko(Wo({},et),{className:Ct?Me.cellContainerNoOverflow:Me.cellContainer}),n.createElement("div",{className:(0,M.cx)(Me.cellText,kt)},!nn&&n.createElement("div",{className:Me.cellText},jt),nn&&n.createElement(le,{links:()=>Ot(tt,vt)||[]},$t=>$t.openMenu?n.createElement(te.zx,{className:(0,M.cx)(Nt),onClick:$t.openMenu},jt):n.createElement(n.Fragment,null,jt))),Ct&&n.createElement(aa,ko(Wo({},B),{previewMode:"code"})))}try{Ka.displayName="JSONViewCell",Ka.__docgenInfo={description:"",displayName:"JSONViewCell",props:{tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},cellProps:{defaultValue:null,description:"",name:"cellProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"Field<any, Vector<any>>"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},innerWidth:{defaultValue:null,description:"",name:"innerWidth",required:!0,type:{name:"number"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"readonly any[]"}},initialState:{defaultValue:null,description:"",name:"initialState",required:!1,type:{name:"Partial<TableState<any>>"}},stateReducer:{defaultValue:null,description:"",name:"stateReducer",required:!1,type:{name:"((newState: TableState<any>, action: ActionType, previousState: TableState<any>, instance?: TableInstance<any>) => TableState<...>)"}},useControlledState:{defaultValue:null,description:"",name:"useControlledState",required:!1,type:{name:"((state: TableState<any>, meta: MetaBase<any>) => TableState<any>)"}},defaultColumn:{defaultValue:null,description:"",name:"defaultColumn",required:!1,type:{name:"Partial<Column<any>>"}},getSubRows:{defaultValue:null,description:"",name:"getSubRows",required:!1,type:{name:"((originalRow: any, relativeIndex: number) => any[])"}},getRowId:{defaultValue:null,description:"",name:"getRowId",required:!1,type:{name:"((originalRow: any, relativeIndex: number, parent?: Row<any>) => string)"}},autoResetHiddenColumns:{defaultValue:null,description:"",name:"autoResetHiddenColumns",required:!1,type:{name:"boolean"}},column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"ColumnInstance<any>"}},row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"Row<any>"}},cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<any, any>"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"any"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/JSONViewCell.tsx#JSONViewCell"]={docgenInfo:Ka.__docgenInfo,name:"JSONViewCell",path:"src/components/Table/JSONViewCell.tsx#JSONViewCell"})}catch(B){}var er=Object.defineProperty,Ho=Object.getOwnPropertySymbols,tr=Object.prototype.hasOwnProperty,nr=Object.prototype.propertyIsEnumerable,wo=(B,A,z)=>A in B?er(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,ar=(B,A)=>{for(var z in A||(A={}))tr.call(A,z)&&wo(B,z,A[z]);if(Ho)for(var z of Ho(A))nr.call(A,z)&&wo(B,z,A[z]);return B};function So({row:B,tableStyles:A}){return n.createElement("div",ar({className:A.expanderCell},B.getToggleRowExpandedProps()),n.createElement(ve.J,{"aria-label":B.isExpanded?"Collapse row":"Expand row",name:B.isExpanded?"angle-down":"angle-right",size:"xl"}))}try{So.displayName="RowExpander",So.__docgenInfo={description:"",displayName:"RowExpander",props:{row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"GrafanaTableRow"}},tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/RowExpander.tsx#RowExpander"]={docgenInfo:So.__docgenInfo,name:"RowExpander",path:"src/components/Table/RowExpander.tsx#RowExpander"})}catch(B){}var or=e("./src/components/Sparkline/Sparkline.tsx"),Uo=Object.defineProperty,rr=Object.defineProperties,ir=Object.getOwnPropertyDescriptors,Io=Object.getOwnPropertySymbols,Mo=Object.prototype.hasOwnProperty,lr=Object.prototype.propertyIsEnumerable,Bo=(B,A,z)=>A in B?Uo(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,mo=(B,A)=>{for(var z in A||(A={}))Mo.call(A,z)&&Bo(B,z,A[z]);if(Io)for(var z of Io(A))lr.call(A,z)&&Bo(B,z,A[z]);return B},Ao=(B,A)=>rr(B,ir(A));const sr={drawStyle:u.l8.Line,lineInterpolation:u.KC.Smooth,lineWidth:1,fillOpacity:17,gradientMode:u.FI.Hue,pointSize:2,barAlignment:u.pu.Center,showPoints:u.Jp.Never},lo=B=>{const{field:A,innerWidth:z,tableStyles:be,cell:Me,cellProps:et}=B,tt=cr(Me.value);if(!tt)return n.createElement("div",Ao(mo({},et),{className:be.cellContainer}),"no data");const vt=(0,pe.dz)(tt.y);tt.y.config.min=vt.min,tt.y.config.max=vt.max,tt.y.state={range:vt};const Ct=dr(A),kt={color:A.config.color,custom:mo(mo({},sr),Ct)};return n.createElement("div",Ao(mo({},et),{className:be.cellContainer}),n.createElement(or.b,{width:z,height:be.cellHeightInner,sparkline:tt,config:kt,theme:be.theme}))};function cr(B){if((0,t.isArray)(B))return{y:{name:"test",type:a.fS.number,values:new x.G(B),config:{}}};if((0,l.aY)(B)){const A=B.fields.find(be=>be.type===a.fS.time),z=B.fields.find(be=>be.type===a.fS.number);if(A&&z)return{x:A,y:z}}}function dr(B){let A=ct(B);if(A.type===u.h2.Auto&&(A=Ao(mo({},A),{type:u.h2.Sparkline})),A.type===u.h2.Sparkline)return A;throw new Error(`Excpected options type ${u.h2.Sparkline} but got ${A.type}`)}try{lo.displayName="SparklineCell",lo.__docgenInfo={description:"",displayName:"SparklineCell",props:{tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},cellProps:{defaultValue:null,description:"",name:"cellProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"Field<any, Vector<any>>"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},innerWidth:{defaultValue:null,description:"",name:"innerWidth",required:!0,type:{name:"number"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"readonly any[]"}},initialState:{defaultValue:null,description:"",name:"initialState",required:!1,type:{name:"Partial<TableState<any>>"}},stateReducer:{defaultValue:null,description:"",name:"stateReducer",required:!1,type:{name:"((newState: TableState<any>, action: ActionType, previousState: TableState<any>, instance?: TableInstance<any>) => TableState<...>)"}},useControlledState:{defaultValue:null,description:"",name:"useControlledState",required:!1,type:{name:"((state: TableState<any>, meta: MetaBase<any>) => TableState<any>)"}},defaultColumn:{defaultValue:null,description:"",name:"defaultColumn",required:!1,type:{name:"Partial<Column<any>>"}},getSubRows:{defaultValue:null,description:"",name:"getSubRows",required:!1,type:{name:"((originalRow: any, relativeIndex: number) => any[])"}},getRowId:{defaultValue:null,description:"",name:"getRowId",required:!1,type:{name:"((originalRow: any, relativeIndex: number, parent?: Row<any>) => string)"}},autoResetHiddenColumns:{defaultValue:null,description:"",name:"autoResetHiddenColumns",required:!1,type:{name:"boolean"}},column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"ColumnInstance<any>"}},row:{defaultValue:null,description:"",name:"row",required:!0,type:{name:"Row<any>"}},cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<any, any>"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"any"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/SparklineCell.tsx#SparklineCell"]={docgenInfo:lo.__docgenInfo,name:"SparklineCell",path:"src/components/Table/SparklineCell.tsx#SparklineCell"})}catch(B){}const so=50;function fo(B){if(!B)return"flex-start";if(B.config.custom)switch(B.config.custom.align){case"right":return"flex-end";case"left":return"flex-start";case"center":return"center"}return B.type===a.fS.number?"flex-end":"flex-start"}function ur(B,A,z,be,Me,et){var tt,vt;const Ct=[];let kt=0;be&&(Ct.push({Header:()=>null,id:"expander",Cell:So,width:so,minWidth:so,filter:(jt,nn,Nt)=>[],justifyContent:"left",field:B.fields[0],sortType:"basic"}),A-=so);for(const[jt,nn]of B.fields.entries()){const Nt=nn.config.custom||{};if(Nt.hidden)continue;Nt.width?A-=Nt.width:kt++;const $t=Vn=>{switch(Vn){case a.fS.number:return"number";case a.fS.time:return"basic";default:return"alphanumeric-insensitive"}},jn=pr((tt=Nt.cellOptions)==null?void 0:tt.type,nn);Ct.push({Cell:jn,id:jt.toString(),field:nn,Header:(0,qe.C)(nn,B),accessor:(Vn,Ln)=>nn.values.get(Ln),sortType:$t(nn.type),width:Nt.width,minWidth:(vt=Nt.minWidth)!=null?vt:z,filter:(0,Ie.Z)(Co(nn)),justifyContent:fo(nn),Footer:q(jt,Me,et)})}let At=A/kt;for(let jt=kt;jt>0;jt--)for(const nn of Ct)!nn.width&&nn.minWidth>At&&(nn.width=nn.minWidth,A-=nn.width,kt-=1,At=A/kt);for(const jt of Ct)jt.width||(jt.width=At),jt.minWidth=50;return Ct}function pr(B,A){switch(B){case u.h2.ColorText:case u.h2.ColorBackground:return Ca;case u.h2.Image:return _o;case u.h2.Gauge:return gt;case u.h2.Sparkline:return lo;case u.h2.JSONView:return Ka}if(A.type===a.fS.geo)return yn;if(A.type===a.fS.frame){const z=A.values.get(0);return(0,l.aY)(z)&&Je(z)?lo:Ka}return A.type===a.fS.other?Ka:Ca}function Co(B){return function(A,z,be){return A.length===0||!be||!B?A:A.filter(Me=>{if(!Me.values.hasOwnProperty(z))return!1;const et=N(Me,B);return be.find(tt=>tt.value===et)!==void 0})}}function G(B,A){if(!A||B.length===0)return{};const z={};for(let be=0;be<B.length;be++){const Me=N(B[be],A);z[Me||"(Blanks)"]=Me}return z}function N(B,A){if(!A||!B)return"";const z=A.values.get(B.index),be=A.display?A.display(z):z;return A.display?(0,y.zc)(be):be}function X(B){return Object.keys(B).reduce((A,z)=>A.concat({value:B[z],label:z}),[]).sort(Te)}function Te(B,A){return B.label===void 0&&A.label===void 0?0:B.label===void 0&&A.label!==void 0?-1:B.label!==void 0&&A.label===void 0?1:B.label<A.label?-1:B.label>A.label?1:0}function Ve(B,A){return A?B.filter(z=>A.some(be=>be.value===z.value)):[]}function Re(B,A,z){return String(B.values[z]).localeCompare(String(A.values[z]),void 0,{sensitivity:"base"})}function Ke(B,A,z){const be=nt(B.values[z]),Me=nt(A.values[z]);return be===Me?0:be>Me?1:-1}function nt(B){return B==null||B===""||isNaN(B)?Number.NEGATIVE_INFINITY:typeof B=="number"?B:Number(B)}function ot(B,A,z,be){return dt(B),B.map((Me,et)=>{var tt;if(((tt=Me==null?void 0:Me.field)==null?void 0:tt.type)!==a.fS.number)return et===0&&z.reducer&&z.reducer.length>0?r.TB.get(z.reducer[0]).name:void 0;let vt=(0,t.clone)(Me.field);return vt.values=new x.G(A[Me.id]),vt.state=void 0,Me.field=vt,z.fields&&z.fields.length>0?z.fields.find(kt=>{var At;return kt===((At=Me==null?void 0:Me.field)==null?void 0:At.name)})?ht(Me.field,z.reducer,be):void 0:ht(Me.field,z.reducer||[],be)})}function ht(B,A,z){var be;const Me=(be=B.display)!=null?be:(0,ce.U_)({field:B,theme:z}),et=A[0],tt=(0,r.Kx)({field:B,reducers:A})[et];return(0,y.zc)(Me(tt))}function Tt(B){const A=[];for(const z in B)for(const[be,Me]of Object.entries(B[z].values))A[be]===void 0&&(A[be]=[]),A[be].push(Me);return A}const Pt={type:u.h2.Auto};function ct(B){var A,z,be;return(A=B.config.custom)!=null&&A.displayMode?Mt((z=B.config.custom)==null?void 0:z.displayMode):(be=B.config.custom)!=null&&be.cellOptions?B.config.custom.cellOptions:Pt}function Mt(B){switch(B){case"basic":case"gradient-gauge":case"lcd-gauge":let A=u.QH.Basic;return B==="gradient-gauge"?A=u.QH.Gradient:B==="lcd-gauge"&&(A=u.QH.Lcd),{type:u.h2.Gauge,mode:A};case"color-background":case"color-background-solid":let z=u.v7.Basic;return B==="color-background"&&(z=u.v7.Gradient),{type:u.h2.ColorBackground,mode:z};default:return{type:B}}}function dt(B){const A=B.findIndex((z,be)=>(z==null?void 0:z.id)!==String(be));A!==-1&&(B.splice(A,0,{id:String(A)}),dt(B))}const Bt=({column:{preFilteredRows:B,filterValue:A,setFilter:z},onClose:be,field:Me})=>{const et=(0,p.l4)(),tt=(0,n.useMemo)(()=>G(B,Me),[B,Me]),vt=(0,n.useMemo)(()=>X(tt),[tt]),Ct=(0,n.useMemo)(()=>Ve(vt,A),[vt,A]),[kt,At]=(0,n.useState)(Ct),[jt,nn]=(0,n.useState)(!1),Nt=(0,n.useCallback)(Kn=>be(),[be]),$t=(0,n.useCallback)(Kn=>{const da=kt.length?kt:void 0;z(da),be()},[z,kt,be]),jn=(0,n.useCallback)(Kn=>{z(void 0),be()},[z,be]),Vn=(0,n.useMemo)(()=>A!==void 0,[A]),Ln=(0,p.wW)(Rt);return n.createElement(je.L,{onClick:Nt,useCapture:!0},n.createElement("div",{className:(0,M.cx)(Ln.filterContainer),onClick:Ft},n.createElement(me.wc,{spacing:"lg"},n.createElement(me.wc,{spacing:"xs"},n.createElement(me.Lh,{justify:"space-between",align:"center"},n.createElement(ne._,{className:Ln.label},"Filter by values:"),n.createElement(Z.h,{name:"text-fields",tooltip:"Match case",style:{color:jt?et.colors.text.link:et.colors.text.disabled},onClick:()=>{nn(Kn=>!Kn)}})),n.createElement("div",{className:(0,M.cx)(Ln.listDivider)}),n.createElement(we,{onChange:At,values:kt,options:vt,caseSensitive:jt})),n.createElement(me.Lh,{spacing:"lg"},n.createElement(me.Lh,null,n.createElement(te.zx,{size:"sm",onClick:$t},"Ok"),n.createElement(te.zx,{size:"sm",variant:"secondary",onClick:Nt},"Cancel")),Vn&&n.createElement(me.Lh,null,n.createElement(te.zx,{fill:"text",size:"sm",onClick:jn},"Clear filter"))))))},Rt=B=>({filterContainer:M.iv`
    label: filterContainer;
    width: 100%;
    min-width: 250px;
    height: 100%;
    max-height: 400px;
    background-color: ${B.colors.background.primary};
    border: 1px solid ${B.colors.border.weak};
    padding: ${B.spacing(2)};
    margin: ${B.spacing(1)} 0;
    box-shadow: ${B.shadows.z3};
    border-radius: ${B.shape.radius.default};
  `,listDivider:M.iv`
    label: listDivider;
    width: 100%;
    border-top: 1px solid ${B.colors.border.medium};
    padding: ${B.spacing(.5,2)};
  `,label:M.iv`
    margin-bottom: 0;
  `}),Ft=B=>{B.stopPropagation()};try{Bt.displayName="FilterPopup",Bt.__docgenInfo={description:"",displayName:"FilterPopup",props:{column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"any"}},tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!0,type:{name:"() => void"}},field:{defaultValue:null,description:"",name:"field",required:!1,type:{name:"Field<any, Vector<any>>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/FilterPopup.tsx#FilterPopup"]={docgenInfo:Bt.__docgenInfo,name:"FilterPopup",path:"src/components/Table/FilterPopup.tsx#FilterPopup"})}catch(B){}const Dt=({column:B,field:A,tableStyles:z})=>{var be;const Me=(0,n.useRef)(null),[et,tt]=(0,n.useState)(!1),vt=(0,p.wW)(Zt),Ct=(0,n.useMemo)(()=>Boolean(B.filterValue),[B.filterValue]),kt=(0,n.useCallback)(()=>tt(!0),[tt]),At=(0,n.useCallback)(()=>tt(!1),[tt]);return!A||!((be=A.config.custom)!=null&&be.filterable)?null:n.createElement("button",{className:(0,M.cx)(z.headerFilter,Ct?vt.filterIconEnabled:vt.filterIconDisabled),ref:Me,type:"button",onClick:kt},n.createElement(ve.J,{name:"filter"}),et&&Me.current&&n.createElement(re.J,{content:n.createElement(Bt,{column:B,tableStyles:z,field:A,onClose:At}),placement:"bottom-start",referenceElement:Me.current,show:!0}))},Zt=B=>({filterIconEnabled:M.iv`
    label: filterIconEnabled;
    color: ${B.colors.primary.text};
  `,filterIconDisabled:M.iv`
    label: filterIconDisabled;
    color: ${B.colors.text.disabled};
  `});try{Dt.displayName="Filter",Dt.__docgenInfo={description:"",displayName:"Filter",props:{column:{defaultValue:null,description:"",name:"column",required:!0,type:{name:"any"}},tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},field:{defaultValue:null,description:"",name:"field",required:!1,type:{name:"Field<any, Vector<any>>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/Filter.tsx#Filter"]={docgenInfo:Dt.__docgenInfo,name:"Filter",path:"src/components/Table/Filter.tsx#Filter"})}catch(B){}var Yt=Object.defineProperty,en=Object.defineProperties,In=Object.getOwnPropertyDescriptors,Jn=Object.getOwnPropertySymbols,Qn=Object.prototype.hasOwnProperty,Pn=Object.prototype.propertyIsEnumerable,oa=(B,A,z)=>A in B?Yt(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,ga=(B,A)=>{for(var z in A||(A={}))Qn.call(A,z)&&oa(B,z,A[z]);if(Jn)for(var z of Jn(A))Pn.call(A,z)&&oa(B,z,A[z]);return B},ha=(B,A)=>en(B,In(A)),ea=(B,A)=>{var z={};for(var be in B)Qn.call(B,be)&&A.indexOf(be)<0&&(z[be]=B[be]);if(B!=null&&Jn)for(var be of Jn(B))A.indexOf(be)<0&&Pn.call(B,be)&&(z[be]=B[be]);return z};const pn=B=>{const{headerGroups:A,showTypeIcons:z,tableStyles:be}=B,Me=D.wl.components.Panels.Visualization.Table;return n.createElement("div",{role:"rowgroup",className:be.headerRow},A.map(et=>{const tt=et.getHeaderGroupProps(),{key:vt}=tt,Ct=ea(tt,["key"]);return n.createElement("div",ha(ga({className:be.thead},Ct),{key:vt,"aria-label":Me.header,role:"row"}),et.headers.map((kt,At)=>$a(kt,be,z)))}))};function $a(B,A,z){var be;const Me=B.getHeaderProps(),et=(be=B.field)!=null?be:null;return B.canResize&&(Me.style.userSelect=B.isResizing?"none":"auto"),Me.style.position="absolute",Me.style.justifyContent=B.justifyContent,n.createElement("div",ha(ga({className:A.headerCell},Me),{role:"columnheader"}),B.canSort&&n.createElement(n.Fragment,null,n.createElement("button",ha(ga({},B.getSortByToggleProps()),{className:A.headerCellLabel}),z&&n.createElement(ve.J,{name:(0,Y.e7)(et),title:et==null?void 0:et.type,size:"sm",className:A.typeIcon}),n.createElement("div",null,B.render("Header")),B.isSorted&&(B.isSortedDesc?n.createElement(ve.J,{size:"lg",name:"arrow-down",className:A.sortIcon}):n.createElement(ve.J,{name:"arrow-up",size:"lg",className:A.sortIcon}))),B.canFilter&&n.createElement(Dt,{column:B,tableStyles:A,field:et})),!B.canSort&&B.render("Header"),!B.canSort&&B.canFilter&&n.createElement(Dt,{column:B,tableStyles:A,field:et}),B.canResize&&n.createElement("div",ha(ga({},B.getResizerProps()),{className:A.resizeHandle})))}try{pn.displayName="HeaderRow",pn.__docgenInfo={description:"",displayName:"HeaderRow",props:{headerGroups:{defaultValue:null,description:"",name:"headerGroups",required:!0,type:{name:"HeaderGroup<{}>[]"}},showTypeIcons:{defaultValue:null,description:"",name:"showTypeIcons",required:!1,type:{name:"boolean"}},tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/HeaderRow.tsx#HeaderRow"]={docgenInfo:pn.__docgenInfo,name:"HeaderRow",path:"src/components/Table/HeaderRow.tsx#HeaderRow"})}catch(B){}const Ra=({cell:B,tableStyles:A,onCellFilterAdded:z,userProps:be})=>{var Me;const et=B.getCellProps(),tt=B.column.field;if(!(tt!=null&&tt.display))return null;et.style&&(et.style.minWidth=et.style.width,et.style.justifyContent=B.column.justifyContent);let vt=((Me=B.column.width)!=null?Me:24)-A.cellPadding*2;return B.render("Cell",{field:tt,tableStyles:A,onCellFilterAdded:z,cellProps:et,innerWidth:vt,userProps:be})};try{Ra.displayName="TableCell",Ra.__docgenInfo={description:"",displayName:"TableCell",props:{cell:{defaultValue:null,description:"",name:"cell",required:!0,type:{name:"Cell<{}, any>"}},tableStyles:{defaultValue:null,description:"",name:"tableStyles",required:!0,type:{name:"{ theme: GrafanaTheme2; cellHeight: number; buildCellContainerStyle: (color?: string | undefined, background?: string | undefined, overflowOnHover?: boolean | undefined) => string; ... 25 more ...; expanderCell: string; }"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},columnIndex:{defaultValue:null,description:"",name:"columnIndex",required:!0,type:{name:"number"}},columnCount:{defaultValue:null,description:"",name:"columnCount",required:!0,type:{name:"number"}},userProps:{defaultValue:null,description:"",name:"userProps",required:!1,type:{name:"object"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/TableCell.tsx#TableCell"]={docgenInfo:Ra.__docgenInfo,name:"TableCell",path:"src/components/Table/TableCell.tsx#TableCell"})}catch(B){}function jo(B,A){(0,n.useEffect)(()=>{var z,be,Me;const et=(z=B.current)==null?void 0:z.querySelector(".track-vertical"),tt=(be=A.current)==null?void 0:be.firstChild;tt&&et&&(et==null||et.remove(),(Me=tt.querySelector(":scope > .track-vertical"))==null||Me.remove(),tt.append(et))})}function Oo(B,A,z){(0,n.useEffect)(()=>{var be;if(B.lastExpandedIndex!==void 0){(be=A.current)==null||be.resetAfterIndex(Math.max(B.lastExpandedIndex-1,0));return}},[B.lastExpandedIndex,B.toggleRowExpandedCounter,A,z])}var ai=Object.defineProperty,oi=Object.defineProperties,ri=Object.getOwnPropertyDescriptors,Or=Object.getOwnPropertySymbols,ii=Object.prototype.hasOwnProperty,li=Object.prototype.propertyIsEnumerable,Er=(B,A,z)=>A in B?ai(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,si=(B,A)=>{for(var z in A||(A={}))ii.call(A,z)&&Er(B,z,A[z]);if(Or)for(var z of Or(A))li.call(A,z)&&Er(B,z,A[z]);return B},ci=(B,A)=>oi(B,ri(A));function di({onColumnResize:B,onSortByChange:A,data:z}){return(0,n.useCallback)((be,Me)=>{switch(Me.type){case"columnDoneResizing":if(B){const tt=be.columnResizing.headerIdWidths[0][0],vt=parseInt(tt,10),Ct=Math.round(be.columnResizing.columnWidths[tt]),kt=z.fields[vt];if(!kt)return be;const At=(0,qe.C)(kt,z);B(At,Ct)}case"toggleSortBy":if(A){const et=[];for(const tt of be.sortBy){const vt=z.fields[parseInt(tt.id,10)];!vt||et.push({displayName:(0,qe.C)(vt,z),desc:tt.desc})}A(et)}case"toggleRowExpanded":if(Me.id)return ci(si({},be),{lastExpandedIndex:parseInt(Me.id,10),toggleRowExpandedCounter:be.toggleRowExpandedCounter+1})}return be},[z,B,A])}function ui(B,A){const z={toggleRowExpandedCounter:0};if(B){z.sortBy=[];for(const be of B)for(const Me of A)Me.Header===be.displayName&&z.sortBy.push({id:Me.id,desc:be.desc})}return z}function pi(B,A){const z=B.colors.border.weak,be=B.colors.primary.border,Me=6,et=mi(B,A,Me),tt=et+2,vt=28,Ct=B.colors.emphasize(B.colors.background.primary,.03),kt=(At,jt,nn)=>{const Nt={margin:B.spacing(0,-.5,0,.5)},$t={position:"absolute",top:0,right:0,margin:"auto"},jn={overflow:"visible",width:"auto !important",boxShadow:`0 0 2px ${B.colors.primary.main}`,background:jt!=null?jt:Ct,zIndex:1};return M.iv`
      label: ${nn?"cellContainerOverflow":"cellContainerNoOverflow"};
      padding: ${Me}px;
      width: 100%;
      // Cell height need to account for row border
      height: ${tt-1}px;
      display: flex;
      align-items: center;
      border-right: 1px solid ${z};

      ${At?`color: ${At};`:""};
      ${jt?`background: ${jt};`:""};
      background-clip: padding-box;

      &:last-child:not(:only-child) {
        border-right: none;
      }

      &:hover {
        ${nn&&jn};
        .cellActions {
          visibility: visible;
          opacity: 1;
          width: auto;
        }
      }

      a {
        color: inherit;
      }

      .cellActions {
        display: flex;
        ${nn?Nt:$t}
        visibility: hidden;
        opacity: 0;
        width: 0;
        align-items: center;
        height: 100%;
        padding: ${B.spacing(1,.5,1,.5)};
        background: ${jt?"none":B.colors.emphasize(B.colors.background.primary,.03)};

        svg {
          color: ${At};
        }
      }

      .cellActionsLeft {
        right: auto !important;
        left: 0;
      }

      .cellActionsTransparent {
        background: none;
      }
    `};return{theme:B,cellHeight:et,buildCellContainerStyle:kt,cellPadding:Me,cellHeightInner:et-Me*2,rowHeight:tt,table:M.iv`
      height: 100%;
      width: 100%;
      overflow: auto;
      display: flex;
      flex-direction: column;
    `,thead:M.iv`
      label: thead;
      height: ${vt}px;
      overflow-y: auto;
      overflow-x: hidden;
      position: relative;
    `,tfoot:M.iv`
      label: tfoot;
      height: ${vt}px;
      border-top: 1px solid ${z};
      overflow-y: auto;
      overflow-x: hidden;
      position: relative;
    `,headerRow:M.iv`
      label: row;
      border-bottom: 1px solid ${z};
    `,headerCell:M.iv`
      height: 100%;
      padding: 0 ${Me}px;
      overflow: hidden;
      white-space: nowrap;
      display: flex;
      align-items: center;
      font-weight: ${B.typography.fontWeightMedium};

      &:last-child {
        border-right: none;
      }
    `,headerCellLabel:M.iv`
      border: none;
      padding: 0;
      background: inherit;
      cursor: pointer;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      font-weight: ${B.typography.fontWeightMedium};
      display: flex;
      align-items: center;
      margin-right: ${B.spacing(.5)};

      &:hover {
        text-decoration: underline;
        color: ${B.colors.text.link};
      }
    `,cellContainer:kt(void 0,void 0,!0),cellContainerNoOverflow:kt(void 0,void 0,!1),cellText:M.iv`
      overflow: hidden;
      text-overflow: ellipsis;
      user-select: text;
      white-space: nowrap;
    `,sortIcon:M.iv`
      margin-left: ${B.spacing(.5)};
    `,cellLink:M.iv`
      cursor: pointer;
      overflow: hidden;
      text-overflow: ellipsis;
      user-select: text;
      white-space: nowrap;
      color: ${B.colors.text.link};
      font-weight: ${B.typography.fontWeightMedium};
      &:hover {
        text-decoration: underline;
        color: ${B.colors.text.link};
      }
    `,cellLinkForColoredCell:M.iv`
      cursor: pointer;
      overflow: hidden;
      text-overflow: ellipsis;
      user-select: text;
      white-space: nowrap;
      font-weight: ${B.typography.fontWeightMedium};
      text-decoration: underline;
    `,imageCellLink:M.iv`
      cursor: pointer;
      overflow: hidden;
      height: 100%;
    `,headerFilter:M.iv`
      background: transparent;
      border: none;
      label: headerFilter;
      padding: 0;
    `,paginationWrapper:M.iv`
      display: flex;
      height: ${et}px;
      justify-content: center;
      align-items: center;
      width: 100%;
      li {
        margin-bottom: 0;
      }
    `,paginationSummary:M.iv`
      color: ${B.colors.text.secondary};
      font-size: ${B.typography.bodySmall.fontSize};
      display: flex;
      justify-content: flex-end;
      padding: ${B.spacing(0,1,0,2)};
    `,tableContentWrapper:At=>{const jt=At!==void 0?`${At}px`:"100%";return M.iv`
        label: tableContentWrapper;
        width: ${jt};
        display: flex;
        flex-direction: column;
      `},row:M.iv`
      label: row;
      border-bottom: 1px solid ${z};

      &:hover {
        background-color: ${Ct};
      }

      &:last-child {
        border-bottom: 0;
      }
    `,imageCell:M.iv`
      height: 100%;
    `,resizeHandle:M.iv`
      label: resizeHandle;
      cursor: col-resize !important;
      display: inline-block;
      background: ${be};
      opacity: 0;
      transition: opacity 0.2s ease-in-out;
      width: 8px;
      height: 100%;
      position: absolute;
      right: -4px;
      border-radius: ${B.shape.radius.default};
      top: 0;
      touch-action: none;

      &:hover {
        opacity: 1;
      }
    `,typeIcon:M.iv`
      margin-right: ${B.spacing(1)};
      color: ${B.colors.text.secondary};
    `,noData:M.iv`
      align-items: center;
      display: flex;
      height: 100%;
      justify-content: center;
      width: 100%;
    `,expanderCell:M.iv`
      display: flex;
      flex-direction: column;
      justify-content: center;
      height: ${tt}px;
      cursor: pointer;
    `}}function mi(B,A,z){const be=B.typography.fontSize,Me=B.typography.body.lineHeight;switch(A){case"md":return 42;case"lg":return 48;case"sm":default:return z*2+be*Me}}var fi=Object.defineProperty,gi=Object.defineProperties,hi=Object.getOwnPropertyDescriptors,Tr=Object.getOwnPropertySymbols,vi=Object.prototype.hasOwnProperty,bi=Object.prototype.propertyIsEnumerable,Pr=(B,A,z)=>A in B?fi(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,kr=(B,A)=>{for(var z in A||(A={}))vi.call(A,z)&&Pr(B,z,A[z]);if(Tr)for(var z of Tr(A))bi.call(A,z)&&Pr(B,z,A[z]);return B},Ir=(B,A)=>gi(B,hi(A));const yi=150,xi=36,Ba=(0,n.memo)(B=>{const{ariaLabel:A,data:z,subData:be,height:Me,onCellFilterAdded:et,width:tt,columnMinWidth:vt=yi,noHeader:Ct,resizable:kt=!0,initialSortBy:At,footerOptions:jt,showTypeIcons:nn,footerValues:Nt,enablePagination:$t,cellHeight:jn=u.Ss.Sm}=B,Vn=(0,n.useRef)(null),Ln=(0,n.useRef)(null),Kn=(0,n.useRef)(null),da=(0,p.l4)(),$n=pi(da,jn),Hr=Ct?0:$n.rowHeight,[go,qo]=(0,n.useState)(Nt),dl=(0,n.useMemo)(()=>{const Wn=xi;let qn=0;if(!go)return 0;for(const Zn of go)Array.isArray(Zn)&&Zn.length>qn&&(qn=Zn.length);return qn>1?Wn*qn:Wn},[go]),Ur=(0,n.useMemo)(()=>z.fields.length?Array(z.length).fill(0):[],[z]),yr=Boolean((jt==null?void 0:jt.countRows)&&jt.reducer&&jt.reducer.length&&jt.reducer[0]===r.gz.count),xr=(0,n.useMemo)(()=>ur(z,tt,vt,!!(be!=null&&be.length),go,yr),[z,tt,vt,go,be,yr]),Kr=di(B),ul=(0,n.useMemo)(()=>({columns:xr,data:Ur,disableResizing:!kt,stateReducer:Kr,initialState:ui(At,xr),autoResetFilters:!1,sortTypes:{number:Ke,"alphanumeric-insensitive":Re}}),[At,xr,Ur,kt,Kr]),{getTableProps:pl,headerGroups:_r,footerGroups:ml,rows:Zo,prepareRow:$r,totalColumnsWidth:qr,page:wr,state:to,gotoPage:Zr,setPageSize:Gr,pageOptions:fl}=(0,s.useTable)(ul,s.useFilters,s.useSortBy,s.useAbsoluteLayout,s.useResizeColumns,s.useExpanded,s.usePagination),gl=to;(0,n.useEffect)(()=>{jt||qo(Nt)},[Nt,jt]),(0,n.useEffect)(()=>{var Wn,qn,Zn;if(!jt)return;if(!jt.show){qo(void 0);return}if(yr){const wa=[];wa[0]=(Zn=(qn=(Wn=_r[0])==null?void 0:Wn.headers[0])==null?void 0:qn.filteredRows.length.toString())!=null?Zn:z.length.toString(),qo(wa);return}const Ea=ot(_r[0].headers,Tt(Zo),jt,da);qo(Ea)},[jt,da,to.filters,z]);let Sr=Me-(Hr+dl);$t&&(Sr-=$n.cellHeight);const Cr=Math.round(Sr/$n.rowHeight)-1;(0,n.useEffect)(()=>{Cr<=0||Gr(Cr)},[Cr,Gr]),Oo(gl,Vn,z),jo(Kn,Ln);const Yr=(0,n.useCallback)(Wn=>{var qn,Zn;if(to.expanded[Wn]){const Ea=be==null?void 0:be.find(wa=>{var ho,Ro;return((Ro=(ho=wa.meta)==null?void 0:ho.custom)==null?void 0:Ro.parentRowIndex)===Wn});if(Ea){const wa=!!((Zn=(qn=Ea.meta)==null?void 0:qn.custom)!=null&&Zn.noHeader),ho={height:$n.rowHeight*(Ea.length+(wa?0:1)),background:da.colors.emphasize(da.colors.background.primary,.015),paddingLeft:so,position:"absolute",bottom:0};return n.createElement("div",{style:ho},n.createElement(Ba,{data:Ea,width:tt-so,height:$n.rowHeight*(Ea.length+1),noHeader:wa}))}}return null},[to.expanded,be,$n.rowHeight,da.colors,tt]),hl=(0,n.useCallback)(({index:Wn,style:qn})=>{let Zn=Zo[Wn];return $t&&(Zn=wr[Wn]),$r(Zn),n.createElement("div",Ir(kr({},Zn.getRowProps({style:qn})),{className:$n.row}),Yr(Wn),Zn.cells.map((Ea,wa)=>n.createElement(Ra,{key:wa,tableStyles:$n,cell:Ea,onCellFilterAdded:et,columnIndex:wa,columnCount:Zn.cells.length})))},[et,wr,$t,$r,Zo,$n,Yr]),vl=(0,n.useCallback)(Wn=>{Zr(Wn-1)},[Zr]),Xr=$t?wr.length:Zo.length;let Jr=null;if($t){const Wn=to.pageIndex*to.pageSize+1;let qn=Wn+to.pageSize-1;const Zn=tt<550;qn>z.length&&(qn=z.length),Jr=n.createElement("div",{className:$n.paginationWrapper},n.createElement(k.t,{currentPage:to.pageIndex+1,numberOfPages:fl.length,showSmallVersion:Zn,onNavigate:vl}),Zn?null:n.createElement("div",{className:$n.paginationSummary},Wn," - ",qn," of ",z.length," rows"))}const bl=Wn=>{var qn,Zn;if(to.expanded[Wn]){const Ea=be==null?void 0:be.find(wa=>{var ho,Ro;return((Ro=(ho=wa.meta)==null?void 0:ho.custom)==null?void 0:Ro.parentRowIndex)===Wn});if(Ea){const wa=!!((Zn=(qn=Ea.meta)==null?void 0:qn.custom)!=null&&Zn.noHeader);return $n.rowHeight*(Ea.length+1+(wa?0:1))}}return $n.rowHeight},yl=Wn=>{const{scrollTop:qn}=Wn.target;Vn.current!==null&&Vn.current.scrollTo(qn)};return n.createElement("div",Ir(kr({},pl()),{className:$n.table,"aria-label":A,role:"table",ref:Ln}),n.createElement(S.$,{hideVerticalTrack:!0},n.createElement("div",{className:$n.tableContentWrapper(qr)},!Ct&&n.createElement(pn,{headerGroups:_r,showTypeIcons:nn,tableStyles:$n}),Xr>0?n.createElement("div",{ref:Kn},n.createElement(S.$,{onScroll:yl,hideHorizontalTrack:!0},n.createElement(o.S_,{key:$n.rowHeight,height:Sr,itemCount:Xr,itemSize:bl,width:"100%",ref:Vn,style:{overflow:void 0}},hl))):n.createElement("div",{style:{height:Me-Hr},className:$n.noData},"No data"),go&&n.createElement(P,{isPaginationVisible:Boolean($t),footerValues:go,footerGroups:ml,totalColumnsWidth:qr,tableStyles:$n}))),Jr)});Ba.displayName="Table";try{Ba.displayName="Table",Ba.__docgenInfo={description:"",displayName:"Table",props:{ariaLabel:{defaultValue:null,description:"",name:"ariaLabel",required:!1,type:{name:"string"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"DataFrame"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"number"}},columnMinWidth:{defaultValue:null,description:"Minimal column width specified in pixels",name:"columnMinWidth",required:!1,type:{name:"number"}},noHeader:{defaultValue:null,description:"",name:"noHeader",required:!1,type:{name:"boolean"}},showTypeIcons:{defaultValue:null,description:"",name:"showTypeIcons",required:!1,type:{name:"boolean"}},resizable:{defaultValue:null,description:"",name:"resizable",required:!1,type:{name:"boolean"}},initialSortBy:{defaultValue:null,description:"",name:"initialSortBy",required:!1,type:{name:"TableSortByFieldState[]"}},onColumnResize:{defaultValue:null,description:"",name:"onColumnResize",required:!1,type:{name:"TableColumnResizeActionCallback"}},onSortByChange:{defaultValue:null,description:"",name:"onSortByChange",required:!1,type:{name:"TableSortByActionCallback"}},onCellFilterAdded:{defaultValue:null,description:"",name:"onCellFilterAdded",required:!1,type:{name:"TableFilterActionCallback"}},footerOptions:{defaultValue:null,description:"",name:"footerOptions",required:!1,type:{name:"TableFooterCalc"}},footerValues:{defaultValue:null,description:"",name:"footerValues",required:!1,type:{name:"FooterItem[]"}},enablePagination:{defaultValue:null,description:"",name:"enablePagination",required:!1,type:{name:"boolean"}},cellHeight:{defaultValue:null,description:"",name:"cellHeight",required:!1,type:{name:"enum",value:[{value:'"lg"'},{value:'"md"'},{value:'"sm"'}]}},subData:{defaultValue:null,description:"@alpha",name:"subData",required:!1,type:{name:"DataFrame[]"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/Table.tsx#Table"]={docgenInfo:Ba.__docgenInfo,name:"Table",path:"src/components/Table/Table.tsx#Table"})}catch(B){}var _i=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts"),wi=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/matchers.ts"),Si=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/fieldColor.ts"),mr=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/location.ts"),Ci=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/url.ts");const Ol={keepTime:"__url_time_range",timeRangeFrom:"__from",timeRangeTo:"__to",includeVars:"__all_variables",seriesName:"__series.name",fieldName:"__field.name",valueTime:"__value.time",valueNumeric:"__value.numeric",valueText:"__value.text",valueRaw:"__value.raw",valueCalc:"__value.calc"};function Oi(B){var A,z;const{onClickFn:be,replaceVariables:Me,link:et,scopedVars:tt,range:vt,field:Ct,internalLink:kt}=B,At=Mr((A=et.internal)==null?void 0:A.query,tt,Me),jt=Mr((z=et.internal)==null?void 0:z.panelsState,tt,Me),nn=et.title?et.title:kt.datasourceName;return{title:Me(nn,tt),href:Ei(kt.datasourceUid,At,vt,jt),onClick:be?()=>{be({datasourceUid:kt.datasourceUid,query:At,panelsState:jt,range:vt})}:void 0,target:et!=null&&et.targetBlank?"_blank":"_self",origin:Ct}}function Ei(B,A,z,be){return mr.u.assureBaseUrl(`/explore?left=${encodeURIComponent((0,Ci.S)({range:z.raw,datasource:B,queries:[A],panelsState:be}))}`)}function Mr(B,A,z){if(!B)return B;if(typeof B=="string")return z(B,A);const be=JSON.parse(JSON.stringify(B));return Br(be,A,z)}function Br(B,A,z){for(const be of Object.keys(B))typeof B[be]=="string"?B[be]=z(B[be],A):typeof B[be]=="object"&&B[be]!==null&&(B[be]=Br(B[be],A,z));return B}function Ti(B){return new Proxy({},{get:(A,z)=>{var be;let Me=B.frame.fields.find(Ct=>z===Ct.name);if(!Me){const Ct=(0,t.toNumber)(z);Me=B.frame.fields[Ct]}if(Me||(Me=B.frame.fields.find(Ct=>z===Ct.config.displayName)),Me||(Me=B.frame.fields.find(Ct=>Ct.labels?z===Ct.labels.name:!1)),!Me)return;const et=(be=Me.display)!=null?be:(0,ce.U_)(),tt=Me.values.get(B.rowIndex),vt=et(tt);return vt.toString=()=>(0,y.zc)(vt),vt}})}class Pi extends Sn.B{}const ki=new Pi,El=new Sn.B;var Ii=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/utils/labels.ts"),Mi=Object.defineProperty,Bi=Object.defineProperties,Ai=Object.getOwnPropertyDescriptors,Ar=Object.getOwnPropertySymbols,ji=Object.prototype.hasOwnProperty,Vi=Object.prototype.propertyIsEnumerable,jr=(B,A,z)=>A in B?Mi(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Li=(B,A)=>{for(var z in A||(A={}))ji.call(A,z)&&jr(B,z,A[z]);if(Ar)for(var z of Ar(A))Vi.call(A,z)&&jr(B,z,A[z]);return B},Ri=(B,A)=>Bi(B,Ai(A));function Di(B,A,z){return new Proxy({},{get:(be,Me)=>{if(Me==="name")return B.name;if(Me==="displayName")return(0,qe.C)(B,A,z);if(Me==="labels"||Me==="formattedLabels")return B.labels?Ri(Li({},B.labels),{__values:Object.values(B.labels).sort().join(", "),toString:()=>(0,Ii.aA)(B.labels,"",!0)}):""}})}var zi=Object.defineProperty,Fi=Object.defineProperties,Ni=Object.getOwnPropertyDescriptors,Vr=Object.getOwnPropertySymbols,Wi=Object.prototype.hasOwnProperty,Hi=Object.prototype.propertyIsEnumerable,Lr=(B,A,z)=>A in B?zi(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,qa=(B,A)=>{for(var z in A||(A={}))Wi.call(A,z)&&Lr(B,z,A[z]);if(Vr)for(var z of Vr(A))Hi.call(A,z)&&Lr(B,z,A[z]);return B},Eo=(B,A)=>Fi(B,Ni(A));function Ui(B){let A=null,z=null;const be=[r.gz.min,r.gz.max];for(const Me of B)for(const et of Me.fields)if(et.type===a.fS.number){const tt=(0,r.Kx)({field:et,reducers:be}),vt=tt[r.gz.min],Ct=tt[r.gz.max];(A===null||vt<A)&&(A=vt),(z===null||Ct>z)&&(z=Ct)}return{min:A,max:z,delta:(z!=null?z:0)-(A!=null?A:0)}}function Rr(B){var A;if(!B.data)return[];const z=B.fieldConfig;if(!z)return B.data;const be=(A=B.fieldConfigRegistry)!=null?A:ki;let Me=0,et;const tt=[];if(z.overrides)for(const vt of z.overrides){const Ct=wi.Ls.get(vt.matcher.id);Ct&&tt.push({match:Ct.get(vt.matcher.options),properties:vt.properties})}return B.data.map((vt,Ct)=>{var kt,At;const jt=qa({},vt);jt.fields=jt.fields.map(Nt=>Eo(qa({},Nt),{config:(0,t.cloneDeep)(Nt.config),state:qa({},Nt.state)}));const nn={__series:{text:"Series",value:{name:(0,qe.n)(jt,Ct)}}};for(const Nt of jt.fields){const $t=Nt.config;Nt.state.scopedVars=Eo(qa({},nn),{__field:{text:"Field",value:Di(Nt,jt,B.data)}});const jn={field:Nt,data:B.data,dataFrameIndex:Ct,replaceVariables:B.replaceVariables,fieldConfigRegistry:be};qi($t,z.defaults,jn);for(const Kn of tt)if(Kn.match(Nt,jt,B.data))for(const da of Kn.properties)$i($t,da,jn);let Vn=Nt.type;if(!Vn||Vn===a.fS.other){const Kn=(0,l.fu)(Nt);Kn&&(Vn=Kn)}let Ln;if(Nt.type===a.fS.number){!et&&(!(0,t.isNumber)($t.min)||!(0,t.isNumber)($t.max))&&(et=Ui(B.data));const Kn=(kt=$t.min)!=null?kt:et.min,da=(At=$t.max)!=null?At:et.max;Ln={min:Kn,max:da,delta:da-Kn}}Nt.state.seriesIndex=Me,Nt.state.range=Ln,Nt.type=Vn,Nt.type!==a.fS.time&&Me++,Nt.display=(0,ce.U_)({field:Nt,theme:B.theme,timeZone:B.timeZone}),Nt.config.unit!=="dateTimeFromNow"&&(Nt.display=Ki(Nt.display,2500)),Nt.getLinks=Yi(jt,Nt,Nt.state.scopedVars,jn.replaceVariables,B.timeZone)}return jt})}function Ki(B,A=2500){const z=new Map;for(let be=-1;be<=15;be++)z.set(be,new Map);return(be,Me)=>{let et=z.get(Me!=null?Me:-1),tt=et.get(be);return tt||(et.size===A&&et.clear(),tt=B(be,Me),tt.color&&(tt.color=(0,_i.k$)(tt.color)),et.set(be,tt)),tt}}function $i(B,A,z){const Me=z.fieldConfigRegistry.getIfExists(A.id);if(!Me)return;const et=Me.process(A.value,z,Me.settings);et==null?Me.isCustom&&B.custom?(0,t.unset)(B.custom,Me.path):(0,t.unset)(B,Me.path):Me.isCustom?(B.custom||(B.custom={}),(0,t.set)(B.custom,Me.path,et)):(0,t.set)(B,Me.path,et)}function qi(B,A,z){B.links&&A.links&&(B.links=[...B.links,...A.links]);for(const be of z.fieldConfigRegistry.list())be.isCustom&&!B.custom&&(B.custom={}),Zi(be.isCustom?B.custom:B,be.isCustom?A.custom:A,be,z);Gi(B)}function Zi(B,A,z,be){const Me=(0,t.get)(B,z.path);if(Me==null){const et=be.fieldConfigRegistry.getIfExists(z.id);if(!et)return;if(et&&et.shouldApply(be.field)){const tt=et.process((0,t.get)(A,et.path),be,et.settings);tt!=null&&(0,t.set)(B,et.path,tt)}}}function Gi(B){const{thresholds:A}=B;if(B.color?B.color.mode||delete B.color:A&&(B.color={mode:Si.S.Thresholds}),B.hasOwnProperty("min")&&B.hasOwnProperty("max")&&B.min>B.max){const z=B.max;B.max=B.min,B.min=z}}const Yi=(B,A,z,be,Me)=>et=>!A.config.links||A.config.links.length===0?[]:A.config.links.map(tt=>{var vt;let Ct={},kt={value:{frame:B,field:A}};if(et.valueRowIndex!==void 0&&!isNaN(et.valueRowIndex)){kt.value.rowIndex=et.valueRowIndex;const Nt=Ti({frame:B,rowIndex:et.valueRowIndex,timeZone:Me});Ct={__data:{value:{name:B.name,refId:B.refId,fields:Nt},text:"Data"}}}else kt.value.calculatedValue=et.calculatedValue;const At=Eo(qa(qa({},z),Ct),{__dataContext:kt});if(tt.onClick)return{href:tt.url,title:be(tt.title||"",At),target:tt.targetBlank?"_blank":void 0,onClick:(Nt,$t)=>{tt.onClick({origin:$t!=null?$t:A,e:Nt,replaceVariables:jn=>be(jn,At)})},origin:A};if(tt.internal)return Oi({link:tt,internalLink:tt.internal,scopedVars:At,field:A,range:(vt=tt.internal.range)!=null?vt:{},replaceVariables:be});let jt=tt.onBuildUrl?tt.onBuildUrl({origin:A,replaceVariables:be}):tt.url;return jt&&(jt=mr.u.assureBaseUrl(jt.replace(/\n/g,"")),jt=be(jt,At,u.b8.UriEncode),jt=mr.u.processUrl(jt)),{href:jt,title:be(tt.title||"",At),target:tt.targetBlank?"_blank":void 0,origin:A}});function Tl(B){if(!B||B.length===0)return[];const A=[...B],z=getRawDisplayProcessor();for(let be=0;be<A.length;be++){const Me=qa({},A[be]),et=[...Me.fields];for(let tt=0;tt<et.length;tt++)et[tt]=Eo(qa({},et[tt]),{display:z});A[be]=Eo(qa({},Me),{fields:et})}return A}function Pl(B,A,z,be,Me,et){const tt=B==null?void 0:B.fieldConfigRegistry,vt=useRef(0),Ct=usePrevious(z==null?void 0:z.series);return useMemo(()=>{if(!tt||!A||!z)return;const kt=z==null?void 0:z.series;return z.structureRev==null&&kt&&Ct&&!compareArrayValues(kt,Ct,compareDataFrameStructures)&&vt.current++,Eo(qa({structureRev:vt.current},z),{series:Rr({data:kt,fieldConfig:A,fieldConfigRegistry:tt,replaceVariables:et,theme:Me,timeZone:be})})},[tt,A,z,Ct,be,Me,et])}function Dr(B,A){return Rr({data:B,fieldConfig:{overrides:[],defaults:{}},theme:A,replaceVariables:z=>z})}var Xi=e("./src/utils/storybook/withCenteredStory.tsx"),ra=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),zr=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),Ji=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function Fr(B){const A=Object.assign({h1:"h1",p:"p",h2:"h2",code:"code",ul:"ul",li:"li",strong:"strong"},(0,zr.ah)(),B.components);return(0,ra.jsxs)(ra.Fragment,{children:[(0,ra.jsx)(A.h1,{children:"Table"}),`
`,(0,ra.jsx)(A.p,{children:"Used for displaying tabular data"}),`
`,(0,ra.jsx)(A.h2,{children:"Sub-tables"}),`
`,(0,ra.jsxs)(A.p,{children:["Sub-tables are supported through the usage of the prop ",(0,ra.jsx)(A.code,{children:"subData"}),` Dataframe array.
The frames are linked to each row using the following custom properties under `,(0,ra.jsx)(A.code,{children:"dataframe.meta.custom"})]}),`
`,(0,ra.jsxs)(A.ul,{children:[`
`,(0,ra.jsxs)(A.li,{children:[(0,ra.jsx)(A.strong,{children:"parentRowIndex"}),": number - The index of the parent row in the main dataframe (under the ",(0,ra.jsx)(A.code,{children:"data"})," prop of the Table component)"]}),`
`,(0,ra.jsxs)(A.li,{children:[(0,ra.jsx)(A.strong,{children:"noHeader"}),": boolean - Sets the noHeader of each sub-table"]}),`
`]}),`
`,(0,ra.jsx)(A.h2,{children:"Usage"}),`
`,(0,ra.jsx)(Ji.xP,{of:Ba})]})}function Qi(B={}){const{wrapper:A}=Object.assign({},(0,zr.ah)(),B.components);return A?(0,ra.jsx)(A,Object.assign({},B,{children:(0,ra.jsx)(Fr,B)})):Fr(B)}var el=Qi,tl=Object.defineProperty,nl=Object.defineProperties,al=Object.getOwnPropertyDescriptors,Nr=Object.getOwnPropertySymbols,ol=Object.prototype.hasOwnProperty,rl=Object.prototype.propertyIsEnumerable,Wr=(B,A,z)=>A in B?tl(B,A,{enumerable:!0,configurable:!0,writable:!0,value:z}):B[A]=z,Aa=(B,A)=>{for(var z in A||(A={}))ol.call(A,z)&&Wr(B,z,A[z]);if(Nr)for(var z of Nr(A))rl.call(A,z)&&Wr(B,z,A[z]);return B},Vo=(B,A)=>nl(B,al(A)),kl=null,Il={Basic:{startLoc:{col:51,line:187},endLoc:{col:1,line:196},startBody:{col:51,line:187},endBody:{col:1,line:196}},BarGaugeCell:{startLoc:{col:58,line:198},endLoc:{col:1,line:215},startBody:{col:58,line:198},endBody:{col:1,line:215}},ColoredCells:{startLoc:{col:58,line:217},endLoc:{col:1,line:234},startBody:{col:58,line:217},endBody:{col:1,line:234}},Footer:{startLoc:{col:52,line:236},endLoc:{col:1,line:246},startBody:{col:52,line:236},endBody:{col:1,line:246}},Pagination:{startLoc:{col:56,line:248},endLoc:{col:85,line:248},startBody:{col:56,line:248},endBody:{col:85,line:248}},SubTables:{startLoc:{col:55,line:253},endLoc:{col:1,line:270},startBody:{col:55,line:253},endBody:{col:1,line:270}}};const il={title:"Visualizations/Table",component:Ba,decorators:[Xi.BU],parameters:{controls:{exclude:["onColumnResize","onSortByChange","onCellFilterAdded","ariaLabel","data","initialSortBy"]},docs:{page:el}},args:{width:700,height:500,columnMinWidth:130}};function Lo(B,A){const z=new v({fields:[{name:"Time",type:a.fS.time,values:[]},{name:"Quantity",type:a.fS.number,values:[],config:{decimals:0,custom:{align:"center",width:80}}},{name:"Status",type:a.fS.string,values:[]},{name:"Value",type:a.fS.number,values:[],config:{decimals:2}},{name:"Progress",type:a.fS.number,values:[],config:{unit:"percent",min:0,max:100,custom:{width:150}}}]});for(const be of z.fields)be.config=(0,t.merge)(be.config,A[be.name]);for(let be=0;be<1e3;be++)z.appendRow([new Date().getTime(),Math.random()*2,Math.random()>.7?"Active":"Cancelled",Math.random()*100,Math.random()*100]);return Dr([z],B)[0]}function ll(B,A){const z=[];for(let be=0;be<1e3;be++){const Me=new v({meta:{custom:{parentRowIndex:be}},fields:[{name:"Time",type:a.fS.time,values:[]},{name:"Quantity",type:a.fS.number,values:[],config:{decimals:0,custom:{align:"center"}}},{name:"Quality",type:a.fS.string,values:[]},{name:"Progress",type:a.fS.number,values:[],config:{unit:"percent",min:0,max:100}}]});for(const et of Me.fields)et.config=(0,t.merge)(et.config,A[et.name]);for(let et=0;et<Math.random()*4+1;et++)Me.appendRow([new Date().getTime(),Math.random()*2,Math.random()>.7?"Good":"Bad",Math.random()*100]);z.push(Me)}return Dr(z,B)}function sl(B){const z=B.fields[3].values.toArray().reduce((kt,At)=>kt+At,0),be=B.fields[3],Me=be.display?be.display(z):z,tt={sum:be.display?(0,y.zc)(Me):Me},vt={min:String(5.2)};return["Totals","10",void 0,[tt,vt],"100%"]}const fr={steps:[{color:"blue",value:-1/0},{color:"green",value:20}],mode:h.H.Absolute},Ko=B=>{const A=(0,p.l4)(),z=Lo(A,{});return n.createElement("div",{className:"panel-container",style:{width:"auto"}},n.createElement(Ba,Vo(Aa({},B),{data:z})))},gr=B=>{const A=(0,p.l4)(),z=Lo(A,{Progress:{custom:{width:200,displayMode:"gradient-gauge"},thresholds:fr}});return n.createElement("div",{className:"panel-container",style:{width:"auto"}},n.createElement(Ba,Vo(Aa({},B),{data:z})))},hr=B=>{const A=(0,p.l4)(),z=Lo(A,{Progress:{custom:{width:80,displayMode:"color-background"},thresholds:fr}});return n.createElement("div",{className:"panel-container",style:{width:"auto"}},n.createElement(Ba,Vo(Aa({},B),{data:z})))},vr=B=>{const A=(0,p.l4)(),z=Lo(A,{}),be=sl(z);return n.createElement("div",{className:"panel-container",style:{width:"auto",height:"unset"}},n.createElement(Ba,Vo(Aa({},B),{data:z,footerValues:be})))},$o=B=>n.createElement(Ko,Aa({},B));$o.args={enablePagination:!0};const br=B=>{const A=(0,p.l4)(),z=Lo(A,{}),be=ll(A,{Progress:{custom:{displayMode:"gradient-gauge"},thresholds:fr}});return n.createElement("div",{className:"panel-container",style:{width:"auto",height:"unset"}},n.createElement(Ba,Vo(Aa({},B),{data:z,subData:be})))};var cl=il;Ko.parameters=Aa({storySource:{source:`(args) => {
  const theme = useTheme2();
  const data = buildData(theme, {});

  return (
    <div className="panel-container" style={{ width: 'auto' }}>
      <Table {...args} data={data} />
    </div>
  );
}`}},Ko.parameters),gr.parameters=Aa({storySource:{source:`(args) => {
  const theme = useTheme2();
  const data = buildData(theme, {
    Progress: {
      custom: {
        width: 200,
        displayMode: 'gradient-gauge',
      },
      thresholds: defaultThresholds,
    },
  });

  return (
    <div className="panel-container" style={{ width: 'auto' }}>
      <Table {...args} data={data} />
    </div>
  );
}`}},gr.parameters),hr.parameters=Aa({storySource:{source:`(args) => {
  const theme = useTheme2();
  const data = buildData(theme, {
    Progress: {
      custom: {
        width: 80,
        displayMode: 'color-background',
      },
      thresholds: defaultThresholds,
    },
  });

  return (
    <div className="panel-container" style={{ width: 'auto' }}>
      <Table {...args} data={data} />
    </div>
  );
}`}},hr.parameters),vr.parameters=Aa({storySource:{source:`(args) => {
  const theme = useTheme2();
  const data = buildData(theme, {});
  const footer = buildFooterData(data);

  return (
    <div className="panel-container" style={{ width: 'auto', height: 'unset' }}>
      <Table {...args} data={data} footerValues={footer} />
    </div>
  );
}`}},vr.parameters),$o.parameters=Aa({storySource:{source:"(args) => <Basic {...args} />"}},$o.parameters),br.parameters=Aa({storySource:{source:`(args) => {
  const theme = useTheme2();
  const data = buildData(theme, {});
  const subData = buildSubTablesData(theme, {
    Progress: {
      custom: {
        displayMode: 'gradient-gauge',
      },
      thresholds: defaultThresholds,
    },
  });

  return (
    <div className="panel-container" style={{ width: 'auto', height: 'unset' }}>
      <Table {...args} data={data} subData={subData} />
    </div>
  );
}`}},br.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Table/Table.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Table/Table.story.tsx#ComponentMeta"})}catch(B){}},"./src/components/Tabs/Tabs.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Counter:function(){return D},Simple:function(){return k},default:function(){return M}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/Tabs/TabsBar.tsx"),a=e("./src/components/Tabs/Tab.tsx"),l=e("./src/components/Tabs/TabContent.tsx"),f=e("./src/components/Tabs/Counter.tsx"),x=e("./src/utils/storybook/DashboardStoryCanvas.tsx"),d=e("./src/utils/storybook/withCenteredStory.tsx"),i=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),c=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),E=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function O(I){const T=Object.assign({h1:"h1",p:"p",code:"code",strong:"strong"},(0,c.ah)(),I.components);return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(T.h1,{children:"TabsBar"}),`
`,(0,i.jsx)(T.p,{children:"A composition component for rendering a TabBar with Tabs for navigation."}),`
`,(0,i.jsxs)(T.p,{children:["It has two modes - navigation and onClick. Navigation renders it as a simple ",(0,i.jsx)(T.code,{children:"<a>"})," element. To enable it, use the ",(0,i.jsx)(T.code,{children:"href"})," prop. The onClick mode uses an onClick handler instead. To enable it, use the ",(0,i.jsx)(T.code,{children:"onChangeTab"})," prop."]}),`
`,(0,i.jsxs)(T.p,{children:[(0,i.jsx)(T.strong,{children:"Warning!"})," Using ",(0,i.jsx)(T.code,{children:"href"})," and ",(0,i.jsx)(T.code,{children:"onChangeTab"})," at the same time may have unintended consequences."]}),`
`,(0,i.jsx)(T.h1,{children:"Tab"}),`
`,(0,i.jsx)(E.$4,{of:a.O}),`
`,(0,i.jsx)(T.h1,{children:"Counter"}),`
`,(0,i.jsx)(T.p,{children:"A count indicator displayed alongside tabs and showing numeric values."}),`
`,(0,i.jsx)(E.$4,{of:f.A})]})}function m(I={}){const{wrapper:T}=Object.assign({},(0,c.ah)(),I.components);return T?(0,i.jsx)(T,Object.assign({},I,{children:(0,i.jsx)(O,I)})):O(I)}var w=m,_=Object.defineProperty,C=Object.defineProperties,b=Object.getOwnPropertyDescriptors,g=Object.getOwnPropertySymbols,v=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable,h=(I,T,j)=>T in I?_(I,T,{enumerable:!0,configurable:!0,writable:!0,value:j}):I[T]=j,s=(I,T)=>{for(var j in T||(T={}))v.call(T,j)&&h(I,j,T[j]);if(g)for(var j of g(T))y.call(T,j)&&h(I,j,T[j]);return I},o=(I,T)=>C(I,b(T)),r=`import { Meta, Story } from '@storybook/react';
import React, { useState } from 'react';

import { TabsBar, Tab, TabContent, Counter as TabCounter } from '@grafana/ui';

import { DashboardStoryCanvas } from '../../utils/storybook/DashboardStoryCanvas';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { CounterProps } from './Counter';
import mdx from './TabsBar.mdx';

const meta: Meta = {
  title: 'Layout/Tabs',
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
  },
};

const tabs = [
  { label: '1st child', key: 'first', active: true },
  { label: '2nd child', key: 'second', active: false },
  { label: '3rd child', key: 'third', active: false },
];

export const Simple: Story = () => {
  const [state, updateState] = useState(tabs);
  return (
    <DashboardStoryCanvas>
      <TabsBar>
        {state.map((tab, index) => {
          return (
            <Tab
              key={index}
              label={tab.label}
              active={tab.active}
              onChangeTab={() => updateState(state.map((tab, idx) => ({ ...tab, active: idx === index })))}
              counter={(index + 1) * 1000}
            />
          );
        })}
      </TabsBar>
      <TabContent>
        {state[0].active && <div>First tab content</div>}
        {state[1].active && <div>Second tab content</div>}
        {state[2].active && <div>Third tab content</div>}
      </TabContent>
    </DashboardStoryCanvas>
  );
};

export const Counter: Story<CounterProps> = (args) => {
  return <TabCounter {...args} />;
};

Counter.args = {
  value: 10,
};

export default meta;
`,u={Simple:{startLoc:{col:29,line:28},endLoc:{col:1,line:52},startBody:{col:29,line:28},endBody:{col:1,line:52}},Counter:{startLoc:{col:44,line:54},endLoc:{col:1,line:56},startBody:{col:44,line:54},endBody:{col:1,line:56}}};const p={title:"Layout/Tabs",decorators:[d.BU],parameters:{docs:{page:w}}},S=[{label:"1st child",key:"first",active:!0},{label:"2nd child",key:"second",active:!1},{label:"3rd child",key:"third",active:!1}],k=()=>{const[I,T]=(0,t.useState)(S);return t.createElement(x.C,null,t.createElement(n.J,null,I.map((j,K)=>t.createElement(a.O,{key:K,label:j.label,active:j.active,onChangeTab:()=>T(I.map((F,$)=>o(s({},F),{active:$===K}))),counter:(K+1)*1e3}))),t.createElement(l.I,null,I[0].active&&t.createElement("div",null,"First tab content"),I[1].active&&t.createElement("div",null,"Second tab content"),I[2].active&&t.createElement("div",null,"Third tab content")))},D=I=>t.createElement(f.A,s({},I));D.args={value:10};var M=p;k.parameters=s({storySource:{source:`() => {
  const [state, updateState] = useState(tabs);
  return (
    <DashboardStoryCanvas>
      <TabsBar>
        {state.map((tab, index) => {
          return (
            <Tab
              key={index}
              label={tab.label}
              active={tab.active}
              onChangeTab={() => updateState(state.map((tab, idx) => ({ ...tab, active: idx === index })))}
              counter={(index + 1) * 1000}
            />
          );
        })}
      </TabsBar>
      <TabContent>
        {state[0].active && <div>First tab content</div>}
        {state[1].active && <div>Second tab content</div>}
        {state[2].active && <div>Third tab content</div>}
      </TabContent>
    </DashboardStoryCanvas>
  );
}`}},k.parameters),D.parameters=s({storySource:{source:`(args) => {
  return <TabCounter {...args} />;
}`}},D.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tabs/Tabs.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Tabs/Tabs.story.tsx#Meta"})}catch(I){}},"./src/components/Tags/Tag.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Single:function(){return s},default:function(){return o}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/components/Tags/Tag.tsx"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),x=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),d=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function i(r){const u=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,x.ah)(),r.components),{Meta:p}=u;return p||O("Meta",!0),(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(p,{title:"MDX|Tag",component:l.V}),`
`,(0,f.jsx)(u.h1,{children:"Tag"}),`
`,(0,f.jsx)(u.p,{children:"Used for displaying metadata, for example to add more details to search results. Background and border colors are generated from the tag name."}),`
`,(0,f.jsx)(d.MB,{children:(0,f.jsx)("div",{children:(0,f.jsx)(l.V,{name:"Tag",onClick:S=>console.log(S)})})}),`
`,(0,f.jsx)(u.h3,{children:"Usage"}),`
`,(0,f.jsx)(u.pre,{children:(0,f.jsx)(u.code,{className:"language-jsx",children:`import { Tag } from '@grafana/ui';

<Tag name="Tag" onClick={(name) => console.log(name)} />;
`})}),`
`,(0,f.jsx)(u.h3,{children:"Props"}),`
`,(0,f.jsx)(d.xP,{of:l.V})]})}function c(r={}){const{wrapper:u}=Object.assign({},(0,x.ah)(),r.components);return u?(0,f.jsx)(u,Object.assign({},r,{children:(0,f.jsx)(i,r)})):i(r)}var E=c;function O(r,u){throw new Error("Expected "+(u?"component":"object")+" `"+r+"` to be defined: you likely forgot to import, pass, or provide it.")}var m=Object.defineProperty,w=Object.getOwnPropertySymbols,_=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable,b=(r,u,p)=>u in r?m(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,g=(r,u)=>{for(var p in u||(u={}))_.call(u,p)&&b(r,p,u[p]);if(w)for(var p of w(u))C.call(u,p)&&b(r,p,u[p]);return r},v=`import { action } from '@storybook/addon-actions';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { Tag } from './Tag';
import mdx from './Tag.mdx';

const meta: ComponentMeta<typeof Tag> = {
  title: 'Forms/Tags/Tag',
  component: Tag,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['onClick'],
    },
  },
  args: {
    name: 'Tag',
    colorIndex: 0,
  },
};

export const Single: ComponentStory<typeof Tag> = (args) => {
  return <Tag name={args.name} colorIndex={args.colorIndex} onClick={action('Tag clicked')} icon={args.icon} />;
};

export default meta;
`,y={Single:{startLoc:{col:50,line:28},endLoc:{col:1,line:30},startBody:{col:50,line:28},endBody:{col:1,line:30}}};const h={title:"Forms/Tags/Tag",component:l.V,decorators:[a.BU],parameters:{docs:{page:E},controls:{exclude:["onClick"]}},args:{name:"Tag",colorIndex:0}},s=r=>n.createElement(l.V,{name:r.name,colorIndex:r.colorIndex,onClick:(0,t.action)("Tag clicked"),icon:r.icon});var o=h;s.parameters=g({storySource:{source:`(args) => {
  return <Tag name={args.name} colorIndex={args.colorIndex} onClick={action('Tag clicked')} icon={args.icon} />;
}`}},s.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tags/Tag.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Tags/Tag.story.tsx#ComponentMeta"})}catch(r){}},"./src/components/Tags/TagList.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{List:function(){return h},default:function(){return s}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/components/Tags/TagList.tsx"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),x=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),d=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function i(o){const r=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,x.ah)(),o.components);return(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(r.h1,{children:"TagList"}),`
`,(0,f.jsx)(r.p,{children:"List of tags with predefined margins and positioning."}),`
`,(0,f.jsx)(d.MB,{children:(0,f.jsx)(l.P,{tags:["datasource-test","gdev","mysql","mssql"]})}),`
`,(0,f.jsx)(r.h3,{children:"Usage"}),`
`,(0,f.jsx)(r.pre,{children:(0,f.jsx)(r.code,{className:"language-jsx",children:`import { TagList } from '@grafana/ui';
const tags = ['datasource-test', 'gdev', 'mysql', 'mssql'];

<TagList tags={tags} onClick={(tag) => console.log(tag)} />;
`})}),`
`,(0,f.jsx)(r.h3,{children:"Props"}),`
`,(0,f.jsx)(d.xP,{of:l.P})]})}function c(o={}){const{wrapper:r}=Object.assign({},(0,x.ah)(),o.components);return r?(0,f.jsx)(r,Object.assign({},o,{children:(0,f.jsx)(i,o)})):i(o)}var E=c,O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(o,r,u)=>r in o?O(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,b=(o,r)=>{for(var u in r||(r={}))w.call(r,u)&&C(o,u,r[u]);if(m)for(var u of m(r))_.call(r,u)&&C(o,u,r[u]);return o},g=`import { action } from '@storybook/addon-actions';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { TagList } from './TagList';
import mdx from './TagList.mdx';

const meta: ComponentMeta<typeof TagList> = {
  title: 'Forms/Tags/TagList',
  component: TagList,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['className', 'onClick', 'getAriaLabel'],
    },
  },
  args: {
    displayMax: 3,
    tags: ['datasource-test', 'gdev', 'mysql', 'mssql'],
    onClick: action('Tag clicked'),
  },
};

export const List: ComponentStory<typeof TagList> = (args) => {
  return (
    <div style={{ width: 300 }}>
      <TagList tags={args.tags} onClick={args.onClick} displayMax={args.displayMax} icon={args.icon} />
    </div>
  );
};

export default meta;
`,v={List:{startLoc:{col:52,line:29},endLoc:{col:1,line:35},startBody:{col:52,line:29},endBody:{col:1,line:35}}};const y={title:"Forms/Tags/TagList",component:l.P,decorators:[a.BU],parameters:{docs:{page:E},controls:{exclude:["className","onClick","getAriaLabel"]}},args:{displayMax:3,tags:["datasource-test","gdev","mysql","mssql"],onClick:(0,t.action)("Tag clicked")}},h=o=>n.createElement("div",{style:{width:300}},n.createElement(l.P,{tags:o.tags,onClick:o.onClick,displayMax:o.displayMax,icon:o.icon}));var s=y;h.parameters=b({storySource:{source:`(args) => {
  return (
    <div style={{ width: 300 }}>
      <TagList tags={args.tags} onClick={args.onClick} displayMax={args.displayMax} icon={args.icon} />
    </div>
  );
}`}},h.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tags/TagList.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Tags/TagList.story.tsx#ComponentMeta"})}catch(o){}},"./src/components/TagsInput/TagsInput.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return u},WithManyTags:function(){return p},default:function(){return S}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/StoryExample.tsx"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/components/Layout/Layout.tsx"),f=e("./src/components/TagsInput/TagsInput.tsx"),x=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),d=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),i=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function c(k){const D=Object.assign({h1:"h1",p:"p",h3:"h3"},(0,d.ah)(),k.components);return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(i.h_,{title:"MDX|TagsInput",component:f.B}),`
`,(0,x.jsx)(D.h1,{children:"TagsInput"}),`
`,(0,x.jsx)(D.p,{children:'A set of an input field and a button next to it that allows the user to add new tags. The added tags are previewed next to the input and can be removed by clicking the "X" icon. You can customize the width of the input.'}),`
`,(0,x.jsx)(D.h3,{children:"Props"}),`
`,(0,x.jsx)(i.xP,{of:f.B})]})}function E(k={}){const{wrapper:D}=Object.assign({},(0,d.ah)(),k.components);return D?(0,x.jsx)(D,Object.assign({},k,{children:(0,x.jsx)(c,k)})):c(k)}var O=E,m=Object.defineProperty,w=Object.defineProperties,_=Object.getOwnPropertyDescriptors,C=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,v=(k,D,M)=>D in k?m(k,D,{enumerable:!0,configurable:!0,writable:!0,value:M}):k[D]=M,y=(k,D)=>{for(var M in D||(D={}))b.call(D,M)&&v(k,M,D[M]);if(C)for(var M of C(D))g.call(D,M)&&v(k,M,D[M]);return k},h=(k,D)=>w(k,_(D)),s=null,o={Basic:{startLoc:{col:55,line:25},endLoc:{col:1,line:28},startBody:{col:55,line:25},endBody:{col:1,line:28}},WithManyTags:{startLoc:{col:28,line:30},endLoc:{col:1,line:39},startBody:{col:28,line:30},endBody:{col:1,line:39}}};const r={title:"Forms/TagsInput",component:f.B,decorators:[a.BU],parameters:{docs:{page:O},controls:{exclude:["onChange","className","tags"]}}},u=k=>{const[D,M]=(0,t.useState)([]);return t.createElement(f.B,h(y({},k),{tags:D,onChange:M}))},p=()=>{const[k,D]=(0,t.useState)(["dashboard","prod","server","frontend","game","kubernetes"]);return t.createElement(l.wc,null,t.createElement(n.E,{name:"With many tags"},t.createElement(f.B,{tags:k,onChange:D})))};var S=r;u.parameters=y({storySource:{source:`(props) => {
  const [tags, setTags] = useState<string[]>([]);
  return <TagsInput {...props} tags={tags} onChange={setTags} />;
}`}},u.parameters),p.parameters=y({storySource:{source:`() => {
  const [tags, setTags] = useState<string[]>(['dashboard', 'prod', 'server', 'frontend', 'game', 'kubernetes']);
  return (
    <VerticalGroup>
      <StoryExample name="With many tags">
        <TagsInput tags={tags} onChange={setTags} />
      </StoryExample>
    </VerticalGroup>
  );
}`}},p.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/TagsInput/TagsInput.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/TagsInput/TagsInput.story.tsx#ComponentMeta"})}catch(k){}},"./src/components/TextArea/TextArea.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return h},default:function(){return s}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/TextArea/TextArea.tsx"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function d(o){const r=Object.assign({h1:"h1",p:"p",h3:"h3",pre:"pre",code:"code"},(0,f.ah)(),o.components),{Preview:u,Field:p,Textarea:S}=r;return p||E("Field",!0),u||E("Preview",!0),S||E("Textarea",!0),(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(r.h1,{children:"TextArea"}),`
`,(0,l.jsx)(r.p,{children:"Use for multi line inputs like descriptions."}),`
`,(0,l.jsx)(r.h3,{children:"Usage"}),`
`,(0,l.jsx)(r.pre,{children:(0,l.jsx)(r.code,{className:"language-jsx",children:`<TextArea invalid={invalid} placeholder={placeholder} cols={cols} disabled={disabled} />
`})}),`
`,(0,l.jsx)(r.h3,{children:"Usage in forms with Field"}),`
`,(0,l.jsxs)(r.p,{children:[(0,l.jsx)(r.code,{children:"TextArea"})," should be used with the ",(0,l.jsx)(r.code,{children:"Field"})," component to get labels and descriptions. It can also be used for validation by using the ",(0,l.jsx)(r.code,{children:"required"})," attribute. See the ",(0,l.jsx)(r.code,{children:"Field"})," component for more information."]}),`
`,(0,l.jsx)(r.pre,{children:(0,l.jsx)(r.code,{className:"language-jsx",children:`<Field label="Important information" description="This information is very important, so you really need to fill it in">
  <Textarea name="importantTextarea" required />
</Field>
`})}),`
`,(0,l.jsx)(u,{children:(0,l.jsx)(p,{label:"Important information",description:"This information is very important, so you really need to fill it in",children:(0,l.jsx)(S,{name:"importantTextarea",required:!0})})}),`
`,(0,l.jsx)(x.xP,{of:n.K})]})}function i(o={}){const{wrapper:r}=Object.assign({},(0,f.ah)(),o.components);return r?(0,l.jsx)(r,Object.assign({},o,{children:(0,l.jsx)(d,o)})):d(o)}var c=i;function E(o,r){throw new Error("Expected "+(r?"component":"object")+" `"+o+"` to be defined: you likely forgot to import, pass, or provide it.")}var O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(o,r,u)=>r in o?O(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,b=(o,r)=>{for(var u in r||(r={}))w.call(r,u)&&C(o,u,r[u]);if(m)for(var u of m(r))_.call(r,u)&&C(o,u,r[u]);return o},g=`import { Meta, Story } from '@storybook/react';
import React from 'react';

import { TextArea } from '@grafana/ui';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import mdx from './TextArea.mdx';

const meta: Meta = {
  title: 'Forms/TextArea',
  component: TextArea,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['cols'],
    },
    docs: {
      page: mdx,
    },
  },
  argTypes: {
    containerWidth: { control: { type: 'range', min: 100, max: 500, step: 10 } },
  },
};

export const Basic: Story = (args) => {
  return (
    <div style={{ width: args.containerWidth }}>
      <TextArea invalid={args.invalid} placeholder={args.placeholder} cols={args.cols} disabled={args.disabled} />
    </div>
  );
};
Basic.args = {
  invalid: false,
  disabled: false,
  placeholder: 'This is just a placeholder',
  cols: 30,
  containerWidth: 300,
};

export default meta;
`,v={Basic:{startLoc:{col:28,line:27},endLoc:{col:1,line:33},startBody:{col:28,line:27},endBody:{col:1,line:33}}};const y={title:"Forms/TextArea",component:n.K,decorators:[a.BU],parameters:{controls:{exclude:["cols"]},docs:{page:c}},argTypes:{containerWidth:{control:{type:"range",min:100,max:500,step:10}}}},h=o=>t.createElement("div",{style:{width:o.containerWidth}},t.createElement(n.K,{invalid:o.invalid,placeholder:o.placeholder,cols:o.cols,disabled:o.disabled}));h.args={invalid:!1,disabled:!1,placeholder:"This is just a placeholder",cols:30,containerWidth:300};var s=y;h.parameters=b({storySource:{source:`(args) => {
  return (
    <div style={{ width: args.containerWidth }}>
      <TextArea invalid={args.invalid} placeholder={args.placeholder} cols={args.cols} disabled={args.disabled} />
    </div>
  );
}`}},h.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/TextArea/TextArea.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/TextArea/TextArea.story.tsx#Meta"})}catch(o){}},"./src/components/ThemeDemos/ThemeDemo.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{PerfTest:function(){return te},ThemeDemo:function(){return Z},default:function(){return Pe}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("../../.yarn/__virtual__/@emotion-react-virtual-b3c85744cb/2/yarn/cache/@emotion-react-npm-11.10.6-655b70ad8d-4762042e39.zip/node_modules/@emotion/react/dist/emotion-react.browser.esm.js"),l=e("../../../yarn/cache/classnames-npm-2.3.2-d2fdae468d-2c62199789.zip/node_modules/classnames/index.js"),f=e.n(l),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/components/Button/Button.tsx"),i=e("./src/components/Layout/Layout.tsx");function c(){return console.log("process.env.NODE_ENV","production"),(0,a.tZ)(i.wc,null,(0,a.tZ)("div",null,"Emotion performance tests"),(0,a.tZ)(E,{name:"No styles",Component:v}),(0,a.tZ)(E,{name:"inline emotion/css",Component:g}),(0,a.tZ)(E,{name:"useStyles no cx",Component:m}),(0,a.tZ)(E,{name:"useStyles with conditional cx styles",Component:w}),(0,a.tZ)(E,{name:"useStyles with css prop",Component:C}),(0,a.tZ)(E,{name:"useStyles with conditional css prop",Component:b}),(0,a.tZ)(E,{name:"useStyles with conditional classnames",Component:_}))}const E=({name:he,Component:ie})=>{const[Ce,Le]=(0,t.useState)(0);return(0,a.tZ)("div",null,(0,a.tZ)(d.zx,{onClick:()=>Le(Ce>2?0:Ce+1)},he),Ce>0&&(0,a.tZ)(y,{id:he},O(ie)))};E.displayName="TestScenario";function O(he){const ie=[];for(let Ce=0;Ce<5e3;Ce++)ie.push((0,a.tZ)(he,{index:Ce,key:Ce.toString()}));return(0,a.tZ)("div",{style:{display:"flex",flexWrap:"wrap"}},ie)}function m({index:he}){const ie=(0,x.wW)(h);return(0,a.tZ)("div",{className:ie.main},(0,a.tZ)("div",{className:ie.child},he))}function w({index:he}){const ie=(0,x.wW)(h),Ce=(0,n.cx)(ie.main,{[ie.large]:he>10,[ie.disabed]:he%10===0});return(0,a.tZ)("div",{className:Ce},(0,a.tZ)("div",{className:ie.child},he))}function _({index:he}){const ie=(0,x.wW)(h),Ce=f()(ie.main,{[ie.large]:he>10,[ie.disabed]:he%10===0});return(0,a.tZ)("div",{className:Ce},(0,a.tZ)("div",{className:ie.child},he))}function C({index:he}){const ie=(0,x.wW)(s);return(0,a.tZ)("div",{css:ie.main},(0,a.tZ)("div",{css:ie.child},he))}function b({index:he}){const ie=(0,x.wW)(s),Ce=[ie.main,he>10&&ie.large,he%10===0&&ie.disabed];return(0,a.tZ)("div",{css:Ce},(0,a.tZ)("div",{css:ie.child},he))}function g({index:he}){const ie=(0,x.l4)(),Ce=h(ie);return(0,a.tZ)("div",{className:Ce.main},(0,a.tZ)("div",{className:Ce.child},he))}function v({index:he}){return(0,a.tZ)("div",{className:"no-styles-main"},(0,a.tZ)("div",{className:"no-styles-child"},he))}function y({children:he,id:ie}){const Ce=(Le,we,ue,Ie,qe,Je)=>{console.log("Profile "+Le,ue)};return(0,a.tZ)(t.Profiler,{id:ie,onRender:Ce},he)}const h=he=>({main:(0,n.iv)(o(he)),large:(0,n.iv)({fontSize:"20px",color:"red"}),disabed:(0,n.iv)({fontSize:"10px",color:"gray"}),child:(0,n.iv)(r(he))}),s=he=>({main:o(he),large:{fontSize:"20px",color:"red"},disabed:{fontSize:"10px",color:"gray"},child:r(he)});function o(he){return{background:"blue",border:"1px solid red",color:"white",padding:he.spacing(1),shadow:he.shadows.z1,":hover":{background:he.colors.background.primary}}}function r(he){return{padding:"2px",fontSize:"10px",boxShadow:"none",textAlign:"center",textDecoration:"none"}}try{E.displayName="TestScenario",E.__docgenInfo={description:"",displayName:"TestScenario",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},Component:{defaultValue:null,description:"",name:"Component",required:!0,type:{name:"FC<TestComponentProps>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ThemeDemos/EmotionPerfTest.tsx#TestScenario"]={docgenInfo:E.__docgenInfo,name:"TestScenario",path:"src/components/ThemeDemos/EmotionPerfTest.tsx#TestScenario"})}catch(he){}var u=e("./src/components/Card/Card.tsx"),p=e("./src/components/Collapse/CollapsableSection.tsx"),S=e("./src/components/Forms/Field.tsx"),k=e("./src/components/Forms/InlineField.tsx"),D=e("./src/components/Forms/InlineFieldRow.tsx"),M=e("./src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx"),I=e("./src/components/Icon/Icon.tsx"),T=e("./src/components/Input/Input.tsx"),j=e("./src/components/Select/Select.tsx"),K=e("./src/components/Switch/Switch.tsx");const F=({bg:he,border:ie,children:Ce})=>{const Le=(0,n.cx)(n.iv`
      padding: 16px;
      background: ${he!=null?he:"inherit"};
      width: 100%;
    `,ie?n.iv`
          border: 1px solid ${ie};
        `:null);return t.createElement("div",{className:Le},Ce)},$=({color:he,bold:ie,size:Ce,children:Le})=>{const we=n.iv`
    padding: 4px;
    color: ${he!=null?he:"inherit"};
    font-weight: ${ie?500:400};
    font-size: ${Ce!=null?Ce:14}px;
  `;return t.createElement("div",{className:we},Le)},R=()=>{const[he,ie]=(0,t.useState)("v"),[Ce,Le]=(0,t.useState)(!1),[we,ue]=(0,t.useState)("Item 2"),Ie=(0,x.l4)(),qe=[Ie.colors.primary,Ie.colors.secondary,Ie.colors.success,Ie.colors.error,Ie.colors.warning,Ie.colors.info],Je=[{label:"Item 1",value:"Item 1"},{label:"Item 2",value:"Item 2"},{label:"Item 3",value:"Item 3"},{label:"Item 4",value:"Item 4"}],Ze=[{value:"h",label:"Horizontal"},{value:"v",label:"Vertical"},{value:"a",label:"Auto"}];return t.createElement("div",{className:n.iv`
        width: 100%;
        color: ${Ie.colors.text.primary};
      `},t.createElement(F,{bg:Ie.colors.background.canvas},t.createElement(p.s,{label:"Layers",isOpen:!0},t.createElement($,null,"t.colors.background.canvas"),t.createElement(F,{bg:Ie.colors.background.primary,border:Ie.colors.border.weak},t.createElement($,null,"t.colors.background.primary is the main & preferred content "),t.createElement(F,{bg:Ie.colors.background.secondary,border:Ie.colors.border.weak},t.createElement($,null,"t.colors.background.secondary and t.colors.border.layer1")))),t.createElement(p.s,{label:"Text colors",isOpen:!0},t.createElement(i.Lh,null,t.createElement(F,null,t.createElement(W,{t:Ie})),t.createElement(F,{bg:Ie.colors.background.primary},t.createElement(W,{t:Ie})),t.createElement(F,{bg:Ie.colors.background.secondary},t.createElement(W,{t:Ie})))),t.createElement(p.s,{label:"Rich colors",isOpen:!0},t.createElement(F,{bg:Ie.colors.background.primary},t.createElement("table",{className:H},t.createElement("thead",null,t.createElement("tr",null,t.createElement("td",null,"name"),t.createElement("td",null,"main"),t.createElement("td",null,"shade (used for hover)"),t.createElement("td",null,"border & text"))),t.createElement("tbody",null,qe.map(Oe=>t.createElement(U,{key:Oe.name,color:Oe,theme:Ie})))))),t.createElement(p.s,{label:"Forms",isOpen:!0},t.createElement(F,{bg:Ie.colors.background.primary},t.createElement(S.g,{label:"Input label",description:"Field description"},t.createElement(T.I,{placeholder:"Placeholder"})),t.createElement(S.g,{label:"Input disabled",disabled:!0},t.createElement(T.I,{placeholder:"Placeholder",value:"Disabled value"})),t.createElement(S.g,{label:"Select"},t.createElement(j.Ph,{options:Je,value:we,onChange:Oe=>ue(Oe==null?void 0:Oe.value)})),t.createElement(S.g,{label:"Radio label"},t.createElement(M.S,{options:Ze,value:he,onChange:ie})),t.createElement(i.Lh,null,t.createElement(S.g,{label:"Switch"},t.createElement(K.r,{value:Ce,onChange:Oe=>Le(Oe.currentTarget.checked)})),t.createElement(S.g,{label:"Switch true"},t.createElement(K.r,{value:!0})),t.createElement(S.g,{label:"Switch false disabled",disabled:!0},t.createElement(K.r,{value:!1}))),t.createElement(i.wc,null,t.createElement("div",null,"Inline forms"),t.createElement(D.Z,null,t.createElement(k._,{label:"Label"},t.createElement(T.I,{placeholder:"Placeholder"})),t.createElement(k._,{label:"Another Label",disabled:!0},t.createElement(T.I,{placeholder:"Disabled"})))))),t.createElement(p.s,{label:"Shadows",isOpen:!0},t.createElement(F,{bg:Ie.colors.background.primary},t.createElement(i.Lh,null,Object.keys(Ie.shadows).map(Oe=>t.createElement(oe,{name:Oe,shadow:Ie.shadows[Oe],key:Oe}))))),t.createElement(p.s,{label:"Buttons",isOpen:!0},t.createElement(F,{bg:Ie.colors.background.primary},t.createElement(i.wc,{spacing:"lg"},t.createElement(i.Lh,null,d.jg.map(Oe=>t.createElement(d.zx,{variant:Oe,key:Oe},Oe)),t.createElement(d.zx,{variant:"primary",disabled:!0},"Disabled")),t.createElement(u.Z,null,t.createElement(u.Z.Heading,null,"Button inside card"),t.createElement(u.Z.Actions,null,d.jg.map(Oe=>t.createElement(d.zx,{variant:Oe,key:Oe},Oe)),t.createElement(d.zx,{variant:"primary",disabled:!0},"Disabled")))))),t.createElement(p.s,{label:"Actions",isOpen:!0},t.createElement(Q,null))))};function U({theme:he,color:ie}){return t.createElement("tr",null,t.createElement("td",null,ie.name),t.createElement("td",null,t.createElement("div",{className:n.iv`
            background: ${ie.main};
            border-radius: ${he.shape.borderRadius()};
            color: ${ie.contrastText};
            padding: 8px;
            font-weight: 500;
          `},ie.main)),t.createElement("td",null,t.createElement("div",{className:n.iv`
            background: ${ie.shade};
            color: ${ie.contrastText};
            border-radius: 4px;
            padding: 8px;
          `},ie.shade)),t.createElement("td",null,t.createElement("div",{className:n.iv`
            border: 1px solid ${ie.border};
            color: ${ie.text};
            border-radius: 4px;
            padding: 8px;
          `},ie.text)))}const H=n.iv`
  text-align: center;

  td {
    padding: 8px;
    text-align: center;
  }
`;function W({t:he}){return t.createElement(t.Fragment,null,t.createElement($,{color:he.colors.text.primary},"text.primary ",t.createElement(I.J,{name:"trash-alt"})),t.createElement($,{color:he.colors.text.secondary},"text.secondary ",t.createElement(I.J,{name:"trash-alt"})),t.createElement($,{color:he.colors.text.disabled},"text.disabled ",t.createElement(I.J,{name:"trash-alt"})),t.createElement($,{color:he.colors.primary.text},"primary.text ",t.createElement(I.J,{name:"trash-alt"})))}function oe({name:he,shadow:ie}){const Ce=(0,n.iv)({padding:"16px",boxShadow:ie});return t.createElement("div",{className:Ce},he)}function Q(){const he=(0,x.l4)(),ie=(0,n.iv)({padding:"8px",":hover":{background:he.colors.action.hover}}),Ce=(0,n.iv)({background:he.colors.action.hover}),Le=(0,n.iv)({background:he.colors.action.selected}),we=(0,n.iv)({background:he.colors.action.focus});return t.createElement(i.Lh,null,t.createElement(F,{bg:he.colors.background.canvas},t.createElement(i.wc,null,t.createElement("div",{className:ie},"item"),t.createElement("div",{className:ie},"item"),t.createElement("div",{className:(0,n.cx)(ie,Ce)},"item hover"),t.createElement("div",{className:(0,n.cx)(ie,Le)},"item selected"),t.createElement("div",{className:(0,n.cx)(ie,we)},"item focused"))),t.createElement(F,{bg:he.colors.background.primary},t.createElement(i.wc,null,t.createElement("div",{className:ie},"item"),t.createElement("div",{className:ie},"item"),t.createElement("div",{className:(0,n.cx)(ie,Ce)},"item hover"),t.createElement("div",{className:(0,n.cx)(ie,Le)},"item selected"),t.createElement("div",{className:(0,n.cx)(ie,we)},"item focused"))),t.createElement(F,{bg:he.colors.background.secondary},t.createElement(i.wc,null,t.createElement("div",{className:ie},"item"),t.createElement("div",{className:ie},"item"),t.createElement("div",{className:(0,n.cx)(ie,Ce)},"item hover"),t.createElement("div",{className:(0,n.cx)(ie,Le)},"item selected"),t.createElement("div",{className:(0,n.cx)(ie,we)},"item focused"))))}try{U.displayName="RichColorDemo",U.__docgenInfo={description:"",displayName:"RichColorDemo",props:{theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}},color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"ThemeRichColor"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ThemeDemos/ThemeDemo.tsx#RichColorDemo"]={docgenInfo:U.__docgenInfo,name:"RichColorDemo",path:"src/components/ThemeDemos/ThemeDemo.tsx#RichColorDemo"})}catch(he){}try{W.displayName="TextColors",W.__docgenInfo={description:"",displayName:"TextColors",props:{t:{defaultValue:null,description:"",name:"t",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ThemeDemos/ThemeDemo.tsx#TextColors"]={docgenInfo:W.__docgenInfo,name:"TextColors",path:"src/components/ThemeDemos/ThemeDemo.tsx#TextColors"})}catch(he){}try{oe.displayName="ShadowDemo",oe.__docgenInfo={description:"",displayName:"ShadowDemo",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},shadow:{defaultValue:null,description:"",name:"shadow",required:!0,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ThemeDemos/ThemeDemo.tsx#ShadowDemo"]={docgenInfo:oe.__docgenInfo,name:"ShadowDemo",path:"src/components/ThemeDemos/ThemeDemo.tsx#ShadowDemo"})}catch(he){}var P=Object.defineProperty,ae=Object.getOwnPropertySymbols,q=Object.prototype.hasOwnProperty,Y=Object.prototype.propertyIsEnumerable,ve=(he,ie,Ce)=>ie in he?P(he,ie,{enumerable:!0,configurable:!0,writable:!0,value:Ce}):he[ie]=Ce,re=(he,ie)=>{for(var Ce in ie||(ie={}))q.call(ie,Ce)&&ve(he,Ce,ie[Ce]);if(ae)for(var Ce of ae(ie))Y.call(ie,Ce)&&ve(he,Ce,ie[Ce]);return he},je=`import { Meta, Story } from '@storybook/react';
import React from 'react';

import { EmotionPerfTest } from './EmotionPerfTest';
import { ThemeDemo as NewThemeDemoComponent } from './ThemeDemo';

const meta: Meta = {
  title: 'Docs Overview/Theme',
  component: NewThemeDemoComponent,
  decorators: [],
  parameters: {
    options: {
      showPanel: false,
    },
    docs: {},
  },
};

export const ThemeDemo: Story = () => {
  return <NewThemeDemoComponent />;
};

export const PerfTest: Story = () => {
  return <EmotionPerfTest />;
};

export default meta;
`,me={ThemeDemo:{startLoc:{col:32,line:19},endLoc:{col:1,line:21},startBody:{col:32,line:19},endBody:{col:1,line:21}},PerfTest:{startLoc:{col:31,line:23},endLoc:{col:1,line:25},startBody:{col:31,line:23},endBody:{col:1,line:25}}};const ne={title:"Docs Overview/Theme",component:R,decorators:[],parameters:{options:{showPanel:!1},docs:{}}},Z=()=>t.createElement(R,null),te=()=>t.createElement(c,null);var Pe=ne;Z.parameters=re({storySource:{source:`() => {
  return <NewThemeDemoComponent />;
}`}},Z.parameters),te.parameters=re({storySource:{source:`() => {
  return <EmotionPerfTest />;
}`}},te.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ThemeDemos/ThemeDemo.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/ThemeDemos/ThemeDemo.story.tsx#Meta"})}catch(he){}},"./src/components/Toggletip/Toggletip.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return H},HostingMultiElements:function(){return W},default:function(){return oe}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/Button/Button.tsx"),l=e("./src/components/Dropdown/ButtonSelect.tsx"),f=e("./src/components/Forms/InlineField.tsx"),x=e("./src/components/Icon/Icon.tsx"),d=e("./src/components/Input/Input.tsx"),i=e("./src/components/Select/Select.tsx"),c=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),E=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),O=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),m=e("../../.yarn/__virtual__/react-popper-tooltip-virtual-fa069dac02/2/yarn/cache/react-popper-tooltip-npm-4.4.2-54ed1200c6-516988b925.zip/node_modules/react-popper-tooltip/dist/esm/react-popper-tooltip.js"),w=e("./src/themes/ThemeContext.tsx"),_=e("./src/utils/tooltipUtils.ts"),C=e("./src/components/IconButton/IconButton.tsx"),b=e("./src/components/Portal/Portal.tsx"),g=Object.defineProperty,v=Object.getOwnPropertySymbols,y=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,s=(Q,P,ae)=>P in Q?g(Q,P,{enumerable:!0,configurable:!0,writable:!0,value:ae}):Q[P]=ae,o=(Q,P)=>{for(var ae in P||(P={}))y.call(P,ae)&&s(Q,ae,P[ae]);if(v)for(var ae of v(P))h.call(P,ae)&&s(Q,ae,P[ae]);return Q};const r=t.memo(({children:Q,theme:P="info",placement:ae="auto",content:q,title:Y,closeButton:ve=!0,onClose:re,footer:je})=>{const ne=(0,w.wW)(u)[P],Z=(0,t.useRef)(null),[te,Pe]=t.useState(!1),he=(0,t.useCallback)(()=>{Pe(!1),re==null||re()},[re]);(0,t.useEffect)(()=>{if(te){const qe=Je=>{Je.key==="Escape"&&he()};return document.addEventListener("keydown",qe),()=>{document.removeEventListener("keydown",qe)}}},[te,he]);const{getArrowProps:ie,getTooltipProps:Ce,setTooltipRef:Le,setTriggerRef:we,visible:ue,update:Ie}=(0,m.O)({visible:te,placement:ae,interactive:!0,offset:[0,8],trigger:"click",onVisibleChange:qe=>{Pe(qe),qe||re==null||re()}});return t.createElement(t.Fragment,null,t.cloneElement(Q,{ref:we,tabIndex:0}),ue&&t.createElement(b.h_,null,t.createElement("div",o({"data-testid":"toggletip-content",ref:Le},Ce({className:ne.container})),Boolean(Y)&&t.createElement("div",{className:ne.header},Y),ve&&t.createElement("div",{className:ne.headerClose},t.createElement(C.h,{"aria-label":"Close Toggletip",name:"times",size:"md","data-testid":"toggletip-header-close",onClick:he})),t.createElement("div",o({ref:Z},ie({className:ne.arrow}))),t.createElement("div",{className:ne.body},(typeof q=="string"||t.isValidElement(q))&&q,typeof q=="function"&&Ie&&q({update:Ie})),Boolean(je)&&t.createElement("div",{className:ne.footer},je))))});r.displayName="Toggletip";const u=Q=>{const P=(0,_.k)(Q,Q.components.tooltip.background,Q.components.tooltip.background,Q.components.tooltip.text,{topBottom:3,rightLeft:3}),ae=(0,_.k)(Q,Q.colors.error.main,Q.colors.error.main,Q.colors.error.contrastText,{topBottom:3,rightLeft:3});return{info:P,error:ae}};try{r.displayName="Toggletip",r.__docgenInfo={description:"",displayName:"Toggletip",props:{theme:{defaultValue:null,description:"The theme used to display the toggletip",name:"theme",required:!1,type:{name:"enum",value:[{value:'"error"'},{value:'"info"'}]}},title:{defaultValue:null,description:"The title to be displayed on the header",name:"title",required:!1,type:{name:"string | Element"}},closeButton:{defaultValue:null,description:"determine whether to show or not the close button *",name:"closeButton",required:!1,type:{name:"boolean"}},onClose:{defaultValue:null,description:"Callback function to be called when the toggletip is closed",name:"onClose",required:!1,type:{name:"Function"}},placement:{defaultValue:null,description:"The preferred placement of the toggletip",name:"placement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}},content:{defaultValue:null,description:"The text or component that houses the content of the toggleltip",name:"content",required:!0,type:{name:"ToggletipContent"}},footer:{defaultValue:null,description:"The text or component to be displayed on the toggletip's bottom",name:"footer",required:!1,type:{name:"string | Element"}},children:{defaultValue:null,description:"The UI control users interact with to display toggletips",name:"children",required:!0,type:{name:"Element"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Toggletip/Toggletip.tsx#Toggletip"]={docgenInfo:r.__docgenInfo,name:"Toggletip",path:"src/components/Toggletip/Toggletip.tsx#Toggletip"})}catch(Q){}function p(Q){const P=Object.assign({h1:"h1",p:"p",h2:"h2",ul:"ul",li:"li",h3:"h3",pre:"pre",code:"code"},(0,E.ah)(),Q.components);return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(P.h1,{children:"Toggletip"}),`
`,(0,c.jsx)(P.p,{children:`Toggletips, similar to Tooltips, provide contextual support for users when needed. They are hidden by default, a UI trigger or text link are clicked to set them to their visible state.
Toggletips, unlike tooltips, are persistent until a user takes action to dismiss them by clicking on the required \u201CX\u201D (close) trigger.
Toggletips are capable of containing varying types of complex content including interactive components, buttons, and dropdowns.`}),`
`,(0,c.jsx)(P.h2,{children:"When to use"}),`
`,(0,c.jsxs)(P.ul,{children:[`
`,(0,c.jsx)(P.li,{children:"Users need further context to understand or learn a topic"}),`
`,(0,c.jsx)(P.li,{children:"Links to supporting documentation or content are needed to provide"}),`
`,(0,c.jsx)(P.li,{children:"When an interactive element must be placed within the popover"}),`
`,(0,c.jsx)(P.li,{children:"When content needs to persist for consumption until the user dismisses it"}),`
`]}),`
`,(0,c.jsx)(P.h2,{children:"When not to use"}),`
`,(0,c.jsxs)(P.ul,{children:[`
`,(0,c.jsx)(P.li,{children:"When only a primary label or an auxiliary clarification is needed to be displayed (see: Tooltip)"}),`
`,(0,c.jsx)(P.li,{children:"Do not house information critical to user\u2019s task completion"}),`
`,(0,c.jsx)(P.li,{children:"Do not request required information from a user to complete a task or workflow"}),`
`]}),`
`,(0,c.jsx)(P.h2,{children:"Content"}),`
`,(0,c.jsx)(P.p,{children:"Toggletips are able to house various types of content. Below is a potential list:"}),`
`,(0,c.jsxs)(P.ul,{children:[`
`,(0,c.jsx)(P.li,{children:"Buttons"}),`
`,(0,c.jsx)(P.li,{children:"Text links"}),`
`,(0,c.jsx)(P.li,{children:"Dropdowns"}),`
`,(0,c.jsx)(P.li,{children:"Selects"}),`
`,(0,c.jsx)(P.li,{children:"Images/gifs/videos"}),`
`,(0,c.jsx)(P.li,{children:"Various combinations of elements \u2014 ex: strings of text with buttons and an image"}),`
`]}),`
`,(0,c.jsx)(P.h2,{children:"Theme"}),`
`,(0,c.jsx)(P.p,{children:"There are currently 2 themes available for the Toggletip."}),`
`,(0,c.jsxs)(P.ul,{children:[`
`,(0,c.jsx)(P.li,{children:"Info"}),`
`,(0,c.jsx)(P.li,{children:"Error"}),`
`]}),`
`,(0,c.jsx)(P.h3,{children:"Info"}),`
`,(0,c.jsx)(P.p,{children:"This is the default theme, usually used in forms to show more information."}),`
`,(0,c.jsx)(P.h3,{children:"Error"}),`
`,(0,c.jsx)(P.p,{children:"Tooltip with a red background."}),`
`,(0,c.jsx)(P.h2,{children:"Triggers"}),`
`,(0,c.jsxs)(P.ul,{children:[`
`,(0,c.jsxs)(P.li,{children:["Toggletips display on",`
`,(0,c.jsxs)(P.ul,{children:[`
`,(0,c.jsx)(P.li,{children:"user click of UI trigger"}),`
`,(0,c.jsx)(P.li,{children:"pressing ENTER or SPACE on a keyboard while the trigger element has focus"}),`
`]}),`
`]}),`
`,(0,c.jsxs)(P.li,{children:["Toggletips dismiss by:",`
`,(0,c.jsxs)(P.ul,{children:[`
`,(0,c.jsx)(P.li,{children:"user click of close icon (x) \u2014 optional"}),`
`,(0,c.jsx)(P.li,{children:"clicking outside of the popover container"}),`
`,(0,c.jsx)(P.li,{children:"pressing the ESC key"}),`
`]}),`
`]}),`
`]}),`
`,(0,c.jsx)(P.h3,{children:"Usage"}),`
`,(0,c.jsx)(P.pre,{children:(0,c.jsx)(P.code,{className:"language-tsx",children:`function onClose() {
  // code to execute when the toggletip is closed
}

return (
  <Toogletip
    content="Toggletip body"
    title="This is the title of the Toggletip"
    footer="Toggletip footer text"
    closeButton={true}
    onClose={onClose}
  >
    <Button type="button">
      <Icon name="question-circle" />
    </Button>
  </Toogletip>
);
`})}),`
`,(0,c.jsx)(O.xP,{of:r})]})}function S(Q={}){const{wrapper:P}=Object.assign({},(0,E.ah)(),Q.components);return P?(0,c.jsx)(P,Object.assign({},Q,{children:(0,c.jsx)(p,Q)})):p(Q)}var k=S,D=Object.defineProperty,M=Object.getOwnPropertySymbols,I=Object.prototype.hasOwnProperty,T=Object.prototype.propertyIsEnumerable,j=(Q,P,ae)=>P in Q?D(Q,P,{enumerable:!0,configurable:!0,writable:!0,value:ae}):Q[P]=ae,K=(Q,P)=>{for(var ae in P||(P={}))I.call(P,ae)&&j(Q,ae,P[ae]);if(M)for(var ae of M(P))T.call(P,ae)&&j(Q,ae,P[ae]);return Q},F=(Q,P)=>{var ae={};for(var q in Q)I.call(Q,q)&&P.indexOf(q)<0&&(ae[q]=Q[q]);if(Q!=null&&M)for(var q of M(Q))P.indexOf(q)<0&&T.call(Q,q)&&(ae[q]=Q[q]);return ae},$=null,R={Basic:{startLoc:{col:55,line:63},endLoc:{col:1,line:85},startBody:{col:55,line:63},endBody:{col:1,line:85}},HostingMultiElements:{startLoc:{col:70,line:95},endLoc:{col:1,line:164},startBody:{col:70,line:95},endBody:{col:1,line:164}}};const U={title:"Overlays/Toggletip",component:r,decorators:[n.BU],parameters:{docs:{page:k},controls:{exclude:["onClose","children"]}},argTypes:{title:{control:{type:"text"}},content:{control:{type:"text"}},footer:{control:{type:"text"}},theme:{control:{type:"select"}},closeButton:{control:{type:"boolean"}},placement:{control:{type:"select"}}}},H=Q=>{var P=Q,{title:ae,content:q,footer:Y,theme:ve,closeButton:re,placement:je}=P,me=F(P,["title","content","footer","theme","closeButton","placement"]);return t.createElement(r,K({title:ae,content:q,footer:Y,theme:ve,closeButton:re,placement:je},me),t.createElement(a.zx,null,"Click to show Toggletip with header and footer!"))};H.args={title:"Title of the Toggletip",content:"This is the content of the Toggletip",footer:"Footer of the Toggletip",placement:"auto",closeButton:!0,theme:"info"};const W=({theme:Q,closeButton:P,placement:ae})=>{const q=[{label:"Sharilyn Markowitz",value:1},{label:"Naomi Striplin",value:2},{label:"Beau Bevel",value:3},{label:"Garrett Starkes",value:4}],Y=[{label:"Option A",value:"a"},{label:"Option B",value:"b"},{label:"Option C",value:"c"}],ve=t.createElement("div",null,t.createElement(x.J,{name:"apps"}),"\xA0",t.createElement("strong",null,"Header title with icon")),re=t.createElement("div",null,t.createElement(f._,{label:"Users",labelWidth:15},t.createElement(i.Ph,{width:20,options:q,value:2,onChange:()=>{}})),t.createElement(f._,{label:"Job Title",labelWidth:15},t.createElement(d.I,{value:"Professor",width:20})),t.createElement(f._,{label:"My Button Select",labelWidth:15},t.createElement(l.d,{options:Y,value:Y[2],variant:"primary",onChange:()=>{},style:{width:"160px"}})),t.createElement("div",null,t.createElement("br",null),t.createElement("span",null,"Wants to know more?"),"\xA0",t.createElement("a",{href:"https://grafana.com/",target:"_blank",rel:"noreferrer"},t.createElement(x.J,{name:"link"}),"\xA0Click here!"))),je=t.createElement("div",null,t.createElement(a.zx,{type:"button",variant:"success",onClick:()=>alert("Click on Save!")},"Save on footer"),"\xA0",t.createElement(a.zx,{type:"button",variant:"destructive",onClick:()=>alert("Click on Delete!")},"Delete"));return t.createElement(r,{title:ve,content:re,footer:je,theme:Q,closeButton:P,placement:ae},t.createElement(a.zx,{type:"button"},"Click to show Toggletip hosting multiple components!"))};W.parameters={controls:{hideNoControlsWarning:!0,exclude:["title","content","footer","onClose","children"]}},W.args={placement:"top",closeButton:!0,theme:"info"};var oe=U;H.parameters=K({storySource:{source:`({
  title,
  content,
  footer,
  theme,
  closeButton,
  placement,
  ...args
}) => {
  return (
    <Toggletip
      title={title}
      content={content}
      footer={footer}
      theme={theme}
      closeButton={closeButton}
      placement={placement}
      {...args}
    >
      <Button>Click to show Toggletip with header and footer!</Button>
    </Toggletip>
  );
}`}},H.parameters),W.parameters=K({storySource:{source:`({ theme, closeButton, placement }) => {
  const selectOptions: Array<SelectableValue<number>> = [
    { label: 'Sharilyn Markowitz', value: 1 },
    { label: 'Naomi Striplin', value: 2 },
    { label: 'Beau Bevel', value: 3 },
    { label: 'Garrett Starkes', value: 4 },
  ];
  const dropdownOptions: Array<SelectableValue<string>> = [
    { label: 'Option A', value: 'a' },
    { label: 'Option B', value: 'b' },
    { label: 'Option C', value: 'c' },
  ];
  const header = (
    <div>
      <Icon name="apps" />
      &nbsp;<strong>Header title with icon</strong>
    </div>
  );
  const body = (
    <div>
      <InlineField label="Users" labelWidth={15}>
        <Select width={20} options={selectOptions} value={2} onChange={() => {}} />
      </InlineField>
      <InlineField label="Job Title" labelWidth={15}>
        <Input value={'Professor'} width={20} />
      </InlineField>
      <InlineField label="My Button Select" labelWidth={15}>
        <ButtonSelect
          options={dropdownOptions}
          value={dropdownOptions[2]}
          variant={'primary'}
          onChange={() => {}}
          style={{ width: '160px' }}
        ></ButtonSelect>
      </InlineField>
      <div>
        <br />
        <span>Wants to know more?</span>&nbsp;
        <a href="https://grafana.com/" target="_blank" rel="noreferrer">
          <Icon name="link" />
          &nbsp;Click here!
        </a>
      </div>
    </div>
  );
  const footer = (
    <div>
      <Button type="button" variant="success" onClick={() => alert('Click on Save!')}>
        Save on footer
      </Button>
      &nbsp;
      <Button type="button" variant="destructive" onClick={() => alert('Click on Delete!')}>
        Delete
      </Button>
    </div>
  );

  return (
    <Toggletip
      title={header}
      content={body}
      footer={footer}
      theme={theme}
      closeButton={closeButton}
      placement={placement}
    >
      <Button type="button">Click to show Toggletip hosting multiple components!</Button>
    </Toggletip>
  );
}`}},W.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Toggletip/Toggletip.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Toggletip/Toggletip.story.tsx#ComponentMeta"})}catch(Q){}},"./src/components/ToolbarButton/ToolbarButton.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{BasicWithIcon:function(){return u},BasicWithText:function(){return r},Examples:function(){return p},default:function(){return S}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/DashboardStoryCanvas.tsx"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/components/Button/ButtonGroup.tsx"),f=e("./src/components/Layout/Layout.tsx"),x=e("./src/components/ToolbarButton/ToolbarButton.tsx"),d=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),i=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),c=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function E(k){const D=Object.assign({h1:"h1",p:"p",code:"code",h2:"h2",pre:"pre"},(0,i.ah)(),k.components);return(0,d.jsxs)(d.Fragment,{children:[(0,d.jsx)(D.h1,{children:"ToolbarButton"}),`
`,(0,d.jsxs)(D.p,{children:[`Multiple buttons that form a toolbar. Each button can contain an icon, image and text.
There are three variants of the `,(0,d.jsx)(D.code,{children:"ToolbarButton"}),": default, primary and destructive."]}),`
`,(0,d.jsx)(D.h2,{children:"Usage"}),`
`,(0,d.jsxs)(D.p,{children:["This example shows how to use several buttons in a ",(0,d.jsx)(D.code,{children:"ToolbarButtonRow"}),"."]}),`
`,(0,d.jsx)(D.pre,{children:(0,d.jsx)(D.code,{className:"language-jsx",children:`<ToolbarButtonRow>
  <ToolbarButton variant="default" iconOnly={false} isOpen={false}>
    Last 6 hours
  </ToolbarButton>
  <ButtonGroup>
    <ToolbarButton icon="search-minus" variant="default" />
    <ToolbarButton icon="search-plus" variant="default" />
  </ButtonGroup>
  <ToolbarButton icon="sync" isOpen={false} variant="primary" />
</ToolbarButtonRow>
`})}),`
`,(0,d.jsx)(c.xP,{of:x.h})]})}function O(k={}){const{wrapper:D}=Object.assign({},(0,i.ah)(),k.components);return D?(0,d.jsx)(D,Object.assign({},k,{children:(0,d.jsx)(E,k)})):E(k)}var m=O,w=e("./src/components/ToolbarButton/ToolbarButtonRow.tsx"),_=Object.defineProperty,C=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,v=(k,D,M)=>D in k?_(k,D,{enumerable:!0,configurable:!0,writable:!0,value:M}):k[D]=M,y=(k,D)=>{for(var M in D||(D={}))b.call(D,M)&&v(k,M,D[M]);if(C)for(var M of C(D))g.call(D,M)&&v(k,M,D[M]);return k},h=null,s={BasicWithText:{startLoc:{col:67,line:53},endLoc:{col:1,line:69},startBody:{col:67,line:53},endBody:{col:1,line:69}},BasicWithIcon:{startLoc:{col:67,line:75},endLoc:{col:1,line:89},startBody:{col:67,line:75},endBody:{col:1,line:89}},Examples:{startLoc:{col:62,line:94},endLoc:{col:1,line:160},startBody:{col:62,line:94},endBody:{col:1,line:160}}};const o={title:"Buttons/ToolbarButton",component:x.h,decorators:[a.BU],parameters:{docs:{page:m},controls:{exclude:["imgSrc","imgAlt","narrow"]}},args:{variant:"default",fullWidth:!1,disabled:!1,children:"Just text",icon:"cloud",isOpen:!1,tooltip:"This is a tooltip",isHighlighted:!1,imgSrc:"",imgAlt:""},argTypes:{variant:{control:{type:"select"},options:["default","primary","active","destructive"]},icon:{control:{type:"select",options:["sync","cloud"]}}}},r=k=>t.createElement(x.h,{variant:k.variant,disabled:k.disabled,fullWidth:k.fullWidth,icon:k.icon,tooltip:k.tooltip,isOpen:k.isOpen,isHighlighted:k.isHighlighted,imgSrc:k.imgSrc,imgAlt:k.imgAlt},k.children);r.args={icon:void 0,iconOnly:!1};const u=k=>t.createElement(x.h,{variant:k.variant,icon:k.icon,isOpen:k.isOpen,tooltip:k.tooltip,disabled:k.disabled,fullWidth:k.fullWidth,isHighlighted:k.isHighlighted,imgSrc:k.imgSrc,imgAlt:k.imgAlt});u.args={iconOnly:!0};const p=k=>{const D=["default","active","primary","destructive"];return t.createElement(n.C,null,t.createElement(f.wc,null,"Button states",t.createElement(w.R,null,t.createElement(x.h,null,"Just text"),t.createElement(x.h,{icon:"sync",tooltip:"Sync"}),t.createElement(x.h,{imgSrc:"./grafana_icon.svg"},"With imgSrc"),t.createElement(x.h,{icon:"cloud",isOpen:!0},"isOpen"),t.createElement(x.h,{icon:"cloud",isOpen:!1},"isOpen = false")),t.createElement("br",null),"disabled",t.createElement(w.R,null,t.createElement(x.h,{icon:"sync",disabled:!0},"Disabled")),t.createElement("br",null),"Variants",t.createElement(w.R,null,D.map(M=>t.createElement(x.h,{icon:"sync",tooltip:"Sync",variant:M,key:M},M))),t.createElement("br",null),"Wrapped in noSpacing ButtonGroup",t.createElement(l.h,null,t.createElement(x.h,{icon:"clock-nine",tooltip:"Time picker"},"2020-10-02"),t.createElement(x.h,{icon:"search-minus"})),t.createElement("br",null),t.createElement(l.h,null,t.createElement(x.h,{icon:"sync"}),t.createElement(x.h,{isOpen:!1,narrow:!0})),t.createElement("br",null),"Inside button group",t.createElement(f.Lh,null,t.createElement(l.h,null,t.createElement(x.h,{variant:"primary",icon:"sync"},"Run query"),t.createElement(x.h,{isOpen:!1,narrow:!0,variant:"primary"})),t.createElement(l.h,null,t.createElement(x.h,{variant:"destructive",icon:"sync"},"Run query"),t.createElement(x.h,{isOpen:!1,narrow:!0,variant:"destructive"})))))};var S=o;r.parameters=y({storySource:{source:`(args) => {
  return (
    <ToolbarButton
      variant={args.variant}
      disabled={args.disabled}
      fullWidth={args.fullWidth}
      icon={args.icon}
      tooltip={args.tooltip}
      isOpen={args.isOpen}
      isHighlighted={args.isHighlighted}
      imgSrc={args.imgSrc}
      imgAlt={args.imgAlt}
    >
      {args.children}
    </ToolbarButton>
  );
}`}},r.parameters),u.parameters=y({storySource:{source:`(args) => {
  return (
    <ToolbarButton
      variant={args.variant}
      icon={args.icon}
      isOpen={args.isOpen}
      tooltip={args.tooltip}
      disabled={args.disabled}
      fullWidth={args.fullWidth}
      isHighlighted={args.isHighlighted}
      imgSrc={args.imgSrc}
      imgAlt={args.imgAlt}
    />
  );
}`}},u.parameters),p.parameters=y({storySource:{source:`(args) => {
  const variants: ToolbarButtonVariant[] = ['default', 'active', 'primary', 'destructive'];

  return (
    <DashboardStoryCanvas>
      <VerticalGroup>
        Button states
        <ToolbarButtonRow>
          <ToolbarButton>Just text</ToolbarButton>
          <ToolbarButton icon="sync" tooltip="Sync" />
          <ToolbarButton imgSrc="./grafana_icon.svg">With imgSrc</ToolbarButton>
          <ToolbarButton icon="cloud" isOpen={true}>
            isOpen
          </ToolbarButton>
          <ToolbarButton icon="cloud" isOpen={false}>
            isOpen = false
          </ToolbarButton>
        </ToolbarButtonRow>
        <br />
        disabled
        <ToolbarButtonRow>
          <ToolbarButton icon="sync" disabled>
            Disabled
          </ToolbarButton>
        </ToolbarButtonRow>
        <br />
        Variants
        <ToolbarButtonRow>
          {variants.map((variant) => (
            <ToolbarButton icon="sync" tooltip="Sync" variant={variant} key={variant}>
              {variant}
            </ToolbarButton>
          ))}
        </ToolbarButtonRow>
        <br />
        Wrapped in noSpacing ButtonGroup
        <ButtonGroup>
          <ToolbarButton icon="clock-nine" tooltip="Time picker">
            2020-10-02
          </ToolbarButton>
          <ToolbarButton icon="search-minus" />
        </ButtonGroup>
        <br />
        <ButtonGroup>
          <ToolbarButton icon="sync" />
          <ToolbarButton isOpen={false} narrow />
        </ButtonGroup>
        <br />
        Inside button group
        <HorizontalGroup>
          <ButtonGroup>
            <ToolbarButton variant="primary" icon="sync">
              Run query
            </ToolbarButton>
            <ToolbarButton isOpen={false} narrow variant="primary" />
          </ButtonGroup>
          <ButtonGroup>
            <ToolbarButton variant="destructive" icon="sync">
              Run query
            </ToolbarButton>
            <ToolbarButton isOpen={false} narrow variant="destructive" />
          </ButtonGroup>
        </HorizontalGroup>
      </VerticalGroup>
    </DashboardStoryCanvas>
  );
}`}},p.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ToolbarButton/ToolbarButton.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ToolbarButton/ToolbarButton.story.tsx#ComponentMeta"})}catch(k){}},"./src/components/ToolbarButton/ToolbarButtonRow.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return s},default:function(){return o}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/DashboardStoryCanvas.tsx"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("./src/components/ToolbarButton/ToolbarButton.tsx"),f=e("./src/components/ToolbarButton/ToolbarButtonRow.tsx"),x=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),d=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),i=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function c(r){const u=Object.assign({h1:"h1",p:"p",code:"code",h2:"h2",pre:"pre"},(0,d.ah)(),r.components);return(0,x.jsxs)(x.Fragment,{children:[(0,x.jsx)(u.h1,{children:"ToolbarButtonRow"}),`
`,(0,x.jsxs)(u.p,{children:["A container for multiple ",(0,x.jsx)(u.code,{children:"ToolbarButton"}),"s. Provides automatic overflow behaviour when the buttons no longer fit in the container."]}),`
`,(0,x.jsx)(u.h2,{children:"Usage"}),`
`,(0,x.jsxs)(u.p,{children:["This example shows how to use several buttons in a ",(0,x.jsx)(u.code,{children:"ToolbarButtonRow"}),"."]}),`
`,(0,x.jsx)(u.pre,{children:(0,x.jsx)(u.code,{className:"language-jsx",children:`<ToolbarButtonRow>
  <ToolbarButton variant="default" iconOnly={false} isOpen={false}>
    Last 6 hours
  </ToolbarButton>
  <ButtonGroup>
    <ToolbarButton icon="search-minus" variant="default" />
    <ToolbarButton icon="search-plus" variant="default" />
  </ButtonGroup>
  <ToolbarButton icon="sync" isOpen={false} variant="primary" />
</ToolbarButtonRow>
`})}),`
`,(0,x.jsx)(i.xP,{of:l.ToolbarButtonRow})]})}function E(r={}){const{wrapper:u}=Object.assign({},(0,d.ah)(),r.components);return u?(0,x.jsx)(u,Object.assign({},r,{children:(0,x.jsx)(c,r)})):c(r)}var O=E,m=Object.defineProperty,w=Object.getOwnPropertySymbols,_=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable,b=(r,u,p)=>u in r?m(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,g=(r,u)=>{for(var p in u||(u={}))_.call(u,p)&&b(r,p,u[p]);if(w)for(var p of w(u))C.call(u,p)&&b(r,p,u[p]);return r},v=null,y={Basic:{startLoc:{col:62,line:25},endLoc:{col:1,line:38},startBody:{col:62,line:25},endBody:{col:1,line:38}}};const h={title:"Buttons/ToolbarButton/ToolbarButtonRow",component:f.R,decorators:[a.BU],parameters:{docs:{page:O},controls:{exclude:["className"]}}},s=r=>t.createElement(n.C,null,t.createElement(f.R,g({},r),t.createElement(l.h,null,"Just text"),t.createElement(l.h,{icon:"sync",tooltip:"Sync"}),t.createElement(l.h,{imgSrc:"./grafana_icon.svg"},"With imgSrc"),t.createElement(l.h,null,"Just text"),t.createElement(l.h,{icon:"sync",tooltip:"Sync"}),t.createElement(l.h,{imgSrc:"./grafana_icon.svg"},"With imgSrc")));var o=h;s.parameters=g({storySource:{source:`(args) => {
  return (
    <DashboardStoryCanvas>
      <ToolbarButtonRow {...args}>
        <ToolbarButton>Just text</ToolbarButton>
        <ToolbarButton icon="sync" tooltip="Sync" />
        <ToolbarButton imgSrc="./grafana_icon.svg">With imgSrc</ToolbarButton>
        <ToolbarButton>Just text</ToolbarButton>
        <ToolbarButton icon="sync" tooltip="Sync" />
        <ToolbarButton imgSrc="./grafana_icon.svg">With imgSrc</ToolbarButton>
      </ToolbarButtonRow>
    </DashboardStoryCanvas>
  );
}`}},s.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ToolbarButton/ToolbarButtonRow.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ToolbarButton/ToolbarButtonRow.story.tsx#ComponentMeta"})}catch(r){}},"./src/components/Tooltip/Tooltip.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return s},default:function(){return o}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/Button/Button.tsx"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),f=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),x=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js"),d=e("./src/components/Tooltip/Tooltip.tsx");function i(r){const u=Object.assign({h1:"h1",h2:"h2",p:"p",ul:"ul",li:"li",h3:"h3",code:"code"},(0,f.ah)(),r.components);return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(u.h1,{children:"Tooltip"}),`
`,(0,l.jsx)(u.h2,{children:"Theme"}),`
`,(0,l.jsx)(u.p,{children:"There are currently themes available for the Tooltip."}),`
`,(0,l.jsxs)(u.ul,{children:[`
`,(0,l.jsx)(u.li,{children:"Info"}),`
`,(0,l.jsx)(u.li,{children:"Error"}),`
`,(0,l.jsx)(u.li,{children:"Info-alt (alternative)"}),`
`]}),`
`,(0,l.jsx)(u.h3,{children:"Info"}),`
`,(0,l.jsx)(u.p,{children:"This is the default theme, usually used in forms to show more information."}),`
`,(0,l.jsx)(u.h3,{children:"Error"}),`
`,(0,l.jsx)(u.p,{children:"Tooltip with a red background."}),`
`,(0,l.jsx)(u.h3,{children:"Info alternative"}),`
`,(0,l.jsxs)(u.p,{children:["We added this to be able to add a ",(0,l.jsx)(u.code,{children:"<JSONFormatter />"})," in the tooltip."]}),`
`,(0,l.jsx)(x.xP,{of:d.u})]})}function c(r={}){const{wrapper:u}=Object.assign({},(0,f.ah)(),r.components);return u?(0,l.jsx)(u,Object.assign({},r,{children:(0,l.jsx)(i,r)})):i(r)}var E=c,O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(r,u,p)=>u in r?O(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,b=(r,u)=>{for(var p in u||(u={}))w.call(u,p)&&C(r,p,u[p]);if(m)for(var p of m(u))_.call(u,p)&&C(r,p,u[p]);return r},g=(r,u)=>{var p={};for(var S in r)w.call(r,S)&&u.indexOf(S)<0&&(p[S]=r[S]);if(r!=null&&m)for(var S of m(r))u.indexOf(S)<0&&_.call(r,S)&&(p[S]=r[S]);return p},v=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';
import { Button } from '../Button';
import mdx from '../Tooltip/Tooltip.mdx';

import { Tooltip } from './Tooltip';

const meta: ComponentMeta<typeof Tooltip> = {
  title: 'Overlays/Tooltip',
  component: Tooltip,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    knobs: {
      disabled: true,
    },
  },
  argTypes: {
    content: {
      control: {
        type: 'text',
      },
    },
    theme: {
      control: {
        type: 'select',
        options: ['info', 'error'],
      },
    },
    placement: {
      control: {
        type: 'select',
        options: [
          'auto',
          'bottom',
          'top',
          'auto-start',
          'auto-end',
          'right',
          'left',
          'top-start',
          'top-end',
          'bottom-start',
          'bottom-end',
          'right-start',
          'right-end',
          'left-start',
          'left-end',
        ],
      },
    },
  },
};

export const Basic: ComponentStory<typeof Tooltip> = ({ content, ...args }) => {
  return (
    <Tooltip content={content} {...args}>
      <Button>Hover me for Tooltip </Button>
    </Tooltip>
  );
};

Basic.args = {
  content: 'This is a tooltip',
  theme: 'info',
  show: undefined,
  placement: 'auto',
};

export default meta;
`,y={Basic:{startLoc:{col:53,line:59},endLoc:{col:1,line:65},startBody:{col:53,line:59},endBody:{col:1,line:65}}};const h={title:"Overlays/Tooltip",component:d.u,decorators:[n.BU],parameters:{docs:{page:E},knobs:{disabled:!0}},argTypes:{content:{control:{type:"text"}},theme:{control:{type:"select",options:["info","error"]}},placement:{control:{type:"select",options:["auto","bottom","top","auto-start","auto-end","right","left","top-start","top-end","bottom-start","bottom-end","right-start","right-end","left-start","left-end"]}}}},s=r=>{var u=r,{content:p}=u,S=g(u,["content"]);return t.createElement(d.u,b({content:p},S),t.createElement(a.zx,null,"Hover me for Tooltip "))};s.args={content:"This is a tooltip",theme:"info",show:void 0,placement:"auto"};var o=h;s.parameters=b({storySource:{source:`({ content, ...args }) => {
  return (
    <Tooltip content={content} {...args}>
      <Button>Hover me for Tooltip </Button>
    </Tooltip>
  );
}`}},s.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tooltip/Tooltip.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/Tooltip/Tooltip.story.tsx#ComponentMeta"})}catch(r){}},"./src/components/Typography/Typography.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Typopgraphy:function(){return _},default:function(){return C}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/StoryExample.tsx"),a=e("./src/components/Layout/Layout.tsx");const l=({children:b})=>t.createElement("h1",null,b);l.displayName="Typography";try{l.displayName="Typography",l.__docgenInfo={description:"",displayName:"Typography",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Typography/Typography.tsx#Typography"]={docgenInfo:l.__docgenInfo,name:"Typography",path:"src/components/Typography/Typography.tsx#Typography"})}catch(b){}var f=Object.defineProperty,x=Object.getOwnPropertySymbols,d=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable,c=(b,g,v)=>g in b?f(b,g,{enumerable:!0,configurable:!0,writable:!0,value:v}):b[g]=v,E=(b,g)=>{for(var v in g||(g={}))d.call(g,v)&&c(b,v,g[v]);if(x)for(var v of x(g))i.call(g,v)&&c(b,v,g[v]);return b},O=null,m={Typopgraphy:{startLoc:{col:34,line:17},endLoc:{col:1,line:30},startBody:{col:34,line:17},endBody:{col:1,line:30}}};const w={title:"General/Typography",component:l,parameters:{docs:{}}},_=()=>t.createElement(a.wc,null,t.createElement(n.E,{name:"Native header elements (global styles)"},t.createElement("h1",null,"h1. Heading"),t.createElement("h2",null,"h2. Heading"),t.createElement("h3",null,"h3. Heading"),t.createElement("h4",null,"h4. Heading"),t.createElement("h5",null,"h5. Heading"),t.createElement("h6",null,"h6. Heading")));var C=w;_.parameters=E({storySource:{source:`() => {
  return (
    <VerticalGroup>
      <StoryExample name="Native header elements (global styles)">
        <h1>h1. Heading</h1>
        <h2>h2. Heading</h2>
        <h3>h3. Heading</h3>
        <h4>h4. Heading</h4>
        <h5>h5. Heading</h5>
        <h6>h6. Heading</h6>
      </StoryExample>
    </VerticalGroup>
  );
}`}},_.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Typography/Typography.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/Typography/Typography.story.tsx#Meta"})}catch(b){}},"./src/components/UnitPicker/UnitPicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Basic:function(){return r},default:function(){return u}});var t=e("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/dist/esm/index.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/utils/storybook/withCenteredStory.tsx"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),f=e("./src/components/Cascader/Cascader.tsx");function x(p){return`Custom unit: ${p}`}class d extends n.PureComponent{constructor(){super(...arguments),this.onChange=S=>{this.props.onChange(S.value)}}render(){const{value:S,width:k}=this.props;let D;const I=(0,l.QW)().map(T=>{const j=T.submenu.map(K=>{const F={label:K.text,value:K.value};return K.value===S&&(D=F),F});return{label:T.text,value:T.text,items:j}});return S&&!D&&(D={value:S,label:S}),n.createElement(f.v,{width:k,initialValue:D&&D.label,allowCustomValue:!0,changeOnSelect:!1,formatCreateLabel:x,options:I,placeholder:"Choose",onSelect:this.props.onChange})}}try{d.displayName="UnitPicker",d.__docgenInfo={description:"",displayName:"UnitPicker",props:{onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(item?: string | undefined) => void"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/UnitPicker/UnitPicker.tsx#UnitPicker"]={docgenInfo:d.__docgenInfo,name:"UnitPicker",path:"src/components/UnitPicker/UnitPicker.tsx#UnitPicker"})}catch(p){}var i=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),c=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),E=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function O(p){const S=Object.assign({h1:"h1"},(0,c.ah)(),p.components);return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(S.h1,{children:"UnitPicker"}),`
`,(0,i.jsx)(E.xP,{of:d})]})}function m(p={}){const{wrapper:S}=Object.assign({},(0,c.ah)(),p.components);return S?(0,i.jsx)(S,Object.assign({},p,{children:(0,i.jsx)(O,p)})):O(p)}var w=m,_=Object.defineProperty,C=Object.getOwnPropertySymbols,b=Object.prototype.hasOwnProperty,g=Object.prototype.propertyIsEnumerable,v=(p,S,k)=>S in p?_(p,S,{enumerable:!0,configurable:!0,writable:!0,value:k}):p[S]=k,y=(p,S)=>{for(var k in S||(S={}))b.call(S,k)&&v(p,k,S[k]);if(C)for(var k of C(S))g.call(S,k)&&v(p,k,S[k]);return p},h=`import { action } from '@storybook/addon-actions';
import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { withCenteredStory } from '../../utils/storybook/withCenteredStory';

import { UnitPicker, UnitPickerProps } from './UnitPicker';
import mdx from './UnitPicker.mdx';

const meta: ComponentMeta<typeof UnitPicker> = {
  title: 'Pickers and Editors/UnitPicker',
  component: UnitPicker,
  decorators: [withCenteredStory],
  parameters: {
    controls: {
      exclude: ['onChange', 'value'],
    },
    docs: mdx,
  },
};

export const Basic: ComponentStory<typeof UnitPicker> = (args: UnitPickerProps) => <UnitPicker {...args} />;

Basic.args = {
  onChange: action('onChange fired'),
  width: 30,
};

export default meta;
`,s={Basic:{startLoc:{col:56,line:22},endLoc:{col:107,line:22},startBody:{col:56,line:22},endBody:{col:107,line:22}}};const o={title:"Pickers and Editors/UnitPicker",component:d,decorators:[a.BU],parameters:{controls:{exclude:["onChange","value"]},docs:w}},r=p=>n.createElement(d,y({},p));r.args={onChange:(0,t.action)("onChange fired"),width:30};var u=o;r.parameters=y({storySource:{source:"(args: UnitPickerProps) => <UnitPicker {...args} />"}},r.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/UnitPicker/UnitPicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/UnitPicker/UnitPicker.story.tsx#ComponentMeta"})}catch(p){}},"./src/components/ValuePicker/ValuePicker.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{Simple:function(){return M},default:function(){return I}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../grafana-e2e-selectors/src/selectors/index.ts"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/Button/Button.tsx"),f=e("./src/components/Select/Select.tsx");function x({"aria-label":T,label:j,icon:K,options:F,onChange:$,variant:R,minWidth:U=16,size:H="sm",isFullWidth:W=!0,menuPlacement:oe,fill:Q,buttonCss:P}){const[ae,q]=(0,t.useState)(!1),Y=(0,a.l4)();return t.createElement(t.Fragment,null,!ae&&t.createElement(l.zx,{size:H||"sm",className:P,icon:K||"plus",onClick:()=>q(!0),variant:R,fill:Q,fullWidth:W,"aria-label":n.wl.components.ValuePicker.button(T!=null?T:j)},j),ae&&t.createElement("span",{style:{minWidth:Y.spacing(U),flexGrow:W?1:void 0}},t.createElement(f.Ph,{placeholder:j,options:F,"aria-label":n.wl.components.ValuePicker.select(T!=null?T:j),isOpen:!0,onCloseMenu:()=>q(!1),autoFocus:!0,onChange:ve=>{q(!1),$(ve)},menuPlacement:oe})))}try{x.displayName="ValuePicker",x.__docgenInfo={description:"",displayName:"ValuePicker",props:{"aria-label":{defaultValue:null,description:"Aria label applied to the input field",name:"aria-label",required:!1,type:{name:"string"}},label:{defaultValue:null,description:"Label to display on the picker button",name:"label",required:!0,type:{name:"string"}},icon:{defaultValue:null,description:"Icon to display on the picker button",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},options:{defaultValue:null,description:"ValuePicker options",name:"options",required:!0,type:{name:"SelectableValue<T>[]"}},onChange:{defaultValue:null,description:"Callback to handle selected option",name:"onChange",required:!0,type:{name:"(value: SelectableValue<T>) => void"}},variant:{defaultValue:null,description:"Which ButtonVariant to render",name:"variant",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},size:{defaultValue:{value:"sm"},description:"Size of button",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'}]}},minWidth:{defaultValue:{value:"16"},description:"Min width for select in grid units",name:"minWidth",required:!1,type:{name:"number"}},isFullWidth:{defaultValue:{value:"true"},description:"Should the picker cover the full width of its parent",name:"isFullWidth",required:!1,type:{name:"boolean"}},menuPlacement:{defaultValue:null,description:"Control where the menu is rendered",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},fill:{defaultValue:null,description:"Which ButtonFill to use",name:"fill",required:!1,type:{name:"enum",value:[{value:'"text"'},{value:'"solid"'},{value:'"outline"'}]}},buttonCss:{defaultValue:null,description:"custom css applied to the button",name:"buttonCss",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ValuePicker/ValuePicker.tsx#ValuePicker"]={docgenInfo:x.__docgenInfo,name:"ValuePicker",path:"src/components/ValuePicker/ValuePicker.tsx#ValuePicker"})}catch(T){}var d=e("./src/types/icon.ts"),i=e("./src/utils/storybook/withCenteredStory.tsx"),c=e("./src/components/Select/mockOptions.tsx"),E=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/jsx-runtime.js"),O=e("../../.yarn/__virtual__/@mdx-js-react-virtual-1486c62c42/2/yarn/cache/@mdx-js-react-npm-1.6.22-57e4c05c2b-bc84bd514b.zip/node_modules/@mdx-js/react/dist/esm.js"),m=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/blocks.js");function w(T){const j=Object.assign({h1:"h1",p:"p",h3:"h3",a:"a",pre:"pre",code:"code"},(0,O.ah)(),T.components);return(0,E.jsxs)(E.Fragment,{children:[(0,E.jsx)(m.h_,{title:"MDX|Button",component:x}),`
`,(0,E.jsx)(j.h1,{children:"ValuePicker"}),`
`,(0,E.jsx)(j.p,{children:"A component that looks like a button but transforms into a select when clicked."}),`
`,(0,E.jsx)(j.h3,{children:"Example usage"}),`
`,(0,E.jsxs)(j.p,{children:["This component is currently used when adding ",(0,E.jsx)(j.a,{href:"https://grafana.com/docs/grafana/latest/panels/field-options/",children:"FieldOverrides"})," in the panel edit mode."]}),`
`,(0,E.jsx)(j.pre,{children:(0,E.jsx)(j.code,{className:"language-tsx",children:`<ValuePicker
  label="Choose an option"
  options={[
    {
      value: 'option1',
      label: 'Option 1',
    },
    {
      value: 'option2',
      label: 'Option 2',
    },
    {
      value: 'option3',
      label: 'Option 3',
    },
  ]}
  onChange={(value) => doThings}
  variant="primary"
  size="md"
/>
`})}),`
`,(0,E.jsx)(m.xP,{of:x})]})}function _(T={}){const{wrapper:j}=Object.assign({},(0,O.ah)(),T.components);return j?(0,E.jsx)(j,Object.assign({},T,{children:(0,E.jsx)(w,T)})):w(T)}var C=_,b=Object.defineProperty,g=Object.defineProperties,v=Object.getOwnPropertyDescriptors,y=Object.getOwnPropertySymbols,h=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,o=(T,j,K)=>j in T?b(T,j,{enumerable:!0,configurable:!0,writable:!0,value:K}):T[j]=K,r=(T,j)=>{for(var K in j||(j={}))h.call(j,K)&&o(T,K,j[K]);if(y)for(var K of y(j))s.call(j,K)&&o(T,K,j[K]);return T},u=(T,j)=>g(T,v(j)),p=`import { ComponentMeta, ComponentStory } from '@storybook/react';
import React from 'react';

import { ValuePicker } from '@grafana/ui';

import { getAvailableIcons } from '../../types';
import { withCenteredStory } from '../../utils/storybook/withCenteredStory';
import { generateOptions } from '../Select/mockOptions';

import mdx from './ValuePicker.mdx';

const meta: ComponentMeta<typeof ValuePicker> = {
  title: 'Pickers and Editors/ValuePicker',
  component: ValuePicker,
  decorators: [withCenteredStory],
  parameters: {
    docs: {
      page: mdx,
    },
    controls: {
      exclude: ['onChange', 'options'],
    },
  },
  argTypes: {
    variant: {
      options: ['primary', 'secondary', 'destructive', 'link'],
      control: {
        type: 'select',
      },
    },
    icon: {
      control: {
        type: 'select',
        options: getAvailableIcons(),
      },
    },
    size: {
      options: ['sm', 'md', 'lg'],
      control: {
        type: 'select',
      },
    },
  },
};
const options = generateOptions();

export const Simple: ComponentStory<typeof ValuePicker> = (args) => {
  return (
    <div style={{ width: '200px' }}>
      <ValuePicker {...args} options={options} onChange={(v) => console.log(v)} />
    </div>
  );
};
Simple.args = {
  label: 'Pick an option',
  variant: 'primary',
  size: 'md',
  isFullWidth: false,
  icon: 'plus',
  menuPlacement: 'auto',
};

export default meta;
`,S={Simple:{startLoc:{col:58,line:47},endLoc:{col:1,line:53},startBody:{col:58,line:47},endBody:{col:1,line:53}}};const k={title:"Pickers and Editors/ValuePicker",component:x,decorators:[i.BU],parameters:{docs:{page:C},controls:{exclude:["onChange","options"]}},argTypes:{variant:{options:["primary","secondary","destructive","link"],control:{type:"select"}},icon:{control:{type:"select",options:(0,d.BI)()}},size:{options:["sm","md","lg"],control:{type:"select"}}}},D=(0,c.u)(),M=T=>t.createElement("div",{style:{width:"200px"}},t.createElement(x,u(r({},T),{options:D,onChange:j=>console.log(j)})));M.args={label:"Pick an option",variant:"primary",size:"md",isFullWidth:!1,icon:"plus",menuPlacement:"auto"};var I=k;M.parameters=r({storySource:{source:`(args) => {
  return (
    <div style={{ width: '200px' }}>
      <ValuePicker {...args} options={options} onChange={(v) => console.log(v)} />
    </div>
  );
}`}},M.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ValuePicker/ValuePicker.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/ValuePicker/ValuePicker.story.tsx#ComponentMeta"})}catch(T){}},"./src/components/VizLayout/VizLayout.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{BottomLegend:function(){return _},RightLegend:function(){return C}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/utils/storybook/withCenteredStory.tsx"),a=e("./src/components/VizLayout/VizLayout.tsx"),l=Object.defineProperty,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(b,g,v)=>g in b?l(b,g,{enumerable:!0,configurable:!0,writable:!0,value:v}):b[g]=v,c=(b,g)=>{for(var v in g||(g={}))x.call(g,v)&&i(b,v,g[v]);if(f)for(var v of f(g))d.call(g,v)&&i(b,v,g[v]);return b},E=null,O={BottomLegend:{startLoc:{col:35,line:31},endLoc:{col:1,line:54},startBody:{col:35,line:31},endBody:{col:1,line:54}},RightLegend:{startLoc:{col:34,line:61},endLoc:{col:1,line:84},startBody:{col:34,line:61},endBody:{col:1,line:84}}};const m={title:"Visualizations/VizLayout",component:a.AY,decorators:[n.BU],parameters:{docs:{},controls:{exclude:["legend"]}},argTypes:{width:{control:{type:"range",min:100,max:1e3}},height:{control:{type:"range",min:100,max:1e3}},legendWidth:{control:{type:"range",min:100,max:280}},legendItems:{control:{type:"number",min:1}}}},w=b=>Array.from({length:b},(v,y)=>y+1),_=({height:b,width:g,legendItems:v})=>{const[y,h]=(0,t.useState)(w(v));(0,t.useEffect)(()=>{h(w(v))},[v]);const s=t.createElement(a.AY.Legend,{placement:"bottom",maxHeight:"30%"},y.map((o,r)=>t.createElement("div",{style:{height:"30px",width:"100%",background:"blue",marginBottom:"2px"},key:r},"Legend item ",r)));return t.createElement(a.AY,{width:g,height:b,legend:s},(o,r)=>t.createElement("div",{style:{width:o,height:r,background:"red"}}))};_.args={height:600,width:500,legendItems:2};const C=({height:b,width:g,legendItems:v,legendWidth:y})=>{const[h,s]=(0,t.useState)(w(v));(0,t.useEffect)(()=>{s(w(v))},[v]);const o=t.createElement(a.AY.Legend,{placement:"right",maxWidth:"50%"},h.map((r,u)=>t.createElement("div",{style:{height:"30px",width:`${y}px`,background:"blue",marginBottom:"2px"},key:u},"Legend item ",u)));return t.createElement(a.AY,{width:g,height:b,legend:o},(r,u)=>t.createElement("div",{style:{width:r,height:u,background:"red"}}))};C.args={height:400,width:810,legendWidth:100,legendItems:2},V.default=m,_.parameters=c({storySource:{source:`({ height, width, legendItems }) => {
  const [items, setItems] = useState(createArray(legendItems));
  useEffect(() => {
    setItems(createArray(legendItems));
  }, [legendItems]);

  const legend = (
    <VizLayout.Legend placement="bottom" maxHeight="30%">
      {items.map((_, index) => (
        <div style={{ height: '30px', width: '100%', background: 'blue', marginBottom: '2px' }} key={index}>
          Legend item {index}
        </div>
      ))}
    </VizLayout.Legend>
  );

  return (
    <VizLayout width={width} height={height} legend={legend}>
      {(vizWidth: number, vizHeight: number) => {
        return <div style={{ width: vizWidth, height: vizHeight, background: 'red' }} />;
      }}
    </VizLayout>
  );
}`}},_.parameters),C.parameters=c({storySource:{source:`({ height, width, legendItems, legendWidth }) => {
  const [items, setItems] = useState(createArray(legendItems));
  useEffect(() => {
    setItems(createArray(legendItems));
  }, [legendItems]);

  const legend = (
    <VizLayout.Legend placement="right" maxWidth="50%">
      {items.map((_, index) => (
        <div style={{ height: '30px', width: \`\${legendWidth}px\`, background: 'blue', marginBottom: '2px' }} key={index}>
          Legend item {index}
        </div>
      ))}
    </VizLayout.Legend>
  );

  return (
    <VizLayout width={width} height={height} legend={legend}>
      {(vizWidth: number, vizHeight: number) => {
        return <div style={{ width: vizWidth, height: vizHeight, background: 'red' }} />;
      }}
    </VizLayout>
  );
}`}},C.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLayout/VizLayout.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/VizLayout/VizLayout.story.tsx#Meta"})}catch(b){}},"./src/components/VizLegend/VizLegend.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{WithNoValues:function(){return Ie},WithValues:function(){return qe},default:function(){return Ze}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../grafana-schema/src/common/common.gen.ts"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/events/common.ts"),l=e("./src/components/PanelChrome/PanelContext.ts"),f=(Oe=>(Oe.ToggleSelection="select",Oe.AppendToSelection="append",Oe))(f||{}),x=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/themes/stylesFactory.ts");const c=(0,i.B)((Oe=!1)=>({list:x.iv`
    list-style-type: none;
    margin: 0;
    padding: 0;
  `,item:x.iv`
    display: ${Oe&&"inline-block"||"block"};
  `}));class E extends t.PureComponent{constructor(ce){super(ce)}render(){const{items:ce,renderItem:pe,getItemKey:J,className:L,inline:fe}=this.props,xe=c(fe);return t.createElement("ul",{className:(0,x.cx)(xe.list,L)},ce.map((We,Ue)=>t.createElement("li",{className:xe.item,key:J?J(We):Ue},pe(We,Ue))))}}try{E.displayName="AbstractList",E.__docgenInfo={description:"",displayName:"AbstractList",props:{inline:{defaultValue:null,description:"",name:"inline",required:!1,type:{name:"boolean"}},items:{defaultValue:null,description:"",name:"items",required:!0,type:{name:"T[]"}},renderItem:{defaultValue:null,description:"",name:"renderItem",required:!0,type:{name:"(item: T, index: number) => Element"}},getItemKey:{defaultValue:null,description:"",name:"getItemKey",required:!1,type:{name:"((item: T) => string)"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/List/AbstractList.tsx#AbstractList"]={docgenInfo:E.__docgenInfo,name:"AbstractList",path:"src/components/List/AbstractList.tsx#AbstractList"})}catch(Oe){}var O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(Oe,ce,pe)=>ce in Oe?O(Oe,ce,{enumerable:!0,configurable:!0,writable:!0,value:pe}):Oe[ce]=pe,b=(Oe,ce)=>{for(var pe in ce||(ce={}))w.call(ce,pe)&&C(Oe,pe,ce[pe]);if(m)for(var pe of m(ce))_.call(ce,pe)&&C(Oe,pe,ce[pe]);return Oe};class g extends t.PureComponent{render(){return t.createElement(E,b({inline:!0},this.props))}}try{g.displayName="InlineList",g.__docgenInfo={description:"",displayName:"InlineList",props:{items:{defaultValue:null,description:"",name:"items",required:!0,type:{name:"T[]"}},renderItem:{defaultValue:null,description:"",name:"renderItem",required:!0,type:{name:"(item: T, index: number) => Element"}},getItemKey:{defaultValue:null,description:"",name:"getItemKey",required:!1,type:{name:"((item: T) => string)"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/List/InlineList.tsx#InlineList"]={docgenInfo:g.__docgenInfo,name:"InlineList",path:"src/components/List/InlineList.tsx#InlineList"})}catch(Oe){}var v=Object.defineProperty,y=Object.getOwnPropertySymbols,h=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,o=(Oe,ce,pe)=>ce in Oe?v(Oe,ce,{enumerable:!0,configurable:!0,writable:!0,value:pe}):Oe[ce]=pe,r=(Oe,ce)=>{for(var pe in ce||(ce={}))h.call(ce,pe)&&o(Oe,pe,ce[pe]);if(y)for(var pe of y(ce))s.call(ce,pe)&&o(Oe,pe,ce[pe]);return Oe};class u extends t.PureComponent{render(){return t.createElement(E,r({},this.props))}}try{u.displayName="List",u.__docgenInfo={description:"",displayName:"List",props:{items:{defaultValue:null,description:"",name:"items",required:!0,type:{name:"T[]"}},renderItem:{defaultValue:null,description:"",name:"renderItem",required:!0,type:{name:"(item: T, index: number) => Element"}},getItemKey:{defaultValue:null,description:"",name:"getItemKey",required:!1,type:{name:"((item: T) => string)"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/List/List.tsx#List"]={docgenInfo:u.__docgenInfo,name:"List",path:"src/components/List/List.tsx#List"})}catch(Oe){}var p=e("../grafana-e2e-selectors/src/selectors/index.ts"),S=e("./src/components/ColorPicker/ColorPicker.tsx"),k=e("./src/components/VizLegend/SeriesIcon.tsx");const D=t.memo(({seriesName:Oe,color:ce,gradient:pe,readonly:J})=>{const{onSeriesColorChange:L}=(0,l.R9)(),fe=(0,t.useCallback)(xe=>L(Oe,xe),[Oe,L]);return Oe&&L&&ce&&!J?t.createElement(S.sp,{color:ce,onChange:fe,enableNamedColors:!0},({ref:xe,showColorPicker:We,hideColorPicker:Ue})=>t.createElement(k.F,{color:ce,className:"pointer",ref:xe,onClick:We,onMouseLeave:Ue})):t.createElement(k.F,{color:ce,gradient:pe})});D.displayName="VizLegendSeriesIcon";try{D.displayName="VizLegendSeriesIcon",D.__docgenInfo={description:"",displayName:"VizLegendSeriesIcon",props:{seriesName:{defaultValue:null,description:"",name:"seriesName",required:!0,type:{name:"string"}},color:{defaultValue:null,description:"",name:"color",required:!1,type:{name:"string"}},gradient:{defaultValue:null,description:"",name:"gradient",required:!1,type:{name:"string"}},readonly:{defaultValue:null,description:"",name:"readonly",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/VizLegendSeriesIcon.tsx#VizLegendSeriesIcon"]={docgenInfo:D.__docgenInfo,name:"VizLegendSeriesIcon",path:"src/components/VizLegend/VizLegendSeriesIcon.tsx#VizLegendSeriesIcon"})}catch(Oe){}var M=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),I=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts");const T=({stats:Oe})=>{const ce=(0,d.wW)(j);return Oe.length===0?null:t.createElement(g,{className:ce.list,items:Oe,renderItem:pe=>t.createElement("div",{className:ce.item,title:pe.description},pe.title&&`${(0,M.capitalize)(pe.title)}:`," ",(0,I.zc)(pe))})},j=()=>({list:x.iv`
    flex-grow: 1;
    text-align: right;
  `,item:x.iv`
    margin-left: 8px;
  `});T.displayName="VizLegendStatsList";try{T.displayName="VizLegendStatsList",T.__docgenInfo={description:"",displayName:"VizLegendStatsList",props:{stats:{defaultValue:null,description:"",name:"stats",required:!0,type:{name:"DisplayValue[]"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/VizLegendStatsList.tsx#VizLegendStatsList"]={docgenInfo:T.__docgenInfo,name:"VizLegendStatsList",path:"src/components/VizLegend/VizLegendStatsList.tsx#VizLegendStatsList"})}catch(Oe){}const K=({item:Oe,onLabelClick:ce,onLabelMouseOver:pe,onLabelMouseOut:J,className:L,readonly:fe})=>{const xe=(0,d.wW)(F),We=(0,t.useCallback)(it=>{pe&&pe(Oe,it)},[Oe,pe]),Ue=(0,t.useCallback)(it=>{J&&J(Oe,it)},[Oe,J]),at=(0,t.useCallback)(it=>{ce&&ce(Oe,it)},[Oe,ce]);return t.createElement("div",{className:(0,x.cx)(xe.itemWrapper,Oe.disabled&&xe.itemDisabled,L),"aria-label":p.wl.components.VizLegend.seriesName(Oe.label)},t.createElement(D,{seriesName:Oe.label,color:Oe.color,gradient:Oe.gradient,readonly:fe}),t.createElement("button",{disabled:fe,type:"button",onBlur:Ue,onFocus:We,onMouseOver:We,onMouseOut:Ue,onClick:at,className:xe.label},Oe.label),Oe.getDisplayValues&&t.createElement(T,{stats:Oe.getDisplayValues()}))};K.displayName="VizLegendListItem";const F=Oe=>({label:x.iv`
    label: LegendLabel;
    white-space: nowrap;
    background: none;
    border: none;
    font-size: inherit;
    padding: 0;
    user-select: text;
  `,itemDisabled:x.iv`
    label: LegendLabelDisabled;
    color: ${Oe.colors.text.disabled};
  `,itemWrapper:x.iv`
    label: LegendItemWrapper;
    display: flex;
    white-space: nowrap;
    align-items: center;
    flex-grow: 1;
  `,value:x.iv`
    text-align: right;
  `,yAxisLabel:x.iv`
    color: ${Oe.v1.palette.gray2};
  `});try{K.displayName="VizLegendListItem",K.__docgenInfo={description:"",displayName:"VizLegendListItem",props:{item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"VizLegendItem<T>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},onLabelClick:{defaultValue:null,description:"",name:"onLabelClick",required:!1,type:{name:"((item: VizLegendItem<T>, event: MouseEvent<HTMLButtonElement, MouseEvent>) => void)"}},onLabelMouseOver:{defaultValue:null,description:"",name:"onLabelMouseOver",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},onLabelMouseOut:{defaultValue:null,description:"",name:"onLabelMouseOut",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},readonly:{defaultValue:null,description:"",name:"readonly",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/VizLegendListItem.tsx#VizLegendListItem"]={docgenInfo:K.__docgenInfo,name:"VizLegendListItem",path:"src/components/VizLegend/VizLegendListItem.tsx#VizLegendListItem"})}catch(Oe){}const $=({items:Oe,itemRenderer:ce,onLabelMouseOver:pe,onLabelMouseOut:J,onLabelClick:L,placement:fe,className:xe,readonly:We})=>{const Ue=(0,d.wW)(R);ce||(ce=it=>t.createElement(K,{item:it,onLabelClick:L,onLabelMouseOver:pe,onLabelMouseOut:J,readonly:We}));const at=it=>`${it.getItemKey?it.getItemKey():it.label}`;switch(fe){case"right":{const it=(_t,wt)=>t.createElement("span",{className:Ue.itemRight},ce(_t,wt));return t.createElement("div",{className:(0,x.cx)(Ue.rightWrapper,xe)},t.createElement(u,{items:Oe,renderItem:it,getItemKey:at}))}case"bottom":default:{const it=(_t,wt)=>t.createElement("span",{className:Ue.itemBottom},ce(_t,wt));return t.createElement("div",{className:(0,x.cx)(Ue.bottomWrapper,xe)},t.createElement("div",{className:Ue.section},t.createElement(g,{items:Oe.filter(_t=>_t.yAxis===1),renderItem:it,getItemKey:at})),t.createElement("div",{className:(0,x.cx)(Ue.section,Ue.sectionRight)},t.createElement(g,{items:Oe.filter(_t=>_t.yAxis!==1),renderItem:it,getItemKey:at})))}}};$.displayName="VizLegendList";const R=Oe=>{const ce=x.iv`
    padding-right: 10px;
    display: flex;
    font-size: ${Oe.typography.bodySmall.fontSize};
    white-space: nowrap;
  `;return{itemBottom:ce,itemRight:(0,x.cx)(ce,x.iv`
        margin-bottom: ${Oe.spacing(.5)};
      `),rightWrapper:x.iv`
      padding-left: ${Oe.spacing(.5)};
    `,bottomWrapper:x.iv`
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      width: 100%;
      padding-left: ${Oe.spacing(.5)};
    `,section:x.iv`
      display: flex;
    `,sectionRight:x.iv`
      justify-content: flex-end;
      flex-grow: 1;
    `}};try{$.displayName="VizLegendList",$.__docgenInfo={description:"",displayName:"VizLegendList",props:{placement:{defaultValue:null,description:"",name:"placement",required:!0,type:{name:"enum",value:[{value:'"right"'},{value:'"bottom"'}]}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},items:{defaultValue:null,description:"",name:"items",required:!0,type:{name:"VizLegendItem<T>[]"}},seriesVisibilityChangeBehavior:{defaultValue:null,description:"",name:"seriesVisibilityChangeBehavior",required:!1,type:{name:"enum",value:[{value:"0"},{value:"1"}]}},onLabelClick:{defaultValue:null,description:"",name:"onLabelClick",required:!1,type:{name:"((item: VizLegendItem<T>, event: MouseEvent<HTMLButtonElement, MouseEvent>) => void)"}},itemRenderer:{defaultValue:null,description:"",name:"itemRenderer",required:!1,type:{name:"((item: VizLegendItem<T>, index: number) => Element)"}},onLabelMouseOver:{defaultValue:null,description:"",name:"onLabelMouseOver",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},onLabelMouseOut:{defaultValue:null,description:"",name:"onLabelMouseOut",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},readonly:{defaultValue:null,description:"",name:"readonly",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/VizLegendList.tsx#VizLegendList"]={docgenInfo:$.__docgenInfo,name:"VizLegendList",path:"src/components/VizLegend/VizLegendList.tsx#VizLegendList"})}catch(Oe){}var U=e("./src/components/Icon/Icon.tsx"),H=e("./src/themes/mixins.ts");const W=({item:Oe,onLabelClick:ce,onLabelMouseOver:pe,onLabelMouseOut:J,className:L,readonly:fe})=>{const xe=(0,d.wW)(oe),We=(0,t.useCallback)(it=>{pe&&pe(Oe,it)},[Oe,pe]),Ue=(0,t.useCallback)(it=>{J&&J(Oe,it)},[Oe,J]),at=(0,t.useCallback)(it=>{ce&&ce(Oe,it)},[Oe,ce]);return t.createElement("tr",{className:(0,x.cx)(xe.row,L)},t.createElement("td",null,t.createElement("span",{className:xe.itemWrapper},t.createElement(D,{color:Oe.color,seriesName:Oe.label,readonly:fe}),t.createElement("button",{disabled:fe,type:"button",onBlur:Ue,onFocus:We,onMouseOver:We,onMouseOut:Ue,onClick:fe?void 0:at,className:(0,x.cx)(xe.label,Oe.disabled&&xe.labelDisabled)},Oe.label," ",Oe.yAxis===2&&t.createElement("span",{className:xe.yAxisLabel},"(right y-axis)")))),Oe.getDisplayValues&&Oe.getDisplayValues().map((it,_t)=>t.createElement("td",{className:xe.value,key:`${it.title}-${_t}`},(0,I.zc)(it))))};W.displayName="LegendTableItem";const oe=Oe=>{const ce=H.BL(Oe.colors.background.primary,Oe);return{row:x.iv`
      label: LegendRow;
      font-size: ${Oe.v1.typography.size.sm};
      border-bottom: 1px solid ${Oe.colors.border.weak};
      td {
        padding: ${Oe.spacing(.25,1)};
        white-space: nowrap;
      }

      &:hover {
        background: ${ce};
      }
    `,label:x.iv`
      label: LegendLabel;
      white-space: nowrap;
      background: none;
      border: none;
      font-size: inherit;
      padding: 0;
    `,labelDisabled:x.iv`
      label: LegendLabelDisabled;
      color: ${Oe.colors.text.disabled};
    `,itemWrapper:x.iv`
      display: flex;
      white-space: nowrap;
      align-items: center;
    `,value:x.iv`
      text-align: right;
    `,yAxisLabel:x.iv`
      color: ${Oe.colors.text.secondary};
    `}};try{W.displayName="LegendTableItem",W.__docgenInfo={description:"",displayName:"LegendTableItem",props:{key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"Key"}},item:{defaultValue:null,description:"",name:"item",required:!0,type:{name:"VizLegendItem<any>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},onLabelClick:{defaultValue:null,description:"",name:"onLabelClick",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent>) => void)"}},onLabelMouseOver:{defaultValue:null,description:"",name:"onLabelMouseOver",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},onLabelMouseOut:{defaultValue:null,description:"",name:"onLabelMouseOut",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},readonly:{defaultValue:null,description:"",name:"readonly",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/VizLegendTableItem.tsx#LegendTableItem"]={docgenInfo:W.__docgenInfo,name:"LegendTableItem",path:"src/components/VizLegend/VizLegendTableItem.tsx#LegendTableItem"})}catch(Oe){}const Q=({items:Oe,sortBy:ce,sortDesc:pe,itemRenderer:J,className:L,onToggleSort:fe,onLabelClick:xe,onLabelMouseOver:We,onLabelMouseOut:Ue,readonly:at})=>{var it;const _t=(0,d.wW)(P),wt={};for(const _e of Oe)if(_e.getDisplayValues)for(const ge of _e.getDisplayValues())wt[(it=ge.title)!=null?it:"?"]=ge;const ee=ce?(0,M.orderBy)(Oe,_e=>{if(_e.getDisplayValues){const ge=_e.getDisplayValues().filter(de=>de.title===ce)[0];return ge&&ge.numeric}},pe?"desc":"asc"):Oe;return J||(J=(_e,ge)=>t.createElement(W,{key:`${_e.label}-${ge}`,item:_e,onLabelClick:xe,onLabelMouseOver:We,onLabelMouseOut:Ue,readonly:at})),t.createElement("table",{className:(0,x.cx)(_t.table,L)},t.createElement("thead",null,t.createElement("tr",null,t.createElement("th",null),Object.keys(wt).map(_e=>{const ge=wt[_e];return t.createElement("th",{title:ge.description,key:_e,className:(0,x.cx)(_t.header,fe&&_t.headerSortable,{[_t.withIcon]:ce===_e}),onClick:()=>{fe&&fe(_e)}},_e,ce===_e&&t.createElement(U.J,{size:"xs",name:pe?"angle-down":"angle-up"}))}))),t.createElement("tbody",null,ee.map(J)))},P=Oe=>({table:x.iv`
    width: 100%;
    th:first-child {
      width: 100%;
      border-bottom: 1px solid ${Oe.colors.border.weak};
    }
  `,header:x.iv`
    color: ${Oe.colors.primary.text};
    font-weight: ${Oe.typography.fontWeightMedium};
    border-bottom: 1px solid ${Oe.colors.border.weak};
    padding: ${Oe.spacing(.25,1,.25,1)};
    font-size: ${Oe.typography.bodySmall.fontSize};
    text-align: right;
    white-space: nowrap;
  `,withIcon:x.iv`
    padding-right: 4px;
  `,headerSortable:x.iv`
    cursor: pointer;
  `});try{Q.displayName="VizLegendTable",Q.__docgenInfo={description:"",displayName:"VizLegendTable",props:{sortBy:{defaultValue:null,description:"",name:"sortBy",required:!1,type:{name:"string"}},sortDesc:{defaultValue:null,description:"",name:"sortDesc",required:!1,type:{name:"boolean"}},onToggleSort:{defaultValue:null,description:"",name:"onToggleSort",required:!1,type:{name:"((sortBy: string) => void)"}},placement:{defaultValue:null,description:"",name:"placement",required:!0,type:{name:"enum",value:[{value:'"right"'},{value:'"bottom"'}]}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},items:{defaultValue:null,description:"",name:"items",required:!0,type:{name:"VizLegendItem<T>[]"}},seriesVisibilityChangeBehavior:{defaultValue:null,description:"",name:"seriesVisibilityChangeBehavior",required:!1,type:{name:"enum",value:[{value:"0"},{value:"1"}]}},onLabelClick:{defaultValue:null,description:"",name:"onLabelClick",required:!1,type:{name:"((item: VizLegendItem<T>, event: MouseEvent<HTMLButtonElement, MouseEvent>) => void)"}},itemRenderer:{defaultValue:null,description:"",name:"itemRenderer",required:!1,type:{name:"((item: VizLegendItem<T>, index: number) => Element)"}},onLabelMouseOver:{defaultValue:null,description:"",name:"onLabelMouseOver",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},onLabelMouseOut:{defaultValue:null,description:"",name:"onLabelMouseOut",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},readonly:{defaultValue:null,description:"",name:"readonly",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/VizLegendTable.tsx#VizLegendTable"]={docgenInfo:Q.__docgenInfo,name:"VizLegendTable",path:"src/components/VizLegend/VizLegendTable.tsx#VizLegendTable"})}catch(Oe){}var ae=(Oe=>(Oe[Oe.Isolate=0]="Isolate",Oe[Oe.Hide=1]="Hide",Oe))(ae||{});function q(Oe){return Oe.ctrlKey||Oe.metaKey||Oe.shiftKey?f.AppendToSelection:f.ToggleSelection}function Y({items:Oe,displayMode:ce,sortBy:pe,seriesVisibilityChangeBehavior:J=ae.Isolate,sortDesc:L,onLabelClick:fe,onToggleSort:xe,placement:We,className:Ue,itemRenderer:at,readonly:it}){const{eventBus:_t,onToggleSeriesVisibility:wt,onToggleLegendSort:ee}=(0,l.R9)(),_e=(0,t.useCallback)((Ee,ze)=>{_t==null||_t.publish({type:a.es.type,payload:{raw:ze,x:0,y:0,dataId:Ee.label}})},[_t]),ge=(0,t.useCallback)((Ee,ze)=>{_t==null||_t.publish({type:a.xH.type,payload:{raw:ze,x:0,y:0,dataId:Ee.label}})},[_t]),de=(0,t.useCallback)((Ee,ze)=>{fe&&fe(Ee,ze),wt&&wt(Ee.label,J===ae.Hide?f.AppendToSelection:q(ze))},[wt,fe,J]);switch(ce){case n.jK.Table:return t.createElement(Q,{className:Ue,items:Oe,placement:We,sortBy:pe,sortDesc:L,onLabelClick:de,onToggleSort:xe||ee,onLabelMouseOver:_e,onLabelMouseOut:ge,itemRenderer:at,readonly:it});case n.jK.List:return t.createElement($,{className:Ue,items:Oe,placement:We,onLabelMouseOver:_e,onLabelMouseOut:ge,onLabelClick:de,itemRenderer:at,readonly:it});default:return null}}Y.displayName="VizLegend";try{Y.displayName="VizLegend",Y.__docgenInfo={description:"",displayName:"VizLegend",props:{displayMode:{defaultValue:null,description:"",name:"displayMode",required:!0,type:{name:"enum",value:[{value:'"hidden"'},{value:'"list"'},{value:'"table"'}]}},placement:{defaultValue:null,description:"",name:"placement",required:!0,type:{name:"enum",value:[{value:'"right"'},{value:'"bottom"'}]}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},items:{defaultValue:null,description:"",name:"items",required:!0,type:{name:"VizLegendItem<T>[]"}},seriesVisibilityChangeBehavior:{defaultValue:{value:"SeriesVisibilityChangeBehavior.Isolate"},description:"",name:"seriesVisibilityChangeBehavior",required:!1,type:{name:"enum",value:[{value:"0"},{value:"1"}]}},onLabelClick:{defaultValue:null,description:"",name:"onLabelClick",required:!1,type:{name:"((item: VizLegendItem<T>, event: MouseEvent<HTMLButtonElement, MouseEvent>) => void)"}},itemRenderer:{defaultValue:null,description:"",name:"itemRenderer",required:!1,type:{name:"((item: VizLegendItem<T>, index: number) => Element)"}},onLabelMouseOver:{defaultValue:null,description:"",name:"onLabelMouseOver",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},onLabelMouseOut:{defaultValue:null,description:"",name:"onLabelMouseOut",required:!1,type:{name:"((item: VizLegendItem<any>, event: MouseEvent<HTMLButtonElement, MouseEvent> | FocusEvent<HTMLButtonElement, Element>) => void)"}},readonly:{defaultValue:null,description:"",name:"readonly",required:!1,type:{name:"boolean"}},sortBy:{defaultValue:null,description:"",name:"sortBy",required:!1,type:{name:"string"}},sortDesc:{defaultValue:null,description:"",name:"sortDesc",required:!1,type:{name:"boolean"}},onToggleSort:{defaultValue:null,description:"",name:"onToggleSort",required:!1,type:{name:"((sortBy: string) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/VizLegend.tsx#VizLegend"]={docgenInfo:Y.__docgenInfo,name:"VizLegend",path:"src/components/VizLegend/VizLegend.tsx#VizLegend"})}catch(Oe){}var ve=e("./src/utils/storybook/withCenteredStory.tsx"),re=Object.defineProperty,je=Object.defineProperties,me=Object.getOwnPropertyDescriptors,ne=Object.getOwnPropertySymbols,Z=Object.prototype.hasOwnProperty,te=Object.prototype.propertyIsEnumerable,Pe=(Oe,ce,pe)=>ce in Oe?re(Oe,ce,{enumerable:!0,configurable:!0,writable:!0,value:pe}):Oe[ce]=pe,he=(Oe,ce)=>{for(var pe in ce||(ce={}))Z.call(ce,pe)&&Pe(Oe,pe,ce[pe]);if(ne)for(var pe of ne(ce))te.call(ce,pe)&&Pe(Oe,pe,ce[pe]);return Oe},ie=(Oe,ce)=>je(Oe,me(ce)),Ce=null,Le={WithNoValues:{startLoc:{col:35,line:79},endLoc:{col:1,line:102},startBody:{col:35,line:79},endBody:{col:1,line:102}},WithValues:{startLoc:{col:33,line:104},endLoc:{col:1,line:148},startBody:{col:33,line:104},endBody:{col:1,line:148}}};const we={title:"Visualizations/VizLegend",component:Y,decorators:[ve.BU],args:{containerWidth:"100%",seriesCount:5},argTypes:{containerWidth:{control:{type:"select",options:["200px","500px","100%"]}},seriesCount:{control:{type:"number",min:1,max:8}}}},ue=({displayMode:Oe,seriesCount:ce,name:pe,placement:J,stats:L})=>{const fe=(0,d.l4)(),[xe,We]=(0,t.useState)(Je(ce,fe,L));(0,t.useEffect)(()=>{We(Je(ce,fe,L))},[ce,fe,L]);const Ue=at=>{We(xe.map(it=>it!==at?ie(he({},it),{disabled:!0}):ie(he({},it),{disabled:!1})))};return t.createElement("p",{style:{marginBottom:"32px"}},t.createElement("h3",{style:{marginBottom:"32px"}},pe),t.createElement(Y,{displayMode:Oe,items:xe,placement:J,onLabelClick:Ue}))},Ie=({containerWidth:Oe,seriesCount:ce})=>t.createElement("div",{style:{width:Oe}},t.createElement(ue,{name:"List mode, placement bottom",displayMode:n.jK.List,seriesCount:ce,placement:"bottom"}),t.createElement(ue,{name:"List mode, placement right",displayMode:n.jK.List,seriesCount:ce,placement:"right"}),t.createElement(ue,{name:"Table mode",displayMode:n.jK.Table,seriesCount:ce,placement:"bottom"})),qe=({containerWidth:Oe,seriesCount:ce})=>{const pe=[{title:"Min",text:"5.00",numeric:5},{title:"Max",text:"10.00",numeric:10},{title:"Last",text:"2.00",numeric:2}];return t.createElement("div",{style:{width:Oe}},t.createElement(ue,{name:"List mode, placement bottom",displayMode:n.jK.List,seriesCount:ce,placement:"bottom",stats:pe}),t.createElement(ue,{name:"List mode, placement right",displayMode:n.jK.List,seriesCount:ce,placement:"right",stats:pe}),t.createElement(ue,{name:"Table mode",displayMode:n.jK.Table,seriesCount:ce,placement:"bottom",stats:pe}))};function Je(Oe,ce,pe){const J="abcdefghijklmnopqrstuvwxyz".split(""),L=["green","blue","red","purple","orange","dark-green","yellow","light-blue"].map(fe=>ce.visualization.getColorByName(fe));return[...new Array(Oe)].map((fe,xe)=>({label:`${J[xe].toUpperCase()}-series`,color:L[xe],yAxis:1,displayValues:pe||[]}))}var Ze=we;Ie.parameters=he({storySource:{source:`({ containerWidth, seriesCount }) => {
  return (
    <div style={{ width: containerWidth }}>
      <LegendStoryDemo
        name="List mode, placement bottom"
        displayMode={LegendDisplayMode.List}
        seriesCount={seriesCount}
        placement="bottom"
      />
      <LegendStoryDemo
        name="List mode, placement right"
        displayMode={LegendDisplayMode.List}
        seriesCount={seriesCount}
        placement="right"
      />
      <LegendStoryDemo
        name="Table mode"
        displayMode={LegendDisplayMode.Table}
        seriesCount={seriesCount}
        placement="bottom"
      />
    </div>
  );
}`}},Ie.parameters),qe.parameters=he({storySource:{source:`({ containerWidth, seriesCount }) => {
  const stats: DisplayValue[] = [
    {
      title: 'Min',
      text: '5.00',
      numeric: 5,
    },
    {
      title: 'Max',
      text: '10.00',
      numeric: 10,
    },
    {
      title: 'Last',
      text: '2.00',
      numeric: 2,
    },
  ];

  return (
    <div style={{ width: containerWidth }}>
      <LegendStoryDemo
        name="List mode, placement bottom"
        displayMode={LegendDisplayMode.List}
        seriesCount={seriesCount}
        placement="bottom"
        stats={stats}
      />
      <LegendStoryDemo
        name="List mode, placement right"
        displayMode={LegendDisplayMode.List}
        seriesCount={seriesCount}
        placement="right"
        stats={stats}
      />
      <LegendStoryDemo
        name="Table mode"
        displayMode={LegendDisplayMode.Table}
        seriesCount={seriesCount}
        placement="bottom"
        stats={stats}
      />
    </div>
  );
}`}},qe.parameters);try{Meta.displayName="Meta",Meta.__docgenInfo={description:"Metadata to configure the stories for a component.",displayName:"Meta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/VizLegend.story.tsx#Meta"]={docgenInfo:Meta.__docgenInfo,name:"Meta",path:"src/components/VizLegend/VizLegend.story.tsx#Meta"})}catch(Oe){}},"./src/components/VizTooltip/SeriesTable.story.tsx":function(se,V,e){"use strict";e.r(V),e.d(V,{basic:function(){return s},default:function(){return r},multi:function(){return o}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/VizLegend/SeriesIcon.tsx");const f=u=>({icon:n.iv`
      margin-right: ${u.spacing(1)};
      vertical-align: middle;
    `,seriesTable:n.iv`
      display: table;
    `,seriesTableRow:n.iv`
      display: table-row;
      font-size: ${u.typography.bodySmall.fontSize};
    `,seriesTableCell:n.iv`
      display: table-cell;
    `,label:n.iv`
      word-break: break-all;
    `,value:n.iv`
      padding-left: ${u.spacing(2)};
    `,activeSeries:n.iv`
      font-weight: ${u.typography.fontWeightBold};
      color: ${u.colors.text.maxContrast};
    `,timestamp:n.iv`
      font-weight: ${u.typography.fontWeightBold};
      font-size: ${u.typography.bodySmall.fontSize};
    `}),x=({color:u,label:p,value:S,isActive:k})=>{const D=(0,a.wW)(f);return t.createElement("div",{"data-testid":"SeriesTableRow",className:(0,n.cx)(D.seriesTableRow,k&&D.activeSeries)},u&&t.createElement("div",{className:D.seriesTableCell},t.createElement(l.F,{color:u,className:D.icon})),p&&t.createElement("div",{className:(0,n.cx)(D.seriesTableCell,D.label)},p),S&&t.createElement("div",{className:(0,n.cx)(D.seriesTableCell,D.value)},S))},d=({timestamp:u,series:p})=>{const S=(0,a.wW)(f);return t.createElement(t.Fragment,null,u&&t.createElement("div",{className:S.timestamp,"aria-label":"Timestamp"},u),p.map((k,D)=>t.createElement(x,{isActive:k.isActive,label:k.label,color:k.color,value:k.value,key:`${k.label}-${D}`})))};try{x.displayName="SeriesTableRow",x.__docgenInfo={description:"",displayName:"SeriesTableRow",props:{color:{defaultValue:null,description:"",name:"color",required:!1,type:{name:"string"}},label:{defaultValue:null,description:"",name:"label",required:!1,type:{name:"ReactNode"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string | GraphSeriesValue"}},isActive:{defaultValue:null,description:"",name:"isActive",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizTooltip/SeriesTable.tsx#SeriesTableRow"]={docgenInfo:x.__docgenInfo,name:"SeriesTableRow",path:"src/components/VizTooltip/SeriesTable.tsx#SeriesTableRow"})}catch(u){}try{d.displayName="SeriesTable",d.__docgenInfo={description:"",displayName:"SeriesTable",props:{timestamp:{defaultValue:null,description:"",name:"timestamp",required:!1,type:{name:"string | GraphSeriesValue"}},series:{defaultValue:null,description:"",name:"series",required:!0,type:{name:"SeriesTableRowProps[]"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizTooltip/SeriesTable.tsx#SeriesTable"]={docgenInfo:d.__docgenInfo,name:"SeriesTable",path:"src/components/VizTooltip/SeriesTable.tsx#SeriesTable"})}catch(u){}var i=Object.defineProperty,c=Object.defineProperties,E=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(u,p,S)=>p in u?i(u,p,{enumerable:!0,configurable:!0,writable:!0,value:S}):u[p]=S,C=(u,p)=>{for(var S in p||(p={}))m.call(p,S)&&_(u,S,p[S]);if(O)for(var S of O(p))w.call(p,S)&&_(u,S,p[S]);return u},b=(u,p)=>c(u,E(p)),g=`import { ComponentStory, ComponentMeta } from '@storybook/react';
import React from 'react';

import { SeriesTable } from './SeriesTable';

const meta: ComponentMeta<typeof SeriesTable> = {
  title: 'VizTooltip/SeriesTable',
  component: SeriesTable,
  argTypes: {
    timestamp: {
      control: 'date',
    },
  },
};

const Template: ComponentStory<typeof SeriesTable> = (args) => {
  const date = new Date(args.timestamp!).toLocaleString();
  return (
    <div>
      <SeriesTable {...args} timestamp={date} />
    </div>
  );
};

export const basic = Template.bind({});

basic.args = {
  timestamp: new Date('2021-01-01T00:00:00').toISOString(),
  series: [
    {
      color: '#299c46',
      label: 'label 1',
      value: '100 W',
    },
  ],
};

export const multi = Template.bind({});

multi.args = {
  timestamp: new Date('2021-01-01T00:00:00').toISOString(),
  series: [
    {
      color: '#299c46',
      label: 'label 1',
      value: '100 W',
      isActive: false,
    },
    {
      color: '#9933cc',
      label: 'label yes',
      value: '25 W',
      isActive: true,
    },
    {
      color: '#eb7b18',
      label: 'label 3',
      value: '150 W',
      isActive: false,
    },
  ],
};

export default meta;
`,v={basic:{startLoc:{col:53,line:16},endLoc:{col:1,line:23},startBody:{col:53,line:16},endBody:{col:1,line:23}},multi:{startLoc:{col:53,line:16},endLoc:{col:1,line:23},startBody:{col:53,line:16},endBody:{col:1,line:23}}};const y={title:"VizTooltip/SeriesTable",component:d,argTypes:{timestamp:{control:"date"}}},h=u=>{const p=new Date(u.timestamp).toLocaleString();return t.createElement("div",null,t.createElement(d,b(C({},u),{timestamp:p})))},s=h.bind({});s.args={timestamp:new Date("2021-01-01T00:00:00").toISOString(),series:[{color:"#299c46",label:"label 1",value:"100 W"}]};const o=h.bind({});o.args={timestamp:new Date("2021-01-01T00:00:00").toISOString(),series:[{color:"#299c46",label:"label 1",value:"100 W",isActive:!1},{color:"#9933cc",label:"label yes",value:"25 W",isActive:!0},{color:"#eb7b18",label:"label 3",value:"150 W",isActive:!1}]};var r=y;s.parameters=C({storySource:{source:`(args) => {
  const date = new Date(args.timestamp!).toLocaleString();
  return (
    <div>
      <SeriesTable {...args} timestamp={date} />
    </div>
  );
}`}},s.parameters),o.parameters=C({storySource:{source:`(args) => {
  const date = new Date(args.timestamp!).toLocaleString();
  return (
    <div>
      <SeriesTable {...args} timestamp={date} />
    </div>
  );
}`}},o.parameters);try{ComponentMeta.displayName="ComponentMeta",ComponentMeta.__docgenInfo={description:"For the common case where a component's stories are simple components that receives args as props:\n\n```tsx\nexport default { ... } as ComponentMeta<typeof Button>;\n```",displayName:"ComponentMeta",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizTooltip/SeriesTable.story.tsx#ComponentMeta"]={docgenInfo:ComponentMeta.__docgenInfo,name:"ComponentMeta",path:"src/components/VizTooltip/SeriesTable.story.tsx#ComponentMeta"})}catch(u){}},"../grafana-e2e-selectors/src/selectors/index.ts":function(se,V,e){"use strict";e.d(V,{wl:function(){return a}});const t={Breadcrumbs:{breadcrumb:l=>`data-testid ${l} breadcrumb`},TimePicker:{openButton:"data-testid TimePicker Open Button",fromField:"Time Range from field",toField:"Time Range to field",applyTimeRange:"data-testid TimePicker submit button",calendar:{label:"Time Range calendar",openButton:"Open time range calendar",closeButton:"Close time range Calendar"},absoluteTimeRangeTitle:"data-testid-absolute-time-range-narrow"},DataSourcePermissions:{form:()=>'form[name="addPermission"]',roleType:"Role to add new permission to",rolePicker:"Built-in role picker",permissionLevel:"Permission Level"},DataSource:{TestData:{QueryTab:{scenarioSelectContainer:"Test Data Query scenario select container",scenarioSelect:"Test Data Query scenario select",max:"TestData max",min:"TestData min",noise:"TestData noise",seriesCount:"TestData series count",spread:"TestData spread",startValue:"TestData start value",drop:"TestData drop values"}},DataSourceHttpSettings:{urlInput:"Datasource HTTP settings url"},Jaeger:{traceIDInput:"Trace ID"},Prometheus:{configPage:{exemplarsAddButton:"Add exemplar config button",internalLinkSwitch:"Internal link switch"},exemplarMarker:"Exemplar marker"}},Menu:{MenuComponent:l=>`${l} menu`,MenuGroup:l=>`${l} menu group`,MenuItem:l=>`${l} menu item`,SubMenu:{container:"SubMenu container",icon:"SubMenu icon"}},Panels:{Panel:{title:l=>`data-testid Panel header ${l}`,headerItems:l=>`Panel header item ${l}`,menuItems:l=>`data-testid Panel menu item ${l}`,menu:l=>`data-testid Panel menu ${l}`,containerByTitle:l=>`${l} panel`,headerCornerInfo:l=>`Panel header ${l}`},Visualization:{Graph:{container:"Graph container",VisualizationTab:{legendSection:"Legend section"},Legend:{legendItemAlias:l=>`gpl alias ${l}`,showLegendSwitch:"gpl show legend"},xAxis:{labels:()=>"div.flot-x-axis > div.flot-tick-label"}},BarGauge:{value:"Bar gauge value",valueV2:"data-testid Bar gauge value"},PieChart:{svgSlice:"Pie Chart Slice"},Text:{container:()=>".markdown-html"},Table:{header:"table header",footer:"table-footer"}}},VizLegend:{seriesName:l=>`VizLegend series ${l}`},Drawer:{General:{title:l=>`Drawer title ${l}`,expand:"Drawer expand",contract:"Drawer contract",close:"Drawer close",rcContentWrapper:()=>".rc-drawer-content-wrapper"}},PanelEditor:{General:{content:"Panel editor content"},OptionsPane:{content:"Panel editor option pane content",select:"Panel editor option pane select",fieldLabel:l=>`${l} field property editor`},DataPane:{content:"Panel editor data pane content"},applyButton:"data-testid Apply changes and go back to dashboard",toggleVizPicker:"toggle-viz-picker",toggleVizOptions:"toggle-viz-options",toggleTableView:"toggle-table-view",measureButton:"show measure tools"},PanelInspector:{Data:{content:"Panel inspector Data content"},Stats:{content:"Panel inspector Stats content"},Json:{content:"Panel inspector Json content"},Query:{content:"Panel inspector Query content",refreshButton:"Panel inspector Query refresh button",jsonObjectKeys:()=>".json-formatter-key"}},Tab:{title:l=>`Tab ${l}`,active:()=>'[class*="-activeTabStyle"]'},RefreshPicker:{runButton:"RefreshPicker run button",intervalButton:"RefreshPicker interval button",runButtonV2:"data-testid RefreshPicker run button",intervalButtonV2:"data-testid RefreshPicker interval button"},QueryTab:{content:"Query editor tab content",queryInspectorButton:"Query inspector button",queryHistoryButton:"Rich history button",addQuery:"Query editor add query button"},QueryHistory:{queryText:"Query text"},QueryEditorRows:{rows:"Query editor row"},QueryEditorRow:{actionButton:l=>`${l} query operation action`,title:l=>`Query editor row title ${l}`,container:l=>`Query editor row ${l}`},AlertTab:{content:"Alert editor tab content"},Alert:{alert:l=>`Alert ${l}`,alertV2:l=>`data-testid Alert ${l}`},TransformTab:{content:"Transform editor tab content",newTransform:l=>`New transform ${l}`,transformationEditor:l=>`Transformation editor ${l}`,transformationEditorDebugger:l=>`Transformation editor debugger ${l}`},Transforms:{card:l=>`New transform ${l}`,Reduce:{modeLabel:"Transform mode label",calculationsLabel:"Transform calculations label"},SpatialOperations:{actionLabel:"root Action field property editor",locationLabel:"root Location field property editor",location:{autoOption:"Auto location option",coords:{option:"Coords location option",latitudeFieldLabel:"root Latitude field field property editor",longitudeFieldLabel:"root Longitude field field property editor"},geohash:{option:"Geohash location option",geohashFieldLabel:"root Geohash field field property editor"},lookup:{option:"Lookup location option",lookupFieldLabel:"root Lookup field field property editor",gazetteerFieldLabel:"root Gazetteer field property editor"}}},searchInput:"search transformations"},NavBar:{Configuration:{button:"Configuration"},Toggle:{button:"Toggle menu"},Reporting:{button:"Reporting"}},NavMenu:{item:"data-testid Nav menu item"},NavToolbar:{container:"data-testid Nav toolbar"},PageToolbar:{container:()=>".page-toolbar",item:l=>`${l}`,itemButton:l=>`data-testid ${l}`},QueryEditorToolbarItem:{button:l=>`QueryEditor toolbar item button ${l}`},BackButton:{backArrow:"Go Back"},OptionsGroup:{group:l=>l?`Options group ${l}`:"Options group",toggle:l=>l?`Options group ${l} toggle`:"Options group toggle"},PluginVisualization:{item:l=>`Plugin visualization item ${l}`,current:()=>'[class*="-currentVisualizationItem"]'},Select:{option:"Select option",input:()=>'input[id*="time-options-input"]',singleValue:()=>'div[class*="-singleValue"]'},FieldConfigEditor:{content:"Field config editor content"},OverridesConfigEditor:{content:"Field overrides editor content"},FolderPicker:{container:"Folder picker select container",containerV2:"data-testid Folder picker select container",input:"Select a folder"},ReadonlyFolderPicker:{container:"data-testid Readonly folder picker select container"},DataSourcePicker:{container:"Data source picker select container",input:()=>'input[id="data-source-picker"]',inputV2:"Select a data source"},TimeZonePicker:{container:"Time zone picker select container",containerV2:"data-testid Time zone picker select container"},WeekStartPicker:{container:"Choose starting day of the week",containerV2:"data-testid Choose starting day of the week",placeholder:"Choose starting day of the week"},TraceViewer:{spanBar:"data-testid SpanBar--wrapper"},QueryField:{container:"Query field"},QueryBuilder:{queryPatterns:"Query patterns",labelSelect:"Select label",valueSelect:"Select value",matchOperatorSelect:"Select match operator"},ValuePicker:{button:l=>`Value picker button ${l}`,select:l=>`Value picker select ${l}`},Search:{section:"Search section",sectionV2:"data-testid Search section",items:"Search items",itemsV2:"data-testid Search items",cards:"data-testid Search cards",collapseFolder:l=>`data-testid Collapse folder ${l}`,expandFolder:l=>`data-testid Expand folder ${l}`,dashboardItem:l=>`${t.Search.dashboardItems} ${l}`,dashboardCard:l=>`data-testid Search card ${l}`,folderHeader:l=>`data-testid Folder header ${l}`,folderContent:l=>`data-testid Folder content ${l}`,dashboardItems:"data-testid Dashboard search item"},DashboardLinks:{container:"data-testid Dashboard link container",dropDown:"data-testid Dashboard link dropdown",link:"data-testid Dashboard link"},LoadingIndicator:{icon:"Loading indicator"},CallToActionCard:{button:l=>`Call to action button ${l}`,buttonV2:l=>`data-testid Call to action button ${l}`},DataLinksContextMenu:{singleLink:"Data link"},CodeEditor:{container:"Code editor container"},DashboardImportPage:{textarea:"data-testid-import-dashboard-textarea",submit:"data-testid-load-dashboard"},ImportDashboardForm:{name:"data-testid-import-dashboard-title",submit:"data-testid-import-dashboard-submit"},PanelAlertTabContent:{content:"Unified alert editor tab content"},VisualizationPreview:{card:l=>`data-testid suggestion-${l}`},ColorSwatch:{name:"data-testid-colorswatch"},DashboardRow:{title:l=>`data-testid dashboard-row-title-${l}`},UserProfile:{profileSaveButton:"data-testid-user-profile-save",preferencesSaveButton:"data-testid-shared-prefs-save",orgsTable:"data-testid-user-orgs-table",sessionsTable:"data-testid-user-sessions-table"},FileUpload:{inputField:"data-testid-file-upload-input-field",fileNameSpan:"data-testid-file-upload-file-name"},DebugOverlay:{wrapper:"debug-overlay"},OrgRolePicker:{input:"Role"},AnalyticsToolbarButton:{button:"Dashboard insights"},Variables:{variableOption:"data-testid variable-option"}},a={pages:{Login:{url:"/login",username:"Username input field",password:"Password input field",submit:"Login button",skip:"Skip change password button"},Home:{url:"/"},DataSource:{name:"Data source settings page name input field",delete:"Data source settings page Delete button",readOnly:"Data source settings page read only message",saveAndTest:"Data source settings page Save and Test button",alert:"Data source settings page Alert"},DataSources:{url:"/datasources",dataSources:l=>`Data source list item ${l}`},EditDataSource:{url:l=>`/datasources/edit/${l}`,settings:"Datasource settings page basic settings"},AddDataSource:{url:"/datasources/new",dataSourcePlugins:l=>`Data source plugin item ${l}`,dataSourcePluginsV2:l=>`Add new data source ${l}`},ConfirmModal:{delete:"Confirm Modal Danger Button"},AddDashboard:{url:"/dashboard/new",itemButton:l=>`data-testid ${l}`,addNewPanel:"Add new panel",addNewRow:"Add new row",addNewPanelLibrary:"Add new panel from panel library"},Dashboard:{url:l=>`/d/${l}`,DashNav:{nav:"Dashboard navigation",navV2:"data-testid Dashboard navigation",publicDashboardTag:"data-testid public dashboard tag"},SubMenu:{submenu:"Dashboard submenu",submenuItem:"data-testid template variable",submenuItemLabels:l=>`data-testid Dashboard template variables submenu Label ${l}`,submenuItemValueDropDownValueLinkTexts:l=>`data-testid Dashboard template variables Variable Value DropDown value link text ${l}`,submenuItemValueDropDownDropDown:"Variable options",submenuItemValueDropDownOptionTexts:l=>`data-testid Dashboard template variables Variable Value DropDown option text ${l}`},Settings:{Actions:{close:"data-testid dashboard-settings-close"},General:{deleteDashBoard:"Dashboard settings page delete dashboard button",sectionItems:l=>`Dashboard settings section item ${l}`,saveDashBoard:"Dashboard settings aside actions Save button",saveAsDashBoard:"Dashboard settings aside actions Save As button",timezone:"Time zone picker select container",title:"Tab General"},Annotations:{List:{addAnnotationCTA:t.CallToActionCard.button("Add annotation query"),addAnnotationCTAV2:t.CallToActionCard.buttonV2("Add annotation query")},Settings:{name:"Annotations settings name input"}},Variables:{List:{addVariableCTA:t.CallToActionCard.button("Add variable"),addVariableCTAV2:t.CallToActionCard.buttonV2("Add variable"),newButton:"Variable editor New variable button",table:"Variable editor Table",tableRowNameFields:l=>`Variable editor Table Name field ${l}`,tableRowDefinitionFields:l=>`Variable editor Table Definition field ${l}`,tableRowArrowUpButtons:l=>`Variable editor Table ArrowUp button ${l}`,tableRowArrowDownButtons:l=>`Variable editor Table ArrowDown button ${l}`,tableRowDuplicateButtons:l=>`Variable editor Table Duplicate button ${l}`,tableRowRemoveButtons:l=>`Variable editor Table Remove button ${l}`},Edit:{General:{headerLink:"Variable editor Header link",modeLabelNew:"Variable editor Header mode New",modeLabelEdit:"Variable editor Header mode Edit",generalNameInput:"Variable editor Form Name field",generalNameInputV2:"data-testid Variable editor Form Name field",generalTypeSelect:"Variable editor Form Type select",generalTypeSelectV2:"data-testid Variable editor Form Type select",generalLabelInput:"Variable editor Form Label field",generalLabelInputV2:"data-testid Variable editor Form Label field",generalHideSelect:"Variable editor Form Hide select",generalHideSelectV2:"data-testid Variable editor Form Hide select",selectionOptionsMultiSwitch:"Variable editor Form Multi switch",selectionOptionsIncludeAllSwitch:"Variable editor Form IncludeAll switch",selectionOptionsCustomAllInput:"Variable editor Form IncludeAll field",selectionOptionsCustomAllInputV2:"data-testid Variable editor Form IncludeAll field",previewOfValuesOption:"Variable editor Preview of Values option",submitButton:"Variable editor Submit button",applyButton:"data-testid Variable editor Apply button"},QueryVariable:{queryOptionsDataSourceSelect:t.DataSourcePicker.container,queryOptionsRefreshSelect:"Variable editor Form Query Refresh select",queryOptionsRefreshSelectV2:"data-testid Variable editor Form Query Refresh select",queryOptionsRegExInput:"Variable editor Form Query RegEx field",queryOptionsRegExInputV2:"data-testid Variable editor Form Query RegEx field",queryOptionsSortSelect:"Variable editor Form Query Sort select",queryOptionsSortSelectV2:"data-testid Variable editor Form Query Sort select",queryOptionsQueryInput:"Variable editor Form Default Variable Query Editor textarea",valueGroupsTagsEnabledSwitch:"Variable editor Form Query UseTags switch",valueGroupsTagsTagsQueryInput:"Variable editor Form Query TagsQuery field",valueGroupsTagsTagsValuesQueryInput:"Variable editor Form Query TagsValuesQuery field"},ConstantVariable:{constantOptionsQueryInput:"Variable editor Form Constant Query field",constantOptionsQueryInputV2:"data-testid Variable editor Form Constant Query field"},DatasourceVariable:{datasourceSelect:"data-testid datasource variable datasource type"},TextBoxVariable:{textBoxOptionsQueryInput:"Variable editor Form TextBox Query field",textBoxOptionsQueryInputV2:"data-testid Variable editor Form TextBox Query field"},CustomVariable:{customValueInput:"data-testid custom-variable-input"},IntervalVariable:{intervalsValueInput:"data-testid interval variable intervals input"}}}}},Dashboards:{url:"/dashboards",dashboards:l=>`Dashboard search item ${l}`},SaveDashboardAsModal:{newName:"Save dashboard title field",save:"Save dashboard button"},SaveDashboardModal:{save:"Dashboard settings Save Dashboard Modal Save button",saveVariables:"Dashboard settings Save Dashboard Modal Save variables checkbox",saveTimerange:"Dashboard settings Save Dashboard Modal Save timerange checkbox"},SharePanelModal:{linkToRenderedImage:"Link to rendered image"},ShareDashboardModal:{shareButton:"Share dashboard or panel",PublicDashboard:{Tab:"Tab Public dashboard",WillBePublicCheckbox:"data-testid public dashboard will be public checkbox",LimitedDSCheckbox:"data-testid public dashboard limited datasources checkbox",CostIncreaseCheckbox:"data-testid public dashboard cost may increase checkbox",PauseSwitch:"data-testid public dashboard pause switch",EnableAnnotationsSwitch:"data-testid public dashboard on off switch for annotations",CreateButton:"data-testid public dashboard create button",DeleteButton:"data-testid public dashboard delete button",CopyUrlInput:"data-testid public dashboard copy url input",CopyUrlButton:"data-testid public dashboard copy url button",TemplateVariablesWarningAlert:"data-testid public dashboard disabled template variables alert",UnsupportedDataSourcesWarningAlert:"data-testid public dashboard unsupported data sources alert",NoUpsertPermissionsWarningAlert:"data-testid public dashboard no upsert permissions alert",EnableTimeRangeSwitch:"data-testid public dashboard on off switch for time range",EmailSharingConfiguration:{Container:"data-testid email sharing config container",ShareType:"data-testid public dashboard share type",EmailSharingInput:"data-testid public dashboard email sharing input",EmailSharingInviteButton:"data-testid public dashboard email sharing invite button",EmailSharingList:"data-testid public dashboard email sharing list",DeleteEmail:"data-testid public dashboard delete email button",ReshareLink:"data-testid public dashboard reshare link button"}}},PublicDashboard:{page:"public-dashboard-page",NotAvailable:{container:"public-dashboard-not-available",title:"public-dashboard-title",pausedDescription:"public-dashboard-paused-description"}},RequestViewAccess:{form:"request-view-access-form",recipientInput:"request-view-access-recipient-input",submitButton:"request-view-access-submit-button"},Explore:{url:"/explore",General:{container:"data-testid Explore",graph:"Explore Graph",table:"Explore Table",scrollView:"data-testid explorer scroll view"}},SoloPanel:{url:l=>`/d-solo/${l}`},PluginsList:{page:"Plugins list page",list:"Plugins list",listItem:"Plugins list item",signatureErrorNotice:"Unsigned plugins notice"},PluginPage:{page:"Plugin page",signatureInfo:"Plugin signature info",disabledInfo:"Plugin disabled info"},PlaylistForm:{name:"Playlist name",interval:"Playlist interval",itemDelete:"Delete playlist item"},Search:{url:"/?search=openn",FolderView:{url:"/?search=open&layout=folders"}},PublicDashboards:{ListItem:{linkButton:"public-dashboard-link-button",configButton:"public-dashboard-configuration-button",trashcanButton:"public-dashboard-remove-button"}},UserListPage:{org:{url:"/org/users"},admin:{url:"/admin/users"}}},components:t}},"../grafana-schema/src/common/common.gen.ts":function(se,V,e){"use strict";e.d(V,{Bd:function(){return W},FI:function(){return w},Jp:function(){return i},KC:function(){return O},LB:function(){return x},M8:function(){return j},QH:function(){return T},Ss:function(){return R},b8:function(){return U},bQ:function(){return g},h2:function(){return K},i3:function(){return y},iT:function(){return Q},jK:function(){return h},l8:function(){return c},o0:function(){return _},pR:function(){return E},pu:function(){return C},v7:function(){return F},wN:function(){return b},wf:function(){return m}});var t=(P=>(P.Field="field",P.Fixed="fixed",P.Template="template",P))(t||{}),n=(P=>(P.Auto="auto",P.Coords="coords",P.Geohash="geohash",P.Lookup="lookup",P))(n||{}),a=(P=>(P.Count="count",P.Size="size",P))(a||{}),l=(P=>(P.auto="auto",P.ge="ge",P.le="le",P.unknown="unknown",P))(l||{}),f=(P=>(P.Ascending="Ascending",P.Descending="Descending",P))(f||{}),x=(P=>(P.Auto="auto",P.Bottom="bottom",P.Hidden="hidden",P.Left="left",P.Right="right",P.Top="top",P))(x||{}),d=(P=>(P.Series="series",P.Text="text",P))(d||{}),i=(P=>(P.Always="always",P.Auto="auto",P.Never="never",P))(i||{}),c=(P=>(P.Bars="bars",P.Line="line",P.Points="points",P))(c||{}),E=(P=>(P.Constant="constant",P.NegativeY="negative-Y",P))(E||{}),O=(P=>(P.Linear="linear",P.Smooth="smooth",P.StepAfter="stepAfter",P.StepBefore="stepBefore",P))(O||{}),m=(P=>(P.Linear="linear",P.Log="log",P.Ordinal="ordinal",P.Symlog="symlog",P))(m||{}),w=(P=>(P.Hue="hue",P.None="none",P.Opacity="opacity",P.Scheme="scheme",P))(w||{}),_=(P=>(P.None="none",P.Normal="normal",P.Percent="percent",P))(_||{}),C=(P=>(P[P.After=1]="After",P[P.Before=-1]="Before",P[P.Center=0]="Center",P))(C||{}),b=(P=>(P[P.Horizontal=0]="Horizontal",P[P.Vertical=1]="Vertical",P))(b||{}),g=(P=>(P[P.Down=-1]="Down",P[P.Left=-1]="Left",P[P.Right=1]="Right",P[P.Up=1]="Up",P))(g||{});const v={dash:[]};var y=(P=>(P.Area="area",P.Dashed="dashed",P.DashedAndArea="dashed+area",P.Line="line",P.LineAndArea="line+area",P.Off="off",P.Series="series",P))(y||{}),h=(P=>(P.Hidden="hidden",P.List="list",P.Table="table",P))(h||{});const s={calcs:[]};var o=(P=>(P.Auto="auto",P.Horizontal="horizontal",P.Vertical="vertical",P))(o||{});const r={timezone:[]};var u=(P=>(P.Background="background",P.BackgroundSolid="background_solid",P.None="none",P.Value="value",P))(u||{}),p=(P=>(P.Area="area",P.Line="line",P.None="none",P))(p||{}),S=(P=>(P.Auto="auto",P.Center="center",P))(S||{}),k=(P=>(P.Auto="auto",P.Name="name",P.None="none",P.Value="value",P.ValueAndName="value_and_name",P))(k||{}),D=(P=>(P.Multi="multi",P.None="none",P.Single="single",P))(D||{}),M=(P=>(P.Ascending="asc",P.Descending="desc",P.None="none",P))(M||{});const I={calcs:[]};var T=(P=>(P.Basic="basic",P.Gradient="gradient",P.Lcd="lcd",P))(T||{}),j=(P=>(P.Color="color",P.Hidden="hidden",P.Text="text",P))(j||{}),K=(P=>(P.Auto="auto",P.BasicGauge="basic",P.ColorBackground="color-background",P.ColorBackgroundSolid="color-background-solid",P.ColorText="color-text",P.Gauge="gauge",P.GradientGauge="gradient-gauge",P.Image="image",P.JSONView="json-view",P.LcdGauge="lcd-gauge",P.Sparkline="sparkline",P))(K||{}),F=(P=>(P.Basic="basic",P.Gradient="gradient",P))(F||{});const $={fields:[],reducer:[]};var R=(P=>(P.Lg="lg",P.Md="md",P.Sm="sm",P))(R||{}),U=(P=>(P.CSV="csv",P.Date="date",P.Distributed="distributed",P.DoubleQuote="doublequote",P.Glob="glob",P.HTML="html",P.JSON="json",P.Lucene="lucene",P.PercentEncode="percentencode",P.Pipe="pipe",P.QueryParam="queryparam",P.Raw="raw",P.Regex="regex",P.SQLString="sqlstring",P.SingleQuote="singlequote",P.Text="text",P.UriEncode="uriencode",P))(U||{}),H=(P=>(P.exact="exact",P.none="none",P.numbers="numbers",P.signature="signature",P))(H||{}),W=(P=>(P.EQ="eq",P.GT="gt",P.GTE="gte",P.LT="lt",P.LTE="lte",P.NEQ="neq",P))(W||{});const oe={align:"auto",inspect:!1},Q="browser"},"./.storybook/preview.ts-generated-config-entry.js":function(se,V,e){"use strict";var t={};e.r(t),e.d(t,{decorators:function(){return Le},parameters:function(){return we}});var n=e("../../.yarn/__virtual__/@storybook-client-api-virtual-8f671b14a3/2/yarn/cache/@storybook-client-api-npm-6.5.16-4fc55c1f19-a62276fa67.zip/node_modules/@storybook/client-api/dist/esm/ClientApi.js"),a=e("../../../yarn/cache/jquery-npm-3.6.3-cbc34d2330-0fd366bdca.zip/node_modules/jquery/dist/jquery-exposed.js"),l=e("../../public/vendor/flot/jquery.flot.js"),f=e("../../public/vendor/flot/jquery.flot.selection.js"),x=e("../../public/vendor/flot/jquery.flot.time.js"),d=e("../../public/vendor/flot/jquery.flot.stack.js"),i=e("../../public/vendor/flot/jquery.flot.stackpercent.js"),c=e("../../public/vendor/flot/jquery.flot.fillbelow.js"),E=e("../../public/vendor/flot/jquery.flot.crosshair.js"),O=e("../../public/vendor/flot/jquery.flot.dashes.js"),m=e("../../public/vendor/flot/jquery.flot.gauge.js"),w=e("./src/utils/storybook/withTheme.tsx"),_=e("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/dist/esm/index.js"),C=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),b=e("../../.yarn/__virtual__/storybook-dark-mode-virtual-139efd38dc/2/yarn/cache/storybook-dark-mode-npm-2.1.1-be263896e0-44d6313013.zip/node_modules/storybook-dark-mode/dist/esm/index.js"),g=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/createTheme.ts"),v=e("../../.yarn/__virtual__/@storybook-theming-virtual-17463818ea/2/yarn/cache/@storybook-theming-npm-6.5.16-3cd34b3614-349affa5c5.zip/node_modules/@storybook/theming/dist/esm/index.js");const y=Je=>(0,v.Ue)({base:Je.colors.mode,colorPrimary:Je.colors.primary.main,colorSecondary:Je.colors.error.main,appBg:Je.colors.background.canvas,appContentBg:Je.colors.background.primary,appBorderColor:Je.colors.border.medium,appBorderRadius:parseInt(Je.shape.borderRadius(1),10),fontBase:Je.typography.fontFamily,fontCode:Je.typography.fontFamilyMonospace,textColor:Je.colors.text.primary,textInverseColor:Je.colors.background.primary,barTextColor:Je.colors.text.primary,barSelectedColor:Je.colors.emphasize(Je.colors.primary.text),barBg:Je.colors.background.primary,inputBg:Je.components.input.background,inputBorder:Je.components.input.borderColor,inputTextColor:Je.components.input.text,inputBorderRadius:parseInt(Je.shape.borderRadius(1),10),brandTitle:"Grafana UI",brandUrl:"./",brandImage:`public/img/grafana_text_logo-${Je.colors.mode}.svg`}),h=y((0,g.j)({colors:{mode:"light"}})),s=y((0,g.j)({colors:{mode:"dark"}}));var o=Object.defineProperty,r=Object.defineProperties,u=Object.getOwnPropertyDescriptors,p=Object.getOwnPropertySymbols,S=Object.prototype.hasOwnProperty,k=Object.prototype.propertyIsEnumerable,D=(Je,Ze,Oe)=>Ze in Je?o(Je,Ze,{enumerable:!0,configurable:!0,writable:!0,value:Oe}):Je[Ze]=Oe,M=(Je,Ze)=>{for(var Oe in Ze||(Ze={}))S.call(Ze,Oe)&&D(Je,Oe,Ze[Oe]);if(p)for(var Oe of p(Ze))k.call(Ze,Oe)&&D(Je,Oe,Ze[Oe]);return Je},I=(Je,Ze)=>r(Je,u(Ze));const T=({children:Je,context:Ze})=>{const Oe=(0,b.vs)();return C.createElement(_.Zu,{context:I(M({},Ze),{storyById:ce=>{const pe=Ze.storyById(ce);return I(M({},pe),{parameters:I(M({},pe==null?void 0:pe.parameters),{docs:I(M({},pe==null?void 0:pe.parameters.docs),{theme:Oe?s:h})})})}})},Je)};try{T.displayName="ThemedDocsContainer",T.__docgenInfo={description:"",displayName:"ThemedDocsContainer",props:{context:{defaultValue:null,description:"",name:"context",required:!0,type:{name:"DocsContextProps<AnyFramework>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/utils/storybook/ThemedDocsContainer.tsx#ThemedDocsContainer"]={docgenInfo:T.__docgenInfo,name:"ThemedDocsContainer",path:"src/utils/storybook/ThemedDocsContainer.tsx#ThemedDocsContainer"})}catch(Je){}var j=e("../../.yarn/__virtual__/style-loader-virtual-dc03497ba6/2/yarn/cache/style-loader-npm-3.3.1-4bbb6ec77f-470feef680.zip/node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js"),K=e.n(j),F=e("../../.yarn/__virtual__/style-loader-virtual-dc03497ba6/2/yarn/cache/style-loader-npm-3.3.1-4bbb6ec77f-470feef680.zip/node_modules/style-loader/dist/runtime/styleDomAPI.js"),$=e.n(F),R=e("../../.yarn/__virtual__/style-loader-virtual-dc03497ba6/2/yarn/cache/style-loader-npm-3.3.1-4bbb6ec77f-470feef680.zip/node_modules/style-loader/dist/runtime/insertBySelector.js"),U=e.n(R),H=e("../../.yarn/__virtual__/style-loader-virtual-dc03497ba6/2/yarn/cache/style-loader-npm-3.3.1-4bbb6ec77f-470feef680.zip/node_modules/style-loader/dist/runtime/setAttributesWithoutAttributes.js"),W=e.n(H),oe=e("../../.yarn/__virtual__/style-loader-virtual-dc03497ba6/2/yarn/cache/style-loader-npm-3.3.1-4bbb6ec77f-470feef680.zip/node_modules/style-loader/dist/runtime/insertStyleElement.js"),Q=e.n(oe),P=e("../../.yarn/__virtual__/style-loader-virtual-dc03497ba6/2/yarn/cache/style-loader-npm-3.3.1-4bbb6ec77f-470feef680.zip/node_modules/style-loader/dist/runtime/styleTagTransform.js"),ae=e.n(P),q=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!./.storybook/grafana.light.scss"),Y={};q.Z&&q.Z.locals&&(Y.locals=q.Z.locals);var ve=0,re,je={};je.styleTagTransform=ae(),je.setAttributes=W(),je.insert=U().bind(null,"head"),je.domAPI=$(),je.insertStyleElement=Q(),Y.use=function(Je){return je.options=Je||{},ve++||(re=K()(q.Z,je)),Y},Y.unuse=function(){ve>0&&!--ve&&(re(),re=null)};var me=Y,ne=e("../../.yarn/__virtual__/css-loader-virtual-fca4cfc5d8/2/yarn/cache/css-loader-npm-6.7.3-63aa933400-473cc32b6c.zip/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[7].use[1]!../../.yarn/__virtual__/sass-loader-virtual-4737e22250/2/yarn/cache/sass-loader-npm-13.2.0-6421c5ff7b-ed6cdb5f55.zip/node_modules/sass-loader/dist/cjs.js!./.storybook/grafana.dark.scss"),Z={};ne.Z&&ne.Z.locals&&(Z.locals=ne.Z.locals);var te=0,Pe,he={};he.styleTagTransform=ae(),he.setAttributes=W(),he.insert=U().bind(null,"head"),he.domAPI=$(),he.insertStyleElement=Q(),Z.use=function(Je){return he.options=Je||{},te++||(Pe=K()(ne.Z,he)),Z},Z.unuse=function(){te>0&&!--te&&(Pe(),Pe=null)};var ie=Z;const Ce=Je=>{Je!=="light"?(me.unuse(),ie.use()):(ie.unuse(),me.use())},Le=[(0,w.Z)(Ce)],we={actions:{argTypesRegex:"^on[A-Z].*"},darkMode:{dark:s,light:h},docs:{container:T},knobs:{disable:!0},layout:"fullscreen",options:{showPanel:!0,panelPosition:"right",showNav:!0,isFullscreen:!1,isToolshown:!0,storySort:{method:"alphabetical",order:["Docs Overview",["Intro"]]}}};function ue(Je,Ze){var Oe=Object.keys(Je);if(Object.getOwnPropertySymbols){var ce=Object.getOwnPropertySymbols(Je);Ze&&(ce=ce.filter(function(pe){return Object.getOwnPropertyDescriptor(Je,pe).enumerable})),Oe.push.apply(Oe,ce)}return Oe}function Ie(Je){for(var Ze=1;Ze<arguments.length;Ze++){var Oe=arguments[Ze]!=null?arguments[Ze]:{};Ze%2?ue(Object(Oe),!0).forEach(function(ce){qe(Je,ce,Oe[ce])}):Object.getOwnPropertyDescriptors?Object.defineProperties(Je,Object.getOwnPropertyDescriptors(Oe)):ue(Object(Oe)).forEach(function(ce){Object.defineProperty(Je,ce,Object.getOwnPropertyDescriptor(Oe,ce))})}return Je}function qe(Je,Ze,Oe){return Ze in Je?Object.defineProperty(Je,Ze,{value:Oe,enumerable:!0,configurable:!0,writable:!0}):Je[Ze]=Oe,Je}Object.keys(t).forEach(function(Je){var Ze=t[Je];switch(Je){case"args":return(0,n.uc)(Ze);case"argTypes":return(0,n.v9)(Ze);case"decorators":return Ze.forEach(function(ce){return(0,n.$9)(ce,!1)});case"loaders":return Ze.forEach(function(ce){return(0,n.HZ)(ce,!1)});case"parameters":return(0,n.h1)(Ie({},Ze),!1);case"argTypesEnhancers":return Ze.forEach(function(ce){return(0,n.My)(ce)});case"argsEnhancers":return Ze.forEach(function(ce){return(0,n._C)(ce)});case"render":return(0,n.$P)(Ze);case"globals":case"globalTypes":{var Oe={};return Oe[Je]=Ze,(0,n.h1)(Oe,!1)}case"__namedExportsOrder":case"decorateStory":case"renderToDOM":return null;default:return console.log(Je+" was not supported :( !")}})},"./src/components/Alert/Alert.tsx":function(se,V,e){"use strict";e.d(V,{b:function(){return C}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../grafana-e2e-selectors/src/selectors/index.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/components/Button/Button.tsx"),x=e("./src/components/Icon/Icon.tsx"),d=e("./src/components/IconButton/IconButton.tsx"),i=Object.defineProperty,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(v,y,h)=>y in v?i(v,y,{enumerable:!0,configurable:!0,writable:!0,value:h}):v[y]=h,w=(v,y)=>{for(var h in y||(y={}))E.call(y,h)&&m(v,h,y[h]);if(c)for(var h of c(y))O.call(y,h)&&m(v,h,y[h]);return v},_=(v,y)=>{var h={};for(var s in v)E.call(v,s)&&y.indexOf(s)<0&&(h[s]=v[s]);if(v!=null&&c)for(var s of c(v))y.indexOf(s)<0&&O.call(v,s)&&(h[s]=v[s]);return h};const C=n.forwardRef((v,y)=>{var h=v,{title:s,onRemove:o,children:r,buttonContent:u,elevated:p,bottomSpacing:S,topSpacing:k,className:D,severity:M="error"}=h,I=_(h,["title","onRemove","children","buttonContent","elevated","bottomSpacing","topSpacing","className","severity"]);const T=(0,l.l4)(),j=Boolean(s),K=g(T,M,j,p,S,k),F={error:"alert",warning:"alert",info:"status",success:"status"},$=I.role||F[M],R=I["aria-label"]||s;return n.createElement("div",w({ref:y,className:(0,t.cx)(K.alert,D),"data-testid":a.wl.components.Alert.alertV2(M),role:$,"aria-label":R},I),n.createElement("div",{className:K.icon},n.createElement(x.J,{size:"xl",name:b(M)})),n.createElement("div",{className:K.body},n.createElement("div",{className:K.title},s),r&&n.createElement("div",{className:K.content},r)),o&&!u&&n.createElement("div",{className:K.close},n.createElement(d.h,{"aria-label":"Close alert",name:"times",onClick:o,size:"lg",type:"button"})),o&&u&&n.createElement("div",{className:K.buttonWrapper},n.createElement(f.zx,{"aria-label":"Close alert",variant:"secondary",onClick:o,type:"button"},u)))});C.displayName="Alert";const b=v=>{switch(v){case"error":case"warning":return"exclamation-triangle";case"info":return"info-circle";case"success":return"check"}},g=(v,y,h,s,o,r)=>{const u=v.colors[y],p=v.shape.borderRadius();return{alert:t.iv`
      flex-grow: 1;
      position: relative;
      border-radius: ${p};
      display: flex;
      flex-direction: row;
      align-items: stretch;
      background: ${v.colors.background.secondary};
      box-shadow: ${s?v.shadows.z3:v.shadows.z1};
      margin-bottom: ${v.spacing(o!=null?o:2)};
      margin-top: ${v.spacing(r!=null?r:0)};

      &:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: ${v.colors.background.primary};
        z-index: -1;
      }
    `,icon:t.iv`
      padding: ${v.spacing(2,3)};
      background: ${u.main};
      border-radius: ${p} 0 0 ${p};
      color: ${u.contrastText};
      display: flex;
      align-items: center;
      justify-content: center;
    `,title:t.iv`
      font-weight: ${v.typography.fontWeightMedium};
      color: ${v.colors.text.primary};
    `,body:t.iv`
      color: ${v.colors.text.secondary};
      padding: ${v.spacing(2)};
      flex-grow: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      overflow-wrap: break-word;
      word-break: break-word;
    `,content:t.iv`
      color: ${v.colors.text.secondary};
      padding-top: ${h?v.spacing(1):0};
      max-height: 50vh;
      overflow-y: auto;
    `,buttonWrapper:t.iv`
      padding: ${v.spacing(1)};
      background: none;
      display: flex;
      align-items: center;
    `,close:t.iv`
      padding: ${v.spacing(2,1)};
      background: none;
      display: flex;
    `}};try{C.displayName="Alert",C.__docgenInfo={description:"",displayName:"Alert",props:{title:{defaultValue:null,description:"",name:"title",required:!0,type:{name:"string"}},onRemove:{defaultValue:null,description:"On click handler for alert button, mostly used for dismissing the alert",name:"onRemove",required:!1,type:{name:"((event: MouseEvent<Element, MouseEvent>) => void)"}},severity:{defaultValue:{value:"error"},description:"",name:"severity",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"warning"'},{value:'"error"'},{value:'"info"'}]}},elevated:{defaultValue:null,description:"",name:"elevated",required:!1,type:{name:"boolean"}},buttonContent:{defaultValue:null,description:"",name:"buttonContent",required:!1,type:{name:"ReactNode"}},bottomSpacing:{defaultValue:null,description:"",name:"bottomSpacing",required:!1,type:{name:"number"}},topSpacing:{defaultValue:null,description:"",name:"topSpacing",required:!1,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Alert/Alert.tsx#Alert"]={docgenInfo:C.__docgenInfo,name:"Alert",path:"src/components/Alert/Alert.tsx#Alert"})}catch(v){}},"./src/components/Badge/Badge.tsx":function(se,V,e){"use strict";e.d(V,{C:function(){return C}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/components/Icon/Icon.tsx"),x=e("./src/components/Layout/Layout.tsx"),d=e("./src/components/Tooltip/Tooltip.tsx"),i=Object.defineProperty,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(g,v,y)=>v in g?i(g,v,{enumerable:!0,configurable:!0,writable:!0,value:y}):g[v]=y,w=(g,v)=>{for(var y in v||(v={}))E.call(v,y)&&m(g,y,v[y]);if(c)for(var y of c(v))O.call(v,y)&&m(g,y,v[y]);return g},_=(g,v)=>{var y={};for(var h in g)E.call(g,h)&&v.indexOf(h)<0&&(y[h]=g[h]);if(g!=null&&c)for(var h of c(g))v.indexOf(h)<0&&O.call(g,h)&&(y[h]=g[h]);return y};const C=n.memo(g=>{var v=g,{icon:y,color:h,text:s,tooltip:o,className:r}=v,u=_(v,["icon","color","text","tooltip","className"]);const p=(0,l.wW)((0,n.useCallback)(k=>b(k,h),[h])),S=n.createElement("div",w({className:(0,t.cx)(p.wrapper,r)},u),n.createElement(x.Lh,{align:"center",spacing:"xs"},y&&n.createElement(f.J,{name:y,size:"sm"}),n.createElement("span",null,s)));return o?n.createElement(d.u,{content:o,placement:"auto"},S):S});C.displayName="Badge";const b=(g,v)=>{let y=g.visualization.getColorByName(v),h="",s="",o="";return g.isDark?(s=(0,a.Z)(y).setAlpha(.15).toString(),h=(0,a.Z)(y).darken(30).toString(),o=(0,a.Z)(y).lighten(15).toString()):(s=(0,a.Z)(y).setAlpha(.15).toString(),h=(0,a.Z)(y).lighten(20).toString(),o=(0,a.Z)(y).darken(20).toString()),{wrapper:t.iv`
      font-size: ${g.typography.size.sm};
      display: inline-flex;
      padding: 1px 4px;
      border-radius: ${g.shape.radius.default};
      background: ${s};
      border: 1px solid ${h};
      color: ${o};
      font-weight: ${g.typography.fontWeightRegular};

      > span {
        position: relative;
        top: 1px;
        margin-left: 2px;
      }
    `}};try{C.displayName="Badge",C.__docgenInfo={description:"",displayName:"Badge",props:{text:{defaultValue:null,description:"",name:"text",required:!0,type:{name:"ReactNode"}},color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"enum",value:[{value:'"blue"'},{value:'"red"'},{value:'"green"'},{value:'"orange"'},{value:'"purple"'}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},tooltip:{defaultValue:null,description:"",name:"tooltip",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Badge/Badge.tsx#Badge"]={docgenInfo:C.__docgenInfo,name:"Badge",path:"src/components/Badge/Badge.tsx#Badge"})}catch(g){}},"./src/components/BarGauge/BarGauge.tsx":function(se,V,e){"use strict";e.d(V,{xf:function(){return r}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js");const l=0,f=100,x="SAML";var d=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/panel.ts"),i=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/thresholds.ts"),c=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),E=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/fieldColor.ts"),O=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/fieldColor.ts"),m=e("../grafana-e2e-selectors/src/selectors/index.ts"),w=e("../grafana-schema/src/common/common.gen.ts"),_=e("./src/utils/measureText.ts"),C=e("./src/components/Button/Button.tsx"),b=e("./src/components/FormattedValueDisplay/FormattedValueDisplay.tsx");const g=18,v=50,y=150,h=1.5,s=1,o=10;class r extends n.PureComponent{render(){const{onClick:$,className:R,theme:U}=this.props,{title:H}=this.props.value,W=S(this.props);return $?n.createElement("button",{type:"button",style:W.wrapper,onClick:$,className:(0,t.cx)((0,C.gN)(U),R)},n.createElement("div",{style:W.title},H),this.renderBarAndValue()):n.createElement("div",{style:W.wrapper,className:R},H&&n.createElement("div",{style:W.title},H),this.renderBarAndValue())}renderBarAndValue(){switch(this.props.displayMode){case"lcd":return this.renderRetroBars();case"basic":case"gradient":default:return this.renderBasicAndGradientBars()}}renderBasicAndGradientBars(){const{value:$,showUnfilled:R,valueDisplayMode:U}=this.props,H=I(this.props);return n.createElement("div",{style:H.wrapper},U!==w.M8.Hidden&&n.createElement(b.W,{"data-testid":m.wl.components.Panels.Visualization.BarGauge.valueV2,value:$,style:H.value}),R&&n.createElement("div",{style:H.emptyBar}),n.createElement("div",{style:H.bar}))}renderRetroBars(){var $,R;const{display:U,field:H,value:W,itemSpacing:oe,alignmentFactors:Q,orientation:P,lcdCellWidth:ae,text:q,valueDisplayMode:Y,theme:ve}=this.props,{valueHeight:re,valueWidth:je,maxBarHeight:me,maxBarWidth:ne,wrapperWidth:Z,wrapperHeight:te}=k(this.props),Pe=($=H.min)!=null?$:l,he=(R=H.max)!=null?R:f,ie=u(P),Ce=he-Pe,Le=ie?me:ne,we=oe,ue=Math.floor(Le/ae),Ie=Math.floor((Le-we*ue)/ue),qe=j(this.props),Ze=K(Q||W,qe,je,re,P,q),Oe={width:`${Z}px`,height:`${te}px`,display:"flex"};ie?(Oe.flexDirection="column-reverse",Oe.alignItems="center"):(Oe.flexDirection="row",Oe.alignItems="center",Ze.justifyContent="flex-end");const ce=[];for(let pe=0;pe<ue;pe++){const J=Pe+Ce/ue*pe,L=D(J,W,U),fe={borderRadius:ve.shape.radius.default};L.isLit?fe.backgroundImage=`radial-gradient(${L.background} 10%, ${L.backgroundShade})`:fe.backgroundColor=L.background,ie?(fe.height=`${Ie}px`,fe.width=`${ne}px`,fe.marginTop=`${we}px`):(fe.width=`${Ie}px`,fe.height=`${me}px`,fe.marginRight=`${we}px`),ce.push(n.createElement("div",{key:pe.toString(),style:fe}))}return n.createElement("div",{style:Oe},ce,Y!==w.M8.Hidden&&n.createElement(b.W,{"data-testid":m.wl.components.Panels.Visualization.BarGauge.valueV2,value:W,style:Ze}))}}r.defaultProps={lcdCellWidth:12,value:{text:"100",numeric:100},displayMode:w.QH.Gradient,orientation:d.wm.Horizontal,field:{min:0,max:100,thresholds:{mode:i.H.Absolute,steps:[]}},itemSpacing:8,showUnfilled:!0};function u(F){return F===d.wm.Vertical}function p(F){var $,R;const{height:U,width:H,alignmentFactors:W,orientation:oe,text:Q}=F,P=W?W.title:F.value.title;if(!P)return{fontSize:0,width:0,height:0,placement:"above"};if(u(oe)){const je=($=Q==null?void 0:Q.titleSize)!=null?$:14;return{fontSize:je,width:H,height:je*h,placement:"below"}}if(U>40){if(Q!=null&&Q.titleSize)return{fontSize:Q==null?void 0:Q.titleSize,width:0,height:Q.titleSize*h,placement:"above"};const me=Math.max(Math.min(U*.45,v),17);return{fontSize:me/h,width:0,height:me,placement:"above"}}const Y=Math.max(U*.6,g)/h,ve=(0,_.X1)(P,Y),re=Math.min(ve.width+15,H*.4);return{fontSize:(R=Q==null?void 0:Q.titleSize)!=null?R:Y,height:0,width:re,placement:"left"}}function S(F){const $={display:"flex",overflow:"hidden",width:"100%"},R=p(F),U={fontSize:`${R.fontSize}px`,whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",width:"100%",alignItems:"center",alignSelf:"center"};return u(F.orientation)?($.flexDirection="column-reverse",U.textAlign="center"):R.placement==="above"?$.flexDirection="column":($.flexDirection="row",U.width=`${R.width}px`,U.textAlign="right",U.paddingRight="10px"),{wrapper:$,title:U}}function k(F){var $;const{height:R,width:U,orientation:H,text:W,alignmentFactors:oe,valueDisplayMode:Q}=F,P=p(F),ae=oe!=null?oe:F.value,q=(0,c.zc)(ae);let Y=0,ve=0,re=0,je=0,me=0,ne=0;const Z=($=W==null?void 0:W.valueSize)!=null?$:Math.max(P.fontSize,12),Pe=(0,_.X1)(q,Z).width+o*2;return u(H)?(W!=null&&W.valueSize?re=W.valueSize*s:re=Math.min(Math.max(R*.1,g),v),je=U,Q===w.M8.Hidden&&(re=0,je=0),Y=R-(P.height+re),ve=U,me=U,ne=R-P.height):(Q===w.M8.Hidden?(re=0,je=0):(re=R-P.height,je=Math.max(Math.min(U*.2,y),Pe)),Y=R-P.height,ve=U-je-P.width,P.placement==="above"?(me=U,ne=R-P.height):(me=U-P.width,ne=R)),{valueWidth:je,valueHeight:re,maxBarWidth:ve,maxBarHeight:Y,wrapperHeight:ne,wrapperWidth:me}}function D(F,$,R){if(F===null)return{background:E.R,border:E.R};const U=R?R(F).color:null;return U?$===null||isNaN($.numeric)||F!==null&&F>$.numeric?{background:(0,a.Z)(U).setAlpha(.18).toRgbString(),border:"transparent",isLit:!1}:{background:(0,a.Z)(U).setAlpha(.95).toRgbString(),backgroundShade:(0,a.Z)(U).setAlpha(.55).toRgbString(),border:(0,a.Z)(U).setAlpha(.9).toRgbString(),isLit:!0}:{background:E.R,border:E.R}}function M(F,$,R){const U=Math.min((F-$)/(R-$),1);return isNaN(U)?0:U}function I(F){var $,R,U;const{displayMode:H,field:W,value:oe,alignmentFactors:Q,orientation:P,theme:ae,text:q}=F,{valueWidth:Y,valueHeight:ve,maxBarHeight:re,maxBarWidth:je}=k(F),me=($=W.min)!=null?$:l,ne=(R=W.max)!=null?R:f,Z=M(oe.numeric,me,ne),te=j(F),Pe=(U=oe.color)!=null?U:E.R,ie=K(Q||oe,te,Y,ve,P,q),Ce=H==="basic",Le={display:"flex",flexGrow:1},we={borderRadius:ae.shape.radius.default,position:"relative",zIndex:1},ue={background:ae.colors.background.secondary,flexGrow:1,display:"flex",borderRadius:ae.shape.radius.default,position:"relative"};if(u(P)){const Ie=Math.max(Z*re,1);Le.flexDirection="column",Le.justifyContent="flex-end",we.transition="height 1s",we.height=`${Ie}px`,we.width=`${je}px`,ue.bottom="-3px",ue.width=`${Y}px`,Ce?(we.background=`${(0,a.Z)(Pe).setAlpha(.35).toRgbString()}`,we.borderTop=`2px solid ${Pe}`):we.background=T(F,re)}else{const Ie=Math.max(Z*je,1);Le.flexDirection="row-reverse",Le.justifyContent="flex-end",Le.alignItems="stretch",we.transition="width 1s",we.height=`${re}px`,we.width=`${Ie}px`,ue.left="-3px",ue.height=`${ve}px`,Ce?(we.background=`${(0,a.Z)(Pe).setAlpha(.35).toRgbString()}`,we.borderRight=`2px solid ${Pe}`):we.background=T(F,je)}return{wrapper:Le,bar:we,value:ie,emptyBar:ue}}function T(F,$){var R,U;const{field:H,value:W,orientation:oe,theme:Q}=F,P=u(oe)?"0deg":"90deg",ae=H.min,q=H.max;let Y="",ve=0,re=(0,O.QY)((R=H.color)==null?void 0:R.mode);if(re.id===E.S.Thresholds){const je=H.thresholds;for(let me=0;me<je.steps.length;me++){const ne=je.steps[me],Z=F.theme.visualization.getColorByName(ne.color),te=je.mode===i.H.Percentage?ne.value/100:M(ne.value,ae,q),Pe=te*$,he=Math.round(Pe-(Pe-ve)/2),ie=je.mode===i.H.Percentage?ae+(q-ae)*te:ne.value;if(Y==="")Y=`linear-gradient(${P}, ${Z}, ${Z}`;else{if(W.numeric<ie)break;ve=Pe,Y+=` ${he}px, ${Z}`}}return Y+")"}if(re.isContinuous&&re.getColors){const je=re.getColors(Q);for(let me=0;me<je.length;me++){const ne=je[me];if(Y==="")Y=`linear-gradient(${P}, ${ne} 0px`;else{const te=me/(je.length-1)*$;Y+=`, ${ne} ${te}px`}}return Y+")"}return(U=W.color)!=null?U:E.R}function j(F){if(F.valueDisplayMode==="text")return F.theme.colors.text.primary;const{value:$}=F;return $.color?$.color:E.R}function K(F,$,R,U,H,W){var oe,Q;const P={color:$,height:`${U}px`,width:`${R}px`,display:"flex",alignItems:"center",lineHeight:s};let ae=R;const q=(0,c.zc)(F);return u(H)?(P.fontSize=(oe=W==null?void 0:W.valueSize)!=null?oe:(0,_.MX)(q,ae,U,s),P.justifyContent="center"):(P.fontSize=(Q=W==null?void 0:W.valueSize)!=null?Q:(0,_.MX)(q,ae-o*2,U,s),P.justifyContent="flex-end",P.paddingLeft=`${o}px`,P.paddingRight=`${o}px`,ae-=o),P}try{S.displayName="getTitleStyles",S.__docgenInfo={description:"",displayName:"getTitleStyles",props:{height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"FieldConfig<any>"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"DisplayProcessor"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"DisplayValue"}},orientation:{defaultValue:null,description:"",name:"orientation",required:!0,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},itemSpacing:{defaultValue:null,description:"",name:"itemSpacing",required:!1,type:{name:"number"}},lcdCellWidth:{defaultValue:null,description:"",name:"lcdCellWidth",required:!1,type:{name:"number"}},displayMode:{defaultValue:null,description:"",name:"displayMode",required:!0,type:{name:"enum",value:[{value:'"basic"'},{value:'"gradient"'},{value:'"lcd"'}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},showUnfilled:{defaultValue:null,description:"",name:"showUnfilled",required:!1,type:{name:"boolean"}},alignmentFactors:{defaultValue:null,description:"",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},valueDisplayMode:{defaultValue:null,description:"",name:"valueDisplayMode",required:!1,type:{name:"enum",value:[{value:'"color"'},{value:'"hidden"'},{value:'"text"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BarGauge/BarGauge.tsx#getTitleStyles"]={docgenInfo:S.__docgenInfo,name:"getTitleStyles",path:"src/components/BarGauge/BarGauge.tsx#getTitleStyles"})}catch(F){}try{k.displayName="calculateBarAndValueDimensions",k.__docgenInfo={description:"",displayName:"calculateBarAndValueDimensions",props:{height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"FieldConfig<any>"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"DisplayProcessor"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"DisplayValue"}},orientation:{defaultValue:null,description:"",name:"orientation",required:!0,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},itemSpacing:{defaultValue:null,description:"",name:"itemSpacing",required:!1,type:{name:"number"}},lcdCellWidth:{defaultValue:null,description:"",name:"lcdCellWidth",required:!1,type:{name:"number"}},displayMode:{defaultValue:null,description:"",name:"displayMode",required:!0,type:{name:"enum",value:[{value:'"basic"'},{value:'"gradient"'},{value:'"lcd"'}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},showUnfilled:{defaultValue:null,description:"",name:"showUnfilled",required:!1,type:{name:"boolean"}},alignmentFactors:{defaultValue:null,description:"",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},valueDisplayMode:{defaultValue:null,description:"",name:"valueDisplayMode",required:!1,type:{name:"enum",value:[{value:'"color"'},{value:'"hidden"'},{value:'"text"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BarGauge/BarGauge.tsx#calculateBarAndValueDimensions"]={docgenInfo:k.__docgenInfo,name:"calculateBarAndValueDimensions",path:"src/components/BarGauge/BarGauge.tsx#calculateBarAndValueDimensions"})}catch(F){}try{I.displayName="getBasicAndGradientStyles",I.__docgenInfo={description:"Only exported to for unit test",displayName:"getBasicAndGradientStyles",props:{height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"FieldConfig<any>"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"DisplayProcessor"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"DisplayValue"}},orientation:{defaultValue:null,description:"",name:"orientation",required:!0,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},itemSpacing:{defaultValue:null,description:"",name:"itemSpacing",required:!1,type:{name:"number"}},lcdCellWidth:{defaultValue:null,description:"",name:"lcdCellWidth",required:!1,type:{name:"number"}},displayMode:{defaultValue:null,description:"",name:"displayMode",required:!0,type:{name:"enum",value:[{value:'"basic"'},{value:'"gradient"'},{value:'"lcd"'}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},showUnfilled:{defaultValue:null,description:"",name:"showUnfilled",required:!1,type:{name:"boolean"}},alignmentFactors:{defaultValue:null,description:"",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},valueDisplayMode:{defaultValue:null,description:"",name:"valueDisplayMode",required:!1,type:{name:"enum",value:[{value:'"color"'},{value:'"hidden"'},{value:'"text"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BarGauge/BarGauge.tsx#getBasicAndGradientStyles"]={docgenInfo:I.__docgenInfo,name:"getBasicAndGradientStyles",path:"src/components/BarGauge/BarGauge.tsx#getBasicAndGradientStyles"})}catch(F){}try{T.displayName="getBarGradient",T.__docgenInfo={description:"Only exported to for unit test",displayName:"getBarGradient",props:{height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"FieldConfig<any>"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"DisplayProcessor"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"DisplayValue"}},orientation:{defaultValue:null,description:"",name:"orientation",required:!0,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},itemSpacing:{defaultValue:null,description:"",name:"itemSpacing",required:!1,type:{name:"number"}},lcdCellWidth:{defaultValue:null,description:"",name:"lcdCellWidth",required:!1,type:{name:"number"}},displayMode:{defaultValue:null,description:"",name:"displayMode",required:!0,type:{name:"enum",value:[{value:'"basic"'},{value:'"gradient"'},{value:'"lcd"'}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},showUnfilled:{defaultValue:null,description:"",name:"showUnfilled",required:!1,type:{name:"boolean"}},alignmentFactors:{defaultValue:null,description:"",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},valueDisplayMode:{defaultValue:null,description:"",name:"valueDisplayMode",required:!1,type:{name:"enum",value:[{value:'"color"'},{value:'"hidden"'},{value:'"text"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BarGauge/BarGauge.tsx#getBarGradient"]={docgenInfo:T.__docgenInfo,name:"getBarGradient",path:"src/components/BarGauge/BarGauge.tsx#getBarGradient"})}catch(F){}try{j.displayName="getTextValueColor",j.__docgenInfo={description:"Only exported to for unit test",displayName:"getTextValueColor",props:{height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},field:{defaultValue:null,description:"",name:"field",required:!0,type:{name:"FieldConfig<any>"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"DisplayProcessor"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"DisplayValue"}},orientation:{defaultValue:null,description:"",name:"orientation",required:!0,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},itemSpacing:{defaultValue:null,description:"",name:"itemSpacing",required:!1,type:{name:"number"}},lcdCellWidth:{defaultValue:null,description:"",name:"lcdCellWidth",required:!1,type:{name:"number"}},displayMode:{defaultValue:null,description:"",name:"displayMode",required:!0,type:{name:"enum",value:[{value:'"basic"'},{value:'"gradient"'},{value:'"lcd"'}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},showUnfilled:{defaultValue:null,description:"",name:"showUnfilled",required:!1,type:{name:"boolean"}},alignmentFactors:{defaultValue:null,description:"",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},valueDisplayMode:{defaultValue:null,description:"",name:"valueDisplayMode",required:!1,type:{name:"enum",value:[{value:'"color"'},{value:'"hidden"'},{value:'"text"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BarGauge/BarGauge.tsx#getTextValueColor"]={docgenInfo:j.__docgenInfo,name:"getTextValueColor",path:"src/components/BarGauge/BarGauge.tsx#getTextValueColor"})}catch(F){}try{r.displayName="BarGauge",r.__docgenInfo={description:"",displayName:"BarGauge",props:{height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},field:{defaultValue:{value:`{
      min: 0,
      max: 100,
      thresholds: {
        mode: ThresholdsMode.Absolute,
        steps: [],
      },
    }`},description:"",name:"field",required:!1,type:{name:"FieldConfig<any>"}},display:{defaultValue:null,description:"",name:"display",required:!1,type:{name:"DisplayProcessor"}},value:{defaultValue:{value:`{
      text: '100',
      numeric: 100,
    }`},description:"",name:"value",required:!1,type:{name:"DisplayValue"}},orientation:{defaultValue:{value:"VizOrientation.Horizontal"},description:"",name:"orientation",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"vertical"'},{value:'"horizontal"'}]}},text:{defaultValue:null,description:"",name:"text",required:!1,type:{name:"VizTextDisplayOptions"}},itemSpacing:{defaultValue:{value:"8"},description:"",name:"itemSpacing",required:!1,type:{name:"number"}},lcdCellWidth:{defaultValue:{value:"12"},description:"",name:"lcdCellWidth",required:!1,type:{name:"number"}},displayMode:{defaultValue:{value:"BarGaugeDisplayMode.Gradient"},description:"",name:"displayMode",required:!1,type:{name:"enum",value:[{value:'"basic"'},{value:'"gradient"'},{value:'"lcd"'}]}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"MouseEventHandler<HTMLElement>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},showUnfilled:{defaultValue:{value:"true"},description:"",name:"showUnfilled",required:!1,type:{name:"boolean"}},alignmentFactors:{defaultValue:null,description:"",name:"alignmentFactors",required:!1,type:{name:"DisplayValueAlignmentFactors"}},valueDisplayMode:{defaultValue:null,description:"",name:"valueDisplayMode",required:!1,type:{name:"enum",value:[{value:'"color"'},{value:'"hidden"'},{value:'"text"'}]}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/BarGauge/BarGauge.tsx#BarGauge"]={docgenInfo:r.__docgenInfo,name:"BarGauge",path:"src/components/BarGauge/BarGauge.tsx#BarGauge"})}catch(F){}},"./src/components/Button/Button.tsx":function(se,V,e){"use strict";e.d(V,{NC:function(){return h},Qj:function(){return o},_7:function(){return D},c9:function(){return S},fW:function(){return r},gN:function(){return k},jg:function(){return y},zx:function(){return s}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/themes/mixins.ts"),x=e("./src/components/Forms/commonStyles.ts"),d=e("./src/components/Icon/Icon.tsx"),i=e("./src/components/Tooltip/Tooltip.tsx"),c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(M,I,T)=>I in M?c(M,I,{enumerable:!0,configurable:!0,writable:!0,value:T}):M[I]=T,b=(M,I)=>{for(var T in I||(I={}))w.call(I,T)&&C(M,T,I[T]);if(m)for(var T of m(I))_.call(I,T)&&C(M,T,I[T]);return M},g=(M,I)=>E(M,O(I)),v=(M,I)=>{var T={};for(var j in M)w.call(M,j)&&I.indexOf(j)<0&&(T[j]=M[j]);if(M!=null&&m)for(var j of m(M))I.indexOf(j)<0&&_.call(M,j)&&(T[j]=M[j]);return T};const y=["primary","secondary","destructive"],h=["solid","outline","text"],s=n.forwardRef((M,I)=>{var T=M,{variant:j="primary",size:K="md",fill:F="solid",icon:$,fullWidth:R,children:U,className:H,type:W="button",tooltip:oe,tooltipPlacement:Q}=T,P=v(T,["variant","size","fill","icon","fullWidth","children","className","type","tooltip","tooltipPlacement"]);const ae=(0,l.l4)(),q=r({theme:ae,size:K,variant:j,fill:F,fullWidth:R,iconOnly:!U}),Y=n.createElement("button",g(b({className:(0,t.cx)(q.button,H),type:W},P),{ref:I}),$&&n.createElement(d.J,{name:$,size:K,className:q.icon}),U&&n.createElement("span",{className:q.content},U));return oe?n.createElement(i.u,{content:oe,placement:Q},Y):Y});s.displayName="Button";const o=n.forwardRef((M,I)=>{var T=M,{variant:j="primary",size:K="md",fill:F="solid",icon:$,fullWidth:R,children:U,className:H,onBlur:W,onFocus:oe,disabled:Q,tooltip:P,tooltipPlacement:ae}=T,q=v(T,["variant","size","fill","icon","fullWidth","children","className","onBlur","onFocus","disabled","tooltip","tooltipPlacement"]);const Y=(0,l.l4)(),ve=r({theme:Y,fullWidth:R,size:K,variant:j,fill:F,iconOnly:!U}),re=(0,t.cx)(ve.button,{[(0,t.iv)(ve.disabled,{pointerEvents:"none"})]:Q},H),je=n.createElement("a",g(b({className:re},q),{tabIndex:Q?-1:0,ref:I}),$&&n.createElement(d.J,{name:$,size:K,className:ve.icon}),U&&n.createElement("span",{className:ve.content},U));return P?n.createElement(i.u,{content:P,placement:ae},je):je});o.displayName="LinkButton";const r=M=>{const{theme:I,variant:T,fill:j="solid",size:K,iconOnly:F,fullWidth:$}=M,{height:R,padding:U,fontSize:H}=(0,x.iL)(K,I),W=S(I,T,j),oe=p(I,T,j),Q=(0,f.SV)(I),P=I.spacing.gridSize*U-1;return{button:(0,t.iv)(g(b(b({label:"button",display:"inline-flex",alignItems:"center",fontSize:H,fontWeight:I.typography.fontWeightMedium,fontFamily:I.typography.fontFamily,padding:`0 ${P}px`,height:I.spacing(R),lineHeight:`${I.spacing.gridSize*R-2}px`,verticalAlign:"middle",cursor:"pointer",borderRadius:I.shape.borderRadius(1),"&:focus":Q,"&:focus-visible":Q,"&:focus:not(:focus-visible)":(0,f.Cq)(I)},$&&{flexGrow:1,justifyContent:"center"}),W),{":disabled":oe,"&[disabled]":oe})),disabled:(0,t.iv)(oe),img:t.iv`
      width: 16px;
      height: 16px;
      margin: ${I.spacing(0,1,0,.5)};
    `,icon:F?(0,t.iv)({marginRight:I.spacing(-U/2),marginLeft:I.spacing(-U/2)}):(0,t.iv)({marginRight:I.spacing(U/2)}),content:t.iv`
      display: flex;
      flex-direction: row;
      align-items: center;
      white-space: nowrap;
      height: 100%;
    `}};function u(M,I,T){return T==="outline"?{background:"transparent",color:I.text,border:`1px solid ${I.border}`,transition:M.transitions.create(["background-color","border-color","color"],{duration:M.transitions.duration.short}),"&:hover":{background:a.Fq(I.main,M.colors.action.hoverOpacity),borderColor:M.colors.emphasize(I.border,.25),color:I.text}}:T==="text"?{background:"transparent",color:I.text,border:"1px solid transparent",transition:M.transitions.create(["background-color","color"],{duration:M.transitions.duration.short}),"&:focus":{outline:"none",textDecoration:"none"},"&:hover":{background:a.Fq(I.shade,M.colors.action.hoverOpacity),textDecoration:"none"}}:{background:I.main,color:I.contrastText,border:"1px solid transparent",transition:M.transitions.create(["background-color","box-shadow","border-color","color"],{duration:M.transitions.duration.short}),"&:hover":{background:I.shade,color:I.contrastText,boxShadow:M.shadows.z1}}}function p(M,I,T){const j={cursor:"not-allowed",boxShadow:"none",color:M.colors.text.disabled,transition:"none"};return T==="text"?g(b({},j),{background:"transparent",border:"1px solid transparent"}):T==="outline"?g(b({},j),{background:"transparent",border:`1px solid ${M.colors.action.disabledText}`}):g(b({},j),{background:M.colors.action.disabledBackground,border:"1px solid transparent"})}function S(M,I,T){switch(I){case"secondary":return u(M,M.colors.secondary,T);case"destructive":return u(M,M.colors.error,T);case"success":return u(M,M.colors.success,T);case"primary":default:return u(M,M.colors.primary,T)}}const k=M=>t.iv`
    background: transparent;
    color: ${M.colors.text.primary};
    border: none;
    padding: 0;
  `,D=M=>t.iv`
    background: transparent;
    border: none;
    padding: 0;
    font-family: inherit;
    color: inherit;
    height: 100%;
    &:hover {
      background: transparent;
      color: inherit;
    }
  `;try{s.displayName="Button",s.__docgenInfo={description:"",displayName:"Button",props:{size:{defaultValue:{value:"md"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'}]}},variant:{defaultValue:{value:"primary"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"success"'},{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},fill:{defaultValue:{value:"solid"},description:"",name:"fill",required:!1,type:{name:"enum",value:[{value:'"text"'},{value:'"solid"'},{value:'"outline"'}]}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},fullWidth:{defaultValue:null,description:"",name:"fullWidth",required:!1,type:{name:"boolean"}},type:{defaultValue:{value:"button"},description:"",name:"type",required:!1,type:{name:"enum",value:[{value:'"submit"'},{value:'"reset"'},{value:'"button"'}]}},tooltip:{defaultValue:null,description:"Tooltip content to display on hover",name:"tooltip",required:!1,type:{name:"PopoverContent"}},tooltipPlacement:{defaultValue:null,description:"Position of the tooltip",name:"tooltipPlacement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Button/Button.tsx#Button"]={docgenInfo:s.__docgenInfo,name:"Button",path:"src/components/Button/Button.tsx#Button"})}catch(M){}},"./src/components/Button/ButtonGroup.tsx":function(se,V,e){"use strict";e.d(V,{h:function(){return O}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=Object.defineProperty,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(w,_,C)=>_ in w?l(w,_,{enumerable:!0,configurable:!0,writable:!0,value:C}):w[_]=C,c=(w,_)=>{for(var C in _||(_={}))x.call(_,C)&&i(w,C,_[C]);if(f)for(var C of f(_))d.call(_,C)&&i(w,C,_[C]);return w},E=(w,_)=>{var C={};for(var b in w)x.call(w,b)&&_.indexOf(b)<0&&(C[b]=w[b]);if(w!=null&&f)for(var b of f(w))_.indexOf(b)<0&&d.call(w,b)&&(C[b]=w[b]);return C};const O=(0,n.forwardRef)((w,_)=>{var C=w,{className:b,children:g}=C,v=E(C,["className","children"]);const y=(0,a.wW)(m);return n.createElement("div",c({ref:_,className:(0,t.cx)("button-group",y.wrapper,b)},v),g)});O.displayName="ButtonGroup";const m=w=>({wrapper:t.iv`
    display: flex;

    > .button-group:not(:first-child) > button,
    > button:not(:first-child) {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
    }

    > .button-group:not(:last-child) > button,
    > button:not(:last-child) {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
      border-right-width: 0;
    }
  `});try{O.displayName="ButtonGroup",O.__docgenInfo={description:"",displayName:"ButtonGroup",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Button/ButtonGroup.tsx#ButtonGroup"]={docgenInfo:O.__docgenInfo,name:"ButtonGroup",path:"src/components/Button/ButtonGroup.tsx#ButtonGroup"})}catch(w){}},"./src/components/Card/Card.tsx":function(se,V,e){"use strict";e.d(V,{Z:function(){return T}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/themes/mixins.ts"),f=e("./src/themes/stylesFactory.ts"),x=Object.defineProperty,d=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(re,je,me)=>je in re?x(re,je,{enumerable:!0,configurable:!0,writable:!0,value:me}):re[je]=me,w=(re,je)=>{for(var me in je||(je={}))E.call(je,me)&&m(re,me,je[me]);if(c)for(var me of c(je))O.call(je,me)&&m(re,me,je[me]);return re},_=(re,je)=>d(re,i(je)),C=(re,je)=>{var me={};for(var ne in re)E.call(re,ne)&&je.indexOf(ne)<0&&(me[ne]=re[ne]);if(re!=null&&c)for(var ne of c(re))je.indexOf(ne)<0&&O.call(re,ne)&&(me[ne]=re[ne]);return me};const b=({children:re,href:je})=>{const{inner:me}=(0,a.wW)(g);return je?n.createElement("a",{className:me,href:je},re):n.createElement(n.Fragment,null,re)},g=re=>({inner:(0,t.iv)({display:"flex",width:"100%",padding:re.spacing(2)})}),v=re=>{var je=re,{children:me,disableEvents:ne,disableHover:Z,isSelected:te,className:Pe,href:he}=je,ie=C(je,["children","disableEvents","disableHover","isSelected","className","href"]);const Ce=(0,a.l4)(),{oldContainer:Le}=y(Ce,ne,Z,te);return n.createElement("div",_(w({},ie),{className:(0,t.cx)(Le,Pe)}),n.createElement(b,{href:he},me))},y=(0,f.B)((re,je=!1,me=!1,ne)=>{const Z=ne!==void 0;return{container:(0,t.iv)(w(w(w({display:"grid",position:"relative",gridTemplateColumns:"auto 1fr auto",gridTemplateRows:"1fr auto auto auto",gridAutoColumns:"1fr",gridAutoFlow:"row",gridTemplateAreas:`
        "Figure Heading Tags"
        "Figure Meta Tags"
        "Figure Description Tags"
        "Figure Actions Secondary"`,width:"100%",padding:re.spacing(2),background:re.colors.background.secondary,borderRadius:re.shape.borderRadius(),marginBottom:"8px",pointerEvents:je?"none":"auto",transition:re.transitions.create(["background-color","box-shadow","border-color","color"],{duration:re.transitions.duration.short})},!me&&{"&:hover":{background:re.colors.emphasize(re.colors.background.secondary,.03),cursor:"pointer",zIndex:1},"&:focus":l.SV(re)}),Z&&{cursor:"pointer"}),ne&&{outline:`solid 2px ${re.colors.primary.border}`})),oldContainer:(0,t.iv)(w({display:"flex",width:"100%",background:re.colors.background.secondary,borderRadius:re.shape.borderRadius(),position:"relative",pointerEvents:je?"none":"auto",marginBottom:re.spacing(1),transition:re.transitions.create(["background-color","box-shadow","border-color","color"],{duration:re.transitions.duration.short})},!me&&{"&:hover":{background:re.colors.emphasize(re.colors.background.secondary,.03),cursor:"pointer",zIndex:1},"&:focus":l.SV(re)}))}});try{v.displayName="CardContainer",v.__docgenInfo={description:"",displayName:"CardContainer",props:{disableEvents:{defaultValue:null,description:"Disable pointer events for the Card, e.g. click events",name:"disableEvents",required:!1,type:{name:"boolean"}},disableHover:{defaultValue:null,description:"No style change on hover",name:"disableHover",required:!1,type:{name:"boolean"}},isSelected:{defaultValue:null,description:'Makes the card selectable, set to "true" to apply selected styles',name:"isSelected",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"Custom container styles",name:"className",required:!1,type:{name:"string"}},href:{defaultValue:null,description:"",name:"href",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/CardContainer.tsx#CardContainer"]={docgenInfo:v.__docgenInfo,name:"CardContainer",path:"src/components/Card/CardContainer.tsx#CardContainer"})}catch(re){}try{y.displayName="getCardContainerStyles",y.__docgenInfo={description:"",displayName:"getCardContainerStyles",props:{0:{defaultValue:null,description:"",name:"0",required:!0,type:{name:"GrafanaTheme2"}},1:{defaultValue:null,description:"",name:"1",required:!0,type:{name:"any"}},2:{defaultValue:null,description:"",name:"2",required:!0,type:{name:"any"}},3:{defaultValue:null,description:"",name:"3",required:!0,type:{name:"any"}},length:{defaultValue:null,description:"",name:"length",required:!0,type:{name:"4"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/CardContainer.tsx#getCardContainerStyles"]={docgenInfo:y.__docgenInfo,name:"getCardContainerStyles",path:"src/components/Card/CardContainer.tsx#getCardContainerStyles"})}catch(re){}var h=Object.defineProperty,s=Object.defineProperties,o=Object.getOwnPropertyDescriptors,r=Object.getOwnPropertySymbols,u=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable,S=(re,je,me)=>je in re?h(re,je,{enumerable:!0,configurable:!0,writable:!0,value:me}):re[je]=me,k=(re,je)=>{for(var me in je||(je={}))u.call(je,me)&&S(re,me,je[me]);if(r)for(var me of r(je))p.call(je,me)&&S(re,me,je[me]);return re},D=(re,je)=>s(re,o(je)),M=(re,je)=>{var me={};for(var ne in re)u.call(re,ne)&&je.indexOf(ne)<0&&(me[ne]=re[ne]);if(re!=null&&r)for(var ne of r(re))je.indexOf(ne)<0&&p.call(re,ne)&&(me[ne]=re[ne]);return me};const I=n.createContext(null),T=re=>{var je=re,{disabled:me,href:ne,onClick:Z,children:te,isSelected:Pe,className:he}=je,ie=M(je,["disabled","href","onClick","children","isSelected","className"]);const Ce=(0,n.useMemo)(()=>n.Children.toArray(te).some(qe=>n.isValidElement(qe)&&qe.type.displayName===j.displayName),[te]),Le=me||!Z&&!ne,we=Z&&!me?Z:void 0,ue=(0,a.l4)(),Ie=y(ue,me,Le,Pe);return n.createElement(v,k({disableEvents:me,disableHover:Le,isSelected:Pe,className:(0,t.cx)(Ie.container,he)},ie),n.createElement(I.Provider,{value:{href:ne,onClick:we,disabled:me,isSelected:Pe}},!Ce&&n.createElement(j,null),te))},j=({children:re,className:je,"aria-label":me})=>{const ne=(0,n.useContext)(I),Z=(0,a.wW)(K),{href:te,onClick:Pe,isSelected:he}=ne!=null?ne:{href:void 0,onClick:void 0,isSelected:void 0};return n.createElement("h2",{className:(0,t.cx)(Z.heading,je)},te?n.createElement("a",{href:te,className:Z.linkHack,"aria-label":me,onClick:Pe},re):Pe?n.createElement("button",{onClick:Pe,className:Z.linkHack,"aria-label":me,type:"button"},re):n.createElement(n.Fragment,null,re),he!==void 0&&n.createElement("input",{"aria-label":"option",type:"radio",readOnly:!0,checked:he}))};j.displayName="Heading";const K=re=>({heading:(0,t.iv)({gridArea:"Heading",justifySelf:"start",display:"flex",justifyContent:"space-between",alignItems:"center",width:"100%",marginBottom:0,fontSize:re.typography.size.md,letterSpacing:"inherit",lineHeight:re.typography.body.lineHeight,color:re.colors.text.primary,fontWeight:re.typography.fontWeightMedium}),linkHack:(0,t.iv)({all:"unset","&::after":{position:"absolute",content:'""',top:0,bottom:0,left:0,right:0,borderRadius:re.shape.borderRadius(1)},"&:focus-visible":{outline:"none",outlineOffset:0,boxShadow:"none","&::after":D(k({},(0,l.SV)(re)),{zIndex:1})}})}),F=({children:re,className:je})=>{const me=(0,a.wW)($);return n.createElement("div",{className:(0,t.cx)(me.tagList,je)},re)};F.displayName="Tags";const $=re=>({tagList:(0,t.iv)({position:"relative",gridArea:"Tags",alignSelf:"center"})}),R=({children:re,className:je})=>{const me=(0,a.wW)(U);return n.createElement("p",{className:(0,t.cx)(me.description,je)},re)};R.displayName="Description";const U=re=>({description:(0,t.iv)({width:"100%",gridArea:"Description",margin:re.spacing(1,0,0),color:re.colors.text.secondary,lineHeight:re.typography.body.lineHeight})}),H=({children:re,align:je="start",className:me})=>{const ne=(0,a.wW)(W);return n.createElement("div",{className:(0,t.cx)(ne.media,me,t.iv`
          align-self: ${je};
        `)},re)};H.displayName="Figure";const W=re=>({media:(0,t.iv)({position:"relative",gridArea:"Figure",marginRight:re.spacing(2),width:"40px","> img":{width:"100%"},"&:empty":{display:"none"}})}),oe=(0,n.memo)(({children:re,className:je,separator:me="|"})=>{const ne=(0,a.wW)(Q);let Z=re;const te=n.Children.toArray(re).filter(Boolean);return te.length?(Z=te.map((Pe,he)=>n.createElement("div",{key:`element_${he}`,className:ne.metadataItem},Pe)),te.length>1&&me&&(Z=te.reduce((Pe,he,ie)=>[Pe,n.createElement("span",{key:`separator_${ie}`,className:ne.separator},me),he])),n.createElement("div",{className:(0,t.cx)(ne.metadata,je)},Z)):null});oe.displayName="Meta";const Q=re=>({metadata:(0,t.iv)({gridArea:"Meta",display:"flex",alignItems:"center",width:"100%",fontSize:re.typography.size.sm,color:re.colors.text.secondary,margin:re.spacing(.5,0,0),lineHeight:re.typography.bodySmall.lineHeight,overflowWrap:"anywhere"}),metadataItem:(0,t.iv)({zIndex:0}),separator:(0,t.iv)({margin:`0 ${re.spacing(1)}`})}),P=({children:re,disabled:je,variant:me,className:ne})=>{const Z=(0,a.wW)(ae),te=(0,n.useContext)(I),Pe=(te==null?void 0:te.disabled)||je,he=me==="primary"?Z.actions:Z.secondaryActions;return n.createElement("div",{className:(0,t.cx)(he,ne)},n.Children.map(re,ie=>n.isValidElement(ie)?(0,n.cloneElement)(ie,k({disabled:Pe},ie.props)):null))},ae=re=>({actions:(0,t.iv)({gridArea:"Actions",marginTop:re.spacing(2),"& > *":{marginRight:re.spacing(1)}}),secondaryActions:(0,t.iv)({display:"flex",gridArea:"Secondary",alignSelf:"center",color:re.colors.text.secondary,marginTtop:re.spacing(2),"& > *":{marginRight:`${re.spacing(1)} !important`}})}),q=({children:re,disabled:je,className:me})=>n.createElement(P,{variant:"primary",disabled:je,className:me},re);q.displayName="Actions";const Y=({children:re,disabled:je,className:me})=>n.createElement(P,{variant:"secondary",disabled:je,className:me},re);Y.displayName="SecondaryActions";const ve=re=>k(k(k(k(k(k({inner:css`
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 100%;
      flex-wrap: wrap;
    `},K(re)),Q(re)),U(re)),W(re)),ae(re)),$(re));T.Heading=j,T.Tags=F,T.Figure=H,T.Meta=oe,T.Actions=q,T.SecondaryActions=Y,T.Description=R;try{j.displayName="Heading",j.__docgenInfo={description:"Generic card component",displayName:"Heading",props:{disabled:{defaultValue:null,description:"Indicates if the card and all its actions can be interacted with",name:"disabled",required:!1,type:{name:"boolean"}},href:{defaultValue:null,description:"Link to redirect to on card click. If provided, the Card inner content will be rendered inside `a`",name:"href",required:!1,type:{name:"string"}},onClick:{defaultValue:null,description:"On click handler for the Card",name:"onClick",required:!1,type:{name:"((e: MouseEvent<HTMLElement, MouseEvent>) => void)"}},heading:{defaultValue:null,description:"@deprecated Use `Card.Heading` instead",name:"heading",required:!1,type:{name:"ReactNode"}},description:{defaultValue:null,description:"@deprecated Use `Card.Description` instead",name:"description",required:!1,type:{name:"string"}},isSelected:{defaultValue:null,description:'Makes the card selectable, set to "true" to apply selected styles',name:"isSelected",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"Custom container styles",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.tsx#Heading"]={docgenInfo:j.__docgenInfo,name:"Heading",path:"src/components/Card/Card.tsx#Heading"})}catch(re){}try{T.Heading.displayName="Card.Heading",T.Heading.__docgenInfo={description:"Main heading for the card",displayName:"Card.Heading",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},"aria-label":{defaultValue:null,description:"",name:"aria-label",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.tsx#Card.Heading"]={docgenInfo:T.Heading.__docgenInfo,name:"Card.Heading",path:"src/components/Card/Card.tsx#Card.Heading"})}catch(re){}try{T.Tags.displayName="Card.Tags",T.Tags.__docgenInfo={description:"",displayName:"Card.Tags",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.tsx#Card.Tags"]={docgenInfo:T.Tags.__docgenInfo,name:"Card.Tags",path:"src/components/Card/Card.tsx#Card.Tags"})}catch(re){}try{T.Figure.displayName="Card.Figure",T.Figure.__docgenInfo={description:"",displayName:"Card.Figure",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},align:{defaultValue:{value:"start"},description:"",name:"align",required:!1,type:{name:"enum",value:[{value:'"start"'},{value:'"center"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.tsx#Card.Figure"]={docgenInfo:T.Figure.__docgenInfo,name:"Card.Figure",path:"src/components/Card/Card.tsx#Card.Figure"})}catch(re){}try{T.Meta.displayName="Card.Meta",T.Meta.__docgenInfo={description:"",displayName:"Card.Meta",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},separator:{defaultValue:null,description:"",name:"separator",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.tsx#Card.Meta"]={docgenInfo:T.Meta.__docgenInfo,name:"Card.Meta",path:"src/components/Card/Card.tsx#Card.Meta"})}catch(re){}try{T.Actions.displayName="Card.Actions",T.Actions.__docgenInfo={description:"",displayName:"Card.Actions",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.tsx#Card.Actions"]={docgenInfo:T.Actions.__docgenInfo,name:"Card.Actions",path:"src/components/Card/Card.tsx#Card.Actions"})}catch(re){}try{T.SecondaryActions.displayName="Card.SecondaryActions",T.SecondaryActions.__docgenInfo={description:"",displayName:"Card.SecondaryActions",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.tsx#Card.SecondaryActions"]={docgenInfo:T.SecondaryActions.__docgenInfo,name:"Card.SecondaryActions",path:"src/components/Card/Card.tsx#Card.SecondaryActions"})}catch(re){}try{T.Description.displayName="Card.Description",T.Description.__docgenInfo={description:"Card description text",displayName:"Card.Description",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Card/Card.tsx#Card.Description"]={docgenInfo:T.Description.__docgenInfo,name:"Card.Description",path:"src/components/Card/Card.tsx#Card.Description"})}catch(re){}},"./src/components/Cascader/Cascader.tsx":function(se,V,e){"use strict";e.d(V,{v:function(){return O}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/memoize-one-npm-6.0.0-8b2a2cd020-f185ea69f7.zip/node_modules/memoize-one/dist/memoize-one.esm.js"),a=e("../../.yarn/__virtual__/rc-cascader-virtual-49e17f6cc6/2/yarn/cache/rc-cascader-npm-3.8.0-8c3d54b44b-eb6cb454c8.zip/node_modules/rc-cascader/es/index.js"),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),f=e("./src/components/Icon/Icon.tsx"),x=e("./src/components/Input/Input.tsx"),d=e("./src/components/Select/Select.tsx"),i=e("./src/components/Cascader/optionMappings.ts");const c=(0,t.iv)(`
&:focus{
  outline: none;
}
`),E="/";class O extends l.PureComponent{constructor(w){super(w),this.flattenOptions=(g,v=[])=>{let y=[];for(const h of g){const s=[...v];s.push(h),h.items?y=[...y,...this.flattenOptions(h.items,s)]:y.push({singleLabel:s[s.length-1].label,label:s.map(o=>o.label).join(this.props.separator||` ${E} `),value:s.map(o=>o.value)})}return y},this.getSearchableOptions=(0,n.Z)(g=>this.flattenOptions(g)),this.onChange=(g,v)=>{const y=this.props.hideActiveLevelLabel?"":this.props.displayAllSelectedLevels?v.map(h=>h.label).join(this.props.separator||E):v[v.length-1].label;this.setState({rcValue:g,focusCascade:!0,activeLabel:y}),this.props.onSelect(v[v.length-1].value)},this.onSelect=g=>{const v=g.value||[];this.setState({activeLabel:this.props.displayAllSelectedLevels?g.label:g.singleLabel||"",rcValue:v,isSearching:!1}),this.props.onSelect(v[v.length-1])},this.onCreateOption=g=>{this.setState({activeLabel:g,rcValue:[],isSearching:!1}),this.props.onSelect(g)},this.onBlur=()=>{var g,v;this.setState({isSearching:!1,focusCascade:!1}),this.state.activeLabel===""&&this.setState({rcValue:[]}),(v=(g=this.props).onBlur)==null||v.call(g)},this.onBlurCascade=()=>{var g,v;this.setState({focusCascade:!1}),(v=(g=this.props).onBlur)==null||v.call(g)},this.onInputKeyDown=g=>{["ArrowDown","ArrowUp","Enter","ArrowLeft","ArrowRight","Backspace"].includes(g.key)||this.setState({focusCascade:!1,isSearching:!0})},this.onSelectInputChange=g=>{g===""&&this.setState({isSearching:!1})};const _=this.getSearchableOptions(w.options),{rcValue:C,activeLabel:b}=this.setInitialValue(_,w.initialValue);this.state={isSearching:!1,focusCascade:!1,rcValue:C,activeLabel:b}}setInitialValue(w,_){if(!_)return{rcValue:[],activeLabel:""};for(const C of w){const b=C.value||[];if(b.indexOf(_)===b.length-1)return{rcValue:b,activeLabel:this.props.displayAllSelectedLevels?C.label:C.singleLabel||""}}return this.props.allowCustomValue?{rcValue:[],activeLabel:_}:{rcValue:[],activeLabel:""}}render(){const{allowCustomValue:w,formatCreateLabel:_,placeholder:C,width:b,changeOnSelect:g,options:v}=this.props,{focusCascade:y,isSearching:h,rcValue:s,activeLabel:o}=this.state,r=this.getSearchableOptions(v);return l.createElement("div",null,h?l.createElement(d.Ph,{allowCustomValue:w,placeholder:C,autoFocus:!y,onChange:this.onSelect,onBlur:this.onBlur,options:r,onCreateOption:this.onCreateOption,formatCreateLabel:_,width:b,onInputChange:this.onSelectInputChange}):l.createElement(a.Z,{onChange:(0,i.K)(this.onChange),options:v,changeOnSelect:g,value:s.value,fieldNames:{label:"label",value:"value",children:"items"},expandIcon:null,open:this.props.alwaysOpen},l.createElement("div",{className:c},l.createElement(x.I,{autoFocus:this.props.autoFocus,width:b,placeholder:C,onBlur:this.onBlurCascade,value:o,onKeyDown:this.onInputKeyDown,onChange:()=>{},suffix:y?l.createElement(f.J,{name:"angle-up"}):l.createElement(f.J,{name:"angle-down",style:{marginBottom:0,marginLeft:"4px"}})}))))}}O.defaultProps={changeOnSelect:!0};try{O.displayName="Cascader",O.__docgenInfo={description:"",displayName:"Cascader",props:{separator:{defaultValue:null,description:"The separator between levels in the search",name:"separator",required:!1,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"CascaderOption[]"}},changeOnSelect:{defaultValue:{value:"true"},description:"Changes the value for every selection, including branch nodes. Defaults to true.",name:"changeOnSelect",required:!1,type:{name:"boolean"}},onSelect:{defaultValue:null,description:"",name:"onSelect",required:!0,type:{name:"(val: string) => void"}},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"}},initialValue:{defaultValue:null,description:"",name:"initialValue",required:!1,type:{name:"string"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},formatCreateLabel:{defaultValue:null,description:"A function for formatting the message for custom value creation. Only applies when allowCustomValue is set to true",name:"formatCreateLabel",required:!1,type:{name:"((val: string) => string)"}},displayAllSelectedLevels:{defaultValue:null,description:"If true all levels are shown in the input by simple concatenating the labels",name:"displayAllSelectedLevels",required:!1,type:{name:"boolean"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},autoFocus:{defaultValue:null,description:"When mounted focus automatically on the input",name:"autoFocus",required:!1,type:{name:"boolean"}},alwaysOpen:{defaultValue:null,description:"Keep the dropdown open all the time, useful in case whole cascader visibility is controlled by the parent",name:"alwaysOpen",required:!1,type:{name:"boolean"}},hideActiveLevelLabel:{defaultValue:null,description:`Don't show what is selected in the cascader input/search. Useful when input is used just as search and the
cascader is hidden after selection.`,name:"hideActiveLevelLabel",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Cascader/Cascader.tsx#Cascader"]={docgenInfo:O.__docgenInfo,name:"Cascader",path:"src/components/Cascader/Cascader.tsx#Cascader"})}catch(m){}},"./src/components/Cascader/optionMappings.ts":function(se,V,e){"use strict";e.d(V,{K:function(){return t},p:function(){return n}});const t=f=>(x,d)=>{f&&f(x.map(i=>String(i)),a(d))},n=f=>x=>{f&&f(a(x))},a=f=>f.map(l),l=f=>{var x;return{value:(x=f.value)!=null?x:"",label:f.label}}},"./src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx":function(se,V,e){"use strict";e.d(V,{L:function(){return n}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js");class n extends t.PureComponent{constructor(){super(...arguments),this.myRef=(0,t.createRef)(),this.state={hasEventListener:!1},this.onOutsideClick=l=>{const f=this.myRef.current;(!f||!f.contains(l.target))&&this.props.onClick()}}componentDidMount(){this.props.parent.addEventListener("click",this.onOutsideClick,this.props.useCapture),this.props.includeButtonPress&&this.props.parent.addEventListener("keyup",this.onOutsideClick,this.props.useCapture)}componentWillUnmount(){this.props.parent.removeEventListener("click",this.onOutsideClick,this.props.useCapture),this.props.includeButtonPress&&this.props.parent.removeEventListener("keyup",this.onOutsideClick,this.props.useCapture)}render(){return t.createElement("div",{ref:this.myRef},this.props.children)}}n.defaultProps={includeButtonPress:!0,parent:typeof window!="undefined"?window:null,useCapture:!1};try{n.displayName="ClickOutsideWrapper",n.__docgenInfo={description:"",displayName:"ClickOutsideWrapper",props:{onClick:{defaultValue:null,description:"Callback to trigger when clicking outside of current element occurs.",name:"onClick",required:!0,type:{name:"() => void"}},includeButtonPress:{defaultValue:{value:"true"},description:"Runs the 'onClick' function when pressing a key outside of the current element. Defaults to true.",name:"includeButtonPress",required:!1,type:{name:"boolean"}},parent:{defaultValue:{value:"typeof window !== 'undefined' ? window : null"},description:"Object to attach the click event listener to.",name:"parent",required:!1,type:{name:"Window | Document"}},useCapture:{defaultValue:{value:"false"},description:"https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener. Defaults to false.",name:"useCapture",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx#ClickOutsideWrapper"]={docgenInfo:n.__docgenInfo,name:"ClickOutsideWrapper",path:"src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx#ClickOutsideWrapper"})}catch(a){}},"./src/components/Collapse/CollapsableSection.tsx":function(se,V,e){"use strict";e.d(V,{s:function(){return c}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),a=e.n(n),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),f=e("./src/components/Spinner/Spinner.tsx"),x=e("./src/components/Icon/Icon.tsx"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/themes/mixins.ts");const c=({label:O,isOpen:m,onToggle:w,className:_,contentClassName:C,children:b,labelId:g,loading:v=!1,headerDataTestId:y,contentDataTestId:h})=>{const[s,o]=(0,l.useState)(m),r=(0,d.wW)(E),u=k=>{k.target instanceof HTMLElement&&k.target.tagName==="A"||(k.preventDefault(),k.stopPropagation(),w==null||w(!s),o(!s))},{current:p}=(0,l.useRef)((0,n.uniqueId)()),S=g!=null?g:`collapse-label-${p}`;return l.createElement(l.Fragment,null,l.createElement("div",{onClick:u,className:(0,t.cx)(r.header,_)},l.createElement("button",{type:"button",id:`collapse-button-${p}`,className:r.button,onClick:u,"aria-expanded":s&&!v,"aria-controls":`collapse-content-${p}`,"aria-labelledby":S},v?l.createElement(f.$,{className:r.spinner}):l.createElement(x.J,{name:s?"angle-up":"angle-down",className:r.icon})),l.createElement("div",{className:r.label,id:`collapse-label-${p}`,"data-testid":y},O)),s&&l.createElement("div",{id:`collapse-content-${p}`,className:(0,t.cx)(r.content,C),"data-testid":h},b))},E=O=>({header:(0,t.iv)({display:"flex",cursor:"pointer",boxSizing:"border-box",flexDirection:"row-reverse",position:"relative",justifyContent:"space-between",fontSize:O.typography.size.lg,padding:`${O.spacing(.5)} 0`,"&:focus-within":(0,i.SV)(O)}),button:(0,t.iv)({all:"unset","&:focus-visible":{outline:"none",outlineOffset:"unset",transition:"none",boxShadow:"none"}}),icon:(0,t.iv)({color:O.colors.text.secondary}),content:(0,t.iv)({padding:`${O.spacing(2)} 0`}),spinner:(0,t.iv)({display:"flex",alignItems:"center",width:O.spacing(2)}),label:(0,t.iv)({display:"flex"})});try{c.displayName="CollapsableSection",c.__docgenInfo={description:"",displayName:"CollapsableSection",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"ReactNode"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!0,type:{name:"boolean"}},onToggle:{defaultValue:null,description:"Callback for the toggle functionality",name:"onToggle",required:!1,type:{name:"((isOpen: boolean) => void)"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},contentClassName:{defaultValue:null,description:"",name:"contentClassName",required:!1,type:{name:"string"}},loading:{defaultValue:{value:"false"},description:"",name:"loading",required:!1,type:{name:"boolean"}},labelId:{defaultValue:null,description:"",name:"labelId",required:!1,type:{name:"string"}},headerDataTestId:{defaultValue:null,description:"",name:"headerDataTestId",required:!1,type:{name:"string"}},contentDataTestId:{defaultValue:null,description:"",name:"contentDataTestId",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Collapse/CollapsableSection.tsx#CollapsableSection"]={docgenInfo:c.__docgenInfo,name:"CollapsableSection",path:"src/components/Collapse/CollapsableSection.tsx#CollapsableSection"})}catch(O){}},"./src/components/ColorPicker/ColorInput.tsx":function(se,V,e){"use strict";var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),a=e.n(n),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),f=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js"),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/components/Input/Input.tsx"),i=Object.defineProperty,c=Object.defineProperties,E=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?i(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=(s,o)=>c(s,E(o)),g=(s,o)=>{var r={};for(var u in s)m.call(s,u)&&o.indexOf(u)<0&&(r[u]=s[u]);if(s!=null&&O)for(var u of O(s))o.indexOf(u)<0&&w.call(s,u)&&(r[u]=s[u]);return r};const v=(0,l.forwardRef)((s,o)=>{var r=s,{color:u,onChange:p,isClearable:S=!1,onClick:k,onBlur:D,disabled:M,buttonAriaLabel:I}=r,T=g(r,["color","onChange","isClearable","onClick","onBlur","disabled","buttonAriaLabel"]);const[j,K]=(0,l.useState)(u),[F,$]=(0,l.useState)(u),R=(0,l.useMemo)(()=>(0,n.debounce)(p,100),[]);(0,l.useEffect)(()=>{const W=(0,f.Z)(u);W.isValid()&&u!==F&&(K(W.toString()),$(u))},[u,F]);const U=W=>{const{value:oe}=W.currentTarget;if(K(oe),oe===""&&S){R(oe);return}const Q=(0,f.Z)(oe);Q.isValid()&&R(Q.toString())},H=W=>{(0,f.Z)(j).isValid()||K(u),D==null||D(W)};return l.createElement(d.I,b(C({},T),{value:j,onChange:U,disabled:M,onClick:k,onBlur:H,addonBefore:l.createElement(y,{onClick:k,ariaLabel:I,disabled:M,color:u}),ref:o}))});v.displayName="ColorInput",V.Z=v;const y=({color:s,onClick:o,disabled:r,ariaLabel:u})=>{const p=(0,x.wW)(h);return l.createElement("button",{type:"button",onClick:o,"aria-label":u,disabled:r||!o,className:(0,t.cx)(p,t.iv`
          background-color: ${s};
        `)})},h=s=>t.iv`
  height: 100%;
  width: ${s.spacing.gridSize*4}px;
  border-radius: ${s.shape.borderRadius()} 0 0 ${s.shape.borderRadius()};
  border: 1px solid ${s.colors.border.medium};
`;try{v.displayName="ColorInput",v.__docgenInfo={description:"",displayName:"ColorInput",props:{prefix:{defaultValue:null,description:"Show an icon as a prefix in the input",name:"prefix",required:!1,type:{name:"ReactNode"}},color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"ColorPickerChangeHandler"}},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"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}},loading:{defaultValue:null,description:"Show a loading indicator as a suffix in the input",name:"loading",required:!1,type:{name:"boolean"}},enableNamedColors:{defaultValue:null,description:"",name:"enableNamedColors",required:!1,type:{name:"boolean"}},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"}},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"}},isClearable:{defaultValue:{value:"false"},description:"",name:"isClearable",required:!1,type:{name:"boolean"}},buttonAriaLabel:{defaultValue:null,description:"",name:"buttonAriaLabel",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/ColorInput.tsx#ColorInput"]={docgenInfo:v.__docgenInfo,name:"ColorInput",path:"src/components/ColorPicker/ColorInput.tsx#ColorInput"})}catch(s){}},"./src/components/ColorPicker/ColorPicker.tsx":function(se,V,e){"use strict";e.d(V,{zH:function(){return s},sp:function(){return o}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/themes/stylesFactory.ts");const f=(u,p)=>{u.key==="Tab"||u.altKey||u.ctrlKey||u.metaKey||(u.stopPropagation(),u.key==="Escape"&&p())};var x=e("./src/components/Tooltip/Popover.tsx");class d extends n.Component{constructor(){super(...arguments),this.hideTimeout=null,this.state={show:!1},this.showPopper=()=>{this.hideTimeout&&clearTimeout(this.hideTimeout),this.setState({show:!0})},this.hidePopper=()=>{this.hideTimeout=setTimeout(()=>{this.setState({show:!1})},this.props.hideAfter)}}render(){const{children:p,content:S,placement:k="auto"}=this.props,{show:D}=this.state;return p(this.showPopper,this.hidePopper,{show:D,placement:k,content:S})}}try{d.displayName="PopoverController",d.__docgenInfo={description:"",displayName:"PopoverController",props:{placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"PopoverContent"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},hideAfter:{defaultValue:null,description:"",name:"hideAfter",required:!1,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tooltip/PopoverController.tsx#PopoverController"]={docgenInfo:d.__docgenInfo,name:"PopoverController",path:"src/components/Tooltip/PopoverController.tsx#PopoverController"})}catch(u){}var i=e("./src/components/ColorPicker/ColorPickerPopover.tsx"),c=e("./src/components/ColorPicker/ColorSwatch.tsx"),E=e("./src/components/ColorPicker/SeriesColorPickerPopover.tsx"),O=Object.defineProperty,m=Object.defineProperties,w=Object.getOwnPropertyDescriptors,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(u,p,S)=>p in u?O(u,p,{enumerable:!0,configurable:!0,writable:!0,value:S}):u[p]=S,v=(u,p)=>{for(var S in p||(p={}))C.call(p,S)&&g(u,S,p[S]);if(_)for(var S of _(p))b.call(p,S)&&g(u,S,p[S]);return u},y=(u,p)=>m(u,w(p));const h=(u,p="ColorPicker")=>{var S;return S=class extends n.Component{constructor(){super(...arguments),this.pickerTriggerRef=(0,n.createRef)()}render(){const{theme:k,children:D,onChange:M}=this.props,I=r(k),T=n.createElement(u,y(v({},y(v({},this.props),{children:null})),{onChange:M}));return n.createElement(d,{content:T,hideAfter:300},(j,K,F)=>n.createElement(n.Fragment,null,this.pickerTriggerRef.current&&n.createElement(x.J,y(v({},F),{referenceElement:this.pickerTriggerRef.current,wrapperClassName:I.colorPicker,onMouseLeave:K,onMouseEnter:j,onKeyDown:$=>f($,K)})),D?D({ref:this.pickerTriggerRef,showColorPicker:j,hideColorPicker:K}):n.createElement(c.b,{ref:this.pickerTriggerRef,onClick:j,onMouseLeave:K,color:k.visualization.getColorByName(this.props.color||"#000000")})))}},S.displayName=p,S},s=(0,a.HE)(h(i.h,"ColorPicker")),o=(0,a.HE)(h(E.j,"SeriesColorPicker")),r=(0,l.B)(u=>({colorPicker:t.iv`
      position: absolute;
      z-index: ${u.zIndex.tooltip};
      color: ${u.colors.text.primary};
      max-width: 400px;
      font-size: ${u.typography.size.sm};
      // !important because these styles are also provided to popper via .popper classes from Tooltip component
      // hope to get rid of those soon
      padding: 15px !important;
      & [data-placement^='top'] {
        padding-left: 0 !important;
        padding-right: 0 !important;
      }
      & [data-placement^='bottom'] {
        padding-left: 0 !important;
        padding-right: 0 !important;
      }
      & [data-placement^='left'] {
        padding-top: 0 !important;
      }
      & [data-placement^='right'] {
        padding-top: 0 !important;
      }
    `}));try{s.displayName="ColorPicker",s.__docgenInfo={description:"",displayName:"ColorPicker",props:{color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"ColorPickerChangeHandler"}},enableNamedColors:{defaultValue:null,description:"",name:"enableNamedColors",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/ColorPicker.tsx#ColorPicker"]={docgenInfo:s.__docgenInfo,name:"ColorPicker",path:"src/components/ColorPicker/ColorPicker.tsx#ColorPicker"})}catch(u){}try{o.displayName="SeriesColorPicker",o.__docgenInfo={description:"",displayName:"SeriesColorPicker",props:{color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"ColorPickerChangeHandler"}},enableNamedColors:{defaultValue:null,description:"",name:"enableNamedColors",required:!1,type:{name:"boolean"}},updatePopperPosition:{defaultValue:null,description:"",name:"updatePopperPosition",required:!1,type:{name:"(() => void)"}},yaxis:{defaultValue:null,description:"",name:"yaxis",required:!1,type:{name:"number"}},onToggleAxis:{defaultValue:null,description:"",name:"onToggleAxis",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/ColorPicker.tsx#SeriesColorPicker"]={docgenInfo:o.__docgenInfo,name:"SeriesColorPicker",path:"src/components/ColorPicker/ColorPicker.tsx#SeriesColorPicker"})}catch(u){}},"./src/components/ColorPicker/ColorPickerPopover.tsx":function(se,V,e){"use strict";e.d(V,{h:function(){return E}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts"),f=e("./src/themes/ThemeContext.tsx"),x=e("./src/themes/stylesFactory.ts"),d=e("./src/components/ColorPicker/NamedColorsPalette.tsx"),i=e("./src/components/ColorPicker/SpectrumPalette.tsx");class c extends a.Component{constructor(w){super(w),this.getTabClassName=_=>{const{activePicker:C}=this.state;return`ColorPickerPopover__tab ${C===_&&"ColorPickerPopover__tab--active"}`},this.handleChange=_=>{const{onChange:C,enableNamedColors:b,theme:g}=this.props;if(b)return C(_);C(l.k$(g.visualization.getColorByName(_)))},this.onTabChange=_=>()=>this.setState({activePicker:_}),this.renderPicker=()=>{const{activePicker:_}=this.state,{color:C}=this.props;switch(_){case"spectrum":return a.createElement(i.Z,{color:C,onChange:this.handleChange});case"palette":return a.createElement(d.V,{color:C,onChange:this.handleChange});default:return this.renderCustomPicker(_)}},this.renderCustomPicker=_=>{const{customPickers:C,color:b,theme:g}=this.props;return C?a.createElement(C[_].tabComponent,{color:b,theme:g,onChange:this.handleChange}):null},this.renderCustomPickerTabs=()=>{const{customPickers:_}=this.props;return _?a.createElement(a.Fragment,null,Object.keys(_).map(C=>a.createElement("button",{className:this.getTabClassName(C),onClick:this.onTabChange(C),key:C},_[C].name))):null},this.state={activePicker:"palette"}}render(){const{theme:w}=this.props,_=O(w);return a.createElement(n.MT,{contain:!0,restoreFocus:!0,autoFocus:!0},a.createElement("div",{tabIndex:-1,className:_.colorPickerPopover},a.createElement("div",{className:_.colorPickerPopoverTabs},a.createElement("button",{className:this.getTabClassName("palette"),onClick:this.onTabChange("palette")},"Colors"),a.createElement("button",{className:this.getTabClassName("spectrum"),onClick:this.onTabChange("spectrum")},"Custom"),this.renderCustomPickerTabs()),a.createElement("div",{className:_.colorPickerPopoverContent},this.renderPicker())))}}const E=(0,f.HE)(c);E.displayName="ColorPickerPopover";const O=(0,x.B)(m=>({colorPickerPopover:t.iv`
      border-radius: ${m.shape.borderRadius()};
      box-shadow: ${m.shadows.z3};
      background: ${m.colors.background.primary};
      border: 1px solid ${m.colors.border.medium};

      .ColorPickerPopover__tab {
        width: 50%;
        text-align: center;
        padding: ${m.spacing(1,0)};
        background: ${m.colors.background.secondary};
        color: ${m.colors.text.secondary};
        font-size: ${m.typography.bodySmall.fontSize};
        cursor: pointer;
        border: none;

        &:focus:not(:focus-visible) {
          outline: none;
          box-shadow: none;
        }

        :focus-visible {
          position: relative;
        }
      }

      .ColorPickerPopover__tab--active {
        color: ${m.colors.text.primary};
        font-weight: ${m.typography.fontWeightMedium};
        background: ${m.colors.background.primary};
      }
    `,colorPickerPopoverContent:t.iv`
      width: 246px;
      font-size: ${m.typography.bodySmall.fontSize};
      min-height: 184px;
      padding: ${m.spacing(1)};
      display: flex;
      flex-direction: column;
    `,colorPickerPopoverTabs:t.iv`
      display: flex;
      width: 100%;
      border-radius: ${m.shape.borderRadius()} ${m.shape.borderRadius()} 0 0;
    `}));try{E.displayName="ColorPickerPopover",E.__docgenInfo={description:"",displayName:"ColorPickerPopover",props:{color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"ColorPickerChangeHandler"}},customPickers:{defaultValue:null,description:"",name:"customPickers",required:!1,type:{name:"CustomPickersDescriptor"}},enableNamedColors:{defaultValue:null,description:"",name:"enableNamedColors",required:!1,type:{name:"boolean"}},updatePopperPosition:{defaultValue:null,description:"",name:"updatePopperPosition",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/ColorPickerPopover.tsx#ColorPickerPopover"]={docgenInfo:E.__docgenInfo,name:"ColorPickerPopover",path:"src/components/ColorPicker/ColorPickerPopover.tsx#ColorPickerPopover"})}catch(m){}},"./src/components/ColorPicker/ColorSwatch.tsx":function(se,V,e){"use strict";e.d(V,{$:function(){return g},b:function(){return v}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js"),f=e("../grafana-e2e-selectors/src/selectors/index.ts"),x=e("./src/themes/ThemeContext.tsx"),d=Object.defineProperty,i=Object.defineProperties,c=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(h,s,o)=>s in h?d(h,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):h[s]=o,_=(h,s)=>{for(var o in s||(s={}))O.call(s,o)&&w(h,o,s[o]);if(E)for(var o of E(s))m.call(s,o)&&w(h,o,s[o]);return h},C=(h,s)=>i(h,c(s)),b=(h,s)=>{var o={};for(var r in h)O.call(h,r)&&s.indexOf(r)<0&&(o[r]=h[r]);if(h!=null&&E)for(var r of E(h))s.indexOf(r)<0&&m.call(h,r)&&(o[r]=h[r]);return o},g=(h=>(h.Small="small",h.Large="large",h))(g||{});const v=a.forwardRef((h,s)=>{var o=h,{color:r,label:u,variant:p="small",isSelected:S,"aria-label":k}=o,D=b(o,["color","label","variant","isSelected","aria-label"]);const M=(0,x.l4)(),{isFocusVisible:I,focusProps:T}=(0,n.Fx)(),j=y(M,p,r,I,S),K=!!u,F=`${k||u} color`;return a.createElement("div",_({ref:s,className:j.wrapper,"data-testid":f.wl.components.ColorSwatch.name},D),K&&a.createElement("span",{className:j.label},u),a.createElement("button",C(_({className:j.swatch},T),{"aria-label":F})))}),y=(h,s,o,r,u)=>{const p=(0,l.Z)(o),k=s==="small"?"16px":"32px";let D="none";return p.getAlpha()<.1&&(D=`2px solid ${h.colors.border.medium}`),{wrapper:(0,t.iv)({display:"flex",alignItems:"center",cursor:"pointer"}),label:(0,t.iv)({marginRight:h.spacing(1)}),swatch:(0,t.iv)({width:k,height:k,background:`${o}`,border:D,borderRadius:"50%",outlineOffset:"1px",outline:r?`2px solid  ${h.colors.primary.main}`:"none",boxShadow:u?`inset 0 0 0 2px ${o}, inset 0 0 0 4px ${h.colors.getContrastText(o)}`:"none",transition:h.transitions.create(["transform"],{duration:h.transitions.duration.short}),"&:hover":{transform:"scale(1.1)"}})}};v.displayName="ColorSwatch";try{v.displayName="ColorSwatch",v.__docgenInfo={description:"",displayName:"ColorSwatch",props:{color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"string"}},label:{defaultValue:null,description:"",name:"label",required:!1,type:{name:"string"}},variant:{defaultValue:{value:"ColorSwatchVariant.Small"},description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"small"'},{value:'"large"'}]}},isSelected:{defaultValue:null,description:"",name:"isSelected",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/ColorSwatch.tsx#ColorSwatch"]={docgenInfo:v.__docgenInfo,name:"ColorSwatch",path:"src/components/ColorPicker/ColorSwatch.tsx#ColorSwatch"})}catch(h){}},"./src/components/ColorPicker/NamedColorsPalette.tsx":function(se,V,e){"use strict";e.d(V,{V:function(){return h}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/ColorPicker/ColorSwatch.tsx"),f=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js");function x(o,r){const u=new Array(o.length);for(let p=0;p<o.length;p++){const S=o.length-1-p;u[p]=r(o[S],S,o)}return u}var d=Object.defineProperty,i=Object.defineProperties,c=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(o,r,u)=>r in o?d(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,_=(o,r)=>{for(var u in r||(r={}))O.call(r,u)&&w(o,u,r[u]);if(E)for(var u of E(r))m.call(r,u)&&w(o,u,r[u]);return o},C=(o,r)=>i(o,c(r)),b=(o,r)=>{var u={};for(var p in o)O.call(o,p)&&r.indexOf(p)<0&&(u[p]=o[p]);if(o!=null&&E)for(var p of E(o))r.indexOf(p)<0&&m.call(o,p)&&(u[p]=o[p]);return u};const g=o=>{var r=o,{hue:u,selectedColor:p,onColorSelect:S}=r,k=b(r,["hue","selectedColor","onColorSelect"]);const D=(0,f.upperFirst)(u.name),M=(0,a.wW)(y);return n.createElement("div",{className:M.colorRow},n.createElement("div",{className:M.colorLabel},D),n.createElement("div",C(_({},k),{className:M.swatchRow}),x(u.shades,I=>n.createElement(l.b,{key:I.name,"aria-label":I.name,variant:I.primary?l.$.Large:l.$.Small,isSelected:I.name===p,color:I.color,onClick:()=>S(I.name)}))))};var v=g;const y=o=>({colorRow:t.iv`
      display: grid;
      grid-template-columns: 25% 1fr;
      grid-column-gap: ${o.spacing(2)};
      padding: ${o.spacing(.5,0)};

      &:hover {
        background: ${o.colors.background.secondary};
      }
    `,colorLabel:t.iv`
      padding-left: ${o.spacing(2)};
      display: flex;
      align-items: center;
    `,swatchRow:t.iv`
      display: flex;
      gap: ${o.spacing(1)};
      align-items: center;
      justify-content: space-around;
      flex-direction: row;
    `});try{g.displayName="NamedColorsGroup",g.__docgenInfo={description:"",displayName:"NamedColorsGroup",props:{hue:{defaultValue:null,description:"",name:"hue",required:!0,type:{name:"ThemeVizHue"}},selectedColor:{defaultValue:null,description:"",name:"selectedColor",required:!1,type:{name:"Color"}},onColorSelect:{defaultValue:null,description:"",name:"onColorSelect",required:!0,type:{name:"(colorName: string) => void"}},key:{defaultValue:null,description:"",name:"key",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/NamedColorsGroup.tsx#NamedColorsGroup"]={docgenInfo:g.__docgenInfo,name:"NamedColorsGroup",path:"src/components/ColorPicker/NamedColorsGroup.tsx#NamedColorsGroup"})}catch(o){}const h=({color:o,onChange:r})=>{const u=(0,a.l4)(),p=(0,a.wW)(s),S=[];for(const k of u.visualization.hues)S.push(n.createElement(v,{key:k.name,selectedColor:o,hue:k,onColorSelect:r}));return n.createElement(n.Fragment,null,n.createElement("div",{className:p.swatches},S),n.createElement("div",{className:p.extraColors},n.createElement(l.b,{isSelected:o==="transparent",color:"rgba(0,0,0,0)",label:"Transparent",onClick:()=>r("transparent")}),n.createElement(l.b,{isSelected:o==="text",color:u.colors.text.primary,label:"Text color",onClick:()=>r("text")})))},s=o=>({container:t.iv`
      display: flex;
      flex-direction: column;
    `,extraColors:t.iv`
      display: flex;
      align-items: center;
      justify-content: space-around;
      gap: ${o.spacing(1)};
      padding: ${o.spacing(1,0)};
    `,swatches:t.iv`
      display: grid;
      flex-grow: 1;
    `});try{h.displayName="NamedColorsPalette",h.__docgenInfo={description:"",displayName:"NamedColorsPalette",props:{color:{defaultValue:null,description:"",name:"color",required:!1,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(colorName: string) => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/NamedColorsPalette.tsx#NamedColorsPalette"]={docgenInfo:h.__docgenInfo,name:"NamedColorsPalette",path:"src/components/ColorPicker/NamedColorsPalette.tsx#NamedColorsPalette"})}catch(o){}},"./src/components/ColorPicker/SeriesColorPickerPopover.tsx":function(se,V,e){"use strict";e.d(V,{j:function(){return y}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),f=e("./src/components/Icon/Icon.tsx"),x=e("./src/components/Tooltip/Tooltip.tsx");class d extends n.PureComponent{constructor(){super(...arguments),this.state={id:(0,l.uniqueId)()},this.internalOnChange=r=>{r.stopPropagation(),this.props.onChange(r)}}render(){const{labelClass:r="",switchClass:u="",label:p,checked:S,disabled:k,transparent:D,className:M,tooltip:I,tooltipPlacement:T}=this.props,j=this.state.id,K=`gf-form-label ${r} ${D?"gf-form-label--transparent":""} pointer`,F=`gf-form-switch ${u} ${D?"gf-form-switch--transparent":""}`;return n.createElement("div",{className:"gf-form-switch-container-react"},n.createElement("label",{htmlFor:j,className:`gf-form gf-form-switch-container ${M||""}`},p&&n.createElement("div",{className:K},p,I&&n.createElement(x.u,{placement:T||"auto",content:I,theme:"info"},n.createElement("div",{className:"gf-form-help-icon gf-form-help-icon--right-normal"},n.createElement(f.J,{name:"info-circle",size:"sm",style:{marginLeft:"10px"}})))),n.createElement("div",{className:F},n.createElement("input",{disabled:k,id:j,type:"checkbox",checked:S,onChange:this.internalOnChange}),n.createElement("span",{className:"gf-form-switch__slider"}))))}}try{d.displayName="Switch",d.__docgenInfo={description:"",displayName:"Switch",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"string"}},checked:{defaultValue:null,description:"",name:"checked",required:!0,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},labelClass:{defaultValue:null,description:"",name:"labelClass",required:!1,type:{name:"string"}},switchClass:{defaultValue:null,description:"",name:"switchClass",required:!1,type:{name:"string"}},tooltip:{defaultValue:null,description:"",name:"tooltip",required:!1,type:{name:"string"}},tooltipPlacement:{defaultValue:null,description:"",name:"tooltipPlacement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}},transparent:{defaultValue:null,description:"",name:"transparent",required:!1,type:{name:"boolean"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(event: SyntheticEvent<HTMLInputElement, Event>) => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Legacy/Switch/Switch.tsx#Switch"]={docgenInfo:d.__docgenInfo,name:"Switch",path:"src/components/Forms/Legacy/Switch/Switch.tsx#Switch"})}catch(o){}var i=e("./src/components/ColorPicker/ColorPickerPopover.tsx"),c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(o,r,u)=>r in o?c(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,b=(o,r)=>{for(var u in r||(r={}))w.call(r,u)&&C(o,u,r[u]);if(m)for(var u of m(r))_.call(r,u)&&C(o,u,r[u]);return o},g=(o,r)=>E(o,O(r)),v=(o,r)=>{var u={};for(var p in o)w.call(o,p)&&r.indexOf(p)<0&&(u[p]=o[p]);if(o!=null&&m)for(var p of m(o))r.indexOf(p)<0&&_.call(o,p)&&(u[p]=o[p]);return u};const y=o=>{const r=(0,a.wW)(s),u=o,{yaxis:p,onToggleAxis:S,color:k}=u,D=v(u,["yaxis","onToggleAxis","color"]),M=S?{yaxis:{name:"Y-Axis",tabComponent(){return n.createElement(d,{key:"yaxisSwitch",label:"Use right y-axis",className:r.colorPickerAxisSwitch,labelClass:r.colorPickerAxisSwitchLabel,checked:p===2,onChange:()=>{S&&S()}})}}}:void 0;return n.createElement(i.h,g(b({},D),{color:k||"#000000",customPickers:M}))},h=(0,a.HE)(y),s=()=>({colorPickerAxisSwitch:t.iv`
      width: 100%;
    `,colorPickerAxisSwitchLabel:t.iv`
      display: flex;
      flex-grow: 1;
    `});try{y.displayName="SeriesColorPickerPopover",y.__docgenInfo={description:"",displayName:"SeriesColorPickerPopover",props:{yaxis:{defaultValue:null,description:"",name:"yaxis",required:!1,type:{name:"number"}},onToggleAxis:{defaultValue:null,description:"",name:"onToggleAxis",required:!1,type:{name:"(() => void)"}},color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"ColorPickerChangeHandler"}},enableNamedColors:{defaultValue:null,description:"",name:"enableNamedColors",required:!1,type:{name:"boolean"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}},updatePopperPosition:{defaultValue:null,description:"",name:"updatePopperPosition",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/SeriesColorPickerPopover.tsx#SeriesColorPickerPopover"]={docgenInfo:y.__docgenInfo,name:"SeriesColorPickerPopover",path:"src/components/ColorPicker/SeriesColorPickerPopover.tsx#SeriesColorPickerPopover"})}catch(o){}try{h.displayName="SeriesColorPickerPopoverWithTheme",h.__docgenInfo={description:"",displayName:"SeriesColorPickerPopoverWithTheme",props:{color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"ColorPickerChangeHandler"}},enableNamedColors:{defaultValue:null,description:"",name:"enableNamedColors",required:!1,type:{name:"boolean"}},updatePopperPosition:{defaultValue:null,description:"",name:"updatePopperPosition",required:!1,type:{name:"(() => void)"}},yaxis:{defaultValue:null,description:"",name:"yaxis",required:!1,type:{name:"number"}},onToggleAxis:{defaultValue:null,description:"",name:"onToggleAxis",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/SeriesColorPickerPopover.tsx#SeriesColorPickerPopoverWithTheme"]={docgenInfo:h.__docgenInfo,name:"SeriesColorPickerPopoverWithTheme",path:"src/components/ColorPicker/SeriesColorPickerPopover.tsx#SeriesColorPickerPopoverWithTheme"})}catch(o){}},"./src/components/ColorPicker/SpectrumPalette.tsx":function(se,V,e){"use strict";e.d(V,{W:function(){return E}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-colorful-virtual-2349db95c0/2/yarn/cache/react-colorful-npm-5.6.1-ba0c706357-e432b7cb0d.zip/node_modules/react-colorful/dist/index.mjs"),l=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useThrottleFn.js"),f=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js"),x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/components/ColorPicker/ColorInput.tsx");const c=({color:O,onChange:m})=>{const[w,_]=(0,n.useState)(O);(0,l.Z)(v=>{m(x.k$(C.visualization.getColorByName(v)))},500,[w]);const C=(0,d.l4)(),b=(0,d.wW)(E),g=(0,n.useMemo)(()=>w.startsWith("rgba")?w:(0,f.Z)(C.visualization.getColorByName(O)).toRgbString(),[w,C,O]);return n.createElement("div",{className:b.wrapper},n.createElement(a.ef,{className:b.root,color:g,onChange:_}),n.createElement(i.Z,{theme:C,color:g,onChange:_,className:b.colorInput}))},E=O=>({wrapper:t.iv`
    flex-grow: 1;
  `,root:t.iv`
    &.react-colorful {
      width: auto;
    }

    .react-colorful {
      &__saturation {
        border-radius: ${O.shape.borderRadius(1)} ${O.shape.borderRadius(1)} 0 0;
      }
      &__alpha {
        border-radius: 0 0 ${O.shape.borderRadius(1)} ${O.shape.borderRadius(1)};
      }
      &__alpha,
      &__hue {
        height: ${O.spacing(2)};
        position: relative;
      }
      &__pointer {
        height: ${O.spacing(2)};
        width: ${O.spacing(2)};
      }
    }
  `,colorInput:t.iv`
    margin-top: ${O.spacing(2)};
  `});V.Z=c;try{E.displayName="getStyles",E.__docgenInfo={description:"",displayName:"getStyles",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},isDark:{defaultValue:null,description:"",name:"isDark",required:!0,type:{name:"boolean"}},isLight:{defaultValue:null,description:"",name:"isLight",required:!0,type:{name:"boolean"}},colors:{defaultValue:null,description:"",name:"colors",required:!0,type:{name:"ThemeColors"}},breakpoints:{defaultValue:null,description:"",name:"breakpoints",required:!0,type:{name:"ThemeBreakpoints"}},spacing:{defaultValue:null,description:"",name:"spacing",required:!0,type:{name:"ThemeSpacing"}},shape:{defaultValue:null,description:"",name:"shape",required:!0,type:{name:"ThemeShape"}},components:{defaultValue:null,description:"",name:"components",required:!0,type:{name:"ThemeComponents"}},typography:{defaultValue:null,description:"",name:"typography",required:!0,type:{name:"ThemeTypography"}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!0,type:{name:"{ navbarFixed: number; sidemenu: number; dropdown: number; typeahead: number; tooltip: number; modalBackdrop: number; modal: number; portal: number; }"}},shadows:{defaultValue:null,description:"",name:"shadows",required:!0,type:{name:"ThemeShadows"}},visualization:{defaultValue:null,description:"",name:"visualization",required:!0,type:{name:"ThemeVisualizationColors"}},transitions:{defaultValue:null,description:"",name:"transitions",required:!0,type:{name:"ThemeTransitions"}},v1:{defaultValue:null,description:"@deprecated Will be removed in a future version",name:"v1",required:!0,type:{name:"GrafanaTheme"}},flags:{defaultValue:null,description:"feature flags that might impact component looks",name:"flags",required:!0,type:{name:"{ topnav?: boolean | undefined; }"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/SpectrumPalette.tsx#getStyles"]={docgenInfo:E.__docgenInfo,name:"getStyles",path:"src/components/ColorPicker/SpectrumPalette.tsx#getStyles"})}catch(O){}try{c.displayName="SpectrumPalette",c.__docgenInfo={description:"",displayName:"SpectrumPalette",props:{color:{defaultValue:null,description:"",name:"color",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(color: string) => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ColorPicker/SpectrumPalette.tsx#SpectrumPalette"]={docgenInfo:c.__docgenInfo,name:"SpectrumPalette",path:"src/components/ColorPicker/SpectrumPalette.tsx#SpectrumPalette"})}catch(O){}},"./src/components/ContextMenu/ContextMenu.tsx":function(se,V,e){"use strict";e.d(V,{x:function(){return x}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useClickAway.js"),a=e("../grafana-e2e-selectors/src/selectors/index.ts"),l=e("./src/components/Menu/Menu.tsx"),f=e("./src/components/Portal/Portal.tsx");const x=t.memo(({x:d,y:i,onClose:c,focusOnOpen:E=!0,renderMenuItems:O,renderHeader:m})=>{const w=(0,t.useRef)(null),[_,C]=(0,t.useState)({});(0,t.useLayoutEffect)(()=>{const h=w.current;if(h){const s=h.getBoundingClientRect(),o=5,r={right:window.innerWidth<d+s.width,bottom:window.innerHeight<i+s.height+o};C({position:"fixed",left:r.right?d-s.width-o:d-o,top:r.bottom?i-s.height-o:i+o})}},[d,i]),(0,n.Z)(w,()=>{c==null||c()});const b=m==null?void 0:m(),g=O==null?void 0:O(),v=h=>{E&&h(0)},y=h=>{h.key==="Escape"&&(h.preventDefault(),h.stopPropagation(),c==null||c())};return t.createElement(f.h_,null,t.createElement(l.v,{header:b,ref:w,style:_,ariaLabel:a.wl.components.Menu.MenuComponent("Context"),onOpen:v,onClick:c,onKeyDown:y},g))});x.displayName="ContextMenu";try{x.displayName="ContextMenu",x.__docgenInfo={description:"",displayName:"ContextMenu",props:{x:{defaultValue:null,description:"Starting horizontal position for the menu",name:"x",required:!0,type:{name:"number"}},y:{defaultValue:null,description:"Starting vertical position for the menu",name:"y",required:!0,type:{name:"number"}},onClose:{defaultValue:null,description:"Callback for closing the menu",name:"onClose",required:!1,type:{name:"(() => void)"}},focusOnOpen:{defaultValue:null,description:"On menu open focus the first element",name:"focusOnOpen",required:!1,type:{name:"boolean"}},renderMenuItems:{defaultValue:null,description:"RenderProp function that returns menu items to display",name:"renderMenuItems",required:!1,type:{name:"(() => ReactNode)"}},renderHeader:{defaultValue:null,description:"A function that returns header element",name:"renderHeader",required:!1,type:{name:"(() => ReactNode)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ContextMenu/ContextMenu.tsx#ContextMenu"]={docgenInfo:x.__docgenInfo,name:"ContextMenu",path:"src/components/ContextMenu/ContextMenu.tsx#ContextMenu"})}catch(d){}},"./src/components/ContextMenu/WithContextMenu.tsx":function(se,V,e){"use strict";e.d(V,{z:function(){return a}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/components/ContextMenu/ContextMenu.tsx");const a=({children:l,renderMenuItems:f,focusOnOpen:x=!0})=>{const[d,i]=(0,t.useState)(!1),[c,E]=(0,t.useState)({x:0,y:0});return t.createElement(t.Fragment,null,l({openMenu:O=>{i(!0),E({x:O.pageX,y:O.pageY})}}),d&&t.createElement(n.x,{onClose:()=>i(!1),x:c.x,y:c.y,renderMenuItems:f,focusOnOpen:x}))};try{a.displayName="WithContextMenu",a.__docgenInfo={description:"",displayName:"WithContextMenu",props:{children:{defaultValue:null,description:"Menu item trigger that accepts openMenu prop",name:"children",required:!0,type:{name:"(props: { openMenu: MouseEventHandler<HTMLElement>; }) => Element"}},renderMenuItems:{defaultValue:null,description:"A function that returns an array of menu items",name:"renderMenuItems",required:!0,type:{name:"() => ReactNode"}},focusOnOpen:{defaultValue:{value:"true"},description:"On menu open focus the first element",name:"focusOnOpen",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ContextMenu/WithContextMenu.tsx#WithContextMenu"]={docgenInfo:a.__docgenInfo,name:"WithContextMenu",path:"src/components/ContextMenu/WithContextMenu.tsx#WithContextMenu"})}catch(l){}},"./src/components/CustomScrollbar/CustomScrollbar.tsx":function(se,V,e){"use strict";e.d(V,{$:function(){return y},Z:function(){return h}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-custom-scrollbars-2-virtual-934ff2d971/2/yarn/cache/react-custom-scrollbars-2-npm-4.5.0-420f40d266-b264629c0b.zip/node_modules/react-custom-scrollbars-2/lib/index.js"),l=e("./src/themes/ThemeContext.tsx"),f=e("../../../yarn/cache/classnames-npm-2.3.2-d2fdae468d-2c62199789.zip/node_modules/classnames/index.js"),x=e.n(f),d=e("./src/components/Icon/Icon.tsx");const i=({children:o})=>{const[r,u]=(0,n.useState)(!1),[p,S]=(0,n.useState)(!1),k=(0,n.useRef)(null),D=(0,n.useRef)(null),M=(0,l.wW)(c);return(0,n.useEffect)(()=>{const I=new IntersectionObserver(T=>{T.forEach(j=>{j.target===k.current?u(!j.isIntersecting):j.target===D.current&&S(!j.isIntersecting)})});return[k,D].forEach(T=>{T.current&&I.observe(T.current)}),()=>I.disconnect()},[]),n.createElement(n.Fragment,null,n.createElement("div",{className:(0,t.cx)(M.scrollIndicator,M.scrollTopIndicator,{[M.scrollIndicatorVisible]:r})},n.createElement(d.J,{className:x()(M.scrollIcon,M.scrollTopIcon),name:"angle-up"})),n.createElement("div",{className:M.scrollContent},n.createElement("div",{ref:k}),o,n.createElement("div",{ref:D})),n.createElement("div",{className:(0,t.cx)(M.scrollIndicator,M.scrollBottomIndicator,{[M.scrollIndicatorVisible]:p})},n.createElement(d.J,{className:x()(M.scrollIcon,M.scrollBottomIcon),name:"angle-down"})))},c=o=>({scrollContent:(0,t.iv)({flex:1,position:"relative"}),scrollIndicator:(0,t.iv)({height:o.spacing(6),left:0,opacity:0,pointerEvents:"none",position:"absolute",right:0,transition:o.transitions.create("opacity"),zIndex:1}),scrollTopIndicator:(0,t.iv)({background:`linear-gradient(0deg, transparent, ${o.colors.background.canvas})`,top:0}),scrollBottomIndicator:(0,t.iv)({background:`linear-gradient(180deg, transparent, ${o.colors.background.canvas})`,bottom:0}),scrollIndicatorVisible:(0,t.iv)({opacity:1}),scrollIcon:(0,t.iv)({left:"50%",position:"absolute",transform:"translateX(-50%)"}),scrollTopIcon:(0,t.iv)({top:0}),scrollBottomIcon:(0,t.iv)({bottom:0})});try{i.displayName="ScrollIndicators",i.__docgenInfo={description:"",displayName:"ScrollIndicators",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/CustomScrollbar/ScrollIndicators.tsx#ScrollIndicators"]={docgenInfo:i.__docgenInfo,name:"ScrollIndicators",path:"src/components/CustomScrollbar/ScrollIndicators.tsx#ScrollIndicators"})}catch(o){}var E=Object.defineProperty,O=Object.defineProperties,m=Object.getOwnPropertyDescriptors,w=Object.getOwnPropertySymbols,_=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable,b=(o,r,u)=>r in o?E(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,g=(o,r)=>{for(var u in r||(r={}))_.call(r,u)&&b(o,u,r[u]);if(w)for(var u of w(r))C.call(r,u)&&b(o,u,r[u]);return o},v=(o,r)=>O(o,m(r));const y=({autoHide:o=!1,autoHideTimeout:r=200,setScrollTop:u,className:p,testId:S,autoHeightMin:k="0",autoHeightMax:D="100%",hideTracksWhenNotNeeded:M=!1,hideHorizontalTrack:I,hideVerticalTrack:T,scrollRefCallback:j,showScrollIndicators:K=!1,updateAfterMountMs:F,scrollTop:$,onScroll:R,children:U})=>{const H=(0,n.useRef)(null),W=(0,l.wW)(s);(0,n.useEffect)(()=>{H.current&&j&&j(H.current.view)},[H,j]),(0,n.useEffect)(()=>{H.current&&$!=null&&H.current.scrollTop($)},[$]),(0,n.useEffect)(()=>{!F||setTimeout(()=>{const re=H.current;re!=null&&re.update&&re.update()},F)},[F]);function oe(re,je,me){return me.style&&je&&(me.style.display="none"),n.createElement("div",v(g({},me),{className:re}))}const Q=(0,n.useCallback)(re=>oe("track-horizontal",I,re),[I]),P=(0,n.useCallback)(re=>oe("track-vertical",T,re),[T]),ae=(0,n.useCallback)(re=>n.createElement("div",v(g({},re),{className:"thumb-horizontal"})),[]),q=(0,n.useCallback)(re=>n.createElement("div",v(g({},re),{className:"thumb-vertical"})),[]),Y=(0,n.useCallback)(re=>(re.style&&re.style.WebkitOverflowScrolling==="touch"&&(re.style.WebkitOverflowScrolling="auto"),n.createElement("div",v(g({},re),{className:"scrollbar-view"}))),[]),ve=(0,n.useCallback)(()=>{H.current&&u&&u(H.current.getValues())},[u]);return n.createElement(a.ZP,{"data-testid":S,ref:H,className:(0,t.cx)(W.customScrollbar,p,{[W.scrollbarWithScrollIndicators]:K}),onScrollStop:ve,autoHeight:!0,autoHide:o,autoHideTimeout:r,hideTracksWhenNotNeeded:M,autoHeightMax:D,autoHeightMin:k,renderTrackHorizontal:Q,renderTrackVertical:P,renderThumbHorizontal:ae,renderThumbVertical:q,renderView:Y,onScroll:R},K?n.createElement(i,null,U):U)};var h=y;const s=o=>({customScrollbar:t.iv`
      // Fix for Firefox. For some reason sometimes .view container gets a height of its content, but in order to
      // make scroll working it should fit outer container size (scroll appears only when inner container size is
      // greater than outer one).
      display: flex;
      flex-grow: 1;
      .scrollbar-view {
        display: flex;
        flex-grow: 1;
        flex-direction: column;
      }
      .track-vertical {
        border-radius: ${o.shape.borderRadius(2)};
        width: ${o.spacing(1)} !important;
        right: 0px;
        bottom: ${o.spacing(.25)};
        top: ${o.spacing(.25)};
      }
      .track-horizontal {
        border-radius: ${o.shape.borderRadius(2)};
        height: ${o.spacing(1)} !important;
        right: ${o.spacing(.25)};
        bottom: ${o.spacing(.25)};
        left: ${o.spacing(.25)};
      }
      .thumb-vertical {
        background: ${o.colors.action.focus};
        border-radius: ${o.shape.borderRadius(2)};
        opacity: 0;
      }
      .thumb-horizontal {
        background: ${o.colors.action.focus};
        border-radius: ${o.shape.borderRadius(2)};
        opacity: 0;
      }
      &:hover {
        .thumb-vertical,
        .thumb-horizontal {
          opacity: 1;
          transition: opacity 0.3s ease-in-out;
        }
      }
    `,scrollbarWithScrollIndicators:t.iv`
      .scrollbar-view {
        position: static !important;
      }
    `});try{y.displayName="CustomScrollbar",y.__docgenInfo={description:"Wraps component into <Scrollbars> component from `react-custom-scrollbars`",displayName:"CustomScrollbar",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},testId:{defaultValue:null,description:"",name:"testId",required:!1,type:{name:"string"}},autoHide:{defaultValue:{value:"false"},description:"",name:"autoHide",required:!1,type:{name:"boolean"}},autoHideTimeout:{defaultValue:{value:"200"},description:"",name:"autoHideTimeout",required:!1,type:{name:"number"}},autoHeightMax:{defaultValue:{value:"100%"},description:"",name:"autoHeightMax",required:!1,type:{name:"string"}},hideTracksWhenNotNeeded:{defaultValue:{value:"false"},description:"",name:"hideTracksWhenNotNeeded",required:!1,type:{name:"boolean"}},hideHorizontalTrack:{defaultValue:null,description:"",name:"hideHorizontalTrack",required:!1,type:{name:"boolean"}},hideVerticalTrack:{defaultValue:null,description:"",name:"hideVerticalTrack",required:!1,type:{name:"boolean"}},scrollRefCallback:{defaultValue:null,description:"",name:"scrollRefCallback",required:!1,type:{name:"((instance: HTMLDivElement | null) => void)"}},scrollTop:{defaultValue:null,description:"",name:"scrollTop",required:!1,type:{name:"number"}},setScrollTop:{defaultValue:null,description:"",name:"setScrollTop",required:!1,type:{name:"((position: positionValues) => void)"}},showScrollIndicators:{defaultValue:{value:"false"},description:"",name:"showScrollIndicators",required:!1,type:{name:"boolean"}},autoHeightMin:{defaultValue:{value:"0"},description:"",name:"autoHeightMin",required:!1,type:{name:"string | number"}},updateAfterMountMs:{defaultValue:null,description:"",name:"updateAfterMountMs",required:!1,type:{name:"number"}},onScroll:{defaultValue:null,description:"",name:"onScroll",required:!1,type:{name:"UIEventHandler<Element>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/CustomScrollbar/CustomScrollbar.tsx#CustomScrollbar"]={docgenInfo:y.__docgenInfo,name:"CustomScrollbar",path:"src/components/CustomScrollbar/CustomScrollbar.tsx#CustomScrollbar"})}catch(o){}},"./src/components/DateTimePickers/DatePicker/DatePicker.tsx":function(se,V,e){"use strict";e.d(V,{M:function(){return _}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-calendar-virtual-6c20028e3a/2/yarn/cache/react-calendar-npm-4.0.0-8f03cd673a-a470ea1eab.zip/node_modules/react-calendar/dist/esm/index.js"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx"),x=e("./src/components/Icon/Icon.tsx"),d=e("./src/components/DateTimePickers/TimeRangePicker/CalendarBody.tsx"),i=Object.defineProperty,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(g,v,y)=>v in g?i(g,v,{enumerable:!0,configurable:!0,writable:!0,value:y}):g[v]=y,w=(g,v)=>{for(var y in v||(v={}))E.call(v,y)&&m(g,y,v[y]);if(c)for(var y of c(v))O.call(v,y)&&m(g,y,v[y]);return g};const _=(0,n.memo)(g=>{const v=(0,l.wW)(b),{isOpen:y,onClose:h}=g;return y?n.createElement(f.L,{useCapture:!0,includeButtonPress:!1,onClick:h},n.createElement("div",{className:v.modal,"data-testid":"date-picker"},n.createElement(C,w({},g)))):null});_.displayName="DatePicker";const C=(0,n.memo)(({value:g,minDate:v,maxDate:y,onChange:h})=>{const s=(0,l.wW)(d.mg);return n.createElement(a.ZP,{className:s.body,tileClassName:s.title,value:g||new Date,minDate:v,maxDate:y,nextLabel:n.createElement(x.J,{name:"angle-right"}),prevLabel:n.createElement(x.J,{name:"angle-left"}),onChange:o=>{Array.isArray(o)||h(o)},locale:"en"})});C.displayName="Body";const b=g=>({modal:t.iv`
      z-index: ${g.zIndex.modal};
      position: absolute;
      box-shadow: ${g.shadows.z3};
      background-color: ${g.colors.background.primary};
      border: 1px solid ${g.colors.border.weak};
      border-radius: 2px 0 0 2px;

      button:disabled {
        color: ${g.colors.text.disabled};
      }
    `});try{_.displayName="DatePicker",_.__docgenInfo={description:"",displayName:"DatePicker",props:{isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!0,type:{name:"() => void"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: Date) => void"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"Date"}},minDate:{defaultValue:null,description:"",name:"minDate",required:!1,type:{name:"Date"}},maxDate:{defaultValue:null,description:"",name:"maxDate",required:!1,type:{name:"Date"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/DatePicker/DatePicker.tsx#DatePicker"]={docgenInfo:_.__docgenInfo,name:"DatePicker",path:"src/components/DateTimePickers/DatePicker/DatePicker.tsx#DatePicker"})}catch(g){}},"./src/components/DateTimePickers/TimeOfDayPicker.tsx":function(se,V,e){"use strict";e.d(V,{F:function(){return c},y:function(){return E}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/rc-time-picker-virtual-915362c357/2/yarn/cache/rc-time-picker-npm-3.7.3-0eb473aed2-9069ae590f.zip/node_modules/rc-time-picker/es/index.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),f=e("./src/themes/ThemeContext.tsx"),x=e("./src/components/Icon/Icon.tsx"),d=e("./src/themes/mixins.ts"),i=e("./src/components/Forms/commonStyles.ts");const c="time-of-day-picker-panel",E=({minuteStep:w=1,showHour:_=!0,showSeconds:C=!1,onChange:b,value:g,size:v="auto",disabled:y,disabledHours:h,disabledMinutes:s,disabledSeconds:o})=>{const r=(0,f.wW)(m);return a.createElement(n.Z,{className:(0,t.cx)((0,i.ht)()[v],r.input),popupClassName:(0,t.cx)(r.picker,c),defaultValue:(0,l.C_)(),onChange:u=>b((0,l.CQ)(u)),allowEmpty:!1,showSecond:C,value:(0,l.C_)(g),showHour:_,minuteStep:w,inputIcon:a.createElement(O,{wrapperStyle:r.caretWrapper}),disabled:y,disabledHours:h,disabledMinutes:s,disabledSeconds:o})},O=({wrapperStyle:w=""})=>a.createElement("div",{className:w},a.createElement(x.J,{name:"angle-down"})),m=w=>{const _=w.components.input.background,C=w.v1.palette.black,b=w.colors.background.secondary,g=w.shape.borderRadius(1),v=w.components.input.borderColor;return{caretWrapper:t.iv`
      position: absolute;
      right: 8px;
      top: 50%;
      transform: translateY(-50%);
      display: inline-block;
      text-align: right;
      color: ${w.colors.text.secondary};
    `,picker:t.iv`
      .rc-time-picker-panel-select {
        font-size: 14px;
        background-color: ${_};
        border-color: ${v};
        li {
          outline-width: 2px;
          &.rc-time-picker-panel-select-option-selected {
            background-color: inherit;
            border: 1px solid ${w.v1.palette.orange};
            border-radius: ${g};
          }

          &:hover {
            background: ${b};
          }

          &.rc-time-picker-panel-select-option-disabled {
            color: ${w.colors.action.disabledText};
          }
        }
      }

      .rc-time-picker-panel-inner {
        box-shadow: 0px 4px 4px ${C};
        background-color: ${_};
        border-color: ${v};
        border-radius: ${g};
        margin-top: 3px;

        .rc-time-picker-panel-input-wrap {
          margin-right: 2px;

          &,
          .rc-time-picker-panel-input {
            background-color: ${_};
            padding-top: 2px;
          }
        }

        .rc-time-picker-panel-combobox {
          display: flex;
        }
      }
    `,input:t.iv`
      .rc-time-picker-input {
        background-color: ${_};
        border-radius: ${g};
        border-color: ${v};
        height: ${w.spacing(4)};

        &:focus {
          ${(0,d.$l)(w)}
        }

        &:disabled {
          background-color: ${w.colors.action.disabledBackground};
          color: ${w.colors.action.disabledText};
          border: 1px solid ${w.colors.action.disabledBackground};
          &:focus {
            box-shadow: none;
          }
        }
      }
    `}};try{E.displayName="TimeOfDayPicker",E.__docgenInfo={description:"",displayName:"TimeOfDayPicker",props:{onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: DateTime) => void"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"DateTime"}},showHour:{defaultValue:{value:"true"},description:"",name:"showHour",required:!1,type:{name:"boolean"}},showSeconds:{defaultValue:{value:"false"},description:"",name:"showSeconds",required:!1,type:{name:"boolean"}},minuteStep:{defaultValue:{value:"1"},description:"",name:"minuteStep",required:!1,type:{name:"number"}},size:{defaultValue:{value:"auto"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"auto"'}]}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},disabledHours:{defaultValue:null,description:"",name:"disabledHours",required:!1,type:{name:"(() => number[])"}},disabledMinutes:{defaultValue:null,description:"",name:"disabledMinutes",required:!1,type:{name:"(() => number[])"}},disabledSeconds:{defaultValue:null,description:"",name:"disabledSeconds",required:!1,type:{name:"(() => number[])"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeOfDayPicker.tsx#TimeOfDayPicker"]={docgenInfo:E.__docgenInfo,name:"TimeOfDayPicker",path:"src/components/DateTimePickers/TimeOfDayPicker.tsx#TimeOfDayPicker"})}catch(w){}},"./src/components/DateTimePickers/TimeRangePicker.tsx":function(se,V,e){"use strict";e.d(V,{Xc:function(){return S},sU:function(){return M}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@react-aria-dialog-virtual-6e50988279/2/yarn/cache/@react-aria-dialog-npm-3.3.1-c100ba6958-ba924f07a7.zip/node_modules/@react-aria/dialog/dist/module.js"),a=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),l=e("../../.yarn/__virtual__/@react-aria-overlays-virtual-34e54d82d1/2/yarn/cache/@react-aria-overlays-npm-3.10.1-f232007f1a-b83ec155d3.zip/node_modules/@react-aria/overlays/dist/module.js"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),x=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),d=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formatter.ts"),i=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/timezones.ts"),c=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/rangeutil.ts"),E=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/datemath.ts"),O=e("../grafana-e2e-selectors/src/selectors/index.ts"),m=e("./src/themes/ThemeContext.tsx"),w=e("./src/utils/i18n.tsx"),_=e("./src/components/Button/ButtonGroup.tsx"),C=e("./src/components/Modal/getModalStyles.ts"),b=e("./src/components/ToolbarButton/ToolbarButton.tsx"),g=e("./src/components/Tooltip/Tooltip.tsx"),v=e("./src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx"),y=e("./src/components/DateTimePickers/options.ts"),h=Object.defineProperty,s=Object.getOwnPropertySymbols,o=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable,u=(K,F,$)=>F in K?h(K,F,{enumerable:!0,configurable:!0,writable:!0,value:$}):K[F]=$,p=(K,F)=>{for(var $ in F||(F={}))o.call(F,$)&&u(K,$,F[$]);if(s)for(var $ of s(F))r.call(F,$)&&u(K,$,F[$]);return K};function S(K){const[F,$]=(0,f.useState)(!1),{value:R,onMoveBackward:U,onMoveForward:H,onZoom:W,timeZone:oe,fiscalYearStartMonth:Q,timeSyncButton:P,isSynced:ae,history:q,onChangeTimeZone:Y,onChangeFiscalYearStartMonth:ve,hideQuickRanges:re,widthOverride:je,isOnCanvas:me}=K,ne=Ze=>{K.onChange(Ze),$(!1)},Z=Ze=>{Ze.stopPropagation(),Ze.preventDefault(),$(!F)},te=()=>{$(!1)},Pe=(0,f.createRef)(),{overlayProps:he,underlayProps:ie}=(0,l.Ir)({onClose:te,isDismissable:!0,isOpen:F},Pe),{dialogProps:Ce}=(0,n.R)({},Pe),Le=(0,m.l4)(),we=(0,m.wW)(T),{modalBackdrop:ue}=(0,C.J)(Le),Ie=(0,x.v9)(R.raw.from)||(0,x.v9)(R.raw.to),qe=ae?"active":me?"canvas":"default",Je=I(R,oe);return f.createElement(_.h,{className:we.container},Ie&&f.createElement(b.h,{"aria-label":(0,w.t)("time-picker.range-picker.backwards-time-aria-label","Move time range backwards"),variant:qe,onClick:U,icon:"angle-left",narrow:!0}),f.createElement(g.u,{content:f.createElement(D,{timeRange:R,timeZone:oe}),placement:"bottom",interactive:!0},f.createElement(b.h,{"data-testid":O.wl.components.TimePicker.openButton,"aria-label":(0,w.t)("time-picker.range-picker.current-time-selected","Time range selected: {{currentTimeRange}}",{currentTimeRange:Je}),"aria-controls":"TimePickerContent",onClick:Z,icon:"clock-nine",isOpen:F,variant:qe},f.createElement(M,p({},K)))),F&&f.createElement("div",null,f.createElement("div",p({role:"presentation",className:(0,t.cx)(ue,we.backdrop)},ie)),f.createElement(a.MT,{contain:!0,autoFocus:!0},f.createElement("section",p(p({className:we.content,ref:Pe},he),Ce),f.createElement(v.x,{timeZone:oe,fiscalYearStartMonth:Q,value:R,onChange:ne,quickOptions:y.r,history:q,showHistory:!0,widthOverride:je,onChangeTimeZone:Y,onChangeFiscalYearStartMonth:ve,hideQuickRanges:re})))),P,Ie&&f.createElement(b.h,{"aria-label":(0,w.t)("time-picker.range-picker.forwards-time-aria-label","Move time range forwards"),onClick:H,icon:"angle-right",narrow:!0,variant:qe}),f.createElement(g.u,{content:k,placement:"bottom"},f.createElement(b.h,{"aria-label":(0,w.t)("time-picker.range-picker.zoom-out-button","Zoom out time range"),onClick:W,icon:"search-minus",variant:qe})))}S.displayName="TimeRangePicker";const k=()=>f.createElement(f.Fragment,null,f.createElement(w.c,{i18nKey:"time-picker.range-picker.zoom-out-tooltip"},"Time range zoom out ",f.createElement("br",null)," CTRL+Z")),D=({timeRange:K,timeZone:F})=>{const $=(0,m.wW)(j);return f.createElement(f.Fragment,null,(0,d.dq)(K.from,{timeZone:F}),f.createElement("div",{className:"text-center"},f.createElement(w.c,{i18nKey:"time-picker.range-picker.to"},"to")),(0,d.dq)(K.to,{timeZone:F}),f.createElement("div",{className:"text-center"},f.createElement("span",{className:$.utc},(0,i.Vs)(F))))},M=(0,f.memo)(({hideText:K,value:F,timeZone:$})=>{const R=(0,m.wW)(j);return K?null:f.createElement("span",{className:R.container},f.createElement("span",null,I(F,$)),f.createElement("span",{className:R.utc},c.yW(F,$)))});M.displayName="TimePickerButtonLabel";const I=(K,F)=>{const $={to:E.fM(K.raw.to)?K.raw.to:K.to,from:E.fM(K.raw.from)?K.raw.from:K.from};return c.eu($,F)},T=K=>({container:t.iv`
      position: relative;
      display: flex;
      vertical-align: middle;
    `,backdrop:(0,t.iv)({display:"none",[K.breakpoints.down("sm")]:{display:"block"}}),content:(0,t.iv)({position:"absolute",right:0,top:"116%",zIndex:K.zIndex.dropdown,[K.breakpoints.down("sm")]:{position:"fixed",right:"50%",top:"50%",transform:"translate(50%, -50%)",zIndex:K.zIndex.modal}})}),j=K=>({container:t.iv`
      display: flex;
      align-items: center;
      white-space: nowrap;
    `,utc:t.iv`
      color: ${K.v1.palette.orange};
      font-size: ${K.typography.size.sm};
      padding-left: 6px;
      line-height: 28px;
      vertical-align: bottom;
      font-weight: ${K.typography.fontWeightMedium};
    `});try{S.displayName="TimeRangePicker",S.__docgenInfo={description:"",displayName:"TimeRangePicker",props:{hideText:{defaultValue:null,description:"",name:"hideText",required:!1,type:{name:"boolean"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"TimeRange"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},fiscalYearStartMonth:{defaultValue:null,description:"",name:"fiscalYearStartMonth",required:!1,type:{name:"number"}},timeSyncButton:{defaultValue:null,description:"",name:"timeSyncButton",required:!1,type:{name:"Element"}},isSynced:{defaultValue:null,description:"",name:"isSynced",required:!1,type:{name:"boolean"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(timeRange: TimeRange) => void"}},onChangeTimeZone:{defaultValue:null,description:"",name:"onChangeTimeZone",required:!0,type:{name:"(timeZone: string) => void"}},onChangeFiscalYearStartMonth:{defaultValue:null,description:"",name:"onChangeFiscalYearStartMonth",required:!1,type:{name:"((month: number) => void)"}},onMoveBackward:{defaultValue:null,description:"",name:"onMoveBackward",required:!0,type:{name:"() => void"}},onMoveForward:{defaultValue:null,description:"",name:"onMoveForward",required:!0,type:{name:"() => void"}},onZoom:{defaultValue:null,description:"",name:"onZoom",required:!0,type:{name:"() => void"}},history:{defaultValue:null,description:"",name:"history",required:!1,type:{name:"TimeRange[]"}},hideQuickRanges:{defaultValue:null,description:"",name:"hideQuickRanges",required:!1,type:{name:"boolean"}},widthOverride:{defaultValue:null,description:"",name:"widthOverride",required:!1,type:{name:"number"}},isOnCanvas:{defaultValue:null,description:"",name:"isOnCanvas",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker.tsx#TimeRangePicker"]={docgenInfo:S.__docgenInfo,name:"TimeRangePicker",path:"src/components/DateTimePickers/TimeRangePicker.tsx#TimeRangePicker"})}catch(K){}},"./src/components/DateTimePickers/TimeRangePicker/CalendarBody.tsx":function(se,V,e){"use strict";e.d(V,{mg:function(){return m},uT:function(){return i}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-calendar-virtual-6c20028e3a/2/yarn/cache/react-calendar-npm-4.0.0-8f03cd673a-a470ea1eab.zip/node_modules/react-calendar/dist/esm/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/parser.ts"),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/components/Icon/Icon.tsx");function i({onChange:w,from:_,to:C,timeZone:b}){const g=c(_,C),v=E(w,b),y=(0,x.wW)(m);return n.createElement(a.ZP,{selectRange:!0,next2Label:null,prev2Label:null,className:y.body,tileClassName:y.title,value:g,nextLabel:n.createElement(d.J,{name:"angle-right"}),prevLabel:n.createElement(d.J,{name:"angle-left"}),onChange:v,locale:"en"})}i.displayName="Body";function c(w,_,C=new Date){const b=w.toDate(),g=_.toDate(),v=(0,l.CQ)(b).isValid()?b:C,y=(0,l.CQ)(g).isValid()?g:C;return v>y?[y,v]:[v,y]}function E(w,_){return(0,n.useCallback)(C=>{if(!Array.isArray(C))return console.error("onCalendarChange: should be run in selectRange={true}");const b=(0,f.J)(O(C[0]),{timeZone:_}),g=(0,f.J)(O(C[1]),{timeZone:_});w(b,g)},[w,_])}function O(w){return[w.getFullYear(),w.getMonth(),w.getDate(),w.getHours(),w.getMinutes(),w.getSeconds()]}const m=w=>{const _=".react-calendar__tile--hasActive:not(.react-calendar__tile--range)";return{title:t.iv`
      color: ${w.colors.text.primary};
      background-color: ${w.colors.background.primary};
      font-size: ${w.typography.size.md};
      border: 1px solid transparent;

      &:hover {
        position: relative;
      }

      &:disabled {
        color: ${w.colors.action.disabledText};
      }
    `,body:t.iv`
      z-index: ${w.zIndex.modal};
      background-color: ${w.colors.background.primary};
      width: 268px;

      .react-calendar__navigation {
        display: flex;
      }

      .react-calendar__navigation__label,
      .react-calendar__navigation__arrow,
      .react-calendar__navigation {
        padding-top: 4px;
        background-color: inherit;
        color: ${w.colors.text.primary};
        border: 0;
        font-weight: ${w.typography.fontWeightMedium};
      }

      .react-calendar__month-view__weekdays {
        background-color: inherit;
        text-align: center;
        color: ${w.colors.primary.text};

        abbr {
          border: 0;
          text-decoration: none;
          cursor: default;
          display: block;
          padding: 4px 0 4px 0;
        }
      }

      .react-calendar__month-view__days {
        background-color: inherit;
      }

      .react-calendar__tile,
      .react-calendar__tile--now {
        margin-bottom: 4px;
        background-color: inherit;
        height: 26px;
      }

      .react-calendar__navigation__label,
      .react-calendar__navigation > button:focus,
      .time-picker-calendar-tile:focus {
        outline: 0;
      }

      ${_},
      .react-calendar__tile--active,
      .react-calendar__tile--active:hover {
        color: ${w.colors.primary.contrastText};
        font-weight: ${w.typography.fontWeightMedium};
        background: ${w.colors.primary.main};
        box-shadow: none;
        border: 0px;
      }

      .react-calendar__tile--rangeEnd,
      .react-calendar__tile--rangeStart {
        padding: 0;
        border: 0px;
        color: ${w.colors.primary.contrastText};
        font-weight: ${w.typography.fontWeightMedium};
        background: ${w.colors.primary.main};

        abbr {
          background-color: ${w.colors.primary.main};
          border-radius: 100px;
          display: block;
          padding-top: 2px;
          height: 26px;
        }
      }

      ${_},
      .react-calendar__tile--rangeStart {
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
      }

      ${_},
      .react-calendar__tile--rangeEnd {
        border-top-right-radius: 20px;
        border-bottom-right-radius: 20px;
      }
    `}};try{i.displayName="Body",i.__docgenInfo={description:"",displayName:"Body",props:{isOpen:{defaultValue:null,description:"",name:"isOpen",required:!0,type:{name:"boolean"}},from:{defaultValue:null,description:"",name:"from",required:!0,type:{name:"DateTime"}},to:{defaultValue:null,description:"",name:"to",required:!0,type:{name:"DateTime"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!0,type:{name:"() => void"}},onApply:{defaultValue:null,description:"",name:"onApply",required:!0,type:{name:"(e: FormEvent<HTMLButtonElement>) => void"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(from: DateTime, to: DateTime) => void"}},isFullscreen:{defaultValue:null,description:"",name:"isFullscreen",required:!0,type:{name:"boolean"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},isReversed:{defaultValue:null,description:"",name:"isReversed",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/CalendarBody.tsx#Body"]={docgenInfo:i.__docgenInfo,name:"Body",path:"src/components/DateTimePickers/TimeRangePicker/CalendarBody.tsx#Body"})}catch(w){}},"./src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx":function(se,V,e){"use strict";e.d(V,{x:function(){return xe}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/moment_wrapper.ts"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/rangeutil.ts"),f=e("../grafana-e2e-selectors/src/selectors/index.ts"),x=e("./src/components/FilterInput/FilterInput.tsx"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/themes/stylesFactory.ts"),c=e("./src/themes/mixins.ts"),E=e("./src/utils/i18n.tsx"),O=e("./src/components/CustomScrollbar/CustomScrollbar.tsx"),m=e("./src/components/Icon/Icon.tsx"),w=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),_=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/timezones.ts"),C=e("./src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx"),b=e("./src/components/Forms/Field.tsx"),g=e("./src/components/Select/Select.tsx"),v=e("./src/components/Button/Button.tsx"),y=e("./src/components/DateTimePickers/TimeZonePicker.tsx"),h=e("./src/components/DateTimePickers/TimeZonePicker/TimeZoneDescription.tsx"),s=e("./src/components/DateTimePickers/TimeZonePicker/TimeZoneOffset.tsx"),o=e("./src/components/DateTimePickers/TimeZonePicker/TimeZoneTitle.tsx"),r=e("./src/components/DateTimePickers/options.ts");const u=de=>{const{timeZone:Ee,fiscalYearStartMonth:ze,timestamp:le=Date.now(),onChangeTimeZone:ye,onChangeFiscalYearStartMonth:Se}=de,[Be,Xe]=(0,n.useState)(!1),[st,mt]=(0,n.useState)("tz"),rt=(0,n.useCallback)(gt=>{gt&&gt.stopPropagation(),Xe(!Be)},[Be,Xe]),lt=(0,d.l4)(),ft=p(lt);if(!(0,w.isString)(Ee))return null;const St=(0,_.Pr)(Ee,le);return St?n.createElement("div",null,n.createElement("section",{"aria-label":(0,E.t)("time-picker.footer.time-zone-selection","Time zone selection"),className:ft.container},n.createElement("div",{className:ft.timeZoneContainer},n.createElement("div",{className:ft.timeZone},n.createElement(o.d,{title:St.name}),n.createElement("div",{className:ft.spacer}),n.createElement(h.K,{info:St})),n.createElement(s.v,{timeZone:Ee,timestamp:le})),n.createElement("div",{className:ft.spacer}),n.createElement(v.zx,{variant:"secondary",onClick:rt,size:"sm"},n.createElement(E.c,{i18nKey:"time-picker.footer.change-settings-button"},"Change time settings"))),Be?n.createElement("div",{className:ft.editContainer},n.createElement("div",null,n.createElement(C.S,{value:st,options:[{label:(0,E.t)("time-picker.footer.time-zone-option","Time zone"),value:"tz"},{label:(0,E.t)("time-picker.footer.fiscal-year-option","Fiscal year"),value:"fy"}],onChange:mt})),st==="tz"?n.createElement("section",{"data-testid":f.wl.components.TimeZonePicker.containerV2,className:(0,t.cx)(ft.timeZoneContainer,ft.timeSettingContainer)},n.createElement(y.O,{includeInternal:!0,onChange:gt=>{rt(),(0,w.isString)(gt)&&ye(gt)},onBlur:rt})):n.createElement("section",{"aria-label":f.wl.components.TimeZonePicker.containerV2,className:(0,t.cx)(ft.timeZoneContainer,ft.timeSettingContainer)},n.createElement(b.g,{className:ft.fiscalYearField,label:(0,E.t)("time-picker.footer.fiscal-year-start","Fiscal year start month")},n.createElement(g.Ph,{value:ze,menuShouldPortal:!1,options:r.E,onChange:gt=>{var pt;Se&&Se((pt=gt.value)!=null?pt:0)}})))):null):null},p=(0,i.B)(de=>({container:t.iv`
      border-top: 1px solid ${de.colors.border.weak};
      padding: 11px;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
    `,editContainer:t.iv`
      border-top: 1px solid ${de.colors.border.weak};
      padding: 11px;
      justify-content: space-between;
      align-items: center;
      padding: 7px;
    `,spacer:t.iv`
      margin-left: 7px;
    `,timeSettingContainer:t.iv`
      padding-top: ${de.spacing(1)};
    `,fiscalYearField:t.iv`
      margin-bottom: 0px;
    `,timeZoneContainer:t.iv`
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      flex-grow: 1;
    `,timeZone:t.iv`
      display: flex;
      flex-direction: row;
      align-items: baseline;
      flex-grow: 1;
    `}));try{u.displayName="TimePickerFooter",u.__docgenInfo={description:"",displayName:"TimePickerFooter",props:{timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},fiscalYearStartMonth:{defaultValue:null,description:"",name:"fiscalYearStartMonth",required:!1,type:{name:"number"}},timestamp:{defaultValue:null,description:"",name:"timestamp",required:!1,type:{name:"number"}},onChangeTimeZone:{defaultValue:null,description:"",name:"onChangeTimeZone",required:!0,type:{name:"(timeZone: string) => void"}},onChangeFiscalYearStartMonth:{defaultValue:null,description:"",name:"onChangeFiscalYearStartMonth",required:!1,type:{name:"((month: number) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/TimePickerFooter.tsx#TimePickerFooter"]={docgenInfo:u.__docgenInfo,name:"TimePickerFooter",path:"src/components/DateTimePickers/TimeRangePicker/TimePickerFooter.tsx#TimePickerFooter"})}catch(de){}var S=e("./src/components/DateTimePickers/TimeRangePicker/TimePickerTitle.tsx"),k=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/parser.ts"),D=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formatter.ts"),M=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/datemath.ts"),I=e("./src/components/Tooltip/Tooltip.tsx"),T=e("./src/components/Input/Input.tsx"),j=e("../../.yarn/__virtual__/@react-aria-dialog-virtual-6e50988279/2/yarn/cache/@react-aria-dialog-npm-3.3.1-c100ba6958-ba924f07a7.zip/node_modules/@react-aria/dialog/dist/module.js"),K=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),F=e("../../.yarn/__virtual__/@react-aria-overlays-virtual-34e54d82d1/2/yarn/cache/@react-aria-overlays-npm-3.10.1-f232007f1a-b83ec155d3.zip/node_modules/@react-aria/overlays/dist/module.js"),$=e("./src/components/Modal/getModalStyles.ts"),R=e("./src/components/DateTimePickers/TimeRangePicker/CalendarBody.tsx");function U({onClose:de,onApply:Ee}){const ze=(0,d.wW)(H);return n.createElement("div",{className:ze.container},n.createElement(v.zx,{className:ze.apply,onClick:Ee},n.createElement(E.c,{i18nKey:"time-picker.calendar.apply-button"},"Apply time range")),n.createElement(v.zx,{variant:"secondary",onClick:de},n.createElement(E.c,{i18nKey:"time-picker.calendar.cancel-button"},"Cancel")))}U.displayName="Footer";const H=de=>({container:t.iv`
      background-color: ${de.colors.background.primary};
      display: flex;
      justify-content: center;
      padding: 10px;
      align-items: stretch;
    `,apply:t.iv`
      margin-right: 4px;
      width: 100%;
      justify-content: center;
    `});try{U.displayName="Footer",U.__docgenInfo={description:"",displayName:"Footer",props:{isOpen:{defaultValue:null,description:"",name:"isOpen",required:!0,type:{name:"boolean"}},from:{defaultValue:null,description:"",name:"from",required:!0,type:{name:"DateTime"}},to:{defaultValue:null,description:"",name:"to",required:!0,type:{name:"DateTime"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!0,type:{name:"() => void"}},onApply:{defaultValue:null,description:"",name:"onApply",required:!0,type:{name:"(e: FormEvent<HTMLButtonElement>) => void"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(from: DateTime, to: DateTime) => void"}},isFullscreen:{defaultValue:null,description:"",name:"isFullscreen",required:!0,type:{name:"boolean"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},isReversed:{defaultValue:null,description:"",name:"isReversed",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/CalendarFooter.tsx#Footer"]={docgenInfo:U.__docgenInfo,name:"Footer",path:"src/components/DateTimePickers/TimeRangePicker/CalendarFooter.tsx#Footer"})}catch(de){}function W({onClose:de}){const Ee=(0,d.wW)(oe);return n.createElement("div",{className:Ee.container},n.createElement(S.r,null,n.createElement(E.c,{i18nKey:"time-picker.calendar.select-time"},"Select a time range")),n.createElement(v.zx,{"aria-label":f.wl.components.TimePicker.calendar.closeButton,icon:"times",variant:"secondary",onClick:de}))}W.displayName="Header";const oe=de=>({container:t.iv`
      background-color: ${de.colors.background.primary};
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 7px;
    `});try{W.displayName="Header",W.__docgenInfo={description:"",displayName:"Header",props:{isOpen:{defaultValue:null,description:"",name:"isOpen",required:!0,type:{name:"boolean"}},from:{defaultValue:null,description:"",name:"from",required:!0,type:{name:"DateTime"}},to:{defaultValue:null,description:"",name:"to",required:!0,type:{name:"DateTime"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!0,type:{name:"() => void"}},onApply:{defaultValue:null,description:"",name:"onApply",required:!0,type:{name:"(e: FormEvent<HTMLButtonElement>) => void"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(from: DateTime, to: DateTime) => void"}},isFullscreen:{defaultValue:null,description:"",name:"isFullscreen",required:!0,type:{name:"boolean"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},isReversed:{defaultValue:null,description:"",name:"isReversed",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/CalendarHeader.tsx#Header"]={docgenInfo:W.__docgenInfo,name:"Header",path:"src/components/DateTimePickers/TimeRangePicker/CalendarHeader.tsx#Header"})}catch(de){}var Q=Object.defineProperty,P=Object.getOwnPropertySymbols,ae=Object.prototype.hasOwnProperty,q=Object.prototype.propertyIsEnumerable,Y=(de,Ee,ze)=>Ee in de?Q(de,Ee,{enumerable:!0,configurable:!0,writable:!0,value:ze}):de[Ee]=ze,ve=(de,Ee)=>{for(var ze in Ee||(Ee={}))ae.call(Ee,ze)&&Y(de,ze,Ee[ze]);if(P)for(var ze of P(Ee))q.call(Ee,ze)&&Y(de,ze,Ee[ze]);return de};const re=(de,Ee=!1)=>({container:t.iv`
      top: 0px;
      position: absolute;
      ${Ee?"left":"right"}: 544px;
      box-shadow: ${de.shadows.z3};
      background-color: ${de.colors.background.primary};
      z-index: -1;
      border: 1px solid ${de.colors.border.weak};
      border-radius: 2px 0 0 2px;

      &:after {
        display: block;
        background-color: ${de.colors.background.primary};
        width: 19px;
        height: 100%;
        content: ${Ee?"":" "};
        position: absolute;
        top: 0;
        right: -19px;
        border-left: 1px solid ${de.colors.border.weak};
      }
    `,modal:t.iv`
      box-shadow: ${de.shadows.z3};
      left: 50%;
      position: fixed;
      top: 50%;
      transform: translate(-50%, -50%);
      z-index: ${de.zIndex.modal};
    `,content:t.iv`
      margin: 0 auto;
      width: 268px;
    `});function je(de){const Ee=(0,d.l4)(),{modalBackdrop:ze}=(0,$.J)(Ee),le=re(Ee,de.isReversed),{isOpen:ye,isFullscreen:Se,onClose:Be}=de,Xe=n.createRef(),{dialogProps:st}=(0,j.R)({"aria-label":f.wl.components.TimePicker.calendar.label},Xe),{overlayProps:mt}=(0,F.Ir)({isDismissable:!0,isOpen:ye,onClose:Be},Xe);return ye?Se?n.createElement(K.MT,{contain:!0,restoreFocus:!0,autoFocus:!0},n.createElement("section",ve(ve({className:le.container,ref:Xe},mt),st),n.createElement(W,ve({},de)),n.createElement(R.uT,ve({},de)))):n.createElement(F.Xj,null,n.createElement("div",{className:ze}),n.createElement(K.MT,{contain:!0,autoFocus:!0,restoreFocus:!0},n.createElement("section",ve(ve({className:le.modal,ref:Xe},mt),st),n.createElement("div",{className:le.content,"aria-label":f.wl.components.TimePicker.calendar.label},n.createElement(W,ve({},de)),n.createElement(R.uT,ve({},de)),n.createElement(U,ve({},de)))))):null}var me=(0,n.memo)(je);je.displayName="TimePickerCalendar";try{je.displayName="TimePickerCalendar",je.__docgenInfo={description:"",displayName:"TimePickerCalendar",props:{isOpen:{defaultValue:null,description:"",name:"isOpen",required:!0,type:{name:"boolean"}},from:{defaultValue:null,description:"",name:"from",required:!0,type:{name:"DateTime"}},to:{defaultValue:null,description:"",name:"to",required:!0,type:{name:"DateTime"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!0,type:{name:"() => void"}},onApply:{defaultValue:null,description:"",name:"onApply",required:!0,type:{name:"(e: FormEvent<HTMLButtonElement>) => void"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(from: DateTime, to: DateTime) => void"}},isFullscreen:{defaultValue:null,description:"",name:"isFullscreen",required:!0,type:{name:"boolean"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},isReversed:{defaultValue:null,description:"",name:"isReversed",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/TimePickerCalendar.tsx#TimePickerCalendar"]={docgenInfo:je.__docgenInfo,name:"TimePickerCalendar",path:"src/components/DateTimePickers/TimeRangePicker/TimePickerCalendar.tsx#TimePickerCalendar"})}catch(de){}const ne={default:()=>(0,E.t)("time-picker.range-content.default-error",'Please enter a past date or "now"'),range:()=>(0,E.t)("time-picker.range-content.range-error",`"From" can't be after "To"`)},Z=de=>{const{value:Ee,isFullscreen:ze=!1,timeZone:le,onApply:ye,isReversed:Se,fiscalYearStartMonth:Be}=de,[Xe,st]=Pe(Ee.raw.from,Ee.raw.to,le),mt=(0,d.wW)(Ce),[rt,lt]=(0,n.useState)(Xe),[ft,St]=(0,n.useState)(st),[gt,pt]=(0,n.useState)(!1);(0,n.useEffect)(()=>{const[Gt,hn]=Pe(Ee.raw.from,Ee.raw.to,le);lt(Gt),St(hn)},[Ee.raw.from,Ee.raw.to,le]);const ut=(0,n.useCallback)(Gt=>{Gt.preventDefault(),pt(!0)},[pt]),Ot=(0,n.useCallback)(()=>{if(ft.invalid||rt.invalid)return;const Gt={from:rt.value,to:ft.value},hn=l.ix(Gt,le,Be);ye(hn)},[rt.invalid,rt.value,ye,le,ft.invalid,ft.value,Be]),Wt=(0,n.useCallback)((Gt,hn)=>{const[fn,Hn]=Pe(Gt,hn,le);lt(fn),St(Hn)},[le]),Ht=Gt=>{Gt.key==="Enter"&&Ot()},on=l.ix({from:"now/fy",to:"now/fy"},le,Be),un=(0,E.t)("time-picker.range-content.fiscal-year","Fiscal year"),mn=n.createElement("div",{className:mt.tooltip},l.kj(Ee)?n.createElement(I.u,{content:`${un}: ${on.from.format("MMM-DD")} - ${on.to.format("MMM-DD")}`},n.createElement(m.J,{name:"info-circle"})):null),wn=n.createElement(v.zx,{"aria-label":f.wl.components.TimePicker.calendar.openButton,icon:"calendar-alt",variant:"secondary",type:"button",onClick:ut});return n.createElement("div",null,n.createElement("div",{className:mt.fieldContainer},n.createElement(b.g,{label:(0,E.t)("time-picker.range-content.from-input","From"),invalid:rt.invalid,error:rt.errorMessage},n.createElement(T.I,{onClick:Gt=>Gt.stopPropagation(),onChange:Gt=>Wt(Gt.currentTarget.value,ft.value),addonAfter:wn,onKeyDown:Ht,"aria-label":f.wl.components.TimePicker.fromField,value:rt.value})),mn),n.createElement("div",{className:mt.fieldContainer},n.createElement(b.g,{label:(0,E.t)("time-picker.range-content.to-input","To"),invalid:ft.invalid,error:ft.errorMessage},n.createElement(T.I,{onClick:Gt=>Gt.stopPropagation(),onChange:Gt=>Wt(rt.value,Gt.currentTarget.value),addonAfter:wn,onKeyDown:Ht,"aria-label":f.wl.components.TimePicker.toField,value:ft.value})),mn),n.createElement(v.zx,{"data-testid":f.wl.components.TimePicker.applyTimeRange,type:"button",onClick:Ot},n.createElement(E.c,{i18nKey:"time-picker.range-content.apply-button"},"Apply time range")),n.createElement(me,{isFullscreen:ze,isOpen:gt,from:(0,k.J)(rt.value),to:(0,k.J)(ft.value),onApply:Ot,onClose:()=>pt(!1),onChange:Wt,timeZone:le,isReversed:Se}))};function te(de,Ee,ze){const le={from:de,to:Ee},ye=l.ix(le,ze);return!(ye.from.isSame(ye.to)||ye.from.isBefore(ye.to))}function Pe(de,Ee,ze){const le=he(de,ze),ye=he(Ee,ze),Se=!ie(le,!1,ze),Be=!ie(ye,!0,ze),Xe=te(le,ye,ze)&&!Be;return[{value:le,invalid:Se||Xe,errorMessage:Xe&&!Se?ne.range():ne.default()},{value:ye,invalid:Be,errorMessage:ne.default()}]}function he(de,Ee){return(0,a.v9)(de)?(0,D.dq)(de,{timeZone:Ee}):de}function ie(de,Ee,ze){return(0,a.v9)(de)?de.isValid():M.fM(de)?M.JY(de):(0,k.J)(de,{roundUp:Ee,timeZone:ze}).isValid()}function Ce(de){return{fieldContainer:t.iv`
      display: flex;
    `,tooltip:t.iv`
      padding-left: ${de.spacing(1)};
      padding-top: ${de.spacing(3)};
    `}}try{Z.displayName="TimeRangeContent",Z.__docgenInfo={description:"",displayName:"TimeRangeContent",props:{isFullscreen:{defaultValue:null,description:"",name:"isFullscreen",required:!0,type:{name:"boolean"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"TimeRange"}},onApply:{defaultValue:null,description:"",name:"onApply",required:!0,type:{name:"(range: TimeRange) => void"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},fiscalYearStartMonth:{defaultValue:null,description:"",name:"fiscalYearStartMonth",required:!1,type:{name:"number"}},roundup:{defaultValue:null,description:"",name:"roundup",required:!1,type:{name:"boolean"}},isReversed:{defaultValue:null,description:"",name:"isReversed",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/TimeRangeContent.tsx#TimeRangeContent"]={docgenInfo:Z.__docgenInfo,name:"TimeRangeContent",path:"src/components/DateTimePickers/TimeRangePicker/TimeRangeContent.tsx#TimeRangeContent"})}catch(de){}var Le=e("./src/components/DateTimePickers/TimeRangePicker/TimeRangeList.tsx");const we=(de,Ee)=>l.ix({from:de.from,to:de.to},Ee),ue=(de,Ee)=>{const ze=(0,D.dq)(de.from,{timeZone:Ee}),le=(0,D.dq)(de.to,{timeZone:Ee});return{from:ze,to:le,display:`${ze} to ${le}`}};var Ie=Object.defineProperty,qe=Object.defineProperties,Je=Object.getOwnPropertyDescriptors,Ze=Object.getOwnPropertySymbols,Oe=Object.prototype.hasOwnProperty,ce=Object.prototype.propertyIsEnumerable,pe=(de,Ee,ze)=>Ee in de?Ie(de,Ee,{enumerable:!0,configurable:!0,writable:!0,value:ze}):de[Ee]=ze,J=(de,Ee)=>{for(var ze in Ee||(Ee={}))Oe.call(Ee,ze)&&pe(de,ze,Ee[ze]);if(Ze)for(var ze of Ze(Ee))ce.call(Ee,ze)&&pe(de,ze,Ee[ze]);return de},L=(de,Ee)=>qe(de,Je(Ee));const fe=de=>{const{quickOptions:Ee=[],isReversed:ze,isFullscreen:le,hideQuickRanges:ye,timeZone:Se,fiscalYearStartMonth:Be,value:Xe,onChange:st,history:mt,showHistory:rt,className:lt,hideTimeZone:ft,onChangeTimeZone:St,onChangeFiscalYearStartMonth:gt}=de,pt=!(mt!=null&&mt.length),ut=le&&rt||!le&&(rt&&!pt||!ye),Ot=(0,d.l4)(),Wt=wt(Ot,ze,ye,ut,le),Ht=it(mt,Se),on=_t(Xe.raw,Ee),[un,mn]=(0,n.useState)(""),wn=Ee.filter(hn=>hn.display.toLowerCase().includes(un.toLowerCase())),Gt=hn=>st(we(hn));return n.createElement("div",{id:"TimePickerContent",className:(0,t.cx)(Wt.container,lt)},n.createElement("div",{className:Wt.body},(!le||!ye)&&n.createElement("div",{className:Wt.rightSide},n.createElement("div",{className:Wt.timeRangeFilter},n.createElement(x.H,{width:0,autoFocus:!0,value:un,onChange:mn,placeholder:(0,E.t)("time-picker.content.filter-placeholder","Search quick ranges")})),n.createElement(O.$,null,!le&&n.createElement(We,L(J({},de),{historyOptions:Ht})),!ye&&n.createElement(Le.V,{options:wn,onChange:Gt,value:on}))),le&&n.createElement("div",{className:Wt.leftSide},n.createElement(Ue,L(J({},de),{historyOptions:Ht})))),!ft&&le&&n.createElement(u,{timeZone:Se,fiscalYearStartMonth:Be,onChangeTimeZone:St,onChangeFiscalYearStartMonth:gt}))},xe=de=>{const{widthOverride:Ee}=de,ze=(0,d.l4)(),le=(Ee||window.innerWidth)>=ze.breakpoints.values.lg;return n.createElement(fe,L(J({},de),{isFullscreen:le}))},We=de=>{const{value:Ee,hideQuickRanges:ze,onChange:le,timeZone:ye,historyOptions:Se=[],showHistory:Be}=de,Xe=(0,d.l4)(),st=ee(Xe),mt=(0,a.v9)(Ee.raw.from)||(0,a.v9)(Ee.raw.to),[rt,lt]=(0,n.useState)(!mt),ft=ze?!1:rt,St=gt=>le(we(gt,ye));return n.createElement("fieldset",null,n.createElement("div",{className:st.header},n.createElement("button",{type:"button",className:st.expandButton,onClick:()=>{ze||lt(!ft)},"data-testid":f.wl.components.TimePicker.absoluteTimeRangeTitle,"aria-expanded":!ft,"aria-controls":"expanded-timerange"},n.createElement(S.r,null,n.createElement(E.c,{i18nKey:"time-picker.absolute.title"},"Absolute time range")),!ze&&n.createElement(m.J,{name:ft?"angle-down":"angle-up"}))),!ft&&n.createElement("div",{className:st.body,id:"expanded-timerange"},n.createElement("div",{className:st.form},n.createElement(Z,{value:Ee,onApply:le,timeZone:ye,isFullscreen:!1})),Be&&n.createElement(Le.V,{title:(0,E.t)("time-picker.absolute.recent-title","Recently used absolute ranges"),options:Se,onChange:St,placeholderEmpty:null})))},Ue=de=>{const{onChange:Ee,value:ze,timeZone:le,fiscalYearStartMonth:ye,isReversed:Se,historyOptions:Be}=de,Xe=(0,d.l4)(),st=_e(Xe,de.hideQuickRanges),mt=rt=>Ee(we(rt,le));return n.createElement(n.Fragment,null,n.createElement("div",{className:st.container},n.createElement("div",{className:st.title,"data-testid":f.wl.components.TimePicker.absoluteTimeRangeTitle},n.createElement(S.r,null,n.createElement(E.c,{i18nKey:"time-picker.absolute.title"},"Absolute time range"))),n.createElement(Z,{value:ze,timeZone:le,fiscalYearStartMonth:ye,onApply:Ee,isFullscreen:!0,isReversed:Se})),de.showHistory&&n.createElement("div",{className:st.recent},n.createElement(Le.V,{title:(0,E.t)("time-picker.absolute.recent-title","Recently used absolute ranges"),options:Be||[],onChange:mt,placeholderEmpty:n.createElement(at,null)})))},at=(0,n.memo)(()=>{const de=(0,d.l4)(),Ee=ge(de);return n.createElement("div",{className:Ee.container},n.createElement(E.c,{i18nKey:"time-picker.content.empty-recent-list"},n.createElement("div",null,n.createElement("span",null,"It looks like you haven't used this time picker before. As soon as you enter some time intervals, recently used intervals will appear here.")),n.createElement("div",null,n.createElement("a",{className:Ee.link,href:"https://grafana.com/docs/grafana/latest/dashboards/time-range-controls",target:"_new"},"Read the documentation"),n.createElement("span",null," to find out more about how to enter custom time ranges."))))});function it(de,Ee){return!Array.isArray(de)||de.length===0?[]:de.map(ze=>ue(ze,Ee))}at.displayName="EmptyRecentList";const _t=(de,Ee)=>(0,n.useMemo)(()=>{if(!!l.s3(de))return Ee.find(ze=>ze.from===de.from&&ze.to===de.to)},[de,Ee]),wt=(0,i.B)((de,Ee,ze,le,ye)=>({container:t.iv`
      background: ${de.colors.background.primary};
      box-shadow: ${de.shadows.z3};
      width: ${ye?"546px":"262px"};
      border-radius: 2px;
      border: 1px solid ${de.colors.border.weak};
      ${Ee?"left":"right"}: 0;
    `,body:t.iv`
      display: flex;
      flex-direction: row-reverse;
      height: ${le?"381px":"217px"};
    `,leftSide:t.iv`
      display: flex;
      flex-direction: column;
      border-right: ${Ee?"none":`1px solid ${de.colors.border.weak}`};
      width: ${ze?"100%":"60%"};
      overflow: hidden;
      order: ${Ee?1:0};
    `,rightSide:t.iv`
      width: ${ye?"40%":"100%"}; !important;
      border-right: ${Ee?`1px solid ${de.colors.border.weak}`:"none"};
      display: flex;
      flex-direction: column;
    `,timeRangeFilter:t.iv`
      padding: ${de.spacing(1)};
    `,spacing:t.iv`
      margin-top: 16px;
    `})),ee=(0,i.B)(de=>({header:t.iv`
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      border-bottom: 1px solid ${de.colors.border.weak};
      padding: 7px 9px 7px 9px;
    `,expandButton:t.iv`
      background-color: transparent;
      border: none;
      display: flex;
      width: 100%;

      &:focus-visible {
        ${(0,c.SV)(de)}
      }
    `,body:t.iv`
      border-bottom: 1px solid ${de.colors.border.weak};
    `,form:t.iv`
      padding: 7px 9px 7px 9px;
    `})),_e=(0,i.B)((de,Ee)=>({container:t.iv`
      padding-top: 9px;
      padding-left: 11px;
      padding-right: ${Ee?"11px":"20%"};
    `,title:t.iv`
      margin-bottom: 11px;
    `,recent:t.iv`
      flex-grow: 1;
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      padding-top: ${de.spacing(1)};
    `})),ge=(0,i.B)(de=>({container:t.iv`
      padding: 12px;
      margin: 12px;

      a,
      span {
        font-size: 13px;
      }\
    `,link:t.iv`
      color: ${de.colors.text.link};
    `}));try{at.displayName="EmptyRecentList",at.__docgenInfo={description:"",displayName:"EmptyRecentList",props:{isFullscreen:{defaultValue:null,description:"",name:"isFullscreen",required:!0,type:{name:"boolean"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"TimeRange"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(timeRange: TimeRange) => void"}},onChangeTimeZone:{defaultValue:null,description:"",name:"onChangeTimeZone",required:!0,type:{name:"(timeZone: string) => void"}},onChangeFiscalYearStartMonth:{defaultValue:null,description:"",name:"onChangeFiscalYearStartMonth",required:!1,type:{name:"((month: number) => void)"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!1,type:{name:"string"}},fiscalYearStartMonth:{defaultValue:null,description:"",name:"fiscalYearStartMonth",required:!1,type:{name:"number"}},quickOptions:{defaultValue:null,description:"",name:"quickOptions",required:!1,type:{name:"TimeOption[]"}},history:{defaultValue:null,description:"",name:"history",required:!1,type:{name:"TimeRange[]"}},showHistory:{defaultValue:null,description:"",name:"showHistory",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},hideTimeZone:{defaultValue:null,description:"",name:"hideTimeZone",required:!1,type:{name:"boolean"}},isReversed:{defaultValue:null,description:"Reverse the order of relative and absolute range pickers. Used to left align the picker in forms",name:"isReversed",required:!1,type:{name:"boolean"}},hideQuickRanges:{defaultValue:null,description:"",name:"hideQuickRanges",required:!1,type:{name:"boolean"}},widthOverride:{defaultValue:null,description:"",name:"widthOverride",required:!1,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx#EmptyRecentList"]={docgenInfo:at.__docgenInfo,name:"EmptyRecentList",path:"src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx#EmptyRecentList"})}catch(de){}},"./src/components/DateTimePickers/TimeRangePicker/TimePickerTitle.tsx":function(se,V,e){"use strict";e.d(V,{r:function(){return f}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx");const l=x=>({text:t.iv`
      font-size: ${x.typography.size.md};
      font-weight: ${x.typography.fontWeightMedium};
      color: ${x.colors.text.primary};
      margin: 0;
      display: flex;
    `}),f=(0,n.memo)(({children:x})=>{const d=(0,a.wW)(l);return n.createElement("h3",{className:d.text},x)});f.displayName="TimePickerTitle";try{f.displayName="TimePickerTitle",f.__docgenInfo={description:"",displayName:"TimePickerTitle",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/TimePickerTitle.tsx#TimePickerTitle"]={docgenInfo:f.__docgenInfo,name:"TimePickerTitle",path:"src/components/DateTimePickers/TimeRangePicker/TimePickerTitle.tsx#TimePickerTitle"})}catch(x){}},"./src/components/DateTimePickers/TimeRangePicker/TimeRangeList.tsx":function(se,V,e){"use strict";e.d(V,{V:function(){return y}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/stylesFactory.ts"),l=e("./src/utils/i18n.tsx"),f=e("./src/components/DateTimePickers/TimeRangePicker/TimePickerTitle.tsx"),x=e("../../../yarn/cache/uuid-npm-9.0.0-46c41e3e43-8dd2c83c43.zip/node_modules/uuid/dist/esm-browser/v4.js"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/themes/mixins.ts");const c=r=>({container:t.iv`
      display: flex;
      align-items: center;
      flex-direction: row-reverse;
      justify-content: space-between;
    `,selected:t.iv`
      background: ${r.colors.action.selected};
      font-weight: ${r.typography.fontWeightMedium};
    `,radio:t.iv`
      opacity: 0;
      width: 0 !important;

      &:focus-visible + label {
        ${(0,i.SV)(r)};
      }
    `,label:t.iv`
      cursor: pointer;
      flex: 1;
      padding: 7px 9px 7px 9px;

      &:hover {
        background: ${r.colors.action.hover};
        cursor: pointer;
      }
    `}),E=(0,n.memo)(({value:r,onSelect:u,selected:p=!1,name:S})=>{const k=(0,d.wW)(c),D=(0,x.Z)();return n.createElement("li",{className:(0,t.cx)(k.container,p&&k.selected)},n.createElement("input",{className:k.radio,checked:p,name:S,type:"checkbox",id:D,onChange:()=>u(r)}),n.createElement("label",{className:k.label,htmlFor:D},r.display))});E.displayName="TimeRangeOption";try{E.displayName="TimeRangeOption",E.__docgenInfo={description:"",displayName:"TimeRangeOption",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"TimeOption"}},selected:{defaultValue:null,description:"",name:"selected",required:!1,type:{name:"boolean"}},onSelect:{defaultValue:null,description:"",name:"onSelect",required:!0,type:{name:"(option: TimeOption) => void"}},name:{defaultValue:null,description:"Input identifier. This should be the same for all options in a group.",name:"name",required:!0,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/TimeRangeOption.tsx#TimeRangeOption"]={docgenInfo:E.__docgenInfo,name:"TimeRangeOption",path:"src/components/DateTimePickers/TimeRangePicker/TimeRangeOption.tsx#TimeRangeOption"})}catch(r){}var O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(r,u,p)=>u in r?O(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,b=(r,u)=>{for(var p in u||(u={}))w.call(u,p)&&C(r,p,u[p]);if(m)for(var p of m(u))_.call(u,p)&&C(r,p,u[p]);return r};const g=(0,a.B)(()=>({title:t.iv`
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 8px 16px 5px 9px;
    `})),v=(0,a.B)(()=>({grow:t.iv`
      flex-grow: 1;
      align-items: flex-start;
    `})),y=r=>{const u=g(),{title:p,options:S,placeholderEmpty:k}=r;return typeof k!="undefined"&&S.length<=0?n.createElement(n.Fragment,null,k):p?n.createElement("section",{"aria-label":p},n.createElement("fieldset",null,n.createElement("div",{className:u.title},n.createElement(f.r,null,p)),n.createElement(h,b({},r)))):n.createElement(h,b({},r))},h=({options:r,value:u,onChange:p,title:S})=>{const k=v();return n.createElement(n.Fragment,null,n.createElement("ul",{"aria-roledescription":(0,l.t)("time-picker.time-range.aria-role","Time range selection")},r.map((D,M)=>n.createElement(E,{key:s(D,M),value:D,selected:o(D,u),onSelect:p,name:S!=null?S:(0,l.t)("time-picker.time-range.default-title","Time ranges")}))),n.createElement("div",{className:k.grow}))};function s(r,u){return`${r.from}-${r.to}-${u}`}function o(r,u){return!u||!r?!1:u.from===r.from&&u.to===r.to}try{y.displayName="TimeRangeList",y.__docgenInfo={description:"",displayName:"TimeRangeList",props:{title:{defaultValue:null,description:"",name:"title",required:!1,type:{name:"string"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"TimeOption[]"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"TimeOption"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(option: TimeOption) => void"}},placeholderEmpty:{defaultValue:null,description:"",name:"placeholderEmpty",required:!1,type:{name:"ReactNode"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeRangePicker/TimeRangeList.tsx#TimeRangeList"]={docgenInfo:y.__docgenInfo,name:"TimeRangeList",path:"src/components/DateTimePickers/TimeRangePicker/TimeRangeList.tsx#TimeRangeList"})}catch(r){}},"./src/components/DateTimePickers/TimeZonePicker.tsx":function(se,V,e){"use strict";e.d(V,{O:function(){return D}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/timezones.ts"),l=e("./src/utils/i18n.tsx"),f=e("./src/components/Select/Select.tsx"),x=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),d=e("./src/themes/ThemeContext.tsx");const i=F=>{const{children:$,label:R}=F,U=(0,d.wW)(c);return R?n.createElement("div",null,n.createElement("div",{className:U.header},n.createElement("span",{className:U.label},R)),$):n.createElement("div",null,$)},c=F=>({header:x.iv`
      padding: 7px 10px;
      width: 100%;
      border-top: 1px solid ${F.colors.border.weak};
      text-transform: capitalize;
    `,label:x.iv`
      font-size: ${F.typography.size.sm};
      color: ${F.colors.text.secondary};
      font-weight: ${F.typography.fontWeightMedium};
    `});try{i.displayName="TimeZoneGroup",i.__docgenInfo={description:"",displayName:"TimeZoneGroup",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"string | undefined"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeZonePicker/TimeZoneGroup.tsx#TimeZoneGroup"]={docgenInfo:i.__docgenInfo,name:"TimeZoneGroup",path:"src/components/DateTimePickers/TimeZonePicker/TimeZoneGroup.tsx#TimeZoneGroup"})}catch(F){}var E=e("./src/components/DateTimePickers/TimeZonePicker/TimeZoneOffset.tsx"),O=e("./src/themes/stylesFactory.ts"),m=e("./src/components/Icon/Icon.tsx"),w=e("./src/components/DateTimePickers/TimeZonePicker/TimeZoneDescription.tsx"),_=e("./src/components/DateTimePickers/TimeZonePicker/TimeZoneTitle.tsx"),C=Object.defineProperty,b=Object.defineProperties,g=Object.getOwnPropertyDescriptors,v=Object.getOwnPropertySymbols,y=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,s=(F,$,R)=>$ in F?C(F,$,{enumerable:!0,configurable:!0,writable:!0,value:R}):F[$]=R,o=(F,$)=>{for(var R in $||($={}))y.call($,R)&&s(F,R,$[R]);if(v)for(var R of v($))h.call($,R)&&s(F,R,$[R]);return F},r=(F,$)=>b(F,g($));const u="tz-utc-offset",p=F=>{const{children:$,innerProps:R,innerRef:U,data:H,isSelected:W,isFocused:oe}=F,Q=(0,d.l4)(),P=k(Q),ae=Date.now(),q=(0,x.cx)(P.container,oe&&P.containerFocused);if(!(0,t.isString)(H.value))return null;const Y=(0,a.Pr)(H.value,ae);return n.createElement("div",r(o({className:q},R),{ref:U,"aria-label":"Select option"}),n.createElement("div",{className:(0,x.cx)(P.leftColumn,P.row)},n.createElement("div",{className:(0,x.cx)(P.leftColumn,P.wideRow)},n.createElement(_.d,{title:$}),n.createElement("div",{className:P.spacer}),n.createElement(w.K,{info:Y})),n.createElement("div",{className:P.rightColumn},n.createElement(E.v,{timeZone:(Y==null?void 0:Y.ianaName)||H.value,timestamp:ae,className:u}),W&&n.createElement("span",null,n.createElement(m.J,{name:"check"})))))},S=F=>{const{children:$,innerProps:R,innerRef:U,data:H,isSelected:W,isFocused:oe}=F,Q=(0,d.l4)(),P=k(Q),ae=Date.now(),q=(0,x.cx)(P.container,oe&&P.containerFocused);if(!(0,t.isString)(H.value))return null;const Y=(0,a.Pr)(H.value,ae);return n.createElement("div",r(o({className:q},R),{ref:U,"aria-label":"Select option"}),n.createElement("div",{className:P.body},n.createElement("div",{className:P.row},n.createElement("div",{className:P.leftColumn},n.createElement(_.d,{title:$})),n.createElement("div",{className:P.rightColumn},W&&n.createElement("span",null,n.createElement(m.J,{name:"check"})))),n.createElement("div",{className:P.row},n.createElement("div",{className:P.leftColumn},n.createElement(w.K,{info:Y})),n.createElement("div",{className:P.rightColumn},n.createElement(E.v,{timestamp:ae,timeZone:(Y==null?void 0:Y.ianaName)||H.value,className:u})))))},k=(0,O.B)(F=>({container:x.iv`
      display: flex;
      align-items: center;
      flex-direction: row;
      flex-shrink: 0;
      white-space: nowrap;
      cursor: pointer;
      padding: 6px 8px 4px;

      &:hover {
        background: ${F.colors.action.hover};
      }
    `,containerFocused:x.iv`
      background: ${F.colors.action.hover};
    `,body:x.iv`
      display: flex;
      font-weight: ${F.typography.fontWeightMedium};
      flex-direction: column;
      flex-grow: 1;
    `,row:x.iv`
      display: flex;
      flex-direction: row;
    `,leftColumn:x.iv`
      flex-grow: 1;
      text-overflow: ellipsis;
    `,rightColumn:x.iv`
      justify-content: flex-end;
      align-items: center;
    `,wideRow:x.iv`
      display: flex;
      flex-direction: row;
      align-items: baseline;
    `,spacer:x.iv`
      margin-left: 6px;
    `}));try{p.displayName="WideTimeZoneOption",p.__docgenInfo={description:"",displayName:"WideTimeZoneOption",props:{isFocused:{defaultValue:null,description:"",name:"isFocused",required:!0,type:{name:"boolean"}},isSelected:{defaultValue:null,description:"",name:"isSelected",required:!0,type:{name:"boolean"}},innerProps:{defaultValue:null,description:"",name:"innerProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},innerRef:{defaultValue:null,description:"",name:"innerRef",required:!0,type:{name:"(instance: HTMLDivElement | null) => void"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"SelectableZone"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeZonePicker/TimeZoneOption.tsx#WideTimeZoneOption"]={docgenInfo:p.__docgenInfo,name:"WideTimeZoneOption",path:"src/components/DateTimePickers/TimeZonePicker/TimeZoneOption.tsx#WideTimeZoneOption"})}catch(F){}try{S.displayName="CompactTimeZoneOption",S.__docgenInfo={description:"",displayName:"CompactTimeZoneOption",props:{isFocused:{defaultValue:null,description:"",name:"isFocused",required:!0,type:{name:"boolean"}},isSelected:{defaultValue:null,description:"",name:"isSelected",required:!0,type:{name:"boolean"}},innerProps:{defaultValue:null,description:"",name:"innerProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}},innerRef:{defaultValue:null,description:"",name:"innerRef",required:!0,type:{name:"(instance: HTMLDivElement | null) => void"}},data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"SelectableZone"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeZonePicker/TimeZoneOption.tsx#CompactTimeZoneOption"]={docgenInfo:S.__docgenInfo,name:"CompactTimeZoneOption",path:"src/components/DateTimePickers/TimeZonePicker/TimeZoneOption.tsx#CompactTimeZoneOption"})}catch(F){}const D=F=>{const{onChange:$,width:R,autoFocus:U=!1,onBlur:H,value:W,includeInternal:oe=!1,disabled:Q=!1,inputId:P}=F,ae=M(oe),q=I(ae,W),Y=j(),ve=R&&R<=45?S:p,re=(0,n.useCallback)(je=>{if(!je||!(0,t.isString)(je.value))return $(W);$(je.value)},[$,W]);return n.createElement(f.Ph,{inputId:P,value:q,placeholder:(0,l.t)("time-picker.zone.select-search-input","Type to search (country, city, abbreviation)"),autoFocus:U,menuShouldPortal:!1,openMenuOnFocus:!0,width:R,filterOption:Y,options:ae,onChange:re,onBlur:H,components:{Option:ve,Group:i},disabled:Q,"aria-label":(0,l.t)("time-picker.zone.select-aria-label","Time zone picker")})},M=F=>{const $=Date.now();return(0,a.$8)(F).map(U=>{const H=U.zones.reduce((W,oe)=>{const Q=(0,a.Pr)(oe,$);return Q&&W.push({label:Q.name,value:Q.zone,searchIndex:K(Q,$)}),W},[]);return{label:U.name,options:H}})},I=(F,$)=>(0,n.useMemo)(()=>{if($===void 0)return;const R=(0,t.toLower)($),U=F.find(H=>H.label?R.startsWith((0,t.toLower)(H.label)):T(R));return U==null?void 0:U.options.find(H=>(0,t.isEmpty)(R)?H.value===a.RQ.default:(0,t.toLower)(H.value)===R)},[F,$]),T=F=>{switch(F){case a.RQ.default:case a.RQ.localBrowserTime:case a.RQ.utc:return!0;default:return!1}},j=()=>(0,n.useCallback)((F,$)=>!$||!F.data||!F.data.searchIndex?!0:F.data.searchIndex.indexOf((0,t.toLower)($))>-1,[]),K=(F,$)=>{const R=[(0,t.toLower)(F.name),(0,t.toLower)(F.abbreviation),(0,t.toLower)((0,E.k)($,F.zone))];for(const U of F.countries)R.push((0,t.toLower)(U.name)),R.push((0,t.toLower)(U.code));return R.join("|")};try{D.displayName="TimeZonePicker",D.__docgenInfo={description:"",displayName:"TimeZonePicker",props:{onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(timeZone?: string | undefined) => void"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"string"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"number"}},autoFocus:{defaultValue:null,description:"",name:"autoFocus",required:!1,type:{name:"boolean"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},includeInternal:{defaultValue:null,description:"",name:"includeInternal",required:!1,type:{name:"boolean | InternalTimeZones[]"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"",name:"inputId",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeZonePicker.tsx#TimeZonePicker"]={docgenInfo:D.__docgenInfo,name:"TimeZonePicker",path:"src/components/DateTimePickers/TimeZonePicker.tsx#TimeZonePicker"})}catch(F){}},"./src/components/DateTimePickers/TimeZonePicker/TimeZoneDescription.tsx":function(se,V,e){"use strict";e.d(V,{K:function(){return l}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx");const l=({info:d})=>{const i=(0,a.wW)(x),c=f(d);return d?n.createElement("div",{className:i.description},c):null},f=d=>(0,n.useMemo)(()=>{const i=[];if(!d)return"";if(d.countries.length>0){const c=d.countries[0];i.push(c.name)}return d.abbreviation&&i.push(d.abbreviation),i.join(", ")},[d]),x=d=>({description:t.iv`
      font-weight: normal;
      font-size: ${d.typography.size.sm};
      color: ${d.colors.text.secondary};
      white-space: normal;
      text-overflow: ellipsis;
    `});try{l.displayName="TimeZoneDescription",l.__docgenInfo={description:"",displayName:"TimeZoneDescription",props:{info:{defaultValue:null,description:"",name:"info",required:!1,type:{name:"TimeZoneInfo"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeZonePicker/TimeZoneDescription.tsx#TimeZoneDescription"]={docgenInfo:l.__docgenInfo,name:"TimeZoneDescription",path:"src/components/DateTimePickers/TimeZonePicker/TimeZoneDescription.tsx#TimeZoneDescription"})}catch(d){}},"./src/components/DateTimePickers/TimeZonePicker/TimeZoneOffset.tsx":function(se,V,e){"use strict";e.d(V,{k:function(){return i},v:function(){return d}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),a=e.n(n),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),f=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formatter.ts"),x=e("./src/themes/ThemeContext.tsx");const d=E=>{const{timestamp:O,timeZone:m,className:w}=E,_=(0,x.wW)(c);return(0,n.isString)(m)?l.createElement(l.Fragment,null,l.createElement("span",{className:(0,t.cx)(_.offset,w)},i(O,m))):null},i=(E,O)=>{const m=(0,f.dq)(E,{timeZone:O,format:"Z"});return m==="+00:00"?"UTC":`UTC${m}`},c=E=>{const O=t.iv`
    font-weight: normal;
    font-size: ${E.typography.size.sm};
    color: ${E.colors.text.secondary};
    white-space: normal;
  `;return{offset:t.iv`
      ${O};
      color: ${E.colors.text.primary};
      background: ${E.colors.background.secondary};
      padding: 2px 5px;
      border-radius: 2px;
      margin-left: 4px;
    `}};try{d.displayName="TimeZoneOffset",d.__docgenInfo={description:"",displayName:"TimeZoneOffset",props:{timestamp:{defaultValue:null,description:"",name:"timestamp",required:!0,type:{name:"number"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!0,type:{name:"string | undefined"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeZonePicker/TimeZoneOffset.tsx#TimeZoneOffset"]={docgenInfo:d.__docgenInfo,name:"TimeZoneOffset",path:"src/components/DateTimePickers/TimeZonePicker/TimeZoneOffset.tsx#TimeZoneOffset"})}catch(E){}},"./src/components/DateTimePickers/TimeZonePicker/TimeZoneTitle.tsx":function(se,V,e){"use strict";e.d(V,{d:function(){return l}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx");const l=({title:x})=>{const d=(0,a.wW)(f);return x?n.createElement("span",{className:d.title},x):null},f=x=>({title:t.iv`
      font-weight: ${x.typography.fontWeightRegular};
      text-overflow: ellipsis;
    `});try{l.displayName="TimeZoneTitle",l.__docgenInfo={description:"",displayName:"TimeZoneTitle",props:{title:{defaultValue:null,description:"",name:"title",required:!0,type:{name:"ReactNode"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/DateTimePickers/TimeZonePicker/TimeZoneTitle.tsx#TimeZoneTitle"]={docgenInfo:l.__docgenInfo,name:"TimeZoneTitle",path:"src/components/DateTimePickers/TimeZonePicker/TimeZoneTitle.tsx#TimeZoneTitle"})}catch(x){}},"./src/components/DateTimePickers/options.ts":function(se,V,e){"use strict";e.d(V,{E:function(){return n},r:function(){return t}});const t=[{from:"now-5m",to:"now",display:"Last 5 minutes"},{from:"now-15m",to:"now",display:"Last 15 minutes"},{from:"now-30m",to:"now",display:"Last 30 minutes"},{from:"now-1h",to:"now",display:"Last 1 hour"},{from:"now-3h",to:"now",display:"Last 3 hours"},{from:"now-6h",to:"now",display:"Last 6 hours"},{from:"now-12h",to:"now",display:"Last 12 hours"},{from:"now-24h",to:"now",display:"Last 24 hours"},{from:"now-2d",to:"now",display:"Last 2 days"},{from:"now-7d",to:"now",display:"Last 7 days"},{from:"now-30d",to:"now",display:"Last 30 days"},{from:"now-90d",to:"now",display:"Last 90 days"},{from:"now-6M",to:"now",display:"Last 6 months"},{from:"now-1y",to:"now",display:"Last 1 year"},{from:"now-2y",to:"now",display:"Last 2 years"},{from:"now-5y",to:"now",display:"Last 5 years"},{from:"now-1d/d",to:"now-1d/d",display:"Yesterday"},{from:"now-2d/d",to:"now-2d/d",display:"Day before yesterday"},{from:"now-7d/d",to:"now-7d/d",display:"This day last week"},{from:"now-1w/w",to:"now-1w/w",display:"Previous week"},{from:"now-1M/M",to:"now-1M/M",display:"Previous month"},{from:"now-1Q/fQ",to:"now-1Q/fQ",display:"Previous fiscal quarter"},{from:"now-1y/y",to:"now-1y/y",display:"Previous year"},{from:"now-1y/fy",to:"now-1y/fy",display:"Previous fiscal year"},{from:"now/d",to:"now/d",display:"Today"},{from:"now/d",to:"now",display:"Today so far"},{from:"now/w",to:"now/w",display:"This week"},{from:"now/w",to:"now",display:"This week so far"},{from:"now/M",to:"now/M",display:"This month"},{from:"now/M",to:"now",display:"This month so far"},{from:"now/y",to:"now/y",display:"This year"},{from:"now/y",to:"now",display:"This year so far"},{from:"now/fQ",to:"now",display:"This fiscal quarter so far"},{from:"now/fQ",to:"now/fQ",display:"This fiscal quarter"},{from:"now/fy",to:"now",display:"This fiscal year so far"},{from:"now/fy",to:"now/fy",display:"This fiscal year"}],n=[{label:"January",value:0},{label:"February",value:1},{label:"March",value:2},{label:"April",value:3},{label:"May",value:4},{label:"June",value:5},{label:"July",value:6},{label:"August",value:7},{label:"September",value:8},{label:"October",value:9},{label:"November",value:10},{label:"December",value:11}]},"./src/components/Dropdown/ButtonSelect.tsx":function(se,V,e){"use strict";e.d(V,{d:function(){return s}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@react-aria-button-virtual-5b2d63a858/2/yarn/cache/@react-aria-button-npm-3.6.1-bfa95ee2e0-b7c520e7d7.zip/node_modules/@react-aria/button/dist/module.js"),a=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),l=e("../../.yarn/__virtual__/@react-aria-menu-virtual-100d0032c1/2/yarn/cache/@react-aria-menu-npm-3.6.1-1c2bd4f719-a2632174aa.zip/node_modules/@react-aria/menu/dist/module.js"),f=e("../../.yarn/__virtual__/@react-stately-menu-virtual-efb72460cf/2/yarn/cache/@react-stately-menu-npm-3.4.1-06c2f324d0-a944d6e3a3.zip/node_modules/@react-stately/menu/dist/module.js"),x=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),d=e("./src/themes/ThemeContext.tsx"),i=e("./src/components/Button/ButtonGroup.tsx"),c=e("./src/components/ClickOutsideWrapper/ClickOutsideWrapper.tsx"),E=e("./src/components/Menu/Menu.tsx"),O=e("./src/components/Menu/MenuItem.tsx"),m=e("./src/components/ToolbarButton/ToolbarButton.tsx"),w=Object.defineProperty,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(r,u,p)=>u in r?w(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,v=(r,u)=>{for(var p in u||(u={}))C.call(u,p)&&g(r,p,u[p]);if(_)for(var p of _(u))b.call(u,p)&&g(r,p,u[p]);return r},y=(r,u)=>{var p={};for(var S in r)C.call(r,S)&&u.indexOf(S)<0&&(p[S]=r[S]);if(r!=null&&_)for(var S of _(r))u.indexOf(S)<0&&b.call(r,S)&&(p[S]=r[S]);return p};const h=r=>{const u=r,{className:p,options:S,value:k,onChange:D,narrow:M,variant:I}=u,T=y(u,["className","options","value","onChange","narrow","variant"]),j=(0,d.wW)(o),K=(0,f.W)({}),F=x.useRef(null),{menuTriggerProps:$,menuProps:R}=(0,l.u4)({},K,F),{buttonProps:U}=(0,n.U)($,F),H=W=>{D(W),K.close()};return x.createElement(i.h,{className:j.wrapper},x.createElement(m.h,v(v({className:p,isOpen:K.isOpen,narrow:M,variant:I,ref:F},U),T),(k==null?void 0:k.label)||((k==null?void 0:k.value)!=null?String(k==null?void 0:k.value):null)),K.isOpen&&x.createElement("div",{className:j.menuWrapper},x.createElement(c.L,{onClick:K.close,parent:document,includeButtonPress:!1},x.createElement(a.MT,{contain:!0,autoFocus:!0,restoreFocus:!0},x.createElement(E.v,v({tabIndex:-1,onClose:K.close},R),S.map(W=>{var oe;return x.createElement(O.s,{key:`${W.value}`,label:(oe=W.label)!=null?oe:String(W.value),onClick:()=>H(W),active:W.value===(k==null?void 0:k.value),ariaChecked:W.value===(k==null?void 0:k.value),ariaLabel:W.ariaLabel||W.label,role:"menuitemradio"})}))))))};h.displayName="ButtonSelect";const s=x.memo(h),o=r=>({wrapper:t.iv`
      position: relative;
      display: inline-flex;
    `,menuWrapper:t.iv`
      position: absolute;
      z-index: ${r.zIndex.dropdown};
      top: ${r.spacing(4)};
      right: 0;
    `});try{s.displayName="ButtonSelect",s.__docgenInfo={description:"",displayName:"ButtonSelect",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"SelectableValue<T>[]"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"SelectableValue<T>"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(item: SelectableValue<T>) => void"}},tooltipContent:{defaultValue:null,description:"",name:"tooltipContent",required:!1,type:{name:"PopoverContent"}},narrow:{defaultValue:null,description:"",name:"narrow",required:!1,type:{name:"boolean"}},variant:{defaultValue:null,description:"",name:"variant",required:!1,type:{name:"enum",value:[{value:'"primary"'},{value:'"destructive"'},{value:'"default"'},{value:'"canvas"'},{value:'"active"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Dropdown/ButtonSelect.tsx#ButtonSelect"]={docgenInfo:s.__docgenInfo,name:"ButtonSelect",path:"src/components/Dropdown/ButtonSelect.tsx#ButtonSelect"})}catch(r){}},"./src/components/Dropdown/Dropdown.tsx":function(se,V,e){"use strict";e.d(V,{L:function(){return g}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/react-popper-tooltip-virtual-fa069dac02/2/yarn/cache/react-popper-tooltip-npm-4.4.2-54ed1200c6-516988b925.zip/node_modules/react-popper-tooltip/dist/esm/react-popper-tooltip.js"),f=e("../../.yarn/__virtual__/react-transition-group-virtual-5d02c993cb/2/yarn/cache/react-transition-group-npm-4.4.5-98ea4ef96e-7560284010.zip/node_modules/react-transition-group/esm/CSSTransition.js"),x=e("./src/utils/reactUtils.ts"),d=e("./src/components/Portal/Portal.tsx"),i=Object.defineProperty,c=Object.defineProperties,E=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(y,h,s)=>h in y?i(y,h,{enumerable:!0,configurable:!0,writable:!0,value:s}):y[h]=s,C=(y,h)=>{for(var s in h||(h={}))m.call(h,s)&&_(y,s,h[s]);if(O)for(var s of O(h))w.call(h,s)&&_(y,s,h[s]);return y},b=(y,h)=>c(y,E(h));const g=a.memo(({children:y,overlay:h,placement:s,offset:o,onVisibleChange:r})=>{const[u,p]=(0,a.useState)(!1),S=(0,a.useRef)(null);(0,a.useEffect)(()=>{r==null||r(u)},[r,u]);const{getArrowProps:k,getTooltipProps:D,setTooltipRef:M,setTriggerRef:I,visible:T}=(0,l.O)({visible:u,placement:s,onVisibleChange:p,interactive:!0,delayHide:0,delayShow:0,offset:o!=null?o:[0,8],trigger:["click"]}),j=150,K=v(j),F=()=>{p(!1)},$=R=>{(R.key==="Escape"||R.key==="Tab")&&p(!1)};return a.createElement(a.Fragment,null,a.cloneElement(typeof y=="function"?y(T):y,{ref:I}),T&&a.createElement(d.h_,null,a.createElement(n.MT,{autoFocus:!0,restoreFocus:!0,contain:!0},a.createElement("div",b(C({ref:M},D()),{onClick:F,onKeyDown:$}),a.createElement("div",C({},k({className:"tooltip-arrow"}))),a.createElement(f.Z,{nodeRef:S,appear:!0,in:!0,timeout:{appear:j,exit:0,enter:0},classNames:K},a.createElement("div",{ref:S},x.T(h)))))))});g.displayName="Dropdown";const v=y=>({appear:(0,t.iv)({opacity:"0",position:"relative",transform:"scaleY(0.5)",transformOrigin:"top"}),appearActive:(0,t.iv)({opacity:"1",transform:"scaleY(1)",transition:`transform ${y}ms cubic-bezier(0.2, 0, 0.2, 1), opacity ${y}ms cubic-bezier(0.2, 0, 0.2, 1)`})});try{g.displayName="Dropdown",g.__docgenInfo={description:"",displayName:"Dropdown",props:{overlay:{defaultValue:null,description:"",name:"overlay",required:!0,type:{name:"ReactElement<any, string | JSXElementConstructor<any>> | (() => ReactElement<any, string | JSXElementConstructor<any>>)"}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}},offset:{defaultValue:null,description:"Amount in pixels to nudge the dropdown vertically and horizontally, respectively.",name:"offset",required:!1,type:{name:"[number, number]"}},onVisibleChange:{defaultValue:null,description:"",name:"onVisibleChange",required:!1,type:{name:"((state: boolean) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Dropdown/Dropdown.tsx#Dropdown"]={docgenInfo:g.__docgenInfo,name:"Dropdown",path:"src/components/Dropdown/Dropdown.tsx#Dropdown"})}catch(y){}},"./src/components/ErrorBoundary/ErrorWithStack.tsx":function(se,V,e){"use strict";e.d(V,{X:function(){return f}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/stylesFactory.ts");const l=(0,a.B)(()=>t.iv`
    width: 500px;
    margin: 64px auto;
  `),f=({error:x,errorInfo:d,title:i})=>n.createElement("div",{className:l()},n.createElement("h2",null,i),n.createElement("details",{style:{whiteSpace:"pre-wrap"}},x&&x.toString(),n.createElement("br",null),d&&d.componentStack));f.displayName="ErrorWithStack";try{f.displayName="ErrorWithStack",f.__docgenInfo={description:"",displayName:"ErrorWithStack",props:{title:{defaultValue:null,description:"",name:"title",required:!0,type:{name:"string"}},error:{defaultValue:null,description:"",name:"error",required:!0,type:{name:"Error | null"}},errorInfo:{defaultValue:null,description:"",name:"errorInfo",required:!0,type:{name:"ErrorInfo | null"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ErrorBoundary/ErrorWithStack.tsx#ErrorWithStack"]={docgenInfo:f.__docgenInfo,name:"ErrorWithStack",path:"src/components/ErrorBoundary/ErrorWithStack.tsx#ErrorWithStack"})}catch(x){}},"./src/components/FileDropzone/FileListItem.tsx":function(se,V,e){"use strict";e.d(V,{K:function(){return E}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/utils/file.ts"),x=e("./src/components/Button/Button.tsx"),d=e("./src/components/Icon/Icon.tsx"),i=e("./src/components/IconButton/IconButton.tsx");const c="Remove file";function E({file:m,removeFile:w}){const _=(0,l.wW)(O),{file:C,progress:b,error:g,abortUpload:v,retryUpload:y}=m,h=()=>g?n.createElement(n.Fragment,null,n.createElement("span",{className:_.error},g.message),y&&n.createElement(i.h,{type:"button","aria-label":"Retry",name:"sync",tooltip:"Retry",tooltipPlacement:"top",onClick:y}),w&&n.createElement(i.h,{className:y?_.marginLeft:"",type:"button",name:"trash-alt",onClick:()=>w(m),tooltip:c,"aria-label":c})):b&&C.size>b?n.createElement(n.Fragment,null,n.createElement("progress",{className:_.progressBar,max:C.size,value:b}),n.createElement("span",{className:_.paddingLeft},Math.round(b/C.size*100),"%"),v&&n.createElement(x.zx,{variant:"secondary",type:"button",fill:"text",onClick:v},"Cancel upload")):w&&n.createElement(i.h,{name:"trash-alt",onClick:()=>w(m),tooltip:c,"aria-label":c,type:"button",tooltipPlacement:"top"}),s=(0,a.Cf)("decbytes")(C.size);return n.createElement("div",{className:_.fileListContainer},n.createElement("span",{className:_.fileNameWrapper},n.createElement(d.J,{name:"file-blank",size:"lg","aria-hidden":!0}),n.createElement("span",{className:_.padding},(0,f.O)(C.name)),n.createElement("span",null,(0,a.zc)(s))),n.createElement("div",{className:_.fileNameWrapper},h()))}function O(m){return{fileListContainer:t.iv`
      width: 100%;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      padding: ${m.spacing(2)};
      border: 1px dashed ${m.colors.border.medium};
      background-color: ${m.colors.background.secondary};
      margin-top: ${m.spacing(1)};
    `,fileNameWrapper:t.iv`
      display: flex;
      flex-direction: row;
      align-items: center;
    `,padding:t.iv`
      padding: ${m.spacing(0,1)};
    `,paddingLeft:t.iv`
      padding-left: ${m.spacing(2)};
    `,marginLeft:t.iv`
      margin-left: ${m.spacing(1)};
    `,error:t.iv`
      padding-right: ${m.spacing(2)};
      color: ${m.colors.error.text};
    `,progressBar:t.iv`
      border-radius: ${m.shape.radius.default};
      height: 4px;
      ::-webkit-progress-bar {
        background-color: ${m.colors.border.weak};
        border-radius: ${m.shape.radius.default};
      }
      ::-webkit-progress-value {
        background-color: ${m.colors.primary.main};
        border-radius: ${m.shape.radius.default};
      }
    `}}try{E.displayName="FileListItem",E.__docgenInfo={description:"",displayName:"FileListItem",props:{file:{defaultValue:null,description:"",name:"file",required:!0,type:{name:"DropzoneFile"}},removeFile:{defaultValue:null,description:"",name:"removeFile",required:!1,type:{name:"((file: DropzoneFile) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FileDropzone/FileListItem.tsx#FileListItem"]={docgenInfo:E.__docgenInfo,name:"FileListItem",path:"src/components/FileDropzone/FileListItem.tsx#FileListItem"})}catch(m){}},"./src/components/FilterInput/FilterInput.tsx":function(se,V,e){"use strict";e.d(V,{H:function(){return g}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/text/string.ts");function a(...v){const y=t.useRef(null);return t.useEffect(()=>{v.forEach(h=>{!h||(typeof h=="function"?h(y.current):h.current=y.current)})},[v]),y}var l=e("./src/components/Button/Button.tsx"),f=e("./src/components/Icon/Icon.tsx"),x=e("./src/components/Input/Input.tsx"),d=Object.defineProperty,i=Object.defineProperties,c=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(v,y,h)=>y in v?d(v,y,{enumerable:!0,configurable:!0,writable:!0,value:h}):v[y]=h,_=(v,y)=>{for(var h in y||(y={}))O.call(y,h)&&w(v,h,y[h]);if(E)for(var h of E(y))m.call(y,h)&&w(v,h,y[h]);return v},C=(v,y)=>i(v,c(y)),b=(v,y)=>{var h={};for(var s in v)O.call(v,s)&&y.indexOf(s)<0&&(h[s]=v[s]);if(v!=null&&E)for(var s of E(v))y.indexOf(s)<0&&m.call(v,s)&&(h[s]=v[s]);return h};const g=t.forwardRef((v,y)=>{var h=v,{value:s,width:o,onChange:r,escapeRegex:u=!0}=h,p=b(h,["value","width","onChange","escapeRegex"]);const S=t.useRef(null),k=a(y,S),D=s!==""?t.createElement(l.zx,{icon:"times",fill:"text",size:"sm",onClick:M=>{var I;(I=S.current)==null||I.focus(),r(""),M.stopPropagation()}},"Clear"):null;return t.createElement(x.I,C(_({prefix:t.createElement(f.J,{name:"search"}),suffix:D,width:o,type:"text",value:u?(0,n.x6)(s!=null?s:""):s,onChange:M=>r(u?(0,n.GE)(M.currentTarget.value):M.currentTarget.value)},p),{ref:k}))});g.displayName="FilterInput";try{g.displayName="FilterInput",g.__docgenInfo={description:"",displayName:"FilterInput",props:{onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: string) => void"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"number"}},value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"string | undefined"}},escapeRegex:{defaultValue:{value:"true"},description:"",name:"escapeRegex",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FilterInput/FilterInput.tsx#FilterInput"]={docgenInfo:g.__docgenInfo,name:"FilterInput",path:"src/components/FilterInput/FilterInput.tsx#FilterInput"})}catch(v){}},"./src/components/FormattedValueDisplay/FormattedValueDisplay.tsx":function(se,V,e){"use strict";e.d(V,{W:function(){return E}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=Object.defineProperty,a=Object.getOwnPropertySymbols,l=Object.prototype.hasOwnProperty,f=Object.prototype.propertyIsEnumerable,x=(O,m,w)=>m in O?n(O,m,{enumerable:!0,configurable:!0,writable:!0,value:w}):O[m]=w,d=(O,m)=>{for(var w in m||(m={}))l.call(m,w)&&x(O,w,m[w]);if(a)for(var w of a(m))f.call(m,w)&&x(O,w,m[w]);return O},i=(O,m)=>{var w={};for(var _ in O)l.call(O,_)&&m.indexOf(_)<0&&(w[_]=O[_]);if(O!=null&&a)for(var _ of a(O))m.indexOf(_)<0&&f.call(O,_)&&(w[_]=O[_]);return w};function c(O){return O<20?.9:O<26?.8:.6}const E=O=>{var m=O,{value:w,className:_,style:C}=m,b=i(m,["value","className","style"]),g,v;const y=((g=w.prefix)!=null?g:"").length>0,h=((v=w.suffix)!=null?v:"").length>0;let s;if(C&&C.fontSize&&typeof C.fontSize=="number"){const o=C.fontSize,r=c(o);s={fontSize:o*r}}return t.createElement("div",d({className:_,style:C},b),t.createElement("div",null,y&&t.createElement("span",null,w.prefix),t.createElement("span",null,w.text),h&&t.createElement("span",{style:s},w.suffix)))};E.displayName="FormattedDisplayValue";try{FormattedDisplayValue.displayName="FormattedDisplayValue",FormattedDisplayValue.__docgenInfo={description:"",displayName:"FormattedDisplayValue",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"FormattedValue"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},style:{defaultValue:null,description:"",name:"style",required:!1,type:{name:"CSSProperties"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/FormattedValueDisplay/FormattedValueDisplay.tsx#FormattedDisplayValue"]={docgenInfo:FormattedDisplayValue.__docgenInfo,name:"FormattedDisplayValue",path:"src/components/FormattedValueDisplay/FormattedValueDisplay.tsx#FormattedDisplayValue"})}catch(O){}},"./src/components/Forms/Checkbox.tsx":function(se,V,e){"use strict";e.d(V,{X:function(){return g}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/themes/stylesFactory.ts"),f=e("./src/themes/mixins.ts"),x=e("./src/components/Forms/Label.tsx"),d=Object.defineProperty,i=Object.defineProperties,c=Object.getOwnPropertyDescriptors,E=Object.getOwnPropertySymbols,O=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable,w=(y,h,s)=>h in y?d(y,h,{enumerable:!0,configurable:!0,writable:!0,value:s}):y[h]=s,_=(y,h)=>{for(var s in h||(h={}))O.call(h,s)&&w(y,s,h[s]);if(E)for(var s of E(h))m.call(h,s)&&w(y,s,h[s]);return y},C=(y,h)=>i(y,c(h)),b=(y,h)=>{var s={};for(var o in y)O.call(y,o)&&h.indexOf(o)<0&&(s[o]=y[o]);if(y!=null&&E)for(var o of E(y))h.indexOf(o)<0&&m.call(y,o)&&(s[o]=y[o]);return s};const g=n.forwardRef((y,h)=>{var s=y,{label:o,description:r,value:u,htmlValue:p,onChange:S,disabled:k,className:D}=s,M=b(s,["label","description","value","htmlValue","onChange","disabled","className"]);const I=(0,n.useCallback)(j=>{S&&S(j)},[S]),T=(0,a.wW)(v);return n.createElement("label",{className:(0,t.cx)(T.wrapper,D)},n.createElement("div",{className:T.checkboxWrapper},n.createElement("input",C(_({type:"checkbox",className:T.input,checked:u,disabled:k,onChange:I,value:p},M),{ref:h})),n.createElement("span",{className:T.checkmark})),o&&n.createElement("span",{className:T.label},o),r&&n.createElement("span",{className:T.description},r))}),v=(0,l.B)(y=>{const h=(0,x.F)(y),s=2,o=1;return{wrapper:t.iv`
      display: inline-grid;
      align-items: center;
      column-gap: ${y.spacing(o)};
      grid-template-columns: auto 1fr;
      grid-template-rows: auto auto;
      position: relative;
      vertical-align: middle;
    `,input:t.iv`
      position: absolute;
      z-index: 1;
      top: 0;
      left: 0;
      width: 100% !important; // global styles unset this
      height: 100%;
      opacity: 0;

      &:focus + span,
      &:focus-visible + span {
        ${(0,f.SV)(y)}
      }

      &:focus:not(:focus-visible) + span {
        ${(0,f.Cq)(y)}
      }

      /**
       * Using adjacent sibling selector to style checked state.
       * Primarily to limit the classes necessary to use when these classes will be used
       * for angular components styling
       * */
      &:checked + span {
        background: blue;
        background: ${y.colors.primary.main};
        border: none;

        &:hover {
          background: ${y.colors.primary.shade};
        }

        &:after {
          content: '';
          position: absolute;
          z-index: 2;
          left: 5px;
          top: 1px;
          width: 6px;
          height: 12px;
          border: solid ${y.colors.primary.contrastText};
          border-width: 0 3px 3px 0;
          transform: rotate(45deg);
        }
      }

      &:disabled + span {
        background-color: ${y.colors.action.disabledBackground};
        cursor: not-allowed;

        &:hover {
          background-color: ${y.colors.action.disabledBackground};
        }

        &:after {
          border-color: ${y.colors.action.disabledText};
        }
      }
    `,checkboxWrapper:t.iv`
      display: flex;
      align-items: center;
      grid-column-start: 1;
      grid-row-start: 1;
    `,checkmark:t.iv`
      position: relative; /* Checkbox should be layered on top of the invisible input so it recieves :hover */
      z-index: 2;
      display: inline-block;
      width: ${y.spacing(s)};
      height: ${y.spacing(s)};
      border-radius: ${y.shape.borderRadius()};
      background: ${y.components.input.background};
      border: 1px solid ${y.components.input.borderColor};

      &:hover {
        cursor: pointer;
        border-color: ${y.components.input.borderHover};
      }
    `,label:(0,t.cx)(h.label,t.iv`
        grid-column-start: 2;
        grid-row-start: 1;
        position: relative;
        z-index: 2;
        cursor: pointer;
        max-width: fit-content;
        line-height: ${y.typography.bodySmall.lineHeight};
        margin-bottom: 0;
      `),description:(0,t.cx)(h.description,t.iv`
        grid-column-start: 2;
        grid-row-start: 2;
        line-height: ${y.typography.bodySmall.lineHeight};
        margin-top: 0; /* The margin effectively comes from the top: -2px on the label above it */
      `)}});g.displayName="Checkbox";try{g.displayName="Checkbox",g.__docgenInfo={description:"",displayName:"Checkbox",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"boolean"}},description:{defaultValue:null,description:"",name:"description",required:!1,type:{name:"string"}},label:{defaultValue:null,description:"",name:"label",required:!1,type:{name:"string"}},htmlValue:{defaultValue:null,description:"",name:"htmlValue",required:!1,type:{name:"string | number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Checkbox.tsx#Checkbox"]={docgenInfo:g.__docgenInfo,name:"Checkbox",path:"src/components/Forms/Checkbox.tsx#Checkbox"})}catch(y){}},"./src/components/Forms/Field.tsx":function(se,V,e){"use strict";e.d(V,{g:function(){return b}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/stylesFactory.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/utils/reactUtils.ts"),x=e("./src/components/Forms/FieldValidationMessage.tsx"),d=e("./src/components/Forms/Label.tsx"),i=Object.defineProperty,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(v,y,h)=>y in v?i(v,y,{enumerable:!0,configurable:!0,writable:!0,value:h}):v[y]=h,w=(v,y)=>{for(var h in y||(y={}))E.call(y,h)&&m(v,h,y[h]);if(c)for(var h of c(y))O.call(y,h)&&m(v,h,y[h]);return v},_=(v,y)=>{var h={};for(var s in v)E.call(v,s)&&y.indexOf(s)<0&&(h[s]=v[s]);if(v!=null&&c)for(var s of c(v))y.indexOf(s)<0&&O.call(v,s)&&(h[s]=v[s]);return h};const C=(0,a.B)(v=>({field:t.iv`
      display: flex;
      flex-direction: column;
      margin-bottom: ${v.spacing(2)};
    `,fieldHorizontal:t.iv`
      flex-direction: row;
      justify-content: space-between;
      flex-wrap: wrap;
    `,fieldValidationWrapper:t.iv`
      margin-top: ${v.spacing(.5)};
    `,fieldValidationWrapperHorizontal:t.iv`
      flex: 1 1 100%;
    `,validationMessageHorizontalOverflow:t.iv`
      width: 0;
      overflow-x: visible;

      & > * {
        white-space: nowrap;
      }
    `})),b=v=>{var y=v,{label:h,description:s,horizontal:o,invalid:r,loading:u,disabled:p,required:S,error:k,children:D,className:M,validationMessageHorizontalOverflow:I,htmlFor:T}=y,j=_(y,["label","description","horizontal","invalid","loading","disabled","required","error","children","className","validationMessageHorizontalOverflow","htmlFor"]);const K=(0,l.l4)(),F=C(K),$=T!=null?T:(0,f.l)(D),R=typeof h=="string"?n.createElement(d._,{htmlFor:$,description:s},`${h}${S?" *":""}`):h,U=g({invalid:r,disabled:p,loading:u});return n.createElement("div",w({className:(0,t.cx)(F.field,o&&F.fieldHorizontal,M)},j),R,n.createElement("div",null,n.cloneElement(D,U),r&&k&&!o&&n.createElement("div",{className:(0,t.cx)(F.fieldValidationWrapper,{[F.validationMessageHorizontalOverflow]:!!I})},n.createElement(x.S,null,k))),r&&k&&o&&n.createElement("div",{className:(0,t.cx)(F.fieldValidationWrapper,F.fieldValidationWrapperHorizontal,{[F.validationMessageHorizontalOverflow]:!!I})},n.createElement(x.S,null,k)))};function g(v){for(const y in v)v[y]===void 0&&delete v[y];return v}try{C.displayName="getFieldStyles",C.__docgenInfo={description:"",displayName:"getFieldStyles",props:{0:{defaultValue:null,description:"",name:"0",required:!0,type:{name:"GrafanaTheme2"}},length:{defaultValue:null,description:"",name:"length",required:!0,type:{name:"1"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Field.tsx#getFieldStyles"]={docgenInfo:C.__docgenInfo,name:"getFieldStyles",path:"src/components/Forms/Field.tsx#getFieldStyles"})}catch(v){}try{b.displayName="Field",b.__docgenInfo={description:"",displayName:"Field",props:{children:{defaultValue:null,description:"Form input element, i.e Input or Switch",name:"children",required:!0,type:{name:"ReactElement<any, string | JSXElementConstructor<any>>"}},label:{defaultValue:null,description:"Label for the field",name:"label",required:!1,type:{name:"ReactNode"}},description:{defaultValue:null,description:"Description of the field",name:"description",required:!1,type:{name:"ReactNode"}},invalid:{defaultValue:null,description:"Indicates if field is in invalid state",name:"invalid",required:!1,type:{name:"boolean"}},loading:{defaultValue:null,description:"Indicates if field is in loading state",name:"loading",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"Indicates if field is disabled",name:"disabled",required:!1,type:{name:"boolean"}},required:{defaultValue:null,description:"Indicates if field is required",name:"required",required:!1,type:{name:"boolean"}},error:{defaultValue:null,description:"Error message to display",name:"error",required:!1,type:{name:"ReactNode"}},horizontal:{defaultValue:null,description:"Indicates horizontal layout of the field",name:"horizontal",required:!1,type:{name:"boolean"}},validationMessageHorizontalOverflow:{defaultValue:null,description:"make validation message overflow horizontally. Prevents pushing out adjacent inline components",name:"validationMessageHorizontalOverflow",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},htmlFor:{defaultValue:null,description:"A unique id that associates the label of the Field component with the control with the unique id.\nIf the `htmlFor` property is missing the `htmlFor` will be inferred from the `id` or `inputId` property of the first child.\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#attr-for",name:"htmlFor",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Field.tsx#Field"]={docgenInfo:b.__docgenInfo,name:"Field",path:"src/components/Forms/Field.tsx#Field"})}catch(v){}},"./src/components/Forms/FieldValidationMessage.tsx":function(se,V,e){"use strict";e.d(V,{S:function(){return d}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/stylesFactory.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/components/Icon/Icon.tsx");const x=(0,a.B)(i=>{const c=`
      font-size: ${i.typography.size.sm};
      font-weight: ${i.typography.fontWeightMedium};
      padding: ${i.spacing(.5,1)};
      color: ${i.colors.error.contrastText};
      background: ${i.colors.error.main};
      border-radius: ${i.shape.borderRadius()};
      position: relative;
      display: inline-block;
      align-self: flex-start;

      a {
        color: ${i.colors.error.contrastText};
        text-decoration: underline;
      }

      a:hover {
        text-decoration: none;
      }
    `;return{vertical:t.iv`
      ${c}
      margin: ${i.spacing(.5,0,0,0)};

      &:before {
        content: '';
        position: absolute;
        left: 9px;
        top: -5px;
        width: 0;
        height: 0;
        border-width: 0 4px 5px 4px;
        border-color: transparent transparent ${i.colors.error.main} transparent;
        border-style: solid;
      }
    `,horizontal:t.iv`
      ${c}
      margin-left: 10px;

      &:before {
        content: '';
        position: absolute;
        left: -5px;
        top: 9px;
        width: 0;
        height: 0;
        border-width: 4px 5px 4px 0;
        border-color: transparent #e02f44 transparent transparent;
        border-style: solid;
      }
    `,fieldValidationMessageIcon:t.iv`
      margin-right: ${i.spacing()};
    `}}),d=({children:i,horizontal:c,className:E})=>{const O=(0,l.l4)(),m=x(O),w=(0,t.cx)(c?m.horizontal:m.vertical,E);return n.createElement("div",{role:"alert",className:w},n.createElement(f.J,{className:m.fieldValidationMessageIcon,name:"exclamation-triangle"}),i)};try{x.displayName="getFieldValidationMessageStyles",x.__docgenInfo={description:"",displayName:"getFieldValidationMessageStyles",props:{0:{defaultValue:null,description:"",name:"0",required:!0,type:{name:"GrafanaTheme2"}},length:{defaultValue:null,description:"",name:"length",required:!0,type:{name:"1"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/FieldValidationMessage.tsx#getFieldValidationMessageStyles"]={docgenInfo:x.__docgenInfo,name:"getFieldValidationMessageStyles",path:"src/components/Forms/FieldValidationMessage.tsx#getFieldValidationMessageStyles"})}catch(i){}try{d.displayName="FieldValidationMessage",d.__docgenInfo={description:"",displayName:"FieldValidationMessage",props:{className:{defaultValue:null,description:"Override component style",name:"className",required:!1,type:{name:"string"}},horizontal:{defaultValue:null,description:"",name:"horizontal",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/FieldValidationMessage.tsx#FieldValidationMessage"]={docgenInfo:d.__docgenInfo,name:"FieldValidationMessage",path:"src/components/Forms/FieldValidationMessage.tsx#FieldValidationMessage"})}catch(i){}},"./src/components/Forms/Form.tsx":function(se,V,e){"use strict";e.d(V,{l:function(){return O}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-hook-form-virtual-2f92bbcc72/2/yarn/cache/react-hook-form-npm-7.5.3-f9cc466c62-fbfaa3b664.zip/node_modules/react-hook-form/dist/index.esm.js"),l=Object.defineProperty,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(m,w,_)=>w in m?l(m,w,{enumerable:!0,configurable:!0,writable:!0,value:_}):m[w]=_,c=(m,w)=>{for(var _ in w||(w={}))x.call(w,_)&&i(m,_,w[_]);if(f)for(var _ of f(w))d.call(w,_)&&i(m,_,w[_]);return m},E=(m,w)=>{var _={};for(var C in m)x.call(m,C)&&w.indexOf(C)<0&&(_[C]=m[C]);if(m!=null&&f)for(var C of f(m))w.indexOf(C)<0&&d.call(m,C)&&(_[C]=m[C]);return _};function O(m){var w=m,{defaultValues:_,onSubmit:C,validateOnMount:b=!1,validateFieldsOnMount:g,children:v,validateOn:y="onSubmit",maxWidth:h=600}=w,s=E(w,["defaultValues","onSubmit","validateOnMount","validateFieldsOnMount","children","validateOn","maxWidth"]);const o=(0,a.cI)({mode:y,defaultValues:_}),{handleSubmit:r,trigger:u,formState:p}=o,S=E(o,["handleSubmit","trigger","formState"]);return(0,n.useEffect)(()=>{b&&u(g)},[u,g,b]),n.createElement("form",c({className:t.iv`
        max-width: ${h!=="none"?h+"px":h};
        width: 100%;
      `,onSubmit:r(C)},s),v(c({errors:p.errors,formState:p},S)))}try{O.displayName="Form",O.__docgenInfo={description:"",displayName:"Form",props:{validateOn:{defaultValue:{value:"onSubmit"},description:"",name:"validateOn",required:!1,type:{name:"enum",value:[{value:'"onBlur"'},{value:'"onChange"'},{value:'"onSubmit"'},{value:'"all"'},{value:'"onTouched"'}]}},validateOnMount:{defaultValue:{value:"false"},description:"",name:"validateOnMount",required:!1,type:{name:"boolean"}},validateFieldsOnMount:{defaultValue:null,description:"",name:"validateFieldsOnMount",required:!1,type:{name:"string | string[]"}},defaultValues:{defaultValue:null,description:"",name:"defaultValues",required:!1,type:{name:"{ [x: string]: any; }"}},onSubmit:{defaultValue:null,description:"",name:"onSubmit",required:!0,type:{name:"SubmitHandler<T>"}},maxWidth:{defaultValue:{value:"600"},description:"Sets max-width for container. Use it instead of setting individual widths on inputs.",name:"maxWidth",required:!1,type:{name:'number | "none"'}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Form.tsx#Form"]={docgenInfo:O.__docgenInfo,name:"Form",path:"src/components/Forms/Form.tsx#Form"})}catch(m){}},"./src/components/Forms/InlineField.tsx":function(se,V,e){"use strict";e.d(V,{_:function(){return _}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/utils/reactUtils.ts"),f=e("./src/components/Forms/FieldValidationMessage.tsx"),x=e("./src/components/Forms/InlineLabel.tsx"),d=Object.defineProperty,i=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable,O=(b,g,v)=>g in b?d(b,g,{enumerable:!0,configurable:!0,writable:!0,value:v}):b[g]=v,m=(b,g)=>{for(var v in g||(g={}))c.call(g,v)&&O(b,v,g[v]);if(i)for(var v of i(g))E.call(g,v)&&O(b,v,g[v]);return b},w=(b,g)=>{var v={};for(var y in b)c.call(b,y)&&g.indexOf(y)<0&&(v[y]=b[y]);if(b!=null&&i)for(var y of i(b))g.indexOf(y)<0&&E.call(b,y)&&(v[y]=b[y]);return v};const _=b=>{var g=b,{children:v,label:y,tooltip:h,labelWidth:s="auto",invalid:o,loading:r,disabled:u,required:p,className:S,htmlFor:k,grow:D,shrink:M,error:I,transparent:T,interactive:j}=g,K=w(g,["children","label","tooltip","labelWidth","invalid","loading","disabled","required","className","htmlFor","grow","shrink","error","transparent","interactive"]);const F=(0,a.l4)(),$=C(F,D,M),R=k!=null?k:(0,l.l)(v),U=typeof y=="string"?n.createElement(x.W,{interactive:j,width:s,tooltip:h,htmlFor:R,transparent:T},`${y}${p?" *":""}`):y;return n.createElement("div",m({className:(0,t.cx)($.container,S)},K),U,n.createElement("div",{className:$.childContainer},n.cloneElement(v,{invalid:o,disabled:u,loading:r}),o&&I&&n.createElement("div",{className:(0,t.cx)($.fieldValidationWrapper)},n.createElement(f.S,null,I))))};_.displayName="InlineField";const C=(b,g,v)=>({container:t.iv`
      display: flex;
      flex-direction: row;
      align-items: flex-start;
      text-align: left;
      position: relative;
      flex: ${g?1:0} ${v?1:0} auto;
      margin: 0 ${b.spacing(.5)} ${b.spacing(.5)} 0;
    `,childContainer:t.iv`
      flex: ${g?1:0} ${v?1:0} auto;
    `,fieldValidationWrapper:t.iv`
      margin-top: ${b.spacing(.5)};
    `});try{_.displayName="InlineField",_.__docgenInfo={description:"",displayName:"InlineField",props:{tooltip:{defaultValue:null,description:"Content for the label's tooltip",name:"tooltip",required:!1,type:{name:"PopoverContent"}},labelWidth:{defaultValue:{value:"auto"},description:"Custom width for the label as a multiple of 8px",name:"labelWidth",required:!1,type:{name:'number | "auto"'}},grow:{defaultValue:null,description:"Make the field's child to fill the width of the row. Equivalent to setting `flex-grow:1` on the field",name:"grow",required:!1,type:{name:"boolean"}},shrink:{defaultValue:null,description:"Make the field's child shrink with width of the row. Equivalent to setting `flex-shrink:1` on the field",name:"shrink",required:!1,type:{name:"boolean"}},transparent:{defaultValue:null,description:"Make field's background transparent",name:"transparent",required:!1,type:{name:"boolean"}},error:{defaultValue:null,description:"Error message to display",name:"error",required:!1,type:{name:"string | null"}},htmlFor:{defaultValue:null,description:"A unique id that associates the label of the Field component with the control with the unique id.\nIf the `htmlFor` property is missing the `htmlFor` will be inferred from the `id` or `inputId` property of the first child.\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Element/label#attr-for",name:"htmlFor",required:!1,type:{name:"string"}},interactive:{defaultValue:null,description:"Make tooltip interactive",name:"interactive",required:!1,type:{name:"boolean"}},children:{defaultValue:null,description:"Form input element, i.e Input or Switch",name:"children",required:!0,type:{name:"ReactElement<any, string | JSXElementConstructor<any>>"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"Indicates if field is disabled",name:"disabled",required:!1,type:{name:"boolean"}},label:{defaultValue:null,description:"Label for the field",name:"label",required:!1,type:{name:"ReactNode"}},loading:{defaultValue:null,description:"Indicates if field is in loading state",name:"loading",required:!1,type:{name:"boolean"}},required:{defaultValue:null,description:"Indicates if field is required",name:"required",required:!1,type:{name:"boolean"}},invalid:{defaultValue:null,description:"Indicates if field is in invalid state",name:"invalid",required:!1,type:{name:"boolean"}},validationMessageHorizontalOverflow:{defaultValue:null,description:"make validation message overflow horizontally. Prevents pushing out adjacent inline components",name:"validationMessageHorizontalOverflow",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/InlineField.tsx#InlineField"]={docgenInfo:_.__docgenInfo,name:"InlineField",path:"src/components/Forms/InlineField.tsx#InlineField"})}catch(b){}},"./src/components/Forms/InlineFieldRow.tsx":function(se,V,e){"use strict";e.d(V,{Z:function(){return O}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=Object.defineProperty,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(w,_,C)=>_ in w?l(w,_,{enumerable:!0,configurable:!0,writable:!0,value:C}):w[_]=C,c=(w,_)=>{for(var C in _||(_={}))x.call(_,C)&&i(w,C,_[C]);if(f)for(var C of f(_))d.call(_,C)&&i(w,C,_[C]);return w},E=(w,_)=>{var C={};for(var b in w)x.call(w,b)&&_.indexOf(b)<0&&(C[b]=w[b]);if(w!=null&&f)for(var b of f(w))_.indexOf(b)<0&&d.call(w,b)&&(C[b]=w[b]);return C};const O=w=>{var _=w,{children:C,className:b}=_,g=E(_,["children","className"]);const v=(0,a.wW)(m);return n.createElement("div",c({className:(0,t.cx)(v.container,b)},g),C)},m=w=>({container:t.iv`
      label: InlineFieldRow;
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-content: flex-start;
      row-gap: ${w.spacing(.5)};
    `});try{O.displayName="InlineFieldRow",O.__docgenInfo={description:"",displayName:"InlineFieldRow",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/InlineFieldRow.tsx#InlineFieldRow"]={docgenInfo:O.__docgenInfo,name:"InlineFieldRow",path:"src/components/Forms/InlineFieldRow.tsx#InlineFieldRow"})}catch(w){}},"./src/components/Forms/InlineLabel.tsx":function(se,V,e){"use strict";e.d(V,{W:function(){return w}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/Icon/Icon.tsx"),f=e("./src/components/Tooltip/Tooltip.tsx"),x=Object.defineProperty,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(C,b,g)=>b in C?x(C,b,{enumerable:!0,configurable:!0,writable:!0,value:g}):C[b]=g,O=(C,b)=>{for(var g in b||(b={}))i.call(b,g)&&E(C,g,b[g]);if(d)for(var g of d(b))c.call(b,g)&&E(C,g,b[g]);return C},m=(C,b)=>{var g={};for(var v in C)i.call(C,v)&&b.indexOf(v)<0&&(g[v]=C[v]);if(C!=null&&d)for(var v of d(C))b.indexOf(v)<0&&c.call(C,v)&&(g[v]=C[v]);return g};const w=C=>{var b=C,{children:g,className:v,tooltip:y,width:h,transparent:s,interactive:o,as:r="label"}=b,u=m(b,["children","className","tooltip","width","transparent","interactive","as"]);const p=(0,a.wW)((0,n.useCallback)(S=>_(S,s,h),[s,h]));return n.createElement(r,O({className:(0,t.cx)(p.label,v)},u),g,y&&n.createElement(f.u,{interactive:o,placement:"top",content:y,theme:"info"},n.createElement(l.J,{tabIndex:0,name:"info-circle",size:"sm",className:p.icon})))},_=(C,b=!1,g)=>({label:t.iv`
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-shrink: 0;
      padding: 0 ${C.spacing(1)};
      font-weight: ${C.typography.fontWeightMedium};
      font-size: ${C.typography.size.sm};
      background-color: ${b?"transparent":C.colors.background.secondary};
      height: ${C.spacing(C.components.height.md)};
      line-height: ${C.spacing(C.components.height.md)};
      margin-right: ${C.spacing(.5)};
      border-radius: ${C.shape.radius.default};
      border: none;
      width: ${g?g!=="auto"?`${8*g}px`:g:"100%"};
      color: ${C.colors.text.primary};
    `,icon:t.iv`
      color: ${C.colors.text.secondary};
      margin-left: 10px;

      :hover {
        color: ${C.colors.text.primary};
      }
    `});try{w.displayName="InlineLabel",w.__docgenInfo={description:"",displayName:"InlineLabel",props:{tooltip:{defaultValue:null,description:`Content for the labels tooltip. If provided, an info icon with the tooltip content
will be displayed`,name:"tooltip",required:!1,type:{name:"PopoverContent"}},width:{defaultValue:null,description:"Custom width for the label",name:"width",required:!1,type:{name:'number | "auto"'}},transparent:{defaultValue:null,description:"Make labels's background transparent",name:"transparent",required:!1,type:{name:"boolean"}},interactive:{defaultValue:null,description:"Make tooltip interactive",name:"interactive",required:!1,type:{name:"boolean"}},as:{defaultValue:null,description:"Controls which element the InlineLabel should be rendered into",name:"as",required:!1,type:{name:"ElementType<any>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/InlineLabel.tsx#InlineLabel"]={docgenInfo:w.__docgenInfo,name:"InlineLabel",path:"src/components/Forms/InlineLabel.tsx#InlineLabel"})}catch(C){}},"./src/components/Forms/Label.tsx":function(se,V,e){"use strict";e.d(V,{F:function(){return w},_:function(){return _}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/stylesFactory.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/components/Icon/Icon.tsx"),x=Object.defineProperty,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(C,b,g)=>b in C?x(C,b,{enumerable:!0,configurable:!0,writable:!0,value:g}):C[b]=g,O=(C,b)=>{for(var g in b||(b={}))i.call(b,g)&&E(C,g,b[g]);if(d)for(var g of d(b))c.call(b,g)&&E(C,g,b[g]);return C},m=(C,b)=>{var g={};for(var v in C)i.call(C,v)&&b.indexOf(v)<0&&(g[v]=C[v]);if(C!=null&&d)for(var v of d(C))b.indexOf(v)<0&&c.call(C,v)&&(g[v]=C[v]);return g};const w=(0,a.B)(C=>({label:t.iv`
      label: Label;
      font-size: ${C.typography.size.sm};
      font-weight: ${C.typography.fontWeightMedium};
      line-height: 1.25;
      margin-bottom: ${C.spacing(.5)};
      color: ${C.colors.text.primary};
      max-width: 480px;
    `,labelContent:t.iv`
      display: flex;
      align-items: center;
    `,description:t.iv`
      label: Label-description;
      color: ${C.colors.text.secondary};
      font-size: ${C.typography.size.sm};
      font-weight: ${C.typography.fontWeightRegular};
      margin-top: ${C.spacing(.25)};
      display: block;
    `,categories:t.iv`
      label: Label-categories;
      display: inline-flex;
      align-items: center;
    `,chevron:t.iv`
      margin: 0 ${C.spacing(.25)};
    `})),_=C=>{var b=C,{children:g,description:v,className:y,category:h}=b,s=m(b,["children","description","className","category"]);const o=(0,l.l4)(),r=w(o),u=h==null?void 0:h.map((p,S)=>n.createElement("span",{className:r.categories,key:`${p}/${S}`},n.createElement("span",null,p),n.createElement(f.J,{name:"angle-right",className:r.chevron})));return n.createElement("div",{className:(0,t.cx)(r.label,y)},n.createElement("label",O({},s),n.createElement("div",{className:r.labelContent},u,g),v&&n.createElement("span",{className:r.description},v)))};try{w.displayName="getLabelStyles",w.__docgenInfo={description:"",displayName:"getLabelStyles",props:{0:{defaultValue:null,description:"",name:"0",required:!0,type:{name:"GrafanaTheme2"}},length:{defaultValue:null,description:"",name:"length",required:!0,type:{name:"1"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Label.tsx#getLabelStyles"]={docgenInfo:w.__docgenInfo,name:"getLabelStyles",path:"src/components/Forms/Label.tsx#getLabelStyles"})}catch(C){}try{_.displayName="Label",_.__docgenInfo={description:"",displayName:"Label",props:{description:{defaultValue:null,description:"",name:"description",required:!1,type:{name:"ReactNode"}},category:{defaultValue:null,description:"",name:"category",required:!1,type:{name:"ReactNode[]"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Label.tsx#Label"]={docgenInfo:_.__docgenInfo,name:"Label",path:"src/components/Forms/Label.tsx#Label"})}catch(C){}},"./src/components/Forms/Legend.tsx":function(se,V,e){"use strict";e.d(V,{D:function(){return m}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=Object.defineProperty,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(w,_,C)=>_ in w?l(w,_,{enumerable:!0,configurable:!0,writable:!0,value:C}):w[_]=C,c=(w,_)=>{for(var C in _||(_={}))x.call(_,C)&&i(w,C,_[C]);if(f)for(var C of f(_))d.call(_,C)&&i(w,C,_[C]);return w},E=(w,_)=>{var C={};for(var b in w)x.call(w,b)&&_.indexOf(b)<0&&(C[b]=w[b]);if(w!=null&&f)for(var b of f(w))_.indexOf(b)<0&&d.call(w,b)&&(C[b]=w[b]);return C};const O=w=>({legend:t.iv`
      font-size: ${w.typography.h3.fontSize};
      font-weight: ${w.typography.fontWeightRegular};
      margin: 0 0 ${w.spacing(2)} 0;
    `}),m=w=>{var _=w,{children:C,className:b}=_,g=E(_,["children","className"]);const v=(0,a.wW)(O);return n.createElement("legend",c({className:(0,t.cx)(v.legend,b)},g),C)};try{O.displayName="getLegendStyles",O.__docgenInfo={description:"",displayName:"getLegendStyles",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},isDark:{defaultValue:null,description:"",name:"isDark",required:!0,type:{name:"boolean"}},isLight:{defaultValue:null,description:"",name:"isLight",required:!0,type:{name:"boolean"}},colors:{defaultValue:null,description:"",name:"colors",required:!0,type:{name:"ThemeColors"}},breakpoints:{defaultValue:null,description:"",name:"breakpoints",required:!0,type:{name:"ThemeBreakpoints"}},spacing:{defaultValue:null,description:"",name:"spacing",required:!0,type:{name:"ThemeSpacing"}},shape:{defaultValue:null,description:"",name:"shape",required:!0,type:{name:"ThemeShape"}},components:{defaultValue:null,description:"",name:"components",required:!0,type:{name:"ThemeComponents"}},typography:{defaultValue:null,description:"",name:"typography",required:!0,type:{name:"ThemeTypography"}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!0,type:{name:"{ navbarFixed: number; sidemenu: number; dropdown: number; typeahead: number; tooltip: number; modalBackdrop: number; modal: number; portal: number; }"}},shadows:{defaultValue:null,description:"",name:"shadows",required:!0,type:{name:"ThemeShadows"}},visualization:{defaultValue:null,description:"",name:"visualization",required:!0,type:{name:"ThemeVisualizationColors"}},transitions:{defaultValue:null,description:"",name:"transitions",required:!0,type:{name:"ThemeTransitions"}},v1:{defaultValue:null,description:"@deprecated Will be removed in a future version",name:"v1",required:!0,type:{name:"GrafanaTheme"}},flags:{defaultValue:null,description:"feature flags that might impact component looks",name:"flags",required:!0,type:{name:"{ topnav?: boolean | undefined; }"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Legend.tsx#getLegendStyles"]={docgenInfo:O.__docgenInfo,name:"getLegendStyles",path:"src/components/Forms/Legend.tsx#getLegendStyles"})}catch(w){}try{m.displayName="Legend",m.__docgenInfo={description:"",displayName:"Legend",props:{description:{defaultValue:null,description:"",name:"description",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/Legend.tsx#Legend"]={docgenInfo:m.__docgenInfo,name:"Legend",path:"src/components/Forms/Legend.tsx#Legend"})}catch(w){}},"./src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx":function(se,V,e){"use strict";e.d(V,{S:function(){return m}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts"),f=e("./src/themes/ThemeContext.tsx"),x=e("./src/components/Icon/Icon.tsx"),d=e("./src/themes/stylesFactory.ts"),i=e("./src/themes/mixins.ts"),c=e("./src/components/Forms/commonStyles.ts");const E=a.forwardRef(({children:_,active:C=!1,disabled:b=!1,size:g="md",onChange:v,onClick:y,id:h,name:s=void 0,description:o,fullWidth:r,"aria-label":u},p)=>{const S=(0,f.l4)(),k=O(S,g,r);return a.createElement(a.Fragment,null,a.createElement("input",{type:"radio",className:k.radio,onChange:v,onClick:y,disabled:b,id:h,checked:C,name:s,"aria-label":u,ref:p}),a.createElement("label",{className:k.radioLabel,htmlFor:h,title:o},_))});E.displayName="RadioButton";const O=(0,d.B)((_,C,b)=>{const{fontSize:g,height:v,padding:y}=(0,c.iL)(C,_),h=_.colors.text.secondary,s=_.colors.text.primary,o=v*_.spacing.gridSize-4-2;return{radio:t.iv`
      position: absolute;
      opacity: 0;
      z-index: -1000;

      &:checked + label {
        color: ${_.colors.text.primary};
        font-weight: ${_.typography.fontWeightMedium};
        background: ${_.colors.action.selected};
        z-index: 3;
      }

      &:focus + label,
      &:focus-visible + label {
        ${(0,i.SV)(_)};
      }

      &:focus:not(:focus-visible) + label {
        ${(0,i.Cq)(_)}
      }

      &:disabled + label {
        color: ${_.colors.text.disabled};
        cursor: not-allowed;
      }
    `,radioLabel:t.iv`
      display: inline-block;
      position: relative;
      font-size: ${g};
      height: ${o}px;
      // Deduct border from line-height for perfect vertical centering on windows and linux
      line-height: ${o}px;
      color: ${h};
      padding: ${_.spacing(0,y)};
      border-radius: ${_.shape.borderRadius()};
      background: ${_.colors.background.primary};
      cursor: pointer;
      z-index: 1;
      flex: ${b?"1 0 0":"none"};
      text-align: center;
      user-select: none;
      white-space: nowrap;

      &:hover {
        color: ${s};
      }
    `}});try{E.displayName="RadioButton",E.__docgenInfo={description:"",displayName:"RadioButton",props:{size:{defaultValue:{value:"md"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"sm"'},{value:'"md"'}]}},disabled:{defaultValue:{value:"false"},description:"",name:"disabled",required:!1,type:{name:"boolean"}},name:{defaultValue:{value:"undefined"},description:"",name:"name",required:!1,type:{name:"string"}},description:{defaultValue:null,description:"",name:"description",required:!1,type:{name:"string"}},active:{defaultValue:{value:"false"},description:"",name:"active",required:!1,type:{name:"boolean"}},id:{defaultValue:null,description:"",name:"id",required:!0,type:{name:"string"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"() => void"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!0,type:{name:"() => void"}},fullWidth:{defaultValue:null,description:"",name:"fullWidth",required:!1,type:{name:"boolean"}},"aria-label":{defaultValue:null,description:"",name:"aria-label",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/RadioButtonGroup/RadioButton.tsx#RadioButton"]={docgenInfo:E.__docgenInfo,name:"RadioButton",path:"src/components/Forms/RadioButtonGroup/RadioButton.tsx#RadioButton"})}catch(_){}function m({options:_,value:C,onChange:b,onClick:g,disabled:v,disabledOptions:y,size:h="md",id:s,className:o,fullWidth:r=!1,autoFocus:u=!1}){const p=(0,a.useCallback)(T=>()=>{b&&b(T.value)},[b]),S=(0,a.useCallback)(T=>()=>{g&&g(T.value)},[g]),k=s!=null?s:(0,n.uniqueId)("radiogroup-"),D=(0,a.useRef)(k),M=(0,f.wW)(w),I=(0,a.useRef)(null);return(0,a.useEffect)(()=>{u&&I.current&&I.current.focus()},[u]),a.createElement("div",{className:(0,t.cx)(M.radioGroup,r&&M.fullWidth,o)},_.map((T,j)=>{const K=y&&T.value&&y.includes(T.value),F=T.icon?(0,l.iJ)(T.icon):void 0;return a.createElement(E,{size:h,disabled:K||v,active:C===T.value,key:`o.label-${j}`,"aria-label":T.ariaLabel,onChange:p(T),onClick:S(T),id:`option-${T.value}-${k}`,name:D.current,description:T.description,fullWidth:r,ref:C===T.value?I:void 0},F&&a.createElement(x.J,{name:F,className:M.icon}),T.imgUrl&&a.createElement("img",{src:T.imgUrl,alt:T.label,className:M.img}),T.label," ",T.component?a.createElement(T.component,null):null)}))}m.displayName="RadioButtonGroup";const w=_=>({radioGroup:(0,t.iv)({display:"inline-flex",flexDirection:"row",flexWrap:"nowrap",border:`1px solid ${_.components.input.borderColor}`,borderRadius:_.shape.borderRadius(),padding:"2px"}),fullWidth:(0,t.iv)({display:"flex"}),icon:t.iv`
      margin-right: 6px;
    `,img:t.iv`
      width: ${_.spacing(2)};
      height: ${_.spacing(2)};
      margin-right: ${_.spacing(1)};
    `});try{m.displayName="RadioButtonGroup",m.__docgenInfo={description:"",displayName:"RadioButtonGroup",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"T"}},id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},disabledOptions:{defaultValue:null,description:"",name:"disabledOptions",required:!1,type:{name:"T[]"}},options:{defaultValue:null,description:"",name:"options",required:!0,type:{name:"SelectableValue<T>[]"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!1,type:{name:"((value: T) => void)"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"((value: T) => void)"}},size:{defaultValue:{value:"md"},description:"",name:"size",required:!1,type:{name:"enum",value:[{value:'"sm"'},{value:'"md"'}]}},fullWidth:{defaultValue:{value:"false"},description:"",name:"fullWidth",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},autoFocus:{defaultValue:{value:"false"},description:"",name:"autoFocus",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx#RadioButtonGroup"]={docgenInfo:m.__docgenInfo,name:"RadioButtonGroup",path:"src/components/Forms/RadioButtonGroup/RadioButtonGroup.tsx#RadioButtonGroup"})}catch(_){}},"./src/components/Forms/commonStyles.ts":function(se,V,e){"use strict";e.d(V,{GL:function(){return a},RK:function(){return l},ht:function(){return x},iL:function(){return i},nf:function(){return f}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("./src/themes/mixins.ts");const a=c=>t.iv`
  &:focus {
    ${(0,n.$l)(c)}
  }
`,l=(c,E=!1)=>{const O=E?c.colors.error.border:c.components.input.borderColor,m=E?c.colors.error.shade:c.components.input.borderHover,w=c.components.input.background,_=c.components.input.text,C=c.isDark?"#2e2f35":"#bab4ca";return(0,t.cx)(f(c),t.iv`
      background: ${w};
      line-height: ${c.typography.body.lineHeight};
      font-size: ${c.typography.size.md};
      color: ${_};
      border: 1px solid ${O};

      &:-webkit-autofill,
      &:-webkit-autofill:hover {
        /* Welcome to 2005. This is a HACK to get rid od Chromes default autofill styling */
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0), inset 0 0 0 100px ${w}!important;
        -webkit-text-fill-color: ${_} !important;
        border-color: ${C};
      }

      &:-webkit-autofill:focus {
        /* Welcome to 2005. This is a HACK to get rid od Chromes default autofill styling */
        box-shadow: 0 0 0 2px ${c.colors.background.primary}, 0 0 0px 4px ${c.colors.primary.main},
          inset 0 0 0 1px rgba(255, 255, 255, 0), inset 0 0 0 100px ${w}!important;
        -webkit-text-fill-color: ${_} !important;
      }

      &:hover {
        border-color: ${m};
      }

      &:focus {
        outline: none;
      }

      &:disabled {
        background-color: ${c.colors.action.disabledBackground};
        color: ${c.colors.action.disabledText};
        border: 1px solid ${c.colors.action.disabledBackground};

        &:hover {
          border-color: ${O};
        }
      }

      &::placeholder {
        color: ${c.colors.text.disabled};
        opacity: 1;
      }
    `)},f=c=>t.iv`
    padding: ${c.spacing(0,1,0,1)};
  `,x=()=>({sm:t.iv`
      width: ${d("sm")};
    `,md:t.iv`
      width: ${d("md")};
    `,lg:t.iv`
      width: ${d("lg")};
    `,auto:t.iv`
      width: ${d("auto")};
    `}),d=c=>{switch(c){case"sm":return"200px";case"md":return"320px";case"lg":return"580px";case"auto":default:return"auto"}};function i(c,E){switch(c){case"sm":return{padding:1,fontSize:E.typography.size.sm,height:E.components.height.sm};case"lg":return{padding:3,fontSize:E.typography.size.lg,height:E.components.height.lg};case"md":default:return{padding:2,fontSize:E.typography.size.md,height:E.components.height.md}}}},"./src/components/Icon/Icon.tsx":function(se,V,e){"use strict";e.d(V,{J:function(){return Va}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-inlinesvg-virtual-84828eeaad/2/yarn/cache/react-inlinesvg-npm-3.0.2-ba939b6936-05e31af59d.zip/node_modules/react-inlinesvg/esm/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts"),f=e("./src/themes/ThemeContext.tsx"),x='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2a10,10,0,1,0,5,18.66,1,1,0,1,0-1-1.73A8,8,0,1,1,20,12v.75a1.75,1.75,0,0,1-3.5,0V8.5a1,1,0,0,0-1-1,1,1,0,0,0-1,.79A4.45,4.45,0,0,0,12,7.5,4.5,4.5,0,1,0,15.3,15,3.74,3.74,0,0,0,22,12.75V12A10,10,0,0,0,12,2Zm0,12.5A2.5,2.5,0,1,1,14.5,12,2.5,2.5,0,0,1,12,14.5Z"/></svg>',d='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17,7A7.74,7.74,0,1,0,7,17,7.74,7.74,0,1,0,17,7Zm-1.6,1.6a6.12,6.12,0,0,1,.11,1.14,5.92,5.92,0,0,1-.16,1.34L12.91,8.66a5.92,5.92,0,0,1,1.34-.16A6.12,6.12,0,0,1,15.39,8.61ZM14.46,13A6,6,0,0,1,13,14.46L9.54,11A6,6,0,0,1,11,9.54Zm-8,1.46a5.75,5.75,0,1,1,8-8h-.25A7.76,7.76,0,0,0,6.5,14.25C6.5,14.33,6.51,14.42,6.51,14.5Zm2.1.89a6.12,6.12,0,0,1-.11-1.14,5.92,5.92,0,0,1,.16-1.34l2.43,2.43a5.92,5.92,0,0,1-1.34.16A6.12,6.12,0,0,1,8.61,15.39ZM14.25,20A5.77,5.77,0,0,1,9.5,17.49h.25A7.76,7.76,0,0,0,17.5,9.75c0-.08,0-.17,0-.25A5.75,5.75,0,0,1,14.25,20Z"/></svg>',i='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.29,11.46a1,1,0,0,0,1.42,0l3-3A1,1,0,1,0,14.29,7L12,9.34,9.71,7A1,1,0,1,0,8.29,8.46Zm3,1.08L12,14.84l-2.29-2.3A1,1,0,0,0,8.29,14l3,3a1,1,0,0,0,1.42,0l3-3a1,1,0,0,0-1.42-1.42Z"/></svg>',c='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.46,8.29A1,1,0,1,0,7,9.71L9.34,12,7,14.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l3-3a1,1,0,0,0,0-1.42Zm8.5,3-3-3a1,1,0,0,0-1.42,1.42L14.84,12l-2.3,2.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l3-3A1,1,0,0,0,17,11.29Z"/></svg>',E='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17,9.17a1,1,0,0,0-1.41,0L12,12.71,8.46,9.17a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42l4.24,4.24a1,1,0,0,0,1.42,0L17,10.59A1,1,0,0,0,17,9.17Z"/></svg>',O='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.29,12l3.54-3.54a1,1,0,0,0,0-1.41,1,1,0,0,0-1.42,0L9.17,11.29a1,1,0,0,0,0,1.42L13.41,17a1,1,0,0,0,.71.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41Z"/></svg>',m='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14.83,11.29,10.59,7.05a1,1,0,0,0-1.42,0,1,1,0,0,0,0,1.41L12.71,12,9.17,15.54a1,1,0,0,0,0,1.41,1,1,0,0,0,.71.29,1,1,0,0,0,.71-.29l4.24-4.24A1,1,0,0,0,14.83,11.29Z"/></svg>',w='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17,13.41,12.71,9.17a1,1,0,0,0-1.42,0L7.05,13.41a1,1,0,0,0,0,1.42,1,1,0,0,0,1.41,0L12,11.29l3.54,3.54a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29A1,1,0,0,0,17,13.41Z"/></svg>',_='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10,13H3a1,1,0,0,0-1,1v7a1,1,0,0,0,1,1h7a1,1,0,0,0,1-1V14A1,1,0,0,0,10,13ZM9,20H4V15H9ZM21,2H14a1,1,0,0,0-1,1v7a1,1,0,0,0,1,1h7a1,1,0,0,0,1-1V3A1,1,0,0,0,21,2ZM20,9H15V4h5Zm1,4H14a1,1,0,0,0-1,1v7a1,1,0,0,0,1,1h7a1,1,0,0,0,1-1V14A1,1,0,0,0,21,13Zm-1,7H15V15h5ZM10,2H3A1,1,0,0,0,2,3v7a1,1,0,0,0,1,1h7a1,1,0,0,0,1-1V3A1,1,0,0,0,10,2ZM9,9H4V4H9Z"/></svg>',C='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.71,6.29a1,1,0,0,0-1.42,0l-5,5a1,1,0,0,0,0,1.42l5,5a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L5.41,12l4.3-4.29A1,1,0,0,0,9.71,6.29Zm11,5-5-5a1,1,0,0,0-1.42,1.42L18.59,12l-4.3,4.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l5-5A1,1,0,0,0,20.71,11.29Z"/></svg>',b='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M17.71,11.29a1,1,0,0,0-1.42,0L13,14.59V7a1,1,0,0,0-2,0v7.59l-3.29-3.3a1,1,0,0,0-1.42,1.42l5,5a1,1,0,0,0,.33.21.94.94,0,0,0,.76,0,1,1,0,0,0,.33-.21l5-5A1,1,0,0,0,17.71,11.29Z"/></svg>',g='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3,4A1,1,0,0,0,2,5V19a1,1,0,0,0,2,0V5A1,1,0,0,0,3,4Zm18.92,7.62a1,1,0,0,0-.21-.33l-4-4a1,1,0,1,0-1.42,1.42L18.59,11H7a1,1,0,0,0,0,2H18.59l-2.3,2.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l4-4a1,1,0,0,0,.21-.33A1,1,0,0,0,21.92,11.62Z"/></svg>',v='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M17,11H9.41l3.3-3.29a1,1,0,1,0-1.42-1.42l-5,5a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l5,5a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L9.41,13H17a1,1,0,0,0,0-2Z"/></svg>',y='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.7,10a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41L3.84,2.29A1,1,0,0,0,2.42,3.71ZM21,14a1,1,0,0,0-1,1v3.59L15.44,14A1,1,0,0,0,14,15.44L18.59,20H15a1,1,0,0,0,0,2h6a1,1,0,0,0,.38-.08,1,1,0,0,0,.54-.54A1,1,0,0,0,22,21V15A1,1,0,0,0,21,14Zm.92-11.38a1,1,0,0,0-.54-.54A1,1,0,0,0,21,2H15a1,1,0,0,0,0,2h3.59L2.29,20.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0L20,5.41V9a1,1,0,0,0,2,0V3A1,1,0,0,0,21.92,2.62Z"/></svg>',h='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M17.92,11.62a1,1,0,0,0-.21-.33l-5-5a1,1,0,0,0-1.42,1.42L14.59,11H7a1,1,0,0,0,0,2h7.59l-3.3,3.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l5-5a1,1,0,0,0,.21-.33A1,1,0,0,0,17.92,11.62Z"/></svg>',s='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17.71,11.29l-4-4a1,1,0,1,0-1.42,1.42L14.59,11H3a1,1,0,0,0,0,2H14.59l-2.3,2.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l4-4a1,1,0,0,0,.21-.33,1,1,0,0,0,0-.76A1,1,0,0,0,17.71,11.29ZM21,4a1,1,0,0,0-1,1V19a1,1,0,0,0,2,0V5A1,1,0,0,0,21,4Z"/></svg>',o='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M17.71,11.29l-5-5a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,1,1,0,0,0-.33.21l-5,5a1,1,0,0,0,1.42,1.42L11,9.41V17a1,1,0,0,0,2,0V9.41l3.29,3.3a1,1,0,0,0,1.42,0A1,1,0,0,0,17.71,11.29Z"/></svg>',r='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.92,11.62a1,1,0,0,0-.21-.33l-4-4a1,1,0,1,0-1.42,1.42L18.59,11H5.41l2.3-2.29A1,1,0,1,0,6.29,7.29l-4,4a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l4,4a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L5.41,13H18.59l-2.3,2.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l4-4a1,1,0,0,0,.21-.33A1,1,0,0,0,21.92,11.62Z"/></svg>',u='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.67,5.85a2.63,2.63,0,0,0-2.67,0L14,8.15h0a2.67,2.67,0,0,0-4-2.31L3.33,9.69a2.67,2.67,0,0,0,0,4.62L10,18.16a2.66,2.66,0,0,0,2.67,0A2.65,2.65,0,0,0,14,15.85h0l4,2.31a2.69,2.69,0,0,0,1.33.36,2.61,2.61,0,0,0,1.34-.37A2.63,2.63,0,0,0,22,15.85V8.15A2.63,2.63,0,0,0,20.67,5.85ZM12,15.85a.66.66,0,0,1-.33.58.69.69,0,0,1-.67,0L4.33,12.58a.67.67,0,0,1,0-1.16L11,7.57a.67.67,0,0,1,.67,0,.66.66,0,0,1,.33.58Zm8,0a.67.67,0,0,1-1,.57l-5-2.88V10.46l5-2.88a.67.67,0,0,1,1,.57Z"/></svg>',p='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3,8H21a1,1,0,0,0,0-2H3A1,1,0,0,0,3,8Zm18,8H3a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2Zm0-5H3a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2Z"/></svg>',S='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M18,13.18V10a6,6,0,0,0-5-5.91V3a1,1,0,0,0-2,0V4.09A6,6,0,0,0,6,10v3.18A3,3,0,0,0,4,16v2a1,1,0,0,0,1,1H8.14a4,4,0,0,0,7.72,0H19a1,1,0,0,0,1-1V16A3,3,0,0,0,18,13.18ZM8,10a4,4,0,0,1,8,0v3H8Zm4,10a2,2,0,0,1-1.72-1h3.44A2,2,0,0,1,12,20Zm6-3H6V16a1,1,0,0,1,1-1H17a1,1,0,0,1,1,1Z"/></svg>',k='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M11.07,6.12A3.48,3.48,0,0,1,12,6a4,4,0,0,1,4,4v1.34a1,1,0,0,0,2,0V10a6,6,0,0,0-5-5.91V3a1,1,0,0,0-2,0V4.1l-.45.08a1,1,0,0,0,.52,1.94ZM21.71,20.29l-18-18A1,1,0,0,0,2.29,3.71L6.41,7.82A6,6,0,0,0,6,10v3.18A3,3,0,0,0,4,16v2a1,1,0,0,0,1,1H8.14a4,4,0,0,0,7.72,0h1.73l2.7,2.71a1,1,0,0,0,1.42,0A1,1,0,0,0,21.71,20.29ZM8,10a3.31,3.31,0,0,1,0-.55L11.59,13H8Zm4,10a2,2,0,0,1-1.72-1h3.44A2,2,0,0,1,12,20ZM6,17V16a1,1,0,0,1,1-1h6.59l2,2Z"/></svg>',D='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.87,8.6A1,1,0,0,0,19,8H14.42l1.27-4.74a1,1,0,0,0-.17-.87A1,1,0,0,0,14.73,2h-7a1,1,0,0,0-1,.74l-2.68,10a1,1,0,0,0,.17.87,1,1,0,0,0,.8.39H8.89L7.08,20.74a1,1,0,0,0,1.71.93l10.9-12A1,1,0,0,0,19.87,8.6Zm-9.79,8.68,1.07-4a1,1,0,0,0-.17-.87,1,1,0,0,0-.79-.39H6.35L8.49,4h4.93L12.15,8.74a1,1,0,0,0,1,1.26h3.57Z"/></svg>',M='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M15,6H9A1,1,0,0,0,8,7v4a1,1,0,0,0,1,1h6a1,1,0,0,0,1-1V7A1,1,0,0,0,15,6Zm-1,4H10V8h4Zm3-8H5A1,1,0,0,0,4,3V21a1,1,0,0,0,1,1H17a3,3,0,0,0,3-3V5A3,3,0,0,0,17,2Zm1,17a1,1,0,0,1-1,1H6V4H17a1,1,0,0,1,1,1Z"/></svg>',I='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.17,2.06A13.1,13.1,0,0,0,19,1.87a12.94,12.94,0,0,0-7,2.05,12.94,12.94,0,0,0-7-2,13.1,13.1,0,0,0-2.17.19,1,1,0,0,0-.83,1v12a1,1,0,0,0,1.17,1,10.9,10.9,0,0,1,8.25,1.91l.12.07.11,0a.91.91,0,0,0,.7,0l.11,0,.12-.07A10.9,10.9,0,0,1,20.83,16a1,1,0,0,0,1.17-1v-12A1,1,0,0,0,21.17,2.06ZM11,15.35a12.87,12.87,0,0,0-6-1.48c-.33,0-.66,0-1,0v-10a8.69,8.69,0,0,1,1,0,10.86,10.86,0,0,1,6,1.8Zm9-1.44c-.34,0-.67,0-1,0a12.87,12.87,0,0,0-6,1.48V5.67a10.86,10.86,0,0,1,6-1.8,8.69,8.69,0,0,1,1,0Zm1.17,4.15A13.1,13.1,0,0,0,19,17.87a12.94,12.94,0,0,0-7,2.05,12.94,12.94,0,0,0-7-2.05,13.1,13.1,0,0,0-2.17.19A1,1,0,0,0,2,19.21,1,1,0,0,0,3.17,20a10.9,10.9,0,0,1,8.25,1.91,1,1,0,0,0,1.16,0A10.9,10.9,0,0,1,20.83,20,1,1,0,0,0,22,19.21,1,1,0,0,0,21.17,18.06Z"/></svg>',T='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M6,6A2,2,0,0,1,8,4,1,1,0,0,0,8,2,4,4,0,0,0,4,6V9a2,2,0,0,1-2,2,1,1,0,0,0,0,2,2,2,0,0,1,2,2v3a4,4,0,0,0,4,4,1,1,0,0,0,0-2,2,2,0,0,1-2-2V15a4,4,0,0,0-1.38-3A4,4,0,0,0,6,9Zm16,5a2,2,0,0,1-2-2V6a4,4,0,0,0-4-4,1,1,0,0,0,0,2,2,2,0,0,1,2,2V9a4,4,0,0,0,1.38,3A4,4,0,0,0,18,15v3a2,2,0,0,1-2,2,1,1,0,0,0,0,2,4,4,0,0,0,4-4V15a2,2,0,0,1,2-2,1,1,0,0,0,0-2Z"/></svg>',j='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M19,14h2a1,1,0,0,0,0-2H19V11a5.15,5.15,0,0,0-.21-1.36A5,5,0,0,0,22,5a1,1,0,0,0-2,0,3,3,0,0,1-2.14,2.87A5,5,0,0,0,16,6.4,2.58,2.58,0,0,0,16,6,4,4,0,0,0,8,6a2.58,2.58,0,0,0,0,.4,5,5,0,0,0-1.9,1.47A3,3,0,0,1,4,5,1,1,0,0,0,2,5,5,5,0,0,0,5.21,9.64,5.15,5.15,0,0,0,5,11v1H3a1,1,0,0,0,0,2H5v1a7,7,0,0,0,.14,1.38A5,5,0,0,0,2,21a1,1,0,0,0,2,0,3,3,0,0,1,1.81-2.74,7,7,0,0,0,12.38,0A3,3,0,0,1,20,21a1,1,0,0,0,2,0,5,5,0,0,0-3.14-4.62A7,7,0,0,0,19,15Zm-8,5.9A5,5,0,0,1,7,15V11a3,3,0,0,1,3-3h1ZM10,6a2,2,0,0,1,4,0Zm7,9a5,5,0,0,1-4,4.9V8h1a3,3,0,0,1,3,3Z"/></svg>',K='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M14,8h1a1,1,0,0,0,0-2H14a1,1,0,0,0,0,2Zm0,4h1a1,1,0,0,0,0-2H14a1,1,0,0,0,0,2ZM9,8h1a1,1,0,0,0,0-2H9A1,1,0,0,0,9,8Zm0,4h1a1,1,0,0,0,0-2H9a1,1,0,0,0,0,2Zm12,8H20V3a1,1,0,0,0-1-1H5A1,1,0,0,0,4,3V20H3a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2Zm-8,0H11V16h2Zm5,0H15V15a1,1,0,0,0-1-1H10a1,1,0,0,0-1,1v5H6V4H18Z"/></svg>',F='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5.5,8H6v.5a1,1,0,0,0,2,0V8h.5a1,1,0,0,0,0-2H8V5.5a1,1,0,0,0-2,0V6H5.5a1,1,0,0,0,0,2ZM4.88,19.12a1,1,0,0,0,1.41,0L7,18.41l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41L8.41,17l.71-.71a1,1,0,0,0-1.41-1.41L7,15.59l-.71-.71a1,1,0,0,0-1.41,1.41l.71.71-.71.71A1,1,0,0,0,4.88,19.12ZM20,1H4A3,3,0,0,0,1,4V20a3,3,0,0,0,3,3H20a3,3,0,0,0,3-3V4A3,3,0,0,0,20,1ZM11,21H4a1,1,0,0,1-1-1V13h8Zm0-10H3V4A1,1,0,0,1,4,3h7Zm10,9a1,1,0,0,1-1,1H13V13h8Zm0-9H13V3h7a1,1,0,0,1,1,1Zm-5.5,5.5h3a1,1,0,0,0,0-2h-3a1,1,0,0,0,0,2ZM18.5,6h-3a1,1,0,0,0,0,2h3a1,1,0,0,0,0-2Zm-3,13.5h3a1,1,0,0,0,0-2h-3a1,1,0,0,0,0,2Z"/></svg>',$='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M12,19a1,1,0,1,0-1-1A1,1,0,0,0,12,19Zm5,0a1,1,0,1,0-1-1A1,1,0,0,0,17,19Zm0-4a1,1,0,1,0-1-1A1,1,0,0,0,17,15Zm-5,0a1,1,0,1,0-1-1A1,1,0,0,0,12,15ZM19,3H18V2a1,1,0,0,0-2,0V3H8V2A1,1,0,0,0,6,2V3H5A3,3,0,0,0,2,6V20a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V6A3,3,0,0,0,19,3Zm1,17a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V11H20ZM20,9H4V6A1,1,0,0,1,5,5H6V6A1,1,0,0,0,8,6V5h8V6a1,1,0,0,0,2,0V5h1a1,1,0,0,1,1,1ZM7,15a1,1,0,1,0-1-1A1,1,0,0,0,7,15Zm0,4a1,1,0,1,0-1-1A1,1,0,0,0,7,19Z"/></svg>',R='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M11.66,7H15V8a1,1,0,0,0,2,0V7h1a1,1,0,0,1,1,1v3H17.66a1,1,0,0,0,0,2H19v1.34a1,1,0,1,0,2,0V8a3,3,0,0,0-3-3H17V4a1,1,0,0,0-2,0V5H11.66a1,1,0,0,0,0,2ZM21.71,20.29l-1.6-1.6h0L3.71,2.29A1,1,0,0,0,2.29,3.71L4.2,5.61A3,3,0,0,0,3,8V18a3,3,0,0,0,3,3H18a3,3,0,0,0,1.29-.3l1,1a1,1,0,0,0,1.42,0A1,1,0,0,0,21.71,20.29ZM5,8a1,1,0,0,1,.66-.93L9.59,11H5ZM6,19a1,1,0,0,1-1-1V13h6.59l6,6Z"/></svg>',U='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,6.5H17.72l-.32-1a3,3,0,0,0-2.84-2H9.44A3,3,0,0,0,6.6,5.55l-.32,1H5a3,3,0,0,0-3,3v8a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3v-8A3,3,0,0,0,19,6.5Zm1,11a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1v-8a1,1,0,0,1,1-1H7a1,1,0,0,0,1-.68l.54-1.64a1,1,0,0,1,.95-.68h5.12a1,1,0,0,1,.95.68l.54,1.64A1,1,0,0,0,17,8.5h2a1,1,0,0,1,1,1Zm-8-9a4,4,0,1,0,4,4A4,4,0,0,0,12,8.5Zm0,6a2,2,0,1,1,2-2A2,2,0,0,1,12,14.5Z"/></svg>',H='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M18,7h1V8a1,1,0,0,0,2,0V7h1a1,1,0,0,0,0-2H21V4a1,1,0,0,0-2,0V5H18a1,1,0,0,0,0,2Zm2,9a3,3,0,0,0-1.73.56l-2.45-1.45A3.74,3.74,0,0,0,16,14a4,4,0,0,0-3-3.86V7.82a3,3,0,1,0-2,0v2.32A4,4,0,0,0,8,14a3.74,3.74,0,0,0,.18,1.11L5.73,16.56A3,3,0,0,0,4,16a3,3,0,1,0,3,3,3,3,0,0,0-.12-.8l2.3-1.37a4,4,0,0,0,5.64,0l2.3,1.37A3,3,0,1,0,20,16ZM4,20a1,1,0,1,1,1-1A1,1,0,0,1,4,20ZM12,4a1,1,0,1,1-1,1A1,1,0,0,1,12,4Zm0,12a2,2,0,1,1,2-2A2,2,0,0,1,12,16Zm8,4a1,1,0,1,1,1-1A1,1,0,0,1,20,20Z"/></svg>',W='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7,16a1.5,1.5,0,0,0,1.5-1.5.77.77,0,0,0,0-.15l2.79-2.79.23,0,.23,0,1.61,1.61s0,.05,0,.08a1.5,1.5,0,1,0,3,0v-.08L20,9.5h0A1.5,1.5,0,1,0,18.5,8a.77.77,0,0,0,0,.15l-3.61,3.61h-.16L13,10a1.49,1.49,0,0,0-3,0L7,13H7a1.5,1.5,0,0,0,0,3Zm13.5,4H3.5V3a1,1,0,0,0-2,0V21a1,1,0,0,0,1,1h18a1,1,0,0,0,0-2Z"/></svg>',oe='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18.71,7.21a1,1,0,0,0-1.42,0L9.84,14.67,6.71,11.53A1,1,0,1,0,5.29,13l3.84,3.84a1,1,0,0,0,1.42,0l8.16-8.16A1,1,0,0,0,18.71,7.21Z"/></svg>',Q='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14.72,8.79l-4.29,4.3L8.78,11.44a1,1,0,1,0-1.41,1.41l2.35,2.36a1,1,0,0,0,.71.29,1,1,0,0,0,.7-.29l5-5a1,1,0,0,0,0-1.42A1,1,0,0,0,14.72,8.79ZM12,2A10,10,0,1,0,22,12,10,10,0,0,0,12,2Zm0,18a8,8,0,1,1,8-8A8,8,0,0,1,12,20Z"/></svg>',P='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2A10,10,0,1,0,22,12,10,10,0,0,0,12,2Zm0,18a8,8,0,1,1,8-8A8,8,0,0,1,12,20Z"/></svg>',ae='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M15,14H9a1,1,0,0,0,0,2h6a1,1,0,0,0,0-2Zm0-4H11a1,1,0,0,0,0,2h4a1,1,0,0,0,0-2Zm2-6H15.82A3,3,0,0,0,13,2H11A3,3,0,0,0,8.18,4H7A3,3,0,0,0,4,7V19a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V7A3,3,0,0,0,17,4ZM10,5a1,1,0,0,1,1-1h2a1,1,0,0,1,1,1V6H10Zm8,14a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V7A1,1,0,0,1,7,6H8V7A1,1,0,0,0,9,8h6a1,1,0,0,0,1-1V6h1a1,1,0,0,1,1,1Z"/></svg>',q='<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,6a.99974.99974,0,0,0-1,1v4H9a1,1,0,0,0,0,2h3a.99974.99974,0,0,0,1-1V7A.99974.99974,0,0,0,12,6Zm0-4A10,10,0,1,0,22,12,10.01146,10.01146,0,0,0,12,2Zm0,18a8,8,0,1,1,8-8A8.00917,8.00917,0,0,1,12,20Z"/></svg>',Y='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18.42,9.21a7,7,0,0,0-13.36,1.9A4,4,0,0,0,6,19H17a5,5,0,0,0,1.42-9.79ZM17,17H6a2,2,0,0,1,0-4,1,1,0,0,0,1-1,5,5,0,0,1,9.73-1.61,1,1,0,0,0,.78.66A3,3,0,0,1,17,17Z"/></svg>',ve='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M14.29,17.29,13,18.59V13a1,1,0,0,0-2,0v5.59l-1.29-1.3a1,1,0,0,0-1.42,1.42l3,3a1,1,0,0,0,.33.21.94.94,0,0,0,.76,0,1,1,0,0,0,.33-.21l3-3a1,1,0,0,0-1.42-1.42ZM18.42,6.22A7,7,0,0,0,5.06,8.11,4,4,0,0,0,6,16a1,1,0,0,0,0-2,2,2,0,0,1,0-4A1,1,0,0,0,7,9a5,5,0,0,1,9.73-1.61,1,1,0,0,0,.78.67,3,3,0,0,1,.24,5.84,1,1,0,1,0,.5,1.94,5,5,0,0,0,.17-9.62Z"/></svg>',re='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M17,6.06a3,3,0,0,0-1.15,5.77A2,2,0,0,1,14,13.06H10a3.91,3.91,0,0,0-2,.56V7.88a3,3,0,1,0-2,0v8.36a3,3,0,1,0,2.16.05A2,2,0,0,1,10,15.06h4a4,4,0,0,0,3.91-3.16A3,3,0,0,0,17,6.06Zm-10-2a1,1,0,1,1-1,1A1,1,0,0,1,7,4.06Zm0,16a1,1,0,1,1,1-1A1,1,0,0,1,7,20.06Zm10-10a1,1,0,1,1,1-1A1,1,0,0,1,17,10.06Z"/></svg>',je='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.32,9.55l-1.89-.63.89-1.78A1,1,0,0,0,20.13,6L18,3.87a1,1,0,0,0-1.15-.19l-1.78.89-.63-1.89A1,1,0,0,0,13.5,2h-3a1,1,0,0,0-.95.68L8.92,4.57,7.14,3.68A1,1,0,0,0,6,3.87L3.87,6a1,1,0,0,0-.19,1.15l.89,1.78-1.89.63A1,1,0,0,0,2,10.5v3a1,1,0,0,0,.68.95l1.89.63-.89,1.78A1,1,0,0,0,3.87,18L6,20.13a1,1,0,0,0,1.15.19l1.78-.89.63,1.89a1,1,0,0,0,.95.68h3a1,1,0,0,0,.95-.68l.63-1.89,1.78.89A1,1,0,0,0,18,20.13L20.13,18a1,1,0,0,0,.19-1.15l-.89-1.78,1.89-.63A1,1,0,0,0,22,13.5v-3A1,1,0,0,0,21.32,9.55ZM20,12.78l-1.2.4A2,2,0,0,0,17.64,16l.57,1.14-1.1,1.1L16,17.64a2,2,0,0,0-2.79,1.16l-.4,1.2H11.22l-.4-1.2A2,2,0,0,0,8,17.64l-1.14.57-1.1-1.1L6.36,16A2,2,0,0,0,5.2,13.18L4,12.78V11.22l1.2-.4A2,2,0,0,0,6.36,8L5.79,6.89l1.1-1.1L8,6.36A2,2,0,0,0,10.82,5.2l.4-1.2h1.56l.4,1.2A2,2,0,0,0,16,6.36l1.14-.57,1.1,1.1L17.64,8a2,2,0,0,0,1.16,2.79l1.2.4ZM12,8a4,4,0,1,0,4,4A4,4,0,0,0,12,8Zm0,6a2,2,0,1,1,2-2A2,2,0,0,1,12,14Z"/></svg>',me='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,2H3A1,1,0,0,0,2,3V21a1,1,0,0,0,1,1H21a1,1,0,0,0,1-1V3A1,1,0,0,0,21,2ZM11,20H4V4h7Zm9,0H13V4h7Z"/></svg>',ne='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,2H5A3,3,0,0,0,2,5V15a3,3,0,0,0,3,3H16.59l3.7,3.71A1,1,0,0,0,21,22a.84.84,0,0,0,.38-.08A1,1,0,0,0,22,21V5A3,3,0,0,0,19,2Zm1,16.59-2.29-2.3A1,1,0,0,0,17,16H5a1,1,0,0,1-1-1V5A1,1,0,0,1,5,4H19a1,1,0,0,1,1,1Z"/></svg>',Z='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.5,6.5h-5a1,1,0,0,0,0,2h5a1,1,0,0,1,1,1v9.72l-1.57-1.45a1,1,0,0,0-.68-.27H9.5a1,1,0,0,1-1-1v-2a1,1,0,0,0-2,0v2a3,3,0,0,0,3,3h8.36l3,2.73a1,1,0,0,0,.68.27,1.1,1.1,0,0,0,.4-.08,1,1,0,0,0,.6-.92V9.5A3,3,0,0,0,19.5,6.5Zm-10,5A2,2,0,1,0,8.32,7.89l-1.75-.8,1.91-.88a2,2,0,0,0,1,.29,2,2,0,1,0-2-2l-1.9.87A2,2,0,0,0,4.5,5a2,2,0,0,0,0,4,2,2,0,0,0,.93-.24l2.09,1A2,2,0,0,0,9.5,11.5Z"/></svg>',te='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,8H18V5a3,3,0,0,0-3-3H5A3,3,0,0,0,2,5V17a1,1,0,0,0,.62.92A.84.84,0,0,0,3,18a1,1,0,0,0,.71-.29l2.81-2.82H8v1.44a3,3,0,0,0,3,3h6.92l2.37,2.38A1,1,0,0,0,21,22a.84.84,0,0,0,.38-.08A1,1,0,0,0,22,21V11A3,3,0,0,0,19,8ZM8,11v1.89H6.11a1,1,0,0,0-.71.29L4,14.59V5A1,1,0,0,1,5,4H15a1,1,0,0,1,1,1V8H11A3,3,0,0,0,8,11Zm12,7.59-1-1a1,1,0,0,0-.71-.3H11a1,1,0,0,1-1-1V11a1,1,0,0,1,1-1h8a1,1,0,0,1,1,1Z"/></svg>',Pe='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2A10,10,0,1,0,22,12,10,10,0,0,0,12,2Zm1,17.93V19a1,1,0,0,0-2,0v.93A8,8,0,0,1,4.07,13H5a1,1,0,0,0,0-2H4.07A8,8,0,0,1,11,4.07V5a1,1,0,0,0,2,0V4.07A8,8,0,0,1,19.93,11H19a1,1,0,0,0,0,2h.93A8,8,0,0,1,13,19.93ZM15.14,7.55l-5,2.12a1,1,0,0,0-.52.52l-2.12,5a1,1,0,0,0,.21,1.1,1,1,0,0,0,.7.3.93.93,0,0,0,.4-.09l5-2.12a1,1,0,0,0,.52-.52l2.12-5a1,1,0,0,0-1.31-1.31Zm-2.49,5.1-2.28,1,1-2.28,2.28-1Z"/></svg>',he='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,8.94a1.31,1.31,0,0,0-.06-.27l0-.09a1.07,1.07,0,0,0-.19-.28h0l-6-6h0a1.07,1.07,0,0,0-.28-.19.32.32,0,0,0-.09,0A.88.88,0,0,0,14.05,2H10A3,3,0,0,0,7,5V6H6A3,3,0,0,0,3,9V19a3,3,0,0,0,3,3h8a3,3,0,0,0,3-3V18h1a3,3,0,0,0,3-3V9S21,9,21,8.94ZM15,5.41,17.59,8H16a1,1,0,0,1-1-1ZM15,19a1,1,0,0,1-1,1H6a1,1,0,0,1-1-1V9A1,1,0,0,1,6,8H7v7a3,3,0,0,0,3,3h5Zm4-4a1,1,0,0,1-1,1H10a1,1,0,0,1-1-1V5a1,1,0,0,1,1-1h3V7a3,3,0,0,0,3,3h3Z"/></svg>',ie='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.92,12.62a1,1,0,0,0-.21-.33l-3-3a1,1,0,0,0-1.42,1.42L17.59,12H8a1,1,0,0,1-1-1V7A1,1,0,0,0,5,7v4a3,3,0,0,0,3,3h9.59l-1.3,1.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l3-3a1,1,0,0,0,.21-.33A1,1,0,0,0,20.92,12.62Z"/></svg>',Ce='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.47,7.37s0,0,0-.08l-.06-.15a.71.71,0,0,0-.07-.09.94.94,0,0,0-.09-.12l-.09-.07L20,6.78l-7.5-4.63a1,1,0,0,0-1.06,0L4,6.78l-.09.08-.09.07a.94.94,0,0,0-.09.12.71.71,0,0,0-.07.09l-.06.15s0,0,0,.08a1.15,1.15,0,0,0,0,.26v8.74a1,1,0,0,0,.47.85l7.5,4.63h0a.47.47,0,0,0,.15.06s.05,0,.08,0a.86.86,0,0,0,.52,0s.05,0,.08,0a.47.47,0,0,0,.15-.06h0L20,17.22a1,1,0,0,0,.47-.85V7.63A1.15,1.15,0,0,0,20.47,7.37ZM11,19.21l-5.5-3.4V9.43L11,12.82Zm1-8.12L6.4,7.63,12,4.18l5.6,3.45Zm6.5,4.72L13,19.21V12.82l5.5-3.39Z"/></svg>',Le='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M19.088,4.95453c-.00732-.00781-.00952-.01819-.01715-.02582s-.01819-.00995-.02606-.01733a9.97886,9.97886,0,0,0-14.08948,0c-.00787.00738-.01837.00964-.02606.01733s-.00983.018-.01715.02582a10,10,0,1,0,14.1759,0ZM12,20a7.9847,7.9847,0,0,1-6.235-3H9.78027a2.9636,2.9636,0,0,0,4.43946,0h4.01532A7.9847,7.9847,0,0,1,12,20Zm-1-5a1,1,0,1,1,1,1A1.001,1.001,0,0,1,11,15Zm8.41022.00208L19.3999,15H15a2.99507,2.99507,0,0,0-2-2.81573V9a1,1,0,0,0-2,0v3.18427A2.99507,2.99507,0,0,0,9,15H4.6001l-.01032.00208A7.93083,7.93083,0,0,1,4.06946,13H5a1,1,0,0,0,0-2H4.06946A7.95128,7.95128,0,0,1,5.68854,7.10211l.65472.65473A.99989.99989,0,1,0,7.75732,6.34277l-.65466-.65466A7.95231,7.95231,0,0,1,11,4.06946V5a1,1,0,0,0,2,0V4.06946a7.95231,7.95231,0,0,1,3.89734,1.61865l-.65466.65466a.99989.99989,0,1,0,1.41406,1.41407l.65472-.65473A7.95128,7.95128,0,0,1,19.93054,11H19a1,1,0,0,0,0,2h.93054A7.93083,7.93083,0,0,1,19.41022,15.00208Z"/></svg>',we='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8,16.5a1,1,0,1,0,1,1A1,1,0,0,0,8,16.5ZM12,2C8,2,4,3.37,4,6V18c0,2.63,4,4,8,4s8-1.37,8-4V6C20,3.37,16,2,12,2Zm6,16c0,.71-2.28,2-6,2s-6-1.29-6-2V14.73A13.16,13.16,0,0,0,12,16a13.16,13.16,0,0,0,6-1.27Zm0-6c0,.71-2.28,2-6,2s-6-1.29-6-2V8.73A13.16,13.16,0,0,0,12,10a13.16,13.16,0,0,0,6-1.27ZM12,8C8.28,8,6,6.71,6,6s2.28-2,6-2,6,1.29,6,2S15.72,8,12,8ZM8,10.5a1,1,0,1,0,1,1A1,1,0,0,0,8,10.5Z"/></svg>',ue='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,14a1,1,0,0,0-1,1v2a1,1,0,0,0,2,0V15A1,1,0,0,0,12,14Zm.38-2.92A1,1,0,0,0,11.8,11l-.18.06-.18.09-.15.12A1,1,0,0,0,11,12a1,1,0,0,0,.29.71,1,1,0,0,0,.33.21A.84.84,0,0,0,12,13a1,1,0,0,0,.71-.29A1,1,0,0,0,13,12a1,1,0,0,0-.29-.71A1.15,1.15,0,0,0,12.38,11.08ZM20,8.94a1.31,1.31,0,0,0-.06-.27l0-.09a1.07,1.07,0,0,0-.19-.28h0l-6-6h0a1.07,1.07,0,0,0-.28-.19l-.1,0A1.1,1.1,0,0,0,13.06,2H7A3,3,0,0,0,4,5V19a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V9S20,9,20,8.94ZM14,5.41,16.59,8H15a1,1,0,0,1-1-1ZM18,19a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V5A1,1,0,0,1,7,4h5V7a3,3,0,0,0,3,3h3Z"/></svg>',Ie='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.29,13.29a1,1,0,0,0,0,1.42l3,3a1,1,0,0,0,1.42,0l3-3a1,1,0,0,0-1.42-1.42L13,14.59V3a1,1,0,0,0-2,0V14.59l-1.29-1.3A1,1,0,0,0,8.29,13.29ZM18,9H16a1,1,0,0,0,0,2h2a1,1,0,0,1,1,1v7a1,1,0,0,1-1,1H6a1,1,0,0,1-1-1V12a1,1,0,0,1,1-1H8A1,1,0,0,0,8,9H6a3,3,0,0,0-3,3v7a3,3,0,0,0,3,3H18a3,3,0,0,0,3-3V12A3,3,0,0,0,18,9Z"/></svg>',qe='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M8.5,10a2,2,0,1,0,2,2A2,2,0,0,0,8.5,10Zm0,7a2,2,0,1,0,2,2A2,2,0,0,0,8.5,17Zm7-10a2,2,0,1,0-2-2A2,2,0,0,0,15.5,7Zm-7-4a2,2,0,1,0,2,2A2,2,0,0,0,8.5,3Zm7,14a2,2,0,1,0,2,2A2,2,0,0,0,15.5,17Zm0-7a2,2,0,1,0,2,2A2,2,0,0,0,15.5,10Z"/></svg>',Je='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,12a1,1,0,0,0-1,1v6a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V5A1,1,0,0,1,5,4h6a1,1,0,0,0,0-2H5A3,3,0,0,0,2,5V19a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V13A1,1,0,0,0,21,12ZM6,12.76V17a1,1,0,0,0,1,1h4.24a1,1,0,0,0,.71-.29l6.92-6.93h0L21.71,8a1,1,0,0,0,0-1.42L17.47,2.29a1,1,0,0,0-1.42,0L13.23,5.12h0L6.29,12.05A1,1,0,0,0,6,12.76ZM16.76,4.41l2.83,2.83L18.17,8.66,15.34,5.83ZM8,13.17l5.93-5.93,2.83,2.83L10.83,16H8Z"/></svg>',Ze='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,7a2,2,0,1,0-2-2A2,2,0,0,0,12,7Zm0,10a2,2,0,1,0,2,2A2,2,0,0,0,12,17Zm0-7a2,2,0,1,0,2,2A2,2,0,0,0,12,10Z"/></svg>',Oe='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,10a2,2,0,1,0,2,2A2,2,0,0,0,12,10ZM5,10a2,2,0,1,0,2,2A2,2,0,0,0,5,10Zm14,0a2,2,0,1,0,2,2A2,2,0,0,0,19,10Z"/></svg>',ce='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,4H5A3,3,0,0,0,2,7V17a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V7A3,3,0,0,0,19,4Zm-.41,2-5.88,5.88a1,1,0,0,1-1.42,0L5.41,6ZM20,17a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V7.41l5.88,5.88a3,3,0,0,0,4.24,0L20,7.41Z"/></svg>',pe='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.71,9.29l-4-4a1,1,0,0,0-1.42,1.42L18.59,9H7a1,1,0,0,0,0,2H21a1,1,0,0,0,.92-.62A1,1,0,0,0,21.71,9.29ZM17,13H3a1,1,0,0,0-.92.62,1,1,0,0,0,.21,1.09l4,4a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L5.41,15H17a1,1,0,0,0,0-2Z"/></svg>',J='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,16a1,1,0,1,0,1,1A1,1,0,0,0,12,16Zm10.67,1.47-8.05-14a3,3,0,0,0-5.24,0l-8,14A3,3,0,0,0,3.94,22H20.06a3,3,0,0,0,2.61-4.53Zm-1.73,2a1,1,0,0,1-.88.51H3.94a1,1,0,0,1-.88-.51,1,1,0,0,1,0-1l8-14a1,1,0,0,1,1.78,0l8.05,14A1,1,0,0,1,20.94,19.49ZM12,8a1,1,0,0,0-1,1v4a1,1,0,0,0,2,0V9A1,1,0,0,0,12,8Z"/></svg>',L='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18,10.82a1,1,0,0,0-1,1V19a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V8A1,1,0,0,1,5,7h7.18a1,1,0,0,0,0-2H5A3,3,0,0,0,2,8V19a3,3,0,0,0,3,3H16a3,3,0,0,0,3-3V11.82A1,1,0,0,0,18,10.82Zm3.92-8.2a1,1,0,0,0-.54-.54A1,1,0,0,0,21,2H15a1,1,0,0,0,0,2h3.59L8.29,14.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0L20,5.41V9a1,1,0,0,0,2,0V3A1,1,0,0,0,21.92,2.62Z"/></svg>',fe='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.92,11.6C19.9,6.91,16.1,4,12,4S4.1,6.91,2.08,11.6a1,1,0,0,0,0,.8C4.1,17.09,7.9,20,12,20s7.9-2.91,9.92-7.6A1,1,0,0,0,21.92,11.6ZM12,18c-3.17,0-6.17-2.29-7.9-6C5.83,8.29,8.83,6,12,6s6.17,2.29,7.9,6C18.17,15.71,15.17,18,12,18ZM12,8a4,4,0,1,0,4,4A4,4,0,0,0,12,8Zm0,6a2,2,0,1,1,2-2A2,2,0,0,1,12,14Z"/></svg>',xe='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M10.94,6.08A6.93,6.93,0,0,1,12,6c3.18,0,6.17,2.29,7.91,6a15.23,15.23,0,0,1-.9,1.64,1,1,0,0,0-.16.55,1,1,0,0,0,1.86.5,15.77,15.77,0,0,0,1.21-2.3,1,1,0,0,0,0-.79C19.9,6.91,16.1,4,12,4a7.77,7.77,0,0,0-1.4.12,1,1,0,1,0,.34,2ZM3.71,2.29A1,1,0,0,0,2.29,3.71L5.39,6.8a14.62,14.62,0,0,0-3.31,4.8,1,1,0,0,0,0,.8C4.1,17.09,7.9,20,12,20a9.26,9.26,0,0,0,5.05-1.54l3.24,3.25a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42Zm6.36,9.19,2.45,2.45A1.81,1.81,0,0,1,12,14a2,2,0,0,1-2-2A1.81,1.81,0,0,1,10.07,11.48ZM12,18c-3.18,0-6.17-2.29-7.9-6A12.09,12.09,0,0,1,6.8,8.21L8.57,10A4,4,0,0,0,14,15.43L15.59,17A7.24,7.24,0,0,1,12,18Z"/></svg>',We='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9,10h1a1,1,0,0,0,0-2H9a1,1,0,0,0,0,2Zm0,2a1,1,0,0,0,0,2h6a1,1,0,0,0,0-2ZM20,8.94a1.31,1.31,0,0,0-.06-.27l0-.09a1.07,1.07,0,0,0-.19-.28h0l-6-6h0a1.07,1.07,0,0,0-.28-.19.32.32,0,0,0-.09,0A.88.88,0,0,0,13.05,2H7A3,3,0,0,0,4,5V19a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V9S20,9,20,8.94ZM14,5.41,16.59,8H15a1,1,0,0,1-1-1ZM18,19a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V5A1,1,0,0,1,7,4h5V7a3,3,0,0,0,3,3h3Zm-3-3H9a1,1,0,0,0,0,2h6a1,1,0,0,0,0-2Z"/></svg>',Ue='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20,8.94a1.31,1.31,0,0,0-.06-.27l0-.09a1.07,1.07,0,0,0-.19-.28h0l-6-6h0a1.07,1.07,0,0,0-.28-.19l-.09,0A.88.88,0,0,0,13.05,2H7A3,3,0,0,0,4,5V19a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V9S20,9,20,8.94ZM14,5.41,16.59,8H15a1,1,0,0,1-1-1ZM18,19a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V5A1,1,0,0,1,7,4h5V7a3,3,0,0,0,3,3h3Z"/></svg>',at='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,2H5A3,3,0,0,0,2,5V6.17a3,3,0,0,0,.25,1.2l0,.06a2.81,2.81,0,0,0,.59.86L9,14.41V21a1,1,0,0,0,.47.85A1,1,0,0,0,10,22a1,1,0,0,0,.45-.11l4-2A1,1,0,0,0,15,19V14.41l6.12-6.12a2.81,2.81,0,0,0,.59-.86l0-.06A3,3,0,0,0,22,6.17V5A3,3,0,0,0,19,2ZM13.29,13.29A1,1,0,0,0,13,14v4.38l-2,1V14a1,1,0,0,0-.29-.71L5.41,8H18.59ZM20,6H4V5A1,1,0,0,1,5,4H19a1,1,0,0,1,1,1Z"/></svg>',it='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,5.5H12.72l-.32-1a3,3,0,0,0-2.84-2H5a3,3,0,0,0-3,3v13a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V8.5A3,3,0,0,0,19,5.5Zm1,13a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V5.5a1,1,0,0,1,1-1H9.56a1,1,0,0,1,.95.68l.54,1.64A1,1,0,0,0,12,7.5h7a1,1,0,0,1,1,1Z"/></svg>',_t='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M22.78,10.37A1,1,0,0,0,22,10H20V9a3,3,0,0,0-3-3H10.72l-.32-1A3,3,0,0,0,7.56,3H4A3,3,0,0,0,1,6V18a3,3,0,0,0,3,3H18.4a3,3,0,0,0,2.92-2.35L23,11.22A1,1,0,0,0,22.78,10.37ZM5.37,18.22a1,1,0,0,1-1,.78H4a1,1,0,0,1-1-1V6A1,1,0,0,1,4,5H7.56a1,1,0,0,1,1,.68l.54,1.64A1,1,0,0,0,10,8h7a1,1,0,0,1,1,1v1H8a1,1,0,0,0-1,.78Zm14,0a1,1,0,0,1-1,.78H7.21a1.42,1.42,0,0,0,.11-.35L8.8,12h12Z"/></svg>',wt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14,12.5H13v-1a1,1,0,0,0-2,0v1H10a1,1,0,0,0,0,2h1v1a1,1,0,0,0,2,0v-1h1a1,1,0,0,0,0-2Zm5-7H12.72l-.32-1a3,3,0,0,0-2.84-2H5a3,3,0,0,0-3,3v13a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V8.5A3,3,0,0,0,19,5.5Zm1,13a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V5.5a1,1,0,0,1,1-1H9.56a1,1,0,0,1,.95.68l.54,1.64A1,1,0,0,0,12,7.5h7a1,1,0,0,1,1,1Z"/></svg>',ee='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.71,10.79a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,1,1,0,0,0-.33.21l-2,2a1,1,0,0,0,1.42,1.42l.29-.3V16.5a1,1,0,0,0,2,0V13.91l.29.3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42ZM19,5.5H12.72l-.32-1a3,3,0,0,0-2.84-2H5a3,3,0,0,0-3,3v13a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V8.5A3,3,0,0,0,19,5.5Zm1,13a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V5.5a1,1,0,0,1,1-1H9.56a1,1,0,0,1,.95.68l.54,1.64A1,1,0,0,0,12,7.5h7a1,1,0,0,1,1,1Z"/></svg>',_e='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.67,9.69,14,5.84a2.67,2.67,0,0,0-4,2.31h0L6,5.84A2.67,2.67,0,0,0,2,8.15v7.7a2.63,2.63,0,0,0,1.33,2.3,2.61,2.61,0,0,0,1.34.37A2.69,2.69,0,0,0,6,18.16l4-2.31h0a2.65,2.65,0,0,0,1.33,2.31,2.66,2.66,0,0,0,2.67,0l6.67-3.85a2.67,2.67,0,0,0,0-4.62ZM10,13.54,5,16.42a.67.67,0,0,1-1-.57V8.15a.67.67,0,0,1,1-.57l5,2.88Zm9.67-1L13,16.43a.69.69,0,0,1-.67,0,.66.66,0,0,1-.33-.58V8.15a.66.66,0,0,1,.33-.58.78.78,0,0,1,.34-.09.63.63,0,0,1,.33.09l6.67,3.85a.67.67,0,0,1,0,1.16Z"/></svg>',ge='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6,13H2a1,1,0,0,0-1,1v8a1,1,0,0,0,1,1H6a1,1,0,0,0,1-1V14A1,1,0,0,0,6,13ZM5,21H3V15H5ZM22,9H18a1,1,0,0,0-1,1V22a1,1,0,0,0,1,1h4a1,1,0,0,0,1-1V10A1,1,0,0,0,22,9ZM21,21H19V11h2ZM14,1H10A1,1,0,0,0,9,2V22a1,1,0,0,0,1,1h4a1,1,0,0,0,1-1V2A1,1,0,0,0,14,1ZM13,21H11V3h2Z"/></svg>',de='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2A10,10,0,0,0,5.12,4.77V3a1,1,0,0,0-2,0V7.5a1,1,0,0,0,1,1H8.62a1,1,0,0,0,0-2H6.22A8,8,0,1,1,4,12a1,1,0,0,0-2,0A10,10,0,1,0,12,2Zm0,6a1,1,0,0,0-1,1v3a1,1,0,0,0,1,1h2a1,1,0,0,0,0-2H13V9A1,1,0,0,0,12,8Z"/></svg>',Ee='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20,8h0L14,2.74a3,3,0,0,0-4,0L4,8a3,3,0,0,0-1,2.26V19a3,3,0,0,0,3,3H18a3,3,0,0,0,3-3V10.25A3,3,0,0,0,20,8ZM14,20H10V15a1,1,0,0,1,1-1h2a1,1,0,0,1,1,1Zm5-1a1,1,0,0,1-1,1H16V15a3,3,0,0,0-3-3H11a3,3,0,0,0-3,3v5H6a1,1,0,0,1-1-1V10.25a1,1,0,0,1,.34-.75l6-5.25a1,1,0,0,1,1.32,0l6,5.25a1,1,0,0,1,.34.75Z"/></svg>',ze='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,14a1,1,0,0,0-1,1v4a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V15a1,1,0,0,0-2,0v4a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V15A1,1,0,0,0,21,14Zm-9.71,1.71a1,1,0,0,0,.33.21.94.94,0,0,0,.76,0,1,1,0,0,0,.33-.21l4-4a1,1,0,0,0-1.42-1.42L13,12.59V3a1,1,0,0,0-2,0v9.59l-2.29-2.3a1,1,0,1,0-1.42,1.42Z"/></svg>',le='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M12,10a1,1,0,0,0-1,1v6a1,1,0,0,0,2,0V11A1,1,0,0,0,12,10Zm0-4a1.25,1.25,0,1,0,1.25,1.25A1.25,1.25,0,0,0,12,6Z"/></svg>',ye='<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2A10,10,0,1,0,22,12,10.01114,10.01114,0,0,0,12,2Zm0,18a8,8,0,1,1,8-8A8.00917,8.00917,0,0,1,12,20Zm0-8.5a1,1,0,0,0-1,1v3a1,1,0,0,0,2,0v-3A1,1,0,0,0,12,11.5Zm0-4a1.25,1.25,0,1,0,1.25,1.25A1.25,1.25,0,0,0,12,7.5Z"/></svg>',Se=`<svg width="567" height="567" viewBox="0 0 567 567" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M441.118 53.8103L542.177 546.75H31.4615L196.718 183.554L290.242 254.396L307.934 267.797L319.661 248.955L441.118 53.8103Z" stroke="currentColor" stroke-width="40.5" fill="none" />
<path d="M232.072 428.282L265.231 475.2H300.671L261.676 420.785L296.342 372.669L273.347 356.785L263.183 370.157L232.034 414.099V325.79L201 300.477V475.161H232.034V428.244L232.072 428.282Z" fill="currentColor"/>
<path d="M410.7 404.129C407.994 397.946 403.936 392.419 398.796 387.975C390.178 379.318 378.545 374.332 366.333 373.985H365.405C363.821 373.985 362.197 374.178 360.69 374.642L390.719 330.004L366.796 313.309L355.473 330.004L326.526 374.216C321.541 381.559 317.406 388.013 314.816 392.496C312.15 397.25 309.831 402.197 307.937 407.298C305.773 412.709 304.652 418.506 304.652 424.342C304.575 431.259 305.966 438.139 308.749 444.515C311.493 450.892 315.589 456.573 320.691 461.288C330.7 471.027 344.149 476.477 358.101 476.477L359.222 476.399H360.458C374.526 476.361 388.091 470.95 398.217 461.172C403.434 456.457 407.569 450.699 410.352 444.245C413.134 437.791 414.564 430.834 414.448 423.839C414.68 417.076 413.405 410.351 410.7 404.129V404.129ZM375.569 440.303C371.241 444.593 365.405 446.989 359.299 447.027C353.231 447.066 347.434 444.67 343.144 440.38C338.855 436.09 336.459 430.293 336.459 424.226C336.459 418.158 338.855 412.361 343.144 408.071C347.434 403.781 353.231 401.385 359.299 401.385H359.492C362.507 401.385 365.482 402.004 368.226 403.163C371.009 404.361 373.482 406.062 375.569 408.264C377.772 410.274 379.511 412.709 380.671 415.453C381.869 418.197 382.449 421.134 382.449 424.11C382.371 430.216 379.898 436.013 375.569 440.303V440.303Z" fill="currentColor"/>
</svg>
`,Be='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.71,6.53,20.29,5.12l1.42-1.41a1,1,0,1,0-1.42-1.42L9.75,12.83a5,5,0,1,0,1.42,1.42l4.88-4.89,1.41,1.42a1,1,0,0,0,.71.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.42L17.46,8l1.42-1.42L20.29,8a1,1,0,0,0,.71.29A1,1,0,0,0,21.71,8,1,1,0,0,0,21.71,6.53ZM7,20a3,3,0,1,1,3-3A3,3,0,0,1,7,20Z"/></svg>',Xe='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6.21,13.29a.93.93,0,0,0-.33-.21,1,1,0,0,0-.76,0,.9.9,0,0,0-.54.54,1,1,0,1,0,1.84,0A1,1,0,0,0,6.21,13.29ZM13.5,11h1a1,1,0,0,0,0-2h-1a1,1,0,0,0,0,2Zm-4,0h1a1,1,0,0,0,0-2h-1a1,1,0,0,0,0,2Zm-3-2h-1a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2ZM20,5H4A3,3,0,0,0,1,8v8a3,3,0,0,0,3,3H20a3,3,0,0,0,3-3V8A3,3,0,0,0,20,5Zm1,11a1,1,0,0,1-1,1H4a1,1,0,0,1-1-1V8A1,1,0,0,1,4,7H20a1,1,0,0,1,1,1Zm-6-3H9a1,1,0,0,0,0,2h6a1,1,0,0,0,0-2Zm3.5-4h-1a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm.71,4.29a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,.93.93,0,0,0-.33.21,1,1,0,0,0-.21.33A1,1,0,1,0,19.5,14a.84.84,0,0,0-.08-.38A1,1,0,0,0,19.21,13.29Z"/></svg>',st='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10,17.55,8.23,19.27a2.47,2.47,0,0,1-3.5-3.5l4.54-4.55a2.46,2.46,0,0,1,3.39-.09l.12.1a1,1,0,0,0,1.4-1.43A2.75,2.75,0,0,0,14,9.59a4.46,4.46,0,0,0-6.09.22L3.31,14.36a4.48,4.48,0,0,0,6.33,6.33L11.37,19A1,1,0,0,0,10,17.55ZM20.69,3.31a4.49,4.49,0,0,0-6.33,0L12.63,5A1,1,0,0,0,14,6.45l1.73-1.72a2.47,2.47,0,0,1,3.5,3.5l-4.54,4.55a2.46,2.46,0,0,1-3.39.09l-.12-.1a1,1,0,0,0-1.4,1.43,2.75,2.75,0,0,0,.23.21,4.47,4.47,0,0,0,6.09-.22l4.55-4.55A4.49,4.49,0,0,0,20.69,3.31Z"/></svg>',mt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3.71,16.29a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,1,1,0,0,0-.33.21,1,1,0,0,0-.21.33,1,1,0,0,0,.21,1.09,1.15,1.15,0,0,0,.33.21.94.94,0,0,0,.76,0,1.15,1.15,0,0,0,.33-.21,1,1,0,0,0,.21-1.09A1,1,0,0,0,3.71,16.29ZM7,8H21a1,1,0,0,0,0-2H7A1,1,0,0,0,7,8ZM3.71,11.29a1,1,0,0,0-1.09-.21,1.15,1.15,0,0,0-.33.21,1,1,0,0,0-.21.33.94.94,0,0,0,0,.76,1.15,1.15,0,0,0,.21.33,1.15,1.15,0,0,0,.33.21.94.94,0,0,0,.76,0,1.15,1.15,0,0,0,.33-.21,1.15,1.15,0,0,0,.21-.33.94.94,0,0,0,0-.76A1,1,0,0,0,3.71,11.29ZM21,11H7a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2ZM3.71,6.29a1,1,0,0,0-.33-.21,1,1,0,0,0-1.09.21,1.15,1.15,0,0,0-.21.33.94.94,0,0,0,0,.76,1.15,1.15,0,0,0,.21.33,1.15,1.15,0,0,0,.33.21,1,1,0,0,0,1.09-.21,1.15,1.15,0,0,0,.21-.33.94.94,0,0,0,0-.76A1.15,1.15,0,0,0,3.71,6.29ZM21,16H7a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2Z"/></svg>',rt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17,9V7A5,5,0,0,0,7,7V9a3,3,0,0,0-3,3v7a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V12A3,3,0,0,0,17,9ZM9,7a3,3,0,0,1,6,0V9H9Zm9,12a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V12a1,1,0,0,1,1-1H17a1,1,0,0,1,1,1Z"/></svg>',lt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,11H5a1,1,0,0,0,0,2H19a1,1,0,0,0,0-2Z"/></svg>',ft='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2A10,10,0,1,0,22,12,10,10,0,0,0,12,2Zm0,18a8,8,0,1,1,8-8A8,8,0,0,1,12,20Zm4-9H8a1,1,0,0,0,0,2h8a1,1,0,0,0,0-2Z"/></svg>',St='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.71,16.29l-.15-.12a.76.76,0,0,0-.18-.09L12.2,16a1,1,0,0,0-.91.27,1.15,1.15,0,0,0-.21.33,1,1,0,0,0,1.3,1.31,1.46,1.46,0,0,0,.33-.22,1,1,0,0,0,.21-1.09A1,1,0,0,0,12.71,16.29ZM16,2H8A3,3,0,0,0,5,5V19a3,3,0,0,0,3,3h8a3,3,0,0,0,3-3V5A3,3,0,0,0,16,2Zm1,17a1,1,0,0,1-1,1H8a1,1,0,0,1-1-1V5A1,1,0,0,1,8,4h8a1,1,0,0,1,1,1Z"/></svg>',gt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,2H5A3,3,0,0,0,2,5V15a3,3,0,0,0,3,3H7.64l-.58,1a2,2,0,0,0,0,2,2,2,0,0,0,1.75,1h6.46A2,2,0,0,0,17,21a2,2,0,0,0,0-2l-.59-1H19a3,3,0,0,0,3-3V5A3,3,0,0,0,19,2ZM8.77,20,10,18H14l1.2,2ZM20,15a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V14H20Zm0-3H4V5A1,1,0,0,1,5,4H19a1,1,0,0,1,1,1Z"/></svg>',pt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16,2a3,3,0,0,0-3,3V19a3,3,0,0,0,6,0V5A3,3,0,0,0,16,2Zm1,17a1,1,0,0,1-2,0V5a1,1,0,0,1,2,0ZM8,2A3,3,0,0,0,5,5V19a3,3,0,0,0,6,0V5A3,3,0,0,0,8,2ZM9,19a1,1,0,0,1-2,0V5A1,1,0,0,1,9,5Z"/></svg>',ut='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M22,7.24a1,1,0,0,0-.29-.71L17.47,2.29A1,1,0,0,0,16.76,2a1,1,0,0,0-.71.29L13.22,5.12h0L2.29,16.05a1,1,0,0,0-.29.71V21a1,1,0,0,0,1,1H7.24A1,1,0,0,0,8,21.71L18.87,10.78h0L21.71,8a1.19,1.19,0,0,0,.22-.33,1,1,0,0,0,0-.24.7.7,0,0,0,0-.14ZM6.83,20H4V17.17l9.93-9.93,2.83,2.83ZM18.17,8.66,15.34,5.83l1.42-1.41,2.82,2.82Z"/></svg>',Ot='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18.54,9,8.88,3.46a3.42,3.42,0,0,0-5.13,3V17.58A3.42,3.42,0,0,0,7.17,21a3.43,3.43,0,0,0,1.71-.46L18.54,15a3.42,3.42,0,0,0,0-5.92Zm-1,4.19L7.88,18.81a1.44,1.44,0,0,1-1.42,0,1.42,1.42,0,0,1-.71-1.23V6.42a1.42,1.42,0,0,1,.71-1.23A1.51,1.51,0,0,1,7.17,5a1.54,1.54,0,0,1,.71.19l9.66,5.58a1.42,1.42,0,0,1,0,2.46Z"/></svg>',Wt='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M19,6H16V3a1,1,0,0,0-2,0V6H10V3A1,1,0,0,0,8,3V6H5A1,1,0,0,0,5,8H6v5a1,1,0,0,0,.29.71L9,16.41V21a1,1,0,0,0,2,0V17h2v4a1,1,0,0,0,2,0V16.41l2.71-2.7A1,1,0,0,0,18,13V8h1a1,1,0,0,0,0-2Zm-3,6.59L13.59,15H10.41L8,12.59V8h8ZM11,13h2a1,1,0,0,0,0-2H11a1,1,0,0,0,0,2Z"/></svg>',Ht='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19,11H13V5a1,1,0,0,0-2,0v6H5a1,1,0,0,0,0,2h6v6a1,1,0,0,0,2,0V13h6a1,1,0,0,0,0-2Z"/></svg>',on='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2A10,10,0,1,0,22,12,10,10,0,0,0,12,2Zm0,18a8,8,0,1,1,8-8A8,8,0,0,1,12,20Zm4-9H13V8a1,1,0,0,0-2,0v3H8a1,1,0,0,0,0,2h3v3a1,1,0,0,0,2,0V13h3a1,1,0,0,0,0-2Z"/></svg>',un='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10.21,6.21l.79-.8V10a1,1,0,0,0,2,0V5.41l.79.8a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42l-2.5-2.5a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,1,1,0,0,0-.33.21l-2.5,2.5a1,1,0,0,0,1.42,1.42ZM18,7.56A1,1,0,1,0,16.56,9,6.45,6.45,0,1,1,7.44,9,1,1,0,1,0,6,7.56a8.46,8.46,0,1,0,12,0Z"/></svg>',mn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,14H20V4h1a1,1,0,0,0,0-2H3A1,1,0,0,0,3,4H4V14H3a1,1,0,0,0,0,2h8v1.15l-4.55,3A1,1,0,0,0,7,22a.94.94,0,0,0,.55-.17L11,19.55V21a1,1,0,0,0,2,0V19.55l3.45,2.28A.94.94,0,0,0,17,22a1,1,0,0,0,.55-1.83l-4.55-3V16h8a1,1,0,0,0,0-2Zm-3,0H6V4H18ZM9.61,12.26a1.73,1.73,0,0,0,1.76,0l3-1.74a1.76,1.76,0,0,0,0-3l-3-1.74a1.73,1.73,0,0,0-1.76,0,1.71,1.71,0,0,0-.87,1.52v3.48A1.71,1.71,0,0,0,9.61,12.26Zm1.13-4.58L13,9l-2.28,1.32Z"/></svg>',wn='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M6.9917,14.502a.99974.99974,0,0,0-1,1v1.78229a7.97243,7.97243,0,0,1-2-5.28229,7.29085,7.29085,0,0,1,.05273-.87988.99992.99992,0,1,0-1.98535-.24023A9.17334,9.17334,0,0,0,1.9917,12.002a9.96434,9.96434,0,0,0,2.41687,6.5H2.9917a1,1,0,1,0,0,2h4a.98173.98173,0,0,0,.79413-.42181c.01166-.01538.02655-.0268.03741-.043.00666-.00995.00684-.02173.01306-.03186a.96576.96576,0,0,0,.106-.2583.95234.95234,0,0,0,.03143-.15589c.00287-.03088.018-.05749.018-.08911v-4A.99974.99974,0,0,0,6.9917,14.502Zm1.5-8.5H6.70923a7.9737,7.9737,0,0,1,5.28247-2,7.07475,7.07475,0,0,1,.87939.05274,1.00046,1.00046,0,0,0,.24121-1.98633A9.22717,9.22717,0,0,0,11.9917,2.002a9.96421,9.96421,0,0,0-6.5,2.41669V3.002a1,1,0,0,0-2,0v4a.95355.95355,0,0,0,.03931.19471l.00024.00122a.96893.96893,0,0,0,.14117.345l.01142.0169a.97291.97291,0,0,0,.2445.24634c.01093.008.01636.02026.02771.02789.01429.00946.03046.01246.04505.02112a.95817.95817,0,0,0,.17932.084.98784.98784,0,0,0,.26184.05285c.01733.00092.03192.01.04944.01h4a1,1,0,0,0,0-2ZM20.45215,16.80609a.96745.96745,0,0,0-.14124-.34509l-.01129-.01679a.97315.97315,0,0,0-.24469-.24646c-.01092-.00793-.01629-.02026-.02759-.02783-.0108-.00714-.02362-.00738-.0346-.0141a1.15354,1.15354,0,0,0-.40973-.13543c-.03162-.003-.0589-.01844-.09131-.01844h-4a1,1,0,0,0,0,2h1.78241a7.97338,7.97338,0,0,1-5.28241,2,7.07446,7.07446,0,0,1-.8794-.05371,1.00046,1.00046,0,0,0-.24121,1.98633,9.36538,9.36538,0,0,0,1.12061.06738,9.96425,9.96425,0,0,0,6.5-2.41668V21.002a1,1,0,0,0,2,0v-4a.95345.95345,0,0,0-.03931-.1947ZM20.9917,5.502a1,1,0,0,0,0-2h-4a.9519.9519,0,0,0-.19183.0387l-.00666.00134a.96837.96837,0,0,0-.3407.13953l-.01959.01324a.974.974,0,0,0-.2453.24378c-.00787.0108-.02.01611-.02746.02728-.00714.01074-.00739.02344-.0141.03436a1.14563,1.14563,0,0,0-.13636.41266c-.00286.03089-.018.0575-.018.08911v4a1,1,0,1,0,2,0V6.71912a7.97527,7.97527,0,0,1,2,5.28283,7.289,7.289,0,0,1-.05274.87989,1.00106,1.00106,0,0,0,.87208,1.11328,1.02916,1.02916,0,0,0,.12207.00683.99971.99971,0,0,0,.99121-.87988A9.17363,9.17363,0,0,0,21.9917,12.002a9.96411,9.96411,0,0,0-2.417-6.5Z"/></svg>',Gt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M11.29,15.29a1.58,1.58,0,0,0-.12.15.76.76,0,0,0-.09.18.64.64,0,0,0-.06.18,1.36,1.36,0,0,0,0,.2.84.84,0,0,0,.08.38.9.9,0,0,0,.54.54.94.94,0,0,0,.76,0,.9.9,0,0,0,.54-.54A1,1,0,0,0,13,16a1,1,0,0,0-.29-.71A1,1,0,0,0,11.29,15.29ZM12,2A10,10,0,1,0,22,12,10,10,0,0,0,12,2Zm0,18a8,8,0,1,1,8-8A8,8,0,0,1,12,20ZM12,7A3,3,0,0,0,9.4,8.5a1,1,0,1,0,1.73,1A1,1,0,0,1,12,9a1,1,0,0,1,0,2,1,1,0,0,0-1,1v1a1,1,0,0,0,2,0v-.18A3,3,0,0,0,12,7Z"/></svg>',hn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M5.5,17.5H4V6.5h7.8L11,7.29a1,1,0,0,0,1.41,1.42l2.5-2.5a1,1,0,0,0,0-1.42l-2.5-2.5a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42l.79.79H3a1,1,0,0,0-1,1v13a1,1,0,0,0,1,1H5.5a1,1,0,0,0,0-2ZM21,4.5H18.5a1,1,0,0,0,0,2H20v11H11.63l.79-.79a1,1,0,0,0,0-1.42,1,1,0,0,0-1.41,0l-2.5,2.5a1,1,0,0,0,0,1.42l2.5,2.5a1,1,0,0,0,1.41-1.42l-.79-.79H21a1,1,0,0,0,1-1V5.5A1,1,0,0,0,21,4.5Z"/></svg>',fn='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M22.60107,2.062a1.00088,1.00088,0,0,0-.71289-.71289A11.25224,11.25224,0,0,0,10.46924,4.97217L9.35431,6.296l-2.6048-.62848A2.77733,2.77733,0,0,0,3.36279,7.0249L1.1626,10.9248A.99989.99989,0,0,0,1.82422,12.394l3.07275.65869a13.41952,13.41952,0,0,0-.55517,2.43409,1.00031,1.00031,0,0,0,.28466.83642l3.1001,3.1001a.99941.99941,0,0,0,.707.293c.02881,0,.05762-.00147.08692-.00391a12.16892,12.16892,0,0,0,2.49157-.49l.64368,3.00318a1.0003,1.0003,0,0,0,1.46924.66162l3.90527-2.20264a3.03526,3.03526,0,0,0,1.375-3.30371l-.6687-2.759,1.23706-1.13751A11.20387,11.20387,0,0,0,22.60107,2.062ZM3.57227,10.72314,5.12842,7.96338a.82552.82552,0,0,1,1.06982-.37549l1.71741.4162-.65.77179A13.09523,13.09523,0,0,0,5.67633,11.174Zm12.47021,8.22217L13.32666,20.477l-.4295-2.00464a11.33992,11.33992,0,0,0,2.41339-1.61987l.74353-.68366.40344,1.66462A1.041,1.041,0,0,1,16.04248,18.94531ZM17.65674,11.98l-3.68457,3.38623a9.77348,9.77348,0,0,1-5.17041,2.3042l-2.4043-2.4043a10.932,10.932,0,0,1,2.40088-5.206l1.67834-1.99268a.9635.9635,0,0,0,.07813-.09277L11.98975,6.271a9.27757,9.27757,0,0,1,8.80957-3.12012A9.21808,9.21808,0,0,1,17.65674,11.98Zm-.923-6.16376a1.5,1.5,0,1,0,1.5,1.5A1.49992,1.49992,0,0,0,16.7337,5.81622Z"/></svg>',Hn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2.88,16.88a3,3,0,0,0,0,4.24,3,3,0,0,0,4.24,0,3,3,0,0,0-4.24-4.24Zm2.83,2.83a1,1,0,0,1-1.42-1.42,1,1,0,0,1,1.42,0A1,1,0,0,1,5.71,19.71ZM5,12a1,1,0,0,0,0,2,5,5,0,0,1,5,5,1,1,0,0,0,2,0,7,7,0,0,0-7-7ZM5,8a1,1,0,0,0,0,2,9,9,0,0,1,9,9,1,1,0,0,0,2,0,11.08,11.08,0,0,0-3.22-7.78A11.08,11.08,0,0,0,5,8Zm10.61.39A15.11,15.11,0,0,0,5,4,1,1,0,0,0,5,6,13,13,0,0,1,18,19a1,1,0,0,0,2,0A15.11,15.11,0,0,0,15.61,8.39Z"/></svg>',va='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M20.71,9.29l-6-6a1,1,0,0,0-.32-.21A1.09,1.09,0,0,0,14,3H6A3,3,0,0,0,3,6V18a3,3,0,0,0,3,3H18a3,3,0,0,0,3-3V10A1,1,0,0,0,20.71,9.29ZM9,5h4V7H9Zm6,14H9V16a1,1,0,0,1,1-1h4a1,1,0,0,1,1,1Zm4-1a1,1,0,0,1-1,1H17V16a3,3,0,0,0-3-3H10a3,3,0,0,0-3,3v3H6a1,1,0,0,1-1-1V6A1,1,0,0,1,6,5H7V8A1,1,0,0,0,8,9h6a1,1,0,0,0,1-1V6.41l4,4Z"/></svg>',ia='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.71,20.29,18,16.61A9,9,0,1,0,16.61,18l3.68,3.68a1,1,0,0,0,1.42,0A1,1,0,0,0,21.71,20.29ZM11,18a7,7,0,1,1,7-7A7,7,0,0,1,11,18Z"/></svg>',ba='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.71,20.29,18,16.61A9,9,0,1,0,16.61,18l3.68,3.68a1,1,0,0,0,1.42,0A1,1,0,0,0,21.71,20.29ZM11,18a7,7,0,1,1,7-7A7,7,0,0,1,11,18Zm4-8H7a1,1,0,0,0,0,2h8a1,1,0,0,0,0-2Z"/></svg>',ta='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15,10H12V7a1,1,0,0,0-2,0v3H7a1,1,0,0,0,0,2h3v3a1,1,0,0,0,2,0V12h3a1,1,0,0,0,0-2Zm6.71,10.29L18,16.61A9,9,0,1,0,16.61,18l3.68,3.68a1,1,0,0,0,1.42,0A1,1,0,0,0,21.71,20.29ZM11,18a7,7,0,1,1,7-7A7,7,0,0,1,11,18Z"/></svg>',na='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18,14a4,4,0,0,0-3.08,1.48l-5.1-2.35a3.64,3.64,0,0,0,0-2.26l5.1-2.35A4,4,0,1,0,14,6a4.17,4.17,0,0,0,.07.71L8.79,9.14a4,4,0,1,0,0,5.72l5.28,2.43A4.17,4.17,0,0,0,14,18a4,4,0,1,0,4-4ZM18,4a2,2,0,1,1-2,2A2,2,0,0,1,18,4ZM6,14a2,2,0,1,1,2-2A2,2,0,0,1,6,14Zm12,6a2,2,0,1,1,2-2A2,2,0,0,1,18,20Z"/></svg>',la='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.63,3.65a1,1,0,0,0-.84-.2,8,8,0,0,1-6.22-1.27,1,1,0,0,0-1.14,0A8,8,0,0,1,5.21,3.45a1,1,0,0,0-.84.2A1,1,0,0,0,4,4.43v7.45a9,9,0,0,0,3.77,7.33l3.65,2.6a1,1,0,0,0,1.16,0l3.65-2.6A9,9,0,0,0,20,11.88V4.43A1,1,0,0,0,19.63,3.65ZM18,11.88a7,7,0,0,1-2.93,5.7L12,19.77,8.93,17.58A7,7,0,0,1,6,11.88V5.58a10,10,0,0,0,6-1.39,10,10,0,0,0,6,1.39Z"/></svg>',$e='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M6,15a1,1,0,0,0-1,1v3a1,1,0,0,0,2,0V16A1,1,0,0,0,6,15Zm4-3a1,1,0,0,0-1,1v6a1,1,0,0,0,2,0V13A1,1,0,0,0,10,12Zm8-8a1,1,0,0,0-1,1V19a1,1,0,0,0,2,0V5A1,1,0,0,0,18,4ZM14,8a1,1,0,0,0-1,1V19a1,1,0,0,0,2,0V9A1,1,0,0,0,14,8Z"/></svg>',He='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20,12a1,1,0,0,0-1-1H11.41l2.3-2.29a1,1,0,1,0-1.42-1.42l-4,4a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l4,4a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42L11.41,13H19A1,1,0,0,0,20,12ZM17,2H7A3,3,0,0,0,4,5V19a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V16a1,1,0,0,0-2,0v3a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V5A1,1,0,0,1,7,4H17a1,1,0,0,1,1,1V8a1,1,0,0,0,2,0V5A3,3,0,0,0,17,2Z"/></svg>',Ye='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M4,12a1,1,0,0,0,1,1h7.59l-2.3,2.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l4-4a1,1,0,0,0,.21-.33,1,1,0,0,0,0-.76,1,1,0,0,0-.21-.33l-4-4a1,1,0,1,0-1.42,1.42L12.59,11H5A1,1,0,0,0,4,12ZM17,2H7A3,3,0,0,0,4,5V8A1,1,0,0,0,6,8V5A1,1,0,0,1,7,4H17a1,1,0,0,1,1,1V19a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V16a1,1,0,0,0-2,0v3a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V5A3,3,0,0,0,17,2Z"/></svg>',yt='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M22,15H20V12a1,1,0,0,0-1-1H13V9h2a1,1,0,0,0,1-1V2a1,1,0,0,0-1-1H9A1,1,0,0,0,8,2V8A1,1,0,0,0,9,9h2v2H5a1,1,0,0,0-1,1v3H2a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1H8a1,1,0,0,0,1-1V16a1,1,0,0,0-1-1H6V13H18v2H16a1,1,0,0,0-1,1v6a1,1,0,0,0,1,1h6a1,1,0,0,0,1-1V16A1,1,0,0,0,22,15ZM7,17v4H3V17ZM10,7V3h4V7ZM21,21H17V17h4Z"/></svg>',bt='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M2,14.67a2,2,0,1,0,4,0v-2H4A2,2,0,0,0,2,14.67Zm12.64-3.34a2,2,0,0,0,2-2V4a2,2,0,1,0-4,0V9.33A2,2,0,0,0,14.66,11.33Zm7.32-2a2,2,0,1,0-4,0v2h2A2,2,0,0,0,22,9.33ZM9.34,12.67a2,2,0,0,0-2,2V20a2,2,0,1,0,4,0V14.67A2,2,0,0,0,9.34,12.67ZM14.66,18h-2v2a2,2,0,1,0,2-2ZM20,12.67H14.66a2,2,0,0,0,0,4H20a2,2,0,0,0,0-4ZM9.34,7.33H4a2,2,0,1,0,0,4H9.34a2,2,0,0,0,0-4ZM9.34,2a2,2,0,0,0,0,4h2V4A2,2,0,0,0,9.34,2Z"/></svg>',It='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20,8.18V3a1,1,0,0,0-2,0V8.18a3,3,0,0,0,0,5.64V21a1,1,0,0,0,2,0V13.82a3,3,0,0,0,0-5.64ZM19,12a1,1,0,1,1,1-1A1,1,0,0,1,19,12Zm-6,2.18V3a1,1,0,0,0-2,0V14.18a3,3,0,0,0,0,5.64V21a1,1,0,0,0,2,0V19.82a3,3,0,0,0,0-5.64ZM12,18a1,1,0,1,1,1-1A1,1,0,0,1,12,18ZM6,6.18V3A1,1,0,0,0,4,3V6.18a3,3,0,0,0,0,5.64V21a1,1,0,0,0,2,0V11.82A3,3,0,0,0,6,6.18ZM5,10A1,1,0,1,1,6,9,1,1,0,0,1,5,10Z"/></svg>',Lt='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M6.29,14.29l-.29.3V7A1,1,0,0,0,4,7v7.59l-.29-.3a1,1,0,0,0-1.42,1.42l2,2a1,1,0,0,0,.33.21.94.94,0,0,0,.76,0,1,1,0,0,0,.33-.21l2-2a1,1,0,0,0-1.42-1.42ZM11,8H21a1,1,0,0,0,0-2H11a1,1,0,0,0,0,2Zm10,3H11a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2Zm0,5H11a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2Z"/></svg>',zt='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M5.71,6.29a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,1,1,0,0,0-.33.21l-2,2A1,1,0,0,0,3.71,9.71L4,9.41V17a1,1,0,0,0,2,0V9.41l.29.3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42ZM11,8H21a1,1,0,0,0,0-2H11a1,1,0,0,0,0,2Zm10,8H11a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2Zm0-5H11a1,1,0,0,0,0,2H21a1,1,0,0,0,0-2Z"/></svg>',Vt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17,2H7A5,5,0,0,0,2,7V17a5,5,0,0,0,5,5H17a5,5,0,0,0,5-5V7A5,5,0,0,0,17,2Zm3,15a3,3,0,0,1-3,3H7a3,3,0,0,1-3-3V7A3,3,0,0,1,7,4H17a3,3,0,0,1,3,3Z"/></svg>',Ut='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M22,9.67A1,1,0,0,0,21.14,9l-5.69-.83L12.9,3a1,1,0,0,0-1.8,0L8.55,8.16,2.86,9a1,1,0,0,0-.81.68,1,1,0,0,0,.25,1l4.13,4-1,5.68a1,1,0,0,0,.4,1,1,1,0,0,0,1.05.07L12,18.76l5.1,2.68a.93.93,0,0,0,.46.12,1,1,0,0,0,.59-.19,1,1,0,0,0,.4-1l-1-5.68,4.13-4A1,1,0,0,0,22,9.67Zm-6.15,4a1,1,0,0,0-.29.89l.72,4.19-3.76-2a1,1,0,0,0-.94,0l-3.76,2,.72-4.19a1,1,0,0,0-.29-.89l-3-3,4.21-.61a1,1,0,0,0,.76-.55L12,5.7l1.88,3.82a1,1,0,0,0,.76.55l4.21.61Z"/></svg>',Kt='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.28,3.43a3.23,3.23,0,0,0-3.29,0L8,8.84V6A3,3,0,0,0,2,6V18a3,3,0,0,0,6,0V15.16l9,5.37a3.28,3.28,0,0,0,1.68.47,3.24,3.24,0,0,0,1.61-.43,3.38,3.38,0,0,0,1.72-3V6.42A3.38,3.38,0,0,0,20.28,3.43ZM6,18a1,1,0,0,1-2,0V6A1,1,0,0,1,6,6Zm14-.42a1.4,1.4,0,0,1-.71,1.25,1.23,1.23,0,0,1-1.28,0L8.68,13.23a1.45,1.45,0,0,1,0-2.46L18,5.19A1.23,1.23,0,0,1,18.67,5a1.29,1.29,0,0,1,.62.17A1.4,1.4,0,0,1,20,6.42Z"/></svg>',xn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.91,15.51H15.38a1,1,0,0,0,0,2h2.4A8,8,0,0,1,4,12a1,1,0,0,0-2,0,10,10,0,0,0,16.88,7.23V21a1,1,0,0,0,2,0V16.5A1,1,0,0,0,19.91,15.51ZM12,2A10,10,0,0,0,5.12,4.77V3a1,1,0,0,0-2,0V7.5a1,1,0,0,0,1,1h4.5a1,1,0,0,0,0-2H6.22A8,8,0,0,1,20,12a1,1,0,0,0,2,0A10,10,0,0,0,12,2Z"/></svg>',rn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,2H3A1,1,0,0,0,2,3V21a1,1,0,0,0,1,1H21a1,1,0,0,0,1-1V3A1,1,0,0,0,21,2ZM8,20H4V16H8Zm0-6H4V10H8ZM8,8H4V4H8Zm6,12H10V16h4Zm0-6H10V10h4Zm0-6H10V4h4Zm6,12H16V16h4Zm0-6H16V10h4Zm0-6H16V4h4Z"/></svg>',Bn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7.5,6A1.5,1.5,0,1,0,9,7.5,1.5,1.5,0,0,0,7.5,6Zm13.62,4.71L12.71,2.29A1,1,0,0,0,12,2H3A1,1,0,0,0,2,3v9a1,1,0,0,0,.29.71l8.42,8.41a3,3,0,0,0,4.24,0L21.12,15a3,3,0,0,0,0-4.24Zm-1.41,2.82h0l-6.18,6.17a1,1,0,0,1-1.41,0L4,11.59V4h7.59l8.12,8.12a1,1,0,0,1,.29.71A1,1,0,0,1,19.71,13.53Z"/></svg>',_n='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.41,12l4.3-4.29a1,1,0,1,0-1.42-1.42L12,10.59,7.71,6.29A1,1,0,0,0,6.29,7.71L10.59,12l-4.3,4.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0L12,13.41l4.29,4.3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42Z"/></svg>',Fn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10,18a1,1,0,0,0,1-1V11a1,1,0,0,0-2,0v6A1,1,0,0,0,10,18ZM20,6H16V5a3,3,0,0,0-3-3H11A3,3,0,0,0,8,5V6H4A1,1,0,0,0,4,8H5V19a3,3,0,0,0,3,3h8a3,3,0,0,0,3-3V8h1a1,1,0,0,0,0-2ZM10,5a1,1,0,0,1,1-1h2a1,1,0,0,1,1,1V6H10Zm7,14a1,1,0,0,1-1,1H8a1,1,0,0,1-1-1V8H17Zm-3-1a1,1,0,0,0,1-1V11a1,1,0,0,0-2,0v6A1,1,0,0,0,14,18Z"/></svg>',An='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17,9H9V7a3,3,0,0,1,5.12-2.13,3.08,3.08,0,0,1,.78,1.38,1,1,0,1,0,1.94-.5,5.09,5.09,0,0,0-1.31-2.29A5,5,0,0,0,7,7V9a3,3,0,0,0-3,3v7a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V12A3,3,0,0,0,17,9Zm1,10a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V12a1,1,0,0,1,1-1H17a1,1,0,0,1,1,1Z"/></svg>',Sn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.71,7.71,11,5.41V15a1,1,0,0,0,2,0V5.41l2.29,2.3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42l-4-4a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,1,1,0,0,0-.33.21l-4,4A1,1,0,1,0,8.71,7.71ZM21,12a1,1,0,0,0-1,1v6a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V13a1,1,0,0,0-2,0v6a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V13A1,1,0,0,0,21,12Z"/></svg>',ua='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.71,12.71a6,6,0,1,0-7.42,0,10,10,0,0,0-6.22,8.18,1,1,0,0,0,2,.22,8,8,0,0,1,15.9,0,1,1,0,0,0,1,.89h.11a1,1,0,0,0,.88-1.1A10,10,0,0,0,15.71,12.71ZM12,12a4,4,0,1,1,4-4A4,4,0,0,1,12,12Z"/></svg>',sn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.3,12.22A4.92,4.92,0,0,0,14,8.5a5,5,0,0,0-10,0,4.92,4.92,0,0,0,1.7,3.72A8,8,0,0,0,1,19.5a1,1,0,0,0,2,0,6,6,0,0,1,12,0,1,1,0,0,0,2,0A8,8,0,0,0,12.3,12.22ZM9,11.5a3,3,0,1,1,3-3A3,3,0,0,1,9,11.5Zm9.74.32A5,5,0,0,0,15,3.5a1,1,0,0,0,0,2,3,3,0,0,1,3,3,3,3,0,0,1-1.5,2.59,1,1,0,0,0-.5.84,1,1,0,0,0,.45.86l.39.26.13.07a7,7,0,0,1,4,6.38,1,1,0,0,0,2,0A9,9,0,0,0,18.74,11.82Z"/></svg>',pa='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3,7H21a1,1,0,0,0,0-2H3A1,1,0,0,0,3,7Zm6,8H3a1,1,0,0,0,0,2H9a1,1,0,0,0,0-2Zm9.5-5H3a1,1,0,0,0,0,2H18.5a1.5,1.5,0,0,1,0,3H15.41l.3-.29a1,1,0,0,0-1.42-1.42l-2,2a1,1,0,0,0-.21.33,1,1,0,0,0,0,.76,1,1,0,0,0,.21.33l2,2a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42l-.3-.29H18.5a3.5,3.5,0,0,0,0-7Z"/></svg>',sa='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M18.42,8.22A7,7,0,0,0,5.06,10.11,4,4,0,0,0,6,18a1,1,0,0,0,0-2,2,2,0,0,1,0-4,1,1,0,0,0,1-1,5,5,0,0,1,9.73-1.61,1,1,0,0,0,.78.67,3,3,0,0,1,.24,5.84,1,1,0,0,0,.5,1.94,5,5,0,0,0,.17-9.62Zm-5.71,2.07a1,1,0,0,0-.33-.21,1,1,0,0,0-.76,0,1,1,0,0,0-.33.21l-3,3a1,1,0,0,0,1.42,1.42L11,13.41V19a1,1,0,0,0,2,0V13.41l1.29,1.3a1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.42Z"/></svg>',Rn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M7,15h3a1,1,0,0,0,0-2H7a1,1,0,0,0,0,2ZM19,5H5A3,3,0,0,0,2,8v9a3,3,0,0,0,3,3H19a3,3,0,0,0,3-3V8A3,3,0,0,0,19,5Zm1,12a1,1,0,0,1-1,1H5a1,1,0,0,1-1-1V11H20Zm0-8H4V8A1,1,0,0,1,5,7H19a1,1,0,0,1,1,1Z"/></svg>',gn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M16,20H8a3,3,0,0,1-3-3V7A1,1,0,0,0,3,7V17a5,5,0,0,0,5,5h8a1,1,0,0,0,0-2Zm-6-7a1,1,0,0,0,1,1h5a1,1,0,0,0,0-2H11A1,1,0,0,0,10,13ZM21,8.94a1.31,1.31,0,0,0-.06-.27l0-.09a1.07,1.07,0,0,0-.19-.28h0l-6-6h0a1.07,1.07,0,0,0-.28-.19.32.32,0,0,0-.09,0A.88.88,0,0,0,14.05,2H10A3,3,0,0,0,7,5V15a3,3,0,0,0,3,3h8a3,3,0,0,0,3-3V9S21,9,21,8.94ZM15,5.41,17.59,8H16a1,1,0,0,1-1-1ZM19,15a1,1,0,0,1-1,1H10a1,1,0,0,1-1-1V5a1,1,0,0,1,1-1h3V7a3,3,0,0,0,.18,1H11a1,1,0,0,0,0,2h8Z"/></svg>',ma='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M8.46777,8.39453l-.00225.00183-.00214.00208ZM18.42188,8.208a1.237,1.237,0,0,0-.23-.17481.99959.99959,0,0,0-1.39941.41114,5.78155,5.78155,0,0,1-1.398,1.77734,8.6636,8.6636,0,0,0,.1333-1.50977,8.71407,8.71407,0,0,0-4.40039-7.582,1.00009,1.00009,0,0,0-1.49121.80567A7.017,7.017,0,0,1,7.165,6.87793l-.23047.1875a8.51269,8.51269,0,0,0-1.9873,1.8623A8.98348,8.98348,0,0,0,8.60254,22.83594.99942.99942,0,0,0,9.98,21.91016a1.04987,1.04987,0,0,0-.0498-.3125,6.977,6.977,0,0,1-.18995-2.58106,9.004,9.004,0,0,0,4.3125,4.0166.997.997,0,0,0,.71534.03809A8.99474,8.99474,0,0,0,18.42188,8.208ZM14.51709,21.03906a6.964,6.964,0,0,1-3.57666-4.40234,8.90781,8.90781,0,0,1-.17969-.96387,1.00025,1.00025,0,0,0-.79931-.84473A.982.982,0,0,0,9.77,14.80957a.99955.99955,0,0,0-.8667.501,8.9586,8.9586,0,0,0-1.20557,4.71777,6.98547,6.98547,0,0,1-1.17529-9.86816,6.55463,6.55463,0,0,1,1.562-1.458.74507.74507,0,0,0,.07422-.05469s.29669-.24548.30683-.2511a8.96766,8.96766,0,0,0,2.89874-4.63269,6.73625,6.73625,0,0,1,1.38623,8.08789,1.00024,1.00024,0,0,0,1.18359,1.418,7.85568,7.85568,0,0,0,3.86231-2.6875,7.00072,7.00072,0,0,1-3.2793,10.457Z"/></svg>',Ta='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M18.9917,21.002h-1V19.335a5.00057,5.00057,0,0,0-.29956-1.67773c-.01093-.02936-.0224-.05658-.03589-.08454a4.97694,4.97694,0,0,0-.66455-1.23675l-1.3999-1.86719a3.01933,3.01933,0,0,1-.6001-1.80078V11.6582a3.02108,3.02108,0,0,1,.87842-2.12109l.65722-.65723A4.94566,4.94566,0,0,0,17.92365,6.0415c.00054-.01391.008-.02551.008-.03955l-.00281-.01373a5.01836,5.01836,0,0,0,.06287-.64349V3.002h1a1,1,0,0,0,0-2h-14a1,1,0,0,0,0,2h1V5.34473a5.01836,5.01836,0,0,0,.06287.64349L6.05176,6.002c0,.014.00744.02564.008.03955a4.94571,4.94571,0,0,0,1.3963,2.83838l.65723.65723A3.02108,3.02108,0,0,1,8.9917,11.6582V12.668a3.02212,3.02212,0,0,1-.59961,1.80078L6.99121,16.33594a4.98221,4.98221,0,0,0-.66437,1.23718c-.0133.02771-.02472.05463-.03552.08368A5.00309,5.00309,0,0,0,5.9917,19.335v1.667h-1a1,1,0,0,0,0,2h14a1,1,0,0,0,0-2Zm-11-16v-2h8v2Zm.87842,2.46387A2.97036,2.97036,0,0,1,8.49323,7.002h6.99694a2.97094,2.97094,0,0,1-.37689.46387l-.65723.65723a4.9603,4.9603,0,0,0-1.42187,2.8789h-2.085A4.96025,4.96025,0,0,0,9.52734,8.123ZM9.99219,15.668a5.03688,5.03688,0,0,0,.98828-2.666h2.02246a5.03332,5.03332,0,0,0,.98877,2.666l1.00012,1.334H8.99133Zm5.99951,5.334h-8V19.335a2.954,2.954,0,0,1,.02722-.333h7.94556a2.954,2.954,0,0,1,.02722.333Z"/></svg>',ya='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M2.5,8.86l9,5.2a1,1,0,0,0,1,0l9-5.2A1,1,0,0,0,22,8a1,1,0,0,0-.5-.87l-9-5.19a1,1,0,0,0-1,0l-9,5.19A1,1,0,0,0,2,8,1,1,0,0,0,2.5,8.86ZM12,4l7,4-7,4L5,8Zm8.5,7.17L12,16,3.5,11.13a1,1,0,0,0-1.37.37,1,1,0,0,0,.37,1.36l9,5.2a1,1,0,0,0,1,0l9-5.2a1,1,0,0,0,.37-1.36A1,1,0,0,0,20.5,11.13Zm0,4L12,20,3.5,15.13a1,1,0,0,0-1.37.37,1,1,0,0,0,.37,1.36l9,5.2a1,1,0,0,0,1,0l9-5.2a1,1,0,0,0,.37-1.36A1,1,0,0,0,20.5,15.13Z"/></svg>',ke='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21,2H9A1,1,0,0,0,8,3V7H6A1,1,0,0,0,5,8v4H3a1,1,0,0,0-1,1v8a1,1,0,0,0,1,1h8a1,1,0,0,0,1-1V19h4a1,1,0,0,0,1-1V16h4a1,1,0,0,0,1-1V3A1,1,0,0,0,21,2ZM10,20H4V14h6Zm5-3H12V13a1,1,0,0,0-1-1H7V9h8Zm5-3H17V8a1,1,0,0,0-1-1H10V4H20Z"/></svg>',Ne='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M21.71,3.29a1,1,0,0,0-1.42,0l-18,18a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l18-18A1,1,0,0,0,21.71,3.29Z"/></svg>',Ge='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3.5,6a1,1,0,1,0,1,1A1,1,0,0,0,3.5,6Zm4,2h14a1,1,0,0,0,0-2H7.5a1,1,0,0,0,0,2Zm0,3a1,1,0,1,0,1,1A1,1,0,0,0,7.5,11Zm4,5a1,1,0,1,0,1,1A1,1,0,0,0,11.5,16Zm10-5h-10a1,1,0,0,0,0,2h10a1,1,0,0,0,0-2Zm0,5h-6a1,1,0,0,0,0,2h6a1,1,0,0,0,0-2Z"/></svg>',Et='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20.34,9.32l-14-7a3,3,0,0,0-4.08,3.9l2.4,5.37h0a1.06,1.06,0,0,1,0,.82l-2.4,5.37A3,3,0,0,0,5,22a3.14,3.14,0,0,0,1.35-.32l14-7a3,3,0,0,0,0-5.36Zm-.89,3.57-14,7a1,1,0,0,1-1.35-1.3l2.39-5.37A2,2,0,0,0,6.57,13h6.89a1,1,0,0,0,0-2H6.57a2,2,0,0,0-.08-.22L4.1,5.41a1,1,0,0,1,1.35-1.3l14,7a1,1,0,0,1,0,1.78Z"/></svg>',Jt='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M7.42,15.54a1,1,0,0,0,0,1.41,1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.41A1,1,0,0,0,7.42,15.54Zm0-8.49a1,1,0,0,0,0,1.41,1,1,0,0,0,1.42,0,1,1,0,0,0,0-1.41A1,1,0,0,0,7.42,7.05Zm4.95,10a1,1,0,1,0,1,1A1,1,0,0,0,12.37,17Zm-6-6a1,1,0,1,0,1,1A1,1,0,0,0,6.37,11Zm6-6a1,1,0,1,0,1,1A1,1,0,0,0,12.37,5Zm3.54,2.05a1,1,0,1,0,1.41,0A1,1,0,0,0,15.91,7.05Zm6.3,0a11,11,0,1,0-7.85,15.74,3.87,3.87,0,0,0,2.5-1.65A4.2,4.2,0,0,0,17.47,18a5.65,5.65,0,0,1-.1-1,5,5,0,0,1,3-4.56,3.84,3.84,0,0,0,2.06-2.25A4,4,0,0,0,22.21,7.08Zm-1.7,2.44a1.9,1.9,0,0,1-1,1.09A7,7,0,0,0,15.37,17a7.3,7.3,0,0,0,.14,1.4,2.16,2.16,0,0,1-.31,1.65,1.79,1.79,0,0,1-1.21.8,8.72,8.72,0,0,1-1.62.15,9,9,0,0,1-9-9.28A9.05,9.05,0,0,1,11.85,3h.51a9,9,0,0,1,8.06,5A2,2,0,0,1,20.51,9.52ZM12.37,11a1,1,0,1,0,1,1A1,1,0,0,0,12.37,11Z"/></svg>',an='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M7.75781,10.75781a3,3,0,1,0-3-3A3.00328,3.00328,0,0,0,7.75781,10.75781Zm0-4a1,1,0,1,1-1,1A1.00067,1.00067,0,0,1,7.75781,6.75781Zm8.48438,6.48438a3,3,0,1,0,3,3A3.00328,3.00328,0,0,0,16.24219,13.24219Zm0,4a1,1,0,1,1,1-1A1.00067,1.00067,0,0,1,16.24219,17.24219ZM19.707,4.293a.99962.99962,0,0,0-1.41406,0l-14,14A.99989.99989,0,1,0,5.707,19.707l14-14A.99962.99962,0,0,0,19.707,4.293Z"/></svg>',Cn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.92,15a.56.56,0,0,0-.09-.17l-.12-.15a1,1,0,0,0-1.42,0,.61.61,0,0,0-.12.15.56.56,0,0,0-.09.17.7.7,0,0,0-.06.19,1.23,1.23,0,0,0,0,.19.88.88,0,0,0,.08.39,1,1,0,0,0,1.3.54,1.19,1.19,0,0,0,.33-.22,1,1,0,0,0,.21-.32,1,1,0,0,0,.08-.39,1.23,1.23,0,0,0,0-.19A.7.7,0,0,0,12.92,15ZM12,7.36a1,1,0,0,0-1,1v3a1,1,0,0,0,2,0v-3A1,1,0,0,0,12,7.36Zm7.63-3.71a1,1,0,0,0-.84-.2,8,8,0,0,1-6.22-1.27,1,1,0,0,0-1.14,0A8,8,0,0,1,5.21,3.45a1,1,0,0,0-.84.2A1,1,0,0,0,4,4.43v7.45a9,9,0,0,0,3.77,7.33l3.65,2.6a1,1,0,0,0,1.16,0l3.65-2.6A9,9,0,0,0,20,11.88V4.43A1,1,0,0,0,19.63,3.65ZM18,11.88a7,7,0,0,1-2.93,5.7L12,19.77,8.93,17.58A7,7,0,0,1,6,11.88V5.58a10,10,0,0,0,6-1.39,10,10,0,0,0,6,1.39Z"/></svg>',En='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9,13h2v2a1,1,0,0,0,2,0V13h2a1,1,0,0,0,0-2H13V9a1,1,0,0,0-2,0v2H9a1,1,0,0,0,0,2ZM21,2H3A1,1,0,0,0,2,3V21a1,1,0,0,0,1,1H21a1,1,0,0,0,1-1V3A1,1,0,0,0,21,2ZM20,20H4V4H20Z"/></svg>',Tn='<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path d="M8,19a3,3,0,0,1-3-3V8A3,3,0,0,1,8,5,1,1,0,0,0,8,3,5,5,0,0,0,3,8v8a5,5,0,0,0,5,5,1,1,0,0,0,0-2Zm7.71-3.29a1,1,0,0,0,0-1.42L13.41,12l2.3-2.29a1,1,0,0,0-1.42-1.42L12,10.59,9.71,8.29A1,1,0,0,0,8.29,9.71L10.59,12l-2.3,2.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0L12,13.41l2.29,2.3a1,1,0,0,0,1.42,0ZM16,3a1,1,0,0,0,0,2,3,3,0,0,1,3,3v8a3,3,0,0,1-3,3,1,1,0,0,0,0,2,5,5,0,0,0,5-5V8A5,5,0,0,0,16,3Z"/></svg>',kn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3,9A1,1,0,0,0,4,8V5A1,1,0,0,1,5,4H8A1,1,0,0,0,8,2H5A3,3,0,0,0,2,5V8A1,1,0,0,0,3,9ZM8,20H5a1,1,0,0,1-1-1V16a1,1,0,0,0-2,0v3a3,3,0,0,0,3,3H8a1,1,0,0,0,0-2ZM12,8a4,4,0,1,0,4,4A4,4,0,0,0,12,8Zm0,6a2,2,0,1,1,2-2A2,2,0,0,1,12,14ZM19,2H16a1,1,0,0,0,0,2h3a1,1,0,0,1,1,1V8a1,1,0,0,0,2,0V5A3,3,0,0,0,19,2Zm2,13a1,1,0,0,0-1,1v3a1,1,0,0,1-1,1H16a1,1,0,0,0,0,2h3a3,3,0,0,0,3-3V16A1,1,0,0,0,21,15Z"/></svg>',Gn=`<svg viewBox="0 0 15 15" fill="black" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.92009 1.43307C1.70105 1.43307 1.4906 1.64169 1.4906 1.86641C1.4906 1.94501 1.46966 2.01873 1.43307 2.08229V13.1331C1.43307 13.3578 1.64353 13.5664 1.86257 13.5664H13.1369C13.356 13.5664 13.5664 13.3578 13.5664 13.1331V1.86641C13.5664 1.64169 13.356 1.43307 13.1369 1.43307H1.92009ZM0.65095 1.60921C0.597816 1.68115 0.566406 1.77011 0.566406 1.86641V13.1331C0.566406 13.8328 1.16126 14.4331 1.86257 14.4331H13.1369C13.8382 14.4331 14.4331 13.8328 14.4331 13.1331V1.86641C14.4331 1.16667 13.8382 0.566406 13.1369 0.566406H1.92009C1.3066 0.566406 0.774569 1.02576 0.65095 1.60921Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.10938 3.59935C3.10938 3.36003 3.30338 3.16602 3.54271 3.16602H6.48938C6.7287 3.16602 6.92271 3.36003 6.92271 3.59935V6.54602C6.92271 6.78534 6.7287 6.97935 6.48938 6.97935H3.54271C3.30338 6.97935 3.10938 6.78534 3.10938 6.54602V3.59935ZM3.97604 4.03268V6.11268H6.05604V4.03268H3.97604Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M3.10938 8.51146C3.10938 8.27213 3.30338 8.07812 3.54271 8.07812H6.48938C6.7287 8.07812 6.92271 8.27213 6.92271 8.51146V11.4581C6.92271 11.6974 6.7287 11.8915 6.48938 11.8915H3.54271C3.30338 11.8915 3.10938 11.6974 3.10938 11.4581V8.51146ZM3.97604 8.94479V11.0248H6.05604V8.94479H3.97604Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.13672 3.59935C8.13672 3.36003 8.33073 3.16602 8.57005 3.16602H11.5167C11.756 3.16602 11.9501 3.36003 11.9501 3.59935V6.54602C11.9501 6.78534 11.756 6.97935 11.5167 6.97935H8.57005C8.33073 6.97935 8.13672 6.78534 8.13672 6.54602V3.59935ZM9.00339 4.03268V6.11268H11.0834V4.03268H9.00339Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M8.13672 8.51146C8.13672 8.27213 8.33073 8.07812 8.57005 8.07812H11.5167C11.756 8.07812 11.9501 8.27213 11.9501 8.51146V11.4581C11.9501 11.6974 11.756 11.8915 11.5167 11.8915H8.57005C8.33073 11.8915 8.13672 11.6974 8.13672 11.4581V8.51146ZM9.00339 8.94479V11.0248H11.0834V8.94479H9.00339Z" fill="inherit"/>
</svg>
`,Ae=`<svg viewBox="0 0 15 12" fill="black" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M2 4.45081C2 3.62394 2.69242 3 3.50281 3C4.27653 3 5.00562 3.53584 5.00562 4.39617C5.00562 5.22304 4.3132 5.84698 3.50281 5.84698C2.80424 5.84698 2 5.32631 2 4.45081ZM3.50281 3.93452C3.16259 3.93452 2.93452 4.18485 2.93452 4.45081C2.93452 4.66815 3.16583 4.91246 3.50281 4.91246C3.84303 4.91246 4.0711 4.66214 4.0711 4.39617C4.0711 4.16367 3.8797 3.93452 3.50281 3.93452Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7 3.45C7 3.20147 7.20147 3 7.45 3H11.5913C11.8398 3 12.0413 3.20147 12.0413 3.45C12.0413 3.69853 11.8398 3.9 11.5913 3.9H7.45C7.20147 3.9 7 3.69853 7 3.45Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M7 5.25078C7 5.00225 7.20147 4.80078 7.45 4.80078H11.5913C11.8398 4.80078 12.0413 5.00225 12.0413 5.25078C12.0413 5.49931 11.8398 5.70078 11.5913 5.70078H7.45C7.20147 5.70078 7 5.49931 7 5.25078Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.2066 6.15027C13.3817 6.33986 13.3699 6.63548 13.1803 6.81055L11.1092 8.72301C11.0733 8.75616 11.0324 8.78347 10.9881 8.80395C10.9706 8.812 10.9541 8.82063 10.93 8.83342C10.9282 8.83443 10.9261 8.83551 10.924 8.83666C10.903 8.84789 10.87 8.86552 10.8358 8.88129C10.7455 8.92296 10.6326 8.95948 10.4876 8.95948C10.2456 8.95948 10.0113 8.85713 9.86606 8.72301L8.88009 7.81256C8.86722 7.80589 8.85576 7.7998 8.84596 7.79458C8.84105 7.79196 8.8367 7.78965 8.83282 7.78759L6.78426 9.67924C6.59466 9.85431 6.29904 9.84254 6.12397 9.65295C5.9489 9.46336 5.96068 9.16774 6.15027 8.99267L8.22137 7.0802C8.36661 6.94609 8.60093 6.84374 8.84293 6.84374C8.98787 6.84374 9.10085 6.88026 9.19109 6.92192C9.22526 6.9377 9.25827 6.95533 9.27928 6.96656C9.28144 6.96771 9.28346 6.96879 9.28535 6.96979C9.30936 6.98259 9.32594 6.99122 9.34337 6.99927C9.38773 7.01975 9.42861 7.04706 9.4645 7.0802L10.4775 8.01563C10.4814 8.01357 10.4857 8.01126 10.4907 8.00864C10.5005 8.00342 10.5119 7.99732 10.5248 7.99066L12.5463 6.12397C12.7359 5.9489 13.0315 5.96068 13.2066 6.15027Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M13.8 1H1.2C1.08954 1 1 1.08954 1 1.2V10.8C1 10.9105 1.08954 11 1.2 11H13.8C13.9105 11 14 10.9105 14 10.8V1.2C14 1.08954 13.9105 1 13.8 1ZM1.2 0C0.537258 0 0 0.537258 0 1.2V10.8C0 11.4627 0.537258 12 1.2 12H13.8C14.4627 12 15 11.4627 15 10.8V1.2C15 0.537258 14.4627 0 13.8 0H1.2Z" fill="inherit"/>
</svg>
`,De=`<svg fill="black" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.92086 1.43071C1.70007 1.43071 1.48823 1.64074 1.48823 1.86718V1.86937H1.48822L1.43071 13.1338C1.43071 13.1341 1.43071 13.1344 1.43071 13.1347C1.43126 13.3608 1.64284 13.5703 1.86334 13.5703H13.1377C13.3585 13.5703 13.5703 13.3603 13.5703 13.1338V1.86718C13.5703 1.64074 13.3585 1.43071 13.1377 1.43071H1.92086ZM0.627835 1.86596C0.628524 1.16847 1.2217 0.570312 1.92086 0.570312H13.1377C13.8372 0.570312 14.4307 1.16916 14.4307 1.86718V13.1338C14.4307 13.8319 13.8372 14.4307 13.1377 14.4307H1.86334C1.16378 14.4307 0.570312 13.8319 0.570312 13.1338L0.570318 13.1316L0.627835 1.86718C0.627835 1.86677 0.627835 1.86636 0.627835 1.86596Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.59961 2.99961C2.59961 2.7787 2.7787 2.59961 2.99961 2.59961H11.9996C12.2205 2.59961 12.3996 2.7787 12.3996 2.99961V4.59961C12.3996 4.82052 12.2205 4.99961 11.9996 4.99961H2.99961C2.7787 4.99961 2.59961 4.82052 2.59961 4.59961V2.99961ZM3.39961 3.39961V4.19961H11.5996V3.39961H3.39961Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.59961 6.59922C2.59961 6.3783 2.7787 6.19922 2.99961 6.19922H11.9996C12.2205 6.19922 12.3996 6.3783 12.3996 6.59922V8.19922C12.3996 8.42013 12.2205 8.59922 11.9996 8.59922H2.99961C2.7787 8.59922 2.59961 8.42013 2.59961 8.19922V6.59922ZM3.39961 6.99922V7.79922H11.5996V6.99922H3.39961Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M2.59961 10.1988C2.59961 9.97791 2.7787 9.79883 2.99961 9.79883H11.9996C12.2205 9.79883 12.3996 9.97791 12.3996 10.1988V11.7988C12.3996 12.0197 12.2205 12.1988 11.9996 12.1988H2.99961C2.7787 12.1988 2.59961 12.0197 2.59961 11.7988V10.1988ZM3.39961 10.5988V11.3988H11.5996V10.5988H3.39961Z" fill="inherit"/>
</svg>
`,Fe=`<svg viewBox="0 0 13 15" fill="black" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M5 3.45081C5 2.62394 5.69242 2 6.50281 2C7.27653 2 8.00562 2.53584 8.00562 3.39617C8.00562 4.22304 7.3132 4.84698 6.50281 4.84698C5.80424 4.84698 5 4.32631 5 3.45081ZM6.50281 2.93452C6.16259 2.93452 5.93452 3.18485 5.93452 3.45081C5.93452 3.66815 6.16583 3.91246 6.50281 3.91246C6.84303 3.91246 7.0711 3.66214 7.0711 3.39617C7.0711 3.16367 6.8797 2.93452 6.50281 2.93452Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M4 6.29766C4 6.04913 4.20147 5.84766 4.45 5.84766H8.59132C8.83985 5.84766 9.04132 6.04913 9.04132 6.29766C9.04132 6.54618 8.83985 6.74766 8.59132 6.74766H4.45C4.20147 6.74766 4 6.54618 4 6.29766Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M4 8.09844C4 7.84991 4.20147 7.64844 4.45 7.64844H8.59132C8.83985 7.64844 9.04132 7.84991 9.04132 8.09844C9.04132 8.34697 8.83985 8.54844 8.59132 8.54844H4.45C4.20147 8.54844 4 8.34697 4 8.09844Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.2066 9.69714C10.3817 9.88674 10.3699 10.1824 10.1803 10.3574L8.1092 12.2699C8.0733 12.303 8.03243 12.3303 7.98807 12.3508C7.97063 12.3589 7.95406 12.3675 7.93004 12.3803C7.92816 12.3813 7.92613 12.3824 7.92398 12.3835C7.90296 12.3948 7.86996 12.4124 7.83578 12.4282C7.74555 12.4698 7.63256 12.5064 7.48763 12.5064C7.24563 12.5064 7.01131 12.404 6.86606 12.2699L5.88009 11.3594C5.86722 11.3528 5.85576 11.3467 5.84596 11.3415C5.84105 11.3388 5.8367 11.3365 5.83282 11.3345L3.78426 13.2261C3.59466 13.4012 3.29904 13.3894 3.12397 13.1998C2.9489 13.0102 2.96068 12.7146 3.15027 12.5395L5.22137 10.6271C5.36661 10.493 5.60093 10.3906 5.84293 10.3906C5.98787 10.3906 6.10085 10.4271 6.19109 10.4688C6.22526 10.4846 6.25827 10.5022 6.27928 10.5134C6.28144 10.5146 6.28346 10.5157 6.28535 10.5167C6.30936 10.5295 6.32594 10.5381 6.34337 10.5461C6.38773 10.5666 6.42861 10.5939 6.4645 10.6271L7.47752 11.5625C7.4814 11.5604 7.48575 11.5581 7.49066 11.5555C7.50045 11.5503 7.51192 11.5442 7.52479 11.5375L9.54631 9.67085C9.7359 9.49578 10.0315 9.50755 10.2066 9.69714Z" fill="inherit"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.7419 0.9375H1.25806C1.14226 0.9375 1.04839 1.02145 1.04839 1.125V13.875C1.04839 13.9786 1.14226 14.0625 1.25806 14.0625H11.7419C11.8577 14.0625 11.9516 13.9786 11.9516 13.875V1.125C11.9516 1.02145 11.8577 0.9375 11.7419 0.9375ZM1.25806 0C0.563255 0 0 0.503679 0 1.125V13.875C0 14.4963 0.563255 15 1.25806 15H11.7419C12.4367 15 13 14.4963 13 13.875V1.125C13 0.50368 12.4367 0 11.7419 0H1.25806Z" fill="inherit"/>
</svg>
`,xt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 19">
    <g transform="translate(.5)">
        <circle cx="2.67" cy="2.67" r="2.67"/>
        <path d="M13.42 18.08V3.42H3.06v-1.5h11.86v16.16z"/>
        <path d="M1.92 18.08V2.67h1.5v15.41z"/>
    </g>
</svg>`,Qt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 19">
    <g transform="matrix(-1 0 0 1 15.5 0)">
        <circle cx="2.67" cy="2.67" r="2.67"/>
        <path d="M13.42 18.08V3.42H3.06v-1.5h11.86v16.16z"/>
        <path d="M1.92 18.08V2.67h1.5v15.41z"/>
    </g>
</svg>`,Xt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 19">
  <g transform="translate(2.5)">
    <circle cx="6.67" cy="2.67" r="2.67"/>
    <path d="M11.5 18.16V3.5H0V2h13v16.16z"/>
    <path d="M0 18.16V2.75h1.5v15.41z"/>
  </g>
</svg>`,tn=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.5 20">
    <circle cx="14.17" cy="2.67" r="2.67" />
    <circle cx="25.83" cy="17.33" r="2.67" />
    <rect x="19.25" y="-1.21" width="1.5" height="22.42" transform="translate(-1.79 15.03) rotate(-39.57)" />
    <circle cx="2.67" cy="17.33" r="2.67" />
    <rect x="-2.71" y="9.25" width="22.42" height="1.5" transform="translate(-4.62 10.18) rotate(-50.44)" />
</svg>`,qt=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.34 20">
    <circle cx="14.17" cy="2.67" r="2.67" />
    <circle cx="2.67" cy="17.33" r="2.67" />
    <path d="M3.42,17.33H1.92c0-6.46,4.39-15.41,12.64-15.41v1.5C7.29,3.42,3.42,11.5,3.42,17.33Z" />
    <circle cx="25.67" cy="17.33" r="2.67" />
    <path d="M26.42,17.33h-1.5c0-5.83-3.87-13.91-11.14-13.91V1.92C22,1.92,26.42,10.87,26.42,17.33Z" />
</svg>`,cn=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.34 20">
    <circle cx="14.17" cy="2.67" r="2.67" />
    <circle cx="25.67" cy="17.33" r="2.67" />
    <circle cx="2.67" cy="17.33" r="2.67" />
    <polygon points="26.42 17.33 24.92 17.33 24.92 3.42 14.56 3.42 14.56 1.92 26.42 1.92 26.42 17.33" />
    <polygon points="14.92 18.08 2.67 18.08 2.67 16.58 13.42 16.58 13.42 2.67 14.92 2.67 14.92 18.08" />
</svg>`,ln=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28.34 20">
    <circle cx="14.17" cy="2.67" r="2.67" />
    <circle cx="2.67" cy="17.33" r="2.67" />
    <circle cx="25.67" cy="17.33" r="2.67" />
    <polygon points="3.42 17.33 1.92 17.33 1.92 1.92 13.78 1.92 13.78 3.42 3.42 3.42 3.42 17.33" />
    <polygon points="25.67 18.08 13.42 18.08 13.42 2.67 14.92 2.67 14.92 16.58 25.67 16.58 25.67 18.08" />
</svg>`,Dn=`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
    <path fillRule="evenodd" clipRule="evenodd" d="M2.36906 14.2144H8.68657C8.89601 14.2144 9.09687 14.2976 9.24496 14.4457C9.39306 14.5938 9.47626 14.7946 9.47626 15.0041C9.47626 15.2135 9.39306 15.4144 9.24496 15.5625C9.09687 15.7106 8.89601 15.7938 8.68657 15.7938H2.36906C1.74075 15.7938 1.13817 15.5442 0.693883 15.0999C0.249597 14.6556 0 14.053 0 13.4247V2.36906C0 1.74075 0.249597 1.13817 0.693883 0.693883C1.13817 0.249597 1.74075 0 2.36906 0H7.15457L7.37569 0.0789687H7.44676C7.52795 0.116938 7.60259 0.167585 7.66787 0.229009L12.406 4.96714C12.5156 5.07819 12.5898 5.2192 12.6193 5.37239C12.6488 5.52559 12.6323 5.68409 12.5718 5.8279C12.5126 5.97211 12.412 6.09556 12.2827 6.18269C12.1534 6.26982 12.0012 6.31673 11.8453 6.3175H8.68657C8.05825 6.3175 7.45567 6.06791 7.01139 5.62362C6.5671 5.17934 6.3175 4.57675 6.3175 3.94844V1.57938H2.36906C2.15963 1.57938 1.95877 1.66258 1.81067 1.81067C1.66258 1.95877 1.57938 2.15963 1.57938 2.36906V13.4247C1.57938 13.6341 1.66258 13.835 1.81067 13.9831C1.95877 14.1312 2.15963 14.2144 2.36906 14.2144ZM9.94217 4.73813L7.89688 2.69284V3.94844C7.89688 4.15788 7.98008 4.35874 8.12817 4.50683C8.27627 4.65493 8.47713 4.73813 8.68657 4.73813H9.94217ZM3.34761 12.2739C3.31241 12.1914 3.29137 12.1041 3.2854 12.0158L3.2854 8.36528C3.28184 8.18607 3.34961 8.01561 3.47382 7.89141C3.59802 7.76721 3.76848 7.69943 3.94769 7.70299C4.1269 7.70655 4.30019 7.78116 4.42943 7.9104C4.55867 8.03964 4.63327 8.21293 4.63683 8.39214L4.63684 11.2969L5.92266 11.2969C6.01149 11.2983 6.12471 11.3282 6.20753 11.3636C6.27155 11.391 6.31643 11.4391 6.3631 11.4892L6.36311 11.4892C6.37681 11.5039 6.39066 11.5187 6.4052 11.5332C6.46926 11.5973 6.52051 11.6729 6.55597 11.7557C6.59143 11.8386 6.61041 11.9269 6.61181 12.0158C6.61394 12.1046 6.59846 12.1923 6.56626 12.2738C6.53407 12.3553 6.48579 12.4289 6.42422 12.4905C6.36265 12.552 6.289 12.6003 6.20753 12.6325C6.12605 12.6647 6.01151 12.707 5.92266 12.7049H3.97454C3.8858 12.7025 3.79782 12.6813 3.71644 12.6427C3.55164 12.5712 3.41911 12.4387 3.34761 12.2739ZM8.70634 12.793C9.98203 12.793 11.0162 11.6439 11.0162 10.2265C11.0162 8.80904 9.98203 7.65998 8.70634 7.65998C7.43065 7.65998 6.3965 8.80904 6.3965 10.2265C6.3965 11.6439 7.43065 12.793 8.70634 12.793ZM8.73597 11.5453C9.37381 11.5453 9.89089 10.9407 9.89089 10.1949C9.89089 9.44911 9.37381 8.84453 8.73597 8.84453C8.09813 8.84453 7.58105 9.44911 7.58105 10.1949C7.58105 10.9407 8.09813 11.5453 8.73597 11.5453ZM11.3715 10.2265C11.3715 8.80904 12.4056 7.65998 13.6813 7.65998C14.1833 7.65998 14.7779 7.9067 15.0267 8.14005C15.1561 8.2614 15.3112 8.44705 15.3397 8.63063C15.366 8.80006 15.2757 8.96772 15.162 9.08144C15.0708 9.17262 14.938 9.2579 14.8066 9.25912C14.5968 9.26106 14.3907 9.13001 14.3646 9.08144C14.1787 8.93199 13.9535 8.84451 13.7109 8.84451C13.0731 8.84451 12.556 9.44909 12.556 10.1949C12.556 10.9407 13.0731 11.5452 13.7109 11.5452C14.0485 11.5452 14.3522 11.3759 14.5634 11.106L14.6882 10.8582H14.2144C14.1414 10.8571 14.0483 10.8326 13.9802 10.8034C13.9276 10.7809 13.8907 10.7413 13.8523 10.7002C13.8411 10.6882 13.8297 10.676 13.8177 10.664C13.7651 10.6113 13.723 10.5492 13.6938 10.4811C13.6647 10.413 13.6491 10.3404 13.6479 10.2674C13.6462 10.1943 13.6589 10.1222 13.6853 10.0553C13.7118 9.9883 13.7515 9.92777 13.8021 9.87716C13.8527 9.82654 13.9132 9.78686 13.9802 9.7604C14.0472 9.73393 14.1414 9.69913 14.2144 9.70088H15.4247C15.4977 9.70283 15.57 9.72026 15.6369 9.75202C15.7723 9.8108 15.8813 9.91973 15.94 10.0552C15.94 10.0552 15.9629 10.1198 15.9912 10.266C16.0154 10.3912 15.9852 10.5411 15.9549 10.6909C15.9499 10.7159 15.9448 10.741 15.94 10.7659C15.717 11.9243 14.7905 12.793 13.6813 12.793C12.4056 12.793 11.3715 11.6439 11.3715 10.2265Z" />
</svg>`,zn='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 24 24"><path d="M21 2H3c-.549 0-1 .451-1 1v18c0 .549.451 1 1 1h18c.549 0 1-.451 1-1V3c0-.549-.451-1-1-1ZM8 20H4V4h4v16Zm12 0H10V4h10v16Z" style="fill-rule:nonzero"/><path d="M 14.4 12 L 17.9 8.5 C 18.3 8.1 18.3 7.5 17.9 7.1 C 17.5 6.7 16.9 6.7 16.5 7.1 L 12.3 11.3 C 11.9 11.7 11.9 12.3 12.3 12.7 L 16.5 16.9 C 16.7 17.1 16.9 17.2 17.2 17.2 C 17.5 17.2 17.7 17.1 17.9 16.9 C 18.3 16.5 18.3 15.9 17.9 15.5 L 14.4 12 Z" style="fill-rule:nonzero" transform="matrix(-1, 0, 0, -1, 30.199999, 24.000001)"/></svg>',Za='<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2" viewBox="0 0 24 24"><path d="M21 2H3c-.549 0-1 .451-1 1v18c0 .549.451 1 1 1h18c.549 0 1-.451 1-1V3c0-.549-.451-1-1-1Zm-7 18H4V4h10v16Zm6 0h-4V4h4v16Z" style="fill-rule:nonzero"/><path d="m11.3 12 3.5-3.5c.4-.4.4-1 0-1.4-.4-.4-1-.4-1.4 0l-4.2 4.2c-.4.4-.4 1 0 1.4l4.2 4.2c.2.2.4.3.7.3.3 0 .5-.1.7-.3.4-.4.4-1 0-1.4L11.3 12Z" style="fill-rule:nonzero" transform="rotate(-180 10.55 12)"/></svg>',Nn='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M17.56 21.56a1 1 0 01-.46-.12L12 18.76l-5.1 2.68a1 1 0 01-1.45-1.05l.98-5.68L2.3 10.7a1 1 0 01.56-1.71l5.7-.83L11.1 3a1.04 1.04 0 011.8 0l2.55 5.16 5.7.83a1 1 0 01.55 1.7l-4.13 4.02.98 5.68a1 1 0 01-.99 1.17z"/></svg>',Ga='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 85.12 92.46"><defs><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="42.56" y1="113.26" x2="42.56" y2="28.78"><stop offset="0" stop-color="#FFF200"/><stop offset="1" stop-color="#F15A29"/></linearGradient></defs><path fill="url(#a)" d="M85.01 40.8a33.05 33.05 0 00-3.32-11.69 34.33 34.33 0 00-6.89-9.42c1.3-5.17-1.59-9.65-1.59-9.65-4.98-.31-8.14 1.54-9.31 2.39l-.59-.25a39.35 39.35 0 00-8.21-2.26l-.51-.07C52.41 2.9 46.18 0 46.18 0c-6.95 4.41-8.27 10.57-8.27 10.57l-.07.36-1.15.34c-.53.16-1.06.36-1.59.55-.53.21-1.06.41-1.58.64a31.81 31.81 0 00-6 3.35l-.24-.11c-9.62-3.68-18.17.75-18.17.75-.78 10.24 3.84 16.68 4.76 17.86a44.72 44.72 0 00-2.34 10.15C2.63 48.84 0 57.84 0 57.84c7.42 8.53 16.07 9.06 16.07 9.06l.02-.02a38.29 38.29 0 005.68 7.68c-2.71 7.74.38 14.18.38 14.18a23.03 23.03 0 0014.83-4.52 37.7 37.7 0 0012.19 1.93h.31l.21-.01.41-.01.4-.02.01.01c3.89 5.55 10.74 6.34 10.74 6.34 4.87-5.13 5.15-10.22 5.15-11.33v-.07-.15l-.01-.23a30.34 30.34 0 008.37-8.86c5.51.32 9.39-3.41 9.39-3.41-.91-5.74-4.18-8.54-4.87-9.07l-.07-.05a.61.61 0 01-.06-.05l-.12-.08.08-1.04c.04-.62.06-1.24.06-1.85v-.81-.16l-.02-.38-.03-.52a7.25 7.25 0 00-.09-.98l-.06-.48-.07-.47a23.94 23.94 0 00-7.83-14.37 23.17 23.17 0 00-15.69-5.81l-.41.01H54.73l-.17.01-.4.03-.45.04a18.4 18.4 0 00-12.4 6.49 18.02 18.02 0 00-4.14 10.35 14.54 14.54 0 00-.02 1.65l.01.35.05.63a13.93 13.93 0 005.97 10.16 13.6 13.6 0 003.76 1.79c1.27.38 2.54.54 3.74.53l.44-.01.24-.01.24-.01.38-.04.11-.01.12-.02.23-.03.43-.08.42-.09a10.46 10.46 0 002.26-.83c.45-.23.87-.5 1.26-.77l.33-.25a.96.96 0 00.15-1.35.94.94 0 00-1.19-.23l-.3.16c-.35.17-.71.32-1.09.45a9.54 9.54 0 01-1.83.37l-.32.02-.32.01-.31-.01-.39-.02h-.05l-.09.02-.17-.02-.35-.04a9.98 9.98 0 01-5.36-2.51 9.71 9.71 0 01-3.21-7.39l.02-.47v-.09l.01-.12.02-.23a12.18 12.18 0 016.94-9.8 12.02 12.02 0 014.87-1.07h.23l.27.01.17.01h.1l.27.02a15.57 15.57 0 016.3 1.89 15.18 15.18 0 016.17 6.4 14.52 14.52 0 011.53 5.45l.02.29.01.29.01.29v.52l-.01.28-.03.67a24.8 24.8 0 01-.31 2.46 19.65 19.65 0 01-11.12 14.22 19.46 19.46 0 01-7.28 1.72l-.15.01h-1.02-.09a25.45 25.45 0 01-6.61-1.02 26.1 26.1 0 01-18.72-23.19l-.02-.32-.01-.08V49.57l-.01-.28v-.37l-.01-.4v-.08-.19l.01-.63a29.56 29.56 0 01.65-5.24 34.3 34.3 0 012.46-7.51 27.12 27.12 0 015.61-8.09 22.83 22.83 0 015.69-4.12c.34-.19.7-.35 1.05-.52l.53-.24.54-.23c.72-.3 1.46-.56 2.21-.8l.56-.17.57-.16c.38-.11.76-.2 1.14-.29l.58-.13.58-.12.58-.11.29-.05.29-.04.59-.09.66-.09.65-.08.41-.04.28-.03.14-.01.16-.01.66-.04.33-.02H51.17l.14-.01.56-.03a30.82 30.82 0 016.58.48 30.5 30.5 0 017.89 2.62 31.8 31.8 0 016.44 4.2l.35.3.34.3.66.61.64.62.61.63a33.4 33.4 0 015.43 7.62l.16.3.15.3.29.6c.09.2.19.39.27.59l.25.58a34.09 34.09 0 011.73 5.16c.09.35.42.58.78.55a.72.72 0 00.66-.71c.04-.95.01-2.05-.09-3.3z"/></svg>',Pa='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 20.86a2.75 2.75 0 01-1.95-.8l-6.21-6.22A6.27 6.27 0 0112 4.36a6.27 6.27 0 018.16 9.48l-6.21 6.22a2.75 2.75 0 01-1.95.8z"/></svg>',fa='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18.17 1.85A6.25 6.25 0 0012.12.23l-2.7 6.33 2.83.71a1 1 0 01.67 1.41l-2 4a1 1 0 01-.9.56 1.13 1.13 0 01-.44-.1 1 1 0 01-.46-1.33l1.4-2.89-2.77-.7a1 1 0 01-.65-.53 1 1 0 010-.83L9.58 1a6.27 6.27 0 00-7.73 9.77l7.45 7.41a1 1 0 001.42 0l7.45-7.46a6.27 6.27 0 000-8.87z"/></svg>',Ya='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 117.8 64"><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="96.44" y1="83.7" x2="96.44" y2="-9.48"><stop offset="0" stop-color="#FFF23A"/><stop offset=".04" stop-color="#FEE62D"/><stop offset=".12" stop-color="#FED41A"/><stop offset=".2" stop-color="#FDC90F"/><stop offset=".28" stop-color="#FDC60B"/><stop offset=".67" stop-color="#F28F3F"/><stop offset=".89" stop-color="#ED693C"/><stop offset="1" stop-color="#E83E39"/></linearGradient><path d="M15.2 22.7H1.9c-1.1 0-1.9.9-1.9 1.9v37.5C0 63.2.9 64 1.9 64h13.3c1.1 0 1.9-.9 1.9-1.9V24.6c0-1.1-.8-1.9-1.9-1.9zM36.3 10.2H23c-1.1 0-1.9.9-1.9 1.9v50c0 1.1.9 1.9 1.9 1.9h13.3c1.1 0 1.9-.9 1.9-1.9v-50c0-1-.9-1.9-1.9-1.9zM57.3 32H44c-1.1 0-1.9.9-1.9 1.9V62c0 1.1.9 1.9 1.9 1.9h13.3c1.1 0 1.9-.9 1.9-1.9V34c0-1.1-.8-2-1.9-2zM70.1 38V26.1c0-3.4 2.7-6.1 6.1-6.1h4.1V2c0-1.1-.9-1.9-1.9-1.9H65.1c-1.1-.1-2 .8-2 1.9v60.1c0 1.1.9 1.9 1.9 1.9h13.3c1.1 0 1.9-.9 1.9-1.9v-18h-4.1c-3.2 0-6-2.8-6-6.1z"/><path fill="url(#a)" d="M116.7 24.9H103.6V11.8c0-.6-.5-1.1-1.1-1.1h-12c-.6 0-1.1.5-1.1 1.1v13.1H76.2c-.6 0-1.1.5-1.1 1.1v12c0 .6.5 1.1 1.1 1.1h13.2v13.2c0 .6.5 1.1 1.1 1.1h11.9c.6 0 1.1-.5 1.1-1.1V39.1h13.1c.6 0 1.1-.5 1.1-1.1V26.1c.1-.6-.4-1.2-1-1.2z"/></svg>',ja='<svg xmlns="http://www.w3.org/2000/svg"><path d="M14.3 8.7H9.4a.7.7 0 00-.7.7v4.9a.7.7 0 00.7.7h4.9a.7.7 0 00.7-.7V9.4a.7.7 0 00-.7-.7zm-.7 4.9h-3.5v-3.5h3.5v3.5zM6.6 1H1.7a.7.7 0 00-.7.7v4.9a.7.7 0 00.7.7h4.9a.7.7 0 00.7-.7V1.7a.7.7 0 00-.7-.7zm-.7 4.9H2.4V2.4h3.5v3.5zm8 1.08a.42.42 0 01-.12-.08l-1.63-1.5a.31.31 0 01-.08-.22c0-.08.04-.16.1-.22.06-.06.14-.09.23-.1.09 0 .18.03.24.09l1.03.94V3.62c0-.26-.12-.5-.31-.69a1.1 1.1 0 00-.74-.28H9.35a.36.36 0 01-.25-.1.31.31 0 01-.1-.23c0-.08.04-.16.1-.22.07-.07.16-.1.25-.1h3.28c.46 0 .9.17 1.24.48.33.3.51.71.51 1.14V5.9l1.02-.94a.37.37 0 01.5 0c.03.03.06.06.07.1a.31.31 0 01-.08.35l-1.61 1.5a.35.35 0 01-.12.08.38.38 0 01-.26 0zM2.1 9.02l.12.08 1.63 1.5c.06.06.09.14.08.22 0 .08-.04.16-.1.22a.37.37 0 01-.48.02l-1.02-.95v2.27c0 .26.12.5.31.69.2.18.47.28.74.28h3.27c.1 0 .18.04.25.1.06.06.1.14.1.23s-.04.16-.1.22a.36.36 0 01-.25.1H3.37c-.46 0-.9-.17-1.24-.48s-.5-.71-.5-1.14V10.1l-1.03.94a.37.37 0 01-.5 0 .32.32 0 01-.07-.1.31.31 0 01.08-.35l1.61-1.5a.35.35 0 01.12-.08.38.38 0 01.26 0z" fill="currentColor"/></svg>',Da='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12,2A10,10,0,1,0,22,12,10,10,0,0,0,12,2Zm0,18a8,8,0,1,1,8-8A8,8,0,0,1,12,20ZM12,6a6,6,0,1,0,6,6A6,6,0,0,0,12,6Zm0,10a4,4,0,1,1,4-4A4,4,0,0,1,12,16Z"/></svg>';let vn=!1,xa="public/img/icons/";function Qe(dn,On){a.V[xa+On]={content:dn,status:"loaded"}}function za(){vn=!0;const dn=typeof window!="undefined"&&window.__grafana_public_path__;dn&&(xa=dn+"img/icons/"),Qe(x,"unicons/at.svg"),Qe(d,"unicons/adjust-circle.svg"),Qe(i,"unicons/angle-double-down.svg"),Qe(c,"unicons/angle-double-right.svg"),Qe(E,"unicons/angle-down.svg"),Qe(O,"unicons/angle-left.svg"),Qe(m,"unicons/angle-right.svg"),Qe(w,"unicons/angle-up.svg"),Qe(_,"unicons/apps.svg"),Qe(C,"unicons/arrow.svg"),Qe(b,"unicons/arrow-down.svg"),Qe(g,"unicons/arrow-from-right.svg"),Qe(v,"unicons/arrow-left.svg"),Qe(y,"unicons/arrow-random.svg"),Qe(h,"unicons/arrow-right.svg"),Qe(s,"unicons/arrow-to-right.svg"),Qe(o,"unicons/arrow-up.svg"),Qe(r,"unicons/arrows-h.svg"),Qe(u,"unicons/backward.svg"),Qe(p,"unicons/bars.svg"),Qe(S,"unicons/bell.svg"),Qe(k,"unicons/bell-slash.svg"),Qe(D,"unicons/bolt.svg"),Qe(M,"unicons/book.svg"),Qe(I,"unicons/book-open.svg"),Qe(T,"unicons/brackets-curly.svg"),Qe(j,"unicons/bug.svg"),Qe(K,"unicons/building.svg"),Qe(F,"unicons/calculator-alt.svg"),Qe($,"unicons/calendar-alt.svg"),Qe(R,"unicons/calendar-slash.svg"),Qe(U,"unicons/camera.svg"),Qe(H,"unicons/channel-add.svg"),Qe(W,"unicons/chart-line.svg"),Qe(oe,"unicons/check.svg"),Qe(Q,"unicons/check-circle.svg"),Qe(P,"unicons/circle.svg"),Qe(ae,"unicons/clipboard-alt.svg"),Qe(q,"unicons/clock-nine.svg"),Qe(Y,"unicons/cloud.svg"),Qe(ve,"unicons/cloud-download.svg"),Qe(re,"unicons/code-branch.svg"),Qe(je,"unicons/cog.svg"),Qe(me,"unicons/columns.svg"),Qe(ne,"unicons/comment-alt.svg"),Qe(Z,"unicons/comment-alt-share.svg"),Qe(te,"unicons/comments-alt.svg"),Qe(Pe,"unicons/compass.svg"),Qe(he,"unicons/copy.svg"),Qe(ie,"unicons/corner-down-right-alt.svg"),Qe(Ce,"unicons/cube.svg"),Qe(Le,"unicons/dashboard.svg"),Qe(we,"unicons/database.svg"),Qe(ue,"unicons/document-info.svg"),Qe(Ie,"unicons/download-alt.svg"),Qe(qe,"unicons/draggabledots.svg"),Qe(Je,"unicons/edit.svg"),Qe(Ze,"unicons/ellipsis-v.svg"),Qe(Oe,"unicons/ellipsis-h.svg"),Qe(ce,"unicons/envelope.svg"),Qe(pe,"unicons/exchange-alt.svg"),Qe(J,"unicons/exclamation-triangle.svg"),Qe(L,"unicons/external-link-alt.svg"),Qe(fe,"unicons/eye.svg"),Qe(xe,"unicons/eye-slash.svg"),Qe(We,"unicons/file-alt.svg"),Qe(Ue,"unicons/file-blank.svg"),Qe(at,"unicons/filter.svg"),Qe(it,"unicons/folder.svg"),Qe(_t,"unicons/folder-open.svg"),Qe(wt,"unicons/folder-plus.svg"),Qe(ee,"unicons/folder-upload.svg"),Qe(_e,"unicons/forward.svg"),Qe(ge,"unicons/graph-bar.svg"),Qe(de,"unicons/history.svg"),Qe(Ee,"unicons/home-alt.svg"),Qe(ze,"unicons/import.svg"),Qe(le,"unicons/info.svg"),Qe(ye,"unicons/info-circle.svg"),Qe(Se,"unicons/k6.svg"),Qe(Be,"unicons/key-skeleton-alt.svg"),Qe(Xe,"unicons/keyboard.svg"),Qe(st,"unicons/link.svg"),Qe(mt,"unicons/list-ul.svg"),Qe(rt,"unicons/lock.svg"),Qe(lt,"unicons/minus.svg"),Qe(ft,"unicons/minus-circle.svg"),Qe(St,"unicons/mobile-android.svg"),Qe(gt,"unicons/monitor.svg"),Qe(pt,"unicons/pause.svg"),Qe(ut,"unicons/pen.svg"),Qe(Ot,"unicons/play.svg"),Qe(Wt,"unicons/plug.svg"),Qe(Ht,"unicons/plus.svg"),Qe(on,"unicons/plus-circle.svg"),Qe(un,"unicons/power.svg"),Qe(mn,"unicons/presentation-play.svg"),Qe(wn,"unicons/process.svg"),Qe(Gt,"unicons/question-circle.svg"),Qe(hn,"unicons/repeat.svg"),Qe(fn,"unicons/rocket.svg"),Qe(Hn,"unicons/rss.svg"),Qe(va,"unicons/save.svg"),Qe(ia,"unicons/search.svg"),Qe(ba,"unicons/search-minus.svg"),Qe(ta,"unicons/search-plus.svg"),Qe(na,"unicons/share-alt.svg"),Qe(la,"unicons/shield.svg"),Qe($e,"unicons/signal.svg"),Qe(He,"unicons/signin.svg"),Qe(Ye,"unicons/signout.svg"),Qe(yt,"unicons/sitemap.svg"),Qe(bt,"unicons/slack.svg"),Qe(It,"unicons/sliders-v-alt.svg"),Qe(Lt,"unicons/sort-amount-down.svg"),Qe(zt,"unicons/sort-amount-up.svg"),Qe(Vt,"unicons/square-shape.svg"),Qe(Ut,"unicons/star.svg"),Qe(Kt,"unicons/step-backward.svg"),Qe(xn,"unicons/sync.svg"),Qe(rn,"unicons/table.svg"),Qe(Bn,"unicons/tag-alt.svg"),Qe(_n,"unicons/times.svg"),Qe(Fn,"unicons/trash-alt.svg"),Qe(An,"unicons/unlock.svg"),Qe(Sn,"unicons/upload.svg"),Qe(ua,"unicons/user.svg"),Qe(sn,"unicons/users-alt.svg"),Qe(pa,"unicons/wrap-text.svg"),Qe(sa,"unicons/cloud-upload.svg"),Qe(Rn,"unicons/credit-card.svg"),Qe(gn,"unicons/file-copy-alt.svg"),Qe(ma,"unicons/fire.svg"),Qe(Ta,"unicons/hourglass.svg"),Qe(ya,"unicons/layer-group.svg"),Qe(ke,"unicons/layers-alt.svg"),Qe(Ne,"unicons/line-alt.svg"),Qe(Ge,"unicons/list-ui-alt.svg"),Qe(Et,"unicons/message.svg"),Qe(Jt,"unicons/palette.svg"),Qe(an,"unicons/percentage.svg"),Qe(Cn,"unicons/shield-exclamation.svg"),Qe(En,"unicons/plus-square.svg"),Qe(Tn,"unicons/x.svg"),Qe(kn,"unicons/capture.svg"),Qe(Gn,"custom/gf-grid.svg"),Qe(Ae,"custom/gf-landscape.svg"),Qe(De,"custom/gf-layout-simple.svg"),Qe(Fe,"custom/gf-portrait.svg"),Qe(xt,"custom/gf-bar-alignment-after.svg"),Qe(Qt,"custom/gf-bar-alignment-before.svg"),Qe(Xt,"custom/gf-bar-alignment-center.svg"),Qe(tn,"custom/gf-interpolation-linear.svg"),Qe(qt,"custom/gf-interpolation-smooth.svg"),Qe(cn,"custom/gf-interpolation-step-after.svg"),Qe(ln,"custom/gf-interpolation-step-before.svg"),Qe(Dn,"custom/gf-logs.svg"),Qe(zn,"custom/gf-movepane-left.svg"),Qe(Za,"custom/gf-movepane-right.svg"),Qe(Nn,"mono/favorite.svg"),Qe(Ga,"mono/grafana.svg"),Qe(Pa,"mono/heart.svg"),Qe(fa,"mono/heart-break.svg"),Qe(Ya,"mono/panel-add.svg"),Qe(ja,"mono/library-panel.svg"),Qe(Da,"unicons/record-audio.svg")}var no=e("./src/components/Icon/utils.ts"),Fa=Object.defineProperty,Na=Object.defineProperties,co=Object.getOwnPropertyDescriptors,Wa=Object.getOwnPropertySymbols,_a=Object.prototype.hasOwnProperty,Xa=Object.prototype.propertyIsEnumerable,ao=(dn,On,bn)=>On in dn?Fa(dn,On,{enumerable:!0,configurable:!0,writable:!0,value:bn}):dn[On]=bn,Ja=(dn,On)=>{for(var bn in On||(On={}))_a.call(On,bn)&&ao(dn,bn,On[bn]);if(Wa)for(var bn of Wa(On))Xa.call(On,bn)&&ao(dn,bn,On[bn]);return dn},ka=(dn,On)=>Na(dn,co(On)),aa=(dn,On)=>{var bn={};for(var Mn in dn)_a.call(dn,Mn)&&On.indexOf(Mn)<0&&(bn[Mn]=dn[Mn]);if(dn!=null&&Wa)for(var Mn of Wa(dn))On.indexOf(Mn)<0&&Xa.call(dn,Mn)&&(bn[Mn]=dn[Mn]);return bn};const oo=dn=>({container:t.iv`
      label: Icon;
      display: inline-block;
      line-height: 0;
    `,icon:t.iv`
      vertical-align: middle;
      display: inline-block;
      fill: currentColor;
    `,orange:t.iv`
      fill: ${dn.v1.palette.orange};
    `}),Va=n.forwardRef((dn,On)=>{var bn=dn,{size:Mn="md",type:Sa="default",name:Yn,className:Ca,style:Qa,title:Ha=""}=bn,Xn=aa(bn,["size","type","name","className","style","title"]);const Ia=(0,f.wW)(oo);if(Yn!=null&&Yn.startsWith("fa fa-"))return n.createElement("i",ka(Ja({className:ca(Yn,Ca)},Xn),{style:Qa}));if(vn||za(),(0,l.Mo)(Yn)||console.warn("Icon component passed an invalid icon name",Yn),!Yn||Yn.includes(".."))return n.createElement("div",{ref:On},"invalid icon name");const ro=(0,no.B)(Mn),eo=ro,io=Yn.startsWith("gf-bar-align")?16:Yn.startsWith("gf-interp")?30:ro,Ua=(0,no.y)(Yn,Sa),Oa=`${xa}${Ua}/${Yn}.svg`;return n.createElement("div",ka(Ja({className:Ia.container},Xn),{ref:On}),n.createElement(a.Z,{src:Oa,width:io,height:eo,title:Ha,className:(0,t.cx)(Ia.icon,Ca,Sa==="mono"?{[Ia.orange]:Yn==="favorite"}:""),style:Qa}))});Va.displayName="Icon";function ca(dn,On){return(0,t.cx)(dn,{"fa-spin":dn==="fa fa-spinner"},On)}try{Va.displayName="Icon",Va.__docgenInfo={description:"",displayName:"Icon",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{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!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Icon/Icon.tsx#Icon"]={docgenInfo:Va.__docgenInfo,name:"Icon",path:"src/components/Icon/Icon.tsx#Icon"})}catch(dn){}},"./src/components/Icon/utils.ts":function(se,V,e){"use strict";e.d(V,{B:function(){return a},y:function(){return n}});const t=["grafana","favorite","heart-break","heart","panel-add","library-panel","circle-mono"];function n(l,f){return l!=null&&l.startsWith("gf-")?"custom":t.includes(l)?"mono":f==="default"?"unicons":f==="solid"?"solid":"mono"}function a(l){switch(l){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}}},"./src/components/IconButton/IconButton.tsx":function(se,V,e){"use strict";e.d(V,{h:function(){return h}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/themes/mixins.ts"),x=e("./src/themes/stylesFactory.ts"),d=e("./src/components/Icon/Icon.tsx"),i=e("./src/components/Icon/utils.ts"),c=e("./src/components/Tooltip/Tooltip.tsx"),E=Object.defineProperty,O=Object.defineProperties,m=Object.getOwnPropertyDescriptors,w=Object.getOwnPropertySymbols,_=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable,b=(o,r,u)=>r in o?E(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,g=(o,r)=>{for(var u in r||(r={}))_.call(r,u)&&b(o,u,r[u]);if(w)for(var u of w(r))C.call(r,u)&&b(o,u,r[u]);return o},v=(o,r)=>O(o,m(r)),y=(o,r)=>{var u={};for(var p in o)_.call(o,p)&&r.indexOf(p)<0&&(u[p]=o[p]);if(o!=null&&w)for(var p of w(o))r.indexOf(p)<0&&C.call(o,p)&&(u[p]=o[p]);return u};const h=n.forwardRef((o,r)=>{var u=o,{name:p,size:S="md",iconType:k,tooltip:D,tooltipPlacement:M,ariaLabel:I,className:T,variant:j="secondary"}=u,K=y(u,["name","size","iconType","tooltip","tooltipPlacement","ariaLabel","className","variant"]);const F=(0,l.l4)(),$=s(F,S,j),R=typeof D=="string"?D:"",U=n.createElement("button",v(g({ref:r,"aria-label":I||R},K),{className:(0,t.cx)($.button,T)}),n.createElement(d.J,{name:p,size:S,className:$.icon,type:k}));return D?n.createElement(c.u,{content:D,placement:M},U):U});h.displayName="IconButton";const s=(0,x.B)((o,r,u)=>{const p=(0,i.B)(r),S=Math.max(p/3,8);let k=o.colors.text.primary;return u==="primary"?k=o.colors.primary.text:u==="destructive"&&(k=o.colors.error.text),{button:t.iv`
      width: ${p}px;
      height: ${p}px;
      background: transparent;
      border: none;
      color: ${k};
      padding: 0;
      margin: 0;
      outline: none;
      box-shadow: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      position: relative;
      border-radius: ${o.shape.borderRadius()};
      z-index: 0;
      margin-right: ${o.spacing(.5)};

      &[disabled],
      &:disabled {
        cursor: not-allowed;
        color: ${o.colors.action.disabledText};
        opacity: 0.65;
        box-shadow: none;
      }

      &:before {
        content: '';
        display: block;
        opacity: 1;
        position: absolute;
        transition-duration: 0.2s;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        z-index: -1;
        bottom: -${S}px;
        left: -${S}px;
        right: -${S}px;
        top: -${S}px;
        background: none;
        border-radius: 50%;
        box-sizing: border-box;
        transform: scale(0);
        transition-property: transform, opacity;
      }

      &:focus,
      &:focus-visible {
        ${(0,f.SV)(o)}
      }

      &:focus:not(:focus-visible) {
        ${(0,f.Cq)(o)}
      }

      &:hover {
        color: ${k};

        &:before {
          background-color: ${u==="secondary"?o.colors.action.hover:a.Fq(k,.12)};
          border: none;
          box-shadow: none;
          opacity: 1;
          transform: scale(0.8);
        }
      }
    `,icon:t.iv`
      vertical-align: baseline;
      display: flex;
    `}});try{h.displayName="IconButton",h.__docgenInfo={description:"",displayName:"IconButton",props:{name:{defaultValue:null,description:"Name of the icon *",name:"name",required:!0,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},size:{defaultValue:{value:"md"},description:"Icon size",name:"size",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"xl"'},{value:'"xxl"'},{value:'"xxxl"'}]}},iconType:{defaultValue:null,description:"Type of the icon - mono or default",name:"iconType",required:!1,type:{name:"enum",value:[{value:'"solid"'},{value:'"default"'},{value:'"mono"'}]}},tooltip:{defaultValue:null,description:"Tooltip content to display on hover",name:"tooltip",required:!1,type:{name:"PopoverContent"}},tooltipPlacement:{defaultValue:null,description:"Position of the tooltip",name:"tooltipPlacement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}},variant:{defaultValue:{value:"secondary"},description:"Variant to change the color of the Icon",name:"variant",required:!1,type:{name:"enum",value:[{value:'"primary"'},{value:'"secondary"'},{value:'"destructive"'}]}},ariaLabel:{defaultValue:null,description:"Text avilable ony for screenscreen readers. Will use tooltip text as fallback.",name:"ariaLabel",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/IconButton/IconButton.tsx#IconButton"]={docgenInfo:h.__docgenInfo,name:"IconButton",path:"src/components/IconButton/IconButton.tsx#IconButton"})}catch(o){}},"./src/components/Input/Input.tsx":function(se,V,e){"use strict";e.d(V,{H:function(){return y},I:function(){return v}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/lib/useMeasure.js"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/themes/stylesFactory.ts"),x=e("./src/components/Forms/commonStyles.ts"),d=e("./src/components/Spinner/Spinner.tsx"),i=Object.defineProperty,c=Object.defineProperties,E=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(h,s,o)=>s in h?i(h,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):h[s]=o,C=(h,s)=>{for(var o in s||(s={}))m.call(s,o)&&_(h,o,s[o]);if(O)for(var o of O(s))w.call(s,o)&&_(h,o,s[o]);return h},b=(h,s)=>c(h,E(s)),g=(h,s)=>{var o={};for(var r in h)m.call(h,r)&&s.indexOf(r)<0&&(o[r]=h[r]);if(h!=null&&O)for(var r of O(h))s.indexOf(r)<0&&w.call(h,r)&&(o[r]=h[r]);return o};const v=n.forwardRef((h,s)=>{const o=h,{className:r,addonAfter:u,addonBefore:p,prefix:S,suffix:k,invalid:D,loading:M,width:I=0}=o,T=g(o,["className","addonAfter","addonBefore","prefix","suffix","invalid","loading","width"]),[j,K]=(0,a.Z)(),[F,$]=(0,a.Z)(),R=(0,l.l4)(),U=y({theme:R,invalid:!!D,width:I});return n.createElement("div",{className:(0,t.cx)(U.wrapper,r),"data-testid":"input-wrapper"},!!p&&n.createElement("div",{className:U.addon},p),n.createElement("div",{className:U.inputWrapper},S&&n.createElement("div",{className:U.prefix,ref:j},S),n.createElement("input",b(C({ref:s,className:U.input},T),{style:{paddingLeft:S?K.width+12:void 0,paddingRight:k||M?$.width+12:void 0}})),(k||M)&&n.createElement("div",{className:U.suffix,ref:F},M&&n.createElement(d.$,{className:U.loadingIndicator,inline:!0}),k)),!!u&&n.createElement("div",{className:U.addon},u))});v.displayName="Input";const y=(0,f.B)(({theme:h,invalid:s=!1,width:o})=>{const r="28px",u=t.iv`
    position: absolute;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-grow: 0;
    flex-shrink: 0;
    font-size: ${h.typography.size.md};
    height: 100%;
    /* Min width specified for prefix/suffix classes used outside React component*/
    min-width: ${r};
    color: ${h.colors.text.secondary};
  `;return{wrapper:(0,t.cx)(t.iv`
        label: input-wrapper;
        display: flex;
        width: ${o?`${h.spacing(o)}`:"100%"};
        height: ${h.spacing(h.components.height.md)};
        border-radius: ${h.shape.borderRadius()};
        &:hover {
          > .prefix,
          .suffix,
          .input {
            border-color: ${s?h.colors.error.border:h.colors.primary.border};
          }

          // only show number buttons on hover
          input[type='number'] {
            -moz-appearance: number-input;
            -webkit-appearance: number-input;
            appearance: textfield;
          }

          input[type='number']::-webkit-inner-spin-button,
          input[type='number']::-webkit-outer-spin-button {
            -webkit-appearance: inner-spin-button !important;
            opacity: 1;
          }
        }
      `),inputWrapper:t.iv`
      label: input-inputWrapper;
      position: relative;
      flex-grow: 1;
      /* we want input to be above addons, especially for focused state */
      z-index: 1;

      /* when input rendered with addon before only*/
      &:not(:first-child):last-child {
        > input {
          border-left: none;
          border-top-left-radius: 0;
          border-bottom-left-radius: 0;
        }
      }

      /* when input rendered with addon after only*/
      &:first-child:not(:last-child) {
        > input {
          border-right: none;
          border-top-right-radius: 0;
          border-bottom-right-radius: 0;
        }
      }

      /* when rendered with addon before and after */
      &:not(:first-child):not(:last-child) {
        > input {
          border-right: none;
          border-top-right-radius: 0;
          border-bottom-right-radius: 0;
          border-top-left-radius: 0;
          border-bottom-left-radius: 0;
        }
      }

      input {
        /* paddings specified for classes used outside React component */
        &:not(:first-child) {
          padding-left: ${r};
        }
        &:not(:last-child) {
          padding-right: ${r};
        }
        &[readonly] {
          cursor: default;
        }
      }
    `,input:(0,t.cx)((0,x.GL)(h),(0,x.RK)(h,s),t.iv`
        label: input-input;
        position: relative;
        z-index: 0;
        flex-grow: 1;
        border-radius: ${h.shape.borderRadius()};
        height: 100%;
        width: 100%;
      `),inputDisabled:t.iv`
      background-color: ${h.colors.action.disabledBackground};
      color: ${h.colors.action.disabledText};
      border: 1px solid ${h.colors.action.disabledBackground};
      &:focus {
        box-shadow: none;
      }
    `,addon:t.iv`
      label: input-addon;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-grow: 0;
      flex-shrink: 0;
      position: relative;

      &:first-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        > :last-child {
          border-top-right-radius: 0;
          border-bottom-right-radius: 0;
        }
      }

      &:last-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        > :first-child {
          border-top-left-radius: 0;
          border-bottom-left-radius: 0;
        }
      }
      > *:focus {
        /* we want anything that has focus and is an addon to be above input */
        z-index: 2;
      }
    `,prefix:(0,t.cx)(u,t.iv`
        label: input-prefix;
        padding-left: ${h.spacing(1)};
        padding-right: ${h.spacing(.5)};
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
      `),suffix:(0,t.cx)(u,t.iv`
        label: input-suffix;
        padding-left: ${h.spacing(1)};
        padding-right: ${h.spacing(1)};
        margin-bottom: -2px;
        border-left: none;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        right: 0;
      `),loadingIndicator:t.iv`
      & + * {
        margin-left: ${h.spacing(.5)};
      }
    `}});try{v.displayName="Input",v.__docgenInfo={description:"",displayName:"Input",props:{prefix:{defaultValue:null,description:"Show an icon as a prefix in the input",name:"prefix",required:!1,type:{name:"ReactNode"}},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"}},loading:{defaultValue:null,description:"Show a loading indicator as a suffix in the input",name:"loading",required:!1,type:{name:"boolean"}},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"}},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!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Input/Input.tsx#Input"]={docgenInfo:v.__docgenInfo,name:"Input",path:"src/components/Input/Input.tsx#Input"})}catch(h){}},"./src/components/Input/storyUtils.tsx":function(se,V,e){"use strict";e.d(V,{J:function(){return l}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts"),a=e("./src/components/Icon/Icon.tsx");function l(f){var x;if(f&&f.match(/icon-/g)&&(0,n.iJ)(f.replace(/icon-/g,""))){const i=(x=(0,n.iJ)(f.replace(/icon-/g,"")))!=null?x:"question-circle";return t.createElement(a.J,{name:i})}return f}try{l.displayName="parseAccessory",l.__docgenInfo={description:"",displayName:"parseAccessory",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Input/storyUtils.tsx#parseAccessory"]={docgenInfo:l.__docgenInfo,name:"parseAccessory",path:"src/components/Input/storyUtils.tsx#parseAccessory"})}catch(f){}},"./src/components/Layout/Layout.tsx":function(se,V,e){"use strict";e.d(V,{Ar:function(){return m},Lh:function(){return w},wc:function(){return _}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=Object.defineProperty,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(y,h,s)=>h in y?l(y,h,{enumerable:!0,configurable:!0,writable:!0,value:s}):y[h]=s,c=(y,h)=>{for(var s in h||(h={}))x.call(h,s)&&i(y,s,h[s]);if(f)for(var s of f(h))d.call(h,s)&&i(y,s,h[s]);return y},E=(y,h)=>{var s={};for(var o in y)x.call(y,o)&&h.indexOf(o)<0&&(s[o]=y[o]);if(y!=null&&f)for(var o of f(y))h.indexOf(o)<0&&d.call(y,o)&&(s[o]=y[o]);return s},O=(y=>(y[y.Horizontal=0]="Horizontal",y[y.Vertical=1]="Vertical",y))(O||{});const m=y=>{var h=y,{children:s,orientation:o=0,spacing:r="sm",justify:u="flex-start",align:p="normal",wrap:S=!1,width:k="100%",height:D="100%"}=h,M=E(h,["children","orientation","spacing","justify","align","wrap","width","height"]);const I=(0,a.wW)((0,n.useCallback)(T=>b(T,o,r,u,p,S),[p,u,o,r,S]));return n.createElement("div",c({className:I.layout,style:{width:k,height:D}},M),n.Children.toArray(s).filter(Boolean).map((T,j)=>n.createElement("div",{className:I.childWrapper,key:j},T)))},w=({children:y,spacing:h,justify:s,align:o="center",wrap:r,width:u,height:p})=>n.createElement(m,{spacing:h,justify:s,orientation:0,align:o,width:u,height:p,wrap:r},y),_=({children:y,spacing:h,justify:s,align:o,width:r,height:u})=>n.createElement(m,{spacing:h,justify:s,orientation:1,align:o,width:r,height:u},y),C=({children:y,padding:h,margin:s,grow:o,shrink:r})=>{const u=useStyles2(useCallback(p=>v(p,h,s),[h,s]));return React.createElement("div",{className:cx(u.wrapper,o!==void 0&&css`
            flex-grow: ${o};
          `,r!==void 0&&css`
            flex-shrink: ${r};
          `)},y)},b=(y,h,s,o,r,u)=>{const p=s!=="none"?y.spacing(g[s]):0,S=h===0&&!u||h===1?0:`-${p}`,k=h===1?"vertical-group":"horizontal-group";return{layout:t.iv`
      label: ${k};
      display: flex;
      flex-direction: ${h===1?"column":"row"};
      flex-wrap: ${u?"wrap":"nowrap"};
      justify-content: ${o};
      align-items: ${r};
      height: 100%;
      max-width: 100%;
      // compensate for last row margin when wrapped, horizontal layout
      margin-bottom: ${S};
    `,childWrapper:t.iv`
      label: layoutChildrenWrapper;
      margin-bottom: ${h===0&&!u?0:p};
      margin-right: ${h===0?p:0};
      display: flex;
      align-items: ${r};

      &:last-child {
        margin-bottom: ${h===1&&0};
        margin-right: ${h===0&&0};
      }
    `}},g={none:0,xs:.5,sm:1,md:2,lg:3},v=(y,h,s)=>{const o=h&&h!=="none"&&y.spacing(g[h])||0,r=s&&s!=="none"&&y.spacing(g[s])||0;return{wrapper:css`
      label: container;
      margin: ${r};
      padding: ${o};
    `}};try{m.displayName="Layout",m.__docgenInfo={description:"",displayName:"Layout",props:{orientation:{defaultValue:{value:"Orientation.Horizontal"},description:"",name:"orientation",required:!1,type:{name:"enum",value:[{value:"0"},{value:"1"}]}},spacing:{defaultValue:{value:"sm"},description:"",name:"spacing",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"none"'}]}},justify:{defaultValue:{value:"flex-start"},description:"",name:"justify",required:!1,type:{name:"enum",value:[{value:'"flex-start"'},{value:'"flex-end"'},{value:'"space-between"'},{value:'"center"'}]}},align:{defaultValue:{value:"center"},description:"",name:"align",required:!1,type:{name:"enum",value:[{value:'"flex-start"'},{value:'"flex-end"'},{value:'"center"'},{value:'"normal"'}]}},width:{defaultValue:{value:"100%"},description:"",name:"width",required:!1,type:{name:"string"}},wrap:{defaultValue:{value:"false"},description:"",name:"wrap",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Layout/Layout.tsx#Layout"]={docgenInfo:m.__docgenInfo,name:"Layout",path:"src/components/Layout/Layout.tsx#Layout"})}catch(y){}try{w.displayName="HorizontalGroup",w.__docgenInfo={description:"",displayName:"HorizontalGroup",props:{width:{defaultValue:{value:"100%"},description:"",name:"width",required:!1,type:{name:"string"}},wrap:{defaultValue:{value:"false"},description:"",name:"wrap",required:!1,type:{name:"boolean"}},align:{defaultValue:{value:"center"},description:"",name:"align",required:!1,type:{name:"enum",value:[{value:'"flex-start"'},{value:'"flex-end"'},{value:'"center"'},{value:'"normal"'}]}},spacing:{defaultValue:{value:"sm"},description:"",name:"spacing",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"none"'}]}},justify:{defaultValue:{value:"flex-start"},description:"",name:"justify",required:!1,type:{name:"enum",value:[{value:'"flex-start"'},{value:'"flex-end"'},{value:'"space-between"'},{value:'"center"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Layout/Layout.tsx#HorizontalGroup"]={docgenInfo:w.__docgenInfo,name:"HorizontalGroup",path:"src/components/Layout/Layout.tsx#HorizontalGroup"})}catch(y){}try{_.displayName="VerticalGroup",_.__docgenInfo={description:"",displayName:"VerticalGroup",props:{width:{defaultValue:{value:"100%"},description:"",name:"width",required:!1,type:{name:"string"}},align:{defaultValue:{value:"center"},description:"",name:"align",required:!1,type:{name:"enum",value:[{value:'"flex-start"'},{value:'"flex-end"'},{value:'"center"'},{value:'"normal"'}]}},spacing:{defaultValue:{value:"sm"},description:"",name:"spacing",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"none"'}]}},justify:{defaultValue:{value:"flex-start"},description:"",name:"justify",required:!1,type:{name:"enum",value:[{value:'"flex-start"'},{value:'"flex-end"'},{value:'"space-between"'},{value:'"center"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Layout/Layout.tsx#VerticalGroup"]={docgenInfo:_.__docgenInfo,name:"VerticalGroup",path:"src/components/Layout/Layout.tsx#VerticalGroup"})}catch(y){}try{C.displayName="Container",C.__docgenInfo={description:"",displayName:"Container",props:{padding:{defaultValue:null,description:"",name:"padding",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"none"'}]}},margin:{defaultValue:null,description:"",name:"margin",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"none"'}]}},grow:{defaultValue:null,description:"",name:"grow",required:!1,type:{name:"number"}},shrink:{defaultValue:null,description:"",name:"shrink",required:!1,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Layout/Layout.tsx#Container"]={docgenInfo:C.__docgenInfo,name:"Container",path:"src/components/Layout/Layout.tsx#Container"})}catch(y){}},"./src/components/LoadingBar/LoadingBar.tsx":function(se,V,e){"use strict";e.d(V,{F:function(){return d}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx");const l=2.4,f=500,x=4e3;function d({width:c,ariaLabel:E="Loading bar"}){const O=(0,a.wW)(i),m=Math.min(Math.max(Math.round(c*l),f),x),w={width:"100%",animation:`${O.animation} ${m}ms infinite linear`,willChange:"transform"};return n.createElement("div",{style:w},n.createElement("div",{"aria-label":E,className:O.bar}))}const i=()=>({animation:(0,t.F4)({"0%":{transform:"translateX(-50%)"},"100%":{transform:"translateX(100%)"}}),bar:(0,t.iv)({width:"28%",height:1,background:"linear-gradient(90deg, rgba(110, 159, 255, 0) 0%, #6E9FFF 80.75%, rgba(110, 159, 255, 0) 100%)"})});try{d.displayName="LoadingBar",d.__docgenInfo={description:"",displayName:"LoadingBar",props:{width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},ariaLabel:{defaultValue:{value:"Loading bar"},description:"",name:"ariaLabel",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/LoadingBar/LoadingBar.tsx#LoadingBar"]={docgenInfo:d.__docgenInfo,name:"LoadingBar",path:"src/components/LoadingBar/LoadingBar.tsx#LoadingBar"})}catch(c){}},"./src/components/LoadingPlaceholder/LoadingPlaceholder.tsx":function(se,V,e){"use strict";e.d(V,{u:function(){return m}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/Spinner/Spinner.tsx"),f=Object.defineProperty,x=Object.getOwnPropertySymbols,d=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable,c=(_,C,b)=>C in _?f(_,C,{enumerable:!0,configurable:!0,writable:!0,value:b}):_[C]=b,E=(_,C)=>{for(var b in C||(C={}))d.call(C,b)&&c(_,b,C[b]);if(x)for(var b of x(C))i.call(C,b)&&c(_,b,C[b]);return _},O=(_,C)=>{var b={};for(var g in _)d.call(_,g)&&C.indexOf(g)<0&&(b[g]=_[g]);if(_!=null&&x)for(var g of x(_))C.indexOf(g)<0&&i.call(_,g)&&(b[g]=_[g]);return b};const m=_=>{var C=_,{text:b,className:g}=C,v=O(C,["text","className"]);const y=(0,a.wW)(w);return n.createElement("div",E({className:(0,t.cx)(y.container,g)},v),b," ",n.createElement(l.$,{inline:!0}))},w=_=>({container:t.iv`
      margin-bottom: ${_.spacing(4)};
    `});try{m.displayName="LoadingPlaceholder",m.__docgenInfo={description:"",displayName:"LoadingPlaceholder",props:{text:{defaultValue:null,description:"",name:"text",required:!0,type:{name:"ReactNode"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/LoadingPlaceholder/LoadingPlaceholder.tsx#LoadingPlaceholder"]={docgenInfo:m.__docgenInfo,name:"LoadingPlaceholder",path:"src/components/LoadingPlaceholder/LoadingPlaceholder.tsx#LoadingPlaceholder"})}catch(_){}},"./src/components/Menu/Menu.tsx":function(se,V,e){"use strict";e.d(V,{v:function(){return h}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx");function l(){const o=(0,a.wW)(f);return n.createElement("div",{className:o.divider})}const f=o=>({divider:(0,t.iv)({height:1,backgroundColor:o.colors.border.weak,margin:o.spacing(.5,0)})});var x=e("./src/components/Menu/MenuGroup.tsx"),d=e("./src/components/Menu/MenuItem.tsx"),i=e("./src/components/Menu/hooks.ts"),c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(o,r,u)=>r in o?c(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,b=(o,r)=>{for(var u in r||(r={}))w.call(r,u)&&C(o,u,r[u]);if(m)for(var u of m(r))_.call(r,u)&&C(o,u,r[u]);return o},g=(o,r)=>E(o,O(r)),v=(o,r)=>{var u={};for(var p in o)w.call(o,p)&&r.indexOf(p)<0&&(u[p]=o[p]);if(o!=null&&m)for(var p of m(o))r.indexOf(p)<0&&_.call(o,p)&&(u[p]=o[p]);return u};const y=n.forwardRef((o,r)=>{var u=o,{header:p,children:S,ariaLabel:k,onOpen:D,onClose:M,onKeyDown:I}=u,T=v(u,["header","children","ariaLabel","onOpen","onClose","onKeyDown"]);const j=(0,a.wW)(s),K=(0,n.useRef)(null);(0,n.useImperativeHandle)(r,()=>K.current);const[F]=(0,i.d)({localRef:K,onOpen:D,onClose:M,onKeyDown:I});return n.createElement("div",g(b({},T),{tabIndex:-1,ref:K,className:j.wrapper,role:"menu","aria-label":k,onKeyDown:F}),p&&n.createElement("div",{className:(0,t.cx)(j.header,Boolean(S)&&n.Children.toArray(S).length>0&&j.headerBorder)},p),S)});y.displayName="Menu";const h=Object.assign(y,{Item:d.s,Divider:l,Group:x.k}),s=o=>({header:(0,t.iv)({padding:`${o.spacing(.5,1,1,1)}`}),headerBorder:(0,t.iv)({borderBottom:`1px solid ${o.colors.border.weak}`}),wrapper:(0,t.iv)({background:`${o.colors.background.primary}`,boxShadow:`${o.shadows.z3}`,display:"inline-block",borderRadius:`${o.shape.borderRadius()}`,padding:`${o.spacing(.5,0)}`})});try{h.displayName="Menu",h.__docgenInfo={description:"",displayName:"Menu",props:{header:{defaultValue:null,description:"React element rendered at the top of the menu",name:"header",required:!1,type:{name:"ReactNode"}},ariaLabel:{defaultValue:null,description:"",name:"ariaLabel",required:!1,type:{name:"string"}},onOpen:{defaultValue:null,description:"",name:"onOpen",required:!1,type:{name:"((focusOnItem: (itemId: number) => void) => void)"}},onClose:{defaultValue:null,description:"",name:"onClose",required:!1,type:{name:"(() => void)"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"KeyboardEventHandler<Element>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Menu/Menu.tsx#Menu"]={docgenInfo:h.__docgenInfo,name:"Menu",path:"src/components/Menu/Menu.tsx#Menu"})}catch(o){}},"./src/components/Menu/MenuGroup.tsx":function(se,V,e){"use strict";e.d(V,{k:function(){return x}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),a=e.n(n),l=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),f=e("./src/themes/ThemeContext.tsx");const x=({label:i,ariaLabel:c,children:E})=>{const O=(0,f.wW)(d),m=`group-label-${(0,n.uniqueId)()}`;return l.createElement("div",{role:"group","aria-labelledby":!c&&i?m:void 0,"aria-label":c},i&&l.createElement("label",{id:m,className:O.groupLabel,"aria-hidden":!0},i),E)};x.displayName="MenuGroup";const d=i=>({groupLabel:t.iv`
      color: ${i.colors.text.secondary};
      font-size: ${i.typography.size.sm};
      padding: ${i.spacing(.5,1)};
    `});try{x.displayName="MenuGroup",x.__docgenInfo={description:"",displayName:"MenuGroup",props:{children:{defaultValue:null,description:"special children prop to pass children elements",name:"children",required:!0,type:{name:"ReactNode"}},label:{defaultValue:null,description:"Label for the menu items group",name:"label",required:!1,type:{name:"string"}},ariaLabel:{defaultValue:null,description:"Aria label for accessibility support",name:"ariaLabel",required:!1,type:{name:"string"}},items:{defaultValue:null,description:"Items of the group",name:"items",required:!1,type:{name:"MenuItemProps<any>[]"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Menu/MenuGroup.tsx#MenuGroup"]={docgenInfo:x.__docgenInfo,name:"MenuGroup",path:"src/components/Menu/MenuGroup.tsx#MenuGroup"})}catch(i){}},"./src/components/Menu/MenuItem.tsx":function(se,V,e){"use strict";e.d(V,{s:function(){return g}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/themes/mixins.ts"),f=e("./src/components/Icon/Icon.tsx"),x=e("../grafana-e2e-selectors/src/selectors/index.ts"),d=e("./src/components/Menu/hooks.ts");const i=y=>{if(!y)return!1;const h=y.parentElement.getBoundingClientRect(),s=y.getBoundingClientRect();return s.width!==0&&h.right+s.width+10>window.innerWidth},c=n.memo(({items:y,isOpen:h,openedWithArrow:s,setOpenedWithArrow:o,close:r,customStyle:u})=>{const p=(0,a.wW)(E),S=(0,n.useRef)(null),[k]=(0,d.d)({localRef:S,isMenuOpen:h,openedWithArrow:s,setOpenedWithArrow:o,close:r}),[D,M]=(0,n.useState)(!1);return(0,n.useEffect)(()=>{h&&S.current&&M(i(S.current))},[h]),n.createElement(n.Fragment,null,n.createElement("div",{className:p.iconWrapper,"aria-label":x.wl.components.Menu.SubMenu.icon},n.createElement(f.J,{name:"angle-right",className:p.icon,"aria-hidden":!0})),h&&n.createElement("div",{ref:S,className:(0,t.cx)(p.subMenu,{[p.pushLeft]:D}),"aria-label":x.wl.components.Menu.SubMenu.container,style:u},n.createElement("div",{tabIndex:-1,className:p.itemsWrapper,role:"menu",onKeyDown:k},y)))});c.displayName="SubMenu";const E=y=>({iconWrapper:t.iv`
      display: flex;
      flex: 1;
      justify-content: end;
    `,icon:t.iv`
      opacity: 0.7;
      margin-left: ${y.spacing(1)};
      color: ${y.colors.text.secondary};
    `,itemsWrapper:t.iv`
      background: ${y.colors.background.primary};
      box-shadow: ${y.shadows.z3};
      display: inline-block;
      border-radius: ${y.shape.borderRadius()};
    `,pushLeft:t.iv`
      right: 100%;
      left: unset;
    `,subMenu:t.iv`
      position: absolute;
      top: 0;
      left: 100%;
      z-index: ${y.zIndex.dropdown};
    `});try{c.displayName="SubMenu",c.__docgenInfo={description:"",displayName:"SubMenu",props:{items:{defaultValue:null,description:"List of menu items of the subMenu",name:"items",required:!1,type:{name:"ReactElement<MenuItemProps<any>, string | JSXElementConstructor<any>>[]"}},isOpen:{defaultValue:null,description:"Open",name:"isOpen",required:!0,type:{name:"boolean"}},openedWithArrow:{defaultValue:null,description:"Marks whether subMenu was opened with arrow",name:"openedWithArrow",required:!0,type:{name:"boolean"}},setOpenedWithArrow:{defaultValue:null,description:"Changes value of openedWithArrow",name:"setOpenedWithArrow",required:!0,type:{name:"(openedWithArrow: boolean) => void"}},close:{defaultValue:null,description:"Closes the subMenu",name:"close",required:!0,type:{name:"() => void"}},customStyle:{defaultValue:null,description:"Custom style",name:"customStyle",required:!1,type:{name:"CSSProperties"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Menu/SubMenu.tsx#SubMenu"]={docgenInfo:c.__docgenInfo,name:"SubMenu",path:"src/components/Menu/SubMenu.tsx#SubMenu"})}catch(y){}var O=Object.defineProperty,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(y,h,s)=>h in y?O(y,h,{enumerable:!0,configurable:!0,writable:!0,value:s}):y[h]=s,b=(y,h)=>{for(var s in h||(h={}))w.call(h,s)&&C(y,s,h[s]);if(m)for(var s of m(h))_.call(h,s)&&C(y,s,h[s]);return y};const g=n.memo(n.forwardRef((y,h)=>{const{url:s,icon:o,label:r,ariaLabel:u,ariaChecked:p,target:S,onClick:k,className:D,active:M,disabled:I,destructive:T,childItems:j,role:K="menuitem",tabIndex:F=-1,customSubMenuContainerStyles:$,shortcut:R,testId:U}=y,H=(0,a.wW)(v),[W,oe]=(0,n.useState)(M),[Q,P]=(0,n.useState)(!1),[ae,q]=(0,n.useState)(!1),Y=(0,n.useCallback)(()=>{I||(P(!0),oe(!0))},[I]),ve=(0,n.useCallback)(()=>{I||(P(!1),oe(!1))},[I]),re=j&&j.length>0,je=re?"div":s===void 0?"button":"a",me=(0,t.cx)({[H.item]:!0,[H.active]:W,[H.disabled]:I,[H.destructive]:T&&!I},D),ne=b(b({[je==="button"?"disabled":"aria-disabled"]:I},je==="a"&&I&&{href:void 0,onClick:void 0}),I&&{tabIndex:-1,["data-disabled"]:I}),Z=(0,n.useRef)(null);(0,n.useImperativeHandle)(h,()=>Z.current);const te=ie=>{switch(ie.key){case"ArrowRight":ie.preventDefault(),ie.stopPropagation(),re&&(P(!0),q(!0),oe(!0));break;default:break}},Pe=()=>{var ie;P(!1),oe(!1),(ie=Z==null?void 0:Z.current)==null||ie.focus()},he=Boolean(R&&R.length>0);return n.createElement(je,b({target:S,className:me,rel:S==="_blank"?"noopener noreferrer":void 0,href:s,onClick:k,onMouseEnter:Y,onMouseLeave:ve,onKeyDown:te,role:s===void 0?K:void 0,"data-role":"menuitem",ref:Z,"data-testid":U,"aria-label":u,"aria-checked":p,tabIndex:F},ne),n.createElement(n.Fragment,null,o&&n.createElement(f.J,{name:o,className:H.icon,"aria-hidden":!0}),r,n.createElement("div",{className:(0,t.cx)(H.rightWrapper,{[H.withShortcut]:he})},he&&n.createElement("div",{className:H.shortcut},n.createElement(f.J,{name:"keyboard","aria-hidden":!0}),R),re&&n.createElement(c,{items:j,isOpen:Q,openedWithArrow:ae,setOpenedWithArrow:q,close:Pe,customStyle:$}))))}));g.displayName="MenuItem";const v=y=>({item:t.iv`
      background: none;
      cursor: pointer;
      white-space: nowrap;
      color: ${y.colors.text.primary};
      display: flex;
      align-items: center;
      padding: ${y.spacing(.5,2)};
      min-height: ${y.spacing(4)};
      margin: 0;
      border: none;
      width: 100%;
      position: relative;

      &:hover,
      &:focus,
      &:focus-visible {
        background: ${y.colors.action.hover};
        color: ${y.colors.text.primary};
        text-decoration: none;
      }

      &:focus-visible {
        ${(0,l.SV)(y)}
      }
    `,active:t.iv`
      background: ${y.colors.action.hover};
    `,destructive:t.iv`
      color: ${y.colors.error.text};

      svg {
        color: ${y.colors.error.text};
      }

      &:hover,
      &:focus,
      &:focus-visible {
        background: ${y.colors.error.main};
        color: ${y.colors.error.contrastText};

        svg {
          color: ${y.colors.error.contrastText};
        }
      }
    `,disabled:t.iv`
      color: ${y.colors.action.disabledText};

      &:hover,
      &:focus,
      &:focus-visible {
        cursor: not-allowed;
        background: none;
        color: ${y.colors.action.disabledText};
      }
    `,icon:t.iv`
      opacity: 0.7;
      margin-right: 10px;
      margin-left: -4px;
      color: ${y.colors.text.secondary};
    `,rightWrapper:t.iv`
      display: flex;
      align-items: center;
      margin-left: auto;
    `,shortcutIcon:t.iv`
      margin-right: ${y.spacing(1)};
    `,withShortcut:t.iv`
      min-width: ${y.spacing(10.5)};
    `,shortcut:t.iv`
      display: flex;
      align-items: center;
      gap: ${y.spacing(1)};
      margin-left: ${y.spacing(2)};
      color: ${y.colors.text.secondary};
      opacity: 0.7;
    `});try{g.displayName="MenuItem",g.__docgenInfo={description:"",displayName:"MenuItem",props:{label:{defaultValue:null,description:"Label of the menu item",name:"label",required:!0,type:{name:"string"}},ariaLabel:{defaultValue:null,description:"Aria label for accessibility support",name:"ariaLabel",required:!1,type:{name:"string"}},ariaChecked:{defaultValue:null,description:"Aria checked for accessibility support",name:"ariaChecked",required:!1,type:{name:"boolean"}},target:{defaultValue:null,description:"Target of the menu item (i.e. new window)",name:"target",required:!1,type:{name:"enum",value:[{value:'"_blank"'},{value:'"_self"'}]}},icon:{defaultValue:null,description:"Icon of the menu item",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},role:{defaultValue:null,description:"Role of the menu item",name:"role",required:!1,type:{name:"string"}},url:{defaultValue:null,description:"Url of the menu item",name:"url",required:!1,type:{name:"string"}},onClick:{defaultValue:null,description:"Handler for the click behaviour",name:"onClick",required:!1,type:{name:"((event: MouseEvent<HTMLElement, MouseEvent>, payload?: any) => void)"}},className:{defaultValue:null,description:"Custom MenuItem styles",name:"className",required:!1,type:{name:"string"}},active:{defaultValue:null,description:"Active",name:"active",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"Disabled",name:"disabled",required:!1,type:{name:"boolean"}},destructive:{defaultValue:null,description:"Show in destructive style (error color)",name:"destructive",required:!1,type:{name:"boolean"}},tabIndex:{defaultValue:null,description:"",name:"tabIndex",required:!1,type:{name:"number"}},childItems:{defaultValue:null,description:"List of menu items for the subMenu",name:"childItems",required:!1,type:{name:"ReactElement<MenuItemProps<any>, string | JSXElementConstructor<any>>[]"}},customSubMenuContainerStyles:{defaultValue:null,description:"Custom style for SubMenu",name:"customSubMenuContainerStyles",required:!1,type:{name:"CSSProperties"}},shortcut:{defaultValue:null,description:"Shortcut key combination",name:"shortcut",required:!1,type:{name:"string"}},testId:{defaultValue:null,description:"Test id for e2e tests and fullstory",name:"testId",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Menu/MenuItem.tsx#MenuItem"]={docgenInfo:g.__docgenInfo,name:"MenuItem",path:"src/components/Menu/MenuItem.tsx#MenuItem"})}catch(y){}},"./src/components/Menu/hooks.ts":function(se,V,e){"use strict";e.d(V,{d:function(){return f}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useEffectOnce.js");const a=(x,d)=>(x%d+d)%d,l=-1,f=({localRef:x,isMenuOpen:d,openedWithArrow:i,setOpenedWithArrow:c,close:E,onOpen:O,onClose:m,onKeyDown:w})=>{const[_,C]=(0,t.useState)(l);return(0,t.useEffect)(()=>{d&&i&&(C(0),c==null||c(!1))},[d,i,c]),(0,t.useEffect)(()=>{var g,v;const y=(g=x==null?void 0:x.current)==null?void 0:g.querySelectorAll('[data-role="menuitem"]:not([data-disabled])');(v=y==null?void 0:y[_])==null||v.focus(),y==null||y.forEach((h,s)=>{h.tabIndex=s===_?0:-1})},[x,_]),(0,n.Z)(()=>{O==null||O(C)}),[g=>{var v,y,h;const s=(v=x==null?void 0:x.current)==null?void 0:v.querySelectorAll('[data-role="menuitem"]:not([data-disabled])'),o=(y=s==null?void 0:s.length)!=null?y:0;switch(g.key){case"ArrowUp":g.preventDefault(),g.stopPropagation(),C(a(_-1,o));break;case"ArrowDown":g.preventDefault(),g.stopPropagation(),C(a(_+1,o));break;case"ArrowLeft":g.preventDefault(),g.stopPropagation(),C(l),E==null||E();break;case"Home":g.preventDefault(),g.stopPropagation(),C(0);break;case"End":g.preventDefault(),g.stopPropagation(),C(o-1);break;case"Enter":g.preventDefault(),g.stopPropagation(),(h=s==null?void 0:s[_])==null||h.click();break;case"Escape":m==null||m();break;case"Tab":g.preventDefault(),m==null||m();break;default:break}w==null||w(g)}]}},"./src/components/Modal/Modal.tsx":function(se,V,e){"use strict";e.d(V,{u:function(){return h}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@react-aria-dialog-virtual-6e50988279/2/yarn/cache/@react-aria-dialog-npm-3.3.1-c100ba6958-ba924f07a7.zip/node_modules/@react-aria/dialog/dist/module.js"),a=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),l=e("../../.yarn/__virtual__/@react-aria-overlays-virtual-34e54d82d1/2/yarn/cache/@react-aria-overlays-npm-3.10.1-f232007f1a-b83ec155d3.zip/node_modules/@react-aria/overlays/dist/module.js"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/components/IconButton/IconButton.tsx"),i=e("./src/components/Layout/Layout.tsx"),c=e("./src/components/Modal/ModalHeader.tsx"),E=e("./src/components/Modal/getModalStyles.ts"),O=Object.defineProperty,m=Object.defineProperties,w=Object.getOwnPropertyDescriptors,_=Object.getOwnPropertySymbols,C=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable,g=(r,u,p)=>u in r?O(r,u,{enumerable:!0,configurable:!0,writable:!0,value:p}):r[u]=p,v=(r,u)=>{for(var p in u||(u={}))C.call(u,p)&&g(r,p,u[p]);if(_)for(var p of _(u))b.call(u,p)&&g(r,p,u[p]);return r},y=(r,u)=>m(r,w(u));function h(r){const{title:u,children:p,isOpen:S=!1,closeOnEscape:k=!0,closeOnBackdropClick:D=!0,className:M,contentClassName:I,onDismiss:T,onClickBackdrop:j,trapFocus:K=!0}=r,F=(0,x.l4)(),$=(0,E.J)(F),R=(0,f.useRef)(null),{overlayProps:U,underlayProps:H}=(0,l.Ir)({isKeyboardDismissDisabled:!k,isOpen:S,onClose:T},R),{dialogProps:W,titleProps:oe}=(0,n.R)({},R);if(!S)return null;const Q=(0,t.cx)($.modalHeader,typeof u!="string"&&$.modalHeaderWithTabs);return f.createElement(l.Xj,null,f.createElement("div",v({role:"presentation",className:$.modalBackdrop,onClick:j||(D?T:void 0)},H)),f.createElement(a.MT,{contain:K,autoFocus:!0,restoreFocus:!0},f.createElement("div",v(v({className:(0,t.cx)($.modal,M),ref:R},U),W),f.createElement("div",{className:Q},typeof u=="string"&&f.createElement(o,y(v({},r),{title:u,id:oe.id})),typeof u!="string"&&u,f.createElement("div",{className:$.modalHeaderClose},f.createElement(d.h,{"aria-label":"Close dialogue",name:"times",size:"xl",onClick:T}))),f.createElement("div",{className:(0,t.cx)($.modalContent,I)},p))))}function s({leftItems:r,children:u}){const p=(0,x.l4)(),S=(0,E.J)(p);return r?f.createElement("div",{className:S.modalButtonRow},f.createElement(i.Lh,{justify:"space-between"},f.createElement(i.Lh,{justify:"flex-start",spacing:"md"},r),f.createElement(i.Lh,{justify:"flex-end",spacing:"md"},u))):f.createElement("div",{className:S.modalButtonRow},f.createElement(i.Lh,{justify:"flex-end",spacing:"md"},u))}h.ButtonRow=s;function o({icon:r,iconTooltip:u,title:p,id:S}){return f.createElement(c.x,{icon:r,iconTooltip:u,title:p,id:S})}try{h.displayName="Modal",h.__docgenInfo={description:"",displayName:"Modal",props:{icon:{defaultValue:null,description:"@deprecated no longer used",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},iconTooltip:{defaultValue:null,description:"@deprecated no longer used",name:"iconTooltip",required:!1,type:{name:"string"}},title:{defaultValue:null,description:"Title for the modal or custom header element",name:"title",required:!0,type:{name:"string | Element"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},contentClassName:{defaultValue:null,description:"",name:"contentClassName",required:!1,type:{name:"string"}},closeOnEscape:{defaultValue:null,description:"",name:"closeOnEscape",required:!1,type:{name:"boolean"}},closeOnBackdropClick:{defaultValue:null,description:"",name:"closeOnBackdropClick",required:!1,type:{name:"boolean"}},trapFocus:{defaultValue:null,description:"",name:"trapFocus",required:!1,type:{name:"boolean"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},onDismiss:{defaultValue:null,description:"",name:"onDismiss",required:!1,type:{name:"(() => void)"}},onClickBackdrop:{defaultValue:null,description:"If not set will call onDismiss if that is set.",name:"onClickBackdrop",required:!1,type:{name:"(() => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Modal/Modal.tsx#Modal"]={docgenInfo:h.__docgenInfo,name:"Modal",path:"src/components/Modal/Modal.tsx#Modal"})}catch(r){}try{h.ButtonRow.displayName="Modal.ButtonRow",h.ButtonRow.__docgenInfo={description:"",displayName:"Modal.ButtonRow",props:{leftItems:{defaultValue:null,description:"",name:"leftItems",required:!1,type:{name:"ReactNode"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Modal/Modal.tsx#Modal.ButtonRow"]={docgenInfo:h.ButtonRow.__docgenInfo,name:"Modal.ButtonRow",path:"src/components/Modal/Modal.tsx#Modal.ButtonRow"})}catch(r){}},"./src/components/Modal/ModalHeader.tsx":function(se,V,e){"use strict";e.d(V,{x:function(){return l}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/themes/ThemeContext.tsx"),a=e("./src/components/Modal/getModalStyles.ts");const l=({icon:f,iconTooltip:x,title:d,children:i,id:c})=>{const E=(0,n.wW)(a.J);return t.createElement(t.Fragment,null,t.createElement("h2",{className:E.modalHeaderTitle,id:c},d),i)};try{l.displayName="ModalHeader",l.__docgenInfo={description:"",displayName:"ModalHeader",props:{title:{defaultValue:null,description:"",name:"title",required:!0,type:{name:"string"}},id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string"}},icon:{defaultValue:null,description:"@deprecated",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},iconTooltip:{defaultValue:null,description:"@deprecated",name:"iconTooltip",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Modal/ModalHeader.tsx#ModalHeader"]={docgenInfo:l.__docgenInfo,name:"ModalHeader",path:"src/components/Modal/ModalHeader.tsx#ModalHeader"})}catch(f){}},"./src/components/Modal/getModalStyles.ts":function(se,V,e){"use strict";e.d(V,{J:function(){return a}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("./src/themes/stylesFactory.ts");const a=(0,n.B)(l=>{const f=l.shape.borderRadius(1);return{modal:t.iv`
      position: fixed;
      z-index: ${l.zIndex.modal};
      background: ${l.colors.background.primary};
      box-shadow: ${l.shadows.z3};
      border-radius: ${f};
      border: 1px solid ${l.colors.border.weak};
      background-clip: padding-box;
      outline: none;
      width: 750px;
      max-width: 100%;
      left: 0;
      right: 0;
      margin-left: auto;
      margin-right: auto;
      top: 10%;
      max-height: 80%;
      display: flex;
      flex-direction: column;
    `,modalBackdrop:t.iv`
      position: fixed;
      z-index: ${l.zIndex.modalBackdrop};
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background-color: ${l.components.overlay.background};
      backdrop-filter: blur(1px);
    `,modalHeader:t.iv`
      label: modalHeader;
      display: flex;
      align-items: center;
      min-height: 42px;
      margin: ${l.spacing(1,2,0,2)};
    `,modalHeaderWithTabs:t.iv`
      border-bottom: 1px solid ${l.colors.border.weak};
    `,modalHeaderTitle:t.iv`
      font-size: ${l.typography.size.lg};
      margin: ${l.spacing(0,4,0,1)};
      display: flex;
      align-items: center;
      position: relative;
      top: 2px;
    `,modalHeaderIcon:t.iv`
      margin-right: ${l.spacing(2)};
      font-size: inherit;
      &:before {
        vertical-align: baseline;
      }
    `,modalHeaderClose:t.iv`
      height: 100%;
      display: flex;
      align-items: center;
      color: ${l.colors.text.secondary};
      flex-grow: 1;
      justify-content: flex-end;
    `,modalContent:t.iv`
      overflow: auto;
      padding: ${l.spacing(3)};
      width: 100%;
    `,modalButtonRow:t.iv`
      padding-top: ${l.spacing(3)};
    `}})},"./src/components/Pagination/Pagination.tsx":function(se,V,e){"use strict";e.d(V,{t:function(){return x}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/Button/Button.tsx"),f=e("./src/components/Icon/Icon.tsx");const x=({currentPage:i,numberOfPages:c,onNavigate:E,hideWhenSinglePage:O,showSmallVersion:m,className:w})=>{const _=(0,a.wW)(d),C=m?1:8,b=(0,n.useMemo)(()=>{const g=[...new Array(c).keys()],v=c>C,y=(h,s)=>n.createElement("li",{key:h,className:_.item},n.createElement(l.zx,{size:"sm",variant:s,onClick:()=>E(h)},h));return g.reduce((h,s)=>{const o=s+1,r=o===i?"primary":"secondary",u=C,p=c-C+1,S=p-u,k=o===1||o===c,D=S>-1&&i>=u&&i<=p,M=m?1:3,I=m?0:2;return v?k||i<u&&o<u||S>=0&&i>p&&o>p||S<0&&i>=u&&o>p||D&&o>=i-I&&o<=i+I?h.push(y(o,r)):(o===u&&i<u||o===p&&i>p||D&&(o===i-M||o===i+M))&&h.push(n.createElement("li",{key:o,className:_.item},n.createElement(f.J,{className:_.ellipsis,name:"ellipsis-v"}))):h.push(y(o,r)),h},[])},[i,c,E,C,m,_.ellipsis,_.item]);return O&&c<=1?null:n.createElement("div",{className:(0,t.cx)(_.container,w)},n.createElement("ol",null,n.createElement("li",{className:_.item},n.createElement(l.zx,{"aria-label":"previous",size:"sm",variant:"secondary",onClick:()=>E(i-1),disabled:i===1},n.createElement(f.J,{name:"angle-left"}))),b,n.createElement("li",{className:_.item},n.createElement(l.zx,{"aria-label":"next",size:"sm",variant:"secondary",onClick:()=>E(i+1),disabled:i===c},n.createElement(f.J,{name:"angle-right"})))))},d=()=>({container:t.iv`
      float: right;
    `,item:t.iv`
      display: inline-block;
      padding-left: 10px;
      margin-bottom: 5px;
    `,ellipsis:t.iv`
      transform: rotate(90deg);
    `});try{x.displayName="Pagination",x.__docgenInfo={description:"",displayName:"Pagination",props:{currentPage:{defaultValue:null,description:"The current page index being shown.",name:"currentPage",required:!0,type:{name:"number"}},numberOfPages:{defaultValue:null,description:"Number of total pages.",name:"numberOfPages",required:!0,type:{name:"number"}},onNavigate:{defaultValue:null,description:"Callback function for fetching the selected page.",name:"onNavigate",required:!0,type:{name:"(toPage: number) => void"}},hideWhenSinglePage:{defaultValue:null,description:"When set to true and the pagination result is only one page it will not render the pagination at all.",name:"hideWhenSinglePage",required:!1,type:{name:"boolean"}},showSmallVersion:{defaultValue:null,description:"Small version only shows the current page and the navigation buttons.",name:"showSmallVersion",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Pagination/Pagination.tsx#Pagination"]={docgenInfo:x.__docgenInfo,name:"Pagination",path:"src/components/Pagination/Pagination.tsx#Pagination"})}catch(i){}},"./src/components/PanelChrome/PanelContext.ts":function(se,V,e){"use strict";e.d(V,{bb:function(){return d},R9:function(){return c}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../../yarn/cache/eventemitter3-npm-5.0.0-4c38bc0efe-b974bafbab.zip/node_modules/eventemitter3/index.mjs"),a=e("../../../yarn/cache/rxjs-npm-7.8.0-722f1c7172-61b4d4fd32.zip/node_modules/rxjs/dist/esm5/internal/Observable.js"),l=e("../../../yarn/cache/rxjs-npm-7.8.0-722f1c7172-61b4d4fd32.zip/node_modules/rxjs/dist/esm5/internal/operators/filter.js");class f{constructor(){this.subscribers=new Map,this.emitter=new n.Z}publish(O){this.emitter.emit(O.type,O)}subscribe(O,m){return this.getStream(O).subscribe({next:m})}getStream(O){return new a.y(m=>{const w=_=>{m.next(_)};return this.emitter.on(O.type,w),this.subscribers.set(w,m),()=>{this.emitter.off(O.type,w),this.subscribers.delete(w)}})}newScopedBus(O,m){return new x([O],this,m)}emit(O,m){typeof O=="string"?this.emitter.emit(O,{type:O,payload:m}):this.emitter.emit(O.name,{type:O.name,payload:m})}on(O,m,w){if(m.wrapper=_=>{m(_.payload)},typeof O=="string"?this.emitter.on(O,m.wrapper):this.emitter.on(O.name,m.wrapper),w){const _=w.$on("$destroy",()=>{this.off(O,m),_()})}}off(O,m){if(typeof O=="string"){this.emitter.off(O,m.wrapper);return}this.emitter.off(O.name,m.wrapper)}removeAllListeners(){this.emitter.removeAllListeners();for(const[O,m]of this.subscribers)m.complete(),this.subscribers.delete(O)}}class x{constructor(O,m,w){this.path=O,this.eventBus=m,this.filter=_=>this.filterConfig.onlyLocal?_.origin===this:!0,this.filterConfig=w!=null?w:{onlyLocal:!1}}publish(O){O.origin||(O.origin=this),this.eventBus.publish(O)}getStream(O){return this.eventBus.getStream(O).pipe((0,l.h)(this.filter))}subscribe(O,m){return this.getStream(O).subscribe({next:m})}removeAllListeners(){this.eventBus.removeAllListeners()}newScopedBus(O,m){return new x([...this.path,O],this,m)}}const d=t.createContext({eventBus:new f}),i=d.Provider,c=()=>t.useContext(d)},"./src/components/Portal/Portal.tsx":function(se,V,e){"use strict";e.d(V,{h_:function(){return w}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/react-dom-virtual-48394057d2/2/yarn/cache/react-dom-npm-17.0.2-f551215af1-1c1eaa3bca.zip/node_modules/react-dom/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=Object.defineProperty,f=Object.defineProperties,x=Object.getOwnPropertyDescriptors,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(g,v,y)=>v in g?l(g,v,{enumerable:!0,configurable:!0,writable:!0,value:y}):g[v]=y,O=(g,v)=>{for(var y in v||(v={}))i.call(v,y)&&E(g,y,v[y]);if(d)for(var y of d(v))c.call(v,y)&&E(g,y,v[y]);return g},m=(g,v)=>f(g,x(v));function w(g){const{children:v,className:y,root:h,forwardedRef:s}=g,o=(0,a.l4)(),r=(0,t.useRef)(null),u=h!=null?h:_();return r.current||(r.current=document.createElement("div"),y&&(r.current.className=y),r.current.style.position="relative",r.current.style.zIndex=`${o.zIndex.portal}`),(0,t.useLayoutEffect)(()=>(r.current&&u.appendChild(r.current),()=>{r.current&&u.removeChild(r.current)}),[u]),n.createPortal(t.createElement("div",{ref:s},v),r.current)}function _(){var g;return(g=window.document.getElementById("grafana-portal-container"))!=null?g:document.body}function C(){return React.createElement("div",{id:"grafana-portal-container"})}const b=t.forwardRef((g,v)=>t.createElement(w,m(O({},g),{forwardedRef:v})));b.displayName="RefForwardingPortal";try{b.displayName="RefForwardingPortal",b.__docgenInfo={description:"",displayName:"RefForwardingPortal",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},root:{defaultValue:null,description:"",name:"root",required:!1,type:{name:"HTMLElement"}},forwardedRef:{defaultValue:null,description:"",name:"forwardedRef",required:!1,type:{name:"ForwardedRef<HTMLDivElement>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Portal/Portal.tsx#RefForwardingPortal"]={docgenInfo:b.__docgenInfo,name:"RefForwardingPortal",path:"src/components/Portal/Portal.tsx#RefForwardingPortal"})}catch(g){}},"./src/components/Segment/SegmentSection.tsx":function(se,V,e){"use strict";e.d(V,{f:function(){return x}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/Forms/InlineFieldRow.tsx"),f=e("./src/components/Forms/InlineLabel.tsx");const x=({label:i,htmlFor:c,children:E,fill:O})=>{const m=(0,a.wW)(d);return n.createElement(n.Fragment,null,n.createElement(l.Z,null,n.createElement(f.W,{htmlFor:c,width:12,className:m.label},i),E,O&&n.createElement("div",{className:m.fill},n.createElement(f.W,null,""))))},d=i=>({label:t.iv`
    color: ${i.colors.primary.text};
  `,fill:t.iv`
    flex-grow: 1;
    margin-bottom: ${i.spacing(.5)};
  `});try{x.displayName="SegmentSection",x.__docgenInfo={description:"Horizontal section for editor components.",displayName:"SegmentSection",props:{label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"string"}},htmlFor:{defaultValue:null,description:"",name:"htmlFor",required:!1,type:{name:"string"}},fill:{defaultValue:null,description:"",name:"fill",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Segment/SegmentSection.tsx#SegmentSection"]={docgenInfo:x.__docgenInfo,name:"SegmentSection",path:"src/components/Segment/SegmentSection.tsx#SegmentSection"})}catch(i){}},"./src/components/Segment/SegmentSelect.tsx":function(se,V,e){"use strict";e.d(V,{V:function(){return _}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/themes/ThemeContext.tsx"),a=e("./src/components/Select/Select.tsx"),l=Object.defineProperty,f=Object.defineProperties,x=Object.getOwnPropertyDescriptors,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(C,b,g)=>b in C?l(C,b,{enumerable:!0,configurable:!0,writable:!0,value:g}):C[b]=g,O=(C,b)=>{for(var g in b||(b={}))i.call(b,g)&&E(C,g,b[g]);if(d)for(var g of d(b))c.call(b,g)&&E(C,g,b[g]);return C},m=(C,b)=>f(C,x(b)),w=(C,b)=>{var g={};for(var v in C)i.call(C,v)&&b.indexOf(v)<0&&(g[v]=C[v]);if(C!=null&&d)for(var v of d(C))b.indexOf(v)<0&&c.call(C,v)&&(g[v]=C[v]);return g};function _(C){var b=C,{value:g,placeholder:v="",options:y=[],onChange:h,onClickOutside:s,loadOptions:o=void 0,width:r,noOptionsMessage:u="",allowCustomValue:p=!1,allowEmptyValue:S=!1}=b,k=w(b,["value","placeholder","options","onChange","onClickOutside","loadOptions","width","noOptionsMessage","allowCustomValue","allowEmptyValue"]);const D=(0,t.useRef)(null),M=(0,n.l4)();let I=r>0?r/M.spacing.gridSize:void 0,T,j={};return o?(T=a.qb,j={loadOptions:o,defaultOptions:!0}):T=a.Ph,t.createElement("div",m(O({},k),{ref:D}),t.createElement(T,O({width:I,noOptionsMessage:u,placeholder:v,autoFocus:!0,isOpen:!0,onChange:h,options:y,value:g,closeMenuOnSelect:!1,onCloseMenu:()=>{if(D&&D.current){const K=D.current.querySelector('input[id^="react-select-"]');K&&(K.value||S)?h({value:K.value,label:K.value}):s()}},allowCustomValue:p},j)))}try{_.displayName="SegmentSelect",_.__docgenInfo={description:"",displayName:"SegmentSelect",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"T | SelectableValue<T>"}},options:{defaultValue:{value:"[]"},description:"",name:"options",required:!1,type:{name:"SelectableValue<T>[]"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(item: SelectableValue<T>) => void"}},loadOptions:{defaultValue:{value:"undefined"},description:"If provided - AsyncSelect will be used allowing to reload options when the value in the input changes",name:"loadOptions",required:!1,type:{name:"((inputValue: string) => Promise<SelectableValue<T>[]>)"}},onClickOutside:{defaultValue:null,description:"",name:"onClickOutside",required:!0,type:{name:"() => void"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},noOptionsMessage:{defaultValue:{value:""},description:"",name:"noOptionsMessage",required:!1,type:{name:"string"}},allowCustomValue:{defaultValue:{value:"false"},description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},allowEmptyValue:{defaultValue:{value:"false"},description:`If true, empty value will be passed to onChange callback otherwise using empty value
will work as canceling and using the previous value`,name:"allowEmptyValue",required:!1,type:{name:"boolean"}},placeholder:{defaultValue:{value:""},description:"",name:"placeholder",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Segment/SegmentSelect.tsx#SegmentSelect"]={docgenInfo:_.__docgenInfo,name:"SegmentSelect",path:"src/components/Segment/SegmentSelect.tsx#SegmentSelect"})}catch(C){}},"./src/components/Segment/styles.ts":function(se,V,e){"use strict";e.d(V,{N:function(){return n}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js");const n=a=>{const l="v1"in a?a.v1.palette:a.palette;return{segment:t.iv`
      cursor: pointer;
      width: auto;
    `,queryPlaceholder:t.iv`
      color: ${l.gray2};
    `,disabled:t.iv`
      cursor: not-allowed;
      opacity: 0.65;
      box-shadow: none;
    `}}},"./src/components/Segment/useExpandableLabel.tsx":function(se,V,e){"use strict";e.d(V,{_:function(){return l}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("./src/themes/ThemeContext.tsx"),a=e("./src/components/Button/Button.tsx");const l=(f,x)=>{const d=(0,t.useRef)(null),i=(0,n.wW)(a.gN),[c,E]=(0,t.useState)(f),[O,m]=(0,t.useState)(0),w=C=>{E(C),x&&x(C)};return[({Component:C,onClick:b,disabled:g})=>t.createElement("button",{type:"button",className:i,ref:d,disabled:g,onClick:()=>{w(!0),d&&d.current&&m(d.current.clientWidth*1.25),b==null||b()}},C),O,c,w]}},"./src/components/Select/Select.tsx":function(se,V,e){"use strict";e.d(V,{M8:function(){return ya},qb:function(){return gn},NU:function(){return Rn},Ph:function(){return sa}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/react-select-virtual-bf07ef1455/2/yarn/cache/react-select-npm-5.7.0-1bd3ca6f36-3d29f7bb6d.zip/node_modules/react-select/dist/react-select.esm.js"),a=e("../../.yarn/__virtual__/react-select-virtual-bf07ef1455/2/yarn/cache/react-select-npm-5.7.0-1bd3ca6f36-3d29f7bb6d.zip/node_modules/react-select/async/dist/react-select-async.esm.js"),l=e("../../.yarn/__virtual__/react-select-virtual-bf07ef1455/2/yarn/cache/react-select-npm-5.7.0-1bd3ca6f36-3d29f7bb6d.zip/node_modules/react-select/async-creatable/dist/react-select-async-creatable.esm.js"),f=e("../../.yarn/__virtual__/react-select-virtual-bf07ef1455/2/yarn/cache/react-select-npm-5.7.0-1bd3ca6f36-3d29f7bb6d.zip/node_modules/react-select/creatable/dist/react-select-creatable.esm.js");const x=ke=>({label:ke,value:ke});var d=e("./src/themes/ThemeContext.tsx"),i=e("./src/components/Icon/Icon.tsx"),c=e("./src/components/Spinner/Spinner.tsx");const E=({isOpen:ke})=>{const Ne=ke?"search":"angle-down",Ge=ke?"sm":"md";return t.createElement(i.J,{name:Ne,size:Ge})};try{E.displayName="DropdownIndicator",E.__docgenInfo={description:"",displayName:"DropdownIndicator",props:{isOpen:{defaultValue:null,description:"",name:"isOpen",required:!0,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/DropdownIndicator.tsx#DropdownIndicator"]={docgenInfo:E.__docgenInfo,name:"DropdownIndicator",path:"src/components/Select/DropdownIndicator.tsx#DropdownIndicator"})}catch(ke){}var O=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),m=e("./src/components/Input/Input.tsx");const w=t.forwardRef((ke,Ne)=>{const{children:Ge}=ke,Et=(0,d.l4)(),Jt=(0,m.H)({theme:Et,invalid:!1});return t.createElement("div",{className:(0,O.cx)(Jt.suffix,O.iv`
          position: relative;
        `),ref:Ne},Ge)});w.displayName="IndicatorsContainer";try{w.displayName="IndicatorsContainer",w.__docgenInfo={description:"",displayName:"IndicatorsContainer",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/IndicatorsContainer.tsx#IndicatorsContainer"]={docgenInfo:w.__docgenInfo,name:"IndicatorsContainer",path:"src/components/Select/IndicatorsContainer.tsx#IndicatorsContainer"})}catch(ke){}var _=e("./src/themes/stylesFactory.ts"),C=e("./src/components/Forms/commonStyles.ts"),b=Object.defineProperty,g=Object.defineProperties,v=Object.getOwnPropertyDescriptors,y=Object.getOwnPropertySymbols,h=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable,o=(ke,Ne,Ge)=>Ne in ke?b(ke,Ne,{enumerable:!0,configurable:!0,writable:!0,value:Ge}):ke[Ne]=Ge,r=(ke,Ne)=>{for(var Ge in Ne||(Ne={}))h.call(Ne,Ge)&&o(ke,Ge,Ne[Ge]);if(y)for(var Ge of y(Ne))s.call(Ne,Ge)&&o(ke,Ge,Ne[Ge]);return ke},u=(ke,Ne)=>g(ke,v(Ne)),p=(ke,Ne)=>{var Ge={};for(var Et in ke)h.call(ke,Et)&&Ne.indexOf(Et)<0&&(Ge[Et]=ke[Et]);if(ke!=null&&y)for(var Et of y(ke))Ne.indexOf(Et)<0&&s.call(ke,Et)&&(Ge[Et]=ke[Et]);return Ge};const S=(0,_.B)((ke,Ne,Ge)=>{const Et=(0,m.H)({theme:ke,invalid:Ne});return{input:(0,O.cx)((0,C.nf)(ke),O.iv`
        width: 100%;
        max-width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;
        padding-right: 0;
        position: relative;
        box-sizing: border-box;
      `,Ge&&O.iv`
          padding-left: 0;
        `),prefix:(0,O.cx)(Et.prefix,O.iv`
        position: relative;
      `)}}),k=t.forwardRef(function(Ne,Ge){var Et=Ne,{focused:Jt,invalid:an,disabled:Cn,children:En,innerProps:Tn,prefix:kn}=Et,Gn=p(Et,["focused","invalid","disabled","children","innerProps","prefix"]);const Ae=(0,d.l4)(),De=S(Ae,an,!!kn);return t.createElement("div",u(r({className:De.input},Tn),{ref:Ge}),kn&&t.createElement("div",{className:(0,O.cx)(De.prefix)},kn),En)});try{k.displayName="InputControl",k.__docgenInfo={description:"",displayName:"InputControl",props:{prefix:{defaultValue:null,description:"Show an icon as a prefix in the input",name:"prefix",required:!1,type:{name:"string | Element | null"}},focused:{defaultValue:null,description:"",name:"focused",required:!0,type:{name:"boolean"}},invalid:{defaultValue:null,description:"",name:"invalid",required:!0,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!0,type:{name:"boolean"}},innerProps:{defaultValue:null,description:"",name:"innerProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/InputControl.tsx#InputControl"]={docgenInfo:k.__docgenInfo,name:"InputControl",path:"src/components/Select/InputControl.tsx#InputControl"})}catch(ke){}var D=e("./src/components/IconButton/IconButton.tsx");const M=(0,_.B)(ke=>({menu:O.iv`
      label: grafana-select-menu;
      background: ${ke.components.dropdown.background};
      box-shadow: ${ke.shadows.z3};
      position: relative;
      min-width: 100%;
      z-index: 1;
    `,option:O.iv`
      label: grafana-select-option;
      padding: 8px;
      display: flex;
      align-items: center;
      flex-direction: row;
      flex-shrink: 0;
      white-space: nowrap;
      cursor: pointer;
      border-left: 2px solid transparent;

      &:hover {
        background: ${ke.colors.action.hover};
      }
    `,optionIcon:O.iv`
      margin-right: ${ke.spacing(1)};
    `,optionImage:O.iv`
      label: grafana-select-option-image;
      width: 16px;
      margin-right: 10px;
    `,optionDescription:O.iv`
      label: grafana-select-option-description;
      font-weight: normal;
      font-size: ${ke.typography.size.sm};
      color: ${ke.colors.text.secondary};
      white-space: normal;
      line-height: ${ke.typography.body.lineHeight};
    `,optionBody:O.iv`
      label: grafana-select-option-body;
      display: flex;
      font-weight: ${ke.typography.fontWeightMedium};
      flex-direction: column;
      flex-grow: 1;
    `,optionFocused:O.iv`
      label: grafana-select-option-focused;
      background: ${ke.colors.action.focus};
    `,optionSelected:O.iv`
      background: ${ke.colors.action.selected};
    `,optionDisabled:O.iv`
      label: grafana-select-option-disabled;
      background-color: ${ke.colors.action.disabledBackground};
      color: ${ke.colors.action.disabledText};
      cursor: not-allowed;
    `,singleValue:O.iv`
      label: grafana-select-single-value;
      color: ${ke.components.input.text};
      grid-area: 1 / 1 / 2 / 3;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      box-sizing: border-box;
      max-width: 100%;
    `,valueContainer:O.iv`
      label: grafana-select-value-container;
      align-items: center;
      display: grid;
      position: relative;
      box-sizing: border-box;
      flex: 1 1 0%;
      outline: none;
      overflow: hidden;
    `,valueContainerMulti:O.iv`
      label: grafana-select-value-container-multi;
      flex-wrap: wrap;
      display: flex;
    `,loadingMessage:O.iv`
      label: grafana-select-loading-message;
      padding: ${ke.spacing(1)};
      text-align: center;
      width: 100%;
    `,multiValueContainer:O.iv`
      label: grafana-select-multi-value-container;
      display: flex;
      align-items: center;
      line-height: 1;
      background: ${ke.colors.background.secondary};
      border-radius: ${ke.shape.borderRadius()};
      margin: ${ke.spacing(.25,1,.25,0)};
      padding: ${ke.spacing(.25,0,.25,1)};
      color: ${ke.colors.text.primary};
      font-size: ${ke.typography.size.sm};

      &:hover {
        background: ${ke.colors.emphasize(ke.colors.background.secondary)};
      }
    `,multiValueRemove:O.iv`
      label: grafana-select-multi-value-remove;
      margin: ${ke.spacing(0,.5)};
      cursor: pointer;
      svg {
        margin-bottom: 0;
      }
    `,singleValueRemove:O.iv`
      cursor: pointer;
      &:hover {
        color: ${ke.colors.text.primary};
      }
    `}));var I=Object.defineProperty,T=Object.defineProperties,j=Object.getOwnPropertyDescriptors,K=Object.getOwnPropertySymbols,F=Object.prototype.hasOwnProperty,$=Object.prototype.propertyIsEnumerable,R=(ke,Ne,Ge)=>Ne in ke?I(ke,Ne,{enumerable:!0,configurable:!0,writable:!0,value:Ge}):ke[Ne]=Ge,U=(ke,Ne)=>{for(var Ge in Ne||(Ne={}))F.call(Ne,Ge)&&R(ke,Ge,Ne[Ge]);if(K)for(var Ge of K(Ne))$.call(Ne,Ge)&&R(ke,Ge,Ne[Ge]);return ke},H=(ke,Ne)=>T(ke,j(Ne));const W=({innerProps:ke,children:Ne})=>{const Ge=(0,d.l4)(),Et=M(Ge);return t.createElement("div",H(U({},ke),{className:Et.multiValueContainer}),Ne)},oe=({children:ke,innerProps:Ne})=>{const Ge=(0,d.l4)(),Et=M(Ge);return t.createElement(D.h,H(U({},Ne),{name:"times",size:"sm",className:Et.multiValueRemove}))};try{W.displayName="MultiValueContainer",W.__docgenInfo={description:"",displayName:"MultiValueContainer",props:{innerProps:{defaultValue:null,description:"",name:"innerProps",required:!0,type:{name:"ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/MultiValue.tsx#MultiValueContainer"]={docgenInfo:W.__docgenInfo,name:"MultiValueContainer",path:"src/components/Select/MultiValue.tsx#MultiValueContainer"})}catch(ke){}try{oe.displayName="MultiValueRemove",oe.__docgenInfo={description:"",displayName:"MultiValueRemove",props:{innerProps:{defaultValue:null,description:"",name:"innerProps",required:!0,type:{name:"Props"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/MultiValue.tsx#MultiValueRemove"]={docgenInfo:oe.__docgenInfo,name:"MultiValueRemove",path:"src/components/Select/MultiValue.tsx#MultiValueRemove"})}catch(ke){}var Q=e("../../.yarn/__virtual__/react-select-virtual-bf07ef1455/2/yarn/cache/react-select-npm-5.7.0-1bd3ca6f36-3d29f7bb6d.zip/node_modules/react-select/dist/index-a86253bb.esm.js"),P=e("./src/themes/mixins.ts"),ae=Object.defineProperty,q=Object.defineProperties,Y=Object.getOwnPropertyDescriptors,ve=Object.getOwnPropertySymbols,re=Object.prototype.hasOwnProperty,je=Object.prototype.propertyIsEnumerable,me=(ke,Ne,Ge)=>Ne in ke?ae(ke,Ne,{enumerable:!0,configurable:!0,writable:!0,value:Ge}):ke[Ne]=Ge,ne=(ke,Ne)=>{for(var Ge in Ne||(Ne={}))re.call(Ne,Ge)&&me(ke,Ge,Ne[Ge]);if(ve)for(var Ge of ve(Ne))je.call(Ne,Ge)&&me(ke,Ge,Ne[Ge]);return ke},Z=(ke,Ne)=>q(ke,Y(Ne));const te=ke=>{const{isDisabled:Ne,isFocused:Ge,children:Et,selectProps:{invalid:Jt=!1}}=ke,an=(0,d.l4)(),Cn=Pe(an,Ge,Ne,Jt);return t.createElement(Q.c.SelectContainer,Z(ne({},ke),{className:(0,O.cx)(Cn.wrapper,ke.className)}),Et)},Pe=(0,_.B)((ke,Ne,Ge,Et)=>{const Jt=(0,m.H)({theme:ke,invalid:Et});return{wrapper:(0,O.cx)(Jt.wrapper,(0,C.RK)(ke,Et),Ne&&O.iv`
            ${(0,P.$l)(ke.v1)}
          `,Ge&&Jt.inputDisabled,O.iv`
          position: relative;
          box-sizing: border-box;
          /* The display property is set by the styles prop in SelectBase because it's dependant on the width prop  */
          flex-direction: row;
          flex-wrap: wrap;
          align-items: stretch;
          justify-content: space-between;

          min-height: 32px;
          height: auto;
          max-width: 100%;

          /* Input padding is applied to the InputControl so the menu is aligned correctly */
          padding: 0;
          cursor: ${Ge?"not-allowed":"pointer"};
        `)}});try{te.displayName="SelectContainer",te.__docgenInfo={description:"",displayName:"SelectContainer",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/SelectContainer.tsx#SelectContainer"]={docgenInfo:te.__docgenInfo,name:"SelectContainer",path:"src/components/Select/SelectContainer.tsx#SelectContainer"})}catch(ke){}var he=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),ie=e("../../.yarn/__virtual__/react-window-virtual-9886da65d9/2/yarn/cache/react-window-npm-1.8.8-1f85a45c48-a19f43b901.zip/node_modules/react-window/dist/index.esm.js"),Ce=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts"),Le=e("./src/components/CustomScrollbar/CustomScrollbar.tsx"),we=Object.defineProperty,ue=Object.defineProperties,Ie=Object.getOwnPropertyDescriptors,qe=Object.getOwnPropertySymbols,Je=Object.prototype.hasOwnProperty,Ze=Object.prototype.propertyIsEnumerable,Oe=(ke,Ne,Ge)=>Ne in ke?we(ke,Ne,{enumerable:!0,configurable:!0,writable:!0,value:Ge}):ke[Ne]=Ge,ce=(ke,Ne)=>{for(var Ge in Ne||(Ne={}))Je.call(Ne,Ge)&&Oe(ke,Ge,Ne[Ge]);if(qe)for(var Ge of qe(Ne))Ze.call(Ne,Ge)&&Oe(ke,Ge,Ne[Ge]);return ke},pe=(ke,Ne)=>ue(ke,Ie(Ne));const J=({children:ke,maxHeight:Ne,innerRef:Ge,innerProps:Et})=>{const Jt=(0,d.l4)(),an=M(Jt);return t.createElement("div",pe(ce({},Et),{className:an.menu,style:{maxHeight:Ne},"aria-label":"Select options menu"}),t.createElement(Le.$,{scrollRefCallback:Ge,autoHide:!1,autoHeightMax:"inherit",hideHorizontalTrack:!0},ke))};J.displayName="SelectMenu";const L=37,fe=7,xe=({children:ke,maxHeight:Ne,options:Ge,getValue:Et})=>{var Jt;const an=(0,d.l4)(),Cn=M(an),[En]=Et(),kn=(En?Ge.findIndex(Fe=>Fe.value===En.value):0)*L;if(!Array.isArray(ke))return null;const Ae=((Jt=(0,he.max)(Ge.map(Fe=>{var xt;return(xt=Fe.label)==null?void 0:xt.length})))!=null?Jt:0)*fe,De=Math.min(Ge.length*L,Ne);return t.createElement(ie.t7,{className:Cn.menu,height:De,width:Ae,"aria-label":"Select options menu",itemCount:ke.length,itemSize:L,initialScrollOffset:kn},({index:Fe,style:xt})=>t.createElement("div",{style:pe(ce({},xt),{overflow:"hidden"})},ke[Fe]))};xe.displayName="VirtualizedSelectMenu";const We=({children:ke,data:Ne,innerProps:Ge,innerRef:Et,isFocused:Jt,isSelected:an,renderOptionLabel:Cn})=>{const En=(0,d.l4)(),Tn=M(En),kn=Ne.icon?(0,Ce.iJ)(Ne.icon):void 0;return t.createElement("div",pe(ce({ref:Et,className:(0,O.cx)(Tn.option,Jt&&Tn.optionFocused,an&&Tn.optionSelected,Ne.isDisabled&&Tn.optionDisabled)},Ge),{"aria-label":"Select option",title:Ne.title}),kn&&t.createElement(i.J,{name:kn,className:Tn.optionIcon}),Ne.imgUrl&&t.createElement("img",{className:Tn.optionImage,src:Ne.imgUrl,alt:Ne.label||Ne.value}),t.createElement("div",{className:Tn.optionBody},t.createElement("span",null,Cn?Cn(Ne):ke),Ne.description&&t.createElement("div",{className:Tn.optionDescription},Ne.description),Ne.component&&t.createElement(Ne.component,null)))};We.displayName="SelectMenuOptions";try{J.displayName="SelectMenu",J.__docgenInfo={description:"",displayName:"SelectMenu",props:{maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!0,type:{name:"number"}},innerRef:{defaultValue:null,description:"",name:"innerRef",required:!0,type:{name:"(instance: HTMLDivElement | null) => void"}},innerProps:{defaultValue:null,description:"",name:"innerProps",required:!0,type:{name:"{}"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/SelectMenu.tsx#SelectMenu"]={docgenInfo:J.__docgenInfo,name:"SelectMenu",path:"src/components/Select/SelectMenu.tsx#SelectMenu"})}catch(ke){}const Ue=(0,_.B)(ke=>({header:O.iv`
      display: flex;
      align-items: center;
      justify-content: flex-start;
      justify-items: center;
      cursor: pointer;
      padding: 7px 10px;
      width: 100%;
      border-bottom: 1px solid ${ke.colors.background.secondary};

      &:hover {
        color: ${ke.colors.text.maxContrast};
      }
    `,label:O.iv`
      flex-grow: 1;
    `,icon:O.iv`
      padding-right: 2px;
    `}));class at extends t.PureComponent{constructor(){super(...arguments),this.state={expanded:!1},this.onToggleChildren=()=>{this.setState(Ne=>({expanded:!Ne.expanded}))}}componentDidMount(){if(this.props.data.expanded)this.setState({expanded:!0});else if(this.props.selectProps&&this.props.selectProps.value){const{value:Ne}=this.props.selectProps.value;Ne&&this.props.options.some(Ge=>Ge.value===Ne)&&this.setState({expanded:!0})}}componentDidUpdate(Ne){Ne.selectProps.inputValue!==""&&this.setState({expanded:!0})}render(){const{children:Ne,label:Ge,theme:Et}=this.props,{expanded:Jt}=this.state,an=Ue(Et);return t.createElement("div",null,t.createElement("div",{className:an.header,onClick:this.onToggleChildren},t.createElement("span",{className:an.label},Ge),t.createElement(i.J,{className:an.icon,name:Jt?"angle-up":"angle-down"})," "),Jt&&Ne)}}const it=(0,d.HE)(at);try{it.displayName="SelectOptionGroup",it.__docgenInfo={description:"",displayName:"SelectOptionGroup",props:{data:{defaultValue:null,description:"The data of the group.",name:"data",required:!0,type:{name:"{ label: string; expanded: boolean; options: any[]; }"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/SelectOptionGroup.tsx#SelectOptionGroup"]={docgenInfo:it.__docgenInfo,name:"SelectOptionGroup",path:"src/components/Select/SelectOptionGroup.tsx#SelectOptionGroup"})}catch(ke){}function _t(ke,Ne={}){const{duration:Ge=250,delay:Et=250}=Ne,[Jt,an]=(0,t.useState)(ke),Cn=(0,t.useRef)();return(0,t.useEffect)(()=>{let En;if(ke)En=setTimeout(()=>{Cn.current=new Date,an(ke)},Et);else{const Tn=Cn.current?Date.now()-Cn.current.valueOf():0,kn=()=>{Cn.current=void 0,an(ke)};Tn>=Ge?kn():En=setTimeout(kn,Ge-Tn)}return()=>{En&&(clearTimeout(En),En=void 0)}},[ke,Ge,Et]),Jt}var wt=e("../../.yarn/__virtual__/react-transition-group-virtual-5d02c993cb/2/yarn/cache/react-transition-group-npm-4.4.5-98ea4ef96e-7560284010.zip/node_modules/react-transition-group/esm/CSSTransition.js");const ee=(0,_.B)(ke=>({enter:O.iv`
      label: enter;
      opacity: 0;
    `,enterActive:O.iv`
      label: enterActive;
      opacity: 1;
      transition: opacity ${ke}ms ease-out;
    `,exit:O.iv`
      label: exit;
      opacity: 1;
    `,exitActive:O.iv`
      label: exitActive;
      opacity: 0;
      transition: opacity ${ke}ms ease-out;
    `}));function _e(ke){const{visible:Ne,children:Ge,duration:Et=250}=ke,Jt=ee(Et);return t.createElement(wt.Z,{in:Ne,mountOnEnter:!0,unmountOnExit:!0,timeout:Et,classNames:Jt},Ge)}try{_e.displayName="FadeTransition",_e.__docgenInfo={description:"",displayName:"FadeTransition",props:{visible:{defaultValue:null,description:"",name:"visible",required:!0,type:{name:"boolean"}},duration:{defaultValue:null,description:"",name:"duration",required:!1,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/transitions/FadeTransition.tsx#FadeTransition"]={docgenInfo:_e.__docgenInfo,name:"FadeTransition",path:"src/components/transitions/FadeTransition.tsx#FadeTransition"})}catch(ke){}const ge=(0,_.B)((ke,Ne,Ge)=>({enter:O.iv`
      label: enter;
      ${Ne}: 0;
      opacity: 0;
    `,enterActive:O.iv`
      label: enterActive;
      ${Ne}: ${Ge}px;
      opacity: 1;
      transition: opacity ${ke}ms ease-out, ${Ne} ${ke}ms ease-out;
    `,exit:O.iv`
      label: exit;
      ${Ne}: ${Ge}px;
      opacity: 1;
    `,exitActive:O.iv`
      label: exitActive;
      opacity: 0;
      ${Ne}: 0;
      transition: opacity ${ke}ms ease-out, ${Ne} ${ke}ms ease-out;
    `}));function de(ke){const{visible:Ne,children:Ge,duration:Et=250,horizontal:Jt,size:an}=ke,Cn=ge(Et,Jt?"width":"height",an);return t.createElement(wt.Z,{in:Ne,mountOnEnter:!0,unmountOnExit:!0,timeout:Et,classNames:Cn},Ge)}try{de.displayName="SlideOutTransition",de.__docgenInfo={description:"",displayName:"SlideOutTransition",props:{visible:{defaultValue:null,description:"",name:"visible",required:!0,type:{name:"boolean"}},size:{defaultValue:null,description:"",name:"size",required:!0,type:{name:"number"}},duration:{defaultValue:null,description:"",name:"duration",required:!1,type:{name:"number"}},horizontal:{defaultValue:null,description:"",name:"horizontal",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/transitions/SlideOutTransition.tsx#SlideOutTransition"]={docgenInfo:de.__docgenInfo,name:"SlideOutTransition",path:"src/components/transitions/SlideOutTransition.tsx#SlideOutTransition"})}catch(ke){}var Ee=Object.defineProperty,ze=Object.defineProperties,le=Object.getOwnPropertyDescriptors,ye=Object.getOwnPropertySymbols,Se=Object.prototype.hasOwnProperty,Be=Object.prototype.propertyIsEnumerable,Xe=(ke,Ne,Ge)=>Ne in ke?Ee(ke,Ne,{enumerable:!0,configurable:!0,writable:!0,value:Ge}):ke[Ne]=Ge,st=(ke,Ne)=>{for(var Ge in Ne||(Ne={}))Se.call(Ne,Ge)&&Xe(ke,Ge,Ne[Ge]);if(ye)for(var Ge of ye(Ne))Be.call(Ne,Ge)&&Xe(ke,Ge,Ne[Ge]);return ke},mt=(ke,Ne)=>ze(ke,le(Ne));const rt=ke=>({singleValue:O.iv`
      label: singleValue;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      box-sizing: border-box;
      max-width: 100%;
      grid-area: 1 / 1 / 2 / 3;
    `,spinnerWrapper:O.iv`
      width: 16px;
      height: 16px;
      display: inline-block;
      margin-right: 10px;
      position: relative;
      vertical-align: middle;
      overflow: hidden;
    `,spinnerIcon:O.iv`
      width: 100%;
      height: 100%;
      position: absolute;
    `,optionIcon:O.iv`
      margin-right: ${ke.spacing(1)};
      color: ${ke.colors.text.secondary};
    `,disabled:O.iv`
      color: ${ke.colors.text.disabled};
    `,isOpen:O.iv`
      color: ${ke.colors.text.disabled};
    `}),lt=ke=>{var Ne;const{children:Ge,data:Et,isDisabled:Jt}=ke,an=(0,d.wW)(rt),Cn=_t(Et.loading||!1,{delay:250,duration:750}),En=Et.icon?(0,Ce.iJ)(Et.icon):void 0;return t.createElement(Q.c.SingleValue,mt(st({},ke),{className:(0,O.cx)(an.singleValue,Jt&&an.disabled,ke.selectProps.menuIsOpen&&an.isOpen)}),Et.imgUrl?t.createElement(ft,{loading:Cn,imgUrl:Et.imgUrl,styles:an,alt:(Ne=Et.label)!=null?Ne:Et.value}):t.createElement(t.Fragment,null,t.createElement(de,{horizontal:!0,size:16,visible:Cn,duration:150},t.createElement("div",{className:an.spinnerWrapper},t.createElement(c.$,{className:an.spinnerIcon,inline:!0}))),En&&t.createElement(i.J,{name:En,role:"img",className:an.optionIcon})),!Et.hideText&&Ge)},ft=ke=>t.createElement("div",{className:ke.styles.spinnerWrapper},t.createElement(_e,{duration:150,visible:ke.loading},t.createElement(c.$,{className:ke.styles.spinnerIcon,inline:!0})),t.createElement(_e,{duration:150,visible:!ke.loading},t.createElement("img",{className:ke.styles.spinnerIcon,src:ke.imgUrl,alt:ke.alt})));try{lt.displayName="SingleValue",lt.__docgenInfo={description:"",displayName:"SingleValue",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/SingleValue.tsx#SingleValue"]={docgenInfo:lt.__docgenInfo,name:"SingleValue",path:"src/components/Select/SingleValue.tsx#SingleValue"})}catch(ke){}class St extends t.Component{render(){const{children:Ne}=this.props,{selectProps:Ge}=this.props;if(Ge&&Array.isArray(Ne)&&Array.isArray(Ne[0])&&Ge.maxVisibleValues!==void 0&&!(Ge.showAllSelectedWhenOpen&&Ge.menuIsOpen)){const[Et,...Jt]=Ne,an=Et.slice(0,Ge.maxVisibleValues);return this.renderContainer([an,...Jt])}return this.renderContainer(Ne)}renderContainer(Ne){const{isMulti:Ge,theme:Et}=this.props,Jt=M(Et),an=(0,O.cx)(Jt.valueContainer,Ge&&Jt.valueContainerMulti);return t.createElement("div",{className:an},Ne)}}const gt=(0,d.HE)(St);try{gt.displayName="ValueContainer",gt.__docgenInfo={description:"",displayName:"ValueContainer",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/ValueContainer.tsx#ValueContainer"]={docgenInfo:gt.__docgenInfo,name:"ValueContainer",path:"src/components/Select/ValueContainer.tsx#ValueContainer"})}catch(ke){}var pt=Object.defineProperty,ut=Object.defineProperties,Ot=Object.getOwnPropertyDescriptors,Wt=Object.getOwnPropertySymbols,Ht=Object.prototype.hasOwnProperty,on=Object.prototype.propertyIsEnumerable,un=(ke,Ne,Ge)=>Ne in ke?pt(ke,Ne,{enumerable:!0,configurable:!0,writable:!0,value:Ge}):ke[Ne]=Ge,mn=(ke,Ne)=>{for(var Ge in Ne||(Ne={}))Ht.call(Ne,Ge)&&un(ke,Ge,Ne[Ge]);if(Wt)for(var Ge of Wt(Ne))on.call(Ne,Ge)&&un(ke,Ge,Ne[Ge]);return ke},wn=(ke,Ne)=>ut(ke,Ot(Ne));function Gt(ke){return{clearIndicator:()=>({}),container:()=>({}),control:()=>({}),dropdownIndicator:()=>({}),group:()=>({}),groupHeading:()=>({}),indicatorsContainer:()=>({}),indicatorSeparator:()=>({}),input:function(Ne){return wn(mn({},Ne),{color:"inherit",margin:0,padding:0,zIndex:1})},loadingIndicator:()=>({}),loadingMessage:()=>({}),menu:()=>({}),menuList:({maxHeight:Ne})=>({maxHeight:Ne}),multiValue:()=>({}),multiValueLabel:()=>({}),multiValueRemove:()=>({}),noOptionsMessage:()=>({}),option:()=>({}),placeholder:Ne=>wn(mn({},Ne),{color:ke.colors.text.secondary}),singleValue:()=>({}),valueContainer:()=>({})}}function hn(ke,Ne){return(0,t.useMemo)(()=>wn(mn({},Gt(ke)),{menuPortal:Ge=>wn(mn({},Ge),{zIndex:ke.zIndex.portal}),menu:({top:Ge,bottom:Et,position:Jt})=>({top:Ge,bottom:Et,position:Jt,minWidth:"100%",zIndex:ke.zIndex.dropdown}),container:()=>({width:Ne?ke.spacing(Ne):"100%",display:Ne==="auto"?"inline-flex":"flex"}),option:(Ge,Et)=>wn(mn({},Ge),{opacity:Et.isDisabled?.5:1})}),[ke,Ne])}var fn=Object.getOwnPropertySymbols,Hn=Object.prototype.hasOwnProperty,va=Object.prototype.propertyIsEnumerable,ia=(ke,Ne)=>{var Ge={};for(var Et in ke)Hn.call(ke,Et)&&Ne.indexOf(Et)<0&&(Ge[Et]=ke[Et]);if(ke!=null&&fn)for(var Et of fn(ke))Ne.indexOf(Et)<0&&va.call(ke,Et)&&(Ge[Et]=ke[Et]);return Ge};const ba=(ke,Ne)=>{if(Array.isArray(ke)){const Ge=ke.filter(Boolean);return Ge!=null&&Ge.length?Ge:void 0}if(typeof ke=="object")return[ke];if(typeof ke=="string"||typeof ke=="number"){const Ge=ta(ke,Ne);if(Ge)return[Ge]}},ta=(ke,Ne)=>{for(const Ge of Ne)if("options"in Ge){let Et=ta(ke,Ge.options);if(Et)return Et}else if("value"in Ge&&Ge.value===ke)return Ge;return null},na=ke=>ke.map(Ne=>{var Ge=Ne,{description:Et}=Ge,Jt=ia(Ge,["description"]);return Jt});var la=Object.defineProperty,$e=Object.defineProperties,He=Object.getOwnPropertyDescriptors,Ye=Object.getOwnPropertySymbols,yt=Object.prototype.hasOwnProperty,bt=Object.prototype.propertyIsEnumerable,It=(ke,Ne,Ge)=>Ne in ke?la(ke,Ne,{enumerable:!0,configurable:!0,writable:!0,value:Ge}):ke[Ne]=Ge,Lt=(ke,Ne)=>{for(var Ge in Ne||(Ne={}))yt.call(Ne,Ge)&&It(ke,Ge,Ne[Ge]);if(Ye)for(var Ge of Ye(Ne))bt.call(Ne,Ge)&&It(ke,Ge,Ne[Ge]);return ke},zt=(ke,Ne)=>$e(ke,He(Ne));const Vt=ke=>{const{maxVisibleValues:Ne,selectedValuesCount:Ge,menuIsOpen:Et,showAllSelectedWhenOpen:Jt}=ke;return Ne!==void 0&&Ge>Ne&&!(Jt&&Et)?t.createElement("span",{key:"excess-values",id:"excess-values"},"(+",Ge-Ne,")"):null},Ut=ke=>{const{children:Ne,innerProps:Ge,selectProps:{menuIsOpen:Et,onMenuClose:Jt,onMenuOpen:an},isFocused:Cn,isMulti:En,getValue:Tn,innerRef:kn}=ke,Gn=ke.selectProps;return Gn.renderControl?t.createElement(Gn.renderControl,{isOpen:Et,value:En?Tn():Tn()[0],ref:kn,onClick:Et?Jt:an,onBlur:Jt,disabled:!!Gn.disabled,invalid:!!Gn.invalid}):t.createElement(k,{ref:kn,innerProps:Ge,prefix:Gn.prefix,focused:Cn,invalid:!!Gn.invalid,disabled:!!Gn.disabled},Ne)};function Kt({allowCustomValue:ke=!1,allowCreateWhileLoading:Ne=!1,"aria-label":Ge,autoFocus:Et=!1,backspaceRemovesValue:Jt=!0,cacheOptions:an,className:Cn,closeMenuOnSelect:En=!0,components:Tn,createOptionPosition:kn="last",defaultOptions:Gn,defaultValue:Ae,disabled:De=!1,filterOption:Fe,formatCreateLabel:xt,getOptionLabel:Qt,getOptionValue:Xt,inputValue:tn,invalid:qt,isClearable:cn=!1,id:ln,isLoading:Dn=!1,isMulti:zn=!1,inputId:Za,isOpen:Nn,isOptionDisabled:Ga,isSearchable:Pa=!0,loadOptions:fa,loadingMessage:Ya="Loading options...",maxMenuHeight:ja=300,minMenuHeight:Da,maxVisibleValues:vn,menuPlacement:xa="auto",menuPosition:Qe,menuShouldPortal:za=!0,noOptionsMessage:no="No options found",onBlur:Fa,onChange:Na,onCloseMenu:co,onCreateOption:Wa,onInputChange:_a,onKeyDown:Xa,onOpenMenu:ao,onFocus:Ja,openMenuOnFocus:ka=!1,options:aa=[],placeholder:oo="Choose",prefix:Va,renderControl:ca,showAllSelectedWhenOpen:dn=!0,tabSelectsValue:On=!0,value:bn,virtualized:Mn=!1,width:Sa,isValidNewOption:Yn,formatOptionLabel:Ca}){const Qa=(0,d.l4)(),Ha=M(Qa),Xn=(0,t.useRef)(null),[Ia,ro]=(0,t.useState)(!1),eo=hn(Qa,Sa);(0,t.useEffect)(()=>{if(fa&&Nn&&Xn.current&&Xn.current.controlRef&&xa==="auto"){const yn=window.innerHeight-Xn.current.controlRef.getBoundingClientRect().bottom;ro(yn<ja)}},[ja,xa,fa,Nn]);const io=(0,t.useCallback)((yn,Un)=>{if(zn&&yn==null)return Na([],Un);Na(yn,Un)},[zn,Na]);let Ua=n.ZP;const Oa={};let vo={},Ma;if(zn&&fa)Ma=bn;else if(zn&&bn&&Array.isArray(bn)&&!fa)Ma=bn.map(yn=>{var Un;const La=ta((Un=yn.value)!=null?Un:yn,aa);return!ke||La?La:typeof yn=="string"?x(yn):yn});else if(fa){const yn=Ae||bn;Ma=yn?[yn]:[]}else Ma=ba(bn,aa);const bo={"aria-label":Ge,autoFocus:Et,backspaceRemovesValue:Jt,captureMenuScroll:!1,closeMenuOnSelect:En,defaultValue:Ae,disabled:De,filterOption:Fe,getOptionLabel:Qt,getOptionValue:Xt,inputValue:tn,invalid:qt,isClearable:cn,id:ln,isDisabled:De,isLoading:Dn,isMulti:zn,inputId:Za,isOptionDisabled:Ga,isSearchable:Pa,maxMenuHeight:ja,minMenuHeight:Da,maxVisibleValues:vn,menuIsOpen:Nn,menuPlacement:xa==="auto"&&Ia?"top":xa,menuPosition:Qe,menuShouldBlockScroll:!0,menuPortalTarget:za&&typeof document!="undefined"?document.body:void 0,menuShouldScrollIntoView:!1,onBlur:Fa,onChange:io,onInputChange:_a,onKeyDown:Xa,onMenuClose:co,onMenuOpen:ao,onFocus:Ja,formatOptionLabel:Ca,openMenuOnFocus:ka,options:Mn?na(aa):aa,placeholder:oo,prefix:Va,renderControl:ca,showAllSelectedWhenOpen:dn,tabSelectsValue:On,value:zn?Ma:Ma==null?void 0:Ma[0]};ke&&(Ua=f.Z,Oa.allowCreateWhileLoading=Ne,Oa.formatCreateLabel=xt!=null?xt:xn,Oa.onCreateOption=Wa,Oa.createOptionPosition=kn,Oa.isValidNewOption=Yn),fa&&(Ua=ke?l.Z:a.Z,vo={loadOptions:fa,cacheOptions:an,defaultOptions:Gn});const yo=Mn?xe:J;return t.createElement(t.Fragment,null,t.createElement(Ua,Lt(Lt(Lt({ref:Xn,components:Lt({MenuList:yo,Group:it,ValueContainer:gt,IndicatorsContainer(yn){const{selectProps:Un}=yn,{value:La,showAllSelectedWhenOpen:To,maxVisibleValues:uo,menuIsOpen:Po}=Un;if(uo!==void 0){const xo=La.length,po=[...yn.children];return po.splice(-1,0,Vt({maxVisibleValues:uo,selectedValuesCount:xo,showAllSelectedWhenOpen:To,menuIsOpen:Po})),t.createElement(w,Lt({},yn),po)}return t.createElement(w,Lt({},yn))},IndicatorSeparator(){return t.createElement(t.Fragment,null)},Control:Ut,Option:We,ClearIndicator(yn){const{clearValue:Un}=yn;return t.createElement(i.J,{name:"times",role:"button","aria-label":"select-clear-value",className:Ha.singleValueRemove,onMouseDown:La=>{La.preventDefault(),La.stopPropagation(),Un()}})},LoadingIndicator(){return t.createElement(c.$,{inline:!0})},LoadingMessage(){return t.createElement("div",{className:Ha.loadingMessage},Ya)},NoOptionsMessage(){return t.createElement("div",{className:Ha.loadingMessage,"aria-label":"No options provided"},no)},DropdownIndicator(yn){return t.createElement(E,{isOpen:yn.selectProps.menuIsOpen})},SingleValue(yn){return t.createElement(lt,zt(Lt({},yn),{disabled:De}))},SelectContainer:te,MultiValueContainer:W,MultiValueRemove:oe},Tn),styles:eo,className:Cn},bo),Oa),vo)))}function xn(ke){return t.createElement("div",{style:{display:"flex",gap:"8px",alignItems:"center"}},t.createElement("div",null,ke),t.createElement("div",{style:{flexGrow:1}}),t.createElement("div",{className:"muted small",style:{display:"flex",gap:"8px",alignItems:"center"}},"Hit enter to add"))}try{Kt.displayName="SelectBase",Kt.__docgenInfo={description:"",displayName:"SelectBase",props:{invalid:{defaultValue:null,description:"",name:"invalid",required:!1,type:{name:"boolean"}},"aria-label":{defaultValue:null,description:"Aria label applied to the input field",name:"aria-label",required:!1,type:{name:"string"}},allowCreateWhileLoading:{defaultValue:{value:"false"},description:"",name:"allowCreateWhileLoading",required:!1,type:{name:"boolean"}},allowCustomValue:{defaultValue:{value:"false"},description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},autoFocus:{defaultValue:{value:"false"},description:"Focus is set to the Select when rendered",name:"autoFocus",required:!1,type:{name:"boolean"}},backspaceRemovesValue:{defaultValue:{value:"true"},description:"",name:"backspaceRemovesValue",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},closeMenuOnSelect:{defaultValue:{value:"true"},description:"",name:"closeMenuOnSelect",required:!1,type:{name:"boolean"}},components:{defaultValue:null,description:"Used for custom components. For more information, see `react-select`",name:"components",required:!1,type:{name:"any"}},createOptionPosition:{defaultValue:{value:"last"},description:"Sets the position of the createOption element in your options list. Defaults to 'last'",name:"createOptionPosition",required:!1,type:{name:"enum",value:[{value:'"first"'},{value:'"last"'}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"any"}},disabled:{defaultValue:{value:"false"},description:"",name:"disabled",required:!1,type:{name:"boolean"}},filterOption:{defaultValue:null,description:"",name:"filterOption",required:!1,type:{name:"((option: SelectableValue<T>, searchQuery: string) => boolean)"}},formatOptionLabel:{defaultValue:null,description:"",name:"formatOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>, formatOptionMeta: FormatOptionLabelMeta<T>) => ReactNode)"}},formatCreateLabel:{defaultValue:null,description:"Function for formatting the text that is displayed when creating a new value",name:"formatCreateLabel",required:!1,type:{name:"((input: string) => string)"}},getOptionLabel:{defaultValue:null,description:"",name:"getOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>) => ReactNode)"}},getOptionValue:{defaultValue:null,description:"",name:"getOptionValue",required:!1,type:{name:"((item: SelectableValue<T>) => string)"}},inputValue:{defaultValue:null,description:"",name:"inputValue",required:!1,type:{name:"string"}},isClearable:{defaultValue:{value:"false"},description:"",name:"isClearable",required:!1,type:{name:"boolean"}},id:{defaultValue:null,description:"The id to set on the SelectContainer component. To set the id for a label (with htmlFor), @see inputId instead",name:"id",required:!1,type:{name:"string"}},isLoading:{defaultValue:{value:"false"},description:"",name:"isLoading",required:!1,type:{name:"boolean"}},isMulti:{defaultValue:{value:"false"},description:"",name:"isMulti",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"The id of the search input. Use this to set a matching label with htmlFor",name:"inputId",required:!1,type:{name:"string"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},isSearchable:{defaultValue:{value:"true"},description:"Disables the possibility to type into the input",name:"isSearchable",required:!1,type:{name:"boolean"}},showAllSelectedWhenOpen:{defaultValue:{value:"true"},description:"",name:"showAllSelectedWhenOpen",required:!1,type:{name:"boolean"}},maxMenuHeight:{defaultValue:{value:"300"},description:"",name:"maxMenuHeight",required:!1,type:{name:"number"}},minMenuHeight:{defaultValue:null,description:"",name:"minMenuHeight",required:!1,type:{name:"number"}},maxVisibleValues:{defaultValue:null,description:"",name:"maxVisibleValues",required:!1,type:{name:"number"}},menuPlacement:{defaultValue:{value:"auto"},description:"",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},menuPosition:{defaultValue:null,description:"",name:"menuPosition",required:!1,type:{name:"enum",value:[{value:'"fixed"'},{value:'"absolute"'}]}},menuShouldPortal:{defaultValue:{value:"true"},description:"Setting to false will prevent the menu from portalling to the body.",name:"menuShouldPortal",required:!1,type:{name:"boolean"}},noOptionsMessage:{defaultValue:{value:"No options found"},description:"The message to display when no options could be found",name:"noOptionsMessage",required:!1,type:{name:"string"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: SelectableValue<T>, actionMeta: ActionMeta) => void | {}"}},onCloseMenu:{defaultValue:null,description:"",name:"onCloseMenu",required:!1,type:{name:"(() => void)"}},onCreateOption:{defaultValue:null,description:"allowCustomValue must be enabled. Function decides what to do with that custom value.",name:"onCreateOption",required:!1,type:{name:"((value: string) => void)"}},onInputChange:{defaultValue:null,description:"",name:"onInputChange",required:!1,type:{name:"((value: string, actionMeta: InputActionMeta) => void)"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"((event: KeyboardEvent<Element>) => void)"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"(() => void)"}},openMenuOnFocus:{defaultValue:{value:"false"},description:"",name:"openMenuOnFocus",required:!1,type:{name:"boolean"}},options:{defaultValue:{value:"[]"},description:"",name:"options",required:!1,type:{name:"SelectableValue<T>[]"}},placeholder:{defaultValue:{value:"Choose"},description:"",name:"placeholder",required:!1,type:{name:"string"}},prefix:{defaultValue:null,description:"item to be rendered in front of the input",name:"prefix",required:!1,type:{name:"string | Element | null"}},renderControl:{defaultValue:null,description:"Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null",name:"renderControl",required:!1,type:{name:"ControlComponent<T>"}},tabSelectsValue:{defaultValue:{value:"true"},description:"",name:"tabSelectsValue",required:!1,type:{name:"boolean"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"SelectValue<T> | null"}},virtualized:{defaultValue:{value:"false"},description:'Will wrap the MenuList in a react-window FixedSizeVirtualList for improved performance, does not support options with "description" properties',name:"virtualized",required:!1,type:{name:"boolean"}},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 | "auto"'}},isOptionDisabled:{defaultValue:null,description:"",name:"isOptionDisabled",required:!1,type:{name:"(() => boolean)"}},isValidNewOption:{defaultValue:null,description:'allowCustomValue must be enabled. Determines whether the "create new" option should be displayed based on the current input value, select value and options array.',name:"isValidNewOption",required:!1,type:{name:"((inputValue: string, value: SelectableValue<T> | null, options: OptionsOrGroups<SelectableValue<T>, GroupBase<SelectableValue<T>>>) => boolean)"}},loadingMessage:{defaultValue:{value:"Loading options..."},description:"Message to display isLoading=true",name:"loadingMessage",required:!1,type:{name:"string"}},defaultOptions:{defaultValue:null,description:"When specified as boolean the loadOptions will execute when component is mounted",name:"defaultOptions",required:!1,type:{name:"boolean | SelectableValue<T>[]"}},loadOptions:{defaultValue:null,description:"Asynchronously load select options",name:"loadOptions",required:!1,type:{name:"((query: string, cb?: LoadOptionsCallback<T>) => void | Promise<SelectableValue<T>[]>)"}},cacheOptions:{defaultValue:null,description:"If cacheOptions is true, then the loaded data will be cached. The cache will remain until cacheOptions changes value.",name:"cacheOptions",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/SelectBase.tsx#SelectBase"]={docgenInfo:Kt.__docgenInfo,name:"SelectBase",path:"src/components/Select/SelectBase.tsx#SelectBase"})}catch(ke){}var rn=Object.defineProperty,Bn=Object.defineProperties,_n=Object.getOwnPropertyDescriptors,Fn=Object.getOwnPropertySymbols,An=Object.prototype.hasOwnProperty,Sn=Object.prototype.propertyIsEnumerable,ua=(ke,Ne,Ge)=>Ne in ke?rn(ke,Ne,{enumerable:!0,configurable:!0,writable:!0,value:Ge}):ke[Ne]=Ge,sn=(ke,Ne)=>{for(var Ge in Ne||(Ne={}))An.call(Ne,Ge)&&ua(ke,Ge,Ne[Ge]);if(Fn)for(var Ge of Fn(Ne))Sn.call(Ne,Ge)&&ua(ke,Ge,Ne[Ge]);return ke},pa=(ke,Ne)=>Bn(ke,_n(Ne));function sa(ke){return t.createElement(Kt,sn({},ke))}function Rn(ke){return t.createElement(Kt,pa(sn({},ke),{isMulti:!0}))}function gn(ke){return t.createElement(Kt,sn({},ke))}function ma(ke){return React.createElement(SelectBase,sn({virtualized:!0},ke))}function Ta(ke){return React.createElement(SelectBase,sn({virtualized:!0},ke))}function ya(ke){return t.createElement(Kt,pa(sn({},ke),{isMulti:!0}))}try{sa.displayName="Select",sa.__docgenInfo={description:"",displayName:"Select",props:{"aria-label":{defaultValue:null,description:"Aria label applied to the input field",name:"aria-label",required:!1,type:{name:"string"}},allowCreateWhileLoading:{defaultValue:null,description:"",name:"allowCreateWhileLoading",required:!1,type:{name:"boolean"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},autoFocus:{defaultValue:null,description:"Focus is set to the Select when rendered",name:"autoFocus",required:!1,type:{name:"boolean"}},backspaceRemovesValue:{defaultValue:null,description:"",name:"backspaceRemovesValue",required:!1,type:{name:"boolean"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},closeMenuOnSelect:{defaultValue:null,description:"",name:"closeMenuOnSelect",required:!1,type:{name:"boolean"}},components:{defaultValue:null,description:"Used for custom components. For more information, see `react-select`",name:"components",required:!1,type:{name:"any"}},createOptionPosition:{defaultValue:null,description:"Sets the position of the createOption element in your options list. Defaults to 'last'",name:"createOptionPosition",required:!1,type:{name:"enum",value:[{value:'"first"'},{value:'"last"'}]}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"any"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},filterOption:{defaultValue:null,description:"",name:"filterOption",required:!1,type:{name:"((option: SelectableValue<T>, searchQuery: string) => boolean)"}},formatOptionLabel:{defaultValue:null,description:"",name:"formatOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>, formatOptionMeta: FormatOptionLabelMeta<T>) => ReactNode)"}},formatCreateLabel:{defaultValue:null,description:"Function for formatting the text that is displayed when creating a new value",name:"formatCreateLabel",required:!1,type:{name:"((input: string) => string)"}},getOptionLabel:{defaultValue:null,description:"",name:"getOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>) => ReactNode)"}},getOptionValue:{defaultValue:null,description:"",name:"getOptionValue",required:!1,type:{name:"((item: SelectableValue<T>) => string)"}},inputValue:{defaultValue:null,description:"",name:"inputValue",required:!1,type:{name:"string"}},invalid:{defaultValue:null,description:"",name:"invalid",required:!1,type:{name:"boolean"}},isClearable:{defaultValue:null,description:"",name:"isClearable",required:!1,type:{name:"boolean"}},id:{defaultValue:null,description:"The id to set on the SelectContainer component. To set the id for a label (with htmlFor), @see inputId instead",name:"id",required:!1,type:{name:"string"}},isLoading:{defaultValue:null,description:"",name:"isLoading",required:!1,type:{name:"boolean"}},isMulti:{defaultValue:null,description:"",name:"isMulti",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"The id of the search input. Use this to set a matching label with htmlFor",name:"inputId",required:!1,type:{name:"string"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},isSearchable:{defaultValue:null,description:"Disables the possibility to type into the input",name:"isSearchable",required:!1,type:{name:"boolean"}},showAllSelectedWhenOpen:{defaultValue:null,description:"",name:"showAllSelectedWhenOpen",required:!1,type:{name:"boolean"}},maxMenuHeight:{defaultValue:null,description:"",name:"maxMenuHeight",required:!1,type:{name:"number"}},minMenuHeight:{defaultValue:null,description:"",name:"minMenuHeight",required:!1,type:{name:"number"}},maxVisibleValues:{defaultValue:null,description:"",name:"maxVisibleValues",required:!1,type:{name:"number"}},menuPlacement:{defaultValue:null,description:"",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},menuPosition:{defaultValue:null,description:"",name:"menuPosition",required:!1,type:{name:"enum",value:[{value:'"fixed"'},{value:'"absolute"'}]}},menuShouldPortal:{defaultValue:null,description:"Setting to false will prevent the menu from portalling to the body.",name:"menuShouldPortal",required:!1,type:{name:"boolean"}},noOptionsMessage:{defaultValue:null,description:"The message to display when no options could be found",name:"noOptionsMessage",required:!1,type:{name:"string"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: SelectableValue<T>, actionMeta: ActionMeta) => void | {}"}},onCloseMenu:{defaultValue:null,description:"",name:"onCloseMenu",required:!1,type:{name:"(() => void)"}},onCreateOption:{defaultValue:null,description:"allowCustomValue must be enabled. Function decides what to do with that custom value.",name:"onCreateOption",required:!1,type:{name:"((value: string) => void)"}},onInputChange:{defaultValue:null,description:"",name:"onInputChange",required:!1,type:{name:"((value: string, actionMeta: InputActionMeta) => void)"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"((event: KeyboardEvent<Element>) => void)"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"(() => void)"}},openMenuOnFocus:{defaultValue:null,description:"",name:"openMenuOnFocus",required:!1,type:{name:"boolean"}},options:{defaultValue:null,description:"",name:"options",required:!1,type:{name:"SelectableValue<T>[]"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},prefix:{defaultValue:null,description:"item to be rendered in front of the input",name:"prefix",required:!1,type:{name:"string | Element | null"}},renderControl:{defaultValue:null,description:"Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null",name:"renderControl",required:!1,type:{name:"ControlComponent<T>"}},tabSelectsValue:{defaultValue:null,description:"",name:"tabSelectsValue",required:!1,type:{name:"boolean"}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"SelectValue<T> | null"}},virtualized:{defaultValue:null,description:'Will wrap the MenuList in a react-window FixedSizeVirtualList for improved performance, does not support options with "description" properties',name:"virtualized",required:!1,type:{name:"boolean"}},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 | "auto"'}},isOptionDisabled:{defaultValue:null,description:"",name:"isOptionDisabled",required:!1,type:{name:"(() => boolean)"}},isValidNewOption:{defaultValue:null,description:'allowCustomValue must be enabled. Determines whether the "create new" option should be displayed based on the current input value, select value and options array.',name:"isValidNewOption",required:!1,type:{name:"((inputValue: string, value: SelectableValue<T> | null, options: OptionsOrGroups<SelectableValue<T>, GroupBase<SelectableValue<T>>>) => boolean)"}},loadingMessage:{defaultValue:null,description:"Message to display isLoading=true",name:"loadingMessage",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.tsx#Select"]={docgenInfo:sa.__docgenInfo,name:"Select",path:"src/components/Select/Select.tsx#Select"})}catch(ke){}try{Rn.displayName="MultiSelect",Rn.__docgenInfo={description:"",displayName:"MultiSelect",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"SelectableValue<T>[] | T[]"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(item: SelectableValue<T>[], actionMeta: ActionMeta) => void | {}"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"any"}},id:{defaultValue:null,description:"The id to set on the SelectContainer component. To set the id for a label (with htmlFor), @see inputId instead",name:"id",required:!1,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},prefix:{defaultValue:null,description:"item to be rendered in front of the input",name:"prefix",required:!1,type:{name:"string | Element | null"}},"aria-label":{defaultValue:null,description:"Aria label applied to the input field",name:"aria-label",required:!1,type:{name:"string"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"(() => void)"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"((event: KeyboardEvent<Element>) => void)"}},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 | "auto"'}},autoFocus:{defaultValue:null,description:"Focus is set to the Select when rendered",name:"autoFocus",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},options:{defaultValue:null,description:"",name:"options",required:!1,type:{name:"SelectableValue<T>[]"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},formatCreateLabel:{defaultValue:null,description:"Function for formatting the text that is displayed when creating a new value",name:"formatCreateLabel",required:!1,type:{name:"((input: string) => string)"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},invalid:{defaultValue:null,description:"",name:"invalid",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"The id of the search input. Use this to set a matching label with htmlFor",name:"inputId",required:!1,type:{name:"string"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}},isLoading:{defaultValue:null,description:"",name:"isLoading",required:!1,type:{name:"boolean"}},allowCreateWhileLoading:{defaultValue:null,description:"",name:"allowCreateWhileLoading",required:!1,type:{name:"boolean"}},backspaceRemovesValue:{defaultValue:null,description:"",name:"backspaceRemovesValue",required:!1,type:{name:"boolean"}},closeMenuOnSelect:{defaultValue:null,description:"",name:"closeMenuOnSelect",required:!1,type:{name:"boolean"}},components:{defaultValue:null,description:"Used for custom components. For more information, see `react-select`",name:"components",required:!1,type:{name:"any"}},createOptionPosition:{defaultValue:null,description:"Sets the position of the createOption element in your options list. Defaults to 'last'",name:"createOptionPosition",required:!1,type:{name:"enum",value:[{value:'"first"'},{value:'"last"'}]}},filterOption:{defaultValue:null,description:"",name:"filterOption",required:!1,type:{name:"((option: SelectableValue<T>, searchQuery: string) => boolean)"}},formatOptionLabel:{defaultValue:null,description:"",name:"formatOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>, formatOptionMeta: FormatOptionLabelMeta<T>) => ReactNode)"}},getOptionLabel:{defaultValue:null,description:"",name:"getOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>) => ReactNode)"}},getOptionValue:{defaultValue:null,description:"",name:"getOptionValue",required:!1,type:{name:"((item: SelectableValue<T>) => string)"}},inputValue:{defaultValue:null,description:"",name:"inputValue",required:!1,type:{name:"string"}},isClearable:{defaultValue:null,description:"",name:"isClearable",required:!1,type:{name:"boolean"}},isSearchable:{defaultValue:null,description:"Disables the possibility to type into the input",name:"isSearchable",required:!1,type:{name:"boolean"}},showAllSelectedWhenOpen:{defaultValue:null,description:"",name:"showAllSelectedWhenOpen",required:!1,type:{name:"boolean"}},maxMenuHeight:{defaultValue:null,description:"",name:"maxMenuHeight",required:!1,type:{name:"number"}},minMenuHeight:{defaultValue:null,description:"",name:"minMenuHeight",required:!1,type:{name:"number"}},maxVisibleValues:{defaultValue:null,description:"",name:"maxVisibleValues",required:!1,type:{name:"number"}},menuPlacement:{defaultValue:null,description:"",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},menuPosition:{defaultValue:null,description:"",name:"menuPosition",required:!1,type:{name:"enum",value:[{value:'"fixed"'},{value:'"absolute"'}]}},menuShouldPortal:{defaultValue:null,description:"Setting to false will prevent the menu from portalling to the body.",name:"menuShouldPortal",required:!1,type:{name:"boolean"}},noOptionsMessage:{defaultValue:null,description:"The message to display when no options could be found",name:"noOptionsMessage",required:!1,type:{name:"string"}},onCloseMenu:{defaultValue:null,description:"",name:"onCloseMenu",required:!1,type:{name:"(() => void)"}},onCreateOption:{defaultValue:null,description:"allowCustomValue must be enabled. Function decides what to do with that custom value.",name:"onCreateOption",required:!1,type:{name:"((value: string) => void)"}},onInputChange:{defaultValue:null,description:"",name:"onInputChange",required:!1,type:{name:"((value: string, actionMeta: InputActionMeta) => void)"}},openMenuOnFocus:{defaultValue:null,description:"",name:"openMenuOnFocus",required:!1,type:{name:"boolean"}},renderControl:{defaultValue:null,description:"Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null",name:"renderControl",required:!1,type:{name:"ControlComponent<T>"}},tabSelectsValue:{defaultValue:null,description:"",name:"tabSelectsValue",required:!1,type:{name:"boolean"}},virtualized:{defaultValue:null,description:'Will wrap the MenuList in a react-window FixedSizeVirtualList for improved performance, does not support options with "description" properties',name:"virtualized",required:!1,type:{name:"boolean"}},isOptionDisabled:{defaultValue:null,description:"",name:"isOptionDisabled",required:!1,type:{name:"(() => boolean)"}},isValidNewOption:{defaultValue:null,description:'allowCustomValue must be enabled. Determines whether the "create new" option should be displayed based on the current input value, select value and options array.',name:"isValidNewOption",required:!1,type:{name:"((inputValue: string, value: SelectableValue<T> | null, options: OptionsOrGroups<SelectableValue<T>, GroupBase<SelectableValue<T>>>) => boolean)"}},loadingMessage:{defaultValue:null,description:"Message to display isLoading=true",name:"loadingMessage",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.tsx#MultiSelect"]={docgenInfo:Rn.__docgenInfo,name:"MultiSelect",path:"src/components/Select/Select.tsx#MultiSelect"})}catch(ke){}try{gn.displayName="AsyncSelect",gn.__docgenInfo={description:"",displayName:"AsyncSelect",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"T | SelectableValue<T> | null"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"any"}},id:{defaultValue:null,description:"The id to set on the SelectContainer component. To set the id for a label (with htmlFor), @see inputId instead",name:"id",required:!1,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},prefix:{defaultValue:null,description:"item to be rendered in front of the input",name:"prefix",required:!1,type:{name:"string | Element | null"}},"aria-label":{defaultValue:null,description:"Aria label applied to the input field",name:"aria-label",required:!1,type:{name:"string"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"(() => void)"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: SelectableValue<T>, actionMeta: ActionMeta) => void | {}"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"((event: KeyboardEvent<Element>) => void)"}},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 | "auto"'}},autoFocus:{defaultValue:null,description:"Focus is set to the Select when rendered",name:"autoFocus",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},formatCreateLabel:{defaultValue:null,description:"Function for formatting the text that is displayed when creating a new value",name:"formatCreateLabel",required:!1,type:{name:"((input: string) => string)"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},invalid:{defaultValue:null,description:"",name:"invalid",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"The id of the search input. Use this to set a matching label with htmlFor",name:"inputId",required:!1,type:{name:"string"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}},isLoading:{defaultValue:null,description:"",name:"isLoading",required:!1,type:{name:"boolean"}},allowCreateWhileLoading:{defaultValue:null,description:"",name:"allowCreateWhileLoading",required:!1,type:{name:"boolean"}},backspaceRemovesValue:{defaultValue:null,description:"",name:"backspaceRemovesValue",required:!1,type:{name:"boolean"}},closeMenuOnSelect:{defaultValue:null,description:"",name:"closeMenuOnSelect",required:!1,type:{name:"boolean"}},components:{defaultValue:null,description:"Used for custom components. For more information, see `react-select`",name:"components",required:!1,type:{name:"any"}},createOptionPosition:{defaultValue:null,description:"Sets the position of the createOption element in your options list. Defaults to 'last'",name:"createOptionPosition",required:!1,type:{name:"enum",value:[{value:'"first"'},{value:'"last"'}]}},filterOption:{defaultValue:null,description:"",name:"filterOption",required:!1,type:{name:"((option: SelectableValue<T>, searchQuery: string) => boolean)"}},formatOptionLabel:{defaultValue:null,description:"",name:"formatOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>, formatOptionMeta: FormatOptionLabelMeta<T>) => ReactNode)"}},getOptionLabel:{defaultValue:null,description:"",name:"getOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>) => ReactNode)"}},getOptionValue:{defaultValue:null,description:"",name:"getOptionValue",required:!1,type:{name:"((item: SelectableValue<T>) => string)"}},inputValue:{defaultValue:null,description:"",name:"inputValue",required:!1,type:{name:"string"}},isClearable:{defaultValue:null,description:"",name:"isClearable",required:!1,type:{name:"boolean"}},isMulti:{defaultValue:null,description:"",name:"isMulti",required:!1,type:{name:"boolean"}},isSearchable:{defaultValue:null,description:"Disables the possibility to type into the input",name:"isSearchable",required:!1,type:{name:"boolean"}},showAllSelectedWhenOpen:{defaultValue:null,description:"",name:"showAllSelectedWhenOpen",required:!1,type:{name:"boolean"}},maxMenuHeight:{defaultValue:null,description:"",name:"maxMenuHeight",required:!1,type:{name:"number"}},minMenuHeight:{defaultValue:null,description:"",name:"minMenuHeight",required:!1,type:{name:"number"}},maxVisibleValues:{defaultValue:null,description:"",name:"maxVisibleValues",required:!1,type:{name:"number"}},menuPlacement:{defaultValue:null,description:"",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},menuPosition:{defaultValue:null,description:"",name:"menuPosition",required:!1,type:{name:"enum",value:[{value:'"fixed"'},{value:'"absolute"'}]}},menuShouldPortal:{defaultValue:null,description:"Setting to false will prevent the menu from portalling to the body.",name:"menuShouldPortal",required:!1,type:{name:"boolean"}},noOptionsMessage:{defaultValue:null,description:"The message to display when no options could be found",name:"noOptionsMessage",required:!1,type:{name:"string"}},onCloseMenu:{defaultValue:null,description:"",name:"onCloseMenu",required:!1,type:{name:"(() => void)"}},onCreateOption:{defaultValue:null,description:"allowCustomValue must be enabled. Function decides what to do with that custom value.",name:"onCreateOption",required:!1,type:{name:"((value: string) => void)"}},onInputChange:{defaultValue:null,description:"",name:"onInputChange",required:!1,type:{name:"((value: string, actionMeta: InputActionMeta) => void)"}},openMenuOnFocus:{defaultValue:null,description:"",name:"openMenuOnFocus",required:!1,type:{name:"boolean"}},renderControl:{defaultValue:null,description:"Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null",name:"renderControl",required:!1,type:{name:"ControlComponent<T>"}},tabSelectsValue:{defaultValue:null,description:"",name:"tabSelectsValue",required:!1,type:{name:"boolean"}},virtualized:{defaultValue:null,description:'Will wrap the MenuList in a react-window FixedSizeVirtualList for improved performance, does not support options with "description" properties',name:"virtualized",required:!1,type:{name:"boolean"}},isOptionDisabled:{defaultValue:null,description:"",name:"isOptionDisabled",required:!1,type:{name:"(() => boolean)"}},isValidNewOption:{defaultValue:null,description:'allowCustomValue must be enabled. Determines whether the "create new" option should be displayed based on the current input value, select value and options array.',name:"isValidNewOption",required:!1,type:{name:"((inputValue: string, value: SelectableValue<T> | null, options: OptionsOrGroups<SelectableValue<T>, GroupBase<SelectableValue<T>>>) => boolean)"}},loadingMessage:{defaultValue:null,description:"Message to display isLoading=true",name:"loadingMessage",required:!1,type:{name:"string"}},defaultOptions:{defaultValue:null,description:"When specified as boolean the loadOptions will execute when component is mounted",name:"defaultOptions",required:!1,type:{name:"boolean | SelectableValue<T>[]"}},loadOptions:{defaultValue:null,description:"Asynchronously load select options",name:"loadOptions",required:!1,type:{name:"((query: string, cb?: LoadOptionsCallback<T>) => void | Promise<SelectableValue<T>[]>)"}},cacheOptions:{defaultValue:null,description:"If cacheOptions is true, then the loaded data will be cached. The cache will remain until cacheOptions changes value.",name:"cacheOptions",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.tsx#AsyncSelect"]={docgenInfo:gn.__docgenInfo,name:"AsyncSelect",path:"src/components/Select/Select.tsx#AsyncSelect"})}catch(ke){}try{ma.displayName="VirtualizedSelect",ma.__docgenInfo={description:"",displayName:"VirtualizedSelect",props:{options:{defaultValue:null,description:"",name:"options",required:!1,type:{name:'Pick<SelectableValue<T>, "value" | "label">[]'}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"any"}},id:{defaultValue:null,description:"The id to set on the SelectContainer component. To set the id for a label (with htmlFor), @see inputId instead",name:"id",required:!1,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},prefix:{defaultValue:null,description:"item to be rendered in front of the input",name:"prefix",required:!1,type:{name:"string | Element | null"}},"aria-label":{defaultValue:null,description:"Aria label applied to the input field",name:"aria-label",required:!1,type:{name:"string"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"(() => void)"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: SelectableValue<T>, actionMeta: ActionMeta) => void | {}"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"((event: KeyboardEvent<Element>) => void)"}},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 | "auto"'}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"SelectValue<T> | null"}},autoFocus:{defaultValue:null,description:"Focus is set to the Select when rendered",name:"autoFocus",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},formatCreateLabel:{defaultValue:null,description:"Function for formatting the text that is displayed when creating a new value",name:"formatCreateLabel",required:!1,type:{name:"((input: string) => string)"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},invalid:{defaultValue:null,description:"",name:"invalid",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"The id of the search input. Use this to set a matching label with htmlFor",name:"inputId",required:!1,type:{name:"string"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}},isLoading:{defaultValue:null,description:"",name:"isLoading",required:!1,type:{name:"boolean"}},allowCreateWhileLoading:{defaultValue:null,description:"",name:"allowCreateWhileLoading",required:!1,type:{name:"boolean"}},backspaceRemovesValue:{defaultValue:null,description:"",name:"backspaceRemovesValue",required:!1,type:{name:"boolean"}},closeMenuOnSelect:{defaultValue:null,description:"",name:"closeMenuOnSelect",required:!1,type:{name:"boolean"}},components:{defaultValue:null,description:"Used for custom components. For more information, see `react-select`",name:"components",required:!1,type:{name:"any"}},createOptionPosition:{defaultValue:null,description:"Sets the position of the createOption element in your options list. Defaults to 'last'",name:"createOptionPosition",required:!1,type:{name:"enum",value:[{value:'"first"'},{value:'"last"'}]}},filterOption:{defaultValue:null,description:"",name:"filterOption",required:!1,type:{name:"((option: SelectableValue<T>, searchQuery: string) => boolean)"}},formatOptionLabel:{defaultValue:null,description:"",name:"formatOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>, formatOptionMeta: FormatOptionLabelMeta<T>) => ReactNode)"}},getOptionLabel:{defaultValue:null,description:"",name:"getOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>) => ReactNode)"}},getOptionValue:{defaultValue:null,description:"",name:"getOptionValue",required:!1,type:{name:"((item: SelectableValue<T>) => string)"}},inputValue:{defaultValue:null,description:"",name:"inputValue",required:!1,type:{name:"string"}},isClearable:{defaultValue:null,description:"",name:"isClearable",required:!1,type:{name:"boolean"}},isMulti:{defaultValue:null,description:"",name:"isMulti",required:!1,type:{name:"boolean"}},isSearchable:{defaultValue:null,description:"Disables the possibility to type into the input",name:"isSearchable",required:!1,type:{name:"boolean"}},showAllSelectedWhenOpen:{defaultValue:null,description:"",name:"showAllSelectedWhenOpen",required:!1,type:{name:"boolean"}},maxMenuHeight:{defaultValue:null,description:"",name:"maxMenuHeight",required:!1,type:{name:"number"}},minMenuHeight:{defaultValue:null,description:"",name:"minMenuHeight",required:!1,type:{name:"number"}},maxVisibleValues:{defaultValue:null,description:"",name:"maxVisibleValues",required:!1,type:{name:"number"}},menuPlacement:{defaultValue:null,description:"",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},menuPosition:{defaultValue:null,description:"",name:"menuPosition",required:!1,type:{name:"enum",value:[{value:'"fixed"'},{value:'"absolute"'}]}},menuShouldPortal:{defaultValue:null,description:"Setting to false will prevent the menu from portalling to the body.",name:"menuShouldPortal",required:!1,type:{name:"boolean"}},noOptionsMessage:{defaultValue:null,description:"The message to display when no options could be found",name:"noOptionsMessage",required:!1,type:{name:"string"}},onCloseMenu:{defaultValue:null,description:"",name:"onCloseMenu",required:!1,type:{name:"(() => void)"}},onCreateOption:{defaultValue:null,description:"allowCustomValue must be enabled. Function decides what to do with that custom value.",name:"onCreateOption",required:!1,type:{name:"((value: string) => void)"}},onInputChange:{defaultValue:null,description:"",name:"onInputChange",required:!1,type:{name:"((value: string, actionMeta: InputActionMeta) => void)"}},openMenuOnFocus:{defaultValue:null,description:"",name:"openMenuOnFocus",required:!1,type:{name:"boolean"}},renderControl:{defaultValue:null,description:"Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null",name:"renderControl",required:!1,type:{name:"ControlComponent<T>"}},tabSelectsValue:{defaultValue:null,description:"",name:"tabSelectsValue",required:!1,type:{name:"boolean"}},isOptionDisabled:{defaultValue:null,description:"",name:"isOptionDisabled",required:!1,type:{name:"(() => boolean)"}},isValidNewOption:{defaultValue:null,description:'allowCustomValue must be enabled. Determines whether the "create new" option should be displayed based on the current input value, select value and options array.',name:"isValidNewOption",required:!1,type:{name:"((inputValue: string, value: SelectableValue<T> | null, options: OptionsOrGroups<SelectableValue<T>, GroupBase<SelectableValue<T>>>) => boolean)"}},loadingMessage:{defaultValue:null,description:"Message to display isLoading=true",name:"loadingMessage",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.tsx#VirtualizedSelect"]={docgenInfo:ma.__docgenInfo,name:"VirtualizedSelect",path:"src/components/Select/Select.tsx#VirtualizedSelect"})}catch(ke){}try{Ta.displayName="AsyncVirtualizedSelect",Ta.__docgenInfo={description:"",displayName:"AsyncVirtualizedSelect",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"any"}},id:{defaultValue:null,description:"The id to set on the SelectContainer component. To set the id for a label (with htmlFor), @see inputId instead",name:"id",required:!1,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},prefix:{defaultValue:null,description:"item to be rendered in front of the input",name:"prefix",required:!1,type:{name:"string | Element | null"}},"aria-label":{defaultValue:null,description:"Aria label applied to the input field",name:"aria-label",required:!1,type:{name:"string"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"(() => void)"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(value: SelectableValue<T>, actionMeta: ActionMeta) => void | {}"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"((event: KeyboardEvent<Element>) => void)"}},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 | "auto"'}},value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"SelectValue<T> | null"}},autoFocus:{defaultValue:null,description:"Focus is set to the Select when rendered",name:"autoFocus",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},options:{defaultValue:null,description:"",name:"options",required:!1,type:{name:"SelectableValue<T>[]"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},formatCreateLabel:{defaultValue:null,description:"Function for formatting the text that is displayed when creating a new value",name:"formatCreateLabel",required:!1,type:{name:"((input: string) => string)"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},invalid:{defaultValue:null,description:"",name:"invalid",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"The id of the search input. Use this to set a matching label with htmlFor",name:"inputId",required:!1,type:{name:"string"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}},isLoading:{defaultValue:null,description:"",name:"isLoading",required:!1,type:{name:"boolean"}},allowCreateWhileLoading:{defaultValue:null,description:"",name:"allowCreateWhileLoading",required:!1,type:{name:"boolean"}},backspaceRemovesValue:{defaultValue:null,description:"",name:"backspaceRemovesValue",required:!1,type:{name:"boolean"}},closeMenuOnSelect:{defaultValue:null,description:"",name:"closeMenuOnSelect",required:!1,type:{name:"boolean"}},components:{defaultValue:null,description:"Used for custom components. For more information, see `react-select`",name:"components",required:!1,type:{name:"any"}},createOptionPosition:{defaultValue:null,description:"Sets the position of the createOption element in your options list. Defaults to 'last'",name:"createOptionPosition",required:!1,type:{name:"enum",value:[{value:'"first"'},{value:'"last"'}]}},filterOption:{defaultValue:null,description:"",name:"filterOption",required:!1,type:{name:"((option: SelectableValue<T>, searchQuery: string) => boolean)"}},formatOptionLabel:{defaultValue:null,description:"",name:"formatOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>, formatOptionMeta: FormatOptionLabelMeta<T>) => ReactNode)"}},getOptionLabel:{defaultValue:null,description:"",name:"getOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>) => ReactNode)"}},getOptionValue:{defaultValue:null,description:"",name:"getOptionValue",required:!1,type:{name:"((item: SelectableValue<T>) => string)"}},inputValue:{defaultValue:null,description:"",name:"inputValue",required:!1,type:{name:"string"}},isClearable:{defaultValue:null,description:"",name:"isClearable",required:!1,type:{name:"boolean"}},isMulti:{defaultValue:null,description:"",name:"isMulti",required:!1,type:{name:"boolean"}},isSearchable:{defaultValue:null,description:"Disables the possibility to type into the input",name:"isSearchable",required:!1,type:{name:"boolean"}},showAllSelectedWhenOpen:{defaultValue:null,description:"",name:"showAllSelectedWhenOpen",required:!1,type:{name:"boolean"}},maxMenuHeight:{defaultValue:null,description:"",name:"maxMenuHeight",required:!1,type:{name:"number"}},minMenuHeight:{defaultValue:null,description:"",name:"minMenuHeight",required:!1,type:{name:"number"}},maxVisibleValues:{defaultValue:null,description:"",name:"maxVisibleValues",required:!1,type:{name:"number"}},menuPlacement:{defaultValue:null,description:"",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},menuPosition:{defaultValue:null,description:"",name:"menuPosition",required:!1,type:{name:"enum",value:[{value:'"fixed"'},{value:'"absolute"'}]}},menuShouldPortal:{defaultValue:null,description:"Setting to false will prevent the menu from portalling to the body.",name:"menuShouldPortal",required:!1,type:{name:"boolean"}},noOptionsMessage:{defaultValue:null,description:"The message to display when no options could be found",name:"noOptionsMessage",required:!1,type:{name:"string"}},onCloseMenu:{defaultValue:null,description:"",name:"onCloseMenu",required:!1,type:{name:"(() => void)"}},onCreateOption:{defaultValue:null,description:"allowCustomValue must be enabled. Function decides what to do with that custom value.",name:"onCreateOption",required:!1,type:{name:"((value: string) => void)"}},onInputChange:{defaultValue:null,description:"",name:"onInputChange",required:!1,type:{name:"((value: string, actionMeta: InputActionMeta) => void)"}},openMenuOnFocus:{defaultValue:null,description:"",name:"openMenuOnFocus",required:!1,type:{name:"boolean"}},renderControl:{defaultValue:null,description:"Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null",name:"renderControl",required:!1,type:{name:"ControlComponent<T>"}},tabSelectsValue:{defaultValue:null,description:"",name:"tabSelectsValue",required:!1,type:{name:"boolean"}},isOptionDisabled:{defaultValue:null,description:"",name:"isOptionDisabled",required:!1,type:{name:"(() => boolean)"}},isValidNewOption:{defaultValue:null,description:'allowCustomValue must be enabled. Determines whether the "create new" option should be displayed based on the current input value, select value and options array.',name:"isValidNewOption",required:!1,type:{name:"((inputValue: string, value: SelectableValue<T> | null, options: OptionsOrGroups<SelectableValue<T>, GroupBase<SelectableValue<T>>>) => boolean)"}},loadingMessage:{defaultValue:null,description:"Message to display isLoading=true",name:"loadingMessage",required:!1,type:{name:"string"}},defaultOptions:{defaultValue:null,description:"When specified as boolean the loadOptions will execute when component is mounted",name:"defaultOptions",required:!1,type:{name:"boolean | SelectableValue<T>[]"}},loadOptions:{defaultValue:null,description:"Asynchronously load select options",name:"loadOptions",required:!1,type:{name:"((query: string, cb?: LoadOptionsCallback<T>) => void | Promise<SelectableValue<T>[]>)"}},cacheOptions:{defaultValue:null,description:"If cacheOptions is true, then the loaded data will be cached. The cache will remain until cacheOptions changes value.",name:"cacheOptions",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.tsx#AsyncVirtualizedSelect"]={docgenInfo:Ta.__docgenInfo,name:"AsyncVirtualizedSelect",path:"src/components/Select/Select.tsx#AsyncVirtualizedSelect"})}catch(ke){}try{ya.displayName="AsyncMultiSelect",ya.__docgenInfo={description:"",displayName:"AsyncMultiSelect",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"SelectableValue<T>[]"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},defaultValue:{defaultValue:null,description:"",name:"defaultValue",required:!1,type:{name:"any"}},id:{defaultValue:null,description:"The id to set on the SelectContainer component. To set the id for a label (with htmlFor), @see inputId instead",name:"id",required:!1,type:{name:"string"}},placeholder:{defaultValue:null,description:"",name:"placeholder",required:!1,type:{name:"string"}},prefix:{defaultValue:null,description:"item to be rendered in front of the input",name:"prefix",required:!1,type:{name:"string | Element | null"}},"aria-label":{defaultValue:null,description:"Aria label applied to the input field",name:"aria-label",required:!1,type:{name:"string"}},onFocus:{defaultValue:null,description:"",name:"onFocus",required:!1,type:{name:"(() => void)"}},onBlur:{defaultValue:null,description:"",name:"onBlur",required:!1,type:{name:"(() => void)"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(item: SelectableValue<T>[], actionMeta: ActionMeta) => void | {}"}},onKeyDown:{defaultValue:null,description:"",name:"onKeyDown",required:!1,type:{name:"((event: KeyboardEvent<Element>) => void)"}},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 | "auto"'}},autoFocus:{defaultValue:null,description:"Focus is set to the Select when rendered",name:"autoFocus",required:!1,type:{name:"boolean"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},allowCustomValue:{defaultValue:null,description:"",name:"allowCustomValue",required:!1,type:{name:"boolean"}},formatCreateLabel:{defaultValue:null,description:"Function for formatting the text that is displayed when creating a new value",name:"formatCreateLabel",required:!1,type:{name:"((input: string) => string)"}},isOpen:{defaultValue:null,description:"",name:"isOpen",required:!1,type:{name:"boolean"}},invalid:{defaultValue:null,description:"",name:"invalid",required:!1,type:{name:"boolean"}},inputId:{defaultValue:null,description:"The id of the search input. Use this to set a matching label with htmlFor",name:"inputId",required:!1,type:{name:"string"}},onOpenMenu:{defaultValue:null,description:"",name:"onOpenMenu",required:!1,type:{name:"(() => void)"}},isLoading:{defaultValue:null,description:"",name:"isLoading",required:!1,type:{name:"boolean"}},allowCreateWhileLoading:{defaultValue:null,description:"",name:"allowCreateWhileLoading",required:!1,type:{name:"boolean"}},backspaceRemovesValue:{defaultValue:null,description:"",name:"backspaceRemovesValue",required:!1,type:{name:"boolean"}},closeMenuOnSelect:{defaultValue:null,description:"",name:"closeMenuOnSelect",required:!1,type:{name:"boolean"}},components:{defaultValue:null,description:"Used for custom components. For more information, see `react-select`",name:"components",required:!1,type:{name:"any"}},createOptionPosition:{defaultValue:null,description:"Sets the position of the createOption element in your options list. Defaults to 'last'",name:"createOptionPosition",required:!1,type:{name:"enum",value:[{value:'"first"'},{value:'"last"'}]}},filterOption:{defaultValue:null,description:"",name:"filterOption",required:!1,type:{name:"((option: SelectableValue<T>, searchQuery: string) => boolean)"}},formatOptionLabel:{defaultValue:null,description:"",name:"formatOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>, formatOptionMeta: FormatOptionLabelMeta<T>) => ReactNode)"}},getOptionLabel:{defaultValue:null,description:"",name:"getOptionLabel",required:!1,type:{name:"((item: SelectableValue<T>) => ReactNode)"}},getOptionValue:{defaultValue:null,description:"",name:"getOptionValue",required:!1,type:{name:"((item: SelectableValue<T>) => string)"}},inputValue:{defaultValue:null,description:"",name:"inputValue",required:!1,type:{name:"string"}},isClearable:{defaultValue:null,description:"",name:"isClearable",required:!1,type:{name:"boolean"}},isSearchable:{defaultValue:null,description:"Disables the possibility to type into the input",name:"isSearchable",required:!1,type:{name:"boolean"}},showAllSelectedWhenOpen:{defaultValue:null,description:"",name:"showAllSelectedWhenOpen",required:!1,type:{name:"boolean"}},maxMenuHeight:{defaultValue:null,description:"",name:"maxMenuHeight",required:!1,type:{name:"number"}},minMenuHeight:{defaultValue:null,description:"",name:"minMenuHeight",required:!1,type:{name:"number"}},maxVisibleValues:{defaultValue:null,description:"",name:"maxVisibleValues",required:!1,type:{name:"number"}},menuPlacement:{defaultValue:null,description:"",name:"menuPlacement",required:!1,type:{name:"enum",value:[{value:'"auto"'},{value:'"top"'},{value:'"bottom"'}]}},menuPosition:{defaultValue:null,description:"",name:"menuPosition",required:!1,type:{name:"enum",value:[{value:'"fixed"'},{value:'"absolute"'}]}},menuShouldPortal:{defaultValue:null,description:"Setting to false will prevent the menu from portalling to the body.",name:"menuShouldPortal",required:!1,type:{name:"boolean"}},noOptionsMessage:{defaultValue:null,description:"The message to display when no options could be found",name:"noOptionsMessage",required:!1,type:{name:"string"}},onCloseMenu:{defaultValue:null,description:"",name:"onCloseMenu",required:!1,type:{name:"(() => void)"}},onCreateOption:{defaultValue:null,description:"allowCustomValue must be enabled. Function decides what to do with that custom value.",name:"onCreateOption",required:!1,type:{name:"((value: string) => void)"}},onInputChange:{defaultValue:null,description:"",name:"onInputChange",required:!1,type:{name:"((value: string, actionMeta: InputActionMeta) => void)"}},openMenuOnFocus:{defaultValue:null,description:"",name:"openMenuOnFocus",required:!1,type:{name:"boolean"}},renderControl:{defaultValue:null,description:"Use a custom element to control Select. A proper ref to the renderControl is needed if 'portal' isn't set to null",name:"renderControl",required:!1,type:{name:"ControlComponent<T>"}},tabSelectsValue:{defaultValue:null,description:"",name:"tabSelectsValue",required:!1,type:{name:"boolean"}},virtualized:{defaultValue:null,description:'Will wrap the MenuList in a react-window FixedSizeVirtualList for improved performance, does not support options with "description" properties',name:"virtualized",required:!1,type:{name:"boolean"}},isOptionDisabled:{defaultValue:null,description:"",name:"isOptionDisabled",required:!1,type:{name:"(() => boolean)"}},isValidNewOption:{defaultValue:null,description:'allowCustomValue must be enabled. Determines whether the "create new" option should be displayed based on the current input value, select value and options array.',name:"isValidNewOption",required:!1,type:{name:"((inputValue: string, value: SelectableValue<T> | null, options: OptionsOrGroups<SelectableValue<T>, GroupBase<SelectableValue<T>>>) => boolean)"}},loadingMessage:{defaultValue:null,description:"Message to display isLoading=true",name:"loadingMessage",required:!1,type:{name:"string"}},defaultOptions:{defaultValue:null,description:"When specified as boolean the loadOptions will execute when component is mounted",name:"defaultOptions",required:!1,type:{name:"boolean | SelectableValue<T>[]"}},loadOptions:{defaultValue:null,description:"Asynchronously load select options",name:"loadOptions",required:!1,type:{name:"((query: string, cb?: LoadOptionsCallback<T>) => void | Promise<SelectableValue<T>[]>)"}},cacheOptions:{defaultValue:null,description:"If cacheOptions is true, then the loaded data will be cached. The cache will remain until cacheOptions changes value.",name:"cacheOptions",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.tsx#AsyncMultiSelect"]={docgenInfo:ya.__docgenInfo,name:"AsyncMultiSelect",path:"src/components/Select/Select.tsx#AsyncMultiSelect"})}catch(ke){}try{SelectContainer.displayName="SelectContainer",SelectContainer.__docgenInfo={description:"",displayName:"SelectContainer",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/Select.tsx#SelectContainer"]={docgenInfo:SelectContainer.__docgenInfo,name:"SelectContainer",path:"src/components/Select/Select.tsx#SelectContainer"})}catch(ke){}},"./src/components/Select/mockOptions.tsx":function(se,V,e){"use strict";e.d(V,{R:function(){return l},u:function(){return a}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t);const a=(f=!1)=>["Sharilyn Markowitz","Naomi Striplin","Beau Bevel","Garrett Starkes","Hildegarde Pedro","Gudrun Seyler","Eboni Raines","Hye Felix","Chau Brito","Heidy Zook","Karima Husain","Virgil Mckinny","Kaley Dodrill","Sharan Ruf","Edgar Loveland","Judie Sanger","Season Bundrick","Ok Vicente","Garry Spitz","Han Harnish"].map(d=>({value:(0,t.kebabCase)(d),label:d,description:f?`This is a description of ${d}`:void 0})),l=()=>new Array(1e4).fill(null).map((x,d)=>({value:String(d),label:"Option "+d,description:"This is option number "+d}));try{a.displayName="generateOptions",a.__docgenInfo={description:"",displayName:"generateOptions",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Select/mockOptions.tsx#generateOptions"]={docgenInfo:a.__docgenInfo,name:"generateOptions",path:"src/components/Select/mockOptions.tsx#generateOptions"})}catch(f){}},"./src/components/Slider/styles.ts":function(se,V,e){"use strict";e.d(V,{W:function(){return l}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@emotion-react-virtual-b3c85744cb/2/yarn/cache/@emotion-react-npm-11.10.6-655b70ad8d-4762042e39.zip/node_modules/@emotion/react/dist/emotion-react.browser.esm.js"),a=e("./src/themes/stylesFactory.ts");const l=(0,a.B)((f,x,d=!1)=>{const{spacing:i}=f,c=f.colors.border.strong,E=f.colors.primary.main,O=f.colors.primary.main,w=`box-shadow: 0px 0px 0px 6px ${f.colors.primary.transparent}`;return{container:t.iv`
      width: 100%;
      margin: ${x?"inherit":`${i(1,3,1,1)}`};
      padding-bottom: ${x&&d?f.spacing(1):"inherit"};
      height: ${x?"auto":"100%"};
    `,slider:t.iv`
      .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: ${f.spacing(1.75)};
      }
      .rc-slider-mark-text {
        color: ${f.colors.text.disabled};
        font-size: ${f.typography.bodySmall.fontSize};
      }
      .rc-slider-mark-text-active {
        color: ${f.colors.text.primary};
      }
      .rc-slider-handle {
        border: none;
        background-color: ${O};
        box-shadow: ${f.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 ${f.colors.text.primary};
      }

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

      .rc-slider-track {
        background-color: ${E};
      }
      .rc-slider-rail {
        background-color: ${c};
        cursor: pointer;
      }
    `,tooltip:n.iv`
      body {
        .rc-slider-tooltip {
          cursor: grab;
          user-select: none;
          z-index: ${f.zIndex.tooltip};
        }

        .rc-slider-tooltip-inner {
          color: ${f.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:t.iv`
      display: flex;
      flex-direction: row;
      align-items: center;
      width: 100%;
    `,sliderInputVertical:t.iv`
      flex-direction: column;
      height: 100%;

      .rc-slider {
        margin: 0;
        order: 2;
      }
    `,sliderInputField:t.iv`
      margin-left: ${f.spacing(3)};
      width: 60px;
      input {
        text-align: center;
      }
    `,sliderInputFieldVertical:t.iv`
      margin: 0 0 ${f.spacing(3)} 0;
      order: 1;
    `}})},"./src/components/Sparkline/Sparkline.tsx":function(se,V,e){"use strict";e.d(V,{b:function(){return Co}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js");function a(G,N,X){var Te,Ve;if(G===N)return!0;if(((Te=G==null?void 0:G.fields)==null?void 0:Te.length)!==((Ve=N==null?void 0:N.fields)==null?void 0:Ve.length)||G.name!==N.name)return!1;for(let Re=0;Re<G.fields.length;Re++){const Ke=G.fields[Re],nt=N.fields[Re];if(Ke.type!==nt.type||Ke.name!==nt.name)return!1;if(X)continue;if(Ke.labels&&nt.labels&&!x(Ke.labels,nt.labels))return!1;const ot=Ke.config,ht=nt.config;let Tt=Object.keys(ot),Pt=Object.keys(ht);if(Tt.length!==Pt.length)return!1;for(const ct of Tt){if(!(ct in ht))return!1;if(ct!=="interval"&&!(0,t.isEqual)(ot[ct],ht[ct]))return!1}}return!0}function l(G,N,X){if(G===N)return!0;if((G==null?void 0:G.length)!==(N==null?void 0:N.length))return!1;for(let Te=0;Te<G.length;Te++)if(!X(G[Te],N[Te]))return!1;return!0}const f=(G,N)=>G===N;function x(G,N,X=f){if(G===N)return!0;const Te=Object.keys(G),Ve=Object.keys(N);if(Te.length!==Ve.length)return!1;for(let Re of Te)if(!X(G[Re],N[Re]))return!1;return!0}var d=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts"),i=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/fieldColor.ts"),c=e("../grafana-schema/src/common/common.gen.ts"),E=e("../../../yarn/cache/uplot-npm-1.6.24-51171f5ab7-253e389dc6.zip/node_modules/uplot/dist/uPlot.esm.js"),O=e("../../../yarn/cache/rxjs-npm-7.8.0-722f1c7172-61b4d4fd32.zip/node_modules/rxjs/dist/esm5/internal/operators/map.js"),m=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/parser.ts"),w=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/ArrayVector.ts"),_=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/matchers.ts"),C=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/transformations/matchers/ids.ts"),b=(G=>(G.append="append",G.reduce="reduce",G.order="order",G.organize="organize",G.rename="rename",G.calculateField="calculateField",G.seriesToColumns="seriesToColumns",G.seriesToRows="seriesToRows",G.merge="merge",G.concatenate="concatenate",G.labelsToFields="labelsToFields",G.filterFields="filterFields",G.filterFieldsByName="filterFieldsByName",G.filterFrames="filterFrames",G.filterByRefId="filterByRefId",G.renameByRegex="renameByRegex",G.filterByValue="filterByValue",G.noop="noop",G.ensureColumns="ensureColumns",G.groupBy="groupBy",G.sortBy="sortBy",G.histogram="histogram",G.configFromData="configFromData",G.rowsToFields="rowsToFields",G.prepareTimeSeries="prepareTimeSeries",G.convertFieldType="convertFieldType",G.fieldLookup="fieldLookup",G.heatmap="heatmap",G.spatial="spatial",G.joinByField="joinByField",G.joinByLabels="joinByLabels",G.extractFields="extractFields",G.groupingToMatrix="groupingToMatrix",G.limit="limit",G.partitionByValues="partitionByValues",G.timeSeriesTable="timeSeriesTable",G))(b||{}),g=Object.defineProperty,v=Object.defineProperties,y=Object.getOwnPropertyDescriptors,h=Object.getOwnPropertySymbols,s=Object.prototype.hasOwnProperty,o=Object.prototype.propertyIsEnumerable,r=(G,N,X)=>N in G?g(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,u=(G,N)=>{for(var X in N||(N={}))s.call(N,X)&&r(G,X,N[X]);if(h)for(var X of h(N))o.call(N,X)&&r(G,X,N[X]);return G},p=(G,N)=>v(G,y(N));const S={id:b.convertFieldType,name:"Convert field type",description:"Convert a field to a specified field type",defaultOptions:{fields:{},conversions:[{targetField:void 0,destinationType:void 0,dateFormat:void 0}]},operator:(G,N)=>X=>X.pipe((0,O.U)(Te=>S.transformer(G,N)(Te))),transformer:G=>N=>{var X;return!Array.isArray(N)||N.length===0?N:(X=k(G,N))!=null?X:[]}};function k(G,N){if(!G.conversions.length)return N;const X=N.map(Te=>u({},Te));for(const Te of G.conversions){if(!Te.targetField)continue;const Ve=_.Ls.get(C.mi.byName).get(Te.targetField);for(const Re of X)Re.fields=Re.fields.map(Ke=>Ve(Ke,Re,X)?D(Ke,Te):Ke)}return X}function D(G,N){switch(N.destinationType){case d.fS.time:return $(G,N.dateFormat);case d.fS.number:return T(G);case d.fS.string:return K(G,N.dateFormat);case d.fS.boolean:return j(G);case d.fS.enum:return R(G,N.enumConfig);case d.fS.other:return F(G);default:return G}}const M=/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(?:\.\d{3,})?(?:Z|[-+]\d{2}:?\d{2})$/;function I(G,N){let X=N?{format:N}:void 0;const Te=G.values.toArray().slice();let Ve=Te.find(Ke=>Ke!=null),Re=typeof Ve=="string"&&M.test(Ve);for(let Ke=0;Ke<Te.length;Ke++)if(Te[Ke]){let nt=Re?Date.parse(Te[Ke]):(0,m.J)(Te[Ke],X).valueOf();Te[Ke]=Number.isFinite(nt)?nt:null}else Te[Ke]=null;return p(u({},G),{type:d.fS.time,values:new w.G(Te)})}function T(G){const N=G.values.toArray().slice(),X=N.some(Te=>typeof Te=="string");for(let Te=0;Te<N.length;Te++){let Ve=N[Te];X&&(Ve=Ve.replace(/,/g,""));const Re=+Ve;N[Te]=Number.isFinite(Re)?Re:null}return p(u({},G),{type:d.fS.number,values:new w.G(N)})}function j(G){const N=G.values.toArray().slice();for(let X=0;X<N.length;X++)N[X]=Boolean(!!N[X]);return p(u({},G),{type:d.fS.boolean,values:new w.G(N)})}function K(G,N){let X=G.values.toArray();switch(G.type){case d.fS.time:X=X.map(Te=>(0,m.J)(Te).format(N));break;case d.fS.other:X=X.map(Te=>JSON.stringify(Te));break;default:X=X.map(Te=>`${Te}`)}return p(u({},G),{type:d.fS.string,values:new w.G(X)})}function F(G){const N=G.values.toArray().slice();for(let X=0;X<N.length;X++)try{N[X]=JSON.parse(N[X])}catch(Te){N[X]=null}return p(u({},G),{type:d.fS.other,values:new w.G(N)})}function $(G,N){const X=typeof G.values.get(0)=="number";return G.type===d.fS.time&&X?G:X?p(u({},G),{type:d.fS.time}):I(G,N)}function R(G,N){const X=u({},N),Te=G.values.toArray().slice(),Ve=new Map;if(X.text)for(let Re=0;Re<X.text.length;Re++)Ve.set(X.text[Re],Re);else X.text=[];for(let Re=0;Re<Te.length;Re++){const Ke=Te[Re];Ve.has(Ke)||(X.text[Ve.size]=Ke,Ve.set(Ke,Ve.size)),Te[Re]=Ve.get(Ke)}return p(u({},G),{config:p(u({},G.config),{type:{enum:X}}),type:d.fS.enum,values:new w.G(Te)})}var U=Object.defineProperty,H=Object.defineProperties,W=Object.getOwnPropertyDescriptors,oe=Object.getOwnPropertySymbols,Q=Object.prototype.hasOwnProperty,P=Object.prototype.propertyIsEnumerable,ae=(G,N,X)=>N in G?U(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,q=(G,N)=>{for(var X in N||(N={}))Q.call(N,X)&&ae(G,X,N[X]);if(oe)for(var X of oe(N))P.call(N,X)&&ae(G,X,N[X]);return G},Y=(G,N)=>H(G,W(N));function ve(G,N,X){var Te}const re=(0,t.throttle)((...G)=>{console.log(...G)},500),je=G=>{let N=!1;return{logger:(X,Te=!1,...Ve)=>{},enable:()=>N=!0,disable:()=>N=!1,isEnabled:()=>N}};var me=e("../../../yarn/cache/fast_array_intersect-npm-1.1.0-56bca1a61e-3bd65089e8.zip/node_modules/fast_array_intersect/lib/index.js"),ne=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/dataframe/processDataFrame.ts"),Z=(G=>(G.outer="outer",G.inner="inner",G))(Z||{});const te={id:b.joinByField,aliasIds:[b.seriesToColumns],name:"Join by field",description:"Combine rows from two or more tables, based on a related field between them.  This can be used to outer join multiple time series on the _time_ field to show many time series in one table.",defaultOptions:{byField:void 0,mode:"outer"},operator:(G,N)=>X=>X.pipe((0,O.U)(Te=>te.transformer(G,N)(Te))),transformer:G=>{let N;return X=>{if(X.length>1){G.byField&&!N&&(N=_.Ls.get(C.mi.byName).get(G.byField));const Te=ce({frames:X,joinBy:N,mode:G.mode});if(Te)return[Te]}return X}}};var Pe=Object.defineProperty,he=Object.defineProperties,ie=Object.getOwnPropertyDescriptors,Ce=Object.getOwnPropertySymbols,Le=Object.prototype.hasOwnProperty,we=Object.prototype.propertyIsEnumerable,ue=(G,N,X)=>N in G?Pe(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,Ie=(G,N)=>{for(var X in N||(N={}))Le.call(N,X)&&ue(G,X,N[X]);if(Ce)for(var X of Ce(N))we.call(N,X)&&ue(G,X,N[X]);return G},qe=(G,N)=>he(G,ie(N));function Je(G){const{timeField:N}=(0,ne.sV)(G[0]);if(N)return _.Ls.get(C.mi.firstTimeField).get({});let X=[];for(const Te of G[0].fields)Te.type===d.fS.number&&X.push(Te.name);for(let Te=1;Te<G.length;Te++){const Ve=[];for(const Re of G[0].fields)Re.type===d.fS.number&&Ve.push(Re.name);X=X.filter(Re=>!Ve.includes(Re))}return _.Ls.get(C.mi.byName).get(X[0])}function Ze(G){var N;return(N=G.joinBy)!=null?N:Je(G.frames)}function Oe(G,N){if(N>=0){let X=G.fields[N];X.type!==d.fS.string&&!We(X.values)&&(G=(0,ne.aK)(G,N))}return G}function ce(G){var N,X,Te,Ve,Re;if(!((N=G.frames)!=null&&N.length))return;if(G.frames.length===1){let Pt=G.frames[0],ct=Pt;const Mt=Ze(G);let dt=ct.fields.findIndex(Bt=>Mt(Bt,ct,G.frames));if(G.keepOriginIndices&&(ct=qe(Ie({},Pt),{fields:Pt.fields.map((Bt,Rt)=>{const Ft=Ie({},Bt),Dt={frameIndex:0,fieldIndex:Rt};return Ft.state?Ft.state.origin=Dt:Ft.state={origin:Dt},Ft})}),dt>0)){const Bt=ct.fields[dt],Rt=ct.fields.filter((Ft,Dt)=>Dt!==dt);Rt.unshift(Bt),ct.fields=Rt,dt=0}if(dt>=0&&(ct=Oe(ct,dt)),G.keep){let Bt=ct.fields.filter((Rt,Ft)=>Ft===dt||G.keep(Rt,ct,G.frames));Pt!==ct?ct.fields=Bt:ct=qe(Ie({},Pt),{fields:Bt})}return ct}const Ke=[],nt=[],ot=[],ht=Ze(G);for(let Pt=0;Pt<G.frames.length;Pt++){const ct=G.frames[Pt];if(!ct||!((X=ct.fields)!=null&&X.length))continue;const Mt=[pe];let dt,Bt=[];for(let Ft=0;Ft<ct.fields.length;Ft++){const Dt=ct.fields[Ft];if(Dt.state=Dt.state||{},!dt&&ht(Dt,ct,G.frames))dt=Dt;else{if(G.keep&&!G.keep(Dt,ct,G.frames))continue;let Zt=(Te=Dt.config.custom)==null?void 0:Te.spanNulls;Mt.push(Zt===!0?pe:Zt===-1?J:L);let Yt=(Ve=Dt.labels)!=null?Ve:{};ct.name&&(Yt=qe(Ie({},Yt),{name:ct.name})),Bt.push(qe(Ie({},Dt),{labels:Yt}))}G.keepOriginIndices&&(Dt.state.origin={frameIndex:Pt,fieldIndex:Ft})}if(!dt)continue;ot.length===0&&ot.push(dt),Ke.push(Mt);const Rt=[dt.values.toArray()];for(const Ft of Bt)Rt.push(Ft.values.toArray()),ot.push(Ft),(Re=Ft.state)==null||delete Re.displayName;nt.push(Rt)}const Tt=xe(nt,Ke,G.mode);return{length:Tt[0].length,fields:ot.map((Pt,ct)=>qe(Ie({},Pt),{values:new w.G(Tt[ct])}))}}const pe=0,J=1,L=2;function fe(G,N,X){for(let Te=0,Ve,Re=-1;Te<N.length;Te++){let Ke=N[Te];if(Ke>Re){for(Ve=Ke-1;Ve>=0&&G[Ve]==null;)G[Ve--]=null;for(Ve=Ke+1;Ve<X&&G[Ve]==null;)G[Re=Ve++]=null}}}function xe(G,N,X=Z.outer){let Te;if(X===Z.inner)Te=new Set((0,me.Z)(G.map(nt=>nt[0])));else{Te=new Set;for(let nt=0;nt<G.length;nt++){let ht=G[nt][0],Tt=ht.length;for(let Pt=0;Pt<Tt;Pt++)Te.add(ht[Pt])}}let Ve=[Array.from(Te).sort((nt,ot)=>nt-ot)],Re=Ve[0].length,Ke=new Map;for(let nt=0;nt<Re;nt++)Ke.set(Ve[0][nt],nt);for(let nt=0;nt<G.length;nt++){let ot=G[nt],ht=ot[0];for(let Tt=1;Tt<ot.length;Tt++){let Pt=ot[Tt],ct=Array(Re).fill(void 0),Mt=N?N[nt][Tt]:J,dt=[];for(let Bt=0;Bt<Pt.length;Bt++){let Rt=Pt[Bt],Ft=Ke.get(ht[Bt]);Rt===null?Mt!==pe&&(ct[Ft]=Rt,Mt===L&&dt.push(Ft)):ct[Ft]=Rt}fe(ct,dt,Re),Ve.push(ct)}}return Ve}function We(G,N=50){const X=G.length;if(X<=1)return!0;let Te=0,Ve=X-1;for(;Te<=Ve&&G.get(Te)==null;)Te++;for(;Ve>=Te&&G.get(Ve)==null;)Ve--;if(Ve<=Te)return!0;const Re=Math.max(1,Math.floor((Ve-Te+1)/N));for(let Ke=G.get(Te),nt=Te+Re;nt<=Ve;nt+=Re){const ot=G.get(nt);if(ot!=null){if(ot<=Ke)return!1;Ke=ot}}return!0}var Ue=e("../../../yarn/cache/rxjs-npm-7.8.0-722f1c7172-61b4d4fd32.zip/node_modules/rxjs/dist/esm5/internal/Subscription.js"),at=e("../../../yarn/cache/rxjs-npm-7.8.0-722f1c7172-61b4d4fd32.zip/node_modules/rxjs/dist/esm5/internal/operators/throttleTime.js"),it=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/events/common.ts");const _t=new Set;function wt(G){if(_t.has(G))throw new Error(`There is already an event defined with type '${G}'`);return _t.add(G),{name:G}}var ee=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/events/types.ts");const _e={alertSuccess:wt("alert-success"),alertWarning:wt("alert-warning"),alertError:wt("alert-error")},ge={refresh:wt("refresh"),componentDidMount:wt("component-did-mount"),dataReceived:wt("data-received"),dataError:wt("data-error"),dataFramesReceived:wt("data-frames-received"),dataSnapshotLoad:wt("data-snapshot-load"),editModeInitialized:wt("init-edit-mode"),initPanelActions:wt("init-panel-actions"),initialized:wt("panel-initialized"),panelTeardown:wt("panel-teardown"),render:wt("render")};class de extends ee.R{}de.type="graph-hover";class Ee extends ee.m{constructor(){super(...arguments),this.payload={point:{}}}}Ee.type="graph-hover-clear";var ze=e("./src/components/PanelChrome/PanelContext.ts"),le=e("./src/components/VizLayout/VizLayout.tsx");const ye="__fixed";function Se(G,N,X=[]){for(const Te of X)if(typeof Te=="function"){if(!Te(G,N))return!1}else if(N[Te]!==G[Te])return!1;return!0}class Be extends n.Component{constructor(N){super(N),this.panelContext={},this.subscription=new Ue.w0,this.getTimeRange=()=>this.props.timeRange;let X=this.prepState(N);X.alignedData=X.config.prepData([X.alignedFrame]),this.state=X,this.plotInstance=n.createRef()}prepState(N,X=!0){var Te;let Ve=null;const{frames:Re,fields:Ke,preparePlotFrame:nt}=N,ht=(nt||ta)(Re,Ke||{x:_.Ls.get(C.mi.firstTimeField).get({}),y:_.Ls.get(C.mi.numeric).get({})},N.timeRange);if(rn("GraphNG",!1,"data aligned",ht),ht){let Tt=(Te=this.state)==null?void 0:Te.config;X&&(Tt=N.prepConfig(ht,this.props.frames,this.getTimeRange),rn("GraphNG",!1,"config prepared",Tt)),Ve={alignedFrame:ht,config:Tt},rn("GraphNG",!1,"data prepared",Ve.alignedData)}return Ve}handleCursorUpdate(N){var X,Te;const Ve=(Te=(X=N.payload)==null?void 0:X.point)==null?void 0:Te.time,Re=this.plotInstance.current;if(Re&&Ve){const Ke=Re.valToPos(Ve,"x");let nt;if(Ke&&(nt=Vt(Re,Re.posToIdx(Ke))),!nt||!Ke)return;Re.setCursor({left:Ke,top:nt})}}componentDidMount(){this.panelContext=this.context;const{eventBus:N}=this.panelContext;this.subscription.add(N.getStream(it.es).pipe((0,at.p)(50)).subscribe({next:X=>{N!==X.origin&&this.handleCursorUpdate(X)}})),this.subscription.add(N.getStream(de).pipe((0,at.p)(50)).subscribe({next:X=>this.handleCursorUpdate(X)})),this.subscription.add(N.getStream(it.xH).pipe((0,at.p)(50)).subscribe({next:()=>{var X;const Te=(X=this.plotInstance)==null?void 0:X.current;Te&&Te.setCursor({left:-10,top:-10})}}))}componentDidUpdate(N){const{frames:X,structureRev:Te,timeZone:Ve,propsToDiff:Re}=this.props,Ke=!Se(N,this.props,Re);if(X!==N.frames||Ke||Ve!==N.timeZone){let nt=this.prepState(this.props,!1);nt&&((this.state.config===void 0||Ve!==N.timeZone||Te!==N.structureRev||!Te||Ke)&&(nt.config=this.props.prepConfig(nt.alignedFrame,this.props.frames,this.getTimeRange),rn("GraphNG",!1,"config recreated",nt.config)),nt.alignedData=nt.config.prepData([nt.alignedFrame]),this.setState(nt))}}componentWillUnmount(){this.subscription.unsubscribe()}render(){const{width:N,height:X,children:Te,timeRange:Ve,renderLegend:Re}=this.props,{config:Ke,alignedFrame:nt,alignedData:ot}=this.state;return Ke?n.createElement(le.AY,{width:N,height:X,legend:Re(Ke)},(ht,Tt)=>n.createElement(gn,{config:Ke,data:ot,width:ht,height:Tt,timeRange:Ve,plotRef:Pt=>this.plotInstance.current=Pt},Te?Te(Ke,nt):null)):null}}Be.contextType=ze.bb;try{Be.displayName="GraphNG",Be.__docgenInfo={description:'"Time as X" core component, expects ascending x',displayName:"GraphNG",props:{frames:{defaultValue:null,description:"",name:"frames",required:!0,type:{name:"DataFrame[]"}},structureRev:{defaultValue:null,description:"",name:"structureRev",required:!1,type:{name:"number"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},timeRange:{defaultValue:null,description:"",name:"timeRange",required:!0,type:{name:"TimeRange"}},timeZone:{defaultValue:null,description:"",name:"timeZone",required:!0,type:{name:"string | string[]"}},legend:{defaultValue:null,description:"",name:"legend",required:!0,type:{name:"VizLegendOptions"}},fields:{defaultValue:null,description:"",name:"fields",required:!1,type:{name:"XYFieldMatchers"}},renderers:{defaultValue:null,description:"",name:"renderers",required:!1,type:{name:"Renderers"}},tweakScale:{defaultValue:null,description:"",name:"tweakScale",required:!1,type:{name:"((opts: ScaleProps, forField: Field<any, Vector<any>>) => ScaleProps)"}},tweakAxis:{defaultValue:null,description:"",name:"tweakAxis",required:!1,type:{name:"((opts: AxisProps, forField: Field<any, Vector<any>>) => AxisProps)"}},onLegendClick:{defaultValue:null,description:"",name:"onLegendClick",required:!1,type:{name:"((event: GraphNGLegendEvent) => void)"}},prepConfig:{defaultValue:null,description:"",name:"prepConfig",required:!0,type:{name:"(alignedFrame: DataFrame, allFrames: DataFrame[], getTimeRange: () => TimeRange) => UPlotConfigBuilder"}},propsToDiff:{defaultValue:null,description:"",name:"propsToDiff",required:!1,type:{name:"(string | PropDiffFn<any>)[]"}},preparePlotFrame:{defaultValue:null,description:"",name:"preparePlotFrame",required:!1,type:{name:"((frames: DataFrame[], dimFields: XYFieldMatchers) => DataFrame)"}},renderLegend:{defaultValue:null,description:"",name:"renderLegend",required:!0,type:{name:"(config: UPlotConfigBuilder) => ReactElement<any, string | JSXElementConstructor<any>> | null"}},options:{defaultValue:null,description:`needed for propsToDiff to re-init the plot & config
this is a generic approach to plot re-init, without having to specify which panel-level options
should cause invalidation. we can drop this in favor of something like panelOptionsRev that gets passed in
similar to structureRev. then we can drop propsToDiff entirely.`,name:"options",required:!1,type:{name:"Record<string, any>"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/GraphNG/GraphNG.tsx#GraphNG"]={docgenInfo:Be.__docgenInfo,name:"GraphNG",path:"src/components/GraphNG/GraphNG.tsx#GraphNG"})}catch(G){}var Xe=Object.defineProperty,st=Object.defineProperties,mt=Object.getOwnPropertyDescriptors,rt=Object.getOwnPropertySymbols,lt=Object.prototype.hasOwnProperty,ft=Object.prototype.propertyIsEnumerable,St=(G,N,X)=>N in G?Xe(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,gt=(G,N)=>{for(var X in N||(N={}))lt.call(N,X)&&St(G,X,N[X]);if(rt)for(var X of rt(N))ft.call(N,X)&&St(G,X,N[X]);return G},pt=(G,N)=>st(G,mt(N));const ut={threshold:(G,N,X)=>G+X,midpoint:(G,N,X)=>(G+N)/2,plusone:(G,N,X)=>G+1};function Ot(G){if(G.frame.length===0)return G.frame;let N=!0,{frame:X,refFieldName:Te,refFieldPseudoMax:Ve,refFieldPseudoMin:Re,insertMode:Ke}=G;Ke||(Ke=ut.threshold);const nt=X.fields.find(Tt=>Te!=null?Tt.name===Te:Tt.type===d.fS.time);if(nt==null)return X;nt.state=pt(gt({},nt.state),{nullThresholdApplied:!0});const ot=X.fields.map(Tt=>{var Pt,ct,Mt;return(Mt=(ct=(Pt=Tt.config.custom)==null?void 0:Pt.insertNulls)!=null?ct:nt.config.interval)!=null?Mt:null}),ht=new Set(ot);if(ht.delete(null),ht.size===0)return X;if(ht.size===1){const Tt=ht.values().next().value;if(Tt<=0)return X;const Pt=nt.values.toArray(),ct=X.fields.map(dt=>dt.values.toArray()),Mt=Wt(Pt,ct,Tt,Re,Ve,Ke,N);return Mt===ct?X:pt(gt({},X),{length:Mt[0].length,fields:X.fields.map((dt,Bt)=>pt(gt({},dt),{values:new w.G(Mt[Bt])}))})}return X}function Wt(G,N,X,Te=null,Ve=null,Re,Ke){const nt=G.length,ot=[];if(Te!=null&&Te<G[0]){let ct=Math.ceil((G[0]-Te)/X),Mt=G[0]-ct*X;for(;Mt<G[0];)ot.push(Re(Mt-X,Mt,X)),Mt+=X}ot.push(G[0]);let ht=G[0];for(let ct=1;ct<nt;ct++){const Mt=G[ct];for(;Mt-ht>X&&(ot.push(Re(ht,Mt,X)),ht+=X,!!Ke););ot.push(Mt),ht=Mt}if(Ve!=null&&Ve>ht)for(;ht+X<Ve;)ot.push(Re(ht,Ve,X)),ht+=X;const Tt=ot.length;if(Tt===nt)return N;const Pt=[];for(let ct of N){let Mt;if(ct!==G){Mt=Array(Tt);for(let dt=0,Bt=0;dt<Tt;dt++)Mt[dt]=G[Bt]===ot[dt]?ct[Bt++]:null}else Mt=ot;Pt.push(Mt)}return Pt}function Ht(G,N,X){let Te,Ve;for(let Re=0;Re<N.length;Re++)if(N[Re]==null)Ve==null&&Te!=null&&(Ve=Re);else{if(Ve!=null){if(G[Re]-Te<X)for(;Ve<Re;)N[Ve++]=void 0;Ve=null}Te=G[Re]}return N}var on=Object.defineProperty,un=Object.defineProperties,mn=Object.getOwnPropertyDescriptors,wn=Object.getOwnPropertySymbols,Gt=Object.prototype.hasOwnProperty,hn=Object.prototype.propertyIsEnumerable,fn=(G,N,X)=>N in G?on(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,Hn=(G,N)=>{for(var X in N||(N={}))Gt.call(N,X)&&fn(G,X,N[X]);if(wn)for(var X of wn(N))hn.call(N,X)&&fn(G,X,N[X]);return G},va=(G,N)=>un(G,mn(N));function ia(G){var N,X,Te;return G.type===d.fS.number&&((N=G.config.custom)==null?void 0:N.drawStyle)===c.l8.Bars&&!((Te=(X=G.config.custom)==null?void 0:X.hideFrom)!=null&&Te.viz)}function ba(G){var N;let X=G.fields.find(Ve=>Ve.type===d.fS.time),Te=X==null?void 0:X.values.toArray();for(let Ve=0;Ve<G.fields.length;Ve++){let Re=G.fields[Ve];if(Re===X||ia(Re))continue;let Ke=(N=Re.config.custom)==null?void 0:N.spanNulls;typeof Ke=="number"&&Ke!==-1&&(Re.values=new w.G(Ht(Te,Re.values.toArray(),Ke)))}return G}function ta(G,N,X){G=G.map(Ke=>{var nt;return(nt=Ke.fields[0].state)!=null&&nt.nullThresholdApplied?Ke:Ot({frame:Ke,refFieldName:null,refFieldPseudoMin:X==null?void 0:X.from.valueOf(),refFieldPseudoMax:X==null?void 0:X.to.valueOf()})});let Te=0;G.forEach(Ke=>{Ke.fields.forEach(nt=>{ia(nt)&&(nt.config.custom=va(Hn({},nt.config.custom),{spanNulls:-1}),Te++)})});let Ve=1/0;Te>1&&G.forEach(Ke=>{if(!Ke.fields.some(ia))return;const nt=Ke.fields[0].values.toArray();for(let ot=0;ot<nt.length;ot++)ot>0&&(Ve=Math.min(Ve,nt[ot]-nt[ot-1]))});let Re=ce({frames:G,joinBy:N.x,keep:N.y,keepOriginIndices:!0});return Re?(Re=ba(Re),Ve!==1/0&&(Re.fields.forEach((Ke,nt)=>{let ot=Ke.values.toArray();if(nt===0){let ht=ot[ot.length-1];ot.push(ht+Ve,ht+2*Ve)}else ia(Ke)?ot.push(null,null):ot.push(void 0,void 0)}),Re.length+=2),Re):null}function na(G){var N,X,Te,Ve,Re,Ke,nt;const ot="na",ht=`${G.min!==void 0?G.min:ot}-${G.max!==void 0?G.max:ot}`,Tt=`${((N=G.custom)==null?void 0:N.axisSoftMin)!==void 0?G.custom.axisSoftMin:ot}-${((X=G.custom)==null?void 0:X.axisSoftMax)!==void 0?G.custom.axisSoftMax:ot}`,Pt=`${((Te=G.custom)==null?void 0:Te.axisPlacement)!==void 0?(Ve=G.custom)==null?void 0:Ve.axisPlacement:c.LB.Auto}`,ct=(Re=G.unit)!=null?Re:ye,Mt=(Ke=G.custom)!=null&&Ke.scaleDistribution?la(G.custom.scaleDistribution):c.wf.Linear,dt=Boolean((nt=G.custom)==null?void 0:nt.axisLabel)?G.custom.axisLabel:ot;return`${ct}/${ht}/${Tt}/${Pt}/${Mt}/${dt}`}function la(G){return G.type===c.wf.Log?`${G.type}${G.log}`:G.type}const $e=/\b(YYYY|YY|MMMM|MMM|MM|M|DD|D|WWWW|WWW|HH|H|h|AA|aa|a|mm|m|ss|s|fff)\b/g;function He(G){return G.replace($e,N=>`{${N}}`)}const Ye=(G,N,X)=>{let Te=N%2?X[0]||X[2]:X[1]||X[3];return X[N]||!Te?0:8},yt={ms:1,focus:{alpha:1},cursor:{focus:{prox:30}},legend:{show:!1},padding:[Ye,Ye,Ye,Ye],series:[],hooks:{}};var bt=(G=>(G[G.Pos=1]="Pos",G[G.Neg=-1]="Neg",G))(bt||{});function It(G){let N=[],{series:X,dir:Te}=G,Ve=X.length-1,Re=X.slice().reverse();return Re.forEach((Ke,nt)=>{if(nt!==Ve){let ot=Re[nt+1];N.push({series:[Ke,ot],dir:-1*Te})}}),N}function Lt(G){let N=new Map;return G.fields.forEach(({config:X,values:Te},Ve)=>{var Re;if(Ve===0)return;let{custom:Ke}=X;if(Ke==null||(Re=Ke.hideFrom)!=null&&Re.viz)return;let{stacking:nt}=Ke;if(nt==null)return;let{mode:ot,group:ht}=nt;if(ot===c.o0.None)return;let Tt=Te.toArray(),Pt=Ke.transform,ct=Ut(Pt,Tt),Mt=Ke.drawStyle,dt=Mt===c.l8.Bars?Ke.barAlignment:Mt===c.l8.Line?Ke.lineInterpolation:null,Bt=`${ct}|${ot}|${ht}|${na(X)}|${Mt}|${dt}`,Rt=N.get(Bt);Rt==null&&(Rt={series:[],dir:ct},N.set(Bt,Rt)),Rt.series.push(Ve)}),[...N.values()]}function zt(G,N,X){let Te=Array(G.fields.length),Ve=N.length,Re=G.length,Ke=Ve>0?Array(Re).fill(0):[],nt=Ve>0?Array(Re).fill(!1):[],ot=Array.from({length:Ve},()=>Ke.slice()),ht=Array.from({length:Ve},()=>nt.slice());if(N.forEach((Tt,Pt)=>{let ct=ht[Pt];Tt.series.forEach(Mt=>{var dt,Bt;let Rt=G.fields[Mt];if((Bt=(dt=Rt.config.custom)==null?void 0:dt.hideFrom)!=null&&Bt.viz)return;let Ft=Rt.values.toArray();for(let Dt=0;Dt<Re;Dt++)Ft[Dt]!=null&&(ct[Dt]=!0)})}),G.fields.forEach((Tt,Pt)=>{var ct,Mt;let dt=Tt.values.toArray();if(Pt===0){Tt.type===d.fS.time?Te[Pt]=$(Tt).values.toArray():Te[Pt]=dt;return}let{custom:Bt}=Tt.config;if(!Bt||((ct=Bt.hideFrom)==null?void 0:ct.viz)){Te[Pt]=dt;return}if(Bt.transform===c.pR.Constant){let Ft=dt.findIndex(Zt=>Zt!=null),Dt=dt[Ft];dt=Array(dt.length).fill(void 0),dt[Ft]=Dt}else if(dt=dt.slice(),Bt.transform===c.pR.NegativeY)for(let Ft=0;Ft<dt.length;Ft++)dt[Ft]!=null&&(dt[Ft]*=-1);let Rt=(Mt=Bt.stacking)==null?void 0:Mt.mode;if(!Rt||Rt===c.o0.None)Te[Pt]=dt;else{let Ft=N.findIndex(en=>en.series.indexOf(Pt)>-1),Dt=ot[Ft],Zt=ht[Ft],Yt=Te[Pt]=Array(Re);for(let en=0;en<Re;en++){let In=dt[en];In!=null?Yt[en]=Dt[en]+=In:Yt[en]=Zt[en]?Dt[en]:In}}}),X){let Tt=Te.map((Pt,ct)=>{let Mt=N.findIndex(dt=>dt.series.indexOf(ct)>-1);return Mt!==-1?ot[Mt]:Pt});X({totals:Tt})}return G.fields.forEach((Tt,Pt)=>{var ct,Mt,dt,Bt;if(Pt===0||((Mt=(ct=Tt.config.custom)==null?void 0:ct.hideFrom)==null?void 0:Mt.viz))return;if(((Bt=(dt=Tt.config.custom)==null?void 0:dt.stacking)==null?void 0:Bt.mode)===c.o0.Percent){let Ft=N.findIndex(en=>en.series.indexOf(Pt)>-1),Dt=ot[Ft],Zt=N[Ft],Yt=Te[Pt];for(let en=0;en<Re;en++){let In=Yt[en];In!=null&&(Yt[en]=Dt[en]===0?0:Zt.dir*(In/Dt[en]))}}}),Te}function Vt(G,N){let X,Te=1,Ve=1,Re=G.data[1][N],Ke=G.data[1][N];for(let nt=1;nt<G.data.length;nt++){const ht=G.data[nt][N];ht!=null&&(Re==null?Re=ht:ht>Re&&(Re=G.data[nt][N],Te=nt),Ke==null?Ke=ht:ht<Ke&&(Ke=G.data[nt][N],Ve=nt))}return Ke==null&&Re==null?X=void 0:Ke!=null&&Re!=null?X=(G.valToPos(Ke,G.series[Ve].scale)+G.valToPos(Re,G.series[Te].scale))/2:X=G.valToPos(Ke||Re,G.series[Te||Ve].scale),X!==void 0&&X<0&&(X=G.bbox.height/devicePixelRatio),X}function Ut(G,N){const X=Kt(N);return G===c.pR.NegativeY?X?1:-1:X?-1:1}function Kt(G,N=100){const X=G.length;if(X===0)return!1;let Te=0,Ve=X-1;for(;Te<=Ve&&G[Te]==null;)Te++;for(;Ve>=Te&&G[Ve]==null;)Ve--;let Re=0,Ke=0;if(Ve>=Te){const nt=Math.max(1,Math.floor((Ve-Te+1)/N));for(let ot=Te;ot<=Ve;ot+=nt){const ht=G[ot];ht!=null&&(ht<0||Object.is(ht,-0)?Re++:ht>0&&Ke++)}if(Re>Ke)return!0}return!1}const xn=je("uPlot"),rn=xn.logger;ve("graphng",void 0,xn);var Bn=Object.defineProperty,_n=Object.getOwnPropertySymbols,Fn=Object.prototype.hasOwnProperty,An=Object.prototype.propertyIsEnumerable,Sn=(G,N,X)=>N in G?Bn(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,ua=(G,N)=>{for(var X in N||(N={}))Fn.call(N,X)&&Sn(G,X,N[X]);if(_n)for(var X of _n(N))An.call(N,X)&&Sn(G,X,N[X]);return G};function sn(G,N){return N.width===G.width&&N.height===G.height}function pa(G,N){return N.data===G.data}function sa(G,N){return N.config===G.config}function Rn(G,N){let X=G.timeRange,Te=N.timeRange;return X===Te||Te.from.valueOf()===X.from.valueOf()&&Te.to.valueOf()===X.to.valueOf()}class gn extends n.Component{constructor(N){super(N),this.plotContainer=(0,n.createRef)(),this.plotCanvasBBox=(0,n.createRef)(),this.state={plot:null}}reinitPlot(){var N;let{width:X,height:Te,plotRef:Ve}=this.props;if((N=this.state.plot)==null||N.destroy(),X===0&&Te===0)return;this.props.config.addHook("setSize",nt=>{nt.over});const Re=ua({width:Math.floor(this.props.width),height:Math.floor(this.props.height)},this.props.config.getConfig());rn("UPlot",!1,"Reinitializing plot",Re);const Ke=new E.Z(Re,this.props.data,this.plotContainer.current);Ve&&Ve(Ke),this.setState({plot:Ke})}componentDidMount(){this.reinitPlot()}componentWillUnmount(){var N;(N=this.state.plot)==null||N.destroy()}componentDidUpdate(N){let{plot:X}=this.state;sn(N,this.props)?sa(N,this.props)?pa(N,this.props)?Rn(N,this.props)||X==null||X.setScale("x",{min:this.props.timeRange.from.valueOf(),max:this.props.timeRange.to.valueOf()}):X==null||X.setData(this.props.data):this.reinitPlot():X==null||X.setSize({width:Math.floor(this.props.width),height:Math.floor(this.props.height)})}render(){return n.createElement("div",{style:{position:"relative"}},n.createElement("div",{ref:this.plotContainer,"data-testid":"uplot-main-div"}),this.props.children)}}try{gn.displayName="UPlotChart",gn.__docgenInfo={description:"",displayName:"UPlotChart",props:{data:{defaultValue:null,description:"",name:"data",required:!0,type:{name:"AlignedData | [_: null, ...series: FacetValues[]]"}},width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},config:{defaultValue:null,description:"",name:"config",required:!0,type:{name:"UPlotConfigBuilder"}},timeRange:{defaultValue:null,description:"",name:"timeRange",required:!0,type:{name:"TimeRange"}},plotRef:{defaultValue:null,description:"",name:"plotRef",required:!1,type:{name:"((u: uPlot) => void)"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/uPlot/Plot.tsx#UPlotChart"]={docgenInfo:gn.__docgenInfo,name:"UPlotChart",path:"src/components/uPlot/Plot.tsx#UPlotChart"})}catch(G){}var ma=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/time.ts"),Ta=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/timezones.ts"),ya=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),ke=Math.pow;function Ne(G,N=0){if(Number.isInteger(G))return G;let X=ke(10,N),Te=G*X*(1+Number.EPSILON);return Math.round(Te)/X}function Ge(G){return((""+G).split(".")[1]||"").length}var Et=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formats.ts"),Jt=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/datetime/formatter.ts"),an=e("./src/utils/measureText.ts");class Cn{constructor(N){this.props=N}}var En=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/displayProcessor.ts"),Tn=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/createTheme.ts"),kn=(G=>(G.TimeSeriesWide="timeseries-wide",G.TimeSeriesLong="timeseries-long",G.TimeSeriesMany="timeseries-many",G.TimeSeriesMulti="timeseries-multi",G.DirectoryListing="directory-listing",G.HeatmapRows="heatmap-rows",G.HeatmapCells="heatmap-cells",G.Histogram="histogram",G))(kn||{}),Gn=Object.defineProperty,Ae=Object.defineProperties,De=Object.getOwnPropertyDescriptors,Fe=Object.getOwnPropertySymbols,xt=Object.prototype.hasOwnProperty,Qt=Object.prototype.propertyIsEnumerable,Xt=(G,N,X)=>N in G?Gn(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,tn=(G,N)=>{for(var X in N||(N={}))xt.call(N,X)&&Xt(G,X,N[X]);if(Fe)for(var X of Fe(N))Qt.call(N,X)&&Xt(G,X,N[X]);return G},qt=(G,N)=>Ae(G,De(N));const cn=[1e-9,2e-9,25e-10,4e-9,5e-9,1e-8,2e-8,25e-9,4e-8,5e-8,1e-7,2e-7,25e-8,4e-7,5e-7,1e-6,2e-6,25e-7,4e-6,5e-6,1e-5,2e-5,25e-6,4e-5,5e-5,1e-4,2e-4,25e-5,4e-4,5e-4,.001,.002,.0025,.004,.005,.01,.02,.025,.04,.05,.1,.2,.25,.4,.5,1,2,4,5,10,20,25,40,50,100,200,250,400,500,1e3,2e3,2500,4e3,5e3,1e4,2e4,25e3,4e4,5e4,1e5,2e5,25e4,4e5,5e5,1e6,2e6,25e5,4e6,5e6,1e7,2e7,25e6,4e7,5e7,1e8,2e8,25e7,4e8,5e8,1e9,2e9,25e8,4e9,5e9],ln=[null],Dn=(G,N)=>G-N,zn={bucketSize:{name:"Bucket size",description:void 0},bucketOffset:{name:"Bucket offset",description:"for non-zero-based buckets"},combine:{name:"Combine series",description:"combine all series into a single histogram"}},Za={id:b.histogram,name:"Histogram",description:"Calculate a histogram from input data",defaultOptions:{fields:{}},operator:(G,N)=>X=>X.pipe((0,O.U)(Te=>Za.transformer(G,N)(Te))),transformer:G=>N=>{if(!Array.isArray(N)||N.length===0)return N;const X=Da(N,G);return X==null?[]:[no(X)]}},Nn="xMin";function Ga(G){return G===Nn||G==="BucketMin"}const Pa="xMax";function fa(G){return G===Pa||G==="BucketMax"}function Ya(G){let N,X;const Te=[];for(const Ve of G.fields)Ga(Ve.name)?N=Ve:fa(Ve.name)?X=Ve:Ve.type===FieldType.number&&Te.push(Ve);if(!X&&N&&N.values.length>1){let Ve=N.values.toArray(),Re=roundDecimals(Ve[1]-Ve[0],6);X=qt(tn({},N),{name:Pa,values:new ArrayVector(Ve.map(Ke=>Ke+Re))})}if(!N&&X&&(X==null?void 0:X.values.length)>1){let Ve=X.values.toArray(),Re=roundDecimals(Ve[1]-Ve[0],6);N=qt(tn({},X),{name:Nn,values:new ArrayVector(Ve.map(Ke=>Ke-Re))})}if(N&&X&&Te.length)return{xMin:N,xMax:X,counts:Te}}const ja=20;function Da(G,N){var X,Te;let Ve=N==null?void 0:N.bucketSize,Re=(X=N==null?void 0:N.bucketOffset)!=null?X:0;if(!Ve||Ve<0){let dt=[];for(const Yt of G)for(const en of Yt.fields)en.type===d.fS.number&&(dt=dt.concat(en.values.toArray()));dt=dt.filter(Yt=>Yt!=null),dt.sort((Yt,en)=>Yt-en);let Bt=1/0;if(dt.length===1)Bt=1;else for(let Yt=1;Yt<dt.length;Yt++){let en=dt[Yt]-dt[Yt-1];en!==0&&(Bt=Math.min(Bt,en))}let Rt=dt[0];const Zt=(dt[dt.length-1]-Rt)/ja;for(let Yt=0;Yt<cn.length;Yt++){let en=cn[Yt];if(Zt<en&&en>=Bt){Ve=en;break}}}const Ke=dt=>Qe(dt-Re,Ve)+Re;let nt=((Te=(""+Ve).match(/\.\d+$/))!=null?Te:["."])[0].length-1,ot=[],ht=[],Tt;for(const dt of G)for(const Bt of dt.fields)if(Bt.type===d.fS.number){let Rt=za(Bt.values.toArray(),Ke,ln,Dn);ot.push(Rt),ht.push(qt(tn({},Bt),{config:qt(tn({},Bt.config),{unit:Bt.config.unit==="short"?"short":void 0})})),!Tt&&Bt.config.unit&&(Tt=Bt.config)}if(!ht.length)return null;let Pt=xe(ot);for(let dt=1;dt<Pt.length;dt++){let Bt=Pt[dt];for(let Rt=0;Rt<Bt.length;Rt++)Bt[Rt]==null&&(Bt[Rt]=0)}const ct={name:Nn,values:new w.G(Pt[0]),type:d.fS.number,state:void 0,config:nt===0?Tt!=null?Tt:{}:qt(tn({},Tt),{decimals:nt})},Mt=qt(tn({},ct),{name:Pa,values:new w.G(Pt[0].map(dt=>dt+Ve))});if(N!=null&&N.combine){const dt=new Array(Pt[0].length).fill(0);for(let Bt=1;Bt<Pt.length;Bt++)for(let Rt=0;Rt<dt.length;Rt++)dt[Rt]+=Pt[Bt][Rt];ht=[qt(tn({},ht[0]),{name:"count",values:new w.G(dt),type:d.fS.number,state:void 0})]}else ht.forEach((dt,Bt)=>{dt.values=new w.G(Pt[Bt+1])});return{xMin:ct,xMax:Mt,counts:ht}}function vn(G,N){return Math.round(G/N)*N}function xa(G,N){return Math.ceil(G/N)*N}function Qe(G,N){return Math.floor(G/N)*N}function za(G,N,X,Te){let Ve=new Map;for(let ot=0;ot<G.length;ot++){let ht=G[ot];ht!=null&&(ht=N(ht));let Tt=Ve.get(ht);Tt?Tt.count++:Ve.set(ht,{value:ht,count:1})}X&&X.forEach(ot=>Ve.delete(ot));let Re=[...Ve.values()];Te&&Re.sort((ot,ht)=>Te(ot.value,ht.value));let Ke=Array(Re.length),nt=Array(Re.length);for(let ot=0;ot<Re.length;ot++)Ke[ot]=Re[ot].value,nt[ot]=Re[ot].count;return[Ke,nt]}function no(G,N){if(!G.xMin.display){const X=(0,En.U_)({field:G.xMin,theme:N!=null?N:(0,Tn.j)()});G.xMin.display=X,G.xMax.display=X}return G.counts[0].display=(0,En.U_)({field:G.counts[0],theme:N!=null?N:(0,Tn.j)()}),{length:G.xMin.values.length,meta:{type:kn.Histogram},fields:[G.xMin,G.xMax,...G.counts]}}var Fa=Object.defineProperty,Na=Object.getOwnPropertySymbols,co=Object.prototype.hasOwnProperty,Wa=Object.prototype.propertyIsEnumerable,_a=Math.pow,Xa=(G,N,X)=>N in G?Fa(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,ao=(G,N)=>{for(var X in N||(N={}))co.call(N,X)&&Xa(G,X,N[X]);if(Na)for(var X of Na(N))Wa.call(N,X)&&Xa(G,X,N[X]);return G};class Ja extends Cn{merge(N){this.props.min=ka("min",this.props.min,N.min),this.props.max=ka("max",this.props.max,N.max)}getConfig(){var N,X;let{isTime:Te,scaleKey:Ve,min:Re,max:Ke,softMin:nt,softMax:ot,range:ht,direction:Tt,orientation:Pt,centeredZero:ct,decimals:Mt}=this.props;const dt=this.props.distribution,Bt=Te?{}:{distr:dt===c.wf.Symlog?4:dt===c.wf.Log?3:dt===c.wf.Ordinal?2:1,log:dt===c.wf.Log||dt===c.wf.Symlog?(N=this.props.log)!=null?N:2:void 0,asinh:dt===c.wf.Symlog?(X=this.props.linearThreshold)!=null?X:1:void 0};if(dt===c.wf.Log){let Qn=this.props.log,Pn=Qn===2?Math.log2:Math.log10;Re!=null&&(Re<=0?Re=null:Re=_a(Qn,Math.floor(Pn(Re)))),Ke!=null&&(Ke<=0?Ke=null:Ke=_a(Qn,Math.ceil(Pn(Ke)))),nt!=null&&(nt<=0?nt=null:nt=_a(Qn,Math.floor(Pn(nt)))),ot!=null&&(ot<=0?ot=null:ot=_a(Qn,Math.ceil(Pn(ot))))}let Rt=nt==null?3:1,Ft=ot==null?3:1;const Dt={min:{pad:.1,hard:Re!=null?Re:-1/0,soft:nt||0,mode:Rt},max:{pad:.1,hard:Ke!=null?Ke:1/0,soft:ot||0,mode:Ft}};let Zt=nt==null&&Re!=null,Yt=ot==null&&Ke!=null,en=Zt&&Yt;const In=(Qn,Pn,oa,ga)=>{var ha;const ea=Qn.scales[ga];let pn=[Pn,oa];if(!en&&Pn==null&&oa==null)return pn;let $a=(ha=ea.log)!=null?ha:10;if(ea.distr===1||ea.distr===2||ea.distr===4){if(ct){let Ra=Math.abs(Pn),jo=Math.abs(oa),Oo=Math.max(Ra,jo);Pn=-Oo,oa=Oo}ea.distr===4?pn=E.Z.rangeAsinh(Pn,oa,$a,!0):pn=E.Z.rangeNum(Zt?Re:Pn,Yt?Ke:oa,Dt)}else ea.distr===3&&(pn=E.Z.rangeLog(Re!=null?Re:Pn,Ke!=null?Ke:oa,$a,!0));if(Mt===0)if(ea.distr===1||ea.distr===2)pn[0]=Qe(pn[0],1),pn[1]=xa(pn[1],1);else if(ea.distr===3){let Ra=ea.log===2?Math.log2:Math.log10;if(pn[0]<=1)pn[0]=1;else{let Oo=Math.floor(Ra(pn[0]));pn[0]=_a($a,Oo)}let jo=Math.ceil(Ra(pn[1]));pn[1]=_a($a,jo),pn[0]===pn[1]&&(pn[1]*=$a)}else ea.distr===4&&(pn[0]=Qe(pn[0],1),pn[1]=xa(pn[1],1));return(ea.distr===1||ea.distr===4)&&(Zt&&(pn[0]=Re),Yt&&(pn[1]=Ke)),pn[0]>=pn[1]&&(pn[0]=ea.distr===3?1:0,pn[1]=100),pn};let Jn=!Te&&!en;return(0,ya.br)(Ve)&&(Jn=!1,ht=[0,1]),{[Ve]:ao({time:Te,auto:Jn,range:ht!=null?ht:In,dir:Tt,ori:Pt},Bt)}}}function ka(G,N,X){const Te=N!=null,Ve=X!=null;return Te?Ve?G==="min"?N<X?N:X:N>X?N:X:N:X}const aa=12,oo=8;class Va extends Cn{merge(N){this.props.size=ka("max",this.props.size,N.size),this.props.label||(this.props.label=N.label),this.props.placement===c.LB.Auto&&(this.props.placement=N.placement)}calculateSpace(N,X,Te,Ve,Re){const Ke=N.axes[X],nt=N.scales[Ke.scale];if(Ke.side!==2||!nt)return 30;const ot=40;if(nt.time){const ht=Re/ot,Tt=(Ve-Te)/ht,Pt=dn(N,[Te],X,ot,Tt);return(0,an.X1)(Pt[0],aa).width+18}return ot}calculateAxisSize(N,X,Te){const Ve=N.axes[Te];let Re=Ve.ticks.size;if(Ve.side===2)Re+=Ve.gap+aa;else if(X!=null&&X.length){let Ke=X.reduce((ot,ht)=>Math.max(ot,(0,an.X1)(ht,aa).width),0);const nt=Math.min(N.width*.4,Ke);Re+=Ve.gap+Ve.labelGap+nt}return Math.ceil(Re)}getConfig(){let{scaleKey:N,label:X,show:Te=!0,placement:Ve=c.LB.Auto,grid:Re={show:!0},ticks:Ke,space:nt,filter:ot,gap:ht=5,formatValue:Tt,splits:Pt,values:ct,incrs:Mt,isTime:dt,timeZone:Bt,theme:Rt,tickLabelRotation:Ft,size:Dt,color:Zt,border:Yt,decimals:en,distr:In=c.wf.Linear}=this.props;const Jn=`${aa}px ${Rt.typography.fontFamily}`,Qn=Rt.isDark?"rgba(240, 250, 255, 0.09)":"rgba(0, 10, 23, 0.09)";(0,ya.br)(N)&&(Pt=[0,1]),en===0&&In===c.wf.Linear&&(ot=(oa,ga)=>ga.map(ha=>Number.isInteger(ha)?ha:null));let Pn={scale:N,show:Te,stroke:Zt!=null?Zt:Rt.colors.text.primary,side:On(Ve),font:Jn,size:Dt!=null?Dt:(oa,ga,ha)=>this.calculateAxisSize(oa,ga,ha),rotate:Ft,gap:ht,labelGap:0,grid:{show:Re.show,stroke:Qn,width:1/devicePixelRatio},ticks:Object.assign({show:!0,stroke:Qn,width:1/devicePixelRatio,size:4},Ke),splits:Pt,values:ct,space:nt!=null?nt:(oa,ga,ha,ea,pn)=>this.calculateSpace(oa,ga,ha,ea,pn),filter:ot,incrs:Mt};return Yt!=null&&(Pn.border=Yt),X!=null&&X.length>0&&(Pn.label=X,Pn.labelSize=aa+oo,Pn.labelFont=Jn,Pn.labelGap=oo),ct?Pn.values=ct:dt?Pn.values=dn:Tt&&(Pn.values=(oa,ga,ha,ea,pn)=>{let $a=Ge(Ne(pn,6));return ga.map(Ra=>Tt(Ra,$a>0?$a:void 0))}),Pn.timeZone=Bt,Pn}}const ca={second:1e3,minute:60*1e3,hour:60*60*1e3,day:24*60*60*1e3,month:28*24*60*60*1e3,year:365*24*60*60*1e3};function dn(G,N,X,Te,Ve){var Re,Ke;const nt=G.axes[X].timeZone,ot=G.scales.x,ht=((Re=ot==null?void 0:ot.max)!=null?Re:0)-((Ke=ot==null?void 0:ot.min)!=null?Ke:0),Tt=Math.round(ca.year/ca.day)*ca.day,Pt=Math.round(Ve/ca.day)*ca.day;let ct=Et.U6.interval.year;return Ve<ca.second?ct=Et.U6.interval.millisecond:Ve<=ca.minute?ct=Et.U6.interval.second:ht<=ca.day?ct=Et.U6.interval.minute:Ve<=ca.day?ct=Et.U6.interval.hour:ht<ca.year?ct=Et.U6.interval.day:Pt===Tt?ct=Et.U6.interval.year:Ve<=ca.year&&(ct=Et.U6.interval.month),N.map(Mt=>Mt==null?"":(0,Jt.dq)(Mt,{format:ct,timeZone:nt}))}function On(G){switch(G){case c.LB.Top:return 0;case c.LB.Right:return 1;case c.LB.Bottom:return 2;case c.LB.Left:}return 3}var bn=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/fieldColor.ts"),Mn=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts"),Sa=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js"),Yn=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/thresholds.ts");function Ca(G,N,X){let Te=0,Ve=0,Re=0,Ke=0;return G===Xn.Down?(Ve=N.top,Ke=N.top+N.height):G===Xn.Left?(Te=N.left+N.width,Re=N.left):G===Xn.Up?(Ve=N.top+N.height,Ke=N.top):G===Xn.Right&&(Te=N.left,Re=N.left+N.width),X.createLinearGradient(Te,Ve,Re,Ke)}function Qa(G,N){return(X,Te)=>{const Ve=(0,an.AE)(),Re=Ca(X.scales.x.ori===c.wN.Horizontal?Xn.Down:Xn.Left,X.bbox,Ve);return Re.addColorStop(0,Mn.Fq(G,N)),Re.addColorStop(1,Mn.Fq(G,0)),Re}}function Ha(G,N,X){return(Te,Ve)=>{const Re=(0,an.AE)(),Ke=Ca(Te.scales.x.ori===c.wN.Horizontal?Xn.Down:Xn.Left,Te.bbox,Re),nt=(0,Sa.Z)(G).spin(-15),ot=(0,Sa.Z)(G).spin(15);return X.isDark?(Ke.addColorStop(0,ot.lighten(10).setAlpha(N).toString()),Ke.addColorStop(1,nt.darken(10).setAlpha(N).toString())):(Ke.addColorStop(0,ot.lighten(10).setAlpha(N).toString()),Ke.addColorStop(1,nt.setAlpha(N).toString())),Ke}}var Xn=(G=>(G[G.Right=0]="Right",G[G.Up=1]="Up",G[G.Left=2]="Left",G[G.Down=3]="Down",G))(Xn||{});function Ia(G,N,X,Te=!1){let Ve=G.scales[N],Re=null,Ke=null;for(let Zt=0;Zt<X.length;Zt++){let Yt=X[Zt][0];if((Yt<=Ve.min||Re==null)&&(Re=Zt),Ke=Zt,Yt>=Ve.max)break}if(Re===Ke)return X[Re][1];let nt=X[Re][0],ot=X[Ke][0];nt===-1/0&&(nt=Ve.min),ot===1/0&&(ot=Ve.max);let ht=Math.round(G.valToPos(nt,N,!0)),Tt=Math.round(G.valToPos(ot,N,!0)),Pt=ht-Tt;if(Pt===0)return X[Ke][1];let ct,Mt,dt,Bt;G.scales.x.ori===c.wN.Horizontal?(ct=dt=0,Mt=ht,Bt=Tt):(Mt=Bt=0,ct=ht,dt=Tt);let Ft=(0,an.AE)().createLinearGradient(ct,Mt,dt,Bt),Dt;for(let Zt=Re;Zt<=Ke;Zt++){let Yt=X[Zt],en=Zt===Re?ht:Zt===Ke?Tt:Math.round(G.valToPos(Yt[0],N,!0)),In=(ht-en)/Pt;Te&&Zt>Re&&Ft.addColorStop(In,Dt),Ft.addColorStop(In,Dt=Yt[1])}return Ft}function ro(G,N){let X=G.scales[N],Te=1/0,Ve=-1/0;return G.series.forEach((Re,Ke)=>{if(Re.show&&Re.scale===N)if(Re.min==null){let nt=G.data[Ke];for(let ot=0;ot<nt.length;ot++)nt[ot]!=null&&(Te=Math.min(Te,nt[ot]),Ve=Math.max(Ve,nt[ot]))}else Te=Math.min(Te,Re.min),Ve=Math.max(Ve,Re.max)}),Ve===Te&&(Te=X.min,Ve=X.max),[Te,Ve]}function eo(G,N,X,Te,Ve,Re){var Ke,nt,ot,ht;let Tt=(Ke=X!=null?X:Ve)!=null?Ke:null,Pt=(nt=Te!=null?Te:Re)!=null?nt:null;if(Tt==null||Pt==null){let[ct,Mt]=ro(G,N);Tt=(ot=Tt!=null?Tt:ct)!=null?ot:0,Pt=(ht=Pt!=null?Pt:Mt)!=null?ht:100}return[Tt,Pt]}function io(G,N,X,Te,Ve,Re,Ke,nt){if(!X)throw Error("Missing colorMode required for color scheme gradients");if(!Te)throw Error("Missing thresholds required for color scheme gradients");return(ot,ht)=>{let Tt=ot.series[ht].scale,Pt="";if(X.id===bn.S.Thresholds)if(Te.mode===Yn.H.Absolute){const ct=Te.steps.map(Mt=>[Mt.value,Mn.Fq(N.visualization.getColorByName(Mt.color),G)]);Pt=Ia(ot,Tt,ct,!0)}else{const[ct,Mt]=eo(ot,Tt,Ve,Re,Ke,nt),dt=Mt-ct,Bt=Te.steps.map(Rt=>[ct+dt*(Rt.value/100),Mn.Fq(N.visualization.getColorByName(Rt.color),G)]);Pt=Ia(ot,Tt,Bt,!0)}else if(X.getColors){const ct=X.getColors(N),[Mt,dt]=eo(ot,Tt,Ve,Re,Ke,nt),Bt=dt-Mt,Rt=ct.map((Ft,Dt)=>[Mt+Bt*(Dt/(ct.length-1)),Mn.Fq(N.visualization.getColorByName(Ft),G)]);Pt=Ia(ot,Tt,Rt,!1)}return Pt}}var Ua=Object.defineProperty,Oa=Object.getOwnPropertySymbols,vo=Object.prototype.hasOwnProperty,Ma=Object.prototype.propertyIsEnumerable,bo=(G,N,X)=>N in G?Ua(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,yo=(G,N)=>{for(var X in N||(N={}))vo.call(N,X)&&bo(G,X,N[X]);if(Oa)for(var X of Oa(N))Ma.call(N,X)&&bo(G,X,N[X]);return G};class yn extends Cn{getConfig(){var N;const{facets:X,drawStyle:Te,pathBuilder:Ve,pointsBuilder:Re,pointsFilter:Ke,lineInterpolation:nt,lineWidth:ot,lineStyle:ht,barAlignment:Tt,barWidthFactor:Pt,barMaxWidth:ct,showPoints:Mt,pointSize:dt,scaleKey:Bt,pxAlign:Rt,spanNulls:Ft,show:Dt=!0}=this.props;let Zt={},Yt=this.getLineColor();Zt.stroke=Yt,Ve!=null?(Zt.paths=Ve,Zt.width=ot):Te===c.l8.Points?Zt.paths=()=>null:Te!=null&&(Zt.width=ot,ht&&ht.fill!=="solid"&&(ht.fill==="dot"&&(Zt.cap="round"),Zt.dash=(N=ht.dash)!=null?N:[10,10]),Zt.paths=(Jn,Qn,Pn,oa)=>La(Te,nt,Tt,Pt,ct)(Jn,Qn,Pn,oa));const en=typeof Yt=="string"?Yt:(Jn,Qn)=>Jn.series[Qn]._stroke,In={points:{stroke:en,fill:en,size:!dt||dt<ot?void 0:dt,filter:Ke}};return Re!=null?In.points.show=Re:Te===c.l8.Points?In.points.show=!0:Mt===c.Jp.Auto?Te===c.l8.Bars&&(In.points.show=!1):Mt===c.Jp.Never?In.points.show=!1:Mt===c.Jp.Always&&(In.points.show=!0),yo(yo({scale:Bt,facets:X,spanGaps:typeof Ft=="number"?!1:Ft,value:()=>"",pxAlign:Rt,show:Dt,fill:this.getFill()},Zt),In)}getLineColor(){const{lineColor:N,gradientMode:X,colorMode:Te,thresholds:Ve,theme:Re,hardMin:Ke,hardMax:nt,softMin:ot,softMax:ht,dynamicSeriesColor:Tt}=this.props;return X===c.FI.None&&Tt?(Pt,ct)=>{var Mt,dt;return(dt=(Mt=Tt(ct))!=null?Mt:N)!=null?dt:bn.R}:X===c.FI.Scheme&&(Te==null?void 0:Te.id)!==bn.S.Fixed?io(1,Re,Te,Ve,Ke,nt,ot,ht):N!=null?N:bn.R}getFill(){const{lineColor:N,fillColor:X,gradientMode:Te,fillOpacity:Ve,colorMode:Re,thresholds:Ke,theme:nt,hardMin:ot,hardMax:ht,softMin:Tt,softMax:Pt,dynamicSeriesColor:ct}=this.props;if(X)return X;const Mt=Te!=null?Te:c.FI.None,dt=(Ve!=null?Ve:0)/100;if(Mt===c.FI.None&&ct&&dt>0)return(Bt,Rt)=>{let Ft=Bt.series[Rt]._stroke;return Mn.Fq(Ft!=null?Ft:"",dt)};switch(Mt){case c.FI.Opacity:return Qa(X!=null?X:N,dt);case c.FI.Hue:return Ha(X!=null?X:N,dt,nt);case c.FI.Scheme:if((Re==null?void 0:Re.id)!==bn.S.Fixed)return io(dt,nt,Re,Ke,ot,ht,Tt,Pt);default:if(dt>0)return Mn.Fq(N!=null?N:"",dt)}}}let Un;function La(G,N,X=0,Te=.6,Ve=200){const Re=E.Z.paths;if(Un||(Un={linear:Re.linear(),smooth:Re.spline(),stepBefore:Re.stepped({align:-1}),stepAfter:Re.stepped({align:1})}),G===c.l8.Bars){let Ke=`bars|${X}|${Te}|${Ve}`;return Un[Ke]||(Un[Ke]=Re.bars({size:[Te,Ve],align:X})),Un[Ke]}else if(G===c.l8.Line){if(N===c.KC.StepBefore)return Un.stepBefore;if(N===c.KC.StepAfter)return Un.stepAfter;if(N===c.KC.Smooth)return Un.smooth}return Un.linear}var To=Object.defineProperty,uo=Object.defineProperties,Po=Object.getOwnPropertyDescriptors,xo=Object.getOwnPropertySymbols,po=Object.prototype.hasOwnProperty,Go=Object.prototype.propertyIsEnumerable,Do=(G,N,X)=>N in G?To(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,_o=(G,N)=>{for(var X in N||(N={}))po.call(N,X)&&Do(G,X,N[X]);if(xo)for(var X of xo(N))Go.call(N,X)&&Do(G,X,N[X]);return G},Yo=(G,N)=>uo(G,Po(N));function Xo(G){const N=G.config.mode===c.i3.Dashed||G.config.mode===c.i3.DashedAndArea?[10,10]:null;function X(ct,Mt,dt,Bt){let Rt=ct.ctx,Ft=0;for(let Dt=0;Dt<dt.length;Dt++)if(dt[Dt].color==="transparent"){Ft=Dt;break}Rt.lineWidth=2,N&&Rt.setLineDash(N);for(let Dt=1;Dt<dt.length;Dt++){const Zt=dt[Dt];let Yt;Ft>=Dt&&Dt>0?Yt=(0,Sa.Z)(Bt.visualization.getColorByName(dt[Dt-1].color)):Yt=(0,Sa.Z)(Bt.visualization.getColorByName(Zt.color)),Yt.getAlpha()===1&&Yt.setAlpha(.7);let en=Math.round(ct.bbox.left),In=Math.round(ct.valToPos(Zt.value,Mt,!0)),Jn=Math.round(ct.bbox.left+ct.bbox.width),Qn=Math.round(ct.valToPos(Zt.value,Mt,!0));Rt.beginPath(),Rt.moveTo(en,In),Rt.lineTo(Jn,Qn),Rt.strokeStyle=Yt.toString(),Rt.stroke()}}function Te(ct,Mt,dt,Bt){let Rt=ct.ctx,Ft=Ia(ct,Mt,dt.map(Dt=>{let Zt=(0,Sa.Z)(Bt.visualization.getColorByName(Dt.color));return Zt.getAlpha()===1&&Zt.setAlpha(.15),[Dt.value,Zt.toString()]}),!0);Rt.fillStyle=Ft,Rt.fillRect(ct.bbox.left,ct.bbox.top,ct.bbox.width,ct.bbox.height)}const{scaleKey:Ve,thresholds:Re,theme:Ke,config:nt,hardMin:ot,hardMax:ht,softMin:Tt,softMax:Pt}=G;return ct=>{const Mt=ct.ctx,{min:dt,max:Bt}=ct.scales.x,{min:Rt,max:Ft}=ct.scales[Ve];if(dt==null||Bt==null||Rt==null||Ft==null)return;let{steps:Dt,mode:Zt}=Re;if(Zt===Yn.H.Percentage){let[Yt,en]=eo(ct,Ve,ot,ht,Tt,Pt),In=en-Yt;Dt=Dt.map(Jn=>Yo(_o({},Jn),{value:Yt+In*(Jn.value/100)}))}switch(Mt.save(),nt.mode){case c.i3.Line:case c.i3.Dashed:X(ct,Ve,Dt,Ke);break;case c.i3.Area:Te(ct,Ve,Dt,Ke);break;case c.i3.LineAndArea:case c.i3.DashedAndArea:Te(ct,Ve,Dt,Ke),X(ct,Ve,Dt,Ke)}Mt.restore()}}var Jo=Object.defineProperty,zo=Object.defineProperties,Qo=Object.getOwnPropertyDescriptors,Fo=Object.getOwnPropertySymbols,No=Object.prototype.hasOwnProperty,Wo=Object.prototype.propertyIsEnumerable,ko=(G,N,X)=>N in G?Jo(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,Ka=(G,N)=>{for(var X in N||(N={}))No.call(N,X)&&ko(G,X,N[X]);if(Fo)for(var X of Fo(N))Wo.call(N,X)&&ko(G,X,N[X]);return G},er=(G,N)=>zo(G,Qo(N));const Ho={drag:{setScale:!1},points:{size:(G,N)=>G.series[N].points.size*2,width:(G,N,X)=>X/4},focus:{prox:30}};class tr{constructor(N=ma.Ys){this.series=[],this.axes={},this.scales=[],this.bands=[],this.stackingGroups=[],this.hasLeftAxis=!1,this.hooks={},this.tz=void 0,this.sync=!1,this.mode=1,this.frames=void 0,this.thresholds={},this.tooltipInterpolator=void 0,this.padding=void 0,this.prepData=void 0,this.scaleKeys=["",""],this.tzDate=Te=>{let Ve=new Date(Te);return this.tz?E.Z.tzDate(Ve,this.tz):Ve};var X;this.tz=(X=(0,Ta.Pr)(N,Date.now()))==null?void 0:X.ianaName}addHook(N,X){rn("UPlotConfigBuilder",!1,"addHook",N),this.hooks[N]||(this.hooks[N]=[]),this.hooks[N].push(X)}addThresholds(N){this.thresholds[N.scaleKey]||(this.thresholds[N.scaleKey]=N,this.addHook("drawClear",Xo(N)))}addAxis(N){var X,Te,Ve;N.placement=(X=N.placement)!=null?X:c.LB.Auto,N.grid=(Te=N.grid)!=null?Te:{};let Re=N.scaleKey;if(Re==="x"&&(Re+=(Ve=N.timeZone)!=null?Ve:""),this.axes[Re]){this.axes[Re].merge(N);return}N.placement===c.LB.Auto&&(N.placement=this.hasLeftAxis?c.LB.Right:c.LB.Left),N.placement===c.LB.Left&&(this.hasLeftAxis=!0),N.placement===c.LB.Hidden&&(N.grid.show=!1,N.size=0),this.axes[Re]=new Va(N)}getAxisPlacement(N){var X;const Te=this.axes[N];return(X=Te==null?void 0:Te.props.placement)!=null?X:c.LB.Left}setCursor(N){this.cursor=(0,t.merge)({},this.cursor,N)}setMode(N){this.mode=N}setSelect(N){this.select=N}addSeries(N){this.series.push(new yn(N))}getSeries(){return this.series}addScale(N){const X=this.scales.find(Te=>Te.props.scaleKey===N.scaleKey);if(X){X.merge(N);return}this.scales.push(new Ja(N))}addBand(N){this.bands.push(N)}setStackingGroups(N){this.stackingGroups=N}getStackingGroups(){return this.stackingGroups}setTooltipInterpolator(N){this.tooltipInterpolator=N}getTooltipInterpolator(){return this.tooltipInterpolator}setPrepData(N){this.prepData=X=>(this.frames=X,N(X,this.getStackingGroups()))}setSync(){this.sync=!0}hasSync(){return this.sync}setPadding(N){this.padding=N}getConfig(){const N=er(Ka({},yt),{mode:this.mode,series:[this.mode===2?null:{value:()=>""}]});N.axes=this.ensureNonOverlappingAxes(Object.values(this.axes)).map(Te=>Te.getConfig()),N.series=[...N.series,...this.series.map(Te=>Te.getConfig())],N.scales=this.scales.reduce((Te,Ve)=>Ka(Ka({},Te),Ve.getConfig()),{}),N.hooks=this.hooks,N.select=this.select;const X=(Te="")=>(Ve,Re)=>{let Ke=Ve.series[Re].points._stroke;if(typeof Ke!="string"){let nt=this.frames[0].fields[Re];Ke=nt.display(nt.values.get(Ve.cursor.idxs[Re])).color}return Ke+Te};return N.cursor=(0,t.merge)({},Ho,{points:{stroke:X("80"),fill:X()}},this.cursor),N.tzDate=this.tzDate,Array.isArray(this.padding)&&(N.padding=this.padding),this.stackingGroups.length&&this.stackingGroups.forEach(Te=>{It(Te).forEach(Ve=>{this.addBand(Ve)})}),this.bands.length&&(N.bands=this.bands),N}ensureNonOverlappingAxes(N){const X=N.find(Re=>Re.props.scaleKey==="x"),Te=N.filter(Re=>{var Ke;return((Ke=Re.props.grid)==null?void 0:Ke.show)===void 0}),Ve=Te.findIndex(Re=>Re.props.placement===c.LB.Left||Re.props.placement===c.LB.Right||Re.props.placement===c.LB.Bottom&&Re!==X);for(let Re=0;Re<Te.length;Re++)Te[Re]===X||Re===Ve?Te[Re].props.grid.show=!0:Te[Re].props.grid.show=!1;return N}}var nr=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/vector/FunctionalVector.ts");class wo extends nr.G{constructor(N){super(),this.len=N}get length(){return this.len}get(N){return N}static newField(N){return{name:"",values:new wo(N),type:d.fS.number,config:{min:0,max:N-1}}}}var ar=Object.defineProperty,So=Object.defineProperties,or=Object.getOwnPropertyDescriptors,Uo=Object.getOwnPropertySymbols,rr=Object.prototype.hasOwnProperty,ir=Object.prototype.propertyIsEnumerable,Io=(G,N,X)=>N in G?ar(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,Mo=(G,N)=>{for(var X in N||(N={}))rr.call(N,X)&&Io(G,X,N[X]);if(Uo)for(var X of Uo(N))ir.call(N,X)&&Io(G,X,N[X]);return G},lr=(G,N)=>So(G,or(N));function Bo(G,N){var X;const Te=G.y.values.length,Ve=Mo(Mo({},G.y.config),N);return Ot({frame:{refId:"sparkline",fields:[(X=G.x)!=null?X:wo.newField(Te),lr(Mo({},G.y),{config:Ve})],length:Te}})}var mo=Object.defineProperty,Ao=Object.defineProperties,sr=Object.getOwnPropertyDescriptors,lo=Object.getOwnPropertySymbols,cr=Object.prototype.hasOwnProperty,dr=Object.prototype.propertyIsEnumerable,so=(G,N,X)=>N in G?mo(G,N,{enumerable:!0,configurable:!0,writable:!0,value:X}):G[N]=X,fo=(G,N)=>{for(var X in N||(N={}))cr.call(N,X)&&so(G,X,N[X]);if(lo)for(var X of lo(N))dr.call(N,X)&&so(G,X,N[X]);return G},ur=(G,N)=>Ao(G,sr(N));const pr={drawStyle:c.l8.Line,showPoints:c.Jp.Auto,axisPlacement:c.LB.Hidden,pointSize:2};class Co extends n.PureComponent{constructor(N){super(N);const X=Bo(N.sparkline,N.config);this.state={data:zt(X,Lt(X)),alignedDataFrame:X,configBuilder:this.prepareConfig(X)}}static getDerivedStateFromProps(N,X){const Te=Bo(N.sparkline,N.config);return Te?ur(fo({},X),{data:zt(Te,Lt(Te)),alignedDataFrame:Te}):fo({},X)}componentDidUpdate(N,X){const{alignedDataFrame:Te}=this.state;if(!Te)return;let Ve=!1;N.sparkline!==this.props.sparkline?Ve=!a(this.state.alignedDataFrame,X.alignedDataFrame):Ve=!(0,t.isEqual)(N.config,this.props.config),Ve&&this.setState({configBuilder:this.prepareConfig(Te)})}getYRange(N){var X,Te,Ve;let{min:Re,max:Ke}=(X=this.state.alignedDataFrame.fields[1].state)==null?void 0:X.range;return Re===Ke?(Re===0?Ke=100:(Re=0,Ke*=2),[Re,Ke]):[Math.max(Re,(Te=N.config.min)!=null?Te:-1/0),Math.min(Ke,(Ve=N.config.max)!=null?Ve:1/0)]}prepareConfig(N){var X;const{theme:Te}=this.props,Ve=new tr;Ve.setCursor({show:!1,x:!1,y:!1});const Re=N.fields[0];Ve.addScale({scaleKey:"x",orientation:c.wN.Horizontal,direction:c.bQ.Right,isTime:!1,range:()=>{const{sparkline:Ke}=this.props;if(Ke.x){if(Ke.timeRange&&Ke.x.type===d.fS.time)return[Ke.timeRange.from.valueOf(),Ke.timeRange.to.valueOf()];const nt=Ke.x.values;return[nt.get(0),nt.get(nt.length-1)]}return[0,Ke.y.values.length-1]}}),Ve.addAxis({scaleKey:"x",theme:Te,placement:c.LB.Hidden});for(let Ke=0;Ke<N.fields.length;Ke++){const nt=N.fields[Ke],ot=nt.config,ht=fo(fo({},pr),ot.custom);if(nt===Re||nt.type!==d.fS.number)continue;const Tt=ot.unit||"__fixed";Ve.addScale({scaleKey:Tt,orientation:c.wN.Vertical,direction:c.bQ.Up,range:()=>this.getYRange(nt)}),Ve.addAxis({scaleKey:Tt,theme:Te,placement:c.LB.Hidden});const Pt=(0,i.fD)(nt),ct=Pt.getCalculator(nt,Te)(0,0),Mt=ht.drawStyle===c.l8.Points?c.Jp.Always:ht.showPoints;Ve.addSeries({pxAlign:!1,scaleKey:Tt,theme:Te,colorMode:Pt,thresholds:ot.thresholds,drawStyle:ht.drawStyle,lineColor:(X=ht.lineColor)!=null?X:ct,lineWidth:ht.lineWidth,lineInterpolation:ht.lineInterpolation,showPoints:Mt,pointSize:ht.pointSize,fillOpacity:ht.fillOpacity,fillColor:ht.fillColor,lineStyle:ht.lineStyle,gradientMode:ht.gradientMode})}return Ve}render(){const{data:N,configBuilder:X}=this.state,{width:Te,height:Ve,sparkline:Re}=this.props;return n.createElement(gn,{data:N,config:X,width:Te,height:Ve,timeRange:Re.timeRange})}}try{Co.displayName="Sparkline",Co.__docgenInfo={description:"",displayName:"Sparkline",props:{width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},config:{defaultValue:null,description:"",name:"config",required:!1,type:{name:"FieldConfig<GraphFieldConfig>"}},sparkline:{defaultValue:null,description:"",name:"sparkline",required:!0,type:{name:"FieldSparkline"}},theme:{defaultValue:null,description:"",name:"theme",required:!0,type:{name:"GrafanaTheme2"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Sparkline/Sparkline.tsx#Sparkline"]={docgenInfo:Co.__docgenInfo,name:"Sparkline",path:"src/components/Sparkline/Sparkline.tsx#Sparkline"})}catch(G){}},"./src/components/Spinner/Spinner.tsx":function(se,V,e){"use strict";e.d(V,{$:function(){return x}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/stylesFactory.ts"),l=e("./src/components/Icon/Icon.tsx");const f=(0,a.B)((d,i)=>({wrapper:t.iv`
      font-size: ${d}px;
      ${i?t.iv`
            display: inline-block;
          `:""}
    `})),x=({className:d,inline:i=!1,iconClassName:c,style:E,size:O=16})=>{const m=f(O,i);return n.createElement("div",{"data-testid":"Spinner",style:E,className:(0,t.cx)(m.wrapper,d)},n.createElement(l.J,{className:(0,t.cx)("fa-spin",c),name:"fa fa-spinner"}))};try{x.displayName="Spinner",x.__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:"16"},description:"",name:"size",required:!1,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Spinner/Spinner.tsx#Spinner"]={docgenInfo:x.__docgenInfo,name:"Spinner",path:"src/components/Spinner/Spinner.tsx#Spinner"})}catch(d){}},"./src/components/Switch/Switch.tsx":function(se,V,e){"use strict";e.d(V,{x:function(){return h},r:function(){return y}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js");const l={},f=(o,r,u)=>{let p=`[Deprecation warning] ${o}: ${r} is deprecated`;u&&(p+=`. Use ${u} instead`);const S=Date.now(),k=l[p];(!k||S-k>1e4)&&(console.warn(p),l[p]=S)};var x=e("./src/themes/ThemeContext.tsx"),d=e("./src/themes/stylesFactory.ts"),i=e("./src/themes/mixins.ts"),c=Object.defineProperty,E=Object.defineProperties,O=Object.getOwnPropertyDescriptors,m=Object.getOwnPropertySymbols,w=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable,C=(o,r,u)=>r in o?c(o,r,{enumerable:!0,configurable:!0,writable:!0,value:u}):o[r]=u,b=(o,r)=>{for(var u in r||(r={}))w.call(r,u)&&C(o,u,r[u]);if(m)for(var u of m(r))_.call(r,u)&&C(o,u,r[u]);return o},g=(o,r)=>E(o,O(r)),v=(o,r)=>{var u={};for(var p in o)w.call(o,p)&&r.indexOf(p)<0&&(u[p]=o[p]);if(o!=null&&m)for(var p of m(o))r.indexOf(p)<0&&_.call(o,p)&&(u[p]=o[p]);return u};const y=a.forwardRef((o,r)=>{var u=o,{value:p,checked:S,onChange:k,id:D,label:M,disabled:I}=u,T=v(u,["value","checked","onChange","id","label","disabled"]);S&&f("Switch","checked prop","value");const j=(0,x.l4)(),K=s(j),F=(0,a.useRef)(D||(0,n.uniqueId)("switch-"));return a.createElement("div",{className:(0,t.cx)(K.switch)},a.createElement("input",g(b({type:"checkbox",disabled:I,checked:p,onChange:$=>{!I&&(k==null||k($))},id:F.current},T),{ref:r})),a.createElement("label",{htmlFor:F.current,"aria-label":M!=null?M:"Toggle switch"}))});y.displayName="Switch";const h=a.forwardRef((o,r)=>{var u=o,{transparent:p,className:S,showLabel:k,label:D,value:M,id:I}=u,T=v(u,["transparent","className","showLabel","label","value","id"]);const j=(0,x.l4)(),K=s(j,p);return a.createElement("div",{className:(0,t.cx)(K.inlineContainer,S,T.disabled&&K.disabled)},k&&a.createElement("label",{htmlFor:I,className:(0,t.cx)(K.inlineLabel,M&&K.inlineLabelEnabled,"inline-switch-label")},D),a.createElement(y,g(b({},T),{id:I,label:D,ref:r,value:M})))});h.displayName="Switch";const s=(0,d.B)((o,r)=>({switch:t.iv`
      width: 32px;
      height: 16px;
      position: relative;

      input {
        opacity: 0;
        left: -100vw;
        z-index: -1000;
        position: absolute;

        &:disabled + label {
          background: ${o.colors.action.disabledBackground};
          cursor: not-allowed;
        }

        &:checked + label {
          background: ${o.colors.primary.main};
          border-color: ${o.colors.primary.main};

          &:hover {
            background: ${o.colors.primary.shade};
          }

          &::after {
            transform: translate3d(18px, -50%, 0);
            background: ${o.colors.primary.contrastText};
          }
        }

        &:focus + label,
        &:focus-visible + label {
          ${(0,i.SV)(o)}
        }

        &:focus:not(:focus-visible) + label {
          ${(0,i.Cq)(o)}
        }
      }

      label {
        width: 100%;
        height: 100%;
        cursor: pointer;
        border: none;
        border-radius: ${o.shape.radius.pill};
        background: ${o.components.input.background};
        border: 1px solid ${o.components.input.borderColor};
        transition: all 0.3s ease;

        &:hover {
          border-color: ${o.components.input.borderHover};
        }

        &::after {
          position: absolute;
          display: block;
          content: '';
          width: 12px;
          height: 12px;
          border-radius: ${o.shape.radius.circle};
          background: ${o.colors.text.secondary};
          box-shadow: ${o.shadows.z1};
          top: 50%;
          transform: translate3d(2px, -50%, 0);
          transition: transform 0.2s cubic-bezier(0.19, 1, 0.22, 1);
        }
      }
    `,inlineContainer:t.iv`
      padding: ${o.spacing(0,1)};
      height: ${o.spacing(o.components.height.md)};
      display: inline-flex;
      align-items: center;
      background: ${r?"transparent":o.components.input.background};
      border: 1px solid ${r?"transparent":o.components.input.borderColor};
      border-radius: ${o.shape.borderRadius()};

      &:hover {
        border: 1px solid ${r?"transparent":o.components.input.borderHover};

        .inline-switch-label {
          color: ${o.colors.text.primary};
        }
      }
    `,disabled:t.iv`
      background-color: rgba(204, 204, 220, 0.04);
      color: rgba(204, 204, 220, 0.6);
      border: 1px solid rgba(204, 204, 220, 0.04);
    `,inlineLabel:t.iv`
      cursor: pointer;
      padding-right: ${o.spacing(1)};
      color: ${o.colors.text.secondary};
      white-space: nowrap;
    `,inlineLabelEnabled:t.iv`
      color: ${o.colors.text.primary};
    `}));try{y.displayName="Switch",y.__docgenInfo={description:"",displayName:"Switch",props:{value:{defaultValue:null,description:"",name:"value",required:!1,type:{name:"boolean"}},transparent:{defaultValue:null,description:"Make switch's background and border transparent",name:"transparent",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Switch/Switch.tsx#Switch"]={docgenInfo:y.__docgenInfo,name:"Switch",path:"src/components/Switch/Switch.tsx#Switch"})}catch(o){}},"./src/components/Tabs/Counter.tsx":function(se,V,e){"use strict";e.d(V,{A:function(){return d}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/valueFormats/valueFormats.ts"),l=e("./src/themes/stylesFactory.ts"),f=e("./src/themes/ThemeContext.tsx");const x=(0,l.B)(i=>({counter:t.iv`
      label: counter;
      margin-left: ${i.spacing(1)};
      border-radius: ${i.spacing(3)};
      background-color: ${i.colors.action.hover};
      padding: ${i.spacing(.25,1)};
      color: ${i.colors.text.secondary};
      font-weight: ${i.typography.fontWeightMedium};
      font-size: ${i.typography.size.sm};
    `})),d=({value:i})=>{const c=(0,f.wW)(x);return n.createElement("span",{className:c.counter},(0,a.SP)(i,0).text)};try{d.displayName="Counter",d.__docgenInfo={description:"",displayName:"Counter",props:{value:{defaultValue:null,description:"",name:"value",required:!0,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tabs/Counter.tsx#Counter"]={docgenInfo:d.__docgenInfo,name:"Counter",path:"src/components/Tabs/Counter.tsx#Counter"})}catch(i){}},"./src/components/Tabs/Tab.tsx":function(se,V,e){"use strict";e.d(V,{O:function(){return v}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../grafana-e2e-selectors/src/selectors/index.ts"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/themes/mixins.ts"),x=e("./src/components/Icon/Icon.tsx"),d=e("./src/components/Tabs/Counter.tsx"),i=Object.defineProperty,c=Object.defineProperties,E=Object.getOwnPropertyDescriptors,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(h,s,o)=>s in h?i(h,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):h[s]=o,C=(h,s)=>{for(var o in s||(s={}))m.call(s,o)&&_(h,o,s[o]);if(O)for(var o of O(s))w.call(s,o)&&_(h,o,s[o]);return h},b=(h,s)=>c(h,E(s)),g=(h,s)=>{var o={};for(var r in h)m.call(h,r)&&s.indexOf(r)<0&&(o[r]=h[r]);if(h!=null&&O)for(var r of O(h))s.indexOf(r)<0&&w.call(h,r)&&(o[r]=h[r]);return o};const v=n.forwardRef((h,s)=>{var o=h,{label:r,active:u,icon:p,onChangeTab:S,counter:k,suffix:D,className:M,href:I}=o,T=g(o,["label","active","icon","onChangeTab","counter","suffix","className","href"]);const j=(0,l.wW)(y),K=()=>n.createElement(n.Fragment,null,p&&n.createElement(x.J,{name:p}),r,typeof k=="number"&&n.createElement(d.A,{value:k}),D&&n.createElement(D,{className:j.suffix})),F=(0,t.cx)(j.link,u?j.activeStyle:j.notActive);return n.createElement("div",{className:j.item},n.createElement("a",b(C({href:I||"#",className:F},T),{onClick:S,"aria-label":T["aria-label"]||a.wl.components.Tab.title(r),role:"tab","aria-selected":u,ref:s}),K()))});v.displayName="Tab";const y=h=>({item:t.iv`
      list-style: none;
      position: relative;
      display: flex;
      white-space: nowrap;
    `,link:t.iv`
      color: ${h.colors.text.secondary};
      padding: ${h.spacing(1.5,2,1)};
      display: block;
      height: 100%;

      svg {
        margin-right: ${h.spacing(1)};
      }

      &:focus-visible {
        ${(0,f.SV)(h)}
      }

      &::before {
        display: block;
        content: ' ';
        position: absolute;
        left: 0;
        right: 0;
        height: 4px;
        border-radius: ${h.shape.radius.default};
        bottom: 0px;
      }
    `,notActive:t.iv`
      a:hover,
      &:hover,
      &:focus {
        color: ${h.colors.text.primary};

        &::before {
          background-color: ${h.colors.action.hover};
        }
      }
    `,activeStyle:t.iv`
      label: activeTabStyle;
      color: ${h.colors.text.primary};
      overflow: hidden;

      a {
        color: ${h.colors.text.primary};
      }

      &::before {
        background-image: ${h.colors.gradients.brandHorizontal};
      }
    `,suffix:t.iv`
      margin-left: ${h.spacing(1)};
    `});try{v.displayName="Tab",v.__docgenInfo={description:"",displayName:"Tab",props:{icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},href:{defaultValue:null,description:"When provided, it is possible to use the tab as a hyperlink. Use in cases where the tabs update location.",name:"href",required:!1,type:{name:"string"}},label:{defaultValue:null,description:"",name:"label",required:!0,type:{name:"string"}},suffix:{defaultValue:null,description:"Extra content, displayed after the tab label and counter",name:"suffix",required:!1,type:{name:"ComponentType<{ className?: string; }>"}},active:{defaultValue:null,description:"",name:"active",required:!1,type:{name:"boolean"}},onChangeTab:{defaultValue:null,description:"",name:"onChangeTab",required:!1,type:{name:"((event?: MouseEvent<HTMLAnchorElement, MouseEvent>) => void)"}},counter:{defaultValue:null,description:"A number rendered next to the text. Usually used to display the number of items in a tab's view.",name:"counter",required:!1,type:{name:"number | null"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tabs/Tab.tsx#Tab"]={docgenInfo:v.__docgenInfo,name:"Tab",path:"src/components/Tabs/Tab.tsx#Tab"})}catch(h){}},"./src/components/Tabs/TabContent.tsx":function(se,V,e){"use strict";e.d(V,{I:function(){return b}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/stylesFactory.ts"),l=e("./src/themes/ThemeContext.tsx"),f=Object.defineProperty,x=Object.defineProperties,d=Object.getOwnPropertyDescriptors,i=Object.getOwnPropertySymbols,c=Object.prototype.hasOwnProperty,E=Object.prototype.propertyIsEnumerable,O=(g,v,y)=>v in g?f(g,v,{enumerable:!0,configurable:!0,writable:!0,value:y}):g[v]=y,m=(g,v)=>{for(var y in v||(v={}))c.call(v,y)&&O(g,y,v[y]);if(i)for(var y of i(v))E.call(v,y)&&O(g,y,v[y]);return g},w=(g,v)=>x(g,d(v)),_=(g,v)=>{var y={};for(var h in g)c.call(g,h)&&v.indexOf(h)<0&&(y[h]=g[h]);if(g!=null&&i)for(var h of i(g))v.indexOf(h)<0&&E.call(g,h)&&(y[h]=g[h]);return y};const C=(0,a.B)(g=>({tabContent:t.iv`
      background: ${g.colors.background.primary};
    `})),b=g=>{var v=g,{children:y,className:h}=v,s=_(v,["children","className"]);const o=(0,l.l4)(),r=C(o);return n.createElement("div",w(m({},s),{className:(0,t.cx)(r.tabContent,h)}),y)};try{b.displayName="TabContent",b.__docgenInfo={description:"",displayName:"TabContent",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tabs/TabContent.tsx#TabContent"]={docgenInfo:b.__docgenInfo,name:"TabContent",path:"src/components/Tabs/TabContent.tsx#TabContent"})}catch(g){}},"./src/components/Tabs/TabsBar.tsx":function(se,V,e){"use strict";e.d(V,{J:function(){return x}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/stylesFactory.ts"),l=e("./src/themes/ThemeContext.tsx");const f=(0,a.B)((d,i=!1)=>({tabsWrapper:!i&&t.iv`
        border-bottom: 1px solid ${d.colors.border.weak};
      `,tabs:t.iv`
      position: relative;
      display: flex;
      height: ${d.components.menuTabs.height}px;
    `})),x=n.forwardRef(({children:d,className:i,hideBorder:c},E)=>{const O=(0,l.l4)(),m=f(O,c);return n.createElement("div",{className:(0,t.cx)(m.tabsWrapper,i),ref:E},n.createElement("div",{className:m.tabs,role:"tablist"},d))});x.displayName="TabsBar";try{x.displayName="TabsBar",x.__docgenInfo={description:"",displayName:"TabsBar",props:{children:{defaultValue:null,description:"Children should be a single <Tab /> or an array of <Tab />",name:"children",required:!0,type:{name:"ReactNode"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},hideBorder:{defaultValue:null,description:"For hiding the bottom border (on PageHeader for example)",name:"hideBorder",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tabs/TabsBar.tsx#TabsBar"]={docgenInfo:x.__docgenInfo,name:"TabsBar",path:"src/components/Tabs/TabsBar.tsx#TabsBar"})}catch(d){}},"./src/components/Tags/Tag.tsx":function(se,V,e){"use strict";e.d(V,{V:function(){return b}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/utils/tags.ts"),f=e("./src/components/Icon/Icon.tsx"),x=Object.defineProperty,d=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(v,y,h)=>y in v?x(v,y,{enumerable:!0,configurable:!0,writable:!0,value:h}):v[y]=h,w=(v,y)=>{for(var h in y||(y={}))E.call(y,h)&&m(v,h,y[h]);if(c)for(var h of c(y))O.call(y,h)&&m(v,h,y[h]);return v},_=(v,y)=>d(v,i(y)),C=(v,y)=>{var h={};for(var s in v)E.call(v,s)&&y.indexOf(s)<0&&(h[s]=v[s]);if(v!=null&&c)for(var s of c(v))y.indexOf(s)<0&&O.call(v,s)&&(h[s]=v[s]);return h};const b=(0,n.forwardRef)((v,y)=>{var h=v,{name:s,onClick:o,icon:r,className:u,colorIndex:p}=h,S=C(h,["name","onClick","icon","className","colorIndex"]);const k=(0,a.l4)(),D=g(k,s,p),M=T=>{T.preventDefault(),T.stopPropagation(),o==null||o(s,T)},I=(0,t.cx)(D.wrapper,u,{[D.hover]:o!==void 0});return o?n.createElement("button",_(w({},S),{className:I,onClick:M,ref:y}),r&&n.createElement(f.J,{name:r}),s):n.createElement("span",_(w({},S),{className:I,ref:y}),r&&n.createElement(f.J,{name:r}),s)});b.displayName="Tag";const g=(v,y,h)=>{let s;return h===void 0?s=(0,l.Bx)(y):s=(0,l.vm)(h),{wrapper:t.iv`
      appearance: none;
      border-style: none;
      font-weight: ${v.typography.fontWeightMedium};
      font-size: ${v.typography.size.sm};
      line-height: ${v.typography.bodySmall.lineHeight};
      vertical-align: baseline;
      background-color: ${s.color};
      color: ${v.v1.palette.gray98};
      white-space: nowrap;
      text-shadow: none;
      padding: 3px 6px;
      border-radius: ${v.shape.radius.default};
    `,hover:t.iv`
      &:hover {
        opacity: 0.85;
        cursor: pointer;
      }
    `}};try{b.displayName="Tag",b.__docgenInfo={description:"",displayName:"Tag",props:{name:{defaultValue:null,description:"Name of the tag to display",name:"name",required:!0,type:{name:"string"}},icon:{defaultValue:null,description:"",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}},colorIndex:{defaultValue:null,description:"Use constant color from TAG_COLORS. Using index instead of color directly so we can match other styling.",name:"colorIndex",required:!1,type:{name:"number"}},onClick:{defaultValue:null,description:"",name:"onClick",required:!1,type:{name:"OnTagClick"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tags/Tag.tsx#Tag"]={docgenInfo:b.__docgenInfo,name:"Tag",path:"src/components/Tags/Tag.tsx#Tag"})}catch(v){}},"./src/components/Tags/TagList.tsx":function(se,V,e){"use strict";e.d(V,{P:function(){return f}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/Tags/Tag.tsx");const f=(0,n.memo)((0,n.forwardRef)(({displayMax:d,tags:i,icon:c,onClick:E,className:O,getAriaLabel:m},w)=>{const _=(0,a.l4)(),C=x(_,Boolean(d&&d>0)),b=i.length,g=d?i.slice(0,d):i;return n.createElement("ul",{className:(0,t.cx)(C.wrapper,O),"aria-label":"Tags",ref:w},g.map((v,y)=>n.createElement("li",{className:C.li,key:v},n.createElement(l.V,{name:v,icon:c,onClick:E,"aria-label":m==null?void 0:m(v,y),"data-tag-id":y}))),d&&d>0&&b-d>0&&n.createElement("span",{className:C.moreTagsLabel},"+ ",b-d))}));f.displayName="TagList";const x=(d,i)=>({wrapper:t.iv`
      position: relative;
      align-items: ${i?"center":"unset"};
      display: flex;
      flex: 1 1 auto;
      flex-wrap: wrap;
      flex-shrink: ${i?0:1};
      justify-content: flex-end;
      gap: 6px;
    `,moreTagsLabel:t.iv`
      color: ${d.colors.text.secondary};
      font-size: ${d.typography.size.sm};
    `,li:(0,t.iv)({listStyle:"none"})});try{f.displayName="TagList",f.__docgenInfo={description:"",displayName:"TagList",props:{displayMax:{defaultValue:null,description:"Maximum number of the tags to display",name:"displayMax",required:!1,type:{name:"number"}},tags:{defaultValue:null,description:"Names of the tags to display",name:"tags",required:!0,type:{name:"string[]"}},onClick:{defaultValue:null,description:"Callback when the tag is clicked",name:"onClick",required:!1,type:{name:"OnTagClick"}},className:{defaultValue:null,description:"Custom styles for the wrapper component",name:"className",required:!1,type:{name:"string"}},getAriaLabel:{defaultValue:null,description:"aria-label for the `i`-th Tag component",name:"getAriaLabel",required:!1,type:{name:"((name: string, i: number) => string)"}},icon:{defaultValue:null,description:"Icon to show next to tag label",name:"icon",required:!1,type:{name:"enum",value:[{value:'"info"'},{value:'"play"'},{value:'"google"'},{value:'"microsoft"'},{value:'"github"'},{value:'"gitlab"'},{value:'"okta"'},{value:'"discord"'},{value:'"hipchat"'},{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:'"apps"'},{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:'"expand-arrows"'},{value:'"at"'},{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:'"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:'"filter"'},{value:'"flip"'},{value:'"folder"'},{value:'"font"'},{value:'"fire"'},{value:'"folder-open"'},{value:'"folder-plus"'},{value:'"folder-upload"'},{value:'"forward"'},{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-movepane-left"'},{value:'"gf-movepane-right"'},{value:'"gf-portrait"'},{value:'"gf-service-account"'},{value:'"gf-show-context"'},{value:'"grafana"'},{value:'"graph-bar"'},{value:'"grafana-ml"'},{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-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:'"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:'"sort-amount-down"'},{value:'"sort-amount-up"'},{value:'"square-shape"'},{value:'"star"'},{value:'"step-backward"'},{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:'"unlock"'},{value:'"upload"'},{value:'"user"'},{value:'"users-alt"'},{value:'"user-arrows"'},{value:'"vertical-align-bottom"'},{value:'"vertical-align-center"'},{value:'"vertical-align-top"'},{value:'"wrap-text"'},{value:'"rss"'},{value:'"x"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tags/TagList.tsx#TagList"]={docgenInfo:f.__docgenInfo,name:"TagList",path:"src/components/Tags/TagList.tsx#TagList"})}catch(d){}},"./src/components/TagsInput/TagsInput.tsx":function(se,V,e){"use strict";e.d(V,{B:function(){return E}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/components/Button/Button.tsx"),f=e("./src/components/Input/Input.tsx"),x=e("./src/utils/tags.ts"),d=e("./src/components/IconButton/IconButton.tsx");const i=({name:m,disabled:w,onRemove:_})=>{const{color:C,borderColor:b}=(0,n.useMemo)(()=>(0,x.Bx)(m),[m]),g=(0,a.wW)(c);return n.createElement("li",{className:g.itemStyle,style:{backgroundColor:C,borderColor:b}},n.createElement("span",{className:g.nameStyle},m),n.createElement(d.h,{name:"times",size:"lg",disabled:w,ariaLabel:`Remove "${m}" tag`,onClick:()=>_(m),type:"button",className:g.buttonStyles}))},c=m=>{const w=m.spacing.gridSize*3;return{itemStyle:(0,t.iv)({display:"flex",gap:"3px",alignItems:"center",height:`${w}px`,lineHeight:`${w-2}px`,color:"#fff",borderWidth:"1px",borderStyle:"solid",borderRadius:m.shape.radius.default,padding:`0 ${m.spacing(.5)}`,whiteSpace:"nowrap",textShadow:"none",fontWeight:500,fontSize:m.typography.size.sm}),nameStyle:(0,t.iv)({maxWidth:"25ch",textOverflow:"ellipsis",overflow:"hidden"}),buttonStyles:(0,t.iv)({margin:0,"&:hover::before":{display:"none"}})}};try{i.displayName="TagItem",i.__docgenInfo={description:"",displayName:"TagItem",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},disabled:{defaultValue:null,description:"",name:"disabled",required:!1,type:{name:"boolean"}},onRemove:{defaultValue:null,description:"",name:"onRemove",required:!0,type:{name:"(tag: string) => void"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/TagsInput/TagItem.tsx#TagItem"]={docgenInfo:i.__docgenInfo,name:"TagItem",path:"src/components/TagsInput/TagItem.tsx#TagItem"})}catch(m){}const E=({placeholder:m="New tag (enter key to add)",tags:w=[],onChange:_,width:C,className:b,disabled:g,addOnBlur:v,invalid:y,id:h})=>{const[s,o]=(0,n.useState)(""),r=(0,a.wW)(O),u=(0,a.l4)(),p=(0,n.useCallback)(I=>{o(I.target.value)},[]),S=I=>{_(w.filter(T=>T!==I))},k=I=>{I==null||I.preventDefault(),w.includes(s)||_(w.concat(s)),o("")},D=()=>{v&&s&&k()},M=I=>{I.key==="Enter"&&s!==""&&k(I)};return n.createElement("div",{className:(0,t.cx)(r.wrapper,b,C?(0,t.iv)({width:u.spacing(C)}):"")},n.createElement(f.I,{id:h,disabled:g,placeholder:m,onChange:p,value:s,onKeyDown:M,onBlur:D,invalid:y,suffix:n.createElement(l.zx,{fill:"text",className:r.addButtonStyle,onClick:k,size:"md",disabled:s.length<=0},"Add")}),(w==null?void 0:w.length)>0&&n.createElement("ul",{className:r.tags},w.map(I=>n.createElement(i,{key:I,name:I,onRemove:S,disabled:g}))))},O=m=>({wrapper:t.iv`
    min-height: ${m.spacing(4)};
    display: flex;
    flex-direction: column;
    gap: ${m.spacing(1)};
    flex-wrap: wrap;
  `,tags:t.iv`
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: ${m.spacing(.5)};
  `,addButtonStyle:t.iv`
    margin: 0 -${m.spacing(1)};
  `});try{E.displayName="TagsInput",E.__docgenInfo={description:"",displayName:"TagsInput",props:{placeholder:{defaultValue:{value:"New tag (enter key to add)"},description:"",name:"placeholder",required:!1,type:{name:"string"}},tags:{defaultValue:{value:"[]"},description:"Array of selected tags",name:"tags",required:!1,type:{name:"string[]"}},onChange:{defaultValue:null,description:"",name:"onChange",required:!0,type:{name:"(tags: string[]) => void"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"number"}},id:{defaultValue:null,description:"",name:"id",required:!1,type:{name:"string"}},className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},disabled:{defaultValue:null,description:"Toggle disabled state",name:"disabled",required:!1,type:{name:"boolean"}},addOnBlur:{defaultValue:null,description:"Enable adding new tags when input loses focus",name:"addOnBlur",required:!1,type:{name:"boolean"}},invalid:{defaultValue:null,description:"Toggle invalid state",name:"invalid",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/TagsInput/TagsInput.tsx#TagsInput"]={docgenInfo:E.__docgenInfo,name:"TagsInput",path:"src/components/TagsInput/TagsInput.tsx#TagsInput"})}catch(m){}},"./src/components/TextArea/TextArea.tsx":function(se,V,e){"use strict";e.d(V,{K:function(){return b}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/themes/stylesFactory.ts"),f=e("./src/components/Forms/commonStyles.ts"),x=Object.defineProperty,d=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(v,y,h)=>y in v?x(v,y,{enumerable:!0,configurable:!0,writable:!0,value:h}):v[y]=h,w=(v,y)=>{for(var h in y||(y={}))E.call(y,h)&&m(v,h,y[h]);if(c)for(var h of c(y))O.call(y,h)&&m(v,h,y[h]);return v},_=(v,y)=>d(v,i(y)),C=(v,y)=>{var h={};for(var s in v)E.call(v,s)&&y.indexOf(s)<0&&(h[s]=v[s]);if(v!=null&&c)for(var s of c(v))y.indexOf(s)<0&&O.call(v,s)&&(h[s]=v[s]);return h};const b=n.forwardRef((v,y)=>{var h=v,{invalid:s,className:o}=h,r=C(h,["invalid","className"]);const u=(0,a.l4)(),p=g(u,s);return n.createElement("textarea",_(w({},r),{className:(0,t.cx)(p.textarea,o),ref:y}))}),g=(0,l.B)((v,y=!1)=>({textarea:(0,t.cx)((0,f.RK)(v),(0,f.GL)(v),t.iv`
        border-radius: ${v.shape.borderRadius()};
        padding: ${v.spacing.gridSize/4}px ${v.spacing.gridSize}px;
        width: 100%;
        border-color: ${y?v.colors.error.border:v.components.input.borderColor};
      `)}));b.displayName="TextArea";try{b.displayName="TextArea",b.__docgenInfo={description:"",displayName:"TextArea",props:{invalid:{defaultValue:null,description:"Show an invalid state around the input",name:"invalid",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/TextArea/TextArea.tsx#TextArea"]={docgenInfo:b.__docgenInfo,name:"TextArea",path:"src/components/TextArea/TextArea.tsx#TextArea"})}catch(v){}},"./src/components/ToolbarButton/ToolbarButton.tsx":function(se,V,e){"use strict";e.d(V,{h:function(){return g}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts"),l=e("../grafana-e2e-selectors/src/selectors/index.ts"),f=e("./src/themes/ThemeContext.tsx"),x=e("./src/themes/mixins.ts"),d=e("./src/components/Button/Button.tsx"),i=e("./src/components/Icon/Icon.tsx"),c=e("./src/components/Tooltip/Tooltip.tsx"),E=Object.defineProperty,O=Object.getOwnPropertySymbols,m=Object.prototype.hasOwnProperty,w=Object.prototype.propertyIsEnumerable,_=(s,o,r)=>o in s?E(s,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[o]=r,C=(s,o)=>{for(var r in o||(o={}))m.call(o,r)&&_(s,r,o[r]);if(O)for(var r of O(o))w.call(o,r)&&_(s,r,o[r]);return s},b=(s,o)=>{var r={};for(var u in s)m.call(s,u)&&o.indexOf(u)<0&&(r[u]=s[u]);if(s!=null&&O)for(var u of O(s))o.indexOf(u)<0&&w.call(s,u)&&(r[u]=s[u]);return r};const g=(0,n.forwardRef)((s,o)=>{var r=s,{tooltip:u,icon:p,iconSize:S,className:k,children:D,imgSrc:M,imgAlt:I,fullWidth:T,isOpen:j,narrow:K,variant:F="default",iconOnly:$,"aria-label":R,isHighlighted:U}=r,H=b(r,["tooltip","icon","iconSize","className","children","imgSrc","imgAlt","fullWidth","isOpen","narrow","variant","iconOnly","aria-label","isHighlighted"]);const W=(0,f.wW)(h),oe=(0,t.cx)({[W.button]:!0,[W.buttonFullWidth]:T,[W.narrow]:K},W[F],k),Q=(0,t.cx)({[W.content]:!0,[W.contentWithIcon]:!!p,[W.contentWithRightIcon]:j!==void 0}),P=n.createElement("button",C({ref:o,className:oe,"aria-label":v(R,u),"aria-expanded":j},H),y(p,S),M&&n.createElement("img",{className:W.img,src:M,alt:I!=null?I:""}),D&&!$&&n.createElement("div",{className:Q},D),j===!1&&n.createElement(i.J,{name:"angle-down"}),j===!0&&n.createElement(i.J,{name:"angle-up"}),U&&n.createElement("div",{className:W.highlight}));return u?n.createElement(c.u,{content:u,placement:"bottom"},P):P});g.displayName="ToolbarButton";function v(s,o){return s||(o?l.wl.components.PageToolbar.item(o):void 0)}function y(s,o){return s?(0,a.Mo)(s)?n.createElement(i.J,{name:s,size:`${o||"lg"}`}):s:null}const h=s=>{const o=(0,d.c9)(s,"primary","solid"),r=(0,d.c9)(s,"destructive","solid"),u=t.iv`
    color: ${s.colors.text.secondary};
    background-color: ${s.colors.background.primary};

    &:hover {
      color: ${s.colors.text.primary};
      background: ${s.colors.background.secondary};
    }
  `,p=t.iv`
    color: ${s.colors.text.secondary};
    background: transparent;
    border: 1px solid transparent;

    &:hover {
      color: ${s.colors.text.primary};
      background: ${s.colors.background.secondary};
    }
  `;return{button:t.iv`
      label: toolbar-button;
      position: relative;
      display: flex;
      align-items: center;
      height: ${s.spacing(s.components.height.md)};
      padding: ${s.spacing(0,1)};
      border-radius: ${s.shape.borderRadius()};
      line-height: ${s.components.height.md*s.spacing.gridSize-2}px;
      font-weight: ${s.typography.fontWeightMedium};
      border: 1px solid ${s.colors.border.weak};
      white-space: nowrap;
      transition: ${s.transitions.create(["background","box-shadow","border-color","color"],{duration:s.transitions.duration.short})};

      &:focus,
      &:focus-visible {
        ${(0,x.SV)(s)}
        z-index: 1;
      }

      &:focus:not(:focus-visible) {
        ${(0,x.Cq)(s)}
      }

      &:hover {
        box-shadow: ${s.shadows.z1};
      }

      &[disabled],
      &:disabled {
        cursor: not-allowed;
        opacity: ${s.colors.action.disabledOpacity};
        background: ${s.colors.action.disabledBackground};
        box-shadow: none;

        &:hover {
          color: ${s.colors.text.disabled};
          background: ${s.colors.action.disabledBackground};
          box-shadow: none;
        }
      }
    `,default:s.flags.topnav?p:u,canvas:u,active:t.iv`
      color: ${s.v1.palette.orangeDark};
      border-color: ${s.v1.palette.orangeDark};
      background-color: transparent;

      &:hover {
        color: ${s.colors.text.primary};
        background: ${s.colors.emphasize(s.colors.background.canvas,.03)};
      }
    `,primary:(0,t.iv)(o),destructive:(0,t.iv)(r),narrow:t.iv`
      padding: 0 ${s.spacing(.5)};
    `,img:t.iv`
      width: 16px;
      height: 16px;
      margin-right: ${s.spacing(1)};
    `,buttonFullWidth:t.iv`
      flex-grow: 1;
    `,content:t.iv`
      flex-grow: 1;
    `,contentWithIcon:t.iv`
      display: none;
      padding-left: ${s.spacing(1)};

      @media ${x._Q(s.v1.breakpoints.md)} {
        display: block;
      }
    `,contentWithRightIcon:t.iv`
      padding-right: ${s.spacing(.5)};
    `,highlight:t.iv`
      background-color: ${s.colors.success.main};
      border-radius: 50%;
      width: 6px;
      height: 6px;
      position: absolute;
      top: -3px;
      right: -3px;
      z-index: 1;
    `}};try{g.displayName="ToolbarButton",g.__docgenInfo={description:"",displayName:"ToolbarButton",props:{icon:{defaultValue:null,description:"Icon name",name:"icon",required:!1,type:{name:"ReactNode"}},iconSize:{defaultValue:null,description:"Icon size",name:"iconSize",required:!1,type:{name:"enum",value:[{value:'"xs"'},{value:'"sm"'},{value:'"md"'},{value:'"lg"'},{value:'"xl"'},{value:'"xxl"'},{value:'"xxxl"'}]}},tooltip:{defaultValue:null,description:"Tooltip",name:"tooltip",required:!1,type:{name:"string"}},imgSrc:{defaultValue:null,description:"For image icons",name:"imgSrc",required:!1,type:{name:"string"}},imgAlt:{defaultValue:null,description:"Alt text for imgSrc",name:"imgAlt",required:!1,type:{name:"string"}},isOpen:{defaultValue:null,description:"if true or false will show angle-down/up",name:"isOpen",required:!1,type:{name:"boolean"}},fullWidth:{defaultValue:null,description:"Controls flex-grow: 1",name:"fullWidth",required:!1,type:{name:"boolean"}},narrow:{defaultValue:null,description:"reduces padding to xs",name:"narrow",required:!1,type:{name:"boolean"}},variant:{defaultValue:{value:"default"},description:"variant",name:"variant",required:!1,type:{name:"enum",value:[{value:'"primary"'},{value:'"destructive"'},{value:'"default"'},{value:'"canvas"'},{value:'"active"'}]}},iconOnly:{defaultValue:null,description:"Hide any children and only show icon",name:"iconOnly",required:!1,type:{name:"boolean"}},isHighlighted:{defaultValue:null,description:"Show highlight dot",name:"isHighlighted",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ToolbarButton/ToolbarButton.tsx#ToolbarButton"]={docgenInfo:g.__docgenInfo,name:"ToolbarButton",path:"src/components/ToolbarButton/ToolbarButton.tsx#ToolbarButton"})}catch(s){}},"./src/components/ToolbarButton/ToolbarButtonRow.tsx":function(se,V,e){"use strict";e.d(V,{R:function(){return C}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@react-aria-dialog-virtual-6e50988279/2/yarn/cache/@react-aria-dialog-npm-3.3.1-c100ba6958-ba924f07a7.zip/node_modules/@react-aria/dialog/dist/module.js"),a=e("../../.yarn/__virtual__/@react-aria-focus-virtual-756c2fbfb1/2/yarn/cache/@react-aria-focus-npm-3.8.0-89e94bd684-2250e610c3.zip/node_modules/@react-aria/focus/dist/module.js"),l=e("../../.yarn/__virtual__/@react-aria-overlays-virtual-34e54d82d1/2/yarn/cache/@react-aria-overlays-npm-3.10.1-f232007f1a-b83ec155d3.zip/node_modules/@react-aria/overlays/dist/module.js"),f=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),x=e("./src/themes/ThemeContext.tsx"),d=e("./src/components/ToolbarButton/ToolbarButton.tsx"),i=Object.defineProperty,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(g,v,y)=>v in g?i(g,v,{enumerable:!0,configurable:!0,writable:!0,value:y}):g[v]=y,w=(g,v)=>{for(var y in v||(v={}))E.call(v,y)&&m(g,y,v[y]);if(c)for(var y of c(v))O.call(v,y)&&m(g,y,v[y]);return g},_=(g,v)=>{var y={};for(var h in g)E.call(g,h)&&v.indexOf(h)<0&&(y[h]=g[h]);if(g!=null&&c)for(var h of c(g))v.indexOf(h)<0&&O.call(g,h)&&(y[h]=g[h]);return y};const C=(0,f.forwardRef)((g,v)=>{var y=g,{alignment:h="left",className:s,children:o}=y,r=_(y,["alignment","className","children"]);const u=f.Children.toArray(o).filter(U=>U!==null),[p,S]=(0,f.useState)(Array(u.length).fill(!0)),k=(0,f.useRef)(null),[D,M]=(0,f.useState)(!1),I=(0,f.useRef)(null),T=(0,f.createRef)(),{overlayProps:j}=(0,l.Ir)({onClose:()=>M(!1),isDismissable:!0,isOpen:D,shouldCloseOnInteractOutside:U=>{var H;return!((H=I.current)!=null&&H.contains(U))}},T),{dialogProps:K}=(0,n.R)({},T),F=(0,x.l4)(),$=h==="left"?p.indexOf(!1)-1:p.length,R=b(F,$,h);return(0,f.useLayoutEffect)(()=>{const U=new IntersectionObserver(H=>{H.forEach(W=>{if(W.target instanceof HTMLElement&&W.target.parentNode){const oe=Array.prototype.indexOf.call(W.target.parentNode.children,W.target);S(Q=>{const P=[...Q];return P[oe]=W.isIntersecting,P})}})},{threshold:1,root:k.current});return k.current&&Array.from(k.current.children).forEach(H=>{H instanceof HTMLElement&&H!==I.current&&U.observe(H)}),()=>U.disconnect()},[o]),f.createElement("div",w({ref:k,className:(0,t.cx)(R.container,s)},r),u.map((U,H)=>f.createElement("div",{key:H,style:{order:H,visibility:p[H]?"visible":"hidden"},className:R.childWrapper},U)),p.includes(!1)&&f.createElement("div",{ref:I,className:R.overflowButton},f.createElement(d.h,{variant:D?"active":"default",tooltip:"Show more items",onClick:()=>M(!D),icon:"ellipsis-v",iconOnly:!0,narrow:!0}),D&&f.createElement(a.MT,{contain:!0,autoFocus:!0},f.createElement("div",w(w({className:R.overflowItems,ref:T},j),K),u.map((U,H)=>!p[H]&&U)))))});C.displayName="ToolbarButtonRow";const b=(g,v,y)=>({overflowButton:t.iv`
    order: ${v};
  `,overflowItems:t.iv`
    align-items: center;
    background-color: ${g.colors.background.primary};
    border-radius: ${g.shape.borderRadius()};
    box-shadow: ${g.shadows.z3};
    display: flex;
    flex-wrap: wrap;
    gap: ${g.spacing(1)};
    margin-top: ${g.spacing(1)};
    max-width: 80vw;
    padding: ${g.spacing(.5,1)};
    position: absolute;
    right: 0;
    top: 100%;
    width: max-content;
    z-index: ${g.zIndex.sidemenu};
  `,container:t.iv`
    align-items: center;
    display: flex;
    gap: ${g.spacing(1)};
    justify-content: ${y==="left"?"flex-start":"flex-end"};
    min-width: 0;
    position: relative;
  `,childWrapper:t.iv`
    align-items: center;
    display: flex;
    gap: ${g.spacing(1)};
  `});try{C.displayName="ToolbarButtonRow",C.__docgenInfo={description:"",displayName:"ToolbarButtonRow",props:{className:{defaultValue:null,description:"",name:"className",required:!1,type:{name:"string"}},alignment:{defaultValue:{value:"left"},description:"Determine flex-alignment of child buttons. Needed for overflow behaviour.",name:"alignment",required:!1,type:{name:"enum",value:[{value:'"right"'},{value:'"left"'}]}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/ToolbarButton/ToolbarButtonRow.tsx#ToolbarButtonRow"]={docgenInfo:C.__docgenInfo,name:"ToolbarButtonRow",path:"src/components/ToolbarButton/ToolbarButtonRow.tsx#ToolbarButtonRow"})}catch(g){}},"./src/components/Tooltip/Popover.tsx":function(se,V,e){"use strict";e.d(V,{J:function(){return _}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/react-popper-virtual-6baf84772d/2/yarn/cache/react-popper-npm-2.3.0-1045578379-837111c987.zip/node_modules/react-popper/lib/esm/Manager.js"),a=e("../../.yarn/__virtual__/react-popper-virtual-6baf84772d/2/yarn/cache/react-popper-npm-2.3.0-1045578379-837111c987.zip/node_modules/react-popper/lib/esm/Popper.js"),l=e("../../.yarn/__virtual__/react-transition-group-virtual-5d02c993cb/2/yarn/cache/react-transition-group-npm-4.4.5-98ea4ef96e-7560284010.zip/node_modules/react-transition-group/esm/Transition.js"),f=e("./src/components/Portal/Portal.tsx"),x=Object.defineProperty,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(C,b,g)=>b in C?x(C,b,{enumerable:!0,configurable:!0,writable:!0,value:g}):C[b]=g,O=(C,b)=>{for(var g in b||(b={}))i.call(b,g)&&E(C,g,b[g]);if(d)for(var g of d(b))c.call(b,g)&&E(C,g,b[g]);return C};const m={transitionProperty:"opacity",transitionDuration:"200ms",transitionTimingFunction:"linear",opacity:0},w={exited:{opacity:0},entering:{opacity:0},entered:{opacity:1,transitionDelay:"0s"},exiting:{opacity:0,transitionDelay:"500ms"}};class _ extends t.PureComponent{render(){const{content:b,show:g,placement:v,onMouseEnter:y,onMouseLeave:h,className:s,wrapperClassName:o,renderArrow:r,referenceElement:u,onKeyDown:p}=this.props;return t.createElement(n.dK,null,t.createElement(l.ZP,{in:g,timeout:100,mountOnEnter:!0,unmountOnExit:!0},S=>t.createElement(f.h_,null,t.createElement(a.r,{placement:v,referenceElement:u,modifiers:[{name:"preventOverflow",enabled:!0,options:{rootBoundary:"viewport"}},{name:"eventListeners",options:{scroll:!0,resize:!0}}]},({ref:k,style:D,placement:M,arrowProps:I,update:T})=>t.createElement("div",{onMouseEnter:y,onMouseLeave:h,onKeyDown:p,ref:k,style:O(O(O({},D),m),w[S]),"data-placement":M,className:`${o}`},t.createElement("div",{className:s},typeof b=="string"&&b,t.isValidElement(b)&&t.cloneElement(b),typeof b=="function"&&b({updatePopperPosition:T}),r&&r({arrowProps:I,placement:M})))))))}}try{_.displayName="Popover",_.__docgenInfo={description:"",displayName:"Popover",props:{show:{defaultValue:null,description:"",name:"show",required:!0,type:{name:"boolean"}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"PopoverContent"}},referenceElement:{defaultValue:null,description:"",name:"referenceElement",required:!0,type:{name:"HTMLElement | VirtualElement"}},wrapperClassName:{defaultValue:null,description:"",name:"wrapperClassName",required:!1,type:{name:"string"}},renderArrow:{defaultValue:null,description:"",name:"renderArrow",required:!1,type:{name:"RenderPopperArrowFn"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tooltip/Popover.tsx#Popover"]={docgenInfo:_.__docgenInfo,name:"Popover",path:"src/components/Tooltip/Popover.tsx#Popover"})}catch(C){}},"./src/components/Tooltip/Tooltip.tsx":function(se,V,e){"use strict";e.d(V,{u:function(){return m}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/react-popper-tooltip-virtual-fa069dac02/2/yarn/cache/react-popper-tooltip-npm-4.4.2-54ed1200c6-516988b925.zip/node_modules/react-popper-tooltip/dist/esm/react-popper-tooltip.js"),a=e("./src/themes/ThemeContext.tsx"),l=e("./src/utils/tooltipUtils.ts"),f=e("./src/components/Portal/Portal.tsx"),x=Object.defineProperty,d=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,c=Object.prototype.propertyIsEnumerable,E=(_,C,b)=>C in _?x(_,C,{enumerable:!0,configurable:!0,writable:!0,value:b}):_[C]=b,O=(_,C)=>{for(var b in C||(C={}))i.call(C,b)&&E(_,b,C[b]);if(d)for(var b of d(C))c.call(C,b)&&E(_,b,C[b]);return _};const m=t.memo(({children:_,theme:C,interactive:b,show:g,placement:v,content:y})=>{const[h,s]=t.useState(g);(0,t.useEffect)(()=>{if(h!==!1){const I=T=>{T.key==="Escape"&&s(!1)};return document.addEventListener("keydown",I),()=>{document.removeEventListener("keydown",I)}}else return},[h]);const{getArrowProps:o,getTooltipProps:r,setTooltipRef:u,setTriggerRef:p,visible:S,update:k}=(0,n.O)({visible:h,placement:v,interactive:b,delayHide:b?100:0,delayShow:150,offset:[0,8],trigger:["hover","focus"],onVisibleChange:s}),M=(0,a.wW)(w)[C!=null?C:"info"];return t.createElement(t.Fragment,null,t.cloneElement(_,{ref:p,tabIndex:0}),S&&t.createElement(f.h_,null,t.createElement("div",O({ref:u},r({className:M.container})),t.createElement("div",O({},o({className:M.arrow}))),typeof y=="string"&&y,t.isValidElement(y)&&t.cloneElement(y),typeof y=="function"&&k&&y({updatePopperPosition:k}))))});m.displayName="Tooltip";const w=_=>{const C=(0,l.k)(_,_.components.tooltip.background,_.components.tooltip.background,_.components.tooltip.text,{topBottom:.5,rightLeft:1}),b=(0,l.k)(_,_.colors.error.main,_.colors.error.main,_.colors.error.contrastText,{topBottom:.5,rightLeft:1});return{info:C,["info-alt"]:C,error:b}};try{m.displayName="Tooltip",m.__docgenInfo={description:"",displayName:"Tooltip",props:{theme:{defaultValue:null,description:"",name:"theme",required:!1,type:{name:"enum",value:[{value:'"error"'},{value:'"info"'},{value:'"info-alt"'}]}},show:{defaultValue:null,description:"",name:"show",required:!1,type:{name:"boolean"}},placement:{defaultValue:null,description:"",name:"placement",required:!1,type:{name:"enum",value:[{value:'"auto-start"'},{value:'"auto"'},{value:'"auto-end"'},{value:'"top-start"'},{value:'"top"'},{value:'"top-end"'},{value:'"right-start"'},{value:'"right"'},{value:'"right-end"'},{value:'"bottom-end"'},{value:'"bottom"'},{value:'"bottom-start"'},{value:'"left-end"'},{value:'"left"'},{value:'"left-start"'}]}},content:{defaultValue:null,description:"",name:"content",required:!0,type:{name:"PopoverContent"}},interactive:{defaultValue:null,description:"Set to true if you want the tooltip to stay long enough so the user can move mouse over content to select text or click a link",name:"interactive",required:!1,type:{name:"boolean"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/Tooltip/Tooltip.tsx#Tooltip"]={docgenInfo:m.__docgenInfo,name:"Tooltip",path:"src/components/Tooltip/Tooltip.tsx#Tooltip"})}catch(_){}},"./src/components/VizLayout/VizLayout.tsx":function(se,V,e){"use strict";e.d(V,{AY:function(){return d}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-use-virtual-720cbd4f86/2/yarn/cache/react-use-npm-17.4.0-0ef4521544-0889da919b.zip/node_modules/react-use/esm/useMeasure.js"),l=e("./src/themes/ThemeContext.tsx"),f=e("./src/themes/mixins.ts"),x=e("./src/components/CustomScrollbar/CustomScrollbar.tsx");const d=({width:E,height:O,legend:m,children:w})=>{const _=(0,l.wW)(i),C={display:"flex",width:`${E}px`,height:`${O}px`},[b,g]=(0,a.Z)();if(!m)return n.createElement(n.Fragment,null,n.createElement("div",{tabIndex:0,style:C,className:_.viz},w(E,O)));const{placement:v,maxHeight:y="35%",maxWidth:h="60%"}=m.props;let s=null;const o={};switch(v){case"bottom":C.flexDirection="column",o.maxHeight=y,g&&(s={width:E,height:O-g.height});break;case"right":C.flexDirection="row",o.maxWidth=h,g&&(s={width:E-g.width,height:O}),m.props.width&&(o.width=m.props.width,s={width:E-m.props.width,height:O});break}return(s==null?void 0:s.width)===0&&(s.width=E),(s==null?void 0:s.height)===0&&(s.height=O),n.createElement("div",{style:C},n.createElement("div",{tabIndex:0,className:_.viz},s&&w(s.width,s.height)),n.createElement("div",{style:o,ref:b},n.createElement(x.$,{hideHorizontalTrack:!0},m)))},i=E=>({viz:(0,t.iv)({flexGrow:2,borderRadius:E.shape.borderRadius(1),"&:focus-visible":(0,f.SV)(E)})}),c=({children:E})=>n.createElement(n.Fragment,null,E);d.Legend=c;try{d.displayName="VizLayout",d.__docgenInfo={description:"",displayName:"VizLayout",props:{width:{defaultValue:null,description:"",name:"width",required:!0,type:{name:"number"}},height:{defaultValue:null,description:"",name:"height",required:!0,type:{name:"number"}},legend:{defaultValue:null,description:"",name:"legend",required:!1,type:{name:"ReactElement<VizLayoutLegendProps, string | JSXElementConstructor<any>> | null"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLayout/VizLayout.tsx#VizLayout"]={docgenInfo:d.__docgenInfo,name:"VizLayout",path:"src/components/VizLayout/VizLayout.tsx#VizLayout"})}catch(E){}try{i.displayName="getVizStyles",i.__docgenInfo={description:"",displayName:"getVizStyles",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}},isDark:{defaultValue:null,description:"",name:"isDark",required:!0,type:{name:"boolean"}},isLight:{defaultValue:null,description:"",name:"isLight",required:!0,type:{name:"boolean"}},colors:{defaultValue:null,description:"",name:"colors",required:!0,type:{name:"ThemeColors"}},breakpoints:{defaultValue:null,description:"",name:"breakpoints",required:!0,type:{name:"ThemeBreakpoints"}},spacing:{defaultValue:null,description:"",name:"spacing",required:!0,type:{name:"ThemeSpacing"}},shape:{defaultValue:null,description:"",name:"shape",required:!0,type:{name:"ThemeShape"}},components:{defaultValue:null,description:"",name:"components",required:!0,type:{name:"ThemeComponents"}},typography:{defaultValue:null,description:"",name:"typography",required:!0,type:{name:"ThemeTypography"}},zIndex:{defaultValue:null,description:"",name:"zIndex",required:!0,type:{name:"{ navbarFixed: number; sidemenu: number; dropdown: number; typeahead: number; tooltip: number; modalBackdrop: number; modal: number; portal: number; }"}},shadows:{defaultValue:null,description:"",name:"shadows",required:!0,type:{name:"ThemeShadows"}},visualization:{defaultValue:null,description:"",name:"visualization",required:!0,type:{name:"ThemeVisualizationColors"}},transitions:{defaultValue:null,description:"",name:"transitions",required:!0,type:{name:"ThemeTransitions"}},v1:{defaultValue:null,description:"@deprecated Will be removed in a future version",name:"v1",required:!0,type:{name:"GrafanaTheme"}},flags:{defaultValue:null,description:"feature flags that might impact component looks",name:"flags",required:!0,type:{name:"{ topnav?: boolean | undefined; }"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLayout/VizLayout.tsx#getVizStyles"]={docgenInfo:i.__docgenInfo,name:"getVizStyles",path:"src/components/VizLayout/VizLayout.tsx#getVizStyles"})}catch(E){}try{c.displayName="VizLayoutLegend",c.__docgenInfo={description:"",displayName:"VizLayoutLegend",props:{placement:{defaultValue:null,description:"",name:"placement",required:!0,type:{name:"enum",value:[{value:'"right"'},{value:'"bottom"'}]}},maxHeight:{defaultValue:null,description:"",name:"maxHeight",required:!1,type:{name:"string"}},maxWidth:{defaultValue:null,description:"",name:"maxWidth",required:!1,type:{name:"string"}},width:{defaultValue:null,description:"",name:"width",required:!1,type:{name:"number"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLayout/VizLayout.tsx#VizLayoutLegend"]={docgenInfo:c.__docgenInfo,name:"VizLayoutLegend",path:"src/components/VizLayout/VizLayout.tsx#VizLayoutLegend"})}catch(E){}},"./src/components/VizLegend/SeriesIcon.tsx":function(se,V,e){"use strict";e.d(V,{F:function(){return O}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/field/fieldColor.ts"),a=e("./src/themes/ThemeContext.tsx"),l=Object.defineProperty,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(m,w,_)=>w in m?l(m,w,{enumerable:!0,configurable:!0,writable:!0,value:_}):m[w]=_,c=(m,w)=>{for(var _ in w||(w={}))x.call(w,_)&&i(m,_,w[_]);if(f)for(var _ of f(w))d.call(w,_)&&i(m,_,w[_]);return m},E=(m,w)=>{var _={};for(var C in m)x.call(m,C)&&w.indexOf(C)<0&&(_[C]=m[C]);if(m!=null&&f)for(var C of f(m))w.indexOf(C)<0&&d.call(m,C)&&(_[C]=m[C]);return _};const O=t.memo(t.forwardRef((m,w)=>{var _=m,{color:C,className:b,gradient:g}=_,v=E(_,["color","className","gradient"]),y,h;const s=(0,a.l4)();let o;if(g){const u=(h=(y=n.WO.get(g)).getColors)==null?void 0:h.call(y,s);u!=null&&u.length?o=`linear-gradient(90deg, ${u.join(", ")})`:o=s.visualization.getColorByName("")}else o=C;const r={background:o,width:"14px",height:"4px",borderRadius:s.shape.radius.default,display:"inline-block",marginRight:"8px"};return t.createElement("div",c({"data-testid":"series-icon",ref:w,className:b,style:r},v))}));O.displayName="SeriesIcon";try{O.displayName="SeriesIcon",O.__docgenInfo={description:"",displayName:"SeriesIcon",props:{color:{defaultValue:null,description:"",name:"color",required:!1,type:{name:"string"}},gradient:{defaultValue:null,description:"",name:"gradient",required:!1,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/components/VizLegend/SeriesIcon.tsx#SeriesIcon"]={docgenInfo:O.__docgenInfo,name:"SeriesIcon",path:"src/components/VizLegend/SeriesIcon.tsx#SeriesIcon"})}catch(m){}},"./src/themes/ThemeContext.tsx":function(se,V,e){"use strict";e.d(V,{HE:function(){return y},Ni:function(){return g},l4:function(){return s},wW:function(){return r}});var t=e("../../../yarn/cache/hoist-non-react-statics-npm-3.3.2-e7b709e6c1-b153827042.zip/node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js"),n=e.n(t),a=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),l=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/createTheme.ts"),f=e("./src/themes/stylesFactory.ts"),x=Object.defineProperty,d=Object.defineProperties,i=Object.getOwnPropertyDescriptors,c=Object.getOwnPropertySymbols,E=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable,m=(p,S,k)=>S in p?x(p,S,{enumerable:!0,configurable:!0,writable:!0,value:k}):p[S]=k,w=(p,S)=>{for(var k in S||(S={}))E.call(S,k)&&m(p,k,S[k]);if(c)for(var k of c(S))O.call(S,k)&&m(p,k,S[k]);return p},_=(p,S)=>d(p,i(S));let C=null;const b=new WeakMap,g=a.createContext((0,l.j)());g.displayName="ThemeContext";const v=p=>{const S=k=>{const D=C||g;return React.createElement(D.Consumer,null,M=>React.createElement(p,_(w({},k),{theme:M.v1})))};return S.displayName=`WithTheme(${p.displayName})`,hoistNonReactStatics(S,p),S},y=p=>{const S=k=>{const D=C||g;return a.createElement(D.Consumer,null,M=>a.createElement(p,_(w({},k),{theme:M})))};return S.displayName=`WithTheme(${p.displayName})`,n()(S,p),S};function h(){return useContext(C||g).v1}function s(){return(0,a.useContext)(C||g)}function o(p){const S=h();let k=b.get(p);return k||(k=stylesFactory(p),b.set(p,k)),k(S)}function r(p){const S=s();let k=b.get(p);return k||(k=(0,f.B)(p),b.set(p,k)),k(S)}const u=p=>(C=React.createContext(p),()=>{C=null});try{g.displayName="ThemeContext",g.__docgenInfo={description:"",displayName:"ThemeContext",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/themes/ThemeContext.tsx#ThemeContext"]={docgenInfo:g.__docgenInfo,name:"ThemeContext",path:"src/themes/ThemeContext.tsx#ThemeContext"})}catch(p){}},"./src/themes/mixins.ts":function(se,V,e){"use strict";e.d(V,{$l:function(){return i},BL:function(){return a},Cq:function(){return c},SV:function(){return E},_Q:function(){return x}});var t=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js");function n(m){return`
    background: ${m.colors.background.secondary};
    &:hover {
      background: ${a(m.colors.background.secondary,m)};
    }
    box-shadow: ${m.components.panel.boxShadow};
    border-radius: ${m.shape.radius.default};
`}function a(m,w){return w.isDark?(0,t.Z)(m).brighten(2).toString():(0,t.Z)(m).darken(2).toString()}function l(m){return`
  background: ${m.colors.background.secondary};
  &:hover {
    background: ${a(m.colors.background.secondary,m)};
  }
  box-shadow: ${m.components.panel.boxShadow};
  border-radius: ${m.shape.radius.default};
`}function f(m){return`
    background: ${a(m.colors.background.secondary,m)};
    color: ${m.colors.text.maxContrast};
`}function x(m){return`only screen and (min-width: ${m})`}const d=m=>m.hasOwnProperty("v1"),i=m=>{const w=d(m),_=w?m.colors.background.canvas:m.colors.bodyBg,C=w?m.colors.primary.main:m.colors.formFocusOutline;return`
  outline: 2px dotted transparent;
  outline-offset: 2px;
  box-shadow: 0 0 0 2px ${_}, 0 0 0px 4px ${C};
  transition-property: outline, outline-offset, box-shadow;
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);`};function c(m){return{outline:"none",boxShadow:"none"}}function E(m){return{outline:"2px dotted transparent",outlineOffset:"2px",boxShadow:`0 0 0 2px ${m.colors.background.canvas}, 0 0 0px 4px ${m.colors.primary.main}`,transitionTimingFunction:"cubic-bezier(0.19, 1, 0.22, 1)",transitionDuration:"0.2s",transitionProperty:"outline, outline-offset, box-shadow"}}const O=m=>`
  overflow: hidden;
  background: ${m.colors.background.secondary};
  box-shadow: ${m.shadows.z2};
  max-width: 800px;
  padding: ${m.spacing(1)};
  border-radius: ${m.shape.radius.default};
  z-index: ${m.zIndex.tooltip};
`},"./src/themes/stylesFactory.ts":function(se,V,e){"use strict";e.d(V,{B:function(){return n}});var t=e("../../../yarn/cache/memoize-one-npm-6.0.0-8b2a2cd020-f185ea69f7.zip/node_modules/memoize-one/dist/memoize-one.esm.js");function n(a){return(0,t.Z)(a)}},"./src/types/icon.ts":function(se,V,e){"use strict";e.d(V,{BI:function(){return a},e7:function(){return l}});var t=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/icon.ts"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/types/dataFrame.ts");const a=()=>Object.keys(t._S);function l(x){return f(x==null?void 0:x.type)}function f(x){if(x)switch(x){case n.fS.time:return"clock-nine";case n.fS.string:return"font";case n.fS.number:return"calculator-alt";case n.fS.boolean:return"toggle-on";case n.fS.trace:return"info-circle";case n.fS.enum:return"list-ol";case n.fS.geo:return"map-marker";case n.fS.other:return"brackets-curly"}return"question-circle"}},"./src/utils/colors.ts":function(se,V,e){"use strict";e.d(V,{bM:function(){return b}});var t=e("../../../yarn/cache/lodash-npm-4.17.21-6382451519-eb835a2e51.zip/node_modules/lodash/lodash.js"),n=e.n(t),a=e("../../../yarn/cache/tinycolor2-npm-1.6.0-8df41252c6-6df4d07fce.zip/node_modules/tinycolor2/esm/tinycolor.js");const l=4,f="rgba(0, 211, 255, 1)",x="rgba(11, 237, 50, 1)",d="rgba(237, 46, 24, 1)",i="rgba(150, 150, 150, 1)",c="rgba(247, 149, 32, 1)",E=.09,O=["#7EB26D","#EAB839","#6ED0E0","#EF843C","#E24D42","#1F78C1","#BA43A9","#705DA0","#508642","#CCA300","#447EBC","#C15C17","#890F02","#0A437C","#6D1F62","#584477","#B7DBAB","#F4D598","#70DBED","#F9BA8F","#F29191","#82B5D8","#E5A8E2","#AEA2E0","#629E51","#E5AC0E","#64B0C8","#E0752D","#BF1B00","#0A50A1","#962D82","#614D93","#9AC48A","#F2C96D","#65C5DB","#F9934E","#EA6460","#5195CE","#D683CE","#806EB7","#3F6833","#967302","#2F575E","#99440A","#58140C","#052B51","#511749","#3F2B5B","#E0F9D7","#FCEACA","#CFFAFF","#F9E2D2","#FCE2DE","#BADFF4","#F9D9F9","#DEDAF7"];function m(v){const y=(0,t.map)(v,w),h=(0,t.sortBy)(y,["h"]),s=(0,t.chunk)(h,l),o=(0,t.map)(s,u=>(0,t.sortBy)(u,"l")),r=(0,t.flattenDeep)((0,t.zip)(...o));return(0,t.map)(r,_)}function w(v){return(0,a.Z)(v).toHsl()}function _(v){return(0,a.Z)(v).toHexString()}function C(v){return tinycolor(v).getBrightness()>180?"rgb(32, 34, 38)":"rgb(247, 248, 250)"}function b(v,y){const h=(0,a.Z)(v),s=h.getBrightness();return h.getAlpha()<.3?y?"rgb(247, 248, 250)":"rgb(32, 34, 38)":s>180?"rgb(32, 34, 38)":"rgb(247, 248, 250)"}let g=m(O)},"./src/utils/file.ts":function(se,V,e){"use strict";e.d(V,{O:function(){return t}});function t(n){const l=n.lastIndexOf("."),f=n.substring(l),x=n.substring(0,l);return x.length<16?n:`${x.substring(0,16)}...${f}`}},"./src/utils/i18n.tsx":function(se,V,e){"use strict";e.d(V,{c:function(){return m},t:function(){return _}});var t=e("../../../yarn/cache/i18next-npm-22.0.4-de33bcaaf1-aa49e6e485.zip/node_modules/i18next/dist/esm/i18next.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("../../.yarn/__virtual__/react-i18next-virtual-ecdf4162e1/2/yarn/cache/react-i18next-npm-12.0.0-bf53cb5be8-f523d7ec5d.zip/node_modules/react-i18next/dist/es/context.js"),l=e("../../.yarn/__virtual__/react-i18next-virtual-ecdf4162e1/2/yarn/cache/react-i18next-npm-12.0.0-bf53cb5be8-f523d7ec5d.zip/node_modules/react-i18next/dist/es/Trans.js"),f=Object.defineProperty,x=Object.getOwnPropertySymbols,d=Object.prototype.hasOwnProperty,i=Object.prototype.propertyIsEnumerable,c=(C,b,g)=>b in C?f(C,b,{enumerable:!0,configurable:!0,writable:!0,value:g}):C[b]=g,E=(C,b)=>{for(var g in b||(b={}))d.call(b,g)&&c(C,g,b[g]);if(x)for(var g of x(b))i.call(b,g)&&c(C,g,b[g]);return C};function O(){t.ZP.options.lng||t.ZP.use(a.Db).init({resources:{},returnEmptyString:!1,lng:"en-US"})}const m=C=>(O(),n.createElement(l.c,E({},C))),w=t.ZP.t,_=(C,b,g)=>(O(),w(C,b,g));try{m.displayName="Trans",m.__docgenInfo={description:"",displayName:"Trans",props:{components:{defaultValue:null,description:"",name:"components",required:!1,type:{name:"readonly ReactElement<any, string | JSXElementConstructor<any>>[] | { readonly [tagName: string]: ReactElement<any, string | JSXElementConstructor<any>>; }"}},count:{defaultValue:null,description:"",name:"count",required:!1,type:{name:"number"}},context:{defaultValue:null,description:"",name:"context",required:!1,type:{name:"string"}},defaults:{defaultValue:null,description:"",name:"defaults",required:!1,type:{name:"string"}},i18n:{defaultValue:null,description:"",name:"i18n",required:!1,type:{name:"i18n"}},i18nKey:{defaultValue:null,description:"",name:"i18nKey",required:!1,type:{name:"unknown"}},ns:{defaultValue:null,description:"",name:"ns",required:!1,type:{name:"Namespace<string>"}},parent:{defaultValue:null,description:"",name:"parent",required:!1,type:{name:"string | ComponentType<any> | null"}},tOptions:{defaultValue:null,description:"",name:"tOptions",required:!1,type:{name:"{}"}},values:{defaultValue:null,description:"",name:"values",required:!1,type:{name:"{}"}},shouldUnescape:{defaultValue:null,description:"",name:"shouldUnescape",required:!1,type:{name:"boolean"}},t:{defaultValue:null,description:"",name:"t",required:!1,type:{name:"TFunction<N, TKPrefix>"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/utils/i18n.tsx#Trans"]={docgenInfo:m.__docgenInfo,name:"Trans",path:"src/utils/i18n.tsx#Trans"})}catch(C){}},"./src/utils/measureText.ts":function(se,V,e){"use strict";e.d(V,{AE:function(){return f},MX:function(){return d},X1:function(){return x}});let t;const n=new Map,a=500;let l="";function f(){return t||(t=document.createElement("canvas").getContext("2d")),t}function x(i,c,E=400){const O=`${E} ${c}px 'Inter'`,m=i+O,w=n.get(m);if(w)return w;const _=f();l!==O&&(_.font=l=O);const C=_.measureText(i);return n.size===a&&n.clear(),n.set(m,C),C}function d(i,c,E,O,m,w){const _=x(i,14,w),C=c/(_.width+2)*14,b=E/O,g=Math.min(b,C);return Math.min(g,m!=null?m:g)}},"./src/utils/reactUtils.ts":function(se,V,e){"use strict";e.d(V,{T:function(){return a},l:function(){return n}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js");function n(l){let f;const x=t.Children.only(l);return"id"in(x==null?void 0:x.props)?f=x.props.id:"inputId"in x.props&&(f=x==null?void 0:x.props.inputId),typeof f=="string"?f:void 0}function a(l,f){if(t.isValidElement(l)||typeof l=="string"||typeof l=="number")return l;if(typeof l=="function")return l(f);throw new Error(`${l} is not a React element nor a function that returns React element`)}},"./src/utils/storybook/DashboardStoryCanvas.tsx":function(se,V,e){"use strict";e.d(V,{C:function(){return l}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx");const l=({children:f})=>{const x=(0,a.l4)(),d=t.iv`
    width: 100%;
    height: 100%;
    padding: 32px;
    background: ${x.colors.background.canvas};
    overflow: auto;
  `;return n.createElement("div",{className:d},f)};l.displayName="DashboardStoryCanvas";try{l.displayName="DashboardStoryCanvas",l.__docgenInfo={description:"",displayName:"DashboardStoryCanvas",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/utils/storybook/DashboardStoryCanvas.tsx#DashboardStoryCanvas"]={docgenInfo:l.__docgenInfo,name:"DashboardStoryCanvas",path:"src/utils/storybook/DashboardStoryCanvas.tsx#DashboardStoryCanvas"})}catch(f){}},"./src/utils/storybook/StoryExample.tsx":function(se,V,e){"use strict";e.d(V,{E:function(){return l}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),a=e("./src/themes/ThemeContext.tsx");const l=({name:f,children:x})=>{const d=(0,a.l4)(),i=t.iv`
    width: 100%;
    padding: 16px;
  `,c=t.iv`
    color: ${d.colors.text.secondary};
    margin-bottom: 16px;
  `;return n.createElement("div",{className:i},n.createElement("h5",{className:c},f),x)};l.displayName="StoryExample";try{l.displayName="StoryExample",l.__docgenInfo={description:"",displayName:"StoryExample",props:{name:{defaultValue:null,description:"",name:"name",required:!0,type:{name:"string"}}}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/utils/storybook/StoryExample.tsx#StoryExample"]={docgenInfo:l.__docgenInfo,name:"StoryExample",path:"src/utils/storybook/StoryExample.tsx#StoryExample"})}catch(f){}},"./src/utils/storybook/icons.ts":function(se,V,e){"use strict";e.d(V,{N:function(){return O}});var t=e("./src/types/icon.ts"),n=Object.defineProperty,a=Object.defineProperties,l=Object.getOwnPropertyDescriptors,f=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,d=Object.prototype.propertyIsEnumerable,i=(m,w,_)=>w in m?n(m,w,{enumerable:!0,configurable:!0,writable:!0,value:_}):m[w]=_,c=(m,w)=>{for(var _ in w||(w={}))x.call(w,_)&&i(m,_,w[_]);if(f)for(var _ of f(w))d.call(w,_)&&i(m,_,w[_]);return m},E=(m,w)=>a(m,l(w));const O=c({None:void 0},(0,t.BI)().reduce((m,w)=>E(c({},m),{[`Icon: ${w}`]:`${w}`}),{}))},"./src/utils/storybook/withCenteredStory.tsx":function(se,V,e){"use strict";e.d(V,{BU:function(){return l},zT:function(){return f}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js");const n=({horizontal:d,vertical:i,children:c})=>t.createElement("div",{style:{minHeight:"100%",width:"100%",display:"flex",alignItems:i?"center":"flex-start",justifyContent:d?"center":"flex-start"}},c),a=d=>React.createElement(n,null,d()),l=d=>t.createElement(n,{horizontal:!0,vertical:!0},d()),f=d=>t.createElement(n,{horizontal:!0},d()),x=d=>React.createElement(n,{vertical:!0},d())},"./src/utils/storybook/withStoryContainer.tsx":function(se,V,e){"use strict";e.d(V,{r:function(){return l}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js");const a=({width:f,height:x,showBoundaries:d,children:i})=>{const c="#f0f0f0",E=f?`${f}px`:"100%",O=x!==0?`${x}px`:"auto",m=d&&t.iv`
      background-color: white;
      background-size: 30px 30px;
      background-position: 0 0, 15px 15px;
      background-image: linear-gradient(
          45deg,
          ${c} 25%,
          transparent 25%,
          transparent 75%,
          ${c} 75%,
          ${c}
        ),
        linear-gradient(45deg, ${c} 25%, transparent 25%, transparent 75%, ${c} 75%, ${c});
    `;return n.createElement("div",{className:(0,t.cx)(t.iv`
          width: ${E};
          height: ${O};
        `,m)},i)},l=(f,x)=>n.createElement(a,{width:x.args.containerWidth,height:x.args.containerHeight,showBoundaries:x.args.showBoundaries},f())},"./src/utils/storybook/withTheme.tsx":function(se,V,e){"use strict";e.d(V,{A:function(){return p},Z:function(){return S}});var t=e("../../../yarn/cache/react-npm-17.0.2-99ba37d931-b254cc17ce.zip/node_modules/react/index.js"),n=e("../../.yarn/__virtual__/storybook-dark-mode-virtual-139efd38dc/2/yarn/cache/storybook-dark-mode-npm-2.1.1-be263896e0-44d6313013.zip/node_modules/storybook-dark-mode/dist/esm/index.js"),a=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/createTheme.ts"),l=e("../../.yarn/__virtual__/@emotion-react-virtual-b3c85744cb/2/yarn/cache/@emotion-react-npm-11.10.6-655b70ad8d-4762042e39.zip/node_modules/@emotion/react/dist/emotion-react.browser.esm.js"),f=e("./src/themes/ThemeContext.tsx");function x(k){return l.iv`
    .panel-options-group {
      border-bottom: 1px solid ${k.colors.border.weak};
    }

    .panel-options-group__header {
      padding: ${k.spacing(1,2,1,1)};
      position: relative;
      display: flex;
      align-items: center;
      cursor: pointer;
      font-weight: 500;
      color: ${k.colors.text.primary};

      &:hover {
        background: ${k.colors.emphasize(k.colors.background.primary,.03)};
      }
    }

    .panel-options-group__icon {
      color: ${k.colors.text.secondary};
      margin-right: ${k.spacing(1)};
      padding: ${k.spacing(0,.9,0,.6)};
    }

    .panel-options-group__title {
      position: relative;
    }

    .panel-options-group__body {
      padding: ${k.spacing(1,2,1,4)};
    }
  `}function d(k){return l.iv`
    .card-section {
      margin-bottom: ${k.spacing(4)};
    }

    .card-list {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      list-style-type: none;
    }

    .card-item {
      display: block;
      height: 100%;
      background: ${k.colors.background.secondary};
      box-shadow: none;
      padding: ${k.spacing(2)};
      border-radius: 4px;

      &:hover {
        background: ${k.colors.emphasize(k.colors.background.secondary,.03)};
      }

      .label-tag {
        margin-left: ${k.spacing(1)};
        font-size: 11px;
        padding: 2px 6px;
      }
    }

    .card-item-body {
      display: flex;
      overflow: hidden;
    }

    .card-item-details {
      overflow: hidden;
    }

    .card-item-header {
      margin-bottom: ${k.spacing(2)};
    }

    .card-item-type {
      color: ${k.colors.text.secondary};
      text-transform: uppercase;
      font-size: ${k.typography.size.sm};
      font-weight: ${k.typography.fontWeightMedium};
    }

    .card-item-badge {
      margin: 6px 0;
    }

    .card-item-notice {
      font-size: ${k.typography.size.sm};
    }

    .card-item-name {
      color: ${k.colors.text.primary};
      overflow: hidden;
      text-overflow: ellipsis;
      width: 100%;
    }

    .card-item-label {
      margin-left: ${k.spacing(1)};
    }

    .card-item-sub-name {
      color: ${k.colors.text.secondary};
      overflow: hidden;
      text-overflow: ellipsis;
      width: 100%;
    }

    .card-item-sub-name--header {
      color: ${k.colors.text.secondary};
      text-transform: uppercase;
      margin-bottom: ${k.spacing(2)};
      font-size: ${k.typography.size.sm};
      font-weight: bold;
    }

    .card-list-layout-grid {
      .card-item-type {
        display: inline-block;
      }

      .card-item-notice {
        font-size: ${k.typography.size.sm};
        display: inline-block;
        margin-left: ${k.spacing(2)};
      }

      .card-item-header-action {
        float: right;
      }

      .card-item-wrapper {
        width: 100%;
        padding: ${k.spacing(0,2,2,0)};
      }

      .card-item-wrapper--clickable {
        cursor: pointer;
      }

      .card-item-figure {
        margin: ${k.spacing(0,2,2,0)}0;
        height: 80px;

        img {
          width: 80px;
        }
      }

      .card-item-name {
        font-size: ${k.typography.h3.fontSize};
      }

      ${k.breakpoints.up("md")} {
        .card-item-wrapper {
          width: 50%;
        }
      }

      ${k.breakpoints.up("lg")} {
        .card-item-wrapper {
          width: 33.333333%;
        }
      }

      &.card-list-layout-grid--max-2-col {
        ${k.breakpoints.up("lg")} {
          .card-item-wrapper {
            width: 50%;
          }
        }
      }
    }

    .card-list-layout-list {
      .card-item-wrapper {
        padding: 0;
        width: 100%;
        margin-bottom: ${k.spacing(1)};
      }

      .card-item-wrapper--clickable {
        cursor: pointer;
      }

      .card-item {
        border-radius: 2px;
      }

      .card-item-header {
        float: right;
        text-align: right;
      }

      .card-item-figure {
        margin: ${k.spacing(0,2,0,0)};
        img {
          width: 48px;
        }
      }

      .card-item-name {
        font-size: ${k.typography.h4.fontSize};
      }

      .card-item-sub-name {
        font-size: ${k.typography.size.sm};
      }

      .layout-selector {
        margin-right: 0;
      }
    }
  `}var i=e("./src/themes/mixins.ts");function c(k){return l.iv`
    html {
      -ms-overflow-style: scrollbar;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      height: 100%;
      font-size: ${k.typography.htmlFontSize}px;
      font-family: ${k.typography.fontFamily};
      line-height: ${k.typography.body.lineHeight};
      font-kerning: normal;
    }

    :root {
      color-scheme: ${k.colors.mode};
    }

    body {
      height: 100%;
      width: 100%;
      position: absolute;
      color: ${k.colors.text.primary};
      background-color: ${k.colors.background.canvas};
      ${E(k.typography.body)}
    }

    h1,
    .h1 {
      ${E(k.typography.h1)}
    }
    h2,
    .h2 {
      ${E(k.typography.h2)}
    }
    h3,
    .h3 {
      ${E(k.typography.h3)}
    }
    h4,
    .h4 {
      ${E(k.typography.h4)}
    }
    h5,
    .h5 {
      ${E(k.typography.h5)}
    }
    h6,
    .h6 {
      ${E(k.typography.h6)}
    }

    p {
      margin: 0 0 ${k.spacing(2)};
    }

    button {
      letter-spacing: ${k.typography.body.letterSpacing};

      &:focus-visible {
        outline: ${(0,i.SV)(k)};
      }
      &:focus {
        outline: none;
      }
    }

    // Ex: 14px base font * 85% = about 12px
    small {
      font-size: ${k.typography.bodySmall.fontSize};
    }

    b,
    strong {
      font-weight: ${k.typography.fontWeightMedium};
    }

    em {
      font-style: italic;
      color: ${k.colors.text.primary};
    }

    cite {
      font-style: normal;
    }

    // Utility classes
    .muted {
      color: ${k.colors.text.secondary};
    }

    a.muted:hover,
    a.muted:focus {
      color: ${k.colors.text.primary};
    }

    .text-warning {
      color: ${k.colors.warning.text};

      &:hover,
      &:focus {
        color: ${k.colors.emphasize(k.colors.warning.text,.15)};
      }
    }

    .text-error {
      color: ${k.colors.error.text};

      &:hover,
      &:focus {
        color: ${k.colors.emphasize(k.colors.error.text,.15)};
      }
    }

    .text-success {
      color: $success-text-color;

      &:hover,
      &:focus {
        color: ${k.colors.emphasize(k.colors.success.text,.15)};
      }
    }

    a {
      cursor: pointer;
      color: ${k.colors.text.primary};
      text-decoration: none;

      &:focus {
        outline: none;
      }

      &:focus-visible {
        ${(0,i.SV)(k)}
      }

      &: [disabled] {
        cursor: default;
        pointer-events: none !important;
      }
    }

    .text-link {
      text-decoration: underline;
    }

    .text-left {
      text-align: left;
    }

    .text-right {
      text-align: right;
    }

    .text-center {
      text-align: center;
    }

    .highlight-search-match {
      background: ${k.components.textHighlight.background};
      color: ${k.components.textHighlight.text};
      padding: 0;
    }
  `}function E(k){return`
    margin: 0;
    font-size: ${k.fontSize};
    line-height: ${k.lineHeight};
    font-weight: ${k.fontWeight};
    letter-spacing: ${k.letterSpacing};
    font-family: ${k.fontFamily};
    margin-bottom: 0.45em;
  `}function O(k){return l.iv`
    input,
    button,
    select,
    textarea {
      font-size: ${k.typography.body.fontSize};
      font-weight: ${k.typography.body.fontWeight};
      line-height: ${k.typography.body.lineHeight};
    }
    input,
    button,
    select,
    textarea {
      font-family: ${k.typography.body.fontFamily};
    }

    input,
    select {
      background-color: ${k.components.input.background};
      color: ${k.components.input.text};
      border: none;
      box-shadow: none;
    }

    textarea {
      height: auto;
    }

    // Reset width of input images, buttons, radios, checkboxes
    input[type='file'],
    input[type='image'],
    input[type='submit'],
    input[type='reset'],
    input[type='button'],
    input[type='radio'],
    input[type='checkbox'] {
      width: auto; // Override of generic input selector
    }
  `}function m(k){return l.iv`
    // TODO copy from _utils.scss
  `}function w(k){const D=k.breakpoints.values.xxl+k.spacing.gridSize*2+k.components.sidemenu.width;return l.iv`
    .grafana-app {
      display: flex;
      align-items: stretch;
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
    }

    .main-view {
      position: relative;
      display: flex;
      flex-direction: column;
      flex-grow: 1;
      height: 100%;
      flex: 1 1 0;
      min-width: 0;
    }

    .page-scrollbar-content {
      display: flex;
      min-height: 100%;
      flex-direction: column;
      width: 100%;
      height: 100%;
    }

    .page-container {
      flex-grow: 1;
      flex-basis: 100%;
      padding-left: ${k.spacing(2)};
      padding-right: ${k.spacing(2)};

      ${k.breakpoints.up("sm")} {
        margin: ${k.spacing(0,1)};
      }

      ${k.breakpoints.up("md")} {
        margin: ${k.spacing(0,2)};
      }

      @media (min-width: ${D}px) {
        max-width: ${k.breakpoints.values.xxl}px;
        margin-left: auto;
        margin-right: auto;
        width: 100%;
      }
    }

    .page-full {
      margin-left: ${k.spacing(2)};
      padding-left: ${k.spacing(2)};
      padding-right: ${k.spacing(2)};
    }

    .page-body {
      padding: ${k.spacing(1)};
      background: ${k.components.panel.background};
      border: 1px solid ${k.components.panel.borderColor};
      margin-bottom: 32px;

      ${k.breakpoints.up("md")} {
        padding: ${k.spacing(2)};
      }

      ${k.breakpoints.up("lg")} {
        padding: ${k.spacing(3)};
      }
    }

    .page-heading {
      font-size: ${k.typography.h4.fontSize};
      margin-top: 0;
      margin-bottom: ${k.spacing(2)};
    }

    .page-action-bar {
      margin-bottom: ${k.spacing(2)};
      display: flex;
      align-items: flex-start;

      > a,
      > button,
      > div:nth-child(2) {
        margin-left: ${k.spacing(2)};
      }
    }

    .page-action-bar--narrow {
      margin-bottom: 0;
    }

    .page-action-bar__spacer {
      width: ${k.spacing(2)};
      flex-grow: 1;
    }

    .page-sub-heading {
      margin-bottom: ${k.spacing(2)};
    }

    .page-sub-heading-icon {
      margin-left: ${k.spacing(1)};
      margin-top: ${k.spacing(.5)};
    }

    .page-hidden {
      display: none;
    }
  `}function _(){const k=(0,f.l4)();return t.createElement(l.xB,{styles:[c(k),O(k),w(k),d(k),x(k),m(k)]})}var C=Object.defineProperty,b=Object.defineProperties,g=Object.getOwnPropertyDescriptors,v=Object.getOwnPropertySymbols,y=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,s=(k,D,M)=>D in k?C(k,D,{enumerable:!0,configurable:!0,writable:!0,value:M}):k[D]=M,o=(k,D)=>{for(var M in D||(D={}))y.call(D,M)&&s(k,M,D[M]);if(v)for(var M of v(D))h.call(D,M)&&s(k,M,D[M]);return k},r=(k,D)=>b(k,g(D));const u=({children:k,handleSassThemeChange:D})=>{const M=(0,a.j)({colors:{mode:(0,n.vs)()?"dark":"light"}});D(M);const I=`#root {
    width: 100%;
    padding: 20px;
    display: flex;
    height: 100%;
    min-height: 100%;
    background: ${M.colors.background.primary};
  }`;return t.createElement(f.Ni.Provider,{value:M},t.createElement(_,null),t.createElement("style",null,I),k)},p=(k,D)=>t.createElement(f.Ni.Consumer,null,M=>t.createElement(k,r(o({},D),{theme:M}))),S=k=>D=>t.createElement(u,{handleSassThemeChange:k},D());try{S.displayName="withTheme",S.__docgenInfo={description:"",displayName:"withTheme",props:{}},typeof STORYBOOK_REACT_CLASSES!="undefined"&&(STORYBOOK_REACT_CLASSES["src/utils/storybook/withTheme.tsx#withTheme"]={docgenInfo:S.__docgenInfo,name:"withTheme",path:"src/utils/storybook/withTheme.tsx#withTheme"})}catch(k){}},"./src/utils/tags.ts":function(se,V,e){"use strict";e.d(V,{Bx:function(){return a},vm:function(){return l}});const t=["#D32D20","#1E72B8","#B240A2","#705DA0","#466803","#497A3C","#3D71AA","#B15415","#890F02","#6E6E6E","#0A437C","#6D1F62","#584477","#4C7A3F","#2F4F4F","#BF1B00","#7662B1","#8A2EB8","#517A00","#000000","#3F6833","#2F575E","#99440A","#AE561A","#0E4AB4","#58140C","#052B51","#511749","#3F2B5B"],n=["#FF7368","#459EE7","#E069CF","#9683C6","#6C8E29","#76AC68","#6AA4E2","#E7823D","#AF3528","#9B9B9B","#3069A2","#934588","#7E6A9D","#88C477","#557575","#E54126","#A694DD","#B054DE","#8FC426","#262626","#658E59","#557D84","#BF6A30","#FF9B53","#3470DA","#7E3A32","#2B5177","#773D6F","#655181"];function a(d=""){const i=f(d.toLowerCase()),c=Math.abs(i%t.length);return l(c)}function l(d){return{color:t[d],borderColor:n[d]}}function f(d){let i=5381;for(let c=0;c<d.length;c++)i=(i<<5)+i+d.charCodeAt(c);return i}var x={getTagColorsFromName:a}},"./src/utils/tooltipUtils.ts":function(se,V,e){"use strict";e.d(V,{k:function(){return a}});var t=e("../../../yarn/cache/@emotion-css-npm-11.10.6-9ef06b7649-010ca5e1d0.zip/node_modules/@emotion/css/dist/emotion-css.esm.js"),n=e("../../.yarn/__virtual__/@grafana-data-virtual-adf1e43f85/1/packages/grafana-data/src/themes/colorManipulator.ts");function a(l,f,x,d,i){return{arrow:t.iv`
      height: 1rem;
      width: 1rem;
      position: absolute;
      pointer-events: none;

      &::before {
        border-style: solid;
        content: '';
        display: block;
        height: 0;
        margin: auto;
        width: 0;
      }

      &::after {
        border-style: solid;
        content: '';
        display: block;
        height: 0;
        margin: auto;
        position: absolute;
        width: 0;
      }
    `,container:t.iv`
      background-color: ${f};
      border-radius: ${l.shape.radius.default};
      border: 1px solid ${x};
      box-shadow: ${l.shadows.z2};
      color: ${d};
      font-size: ${l.typography.bodySmall.fontSize};
      padding: ${l.spacing(i.topBottom,i.rightLeft)};
      transition: opacity 0.3s;
      z-index: ${l.zIndex.tooltip};
      max-width: 400px;
      overflow-wrap: break-word;

      &[data-popper-interactive='false'] {
        pointer-events: none;
      }

      &[data-popper-placement*='bottom'] > div[data-popper-arrow='true'] {
        left: 0;
        margin-top: -7px;
        top: 0;

        &::before {
          border-color: transparent transparent ${x} transparent;
          border-width: 0 8px 7px 8px;
          position: absolute;
          top: -1px;
        }

        &::after {
          border-color: transparent transparent ${f} transparent;
          border-width: 0 8px 7px 8px;
        }
      }

      &[data-popper-placement*='top'] > div[data-popper-arrow='true'] {
        bottom: 0;
        left: 0;
        margin-bottom: -14px;

        &::before {
          border-color: ${x} transparent transparent transparent;
          border-width: 7px 8px 0 7px;
          position: absolute;
          top: 1px;
        }

        &::after {
          border-color: ${f} transparent transparent transparent;
          border-width: 7px 8px 0 7px;
        }
      }

      &[data-popper-placement*='right'] > div[data-popper-arrow='true'] {
        left: 0;
        margin-left: -10px;

        &::before {
          border-color: transparent ${x} transparent transparent;
          border-width: 7px 6px 7px 0;
        }

        &::after {
          border-color: transparent ${f} transparent transparent;
          border-width: 6px 7px 7px 0;
          left: 2px;
          top: 1px;
        }
      }

      &[data-popper-placement*='left'] > div[data-popper-arrow='true'] {
        margin-right: -11px;
        right: 0;

        &::before {
          border-color: transparent transparent transparent ${x};
          border-width: 7px 0 6px 7px;
        }

        &::after {
          border-color: transparent transparent transparent ${f};
          border-width: 6px 0 5px 5px;
          left: 1px;
          top: 1px;
        }
      }

      code {
        border: none;
        display: inline;
        background: ${n._j(f,.1)};
        color: ${d};
      }

      pre {
        background: ${n._j(f,.1)};
        color: ${d};
      }

      a {
        color: ${d};
        text-decoration: underline;
      }

      a:hover {
        text-decoration: none;
      }
    `,headerClose:t.iv`
      color: ${l.colors.text.secondary};
      position: absolute;
      right: ${l.spacing(1)};
      top: ${l.spacing(1.5)};
      background-color: transparent;
      border: 0;
    `,header:t.iv`
      padding-top: ${l.spacing(1)};
      padding-bottom: ${l.spacing(2)};
    `,body:t.iv`
      padding-top: ${l.spacing(1)};
      padding-bottom: ${l.spacing(1)};
    `,footer:t.iv`
      padding-top: ${l.spacing(2)};
      padding-bottom: ${l.spacing(1)};
    `}}},"./storybook-init-framework-entry.js":function(se,V,e){"use strict";var t=e("../../.yarn/__virtual__/@storybook-react-virtual-4e9a8200d6/2/yarn/cache/@storybook-react-npm-6.5.16-e176ae1aaf-c5396e748e.zip/node_modules/@storybook/react/dist/esm/client/index.js")},"../../public/vendor/flot/jquery.flot.crosshair.js":function(){(function(se){var V={crosshair:{mode:null,color:"rgba(170, 0, 0, 0.80)",lineWidth:1}};function e(t){var n={x:-1,y:-1,locked:!1};t.setCrosshair=function(x){if(!x)n.x=-1;else{var d=t.p2c(x);n.x=Math.max(0,Math.min(d.left,t.width())),n.y=Math.max(0,Math.min(d.top,t.height()))}t.triggerRedrawOverlay()},t.clearCrosshair=t.setCrosshair,t.lockCrosshair=function(x){x&&t.setCrosshair(x),n.locked=!0},t.unlockCrosshair=function(){n.locked=!1};function a(f){n.locked||n.x!=-1&&(n.x=-1,t.triggerRedrawOverlay())}function l(f){if(!n.locked){if(t.getSelection&&t.getSelection()){n.x=-1;return}var x=t.offset();n.x=Math.max(0,Math.min(f.pageX-x.left,t.width())),n.y=Math.max(0,Math.min(f.pageY-x.top,t.height())),t.triggerRedrawOverlay()}}t.hooks.bindEvents.push(function(f,x){!f.getOptions().crosshair.mode||(x.mouseout(a),x.mousemove(l))}),t.hooks.drawOverlay.push(function(f,x){var d=f.getOptions().crosshair;if(!!d.mode){var i=f.getPlotOffset();if(x.save(),x.translate(i.left,i.top),n.x!=-1){var c=f.getOptions().crosshair.lineWidth%2?.5:0;if(x.strokeStyle=d.color,x.lineWidth=d.lineWidth,x.lineJoin="round",x.beginPath(),d.mode.indexOf("x")!=-1){var E=Math.floor(n.x)+c;x.moveTo(E,0),x.lineTo(E,f.height())}if(d.mode.indexOf("y")!=-1){var O=Math.floor(n.y)+c;x.moveTo(0,O),x.lineTo(f.width(),O)}x.stroke()}x.restore()}}),t.hooks.shutdown.push(function(f,x){x.unbind("mouseout",a),x.unbind("mousemove",l)})}se.plot.plugins.push({init:e,options:V,name:"crosshair",version:"1.0"})})(jQuery)},"../../public/vendor/flot/jquery.flot.dashes.js":function(){(function(se){function V(e){e.hooks.processDatapoints.push(function(t,n,a){!n.dashes.show||t.hooks.draw.push(function(l,f){var x=l.getPlotOffset(),d=n.xaxis,i=n.yaxis;function c(w,_){var C=a.points,b=a.pointsize,g=null,v=null,y=0,h=!0,s,o;n.dashes.dashLength[0]?(s=n.dashes.dashLength[0],n.dashes.dashLength[1]?o=n.dashes.dashLength[1]:o=s):o=s=n.dashes.dashLength,f.beginPath();for(var r=b;r<C.length;r+=b){let F=function($){var R=Math.sqrt(Math.pow(T-M,2)+Math.pow(j-I,2));if(R<=$)return{deltaX:T-M,deltaY:j-I,distance:R,remainder:$-R};var U=T>M?1:-1,H=j>I?1:-1;return{deltaX:U*Math.sqrt(Math.pow($,2)/(1+Math.pow((j-I)/(T-M),2))),deltaY:H*Math.sqrt(Math.pow($,2)-Math.pow($,2)/(1+Math.pow((j-I)/(T-M),2))),distance:$,remainder:0}};var u=F,p=C[r-b],S=C[r-b+1],k=C[r],D=C[r+1];if(!(p==null||k==null)){if(S<=D&&S<i.min){if(D<i.min)continue;p=(i.min-S)/(D-S)*(k-p)+p,S=i.min}else if(D<=S&&D<i.min){if(S<i.min)continue;k=(i.min-S)/(D-S)*(k-p)+p,D=i.min}if(S>=D&&S>i.max){if(D>i.max)continue;p=(i.max-S)/(D-S)*(k-p)+p,S=i.max}else if(D>=S&&D>i.max){if(S>i.max)continue;k=(i.max-S)/(D-S)*(k-p)+p,D=i.max}if(p<=k&&p<d.min){if(k<d.min)continue;S=(d.min-p)/(k-p)*(D-S)+S,p=d.min}else if(k<=p&&k<d.min){if(p<d.min)continue;D=(d.min-p)/(k-p)*(D-S)+S,k=d.min}if(p>=k&&p>d.max){if(k>d.max)continue;S=(d.max-p)/(k-p)*(D-S)+S,p=d.max}else if(k>=p&&k>d.max){if(p>d.max)continue;D=(d.max-p)/(k-p)*(D-S)+S,k=d.max}(p!=g||S!=v)&&f.moveTo(d.p2c(p)+w,i.p2c(S)+_);var M=d.p2c(p)+w,I=i.p2c(S)+_,T=d.p2c(k)+w,j=i.p2c(D)+_,K;do K=F(y>0?y:h?s:o),(K.deltaX!=0||K.deltaY!=0)&&(h?f.lineTo(M+K.deltaX,I+K.deltaY):f.moveTo(M+K.deltaX,I+K.deltaY)),h=!h,y=K.remainder,M+=K.deltaX,I+=K.deltaY;while(K.distance>0);g=k,v=D}}f.stroke()}f.save(),f.translate(x.left,x.top),f.lineJoin="round";var E=n.dashes.lineWidth,O=n.shadowSize;if(E>0&&O>0){f.lineWidth=O,f.strokeStyle="rgba(0,0,0,0.1)";var m=Math.PI/18;c(Math.sin(m)*(E/2+O/2),Math.cos(m)*(E/2+O/2)),f.lineWidth=O/2,c(Math.sin(m)*(E/2+O/4),Math.cos(m)*(E/2+O/4))}f.lineWidth=E,f.strokeStyle=n.color,E>0&&c(0,0),f.restore()})})}se.plot.plugins.push({init:V,options:{series:{dashes:{show:!1,lineWidth:2,dashLength:10}}},name:"dashes",version:"0.1"})})(jQuery)},"../../public/vendor/flot/jquery.flot.fillbelow.js":function(){(function(se){"use strict";var V={series:{fillBelowTo:null}};function e(t){function n(f,x){var d;for(d=0;d<x.length;++d)if(x[d].id===f.fillBelowTo)return x[d];return null}function a(f,x,d,i,c,E,O,m){var w,_,C,b,g,v;return w=d-f,_=i-x,C=O-c,b=m-E,g=(-_*(f-c)+w*(x-E))/(-C*_+w*b),v=(C*(x-E)-b*(f-c))/(-C*_+w*b),g>=0&&g<=1&&v>=0&&v<=1?[f+v*w,x+v*_]:null}function l(f,x,d){if(d.fillBelowTo===null)return;var i,c,E,O,m,w,_;function C(o,r){x.beginPath(),x.moveTo(d.xaxis.p2c(o)+w.left,d.yaxis.p2c(r)+w.top)}function b(){x.closePath(),x.fill()}function g(){if(E.length/c!==m.length/O)return console.error("Refusing to graph inconsistent number of points"),!1;var o;for(o=0;o<E.length/c;o++)if(E[o*c]!==null&&m[o*O]!==null&&E[o*c]!==m[o*O])return console.error("Refusing to graph points without matching value"),!1;return!0}function v(o,r){console.assert(r>o,"expects the end index to be greater than the start index");var u=o===0||E[o-1]===null||m[o-1]===null,p=!1,S,k;for(S=o;S<r;S++)if(E[S*c+1]===null||m[S*c+1]===null)p=!1,u=!0;else if(E[S*c+1]===m[S*O+1])p=!0,u=!1;else if(E[S*c+1]>m[S*O+1]){u?C(E[S*c],E[S*c+1]):p?C(E[(S-1)*c],E[(S-1)*c+1]):(k=y(S),C(k[0],k[1])),s(S,r);return}else u=!1,p=!1}function y(o){console.assert(o>0,"expects the second point in the series line segment");var r,u;for(r=1;r<m.length/O;r++)if(u=a(E[(o-1)*c],E[(o-1)*c+1],E[o*c],E[o*c+1],m[(r-1)*O],m[(r-1)*O+1],m[r*O],m[r*O+1]),u!==null)return u;console.error("intersectionPoint() should only be called when an intersection happens")}function h(o,r){console.assert(o>=r,"the start should be the rightmost point, and the end should be the leftmost (excluding the equal or intersecting point)");var u;for(u=o;u>=r;u--)x.lineTo(i.xaxis.p2c(m[u*O])+w.left,i.yaxis.p2c(m[u*O+1])+w.top);b()}function s(o,r){console.assert(o<=r,"the start should be the rightmost point, and the end should be the leftmost (excluding the equal or intersecting point)");var u,p;for(u=o;u<r;u++)if(E[u*c+1]===null&&u>o){h(u-1,o),v(u,r);return}else if(E[u*c+1]===m[u*O+1]){h(u,o),v(u,r);return}else if(E[u*c+1]<m[u*O+1]){p=y(u),x.lineTo(d.xaxis.p2c(p[0])+w.left,d.yaxis.p2c(p[1])+w.top),h(u,o),v(u,r);return}else x.lineTo(d.xaxis.p2c(E[u*c])+w.left,d.yaxis.p2c(E[u*c+1])+w.top);h(r,o)}i=n(d,f.getData()),i&&(c=d.datapoints.pointsize,E=d.datapoints.points,O=i.datapoints.pointsize,m=i.datapoints.points,w=f.getPlotOffset(),g()&&(_=se.color.parse(d.color),_.a=.4,_.normalize(),x.fillStyle=_.toString(),v(0,E.length/c)))}t.hooks.drawSeries.push(l)}se.plot.plugins.push({init:e,options:V,name:"fillbelow",version:"0.1.0"})})(jQuery)},"../../public/vendor/flot/jquery.flot.gauge.js":function(){/*!
 * jquery.flot.gauge v1.1.0 *
 *
 * Flot plugin for rendering gauge charts.
 *
 * Copyright (c) 2015 @toyoty99.
 * Licensed under the MIT license.
 */(function(se){var V=function(){var d,i,c,E,O,m,w=function(o,r){d=r,i=o.getPlaceholder(),c=o.getOptions(),E=c.series.gauges,O=o.getData(),m=e(E.debug)};w.prototype.calculateLayout=function(){var o=i.width(),r=i.height(),u=Math.min(O.length,E.layout.columns),p=Math.ceil(O.length/u),S=E.layout.margin,k=E.layout.hMargin,D=E.layout.vMargin,M=(o-S*2-k*(u-1))/u,I=(r-S*2-D*(p-1))/p;if(E.layout.square){var T=Math.min(M,I);M=T,I=T}_(E,M);var j=E.cell.margin,K=0,F=0;E.label.show&&(K=E.label.margin,F=E.label.font.size);var $=0,R=0;E.value.show&&($=E.value.margin,R=E.value.font.size);var U=0;E.threshold.show&&(U=E.threshold.width);var H=0,W=0;E.threshold.label.show&&(H=E.threshold.label.margin,W=E.threshold.label.font.size);for(var oe=M/2-j-U-H*2-W,Q=E.gauge.startAngle,P=E.gauge.endAngle,ae=(P-Q)/100,q=-1,Y=Q;Y<P;Y+=ae)q=Math.max(q,Math.sin(a(Y)));q=Math.max(q,Math.sin(a(P)));var ve=(I-j*2-K*2-F)/(1+q);ve*q<$+R/2&&(ve=I-j*2-K*2-F-$-R/2);var re=ve-H*2-W-U,je=Math.min(oe,re),me=E.gauge.width;me>=je&&(me=Math.max(3,je/3));var ne=H*2+W+U+je,Z=Math.max(ne*(1+q),ne+$+R/2);return{canvasWidth:o,canvasHeight:r,margin:S,hMargin:k,vMargin:D,columns:u,rows:p,cellWidth:M,cellHeight:I,cellMargin:j,labelMargin:K,labelFontSize:F,valueMargin:$,valueFontSize:R,width:me,radius:je,thresholdWidth:U,thresholdLabelMargin:H,thresholdLabelFontSize:W,gaugeOuterHeight:Z}};function _(o,r){o.gauge.width==="auto"&&(o.gauge.width=Math.max(5,r/8)),o.label.margin==="auto"&&(o.label.margin=Math.max(1,r/20)),o.label.font.size==="auto"&&(o.label.font.size=Math.max(5,r/8)),o.value.margin==="auto"&&(o.value.margin=Math.max(1,r/30)),o.value.font.size==="auto"&&(o.value.font.size=Math.max(5,r/9)),o.threshold.width==="auto"&&(o.threshold.width=Math.max(3,r/100)),o.threshold.label.margin==="auto"&&(o.threshold.label.margin=Math.max(3,r/40)),o.threshold.label.font.size==="auto"&&(o.threshold.label.font.size=Math.max(5,r/15))}w.prototype.calculateAutoValues=_,w.prototype.calculateCellLayout=function(o,r,u){var p=t(r.columns,u),S=n(r.columns,u),k=r.margin+(r.cellWidth+r.hMargin)*p,D=r.margin+(r.cellHeight+r.vMargin)*S,M=k+r.cellWidth/2,I=D+r.cellMargin+r.labelMargin*2+r.labelFontSize+r.thresholdWidth+r.thresholdLabelFontSize+r.thresholdLabelMargin*2+r.radius,T=r.cellHeight-r.cellMargin*2-r.labelMargin*2-r.labelFontSize-r.gaugeOuterHeight,j=0;return o.cell.vAlign==="middle"?j=T/2:o.cell.vAlign==="bottom"&&(j=T),I+=j,{col:p,row:S,x:k,y:D,offsetY:j,cellWidth:r.cellWidth,cellHeight:r.cellHeight,cellMargin:r.cellMargin,cx:M,cy:I}},w.prototype.drawBackground=function(o){!E.frame.show||(d.save(),d.strokeStyle=c.grid.borderColor,d.lineWidth=c.grid.borderWidth,d.strokeRect(0,0,o.canvasWidth,o.canvasHeight),c.grid.backgroundColor&&(d.fillStyle=c.grid.backgroundColor,d.fillRect(0,0,o.canvasWidth,o.canvasHeight)),d.restore())},w.prototype.drawCellBackground=function(o,r){d.save(),o.cell.border&&o.cell.border.show&&o.cell.border.color&&o.cell.border.width&&(d.strokeStyle=o.cell.border.color,d.lineWidth=o.cell.border.width,d.strokeRect(r.x,r.y,r.cellWidth,r.cellHeight)),o.cell.background&&o.cell.background.color&&(d.fillStyle=o.cell.background.color,d.fillRect(r.x,r.y,r.cellWidth,r.cellHeight)),d.restore()},w.prototype.drawGauge=function(o,r,u,p,S){var k=o.gauge.shadow.show?o.gauge.shadow.blur:0,D=g(o,S),M=C(o,r,S);y(u.cx,u.cy,r.radius,r.width,a(o.gauge.startAngle),a(o.gauge.endAngle),o.gauge.border.color,o.gauge.border.width,o.gauge.background.color,k),y(u.cx,u.cy,r.radius-1,r.width-2,a(M.a1),a(M.a2),D,1,D,k),o.gauge.neutralValue!=null&&b(o,r,u,D)};function C(o,r,u){let p={};var S=o.gauge.neutralValue;return S!=null?u<S?(p.a1=v(o,r,u),p.a2=v(o,r,S)):(p.a1=v(o,r,S),p.a2=v(o,r,u)):(p.a1=o.gauge.startAngle,p.a2=v(o,r,u)),p}function b(o,r,u,p){var S=(o.gauge.max-o.gauge.min)/600;l(d,u.cx,u.cy,r.radius-2,r.width-4,a(v(o,r,o.gauge.neutralValue-S)),a(v(o,r,o.gauge.neutralValue+S)),p,2,o.gauge.background.color)}function g(o,r){for(var u,p=0;p<o.threshold.values.length;p++){var S=o.threshold.values[p];if(u=S.color,r<S.value)break}return u}function v(o,r,u){var p=o.gauge.startAngle+(o.gauge.endAngle-o.gauge.startAngle)*((u-o.gauge.min)/(o.gauge.max-o.gauge.min));return p<o.gauge.startAngle?p=o.gauge.startAngle:p>o.gauge.endAngle&&(p=o.gauge.endAngle),p}w.prototype.drawThreshold=function(o,r,u){for(var p=o.gauge.startAngle,S=0;S<o.threshold.values.length;S++){var k=o.threshold.values[S];c1=k.color,a2=v(o,r,k.value),l(d,u.cx,u.cy,r.radius+r.thresholdWidth,r.thresholdWidth-2,a(p),a(a2),c1,1,c1),p=a2}};function y(o,r,u,p,S,k,D,M,I,T){S!==k&&(d.save(),l(d,o,r,u,p,S,k,D,M,I),T&&(l(d,o,r,u,p,S,k),d.clip(),d.shadowOffsetX=0,d.shadowOffsetY=0,d.shadowBlur=10,d.shadowColor="gray",l(d,o,r,u+1,p+2,S,k,D,1)),d.restore())}w.prototype.drawLable=function(o,r,u,p,S){s(u.cx,u.y+u.cellMargin+r.labelMargin+u.offsetY,"flotGaugeLabel"+p,o.label.formatter?o.label.formatter(S.label,S.data[0][1]):text,o.label)},w.prototype.drawValue=function(o,r,u,p,S){s(u.cx,u.cy-o.value.font.size/2,"flotGaugeValue"+p,o.value.formatter?o.value.formatter(S.label,S.data[0][1]):text,o.value)},w.prototype.drawThresholdValues=function(o,r,u,p){h(o,r,u,"Min"+p,o.gauge.min,o.gauge.startAngle),h(o,r,u,"Max"+p,o.gauge.max,o.gauge.endAngle);for(var S=0;S<o.threshold.values.length;S++){var k=o.threshold.values[S];if(k.value>o.gauge.min&&k.value<o.gauge.max){var D=v(o,r,k.value);h(o,r,u,p+"_"+S,k.value,D)}}var M=o.gauge.neutralValue;M!=null&&M>o.gauge.min&&M<o.gauge.max&&h(o,r,u,"Neutral"+p,M,v(o,r,M))};function h(o,r,u,p,S,k){s(u.cx+(r.thresholdLabelMargin+r.thresholdLabelFontSize/2+r.radius)*Math.cos(a(k)),u.cy+(r.thresholdLabelMargin+r.thresholdLabelFontSize/2+r.radius)*Math.sin(a(k)),"flotGaugeThresholdValue"+p,o.threshold.label.formatter?o.threshold.label.formatter(S):S,o.threshold.label,k)}function s(o,r,u,p,S,k){var D=se(i).find("#"+u),M=D.length;M||(D=se("<span></span>"),D.attr("id",u),D.attr("class","flot-temp-elem"),i.append(D)),D.css("position","absolute"),D.css("top",r+"px"),D.css("white-space","nowrap"),S.font.size&&D.css("font-size",S.font.size+"px"),S.font.family&&D.css("font-family",S.font.family),S.color&&D.css("color",S.color),S.background.color&&D.css("background-color",S.background.color),S.background.opacity&&D.css("opacity",S.background.opacity),D.text(p),D.css("left",o+"px"),D.css("left",parseInt(D.css("left"))-D.width()/2+"px"),!M&&k&&(D.css("top",parseInt(D.css("top"))-D.height()/2+"px"),D.css("transform","rotate("+(180*k+90)+"deg)"))}return w}();function e(d){return typeof Logger!="undefined"?new Logger(d):null}function t(d,i){return i%d}function n(d,i){return Math.floor(i/d)}function a(d){return d*Math.PI}function l(d,i,c,E,O,m,w,_,C,b){if(m!==w){var g=!1;d.save(),d.beginPath(),d.arc(i,c,E,m,w,g),d.lineTo(i+(E-O)*Math.cos(w),c+(E-O)*Math.sin(w)),d.arc(i,c,E-O,w,m,!g),d.closePath(),C&&(d.lineWidth=C),_&&(d.strokeStyle=_,d.stroke()),b&&(d.fillStyle=b,d.fill()),d.restore()}}function f(d){d.hooks.processOptions.push(function(i,c){var E=e(c.series.gauges.debug);c.series.gauges.show&&(c.grid.show=!1,c.legend.show=!1);var O=c.series.gauges.threshold.values;O.sort(function(m,w){return m.value<w.value?-1:m.value>w.value?1:0})}),d.hooks.draw.push(function(i,c){var E=i.getOptions(),O=E.series.gauges,m=e(O.debug);if(!!O.show){var w=i.getData();if(!(!w||!w.length)){var _=new V(i,c),C=_.calculateLayout();O.debug.layout,_.drawBackground(C);for(var b=0;b<w.length;b++){var g=w[b],v=se.extend({},O,g.gauges);g.gauges&&_.calculateAutoValues(v,C.cellWidth);var y=_.calculateCellLayout(v,C,b);_.drawCellBackground(v,y),v.debug.layout,v.label.show&&_.drawLable(v,C,y,b,g),_.drawGauge(v,C,y,g.label,g.data[0][1]),v.threshold.show&&_.drawThreshold(v,C,y),v.threshold.label.show&&_.drawThresholdValues(v,C,y,b),v.value.show&&_.drawValue(v,C,y,b,g)}}}})}var x={series:{gauges:{debug:{log:!1,layout:!1,alert:!1},show:!1,layout:{margin:5,columns:3,hMargin:5,vMargin:5,square:!1},frame:{show:!0},cell:{background:{color:null},border:{show:!0,color:"black",width:1},margin:5,vAlign:"middle"},gauge:{width:"auto",startAngle:.9,endAngle:2.1,min:0,max:100,background:{color:"white"},border:{color:"lightgray",width:2},shadow:{show:!0,blur:5}},label:{show:!0,margin:"auto",background:{color:null,opacity:0},font:{size:"auto",family:"sans-serif"},color:null,formatter:function(d,i){return d}},value:{show:!0,margin:"auto",background:{color:null,opacity:0},font:{size:"auto",family:"sans-serif"},color:null,formatter:function(d,i){return parseInt(i)}},threshold:{show:!0,width:"auto",label:{show:!0,margin:"auto",background:{color:null,opacity:0},font:{size:"auto",family:",sans-serif"},color:null,formatter:function(d){return d}},values:[]}}}};se.plot.plugins.push({init:f,options:x,name:"gauge",version:"1.1.0"})})(jQuery)},"../../public/vendor/flot/jquery.flot.js":function(){(function(se){se.color={},se.color.make=function(e,t,n,a){var l={};return l.r=e||0,l.g=t||0,l.b=n||0,l.a=a!=null?a:1,l.add=function(f,x){for(var d=0;d<f.length;++d)l[f.charAt(d)]+=x;return l.normalize()},l.scale=function(f,x){for(var d=0;d<f.length;++d)l[f.charAt(d)]*=x;return l.normalize()},l.toString=function(){return l.a>=1?"rgb("+[l.r,l.g,l.b].join(",")+")":"rgba("+[l.r,l.g,l.b,l.a].join(",")+")"},l.normalize=function(){function f(x,d,i){return d<x?x:d>i?i:d}return l.r=f(0,parseInt(l.r),255),l.g=f(0,parseInt(l.g),255),l.b=f(0,parseInt(l.b),255),l.a=f(0,l.a,1),l},l.clone=function(){return se.color.make(l.r,l.b,l.g,l.a)},l.normalize()},se.color.extract=function(e,t){var n;do{if(n=e.css(t).toLowerCase(),n!=""&&n!="transparent")break;e=e.parent()}while(e.length&&!se.nodeName(e.get(0),"body"));return n=="rgba(0, 0, 0, 0)"&&(n="transparent"),se.color.parse(n)},se.color.parse=function(e){var t,n=se.color.make;if(t=/rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(e))return n(parseInt(t[1],10),parseInt(t[2],10),parseInt(t[3],10));if(t=/rgba\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]+(?:\.[0-9]+)?)\s*\)/.exec(e))return n(parseInt(t[1],10),parseInt(t[2],10),parseInt(t[3],10),parseFloat(t[4]));if(t=/rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(e))return n(parseFloat(t[1])*2.55,parseFloat(t[2])*2.55,parseFloat(t[3])*2.55);if(t=/rgba\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\s*\)/.exec(e))return n(parseFloat(t[1])*2.55,parseFloat(t[2])*2.55,parseFloat(t[3])*2.55,parseFloat(t[4]));if(t=/#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(e))return n(parseInt(t[1],16),parseInt(t[2],16),parseInt(t[3],16));if(t=/#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(e))return n(parseInt(t[1]+t[1],16),parseInt(t[2]+t[2],16),parseInt(t[3]+t[3],16));var a=se.trim(e).toLowerCase();return a=="transparent"?n(255,255,255,0):(t=V[a]||[0,0,0],n(t[0],t[1],t[2]))};var V={aqua:[0,255,255],azure:[240,255,255],beige:[245,245,220],black:[0,0,0],blue:[0,0,255],brown:[165,42,42],cyan:[0,255,255],darkblue:[0,0,139],darkcyan:[0,139,139],darkgrey:[169,169,169],darkgreen:[0,100,0],darkkhaki:[189,183,107],darkmagenta:[139,0,139],darkolivegreen:[85,107,47],darkorange:[255,140,0],darkorchid:[153,50,204],darkred:[139,0,0],darksalmon:[233,150,122],darkviolet:[148,0,211],fuchsia:[255,0,255],gold:[255,215,0],green:[0,128,0],indigo:[75,0,130],khaki:[240,230,140],lightblue:[173,216,230],lightcyan:[224,255,255],lightgreen:[144,238,144],lightgrey:[211,211,211],lightpink:[255,182,193],lightyellow:[255,255,224],lime:[0,255,0],magenta:[255,0,255],maroon:[128,0,0],navy:[0,0,128],olive:[128,128,0],orange:[255,165,0],pink:[255,192,203],purple:[128,0,128],violet:[128,0,128],red:[255,0,0],silver:[192,192,192],white:[255,255,255],yellow:[255,255,0]}})(jQuery),function(se){var V=Object.prototype.hasOwnProperty;se.fn.detach||(se.fn.detach=function(){return this.each(function(){this.parentNode&&this.parentNode.removeChild(this)})});function e(a,l){var f=l.children("."+a)[0];if(f==null&&(f=document.createElement("canvas"),f.className=a,se(f).css({direction:"ltr",position:"absolute",left:0,top:0}).appendTo(l),!f.getContext))if(window.G_vmlCanvasManager)f=window.G_vmlCanvasManager.initElement(f);else throw new Error("Canvas is not available. If you're using IE with a fall-back such as Excanvas, then there's either a mistake in your conditional include, or the page has no DOCTYPE and is rendering in Quirks Mode.");this.element=f;var x=this.context=f.getContext("2d"),d=window.devicePixelRatio||1,i=x.webkitBackingStorePixelRatio||x.mozBackingStorePixelRatio||x.msBackingStorePixelRatio||x.oBackingStorePixelRatio||x.backingStorePixelRatio||1;this.pixelRatio=d/i,this.resize(l.width(),l.height()),this.textContainer=null,this.text={},this._textCache={},this._textSizeCache=window.flotTextSizeCache=window.flotTextSizeCache||{}}e.prototype.resize=function(a,l){if(a<=0||l<=0)throw new Error("Invalid dimensions for plot, width = "+a+", height = "+l);var f=this.element,x=this.context,d=this.pixelRatio;this.width!=a&&(f.width=a*d,f.style.width=a+"px",this.width=a),this.height!=l&&(f.height=l*d,f.style.height=l+"px",this.height=l),x.restore(),x.save(),x.scale(d,d)},e.prototype.clear=function(){this.context.clearRect(0,0,this.width,this.height)},e.prototype.render=function(){var a=this._textCache;for(var l in a)if(V.call(a,l)){var f=this.getTextLayer(l),x=a[l];f.hide();for(var d in x)if(V.call(x,d)){var i=x[d];for(var c in i)if(V.call(i,c)){for(var E=i[c].positions,O=0,m;m=E[O];O++)m.active?m.rendered||(f.append(m.element),m.rendered=!0):(E.splice(O--,1),m.rendered&&m.element.detach());E.length==0&&delete i[c]}}f.show()}},e.prototype.getTextLayer=function(a){var l=this.text[a];return l==null&&(this.textContainer==null&&(this.textContainer=se("<div class='flot-text flot-temp-elem'></div>").css({position:"absolute",top:0,left:0,bottom:0,right:0,"font-size":"smaller",color:"#545454"}).insertAfter(this.element)),l=this.text[a]=se("<div></div>").addClass(a).css({position:"absolute",top:0,left:0,bottom:0,right:0}).appendTo(this.textContainer)),l},e.prototype.getTextInfo=function(a,l,f,x,d){var i,c,E,O;if(l=""+l,typeof f=="object"?i=f.style+" "+f.variant+" "+f.weight+" "+f.size+"px/"+f.lineHeight+"px "+f.family:i=f,c=this._textCache[a],c==null&&(c=this._textCache[a]={}),E=c[i],E==null&&(E=c[i]={}),O=E[l],O==null){var m=se("<div></div>").html(l).css({position:"absolute","max-width":d,top:-9999}).appendTo(this.getTextLayer(a));typeof f=="object"?m.css({font:i,color:f.color}):typeof f=="string"&&m.addClass(f),O=E[l]={element:m,positions:[]};var w=this._textSizeCache[l];w?(O.width=w.width,O.height=w.height):(O.width=m.outerWidth(!0),O.height=m.outerHeight(!0),this._textSizeCache[l]={width:O.width,height:O.height}),m.detach()}return O},e.prototype.addText=function(a,l,f,x,d,i,c,E,O){var m=this.getTextInfo(a,x,d,i,c),w=m.positions;E=="center"?l-=m.width/2:E=="right"&&(l-=m.width),O=="middle"?f-=m.height/2:O=="bottom"&&(f-=m.height);for(var _=0,C;C=w[_];_++)if(C.x==l&&C.y==f){C.active=!0;return}C={active:!0,rendered:!1,element:w.length?m.element.clone():m.element,x:l,y:f},w.push(C),C.element.css({top:Math.round(f),left:Math.round(l),"text-align":E})},e.prototype.removeText=function(a,l,f,x,d,i){if(x==null){var c=this._textCache[a];if(c!=null){for(var E in c)if(V.call(c,E)){var O=c[E];for(var m in O)if(V.call(O,m))for(var w=O[m].positions,_=0,C;C=w[_];_++)C.active=!1}}}else for(var w=this.getTextInfo(a,x,d,i).positions,_=0,C;C=w[_];_++)C.x==l&&C.y==f&&(C.active=!1)};function t(a,l,f,x){var d=[],i={colors:["#edc240","#afd8f8","#cb4b4b","#4da74d","#9440ed"],legend:{show:!0,noColumns:1,labelFormatter:null,labelBoxBorderColor:"#ccc",container:null,position:"ne",margin:5,backgroundColor:null,backgroundOpacity:.85,sorted:null},xaxis:{show:null,position:"bottom",mode:null,font:null,color:null,tickColor:null,transform:null,inverseTransform:null,min:null,max:null,autoscaleMargin:null,ticks:null,tickFormatter:null,labelWidth:null,labelHeight:null,reserveSpace:null,tickLength:null,alignTicksWithAxis:null,tickDecimals:null,tickSize:null,minTickSize:null},yaxis:{autoscaleMargin:.02,position:"left"},xaxes:[],yaxes:[],series:{points:{show:!1,radius:3,lineWidth:2,fill:!0,fillColor:"#ffffff",symbol:"circle"},lines:{lineWidth:2,fill:!1,fillColor:null,steps:!1},bars:{show:!1,lineWidth:2,barWidth:1,fill:!0,fillColor:null,align:"left",horizontal:!1,zero:!0},shadowSize:3,highlightColor:null},grid:{show:!0,aboveData:!1,color:"#545454",backgroundColor:null,borderColor:null,tickColor:null,margin:0,labelMargin:5,eventSectionHeight:0,axisMargin:8,borderWidth:2,minBorderMargin:null,markings:null,markingsColor:"#f4f4f4",markingsLineWidth:2,clickable:!1,hoverable:!1,autoHighlight:!0,mouseActiveRadius:10},interaction:{redrawOverlayInterval:16.666666666666668},hooks:{}},c=null,E=null,O=null,m=null,w=null,_=[],C=[],b={left:0,right:0,top:0,bottom:0},g=0,v=0,y={processOptions:[],processRawData:[],processDatapoints:[],processOffset:[],processRange:[],drawBackground:[],drawSeries:[],draw:[],bindEvents:[],drawOverlay:[],shutdown:[]},h=this;h.setData=u,h.setupGrid=Q,h.draw=re,h.getPlaceholder=function(){return a},h.getCanvas=function(){return c.element},h.getPlotOffset=function(){return b},h.width=function(){return g},h.height=function(){return v},h.offset=function(){var ee=O.offset();return ee.left+=b.left,ee.top+=b.top,ee},h.getData=function(){return d},h.getAxes=function(){var ee={},_e;return se.each(_.concat(C),function(ge,de){de&&(ee[de.direction+(de.n!=1?de.n:"")+"axis"]=de)}),ee},h.getXAxes=function(){return _},h.getYAxes=function(){return C},h.c2p=D,h.p2c=M,h.getOptions=function(){return i},h.highlight=We,h.unhighlight=Ue,h.triggerRedrawOverlay=fe,h.pointOffset=function(ee){return{left:parseInt(_[S(ee,"x")-1].p2c(+ee.x)+b.left,10),top:parseInt(C[S(ee,"y")-1].p2c(+ee.y)+b.top,10)}},h.shutdown=$,h.destroy=function(){$(),a.removeData("plot").empty(),d=[],i=null,c=null,E=null,O=null,m=null,w=null,_=[],C=[],y=null,Ie=[],h=null},h.resize=function(){var ee=a.width(),_e=a.height();c.resize(ee,_e),E.resize(ee,_e)},h.hooks=y,o(h),r(f),K(),u(l),Q(),re(),F();function s(ee,_e){_e=[h].concat(_e);for(var ge=0;ge<ee.length;++ge)ee[ge].apply(this,_e)}function o(){for(var ee={Canvas:e},_e=0;_e<x.length;++_e){var ge=x[_e];ge.init(h,ee),ge.options&&se.extend(!0,i,ge.options)}}function r(ee){se.extend(!0,i,ee),ee&&ee.colors&&(i.colors=ee.colors),i.xaxis.color==null&&(i.xaxis.color=se.color.parse(i.grid.color).scale("a",.22).toString()),i.yaxis.color==null&&(i.yaxis.color=se.color.parse(i.grid.color).scale("a",.22).toString()),i.xaxis.tickColor==null&&(i.xaxis.tickColor=i.grid.tickColor||i.xaxis.color),i.yaxis.tickColor==null&&(i.yaxis.tickColor=i.grid.tickColor||i.yaxis.color),i.grid.borderColor==null&&(i.grid.borderColor=i.grid.color),i.grid.tickColor==null&&(i.grid.tickColor=se.color.parse(i.grid.color).scale("a",.22).toString());var _e,ge,de,Ee=a.css("font-size"),ze=Ee?+Ee.replace("px",""):13,le={style:a.css("font-style"),size:Math.round(.8*ze),variant:a.css("font-variant"),weight:a.css("font-weight"),family:a.css("font-family")};for(de=i.xaxes.length||1,_e=0;_e<de;++_e)ge=i.xaxes[_e],ge&&!ge.tickColor&&(ge.tickColor=ge.color),ge=se.extend(!0,{},i.xaxis,ge),i.xaxes[_e]=ge,ge.font&&(ge.font=se.extend({},le,ge.font),ge.font.color||(ge.font.color=ge.color),ge.font.lineHeight||(ge.font.lineHeight=Math.round(ge.font.size*1.15)));for(de=i.yaxes.length||1,_e=0;_e<de;++_e)ge=i.yaxes[_e],ge&&!ge.tickColor&&(ge.tickColor=ge.color),ge=se.extend(!0,{},i.yaxis,ge),i.yaxes[_e]=ge,ge.font&&(ge.font=se.extend({},le,ge.font),ge.font.color||(ge.font.color=ge.color),ge.font.lineHeight||(ge.font.lineHeight=Math.round(ge.font.size*1.15)));for(i.xaxis.noTicks&&i.xaxis.ticks==null&&(i.xaxis.ticks=i.xaxis.noTicks),i.yaxis.noTicks&&i.yaxis.ticks==null&&(i.yaxis.ticks=i.yaxis.noTicks),i.x2axis&&(i.xaxes[1]=se.extend(!0,{},i.xaxis,i.x2axis),i.xaxes[1].position="top",i.x2axis.min==null&&(i.xaxes[1].min=null),i.x2axis.max==null&&(i.xaxes[1].max=null)),i.y2axis&&(i.yaxes[1]=se.extend(!0,{},i.yaxis,i.y2axis),i.yaxes[1].position="right",i.y2axis.min==null&&(i.yaxes[1].min=null),i.y2axis.max==null&&(i.yaxes[1].max=null)),i.grid.coloredAreas&&(i.grid.markings=i.grid.coloredAreas),i.grid.coloredAreasColor&&(i.grid.markingsColor=i.grid.coloredAreasColor),i.lines&&se.extend(!0,i.series.lines,i.lines),i.points&&se.extend(!0,i.series.points,i.points),i.bars&&se.extend(!0,i.series.bars,i.bars),i.shadowSize!=null&&(i.series.shadowSize=i.shadowSize),i.highlightColor!=null&&(i.series.highlightColor=i.highlightColor),_e=0;_e<i.xaxes.length;++_e)I(_,_e+1).options=i.xaxes[_e];for(_e=0;_e<i.yaxes.length;++_e)I(C,_e+1).options=i.yaxes[_e];for(var ye in y)i.hooks[ye]&&i.hooks[ye].length&&(y[ye]=y[ye].concat(i.hooks[ye]));s(y.processOptions,[i])}function u(ee){d=p(ee),T(),j()}function p(ee){for(var _e=[],ge=0;ge<ee.length;++ge){var de=se.extend(!0,{},i.series);ee[ge].data!=null?(de.data=ee[ge].data,delete ee[ge].data,se.extend(!0,de,ee[ge]),ee[ge].data=de.data):de.data=ee[ge],_e.push(de)}return _e}function S(ee,_e){var ge=ee[_e+"axis"];return typeof ge=="object"&&(ge=ge.n),typeof ge!="number"&&(ge=1),ge}function k(){return se.grep(_.concat(C),function(ee){return ee})}function D(ee){var _e={},ge,de;for(ge=0;ge<_.length;++ge)de=_[ge],de&&(_e["x"+de.n]=de.c2p(ee.left));for(ge=0;ge<C.length;++ge)de=C[ge],de&&(_e["y"+de.n]=de.c2p(ee.top));return _e.x1!==void 0&&(_e.x=_e.x1),_e.y1!==void 0&&(_e.y=_e.y1),_e}function M(ee){var _e={},ge,de,Ee;for(ge=0;ge<_.length;++ge)if(de=_[ge],de&&de.used&&(Ee="x"+de.n,ee[Ee]==null&&de.n==1&&(Ee="x"),ee[Ee]!=null)){_e.left=de.p2c(ee[Ee]);break}for(ge=0;ge<C.length;++ge)if(de=C[ge],de&&de.used&&(Ee="y"+de.n,ee[Ee]==null&&de.n==1&&(Ee="y"),ee[Ee]!=null)){_e.top=de.p2c(ee[Ee]);break}return _e}function I(ee,_e){return ee[_e-1]||(ee[_e-1]={n:_e,direction:ee==_?"x":"y",options:se.extend(!0,{},ee==_?i.xaxis:i.yaxis)}),ee[_e-1]}function T(){var ee=d.length,_e=-1,ge;for(ge=0;ge<d.length;++ge){var de=d[ge].color;de!=null&&(ee--,typeof de=="number"&&de>_e&&(_e=de))}ee<=_e&&(ee=_e+1);var Ee,ze=[],le=i.colors,ye=le.length,Se=0;for(ge=0;ge<ee;ge++)Ee=se.color.parse(le[ge%ye]||"#666"),ge%ye==0&&ge&&(Se>=0?Se<.5?Se=-Se-.2:Se=0:Se=-Se),ze[ge]=Ee.scale("rgb",1+Se);var Be=0,Xe;for(ge=0;ge<d.length;++ge){if(Xe=d[ge],Xe.color==null?(Xe.color=ze[Be].toString(),++Be):typeof Xe.color=="number"&&(Xe.color=ze[Xe.color].toString()),Xe.lines.show==null){var st,mt=!0;for(st in Xe)if(Xe[st]&&Xe[st].show){mt=!1;break}mt&&(Xe.lines.show=!0)}Xe.lines.zero==null&&(Xe.lines.zero=!!Xe.lines.fill),Xe.xaxis=I(_,S(Xe,"x")),Xe.yaxis=I(C,S(Xe,"y"))}}function j(){var ee=Number.POSITIVE_INFINITY,_e=Number.NEGATIVE_INFINITY,ge=Number.MAX_VALUE,de,Ee,ze,le,ye,Se,Be,Xe,st,mt,rt,lt,ft,St,gt,pt;function ut(hn,fn,Hn){fn<hn.datamin&&fn!=-ge&&(hn.datamin=fn),Hn>hn.datamax&&Hn!=ge&&(hn.datamax=Hn)}for(se.each(k(),function(hn,fn){fn.datamin=ee,fn.datamax=_e,fn.used=!1}),de=0;de<d.length;++de)Se=d[de],Se.datapoints={points:[]},s(y.processRawData,[Se,Se.data,Se.datapoints]);for(de=0;de<d.length;++de){if(Se=d[de],gt=Se.data,pt=Se.datapoints.format,!pt){if(pt=[],pt.push({x:!0,number:!0,required:!0}),pt.push({y:!0,number:!0,required:!0}),Se.stack||Se.bars.show||Se.lines.show&&Se.lines.fill){var Ot=!!(Se.bars.show&&Se.bars.zero||Se.lines.show&&Se.lines.zero);pt.push({y:!0,number:!0,required:!1,defaultValue:0,autoscale:Ot}),Se.bars.horizontal&&(delete pt[pt.length-1].y,pt[pt.length-1].x=!0)}Se.datapoints.format=pt}if(Se.datapoints.pointsize==null){Se.datapoints.pointsize=pt.length,Xe=Se.datapoints.pointsize,Be=Se.datapoints.points;var Wt=Se.lines.show&&Se.lines.steps;for(Se.xaxis.used=Se.yaxis.used=!0,Ee=ze=0;Ee<gt.length;++Ee,ze+=Xe){St=gt[Ee];var Ht=St==null;if(!Ht)for(le=0;le<Xe;++le)lt=St[le],ft=pt[le],ft&&(ft.number&&lt!=null&&(lt=+lt,isNaN(lt)?lt=null:lt==1/0?lt=ge:lt==-1/0&&(lt=-ge)),lt==null&&(ft.required&&(Ht=!0),ft.defaultValue!=null&&(lt=ft.defaultValue))),Be[ze+le]=lt;if(Ht)for(le=0;le<Xe;++le)lt=Be[ze+le],lt!=null&&(ft=pt[le],ft.autoscale!==!1&&(ft.x&&ut(Se.xaxis,lt,lt),ft.y&&ut(Se.yaxis,lt,lt))),Be[ze+le]=null;if(Wt&&ze>0&&(!Ht||Be[ze-Xe]!=null)){for(le=0;le<Xe;++le)Be[ze+Xe+le]=Be[ze+le];Be[ze+1]=Be[ze-Xe+1]||0,Ht&&(Be[ze]=St[0]),ze+=Xe}}}}for(de=0;de<d.length;++de){if(Se=d[de],Be=Se.datapoints.points,Xe=Se.datapoints.pointsize,Se.transform==="negative-Y")for(Ee=0;Ee<Be.length;Ee+=Xe)Be[Ee]!=null&&(lt=Be[Ee+1],Be[Ee+1]=-lt);s(y.processDatapoints,[Se,Se.datapoints])}for(de=0;de<d.length;++de){Se=d[de],Be=Se.datapoints.points,Xe=Se.datapoints.pointsize,pt=Se.datapoints.format;var on=ee,un=ee,mn=_e,wn=_e;for(Ee=0;Ee<Be.length;Ee+=Xe)if(Be[Ee]!=null)for(le=0;le<Xe;++le)lt=Be[Ee+le],ft=pt[le],!(!ft||ft.autoscale===!1||lt==ge||lt==-ge)&&(ft.x&&(lt<on&&(on=lt),lt>mn&&(mn=lt)),ft.y&&(lt<un&&(un=lt),lt>wn&&(wn=lt)));if(Se.bars.show){var Gt;switch(Se.bars.align){case"left":Gt=0;break;case"right":Gt=-Se.bars.barWidth;break;default:Gt=-Se.bars.barWidth/2}Se.bars.horizontal?(un+=Gt,wn+=Gt+Se.bars.barWidth):(on+=Gt,mn+=Gt+Se.bars.barWidth)}ut(Se.xaxis,on,mn),ut(Se.yaxis,un,wn)}se.each(k(),function(hn,fn){fn.datamin==ee&&(fn.datamin=null),fn.datamax==_e&&(fn.datamax=null)})}function K(){a.find(".flot-temp-elem").remove(),a.css("position")=="static"&&a.css("position","relative"),c=new e("flot-base",a),E=new e("flot-overlay",a),m=c.context,w=E.context,O=se(E.element).unbind();var ee=a.data("plot");ee&&(ee.shutdown(),E.clear()),a.data("plot",h)}function F(){i.grid.hoverable&&(O.mousemove(Ze),O.bind("mouseleave",Oe),se(document).bind("touchend",pe)),i.grid.clickable&&O.click(ce),s(y.bindEvents,[O])}function $(){qe&&clearTimeout(qe),O.unbind("mousemove",Ze),O.unbind("mouseleave",Oe),O.unbind("click",ce),se(document).unbind("touchend",pe),s(y.shutdown,[O])}function R(ee){function _e(le){return le}var ge,de,Ee=ee.options.transform||_e,ze=ee.options.inverseTransform;ee.direction=="x"?(ge=ee.scale=g/Math.abs(Ee(ee.max)-Ee(ee.min)),de=Math.min(Ee(ee.max),Ee(ee.min))):(ge=ee.scale=v/Math.abs(Ee(ee.max)-Ee(ee.min)),ge=-ge,de=Math.max(Ee(ee.max),Ee(ee.min))),Ee==_e?ee.p2c=function(le){return(le-de)*ge}:ee.p2c=function(le){return(Ee(le)-de)*ge},ze?ee.c2p=function(le){return ze(de+le/ge)}:ee.c2p=function(le){return de+le/ge}}function U(ee){for(var _e=ee.options,ge=ee.ticks||[],de=_e.labelWidth||0,Ee=_e.labelHeight||0,ze=de||(ee.direction=="x"?Math.floor(c.width/(ge.length||1)):null),le=ee.direction+"Axis "+ee.direction+ee.n+"Axis",ye="flot-"+ee.direction+"-axis flot-"+ee.direction+ee.n+"-axis "+le,Se=_e.font||"flot-tick-label tickLabel",Be=0;Be<ge.length;++Be){var Xe=ge[Be];if(!!Xe.label){var st=c.getTextInfo(ye,Xe.label,Se,null,ze);de=Math.max(de,st.width+1),Ee=Math.max(Ee,st.height)}}ee.labelWidth=_e.labelWidth||de,ee.labelHeight=_e.labelHeight||Ee}function H(ee){var _e=ee.labelWidth,ge=ee.labelHeight,de=ee.options.position,Ee=ee.direction==="x",ze=ee.options.tickLength,le=i.grid.axisMargin,ye=i.grid.labelMargin,Se=i.grid.eventSectionHeight,Be=!0,Xe=!0,st=!0,mt=!1;se.each(Ee?_:C,function(rt,lt){lt&&(lt.show||lt.reserveSpace)&&(lt===ee?mt=!0:lt.options.position===de&&(mt?Xe=!1:Be=!1),mt||(st=!1))}),Xe&&(le=0),ze==null&&(ze=st?"full":5),isNaN(+ze)||(ye+=+ze),Ee?(ge+=ye,ge+=Se,de=="bottom"?(b.bottom+=ge+le,ee.box={top:c.height-b.bottom,height:ge}):(ee.box={top:b.top+le,height:ge},b.top+=ge+le)):(_e+=ye,de=="left"?(ee.box={left:b.left+le,width:_e},b.left+=_e+le):(b.right+=_e+le,ee.box={left:c.width-b.right,width:_e})),ee.position=de,ee.tickLength=ze,ee.box.padding=ye,ee.box.eventSectionPadding=Se,ee.innermost=Be}function W(ee){ee.direction=="x"?(ee.box.left=b.left-ee.labelWidth/2,ee.box.width=c.width-b.left-b.right+ee.labelWidth):(ee.box.top=b.top-ee.labelHeight/2,ee.box.height=c.height-b.bottom-b.top+ee.labelHeight)}function oe(){var ee=i.grid.minBorderMargin,_e,ge;if(ee==null)for(ee=0,ge=0;ge<d.length;++ge)ee=Math.max(ee,2*(d[ge].points.radius+d[ge].points.lineWidth/2));var de={left:ee,right:ee,top:ee,bottom:ee};se.each(k(),function(Ee,ze){ze.reserveSpace&&ze.ticks&&ze.ticks.length&&(ze.direction==="x"?(de.left=Math.max(de.left,ze.labelWidth/2),de.right=Math.max(de.right,ze.labelWidth/2)):(de.bottom=Math.max(de.bottom,ze.labelHeight/2),de.top=Math.max(de.top,ze.labelHeight/2)))}),b.left=Math.ceil(Math.max(de.left,b.left)),b.right=Math.ceil(Math.max(de.right,b.right)),b.top=Math.ceil(Math.max(de.top,b.top)),b.bottom=Math.ceil(Math.max(de.bottom,b.bottom))}function Q(){var ee,_e=k(),ge=i.grid.show;for(var de in b){var Ee=i.grid.margin||0;b[de]=typeof Ee=="number"?Ee:Ee[de]||0}s(y.processOffset,[b]);for(var de in b)typeof i.grid.borderWidth=="object"?b[de]+=ge?i.grid.borderWidth[de]:0:b[de]+=ge?i.grid.borderWidth:0;if(se.each(_e,function(ye,Se){var Be=Se.options;Se.show=Be.show==null?Se.used:Be.show,Se.reserveSpace=Be.reserveSpace==null?Se.show:Be.reserveSpace,P(Se)}),s(y.processRange,[]),ge){for(var ze=se.grep(_e,function(ye){return ye.show||ye.reserveSpace}),le=!1,ee=0;ee<2&&(se.each(ze,function(Se,Be){q(Be),Y(Be),le=ve(Be,Be.ticks)||le,U(Be)}),le&&y.processRange.length>0);ee++)s(y.processRange,[]),le=!1;for(ee=ze.length-1;ee>=0;--ee)H(ze[ee]);oe(),se.each(ze,function(ye,Se){W(Se)})}g=c.width-b.left-b.right,v=c.height-b.bottom-b.top,se.each(_e,function(ye,Se){R(Se)}),ge&&Z(),ue()}function P(ee){var _e=ee.options,ge=+(_e.min!=null?_e.min:ee.datamin),de=+(_e.max!=null?_e.max:ee.datamax),Ee=de-ge;if(Ee==0){var ze=.25,le=Math.abs(de==0?1:de*ze);_e.min==null&&(ge-=le),(_e.max==null||_e.min!=null)&&(de+=le)}else{var ye=_e.autoscaleMargin;ye!=null&&(_e.min==null&&(ge-=Ee*ye,ge<0&&ee.datamin!=null&&ee.datamin>=0&&(ge=0)),_e.max==null&&(de+=Ee*ye,de>0&&ee.datamax!=null&&ee.datamax<=0&&(de=0)))}ee.min=ge,ee.max=de}function ae(ee){if(ee=Math.abs(String(ee).replace(".","")),ee==0)return 0;for(;ee!=0&&ee%10==0;)ee/=10;return Math.floor(Math.log(ee)/Math.LN10)+1}function q(ee){var _e=ee.options,ge;typeof _e.ticks=="number"&&_e.ticks>0?ge=_e.ticks:ge=.3*Math.sqrt(ee.direction=="x"?c.width:c.height);var de=(ee.max-ee.min)/ge,Ee=-Math.floor(Math.log(de)/Math.LN10),ze=_e.tickDecimals;ze!=null&&Ee>ze&&(Ee=ze);var le=Math.pow(10,-Ee),ye=de/le,Se;if(ye<1.5?Se=1:ye<3?(Se=2,ye>2.25&&(ze==null||Ee+1<=ze)&&(Se=2.5,++Ee)):ye<7.5?Se=5:Se=10,Se*=le,_e.minTickSize!=null&&Se<_e.minTickSize&&(Se=_e.minTickSize),ee.delta=de,ee.tickDecimals=Math.max(0,ze!=null?ze:Ee),ee.tickSize=_e.tickSize||Se,_e.mode=="time"&&!ee.tickGenerator)throw new Error("Time mode requires the flot.time plugin.");if(ee.tickGenerator||(ee.tickGenerator=function(rt){var lt=[],ft=n(rt.min,rt.tickSize),St=0,gt=Number.NaN,pt;do pt=gt,gt=ft+St*rt.tickSize,lt.push(gt),++St;while(gt<rt.max&&gt!=pt);return lt},ee.tickFormatter=function(rt,lt){var ft=lt.tickDecimals?Math.pow(10,lt.tickDecimals):1,St=""+Math.round(rt*ft)/ft;if(lt.tickDecimals!=null){var gt=St.indexOf("."),pt=gt==-1?0:St.length-gt-1;if(pt<lt.tickDecimals)return(pt?St:St+".")+(""+ft).substr(1,lt.tickDecimals-pt)}return St}),se.isFunction(_e.tickFormatter)&&(ee.tickFormatter=function(rt,lt){return""+_e.tickFormatter(rt,lt)}),_e.alignTicksWithAxis!=null){var Be=(ee.direction=="x"?_:C)[_e.alignTicksWithAxis-1];if(Be&&Be.used&&Be!=ee){var Xe=ee.tickGenerator(ee);if(Xe.length>0&&(_e.min==null&&(ee.min=Math.min(ee.min,Xe[0])),_e.max==null&&Xe.length>1&&(ee.max=Math.max(ee.max,Xe[Xe.length-1]))),ee.tickGenerator=function(rt){var lt=[],ft,St;for(St=0;St<Be.ticks.length;++St)ft=(Be.ticks[St].v-Be.min)/(Be.max-Be.min),ft=rt.min+ft*(rt.max-rt.min),lt.push(ft);return lt},!ee.mode&&_e.tickDecimals==null){var st=Math.max(0,-Math.floor(Math.log(ee.delta)/Math.LN10)+1),mt=ee.tickGenerator(ee);mt.length>1&&/\..*0$/.test((mt[1]-mt[0]).toFixed(st))||(ee.tickDecimals=st)}}}}function Y(ee){var _e=ee.options.ticks,ge=[];_e==null||typeof _e=="number"&&_e>0?ge=ee.tickGenerator(ee):_e&&(se.isFunction(_e)?ge=_e(ee):ge=_e);var de,Ee;for(ee.ticks=[],de=0;de<ge.length;++de){var ze=null,le=ge[de];typeof le=="object"?(Ee=+le[0],le.length>1&&(ze=le[1])):Ee=+le,ze==null&&(ze=ee.tickFormatter(Ee,ee)),isNaN(Ee)||ee.ticks.push({v:Ee,label:ze})}}function ve(ee,_e){var ge=!1;return ee.options.autoscaleMargin&&_e.length>0&&(ee.options.min==null&&(ee.min=Math.min(ee.min,_e[0].v),ge=!0),ee.options.max==null&&_e.length>1&&(ee.max=Math.max(ee.max,_e[_e.length-1].v),ge=!0)),ge}function re(){c.clear(),s(y.drawBackground,[m]);var ee=i.grid;ee.show&&ee.backgroundColor&&me(),ee.show&&!ee.aboveData&&ne();for(var _e=0;_e<d.length;++_e)s(y.drawSeries,[m,d[_e]]),Pe(d[_e]);s(y.draw,[m]),ee.show&&ee.aboveData&&ne(),c.render(),fe()}function je(ee,_e){for(var ge,de,Ee,ze,le=k(),ye=0;ye<le.length;++ye)if(ge=le[ye],ge.direction==_e&&(ze=_e+ge.n+"axis",!ee[ze]&&ge.n==1&&(ze=_e+"axis"),ee[ze])){de=ee[ze].from,Ee=ee[ze].to;break}if(ee[ze]||(ge=_e=="x"?_[0]:C[0],de=ee[_e+"1"],Ee=ee[_e+"2"]),de!=null&&Ee!=null&&de>Ee){var Se=de;de=Ee,Ee=Se}return{from:de,to:Ee,axis:ge}}function me(){m.save(),m.translate(b.left,b.top),m.fillStyle=wt(i.grid.backgroundColor,v,0,"rgba(255, 255, 255, 0)"),m.fillRect(0,0,g,v),m.restore()}function ne(){var ee,_e,ge,de;m.save(),m.translate(b.left,b.top);var Ee=i.grid.markings;if(Ee)for(se.isFunction(Ee)&&(_e=h.getAxes(),_e.xmin=_e.xaxis.min,_e.xmax=_e.xaxis.max,_e.ymin=_e.yaxis.min,_e.ymax=_e.yaxis.max,Ee=Ee(_e)),ee=0;ee<Ee.length;++ee){var ze=Ee[ee],le=je(ze,"x"),ye=je(ze,"y");if(le.from==null&&(le.from=le.axis.min),le.to==null&&(le.to=le.axis.max),ye.from==null&&(ye.from=ye.axis.min),ye.to==null&&(ye.to=ye.axis.max),!(le.to<le.axis.min||le.from>le.axis.max||ye.to<ye.axis.min||ye.from>ye.axis.max)){le.from=Math.max(le.from,le.axis.min),le.to=Math.min(le.to,le.axis.max),ye.from=Math.max(ye.from,ye.axis.min),ye.to=Math.min(ye.to,ye.axis.max);var Se=le.from===le.to,Be=ye.from===ye.to;if(!(Se&&Be))if(le.from=Math.floor(le.axis.p2c(le.from)),le.to=Math.floor(le.axis.p2c(le.to)),ye.from=Math.floor(ye.axis.p2c(ye.from)),ye.to=Math.floor(ye.axis.p2c(ye.to)),Se||Be){var Xe=ze.lineWidth||i.grid.markingsLineWidth,st=Xe%2?.5:0;m.beginPath(),m.strokeStyle=ze.color||i.grid.markingsColor,m.lineWidth=Xe,Se?(m.moveTo(le.to+st,ye.from),m.lineTo(le.to+st,ye.to)):(m.moveTo(le.from,ye.to+st),m.lineTo(le.to,ye.to+st)),m.stroke()}else m.fillStyle=ze.color||i.grid.markingsColor,m.fillRect(le.from,ye.to,le.to-le.from,ye.from-ye.to)}}_e=k(),ge=i.grid.borderWidth;for(var mt=0;mt<_e.length;++mt){var rt=_e[mt],lt=rt.box,ft=rt.tickLength,St,gt,pt,ut;if(!(!rt.show||rt.ticks.length==0)){for(m.lineWidth=1,rt.direction=="x"?(St=0,ft=="full"?gt=rt.position=="top"?0:v:gt=lt.top-b.top+(rt.position=="top"?lt.height:0)):(gt=0,ft=="full"?St=rt.position=="left"?0:g:St=lt.left-b.left+(rt.position=="left"?lt.width:0)),rt.innermost||(m.strokeStyle=rt.options.color,m.beginPath(),pt=ut=0,rt.direction=="x"?pt=g+1:ut=v+1,m.lineWidth==1&&(rt.direction=="x"?gt=Math.floor(gt)+.5:St=Math.floor(St)+.5),m.moveTo(St,gt),m.lineTo(St+pt,gt+ut),m.stroke()),m.strokeStyle=rt.options.tickColor,m.beginPath(),ee=0;ee<rt.ticks.length;++ee){var Ot=rt.ticks[ee].v;pt=ut=0,!(isNaN(Ot)||Ot<rt.min||Ot>rt.max||ft=="full"&&(typeof ge=="object"&&ge[rt.position]>0||ge>0)&&(Ot==rt.min||Ot==rt.max))&&(rt.direction=="x"?(St=rt.p2c(Ot),ut=ft=="full"?-v:ft,rt.position=="top"&&(ut=-ut)):(gt=rt.p2c(Ot),pt=ft=="full"?-g:ft,rt.position=="left"&&(pt=-pt)),m.lineWidth==1&&(rt.direction=="x"?St=Math.floor(St)+.5:gt=Math.floor(gt)+.5),m.moveTo(St,gt),m.lineTo(St+pt,gt+ut))}m.stroke()}}ge&&(de=i.grid.borderColor,typeof ge=="object"||typeof de=="object"?(typeof ge!="object"&&(ge={top:ge,right:ge,bottom:ge,left:ge}),typeof de!="object"&&(de={top:de,right:de,bottom:de,left:de}),ge.top>0&&(m.strokeStyle=de.top,m.lineWidth=ge.top,m.beginPath(),m.moveTo(0-ge.left,0-ge.top/2),m.lineTo(g,0-ge.top/2),m.stroke()),ge.right>0&&(m.strokeStyle=de.right,m.lineWidth=ge.right,m.beginPath(),m.moveTo(g+ge.right/2,0-ge.top),m.lineTo(g+ge.right/2,v),m.stroke()),ge.bottom>0&&(m.strokeStyle=de.bottom,m.lineWidth=ge.bottom,m.beginPath(),m.moveTo(g+ge.right,v+ge.bottom/2),m.lineTo(0,v+ge.bottom/2),m.stroke()),ge.left>0&&(m.strokeStyle=de.left,m.lineWidth=ge.left,m.beginPath(),m.moveTo(0-ge.left/2,v+ge.bottom),m.lineTo(0-ge.left/2,0),m.stroke())):(m.lineWidth=ge,m.strokeStyle=i.grid.borderColor,m.strokeRect(-ge/2,-ge/2,g+ge,v+ge))),m.restore()}function Z(){se.each(k(),function(ee,_e){var ge=_e.box,de=_e.direction+"Axis "+_e.direction+_e.n+"Axis",Ee="flot-"+_e.direction+"-axis flot-"+_e.direction+_e.n+"-axis "+de,ze=_e.options.font||"flot-tick-label tickLabel",le,ye,Se,Be,Xe;if(c.removeText(Ee),!(!_e.show||_e.ticks.length==0))for(var st=0;st<_e.ticks.length;++st)le=_e.ticks[st],!(!le.label||le.v<_e.min||le.v>_e.max)&&(_e.direction=="x"?(Be="center",ye=b.left+_e.p2c(le.v),_e.position=="bottom"?Se=ge.top+ge.padding+ge.eventSectionPadding:(Se=ge.top+ge.height-ge.padding,Xe="bottom")):(Xe="middle",Se=b.top+_e.p2c(le.v),_e.position=="left"?(ye=ge.left+ge.width-ge.padding,Be="right"):ye=ge.left+ge.padding),c.addText(Ee,ye,Se,le.label,ze,null,null,Be,Xe))})}function te(ee){for(var _e=[],ge=null,de=null,Ee=ee.datapoints,ze=[],le=0;le<Ee.pointsize-2;le++)ze.push(0);for(var ye=0;ye<Ee.points.length;ye+=Ee.pointsize){var Se=Ee.points[ye],Be=Ee.points[ye+1];ye===Ee.points.length-Ee.pointsize?de=null:de=Ee.points[ye+Ee.pointsize],Se!==null&&Be!==null&&ge===null&&de===null&&(_e.push(Se),_e.push(Be),_e.push.apply(_e,ze)),ge=Se}var Xe=Ee.points;Ee.points=_e,ee.points.radius=ee.lines.lineWidth/2,ie(ee),Ee.points=Xe}function Pe(ee){ee.lines.show&&(he(ee),!ee.points.show&&!ee.bars.show&&te(ee)),ee.bars.show&&Le(ee),ee.points.show&&ie(ee)}function he(ee){function _e(ye,Se,Be,Xe,st){var mt=ye.points,rt=ye.pointsize,lt=null,ft=null;m.beginPath();for(var St=rt;St<mt.length;St+=rt){var gt=mt[St-rt],pt=mt[St-rt+1],ut=mt[St],Ot=mt[St+1];if(!(gt==null||ut==null)){if(pt<=Ot&&pt<st.min){if(Ot<st.min)continue;gt=(st.min-pt)/(Ot-pt)*(ut-gt)+gt,pt=st.min}else if(Ot<=pt&&Ot<st.min){if(pt<st.min)continue;ut=(st.min-pt)/(Ot-pt)*(ut-gt)+gt,Ot=st.min}if(pt>=Ot&&pt>st.max){if(Ot>st.max)continue;gt=(st.max-pt)/(Ot-pt)*(ut-gt)+gt,pt=st.max}else if(Ot>=pt&&Ot>st.max){if(pt>st.max)continue;ut=(st.max-pt)/(Ot-pt)*(ut-gt)+gt,Ot=st.max}if(gt<=ut&&gt<Xe.min){if(ut<Xe.min)continue;pt=(Xe.min-gt)/(ut-gt)*(Ot-pt)+pt,gt=Xe.min}else if(ut<=gt&&ut<Xe.min){if(gt<Xe.min)continue;Ot=(Xe.min-gt)/(ut-gt)*(Ot-pt)+pt,ut=Xe.min}if(gt>=ut&&gt>Xe.max){if(ut>Xe.max)continue;pt=(Xe.max-gt)/(ut-gt)*(Ot-pt)+pt,gt=Xe.max}else if(ut>=gt&&ut>Xe.max){if(gt>Xe.max)continue;Ot=(Xe.max-gt)/(ut-gt)*(Ot-pt)+pt,ut=Xe.max}(gt!=lt||pt!=ft)&&m.moveTo(Xe.p2c(gt)+Se,st.p2c(pt)+Be),lt=ut,ft=Ot,m.lineTo(Xe.p2c(ut)+Se,st.p2c(Ot)+Be)}}m.stroke()}function ge(ye,Se,Be){for(var Xe=ye.points,st=ye.pointsize,mt=Math.min(Math.max(0,Be.min),Be.max),rt=0,lt,ft=!1,St=1,gt=0,pt=0;!(st>0&&rt>Xe.length+st);){rt+=st;var ut=Xe[rt-st],Ot=Xe[rt-st+St],Wt=Xe[rt],Ht=Xe[rt+St];if(ft){if(st>0&&ut!=null&&Wt==null){pt=rt,st=-st,St=2;continue}if(st<0&&rt==gt+st){m.fill(),ft=!1,st=-st,St=1,rt=gt=pt+st;continue}}if(!(ut==null||Wt==null)){if(ut<=Wt&&ut<Se.min){if(Wt<Se.min)continue;Ot=(Se.min-ut)/(Wt-ut)*(Ht-Ot)+Ot,ut=Se.min}else if(Wt<=ut&&Wt<Se.min){if(ut<Se.min)continue;Ht=(Se.min-ut)/(Wt-ut)*(Ht-Ot)+Ot,Wt=Se.min}if(ut>=Wt&&ut>Se.max){if(Wt>Se.max)continue;Ot=(Se.max-ut)/(Wt-ut)*(Ht-Ot)+Ot,ut=Se.max}else if(Wt>=ut&&Wt>Se.max){if(ut>Se.max)continue;Ht=(Se.max-ut)/(Wt-ut)*(Ht-Ot)+Ot,Wt=Se.max}if(ft||(m.beginPath(),m.moveTo(Se.p2c(ut),Be.p2c(mt)),ft=!0),Ot>=Be.max&&Ht>=Be.max){m.lineTo(Se.p2c(ut),Be.p2c(Be.max)),m.lineTo(Se.p2c(Wt),Be.p2c(Be.max));continue}else if(Ot<=Be.min&&Ht<=Be.min){m.lineTo(Se.p2c(ut),Be.p2c(Be.min)),m.lineTo(Se.p2c(Wt),Be.p2c(Be.min));continue}var on=ut,un=Wt;Ot<=Ht&&Ot<Be.min&&Ht>=Be.min?(ut=(Be.min-Ot)/(Ht-Ot)*(Wt-ut)+ut,Ot=Be.min):Ht<=Ot&&Ht<Be.min&&Ot>=Be.min&&(Wt=(Be.min-Ot)/(Ht-Ot)*(Wt-ut)+ut,Ht=Be.min),Ot>=Ht&&Ot>Be.max&&Ht<=Be.max?(ut=(Be.max-Ot)/(Ht-Ot)*(Wt-ut)+ut,Ot=Be.max):Ht>=Ot&&Ht>Be.max&&Ot<=Be.max&&(Wt=(Be.max-Ot)/(Ht-Ot)*(Wt-ut)+ut,Ht=Be.max),ut!=on&&m.lineTo(Se.p2c(on),Be.p2c(Ot)),m.lineTo(Se.p2c(ut),Be.p2c(Ot)),m.lineTo(Se.p2c(Wt),Be.p2c(Ht)),Wt!=un&&(m.lineTo(Se.p2c(Wt),Be.p2c(Ht)),m.lineTo(Se.p2c(un),Be.p2c(Ht)))}}}m.save(),m.translate(b.left,b.top),m.lineJoin="round";var de=ee.lines.lineWidth,Ee=ee.shadowSize;if(de>0&&Ee>0){m.lineWidth=Ee,m.strokeStyle="rgba(0,0,0,0.1)";var ze=Math.PI/18;_e(ee.datapoints,Math.sin(ze)*(de/2+Ee/2),Math.cos(ze)*(de/2+Ee/2),ee.xaxis,ee.yaxis),m.lineWidth=Ee/2,_e(ee.datapoints,Math.sin(ze)*(de/2+Ee/4),Math.cos(ze)*(de/2+Ee/4),ee.xaxis,ee.yaxis)}m.lineWidth=de,m.strokeStyle=ee.color;var le=we(ee.lines,ee.color,0,v);le&&(m.fillStyle=le,ge(ee.datapoints,ee.xaxis,ee.yaxis)),de>0&&_e(ee.datapoints,0,0,ee.xaxis,ee.yaxis),m.restore()}function ie(ee){function _e(ye,Se,Be,Xe,st,mt,rt,lt){for(var ft=ye.points,St=ye.pointsize,gt=0;gt<ft.length;gt+=St){var pt=ft[gt],ut=ft[gt+1];pt==null||pt<mt.min||pt>mt.max||ut<rt.min||ut>rt.max||(m.beginPath(),pt=mt.p2c(pt),ut=rt.p2c(ut)+Xe,lt=="circle"?m.arc(pt,ut,Se,0,st?Math.PI:Math.PI*2,!1):lt(m,pt,ut,Se,st),m.closePath(),Be&&(m.fillStyle=Be,m.fill()),m.stroke())}}m.save(),m.translate(b.left,b.top);var ge=ee.points.lineWidth,de=ee.shadowSize,Ee=ee.points.radius,ze=ee.points.symbol;if(ge==0&&(ge=1e-4),ge>0&&de>0){var le=de/2;m.lineWidth=le,m.strokeStyle="rgba(0,0,0,0.1)",_e(ee.datapoints,Ee,null,le+le/2,!0,ee.xaxis,ee.yaxis,ze),m.strokeStyle="rgba(0,0,0,0.2)",_e(ee.datapoints,Ee,null,le/2,!0,ee.xaxis,ee.yaxis,ze)}m.lineWidth=ge,m.strokeStyle=ee.color,_e(ee.datapoints,Ee,we(ee.points,ee.color),0,!1,ee.xaxis,ee.yaxis,ze),m.restore()}function Ce(ee,_e,ge,de,Ee,ze,le,ye,Se,Be,Xe){var st,mt,rt,lt,ft,St,gt,pt,ut;Be?(pt=St=gt=!0,ft=!1,st=ge,mt=ee,lt=_e+de,rt=_e+Ee,mt<st&&(ut=mt,mt=st,st=ut,ft=!0,St=!1)):(ft=St=gt=!0,pt=!1,st=ee+de,mt=ee+Ee,rt=ge,lt=_e,lt<rt&&(ut=lt,lt=rt,rt=ut,pt=!0,gt=!1)),!(mt<le.min||st>le.max||lt<ye.min||rt>ye.max)&&(st<le.min&&(st=le.min,ft=!1),mt>le.max&&(mt=le.max,St=!1),rt<ye.min&&(rt=ye.min,pt=!1),lt>ye.max&&(lt=ye.max,gt=!1),st=le.p2c(st),rt=ye.p2c(rt),mt=le.p2c(mt),lt=ye.p2c(lt),ze&&(Se.fillStyle=ze(rt,lt),Se.fillRect(st,lt,mt-st,rt-lt)),Xe>0&&(ft||St||gt||pt)&&(Se.beginPath(),Se.moveTo(st,rt),ft?Se.lineTo(st,lt):Se.moveTo(st,lt),gt?Se.lineTo(mt,lt):Se.moveTo(mt,lt),St?Se.lineTo(mt,rt):Se.moveTo(mt,rt),pt?Se.lineTo(st,rt):Se.moveTo(st,rt),Se.stroke()))}function Le(ee){function _e(Ee,ze,le,ye,Se,Be){for(var Xe=Ee.points,st=Ee.pointsize,mt=0;mt<Xe.length;mt+=st)Xe[mt]!=null&&Ce(Xe[mt],Xe[mt+1],Xe[mt+2],ze,le,ye,Se,Be,m,ee.bars.horizontal,ee.bars.lineWidth)}m.save(),m.translate(b.left,b.top),m.lineWidth=ee.bars.lineWidth,m.strokeStyle=ee.color;var ge;switch(ee.bars.align){case"left":ge=0;break;case"right":ge=-ee.bars.barWidth;break;default:ge=-ee.bars.barWidth/2}var de=ee.bars.fill?function(Ee,ze){return we(ee.bars,ee.color,Ee,ze)}:null;_e(ee.datapoints,ge,ge+ee.bars.barWidth,de,ee.xaxis,ee.yaxis),m.restore()}function we(ee,_e,ge,de){var Ee=ee.fill;if(!Ee)return null;if(ee.fillColor)return wt(ee.fillColor,ge,de,_e);var ze=se.color.parse(_e);return ze.a=typeof Ee=="number"?Ee:.4,ze.normalize(),ze.toString()}function ue(){if(i.legend.container!=null?se.find(i.legend.container).html(""):a.find(".legend").remove(),!!i.legend.show){for(var ee=[],_e=[],ge=!1,de=i.legend.labelFormatter,Ee,ze,le=0;le<d.length;++le)Ee=d[le],Ee.label&&(ze=de?de(Ee.label,Ee):Ee.label,ze&&_e.push({label:ze,color:Ee.color}));if(i.legend.sorted)if(se.isFunction(i.legend.sorted))_e.sort(i.legend.sorted);else if(i.legend.sorted=="reverse")_e.reverse();else{var ye=i.legend.sorted!="descending";_e.sort(function(St,gt){return St.label==gt.label?0:St.label<gt.label!=ye?1:-1})}for(var le=0;le<_e.length;++le){var Se=_e[le];le%i.legend.noColumns==0&&(ge&&ee.push("</tr>"),ee.push("<tr>"),ge=!0),ee.push('<td class="legendColorBox"><div style="border:1px solid '+i.legend.labelBoxBorderColor+';padding:1px"><div style="width:4px;height:0;border:5px solid '+Se.color+';overflow:hidden"></div></div></td><td class="legendLabel">'+Se.label+"</td>")}if(ge&&ee.push("</tr>"),ee.length!=0){var Be='<table style="font-size:smaller;color:'+i.grid.color+'">'+ee.join("")+"</table>";if(i.legend.container!=null)se(i.legend.container).html(Be);else{var Xe="",st=i.legend.position,mt=i.legend.margin;mt[0]==null&&(mt=[mt,mt]),st.charAt(0)=="n"?Xe+="top:"+(mt[1]+b.top)+"px;":st.charAt(0)=="s"&&(Xe+="bottom:"+(mt[1]+b.bottom)+"px;"),st.charAt(1)=="e"?Xe+="right:"+(mt[0]+b.right)+"px;":st.charAt(1)=="w"&&(Xe+="left:"+(mt[0]+b.left)+"px;");var rt=se('<div class="legend">'+Be.replace('style="','style="position:absolute;'+Xe+";")+"</div>").appendTo(a);if(i.legend.backgroundOpacity!=0){var lt=i.legend.backgroundColor;lt==null&&(lt=i.grid.backgroundColor,lt&&typeof lt=="string"?lt=se.color.parse(lt):lt=se.color.extract(rt,"background-color"),lt.a=1,lt=lt.toString());var ft=rt.children();se('<div style="position:absolute;width:'+ft.width()+"px;height:"+ft.height()+"px;"+Xe+"background-color:"+lt+';"> </div>').prependTo(rt).css("opacity",i.legend.backgroundOpacity)}}}}}var Ie=[],qe=null;function Je(ee,_e,ge){var de=i.grid.mouseActiveRadius,Ee=de*de+1,ze=null,le=!1,ye,Se,Be;for(ye=d.length-1;ye>=0;--ye)if(!!ge(d[ye])){var Xe=d[ye],st=Xe.xaxis,mt=Xe.yaxis,rt=Xe.datapoints.points,lt=st.c2p(ee),ft=mt.c2p(_e),St=de/st.scale,gt=de/mt.scale;if(Be=Xe.datapoints.pointsize,st.options.inverseTransform&&(St=Number.MAX_VALUE),mt.options.inverseTransform&&(gt=Number.MAX_VALUE),Xe.lines.show||Xe.points.show)for(Se=0;Se<rt.length;Se+=Be){var pt=rt[Se],ut=rt[Se+1];if(pt!=null&&!(pt-lt>St||pt-lt<-St||ut-ft>gt||ut-ft<-gt)){var Ot=Math.abs(st.p2c(pt)-ee),Wt=Math.abs(mt.p2c(ut)-_e),Ht=Ot*Ot+Wt*Wt;Ht<Ee&&(Ee=Ht,ze=[ye,Se/Be])}}if(Xe.bars.show&&!ze){var on,un;switch(Xe.bars.align){case"left":on=0;break;case"right":on=-Xe.bars.barWidth;break;default:on=-Xe.bars.barWidth/2}for(un=on+Xe.bars.barWidth,Se=0;Se<rt.length;Se+=Be){var pt=rt[Se],ut=rt[Se+1],mn=rt[Se+2];pt!=null&&(d[ye].bars.horizontal?lt<=Math.max(mn,pt)&&lt>=Math.min(mn,pt)&&ft>=ut+on&&ft<=ut+un:lt>=pt+on&&lt<=pt+un&&ft>=Math.min(mn,ut)&&ft<=Math.max(mn,ut))&&(ze=[ye,Se/Be])}}}return ze?(ye=ze[0],Se=ze[1],Be=d[ye].datapoints.pointsize,{datapoint:d[ye].datapoints.points.slice(Se*Be,(Se+1)*Be),dataIndex:Se,series:d[ye],seriesIndex:ye}):null}function Ze(ee){i.grid.hoverable&&L("plothover",ee,function(_e){return _e.hoverable!=!1})}function Oe(ee){i.grid.hoverable&&L("plothover",ee,function(_e){return!1})}function ce(ee){h.isSelecting||L("plotclick",ee,function(_e){return _e.clickable!=!1})}function pe(ee){if(!!ee.cancelable){if(!O.is(ee.target)&&O.has(ee.target).length===0){L("plotleave",ee,function(_e){});return}Ze(J(ee)),ee.preventDefault()}}function J(ee){if(!ee||!ee.originalEvent||ee.pageX&&ee.pageY)return ee;var _e=ee.originalEvent;if(_e.changedTouches.length===0)return ee;var ge=_e.changedTouches[0];return ee.pageX=ge.pageX,ee.pageY=ge.pageY,ee}function L(ee,_e,ge){var de=O.offset(),Ee=_e.pageX-de.left-b.left,ze=_e.pageY-de.top-b.top,le=D({left:Ee,top:ze});le.pageX=_e.pageX,le.pageY=_e.pageY,le.ctrlKey=_e.ctrlKey,le.metaKey=_e.metaKey;var ye=Je(Ee,ze,ge);if(ye&&(ye.pageX=parseInt(ye.series.xaxis.p2c(ye.datapoint[0])+de.left+b.left,10),ye.pageY=parseInt(ye.series.yaxis.p2c(ye.datapoint[1])+de.top+b.top,10)),i.grid.autoHighlight){for(var Se=0;Se<Ie.length;++Se){var Be=Ie[Se];Be.auto==ee&&!(ye&&Be.series==ye.series&&Be.point[0]==ye.datapoint[0]&&Be.point[1]==ye.datapoint[1])&&Ue(Be.series,Be.point)}ye&&We(ye.series,ye.datapoint,ee)}a.trigger(ee,[le,ye])}function fe(){var ee=i.interaction.redrawOverlayInterval;if(ee==-1){xe();return}qe||(qe=setTimeout(xe,ee))}function xe(){qe=null,w.save(),E.clear(),w.translate(b.left,b.top);var ee,_e;for(ee=0;ee<Ie.length;++ee)_e=Ie[ee],_e.series.bars.show?_t(_e.series,_e.point):it(_e.series,_e.point);w.restore(),s(y.drawOverlay,[w])}function We(ee,_e,ge){if(typeof ee=="number"&&(ee=d[ee]),typeof _e=="number"){var de=ee.datapoints.pointsize;_e=ee.datapoints.points.slice(de*_e,de*(_e+1))}var Ee=at(ee,_e);Ee==-1?(Ie.push({series:ee,point:_e,auto:ge}),fe()):ge||(Ie[Ee].auto=!1)}function Ue(ee,_e){if(ee==null&&_e==null){Ie=[],fe();return}if(typeof ee=="number"&&(ee=d[ee]),typeof _e=="number"){var ge=ee.datapoints.pointsize;_e=ee.datapoints.points.slice(ge*_e,ge*(_e+1))}var de=at(ee,_e);de!=-1&&(Ie.splice(de,1),fe())}function at(ee,_e){for(var ge=0;ge<Ie.length;++ge){var de=Ie[ge];if(de.series==ee&&de.point[0]==_e[0]&&de.point[1]==_e[1])return ge}return-1}function it(ee,_e){var ge=_e[0],de=_e[1],Ee=ee.xaxis,ze=ee.yaxis,le=typeof ee.highlightColor=="string"?ee.highlightColor:se.color.parse(ee.color).scale("a",.5).toString();if(!(ge<Ee.min||ge>Ee.max||de<ze.min||de>ze.max)){var ye=ee.points.radius+ee.points.lineWidth/2;w.lineWidth=ye,w.strokeStyle=le;var Se=1.5*ye;ge=Ee.p2c(ge),de=ze.p2c(de),w.beginPath(),ee.points.symbol=="circle"?w.arc(ge,de,Se,0,2*Math.PI,!1):ee.points.symbol(w,ge,de,Se,!1),w.closePath(),w.stroke()}}function _t(ee,_e){var ge=typeof ee.highlightColor=="string"?ee.highlightColor:se.color.parse(ee.color).scale("a",.5).toString(),de=ge,Ee;switch(ee.bars.align){case"left":Ee=0;break;case"right":Ee=-ee.bars.barWidth;break;default:Ee=-ee.bars.barWidth/2}w.lineWidth=ee.bars.lineWidth,w.strokeStyle=ge,Ce(_e[0],_e[1],_e[2]||0,Ee,Ee+ee.bars.barWidth,function(){return de},ee.xaxis,ee.yaxis,w,ee.bars.horizontal,ee.bars.lineWidth)}function wt(ee,_e,ge,de){if(typeof ee=="string")return ee;for(var Ee=m.createLinearGradient(0,ge,0,_e),ze=0,le=ee.colors.length;ze<le;++ze){var ye=ee.colors[ze];if(typeof ye!="string"){var Se=se.color.parse(de);ye.brightness!=null&&(Se=Se.scale("rgb",ye.brightness)),ye.opacity!=null&&(Se.a*=ye.opacity),ye=Se.toString()}Ee.addColorStop(ze/(le-1),ye)}return Ee}}se.plot=function(a,l,f){var x=new t(se(a),l,f,se.plot.plugins);return x},se.plot.version="0.8.3",se.plot.plugins=[],se.fn.plot=function(a,l){return this.each(function(){se.plot(this,a,l)})};function n(a,l){return l*Math.floor(a/l)}}(jQuery)},"../../public/vendor/flot/jquery.flot.selection.js":function(){(function(se){function V(e){var t={first:{x:-1,y:-1},second:{x:-1,y:-1},show:!1,active:!1},n={},a=null;function l(b){t.active&&(O(b),e.getPlaceholder().trigger("plotselecting",[d()]))}function f(b){b.which==1&&(document.body.focus(),document.onselectstart!==void 0&&n.onselectstart==null&&(n.onselectstart=document.onselectstart,document.onselectstart=function(){return!1}),document.ondrag!==void 0&&n.ondrag==null&&(n.ondrag=document.ondrag,document.ondrag=function(){return!1}),E(t.first,b),t.active=!0,a=function(g){x(g)},se(document).one("mouseup",a))}function x(b){return a=null,document.onselectstart!==void 0&&(document.onselectstart=n.onselectstart),document.ondrag!==void 0&&(document.ondrag=n.ondrag),t.active=!1,O(b),C()?i(b):(e.getPlaceholder().trigger("plotunselected",[]),e.getPlaceholder().trigger("plotselecting",[null])),setTimeout(function(){e.isSelecting=!1},10),!1}function d(){if(!C()||!t.show)return null;var b={},g=t.first,v=t.second,y=e.getAxes(),h=!0;return se.each(y,function(s,o){o.used&&(anyUsed=!1)}),se.each(y,function(s,o){if(o.used||h){var r=o.c2p(g[o.direction]),u=o.c2p(v[o.direction]);b[s]={from:Math.min(r,u),to:Math.max(r,u)}}}),b}function i(b){var g=d();g.ctrlKey=b.ctrlKey,g.metaKey=b.metaKey,e.getPlaceholder().trigger("plotselected",[g]),g.xaxis&&g.yaxis&&e.getPlaceholder().trigger("selected",[{x1:g.xaxis.from,y1:g.yaxis.from,x2:g.xaxis.to,y2:g.yaxis.to}])}function c(b,g,v){return g<b?b:g>v?v:g}function E(b,g){var v=e.getOptions(),y=e.getPlaceholder().offset(),h=e.getPlotOffset();b.x=c(0,g.pageX-y.left-h.left,e.width()),b.y=c(0,g.pageY-y.top-h.top,e.height()),v.selection.mode=="y"&&(b.x=b==t.first?0:e.width()),v.selection.mode=="x"&&(b.y=b==t.first?0:e.height())}function O(b){b.pageX!=null&&(E(t.second,b),C()?(e.isSelecting=!0,t.show=!0,e.triggerRedrawOverlay()):m(!0))}function m(b){t.show&&(t.show=!1,e.triggerRedrawOverlay(),b||e.getPlaceholder().trigger("plotunselected",[]))}function w(b,g){var v,y,h,s,o=e.getAxes();for(var r in o)if(v=o[r],v.direction==g&&(s=g+v.n+"axis",!b[s]&&v.n==1&&(s=g+"axis"),b[s])){y=b[s].from,h=b[s].to;break}if(b[s]||(v=g=="x"?e.getXAxes()[0]:e.getYAxes()[0],y=b[g+"1"],h=b[g+"2"]),y!=null&&h!=null&&y>h){var u=y;y=h,h=u}return{from:y,to:h,axis:v}}function _(b,g){var v,y,h=e.getOptions();h.selection.mode=="y"?(t.first.x=0,t.second.x=e.width()):(y=w(b,"x"),t.first.x=y.axis.p2c(y.from),t.second.x=y.axis.p2c(y.to)),h.selection.mode=="x"?(t.first.y=0,t.second.y=e.height()):(y=w(b,"y"),t.first.y=y.axis.p2c(y.from),t.second.y=y.axis.p2c(y.to)),t.show=!0,e.triggerRedrawOverlay(),!g&&C()&&i()}function C(){var b=e.getOptions().selection.minSize;return Math.abs(t.second.x-t.first.x)>=b&&Math.abs(t.second.y-t.first.y)>=b}e.clearSelection=m,e.setSelection=_,e.getSelection=d,e.hooks.bindEvents.push(function(b,g){var v=b.getOptions();v.selection.mode!=null&&(g.mousemove(l),g.mousedown(f))}),e.hooks.drawOverlay.push(function(b,g){if(t.show&&C()){var v=b.getPlotOffset(),y=b.getOptions();g.save(),g.translate(v.left,v.top);var h=se.color.parse(y.selection.color);g.strokeStyle=h.scale("a",.8).toString(),g.lineWidth=1,g.lineJoin=y.selection.shape,g.fillStyle=h.scale("a",.4).toString();var s=Math.min(t.first.x,t.second.x)+.5,o=Math.min(t.first.y,t.second.y)+.5,r=Math.abs(t.second.x-t.first.x)-1,u=Math.abs(t.second.y-t.first.y)-1;g.fillRect(s,o,r,u),g.strokeRect(s,o,r,u),g.restore()}}),e.hooks.shutdown.push(function(b,g){g.unbind("mousemove",l),g.unbind("mousedown",f),a&&(se(document).unbind("mouseup",a),document.onselectstart!==void 0&&(document.onselectstart=n.onselectstart),document.ondrag!==void 0&&(document.ondrag=n.ondrag))})}se.plot.plugins.push({init:V,options:{selection:{mode:null,color:"#e8cfac",shape:"round",minSize:5}},name:"selection",version:"1.1"})})(jQuery)},"../../public/vendor/flot/jquery.flot.stack.js":function(){(function(se){var V={series:{stack:null}};function e(t){function n(l,f){for(var x=null,d=0;d<f.length&&l!=f[d];++d)f[d].stack==l.stack&&(x=f[d]);return x}function a(l,f,x){if(!(f.stack==null||f.stack===!1)){var d=n(f,l.getData());if(!!d){for(var i=x.pointsize,c=x.points,E=d.datapoints.pointsize,O=d.datapoints.points,m=[],w,_,C,b,g,v,y=f.lines.show,h=f.bars.horizontal,s=i>2&&(h?x.format[2].x:x.format[2].y),o=y&&f.lines.steps,r=h?1:0,u=h?0:1,p=0,S=0,k,D;!(p>=c.length&&S>=O.length);){if(k=m.length,p<c.length&&c[p]==null){for(D=0;D<i;++D)m.push(c[p+D]);p+=i}else if(p>=c.length){for(D=0;D<i;++D)m.push(O[S+D]);s&&(m[k+2]=O[S+u]),S+=E}else if(S>=O.length){for(D=0;D<i;++D)m.push(c[p+D]);p+=i}else if(S<O.length&&O[S]==null)S+=E;else{if(w=c[p+r],_=c[p+u],b=O[S+r],g=O[S+u],v=0,w==b){for(D=0;D<i;++D)m.push(c[p+D]);m[k+u]+=g,v=g,p+=i,S+=E}else if(w>b){if(p==0){for(D=0;D<i;++D)m.push(O[S+D]);v=g}if(p>0&&c[p-i]!=null){for(C=0,m.push(b),m.push(C+g),D=2;D<i;++D)m.push(c[p+D]);v=g}S+=E}else{for(D=0;D<i;++D)m.push(c[p+D]);S>0&&O[S-E]!=null&&(v=0),m[k+u]+=v,p+=i}fromgap=!1,k!=m.length&&s&&(m[k+2]=v)}if(o&&k!=m.length&&k>0&&m[k]!=null&&m[k]!=m[k-i]&&m[k+1]!=m[k-i+1]){for(D=0;D<i;++D)m[k+i+D]=m[k+D];m[k+1]=m[k-i+1]}}x.points=m}}}t.hooks.processDatapoints.push(a)}se.plot.plugins.push({init:e,options:V,name:"stack",version:"1.2"})})(jQuery)},"../../public/vendor/flot/jquery.flot.stackpercent.js":function(){(function(se){var V={series:{stackpercent:null}};function e(t){var n={},a=!1,l={};function f(i,c,E,O){if(a||(a=!0,l=x(i.getData())),c.stackpercent==!0){var m=E.length;c.percents=[];var w=0,_=1;c.bars&&c.bars.horizontal&&c.bars.horizontal===!0&&(w=1,_=0);for(var C=0;C<m;C++){var b=l[E[C][w]+""];b>0?c.percents.push(E[C][_]*100/b):c.percents.push(0)}}}function x(i){var c=i.length,E={};if(c>0){for(var O=0;O<c;O++)if(i[O].stackpercent){var m=0,w=1;i[O].bars&&i[O].bars.horizontal&&i[O].bars.horizontal===!0&&(m=1,w=0);for(var _=i[O].data.length,C=0;C<_;C++){var b=0;i[O].data[C][1]!=null&&(b=i[O].data[C][w]),E[i[O].data[C][m]+""]?E[i[O].data[C][m]+""]+=b:E[i[O].data[C][m]+""]=b}}}return E}function d(i,c,E){if(!!c.stackpercent){a||(l=x(i.getData()));var O=[],m=0,w=1;c.bars&&c.bars.horizontal&&c.bars.horizontal===!0&&(m=1,w=0);for(var _=0;_<E.points.length;_+=3)n[E.points[_+m]]||(n[E.points[_+m]]=0),O[_+m]=E.points[_+m],O[_+w]=E.points[_+w]+n[E.points[_+m]],O[_+2]=n[E.points[_+m]],n[E.points[_+m]]+=E.points[_+w],l[O[_+m]+""]>0?(O[_+w]=O[_+w]*100/l[O[_+m]+""],O[_+2]=O[_+2]*100/l[O[_+m]+""]):(O[_+w]=0,O[_+2]=0);E.points=O}}t.hooks.processRawData.push(f),t.hooks.processDatapoints.push(d)}se.plot.plugins.push({init:e,options:V,name:"stackpercent",version:"0.1"})})(jQuery)},"../../public/vendor/flot/jquery.flot.time.js":function(){(function(se){var V={xaxis:{timezone:null,timeformat:null,twelveHourClock:!1,monthNames:null}};function e(c,E){return E*Math.floor(c/E)}function t(c,E,O,m){if(typeof c.strftime=="function")return c.strftime(E);var w=function(s,o){return s=""+s,o=""+(o==null?"0":o),s.length==1?o+s:s},_=[],C=!1,b=c.getHours(),g=b<12;O==null&&(O=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]),m==null&&(m=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"]);var v;b>12?v=b-12:b==0?v=12:v=b;for(var y=0;y<E.length;++y){var h=E.charAt(y);if(C){switch(h){case"a":h=""+m[c.getDay()];break;case"b":h=""+O[c.getMonth()];break;case"d":h=w(c.getDate(),"");break;case"e":h=w(c.getDate()," ");break;case"h":case"H":h=w(b);break;case"I":h=w(v);break;case"l":h=w(v," ");break;case"m":h=w(c.getMonth()+1,"");break;case"M":h=w(c.getMinutes());break;case"q":h=""+(Math.floor(c.getMonth()/3)+1);break;case"S":h=w(c.getSeconds());break;case"y":h=w(c.getFullYear()%100);break;case"Y":h=""+c.getFullYear();break;case"p":h=g?"am":"pm";break;case"P":h=g?"AM":"PM";break;case"w":h=""+c.getDay();break}_.push(h),C=!1}else h=="%"?C=!0:_.push(h)}return _.join("")}function n(c){function E(_,C,b,g){_[C]=function(){return b[g].apply(b,arguments)}}var O={date:c};c.strftime!=null&&E(O,"strftime",c,"strftime"),E(O,"getTime",c,"getTime"),E(O,"setTime",c,"setTime");for(var m=["Date","Day","FullYear","Hours","Milliseconds","Minutes","Month","Seconds"],w=0;w<m.length;w++)E(O,"get"+m[w],c,"getUTC"+m[w]),E(O,"set"+m[w],c,"setUTC"+m[w]);return O}function a(c,E){if(E.timezone=="browser")return new Date(c);if(!E.timezone||E.timezone=="utc")return n(new Date(c));if(typeof timezoneJS!="undefined"&&typeof timezoneJS.Date!="undefined"){var O=new timezoneJS.Date;return O.setTimezone(E.timezone),O.setTime(c),O}else return n(new Date(c))}var l={second:1e3,minute:60*1e3,hour:60*60*1e3,day:24*60*60*1e3,month:30*24*60*60*1e3,quarter:3*30*24*60*60*1e3,year:365.2425*24*60*60*1e3},f=[[1,"second"],[2,"second"],[5,"second"],[10,"second"],[30,"second"],[1,"minute"],[2,"minute"],[5,"minute"],[10,"minute"],[30,"minute"],[1,"hour"],[2,"hour"],[4,"hour"],[8,"hour"],[12,"hour"],[1,"day"],[2,"day"],[3,"day"],[.25,"month"],[.5,"month"],[1,"month"],[2,"month"]],x=f.concat([[3,"month"],[6,"month"],[1,"year"]]),d=f.concat([[1,"quarter"],[2,"quarter"],[1,"year"]]);function i(c){c.hooks.processOptions.push(function(E,O){se.each(E.getAxes(),function(m,w){var _=w.options;_.mode=="time"&&(w.tickGenerator=function(C){var b=[],g=a(C.min,_),v=0,y=_.tickSize&&_.tickSize[1]==="quarter"||_.minTickSize&&_.minTickSize[1]==="quarter"?d:x;_.minTickSize!=null&&(typeof _.tickSize=="number"?v=_.tickSize:v=_.minTickSize[0]*l[_.minTickSize[1]]);for(var h=0;h<y.length-1&&!(C.delta<(y[h][0]*l[y[h][1]]+y[h+1][0]*l[y[h+1][1]])/2&&y[h][0]*l[y[h][1]]>=v);++h);var s=y[h][0],o=y[h][1];if(o=="year"){if(_.minTickSize!=null&&_.minTickSize[1]=="year")s=Math.floor(_.minTickSize[0]);else{var r=Math.pow(10,Math.floor(Math.log(C.delta/l.year)/Math.LN10)),u=C.delta/l.year/r;u<1.5?s=1:u<3?s=2:u<7.5?s=5:s=10,s*=r}s<1&&(s=1)}C.tickSize=_.tickSize||[s,o];var p=C.tickSize[0];o=C.tickSize[1];var S=p*l[o];o=="second"?g.setSeconds(e(g.getSeconds(),p)):o=="minute"?g.setMinutes(e(g.getMinutes(),p)):o=="hour"?g.setHours(e(g.getHours(),p)):o=="month"?g.setMonth(e(g.getMonth(),p)):o=="quarter"?g.setMonth(3*e(g.getMonth()/3,p)):o=="year"&&g.setFullYear(e(g.getFullYear(),p)),g.setMilliseconds(0),S>=l.minute&&g.setSeconds(0),S>=l.hour&&g.setMinutes(0),S>=l.day&&g.setHours(0),S>=l.day*4&&g.setDate(1),S>=l.month*2&&g.setMonth(e(g.getMonth(),3)),S>=l.quarter*2&&g.setMonth(e(g.getMonth(),6)),S>=l.year&&g.setMonth(0);var k=0,D=Number.NaN,M;do if(M=D,D=g.getTime(),b.push(D),o=="month"||o=="quarter")if(p<1){g.setDate(1);var I=g.getTime();g.setMonth(g.getMonth()+(o=="quarter"?3:1));var T=g.getTime();g.setTime(D+k*l.hour+(T-I)*p),k=g.getHours(),g.setHours(0)}else g.setMonth(g.getMonth()+p*(o=="quarter"?3:1));else o=="year"?g.setFullYear(g.getFullYear()+p):g.setTime(D+S);while(D<C.max&&D!=M);return b},w.tickFormatter=function(C,b){var g=a(C,b.options);if(_.timeformat!=null)return t(g,_.timeformat,_.monthNames,_.dayNames);var v=b.options.tickSize&&b.options.tickSize[1]=="quarter"||b.options.minTickSize&&b.options.minTickSize[1]=="quarter",y=b.tickSize[0]*l[b.tickSize[1]],h=b.max-b.min,s=_.twelveHourClock?" %p":"",o=_.twelveHourClock?"%I":"%H",r;y<l.minute?r=o+":%M:%S"+s:y<l.day?h<2*l.day?r=o+":%M"+s:r="%b %d "+o+":%M"+s:y<l.month?r="%b %d":v&&y<l.quarter||!v&&y<l.year?h<l.year?r="%b":r="%b %Y":v&&y<l.year?h<l.year?r="Q%q":r="Q%q %Y":r="%Y";var u=t(g,r,_.monthNames,_.dayNames);return u})})})}se.plot.plugins.push({init:i,options:V,name:"time",version:"1.0"}),se.plot.formatDate=t})(jQuery)},"./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.story\\.(tsx%7Cmdx))$":function(se,V,e){var t={"./Intro.story.mdx":"./src/Intro.story.mdx","./components/Alert/InlineBanner.story.tsx":"./src/components/Alert/InlineBanner.story.tsx","./components/Alert/Toast.story.tsx":"./src/components/Alert/Toast.story.tsx","./components/Badge/Badge.story.tsx":"./src/components/Badge/Badge.story.tsx","./components/BarGauge/BarGauge.story.tsx":"./src/components/BarGauge/BarGauge.story.tsx","./components/BigValue/BigValue.story.tsx":"./src/components/BigValue/BigValue.story.tsx","./components/Button/Button.story.tsx":"./src/components/Button/Button.story.tsx","./components/ButtonCascader/ButtonCascader.story.tsx":"./src/components/ButtonCascader/ButtonCascader.story.tsx","./components/Card/Card.story.tsx":"./src/components/Card/Card.story.tsx","./components/Cascader/Cascader.story.tsx":"./src/components/Cascader/Cascader.story.tsx","./components/ClickOutsideWrapper/ClickOutsideWrapper.story.tsx":"./src/components/ClickOutsideWrapper/ClickOutsideWrapper.story.tsx","./components/Collapse/CollapsableSection.story.tsx":"./src/components/Collapse/CollapsableSection.story.tsx","./components/Collapse/Collapse.story.tsx":"./src/components/Collapse/Collapse.story.tsx","./components/ColorPicker/ColorPicker.story.tsx":"./src/components/ColorPicker/ColorPicker.story.tsx","./components/ColorPicker/ColorPickerPopover.story.tsx":"./src/components/ColorPicker/ColorPickerPopover.story.tsx","./components/ColorPicker/NamedColorsPalette.story.tsx":"./src/components/ColorPicker/NamedColorsPalette.story.tsx","./components/ColorPicker/SpectrumPalette.story.tsx":"./src/components/ColorPicker/SpectrumPalette.story.tsx","./components/ConfirmButton/ConfirmButton.story.tsx":"./src/components/ConfirmButton/ConfirmButton.story.tsx","./components/ConfirmModal/ConfirmModal.story.tsx":"./src/components/ConfirmModal/ConfirmModal.story.tsx","./components/ContextMenu/ContextMenu.story.tsx":"./src/components/ContextMenu/ContextMenu.story.tsx","./components/DataSourceSettings/DataSourceHttpSettings.story.tsx":"./src/components/DataSourceSettings/DataSourceHttpSettings.story.tsx","./components/DateTimePickers/DatePicker/DatePicker.story.tsx":"./src/components/DateTimePickers/DatePicker/DatePicker.story.tsx","./components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.story.tsx":"./src/components/DateTimePickers/DatePickerWithInput/DatePickerWithInput.story.tsx","./components/DateTimePickers/DateTimePicker/DateTimePicker.story.tsx":"./src/components/DateTimePickers/DateTimePicker/DateTimePicker.story.tsx","./components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.story.tsx":"./src/components/DateTimePickers/RelativeTimeRangePicker/RelativeTimeRangePicker.story.tsx","./components/DateTimePickers/TimeOfDayPicker.story.tsx":"./src/components/DateTimePickers/TimeOfDayPicker.story.tsx","./components/DateTimePickers/TimeRangeInput.story.tsx":"./src/components/DateTimePickers/TimeRangeInput.story.tsx","./components/DateTimePickers/TimeRangePicker.story.tsx":"./src/components/DateTimePickers/TimeRangePicker.story.tsx","./components/DateTimePickers/TimeZonePicker.story.tsx":"./src/components/DateTimePickers/TimeZonePicker.story.tsx","./components/DateTimePickers/WeekStartPicker.story.tsx":"./src/components/DateTimePickers/WeekStartPicker.story.tsx","./components/Drawer/Drawer.story.tsx":"./src/components/Drawer/Drawer.story.tsx","./components/Dropdown/Dropdown.story.tsx":"./src/components/Dropdown/Dropdown.story.tsx","./components/EmptySearchResult/EmptySearchResult.story.tsx":"./src/components/EmptySearchResult/EmptySearchResult.story.tsx","./components/ErrorBoundary/ErrorBoundary.story.tsx":"./src/components/ErrorBoundary/ErrorBoundary.story.tsx","./components/FileDropzone/FileDropzone.story.tsx":"./src/components/FileDropzone/FileDropzone.story.tsx","./components/FileDropzone/FileListItem.story.tsx":"./src/components/FileDropzone/FileListItem.story.tsx","./components/FileUpload/FileUpload.story.tsx":"./src/components/FileUpload/FileUpload.story.tsx","./components/FilterPill/FilterPill.story.tsx":"./src/components/FilterPill/FilterPill.story.tsx","./components/FormattedValueDisplay/FormattedValueDisplay.story.tsx":"./src/components/FormattedValueDisplay/FormattedValueDisplay.story.tsx","./components/Forms/Checkbox.story.tsx":"./src/components/Forms/Checkbox.story.tsx","./components/Forms/Field.story.tsx":"./src/components/Forms/Field.story.tsx","./components/Forms/FieldArray.story.tsx":"./src/components/Forms/FieldArray.story.tsx","./components/Forms/FieldSet.story.tsx":"./src/components/Forms/FieldSet.story.tsx","./components/Forms/FieldValidationMessage.story.tsx":"./src/components/Forms/FieldValidationMessage.story.tsx","./components/Forms/Form.story.tsx":"./src/components/Forms/Form.story.tsx","./components/Forms/InlineField.story.tsx":"./src/components/Forms/InlineField.story.tsx","./components/Forms/InlineFieldRow.story.tsx":"./src/components/Forms/InlineFieldRow.story.tsx","./components/Forms/InlineLabel.story.tsx":"./src/components/Forms/InlineLabel.story.tsx","./components/Forms/Label.story.tsx":"./src/components/Forms/Label.story.tsx","./components/Forms/Legend.story.tsx":"./src/components/Forms/Legend.story.tsx","./components/Forms/RadioButtonGroup/RadioButtonGroup.story.tsx":"./src/components/Forms/RadioButtonGroup/RadioButtonGroup.story.tsx","./components/Forms/RadioButtonList/RadioButtonList.story.tsx":"./src/components/Forms/RadioButtonList/RadioButtonList.story.tsx","./components/Icon/Icon.story.tsx":"./src/components/Icon/Icon.story.tsx","./components/IconButton/IconButton.story.tsx":"./src/components/IconButton/IconButton.story.tsx","./components/InfoBox/InfoBox.story.tsx":"./src/components/InfoBox/InfoBox.story.tsx","./components/Input/AutoSizeInput.story.tsx":"./src/components/Input/AutoSizeInput.story.tsx","./components/Input/Input.story.tsx":"./src/components/Input/Input.story.tsx","./components/InteractiveTable/InteractiveTable.story.tsx":"./src/components/InteractiveTable/InteractiveTable.story.tsx","./components/Layout/Layout.story.tsx":"./src/components/Layout/Layout.story.tsx","./components/LoadingBar/LoadingBar.story.tsx":"./src/components/LoadingBar/LoadingBar.story.tsx","./components/LoadingPlaceholder/LoadingPlaceholder.story.tsx":"./src/components/LoadingPlaceholder/LoadingPlaceholder.story.tsx","./components/Menu/Menu.story.tsx":"./src/components/Menu/Menu.story.tsx","./components/Modal/Modal.story.tsx":"./src/components/Modal/Modal.story.tsx","./components/PageLayout/PageToolbar.story.tsx":"./src/components/PageLayout/PageToolbar.story.tsx","./components/Pagination/Pagination.story.tsx":"./src/components/Pagination/Pagination.story.tsx","./components/PanelChrome/PanelChrome.story.tsx":"./src/components/PanelChrome/PanelChrome.story.tsx","./components/PanelContainer/PanelContainer.story.tsx":"./src/components/PanelContainer/PanelContainer.story.tsx","./components/PluginSignatureBadge/PluginSignatureBadge.story.tsx":"./src/components/PluginSignatureBadge/PluginSignatureBadge.story.tsx","./components/QueryField/QueryField.story.tsx":"./src/components/QueryField/QueryField.story.tsx","./components/RefreshPicker/RefreshPicker.story.tsx":"./src/components/RefreshPicker/RefreshPicker.story.tsx","./components/RenderUserContentAsHTML/RenderUserContentAsHTML.story.tsx":"./src/components/RenderUserContentAsHTML/RenderUserContentAsHTML.story.tsx","./components/SecretInput/SecretInput.story.tsx":"./src/components/SecretInput/SecretInput.story.tsx","./components/SecretTextArea/SecretTextArea.story.tsx":"./src/components/SecretTextArea/SecretTextArea.story.tsx","./components/Segment/Segment.story.tsx":"./src/components/Segment/Segment.story.tsx","./components/Segment/SegmentAsync.story.tsx":"./src/components/Segment/SegmentAsync.story.tsx","./components/Segment/SegmentInput.story.tsx":"./src/components/Segment/SegmentInput.story.tsx","./components/Select/Select.story.tsx":"./src/components/Select/Select.story.tsx","./components/Slider/RangeSlider.story.tsx":"./src/components/Slider/RangeSlider.story.tsx","./components/Slider/Slider.story.tsx":"./src/components/Slider/Slider.story.tsx","./components/Spinner/Spinner.story.tsx":"./src/components/Spinner/Spinner.story.tsx","./components/StatsPicker/StatsPicker.story.tsx":"./src/components/StatsPicker/StatsPicker.story.tsx","./components/Switch/Switch.story.tsx":"./src/components/Switch/Switch.story.tsx","./components/Table/Table.story.tsx":"./src/components/Table/Table.story.tsx","./components/Tabs/Tabs.story.tsx":"./src/components/Tabs/Tabs.story.tsx","./components/Tags/Tag.story.tsx":"./src/components/Tags/Tag.story.tsx","./components/Tags/TagList.story.tsx":"./src/components/Tags/TagList.story.tsx","./components/TagsInput/TagsInput.story.tsx":"./src/components/TagsInput/TagsInput.story.tsx","./components/TextArea/TextArea.story.tsx":"./src/components/TextArea/TextArea.story.tsx","./components/ThemeDemos/ThemeDemo.story.tsx":"./src/components/ThemeDemos/ThemeDemo.story.tsx","./components/Toggletip/Toggletip.story.tsx":"./src/components/Toggletip/Toggletip.story.tsx","./components/ToolbarButton/ToolbarButton.story.tsx":"./src/components/ToolbarButton/ToolbarButton.story.tsx","./components/ToolbarButton/ToolbarButtonRow.story.tsx":"./src/components/ToolbarButton/ToolbarButtonRow.story.tsx","./components/Tooltip/Tooltip.story.tsx":"./src/components/Tooltip/Tooltip.story.tsx","./components/Typography/Typography.story.tsx":"./src/components/Typography/Typography.story.tsx","./components/UnitPicker/UnitPicker.story.tsx":"./src/components/UnitPicker/UnitPicker.story.tsx","./components/ValuePicker/ValuePicker.story.tsx":"./src/components/ValuePicker/ValuePicker.story.tsx","./components/VizLayout/VizLayout.story.tsx":"./src/components/VizLayout/VizLayout.story.tsx","./components/VizLegend/VizLegend.story.tsx":"./src/components/VizLegend/VizLegend.story.tsx","./components/VizTooltip/SeriesTable.story.tsx":"./src/components/VizTooltip/SeriesTable.story.tsx"};function n(l){var f=a(l);return e(f)}function a(l){if(!e.o(t,l)){var f=new Error("Cannot find module '"+l+"'");throw f.code="MODULE_NOT_FOUND",f}return t[l]}n.keys=function(){return Object.keys(t)},n.resolve=a,se.exports=n,n.id="./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.story\\.(tsx%7Cmdx))$"},"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale sync recursive ^\\.\\/.*$":function(se,V,e){var t={"./af":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/af.js","./af.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/af.js","./ar":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar.js","./ar-dz":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-dz.js","./ar-dz.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-dz.js","./ar-kw":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-kw.js","./ar-kw.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-kw.js","./ar-ly":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-ly.js","./ar-ly.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-ly.js","./ar-ma":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-ma.js","./ar-ma.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-ma.js","./ar-sa":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-sa.js","./ar-sa.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-sa.js","./ar-tn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-tn.js","./ar-tn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar-tn.js","./ar.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ar.js","./az":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/az.js","./az.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/az.js","./be":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/be.js","./be.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/be.js","./bg":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bg.js","./bg.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bg.js","./bm":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bm.js","./bm.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bm.js","./bn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bn.js","./bn-bd":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bn-bd.js","./bn-bd.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bn-bd.js","./bn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bn.js","./bo":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bo.js","./bo.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bo.js","./br":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/br.js","./br.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/br.js","./bs":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bs.js","./bs.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/bs.js","./ca":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ca.js","./ca.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ca.js","./cs":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/cs.js","./cs.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/cs.js","./cv":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/cv.js","./cv.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/cv.js","./cy":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/cy.js","./cy.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/cy.js","./da":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/da.js","./da.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/da.js","./de":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/de.js","./de-at":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/de-at.js","./de-at.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/de-at.js","./de-ch":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/de-ch.js","./de-ch.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/de-ch.js","./de.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/de.js","./dv":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/dv.js","./dv.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/dv.js","./el":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/el.js","./el.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/el.js","./en-au":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-au.js","./en-au.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-au.js","./en-ca":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-ca.js","./en-ca.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-ca.js","./en-gb":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-gb.js","./en-gb.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-gb.js","./en-ie":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-ie.js","./en-ie.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-ie.js","./en-il":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-il.js","./en-il.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-il.js","./en-in":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-in.js","./en-in.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-in.js","./en-nz":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-nz.js","./en-nz.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-nz.js","./en-sg":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-sg.js","./en-sg.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/en-sg.js","./eo":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/eo.js","./eo.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/eo.js","./es":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/es.js","./es-do":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/es-do.js","./es-do.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/es-do.js","./es-mx":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/es-mx.js","./es-mx.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/es-mx.js","./es-us":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/es-us.js","./es-us.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/es-us.js","./es.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/es.js","./et":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/et.js","./et.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/et.js","./eu":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/eu.js","./eu.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/eu.js","./fa":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fa.js","./fa.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fa.js","./fi":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fi.js","./fi.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fi.js","./fil":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fil.js","./fil.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fil.js","./fo":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fo.js","./fo.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fo.js","./fr":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fr.js","./fr-ca":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fr-ca.js","./fr-ca.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fr-ca.js","./fr-ch":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fr-ch.js","./fr-ch.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fr-ch.js","./fr.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fr.js","./fy":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fy.js","./fy.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/fy.js","./ga":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ga.js","./ga.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ga.js","./gd":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gd.js","./gd.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gd.js","./gl":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gl.js","./gl.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gl.js","./gom-deva":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gom-deva.js","./gom-deva.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gom-deva.js","./gom-latn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gom-latn.js","./gom-latn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gom-latn.js","./gu":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gu.js","./gu.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/gu.js","./he":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/he.js","./he.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/he.js","./hi":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/hi.js","./hi.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/hi.js","./hr":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/hr.js","./hr.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/hr.js","./hu":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/hu.js","./hu.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/hu.js","./hy-am":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/hy-am.js","./hy-am.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/hy-am.js","./id":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/id.js","./id.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/id.js","./is":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/is.js","./is.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/is.js","./it":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/it.js","./it-ch":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/it-ch.js","./it-ch.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/it-ch.js","./it.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/it.js","./ja":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ja.js","./ja.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ja.js","./jv":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/jv.js","./jv.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/jv.js","./ka":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ka.js","./ka.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ka.js","./kk":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/kk.js","./kk.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/kk.js","./km":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/km.js","./km.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/km.js","./kn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/kn.js","./kn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/kn.js","./ko":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ko.js","./ko.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ko.js","./ku":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ku.js","./ku.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ku.js","./ky":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ky.js","./ky.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ky.js","./lb":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/lb.js","./lb.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/lb.js","./lo":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/lo.js","./lo.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/lo.js","./lt":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/lt.js","./lt.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/lt.js","./lv":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/lv.js","./lv.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/lv.js","./me":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/me.js","./me.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/me.js","./mi":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mi.js","./mi.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mi.js","./mk":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mk.js","./mk.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mk.js","./ml":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ml.js","./ml.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ml.js","./mn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mn.js","./mn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mn.js","./mr":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mr.js","./mr.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mr.js","./ms":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ms.js","./ms-my":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ms-my.js","./ms-my.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ms-my.js","./ms.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ms.js","./mt":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mt.js","./mt.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/mt.js","./my":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/my.js","./my.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/my.js","./nb":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/nb.js","./nb.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/nb.js","./ne":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ne.js","./ne.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ne.js","./nl":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/nl.js","./nl-be":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/nl-be.js","./nl-be.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/nl-be.js","./nl.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/nl.js","./nn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/nn.js","./nn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/nn.js","./oc-lnc":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/oc-lnc.js","./oc-lnc.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/oc-lnc.js","./pa-in":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/pa-in.js","./pa-in.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/pa-in.js","./pl":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/pl.js","./pl.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/pl.js","./pt":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/pt.js","./pt-br":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/pt-br.js","./pt-br.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/pt-br.js","./pt.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/pt.js","./ro":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ro.js","./ro.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ro.js","./ru":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ru.js","./ru.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ru.js","./sd":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sd.js","./sd.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sd.js","./se":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/se.js","./se.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/se.js","./si":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/si.js","./si.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/si.js","./sk":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sk.js","./sk.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sk.js","./sl":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sl.js","./sl.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sl.js","./sq":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sq.js","./sq.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sq.js","./sr":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sr.js","./sr-cyrl":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sr-cyrl.js","./sr-cyrl.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sr-cyrl.js","./sr.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sr.js","./ss":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ss.js","./ss.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ss.js","./sv":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sv.js","./sv.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sv.js","./sw":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sw.js","./sw.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/sw.js","./ta":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ta.js","./ta.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ta.js","./te":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/te.js","./te.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/te.js","./tet":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tet.js","./tet.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tet.js","./tg":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tg.js","./tg.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tg.js","./th":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/th.js","./th.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/th.js","./tk":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tk.js","./tk.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tk.js","./tl-ph":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tl-ph.js","./tl-ph.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tl-ph.js","./tlh":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tlh.js","./tlh.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tlh.js","./tr":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tr.js","./tr.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tr.js","./tzl":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tzl.js","./tzl.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tzl.js","./tzm":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tzm.js","./tzm-latn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tzm-latn.js","./tzm-latn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tzm-latn.js","./tzm.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/tzm.js","./ug-cn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ug-cn.js","./ug-cn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ug-cn.js","./uk":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/uk.js","./uk.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/uk.js","./ur":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ur.js","./ur.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/ur.js","./uz":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/uz.js","./uz-latn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/uz-latn.js","./uz-latn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/uz-latn.js","./uz.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/uz.js","./vi":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/vi.js","./vi.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/vi.js","./x-pseudo":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/x-pseudo.js","./x-pseudo.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/x-pseudo.js","./yo":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/yo.js","./yo.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/yo.js","./zh-cn":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/zh-cn.js","./zh-cn.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/zh-cn.js","./zh-hk":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/zh-hk.js","./zh-hk.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/zh-hk.js","./zh-mo":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/zh-mo.js","./zh-mo.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/zh-mo.js","./zh-tw":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/zh-tw.js","./zh-tw.js":"../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale/zh-tw.js"};function n(l){var f=a(l);return e(f)}function a(l){if(!e.o(t,l)){var f=new Error("Cannot find module '"+l+"'");throw f.code="MODULE_NOT_FOUND",f}return t[l]}n.keys=function(){return Object.keys(t)},n.resolve=a,se.exports=n,n.id="../../../yarn/cache/moment-npm-2.29.4-902943305d-0ec3f9c2bc.zip/node_modules/moment/locale sync recursive ^\\.\\/.*$"},"?8130":function(){},"?fdbe":function(){},"?06a6":function(){},"./generated-stories-entry.cjs":function(se,V,e){"use strict";se=e.nmd(se);var t=e("../../.yarn/__virtual__/@storybook-react-virtual-4e9a8200d6/2/yarn/cache/@storybook-react-npm-6.5.16-e176ae1aaf-c5396e748e.zip/node_modules/@storybook/react/dist/esm/client/index.js");(0,t.configure)([e("./src sync recursive ^\\.(?:(?:^%7C\\/%7C(?:(?:(?%21(?:^%7C\\/)\\.).)*?)\\/)(?%21\\.)(?=.)[^/]*?\\.story\\.(tsx%7Cmdx))$")],se,!1)}},function(se){var V=function(t){return se(se.s=t)};se.O(0,[873],function(){return V("../../.yarn/__virtual__/@storybook-core-client-virtual-c59a790023/2/yarn/cache/@storybook-core-client-npm-6.5.16-38a1ea48bf-467710777d.zip/node_modules/@storybook/core-client/dist/esm/globals/polyfills.js"),V("../../.yarn/__virtual__/@storybook-core-client-virtual-c59a790023/2/yarn/cache/@storybook-core-client-npm-6.5.16-38a1ea48bf-467710777d.zip/node_modules/@storybook/core-client/dist/esm/globals/globals.js"),V("./storybook-init-framework-entry.js"),V("../../.yarn/__virtual__/@storybook-react-virtual-4e9a8200d6/2/yarn/cache/@storybook-react-npm-6.5.16-e176ae1aaf-c5396e748e.zip/node_modules/@storybook/react/dist/esm/client/docs/config-generated-config-entry.js"),V("../../.yarn/__virtual__/@storybook-react-virtual-4e9a8200d6/2/yarn/cache/@storybook-react-npm-6.5.16-e176ae1aaf-c5396e748e.zip/node_modules/@storybook/react/dist/esm/client/preview/config-generated-config-entry.js"),V("../../.yarn/__virtual__/@storybook-addon-docs-virtual-460aeedd1b/2/yarn/cache/@storybook-addon-docs-npm-6.5.16-56ecbd77e7-3203abc3af.zip/node_modules/@storybook/addon-docs/preview.js-generated-config-entry.js"),V("../../.yarn/__virtual__/@storybook-addon-actions-virtual-f46914d153/2/yarn/cache/@storybook-addon-actions-npm-6.5.16-5325bab475-d506a932f3.zip/node_modules/@storybook/addon-actions/preview.js-generated-config-entry.js"),V("../../.yarn/__virtual__/@storybook-addon-measure-virtual-76c4f48dfc/2/yarn/cache/@storybook-addon-measure-npm-6.5.16-bb3d2ad0eb-52fc332496.zip/node_modules/@storybook/addon-measure/preview.js-generated-config-entry.js"),V("../../.yarn/__virtual__/@storybook-addon-outline-virtual-993d6deb27/2/yarn/cache/@storybook-addon-outline-npm-6.5.16-5681049c75-cb838ecbbd.zip/node_modules/@storybook/addon-outline/preview.js-generated-config-entry.js"),V("./.storybook/preview.ts-generated-config-entry.js"),V("./generated-stories-entry.cjs")});var e=se.O()}]);
