@yoobic/yobi 8.3.2 → 8.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (13) hide show
  1. package/dist/cjs/yoo-announcement-heading.cjs.entry.js +1 -1
  2. package/dist/cjs/yoo-card-course.cjs.entry.js +3 -10
  3. package/dist/cjs/yoo-form-connect.cjs.entry.js +1 -1
  4. package/dist/collection/components/form/form-connect/form-connect.css +3 -0
  5. package/dist/collection/feature-learn/learning/card-course/column/card-course.js +3 -10
  6. package/dist/collection/feature-operate/mission/announcement-heading/announcement-heading.js +1 -1
  7. package/dist/design-system/yoo-announcement-heading.entry.js +1 -1
  8. package/dist/design-system/yoo-card-course.entry.js +3 -10
  9. package/dist/design-system/yoo-form-connect.entry.js +1 -1
  10. package/dist/esm/yoo-announcement-heading.entry.js +1 -1
  11. package/dist/esm/yoo-card-course.entry.js +3 -10
  12. package/dist/esm/yoo-form-connect.entry.js +1 -1
  13. package/package.json +1 -1
package/dist/cjs/yoo-announcement-heading.cjs.entry.js CHANGED
@@ -81,7 +81,7 @@ const YooAnnouncementHeadingComponent = class {
81
81
  var _a, _b;
82
82
  const announcementProgress = missionsHelpers.getMissionProgress(this.announcement);
83
83
  const renderProgress = ((_b = (_a = this.announcement.todo) === null || _a === void 0 ? void 0 : _a.values) === null || _b === void 0 ? void 0 : _b.length) > 0;
84
- if ((announcementProgress === null || announcementProgress === void 0 ? void 0 : announcementProgress.value) >= 0 && renderProgress) {
84
+ if (!this.isLayoutFeed && (announcementProgress === null || announcementProgress === void 0 ? void 0 : announcementProgress.value) >= 0 && renderProgress) {
85
85
  return index.h("div", { class: "progress" }, index.h("yoo-progress-bar", { class: "app-color", shape: "circle", hideProgressValue: true, value: announcementProgress.value, metric: announcementProgress.unit, maxValue: announcementProgress.max }), index.h("yoo-truncate", { class: "app-color", style: { cssText: '--max-lines: 1' } }, index.h("span", null, overlays.translate('ACTIONSCOMPLETED', { smart_count: announcementProgress.value, total: announcementProgress.max }))));
86
86
  }
87
87
  }
package/dist/cjs/yoo-card-course.cjs.entry.js CHANGED
@@ -43,8 +43,7 @@ const YooCardCourseComponent = class {
43
43
  return (backgroundImage && (index.h("yoo-img", { type: hasIcons ? 'background' : 'default', disabled: isLocked, class: "image", instant: this.entry.isGridCell, src: backgroundImage }, hasIcons && (index.h("yoo-items", null, isLocked && index.h("yoo-icon", { color: "light", name: "lock", size: iconSize }), isSavedOffline && index.h("yoo-icon", { name: "downloaded", size: iconSize }), isFinished && index.h("yoo-icon", { color: "success", name: "tick", size: iconSize }), isOngoing && index.h("yoo-icon", { color: "info", name: "ongoing", size: iconSize }), isSelfAssigned && !isFinished && !isOngoing && index.h("yoo-icon", { color: "app-color", name: "bookmark", size: iconSize }))))));
44
44
  }
45
45
  renderProgressBar() {
46
- const progress = overlays.getCourseProgress(this.entry);
47
- return index.h("yoo-progress-bar", { class: { 'app-color': !this.profileSummary }, value: progress });
46
+ return index.h("yoo-progress-bar", { class: { 'app-color': !this.profileSummary }, value: overlays.getCourseProgress(this.entry) });
48
47
  }
49
48
  renderCourseTitle(plan) {
50
49
  return [index.h("div", { class: "course-title" }, overlays.translateMulti(plan.title)), plan.description && index.h("div", { class: "course-description" }, overlays.translateMulti(plan.description))];
@@ -76,11 +75,7 @@ const YooCardCourseComponent = class {
76
75
  return [this.renderProgressBar(), this.renderCourseLessonAndPointInfo(dueDate)];
77
76
  }
78
77
  else {
79
- return [
80
- this.renderEarnedCoursePoints(),
81
- this.renderCourseLessonAndPointInfo(dueDate),
82
- this.renderProgressBar()
83
- ];
78
+ return [this.renderEarnedCoursePoints(), this.renderCourseLessonAndPointInfo(dueDate), this.renderProgressBar()];
84
79
  }
85
80
  }
86
81
  renderCourseContainer() {
@@ -90,9 +85,7 @@ const YooCardCourseComponent = class {
90
85
  if (lessonsCount === 0) {
91
86
  lessonsCount = lodash.get(plan, 'lessonsCount', 0);
92
87
  }
93
- return (index.h("div", { class: { 'content-container': true, 'profile-summary': this.profileSummary } }, this.profileSummary
94
- ? [this.renderCourseContent(dueDate), this.renderCourseTitle(plan)]
95
- : [this.renderCourseTitle(plan), this.renderCourseContent(dueDate)]));
88
+ return (index.h("div", { class: { 'content-container': true, 'profile-summary': this.profileSummary } }, this.profileSummary ? [this.renderCourseContent(dueDate), this.renderCourseTitle(plan)] : [this.renderCourseTitle(plan), this.renderCourseContent(dueDate)]));
96
89
  }
97
90
  render() {
98
91
  var _a;
package/dist/cjs/yoo-form-connect.cjs.entry.js CHANGED
@@ -14,7 +14,7 @@ require('./_commonjsHelpers-94df2ea7.js');
14
14
 
15
15
  const CONNECT_TYPES = ['draggable', 'connectable'];
16
16
 
17
- const formConnectCss = ".bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.border-accent{border:var(--border-width-02, 0.125rem) solid var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.border-app-color{border:var(--border-width-02, 0.125rem) solid var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.border-danger{border:var(--border-width-02, 0.125rem) solid var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.border-dark{border:var(--border-width-02, 0.125rem) solid var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.border-energized{border:var(--border-width-02, 0.125rem) solid var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.border-info{border:var(--border-width-02, 0.125rem) solid var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.border-light{border:var(--border-width-02, 0.125rem) solid var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.border-stable{border:var(--border-width-02, 0.125rem) solid var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.border-stable-alt{border:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.border-stable-light{border:var(--border-width-02, 0.125rem) solid var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.border-stable-ultralight{border:var(--border-width-02, 0.125rem) solid var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.border-success{border:var(--border-width-02, 0.125rem) solid var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.border-text-color{border:var(--border-width-02, 0.125rem) solid var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.border-warning{border:var(--border-width-02, 0.125rem) solid var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}.border-wood{border:var(--border-width-02, 0.125rem) solid var(--wood, #99644c)}:host{display:block;width:100%;max-width:30rem;margin:0 auto}:host p{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:var(--spacing-16, 1rem);overflow:hidden;font-size:var(--font-size-14, 0.875rem);text-align:center}:host yoo-banner{height:0}:host yoo-banner p{padding:0}:host yoo-icon{position:absolute;top:var(--spacing-08, 0.5rem);right:var(--spacing-08, 0.5rem);background:var(--light, #ffffff);border-radius:50%}:host yoo-img{border-radius:inherit}:host main,:host #draggables,:host #connectables{display:grid;grid-gap:var(--spacing-08, 0.5rem)}:host #draggables,:host #connectables{height:-webkit-max-content;height:-moz-max-content;height:max-content;padding:var(--spacing-08, 0.5rem) 0}:host main{grid-template-rows:repeat(auto-fit, 75%);grid-template-columns:1fr 1fr;padding:0 var(--spacing-08, 0.5rem);word-break:break-word;background-color:var(--stable-alt-20, rgba(208, 208, 208, 0.2));border-radius:var(--border-radius-04, 0.25rem);-webkit-transition:height 750ms ease-in-out;transition:height 750ms ease-in-out}:host main.overflowing{overflow:hidden auto}:host main.overflowing::-webkit-scrollbar{width:var(--spacing-08, 0.5rem)}:host main.overflowing::-webkit-scrollbar-track{border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:inset 0 0 5px var(--stable, #adadad);box-shadow:inset 0 0 5px var(--stable, #adadad)}:host main.overflowing::-webkit-scrollbar-thumb{background:var(--app-color, #5a30f4);border-radius:var(--border-radius-04, 0.25rem)}:host .connectable,:host .draggable{position:relative;width:100%;max-width:15rem;height:100%;background-color:var(--light, #ffffff);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));cursor:pointer;-webkit-transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out;transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out}:host .connectable:before,:host .draggable:before{display:block;width:0;height:0;padding-bottom:75%;content:\"\"}:host .connectable[type=image],:host .draggable[type=image]{padding:0}:host .connectable[type=image]:not([data-hit]),:host .draggable[type=image]:not([data-hit]){background-color:transparent}:host .connectable[type=image][hit] yoo-img,:host .draggable[type=image][hit] yoo-img{opacity:0.6;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out}:host .connectable[type=text][hit],:host .draggable[type=text][hit]{background-color:var(--stable-light, #f1f1f1)}:host .connectable>*:not(yoo-icon),:host .draggable>*:not(yoo-icon){position:absolute;top:0;left:0;width:100%;height:100%}:host .draggable{z-index:1}:host #overlay{background-color:inherit;border-radius:inherit;opacity:0.6}";
17
+ const formConnectCss = ".bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.border-accent{border:var(--border-width-02, 0.125rem) solid var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.border-app-color{border:var(--border-width-02, 0.125rem) solid var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.border-danger{border:var(--border-width-02, 0.125rem) solid var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.border-dark{border:var(--border-width-02, 0.125rem) solid var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.border-energized{border:var(--border-width-02, 0.125rem) solid var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.border-info{border:var(--border-width-02, 0.125rem) solid var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.border-light{border:var(--border-width-02, 0.125rem) solid var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.border-stable{border:var(--border-width-02, 0.125rem) solid var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.border-stable-alt{border:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.border-stable-light{border:var(--border-width-02, 0.125rem) solid var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.border-stable-ultralight{border:var(--border-width-02, 0.125rem) solid var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.border-success{border:var(--border-width-02, 0.125rem) solid var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.border-text-color{border:var(--border-width-02, 0.125rem) solid var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.border-warning{border:var(--border-width-02, 0.125rem) solid var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}.border-wood{border:var(--border-width-02, 0.125rem) solid var(--wood, #99644c)}:host{display:block;width:100%;max-width:30rem;margin:0 auto}:host p{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:var(--spacing-16, 1rem);overflow:hidden;font-size:var(--font-size-14, 0.875rem);text-align:center}:host yoo-banner{height:0}:host yoo-banner p{padding:0}:host yoo-icon{position:absolute;top:var(--spacing-08, 0.5rem);right:var(--spacing-08, 0.5rem);background:var(--light, #ffffff);border-radius:50%}:host yoo-img{border-radius:inherit}:host main,:host #draggables,:host #connectables{display:grid;grid-gap:var(--spacing-08, 0.5rem)}:host #draggables,:host #connectables{height:-webkit-max-content;height:-moz-max-content;height:max-content;padding:var(--spacing-08, 0.5rem) 0}:host main{grid-template-rows:repeat(auto-fit, 75%);grid-template-columns:1fr 1fr;padding:0 var(--spacing-08, 0.5rem);word-break:break-word;background-color:var(--stable-alt-20, rgba(208, 208, 208, 0.2));border-radius:var(--border-radius-04, 0.25rem);-webkit-transition:height 750ms ease-in-out;transition:height 750ms ease-in-out}:host main.overflowing{overflow:hidden auto}:host main.overflowing::-webkit-scrollbar{width:var(--spacing-08, 0.5rem)}:host main.overflowing::-webkit-scrollbar-track{border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:inset 0 0 5px var(--stable, #adadad);box-shadow:inset 0 0 5px var(--stable, #adadad)}:host main.overflowing::-webkit-scrollbar-thumb{background:var(--app-color, #5a30f4);border-radius:var(--border-radius-04, 0.25rem)}:host .connectable,:host .draggable{position:relative;width:100%;max-width:15rem;height:100%;background-color:var(--light, #ffffff);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));cursor:pointer;-webkit-transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out;transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out}:host .connectable:before,:host .draggable:before{display:block;width:0;height:0;padding-bottom:75%;content:\"\"}:host .connectable[type=image],:host .draggable[type=image]{padding:0}:host .connectable[type=image]:not([data-hit]),:host .draggable[type=image]:not([data-hit]){background-color:transparent}:host .connectable[type=image][hit] yoo-img,:host .draggable[type=image][hit] yoo-img{opacity:0.6;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out}:host .connectable[type=text][hit],:host .draggable[type=text][hit]{background-color:var(--stable-light, #f1f1f1)}:host .connectable>*:not(yoo-icon),:host .draggable>*:not(yoo-icon){position:absolute;top:0;left:0;width:100%;height:100%}:host .draggable{z-index:1}:host .draggable{z-index:1}:host #overlay{background-color:inherit;border-radius:inherit;opacity:0.6}";
18
18
 
19
19
  const YooFormConnectComponent = class {
20
20
  constructor(hostRef) {
package/dist/collection/components/form/form-connect/form-connect.css CHANGED
@@ -511,6 +511,9 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
511
511
  :host .draggable {
512
512
  z-index: 1;
513
513
  }
514
+ :host .draggable {
515
+ z-index: 1;
516
+ }
514
517
  :host #overlay {
515
518
  background-color: inherit;
516
519
  border-radius: inherit;
package/dist/collection/feature-learn/learning/card-course/column/card-course.js CHANGED
@@ -36,8 +36,7 @@ export class YooCardCourseComponent {
36
36
  isSelfAssigned && !isFinished && !isOngoing && h("yoo-icon", { color: "app-color", name: "bookmark", size: iconSize }))))));
37
37
  }
