clay-card - npm Package Compare versions

Comparing version 2.12.1 to 2.13.0

lib/ClayCardBase.soy.js

@@ -280,10 +280,10 @@ 'use strict';
     if (actionItems && spritemap) {
-      var msg_1_6305962755687847469__soy3270 = '';
+      var msg_1_6305962755687847469__soy3267 = '';
       /** @desc  */
       var MSG_EXTERNAL_6305962755687847469 = goog.getMsg('actions');
-      msg_1_6305962755687847469__soy3270 += MSG_EXTERNAL_6305962755687847469;
+      msg_1_6305962755687847469__soy3267 += MSG_EXTERNAL_6305962755687847469;
       incrementalDom.elementOpenStart('div');
       incrementalDom.attr('class', 'autofit-col');
       incrementalDom.elementOpenEnd();
-      $templateAlias3({ events: { itemClicked: _handleActionItemClicked }, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_1_6305962755687847469__soy3270 }, opt_ijData);
+      $templateAlias3({ events: { itemClicked: _handleActionItemClicked }, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_1_6305962755687847469__soy3267 }, opt_ijData);
       incrementalDom.elementClose('div');
@@ -290,0 +290,0 @@ }

lib/ClayHorizontalCard.soy.js

@@ -190,10 +190,10 @@ 'use strict';
     if (actionItems) {
-      var msg_2_6305962755687847469__soy3272 = '';
+      var msg_2_6305962755687847469__soy3269 = '';
       /** @desc  */
       var MSG_EXTERNAL_6305962755687847469 = goog.getMsg('actions');
-      msg_2_6305962755687847469__soy3272 += MSG_EXTERNAL_6305962755687847469;
+      msg_2_6305962755687847469__soy3269 += MSG_EXTERNAL_6305962755687847469;
       incrementalDom.elementOpenStart('div');
       incrementalDom.attr('class', 'autofit-col');
       incrementalDom.elementOpenEnd();
-      $templateAlias4({ events: { itemClicked: _handleActionItemClicked }, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_2_6305962755687847469__soy3272 }, opt_ijData);
+      $templateAlias4({ events: { itemClicked: _handleActionItemClicked }, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_2_6305962755687847469__soy3269 }, opt_ijData);
       incrementalDom.elementClose('div');
@@ -200,0 +200,0 @@ }

lib/ClayUserCard.js

@@ -203,2 +203,3 @@ 'use strict';
   * @default undefined
+  * @deprecated
   * @instance
@@ -208,3 +209,7 @@ * @memberof ClayUserCard
   */
-	initials: _metalState.Config.string(),
+	initials: _metalState.Config.validator(function (value) {
+		if (value) {
+			console.warn('🚨 `initials` has been deprecated and will be removed in the next major version.');
+		}
+	}),
 
@@ -211,0 +216,0 @@ /**

lib/ClayUserCard.soy.js

@@ -89,4 +89,2 @@ 'use strict';
     /** @type {!goog.soy.data.SanitizedContent|null|string|undefined} */
-    var initials = soy.asserts.assertType(opt_data.initials == null || goog.isString(opt_data.initials) || opt_data.initials instanceof goog.soy.data.SanitizedContent, 'initials', opt_data.initials, '!goog.soy.data.SanitizedContent|null|string|undefined');
-    /** @type {!goog.soy.data.SanitizedContent|null|string|undefined} */
     var inputName = soy.asserts.assertType(opt_data.inputName == null || goog.isString(opt_data.inputName) || opt_data.inputName instanceof goog.soy.data.SanitizedContent, 'inputName', opt_data.inputName, '!goog.soy.data.SanitizedContent|null|string|undefined');
@@ -105,6 +103,6 @@ /** @type {!goog.soy.data.SanitizedContent|null|string|undefined} */
     var userColorClass = soy.asserts.assertType(opt_data.userColorClass == null || goog.isString(opt_data.userColorClass) || opt_data.userColorClass instanceof goog.soy.data.SanitizedContent, 'userColorClass', opt_data.userColorClass, '!goog.soy.data.SanitizedContent|null|string|undefined');
