@dynatrace/strato-components 3.6.0 → 3.7.0

package/styles/sprinkles.sty.js

@@ -23,5 +23,5 @@ __export(sprinkles_css_exports, {
 module.exports = __toCommonJS(sprinkles_css_exports);
 var import_sprinkles_css_ts_vanilla = require("./sprinkles.css");
 var import_createRuntimeSprinkles = require("@vanilla-extract/sprinkles/createRuntimeSprinkles");
-var globalSprinkleProperties = { conditions: void 0, styles: { gap: { values: { "0": { defaultClass: "_1bzvwaf0-3-6-0" }, "2": { defaultClass: "_1bzvwaf1-3-6-0" }, "4": { defaultClass: "_1bzvwaf2-3-6-0" }, "6": { defaultClass: "_1bzvwaf3-3-6-0" }, "8": { defaultClass: "_1bzvwaf4-3-6-0" }, "12": { defaultClass: "_1bzvwaf5-3-6-0" }, "16": { defaultClass: "_1bzvwaf6-3-6-0" }, "20": { defaultClass: "_1bzvwaf7-3-6-0" }, "24": { defaultClass: "_1bzvwaf8-3-6-0" }, "32": { defaultClass: "_1bzvwaf9-3-6-0" }, "40": { defaultClass: "_1bzvwafa-3-6-0" }, "48": { defaultClass: "_1bzvwafb-3-6-0" }, "56": { defaultClass: "_1bzvwafc-3-6-0" }, "64": { defaultClass: "_1bzvwafd-3-6-0" } } }, rowGap: { values: { "0": { defaultClass: "_1bzvwafe-3-6-0" }, "2": { defaultClass: "_1bzvwaff-3-6-0" }, "4": { defaultClass: "_1bzvwafg-3-6-0" }, "6": { defaultClass: "_1bzvwafh-3-6-0" }, "8": { defaultClass: "_1bzvwafi-3-6-0" }, "12": { defaultClass: "_1bzvwafj-3-6-0" }, "16": { defaultClass: "_1bzvwafk-3-6-0" }, "20": { defaultClass: "_1bzvwafl-3-6-0" }, "24": { defaultClass: "_1bzvwafm-3-6-0" }, "32": { defaultClass: "_1bzvwafn-3-6-0" }, "40": { defaultClass: "_1bzvwafo-3-6-0" }, "48": { defaultClass: "_1bzvwafp-3-6-0" }, "56": { defaultClass: "_1bzvwafq-3-6-0" }, "64": { defaultClass: "_1bzvwafr-3-6-0" } } }, columnGap: { values: { "0": { defaultClass: "_1bzvwafs-3-6-0" }, "2": { defaultClass: "_1bzvwaft-3-6-0" }, "4": { defaultClass: "_1bzvwafu-3-6-0" }, "6": { defaultClass: "_1bzvwafv-3-6-0" }, "8": { defaultClass: "_1bzvwafw-3-6-0" }, "12": { defaultClass: "_1bzvwafx-3-6-0" }, "16": { defaultClass: "_1bzvwafy-3-6-0" }, "20": { defaultClass: "_1bzvwafz-3-6-0" }, "24": { defaultClass: "_1bzvwaf10-3-6-0" }, "32": { defaultClass: "_1bzvwaf11-3-6-0" }, "40": { defaultClass: "_1bzvwaf12-3-6-0" }, "48": { defaultClass: "_1bzvwaf13-3-6-0" }, "56": { defaultClass: "_1bzvwaf14-3-6-0" }, "64": { defaultClass: "_1bzvwaf15-3-6-0" } } }, paddingTop: { values: { "0": { defaultClass: "_1bzvwaf16-3-6-0" }, "2": { defaultClass: "_1bzvwaf17-3-6-0" }, "4": { defaultClass: "_1bzvwaf18-3-6-0" }, "6": { defaultClass: "_1bzvwaf19-3-6-0" }, "8": { defaultClass: "_1bzvwaf1a-3-6-0" }, "12": { defaultClass: "_1bzvwaf1b-3-6-0" }, "16": { defaultClass: "_1bzvwaf1c-3-6-0" }, "20": { defaultClass: "_1bzvwaf1d-3-6-0" }, "24": { defaultClass: "_1bzvwaf1e-3-6-0" }, "32": { defaultClass: "_1bzvwaf1f-3-6-0" }, "40": { defaultClass: "_1bzvwaf1g-3-6-0" }, "48": { defaultClass: "_1bzvwaf1h-3-6-0" }, "56": { defaultClass: "_1bzvwaf1i-3-6-0" }, "64": { defaultClass: "_1bzvwaf1j-3-6-0" } } }, paddingBottom: { values: { "0": { defaultClass: "_1bzvwaf1k-3-6-0" }, "2": { defaultClass: "_1bzvwaf1l-3-6-0" }, "4": { defaultClass: "_1bzvwaf1m-3-6-0" }, "6": { defaultClass: "_1bzvwaf1n-3-6-0" }, "8": { defaultClass: "_1bzvwaf1o-3-6-0" }, "12": { defaultClass: "_1bzvwaf1p-3-6-0" }, "16": { defaultClass: "_1bzvwaf1q-3-6-0" }, "20": { defaultClass: "_1bzvwaf1r-3-6-0" }, "24": { defaultClass: "_1bzvwaf1s-3-6-0" }, "32": { defaultClass: "_1bzvwaf1t-3-6-0" }, "40": { defaultClass: "_1bzvwaf1u-3-6-0" }, "48": { defaultClass: "_1bzvwaf1v-3-6-0" }, "56": { defaultClass: "_1bzvwaf1w-3-6-0" }, "64": { defaultClass: "_1bzvwaf1x-3-6-0" } } }, paddingLeft: { values: { "0": { defaultClass: "_1bzvwaf1y-3-6-0" }, "2": { defaultClass: "_1bzvwaf1z-3-6-0" }, "4": { defaultClass: "_1bzvwaf20-3-6-0" }, "6": { defaultClass: "_1bzvwaf21-3-6-0" }, "8": { defaultClass: "_1bzvwaf22-3-6-0" }, "12": { defaultClass: "_1bzvwaf23-3-6-0" }, "16": { defaultClass: "_1bzvwaf24-3-6-0" }, "20": { defaultClass: "_1bzvwaf25-3-6-0" }, "24": { defaultClass: "_1bzvwaf26-3-6-0" }, "32": { defaultClass: "_1bzvwaf27-3-6-0" }, "40": { defaultClass: "_1bzvwaf28-3-6-0" }, "48": { defaultClass: "_1bzvwaf29-3-6-0" }, "56": { defaultClass: "_1bzvwaf2a-3-6-0" }, "64": { defaultClass: "_1bzvwaf2b-3-6-0" } } }, paddingRight: { values: { "0": { defaultClass: "_1bzvwaf2c-3-6-0" }, "2": { defaultClass: "_1bzvwaf2d-3-6-0" }, "4": { defaultClass: "_1bzvwaf2e-3-6-0" }, "6": { defaultClass: "_1bzvwaf2f-3-6-0" }, "8": { defaultClass: "_1bzvwaf2g-3-6-0" }, "12": { defaultClass: "_1bzvwaf2h-3-6-0" }, "16": { defaultClass: "_1bzvwaf2i-3-6-0" }, "20": { defaultClass: "_1bzvwaf2j-3-6-0" }, "24": { defaultClass: "_1bzvwaf2k-3-6-0" }, "32": { defaultClass: "_1bzvwaf2l-3-6-0" }, "40": { defaultClass: "_1bzvwaf2m-3-6-0" }, "48": { defaultClass: "_1bzvwaf2n-3-6-0" }, "56": { defaultClass: "_1bzvwaf2o-3-6-0" }, "64": { defaultClass: "_1bzvwaf2p-3-6-0" } } }, marginTop: { values: { "0": { defaultClass: "_1bzvwaf2q-3-6-0" }, "2": { defaultClass: "_1bzvwaf2r-3-6-0" }, "4": { defaultClass: "_1bzvwaf2s-3-6-0" }, "6": { defaultClass: "_1bzvwaf2t-3-6-0" }, "8": { defaultClass: "_1bzvwaf2u-3-6-0" }, "12": { defaultClass: "_1bzvwaf2v-3-6-0" }, "16": { defaultClass: "_1bzvwaf2w-3-6-0" }, "20": { defaultClass: "_1bzvwaf2x-3-6-0" }, "24": { defaultClass: "_1bzvwaf2y-3-6-0" }, "32": { defaultClass: "_1bzvwaf2z-3-6-0" }, "40": { defaultClass: "_1bzvwaf30-3-6-0" }, "48": { defaultClass: "_1bzvwaf31-3-6-0" }, "56": { defaultClass: "_1bzvwaf32-3-6-0" }, "64": { defaultClass: "_1bzvwaf33-3-6-0" }, auto: { defaultClass: "_1bzvwaf34-3-6-0" } } }, marginBottom: { values: { "0": { defaultClass: "_1bzvwaf35-3-6-0" }, "2": { defaultClass: "_1bzvwaf36-3-6-0" }, "4": { defaultClass: "_1bzvwaf37-3-6-0" }, "6": { defaultClass: "_1bzvwaf38-3-6-0" }, "8": { defaultClass: "_1bzvwaf39-3-6-0" }, "12": { defaultClass: "_1bzvwaf3a-3-6-0" }, "16": { defaultClass: "_1bzvwaf3b-3-6-0" }, "20": { defaultClass: "_1bzvwaf3c-3-6-0" }, "24": { defaultClass: "_1bzvwaf3d-3-6-0" }, "32": { defaultClass: "_1bzvwaf3e-3-6-0" }, "40": { defaultClass: "_1bzvwaf3f-3-6-0" }, "48": { defaultClass: "_1bzvwaf3g-3-6-0" }, "56": { defaultClass: "_1bzvwaf3h-3-6-0" }, "64": { defaultClass: "_1bzvwaf3i-3-6-0" }, auto: { defaultClass: "_1bzvwaf3j-3-6-0" } } }, marginLeft: { values: { "0": { defaultClass: "_1bzvwaf3k-3-6-0" }, "2": { defaultClass: "_1bzvwaf3l-3-6-0" }, "4": { defaultClass: "_1bzvwaf3m-3-6-0" }, "6": { defaultClass: "_1bzvwaf3n-3-6-0" }, "8": { defaultClass: "_1bzvwaf3o-3-6-0" }, "12": { defaultClass: "_1bzvwaf3p-3-6-0" }, "16": { defaultClass: "_1bzvwaf3q-3-6-0" }, "20": { defaultClass: "_1bzvwaf3r-3-6-0" }, "24": { defaultClass: "_1bzvwaf3s-3-6-0" }, "32": { defaultClass: "_1bzvwaf3t-3-6-0" }, "40": { defaultClass: "_1bzvwaf3u-3-6-0" }, "48": { defaultClass: "_1bzvwaf3v-3-6-0" }, "56": { defaultClass: "_1bzvwaf3w-3-6-0" }, "64": { defaultClass: "_1bzvwaf3x-3-6-0" }, auto: { defaultClass: "_1bzvwaf3y-3-6-0" } } }, marginRight: { values: { "0": { defaultClass: "_1bzvwaf3z-3-6-0" }, "2": { defaultClass: "_1bzvwaf40-3-6-0" }, "4": { defaultClass: "_1bzvwaf41-3-6-0" }, "6": { defaultClass: "_1bzvwaf42-3-6-0" }, "8": { defaultClass: "_1bzvwaf43-3-6-0" }, "12": { defaultClass: "_1bzvwaf44-3-6-0" }, "16": { defaultClass: "_1bzvwaf45-3-6-0" }, "20": { defaultClass: "_1bzvwaf46-3-6-0" }, "24": { defaultClass: "_1bzvwaf47-3-6-0" }, "32": { defaultClass: "_1bzvwaf48-3-6-0" }, "40": { defaultClass: "_1bzvwaf49-3-6-0" }, "48": { defaultClass: "_1bzvwaf4a-3-6-0" }, "56": { defaultClass: "_1bzvwaf4b-3-6-0" }, "64": { defaultClass: "_1bzvwaf4c-3-6-0" }, auto: { defaultClass: "_1bzvwaf4d-3-6-0" } } }, justifySelf: { values: { center: { defaultClass: "_1bzvwaf4e-3-6-0" }, end: { defaultClass: "_1bzvwaf4f-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf4g-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf4h-3-6-0" }, "self-end": { defaultClass: "_1bzvwaf4i-3-6-0" }, "self-start": { defaultClass: "_1bzvwaf4j-3-6-0" }, start: { defaultClass: "_1bzvwaf4k-3-6-0" }, auto: { defaultClass: "_1bzvwaf4l-3-6-0" }, baseline: { defaultClass: "_1bzvwaf4m-3-6-0" }, left: { defaultClass: "_1bzvwaf4n-3-6-0" }, normal: { defaultClass: "_1bzvwaf4o-3-6-0" }, right: { defaultClass: "_1bzvwaf4p-3-6-0" }, stretch: { defaultClass: "_1bzvwaf4q-3-6-0" } } }, alignSelf: { values: { center: { defaultClass: "_1bzvwaf4r-3-6-0" }, end: { defaultClass: "_1bzvwaf4s-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf4t-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf4u-3-6-0" }, "self-end": { defaultClass: "_1bzvwaf4v-3-6-0" }, "self-start": { defaultClass: "_1bzvwaf4w-3-6-0" }, start: { defaultClass: "_1bzvwaf4x-3-6-0" }, auto: { defaultClass: "_1bzvwaf4y-3-6-0" }, baseline: { defaultClass: "_1bzvwaf4z-3-6-0" }, normal: { defaultClass: "_1bzvwaf50-3-6-0" }, stretch: { defaultClass: "_1bzvwaf51-3-6-0" } } }, placeSelf: { values: { center: { defaultClass: "_1bzvwaf52-3-6-0" }, end: { defaultClass: "_1bzvwaf53-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf54-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf55-3-6-0" }, "self-end": { defaultClass: "_1bzvwaf56-3-6-0" }, "self-start": { defaultClass: "_1bzvwaf57-3-6-0" }, start: { defaultClass: "_1bzvwaf58-3-6-0" }, auto: { defaultClass: "_1bzvwaf59-3-6-0" }, baseline: { defaultClass: "_1bzvwaf5a-3-6-0" }, normal: { defaultClass: "_1bzvwaf5b-3-6-0" }, stretch: { defaultClass: "_1bzvwaf5c-3-6-0" } } }, justifyItems: { values: { center: { defaultClass: "_1bzvwaf5d-3-6-0" }, end: { defaultClass: "_1bzvwaf5e-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf5f-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf5g-3-6-0" }, "self-end": { defaultClass: "_1bzvwaf5h-3-6-0" }, "self-start": { defaultClass: "_1bzvwaf5i-3-6-0" }, start: { defaultClass: "_1bzvwaf5j-3-6-0" }, baseline: { defaultClass: "_1bzvwaf5k-3-6-0" }, left: { defaultClass: "_1bzvwaf5l-3-6-0" }, legacy: { defaultClass: "_1bzvwaf5m-3-6-0" }, normal: { defaultClass: "_1bzvwaf5n-3-6-0" }, right: { defaultClass: "_1bzvwaf5o-3-6-0" }, stretch: { defaultClass: "_1bzvwaf5p-3-6-0" } } }, alignItems: { values: { center: { defaultClass: "_1bzvwaf5q-3-6-0" }, end: { defaultClass: "_1bzvwaf5r-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf5s-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf5t-3-6-0" }, "self-end": { defaultClass: "_1bzvwaf5u-3-6-0" }, "self-start": { defaultClass: "_1bzvwaf5v-3-6-0" }, start: { defaultClass: "_1bzvwaf5w-3-6-0" }, baseline: { defaultClass: "_1bzvwaf5x-3-6-0" }, normal: { defaultClass: "_1bzvwaf5y-3-6-0" }, stretch: { defaultClass: "_1bzvwaf5z-3-6-0" } } }, placeItems: { values: { center: { defaultClass: "_1bzvwaf60-3-6-0" }, end: { defaultClass: "_1bzvwaf61-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf62-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf63-3-6-0" }, "self-end": { defaultClass: "_1bzvwaf64-3-6-0" }, "self-start": { defaultClass: "_1bzvwaf65-3-6-0" }, start: { defaultClass: "_1bzvwaf66-3-6-0" }, baseline: { defaultClass: "_1bzvwaf67-3-6-0" }, normal: { defaultClass: "_1bzvwaf68-3-6-0" }, stretch: { defaultClass: "_1bzvwaf69-3-6-0" } } }, justifyContent: { values: { "space-around": { defaultClass: "_1bzvwaf6a-3-6-0" }, "space-between": { defaultClass: "_1bzvwaf6b-3-6-0" }, "space-evenly": { defaultClass: "_1bzvwaf6c-3-6-0" }, stretch: { defaultClass: "_1bzvwaf6d-3-6-0" }, center: { defaultClass: "_1bzvwaf6e-3-6-0" }, end: { defaultClass: "_1bzvwaf6f-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf6g-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf6h-3-6-0" }, start: { defaultClass: "_1bzvwaf6i-3-6-0" }, left: { defaultClass: "_1bzvwaf6j-3-6-0" }, normal: { defaultClass: "_1bzvwaf6k-3-6-0" }, right: { defaultClass: "_1bzvwaf6l-3-6-0" } } }, alignContent: { values: { "space-around": { defaultClass: "_1bzvwaf6m-3-6-0" }, "space-between": { defaultClass: "_1bzvwaf6n-3-6-0" }, "space-evenly": { defaultClass: "_1bzvwaf6o-3-6-0" }, stretch: { defaultClass: "_1bzvwaf6p-3-6-0" }, center: { defaultClass: "_1bzvwaf6q-3-6-0" }, end: { defaultClass: "_1bzvwaf6r-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf6s-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf6t-3-6-0" }, start: { defaultClass: "_1bzvwaf6u-3-6-0" }, baseline: { defaultClass: "_1bzvwaf6v-3-6-0" }, normal: { defaultClass: "_1bzvwaf6w-3-6-0" } } }, placeContent: { values: { "space-around": { defaultClass: "_1bzvwaf6x-3-6-0" }, "space-between": { defaultClass: "_1bzvwaf6y-3-6-0" }, "space-evenly": { defaultClass: "_1bzvwaf6z-3-6-0" }, stretch: { defaultClass: "_1bzvwaf70-3-6-0" }, center: { defaultClass: "_1bzvwaf71-3-6-0" }, end: { defaultClass: "_1bzvwaf72-3-6-0" }, "flex-end": { defaultClass: "_1bzvwaf73-3-6-0" }, "flex-start": { defaultClass: "_1bzvwaf74-3-6-0" }, start: { defaultClass: "_1bzvwaf75-3-6-0" }, baseline: { defaultClass: "_1bzvwaf76-3-6-0" }, normal: { defaultClass: "_1bzvwaf77-3-6-0" } } }, display: { values: { flex: { defaultClass: "_1bzvwaf78-3-6-0" }, grid: { defaultClass: "_1bzvwaf79-3-6-0" } } } } };
+var globalSprinkleProperties = { conditions: void 0, styles: { gap: { values: { "0": { defaultClass: "_1bzvwaf0-3-7-0" }, "2": { defaultClass: "_1bzvwaf1-3-7-0" }, "4": { defaultClass: "_1bzvwaf2-3-7-0" }, "6": { defaultClass: "_1bzvwaf3-3-7-0" }, "8": { defaultClass: "_1bzvwaf4-3-7-0" }, "12": { defaultClass: "_1bzvwaf5-3-7-0" }, "16": { defaultClass: "_1bzvwaf6-3-7-0" }, "20": { defaultClass: "_1bzvwaf7-3-7-0" }, "24": { defaultClass: "_1bzvwaf8-3-7-0" }, "32": { defaultClass: "_1bzvwaf9-3-7-0" }, "40": { defaultClass: "_1bzvwafa-3-7-0" }, "48": { defaultClass: "_1bzvwafb-3-7-0" }, "56": { defaultClass: "_1bzvwafc-3-7-0" }, "64": { defaultClass: "_1bzvwafd-3-7-0" } } }, rowGap: { values: { "0": { defaultClass: "_1bzvwafe-3-7-0" }, "2": { defaultClass: "_1bzvwaff-3-7-0" }, "4": { defaultClass: "_1bzvwafg-3-7-0" }, "6": { defaultClass: "_1bzvwafh-3-7-0" }, "8": { defaultClass: "_1bzvwafi-3-7-0" }, "12": { defaultClass: "_1bzvwafj-3-7-0" }, "16": { defaultClass: "_1bzvwafk-3-7-0" }, "20": { defaultClass: "_1bzvwafl-3-7-0" }, "24": { defaultClass: "_1bzvwafm-3-7-0" }, "32": { defaultClass: "_1bzvwafn-3-7-0" }, "40": { defaultClass: "_1bzvwafo-3-7-0" }, "48": { defaultClass: "_1bzvwafp-3-7-0" }, "56": { defaultClass: "_1bzvwafq-3-7-0" }, "64": { defaultClass: "_1bzvwafr-3-7-0" } } }, columnGap: { values: { "0": { defaultClass: "_1bzvwafs-3-7-0" }, "2": { defaultClass: "_1bzvwaft-3-7-0" }, "4": { defaultClass: "_1bzvwafu-3-7-0" }, "6": { defaultClass: "_1bzvwafv-3-7-0" }, "8": { defaultClass: "_1bzvwafw-3-7-0" }, "12": { defaultClass: "_1bzvwafx-3-7-0" }, "16": { defaultClass: "_1bzvwafy-3-7-0" }, "20": { defaultClass: "_1bzvwafz-3-7-0" }, "24": { defaultClass: "_1bzvwaf10-3-7-0" }, "32": { defaultClass: "_1bzvwaf11-3-7-0" }, "40": { defaultClass: "_1bzvwaf12-3-7-0" }, "48": { defaultClass: "_1bzvwaf13-3-7-0" }, "56": { defaultClass: "_1bzvwaf14-3-7-0" }, "64": { defaultClass: "_1bzvwaf15-3-7-0" } } }, paddingTop: { values: { "0": { defaultClass: "_1bzvwaf16-3-7-0" }, "2": { defaultClass: "_1bzvwaf17-3-7-0" }, "4": { defaultClass: "_1bzvwaf18-3-7-0" }, "6": { defaultClass: "_1bzvwaf19-3-7-0" }, "8": { defaultClass: "_1bzvwaf1a-3-7-0" }, "12": { defaultClass: "_1bzvwaf1b-3-7-0" }, "16": { defaultClass: "_1bzvwaf1c-3-7-0" }, "20": { defaultClass: "_1bzvwaf1d-3-7-0" }, "24": { defaultClass: "_1bzvwaf1e-3-7-0" }, "32": { defaultClass: "_1bzvwaf1f-3-7-0" }, "40": { defaultClass: "_1bzvwaf1g-3-7-0" }, "48": { defaultClass: "_1bzvwaf1h-3-7-0" }, "56": { defaultClass: "_1bzvwaf1i-3-7-0" }, "64": { defaultClass: "_1bzvwaf1j-3-7-0" } } }, paddingBottom: { values: { "0": { defaultClass: "_1bzvwaf1k-3-7-0" }, "2": { defaultClass: "_1bzvwaf1l-3-7-0" }, "4": { defaultClass: "_1bzvwaf1m-3-7-0" }, "6": { defaultClass: "_1bzvwaf1n-3-7-0" }, "8": { defaultClass: "_1bzvwaf1o-3-7-0" }, "12": { defaultClass: "_1bzvwaf1p-3-7-0" }, "16": { defaultClass: "_1bzvwaf1q-3-7-0" }, "20": { defaultClass: "_1bzvwaf1r-3-7-0" }, "24": { defaultClass: "_1bzvwaf1s-3-7-0" }, "32": { defaultClass: "_1bzvwaf1t-3-7-0" }, "40": { defaultClass: "_1bzvwaf1u-3-7-0" }, "48": { defaultClass: "_1bzvwaf1v-3-7-0" }, "56": { defaultClass: "_1bzvwaf1w-3-7-0" }, "64": { defaultClass: "_1bzvwaf1x-3-7-0" } } }, paddingLeft: { values: { "0": { defaultClass: "_1bzvwaf1y-3-7-0" }, "2": { defaultClass: "_1bzvwaf1z-3-7-0" }, "4": { defaultClass: "_1bzvwaf20-3-7-0" }, "6": { defaultClass: "_1bzvwaf21-3-7-0" }, "8": { defaultClass: "_1bzvwaf22-3-7-0" }, "12": { defaultClass: "_1bzvwaf23-3-7-0" }, "16": { defaultClass: "_1bzvwaf24-3-7-0" }, "20": { defaultClass: "_1bzvwaf25-3-7-0" }, "24": { defaultClass: "_1bzvwaf26-3-7-0" }, "32": { defaultClass: "_1bzvwaf27-3-7-0" }, "40": { defaultClass: "_1bzvwaf28-3-7-0" }, "48": { defaultClass: "_1bzvwaf29-3-7-0" }, "56": { defaultClass: "_1bzvwaf2a-3-7-0" }, "64": { defaultClass: "_1bzvwaf2b-3-7-0" } } }, paddingRight: { values: { "0": { defaultClass: "_1bzvwaf2c-3-7-0" }, "2": { defaultClass: "_1bzvwaf2d-3-7-0" }, "4": { defaultClass: "_1bzvwaf2e-3-7-0" }, "6": { defaultClass: "_1bzvwaf2f-3-7-0" }, "8": { defaultClass: "_1bzvwaf2g-3-7-0" }, "12": { defaultClass: "_1bzvwaf2h-3-7-0" }, "16": { defaultClass: "_1bzvwaf2i-3-7-0" }, "20": { defaultClass: "_1bzvwaf2j-3-7-0" }, "24": { defaultClass: "_1bzvwaf2k-3-7-0" }, "32": { defaultClass: "_1bzvwaf2l-3-7-0" }, "40": { defaultClass: "_1bzvwaf2m-3-7-0" }, "48": { defaultClass: "_1bzvwaf2n-3-7-0" }, "56": { defaultClass: "_1bzvwaf2o-3-7-0" }, "64": { defaultClass: "_1bzvwaf2p-3-7-0" } } }, marginTop: { values: { "0": { defaultClass: "_1bzvwaf2q-3-7-0" }, "2": { defaultClass: "_1bzvwaf2r-3-7-0" }, "4": { defaultClass: "_1bzvwaf2s-3-7-0" }, "6": { defaultClass: "_1bzvwaf2t-3-7-0" }, "8": { defaultClass: "_1bzvwaf2u-3-7-0" }, "12": { defaultClass: "_1bzvwaf2v-3-7-0" }, "16": { defaultClass: "_1bzvwaf2w-3-7-0" }, "20": { defaultClass: "_1bzvwaf2x-3-7-0" }, "24": { defaultClass: "_1bzvwaf2y-3-7-0" }, "32": { defaultClass: "_1bzvwaf2z-3-7-0" }, "40": { defaultClass: "_1bzvwaf30-3-7-0" }, "48": { defaultClass: "_1bzvwaf31-3-7-0" }, "56": { defaultClass: "_1bzvwaf32-3-7-0" }, "64": { defaultClass: "_1bzvwaf33-3-7-0" }, auto: { defaultClass: "_1bzvwaf34-3-7-0" } } }, marginBottom: { values: { "0": { defaultClass: "_1bzvwaf35-3-7-0" }, "2": { defaultClass: "_1bzvwaf36-3-7-0" }, "4": { defaultClass: "_1bzvwaf37-3-7-0" }, "6": { defaultClass: "_1bzvwaf38-3-7-0" }, "8": { defaultClass: "_1bzvwaf39-3-7-0" }, "12": { defaultClass: "_1bzvwaf3a-3-7-0" }, "16": { defaultClass: "_1bzvwaf3b-3-7-0" }, "20": { defaultClass: "_1bzvwaf3c-3-7-0" }, "24": { defaultClass: "_1bzvwaf3d-3-7-0" }, "32": { defaultClass: "_1bzvwaf3e-3-7-0" }, "40": { defaultClass: "_1bzvwaf3f-3-7-0" }, "48": { defaultClass: "_1bzvwaf3g-3-7-0" }, "56": { defaultClass: "_1bzvwaf3h-3-7-0" }, "64": { defaultClass: "_1bzvwaf3i-3-7-0" }, auto: { defaultClass: "_1bzvwaf3j-3-7-0" } } }, marginLeft: { values: { "0": { defaultClass: "_1bzvwaf3k-3-7-0" }, "2": { defaultClass: "_1bzvwaf3l-3-7-0" }, "4": { defaultClass: "_1bzvwaf3m-3-7-0" }, "6": { defaultClass: "_1bzvwaf3n-3-7-0" }, "8": { defaultClass: "_1bzvwaf3o-3-7-0" }, "12": { defaultClass: "_1bzvwaf3p-3-7-0" }, "16": { defaultClass: "_1bzvwaf3q-3-7-0" }, "20": { defaultClass: "_1bzvwaf3r-3-7-0" }, "24": { defaultClass: "_1bzvwaf3s-3-7-0" }, "32": { defaultClass: "_1bzvwaf3t-3-7-0" }, "40": { defaultClass: "_1bzvwaf3u-3-7-0" }, "48": { defaultClass: "_1bzvwaf3v-3-7-0" }, "56": { defaultClass: "_1bzvwaf3w-3-7-0" }, "64": { defaultClass: "_1bzvwaf3x-3-7-0" }, auto: { defaultClass: "_1bzvwaf3y-3-7-0" } } }, marginRight: { values: { "0": { defaultClass: "_1bzvwaf3z-3-7-0" }, "2": { defaultClass: "_1bzvwaf40-3-7-0" }, "4": { defaultClass: "_1bzvwaf41-3-7-0" }, "6": { defaultClass: "_1bzvwaf42-3-7-0" }, "8": { defaultClass: "_1bzvwaf43-3-7-0" }, "12": { defaultClass: "_1bzvwaf44-3-7-0" }, "16": { defaultClass: "_1bzvwaf45-3-7-0" }, "20": { defaultClass: "_1bzvwaf46-3-7-0" }, "24": { defaultClass: "_1bzvwaf47-3-7-0" }, "32": { defaultClass: "_1bzvwaf48-3-7-0" }, "40": { defaultClass: "_1bzvwaf49-3-7-0" }, "48": { defaultClass: "_1bzvwaf4a-3-7-0" }, "56": { defaultClass: "_1bzvwaf4b-3-7-0" }, "64": { defaultClass: "_1bzvwaf4c-3-7-0" }, auto: { defaultClass: "_1bzvwaf4d-3-7-0" } } }, justifySelf: { values: { center: { defaultClass: "_1bzvwaf4e-3-7-0" }, end: { defaultClass: "_1bzvwaf4f-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf4g-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf4h-3-7-0" }, "self-end": { defaultClass: "_1bzvwaf4i-3-7-0" }, "self-start": { defaultClass: "_1bzvwaf4j-3-7-0" }, start: { defaultClass: "_1bzvwaf4k-3-7-0" }, auto: { defaultClass: "_1bzvwaf4l-3-7-0" }, baseline: { defaultClass: "_1bzvwaf4m-3-7-0" }, left: { defaultClass: "_1bzvwaf4n-3-7-0" }, normal: { defaultClass: "_1bzvwaf4o-3-7-0" }, right: { defaultClass: "_1bzvwaf4p-3-7-0" }, stretch: { defaultClass: "_1bzvwaf4q-3-7-0" } } }, alignSelf: { values: { center: { defaultClass: "_1bzvwaf4r-3-7-0" }, end: { defaultClass: "_1bzvwaf4s-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf4t-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf4u-3-7-0" }, "self-end": { defaultClass: "_1bzvwaf4v-3-7-0" }, "self-start": { defaultClass: "_1bzvwaf4w-3-7-0" }, start: { defaultClass: "_1bzvwaf4x-3-7-0" }, auto: { defaultClass: "_1bzvwaf4y-3-7-0" }, baseline: { defaultClass: "_1bzvwaf4z-3-7-0" }, normal: { defaultClass: "_1bzvwaf50-3-7-0" }, stretch: { defaultClass: "_1bzvwaf51-3-7-0" } } }, placeSelf: { values: { center: { defaultClass: "_1bzvwaf52-3-7-0" }, end: { defaultClass: "_1bzvwaf53-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf54-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf55-3-7-0" }, "self-end": { defaultClass: "_1bzvwaf56-3-7-0" }, "self-start": { defaultClass: "_1bzvwaf57-3-7-0" }, start: { defaultClass: "_1bzvwaf58-3-7-0" }, auto: { defaultClass: "_1bzvwaf59-3-7-0" }, baseline: { defaultClass: "_1bzvwaf5a-3-7-0" }, normal: { defaultClass: "_1bzvwaf5b-3-7-0" }, stretch: { defaultClass: "_1bzvwaf5c-3-7-0" } } }, justifyItems: { values: { center: { defaultClass: "_1bzvwaf5d-3-7-0" }, end: { defaultClass: "_1bzvwaf5e-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf5f-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf5g-3-7-0" }, "self-end": { defaultClass: "_1bzvwaf5h-3-7-0" }, "self-start": { defaultClass: "_1bzvwaf5i-3-7-0" }, start: { defaultClass: "_1bzvwaf5j-3-7-0" }, baseline: { defaultClass: "_1bzvwaf5k-3-7-0" }, left: { defaultClass: "_1bzvwaf5l-3-7-0" }, legacy: { defaultClass: "_1bzvwaf5m-3-7-0" }, normal: { defaultClass: "_1bzvwaf5n-3-7-0" }, right: { defaultClass: "_1bzvwaf5o-3-7-0" }, stretch: { defaultClass: "_1bzvwaf5p-3-7-0" } } }, alignItems: { values: { center: { defaultClass: "_1bzvwaf5q-3-7-0" }, end: { defaultClass: "_1bzvwaf5r-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf5s-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf5t-3-7-0" }, "self-end": { defaultClass: "_1bzvwaf5u-3-7-0" }, "self-start": { defaultClass: "_1bzvwaf5v-3-7-0" }, start: { defaultClass: "_1bzvwaf5w-3-7-0" }, baseline: { defaultClass: "_1bzvwaf5x-3-7-0" }, normal: { defaultClass: "_1bzvwaf5y-3-7-0" }, stretch: { defaultClass: "_1bzvwaf5z-3-7-0" } } }, placeItems: { values: { center: { defaultClass: "_1bzvwaf60-3-7-0" }, end: { defaultClass: "_1bzvwaf61-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf62-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf63-3-7-0" }, "self-end": { defaultClass: "_1bzvwaf64-3-7-0" }, "self-start": { defaultClass: "_1bzvwaf65-3-7-0" }, start: { defaultClass: "_1bzvwaf66-3-7-0" }, baseline: { defaultClass: "_1bzvwaf67-3-7-0" }, normal: { defaultClass: "_1bzvwaf68-3-7-0" }, stretch: { defaultClass: "_1bzvwaf69-3-7-0" } } }, justifyContent: { values: { "space-around": { defaultClass: "_1bzvwaf6a-3-7-0" }, "space-between": { defaultClass: "_1bzvwaf6b-3-7-0" }, "space-evenly": { defaultClass: "_1bzvwaf6c-3-7-0" }, stretch: { defaultClass: "_1bzvwaf6d-3-7-0" }, center: { defaultClass: "_1bzvwaf6e-3-7-0" }, end: { defaultClass: "_1bzvwaf6f-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf6g-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf6h-3-7-0" }, start: { defaultClass: "_1bzvwaf6i-3-7-0" }, left: { defaultClass: "_1bzvwaf6j-3-7-0" }, normal: { defaultClass: "_1bzvwaf6k-3-7-0" }, right: { defaultClass: "_1bzvwaf6l-3-7-0" } } }, alignContent: { values: { "space-around": { defaultClass: "_1bzvwaf6m-3-7-0" }, "space-between": { defaultClass: "_1bzvwaf6n-3-7-0" }, "space-evenly": { defaultClass: "_1bzvwaf6o-3-7-0" }, stretch: { defaultClass: "_1bzvwaf6p-3-7-0" }, center: { defaultClass: "_1bzvwaf6q-3-7-0" }, end: { defaultClass: "_1bzvwaf6r-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf6s-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf6t-3-7-0" }, start: { defaultClass: "_1bzvwaf6u-3-7-0" }, baseline: { defaultClass: "_1bzvwaf6v-3-7-0" }, normal: { defaultClass: "_1bzvwaf6w-3-7-0" } } }, placeContent: { values: { "space-around": { defaultClass: "_1bzvwaf6x-3-7-0" }, "space-between": { defaultClass: "_1bzvwaf6y-3-7-0" }, "space-evenly": { defaultClass: "_1bzvwaf6z-3-7-0" }, stretch: { defaultClass: "_1bzvwaf70-3-7-0" }, center: { defaultClass: "_1bzvwaf71-3-7-0" }, end: { defaultClass: "_1bzvwaf72-3-7-0" }, "flex-end": { defaultClass: "_1bzvwaf73-3-7-0" }, "flex-start": { defaultClass: "_1bzvwaf74-3-7-0" }, start: { defaultClass: "_1bzvwaf75-3-7-0" }, baseline: { defaultClass: "_1bzvwaf76-3-7-0" }, normal: { defaultClass: "_1bzvwaf77-3-7-0" } } }, display: { values: { flex: { defaultClass: "_1bzvwaf78-3-7-0" }, grid: { defaultClass: "_1bzvwaf79-3-7-0" } } } } };
 var internalSprinkles = (0, import_createRuntimeSprinkles.createSprinkles)(globalSprinkleProperties);

package/styles/textStyle.css

@@ -1,4 +1,4 @@
-._da9a8v7-3-6-0 {
+._da9a8v7-3-7-0 {
   font-family: var(--dt-typography-code-base-default-family, Roboto Mono,monospace);
   font-weight: var(--dt-typography-code-base-default-weight, 400);
   font-size: var(--dt-typography-code-base-default-size, 14px);
@@ -6,7 +6,7 @@
   text-decoration: var(--dt-typography-code-base-default-text-decoration, none);
   text-transform: var(--dt-typography-code-base-default-text-transform, none);
 }
-._da9a8v8-3-6-0 {
+._da9a8v8-3-7-0 {
   font-family: var(--dt-typography-code-base-emphasized-family, Roboto Mono,monospace);
   font-weight: var(--dt-typography-code-base-emphasized-weight, 500);
   font-size: var(--dt-typography-code-base-emphasized-size, 14px);
@@ -14,7 +14,7 @@
   text-decoration: var(--dt-typography-code-base-emphasized-text-decoration, none);
   text-transform: var(--dt-typography-code-base-emphasized-text-transform, none);
 }
-._da9a8v9-3-6-0 {
+._da9a8v9-3-7-0 {
   font-family: var(--dt-typography-code-small-default-family, Roboto Mono,monospace);
   font-weight: var(--dt-typography-code-small-default-weight, 400);
   font-size: var(--dt-typography-code-small-default-size, 12px);
@@ -22,7 +22,7 @@
   text-decoration: var(--dt-typography-code-small-default-text-decoration, none);
   text-transform: var(--dt-typography-code-small-default-text-transform, none);
 }
-._da9a8va-3-6-0 {
+._da9a8va-3-7-0 {
   font-family: var(--dt-typography-code-small-emphasized-family, Roboto Mono,monospace);
   font-weight: var(--dt-typography-code-small-emphasized-weight, 500);
   font-size: var(--dt-typography-code-small-emphasized-size, 12px);
@@ -30,7 +30,7 @@
   text-decoration: var(--dt-typography-code-small-emphasized-text-decoration, none);
   text-transform: var(--dt-typography-code-small-emphasized-text-transform, none);
 }
-._da9a8vb-3-6-0 {
+._da9a8vb-3-7-0 {
   font-family: var(--dt-typography-text-base-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-weight: var(--dt-typography-text-base-default-weight, 400);
   font-size: var(--dt-typography-text-base-default-size, 14px);
@@ -38,7 +38,7 @@
   text-decoration: var(--dt-typography-text-base-default-text-decoration, none);
   text-transform: var(--dt-typography-text-base-default-text-transform, none);
 }
-._da9a8vc-3-6-0 {
+._da9a8vc-3-7-0 {
   font-family: var(--dt-typography-text-base-emphasized-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-weight: var(--dt-typography-text-base-emphasized-weight, 500);
   font-size: var(--dt-typography-text-base-emphasized-size, 14px);
@@ -46,7 +46,7 @@
   text-decoration: var(--dt-typography-text-base-emphasized-text-decoration, none);
   text-transform: var(--dt-typography-text-base-emphasized-text-transform, none);
 }
-._da9a8vd-3-6-0 {
+._da9a8vd-3-7-0 {
   font-family: var(--dt-typography-text-small-default-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-weight: var(--dt-typography-text-small-default-weight, 400);
   font-size: var(--dt-typography-text-small-default-size, 12px);
@@ -54,7 +54,7 @@
   text-decoration: var(--dt-typography-text-small-default-text-decoration, none);
   text-transform: var(--dt-typography-text-small-default-text-transform, none);
 }
-._da9a8ve-3-6-0 {
+._da9a8ve-3-7-0 {
   font-family: var(--dt-typography-text-small-emphasized-family, DynatraceFlow,Roboto,Helvetica,sans-serif);
   font-weight: var(--dt-typography-text-small-emphasized-weight, 500);
   font-size: var(--dt-typography-text-small-emphasized-size, 12px);

package/styles/textStyle.sty.js

@@ -22,4 +22,4 @@ __export(textStyle_css_exports, {
 module.exports = __toCommonJS(textStyle_css_exports);
 var import_textStyle_css_ts_vanilla = require("./textStyle.css");
 var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
-var textStyle = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_da9a8v0-3-6-0", variantClassNames: { fontStyle: { code: "_da9a8v1-3-6-0", text: "_da9a8v2-3-6-0" }, textStyle: { base: "_da9a8v3-3-6-0", "base-emphasized": "_da9a8v4-3-6-0", small: "_da9a8v5-3-6-0", "small-emphasized": "_da9a8v6-3-6-0" } }, defaultVariants: { fontStyle: "text", textStyle: "base" }, compoundVariants: [[{ fontStyle: "code", textStyle: "base" }, "_da9a8v7-3-6-0"], [{ fontStyle: "code", textStyle: "base-emphasized" }, "_da9a8v8-3-6-0"], [{ fontStyle: "code", textStyle: "small" }, "_da9a8v9-3-6-0"], [{ fontStyle: "code", textStyle: "small-emphasized" }, "_da9a8va-3-6-0"], [{ fontStyle: "text", textStyle: "base" }, "_da9a8vb-3-6-0"], [{ fontStyle: "text", textStyle: "base-emphasized" }, "_da9a8vc-3-6-0"], [{ fontStyle: "text", textStyle: "small" }, "_da9a8vd-3-6-0"], [{ fontStyle: "text", textStyle: "small-emphasized" }, "_da9a8ve-3-6-0"]] });
+var textStyle = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_da9a8v0-3-7-0", variantClassNames: { fontStyle: { code: "_da9a8v1-3-7-0", text: "_da9a8v2-3-7-0" }, textStyle: { base: "_da9a8v3-3-7-0", "base-emphasized": "_da9a8v4-3-7-0", small: "_da9a8v5-3-7-0", "small-emphasized": "_da9a8v6-3-7-0" } }, defaultVariants: { fontStyle: "text", textStyle: "base" }, compoundVariants: [[{ fontStyle: "code", textStyle: "base" }, "_da9a8v7-3-7-0"], [{ fontStyle: "code", textStyle: "base-emphasized" }, "_da9a8v8-3-7-0"], [{ fontStyle: "code", textStyle: "small" }, "_da9a8v9-3-7-0"], [{ fontStyle: "code", textStyle: "small-emphasized" }, "_da9a8va-3-7-0"], [{ fontStyle: "text", textStyle: "base" }, "_da9a8vb-3-7-0"], [{ fontStyle: "text", textStyle: "base-emphasized" }, "_da9a8vc-3-7-0"], [{ fontStyle: "text", textStyle: "small" }, "_da9a8vd-3-7-0"], [{ fontStyle: "text", textStyle: "small-emphasized" }, "_da9a8ve-3-7-0"]] });

package/tables/DataTable/DataTable.css

@@ -1,4 +1,4 @@
-._14sp6az0-3-6-0 {
+._14sp6az0-3-7-0 {
   display: flex;
   flex-direction: column;
   height: 100%;
@@ -7,7 +7,7 @@
   max-height: 100%;
   max-width: max-content;
 }
-._14sp6az1-3-6-0 {
+._14sp6az1-3-7-0 {
   flex-grow: 1;
   flex-shrink: 1;
   flex-basis: 100%;

package/tables/DataTable/DataTable.d.ts

@@ -2,23 +2,24 @@ import { type PropsWithChildren } from 'react';
 import { DataTableDevTools } from './features/DevTools.js';
 import { DataTableDownload } from './features/Download/Download.js';
 import { DataTableGlobalLineWrapAction } from './features/LineWrap/LineWrap.js';
-import { DataTablePagination } from './features/Pagination/Pagination.js';
-import { DataTableExpandableRowTemplate, DataTableExpandableRowWrapper } from './features/RowDetails/RowDetails.js';
+import { DataTablePagination } from './features/Pagination/usePagination.js';
+import { DataTableExpandableRowWrapper } from './features/RowDetails/components/ExpandableRowWrapper.js';
+import { DataTableExpandableRowTemplate } from './features/RowDetails/RowDetails.js';
 import { DataTableCellActions } from './features/UserActions/CellActions.js';
 import { DataTableColumnActions } from './features/UserActions/ColumnActions.js';
 import { DataTableRowActions } from './features/UserActions/RowActions.js';
-import type { DataTableProps, DataTableRef } from './public.api.js';
+import type { DataTableProps, DataTableRef, DataTableRowData } from './public.api.js';
 /**
  * The `DataTable` is a component for building tables which organize information
  * into rows and columns.
  * @public
  */
-export declare const DataTable: (<TData, TValue>(props: PropsWithChildren<DataTableProps<TData>> & import("react").RefAttributes<DataTableRef>) => import("react").ReactElement | null) & {
+export declare const DataTable: (<TData extends DataTableRowData>(props: PropsWithChildren<DataTableProps<TData>> & import("react").RefAttributes<DataTableRef>) => import("react").ReactElement | null) & {
     Pagination: typeof DataTablePagination;
     ColumnActions: typeof DataTableColumnActions;
     CellActions: typeof DataTableCellActions;
     RowActions: typeof DataTableRowActions;
-    SelectedRowsActions: <TData extends import("./row-data-types.js").DataTableRowData>(props: import("../index.js").DataTableSelectedRowsActionsProps<TData> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;
+    SelectedRowsActions: <TData extends DataTableRowData>(props: import("../index.js").DataTableSelectedRowsActionsProps<TData> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;
     DefaultCell: (props: import("../../index.js").WithChildren & import("../../index.js").StylingProps & import("../../index.js").DataTestId & import("react").HTMLAttributes<HTMLDivElement> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;
     EmptyState: (props: import("../../index.js").WithChildren & import("../../index.js").StylingProps & import("../../index.js").DataTestId & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;
     TableActions: (props: import("../../index.js").WithChildren & import("../../index.js").StylingProps & import("../../index.js").DataTestId & import("../../index.js").BehaviorTrackingProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement | null;

package/tables/DataTable/DataTable.js

@@ -31,15 +31,12 @@ __export(DataTable_exports, {
 });
 module.exports = __toCommonJS(DataTable_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
+var import_react_table = require("@tanstack/react-table");
 var import_clsx = __toESM(require("clsx"));
 var import_react = require("react");
+var import_useDataTableConfig = require("../hooks/useDataTableConfig.js");
 var import_DataTableDefaultCell = require("./components/DataTableDefaultCell.js");
 var import_DataTableEmptyState = require("./components/DataTableEmptyState.js");
-var import_useAriaLabelingProps = require("../../core/hooks/useAriaLabelingProps.js");
-var import_useBehavioralTrackingProps = require("../../core/hooks/useBehavioralTrackingProps.js");
-var import_useMergeRefs = require("../../core/hooks/useMergeRefs.js");
-var import_Grid = require("../../layouts/grid/Grid.js");
-var import_useDataTableConfig = require("../hooks/useDataTableConfig.js");
 var import_DataTableVirtualizationContainer = require("./components/DataTableVirtualizationContainer.js");
 var import_DataTableSelectedRowsActions = require("./components/TableActions/DataTableSelectedRowsActions.js");
 var import_DataTableSelectionChip = require("./components/TableActions/DataTableSelectionChip.js");
@@ -52,50 +49,61 @@ var import_DataTableColumnSettingsTrigger = require("./components/Toolbar/Column
 var import_DataTableColumnVisibilitySettings = require("./components/Toolbar/ColumnSettings/DataTableColumnVisibilitySettings.js");
 var import_DataTableToolbar = require("./components/Toolbar/DataTableToolbar.js");
 var import_DataTableContext = require("./contexts/DataTableContext.js");
-var import_core_row_model = require("./core-row-model.js");
 var styles = __toESM(require("./DataTable.sty.js"));
 var import_ColumnFontStyle = require("./features/ColumnFontStyle/ColumnFontStyle.js");
-var import_ColumnOrder = require("./features/ColumnOrder/ColumnOrder.js");
-var import_ColumnPinning = require("./features/ColumnPinning/ColumnPinning.js");
-var import_ColumnSizing = require("./features/ColumnSizing/ColumnSizing.js");
-var import_ColumnVisibility = require("./features/ColumnVisibility/ColumnVisibility.js");
+var import_useColumnOrder = require("./features/ColumnOrder/useColumnOrder.js");
+var import_useColumnPinning = require("./features/ColumnPinning/useColumnPinning.js");
+var import_useColumnSizing = require("./features/ColumnSizing/useColumnSizing.js");
+var import_useColumnVisibility = require("./features/ColumnVisibility/useColumnVisibility.js");
 var import_Config = require("./features/Config.js");
 var import_DevTools = require("./features/DevTools.js");
 var import_Download = require("./features/Download/Download.js");
-var import_GanttChart = require("./features/GanttChart/GanttChart.js");
-var import_Layout = require("./features/Layout/Layout.js");
+var import_useDownload = require("./features/Download/useDownload.js");
+var import_features = require("./features/features.js");
+var import_useGanttChart = require("./features/GanttChart/useGanttChart.js");
+var import_useLayout = require("./features/Layout/useLayout.js");
 var import_LineWrap = require("./features/LineWrap/LineWrap.js");
-var import_LoadingState = require("./features/LoadingState/LoadingState.js");
+var import_useLineWrap = require("./features/LineWrap/useLineWrap.js");
+var import_useLoadingState = require("./features/LoadingState/useLoadingState.js");
 var import_MeterBarChart = require("./features/MeterBarChart/MeterBarChart.js");
-var import_Pagination = require("./features/Pagination/Pagination.js");
+var import_pagination_row_model = require("./features/Pagination/pagination-row-model.js");
 var import_PaginationInternal = require("./features/Pagination/PaginationInternal.js");
+var import_usePagination = require("./features/Pagination/usePagination.js");
+var import_useAriaLabelingProps = require("../../core/hooks/useAriaLabelingProps.js");
+var import_useBehavioralTrackingProps = require("../../core/hooks/useBehavioralTrackingProps.js");
+var import_useMergeRefs = require("../../core/hooks/useMergeRefs.js");
+var import_Grid = require("../../layouts/grid/Grid.js");
+var import_ExpandableRowWrapper = require("./features/RowDetails/components/ExpandableRowWrapper.js");
+var import_details_row_model = require("./features/RowDetails/details-row-model.js");
 var import_RowDetails = require("./features/RowDetails/RowDetails.js");
 var import_RowIdentification = require("./features/RowIdentification/RowIdentification.js");
-var import_RowInteractivity = require("./features/RowInteractivity/RowInteractivity.js");
-var import_RowOrder = require("./features/RowOrder/RowOrder.js");
-var import_RowSelection = require("./features/RowSelection/RowSelection.js");
+var import_useRowInteractivity = require("./features/RowInteractivity/useRowInteractivity.js");
+var import_row_order_model = require("./features/RowOrder/row-order-model.js");
+var import_useRowOrder = require("./features/RowOrder/useRowOrder.js");
+var import_useRowSelection = require("./features/RowSelection/useRowSelection.js");
 var import_sorted_row_model = require("./features/Sorting/sorted-row-model.js");
-var import_Sorting = require("./features/Sorting/Sorting.js");
-var import_SubRows = require("./features/SubRows/SubRows.js");
+var import_useSorting = require("./features/Sorting/useSorting.js");
+var import_subrows_row_model = require("./features/SubRows/subrows-row-model.js");
+var import_useSubRows = require("./features/SubRows/useSubRows.js");
 var thresholdStyles = __toESM(require("./features/Thresholds/Thresholds.sty.js"));
-var import_Thresholds = require("./features/Thresholds/Thresholds.js");
+var import_useThresholds = require("./features/Thresholds/useThresholds.js");
 var import_CellActions = require("./features/UserActions/CellActions.js");
 var import_ColumnActions = require("./features/UserActions/ColumnActions.js");
 var import_RowActions = require("./features/UserActions/RowActions.js");
 var import_useUserActions = require("./features/UserActions/useUserActions.js");
-var import_VisualVariants = require("./features/VisualVariants/VisualVariants.js");
+var import_useVisualVariants = require("./features/VisualVariants/useVisualVariants.js");
 var import_useBuiltInColumns = require("./hooks/useBuiltInColumns.js");
 var import_useColumnRemeasure = require("./hooks/useColumnRemeasure.js");
 var import_useColumns = require("./hooks/useColumns.js");
 var import_useDataTableSlots = require("./hooks/useDataTableSlots.js");
 var import_usePaginationEmptyPageCorrection = require("./hooks/usePaginationEmptyPageCorrection.js");
 var import_usePaginationSlot = require("./hooks/usePaginationSlot.js");
-var import_useTable = require("./hooks/useTable/useTable.js");
 var import_useTableRootResize = require("./hooks/useTableRootResize.js");
 var import_useToolbarSlot = require("./hooks/useToolbarSlot.js");
-var import_src = require("./tanstack-table-core-override/src/index.js");
 var import_Intent = require("../../core/slots/Intent/Intent.js");
 var import_extract_data_attributes = require("../utils/extract-data-attributes.js");
+var import_createCoreRowModel = require("./features/createCoreRowModel.js");
+var import_Pagination = require("./features/Pagination/Pagination.js");
 const COMPONENT_NAME = "DataTable";
 function InternalDataTable(props, forwardedRef) {
   const {
@@ -129,6 +137,7 @@ function InternalDataTable(props, forwardedRef) {
     paginationDataAttributes
   } = (0, import_usePaginationSlot.usePaginationSlot)(slots.pagination);
   const [columns, consumerColumnDefMap] = (0, import_useColumns.useColumns)(
+    // Required cast to align the public facing generic DataTableRowDatas `unknown` type with the tanstack internal RowData type.
     columnsProps
   );
   const configFullWidthOption = (0, import_useDataTableConfig.useDataTableConfigElement)("fullWidth");
@@ -136,51 +145,75 @@ function InternalDataTable(props, forwardedRef) {
   const configFullHeightOption = (0, import_useDataTableConfig.useDataTableConfigElement)("fullHeight");
   const fullHeight = props.fullHeight ?? configFullHeightOption;
   const options = {
+    _features: import_features.DataTableFeatures,
     columns,
-    data: dataProps,
-    // In order to keep the types in our own realm, the cast to align with our
-    // CoreOptions is necessary.
-    getCoreRowModel: (0, import_core_row_model.getCoreRowModel)(),
-    getSortedRowModel: (0, import_sorted_row_model.getSortedRowModel)(),
-    // In order to keep the types in our own realm, the cast to align with our
-    // CoreOptions is necessary.
-    getExpandedRowModel: (0, import_src.getExpandedRowModel)()
+    data: dataProps
   };
   (0, import_RowIdentification.useRowIdentification)(props, options);
-  (0, import_Layout.useLayout)(props, options);
-  (0, import_LineWrap.useColumnLineWrap)(props, options);
+  (0, import_useLayout.useLayout)(props, options);
+  (0, import_useLineWrap.useColumnLineWrap)(props, options);
   (0, import_ColumnFontStyle.useColumnFontStyle)(props, options);
-  (0, import_Thresholds.useThresholds)(props, options);
-  (0, import_VisualVariants.useVisualVariant)(props, options);
-  (0, import_useUserActions.useUserActions)(props, options, consumerColumnDefMap);
-  (0, import_Pagination.usePagination)(props, options);
-  (0, import_LoadingState.useLoadingState)(props, options);
-  (0, import_ColumnSizing.useColumnSizing)(props, options);
-  (0, import_Sorting.useSorting)(props, options);
-  (0, import_ColumnVisibility.useColumnVisibility)(props, options);
-  (0, import_ColumnOrder.useColumnOrder)(props, options);
-  (0, import_RowSelection.useRowSelection)(props, options);
-  (0, import_SubRows.useSubRows)(props, options);
+  (0, import_useThresholds.useThresholds)(props, options);
+  (0, import_useVisualVariants.useVisualVariant)(props, options);
+  (0, import_useUserActions.useUserActions)(
+    props,
+    // Required cast to align DataTableRowDatas any and the RowData type.
+    options,
+    consumerColumnDefMap
+  );
+  (0, import_usePagination.usePagination)(props, options);
+  (0, import_useLoadingState.useLoadingState)(props, options);
+  (0, import_useColumnSizing.useColumnSizing)(props, options);
+  (0, import_useSorting.useSorting)(props, options);
+  (0, import_useColumnVisibility.useColumnVisibility)(props, options);
+  (0, import_useColumnOrder.useColumnOrder)(props, options);
+  (0, import_useRowSelection.useRowSelection)(props, options);
+  (0, import_useSubRows.useSubRows)(props, options);
   (0, import_RowDetails.useRowDetails)(props, options);
-  (0, import_RowInteractivity.useRowInteractivity)(props, options);
-  (0, import_GanttChart.useGanttChart)(props, options);
+  (0, import_useRowInteractivity.useRowInteractivity)(props, options);
+  (0, import_useGanttChart.useGanttChart)(props, options);
   (0, import_MeterBarChart.useMeterBarChartMaxValuesCalc)(props, options);
-  (0, import_RowOrder.useRowOrder)(props, options);
-  (0, import_ColumnPinning.useColumnPinning)(props, options);
-  (0, import_Download.useDownloadData)(
+  (0, import_useRowOrder.useRowOrder)(props, options);
+  (0, import_useColumnPinning.useColumnPinning)(props, options);
+  (0, import_useDownload.useDownloadData)(
+    // DEPRECATION: [APPDEV-16236] BREAKING-CHANGE: Remove deprecated onDownloadData and DataTableDownloadProps.
+    // After removing the deprecated prop, consider changing the signature to `useDownloadData(toolbarItemProps, options)`
     // eslint-disable-next-line @typescript-eslint/no-deprecated
     { onDownloadData: toolbarItemProps.onDownloadData ?? props.onDownloadData },
     options
   );
   options.columns = (0, import_useBuiltInColumns.useBuiltInColumns)(options);
-  const table = (0, import_useTable.useTable)(options);
+  const table = (0, import_react_table.useTable)(
+    {
+      _rowModels: {
+        coreRowModel: (0, import_createCoreRowModel.createCoreRowModel)(),
+        expandedRowModel: (0, import_subrows_row_model.createExpandedRowModel)(),
+        sortedRowModel: (0, import_sorted_row_model.createSortedRowModel)(),
+        paginatedRowModel: (0, import_pagination_row_model.createPaginatedRowModel)(),
+        detailsRowModel: (0, import_details_row_model.createRowDetailsRowModel)(),
+        rowOrderRowModel: (0, import_row_order_model.createRowOrderRowModel)()
+      },
+      ...options
+    },
+    (state) => state
+  );
+  const initialRender = (0, import_react.useRef)(true);
+  (0, import_react.useEffect)(() => {
+    if (initialRender.current === true) {
+      initialRender.current = false;
+      return;
+    }
+    (0, import_Pagination.table_autoResetPageIndex)(
+      table
+    );
+  }, [dataProps]);
   const tableRef = (0, import_Config.useDataTableConfigRef)(
     forwardedRef,
     columnSettingsModalRef,
     table,
     props
   );
-  const rootRef = (0, import_useTableRootResize.useTableRootResize)(table.remeasureRows, table.setState);
+  const rootRef = (0, import_useTableRootResize.useTableRootResize)(table.remeasureRows);
   const mergedRefs = (0, import_useMergeRefs.useMergeRefs)([rootRef, tableRef]);
   (0, import_useColumnRemeasure.useColumnRemeasure)(table);
   (0, import_usePaginationEmptyPageCorrection.usePaginationEmptyPageCorrection)(table);
@@ -194,7 +227,7 @@ function InternalDataTable(props, forwardedRef) {
           styles.dataTable,
           {
             [styles.fullWidth]: fullWidth,
-            [styles.notResizing]: table.getState().columnSizingInfo.isResizingColumn === false
+            [styles.notResizing]: table.atoms.columnResizing?.get().isResizingColumn === false
           },
           {
             [thresholdStyles.hasPillThresholds]: table.options.hasThresholds && table.options.rowThresholds?.some(
@@ -275,7 +308,7 @@ function InternalDataTable(props, forwardedRef) {
 InternalDataTable.displayName = COMPONENT_NAME;
 const DataTableFwd = /* @__PURE__ */ (0, import_react.forwardRef)(InternalDataTable);
 const DataTable = Object.assign(DataTableFwd, {
-  Pagination: import_Pagination.DataTablePagination,
+  Pagination: import_usePagination.DataTablePagination,
   ColumnActions: import_ColumnActions.DataTableColumnActions,
   CellActions: import_CellActions.DataTableCellActions,
   RowActions: import_RowActions.DataTableRowActions,
@@ -293,6 +326,6 @@ const DataTable = Object.assign(DataTableFwd, {
   DownloadData: import_Download.DataTableDownload,
   Intent: import_Intent.Intent,
   ExpandableRow: import_RowDetails.DataTableExpandableRowTemplate,
-  ExpandableRowWrapper: import_RowDetails.DataTableExpandableRowWrapper,
+  ExpandableRowWrapper: import_ExpandableRowWrapper.DataTableExpandableRowWrapper,
   LineWrap: import_LineWrap.DataTableGlobalLineWrapAction
 });

package/tables/DataTable/DataTable.sty.js

@@ -27,10 +27,10 @@ __export(DataTable_css_exports, {
 });
 module.exports = __toCommonJS(DataTable_css_exports);
 var import_DataTable_css_ts_vanilla = require("./DataTable.css");
-var dataTable = "_14sp6az0-3-6-0";
-var firstBodyRow = "_14sp6az5-3-6-0";
-var fullWidth = "_14sp6az1-3-6-0";
-var lastBodyRow = "_14sp6az6-3-6-0";
-var notResizing = "_14sp6az2-3-6-0";
-var pinnedCellInDragOverlay = "_14sp6az4-3-6-0";
-var prefixColumn = "_14sp6az3-3-6-0";
+var dataTable = "_14sp6az0-3-7-0";
+var firstBodyRow = "_14sp6az5-3-7-0";
+var fullWidth = "_14sp6az1-3-7-0";
+var lastBodyRow = "_14sp6az6-3-7-0";
+var notResizing = "_14sp6az2-3-7-0";
+var pinnedCellInDragOverlay = "_14sp6az4-3-7-0";
+var prefixColumn = "_14sp6az3-3-7-0";

package/tables/DataTable/components/Alignment.css

@@ -1,21 +1,21 @@
-._yj6voi0-3-6-0 {
+._yj6voi0-3-7-0 {
   text-align: right;
   justify-content: end;
 }
-._yj6voi1-3-6-0 {
+._yj6voi1-3-7-0 {
   text-align: left;
   justify-content: start;
 }
-._yj6voi2-3-6-0 {
+._yj6voi2-3-7-0 {
   text-align: center;
   justify-content: center;
 }
-._yj6voi3-3-6-0 {
+._yj6voi3-3-7-0 {
   align-items: start;
 }
-._yj6voi4-3-6-0 {
+._yj6voi4-3-7-0 {
   align-items: center;
 }
-._yj6voi5-3-6-0 {
+._yj6voi5-3-7-0 {
   align-items: end;
 }

package/tables/DataTable/components/Alignment.sty.js

@@ -22,5 +22,5 @@ __export(Alignment_css_exports, {
 });
 module.exports = __toCommonJS(Alignment_css_exports);
 var import_Alignment_css_ts_vanilla = require("./Alignment.css");
-var horizontalAlignment = { right: "_yj6voi0-3-6-0", left: "_yj6voi1-3-6-0", center: "_yj6voi2-3-6-0" };
-var verticalAlignment = { top: "_yj6voi3-3-6-0", center: "_yj6voi4-3-6-0", bottom: "_yj6voi5-3-6-0" };
+var horizontalAlignment = { right: "_yj6voi0-3-7-0", left: "_yj6voi1-3-7-0", center: "_yj6voi2-3-7-0" };
+var verticalAlignment = { top: "_yj6voi3-3-7-0", center: "_yj6voi4-3-7-0", bottom: "_yj6voi5-3-7-0" };

package/tables/DataTable/components/ColumnPinning/DataTablePinningShadowCells.css

@@ -1,14 +1,14 @@
-._1tlws2p2-3-6-0 {
+._1tlws2p2-3-7-0 {
   z-index: 2;
-  left: var(--resizing-leftPosition, var(--_1tlws2p0-3-6-0));
+  left: var(--resizing-leftPosition, var(--_1tlws2p0-3-7-0));
 }
-._1tlws2p2-3-6-0::after {
+._1tlws2p2-3-7-0::after {
   right: -50px;
 }
-._1tlws2p3-3-6-0 {
+._1tlws2p3-3-7-0 {
   z-index: 3;
-  right: var(--resizing-rightPosition, var(--_1tlws2p1-3-6-0));
+  right: var(--resizing-rightPosition, var(--_1tlws2p1-3-7-0));
 }
-._1tlws2p3-3-6-0::after {
+._1tlws2p3-3-7-0::after {
   left: -50px;
 }

package/tables/DataTable/components/ColumnPinning/DataTablePinningShadowCells.d.ts

@@ -1,12 +1,12 @@
+import type { TableFeatures, RowData, Column_Internal } from '@tanstack/react-table';
 import type { JSX } from 'react';
-import type { Column } from '../../hooks/useTable/types.js';
-interface DataTablePinningShadowCellsProps {
+interface DataTablePinningShadowCellsProps<TFeatures extends TableFeatures, TData extends RowData> {
     lastLeftPinnedColumn: {
-        column?: Column<unknown, unknown>;
+        column?: Column_Internal<TFeatures, TData>;
         index?: number;
     };
     firstRightPinnedColumn: {
-        column?: Column<unknown, unknown>;
+        column?: Column_Internal<TFeatures, TData>;
         index?: number;
     };
     gridRowPosition: {
@@ -23,7 +23,7 @@ interface DataTablePinningShadowCellsProps {
  * and add the shadow inside an `::after` element to the right/left edge of this cell. The shadow is only
  * rendered when the table is actually overflowing behind the pinned columns on the respective side.
  */
-export declare function DataTablePinningShadowCells(props: Readonly<DataTablePinningShadowCellsProps>): JSX.Element | null;
+export declare function DataTablePinningShadowCells<TFeatures extends TableFeatures, TData extends RowData>(props: Readonly<DataTablePinningShadowCellsProps<TFeatures, TData>>): JSX.Element | null;
 export declare namespace DataTablePinningShadowCells {
     var displayName: string;
 }

package/tables/DataTable/components/ColumnPinning/DataTablePinningShadowCells.js

@@ -36,23 +36,18 @@ var styles = __toESM(require("./DataTablePinningShadowCells.sty.js"));
 var import_constants = require("../../constants.js");
 var import_DataTableContext = require("../../contexts/DataTableContext.js");
 function DataTablePinningShadowCells(props) {
-  const {
-    lastLeftPinnedColumn,
-    firstRightPinnedColumn,
-    gridRowPosition,
-    rowId
-  } = props;
+  const { gridRowPosition, rowId } = props;
   const tableContent = (0, import_DataTableContext.useDataTableContent)();
-  const leftShadowCellShouldRender = lastLeftPinnedColumn.column !== void 0 && tableContent.hasOverflowLeft;
-  const rightShadowCellShouldRender = firstRightPinnedColumn.column !== void 0 && tableContent.hasOverflowRight;
-  const leftPosition = leftShadowCellShouldRender && lastLeftPinnedColumn.column?.getLeftPinnedPosition();
-  const lastLeftPinnedColumnGridPosition = leftShadowCellShouldRender && lastLeftPinnedColumn.column?.getGridColumnPosition(
-    lastLeftPinnedColumn.index ?? 0
+  const leftShadowCellShouldRender = props.lastLeftPinnedColumn.column !== void 0 && tableContent.hasOverflowLeft;
+  const rightShadowCellShouldRender = props.firstRightPinnedColumn.column !== void 0 && tableContent.hasOverflowRight;
+  const leftPosition = leftShadowCellShouldRender && props.lastLeftPinnedColumn.column?.getLeftPinnedPosition();
+  const lastLeftPinnedColumnGridPosition = leftShadowCellShouldRender && props.lastLeftPinnedColumn.column?.getGridColumnPosition(
+    props.lastLeftPinnedColumn.index ?? 0
   );
-  const firstRightPinnedColumnGridPosition = rightShadowCellShouldRender && firstRightPinnedColumn.column?.getGridColumnPosition(
-    firstRightPinnedColumn.index ?? 0
+  const firstRightPinnedColumnGridPosition = rightShadowCellShouldRender && props.firstRightPinnedColumn.column?.getGridColumnPosition(
+    props.firstRightPinnedColumn.index ?? 0
   );
-  const rightPosition = rightShadowCellShouldRender && firstRightPinnedColumn.column?.getRightPinnedPosition();
+  const rightPosition = rightShadowCellShouldRender && props.firstRightPinnedColumn.column?.getRightPinnedPosition();
   const leftShadowCell = leftShadowCellShouldRender ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     "div",
     {

package/tables/DataTable/components/ColumnPinning/DataTablePinningShadowCells.sty.js

@@ -24,6 +24,6 @@ __export(DataTablePinningShadowCells_css_exports, {
 module.exports = __toCommonJS(DataTablePinningShadowCells_css_exports);
 var import_DataTableScrollShadow_css_ts_vanilla = require("../DataTableScrollShadow.css");
 var import_DataTablePinningShadowCells_css_ts_vanilla = require("./DataTablePinningShadowCells.css");
-var leftPositionVar = "var(--_1tlws2p0-3-6-0)";
-var pinningShadowCell = { left: "_1tlws2p2-3-6-0 _1al677r1-3-6-0 _1al677r0-3-6-0", right: "_1tlws2p3-3-6-0 _1al677r2-3-6-0 _1al677r0-3-6-0" };
-var rightPositionVar = "var(--_1tlws2p1-3-6-0)";
+var leftPositionVar = "var(--_1tlws2p0-3-7-0)";
+var pinningShadowCell = { left: "_1tlws2p2-3-7-0 _1al677r1-3-7-0 _1al677r0-3-7-0", right: "_1tlws2p3-3-7-0 _1al677r2-3-7-0 _1al677r0-3-7-0" };
+var rightPositionVar = "var(--_1tlws2p1-3-7-0)";

package/tables/DataTable/components/DataTableBody.css

@@ -1,4 +1,4 @@
-._51sfnf0-3-6-0 {
+._51sfnf0-3-7-0 {
   display: grid;
   grid-template-columns: subgrid;
   grid-column-start: 1;
@@ -7,6 +7,6 @@
   grid-row-start: body-start;
   grid-row-end: body-end;
 }
-._51sfnf1-3-6-0 {
+._51sfnf1-3-7-0 {
   opacity: 0.2;
 }