{"version":3,"sources":["../src/withLivePreview.tsx","../src/constants.ts","../src/utils.ts","../src/useContentful.tsx","../src/withContentful.tsx","../src/withEntryArgMutator.tsx","../src/components/ContentfulDebugComponent.tsx","../src/manager.ts","../src/Panel.tsx","../src/components/PanelContent.tsx","../src/components/useLivePreviewUrl.tsx","../src/preview.ts"],"names":["makeDecorator","ADDON_ID","PANEL_ID","PARAM_KEY","ADDON_NAME","PARAM_ENTRY","ContentfulLivePreview","assertValue","value","errorMessage","mergeParam","input","defaultValue","v","isContentfulObject","obj","ContentfulLivePreviewProvider","useContentfulLiveUpdates","React","withLivePreview","storyFn","context","parameters","searchParams","globalContentfulPreview","locale","livePreview","debugMode","initialEntry","renderStory","entry","useEffect","useState","createClient","useContentful","entryId","clientParams","setEntry","isLoading","setIsLoading","space","host","accessToken","environment","data","withContentful","params","defaultArgsMutator","args","withEntryArgMutator","argsMutator","useContentfulInspectorMode","EntryTypeIcons","FieldTypeIcons","ContentfulDebugComponent","contentful_entry","depth","breadcrumbs","fields","inspectorProps","assetId","SectionHeader","CodeBlock","fieldComponents","field","i","icon","Section","children","title","addons","Addon_TypesEnum","AddonPanel","styled","Button","Code","createCopyToClipboardFunction","IconButton","useLivePreviewUrl","pathParam","id","RequestDataButton","PanelContent","livePreviewUrl","copyFunction","Panel","props","viewMode","preview"],"mappings":"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","sourcesContent":["import {makeDecorator} from \"@storybook/preview-api\";\nimport {PARAM_ENTRY, PARAM_KEY} from \"./constants\";\nimport {ContentfulLivePreview} from \"@contentful/live-preview\";\nimport {mergeParam} from \"./utils\";\nimport {ContentfulLivePreviewProvider, useContentfulLiveUpdates} from \"@contentful/live-preview/react\";\nimport React from \"react\";\n\nexport const withLivePreview = makeDecorator({\n  name: 'withLivePreview',\n  parameterName: PARAM_KEY,\n  skipIfNoParametersOrOptions: true,\n  wrapper: (\n    storyFn,\n    context,\n    {parameters}\n  ) => {\n    const searchParams = new URLSearchParams(window.location.search);\n    const globalContentfulPreview = context.parameters.globals[PARAM_KEY];\n    const locale = mergeParam([searchParams.get('locale'), parameters.locale, globalContentfulPreview.locale], 'en-US')\n    const livePreview = mergeParam([parameters.livePreview, globalContentfulPreview.livePreview], false)\n\n    const debugMode = mergeParam([parameters.debugMode, globalContentfulPreview?.debugMode], false)\n    if(debugMode) {\n      console.log('🎨 Decorated with withLivePreview')\n    }\n\n    if (livePreview && !ContentfulLivePreview.initialized) {\n      ContentfulLivePreview.init({\n        locale,\n        debugMode,\n        enableLiveUpdates: true,\n        enableInspectorMode: true,\n      });\n    }\n\n    const initialEntry = context.args[PARAM_ENTRY];\n\n    function renderStory() {\n      const entry = useContentfulLiveUpdates(initialEntry);\n      if (entry) {\n        context.args[PARAM_ENTRY] = entry\n      }\n      return <>{storyFn(context)}</>;\n    }\n\n    if (!livePreview) {\n      return storyFn(context);\n    }\n\n    return (\n      <ContentfulLivePreviewProvider locale={locale}>\n        {renderStory()}\n      </ContentfulLivePreviewProvider>\n    )\n\n  }\n})","export const ADDON_ID = \"storybook/contentful-preview\";\nexport const PANEL_ID = `${ADDON_ID}/panel`;\nexport const PARAM_KEY = `contentfulPreview`;\nexport const ADDON_NAME = `Contentful Preview`;\nexport const PARAM_ENTRY = \"contentful_entry\";\n\n// export const ADDON_ROUTE = `contentful-preview`;\n// export const TOOL_ID = `${ADDON_ID}/tool`;\n// export const TAB_ID = `${ADDON_ID}/tab`;\n// export const EVENTS = {\n//   RESULT: `${ADDON_ID}/result`,\n//   REQUEST: `${ADDON_ID}/request`,\n//   CLEAR: `${ADDON_ID}/clear`,\n// };\n","import type {BaseEntry} from \"./types\";\n\nexport function assertValue<T>(value: T, errorMessage = 'Value is undefined or null'): asserts value is NonNullable<T> {\n  if (value === undefined || value === null) {\n    throw new Error(errorMessage);\n  }\n}\n\nexport function mergeParam<T>(input: Array<T | undefined | null>, defaultValue?: T) {\n  return input.find((v) => v !== undefined || null) ?? defaultValue ?? undefined;\n}\n\nexport function isContentfulObject<T extends BaseEntry>(obj: T): obj is T {\n  return Boolean(obj && obj.sys && obj.sys.id && obj.sys.type && obj.fields);\n}","import {useEffect, useState} from \"@storybook/preview-api\";\nimport {assertValue} from \"./utils\";\nimport {createClient, type CreateClientParams} from \"contentful\";\n\ntype UseContentfulParams = {\n  locale: string;\n} & CreateClientParams\n\nexport function useContentful(entryId: string, clientParams: Partial<UseContentfulParams>) {\n  const [entry, setEntry] = useState<{\n    fields: Record<string, any>\n  }>(null);\n\n  const [isLoading, setIsLoading] = useState(true);\n\n  const {\n    space,\n    host,\n    accessToken,\n    environment = 'master',\n    locale = 'en-US'\n  } = clientParams;\n\n  useEffect(() => {\n    const fetchData = async () => {\n      assertValue(entryId, 'No entryId provided');\n      assertValue(space, 'No spaceId provided');\n      assertValue(accessToken, 'No accessToken provided');\n      setIsLoading(true);\n      const contentfulClient = createClient({\n        environment,\n        space,\n        accessToken,\n        host\n      })\n      const data = await contentfulClient.getEntry(entryId, {\n        include: 10,\n        locale: locale\n      });\n      setEntry(data);\n      setIsLoading(false);\n    };\n    fetchData();\n  }, [entryId, environment, space, accessToken, host]);\n\n  return {entry, isLoading};\n}","import {PARAM_ENTRY, PARAM_KEY} from \"./constants\";\nimport {useContentful} from \"./useContentful\";\nimport {mergeParam} from \"./utils\";\nimport {makeDecorator} from \"@storybook/preview-api\";\nimport {ContentfulPreviewParameters} from \"./types\";\n\nexport const withContentful = makeDecorator({\n  name: 'withContentful',\n  parameterName: PARAM_KEY,\n  skipIfNoParametersOrOptions: true,\n  wrapper: (\n    storyFn,\n    context,\n    {parameters}: {\n      parameters: Partial<ContentfulPreviewParameters>\n    }\n  ) => {\n    const searchParams = new URLSearchParams(window.location.search);\n    const globalContentfulPreview = context.parameters.globals[PARAM_KEY];\n    const space = mergeParam([parameters.space, globalContentfulPreview.space])\n    const accessToken = mergeParam([parameters.accessToken, globalContentfulPreview.accessToken])\n    const locale = mergeParam([searchParams.get('locale'), parameters.locale, globalContentfulPreview.locale], 'en-US')\n    const environment = mergeParam([searchParams.get('environment'), parameters.environment, globalContentfulPreview.environment], 'master')\n    const host = mergeParam([parameters.host, globalContentfulPreview.host], 'api.contentful.com')\n    const entryId = searchParams.get('entryId') || parameters.entryId\n\n    const debugMode = mergeParam([parameters.debugMode, globalContentfulPreview.debugMode], false)\n    if(debugMode) {\n      console.log('🎨 Decorated with withContentful')\n    }\n\n    const params = {\n      space,\n      accessToken,\n      environment,\n      host,\n      locale\n    }\n\n    const {entry, isLoading} = useContentful(entryId, params);\n\n    if (entry) {\n      context.args[PARAM_ENTRY] = entry\n    }\n\n    if (isLoading) {\n      return null\n    }\n\n    return storyFn(context)\n  }\n})","import {PARAM_ENTRY, PARAM_KEY} from \"./constants\";\nimport {isContentfulObject, mergeParam} from \"./utils\";\nimport {makeDecorator} from \"@storybook/preview-api\";\nimport {Args} from \"@storybook/types\";\nimport {BaseEntry, ContentfulPreviewParameters} from \"./types\";\n\nexport function defaultArgsMutator(entry: BaseEntry, args: Args): Args {\n  return {\n    ...args,\n    ...entry.fields,\n  }\n}\n\n/*\n  * This decorator is used to pass the entry fields to the story args\n */\nexport const withEntryArgMutator = makeDecorator({\n  name: 'withEntryArgMutator',\n  parameterName: PARAM_KEY,\n  skipIfNoParametersOrOptions: false,\n  wrapper: (\n    storyFn,\n    context,\n    {parameters = {}}: {\n      parameters: Partial<Pick<ContentfulPreviewParameters, 'entryMutator' | 'debugMode'>>\n    }\n  ) => {\n    const globalContentfulPreview = context.parameters.globals[PARAM_KEY];\n    const debugMode = mergeParam([parameters.debugMode, globalContentfulPreview?.debugMode], false)\n    if(debugMode) {\n      console.log('🎨 Decorated with withEntryArgMutator')\n    }\n    if (isContentfulObject(context.args[PARAM_ENTRY])) {\n      const argsMutator = parameters?.entryMutator || defaultArgsMutator\n      context.args = argsMutator(context.args[PARAM_ENTRY], context.args)\n    }\n    return storyFn(context);\n  }\n})","import React, {PropsWithChildren} from \"react\";\nimport {useContentfulInspectorMode} from \"@contentful/live-preview/react\";\nimport {BaseEntry} from \"../types\";\n\ntype AnyEntry =\n  {\n    depth?: number,\n    breadcrumbs?: string[],\n    contentful_entry: BaseEntry\n  }\n  & Record<string, any>;\n\n\nconst EntryTypeIcons = {\n  Entry: '📄',\n  Asset: '🖼️',\n} as const\n\nconst FieldTypeIcons = {\n  Symbol: '🔤',\n  Text: '🔤',\n  RichText: '📝',\n  Number: '🔢',\n  Integer: '🔢',\n  Date: '📅',\n  Boolean: '🔘',\n  Location: '📍',\n  Object: '🔵',\n  Array: '🔵',\n  Link: '🔗',\n  Asset: '🖼️',\n  Entry: '📄',\n  Unknown: '❓',\n} as const\n\n\n/*\n  * This component is used to debug the content of an entry.\n  * The ContentfulPreview decorator assigns the following parameters:\n  * - contentful_entry: The entry object\n  * - <fieldId>: value\n */\nexport function ContentfulDebugComponent(\n  {\n    contentful_entry,\n    depth = 0,\n    breadcrumbs = [],\n    ...fields\n  }: AnyEntry) {\n\n  const inspectorProps = useContentfulInspectorMode({entryId: contentful_entry.sys.id});\n\n  if (contentful_entry.sys.type === 'Asset') {\n    const assetId = contentful_entry.sys.id;\n    return (\n      <div key={assetId} style={{margin: 10, paddingLeft: depth * 20}}>\n        <div {...inspectorProps({fieldId: assetId, assetId})}>\n          <SectionHeader\n            title={EntryTypeIcons.Asset + ' ' + [...breadcrumbs, contentful_entry.fields.title].join(' > ')}\n          />\n          <CodeBlock>\n            {JSON.stringify(contentful_entry.fields.file.url, null, 2)}\n          </CodeBlock>\n        </div>\n      </div>\n    )\n  }\n\n  const fieldComponents = Object.entries(fields).map(([field, value]) => {\n\n\n    if (!value) {\n      return null;\n    }\n\n    if (Array.isArray(value)) {\n      return value.map((v, i) => {\n        if (typeof v === 'object' && v.sys) {\n\n          // @ts-ignore\n          const icon = EntryTypeIcons.hasOwnProperty(v.sys.type) ? EntryTypeIcons[v.sys.type] : FieldTypeIcons.Unknown;\n          return (\n            <Section depth={depth}>\n              <SectionHeader title={icon + ' ' + [...breadcrumbs, field].join(' > ')}/>\n              <ContentfulDebugComponent\n                key={v.sys.id}\n                depth={depth + 1}\n                contentful_entry={v}\n                breadcrumbs={[...breadcrumbs, field]}\n                {...v.fields}\n              />\n            </Section>\n          )\n        }\n      })\n    }\n\n    if (value.type === 'Entry') {\n      return <ContentfulDebugComponent\n        key={field} entryId={value.sys.id}\n        depth={depth + 1}\n        contentful_entry={value}\n        breadcrumbs={[...breadcrumbs, field]}\n        {...value.fields}\n      />\n    }\n\n    if (value.type === 'Asset') {\n      return <ContentfulDebugComponent\n        key={field} entryId={value.sys.id}\n        contentful_entry={value}\n        depth={depth + 1}\n        breadcrumbs={[...breadcrumbs, field]}\n        {...value.fields}\n      />\n    }\n\n    return (\n      <Section key={field} depth={depth}>\n        <div {...inspectorProps({fieldId: field})}>\n          <SectionHeader title={[...breadcrumbs, field].join(' > ')}/>\n          <CodeBlock>\n            {JSON.stringify(value, null, 2)}\n          </CodeBlock>\n        </div>\n      </Section>\n    );\n  })\n  return (\n    <>\n      {fieldComponents}\n    </>\n  );\n}\n\ntype SectionProps = PropsWithChildren<{\n  depth: number,\n}>\n\nfunction Section({depth, children}: SectionProps) {\n  return (\n    <div style={{paddingLeft: depth * 20}}>\n      {children}\n    </div>\n  )\n}\n\nfunction CodeBlock({children}: PropsWithChildren<{}>) {\n  return (\n    <pre style={{padding: 10, backgroundColor: '#eee'}}>\n    {children}\n  </pre>\n  )\n}\n\nfunction SectionHeader({title}: { title: string }) {\n  return (\n    <h4 style={{marginBottom: 0, fontFamily: 'monospace'}}>{title.toUpperCase()}</h4>\n  )\n}","import {addons} from \"@storybook/manager-api\";\nimport {ADDON_ID, ADDON_NAME, PANEL_ID} from \"./constants\";\nimport {Addon_TypesEnum} from \"@storybook/types\";\nimport {Panel} from \"./Panel\";\n\naddons.register(ADDON_ID, () => {\n  addons.add(PANEL_ID, {\n    type: Addon_TypesEnum.PANEL,\n    title: ADDON_NAME,\n    match: ({viewMode}) => viewMode === \"story\",\n    render: Panel,\n  });\n});\n","import React from \"react\";\nimport {AddonPanel} from \"@storybook/components\";\nimport {PanelContent} from \"./components/PanelContent\";\n\ninterface PanelProps {\n  active: boolean;\n}\n\nexport function Panel(props: PanelProps) {\n  return (\n    <AddonPanel {...props}>\n      <PanelContent/>\n    </AddonPanel>\n  );\n};\n","import React from \"react\";\nimport {styled} from \"@storybook/theming\";\nimport {Button, Code, createCopyToClipboardFunction, IconButton} from \"@storybook/components\";\nimport {useLivePreviewUrl} from \"./useLivePreviewUrl\";\n\nexport const RequestDataButton = styled(Button)({\n  marginTop: \"1rem\",\n});\n\ninterface PanelContentProps {}\n\n/**\n * Checkout https://github.com/storybookjs/storybook/blob/next/code/addons/jest/src/components/Panel.tsx\n * for a real world example\n */\nexport const PanelContent: React.FC<PanelContentProps> = () => {\n  const livePreviewUrl = useLivePreviewUrl();\n  const copyFunction = createCopyToClipboardFunction();\n\n  return (\n    <div style={{padding: 20}}>\n      <h3>Welcome</h3>\n      <p>\n        The Contentful Live Preview Addon allows you to use your storybook instance as contentful preview url.\n      </p>\n      <h3>Setup</h3>\n      <p>\n        Set this url as your preview url in your contentful space settings for the content type that represents data\n        for this component..\n      </p>\n      <Code contentEditable={false}>\n        {livePreviewUrl}\n      </Code>\n      <IconButton onClick={() => copyFunction(livePreviewUrl)}>Copy</IconButton>\n    </div>\n  )\n}\n\n","export const useLivePreviewUrl = () => {\n  const currentParams = new URLSearchParams(window.location.search);\n  const pathParam = currentParams.get('path');\n\n  let id = ''\n\n  if(pathParam) {\n    id = pathParam.split('/')[2]\n  }\n\n  const searchParams = new URLSearchParams();\n  searchParams.set('viewMode', 'story')\n  searchParams.set('id', id)\n  searchParams.set('entryId', '{entry.sys.id}')\n  searchParams.set('environment', '{env_id}')\n  searchParams.set('locale', '{locale}')\n\n  return decodeURIComponent(`${window.origin}/iframe.html?${searchParams.toString()}`)\n}\n","/**\n * A decorator is a way to wrap a story in extra “rendering” functionality. Many addons define decorators\n * in order to augment stories:\n * - with extra rendering\n * - gather details about how a story is rendered\n *\n * When writing stories, decorators are typically used to wrap stories with extra markup or context mocking.\n *\n * https://storybook.js.org/docs/react/writing-stories/decorators\n */\nimport type {ProjectAnnotations, Renderer} from \"@storybook/types\";\nimport {PARAM_KEY} from \"./constants\";\nimport {withContentful} from \"./withContentful\";\nimport {withEntryArgMutator} from \"./withEntryArgMutator\";\nimport {withLivePreview} from \"./withLivePreview\";\n\n/**\n * Note: if you want to use JSX in this file, rename it to `preview.tsx`\n * and update the entry prop in tsup.config.ts to use \"src/preview.tsx\",\n */\n\nconst preview: ProjectAnnotations<Renderer> = {\n\n  // seems they are executed in reverse order\n  decorators: [withEntryArgMutator, withLivePreview, withContentful],\n  globals: {\n    [PARAM_KEY]: {\n      // Example of setting a default value for a global parameter\n      // space: \"spaceId\",\n      // accessToken: \"accessToken\",\n      environment: \"master\",\n      locale: \"en-US\",\n      livePreview: true,\n      host: 'cdn.contentful.com',\n      debugMode: false,\n    },\n  },\n};\n\nexport default preview;\n"]}