@provoly/dashboard 0.15.7 → 0.15.9

package/esm2022/widgets/widget-chart/component/widget-chart.component.mjs

@@ -640,7 +640,7 @@ export class WidgetChartComponent extends DataWidgetComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: WidgetChartComponent, deps: [{ token: i1.Store }, { token: i2.PryI18nService }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: WidgetChartComponent, selector: "pry-widget-chart", viewQueries: [{ propertyName: "vega", first: true, predicate: ["vega"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-widget-chart-css></pry-widget-chart-css>\n<div class=\"o-widget o-widget--chart\">\n  <pry-widget-header\n    [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n    *ngIf=\"displayHeader$ | async\"\n    [widgetIndex]=\"widgetIndex\"\n    [manifest]=\"manifest\"\n    (manifestModified)=\"manifestModified.emit($event)\"\n    #header\n    [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n  >\n    <pry-settings\n      (saveTriggered)=\"emitManifest()\"\n      (changeTitle)=\"changeWidgetTitle($event)\"\n      [headerPresent]=\"displayHeader$ | async\"\n      [isDisable]=\"(filterDataForOptionsCopy$ | async)?.length === 0 || hasNoType(optionsCopy)\"\n      [widgetIndex]=\"widgetIndex\"\n      [open$]=\"open$\"\n      [header]=\"header\"\n      class=\"o-settings\"\n    >\n      <div class=\"o-settings__popup__content__fields -condensed\">\n        <pry-edit-input\n          label=\"@pry.widget.chart.title\"\n          (ngModelChange)=\"changeChartTitle($event)\"\n          [ngModel]=\"optionsCopy.customTitle ?? optionsCopy.title\"\n        ></pry-edit-input>\n\n        <div class=\"m-form-label-field\">\n          <ng-container *ngIf=\"(filterDataForOptionsCopy$ | async)?.length === 0; else data\">\n            <p class=\"a-label a-label--help -error\">{{ '@pry.widget.chart.params.noParams' | i18n }}</p>\n          </ng-container>\n          <ng-template #data>\n            <div *ngIf=\"optionsCopy?.type !== MarkType.RADAR\">\n              {{ '@pry.widget.chart.params.multipleParams' | i18n }}{{ (filterDataForOptionsCopy$ | async)?.length }}\n            </div>\n          </ng-template>\n        </div>\n\n        <div *ngIf=\"optionsCopy\" class=\"m-form-label-field\">\n          <label class=\"a-label\" for=\"chart_type\">{{ '@pry.widget.chart.type' | i18n }}</label>\n          <pry-select\n            (ngModelChange)=\"changeType($event)\"\n            [itemsAsOption]=\"true\"\n            [items]=\"typeOptions\"\n            [labelTranslate]=\"true\"\n            [ngModel]=\"optionsCopy.type + '-' + optionsCopy.subType\"\n            baseTranslate=\"@pry.widget.chart.markType.\"\n            class=\"a-pry-select\"\n            bindLabel=\"label\"\n            bindValue=\"id\"\n            id=\"chart_type\"\n          ></pry-select>\n        </div>\n      </div>\n\n      <ng-container *ngIf=\"optionsCopy?.type !== MarkType.RADAR && optionsCopy?.type !== MarkType.CIRCLE_PACK\">\n        <ng-container *ngIf=\"optionsCopy?.subType === MarkSubType.DONUT\">\n          <pry-range\n            [ngModel]=\"optionsCopy.innerRadius\"\n            (ngModelChange)=\"changeInnerRadius($event)\"\n            labelTranslate=\"@pry.widget.chart.innerRadius\"\n            min=\"1\"\n            max=\"500\"\n          ></pry-range>\n        </ng-container>\n\n        <div\n          *ngFor=\"let variableDef of optionsCopy?.selectedVariables; let i = index\"\n          class=\"o-settings__popup__content__fields -condensed\"\n        >\n          <div class=\"m-form-label-field\" *ngIf=\"i === 1\">\n            <label class=\"a-label\" for=\"aggregations\">{{ '@pry.widget.chart.encoding.group' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeAggregation($event)\"\n              *ngIf=\"i === 1\"\n              [bindData]=\"true\"\n              [itemsAsOption]=\"true\"\n              [items]=\"aggregations\"\n              [labelTranslate]=\"true\"\n              [ngModel]=\"optionsCopy.aggregation\"\n              [translationFn]=\"translateAggregations\"\n              class=\"a-pry-select\"\n              id=\"aggregations\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\" *ngIf=\"i !== 1 || optionsCopy.aggregation !== 'count'\">\n            <label class=\"a-label\" for=\"aggregation_property\">\n              {{ axeLabel(i, optionsCopy) | i18n }}\n            </label>\n            <pry-select\n              (ngModelChange)=\"changeProperty($event, i)\"\n              [itemsAsOption]=\"true\"\n              [items]=\"(i !== 1 ? variableAttributes$ : possibleSecondaryAttributes$) | async\"\n              [ngModel]=\"variableDef.name\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"aggregation_property\"\n            ></pry-select>\n          </div>\n\n          <pry-edit-input\n            label=\"@pry.widget.chart.dataLabel\"\n            (ngModelChange)=\"changeLabel($event, i)\"\n            [ngModel]=\"variableDef.label\"\n          ></pry-edit-input>\n\n          <div *ngIf=\"variableDef.type === 'temporal'\" class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_timeUnit\">{{ '@pry.widget.chart.timeUnit' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeTimeUnit($event, variableDef)\"\n              [bindData]=\"true\"\n              [itemsAsOption]=\"true\"\n              [items]=\"timeUnits\"\n              [labelTranslate]=\"true\"\n              [ngModel]=\"variableDef.timeUnit\"\n              baseTranslate=\"@pry.widget.chart.timeUnitList.\"\n              class=\"a-pry-select\"\n              id=\"chart_timeUnit\"\n            ></pry-select>\n          </div>\n\n          <div *ngIf=\"variableDef.type === 'quantitative' && optionsCopy?.type !== 'arc'\" class=\"m-form-label-field\">\n            <pry-checkbox (ngModelChange)=\"toggleOriginAtZero(variableDef, $event)\" [ngModel]=\"variableDef.origin0\"\n              >{{ '@pry.widget.chart.origin' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <pry-checkbox\n              (ngModelChange)=\"toggleSeries($event)\"\n              [ngModel]=\"!!optionsCopy.series\"\n              *ngIf=\"optionsCopy?.type !== MarkType.ARC && optionsCopy?.type !== MarkType.RADAR\"\n              [disabled]=\"\n                this.optionsCopy.subType === MarkSubType.AREASTACKED ||\n                this.optionsCopy.subType === MarkSubType.HISTOSTACKED\n              \"\n              >{{ '@pry.widget.chart.series' | i18n }}\n            </pry-checkbox>\n          </div>\n\n          <div\n            class=\"m-form-label-field\"\n            *ngIf=\"optionsCopy?.type !== MarkType.ARC && optionsCopy?.type !== MarkType.RADAR && !!optionsCopy.series\"\n          >\n            <label class=\"a-label\" for=\"chart_seriesAttr\">{{ '@pry.widget.chart.seriesAttr' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeSeries($event)\"\n              [ngModel]=\"optionsCopy.series.groupBy!\"\n              [itemsAsOption]=\"true\"\n              [items]=\"variableAttributes$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_seriesAttr\"\n            ></pry-select>\n          </div>\n\n          <div\n            class=\"m-form-label-field\"\n            *ngIf=\"\n              (optionsCopy?.type === MarkType.ARC || optionsCopy?.type === MarkType.RADAR || !!optionsCopy.series) &&\n              schemes\n            \"\n          >\n            <label class=\"a-label\" for=\"chart_seriesScheme\" [title]=\"'@pry.widget.chart.seriesSchemeAlt' | i18n\">{{\n              '@pry.widget.chart.seriesScheme' | i18n\n            }}</label>\n            <pry-select\n              (ngModelChange)=\"changeSeriesScheme($event)\"\n              [ngModel]=\"optionsCopy.series?.scheme!\"\n              [itemsAsOption]=\"true\"\n              [items]=\"schemes\"\n              id=\"chart_seriesScheme\"\n              [labelTranslate]=\"true\"\n              baseTranslate=\"@pry.widget.chart.scheme.\"\n              bindValue=\"id\"\n              bindLabel=\"id\"\n            ></pry-select>\n          </div>\n\n          <div class=\"o-widget--chart-color-thumb\">\n            <div\n              *ngFor=\"let schemeColor of scheme()\"\n              class=\"o-widget--chart-color-thumb-item\"\n              [title]=\"schemeColor\"\n              [style.background-color]=\"schemeColor\"\n            ></div>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <pry-checkbox\n              (ngModelChange)=\"toggleSeriesLegend($event)\"\n              [ngModel]=\"!!optionsCopy.legend!\"\n              *ngIf=\"optionsCopy?.type !== MarkType.RADAR || !!optionsCopy.series\"\n              >{{ '@pry.widget.chart.seriesLegend' | i18n }}\n            </pry-checkbox>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <pry-checkbox (ngModelChange)=\"toggleTooltip($event)\" [ngModel]=\"!!optionsCopy.tooltip!\"\n              >{{ '@pry.widget.chart.tooltip' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n      </ng-container>\n\n      <ng-container *ngIf=\"optionsCopy?.type === MarkType.RADAR && optionsCopy.radar !== undefined\">\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.radar.compare\"\n              [itemsAsOption]=\"true\"\n              [items]=\"comparisons\"\n              bindLabel=\"name\"\n              bindValue=\"id\"\n              class=\"a-pry-select\"\n            ></pry-select>\n          </div>\n\n          <ng-container *ngIf=\"optionsCopy.radar.compare === 'item'\">\n            <div class=\"m-form-label-field\">\n              <pry-select\n                (ngModelChange)=\"trigger(); proposeTitle()\"\n                [(ngModel)]=\"optionsCopy.radar.props\"\n                [itemsAsOption]=\"true\"\n                [items]=\"numericProperties$ | async\"\n                [multiple]=\"true\"\n                [closeOnSelect]=\"false\"\n                bindLabel=\"name\"\n                bindValue=\"name\"\n                class=\"a-pry-select\"\n              ></pry-select>\n            </div>\n          </ng-container>\n\n          <ng-container *ngIf=\"optionsCopy.radar.compare === 'value'\">\n            <div class=\"m-form-label-field\">\n              <label class=\"a-label\" for=\"comparison_key\">{{ '@pry.widget.chart.comparison.key' | i18n }}</label>\n              <pry-select\n                (ngModelChange)=\"trigger(); proposeTitle()\"\n                [(ngModel)]=\"optionsCopy.radar.keyProp\"\n                [itemsAsOption]=\"true\"\n                [items]=\"textProperties$ | async\"\n                bindLabel=\"name\"\n                bindValue=\"name\"\n                class=\"a-pry-select\"\n                id=\"comparison_key\"\n              ></pry-select>\n            </div>\n\n            <div class=\"m-form-label-field\">\n              <label class=\"a-label\" for=\"comparison_values\">{{ '@pry.widget.chart.comparison.values' | i18n }}</label>\n              <pry-select\n                (ngModelChange)=\"trigger(); proposeTitle()\"\n                [(ngModel)]=\"optionsCopy.radar.valueProp\"\n                [itemsAsOption]=\"true\"\n                [items]=\"numericProperties$ | async\"\n                bindLabel=\"name\"\n                bindValue=\"name\"\n                class=\"a-pry-select\"\n                id=\"comparison_values\"\n              ></pry-select>\n            </div>\n\n            <div class=\"m-form-label-field\">\n              <label class=\"a-label\" for=\"comparison_category\">{{\n                '@pry.widget.chart.comparison.category' | i18n\n              }}</label>\n              <pry-select\n                (ngModelChange)=\"trigger(); proposeTitle()\"\n                [(ngModel)]=\"optionsCopy.radar.categoryProp\"\n                [itemsAsOption]=\"true\"\n                [items]=\"textProperties$ | async\"\n                bindLabel=\"name\"\n                bindValue=\"name\"\n                class=\"a-pry-select\"\n                id=\"comparison_category\"\n              ></pry-select>\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"schemes\">\n            <label\n              class=\"a-label\"\n              for=\"chart_seriesScheme_radar\"\n              [title]=\"'@pry.widget.chart.seriesSchemeAlt' | i18n\"\n              >{{ '@pry.widget.chart.seriesScheme' | i18n }}</label\n            >\n            <pry-select\n              (ngModelChange)=\"changeSeriesScheme($event)\"\n              [ngModel]=\"optionsCopy.series?.scheme!\"\n              [bindData]=\"true\"\n              [itemsAsOption]=\"false\"\n              [items]=\"schemes\"\n              id=\"chart_seriesScheme_radar\"\n            ></pry-select>\n          </ng-container>\n        </div>\n      </ng-container>\n\n      <ng-container *ngIf=\"optionsCopy?.type === MarkType.CIRCLE_PACK && optionsCopy.packing !== undefined\">\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_circle_id\">{{ '@pry.widget.chart.circle.id' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.packing.id\"\n              [itemsAsOption]=\"true\"\n              [items]=\"variableAttributes$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_circle_id\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_circle_pid\">{{ '@pry.widget.chart.circle.pid' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.packing.parentId\"\n              [itemsAsOption]=\"true\"\n              [items]=\"variableAttributes$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_circle_pid\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_circle_field\">{{ '@pry.widget.chart.circle.field' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.packing.packField\"\n              [itemsAsOption]=\"true\"\n              [items]=\"numericProperties$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_circle_field\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_circle_tooltip\">{{ '@pry.widget.chart.circle.tooltip' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.packing.tooltip\"\n              [itemsAsOption]=\"true\"\n              [items]=\"variableAttributes$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_circle_tooltip\"\n            ></pry-select>\n          </div>\n        </div>\n      </ng-container>\n\n      <div class=\"o-settings__popup__content__fields -condensed\">\n        <pry-checkbox (ngModelChange)=\"toggleSpecToMerge($event)\" [ngModel]=\"!!optionsCopy.specToMerge\"\n          >{{ '@pry.widget.chart.moreOptions' | i18n }}\n        </pry-checkbox>\n\n        <ng-container *ngIf=\"!!optionsCopy.specToMerge\">\n          <textarea\n            [ngModel]=\"advancedEdit\"\n            (focusout)=\"updateAdvancedEdit($event)\"\n            class=\"o-settings__popup__content__area\"\n            [class.-invalid]=\"invalidJson\"\n          ></textarea>\n        </ng-container>\n      </div>\n    </pry-settings>\n  </pry-widget-header>\n  <ng-container *ngIf=\"isChartValid$ | async\">\n    <div\n      #vega\n      [style.height.px]=\"\n        ((widgetSize$ | async)?.height ?? 0) - ((displayHeader$ | async) ? 1 : 0) * WIDGET_HEADER_HEIGHT\n      \"\n      [style.width.px]=\"(widgetSize$ | async)?.width\"\n    ></div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!(isChartValid$ | async)\">\n    <div class=\"o-widget__choose-parameters\">\n      <p class=\"a-p\">\n        {{ '@pry.widget.chart.chooseParameters' | i18n }}\n      </p>\n      <button type=\"button\" (click)=\"openSettings()\" class=\"a-btn a-btn--primary\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"control\"></pry-icon>\n        <span>{{ '@pry.widget.settings.title' | i18n }}</span>\n      </button>\n    </div>\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["saveTriggered", "changeTitle"] }, { kind: "component", type: i2.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "openData$", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i5.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "component", type: i2.PryEditInputComponent, selector: "pry-edit-input", inputs: ["label"] }, { kind: "component", type: i2.PryRangeComponent, selector: "pry-range", inputs: ["min", "max", "step", "disabled", "labelTranslate"] }, { kind: "component", type: i6.PryWidgetChartCssComponent, selector: "pry-widget-chart-css" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: WidgetChartComponent, selector: "pry-widget-chart", viewQueries: [{ propertyName: "vega", first: true, predicate: ["vega"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-widget-chart-css></pry-widget-chart-css>\n<div class=\"o-widget o-widget--chart\">\n  <pry-widget-header\n    [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n    *ngIf=\"displayHeader$ | async\"\n    [widgetIndex]=\"widgetIndex\"\n    [manifest]=\"manifest\"\n    (manifestModified)=\"manifestModified.emit($event)\"\n    #header\n    [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n  >\n    <pry-settings\n      (saveTriggered)=\"emitManifest()\"\n      (changeTitle)=\"changeWidgetTitle($event)\"\n      [headerPresent]=\"displayHeader$ | async\"\n      [isDisable]=\"(filterDataForOptionsCopy$ | async)?.length === 0 || hasNoType(optionsCopy)\"\n      [widgetIndex]=\"widgetIndex\"\n      [open$]=\"open$\"\n      [header]=\"header\"\n      class=\"o-settings\"\n    >\n      <div class=\"o-settings__popup__content__fields -condensed\">\n        <pry-edit-input\n          label=\"@pry.widget.chart.title\"\n          (ngModelChange)=\"changeChartTitle($event)\"\n          [ngModel]=\"optionsCopy.customTitle ?? optionsCopy.title\"\n        ></pry-edit-input>\n\n        <div class=\"m-form-label-field\">\n          <ng-container *ngIf=\"(filterDataForOptionsCopy$ | async)?.length === 0; else data\">\n            <p class=\"a-label a-label--help -error\">{{ '@pry.widget.chart.params.noParams' | i18n }}</p>\n          </ng-container>\n          <ng-template #data>\n            <div *ngIf=\"optionsCopy?.type !== MarkType.RADAR\">\n              {{ '@pry.widget.chart.params.multipleParams' | i18n }}{{ (filterDataForOptionsCopy$ | async)?.length }}\n            </div>\n          </ng-template>\n        </div>\n\n        <div *ngIf=\"optionsCopy\" class=\"m-form-label-field\">\n          <label class=\"a-label\" for=\"chart_type\">{{ '@pry.widget.chart.type' | i18n }}</label>\n          <pry-select\n            (ngModelChange)=\"changeType($event)\"\n            [itemsAsOption]=\"true\"\n            [items]=\"typeOptions\"\n            [labelTranslate]=\"true\"\n            [ngModel]=\"optionsCopy.type + '-' + optionsCopy.subType\"\n            baseTranslate=\"@pry.widget.chart.markType.\"\n            class=\"a-pry-select\"\n            bindLabel=\"label\"\n            bindValue=\"id\"\n            id=\"chart_type\"\n          ></pry-select>\n        </div>\n      </div>\n\n      <ng-container *ngIf=\"optionsCopy?.type !== MarkType.RADAR && optionsCopy?.type !== MarkType.CIRCLE_PACK\">\n        <ng-container *ngIf=\"optionsCopy?.subType === MarkSubType.DONUT\">\n          <pry-range\n            [ngModel]=\"optionsCopy.innerRadius\"\n            (ngModelChange)=\"changeInnerRadius($event)\"\n            labelTranslate=\"@pry.widget.chart.innerRadius\"\n            min=\"1\"\n            max=\"500\"\n          ></pry-range>\n        </ng-container>\n\n        <div\n          *ngFor=\"let variableDef of optionsCopy?.selectedVariables; let i = index\"\n          class=\"o-settings__popup__content__fields -condensed\"\n        >\n          <div class=\"m-form-label-field\" *ngIf=\"i === 1\">\n            <label class=\"a-label\" for=\"aggregations\">{{ '@pry.widget.chart.encoding.group' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeAggregation($event)\"\n              *ngIf=\"i === 1\"\n              [bindData]=\"true\"\n              [itemsAsOption]=\"true\"\n              [items]=\"aggregations\"\n              [labelTranslate]=\"true\"\n              [ngModel]=\"optionsCopy.aggregation\"\n              [translationFn]=\"translateAggregations\"\n              class=\"a-pry-select\"\n              id=\"aggregations\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\" *ngIf=\"i !== 1 || optionsCopy.aggregation !== 'count'\">\n            <label class=\"a-label\" for=\"aggregation_property\">\n              {{ axeLabel(i, optionsCopy) | i18n }}\n            </label>\n            <pry-select\n              (ngModelChange)=\"changeProperty($event, i)\"\n              [itemsAsOption]=\"true\"\n              [items]=\"(i !== 1 ? variableAttributes$ : possibleSecondaryAttributes$) | async\"\n              [ngModel]=\"variableDef.name\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"aggregation_property\"\n            ></pry-select>\n          </div>\n\n          <pry-edit-input\n            label=\"@pry.widget.chart.dataLabel\"\n            (ngModelChange)=\"changeLabel($event, i)\"\n            [ngModel]=\"variableDef.label\"\n          ></pry-edit-input>\n\n          <div *ngIf=\"variableDef.type === 'temporal'\" class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_timeUnit\">{{ '@pry.widget.chart.timeUnit' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeTimeUnit($event, variableDef)\"\n              [bindData]=\"true\"\n              [itemsAsOption]=\"true\"\n              [items]=\"timeUnits\"\n              [labelTranslate]=\"true\"\n              [ngModel]=\"variableDef.timeUnit\"\n              baseTranslate=\"@pry.widget.chart.timeUnitList.\"\n              class=\"a-pry-select\"\n              id=\"chart_timeUnit\"\n            ></pry-select>\n          </div>\n\n          <div *ngIf=\"variableDef.type === 'quantitative' && optionsCopy?.type !== 'arc'\" class=\"m-form-label-field\">\n            <pry-checkbox (ngModelChange)=\"toggleOriginAtZero(variableDef, $event)\" [ngModel]=\"variableDef.origin0\"\n              >{{ '@pry.widget.chart.origin' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <pry-checkbox\n              (ngModelChange)=\"toggleSeries($event)\"\n              [ngModel]=\"!!optionsCopy.series\"\n              *ngIf=\"optionsCopy?.type !== MarkType.ARC && optionsCopy?.type !== MarkType.RADAR\"\n              [disabled]=\"\n                this.optionsCopy.subType === MarkSubType.AREASTACKED ||\n                this.optionsCopy.subType === MarkSubType.HISTOSTACKED\n              \"\n              >{{ '@pry.widget.chart.series' | i18n }}\n            </pry-checkbox>\n          </div>\n\n          <div\n            class=\"m-form-label-field\"\n            *ngIf=\"optionsCopy?.type !== MarkType.ARC && optionsCopy?.type !== MarkType.RADAR && !!optionsCopy.series\"\n          >\n            <label class=\"a-label\" for=\"chart_seriesAttr\">{{ '@pry.widget.chart.seriesAttr' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"changeSeries($event)\"\n              [ngModel]=\"optionsCopy.series.groupBy!\"\n              [itemsAsOption]=\"true\"\n              [items]=\"variableAttributes$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_seriesAttr\"\n            ></pry-select>\n          </div>\n\n          <div\n            class=\"m-form-label-field\"\n            *ngIf=\"\n              (optionsCopy?.type === MarkType.ARC || optionsCopy?.type === MarkType.RADAR || !!optionsCopy.series) &&\n              schemes\n            \"\n          >\n            <label class=\"a-label\" for=\"chart_seriesScheme\" [title]=\"'@pry.widget.chart.seriesSchemeAlt' | i18n\">{{\n              '@pry.widget.chart.seriesScheme' | i18n\n            }}</label>\n            <pry-select\n              (ngModelChange)=\"changeSeriesScheme($event)\"\n              [ngModel]=\"optionsCopy.series?.scheme!\"\n              [itemsAsOption]=\"true\"\n              [items]=\"schemes\"\n              id=\"chart_seriesScheme\"\n              [labelTranslate]=\"true\"\n              baseTranslate=\"@pry.widget.chart.scheme.\"\n              bindValue=\"id\"\n              bindLabel=\"id\"\n            ></pry-select>\n          </div>\n\n          <div class=\"o-widget--chart-color-thumb\">\n            <div\n              *ngFor=\"let schemeColor of scheme()\"\n              class=\"o-widget--chart-color-thumb-item\"\n              [title]=\"schemeColor\"\n              [style.background-color]=\"schemeColor\"\n            ></div>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <pry-checkbox\n              (ngModelChange)=\"toggleSeriesLegend($event)\"\n              [ngModel]=\"!!optionsCopy.legend!\"\n              *ngIf=\"optionsCopy?.type !== MarkType.RADAR || !!optionsCopy.series\"\n              >{{ '@pry.widget.chart.seriesLegend' | i18n }}\n            </pry-checkbox>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <pry-checkbox (ngModelChange)=\"toggleTooltip($event)\" [ngModel]=\"!!optionsCopy.tooltip!\"\n              >{{ '@pry.widget.chart.tooltip' | i18n }}\n            </pry-checkbox>\n          </div>\n        </div>\n      </ng-container>\n\n      <ng-container *ngIf=\"optionsCopy?.type === MarkType.RADAR && optionsCopy.radar !== undefined\">\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.radar.compare\"\n              [itemsAsOption]=\"true\"\n              [items]=\"comparisons\"\n              bindLabel=\"name\"\n              bindValue=\"id\"\n              class=\"a-pry-select\"\n            ></pry-select>\n          </div>\n\n          <ng-container *ngIf=\"optionsCopy.radar.compare === 'item'\">\n            <div class=\"m-form-label-field\">\n              <pry-select\n                (ngModelChange)=\"trigger(); proposeTitle()\"\n                [(ngModel)]=\"optionsCopy.radar.props\"\n                [itemsAsOption]=\"true\"\n                [items]=\"numericProperties$ | async\"\n                [multiple]=\"true\"\n                [closeOnSelect]=\"false\"\n                bindLabel=\"name\"\n                bindValue=\"name\"\n                class=\"a-pry-select\"\n              ></pry-select>\n            </div>\n          </ng-container>\n\n          <ng-container *ngIf=\"optionsCopy.radar.compare === 'value'\">\n            <div class=\"m-form-label-field\">\n              <label class=\"a-label\" for=\"comparison_key\">{{ '@pry.widget.chart.comparison.key' | i18n }}</label>\n              <pry-select\n                (ngModelChange)=\"trigger(); proposeTitle()\"\n                [(ngModel)]=\"optionsCopy.radar.keyProp\"\n                [itemsAsOption]=\"true\"\n                [items]=\"textProperties$ | async\"\n                bindLabel=\"name\"\n                bindValue=\"name\"\n                class=\"a-pry-select\"\n                id=\"comparison_key\"\n              ></pry-select>\n            </div>\n\n            <div class=\"m-form-label-field\">\n              <label class=\"a-label\" for=\"comparison_values\">{{ '@pry.widget.chart.comparison.values' | i18n }}</label>\n              <pry-select\n                (ngModelChange)=\"trigger(); proposeTitle()\"\n                [(ngModel)]=\"optionsCopy.radar.valueProp\"\n                [itemsAsOption]=\"true\"\n                [items]=\"numericProperties$ | async\"\n                bindLabel=\"name\"\n                bindValue=\"name\"\n                class=\"a-pry-select\"\n                id=\"comparison_values\"\n              ></pry-select>\n            </div>\n\n            <div class=\"m-form-label-field\">\n              <label class=\"a-label\" for=\"comparison_category\">{{\n                '@pry.widget.chart.comparison.category' | i18n\n              }}</label>\n              <pry-select\n                (ngModelChange)=\"trigger(); proposeTitle()\"\n                [(ngModel)]=\"optionsCopy.radar.categoryProp\"\n                [itemsAsOption]=\"true\"\n                [items]=\"textProperties$ | async\"\n                bindLabel=\"name\"\n                bindValue=\"name\"\n                class=\"a-pry-select\"\n                id=\"comparison_category\"\n              ></pry-select>\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"schemes\">\n            <label\n              class=\"a-label\"\n              for=\"chart_seriesScheme_radar\"\n              [title]=\"'@pry.widget.chart.seriesSchemeAlt' | i18n\"\n              >{{ '@pry.widget.chart.seriesScheme' | i18n }}</label\n            >\n            <pry-select\n              (ngModelChange)=\"changeSeriesScheme($event)\"\n              [ngModel]=\"optionsCopy.series?.scheme!\"\n              [bindData]=\"true\"\n              [itemsAsOption]=\"false\"\n              [items]=\"schemes\"\n              id=\"chart_seriesScheme_radar\"\n            ></pry-select>\n          </ng-container>\n        </div>\n      </ng-container>\n\n      <ng-container *ngIf=\"optionsCopy?.type === MarkType.CIRCLE_PACK && optionsCopy.packing !== undefined\">\n        <div class=\"o-settings__popup__content__fields -condensed\">\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_circle_id\">{{ '@pry.widget.chart.circle.id' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.packing.id\"\n              [itemsAsOption]=\"true\"\n              [items]=\"variableAttributes$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_circle_id\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_circle_pid\">{{ '@pry.widget.chart.circle.pid' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.packing.parentId\"\n              [itemsAsOption]=\"true\"\n              [items]=\"variableAttributes$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_circle_pid\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_circle_field\">{{ '@pry.widget.chart.circle.field' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.packing.packField\"\n              [itemsAsOption]=\"true\"\n              [items]=\"numericProperties$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_circle_field\"\n            ></pry-select>\n          </div>\n\n          <div class=\"m-form-label-field\">\n            <label class=\"a-label\" for=\"chart_circle_tooltip\">{{ '@pry.widget.chart.circle.tooltip' | i18n }}</label>\n            <pry-select\n              (ngModelChange)=\"trigger(); proposeTitle()\"\n              [(ngModel)]=\"optionsCopy.packing.tooltip\"\n              [itemsAsOption]=\"true\"\n              [items]=\"variableAttributes$ | async\"\n              bindLabel=\"name\"\n              bindValue=\"name\"\n              class=\"a-pry-select\"\n              id=\"chart_circle_tooltip\"\n            ></pry-select>\n          </div>\n        </div>\n      </ng-container>\n\n      <div class=\"o-settings__popup__content__fields -condensed\">\n        <pry-checkbox (ngModelChange)=\"toggleSpecToMerge($event)\" [ngModel]=\"!!optionsCopy.specToMerge\"\n          >{{ '@pry.widget.chart.moreOptions' | i18n }}\n        </pry-checkbox>\n\n        <ng-container *ngIf=\"!!optionsCopy.specToMerge\">\n          <textarea\n            [ngModel]=\"advancedEdit\"\n            (focusout)=\"updateAdvancedEdit($event)\"\n            class=\"o-settings__popup__content__area\"\n            [class.-invalid]=\"invalidJson\"\n          ></textarea>\n        </ng-container>\n      </div>\n    </pry-settings>\n  </pry-widget-header>\n  <ng-container *ngIf=\"isChartValid$ | async\">\n    <div\n      #vega\n      [style.height.px]=\"\n        ((widgetSize$ | async)?.height ?? 0) - ((displayHeader$ | async) ? 1 : 0) * WIDGET_HEADER_HEIGHT\n      \"\n      [style.width.px]=\"(widgetSize$ | async)?.width\"\n    ></div>\n  </ng-container>\n\n  <ng-container *ngIf=\"!(isChartValid$ | async)\">\n    <div class=\"o-widget__choose-parameters\">\n      <p class=\"a-p\">\n        {{ '@pry.widget.chart.chooseParameters' | i18n }}\n      </p>\n      <button type=\"button\" (click)=\"openSettings()\" class=\"a-btn a-btn--primary\">\n        <pry-icon [height]=\"20\" [width]=\"20\" iconSvg=\"control\"></pry-icon>\n        <span>{{ '@pry.widget.settings.title' | i18n }}</span>\n      </button>\n    </div>\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["triggerClick", "saveTriggered", "changeTitle"] }, { kind: "component", type: i2.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "openData$", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i5.PryCheckboxComponent, selector: "pry-checkbox", inputs: ["circle"] }, { kind: "component", type: i2.PryEditInputComponent, selector: "pry-edit-input", inputs: ["label"] }, { kind: "component", type: i2.PryRangeComponent, selector: "pry-range", inputs: ["min", "max", "step", "disabled", "labelTranslate"] }, { kind: "component", type: i6.PryWidgetChartCssComponent, selector: "pry-widget-chart-css" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: WidgetChartComponent, decorators: [{
             type: Component,

package/esm2022/widgets/widget-graph/component/widget-graph.component.mjs

@@ -434,7 +434,7 @@ export class WidgetGraphComponent extends DataWidgetComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: WidgetGraphComponent, deps: [{ token: i1.Store }, { token: i2.TooltipFactoryService }, { token: i2.PryI18nService }, { token: i2.SymbolService }, { token: i3.DomSanitizer }, { token: i0.ElementRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: WidgetGraphComponent, selector: "pry-widget-graph", viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }, { propertyName: "tooltip", first: true, predicate: ["tooltip"], descendants: true, read: ViewContainerRef }], usesInheritance: true, ngImport: i0, template: "<pry-widget-force-graph-css></pry-widget-force-graph-css>\n<div class=\"o-widget o-widget--graph\">\n  <pry-widget-header\n    [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n    *ngIf=\"displayHeader$ | async\"\n    [widgetIndex]=\"widgetIndex\"\n    [manifest]=\"manifest\"\n    (manifestModified)=\"manifestModified.emit($event)\"\n    [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n    #header\n  >\n    <pry-settings\n      (saveTriggered)=\"emitManifest()\"\n      (changeTitle)=\"changeWidgetTitle($event)\"\n      [headerPresent]=\"displayHeader$ | async\"\n      [widgetIndex]=\"widgetIndex\"\n      [header]=\"header\"\n      [open$]=\"open$\"\n      class=\"o-settings\"\n    >\n      <div class=\"m-form-label-field\">\n        <label class=\"a-label\" for=\"graph_layout\">{{ '@pry.widget.graph.layout' | i18n }}</label>\n        <pry-select\n          (ngModelChange)=\"changeLayout($event)\"\n          [itemsAsOption]=\"true\"\n          [items]=\"layouts\"\n          [ngModel]=\"optionsCopy!.layout\"\n          bindLabel=\"key\"\n          bindValue=\"key\"\n          id=\"graph_layout\"\n          class=\"a-pry-select\"\n        ></pry-select>\n      </div>\n\n      <div class=\"m-form-label-field\">\n        <pry-range\n          [ngModel]=\"optionsCopy!.nodeRadius\"\n          (ngModelChange)=\"changeNodeRadius($event)\"\n          labelTranslate=\"@pry.widget.graph.nodeRadius\"\n          min=\"10\"\n          max=\"200\"\n        ></pry-range>\n      </div>\n    </pry-settings>\n  </pry-widget-header>\n  <div class=\"no-result\" *ngIf=\"(allItemsWithImages$ | async)?.length === 0\">\n    <img\n      class=\"no-result__search\"\n      src=\"../../../assets/svgs/pry_recherche_pas_de_resultat.svg\"\n      alt=\"{{ '@pry.widget.table.empty' | i18n }}\"\n      aria-hidden=\"true\"\n    />\n    <span class=\"no-result__text\">{{ '@pry.widget.graph.empty' | i18n }}</span>\n  </div>\n  <div class=\"m-btn-group -selection-choice\" [style.transform]=\"bottomLeft$ | async\">\n    <button\n      type=\"button\"\n      class=\"a-btn a-btn--icon-only a-tooltip a-tooltip--move\"\n      (click)=\"changeMode('move')\"\n      [class.-selected]=\"mode === 'move'\"\n      [attr.data-tooltip]=\"'@pry.widget.graph.move' | i18n\"\n    >\n      <pry-icon iconSvg=\"move\"></pry-icon>\n      <span class=\"u-visually-hidden\">{{ '@pry.widget.graph.move' | i18n }}</span>\n    </button>\n\n    <button\n      type=\"button\"\n      class=\"a-btn a-btn--icon-only a-tooltip a-tooltip--rectangle\"\n      (click)=\"changeMode('rectangle')\"\n      [class.-selected]=\"mode === 'rectangle'\"\n      [attr.data-tooltip]=\"'@pry.widget.graph.rectangle' | i18n\"\n    >\n      <pry-icon iconSvg=\"rectangle\"></pry-icon>\n      <span class=\"u-visually-hidden\">{{ '@pry.widget.graph.rectangle' | i18n }}</span>\n    </button>\n  </div>\n\n  <canvas\n    #canvas\n    class=\"o-widget--graph__canvas\"\n    (mousemove)=\"onMouseMove($event)\"\n    (mousedown)=\"onMouseDown($event)\"\n    (mouseup)=\"onMouseUp($event)\"\n    (mouseleave)=\"onMouseUp($event, true)\"\n    (contextmenu)=\"contextMenu($event)\"\n  ></canvas>\n\n  <div class=\"selection-rectangle\" #selectionRectangle></div>\n\n  <div\n    class=\"m-tooltip m-tooltip--popup noevent\"\n    [style.display]=\"(tooltip$ | async)?.display ? 'block' : 'none'\"\n    [style.left.px]=\"((tooltip$ | async)?.x ?? 0) + 50\"\n    [style.top.px]=\"((tooltip$ | async)?.y ?? 0) + 50\"\n  >\n    <div #tooltip></div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["saveTriggered", "changeTitle"] }, { kind: "component", type: i2.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "openData$", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i2.PryRangeComponent, selector: "pry-range", inputs: ["min", "max", "step", "disabled", "labelTranslate"] }, { kind: "component", type: i6.PryWidgetForceGraphCssComponent, selector: "pry-widget-force-graph-css" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: WidgetGraphComponent, selector: "pry-widget-graph", viewQueries: [{ propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true }, { propertyName: "tooltip", first: true, predicate: ["tooltip"], descendants: true, read: ViewContainerRef }], usesInheritance: true, ngImport: i0, template: "<pry-widget-force-graph-css></pry-widget-force-graph-css>\n<div class=\"o-widget o-widget--graph\">\n  <pry-widget-header\n    [datasourceIds]=\"(datasourceIds$ | async) ?? []\"\n    *ngIf=\"displayHeader$ | async\"\n    [widgetIndex]=\"widgetIndex\"\n    [manifest]=\"manifest\"\n    (manifestModified)=\"manifestModified.emit($event)\"\n    [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n    #header\n  >\n    <pry-settings\n      (saveTriggered)=\"emitManifest()\"\n      (changeTitle)=\"changeWidgetTitle($event)\"\n      [headerPresent]=\"displayHeader$ | async\"\n      [widgetIndex]=\"widgetIndex\"\n      [header]=\"header\"\n      [open$]=\"open$\"\n      class=\"o-settings\"\n    >\n      <div class=\"m-form-label-field\">\n        <label class=\"a-label\" for=\"graph_layout\">{{ '@pry.widget.graph.layout' | i18n }}</label>\n        <pry-select\n          (ngModelChange)=\"changeLayout($event)\"\n          [itemsAsOption]=\"true\"\n          [items]=\"layouts\"\n          [ngModel]=\"optionsCopy!.layout\"\n          bindLabel=\"key\"\n          bindValue=\"key\"\n          id=\"graph_layout\"\n          class=\"a-pry-select\"\n        ></pry-select>\n      </div>\n\n      <div class=\"m-form-label-field\">\n        <pry-range\n          [ngModel]=\"optionsCopy!.nodeRadius\"\n          (ngModelChange)=\"changeNodeRadius($event)\"\n          labelTranslate=\"@pry.widget.graph.nodeRadius\"\n          min=\"10\"\n          max=\"200\"\n        ></pry-range>\n      </div>\n    </pry-settings>\n  </pry-widget-header>\n  <div class=\"no-result\" *ngIf=\"(allItemsWithImages$ | async)?.length === 0\">\n    <img\n      class=\"no-result__search\"\n      src=\"../../../assets/svgs/pry_recherche_pas_de_resultat.svg\"\n      alt=\"{{ '@pry.widget.table.empty' | i18n }}\"\n      aria-hidden=\"true\"\n    />\n    <span class=\"no-result__text\">{{ '@pry.widget.graph.empty' | i18n }}</span>\n  </div>\n  <div class=\"m-btn-group -selection-choice\" [style.transform]=\"bottomLeft$ | async\">\n    <button\n      type=\"button\"\n      class=\"a-btn a-btn--icon-only a-tooltip a-tooltip--move\"\n      (click)=\"changeMode('move')\"\n      [class.-selected]=\"mode === 'move'\"\n      [attr.data-tooltip]=\"'@pry.widget.graph.move' | i18n\"\n    >\n      <pry-icon iconSvg=\"move\"></pry-icon>\n      <span class=\"u-visually-hidden\">{{ '@pry.widget.graph.move' | i18n }}</span>\n    </button>\n\n    <button\n      type=\"button\"\n      class=\"a-btn a-btn--icon-only a-tooltip a-tooltip--rectangle\"\n      (click)=\"changeMode('rectangle')\"\n      [class.-selected]=\"mode === 'rectangle'\"\n      [attr.data-tooltip]=\"'@pry.widget.graph.rectangle' | i18n\"\n    >\n      <pry-icon iconSvg=\"rectangle\"></pry-icon>\n      <span class=\"u-visually-hidden\">{{ '@pry.widget.graph.rectangle' | i18n }}</span>\n    </button>\n  </div>\n\n  <canvas\n    #canvas\n    class=\"o-widget--graph__canvas\"\n    (mousemove)=\"onMouseMove($event)\"\n    (mousedown)=\"onMouseDown($event)\"\n    (mouseup)=\"onMouseUp($event)\"\n    (mouseleave)=\"onMouseUp($event, true)\"\n    (contextmenu)=\"contextMenu($event)\"\n  ></canvas>\n\n  <div class=\"selection-rectangle\" #selectionRectangle></div>\n\n  <div\n    class=\"m-tooltip m-tooltip--popup noevent\"\n    [style.display]=\"(tooltip$ | async)?.display ? 'block' : 'none'\"\n    [style.left.px]=\"((tooltip$ | async)?.x ?? 0) + 50\"\n    [style.top.px]=\"((tooltip$ | async)?.y ?? 0) + 50\"\n  >\n    <div #tooltip></div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["triggerClick", "saveTriggered", "changeTitle"] }, { kind: "component", type: i2.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "openData$", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i2.PrySelectComponent, selector: "pry-select", inputs: ["labelTranslate", "baseTranslate", "translationFn", "translationFnArgs", "clearable", "multiple", "multipleClearRight", "closeOnSelect", "placeholder", "isForm", "required", "name", "readonly", "items", "itemsAsOption", "bindData", "bindValue", "bindLabel", "bindIcon", "iconSize", "templateLabel", "templateOption", "autocomplete"] }, { kind: "component", type: i2.PryIconComponent, selector: "pry-icon", inputs: ["color", "iconSvg", "animation", "iconImage", "alt", "width", "height", "classes"] }, { kind: "component", type: i2.PryRangeComponent, selector: "pry-range", inputs: ["min", "max", "step", "disabled", "labelTranslate"] }, { kind: "component", type: i6.PryWidgetForceGraphCssComponent, selector: "pry-widget-force-graph-css" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.I18nPipe, name: "i18n" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: WidgetGraphComponent, decorators: [{
             type: Component,

package/esm2022/widgets/widget-iframe/component/widget-iframe.component.mjs

@@ -43,7 +43,7 @@ export class WidgetIframeComponent extends BaseWidgetComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: WidgetIframeComponent, deps: [{ token: i1.Store }, { token: i2.DomSanitizer }, { token: i3.IframeMessagingService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: WidgetIframeComponent, selector: "pry-widget-iframe", viewQueries: [{ propertyName: "iframe", first: true, predicate: ["iframe"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-widget-iframe-css></pry-widget-iframe-css>\n<div class=\"o-widget o-widget--iframe\">\n  <pry-widget-header\n    *ngIf=\"displayHeader$ | async\"\n    [widgetIndex]=\"widgetIndex\"\n    [manifest]=\"manifest\"\n    (manifestModified)=\"manifestModified.emit($event)\"\n    #header\n    [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n  >\n    <pry-settings\n      (saveTriggered)=\"emitManifest()\"\n      (changeTitle)=\"changeWidgetTitle($event)\"\n      [headerPresent]=\"displayHeader$ | async\"\n      [widgetIndex]=\"widgetIndex\"\n      [header]=\"header\"\n      [open$]=\"open$\"\n      class=\"o-settings\"\n    >\n      <div class=\"o-settings__fields\">\n        <div class=\"m-form-label-field\">\n          <label class=\"a-label\" for=\"iframe_src\">{{ '@pry.widget.iframe.label' | i18n }}</label>\n          <input\n            class=\"a-form-field\"\n            id=\"iframe_src\"\n            type=\"text\"\n            [value]=\"optionsCopy.src\"\n            (input)=\"changeSrc($event)\"\n          />\n        </div>\n      </div>\n    </pry-settings>\n  </pry-widget-header>\n  <ng-container *ngIf=\"src$ | async as src\">\n    <div [style.height.px]=\"height$ | async\">\n      <iframe [src]=\"src\" #iframe></iframe>\n    </div>\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["saveTriggered", "changeTitle"] }, { kind: "component", type: i5.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "openData$", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i6.PryWidgetIframeCssComponent, selector: "pry-widget-iframe-css" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.I18nPipe, name: "i18n" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.6", type: WidgetIframeComponent, selector: "pry-widget-iframe", viewQueries: [{ propertyName: "iframe", first: true, predicate: ["iframe"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pry-widget-iframe-css></pry-widget-iframe-css>\n<div class=\"o-widget o-widget--iframe\">\n  <pry-widget-header\n    *ngIf=\"displayHeader$ | async\"\n    [widgetIndex]=\"widgetIndex\"\n    [manifest]=\"manifest\"\n    (manifestModified)=\"manifestModified.emit($event)\"\n    #header\n    [headerOptions]=\"(displayHeader$ | async) ?? {}\"\n  >\n    <pry-settings\n      (saveTriggered)=\"emitManifest()\"\n      (changeTitle)=\"changeWidgetTitle($event)\"\n      [headerPresent]=\"displayHeader$ | async\"\n      [widgetIndex]=\"widgetIndex\"\n      [header]=\"header\"\n      [open$]=\"open$\"\n      class=\"o-settings\"\n    >\n      <div class=\"o-settings__fields\">\n        <div class=\"m-form-label-field\">\n          <label class=\"a-label\" for=\"iframe_src\">{{ '@pry.widget.iframe.label' | i18n }}</label>\n          <input\n            class=\"a-form-field\"\n            id=\"iframe_src\"\n            type=\"text\"\n            [value]=\"optionsCopy.src\"\n            (input)=\"changeSrc($event)\"\n          />\n        </div>\n      </div>\n    </pry-settings>\n  </pry-widget-header>\n  <ng-container *ngIf=\"src$ | async as src\">\n    <div [style.height.px]=\"height$ | async\">\n      <iframe [src]=\"src\" #iframe></iframe>\n    </div>\n  </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.SettingsComponent, selector: "pry-settings", inputs: ["widgetIndex", "isDisable", "headerPresent", "open$", "header"], outputs: ["triggerClick", "saveTriggered", "changeTitle"] }, { kind: "component", type: i5.PryWidgetHeaderComponent, selector: "pry-widget-header", inputs: ["manifest", "openData$", "additionalOptions", "headerOptions", "displayCount", "datasourceIds", "widgetIndex"], outputs: ["manifestModified"] }, { kind: "component", type: i6.PryWidgetIframeCssComponent, selector: "pry-widget-iframe-css" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.I18nPipe, name: "i18n" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.6", ngImport: i0, type: WidgetIframeComponent, decorators: [{
             type: Component,