react-figma 0.17.0 → 0.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. package/.all-contributorsrc +36 -0
  2. package/README.md +6 -2
  3. package/components/component/createComponent.d.ts +2 -2
  4. package/components/text/Text.js +1 -1
  5. package/components/text/Text.js.map +1 -1
  6. package/contributing.md +1 -1
  7. package/localStyles/useCreateFillStyleId.d.ts +3 -0
  8. package/localStyles/useCreateFillStyleId.js +64 -0
  9. package/localStyles/useCreateFillStyleId.js.map +1 -0
  10. package/localStyles/useFillPaintStyle.js +2 -57
  11. package/localStyles/useFillPaintStyle.js.map +1 -1
  12. package/localStyles/useTextStyle.d.ts +38 -0
  13. package/localStyles/useTextStyle.js +7 -2
  14. package/localStyles/useTextStyle.js.map +1 -1
  15. package/mixins/frameMixin.js +1 -1
  16. package/mixins/frameMixin.js.map +1 -1
  17. package/package.json +2 -2
  18. package/styleTransformers/transformTextStyleProperties.d.ts +1 -0
  19. package/styleTransformers/transformTextStyleProperties.js.map +1 -1
  20. package/types.d.ts +1 -0
package/.all-contributorsrc CHANGED
@@ -139,6 +139,42 @@
139
139
  "contributions": [
140
140
  "code"
141
141
  ]
142
+ },
143
+ {
144
+ "login": "kant",
145
+ "name": "Darío Hereñú",
146
+ "avatar_url": "https://avatars.githubusercontent.com/u/32717?v=4",
147
+ "profile": "https://github.com/kant",
148
+ "contributions": [
149
+ "doc"
150
+ ]
151
+ },
152
+ {
153
+ "login": "KonstHardy",
154
+ "name": "Konstantin Popov",
155
+ "avatar_url": "https://avatars.githubusercontent.com/u/46906648?v=4",
156
+ "profile": "https://github.com/KonstHardy",
157
+ "contributions": [
158
+ "doc"
159
+ ]
160
+ },
161
+ {
162
+ "login": "Utkarsh299-tech",
163
+ "name": "Utkarsh Singh",
164
+ "avatar_url": "https://avatars.githubusercontent.com/u/60184229?v=4",
165
+ "profile": "https://utkarsh299-tech.github.io/myportfolio/",
166
+ "contributions": [
167
+ "doc"
168
+ ]
169
+ },
170
+ {
171
+ "login": "mrkenneh",
172
+ "name": "mrkenneh",
173
+ "avatar_url": "https://avatars.githubusercontent.com/u/96268806?v=4",
174
+ "profile": "https://github.com/mrkenneh",
175
+ "contributions": [
176
+ "code"
177
+ ]
142
178
  }
143
179
  ],
144
180
  "contributorsPerLine": 7,
