@grafana/scenes-react 4.24.0

package/CHANGELOG.md

@@ -0,0 +1 @@
+Work in progress 

package/README.md

@@ -0,0 +1,47 @@
+<div align="center">
+  <img
+    src="https://raw.githubusercontent.com/grafana/scenes/main/docusaurus/website/static/img/logo.svg"
+    alt="Grafana Logo"
+    width="100px"
+    padding="40px"
+  />
+  <h1>@grafana/scenes</h1>
+  <p>Build highly interactive Grafana apps with ease.</p>
+</div>
+
+## About @grafana/scenes
+
+@grafana/scenes provides a library to build highly interactive, dashboard-like experiences in Grafana's app plugins. It comes with the following features:
+
+- Versatile layout options.
+- Grafana panels rendering.
+- Querying & transformations support
+- Multiple time ranges support.
+- Template variables support.
+- URL sync.
+- ... and more.
+
+## Development
+
+To work on @grafana/scenes SDK, please follow the guides below.
+
+### Setting up @grafana/scenes with a local Grafana instance
+
+To setup scenes with local Grafana, the following setup is required:
+
+1. Clone the [Grafana Scenes repository](https://github.com/grafana/scenes/).
+1. Clone the [Grafana](https://github.com/grafana/grafana/) repository and follow the [Development guide](https://github.com/grafana/grafana/blob/main/contribute/developer-guide.md#developer-guide).
+1. Setup env variable `GRAFANA_PATH` to point to your Grafana repository directory, `export GRAFANA_PATH=<path-to-grafana-directory>`
+1. From Grafana Scenes root directory run `./scripts/dev.sh`. This will compile @grafana/scenes with watch mode enabled and link it to your Grafana.
+1. From Grafana directory run `yarn install`.
+
+### Setting up local version of @grafana/scenes with app plugin
+
+1. Run `YARN_IGNORE_PATH=1 yarn link` from `packages/scenes` directory.
+1. Run `yarn dev` from `packages/scenes` directory.
+1. Run `yarn link @grafana/scenes` from app plugin directory.
+1. Start app plugin development server.
+
+### Demo app
+
+Alternatively, use the [demo app](../scenes-app/README.md) included in this repository.

package/package.json

@@ -0,0 +1,119 @@
+{
+  "name": "@grafana/scenes-react",
+  "version": "4.24.0",
+  "description": "Grafana framework for building dynamic dashboards",
+  "author": "Grafana Labs",
+  "license": "AGPL-3.0-only",
+  "homepage": "https://github.com/grafana/scenes#readme",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "module": "dist/esm/index.js",
+  "directories": {
+    "src": "src"
+  },
+  "files": [
+    "dist",
+    "./README.md",
+    "./CHANGELOG.md",
+    "LICENSE"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/grafana/scenes.git"
+  },
+  "scripts": {
+    "tsc": "tsc -p ./tsconfig.build.json",
+    "dev": "yarn clean && yarn build:dev --watch",
+    "build": "rollup -c rollup.config.ts",
+    "build:dev": "yarn build --environment NODE_ENV:development",
+    "clean": "rimraf ./dist ./compiled ./package.tgz",
+    "typecheck": "tsc --emitDeclarationOnly false --noEmit",
+    "test": "jest",
+    "lint": "eslint --ignore-path ../../.gitignore . --ext .js,.tsx,.ts --cache",
+    "prepack": "node ./scripts/prepack.js",
+    "postpack": "node ./scripts/postpack.js"
+  },
+  "bugs": {
+    "url": "https://github.com/grafana/scenes/issues"
+  },
+  "dependencies": {
+    "@grafana/e2e-selectors": "^10.4.1",
+    "react-grid-layout": "1.3.4",
+    "react-use": "17.4.0",
+    "react-virtualized-auto-sizer": "1.0.7",
+    "uuid": "^9.0.0"
+  },
+  "peerDependencies": {
+    "@grafana/data": "^10.4.1",
+    "@grafana/runtime": "^10.4.1",
+    "@grafana/scenes": "workspace:*",
+    "@grafana/schema": "^10.4.1",
+    "@grafana/ui": "^10.4.1",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
+  },
+  "devDependencies": {
+    "@emotion/css": "11.10.5",
+    "@emotion/react": "11.10.5",
+    "@grafana/eslint-config": "5.1.0",
+    "@grafana/tsconfig": "^1.3.0-rc1",
+    "@rollup/plugin-eslint": "^9.0.3",
+    "@rollup/plugin-node-resolve": "15.0.1",
+    "@swc/core": "^1.2.162",
+    "@swc/jest": "^0.2.36",
+    "@testing-library/dom": "9.3.4",
+    "@testing-library/jest-dom": "6.4.2",
+    "@testing-library/react": "14.2.1",
+    "@testing-library/react-hooks": "8.0.1",
+    "@testing-library/user-event": "14.5.2",
+    "@types/history": "4.7.11",
+    "@types/jest": "29.5.12",
+    "@types/lodash": "4.14.187",
+    "@types/node": "20.11.30",
+    "@types/react": "18.2.74",
+    "@types/react-dom": "18.2.24",
+    "@types/react-grid-layout": "1.3.2",
+    "@types/react-router-dom": "5.3.3",
+    "@types/react-virtualized-auto-sizer": "1.0.1",
+    "@types/uuid": "8.3.4",
+    "@typescript-eslint/eslint-plugin": "^4.33.0",
+    "@typescript-eslint/parser": "^4.33.0",
+    "esbuild": "^0.14.47",
+    "eslint": "^7.32.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-jsdoc": "^36.1.0",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.26.1",
+    "eslint-plugin-react-hooks": "^4.3.0",
+    "husky": "^8.0.3",
+    "jest": "29.7.0",
+    "jest-environment-jsdom": "29.7.0",
+    "jest-matcher-utils": "29.7.0",
+    "lodash": "4.17.21",
+    "prettier": "2.5.1",
+    "react-router-dom": "^5.2.0",
+    "react-select-event": "^5.5.1",
+    "rimraf": "^3.0.2",
+    "rollup": "2.79.1",
+    "rollup-plugin-dts": "^5.0.0",
+    "rollup-plugin-esbuild": "5.0.0",
+    "rollup-plugin-fork-ts-checker": "^0.0.6",
+    "rollup-plugin-node-externals": "^5.0.0",
+    "rollup-plugin-svg-import": "^1.6.0",
+    "rxjs": "7.8.1",
+    "ts-jest": "29.1.2",
+    "ts-node": "10.9.2",
+    "tsc-watch": "^4.5.0",
+    "tslib": "2.6.2",
+    "typescript": "5.4.3"
+  },
+  "lint-staged": {
+    "*.{js,ts,tsx}": [
+      "eslint --ext .js,.tsx,.ts --cache --fix",
+      "prettier --write"
+    ],
+    "*.{json,scss,md,mdx}": [
+      "prettier --write"
+    ]
+  }
+}