@storybook/addon-onboarding 0.0.36-canary.58.cc0f34a.0 → 0.0.36-canary.58.ddefce1.0

package/dist/manager.mjs

@@ -52,7 +52,7 @@ var Ao=Object.defineProperty;var a=(t,o)=>()=>(t&&(o=t(t=0)),o);var jo=(t,o)=>{f
     box-shadow: ${({variant:t})=>t==="primary"?"inset 0 0 0 1px rgba(0, 0, 0, 0.2)":t==="secondary"||t==="outline"?"inset 0 0 0 1px #0b94eb":"inset 0 0 0 2px rgba(0, 0, 0, 0.1)"};
   }
 `,m=forwardRef(({children:t,onClick:o,variant:r="primary",...n},i)=>e.createElement(qo,{ref:i,onClick:o,variant:r,...n},t));});var Jo,Ro,te,oe,ee,rt,nt=a(()=>{N();Jo=styled.div`
-  background: ${({theme:t})=>t.base==="dark"?"#292A2C":t.color.lightest};
+  background: ${({theme:t})=>t.base==="dark"?"#292A2C":t.background.app};
   width: 260px;
   padding: 15px;
   border-radius: 5px;
@@ -74,7 +74,7 @@ var Ao=Object.defineProperty;var a=(t,o)=>()=>(t&&(o=t(t=0)),o);var jo=(t,o)=>{f
   display: flex;
   justify-content: flex-end;
   margin-top: 15px;
-`,rt=({step:t,primaryProps:o,tooltipProps:r})=>e.createElement(Jo,{...r},e.createElement(Ro,null,t.title&&e.createElement(te,null,t.title),e.createElement(oe,null,t.content)),!t.hideNextButton&&e.createElement(ee,{id:"buttonNext"},e.createElement(m,{...o,...t.onNextButtonClick?{onClick:t.onNextButtonClick}:{}},"Next")));});function it({api:t,isFinalStep:o,onFirstTourDone:r,onLastTourDone:n}){let[i,s]=useState(),p=useTheme();return useEffect(()=>{t.once(UPDATE_STORY_ARGS,()=>{s(3);});},[]),e.createElement(ie,{steps:o?[{target:"#example-button--warning",title:"Congratulations!",content:e.createElement(e.Fragment,null,"You just created your first story. You nailed the basics. ",e.createElement("br",null),"Continue setting up your project and start writing stories for your components."),placement:"right",disableOverlay:!0,disableBeacon:!0,floaterProps:{disableAnimation:!0},onNextButtonClick(){n();}}]:[{target:"#storybook-explorer-tree > div",title:"Storybook is built from stories",content:"Storybook stories represent the key states of each of your components. For example, this Button component has four stories.",placement:"right",disableBeacon:!0,styles:{spotlight:{transform:"translateY(30px)"}},floaterProps:{disableAnimation:!0}},{target:"#storybook-preview-iframe",title:"Storybook previews are interactive",content:"Whenever you modify code or stories, Storybook automatically updates how it previews your components.",placement:"bottom"},{target:"#root div[role=main]",title:"Interactive story playground",content:e.createElement(e.Fragment,null,"See how a story renders with different data and state without touching code.",e.createElement("br",null),e.createElement("br",null),"Try it out by pressing this button.",e.createElement(tt,{targetSelector:"#control-primary"})),placement:"right",spotlightClicks:!0,floaterProps:{target:"#control-primary"},hideNextButton:!0},{target:"#control-primary",title:"Congratulations!",content:e.createElement(e.Fragment,null,"You've learned how to control your stories interactively. Now let's explore how to write your first story.",e.createElement(z,{numberOfPieces:800,recycle:!1,tweenDuration:2e4})),placement:"right",disableOverlay:!0}],continuous:!0,stepIndex:i,spotlightPadding:0,hideBackButton:!0,disableCloseOnEsc:!0,disableOverlayClose:!0,disableScrolling:!0,hideCloseButton:!0,callback:l=>{!o&&l.status===STATUS.FINISHED&&r();},floaterProps:{styles:{floater:{padding:0,paddingLeft:8,paddingTop:8,filter:p.base==="light"?"drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1))":"drop-shadow(#fff5 0px 0px 0.5px) drop-shadow(#fff5 0px 0px 0.5px)"}}},tooltipComponent:rt,styles:{spotlight:{border:"solid 2px #004c7c"},overlay:{backgroundColor:"rgba(0, 0, 0, 0.48)"},options:{zIndex:1e4,primaryColor:p.color.secondary,arrowColor:p.base==="dark"?"#292A2C":p.color.lightest}}})}var st=a(()=>{ot();H();nt();});var lt,de,dt,mt=a(()=>{lt=styled.div`
+`,rt=({step:t,primaryProps:o,tooltipProps:r})=>e.createElement(Jo,{...r},e.createElement(Ro,null,t.title&&e.createElement(te,null,t.title),e.createElement(oe,null,t.content)),!t.hideNextButton&&e.createElement(ee,{id:"buttonNext"},e.createElement(m,{...o,...t.onNextButtonClick?{onClick:t.onNextButtonClick}:{}},"Next")));});function it({api:t,isFinalStep:o,onFirstTourDone:r,onLastTourDone:n}){let[i,s]=useState(),p=useTheme();return useEffect(()=>{t.once(UPDATE_STORY_ARGS,()=>{s(3);});},[]),e.createElement(ie,{steps:o?[{target:"#example-button--warning",title:"Congratulations!",content:e.createElement(e.Fragment,null,"You just created your first story. You nailed the basics. ",e.createElement("br",null),"Continue setting up your project and start writing stories for your components."),placement:"right",disableOverlay:!0,disableBeacon:!0,floaterProps:{disableAnimation:!0},onNextButtonClick(){n();}}]:[{target:"#storybook-explorer-tree > div",title:"Storybook is built from stories",content:"Storybook stories represent the key states of each of your components. For example, this Button component has four stories.",placement:"right",disableBeacon:!0,styles:{spotlight:{transform:"translateY(30px)"}},floaterProps:{disableAnimation:!0}},{target:"#storybook-preview-iframe",title:"Storybook previews are interactive",content:"Whenever you modify code or stories, Storybook automatically updates how it previews your components.",placement:"bottom"},{target:"#root div[role=main]",title:"Interactive story playground",content:e.createElement(e.Fragment,null,"See how a story renders with different data and state without touching code.",e.createElement("br",null),e.createElement("br",null),"Try it out by pressing this button.",e.createElement(tt,{targetSelector:"#control-primary"})),placement:"right",spotlightClicks:!0,floaterProps:{target:"#control-primary"},hideNextButton:!0},{target:"#control-primary",title:"Congratulations!",content:e.createElement(e.Fragment,null,"You've learned how to control your stories interactively. Now let's explore how to write your first story.",e.createElement(z,{numberOfPieces:800,recycle:!1,tweenDuration:2e4})),placement:"right",disableOverlay:!0}],continuous:!0,stepIndex:i,spotlightPadding:0,hideBackButton:!0,disableCloseOnEsc:!0,disableOverlayClose:!0,disableScrolling:!0,hideCloseButton:!0,callback:l=>{!o&&l.status===STATUS.FINISHED&&r();},floaterProps:{styles:{floater:{padding:0,paddingLeft:8,paddingTop:8,filter:p.base==="light"?"drop-shadow(0px 5px 5px rgba(0,0,0,0.05)) drop-shadow(0 1px 3px rgba(0,0,0,0.1))":"drop-shadow(white 0px 0px 0.5px) drop-shadow(white 0px 0px 0.5px)"}}},tooltipComponent:rt,styles:{spotlight:{border:"solid 2px #004c7c"},overlay:{backgroundColor:"rgba(0, 0, 0, 0.48)"},options:{zIndex:1e4,primaryColor:p.color.secondary,arrowColor:p.base==="dark"?"#292A2C":p.background.app}}})}var st=a(()=>{ot();H();nt();});var lt,de,dt,mt=a(()=>{lt=styled.div`
   background-color: rgba(27, 28, 29, 0.48);
   position: fixed;
   inset: 0px;
@@ -362,11 +362,6 @@ var Ao=Object.defineProperty;var a=(t,o)=>()=>(t&&(o=t(t=0)),o);var jo=(t,o)=>{f
   padding-left: 15px;
   padding-right: 15px;
   padding-top: 6px;
-  border-left: ${({theme:t})=>t.base==="dark"?1:0}px solid #fff2;
-  border-bottom: ${({theme:t})=>t.base==="dark"?1:0}px solid #fff2;
-  border-top: ${({theme:t})=>t.base==="dark"?1:0}px solid #fff2;
-  border-radius: 6px 0 0 6px;
-  overflow: hidden;
 
   && {
     pre {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-onboarding",
-  "version": "0.0.36-canary.58.cc0f34a.0",
+  "version": "0.0.36-canary.58.ddefce1.0",
   "description": "Storybook Addon Onboarding - Introduces a new onboarding experience",
   "keywords": [
     "storybook-addons",