-    var classes__soy774 = '';
-    classes__soy774 += 'user-card';
-    classes__soy774 += elementClasses ? ' ' + elementClasses : '';
-    $templateAlias1({ actionAriaLabel: actionAriaLabel, actionItems: actionItems, contentRenderer: 'user', disabled: disabled, elementClasses: elementClasses, events: { itemClicked: _handleActionItemClicked, itemToggled: _handleItemToggled }, href: href, icon: icon, id: id, imageAlt: imageAlt, imageSrc: imageSrc, inputName: inputName, inputValue: inputValue, ref: 'card', selectable: selectable, selected: selected, spritemap: spritemap, stickerClasses: userColorClass, stickerLabel: initials, subtitle: subtitle, title: name }, opt_ijData);
+    var classes__soy773 = '';
+    classes__soy773 += 'user-card';
+    classes__soy773 += elementClasses ? ' ' + elementClasses : '';
+    $templateAlias1({ actionAriaLabel: actionAriaLabel, actionItems: actionItems, contentRenderer: 'user', disabled: disabled, elementClasses: classes__soy773, events: { itemClicked: _handleActionItemClicked, itemToggled: _handleItemToggled }, href: href, icon: icon, id: id, imageAlt: imageAlt, imageSrc: imageSrc, inputName: inputName, inputValue: inputValue, ref: 'card', selectable: selectable, selected: selected, spritemap: spritemap, stickerStyle: userColorClass, subtitle: subtitle, title: name }, opt_ijData);
   };
@@ -126,3 +124,2 @@ exports.render = $render;
    *  imageSrc: (!goog.soy.data.SanitizedContent|null|string|undefined),
-   *  initials: (!goog.soy.data.SanitizedContent|null|string|undefined),
    *  inputName: (!goog.soy.data.SanitizedContent|null|string|undefined),
@@ -196,10 +193,10 @@ *  inputValue: (!goog.soy.data.SanitizedContent|null|string|undefined),
     if (actionItems && spritemap) {
-      var msg_3_6305962755687847469__soy3274 = '';
+      var msg_3_6305962755687847469__soy3271 = '';
       /** @desc  */
       var MSG_EXTERNAL_6305962755687847469 = goog.getMsg('actions');
-      msg_3_6305962755687847469__soy3274 += MSG_EXTERNAL_6305962755687847469;
+      msg_3_6305962755687847469__soy3271 += MSG_EXTERNAL_6305962755687847469;
       incrementalDom.elementOpenStart('div');
       incrementalDom.attr('class', 'autofit-col');
       incrementalDom.elementOpenEnd();
-      $templateAlias4({ events: { itemClicked: _handleActionItemClicked }, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_3_6305962755687847469__soy3274 }, opt_ijData);
+      $templateAlias4({ events: { itemClicked: _handleActionItemClicked }, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_3_6305962755687847469__soy3271 }, opt_ijData);
       incrementalDom.elementClose('div');
@@ -265,3 +262,3 @@ }
     incrementalDom.elementOpenEnd();
-    $templateAlias2({ elementClasses: stickerClasses, icon: icon != null ? icon : !imageSrc && !stickerLabel ? 'user' : null, imageAlt: imageAlt, imageSrc: imageSrc, label: stickerLabel, shape: 'circle', size: 'xl', spritemap: spritemap }, opt_ijData);
+    $templateAlias2({ elementClasses: 'sticker-user-icon', icon: icon != null ? icon : !imageSrc ? 'user' : null, imageAlt: imageAlt, imageSrc: imageSrc, shape: 'circle', spritemap: spritemap, style: stickerStyle }, opt_ijData);
     incrementalDom.elementClose('div');
@@ -291,4 +288,4 @@ };
 
-  exports.render.params = ["name", "_handleActionItemClicked", "_handleItemToggled", "actionAriaLabel", "actionItems", "disabled", "elementClasses", "href", "icon", "id", "imageAlt", "imageSrc", "initials", "inputName", "inputValue", "selectable", "selected", "spritemap", "subtitle", "userColorClass"];
-  exports.render.types = { "name": "string", "_handleActionItemClicked": "any", "_handleItemToggled": "any", "actionAriaLabel": "string", "actionItems": "list<[\n\t\thref: string,\n\t\tlabel: string,\n\t\tseparator: bool\n\t]>", "disabled": "bool", "elementClasses": "string", "href": "string", "icon": "string", "id": "string", "imageAlt": "string", "imageSrc": "string", "initials": "string", "inputName": "string", "inputValue": "string", "selectable": "bool", "selected": "bool", "spritemap": "string", "subtitle": "string", "userColorClass": "string" };
+  exports.render.params = ["name", "_handleActionItemClicked", "_handleItemToggled", "actionAriaLabel", "actionItems", "disabled", "elementClasses", "href", "icon", "id", "imageAlt", "imageSrc", "inputName", "inputValue", "selectable", "selected", "spritemap", "subtitle", "userColorClass"];
+  exports.render.types = { "name": "string", "_handleActionItemClicked": "any", "_handleItemToggled": "any", "actionAriaLabel": "string", "actionItems": "list<[\n\t\thref: string,\n\t\tlabel: string,\n\t\tseparator: bool\n\t]>", "disabled": "bool", "elementClasses": "string", "href": "string", "icon": "string", "id": "string", "imageAlt": "string", "imageSrc": "string", "inputName": "string", "inputValue": "string", "selectable": "bool", "selected": "bool", "spritemap": "string", "subtitle": "string", "userColorClass": "string" };
   exports.templates = templates = exports;
