Fixes liferay#1268 - Create deltemplate for dropdown item separator

bryceosterhaus · Nov 5, 2018 · f998eb7 · f998eb7
1 parent fe22795
commit f998eb7
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 22 deletions.
diff --git a/packages/clay-dropdown/src/ClayDropdownBase.soy b/packages/clay-dropdown/src/ClayDropdownBase.soy
@@ -114,6 +114,12 @@
 			{param spritemap: $spritemap /}
 			{param title: $item.title /}
 		{/call}
+
+		{if $item.separator}
+			{call ClayDropdownItem.render}
+				{param contentRenderer: 'separator' /}
+			{/call}
+		{/if}
 	{/for}
 {/template}
 

diff --git a/packages/clay-dropdown/src/ClayDropdownItem.js b/packages/clay-dropdown/src/ClayDropdownItem.js
@@ -140,7 +140,7 @@ ClayDropdownItem.STATE = {
 	 * @memberof ClayDropdownItem
 	 * @type {?(string|undefined)}
 	 */
-	label: itemShape.label.required(),
+	label: itemShape.label,
 
 	/**
 	 * Number of max child items of the item.

diff --git a/packages/clay-dropdown/src/ClayDropdownItem.soy b/packages/clay-dropdown/src/ClayDropdownItem.soy
@@ -4,7 +4,6 @@
  *
  */
 {template .render}
-	{@param label: string}
 	{@param? _handleItemClick: any}
 	{@param? active: bool}
 	{@param? checked: bool}
@@ -16,6 +15,7 @@
 	{@param? inputValue: string}
 	{@param? items: list<?>}
 	{@param? itemsIconAlignment: string}
+	{@param? label: string}
 	{@param? maxItems: int}
 	{@param? separator: bool}
 	{@param? spritemap: string}
@@ -131,10 +131,6 @@
 	<li {$itemAttributes}>
 		{$itemContent}
 	</li>
-
-	{if $separator}
-		<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
-	{/if}
 {/deltemplate}
 
 /**
@@ -181,10 +177,6 @@
 	<li {$itemAttributes}>
 		{$checkbox}
 	</li>
-
-	{if $separator}
-		<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
-	{/if}
 {/deltemplate}
 
 /**
@@ -222,10 +214,6 @@
 			{param spritemap: $spritemap /}
 		{/call}
 	{/if}
-
-	{if $separator}
-		<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
-	{/if}
 {/deltemplate}
 
 /**
@@ -272,10 +260,6 @@
 	<li {$itemAttributes}>
 		{$radio}
 	</li>
-
-	{if $separator}
-		<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
-	{/if}
 {/deltemplate}
 
 
@@ -319,8 +303,27 @@
 			</ul>
 		{/if}
 	</li>
+{/deltemplate}
 
-	{if $separator}
-		<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
-	{/if}
-{/deltemplate}
+/**
+ * Renders list separator
+ */
+{deltemplate ClayDropdownItem.Item variant="'separator'"}
+	{@param label: string}
+	{@param? _handleItemClick: any}
+	{@param? active: bool}
+	{@param? checked: bool}
+	{@param? disabled: bool}
+	{@param? href: string}
+	{@param? icon: string}
+	{@param? inputName: string}
+	{@param? inputValue: string}
+	{@param? items: list<?>}
+	{@param? itemsIconAlignment: string}
+	{@param? maxItems: int}
+	{@param? separator: bool}
+	{@param? spritemap: string}
+	{@param? title: string}
+
+	<li aria-hidden="true" class="dropdown-divider" role="presentation"></li>
+{/deltemplate}