axidio-styleguide-library1-v2 0.1.61 → 0.1.63

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 (5) hide show
  1. package/esm2022/lib/horizontal-bars-with-scroll-zoom/horizontal-bars-with-scroll-zoom.component.mjs +29 -10
  2. package/fesm2022/axidio-styleguide-library1-v2.mjs +28 -9
  3. package/fesm2022/axidio-styleguide-library1-v2.mjs.map +1 -1
  4. package/lib/horizontal-bars-with-scroll-zoom/horizontal-bars-with-scroll-zoom.component.d.ts +1 -1
  5. package/package.json +1 -1
package/fesm2022/axidio-styleguide-library1-v2.mjs CHANGED
@@ -6937,7 +6937,7 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
6937
6937
  this.isCC = false;
6938
6938
  this.isZoomedOut = true;
6939
6939
  }
6940
- isZoomOutSelected(isZoomOut, event) {
6940
+ isZoomOutSelected(isZoomOut) {
6941
6941
  this.isZoomedOut = isZoomOut;
6942
6942
  this.ngOnChanges();
6943
6943
  }
@@ -7506,11 +7506,11 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7506
7506
  desiredText += metaData.unit
7507
7507
  ? '<span class="title-top-text">' +
7508
7508
  metaData.unit +
7509
- (d[1] - d[0]) +
7509
+ (d[1] - d[0]) + ' ' +
7510
7510
  dataType +
7511
7511
  '</span>'
7512
7512
  : '<span class="title-top-text">' +
7513
- (d[1] - d[0]) +
7513
+ (d[1] - d[0]) + ' ' +
7514
7514
  dataType +
7515
7515
  '</span>';
7516
7516
  // No arrow mark or arrow HTML/CSS in tooltip
@@ -7684,6 +7684,9 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7684
7684
  .call(yAxis)
7685
7685
  .selectAll('text')
7686
7686
  .style('fill', 'var(--chart-text-color)');
7687
+ svg.selectAll('.domain')
7688
+ .style('stroke', 'var(--chart-axis-color)')
7689
+ .style('stroke-width', '1px');
7687
7690
  }
7688
7691
  else if (this.chartConfiguration.isDrilldownChart) {
7689
7692
  svg
@@ -7700,6 +7703,9 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7700
7703
  .call(yAxis)
7701
7704
  .selectAll('text')
7702
7705
  .style('fill', 'var(--chart-text-color)');
7706
+ svgYAxisLeft.selectAll('.domain')
7707
+ .style('stroke', 'var(--chart-axis-color)')
7708
+ .style('stroke-width', '1px');
7703
7709
  svgYAxisRight
7704
7710
  .append('g')
7705
7711
  .attr('class', 'lib-yaxis-labels-texts-drilldown yaxis-dashed')
@@ -7707,6 +7713,9 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7707
7713
  .attr('transform', 'translate(0,0)')
7708
7714
  .call(yAxis)
7709
7715
  .style('display', 'none');
7716
+ svgYAxisRight.selectAll('.domain')
7717
+ .style('stroke', 'var(--chart-axis-color)')
7718
+ .style('stroke-width', '1px');
7710
7719
  }
7711
7720
  else {
7712
7721
  svg
@@ -7725,6 +7734,9 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7725
7734
  .call(yAxis)
7726
7735
  .selectAll('text')
7727
7736
  .style('fill', 'var(--chart-text-color)');
7737
+ svg.selectAll('.domain')
7738
+ .style('stroke', 'var(--chart-axis-color)')
7739
+ .style('stroke-width', '1px');
7728
7740
  }
7729
7741
  /**
7730
7742
  * for existing charts, place xaxis labels nearer to xaxis
@@ -7884,10 +7896,16 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7884
7896
  /** hide y axis labels
7885
7897
  * config is there for future use
7886
7898
  */
