@dynatrace/strato-components 3.4.0 → 3.5.0

package/buttons/button/Button.css

@@ -1,13 +1,13 @@
-._10kgnsa0-3-4-0 {
+._10kgnsa0-3-5-0 {
   font-family: var(--dt-typography-text-base-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-weight: var(--dt-typography-text-base-emphasized-weight, 500);
   font-size: var(--dt-typography-text-base-default-size, 14px);
   line-height: var(--dt-typography-text-base-default-line-height, 1.4285714286);
   text-decoration: var(--dt-typography-text-base-default-text-decoration, none);
   text-transform: none;
-  background: var(--_bx32h3-3-4-0);
-  box-shadow: var(--_bx32h4-3-4-0);
-  color: var(--_bx32h0-3-4-0);
+  background: var(--_bx32h3-3-5-0);
+  box-shadow: var(--_bx32h4-3-5-0);
+  color: var(--_bx32h0-3-5-0);
   display: inline-flex;
   position: relative;
   align-items: center;
@@ -24,38 +24,38 @@
   transition-duration: var(--dt-animations-hover-duration-base, 150ms);
   transition-property: color, background-color, box-shadow, transform;
 }
-._10kgnsa1-3-4-0 {
+._10kgnsa1-3-5-0 {
   text-align: start;
   justify-content: space-between;
 }
-._10kgnsa2-3-4-0 {
+._10kgnsa2-3-5-0 {
   text-align: center;
   justify-content: center;
 }
-._10kgnsa3-3-4-0 {
+._10kgnsa3-3-5-0 {
   padding-top: var(--dt-spacings-size-2, 2px);
   padding-bottom: var(--dt-spacings-size-2, 2px);
   padding-left: var(--dt-spacings-size-4, 4px);
   padding-right: var(--dt-spacings-size-4, 4px);
   gap: var(--dt-spacings-size-2, 2px);
 }
-._10kgnsa4-3-4-0 {
+._10kgnsa4-3-5-0 {
   padding-top: var(--dt-spacings-size-6, 6px);
   padding-bottom: var(--dt-spacings-size-6, 6px);
   padding-left: var(--dt-spacings-size-8, 8px);
   padding-right: var(--dt-spacings-size-8, 8px);
   gap: var(--dt-spacings-size-4, 4px);
 }
-._10kgnsa5-3-4-0 {
+._10kgnsa5-3-5-0 {
   cursor: not-allowed;
 }
-._10kgnsa6-3-4-0 {
+._10kgnsa6-3-5-0 {
   width: 100%;
 }
-._10kgnsa7-3-4-0 {
+._10kgnsa7-3-5-0 {
   width: fit-content;
 }
-._10kgnsa8-3-4-0 {
+._10kgnsa8-3-5-0 {
   position: absolute;
   top: 0;
   left: 0;
@@ -67,19 +67,19 @@
   align-items: center;
   z-index: 1;
 }
-._10kgnsa3-3-4-0 ._10kgnsa9-3-4-0:not(:has(svg:only-child)) {
+._10kgnsa3-3-5-0 ._10kgnsa9-3-5-0:not(:has(svg:only-child)) {
   padding-top: 0;
   padding-bottom: 0;
   padding-left: 2px;
   padding-right: 2px;
 }
-._10kgnsa4-3-4-0 ._10kgnsa9-3-4-0:not(:has(svg:only-child)) {
+._10kgnsa4-3-5-0 ._10kgnsa9-3-5-0:not(:has(svg:only-child)) {
   padding-top: 0;
   padding-bottom: 0;
   padding-left: 4px;
   padding-right: 4px;
 }
-._10kgnsab-3-4-0 {
+._10kgnsab-3-5-0 {
   display: inline-flex;
   min-width: 0;
   max-width: 100%;

package/buttons/button/Button.sty.js

@@ -28,7 +28,7 @@ var import_AppRoot_css_ts_vanilla = require("../../core/components/app-root/AppR
 var import_field_css_ts_vanilla = require("../../styles/field.css");
 var import_Button_css_ts_vanilla = require("./Button.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var button = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_10kgnsa0-3-4-0", variantClassNames: { textAlign: { start: "_10kgnsa1-3-4-0", center: "_10kgnsa2-3-4-0" }, size: { condensed: "_10kgnsa3-3-4-0", "default": "_10kgnsa4-3-4-0" }, disabled: { true: "_10kgnsa5-3-4-0" } }, defaultVariants: { size: "default", textAlign: "center", disabled: false }, compoundVariants: [] });
-var label = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_10kgnsa9-3-4-0", variantClassNames: { textual: { true: "_oqqp1n0-3-4-0", false: "_10kgnsab-3-4-0" } }, defaultVariants: {}, compoundVariants: [] });
-var loading = "_10kgnsa8-3-4-0";
-var widths = { full: "_10kgnsa6-3-4-0", content: "_10kgnsa7-3-4-0" };
+var button = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_10kgnsa0-3-5-0", variantClassNames: { textAlign: { start: "_10kgnsa1-3-5-0", center: "_10kgnsa2-3-5-0" }, size: { condensed: "_10kgnsa3-3-5-0", "default": "_10kgnsa4-3-5-0" }, disabled: { true: "_10kgnsa5-3-5-0" } }, defaultVariants: { size: "default", textAlign: "center", disabled: false }, compoundVariants: [] });
+var label = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_10kgnsa9-3-5-0", variantClassNames: { textual: { true: "_oqqp1n0-3-5-0", false: "_10kgnsab-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });
+var loading = "_10kgnsa8-3-5-0";
+var widths = { full: "_10kgnsa6-3-5-0", content: "_10kgnsa7-3-5-0" };

package/buttons/intent-button/IntentButton.css

@@ -1,3 +1,3 @@
-._1xe9ern0-3-4-0 {
+._1xe9ern0-3-5-0 {
   opacity: 0.5;
 }

package/buttons/intent-button/IntentButton.sty.js

@@ -21,4 +21,4 @@ __export(IntentButton_css_exports, {
 });
 module.exports = __toCommonJS(IntentButton_css_exports);
 var import_IntentButton_css_ts_vanilla = require("./IntentButton.css");
-var disabledAppIconOpacity = "_1xe9ern0-3-4-0";
+var disabledAppIconOpacity = "_1xe9ern0-3-5-0";

package/buttons/notify-button/NotifyButton.css

@@ -1,10 +1,10 @@
-._1j9pkom0-3-4-0 {
+._1j9pkom0-3-5-0 {
   padding-top: var(--dt-spacings-size-12, 12px);
   padding-bottom: var(--dt-spacings-size-16, 16px);
   padding-left: var(--dt-spacings-size-16, 16px);
   padding-right: var(--dt-spacings-size-16, 16px);
 }
-._1j9pkom1-3-4-0 {
+._1j9pkom1-3-5-0 {
   display: flex;
   flex-direction: column;
   gap: var(--dt-spacings-size-6, 6px);

package/buttons/notify-button/NotifyButton.sty.js

@@ -22,5 +22,5 @@ __export(NotifyButton_css_exports, {
 });
 module.exports = __toCommonJS(NotifyButton_css_exports);
 var import_NotifyButton_css_ts_vanilla = require("./NotifyButton.css");
-var overlay = "_1j9pkom0-3-4-0";
-var toast = "_1j9pkom1-3-4-0";
+var overlay = "_1j9pkom0-3-5-0";
+var toast = "_1j9pkom1-3-5-0";

package/charts/categorical-bar/components/interactions/overlays/CategoricalBarChartInspectOverlay.css

@@ -1,9 +1,9 @@
-._1wi8enr0-3-4-0 {
+._1wi8enr0-3-5-0 {
   cursor: crosshair;
   overflow: visible;
   z-index: 1;
 }
-._1wi8enr1-3-4-0 {
+._1wi8enr1-3-5-0 {
   top: -7px;
   left: -7px;
   width: calc(100% + 14px);

package/charts/categorical-bar/components/interactions/overlays/CategoricalBarChartInspectOverlay.sty.js

@@ -23,5 +23,5 @@ __export(CategoricalBarChartInspectOverlay_css_exports, {
 module.exports = __toCommonJS(CategoricalBarChartInspectOverlay_css_exports);
 var import_ChartGrid_css_ts_vanilla = require("../../../../core/components/chart-grid/ChartGrid.css");
 var import_CategoricalBarChartInspectOverlay_css_ts_vanilla = require("./CategoricalBarChartInspectOverlay.css");
-var crosshairLayout = "_1wi8enr0-3-4-0 _13lzg4k0-3-4-0";
-var dataPointLayout = "_1wi8enr1-3-4-0 _13lzg4k0-3-4-0";
+var crosshairLayout = "_1wi8enr0-3-5-0 _13lzg4k0-3-5-0";
+var dataPointLayout = "_1wi8enr1-3-5-0 _13lzg4k0-3-5-0";

package/charts/core/components/annotations/AnnotationsAtom.css

@@ -1,3 +1,3 @@
-._145zb630-3-4-0 {
+._145zb630-3-5-0 {
   position: relative;
 }

package/charts/core/components/annotations/AnnotationsAtom.sty.js

@@ -21,4 +21,4 @@ __export(AnnotationsAtom_css_exports, {
 });
 module.exports = __toCommonJS(AnnotationsAtom_css_exports);
 var import_AnnotationsAtom_css_ts_vanilla = require("./AnnotationsAtom.css");
-var wrapper = "_145zb630-3-4-0";
+var wrapper = "_145zb630-3-5-0";

package/charts/core/components/annotations/components/canvas/AnnotationsCanvasLayout.css

@@ -1,4 +1,4 @@
-._1yc349j0-3-4-0 {
+._1yc349j0-3-5-0 {
   position: absolute;
   top: 0;
   left: 0;

package/charts/core/components/annotations/components/canvas/AnnotationsCanvasLayout.sty.js

@@ -21,4 +21,4 @@ __export(AnnotationsCanvasLayout_css_exports, {
 });
 module.exports = __toCommonJS(AnnotationsCanvasLayout_css_exports);
 var import_AnnotationsCanvasLayout_css_ts_vanilla = require("./AnnotationsCanvasLayout.css");
-var canvasContainer = "_1yc349j0-3-4-0";
+var canvasContainer = "_1yc349j0-3-5-0";

package/charts/core/components/annotations/components/overlays/AnnotationsOverlays.css

@@ -1,4 +1,4 @@
-._107efci0-3-4-0 {
+._107efci0-3-5-0 {
   position: absolute;
   top: 0;
 }

package/charts/core/components/annotations/components/overlays/AnnotationsOverlays.sty.js

@@ -21,4 +21,4 @@ __export(AnnotationsOverlays_css_exports, {
 });
 module.exports = __toCommonJS(AnnotationsOverlays_css_exports);
 var import_AnnotationsOverlays_css_ts_vanilla = require("./AnnotationsOverlays.css");
-var annotationsOverlay = "_107efci0-3-4-0";
+var annotationsOverlay = "_107efci0-3-5-0";

package/charts/core/components/annotations/components/overlays/AnnotationsScrollWrapper.css

@@ -1,4 +1,4 @@
-._uzgvu30-3-4-0 {
+._uzgvu30-3-5-0 {
   position: relative;
   overflow-x: hidden;
   overflow-y: auto;

package/charts/core/components/annotations/components/overlays/AnnotationsScrollWrapper.sty.js

@@ -21,4 +21,4 @@ __export(AnnotationsScrollWrapper_css_exports, {
 });
 module.exports = __toCommonJS(AnnotationsScrollWrapper_css_exports);
 var import_AnnotationsScrollWrapper_css_ts_vanilla = require("./AnnotationsScrollWrapper.css");
-var scrollWrapper = "_uzgvu30-3-4-0";
+var scrollWrapper = "_uzgvu30-3-5-0";

package/charts/core/components/annotations/components/tooltip/AnnotationsTooltip.css

@@ -1,4 +1,4 @@
-._1lrb03s0-3-4-0 {
+._1lrb03s0-3-5-0 {
   min-width: 225px;
   max-width: 480px;
 }

package/charts/core/components/annotations/components/tooltip/AnnotationsTooltip.sty.js

@@ -21,4 +21,4 @@ __export(AnnotationsTooltip_css_exports, {
 });
 module.exports = __toCommonJS(AnnotationsTooltip_css_exports);
 var import_AnnotationsTooltip_css_ts_vanilla = require("./AnnotationsTooltip.css");
-var tooltipContentContainer = "_1lrb03s0-3-4-0";
+var tooltipContentContainer = "_1lrb03s0-3-5-0";

package/charts/core/components/annotations/types/numerical-annotations-config.d.ts

@@ -0,0 +1,16 @@
+import { type ReactNode } from 'react';
+import type { AnnotationsMarkerConfig, BaseMarkerProps, NumericalMarkerProps } from './annotations-marker-props.js';
+import type { AnnotationsTrackConfig } from './annotations-track-props.js';
+import type { IndicatorsDisplay } from '../components/indicators/types.js';
+/** @internal */
+export type NumericalAnnotationsMarkerConfig = AnnotationsMarkerConfig & NumericalMarkerProps & {
+    indicatorsDisplay?: IndicatorsDisplay;
+};
+/** @internal */
+export type NumericalAnnotationsTrackConfig = AnnotationsTrackConfig & {
+    markers: NumericalAnnotationsMarkerConfig[];
+    annotationsActions?: (annotation: BaseMarkerProps & NumericalMarkerProps & {
+        indicatorsDisplay?: IndicatorsDisplay;
+    }) => ReactNode;
+    indicatorsDisplay?: IndicatorsDisplay;
+};

package/charts/core/components/annotations/types/numerical-annotations-config.js

@@ -0,0 +1,15 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var numerical_annotations_config_exports = {};
+module.exports = __toCommonJS(numerical_annotations_config_exports);

package/charts/core/components/axes/Axis.css

@@ -1,4 +1,4 @@
-._90oaxp0-3-4-0 {
+._90oaxp0-3-5-0 {
   display: block;
   overflow: visible;
 }

package/charts/core/components/axes/Axis.sty.js

@@ -21,4 +21,4 @@ __export(Axis_css_exports, {
 });
 module.exports = __toCommonJS(Axis_css_exports);
 var import_Axis_css_ts_vanilla = require("./Axis.css");
-var axis = "_90oaxp0-3-4-0";
+var axis = "_90oaxp0-3-5-0";

package/charts/core/components/axes/components/PanningControls/PanningControls.css

@@ -1,4 +1,4 @@
-@keyframes _3rbllj2-3-4-0 {
+@keyframes _3rbllj2-3-5-0 {
   0% {
     transform: translateX(-4px);
     opacity: 0.2;
@@ -8,7 +8,7 @@
     opacity: 1;
   }
 }
-@keyframes _3rbllj3-3-4-0 {
+@keyframes _3rbllj3-3-5-0 {
   0% {
     transform: translateX(4px);
     opacity: 0.2;
@@ -18,7 +18,7 @@
     opacity: 1;
   }
 }
-._3rbllj4-3-4-0 {
+._3rbllj4-3-5-0 {
   opacity: 0;
   height: 100%;
   position: absolute;
@@ -34,29 +34,29 @@
   animation-delay: 0.2s;
   animation-fill-mode: forwards;
 }
-._3rbllj5-3-4-0 {
+._3rbllj5-3-5-0 {
   left: 0;
-  animation-name: _3rbllj2-3-4-0;
+  animation-name: _3rbllj2-3-5-0;
 }
-._3rbllj6-3-4-0 {
+._3rbllj6-3-5-0 {
   right: 0;
-  animation-name: _3rbllj3-3-4-0;
+  animation-name: _3rbllj3-3-5-0;
 }
-._3rbllj7-3-4-0 {
+._3rbllj7-3-5-0 {
   color: var(--dt-colors-icon-neutral-subdued, #595a7d);
 }
-._3rbllj7-3-4-0:hover {
+._3rbllj7-3-5-0:hover {
   color: var(--dt-colors-icon-neutral-subdued-hover, #434465);
 }
-._3rbllj7-3-4-0:active {
+._3rbllj7-3-5-0:active {
   color: var(--dt-colors-icon-neutral-subdued-active, #2f2f4f);
 }
-._3rbllj5-3-4-0 ~ div {
-  --_3rbllj0-3-4-0: rgba(0, 0, 0, 0) 12px, rgba(0, 0, 0, 1) 40px;
+._3rbllj5-3-5-0 ~ div {
+  --_3rbllj0-3-5-0: rgba(0, 0, 0, 0) 12px, rgba(0, 0, 0, 1) 40px;
 }
-._3rbllj6-3-4-0 ~ div {
-  --_3rbllj1-3-4-0: rgba(0, 0, 0, 1) calc(100% - 40px), rgba(0, 0, 0, 0) calc(100% - 12px);
+._3rbllj6-3-5-0 ~ div {
+  --_3rbllj1-3-5-0: rgba(0, 0, 0, 1) calc(100% - 40px), rgba(0, 0, 0, 0) calc(100% - 12px);
 }
-._3rbllj4-3-4-0 ~ div {
-  mask: linear-gradient(90deg, var(--_3rbllj0-3-4-0, rgba(0,0,0,1) 0%), var(--_3rbllj1-3-4-0, rgba(0,0,0,1) 0%));
+._3rbllj4-3-5-0 ~ div {
+  mask: linear-gradient(90deg, var(--_3rbllj0-3-5-0, rgba(0,0,0,1) 0%), var(--_3rbllj1-3-5-0, rgba(0,0,0,1) 0%));
 }

package/charts/core/components/axes/components/PanningControls/PanningControls.sty.js

@@ -23,5 +23,5 @@ __export(PanningControls_css_exports, {
 module.exports = __toCommonJS(PanningControls_css_exports);
 var import_PanningControls_css_ts_vanilla = require("./PanningControls.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var panningArrow = "_3rbllj7-3-4-0";
-var panningButtons = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_3rbllj4-3-4-0", variantClassNames: { direction: { toLeft: "_3rbllj5-3-4-0", toRight: "_3rbllj6-3-4-0" } }, defaultVariants: {}, compoundVariants: [] });
+var panningArrow = "_3rbllj7-3-5-0";
+var panningButtons = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_3rbllj4-3-5-0", variantClassNames: { direction: { toLeft: "_3rbllj5-3-5-0", toRight: "_3rbllj6-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });

package/charts/core/components/chart-grid/ChartGrid.css

@@ -1,13 +1,13 @@
-._13lzg4k0-3-4-0 {
+._13lzg4k0-3-5-0 {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
 }
-._13lzg4k1-3-4-0 {
+._13lzg4k1-3-5-0 {
   box-sizing: content-box;
 }
-._13lzg4k2-3-4-0 {
+._13lzg4k2-3-5-0 {
   position: relative;
 }

package/charts/core/components/chart-grid/ChartGrid.sty.js

@@ -23,6 +23,6 @@ __export(ChartGrid_css_exports, {
 });
 module.exports = __toCommonJS(ChartGrid_css_exports);
 var import_ChartGrid_css_ts_vanilla = require("./ChartGrid.css");
-var area = "_13lzg4k1-3-4-0";
-var plot = "_13lzg4k2-3-4-0";
-var plotLayout = "_13lzg4k0-3-4-0";
+var area = "_13lzg4k1-3-5-0";
+var plot = "_13lzg4k2-3-5-0";
+var plotLayout = "_13lzg4k0-3-5-0";

package/charts/core/components/chart-layout/components/styles.css

@@ -1,46 +1,46 @@
-._l1klj80-3-4-0 {
+._l1klj80-3-5-0 {
   min-width: 0;
   grid-area: graphArea;
 }
-._l1klj81-3-4-0 {
+._l1klj81-3-5-0 {
   filter: opacity(40%);
   pointer-events: none;
 }
-._l1klj83-3-4-0 {
+._l1klj83-3-5-0 {
   height: inherit;
   grid-area: horizontalResize;
 }
-._l1klj84-3-4-0 {
+._l1klj84-3-5-0 {
   width: 100%;
   grid-area: verticalResize;
 }
-._l1klj85-3-4-0 {
+._l1klj85-3-5-0 {
   filter: opacity(40%);
   pointer-events: none;
 }
-._l1klj86-3-4-0 {
+._l1klj86-3-5-0 {
   height: 100%;
 }
-._l1klj87-3-4-0 {
+._l1klj87-3-5-0 {
   grid-area: verticalLegend;
 }
-._l1klj88-3-4-0 {
+._l1klj88-3-5-0 {
   grid-area: horizontalLegend;
 }
-._l1klj89-3-4-0 {
+._l1klj89-3-5-0 {
   filter: opacity(40%);
   pointer-events: none;
 }
-._l1klj8a-3-4-0 {
+._l1klj8a-3-5-0 {
   background: var(--dt-colors-border-neutral-default, #dadbe4);
   background-color: var(--dt-colors-border-neutral-accent, #595a7d);
   border-radius: var(--dt-spacings-size-8, 8px);
   touch-action: none;
 }
-._l1klj8a-3-4-0:hover {
+._l1klj8a-3-5-0:hover {
   background: var(--dt-colors-border-primary-accent, #464cce);
 }
-._l1klj8b-3-4-0 {
+._l1klj8b-3-5-0 {
   transition: height var(--dt-timings-base-default, 300ms) var(--dt-easings-fast-in-slow-out, cubic-bezier(0.4, 0, 0.2, 1));
   height: 36px;
   width: 2px;
@@ -49,11 +49,11 @@
   grid-area: horizontalResize;
   align-self: center;
 }
-._l1klj8b-3-4-0:hover {
+._l1klj8b-3-5-0:hover {
   height: var(--dt-spacings-size-48, 48px);
   background-color: var(--dt-colors-border-neutral-accent-hover, #434465);
 }
-._l1klj8c-3-4-0 {
+._l1klj8c-3-5-0 {
   transition: width var(--dt-timings-base-default, 300ms) var(--dt-easings-fast-in-slow-out, cubic-bezier(0.4, 0, 0.2, 1));
   height: 2px;
   width: 36px;
@@ -62,7 +62,7 @@
   grid-area: verticalResize;
   align-self: flex-end;
 }
-._l1klj8c-3-4-0:hover {
+._l1klj8c-3-5-0:hover {
   width: var(--dt-spacings-size-48, 48px);
   background-color: var(--dt-colors-border-neutral-accent-hover, #434465);
 }

package/charts/core/components/chart-layout/components/styles.sty.js

@@ -25,7 +25,7 @@ __export(styles_css_exports, {
 module.exports = __toCommonJS(styles_css_exports);
 var import_styles_css_ts_vanilla = require("./styles.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var graphContainer = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_l1klj80-3-4-0", variantClassNames: { loading: { true: "_l1klj81-3-4-0" } }, defaultVariants: {}, compoundVariants: [] });
-var legendContainer = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_l1klj86-3-4-0", variantClassNames: { orientation: { horizontal: "_l1klj87-3-4-0", vertical: "_l1klj88-3-4-0" }, loading: { true: "_l1klj89-3-4-0" } }, defaultVariants: {}, compoundVariants: [] });
-var legendResizeLine = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_l1klj8a-3-4-0", variantClassNames: { orientation: { horizontal: "_l1klj8b-3-4-0", vertical: "_l1klj8c-3-4-0" } }, defaultVariants: {}, compoundVariants: [] });
-var resizeContainer = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_l1klj82-3-4-0", variantClassNames: { orientation: { horizontal: "_l1klj83-3-4-0", vertical: "_l1klj84-3-4-0" }, loading: { true: "_l1klj85-3-4-0" } }, defaultVariants: {}, compoundVariants: [] });
+var graphContainer = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_l1klj80-3-5-0", variantClassNames: { loading: { true: "_l1klj81-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });
+var legendContainer = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_l1klj86-3-5-0", variantClassNames: { orientation: { horizontal: "_l1klj87-3-5-0", vertical: "_l1klj88-3-5-0" }, loading: { true: "_l1klj89-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });
+var legendResizeLine = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_l1klj8a-3-5-0", variantClassNames: { orientation: { horizontal: "_l1klj8b-3-5-0", vertical: "_l1klj8c-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });
+var resizeContainer = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_l1klj82-3-5-0", variantClassNames: { orientation: { horizontal: "_l1klj83-3-5-0", vertical: "_l1klj84-3-5-0" }, loading: { true: "_l1klj85-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });

package/charts/core/components/chart-layout/context/ChartLayoutOrientation.context.js

@@ -21,7 +21,7 @@ __export(ChartLayoutOrientation_context_exports, {
 });
 module.exports = __toCommonJS(ChartLayoutOrientation_context_exports);
 var import_react = require("react");
-var import_constants = require("../types/constants.js");
+var import_constants = require("../../../constants.js");
 const ChartLayoutOrientationContext = (0, import_react.createContext)({
   orientation: import_constants.ORIENTATION.Vertical
 });

package/charts/core/components/chart-layout/hooks/useAutomaticRatio.js

@@ -21,9 +21,9 @@ __export(useAutomaticRatio_exports, {
 });
 module.exports = __toCommonJS(useAutomaticRatio_exports);
 var import_react = require("react");
-var import_constants = require("../../legend/categorical/constants.js");
-var import_constants2 = require("../../legend/range/constants.js");
-var import_constants3 = require("../types/constants.js");
+var import_constants = require("../../../constants.js");
+var import_constants2 = require("../../legend/categorical/constants.js");
+var import_constants3 = require("../../legend/range/constants.js");
 var import_automatic_ratio = require("../utils/automatic-ratio.js");
 const useAutomaticRatio = (orientation, ratio, containerAvailableArea) => {
   const [readyForAutoRatio, setReadyForAutoRatio] = (0, import_react.useState)(false);
@@ -50,24 +50,24 @@ const useAutomaticRatio = (orientation, ratio, containerAvailableArea) => {
       }
       let longestSeries;
       const isCategoricalLegend = Array.from(node.classList).includes(
-        import_constants.CATEGORICAL_LEGEND_CLASS
+        import_constants2.CATEGORICAL_LEGEND_CLASS
       );
       const isRangeLegend = Array.from(node.classList).includes(
-        import_constants2.RANGE_LEGEND_CLASS
+        import_constants3.RANGE_LEGEND_CLASS
       );
       if (isCategoricalLegend) {
-        longestSeries = orientation === import_constants3.ORIENTATION.Horizontal ? (0, import_automatic_ratio.getMaxItemSizeForCategoricalHorizontal)(node, containerHeight) : (0, import_automatic_ratio.getSizeForCategoricaVertical)();
+        longestSeries = orientation === import_constants.ORIENTATION.Horizontal ? (0, import_automatic_ratio.getMaxItemSizeForCategoricalHorizontal)(node, containerHeight) : (0, import_automatic_ratio.getSizeForCategoricaVertical)();
       }
       if (isRangeLegend) {
         const hasLoadedLabels = node.getElementsByTagName("g").length !== 0;
         if (!hasLoadedLabels) {
           return;
         }
-        longestSeries = orientation === import_constants3.ORIENTATION.Horizontal ? (0, import_automatic_ratio.getMaxLabelForRangeHorizontal)(node) : (0, import_automatic_ratio.getLabelsHeightForRangeBottom)(node);
+        longestSeries = orientation === import_constants.ORIENTATION.Horizontal ? (0, import_automatic_ratio.getMaxLabelForRangeHorizontal)(node) : (0, import_automatic_ratio.getLabelsHeightForRangeBottom)(node);
       }
       if (!readyForAutoRatio) {
         setIdealLegendSize(
-          longestSeries !== void 0 && longestSeries > 0 ? longestSeries : import_constants.MIN_ITEM_WIDTH
+          longestSeries !== void 0 && longestSeries > 0 ? longestSeries : import_constants2.MIN_ITEM_WIDTH
         );
         setReadyForAutoRatio(true);
       }

package/charts/core/components/chart-layout/types/constants.d.ts

@@ -1,6 +1,4 @@
 import { ChartLayoutLegendSizes, LegendProps } from './chart-layout.js';
-import type { Orientation } from '../../../../../core/types/orientation.js';
-import type { MappedObject } from '../../../types/helpers/mapped-object.js';
 import { LegendPosition } from '../../../types/legend.js';
 export declare const DEFAULT_POSITION: LegendPosition;
 export declare const DEFAULT_RATIO_BOUNDARIES: ChartLayoutLegendSizes;
@@ -13,7 +11,6 @@ export declare const MAX_AUTO_RATIO_SIZE = 0.3;
 export declare const MIN_LEGEND_HEIGHT = 30;
 export declare const MIN_LEGEND_WIDTH = 70;
 export declare const MIN_PLOT_SIZE = 100;
-export declare const ORIENTATION: MappedObject<Orientation>;
 export declare const TEMPLATE_AREA_FOR_GRAPH = "\"graphArea\"";
 export declare const TEMPLATE_AREA_FOR_RESIZABLE_CHART_LAYOUT = "\"graphArea horizontalResize verticalLegend\" \"verticalResize . .\" \"horizontalLegend horizontalLegend horizontalLegend\"";
 export declare const TEMPLATE_AREA_FOR_FIXED_CHART_LAYOUT = "\"graphArea verticalLegend\" \"horizontalLegend horizontalLegend\"";

package/charts/core/components/chart-layout/types/constants.js

@@ -28,7 +28,6 @@ __export(constants_exports, {
   MIN_LEGEND_HEIGHT: () => MIN_LEGEND_HEIGHT,
   MIN_LEGEND_WIDTH: () => MIN_LEGEND_WIDTH,
   MIN_PLOT_SIZE: () => MIN_PLOT_SIZE,
-  ORIENTATION: () => ORIENTATION,
   TEMPLATE_AREA_FOR_FIXED_CHART_LAYOUT: () => TEMPLATE_AREA_FOR_FIXED_CHART_LAYOUT,
   TEMPLATE_AREA_FOR_GRAPH: () => TEMPLATE_AREA_FOR_GRAPH,
   TEMPLATE_AREA_FOR_RESIZABLE_CHART_LAYOUT: () => TEMPLATE_AREA_FOR_RESIZABLE_CHART_LAYOUT
@@ -56,10 +55,6 @@ const MAX_AUTO_RATIO_SIZE = 0.3;
 const MIN_LEGEND_HEIGHT = 30;
 const MIN_LEGEND_WIDTH = 70;
 const MIN_PLOT_SIZE = 100;
-const ORIENTATION = {
-  Horizontal: "horizontal",
-  Vertical: "vertical"
-};
 const TEMPLATE_AREA_FOR_GRAPH = '"graphArea"';
 const TEMPLATE_AREA_FOR_RESIZABLE_CHART_LAYOUT = '"graphArea horizontalResize verticalLegend" "verticalResize . ." "horizontalLegend horizontalLegend horizontalLegend"';
 const TEMPLATE_AREA_FOR_FIXED_CHART_LAYOUT = '"graphArea verticalLegend" "horizontalLegend horizontalLegend"';

package/charts/core/components/chart-layout/utils/get-areas-size-on-drag.js

@@ -22,9 +22,10 @@ __export(get_areas_size_on_drag_exports, {
 });
 module.exports = __toCommonJS(get_areas_size_on_drag_exports);
 var import_calculate_graph_size = require("./calculate-graph-size.js");
-var import_constants = require("../types/constants.js");
+var import_constants = require("../../../constants.js");
+var import_constants2 = require("../types/constants.js");
 const getAreasWidthSize = (containerHeight, containerWidth, minWidth, maxWidth, resizerWrapperSize, draggedAmount, legendContainer) => {
-  const minLegendWidth = Math.min(containerWidth * minWidth, import_constants.MIN_LEGEND_WIDTH);
+  const minLegendWidth = Math.min(containerWidth * minWidth, import_constants2.MIN_LEGEND_WIDTH);
   if (legendContainer.clientWidth - draggedAmount <= minLegendWidth) {
     const legend = {
       height: containerHeight,
@@ -43,7 +44,7 @@ const getAreasWidthSize = (containerHeight, containerWidth, minWidth, maxWidth,
   const availableWidth = containerWidth - resizerWrapperSize;
   const maxWidthAllowed = Math.max(
     availableWidth * maxWidth,
-    availableWidth - import_constants.MIN_PLOT_SIZE
+    availableWidth - import_constants2.MIN_PLOT_SIZE
   );
   if (legendContainer.clientWidth - draggedAmount >= maxWidthAllowed) {
     const legend = {
@@ -64,7 +65,7 @@ const getAreasWidthSize = (containerHeight, containerWidth, minWidth, maxWidth,
 const getAreasHeightSize = (containerHeight, containerWidth, minHeight, maxHeight, resizerWrapperSize, draggedAmount, legendContainer) => {
   const minLegendHeight = Math.min(
     containerHeight * minHeight,
-    import_constants.MIN_LEGEND_HEIGHT
+    import_constants2.MIN_LEGEND_HEIGHT
   );
   if (legendContainer.clientHeight - draggedAmount <= minLegendHeight) {
     const legend = {
@@ -84,7 +85,7 @@ const getAreasHeightSize = (containerHeight, containerWidth, minHeight, maxHeigh
   const availableHeight = containerHeight - resizerWrapperSize;
   const maxHeightAllowed = Math.max(
     availableHeight * maxHeight,
-    availableHeight - import_constants.MIN_PLOT_SIZE
+    availableHeight - import_constants2.MIN_PLOT_SIZE
   );
   if (legendContainer.clientHeight - draggedAmount >= maxHeightAllowed) {
     const legend = {

package/charts/core/components/chart-layout/utils/get-chart-layout-settings.js

@@ -37,7 +37,7 @@ const getChartLayoutSettings = (containerSizes, children, isEmpty) => {
       graphArea,
       containerAvailableArea,
       legendSettings: {
-        orientation: import_constants2.ORIENTATION.Vertical,
+        orientation: import_constants.ORIENTATION.Vertical,
         showResizer: false,
         hidden: true,
         ratio: 0,