bromcom-ui 2.7.23-0 → 2.7.23-3

package/dist/collection/components/molecules/radio/group.js

@@ -1,642 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-import { Component, h, Element, Prop, Event, Watch, State, Host, Method } from "@stencil/core";
-import cs from 'classnames';
-import snq from "snq";
-import { Generate } from "../../../helper/generate";
-import Bcm from "../../../models/bcm";
-import { CaptionTemplate } from "../../../templates/caption-template";
-import { delay, getChildElements } from "../../../utils/utils";
-import radioGroupState from "../states/radio-group.states";
-export class BcmRadioGroup {
-  constructor() {
-    this._id = Generate.UID();
-    this.direction = Bcm.Direction.horizontal;
-    this.items = [];
-    this.size = Bcm.Size.medium;
-    this.disabled = false;
-    this.hidden = false;
-    this.required = false;
-    this.optionType = 'default';
-    this.buttonStyle = 'solid';
-    this.fullWidth = false;
-    this.noCaption = false;
-    this.captionType = Bcm.Status.default;
-    this.radioOptions = [];
-    this.usingSlots = true;
-    this.tick = {};
-  }
-  disconnectedCallback() {
-    radioGroupState.removeState(this._id);
-  }
-  componentDidLoad() {
-    this.initState();
-  }
-  componentShouldUpdate(newVal, oldVal, propName) {
-    if ((propName == 'defaultValue' || propName == 'tick') && newVal !== oldVal) {
-      const isHaveChild = snq(() => radioGroupState.getProperty(this._id).childs.length > 0, false);
-      if (isHaveChild) {
-        this.getValue().then(values => (this.value = values));
-      }
-    }
-  }
-  async initState() {
-    const { fullWidth, optionType, buttonStyle, size, disabled, noCaption, defaultValue, label, required, captionType, hidden, direction, gap, items, name } = this;
-    const defaultCheckedItems = defaultValue && defaultValue;
-    const childElements = items.length > 0 ? snq(() => (typeof this.items == 'string' ? JSON.parse(this.items) : this.items)) : await this.getRadioItems();
-    await radioGroupState.setValue({
-      id: this._id,
-      el: this.el,
-      name,
-      fullWidth,
-      optionType,
-      buttonStyle,
-      size,
-      disabled,
-      defaultCheckedItems,
-      label,
-      noCaption,
-      required,
-      captionType,
-      hidden,
-      gap,
-      direction,
-      childs: childElements,
-    });
-    this.getValue().then(values => (this.value = values));
-  }
-  async markForCheck() {
-    await delay(10);
-    this.tick = Generate.UID();
-  }
-  async setClear() {
-    radioGroupState.setClear(this._id);
-    this.markForCheck();
-    await delay(10);
-    return Promise.resolve();
-  }
-  async resetCaption() {
-    await delay(10);
-    this.caption = this.captionCache;
-    this.captionType = this.captionTypeCache;
-    this.captionError = null;
-    await delay(10);
-    return Promise.resolve();
-  }
-  async set(data) {
-    await this.check(data);
-  }
-  async get() {
-    return await this.getValue();
-  }
-  async check(item, checked = true) {
-    radioGroupState.setCheckedItem(this._id, item, checked);
-    this.defaultValue = item;
-    this.markForCheck();
-  }
-  async getValue() {
-    return radioGroupState.getValue(this._id);
-  }
-  handleItemsChange() {
-    this.initState();
-  }
-  getRadioItems() {
-    return getChildElements(this.el, 'bcm-radio');
-  }
-  async changeRadio(event) {
-    radioGroupState.state.onChange = { id: this._id, childId: event };
-    await this.markForCheck();
-    this.change.emit(this.value);
-  }
-  getItems() {
-    return radioGroupState.getProperty(this._id);
-  }
-  connectedCallback() {
-    this.captionCache = this.caption;
-    this.captionTypeCache = this.captionType;
-  }
-  render() {
-    const { label, required, hidden, childs, gap, direction, fullWidth, optionType } = this.getItems();
-    const bcmRadioGroupHostClasses = cs('bcm-radio-group', {
-      hidden,
-      'error': this.captionType == 'error',
-      'full-width': fullWidth,
-    });
-    const bcmRadioGroupContainerClasses = cs('bcm-radio-group__container', optionType, {
-      [direction]: optionType === 'default',
-      'full-width': fullWidth,
-    });
-    return (h(Host, { class: bcmRadioGroupHostClasses },
-      h("span", { hidden: true },
-        h("slot", null)),
-      label && h("bcm-label", { type: this.captionType, value: label, required: required }),
-      h("div", { class: bcmRadioGroupContainerClasses, style: gap && { gap: gap } }, childs &&
-        childs.map(radio => (h("bcm-radio", { id: radio.id, onClick: e => {
-            !radio.disabled && this.changeRadio(radio.id), e.preventDefault();
-          }, value: radio.value, disabled: radio.disabled, checked: radio.checked, size: radio.size, color: radio.color, required: radio.required, hidden: radio.hidden, "no-margin": true }, radio.slot || radio.label)))),
-      h(CaptionTemplate, { noCaption: this.noCaption, captionType: this.captionType, captionError: this.captionError, caption: this.caption })));
-  }
-  static get is() { return "bcm-radio-group"; }
-  static get originalStyleUrls() { return {
-    "$": ["group.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["group.css"]
-  }; }
-  static get properties() { return {
-    "_id": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "id",
-      "reflect": true,
-      "defaultValue": "Generate.UID()"
-    },
-    "value": {
-      "type": "any",
-      "mutable": true,
-      "complexType": {
-        "original": "string | number",
-        "resolved": "number | string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "value",
-      "reflect": false
-    },
-    "direction": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "DirectionTypes",
-        "resolved": "\"horizontal\" | \"vertical\"",
-        "references": {
-          "DirectionTypes": {
-            "location": "import",
-            "path": "../../../models/bcm-types"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "direction",
-      "reflect": false,
-      "defaultValue": "Bcm.Direction.horizontal"
-    },
-    "items": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "Array<object> | OptionType[] | string",
-        "resolved": "OptionType[] | object[] | string",
-        "references": {
-          "Array": {
-            "location": "global"
-          },
-          "OptionType": {
-            "location": "local"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "items",
-      "reflect": false,
-      "defaultValue": "[]"
-    },
-    "size": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "SizeTypes",
-        "resolved": "\"large\" | \"medium\" | \"small\"",
-        "references": {
-          "SizeTypes": {
-            "location": "import",
-            "path": "../../../models/bcm-types"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "size",
-      "reflect": false,
-      "defaultValue": "Bcm.Size.medium"
-    },
-    "name": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "name",
-      "reflect": false
-    },
-    "label": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "label",
-      "reflect": false
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "disabled",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "hidden": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "hidden",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "required": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "required",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "gap": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "gap",
-      "reflect": false
-    },
-    "defaultValue": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "default-value",
-      "reflect": false
-    },
-    "optionType": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "'default' | 'button'",
-        "resolved": "\"button\" | \"default\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "option-type",
-      "reflect": false,
-      "defaultValue": "'default'"
-    },
-    "buttonStyle": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "'solid' | 'outline'",
-        "resolved": "\"outline\" | \"solid\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "button-style",
-      "reflect": false,
-      "defaultValue": "'solid'"
-    },
-    "fullWidth": {
-      "type": "any",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean | 'flex'",
-        "resolved": "\"flex\" | boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "full-width",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "caption": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "caption",
-      "reflect": false
-    },
-    "noCaption": {
-      "type": "boolean",
-      "mutable": true,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "no-caption",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "captionError": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "caption-error",
-      "reflect": false
-    },
-    "captionType": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "StatusTypes",
-        "resolved": "\"default\" | \"error\" | \"info\" | \"success\" | \"warning\"",
-        "references": {
-          "StatusTypes": {
-            "location": "import",
-            "path": "../../../models/bcm-types"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "caption-type",
-      "reflect": false,
-      "defaultValue": "Bcm.Status.default"
-    }
-  }; }
-  static get states() { return {
-    "captionCache": {},
-    "captionTypeCache": {},
-    "radioOptions": {},
-    "usingSlots": {},
-    "tick": {}
-  }; }
-  static get events() { return [{
-      "method": "change",
-      "name": "bcm-change",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get methods() { return {
-    "setClear": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "resetCaption": {
-      "complexType": {
-        "signature": "() => Promise<void>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "set": {
-      "complexType": {
-        "signature": "(data: any) => Promise<void>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "get": {
-      "complexType": {
-        "signature": "() => Promise<string>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<string>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "check": {
-      "complexType": {
-        "signature": "(item: any, checked?: boolean) => Promise<void>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }, {
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<void>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "getValue": {
-      "complexType": {
-        "signature": "() => Promise<string>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<string>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    }
-  }; }
-  static get elementRef() { return "el"; }
-  static get watchers() { return [{
-      "propName": "items",
-      "methodName": "handleItemsChange"
-    }]; }
-}