@platformatic/ui-components 0.1.4 → 0.1.6

package/storybook-static/assets/GlobalScrollAreaStyles-8793ce4a.cf1537f5.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalScrollAreaStyles-8793ce4a.cf1537f5.js","sources":["../../node_modules/@storybook/components/dist/esm/GlobalScrollAreaStyles-8793ce4a.js"],"sourcesContent":["import \"core-js/modules/es.array.slice.js\";\nimport \"core-js/modules/es.object.freeze.js\";\n\nvar _templateObject;\n\nfunction _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }\n\nimport React__default from 'react';\nimport { keyframes, Global } from '@storybook/theming';\nvar hsResizeObserverDummyAnimation = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral([\"0%{z-index:0}to{z-index:-1}\"])));\n\nvar getScrollAreaStyles = function getScrollAreaStyles(theme) {\n  return {\n    'html.os-html, html.os-html>.os-host': {\n      display: 'block',\n      overflow: 'hidden',\n      boxSizing: 'border-box',\n      height: '100%!important',\n      width: '100%!important',\n      minWidth: '100%!important',\n      minHeight: '100%!important',\n      margin: '0!important',\n      position: 'absolute!important'\n    },\n    'html.os-html>.os-host>.os-padding': {\n      position: 'absolute'\n    },\n    'body.os-dragging, body.os-dragging *': {\n      cursor: 'default'\n    },\n    '.os-host, .os-host-textarea': {\n      position: 'relative',\n      overflow: 'visible!important',\n      flexDirection: 'column',\n      flexWrap: 'nowrap',\n      justifyContent: 'flex-start',\n      alignContent: 'flex-start',\n      alignItems: 'flex-start'\n    },\n    '.os-host-flexbox': {\n      overflow: 'hidden!important',\n      display: 'flex'\n    },\n    '.os-host-flexbox>.os-size-auto-observer': {\n      height: 'inherit!important'\n    },\n    '.os-host-flexbox>.os-content-glue': {\n      flexGrow: 1,\n      flexShrink: 0\n    },\n    '.os-host-flexbox>.os-size-auto-observer, .os-host-flexbox>.os-content-glue': {\n      minHeight: 0,\n      minWidth: 0,\n      flexGrow: 0,\n      flexShrink: 1,\n      flexBasis: 'auto'\n    },\n    '#os-dummy-scrollbar-size': {\n      position: 'fixed',\n      opacity: 0,\n      visibility: 'hidden',\n      overflow: 'scroll',\n      height: 500,\n      width: 500\n    },\n    '#os-dummy-scrollbar-size>div': {\n      width: '200%',\n      height: '200%',\n      margin: 10\n    },\n    '#os-dummy-scrollbar-size, .os-viewport': {},\n    '.os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size, .os-viewport-native-scrollbars-invisible.os-viewport': {\n      scrollbarWidth: 'none!important'\n    },\n    '.os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size::-webkit-scrollbar, .os-viewport-native-scrollbars-invisible.os-viewport::-webkit-scrollbar, .os-viewport-native-scrollbars-invisible#os-dummy-scrollbar-size::-webkit-scrollbar-corner, .os-viewport-native-scrollbars-invisible.os-viewport::-webkit-scrollbar-corner': {\n      display: 'none!important',\n      width: '0!important',\n      height: '0!important',\n      visibility: 'hidden!important',\n      background: '0 0!important'\n    },\n    '.os-content-glue': {\n      boxSizing: 'inherit',\n      maxHeight: '100%',\n      maxWidth: '100%',\n      width: '100%',\n      pointerEvents: 'none'\n    },\n    '.os-padding': {\n      boxSizing: 'inherit',\n      direction: 'inherit',\n      position: 'absolute',\n      overflow: 'visible',\n      padding: 0,\n      margin: 0,\n      left: 0,\n      top: 0,\n      bottom: 0,\n      right: 0,\n      width: 'auto!important',\n      height: 'auto!important',\n      zIndex: 1\n    },\n    '.os-host-overflow>.os-padding': {\n      overflow: 'hidden'\n    },\n    '.os-viewport': {\n      direction: 'inherit!important',\n      boxSizing: 'inherit!important',\n      resize: 'none!important',\n      outline: '0!important',\n      position: 'absolute',\n      overflow: 'hidden',\n      top: 0,\n      left: 0,\n      bottom: 0,\n      right: 0,\n      padding: 0,\n      margin: 0\n    },\n    '.os-content-arrange': {\n      position: 'absolute',\n      zIndex: -1,\n      minHeight: 1,\n      minWidth: 1,\n      pointerEvents: 'none'\n    },\n    '.os-content': {\n      direction: 'inherit',\n      boxSizing: 'border-box!important',\n      position: 'relative',\n      display: 'block',\n      height: '100%',\n      width: '100%',\n      visibility: 'visible'\n    },\n    '.os-content:before, .os-content:after': {\n      content: \"''\",\n      display: 'table',\n      width: 0,\n      height: 0,\n      lineHeight: 0,\n      fontSize: 0\n    },\n    '.os-content>.os-textarea': {\n      boxSizing: 'border-box!important',\n      direction: 'inherit!important',\n      background: '0 0!important',\n      outline: '0 transparent!important',\n      overflow: 'hidden!important',\n      position: 'absolute!important',\n      display: 'block!important',\n      top: '0!important',\n      left: '0!important',\n      margin: '0!important',\n      borderRadius: '0!important',\n      float: 'none!important',\n      filter: 'none!important',\n      border: '0!important',\n      resize: 'none!important',\n      transform: 'none!important',\n      maxWidth: 'none!important',\n      maxHeight: 'none!important',\n      boxShadow: 'none!important',\n      perspective: 'none!important',\n      opacity: '1!important',\n      zIndex: '1!important',\n      clip: 'auto!important',\n      verticalAlign: 'baseline!important',\n      padding: 0\n    },\n    '.os-host-rtl>.os-padding>.os-viewport>.os-content>.os-textarea': {\n      right: '0!important'\n    },\n    '.os-content>.os-textarea-cover': {\n      zIndex: -1,\n      pointerEvents: 'none'\n    },\n    '.os-content>.os-textarea[wrap=off]': {\n      whiteSpace: 'pre!important',\n      margin: '0!important'\n    },\n    '.os-text-inherit': {\n      fontFamily: 'inherit',\n      fontSize: 'inherit',\n      fontWeight: 'inherit',\n      fontStyle: 'inherit',\n      fontVariant: 'inherit',\n      textTransform: 'inherit',\n      textDecoration: 'inherit',\n      textIndent: 'inherit',\n      textAlign: 'inherit',\n      textShadow: 'inherit',\n      textOverflow: 'inherit',\n      letterSpacing: 'inherit',\n      wordSpacing: 'inherit',\n      lineHeight: 'inherit',\n      unicodeBidi: 'inherit',\n      direction: 'inherit',\n      color: 'inherit',\n      cursor: 'text'\n    },\n    '.os-resize-observer, .os-resize-observer-host': {\n      boxSizing: 'inherit',\n      display: 'block',\n      opacity: 0,\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      height: '100%',\n      width: '100%',\n      overflow: 'hidden',\n      pointerEvents: 'none',\n      zIndex: -1\n    },\n    '.os-resize-observer-host': {\n      padding: 'inherit',\n      border: 'inherit',\n      borderColor: 'transparent',\n      borderStyle: 'solid',\n      boxSizing: 'border-box'\n    },\n    '.os-resize-observer-host:after': {\n      content: \"''\"\n    },\n    '.os-resize-observer-host>.os-resize-observer, .os-resize-observer-host:after': {\n      height: '200%',\n      width: '200%',\n      padding: 'inherit',\n      border: 'inherit',\n      margin: 0,\n      display: 'block',\n      boxSizing: 'content-box'\n    },\n    '.os-resize-observer.observed, object.os-resize-observer': {\n      boxSizing: 'border-box!important'\n    },\n    '.os-size-auto-observer': {\n      boxSizing: 'inherit!important',\n      height: '100%',\n      width: 'inherit',\n      maxWidth: 1,\n      position: 'relative',\n      float: 'left',\n      maxHeight: 1,\n      overflow: 'hidden',\n      zIndex: -1,\n      padding: 0,\n      margin: 0,\n      pointerEvents: 'none',\n      flexGrow: 'inherit',\n      flexShrink: 0,\n      flexBasis: 0\n    },\n    '.os-size-auto-observer>.os-resize-observer': {\n      width: '1000%',\n      height: '1000%',\n      minHeight: 1,\n      minWidth: 1\n    },\n    '.os-resize-observer-item': {\n      position: 'absolute',\n      top: 0,\n      right: 0,\n      bottom: 0,\n      left: 0,\n      overflow: 'hidden',\n      zIndex: -1,\n      opacity: 0,\n      direction: 'ltr!important',\n      flex: 'none!important'\n    },\n    '.os-resize-observer-item-final': {\n      position: 'absolute',\n      left: 0,\n      top: 0,\n      transition: 'none!important',\n      flex: 'none!important'\n    },\n    '.os-resize-observer': {\n      animationDuration: '.001s',\n      animationName: \"\".concat(hsResizeObserverDummyAnimation)\n    },\n    '.os-host-transition>.os-scrollbar, .os-host-transition>.os-scrollbar-corner': {\n      transition: 'opacity .3s,visibility .3s,top .3s,right .3s,bottom .3s,left .3s'\n    },\n    'html.os-html>.os-host>.os-scrollbar': {\n      position: 'absolute',\n      zIndex: 999999\n    },\n    '.os-scrollbar, .os-scrollbar-corner': {\n      position: 'absolute',\n      opacity: 1,\n      zIndex: 1\n    },\n    '.os-scrollbar-corner': {\n      bottom: 0,\n      right: 0,\n      height: 10,\n      width: 10,\n      backgroundColor: 'transparent'\n    },\n    '.os-scrollbar': {\n      pointerEvents: 'none',\n      padding: 2,\n      boxSizing: 'border-box',\n      background: 0\n    },\n    '.os-scrollbar-track': {\n      pointerEvents: 'auto',\n      position: 'relative',\n      height: '100%',\n      width: '100%',\n      padding: '0!important',\n      border: '0!important'\n    },\n    '.os-scrollbar-handle': {\n      pointerEvents: 'auto',\n      position: 'absolute',\n      width: '100%',\n      height: '100%'\n    },\n    '.os-scrollbar-handle-off, .os-scrollbar-track-off': {\n      pointerEvents: 'none'\n    },\n    '.os-scrollbar.os-scrollbar-unusable, .os-scrollbar.os-scrollbar-unusable *': {\n      pointerEvents: 'none!important'\n    },\n    '.os-scrollbar.os-scrollbar-unusable .os-scrollbar-handle': {\n      opacity: '0!important'\n    },\n    '.os-scrollbar-horizontal': {\n      bottom: 0,\n      left: 0,\n      right: 10,\n      height: 10\n    },\n    '.os-scrollbar-vertical': {\n      top: 0,\n      right: 0,\n      bottom: 10,\n      width: 10\n    },\n    '.os-host-rtl>.os-scrollbar-horizontal': {\n      right: 0\n    },\n    '.os-host-rtl>.os-scrollbar-vertical': {\n      right: 'auto',\n      left: 0\n    },\n    '.os-host-rtl>.os-scrollbar-corner': {\n      right: 'auto',\n      left: 0\n    },\n    '.os-scrollbar-auto-hidden, .os-padding+.os-scrollbar-corner, .os-host-resize-disabled.os-host-scrollbar-horizontal-hidden>.os-scrollbar-corner, .os-host-scrollbar-horizontal-hidden>.os-scrollbar-horizontal, .os-host-resize-disabled.os-host-scrollbar-vertical-hidden>.os-scrollbar-corner, .os-host-scrollbar-vertical-hidden>.os-scrollbar-vertical, .os-scrollbar-horizontal.os-scrollbar-auto-hidden+.os-scrollbar-vertical+.os-scrollbar-corner, .os-scrollbar-horizontal+.os-scrollbar-vertical.os-scrollbar-auto-hidden+.os-scrollbar-corner, .os-scrollbar-horizontal.os-scrollbar-auto-hidden+.os-scrollbar-vertical.os-scrollbar-auto-hidden+.os-scrollbar-corner': {\n      opacity: 0,\n      visibility: 'hidden',\n      pointerEvents: 'none'\n    },\n    '.os-scrollbar-corner-resize-both': {\n      cursor: 'nwse-resize'\n    },\n    '.os-host-rtl>.os-scrollbar-corner-resize-both': {\n      cursor: 'nesw-resize'\n    },\n    '.os-scrollbar-corner-resize-horizontal': {\n      cursor: 'ew-resize'\n    },\n    '.os-scrollbar-corner-resize-vertical': {\n      cursor: 'ns-resize'\n    },\n    '.os-dragging .os-scrollbar-corner.os-scrollbar-corner-resize': {\n      cursor: 'default'\n    },\n    '.os-host-resize-disabled.os-host-scrollbar-horizontal-hidden>.os-scrollbar-vertical': {\n      top: 0,\n      bottom: 0\n    },\n    '.os-host-resize-disabled.os-host-scrollbar-vertical-hidden>.os-scrollbar-horizontal, .os-host-rtl.os-host-resize-disabled.os-host-scrollbar-vertical-hidden>.os-scrollbar-horizontal': {\n      right: 0,\n      left: 0\n    },\n    '.os-scrollbar:hover, .os-scrollbar-corner.os-scrollbar-corner-resize': {\n      opacity: '1!important',\n      visibility: 'visible!important'\n    },\n    '.os-scrollbar-corner.os-scrollbar-corner-resize': {\n      backgroundImage: 'linear-gradient(135deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0)  50%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.4) 100%)',\n      backgroundRepeat: 'no-repeat',\n      backgroundPosition: '100% 100%',\n      pointerEvents: 'auto!important'\n    },\n    '.os-host-rtl>.os-scrollbar-corner.os-scrollbar-corner-resize': {\n      transform: 'scale(-1,1)'\n    },\n    '.os-host-overflow': {\n      overflow: 'hidden!important'\n    },\n    '.os-theme-dark.os-host-rtl>.os-scrollbar-horizontal': {\n      left: 10,\n      right: 0\n    },\n    '.os-scrollbar.os-scrollbar-unusable': {\n      background: 0\n    },\n    '.os-scrollbar>.os-scrollbar-track': {\n      background: 0\n    },\n    '.os-scrollbar-horizontal>.os-scrollbar-track>.os-scrollbar-handle': {\n      minWidth: 30\n    },\n    '.os-scrollbar-vertical>.os-scrollbar-track>.os-scrollbar-handle': {\n      minHeight: 30\n    },\n    '.os-theme-dark.os-host-transition>.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle': {\n      transition: 'background-color .3s'\n    },\n    '.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle, .os-scrollbar>.os-scrollbar-track': {\n      borderRadius: 10\n    },\n    '.os-scrollbar>.os-scrollbar-track>.os-scrollbar-handle': {\n      background: theme.color.mediumdark,\n      opacity: 0.5\n    },\n    '.os-scrollbar:hover>.os-scrollbar-track>.os-scrollbar-handle': {\n      opacity: 0.6\n    },\n    '.os-scrollbar-horizontal .os-scrollbar-handle:before, .os-scrollbar-vertical .os-scrollbar-handle:before': {\n      content: \"''\",\n      position: 'absolute',\n      left: 0,\n      right: 0,\n      top: 0,\n      bottom: 0,\n      display: 'block'\n    },\n    '.os-theme-dark.os-host-scrollbar-horizontal-hidden>.os-scrollbar-horizontal .os-scrollbar-handle:before, .os-theme-dark.os-host-scrollbar-vertical-hidden>.os-scrollbar-vertical .os-scrollbar-handle:before': {\n      display: 'none'\n    },\n    '.os-scrollbar-horizontal .os-scrollbar-handle:before': {\n      top: -6,\n      bottom: -2\n    },\n    '.os-scrollbar-vertical .os-scrollbar-handle:before': {\n      left: -6,\n      right: -2\n    },\n    '.os-host-rtl.os-scrollbar-vertical .os-scrollbar-handle:before': {\n      right: -6,\n      left: -2\n    }\n  };\n};\n\nvar GlobalScrollAreaStyles = function GlobalScrollAreaStyles() {\n  return React__default.createElement(Global, {\n    styles: getScrollAreaStyles\n  });\n};\n\nexport { GlobalScrollAreaStyles as default, getScrollAreaStyles };\n"],"names":["_templateObject","_taggedTemplateLiteral","strings","raw","slice","Object","freeze","defineProperties","value","hsResizeObserverDummyAnimation","keyframes","getScrollAreaStyles","__name","theme","display","overflow","boxSizing","height","width","minWidth","minHeight","margin","position","cursor","flexDirection","flexWrap","justifyContent","alignContent","alignItems","flexGrow","flexShrink","flexBasis","opacity","visibility","scrollbarWidth","background","maxHeight","maxWidth","pointerEvents","direction","padding","left","top","bottom","right","zIndex","resize","outline","content","lineHeight","fontSize","borderRadius","float","filter","border","transform","boxShadow","perspective","clip","verticalAlign","whiteSpace","fontFamily","fontWeight","fontStyle","fontVariant","textTransform","textDecoration","textIndent","textAlign","textShadow","textOverflow","letterSpacing","wordSpacing","unicodeBidi","color","borderColor","borderStyle","flex","transition","animationDuration","animationName","concat","backgroundColor","backgroundImage","backgroundRepeat","backgroundPosition","mediumdark","GlobalScrollAreaStyles","_jsx","Global"],"mappings":"0TAGA,IAAIA,EAEJ,SAASC,EAAuBC,EAASC,EAAK,CAAE,OAAKA,IAAOA,EAAMD,EAAQE,MAAM,CAAC,GAAYC,OAAOC,OAAOD,OAAOE,iBAAiBL,EAAS,CAAEC,IAAK,CAAEK,MAAOH,OAAOC,OAAOH,CAAG,CAAE,CAAG,CAAA,CAAC,CAAG,CAA7KF,EAAAA,EAAAA,0BAIT,IAAIQ,EAAiCC,EAAUV,IAAoBA,EAAkBC,EAAuB,CAAC,6BAA6B,CAAC,EAAE,EAEzIU,EAAsBC,EAAA,SAA6BC,EAAO,CAC5D,MAAO,CACL,sCAAuC,CACrCC,QAAS,QACTC,SAAU,SACVC,UAAW,aACXC,OAAQ,iBACRC,MAAO,iBACPC,SAAU,iBACVC,UAAW,iBACXC,OAAQ,cACRC,SAAU,oBACX,EACD,oCAAqC,CACnCA,SAAU,UACX,EACD,uCAAwC,CACtCC,OAAQ,SACT,EACD,8BAA+B,CAC7BD,SAAU,WACVP,SAAU,oBACVS,cAAe,SACfC,SAAU,SACVC,eAAgB,aAChBC,aAAc,aACdC,WAAY,YACb,EACD,mBAAoB,CAClBb,SAAU,mBACVD,QAAS,MACV,EACD,0CAA2C,CACzCG,OAAQ,mBACT,EACD,oCAAqC,CACnCY,SAAU,EACVC,WAAY,CACb,EACD,6EAA8E,CAC5EV,UAAW,EACXD,SAAU,EACVU,SAAU,EACVC,WAAY,EACZC,UAAW,MACZ,EACD,2BAA4B,CAC1BT,SAAU,QACVU,QAAS,EACTC,WAAY,SACZlB,SAAU,SACVE,OAAQ,IACRC,MAAO,GACR,EACD,+BAAgC,CAC9BA,MAAO,OACPD,OAAQ,OACRI,OAAQ,EACT,EACD,yCAA0C,CAAE,EAC5C,yHAA0H,CACxHa,eAAgB,gBACjB,EACD,2UAA4U,CAC1UpB,QAAS,iBACTI,MAAO,cACPD,OAAQ,cACRgB,WAAY,mBACZE,WAAY,eACb,EACD,mBAAoB,CAClBnB,UAAW,UACXoB,UAAW,OACXC,SAAU,OACVnB,MAAO,OACPoB,cAAe,MAChB,EACD,cAAe,CACbtB,UAAW,UACXuB,UAAW,UACXjB,SAAU,WACVP,SAAU,UACVyB,QAAS,EACTnB,OAAQ,EACRoB,KAAM,EACNC,IAAK,EACLC,OAAQ,EACRC,MAAO,EACP1B,MAAO,iBACPD,OAAQ,iBACR4B,OAAQ,CACT,EACD,gCAAiC,CAC/B9B,SAAU,QACX,EACD,eAAgB,CACdwB,UAAW,oBACXvB,UAAW,oBACX8B,OAAQ,iBACRC,QAAS,cACTzB,SAAU,WACVP,SAAU,SACV2B,IAAK,EACLD,KAAM,EACNE,OAAQ,EACRC,MAAO,EACPJ,QAAS,EACTnB,OAAQ,CACT,EACD,sBAAuB,CACrBC,SAAU,WACVuB,OAAQ,GACRzB,UAAW,EACXD,SAAU,EACVmB,cAAe,MAChB,EACD,cAAe,CACbC,UAAW,UACXvB,UAAW,uBACXM,SAAU,WACVR,QAAS,QACTG,OAAQ,OACRC,MAAO,OACPe,WAAY,SACb,EACD,wCAAyC,CACvCe,QAAS,KACTlC,QAAS,QACTI,MAAO,EACPD,OAAQ,EACRgC,WAAY,EACZC,SAAU,CACX,EACD,2BAA4B,CAC1BlC,UAAW,uBACXuB,UAAW,oBACXJ,WAAY,gBACZY,QAAS,0BACThC,SAAU,mBACVO,SAAU,qBACVR,QAAS,kBACT4B,IAAK,cACLD,KAAM,cACNpB,OAAQ,cACR8B,aAAc,cACdC,MAAO,iBACPC,OAAQ,iBACRC,OAAQ,cACRR,OAAQ,iBACRS,UAAW,iBACXlB,SAAU,iBACVD,UAAW,iBACXoB,UAAW,iBACXC,YAAa,iBACbzB,QAAS,cACTa,OAAQ,cACRa,KAAM,iBACNC,cAAe,qBACfnB,QAAS,CACV,EACD,iEAAkE,CAChEI,MAAO,aACR,EACD,iCAAkC,CAChCC,OAAQ,GACRP,cAAe,MAChB,EACD,qCAAsC,CACpCsB,WAAY,gBACZvC,OAAQ,aACT,EACD,mBAAoB,CAClBwC,WAAY,UACZX,SAAU,UACVY,WAAY,UACZC,UAAW,UACXC,YAAa,UACbC,cAAe,UACfC,eAAgB,UAChBC,WAAY,UACZC,UAAW,UACXC,WAAY,UACZC,aAAc,UACdC,cAAe,UACfC,YAAa,UACbvB,WAAY,UACZwB,YAAa,UACblC,UAAW,UACXmC,MAAO,UACPnD,OAAQ,MACT,EACD,gDAAiD,CAC/CP,UAAW,UACXF,QAAS,QACTkB,QAAS,EACTV,SAAU,WACVoB,IAAK,EACLD,KAAM,EACNxB,OAAQ,OACRC,MAAO,OACPH,SAAU,SACVuB,cAAe,OACfO,OAAQ,EACT,EACD,2BAA4B,CAC1BL,QAAS,UACTc,OAAQ,UACRqB,YAAa,cACbC,YAAa,QACb5D,UAAW,YACZ,EACD,iCAAkC,CAChCgC,QAAS,IACV,EACD,+EAAgF,CAC9E/B,OAAQ,OACRC,MAAO,OACPsB,QAAS,UACTc,OAAQ,UACRjC,OAAQ,EACRP,QAAS,QACTE,UAAW,aACZ,EACD,0DAA2D,CACzDA,UAAW,sBACZ,EACD,yBAA0B,CACxBA,UAAW,oBACXC,OAAQ,OACRC,MAAO,UACPmB,SAAU,EACVf,SAAU,WACV8B,MAAO,OACPhB,UAAW,EACXrB,SAAU,SACV8B,OAAQ,GACRL,QAAS,EACTnB,OAAQ,EACRiB,cAAe,OACfT,SAAU,UACVC,WAAY,EACZC,UAAW,CACZ,EACD,6CAA8C,CAC5Cb,MAAO,QACPD,OAAQ,QACRG,UAAW,EACXD,SAAU,CACX,EACD,2BAA4B,CAC1BG,SAAU,WACVoB,IAAK,EACLE,MAAO,EACPD,OAAQ,EACRF,KAAM,EACN1B,SAAU,SACV8B,OAAQ,GACRb,QAAS,EACTO,UAAW,gBACXsC,KAAM,gBACP,EACD,iCAAkC,CAChCvD,SAAU,WACVmB,KAAM,EACNC,IAAK,EACLoC,WAAY,iBACZD,KAAM,gBACP,EACD,sBAAuB,CACrBE,kBAAmB,QACnBC,cAAe,GAAGC,OAAOxE,CAA8B,CACxD,EACD,8EAA+E,CAC7EqE,WAAY,kEACb,EACD,sCAAuC,CACrCxD,SAAU,WACVuB,OAAQ,MACT,EACD,sCAAuC,CACrCvB,SAAU,WACVU,QAAS,EACTa,OAAQ,CACT,EACD,uBAAwB,CACtBF,OAAQ,EACRC,MAAO,EACP3B,OAAQ,GACRC,MAAO,GACPgE,gBAAiB,aAClB,EACD,gBAAiB,CACf5C,cAAe,OACfE,QAAS,EACTxB,UAAW,aACXmB,WAAY,CACb,EACD,sBAAuB,CACrBG,cAAe,OACfhB,SAAU,WACVL,OAAQ,OACRC,MAAO,OACPsB,QAAS,cACTc,OAAQ,aACT,EACD,uBAAwB,CACtBhB,cAAe,OACfhB,SAAU,WACVJ,MAAO,OACPD,OAAQ,MACT,EACD,oDAAqD,CACnDqB,cAAe,MAChB,EACD,6EAA8E,CAC5EA,cAAe,gBAChB,EACD,2DAA4D,CAC1DN,QAAS,aACV,EACD,2BAA4B,CAC1BW,OAAQ,EACRF,KAAM,EACNG,MAAO,GACP3B,OAAQ,EACT,EACD,yBAA0B,CACxByB,IAAK,EACLE,MAAO,EACPD,OAAQ,GACRzB,MAAO,EACR,EACD,wCAAyC,CACvC0B,MAAO,CACR,EACD,sCAAuC,CACrCA,MAAO,OACPH,KAAM,CACP,EACD,oCAAqC,CACnCG,MAAO,OACPH,KAAM,CACP,EACD,kpBAAmpB,CACjpBT,QAAS,EACTC,WAAY,SACZK,cAAe,MAChB,EACD,mCAAoC,CAClCf,OAAQ,aACT,EACD,gDAAiD,CAC/CA,OAAQ,aACT,EACD,yCAA0C,CACxCA,OAAQ,WACT,EACD,uCAAwC,CACtCA,OAAQ,WACT,EACD,+DAAgE,CAC9DA,OAAQ,SACT,EACD,sFAAuF,CACrFmB,IAAK,EACLC,OAAQ,CACT,EACD,uLAAwL,CACtLC,MAAO,EACPH,KAAM,CACP,EACD,uEAAwE,CACtET,QAAS,cACTC,WAAY,mBACb,EACD,kDAAmD,CACjDkD,gBAAiB,2GACjBC,iBAAkB,YAClBC,mBAAoB,YACpB/C,cAAe,gBAChB,EACD,+DAAgE,CAC9DiB,UAAW,aACZ,EACD,oBAAqB,CACnBxC,SAAU,kBACX,EACD,sDAAuD,CACrD0B,KAAM,GACNG,MAAO,CACR,EACD,sCAAuC,CACrCT,WAAY,CACb,EACD,oCAAqC,CACnCA,WAAY,CACb,EACD,oEAAqE,CACnEhB,SAAU,EACX,EACD,kEAAmE,CACjEC,UAAW,EACZ,EACD,2FAA4F,CAC1F0D,WAAY,sBACb,EACD,4FAA6F,CAC3F3B,aAAc,EACf,EACD,yDAA0D,CACxDhB,WAAYtB,EAAM6D,MAAMY,WACxBtD,QAAS,EACV,EACD,+DAAgE,CAC9DA,QAAS,EACV,EACD,2GAA4G,CAC1GgB,QAAS,KACT1B,SAAU,WACVmB,KAAM,EACNG,MAAO,EACPF,IAAK,EACLC,OAAQ,EACR7B,QAAS,OACV,EACD,+MAAgN,CAC9MA,QAAS,MACV,EACD,uDAAwD,CACtD4B,IAAK,GACLC,OAAQ,EACT,EACD,qDAAsD,CACpDF,KAAM,GACNG,MAAO,EACR,EACD,iEAAkE,CAChEA,MAAO,GACPH,KAAM,EACR,EAEJ,EAzb0B,uBA2btB8C,EAAyB3E,EAAA,UAAkC,CAC7D,OAAA4E,EAAAC,EAAA,CAAA,OACU9E,CAAmB,CAAA,CAE/B,EAJ6B"}

