@teamturing/react-kit 2.60.2 → 2.61.0

package/esm/core/Checkbox/index.js

@@ -25,146 +25,50 @@ const Checkbox = ({
     ...props
   });
 };
-const UnstyledCheckbox = styled.input.attrs({
+const UnstyledCheckbox = /*#__PURE__*/styled.input.attrs({
   type: 'checkbox'
-})`
-  appearance: none;
-
-  ${sx}
-`;
-const BaseCheckbox = styled(UnstyledCheckbox)`
-  position: relative;
-
-  width: ${forcePixelValue(20)};
-  height: ${forcePixelValue(20)};
-
-  border-width: ${forcePixelValue(2)};
-  border-style: solid;
-  border-color: ${({
+}).withConfig({
+  displayName: "Checkbox__UnstyledCheckbox",
+  componentId: "sc-19q1r3f-0"
+})(["appearance:none;", ""], sx);
+const BaseCheckbox = /*#__PURE__*/styled(UnstyledCheckbox).withConfig({
+  displayName: "Checkbox__BaseCheckbox",
+  componentId: "sc-19q1r3f-1"
+})(["position:relative;width:", ";height:", ";border-width:", ";border-style:solid;border-color:", ";border-radius:", ";cursor:pointer;transition:visibility 200ms;&::before{visibility:hidden;content:'';display:grid;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:", ";background-color:", ";mask-image:url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.6 17.2C10.3 17.2 10 17.1 9.80001 16.8L5.20001 12.2C4.70001 11.7 4.70001 11 5.20001 10.5C5.70001 9.99998 6.40001 9.99998 6.90001 10.5L10.6 14.2L17.2 7.59998C17.7 7.09998 18.4 7.09998 18.9 7.59998C19.4 8.09998 19.4 8.79998 18.9 9.29998L11.5 16.7C11.2 17.1 10.9 17.2 10.6 17.2Z' fill='%238D94A0'/%3E%3C/svg%3E%0A\");-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.6 17.2C10.3 17.2 10 17.1 9.80001 16.8L5.20001 12.2C4.70001 11.7 4.70001 11 5.20001 10.5C5.70001 9.99998 6.40001 9.99998 6.90001 10.5L10.6 14.2L17.2 7.59998C17.7 7.09998 18.4 7.09998 18.9 7.59998C19.4 8.09998 19.4 8.79998 18.9 9.29998L11.5 16.7C11.2 17.1 10.9 17.2 10.6 17.2Z' fill='%238D94A0'/%3E%3C/svg%3E%0A\");mask-size:100%;-webkit-mask-size:100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center;}&:disabled{background-color:", ";border-color:", ";cursor:not-allowed;}&:checked{background-color:", ";border-width:0;&::before{visibility:visible;}&:disabled{background-color:", ";border-color:", ";&::before{background-color:", ";}}}&:indeterminate{background-color:", ";border-width:0;&::before{visibility:visible;mask-image:url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M20.05 13.2H4.05001C3.73175 13.2 3.42652 13.0736 3.20148 12.8485C2.97643 12.6235 2.85001 12.3182 2.85001 12C2.85001 11.6817 2.97643 11.3765 3.20148 11.1515C3.42652 10.9264 3.73175 10.8 4.05001 10.8H20.05C20.3683 10.8 20.6735 10.9264 20.8985 11.1515C21.1236 11.3765 21.25 11.6817 21.25 12C21.25 12.3182 21.1236 12.6235 20.8985 12.8485C20.6735 13.0736 20.3683 13.2 20.05 13.2Z' fill='%238D94A0'/%3E%3C/svg%3E%0A\");-webkit-mask-image:url(\"data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M20.05 13.2H4.05001C3.73175 13.2 3.42652 13.0736 3.20148 12.8485C2.97643 12.6235 2.85001 12.3182 2.85001 12C2.85001 11.6817 2.97643 11.3765 3.20148 11.1515C3.42652 10.9264 3.73175 10.8 4.05001 10.8H20.05C20.3683 10.8 20.6735 10.9264 20.8985 11.1515C21.1236 11.3765 21.25 11.6817 21.25 12C21.25 12.3182 21.1236 12.6235 20.8985 12.8485C20.6735 13.0736 20.3683 13.2 20.05 13.2Z' fill='%238D94A0'/%3E%3C/svg%3E%0A\");mask-size:100%;-webkit-mask-size:100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:center;-webkit-mask-position:center;}&:disabled{background-color:", ";border-color:", ";&::before{background-color:", ";}}}&:focus-visible{outline-width:", ";outline-style:solid;outline-color:", ";}", " ", ""], forcePixelValue(20), forcePixelValue(20), forcePixelValue(2), ({
   theme
-}) => theme.colors['border/neutral']};
-  border-radius: ${({
+}) => theme.colors['border/neutral'], ({
   theme
-}) => `${forcePixelValue(theme.radii.xxs)}`};
-  cursor: pointer;
-
-  transition: visibility 200ms;
-
-  &::before {
-    visibility: hidden;
-
-    content: '';
-    display: grid;
-    position: absolute;
-
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-
-    border-radius: ${({
+}) => `${forcePixelValue(theme.radii.xxs)}`, ({
   theme
-}) => `${forcePixelValue(theme.radii.xxs)}`};
-
-    background-color: ${({
-  theme
-}) => theme.colors['icon/inverse']};
-    mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.6 17.2C10.3 17.2 10 17.1 9.80001 16.8L5.20001 12.2C4.70001 11.7 4.70001 11 5.20001 10.5C5.70001 9.99998 6.40001 9.99998 6.90001 10.5L10.6 14.2L17.2 7.59998C17.7 7.09998 18.4 7.09998 18.9 7.59998C19.4 8.09998 19.4 8.79998 18.9 9.29998L11.5 16.7C11.2 17.1 10.9 17.2 10.6 17.2Z' fill='%238D94A0'/%3E%3C/svg%3E%0A");
-    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.6 17.2C10.3 17.2 10 17.1 9.80001 16.8L5.20001 12.2C4.70001 11.7 4.70001 11 5.20001 10.5C5.70001 9.99998 6.40001 9.99998 6.90001 10.5L10.6 14.2L17.2 7.59998C17.7 7.09998 18.4 7.09998 18.9 7.59998C19.4 8.09998 19.4 8.79998 18.9 9.29998L11.5 16.7C11.2 17.1 10.9 17.2 10.6 17.2Z' fill='%238D94A0'/%3E%3C/svg%3E%0A");
-    mask-size: 100%;
-    -webkit-mask-size: 100%;
-    mask-repeat: no-repeat;
-    -webkit-mask-repeat: no-repeat;
-    mask-position: center;
-    -webkit-mask-position: center;
-  }
-
-  &:disabled {
-    background-color: ${({
+}) => `${forcePixelValue(theme.radii.xxs)}`, ({
   theme
-}) => theme.colors['bg/disabled']};
-    border-color: ${({
+}) => theme.colors['icon/inverse'], ({
   theme
-}) => theme.colors['border/disabled']};
-    cursor: not-allowed;
-  }
-
-  &:checked {
-    background-color: ${({
+}) => theme.colors['bg/disabled'], ({
   theme
-}) => theme.colors['bg/primary']};
-    border-width: 0;
-
-    &::before {
-      visibility: visible;
-    }
-
-    &:disabled {
-      background-color: ${({
+}) => theme.colors['border/disabled'], ({
   theme
-}) => theme.colors['bg/disabled']};
-      border-color: ${({
+}) => theme.colors['bg/primary'], ({
   theme
-}) => theme.colors['border/disabled']};
-
-      &::before {
-        background-color: ${({
+}) => theme.colors['bg/disabled'], ({
   theme
-}) => theme.colors['icon/disabled']};
-      }
-    }
-  }
-
-  &:indeterminate {
-    background-color: ${({
+}) => theme.colors['border/disabled'], ({
   theme
-}) => theme.colors['bg/primary']};
-    border-width: 0;
-
-    &::before {
-      visibility: visible;
-      mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M20.05 13.2H4.05001C3.73175 13.2 3.42652 13.0736 3.20148 12.8485C2.97643 12.6235 2.85001 12.3182 2.85001 12C2.85001 11.6817 2.97643 11.3765 3.20148 11.1515C3.42652 10.9264 3.73175 10.8 4.05001 10.8H20.05C20.3683 10.8 20.6735 10.9264 20.8985 11.1515C21.1236 11.3765 21.25 11.6817 21.25 12C21.25 12.3182 21.1236 12.6235 20.8985 12.8485C20.6735 13.0736 20.3683 13.2 20.05 13.2Z' fill='%238D94A0'/%3E%3C/svg%3E%0A");
-      -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M20.05 13.2H4.05001C3.73175 13.2 3.42652 13.0736 3.20148 12.8485C2.97643 12.6235 2.85001 12.3182 2.85001 12C2.85001 11.6817 2.97643 11.3765 3.20148 11.1515C3.42652 10.9264 3.73175 10.8 4.05001 10.8H20.05C20.3683 10.8 20.6735 10.9264 20.8985 11.1515C21.1236 11.3765 21.25 11.6817 21.25 12C21.25 12.3182 21.1236 12.6235 20.8985 12.8485C20.6735 13.0736 20.3683 13.2 20.05 13.2Z' fill='%238D94A0'/%3E%3C/svg%3E%0A");
-      mask-size: 100%;
-      -webkit-mask-size: 100%;
-      mask-repeat: no-repeat;
-      -webkit-mask-repeat: no-repeat;
-      mask-position: center;
-      -webkit-mask-position: center;
-    }
-
-    &:disabled {
-      background-color: ${({
+}) => theme.colors['icon/disabled'], ({
   theme
-}) => theme.colors['bg/disabled']};
-      border-color: ${({
+}) => theme.colors['bg/primary'], ({
   theme
-}) => theme.colors['border/disabled']};
-
-      &::before {
-        background-color: ${({
+}) => theme.colors['bg/disabled'], ({
   theme
-}) => theme.colors['icon/disabled']};
-      }
-    }
-  }
-
-  &:focus-visible {
-    outline-width: ${forcePixelValue(2)};
-    outline-style: solid;
-    outline-color: ${({
+}) => theme.colors['border/disabled'], ({
   theme
-}) => theme.colors['border/focused']};
-  }
-
-  ${props => props.validationStatus === 'error' && css`
+}) => theme.colors['icon/disabled'], forcePixelValue(2), ({
+  theme
+}) => theme.colors['border/focused'], props => props.validationStatus === 'error' && css`
       border-color: ${({
   theme
 }) => theme.colors['border/danger']};
-    `}
-
-  ${sx}
-`;
+    `, sx);
 var Checkbox$1 = /*#__PURE__*/forwardRef(Checkbox);
 
 export { Checkbox$1 as default };