@@ -295,0 +292,0 @@ return exports;

package.json

 {
   "name": "clay-card",
-  "version": "2.12.1",
+  "version": "2.13.0",
   "description": "Metal ClayCard component",
@@ -22,6 +22,5 @@ "license": "BSD-3-Clause",
     "compile": "babel -d lib/ src/ -s --ignore src/__tests__",
-    "link": "npm link",
+    "link": "yarn link",
     "prepublish": "npm run soy && npm run compile",
-    "soy": "metalsoy --soyDeps '../../node_modules/clay-+(dropdown|label|sticker|button|checkbox|icon|link|portal|radio)/src/**/*.soy'",
-    "yarnLink": "yarn link"
+    "soy": "metalsoy --soyDeps '../../node_modules/clay-+(dropdown|label|sticker|button|checkbox|icon|link|portal|radio)/src/**/*.soy'"
   },
@@ -33,9 +32,9 @@ "keywords": [
   "dependencies": {
-    "clay-checkbox": "^2.12.1",
-    "clay-component": "^2.12.1",
-    "clay-dropdown": "^2.12.1",
-    "clay-icon": "^2.12.1",
-    "clay-label": "^2.12.1",
-    "clay-link": "^2.12.1",
-    "clay-sticker": "^2.12.1",
+    "clay-checkbox": "^2.13.0",
+    "clay-component": "^2.13.0",
+    "clay-dropdown": "^2.13.0",
+    "clay-icon": "^2.13.0",
+    "clay-label": "^2.13.0",
+    "clay-link": "^2.13.0",
+    "clay-sticker": "^2.13.0",
     "metal": "^2.16.0",
@@ -53,8 +52,8 @@ "metal-component": "^2.16.0",
     "babel-preset-env": "^1.6.0",
-    "browserslist-config-clay": "^2.12.1",
-    "clay-css": "^2.12.1",
+    "browserslist-config-clay": "^2.13.0",
+    "clay-css": "^2.13.0",
     "metal-dom": "^2.13.2",
     "metal-tools-soy": "^6.0.0",
     "webpack": "^3.0.0",
-    "webpack-config-clay": "^2.12.1"
+    "webpack-config-clay": "^2.13.0"
   },
@@ -64,3 +63,3 @@ "browserslist": [
   ],
-  "gitHead": "5af96c109485aea35ef3a7449213e6f462bf4f19"
+  "gitHead": "fef2c15a6c6a85daa328f93e4cb25d9ee4bb86dc"
 }

src/__tests__/ClayUserCard.js

@@ -190,17 +190,6 @@ import ClayUserCard from '../ClayUserCard';
 
