@salla.sa/twilight-components 1.0.19 → 1.0.21

package/dist/collection/components/salla-verify/salla-verify.js

@@ -1,273 +0,0 @@
-import { Component, Element, Event, h, Method, Prop } from '@stencil/core';
-import Helper from "../../Helpers/Helper";
-export class SallaVerify {
-  constructor() {
-    this.url = 'profile/verify-mobile';
-    this.by = 'sms';
-    this.autoReload = true;
-    Helper.setHost(this.host);
-    if (this.withoutModal) {
-      this.modal = { show: () => '', hide: () => '' };
-    }
-    else {
-      salla.event.on('profile::verify.mobile', data => this.show(data));
-    }
-  }
-  async getCode() {
-    return this.code.value;
-  }
-  async show(data) {
-    this.data = data;
-    this.resendTimer();
-    this.otpInputs = document.querySelectorAll('.s-verify-input');
-    this.otpInputs[0].focus();
-    Helper.on('input', '.s-verify-input', e => salla.helpers.digitsOnly(e.target));
-    Helper.onKeyUp('.s-verify-input', event => {
-      var _a, _b, _c, _d;
-      let key = event.keyCode || event.charCode;
-      if (event.target.value) {
-        (_a = event.target.nextElementSibling) === null || _a === void 0 ? void 0 : _a.focus();
-        (_b = event.target.nextElementSibling) === null || _b === void 0 ? void 0 : _b.select();
-      }
-      else if ([8, 46].includes(key)) {
-        (_c = event.target.previousElementSibling) === null || _c === void 0 ? void 0 : _c.focus();
-        (_d = event.target.previousElementSibling) === null || _d === void 0 ? void 0 : _d.select();
-      }
-      this.toggleOTPSubmit();
-    });
-    Helper.on('paste', '.s-verify-input', event => {
-      let text = event.clipboardData.getData('text').toArabicDigits().replace(/[^0-9.]/g, '').replace('..', '.');
-      this.otpInputs.forEach((input, i) => input.value = text[i] || '');
-      this.toggleOTPSubmit();
-      setTimeout(() => this.otpInputs[3].focus(), 100);
-    });
-    return this.modal.show();
-  }
-  toggleOTPSubmit() {
-    let otp = [];
-    this.otpInputs.forEach(input => input.value && otp.push(input.value));
-    this.code.value = otp.join('');
-    if (otp.length === 4) {
-      this.btn.removeAttribute('disabled');
-      this.btn.click();
-      return;
-    }
-    this.btn.setAttribute('disabled', '');
-  }
-  resendTimer() {
-    Helper.showElement(this.resendMessage).hideElement(this.resend);
-    let resendAfter = 30;
-    let timerId = setInterval(() => {
-      if (resendAfter === -1) {
-        clearTimeout(timerId);
-        Helper.hideElement(this.resendMessage).showElement(this.resend);
-      }
-      else {
-        this.timer.innerHTML = `${resendAfter >= 10 ? resendAfter : '0' + resendAfter} : 00`;
-        resendAfter--;
-      }
-    }, 1000);
-  }
-  resendCode() {
-    return this.btn.stop()
-      .then(() => this.btn.disable())
-      .then(() => {
-      this.otpInputs.forEach(input => input.value = '');
-      this.otpInputs[0].focus();
-    })
-      .then(() => salla.api.auth.resend(Object.assign({ resend_by: this.by }, this.data)))
-      .then(() => this.resendTimer())
-      .catch(() => this.resendTimer());
-  }
-  submit() {
-    return this.btn.load()
-      .then(() => this.btn.disable())
-      .then(() => salla.document.api.request(this.url, Object.assign({ code: this.code.value }, this.data)))
-      .then(response => this.verified.emit(response))
-      .then(() => this.btn.stop() && this.btn.disable())
-      .then(() => this.modal.hide())
-      .then(() => this.autoReload && window.location.reload())
-      .catch(() => this.btn.stop() && this.btn.enable());
-  }
-  render() {
-    return this.withoutModal ? this.myBody() :
-      h("salla-modal", { id: "s-verify", ref: modal => this.modal = modal, title: salla.lang.get('pages.profile.verify_title') }, this.myBody());
-  }
-  myBody() {
-    return [
-      h("div", { class: "s-verify-message", innerHTML: salla.lang.get('pages.profile.verify_message') }),
-      // <label class="s-verify-label">{salla.lang.get('pages.profile.verify_placeholder')}</label>,
-      h("input", { type: "hidden", name: "code", maxlength: "4", required: true, ref: code => this.code = code }),
-      h("div", { class: "s-verify-codes", dir: "ltr" }, [1, 2, 3, 4].map(() => h("input", { type: "text", maxlength: "1", class: "s-verify-input", required: true }))),
-      h("div", { slot: "footer", class: "s-verify-footer" },
-        h("salla-button", { class: "s-verify-submit", disabled: true, onClick: () => this.submit(), ref: b => this.btn = b }, salla.lang.get('pages.profile.verify')),
-        h("p", { class: "s-verify-resend-message", ref: el => this.resendMessage = el },
-          salla.lang.get('blocks.header.resend_after'),
-          h("b", { class: "s-verify-timer", ref: el => this.timer = el })),
-        h("a", { href: "#", class: "s-verify-resend", onClick: () => this.resendCode(), ref: el => this.resend = el }, salla.lang.get('blocks.comments.submit')),
-        this.backText ?
-          h("a", { href: "#", class: "s-verify-resend", onClick: () => this.backClicked.emit() }, this.backText)
-          : '')
-    ];
-  }
-  static get is() { return "salla-verify"; }
-  static get properties() { return {
-    "withoutModal": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Should render component without modal"
-      },
-      "attribute": "without-modal",
-      "reflect": false
-    },
-    "url": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "url",
-      "reflect": false,
-      "defaultValue": "'profile/verify-mobile'"
-    },
-    "by": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "by",
-      "reflect": false,
-      "defaultValue": "'sms'"
-    },
-    "backText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "back-text",
-      "reflect": false
-    },
-    "autoReload": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "auto-reload",
-      "reflect": false,
-      "defaultValue": "true"
-    }
-  }; }
-  static get events() { return [{
-      "method": "verified",
-      "name": "verified",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }, {
-      "method": "backClicked",
-      "name": "backClicked",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get methods() { return {
-    "getCode": {
-      "complexType": {
-        "signature": "() => Promise<string>",
-        "parameters": [],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<string>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    },
-    "show": {
-      "complexType": {
-        "signature": "(data: any) => Promise<any>",
-        "parameters": [{
-            "tags": [],
-            "text": ""
-          }],
-        "references": {
-          "Promise": {
-            "location": "global"
-          }
-        },
-        "return": "Promise<any>"
-      },
-      "docs": {
-        "text": "",
-        "tags": []
-      }
-    }
-  }; }
-  static get elementRef() { return "host"; }
-}

package/dist/collection/index.js

@@ -1,2 +0,0 @@
-export * from './components/salla-login/salla-login';
-export * from './components/salla-search/salla-search';

package/dist/collection/interfaces/colors.js

@@ -1 +0,0 @@
-export {};

package/dist/collection/interfaces/index.js

@@ -1,2 +0,0 @@
-export * from './colors';
-export * from './ratio';

package/dist/collection/interfaces/ratio.js

@@ -1 +0,0 @@
-export {};

package/dist/collection/plugins/tailwind-theme/generator.js

@@ -1,62 +0,0 @@
-var fs = require('fs');
-var path = require('path');
-var _ = require('lodash');
-var components = {};
-var componentsPath = path.resolve(__dirname, '../../components');
-
-//==================== Global Salla Components Styles ====================//
-var utilities = {
-  '.s-has-error': {'@apply !border-red-500 !text-red-500': {}},
-  '.s-ltr'      : {direction: 'ltr'},
-  '.s-input'    : {'@apply appearance-none form-input': {}},
-  '.s-hidden'   : {'@apply hidden': {}},
-  '.s-block'    : {'@apply block': {}},
-};
-
-fs.readdirSync(componentsPath, {withFileTypes: true})
-  .filter(parent => parent.isDirectory())
-  .forEach(directory => {
-    try {
-      components[directory.name.replace('salla-', '')] = require(path.resolve(componentsPath, directory.name, 'utilities.json'));
-    } catch (e) {
-      // ignore
-    }
-  });
-
-for (const [keyComponent, value] of Object.entries(components)) {
-  console.log('> Processing ' + keyComponent + ' ...');
-  _.forEach(value, function (value, keyUtility) {
-    keyUtility = '.s-' + keyComponent + '-' + keyUtility;
-    utilities[keyUtility] = {[`@apply ${value}`]: {}};
-  });
-  console.log('✓ Processed ' + keyComponent + '');
-}
-
-// write the utilities for the plugin
-console.log('> Write utilities ...');
-fs.writeFileSync(
-  path.resolve(__dirname, 'utilities.json'),
-  JSON.stringify(utilities),
-  function (err) {
-    if (err) {
-      return console.log(err);
-    }
-    console.log('The file was saved!');
-  }
-);
-
-
-// write the save list css
-console.log('> Write safe-list-css ...');
-fs.writeFileSync(
-  path.resolve(__dirname, 'safe-list-css.txt'),
-  Object.keys(utilities).map((name) => name.replace('.', '')).join('\n'),
-  function (err) {
-    if (err) {
-      return console.log(err);
-    }
-    console.log('The file was saved!');
-  }
-);
-
-console.log('✓ Done ...');

package/dist/collection/plugins/tailwind-theme/index.js

@@ -1,26 +0,0 @@
-module.exports = require('tailwindcss/plugin').withOptions(() => {
-  return function ({addUtilities}) {
-    addUtilities({
-      // TODO :: find if there are used and defined them here if its.
-      '.anime-item'         : {},
-      '.text-md'            : {},
-      '.items-top'          : {},
-      '.error'              : {},
-      '.search-box'         : {},
-      '.spinner-loader-wrap': {},
-    });
-
-    // todo :: move it to global
-    addUtilities({
-      '.spinner-loader': {
-        'border-right-color': 'var(--color-main) !important',
-        '&.reverse': {
-          'border-right-color': '#9f7171 !important',
-          'background-color'  : '#f98181'
-        }
-      }
-    });
-
-    addUtilities(require('./utilities.json'));
-  };
-});