package/storybook-static/assets/Header.4fc7684b.css

@@ -0,0 +1 @@
+.wrapper{font-family:Nunito Sans,Helvetica Neue,Helvetica,Arial,sans-serif;border-bottom:1px solid rgba(0,0,0,.1);padding:15px 20px;display:flex;align-items:center;justify-content:space-between}svg{display:inline-block;vertical-align:top}h1{font-weight:900;font-size:20px;line-height:1;margin:6px 0 6px 10px;display:inline-block;vertical-align:top}button+button{margin-left:10px}.welcome{color:#333;font-size:14px;margin-right:10px}

package/storybook-static/assets/Header.cf6306b0.js

@@ -0,0 +1,2 @@
+var c=Object.defineProperty;var a=(r,n)=>c(r,"name",{value:n,configurable:!0});import{j as e,b as l,F as t}from"./jsx-runtime.e2ea81d7.js";import{p as i}from"./index.7df59845.js";import{B as o}from"./Button.7e305135.js";const s=a(({user:r,onLogin:n,onLogout:d,onCreateAccount:p})=>e("header",{children:l("div",{className:"wrapper",children:[l("div",{children:[e("svg",{width:"32",height:"32",viewBox:"0 0 32 32",xmlns:"http://www.w3.org/2000/svg",children:l("g",{fill:"none",fillRule:"evenodd",children:[e("path",{d:"M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z",fill:"#FFF"}),e("path",{d:"M5.3 10.6l10.4 6v11.1l-10.4-6v-11zm11.4-6.2l9.7 5.5-9.7 5.6V4.4z",fill:"#555AB9"}),e("path",{d:"M27.2 10.6v11.2l-10.5 6V16.5l10.5-6zM15.7 4.4v11L6 10l9.7-5.5z",fill:"#91BAF8"})]})}),e("h1",{children:"Acme"})]}),e("div",{children:r?l(t,{children:[l("span",{className:"welcome",children:["Welcome, ",e("b",{children:r.name}),"!"]}),e(o,{size:"small",onClick:d,label:"Log out"})]}):l(t,{children:[e(o,{size:"small",onClick:n,label:"Log in"}),e(o,{primary:!0,size:"small",onClick:p,label:"Sign up"})]})})]})}),"Header");s.propTypes={user:i.exports.shape({}),onLogin:i.exports.func.isRequired,onLogout:i.exports.func.isRequired,onCreateAccount:i.exports.func.isRequired};s.defaultProps={user:null};s.__docgenInfo={description:"",methods:[],displayName:"Header",props:{user:{defaultValue:{value:"null",computed:!1},type:{name:"shape",value:{}},required:!1,description:""},onLogin:{type:{name:"func"},required:!0,description:""},onLogout:{type:{name:"func"},required:!0,description:""},onCreateAccount:{type:{name:"func"},required:!0,description:""}}};export{s as H};
+//# sourceMappingURL=Header.cf6306b0.js.map

package/storybook-static/assets/Header.cf6306b0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.cf6306b0.js","sources":["../../src/stories/Header.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Button } from './Button';\nimport './header.css';\n\nexport const Header = ({ user, onLogin, onLogout, onCreateAccount }) => (\n  <header>\n    <div className=\"wrapper\">\n      <div>\n        <svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" xmlns=\"http://www.w3.org/2000/svg\">\n          <g fill=\"none\" fillRule=\"evenodd\">\n            <path\n              d=\"M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z\"\n              fill=\"#FFF\"\n            />\n            <path\n              d=\"M5.3 10.6l10.4 6v11.1l-10.4-6v-11zm11.4-6.2l9.7 5.5-9.7 5.6V4.4z\"\n              fill=\"#555AB9\"\n            />\n            <path\n              d=\"M27.2 10.6v11.2l-10.5 6V16.5l10.5-6zM15.7 4.4v11L6 10l9.7-5.5z\"\n              fill=\"#91BAF8\"\n            />\n          </g>\n        </svg>\n        <h1>Acme</h1>\n      </div>\n      <div>\n        {user ? (\n          <>\n            <span className=\"welcome\">\n              Welcome, <b>{user.name}</b>!\n            </span>\n            <Button size=\"small\" onClick={onLogout} label=\"Log out\" />\n          </>\n        ) : (\n          <>\n            <Button size=\"small\" onClick={onLogin} label=\"Log in\" />\n            <Button primary size=\"small\" onClick={onCreateAccount} label=\"Sign up\" />\n          </>\n        )}\n      </div>\n    </div>\n  </header>\n);\n\nHeader.propTypes = {\n  user: PropTypes.shape({}),\n  onLogin: PropTypes.func.isRequired,\n  onLogout: PropTypes.func.isRequired,\n  onCreateAccount: PropTypes.func.isRequired,\n};\n\nHeader.defaultProps = {\n  user: null,\n};\n"],"names":["Header","__name","user","onLogin","onLogout","onCreateAccount","_jsxs","_jsx","_Fragment","name","Button","propTypes","PropTypes","shape","func","isRequired","defaultProps"],"mappings":"4NAMO,MAAMA,EAASC,EAAA,CAAC,CAAEC,KAAAA,EAAMC,QAAAA,EAASC,SAAAA,EAAUC,gBAAAA,CAAgB,MAChE,SAAA,CAAA,WACE,MAAA,CAAK,UAAU,UAAS,SACtB,CAAAC,EAAA,MAAA,CAAA,SACE,CAAAC,EAAA,MAAA,CAAK,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,MAAM,6BAA4B,WAChF,IAAA,CAAG,KAAK,OAAO,SAAS,UAAS,SAC/B,CAAAA,EAAA,OAAA,CACE,EAAE,oFACF,KAAK,MAAA,CAAM,EAEbA,EAAA,OAAA,CACE,EAAE,mEACF,KAAK,SAAA,CAAS,EAEhBA,EAAA,OAAA,CACE,EAAE,iEACF,KAAK,SAAA,CACL,CAAA,CAAA,CAAA,CAAA,CACA,EAENA,EAAA,KAAA,CAAA,SAAA,MAAA,CAAa,CAAA,CAAA,CAAA,EAEfA,EAAA,MAAA,CAAA,SACGL,EACCI,EAAAE,EAAA,CAAA,SACE,CAAAF,EAAA,OAAA,CAAM,UAAU,UAAS,SACd,CAAA,YAAAC,EAAA,IAAA,CAAA,SAAIL,EAAKO,IAAS,CAAA,EAAA,GAAA,CAAA,CACtB,EACPF,EAACG,EAAM,CAAC,KAAK,QAAQ,QAASN,EAAU,MAAM,SAAA,CAAY,CAAA,CAAA,CAAA,EAG5DE,EAAAE,EAAA,CAAA,SAAA,CACED,EAACG,EAAM,CAAC,KAAK,QAAQ,QAASP,EAAS,MAAM,QAAA,CAAW,EACxDI,EAACG,EAAM,CAAC,QAAO,GAAC,KAAK,QAAQ,QAASL,EAAiB,MAAM,SAAA,CAAY,CAAA,CAAA,CAAA,CAAA,CAGzE,CAAA,CAAA,CAAA,CACF,CAET,EAvCqB,UAyCtBL,EAAOW,UAAY,CACjBT,KAAMU,EAAAA,QAAUC,MAAM,EAAE,EACxBV,QAASS,EAAAA,QAAUE,KAAKC,WACxBX,SAAUQ,EAAAA,QAAUE,KAAKC,WACzBV,gBAAiBO,EAAAA,QAAUE,KAAKC,UAClC,EAEAf,EAAOgB,aAAe,CACpBd,KAAM,IACR"}

