bromcom-ui 2.9.0-rc.18 → 2.9.0-rc.19

package/dist/collection/components/third-parts/rc-picker/rc-picker.js

@@ -4,7 +4,7 @@
  */
 import { Bcm } from "@bcm/model";
 import moment from "moment";
-import Picker from "rc-picker";
+import Picker, { RangePicker } from "rc-picker";
 import momentGenerateConfig from "rc-picker/lib/generate/moment";
 import enUS from "rc-picker/lib/locale/en_US";
 import cs from "classnames";
@@ -12,99 +12,99 @@ import React from "react";
 import ReactDOM from "react-dom";
 export class BcmRcPicker {
   constructor() {
-    this.val = undefined;
-    this.type = "date";
-    this.format = undefined;
+    this.manageDisabledDates = (current) => {
+      const { min, max, dates, custom } = this.disabledDates || {};
+      if (min && current.isBefore(this.convertDateToMoment(min)))
+        return true;
+      if (max && current.isAfter(this.convertDateToMoment(max)))
+        return true;
+      if (dates && dates.length > 0) {
+        return dates.some(date => current.isSame(this.convertDateToMoment(date), "day"));
+      }
+      if (custom) {
+        return custom(current);
+      }
+      return false;
+    };
+    this.manageDisabledTime = () => {
+      const { disabledHours, disabledMinutes, disabledSeconds } = this.disabledTime || {};
+      return Object.assign(Object.assign(Object.assign({}, (disabledHours && { disabledHours: () => disabledHours })), (disabledMinutes && { disabledMinutes: () => disabledMinutes })), (disabledSeconds && { disabledSeconds: () => disabledSeconds }));
+    };
+    this.convertDateToMoment = (date) => {
+      return date && date !== "invalid date" ? moment(date) : null;
+    };
     this.placeholder = undefined;
     this.size = Bcm.Size.medium;
-    this.showTime = undefined;
-    this.showToday = undefined;
-    this.showNow = undefined;
-    this.showHour = undefined;
-    this.showMinute = undefined;
-    this.showSecond = undefined;
-    this.use12Hours = undefined;
-    this.error = undefined;
-    this.disabled = undefined;
+    this.error = false;
+    this.disabled = false;
     this.clearable = false;
-    this.defaultValue = undefined;
-    this.newValue = undefined;
-  }
-  setValue(newValue) {
-    this.defaultValue = newValue;
-  }
-  handleChange(newValue) {
-    this.setValue(newValue);
-    this.bcmRCPickerChange.emit(newValue ? moment(newValue) : null);
+    this.type = "date";
+    this.format = undefined;
+    this.range = false;
+    this.showToday = true;
+    this.disabledDates = undefined;
+    this.showTime = false;
+    this.showNow = true;
+    this.showHour = true;
+    this.showMinute = true;
+    this.showSecond = false;
+    this.use12Hours = false;
+    this.hourStep = 1;
+    this.minuteStep = 1;
+    this.secondStep = 1;
+    this.hideDisabledOptions = false;
+    this.disabledTime = undefined;
+    this.newValue = null;
   }
   async set(value) {
-    if (value && value != "invalid date") {
-      this.newValue = moment(value);
-      this.handleChange(moment(value));
-    }
+    this.newValue = value ? moment(value) : null;
+    this.bcmRCPickerChange.emit(this.newValue);
   }
   componentDidRender() {
-    // const onSelect = (newValue: Moment) => {
-    //     // console.log("Select:", newValue);
-    // };
-    const props = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (this.format && { format: this.format })), (this.clearable && { allowClear: this.clearable })), (this.placeholder && { placeholder: this.placeholder })), (this.error && { error: this.error })), (this.disabled && { disabled: this.disabled }));
+    const dateOptions = {
+      showToday: this.showToday,
+      disabledDate: current => this.manageDisabledDates(current),
+    };
+    const timeOptions = {
+      showNow: this.showNow,
+      showHour: this.showHour,
+      showMinute: this.showMinute,
+      showSecond: this.showSecond,
+      use12Hours: this.use12Hours,
+      hourStep: this.hourStep,
+      minuteStep: this.minuteStep,
+      secondStep: this.secondStep,
+      hideDisabledOptions: this.hideDisabledOptions,
+      disabledTime: () => this.manageDisabledTime(),
+    };
     const options = {
-      time: {
-        // showTime: this.showTime,
-        // showToday: this.showToday,
-        showNow: this.showNow,
-        showHour: this.showHour,
-        showMinute: this.showMinute,
-        showSecond: this.showSecond,
-        use12Hours: this.use12Hours,
-        format: this.format,
-        hourStep: 1,
-        minuteStep: 1,
-        secondStep: 1,
-        hideDisabledOptions: false,
-        // defaultValue: moment("08:00", "HH:mm"),
-        disabledTime: () => ({
-        // disabledHours: () => [0, 1, 2, 3, 4, 5, 6, 7, 13, 18, 19, 20, 21, 22, 23],
-        // disabledMinutes: () => [1, 2, 3],
-        // disabledSeconds: () => [1, 2, 3],
-        }),
-        active: true,
-      },
-      date: {
-        format: this.format,
-        showToday: this.showToday,
-      },
+      time: Object.assign({}, timeOptions),
+      date: Object.assign({}, dateOptions),
       datetime: {
-        showTime: true,
-        showNow: this.showNow,
-        showHour: this.showHour,
-        showMinute: this.showMinute,
-        showSecond: this.showSecond,
-        use12Hours: this.use12Hours,
-        format: this.format,
-        showToday: this.showToday,
+        // ...dateOptions, 
+        // ...timeOptions,
+        // showTime={{
+        //     showSecond: false,
+        //     defaultValue: moment('11:28:39', 'HH:mm:ss'),
+        //   }}
+        //   showToday
+        showTime: {
+          showSecond: this.showSecond,
+          // defaultValue: moment(),
+        },
+        showToday: true,
       },
     };