package/README.md CHANGED
@@ -115,7 +115,7 @@ export const App = () => {
115
115
  * [Interactive](examples/interactive)
116
116
  * [Data fetching](examples/fetching)
117
117
  * [💅 styled-components](examples/styled-components)
118
- * [PrimerDemo](https://github.com/react-figma/PrimerDemo) - Example of multifplatform UI-kit
118
+ * [PrimerDemo](https://github.com/react-figma/PrimerDemo) - Example of multiplatform UI-kit
119
119
  * [Component Variants](examples/component-variants)
120
120
  * [MDX](examples/mdx)
121
121
  * [Local Styles](examples/local-styles)
@@ -131,7 +131,7 @@ export const App = () => {
131
131
  <a href="https://opencollective.com/reactfigma/backer/4/website" target="_blank"><img src="https://opencollective.com/reactfigma/backer/4/avatar.svg"></a>
132
132
  <a href="https://opencollective.com/reactfigma/backer/5/website" target="_blank"><img src="https://opencollective.com/reactfigma/backer/5/avatar.svg"></a>
133
133
 
134
- [Become a sponsor](https://opencollective.com/reactfigma#sponsor) and get your logo on our README on Github with a link to your site.
134
+ [Become a sponsor](https://opencollective.com/reactfigma#sponsor) and get your logo on our README on GitHub with a link to your site.
135
135
 
136
136
  <a href="https://opencollective.com/reactfigma/sponsor/0/website" target="_blank"><img src="https://opencollective.com/reactfigma/sponsor/0/avatar.svg"></a>
137
137
  <a href="https://opencollective.com/reactfigma/sponsor/1/website" target="_blank"><img src="https://opencollective.com/reactfigma/sponsor/1/avatar.svg"></a>
@@ -190,6 +190,10 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
190
190
  </tr>
191
191
  <tr>
192
192
  <td align="center"><a href="https://michaelzheng.medium.com/"><img src="https://avatars.githubusercontent.com/u/7504237?v=4?s=100" width="100px;" alt=""/><br /><sub><b>不吃猫的鱼</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=n0ruSh" title="Code">💻</a></td>
193
+ <td align="center"><a href="https://github.com/kant"><img src="https://avatars.githubusercontent.com/u/32717?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Darío Hereñú</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=kant" title="Documentation">📖</a></td>
194
+ <td align="center"><a href="https://github.com/KonstHardy"><img src="https://avatars.githubusercontent.com/u/46906648?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Konstantin Popov</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=KonstHardy" title="Documentation">📖</a></td>
195
+ <td align="center"><a href="https://utkarsh299-tech.github.io/myportfolio/"><img src="https://avatars.githubusercontent.com/u/60184229?v=4?s=100" width="100px;" alt=""/><br /><sub><b>Utkarsh Singh</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=Utkarsh299-tech" title="Documentation">📖</a></td>
196
+ <td align="center"><a href="https://github.com/mrkenneh"><img src="https://avatars.githubusercontent.com/u/96268806?v=4?s=100" width="100px;" alt=""/><br /><sub><b>mrkenneh</b></sub></a><br /><a href="https://github.com/react-figma/react-figma/commits?author=mrkenneh" title="Code">💻</a></td>
193
197
  </tr>
194
198
  </table>
195
199
 
package/components/component/createComponent.d.ts CHANGED
@@ -2,6 +2,6 @@ import * as React from 'react';
2
2
  import { ComponentProps } from './Component';
3
3
  import { InstanceProps } from './Instance';
4
4
  export declare const createComponent: () => {
5
- 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" | "onNodeId" | "relativeTransform" | "x" | "y" | "rotation" | "isWithoutConstraints" | "layoutGrow" | "exportSettings" | "exportAsyncSettings" | "exportAsyncCallback" | "onSelectionEnter" | "onSelectionLeave" | "onLayout" | "primaryAxisSizingMode" | "counterAxisSizingMode" | "horizontalPadding" | "verticalPadding" | "itemSpacing" | "clipsContent" | "guides" | "layoutGrids" | "gridStyleId" | "description" | "documentationLinks">>;
6
- 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" | "onNodeId" | "relativeTransform" | "x" | "y" | "rotation" | "isWithoutConstraints" | "layoutGrow" | "exportSettings" | "exportAsyncSettings" | "exportAsyncCallback" | "onSelectionEnter" | "onSelectionLeave" | "onLayout" | "primaryAxisSizingMode" | "counterAxisSizingMode" | "horizontalPadding" | "verticalPadding" | "itemSpacing" | "overrides" | "detach">>;
5
+ Component: React.FunctionComponent<Pick<ComponentProps, "width" | "height" | "visible" | "opacity" | "blendMode" | "fillStyleId" | "fills" | "backgrounds" | "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" | "onNodeId" | "relativeTransform" | "x" | "y" | "rotation" | "isWithoutConstraints" | "layoutGrow" | "exportSettings" | "exportAsyncSettings" | "exportAsyncCallback" | "onSelectionEnter" | "onSelectionLeave" | "onLayout" | "primaryAxisSizingMode" | "counterAxisSizingMode" | "horizontalPadding" | "verticalPadding" | "itemSpacing" | "clipsContent" | "guides" | "layoutGrids" | "gridStyleId" | "description" | "documentationLinks">>;
6
+ Instance: React.FunctionComponent<Pick<InstanceProps, "width" | "height" | "visible" | "opacity" | "blendMode" | "fillStyleId" | "backgrounds" | "paddingTop" | "paddingBottom" | "paddingLeft" | "paddingRight" | "name" | "children" | "layoutMode" | "layoutAlign" | "primaryAxisAlignItems" | "counterAxisAlignItems" | "style" | "isMask" | "effects" | "effectStyleId" | "locked" | "constraints" | "pluginData" | "sharedPluginData" | "onNodeId" | "relativeTransform" | "x" | "y" | "rotation" | "isWithoutConstraints" | "layoutGrow" | "exportSettings" | "exportAsyncSettings" | "exportAsyncCallback" | "onSelectionEnter" | "onSelectionLeave" | "onLayout" | "primaryAxisSizingMode" | "counterAxisSizingMode" | "horizontalPadding" | "verticalPadding" | "itemSpacing" | "overrides" | "detach">>;
7
7
  };
package/components/text/Text.js CHANGED
@@ -40,7 +40,7 @@ var Text = function (props) {
40
40
  : {}), __1.StyleSheet.flatten(flattenOriginalStyle), transformAutoLayoutToYoga_1.transformAutoLayoutToYoga(props));
41
41
  var children = normalizeTextNodeChidren(props.children);
42
42
  var charactersByChildren = useTextChildren_1.useTextChildren(nodeRef);
43
- var textProps = __assign({}, transformLayoutStyleProperties_1.transformLayoutStyleProperties(style), transformTextStyleProperties_1.transformTextStyleProperties(style), transformBlendProperties_1.transformBlendProperties(style), props, { characters: charactersByChildren || props.characters }, (style && style.textStyleId ? { textStyleId: style.textStyleId } : {}), { style: style,
43
+ var textProps = __assign({}, transformLayoutStyleProperties_1.transformLayoutStyleProperties(style), transformTextStyleProperties_1.transformTextStyleProperties(style), transformBlendProperties_1.transformBlendProperties(style), props, { characters: charactersByChildren || props.characters }, (style && style.textStyleId ? { textStyleId: style.textStyleId } : {}), (style && style.fillStyleId ? { fillStyleId: style.fillStyleId } : {}), { style: style,
44
44
  children: children });
45
45
  var hasDefinedWidth = textProps.width || style.maxWidth;
46
46
  var loadedFont = useFontName_1.useFontName(textProps.fontName || { family: 'Roboto', style: 'Regular' });
package/components/text/Text.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/components/text/Text.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,6BAA+B;AAS/B,yGAGgE;AAChE,qGAG8D;AAC9D,2DAA0D;AAC1D,6FAAkH;AAElH,2BAAmC;AACnC,uDAAsD;AACtD,+DAA8D;AAC9D,qEAAoE;AACpE,+FAA8F;AAC9F,qEAA0F;AAC1F,+DAA8D;AAC9D,mEAAkE;AAclE,IAAM,wBAAwB,GAAG,UAAA,QAAQ;IACrC,OAAO,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;AAClE,CAAC,CAAC;AAEF,IAAM,IAAI,GAAwB,UAAA,KAAK;IACnC,IAAM,OAAO,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;IAE/B,uCAAkB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IACnC,qCAAiB,CAAC,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;IAC3C,IAAM,cAAc,GAAG,iCAAe,EAAE,CAAC;IACzC,IAAM,oBAAoB,GAAG,cAAU,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAE7D,IAAM,KAAK,gBACJ,CAAC,OAAO,CAAC,GAAG,CAAC,qCAAqC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,EACzE,CAAC,OAAO,CAAC,GAAG,CAAC,gCAAgC;QAChD,KAAK,CAAC,KAAK;QACV,oBAA4B,CAAC,OAAO,KAAK,OAAO;QAC7C,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE;QACtB,CAAC,CAAC,EAAE,CAAC,EACN,cAAU,CAAC,OAAO,CAAC,oBAAoB,CAAC,EACxC,qDAAyB,CAAC,KAAK,CAAC,CACtC,CAAC;IACF,IAAM,QAAQ,GAAG,wBAAwB,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAE1D,IAAM,oBAAoB,GAAG,iCAAe,CAAC,OAAO,CAAC,CAAC;IAEtD,IAAM,SAAS,gBACR,+DAA8B,CAAC,KAAK,CAAC,EACrC,2DAA4B,CAAC,KAAK,CAAC,EACnC,mDAAwB,CAAC,KAAK,CAAC,EAC/B,KAAK,IACR,UAAU,EAAE,oBAAoB,IAAI,KAAK,CAAC,UAAU,IACjD,CAAC,KAAK,IAAI,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,IACzE,KAAK,OAAA;QACL,QAAQ,UAAA,GACX,CAAC;IACF,IAAM,eAAe,GAAG,SAAS,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC;IAC1D,IAAM,UAAU,GAAG,yBAAW,CAAC,SAAS,CAAC,QAAQ,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;IAC7F,IAAM,SAAS,GAAG,6BAAa,YAAG,OAAO,SAAA,IAAK,SAAS,IAAE,UAAU,YAAA,IAAG,CAAC;IACvE,uCAAkB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;IAErC,OAAO,CACH,yCACQ,SAAS,EACT,SAAS,IACb,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,OAAO,IACnB,CACL,CAAC;AACN,CAAC,CAAC;AAEO,oBAAI"}
1
+ {"version":3,"file":"Text.js","sourceRoot":"","sources":["../../src/components/text/Text.tsx"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,6BAA+B;AAS/B,yGAGgE;AAChE,qGAG8D;AAC9D,2DAA0D;AAC1D,6FAAkH;AAElH,2BAAmC;AACnC,uDAAsD;AACtD,+DAA8D;AAC9D,qEAAoE;AACpE,+FAA8F;AAC9F,qEAA0F;AAC1F,+DAA8D;AAC9D,mEAAkE;AAclE,IAAM,wBAAwB,GAAG,UAAA,QAAQ;IACrC,OAAO,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC;AAClE,CAAC,CAAC;AAEF,IAAM,IAAI,GAAwB,UAAA,KAAK;IACnC,IAAM,OAAO,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC;IAE/B,uCAAkB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IACnC,qCAAiB,CAAC,OAAO,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;IAC3C,IAAM,cAAc,GAAG,iCAAe,EAAE,CAAC;IACzC,IAAM,oBAAoB,GAAG,cAAU,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAE7D,IAAM,KAAK,gBACJ,CAAC,OAAO,CAAC,GAAG,CAAC,qCAAqC,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE,CAAC,EACzE,CAAC,OAAO,CAAC,GAAG,CAAC,gCAAgC;QAChD,KAAK,CAAC,KAAK;QACV,oBAA4B,CAAC,OAAO,KAAK,OAAO;QAC7C,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE;QACtB,CAAC,CAAC,EAAE,CAAC,EACN,cAAU,CAAC,OAAO,CAAC,oBAAoB,CAAC,EACxC,qDAAyB,CAAC,KAAK,CAAC,CACtC,CAAC;IACF,IAAM,QAAQ,GAAG,wBAAwB,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAE1D,IAAM,oBAAoB,GAAG,iCAAe,CAAC,OAAO,CAAC,CAAC;IAEtD,IAAM,SAAS,gBACR,+DAA8B,CAAC,KAAK,CAAC,EACrC,2DAA4B,CAAC,KAAK,CAAC,EACnC,mDAAwB,CAAC,KAAK,CAAC,EAC/B,KAAK,IACR,UAAU,EAAE,oBAAoB,IAAI,KAAK,CAAC,UAAU,IACjD,CAAC,KAAK,IAAI,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACtE,CAAC,KAAK,IAAI,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,IACzE,KAAK,OAAA;QACL,QAAQ,UAAA,GACX,CAAC;IACF,IAAM,eAAe,GAAG,SAAS,CAAC,KAAK,IAAI,KAAK,CAAC,QAAQ,CAAC;IAC1D,IAAM,UAAU,GAAG,yBAAW,CAAC,SAAS,CAAC,QAAQ,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;IAC7F,IAAM,SAAS,GAAG,6BAAa,YAAG,OAAO,SAAA,IAAK,SAAS,IAAE,UAAU,YAAA,IAAG,CAAC;IACvE,uCAAkB,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;IAErC,OAAO,CACH,yCACQ,SAAS,EACT,SAAS,IACb,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,OAAO,IACnB,CACL,CAAC;AACN,CAAC,CAAC;AAEO,oBAAI"}
package/contributing.md CHANGED
@@ -66,4 +66,4 @@ Before commit pre-commit hook will be launched. It runs prettier and linting/tes
66
66
 
67
67
  ## Publishing new version to NPM
68
68
  1. Bump version in `package.json` and `src/renderer.tsx`
69
- 2. Create new release/new tag on Github named `vx.y.z` where `x.y.z` is new version number
69
+ 2. Create new release/new tag on GitHub named `vx.y.z` where `x.y.z` is new version number
package/localStyles/useCreateFillStyleId.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ /// <reference types="plugin-typings" />
2
+ import { CommonStyleProps } from '../types';
3
+ export declare const useCreateFillStyleId: (fills: symbol | readonly Paint[], params: CommonStyleProps) => any[];
package/localStyles/useCreateFillStyleId.js ADDED
@@ -0,0 +1,64 @@
1
+ "use strict";
2
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ var __generator = (this && this.__generator) || function (thisArg, body) {
11
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
12
+ return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
13
+ function verb(n) { return function (v) { return step([n, v]); }; }
14
+ function step(op) {
15
+ if (f) throw new TypeError("Generator is already executing.");
16
+ while (_) try {
17
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
18
+ if (y = 0, t) op = [op[0] & 2, t.value];
19
+ switch (op[0]) {
20
+ case 0: case 1: t = op; break;
21
+ case 4: _.label++; return { value: op[1], done: false };
22
+ case 5: _.label++; y = op[1]; op = [0]; continue;
23
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
24
+ default:
25
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
26
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
27
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
28
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
29
+ if (t[2]) _.ops.pop();
30
+ _.trys.pop(); continue;
31
+ }
32
+ op = body.call(thisArg, _);
33
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
34
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
35
+ }
36
+ };
37
+ var _this = this;
38
+ Object.defineProperty(exports, "__esModule", { value: true });
39
+ var rpc_1 = require("../rpc");
40
+ var React = require("react");
41
+ exports.useCreateFillStyleId = function (fills, params) {
42
+ var _a = React.useState(null), fillStyleId = _a[0], setFillStyleId = _a[1];
43
+ var createFillsStyle = function () { return __awaiter(_this, void 0, void 0, function () {
44
+ var id;
45
+ return __generator(this, function (_a) {
46
+ switch (_a.label) {
47
+ case 0:
48
+ if (!fills) {
49
+ return [2 /*return*/];
50
+ }
51
+ return [4 /*yield*/, rpc_1.api.createOrUpdatePaintStyle({
52
+ paints: fills,
53
+ params: params
54
+ })];
55
+ case 1:
56
+ id = _a.sent();
57
+ setFillStyleId(id);
58
+ return [2 /*return*/];
59
+ }
60
+ });
61
+ }); };
62
+ return [createFillsStyle, fillStyleId];
63
+ };
64
+ //# sourceMappingURL=useCreateFillStyleId.js.map
package/localStyles/useCreateFillStyleId.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useCreateFillStyleId.js","sourceRoot":"","sources":["../src/localStyles/useCreateFillStyleId.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iBAoBA;;AApBA,8BAA6B;AAC7B,6BAA+B;AAGlB,QAAA,oBAAoB,GAAG,UAAC,KAAgC,EAAE,MAAwB;IACrF,IAAA,yBAAoD,EAAnD,mBAAW,EAAE,sBAAsC,CAAC;IAE3D,IAAM,gBAAgB,GAAG;;;;;oBACrB,IAAI,CAAC,KAAK,EAAE;wBACR,sBAAO;qBACV;oBACU,qBAAM,SAAG,CAAC,wBAAwB,CAAC;4BAC1C,MAAM,EAAE,KAAK;4BACb,MAAM,QAAA;yBACT,CAAC,EAAA;;oBAHI,EAAE,GAAG,SAGT;oBACF,cAAc,CAAC,EAAE,CAAC,CAAC;;;;SACtB,CAAC;IAEF,OAAO,CAAC,gBAAgB,EAAE,WAAW,CAAC,CAAC;AAC3C,CAAC,CAAC"}
package/localStyles/useFillPaintStyle.js CHANGED
@@ -10,75 +10,20 @@ var __assign = (this && this.__assign) || function () {
10
10
  };
11
11
  return __assign.apply(this, arguments);
12
12
  };
13
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
14
- return new (P || (P = Promise))(function (resolve, reject) {
15
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
16
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
17
- function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
18
- step((generator = generator.apply(thisArg, _arguments || [])).next());
19
- });
20
- };
21
- var __generator = (this && this.__generator) || function (thisArg, body) {
22
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
23
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
24
- function verb(n) { return function (v) { return step([n, v]); }; }
25
- function step(op) {
26
- if (f) throw new TypeError("Generator is already executing.");
27
- while (_) try {
28
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
29
- if (y = 0, t) op = [op[0] & 2, t.value];
30
- switch (op[0]) {
31
- case 0: case 1: t = op; break;
32
- case 4: _.label++; return { value: op[1], done: false };
33
- case 5: _.label++; y = op[1]; op = [0]; continue;
34
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
35
- default:
36
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
37
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
38
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
39
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
40
- if (t[2]) _.ops.pop();
41
- _.trys.pop(); continue;
42
- }
43
- op = body.call(thisArg, _);
44
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
45
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
46
- }
47
- };
48
- var _this = this;
49
13
  Object.defineProperty(exports, "__esModule", { value: true });
50
14
  var transformGeometryStyleProperties_1 = require("../styleTransformers/transformGeometryStyleProperties");
51
- var rpc_1 = require("../rpc");
52
15
  var React = require("react");
53
16
  var useImageHash_1 = require("../hooks/useImageHash");
54
17
  var Platform_1 = require("../helpers/Platform");
18
+ var useCreateFillStyleId_1 = require("./useCreateFillStyleId");
55
19
  exports.useFillPaintStyle = function (style, params) {
56
- var _a = React.useState(null), fillStyleId = _a[0], setFillStyleId = _a[1];
57
20
  var imageHash = useImageHash_1.useImageHash(style.backgroundImage);
58
21
  var transformedStyles = __assign({}, transformGeometryStyleProperties_1.transformGeometryStyleProperties('fills', style, imageHash), { style: style });
22
+ var _a = useCreateFillStyleId_1.useCreateFillStyleId(transformedStyles.fills, params), createFillsStyle = _a[0], fillStyleId = _a[1];
59
23
  React.useEffect(function () {
60
24
  if (Platform_1.Platform.OS !== 'figma') {
61
25
  return;
62
26
  }
63
- var createFillsStyle = function () { return __awaiter(_this, void 0, void 0, function () {
64
- var id;
65
- return __generator(this, function (_a) {
66
- switch (_a.label) {
67
- case 0:
68
- if (!transformedStyles.fills) {
69
- return [2 /*return*/];
70
- }
71
- return [4 /*yield*/, rpc_1.api.createOrUpdatePaintStyle({
72
- paints: transformedStyles.fills,
73
- params: params
74
- })];
75
- case 1:
76
- id = _a.sent();
77
- setFillStyleId(id);
78
- return [2 /*return*/];
79
- }
80
- });
81
- }); };
82
27
  createFillsStyle();
83
28
  }, [transformedStyles]);
84
29
  return __assign({}, style, (fillStyleId ? { fillStyleId: fillStyleId } : {}));
package/localStyles/useFillPaintStyle.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useFillPaintStyle.js","sourceRoot":"","sources":["../src/localStyles/useFillPaintStyle.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iBAuCA;;AAvCA,0GAG+D;AAE/D,8BAA6B;AAC7B,6BAA+B;AAC/B,sDAAqD;AACrD,gDAA+C;AAGlC,QAAA,iBAAiB,GAAG,UAAC,KAAuC,EAAE,MAAwB;IACzF,IAAA,yBAAoD,EAAnD,mBAAW,EAAE,sBAAsC,CAAC;IAC3D,IAAM,SAAS,GAAG,2BAAY,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;IAEtD,IAAM,iBAAiB,gBAChB,mEAAgC,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,CAAC,IAC9D,KAAK,OAAA,GACR,CAAC;IAEF,KAAK,CAAC,SAAS,CAAC;QACZ,IAAI,mBAAQ,CAAC,EAAE,KAAK,OAAO,EAAE;YACzB,OAAO;SACV;QACD,IAAM,gBAAgB,GAAG;;;;;wBACrB,IAAI,CAAC,iBAAiB,CAAC,KAAK,EAAE;4BAC1B,sBAAO;yBACV;wBACU,qBAAM,SAAG,CAAC,wBAAwB,CAAC;gCAC1C,MAAM,EAAE,iBAAiB,CAAC,KAAK;gCAC/B,MAAM,QAAA;6BACT,CAAC,EAAA;;wBAHI,EAAE,GAAG,SAGT;wBACF,cAAc,CAAC,EAAE,CAAC,CAAC;;;;aACtB,CAAC;QACF,gBAAgB,EAAE,CAAC;IACvB,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,oBAAY,KAAK,EAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,aAAA,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAG;AACjE,CAAC,CAAC"}
1
+ {"version":3,"file":"useFillPaintStyle.js","sourceRoot":"","sources":["../src/localStyles/useFillPaintStyle.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,0GAG+D;AAG/D,6BAA+B;AAC/B,sDAAqD;AACrD,gDAA+C;AAE/C,+DAA8D;AAEjD,QAAA,iBAAiB,GAAG,UAAC,KAAuC,EAAE,MAAwB;IAC/F,IAAM,SAAS,GAAG,2BAAY,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC;IAEtD,IAAM,iBAAiB,gBAChB,mEAAgC,CAAC,OAAO,EAAE,KAAK,EAAE,SAAS,CAAC,IAC9D,KAAK,OAAA,GACR,CAAC;IACI,IAAA,iFAAuF,EAAtF,wBAAgB,EAAE,mBAAoE,CAAC;IAE9F,KAAK,CAAC,SAAS,CAAC;QACZ,IAAI,mBAAQ,CAAC,EAAE,KAAK,OAAO,EAAE;YACzB,OAAO;SACV;QAED,gBAAgB,EAAE,CAAC;IACvB,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,oBAAY,KAAK,EAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,aAAA,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAG;AACjE,CAAC,CAAC"}
package/localStyles/useTextStyle.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import { TextStyleProperties } from '../styleTransformers/transformTextStyleProperties';
2
2
  import { CommonStyleProps } from '../types';
3
3
  export declare const useTextStyle: (style: Partial<TextStyleProperties>, params: CommonStyleProps) => {
4
+ fillStyleId: any;
4
5
  textStyleId: any;
5
6
  color?: string;
6
7
  fontFamily?: string;
@@ -17,8 +18,45 @@ export declare const useTextStyle: (style: Partial<TextStyleProperties>, params:
17
18
  height: number;
18
19
  };
19
20
  textShadowRadius?: number;
21
+ } | {
22
+ textStyleId: any;
23
+ color?: string;
24
+ fillStyleId?: string;
25
+ fontFamily?: string;
26
+ fontWeight?: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900";
27
+ fontStyle?: "normal" | "italic" | "solid";
28
+ fontSize?: number;
29
+ textAlign?: "left" | "center" | "auto" | "right" | "justify";
30
+ lineHeight?: import("../helpers/size").TSize;
31
+ letterSpacing?: import("../helpers/size").TSize;
32
+ textDecorationLine?: "none" | "underline" | "line-through";
33
+ textShadowColor?: string;
34
+ textShadowOffset?: {
35
+ width: number;
36
+ height: number;
37
+ };
38
+ textShadowRadius?: number;
39
+ } | {
40
+ fillStyleId: any;
41
+ color?: string;
42
+ fontFamily?: string;
43
+ fontWeight?: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900";
44
+ fontStyle?: "normal" | "italic" | "solid";
45
+ fontSize?: number;
46
+ textAlign?: "left" | "center" | "auto" | "right" | "justify";
47
+ lineHeight?: import("../helpers/size").TSize;
48
+ letterSpacing?: import("../helpers/size").TSize;
49
+ textDecorationLine?: "none" | "underline" | "line-through";
50
+ textShadowColor?: string;
51
+ textShadowOffset?: {
52
+ width: number;
53
+ height: number;
54
+ };
55
+ textShadowRadius?: number;
56
+ textStyleId?: string;
20
57
  } | {
21
58
  color?: string;
59
+ fillStyleId?: string;
22
60
  fontFamily?: string;
23
61
  fontWeight?: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900";
24
62
  fontStyle?: "normal" | "italic" | "solid";
package/localStyles/useTextStyle.js CHANGED
@@ -52,6 +52,7 @@ var Platform_1 = require("../helpers/Platform");
52
52
  var transformTextStyleProperties_1 = require("../styleTransformers/transformTextStyleProperties");
53
53
  var React = require("react");
54
54
  var useFontName_1 = require("../hooks/useFontName");
55
+ var useCreateFillStyleId_1 = require("./useCreateFillStyleId");
55
56
  var AVAILABLE_TEXT_PROPERTIES = [
56
57
  'fontSize',
57
58
  'textDecoration',
@@ -65,6 +66,7 @@ var AVAILABLE_TEXT_PROPERTIES = [
65
66
  exports.useTextStyle = function (style, params) {
66
67
  var _a = React.useState(null), textStyleId = _a[0], setTextStyleId = _a[1];
67
68
  var transformedStyles = React.useMemo(function () { return (__assign({}, transformTextStyleProperties_1.transformTextStyleProperties(style), { style: style })); }, [style]);
69
+ var _b = useCreateFillStyleId_1.useCreateFillStyleId(style && style.color ? transformedStyles.fills : null, params), createFillsStyle = _b[0], fillStyleId = _b[1];
68
70
  var textProperties = React.useMemo(function () {
69
71
  return Object.keys(transformedStyles).reduce(function (prev, current) {
70
72
  var _a;
@@ -96,8 +98,11 @@ exports.useTextStyle = function (style, params) {
96
98
  }
97
99
  });
98
100
  }); };
99
- createTextStyle();
101
+ if (loadedFont) {
102
+ createTextStyle();
103
+ }
104
+ createFillsStyle();
100
105
  }, [textProperties, loadedFont]);
101
- return __assign({}, style, (textStyleId ? { textStyleId: textStyleId } : {}));
106
+ return __assign({}, style, (textStyleId ? { textStyleId: textStyleId } : {}), (fillStyleId ? { fillStyleId: fillStyleId } : {}));
102
107
  };
103
108
  //# sourceMappingURL=useTextStyle.js.map
package/localStyles/useTextStyle.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useTextStyle.js","sourceRoot":"","sources":["../src/localStyles/useTextStyle.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iBA6DA;;AA7DA,8BAA6B;AAC7B,gDAA+C;AAC/C,kGAAsH;AACtH,6BAA+B;AAC/B,oDAAmD;AAGnD,IAAM,yBAAyB,GAAG;IAC9B,UAAU;IACV,gBAAgB;IAChB,UAAU;IACV,eAAe;IACf,YAAY;IACZ,iBAAiB;IACjB,kBAAkB;IAClB,UAAU;CACb,CAAC;AAEW,QAAA,YAAY,GAAG,UAAC,KAAmC,EAAE,MAAwB;IAChF,IAAA,yBAAoD,EAAnD,mBAAW,EAAE,sBAAsC,CAAC;IAE3D,IAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CACnC,cAAM,OAAA,cACC,2DAA4B,CAAC,KAAK,CAAC,IACtC,KAAK,OAAA,IACP,EAHI,CAGJ,EACF,CAAC,KAAK,CAAC,CACV,CAAC;IAEF,IAAM,cAAc,GAAG,KAAK,CAAC,OAAO,CAAC;QACjC,OAAO,MAAM,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,MAAM,CACxC,UAAC,IAAI,EAAE,OAAO;;YAAK,OAAA,cACZ,IAAI,EACJ,CAAC,yBAAyB,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,WAAG,GAAC,OAAO,IAAG,iBAAiB,CAAC,OAAO,CAAC,MAAG,CAAC,CAAC,EAAE,CAAC,EACvG;QAHiB,CAGjB,EACF,EAAE,CACL,CAAC;IACN,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,IAAM,UAAU,GAAG,yBAAW,CAAE,cAAsB,CAAC,QAAQ,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;IAE3G,KAAK,CAAC,SAAS,CAAC;QACZ,IAAI,mBAAQ,CAAC,EAAE,KAAK,OAAO,EAAE;YACzB,OAAO;SACV;QACD,IAAM,eAAe,GAAG;;;;;wBACpB,IAAI,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,MAAM,KAAK,CAAC,EAAE;4BAC1C,sBAAO;yBACV;wBACU,qBAAM,SAAG,CAAC,uBAAuB,CAAC;gCACzC,cAAc,gBAAA;gCACd,MAAM,QAAA;gCACN,UAAU,YAAA;6BACb,CAAC,EAAA;;wBAJI,EAAE,GAAG,SAIT;wBACF,cAAc,CAAC,EAAE,CAAC,CAAC;;;;aACtB,CAAC;QACF,eAAe,EAAE,CAAC;IACtB,CAAC,EAAE,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC,CAAC;IAEjC,oBAAY,KAAK,EAAK,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAG;AAC9E,CAAC,CAAC"}
1
+ {"version":3,"file":"useTextStyle.js","sourceRoot":"","sources":["../src/localStyles/useTextStyle.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iBA4EA;;AA5EA,8BAA6B;AAC7B,gDAA+C;AAC/C,kGAAsH;AACtH,6BAA+B;AAC/B,oDAAmD;AAEnD,+DAA8D;AAE9D,IAAM,yBAAyB,GAAG;IAC9B,UAAU;IACV,gBAAgB;IAChB,UAAU;IACV,eAAe;IACf,YAAY;IACZ,iBAAiB;IACjB,kBAAkB;IAClB,UAAU;CACb,CAAC;AAEW,QAAA,YAAY,GAAG,UAAC,KAAmC,EAAE,MAAwB;IAChF,IAAA,yBAAoD,EAAnD,mBAAW,EAAE,sBAAsC,CAAC;IAE3D,IAAM,iBAAiB,GAAG,KAAK,CAAC,OAAO,CACnC,cAAM,OAAA,cACC,2DAA4B,CAAC,KAAK,CAAC,IACtC,KAAK,OAAA,IACP,EAHI,CAGJ,EACF,CAAC,KAAK,CAAC,CACV,CAAC;IAEI,IAAA,+GAGL,EAHM,wBAAgB,EAAE,mBAGxB,CAAC;IAEF,IAAM,cAAc,GAAG,KAAK,CAAC,OAAO,CAAC;QACjC,OAAO,MAAM,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,MAAM,CACxC,UAAC,IAAI,EAAE,OAAO;;YAAK,OAAA,cACZ,IAAI,EACJ,CAAC,yBAAyB,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,WAAG,GAAC,OAAO,IAAG,iBAAiB,CAAC,OAAO,CAAC,MAAG,CAAC,CAAC,EAAE,CAAC,EACvG;QAHiB,CAGjB,EACF,EAAE,CACL,CAAC;IACN,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAExB,IAAM,UAAU,GAAG,yBAAW,CAAE,cAAsB,CAAC,QAAQ,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC;IAE3G,KAAK,CAAC,SAAS,CAAC;QACZ,IAAI,mBAAQ,CAAC,EAAE,KAAK,OAAO,EAAE;YACzB,OAAO;SACV;QACD,IAAM,eAAe,GAAG;;;;;wBACpB,IAAI,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,MAAM,KAAK,CAAC,EAAE;4BAC1C,sBAAO;yBACV;wBACU,qBAAM,SAAG,CAAC,uBAAuB,CAAC;gCACzC,cAAc,gBAAA;gCACd,MAAM,QAAA;gCACN,UAAU,YAAA;6BACb,CAAC,EAAA;;wBAJI,EAAE,GAAG,SAIT;wBACF,cAAc,CAAC,EAAE,CAAC,CAAC;;;;aACtB,CAAC;QAEF,IAAI,UAAU,EAAE;YACZ,eAAe,EAAE,CAAC;SACrB;QAED,gBAAgB,EAAE,CAAC;IACvB,CAAC,EAAE,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC,CAAC;IAEjC,oBACO,KAAK,EACL,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACjD,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACtD;AACN,CAAC,CAAC"}
package/mixins/frameMixin.js CHANGED
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  var propsAssign_1 = require("../helpers/propsAssign");
4
- exports.frameMixin = propsAssign_1.propsAssign(['backgrounds'], {
4
+ exports.frameMixin = propsAssign_1.propsAssign(['backgrounds', 'fillStyleId'], {
5
5
  backgrounds: []
6
6
  });
7
7
  //# sourceMappingURL=frameMixin.js.map
package/mixins/frameMixin.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"frameMixin.js","sourceRoot":"","sources":["../src/mixins/frameMixin.ts"],"names":[],"mappings":";;AAAA,sDAAqD;AAGxC,QAAA,UAAU,GAAG,yBAAW,CAAyB,CAAC,aAAa,CAAC,EAAE;IAC3E,WAAW,EAAE,EAAE;CAClB,CAAC,CAAC"}
1
+ {"version":3,"file":"frameMixin.js","sourceRoot":"","sources":["../src/mixins/frameMixin.ts"],"names":[],"mappings":";;AAAA,sDAAqD;AAGxC,QAAA,UAAU,GAAG,yBAAW,CAAyB,CAAC,aAAa,EAAE,aAAa,CAAC,EAAE;IAC1F,WAAW,EAAE,EAAE;CAClB,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-figma",
3
- "version": "0.17.0",
3
+ "version": "0.20.0",
4
4
  "description": "Render React components to Figma",
5
5
  "scripts": {
6
6
  "tsc": "tsc -p tsconfig.json --noEmit",
@@ -72,7 +72,7 @@
72
72
  "dependencies": {
73
73
  "color-parse": "1.3.8",
74
74
  "figma-jsonrpc": "^0.4.0",
75
- "nanoid": "3.1.20",
75
+ "nanoid": "3.1.31",
76
76
  "react-devtools-core": "^4.7.0",
77
77
  "react-fetch-hook": "1.7.2",
78
78
  "react-reconciler": "^0.23.0",
package/styleTransformers/transformTextStyleProperties.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import { Color, GeometryProps, TextNodeProps } from '../types';
2
2
  export interface TextStyleProperties {
3
3
  color: string;
4
+ fillStyleId: string;
4
5
  fontFamily: string;
5
6
  fontWeight: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
6
7
  fontStyle: 'normal' | 'italic' | 'solid';
package/styleTransformers/transformTextStyleProperties.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"transformTextStyleProperties.js","sourceRoot":"","sources":["../src/styleTransformers/transformTextStyleProperties.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"transformTextStyleProperties.js","sourceRoot":"","sources":["../src/styleTransformers/transformTextStyleProperties.ts"],"names":[],"mappings":"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"}
package/types.d.ts CHANGED
@@ -47,6 +47,7 @@ export interface GeometryProps {
47
47
  }
48
48
  export interface FrameProps {
49
49
  backgrounds?: ReadonlyArray<Paint>;
50
+ fillStyleId?: string | symbol;
50
51
  }
51
52
  export interface CornerProps {
52
53
  cornerRadius?: number | symbol;