'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-d685a739.js');
const index$1 = require('./index-4f00f593.js');
const roleManagement_service = require('./role-management.service-2109723c.js');
const scheduleArray = require('./scheduleArray-0ba3d6f8.js');
require('./index-889ce6c6.js');
require('./promise-f77cab90.js');
require('./api-client-00edc9b6.js');
require('./datorama-akita-bb801820.js');
require('./delay-e91dba76.js');
require('./filter-c38164e6.js');

const ConfirmDialog = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.accepted = index.createEvent(this, "accepted", 7);
    this.declined = index.createEvent(this, "declined", 7);
    this.cancelled = index.createEvent(this, "cancelled", 7);
    this.dialogStyle = 'success';
    this.allowedDialogStyles = ['success', 'danger', 'warning', 'info'];
  }
  componentWillLoad() {
    this.validateDialogStyle();
  }
  componentDidUpdate() {
    this.validateDialogStyle();
  }
  render() {
    return (index.h("div", { class: "uiid-delete-benefit-popup" }, index.h("div", { class: "my-3" }, index.h("slot", null)), index.h("div", { class: "text-right" }, index.h("button", { class: `uiid-confirm-delete-benefit-item btn btn-${this.dialogStyle} mr-3`, onClick: (_) => {
        var _a;
        (_a = this.accepted) === null || _a === void 0 ? void 0 : _a.emit();
      } }, this.acceptText || 'Accept'), index.h("button", { class: "btn btn-light", onClick: (_) => {
        var _a;
        (_a = this.declined) === null || _a === void 0 ? void 0 : _a.emit();
      } }, this.declineText || 'Decline'))));
  }
  validateDialogStyle() {
    if (!this.allowedDialogStyles.some((style) => style === this.dialogStyle)) {
      this.dialogStyle = 'success';
    }
  }
};

const RoleEditorsSection = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.storeSubscription = new scheduleArray.Subscription();
    this.isEmailValid = false;
    this.displayInvalidEmailError = false;
    this.emailNotExist = false;
    this.isLoading = false;
    // From https://emailregex.com/
    // eslint-disable-next-line no-control-regex
    this.emailRegex = /(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/;
    this.editorItem = (editorProfile) => {
      const { basicProfile, benefitsProfile } = editorProfile;
      const getRoleDescription = (role) => {
        switch (role) {
          case 'accountAdmin':
            return 'Admin';
          case 'accountEditor':
            return 'Editor';
          case 'user':
            return 'User';
          default:
            return 'Unknown';
        }
      };
      return (index.h("tr", null, index.h("td", null, basicProfile.firstName), index.h("td", null, basicProfile.email), index.h("td", null, getRoleDescription(benefitsProfile.role)), index.h("td", { class: "text-center" }, index.h("a", { href: "#", onClick: (e) => {
          e.preventDefault();
          roleManagement_service.roleManagementService.showRemoveEditorDialog(editorProfile);
        } }, "Remove"))));
    };
  }
  componentWillLoad() {
    this.storeSubscription.add(roleManagement_service.roleManagementQuery.editorProfiles$.subscribe((editorProfiles) => (this.editorProfiles = editorProfiles)));
    this.storeSubscription.add(roleManagement_service.roleManagementQuery.editorLoading$.subscribe((editorLoading) => (this.isLoading = editorLoading)));
  }
  disconnectedCallback() {
    this.storeSubscription.unsubscribe();
  }
  render() {
    return (index.h(index.Host, null, index.h("h5", null, "Editors"), index.h("hr", null), index.h("form", { class: "needs-validation", novalidate: true, ref: (element) => (this.form = element) }, index.h("div", { class: "d-flex align-items-start flex-column" }, index.h("h6", null, "Add new editor"), index.h("div", { class: `d-flex align-items-center ${this.displayInvalidEmailError ? 'was-validated' : ''}` }, index.h("input", { type: "text", name: "editorEmail", maxLength: 50, required: true, class: `form-control w-auto ${this.emailNotExist ? 'is-invalid' : ''}`, onFocus: (_) => {
        this.emailNotExist = false;
        this.displayInvalidEmailError = false;
      }, pattern: this.emailRegex.source }), index.h("fl-button", { onClick: async (e) => this.addEditorHandler(e), class: "ml-3" }, index.h("div", { class: "d-flex" }, index.h("ap-ben-icon", { class: "fa mr-2", iconPrefix: "fad", iconId: "user-plus" }), index.h("div", null, "Add"))), index.h("fl-loading-indicator", { class: `ml-3 ${this.isLoading ? '' : 'd-none'}` }), index.h("div", { class: "invalid-feedback ml-3 flex-grow-2" }, this.emailNotExist
      ? 'Email not exists, please check again.'
      : 'Please input a valid Email.')))), index.h("div", { class: "border rounded mt-4 px-0" }, index.h("table", { class: "table m-0" }, index.h("thead", { class: "thead-light" }, index.h("tr", null, index.h("th", { scope: "col" }, "NAME"), index.h("th", { scope: "col" }, "EMAIL"), index.h("th", { scope: "col" }, "ROLE"), index.h("th", { scope: "col" }))), index.h("tbody", null, this.editorProfiles.map(this.editorItem))))));
  }
  async addEditorHandler(e) {
    e.preventDefault();
    this.isEmailValid = this.form.checkValidity();
    this.displayInvalidEmailError = !this.isEmailValid;
    if (!this.isEmailValid) {
      return;
    }
    const emailElement = this.form.elements.namedItem('editorEmail');
    const user = await roleManagement_service.roleManagementService.addEditorByEmail(emailElement.value);
    if (index$1.isNone(user)) {
      this.emailNotExist = true;
    }
    else {
      emailElement.value = '';
    }
  }
};

const RoleOwnerSection = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
  }
  render() {
    const basicProfile = this.owner.basicProfile;
    return (index.h(index.Host, null, index.h("h5", null, "Owner"), index.h("hr", null), index.h("div", { class: "d-flex border rounded px-3" }, index.h("div", { class: "d-flex flex-wrap align-content-center" }, index.h("ap-ben-icon", { class: "text-black-50 fa-4x", iconPrefix: "fad", iconId: "user-circle" })), index.h("div", { class: "d-flex align-items-start flex-column m-3" }, index.h("h5", null, index.h("b", null, `${basicProfile.firstName} ${basicProfile.lastName}`)), index.h("div", null, basicProfile.email)))));
  }
};

const uiContainerCss = ".slide-fwd-center{-webkit-animation:slide-fwd-center 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;animation:slide-fwd-center 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;}@-webkit-keyframes slide-fwd-center{0%{-webkit-transform:translateY(-10px);transform:translateY(-10px);opacity:0.5}100%{-webkit-transform:translateY(0px);transform:translateY(0px);opacity:1}}@keyframes slide-fwd-center{0%{-webkit-transform:translateY(-10px);transform:translateY(-10px);opacity:0.5}100%{-webkit-transform:translateY(0px);transform:translateY(0px);opacity:1}}";

const UiContainer = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.isAppInitialised = false;
  }
  componentDidLoad() {
    this.isAppInitialised = true;
  }
  render() {
    return (index.h(index.Host, { class: {
        'slide-fwd-center': true,
        'd-none': !this.isAppInitialised,
        'd-block': this.isAppInitialised
      } }, index.h("slot", null)));
  }
};
UiContainer.style = uiContainerCss;

exports.ap_ben_confirm_dialog = ConfirmDialog;
exports.ap_ben_role_editors_section = RoleEditorsSection;
exports.ap_ben_role_owner_section = RoleOwnerSection;
exports.ap_ben_ui_container = UiContainer;
