var Component=(()=>{var d=Object.create;var r=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,m=Object.prototype.hasOwnProperty;var F=(e,l)=>()=>(l||e((l={exports:{}}).exports,l),l.exports),N=(e,l)=>{for(var s in l)r(e,s,{get:l[s],enumerable:!0})},a=(e,l,s,o)=>{if(l&&typeof l=="object"||typeof l=="function")for(let c of E(l))!m.call(e,c)&&c!==s&&r(e,c,{get:()=>l[c],enumerable:!(o=h(l,c))||o.enumerable});return e};var C=(e,l,s)=>(s=e!=null?d(y(e)):{},a(l||!e||!e.__esModule?r(s,"default",{value:e,enumerable:!0}):s,e)),u=e=>a(r({},"__esModule",{value:!0}),e);var t=F((g,i)=>{i.exports=_jsx_runtime});var v={};N(v,{default:()=>A,frontmatter:()=>B});var n=C(t()),B={title:"Split Button",description:"A button that offers a primary interaction coupled with a dropdown menu offering additional actions.",peek:"split-button-default"};function p(e){let l=Object.assign({div:"div",h2:"h2",p:"p",pre:"pre",code:"code",span:"span"},e.components),{Preview:s}=l;return s||D("Preview",!0),(0,n.jsxs)(n.Fragment,{children:[(0,n.jsxs)(l.div,{className:"component-preview",children:[(0,n.jsx)(l.h2,{children:"Default"}),` `,(0,n.jsx)(l.p,{children:"The button's primary action should be the first item in the dropdown menu."}),` `,(0,n.jsx)(s,{name:"split-button-default",children:(0,n.jsxs)(l.div,{"data-rehype-pretty-code-fragment":"",children:[(0,n.jsx)(l.pre,{"data-language":"tsx","data-theme":"light",children:(0,n.jsxs)(l.code,{"data-language":"tsx","data-theme":"light",children:[(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" { ButtonProps } "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'geist/components'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" { Stack, SplitButton, SplitButtonMenuItem } "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'geist/components'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" { JSX } "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'react'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:" "}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"const"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SIZES"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:":"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"ButtonProps"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"["}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'size'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"][] "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" ["}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'small'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:", "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'medium'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:", "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'large'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"];"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"const"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"TYPES"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:":"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"Extract"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"<"}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"ButtonProps"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"["}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'type'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"], "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'default'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"|"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'secondary'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:">[] "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" ["})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'default'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:","})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'secondary'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:","})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"];"})}),` `,(0,n.jsx)(l.span,{className:"line",children:" "}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"export"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"function"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"Component"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"()"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:":"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"JSX"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"."}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"Element"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"return"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" ("})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"Stack"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"align"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"start"'}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"gap"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"8"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"} "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"justify"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"space-between"'}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:">"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"TYPES"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"."}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"map"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"(("}),(0,n.jsx)(l.span,{style:{color:"#E36209"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:") "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"return"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" ("})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"Stack"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"direction"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"row"'}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"gap"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"4"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"} "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"key"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{type}>"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SIZES"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"."}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"map"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"(("}),(0,n.jsx)(l.span,{style:{color:"#E36209"},children:"size"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:") "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"return"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" ("})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButton"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"buttonProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Saved'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" size,"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" type,"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"key"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{"}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"`${"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"}`"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"}"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuButtonLabel"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Select save method"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItems"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <>"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save changes"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Save'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" />"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save changes and create a new production deployment"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Save + Redeploy'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save + Redeploy"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" />"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{ width: "}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"264"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" >"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" Save"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" );"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" })}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" );"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" })}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" );"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"}"})})]})}),(0,n.jsx)(l.pre,{"data-language":"tsx","data-theme":"dark",__rawString__:`import type { ButtonProps } from 'geist/components'; import { Stack, SplitButton, SplitButtonMenuItem } from 'geist/components'; import type { JSX } from 'react'; const SIZES: ButtonProps['size'][] = ['small', 'medium', 'large']; const TYPES: Extract[] = [ 'default', 'secondary', ]; export function Component(): JSX.Element { return ( {TYPES.map((type) => { return ( {SIZES.map((size) => { return ( { // eslint-disable-next-line no-alert alert('Clicked Saved'); }, size, type, }} key={\`\${type}\`} menuButtonLabel="Select save method" menuItems={ <> { // eslint-disable-next-line no-alert alert('Clicked Save'); }, }} title="Save" /> { // eslint-disable-next-line no-alert alert('Clicked Save + Redeploy'); }, }} title="Save + Redeploy" /> } menuProps={{ width: 264 }} > Save ); })} ); })} ); } `,children:(0,n.jsxs)(l.code,{"data-language":"tsx","data-theme":"dark",children:[(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { ButtonProps } "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'geist/components'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { Stack, SplitButton, SplitButtonMenuItem } "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'geist/components'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { JSX } "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'react'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:" "}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"const"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SIZES"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:":"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"ButtonProps"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"["}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'size'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"][] "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ["}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'small'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:", "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'medium'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:", "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'large'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"];"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"const"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"TYPES"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:":"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"Extract"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"<"}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"ButtonProps"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"["}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'type'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"], "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'default'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"|"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'secondary'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:">[] "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ["})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'default'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'secondary'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:","})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"];"})}),` `,(0,n.jsx)(l.span,{className:"line",children:" "}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"export"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"function"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"Component"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"()"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:":"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"JSX"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"."}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"Element"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"return"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"Stack"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"align"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"start"'}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"gap"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"8"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"} "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"justify"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"space-between"'}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:">"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"TYPES"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"."}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"map"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"(("}),(0,n.jsx)(l.span,{style:{color:"#FFAB70"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:") "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"return"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"Stack"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"direction"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"row"'}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"gap"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"4"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"} "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"key"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{type}>"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SIZES"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"."}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"map"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"(("}),(0,n.jsx)(l.span,{style:{color:"#FFAB70"},children:"size"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:") "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"return"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButton"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"buttonProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Saved'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" size,"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" type,"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"key"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{"}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"`${"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"}`"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"}"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuButtonLabel"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Select save method"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItems"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <>"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save changes"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Save'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" />"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save changes and create a new production deployment"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Save + Redeploy'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save + Redeploy"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" />"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{ width: "}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"264"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" >"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" Save"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" })}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" })}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"}"})})]})})]})})]}),` `,(0,n.jsxs)(l.div,{className:"component-preview",children:[(0,n.jsx)(l.h2,{children:"Menu Alignment"}),` `,(0,n.jsx)(s,{name:"split-button-menu-alignment",children:(0,n.jsxs)(l.div,{"data-rehype-pretty-code-fragment":"",children:[(0,n.jsx)(l.pre,{"data-language":"tsx","data-theme":"light",children:(0,n.jsxs)(l.code,{"data-language":"tsx","data-theme":"light",children:[(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" { Stack, SplitButton, SplitButtonMenuItem } "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'geist/components'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" { JSX } "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'react'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:";"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:" "}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"export"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"function"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"Component"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"()"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:":"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"JSX"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"."}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"Element"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"return"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" ("})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"Stack"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"align"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"start"'}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"direction"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"row"'}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"gap"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"8"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"}>"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButton"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"buttonProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Saved'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuButtonLabel"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Select save method"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItems"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <>"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save changes"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Save'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" />"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save changes and create a new production deployment"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Save + Redeploy'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save + Redeploy"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" />"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{ width: "}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"264"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" >"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" Save"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:" "}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButton"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"buttonProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Saved'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuAlignment"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"bottom-end"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuButtonLabel"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Select save method"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItems"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <>"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save changes"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Save'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" />"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save changes and create a new production deployment"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:"'Clicked Save + Redeploy'"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#032F62"},children:'"Save + Redeploy"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" />"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6F42C1"},children:"menuProps"}),(0,n.jsx)(l.span,{style:{color:"#D73A49"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"{{ width: "}),(0,n.jsx)(l.span,{style:{color:"#005CC5"},children:"264"}),(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" }}"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" >"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" Save"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:" );"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#24292E"},children:"}"})})]})}),(0,n.jsx)(l.pre,{"data-language":"tsx","data-theme":"dark",__rawString__:`import { Stack, SplitButton, SplitButtonMenuItem } from 'geist/components'; import type { JSX } from 'react'; export function Component(): JSX.Element { return ( { // eslint-disable-next-line no-alert alert('Clicked Saved'); }, }} menuButtonLabel="Select save method" menuItems={ <> { // eslint-disable-next-line no-alert alert('Clicked Save'); }, }} title="Save" /> { // eslint-disable-next-line no-alert alert('Clicked Save + Redeploy'); }, }} title="Save + Redeploy" /> } menuProps={{ width: 264 }} > Save { // eslint-disable-next-line no-alert alert('Clicked Saved'); }, }} menuAlignment="bottom-end" menuButtonLabel="Select save method" menuItems={ <> { // eslint-disable-next-line no-alert alert('Clicked Save'); }, }} title="Save" /> { // eslint-disable-next-line no-alert alert('Clicked Save + Redeploy'); }, }} title="Save + Redeploy" /> } menuProps={{ width: 264 }} > Save ); } `,children:(0,n.jsxs)(l.code,{"data-language":"tsx","data-theme":"dark",children:[(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { Stack, SplitButton, SplitButtonMenuItem } "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'geist/components'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"import"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"type"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" { JSX } "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"from"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'react'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:";"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:" "}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"export"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"function"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"Component"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"()"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:":"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"JSX"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"."}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"Element"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"return"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" ("})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"Stack"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"align"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"start"'}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"direction"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"row"'}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"gap"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"8"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"}>"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButton"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"buttonProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Saved'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuButtonLabel"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Select save method"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItems"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <>"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save changes"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Save'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" />"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save changes and create a new production deployment"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Save + Redeploy'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save + Redeploy"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" />"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{ width: "}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"264"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" >"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" Save"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:" "}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButton"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"buttonProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Saved'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuAlignment"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"bottom-end"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuButtonLabel"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Select save method"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItems"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <>"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save changes"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Save'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" />"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" <"}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"SplitButtonMenuItem"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"description"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save changes and create a new production deployment"'})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuItemProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"onClick"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:": () "}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"=>"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" {"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#6A737D"},children:"// eslint-disable-next-line no-alert"})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"alert"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"("}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:"'Clicked Save + Redeploy'"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:");"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" },"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"title"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#9ECBFF"},children:'"Save + Redeploy"'})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" />"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "}),(0,n.jsx)(l.span,{style:{color:"#B392F0"},children:"menuProps"}),(0,n.jsx)(l.span,{style:{color:"#F97583"},children:"="}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"{{ width: "}),(0,n.jsx)(l.span,{style:{color:"#79B8FF"},children:"264"}),(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" }}"})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" >"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" Save"})}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,n.jsxs)(l.span,{className:"line",children:[(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" "})]}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:" );"})}),` `,(0,n.jsx)(l.span,{className:"line",children:(0,n.jsx)(l.span,{style:{color:"#E1E4E8"},children:"}"})})]})})]})})]})]})}function S(e={}){let{wrapper:l}=e.components||{};return l?(0,n.jsx)(l,Object.assign({},e,{children:(0,n.jsx)(p,e)})):p(e)}var A=S;function D(e,l){throw new Error("Expected "+(l?"component":"object")+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}return u(v);})(); ;return Component;