Update interface

dist/radioBox.d.ts

@@ -5,11 +5,11 @@ interface OnLoadCallback {
     (radioBox: any): void;
 }
 interface RadioBoxOption {
-    checked?: string | number;
+    checked: string | number | null;
+    bindLabel: boolean;
+    styles: object;
     onChange?: OnChangeCallback;
     onLoad?: OnLoadCallback;
-    bindLabel?: boolean;
-    styles?: object;
 }
 interface RadioInputElement extends HTMLInputElement {
     withID: boolean;
@@ -28,7 +28,7 @@ declare class RadioBox {
     private groupName;
     private onChangeCallback?;
     private onLoadCallback?;
-    constructor(element: string | HTMLInputElement, option?: RadioBoxOption);
+    constructor(element: string | HTMLInputElement, option: Partial<RadioBoxOption>);
     private init;
     private injectStyles;
     private setupCallbacks;

dist/radioBox.esm.js

@@ -126,12 +126,10 @@ function generateRandom(length = 8) {
     return Math.random().toString(36).substring(2, 2 + length);
 }
 
-function addEventListener(...params) {
-    const [element, eventName, handler, options] = params;
+function addEventListener(element, eventName, handler, options) {
     element.addEventListener(eventName, handler, options);
 }
-function removeEventListener(...params) {
-    const [element, eventName, handler, options] = params;
+function removeEventListener(element, eventName, handler, options) {
     element.removeEventListener(eventName, handler, options);
 }
 function createEvent(eventName, detail, options) {
@@ -292,11 +290,11 @@ const reportInfo = (vars, showType = false) => {
 };
 
 const defaults = {
-    checked: undefined,
-    onChange: undefined,
-    onLoad: undefined,
+    checked: null,
     bindLabel: true,
-    styles: {}
+    styles: {},
+    onLoad: undefined,
+    onChange: undefined
 };
 
 function styleInject(css, ref) {
@@ -331,17 +329,17 @@ styleInject(css_248z);
 
 class RadioBox {
     static instances = [];
-    static version = '2.0.2';
+    static version = '2.0.3';
     static firstLoad = true;
     element = null;
-    options;
+    options = defaults;
     id = 0;
     allElement = [];
     groupName = '';
     // Methods for external use
     onChangeCallback;
     onLoadCallback;
-    constructor(element, option = {}) {
+    constructor(element, option) {
         this.init(element, option, RadioBox.instances.length);
         RadioBox.instances.push(this);
         if (RadioBox.instances.length === 1 && RadioBox.firstLoad === true) {
@@ -445,7 +443,7 @@ class RadioBox {
         });
         // Reset instance variables
         this.element = null;
-        this.options = {};
+        this.options = defaults;
         this.allElement = [];
         // Remove any injected stylesheets
         Utils.removeStylesheet(this.id.toString());

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@carry0987/radio-box",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "description": "A library for create radio type check box",
   "type": "module",
   "main": "dist/radioBox.min.js",
@@ -29,12 +29,12 @@
   },
   "homepage": "https://github.com/carry0987/RadioBox-JS#readme",
   "devDependencies": {
-    "@carry0987/utils": "^3.2.6",
+    "@carry0987/utils": "^3.2.8",
     "@rollup/plugin-node-resolve": "^15.2.3",
     "@rollup/plugin-replace": "^5.0.5",
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-typescript": "^11.1.6",
-    "rollup": "^4.9.6",
+    "rollup": "^4.10.0",
     "rollup-plugin-delete": "^2.0.0",
     "rollup-plugin-dts": "^6.1.0",
     "rollup-plugin-postcss": "^4.0.2",

src/interface/interfaces.ts

@@ -7,11 +7,11 @@ export interface OnLoadCallback {
 }
 
 export interface RadioBoxOption {
-    checked?: string | number;
+    checked: string | number | null;
+    bindLabel: boolean;
+    styles: object;
     onChange?: OnChangeCallback;
     onLoad?: OnLoadCallback;
-    bindLabel?: boolean;
-    styles?: object;
 }
 
 export interface RadioboxTitleDetail {

src/module/config.ts

@@ -1,9 +1,9 @@
 import { RadioBoxOption } from '../interface/interfaces';
 
 export const defaults: RadioBoxOption = {
-    checked: undefined,
-    onChange: undefined,
-    onLoad: undefined,
+    checked: null,
     bindLabel: true,
-    styles: {}
+    styles: {},
+    onLoad: undefined,
+    onChange: undefined
 };

src/radioBox.ts

@@ -9,7 +9,7 @@ class RadioBox {
     private static version: string = '__version__';
     private static firstLoad: boolean = true;
     private element: string | HTMLInputElement | null = null;
-    private options!: RadioBoxOption;
+    private options: RadioBoxOption = defaults;
     private id: number = 0;
     private allElement: RadioInputElement[] = [];
     private groupName: string = '';
@@ -18,7 +18,7 @@ class RadioBox {
     private onChangeCallback?: OnChangeCallback;
     private onLoadCallback?: OnLoadCallback;
 
-    constructor(element: string | HTMLInputElement, option: RadioBoxOption = {}) {
+    constructor(element: string | HTMLInputElement, option: Partial<RadioBoxOption>) {
         this.init(element, option, RadioBox.instances.length);
         RadioBox.instances.push(this);
 
@@ -30,12 +30,12 @@ class RadioBox {
         RadioBox.firstLoad = false;
     }
 
-    private init(elements: string | HTMLInputElement, option: RadioBoxOption, id: number) {
+    private init(elements: string | HTMLInputElement, option: Partial<RadioBoxOption>, id: number) {
         let elem = Utils.getElem<HTMLInputElement>(elements, 'all');
         if (!elem || elem.length < 1) Utils.throwError('Cannot find elements : ' + elements);
         this.id = id;
         this.element = elements;
-        this.options = Utils.deepMerge({}, defaults, option);
+        this.options = Utils.deepMerge({} as RadioBoxOption, defaults, option);
 
         // Inject stylesheet
         this.injectStyles();
@@ -138,7 +138,7 @@ class RadioBox {
 
         // Reset instance variables
         this.element = null;
-        this.options = {};
+        this.options = defaults;
         this.allElement = [];
 
         // Remove any injected stylesheets