@dynatrace/strato-components 3.5.0 → 3.5.2

package/esm/forms/hooks/useAutofillEvent.css

@@ -1,20 +1,20 @@
-@keyframes _yfwka31-3-5-0 {
+@keyframes _yfwka31-3-5-2 {
 
 }
-@keyframes _yfwka32-3-5-0 {
+@keyframes _yfwka32-3-5-2 {
 
 }
-._yfwka33-3-5-0:-webkit-autofill:is(._yfwka33-3-5-0,:hover,:focus) {
+._yfwka33-3-5-2:-webkit-autofill:is(._yfwka33-3-5-2,:hover,:focus) {
   -webkit-text-fill-color: var(--dt-colors-text-primary-default, #464cce);
-  box-shadow: 0 0 0px 1000px var(--_yfwka30-3-5-0) inset;
+  box-shadow: 0 0 0px 1000px var(--_yfwka30-3-5-2) inset;
   caret-color: var(--dt-colors-text-neutral-default, #2f2f4f);
 }
-._yfwka33-3-5-0:-webkit-autofill {
-  animation-name: _yfwka31-3-5-0;
+._yfwka33-3-5-2:-webkit-autofill {
+  animation-name: _yfwka31-3-5-2;
   animation-duration: 0.001s;
 }
-._yfwka33-3-5-0:not(:-webkit-autofill) {
-  animation-name: _yfwka32-3-5-0;
+._yfwka33-3-5-2:not(:-webkit-autofill) {
+  animation-name: _yfwka32-3-5-2;
   animation-duration: 0.001s;
 }
 input:-webkit-autofill::spelling-error {

package/esm/forms/hooks/useAutofillEvent.sty.js

@@ -1,8 +1,8 @@
 import "./useAutofillEvent.css";
-var autofillBackground = "var(--_yfwka30-3-5-0)";
-var autofillCSS = "_yfwka33-3-5-0";
-var end = "_yfwka32-3-5-0";
-var start = "_yfwka31-3-5-0";
+var autofillBackground = "var(--_yfwka30-3-5-2)";
+var autofillCSS = "_yfwka33-3-5-2";
+var end = "_yfwka32-3-5-2";
+var start = "_yfwka31-3-5-2";
 export {
   autofillBackground,
   autofillCSS,

package/esm/forms/hooks/useAutofillEvent.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/forms/hooks/useAutofillEvent.css.ts"],
-  "sourcesContent": ["import './useAutofillEvent.css';\nexport var autofillBackground = 'var(--_yfwka30-3-5-0)';\nexport var autofillCSS = '_yfwka33-3-5-0';\nexport var end = '_yfwka32-3-5-0';\nexport var start = '_yfwka31-3-5-0';"],
+  "sourcesContent": ["import './useAutofillEvent.css';\nexport var autofillBackground = 'var(--_yfwka30-3-5-2)';\nexport var autofillCSS = '_yfwka33-3-5-2';\nexport var end = '_yfwka32-3-5-2';\nexport var start = '_yfwka31-3-5-2';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,qBAAqB;AACzB,IAAI,cAAc;AAClB,IAAI,MAAM;AACV,IAAI,QAAQ;",
   "names": []
 }

package/esm/forms/radio/styles.css

@@ -1,12 +1,12 @@
-._h96idu0-3-5-0 {
+._h96idu0-3-5-2 {
   display: flex;
   flex-direction: column;
   gap: var(--dt-spacings-size-4, 4px);
 }
-._h96idu1-3-5-0 {
+._h96idu1-3-5-2 {
   cursor: default;
 }
-._h96idu5-3-5-0 {
+._h96idu5-3-5-2 {
   display: flex;
   gap: var(--dt-spacings-size-8, 8px);
   position: relative;
@@ -15,14 +15,14 @@
   vertical-align: middle;
   cursor: pointer;
 }
-._h96idu5-3-5-0._h96idu3-3-5-0 {
+._h96idu5-3-5-2._h96idu3-3-5-2 {
   cursor: not-allowed;
   color: var(--dt-colors-text-neutral-disabled, #595a7d80);
 }
-._h96idu1-3-5-0 ._h96idu5-3-5-0 {
+._h96idu1-3-5-2 ._h96idu5-3-5-2 {
   cursor: default;
 }
-._h96idu6-3-5-0 {
+._h96idu6-3-5-2 {
   position: relative;
   display: inline-flex;
   align-items: center;
@@ -31,38 +31,38 @@
   min-width: var(--dt-spacings-size-20, 20px);
   height: var(--dt-spacings-size-20, 20px);
   border-radius: var(--dt-borders-radius-field-emphasized, 9999px);
-  background-color: var(--_bx32h3-3-5-0);
+  background-color: var(--_bx32h3-3-5-2);
 }
-._h96idu7-3-5-0 {
+._h96idu7-3-5-2 {
   background-color: var(--dt-colors-background-field-neutral-disabled, #e4e5eb80);
   box-shadow: inset 0 0 0 var(--dt-borders-width-default, 1px) var(--dt-colors-border-neutral-disabled, #dadbe480);
 }
-._h96idue-3-5-0 {
+._h96idue-3-5-2 {
   background-color: var(--dt-colors-background-field-neutral-disabled, #e4e5eb80);
 }
-._h96idug-3-5-0 {
+._h96idug-3-5-2 {
   box-shadow: inset 0 0 0 var(--dt-borders-width-default, 1px) var(--dt-colors-border-critical-accent, #bb0731);
 }
-._h96iduh-3-5-0 {
+._h96iduh-3-5-2 {
   box-shadow: inset 0 0 0 var(--dt-borders-width-default, 1px) var(--dt-colors-border-neutral-accent, #595a7d);
 }
-._h96idui-3-5-0 {
+._h96idui-3-5-2 {
   box-shadow: inset 0 0 0 var(--dt-borders-width-default, 1px) var(--dt-colors-border-neutral-disabled, #dadbe480);
 }
-._h96iduj-3-5-0 {
+._h96iduj-3-5-2 {
   background-color: var(--dt-colors-background-field-critical-emphasized, #f8e1e1);
   box-shadow: inset 0 0 0 var(--dt-borders-width-default, 1px) var(--dt-colors-border-critical-accent, #bb0731);
 }
-._h96iduk-3-5-0 {
+._h96iduk-3-5-2 {
   height: 100%;
-  fill: var(--_bx32h1-3-5-0);
+  fill: var(--_bx32h1-3-5-2);
 }
-._h96idu5-3-5-0:not(._h96idu4-3-5-0) ._h96iduk-3-5-0 {
+._h96idu5-3-5-2:not(._h96idu4-3-5-2) ._h96iduk-3-5-2 {
   display: none;
 }
-._h96idu1-3-5-0 ._h96iduk-3-5-0 {
+._h96idu1-3-5-2 ._h96iduk-3-5-2 {
   fill: var(--dt-colors-icon-neutral-subdued, #595a7d);
 }
-._h96idu2-3-5-0._h96idu1-3-5-0 ._h96iduk-3-5-0 {
+._h96idu2-3-5-2._h96idu1-3-5-2 ._h96iduk-3-5-2 {
   fill: var(--dt-colors-icon-critical-default, #bb0731);
 }

package/esm/forms/radio/styles.sty.js

@@ -2,14 +2,14 @@ import "../../core/components/app-root/AppRoot.css";
 import "../../styles/field.css";
 import "./styles.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var checked = "_h96idu4-3-5-0";
-var disabled = "_h96idu3-3-5-0";
-var group = "_h96idu0-3-5-0";
-var hasError = "_h96idu2-3-5-0";
-var innerKnob = "_h96iduk-3-5-0";
-var knob = _7a468({ defaultClassName: "_h96idu6-3-5-0", variantClassNames: { disabled: { true: "_h96idu7-3-5-0" }, checked: { true: "_h96idu8-3-5-0", false: "_h96idu9-3-5-0" }, hasError: { true: "_h96idua-3-5-0", false: "_h96idub-3-5-0" }, isFocusVisible: { true: "_h96iduc-3-5-0", false: "_h96idud-3-5-0" }, readOnly: { true: "_h96idue-3-5-0", false: "_h96iduf-3-5-0" } }, defaultVariants: {}, compoundVariants: [[{ checked: false, hasError: true, isFocusVisible: false, disabled: false, readOnly: false }, "_h96idug-3-5-0"], [{ checked: false, hasError: false, isFocusVisible: false, disabled: false, readOnly: false }, "_h96iduh-3-5-0"], [{ readOnly: true, disabled: false }, "_h96idui-3-5-0"], [{ readOnly: true, hasError: true, disabled: false }, "_h96iduj-3-5-0"]] });
-var label = "_h96idu5-3-5-0";
-var readOnly = "_h96idu1-3-5-0";
+var checked = "_h96idu4-3-5-2";
+var disabled = "_h96idu3-3-5-2";
+var group = "_h96idu0-3-5-2";
+var hasError = "_h96idu2-3-5-2";
+var innerKnob = "_h96iduk-3-5-2";
+var knob = _7a468({ defaultClassName: "_h96idu6-3-5-2", variantClassNames: { disabled: { true: "_h96idu7-3-5-2" }, checked: { true: "_h96idu8-3-5-2", false: "_h96idu9-3-5-2" }, hasError: { true: "_h96idua-3-5-2", false: "_h96idub-3-5-2" }, isFocusVisible: { true: "_h96iduc-3-5-2", false: "_h96idud-3-5-2" }, readOnly: { true: "_h96idue-3-5-2", false: "_h96iduf-3-5-2" } }, defaultVariants: {}, compoundVariants: [[{ checked: false, hasError: true, isFocusVisible: false, disabled: false, readOnly: false }, "_h96idug-3-5-2"], [{ checked: false, hasError: false, isFocusVisible: false, disabled: false, readOnly: false }, "_h96iduh-3-5-2"], [{ readOnly: true, disabled: false }, "_h96idui-3-5-2"], [{ readOnly: true, hasError: true, disabled: false }, "_h96iduj-3-5-2"]] });
+var label = "_h96idu5-3-5-2";
+var readOnly = "_h96idu1-3-5-2";
 export {
   checked,
   disabled,

package/esm/forms/radio/styles.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/forms/radio/styles.css.ts"],
-  "sourcesContent": ["import '../../core/components/app-root/AppRoot.css';\nimport '../../styles/field.css';\nimport './styles.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var checked = '_h96idu4-3-5-0';\nexport var disabled = '_h96idu3-3-5-0';\nexport var group = '_h96idu0-3-5-0';\nexport var hasError = '_h96idu2-3-5-0';\nexport var innerKnob = '_h96iduk-3-5-0';\nexport var knob = _7a468({defaultClassName:'_h96idu6-3-5-0',variantClassNames:{disabled:{true:'_h96idu7-3-5-0'},checked:{true:'_h96idu8-3-5-0',false:'_h96idu9-3-5-0'},hasError:{true:'_h96idua-3-5-0',false:'_h96idub-3-5-0'},isFocusVisible:{true:'_h96iduc-3-5-0',false:'_h96idud-3-5-0'},readOnly:{true:'_h96idue-3-5-0',false:'_h96iduf-3-5-0'}},defaultVariants:{},compoundVariants:[[{checked:false,hasError:true,isFocusVisible:false,disabled:false,readOnly:false},'_h96idug-3-5-0'],[{checked:false,hasError:false,isFocusVisible:false,disabled:false,readOnly:false},'_h96iduh-3-5-0'],[{readOnly:true,disabled:false},'_h96idui-3-5-0'],[{readOnly:true,hasError:true,disabled:false},'_h96iduj-3-5-0']]});\nexport var label = '_h96idu5-3-5-0';\nexport var readOnly = '_h96idu1-3-5-0';"],
+  "sourcesContent": ["import '../../core/components/app-root/AppRoot.css';\nimport '../../styles/field.css';\nimport './styles.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var checked = '_h96idu4-3-5-2';\nexport var disabled = '_h96idu3-3-5-2';\nexport var group = '_h96idu0-3-5-2';\nexport var hasError = '_h96idu2-3-5-2';\nexport var innerKnob = '_h96iduk-3-5-2';\nexport var knob = _7a468({defaultClassName:'_h96idu6-3-5-2',variantClassNames:{disabled:{true:'_h96idu7-3-5-2'},checked:{true:'_h96idu8-3-5-2',false:'_h96idu9-3-5-2'},hasError:{true:'_h96idua-3-5-2',false:'_h96idub-3-5-2'},isFocusVisible:{true:'_h96iduc-3-5-2',false:'_h96idud-3-5-2'},readOnly:{true:'_h96idue-3-5-2',false:'_h96iduf-3-5-2'}},defaultVariants:{},compoundVariants:[[{checked:false,hasError:true,isFocusVisible:false,disabled:false,readOnly:false},'_h96idug-3-5-2'],[{checked:false,hasError:false,isFocusVisible:false,disabled:false,readOnly:false},'_h96iduh-3-5-2'],[{readOnly:true,disabled:false},'_h96idui-3-5-2'],[{readOnly:true,hasError:true,disabled:false},'_h96iduj-3-5-2']]});\nexport var label = '_h96idu5-3-5-2';\nexport var readOnly = '_h96idu1-3-5-2';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,UAAU;AACd,IAAI,WAAW;AACf,IAAI,QAAQ;AACZ,IAAI,WAAW;AACf,IAAI,YAAY;AAChB,IAAI,OAAO,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,UAAS,EAAC,MAAK,iBAAgB,GAAE,SAAQ,EAAC,MAAK,kBAAiB,OAAM,iBAAgB,GAAE,UAAS,EAAC,MAAK,kBAAiB,OAAM,iBAAgB,GAAE,gBAAe,EAAC,MAAK,kBAAiB,OAAM,iBAAgB,GAAE,UAAS,EAAC,MAAK,kBAAiB,OAAM,iBAAgB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,CAAC,EAAC,SAAQ,OAAM,UAAS,MAAK,gBAAe,OAAM,UAAS,OAAM,UAAS,MAAK,GAAE,gBAAgB,GAAE,CAAC,EAAC,SAAQ,OAAM,UAAS,OAAM,gBAAe,OAAM,UAAS,OAAM,UAAS,MAAK,GAAE,gBAAgB,GAAE,CAAC,EAAC,UAAS,MAAK,UAAS,MAAK,GAAE,gBAAgB,GAAE,CAAC,EAAC,UAAS,MAAK,UAAS,MAAK,UAAS,MAAK,GAAE,gBAAgB,CAAC,EAAC,CAAC;AAChrB,IAAI,QAAQ;AACZ,IAAI,WAAW;",
   "names": []
 }

package/esm/forms/search-input/SearchInput.css

@@ -1,3 +1,3 @@
-._1mumub80-3-5-0 {
+._1mumub80-3-5-2 {
   min-width: 192px;
 }

package/esm/forms/search-input/SearchInput.sty.js

@@ -1,5 +1,5 @@
 import "./SearchInput.css";
-var searchInput = "_1mumub80-3-5-0";
+var searchInput = "_1mumub80-3-5-2";
 export {
   searchInput
 };

package/esm/forms/search-input/SearchInput.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/forms/search-input/SearchInput.css.ts"],
-  "sourcesContent": ["import './SearchInput.css';\nexport var searchInput = '_1mumub80-3-5-0';"],
+  "sourcesContent": ["import './SearchInput.css';\nexport var searchInput = '_1mumub80-3-5-2';"],
   "mappings": "AAAA,OAAO;AACA,IAAI,cAAc;",
   "names": []
 }

package/esm/forms/select/styles/Select.css

@@ -1,89 +1,89 @@
-._dlenfc0-3-5-0._dlenfc0-3-5-0 {
+._dlenfc0-3-5-2._dlenfc0-3-5-2 {
   pointer-events: auto;
 }
-._dlenfc1-3-5-0._dlenfc1-3-5-0 {
+._dlenfc1-3-5-2._dlenfc1-3-5-2 {
   min-width: unset;
 }
-._dlenfc3-3-5-0 {
+._dlenfc3-3-5-2 {
   width: 100%;
 }
-._dlenfc4-3-5-0 {
+._dlenfc4-3-5-2 {
   width: auto;
 }
-._dlenfc5-3-5-0 > span {
+._dlenfc5-3-5-2 > span {
   z-index: unset;
 }
-._dlenfc6-3-5-0 {
+._dlenfc6-3-5-2 {
   display: flex;
 }
-._dlenfc7-3-5-0 {
+._dlenfc7-3-5-2 {
   transform: rotate(180deg);
 }
-._dlenfc8-3-5-0 {
+._dlenfc8-3-5-2 {
   color: var(--dt-colors-icon-neutral-disabled, #595a7d80);
   cursor: default;
 }
-._dlenfca-3-5-0 {
+._dlenfca-3-5-2 {
   width: auto;
 }
-._dlenfcc-3-5-0 {
+._dlenfcc-3-5-2 {
   cursor: default;
 }
-:root:not(._1jgl8s50-3-5-0) ._dlenfcc-3-5-0 {
-  --_bx32h3-3-5-0: var(--dt-colors-background-field-neutral-disabled, #e4e5eb80);
+:root:not(._1jgl8s50-3-5-2) ._dlenfcc-3-5-2 {
+  --_bx32h3-3-5-2: var(--dt-colors-background-field-neutral-disabled, #e4e5eb80);
 }
-._dlenfcd-3-5-0 {
+._dlenfcd-3-5-2 {
   background-color: var(--dt-colors-background-field-critical-emphasized, #f8e1e1);
 }
-._1jgl8s50-3-5-0 ._dlenfce-3-5-0, ._1jgl8s50-3-5-0 ._dlenfce-3-5-0:hover, ._1jgl8s50-3-5-0 ._dlenfce-3-5-0:active {
-  --_bx32h3-3-5-0: var(--dt-colors-background-surface-default, #fff);
-  --_bx32h4-3-5-0: var(--dt-box-shadows-field-neutral-emphasized-rest, inset 0px 0px 0px 1px #2f2f4f1f, inset 0px -1px 0px #2f2f4f14, 0px 1px 1px -1px #2d2e4e1f, inset 0px 0px 0px 1px #fff);
+._1jgl8s50-3-5-2 ._dlenfce-3-5-2, ._1jgl8s50-3-5-2 ._dlenfce-3-5-2:hover, ._1jgl8s50-3-5-2 ._dlenfce-3-5-2:active {
+  --_bx32h3-3-5-2: var(--dt-colors-background-surface-default, #fff);
+  --_bx32h4-3-5-2: var(--dt-box-shadows-field-neutral-emphasized-rest, inset 0px 0px 0px 1px #2f2f4f1f, inset 0px -1px 0px #2f2f4f14, 0px 1px 1px -1px #2d2e4e1f, inset 0px 0px 0px 1px #fff);
 }
-._dlenfcf-3-5-0 {
+._dlenfcf-3-5-2 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
 }
-._dlenfcg-3-5-0 {
+._dlenfcg-3-5-2 {
   width: 100%;
   position: relative;
 }
-._dlenfch-3-5-0 {
+._dlenfch-3-5-2 {
   overflow: auto;
 }
-._dlenfci-3-5-0 {
+._dlenfci-3-5-2 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   padding: var(--dt-spacings-size-6, 6px) var(--dt-spacings-size-12, 12px);
 }
-._dlenfcj-3-5-0 {
+._dlenfcj-3-5-2 {
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
 }
-._dlenfck-3-5-0 ._dlenfcl-3-5-0 {
+._dlenfck-3-5-2 ._dlenfcl-3-5-2 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
 }
-._dlenfcm-3-5-0 {
+._dlenfcm-3-5-2 {
   color: var(--dt-colors-text-neutral-subdued, #595a7d);
   align-items: center;
 }
-._dlenfcn-3-5-0.strato-select-divider {
+._dlenfcn-3-5-2.strato-select-divider {
   margin: var(--dt-spacings-size-4, 4px) var(--dt-spacings-size-0, 0);
 }
-._dlenfco-3-5-0 {
+._dlenfco-3-5-2 {
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
   max-height: 101vh;
 }
-._dlenfcp-3-5-0 {
+._dlenfcp-3-5-2 {
   min-width: 128px;
 }
-._dlenfcq-3-5-0 {
+._dlenfcq-3-5-2 {
   display: inline;
 }
-._dlenfcq-3-5-0 + ._dlenfcq-3-5-0:before {
+._dlenfcq-3-5-2 + ._dlenfcq-3-5-2:before {
   content: ", ";
 }
-._dlenfcr-3-5-0 {
+._dlenfcr-3-5-2 {
   position: relative;
   cursor: pointer;
   border-radius: var(--dt-borders-radius-field-default, 6px);
@@ -93,23 +93,23 @@
   padding-bottom: var(--dt-spacings-size-6, 6px);
   font-weight: var(--dt-typography-text-base-emphasized-weight, 500);
 }
-._dlenfcr-3-5-0:hover:not(.strato-select-option--disabled) {
+._dlenfcr-3-5-2:hover:not(.strato-select-option--disabled) {
   background-color: var(--dt-colors-background-field-neutral-default-hover, #dadbe4);
 }
-._dlenfcr-3-5-0.strato-select-option--selected {
+._dlenfcr-3-5-2.strato-select-option--selected {
   color: var(--dt-colors-text-primary-default, #464cce);
 }
-._dlenfcr-3-5-0.strato-select-option--disabled {
+._dlenfcr-3-5-2.strato-select-option--disabled {
   color: var(--dt-colors-text-neutral-disabled, #595a7d80);
   cursor: not-allowed;
 }
-._dlenfcr-3-5-0.strato-select-option--selected.strato-select-option--disabled:before {
+._dlenfcr-3-5-2.strato-select-option--selected.strato-select-option--disabled:before {
   background-color: var(--dt-colors-border-primary-disabled, #dadbe480);
 }
-._dlenfcr-3-5-0.strato-select-option--selected:hover {
+._dlenfcr-3-5-2.strato-select-option--selected:hover {
   background-color: var(--dt-colors-background-field-primary-default-hover, #d5dbf6);
 }
-._dlenfcr-3-5-0.strato-select-option--selected::before {
+._dlenfcr-3-5-2.strato-select-option--selected::before {
   content: " ";
   position: absolute;
   display: block;
@@ -120,11 +120,11 @@
   left: 0px;
   transform: translate(4px);
 }
-._dlenfcs-3-5-0:focus {
+._dlenfcs-3-5-2:focus {
   outline: none;
   box-shadow: inset 0 0 0 var(--dt-borders-width-emphasized, 2px) var(--dt-colors-border-neutral-accent, #595a7d), inset 0 0 0 calc(var(--dt-borders-width-emphasized, 2px) + 1px) var(--dt-colors-border-neutral-default, #dadbe4);
 }
-._dlenfct-3-5-0 {
+._dlenfct-3-5-2 {
   padding-left: var(--dt-spacings-size-8, 8px);
   padding-right: var(--dt-spacings-size-12, 12px);
   padding-top: var(--dt-spacings-size-6, 6px);
@@ -134,14 +134,14 @@
   cursor: pointer;
   border-radius: var(--dt-spacings-size-8, 8px);
 }
-._dlenfct-3-5-0:hover:not(.strato-select-option--disabled) {
+._dlenfct-3-5-2:hover:not(.strato-select-option--disabled) {
   background-color: var(--dt-colors-background-field-neutral-default-hover, #dadbe4);
 }
-._dlenfct-3-5-0.strato-select-option--disabled {
+._dlenfct-3-5-2.strato-select-option--disabled {
   color: var(--dt-colors-text-neutral-disabled, #595a7d80);
   cursor: not-allowed;
 }
-._dlenfcu-3-5-0 {
+._dlenfcu-3-5-2 {
   display: flex;
   width: var(--dt-spacings-size-20, 20px);
   min-width: var(--dt-spacings-size-20, 20px);
@@ -153,29 +153,29 @@
   border-color: var(--dt-colors-border-neutral-accent, #595a7d);
   box-sizing: border-box;
 }
-.strato-select-option--disabled ._dlenfcu-3-5-0 {
+.strato-select-option--disabled ._dlenfcu-3-5-2 {
   background-color: var(--dt-colors-background-field-neutral-disabled, #e4e5eb80);
   border-color: var(--dt-colors-border-neutral-disabled, #dadbe480);
 }
-._dlenfcv-3-5-0 {
+._dlenfcv-3-5-2 {
   border-color: var(--dt-colors-background-field-primary-accent, #474fcf);
   background-color: var(--dt-colors-background-field-primary-accent, #474fcf);
 }
-._dlenfcw-3-5-0 {
+._dlenfcw-3-5-2 {
   fill: var(--dt-colors-icon-primary-on-accent-default, #f4f4fb);
   height: 100%;
   width: 100%;
 }
-.strato-select-option--disabled ._dlenfcw-3-5-0 {
+.strato-select-option--disabled ._dlenfcw-3-5-2 {
   fill: var(--dt-colors-icon-primary-disabled, #595a7d80);
 }
-._dlenfcx-3-5-0 {
+._dlenfcx-3-5-2 {
   display: inline-block;
   width: var(--dt-spacings-size-20, 20px);
   min-width: var(--dt-spacings-size-20, 20px);
   height: var(--dt-spacings-size-20, 20px);
 }
-._dlenfcy-3-5-0 {
+._dlenfcy-3-5-2 {
   display: inline-block;
   width: var(--dt-spacings-size-20, 20px);
   min-width: var(--dt-spacings-size-20, 20px);

package/esm/forms/select/styles/Select.sty.js

@@ -2,30 +2,30 @@ import "../../../core/components/app-root/AppRoot.css";
 import "../../../styles/field.css";
 import "./Select.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var clearReactSelectZIndex = "_dlenfc5-3-5-0";
-var filter = "_dlenfc1-3-5-0";
-var placeholderColor = "_dlenfcl-3-5-0";
-var select = "_dlenfc0-3-5-0";
-var selectAll = "_dlenfcs-3-5-0";
-var selectGroupHeading = "_dlenfcf-3-5-0";
-var selectMenuDivider = "_dlenfcn-3-5-0";
-var selectMenuListWrapper = "_dlenfch-3-5-0";
-var selectMenuLoadingWrapper = "_dlenfcm-3-5-0";
-var selectMenuOverlay = _7a468({ defaultClassName: "_dlenfco-3-5-0", variantClassNames: { isTriggerWidth: { true: "_dlenfcp-3-5-0" } }, defaultVariants: { isTriggerWidth: false }, compoundVariants: [] });
-var selectMultiValue = "_dlenfcq-3-5-0";
-var selectNoOptionsMessage = "_dlenfci-3-5-0";
-var selectOptionMulti = "_dlenfct-3-5-0";
-var selectOptionMultiIndicator = _7a468({ defaultClassName: "_dlenfcu-3-5-0", variantClassNames: { selected: { true: "_dlenfcv-3-5-0" } }, defaultVariants: {}, compoundVariants: [] });
-var selectOptionMultiIndicatorIcon = "_dlenfcw-3-5-0";
-var selectOptionPrefix = "_dlenfcx-3-5-0";
-var selectOptionSingle = "_dlenfcr-3-5-0";
-var selectOptionSuffix = "_dlenfcy-3-5-0";
-var selectTrigger = _7a468({ defaultClassName: "_dlenfc9-3-5-0", variantClassNames: { fullWidth: { true: "_dlenfca-3-5-0" }, showError: { true: "_dlenfcb-3-5-0" }, readOnly: { true: "_dlenfcc-3-5-0" } }, defaultVariants: { fullWidth: false }, compoundVariants: [[{ showError: true, readOnly: true }, "_dlenfcd-3-5-0"], [{ showError: false, readOnly: true }, "_dlenfce-3-5-0"]] });
-var selectTriggerIconWrapper = _7a468({ defaultClassName: "_dlenfc6-3-5-0", variantClassNames: { isOverlayOpen: { true: "_dlenfc7-3-5-0" }, readOnly: { true: "_dlenfc8-3-5-0" } }, defaultVariants: { isOverlayOpen: false }, compoundVariants: [] });
-var selectValueContainerTruncationBox = "_dlenfcj-3-5-0";
-var selectVirtualizationWrapper = "_dlenfcg-3-5-0";
-var selectWrapper = _7a468({ defaultClassName: "_dlenfc2-3-5-0", variantClassNames: { fullWidth: { true: "_dlenfc3-3-5-0", false: "_dlenfc4-3-5-0" } }, defaultVariants: { fullWidth: false }, compoundVariants: [] });
-var validAndEnabled = "_dlenfck-3-5-0";
+var clearReactSelectZIndex = "_dlenfc5-3-5-2";
+var filter = "_dlenfc1-3-5-2";
+var placeholderColor = "_dlenfcl-3-5-2";
+var select = "_dlenfc0-3-5-2";
+var selectAll = "_dlenfcs-3-5-2";
+var selectGroupHeading = "_dlenfcf-3-5-2";
+var selectMenuDivider = "_dlenfcn-3-5-2";
+var selectMenuListWrapper = "_dlenfch-3-5-2";
+var selectMenuLoadingWrapper = "_dlenfcm-3-5-2";
+var selectMenuOverlay = _7a468({ defaultClassName: "_dlenfco-3-5-2", variantClassNames: { isTriggerWidth: { true: "_dlenfcp-3-5-2" } }, defaultVariants: { isTriggerWidth: false }, compoundVariants: [] });
+var selectMultiValue = "_dlenfcq-3-5-2";
+var selectNoOptionsMessage = "_dlenfci-3-5-2";
+var selectOptionMulti = "_dlenfct-3-5-2";
+var selectOptionMultiIndicator = _7a468({ defaultClassName: "_dlenfcu-3-5-2", variantClassNames: { selected: { true: "_dlenfcv-3-5-2" } }, defaultVariants: {}, compoundVariants: [] });
+var selectOptionMultiIndicatorIcon = "_dlenfcw-3-5-2";
+var selectOptionPrefix = "_dlenfcx-3-5-2";
+var selectOptionSingle = "_dlenfcr-3-5-2";
+var selectOptionSuffix = "_dlenfcy-3-5-2";
+var selectTrigger = _7a468({ defaultClassName: "_dlenfc9-3-5-2", variantClassNames: { fullWidth: { true: "_dlenfca-3-5-2" }, showError: { true: "_dlenfcb-3-5-2" }, readOnly: { true: "_dlenfcc-3-5-2" } }, defaultVariants: { fullWidth: false }, compoundVariants: [[{ showError: true, readOnly: true }, "_dlenfcd-3-5-2"], [{ showError: false, readOnly: true }, "_dlenfce-3-5-2"]] });
+var selectTriggerIconWrapper = _7a468({ defaultClassName: "_dlenfc6-3-5-2", variantClassNames: { isOverlayOpen: { true: "_dlenfc7-3-5-2" }, readOnly: { true: "_dlenfc8-3-5-2" } }, defaultVariants: { isOverlayOpen: false }, compoundVariants: [] });
+var selectValueContainerTruncationBox = "_dlenfcj-3-5-2";
+var selectVirtualizationWrapper = "_dlenfcg-3-5-2";
+var selectWrapper = _7a468({ defaultClassName: "_dlenfc2-3-5-2", variantClassNames: { fullWidth: { true: "_dlenfc3-3-5-2", false: "_dlenfc4-3-5-2" } }, defaultVariants: { fullWidth: false }, compoundVariants: [] });
+var validAndEnabled = "_dlenfck-3-5-2";
 export {
   clearReactSelectZIndex,
   filter,

package/esm/forms/select/styles/Select.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/forms/select/styles/Select.css.ts"],
-  "sourcesContent": ["import '../../../core/components/app-root/AppRoot.css';\nimport '../../../styles/field.css';\nimport './Select.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var clearReactSelectZIndex = '_dlenfc5-3-5-0';\nexport var filter = '_dlenfc1-3-5-0';\nexport var placeholderColor = '_dlenfcl-3-5-0';\nexport var select = '_dlenfc0-3-5-0';\nexport var selectAll = '_dlenfcs-3-5-0';\nexport var selectGroupHeading = '_dlenfcf-3-5-0';\nexport var selectMenuDivider = '_dlenfcn-3-5-0';\nexport var selectMenuListWrapper = '_dlenfch-3-5-0';\nexport var selectMenuLoadingWrapper = '_dlenfcm-3-5-0';\nexport var selectMenuOverlay = _7a468({defaultClassName:'_dlenfco-3-5-0',variantClassNames:{isTriggerWidth:{true:'_dlenfcp-3-5-0'}},defaultVariants:{isTriggerWidth:false},compoundVariants:[]});\nexport var selectMultiValue = '_dlenfcq-3-5-0';\nexport var selectNoOptionsMessage = '_dlenfci-3-5-0';\nexport var selectOptionMulti = '_dlenfct-3-5-0';\nexport var selectOptionMultiIndicator = _7a468({defaultClassName:'_dlenfcu-3-5-0',variantClassNames:{selected:{true:'_dlenfcv-3-5-0'}},defaultVariants:{},compoundVariants:[]});\nexport var selectOptionMultiIndicatorIcon = '_dlenfcw-3-5-0';\nexport var selectOptionPrefix = '_dlenfcx-3-5-0';\nexport var selectOptionSingle = '_dlenfcr-3-5-0';\nexport var selectOptionSuffix = '_dlenfcy-3-5-0';\nexport var selectTrigger = _7a468({defaultClassName:'_dlenfc9-3-5-0',variantClassNames:{fullWidth:{true:'_dlenfca-3-5-0'},showError:{true:'_dlenfcb-3-5-0'},readOnly:{true:'_dlenfcc-3-5-0'}},defaultVariants:{fullWidth:false},compoundVariants:[[{showError:true,readOnly:true},'_dlenfcd-3-5-0'],[{showError:false,readOnly:true},'_dlenfce-3-5-0']]});\nexport var selectTriggerIconWrapper = _7a468({defaultClassName:'_dlenfc6-3-5-0',variantClassNames:{isOverlayOpen:{true:'_dlenfc7-3-5-0'},readOnly:{true:'_dlenfc8-3-5-0'}},defaultVariants:{isOverlayOpen:false},compoundVariants:[]});\nexport var selectValueContainerTruncationBox = '_dlenfcj-3-5-0';\nexport var selectVirtualizationWrapper = '_dlenfcg-3-5-0';\nexport var selectWrapper = _7a468({defaultClassName:'_dlenfc2-3-5-0',variantClassNames:{fullWidth:{true:'_dlenfc3-3-5-0',false:'_dlenfc4-3-5-0'}},defaultVariants:{fullWidth:false},compoundVariants:[]});\nexport var validAndEnabled = '_dlenfck-3-5-0';"],
+  "sourcesContent": ["import '../../../core/components/app-root/AppRoot.css';\nimport '../../../styles/field.css';\nimport './Select.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var clearReactSelectZIndex = '_dlenfc5-3-5-2';\nexport var filter = '_dlenfc1-3-5-2';\nexport var placeholderColor = '_dlenfcl-3-5-2';\nexport var select = '_dlenfc0-3-5-2';\nexport var selectAll = '_dlenfcs-3-5-2';\nexport var selectGroupHeading = '_dlenfcf-3-5-2';\nexport var selectMenuDivider = '_dlenfcn-3-5-2';\nexport var selectMenuListWrapper = '_dlenfch-3-5-2';\nexport var selectMenuLoadingWrapper = '_dlenfcm-3-5-2';\nexport var selectMenuOverlay = _7a468({defaultClassName:'_dlenfco-3-5-2',variantClassNames:{isTriggerWidth:{true:'_dlenfcp-3-5-2'}},defaultVariants:{isTriggerWidth:false},compoundVariants:[]});\nexport var selectMultiValue = '_dlenfcq-3-5-2';\nexport var selectNoOptionsMessage = '_dlenfci-3-5-2';\nexport var selectOptionMulti = '_dlenfct-3-5-2';\nexport var selectOptionMultiIndicator = _7a468({defaultClassName:'_dlenfcu-3-5-2',variantClassNames:{selected:{true:'_dlenfcv-3-5-2'}},defaultVariants:{},compoundVariants:[]});\nexport var selectOptionMultiIndicatorIcon = '_dlenfcw-3-5-2';\nexport var selectOptionPrefix = '_dlenfcx-3-5-2';\nexport var selectOptionSingle = '_dlenfcr-3-5-2';\nexport var selectOptionSuffix = '_dlenfcy-3-5-2';\nexport var selectTrigger = _7a468({defaultClassName:'_dlenfc9-3-5-2',variantClassNames:{fullWidth:{true:'_dlenfca-3-5-2'},showError:{true:'_dlenfcb-3-5-2'},readOnly:{true:'_dlenfcc-3-5-2'}},defaultVariants:{fullWidth:false},compoundVariants:[[{showError:true,readOnly:true},'_dlenfcd-3-5-2'],[{showError:false,readOnly:true},'_dlenfce-3-5-2']]});\nexport var selectTriggerIconWrapper = _7a468({defaultClassName:'_dlenfc6-3-5-2',variantClassNames:{isOverlayOpen:{true:'_dlenfc7-3-5-2'},readOnly:{true:'_dlenfc8-3-5-2'}},defaultVariants:{isOverlayOpen:false},compoundVariants:[]});\nexport var selectValueContainerTruncationBox = '_dlenfcj-3-5-2';\nexport var selectVirtualizationWrapper = '_dlenfcg-3-5-2';\nexport var selectWrapper = _7a468({defaultClassName:'_dlenfc2-3-5-2',variantClassNames:{fullWidth:{true:'_dlenfc3-3-5-2',false:'_dlenfc4-3-5-2'}},defaultVariants:{fullWidth:false},compoundVariants:[]});\nexport var validAndEnabled = '_dlenfck-3-5-2';"],
   "mappings": "AAAA,OAAO;AACP,OAAO;AACP,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,yBAAyB;AAC7B,IAAI,SAAS;AACb,IAAI,mBAAmB;AACvB,IAAI,SAAS;AACb,IAAI,YAAY;AAChB,IAAI,qBAAqB;AACzB,IAAI,oBAAoB;AACxB,IAAI,wBAAwB;AAC5B,IAAI,2BAA2B;AAC/B,IAAI,oBAAoB,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,gBAAe,EAAC,MAAK,iBAAgB,EAAC,GAAE,iBAAgB,EAAC,gBAAe,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACxL,IAAI,mBAAmB;AACvB,IAAI,yBAAyB;AAC7B,IAAI,oBAAoB;AACxB,IAAI,6BAA6B,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,UAAS,EAAC,MAAK,iBAAgB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACvK,IAAI,iCAAiC;AACrC,IAAI,qBAAqB;AACzB,IAAI,qBAAqB;AACzB,IAAI,qBAAqB;AACzB,IAAI,gBAAgB,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,WAAU,EAAC,MAAK,iBAAgB,GAAE,WAAU,EAAC,MAAK,iBAAgB,GAAE,UAAS,EAAC,MAAK,iBAAgB,EAAC,GAAE,iBAAgB,EAAC,WAAU,MAAK,GAAE,kBAAiB,CAAC,CAAC,EAAC,WAAU,MAAK,UAAS,KAAI,GAAE,gBAAgB,GAAE,CAAC,EAAC,WAAU,OAAM,UAAS,KAAI,GAAE,gBAAgB,CAAC,EAAC,CAAC;AACjV,IAAI,2BAA2B,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,eAAc,EAAC,MAAK,iBAAgB,GAAE,UAAS,EAAC,MAAK,iBAAgB,EAAC,GAAE,iBAAgB,EAAC,eAAc,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AAC9N,IAAI,oCAAoC;AACxC,IAAI,8BAA8B;AAClC,IAAI,gBAAgB,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,WAAU,EAAC,MAAK,kBAAiB,OAAM,iBAAgB,EAAC,GAAE,iBAAgB,EAAC,WAAU,MAAK,GAAE,kBAAiB,CAAC,EAAC,CAAC;AACjM,IAAI,kBAAkB;",
   "names": []
 }

package/esm/forms/spin-buttons/SpinButton.css

@@ -1,28 +1,28 @@
-._r47o0w1-3-5-0 {
+._r47o0w1-3-5-2 {
   display: inline-block;
   outline: none;
   caret-color: transparent;
   color: var(--dt-colors-text-neutral-default, #2f2f4f);
 }
-._r47o0w1-3-5-0:empty::before {
+._r47o0w1-3-5-2:empty::before {
   content: var(--data-placeholder);
 }
-._r47o0w1-3-5-0:focus:empty {
+._r47o0w1-3-5-2:focus:empty {
   color: var(--dt-colors-text-neutral-on-accent-default, #f3f3f6);
   background-color: var(--dt-colors-background-field-neutral-accent, #5b5c81);
 }
-._r47o0w2-3-5-0 {
+._r47o0w2-3-5-2 {
   color: var(--dt-colors-text-critical-default, #bb0731);
 }
-._r47o0w2-3-5-0:focus:empty {
+._r47o0w2-3-5-2:focus:empty {
   background-color: var(--dt-colors-background-field-critical-accent, #c62239);
 }
-._r47o0w3-3-5-0 {
+._r47o0w3-3-5-2 {
   color: var(--dt-colors-text-neutral-disabled, #595a7d80);
 }
-._r47o0w3-3-5-0:empty::before {
+._r47o0w3-3-5-2:empty::before {
   color: var(--dt-colors-text-critical-on-accent-disabled, #f9f1f380);
 }
-._r47o0w4-3-5-0 {
+._r47o0w4-3-5-2 {
   color: var(--dt-colors-text-critical-disabled, #595a7d80);
 }

package/esm/forms/spin-buttons/SpinButton.sty.js

@@ -1,7 +1,7 @@
 import "./SpinButton.css";
 import { createRuntimeFn as _7a468 } from "@vanilla-extract/recipes/createRuntimeFn";
-var spinButtonCSS = _7a468({ defaultClassName: "_r47o0w1-3-5-0", variantClassNames: { error: { true: "_r47o0w2-3-5-0" }, disabled: { true: "_r47o0w3-3-5-0" } }, defaultVariants: {}, compoundVariants: [[{ disabled: true, error: true }, "_r47o0w4-3-5-0"]] });
-var spinButtonGroupCSS = "_r47o0w0-3-5-0";
+var spinButtonCSS = _7a468({ defaultClassName: "_r47o0w1-3-5-2", variantClassNames: { error: { true: "_r47o0w2-3-5-2" }, disabled: { true: "_r47o0w3-3-5-2" } }, defaultVariants: {}, compoundVariants: [[{ disabled: true, error: true }, "_r47o0w4-3-5-2"]] });
+var spinButtonGroupCSS = "_r47o0w0-3-5-2";
 export {
   spinButtonCSS,
   spinButtonGroupCSS

package/esm/forms/spin-buttons/SpinButton.sty.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/forms/spin-buttons/SpinButton.css.ts"],
-  "sourcesContent": ["import './SpinButton.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var spinButtonCSS = _7a468({defaultClassName:'_r47o0w1-3-5-0',variantClassNames:{error:{true:'_r47o0w2-3-5-0'},disabled:{true:'_r47o0w3-3-5-0'}},defaultVariants:{},compoundVariants:[[{disabled:true,error:true},'_r47o0w4-3-5-0']]});\nexport var spinButtonGroupCSS = '_r47o0w0-3-5-0';"],
+  "sourcesContent": ["import './SpinButton.css';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var spinButtonCSS = _7a468({defaultClassName:'_r47o0w1-3-5-2',variantClassNames:{error:{true:'_r47o0w2-3-5-2'},disabled:{true:'_r47o0w3-3-5-2'}},defaultVariants:{},compoundVariants:[[{disabled:true,error:true},'_r47o0w4-3-5-2']]});\nexport var spinButtonGroupCSS = '_r47o0w0-3-5-2';"],
   "mappings": "AAAA,OAAO;AACP,SAAS,mBAAmB,cAAc;AACnC,IAAI,gBAAgB,OAAO,EAAC,kBAAiB,kBAAiB,mBAAkB,EAAC,OAAM,EAAC,MAAK,iBAAgB,GAAE,UAAS,EAAC,MAAK,iBAAgB,EAAC,GAAE,iBAAgB,CAAC,GAAE,kBAAiB,CAAC,CAAC,EAAC,UAAS,MAAK,OAAM,KAAI,GAAE,gBAAgB,CAAC,EAAC,CAAC;AACrO,IAAI,qBAAqB;",
   "names": []
 }