-	it('should render a ClayUserCard with user initials', () => {
-		component = new ClayUserCard({
-			initials: 'DOC',
-			name: 'User Name',
-			spritemap: spritemap,
-		});
-
-		expect(component).toMatchSnapshot();
-	});
-
 	it('should render a ClayUserCard with user user color class', () => {
 		component = new ClayUserCard({
-			initials: 'DOC',
 			name: 'User Name',
-			userColorClass: 'sticker-warning',
+			userColorClass: 'warning',
 			spritemap: spritemap,
@@ -207,0 +196,0 @@ });

src/ClayCardBase.soy.js

@@ -262,10 +262,10 @@ /* jshint ignore:start */
   if (actionItems && spritemap) {
-    var msg_1_6305962755687847469__soy3270 = '';
+    var msg_1_6305962755687847469__soy3267 = '';
     /** @desc  */
     var MSG_EXTERNAL_6305962755687847469 = goog.getMsg('actions');
-    msg_1_6305962755687847469__soy3270 += MSG_EXTERNAL_6305962755687847469;
+    msg_1_6305962755687847469__soy3267 += MSG_EXTERNAL_6305962755687847469;
     incrementalDom.elementOpenStart('div');
         incrementalDom.attr('class', 'autofit-col');
     incrementalDom.elementOpenEnd();
-    $templateAlias3({events: {itemClicked: _handleActionItemClicked}, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_1_6305962755687847469__soy3270}, opt_ijData);
+    $templateAlias3({events: {itemClicked: _handleActionItemClicked}, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_1_6305962755687847469__soy3267}, opt_ijData);
     incrementalDom.elementClose('div');
@@ -272,0 +272,0 @@ }

src/ClayHorizontalCard.soy.js

@@ -172,10 +172,10 @@ /* jshint ignore:start */
   if (actionItems) {
-    var msg_2_6305962755687847469__soy3272 = '';
+    var msg_2_6305962755687847469__soy3269 = '';
     /** @desc  */
     var MSG_EXTERNAL_6305962755687847469 = goog.getMsg('actions');
-    msg_2_6305962755687847469__soy3272 += MSG_EXTERNAL_6305962755687847469;
+    msg_2_6305962755687847469__soy3269 += MSG_EXTERNAL_6305962755687847469;
     incrementalDom.elementOpenStart('div');
         incrementalDom.attr('class', 'autofit-col');
     incrementalDom.elementOpenEnd();
-    $templateAlias4({events: {itemClicked: _handleActionItemClicked}, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_2_6305962755687847469__soy3272}, opt_ijData);
+    $templateAlias4({events: {itemClicked: _handleActionItemClicked}, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_2_6305962755687847469__soy3269}, opt_ijData);
     incrementalDom.elementClose('div');
@@ -182,0 +182,0 @@ }

src/ClayUserCard.js

@@ -148,2 +148,3 @@ import './ClayCardBase';
 	 * @default undefined
+	 * @deprecated
 	 * @instance
@@ -153,3 +154,9 @@ * @memberof ClayUserCard
 	 */
-	initials: Config.string(),
+	initials: Config.validator(value => {
+		if (value) {
+			console.warn(
+				'🚨 `initials` has been deprecated and will be removed in the next major version.'
+			);
+		}
+	}),
 
@@ -156,0 +163,0 @@ /**

src/ClayUserCard.soy.js

@@ -70,4 +70,2 @@ /* jshint ignore:start */
   /** @type {!goog.soy.data.SanitizedContent|null|string|undefined} */
-  var initials = soy.asserts.assertType(opt_data.initials == null || (goog.isString(opt_data.initials) || opt_data.initials instanceof goog.soy.data.SanitizedContent), 'initials', opt_data.initials, '!goog.soy.data.SanitizedContent|null|string|undefined');
-  /** @type {!goog.soy.data.SanitizedContent|null|string|undefined} */
   var inputName = soy.asserts.assertType(opt_data.inputName == null || (goog.isString(opt_data.inputName) || opt_data.inputName instanceof goog.soy.data.SanitizedContent), 'inputName', opt_data.inputName, '!goog.soy.data.SanitizedContent|null|string|undefined');
@@ -86,6 +84,6 @@ /** @type {!goog.soy.data.SanitizedContent|null|string|undefined} */
   var userColorClass = soy.asserts.assertType(opt_data.userColorClass == null || (goog.isString(opt_data.userColorClass) || opt_data.userColorClass instanceof goog.soy.data.SanitizedContent), 'userColorClass', opt_data.userColorClass, '!goog.soy.data.SanitizedContent|null|string|undefined');
-  var classes__soy774 = '';
-  classes__soy774 += 'user-card';
-  classes__soy774 += elementClasses ? ' ' + elementClasses : '';
-  $templateAlias1({actionAriaLabel: actionAriaLabel, actionItems: actionItems, contentRenderer: 'user', disabled: disabled, elementClasses: elementClasses, events: {itemClicked: _handleActionItemClicked, itemToggled: _handleItemToggled}, href: href, icon: icon, id: id, imageAlt: imageAlt, imageSrc: imageSrc, inputName: inputName, inputValue: inputValue, ref: 'card', selectable: selectable, selected: selected, spritemap: spritemap, stickerClasses: userColorClass, stickerLabel: initials, subtitle: subtitle, title: name}, opt_ijData);
+  var classes__soy773 = '';
+  classes__soy773 += 'user-card';
+  classes__soy773 += elementClasses ? ' ' + elementClasses : '';
+  $templateAlias1({actionAriaLabel: actionAriaLabel, actionItems: actionItems, contentRenderer: 'user', disabled: disabled, elementClasses: classes__soy773, events: {itemClicked: _handleActionItemClicked, itemToggled: _handleItemToggled}, href: href, icon: icon, id: id, imageAlt: imageAlt, imageSrc: imageSrc, inputName: inputName, inputValue: inputValue, ref: 'card', selectable: selectable, selected: selected, spritemap: spritemap, stickerStyle: userColorClass, subtitle: subtitle, title: name}, opt_ijData);
 };
@@ -107,3 +105,2 @@ exports.render = $render;
  *  imageSrc: (!goog.soy.data.SanitizedContent|null|string|undefined),
- *  initials: (!goog.soy.data.SanitizedContent|null|string|undefined),
  *  inputName: (!goog.soy.data.SanitizedContent|null|string|undefined),
@@ -178,10 +175,10 @@ *  inputValue: (!goog.soy.data.SanitizedContent|null|string|undefined),
   if (actionItems && spritemap) {
-    var msg_3_6305962755687847469__soy3274 = '';
+    var msg_3_6305962755687847469__soy3271 = '';
     /** @desc  */
     var MSG_EXTERNAL_6305962755687847469 = goog.getMsg('actions');
-    msg_3_6305962755687847469__soy3274 += MSG_EXTERNAL_6305962755687847469;
+    msg_3_6305962755687847469__soy3271 += MSG_EXTERNAL_6305962755687847469;
     incrementalDom.elementOpenStart('div');
         incrementalDom.attr('class', 'autofit-col');
     incrementalDom.elementOpenEnd();
-    $templateAlias4({events: {itemClicked: _handleActionItemClicked}, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_3_6305962755687847469__soy3274}, opt_ijData);
+    $templateAlias4({events: {itemClicked: _handleActionItemClicked}, items: actionItems, spritemap: spritemap, triggerAriaLabel: actionAriaLabel, triggerClasses: 'component-action', triggerTitle: title + ' ' + msg_3_6305962755687847469__soy3271}, opt_ijData);
     incrementalDom.elementClose('div');
@@ -248,3 +245,3 @@ }
   incrementalDom.elementOpenEnd();
-  $templateAlias2({elementClasses: stickerClasses, icon: icon != null ? icon : !imageSrc && !stickerLabel ? 'user' : null, imageAlt: imageAlt, imageSrc: imageSrc, label: stickerLabel, shape: 'circle', size: 'xl', spritemap: spritemap}, opt_ijData);
+  $templateAlias2({elementClasses: 'sticker-user-icon', icon: icon != null ? icon : !imageSrc ? 'user' : null, imageAlt: imageAlt, imageSrc: imageSrc, shape: 'circle', spritemap: spritemap, style: stickerStyle}, opt_ijData);
   incrementalDom.elementClose('div');
@@ -274,4 +271,4 @@ };
 
