bromcom-ui 2.8.0-rc.9 → 3.0.0-rc.0

package/dist/collection/components/molecules/notification/notification.js

@@ -1,250 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
-    r = Reflect.decorate(decorators, target, key, desc);
-  else
-    for (var i = decorators.length - 1; i >= 0; i--)
-      if (d = decorators[i])
-        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { h, Host } from '@stencil/core';
-import { TypeProps } from './types';
-import cs from 'classnames';
-import { IsLoad } from '../../../decorators/is-load-decorator';
-export class BcmNotification {
-  constructor() {
-    this._title = undefined;
-    this.status = TypeProps.default;
-    this.confirmText = undefined;
-    this.isShow = false;
-    this.hidden = false;
-  }
-  /**
-   * @desc
-   * @returns {BcmOldIcon}
-   */
-  getIcon() {
-    switch (this.status) {
-      case TypeProps.info:
-        return h("bcm-icon", { icon: "far fa-info-circle" });
-      case TypeProps.error:
-        return h("bcm-icon", { icon: "far fa-times-circle" });
-      case TypeProps.warning:
-        return h("bcm-icon", { icon: "far fa-exclamation-circle" });
-      case TypeProps.success:
-        return h("bcm-icon", { icon: "far fa-check-circle" });
-    }
-  }
-  /**
-   * @desc Removes component itself
-   */
-  dismiss() {
-    this.isShow = false;
-    // this.el.remove()
-  }
-  /**
-   * @desc Removes component itself
-   */
-  handleConfirm() {
-    this.isShow = false;
-    this.confirm.emit();
-  }
-  /**
-   * @desc
-   */
-  async hide() {
-    this.dismiss();
-  }
-  /**
-   * @desc
-   */
-  async show() {
-    this.isShow = true;
-  }
-  render() {
-    const { status, _title, confirmText, isShow } = this;
-    const notification = cs('notification', {
-      'show': isShow
-    });
-    const hostClasses = cs(this.hidden ? 'hidden' : null);
-    return (h(Host, { class: hostClasses }, h("div", { class: notification }, status !== TypeProps.default && (h("div", { class: "icon-content" }, this.getIcon())), h("div", { class: "text-content" }, h("span", { class: "title" }, _title, h("bcm-icon", { icon: "far fa-times", color: "grey-10", onClick: () => this.dismiss() })), h("p", null, h("slot", null)), confirmText != undefined && (h("div", { class: "actions" }, h("bcm-button", { size: "small", onClick: () => this.handleConfirm() }, confirmText ? confirmText : "Confirm")))))));
-  }
-  static get is() { return "bcm-notification"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["notification.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["notification.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "_title": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Component Properties"
-        },
-        "attribute": "title",
-        "reflect": false
-      },
-      "status": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "TypeProp",
-          "resolved": "\"default\" | \"error\" | \"info\" | \"success\" | \"warning\"",
-          "references": {
-            "TypeProp": {
-              "location": "import",
-              "path": "./types"
-            }
-          }
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "status",
-        "reflect": false,
-        "defaultValue": "TypeProps.default"
-      },
-      "confirmText": {
-        "type": "any",
-        "mutable": true,
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "confirm",
-        "reflect": false
-      },
-      "isShow": {
-        "type": "boolean",
-        "mutable": true,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "open",
-        "reflect": true,
-        "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"
-      }
-    };
-  }
-  static get events() {
-    return [{
-        "method": "confirm",
-        "name": "bcm-confirm",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Component Events"
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
-        }
-      }];
-  }
-  static get methods() {
-    return {
-      "hide": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "",
-          "tags": [{
-              "name": "desc",
-              "text": undefined
-            }]
-        }
-      },
-      "show": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global"
-            }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "",
-          "tags": [{
-              "name": "desc",
-              "text": undefined
-            }]
-        }
-      }
-    };
-  }
-  static get elementRef() { return "el"; }
-}
-__decorate([
-  IsLoad()
-], BcmNotification.prototype, "el", void 0);

