@yoobic/yobi 8.5.0-41 → 8.5.0-43

package/dist/cjs/yoo-form-todo-mission.cjs.entry.js

@@ -0,0 +1,300 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-7319daa9.js');
+const index$1 = require('./index-f9aace31.js');
+require('./index-3f2bca41.js');
+const lodash = require('./lodash-a9050d79.js');
+const commonHelpers = require('./common-helpers-edf7fda5.js');
+const overlays = require('./overlays-c545c947.js');
+require('./_commonjsHelpers-94df2ea7.js');
+
+const formTodoMissionCss = "svg:not(:root){overflow:hidden}:host{display:block}:host .outer-container{position:relative}:host .outer-container .title{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-16, 1rem);font-weight:bold;text-transform:uppercase}:host .outer-container .title yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-bottom:var(--spacing-24, 1.5rem);border-radius:var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container{margin:var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container #previous{display:-ms-flexbox;display:flex}:host .outer-container .container #task-container #previous menu-left{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0 var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container #previous menu-left .border{width:100%;height:0;border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1);width:var(--spacing-02, 0.125rem);height:100%;margin-bottom:var(--spacing-04, 0.25rem);background-color:var(--app-color, #5a30f4)}:host .outer-container .container #task-container #previous menu-right yoo-form-input-container{font-weight:var(--font-weight-700, 700);font-size:var(--font-size-16, 1rem)}:host .outer-container .container #task-container #previous menu-right yoo-form-text-area{font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host .outer-container .container #task-container .linked-task{margin:var(--spacing-08, 0.5rem) 0 var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);color:var(--dark-40, rgba(0, 0, 0, 0.4));font-size:var(--font-size-12, 0.75rem)}:host .outer-container .container #task-container .task{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container .task header{display:-ms-flexbox;display:flex}:host .outer-container .container #task-container .task header task-details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .outer-container .container #task-container .task header task-details .task-title{margin:0;padding:0 0 0 var(--spacing-08, 0.5rem);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-16, 1rem)}:host .outer-container .container #task-container .task header task-details .user{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin:0;padding:var(--spacing-08, 0.5rem) 0 0 var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container .task header task-details .user yoo-avatar{padding-right:var(--spacing-04, 0.25rem)}:host .outer-container .container #task-container .task header task-details .user p{margin:0;font-weight:normal;font-size:var(--font-size-12, 0.75rem)}:host .outer-container .container #task-container .task header task-details yoo-tag{padding:var(--spacing-08, 0.5rem) 0 0 var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container .task header yoo-button{position:absolute;right:var(--spacing-16, 1rem);margin:0}:host .outer-container .container #task-container .task additionnal-fields{padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container .task additionnal-fields #comments{padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container .task additionnal-fields #comments comments-header{display:-ms-flexbox;display:flex}:host .outer-container .container #task-container .task additionnal-fields #comments comments-header .comments-title{margin:0;font-size:var(--font-size-12, 0.75rem)}:host .outer-container .container #task-container .task additionnal-fields #comments comments-header .comments-optional{margin:0;padding-left:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-12, 0.75rem)}:host .outer-container .container #task-container .task additionnal-fields #comments yoo-form-text-area{font-size:var(--font-size-16, 1rem)}:host .outer-container .container #task-container .task additionnal-fields #comments[editModeComments] comments-header{padding-bottom:var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container .task additionnal-fields #photo{padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container .task additionnal-fields #photo photo-header{display:-ms-flexbox;display:flex}:host .outer-container .container #task-container .task additionnal-fields #photo photo-header .photo-title{margin:0;font-size:var(--font-size-12, 0.75rem)}:host .outer-container .container #task-container .task additionnal-fields #photo photo-header .photo-optional{margin:0;padding-left:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-12, 0.75rem)}:host .outer-container .container #task-container .task additionnal-fields #photo photo-header[withComments]{padding-top:var(--spacing-08, 0.5rem)}:host .outer-container .container #task-container .task additionnal-fields #photo[editModePhoto] photo-header{padding-bottom:var(--spacing-08, 0.5rem)}:host .outer-container .container yoo-button{margin:0 var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem)}:host .outer-container .container yoo-button p{color:var(--app-color, #5a30f4)}:host .outer-container .container[status=finished]{background:var(--success-10, rgba(58, 167, 109, 0.1))}:host .outer-container .container[status=unable-to-complete]{background:var(--danger-10, rgba(212, 67, 51, 0.1))}:host .outer-container .container[status=unmarked]{background:var(--stable-10, rgba(173, 173, 173, 0.1))}:host .outer-container .container[status=unmarked] #task-container{background:var(--light, #ffffff);border:solid var(--border-width-01, 0.0625rem) var(--stable-alt, #d0d0d0);border-radius:var(--border-radius-08, 0.5rem)}:host([readonly]) .outer-container .title{margin-top:var(--spacing-04, 0.25rem)}:host([readonly]) .outer-container .container .task{padding:var(--spacing-08, 0.5rem)}:host([readonly]) .outer-container .container .task line{height:0.0625rem;margin-top:var(--spacing-16, 1rem)}:host([readonly]) .outer-container .container[status=finished] .task line{background-color:var(--success-20, rgba(58, 167, 109, 0.2))}:host([readonly]) .outer-container .container[status=unable-to-complete] .task line{background-color:var(--danger-20, rgba(212, 67, 51, 0.2))}:host([readonly]) .outer-container .container[status=unmarked] .task line{background-color:var(--stable-20, rgba(173, 173, 173, 0.2))}:host(.web) .outer-container .container yoo-button.assign{max-width:11.25rem}:host(.web) .outer-container .container yoo-button.assign p{font-size:var(--font-size-14, 0.875rem)}@media print{:host .outer-container .title{page-break-after:avoid}:host .outer-container .container{page-break-inside:avoid}}:host(.modal-view){max-height:65%}";
+
+const YooFormTodoMissionComponent = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.assignUser = index.createEvent(this, "assignUser", 7);
+    this.schedule = index.createEvent(this, "schedule", 7);
+    this.update = index.createEvent(this, "update", 7);
+    this.emitUpdate = (value) => {
+      this.update.emit(value);
+      index.forceUpdate(this);
+    };
+    this.emitSchedule = (value) => {
+      this.schedule.emit(value);
+      index.forceUpdate(this);
+    };
+    this.updateSelfAssignee = (task, index) => {
+      var _a, _b, _c, _d, _e;
+      const isPhotoInProgress = ((_a = task.hasphoto) === null || _a === void 0 ? void 0 : _a.value) && (((_b = task.showPhotos) === null || _b === void 0 ? void 0 : _b.value) || task.imageData);
+      const isTaskInProgress = (this.status[index] !== 'unmarked') || ((_c = task.showComments) === null || _c === void 0 ? void 0 : _c.value) || isPhotoInProgress;
+      if (isTaskInProgress) {
+        if (!((_d = task.user) === null || _d === void 0 ? void 0 : _d.value)) {
+          task.user = { value: lodash.pick(this.user, index$1.IUser.getSimpleFields()), selfAssigned: true };
+        }
+      }
+      else if ((_e = task.user) === null || _e === void 0 ? void 0 : _e.selfAssigned) {
+        delete task.user;
+      }
+    };
+    this.photoButton = (task, index) => {
+      var _a;
+      const showPhotos = (_a = task.showPhotos) === null || _a === void 0 ? void 0 : _a.value;
+      return {
+        icon: 'camera',
+        iconColor: 'app-color',
+        text: overlays.translate(showPhotos ? 'YOOBICREMOVEPHOTOFIELD' : 'CAMPAIGNPHOTOHELP'),
+        handler: () => { var _a; return this.onPhotoButtonToggled(task, index, (_a = task.showPhotos) === null || _a === void 0 ? void 0 : _a.value); }
+      };
+    };
+    this.commentsButton = (task, index) => {
+      var _a;
+      const showComments = (_a = task.showComments) === null || _a === void 0 ? void 0 : _a.value;
+      return {
+        icon: 'comment',
+        iconColor: 'app-color',
+        text: overlays.translate(showComments ? 'DELETECOMMENT' : 'ADDCOMMENTS'),
+        handler: () => { var _a; return this.onCommentButtonToggled(task, index, (_a = task.showComments) === null || _a === void 0 ? void 0 : _a.value); }
+      };
+    };
+    this.scheduleButton = (task, index) => {
+      const hasDueDate = task.duedate;
+      return {
+        icon: 'calendar-date',
+        iconColor: 'app-color',
+        text: overlays.translate(hasDueDate ? 'RESCHEDULE' : 'SCHEDULE'),
+        handler: () => this.onScheduleButtonToggled(index)
+      };
+    };
+    this.markAsUnableButton = (index) => {
+      return {
+        icon: 'circle-minor',
+        iconColor: 'danger',
+        text: overlays.translate('YOOBICMARKASUNABLETOCOMPLETE'),
+        color: 'danger',
+        handler: () => this.onMarkAsUnableButtonToggled(this.values[index], index)
+      };
+    };
+    this.onCommentsChange = (ev, index) => {
+      const task = this.values[index];
+      task.userComments = ev.detail;
+      this.emitUpdate({ task, index });
+    };
+  }
+  async forceUpdate() {
+    index.forceUpdate(this);
+  }
+  componentWillLoad() {
+    var _a;
+    this.status = new Array();
+    (_a = this.values) === null || _a === void 0 ? void 0 : _a.forEach((task, index) => {
+      var _a;
+      if (task.userComments) {
+        task.showComments = { value: true };
+      }
+      if (task.imageData && !((_a = task.isphotorequired) === null || _a === void 0 ? void 0 : _a.value)) {
+        task.showPhotos = { value: true };
+      }
+      this.status.push('unmarked');
+      task.finished = task.finished || { value: null };
+      this.updateTaskStatus(task, index);
+    });
+  }
+  updateTaskStatus(task, index) {
+    var _a, _b;
+    if ((_a = task === null || task === void 0 ? void 0 : task.finished) === null || _a === void 0 ? void 0 : _a.value) {
+      this.status[index] = 'finished';
+    }
+    else if (((_b = task === null || task === void 0 ? void 0 : task.finished) === null || _b === void 0 ? void 0 : _b.value) === false) {
+      this.status[index] = 'unable-to-complete';
+    }
+    else {
+      this.status[index] = 'unmarked';
+    }
+    return this.status[index];
+  }
+  getEditableOptions(task, index) {
+    var _a, _b, _c, _d, _e;
+    if (this.readonly || (((_a = task.user) === null || _a === void 0 ? void 0 : _a.value) && ((_c = (_b = task.user) === null || _b === void 0 ? void 0 : _b.value) === null || _c === void 0 ? void 0 : _c._id) !== ((_d = this.user) === null || _d === void 0 ? void 0 : _d._id))) {
+      return [this.scheduleButton(task, index)];
+    }
+    else {
+      return lodash.compact([
+        ((_e = task.isphotorequired) === null || _e === void 0 ? void 0 : _e.value) ? null : this.photoButton(task, index),
+        this.commentsButton(task, index),
+        this.scheduleButton(task, index),
+        this.status[index] === 'unable-to-complete' ? null : this.markAsUnableButton(index)
+      ]);
+    }
+  }
+  onIconClicked(task, index) {
+    var _a, _b;
+    if (this.readonly || (((_a = task.user) === null || _a === void 0 ? void 0 : _a.value) && task.user.value._id !== ((_b = this.user) === null || _b === void 0 ? void 0 : _b._id))) {
+      return;
+    }
+    const updatedTask = this.values[index];
+    if (this.status[index] === 'unmarked') {
+      this.status[index] = 'finished';
+      updatedTask.finished = { value: true, date: new Date() };
+    }
+    else {
+      this.status[index] = 'unmarked';
+      updatedTask.finished = { value: undefined, date: undefined };
+    }
+    this.updateSelfAssignee(task, index);
+    this.emitUpdate({ task: updatedTask, index });
+  }
+  onCommentButtonToggled(task, index, showComments) {
+    const updatedShowComments = !showComments;
+    if (updatedShowComments) {
+      task.userComments = '';
+    }
+    else {
+      delete task.userComments;
+    }
+    task.showComments = { value: updatedShowComments };
+    this.updateSelfAssignee(task, index);
+    this.emitUpdate({ task, index });
+  }
+  onPhotoButtonToggled(task, index, showPhotos) {
+    const updatedShowPhotos = !showPhotos;
+    if (!updatedShowPhotos) {
+      delete task.imageData;
+    }
+    task.showPhotos = { value: updatedShowPhotos };
+    this.updateSelfAssignee(task, index);
+    this.emitUpdate({ task, index });
+  }
+  onScheduleButtonToggled(index) {
+    const task = this.values[index];
+    this.emitSchedule({ task, index });
+  }
+  onMarkAsUnableButtonToggled(task, index) {
+    var _a, _b;
+    let status = this.updateTaskStatus(task, index);
+    if (status === 'unable-to-complete') {
+      status = 'unmarked';
+      delete task.finished;
+      if ((_a = task.user) === null || _a === void 0 ? void 0 : _a.selfAssigned) {
+        delete task.user;
+      }
+    }
+    else {
+      status = 'unable-to-complete';
+      task.finished = { value: false, date: new Date() };
+      if (!((_b = task.user) === null || _b === void 0 ? void 0 : _b.value)) {
+        task.user = { value: lodash.pick(this.user, index$1.IUser.getSimpleFields()), selfAssigned: true };
+      }
+    }
+    this.status[index] = status;
+    this.values[index] = task;
+    this.emitUpdate({ task, index });
+  }
+  renderCommentsField(task, index$1, userComments) {
+    var _a, _b, _c, _d;
+    const readonlyComments = this.readonly || (((_a = task.user) === null || _a === void 0 ? void 0 : _a.value) && task.user.value._id !== ((_b = this.user) === null || _b === void 0 ? void 0 : _b._id)) ? true : false;
+    const renderComments = readonlyComments ? (((_c = task.showComments) === null || _c === void 0 ? void 0 : _c.value) && (userComments === null || userComments === void 0 ? void 0 : userComments.length)) : (_d = task.showComments) === null || _d === void 0 ? void 0 : _d.value;
+    return (!!renderComments &&
+      index.h("section", { id: "comments", ...{ editModeComments: !readonlyComments } }, index.h("comments-header", null, index.h("p", { class: "comments-title" }, overlays.translate('COMMENTNOUN').toUpperCase()), index.h("p", { class: "comments-optional" }, "(", overlays.translate('OPTIONAL'), ")")), index.h("yoo-form-text-area", { value: userComments, resizable: "none", size: "small", placeholder: overlays.translate('ADDCOMMENTS'), disableEnter: true, validateInput: false, disableTab: true, onInputChanged: (ev) => {
+          const updatedTask = this.values[index$1];
+          updatedTask.userComments = ev.detail;
+          this.emitUpdate({ task: updatedTask, index: index$1 });
+        }, readonly: readonlyComments })));
+  }
+  renderPhotoField(task, index$1) {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const isphotorequired = (_a = task.isphotorequired) === null || _a === void 0 ? void 0 : _a.value;
+    const isAssignedToSomeoneElse = ((_b = task.user) === null || _b === void 0 ? void 0 : _b.value) && task.user.value._id !== ((_c = this.user) === null || _c === void 0 ? void 0 : _c._id);
+    const readonlyPhoto = this.readonly || isAssignedToSomeoneElse;
+    const disabled = isAssignedToSomeoneElse && !task.imageData && !this.completed;
+    let renderPhotoField;
+    if (readonlyPhoto) {
+      renderPhotoField = (isphotorequired && !this.completed) || (((_d = task.hasphoto) === null || _d === void 0 ? void 0 : _d.value) && task.imageData);
+    }
+    else {
+      renderPhotoField = isphotorequired || ((_e = task.showPhotos) === null || _e === void 0 ? void 0 : _e.value);
+    }
+    return (!!renderPhotoField &&
+      index.h("section", { id: "photo", ...{ editModePhoto: !readonlyPhoto } }, index.h("photo-header", { ...{ withComments: (_f = task.showComments) === null || _f === void 0 ? void 0 : _f.value } }, index.h("p", { class: "photo-title" }, overlays.translate('YOOBICPHOTO').toUpperCase()), !isphotorequired && index.h("p", { class: "photo-optional" }, "(", overlays.translate('OPTIONAL'), ")")), index.h("yoo-form-capture", { value: task.imageData, allowLibrary: !!((_g = task.allowLibrary) === null || _g === void 0 ? void 0 : _g.value), disabled: disabled, readonly: readonlyPhoto && !disabled, size: readonlyPhoto && !disabled ? 'extra-small' : 'medium', type: "photo", onInputChanged: (event) => {
+          const updatedTask = this.values[index$1];
+          updatedTask.hasphoto = { value: true };
+          updatedTask.imageData = event.detail;
+          this.updateSelfAssignee(task, index$1);
+          this.emitUpdate({ task: updatedTask, index: index$1 });
+        } })));
+  }
+  renderDuedateTag(date) {
+    var _a;
+    // when a parent is already displaying the due date of the Todo mission into the DOM, and that all tasks have the same due date, do not display it for each of them
+    const hideDueDate = this.completed && this.overallDuedate && ((_a = this.values) === null || _a === void 0 ? void 0 : _a.every((todo) => { var _a; return overlays.isDateSame((_a = todo.duedate) === null || _a === void 0 ? void 0 : _a.value, this.overallDuedate, 'minute'); }));
+    if (date && !hideDueDate) {
+      let dueDateText = overlays.isToday(date) ? overlays.translate('YOOBICTODAY').toLowerCase() : overlays.fromToday(date);
+      dueDateText = [overlays.translate('YOOBICYESTERDAY'), overlays.translate('YOOBICTOMORROW')].includes(dueDateText) ? dueDateText.toLowerCase() : dueDateText;
+      const color = overlays.isDateAfter(date, new Date(), 'day') ? overlays.getCssColor('text-color') : overlays.getCssColor('danger');
+      return index.h("yoo-tag", { customColor: color, size: "small" }, index.h("yoo-icon", { class: { custom: true }, size: "small", name: "calendar-date", slot: "start" }), overlays.translate('YOOBICDUEBY', { date: dueDateText, time: overlays.dateFormat(date, 'LT') }));
+    }
+  }
+  renderUser(task) {
+    var _a, _b;
+    if ((_a = task.user) === null || _a === void 0 ? void 0 : _a.value) {
+      const finishedDate = (_b = task.finished) === null || _b === void 0 ? void 0 : _b.date;
+      const dateLabel = overlays.translate('ONDATEAT', { date: overlays.dateFormat(finishedDate, 'L'), time: overlays.dateFormat(finishedDate, 'LT') });
+      return (index.h("div", { class: "user" }, index.h("yoo-avatar", { user: task.user.value, size: "extra-small" }), index.h("p", null, overlays.getUserDisplayName(task.user.value), " ", finishedDate && lodash.lowerFirst(dateLabel))));
+    }
+  }
+  renderAssignButton(task, index$1) {
+    var _a;
+    return (index.h("yoo-button", { class: "assign", size: overlays.isWeb(this.host) ? 'medium' : 'large', onClick: () => this.assignUser.emit({ task, index: index$1 }) }, index.h("yoo-icon", { name: "assign", color: "app-color", size: "small", slot: "start" }), index.h("p", null, ((_a = task.user) === null || _a === void 0 ? void 0 : _a.value) ? overlays.translate('REASSIGN') : overlays.translate('ASSIGN'))));
+  }
+  renderPlusButton(task, index$1) {
+    let plusButtonRef;
+    return (index.h("yoo-button", { shape: "circular", size: "small", color: "stable-alt", fill: "transparent", slot: "end", ref: (el) => (plusButtonRef = el), onClick: (ev) => overlays.showActionSheet(this.getEditableOptions(task, index$1), null, null, plusButtonRef, ev) }, index.h("yoo-icon", { name: "circle-plus", color: "app-color", size: "medium" })));
+  }
+  renderIcon(task, index$1) {
+    var _a, _b;
+    const isAssignedAnother = ((_a = task.user) === null || _a === void 0 ? void 0 : _a.value) && (task.user.value._id !== ((_b = this.user) === null || _b === void 0 ? void 0 : _b._id));
+    let iconName;
+    let iconColor;
+    if (this.status[index$1] === 'finished') {
+      iconName = 'check';
+      iconColor = 'success';
+    }
+    else if (this.status[index$1] === 'unable-to-complete') {
+      iconName = 'circle-minor';
+      iconColor = 'danger';
+    }
+    else if (this.readonly || isAssignedAnother) {
+      iconName = 'lock';
+      iconColor = 'stable-alt';
+    }
+    else {
+      iconName = 'circle';
+      iconColor = 'stable-alt';
+    }
+    return index.h("yoo-icon", { name: iconName, color: iconColor, onClick: () => this.onIconClicked(task, index$1) });
+  }
+  renderLinkedField(task) {
+    var _a;
+    if (((_a = task === null || task === void 0 ? void 0 : task.field) === null || _a === void 0 ? void 0 : _a.name) && (task === null || task === void 0 ? void 0 : task.fieldValue)) {
+      const field = lodash.cloneDeep(task.field);
+      field.title = field.description || field.title;
+      delete field.condition;
+      return (index.h("section", { id: "previous" }, index.h("menu-left", null, index.h("yoo-icon", { name: "link", size: "medium", color: "app-color" }), index.h("div", { class: "border" })), index.h("menu-right", null, index.h("yoo-form-dynamic", { class: "inline transparent", slides: [{ title: 'YOOBICGENERAL', items: [field] }], data: { [field.name]: { value: task.fieldValue, ...task.fieldExtra } }, forceReadonly: true, onFormValidityChanged: (ev) => ev.stopPropagation(), suffix: ".value", animated: false, showRecap: false }))));
+    }
+  }
+  render() {
+    var _a;
+    return !!((_a = this.values) === null || _a === void 0 ? void 0 : _a.length) && (index.h(index.Host, { class: commonHelpers.getAppContext(this.host) }, index.h("div", { class: "outer-container" }, index.h("div", { class: "title" }, index.h("yoo-icon", { size: "medium", name: "mission", slot: "start" }), overlays.translate('YOOBICTASKS'), " (", this.values.length, ")"), this.values.map((task, index$1) => {
+      var _a, _b, _c, _d, _e, _f;
+      const dueDate = (_a = task.duedate) === null || _a === void 0 ? void 0 : _a.value;
+      const status = this.updateTaskStatus(task, index$1);
+      return (index.h("main", { class: "container", ...{ status } }, index.h("section", { id: "task-container" }, this.renderLinkedField(task), task.field && index.h("p", { class: "linked-task" }, overlays.translate('YOOBICLINKEDTASK')), index.h("div", { class: "task" }, index.h("header", null, this.renderIcon(task, index$1), index.h("task-details", null, index.h("p", { class: "task-title" }, (_b = task.text) === null || _b === void 0 ? void 0 : _b.value), this.renderUser(task), this.renderDuedateTag(dueDate), status === 'unable-to-complete' && (index.h("yoo-tag", { color: "danger", size: "small" }, overlays.translate('YOOBICMARKEDASUNABLETOCOMPLETE')))), !this.completed && this.renderPlusButton(task, index$1)), this.readonly && (task.userComments || (((_c = task.hasphoto) === null || _c === void 0 ? void 0 : _c.value) && task.imageData)) && index.h("line", null), (((_d = task.isphotorequired) === null || _d === void 0 ? void 0 : _d.value) || ((_e = task.showPhotos) === null || _e === void 0 ? void 0 : _e.value) || ((_f = task.showComments) === null || _f === void 0 ? void 0 : _f.value)) && (index.h("additionnal-fields", null, this.renderCommentsField(task, index$1, task.userComments), this.renderPhotoField(task, index$1))))), status === 'unmarked' && this.renderAssignButton(task, index$1)));
+    }))));
+  }
+  get host() { return index.getElement(this); }
+};
+YooFormTodoMissionComponent.style = formTodoMissionCss;
+
+exports.yoo_form_todo_mission = YooFormTodoMissionComponent;