package/esm/core/CheckboxOrRadioGroupFormControl/CheckboxOrRadioGroupFormControlErrorMessage.js

@@ -27,8 +27,9 @@ const errorMessageKeyframe = keyframes`
     transform: translateY(0);
   }
 `;
-const StyledText = styled(Text)`
-  animation: 170ms ${errorMessageKeyframe} cubic-bezier(0.44, 0.74, 0.36, 1);
-`;
+const StyledText = /*#__PURE__*/styled(Text).withConfig({
+  displayName: "CheckboxOrRadioGroupFormControlErrorMessage__StyledText",
+  componentId: "sc-ulbr7g-0"
+})(["animation:170ms ", " cubic-bezier(0.44,0.74,0.36,1);"], errorMessageKeyframe);
 
 export { CheckboxOrRadioGroupFormControlErrorMessage as default };

package/esm/core/CheckboxOrRadioGroupFormControl/CheckboxOrRadioGroupFormControlLabel.js

@@ -36,8 +36,10 @@ const CheckboxOrRadioGroupFormControlLabel = ({
     })
   });
 };
-const VisuallyHidden = styled.span`
-  ${({
+const VisuallyHidden = /*#__PURE__*/styled.span.withConfig({
+  displayName: "CheckboxOrRadioGroupFormControlLabel__VisuallyHidden",
+  componentId: "sc-1eoo1ew-0"
+})(["", ""], ({
   isVisible = false
 }) => {
   if (isVisible) {
@@ -54,39 +56,22 @@ const VisuallyHidden = styled.span`
       white-space: nowrap;
       border-width: 0;
     `;
-}}
-`;
-const LabelWrapper = styled(View)`
-  display: inline-block;
-  align-self: flex-start;
-
-  font-size: ${({
+});
+const LabelWrapper = /*#__PURE__*/styled(View).withConfig({
+  displayName: "CheckboxOrRadioGroupFormControlLabel__LabelWrapper",
+  componentId: "sc-1eoo1ew-1"
+})(["display:inline-block;align-self:flex-start;font-size:", ";font-weight:", ";line-height:", ";color:", ";cursor:", ";span.checkbox_or_radio_group_form_control_label__required__false{font-size:inherit;font-weight:inherit;color:", ";}", ";"], ({
   theme
-}) => forcePixelValue(theme.fontSizes.xs)};
-  font-weight: ${({
+}) => forcePixelValue(theme.fontSizes.xs), ({
   theme
-}) => theme.fontWeights.medium};
-  line-height: ${({
+}) => theme.fontWeights.medium, ({
   theme
-}) => theme.lineHeights[2]};
-
-  color: ${({
+}) => theme.lineHeights[2], ({
   theme
-}) => theme.colors['text/neutral/subtle']};
-
-  cursor: ${({
+}) => theme.colors['text/neutral/subtle'], ({
   disabled
-}) => disabled ? 'not-allowed' : 'pointer'};
-
-  span.checkbox_or_radio_group_form_control_label__required__false {
-    font-size: inherit;
-    font-weight: inherit;
-    color: ${({
+}) => disabled ? 'not-allowed' : 'pointer', ({
   theme
-}) => theme.colors['text/neutral/subtlest']};
-  }
-
-  ${sx};
-`;
+}) => theme.colors['text/neutral/subtlest'], sx);
 
 export { CheckboxOrRadioGroupFormControlLabel as default };