package/dist/collection/components/molecules/notification/types.js

@@ -1,15 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-/**
- * 'type' prop predefined values
- */
-export var TypeProps;
-(function (TypeProps) {
-  TypeProps["info"] = "info";
-  TypeProps["error"] = "error";
-  TypeProps["warning"] = "warning";
-  TypeProps["success"] = "success";
-  TypeProps["default"] = "default";
-})(TypeProps || (TypeProps = {}));

package/dist/collection/components/molecules/result/result.css

@@ -1,164 +0,0 @@
-@import url("https://fonts.googleapis.com/css?family=Roboto:400,500");
-.size-1 {
-  font-size: 12px;
-  line-height: 20px;
-}
-
-.size-2 {
-  font-size: 14px;
-  line-height: 22px;
-}
-
-.size-3 {
-  font-size: 16px;
-  line-height: 24px;
-}
-
-.size-4 {
-  font-size: 20px;
-  line-height: 28px;
-}
-
-.size-5 {
-  font-size: 24px;
-  line-height: 32px;
-}
-
-.size-6 {
-  font-size: 30px;
-  line-height: 38px;
-}
-
-.size-7 {
-  font-size: 38px;
-  line-height: 46px;
-}
-
-.size-8 {
-  font-size: 46px;
-  line-height: 54px;
-}
-
-.size-9 {
-  font-size: 56px;
-  line-height: 64px;
-}
-
-.weight-regular {
-  font-weight: 400;
-}
-
-.weight-semibold {
-  font-weight: 500;
-}
-
-/**
- * Generator
- */
-.input-size-large {
-  height: 40px;
-}
-
-.input-size-medium {
-  height: 32px;
-}
-
-.input-size-small {
-  height: 24px;
-}
-
-.resize-none textarea {
-  resize: none;
-}
-
-.resize-vertical textarea {
-  resize: vertical;
-}
-
-.resize-auto textarea {
-  height: auto;
-  resize: none;
-}
-
-.textarea-size-large {
-  padding: 4px 0 0 4px;
-  min-height: 40px;
-}
-.textarea-size-large .bcm-input-element {
-  min-height: calc((40px - 8px) + 2px);
-}
-.textarea-size-large .input-clear-button {
-  height: calc( 40px - 16px );
-  top: 8px;
-  padding: 0;
-  margin-right: 8px;
-}
-
-.textarea-size-medium {
-  padding: 4px 0 0 4px;
-  min-height: 32px;
-}
-.textarea-size-medium .bcm-input-element {
-  min-height: calc((32px - 8px) + 2px);
-}
-.textarea-size-medium .input-clear-button {
-  height: calc( 32px - 16px );
-  top: 8px;
-  padding: 0;
-  margin-right: 8px;
-}
-
-.textarea-size-small {
-  padding: 0px 0 0 4px;
-  min-height: 24px;
-}
-.textarea-size-small .bcm-input-element {
-  min-height: calc((24px - 8px) + 2px);
-}
-.textarea-size-small .input-clear-button {
-  height: calc( 24px - 16px );
-  top: 8px;
-  padding: 0;
-  margin-right: 8px;
-}
-
-:host {
-  display: block;
-}
-
-:host(.hidden) {
-  display: none;
-}
-
-.result {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: 32px 24px;
-}
-.result .content {
-  margin-top: 24px;
-}
-.result .content .heading {
-  margin-bottom: 8px;
-}
-.result .content .heading, .result .content .desc {
-  display: block;
-  text-align: center;
-}
-.result .content .extra {
-  background-color: #F5F5F5;
-  padding: 24px 24px;
-  margin: 32px 0;
-}
-@media screen and (min-width: 576px) {
-  .result .content .extra {
-    padding: 24px 40px;
-  }
-}
-.result .content .buttons {
-  display: flex;
-  justify-content: center;
-  grid-gap: 8px;
-  flex-wrap: wrap;
-}

package/dist/collection/components/molecules/result/types.js

@@ -1,22 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-export const statuses = {
-  success: {
-    icon: 'far fa-check-circle',
-    color: 'green-6'
-  },
-  info: {
-    icon: 'far fa-info-circle',
-    color: 'blue-6'
-  },
-  warning: {
-    icon: 'far fa-warning',
-    color: 'warmyellow-6'
-  },
-  error: {
-    icon: 'far fa-times-circle',
-    color: 'grey-10'
-  }
-};

package/dist/collection/components/molecules/states/alert.states.js

@@ -1,25 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-import { createStore } from "@stencil/store";
-import { Generate } from "../../../helper/generate";
-import snq from "snq";
-const { state } = createStore({
-  value: new Map(),
-  setData: {},
-  removeData: {}
-});
-const setValue = (val) => {
-  const data = Object.assign(Object.assign(Object.assign({}, val), { size: val.bigIcon ? 'medium' : 14, iconType: val.bigIcon ? 'outlined' : 'fill' }), Generate.getIconAttrWithStatusType(val.status));
-  state.value.set(data.id, data);
-};
-const removeValue = (_id) => {
-  state.value.delete(_id);
-};
-const getValue = (id) => snq(() => state.value.get(id), {});
-export default {
-  setValue,
-  removeValue,
-  getValue
-};

package/dist/collection/components/molecules/states/checkbox-group.states.js

@@ -1,199 +0,0 @@
-/*!
- * Built with Stencil
- * Copyright (c) Bromcom.
- */
-import { createStore } from '@stencil/store';
-import snq from 'snq';
-import { Generate } from '../../../helper/generate';
-const { state } = createStore({
-  group: new Map(),
-  allChecked: true,
-  allUnchecked: true,
-  changeInderminate: {},
-});
-const setValue = async ({ fullWidth, optionType, buttonStyle, size, defaultCheckedItems, el, id, label, required, captionType, hidden, direction, childs, indeterminate, gap, noCaption, }) => {
-  if (el) {
-    state.group.set(id, {
-      fullWidth,
-      optionType,
-      buttonStyle,
-      size,
-      defaultCheckedItems,
-      label,
-      required,
-      captionType,
-      hidden,
-      direction,
-      indeterminate,
-      gap,
-      noCaption,
-      childs: childs === null || childs === void 0 ? void 0 : childs.map(child => {
-        child.checked && (state.allUnchecked = false);
-        !child.checked && (state.allChecked = false);
-        // fullWidth && (fullWidth == 'flex' ? (child.style.flex = 'auto') : (child.style.width = '100%'));
-        optionType && (child.optionType = optionType);
-        buttonStyle && (child.buttonStyle = buttonStyle);
-        size && (child.size = size);
-        defaultCheckedItems && defaultCheckedItems.find(e => e === child.name) && (child.checked = true);
-        child.noCaption = noCaption;
-        return {
-          id: child.id || Generate.UID(),
-          checked: child.checked || false,
-          name: child.name,
-          size: child.size,
-          buttonStyle: child.buttonStyle,
-          optionType: child.optionType,
-          style: child.style,
-          noCaption: child.noCaption,
-          color: child.color,
-          disabled: child.disabled,
-          readonly: child.readonly,
-          label: child.label || child.name,
-          slot: child.slot || snq(() => child.querySelector('.slot').textContent, child.textContent),
-          required: child.required || required,
-          el: child,
-          captionType,
-          hidden,
-        };
-      }),
-      indeterminateState: !state.allChecked && !state.allUnchecked ? 'indeterminate' : state.allChecked ? 'determinate' : 'uncheck',
-    });
-  }
-};
-const getProperty = id => {
-  return snq(() => state.group.get(id), {});
-};
-const getValue = (id, name) => {
-  var _a;
-  const group = getProperty(id);
-  let value = {};
-  (_a = group.childs) === null || _a === void 0 ? void 0 : _a.map(child => {
-    if (name) {
-      if (child.name === name) {
-        value[child.name] = {
-          value: !!child.checked,
-          name: child.name,
-        };
-      }
-    }
-    else {
-      value[child.name] = {
-        value: !!child.checked,
-        name: child.name,
-      };
-    }
-  });
-  return value;
-};
-const getCheckedList = id => {
-  var _a;
-  const group = getProperty(id);
-  let value = {};
-  (_a = group.childs) === null || _a === void 0 ? void 0 : _a.map(child => {
-    if (child.checked === true) {
-      value[child.name] = {
-        value: !!child.checked,
-        name: child.name,
-      };
-    }
-  });
-  return value;
-};
-const setClear = id => {
-  var _a;
-  (_a = getProperty(id).childs) === null || _a === void 0 ? void 0 : _a.forEach(child => {
-    child.checked = false;
-  });
-  checkInderminate(id);
-};
-const setCheckedItems = (id, items, checked, reset) => {
-  var _a;
-  const checkedItems = items && (typeof items == 'string' ? JSON.parse(items) : items);
-  (_a = getProperty(id).childs) === null || _a === void 0 ? void 0 : _a.forEach(child => {
-    if (checkedItems) {
-      const checkedItem = checkedItems.find(e => e === child.name || e.name === child.name);
-      if (checkedItem) {
-        if (typeof checkedItem == 'object') {
-          Object.keys(checkedItem).map(key => {
-            if (key === 'checked') {
-              child.checked = checkedItem[key];
-            }
-            else {
-              child.checked = checked;
-            }
-          });
-        }
-        else {
-          child.checked = checked;
-        }
-      }
-      else {
-        reset && (child.checked = false);
-      }
-    }
-    else {
-      child.checked = false;
-    }
-  });
-  checkInderminate(id);
-};
-const resetCaption = id => {
-  var _a;
-  // const noCaption = getProperty(id).noCaption;
-  (_a = getProperty(id).childs) === null || _a === void 0 ? void 0 : _a.forEach(child => {
-    child.resetCaption();
-    // child.noCaption = noCaption;
-  });
-};
-const changeIndeterminate = id => {
-  var _a;
-  const group = getProperty(id);
-  if (!group.disabled) {
-    let checkAll = true;
-    if (group.indeterminateState === 'determinate') {
-      checkAll = false;
-    }
-    (_a = getProperty(id).childs) === null || _a === void 0 ? void 0 : _a.map(child => {
-      child.checked = checkAll;
-    });
-    checkInderminate(id);
-  }
-};
-const checkInderminate = id => {
-  var _a;
-  const group = getProperty(id);
-  let allChecked = true;
-  let allUnchecked = true;
-  (_a = group.childs) === null || _a === void 0 ? void 0 : _a.map(child => {
-    child.checked && (allUnchecked = false);
-    !child.checked && (allChecked = false);
-  });
-  group.indeterminateState = !allChecked && !allUnchecked ? 'indeterminate' : allChecked ? 'determinate' : 'uncheck';
-};
-const onChange = (obj) => {
-  var _a;
-  (_a = getProperty(obj.id).childs) === null || _a === void 0 ? void 0 : _a.map(child => {
-    child.checked = child.id === obj.childId ? !child.checked : child.checked;
-  });
-  checkInderminate(obj.id);
-};
-const removeState = id => {
-  return Promise.resolve(state.group.delete(id));
-};
-const getStatesKeys = id => {
-  return Object.keys(state.group.get(id));
-};
-export default {
-  setValue,
-  getValue,
-  setCheckedItems,
-  getCheckedList,
-  getProperty,
-  setClear,
-  resetCaption,
-  onChange,
-  getStatesKeys,
-  state,
-  removeState,
-  changeIndeterminate,
-};