@suspensive/react/dist/Suspense.cjs.map

Suspensive interfaces for react

{"version":3,"file":"Suspense.cjs","names":["SuspenseDefaultPropsContext","defineSuspense"],"sources":["../src/Suspense.tsx"],"sourcesContent":["'use client'\nimport { type ComponentProps, type ComponentType, type SuspenseProps as ReactSuspenseProps, useContext } from 'react'\nimport { SuspenseDefaultPropsContext } from './contexts/DefaultPropsContexts'\nimport type { PropsWithoutChildren } from './utility-types/PropsWithoutChildren'\nimport { defineSuspense } from './utils/defineSuspense'\n\nexport interface SuspenseProps extends ReactSuspenseProps {\n  /**\n   * With clientOnly prop, `<Suspense/>` will return fallback on the server and children on the client. It uses `useSyncExternalStore` (not `useEffect`) to distinguish server and client via `getServerSnapshot` and `getSnapshot`.\n   * @see https://suspensive.org/docs/react/Suspense#avoid-server-side-rendering-clientonly\n   */\n  clientOnly?: boolean\n}\n\n/**\n * This component is just wrapping React's Suspense. to use Suspense easily in Server-side rendering environment like Next.js\n * @see {@link https://suspensive.org/docs/react/Suspense Suspensive Docs}\n */\nexport const Suspense = Object.assign(\n  ({ clientOnly, fallback, children, name, ...rest }: SuspenseProps) => {\n    const defaultProps = useContext(SuspenseDefaultPropsContext)\n    const DefinedSuspense = defineSuspense({\n      defaultPropsClientOnly: defaultProps.clientOnly,\n      componentPropsClientOnly: clientOnly,\n    })\n    return (\n      <DefinedSuspense {...rest} fallback={fallback === undefined ? defaultProps.fallback : fallback} name={name}>\n        {children}\n      </DefinedSuspense>\n    )\n  },\n  {\n    displayName: 'Suspense',\n    with: <TProps extends ComponentProps<ComponentType> = Record<string, never>>(\n      suspenseProps: PropsWithoutChildren<SuspenseProps>,\n      Component: ComponentType<TProps>\n    ) =>\n      Object.assign(\n        (props: TProps) => (\n          <Suspense {...suspenseProps}>\n            <Component {...props} />\n          </Suspense>\n        ),\n        { displayName: `${Suspense.displayName}.with(${Component.displayName || Component.name || 'Component'})` }\n      ),\n  }\n)\n"],"mappings":";;;;;;;;;;;;CAmBK;CAAY;CAAU;CAAU;;;;;;AADrC,MAAa,WAAW,OAAO,QAC5B,SAAqE;KAArE,EAAE,YAAY,UAAU,UAAU,eAAS;CAC1C,MAAM,qCAA0BA,wDAA2B;CAK3D,OACE,2CALsBC,sCAAe;EACrC,wBAAwB,aAAa;EACrC,0BAA0B;CAC5B,CAEiB,iFAAM;EAAM,UAAU,aAAa,SAAY,aAAa,WAAW;EAAgB;EACnG;EACc;AAErB,GACA;CACE,aAAa;CACb,OACE,eACA,cAEA,OAAO,QACJ,UACC,2CAAC,wFAAa,gCACZ,2CAAC,oDAAc,KAAQ,IACf,IAEZ,EAAE,aAAa,GAAG,SAAS,YAAY,QAAQ,UAAU,eAAe,UAAU,QAAQ,YAAY,GAAG,CAC3G;AACJ,CACF"}