package/esm/core/CheckboxOrRadioGroupFormControl/CheckboxOrRadioGroupFormControlSuccessMessage.js

@@ -27,8 +27,9 @@ const successMessageKeyframe = keyframes`
     transform: translateY(0);
   }
 `;
-const StyledText = styled(Text)`
-  animation: 170ms ${successMessageKeyframe} cubic-bezier(0.44, 0.74, 0.36, 1);
-`;
+const StyledText = /*#__PURE__*/styled(Text).withConfig({
+  displayName: "CheckboxOrRadioGroupFormControlSuccessMessage__StyledText",
+  componentId: "sc-c7dwbg-0"
+})(["animation:170ms ", " cubic-bezier(0.44,0.74,0.36,1);"], successMessageKeyframe);
 
 export { CheckboxOrRadioGroupFormControlSuccessMessage as default };

package/esm/core/Chip/index.js

@@ -23,7 +23,10 @@ const Chip = ({
     className: 'chip__trailing_icon'
   }) : null]
 });
-const BaseChip = styled.span(({
+const BaseChip = /*#__PURE__*/styled.span.withConfig({
+  displayName: "Chip__BaseChip",
+  componentId: "sc-sq73uo-0"
+})(({
   theme
 }) => ({
   position: 'relative',

package/esm/core/ClickArea/index.js

@@ -17,13 +17,12 @@ const ClickArea = ({
     onClick
   } : {})
 });
-const BaseClickArea = styled(View)`
-  &:hover {
-    cursor: ${({
+const BaseClickArea = /*#__PURE__*/styled(View).withConfig({
+  displayName: "ClickArea__BaseClickArea",
+  componentId: "sc-1pd8ned-0"
+})(["&:hover{cursor:", ";}"], ({
   disabled
-}) => disabled ? 'not-allowed' : 'pointer'};
-  }
-`;
+}) => disabled ? 'not-allowed' : 'pointer');
 var index = /*#__PURE__*/forwardRef(ClickArea);
 
 export { index as default };

package/esm/core/CounterBadge/index.js

@@ -22,15 +22,12 @@ const CounterBadge = ({
     children: children
   });
 };