package/storybook-static/assets/Header.stories.17ffb615.js

@@ -0,0 +1,26 @@
+var a=Object.defineProperty;var o=(e,r)=>a(e,"name",{value:r,configurable:!0});import{j as s}from"./jsx-runtime.e2ea81d7.js";import{H as n}from"./Header.cf6306b0.js";import"./iframe.aab06436.js";import"./index.7df59845.js";import"./Button.7e305135.js";const y={title:"Example/Header",component:n,parameters:{storySource:{source:`import React from 'react';
+
+import { Header } from './Header';
+
+export default {
+  title: 'Example/Header',
+  component: Header,
+  parameters: {
+    // More on Story layout: https://storybook.js.org/docs/react/configure/story-layout
+    layout: 'fullscreen',
+  },
+};
+
+const Template = (args) => <Header {...args} />;
+
+export const LoggedIn = Template.bind({});
+LoggedIn.args = {
+  user: {
+    name: 'Jane Doe',
+  },
+};
+
+export const LoggedOut = Template.bind({});
+LoggedOut.args = {};
+`,locationsMap:{"logged-in":{startLoc:{col:17,line:14},endLoc:{col:47,line:14},startBody:{col:17,line:14},endBody:{col:47,line:14}},"logged-out":{startLoc:{col:17,line:14},endLoc:{col:47,line:14},startBody:{col:17,line:14},endBody:{col:47,line:14}}}},layout:"fullscreen"}},t=o(e=>s(n,{...e}),"Template"),l=t.bind({});l.args={user:{name:"Jane Doe"}};const d=t.bind({});d.args={};const L=["LoggedIn","LoggedOut"];export{l as LoggedIn,d as LoggedOut,L as __namedExportsOrder,y as default};
+//# sourceMappingURL=Header.stories.17ffb615.js.map

