[@kbn/ui-framework] move ui-framework to a package (#17085) (#17128)

* [@kbn/ui-framework] move ui-framework to a package

* [@kbn/ui-framework] restore doc_site index.html and fix build task names

* [jest] always ignore modules in target dirs

.eslintignore

@@ -9,7 +9,6 @@
 /src/core_plugins/console/public/tests/webpackShims
 /src/ui/public/utils/decode_geo_hash.js
 /src/core_plugins/timelion/public/webpackShims/jquery.flot.*
-/ui_framework/doc_site/build
 /tasks/vendor
 /packages/*/node_modules
 /packages/*/target
@@ -18,4 +17,7 @@
 /packages/kbn-pm/dist
 /packages/kbn-pm/vendor
 /packages/kbn-plugin-generator/sao_template/template
+/packages/kbn-ui-framework/dist
+/packages/kbn-ui-framework/doc_site/build
+/packages/kbn-ui-framework/generator-kui/*/templates/
 !/.eslintrc.js

.eslintrc.js

@@ -41,5 +41,44 @@ module.exports = {
         'prefer-object-spread/prefer-object-spread': 'off',
       },
     },
+
+    // files that are not allowed to use devDepenedncies
+    {
+      files: ['packages/kbn-ui-framework/**/*'],
+      excludedFiles: [
+        'packages/kbn-ui-framework/**/*.test.js',
+        'packages/kbn-ui-framework/doc_site/**/*',
+        'packages/kbn-ui-framework/generator-kui/**/*',
+        'packages/kbn-ui-framework/Gruntfile.js',
+      ],
+      rules: {
+        'import/no-extraneous-dependencies': [
+          'error',
+          {
+            devDependencies: false,
+            peerDependencies: true,
+          },
+        ],
+      },
+    },
+
+    // files that are allowed to use devDepenedncies
+    {
+      files: [
+        'packages/kbn-ui-framework/**/*.test.js',
+        'packages/kbn-ui-framework/doc_site/**/*',
+        'packages/kbn-ui-framework/generator-kui/**/*',
+        'packages/kbn-ui-framework/Gruntfile.js',
+      ],
+      rules: {
+        'import/no-extraneous-dependencies': [
+          'error',
+          {
+            devDependencies: true,
+            peerDependencies: true,
+          },
+        ],
+      },
+    },
   ],
 };

.gitignore

@@ -33,8 +33,8 @@ selenium
 *.swp
 *.swo
 *.out