-const BaseCounterBadge = styled.span`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: ${({
+const BaseCounterBadge = /*#__PURE__*/styled.span.withConfig({
+  displayName: "CounterBadge__BaseCounterBadge",
+  componentId: "sc-1tqkdbw-0"
+})(["display:inline-flex;align-items:center;justify-content:center;border-radius:", ";", " ", " ", ""], ({
   theme
-}) => forcePixelValue(theme.radii.full)};
-
-  ${variant({
+}) => forcePixelValue(theme.radii.full), variant({
   prop: 'variant',
   variants: {
     red: {
@@ -38,8 +35,7 @@ const BaseCounterBadge = styled.span`
       color: 'text/inverse'
     }
   }
-})}
-  ${variant({
+}), variant({
   prop: 'size',
   variants: {
     m: {
@@ -51,9 +47,6 @@ const BaseCounterBadge = styled.span`
       py: 0.25
     }
   }
-})}
-
-  ${sx}
-`;
+}), sx);
 
 export { CounterBadge as default };

package/esm/core/Datagrid/DatagridBody.js

@@ -8,25 +8,11 @@ const DatagridBody = ({
 }) => /*#__PURE__*/jsx(BaseDatagridBody, {
   ...props
 });
-const BaseDatagridBody = styled.div`
-  width: inherit;
-
-  border-radius: inherit;
-
-  & > *:not(:last-child) {
-    border-bottom-width: ${forcePixelValue(1)};
-    border-bottom-style: solid;
-    border-bottom-color: ${({
+const BaseDatagridBody = /*#__PURE__*/styled.div.withConfig({
+  displayName: "DatagridBody__BaseDatagridBody",
+  componentId: "sc-pt3o0h-0"
+})(["width:inherit;border-radius:inherit;& > *:not(:last-child){border-bottom-width:", ";border-bottom-style:solid;border-bottom-color:", ";}& > *:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;}", ""], forcePixelValue(1), ({
   theme
-}) => theme.colors['border/neutral']};
-  }
-
-  & > *:last-child {
-    border-bottom-left-radius: inherit;
-    border-bottom-right-radius: inherit;
-  }
-
-  ${sx}
-`;
+}) => theme.colors['border/neutral'], sx);
 
 export { DatagridBody as default };