package/dist/cjs/yoo-form-todo-task-list.cjs.entry.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7319daa9.js');
-require('./index-38c5e81e.js');
+require('./index-3f2bca41.js');
 const sortable_esm = require('./sortable.esm-00e15691.js');
-const commonHelpers = require('./common-helpers-82a45712.js');
-const overlays = require('./overlays-4334b40f.js');
-require('./lodash-72d493b9.js');
-require('./index-a1aee400.js');
+const commonHelpers = require('./common-helpers-edf7fda5.js');
+const overlays = require('./overlays-c545c947.js');
+require('./lodash-a9050d79.js');
+require('./index-f9aace31.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const formTodoTaskListCss = "svg:not(:root){overflow:hidden}:host{display:block}:host ul{margin:0;padding:0;list-style:none}:host ul:not([hidden]){display:grid;gap:var(--spacing-16, 1rem)}:host yoo-banner{--main-color:var(--app-color-10, rgba(90, 48, 244, 0.1))}:host yoo-banner:not([hidden])+ul:not([hidden]){margin-top:var(--spacing-16, 1rem)}:host yoo-button:not([hidden]){display:-ms-inline-flexbox;display:inline-flex;margin:var(--spacing-16, 1rem) 0 0 var(--spacing-08, 0.5rem)}:host yoo-form-todo-task[readonly]{cursor:pointer}:host(.web) li{position:relative}:host(.web) li:hover yoo-form-todo-task{background:var(--stable-light, #f1f1f1)}:host(.web) li:not(:hover) yoo-icon{display:none}:host(.web) li yoo-icon{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);cursor:pointer}:host(.web) li yoo-icon[name=delete]{right:var(--spacing-16, 1rem)}:host(.web) li yoo-icon[name=draggable]{left:var(--spacing-08, 0.5rem)}:host(.web) p{margin:var(--spacing-08, 0.5rem) 0;font-size:var(--font-size-12, 0.75rem)}:host(.mobile) p{margin:var(--spacing-16, 1rem) 0;font-size:var(--font-size-16, 1rem)}";

package/dist/cjs/yoo-form-todo-task.cjs.entry.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7319daa9.js');
-const index$1 = require('./index-38c5e81e.js');
-const lodash = require('./lodash-72d493b9.js');
-const commonHelpers = require('./common-helpers-82a45712.js');
-const overlays = require('./overlays-4334b40f.js');
-require('./index-a1aee400.js');
+const index$1 = require('./index-3f2bca41.js');
+const lodash = require('./lodash-a9050d79.js');
+const commonHelpers = require('./common-helpers-edf7fda5.js');
+const overlays = require('./overlays-c545c947.js');
+require('./index-f9aace31.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const Action = ({ hidden, icon, text, onClick }) => (index.h("yoo-tooltip", { content: text, hidden: hidden, placement: "top" },

package/dist/cjs/yoo-form-todo.cjs.entry.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7319daa9.js');
-require('./index-38c5e81e.js');
-const lodash = require('./lodash-72d493b9.js');
-const formInputHelpers = require('./form-input-helpers-7738afe7.js');
-const overlays = require('./overlays-4334b40f.js');
-require('./index-a1aee400.js');
-require('./common-helpers-82a45712.js');
+require('./index-3f2bca41.js');
+const lodash = require('./lodash-a9050d79.js');
+const formInputHelpers = require('./form-input-helpers-f54b8af0.js');
+const overlays = require('./overlays-c545c947.js');
+require('./index-f9aace31.js');
+require('./common-helpers-edf7fda5.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const formTodoCss = "svg:not(:root){overflow:hidden}:host .outer-container yoo-button{--margin-container:auto}:host .border{width:100%;height:0;border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .newtodo{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;margin-top:var(--spacing-16, 1rem)}:host .newtodo.nomargin{margin-top:0}:host .newtodo .margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .newtodo .icon{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:var(--spacing-02, 0.125rem)}:host .newtodo .flex{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center}:host .newtodo yoo-button{display:inline-block;width:auto}:host .newtodo yoo-button .label{color:var(--app-color, #5a30f4)}:host .readonly .margin-left{display:block;margin-left:var(--spacing-16, 1rem)}:host .readonly .todo-container{margin-bottom:var(--spacing-24, 1.5rem);padding:var(--spacing-08, 0.5rem);background:var(--stable-10, rgba(173, 173, 173, 0.1));border-radius:var(--spacing-08, 0.5rem)}:host .readonly .todo-container .content{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;margin:0.6875rem 0 0.5rem 0}:host .readonly .todo-container .content .content-left yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .readonly .todo-container .content .content-left yoo-icon.stable-alt{color:var(--stable-alt, #d0d0d0)}:host .readonly .todo-container .content .content-right{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .readonly .todo-container .content .content-right .date{color:var(--stable-alt, #d0d0d0);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-14, 0.875rem)}:host .readonly .todo-container .comments{margin-bottom:var(--spacing-16, 1rem);color:var(--stable, #adadad);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-14, 0.875rem)}:host .readonly .todo-container .photo-container{margin-bottom:0.875rem}:host .readonly .todo-container .comment-container{margin-top:0.875rem}:host .readonly .todo-container .textarea-container{margin-top:var(--spacing-08, 0.5rem)}:host .readonly .todo-container .border{width:100%;height:0;border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1);margin-bottom:var(--spacing-08, 0.5rem)}";
@@ -39,9 +39,9 @@ const YooFormTodoComponent = class {
   }
   onUpdateTodo(ev) {
     ev.stopPropagation();
-    this.value.values = ev.detail.values;
-    this.value = { ...this.value };
+    this.value.values[ev.detail.index] = ev.detail.task;
     formInputHelpers.setValueAndValidateInput(this.value, this);
+    index.forceUpdate(this);
   }
   onClearTodo(ev) {
     ev.stopPropagation();
@@ -104,7 +104,7 @@ const YooFormTodoComponent = class {
   }
   renderReadonly() {
     var _a, _b;
-    return (index.h("div", { class: "readonly" }, ((_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.values) === null || _b === void 0 ? void 0 : _b.length) > 0 && (index.h("yoo-form-todo-single", { slidesTodoTask: this.slidesTodoTask, class: "readonly", type: "form", readonly: this.readonly, values: this.value.values, onUpdate: (ev) => this.onUpdateTodo(ev) }))));
+    return (index.h("div", { class: "readonly" }, ((_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.values) === null || _b === void 0 ? void 0 : _b.length) > 0 && (index.h("yoo-form-todo-mission", { class: "readonly", values: this.value.values, user: overlays.getSession().user, readonly: this.readonly, onUpdate: (ev) => this.onUpdateTodo(ev) }))));
   }
   renderEditable() {
     if (this.value && this.value.title) {

package/dist/cjs/yoo-form-toggle.cjs.entry.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7319daa9.js');
-require('./index-38c5e81e.js');
-const commonHelpers = require('./common-helpers-82a45712.js');
-const formInputHelpers = require('./form-input-helpers-7738afe7.js');
-const overlays = require('./overlays-4334b40f.js');
-require('./lodash-72d493b9.js');
-require('./index-a1aee400.js');
+require('./index-3f2bca41.js');
+const commonHelpers = require('./common-helpers-edf7fda5.js');
+const formInputHelpers = require('./form-input-helpers-f54b8af0.js');
+const overlays = require('./overlays-c545c947.js');
+require('./lodash-a9050d79.js');
+require('./index-f9aace31.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const formToggleCss = "svg:not(:root){overflow:hidden}:host .optional{margin-left:var(--spacing-08, 0.5rem) !important;color:var(--stable, #adadad);white-space:nowrap}:host .readonly,:host .outer-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;word-break:break-word}:host .readonly .inner-container,:host .outer-container .inner-container{display:-ms-flexbox;display:flex}:host .readonly .label,:host .outer-container .label{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:row;flex-direction:row;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem);line-height:1.5;text-align:left;font-variant-caps:normal}:host .readonly .label .required,:host .outer-container .label .required{margin-right:var(--spacing-04, 0.25rem);color:var(--danger, #d44333);font-variant-caps:normal}:host .readonly .label .label-required,:host .outer-container .label .label-required{margin-left:var(--spacing-04, 0.25rem);color:var(--danger, #d44333)}:host .readonly .label.readonly,:host .outer-container .label.readonly{letter-spacing:0px}:host .readonly .toggle-container,:host .outer-container .toggle-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;border-radius:3.75rem;-webkit-transition:0.2s cubic-bezier(0.24, 0, 0.5, 1);transition:0.2s cubic-bezier(0.24, 0, 0.5, 1)}:host .readonly .toggle-container.active,:host .outer-container .toggle-container.active{-webkit-transition:width 0.2s cubic-bezier(0, 0, 0, 0.1);transition:width 0.2s cubic-bezier(0, 0, 0, 0.1);-webkit-transition:0.2s cubic-bezier(0.54, 1.6, 0.5, 1);transition:0.2s cubic-bezier(0.54, 1.6, 0.5, 1)}:host .readonly .toggle-container .inner-container,:host .outer-container .toggle-container .inner-container{-webkit-box-sizing:content-box;box-sizing:content-box;border-radius:50%;-webkit-box-shadow:0 0 0 0.0625rem rgba(0, 0, 0, 0.1), 0 4px 0px 0 rgba(0, 0, 0, 0.04), 0 4px 9px rgba(0, 0, 0, 0.13), 0 3px 3px rgba(0, 0, 0, 0.05);box-shadow:0 0 0 0.0625rem rgba(0, 0, 0, 0.1), 0 4px 0px 0 rgba(0, 0, 0, 0.04), 0 4px 9px rgba(0, 0, 0, 0.13), 0 3px 3px rgba(0, 0, 0, 0.05);-webkit-transform:translateX(-1px);transform:translateX(-1px);-webkit-transition:0.2s cubic-bezier(0.54, 1.6, 0.5, 1);transition:0.2s cubic-bezier(0.54, 1.6, 0.5, 1)}:host .readonly .toggle-container .inner-container.active,:host .outer-container .toggle-container .inner-container.active{-webkit-transition:0.2s cubic-bezier(0.54, 1.6, 0.5, 1);transition:0.2s cubic-bezier(0.54, 1.6, 0.5, 1)}:host .readonly .toggle-container{margin:var(--spacing-04, 0.25rem);background-color:var(--stable-light, #f1f1f1);border:solid var(--border-width-01, 0.0625rem) var(--dark-05)}:host .readonly .toggle-container .inner-container{background-color:var(--light, #ffffff) !important;border:solid 0.5px var(--dark-05);-webkit-transform:translateX(2px);transform:translateX(2px)}:host .readonly .toggle-container.active{background-color:var(--app-color-40, rgba(90, 48, 244, 0.4));border-color:var(--app-color, #5a30f4)}:host yoo-icon.left{padding-right:var(--spacing-08, 0.5rem)}:host .outer-container .text-container{-ms-flex:1;flex:1}:host .outer-container .toggle-container{background-color:var(--dark-10, rgba(0, 0, 0, 0.1));border:solid var(--border-width-01, 0.0625rem) var(--dark-10, rgba(0, 0, 0, 0.1))}:host .outer-container .toggle-container.active{background-color:var(--app-color, #5a30f4);border-color:var(--app-color, #5a30f4)}:host .outer-container .toggle-container:hover{cursor:pointer}:host .outer-container .toggle-container .inner-container{background-color:var(--light, #ffffff);border:solid 0.5px var(--dark-10, rgba(0, 0, 0, 0.1))}:host .outer-container .toggle-container .inner-container:hover{cursor:pointer}:host .outer-container .label{color:var(--dark, #000000)}:host .outer-container .help{color:var(--stable, #adadad)}:host(.stable) .readonly .label{color:var(--stable, #adadad)}:host(.line) .outer-container .text-container,:host(.line) .readonly .text-container{-ms-flex-order:1;order:1;margin-left:var(--spacing-16, 1rem)}:host(.fill) .toggle-container{background:var(--light, #ffffff)}:host(.web) .outer-container .label,:host(.web) .readonly .label{padding-left:var(--spacing-08, 0.5rem);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host(.mobile) .outer-container .label.with-help{-ms-flex:initial;flex:initial}:host(.mobile) .outer-container .help{-ms-flex:1;flex:1}:host(.advanced) .outer-container .label.with-help{-ms-flex:initial;flex:initial}:host(.advanced) .outer-container .help{-ms-flex:1;flex:1;padding-left:var(--spacing-08, 0.5rem)}:host(.advanced) .outer-container yoo-tooltip{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host([size=small]) .outer-container .label{font-size:var(--font-size-14, 0.875rem)}:host([size=small]) .toggle-container,:host([size=medium]) .toggle-container{width:1.625rem;height:var(--font-size-14, 0.875rem)}:host([size=small]) .toggle-container .inner-container,:host([size=medium]) .toggle-container .inner-container{width:0.85rem;min-width:0.85rem;height:0.85rem}:host([size=small]) .toggle-container .inner-container.active,:host([size=medium]) .toggle-container .inner-container.active{-webkit-transform:translateX(var(--font-size-12, 0.75rem)) !important;transform:translateX(var(--font-size-12, 0.75rem)) !important}:host([size=large]) .toggle-container{width:var(--spacing-48, 3rem);min-width:var(--spacing-48, 3rem);height:var(--spacing-32, 2rem)}:host([size=large]) .toggle-container .inner-container{width:var(--font-size-28, 1.75rem);height:var(--font-size-28, 1.75rem)}:host([size=large]) .toggle-container .inner-container.active{-webkit-transform:translateX(1.3rem) !important;transform:translateX(1.3rem) !important}:host(.danger) .outer-container .toggle-container.active{background-color:var(--danger, #d44333);border-color:var(--danger, #d44333)}:host(.danger) .readonly .toggle-container.active{background-color:var(--danger-40, rgba(212, 67, 51, 0.4));border-color:var(--danger, #d44333)}:host(.info) .outer-container .toggle-container.active{background-color:var(--info, #d84c96);border-color:var(--info, #d84c96)}:host(.info) .readonly .toggle-container.active{background-color:var(--info-40, rgba(216, 76, 150, 0.4));border-color:var(--info, #d84c96)}:host(.warning) .outer-container .toggle-container.active{background-color:var(--warning, #ed6e33);border-color:var(--warning, #ed6e33)}:host(.warning) .readonly .toggle-container.active{background-color:var(--warning-40, rgba(237, 110, 51, 0.4));border-color:var(--warning, #ed6e33)}:host(.dark) .outer-container .toggle-container.active{background-color:var(--dark, #000000);border-color:var(--dark, #000000)}:host(.dark) .readonly .toggle-container.active{background-color:var(--dark-40, rgba(0, 0, 0, 0.4));border-color:var(--dark, #000000)}:host(.energized) .outer-container .toggle-container.active{background-color:var(--energized, #ffc043);border-color:var(--energized, #ffc043)}:host(.energized) .readonly .toggle-container.active{background-color:var(--energized-40, rgba(255, 192, 67, 0.4));border-color:var(--energized, #ffc043)}:host(.app-color) .outer-container .toggle-container.active{background-color:var(--app-color, #5a30f4);border-color:var(--app-color, #5a30f4)}:host(.app-color) .readonly .toggle-container.active{background-color:var(--app-color-40, rgba(90, 48, 244, 0.4));border-color:var(--app-color, #5a30f4)}:host(.accent) .outer-container .toggle-container.active{background-color:var(--accent, #276ef1);border-color:var(--accent, #276ef1)}:host(.accent) .readonly .toggle-container.active{background-color:var(--accent-40, rgba(39, 110, 241, 0.4));border-color:var(--accent, #276ef1)}:host(.night) .outer-container .toggle-container{background-color:var(--dark-40, rgba(0, 0, 0, 0.4))}:host(.night) .outer-container .toggle-container .inner-container{background-color:var(--app-color, #5a30f4)}";

package/dist/cjs/yoo-form-uploader.cjs.entry.js

@@ -3,13 +3,13 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7319daa9.js');
-const index$1 = require('./index-a1aee400.js');
-require('./index-38c5e81e.js');
+const index$1 = require('./index-f9aace31.js');
+require('./index-3f2bca41.js');
 const _commonjsHelpers = require('./_commonjsHelpers-94df2ea7.js');
-const lodash = require('./lodash-72d493b9.js');
-const commonHelpers = require('./common-helpers-82a45712.js');
-const formInputHelpers = require('./form-input-helpers-7738afe7.js');
-const overlays = require('./overlays-4334b40f.js');
+const lodash = require('./lodash-a9050d79.js');
+const commonHelpers = require('./common-helpers-edf7fda5.js');
+const formInputHelpers = require('./form-input-helpers-f54b8af0.js');
+const overlays = require('./overlays-c545c947.js');
 
 var filepond = _commonjsHelpers.createCommonjsModule(function (module, exports) {
 /*!

package/dist/cjs/yoo-form-videoplayer.cjs.entry.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7319daa9.js');
-require('./index-38c5e81e.js');
-const commonHelpers = require('./common-helpers-82a45712.js');
-const videoPlayerHelpers = require('./video-player-helpers-d896cb98.js');
-const overlays = require('./overlays-4334b40f.js');
-require('./lodash-72d493b9.js');
-require('./index-a1aee400.js');
+require('./index-3f2bca41.js');
+const commonHelpers = require('./common-helpers-edf7fda5.js');
+const videoPlayerHelpers = require('./video-player-helpers-24244610.js');
+const overlays = require('./overlays-c545c947.js');
+require('./lodash-a9050d79.js');
+require('./index-f9aace31.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const YooFormVideoPlayerComponent = class {

package/dist/cjs/yoo-form-wiki.cjs.entry.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-7319daa9.js');
-require('./index-38c5e81e.js');
-const formInputHelpers = require('./form-input-helpers-7738afe7.js');
-const overlays = require('./overlays-4334b40f.js');
-require('./lodash-72d493b9.js');
-require('./index-a1aee400.js');
-require('./common-helpers-82a45712.js');
+require('./index-3f2bca41.js');
+const formInputHelpers = require('./form-input-helpers-f54b8af0.js');
+const overlays = require('./overlays-c545c947.js');
+require('./lodash-a9050d79.js');
+require('./index-f9aace31.js');
+require('./common-helpers-edf7fda5.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const YooFormWikiComponent = class {