chore(pr-review): changes per pr review

Author: Cathy Siller

docs/components/pills/index.html

@@ -36,8 +36,8 @@ <h2 id="basic-pill">Basic Pill</h2>
         <hx-pill
           :persist="isPersistent"
           v-text="content"
-          @dismiss="onEvent">
-        </hx-pill>
+          @dismiss="onEvent"
+        ></hx-pill>
       </div>
 
       <footer>

docs/elements/hx-pill/index.html

@@ -51,18 +51,18 @@ <h2 id="methods">Methods</h2>
 
 {% block attributes %}
   <dl>
-    <dt>dismissable {Boolean [false]} <i>(optional)</i></dt>
+    <dt>persist {Boolean}</dt>
     <dd>
-      When present, pill will be dismissable.
+      When present, pill will not be dismissable.
     </dd>
   </dl>
 {% endblock %}
 
 {% block properties %}
   <dl>
-    <dt>dismissable {Boolean [false]}</dt>
+    <dt>persist {Boolean [false]}</dt>
     <dd>
-      When <code>true</code>, pill will be dismissable.
+      When <code>true</code>, pill will not be dismissable.
     </dd>
   </dl>
 {% endblock %}

src/helix-ui/elements/HXPillElement.js

@@ -39,10 +39,6 @@ export class HXPillElement extends HXElement {
         this._btnDismiss.removeEventListener('click', this._onDismiss);
     }
 
-    static get $observedAttributes () {
-        return [ 'persist' ];
-    }
-
     /**
      * Property reflecting the `persist` HTML attribute, indicating whether the
      * pill may be dismissed. If true, the dismiss button will not be shown.
@@ -55,7 +51,7 @@ export class HXPillElement extends HXElement {
     }
     set persist (value) {
         if (value) {
-            this.setAttribute('persist', ''); // boolean
+            this.setAttribute('persist', '');
         } else {
             this.removeAttribute('persist');
         }
@@ -65,7 +61,7 @@ export class HXPillElement extends HXElement {
      * Dismiss the pill (removes element from the DOM)
      */
     dismiss () {
-        if (this.$emit('dismiss')) {
+        if (!this.persist && this.$emit('dismiss')) {
             // only if event was not canceled by consumer
             this.remove();
         }

src/helix-ui/elements/HXPillElement.less

@@ -34,9 +34,7 @@
 }
 
 :host([persist]) {
-  #hxPill {
-    #hxDismiss {
-      display: none;
-    }
+  #hxDismiss {
+    display: none;
   }
 }