package/esm/core/Datagrid/DatagridHeader.js

@@ -23,22 +23,13 @@ const DatagridHeader = ({
     children: trailingAction
   })]
 });
-const DataGridHeaderWrapper = styled.div`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  height: 40px;
-  padding: ${({
+const DataGridHeaderWrapper = /*#__PURE__*/styled.div.withConfig({
+  displayName: "DatagridHeader__DataGridHeaderWrapper",
+  componentId: "sc-r0eskc-0"
+})(["display:flex;align-items:center;justify-content:space-between;height:40px;padding:", ";background-color:", ";border-top-left-radius:inherit;border-top-right-radius:inherit;", ""], ({
   theme
-}) => `${forcePixelValue(theme.space[1])} ${forcePixelValue(theme.space[4])}`};
-  background-color: ${({
+}) => `${forcePixelValue(theme.space[1])} ${forcePixelValue(theme.space[4])}`, ({
   theme
-}) => theme.colors['bg/neutral']};
-
-  border-top-left-radius: inherit;
-  border-top-right-radius: inherit;
-
-  ${sx}
-`;
+}) => theme.colors['bg/neutral'], sx);
 
 export { DatagridHeader as default };

package/esm/core/Datagrid/DatagridSubheader.js

@@ -8,21 +8,15 @@ const DatagridSubheader = ({
 }) => /*#__PURE__*/jsx(DataGridSubheaderWrapper, {
   ...props
 });
