{
  "version": 3,
  "sources": ["../../../../src/testing/decorators/withLayout.tsx", "../../../../src/testing/decorators/withLayoutVariants.tsx", "../../../../src/testing/decorators/withTheme.tsx", "../../../../src/testing/Loading.tsx"],
  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React, { type FC, type PropsWithChildren, memo } from 'react';\n\nimport { type ClassNameValue, type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/ui-theme';\n\nexport type ContainerProps = ThemedClassName<PropsWithChildren>;\n\nexport type ContainerType = 'default' | 'fullscreen' | 'centered' | 'column';\n\nexport type WithLayoutProps =\n  | FC<ContainerProps>\n  | {\n      classNames?: ClassNameValue;\n      layout?: ContainerType;\n      scroll?: boolean;\n    };\n\n/**\n * Adds layout container.\n */\nexport const withLayout =\n  (props: WithLayoutProps = {}): Decorator =>\n  (Story) => {\n    // Prevent re-rendering of the story.\n    const MemoizedStory = memo(Story);\n    if (typeof props === 'function') {\n      const Container = props;\n      return (\n        <Container>\n          <MemoizedStory />\n        </Container>\n      );\n    } else {\n      const { layout = 'default', classNames, scroll } = props;\n      const Container = layouts[layout] ?? layouts.fullscreen;\n      return (\n        <Container classNames={mx(scroll ? 'overflow-y-auto' : 'overflow-hidden', classNames)}>\n          <MemoizedStory />\n        </Container>\n      );\n    }\n  };\n\nconst layouts: Record<ContainerType, FC<ContainerProps>> = {\n  default: ({ classNames, children }: ContainerProps) => <div className={mx('p-4', classNames)}>{children}</div>,\n\n  fullscreen: ({ classNames, children }: ContainerProps) => (\n    <div className={mx('fixed inset-0 flex overflow-hidden bg-black', classNames)}>{children}</div>\n  ),\n\n  centered: ({ classNames, children }: ContainerProps) => (\n    <div className={mx('fixed inset-0 grid overflow-hidden place-items-center bg-trim-surface')}>\n      <div className={mx('flex flex-col bg-base-surface', classNames)}>{children}</div>\n    </div>\n  ),\n\n  column: ({ classNames, children }: ContainerProps) => (\n    <div className='fixed inset-0 flex overflow-hidden justify-center bg-trim-surface'>\n      <div className={mx('flex flex-col w-[40rem] bg-base-surface', classNames)}>{children}</div>\n    </div>\n  ),\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React, { type ComponentType, type PropsWithChildren } from 'react';\n\nimport { mx, surfaceShadow } from '@dxos/ui-theme';\nimport { type Density, type Elevation } from '@dxos/ui-types';\n\ntype Config = {\n  elevations?: { elevation: Elevation; surface?: string }[];\n  densities?: Density[];\n};\n\nconst Container = ({ children, elevation, surface }: PropsWithChildren<{ elevation: Elevation; surface?: string }>) => (\n  <div className={mx('p-4 rounded-sm', surface, surfaceShadow({ elevation }))}>{children}</div>\n);\n\nconst Panel = ({\n  Story,\n  elevations,\n  densities,\n  className,\n}: { Story: ComponentType } & Config & { className?: string }) => {\n  return (\n    <div className={mx('flex flex-col h-full p-8 gap-8', className)}>\n      {elevations?.map(({ elevation, surface }) =>\n        densities?.map((density) => (\n          <Container key={`${elevation}--${density}`} surface={surface} elevation={elevation}>\n            <Story />\n          </Container>\n        )),\n      )}\n    </div>\n  );\n};\n\nexport const withLayoutVariants = ({\n  elevations = [\n    { elevation: 'dialog', surface: 'bg-modal-surface' },\n    { elevation: 'positioned', surface: 'bg-card-surface' },\n    { elevation: 'base', surface: 'bg-base-surface' },\n  ],\n  densities = ['md'],\n}: Config = {}): Decorator => {\n  return (Story) => <Panel Story={Story} elevations={elevations} densities={densities} />;\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React from 'react';\nimport { I18nProvider } from 'react-aria-components';\n\nimport { type ThemeMode } from '@dxos/ui-types';\n\nimport { Tooltip } from '../../components';\nimport { type ThemeContextValue, ThemeProvider } from '../../primitives';\nimport { defaultTx } from '../../theme';\n\n/**\n * Adds theme decorator.\n *\n * `I18nProvider` is included so react-aria-components-backed widgets (DateField, Calendar, …)\n * have a guaranteed locale in headless test environments where `navigator.language` may be\n * empty.\n */\nexport const withTheme =\n  ({ tx = defaultTx, noCache, platform }: Partial<ThemeContextValue> = {}): Decorator =>\n  (Story, context) => {\n    const {\n      globals: { theme },\n      parameters: { translations },\n    } = context;\n\n    return (\n      <I18nProvider locale='en-US'>\n        <ThemeProvider\n          tx={tx}\n          themeMode={(theme as ThemeMode) || 'dark'}\n          resourceExtensions={translations}\n          noCache={noCache}\n          platform={platform}\n        >\n          <Tooltip.Provider>\n            <Story />\n          </Tooltip.Provider>\n        </ThemeProvider>\n      </I18nProvider>\n    );\n  };\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { captureOwnerStack, useEffect, useState } from 'react';\n\nimport { mx } from '@dxos/ui-theme';\nimport { safeStringify } from '@dxos/util';\n\nimport { ErrorStack, parseCaptureOwnerStack } from '../components';\n\nexport type LoadingProps = { data?: any };\n\n/**\n * Storybook loading component.\n */\nexport const Loading = ({ data }: LoadingProps) => {\n  const [visible, setVisible] = useState(false);\n  const ownerFrames = parseCaptureOwnerStack(captureOwnerStack());\n\n  useEffect(() => {\n    const t = setTimeout(() => setVisible(true), 500);\n    return () => clearTimeout(t);\n  }, []);\n\n  return (\n    <div className='grid p-2'>\n      <div\n        className={mx(\n          'flex flex-col w-full p-2 border-2 border-teal-500 rounded-md',\n          'opacity-0 transition delay-1000 duration-1000',\n          'overflow-auto',\n          visible && 'opacity-100',\n        )}\n      >\n        <h2 className='uppercase capitalize text-xs'>Loading State</h2>\n        <pre className='text-sm text-description'>{safeStringify(data, undefined, 2)}</pre>\n\n        <h3 className='uppercase capitalize text-xs mt-2'>Owner stack</h3>\n        {ownerFrames && ownerFrames.length > 0 ? (\n          <ErrorStack frames={ownerFrames} />\n        ) : (\n          <p className='text-xs text-subdued'>No owner stack (production build or unsupported context).</p>\n        )}\n      </div>\n    </div>\n  );\n};\n"],
  "mappings": "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",
  "names": ["React", "memo", "mx", "withLayout", "props", "Story", "MemoizedStory", "Container", "layout", "classNames", "scroll", "layouts", "fullscreen", "default", "children", "div", "className", "centered", "column", "React", "mx", "surfaceShadow", "Container", "children", "elevation", "surface", "div", "className", "Panel", "Story", "elevations", "densities", "map", "density", "key", "withLayoutVariants", "React", "I18nProvider", "withTheme", "tx", "defaultTx", "noCache", "platform", "Story", "context", "globals", "theme", "parameters", "translations", "React", "I18nProvider", "locale", "ThemeProvider", "themeMode", "resourceExtensions", "Tooltip", "Provider", "React", "captureOwnerStack", "useEffect", "useState", "mx", "safeStringify", "Loading", "data", "visible", "setVisible", "useState", "ownerFrames", "parseCaptureOwnerStack", "captureOwnerStack", "useEffect", "t", "setTimeout", "clearTimeout", "React", "div", "className", "mx", "h2", "pre", "safeStringify", "undefined", "h3", "length", "ErrorStack", "frames", "p"]
}