@suspensive/react/dist/ClientOnly.cjs

Suspensive interfaces for react

'use client';

Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
const require_useIsClient = require('./useIsClient.cjs');
const require_objectSpread2 = require('./_virtual/_@oxc-project_runtime@0.130.0/helpers/objectSpread2.cjs');
let react_jsx_runtime = require("react/jsx-runtime");

//#region src/ClientOnly.tsx
/**
* This component ensures its children are only rendered on the client-side.
* @see {@link https://suspensive.org/docs/react/ClientOnly Suspensive Docs}
* @see {@link https://suspensive.org/docs/react/useIsClient useIsClient} is used internally for environment detection
*/
const ClientOnly = Object.assign(({ children, fallback }) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: require_useIsClient.useIsClient() ? children : fallback }), {
	displayName: "ClientOnly",
	with: (clientOnlyProps, Component) => Object.assign((props) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ClientOnly, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, clientOnlyProps), {}, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Component, require_objectSpread2._objectSpread2({}, props)) })), { displayName: `${ClientOnly.displayName}.with(${Component.displayName || Component.name || "Component"})` })
});

//#endregion
exports.ClientOnly = ClientOnly;
//# sourceMappingURL=ClientOnly.cjs.map