-const DataGridSubheaderWrapper = styled.div`
-  padding: ${({
+const DataGridSubheaderWrapper = /*#__PURE__*/styled.div.withConfig({
+  displayName: "DatagridSubheader__DataGridSubheaderWrapper",
+  componentId: "sc-1l1yg6c-0"
+})(["padding:", ";background-color:", ";border-bottom-width:", ";border-bottom-style:solid;border-bottom-color:", ";", ";"], ({
   theme
-}) => `${forcePixelValue(theme.space[2])} ${forcePixelValue(theme.space[4])}`};
-  background-color: ${({
+}) => `${forcePixelValue(theme.space[2])} ${forcePixelValue(theme.space[4])}`, ({
   theme
-}) => theme.colors.surface};
-
-  border-bottom-width: ${forcePixelValue(1)};
-  border-bottom-style: solid;
-  border-bottom-color: ${({
+}) => theme.colors.surface, forcePixelValue(1), ({
   theme
-}) => theme.colors['border/neutral']};
-
-  ${sx};
-`;
+}) => theme.colors['border/neutral'], sx);
 
 export { DatagridSubheader as default };

package/esm/core/Datagrid/index.js

@@ -29,26 +29,18 @@ const Datagrid = ({
     })]
   });
 };
-const DatagridWrapper = styled.div`
-  width: 100%;
-
-  border-width: ${forcePixelValue(1)};
-  border-style: solid;
-  border-color: ${({
+const DatagridWrapper = /*#__PURE__*/styled.div.withConfig({
+  displayName: "Datagrid__DatagridWrapper",
+  componentId: "sc-1pt4ew-0"
+})(["width:100%;border-width:", ";border-style:solid;border-color:", ";border-radius:", ";isolation:isolate;", ""], forcePixelValue(1), ({
   theme
-}) => theme.colors['border/neutral']};
-  border-radius: ${({
+}) => theme.colors['border/neutral'], ({
   theme
-}) => forcePixelValue(theme.radii.s)};
-  isolation: isolate;
-
-  ${sx}
-`;
-const BaseDatagrid = styled.div`
-  width: inherit;
-
-  border-radius: inherit;
-`;
+}) => forcePixelValue(theme.radii.s), sx);
+const BaseDatagrid = /*#__PURE__*/styled.div.withConfig({
+  displayName: "Datagrid__BaseDatagrid",
+  componentId: "sc-1pt4ew-1"
+})(["width:inherit;border-radius:inherit;"]);
 var index = Object.assign(Datagrid, {
   Header: DatagridHeader,
   Subheader: DatagridSubheader,

package/esm/core/Dialog/_UnstyledDialogBody.js

@@ -1,15 +1,11 @@
 import styled from 'styled-components';
 import { sx } from '../../utils/styled-system/index.js';
 
-const UnstyledDialogBody = styled.div.attrs({
+const UnstyledDialogBody = /*#__PURE__*/styled.div.attrs({
   className: 'trk-dialog_body'
-})`
-  flex-grow: 1;
-  flex-shrink: 1;
-  flex-basis: auto;
-  overflow-y: auto;
-
-  ${sx}
-`;
+}).withConfig({
+  displayName: "_UnstyledDialogBody__UnstyledDialogBody",
+  componentId: "sc-1wirkbs-0"
+})(["flex-grow:1;flex-shrink:1;flex-basis:auto;overflow-y:auto;", ""], sx);
 
 export { UnstyledDialogBody as default };

package/esm/core/Dialog/_UnstyledDialogFooter.js

@@ -1,14 +1,11 @@
 import styled from 'styled-components';
 import { sx } from '../../utils/styled-system/index.js';
 
-const UnstyledDialogFooter = styled.div.attrs({
+const UnstyledDialogFooter = /*#__PURE__*/styled.div.attrs({
   className: 'trk-dialog_footer'
-})`
-  flex-grow: 0;
-  flex-shrink: 0;
-  flex-basis: auto;
-
-  ${sx}
-`;
+}).withConfig({
+  displayName: "_UnstyledDialogFooter__UnstyledDialogFooter",
+  componentId: "sc-6fc8qd-0"
+})(["flex-grow:0;flex-shrink:0;flex-basis:auto;", ""], sx);
 
 export { UnstyledDialogFooter as default };

package/esm/core/Dialog/_UnstyledDialogHeader.js

@@ -1,14 +1,11 @@
 import styled from 'styled-components';
 import { sx } from '../../utils/styled-system/index.js';
 
-const UnstyledDialogHeader = styled.div.attrs({
+const UnstyledDialogHeader = /*#__PURE__*/styled.div.attrs({
   className: 'trk-dialog_header'
-})`
-  flex-grow: 0;
-  flex-shrink: 0;
-  flex-basis: auto;
-
-  ${sx}
-`;
+}).withConfig({
+  displayName: "_UnstyledDialogHeader__UnstyledDialogHeader",
+  componentId: "sc-11xdjox-0"
+})(["flex-grow:0;flex-shrink:0;flex-basis:auto;", ""], sx);
 
 export { UnstyledDialogHeader as default };

package/esm/core/Dialog/index.js

@@ -153,22 +153,16 @@ const Dialog = ({
     }) : null
   });
 };