38
38
  renderProgressBar() {
39
- const progress = getCourseProgress(this.entry);
40
- return h("yoo-progress-bar", { class: { 'app-color': !this.profileSummary }, value: progress });
39
+ return h("yoo-progress-bar", { class: { 'app-color': !this.profileSummary }, value: getCourseProgress(this.entry) });
41
40
  }
42
41
  renderCourseTitle(plan) {
43
42
  return [h("div", { class: "course-title" }, translateMulti(plan.title)), plan.description && h("div", { class: "course-description" }, translateMulti(plan.description))];
@@ -84,11 +83,7 @@ export class YooCardCourseComponent {
84
83
  return [this.renderProgressBar(), this.renderCourseLessonAndPointInfo(dueDate)];
85
84
  }
86
85
  else {
87
- return [
88
- this.renderEarnedCoursePoints(),
89
- this.renderCourseLessonAndPointInfo(dueDate),
90
- this.renderProgressBar()
91
- ];
86
+ return [this.renderEarnedCoursePoints(), this.renderCourseLessonAndPointInfo(dueDate), this.renderProgressBar()];
92
87
  }
93
88
  }
94
89
  renderCourseContainer() {
@@ -98,9 +93,7 @@ export class YooCardCourseComponent {
98
93
  if (lessonsCount === 0) {
99
94
  lessonsCount = get(plan, 'lessonsCount', 0);
100
95
  }
101
- return (h("div", { class: { 'content-container': true, 'profile-summary': this.profileSummary } }, this.profileSummary
102
- ? [this.renderCourseContent(dueDate), this.renderCourseTitle(plan)]
103
- : [this.renderCourseTitle(plan), this.renderCourseContent(dueDate)]));
96
+ return (h("div", { class: { 'content-container': true, 'profile-summary': this.profileSummary } }, this.profileSummary ? [this.renderCourseContent(dueDate), this.renderCourseTitle(plan)] : [this.renderCourseTitle(plan), this.renderCourseContent(dueDate)]));
104
97
  }
105
98
  render() {
106
99
  var _a;
package/dist/collection/feature-operate/mission/announcement-heading/announcement-heading.js CHANGED
@@ -69,7 +69,7 @@ export class YooAnnouncementHeadingComponent {
69
69
  var _a, _b;
70
70
  const announcementProgress = getMissionProgress(this.announcement);
71
71
  const renderProgress = ((_b = (_a = this.announcement.todo) === null || _a === void 0 ? void 0 : _a.values) === null || _b === void 0 ? void 0 : _b.length) > 0;
72
- if ((announcementProgress === null || announcementProgress === void 0 ? void 0 : announcementProgress.value) >= 0 && renderProgress) {
72
+ if (!this.isLayoutFeed && (announcementProgress === null || announcementProgress === void 0 ? void 0 : announcementProgress.value) >= 0 && renderProgress) {
73
73
  return h("div", { class: "progress" },
74
74
  h("yoo-progress-bar", { class: "app-color", shape: "circle", hideProgressValue: true, value: announcementProgress.value, metric: announcementProgress.unit, maxValue: announcementProgress.max }),
75
75
  h("yoo-truncate", { class: "app-color", style: { cssText: '--max-lines: 1' } },
package/dist/design-system/yoo-announcement-heading.entry.js CHANGED
@@ -77,7 +77,7 @@ const YooAnnouncementHeadingComponent = class {
77
77
  var _a, _b;
78
78
  const announcementProgress = getMissionProgress(this.announcement);
79
79
  const renderProgress = ((_b = (_a = this.announcement.todo) === null || _a === void 0 ? void 0 : _a.values) === null || _b === void 0 ? void 0 : _b.length) > 0;
80
- if ((announcementProgress === null || announcementProgress === void 0 ? void 0 : announcementProgress.value) >= 0 && renderProgress) {
80
+ if (!this.isLayoutFeed && (announcementProgress === null || announcementProgress === void 0 ? void 0 : announcementProgress.value) >= 0 && renderProgress) {
81
81
  return h("div", { class: "progress" }, h("yoo-progress-bar", { class: "app-color", shape: "circle", hideProgressValue: true, value: announcementProgress.value, metric: announcementProgress.unit, maxValue: announcementProgress.max }), h("yoo-truncate", { class: "app-color", style: { cssText: '--max-lines: 1' } }, h("span", null, translate('ACTIONSCOMPLETED', { smart_count: announcementProgress.value, total: announcementProgress.max }))));
82
82
  }
83
83
  }
package/dist/design-system/yoo-card-course.entry.js CHANGED
@@ -39,8 +39,7 @@ const YooCardCourseComponent = class {
39
39
  return (backgroundImage && (h("yoo-img", { type: hasIcons ? 'background' : 'default', disabled: isLocked, class: "image", instant: this.entry.isGridCell, src: backgroundImage }, hasIcons && (h("yoo-items", null, isLocked && h("yoo-icon", { color: "light", name: "lock", size: iconSize }), isSavedOffline && h("yoo-icon", { name: "downloaded", size: iconSize }), isFinished && h("yoo-icon", { color: "success", name: "tick", size: iconSize }), isOngoing && h("yoo-icon", { color: "info", name: "ongoing", size: iconSize }), isSelfAssigned && !isFinished && !isOngoing && h("yoo-icon", { color: "app-color", name: "bookmark", size: iconSize }))))));
40
40
  }
41
41
  renderProgressBar() {
42
- const progress = getCourseProgress(this.entry);
43
- return h("yoo-progress-bar", { class: { 'app-color': !this.profileSummary }, value: progress });
42
+ return h("yoo-progress-bar", { class: { 'app-color': !this.profileSummary }, value: getCourseProgress(this.entry) });
44
43
  }
45
44
  renderCourseTitle(plan) {
46
45
  return [h("div", { class: "course-title" }, translateMulti(plan.title)), plan.description && h("div", { class: "course-description" }, translateMulti(plan.description))];
@@ -72,11 +71,7 @@ const YooCardCourseComponent = class {
72
71
  return [this.renderProgressBar(), this.renderCourseLessonAndPointInfo(dueDate)];
73
72
  }
74
73
  else {
75
- return [
76
- this.renderEarnedCoursePoints(),
77
- this.renderCourseLessonAndPointInfo(dueDate),
78
- this.renderProgressBar()
79
- ];
74
+ return [this.renderEarnedCoursePoints(), this.renderCourseLessonAndPointInfo(dueDate), this.renderProgressBar()];
80
75
  }
81
76
  }
82
77
  renderCourseContainer() {
@@ -86,9 +81,7 @@ const YooCardCourseComponent = class {
86
81
  if (lessonsCount === 0) {
87
82
  lessonsCount = get(plan, 'lessonsCount', 0);
88
83
  }
89
- return (h("div", { class: { 'content-container': true, 'profile-summary': this.profileSummary } }, this.profileSummary
90
- ? [this.renderCourseContent(dueDate), this.renderCourseTitle(plan)]
91
- : [this.renderCourseTitle(plan), this.renderCourseContent(dueDate)]));
84
+ return (h("div", { class: { 'content-container': true, 'profile-summary': this.profileSummary } }, this.profileSummary ? [this.renderCourseContent(dueDate), this.renderCourseTitle(plan)] : [this.renderCourseTitle(plan), this.renderCourseContent(dueDate)]));
92
85
  }
93
86
  render() {
94
87
  var _a;
package/dist/design-system/yoo-form-connect.entry.js CHANGED
@@ -10,7 +10,7 @@ import './_commonjsHelpers-f4d11124.js';
10
10
 
11
11
  const CONNECT_TYPES = ['draggable', 'connectable'];
12
12
 
13
- const formConnectCss = ".bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.border-accent{border:var(--border-width-02, 0.125rem) solid var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.border-app-color{border:var(--border-width-02, 0.125rem) solid var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.border-danger{border:var(--border-width-02, 0.125rem) solid var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.border-dark{border:var(--border-width-02, 0.125rem) solid var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.border-energized{border:var(--border-width-02, 0.125rem) solid var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.border-info{border:var(--border-width-02, 0.125rem) solid var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.border-light{border:var(--border-width-02, 0.125rem) solid var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.border-stable{border:var(--border-width-02, 0.125rem) solid var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.border-stable-alt{border:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.border-stable-light{border:var(--border-width-02, 0.125rem) solid var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.border-stable-ultralight{border:var(--border-width-02, 0.125rem) solid var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.border-success{border:var(--border-width-02, 0.125rem) solid var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.border-text-color{border:var(--border-width-02, 0.125rem) solid var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.border-warning{border:var(--border-width-02, 0.125rem) solid var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}.border-wood{border:var(--border-width-02, 0.125rem) solid var(--wood, #99644c)}:host{display:block;width:100%;max-width:30rem;margin:0 auto}:host p{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:var(--spacing-16, 1rem);overflow:hidden;font-size:var(--font-size-14, 0.875rem);text-align:center}:host yoo-banner{height:0}:host yoo-banner p{padding:0}:host yoo-icon{position:absolute;top:var(--spacing-08, 0.5rem);right:var(--spacing-08, 0.5rem);background:var(--light, #ffffff);border-radius:50%}:host yoo-img{border-radius:inherit}:host main,:host #draggables,:host #connectables{display:grid;grid-gap:var(--spacing-08, 0.5rem)}:host #draggables,:host #connectables{height:-webkit-max-content;height:-moz-max-content;height:max-content;padding:var(--spacing-08, 0.5rem) 0}:host main{grid-template-rows:repeat(auto-fit, 75%);grid-template-columns:1fr 1fr;padding:0 var(--spacing-08, 0.5rem);word-break:break-word;background-color:var(--stable-alt-20, rgba(208, 208, 208, 0.2));border-radius:var(--border-radius-04, 0.25rem);-webkit-transition:height 750ms ease-in-out;transition:height 750ms ease-in-out}:host main.overflowing{overflow:hidden auto}:host main.overflowing::-webkit-scrollbar{width:var(--spacing-08, 0.5rem)}:host main.overflowing::-webkit-scrollbar-track{border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:inset 0 0 5px var(--stable, #adadad);box-shadow:inset 0 0 5px var(--stable, #adadad)}:host main.overflowing::-webkit-scrollbar-thumb{background:var(--app-color, #5a30f4);border-radius:var(--border-radius-04, 0.25rem)}:host .connectable,:host .draggable{position:relative;width:100%;max-width:15rem;height:100%;background-color:var(--light, #ffffff);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));cursor:pointer;-webkit-transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out;transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out}:host .connectable:before,:host .draggable:before{display:block;width:0;height:0;padding-bottom:75%;content:\"\"}:host .connectable[type=image],:host .draggable[type=image]{padding:0}:host .connectable[type=image]:not([data-hit]),:host .draggable[type=image]:not([data-hit]){background-color:transparent}:host .connectable[type=image][hit] yoo-img,:host .draggable[type=image][hit] yoo-img{opacity:0.6;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out}:host .connectable[type=text][hit],:host .draggable[type=text][hit]{background-color:var(--stable-light, #f1f1f1)}:host .connectable>*:not(yoo-icon),:host .draggable>*:not(yoo-icon){position:absolute;top:0;left:0;width:100%;height:100%}:host .draggable{z-index:1}:host #overlay{background-color:inherit;border-radius:inherit;opacity:0.6}";
13
+ const formConnectCss = ".bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.border-accent{border:var(--border-width-02, 0.125rem) solid var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.border-app-color{border:var(--border-width-02, 0.125rem) solid var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.border-danger{border:var(--border-width-02, 0.125rem) solid var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.border-dark{border:var(--border-width-02, 0.125rem) solid var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.border-energized{border:var(--border-width-02, 0.125rem) solid var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.border-info{border:var(--border-width-02, 0.125rem) solid var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.border-light{border:var(--border-width-02, 0.125rem) solid var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.border-stable{border:var(--border-width-02, 0.125rem) solid var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.border-stable-alt{border:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.border-stable-light{border:var(--border-width-02, 0.125rem) solid var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.border-stable-ultralight{border:var(--border-width-02, 0.125rem) solid var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.border-success{border:var(--border-width-02, 0.125rem) solid var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.border-text-color{border:var(--border-width-02, 0.125rem) solid var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.border-warning{border:var(--border-width-02, 0.125rem) solid var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}.border-wood{border:var(--border-width-02, 0.125rem) solid var(--wood, #99644c)}:host{display:block;width:100%;max-width:30rem;margin:0 auto}:host p{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:var(--spacing-16, 1rem);overflow:hidden;font-size:var(--font-size-14, 0.875rem);text-align:center}:host yoo-banner{height:0}:host yoo-banner p{padding:0}:host yoo-icon{position:absolute;top:var(--spacing-08, 0.5rem);right:var(--spacing-08, 0.5rem);background:var(--light, #ffffff);border-radius:50%}:host yoo-img{border-radius:inherit}:host main,:host #draggables,:host #connectables{display:grid;grid-gap:var(--spacing-08, 0.5rem)}:host #draggables,:host #connectables{height:-webkit-max-content;height:-moz-max-content;height:max-content;padding:var(--spacing-08, 0.5rem) 0}:host main{grid-template-rows:repeat(auto-fit, 75%);grid-template-columns:1fr 1fr;padding:0 var(--spacing-08, 0.5rem);word-break:break-word;background-color:var(--stable-alt-20, rgba(208, 208, 208, 0.2));border-radius:var(--border-radius-04, 0.25rem);-webkit-transition:height 750ms ease-in-out;transition:height 750ms ease-in-out}:host main.overflowing{overflow:hidden auto}:host main.overflowing::-webkit-scrollbar{width:var(--spacing-08, 0.5rem)}:host main.overflowing::-webkit-scrollbar-track{border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:inset 0 0 5px var(--stable, #adadad);box-shadow:inset 0 0 5px var(--stable, #adadad)}:host main.overflowing::-webkit-scrollbar-thumb{background:var(--app-color, #5a30f4);border-radius:var(--border-radius-04, 0.25rem)}:host .connectable,:host .draggable{position:relative;width:100%;max-width:15rem;height:100%;background-color:var(--light, #ffffff);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));cursor:pointer;-webkit-transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out;transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out}:host .connectable:before,:host .draggable:before{display:block;width:0;height:0;padding-bottom:75%;content:\"\"}:host .connectable[type=image],:host .draggable[type=image]{padding:0}:host .connectable[type=image]:not([data-hit]),:host .draggable[type=image]:not([data-hit]){background-color:transparent}:host .connectable[type=image][hit] yoo-img,:host .draggable[type=image][hit] yoo-img{opacity:0.6;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out}:host .connectable[type=text][hit],:host .draggable[type=text][hit]{background-color:var(--stable-light, #f1f1f1)}:host .connectable>*:not(yoo-icon),:host .draggable>*:not(yoo-icon){position:absolute;top:0;left:0;width:100%;height:100%}:host .draggable{z-index:1}:host .draggable{z-index:1}:host #overlay{background-color:inherit;border-radius:inherit;opacity:0.6}";
14
14
 
15
15
  const YooFormConnectComponent = class {
16
16
  constructor(hostRef) {
package/dist/esm/yoo-announcement-heading.entry.js CHANGED
@@ -77,7 +77,7 @@ const YooAnnouncementHeadingComponent = class {
77
77
  var _a, _b;
78
78
  const announcementProgress = getMissionProgress(this.announcement);
79
79
  const renderProgress = ((_b = (_a = this.announcement.todo) === null || _a === void 0 ? void 0 : _a.values) === null || _b === void 0 ? void 0 : _b.length) > 0;
80
- if ((announcementProgress === null || announcementProgress === void 0 ? void 0 : announcementProgress.value) >= 0 && renderProgress) {
80
+ if (!this.isLayoutFeed && (announcementProgress === null || announcementProgress === void 0 ? void 0 : announcementProgress.value) >= 0 && renderProgress) {
81
81
  return h("div", { class: "progress" }, h("yoo-progress-bar", { class: "app-color", shape: "circle", hideProgressValue: true, value: announcementProgress.value, metric: announcementProgress.unit, maxValue: announcementProgress.max }), h("yoo-truncate", { class: "app-color", style: { cssText: '--max-lines: 1' } }, h("span", null, translate('ACTIONSCOMPLETED', { smart_count: announcementProgress.value, total: announcementProgress.max }))));
82
82
  }
83
83
  }
package/dist/esm/yoo-card-course.entry.js CHANGED
@@ -39,8 +39,7 @@ const YooCardCourseComponent = class {
39
39
  return (backgroundImage && (h("yoo-img", { type: hasIcons ? 'background' : 'default', disabled: isLocked, class: "image", instant: this.entry.isGridCell, src: backgroundImage }, hasIcons && (h("yoo-items", null, isLocked && h("yoo-icon", { color: "light", name: "lock", size: iconSize }), isSavedOffline && h("yoo-icon", { name: "downloaded", size: iconSize }), isFinished && h("yoo-icon", { color: "success", name: "tick", size: iconSize }), isOngoing && h("yoo-icon", { color: "info", name: "ongoing", size: iconSize }), isSelfAssigned && !isFinished && !isOngoing && h("yoo-icon", { color: "app-color", name: "bookmark", size: iconSize }))))));
40
40
  }
41
41
  renderProgressBar() {
42
- const progress = getCourseProgress(this.entry);
43
- return h("yoo-progress-bar", { class: { 'app-color': !this.profileSummary }, value: progress });
42
+ return h("yoo-progress-bar", { class: { 'app-color': !this.profileSummary }, value: getCourseProgress(this.entry) });
44
43
  }
45
44
  renderCourseTitle(plan) {
46
45
  return [h("div", { class: "course-title" }, translateMulti(plan.title)), plan.description && h("div", { class: "course-description" }, translateMulti(plan.description))];
@@ -72,11 +71,7 @@ const YooCardCourseComponent = class {
72
71
  return [this.renderProgressBar(), this.renderCourseLessonAndPointInfo(dueDate)];
73
72
  }
74
73
  else {
75
- return [
76
- this.renderEarnedCoursePoints(),
77
- this.renderCourseLessonAndPointInfo(dueDate),
78
- this.renderProgressBar()
79
- ];
74
+ return [this.renderEarnedCoursePoints(), this.renderCourseLessonAndPointInfo(dueDate), this.renderProgressBar()];
80
75
  }
81
76
  }
82
77
  renderCourseContainer() {
@@ -86,9 +81,7 @@ const YooCardCourseComponent = class {
86
81
  if (lessonsCount === 0) {
87
82
  lessonsCount = get(plan, 'lessonsCount', 0);
88
83
  }
89
- return (h("div", { class: { 'content-container': true, 'profile-summary': this.profileSummary } }, this.profileSummary
90
- ? [this.renderCourseContent(dueDate), this.renderCourseTitle(plan)]
91
- : [this.renderCourseTitle(plan), this.renderCourseContent(dueDate)]));
84
+ return (h("div", { class: { 'content-container': true, 'profile-summary': this.profileSummary } }, this.profileSummary ? [this.renderCourseContent(dueDate), this.renderCourseTitle(plan)] : [this.renderCourseTitle(plan), this.renderCourseContent(dueDate)]));
92
85
  }
93
86
  render() {
94
87
  var _a;
package/dist/esm/yoo-form-connect.entry.js CHANGED
@@ -10,7 +10,7 @@ import './_commonjsHelpers-f4d11124.js';
10
10
 
11
11
  const CONNECT_TYPES = ['draggable', 'connectable'];
12
12
 
13
- const formConnectCss = ".bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.border-accent{border:var(--border-width-02, 0.125rem) solid var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.border-app-color{border:var(--border-width-02, 0.125rem) solid var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.border-danger{border:var(--border-width-02, 0.125rem) solid var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.border-dark{border:var(--border-width-02, 0.125rem) solid var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.border-energized{border:var(--border-width-02, 0.125rem) solid var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.border-info{border:var(--border-width-02, 0.125rem) solid var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.border-light{border:var(--border-width-02, 0.125rem) solid var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.border-stable{border:var(--border-width-02, 0.125rem) solid var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.border-stable-alt{border:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.border-stable-light{border:var(--border-width-02, 0.125rem) solid var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.border-stable-ultralight{border:var(--border-width-02, 0.125rem) solid var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.border-success{border:var(--border-width-02, 0.125rem) solid var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.border-text-color{border:var(--border-width-02, 0.125rem) solid var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.border-warning{border:var(--border-width-02, 0.125rem) solid var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}.border-wood{border:var(--border-width-02, 0.125rem) solid var(--wood, #99644c)}:host{display:block;width:100%;max-width:30rem;margin:0 auto}:host p{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:var(--spacing-16, 1rem);overflow:hidden;font-size:var(--font-size-14, 0.875rem);text-align:center}:host yoo-banner{height:0}:host yoo-banner p{padding:0}:host yoo-icon{position:absolute;top:var(--spacing-08, 0.5rem);right:var(--spacing-08, 0.5rem);background:var(--light, #ffffff);border-radius:50%}:host yoo-img{border-radius:inherit}:host main,:host #draggables,:host #connectables{display:grid;grid-gap:var(--spacing-08, 0.5rem)}:host #draggables,:host #connectables{height:-webkit-max-content;height:-moz-max-content;height:max-content;padding:var(--spacing-08, 0.5rem) 0}:host main{grid-template-rows:repeat(auto-fit, 75%);grid-template-columns:1fr 1fr;padding:0 var(--spacing-08, 0.5rem);word-break:break-word;background-color:var(--stable-alt-20, rgba(208, 208, 208, 0.2));border-radius:var(--border-radius-04, 0.25rem);-webkit-transition:height 750ms ease-in-out;transition:height 750ms ease-in-out}:host main.overflowing{overflow:hidden auto}:host main.overflowing::-webkit-scrollbar{width:var(--spacing-08, 0.5rem)}:host main.overflowing::-webkit-scrollbar-track{border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:inset 0 0 5px var(--stable, #adadad);box-shadow:inset 0 0 5px var(--stable, #adadad)}:host main.overflowing::-webkit-scrollbar-thumb{background:var(--app-color, #5a30f4);border-radius:var(--border-radius-04, 0.25rem)}:host .connectable,:host .draggable{position:relative;width:100%;max-width:15rem;height:100%;background-color:var(--light, #ffffff);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));cursor:pointer;-webkit-transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out;transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out}:host .connectable:before,:host .draggable:before{display:block;width:0;height:0;padding-bottom:75%;content:\"\"}:host .connectable[type=image],:host .draggable[type=image]{padding:0}:host .connectable[type=image]:not([data-hit]),:host .draggable[type=image]:not([data-hit]){background-color:transparent}:host .connectable[type=image][hit] yoo-img,:host .draggable[type=image][hit] yoo-img{opacity:0.6;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out}:host .connectable[type=text][hit],:host .draggable[type=text][hit]{background-color:var(--stable-light, #f1f1f1)}:host .connectable>*:not(yoo-icon),:host .draggable>*:not(yoo-icon){position:absolute;top:0;left:0;width:100%;height:100%}:host .draggable{z-index:1}:host #overlay{background-color:inherit;border-radius:inherit;opacity:0.6}";
13
+ const formConnectCss = ".bg-accent{background-color:var(--accent, #276ef1) !important}.accent{color:var(--accent, #276ef1);fill:var(--accent, #276ef1)}.border-accent{border:var(--border-width-02, 0.125rem) solid var(--accent, #276ef1)}.bg-app-color{background-color:var(--app-color, #5a30f4) !important}.app-color{color:var(--app-color, #5a30f4);fill:var(--app-color, #5a30f4)}.border-app-color{border:var(--border-width-02, 0.125rem) solid var(--app-color, #5a30f4)}.bg-danger{background-color:var(--danger, #d44333) !important}.danger{color:var(--danger, #d44333);fill:var(--danger, #d44333)}.border-danger{border:var(--border-width-02, 0.125rem) solid var(--danger, #d44333)}.bg-dark{background-color:var(--dark, #000000) !important}.dark{color:var(--dark, #000000);fill:var(--dark, #000000)}.border-dark{border:var(--border-width-02, 0.125rem) solid var(--dark, #000000)}.bg-energized{background-color:var(--energized, #ffc043) !important}.energized{color:var(--energized, #ffc043);fill:var(--energized, #ffc043)}.border-energized{border:var(--border-width-02, 0.125rem) solid var(--energized, #ffc043)}.bg-info{background-color:var(--info, #d84c96) !important}.info{color:var(--info, #d84c96);fill:var(--info, #d84c96)}.border-info{border:var(--border-width-02, 0.125rem) solid var(--info, #d84c96)}.bg-light{background-color:var(--light, #ffffff) !important}.light{color:var(--light, #ffffff);fill:var(--light, #ffffff)}.border-light{border:var(--border-width-02, 0.125rem) solid var(--light, #ffffff)}.bg-stable{background-color:var(--stable, #adadad) !important}.stable{color:var(--stable, #adadad);fill:var(--stable, #adadad)}.border-stable{border:var(--border-width-02, 0.125rem) solid var(--stable, #adadad)}.bg-stable-alt{background-color:var(--stable-alt, #d0d0d0) !important}.stable-alt{color:var(--stable-alt, #d0d0d0);fill:var(--stable-alt, #d0d0d0)}.border-stable-alt{border:var(--border-width-02, 0.125rem) solid var(--stable-alt, #d0d0d0)}.bg-stable-light{background-color:var(--stable-light, #f1f1f1) !important}.stable-light{color:var(--stable-light, #f1f1f1);fill:var(--stable-light, #f1f1f1)}.border-stable-light{border:var(--border-width-02, 0.125rem) solid var(--stable-light, #f1f1f1)}.bg-stable-ultralight{background-color:var(--stable-ultralight, #fafafa) !important}.stable-ultralight{color:var(--stable-ultralight, #fafafa);fill:var(--stable-ultralight, #fafafa)}.border-stable-ultralight{border:var(--border-width-02, 0.125rem) solid var(--stable-ultralight, #fafafa)}.bg-success{background-color:var(--success, #3aa76d) !important}.success{color:var(--success, #3aa76d);fill:var(--success, #3aa76d)}.border-success{border:var(--border-width-02, 0.125rem) solid var(--success, #3aa76d)}.bg-text-color{background-color:var(--text-color, #807f83) !important}.text-color{color:var(--text-color, #807f83);fill:var(--text-color, #807f83)}.border-text-color{border:var(--border-width-02, 0.125rem) solid var(--text-color, #807f83)}.bg-warning{background-color:var(--warning, #ed6e33) !important}.warning{color:var(--warning, #ed6e33);fill:var(--warning, #ed6e33)}.border-warning{border:var(--border-width-02, 0.125rem) solid var(--warning, #ed6e33)}.bg-wood{background-color:var(--wood, #99644c) !important}.wood{color:var(--wood, #99644c);fill:var(--wood, #99644c)}.border-wood{border:var(--border-width-02, 0.125rem) solid var(--wood, #99644c)}:host{display:block;width:100%;max-width:30rem;margin:0 auto}:host p{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:var(--spacing-16, 1rem);overflow:hidden;font-size:var(--font-size-14, 0.875rem);text-align:center}:host yoo-banner{height:0}:host yoo-banner p{padding:0}:host yoo-icon{position:absolute;top:var(--spacing-08, 0.5rem);right:var(--spacing-08, 0.5rem);background:var(--light, #ffffff);border-radius:50%}:host yoo-img{border-radius:inherit}:host main,:host #draggables,:host #connectables{display:grid;grid-gap:var(--spacing-08, 0.5rem)}:host #draggables,:host #connectables{height:-webkit-max-content;height:-moz-max-content;height:max-content;padding:var(--spacing-08, 0.5rem) 0}:host main{grid-template-rows:repeat(auto-fit, 75%);grid-template-columns:1fr 1fr;padding:0 var(--spacing-08, 0.5rem);word-break:break-word;background-color:var(--stable-alt-20, rgba(208, 208, 208, 0.2));border-radius:var(--border-radius-04, 0.25rem);-webkit-transition:height 750ms ease-in-out;transition:height 750ms ease-in-out}:host main.overflowing{overflow:hidden auto}:host main.overflowing::-webkit-scrollbar{width:var(--spacing-08, 0.5rem)}:host main.overflowing::-webkit-scrollbar-track{border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:inset 0 0 5px var(--stable, #adadad);box-shadow:inset 0 0 5px var(--stable, #adadad)}:host main.overflowing::-webkit-scrollbar-thumb{background:var(--app-color, #5a30f4);border-radius:var(--border-radius-04, 0.25rem)}:host .connectable,:host .draggable{position:relative;width:100%;max-width:15rem;height:100%;background-color:var(--light, #ffffff);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));cursor:pointer;-webkit-transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out;transition:background-color 0.25s ease-in-out, color 0.25s ease-in-out}:host .connectable:before,:host .draggable:before{display:block;width:0;height:0;padding-bottom:75%;content:\"\"}:host .connectable[type=image],:host .draggable[type=image]{padding:0}:host .connectable[type=image]:not([data-hit]),:host .draggable[type=image]:not([data-hit]){background-color:transparent}:host .connectable[type=image][hit] yoo-img,:host .draggable[type=image][hit] yoo-img{opacity:0.6;-webkit-transition:opacity 0.25s ease-in-out;transition:opacity 0.25s ease-in-out}:host .connectable[type=text][hit],:host .draggable[type=text][hit]{background-color:var(--stable-light, #f1f1f1)}:host .connectable>*:not(yoo-icon),:host .draggable>*:not(yoo-icon){position:absolute;top:0;left:0;width:100%;height:100%}:host .draggable{z-index:1}:host .draggable{z-index:1}:host #overlay{background-color:inherit;border-radius:inherit;opacity:0.6}";
14
14
 
15
15
  const YooFormConnectComponent = class {
16
16
  constructor(hostRef) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yoobic/yobi",
3
- "version": "8.3.2",
3
+ "version": "8.3.4",
4
4
  "description": "Yobi - Yoobic Design System",
5
5
  "module": "dist/index.js",
6
6
  "main": "dist/index.cjs.js",