-    const sharedProps = Object.assign(Object.assign(Object.assign(Object.assign({ generateConfig: momentGenerateConfig, value: this.newValue,
-      // onSelect: (newValue: Moment) => this.handleChange(newValue),
-      onChange: (newValue) => this.handleChange(newValue) }, props), { picker: this.type,
-      // presets: [
-      //     {
-      //         label: "Hello World!",
-      //         value: moment(),
-      //     },
-      //     {
-      //         label: "Now",
-      //         value: () => moment(),
-      //     },
-      // ]
-      // showTime: true,
-      // showSecond: false,
-      prefixCls: "bcm-date", suffixIcon: " " }), options[this.type]), { autofocus: true });
-    ReactDOM.render(React.createElement(Picker, Object.assign(Object.assign({}, sharedProps), { locale: enUS, className: cs("bcm-date--" + this.type, {
+    const sharedProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ generateConfig: momentGenerateConfig, value: this.newValue, onChange: newValue => this.set(newValue) }, (this.format && { format: this.format })), (this.clearable && { allowClear: this.clearable })), (this.placeholder && { placeholder: this.placeholder })), (this.error && { error: this.error })), (this.disabled && { disabled: this.disabled })), { format: this.format, picker: this.type }), options[this.type]), { prefixCls: "bcm-date", suffixIcon: " ", autofocus: true, locale: enUS, className: cs(`bcm-date--${this.type}`, {
         [`bcm-date--${this.size}`]: this.size,
-        [`bcm-date--error`]: this.error,
-      }) })), this.el);
+        "bcm-date--error": this.error,
+      }) });
+    if (this.range) {
+      ReactDOM.render(React.createElement(RangePicker, Object.assign({}, sharedProps)), this.el);
+    }
+    else {
+      ReactDOM.render(React.createElement(Picker, Object.assign({}, sharedProps)), this.el);
+    }
   }
   static get is() { return "bcm-rc-picker"; }
   static get originalStyleUrls() {
@@ -119,12 +119,12 @@ export class BcmRcPicker {
   }
   static get properties() {
     return {
-      "val": {
-        "type": "any",
-        "mutable": true,
+      "placeholder": {
+        "type": "string",
+        "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "string",
+          "resolved": "string",
           "references": {}
         },
         "required": false,
@@ -133,15 +133,38 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "val",
+        "attribute": "placeholder",
         "reflect": false
       },
-      "type": {
+      "size": {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "\"time\" | \"date\" | \"week\" | \"month\" | \"year\" | \"datetime\"",
-          "resolved": "\"date\" | \"datetime\" | \"month\" | \"time\" | \"week\" | \"year\"",
+          "original": "SizeTypes",
+          "resolved": "\"large\" | \"medium\" | \"small\"",
+          "references": {
+            "SizeTypes": {
+              "location": "import",
+              "path": "@bcm/model"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "size",
+        "reflect": true,
+        "defaultValue": "Bcm.Size.medium"
+      },
+      "error": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -150,16 +173,16 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "type",
+        "attribute": "error",
         "reflect": false,
-        "defaultValue": "\"date\""
+        "defaultValue": "false"
       },
-      "format": {
-        "type": "string",
+      "disabled": {
+        "type": "boolean",
         "mutable": false,
         "complexType": {
-          "original": "string",
-          "resolved": "string",
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -168,15 +191,16 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "format",
-        "reflect": false
+        "attribute": "disabled",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "placeholder": {
-        "type": "string",
+      "clearable": {
+        "type": "boolean",
         "mutable": false,
         "complexType": {
-          "original": "string",
-          "resolved": "string",
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -185,21 +209,17 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "placeholder",
-        "reflect": false
+        "attribute": "clearable",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "size": {
+      "type": {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "SizeTypes",
-          "resolved": "\"large\" | \"medium\" | \"small\"",
-          "references": {
-            "SizeTypes": {
-              "location": "import",
-              "path": "@bcm/model"
-            }
-          }
+          "original": "\"time\" | \"date\" | \"week\" | \"month\" | \"year\" | \"datetime\"",
+          "resolved": "\"date\" | \"datetime\" | \"month\" | \"time\" | \"week\" | \"year\"",
+          "references": {}
         },
         "required": false,
         "optional": false,
@@ -207,11 +227,11 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "size",
-        "reflect": true,
-        "defaultValue": "Bcm.Size.medium"
+        "attribute": "type",
+        "reflect": false,
+        "defaultValue": "\"date\""
       },
-      "showTime": {
+      "format": {
         "type": "any",
         "mutable": false,
         "complexType": {
@@ -225,15 +245,33 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "show-time",
+        "attribute": "format",
         "reflect": false
       },
+      "range": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "range",
+        "reflect": false,
+        "defaultValue": "false"
+      },
       "showToday": {
-        "type": "any",
+        "type": "boolean",
         "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -243,14 +281,48 @@ export class BcmRcPicker {
           "text": ""
         },
         "attribute": "show-today",
-        "reflect": false
+        "reflect": false,
+        "defaultValue": "true"
+      },
+      "disabledDates": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "{ min: any; max: any; dates: any; custom: any; }",
+          "resolved": "{ min: any; max: any; dates: any; custom: any; }",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
+      },
+      "showTime": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "show-time",
+        "reflect": false,
+        "defaultValue": "false"
       },
       "showNow": {
-        "type": "any",
+        "type": "boolean",
         "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -260,14 +332,15 @@ export class BcmRcPicker {
           "text": ""
         },
         "attribute": "show-now",
-        "reflect": false
+        "reflect": false,
+        "defaultValue": "true"
       },
       "showHour": {
-        "type": "any",
+        "type": "boolean",
         "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -277,14 +350,15 @@ export class BcmRcPicker {
           "text": ""
         },
         "attribute": "show-hour",
-        "reflect": false
+        "reflect": false,
+        "defaultValue": "true"
       },
       "showMinute": {
-        "type": "any",
+        "type": "boolean",
         "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -294,14 +368,15 @@ export class BcmRcPicker {
           "text": ""
         },
         "attribute": "show-minute",
-        "reflect": false
+        "reflect": false,
+        "defaultValue": "true"
       },
       "showSecond": {
-        "type": "any",
+        "type": "boolean",
         "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -311,14 +386,15 @@ export class BcmRcPicker {
           "text": ""
         },
         "attribute": "show-second",
-        "reflect": false
+        "reflect": false,
+        "defaultValue": "false"
       },
       "use12Hours": {
-        "type": "any",
+        "type": "boolean",
         "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "boolean",
+          "resolved": "boolean",
           "references": {}
         },
         "required": false,
@@ -328,14 +404,15 @@ export class BcmRcPicker {
           "text": ""
         },
         "attribute": "use-1-2-hours",
-        "reflect": false
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "error": {
-        "type": "any",
+      "hourStep": {
+        "type": "number",
         "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "number",
+          "resolved": "number",
           "references": {}
         },
         "required": false,
@@ -344,15 +421,16 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "error",
-        "reflect": false
+        "attribute": "hour-step",
+        "reflect": false,
+        "defaultValue": "1"
       },
-      "disabled": {
-        "type": "any",
+      "minuteStep": {
+        "type": "number",
         "mutable": false,
         "complexType": {
-          "original": "any",
-          "resolved": "any",
+          "original": "number",
+          "resolved": "number",
           "references": {}
         },
         "required": false,
@@ -361,10 +439,29 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "disabled",
-        "reflect": false
+        "attribute": "minute-step",
+        "reflect": false,
+        "defaultValue": "1"
       },
-      "clearable": {
+      "secondStep": {
+        "type": "number",
+        "mutable": false,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "second-step",
+        "reflect": false,
+        "defaultValue": "1"
+      },
+      "hideDisabledOptions": {
         "type": "boolean",
         "mutable": false,
         "complexType": {
@@ -378,15 +475,29 @@ export class BcmRcPicker {
           "tags": [],
           "text": ""
         },
-        "attribute": "clearable",
+        "attribute": "hide-disabled-options",
         "reflect": false,
         "defaultValue": "false"
+      },
+      "disabledTime": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "{ disabledHours: any; disabledMinutes: any; disabledSeconds: any }",
+          "resolved": "{ disabledHours: any; disabledMinutes: any; disabledSeconds: any; }",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
       }
     };
   }
   static get states() {
     return {
-      "defaultValue": {},
       "newValue": {}
     };
   }
@@ -412,7 +523,7 @@ export class BcmRcPicker {
     return {
       "set": {
         "complexType": {
-          "signature": "(value: any) => Promise<void>",
+          "signature": "(value: Moment | null) => Promise<void>",
           "parameters": [{
               "tags": [],
               "text": ""
@@ -420,6 +531,10 @@ export class BcmRcPicker {
           "references": {
             "Promise": {
               "location": "global"
+            },
+            "Moment": {
+              "location": "import",
+              "path": "moment"
             }
           },
           "return": "Promise<void>"