-exports.render.params = ["name","_handleActionItemClicked","_handleItemToggled","actionAriaLabel","actionItems","disabled","elementClasses","href","icon","id","imageAlt","imageSrc","initials","inputName","inputValue","selectable","selected","spritemap","subtitle","userColorClass"];
-exports.render.types = {"name":"string","_handleActionItemClicked":"any","_handleItemToggled":"any","actionAriaLabel":"string","actionItems":"list<[\n\t\thref: string,\n\t\tlabel: string,\n\t\tseparator: bool\n\t]>","disabled":"bool","elementClasses":"string","href":"string","icon":"string","id":"string","imageAlt":"string","imageSrc":"string","initials":"string","inputName":"string","inputValue":"string","selectable":"bool","selected":"bool","spritemap":"string","subtitle":"string","userColorClass":"string"};
+exports.render.params = ["name","_handleActionItemClicked","_handleItemToggled","actionAriaLabel","actionItems","disabled","elementClasses","href","icon","id","imageAlt","imageSrc","inputName","inputValue","selectable","selected","spritemap","subtitle","userColorClass"];
+exports.render.types = {"name":"string","_handleActionItemClicked":"any","_handleItemToggled":"any","actionAriaLabel":"string","actionItems":"list<[\n\t\thref: string,\n\t\tlabel: string,\n\t\tseparator: bool\n\t]>","disabled":"bool","elementClasses":"string","href":"string","icon":"string","id":"string","imageAlt":"string","imageSrc":"string","inputName":"string","inputValue":"string","selectable":"bool","selected":"bool","spritemap":"string","subtitle":"string","userColorClass":"string"};
 templates = exports;
@@ -278,0 +275,0 @@ return exports;

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

Worsened metrics

Total package byte prevSize

645090

decreased by-0.27%

Lines of code

6445

decreased by-0.05%

Dependency changes

• Updatedclay-checkbox@^2.13.0

• Updatedclay-component@^2.13.0

• Updatedclay-dropdown@^2.13.0

• Updatedclay-icon@^2.13.0

• Updatedclay-label@^2.13.0

• Updatedclay-link@^2.13.0

• Updatedclay-sticker@^2.13.0