Merge pull request #951 from carloslancha/issue-899-add-label-to-mana…

…gement-checkbox Add label to checkbox on Management Toolbar | Fixes #899
liferay · May 29, 2018 · 8e81163 · 8e81163
2 parents 0964626 + c69abcd
commit 8e81163
Show file tree

Hide file tree

Showing 5 changed files with 74 additions and 1 deletion.
diff --git a/packages/clay-management-toolbar/demos/a11y.html b/packages/clay-management-toolbar/demos/a11y.html
@@ -87,6 +87,13 @@ <h4>Without Search</h4>
 		</div>
 	</div>
 
+	<div class="row row-spacing">
+		<div class="col">
+			<h4>Without Filters, Sorting and Search</h4>
+			<div id="without-filter-sorting-search-block"></div>
+		</div>
+	</div>
+
 	<div class="row row-spacing">
 		<div class="col">
 			<h4>With search results bar</h4>
@@ -486,6 +493,15 @@ <h4>With search results bar with active state</h4>
 		},
 		'#without-search-block');
 
+		//Without Filters, Sorting and Search
+		new metal.ClayManagementToolbar({
+			showSearch: false,
+			selectable: true,
+			spritemap: spritemap,
+			viewTypes: viewTypes,
+		},
+		'#without-filter-sorting-search-block');
+
 		//With search results bar
 		new metal.ClayManagementToolbar({
 			creationMenu: true,

diff --git a/packages/clay-management-toolbar/demos/index.html b/packages/clay-management-toolbar/demos/index.html
@@ -87,6 +87,13 @@ <h4>Without Search</h4>
 		</div>
 	</div>
 
+	<div class="row row-spacing">
+		<div class="col">
+			<h4>Without Filters, Sorting and Search</h4>
+			<div id="without-filter-sorting-search-block"></div>
+		</div>
+	</div>
+
 	<div class="row row-spacing">
 		<div class="col">
 			<h4>With search results bar</h4>
@@ -560,6 +567,15 @@ <h4>With search results bar with active state</h4>
 		},
 		'#without-search-block');
 
+		//Without Filters, Sorting and Search
+		new metal.ClayManagementToolbar({
+			showSearch: false,
+			selectable: true,
+			spritemap: spritemap,
+			viewTypes: viewTypes,
+		},
+		'#without-filter-sorting-search-block');
+
 		//With search results bar
 		new metal.ClayManagementToolbar({
 			events: {

diff --git a/packages/clay-management-toolbar/src/ClayManagementToolbar.soy b/packages/clay-management-toolbar/src/ClayManagementToolbar.soy
@@ -493,7 +493,7 @@
 							{/param}
 
 							{param ref: 'selectPageCheckbox' /}
-							{param showLabel: false /}
+							{param showLabel: not $filterItems and not $sortingOrder and not $showSearch /}
 						{/call}
 					</li>
 				{/if}

diff --git a/packages/clay-management-toolbar/src/__tests__/ClayManagementToolbar.js b/packages/clay-management-toolbar/src/__tests__/ClayManagementToolbar.js
@@ -100,6 +100,16 @@ describe('ClayManagementToolbar', function() {
 		expect(managementToolbar).toMatchSnapshot();
 	});
 
+	it('should render a management toolbar with selection enabled and no filters, sorting and search', () => {
+		managementToolbar = new ClayManagementToolbar({
+			selectable: true,
+			showSearch: false,
+			spritemap: spritemap,
+		});
+
+		expect(managementToolbar).toMatchSnapshot();
+	});
+
 	it('should render a management toolbar with ascending sorting', () => {
 		managementToolbar = new ClayManagementToolbar({
 			sortingOrder: 'asc',

diff --git a/packages/clay-management-toolbar/src/__tests__/__snapshots__/ClayManagementToolbar.js.snap b/packages/clay-management-toolbar/src/__tests__/__snapshots__/ClayManagementToolbar.js.snap
@@ -2181,6 +2181,37 @@ exports[`ClayManagementToolbar should render a management toolbar with selection
 </div>
 `;
 
+exports[`ClayManagementToolbar should render a management toolbar with selection enabled and no filters, sorting and search 1`] = `
+<div>
+  <nav class="management-bar management-bar-light navbar navbar-expand-md">
+    <div class="container-fluid container-fluid-max-xl">
+      <ul class="navbar-nav">
+        <li class="nav-item">
+          <div class="custom-control custom-checkbox">
+            <label>
+              <input class="custom-control-input" ref="input" type="checkbox">
+              <span class="custom-control-label">
+                <span class="custom-control-label-text">select-page</span>
+              </span>
+            </label>
+          </div>
+        </li>
+      </ul>
+      <ul class="navbar-nav">
+        <li class="nav-item">
+          <button class="btn nav-btn nav-btn-monospaced btn-primary" aria-label="plus" type="button">
+            <svg aria-hidden="true" class="lexicon-icon lexicon-icon-plus" focusable="false">
+              <title>plus</title>
+              <use xlink:href="../node_modules/clay-css/lib/images/icons/icons.svg#plus"></use>
+            </svg>
+          </button>
+        </li>
+      </ul>
+    </div>
+  </nav>
+</div>
+`;
+
 exports[`ClayManagementToolbar should render a management toolbar with sorting href 1`] = `
 <div>
   <nav class="management-bar management-bar-light navbar navbar-expand-md">