clay-label - npm Package Compare versions

Comparing version 1.0.0-alpha.4 to 1.0.0-alpha.5

lib/ClayLabel.js

@@ -85,2 +85,11 @@ 'use strict';
 	/**
+  * CSS classes to be applied to the element.
+  * @instance
+  * @memberof ClayLabel
+  * @type {?string|undefined}
+  * @default undefined
+  */
+	elementClasses: _metalState.Config.string(),
+
+	/**
   * HREF in label.
@@ -87,0 +96,0 @@ * @instance

lib/ClayLabel.soy.js

@@ -51,2 +51,3 @@ 'use strict';
    *  closeable: (boolean|null|undefined),
+   *  elementClasses: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  handleCloseButtonClick_: (*|null|undefined),
@@ -61,6 +62,6 @@ *  href: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  icon: (null|undefined|{alignment: (!goog.soy.data.SanitizedContent|string), spritemap: (!goog.soy.data.SanitizedContent|string), symbol: (!goog.soy.data.SanitizedContent|string)}),
-   *  elementClasses: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  ariaLabel: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  target: (!goog.soy.data.SanitizedContent|null|string|undefined),
-   *  download: (!goog.soy.data.SanitizedContent|null|string|undefined)
+   *  download: (!goog.soy.data.SanitizedContent|null|string|undefined),
+   *  ariaExpanded: (boolean|null|undefined)
    * }} opt_data
@@ -78,2 +79,4 @@ * @param {Object<string, *>=} opt_ijData
     var closeable = soy.asserts.assertType(opt_data.closeable == null || goog.isBoolean(opt_data.closeable) || opt_data.closeable === 1 || opt_data.closeable === 0, 'closeable', opt_data.closeable, 'boolean|null|undefined');
+    /** @type {!goog.soy.data.SanitizedContent|null|string|undefined} */
+    var elementClasses = soy.asserts.assertType(opt_data.elementClasses == null || goog.isString(opt_data.elementClasses) || opt_data.elementClasses instanceof goog.soy.data.SanitizedContent, 'elementClasses', opt_data.elementClasses, '!goog.soy.data.SanitizedContent|null|string|undefined');
     /** @type {*|null|undefined} */
@@ -93,4 +96,4 @@ var handleCloseButtonClick_ = opt_data.handleCloseButtonClick_;
     var style = soy.asserts.assertType(opt_data.style == null || goog.isString(opt_data.style) || opt_data.style instanceof goog.soy.data.SanitizedContent, 'style', opt_data.style, '!goog.soy.data.SanitizedContent|null|string|undefined');
