refactor(hx-radio-set): refactor missing js props and documentation

HelixDesignSystem · Apr 30, 2019 · 718f793 · 718f793
1 parent 6172c61
commit 718f793
Show file tree

Hide file tree

Showing 3 changed files with 56 additions and 0 deletions.
diff --git a/docs/elements/hx-radio-set/index.html b/docs/elements/hx-radio-set/index.html
@@ -70,3 +70,31 @@
     </dd>
   </dl>
 {% endblock %}
+
+{% block properties %}
+  <dl class="memberList">
+    <dt>
+      isDirty {Boolean [false]}
+      <hx-pill class="hxSubBody" persist>read-only</hx-pill>
+    </dt>
+    <dd>
+      True if the <code>hx-dirty</code> attribute is present.
+    </dd>
+
+    <dt>
+      wasChanged {Boolean [false]}
+      <hx-pill class="hxSubBody" persist>read-only</hx-pill>
+    </dt>
+    <dd>
+      True if the <code>hx-changed</code> attribute is present.
+    </dd>
+
+    <dt>
+      wasTouched {Boolean [false]}
+      <hx-pill class="hxSubBody" persist>read-only</hx-pill>
+    </dt>
+    <dd>
+      True if the <code>hx-touched</code> attribute is present.
+    </dd>
+  </dl>
+{% endblock %}
diff --git a/src/helix-ui/elements/HXRadioSetElement.js b/src/helix-ui/elements/HXRadioSetElement.js
@@ -25,6 +25,30 @@ export class HXRadioSetElement extends HXElement {
         this.removeEventListener('hxtouch', this._onHxtouch);
     }
 
+    /**
+     * @readonly
+     * @type {Boolean} [false]
+     */
+    get isDirty () {
+        return this.hasAttribute(STATE.dirty);
+    }
+
+    /**
+     * @readonly
+     * @type {Boolean} [false]
+     */
+    get wasChanged () {
+        return this.hasAttribute(STATE.changed);
+    }
+
+    /**
+     * @readonly
+     * @type {Boolean} [false]
+     */
+    get wasTouched () {
+        return this.hasAttribute(STATE.touched);
+    }
+
     /** @private */
     _onHxchange (evt) {
         evt.stopPropagation();

diff --git a/src/helix-ui/styles/components/radios.less b/src/helix-ui/styles/components/radios.less
@@ -11,6 +11,10 @@ hx-radio {
   width: 1rem;
 }
 
+hx-radio-set {
+  display: block;
+}
+
 // LAYOUT GEOMETRY
 hx-radio-control {
   -ms-grid-column-align: start;