Создаем React-компоненты иконок с помощью Figma API и SVGR. Часть 2.

• figma-svgr-icons-part-1

  2 0 10.0 JavaScript

  Исходники первой части статьи "Создаем React-компоненты иконок с помощью Figma API и SVGR" https://dev.to/sm1t/sozdaiem-react-komponienty-ikonok-s-pomoshchiu-figma-api-i-svgr-chast-1-1j22

• figma-svgr-icons-part-2

  2 0 10.0 JavaScript

  Исходники второй части статьи "Создаем React-компоненты иконок с помощью Figma API и SVGR" https://dev.to/sm1t/sozdaiem-react-komponienty-ikonok-s-pomoshchiu-figma-api-i-svgr-chast-2-2h5c

• SurveyJS

  surveyjs.io featured

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• storybook

  323 82,947 10.0 TypeScript

  Storybook is a frontend workshop for building UI components and pages in isolation. Made for UI development, testing, and documentation.

  

• create-react-app

  576 101,923 1.5 JavaScript

  Set up a modern web app by running one command.

  

• svgo

  30 20,390 8.9 JavaScript

  ⚙️ Node.js tool for optimizing SVG files

  

• svgr

  30 10,324 5.6 TypeScript

  Transform SVGs into React components 🦁

const { types } = require('@babel/core'); module.exports = { ... template: function svgrCustomTemplate( { imports, interfaces, componentName, props, jsx, exports }, { tpl } ) { // меняем корневой элемент на SvgIcon jsx.openingElement.name.name = 'SvgIcon'; jsx.closingElement.name.name = 'SvgIcon'; // https://github.com/gregberge/svgr/issues/530 // при изменении корневого элемента пропадает спред пропсов // поэтому необходимо добавить спред пропсов самостоятельно jsx.openingElement.attributes.push( types.jSXSpreadAttribute(types.identifier('props')) ); return tpl` ${imports}; import { SvgIcon } from '../SvgIcon'; ${interfaces}; const ${componentName} = (${props}) => ( ${jsx} ); ${exports}; ` } }

Suggest a related project