@yoobic/yobi 8.2.2 → 8.3.0-2

package/dist/collection/feature-operate/campaign/campaign-heading/campaign-heading.css

@@ -1,299 +0,0 @@
-/* app direction */
-/* border-radius */
-/* border-width */
-/* font family */
-/* font-size */
-/* font weights */
-/* icon size */
-/* used for logos */
-/* spacing for padding, margin, etc... */
-/* shadow */
-/* Z-Index (Ionic)
---------------------------------------------------
-Grouped by elements which would be siblings */
-/* Hairlines width */
-/* Default Colors
----------------------------------- */
-/* Private color variables */
-/* #3880ff; */
-/* #3880ff; */
-/* #3880ff; */
-/* #3880ff; */
-/* #3880ff;*/
-/* #3880ff; */
-/* #3880ff; */
-/* #3880ff; */
-/* #3880ff; */
-/* Color map should provide
-- base: main color to be used.
-- contrast: Color that will provide readable text against the base color
-- shade: 12% darker version of the base color (mix with black)
-- tint: 10% lighter version of the base color (mix with white) */
-/* Themed Colors
-
- Default Foreground and Background Colors values
- Allows users to override an foreground / background colors
- $background-color-value:            $light !default;
- $background-color-rgb:              255, 255, 255 !default; */
-/* Default Foreground and Background Colors
--------------------------------------------------- */
-/* Default General Colors
--------------------------------------------------- */
-/* Default List & List Items
--------------------------------------------------- */
-/* Item Divider */
-/* iOS List & List Items
--------------------------------------------------- */
-/* Default Toolbar
---------------------------------------------------*/
-/* iOS Toolbar
---------------------------------------------------*/
-/* Default Tabs & Tab bar
---------------------------------------------------*/
-/* iOS Tabs & Tab bar
---------------------------------------------------*/
-/* Function related variables
---------------------------------------------------*/
-/* Gets the active color's css variable from a variation. Alpha is optional.
---------------------------------------------------------------------------------------------
-Example usage:
-current-color(base) => var(--ion-color-base)
-current-color(contrast, 0.1) => rgba(var(--ion-color-contrast-rgb), 0.1)
---------------------------------------------------------------------------------------------*/
-/* Gets the specific color's css variable from the name and variation. Alpha/rgb are optional.
---------------------------------------------------------------------------------------------
-Example usage:
-ion-color(primary, base) => var(--ion-color-primary, #3880ff)
-ion-color(secondary, contrast) => var(--ion-color-secondary-contrast)
-ion-color(primary, base, 0.5) => rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.5)
---------------------------------------------------------------------------------------------*/
-/* Mixes a color with black to create its shade.
---------------------------------------------------------------------------------------------*/
-/*Mixes a color with white to create its tint.
---------------------------------------------------------------------------------------------*/
-/* Converts a color to a comma separated rgb.
---------------------------------------------------------------------------------------------*/
-/* Str functions.
-___________________________________________________________________________________________*/
-/* Creates a pulse animation.
-  @param {color} $begin-color [stable-20] - starting color for pulse.
-  @param {color} $end-color [stable-20] - ending color for pulse.
-  @author Ben Morgan
-  @author Damien Arondel 
-*/
-/* Execute a content if the hover state is supported.
-
- @content the content to execute if relevant
- @author Ben Morgan
- @author Damien Arondel
-*/
-/* Properly hide overflow on rounded corner elements for Webkit based browsers.
- This mixin must be used at the same level as `overflow: hidden` and `border-radius: ...`.
-
- @link https://gist.github.com/ayamflow/b602ab436ac9f05660d9c15190f4fd7
- @author Ben Morgan
- @author Damien Arondel
-*/
-/* Truncate every overflown elements with an ellipsis.
- This mixin does not work with flex box on the same level.
-
- @author Ben Morgan
- @author Damien Arondel
-*/
-/* Truncate text at a specific number of lines.
- */
-/* app direction */
-/* border-radius */
-/* border-width */
-/* font family */
-/* font-size */
-/* font weights */
-/* icon size */
-/* used for logos */
-/* spacing for padding, margin, etc... */
-/* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
-/* Text Direction - ltr / rtl
-$app-direction: multi | rtl | ltr | null (default)
-multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.
-rtl: Always assumes rtl and only includes rtl css. No [dir] selectors.
-ltr: Always assumes ltr and only includes ltr css. No [dir] selectors.
-null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override ltr defaults.
----------------------------------------------------------- */
-/* Add property horizontal
- @param {string} $start
- @param {string} $end
-----------------------------------------------------------*/
-/* Add property for all directions
-  @param {string} $prop
-  @param {string} $top
-  @param {string} $end
-  @param {string} $bottom
-  @param {string} $start
-  @param {boolean} $content include content or use default
-----------------------------------------------------------*/
-/* Add margin for all directions
-  @param {string} $top
-  @param {string} $end
-  @param {string} $bottom
-  @param {string} $start
-----------------------------------------------------------*/
-/* Add padding for all directions
-  @param {string} $top
-  @param {string} $end
-  @param {string} $bottom
-  @param {string} $start
-----------------------------------------------------------*/
-/*Font smoothing
---------------------------------------------------*/
-/* SVG Background Image Mixin
-  @param {string} $svg
-----------------------------------------------------------*/
-/* Add padding horizontal
-  @param {string} $start
-  @param {string} $end
-----------------------------------------------------------*/
-/* Add margin horizontal
- @param {string} $start
- @param {string} $end
-----------------------------------------------------------*/
-/* Add safe area padding horizontal
-  @param {string} $start
-  @param {string} $end
-----------------------------------------------------------*/
-/* Add border radius for all directions
-  @param {string} $top-start
-  @param {string} $top-end
-  @param {string} $bottom-end
-  @param {string} $bottom-start
-----------------------------------------------------------*/
-/* Sets correct text align with support for old browsers
-  @param {string} $direction - text direction
-  @param {string} $decorator - !important
-----------------------------------------------------------*/
-/* Add position for all directions
-  @param {string} $top
-  @param {string} $end
-  @param {string} $bottom
-  @param {string} $start
-----------------------------------------------------------*/
-/* Add position horizontal
-  @param {string} $start - amount to position start
-  @param {string} $end - amount to left: 0; end
-----------------------------------------------------------*/
-/**
- * NOTE DO NOT USE FOR NEW COMPONENTS
- * LEGACY CODE -- Styles maintained only to prevent breaking changes
- * For all Font Sizes please use the appropreate font-size-XX Variables.
- */
-/**
-* Global style mixin for being able to change the background / font-color and border-color
-* programmatically using global classes
-*/
-/* app direction */
-/* border-radius */
-/* border-width */
-/* font family */
-/* font-size */
-/* font weights */
-/* icon size */
-/* used for logos */
-/* spacing for padding, margin, etc... */
-/* shadow */
-:host .outer-container {
-  padding: 1.5rem;
-  padding-top: 0;
-  padding-bottom: 0;
-  background: var(--light, #ffffff);
-}
-:host .outer-container .inner-container {
-  display: flex;
-  flex-direction: column;
-}
-:host .outer-container .inner-container .top-container {
-  display: flex;
-}
-:host .outer-container .inner-container .top-container .image-container {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  margin: 0rem;
-  margin-right: 1rem;
-}
-:host .outer-container .inner-container .top-container .left-part {
-  display: flex;
-  flex: 1;
-  flex-direction: column;
-  justify-content: center;
-  overflow: hidden;
-}
-:host .outer-container .inner-container .top-container .left-part .title-container {
-  padding-right: var(--spacing-08, 0.5rem);
-  font-weight: var(--font-weight-400, 400);
-  font-size: var(--font-size-28, 1.75rem);
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-:host .outer-container .inner-container .top-container .left-part .description-container {
-  margin-bottom: var(--spacing-04, 0.25rem);
-  color: var(--text-color, #807f83);
-  font-weight: var(--font-weight-400, 400);
-  font-size: var(--font-size-16, 1rem);
-}
-:host .outer-container .inner-container .top-container .left-part .description-container p {
-  margin: 0;
-}
-:host .outer-container .inner-container .top-container .left-part .tags-container {
-  display: block;
-  margin-bottom: var(--spacing-04, 0.25rem);
-  color: var(--app-color, #5a30f4);
-}
-:host .outer-container .inner-container .top-container .left-part .tags-container .hashtag {
-  padding-right: var(--spacing-08, 0.5rem);
-}
-:host .outer-container .inner-container .top-container .left-part .campaign-tags-container {
-  display: flex;
-}
-:host .outer-container .inner-container .top-container .left-part .campaign-tags-container yoo-tag {
-  margin-right: 0.3rem;
-}
-:host .outer-container .inner-container .top-container .right-part {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-:host .outer-container .inner-container .top-container .right-part yoo-button {
-  padding: var(--spacing-08, 0.5rem);
-}
-:host .outer-container .inner-container .bottom-container {
-  padding: var(--spacing-08, 0.5rem);
-  color: var(--text-color, #807f83);
-  font-size: var(--font-size-14, 0.875rem);
-}
-:host .outer-container .inner-container .bottom-container:not(.no-border) {
-  border-bottom: var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1);
-}
-:host .outer-container .inner-container .bottom-container .more-container.open {
-  margin-bottom: var(--spacing-04, 0.25rem);
-}
-:host .outer-container .inner-container .bottom-container .more-container .more-icon {
-  padding-right: var(--spacing-04, 0.25rem);
-}
-:host .outer-container .inner-container .bottom-container .more-content {
-  display: flex;
-  flex-direction: column;
-}
-:host .outer-container .inner-container .bottom-container .more-content .row {
-  display: flex;
-  flex: 1;
-  margin-bottom: var(--spacing-04, 0.25rem);
-}
-:host .outer-container .inner-container .bottom-container .more-content .row .black {
-  color: var(--dark, #000000);
-}
-:host .outer-container .inner-container .bottom-container .more-content .row .campaign-type {
-  padding-right: var(--spacing-32, 2rem);
-}

package/dist/collection/feature-operate/campaign/campaign-heading/campaign-heading.js

@@ -1,145 +0,0 @@
-import { dateFormat, isCampaignRecurring, translate, translateMulti } from '@shared/utils';
-import { Component, Event, h, Prop, State } from '@stencil/core';
-import { getCampaignStateTags } from '../../../feature-operate/campaign/helpers/operation-helpers';
-export class YooCampaignHeadingComponent {
-  constructor() {
-    this.canEdit = true;
-    this.showMore = false;
-  }
-  toggleMore() {
-    this.showMore = !this.showMore;
-  }
-  renderTagsContainer() {
-    var _a, _b;
-    const campaignTags = getCampaignStateTags(this.campaign);
-    return (h("div", { class: "campaign-tags-container" },
-      campaignTags
-        ? campaignTags.map((item) => (h("yoo-tag", { color: item.color, customColor: item.customColor, size: item.size || 'small', closable: item.closable, noBackground: item.noBackground, innerHTML: item.innerHTML, icon: item.icon, iconOnlySize: item.iconOnlySize, iconOnlyColor: item.iconOnlyColor })))
-        : null, (_b = (_a = this.campaign) === null || _a === void 0 ? void 0 : _a.tags) === null || _b === void 0 ? void 0 :
-      _b.map((tag) => {
-        return h("yoo-tag", { color: "text-color-10" }, tag);
-      })));
-  }
-  renderTopContainer() {
-    return (h("div", { class: "top-container" },
-      !this.campaign.processIcon && this.campaign.icon && (h("div", { class: "image-container" },
-        h("yoo-avatar", { size: "extra-extra-large", frame: "square", imgSrc: this.campaign.icon._downloadURL || this.campaign.icon, color: "app-color" }))),
-      this.campaign.processIcon && (h("div", { class: "image-container" },
-        h("yoo-avatar", { size: "extra-extra-large", frame: "square", icon: this.campaign.processIcon, color: this.campaign.color }))),
-      h("div", { class: "left-part" },
-        h("div", { class: "title-container" }, translateMulti(this.campaign.title)),
-        h("yoo-truncated-line", { class: "description-container", content: translateMulti(this.campaign.text) }),
-        this.renderTagsContainer()),
-      h("div", { class: "right-part" }, this.canEdit && h("yoo-button", { onClick: () => this.edited.emit(true) }, translate('YOOBICEDIT')))));
-  }
-  renderMoreContent() {
-    return (h("div", { class: "more-content" },
-      h("div", { class: "row" },
-        h("div", { class: "campaign-type" },
-          h("span", { class: "black" }, `${translate('CAMPAIGNTYPE')}: `),
-          h("span", { class: "text" }, `${translate(this.campaign.type.toUpperCase())} • ${isCampaignRecurring(this.campaign) ? translate('RECURRING') : ''}`)),
-        h("div", { class: "campaign-pages" },
-          h("span", { class: "black" }, `${translate('PAGES')}: `),
-          h("span", { class: "text" }, `${this.campaign.slides ? this.campaign.slides.length : 0}`))),
-      h("div", { class: "row" },
-        h("div", { class: "edited-by" },
-          h("span", { class: "black" }, `${translate('EDITED')}: `),
-          h("span", { class: "text" }, `${dateFormat(this.campaign._ect, 'L')} ${translate('YOOBICBY').toLowerCase()}`)))));
-  }
-  renderBottomContainer() {
-    return (h("div", { class: { 'bottom-container': true, 'no-border': this.alwaysExpanded } },
-      !this.alwaysExpanded && (h("div", { class: { 'more-container': true, open: this.showMore }, onClick: () => this.toggleMore() },
-        h("span", { class: "more-icon" },
-          h("yoo-icon", { size: "small", name: this.showMore ? 'arrow-down' : 'right' })),
-        h("span", { class: "more-text" }, translate('MORE2')))),
-      (this.showMore || this.alwaysExpanded) && this.renderMoreContent()));
-  }
-  render() {
-    return (h("div", { class: "outer-container" },
-      h("div", { class: "inner-container" }, this.renderTopContainer())));
-  }
-  static get is() { return "yoo-campaign-heading"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["campaign-heading.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["campaign-heading.css"]
-  }; }
-  static get properties() { return {
-    "campaign": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "IMissionDescription",
-        "resolved": "IMissionDescription",
-        "references": {
-          "IMissionDescription": {
-            "location": "import",
-            "path": "@shared/interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The campaign with all relevant attributes of the campaign heading."
-      }
-    },
-    "canEdit": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "can-edit",
-      "reflect": false,
-      "defaultValue": "true"
-    },
-    "alwaysExpanded": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "always-expanded",
-      "reflect": false
-    }
-  }; }
-  static get states() { return {
-    "showMore": {}
-  }; }
-  static get events() { return [{
-      "method": "edited",
-      "name": "edited",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      }
-    }]; }
-}

package/dist/design-system/app-globals-0f993ce5.js

@@ -1,3 +0,0 @@
-const globalScripts = () => {};
-
-export { globalScripts as g };

package/dist/design-system/form-choice-helpers-48f116d0.js

@@ -1,65 +0,0 @@
-import { R as isNullOrUndefined } from './index-8124f773.js';
-import { P as findIndex, y as isEqual, j as compact, Q as shuffle } from './lodash-063b88d5.js';
-import { h as hasDuplicates, s as showWarningAlert } from './draggable-tags-helpers-127fcf8b.js';
-import { a as setValueAndValidateInput, s as setValidator } from './form-input-helpers-2d1cd91f.js';
-
-function isSelected(item, selection) {
-  const tmpSelection = [].concat(selection);
-  const index = findIndex(tmpSelection, (s) => isEqual(item, s));
-  return index >= 0;
-}
-function onItemSelect(item, choiceElement, preventSetValue = false) {
-  if (choiceElement.customEvent) {
-    choiceElement.choiceSelected.emit(item);
-  }
-  else if (!choiceElement.readonly) {
-    const index = choiceElement.selection.indexOf(item);
-    if (choiceElement.multiple) {
-      choiceElement.selection = index < 0 ? [...choiceElement.selection, item] : [...choiceElement.selection.slice(0, index), ...choiceElement.selection.slice(index + 1)];
-    }
-    else {
-      choiceElement.selection = index < 0 ? [item] : [];
-    }
-    if (!preventSetValue) {
-      setValueAndValidateInput(choiceElement.multiple ? choiceElement.selection : choiceElement.selection[0], choiceElement);
-    }
-  }
-}
-function getColor(value, valuesColor, selection) {
-  var _a;
-  if ((valuesColor === null || valuesColor === void 0 ? void 0 : valuesColor.length) && value) {
-    return isSelected(value, selection) ? ((_a = valuesColor.find(({ key }) => key === value)) === null || _a === void 0 ? void 0 : _a.value) || '' : '';
-  }
-  return '';
-}
-function updateValue(newVal, oldVal, choiceElement, onSelectCall) {
-  if (!isEqual(oldVal, newVal)) {
-    choiceElement.selection = [];
-    compact([].concat(newVal)).forEach((v) => {
-      !onSelectCall ? onItemSelect(v, choiceElement, true) : onSelectCall(v);
-    });
-  }
-}
-function updateValues(newVal, oldVal, choiceElement, warningMsgs) {
-  if (!isEqual(newVal, oldVal) && !hasWarnings(newVal, choiceElement, warningMsgs)) {
-    choiceElement.choices = updateChoices(choiceElement.values, choiceElement.shuffled);
-  }
-}
-function prepareChoice(choiceElement) {
-  setValidator(choiceElement);
-  if (!isNullOrUndefined(choiceElement.value)) {
-    choiceElement.selection = [].concat(choiceElement.value);
-  }
-  choiceElement.choices = updateChoices(choiceElement.values, choiceElement.shuffled);
-}
-function hasWarnings(values, choiceElement, warningMsgs) {
-  const duplicateMessage = 'NODUPLICATEVALUES';
-  const hasDuplicatedValues = hasDuplicates(values);
-  showWarningAlert(choiceElement.host, hasDuplicatedValues || !!(warningMsgs === null || warningMsgs === void 0 ? void 0 : warningMsgs.length), hasDuplicatedValues ? duplicateMessage : warningMsgs === null || warningMsgs === void 0 ? void 0 : warningMsgs[0]);
-  return hasDuplicatedValues && (warningMsgs === null || warningMsgs === void 0 ? void 0 : warningMsgs.length) > 0;
-}
-function updateChoices(values, shuffled) {
-  return shuffled ? shuffle(values) : values;
-}
-
-export { updateValue as a, getColor as g, hasWarnings as h, isSelected as i, onItemSelect as o, prepareChoice as p, updateValues as u };

package/dist/design-system/index-86d36134.js

@@ -1 +0,0 @@
-import './index-8124f773.js';

package/dist/design-system/index-91a2748e.js

@@ -1 +0,0 @@
-import './localForage-f63f86c9.js';

package/dist/design-system/readonly-card-a1c05d52.js

@@ -1,14 +0,0 @@
-import { T as translateMulti } from './index-8124f773.js';
-import { h } from './index-019c1b1a.js';
-
-const ReadonlyCard = ({ value, values, answer, valuesColor, classNames }) => {
-  const classes = typeof classNames === 'string' ? classNames : Object.keys(classNames).join(' ');
-  return h("div", { class: { [classes]: !!classes, 'readonly-card': true } }, (!!value && (Array.isArray(value) ? value : [value])).map((val) => {
-    var _a, _b;
-    const isCorrect = answer === null || answer === void 0 ? void 0 : answer.includes(val);
-    const title = (_a = values === null || values === void 0 ? void 0 : values.find((v) => (v === null || v === void 0 ? void 0 : v.value) === val)) === null || _a === void 0 ? void 0 : _a.title;
-    return h("div", { class: { text: true, valid: answer && isCorrect, invalid: answer && !isCorrect }, style: { color: (_b = valuesColor === null || valuesColor === void 0 ? void 0 : valuesColor.find(e => e.key === val)) === null || _b === void 0 ? void 0 : _b.value }, innerHTML: translateMulti(title || val) });
-  }));
-};
-
-export { ReadonlyCard as R };

package/dist/design-system/swiper-c95eccaa.js

@@ -1,11 +0,0 @@
-import { S as Swiper, P as Pagination, A as Autoplay, a as Scrollbar } from './yoo-ion-slides-9f9e25fe.js';
-export { S as Swiper } from './yoo-ion-slides-9f9e25fe.js';
-import './index-019c1b1a.js';
-import './index-8124f773.js';
-import './lodash-063b88d5.js';
-import './_commonjsHelpers-f4d11124.js';
-import './index-cbc2c080.js';
-import './common-helpers-882ed431.js';
-import './theme-7dc3b7a0.js';
-
-Swiper.use([Pagination, Autoplay, Scrollbar]);

package/dist/design-system/yoo-campaign-editor-recap.entry.js

@@ -1,112 +0,0 @@
-import { r as registerInstance, i as createEvent, h, e as Host } from './index-019c1b1a.js';
-import { t as translate, U as getLanguageKey, V as MONGODB_ID_REGEX, W as pipes } from './index-8124f773.js';
-import './lodash-063b88d5.js';
-import './_commonjsHelpers-f4d11124.js';
-import './index-cbc2c080.js';
-
-const campaignEditorRecapCss = ":host{display:block;width:100%}:host yoo-progress-bar{--progress-value-font-size:var(--font-size-14, 0.875rem);width:calc(100% - 4rem);margin-top:var(--spacing-16, 1rem);margin-left:var(--spacing-32, 2rem)}:host .advanced{display:-ms-flexbox;display:flex;margin:1.5rem;margin-left:3rem;cursor:pointer}:host .advanced yoo-icon{margin-right:0.8rem}:host .top-container{display:-ms-flexbox;display:flex;margin:1.5rem;margin-top:1rem;margin-bottom:0;padding:1.5rem 1rem;background:var(--light, #ffffff);border:var(--border-width-01, 0.0625rem) solid var(--stable-alt, #d0d0d0);border-radius:var(--border-radius-08, 0.5rem);cursor:pointer}:host .top-container:hover{border:var(--border-width-01, 0.0625rem) solid var(--dark, #000000) !important}:host .top-container.invalid{background-color:var(--stable-alt-10, rgba(208, 208, 208, 0.1));border:var(--border-width-01, 0.0625rem) solid var(--stable-alt-10, rgba(208, 208, 208, 0.1))}:host .top-container.translated-partial .left-part .description-container{color:var(--stable, #adadad)}:host .top-container.translated-partial .left-part .description-container span{color:var(--warning, #ed6e33)}:host .top-container.translated-full .left-part .description-container,:host .top-container.translated-partial .left-part .description-container{display:-ms-flexbox;display:flex}:host .top-container.translated-full .left-part .description-container span,:host .top-container.translated-partial .left-part .description-container span{display:-ms-flexbox;display:flex}:host .top-container.translated-full .left-part .description-container span yoo-icon,:host .top-container.translated-partial .left-part .description-container span yoo-icon{margin:0 var(--spacing-04, 0.25rem)}:host .top-container .icon-part{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-right:1.5rem}:host .top-container .number-part{padding-right:1.5rem;font-weight:bold;font-size:var(--font-size-54, 3.375rem)}:host .top-container .left-part{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}:host .top-container .left-part .heading-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .top-container .left-part .heading-container .title-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;font-weight:var(--font-weight-900, 900);font-size:var(--font-size-20, 1.25rem)}:host .top-container .left-part .description-container{color:var(--text-color, #807f83);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem)}:host .top-container .left-part .description-container p{margin:0}:host .top-container .left-part .description-container .date-spacer{margin-right:1rem}:host .top-container .left-part .description-container .black{color:var(--dark, #000000)}:host .top-container .right-part{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host .top-container .right-part yoo-button{padding:var(--spacing-08, 0.5rem)}";
-
-const YooCampaignEditorRecapComponent = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.edited = createEvent(this, "edited", 7);
-    this.previewed = createEvent(this, "previewed", 7);
-  }
-  renderContainer(index, section, showSuccess, content, translatedLanguages) {
-    return (h("div", { class: { 'top-container': true, invalid: !showSuccess, 'translated-full': (translatedLanguages === null || translatedLanguages === void 0 ? void 0 : translatedLanguages.length) > 0 && this.fullyTranslated, 'translated-partial': (translatedLanguages === null || translatedLanguages === void 0 ? void 0 : translatedLanguages.length) > 0 && !this.fullyTranslated }, onClick: () => this.edited.emit(section) }, h("div", { class: "icon-part" }, h("yoo-icon", { name: "check", color: showSuccess ? 'app-color' : 'stable' })), h("div", { class: "number-part" }, h("span", null, index)), h("div", { class: "left-part" }, h("div", { class: "heading-container" }, h("div", { class: "title-container" }, translate('CAMPAIGNEDITOR' + section.toUpperCase()))), content ? (h("div", { class: "description-container" }, content, (translatedLanguages === null || translatedLanguages === void 0 ? void 0 : translatedLanguages.length) > 0 &&
-      h("yoo-tooltip", { content: this.getTooltipContent(), placement: "top" }, h("span", null, h("yoo-icon", { color: !this.fullyTranslated ? 'warning' : 'stable', name: "translate" }), " ", translate('TRANSLATEDINCOUNT', { count: translatedLanguages.length }))))) : (h("div", { class: "description-container", innerHTML: translate('CAMPAIGNEDITOR' + this.campaign.type.toUpperCase() + section.toUpperCase() + 'DESCRIPTION') }))), h("div", { class: "right-part" }, h("yoo-button", { color: showSuccess ? 'light' : 'app-color' }, translate((this.isTranslator && section === 'content' ? 'CAMPAIGNTRANSLATOR' : 'CAMPAIGNEDITOR') + section.toUpperCase() + 'EDIT')))));
-  }
-  renderCategory(text) {
-    return h("span", { class: "black" }, translate(text) + ': ');
-  }
-  getTooltipContent() {
-    let languagesDisplay = '';
-    this.campaign.languages.forEach((lang, langIndex) => {
-      languagesDisplay += translate(getLanguageKey(lang)) + (langIndex >= this.campaign.languages.length - 1 ? '' : ', ');
-    });
-    return '<span>' + translate('TRANSLATEDINLANGUAGES', { languages: languagesDisplay, baseLanguage: translate(getLanguageKey(this.campaign.baseLanguage) || 'TRANSLATE_EN') }) + (!this.fullyTranslated ? `<br/><br/>${translate('PARTIALTRANSLATEWARNING')}` : '') + '</span>';
-  }
-  isAudienceValid() {
-    var _a, _b, _c, _d, _e, _f;
-    return (((this.campaign.type === 'mission') && ((_a = this.campaign.storesQuery) === null || _a === void 0 ? void 0 : _a.total) > 0) ||
-      ((this.campaign.type === 'todo') && (((_c = (_b = this.campaign.audience) === null || _b === void 0 ? void 0 : _b.usersQuery) === null || _c === void 0 ? void 0 : _c.total) > 0 || ((_e = (_d = this.campaign.audience) === null || _d === void 0 ? void 0 : _d.storesQuery) === null || _e === void 0 ? void 0 : _e.total) > 0)) ||
-      ((this.campaign.type === 'service' || this.campaign.type === 'poll') && ((_f = this.campaign.group) === null || _f === void 0 ? void 0 : _f.length) > 0));
-  }
-  renderAudience(index) {
-    var _a, _b;
-    // Remove userId string from selection list.
-    const filteredCampaignGroups = (_b = (_a = this.campaign) === null || _a === void 0 ? void 0 : _a.group) === null || _b === void 0 ? void 0 : _b.filter((group) => !(group === null || group === void 0 ? void 0 : group.match(MONGODB_ID_REGEX)));
-    if (this.isAudienceValid()) {
-      return this.renderContainer(index, 'audience', true, this.campaign.type === 'mission' || this.campaign.type === 'todo'
-        ? this.campaign.storesQuery.total.toLocaleString() + ' ' + translate('CAMPAIGNEDITORSTORES')
-        : filteredCampaignGroups.length.toLocaleString() + ' ' + translate('CAMPAIGNEDITORGROUPS'));
-    }
-    return this.renderContainer(index, 'audience');
-  }
-  isScheduleValid() {
-    return this.campaign.type === 'poll' || !!this.campaign.recurrenceType;
-  }
-  renderSchedule(index) {
-    if (this.isScheduleValid()) {
-      const content = (h("div", null, (this.campaign.autoRenew === false || this.campaign.autoRenew === true) && (h("span", null, this.renderCategory('RECURRENCE'), this.campaign.recurrenceType && translate('CAMPAIGN' + this.campaign.recurrenceType.toUpperCase()))), (this.campaign.autoRenew === false || this.campaign.autoRenew === true) && h("span", { class: "date-spacer" }), this.campaign.validFrom && (h("span", null, this.renderCategory('VALIDFROM'), pipes.dateFormat.transform(this.campaign.validFrom, 'L LT'))), h("span", { class: "date-spacer" }), this.campaign.validUntil && (h("span", null, this.renderCategory('VALIDUNTIL'), pipes.dateFormat.transform(this.campaign.validUntil, 'L LT'))), h("span", { class: "date-spacer" }), this.campaign.duedate && (h("span", null, this.renderCategory('DUEDATE'), pipes.dateFormat.transform(this.campaign.duedate, 'L LT')))));
-      return this.renderContainer(index, 'schedule', true, content);
-    }
-    return this.renderContainer(index, 'schedule');
-  }
-  isContentValid() {
-    return this.campaign.slides && this.campaign.slides.length > 0;
-  }
-  renderContent(index) {
-    var _a;
-    if (this.isContentValid()) {
-      return this.renderContainer(index, 'content', true, this.campaign.slides.length.toLocaleString() + ' ' + translate('PAGES'), (_a = this.campaign) === null || _a === void 0 ? void 0 : _a.languages);
-    }
-    return this.renderContainer(index, 'content');
-  }
-  isReportValid() {
-    return true;
-  }
-  hasSchedule() {
-    var _a, _b, _c;
-    return ((_a = this.campaign) === null || _a === void 0 ? void 0 : _a.type) === 'mission' || ((_b = this.campaign) === null || _b === void 0 ? void 0 : _b.type) === 'todo' || ((_c = this.campaign) === null || _c === void 0 ? void 0 : _c.type) === 'poll';
-  }
-  hasAudience() {
-    return !this.campaign.hasWorkflow || this.campaign.type === 'mission' || this.campaign.type === 'todo'; // this.campaign && this.campaign.type === 'mission';
-  }
-  renderReport(index) {
-    if (this.isReportValid()) {
-      const content = (h("div", null, h("div", null)));
-      return this.renderContainer(index, 'report', true, content);
-    }
-    return this.renderContainer(index, 'report');
-  }
-  renderAdvanced() {
-    return h("div", { class: "advanced", onClick: () => this.edited.emit('settings') }, h("yoo-icon", { name: "settings" }), h("span", null, translate('ADVANCEDSETTINGS')));
-  }
-  renderProgress() {
-    let progress = 0;
-    if (this.isAudienceValid() && this.hasAudience()) {
-      progress += 1;
-    }
-    if (this.isContentValid()) {
-      progress += 1;
-    }
-    if (this.isReportValid()) {
-      progress += 1;
-    }
-    if (this.isScheduleValid()) {
-      progress += 1;
-    }
-    const max = this.hasSchedule() && this.hasAudience() ? 4 : !this.hasSchedule() && !this.hasAudience() ? 2 : 3;
-    progress = Math.min(progress, max);
-    return (h("yoo-progress-bar", { value: progress, maxValue: max, metric: "step" }));
-  }
-  render() {
-    const hasAudience = this.hasAudience();
-    const hasSchedule = this.hasSchedule();
-    return h(Host, null, this.renderProgress(), this.renderContent(1), hasAudience && this.renderAudience(2), this.renderReport(hasAudience ? 3 : 2), hasSchedule && this.renderSchedule(hasAudience ? 4 : 3), this.renderAdvanced());
-  }
-};
-YooCampaignEditorRecapComponent.style = campaignEditorRecapCss;
-
-export { YooCampaignEditorRecapComponent as yoo_campaign_editor_recap };