package/storybook-static/assets/Header.stories.17ffb615.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.stories.17ffb615.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/storybook-static/assets/Introduction.stories.bc0afbca.js

@@ -0,0 +1,105 @@
+var p=Object.defineProperty;var a=(o,e)=>p(o,"name",{value:e,configurable:!0});import"./jsx-runtime.e2ea81d7.js";import{c as t,A as m,M as c}from"./Props.8d39388f.js";import"./iframe.aab06436.js";import"./string.6cc73134.js";import"./es.map.constructor.bc2f31bd.js";import"./es.number.to-fixed.db152345.js";const d="/assets/code-brackets.9ef6443e.svg",g="/assets/colors.ac9401f3.svg",u="/assets/comments.f15a6837.svg",h="/assets/direction.94a9917f.svg",f="/assets/flow.275142c6.svg",b="/assets/plugin.57148314.svg",k="/assets/repo.fb4ece47.svg",x="/assets/stackalt.2ad81543.svg";function i(){return i=Object.assign?Object.assign.bind():function(o){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(o[r]=n[r])}return o},i.apply(this,arguments)}a(i,"_extends");const y={},w="wrapper";function l({components:o,...e}){return t(w,i({},y,e,{components:o,mdxType:"MDXLayout"}),t(c,{title:"Example/Introduction",mdxType:"Meta"}),t("style",null,`
+    .subheading {
+      --mediumdark: '#999999';
+      font-weight: 900;
+      font-size: 13px;
+      color: #999;
+      letter-spacing: 6px;
+      line-height: 24px;
+      text-transform: uppercase;
+      margin-bottom: 12px;
+      margin-top: 40px;
+    }
+
+    .link-list {
+      display: grid;
+      grid-template-columns: 1fr;
+      grid-template-rows: 1fr 1fr;
+      row-gap: 10px;
+    }
+
+    @media (min-width: 620px) {
+      .link-list {
+        row-gap: 20px;
+        column-gap: 20px;
+        grid-template-columns: 1fr 1fr;
+      }
+    }
+
+    @media all and (-ms-high-contrast:none) {
+    .link-list {
+        display: -ms-grid;
+        -ms-grid-columns: 1fr 1fr;
+        -ms-grid-rows: 1fr 1fr;
+      }
+    }
+
+    .link-item {
+      display: block;
+      padding: 20px 30px 20px 15px;
+      border: 1px solid #00000010;
+      border-radius: 5px;
+      transition: background 150ms ease-out, border 150ms ease-out, transform 150ms ease-out;
+      color: #333333;
+      display: flex;
+      align-items: flex-start;
+    }
+
+    .link-item:hover {
+      border-color: #1EA7FD50;
+      transform: translate3d(0, -3px, 0);
+      box-shadow: rgba(0, 0, 0, 0.08) 0 3px 10px 0;
+    }
+
+    .link-item:active {
+      border-color: #1EA7FD;
+      transform: translate3d(0, 0, 0);
+    }
+
+    .link-item strong {
+      font-weight: 700;
+      display: block;
+      margin-bottom: 2px;
+    }
+
+    .link-item img {
+      height: 40px;
+      width: 40px;
+      margin-right: 15px;
+      flex: none;
+    }
+
+    .link-item span {
+      font-size: 14px;
+      line-height: 20px;
+    }
+
+    .tip {
+      display: inline-block;
+      border-radius: 1em;
+      font-size: 11px;
+      line-height: 12px;
+      font-weight: 700;
+      background: #E7FDD8;
+      color: #66BF3C;
+      padding: 4px 12px;
+      margin-right: 10px;
+      vertical-align: top;
+    }
+
+    .tip-wrapper {
+      font-size: 13px;
+      line-height: 20px;
+      margin-top: 40px;
+      margin-bottom: 40px;
+    }
+
+    .tip-wrapper code {
+      font-size: 12px;
+      display: inline-block;
+    }
+  `),t("h1",null,"Welcome to Storybook"),t("p",null,`Storybook helps you build UI components in isolation from your app's business logic, data, and context.
+That makes it easy to develop hard-to-reach states. Save these UI states as `,t("strong",{parentName:"p"},"stories")," to revisit during development, testing, or QA."),t("p",null,`Browse example stories now by navigating to them in the sidebar.
+View their code in the `,t("inlineCode",{parentName:"p"},"stories"),` directory to learn how they work.
+We recommend building UIs with a `,t("a",{parentName:"p",href:"https://componentdriven.org"},t("strong",{parentName:"a"},"component-driven"))," process starting with atomic components and ending with pages."),t("div",{className:"subheading"},"Configure"),t("div",{className:"link-list"},t("a",{className:"link-item",href:"https://storybook.js.org/docs/react/addons/addon-types",target:"_blank"},t("img",{src:b,alt:"plugin"}),t("span",null,t("strong",null,"Presets for popular tools"),"Easy setup for TypeScript, SCSS and more.")),t("a",{className:"link-item",href:"https://storybook.js.org/docs/react/configure/webpack",target:"_blank"},t("img",{src:x,alt:"Build"}),t("span",null,t("strong",null,"Build configuration"),"How to customize webpack and Babel")),t("a",{className:"link-item",href:"https://storybook.js.org/docs/react/configure/styling-and-css",target:"_blank"},t("img",{src:g,alt:"colors"}),t("span",null,t("strong",null,"Styling"),"How to load and configure CSS libraries")),t("a",{className:"link-item",href:"https://storybook.js.org/docs/react/get-started/setup#configure-storybook-for-your-stack",target:"_blank"},t("img",{src:f,alt:"flow"}),t("span",null,t("strong",null,"Data"),"Providers and mocking for data libraries"))),t("div",{className:"subheading"},"Learn"),t("div",{className:"link-list"},t("a",{className:"link-item",href:"https://storybook.js.org/docs",target:"_blank"},t("img",{src:k,alt:"repo"}),t("span",null,t("strong",null,"Storybook documentation"),"Configure, customize, and extend")),t("a",{className:"link-item",href:"https://storybook.js.org/tutorials/",target:"_blank"},t("img",{src:h,alt:"direction"}),t("span",null,t("strong",null,"In-depth guides"),"Best practices from leading teams")),t("a",{className:"link-item",href:"https://github.com/storybookjs/storybook",target:"_blank"},t("img",{src:d,alt:"code"}),t("span",null,t("strong",null,"GitHub project"),"View the source and add issues")),t("a",{className:"link-item",href:"https://discord.gg/storybook",target:"_blank"},t("img",{src:u,alt:"comments"}),t("span",null,t("strong",null,"Discord chat"),"Chat with maintainers and the community"))),t("div",{className:"tip-wrapper"},t("span",{className:"tip"},"Tip"),"Edit the Markdown in"," ",t("code",null,"stories/Introduction.stories.mdx")))}a(l,"MDXContent");l.isMDXComponent=!0;const v=a(()=>{throw new Error("Docs-only story")},"__page");v.parameters={docsOnly:!0};const s={title:"Example/Introduction",includeStories:["__page"]},N={};s.parameters=s.parameters||{};s.parameters.docs={...s.parameters.docs||{},page:()=>t(m,{mdxStoryNameToKey:N,mdxComponentAnnotations:s},t(l,null))};const z=["__page"];export{z as __namedExportsOrder,v as __page,s as default};
+//# sourceMappingURL=Introduction.stories.bc0afbca.js.map

