@yoobic/yobi 8.5.3-0 → 8.5.4

package/dist/esm/yoo-form-carousel.entry.js

@@ -30,6 +30,7 @@ const YooFormCarouselComponent = class {
     this.allowOrientation = false;
     this.instant = false;
     this.displayPhotoCounter = true;
+    this.navbarVisiblity = 'visible';
     this.currentActiveIndex = 0;
     this.showPhotoCounts = this.displayPhotoCounter;
     this.visibility = false;
@@ -255,7 +256,7 @@ const YooFormCarouselComponent = class {
     var _a, _b;
     const toggleNavbarVisibility = (show) => this.photoEditorElements[index].navbarVisiblity = show ? 'visible' : 'hidden';
     if (this.previewMode || this.usePhotoEditor) {
-      return (h("yoo-photo-editor", { ref: (el) => (this.photoEditorElements[index] = el), src: src, isReadonly: true, zoomable: this.previewMode, annotations: ((_a = this.annotations) === null || _a === void 0 ? void 0 : _a.length) && this.annotations[index], drawings: ((_b = this.drawings) === null || _b === void 0 ? void 0 : _b.length) && this.drawings[index], extraActions: this.topBarActions, onImageClicked: () => {
+      return (h("yoo-photo-editor", { ref: (el) => (this.photoEditorElements[index] = el), src: src, isReadonly: true, zoomable: this.previewMode, annotations: ((_a = this.annotations) === null || _a === void 0 ? void 0 : _a.length) && this.annotations[index], drawings: ((_b = this.drawings) === null || _b === void 0 ? void 0 : _b.length) && this.drawings[index], extraActions: this.topBarActions, navbarVisiblity: this.navbarVisiblity, onImageClicked: () => {
           this.isPhotoClicked = !this.isPhotoClicked;
           this.showDetail.emit(index);
           this.photoEditorClicked.emit(this.isPhotoClicked);

package/dist/esm/yoo-input-bar.entry.js

@@ -16,7 +16,7 @@ function race(...args) {
 }
 
 /**
- * @license Angular v14.2.6
+ * @license Angular v14.2.7
  * (c) 2010-2022 Google LLC. https://angular.io/
  * License: MIT
  */
@@ -7248,7 +7248,7 @@ class Version {
 /**
  * @publicApi
  */
-const VERSION = new Version('14.2.6');
+const VERSION = new Version('14.2.7');
 
 /**
  * @license

package/dist/esm/yoo-kpi.entry.js

@@ -5,7 +5,7 @@ import './index-4bbbf966.js';
 import './_commonjsHelpers-f4d11124.js';
 import './lodash-777f91de.js';
 
-const kpiCss = "svg:not(:root){overflow:hidden}:host{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;min-height:0}:host .photo-container{position:relative;width:100%;height:100%}:host .empty-state{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-direction:column;flex-direction:column;height:100%}:host .empty-state yoo-empty-state{height:6.25rem}:host .empty-state div{color:var(--text-color-80, rgba(128, 127, 131, 0.8));font-size:var(--font-size-16, 1rem)}";
+const kpiCss = "svg:not(:root){overflow:hidden}:host{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;min-height:0}:host .photo-container{position:relative;width:100%;height:100%}:host .photo-container yoo-form-carousel{display:block;-ms-flex:1;flex:1;height:100%;overflow:hidden}:host .empty-state{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-direction:column;flex-direction:column;height:100%}:host .empty-state yoo-empty-state{height:6.25rem}:host .empty-state div{color:var(--text-color-80, rgba(128, 127, 131, 0.8));font-size:var(--font-size-16, 1rem)}";
 
 const YooKpiComponent = class {
   constructor(hostRef) {
@@ -107,7 +107,7 @@ const YooKpiComponent = class {
       case 'calendar':
         return null;
       case 'carousel':
-        return this.photosSrc ? (h("div", { class: "photo-container" }, h("yoo-form-carousel", { ref: (el) => (this.carousel = el), usePhotoEditor: true, mediaSrc: this.photosSrc.map((src) => src === null || src === void 0 ? void 0 : src.value), annotations: this.photosSrc.map((src) => src === null || src === void 0 ? void 0 : src.annotations), drawings: this.photosSrc.map((src) => src === null || src === void 0 ? void 0 : src.drawings), class: { light: true, 'form-preview': this.isFormPreview } }))) : (h("div", { class: "empty-state" }, h("yoo-empty-state", { type: "photo" }), h("div", null, translate('LISTEMPTY'))));
+        return this.photosSrc ? (h("div", { class: "photo-container" }, h("yoo-form-carousel", { ref: (el) => (this.carousel = el), usePhotoEditor: true, navbarVisiblity: "hidden", mediaSrc: this.photosSrc.map((src) => src === null || src === void 0 ? void 0 : src.value), annotations: this.photosSrc.map((src) => src === null || src === void 0 ? void 0 : src.annotations), drawings: this.photosSrc.map((src) => src === null || src === void 0 ? void 0 : src.drawings), class: { light: true, 'form-preview': this.isFormPreview } }))) : (h("div", { class: "empty-state" }, h("yoo-empty-state", { type: "photo" }), h("div", null, translate('LISTEMPTY'))));
       case 'grid':
         return (h("yoo-pivot-table", { ref: (el) => (this.pivotTable = el), onEdited: (ev) => this.onEdited(ev), onRowClick: (ev) => this.onChartClick(ev), onRowDoubleClick: (ev) => this.onChartDoubleClick(ev), config: this.config, definition: this.definition, isFullScreen: this.isFullScreen, gridClass: "grid-alternate no-border", class: {
             'rounded': (_b = (_a = this.host) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains('rounded')

package/dist/esm/yoo-photo-editor.entry.js

@@ -341,7 +341,7 @@ const YooPhotoEditorComponent = class {
   }
   get isTextEditMode() {
     var _a;
-    return !!(this.mode === 'text' && ((_a = this.activeAnnotation) === null || _a === void 0 ? void 0 : _a.type) == 'text');
+    return !!(this.mode === 'text' && ((_a = this.activeAnnotation) === null || _a === void 0 ? void 0 : _a.type) === 'text');
   }
   get isDrawMode() {
     return !!(this.mode === 'draw' && !this.isReadonly);

package/dist/esm/yoo-progress-bar.entry.js

@@ -16,7 +16,7 @@ const DEFAULT_SHAPES = {
   'semi-circle': 'M 0, y a r,r 0 1,1 d,0'
 };
 
-const progressBarCss = "svg:not(:root){overflow:hidden}:host{position:relative;display:block;--svg-width:100%;--svg-fill:var(--transparent, transparent);--stroke-width-line:3;--stroke-width-circle:3;--progress-value-font-size:var(--font-size-16, 1rem);--progress-value-font-weight:var(--font-weight-400, 400);--progress-value-color:var(--dark, #000000);--progress-bar-color:unset;--progress-bar-display:block;--trail-bar-color:var(--stable-light, #f1f1f1);--trail-bar-display:block}:host svg{width:var(--svg-width)}:host svg #trail{stroke-linecap:round;display:var(--trail-bar-display);stroke:var(--trail-bar-color)}:host svg #progress{display:var(--progress-bar-display);stroke:var(--progress-bar-color)}:host svg #progress:not([x2=\"0%\"]){stroke-linecap:round}:host #value{color:var(--progress-value-color);font-weight:var(--progress-value-font-weight);font-size:var(--progress-value-font-size);fill:var(--progress-value-color)}:host([shape=line]){display:inline-grid;grid-gap:var(--spacing-08, 0.5rem);grid-template-columns:1fr auto;place-items:center;width:100%}:host([shape=line]) svg{overflow:unset}:host([shape=line]) svg:not(.has-markers){height:var(--spacing-04, 0.25rem)}:host([shape=line]) svg:not(.has-markers) line{stroke-width:var(--stroke-width-line)}:host([shape=line]) svg .marker{font-size:var(--font-size-12, 0.75rem);-webkit-transform:translate(calc(var(--spacing-16, 1rem) * -1), calc(var(--spacing-16, 1rem) * 1.5));transform:translate(calc(var(--spacing-16, 1rem) * -1), calc(var(--spacing-16, 1rem) * 1.5))}:host([shape=line]) span{width:100%;text-align:center}:host([shape=line][x=right]) span{text-align:right}:host([shape=line][x=left]) span{text-align:left}:host([shape=line][y=bottom]),:host([shape=line][y=top]),:host([shape=line].no-value){grid-template-columns:initial;line-height:1}:host([shape=line][y=top]) svg{-ms-flex-order:1;order:1}:host([shape=line][y=top]) span{-ms-flex-order:0;order:0}:host([shape=circle]),:host([shape=semi-circle]){--progress-value-tsx:-50%;--progress-value-tsy:-50%;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;margin:0 auto}:host([shape=circle]) svg,:host([shape=semi-circle]) svg{overflow:initial;fill:var(--svg-fill)}:host([shape=circle]) svg path,:host([shape=semi-circle]) svg path{stroke-width:var(--stroke-width-circle)}:host([shape=circle]) #value,:host([shape=semi-circle]) #value{position:absolute;top:50%;left:50%;display:-ms-flexbox;display:flex;-ms-flex-align:baseline;align-items:baseline;-webkit-transform:translate(var(--progress-value-tsx), var(--progress-value-tsy));transform:translate(var(--progress-value-tsx), var(--progress-value-tsy))}:host([shape=semi-circle]){--progress-value-tsy:calc(-50% + var(--spacing-08, 0.5rem))}:host([metric=points]){--progress-bar-display:none;--trail-bar-display:none}:host([metric=step]){--progress-bar-color:var(--app-color, #5a30f4)}:host([shape=line].rtl){direction:ltr}:host([shape=line].rtl) svg{-webkit-transform:scaleX(-1);transform:scaleX(-1)}";
+const progressBarCss = "svg:not(:root){overflow:hidden}:host{position:relative;display:block;--svg-width:100%;--svg-fill:var(--transparent, transparent);--stroke-width-line:3;--stroke-width-circle:3;--progress-value-font-size:var(--font-size-16, 1rem);--progress-value-font-weight:var(--font-weight-400, 400);--progress-value-color:var(--dark, #000000);--progress-bar-color:unset;--progress-bar-display:block;--trail-bar-color:var(--stable-light, #f1f1f1);--trail-bar-display:block}:host svg{width:var(--svg-width)}:host svg #trail{stroke-linecap:round;display:var(--trail-bar-display);stroke:var(--trail-bar-color)}:host svg #progress{display:var(--progress-bar-display);stroke:var(--progress-bar-color)}:host svg #progress:not([x2=\"0%\"]){stroke-linecap:round}:host #value{color:var(--progress-value-color);font-weight:var(--progress-value-font-weight);font-size:var(--progress-value-font-size);fill:var(--progress-value-color)}:host([shape=line]){display:inline-grid;grid-gap:var(--spacing-08, 0.5rem);grid-template-columns:1fr auto;place-items:center;width:100%}:host([shape=line]) svg{overflow:unset}:host([shape=line]) svg:not(.has-markers){height:var(--spacing-04, 0.25rem)}:host([shape=line]) svg:not(.has-markers) line{stroke-width:var(--stroke-width-line)}:host([shape=line]) svg .marker{font-size:var(--font-size-12, 0.75rem);-webkit-transform:translate(calc(var(--spacing-16, 1rem) * -1), calc(var(--spacing-16, 1rem) * 1.5));transform:translate(calc(var(--spacing-16, 1rem) * -1), calc(var(--spacing-16, 1rem) * 1.5))}:host([shape=line]) span{width:100%;text-align:center}:host([shape=line][x=right]) span{text-align:right}:host([shape=line][x=left]) span{text-align:left}:host([shape=line][y=bottom]),:host([shape=line][y=top]),:host([shape=line].no-value){grid-template-columns:initial;line-height:1}:host([shape=line][y=top]) svg{-ms-flex-order:1;order:1}:host([shape=line][y=top]) span{-ms-flex-order:0;order:0}:host([shape=circle]),:host([shape=semi-circle]){--progress-value-tsx:-50%;--progress-value-tsy:-50%;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;margin:0 auto}:host([shape=circle]) svg,:host([shape=semi-circle]) svg{overflow:initial;fill:var(--svg-fill)}:host([shape=circle]) svg path,:host([shape=semi-circle]) svg path{stroke-width:var(--stroke-width-circle)}:host([shape=circle]) #value,:host([shape=semi-circle]) #value{position:absolute;top:50%;left:50%;display:-ms-flexbox;display:flex;-ms-flex-align:baseline;align-items:baseline;-webkit-transform:translate(var(--progress-value-tsx), var(--progress-value-tsy));transform:translate(var(--progress-value-tsx), var(--progress-value-tsy))}:host([shape=semi-circle]){--progress-value-tsy:calc(-50% + var(--spacing-08, 0.5rem))}:host([metric=points]:not([max-value])){--progress-bar-display:none;--trail-bar-display:none}:host([metric=step]){--progress-bar-color:var(--app-color, #5a30f4)}:host([shape=line].rtl){direction:ltr}:host([shape=line].rtl) svg{-webkit-transform:scaleX(-1);transform:scaleX(-1)}";
 
 const YooProgressBarComponent = class {
   constructor(hostRef) {
@@ -195,7 +195,7 @@ const YooProgressBarComponent = class {
   }
   getProgress(progress = this.value) {
     const currentProgress = progress || 0;
-    const withMaxValue = !!(isFinite(this.maxValue) && this.maxValue) && !this.isMetric.points;
+    const withMaxValue = !!(isFinite(this.maxValue) && this.maxValue);
     const newProgress = withMaxValue ? (currentProgress / this.maxValue) * 100 : currentProgress;
     return this.truncateProgress(newProgress) || 0;
   }

package/dist/types/components/form/form-carousel/form-carousel.d.ts

@@ -29,6 +29,7 @@ export declare class YooFormCarouselComponent implements IFormCarousel {
   paginationType?: 'bullets' | 'fraction' | 'progressbar' | 'custom';
   displayPhotoCounter?: boolean;
   hideSecondaryActions?: boolean;
+  navbarVisiblity?: 'hidden' | 'visible' | 'disabled';
   photoEditorClicked: EventEmitter<boolean>;
   showDetail: EventEmitter<number>;
   slideChanges: EventEmitter<number>;

package/dist/types/components.d.ts

@@ -2072,6 +2072,7 @@ export namespace Components {
         "mediaDimension"?: IMediaDimension[];
         "mediaSrc": (string | IFileInterface)[];
         "mediaType": 'photo' | 'video' | 'audio' | 'document';
+        "navbarVisiblity"?: 'hidden' | 'visible' | 'disabled';
         "paginationType"?: 'bullets' | 'fraction' | 'progressbar' | 'custom';
         "playerCommand"?: string;
         "preventAutoPlayMedia"?: boolean;
@@ -12915,6 +12916,7 @@ declare namespace LocalJSX {
         "mediaDimension"?: IMediaDimension[];
         "mediaSrc"?: (string | IFileInterface)[];
         "mediaType"?: 'photo' | 'video' | 'audio' | 'document';
+        "navbarVisiblity"?: 'hidden' | 'visible' | 'disabled';
         "onEnteringViewPort"?: (event: YooFormCarouselCustomEvent<boolean>) => void;
         "onImageZoomed"?: (event: YooFormCarouselCustomEvent<boolean>) => void;
         "onPhotoEditorClicked"?: (event: YooFormCarouselCustomEvent<boolean>) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yoobic/yobi",
-  "version": "8.5.3-0",
+  "version": "8.5.4",
   "description": "Yobi - Yoobic Design System",
   "module": "dist/index.js",
   "main": "dist/index.cjs.js",