bromcom-ui 2.9.1-rc.0 → 2.9.1-rc.1

package/dist/cjs/bcm-date-picker.cjs.entry.js

@@ -0,0 +1,182 @@
+/*!
+ * Built with Stencil
+ * Copyright (c) Bromcom.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-c591ecec.js');
+const index$1 = require('./index-95ae50d0.js');
+const isLoadDecorator = require('./is-load-decorator-15036f37.js');
+const datetimeHelper = require('./datetime-helper-eaf4fadb.js');
+const generate = require('./generate-efeda203.js');
+const bcm = require('./bcm-9e47c4b2.js');
+const utils = require('./utils-fc077139.js');
+require('./_commonjsHelpers-ed84c3ca.js');
+require('./package-2899048c.js');
+require('./colors-078851ec.js');
+
+const datePickerCss = "@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}.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:inline-flex;width:100%;max-width:256px}:host(.full-width){max-width:100%}:host(.hidden){display:none}:host(.linked-component){display:none}";
+
+var __decorate = (undefined && undefined.__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;
+};
+const BcmDatePicker = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this._id = generate.Generate.UID();
+    this.date = new Date();
+    this.value = undefined;
+    this.endDate = null;
+    this.range = false;
+    this.hidden = false;
+    this.name = undefined;
+    this.fullWidth = false;
+    this.required = false;
+    this.label = undefined;
+    this.placeholder = undefined;
+    this.disabledDates = '';
+    this.disabled = false;
+    this.noMargin = false;
+    this.noCaption = false;
+    this.caption = '';
+    this.captionError = undefined;
+    this.captionType = 'default';
+    this.alignment = undefined;
+    this._internal_id = (Math.random() * 4).toString(16).replace('.', '');
+    this.placement = bcm.Bcm$1.Placement['bottom-start'];
+    this.linkedComponent = undefined;
+    this.clearable = false;
+    this.stateStartDate = null;
+    this.stateEndDate = null;
+  }
+  handleStartDateChange() {
+    this.handleDate();
+  }
+  handleEndDateChange() {
+    this.handleDate();
+  }
+  /**
+   * @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;
+  }
+  async setClear() {
+    await this.picker.setClear();
+    await utils.delay(10);
+    return Promise.resolve();
+  }
+  async setStartDate(dateOrTime) {
+    if (dateOrTime) {
+      dateOrTime = datetimeHelper.DateTimeHelper.convertTimeStampToDate(new Date(dateOrTime).getTime());
+      this.stateStartDate = dateOrTime;
+    }
+    else {
+      this.setClear();
+    }
+  }
+  async setEndDate(dateOrTime) {
+    if (dateOrTime) {
+      dateOrTime = datetimeHelper.DateTimeHelper.convertTimeStampToDate(new Date(dateOrTime).getTime());
+      this.stateEndDate = dateOrTime;
+    }
+    else {
+      this.setClear();
+    }
+  }
+  /* mp --- */
+  handleDate() {
+    if (this.range) {
+      if (this.stateStartDate && this.stateEndDate) {
+        this.set(this.stateStartDate + '-' + this.stateEndDate);
+      }
+    }
+    else {
+      this.set(this.stateStartDate);
+    }
+  }
+  /**
+   * @desc
+   */
+  async getInput() {
+    return await this.picker.getInput();
+  }
+  /**
+   * @desc
+   */
+  async open() {
+    return await this.picker.open();
+  }
+  /**
+   * @desc
+   */
+  async getValue() {
+    return this.value;
+  }
+  /**
+   * @desc
+   */
+  async isValid() {
+    return await this.picker.isValid();
+  }
+  async resetCaption() {
+    await utils.delay(10);
+    await this.picker.resetCaption();
+    this.captionType = 'default';
+    this.captionError = null;
+    await utils.delay(10);
+    return Promise.resolve();
+  }
+  render() {
+    const hostClasses = index$1.classnames(this.hidden ? 'hidden' : null, {
+      'full-width': this.fullWidth,
+      'linked-component': this.linkedComponent,
+    });
+    return (index.h(index.Host, { class: hostClasses }, index.h("bcm-datetime-picker", { "linked-component": this.linkedComponent, id: this._id, name: this.name, type: this.range ? 'range' : 'date', date: this.date, placeholder: this.placeholder, fullWidth: this.fullWidth, ref: el => (this.picker = el), required: this.required, clearable: this.clearable, label: this.label, "end-date": this.endDate, disabled: this.disabled, disabledDates: this.disabledDates, "on-bcm-load": () => this.handlePickerLoad(), "on-bcm-change": (e) => this.handlePickerChange(e), noCaption: this.noCaption, caption: this.caption, captionError: this.captionError, captionType: this.captionType, alignment: this.alignment, placement: this.placement, noMargin: this.noMargin })));
+  }
+  get el() { return index.getElement(this); }
+  static get watchers() { return {
+    "stateStartDate": ["handleStartDateChange"],
+    "stateEndDate": ["handleEndDateChange"]
+  }; }
+};
+__decorate([
+  isLoadDecorator.IsLoad()
+], BcmDatePicker.prototype, "el", void 0);
+BcmDatePicker.style = datePickerCss;
+
+exports.bcm_date_picker = BcmDatePicker;

