2.0.1

packages/clay-charts/src/ChartBase.js

@@ -1195,7 +1195,7 @@ ChartBase.STATE = {
 		focus: Config.shapeOf({
 			expand: Config.shapeOf({
 				enabled: Config.bool(),
-				r: Config.bool(),
+				r: Config.number(),
 			}),
 			select: Config.shapeOf({
 				r: Config.number(),

packages/clay-css/src/scss/functions/_global-functions.scss

@@ -191,6 +191,8 @@
 
 	'align-right': '<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path class="lexicon-icon-outline" d="M512 64c0-17.664-14.336-32-32-32H160c-17.664 0-32 14.336-32 32s14.336 32 32 32h320c17.664 0 32-14.336 32-32zM512 192c0-17.664-14.336-32-32-32H32c-17.664 0-32 14.336-32 32s14.336 32 32 32h448c17.664 0 32-14.299 32-32zM512 320c0-17.701-14.336-32-32-32H160c-17.664 0-32 14.336-32 32s14.336 32 32 32h320c17.664 0 32-14.336 32-32zM0 448c0 17.664 14.336 32 32 32h448c17.664 0 32-14.336 32-32s-14.336-32-32-32H32c-17.664 0-32 14.336-32 32z" fill="#{$color}"/></svg>',
 
+	'analytics': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="analytics-bar1 lexicon-icon-outline" d="M96 415.8H32c-17.7 0-32 14.3-32 32v32c0 17.7 14.3 32 32 32h64c17.7 0 32-14.3 32-32v-32c0-17.7-14.3-32-32-32z" fill="#{$color}"/><path class="analytics-bar2 lexicon-icon-outline" d="M288 319.8h-64c-17.7 0-32 14.3-32 32v128c0 17.7 14.3 32 32 32h64c17.7 0 32-14.3 32-32v-128c0-17.7-14.3-32-32-32z" fill="#{$color}"/><path class="analytics-bar3 lexicon-icon-outline" d="M480 223.8h-64c-17.7 0-32 14.3-32 32v224c0 17.7 14.3 32 32 32h64c17.7 0 32-14.3 32-32v-224c0-17.7-14.3-32-32-32z" fill="#{$color}"/><path class="analytics-uptrend-arrow lexicon-icon-outline" d="M415 110.2v23.6c3.1 44.2 64.6 41.3 64.8 0V32.6c0-17.9-13.2-32.4-32.4-32.4H346.1c-42.8 2.3-43.2 61.9 0 64.8h23.6l-95.3 94.9-114.2-.2h-.1c-10.1 0-19.5 4.7-25.6 12.8L38.6 300.3c-24.2 35.4 25.4 70.9 51.2 38.4l86.5-115.1 111.4.2h.1c8.5 0 16.6-3.4 22.6-9.3L415 110.2z" fill="#{$color}"/></svg>',
+
 	'angle-down': '<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path class="lexicon-icon-outline" d="M256 384a28.207 28.207 0 0 0 19.111-8.272l227.221-227.221c11.058-11.026 11.058-28.941 0-39.999-11.026-11.058-28.94-11.058-39.999 0L256 314.841 49.667 108.508c-11.059-11.058-28.973-11.058-39.999 0-11.059 11.058-11.059 28.972 0 39.999l227.221 227.221A28.194 28.194 0 0 0 256 384z" fill="#{$color}"/></svg>',
 
 	'angle-left': '<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path class="lexicon-icon-outline" d="M114.106 254.607c.22 6.936 2.972 13.811 8.272 19.11L349.6 500.938c11.026 11.058 28.94 11.058 39.999 0 11.058-11.026 11.058-28.94 0-39.999L183.266 254.606 389.599 48.273c11.058-11.059 11.058-28.973 0-39.999-11.058-11.059-28.973-11.059-39.999 0L122.379 235.495c-5.3 5.3-8.052 12.174-8.273 19.111z" fill="#{$color}"/></svg>',
@@ -587,6 +589,8 @@
 
 	'product-menu': '<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path class="lexicon-icon-body" fill="none" d="M176 512H48c-26.5 0-48-21.5-48-48V48C0 21.5 21.5 0 48 0h128c26.5 0 48 21.5 48 48v416c0 26.5-21.5 48-48 48z"/><path class="lexicon-icon-outline" d="M176 512H48c-26.5 0-48-21.5-48-48V48C0 21.5 21.5 0 48 0h128c26.5 0 48 21.5 48 48v416c0 26.5-21.5 48-48 48zM64 448h96V64H64v384zM480 64H320c-17.7 0-32-14.3-32-32s14.3-32 32-32h160c17.7 0 32 14.3 32 32s-14.3 32-32 32zM480 288H320c-17.7 0-32-14.3-32-32s14.3-32 32-32h160c17.7 0 32 14.3 32 32s-14.3 32-32 32zM480 512H320c-17.7 0-32-14.3-32-32s14.3-32 32-32h160c17.7 0 32 14.3 32 32s-14.3 32-32 32z" fill="#{$color}"/></svg>',
 
+	'propagation': '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="lexicon-icon-outline propagation-arrow-bottom-right" d="M379.4 229.1L480 329.6v-12c0-21.1 31.5-21.2 32 0V368c0 8.8-7.2 16-16 16h-50.4c-21.7-.8-20.7-31.8 0-32h11.5L356.8 251.7c-14.8-17.1 8.1-36.9 22.6-22.6z" fill="#{$color}"/><path class="lexicon-icon-outline propagation-arrow-bottom-left" d="M132.6 229.1L32 329.6v-12c0-21.1-31.5-21.2-32 0V368c0 8.8 7.2 16 16 16h50.4c21.7-.8 20.7-31.8 0-32H54.9l100.3-100.3c14.8-17.1-8.1-36.9-22.6-22.6z" fill="#{$color}"/><path class="lexicon-icon-outline propagation-arrow-bottom" d="M240.2 304.2v153.4l-8.5-8.5c-14.9-14.9-37.3 7.3-22.6 22.6l35.6 35.6c6.2 6.2 16.4 6.2 22.6 0l35.6-35.6c14.8-15.9-7.8-37.1-22.6-22.6l-8.1 8.1v-153c-1.7-22.5-31.9-20.4-32 0z" fill="#{$color}"/><circle class="lexicon-icon-outline propagation-circle" cx="256" cy="112" r="112" fill="#{$color}"/></svg>',
+
 	'question-circle-full': '<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path class="lexicon-icon-outline" d="M256 0C114.63 0 0 114.6 0 256c0 141.37 114.629 256 256 256s256-114.63 256-256C512 114.6 397.37 0 256 0zm13.605 360.769c-4.974 4.827-10.913 7.226-17.876 7.226s-12.873-2.428-17.73-7.226c-4.857-4.827-7.285-10.708-7.285-17.613 0-6.933 2.428-12.844 7.285-17.788 4.857-4.915 10.767-7.402 17.73-7.402s12.932 2.457 17.876 7.402c4.945 4.945 7.431 10.854 7.431 17.788 0 6.905-2.457 12.786-7.431 17.613zm51.433-128.263c-5.705 8.923-13.283 16.735-22.791 23.464l-12.99 9.128c-5.5 3.979-9.714 8.455-12.668 13.37-2.955 4.945-4.447 10.649-4.447 17.145v1.901H233.94c-.439-2.106-.731-4.184-.936-6.291s-.321-4.301-.321-6.612c0-8.397 1.901-16.413 5.705-24.079s10.24-14.834 19.309-21.563l15.185-11.322c9.07-6.7 13.605-15.009 13.605-24.869 0-3.57-.644-7.08-1.901-10.533s-3.219-6.495-5.851-9.128c-2.633-2.633-5.969-4.71-9.977-6.291s-8.66-2.369-13.927-2.369c-5.705 0-10.561 1.054-14.571 3.16s-7.343 4.769-9.977 8.017c-2.633 3.247-4.594 7.022-5.851 11.322s-1.901 8.66-1.901 13.049c0 4.213.41 7.548 1.258 10.065l-39.877-1.58a38.076 38.076 0 0 1-1.258-7.08 83.41 83.41 0 0 1-.321-7.08c0-8.397 1.58-16.619 4.74-24.693s7.812-15.214 13.927-21.416c6.114-6.173 13.663-11.176 22.645-14.951s19.368-5.676 31.188-5.676c12.229 0 22.996 1.785 32.3 5.355 9.274 3.57 17.087 8.25 23.435 14.014 6.319 5.764 11.089 12.434 14.248 19.982s4.74 15.331 4.74 23.289c.058 12.581-2.809 23.347-8.514 32.27z" fill="#{$color}"/></svg>',
 
 	'question-circle': '<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path class="lexicon-icon-body" fill="none" d="M491.4 155.8C478.5 125.3 460 98 436.5 74.5s-50.9-41.9-81.4-54.8C323.6 6.3 290-.5 255.5-.5s-68.1 6.8-99.7 20.1C125.3 32.5 98 51 74.5 74.5s-41.9 50.9-54.8 81.4C6.3 187.4-.5 221-.5 255.5s6.8 68.1 20.1 99.7C32.5 385.7 51 413 74.5 436.5s50.9 41.9 81.4 54.8c31.6 13.4 65.1 20.1 99.7 20.1s68.1-6.8 99.7-20.1c30.5-12.9 57.9-31.3 81.4-54.8s41.9-50.9 54.8-81.4c13.4-31.6 20.1-65.1 20.1-99.7s-6.9-68-20.2-99.6z"/><path class="lexicon-icon-outline" d="M491.4 155.8C478.5 125.3 460 98 436.5 74.5s-50.9-41.9-81.4-54.8C323.6 6.3 290-.5 255.5-.5s-68.1 6.8-99.7 20.1C125.3 32.5 98 51 74.5 74.5s-41.9 50.9-54.8 81.4C6.3 187.4-.5 221-.5 255.5s6.8 68.1 20.1 99.7C32.5 385.7 51 413 74.5 436.5s50.9 41.9 81.4 54.8c31.6 13.4 65.1 20.1 99.7 20.1s68.1-6.8 99.7-20.1c30.5-12.9 57.9-31.3 81.4-54.8s41.9-50.9 54.8-81.4c13.4-31.6 20.1-65.1 20.1-99.7s-6.9-68-20.2-99.6zM255.5 447.5c-106 0-192-86-192-192s86-192 192-192 192 86 192 192-86 192-192 192z" fill="#{$color}"/><path class="lexicon-icon-outline" d="M236 287.9c-.4-1.9-.7-3.8-.9-5.7s-.3-3.9-.3-6c0-7.6 1.7-14.9 5.2-21.9s9.3-13.5 17.6-19.6l13.8-10.3c8.2-6.1 12.4-13.6 12.4-22.6 0-3.2-.6-6.4-1.7-9.6s-2.9-5.9-5.3-8.3-5.4-4.3-9.1-5.7-7.9-2.2-12.7-2.2c-5.2 0-9.6 1-13.2 2.9s-6.7 4.3-9.1 7.3c-2.4 3-4.2 6.4-5.3 10.3s-1.7 7.9-1.7 11.9c0 3.8.4 6.9 1.1 9.1l-36.3-1.4c-.6-2.1-1-4.2-1.1-6.4-.2-2.2-.3-4.3-.3-6.4 0-7.6 1.4-15.1 4.3-22.4s7.1-13.8 12.7-19.5c5.6-5.6 12.4-10.2 20.6-13.6s17.6-5.2 28.4-5.2c11.1 0 20.9 1.6 29.4 4.9 8.4 3.2 15.5 7.5 21.3 12.7 5.7 5.2 10.1 11.3 13 18.2s4.3 13.9 4.3 21.2c0 11.4-2.6 21.2-7.8 29.3s-12.1 15.2-20.7 21.3l-11.8 8.3c-5 3.6-8.8 7.7-11.5 12.2-2.7 4.5-4 9.7-4 15.6v1.7l-31.3-.1zM229.4 329.4c0-6.3 2.2-11.7 6.6-16.2 4.4-4.5 9.8-6.7 16.1-6.7s11.8 2.2 16.3 6.7 6.8 9.9 6.8 16.2-2.3 11.6-6.8 16-9.9 6.6-16.3 6.6-11.7-2.2-16.1-6.6-6.6-9.7-6.6-16z" fill="#{$color}"/></svg>',

packages/clay-dataset-display/package.json

@@ -33,6 +33,7 @@
     "clay-management-toolbar": "^2.0.0",
     "clay-table": "^2.0.0",
     "metal": "^2.16.0",
+    "metal-component": "^2.16.0",
     "metal-soy": "^2.16.0",
     "metal-state": "^2.16.0",
     "metal-web-component": "^2.16.0"

packages/clay-dropdown/package.json

@@ -35,6 +35,7 @@
     "clay-portal": "^2.0.0",
     "clay-radio": "^2.0.0",
     "metal": "^2.16.0",
+    "metal-component": "^2.16.0",
     "metal-dom": "^2.16.0",
     "metal-events": "^2.16.0",
     "metal-position": "^2.1.0",

packages/clay-management-toolbar/package.json

@@ -34,6 +34,7 @@
     "clay-icon": "^2.0.0",
     "clay-link": "^2.0.0",
     "metal": "^2.16.0",
+    "metal-component": "^2.16.0",
     "metal-soy": "^2.16.0",
     "metal-state": "^2.16.0",
     "metal-web-component": "^2.16.0"

packages/clayui.com/.gitignore

@@ -1,3 +1,4 @@
+clay
 claycss.json
 dist
 node_modules

packages/clayui.com/electric.config.js

@@ -1,79 +1,42 @@
 'use strict';
 
-const clay = require('clay');
+const clayCSS = require('clay-css');
 const fs = require('fs');
-const gulp = require('gulp');
+const ncp = require('ncp');
 const path = require('path');
 
-require('gulp-storage')(gulp);
-
-gulp.storage.create('claycss', 'claycss.json');
-
 const generateIconData = require('./utils/icons');
 
-let clayJSPath = path.join(clay.srcDir, 'js');
-
-const clayPath = gulp.storage.get('clayPath');
-let clayIncludePaths = clay.includePaths;
-
-if (clayPath) {
-	clayIncludePaths = path.join(
-		path.join(process.cwd(), clayPath, 'src/scss')
-	);
-
-	console.log(
-		'Warning! using ' +
-			clayIncludePaths +
-			' to compile sass.\nDelete claycss.json to reset.'
-	);
-}
+let clayJSPath = path.join(clayCSS.srcDir, 'js');
 
 const excludedComponents = /.*(pagination|isomorphic)/g;
 const metalComponents = ['electric-clay-components']
 	.concat(fs.readdirSync('../').filter(f => f.match(/^clay-.*/) && !f.match(excludedComponents)));
 const pathSrc = 'src';
-const ignoreDirs = ['components', 'layouts', 'pages', 'partials', 'styles'];
+const ignoreDirs = ['components', 'clay', 'layouts', 'pages', 'partials', 'styles'];
 const ignoreGlob = path.join(
 	'!' + pathSrc,
 	'+(' + ignoreDirs.join('|') + ')/'
 );
+
 const staticSrc = [
 	path.join(pathSrc, '**/*'),
 	path.join('!' + pathSrc, 'site.json'),
 	ignoreGlob,
 	path.join(ignoreGlob, '**/*'),
 ];
 
+ncp(clayCSS.buildDir, path.join(pathSrc, 'clay'));
+
 module.exports = {
 	frontMatterHook: function(data) {
 		return generateIconData(data);
 	},
 	codeMirrorLanguages: ['xml', 'htmlmixed', 'soy'],
 	metalComponents: metalComponents,
-	apiConfig: {
-		layout: 'main',
-		project: {
-			docsConfig: {
-				inferPrivate: '^_',
-				shallow: true,
-			},
-			refs: ['v2.0.0-rc.10', 'v2.0.0-rc.9'],
-			repo: 'clay',
-			soyAPIEntitiesPath: '../../../partials/ElectricAPIEntities.soy.js',
-			src: [
-				'packages/clay-*!(isomorphic)/src/Clay*.js',
-				'packages/clay-charts/src/*.js',
-			],
-			srcPath: 'packages',
-			user: 'liferay',
-		},
-	},
 	resolveModules: ['../../node_modules'],
 	sassOptions: {
-		includePaths: ['node_modules', clayIncludePaths],
-	},
-	entryPoints: {
-		electricAPI: path.join(__dirname, 'src/partials/ElectricAPIBundle.js'),
+		includePaths: ['node_modules', clayCSS.includePaths],
 	},
 	staticSrc: staticSrc,
 	vendorSrc: [
@@ -82,7 +45,7 @@ module.exports = {
 		},
 		{
 			dest: 'dist/vendor/lexicon',
-			src: path.join(clay.buildDir, 'images', 'icons', '*'),
+			src: path.join(clayCSS.buildDir, 'images', 'icons', '*'),
 		},
 		{
 			src: [

packages/clayui.com/package.json

@@ -7,6 +7,7 @@
     "url": "https://github.com/liferay/clayui.com"
   },
   "scripts": {
+    "cdn": "webpack",
     "config": "gulp config",
     "watch": "concurrent --kill-others \"gulp watch\" \"el run\""
   },
@@ -16,6 +17,35 @@
     "metal-storage": "^1.1.0"
   },
   "devDependencies": {
+    "babel-loader": "^7.1.4",
+    "babel-plugin-transform-node-env-inline": "^0.4.0",
+    "babel-preset-env": "^1.6.1",
+    "clay-alert": "^2.0.0-rc.11",
+    "clay-badge": "^2.0.0-rc.11",
+    "clay-button": "^2.0.0-rc.11",
+    "clay-card": "^2.0.0-rc.11",
+    "clay-card-grid": "^2.0.0-rc.11",
+    "clay-charts": "^2.0.0-rc.11",
+    "clay-checkbox": "^2.0.0-rc.11",
+    "clay-collapse": "^2.0.0-rc.11",
+    "clay-component": "^2.0.0-rc.11",
+    "clay-dataset-display": "^2.0.0-rc.11",
+    "clay-dropdown": "^2.0.0-rc.11",
+    "clay-icon": "^2.0.0-rc.11",
+    "clay-label": "^2.0.0-rc.11",
+    "clay-link": "^2.0.0-rc.11",
+    "clay-list": "^2.0.0-rc.11",
+    "clay-management-toolbar": "^2.0.0-rc.11",
+    "clay-modal": "^2.0.0-rc.11",
+    "clay-navigation-bar": "^2.0.0-rc.11",
+    "clay-pagination": "^2.0.0-rc.11",
+    "clay-pagination-bar": "^2.0.0-rc.11",
+    "clay-portal": "^2.0.0-rc.11",
+    "clay-progress-bar": "^2.0.0-rc.11",
+    "clay-radio": "^2.0.0-rc.11",
+    "clay-select": "^2.0.0-rc.11",
+    "clay-sticker": "^2.0.0-rc.11",
+    "clay-table": "^2.0.0-rc.11",
     "concurrently": "^3.5.0",
     "countries-list": "^2.0.0",
     "electric-clay-components": "^3.0.1",
@@ -27,6 +57,9 @@
     "languages": "^0.1.3",
     "lodash": "^4.17.4",
     "metal-toggler": "^2.0.0",
-    "run-sequence": "^1.2.2"
+    "ncp": "^2.0.0",
+    "run-sequence": "^1.2.2",
+    "webpack": "^4.6.0",
+    "webpack-cli": "^2.0.15"
   }
 }

packages/clayui.com/src/clay.js

@@ -0,0 +1,53 @@
+import ClayAlert from 'clay-alert';
+import ClayBadge from 'clay-badge';
+import ClayButton from 'clay-button';
+import ClayCard from 'clay-card';
+import ClayCardGrid from 'clay-card-grid';
+import ClayCheckbox from 'clay-checkbox';
+import ClayCollapse from 'clay-collapse';
+import ClayComponent from 'clay-component';
+import ClayDatasetDisplay from 'clay-dataset-display';
+import ClayDropdown from 'clay-dropdown';
+import ClayIcon from 'clay-icon';
+import ClayLabel from 'clay-label';
+import ClayLink from 'clay-link';
+import ClayList from 'clay-list';
+import ClayManagementToolbar from 'clay-management-toolbar';
+import ClayModal from 'clay-modal';
+import ClayNavigationBar from 'clay-navigation-bar';
+import ClayPagination from 'clay-pagination';
+import ClayPaginationBar from 'clay-pagination-bar';
+import ClayPortal from 'clay-portal';
+import ClayProgressBar from 'clay-progress-bar';
+import ClayRadio from 'clay-radio';
+import ClaySelect from 'clay-select';
+import ClaySticker from 'clay-sticker';
+import ClayTable from 'clay-table';
+
+export {
+	ClayAlert,
+	ClayBadge,
+	ClayButton,
+	ClayCard,
+	ClayCardGrid,
+	ClayCheckbox,
+	ClayCollapse,
+	ClayComponent,
+	ClayDatasetDisplay,
+	ClayDropdown,
+	ClayIcon,
+	ClayLabel,
+	ClayLink,
+	ClayList,
+	ClayManagementToolbar,
+	ClayModal,
+	ClayNavigationBar,
+	ClayPagination,
+	ClayPaginationBar,
+	ClayPortal,
+	ClayProgressBar,
+	ClayRadio,
+	ClaySelect,
+	ClaySticker,
+	ClayTable,
+};

packages/clayui.com/src/pages/docs/components/charts/index.soy

@@ -1,8 +1,8 @@
 ---
 title: "Charts"
 url: "/docs/components/charts/basic/line_chart.html"
-weight: 300
 layout: false
+weight: 100
 ---
 
 {namespace pageDocsComponentsChartsIndex}
@@ -18,4 +18,4 @@ layout: false
       <meta http-equiv="refresh" content="0; URL='{$page.url}'">
     </head>
   </html>
-{/template}
+{/template}