@grafana/plugin-ui 0.1.15 → 0.1.17

package/dist/components/ConfigEditor/DataSourceDescription.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataSourceDescription = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const css_1 = require("@emotion/css");
+const ui_1 = require("@grafana/ui");
+const DataSourceDescription = ({ dataSourceName, docsLink, hasRequiredFields = true, }) => {
+    const theme = (0, ui_1.useTheme2)();
+    const styles = {
+        container: (0, css_1.css)({
+            margin: theme.spacing(4, 0),
+        }),
+        text: (0, css_1.css)(Object.assign(Object.assign({}, theme.typography.body), { color: theme.colors.text.secondary, a: (0, css_1.css)({
+                color: theme.colors.text.link,
+                textDecoration: "underline",
+                "&:hover": {
+                    textDecoration: "none",
+                },
+            }) })),
+        asterisk: (0, css_1.css) `
+      color: ${theme.colors.error.main};
+    `,
+    };
+    return (react_1.default.createElement("div", { className: styles.container },
+        react_1.default.createElement("p", { className: styles.text },
+            "Before you can use the ",
+            dataSourceName,
+            " data source, you must configure it below or in the config file.",
+            react_1.default.createElement("br", null),
+            "For detailed instructions,",
+            " ",
+            react_1.default.createElement("a", { href: docsLink, target: "_blank", rel: "noreferrer" }, "view the documentation"),
+            "."),
+        hasRequiredFields && (react_1.default.createElement("p", { className: styles.text },
+            react_1.default.createElement("i", null,
+                "Fields marked in ",
+                react_1.default.createElement("span", { className: styles.asterisk }, "*"),
+                " are required")))));
+};
+exports.DataSourceDescription = DataSourceDescription;
+//# sourceMappingURL=DataSourceDescription.js.map

package/dist/components/ConfigEditor/DataSourceDescription.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataSourceDescription.js","sourceRoot":"","sources":["../../../src/components/ConfigEditor/DataSourceDescription.tsx"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAC1B,sCAAmC;AACnC,oCAAwC;AAQjC,MAAM,qBAAqB,GAAoB,CAAC,EACrD,cAAc,EACd,QAAQ,EACR,iBAAiB,GAAG,IAAI,GACzB,EAAE,EAAE;IACH,MAAM,KAAK,GAAG,IAAA,cAAS,GAAE,CAAC;IAE1B,MAAM,MAAM,GAAG;QACb,SAAS,EAAE,IAAA,SAAG,EAAC;YACb,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;SAC5B,CAAC;QACF,IAAI,EAAE,IAAA,SAAG,kCACJ,KAAK,CAAC,UAAU,CAAC,IAAI,KACxB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,EAClC,CAAC,EAAE,IAAA,SAAG,EAAC;gBACL,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI;gBAC7B,cAAc,EAAE,WAAW;gBAC3B,SAAS,EAAE;oBACT,cAAc,EAAE,MAAM;iBACvB;aACF,CAAC,IACF;QACF,QAAQ,EAAE,IAAA,SAAG,EAAA;eACF,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI;KACjC;KACF,CAAC;IAEF,OAAO,CACL,uCAAK,SAAS,EAAE,MAAM,CAAC,SAAS;QAC9B,qCAAG,SAAS,EAAE,MAAM,CAAC,IAAI;;YACC,cAAc;;YAEtC,yCAAM;;YACqB,GAAG;YAC9B,qCAAG,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,YAAY,6BAE/C;gBAEF;QACH,iBAAiB,IAAI,CACpB,qCAAG,SAAS,EAAE,MAAM,CAAC,IAAI;YACvB;;gBACmB,wCAAM,SAAS,EAAE,MAAM,CAAC,QAAQ,QAAU;gCAEzD,CACF,CACL,CACG,CACP,CAAC;AACJ,CAAC,CAAC;AAjDW,QAAA,qBAAqB,yBAiDhC"}

