fleetcor-lwc 2.2.2 → 2.3.0

package/README.md

@@ -195,6 +195,10 @@ $FLT_CHECKBOX_HOVER_BG_COLOR: var(--flt-checkbox-hover-bg-color, #f9fafb);
 
 ## Release Notes:
 
+- v.2.3.0
+  - Added label fire events to checkbox
+
+---
 - v.2.2.2
   - Bug fix checkbox link underline text
 

package/frontend/components/flt/checkbox/__test__/checkbox.test.js

@@ -11,7 +11,7 @@ describe('flt-checkbox', () => {
 
     it('Generate default checkbox', async () => {
         const checkboxDefault = createElement('flt-checkbox', { is: Checkbox })
-        checkboxDefault.label = 'Hello world'
+        checkboxDefault.label = 'Hello world <a href="javascript:void(0)" view-modal="test">link</a>'
         checkboxDefault.name = 'agree'
         document.body.appendChild(checkboxDefault)
 
@@ -27,6 +27,8 @@ describe('flt-checkbox', () => {
         data = checkboxDefault.getData()
         await expect(data.value).toBeTruthy()
         await expect(checkboxDefault.firstChild.classList).toContain('flt-checkbox_active')
+        const viewModelLink = document.querySelector('[view-modal]');
+        viewModelLink.click();
     })
 
     it('Generate requie checkbox', async () => {

package/frontend/components/flt/checkbox/checkbox.js

@@ -10,7 +10,7 @@ import { CheckboxElement } from 'fleetcor-lwc'
  */
 export default class Checkbox extends CheckboxElement {
     error
-    
+
     @api errorMessage
     @api size = SIZES.SMALL
 
@@ -43,6 +43,22 @@ export default class Checkbox extends CheckboxElement {
     renderedCallback() {
         super.renderedCallback()
         this.querySelector('.flt-checkbox__label').innerHTML = this.label
+        const labelLinks = this.querySelectorAll('a[view-modal]')
+        labelLinks.forEach((element) => {
+            element.onclick = (event) => {
+                event.preventDefault()
+                const type = element.getAttribute('view-modal')
+                this.dispatchEvent(
+                    new CustomEvent('viewmodal', {
+                        detail: {
+                            type: type
+                        },
+                        bubbles: true,
+                        composed: true
+                    })
+                )
+            }
+        })
     }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "fleetcor-lwc",
-    "version": "2.2.2",
+    "version": "2.3.0",
     "description": "LWC framework by Fleetcor",
     "repository": {
         "type": "git",