Merge pull request #10 from gwintzer/6.3.2

6.3.2

.gitignore

@@ -1,5 +1,3 @@
-/.idea/
-bower_components
+npm-debug.log*
+node_modules
 /build/
-deps
-npm-debug.log

README.md

@@ -5,15 +5,52 @@ HTML Plugin Widget for Kibana. This Plugin was originally adapted from the Markd
 
 ![preview-edit](/resources/preview-edit.png)
 
-# Install
+## Install
 
 ```bash
 bin/kibana-plugin install <PATH_OR_URL_TO_YOUR_ZIP_FILE>
 ```
+Go to releases page for list of available packages
 
-# Compatibility
+## Compatibility
 Plugins are officialy not supported, because of fast code changes even in minor Versions.
 
 The plugin is compatible with following Versions:
-* kibana (=6.1.x)
+* kibana (=6.3+)
 
+The plugin is tagged as experimental for the moment :
+- Is necessary to add an option to prevent XSS injection by blocking scripts ?
+- How to manage the CSS style/classes of elements like h1, h2 and others with the core CSS classes that overwriting it ?
+
+
+## development
+
+See the [kibana contributing guide](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md) for instructions setting up your development environment. Once you have completed that, use the following yarn scripts.
+
+  - `yarn kbn bootstrap`
+
+    Install dependencies and crosslink Kibana and all projects/plugins.
+
+    > ***IMPORTANT:*** Use this script instead of `yarn` to install dependencies when switching branches, and re-run it whenever your dependencies change.
+
+  - `yarn start`
+
+    Start kibana and have it include this plugin. You can pass any arguments that you would normally send to `bin/kibana`
+
+      ```
+      yarn start --elasticsearch.url http://localhost:9220
+      ```
+
+  - `yarn build`
+
+    Build a distributable archive of your plugin.
+
+  - `yarn test:browser`
+
+    Run the browser tests in a real web browser.
+
+  - `yarn test:server`
+
+    Run the server tests using mocha.
+
+For more information about any of these commands run `yarn ${task} --help`. For a full list of tasks checkout the `package.json` file, or run `yarn run`.

index.js

@@ -1,7 +1,4 @@
-'use strict';
-
-module.exports = function (kibana) {
-
+export default function (kibana) {
   return new kibana.Plugin({
 
     uiExports: {

package.json

@@ -1,5 +1,34 @@
 {
-	"name": "kibana-html-plugin",
-	"description": "This is a Kibana 6 plugin which renders HTML in visualizations",
-	"version": "6.2.2"
+  "name": "kibana-html-plugin",
+  "version": "6.3.2",
+  "description": "This is a Kibana 6 plugin which renders HTML in visualizations",
+  "main": "index.js",
+  "kibana": {
+    "version": "kibana",
+    "templateVersion": "1.0.0"
+  },
+  "scripts": {
+    "preinstall": "node ../../kibana/preinstall_check",
+    "kbn": "node ../../kibana/scripts/kbn",
+    "lint": "eslint .",
+    "start": "plugin-helpers start",
+    "test:server": "plugin-helpers test:server",
+    "test:browser": "plugin-helpers test:browser",
+    "build": "plugin-helpers build"
+  },
+  "devDependencies": {
+    "@elastic/eslint-config-kibana": "link:../../kibana/packages/eslint-config-kibana",
+    "@elastic/eslint-import-resolver-kibana": "link:../../kibana/packages/kbn-eslint-import-resolver-kibana",
+    "@kbn/plugin-helpers": "link:../../kibana/packages/kbn-plugin-helpers",
+    "babel-eslint": "^8.0.2",
+    "eslint": "^4.11.0",
+    "eslint-plugin-babel": "^4.1.1",
+    "eslint-plugin-import": "^2.3.0",
+    "eslint-plugin-jest": "^21.3.2",
+    "eslint-plugin-mocha": "^4.9.0",
+    "eslint-plugin-no-unsanitized": "^3.0.2",
+    "eslint-plugin-prefer-object-spread": "^1.2.1",
+    "eslint-plugin-react": "^7.0.1",
+    "expect.js": "^0.3.1"
+  }
 }

public/html.js

@@ -1,33 +1,51 @@
-import 'plugins/kibana-html-plugin/html.less';
+// import 'plugins/kibana-html-plugin/html.less';
+//
+// import mainTemplate from 'plugins/kibana-html-plugin/html.html';
+// import optionsTemplate from 'plugins/kibana-html-plugin/htmlOptions.html';
+//
+// import 'plugins/kibana-html-plugin/htmlController.js';
+//
+// import optionsComponent from 'plugins/kibana-html-plugin/optionsComponent.js'
+//
+
+
 
-import mainTemplate from 'plugins/kibana-html-plugin/html.html';
-import optionsTemplate from 'plugins/kibana-html-plugin/htmlOptions.html';
 
-import 'plugins/kibana-html-plugin/htmlController.js';
+
+import 'plugins/kibana-html-plugin/html.less';
 
 import {CATEGORY} from 'ui/vis/vis_category';
 import {VisFactoryProvider} from 'ui/vis/vis_factory';
 import {VisTypesRegistryProvider} from 'ui/registry/vis_types';
-import {VisSchemasProvider} from 'ui/vis/editors/default/schemas';
+
+import { DefaultEditorSize } from 'ui/vis/editor_size';
+
+import { HtmlVisWrapper } from './html_vis_controller';
+import htmlVisParamsTemplate from './html_vis_params.html';
+
 
 function HtmlVisProvider(Private) {
   const VisFactory = Private(VisFactoryProvider);
-  const Schemas = Private(VisSchemasProvider);
 
-  return VisFactory.createAngularVisualization({
-      name: 'html',
-      title: 'Html widget',
-      icon: 'fa-code',
-      description: 'Useful for displaying html in dashboards.',
-      category: CATEGORY.OTHER,
-    //visualization: VisController,
+  return VisFactory.createReactVisualization({
+    name: 'html',
+    title: 'Html widget',
+    icon: 'fa-code',
+    stage: 'experimental',
+    description: 'Useful for displaying html in dashboards.',
+    category: CATEGORY.OTHER,
 
     visConfig: {
-      defaults: {},
-      template: mainTemplate
+      component: HtmlVisWrapper,
+      defaults: {
+        fontSize: 12,
+        openLinksInNewTab: false
+      }
     },
     editorConfig: {
-      optionsTemplate: optionsTemplate
+      optionsTemplate: htmlVisParamsTemplate,
+      enableAutoApply: true,
+      defaultSize: DefaultEditorSize.LARGE,
     },
     options: {
       showTimePicker: false,
@@ -38,4 +56,9 @@ function HtmlVisProvider(Private) {
 
   });
 }
+
+// register the provider with the visTypes registry so that other know it exists
 VisTypesRegistryProvider.register(HtmlVisProvider);
+
+// export the provider so that the visType can be required with Private()
+export default HtmlVisProvider;

public/html.less

@@ -5,19 +5,9 @@
   width: 100%;
 }
 
-.vis-editor-sidebar {
-  max-width: 600px;
-}
-
-.html-editor {
-  min-height: 800px;
-  min-width: 600px;
-  font-size: 14px !important;
-}
-
 .vis-editor {
 
-  &.vis-type-markdown {
+  &.vis-type-html {
 
     .visualization-options {
       .flex-parent();