package/storybook-static/assets/Introduction.stories.bc0afbca.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Introduction.stories.bc0afbca.js","sources":["../../src/stories/assets/code-brackets.svg","../../src/stories/assets/colors.svg","../../src/stories/assets/comments.svg","../../src/stories/assets/direction.svg","../../src/stories/assets/flow.svg","../../src/stories/assets/plugin.svg","../../src/stories/assets/repo.svg","../../src/stories/assets/stackalt.svg","../../src/stories/Introduction.stories.mdx"],"sourcesContent":["export default \"__VITE_ASSET__9ef6443e__\"","export default \"__VITE_ASSET__ac9401f3__\"","export default \"__VITE_ASSET__f15a6837__\"","export default \"__VITE_ASSET__94a9917f__\"","export default \"__VITE_ASSET__275142c6__\"","export default \"__VITE_ASSET__57148314__\"","export default \"__VITE_ASSET__fb4ece47__\"","export default \"__VITE_ASSET__2ad81543__\"","import { Meta } from '@storybook/addon-docs';\nimport Code from './assets/code-brackets.svg';\nimport Colors from './assets/colors.svg';\nimport Comments from './assets/comments.svg';\nimport Direction from './assets/direction.svg';\nimport Flow from './assets/flow.svg';\nimport Plugin from './assets/plugin.svg';\nimport Repo from './assets/repo.svg';\nimport StackAlt from './assets/stackalt.svg';\n\n<Meta title=\"Example/Introduction\" />\n\n<style>\n  {`\n    .subheading {\n      --mediumdark: '#999999';\n      font-weight: 900;\n      font-size: 13px;\n      color: #999;\n      letter-spacing: 6px;\n      line-height: 24px;\n      text-transform: uppercase;\n      margin-bottom: 12px;\n      margin-top: 40px;\n    }\n\n    .link-list {\n      display: grid;\n      grid-template-columns: 1fr;\n      grid-template-rows: 1fr 1fr;\n      row-gap: 10px;\n    }\n\n    @media (min-width: 620px) {\n      .link-list {\n        row-gap: 20px;\n        column-gap: 20px;\n        grid-template-columns: 1fr 1fr;\n      }\n    }\n\n    @media all and (-ms-high-contrast:none) {\n    .link-list {\n        display: -ms-grid;\n        -ms-grid-columns: 1fr 1fr;\n        -ms-grid-rows: 1fr 1fr;\n      }\n    }\n\n    .link-item {\n      display: block;\n      padding: 20px 30px 20px 15px;\n      border: 1px solid #00000010;\n      border-radius: 5px;\n      transition: background 150ms ease-out, border 150ms ease-out, transform 150ms ease-out;\n      color: #333333;\n      display: flex;\n      align-items: flex-start;\n    }\n\n    .link-item:hover {\n      border-color: #1EA7FD50;\n      transform: translate3d(0, -3px, 0);\n      box-shadow: rgba(0, 0, 0, 0.08) 0 3px 10px 0;\n    }\n\n    .link-item:active {\n      border-color: #1EA7FD;\n      transform: translate3d(0, 0, 0);\n    }\n\n    .link-item strong {\n      font-weight: 700;\n      display: block;\n      margin-bottom: 2px;\n    }\n\n    .link-item img {\n      height: 40px;\n      width: 40px;\n      margin-right: 15px;\n      flex: none;\n    }\n\n    .link-item span {\n      font-size: 14px;\n      line-height: 20px;\n    }\n\n    .tip {\n      display: inline-block;\n      border-radius: 1em;\n      font-size: 11px;\n      line-height: 12px;\n      font-weight: 700;\n      background: #E7FDD8;\n      color: #66BF3C;\n      padding: 4px 12px;\n      margin-right: 10px;\n      vertical-align: top;\n    }\n\n    .tip-wrapper {\n      font-size: 13px;\n      line-height: 20px;\n      margin-top: 40px;\n      margin-bottom: 40px;\n    }\n\n    .tip-wrapper code {\n      font-size: 12px;\n      display: inline-block;\n    }\n  `}\n</style>\n\n# Welcome to Storybook\n\nStorybook helps you build UI components in isolation from your app's business logic, data, and context.\nThat makes it easy to develop hard-to-reach states. Save these UI states as **stories** to revisit during development, testing, or QA.\n\nBrowse example stories now by navigating to them in the sidebar.\nView their code in the `stories` directory to learn how they work.\nWe recommend building UIs with a [**component-driven**](https://componentdriven.org) process starting with atomic components and ending with pages.\n\n<div className=\"subheading\">Configure</div>\n\n<div className=\"link-list\">\n  <a\n    className=\"link-item\"\n    href=\"https://storybook.js.org/docs/react/addons/addon-types\"\n    target=\"_blank\"\n  >\n    <img src={Plugin} alt=\"plugin\" />\n    <span>\n      <strong>Presets for popular tools</strong>\n      Easy setup for TypeScript, SCSS and more.\n    </span>\n  </a>\n  <a\n    className=\"link-item\"\n    href=\"https://storybook.js.org/docs/react/configure/webpack\"\n    target=\"_blank\"\n  >\n    <img src={StackAlt} alt=\"Build\" />\n    <span>\n      <strong>Build configuration</strong>\n      How to customize webpack and Babel\n    </span>\n  </a>\n  <a\n    className=\"link-item\"\n    href=\"https://storybook.js.org/docs/react/configure/styling-and-css\"\n    target=\"_blank\"\n  >\n    <img src={Colors} alt=\"colors\" />\n    <span>\n      <strong>Styling</strong>\n      How to load and configure CSS libraries\n    </span>\n  </a>\n  <a\n    className=\"link-item\"\n    href=\"https://storybook.js.org/docs/react/get-started/setup#configure-storybook-for-your-stack\"\n    target=\"_blank\"\n  >\n    <img src={Flow} alt=\"flow\" />\n    <span>\n      <strong>Data</strong>\n      Providers and mocking for data libraries\n    </span>\n  </a>\n</div>\n\n<div className=\"subheading\">Learn</div>\n\n<div className=\"link-list\">\n  <a className=\"link-item\" href=\"https://storybook.js.org/docs\" target=\"_blank\">\n    <img src={Repo} alt=\"repo\" />\n    <span>\n      <strong>Storybook documentation</strong>\n      Configure, customize, and extend\n    </span>\n  </a>\n  <a className=\"link-item\" href=\"https://storybook.js.org/tutorials/\" target=\"_blank\">\n    <img src={Direction} alt=\"direction\" />\n    <span>\n      <strong>In-depth guides</strong>\n      Best practices from leading teams\n    </span>\n  </a>\n  <a className=\"link-item\" href=\"https://github.com/storybookjs/storybook\" target=\"_blank\">\n    <img src={Code} alt=\"code\" />\n    <span>\n      <strong>GitHub project</strong>\n      View the source and add issues\n    </span>\n  </a>\n  <a className=\"link-item\" href=\"https://discord.gg/storybook\" target=\"_blank\">\n    <img src={Comments} alt=\"comments\" />\n    <span>\n      <strong>Discord chat</strong>\n      Chat with maintainers and the community\n    </span>\n  </a>\n</div>\n\n<div className=\"tip-wrapper\">\n  <span className=\"tip\">Tip</span>Edit the Markdown in{' '}\n  <code>stories/Introduction.stories.mdx</code>\n</div>\n"],"names":["Code","Colors","Comments","Direction","Flow","Plugin","Repo","StackAlt","layoutProps","MDXLayout","MDXContent","components","props","mdx","Meta","isMDXComponent","__page","__name","Error","parameters","docsOnly","componentMeta","title","includeStories","mdxStoryNameToKey","docs","page","AddContext","__namedExportsOrder"],"mappings":"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"}