package/dist/components/ConfigEditor/InlineLabel.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InlineLabel = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const css_1 = require("@emotion/css");
+const ui_1 = require("@grafana/ui");
+const InlineLabel = (_a) => {
+    var { children, required = false } = _a, props = tslib_1.__rest(_a, ["children", "required"]);
+    const theme = (0, ui_1.useTheme2)();
+    const styles = {
+        asterisk: (0, css_1.css) `
+      color: ${theme.colors.error.main};
+    `,
+    };
+    return (react_1.default.createElement(ui_1.InlineLabel, Object.assign({}, props),
+        react_1.default.createElement("span", null,
+            children,
+            required && (react_1.default.createElement(react_1.default.Fragment, null,
+                "\u00A0",
+                react_1.default.createElement("span", { className: styles.asterisk }, "*"))))));
+};
+exports.InlineLabel = InlineLabel;
+//# sourceMappingURL=InlineLabel.js.map

package/dist/components/ConfigEditor/InlineLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineLabel.js","sourceRoot":"","sources":["../../../src/components/ConfigEditor/InlineLabel.tsx"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAC1B,sCAAmC;AACnC,oCAA4E;AAMrE,MAAM,WAAW,GAAoB,CAAC,EAI5C,EAAE,EAAE;QAJwC,EAC3C,QAAQ,EACR,QAAQ,GAAG,KAAK,OAEjB,EADI,KAAK,sBAHmC,wBAI5C,CADS;IAER,MAAM,KAAK,GAAG,IAAA,cAAS,GAAE,CAAC;IAE1B,MAAM,MAAM,GAAG;QACb,QAAQ,EAAE,IAAA,SAAG,EAAA;eACF,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI;KACjC;KACF,CAAC;IAEF,OAAO,CACL,8BAAC,gBAAmB,oBAAK,KAAK;QAC5B;YACG,QAAQ;YACR,QAAQ,IAAI,CACX;;gBACQ,wCAAM,SAAS,EAAE,MAAM,CAAC,QAAQ,QAAU,CAC/C,CACJ,CACI,CACa,CACvB,CAAC;AACJ,CAAC,CAAC;AAzBW,QAAA,WAAW,eAyBtB"}

package/dist/components/ConfigEditor/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DataSourceDescription = exports.InlineLabel = void 0;
+var InlineLabel_1 = require("./InlineLabel");
+Object.defineProperty(exports, "InlineLabel", { enumerable: true, get: function () { return InlineLabel_1.InlineLabel; } });
+var DataSourceDescription_1 = require("./DataSourceDescription");
+Object.defineProperty(exports, "DataSourceDescription", { enumerable: true, get: function () { return DataSourceDescription_1.DataSourceDescription; } });
+//# sourceMappingURL=index.js.map

package/dist/components/ConfigEditor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ConfigEditor/index.ts"],"names":[],"mappings":";;;AAAA,6CAA4C;AAAnC,0GAAA,WAAW,OAAA;AACpB,iEAAgE;AAAvD,8HAAA,qBAAqB,OAAA"}

package/dist/components/index.js

@@ -22,6 +22,7 @@ var ui_1 = require("@grafana/ui");
 Object.defineProperty(exports, "InlineSwitch", { enumerable: true, get: function () { return ui_1.InlineSwitch; } });
 Object.defineProperty(exports, "CertificationKey", { enumerable: true, get: function () { return ui_1.CertificationKey; } });
 tslib_1.__exportStar(require("./QueryEditor"), exports);
