react-figma - npm Package Compare versions

Comparing version 0.13.0 to 0.14.0

components/component/Component.d.ts

 import * as React from 'react';
-import { AutoLayoutProps, BorderProps, CornerProps, DefaultContainerProps, DefaultShapeProps, FrameSpecificProps, SelectionEventProps, StyleOf } from '../../types';
+import { AutoLayoutProps, BorderProps, CornerProps, DefaultContainerProps, DefaultShapeProps, FrameSpecificProps, PublishableProps, SelectionEventProps, StyleOf } from '../../types';
 import { LayoutStyleProperties } from '../../styleTransformers/transformLayoutStyleProperties';
@@ -9,3 +9,3 @@ import { BlendStyleProperties } from '../../styleTransformers/transformBlendProperties';
 import { OnLayoutHandlerProps } from '../../hooks/useOnLayoutHandler';
-export interface ComponentProps extends DefaultShapeProps, DefaultContainerProps, SelectionEventProps, AutoLayoutProps, BorderProps, CornerProps, FrameSpecificProps, OnLayoutHandlerProps {
+export interface ComponentProps extends DefaultShapeProps, DefaultContainerProps, SelectionEventProps, AutoLayoutProps, BorderProps, CornerProps, FrameSpecificProps, OnLayoutHandlerProps, PublishableProps {
     style?: StyleOf<GeometryStyleProperties & YogaStyleProperties & LayoutStyleProperties & BlendStyleProperties & BorderStyleProperties>;
@@ -12,0 +12,0 @@ nodeRef?: any;

components/component/ComponentSet.d.ts

 import * as React from 'react';
-import { AutoLayoutProps, DefaultContainerProps, SelectionEventProps, StyleOf } from '../../types';
+import { AutoLayoutProps, DefaultContainerProps, PublishableProps, SelectionEventProps, StyleOf } from '../../types';
 import { LayoutStyleProperties } from '../../styleTransformers/transformLayoutStyleProperties';
 import { YogaStyleProperties } from '../../yoga/YogaStyleProperties';
 import { OnLayoutHandlerProps } from '../../hooks/useOnLayoutHandler';
-export interface ComponentSetProps extends DefaultContainerProps, SelectionEventProps, AutoLayoutProps, OnLayoutHandlerProps {
+export interface ComponentSetProps extends DefaultContainerProps, SelectionEventProps, AutoLayoutProps, OnLayoutHandlerProps, PublishableProps {
     style?: StyleOf<YogaStyleProperties & LayoutStyleProperties>;
@@ -8,0 +8,0 @@ nodeRef?: any;

components/component/createComponent.d.ts

@@ -5,4 +5,4 @@ import * as React from 'react';
 export declare const createComponent: () => {
-    Component: React.FunctionComponent<Pick<ComponentProps, "width" | "height" | "visible" | "opacity" | "blendMode" | "fills" | "backgrounds" | "fillStyleId" | "strokeStyleId" | "strokes" | "strokeWeight" | "strokeAlign" | "strokeCap" | "strokeJoin" | "dashPattern" | "paddingTop" | "paddingBottom" | "paddingLeft" | "paddingRight" | "name" | "children" | "layoutMode" | "layoutAlign" | "primaryAxisAlignItems" | "counterAxisAlignItems" | "style" | "cornerRadius" | "cornerSmoothing" | "isMask" | "effects" | "effectStyleId" | "topLeftRadius" | "topRightRadius" | "bottomLeftRadius" | "bottomRightRadius" | "locked" | "constraints" | "pluginData" | "sharedPluginData" | "relativeTransform" | "x" | "y" | "rotation" | "isWithoutConstraints" | "layoutGrow" | "exportSettings" | "exportAsyncSettings" | "exportAsyncCallback" | "onSelectionEnter" | "onSelectionLeave" | "onLayout" | "primaryAxisSizingMode" | "counterAxisSizingMode" | "horizontalPadding" | "verticalPadding" | "itemSpacing" | "clipsContent" | "guides" | "layoutGrids" | "gridStyleId">>;
+    Component: React.FunctionComponent<Pick<ComponentProps, "width" | "height" | "visible" | "opacity" | "blendMode" | "fills" | "backgrounds" | "fillStyleId" | "strokeStyleId" | "strokes" | "strokeWeight" | "strokeAlign" | "strokeCap" | "strokeJoin" | "dashPattern" | "paddingTop" | "paddingBottom" | "paddingLeft" | "paddingRight" | "name" | "children" | "layoutMode" | "layoutAlign" | "primaryAxisAlignItems" | "counterAxisAlignItems" | "style" | "cornerRadius" | "cornerSmoothing" | "isMask" | "effects" | "effectStyleId" | "topLeftRadius" | "topRightRadius" | "bottomLeftRadius" | "bottomRightRadius" | "locked" | "constraints" | "pluginData" | "sharedPluginData" | "relativeTransform" | "x" | "y" | "rotation" | "isWithoutConstraints" | "layoutGrow" | "exportSettings" | "exportAsyncSettings" | "exportAsyncCallback" | "onSelectionEnter" | "onSelectionLeave" | "onLayout" | "primaryAxisSizingMode" | "counterAxisSizingMode" | "horizontalPadding" | "verticalPadding" | "itemSpacing" | "clipsContent" | "guides" | "layoutGrids" | "gridStyleId" | "description" | "documentationLinks">>;
     Instance: React.FunctionComponent<Pick<InstanceProps, "width" | "height" | "visible" | "opacity" | "blendMode" | "backgrounds" | "paddingTop" | "paddingBottom" | "paddingLeft" | "paddingRight" | "name" | "children" | "layoutMode" | "layoutAlign" | "primaryAxisAlignItems" | "counterAxisAlignItems" | "style" | "isMask" | "effects" | "effectStyleId" | "locked" | "constraints" | "pluginData" | "sharedPluginData" | "relativeTransform" | "x" | "y" | "rotation" | "isWithoutConstraints" | "layoutGrow" | "exportSettings" | "exportAsyncSettings" | "exportAsyncCallback" | "onSelectionEnter" | "onSelectionLeave" | "onLayout" | "primaryAxisSizingMode" | "counterAxisSizingMode" | "horizontalPadding" | "verticalPadding" | "itemSpacing" | "overrides">>;
 };

package.json

 {
   "name": "react-figma",
-  "version": "0.13.0",
+  "version": "0.14.0",
   "description": "Render React components to Figma",
@@ -40,3 +40,3 @@ "scripts": {
   "devDependencies": {
-    "@figma/plugin-typings": "1.19",
+    "@figma/plugin-typings": "1.23",
     "@types/jest": "^24.0.18",
@@ -43,0 +43,0 @@ "@types/node": "^12.7.8",

README.md

@@ -174,24 +174,26 @@ # React Figma
   <tr>
-    <td align="center"><a href="https://twitter.com/ilialesik"><img src="https://avatars2.githubusercontent.com/u/1270648?v=4" width="100px;" alt=""/><br /><sub><b>Ilya Lesik</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=ilyalesik" title="Code">💻</a></td>
-    <td align="center"><a href="http://losyar.com"><img src="https://avatars2.githubusercontent.com/u/1065122?v=4" width="100px;" alt=""/><br /><sub><b>Losev Yaroslav</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=LosYear" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/HVish"><img src="https://avatars1.githubusercontent.com/u/14261201?v=4" width="100px;" alt=""/><br /><sub><b>Vishnu Singh</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=HVish" title="Code">💻</a></td>
-    <td align="center"><a href="http://corrinachow.com"><img src="https://avatars1.githubusercontent.com/u/35117708?v=4" width="100px;" alt=""/><br /><sub><b>corrina</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=corrinachow" title="Code">💻</a></td>
-    <td align="center"><a href="http://www.zacharyquintenwitt.com"><img src="https://avatars1.githubusercontent.com/u/5651980?v=4" width="100px;" alt=""/><br /><sub><b>Zachary Witt</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=zqwitt" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/theashraf"><img src="https://avatars1.githubusercontent.com/u/39750790?v=4" width="100px;" alt=""/><br /><sub><b>Abdelrahman Ashraf</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=theashraf" title="Code">💻</a></td>
-    <td align="center"><a href="https://seanprashad.com"><img src="https://avatars2.githubusercontent.com/u/13009507?v=4" width="100px;" alt=""/><br /><sub><b>sprashad</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=SeanPrashad" title="Documentation">📖</a></td>
+    <td align="center"><a href="https://twitter.com/ilialesik"><img src="https://avatars2.githubusercontent.com/u/1270648?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Ilya Lesik</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=ilyalesik" title="Code">💻</a></td>
+    <td align="center"><a href="http://losyar.com"><img src="https://avatars2.githubusercontent.com/u/1065122?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Losev Yaroslav</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=LosYear" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/HVish"><img src="https://avatars1.githubusercontent.com/u/14261201?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Vishnu Singh</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=HVish" title="Code">💻</a></td>
+    <td align="center"><a href="http://corrinachow.com"><img src="https://avatars1.githubusercontent.com/u/35117708?v=4?s=100" width="100px;" alt=""/><br /><sub><b>corrina</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=corrinachow" title="Code">💻</a></td>
+    <td align="center"><a href="http://www.zacharyquintenwitt.com"><img src="https://avatars1.githubusercontent.com/u/5651980?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Zachary Witt</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=zqwitt" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/theashraf"><img src="https://avatars1.githubusercontent.com/u/39750790?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Abdelrahman Ashraf</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=theashraf" title="Code">💻</a></td>
+    <td align="center"><a href="https://seanprashad.com"><img src="https://avatars2.githubusercontent.com/u/13009507?v=4?s=100" width="100px;" alt=""/><br /><sub><b>sprashad</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=SeanPrashad" title="Documentation">📖</a></td>
   </tr>
   <tr>
-    <td align="center"><a href="https://github.com/wyvl"><img src="https://avatars1.githubusercontent.com/u/40932265?v=4" width="100px;" alt=""/><br /><sub><b>Vivian Lee</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=wyvl" title="Code">💻</a></td>
-    <td align="center"><a href="https://macintoshhelper.com"><img src="https://avatars2.githubusercontent.com/u/6757532?v=4" width="100px;" alt=""/><br /><sub><b>macintoshhelper</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=macintoshhelper" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/pgrimaud"><img src="https://avatars1.githubusercontent.com/u/1866496?v=4" width="100px;" alt=""/><br /><sub><b>Pierre Grimaud</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=pgrimaud" title="Documentation">📖</a></td>
-    <td align="center"><a href="http://gwst.io"><img src="https://avatars3.githubusercontent.com/u/2213636?v=4" width="100px;" alt=""/><br /><sub><b>Greg Westneat</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=leggomuhgreggo" title="Code">💻</a></td>
-    <td align="center"><a href="https://mariusreimer.com"><img src="https://avatars3.githubusercontent.com/u/15148377?v=4" width="100px;" alt=""/><br /><sub><b>Marius Reimer</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=reime005" title="Code">💻</a></td>
-    <td align="center"><a href="http://szeko.com.au"><img src="https://avatars1.githubusercontent.com/u/5523724?v=4" width="100px;" alt=""/><br /><sub><b>szeko</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=szeko" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/wyvl"><img src="https://avatars1.githubusercontent.com/u/40932265?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Vivian Lee</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=wyvl" title="Code">💻</a></td>
+    <td align="center"><a href="https://macintoshhelper.com"><img src="https://avatars2.githubusercontent.com/u/6757532?v=4?s=100" width="100px;" alt=""/><br /><sub><b>macintoshhelper</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=macintoshhelper" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/pgrimaud"><img src="https://avatars1.githubusercontent.com/u/1866496?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Pierre Grimaud</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=pgrimaud" title="Documentation">📖</a></td>
+    <td align="center"><a href="http://gwst.io"><img src="https://avatars3.githubusercontent.com/u/2213636?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Greg Westneat</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=leggomuhgreggo" title="Code">💻</a></td>
+    <td align="center"><a href="https://mariusreimer.com"><img src="https://avatars3.githubusercontent.com/u/15148377?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Marius Reimer</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=reime005" title="Code">💻</a></td>
+    <td align="center"><a href="http://szeko.com.au"><img src="https://avatars1.githubusercontent.com/u/5523724?v=4?s=100" width="100px;" alt=""/><br /><sub><b>szeko</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=szeko" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/yoniholmes"><img src="https://avatars.githubusercontent.com/u/184589?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Jonathan Holmes</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=yoniholmes" title="Documentation">📖</a></td>
   </tr>
 </table>
 
-<!-- markdownlint-enable -->
+<!-- markdownlint-restore -->
 <!-- prettier-ignore-end -->
+
 <!-- ALL-CONTRIBUTORS-LIST:END -->
 
 This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!

renderer.d.ts

@@ -1,1 +0,2 @@
-export declare const render: (jsx: any) => Promise<void>;
+import * as React from 'react';
+export declare const render: (jsx: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)>) | (new (props: any) => React.Component<any, any, any>)>) => Promise<void>;

renderers/component.js

@@ -16,2 +16,3 @@ "use strict";
 var constraintsMixin_1 = require("../mixins/constraintsMixin");
+var publishableMixin_1 = require("../mixins/publishableMixin");
 exports.component = function (node) { return function (props) {
@@ -32,4 +33,5 @@ var componentNode = node || figma.createComponent();
     sceneNodeMixin_1.sceneNodeMixin(componentNode)(props);
+    publishableMixin_1.publishableMixin(componentNode)(props);
     return componentNode;
 }; };
 //# sourceMappingURL=component.js.map

renderers/componentset.js

@@ -10,2 +10,3 @@ "use strict";
 var sceneNodeMixin_1 = require("../mixins/sceneNodeMixin");
+var publishableMixin_1 = require("../mixins/publishableMixin");
 var createNewComponentSet = function () {
@@ -25,4 +26,5 @@ var component = figma.createComponent();
     sceneNodeMixin_1.sceneNodeMixin(componentSetNode)(props);
+    publishableMixin_1.publishableMixin(componentSetNode)(props);
     return componentSetNode;
 }; };
 //# sourceMappingURL=componentset.js.map

types.d.ts

@@ -145,1 +145,9 @@ /// <reference types="plugin-typings" />
 }
+interface DocumentationLink {
+    readonly uri: string;
+}
+export interface PublishableProps {
+    description?: string;
+    documentationLinks?: ReadonlyArray<DocumentationLink>;
+}
+export {};

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

456710

increased by0.51%

Number of package files

329

increased by0.92%

Lines of code

6962

increased by0.32%

Number of lines in readme file

199

increased by1.02%

No dependency changes