package/dist/cjs/bcm-date.cjs.entry.js

@@ -0,0 +1,182 @@
+/*!
+ * Built with Stencil
+ * Copyright (c) Bromcom.
+ */
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-c591ecec.js');
+const isLoadDecorator = require('./is-load-decorator-15036f37.js');
+require('./color-helper-c3a819ea.js');
+require('./datetime-helper-eaf4fadb.js');
+const generate = require('./generate-efeda203.js');
+require('./number-helper-b178b610.js');
+require('./string-helper-4cd32dbb.js');
+require('./validators-2adde99d.js');
+require('./element-dragger-a8562f82.js');
+const bcm = require('./bcm-9e47c4b2.js');
+const captionTemplate = require('./caption-template-81dbc490.js');
+const index$1 = require('./index-95ae50d0.js');
+require('./types-cc4adee7.js');
+const labelTemplate = require('./label-template-d531dfb7.js');
+require('./types-7523fd99.js');
+const moment = require('./moment-d06b012f.js');
+require('./colors-56282b00.js');
+require('./utils-fc077139.js');
+require('./colors-078851ec.js');
+require('./_commonjsHelpers-ed84c3ca.js');
+require('./package-2899048c.js');
+require('./slot-template-46018683.js');
+
+var __decorate = (undefined && undefined.__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;
+};
+const BcmDate = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.change = index.createEvent(this, "bcm-change", 7);
+    this.onChange = (e) => {
+      this.value = this.getValueObject(e.detail);
+      this.change.emit(this.value);
+    };
+    // type a göre format belirleme işlemi
+    this.getFormat = () => {
+      if (!this.format) {
+        switch (this.type) {
+          case "time":
+            return this.showSecond ? "HH:mm:ss" : this.showMinute ? "HH:mm" : "HH";
+          case "date":
+            return "DD/MM/YYYY";
+          case "datetime":
+            return this.showSecond ? "DD/MM/YYYY HH:mm:ss" : this.showMinute ? "DD/MM/YYYY HH:mm" : "DD/MM/YYYY HH";
+          case "week":
+            return "YYYY-wo";
+          case "month":
+            return "MM/YYYY";
+          case "year":
+            return "YYYY";
+          default:
+            return "DD/MM/YYYY";
+        }
+      }
+      return this.format;
+    };
+    this.getValueObject = (value) => {
+      if (this.range) {
+        return this.getRangeValueObject(value);
+      }
+      else {
+        return this.createValueObject(value);
+      }
+    };
+    this.getRangeValueObject = (value) => {
+      const [start, end] = value._i || [];
+      const startObject = this.createValueObject(start);
+      const endObject = this.createValueObject(end);
+      return Object.assign({ isValid: startObject.isValid && endObject.isValid, start: startObject, end: endObject, date: [startObject.date, endObject.date], timestamp: [startObject.timestamp, endObject.timestamp], value: `${startObject.value} - ${endObject.value}` }, (this.type === "time" && {
+        time: `${startObject.time} - ${endObject.time}`,
+      }));
+    };
+    this.createValueObject = (value) => {
+      if (value && moment.hooks(value).isValid()) {
+        return Object.assign({ isValid: moment.hooks(value).isValid(), date: moment.hooks(value).toDate(), timestamp: moment.hooks(value).valueOf(), dateObject: {
+            year: moment.hooks(value).year(),
+            day: moment.hooks(value).date(),
+            month: moment.hooks(value).month(),
+            dayOfWeek: moment.hooks(value).day(),
+            monthFirstDay: moment.hooks(value).startOf("month").day(),
+          }, value: moment.hooks(value).format(this.getFormat()) }, (this.type === "time" && {
+          time: moment.hooks(value).format(this.getFormat()),
+          timeObject: {
+            hour: moment.hooks(value).hour(),
+            minute: moment.hooks(value).minute(),
+            second: moment.hooks(value).second(),
+          },
+        }));
+      }
+      else {
+        return null;
+      }
+    };
+    this._id = generate.Generate.UID();
+    this.label = undefined;
+    this.placeholder = undefined;
+    this.size = bcm.Bcm.Size.medium;
+    this.fullWidth = false;
+    this.required = false;
+    this.clearable = false;
+    this.disabled = false;
+    this.noMargin = false;
+    this.caption = undefined;
+    this.noCaption = false;
+    this.captionType = bcm.Bcm.Status.default;
+    this.captionError = undefined;
+    this.name = undefined;
+    this.value = undefined;
+    this.type = "date";
+    this.format = undefined;
+    this.range = false;
+    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.showToday = true;
+    this.disabledDates = undefined;
+  }
+  async getValue() {
+    return this.value;
+  }
+  async get() {
+    var _a;
+    return ((_a = this.value) === null || _a === void 0 ? void 0 : _a.timestamp) || null;
+  }
+  async set(value) {
+    // this.value = value;
+    this.getPickerElement().set(value);
+  }
+  async setClear() {
+    this.getPickerElement().set(null);
+  }
+  async resetCaption() {
+    this.captionType = "default";
+    this.captionError = null;
+  }
+  async getInput() {
+    return this.el.querySelector("input");
+  }
+  async isValid() {
+    var _a;
+    return ((_a = this.getValueObject(this.value)) === null || _a === void 0 ? void 0 : _a.isValid) || false;
+  }
+  getPickerElement() {
+    return this.el.querySelector("bcm-rc-picker");
+  }
+  render() {
+    const { label, size, captionType, required, _id } = this;
+    return (index.h(index.Host, { class: index$1.classnames("bcm-ui-element bcm-ui-input", "tw-relative tw-m-0 tw-inline-flex tw-w-full tw-flex-col", {
+        "tw-max-w-[256px]": !this.fullWidth,
+        "tw-mb-2": !this.noMargin,
+      }) }, label && index.h(labelTemplate.LabelTemplate, { size: size, type: captionType, value: label, required: required, htmlFor: _id }), index.h("bcm-rc-picker", { id: _id + "-picker", class: index$1.classnames("w-full tw-flex"), onBcmRCPickerChange: e => this.onChange(e), disabled: this.disabled, clearable: this.clearable, size: size, placeholder: this.placeholder, error: this.captionType === "error", type: this.type, format: this.getFormat(), range: this.range, showToday: this.showToday, disabledDates: this.disabledDates, showTime: this.showTime, 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.disabledTime }), index.h(captionTemplate.CaptionTemplate, { noCaption: this.noCaption, captionType: this.captionType, captionError: this.captionError, caption: this.caption })));
+  }
+  get el() { return index.getElement(this); }
+};
+__decorate([
+  isLoadDecorator.IsLoad()
+], BcmDate.prototype, "el", void 0);
+
+exports.bcm_date = BcmDate;