@fullstory/babel-plugin-annotate-react - npm Package Compare versions

Comparing version 2.3.0 to 2.3.1

CHANGELOG.md

 # Changelog
 
+## 2.3.1
+- Update some dependencies
+
+## 2.3.0
+
+- Add [setFSTagName](./README.md#setfstagname-setting) configuration for React Native.
+
 ## 2.2.2
@@ -44,3 +51,3 @@
 - Tweaked the explanation of `data-element` in the main README.
-- Stopped Jest from runing sample tests when testing the plugin. 
+- Stopped Jest from runing sample tests when testing the plugin.
 
@@ -47,0 +54,0 @@ ## 1.0.0

package.json

 {
   "name": "@fullstory/babel-plugin-annotate-react",
-  "version": "2.3.0",
+  "version": "2.3.1",
   "description": "A Babel plugin that annotates React components, making them easier to target with FullStory search",
@@ -28,3 +28,7 @@ "main": "index.js",
     "semver": "^7.5.3"
+  },
+  "engines": {
+    "npm": ">=8.19.4",
+    "node": ">=16.20.2"
   }
 }

README.md

@@ -6,4 +6,36 @@ # Babel Plugin: Annotate React
 
-For React on the web the attributes are `data-component`, `data-element`, and `data-source-file`. For React Native the attributes are `dataComponent`, `dataElement`, and `dataSourceFile`.
+# Getting started
 
+## with npm
+
+```
+npm i @fullstory/babel-plugin-annotate-react --save
+```
+
+## with yarn
+
+```
+yarn add @fullstory/babel-plugin-annotate-react
+```
+
+## Babel configuration
+
+Add the `@fullstory/babel-plugin-annotate-react` plugin to your babel plugin configuration (e.g., **babel.config.js**).
+
+```
+module.exports = {
+  /* ... */
+  plugins: [
+    /* ... */
+    "@fullstory/babel-plugin-annotate-react"
+  ]
+};
+```
+
+# Description
+
+For React on the web, the attributes `data-component`, `data-element`, and `data-source-file` are added to each element. For React Native, the attributes added are `dataComponent`, `dataElement`, and `dataSourceFile`.
+
+> Note that for both web and native, these attributes will appear as ***kebab-case*** in the Fullstory application due to backend processing. End users of Fullstory should create search filters (i.e. segments, metrics, etc) using ***kebab-case***.
+
 The component attribute names the `React.Component` and the element attribute names the original native elements like `View` or `Image` or an emitter of DOM elements like `Fragment`.
@@ -40,2 +72,4 @@
 
+# Configuration options
+
 ## React Native
@@ -42,0 +76,0 @@

No alert changes

Improved metrics

Total package byte prevSize

31607

increased by59.85%

Number of package files

9

increased by80%

Number of lines in readme file

171

increased by24.82%

No dependency changes