@dynatrace/strato-components 3.5.2 → 3.6.0

package/charts/xy-chart-adoption/timeseries/utils/render-series.js

@@ -0,0 +1,60 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+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 render_series_exports = {};
+__export(render_series_exports, {
+  defineAxisId: () => defineAxisId,
+  renderAreaSeries: () => renderAreaSeries,
+  renderBandSeries: () => renderBandSeries,
+  renderBarSeries: () => renderBarSeries,
+  renderLineSeries: () => renderLineSeries,
+  xAxisId: () => xAxisId
+});
+module.exports = __toCommonJS(render_series_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_get_unit_as_string = require("../../../core/utils/get-unit-as-string.js");
+var import_XYChartRoot = require("../../../xy-chart/XYChartRoot.js");
+const xAxisId = "x-axis";
+const defineAxisId = (unit) => `y-axis-${(0, import_get_unit_as_string.getUnitAsString)(unit)}`;
+const baseSeriesProps = ({ data, unit, seriesId }) => ({
+  data,
+  xAxisId,
+  yAxisId: defineAxisId(unit),
+  x0Accessor: "start",
+  x1Accessor: "end",
+  seriesIdAccessor: "seriesId",
+  nameAccessor: "seriesName",
+  key: seriesId
+});
+const renderLineSeries = (series) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.LineSeries, { ...baseSeriesProps(series), y0Accessor: "value" });
+const renderAreaSeries = (series) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_XYChartRoot.XYChart.AreaSeries, { ...baseSeriesProps(series), y1Accessor: "value" });
+const renderBarSeries = (series) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  import_XYChartRoot.XYChart.BarSeries,
+  {
+    ...baseSeriesProps(series),
+    variant: "stack",
+    y1Accessor: "value"
+  }
+);
+const renderBandSeries = (series) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  import_XYChartRoot.XYChart.AreaSeries,
+  {
+    ...baseSeriesProps(series),
+    y0Accessor: "y0",
+    y1Accessor: "y1"
+  }
+);

package/content/accordion/Accordion.css