7887
- if (this.chartConfiguration.isYaxisHidden != undefined &&
7888
- this.chartConfiguration.isYaxisHidden) {
7899
+ if (this.chartConfiguration.isYaxisHidden != undefined && this.chartConfiguration.isYaxisHidden) {
7889
7900
  d3.selectAll('.yaxis-dashed').attr('class', 'lib-display-hidden');
7890
7901
  }
7902
+ else {
7903
+ // Ensure Y-axis domain is visible and styled
7904
+ d3.selectAll('.yaxis-dashed .domain')
7905
+ .style('stroke', 'var(--chart-axis-color)')
7906
+ .style('stroke-width', '1px')
7907
+ .style('display', 'block');
7908
+ }
7891
7909
  /**
7892
7910
  * dashed y axis
7893
7911
  * used by weekly charts
@@ -7908,7 +7926,7 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7908
7926
  /**
7909
7927
  * used to display y label
7910
7928
  */
7911
- if (this.isZoomedOut) {
7929
+ if (this.isZoomedOut && this.chartData.data.length > 8) {
7912
7930
  svg
7913
7931
  .selectAll('.lib-xaxis-labels-texts-drilldown')
7914
7932
  .attr('transform', 'rotate(-90)')
@@ -7927,7 +7945,7 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7927
7945
  .style('stroke', 'var(--chart-axis-color)')
7928
7946
  .style('stroke-width', '1px');
7929
7947
  }
7930
- styleAxisDomain();
7948
+ // styleAxisDomain();
7931
7949
  if (metaData.yLabel) {
7932
7950
  svgYAxisLeft.selectAll('.lib-axis-group-label, .lib-ylabel-drilldowncharts, .lib-ylabel-weeklyCharts').remove();
7933
7951
  function isAcronym(label) {
@@ -7976,7 +7994,8 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
7976
7994
  // .style('stroke', this.chartData.targetLineData.color);
7977
7995
  svgYAxisRight
7978
7996
  .append('foreignObject')
7979
- .attr('transform', 'translate(' + 0 + ',' + (yZero - 30) + ')')
7997
+ // .attr('transform', 'translate(' + 0 + ',' + (yZero - 30) + ')')
7998
+ .attr('transform', 'translate(' + 0 + ',' + (yZero - 13) + ')')
7980
7999
  .attr('width', rightSvgWidth)
7981
8000
  .attr('height', 50)
7982
8001
  .append('xhtml:div')
@@ -8137,7 +8156,7 @@ class HorizontalBarsWithScrollZoomComponent extends ComponentUniqueId {
8137
8156
  }
8138
8157
  handleZoominZoomoutClick({ isZoomOut, event }) {
8139
8158
  // this.isZoomOutSelected(isZoomOut, event);
8140
- this.isZoomOutSelected(isZoomOut, event);
8159
+ this.isZoomOutSelected(isZoomOut);
8141
8160
  }
8142
8161
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: HorizontalBarsWithScrollZoomComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
8143
8162
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: HorizontalBarsWithScrollZoomComponent, selector: "lib-horizontal-bars-with-scroll-zoom", inputs: { chartData: "chartData", customChartConfiguration: "customChartConfiguration" }, outputs: { clickEvent: "clickEvent", headerMenuclickEvent: "headerMenuclickEvent" }, viewQueries: [{ propertyName: "containerElt", first: true, predicate: ["verticalstackedchartcontainer"], descendants: true, static: true }, { propertyName: "verticalstackedcontainerElt", first: true, predicate: ["verticalstackedcontainer"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<meta http-equiv=\"CACHE-CONTROL\" content=\"NO-CACHE\" />\r\n<meta http-equiv=\"EXPIRES\" content=\"Sat, 01 Jun 2004 11:12:01 GMT\" />\r\n<div\r\n #verticalstackedcontainer\r\n class=\"lib-chart-wrapper\"\r\n [ngClass]=\"{ 'lib-no-background': isTransparentBackground }\"\r\n style=\"background-color: var(--card-bg);\"\r\n\r\n (resized)=\"onResized($event)\"\r\n>\r\n <div class=\"header-alt\" *ngIf=\"!isHeaderVisible\">\r\n <lib-chart-header-v2\r\n [chartData]=\"chartData\"\r\n [chartConfiguration]=\"chartConfiguration\"\r\n (clickEvent)=\"handleClick($event)\"\r\n ></lib-chart-header-v2>\r\n\r\n <!-- <span *ngIf=\"chartConfiguration.isComparebyDropdownVisible\">\r\n <lib-dropdown></lib-dropdown>\r\n </span> -->\r\n <lib-chart-header-v3\r\n [chartData]=\"chartData\"\r\n [chartConfiguration]=\"chartConfiguration\"\r\n (compareByFilterSelection)=\"handleCompareByFilterSelection($event)\"\r\n (zoomInZoomOutClick)=\"handleZoominZoomoutClick($event)\"\r\n ></lib-chart-header-v3>\r\n </div>\r\n <div\r\n [style.height]=\"chartConfiguration.svgHeight\"\r\n id=\"verticalstackedchartcontainer\"\r\n #verticalstackedchartcontainer\r\n class=\"lib-chart-svg\"\r\n ></div>\r\n</div>\r\n", styles: [".lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;font-weight:400;letter-spacing:0px;color:#000;opacity:1;font-size:1.2em}.lib-axis-group-label{font-size:.85em;font-weight:600;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;letter-spacing:0px;color:#000;opacity:1}.dots{font-size:10px}.inline__display{display:flex;justify-content:space-around;padding-top:2%}.verticalbar__text{font-style:normal;font-variant:normal;font-weight:400;font-size:13px;line-height:20px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;letter-spacing:0px;opacity:1}.lib-line-label-item{display:inline-block!important;font-size:.85em;margin-right:10px;font-weight:600}.lib-line-label-wrapper-vertical{display:flex;justify-content:center}.target-display{font-size:12px;line-height:14.52px;font-weight:700;text-transform:uppercase;float:right}.title{background-color:#d9d9d9;height:40px;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:3px;line-height:1}.title-top-text{color:var(--font-color)!important;font-size:14px;font-weight:600}.title-bar-name{color:var(--font-color)!important;font-size:17px;font-weight:700;text-transform:capitalize}.title-bottom-text{color:var(--font-color)!important;font-size:12px}.zoomIcons-holder{display:flex;align-items:center;margin-right:15px}.zoomIcons{border:.5px solid #b6b6b6;cursor:pointer;display:flex;justify-content:center;align-items:center;width:30px;height:30px;color:var(--color)!important}.zoom-active{background-color:#2d5ca0;opacity:1}.zoom-inactive{background-color:#d9d9d9;opacity:.5}@media (max-width: 575px){.lib-xaxis-labels-texts-drilldown{writing-mode:sideways-lr}}@media screen and (min-width: 1024px) and (min-height: 400px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:10px!important}.dots{font-size:10px!important}}@media screen and (min-width: 1024px) and (min-height: 1000px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:10px!important}.dots{font-size:10px!important}}@media screen and (min-width: 1024px) and (min-height: 1500px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:10px!important}.dots{font-size:10px!important}}@media screen and (min-width: 1366px) and (min-height: 400px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:12px!important}.dots{font-size:12px!important}}@media screen and (min-width: 1366px) and (min-height: 1000px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:12px!important}.dots{font-size:12px!important}}@media screen and (min-width: 1366px) and (min-height: 1500px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:12px!important}.dots{font-size:12px!important}}@media screen and (min-width: 1920px) and (min-height: 400px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:14px!important}.dots{font-size:14px!important}}@media screen and (min-width: 1920px) and (min-height: 1000px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:14px!important}.dots{font-size:14px!important}}@media screen and (min-width: 1920px) and (min-height: 1500px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:14px!important}.dots{font-size:14px!important}}@media screen and (min-width: 2560px) and (min-height: 500px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:16px!important}.dots{font-size:16px!important}}@media screen and (min-width: 2560px) and (min-height: 1000px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:16px!important}.dots{font-size:16px!important}}@media screen and (min-width: 2560px) and (min-height: 1500px){.lib-stacked-y-axis-text text,.lib-stacked-x-axis-text text{font-size:16px!important}}.bottom__text{position:absolute!important;bottom:0!important;display:flex!important;justify-content:center!important;align-items:center!important;width:100%!important}.box__heightwidth{opacity:1;height:10px;width:10px;border:none!important;border-radius:50%}.label__text{margin-right:10px;display:flex;justify-content:center;align-items:center;font-style:normal;font-variant:normal;font-weight:400;font-size:10px;line-height:13px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;letter-spacing:.2px;color:#707070!important}.lib-verticalstack-labels-ontop-weklycharts{font-style:normal;font-variant:normal;font-weight:700;font-size:10px;line-height:11px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;letter-spacing:-.05px;text-anchor:middle;fill:#000}.lib-verticalstack-title-ontop{font-style:normal;font-variant:normal;font-size:14px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;letter-spacing:-.05px;text-anchor:middle;fill:#000}.marginLeft-20{margin-left:20px}.flex-inline{display:flex;justify-content:center;align-items:center;font-size:14px}\n", ".lib-chart-wrapper{width:100%;height:100%;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;background:#fff 0% 0% no-repeat padding-box;position:relative}.lib-chart-wrapper-wo-shadow{width:100%;height:100%;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto}.lib-chart-wrapper:hover .chart-header-v1{background-color:#2e3640}.lib-chart-wrapper:hover .chart-title{color:#fff}.lib-chart-svg{width:100%}.lib-chart-header{text-align:center;background-color:#052340;color:#fff;width:100%;height:17%;word-spacing:.5px;line-height:1.8;font-weight:700;padding-top:2%;letter-spacing:0;font-size:1.2em}.lib-donut-chart-footer{width:100%;text-align:right}.lib-donut-label-text{font-size:.9em;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;font-weight:400;letter-spacing:0px;color:#000;opacity:1}.lib-donut-label-icon{display:inline-block;width:10px;height:10px;margin-right:20px;border-radius:3px}.lib-donut-label-item{font-weight:400;font-size:.85em;color:#2f2f2f}.lib-donut-justified-label-wrapper{width:100%;display:inline-block;text-align:center;list-style-type:none}.lib-donut-justified-label-item{font-weight:400;font-size:.85em;color:#2f2f2f;display:inline-block;text-align:left;padding:0 10px}.lib-donut-justified-label-icon{display:inline-block;width:10px;height:10px;margin-right:5px;border-radius:3px}.lib-no-background{background:none!important}.lib-display-hidden{display:none}.lib-ylabel-weeklyCharts{font-style:normal;font-variant:normal;font-weight:800;font-size:10px;line-height:12px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;letter-spacing:-.07px;text-transform:capitalize;color:#000}.lib-data-labels-weeklycharts{font-style:normal;font-variant:normal;font-weight:400;font-size:12px;line-height:14px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;letter-spacing:-.06px;color:#000}.lib-data-labels-angled-weeklycharts{font-style:normal;font-variant:normal;font-weight:800;font-size:9.5px;line-height:11px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;letter-spacing:.4px;text-anchor:start}.lib-xaxis-labels-texts-weeklycharts{font-style:normal;font-variant:normal;font-weight:800;font-size:10px;line-height:11px;letter-spacing:-.05px;fill:#000}.lib-xaxis-labels-texts-drilldown{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;font-size:14px;letter-spacing:-1px;color:#000;opacity:1;text-transform:capitalize}.lib-white-space-nowrap{white-space:nowrap}.lib-xaxis-labels-texts-drilldown-alt{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;font-size:10px;letter-spacing:0px;color:#000;opacity:1;text-transform:capitalize}.lib-yaxis-labels-texts-drilldown{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;font-size:14px;letter-spacing:0px;color:#000!important;opacity:1}.lib-ylabel-drilldowncharts,.lib-xlabel-drilldowncharts{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;font-size:16px;letter-spacing:-.1px;color:#000!important;opacity:1}.lib-donut-justified-label-icon-drilldown{display:inline-block;width:14px;height:14px;margin-right:10px;border-radius:50%}.marginright-2{margin-right:2%}.margintop-5{margin-top:5%}.width-100{width:100%}.float-right{float:right}.marginBottom-10{margin-bottom:10px}.header-alt{align-items:center;margin-bottom:10px}input::placeholder{font-size:20px;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto;letter-spacing:0px;color:#000;opacity:1}.padding-5{padding:5px}.hidden{visibility:hidden}.font-weight-bold{font-weight:900}.textalign-center{text-align:center}.cursor-pointer{cursor:pointer}.cursor-default{cursor:default}.font-weight-600{font-weight:600}.marginRight-15{margin-right:15px}.marginRight-20{margin-right:20px}.switch{position:relative;display:inline-block;width:46px;height:24px;margin-left:5px;margin-right:5px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background-color:#2d5ca0;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:\"\";height:18px;width:18px;right:3px;bottom:3px;background-color:#fff;-webkit-transition:.4s;transition:.4s}.slider.round{border-radius:18px}.slider.round:before{border-radius:50%}.slider1{position:absolute;cursor:pointer;inset:0;background-color:#015ba2cf;-webkit-transition:.4s;transition:.4s}.slider1:before{position:absolute;content:\"\";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;-webkit-transition:.4s;transition:.4s}.slider1.round1{border-radius:18px}.slider1.round1:before{border-radius:50%}.lib-display-flex{display:flex}.lib-align-items-center{align-items:center}.lib-flex-direction-column{flex-direction:column}.lib-justify-content-space-between{justify-content:space-between}.lib-justify-content-space-around{justify-content:space-around}.lib-justify-content-center{justify-content:center}.lib-justify-content-start{justify-content:start}.lib-justify-content-end{justify-content:end}.lib-ml-20{margin-left:20px}.lib-position-absolute{position:absolute}.lib-z-index-9{z-index:9}.marginright-3{margin-right:3px}@media (min-height: 900px){.lib-chart-wrapper{border-radius:8px}.header-font-size-1{font-size:18px!important}.font-size-1{font-size:14px!important}.font-size-2{font-size:16px!important}.font-size-3{font-size:14px!important}.font-size-4{font-size:22px!important}.font-size-5{font-size:24px!important}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ResizedDirective, selector: "[resized]", outputs: ["resized"] }, { kind: "component", type: ChartHeaderV2Component, selector: "lib-chart-header-v2", inputs: ["chartData", "chartConfiguration"], outputs: ["clickEvent", "zoomInZoomOutClick"] }, { kind: "component", type: ChartHeaderV3Component, selector: "lib-chart-header-v3", inputs: ["chartData", "chartConfiguration"], outputs: ["compareByFilterSelection", "zoomInZoomOutClick"] }], encapsulation: i0.ViewEncapsulation.None }); }