-ui_framework/doc_site/build
-!ui_framework/doc_site/build/index.html
+/packages/kbn-ui-framework/doc_site/build/*
+!/packages/kbn-ui-framework/doc_site/build/index.html
 package-lock.json
 .yo-rc.json
 /.vscode

package.json

@@ -65,10 +65,10 @@
     "makelogs": "echo 'use `node scripts/makelogs`' && false",
     "mocha": "echo 'use `node scripts/mocha`' && false",
     "sterilize": "grunt sterilize",
-    "uiFramework:start": "grunt uiFramework:start",
-    "uiFramework:build": "grunt uiFramework:build",
-    "uiFramework:createComponent": "yo ./ui_framework/generator-kui/app/component.js",
-    "uiFramework:documentComponent": "yo ./ui_framework/generator-kui/app/documentation.js"
+    "uiFramework:start": "cd packages/kbn-ui-framework && yarn docSiteStart",
+    "uiFramework:build": "cd packages/kbn-ui-framework && yarn docSiteBuild",
+    "uiFramework:createComponent": "cd packages/kbn-ui-framework && yarn createComponent",
+    "uiFramework:documentComponent": "cd packages/kbn-ui-framework && yarn documentComponent"
   },
   "repository": {
     "type": "git",
@@ -83,6 +83,7 @@
     "@kbn/datemath": "link:packages/kbn-datemath",
     "@kbn/pm": "link:packages/kbn-pm",
     "@kbn/test-subj-selector": "link:packages/kbn-test-subj-selector",
+    "@kbn/ui-framework": "link:packages/kbn-ui-framework",
     "JSONStream": "1.1.1",
     "accept-language-parser": "1.2.0",
     "angular": "1.6.5",
@@ -119,11 +120,8 @@
     "encode-uri-query": "1.0.0",
     "even-better": "7.0.2",
     "expiry-js": "0.1.7",
-    "exports-loader": "0.6.4",
-    "expose-loader": "0.7.3",
     "extract-text-webpack-plugin": "3.0.1",
     "file-loader": "1.1.4",
-    "focus-trap-react": "^3.1.1",
     "font-awesome": "4.4.0",
     "glob": "5.0.13",
     "glob-all": "3.0.1",
@@ -134,7 +132,6 @@
     "hjson": "3.1.0",
     "http-proxy-agent": "1.0.0",
     "https-proxy-agent": "2.1.1",
-    "imports-loader": "0.7.1",
     "inert": "4.0.2",
     "jade": "1.11.0",
     "jade-loader": "0.8.0",
@@ -169,7 +166,6 @@
     "querystring-browser": "1.0.4",
     "raw-loader": "0.5.1",
     "react": "^16.2.0",
-    "react-ace": "^5.9.0",
     "react-anything-sortable": "^1.7.3",
     "react-color": "^2.13.8",
     "react-dom": "^16.2.0",
@@ -177,9 +173,7 @@
     "react-input-range": "^1.3.0",
     "react-markdown": "^3.1.4",
     "react-redux": "^5.0.6",
-    "react-router": "^3.2.0",
     "react-router-dom": "4.2.2",
-    "react-router-redux": "^4.0.8",
     "react-select": "^1.2.0",
     "react-sizeme": "^2.3.6",
     "react-toggle": "4.0.2",
@@ -197,7 +191,6 @@
     "script-loader": "0.7.2",
     "semver": "5.1.0",
     "style-loader": "0.19.0",
-    "tabbable": "1.1.0",
     "tar": "2.2.0",
     "tinygradient": "0.3.0",
     "topojson-client": "3.0.0",
@@ -261,9 +254,6 @@
     "grunt-run": "0.7.0",
     "grunt-simple-mocha": "0.4.0",
     "gulp-sourcemaps": "1.7.3",
-    "highlight.js": "9.0.0",
-    "html": "1.0.0",
-    "html-loader": "0.5.1",
     "husky": "0.8.1",
     "image-diff": "1.6.0",
     "istanbul-instrumenter-loader": "3.0.0",
@@ -279,7 +269,6 @@
     "karma-junit-reporter": "1.2.0",
     "karma-mocha": "1.3.0",
     "karma-safari-launcher": "1.0.0",
-    "keymirror": "0.1.1",
     "leadfoot": "1.7.1",
     "license-checker": "^16.0.0",
     "load-grunt-config": "0.19.2",
@@ -290,11 +279,9 @@
     "murmurhash3js": "3.0.1",
     "ncp": "2.0.0",
     "nock": "8.0.0",
-    "node-sass": "4.5.3",
     "pixelmatch": "4.0.2",
     "prettier": "^1.11.1",
     "proxyquire": "1.7.10",
-    "sass-loader": "6.0.6",
     "simple-git": "1.37.0",
     "sinon": "1.17.2",
     "source-map": "0.5.6",
@@ -305,11 +292,8 @@
     "tree-kill": "1.1.0",
     "ts-jest": "^22.0.4",
     "typescript": "^2.7.2",
-    "webpack-dev-server": "2.9.1",
     "xml2js": "0.4.19",
-    "xmlbuilder": "9.0.4",
-    "yeoman-generator": "1.1.1",
-    "yo": "2.0.0"
+    "xmlbuilder": "9.0.4"
   },
   "engines": {
     "node": "8.9.4",

packages/kbn-ui-framework/Gruntfile.js

@@ -1,21 +1,61 @@
-import sass from 'node-sass';
-import postcss from 'postcss';
-import postcssConfig from '../src/optimize/postcss.config';
-import chokidar from 'chokidar';
-import debounce from 'lodash/function/debounce';
+const sass = require('node-sass');
+const postcss = require('postcss');
+const postcssConfig = require('../../src/optimize/postcss.config');
+const chokidar = require('chokidar');
+const debounce = require('lodash/function/debounce');
 
 const platform = require('os').platform();
 const isPlatformWindows = /^win/.test(platform);
 
 module.exports = function (grunt) {
-  grunt.registerTask('uiFramework:build', function () {
+  grunt.initConfig({
+    clean: {
+      target: ['target'],
+    },
+    copy: {
+      makeProdBuild: {
+        expand: true,
+        src: [
+          'components/**/*',
+          'dist/**/*',
+          'src/**/*',
+          'package.json',
+          '!**/*.test.js',
+          '!**/__snapshots__/**/*',
+        ],
+        dest: 'target',
+      }
+    },
+    babel: {
+      prodBuild: {
+        expand: true,
+        src: [
+          'target/components/**/*.js',
+          'target/src/**/*.js',
+        ],
+        dest: '.',
+        options: {
+          presets: [
+            require.resolve('@kbn/babel-preset/webpack')
+          ]
+        },
+      }
+    }
+  });
+
+  grunt.loadNpmTasks('grunt-babel');
+  grunt.loadNpmTasks('grunt-contrib-clean');
+  grunt.loadNpmTasks('grunt-contrib-copy');
+  grunt.registerTask('prodBuild', ['clean:target', 'copy:makeProdBuild', 'babel:prodBuild']);
+
+  grunt.registerTask('docSiteBuild', function () {
     const done = this.async();
 
     const serverCmd = {
       cmd: isPlatformWindows ? '.\\node_modules\\.bin\\webpack.cmd' : './node_modules/.bin/webpack',
       args: [
         '-p',
-        '--config=ui_framework/doc_site/webpack.config.js',
+        '--config=doc_site/webpack.config.js',
         '--devtool=null', // Prevent the source map from being generated
       ],
       opts: { stdio: 'inherit' }
@@ -40,12 +80,12 @@ module.exports = function (grunt) {
     uiFrameworkServerBuild.then(done);
   });
 
-  grunt.registerTask('uiFramework:start', function () {
+  grunt.registerTask('docSiteStart', function () {
     const done = this.async();
     Promise.all([uiFrameworkWatch(), uiFrameworkServerStart()]).then(done);
   });
 
-  grunt.registerTask('uiFramework:compileCss', function () {
+  grunt.registerTask('compileCss', function () {
     const done = this.async();
     uiFrameworkCompile().then(done);
   });
@@ -54,10 +94,10 @@ module.exports = function (grunt) {
     const serverCmd = {
       cmd: isPlatformWindows ? '.\\node_modules\\.bin\\webpack-dev-server.cmd' : './node_modules/.bin/webpack-dev-server',
       args: [
-        '--config=ui_framework/doc_site/webpack.config.js',
+        '--config=doc_site/webpack.config.js',
         '--hot',
         '--inline',
-        '--content-base=ui_framework/doc_site/build',
+        '--content-base=doc_site/build',
         '--host=0.0.0.0',
         '--port=8020',
       ],
@@ -83,8 +123,8 @@ module.exports = function (grunt) {
   }
 
   function uiFrameworkCompile() {
-    const src = 'ui_framework/src/index.scss';
-    const dest = 'ui_framework/dist/ui_framework.css';
+    const src = 'src/index.scss';
+    const dest = 'dist/ui_framework.css';
 
     return new Promise(resolve => {
       sass.render({
@@ -116,7 +156,7 @@ module.exports = function (grunt) {
       grunt.util.spawn({
         cmd: isPlatformWindows ? '.\\node_modules\\.bin\\grunt.cmd' : './node_modules/.bin/grunt',
         args: [
-          'uiFramework:compileCss',
+          'compileCss',
         ],
       }, (error, result) => {
         if (error) {
@@ -130,7 +170,7 @@ module.exports = function (grunt) {
     return new Promise(() => {
       debouncedCompile();
 
-      chokidar.watch('ui_framework/src', { ignoreInitial: true }).on('all', (event, path) => {
+      chokidar.watch('src', { ignoreInitial: true }).on('all', (event, path) => {
         grunt.log.writeln(event, path);
         debouncedCompile();
       });

packages/kbn-ui-framework/README.md

@@ -25,10 +25,10 @@ See the documentation in [`scripts/jest.js`](../scripts/jest.js) for more option
 
 There are four steps to creating a new component:
 
-1. Create the SCSS for the component in `ui_framework/src/components`.
+1. Create the SCSS for the component in `packages/kbn-ui-framework/src/components`.
 2. Create the React portion of the component.
 3. Write tests.
-4. Document it with examples in `ui_framework/doc_site`.
+4. Document it with examples in `packages/kbn-ui-framework/doc_site`.
 
 You can do this using Yeoman (the easy way), or you can do it manually (the hard way).
 
@@ -77,13 +77,13 @@ and re-export the generated JS and SCSS files.
 
 #### Create component SCSS
 
-1. Create a directory for your component in `ui_framework/src/components`.
+1. Create a directory for your component in `packages/kbn-ui-framework/src/components`.
 2. In this directory, create `_{component name}.scss`.
 3. _Optional:_ Create any other components that should be [logically-grouped](#logically-grouped-components)
 in this directory.
 4. Create an `_index.scss` file in this directory that import all of the new component SCSS files
 you created.
-5. Import the `_index.scss` file into `ui_framework/src/components/index.scss`.
+5. Import the `_index.scss` file into `packages/kbn-ui-framework/src/components/index.scss`.
 
 This makes your styles available to Kibana and the UI Framework documentation.
 
@@ -91,7 +91,7 @@ This makes your styles available to Kibana and the UI Framework documentation.
 
 1. Create the React component(s) in the same directory as the related SCSS file(s).
 2. Export these components from an `index.js` file.
-3. Re-export these components from `ui_framework/src/components/index.js`.
+3. Re-export these components from `packages/kbn-ui-framework/src/components/index.js`.
 
 This makes your React component available for import into Kibana.
 
@@ -107,11 +107,11 @@ To see how well the components have been covered by tests, you can run
 
 #### Document the component with examples
 
-1. Create a directory for your example in `ui_framework/doc_site/src/views`. Name it the name of the
+1. Create a directory for your example in `packages/kbn-ui-framework/doc_site/src/views`. Name it the name of the
 component.
 2. Create a `{component name}_example.js` file inside the directory. You'll use this file to define
 the different examples for your component.
-3. Add the route to this file in `ui_framework/doc_site/src/services/routes/Routes.js`.
+3. Add the route to this file in `packages/kbn-ui-framework/doc_site/src/services/routes/Routes.js`.
 4. In the `{component name}_example.js` file you created, define examples which demonstrate the component and describe
 its role from a UI perspective.
 

packages/kbn-ui-framework/doc_site/src/images/elastic-logo.svg

@@ -1,3 +1,3 @@
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" viewBox="-155 383.3 687.5 235.7" xml:space="preserve" enable-background="new -155 383.3 687.5 235.7">
-<path fill="#FFFFFF" d="M81.6 506.8c0-19.8-12.3-37.2-30.8-43.9 0.8-4.2 1.2-8.4 1.2-12.7 0-36.9-30-66.9-66.8-66.9 -21.6 0-41.6 10.3-54.2 27.7 -6.2-4.8-13.8-7.4-21.7-7.4 -19.6 0-35.5 15.9-35.5 35.5 0 4.3 0.8 8.5 2.2 12.4 -18.4 6.6-31 24.3-31 44 0 19.9 12.4 37.3 30.9 44 -0.8 4.1-1.2 8.4-1.2 12.7 0 36.8 29.9 66.7 66.7 66.7 21.6 0 41.6-10.4 54.1-27.8 6.2 4.9 13.8 7.6 21.7 7.6 19.6 0 35.5-15.9 35.5-35.5 0-4.3-0.8-8.5-2.2-12.4C68.9 544.2 81.6 526.5 81.6 506.8"/><path fill="#FED10A" d="M-62 484.8l51.8 23.6L42 462.6c0.8-3.8 1.1-7.5 1.1-11.5 0-32.2-26.2-58.4-58.4-58.4 -19.3 0-37.2 9.5-48.1 25.4l-8.7 45.1L-62 484.8z"/><path fill="#24BBB1" d="M-115.6 539.6c-0.8 3.8-1.1 7.7-1.1 11.7 0 32.3 26.3 58.5 58.6 58.5 19.4 0 37.5-9.6 48.4-25.6l8.6-44.9 -11.5-22 -52-23.7L-115.6 539.6z"/><path fill="#EF5098" d="M-115.9 450l35.5 8.4 7.8-40.3c-4.8-3.7-10.8-5.7-17-5.7 -15.4 0-28 12.5-28 28C-117.6 443.7-117 447-115.9 450"/><path fill="#17A8E0" d="M-119 458.5c-15.8 5.2-26.9 20.4-26.9 37.1 0 16.3 10.1 30.8 25.2 36.6l49.8-45 -9.1-19.5L-119 458.5z"/><path fill="#93C83E" d="M-0.7 584.2c4.9 3.7 10.8 5.8 16.9 5.8 15.4 0 28-12.5 28-28 0-3.4-0.6-6.7-1.7-9.7L7.1 544 -0.7 584.2z"/><path fill="#0779A1" d="M6.5 534.7l39 9.1c15.9-5.2 26.9-20.4 26.9-37.2 0-16.2-10.1-30.8-25.2-36.5l-51 44.7L6.5 534.7z"/><path d="M175.8 548.8l4.7-0.5 0.3 9.6c-12.4 1.7-23 2.6-31.8 2.6 -11.7 0-20-3.4-24.9-10.2s-7.3-17.4-7.3-31.7c0-28.6 11.4-42.9 34.1-42.9 11 0 19.2 3.1 24.6 9.2s8.1 15.8 8.1 28.9l-0.7 9.3h-53.8c0 9 1.6 15.7 4.9 20 3.3 4.3 8.9 6.5 17 6.5C159.2 549.8 167.4 549.5 175.8 548.8zM171.4 513.5c0-10-1.6-17.1-4.8-21.2 -3.2-4.1-8.4-6.2-15.6-6.2s-12.7 2.2-16.3 6.5c-3.6 4.3-5.5 11.3-5.6 20.9H171.4z"/><path d="M200.6 559V442h12.2v117H200.6z"/><path d="M289.9 502.1v40.1c0 4.1 10.1 4.9 10.1 4.9l-0.6 10.8c-8.6 0-15.7 0.7-20-3.4 -9.8 4.3-19.5 6.1-29.3 6.1 -7.5 0-13.2-2.1-17.1-6.4 -3.9-4.2-5.9-10.3-5.9-18.3 0-7.9 2-13.8 6-17.5 4-3.7 10.3-6.1 18.9-6.9l25.6-2.4v-7c0-5.5-1.2-9.5-3.6-11.9 -2.4-2.4-5.7-3.6-9.8-3.6h-32.1v-10.8h31.3c9.2 0 15.9 2.1 20.1 6.4C287.8 486.4 289.9 493.1 289.9 502.1zM239.7 535.3c0 10 4.1 15 12.4 15 7.4 0 14.7-1.2 21.8-3.7l3.7-1.3v-26.9l-24.1 2.3c-4.9 0.4-8.4 1.8-10.6 4.2C240.7 527.3 239.7 530.8 239.7 535.3z"/><path d="M337.6 486.7c-11.8 0-17.8 4.1-17.8 12.4 0 3.8 1.4 6.5 4.1 8.1s8.9 3.2 18.6 4.9c9.7 1.7 16.5 4 20.5 7.1 4 3 6 8.7 6 17.1 0 8.4-2.7 14.5-8.1 18.4 -5.4 3.9-13.2 5.9-23.6 5.9 -6.7 0-29.2-2.5-29.2-2.5l0.7-10.6c12.9 1.2 22.3 2.2 28.6 2.2 6.3 0 11.1-1 14.4-3s5-5.4 5-10.1 -1.4-7.9-4.2-9.6c-2.8-1.7-9-3.3-18.6-4.8s-16.4-3.7-20.4-6.7c-4-2.9-6-8.4-6-16.3 0-7.9 2.8-13.8 8.4-17.6 5.6-3.8 12.6-5.7 20.9-5.7 6.6 0 29.6 1.7 29.6 1.7v10.7C354.4 487.6 344.5 486.7 337.6 486.7z"/><path d="M428 488.1h-25.9v39c0 9.3 0.7 15.5 2 18.4 1.4 2.9 4.6 4.4 9.7 4.4l14.5-1 0.8 10.1c-7.3 1.2-12.8 1.8-16.6 1.8 -8.5 0-14.3-2.1-17.6-6.2s-4.9-12-4.9-23.6v-42.9h-11.6v-10.6H390v-25h12.1v24.9H428V488.1z"/><path d="M445 459v-14.1h12.2v14.2L445 459 445 459zM445 559v-81.5h12.2V559H445z"/><path d="M510.2 475.8c3.6 0 9.7 0.7 18.3 2l3.9 0.5 -0.5 9.9c-8.7-1-15.1-1.5-19.2-1.5 -9.2 0-15.5 2.2-18.8 6.6s-5 12.6-5 24.5c0 11.9 1.5 20.2 4.6 24.9 3.1 4.7 9.5 7 19.3 7l19.2-1.5 0.5 10.1c-10.1 1.5-17.7 2.3-22.7 2.3 -12.7 0-21.5-3.3-26.3-9.8s-7.3-17.5-7.3-33 2.6-26.4 7.8-32.6C489.3 479 498 475.8 510.2 475.8z"/>
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" viewBox="-155 383.3 687.5 235.7" xml:space="preserve" enable-background="new -155 383.3 687.5 235.7">
+<path fill="#FFFFFF" d="M81.6 506.8c0-19.8-12.3-37.2-30.8-43.9 0.8-4.2 1.2-8.4 1.2-12.7 0-36.9-30-66.9-66.8-66.9 -21.6 0-41.6 10.3-54.2 27.7 -6.2-4.8-13.8-7.4-21.7-7.4 -19.6 0-35.5 15.9-35.5 35.5 0 4.3 0.8 8.5 2.2 12.4 -18.4 6.6-31 24.3-31 44 0 19.9 12.4 37.3 30.9 44 -0.8 4.1-1.2 8.4-1.2 12.7 0 36.8 29.9 66.7 66.7 66.7 21.6 0 41.6-10.4 54.1-27.8 6.2 4.9 13.8 7.6 21.7 7.6 19.6 0 35.5-15.9 35.5-35.5 0-4.3-0.8-8.5-2.2-12.4C68.9 544.2 81.6 526.5 81.6 506.8"/><path fill="#FED10A" d="M-62 484.8l51.8 23.6L42 462.6c0.8-3.8 1.1-7.5 1.1-11.5 0-32.2-26.2-58.4-58.4-58.4 -19.3 0-37.2 9.5-48.1 25.4l-8.7 45.1L-62 484.8z"/><path fill="#24BBB1" d="M-115.6 539.6c-0.8 3.8-1.1 7.7-1.1 11.7 0 32.3 26.3 58.5 58.6 58.5 19.4 0 37.5-9.6 48.4-25.6l8.6-44.9 -11.5-22 -52-23.7L-115.6 539.6z"/><path fill="#EF5098" d="M-115.9 450l35.5 8.4 7.8-40.3c-4.8-3.7-10.8-5.7-17-5.7 -15.4 0-28 12.5-28 28C-117.6 443.7-117 447-115.9 450"/><path fill="#17A8E0" d="M-119 458.5c-15.8 5.2-26.9 20.4-26.9 37.1 0 16.3 10.1 30.8 25.2 36.6l49.8-45 -9.1-19.5L-119 458.5z"/><path fill="#93C83E" d="M-0.7 584.2c4.9 3.7 10.8 5.8 16.9 5.8 15.4 0 28-12.5 28-28 0-3.4-0.6-6.7-1.7-9.7L7.1 544 -0.7 584.2z"/><path fill="#0779A1" d="M6.5 534.7l39 9.1c15.9-5.2 26.9-20.4 26.9-37.2 0-16.2-10.1-30.8-25.2-36.5l-51 44.7L6.5 534.7z"/><path d="M175.8 548.8l4.7-0.5 0.3 9.6c-12.4 1.7-23 2.6-31.8 2.6 -11.7 0-20-3.4-24.9-10.2s-7.3-17.4-7.3-31.7c0-28.6 11.4-42.9 34.1-42.9 11 0 19.2 3.1 24.6 9.2s8.1 15.8 8.1 28.9l-0.7 9.3h-53.8c0 9 1.6 15.7 4.9 20 3.3 4.3 8.9 6.5 17 6.5C159.2 549.8 167.4 549.5 175.8 548.8zM171.4 513.5c0-10-1.6-17.1-4.8-21.2 -3.2-4.1-8.4-6.2-15.6-6.2s-12.7 2.2-16.3 6.5c-3.6 4.3-5.5 11.3-5.6 20.9H171.4z"/><path d="M200.6 559V442h12.2v117H200.6z"/><path d="M289.9 502.1v40.1c0 4.1 10.1 4.9 10.1 4.9l-0.6 10.8c-8.6 0-15.7 0.7-20-3.4 -9.8 4.3-19.5 6.1-29.3 6.1 -7.5 0-13.2-2.1-17.1-6.4 -3.9-4.2-5.9-10.3-5.9-18.3 0-7.9 2-13.8 6-17.5 4-3.7 10.3-6.1 18.9-6.9l25.6-2.4v-7c0-5.5-1.2-9.5-3.6-11.9 -2.4-2.4-5.7-3.6-9.8-3.6h-32.1v-10.8h31.3c9.2 0 15.9 2.1 20.1 6.4C287.8 486.4 289.9 493.1 289.9 502.1zM239.7 535.3c0 10 4.1 15 12.4 15 7.4 0 14.7-1.2 21.8-3.7l3.7-1.3v-26.9l-24.1 2.3c-4.9 0.4-8.4 1.8-10.6 4.2C240.7 527.3 239.7 530.8 239.7 535.3z"/><path d="M337.6 486.7c-11.8 0-17.8 4.1-17.8 12.4 0 3.8 1.4 6.5 4.1 8.1s8.9 3.2 18.6 4.9c9.7 1.7 16.5 4 20.5 7.1 4 3 6 8.7 6 17.1 0 8.4-2.7 14.5-8.1 18.4 -5.4 3.9-13.2 5.9-23.6 5.9 -6.7 0-29.2-2.5-29.2-2.5l0.7-10.6c12.9 1.2 22.3 2.2 28.6 2.2 6.3 0 11.1-1 14.4-3s5-5.4 5-10.1 -1.4-7.9-4.2-9.6c-2.8-1.7-9-3.3-18.6-4.8s-16.4-3.7-20.4-6.7c-4-2.9-6-8.4-6-16.3 0-7.9 2.8-13.8 8.4-17.6 5.6-3.8 12.6-5.7 20.9-5.7 6.6 0 29.6 1.7 29.6 1.7v10.7C354.4 487.6 344.5 486.7 337.6 486.7z"/><path d="M428 488.1h-25.9v39c0 9.3 0.7 15.5 2 18.4 1.4 2.9 4.6 4.4 9.7 4.4l14.5-1 0.8 10.1c-7.3 1.2-12.8 1.8-16.6 1.8 -8.5 0-14.3-2.1-17.6-6.2s-4.9-12-4.9-23.6v-42.9h-11.6v-10.6H390v-25h12.1v24.9H428V488.1z"/><path d="M445 459v-14.1h12.2v14.2L445 459 445 459zM445 559v-81.5h12.2V559H445z"/><path d="M510.2 475.8c3.6 0 9.7 0.7 18.3 2l3.9 0.5 -0.5 9.9c-8.7-1-15.1-1.5-19.2-1.5 -9.2 0-15.5 2.2-18.8 6.6s-5 12.6-5 24.5c0 11.9 1.5 20.2 4.6 24.9 3.1 4.7 9.5 7 19.3 7l19.2-1.5 0.5 10.1c-10.1 1.5-17.7 2.3-22.7 2.3 -12.7 0-21.5-3.3-26.3-9.8s-7.3-17.5-7.3-33 2.6-26.4 7.8-32.6C489.3 479 498 475.8 510.2 475.8z"/>
 </svg>

packages/kbn-ui-framework/doc_site/src/main.scss

@@ -1,3 +1,3 @@
-@import "../../../node_modules/@elastic/eui/src/global_styling/index";
+@import "~@elastic/eui/src/global_styling/index";
 @import "../../dist/ui_framework.css";
 @import "./components/guide_components";

packages/kbn-ui-framework/doc_site/src/views/app_view.js

@@ -13,7 +13,7 @@ import {
 } from '../components';
 
 // Inject version into header.
-const pkg = require('../../../../package.json');
+const pkg = require('../../../../../package.json');
 
 export class AppView extends Component {
   constructor(props) {