IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Chore: Update slate and related packages (#54566)

Browse Source 
* Chore: Update slate and related packages
This commit is contained in:
kay delaney
2022-09-06 15:23:48 +01:00
committed by GitHub
parent 9c6a6ca487
commit a70aba1384
34 changed files with 339 additions and 298 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
.betterer.results
View File

@@ -11,19 +11,19 @@ exports[`no enzyme tests`] = {
"packages/grafana-ui/src/components/Logs/LogRowContextProvider.test.tsx:3786619094": [ "packages/grafana-ui/src/components/Logs/LogRowContextProvider.test.tsx:3786619094": [
[0, 17, 13, "RegExp match", "2409514259"] [0, 17, 13, "RegExp match", "2409514259"]
], ],
"packages/grafana-ui/src/components/QueryField/QueryField.test.tsx:375894800": [ "packages/grafana-ui/src/components/QueryField/QueryField.test.tsx:2976628669": [
[0, 26, 13, "RegExp match", "2409514259"]
],
"packages/grafana-ui/src/slate-plugins/braces.test.tsx:823049948": [
[0, 19, 13, "RegExp match", "2409514259"] [0, 19, 13, "RegExp match", "2409514259"]
], ],
"packages/grafana-ui/src/slate-plugins/braces.test.tsx:4104231341": [ "packages/grafana-ui/src/slate-plugins/clear.test.tsx:3927593033": [
[0, 19, 13, "RegExp match", "2409514259"] [0, 19, 13, "RegExp match", "2409514259"]
], ],
"packages/grafana-ui/src/slate-plugins/clear.test.tsx:1085648664": [ "packages/grafana-ui/src/slate-plugins/runner.test.tsx:1123710822": [
[0, 19, 13, "RegExp match", "2409514259"] [0, 19, 13, "RegExp match", "2409514259"]
], ],
"packages/grafana-ui/src/slate-plugins/runner.test.tsx:446043290": [ "packages/grafana-ui/src/slate-plugins/suggestions.test.tsx:2682912140": [
[0, 19, 13, "RegExp match", "2409514259"]
],
"packages/grafana-ui/src/slate-plugins/suggestions.test.tsx:3654981205": [
[0, 18, 13, "RegExp match", "2409514259"] [0, 18, 13, "RegExp match", "2409514259"]
], ],
"packages/jaeger-ui-components/src/TracePageHeader/SpanGraph/Scrubber.test.js:4256741694": [ "packages/jaeger-ui-components/src/TracePageHeader/SpanGraph/Scrubber.test.js:4256741694": [
@@ -1296,8 +1296,7 @@ exports[`better eslint`] = {
[0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"], [0, 0, 0, "Do not use any type assertions.", "1"],
[0, 0, 0, "Do not use any type assertions.", "2"], [0, 0, 0, "Do not use any type assertions.", "2"],
[0, 0, 0, "Unexpected any. Specify a different type.", "3"], [0, 0, 0, "Unexpected any. Specify a different type.", "3"]
[0, 0, 0, "Do not use any type assertions.", "4"]
], ],
"packages/grafana-ui/src/components/DataLinks/SelectionReference.ts:5381": [ "packages/grafana-ui/src/components/DataLinks/SelectionReference.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"] [0, 0, 0, "Do not use any type assertions.", "0"]
@@ -1856,42 +1855,16 @@ exports[`better eslint`] = {
], ],
"packages/grafana-ui/src/slate-plugins/braces.ts:5381": [ "packages/grafana-ui/src/slate-plugins/braces.ts:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"], [0, 0, 0, "Do not use any type assertions.", "1"]
[0, 0, 0, "Do not use any type assertions.", "2"]
], ],
"packages/grafana-ui/src/slate-plugins/clear.test.tsx:5381": [ "packages/grafana-ui/src/slate-plugins/clear.test.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"], [0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Unexpected any. Specify a different type.", "1"], [0, 0, 0, "Unexpected any. Specify a different type.", "1"],
[0, 0, 0, "Unexpected any. Specify a different type.", "2"] [0, 0, 0, "Unexpected any. Specify a different type.", "2"]
], ],
"packages/grafana-ui/src/slate-plugins/clear.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
"packages/grafana-ui/src/slate-plugins/clipboard.ts:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"],
[0, 0, 0, "Unexpected any. Specify a different type.", "2"],
[0, 0, 0, "Do not use any type assertions.", "3"],
[0, 0, 0, "Unexpected any. Specify a different type.", "4"],
[0, 0, 0, "Do not use any type assertions.", "5"]
],
"packages/grafana-ui/src/slate-plugins/indentation.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
"packages/grafana-ui/src/slate-plugins/newline.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"]
],
"packages/grafana-ui/src/slate-plugins/runner.test.tsx:5381": [ "packages/grafana-ui/src/slate-plugins/runner.test.tsx:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"] [0, 0, 0, "Unexpected any. Specify a different type.", "0"]
], ],
"packages/grafana-ui/src/slate-plugins/runner.ts:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"]
],
"packages/grafana-ui/src/slate-plugins/selection_shortcuts.ts:5381": [
[0, 0, 0, "Unexpected any. Specify a different type.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"]
],
"packages/grafana-ui/src/slate-plugins/slate-prism/index.ts:5381": [ "packages/grafana-ui/src/slate-plugins/slate-prism/index.ts:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"], [0, 0, 0, "Do not use any type assertions.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"], [0, 0, 0, "Do not use any type assertions.", "1"],
@@ -1913,8 +1886,7 @@ exports[`better eslint`] = {
"packages/grafana-ui/src/slate-plugins/suggestions.tsx:5381": [ "packages/grafana-ui/src/slate-plugins/suggestions.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"], [0, 0, 0, "Do not use any type assertions.", "0"],
[0, 0, 0, "Do not use any type assertions.", "1"], [0, 0, 0, "Do not use any type assertions.", "1"],
[0, 0, 0, "Do not use any type assertions.", "2"], [0, 0, 0, "Unexpected any. Specify a different type.", "2"]
[0, 0, 0, "Unexpected any. Specify a different type.", "3"]
], ],
"packages/grafana-ui/src/themes/ThemeContext.tsx:5381": [ "packages/grafana-ui/src/themes/ThemeContext.tsx:5381": [
[0, 0, 0, "Do not use any type assertions.", "0"], [0, 0, 0, "Do not use any type assertions.", "0"],

4
.github/renovate.json5 vendored
View File

@@ -4,12 +4,10 @@
], ],
"enabledManagers": ["npm"], "enabledManagers": ["npm"],
"ignoreDeps": [ "ignoreDeps": [
"@grafana/slate-react", // should be updated when the `slate` package is updated
"@types/systemjs", "@types/systemjs",
"@types/d3-force", // we should bump this once we move to esm modules "@types/d3-force", // we should bump this once we move to esm modules
"@types/d3-interpolate", // we should bump this once we move to esm modules "@types/d3-interpolate", // we should bump this once we move to esm modules
"@types/d3-scale-chromatic", // we should bump this once we move to esm modules "@types/d3-scale-chromatic", // we should bump this once we move to esm modules
"@types/grafana__slate-react", // should be updated when the `slate` package is updated
"@types/react-icons", // jaeger-ui-components is being refactored to use @grafana/ui icons instead "@types/react-icons", // jaeger-ui-components is being refactored to use @grafana/ui icons instead
"commander", // we are planning to remove this, so no need to update it "commander", // we are planning to remove this, so no need to update it
"d3", "d3",
@@ -25,8 +23,6 @@
"react-icons", // jaeger-ui-components is being refactored to use @grafana/ui icons instead "react-icons", // jaeger-ui-components is being refactored to use @grafana/ui icons instead
"react-redux", // react-beautiful-dnd depends on react-redux 7.x, we need to update that one first "react-redux", // react-beautiful-dnd depends on react-redux 7.x, we need to update that one first
"react-router-dom", // we should bump this together with history "react-router-dom", // we should bump this together with history
"slate",
"slate-plain-serializer",
"systemjs", "systemjs",
"copy-webpack-plugin", // try to upgrade with newer yarn release. Not working with 3.1.1 "copy-webpack-plugin", // try to upgrade with newer yarn release. Not working with 3.1.1
"ts-loader", // we should remove ts-loader and use babel-loader instead "ts-loader", // we should remove ts-loader and use babel-loader instead

1
.gitignore vendored
View File

@@ -119,6 +119,7 @@ pkg/cmd/grafana-server/__debug_bin
/scripts/build/release_publisher/release_publisher /scripts/build/release_publisher/release_publisher
*.patch *.patch
!.yarn/patches/*.patch
# Ignoring frontend packages specifics # Ignoring frontend packages specifics
/packages/**/dist /packages/**/dist

79
.yarn/patches/slate-dev-environment-npm-0.2.5-9aeb7da7b5.patch Normal file
View File

File diff suppressed because one or more lines are too long

55
.yarnrc.yml
View File

@@ -3,40 +3,37 @@ enableTelemetry: false
nodeLinker: pnp nodeLinker: pnp
packageExtensions: packageExtensions:
"@grafana/slate-react@0.22.10-grafana": '@mdx-js/loader@1.6.22':
peerDependencies:
slate-react: ">=0.22.0"
"@mdx-js/loader@1.6.22":
peerDependencies: peerDependencies:
react: 17.0.1 react: 17.0.1
"@storybook/addon-docs@6.4.21": '@storybook/addon-docs@6.4.21':
peerDependencies: peerDependencies:
"@storybook/manager-webpack5": 6.4.21 '@storybook/manager-webpack5': 6.4.21
"@storybook/addon-essentials@6.4.21": '@storybook/addon-essentials@6.4.21':
peerDependencies: peerDependencies:
"@storybook/components": 6.4.21 '@storybook/components': 6.4.21
"@storybook/core-events": 6.4.21 '@storybook/core-events': 6.4.21
"@storybook/manager-webpack5": 6.4.21 '@storybook/manager-webpack5': 6.4.21
"@storybook/theming": 6.4.21 '@storybook/theming': 6.4.21
"@storybook/core-server@6.4.21": '@storybook/core-server@6.4.21':
peerDependencies: peerDependencies:
"@babel/core": ^7.0.0 '@babel/core': ^7.0.0
"@storybook/core@6.4.21": '@storybook/core@6.4.21':
peerDependencies: peerDependencies:
"@babel/core": ^7.0.0 '@babel/core': ^7.0.0
"@storybook/manager-webpack5": 6.4.21 '@storybook/manager-webpack5': 6.4.21
"@storybook/csf-tools@6.4.21": '@storybook/csf-tools@6.4.21':
peerDependencies: peerDependencies:
"@babel/core": ^7.0.0 '@babel/core': ^7.0.0
"@storybook/react@6.4.21": '@storybook/react@6.4.21':
peerDependencies: peerDependencies:
"@storybook/manager-webpack5": 6.4.21 '@storybook/manager-webpack5': 6.4.21
doctrine@3.0.0: doctrine@3.0.0:
dependencies: dependencies:
assert: 2.0.0 assert: 2.0.0
moveable@0.30.0: moveable@0.30.0:
dependencies: dependencies:
"@daybrush/utils": 1.7.0 '@daybrush/utils': 1.7.0
framework-utils: ^1.1.0 framework-utils: ^1.1.0
rc-time-picker@3.7.3: rc-time-picker@3.7.3:
peerDependencies: peerDependencies:
@@ -51,9 +48,9 @@ packageExtensions:
react-simple-compat: 1.2.2 react-simple-compat: 1.2.2
react-compat-moveable@0.18.0: react-compat-moveable@0.18.0:
dependencies: dependencies:
"@egjs/agent": ^2.2.1 '@egjs/agent': ^2.2.1
"@egjs/children-differ": ^1.0.1 '@egjs/children-differ': ^1.0.1
"@scena/matrix": 1.1.1 '@scena/matrix': 1.1.1
css-to-mat: ^1.0.3 css-to-mat: ^1.0.3
gesto: ^1.9.0 gesto: ^1.9.0
overlap-area: ^1.0.0 overlap-area: ^1.0.0
@@ -65,20 +62,20 @@ packageExtensions:
webpack: 4.41.5 webpack: 4.41.5
react-icons@2.2.7: react-icons@2.2.7:
peerDependencies: peerDependencies:
prop-types: "*" prop-types: '*'
react-resizable@3.0.4: react-resizable@3.0.4:
peerDependencies: peerDependencies:
react-dom: 17.0.1 react-dom: 17.0.1
"@npmcli/run-script@4.1.3": '@npmcli/run-script@4.1.3':
dependencies: dependencies:
which: ^2.0.2 which: ^2.0.2
plugins: plugins:
- path: .yarn/plugins/@yarnpkg/plugin-typescript.cjs - path: .yarn/plugins/@yarnpkg/plugin-typescript.cjs
spec: "@yarnpkg/plugin-typescript" spec: '@yarnpkg/plugin-typescript'
- path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
spec: "@yarnpkg/plugin-interactive-tools" spec: '@yarnpkg/plugin-interactive-tools'
- path: .yarn/plugins/@yarnpkg/plugin-outdated.cjs - path: .yarn/plugins/@yarnpkg/plugin-outdated.cjs
spec: "https://mskelton.dev/yarn-outdated/v2" spec: 'https://mskelton.dev/yarn-outdated/v2'
yarnPath: .yarn/releases/yarn-3.2.2.cjs yarnPath: .yarn/releases/yarn-3.2.2.cjs

15
package.json
View File

@@ -124,7 +124,6 @@
"@types/eslint": "8.4.5", "@types/eslint": "8.4.5",
"@types/file-saver": "2.0.5", "@types/file-saver": "2.0.5",
"@types/google.analytics": "^0.0.42", "@types/google.analytics": "^0.0.42",
"@types/grafana__slate-react": "npm:@types/slate-react@0.22.5",
"@types/history": "4.7.11", "@types/history": "4.7.11",
"@types/hoist-non-react-statics": "3.3.1", "@types/hoist-non-react-statics": "3.3.1",
"@types/jest": "28.1.6", "@types/jest": "28.1.6",
@@ -158,8 +157,9 @@
"@types/redux-mock-store": "1.0.3", "@types/redux-mock-store": "1.0.3",
"@types/reselect": "2.2.0", "@types/reselect": "2.2.0",
"@types/semver": "7.3.10", "@types/semver": "7.3.10",
"@types/slate": "0.47.2", "@types/slate": "0.47.9",
"@types/slate-plain-serializer": "0.7.2", "@types/slate-plain-serializer": "0.7.2",
"@types/slate-react": "0.22.9",
"@types/testing-library__jest-dom": "5.14.5", "@types/testing-library__jest-dom": "5.14.5",
"@types/testing-library__react-hooks": "^3.2.0", "@types/testing-library__react-hooks": "^3.2.0",
"@types/tinycolor2": "1.4.3", "@types/tinycolor2": "1.4.3",
@@ -257,7 +257,6 @@
"@grafana/lezer-logql": "0.0.18", "@grafana/lezer-logql": "0.0.18",
"@grafana/runtime": "workspace:*", "@grafana/runtime": "workspace:*",
"@grafana/schema": "workspace:*", "@grafana/schema": "workspace:*",
"@grafana/slate-react": "0.22.10-grafana",
"@grafana/ui": "workspace:*", "@grafana/ui": "workspace:*",
"@jaegertracing/jaeger-ui-components": "workspace:*", "@jaegertracing/jaeger-ui-components": "workspace:*",
"@kusto/monaco-kusto": "5.1.8", "@kusto/monaco-kusto": "5.1.8",
@@ -387,8 +386,9 @@
"sass": "link:./public/sass", "sass": "link:./public/sass",
"selecto": "1.19.1", "selecto": "1.19.1",
"semver": "7.3.7", "semver": "7.3.7",
"slate": "0.47.8", "slate": "0.47.9",
"slate-plain-serializer": "0.7.10", "slate-plain-serializer": "0.7.11",
"slate-react": "0.22.10",
"sql-formatter-plus": "^1.3.6", "sql-formatter-plus": "^1.3.6",
"symbol-observable": "4.0.0", "symbol-observable": "4.0.0",
"test": "link:./public/test", "test": "link:./public/test",
@@ -403,12 +403,13 @@
}, },
"resolutions": { "resolutions": {
"underscore": "1.13.4", "underscore": "1.13.4",
"@types/slate": "0.47.2", "@types/slate": "0.47.9",
"@rushstack/node-core-library": "3.49.0", "@rushstack/node-core-library": "3.49.0",
"@rushstack/rig-package": "0.3.13", "@rushstack/rig-package": "0.3.13",
"@rushstack/ts-command-line": "4.12.1", "@rushstack/ts-command-line": "4.12.1",
"@storybook/react/webpack": "5.74.0", "@storybook/react/webpack": "5.74.0",
"node-fetch": "2.6.7" "node-fetch": "2.6.7",
"slate-dev-environment@^0.2.2": "patch:slate-dev-environment@npm:0.2.5#.yarn/patches/slate-dev-environment-npm-0.2.5-9aeb7da7b5.patch"
}, },
"workspaces": { "workspaces": {
"packages": [ "packages": [

2
packages/grafana-toolkit/src/config/webpack.plugin.config.ts
View File

@@ -174,7 +174,7 @@ const getBaseWebpackConfig: WebpackConfigurationGetter = async (options) => {
'@emotion/css', '@emotion/css',
'prismjs', 'prismjs',
'slate-plain-serializer', 'slate-plain-serializer',
'@grafana/slate-react', 'slate-react',
'react', 'react',
'react-dom', 'react-dom',
'react-redux', 'react-redux',

10
packages/grafana-ui/package.json
View File

@@ -48,7 +48,6 @@
"@grafana/data": "9.2.0-pre", "@grafana/data": "9.2.0-pre",
"@grafana/e2e-selectors": "9.2.0-pre", "@grafana/e2e-selectors": "9.2.0-pre",
"@grafana/schema": "9.2.0-pre", "@grafana/schema": "9.2.0-pre",
"@grafana/slate-react": "0.22.10-grafana",
"@monaco-editor/react": "4.4.5", "@monaco-editor/react": "4.4.5",
"@popperjs/core": "2.11.5", "@popperjs/core": "2.11.5",
"@react-aria/button": "3.6.1", "@react-aria/button": "3.6.1",
@@ -97,8 +96,9 @@
"react-use": "17.4.0", "react-use": "17.4.0",
"react-window": "1.8.7", "react-window": "1.8.7",
"rxjs": "7.5.6", "rxjs": "7.5.6",
"slate": "0.47.8", "slate": "0.47.9",
"slate-plain-serializer": "0.7.10", "slate-plain-serializer": "0.7.11",
"slate-react": "0.22.10",
"tinycolor2": "1.4.2", "tinycolor2": "1.4.2",
"tslib": "2.4.0", "tslib": "2.4.0",
"uplot": "1.6.22", "uplot": "1.6.22",
@@ -135,7 +135,6 @@
"@types/d3": "7.4.0", "@types/d3": "7.4.0",
"@types/enzyme": "3.10.12", "@types/enzyme": "3.10.12",
"@types/enzyme-adapter-react-16": "1.0.6", "@types/enzyme-adapter-react-16": "1.0.6",
"@types/grafana__slate-react": "npm:@types/slate-react@0.22.5",
"@types/hoist-non-react-statics": "3.3.1", "@types/hoist-non-react-statics": "3.3.1",
"@types/is-hotkey": "0.1.7", "@types/is-hotkey": "0.1.7",
"@types/jest": "28.1.6", "@types/jest": "28.1.6",
@@ -155,8 +154,9 @@
"@types/react-test-renderer": "17.0.1", "@types/react-test-renderer": "17.0.1",
"@types/react-transition-group": "4.4.5", "@types/react-transition-group": "4.4.5",
"@types/react-window": "1.8.5", "@types/react-window": "1.8.5",
"@types/slate": "0.47.2", "@types/slate": "0.47.9",
"@types/slate-plain-serializer": "0.7.2", "@types/slate-plain-serializer": "0.7.2",
"@types/slate-react": "0.22.9",
"@types/testing-library__jest-dom": "5.14.5", "@types/testing-library__jest-dom": "5.14.5",
"@types/testing-library__react-hooks": "^3.2.0", "@types/testing-library__react-hooks": "^3.2.0",
"@types/tinycolor2": "1.4.3", "@types/tinycolor2": "1.4.3",

6
packages/grafana-ui/src/components/DataLinks/DataLinkInput.tsx
View File

@@ -5,9 +5,9 @@ import { Popper as ReactPopper } from 'react-popper';
import usePrevious from 'react-use/lib/usePrevious'; import usePrevious from 'react-use/lib/usePrevious';
import { Value } from 'slate'; import { Value } from 'slate';
import Plain from 'slate-plain-serializer'; import Plain from 'slate-plain-serializer';
import { Editor } from 'slate-react';
import { DataLinkBuiltInVars, GrafanaTheme2, VariableOrigin, VariableSuggestion } from '@grafana/data'; import { DataLinkBuiltInVars, GrafanaTheme2, VariableOrigin, VariableSuggestion } from '@grafana/data';
import { Editor } from '@grafana/slate-react';
import { makeValue } from '../../index'; import { makeValue } from '../../index';
import { SlatePrism } from '../../slate-plugins'; import { SlatePrism } from '../../slate-plugins';
@@ -95,7 +95,7 @@ export const DataLinkInput: React.FC<DataLinkInputProps> = memo(
// SelectionReference is used to position the variables suggestion relatively to current DOM selection // SelectionReference is used to position the variables suggestion relatively to current DOM selection
const selectionRef = useMemo(() => new SelectionReference(), []); const selectionRef = useMemo(() => new SelectionReference(), []);
const onKeyDown = React.useCallback((event: KeyboardEvent, next: () => any) => { const onKeyDown = React.useCallback((event: React.KeyboardEvent, next: () => any) => {
if (!stateRef.current.showingSuggestions) { if (!stateRef.current.showingSuggestions) {
if (event.key === '=' || event.key === '$' || (event.keyCode === 32 && event.ctrlKey)) { if (event.key === '=' || event.key === '$' || (event.keyCode === 32 && event.ctrlKey)) {
return setShowingSuggestions(true); return setShowingSuggestions(true);
@@ -208,7 +208,7 @@ export const DataLinkInput: React.FC<DataLinkInputProps> = memo(
placeholder={placeholder} placeholder={placeholder}
value={stateRef.current.linkUrl} value={stateRef.current.linkUrl}
onChange={onUrlChange} onChange={onUrlChange}
onKeyDown={(event, _editor, next) => onKeyDown(event as KeyboardEvent, next)} onKeyDown={(event, _editor, next) => onKeyDown(event, next)}
plugins={plugins} plugins={plugins}
className={cx( className={cx(
styles.editor, styles.editor,

14
packages/grafana-ui/src/components/QueryField/QueryField.test.tsx
View File

@@ -1,6 +1,6 @@
import { shallow } from 'enzyme'; import { mount, shallow } from 'enzyme';
import React from 'react'; import React from 'react';
import { Editor } from 'slate'; import { Editor } from 'slate-react';
import { createTheme } from '@grafana/data'; import { createTheme } from '@grafana/data';
@@ -30,7 +30,7 @@ describe('<QueryField />', () => {
it('should execute query on blur', () => { it('should execute query on blur', () => {
const onRun = jest.fn(); const onRun = jest.fn();
const wrapper = shallow( const wrapper = mount(
<UnThemedQueryField <UnThemedQueryField
theme={createTheme()} theme={createTheme()}
query="my query" query="my query"
@@ -40,8 +40,9 @@ describe('<QueryField />', () => {
/> />
); );
const field = wrapper.instance() as UnThemedQueryField; const field = wrapper.instance() as UnThemedQueryField;
const ed = wrapper.find(Editor).instance() as Editor;
expect(onRun.mock.calls.length).toBe(0); expect(onRun.mock.calls.length).toBe(0);
field.handleBlur(new Event('bogus'), new Editor({}), () => {}); field.handleBlur(undefined, ed, () => {});
expect(onRun.mock.calls.length).toBe(1); expect(onRun.mock.calls.length).toBe(1);
}); });
@@ -65,7 +66,7 @@ describe('<QueryField />', () => {
it('should run custom on blur, but not necessarily execute query', () => { it('should run custom on blur, but not necessarily execute query', () => {
const onBlur = jest.fn(); const onBlur = jest.fn();
const onRun = jest.fn(); const onRun = jest.fn();
const wrapper = shallow( const wrapper = mount(
<UnThemedQueryField <UnThemedQueryField
theme={createTheme()} theme={createTheme()}
query="my query" query="my query"
@@ -76,9 +77,10 @@ describe('<QueryField />', () => {
/> />
); );
const field = wrapper.instance() as UnThemedQueryField; const field = wrapper.instance() as UnThemedQueryField;
const ed = wrapper.find(Editor).instance() as Editor;
expect(onBlur.mock.calls.length).toBe(0); expect(onBlur.mock.calls.length).toBe(0);
expect(onRun.mock.calls.length).toBe(0); expect(onRun.mock.calls.length).toBe(0);
field.handleBlur(new Event('bogus'), new Editor({}), () => {}); field.handleBlur(undefined, ed, () => {});
expect(onBlur.mock.calls.length).toBe(1); expect(onBlur.mock.calls.length).toBe(1);
expect(onRun.mock.calls.length).toBe(0); expect(onRun.mock.calls.length).toBe(0);
}); });

10
packages/grafana-ui/src/components/QueryField/QueryField.tsx
View File

@@ -2,12 +2,12 @@ import { css, cx } from '@emotion/css';
import classnames from 'classnames'; import classnames from 'classnames';
import { debounce } from 'lodash'; import { debounce } from 'lodash';
import React, { Context, PureComponent } from 'react'; import React, { Context, PureComponent } from 'react';
import { Value, Editor as CoreEditor } from 'slate'; import { Value } from 'slate';
import Plain from 'slate-plain-serializer'; import Plain from 'slate-plain-serializer';
import { Editor, Plugin } from 'slate-react';
import { GrafanaTheme2 } from '@grafana/data'; import { GrafanaTheme2 } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors'; import { selectors } from '@grafana/e2e-selectors';
import { Editor, Plugin } from '@grafana/slate-react';
import { import {
makeValue, makeValue,
@@ -42,7 +42,7 @@ export interface QueryFieldProps extends Themeable2 {
onBlur?: () => void; onBlur?: () => void;
onChange?: (value: string) => void; onChange?: (value: string) => void;
onRichValueChange?: (value: Value) => void; onRichValueChange?: (value: Value) => void;
onClick?: (event: Event, editor: CoreEditor, next: () => any) => any; onClick?: (event: Event | React.MouseEvent, editor: Editor, next: () => any) => any;
onTypeahead?: (typeahead: TypeaheadInput) => Promise<TypeaheadOutput>; onTypeahead?: (typeahead: TypeaheadInput) => Promise<TypeaheadOutput>;
onWillApplySuggestion?: (suggestion: string, state: SuggestionsState) => string; onWillApplySuggestion?: (suggestion: string, state: SuggestionsState) => string;
placeholder?: string; placeholder?: string;
@@ -67,7 +67,7 @@ export interface QueryFieldState {
* Implement props.onTypeahead to use suggestions, see PromQueryField.tsx as an example. * Implement props.onTypeahead to use suggestions, see PromQueryField.tsx as an example.
*/ */
export class UnThemedQueryField extends PureComponent<QueryFieldProps, QueryFieldState> { export class UnThemedQueryField extends PureComponent<QueryFieldProps, QueryFieldState> {
plugins: Plugin[]; plugins: Array<Plugin<Editor>>;
runOnChangeDebounced: Function; runOnChangeDebounced: Function;
lastExecutedValue: Value | null = null; lastExecutedValue: Value | null = null;
mounted = false; mounted = false;
@@ -185,7 +185,7 @@ export class UnThemedQueryField extends PureComponent<QueryFieldProps, QueryFiel
/** /**
* We need to handle blur events here mainly because of dashboard panels which expect to have query executed on blur. * We need to handle blur events here mainly because of dashboard panels which expect to have query executed on blur.
*/ */
handleBlur = (event: Event, editor: CoreEditor, next: Function) => { handleBlur = (_: React.FocusEvent | undefined, editor: Editor, next: Function) => {
const { onBlur } = this.props; const { onBlur } = this.props;
if (onBlur) { if (onBlur) {

20
packages/grafana-ui/src/slate-plugins/braces.test.tsx
View File

@@ -1,8 +1,7 @@
import { shallow } from 'enzyme'; import { shallow } from 'enzyme';
import React from 'react'; import React from 'react';
import Plain from 'slate-plain-serializer'; import Plain from 'slate-plain-serializer';
import { Editor } from 'slate-react';
import { Editor } from '@grafana/slate-react';
import { BracesPlugin } from './braces'; import { BracesPlugin } from './braces';
@@ -14,7 +13,7 @@ describe('braces', () => {
const value = Plain.deserialize(''); const value = Plain.deserialize('');
const editor = shallow<Editor>(<Editor value={value} />); const editor = shallow<Editor>(<Editor value={value} />);
const event = new window.KeyboardEvent('keydown', { key: '(' }); const event = new window.KeyboardEvent('keydown', { key: '(' });
expect(handler(event as Event, editor.instance() as any, nextMock)).toBeTruthy(); expect(handler(event as any, editor.instance(), nextMock)).toBeTruthy();
expect(Plain.serialize(editor.instance().value)).toEqual('()'); expect(Plain.serialize(editor.instance().value)).toEqual('()');
}); });
@@ -22,7 +21,8 @@ describe('braces', () => {
const value = Plain.deserialize('time()'); const value = Plain.deserialize('time()');
const editor = shallow<Editor>(<Editor value={value} />); const editor = shallow<Editor>(<Editor value={value} />);
const event = new window.KeyboardEvent('keydown', { key: 'Backspace' }); const event = new window.KeyboardEvent('keydown', { key: 'Backspace' });
handler(event as Event, editor.instance().moveForward(5) as any, nextMock); editor.instance().moveForward(5);
handler(event as any, editor.instance(), nextMock);
expect(Plain.serialize(editor.instance().value)).toEqual('time'); expect(Plain.serialize(editor.instance().value)).toEqual('time');
}); });
@@ -30,7 +30,8 @@ describe('braces', () => {
const value = Plain.deserialize('time(value)'); const value = Plain.deserialize('time(value)');
const editor = shallow<Editor>(<Editor value={value} />); const editor = shallow<Editor>(<Editor value={value} />);
const event = new window.KeyboardEvent('keydown', { key: 'Backspace' }); const event = new window.KeyboardEvent('keydown', { key: 'Backspace' });
const handled = handler(event as Event, editor.instance().moveForward(5) as any, nextMock); editor.instance().moveForward(5);
const handled = handler(event as any, editor.instance(), nextMock);
expect(handled).toBeFalsy(); expect(handled).toBeFalsy();
}); });
@@ -38,9 +39,9 @@ describe('braces', () => {
const value = Plain.deserialize(''); const value = Plain.deserialize('');
const editor = shallow<Editor>(<Editor value={value} />); const editor = shallow<Editor>(<Editor value={value} />);
const opening = new window.KeyboardEvent('keydown', { key: '(' }); const opening = new window.KeyboardEvent('keydown', { key: '(' });
expect(handler(opening as Event, editor.instance() as any, nextMock)).toBeTruthy(); expect(handler(opening as any, editor.instance(), nextMock)).toBeTruthy();
const closing = new window.KeyboardEvent('keydown', { key: ')' }); const closing = new window.KeyboardEvent('keydown', { key: ')' });
expect(handler(closing as Event, editor.instance() as any, nextMock)).toBeTruthy(); expect(handler(closing as any, editor.instance(), nextMock)).toBeTruthy();
expect(Plain.serialize(editor.instance().value)).toEqual('()'); expect(Plain.serialize(editor.instance().value)).toEqual('()');
}); });
@@ -48,9 +49,10 @@ describe('braces', () => {
const value = Plain.deserialize(''); const value = Plain.deserialize('');
const editor = shallow<Editor>(<Editor value={value} />); const editor = shallow<Editor>(<Editor value={value} />);
const event1 = new window.KeyboardEvent('keydown', { key: ')' }); const event1 = new window.KeyboardEvent('keydown', { key: ')' });
expect(handler(event1 as Event, editor.instance() as any, nextMock)).toBeFalsy(); expect(handler(event1 as any, editor.instance(), nextMock)).toBeFalsy();
const event2 = new window.KeyboardEvent('keydown', { key: ')' }); const event2 = new window.KeyboardEvent('keydown', { key: ')' });
expect(handler(event2 as Event, editor.instance().moveBackward(1) as any, nextMock)).toBeFalsy(); editor.instance().moveBackward(1);
expect(handler(event2 as any, editor.instance(), nextMock)).toBeFalsy();
expect(Plain.serialize(editor.instance().value)).toEqual('))'); expect(Plain.serialize(editor.instance().value)).toEqual('))');
}); });
}); });

28
packages/grafana-ui/src/slate-plugins/braces.ts
View File

@@ -1,8 +1,7 @@
import { Editor as CoreEditor, Annotation } from 'slate'; import { Annotation } from 'slate';
import { Plugin } from 'slate-react';
import { v4 as uuidv4 } from 'uuid'; import { v4 as uuidv4 } from 'uuid';
import { Plugin } from '@grafana/slate-react';
const BRACES: any = { const BRACES: any = {
'[': ']', '[': ']',
'{': '}', '{': '}',
@@ -13,11 +12,10 @@ const MATCH_MARK = 'brace_match';
export function BracesPlugin(): Plugin { export function BracesPlugin(): Plugin {
return { return {
onKeyDown(event: Event, editor: CoreEditor, next: Function) { onKeyDown(event, editor, next) {
const keyEvent = event as KeyboardEvent;
const { value } = editor; const { value } = editor;
switch (keyEvent.key) { switch (event.key) {
case '(': case '(':
case '{': case '{':
case '[': { case '[': {
@@ -30,10 +28,10 @@ export function BracesPlugin(): Plugin {
// If text is selected, wrap selected text in parens // If text is selected, wrap selected text in parens
if (value.selection.isExpanded) { if (value.selection.isExpanded) {
keyEvent.preventDefault(); event.preventDefault();
editor editor
.insertTextByKey(startKey, startOffset, keyEvent.key) .insertTextByKey(startKey, startOffset, event.key)
.insertTextByKey(endKey, endOffset + 1, BRACES[keyEvent.key]) .insertTextByKey(endKey, endOffset + 1, BRACES[event.key])
.moveEndBackward(1); .moveEndBackward(1);
return true; return true;
} else if ( } else if (
@@ -42,8 +40,8 @@ export function BracesPlugin(): Plugin {
text[focusOffset] === ' ' || text[focusOffset] === ' ' ||
Object.values(BRACES).includes(text[focusOffset]) Object.values(BRACES).includes(text[focusOffset])
) { ) {
keyEvent.preventDefault(); event.preventDefault();
const complement = BRACES[keyEvent.key]; const complement = BRACES[event.key];
const matchAnnotation = { const matchAnnotation = {
key: `${MATCH_MARK}-${uuidv4()}`, key: `${MATCH_MARK}-${uuidv4()}`,
type: `${MATCH_MARK}-${complement}`, type: `${MATCH_MARK}-${complement}`,
@@ -59,7 +57,7 @@ export function BracesPlugin(): Plugin {
}, },
object: 'annotation', object: 'annotation',
} as Annotation; } as Annotation;
editor.insertText(keyEvent.key).insertText(complement).addAnnotation(matchAnnotation).moveBackward(1); editor.insertText(event.key).insertText(complement).addAnnotation(matchAnnotation).moveBackward(1);
return true; return true;
} }
@@ -73,13 +71,13 @@ export function BracesPlugin(): Plugin {
const offset = value.selection.anchor.offset; const offset = value.selection.anchor.offset;
const nextChar = text[offset]; const nextChar = text[offset];
// Handle closing brace when it's already the next character // Handle closing brace when it's already the next character
const complement = keyEvent.key; const complement = event.key;
const annotationType = `${MATCH_MARK}-${complement}`; const annotationType = `${MATCH_MARK}-${complement}`;
const annotation = value.annotations.find( const annotation = value.annotations.find(
(a) => a?.type === annotationType && a.anchor.key === value.anchorText.key (a) => a?.type === annotationType && a.anchor.key === value.anchorText.key
); );
if (annotation && nextChar === complement && !value.selection.isExpanded) { if (annotation && nextChar === complement && !value.selection.isExpanded) {
keyEvent.preventDefault(); event.preventDefault();
editor.moveFocusForward(1).removeAnnotation(annotation).moveAnchorForward(1); editor.moveFocusForward(1).removeAnnotation(annotation).moveAnchorForward(1);
return true; return true;
} }
@@ -92,7 +90,7 @@ export function BracesPlugin(): Plugin {
const previousChar = text[offset - 1]; const previousChar = text[offset - 1];
const nextChar = text[offset]; const nextChar = text[offset];
if (BRACES[previousChar] && BRACES[previousChar] === nextChar) { if (BRACES[previousChar] && BRACES[previousChar] === nextChar) {
keyEvent.preventDefault(); event.preventDefault();
// Remove closing brace if directly following // Remove closing brace if directly following
editor.deleteBackward(1).deleteForward(1).focus(); editor.deleteBackward(1).deleteForward(1).focus();
return true; return true;

10
packages/grafana-ui/src/slate-plugins/clear.test.tsx
View File

@@ -1,8 +1,7 @@
import { shallow } from 'enzyme'; import { shallow } from 'enzyme';
import React from 'react'; import React from 'react';
import Plain from 'slate-plain-serializer'; import Plain from 'slate-plain-serializer';
import { Editor } from 'slate-react';
import { Editor } from '@grafana/slate-react';
import { ClearPlugin } from './clear'; import { ClearPlugin } from './clear';
@@ -16,7 +15,7 @@ describe('clear', () => {
key: 'k', key: 'k',
ctrlKey: true, ctrlKey: true,
}); });
handler(event as Event, editor.instance() as any, () => {}); handler(event as any, editor.instance(), () => {});
expect(Plain.serialize(editor.instance().value)).toEqual(''); expect(Plain.serialize(editor.instance().value)).toEqual('');
}); });
@@ -27,7 +26,7 @@ describe('clear', () => {
key: 'k', key: 'k',
ctrlKey: true, ctrlKey: true,
}); });
handler(event as Event, editor.instance() as any, () => {}); handler(event as any, editor.instance(), () => {});
expect(Plain.serialize(editor.instance().value)).toEqual(''); expect(Plain.serialize(editor.instance().value)).toEqual('');
}); });
@@ -38,7 +37,8 @@ describe('clear', () => {
key: 'k', key: 'k',
ctrlKey: true, ctrlKey: true,
}); });
handler(event as Event, editor.instance().moveForward(4) as any, () => {}); editor.instance().moveForward(4);
handler(event as any, editor.instance(), () => {});
expect(Plain.serialize(editor.instance().value)).toEqual('foo '); expect(Plain.serialize(editor.instance().value)).toEqual('foo ');
}); });
}); });

11
packages/grafana-ui/src/slate-plugins/clear.ts
View File

@@ -1,20 +1,17 @@
import { Editor as CoreEditor } from 'slate'; import { Plugin } from 'slate-react';
import { Plugin } from '@grafana/slate-react';
// Clears the rest of the line after the caret // Clears the rest of the line after the caret
export function ClearPlugin(): Plugin { export function ClearPlugin(): Plugin {
return { return {
onKeyDown(event: Event, editor: CoreEditor, next: Function) { onKeyDown(event, editor, next) {
const keyEvent = event as KeyboardEvent;
const value = editor.value; const value = editor.value;
if (value.selection.isExpanded) { if (value.selection.isExpanded) {
return next(); return next();
} }
if (keyEvent.key === 'k' && keyEvent.ctrlKey) { if (event.key === 'k' && event.ctrlKey) {
keyEvent.preventDefault(); event.preventDefault();
const text = value.anchorText.text; const text = value.anchorText.text;
const offset = value.selection.anchor.offset; const offset = value.selection.anchor.offset;
const length = text.length; const length = text.length;

27
packages/grafana-ui/src/slate-plugins/clipboard.ts
View File

@@ -1,6 +1,4 @@
import { Editor as CoreEditor } from 'slate'; import { Plugin } from 'slate-react';
import { Plugin } from '@grafana/slate-react';
const getCopiedText = (textBlocks: string[], startOffset: number, endOffset: number) => { const getCopiedText = (textBlocks: string[], startOffset: number, endOffset: number) => {
if (!textBlocks.length) { if (!textBlocks.length) {
@@ -18,9 +16,8 @@ const removeBom = (str: string | undefined): string | undefined => {
export function ClipboardPlugin(): Plugin { export function ClipboardPlugin(): Plugin {
const clipboardPlugin: Plugin = { const clipboardPlugin: Plugin = {
onCopy(event: Event, editor: CoreEditor, next: () => any) { onCopy(event, editor, next) {
const clipEvent = event as ClipboardEvent; event.preventDefault();
clipEvent.preventDefault();
const { document, selection } = editor.value; const { document, selection } = editor.value;
const { const {
@@ -33,18 +30,17 @@ export function ClipboardPlugin(): Plugin {
.map((block) => block.text); .map((block) => block.text);
const copiedText = removeBom(getCopiedText(selectedBlocks, startOffset, endOffset)); const copiedText = removeBom(getCopiedText(selectedBlocks, startOffset, endOffset));
if (copiedText && clipEvent.clipboardData) { if (copiedText && event.clipboardData) {
clipEvent.clipboardData.setData('Text', copiedText); event.clipboardData.setData('Text', copiedText);
} }
return true; return true;
}, },
onPaste(event: Event, editor: CoreEditor, next: () => any) { onPaste(event, editor, next) {
const clipEvent = event as ClipboardEvent; event.preventDefault();
clipEvent.preventDefault(); if (event.clipboardData) {
if (clipEvent.clipboardData) { const pastedValue = removeBom(event.clipboardData.getData('Text'));
const pastedValue = removeBom(clipEvent.clipboardData.getData('Text'));
const lines = pastedValue?.split('\n'); const lines = pastedValue?.split('\n');
if (lines && lines.length) { if (lines && lines.length) {
@@ -61,9 +57,8 @@ export function ClipboardPlugin(): Plugin {
return { return {
...clipboardPlugin, ...clipboardPlugin,
onCut(event: Event, editor: CoreEditor, next: () => any) { onCut(event, editor, next) {
const clipEvent = event as ClipboardEvent; clipboardPlugin.onCopy!(event, editor, next);
clipboardPlugin.onCopy!(clipEvent, editor, next);
editor.deleteAtRange(editor.value.selection); editor.deleteAtRange(editor.value.selection);
return true; return true;

27
packages/grafana-ui/src/slate-plugins/indentation.ts
View File

@@ -1,7 +1,7 @@
import { isKeyHotkey } from 'is-hotkey'; import { isKeyHotkey } from 'is-hotkey';
import { RangeJSON, Range as SlateRange, Editor as CoreEditor } from 'slate'; import React from 'react';
import { RangeJSON, Range as SlateRange } from 'slate';
import { Plugin } from '@grafana/slate-react'; import { Editor, Plugin } from 'slate-react';
const isIndentLeftHotkey = isKeyHotkey('mod+['); const isIndentLeftHotkey = isKeyHotkey('mod+[');
const isShiftTabHotkey = isKeyHotkey('shift+tab'); const isShiftTabHotkey = isKeyHotkey('shift+tab');
@@ -9,7 +9,7 @@ const isIndentRightHotkey = isKeyHotkey('mod+]');
const SLATE_TAB = ' '; const SLATE_TAB = ' ';
const handleTabKey = (event: KeyboardEvent, editor: CoreEditor, next: Function): void => { const handleTabKey = (event: React.KeyboardEvent<Element>, editor: Editor, next: Function): void => {
const { const {
startBlock, startBlock,
endBlock, endBlock,
@@ -31,7 +31,7 @@ const handleTabKey = (event: KeyboardEvent, editor: CoreEditor, next: Function):
} }
}; };
const handleIndent = (editor: CoreEditor, indentDirection: 'left' | 'right') => { const handleIndent = (editor: Editor, indentDirection: 'left' | 'right') => {
const curSelection = editor.value.selection; const curSelection = editor.value.selection;
const selectedBlocks = editor.value.document.getLeafBlocksAtRange(curSelection).toArray(); const selectedBlocks = editor.value.document.getLeafBlocksAtRange(curSelection).toArray();
@@ -74,17 +74,16 @@ const handleIndent = (editor: CoreEditor, indentDirection: 'left' | 'right') =>
// Clears the rest of the line after the caret // Clears the rest of the line after the caret
export function IndentationPlugin(): Plugin { export function IndentationPlugin(): Plugin {
return { return {
onKeyDown(event: Event, editor: CoreEditor, next: Function) { onKeyDown(event, editor, next) {
const keyEvent = event as KeyboardEvent; if (isIndentLeftHotkey(event) || isShiftTabHotkey(event)) {
if (isIndentLeftHotkey(keyEvent) || isShiftTabHotkey(keyEvent)) { event.preventDefault();
keyEvent.preventDefault();
handleIndent(editor, 'left'); handleIndent(editor, 'left');
} else if (isIndentRightHotkey(keyEvent)) { } else if (isIndentRightHotkey(event)) {
keyEvent.preventDefault(); event.preventDefault();
handleIndent(editor, 'right'); handleIndent(editor, 'right');
} else if (keyEvent.key === 'Tab') { } else if (event.key === 'Tab') {
keyEvent.preventDefault(); event.preventDefault();
handleTabKey(keyEvent, editor, next); handleTabKey(event, editor, next);
} else { } else {
return next(); return next();
} }

11
packages/grafana-ui/src/slate-plugins/newline.ts
View File

@@ -1,6 +1,4 @@
import { Editor as CoreEditor } from 'slate'; import { Plugin } from 'slate-react';
import { Plugin } from '@grafana/slate-react';
function getIndent(text: string) { function getIndent(text: string) {
let offset = text.length - text.trimLeft().length; let offset = text.length - text.trimLeft().length;
@@ -16,16 +14,15 @@ function getIndent(text: string) {
export function NewlinePlugin(): Plugin { export function NewlinePlugin(): Plugin {
return { return {
onKeyDown(event: Event, editor: CoreEditor, next: Function) { onKeyDown(event, editor, next) {
const keyEvent = event as KeyboardEvent;
const value = editor.value; const value = editor.value;
if (value.selection.isExpanded) { if (value.selection.isExpanded) {
return next(); return next();
} }
if (keyEvent.key === 'Enter') { if (event.key === 'Enter') {
keyEvent.preventDefault(); event.preventDefault();
const { startBlock } = value; const { startBlock } = value;
const currentLineText = startBlock.text; const currentLineText = startBlock.text;

12
packages/grafana-ui/src/slate-plugins/runner.test.tsx
View File

@@ -1,8 +1,7 @@
import { shallow } from 'enzyme'; import { shallow } from 'enzyme';
import React from 'react'; import React from 'react';
import Plain from 'slate-plain-serializer'; import Plain from 'slate-plain-serializer';
import { Editor } from 'slate-react';
import { Editor } from '@grafana/slate-react';
import { RunnerPlugin } from './runner'; import { RunnerPlugin } from './runner';
@@ -12,10 +11,13 @@ describe('runner', () => {
it('should execute query when enter with shift is pressed', () => { it('should execute query when enter with shift is pressed', () => {
const value = Plain.deserialize(''); const value = Plain.deserialize('');
const editor = shallow<Editor>(<Editor value={value} />); const editor = shallow(<Editor value={value} />);
handler( handler(
{ key: 'Enter', shiftKey: true, preventDefault: () => {} } as KeyboardEvent, new window.KeyboardEvent('keydown', {
editor.instance() as any, key: 'Enter',
shiftKey: true,
}) as any,
editor.instance() as Editor,
() => {} () => {}
); );
expect(mockHandler).toBeCalled(); expect(mockHandler).toBeCalled();

17
packages/grafana-ui/src/slate-plugins/runner.ts
View File

@@ -1,17 +1,14 @@
import { Editor as CoreEditor } from 'slate'; import React from 'react';
import { Plugin } from 'slate-react';
import { Plugin } from '@grafana/slate-react'; export function RunnerPlugin({ handler }: { handler?: (e: React.KeyboardEvent) => void }): Plugin {
export function RunnerPlugin({ handler }: any): Plugin {
return { return {
onKeyDown(event: Event, editor: CoreEditor, next: Function) { onKeyDown(event, editor, next) {
const keyEvent = event as KeyboardEvent;
// Handle enter // Handle enter
if (handler && keyEvent.key === 'Enter' && (keyEvent.shiftKey || keyEvent.ctrlKey)) { if (handler && event.key === 'Enter' && (event.shiftKey || event.ctrlKey)) {
// Submit on Enter // Submit on Enter
keyEvent.preventDefault(); event.preventDefault();
handler(keyEvent); handler(event);
return editor; return editor;
} }

11
packages/grafana-ui/src/slate-plugins/selection_shortcuts.ts
View File

@@ -1,17 +1,14 @@
import { isKeyHotkey } from 'is-hotkey'; import { isKeyHotkey } from 'is-hotkey';
import { Editor as CoreEditor } from 'slate'; import { Plugin } from 'slate-react';
import { Plugin } from '@grafana/slate-react';
const isSelectLineHotkey = isKeyHotkey('mod+l'); const isSelectLineHotkey = isKeyHotkey('mod+l');
// Clears the rest of the line after the caret // Clears the rest of the line after the caret
export function SelectionShortcutsPlugin(): Plugin { export function SelectionShortcutsPlugin(): Plugin {
return { return {
onKeyDown(event: Event, editor: CoreEditor, next: () => any) { onKeyDown(event, editor, next) {
const keyEvent = event as KeyboardEvent; if (isSelectLineHotkey(event)) {
if (isSelectLineHotkey(keyEvent)) { event.preventDefault();
keyEvent.preventDefault();
const { focusBlock, document } = editor.value; const { focusBlock, document } = editor.value;
editor.moveAnchorToStartOfBlock(); editor.moveAnchorToStartOfBlock();

3
packages/grafana-ui/src/slate-plugins/slate-prism/index.ts
View File

@@ -1,7 +1,6 @@
import Prism, { LanguageMap } from 'prismjs'; import Prism, { LanguageMap } from 'prismjs';
import { Block, Text, Decoration } from 'slate'; import { Block, Text, Decoration } from 'slate';
import { Plugin } from 'slate-react';
import { Plugin } from '@grafana/slate-react';
import TOKEN_MARK from './TOKEN_MARK'; import TOKEN_MARK from './TOKEN_MARK';
import Options, { OptionsFormat } from './options'; import Options, { OptionsFormat } from './options';

3
packages/grafana-ui/src/slate-plugins/slate-prism/options.tsx
View File

@@ -1,8 +1,7 @@
import { Record } from 'immutable'; import { Record } from 'immutable';
import React from 'react'; import React from 'react';
import { Mark, Node, Decoration } from 'slate'; import { Mark, Node, Decoration } from 'slate';
import { Editor } from 'slate-react';
import { Editor } from '@grafana/slate-react';
import TOKEN_MARK from './TOKEN_MARK'; import TOKEN_MARK from './TOKEN_MARK';

3
packages/grafana-ui/src/slate-plugins/suggestions.test.tsx
View File

@@ -1,7 +1,6 @@
import { render } from 'enzyme'; import { render } from 'enzyme';
import _ from 'lodash'; // eslint-disable-line lodash/import-scope import _ from 'lodash'; // eslint-disable-line lodash/import-scope
import { Plugin as SlatePlugin } from 'slate-react';
import { Plugin as SlatePlugin } from '@grafana/slate-react';
import { CompletionItemGroup, SuggestionsState } from '../types'; import { CompletionItemGroup, SuggestionsState } from '../types';
import { SearchFunctionType } from '../utils'; import { SearchFunctionType } from '../utils';

42
packages/grafana-ui/src/slate-plugins/suggestions.tsx
View File

@@ -1,8 +1,6 @@
import { debounce, sortBy } from 'lodash'; import { debounce, sortBy } from 'lodash';
import React from 'react'; import React from 'react';
import { Editor as CoreEditor } from 'slate'; import { Editor, Plugin as SlatePlugin } from 'slate-react';
import { Plugin as SlatePlugin } from '@grafana/slate-react';
import { Typeahead } from '../components/Typeahead/Typeahead'; import { Typeahead } from '../components/Typeahead/Typeahead';
import { CompletionItem, SuggestionsState, TypeaheadInput, TypeaheadOutput } from '../types'; import { CompletionItem, SuggestionsState, TypeaheadInput, TypeaheadOutput } from '../types';
@@ -15,8 +13,8 @@ export const TYPEAHEAD_DEBOUNCE = 250;
// Commands added to the editor by this plugin. // Commands added to the editor by this plugin.
interface SuggestionsPluginCommands { interface SuggestionsPluginCommands {
selectSuggestion: (suggestion: CompletionItem) => CoreEditor; selectSuggestion: (suggestion: CompletionItem) => Editor;
applyTypeahead: (suggestion: CompletionItem) => CoreEditor; applyTypeahead: (suggestion: CompletionItem) => Editor;
} }
export function SuggestionsPlugin({ export function SuggestionsPlugin({
@@ -65,16 +63,15 @@ export function SuggestionsPlugin({
return next(); return next();
}, },
onKeyDown: (event: Event, editor, next) => { onKeyDown: (event, editor, next) => {
const keyEvent = event as KeyboardEvent;
const currentSuggestions = state.groupedItems; const currentSuggestions = state.groupedItems;
const hasSuggestions = currentSuggestions.length; const hasSuggestions = currentSuggestions.length;
switch (keyEvent.key) { switch (event.key) {
case 'Escape': { case 'Escape': {
if (hasSuggestions) { if (hasSuggestions) {
keyEvent.preventDefault(); event.preventDefault();
state = { state = {
...state, ...state,
@@ -91,16 +88,16 @@ export function SuggestionsPlugin({
case 'ArrowDown': case 'ArrowDown':
case 'ArrowUp': case 'ArrowUp':
if (hasSuggestions) { if (hasSuggestions) {
keyEvent.preventDefault(); event.preventDefault();
typeaheadRef.moveMenuIndex(keyEvent.key === 'ArrowDown' ? 1 : -1); typeaheadRef.moveMenuIndex(event.key === 'ArrowDown' ? 1 : -1);
return; return;
} }
break; break;
case 'Enter': { case 'Enter': {
if (!(keyEvent.shiftKey || keyEvent.ctrlKey) && hasSuggestions) { if (!(event.shiftKey || event.ctrlKey) && hasSuggestions) {
keyEvent.preventDefault(); event.preventDefault();
return typeaheadRef.insertSuggestion(); return typeaheadRef.insertSuggestion();
} }
@@ -109,7 +106,7 @@ export function SuggestionsPlugin({
case 'Tab': { case 'Tab': {
if (hasSuggestions) { if (hasSuggestions) {
keyEvent.preventDefault(); event.preventDefault();
return typeaheadRef.insertSuggestion(); return typeaheadRef.insertSuggestion();
} }
@@ -118,7 +115,7 @@ export function SuggestionsPlugin({
default: { default: {
// Don't react on meta keys // Don't react on meta keys
if (keyEvent.key.length === 1) { if (event.key.length === 1) {
handleTypeaheadDebounced(editor, setState, onTypeahead, cleanText); handleTypeaheadDebounced(editor, setState, onTypeahead, cleanText);
} }
break; break;
@@ -129,7 +126,7 @@ export function SuggestionsPlugin({
}, },
commands: { commands: {
selectSuggestion: (editor: CoreEditor, suggestion: CompletionItem): CoreEditor => { selectSuggestion: (editor, suggestion: CompletionItem): Editor => {
const suggestions = state.groupedItems; const suggestions = state.groupedItems;
if (!suggestions || !suggestions.length) { if (!suggestions || !suggestions.length) {
return editor; return editor;
@@ -141,7 +138,7 @@ export function SuggestionsPlugin({
return ed; return ed;
}, },
applyTypeahead: (editor: CoreEditor, suggestion: CompletionItem): CoreEditor => { applyTypeahead: (editor, suggestion: CompletionItem) => {
let suggestionText = suggestion.insertText || suggestion.label; let suggestionText = suggestion.insertText || suggestion.label;
const preserveSuffix = suggestion.kind === 'function'; const preserveSuffix = suggestion.kind === 'function';
@@ -169,7 +166,8 @@ export function SuggestionsPlugin({
// If new-lines, apply suggestion as block // If new-lines, apply suggestion as block
if (suggestionText.match(/\n/)) { if (suggestionText.match(/\n/)) {
const fragment = makeFragment(suggestionText); const fragment = makeFragment(suggestionText);
return editor.deleteBackward(backward).deleteForward(forward).insertFragment(fragment).focus(); editor.deleteBackward(backward).deleteForward(forward).insertFragment(fragment).focus();
return editor;
} }
state = { state = {
@@ -177,13 +175,15 @@ export function SuggestionsPlugin({
groupedItems: [], groupedItems: [],
}; };
return editor editor
.snapshotSelection() .snapshotSelection()
.deleteBackward(backward) .deleteBackward(backward)
.deleteForward(forward) .deleteForward(forward)
.insertText(suggestionText) .insertText(suggestionText)
.moveForward(move) .moveForward(move)
.focus(); .focus();
return editor;
}, },
}, },
@@ -203,7 +203,7 @@ export function SuggestionsPlugin({
prefix={state.typeaheadPrefix} prefix={state.typeaheadPrefix}
isOpen={!!state.groupedItems.length} isOpen={!!state.groupedItems.length}
groupedItems={state.groupedItems} groupedItems={state.groupedItems}
onSelectSuggestion={(editor as CoreEditor & SuggestionsPluginCommands).selectSuggestion} onSelectSuggestion={(editor as Editor & SuggestionsPluginCommands).selectSuggestion}
/> />
</> </>
); );
@@ -212,7 +212,7 @@ export function SuggestionsPlugin({
} }
const handleTypeahead = async ( const handleTypeahead = async (
editor: CoreEditor, editor: Editor,
onStateChange: (state: Partial<SuggestionsState>) => void, onStateChange: (state: Partial<SuggestionsState>) => void,
onTypeahead?: (typeahead: TypeaheadInput) => Promise<TypeaheadOutput>, onTypeahead?: (typeahead: TypeaheadInput) => Promise<TypeaheadOutput>,
cleanText?: (text: string) => string cleanText?: (text: string) => string

5
packages/grafana-ui/src/types/completion.ts
View File

@@ -1,4 +1,5 @@
import { Value, Editor as CoreEditor } from 'slate'; import { Value } from 'slate';
import { Editor } from 'slate-react';
import { SearchFunctionType } from '../utils'; import { SearchFunctionType } from '../utils';
@@ -133,7 +134,7 @@ export interface TypeaheadInput {
wrapperClasses: string[]; wrapperClasses: string[];
labelKey?: string; labelKey?: string;
value?: Value; value?: Value;
editor?: CoreEditor; editor?: Editor;
} }
export interface SuggestionsState { export interface SuggestionsState {

1
packages/grafana-ui/tsconfig.build.json
View File

@@ -2,7 +2,6 @@
"compilerOptions": { "compilerOptions": {
"paths": { "paths": {
"@emotion/core": ["./src/types/emotion-core-stub.d.ts"], "@emotion/core": ["./src/types/emotion-core-stub.d.ts"],
"@grafana/slate-react": ["slate-react"],
"@grafana/ui": ["."] "@grafana/ui": ["."]
} }
}, },

2
packages/jaeger-ui-components/package.json
View File

@@ -15,7 +15,6 @@
"@testing-library/user-event": "14.4.3", "@testing-library/user-event": "14.4.3",
"@types/classnames": "^2.2.7", "@types/classnames": "^2.2.7",
"@types/deep-freeze": "^0.1.1", "@types/deep-freeze": "^0.1.1",
"@types/grafana__slate-react": "npm:@types/slate-react@0.22.5",
"@types/hoist-non-react-statics": "^3.3.1", "@types/hoist-non-react-statics": "^3.3.1",
"@types/jest": "28.1.6", "@types/jest": "28.1.6",
"@types/lodash": "4.14.182", "@types/lodash": "4.14.182",
@@ -23,6 +22,7 @@
"@types/react": "17.0.42", "@types/react": "17.0.42",
"@types/react-icons": "2.2.7", "@types/react-icons": "2.2.7",
"@types/reselect": "2.2.0", "@types/reselect": "2.2.0",
"@types/slate-react": "0.22.9",
"@types/testing-library__jest-dom": "5.14.5", "@types/testing-library__jest-dom": "5.14.5",
"@types/tinycolor2": "1.4.3", "@types/tinycolor2": "1.4.3",
"enzyme": "3.11.0", "enzyme": "3.11.0",

2
public/app/features/alerting/unified/components/Expression.tsx
View File

@@ -1,9 +1,9 @@
import { css, cx } from '@emotion/css'; import { css, cx } from '@emotion/css';
import { LanguageMap, languages as prismLanguages } from 'prismjs'; import { LanguageMap, languages as prismLanguages } from 'prismjs';
import React, { FC, useMemo } from 'react'; import React, { FC, useMemo } from 'react';
import { Editor } from 'slate-react';
import { GrafanaTheme } from '@grafana/data'; import { GrafanaTheme } from '@grafana/data';
import { Editor } from '@grafana/slate-react';
import { makeValue, SlatePrism, useStyles } from '@grafana/ui'; import { makeValue, SlatePrism, useStyles } from '@grafana/ui';
import LogqlSyntax from 'app/plugins/datasource/loki/syntax'; import LogqlSyntax from 'app/plugins/datasource/loki/syntax';
import PromqlSyntax from 'app/plugins/datasource/prometheus/promql'; import PromqlSyntax from 'app/plugins/datasource/prometheus/promql';

4
public/app/features/plugins/plugin_loader.ts
View File

@@ -13,10 +13,10 @@ import * as rxjs from 'rxjs';
import * as rxjsOperators from 'rxjs/operators'; import * as rxjsOperators from 'rxjs/operators';
import slate from 'slate'; import slate from 'slate';
import slatePlain from 'slate-plain-serializer'; import slatePlain from 'slate-plain-serializer';
import slateReact from 'slate-react';
import * as grafanaData from '@grafana/data'; import * as grafanaData from '@grafana/data';
import * as grafanaRuntime from '@grafana/runtime'; import * as grafanaRuntime from '@grafana/runtime';
import slateReact from '@grafana/slate-react';
import * as grafanaUIraw from '@grafana/ui'; import * as grafanaUIraw from '@grafana/ui';
import TableModel from 'app/core/TableModel'; import TableModel from 'app/core/TableModel';
import config from 'app/core/config'; import config from 'app/core/config';
@@ -85,7 +85,7 @@ exposeToPlugin('react-router-dom', reactRouter);
// Experimental modules // Experimental modules
exposeToPlugin('prismjs', prismjs); exposeToPlugin('prismjs', prismjs);
exposeToPlugin('slate', slate); exposeToPlugin('slate', slate);
exposeToPlugin('@grafana/slate-react', slateReact); exposeToPlugin('slate-react', slateReact);
exposeToPlugin('slate-plain-serializer', slatePlain); exposeToPlugin('slate-plain-serializer', slatePlain);
exposeToPlugin('react', react); exposeToPlugin('react', react);
exposeToPlugin('react-dom', reactDom); exposeToPlugin('react-dom', reactDom);

3
public/app/plugins/datasource/cloudwatch/components/LogsQueryField.tsx
View File

@@ -2,6 +2,7 @@ import { css } from '@emotion/css';
import { LanguageMap, languages as prismLanguages } from 'prismjs'; import { LanguageMap, languages as prismLanguages } from 'prismjs';
import React, { ReactNode } from 'react'; import React, { ReactNode } from 'react';
import { Node, Plugin } from 'slate'; import { Node, Plugin } from 'slate';
import { Editor } from 'slate-react';
import { AbsoluteTimeRange, QueryEditorProps } from '@grafana/data'; import { AbsoluteTimeRange, QueryEditorProps } from '@grafana/data';
import { BracesPlugin, LegacyForms, QueryField, SlatePrism, TypeaheadInput, TypeaheadOutput } from '@grafana/ui'; import { BracesPlugin, LegacyForms, QueryField, SlatePrism, TypeaheadInput, TypeaheadOutput } from '@grafana/ui';
@@ -48,7 +49,7 @@ export class CloudWatchLogsQueryField extends React.PureComponent<CloudWatchLogs
hint: undefined, hint: undefined,
}; };
plugins: Plugin[]; plugins: Array<Plugin<Editor>>;
constructor(props: CloudWatchLogsQueryFieldProps, context: React.Context<any>) { constructor(props: CloudWatchLogsQueryFieldProps, context: React.Context<any>) {
super(props, context); super(props, context);

3
public/app/plugins/datasource/loki/components/LokiQueryField.tsx
View File

@@ -1,6 +1,7 @@
import { LanguageMap, languages as prismLanguages } from 'prismjs'; import { LanguageMap, languages as prismLanguages } from 'prismjs';
import React, { ReactNode } from 'react'; import React, { ReactNode } from 'react';
import { Plugin, Node } from 'slate'; import { Plugin, Node } from 'slate';
import { Editor } from 'slate-react';
import { QueryEditorProps } from '@grafana/data'; import { QueryEditorProps } from '@grafana/data';
import { reportInteraction } from '@grafana/runtime'; import { reportInteraction } from '@grafana/runtime';
@@ -83,7 +84,7 @@ interface LokiQueryFieldState {
} }
export class LokiQueryField extends React.PureComponent<LokiQueryFieldProps, LokiQueryFieldState> { export class LokiQueryField extends React.PureComponent<LokiQueryFieldProps, LokiQueryFieldState> {
plugins: Plugin[]; plugins: Array<Plugin<Editor>>;
_isMounted = false; _isMounted = false;
constructor(props: LokiQueryFieldProps) { constructor(props: LokiQueryFieldProps) {

3
public/app/plugins/datasource/prometheus/components/PromQueryField.tsx
View File

@@ -1,6 +1,7 @@
import { LanguageMap, languages as prismLanguages } from 'prismjs'; import { LanguageMap, languages as prismLanguages } from 'prismjs';
import React, { ReactNode } from 'react'; import React, { ReactNode } from 'react';
import { Plugin } from 'slate'; import { Plugin } from 'slate';
import { Editor } from 'slate-react';
import { CoreApp, isDataFrame, QueryEditorProps, QueryHint, TimeRange, toLegacyResponseData } from '@grafana/data'; import { CoreApp, isDataFrame, QueryEditorProps, QueryHint, TimeRange, toLegacyResponseData } from '@grafana/data';
import { reportInteraction } from '@grafana/runtime/src'; import { reportInteraction } from '@grafana/runtime/src';
@@ -85,7 +86,7 @@ interface PromQueryFieldState {
} }
class PromQueryField extends React.PureComponent<PromQueryFieldProps, PromQueryFieldState> { class PromQueryField extends React.PureComponent<PromQueryFieldProps, PromQueryFieldState> {
plugins: Plugin[]; plugins: Array<Plugin<Editor>>;
declare languageProviderInitializationPromise: CancelablePromise<any>; declare languageProviderInitializationPromise: CancelablePromise<any>;
constructor(props: PromQueryFieldProps, context: React.Context<any>) { constructor(props: PromQueryFieldProps, context: React.Context<any>) {

145
yarn.lock
View File

@@ -5036,35 +5036,6 @@ __metadata:
languageName: unknown languageName: unknown
linkType: soft linkType: soft
"@grafana/slate-react@npm:0.22.10-grafana":
version: 0.22.10-grafana
resolution: "@grafana/slate-react@npm:0.22.10-grafana"
dependencies:
debug: ^3.1.0
get-window: ^1.1.1
is-window: ^1.0.2
lodash: ^4.1.1
memoize-one: ^4.0.0
prop-types: ^15.5.8
react-immutable-proptypes: ^2.1.0
selection-is-backward: ^1.0.0
slate-base64-serializer: ^0.2.111
slate-dev-environment: ^0.2.2
slate-hotkeys: ^0.2.9
slate-plain-serializer: ^0.7.10
slate-prop-types: ^0.5.41
slate-react-placeholder: ^0.2.8
tiny-invariant: ^1.0.1
tiny-warning: ^0.0.3
peerDependencies:
immutable: ">=3.8.1 || >4.0.0-rc"
react: ">=16.6.0"
react-dom: ">=16.6.0"
slate: ">=0.47.0"
checksum: 3417c53d9d0d2f46d3624037b1094a6786019c52e84d4ed3a91fbac232e67805cb299c3a6af7a1b8fd98cc2c60455103dd1d87eb6e7dd95df3b96b72f94cedd5
languageName: node
linkType: hard
"@grafana/toolkit@9.2.0-pre, @grafana/toolkit@workspace:*, @grafana/toolkit@workspace:packages/grafana-toolkit": "@grafana/toolkit@9.2.0-pre, @grafana/toolkit@workspace:*, @grafana/toolkit@workspace:packages/grafana-toolkit":
version: 0.0.0-use.local version: 0.0.0-use.local
resolution: "@grafana/toolkit@workspace:packages/grafana-toolkit" resolution: "@grafana/toolkit@workspace:packages/grafana-toolkit"
@@ -5177,7 +5148,6 @@ __metadata:
"@grafana/data": 9.2.0-pre "@grafana/data": 9.2.0-pre
"@grafana/e2e-selectors": 9.2.0-pre "@grafana/e2e-selectors": 9.2.0-pre
"@grafana/schema": 9.2.0-pre "@grafana/schema": 9.2.0-pre
"@grafana/slate-react": 0.22.10-grafana
"@grafana/tsconfig": ^1.2.0-rc1 "@grafana/tsconfig": ^1.2.0-rc1
"@mdx-js/react": 1.6.22 "@mdx-js/react": 1.6.22
"@monaco-editor/react": 4.4.5 "@monaco-editor/react": 4.4.5
@@ -5217,7 +5187,6 @@ __metadata:
"@types/d3": 7.4.0 "@types/d3": 7.4.0
"@types/enzyme": 3.10.12 "@types/enzyme": 3.10.12
"@types/enzyme-adapter-react-16": 1.0.6 "@types/enzyme-adapter-react-16": 1.0.6
"@types/grafana__slate-react": "npm:@types/slate-react@0.22.5"
"@types/hoist-non-react-statics": 3.3.1 "@types/hoist-non-react-statics": 3.3.1
"@types/is-hotkey": 0.1.7 "@types/is-hotkey": 0.1.7
"@types/jest": 28.1.6 "@types/jest": 28.1.6
@@ -5237,8 +5206,9 @@ __metadata:
"@types/react-test-renderer": 17.0.1 "@types/react-test-renderer": 17.0.1
"@types/react-transition-group": 4.4.5 "@types/react-transition-group": 4.4.5
"@types/react-window": 1.8.5 "@types/react-window": 1.8.5
"@types/slate": 0.47.2 "@types/slate": 0.47.9
"@types/slate-plain-serializer": 0.7.2 "@types/slate-plain-serializer": 0.7.2
"@types/slate-react": 0.22.9
"@types/testing-library__jest-dom": 5.14.5 "@types/testing-library__jest-dom": 5.14.5
"@types/testing-library__react-hooks": ^3.2.0 "@types/testing-library__react-hooks": ^3.2.0
"@types/tinycolor2": 1.4.3 "@types/tinycolor2": 1.4.3
@@ -5306,8 +5276,9 @@ __metadata:
rollup-plugin-svg-import: ^1.6.0 rollup-plugin-svg-import: ^1.6.0
rxjs: 7.5.6 rxjs: 7.5.6
sass-loader: 13.0.2 sass-loader: 13.0.2
slate: 0.47.8 slate: 0.47.9
slate-plain-serializer: 0.7.10 slate-plain-serializer: 0.7.11
slate-react: 0.22.10
storybook-dark-mode: 1.1.0 storybook-dark-mode: 1.1.0
style-loader: 3.3.1 style-loader: 3.3.1
terser-webpack-plugin: 5.3.3 terser-webpack-plugin: 5.3.3
@@ -5463,7 +5434,6 @@ __metadata:
"@testing-library/user-event": 14.4.3 "@testing-library/user-event": 14.4.3
"@types/classnames": ^2.2.7 "@types/classnames": ^2.2.7
"@types/deep-freeze": ^0.1.1 "@types/deep-freeze": ^0.1.1
"@types/grafana__slate-react": "npm:@types/slate-react@0.22.5"
"@types/hoist-non-react-statics": ^3.3.1 "@types/hoist-non-react-statics": ^3.3.1
"@types/jest": 28.1.6 "@types/jest": 28.1.6
"@types/lodash": 4.14.182 "@types/lodash": 4.14.182
@@ -5471,6 +5441,7 @@ __metadata:
"@types/react": 17.0.42 "@types/react": 17.0.42
"@types/react-icons": 2.2.7 "@types/react-icons": 2.2.7
"@types/reselect": 2.2.0 "@types/reselect": 2.2.0
"@types/slate-react": 0.22.9
"@types/testing-library__jest-dom": 5.14.5 "@types/testing-library__jest-dom": 5.14.5
"@types/tinycolor2": 1.4.3 "@types/tinycolor2": 1.4.3
chance: ^1.0.10 chance: ^1.0.10
@@ -11198,17 +11169,6 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"@types/grafana__slate-react@npm:@types/slate-react@0.22.5":
version: 0.22.5
resolution: "@types/slate-react@npm:0.22.5"
dependencies:
"@types/react": "*"
"@types/slate": "*"
immutable: ^3.8.2
checksum: afc83c7f47d19cc6776a8b4c14eb3894b18db2410e8274058133ed53d78ee82976f1318a707597ddc7277b1b857a4baf97b152687679f4e9757bb8c662508164
languageName: node
linkType: hard
"@types/hast@npm:^2.0.0": "@types/hast@npm:^2.0.0":
version: 2.3.4 version: 2.3.4
resolution: "@types/hast@npm:2.3.4" resolution: "@types/hast@npm:2.3.4"
@@ -12143,13 +12103,24 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"@types/slate@npm:0.47.2": "@types/slate-react@npm:0.22.9":
version: 0.47.2 version: 0.22.9
resolution: "@types/slate@npm:0.47.2" resolution: "@types/slate-react@npm:0.22.9"
dependencies:
"@types/react": "*"
"@types/slate": "*"
immutable: ^3.8.2
checksum: d74812f6bf651c508afb2a4fae4ae919cba992ec920ac017d1bf73b1b469959145793a716d5d114b93d1082683ab7378b5cb5b68f0ff01a6d121c8ddbbb8e2e1
languageName: node
linkType: hard
"@types/slate@npm:0.47.9":
version: 0.47.9
resolution: "@types/slate@npm:0.47.9"
dependencies: dependencies:
"@types/react": "*" "@types/react": "*"
immutable: ^3.8.2 immutable: ^3.8.2
checksum: c92350f1ef366b5907356a7f3b7bd41dda548dc1002cc2bd79f6b0ff1356d3189c124a54b363ddbe22cbdeb2a75f9d1b67d4f5b2a1bb6b89b714ecf7cf0c49c2 checksum: ce88a5c6f502fbfe9a299983766d2eb67e4fbe2f746178b2ef31330b1392b62eca96d8618753ca2af3e858b6aa4ada91a64a3dfc4e70c60785f172c240e06a45
languageName: node languageName: node
linkType: hard linkType: hard
@@ -21755,7 +21726,6 @@ __metadata:
"@grafana/lezer-logql": 0.0.18 "@grafana/lezer-logql": 0.0.18
"@grafana/runtime": "workspace:*" "@grafana/runtime": "workspace:*"
"@grafana/schema": "workspace:*" "@grafana/schema": "workspace:*"
"@grafana/slate-react": 0.22.10-grafana
"@grafana/toolkit": "workspace:*" "@grafana/toolkit": "workspace:*"
"@grafana/tsconfig": ^1.2.0-rc1 "@grafana/tsconfig": ^1.2.0-rc1
"@grafana/ui": "workspace:*" "@grafana/ui": "workspace:*"
@@ -21813,7 +21783,6 @@ __metadata:
"@types/eslint": 8.4.5 "@types/eslint": 8.4.5
"@types/file-saver": 2.0.5 "@types/file-saver": 2.0.5
"@types/google.analytics": ^0.0.42 "@types/google.analytics": ^0.0.42
"@types/grafana__slate-react": "npm:@types/slate-react@0.22.5"
"@types/history": 4.7.11 "@types/history": 4.7.11
"@types/hoist-non-react-statics": 3.3.1 "@types/hoist-non-react-statics": 3.3.1
"@types/jest": 28.1.6 "@types/jest": 28.1.6
@@ -21849,8 +21818,9 @@ __metadata:
"@types/redux-mock-store": 1.0.3 "@types/redux-mock-store": 1.0.3
"@types/reselect": 2.2.0 "@types/reselect": 2.2.0
"@types/semver": 7.3.10 "@types/semver": 7.3.10
"@types/slate": 0.47.2 "@types/slate": 0.47.9
"@types/slate-plain-serializer": 0.7.2 "@types/slate-plain-serializer": 0.7.2
"@types/slate-react": 0.22.9
"@types/testing-library__jest-dom": 5.14.5 "@types/testing-library__jest-dom": 5.14.5
"@types/testing-library__react-hooks": ^3.2.0 "@types/testing-library__react-hooks": ^3.2.0
"@types/tinycolor2": 1.4.3 "@types/tinycolor2": 1.4.3
@@ -22015,8 +21985,9 @@ __metadata:
selecto: 1.19.1 selecto: 1.19.1
semver: 7.3.7 semver: 7.3.7
sinon: 14.0.0 sinon: 14.0.0
slate: 0.47.8 slate: 0.47.9
slate-plain-serializer: 0.7.10 slate-plain-serializer: 0.7.11
slate-react: 0.22.10
sql-formatter-plus: ^1.3.6 sql-formatter-plus: ^1.3.6
style-loader: 3.3.1 style-loader: 3.3.1
stylelint: 14.9.1 stylelint: 14.9.1
@@ -34352,7 +34323,7 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"slate-base64-serializer@npm:^0.2.111": "slate-base64-serializer@npm:^0.2.112":
version: 0.2.115 version: 0.2.115
resolution: "slate-base64-serializer@npm:0.2.115" resolution: "slate-base64-serializer@npm:0.2.115"
dependencies: dependencies:
@@ -34363,7 +34334,7 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"slate-dev-environment@npm:^0.2.2": "slate-dev-environment@npm:0.2.5":
version: 0.2.5 version: 0.2.5
resolution: "slate-dev-environment@npm:0.2.5" resolution: "slate-dev-environment@npm:0.2.5"
dependencies: dependencies:
@@ -34372,6 +34343,15 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"slate-dev-environment@patch:slate-dev-environment@npm:0.2.5#.yarn/patches/slate-dev-environment-npm-0.2.5-9aeb7da7b5.patch::locator=grafana%40workspace%3A.":
version: 0.2.5
resolution: "slate-dev-environment@patch:slate-dev-environment@npm%3A0.2.5#.yarn/patches/slate-dev-environment-npm-0.2.5-9aeb7da7b5.patch::version=0.2.5&hash=13521e&locator=grafana%40workspace%3A."
dependencies:
is-in-browser: ^1.1.3
checksum: 1be7514ac0b10b0232f3c19e02bf5f9211850e119a235743fd46ab2f182c8b892dc58edf40130308d85d14f755b348b86ab2daea757e8ee0beb74746f653fc03
languageName: node
linkType: hard
"slate-hotkeys@npm:^0.2.9": "slate-hotkeys@npm:^0.2.9":
version: 0.2.11 version: 0.2.11
resolution: "slate-hotkeys@npm:0.2.11" resolution: "slate-hotkeys@npm:0.2.11"
@@ -34382,17 +34362,17 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"slate-plain-serializer@npm:0.7.10": "slate-plain-serializer@npm:0.7.11":
version: 0.7.10 version: 0.7.11
resolution: "slate-plain-serializer@npm:0.7.10" resolution: "slate-plain-serializer@npm:0.7.11"
peerDependencies: peerDependencies:
immutable: ">=3.8.1" immutable: ">=3.8.1"
slate: ">=0.46.0" slate: ">=0.46.0"
checksum: 0fe3f736cbc48c4b9cf7cf5ec03d9cc51c0f3320e46841de4aef50767a2ef14952660e0e2e5dfe1696e7d5c952408d95144543a9a9a86973e893de840782cd2e checksum: b8d2989562a140c4c6cada381483aa2f419c3532ebb4ed51abfa5df8128dfd8f3d845ca324d737e3711343d651a95804f91aaa1d2cdd8e96cd9602c747781a5b
languageName: node languageName: node
linkType: hard linkType: hard
"slate-plain-serializer@npm:^0.7.10": "slate-plain-serializer@npm:^0.7.11":
version: 0.7.13 version: 0.7.13
resolution: "slate-plain-serializer@npm:0.7.13" resolution: "slate-plain-serializer@npm:0.7.13"
peerDependencies: peerDependencies:
@@ -34402,7 +34382,7 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"slate-prop-types@npm:^0.5.41": "slate-prop-types@npm:^0.5.42":
version: 0.5.44 version: 0.5.44
resolution: "slate-prop-types@npm:0.5.44" resolution: "slate-prop-types@npm:0.5.44"
peerDependencies: peerDependencies:
@@ -34412,7 +34392,7 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"slate-react-placeholder@npm:^0.2.8": "slate-react-placeholder@npm:^0.2.9":
version: 0.2.9 version: 0.2.9
resolution: "slate-react-placeholder@npm:0.2.9" resolution: "slate-react-placeholder@npm:0.2.9"
peerDependencies: peerDependencies:
@@ -34423,9 +34403,38 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"slate@npm:0.47.8": "slate-react@npm:0.22.10":
version: 0.47.8 version: 0.22.10
resolution: "slate@npm:0.47.8" resolution: "slate-react@npm:0.22.10"
dependencies:
debug: ^3.1.0
get-window: ^1.1.1
is-window: ^1.0.2
lodash: ^4.1.1
memoize-one: ^4.0.0
prop-types: ^15.5.8
react-immutable-proptypes: ^2.1.0
selection-is-backward: ^1.0.0
slate-base64-serializer: ^0.2.112
slate-dev-environment: ^0.2.2
slate-hotkeys: ^0.2.9
slate-plain-serializer: ^0.7.11
slate-prop-types: ^0.5.42
slate-react-placeholder: ^0.2.9
tiny-invariant: ^1.0.1
tiny-warning: ^0.0.3
peerDependencies:
immutable: ">=3.8.1 || >4.0.0-rc"
react: ">=16.6.0"
react-dom: ">=16.6.0"
slate: ">=0.47.0"
checksum: 1ecddaf0f635205249680961d7e772cf25a60179b39ca69a34f874b2797e3c122ef405921fa2787ea0c559af48d1d79f10d7e169749f0f084c6bf366aeffdfc8
languageName: node
linkType: hard
"slate@npm:0.47.9":
version: 0.47.9
resolution: "slate@npm:0.47.9"
dependencies: dependencies:
debug: ^3.1.0 debug: ^3.1.0
direction: ^0.1.5 direction: ^0.1.5
@@ -34437,7 +34446,7 @@ __metadata:
type-of: ^2.0.1 type-of: ^2.0.1
peerDependencies: peerDependencies:
immutable: ">=3.8.1 || >4.0.0-rc" immutable: ">=3.8.1 || >4.0.0-rc"
checksum: 6d3541abe1a727f498e0835118b98efd1a8ea2cfa9bb1b3fe9f77faf42b4afce4259e765b60bd5b8c2bd34686d5f9bcfb80b9a8807c54fee1e496a92bad563d6 checksum: a128d1eaa4c203dbb13d197d69758341df485e42e52aea1739d05939b16df42633949f116ae9b75b95b647ec39b18867ca5c8a05dbe97eeb15cf31bc8d2edc7f
languageName: node languageName: node
linkType: hard linkType: hard