+tslib_1.__exportStar(require("./ConfigEditor"), exports);
 var CustomHeadersSettings_1 = require("./CustomHeadersSettings/CustomHeadersSettings");
 Object.defineProperty(exports, "CustomHeadersSettings", { enumerable: true, get: function () { return CustomHeadersSettings_1.CustomHeadersSettings; } });
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":";;;;AAAA,iFAAgF;AAAvE,0HAAA,mBAAmB,OAAA;AAC5B,kEAAiE;AAAxD,gHAAA,cAAc,OAAA;AACvB,+DAGuC;AAFrC,8GAAA,aAAa,OAAA;AAGf,6CAG2B;AAFzB,kGAAA,OAAO,OAAA;AAGT,sDAAsE;AAA7D,wGAAA,UAAU,OAAA;AACnB,iFAImD;AAHjD,0HAAA,mBAAmB,OAAA;AAEnB,iHAAA,UAAU,OAAA;AAEZ,8EAAoD;AACpD,sDAA4B;AAC5B,8DAAoC;AACpC,kCAA6D;AAApD,kGAAA,YAAY,OAAA;AAAE,sGAAA,gBAAgB,OAAA;AACvC,wDAA8B;AAC9B,uFAAsF;AAA7E,8HAAA,qBAAqB,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":";;;;AAAA,iFAAgF;AAAvE,0HAAA,mBAAmB,OAAA;AAC5B,kEAAiE;AAAxD,gHAAA,cAAc,OAAA;AACvB,+DAGuC;AAFrC,8GAAA,aAAa,OAAA;AAGf,6CAG2B;AAFzB,kGAAA,OAAO,OAAA;AAGT,sDAAsE;AAA7D,wGAAA,UAAU,OAAA;AACnB,iFAImD;AAHjD,0HAAA,mBAAmB,OAAA;AAEnB,iHAAA,UAAU,OAAA;AAEZ,8EAAoD;AACpD,sDAA4B;AAC5B,8DAAoC;AACpC,kCAA6D;AAApD,kGAAA,YAAY,OAAA;AAAE,sGAAA,gBAAgB,OAAA;AACvC,wDAA8B;AAC9B,yDAA+B;AAC/B,uFAAsF;AAA7E,8HAAA,qBAAqB,OAAA"}

package/dist/src/components/ConfigEditor/DataSourceDescription.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+declare type Props = {
+    dataSourceName: string;
+    docsLink: string;
+    hasRequiredFields?: boolean;
+};
+export declare const DataSourceDescription: React.FC<Props>;
+export {};

package/dist/src/components/ConfigEditor/InlineLabel.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { InlineLabel as OriginalInlineLabel } from "@grafana/ui";
+declare type Props = React.ComponentProps<typeof OriginalInlineLabel> & {
+    required?: boolean;
+};
+export declare const InlineLabel: React.FC<Props>;
+export {};

package/dist/src/components/ConfigEditor/index.d.ts

@@ -0,0 +1,2 @@
+export { InlineLabel } from "./InlineLabel";
+export { DataSourceDescription } from "./DataSourceDescription";

package/dist/src/components/index.d.ts

@@ -9,4 +9,5 @@ export * from './DataLinks';
 export * from './Cascader/Cascader';
 export { InlineSwitch, CertificationKey } from '@grafana/ui';
 export * from './QueryEditor';
+export * from './ConfigEditor';
 export { CustomHeadersSettings } from './CustomHeadersSettings/CustomHeadersSettings';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/plugin-ui",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "repository": "git@github.com:grafana/plugin-ui.git",
   "author": "Grafana Labs",
   "main": "dist/index.js",
@@ -16,7 +16,6 @@
     "@grafana/data": "^8.4.7",
     "@grafana/experimental": "^0.0.2-canary.39",
     "@grafana/runtime": "^8.4.7",
-    "@grafana/toolkit": "^8.4.7",
     "@grafana/tsconfig": "1.2.0-rc1",
     "@grafana/ui": "^8.4.7",
     "@types/chance": "^1.1.0",
@@ -24,6 +23,7 @@
     "@types/react-calendar": "^3.1.2",
     "chance": "^1.1.7",
     "copyfiles": "^2.4.1",
+    "lodash": "^4.17.21",
     "memoize-one": "^5.1.1",
     "rc-cascader": "1.0.1",
     "react-awesome-query-builder": "^5.3.1",
@@ -49,7 +49,9 @@
     "@testing-library/jest-dom": "^5.11.6",
     "@testing-library/react": "^11.2.2",
     "@testing-library/user-event": "^12.8.3",
+    "@types/lodash": "^4.14.194",
     "@types/react": "17.0.38",
+    "@types/semver": "^7.5.0",
     "@types/testing-library__jest-dom": "^5.9.5",
     "babel-loader": "^8.2.2",
     "jest-fetch-mock": "^3.0.3",