-    var attributes__soy12 = function attributes__soy12() {
-      incrementalDom.attr('class', 'label label-' + (($$temp = style) == null ? 'secondary' : $$temp) + (closeable ? ' label-dismissible' : '') + (size ? ' label-' + size : ''));
+    var attributes__soy13 = function attributes__soy13() {
+      incrementalDom.attr('class', 'label label-' + (($$temp = style) == null ? 'secondary' : $$temp) + (closeable ? ' label-dismissible' : '') + (elementClasses ? ' ' + elementClasses : '') + (size ? ' label-' + size : ''));
       if (id) {
@@ -101,3 +104,3 @@ incrementalDom.attr('id', id);
     incrementalDom.elementOpenStart('span');
-    attributes__soy12();
+    attributes__soy13();
     incrementalDom.elementOpenEnd();
@@ -111,2 +114,3 @@ $content(opt_data, null, opt_ijData);
    *  closeable: (boolean|null|undefined),
+   *  elementClasses: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  handleCloseButtonClick_: (*|null|undefined),
@@ -121,6 +125,6 @@ *  href: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  icon: (null|undefined|{alignment: (!goog.soy.data.SanitizedContent|string), spritemap: (!goog.soy.data.SanitizedContent|string), symbol: (!goog.soy.data.SanitizedContent|string)}),
-   *  elementClasses: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  ariaLabel: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  target: (!goog.soy.data.SanitizedContent|null|string|undefined),
-   *  download: (!goog.soy.data.SanitizedContent|null|string|undefined)
+   *  download: (!goog.soy.data.SanitizedContent|null|string|undefined),
+   *  ariaExpanded: (boolean|null|undefined)
    * }}
@@ -142,2 +146,3 @@ */
    *  buttonStyle: (!goog.soy.data.SanitizedContent|null|string|undefined),
+   *  ariaExpanded: (boolean|null|undefined),
    *  icon: (null|undefined|{alignment: (!goog.soy.data.SanitizedContent|string), spritemap: (!goog.soy.data.SanitizedContent|string), symbol: (!goog.soy.data.SanitizedContent|string)}),
@@ -187,2 +192,3 @@ *  style: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  buttonStyle: (!goog.soy.data.SanitizedContent|null|string|undefined),
+   *  ariaExpanded: (boolean|null|undefined),
    *  icon: (null|undefined|{alignment: (!goog.soy.data.SanitizedContent|string), spritemap: (!goog.soy.data.SanitizedContent|string), symbol: (!goog.soy.data.SanitizedContent|string)}),
@@ -201,4 +207,4 @@ *  style: (!goog.soy.data.SanitizedContent|null|string|undefined),
 
-  exports.render.params = ["closeable", "handleCloseButtonClick_", "href", "id", "label", "size", "spritemap", "style"];
-  exports.render.types = { "closeable": "bool", "handleCloseButtonClick_": "any", "href": "string", "id": "string", "label": "string", "size": "string", "spritemap": "string", "style": "string" };
+  exports.render.params = ["closeable", "elementClasses", "handleCloseButtonClick_", "href", "id", "label", "size", "spritemap", "style"];
+  exports.render.types = { "closeable": "bool", "elementClasses": "string", "handleCloseButtonClick_": "any", "href": "string", "id": "string", "label": "string", "size": "string", "spritemap": "string", "style": "string" };
   exports.content.params = ["closeable", "handleCloseButtonClick_", "href", "label", "spritemap"];
@@ -205,0 +211,0 @@ exports.content.types = { "closeable": "bool", "handleCloseButtonClick_": "any", "href": "string", "label": "string", "spritemap": "string" };

package.json

 {
   "name": "clay-label",
-  "version": "1.0.0-alpha.4",
+  "version": "1.0.0-alpha.5",
   "description": "Metal Clay Label component",
@@ -30,4 +30,4 @@ "license": "BSD",
   "dependencies": {
-    "clay-button": "^1.0.0-alpha.4",
-    "clay-link": "^1.0.0-alpha.4",
+    "clay-button": "^1.0.0-alpha.5",
+    "clay-link": "^1.0.0-alpha.5",
     "metal": "^2.14.0",
@@ -46,3 +46,3 @@ "metal-component": "^2.14.0",
     "browserslist-config-clay-components": "^1.0.0-alpha.2",
-    "clay": "^2.0.0-beta.2",
+    "clay": "^2.0.0-beta.4",
     "metal-dom": "^2.13.2",
@@ -49,0 +49,0 @@ "metal-tools-soy": "^4.2.1",

src/__tests__/ClayLabel.js

@@ -14,3 +14,3 @@ 'use strict';
 
-	it('shound generate the default markup', () => {
+	it('should render the default markup', () => {
 		label = new ClayLabel();
@@ -21,5 +21,5 @@
 
-	it('shound render a label with label', () => {
+	it('should render a label with classes', () => {
 		label = new ClayLabel({
-			label: 'Foo',
+			elementClasses: 'my-custom-class',
 		});
@@ -30,5 +30,5 @@
 
-	it('shound render a label with id', () => {
+	it('should render a label with id', () => {
 		label = new ClayLabel({
-			id: 'Foo',
+			id: 'myId',
 		});
@@ -39,4 +39,12 @@
 
-	it('shound render a large label', () => {
+	it('should render a label with label', () => {
 		label = new ClayLabel({
+			label: 'Foo',
+		});
+
+		expect(label).toMatchSnapshot();
+	});
+
+	it('should render a large label', () => {
+		label = new ClayLabel({
 			size: 'lg',
@@ -48,3 +56,3 @@ });
 
-	it('shound render a label with removable', () => {
+	it('should render a label with removable', () => {
 		label = new ClayLabel({
@@ -59,3 +67,3 @@ label: 'Foo',
 
-	it('shound render a label with link', () => {
+	it('should render a label with link', () => {
 		label = new ClayLabel({
@@ -69,3 +77,3 @@ label: 'Foo',
 
-	it('shound render a `default color` label', () => {
+	it('should render a `default color` label', () => {
 		label = new ClayLabel({
@@ -78,3 +86,3 @@ style: 'secondary',
 
-	it('shound render a `info color` label', () => {
+	it('should render a `info color` label', () => {
 		label = new ClayLabel({
@@ -87,3 +95,3 @@ style: 'info',
 
-	it('shound render a `warning color` label', () => {
+	it('should render a `warning color` label', () => {
 		label = new ClayLabel({
@@ -96,3 +104,3 @@ style: 'warning',
 
-	it('shound render a `danger color` label', () => {
+	it('should render a `danger color` label', () => {
 		label = new ClayLabel({
@@ -105,3 +113,3 @@ style: 'danger',
 
-	it('shound render a `success color` label', () => {
+	it('should render a `success color` label', () => {
 		label = new ClayLabel({
@@ -108,0 +116,0 @@ style: 'success',

src/ClayLabel.js

@@ -39,2 +39,11 @@ import 'clay-button';
 	/**
+	 * CSS classes to be applied to the element.
+	 * @instance
+	 * @memberof ClayLabel
+	 * @type {?string|undefined}
+	 * @default undefined
+	 */
+	elementClasses: Config.string(),
+
+	/**
 	 * HREF in label.
@@ -41,0 +50,0 @@ * @instance

src/ClayLabel.soy.js

@@ -32,2 +32,3 @@ /* jshint ignore:start */
  *  closeable: (boolean|null|undefined),
+ *  elementClasses: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  handleCloseButtonClick_: (*|null|undefined),
@@ -42,6 +43,6 @@ *  href: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  icon: (null|undefined|{alignment: (!goog.soy.data.SanitizedContent|string), spritemap: (!goog.soy.data.SanitizedContent|string), symbol: (!goog.soy.data.SanitizedContent|string)}),
- *  elementClasses: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  ariaLabel: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  target: (!goog.soy.data.SanitizedContent|null|string|undefined),
- *  download: (!goog.soy.data.SanitizedContent|null|string|undefined)
+ *  download: (!goog.soy.data.SanitizedContent|null|string|undefined),
+ *  ariaExpanded: (boolean|null|undefined)
  * }} opt_data
@@ -59,2 +60,4 @@ * @param {Object<string, *>=} opt_ijData
   var closeable = soy.asserts.assertType(opt_data.closeable == null || (goog.isBoolean(opt_data.closeable) || opt_data.closeable === 1 || opt_data.closeable === 0), 'closeable', opt_data.closeable, 'boolean|null|undefined');
+  /** @type {!goog.soy.data.SanitizedContent|null|string|undefined} */
+  var elementClasses = soy.asserts.assertType(opt_data.elementClasses == null || (goog.isString(opt_data.elementClasses) || opt_data.elementClasses instanceof goog.soy.data.SanitizedContent), 'elementClasses', opt_data.elementClasses, '!goog.soy.data.SanitizedContent|null|string|undefined');
   /** @type {*|null|undefined} */
@@ -74,4 +77,4 @@ var handleCloseButtonClick_ = opt_data.handleCloseButtonClick_;
   var style = soy.asserts.assertType(opt_data.style == null || (goog.isString(opt_data.style) || opt_data.style instanceof goog.soy.data.SanitizedContent), 'style', opt_data.style, '!goog.soy.data.SanitizedContent|null|string|undefined');
-  var attributes__soy12 = function() {
-    incrementalDom.attr('class', 'label label-' + (($$temp = style) == null ? 'secondary' : $$temp) + (closeable ? ' label-dismissible' : '') + (size ? ' label-' + size : ''));
+  var attributes__soy13 = function() {
+    incrementalDom.attr('class', 'label label-' + (($$temp = style) == null ? 'secondary' : $$temp) + (closeable ? ' label-dismissible' : '') + (elementClasses ? ' ' + elementClasses : '') + (size ? ' label-' + size : ''));
     if (id) {
@@ -82,3 +85,3 @@ incrementalDom.attr('id', id);
   incrementalDom.elementOpenStart('span');
-      attributes__soy12();
+      attributes__soy13();
   incrementalDom.elementOpenEnd();
@@ -92,2 +95,3 @@ $content(opt_data, null, opt_ijData);
  *  closeable: (boolean|null|undefined),
+ *  elementClasses: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  handleCloseButtonClick_: (*|null|undefined),
@@ -102,6 +106,6 @@ *  href: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  icon: (null|undefined|{alignment: (!goog.soy.data.SanitizedContent|string), spritemap: (!goog.soy.data.SanitizedContent|string), symbol: (!goog.soy.data.SanitizedContent|string)}),
- *  elementClasses: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  ariaLabel: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  target: (!goog.soy.data.SanitizedContent|null|string|undefined),
- *  download: (!goog.soy.data.SanitizedContent|null|string|undefined)
+ *  download: (!goog.soy.data.SanitizedContent|null|string|undefined),
+ *  ariaExpanded: (boolean|null|undefined)
  * }}
@@ -124,2 +128,3 @@ */
  *  buttonStyle: (!goog.soy.data.SanitizedContent|null|string|undefined),
+ *  ariaExpanded: (boolean|null|undefined),
  *  icon: (null|undefined|{alignment: (!goog.soy.data.SanitizedContent|string), spritemap: (!goog.soy.data.SanitizedContent|string), symbol: (!goog.soy.data.SanitizedContent|string)}),
@@ -169,2 +174,3 @@ *  style: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  buttonStyle: (!goog.soy.data.SanitizedContent|null|string|undefined),
+ *  ariaExpanded: (boolean|null|undefined),
  *  icon: (null|undefined|{alignment: (!goog.soy.data.SanitizedContent|string), spritemap: (!goog.soy.data.SanitizedContent|string), symbol: (!goog.soy.data.SanitizedContent|string)}),
@@ -183,4 +189,4 @@ *  style: (!goog.soy.data.SanitizedContent|null|string|undefined),
 
-exports.render.params = ["closeable","handleCloseButtonClick_","href","id","label","size","spritemap","style"];
-exports.render.types = {"closeable":"bool","handleCloseButtonClick_":"any","href":"string","id":"string","label":"string","size":"string","spritemap":"string","style":"string"};
+exports.render.params = ["closeable","elementClasses","handleCloseButtonClick_","href","id","label","size","spritemap","style"];
+exports.render.types = {"closeable":"bool","elementClasses":"string","handleCloseButtonClick_":"any","href":"string","id":"string","label":"string","size":"string","spritemap":"string","style":"string"};
 exports.content.params = ["closeable","handleCloseButtonClick_","href","label","spritemap"];
@@ -187,0 +193,0 @@ exports.content.types = {"closeable":"bool","handleCloseButtonClick_":"any","href":"string","label":"string","spritemap":"string"};

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

61513

increased by5.56%

Lines of code

683

increased by5.56%

Dependency changes

• Updatedclay-button@^1.0.0-alpha.5

• Updatedclay-link@^1.0.0-alpha.5