Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-cosmos-renderer

Package Overview
Dependencies
Maintainers
0
Versions
180
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-cosmos-renderer - npm Package Compare versions

Comparing version 6.1.2-canary.0d0e717.0 to 6.1.2-canary.15db638.0

dist/fixture/ClassStateMock.d.ts

3

dist/client.d.ts

@@ -0,4 +1,4 @@

export * from './fixture/ClassStateMock.js';
export * from './fixture/FixtureCapture/FixtureCapture.js';
export * from './fixture/FixtureContext.js';
export * from './fixture/Viewport.js';
export * from './fixture/useFixtureInput/useFixtureInput.js';

@@ -9,2 +9,3 @@ export * from './fixture/useFixtureInput/useValue.js';

export * from './fixture/useFixtureState.js';
export * from './fixture/Viewport.js';
export * from './fixtureLoaders/ClientFixtureLoader.js';

@@ -11,0 +12,0 @@ export * from './rendererConnect/RendererContext.js';

@@ -0,4 +1,4 @@

export * from './fixture/ClassStateMock.js';
export * from './fixture/FixtureCapture/FixtureCapture.js';
export * from './fixture/FixtureContext.js';
export * from './fixture/Viewport.js';
export * from './fixture/useFixtureInput/useFixtureInput.js';

@@ -9,2 +9,3 @@ export * from './fixture/useFixtureInput/useValue.js';

export * from './fixture/useFixtureState.js';
export * from './fixture/Viewport.js';
export * from './fixtureLoaders/ClientFixtureLoader.js';

@@ -11,0 +12,0 @@ export * from './rendererConnect/RendererContext.js';

export declare function getChildrenPath(elPath: string): string;
export declare function isRootPath(elPath: string): boolean;
export declare function isRootPath(elPath: string): elPath is "";
import React from 'react';
import { isElement } from 'react-is';
export function createFixtureNode(fixture) {
// Warning: In a React Server Components setup this function is called on the
// server. When a fixture module uses the 'use client' directive, the fixture
// arg received here will be a function wrapper regardless of the fixture
// module contents. In this scenario, the fixture module will be automatically
// rendered on the client side, where React expects a component default export.
// export will be a Promise wrapper (imbued with magical properties methinks).
// This results in the following limitation: In a React Server Components
// setup, Client fixtures have to export a single function component. They
// can't be multi fixtures and they can't export React elements directly.
return isFunctionFixture(fixture) ? (React.createElement(FixtureElement, { Component: fixture })) : (fixture);
return isNodeFixture(fixture) ? (fixture) : (React.createElement(FixtureElement, { Component: fixture }));
}
function isFunctionFixture(fixture) {
return typeof fixture === 'function';
function isNodeFixture(fixture) {
// If you're curious what the exact type of ReactNode is:
// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/6fc4839a810335dee15374e6bc82dbbc2bbdff58/types/react/index.d.ts#L478-L489
return (fixture === undefined ||
fixture === null ||
typeof fixture === 'string' ||
typeof fixture === 'number' ||
typeof fixture === 'boolean' ||
Array.isArray(fixture) ||
// If you're curious what isElement checks:
// https://github.com/facebook/react/blob/1b0132c05acabae5aebd32c2cadddfb16bda70bc/packages/react-is/src/ReactIs.js#L108-L114
isElement(fixture));
}

@@ -16,0 +25,0 @@ function FixtureElement({ Component }) {

@@ -5,6 +5,7 @@ import React from 'react';

fixture: ReactFixture;
fixtureOptions: {};
userDecoratorModules: ReactDecoratorModule[];
globalDecorators?: ReactDecorator[];
};
export declare function DecoratedFixture({ fixture, userDecoratorModules, globalDecorators, }: Props): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
export declare function DecoratedFixture({ fixture, fixtureOptions, userDecoratorModules, globalDecorators, }: Props): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
export {};

@@ -5,3 +5,3 @@ import React, { useMemo } from 'react';

import { decorateFixture } from './decorateFixture.js';
export function DecoratedFixture({ fixture, userDecoratorModules, globalDecorators = [], }) {
export function DecoratedFixture({ fixture, fixtureOptions, userDecoratorModules, globalDecorators = [], }) {
return useMemo(() => {

@@ -12,4 +12,4 @@ const decorators = [

];
return decorateFixture(React.createElement(FixtureCapture, { decoratorId: "root" }, createFixtureNode(fixture)), decorators);
}, [fixture, globalDecorators, userDecoratorModules]);
return decorateFixture(React.createElement(FixtureCapture, { decoratorId: "root" }, createFixtureNode(fixture)), fixtureOptions, decorators);
}, [fixture, fixtureOptions, globalDecorators, userDecoratorModules]);
}
import React from 'react';
import { ReactDecorator } from 'react-cosmos-core';
export declare function decorateFixture(fixtureNode: React.ReactNode, decorators: ReactDecorator[]): React.ReactElement;
export declare function decorateFixture(fixtureNode: React.ReactNode, fixtureOptions: {}, decorators: ReactDecorator[]): React.ReactElement;
import React from 'react';
export function decorateFixture(fixtureNode, decorators) {
return (React.createElement(React.Fragment, null, [...decorators].reverse().reduce((prevElement, Decorator) => (React.createElement(Decorator, null, prevElement)), fixtureNode)));
export function decorateFixture(fixtureNode, fixtureOptions, decorators) {
return (React.createElement(React.Fragment, null, [...decorators].reverse().reduce((prevElement, Decorator) => (React.createElement(Decorator, { options: fixtureOptions }, prevElement)), fixtureNode)));
}

@@ -1,2 +0,1 @@

/// <reference types="react/experimental" />
import React from 'react';

@@ -14,3 +13,3 @@ import { FixtureId, FixtureState, ReactDecorator, ReactDecoratorModule, ReactFixtureModule } from 'react-cosmos-core';

};
export declare function FixtureModule({ fixtureModule, decoratorModules, globalDecorators, fixtureId, initialFixtureState, renderKey, lazy, renderMessage, }: Props): string | number | boolean | Iterable<React.ReactNode> | React.PromiseLikeOfReactNode | React.JSX.Element | null | undefined;
export declare function FixtureModule({ fixtureModule, decoratorModules, globalDecorators, fixtureId, initialFixtureState, renderKey, lazy, renderMessage, }: Props): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<React.AwaitedReactNode> | React.JSX.Element | null | undefined;
export {};
import React from 'react';
import { getFixtureFromExport, getFixtureItemFromExport, stringifyFixtureId, } from 'react-cosmos-core';
import { getFixtureFromExport, getFixtureItemFromExport, pickSerializableValues, stringifyFixtureId, } from 'react-cosmos-core';
import { DecoratedFixture } from './DecoratedFixture.js';