-const Blanket = styled.span`
-  &:before {
-    position: fixed;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    display: block;
-    cursor: default;
-    content: '';
-    background: ${({
+const Blanket = /*#__PURE__*/styled.span.withConfig({
+  displayName: "Dialog__Blanket",
+  componentId: "sc-1c7dkhn-0"
+})(["&:before{position:fixed;top:0;right:0;bottom:0;left:0;display:block;cursor:default;content:'';background:", ";}"], ({
   theme
-}) => theme.colors.dim};
-  }
-`;
-const BaseDialog = styled.div(({
+}) => theme.colors.dim);
+const BaseDialog = /*#__PURE__*/styled.div.withConfig({
+  displayName: "Dialog__BaseDialog",
+  componentId: "sc-1c7dkhn-1"
+})(({
   theme
 }) => ({
   display: 'flex',

package/esm/core/Drawer/_UnstyledDrawerBody.js

@@ -1,15 +1,11 @@
 import styled from 'styled-components';
 import { sx } from '../../utils/styled-system/index.js';
 
-const UnstyledDrawerBody = styled.div.attrs({
+const UnstyledDrawerBody = /*#__PURE__*/styled.div.attrs({
   className: 'trk-drawer_body'
-})`
-  flex-grow: 1;
-  flex-shrink: 1;
-  flex-basis: auto;
-  overflow-y: auto;
-
-  ${sx}
-`;
+}).withConfig({
+  displayName: "_UnstyledDrawerBody__UnstyledDrawerBody",
+  componentId: "sc-128haqe-0"
+})(["flex-grow:1;flex-shrink:1;flex-basis:auto;overflow-y:auto;", ""], sx);
 
 export { UnstyledDrawerBody as default };

package/esm/core/Drawer/_UnstyledDrawerFooter.js

@@ -1,14 +1,11 @@
 import styled from 'styled-components';
 import { sx } from '../../utils/styled-system/index.js';
 
-const UnstyledDrawerFooter = styled.div.attrs({
+const UnstyledDrawerFooter = /*#__PURE__*/styled.div.attrs({
   className: 'trk-drawer_footer'
-})`
-  flex-grow: 0;
-  flex-shrink: 0;
-  flex-basis: auto;
-
-  ${sx}
-`;
+}).withConfig({
+  displayName: "_UnstyledDrawerFooter__UnstyledDrawerFooter",
+  componentId: "sc-l06yi3-0"
+})(["flex-grow:0;flex-shrink:0;flex-basis:auto;", ""], sx);
 
 export { UnstyledDrawerFooter as default };

package/esm/core/Drawer/_UnstyledDrawerHeader.js

@@ -1,14 +1,11 @@
 import styled from 'styled-components';
 import { sx } from '../../utils/styled-system/index.js';
 
-const UnstyledDrawerHeader = styled.div.attrs({
+const UnstyledDrawerHeader = /*#__PURE__*/styled.div.attrs({
   className: 'trk-drawer_header'
-})`
-  flex-grow: 0;
-  flex-shrink: 0;
-  flex-basis: auto;
-
-  ${sx}
-`;
+}).withConfig({
+  displayName: "_UnstyledDrawerHeader__UnstyledDrawerHeader",
+  componentId: "sc-1jvii2r-0"
+})(["flex-grow:0;flex-shrink:0;flex-basis:auto;", ""], sx);
 
 export { UnstyledDrawerHeader as default };