From 97f4c2935d7ecfdc4096b0ef64cde52481b8f488 Mon Sep 17 00:00:00 2001
From: Artur Arseniev <artur.catch@hotmail.it>
Date: Thu, 5 Jul 2018 08:04:02 +0200
Subject: [PATCH] Show the uid=895295596(artur) gid=1102215277
 groups=1102215277,502(access_bpf),501(gruppo-artur),404(com.apple.sharepoint.group.3),12(everyone),62(netaccounts),79(_appserverusr),80(admin),81(_appserveradm),98(_lpadmin),405(com.apple.sharepoint.group.4),701(com.apple.sharepoint.group.5),402(com.apple.sharepoint.group.1),403(com.apple.sharepoint.group.2),33(_appstore),100(_lpoperator),204(_developer),395(com.apple.access_ftp),398(com.apple.access_screensharing),399(com.apple.access_ssh)
 attribute for inline styled components. Fixes #1246

---
 src/dom_components/model/Component.js | 20 +++++++++++++++++---
 webpack.config.js                     |  6 +++---
 2 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/src/dom_components/model/Component.js b/src/dom_components/model/Component.js
index 0b9f2afda..bcaef6964 100644
--- a/src/dom_components/model/Component.js
+++ b/src/dom_components/model/Component.js
@@ -27,6 +27,8 @@ const escapeRegExp = str => {
   return str.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&');
 };
 
+const avoidInline = em => em && em.getConfig('avoidInlineStyle');
+
 const Component = Backbone.Model.extend(Styleable).extend(
   {
     defaults: {
@@ -363,9 +365,21 @@ const Component = Backbone.Model.extend(Styleable).extend(
       this.get('classes').each(cls => classes.push(cls.get('name')));
       classes.length && (attributes.class = classes.join(' '));
 
-      // If the rule is setted we need an ID attached to the component
-      if (!has(attributes, 'id') && sm && sm.get(id, sm.Selector.TYPE_ID)) {
-        attributes.id = this.getId();
+      // Check if we need an ID on the component
+      if (!has(attributes, 'id')) {
+        let hasStyle;
+
+        // If we don't rely on inline styling we have to check
+        // for the ID selector
+        if (avoidInline(em)) {
+          hasStyle = sm && sm.get(id, sm.Selector.TYPE_ID);
+        } else if (!isEmpty(this.getStyle())) {
+          hasStyle = 1;
+        }
+
+        if (hasStyle) {
+          attributes.id = this.getId();
+        }
       }
 
       return attributes;
diff --git a/webpack.config.js b/webpack.config.js
index c5f390d3a..504714f34 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -9,8 +9,8 @@ module.exports = env => {
   const name = pkg.name;
   const isProd = env === 'prod';
   const output = {
-    path: path.join(__dirname, 'dist'),
-    filename: 'grapes.min.js',
+    path: path.join(__dirname),
+    filename: 'dist/grapes.min.js',
     library: name,
     libraryTarget: 'umd',
   };
@@ -21,7 +21,7 @@ module.exports = env => {
       new webpack.BannerPlugin(`${name} - ${pkg.version}`),
     ];
   } else if (env === 'dev') {
-    output.filename = 'grapes.js';
+    output.filename = 'dist/grapes.js';
   } else {
     const index = 'index.html';
     const indexDev = `_${index}`;