@@ -9,7 +9,9 @@ import { FixtureProvider } from './FixtureProvider.js';

const fixture = getFixtureFromExport(fixtureModule.default, fixtureId.name);
const { options = {} } = fixtureModule;
const serializableOptions = React.useMemo(() => pickSerializableValues(options), [options]);
if (typeof fixture === 'undefined') {
return renderMessage(`Invalid fixture name: ${fixtureId.name}`);
}
return (React.createElement(FixtureProvider, { key: fixtureKey, fixtureId: fixtureId, initialFixtureState: initialFixtureState, fixtureItem: fixtureItem, lazy: lazy },
React.createElement(DecoratedFixture, { fixture: fixture, userDecoratorModules: decoratorModules, globalDecorators: globalDecorators })));
return (React.createElement(FixtureProvider, { key: fixtureKey, fixtureId: fixtureId, initialFixtureState: initialFixtureState, fixtureItem: fixtureItem, fixtureOptions: serializableOptions, lazy: lazy },
React.createElement(DecoratedFixture, { fixture: fixture, fixtureOptions: options, userDecoratorModules: decoratorModules, globalDecorators: globalDecorators })));
}

@@ -8,2 +8,3 @@ import React from 'react';

fixtureItem: FixtureListItem;
fixtureOptions: {};
lazy: boolean;

@@ -10,0 +11,0 @@ };

@@ -28,5 +28,6 @@ 'use client';

fixture: props.fixtureItem,
fixtureOptions: props.fixtureOptions,
},
});
}, [props.fixtureItem, rendererConnect, rendererId]);
}, [props.fixtureItem, props.fixtureOptions, rendererConnect, rendererId]);
React.useEffect(() => {

@@ -33,0 +34,0 @@ if (!isEqual(state.fixtureState, state.syncedFixtureState)) {

@@ -1,2 +0,7 @@

import { RendererConnect } from 'react-cosmos-core';
import { RendererConnect, RendererResponse } from 'react-cosmos-core';
declare global {
interface Window {
cosmosRendererResponse?: (msg: RendererResponse) => void;
}
}
export declare function createWebSocketsConnect(url: string): RendererConnect;

@@ -20,2 +20,6 @@ import { rendererSocketMessage, } from 'react-cosmos-core';

}
// Allow headless browsers to capture renderer responses
if (window.cosmosRendererResponse) {
window.cosmosRendererResponse(rendererResponse);
}
},

@@ -22,0 +26,0 @@ onMessage(onMessage) {

{
"name": "react-cosmos-renderer",
"version": "6.1.2-canary.0d0e717.0+0d0e717",
"version": "6.1.2-canary.15db638.0+15db638",
"description": "React Cosmos Renderer",

@@ -15,6 +15,6 @@ "repository": "https://github.com/react-cosmos/react-cosmos/tree/main/packages/react-cosmos-renderer",

"lodash-es": "4.17.21",
"react-cosmos-core": "6.1.2-canary.0d0e717.0+0d0e717",
"react-is": "18.2.0"
"react-cosmos-core": "6.1.2-canary.15db638.0+15db638",
"react-is": "18.3.1"
},
"gitHead": "0d0e717b5045febfbaf2bc8e9c840094859d49a4"
"gitHead": "15db6389056d322dd3df5012262cfd620867e49b"
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc