bromcom-ui 2.7.37-rc.0 → 2.7.37-rc.2

package/dist/collection/components/organism/time-picker/time-picker.js

@@ -0,0 +1,627 @@
+/*!
+ * 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 { Component, h, Host, Prop, Method, Element } from '@stencil/core';
+import cs from 'classnames';
+import { IsLoad } from '../../../decorators/is-load-decorator';
+import { Generate } from '../../../helper/generate';
+import Bcm from '../../../models/bcm';
+import { delay } from '../../../utils/utils';
+export class BcmTimePicker {
+  constructor() {
+    this._id = Generate.UID();
+    this.time = new Date();
+    this.hidden = false;
+    this.fullWidth = false;
+    this.required = false;
+    this.disabled = false;
+    this.noCaption = false;
+    this.caption = '';
+    this.captionType = 'default';
+    this.placement = Bcm.Placement['bottom-start'];
+  }
+  /**
+   * @ComponentMethod
+   */
+  componentWillLoad() {
+    if (typeof this.time === 'string') {
+      const regTime = /\b([01][0-9]|2[0-3]):([0-5][0-9])\b/;
+      const regTimeCheck = regTime.test(this.time);
+      const timeSections = regTimeCheck ? this.time.split(':') : false;
+      if (timeSections) {
+        this.time = new Date(new Date().setHours(Number(timeSections[0]), Number(timeSections[1])));
+      }
+      else
+        this.time = new Date();
+    }
+  }
+  /**
+   * @desc
+   */
+  handlePickerLoad() {
+    this.value = this.picker.value;
+  }
+  /**
+   * @desc
+   * @param event
+   */
+  handlePickerChange(event) {
+    this.value = event.detail;
+  }
+  /**
+   * @desc
+   * @param value
+   */
+  async set(value) {
+    return this.picker.set(value);
+  }
+  async get() {
+    var _a;
+    return ((_a = this.value) === null || _a === void 0 ? void 0 : _a.timestamp) || null;
+  }
+  /**
+   * @desc
+   * @param disabled
+   */
+  async setDisabled(disabled) {
+    this.disabled = disabled;
+  }
+  /**
+   * @desc
+   */
+  async getInput() {
+    return await this.picker.getInput();
+  }
+  /**
+   * @desc
+   */
+  async getValue() {
+    return this.value;
+  }
+  /**
+   * @desc
+   */
+  async isValid() {
+    return await this.picker.isValid();
+  }
+  async setClear() {
+    await this.picker.setClear();
+    await delay(10);
+    return Promise.resolve();
+  }
+  async resetCaption() {
+    await delay(10);
+    await this.picker.resetCaption();
+    this.captionType = 'default';
+    this.captionError = null;
+    await delay(10);
+    return Promise.resolve();
+  }
+  /**
+   * @desc
+   */
+  async open() {
+    return await this.picker.open();
+  }
+  render() {
+    const hostClasses = cs(this.hidden ? 'hidden' : null, {
+      'full-width': this.fullWidth
+    });
+    return (h(Host, { class: hostClasses },
+      h("bcm-datetime-picker", { "linked-component": this.linkedComponent, id: this._id, fullWidth: this.fullWidth, required: this.required, label: this.label, name: this.name, placeholder: this.placeholder, type: "time", date: this.time, ref: el => (this.picker = el), disabled: this.disabled, "on-bcm-load": () => this.handlePickerLoad(), "on-bcm-change": (e) => this.handlePickerChange(e), noCaption: this.noCaption, captionError: this.captionError, caption: this.caption, captionType: this.captionType, alignment: this.alignment, placement: this.placement })));
+  }
+  static get is() { return "bcm-time-picker"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["time-picker.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["time-picker.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()"
+    },
+    "time": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "Date | string",
+        "resolved": "Date | string",
+        "references": {
+          "Date": {
+            "location": "global"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "time",
+      "reflect": false,
+      "defaultValue": "new Date()"
+    },
+    "value": {
+      "type": "any",
+      "mutable": true,
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "value",
+      "reflect": 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"
+    },
+    "name": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "name",
+      "reflect": true
+    },
+    "fullWidth": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "full-width",
+      "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"
+    },
+    "label": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "label",
+      "reflect": false
+    },
+    "placeholder": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "placeholder",
+      "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"
+    },
+    "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"
+    },
+    "caption": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "caption",
+      "reflect": false,
+      "defaultValue": "''"
+    },
+    "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": "'primary' | 'success' | 'warning' | 'error' | 'default'",
+        "resolved": "\"default\" | \"error\" | \"primary\" | \"success\" | \"warning\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "caption-type",
+      "reflect": false,
+      "defaultValue": "'default'"
+    },
+    "alignment": {
+      "type": "any",
+      "mutable": true,
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "alignment",
+      "reflect": false
+    },
+    "placement": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "PlacementTypes",
+        "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-start\" | \"left\" | \"left-end\" | \"left-start\" | \"right\" | \"right-end\" | \"right-start\" | \"top\" | \"top-end\" | \"top-start\"",
+        "references": {
+          "PlacementTypes": {
+            "location": "import",
+            "path": "../../../models/bcm-types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "placement",
+      "reflect": false,
+      "defaultValue": "Bcm.Placement['bottom-start']"
+    },
+    "linkedComponent": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "linked-component",
+      "reflect": false
+    }
+  }; }
+  static get methods() { return {
+    "set": {
+      "complexType": {
+        "signature": "(value: string) => Promise<void>",
+        "parameters": [{
+            "tags": [{
+                "name": "param",
+                "text": "value"
+              }],
+            "text": ""
+          }],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "",
+        "tags": [{
+            "name": "desc",
+            "text": undefined
+          }, {
+            "name": "param",
+            "text": "value"
+          }]
+      }
+    },
+    "get": {
+      "complexType": {
+        "signature": "() => Promise<any>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<any>"
+      },
+      "docs": {
+        "text": "",
+        "tags": []
+      }
+    },
+    "setDisabled": {
+      "complexType": {
+        "signature": "(disabled: boolean) => Promise<void>",
+        "parameters": [{
+            "tags": [{
+                "name": "param",
+                "text": "disabled"
+              }],
+            "text": ""
+          }],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<void>"
+      },
+      "docs": {
+        "text": "",
+        "tags": [{
+            "name": "desc",
+            "text": undefined
+          }, {
+            "name": "param",
+            "text": "disabled"
+          }]
+      }
+    },
+    "getInput": {
+      "complexType": {
+        "signature": "() => Promise<HTMLBcmOldInputElement>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          },
+          "HTMLBcmOldInputElement": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<HTMLBcmOldInputElement>"
+      },
+      "docs": {
+        "text": "",
+        "tags": [{
+            "name": "desc",
+            "text": undefined
+          }]
+      }
+    },
+    "getValue": {
+      "complexType": {
+        "signature": "() => Promise<any>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<any>"
+      },
+      "docs": {
+        "text": "",
+        "tags": [{
+            "name": "desc",
+            "text": undefined
+          }]
+      }
+    },
+    "isValid": {
+      "complexType": {
+        "signature": "() => Promise<{ valid: boolean; error: boolean; errorText: string; }>",
+        "parameters": [],
+        "references": {
+          "Promise": {
+            "location": "global"
+          }
+        },
+        "return": "Promise<{ valid: boolean; error: boolean; errorText: string; }>"
+      },
+      "docs": {
+        "text": "",
+        "tags": [{
+            "name": "desc",
+            "text": undefined
+          }]
+      }
+    },
+    "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": []
+      }
+    },
+    "open": {
+      "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()
+], BcmTimePicker.prototype, "el", void 0);