1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6638],{33:(e,s,l)=>{"use strict";l.r(s),l.d(s,{default:()=>d});var n=l(55427),a=l(97867),c=l(33722),i=l(81834),t=l(14782),r=l.n(t);let d=()=>{let[e,s]=(0,a.useState)("left"),[l,t]=(0,a.useState)(!1),[d,h]=(0,a.useState)("Flyout");return(0,n.jsxs)("div",{className:"FlyoutPage",children:[(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Right"}),(0,n.jsx)(i.A,{direction:"right",label:"Default",children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Down"}),(0,n.jsx)(i.A,{iconClassName:"icon--rotate",label:"Default",rightIcon:(0,n.jsx)(c.Q8q,{}),children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Up"}),(0,n.jsx)(i.A,{label:"Default",direction:"up",iconClassName:"icon--rotate",leftIcon:(0,n.jsx)(c.Q8q,{}),children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Left"}),(0,n.jsx)(i.A,{buttonClassName:"pl_0 pr_0 pt_0 pb_0 bg_transparent",direction:"left",rightIcon:(0,n.jsx)(r(),{src:"/assets/images/award_schools_courses.6b5a18bf.png",width:30,height:30,alt:"award image",sizes:"(max-width: 768px) 100vw,(max-width: 1200px) 50vw, 33vw"}),children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Right"}),(0,n.jsx)(i.A,{direction:"right",label:"Open on click",openOnClick:!0,children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Down"}),(0,n.jsx)(i.A,{openOnClick:!0,label:"Open on click",children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Up"}),(0,n.jsx)(i.A,{label:"Open on click",direction:"up",openOnClick:!0,children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Left"}),(0,n.jsx)(i.A,{buttonClassName:"pl_0 pr_0 pt_0 pb_0 bg_transparent",direction:"left",openOnClick:!0,rightIcon:(0,n.jsx)(r(),{src:"/assets/images/award_schools_courses.6b5a18bf.png",width:30,height:30,alt:"award image",sizes:"(max-width: 768px) 100vw,(max-width: 1200px) 50vw, 33vw"}),children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Right TranslateY(-45px)"}),(0,n.jsx)(i.A,{direction:"right",label:"Default",translateY:-4.5,children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Down TranslateX(0px)"}),(0,n.jsx)(i.A,{label:"Default",translateX:0,children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Up TranslateX(0px)"}),(0,n.jsx)(i.A,{label:"Default",direction:"up",translateX:0,children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Left TranslateY(-9px)"}),(0,n.jsx)(i.A,{buttonClassName:"pl_0 pr_0 pt_0 pb_0 bg_transparent",direction:"left",translateY:-9,rightIcon:(0,n.jsx)(r(),{src:"/assets/images/award_schools_courses.6b5a18bf.png",width:30,height:30,alt:"award image",sizes:"(max-width: 768px) 100vw,(max-width: 1200px) 50vw, 33vw"}),children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Right TranslateY(-45px)"}),(0,n.jsx)(i.A,{direction:"right",label:"Open on click",translateY:-4.5,openOnClick:!0,children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Down TranslateX(0px)"}),(0,n.jsx)(i.A,{openOnClick:!0,label:"Open on click",translateX:0,children:"Flyout"})]}),(0,n.jsxs)("div",{className:"centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Up TranslateX(-1px)"}),(0,n.jsx)(i.A,{label:"Open on click",direction:"up",translateX:-1,openOnClick:!0,children:"Flyout"})]}),(0,n.jsxs)("div",{className:" centered column_direction",children:[(0,n.jsx)("h1",{className:"h5",children:"Left TranslateY(-9px)"}),(0,n.jsx)(i.A,{buttonClassName:"pl_0 pr_0 pt_0 pb_0 bg_transparent",direction:"left",translateY:-9,openOnClick:!0,rightIcon:(0,n.jsx)(r(),{src:"/assets/images/award_schools_courses.6b5a18bf.png",width:30,height:30,alt:"award image",sizes:"(max-width: 768px) 100vw,(max-width: 1200px) 50vw, 33vw"}),children:"Flyout"})]}),(0,n.jsxs)("div",{className:"FlyoutPage__seventeenth_item centered",children:[(0,n.jsxs)("div",{className:"mr_30 self_end",children:[(0,n.jsxs)("div",{className:"h6",children:[(0,n.jsx)("label",{htmlFor:"labelText",children:"Label:"}),(0,n.jsx)("input",{id:"labelText",type:"text",value:d,onChange:e=>h(e.target.value)})]}),(0,n.jsxs)("div",{className:"h6",children:[(0,n.jsx)("label",{children:"Direction:"}),(0,n.jsxs)("select",{className:"w_100",name:"directions",id:"directions",onChange:e=>s(e.target.value),value:e,children:[(0,n.jsx)("option",{value:"left",children:"Left"}),(0,n.jsx)("option",{value:"right",children:"Right"}),(0,n.jsx)("option",{value:"up",children:"Up"}),(0,n.jsx)("option",{value:"down",children:"Down"})]})]}),(0,n.jsxs)("div",{className:"h5 centered",children:[(0,n.jsx)("label",{className:"mr_10",children:"Open on click:"}),(0,n.jsx)("input",{type:"checkbox",checked:l,onChange:e=>t(e.target.checked)})]})]}),(0,n.jsx)("div",{className:"self_start",children:(0,n.jsx)("div",{children:(0,n.jsx)(i.A,{label:d,direction:e,openOnClick:l})})})]})]})}},74500:(e,s,l)=>{(window.__NEXT_P=window.__NEXT_P||[]).push(["/components/flyout",function(){return l(33)}])}},e=>{e.O(0,[636,6593,8792],()=>e(e.s=74500)),_N_E=e.O()}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.