@@ -1,45 +1,45 @@
-._12zc70k0-3-5-2 {
+._12zc70k0-3-6-0 {
   width: 100%;
-  color: var(--_bx32h0-3-5-2);
+  color: var(--_bx32h0-3-6-0);
 }
-._12zc70k1-3-5-2 {
+._12zc70k1-3-6-0 {
   margin: var(--dt-spacings-size-8, 8px) 0;
 }
-._12zc70k2-3-5-2 {
+._12zc70k2-3-6-0 {
   margin: var(--dt-spacings-size-4, 4px) 0;
 }
-._12zc70k3-3-5-2 {
+._12zc70k3-3-6-0 {
   transition-duration: var(--dt-animations-expand-collapse-duration-fast, 250ms);
   transition-timing-function: var(--dt-animations-expand-collapse-easing, cubic-bezier(0.4, 0, 0.2, 1));
   transition-property: transform;
 }
-._12zc70k4-3-5-2 {
+._12zc70k4-3-6-0 {
   transform: rotate(-90deg);
 }
-._12zc70k5-3-5-2 {
+._12zc70k5-3-6-0 {
   transform: rotate(90deg);
 }
-._12zc70k6-3-5-2 {
+._12zc70k6-3-6-0 {
   transform: rotate(0);
 }
-._12zc70k7-3-5-2 {
+._12zc70k7-3-6-0 {
   box-sizing: border-box;
   transform-origin: top center;
   display: flex;
 }
-._12zc70k8-3-5-2 {
+._12zc70k8-3-6-0 {
   width: 100%;
   box-sizing: border-box;
-  color: var(--_bx32h0-3-5-2);
+  color: var(--_bx32h0-3-6-0);
 }
-._12zc70k9-3-5-2 {
+._12zc70k9-3-6-0 {
   padding-top: var(--dt-spacings-size-8, 8px);
 }
-._12zc70ka-3-5-2 {
+._12zc70ka-3-6-0 {
   padding-top: var(--dt-spacings-size-4, 4px);
 }
 @media (prefers-reduced-motion) {
-  ._12zc70k3-3-5-2 {
+  ._12zc70k3-3-6-0 {
     transition-duration: 0s;
   }
 }

package/content/accordion/Accordion.sty.js

@@ -31,11 +31,11 @@ var import_AppRoot_css_ts_vanilla = require("../../core/components/app-root/AppR
 var import_field_css_ts_vanilla = require("../../styles/field.css");
 var import_Accordion_css_ts_vanilla = require("./Accordion.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var accordionContentCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_12zc70k8-3-5-2", variantClassNames: { size: { "default": "_12zc70k9-3-5-2", condensed: "_12zc70ka-3-5-2" } }, defaultVariants: {}, compoundVariants: [] });
-var accordionContentWrapperCSS = "_12zc70k7-3-5-2";
-var accordionDividerMarginCSS = { "default": "_12zc70k1-3-5-2", condensed: "_12zc70k2-3-5-2" };
-var accordionLabelCSS = "_12zc70k0-3-5-2";
-var accordionTriggerIconCSS = "_12zc70k3-3-5-2";
-var accordionTriggerIconEndCSS = "_12zc70k5-3-5-2";
-var accordionTriggerIconExpandedCSS = "_12zc70k6-3-5-2";
-var accordionTriggerIconStartCSS = "_12zc70k4-3-5-2";
+var accordionContentCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_12zc70k8-3-6-0", variantClassNames: { size: { "default": "_12zc70k9-3-6-0", condensed: "_12zc70ka-3-6-0" } }, defaultVariants: {}, compoundVariants: [] });
+var accordionContentWrapperCSS = "_12zc70k7-3-6-0";
+var accordionDividerMarginCSS = { "default": "_12zc70k1-3-6-0", condensed: "_12zc70k2-3-6-0" };
+var accordionLabelCSS = "_12zc70k0-3-6-0";
+var accordionTriggerIconCSS = "_12zc70k3-3-6-0";
+var accordionTriggerIconEndCSS = "_12zc70k5-3-6-0";
+var accordionTriggerIconExpandedCSS = "_12zc70k6-3-6-0";
+var accordionTriggerIconStartCSS = "_12zc70k4-3-6-0";

package/content/ai-loading-indicator/AiLoadingIndicator.css

@@ -1,4 +1,4 @@
-@keyframes _1te6oqj4-3-5-2 {
+@keyframes _1te6oqj4-3-6-0 {
   0% {
     background-position: 20% 0%;
   }
@@ -6,27 +6,27 @@
     background-position: -120% 100%;
   }
 }
-._1te6oqj5-3-5-2 {
-  --_1te6oqj0-3-5-2: #CB53F6;
-  --_1te6oqj1-3-5-2: #7FF8F9;
-  --_1te6oqj2-3-5-2: 15%;
-  --_1te6oqj3-3-5-2: 5%;
+._1te6oqj5-3-6-0 {
+  --_1te6oqj0-3-6-0: #CB53F6;
+  --_1te6oqj1-3-6-0: #7FF8F9;
+  --_1te6oqj2-3-6-0: 15%;
+  --_1te6oqj3-3-6-0: 5%;
   position: relative;
-  background-image: linear-gradient(90deg, transparent 0%, transparent 5%, var(--dt-colors-text-neutral-default, #2f2f4f) 10%, var(--dt-colors-text-neutral-default, #2f2f4f) 90%, transparent 95%, transparent 100%), linear-gradient(var(--_1te6oqj0-3-5-2) 0%, var(--_1te6oqj1-3-5-2) 100%);
+  background-image: linear-gradient(90deg, transparent 0%, transparent 5%, var(--dt-colors-text-neutral-default, #2f2f4f) 10%, var(--dt-colors-text-neutral-default, #2f2f4f) 90%, transparent 95%, transparent 100%), linear-gradient(var(--_1te6oqj0-3-6-0) 0%, var(--_1te6oqj1-3-6-0) 100%);
   background-size: 200% 600%;
   background-position: 0% 0%;
   background-clip: text;
   color: transparent;
-  animation-name: _1te6oqj4-3-5-2;
+  animation-name: _1te6oqj4-3-6-0;
   animation-duration: var(--dt-timings-slowest-gentle, 1500ms);
   animation-iteration-count: infinite;
   animation-timing-function: var(--dt-easings-fast-in-slow-out, cubic-bezier(0.4, 0, 0.2, 1));
 }
-._1te6oqj6-3-5-2 {
+._1te6oqj6-3-6-0 {
   padding-top: calc(var(--dt-spacings-size-20, 20px) / 2 - 0.5lh);
   min-width: 0;
 }
-._1te6oqj7-3-5-2 {
+._1te6oqj7-3-6-0 {
   width: var(--dt-spacings-size-20, 20px);
   min-height: 1lh;
   display: flex;
@@ -34,12 +34,12 @@
   align-items: center;
   flex-shrink: 0;
 }
-._1te6oqj7-3-5-2 svg {
+._1te6oqj7-3-6-0 svg {
   display: block;
   width: var(--dt-spacings-size-20, 20px);
   height: var(--dt-spacings-size-20, 20px);
 }
-._1te6oqj8-3-5-2 {
+._1te6oqj8-3-6-0 {
   display: inline-flex;
   align-items: center;
   vertical-align: middle;

package/content/ai-loading-indicator/AiLoadingIndicator.sty.js

@@ -24,7 +24,7 @@ __export(AiLoadingIndicator_css_exports, {
 });
 module.exports = __toCommonJS(AiLoadingIndicator_css_exports);
 var import_AiLoadingIndicator_css_ts_vanilla = require("./AiLoadingIndicator.css");
-var container = "_1te6oqj8-3-5-2";
-var iconWrapper = "_1te6oqj7-3-5-2";
-var label = "_1te6oqj6-3-5-2";
-var labelAnimation = "_1te6oqj5-3-5-2";
+var container = "_1te6oqj8-3-6-0";
+var iconWrapper = "_1te6oqj7-3-6-0";
+var label = "_1te6oqj6-3-6-0";
+var labelAnimation = "_1te6oqj5-3-6-0";

package/content/ai-response/AiResponse.css

@@ -6,20 +6,20 @@
     opacity: 1;
   }
 }
-._jdyvf80-3-5-2 {
+._jdyvf80-3-6-0 {
   word-break: normal;
   overflow-wrap: anywhere;
 }
-._jdyvf80-3-5-2 [data-sd-animate]:not(table [data-sd-animate]) {
+._jdyvf80-3-6-0 [data-sd-animate]:not(table [data-sd-animate]) {
   animation: var(--sd-animation, sd-aiResponseAnimation) var(--sd-duration, 200ms) var(--sd-easing, ease) both;
 }
-._jdyvf80-3-5-2 ._17pa72a0-3-5-2 {
+._jdyvf80-3-6-0 ._17pa72a0-3-6-0 {
   margin-bottom: calc(var(--dt-spacings-size-12, 12px) + var(--dt-spacings-size-2, 2px));
   margin-top: calc(var(--dt-spacings-size-12, 12px) + var(--dt-spacings-size-2, 2px));
 }
-._jdyvf81-3-5-2 > :first-child {
+._jdyvf81-3-6-0 > :first-child {
   margin-top: 0;
 }
-._jdyvf81-3-5-2 > :last-child {
+._jdyvf81-3-6-0 > :last-child {
   margin-bottom: 0;
 }

package/content/ai-response/AiResponse.sty.js

@@ -24,5 +24,5 @@ module.exports = __toCommonJS(AiResponse_css_exports);
 var import_AppRoot_css_ts_vanilla = require("../../core/components/app-root/AppRoot.css");
 var import_CodeSnippet_css_ts_vanilla = require("../code-snippet/CodeSnippet.css");
 var import_AiResponse_css_ts_vanilla = require("./AiResponse.css");
-var streamdown = "_jdyvf81-3-5-2";
-var wrapper = "_jdyvf80-3-5-2";
+var streamdown = "_jdyvf81-3-6-0";
+var wrapper = "_jdyvf80-3-6-0";

package/content/avatar/Avatar.css

@@ -1,4 +1,4 @@
-._7llfy90-3-5-2 {
+._7llfy90-3-6-0 {
   cursor: default;
   box-sizing: border-box;
   border: 1px solid var(--dt-colors-border-neutral-default, #dadbe4);
@@ -11,19 +11,19 @@
   align-items: center;
   align-self: start;
 }
-._7llfy91-3-5-2 {
+._7llfy91-3-6-0 {
   min-width: var(--dt-spacings-size-20, 20px);
 }
-._7llfy92-3-5-2 {
+._7llfy92-3-6-0 {
   min-width: var(--dt-spacings-size-32, 32px);
 }
-._7llfy93-3-5-2 {
+._7llfy93-3-6-0 {
   border-color: var(--dt-colors-border-neutral-disabled, #dadbe480);
   background-color: var(--dt-colors-background-surface-default, #fff);
   color: var(--dt-colors-text-neutral-disabled, #595a7d80);
   z-index: 0;
 }
-._7llfy93-3-5-2:before {
+._7llfy93-3-6-0:before {
   content: "";
   aspect-ratio: 1/1;
   background-color: var(--dt-colors-background-field-neutral-disabled, #e4e5eb80);
@@ -32,36 +32,36 @@
   position: absolute;
   z-index: -1;
 }
-._7llfy94-3-5-2[tabindex]:hover, button._7llfy94-3-5-2:hover, a._7llfy94-3-5-2:hover, ._7llfy94-3-5-2:focus {
+._7llfy94-3-6-0[tabindex]:hover, button._7llfy94-3-6-0:hover, a._7llfy94-3-6-0:hover, ._7llfy94-3-6-0:focus {
   background-color: var(--dt-colors-background-field-neutral-accent-hover, #4d4e72);
   border-color: var(--dt-colors-border-neutral-default-hover, #d0d1dc);
   z-index: 1;
 }
-button._7llfy94-3-5-2:hover, a._7llfy94-3-5-2:hover, button._7llfy94-3-5-2:active, a._7llfy94-3-5-2:active {
+button._7llfy94-3-6-0:hover, a._7llfy94-3-6-0:hover, button._7llfy94-3-6-0:active, a._7llfy94-3-6-0:active {
   cursor: pointer;
   z-index: 1;
 }
-._7llfy94-3-5-2[tabindex]:active, button._7llfy94-3-5-2:active, a._7llfy94-3-5-2:active {
+._7llfy94-3-6-0[tabindex]:active, button._7llfy94-3-6-0:active, a._7llfy94-3-6-0:active {
   background-color: var(--dt-colors-background-field-neutral-accent-active, #404164);
   border-color: var(--dt-colors-border-neutral-default-active, #c6c7d5);
   z-index: 1;
 }
-._7llfy95-3-5-2:before {
+._7llfy95-3-6-0:before {
   min-width: var(--dt-spacings-size-20, 20px);
 }
-._7llfy96-3-5-2:before {
+._7llfy96-3-6-0:before {
   min-width: var(--dt-spacings-size-32, 32px);
 }
-._7llfy97-3-5-2 {
+._7llfy97-3-6-0 {
   padding: 0;
   margin: 0;
   border: none;
   background-color: transparent;
 }
-._7llfy98-3-5-2 {
+._7llfy98-3-6-0 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   overflow-wrap: break-word;
 }
-._7llfy99-3-5-2 ~ div > div {
+._7llfy99-3-6-0 ~ div > div {
   color: var(--dt-colors-text-neutral-disabled, #595a7d80);
 }

package/content/avatar/Avatar.sty.js

@@ -25,7 +25,7 @@ __export(Avatar_css_exports, {
 module.exports = __toCommonJS(Avatar_css_exports);
 var import_Avatar_css_ts_vanilla = require("./Avatar.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var avatarAbbreviationCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_7llfy90-3-5-2", variantClassNames: { size: { small: "_7llfy91-3-5-2", "default": "_7llfy92-3-5-2" }, disabled: { true: "_7llfy93-3-5-2", false: "_7llfy94-3-5-2" } }, defaultVariants: {}, compoundVariants: [[{ disabled: true, size: "small" }, "_7llfy95-3-5-2"], [{ disabled: true, size: "default" }, "_7llfy96-3-5-2"]] });
-var avatarDisabledCSS = "_7llfy99-3-5-2";
-var avatarSubtitleCSS = "_7llfy98-3-5-2";
-var avatarWrapperCSS = "_7llfy97-3-5-2";
+var avatarAbbreviationCSS = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_7llfy90-3-6-0", variantClassNames: { size: { small: "_7llfy91-3-6-0", "default": "_7llfy92-3-6-0" }, disabled: { true: "_7llfy93-3-6-0", false: "_7llfy94-3-6-0" } }, defaultVariants: {}, compoundVariants: [[{ disabled: true, size: "small" }, "_7llfy95-3-6-0"], [{ disabled: true, size: "default" }, "_7llfy96-3-6-0"]] });
+var avatarDisabledCSS = "_7llfy99-3-6-0";
+var avatarSubtitleCSS = "_7llfy98-3-6-0";
+var avatarWrapperCSS = "_7llfy97-3-6-0";

package/content/avatar-group/AvatarGroup.css

@@ -1,9 +1,9 @@
-._129un530-3-5-2 {
+._129un530-3-6-0 {
   display: flex;
 }
-._129un531-3-5-2 {
+._129un531-3-6-0 {
   margin-left: calc(var(--dt-spacings-size-4, 4px) * -1);
 }
-._129un531-3-5-2:first-child {
+._129un531-3-6-0:first-child {
   margin-left: var(--dt-spacings-size-0, 0);
 }

package/content/avatar-group/AvatarGroup.sty.js

@@ -22,5 +22,5 @@ __export(AvatarGroup_css_exports, {
 });
 module.exports = __toCommonJS(AvatarGroup_css_exports);
 var import_AvatarGroup_css_ts_vanilla = require("./AvatarGroup.css");
-var additionalAvatarWrapperCSS = "_129un530-3-5-2";
-var avatarGroupItemWrapperCSS = "_129un531-3-5-2";
+var additionalAvatarWrapperCSS = "_129un530-3-6-0";
+var avatarGroupItemWrapperCSS = "_129un531-3-6-0";

package/content/chip/BaseChip.css

@@ -1,12 +1,12 @@
-._1jgl8s50-3-5-2 ._1raebd90-3-5-2 {
+._1jgl8s50-3-6-0 ._1raebd90-3-6-0 {
   gap: 1px;
 }
-._1raebd91-3-5-2 {
+._1raebd91-3-6-0 {
   cursor: not-allowed;
 }
-._1raebd92-3-5-2 {
-  background: var(--_bx32h2-3-5-2);
-  color: var(--_bx32h0-3-5-2);
+._1raebd92-3-6-0 {
+  background: var(--_bx32h2-3-6-0);
+  color: var(--_bx32h0-3-6-0);
   position: relative;
   display: grid;
   grid: auto / auto-flow auto;
@@ -20,109 +20,109 @@
   transition-duration: var(--dt-animations-fade-out-duration-base, 250ms);
   transition-property: color, background-color, transform;
 }
-._1raebd92-3-5-2:is(button) {
+._1raebd92-3-6-0:is(button) {
   border: 0;
 }
-._1raebd93-3-5-2 {
+._1raebd93-3-6-0 {
   padding-left: var(--dt-spacings-size-4, 4px);
   padding-right: var(--dt-spacings-size-4, 4px);
   padding-top: var(--dt-spacings-size-2, 2px);
   padding-bottom: var(--dt-spacings-size-2, 2px);
   height: var(--dt-spacings-size-24, 24px);
 }
-._1raebd94-3-5-2 {
+._1raebd94-3-6-0 {
   padding-left: var(--dt-spacings-size-2, 2px);
   padding-right: var(--dt-spacings-size-2, 2px);
   padding-top: 0;
   padding-bottom: 0;
   height: var(--dt-spacings-size-20, 20px);
 }
-._1raebd95-3-5-2 {
+._1raebd95-3-6-0 {
   border-bottom-right-radius: 0;
   border-top-right-radius: 0;
 }
-._1raebd96-3-5-2 {
+._1raebd96-3-6-0 {
   border-bottom-right-radius: var(--dt-borders-radius-field-subdued, 3px);
   border-top-right-radius: var(--dt-borders-radius-field-subdued, 3px);
 }
-._1raebd97-3-5-2 {
+._1raebd97-3-6-0 {
   cursor: not-allowed;
   pointer-events: none;
 }
-._1raebd98-3-5-2:is(button) {
+._1raebd98-3-6-0:is(button) {
   cursor: pointer;
 }
-._1raebd9g-3-5-2[tabindex]:hover, button._1raebd9g-3-5-2:hover, a._1raebd9g-3-5-2:hover {
+._1raebd9g-3-6-0[tabindex]:hover, button._1raebd9g-3-6-0:hover, a._1raebd9g-3-6-0:hover {
   background: var(--dt-colors-background-field-neutral-accent-hover, #4d4e72);
 }
-._1raebd9g-3-5-2[tabindex]:active, button._1raebd9g-3-5-2:active, a._1raebd9g-3-5-2:active {
+._1raebd9g-3-6-0[tabindex]:active, button._1raebd9g-3-6-0:active, a._1raebd9g-3-6-0:active {
   background: var(--dt-colors-background-field-neutral-accent-active, #404164);
 }
-._1raebd9h-3-5-2[tabindex]:hover, button._1raebd9h-3-5-2:hover, a._1raebd9h-3-5-2:hover {
+._1raebd9h-3-6-0[tabindex]:hover, button._1raebd9h-3-6-0:hover, a._1raebd9h-3-6-0:hover {
   background: var(--dt-colors-background-field-primary-accent-hover, #3b3fbe);
 }
-._1raebd9h-3-5-2[tabindex]:active, button._1raebd9h-3-5-2:active, a._1raebd9h-3-5-2:active {
+._1raebd9h-3-6-0[tabindex]:active, button._1raebd9h-3-6-0:active, a._1raebd9h-3-6-0:active {
   background: var(--dt-colors-background-field-primary-accent-active, #312dad);
 }
-._1raebd9i-3-5-2[tabindex]:hover, button._1raebd9i-3-5-2:hover, a._1raebd9i-3-5-2:hover {
+._1raebd9i-3-6-0[tabindex]:hover, button._1raebd9i-3-6-0:hover, a._1raebd9i-3-6-0:hover {
   background: var(--dt-colors-background-field-success-accent-hover, #1f5a54);
 }
-._1raebd9i-3-5-2[tabindex]:active, button._1raebd9i-3-5-2:active, a._1raebd9i-3-5-2:active {
+._1raebd9i-3-6-0[tabindex]:active, button._1raebd9i-3-6-0:active, a._1raebd9i-3-6-0:active {
   background: var(--dt-colors-background-field-success-accent-active, #0d4c47);
 }
-._1raebd9j-3-5-2[tabindex]:hover, button._1raebd9j-3-5-2:hover, a._1raebd9j-3-5-2:hover {
+._1raebd9j-3-6-0[tabindex]:hover, button._1raebd9j-3-6-0:hover, a._1raebd9j-3-6-0:hover {
   background: var(--dt-colors-background-field-warning-accent-hover, #ffb54f);
 }
-._1raebd9j-3-5-2[tabindex]:active, button._1raebd9j-3-5-2:active, a._1raebd9j-3-5-2:active {
+._1raebd9j-3-6-0[tabindex]:active, button._1raebd9j-3-6-0:active, a._1raebd9j-3-6-0:active {
   background: var(--dt-colors-background-field-warning-accent-active, #ffc76d);
 }
-._1raebd9k-3-5-2[tabindex]:hover, button._1raebd9k-3-5-2:hover, a._1raebd9k-3-5-2:hover {
+._1raebd9k-3-6-0[tabindex]:hover, button._1raebd9k-3-6-0:hover, a._1raebd9k-3-6-0:hover {
   background: var(--dt-colors-background-field-critical-accent-hover, #b4002b);
 }
-._1raebd9k-3-5-2[tabindex]:active, button._1raebd9k-3-5-2:active, a._1raebd9k-3-5-2:active {
+._1raebd9k-3-6-0[tabindex]:active, button._1raebd9k-3-6-0:active, a._1raebd9k-3-6-0:active {
   background: var(--dt-colors-background-field-critical-accent-active, #a2001d);
 }
-._1raebd9l-3-5-2[tabindex]:hover, button._1raebd9l-3-5-2:hover, a._1raebd9l-3-5-2:hover {
+._1raebd9l-3-6-0[tabindex]:hover, button._1raebd9l-3-6-0:hover, a._1raebd9l-3-6-0:hover {
   background: var(--dt-colors-background-field-neutral-emphasized-hover, #dadbe4);
 }
-._1raebd9l-3-5-2[tabindex]:active, button._1raebd9l-3-5-2:active, a._1raebd9l-3-5-2:active {
+._1raebd9l-3-6-0[tabindex]:active, button._1raebd9l-3-6-0:active, a._1raebd9l-3-6-0:active {
   background: var(--dt-colors-background-field-neutral-emphasized-active, #d0d1dc);
 }
-._1jgl8s50-3-5-2 ._1raebd9l-3-5-2 {
+._1jgl8s50-3-6-0 ._1raebd9l-3-6-0 {
   background: var(--dt-colors-background-field-neutral-emphasized, #e4e5eb);
 }
-._1jgl8s50-3-5-2 ._1raebd9l-3-5-2[tabindex]:hover, ._1jgl8s50-3-5-2 button._1raebd9l-3-5-2:hover, ._1jgl8s50-3-5-2 a._1raebd9l-3-5-2:hover {
+._1jgl8s50-3-6-0 ._1raebd9l-3-6-0[tabindex]:hover, ._1jgl8s50-3-6-0 button._1raebd9l-3-6-0:hover, ._1jgl8s50-3-6-0 a._1raebd9l-3-6-0:hover {
   background: var(--dt-colors-background-field-neutral-emphasized-hover, #dadbe4);
 }
-._1jgl8s50-3-5-2 ._1raebd9l-3-5-2[tabindex]:active, ._1jgl8s50-3-5-2 button._1raebd9l-3-5-2:active, ._1jgl8s50-3-5-2 a._1raebd9l-3-5-2:active {
+._1jgl8s50-3-6-0 ._1raebd9l-3-6-0[tabindex]:active, ._1jgl8s50-3-6-0 button._1raebd9l-3-6-0:active, ._1jgl8s50-3-6-0 a._1raebd9l-3-6-0:active {
   background: var(--dt-colors-background-field-neutral-emphasized-active, #d0d1dc);
 }
-._1raebd9m-3-5-2[tabindex]:hover, button._1raebd9m-3-5-2:hover, a._1raebd9m-3-5-2:hover {
+._1raebd9m-3-6-0[tabindex]:hover, button._1raebd9m-3-6-0:hover, a._1raebd9m-3-6-0:hover {
   background: var(--dt-colors-background-field-primary-emphasized-hover, #d5dbf6);
 }
-._1raebd9m-3-5-2[tabindex]:active, button._1raebd9m-3-5-2:active, a._1raebd9m-3-5-2:active {
+._1raebd9m-3-6-0[tabindex]:active, button._1raebd9m-3-6-0:active, a._1raebd9m-3-6-0:active {
   background: var(--dt-colors-background-field-primary-emphasized-active, #c9d1f4);
 }
-._1raebd9n-3-5-2[tabindex]:hover, button._1raebd9n-3-5-2:hover, a._1raebd9n-3-5-2:hover {
+._1raebd9n-3-6-0[tabindex]:hover, button._1raebd9n-3-6-0:hover, a._1raebd9n-3-6-0:hover {
   background: var(--dt-colors-background-field-success-emphasized-hover, #d3dedd);
 }
-._1raebd9n-3-5-2[tabindex]:active, button._1raebd9n-3-5-2:active, a._1raebd9n-3-5-2:active {
+._1raebd9n-3-6-0[tabindex]:active, button._1raebd9n-3-6-0:active, a._1raebd9n-3-6-0:active {
   background: var(--dt-colors-background-field-success-emphasized-active, #c7d5d3);
 }
-._1raebd9o-3-5-2[tabindex]:hover, button._1raebd9o-3-5-2:hover, a._1raebd9o-3-5-2:hover {
+._1raebd9o-3-6-0[tabindex]:hover, button._1raebd9o-3-6-0:hover, a._1raebd9o-3-6-0:hover {
   background: var(--dt-colors-background-field-warning-emphasized-hover, #f9ebdb);
 }
-._1raebd9o-3-5-2[tabindex]:active, button._1raebd9o-3-5-2:active, a._1raebd9o-3-5-2:active {
+._1raebd9o-3-6-0[tabindex]:active, button._1raebd9o-3-6-0:active, a._1raebd9o-3-6-0:active {
   background: var(--dt-colors-background-field-warning-emphasized-active, #f9e6d0);
 }
-._1raebd9p-3-5-2[tabindex]:hover, button._1raebd9p-3-5-2:hover, a._1raebd9p-3-5-2:hover {
+._1raebd9p-3-6-0[tabindex]:hover, button._1raebd9p-3-6-0:hover, a._1raebd9p-3-6-0:hover {
   background: var(--dt-colors-background-field-critical-emphasized-hover, #f6d6d5);
 }
-._1raebd9p-3-5-2[tabindex]:active, button._1raebd9p-3-5-2:active, a._1raebd9p-3-5-2:active {
+._1raebd9p-3-6-0[tabindex]:active, button._1raebd9p-3-6-0:active, a._1raebd9p-3-6-0:active {
   background: var(--dt-colors-background-field-critical-emphasized-active, #f5cac9);
 }
-._1raebd9q-3-5-2 {
-  color: var(--_bx32h0-3-5-2);
+._1raebd9q-3-6-0 {
+  color: var(--_bx32h0-3-6-0);
   min-width: 0;
   box-sizing: border-box;
   white-space: nowrap;
@@ -132,14 +132,14 @@
   text-transform: none;
   padding-inline: var(--dt-spacings-size-2, 2px);
 }
-._1raebd9q-3-5-2 * {
-  color: var(--_bx32h0-3-5-2);
+._1raebd9q-3-6-0 * {
+  color: var(--_bx32h0-3-6-0);
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   vertical-align: baseline;
 }
-._1raebd9r-3-5-2 {
+._1raebd9r-3-6-0 {
   display: grid;
   grid: auto / auto-flow auto;
 }

package/content/chip/BaseChip.sty.js

@@ -28,8 +28,8 @@ var import_AppRoot_css_ts_vanilla = require("../../core/components/app-root/AppR
 var import_field_css_ts_vanilla = require("../../styles/field.css");
 var import_BaseChip_css_ts_vanilla = require("./BaseChip.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var container = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1raebd92-3-5-2", variantClassNames: { size: { "default": "_1raebd93-3-5-2", condensed: "_1raebd94-3-5-2" }, hasDeleteButton: { true: "_1raebd95-3-5-2", false: "_1raebd96-3-5-2" }, disabled: { true: "_1raebd97-3-5-2", false: "_1raebd98-3-5-2" }, color: { neutral: "_1raebd99-3-5-2", primary: "_1raebd9a-3-5-2", success: "_1raebd9b-3-5-2", warning: "_1raebd9c-3-5-2", critical: "_1raebd9d-3-5-2" }, variant: { emphasized: "_1raebd9e-3-5-2", accent: "_1raebd9f-3-5-2" } }, defaultVariants: {}, compoundVariants: [[{ color: "neutral", variant: "accent" }, "_1raebd9g-3-5-2"], [{ color: "primary", variant: "accent" }, "_1raebd9h-3-5-2"], [{ color: "success", variant: "accent" }, "_1raebd9i-3-5-2"], [{ color: "warning", variant: "accent" }, "_1raebd9j-3-5-2"], [{ color: "critical", variant: "accent" }, "_1raebd9k-3-5-2"], [{ color: "neutral", variant: "emphasized" }, "_1raebd9l-3-5-2"], [{ color: "primary", variant: "emphasized" }, "_1raebd9m-3-5-2"], [{ color: "success", variant: "emphasized" }, "_1raebd9n-3-5-2"], [{ color: "warning", variant: "emphasized" }, "_1raebd9o-3-5-2"], [{ color: "critical", variant: "emphasized" }, "_1raebd9p-3-5-2"]] });
-var disabledWrapper = "_1raebd91-3-5-2";
-var textContainer = "_1raebd9r-3-5-2";
-var value = "_1raebd9q-3-5-2";
-var wrapper = "_1raebd90-3-5-2";
+var container = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1raebd92-3-6-0", variantClassNames: { size: { "default": "_1raebd93-3-6-0", condensed: "_1raebd94-3-6-0" }, hasDeleteButton: { true: "_1raebd95-3-6-0", false: "_1raebd96-3-6-0" }, disabled: { true: "_1raebd97-3-6-0", false: "_1raebd98-3-6-0" }, color: { neutral: "_1raebd99-3-6-0", primary: "_1raebd9a-3-6-0", success: "_1raebd9b-3-6-0", warning: "_1raebd9c-3-6-0", critical: "_1raebd9d-3-6-0" }, variant: { emphasized: "_1raebd9e-3-6-0", accent: "_1raebd9f-3-6-0" } }, defaultVariants: {}, compoundVariants: [[{ color: "neutral", variant: "accent" }, "_1raebd9g-3-6-0"], [{ color: "primary", variant: "accent" }, "_1raebd9h-3-6-0"], [{ color: "success", variant: "accent" }, "_1raebd9i-3-6-0"], [{ color: "warning", variant: "accent" }, "_1raebd9j-3-6-0"], [{ color: "critical", variant: "accent" }, "_1raebd9k-3-6-0"], [{ color: "neutral", variant: "emphasized" }, "_1raebd9l-3-6-0"], [{ color: "primary", variant: "emphasized" }, "_1raebd9m-3-6-0"], [{ color: "success", variant: "emphasized" }, "_1raebd9n-3-6-0"], [{ color: "warning", variant: "emphasized" }, "_1raebd9o-3-6-0"], [{ color: "critical", variant: "emphasized" }, "_1raebd9p-3-6-0"]] });
+var disabledWrapper = "_1raebd91-3-6-0";
+var textContainer = "_1raebd9r-3-6-0";
+var value = "_1raebd9q-3-6-0";
+var wrapper = "_1raebd90-3-6-0";

package/content/chip/ChipContent.css

@@ -1,24 +1,24 @@
-._uhh9yl1-3-5-2 {
+._uhh9yl1-3-6-0 {
   display: flex;
   align-self: stretch;
   line-height: 100%;
-  fill: var(--_bx32h1-3-5-2);
-  color: var(--_bx32h0-3-5-2);
+  fill: var(--_bx32h1-3-6-0);
+  color: var(--_bx32h0-3-6-0);
 }
-._uhh9yl2-3-5-2 {
-  --_uhh9yl0-3-5-2: 20px;
+._uhh9yl2-3-6-0 {
+  --_uhh9yl0-3-6-0: 20px;
 }
-._uhh9yl3-3-5-2 {
-  --_uhh9yl0-3-5-2: 16px;
+._uhh9yl3-3-6-0 {
+  --_uhh9yl0-3-6-0: 16px;
 }
-._1raebd99-3-5-2._1raebd9e-3-5-2._1raebd98-3-5-2 ._uhh9yl4-3-5-2 {
+._1raebd99-3-6-0._1raebd9e-3-6-0._1raebd98-3-6-0 ._uhh9yl4-3-6-0 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   fill: var(--dt-colors-icon-neutral-subdued, #595a7d);
 }
-._uhh9yl1-3-5-2._uhh9yl1-3-5-2 svg {
+._uhh9yl1-3-6-0._uhh9yl1-3-6-0 svg {
   box-sizing: content-box;
   align-items: center;
   align-self: center;
-  width: var(--_uhh9yl0-3-5-2);
-  height: var(--_uhh9yl0-3-5-2);
+  width: var(--_uhh9yl0-3-6-0);
+  height: var(--_uhh9yl0-3-6-0);
 }

package/content/chip/ChipContent.sty.js

@@ -26,5 +26,5 @@ var import_field_css_ts_vanilla = require("../../styles/field.css");
 var import_BaseChip_css_ts_vanilla = require("./BaseChip.css");
 var import_ChipContent_css_ts_vanilla = require("./ChipContent.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var content = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_uhh9yl1-3-5-2", variantClassNames: { size: { "default": "_uhh9yl2-3-5-2", condensed: "_uhh9yl3-3-5-2" } }, defaultVariants: {}, compoundVariants: [] });
-var prefix = "_uhh9yl4-3-5-2";
+var content = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_uhh9yl1-3-6-0", variantClassNames: { size: { "default": "_uhh9yl2-3-6-0", condensed: "_uhh9yl3-3-6-0" } }, defaultVariants: {}, compoundVariants: [] });
+var prefix = "_uhh9yl4-3-6-0";