import{a as e,n as t}from"./chunk-BneVvdWh.js";import{t as n}from"./react-C7IZe2D1.js";import{t as r}from"./jsx-runtime-C2wGStra.js";import{t as i}from"./Button-DqcfuOFN.js";import{n as a}from"./OnboardingTooltip-CFzGjB8g.js";import{r as o}from"./AlertBannerAction-BKNUkKu8.js";import{t as s}from"./IconButton-DZfzVk_P.js";import{i as c,t as l}from"./DropdownMenu-DkqSxc9y.js";import{t as u}from"./Tooltip-F-35Ygr4.js";import{n as d,t as f}from"./TokyoUIFav-vlMA44YV.js";var p,m,h,g,_,v,y,b,x,S,C,w,T,E,D,O,k,A,j;t((()=>{p=e(n(),1),o(),d(),m=r(),{expect:h,waitFor:g,userEvent:_,within:v,fireEvent:y,waitForElementToBeRemoved:b}=__STORYBOOK_MODULE_TEST__,x={tooltip:e=>(0,m.jsx)(u,{content:`This is a tooltip`,dataset:{testid:`tooltip`},children:e}),onboardingTooltip:e=>(0,m.jsx)(a,{title:`New Feature Available!`,text:`We've added an exciting new feature to enhance your experience.`,children:e}),dropdownMenu:e=>(0,m.jsx)(l,{trigger:e,children:(0,m.jsx)(c,{label:`Dropdown Menu Item`})})},S={tooltip:async({canvas:e,step:t})=>{let n=await e.findByRole(`button`,{name:`Trigger button`});await t(`focus on the icon button`,async()=>{n.focus(),await g(async()=>{await h(await e.findByTestId(`tooltip`)).toBeVisible()})}),await t(`unfocus the icon button`,async()=>{await _.tab(),await b(()=>e.queryByTestId(`tooltip`))}),await t(`hover the icon button`,async()=>{await _.hover(n),await g(async()=>{await h(await e.findByTestId(`tooltip`)).toBeVisible()})}),await t(`unhover the icon button`,async()=>{await _.unhover(n),y.pointerMove(document,{clientX:0,clientY:0}),await b(()=>e.queryByTestId(`tooltip`))})},onboardingTooltip:async({canvas:e,step:t})=>{let n=await e.findByRole(`dialog`,{name:`New Feature Available!`});await t(`wait for onboarding tooltip to be visible`,async()=>{await g(async()=>{await h(n).toBeVisible()})}),await t(`click on onboarding tooltip action`,async()=>{await _.click(v(n).getByRole(`button`,{name:`Got it`}))})},dropdownMenu:async({canvas:e,step:t})=>{let n=await e.findByRole(`button`,{name:`Trigger button`});await t(`open dropdown menu `,async()=>{await _.click(n),await g(async()=>{await h(await e.findByRole(`menu`)).toBeVisible()})}),await t(`close dropdown menu`,async()=>{await _.keyboard(`{Escape}`),await g(async()=>{await h(await e.queryByRole(`menu`)).not.toBeInTheDocument()})})}},C=(0,m.jsx)(s,{svg:(0,m.jsx)(f,{}),assistiveText:`Trigger button`}),w={title:`Guides/Composing Popovers`,render:({popovers:e})=>e.reduceRight((e,t)=>t(e),C),argTypes:{popovers:{table:{disable:!0},control:!1}},parameters:{preventIframeFromScrollingParent:!0,layout:`fullscreen`,docs:{story:{inline:!1,height:400},source:{type:`dynamic`},argTypes:{include:[]},description:{component:`In some cases, you might want to use multiple popover-like
components together with the same target element.

You can do this by wrapping the target element with both components either way.`}},chromatic:{disableSnapshot:!0}},decorators:[e=>{let[t,n]=(0,p.useState)(0);return(0,m.jsxs)(m.Fragment,{children:[(0,m.jsx)(`div`,{style:{height:`90vh`,padding:16,position:`relative`,display:`flex`,alignItems:`center`,justifyContent:`center`},children:(0,m.jsx)(e,{},t)}),(0,m.jsx)(`div`,{style:{position:`fixed`,left:0,bottom:0,margin:8},children:(0,m.jsx)(i,{variant:`ghost`,size:`small`,onClick:()=>n(t+1),children:`Reset story`})})]})}],async afterEach({canvas:e}){await _.click(await e.findByRole(`button`,{name:`Reset story`}))}},T={name:`Tooltip with OnboardingTooltip`,args:{popovers:[x.tooltip,x.onboardingTooltip]},async play(e){await S.onboardingTooltip(e),await S.tooltip(e)}},E={name:`OnboardingTooltip with Tooltip`,args:{popovers:[x.onboardingTooltip,x.tooltip]},play:T.play},D={name:`DropdownMenu with Tooltip`,args:{popovers:[x.dropdownMenu,x.tooltip]},async play(e){await S.tooltip(e),await S.dropdownMenu(e)}},O={name:`Tooltip with DropdownMenu`,args:{popovers:[x.tooltip,x.dropdownMenu]},play:D.play},k={name:`DropdownMenu with OnboardingTooltip`,args:{popovers:[x.dropdownMenu,x.onboardingTooltip]},async play(e){await S.onboardingTooltip(e),await S.dropdownMenu(e)}},A={name:`OnboardingTooltip with DropdownMenu`,args:{popovers:[x.onboardingTooltip,x.dropdownMenu]},play:k.play},T.parameters={...T.parameters,docs:{...T.parameters?.docs,source:{originalSource:`{
  name: 'Tooltip with OnboardingTooltip',
  args: {
    popovers: [popovers.tooltip, popovers.onboardingTooltip]
  },
  async play(ctx) {
    await tests.onboardingTooltip(ctx);
    await tests.tooltip(ctx);
  }
}`,...T.parameters?.docs?.source}}},E.parameters={...E.parameters,docs:{...E.parameters?.docs,source:{originalSource:`{
  name: 'OnboardingTooltip with Tooltip',
  args: {
    popovers: [popovers.onboardingTooltip, popovers.tooltip]
  },
  play: TooltipWithOnboardingTooltip.play
}`,...E.parameters?.docs?.source}}},D.parameters={...D.parameters,docs:{...D.parameters?.docs,source:{originalSource:`{
  name: 'DropdownMenu with Tooltip',
  args: {
    popovers: [popovers.dropdownMenu, popovers.tooltip]
  },
  async play(ctx) {
    await tests.tooltip(ctx);
    await tests.dropdownMenu(ctx);
  }
}`,...D.parameters?.docs?.source}}},O.parameters={...O.parameters,docs:{...O.parameters?.docs,source:{originalSource:`{
  name: 'Tooltip with DropdownMenu',
  args: {
    popovers: [popovers.tooltip, popovers.dropdownMenu]
  },
  play: DropdownMenuWithTooltip.play
}`,...O.parameters?.docs?.source}}},k.parameters={...k.parameters,docs:{...k.parameters?.docs,source:{originalSource:`{
  name: 'DropdownMenu with OnboardingTooltip',
  args: {
    popovers: [popovers.dropdownMenu, popovers.onboardingTooltip]
  },
  async play(ctx) {
    await tests.onboardingTooltip(ctx);
    await tests.dropdownMenu(ctx);
  }
}`,...k.parameters?.docs?.source}}},A.parameters={...A.parameters,docs:{...A.parameters?.docs,source:{originalSource:`{
  name: 'OnboardingTooltip with DropdownMenu',
  args: {
    popovers: [popovers.onboardingTooltip, popovers.dropdownMenu]
  },
  play: DropdownMenuWithOnboardingTooltip.play
}`,...A.parameters?.docs?.source}}},j=[`TooltipWithOnboardingTooltip`,`OnboardingTooltipWithTooltip`,`DropdownMenuWithTooltip`,`TooltipWithDropdownMenu`,`DropdownMenuWithOnboardingTooltip`,`OnboardingTooltipWithDropdownMenu`]}))();export{k as DropdownMenuWithOnboardingTooltip,D as DropdownMenuWithTooltip,A as OnboardingTooltipWithDropdownMenu,E as OnboardingTooltipWithTooltip,O as TooltipWithDropdownMenu,T as TooltipWithOnboardingTooltip,j as __namedExportsOrder,w as default};