@veeqo/ui 10.0.1 → 10.2.0

package/dist/components/DataTable/components/Cell.cjs

@@ -11,7 +11,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const Cell = styled__default.default.td.withConfig({ displayName: "vui--Cell", componentId: "vui--i59hqc" }) `display:flex;align-items:center;justify-content:${({ align = 'left' }) => alignmentToFlex.alignmentToFlex(align)};background-color:white;padding-bottom:var(--density);padding-top:var(--density);padding-left:${({ spacing = constants.defaultCellSpacing }) => index.theme.sizes[spacing]};padding-right:${({ spacing = constants.defaultCellSpacing }) => index.theme.sizes[spacing]};color:${index.theme.text.bodySmall.color};font-family:${index.theme.text.bodySmall.fontFamily};font-size:${index.theme.text.bodySmall.fontSize};font-style:${index.theme.text.bodySmall.fontStyle};font-weight:${index.theme.text.bodySmall.fontWeight};line-height:${index.theme.text.bodySmall.lineHeight};grid-column-end:${({ span = 1 }) => `span ${span}`};tfoot &{min-height:${constants.footerCellHeight};border-top:1px solid ${index.theme.colors.secondary.blue.base};background-color:${index.theme.colors.neutral.grey.lightest};}`;
+const Cell = styled__default.default.td.withConfig({ displayName: "vui--Cell", componentId: "vui--1oz46st" }) `display:flex;align-items:center;justify-content:${({ align = 'left' }) => alignmentToFlex.alignmentToFlex(align)};background-color:white;padding-bottom:var(--density);padding-top:var(--density);padding-left:${({ spacing = constants.defaultCellSpacing }) => index.theme.sizes[spacing]};padding-right:${({ spacing = constants.defaultCellSpacing }) => index.theme.sizes[spacing]};color:${index.theme.text.bodySmall.color};font-family:${index.theme.text.bodySmall.fontFamily};font-size:${index.theme.text.bodySmall.fontSize};font-style:${index.theme.text.bodySmall.fontStyle};font-weight:${index.theme.text.bodySmall.fontWeight};line-height:${index.theme.text.bodySmall.lineHeight};grid-column-end:${({ span = 1 }) => `span ${span}`};tfoot &{min-height:${constants.footerCellHeight};border-top:1px solid ${index.theme.colors.secondary.blue.base};background-color:${index.theme.colors.neutral.grey.lightest};}`;
 
 exports.Cell = Cell;
 //# sourceMappingURL=Cell.cjs.map

package/dist/components/DataTable/components/Cell.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Cell.cjs","sources":["../../../../src/components/DataTable/components/Cell.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\nimport { ColumnAlignment, ColumnSpacing } from '../types';\nimport { alignmentToFlex } from '../utils';\nimport { defaultCellSpacing, footerCellHeight } from '../constants';\n\nexport interface CellProps {\n  align?: ColumnAlignment;\n  spacing?: ColumnSpacing;\n  span?: number;\n}\n\nexport const Cell = styled.td<CellProps>`\n  display: flex;\n  align-items: center;\n  justify-content: ${({ align = 'left' }) => alignmentToFlex(align)};\n\n  /* Styling */\n  background-color: white;\n  padding-bottom: var(--density);\n  padding-top: var(--density);\n  padding-left: ${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};\n  padding-right: ${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};\n\n  /* Content */\n  color: ${theme.text.bodySmall.color};\n  font-family: ${theme.text.bodySmall.fontFamily};\n  font-size: ${theme.text.bodySmall.fontSize};\n  font-style: ${theme.text.bodySmall.fontStyle};\n  font-weight: ${theme.text.bodySmall.fontWeight};\n  line-height: ${theme.text.bodySmall.lineHeight};\n\n  /* Grid */\n  grid-column-end: ${({ span = 1 }) => `span ${span}`};\n\n  tfoot & {\n    min-height: ${footerCellHeight};\n    border-top: 1px solid ${theme.colors.secondary.blue.base};\n    background-color: ${theme.colors.neutral.grey.lightest};\n  }\n`;\n"],"names":["styled","alignmentToFlex","defaultCellSpacing","theme","footerCellHeight"],"mappings":";;;;;;;;;;;;;AAYO,MAAM,IAAI,GAAGA,uBAAM,CAAC,EAAE,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,gDAAA,EAGR,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,KAAKC,+BAAe,CAAC,KAAK,CAAC,iGAMjD,CAAC,EAAE,OAAO,GAAGC,4BAAkB,EAAE,KAAKC,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CACzD,eAAA,EAAA,CAAC,EAAE,OAAO,GAAGD,4BAAkB,EAAE,KAAKC,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAA,OAAA,EAGlEA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CACpB,aAAA,EAAAA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAA,WAAA,EACjCA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAA,YAAA,EAC5BA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAC7B,aAAA,EAAAA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAA,aAAA,EAC/BA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAG3B,iBAAA,EAAA,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAGnC,oBAAA,EAAAC,0BAAgB,CACN,sBAAA,EAAAD,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,kBAAA,EACpCA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ;;;;"}
+{"version":3,"file":"Cell.cjs","sources":["../../../../src/components/DataTable/components/Cell.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\nimport { ColumnAlignment, ColumnSpacing } from '../types';\nimport { alignmentToFlex } from '../utils';\nimport { defaultCellSpacing, footerCellHeight } from '../constants';\n\nexport interface CellProps {\n  align?: ColumnAlignment;\n  spacing?: ColumnSpacing;\n  span?: number;\n}\n\nexport const Cell = styled.td<CellProps>`\n  display: flex;\n  align-items: center;\n  justify-content: ${({ align = 'left' }) => alignmentToFlex(align)};\n\n  /* Styling */\n  background-color: white;\n  padding-bottom: var(--density);\n  padding-top: var(--density);\n  padding-left: ${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};\n  padding-right: ${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};\n\n  /* Content */\n  color: ${theme.text.bodySmall.color};\n  font-family: ${theme.text.bodySmall.fontFamily};\n  font-size: ${theme.text.bodySmall.fontSize};\n  font-style: ${theme.text.bodySmall.fontStyle};\n  font-weight: ${theme.text.bodySmall.fontWeight};\n  line-height: ${theme.text.bodySmall.lineHeight};\n\n  /* Grid */\n  grid-column-end: ${({ span = 1 }) => `span ${span}`};\n\n  tfoot & {\n    min-height: ${footerCellHeight};\n    border-top: 1px solid ${theme.colors.secondary.blue.base};\n    background-color: ${theme.colors.neutral.grey.lightest};\n  }\n`;\n"],"names":["styled","alignmentToFlex","defaultCellSpacing","theme","footerCellHeight"],"mappings":";;;;;;;;;;;;;AAYO,MAAM,IAAI,GAAGA,uBAAM,CAAC,EAAE,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,gDAAA,EAGR,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,KAAKC,+BAAe,CAAC,KAAK,CAAC,iGAMjD,CAAC,EAAE,OAAO,GAAGC,4BAAkB,EAAE,KAAKC,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CACzD,eAAA,EAAA,CAAC,EAAE,OAAO,GAAGD,4BAAkB,EAAE,KAAKC,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAA,OAAA,EAGlEA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CACpB,aAAA,EAAAA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAA,WAAA,EACjCA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAA,YAAA,EAC5BA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAC7B,aAAA,EAAAA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAA,aAAA,EAC/BA,WAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAG3B,iBAAA,EAAA,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAGnC,oBAAA,EAAAC,0BAAgB,CACN,sBAAA,EAAAD,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,kBAAA,EACpCA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ;;;;"}

package/dist/components/DataTable/components/Cell.js

@@ -5,7 +5,7 @@ import '../types.js';
 import 'react';
 import { defaultCellSpacing, footerCellHeight } from '../constants.js';
 
-const Cell = styled.td.withConfig({ displayName: "vui--Cell", componentId: "vui--i59hqc" }) `display:flex;align-items:center;justify-content:${({ align = 'left' }) => alignmentToFlex(align)};background-color:white;padding-bottom:var(--density);padding-top:var(--density);padding-left:${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};padding-right:${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};color:${theme.text.bodySmall.color};font-family:${theme.text.bodySmall.fontFamily};font-size:${theme.text.bodySmall.fontSize};font-style:${theme.text.bodySmall.fontStyle};font-weight:${theme.text.bodySmall.fontWeight};line-height:${theme.text.bodySmall.lineHeight};grid-column-end:${({ span = 1 }) => `span ${span}`};tfoot &{min-height:${footerCellHeight};border-top:1px solid ${theme.colors.secondary.blue.base};background-color:${theme.colors.neutral.grey.lightest};}`;
+const Cell = styled.td.withConfig({ displayName: "vui--Cell", componentId: "vui--1oz46st" }) `display:flex;align-items:center;justify-content:${({ align = 'left' }) => alignmentToFlex(align)};background-color:white;padding-bottom:var(--density);padding-top:var(--density);padding-left:${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};padding-right:${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};color:${theme.text.bodySmall.color};font-family:${theme.text.bodySmall.fontFamily};font-size:${theme.text.bodySmall.fontSize};font-style:${theme.text.bodySmall.fontStyle};font-weight:${theme.text.bodySmall.fontWeight};line-height:${theme.text.bodySmall.lineHeight};grid-column-end:${({ span = 1 }) => `span ${span}`};tfoot &{min-height:${footerCellHeight};border-top:1px solid ${theme.colors.secondary.blue.base};background-color:${theme.colors.neutral.grey.lightest};}`;
 
 export { Cell };
 //# sourceMappingURL=Cell.js.map

package/dist/components/DataTable/components/Cell.js.map

@@ -1 +1 @@
-{"version":3,"file":"Cell.js","sources":["../../../../src/components/DataTable/components/Cell.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\nimport { ColumnAlignment, ColumnSpacing } from '../types';\nimport { alignmentToFlex } from '../utils';\nimport { defaultCellSpacing, footerCellHeight } from '../constants';\n\nexport interface CellProps {\n  align?: ColumnAlignment;\n  spacing?: ColumnSpacing;\n  span?: number;\n}\n\nexport const Cell = styled.td<CellProps>`\n  display: flex;\n  align-items: center;\n  justify-content: ${({ align = 'left' }) => alignmentToFlex(align)};\n\n  /* Styling */\n  background-color: white;\n  padding-bottom: var(--density);\n  padding-top: var(--density);\n  padding-left: ${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};\n  padding-right: ${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};\n\n  /* Content */\n  color: ${theme.text.bodySmall.color};\n  font-family: ${theme.text.bodySmall.fontFamily};\n  font-size: ${theme.text.bodySmall.fontSize};\n  font-style: ${theme.text.bodySmall.fontStyle};\n  font-weight: ${theme.text.bodySmall.fontWeight};\n  line-height: ${theme.text.bodySmall.lineHeight};\n\n  /* Grid */\n  grid-column-end: ${({ span = 1 }) => `span ${span}`};\n\n  tfoot & {\n    min-height: ${footerCellHeight};\n    border-top: 1px solid ${theme.colors.secondary.blue.base};\n    background-color: ${theme.colors.neutral.grey.lightest};\n  }\n`;\n"],"names":[],"mappings":";;;;;;;AAYO,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,gDAAA,EAGR,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,KAAK,eAAe,CAAC,KAAK,CAAC,iGAMjD,CAAC,EAAE,OAAO,GAAG,kBAAkB,EAAE,KAAK,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CACzD,eAAA,EAAA,CAAC,EAAE,OAAO,GAAG,kBAAkB,EAAE,KAAK,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAA,OAAA,EAGlE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CACpB,aAAA,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAA,WAAA,EACjC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAA,YAAA,EAC5B,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAC7B,aAAA,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAA,aAAA,EAC/B,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAG3B,iBAAA,EAAA,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAGnC,oBAAA,EAAA,gBAAgB,CACN,sBAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,kBAAA,EACpC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ;;;;"}
+{"version":3,"file":"Cell.js","sources":["../../../../src/components/DataTable/components/Cell.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\nimport { ColumnAlignment, ColumnSpacing } from '../types';\nimport { alignmentToFlex } from '../utils';\nimport { defaultCellSpacing, footerCellHeight } from '../constants';\n\nexport interface CellProps {\n  align?: ColumnAlignment;\n  spacing?: ColumnSpacing;\n  span?: number;\n}\n\nexport const Cell = styled.td<CellProps>`\n  display: flex;\n  align-items: center;\n  justify-content: ${({ align = 'left' }) => alignmentToFlex(align)};\n\n  /* Styling */\n  background-color: white;\n  padding-bottom: var(--density);\n  padding-top: var(--density);\n  padding-left: ${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};\n  padding-right: ${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};\n\n  /* Content */\n  color: ${theme.text.bodySmall.color};\n  font-family: ${theme.text.bodySmall.fontFamily};\n  font-size: ${theme.text.bodySmall.fontSize};\n  font-style: ${theme.text.bodySmall.fontStyle};\n  font-weight: ${theme.text.bodySmall.fontWeight};\n  line-height: ${theme.text.bodySmall.lineHeight};\n\n  /* Grid */\n  grid-column-end: ${({ span = 1 }) => `span ${span}`};\n\n  tfoot & {\n    min-height: ${footerCellHeight};\n    border-top: 1px solid ${theme.colors.secondary.blue.base};\n    background-color: ${theme.colors.neutral.grey.lightest};\n  }\n`;\n"],"names":[],"mappings":";;;;;;;AAYO,MAAM,IAAI,GAAG,MAAM,CAAC,EAAE,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,gDAAA,EAGR,CAAC,EAAE,KAAK,GAAG,MAAM,EAAE,KAAK,eAAe,CAAC,KAAK,CAAC,iGAMjD,CAAC,EAAE,OAAO,GAAG,kBAAkB,EAAE,KAAK,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CACzD,eAAA,EAAA,CAAC,EAAE,OAAO,GAAG,kBAAkB,EAAE,KAAK,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,CAAA,OAAA,EAGlE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CACpB,aAAA,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAA,WAAA,EACjC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAA,YAAA,EAC5B,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAC7B,aAAA,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAAA,aAAA,EAC/B,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,UAAU,CAG3B,iBAAA,EAAA,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,CAAA,KAAA,EAAQ,IAAI,CAAA,CAAE,CAGnC,oBAAA,EAAA,gBAAgB,CACN,sBAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAA,kBAAA,EACpC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ;;;;"}

package/dist/components/DataTable/components/ColumnDivider.cjs

@@ -9,7 +9,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const ResizerBar = styled__default.default.div.withConfig({ displayName: "vui--ResizerBar", componentId: "vui--1od95ba" }) `position:absolute;right:0;top:37.5%;width:1px;background:${index.theme.colors.neutral.grey.dark};min-height:25%;cursor:col-resize;user-select:none;&::before{content:'';position:absolute;top:-150%;left:0;width:12px;min-height:400%;z-index:1;transform:translateX(-6px);}`;
+const ResizerBar = styled__default.default.div.withConfig({ displayName: "vui--ResizerBar", componentId: "vui--115ilx" }) `position:absolute;right:0;top:37.5%;width:1px;background:${index.theme.colors.neutral.grey.dark};min-height:25%;cursor:col-resize;user-select:none;&::before{content:'';position:absolute;top:-150%;left:0;width:12px;min-height:400%;z-index:1;transform:translateX(-6px);}`;
 const ColumnDivider = ({ columnId, setColumnWidth, minWidth }) => {
     const ref = React.createRef();
     const padding = 24;

package/dist/components/DataTable/components/ColumnDivider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnDivider.cjs","sources":["../../../../src/components/DataTable/components/ColumnDivider.tsx"],"sourcesContent":["import React, { createRef } from 'react';\nimport styled from 'styled-components';\nimport { ColumnId, ColumnWidthHandler } from '../types';\nimport { theme } from '../../../theme';\n\nexport type ColumnDividerProps = {\n  columnId: ColumnId;\n  setColumnWidth?: ColumnWidthHandler;\n  minWidth?: number;\n};\n\nexport type CalculateWidthProps = {\n  event: MouseEvent;\n};\n\nexport const ResizerBar = styled.div`\n  position: absolute;\n  right: 0;\n  top: 37.5%;\n  width: 1px;\n  background: ${theme.colors.neutral.grey.dark};\n  min-height: 25%;\n  cursor: col-resize;\n  user-select: none;\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: -150%;\n    left: 0;\n    width: 12px;\n    min-height: 400%;\n    z-index: 1;\n    transform: translateX(-6px);\n  }\n`;\n\nexport const ColumnDivider = ({ columnId, setColumnWidth, minWidth }: ColumnDividerProps) => {\n  const ref = createRef<HTMLDivElement>();\n  const padding = 24;\n\n  const mouseMove = (event: MouseEvent) => {\n    const { minTranslate, dragDivider, dragInitX } = window.tableHeaders;\n    const translate = Math.max(event.clientX - (dragInitX || 0), minTranslate || 0);\n\n    dragDivider!.parentElement!.parentElement!.classList.add('hideHeaderDetails');\n    dragDivider!.style.transform = `translateX(${translate}px)`;\n  };\n\n  const minTranslate = () => {\n    const { parentElement } = window.tableHeaders.dragDivider!;\n    const contentWidth = parentElement!\n      .querySelector('.headerContent')!\n      .getBoundingClientRect().width;\n\n    const currWidth = parentElement!.getBoundingClientRect().width;\n\n    return contentWidth - currWidth + padding;\n  };\n\n  const calculateWidth = ({ event }: CalculateWidthProps) => {\n    const { dragInitX, dragDivider } = window.tableHeaders;\n    const { parentElement } = dragDivider!;\n    const initWidth = parentElement?.getBoundingClientRect().width;\n    const contentWidth = parentElement!\n      .querySelector('.headerContent')!\n      .getBoundingClientRect().width;\n\n    const finalWidth = minWidth && contentWidth < minWidth ? minWidth : contentWidth;\n\n    const deltaX = (event.clientX || 0) - (dragInitX || 0);\n\n    return Math.max((initWidth || 0) + deltaX, finalWidth + padding);\n  };\n\n  const mouseUp = (event: MouseEvent) => {\n    window.removeEventListener('mouseup', mouseUp);\n    window.removeEventListener('dragend', mouseUp);\n    window.removeEventListener('mousemove', mouseMove);\n    window.removeEventListener('drag', mouseMove);\n    setColumnWidth?.({ columnId, width: calculateWidth({ event }) });\n    if (window.tableHeaders) {\n      window.tableHeaders.dragDivider!.style.transform = 'translateX(0)';\n      window.tableHeaders.dragDivider!.parentElement!.style.justifyContent = '';\n      window.tableHeaders.dragInitX = undefined;\n      window.tableHeaders.minTranslate = undefined;\n      window.tableHeaders.dragDivider!.parentElement!.parentElement!.classList.remove(\n        'hideHeaderDetails',\n      );\n    }\n  };\n\n  const trackMouseStart: React.MouseEventHandler<HTMLDivElement> = (event) => {\n    if (event.button !== 0 && event.type !== 'dragstart') return;\n    window.tableHeaders = {\n      dragInitX: event.clientX, // Using global prop instead of react prop for performance\n      dragDivider: ref.current,\n    };\n    window.tableHeaders.minTranslate = minTranslate();\n\n    window.addEventListener('mouseup', mouseUp);\n    window.addEventListener('dragend', mouseUp);\n    window.addEventListener('mousemove', mouseMove);\n    window.addEventListener('drag', mouseMove);\n  };\n\n  return (\n    <ResizerBar\n      ref={ref}\n      className=\"th-divider\"\n      onMouseDown={trackMouseStart}\n      onDragStart={trackMouseStart}\n    />\n  );\n};\n"],"names":["styled","theme","createRef","React"],"mappings":"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"}
+{"version":3,"file":"ColumnDivider.cjs","sources":["../../../../src/components/DataTable/components/ColumnDivider.tsx"],"sourcesContent":["import React, { createRef } from 'react';\nimport styled from 'styled-components';\nimport { ColumnId, ColumnWidthHandler } from '../types';\nimport { theme } from '../../../theme';\n\nexport type ColumnDividerProps = {\n  columnId: ColumnId;\n  setColumnWidth?: ColumnWidthHandler;\n  minWidth?: number;\n};\n\nexport type CalculateWidthProps = {\n  event: MouseEvent;\n};\n\nexport const ResizerBar = styled.div`\n  position: absolute;\n  right: 0;\n  top: 37.5%;\n  width: 1px;\n  background: ${theme.colors.neutral.grey.dark};\n  min-height: 25%;\n  cursor: col-resize;\n  user-select: none;\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: -150%;\n    left: 0;\n    width: 12px;\n    min-height: 400%;\n    z-index: 1;\n    transform: translateX(-6px);\n  }\n`;\n\nexport const ColumnDivider = ({ columnId, setColumnWidth, minWidth }: ColumnDividerProps) => {\n  const ref = createRef<HTMLDivElement>();\n  const padding = 24;\n\n  const mouseMove = (event: MouseEvent) => {\n    const { minTranslate, dragDivider, dragInitX } = window.tableHeaders;\n    const translate = Math.max(event.clientX - (dragInitX || 0), minTranslate || 0);\n\n    dragDivider!.parentElement!.parentElement!.classList.add('hideHeaderDetails');\n    dragDivider!.style.transform = `translateX(${translate}px)`;\n  };\n\n  const minTranslate = () => {\n    const { parentElement } = window.tableHeaders.dragDivider!;\n    const contentWidth = parentElement!\n      .querySelector('.headerContent')!\n      .getBoundingClientRect().width;\n\n    const currWidth = parentElement!.getBoundingClientRect().width;\n\n    return contentWidth - currWidth + padding;\n  };\n\n  const calculateWidth = ({ event }: CalculateWidthProps) => {\n    const { dragInitX, dragDivider } = window.tableHeaders;\n    const { parentElement } = dragDivider!;\n    const initWidth = parentElement?.getBoundingClientRect().width;\n    const contentWidth = parentElement!\n      .querySelector('.headerContent')!\n      .getBoundingClientRect().width;\n\n    const finalWidth = minWidth && contentWidth < minWidth ? minWidth : contentWidth;\n\n    const deltaX = (event.clientX || 0) - (dragInitX || 0);\n\n    return Math.max((initWidth || 0) + deltaX, finalWidth + padding);\n  };\n\n  const mouseUp = (event: MouseEvent) => {\n    window.removeEventListener('mouseup', mouseUp);\n    window.removeEventListener('dragend', mouseUp);\n    window.removeEventListener('mousemove', mouseMove);\n    window.removeEventListener('drag', mouseMove);\n    setColumnWidth?.({ columnId, width: calculateWidth({ event }) });\n    if (window.tableHeaders) {\n      window.tableHeaders.dragDivider!.style.transform = 'translateX(0)';\n      window.tableHeaders.dragDivider!.parentElement!.style.justifyContent = '';\n      window.tableHeaders.dragInitX = undefined;\n      window.tableHeaders.minTranslate = undefined;\n      window.tableHeaders.dragDivider!.parentElement!.parentElement!.classList.remove(\n        'hideHeaderDetails',\n      );\n    }\n  };\n\n  const trackMouseStart: React.MouseEventHandler<HTMLDivElement> = (event) => {\n    if (event.button !== 0 && event.type !== 'dragstart') return;\n    window.tableHeaders = {\n      dragInitX: event.clientX, // Using global prop instead of react prop for performance\n      dragDivider: ref.current,\n    };\n    window.tableHeaders.minTranslate = minTranslate();\n\n    window.addEventListener('mouseup', mouseUp);\n    window.addEventListener('dragend', mouseUp);\n    window.addEventListener('mousemove', mouseMove);\n    window.addEventListener('drag', mouseMove);\n  };\n\n  return (\n    <ResizerBar\n      ref={ref}\n      className=\"th-divider\"\n      onMouseDown={trackMouseStart}\n      onDragStart={trackMouseStart}\n    />\n  );\n};\n"],"names":["styled","theme","createRef","React"],"mappings":"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"}

package/dist/components/DataTable/components/ColumnDivider.js

@@ -2,7 +2,7 @@ import React__default, { createRef } from 'react';
 import styled from 'styled-components';
 import { theme } from '../../../theme/index.js';
 
-const ResizerBar = styled.div.withConfig({ displayName: "vui--ResizerBar", componentId: "vui--1od95ba" }) `position:absolute;right:0;top:37.5%;width:1px;background:${theme.colors.neutral.grey.dark};min-height:25%;cursor:col-resize;user-select:none;&::before{content:'';position:absolute;top:-150%;left:0;width:12px;min-height:400%;z-index:1;transform:translateX(-6px);}`;
+const ResizerBar = styled.div.withConfig({ displayName: "vui--ResizerBar", componentId: "vui--115ilx" }) `position:absolute;right:0;top:37.5%;width:1px;background:${theme.colors.neutral.grey.dark};min-height:25%;cursor:col-resize;user-select:none;&::before{content:'';position:absolute;top:-150%;left:0;width:12px;min-height:400%;z-index:1;transform:translateX(-6px);}`;
 const ColumnDivider = ({ columnId, setColumnWidth, minWidth }) => {
     const ref = createRef();
     const padding = 24;

package/dist/components/DataTable/components/ColumnDivider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnDivider.js","sources":["../../../../src/components/DataTable/components/ColumnDivider.tsx"],"sourcesContent":["import React, { createRef } from 'react';\nimport styled from 'styled-components';\nimport { ColumnId, ColumnWidthHandler } from '../types';\nimport { theme } from '../../../theme';\n\nexport type ColumnDividerProps = {\n  columnId: ColumnId;\n  setColumnWidth?: ColumnWidthHandler;\n  minWidth?: number;\n};\n\nexport type CalculateWidthProps = {\n  event: MouseEvent;\n};\n\nexport const ResizerBar = styled.div`\n  position: absolute;\n  right: 0;\n  top: 37.5%;\n  width: 1px;\n  background: ${theme.colors.neutral.grey.dark};\n  min-height: 25%;\n  cursor: col-resize;\n  user-select: none;\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: -150%;\n    left: 0;\n    width: 12px;\n    min-height: 400%;\n    z-index: 1;\n    transform: translateX(-6px);\n  }\n`;\n\nexport const ColumnDivider = ({ columnId, setColumnWidth, minWidth }: ColumnDividerProps) => {\n  const ref = createRef<HTMLDivElement>();\n  const padding = 24;\n\n  const mouseMove = (event: MouseEvent) => {\n    const { minTranslate, dragDivider, dragInitX } = window.tableHeaders;\n    const translate = Math.max(event.clientX - (dragInitX || 0), minTranslate || 0);\n\n    dragDivider!.parentElement!.parentElement!.classList.add('hideHeaderDetails');\n    dragDivider!.style.transform = `translateX(${translate}px)`;\n  };\n\n  const minTranslate = () => {\n    const { parentElement } = window.tableHeaders.dragDivider!;\n    const contentWidth = parentElement!\n      .querySelector('.headerContent')!\n      .getBoundingClientRect().width;\n\n    const currWidth = parentElement!.getBoundingClientRect().width;\n\n    return contentWidth - currWidth + padding;\n  };\n\n  const calculateWidth = ({ event }: CalculateWidthProps) => {\n    const { dragInitX, dragDivider } = window.tableHeaders;\n    const { parentElement } = dragDivider!;\n    const initWidth = parentElement?.getBoundingClientRect().width;\n    const contentWidth = parentElement!\n      .querySelector('.headerContent')!\n      .getBoundingClientRect().width;\n\n    const finalWidth = minWidth && contentWidth < minWidth ? minWidth : contentWidth;\n\n    const deltaX = (event.clientX || 0) - (dragInitX || 0);\n\n    return Math.max((initWidth || 0) + deltaX, finalWidth + padding);\n  };\n\n  const mouseUp = (event: MouseEvent) => {\n    window.removeEventListener('mouseup', mouseUp);\n    window.removeEventListener('dragend', mouseUp);\n    window.removeEventListener('mousemove', mouseMove);\n    window.removeEventListener('drag', mouseMove);\n    setColumnWidth?.({ columnId, width: calculateWidth({ event }) });\n    if (window.tableHeaders) {\n      window.tableHeaders.dragDivider!.style.transform = 'translateX(0)';\n      window.tableHeaders.dragDivider!.parentElement!.style.justifyContent = '';\n      window.tableHeaders.dragInitX = undefined;\n      window.tableHeaders.minTranslate = undefined;\n      window.tableHeaders.dragDivider!.parentElement!.parentElement!.classList.remove(\n        'hideHeaderDetails',\n      );\n    }\n  };\n\n  const trackMouseStart: React.MouseEventHandler<HTMLDivElement> = (event) => {\n    if (event.button !== 0 && event.type !== 'dragstart') return;\n    window.tableHeaders = {\n      dragInitX: event.clientX, // Using global prop instead of react prop for performance\n      dragDivider: ref.current,\n    };\n    window.tableHeaders.minTranslate = minTranslate();\n\n    window.addEventListener('mouseup', mouseUp);\n    window.addEventListener('dragend', mouseUp);\n    window.addEventListener('mousemove', mouseMove);\n    window.addEventListener('drag', mouseMove);\n  };\n\n  return (\n    <ResizerBar\n      ref={ref}\n      className=\"th-divider\"\n      onMouseDown={trackMouseStart}\n      onDragStart={trackMouseStart}\n    />\n  );\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"ColumnDivider.js","sources":["../../../../src/components/DataTable/components/ColumnDivider.tsx"],"sourcesContent":["import React, { createRef } from 'react';\nimport styled from 'styled-components';\nimport { ColumnId, ColumnWidthHandler } from '../types';\nimport { theme } from '../../../theme';\n\nexport type ColumnDividerProps = {\n  columnId: ColumnId;\n  setColumnWidth?: ColumnWidthHandler;\n  minWidth?: number;\n};\n\nexport type CalculateWidthProps = {\n  event: MouseEvent;\n};\n\nexport const ResizerBar = styled.div`\n  position: absolute;\n  right: 0;\n  top: 37.5%;\n  width: 1px;\n  background: ${theme.colors.neutral.grey.dark};\n  min-height: 25%;\n  cursor: col-resize;\n  user-select: none;\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: -150%;\n    left: 0;\n    width: 12px;\n    min-height: 400%;\n    z-index: 1;\n    transform: translateX(-6px);\n  }\n`;\n\nexport const ColumnDivider = ({ columnId, setColumnWidth, minWidth }: ColumnDividerProps) => {\n  const ref = createRef<HTMLDivElement>();\n  const padding = 24;\n\n  const mouseMove = (event: MouseEvent) => {\n    const { minTranslate, dragDivider, dragInitX } = window.tableHeaders;\n    const translate = Math.max(event.clientX - (dragInitX || 0), minTranslate || 0);\n\n    dragDivider!.parentElement!.parentElement!.classList.add('hideHeaderDetails');\n    dragDivider!.style.transform = `translateX(${translate}px)`;\n  };\n\n  const minTranslate = () => {\n    const { parentElement } = window.tableHeaders.dragDivider!;\n    const contentWidth = parentElement!\n      .querySelector('.headerContent')!\n      .getBoundingClientRect().width;\n\n    const currWidth = parentElement!.getBoundingClientRect().width;\n\n    return contentWidth - currWidth + padding;\n  };\n\n  const calculateWidth = ({ event }: CalculateWidthProps) => {\n    const { dragInitX, dragDivider } = window.tableHeaders;\n    const { parentElement } = dragDivider!;\n    const initWidth = parentElement?.getBoundingClientRect().width;\n    const contentWidth = parentElement!\n      .querySelector('.headerContent')!\n      .getBoundingClientRect().width;\n\n    const finalWidth = minWidth && contentWidth < minWidth ? minWidth : contentWidth;\n\n    const deltaX = (event.clientX || 0) - (dragInitX || 0);\n\n    return Math.max((initWidth || 0) + deltaX, finalWidth + padding);\n  };\n\n  const mouseUp = (event: MouseEvent) => {\n    window.removeEventListener('mouseup', mouseUp);\n    window.removeEventListener('dragend', mouseUp);\n    window.removeEventListener('mousemove', mouseMove);\n    window.removeEventListener('drag', mouseMove);\n    setColumnWidth?.({ columnId, width: calculateWidth({ event }) });\n    if (window.tableHeaders) {\n      window.tableHeaders.dragDivider!.style.transform = 'translateX(0)';\n      window.tableHeaders.dragDivider!.parentElement!.style.justifyContent = '';\n      window.tableHeaders.dragInitX = undefined;\n      window.tableHeaders.minTranslate = undefined;\n      window.tableHeaders.dragDivider!.parentElement!.parentElement!.classList.remove(\n        'hideHeaderDetails',\n      );\n    }\n  };\n\n  const trackMouseStart: React.MouseEventHandler<HTMLDivElement> = (event) => {\n    if (event.button !== 0 && event.type !== 'dragstart') return;\n    window.tableHeaders = {\n      dragInitX: event.clientX, // Using global prop instead of react prop for performance\n      dragDivider: ref.current,\n    };\n    window.tableHeaders.minTranslate = minTranslate();\n\n    window.addEventListener('mouseup', mouseUp);\n    window.addEventListener('dragend', mouseUp);\n    window.addEventListener('mousemove', mouseMove);\n    window.addEventListener('drag', mouseMove);\n  };\n\n  return (\n    <ResizerBar\n      ref={ref}\n      className=\"th-divider\"\n      onMouseDown={trackMouseStart}\n      onDragStart={trackMouseStart}\n    />\n  );\n};\n"],"names":["React"],"mappings":"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"}

package/dist/components/DataTable/components/ColumnHeader.cjs

@@ -7,12 +7,12 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const SortIndicator = styled__default.default.div.withConfig({ displayName: "vui--SortIndicator", componentId: "vui--1itlaj6" }) `width:20px;height:20px;display:flex;align-items:center;justify-content:center;background-color:white;color:${index.theme.colors.neutral.ink.lightest};`;
-const HeaderContent = styled__default.default.span.withConfig({ displayName: "vui--HeaderContent", componentId: "vui--1bvlb4j" }) `display:flex;height:28px;align-items:center;gap:4px;white-space:nowrap;color:${index.theme.text.headingTable.color};font-family:${index.theme.text.headingTable.fontFamily};font-size:${index.theme.text.headingTable.fontSize};font-style:${index.theme.text.headingTable.fontStyle};font-weight:${index.theme.text.headingTable.fontWeight};line-height:${index.theme.text.headingTable.lineHeight};`;
+const SortIndicator = styled__default.default.div.withConfig({ displayName: "vui--SortIndicator", componentId: "vui--o7masx" }) `width:20px;height:20px;display:flex;align-items:center;justify-content:center;background-color:white;color:${index.theme.colors.neutral.ink.lightest};`;
+const HeaderContent = styled__default.default.span.withConfig({ displayName: "vui--HeaderContent", componentId: "vui--vlccds" }) `display:flex;height:28px;align-items:center;gap:4px;white-space:nowrap;color:${index.theme.text.headingTable.color};font-family:${index.theme.text.headingTable.fontFamily};font-size:${index.theme.text.headingTable.fontSize};font-style:${index.theme.text.headingTable.fontStyle};font-weight:${index.theme.text.headingTable.fontWeight};line-height:${index.theme.text.headingTable.lineHeight};`;
 const ClickableHeaderContent = styled__default.default(HeaderContent).attrs(() => ({
     as: 'button',
     type: 'button',
-})).withConfig({ displayName: "vui--ClickableHeaderContent", componentId: "vui--mrmldg" }) `appearance:none;padding:0;border:0;border-radius:4px;background-color:transparent;&:not(:disabled):hover{cursor:pointer;}&:hover ${SortIndicator}{background-color:${index.theme.colors.neutral.grey.light};color:${index.theme.colors.neutral.ink.base};}&:focus-visible{outline:0;box-shadow:0px 0px 0px 2px ${index.theme.colors.secondary.blue.light};}`;
+})).withConfig({ displayName: "vui--ClickableHeaderContent", componentId: "vui--xbox8h" }) `appearance:none;padding:0;border:0;border-radius:4px;background-color:transparent;&:not(:disabled):hover{cursor:pointer;}&:hover ${SortIndicator}{background-color:${index.theme.colors.neutral.grey.light};color:${index.theme.colors.neutral.ink.base};}&:focus-visible{outline:0;box-shadow:0px 0px 0px 2px ${index.theme.colors.secondary.blue.light};}`;
 
 exports.ClickableHeaderContent = ClickableHeaderContent;
 exports.HeaderContent = HeaderContent;

package/dist/components/DataTable/components/ColumnHeader.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnHeader.cjs","sources":["../../../../src/components/DataTable/components/ColumnHeader.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nexport const SortIndicator = styled.div`\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: white;\n  color: ${theme.colors.neutral.ink.lightest};\n`;\n\nexport const HeaderContent = styled.span`\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: 4px;\n  white-space: nowrap;\n\n  color: ${theme.text.headingTable.color};\n  font-family: ${theme.text.headingTable.fontFamily};\n  font-size: ${theme.text.headingTable.fontSize};\n  font-style: ${theme.text.headingTable.fontStyle};\n  font-weight: ${theme.text.headingTable.fontWeight};\n  line-height: ${theme.text.headingTable.lineHeight};\n`;\n\nexport const ClickableHeaderContent = styled(HeaderContent).attrs(() => ({\n  as: 'button',\n  type: 'button',\n}))`\n  appearance: none;\n  padding: 0;\n  border: 0;\n  border-radius: 4px;\n  background-color: transparent;\n\n  &:not(:disabled):hover {\n    cursor: pointer;\n  }\n\n  &:hover ${SortIndicator} {\n    background-color: ${theme.colors.neutral.grey.light};\n    color: ${theme.colors.neutral.ink.base};\n  }\n\n  &:focus-visible {\n    outline: 0;\n    box-shadow: 0px 0px 0px 2px ${theme.colors.secondary.blue.light};\n  }\n`;\n"],"names":["styled","theme"],"mappings":";;;;;;;;;AAGa,MAAA,aAAa,GAAGA,uBAAM,CAAC,GAAG,CAO5B,UAAA,CAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,2GAAA,EAAAC,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAG/B,MAAA,aAAa,GAAGD,uBAAM,CAAC,IAAI,CAO7B,UAAA,CAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,6EAAA,EAAAC,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAA,aAAA,EACvBA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,WAAA,EACpCA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAC/B,YAAA,EAAAA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,CAChC,aAAA,EAAAA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,aAAA,EAClCA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,CAAA;AAG5C,MAAM,sBAAsB,GAAGD,uBAAM,CAAC,aAAa,CAAC,CAAC,KAAK,CAAC,OAAO;AACvE,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,IAAI,EAAE,QAAQ;AACf,CAAA,CAAC,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,6BAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,iIAAA,EAWS,aAAa,CAAA,kBAAA,EACDC,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,OAAA,EAC1CA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,0DAKRA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK;;;;;;"}
+{"version":3,"file":"ColumnHeader.cjs","sources":["../../../../src/components/DataTable/components/ColumnHeader.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nexport const SortIndicator = styled.div`\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: white;\n  color: ${theme.colors.neutral.ink.lightest};\n`;\n\nexport const HeaderContent = styled.span`\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: 4px;\n  white-space: nowrap;\n\n  color: ${theme.text.headingTable.color};\n  font-family: ${theme.text.headingTable.fontFamily};\n  font-size: ${theme.text.headingTable.fontSize};\n  font-style: ${theme.text.headingTable.fontStyle};\n  font-weight: ${theme.text.headingTable.fontWeight};\n  line-height: ${theme.text.headingTable.lineHeight};\n`;\n\nexport const ClickableHeaderContent = styled(HeaderContent).attrs(() => ({\n  as: 'button',\n  type: 'button',\n}))`\n  appearance: none;\n  padding: 0;\n  border: 0;\n  border-radius: 4px;\n  background-color: transparent;\n\n  &:not(:disabled):hover {\n    cursor: pointer;\n  }\n\n  &:hover ${SortIndicator} {\n    background-color: ${theme.colors.neutral.grey.light};\n    color: ${theme.colors.neutral.ink.base};\n  }\n\n  &:focus-visible {\n    outline: 0;\n    box-shadow: 0px 0px 0px 2px ${theme.colors.secondary.blue.light};\n  }\n`;\n"],"names":["styled","theme"],"mappings":";;;;;;;;;AAGa,MAAA,aAAa,GAAGA,uBAAM,CAAC,GAAG,CAO5B,UAAA,CAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,2GAAA,EAAAC,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAG/B,MAAA,aAAa,GAAGD,uBAAM,CAAC,IAAI,CAO7B,UAAA,CAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,6EAAA,EAAAC,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAA,aAAA,EACvBA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,WAAA,EACpCA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAC/B,YAAA,EAAAA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,CAChC,aAAA,EAAAA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,aAAA,EAClCA,WAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,CAAA;AAG5C,MAAM,sBAAsB,GAAGD,uBAAM,CAAC,aAAa,CAAC,CAAC,KAAK,CAAC,OAAO;AACvE,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,IAAI,EAAE,QAAQ;AACf,CAAA,CAAC,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,6BAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,iIAAA,EAWS,aAAa,CAAA,kBAAA,EACDC,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,OAAA,EAC1CA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,0DAKRA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK;;;;;;"}

package/dist/components/DataTable/components/ColumnHeader.js

@@ -1,12 +1,12 @@
 import styled from 'styled-components';
 import { theme } from '../../../theme/index.js';
 
-const SortIndicator = styled.div.withConfig({ displayName: "vui--SortIndicator", componentId: "vui--1itlaj6" }) `width:20px;height:20px;display:flex;align-items:center;justify-content:center;background-color:white;color:${theme.colors.neutral.ink.lightest};`;
-const HeaderContent = styled.span.withConfig({ displayName: "vui--HeaderContent", componentId: "vui--1bvlb4j" }) `display:flex;height:28px;align-items:center;gap:4px;white-space:nowrap;color:${theme.text.headingTable.color};font-family:${theme.text.headingTable.fontFamily};font-size:${theme.text.headingTable.fontSize};font-style:${theme.text.headingTable.fontStyle};font-weight:${theme.text.headingTable.fontWeight};line-height:${theme.text.headingTable.lineHeight};`;
+const SortIndicator = styled.div.withConfig({ displayName: "vui--SortIndicator", componentId: "vui--o7masx" }) `width:20px;height:20px;display:flex;align-items:center;justify-content:center;background-color:white;color:${theme.colors.neutral.ink.lightest};`;
+const HeaderContent = styled.span.withConfig({ displayName: "vui--HeaderContent", componentId: "vui--vlccds" }) `display:flex;height:28px;align-items:center;gap:4px;white-space:nowrap;color:${theme.text.headingTable.color};font-family:${theme.text.headingTable.fontFamily};font-size:${theme.text.headingTable.fontSize};font-style:${theme.text.headingTable.fontStyle};font-weight:${theme.text.headingTable.fontWeight};line-height:${theme.text.headingTable.lineHeight};`;
 const ClickableHeaderContent = styled(HeaderContent).attrs(() => ({
     as: 'button',
     type: 'button',
-})).withConfig({ displayName: "vui--ClickableHeaderContent", componentId: "vui--mrmldg" }) `appearance:none;padding:0;border:0;border-radius:4px;background-color:transparent;&:not(:disabled):hover{cursor:pointer;}&:hover ${SortIndicator}{background-color:${theme.colors.neutral.grey.light};color:${theme.colors.neutral.ink.base};}&:focus-visible{outline:0;box-shadow:0px 0px 0px 2px ${theme.colors.secondary.blue.light};}`;
+})).withConfig({ displayName: "vui--ClickableHeaderContent", componentId: "vui--xbox8h" }) `appearance:none;padding:0;border:0;border-radius:4px;background-color:transparent;&:not(:disabled):hover{cursor:pointer;}&:hover ${SortIndicator}{background-color:${theme.colors.neutral.grey.light};color:${theme.colors.neutral.ink.base};}&:focus-visible{outline:0;box-shadow:0px 0px 0px 2px ${theme.colors.secondary.blue.light};}`;
 
 export { ClickableHeaderContent, HeaderContent, SortIndicator };
 //# sourceMappingURL=ColumnHeader.js.map

package/dist/components/DataTable/components/ColumnHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnHeader.js","sources":["../../../../src/components/DataTable/components/ColumnHeader.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nexport const SortIndicator = styled.div`\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: white;\n  color: ${theme.colors.neutral.ink.lightest};\n`;\n\nexport const HeaderContent = styled.span`\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: 4px;\n  white-space: nowrap;\n\n  color: ${theme.text.headingTable.color};\n  font-family: ${theme.text.headingTable.fontFamily};\n  font-size: ${theme.text.headingTable.fontSize};\n  font-style: ${theme.text.headingTable.fontStyle};\n  font-weight: ${theme.text.headingTable.fontWeight};\n  line-height: ${theme.text.headingTable.lineHeight};\n`;\n\nexport const ClickableHeaderContent = styled(HeaderContent).attrs(() => ({\n  as: 'button',\n  type: 'button',\n}))`\n  appearance: none;\n  padding: 0;\n  border: 0;\n  border-radius: 4px;\n  background-color: transparent;\n\n  &:not(:disabled):hover {\n    cursor: pointer;\n  }\n\n  &:hover ${SortIndicator} {\n    background-color: ${theme.colors.neutral.grey.light};\n    color: ${theme.colors.neutral.ink.base};\n  }\n\n  &:focus-visible {\n    outline: 0;\n    box-shadow: 0px 0px 0px 2px ${theme.colors.secondary.blue.light};\n  }\n`;\n"],"names":[],"mappings":";;;AAGa,MAAA,aAAa,GAAG,MAAM,CAAC,GAAG,CAO5B,UAAA,CAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,2GAAA,EAAA,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAG/B,MAAA,aAAa,GAAG,MAAM,CAAC,IAAI,CAO7B,UAAA,CAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,6EAAA,EAAA,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAA,aAAA,EACvB,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,WAAA,EACpC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAC/B,YAAA,EAAA,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,CAChC,aAAA,EAAA,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,aAAA,EAClC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,CAAA;AAG5C,MAAM,sBAAsB,GAAG,MAAM,CAAC,aAAa,CAAC,CAAC,KAAK,CAAC,OAAO;AACvE,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,IAAI,EAAE,QAAQ;AACf,CAAA,CAAC,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,6BAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,iIAAA,EAWS,aAAa,CAAA,kBAAA,EACD,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,OAAA,EAC1C,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,0DAKR,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK;;;;"}
+{"version":3,"file":"ColumnHeader.js","sources":["../../../../src/components/DataTable/components/ColumnHeader.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nexport const SortIndicator = styled.div`\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background-color: white;\n  color: ${theme.colors.neutral.ink.lightest};\n`;\n\nexport const HeaderContent = styled.span`\n  display: flex;\n  height: 28px;\n  align-items: center;\n  gap: 4px;\n  white-space: nowrap;\n\n  color: ${theme.text.headingTable.color};\n  font-family: ${theme.text.headingTable.fontFamily};\n  font-size: ${theme.text.headingTable.fontSize};\n  font-style: ${theme.text.headingTable.fontStyle};\n  font-weight: ${theme.text.headingTable.fontWeight};\n  line-height: ${theme.text.headingTable.lineHeight};\n`;\n\nexport const ClickableHeaderContent = styled(HeaderContent).attrs(() => ({\n  as: 'button',\n  type: 'button',\n}))`\n  appearance: none;\n  padding: 0;\n  border: 0;\n  border-radius: 4px;\n  background-color: transparent;\n\n  &:not(:disabled):hover {\n    cursor: pointer;\n  }\n\n  &:hover ${SortIndicator} {\n    background-color: ${theme.colors.neutral.grey.light};\n    color: ${theme.colors.neutral.ink.base};\n  }\n\n  &:focus-visible {\n    outline: 0;\n    box-shadow: 0px 0px 0px 2px ${theme.colors.secondary.blue.light};\n  }\n`;\n"],"names":[],"mappings":";;;AAGa,MAAA,aAAa,GAAG,MAAM,CAAC,GAAG,CAO5B,UAAA,CAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,2GAAA,EAAA,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,QAAQ;AAG/B,MAAA,aAAa,GAAG,MAAM,CAAC,IAAI,CAO7B,UAAA,CAAA,EAAA,WAAA,EAAA,oBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,6EAAA,EAAA,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAA,aAAA,EACvB,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,WAAA,EACpC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAC/B,YAAA,EAAA,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,SAAS,CAChC,aAAA,EAAA,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,aAAA,EAClC,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAA,CAAA;AAG5C,MAAM,sBAAsB,GAAG,MAAM,CAAC,aAAa,CAAC,CAAC,KAAK,CAAC,OAAO;AACvE,IAAA,EAAE,EAAE,QAAQ;AACZ,IAAA,IAAI,EAAE,QAAQ;AACf,CAAA,CAAC,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,6BAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,iIAAA,EAWS,aAAa,CAAA,kBAAA,EACD,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAA,OAAA,EAC1C,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,0DAKR,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK;;;;"}

package/dist/components/DataTable/components/EmptyBodyContent.cjs

@@ -7,8 +7,8 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const EmptyBodyContent = styled__default.default.div.withConfig({ displayName: "vui--EmptyBodyContent", componentId: "vui--80fqan" }) `padding-top:${index.theme.sizes.lg};padding-bottom:${index.theme.sizes.lg};grid-column:${({ columnCount }) => `1 / span ${columnCount}`};display:flex;flex-direction:column;align-items:center;justify-content:center;gap:${index.theme.sizes.md};`;
-const EmptyBodyGlyphWrapper = styled__default.default.div.withConfig({ displayName: "vui--EmptyBodyGlyphWrapper", componentId: "vui--gozoo2" }) `padding:${index.theme.sizes.md};background-color:${index.theme.colors.neutral.grey.light};border-radius:${index.theme.radius.full};`;
+const EmptyBodyContent = styled__default.default.div.withConfig({ displayName: "vui--EmptyBodyContent", componentId: "vui--grzgy2" }) `padding-top:${index.theme.sizes.lg};padding-bottom:${index.theme.sizes.lg};grid-column:${({ columnCount }) => `1 / span ${columnCount}`};display:flex;flex-direction:column;align-items:center;justify-content:center;gap:${index.theme.sizes.md};`;
+const EmptyBodyGlyphWrapper = styled__default.default.div.withConfig({ displayName: "vui--EmptyBodyGlyphWrapper", componentId: "vui--1uqall4" }) `padding:${index.theme.sizes.md};background-color:${index.theme.colors.neutral.grey.light};border-radius:${index.theme.radius.full};`;
 
 exports.EmptyBodyContent = EmptyBodyContent;
 exports.EmptyBodyGlyphWrapper = EmptyBodyGlyphWrapper;

package/dist/components/DataTable/components/EmptyBodyContent.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyBodyContent.cjs","sources":["../../../../src/components/DataTable/components/EmptyBodyContent.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nexport interface EmptyBodyContentProps {\n  columnCount: number;\n}\n\nexport const EmptyBodyContent = styled.div<EmptyBodyContentProps>`\n  padding-top: ${theme.sizes.lg};\n  padding-bottom: ${theme.sizes.lg};\n  grid-column: ${({ columnCount }) => `1 / span ${columnCount}`};\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: ${theme.sizes.md};\n`;\n\nexport const EmptyBodyGlyphWrapper = styled.div`\n  padding: ${theme.sizes.md};\n  background-color: ${theme.colors.neutral.grey.light};\n  border-radius: ${theme.radius.full};\n`;\n"],"names":["styled","theme"],"mappings":";;;;;;;;;AAOa,MAAA,gBAAgB,GAAGA,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,YAAA,EACzBC,WAAK,CAAC,KAAK,CAAC,EAAE,CACX,gBAAA,EAAAA,WAAK,CAAC,KAAK,CAAC,EAAE,CAAA,aAAA,EACjB,CAAC,EAAE,WAAW,EAAE,KAAK,CAAA,SAAA,EAAY,WAAW,CAAA,CAAE,qFAKtDA,WAAK,CAAC,KAAK,CAAC,EAAE;AAGhB,MAAM,qBAAqB,GAAGD,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,4BAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,QAAA,EAClCC,WAAK,CAAC,KAAK,CAAC,EAAE,CACL,kBAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAClC,eAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,IAAI;;;;;"}
+{"version":3,"file":"EmptyBodyContent.cjs","sources":["../../../../src/components/DataTable/components/EmptyBodyContent.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nexport interface EmptyBodyContentProps {\n  columnCount: number;\n}\n\nexport const EmptyBodyContent = styled.div<EmptyBodyContentProps>`\n  padding-top: ${theme.sizes.lg};\n  padding-bottom: ${theme.sizes.lg};\n  grid-column: ${({ columnCount }) => `1 / span ${columnCount}`};\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: ${theme.sizes.md};\n`;\n\nexport const EmptyBodyGlyphWrapper = styled.div`\n  padding: ${theme.sizes.md};\n  background-color: ${theme.colors.neutral.grey.light};\n  border-radius: ${theme.radius.full};\n`;\n"],"names":["styled","theme"],"mappings":";;;;;;;;;AAOa,MAAA,gBAAgB,GAAGA,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,YAAA,EACzBC,WAAK,CAAC,KAAK,CAAC,EAAE,CACX,gBAAA,EAAAA,WAAK,CAAC,KAAK,CAAC,EAAE,CAAA,aAAA,EACjB,CAAC,EAAE,WAAW,EAAE,KAAK,CAAA,SAAA,EAAY,WAAW,CAAA,CAAE,qFAKtDA,WAAK,CAAC,KAAK,CAAC,EAAE;AAGhB,MAAM,qBAAqB,GAAGD,uBAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,4BAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,QAAA,EAClCC,WAAK,CAAC,KAAK,CAAC,EAAE,CACL,kBAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAClC,eAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,IAAI;;;;;"}

package/dist/components/DataTable/components/EmptyBodyContent.js

@@ -1,8 +1,8 @@
 import styled from 'styled-components';
 import { theme } from '../../../theme/index.js';
 
-const EmptyBodyContent = styled.div.withConfig({ displayName: "vui--EmptyBodyContent", componentId: "vui--80fqan" }) `padding-top:${theme.sizes.lg};padding-bottom:${theme.sizes.lg};grid-column:${({ columnCount }) => `1 / span ${columnCount}`};display:flex;flex-direction:column;align-items:center;justify-content:center;gap:${theme.sizes.md};`;
-const EmptyBodyGlyphWrapper = styled.div.withConfig({ displayName: "vui--EmptyBodyGlyphWrapper", componentId: "vui--gozoo2" }) `padding:${theme.sizes.md};background-color:${theme.colors.neutral.grey.light};border-radius:${theme.radius.full};`;
+const EmptyBodyContent = styled.div.withConfig({ displayName: "vui--EmptyBodyContent", componentId: "vui--grzgy2" }) `padding-top:${theme.sizes.lg};padding-bottom:${theme.sizes.lg};grid-column:${({ columnCount }) => `1 / span ${columnCount}`};display:flex;flex-direction:column;align-items:center;justify-content:center;gap:${theme.sizes.md};`;
+const EmptyBodyGlyphWrapper = styled.div.withConfig({ displayName: "vui--EmptyBodyGlyphWrapper", componentId: "vui--1uqall4" }) `padding:${theme.sizes.md};background-color:${theme.colors.neutral.grey.light};border-radius:${theme.radius.full};`;
 
 export { EmptyBodyContent, EmptyBodyGlyphWrapper };
 //# sourceMappingURL=EmptyBodyContent.js.map

package/dist/components/DataTable/components/EmptyBodyContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyBodyContent.js","sources":["../../../../src/components/DataTable/components/EmptyBodyContent.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nexport interface EmptyBodyContentProps {\n  columnCount: number;\n}\n\nexport const EmptyBodyContent = styled.div<EmptyBodyContentProps>`\n  padding-top: ${theme.sizes.lg};\n  padding-bottom: ${theme.sizes.lg};\n  grid-column: ${({ columnCount }) => `1 / span ${columnCount}`};\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: ${theme.sizes.md};\n`;\n\nexport const EmptyBodyGlyphWrapper = styled.div`\n  padding: ${theme.sizes.md};\n  background-color: ${theme.colors.neutral.grey.light};\n  border-radius: ${theme.radius.full};\n`;\n"],"names":[],"mappings":";;;AAOa,MAAA,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,YAAA,EACzB,KAAK,CAAC,KAAK,CAAC,EAAE,CACX,gBAAA,EAAA,KAAK,CAAC,KAAK,CAAC,EAAE,CAAA,aAAA,EACjB,CAAC,EAAE,WAAW,EAAE,KAAK,CAAA,SAAA,EAAY,WAAW,CAAA,CAAE,qFAKtD,KAAK,CAAC,KAAK,CAAC,EAAE;AAGhB,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,4BAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,QAAA,EAClC,KAAK,CAAC,KAAK,CAAC,EAAE,CACL,kBAAA,EAAA,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAClC,eAAA,EAAA,KAAK,CAAC,MAAM,CAAC,IAAI;;;;"}
+{"version":3,"file":"EmptyBodyContent.js","sources":["../../../../src/components/DataTable/components/EmptyBodyContent.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nexport interface EmptyBodyContentProps {\n  columnCount: number;\n}\n\nexport const EmptyBodyContent = styled.div<EmptyBodyContentProps>`\n  padding-top: ${theme.sizes.lg};\n  padding-bottom: ${theme.sizes.lg};\n  grid-column: ${({ columnCount }) => `1 / span ${columnCount}`};\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: ${theme.sizes.md};\n`;\n\nexport const EmptyBodyGlyphWrapper = styled.div`\n  padding: ${theme.sizes.md};\n  background-color: ${theme.colors.neutral.grey.light};\n  border-radius: ${theme.radius.full};\n`;\n"],"names":[],"mappings":";;;AAOa,MAAA,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,uBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,YAAA,EACzB,KAAK,CAAC,KAAK,CAAC,EAAE,CACX,gBAAA,EAAA,KAAK,CAAC,KAAK,CAAC,EAAE,CAAA,aAAA,EACjB,CAAC,EAAE,WAAW,EAAE,KAAK,CAAA,SAAA,EAAY,WAAW,CAAA,CAAE,qFAKtD,KAAK,CAAC,KAAK,CAAC,EAAE;AAGhB,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,4BAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,QAAA,EAClC,KAAK,CAAC,KAAK,CAAC,EAAE,CACL,kBAAA,EAAA,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAClC,eAAA,EAAA,KAAK,CAAC,MAAM,CAAC,IAAI;;;;"}

package/dist/components/DataTable/components/Header.cjs

@@ -11,7 +11,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const Header = styled__default.default.th.withConfig({ displayName: "vui--Header", componentId: "vui--1cog66w" }) `height:${constants.headerCellHeight};position:relative;display:flex;align-items:center;justify-content:${({ align = 'left' }) => alignmentToFlex.alignmentToFlex(align)};z-index:${({ zIndex = 0 }) => zIndex};background-color:white;padding-left:${({ spacing = constants.defaultCellSpacing }) => index.theme.sizes[spacing]};padding-right:${({ spacing = constants.defaultCellSpacing }) => index.theme.sizes[spacing]};border-bottom:1px solid ${index.theme.colors.neutral.grey.base};grid-column-end:${({ span = 1 }) => `span ${span}`};`;
+const Header = styled__default.default.th.withConfig({ displayName: "vui--Header", componentId: "vui--12e6ib8" }) `height:${constants.headerCellHeight};position:relative;display:flex;align-items:center;justify-content:${({ align = 'left' }) => alignmentToFlex.alignmentToFlex(align)};z-index:${({ zIndex = 0 }) => zIndex};background-color:white;padding-left:${({ spacing = constants.defaultCellSpacing }) => index.theme.sizes[spacing]};padding-right:${({ spacing = constants.defaultCellSpacing }) => index.theme.sizes[spacing]};border-bottom:1px solid ${index.theme.colors.neutral.grey.base};grid-column-end:${({ span = 1 }) => `span ${span}`};`;
 
 exports.Header = Header;
 //# sourceMappingURL=Header.cjs.map

package/dist/components/DataTable/components/Header.js

@@ -5,7 +5,7 @@ import '../types.js';
 import 'react';
 import { headerCellHeight, defaultCellSpacing } from '../constants.js';
 
-const Header = styled.th.withConfig({ displayName: "vui--Header", componentId: "vui--1cog66w" }) `height:${headerCellHeight};position:relative;display:flex;align-items:center;justify-content:${({ align = 'left' }) => alignmentToFlex(align)};z-index:${({ zIndex = 0 }) => zIndex};background-color:white;padding-left:${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};padding-right:${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};border-bottom:1px solid ${theme.colors.neutral.grey.base};grid-column-end:${({ span = 1 }) => `span ${span}`};`;
+const Header = styled.th.withConfig({ displayName: "vui--Header", componentId: "vui--12e6ib8" }) `height:${headerCellHeight};position:relative;display:flex;align-items:center;justify-content:${({ align = 'left' }) => alignmentToFlex(align)};z-index:${({ zIndex = 0 }) => zIndex};background-color:white;padding-left:${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};padding-right:${({ spacing = defaultCellSpacing }) => theme.sizes[spacing]};border-bottom:1px solid ${theme.colors.neutral.grey.base};grid-column-end:${({ span = 1 }) => `span ${span}`};`;
 
 export { Header };
 //# sourceMappingURL=Header.js.map

package/dist/components/DataTable/components/LoadingCellContent.cjs

@@ -10,7 +10,7 @@ var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 /* Loading content shimmer animation */
 const shimmerLight = index.theme.colors.neutral.grey.base;
 const shimmerDark = index.theme.colors.neutral.grey.dark;
-const LoadingCellContent = styled__default.default.div.withConfig({ displayName: "vui--LoadingCellContent", componentId: "vui--1ve27x7" }) `height:20px;width:75%;border-radius:${index.theme.radius.base};background:${shimmerLight};background-image:linear-gradient(\n    to right,\n    ${shimmerLight} 0%,\n    ${shimmerDark} 20%,\n    ${shimmerLight} 40%,\n    ${shimmerLight} 100%\n  );background-repeat:no-repeat;background-size:800px 104px;animation-duration:1s;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:placeholderShimmer;animation-timing-function:linear;@keyframes placeholderShimmer{0%{background-position:-468px 0;}100%{background-position:468px 0;}}`;
+const LoadingCellContent = styled__default.default.div.withConfig({ displayName: "vui--LoadingCellContent", componentId: "vui--1mf4ayh" }) `height:20px;width:75%;border-radius:${index.theme.radius.base};background:${shimmerLight};background-image:linear-gradient(\n    to right,\n    ${shimmerLight} 0%,\n    ${shimmerDark} 20%,\n    ${shimmerLight} 40%,\n    ${shimmerLight} 100%\n  );background-repeat:no-repeat;background-size:800px 104px;animation-duration:1s;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:placeholderShimmer;animation-timing-function:linear;@keyframes placeholderShimmer{0%{background-position:-468px 0;}100%{background-position:468px 0;}}`;
 
 exports.LoadingCellContent = LoadingCellContent;
 //# sourceMappingURL=LoadingCellContent.cjs.map

package/dist/components/DataTable/components/LoadingCellContent.js

@@ -4,7 +4,7 @@ import { theme } from '../../../theme/index.js';
 /* Loading content shimmer animation */
 const shimmerLight = theme.colors.neutral.grey.base;
 const shimmerDark = theme.colors.neutral.grey.dark;
-const LoadingCellContent = styled.div.withConfig({ displayName: "vui--LoadingCellContent", componentId: "vui--1ve27x7" }) `height:20px;width:75%;border-radius:${theme.radius.base};background:${shimmerLight};background-image:linear-gradient(\n    to right,\n    ${shimmerLight} 0%,\n    ${shimmerDark} 20%,\n    ${shimmerLight} 40%,\n    ${shimmerLight} 100%\n  );background-repeat:no-repeat;background-size:800px 104px;animation-duration:1s;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:placeholderShimmer;animation-timing-function:linear;@keyframes placeholderShimmer{0%{background-position:-468px 0;}100%{background-position:468px 0;}}`;
+const LoadingCellContent = styled.div.withConfig({ displayName: "vui--LoadingCellContent", componentId: "vui--1mf4ayh" }) `height:20px;width:75%;border-radius:${theme.radius.base};background:${shimmerLight};background-image:linear-gradient(\n    to right,\n    ${shimmerLight} 0%,\n    ${shimmerDark} 20%,\n    ${shimmerLight} 40%,\n    ${shimmerLight} 100%\n  );background-repeat:no-repeat;background-size:800px 104px;animation-duration:1s;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:placeholderShimmer;animation-timing-function:linear;@keyframes placeholderShimmer{0%{background-position:-468px 0;}100%{background-position:468px 0;}}`;
 
 export { LoadingCellContent };
 //# sourceMappingURL=LoadingCellContent.js.map

package/dist/components/DataTable/components/NoWrap.cjs

@@ -6,7 +6,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const NoWrap = styled__default.default.div.withConfig({ displayName: "vui--NoWrap", componentId: "vui--gp96g8" }) `white-space:nowrap;`;
+const NoWrap = styled__default.default.div.withConfig({ displayName: "vui--NoWrap", componentId: "vui--208yv4" }) `white-space:nowrap;`;
 
 exports.NoWrap = NoWrap;
 //# sourceMappingURL=NoWrap.cjs.map

package/dist/components/DataTable/components/NoWrap.js

@@ -1,6 +1,6 @@
 import styled from 'styled-components';
 
-const NoWrap = styled.div.withConfig({ displayName: "vui--NoWrap", componentId: "vui--gp96g8" }) `white-space:nowrap;`;
+const NoWrap = styled.div.withConfig({ displayName: "vui--NoWrap", componentId: "vui--208yv4" }) `white-space:nowrap;`;
 
 export { NoWrap };
 //# sourceMappingURL=NoWrap.js.map

package/dist/components/DataTable/components/Row.cjs

@@ -7,7 +7,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const Row = styled__default.default.tr.withConfig({ displayName: "vui--Row", componentId: "vui--j1gmuf" }) `display:contents;${({ selected }) => selected &&
+const Row = styled__default.default.tr.withConfig({ displayName: "vui--Row", componentId: "vui--ryxbs1" }) `display:contents;${({ selected }) => selected &&
     `
     &&&& > td {
       background-color: ${index.theme.colors.brand.blue.lightest};

package/dist/components/DataTable/components/Row.js

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 import { theme } from '../../../theme/index.js';
 
-const Row = styled.tr.withConfig({ displayName: "vui--Row", componentId: "vui--j1gmuf" }) `display:contents;${({ selected }) => selected &&
+const Row = styled.tr.withConfig({ displayName: "vui--Row", componentId: "vui--ryxbs1" }) `display:contents;${({ selected }) => selected &&
     `
     &&&& > td {
       background-color: ${theme.colors.brand.blue.lightest};

package/dist/components/DataTable/components/ScrollContainer.cjs

@@ -6,7 +6,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const ScrollContainer = styled__default.default.div.withConfig({ displayName: "vui--ScrollContainer", componentId: "vui--89sqty" }) `position:relative;width:100%;overflow-x:auto;overflow-y:hidden;`;
+const ScrollContainer = styled__default.default.div.withConfig({ displayName: "vui--ScrollContainer", componentId: "vui--1bx96p0" }) `position:relative;width:100%;overflow-x:auto;overflow-y:hidden;`;
 
 exports.ScrollContainer = ScrollContainer;
 //# sourceMappingURL=ScrollContainer.cjs.map

package/dist/components/DataTable/components/ScrollContainer.js

@@ -1,6 +1,6 @@
 import styled from 'styled-components';
 
-const ScrollContainer = styled.div.withConfig({ displayName: "vui--ScrollContainer", componentId: "vui--89sqty" }) `position:relative;width:100%;overflow-x:auto;overflow-y:hidden;`;
+const ScrollContainer = styled.div.withConfig({ displayName: "vui--ScrollContainer", componentId: "vui--1bx96p0" }) `position:relative;width:100%;overflow-x:auto;overflow-y:hidden;`;
 
 export { ScrollContainer };
 //# sourceMappingURL=ScrollContainer.js.map

package/dist/components/DataTable/components/TableGrid.cjs

@@ -8,7 +8,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
 const defaultDensity = 'base';
-const TableGrid = styled__default.default.table.withConfig({ displayName: "vui--TableGrid", componentId: "vui--uiuxyy" }) `min-width:100%;width:max-content;display:grid;& thead,& tbody,& tfoot{display:contents;}--density:${index.theme.sizes[defaultDensity]};&& tr:hover td{background-color:#f2f8fc;}${({ css }) => css}`;
+const TableGrid = styled__default.default.table.withConfig({ displayName: "vui--TableGrid", componentId: "vui--1fsix8g" }) `min-width:100%;width:max-content;display:grid;& thead,& tbody,& tfoot{display:contents;}--density:${index.theme.sizes[defaultDensity]};&& tr:hover td{background-color:#f2f8fc;}${({ css }) => css}`;
 
 exports.TableGrid = TableGrid;
 //# sourceMappingURL=TableGrid.cjs.map

package/dist/components/DataTable/components/TableGrid.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableGrid.cjs","sources":["../../../../src/components/DataTable/components/TableGrid.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nconst defaultDensity = 'base';\n\nexport interface TableGridProps {\n  css: string;\n}\n\nexport const TableGrid = styled.table<TableGridProps>`\n  min-width: 100%;\n  width: max-content; /* Fixes sticky element bug in Firefox - https://bugzilla.mozilla.org/show_bug.cgi?id=1585254#c3 */\n  display: grid;\n\n  & thead,\n  & tbody,\n  & tfoot {\n    display: contents;\n  }\n\n  --density: ${theme.sizes[defaultDensity]};\n\n  && tr:hover td {\n    background-color: #f2f8fc;\n  }\n\n  ${({ css }) => css}/* CSS styles generate by hooks */\n`;\n"],"names":["styled","theme"],"mappings":";;;;;;;;;AAGA,MAAM,cAAc,GAAG,MAAM;AAMhB,MAAA,SAAS,GAAGA,uBAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,kGAAA,EAWtBC,WAAK,CAAC,KAAK,CAAC,cAAc,CAAC,CAAA,0CAAA,EAMtC,CAAC,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;;;;"}
+{"version":3,"file":"TableGrid.cjs","sources":["../../../../src/components/DataTable/components/TableGrid.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nconst defaultDensity = 'base';\n\nexport interface TableGridProps {\n  css: string;\n}\n\nexport const TableGrid = styled.table<TableGridProps>`\n  min-width: 100%;\n  width: max-content; /* Fixes sticky element bug in Firefox - https://bugzilla.mozilla.org/show_bug.cgi?id=1585254#c3 */\n  display: grid;\n\n  & thead,\n  & tbody,\n  & tfoot {\n    display: contents;\n  }\n\n  --density: ${theme.sizes[defaultDensity]};\n\n  && tr:hover td {\n    background-color: #f2f8fc;\n  }\n\n  ${({ css }) => css}/* CSS styles generate by hooks */\n`;\n"],"names":["styled","theme"],"mappings":";;;;;;;;;AAGA,MAAM,cAAc,GAAG,MAAM;AAMhB,MAAA,SAAS,GAAGA,uBAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,kGAAA,EAWtBC,WAAK,CAAC,KAAK,CAAC,cAAc,CAAC,CAAA,0CAAA,EAMtC,CAAC,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;;;;"}

package/dist/components/DataTable/components/TableGrid.js

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 import { theme } from '../../../theme/index.js';
 
 const defaultDensity = 'base';
-const TableGrid = styled.table.withConfig({ displayName: "vui--TableGrid", componentId: "vui--uiuxyy" }) `min-width:100%;width:max-content;display:grid;& thead,& tbody,& tfoot{display:contents;}--density:${theme.sizes[defaultDensity]};&& tr:hover td{background-color:#f2f8fc;}${({ css }) => css}`;
+const TableGrid = styled.table.withConfig({ displayName: "vui--TableGrid", componentId: "vui--1fsix8g" }) `min-width:100%;width:max-content;display:grid;& thead,& tbody,& tfoot{display:contents;}--density:${theme.sizes[defaultDensity]};&& tr:hover td{background-color:#f2f8fc;}${({ css }) => css}`;
 
 export { TableGrid };
 //# sourceMappingURL=TableGrid.js.map

package/dist/components/DataTable/components/TableGrid.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableGrid.js","sources":["../../../../src/components/DataTable/components/TableGrid.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nconst defaultDensity = 'base';\n\nexport interface TableGridProps {\n  css: string;\n}\n\nexport const TableGrid = styled.table<TableGridProps>`\n  min-width: 100%;\n  width: max-content; /* Fixes sticky element bug in Firefox - https://bugzilla.mozilla.org/show_bug.cgi?id=1585254#c3 */\n  display: grid;\n\n  & thead,\n  & tbody,\n  & tfoot {\n    display: contents;\n  }\n\n  --density: ${theme.sizes[defaultDensity]};\n\n  && tr:hover td {\n    background-color: #f2f8fc;\n  }\n\n  ${({ css }) => css}/* CSS styles generate by hooks */\n`;\n"],"names":[],"mappings":";;;AAGA,MAAM,cAAc,GAAG,MAAM;AAMhB,MAAA,SAAS,GAAG,MAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,kGAAA,EAWtB,KAAK,CAAC,KAAK,CAAC,cAAc,CAAC,CAAA,0CAAA,EAMtC,CAAC,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;;;;"}
+{"version":3,"file":"TableGrid.js","sources":["../../../../src/components/DataTable/components/TableGrid.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { theme } from '../../../theme';\n\nconst defaultDensity = 'base';\n\nexport interface TableGridProps {\n  css: string;\n}\n\nexport const TableGrid = styled.table<TableGridProps>`\n  min-width: 100%;\n  width: max-content; /* Fixes sticky element bug in Firefox - https://bugzilla.mozilla.org/show_bug.cgi?id=1585254#c3 */\n  display: grid;\n\n  & thead,\n  & tbody,\n  & tfoot {\n    display: contents;\n  }\n\n  --density: ${theme.sizes[defaultDensity]};\n\n  && tr:hover td {\n    background-color: #f2f8fc;\n  }\n\n  ${({ css }) => css}/* CSS styles generate by hooks */\n`;\n"],"names":[],"mappings":";;;AAGA,MAAM,cAAc,GAAG,MAAM;AAMhB,MAAA,SAAS,GAAG,MAAM,CAAC,KAAK,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,gBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,kGAAA,EAWtB,KAAK,CAAC,KAAK,CAAC,cAAc,CAAC,CAAA,0CAAA,EAMtC,CAAC,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;;;;"}

package/dist/components/DataTable/components/Truncate.cjs

@@ -6,7 +6,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const Truncate = styled__default.default.div.withConfig({ displayName: "vui--Truncate", componentId: "vui--1kkdpgh" }) `overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`;
+const Truncate = styled__default.default.div.withConfig({ displayName: "vui--Truncate", componentId: "vui--14fzkum" }) `overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`;
 
 exports.Truncate = Truncate;
 //# sourceMappingURL=Truncate.cjs.map

package/dist/components/DataTable/components/Truncate.js

@@ -1,6 +1,6 @@
 import styled from 'styled-components';
 
-const Truncate = styled.div.withConfig({ displayName: "vui--Truncate", componentId: "vui--1kkdpgh" }) `overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`;
+const Truncate = styled.div.withConfig({ displayName: "vui--Truncate", componentId: "vui--14fzkum" }) `overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`;
 
 export { Truncate };
 //# sourceMappingURL=Truncate.js.map

package/dist/components/DataTable/components/Wrapper.cjs

@@ -12,7 +12,7 @@ const borderModeStyles = {
     vertical: 'border-width: 0; border-top-width: 1px; border-bottom-width: 1px;',
     none: 'border-width: 0;',
 };
-const Wrapper = styled__default.default.div.withConfig({ displayName: "vui--Wrapper", componentId: "vui--femv7s" }) `width:100%;position:relative;border-style:solid;border-color:${index.theme.colors.neutral.grey.dark};${({ borderMode = 'full' }) => borderModeStyles[borderMode]} &,& *{box-sizing:border-box;}.hideHeaderDetails th{> *{opacity:0.1;}.th-divider{opacity:1;}}`;
+const Wrapper = styled__default.default.div.withConfig({ displayName: "vui--Wrapper", componentId: "vui--5gfhdd" }) `width:100%;position:relative;border-style:solid;border-color:${index.theme.colors.neutral.grey.dark};${({ borderMode = 'full' }) => borderModeStyles[borderMode]} &,& *{box-sizing:border-box;}.hideHeaderDetails th{> *{opacity:0.1;}.th-divider{opacity:1;}}`;
 
 exports.Wrapper = Wrapper;
 //# sourceMappingURL=Wrapper.cjs.map

package/dist/components/DataTable/components/Wrapper.js

@@ -6,7 +6,7 @@ const borderModeStyles = {
     vertical: 'border-width: 0; border-top-width: 1px; border-bottom-width: 1px;',
     none: 'border-width: 0;',
 };
-const Wrapper = styled.div.withConfig({ displayName: "vui--Wrapper", componentId: "vui--femv7s" }) `width:100%;position:relative;border-style:solid;border-color:${theme.colors.neutral.grey.dark};${({ borderMode = 'full' }) => borderModeStyles[borderMode]} &,& *{box-sizing:border-box;}.hideHeaderDetails th{> *{opacity:0.1;}.th-divider{opacity:1;}}`;
+const Wrapper = styled.div.withConfig({ displayName: "vui--Wrapper", componentId: "vui--5gfhdd" }) `width:100%;position:relative;border-style:solid;border-color:${theme.colors.neutral.grey.dark};${({ borderMode = 'full' }) => borderModeStyles[borderMode]} &,& *{box-sizing:border-box;}.hideHeaderDetails th{> *{opacity:0.1;}.th-divider{opacity:1;}}`;
 
 export { Wrapper };
 //# sourceMappingURL=Wrapper.js.map

package/dist/components/DateInputField/styled.cjs

@@ -9,7 +9,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const DateRangeGroup = styled__default.default(reactAriaComponents.Group).withConfig({ displayName: "vui--DateRangeGroup", componentId: "vui--1lv2dzh" }) `${inputStyles.inputBaseStyles} ${inputStyles.inputDisabledStyles} gap:${index.theme.sizes.sm};justify-content:space-between;z-index:1;&[data-focus-within]{box-shadow:0 0 0 4px ${index.theme.colors.secondary.blue.light};border-color:${index.theme.colors.secondary.blue.base};}&:has(*[data-invalid]){box-shadow:0 0 0 4px ${index.theme.colors.secondary.red.light};border:1px solid ${index.theme.colors.secondary.red.base};}*[data-placeholder],*[data-placeholder] + div,*:has(*[data-placeholder])~ .date-range-input-splitter{color:${index.theme.colors.neutral.ink.light};}.react-aria-DateInput{display:flex;align-items:center;cursor:text;caret-color:transparent;.react-aria-DateSegment{padding:0 1px;border-radius:${index.theme.radius.base};&[data-focused]{color:white;background-color:${index.theme.colors.secondary.blue.dark};&[data-invalid]{background-color:${index.theme.colors.secondary.red.lightest};}}&[data-invalid]{font-weight:bold;color:${index.theme.colors.secondary.red.dark};}&:focus-visible{outline:none;}}}`;
+const DateRangeGroup = styled__default.default(reactAriaComponents.Group).withConfig({ displayName: "vui--DateRangeGroup", componentId: "vui--cprola" }) `${inputStyles.inputBaseStyles} ${inputStyles.inputDisabledStyles} gap:${index.theme.sizes.sm};justify-content:space-between;z-index:1;&[data-focus-within]{box-shadow:0 0 0 4px ${index.theme.colors.secondary.blue.light};border-color:${index.theme.colors.secondary.blue.base};}&:has(*[data-invalid]){box-shadow:0 0 0 4px ${index.theme.colors.secondary.red.light};border:1px solid ${index.theme.colors.secondary.red.base};}*[data-placeholder],*[data-placeholder] + div,*:has(*[data-placeholder])~ .date-range-input-splitter{color:${index.theme.colors.neutral.ink.light};}.react-aria-DateInput{display:flex;align-items:center;cursor:text;caret-color:transparent;.react-aria-DateSegment{padding:0 1px;border-radius:${index.theme.radius.base};&[data-focused]{color:white;background-color:${index.theme.colors.secondary.blue.dark};&[data-invalid]{background-color:${index.theme.colors.secondary.red.lightest};}}&[data-invalid]{font-weight:bold;color:${index.theme.colors.secondary.red.dark};}&:focus-visible{outline:none;}}}`;
 
 exports.DateRangeGroup = DateRangeGroup;
 //# sourceMappingURL=styled.cjs.map

package/dist/components/DateInputField/styled.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"styled.cjs","sources":["../../../src/components/DateInputField/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Group } from 'react-aria-components';\nimport { theme } from '../../theme';\nimport { inputBaseStyles, inputDisabledStyles } from '../../utils/forms/inputStyles';\nimport { FormComponentProps } from '../types';\n\nexport const DateRangeGroup = styled(Group)<FormComponentProps>`\n  ${inputBaseStyles}\n  ${inputDisabledStyles}\n\n  gap: ${theme.sizes.sm};\n  justify-content: space-between;\n  z-index: 1;\n\n  &[data-focus-within] {\n    box-shadow: 0 0 0 4px ${theme.colors.secondary.blue.light};\n    border-color: ${theme.colors.secondary.blue.base};\n  }\n\n  &:has(*[data-invalid]) {\n    box-shadow: 0 0 0 4px ${theme.colors.secondary.red.light};\n    border: 1px solid ${theme.colors.secondary.red.base};\n  }\n\n  *[data-placeholder],\n  *[data-placeholder] + div,\n  *:has(*[data-placeholder]) ~ .date-range-input-splitter {\n    color: ${theme.colors.neutral.ink.light};\n  }\n\n  .react-aria-DateInput {\n    display: flex;\n    align-items: center;\n\n    cursor: text;\n    caret-color: transparent;\n\n    .react-aria-DateSegment {\n      padding: 0 1px;\n      border-radius: ${theme.radius.base};\n\n      &[data-focused] {\n        color: white;\n        background-color: ${theme.colors.secondary.blue.dark};\n\n        &[data-invalid] {\n          background-color: ${theme.colors.secondary.red.lightest};\n        }\n      }\n\n      &[data-invalid] {\n        font-weight: bold;\n        color: ${theme.colors.secondary.red.dark};\n      }\n\n      &:focus-visible {\n        outline: none;\n      }\n    }\n  }\n`;\n"],"names":["styled","Group","inputBaseStyles","inputDisabledStyles","theme"],"mappings":";;;;;;;;;;;MAMa,cAAc,GAAGA,uBAAM,CAACC,yBAAK,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,EACvCC,2BAAe,CAAA,CAAA,EACfC,+BAAmB,CAEd,KAAA,EAAAC,WAAK,CAAC,KAAK,CAAC,EAAE,sFAKKA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,iBACzCA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,iDAIxBA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CACpC,kBAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,gHAM1CA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAYpB,gJAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,IAAI,CAAA,8CAAA,EAIZA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAG9B,kCAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAMhD,0CAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA,kCAAA;;;;"}
+{"version":3,"file":"styled.cjs","sources":["../../../src/components/DateInputField/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Group } from 'react-aria-components';\nimport { theme } from '../../theme';\nimport { inputBaseStyles, inputDisabledStyles } from '../../utils/forms/inputStyles';\nimport { FormComponentProps } from '../types';\n\nexport const DateRangeGroup = styled(Group)<FormComponentProps>`\n  ${inputBaseStyles}\n  ${inputDisabledStyles}\n\n  gap: ${theme.sizes.sm};\n  justify-content: space-between;\n  z-index: 1;\n\n  &[data-focus-within] {\n    box-shadow: 0 0 0 4px ${theme.colors.secondary.blue.light};\n    border-color: ${theme.colors.secondary.blue.base};\n  }\n\n  &:has(*[data-invalid]) {\n    box-shadow: 0 0 0 4px ${theme.colors.secondary.red.light};\n    border: 1px solid ${theme.colors.secondary.red.base};\n  }\n\n  *[data-placeholder],\n  *[data-placeholder] + div,\n  *:has(*[data-placeholder]) ~ .date-range-input-splitter {\n    color: ${theme.colors.neutral.ink.light};\n  }\n\n  .react-aria-DateInput {\n    display: flex;\n    align-items: center;\n\n    cursor: text;\n    caret-color: transparent;\n\n    .react-aria-DateSegment {\n      padding: 0 1px;\n      border-radius: ${theme.radius.base};\n\n      &[data-focused] {\n        color: white;\n        background-color: ${theme.colors.secondary.blue.dark};\n\n        &[data-invalid] {\n          background-color: ${theme.colors.secondary.red.lightest};\n        }\n      }\n\n      &[data-invalid] {\n        font-weight: bold;\n        color: ${theme.colors.secondary.red.dark};\n      }\n\n      &:focus-visible {\n        outline: none;\n      }\n    }\n  }\n`;\n"],"names":["styled","Group","inputBaseStyles","inputDisabledStyles","theme"],"mappings":";;;;;;;;;;;MAMa,cAAc,GAAGA,uBAAM,CAACC,yBAAK,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,EACvCC,2BAAe,CAAA,CAAA,EACfC,+BAAmB,CAEd,KAAA,EAAAC,WAAK,CAAC,KAAK,CAAC,EAAE,sFAKKA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,iBACzCA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,iDAIxBA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CACpC,kBAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,gHAM1CA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAYpB,gJAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,IAAI,CAAA,8CAAA,EAIZA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAG9B,kCAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAMhD,0CAAA,EAAAA,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA,kCAAA;;;;"}

package/dist/components/DateInputField/styled.js

@@ -3,7 +3,7 @@ import { Group } from 'react-aria-components';
 import { theme } from '../../theme/index.js';
 import { inputBaseStyles, inputDisabledStyles } from '../../utils/forms/inputStyles.js';
 
-const DateRangeGroup = styled(Group).withConfig({ displayName: "vui--DateRangeGroup", componentId: "vui--1lv2dzh" }) `${inputBaseStyles} ${inputDisabledStyles} gap:${theme.sizes.sm};justify-content:space-between;z-index:1;&[data-focus-within]{box-shadow:0 0 0 4px ${theme.colors.secondary.blue.light};border-color:${theme.colors.secondary.blue.base};}&:has(*[data-invalid]){box-shadow:0 0 0 4px ${theme.colors.secondary.red.light};border:1px solid ${theme.colors.secondary.red.base};}*[data-placeholder],*[data-placeholder] + div,*:has(*[data-placeholder])~ .date-range-input-splitter{color:${theme.colors.neutral.ink.light};}.react-aria-DateInput{display:flex;align-items:center;cursor:text;caret-color:transparent;.react-aria-DateSegment{padding:0 1px;border-radius:${theme.radius.base};&[data-focused]{color:white;background-color:${theme.colors.secondary.blue.dark};&[data-invalid]{background-color:${theme.colors.secondary.red.lightest};}}&[data-invalid]{font-weight:bold;color:${theme.colors.secondary.red.dark};}&:focus-visible{outline:none;}}}`;
+const DateRangeGroup = styled(Group).withConfig({ displayName: "vui--DateRangeGroup", componentId: "vui--cprola" }) `${inputBaseStyles} ${inputDisabledStyles} gap:${theme.sizes.sm};justify-content:space-between;z-index:1;&[data-focus-within]{box-shadow:0 0 0 4px ${theme.colors.secondary.blue.light};border-color:${theme.colors.secondary.blue.base};}&:has(*[data-invalid]){box-shadow:0 0 0 4px ${theme.colors.secondary.red.light};border:1px solid ${theme.colors.secondary.red.base};}*[data-placeholder],*[data-placeholder] + div,*:has(*[data-placeholder])~ .date-range-input-splitter{color:${theme.colors.neutral.ink.light};}.react-aria-DateInput{display:flex;align-items:center;cursor:text;caret-color:transparent;.react-aria-DateSegment{padding:0 1px;border-radius:${theme.radius.base};&[data-focused]{color:white;background-color:${theme.colors.secondary.blue.dark};&[data-invalid]{background-color:${theme.colors.secondary.red.lightest};}}&[data-invalid]{font-weight:bold;color:${theme.colors.secondary.red.dark};}&:focus-visible{outline:none;}}}`;
 
 export { DateRangeGroup };
 //# sourceMappingURL=styled.js.map

package/dist/components/DateInputField/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../src/components/DateInputField/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Group } from 'react-aria-components';\nimport { theme } from '../../theme';\nimport { inputBaseStyles, inputDisabledStyles } from '../../utils/forms/inputStyles';\nimport { FormComponentProps } from '../types';\n\nexport const DateRangeGroup = styled(Group)<FormComponentProps>`\n  ${inputBaseStyles}\n  ${inputDisabledStyles}\n\n  gap: ${theme.sizes.sm};\n  justify-content: space-between;\n  z-index: 1;\n\n  &[data-focus-within] {\n    box-shadow: 0 0 0 4px ${theme.colors.secondary.blue.light};\n    border-color: ${theme.colors.secondary.blue.base};\n  }\n\n  &:has(*[data-invalid]) {\n    box-shadow: 0 0 0 4px ${theme.colors.secondary.red.light};\n    border: 1px solid ${theme.colors.secondary.red.base};\n  }\n\n  *[data-placeholder],\n  *[data-placeholder] + div,\n  *:has(*[data-placeholder]) ~ .date-range-input-splitter {\n    color: ${theme.colors.neutral.ink.light};\n  }\n\n  .react-aria-DateInput {\n    display: flex;\n    align-items: center;\n\n    cursor: text;\n    caret-color: transparent;\n\n    .react-aria-DateSegment {\n      padding: 0 1px;\n      border-radius: ${theme.radius.base};\n\n      &[data-focused] {\n        color: white;\n        background-color: ${theme.colors.secondary.blue.dark};\n\n        &[data-invalid] {\n          background-color: ${theme.colors.secondary.red.lightest};\n        }\n      }\n\n      &[data-invalid] {\n        font-weight: bold;\n        color: ${theme.colors.secondary.red.dark};\n      }\n\n      &:focus-visible {\n        outline: none;\n      }\n    }\n  }\n`;\n"],"names":[],"mappings":";;;;;MAMa,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,cAAA,EAAA,CAAA,CAAA,CAAA,EACvC,eAAe,CAAA,CAAA,EACf,mBAAmB,CAEd,KAAA,EAAA,KAAK,CAAC,KAAK,CAAC,EAAE,sFAKK,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,iBACzC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,iDAIxB,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CACpC,kBAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,gHAM1C,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAYpB,gJAAA,EAAA,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA,8CAAA,EAIZ,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAG9B,kCAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAMhD,0CAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA,kCAAA;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../src/components/DateInputField/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Group } from 'react-aria-components';\nimport { theme } from '../../theme';\nimport { inputBaseStyles, inputDisabledStyles } from '../../utils/forms/inputStyles';\nimport { FormComponentProps } from '../types';\n\nexport const DateRangeGroup = styled(Group)<FormComponentProps>`\n  ${inputBaseStyles}\n  ${inputDisabledStyles}\n\n  gap: ${theme.sizes.sm};\n  justify-content: space-between;\n  z-index: 1;\n\n  &[data-focus-within] {\n    box-shadow: 0 0 0 4px ${theme.colors.secondary.blue.light};\n    border-color: ${theme.colors.secondary.blue.base};\n  }\n\n  &:has(*[data-invalid]) {\n    box-shadow: 0 0 0 4px ${theme.colors.secondary.red.light};\n    border: 1px solid ${theme.colors.secondary.red.base};\n  }\n\n  *[data-placeholder],\n  *[data-placeholder] + div,\n  *:has(*[data-placeholder]) ~ .date-range-input-splitter {\n    color: ${theme.colors.neutral.ink.light};\n  }\n\n  .react-aria-DateInput {\n    display: flex;\n    align-items: center;\n\n    cursor: text;\n    caret-color: transparent;\n\n    .react-aria-DateSegment {\n      padding: 0 1px;\n      border-radius: ${theme.radius.base};\n\n      &[data-focused] {\n        color: white;\n        background-color: ${theme.colors.secondary.blue.dark};\n\n        &[data-invalid] {\n          background-color: ${theme.colors.secondary.red.lightest};\n        }\n      }\n\n      &[data-invalid] {\n        font-weight: bold;\n        color: ${theme.colors.secondary.red.dark};\n      }\n\n      &:focus-visible {\n        outline: none;\n      }\n    }\n  }\n`;\n"],"names":[],"mappings":";;;;;MAMa,cAAc,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA,UAAA,CAAA,EAAA,WAAA,EAAA,qBAAA,EAAA,WAAA,EAAA,aAAA,EAAA,CAAA,CAAA,CAAA,EACvC,eAAe,CAAA,CAAA,EACf,mBAAmB,CAEd,KAAA,EAAA,KAAK,CAAC,KAAK,CAAC,EAAE,sFAKK,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,iBACzC,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,iDAIxB,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,CACpC,kBAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,gHAM1C,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAYpB,gJAAA,EAAA,KAAK,CAAC,MAAM,CAAC,IAAI,CAAA,8CAAA,EAIZ,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAG9B,kCAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAMhD,0CAAA,EAAA,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAA,kCAAA;;;;"}

package/dist/components/DatePicker/styled.cjs

@@ -8,7 +8,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const DatePickerFooter = styled__default.default.footer.withConfig({ displayName: "vui--DatePickerFooter", componentId: "vui--1bh2rdw" }) `display:flex;justify-content:end;margin-top:${sizes.sizes.base};margin-left:-${sizes.sizes.base};margin-right:-${sizes.sizes.base};padding:${sizes.sizes.base};padding-bottom:0;border-top:${sizes.sizes.line} solid ${colors.colors.neutral.grey.base};`;
+const DatePickerFooter = styled__default.default.footer.withConfig({ displayName: "vui--DatePickerFooter", componentId: "vui--17flrd9" }) `display:flex;justify-content:end;margin-top:${sizes.sizes.base};margin-left:-${sizes.sizes.base};margin-right:-${sizes.sizes.base};padding:${sizes.sizes.base};padding-bottom:0;border-top:${sizes.sizes.line} solid ${colors.colors.neutral.grey.base};`;
 
 exports.DatePickerFooter = DatePickerFooter;
 //# sourceMappingURL=styled.cjs.map

package/dist/components/DatePicker/styled.js

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 import { colors } from '../../theme/modules/colors.js';
 import { sizes } from '../../theme/modules/sizes.js';
 
-const DatePickerFooter = styled.footer.withConfig({ displayName: "vui--DatePickerFooter", componentId: "vui--1bh2rdw" }) `display:flex;justify-content:end;margin-top:${sizes.base};margin-left:-${sizes.base};margin-right:-${sizes.base};padding:${sizes.base};padding-bottom:0;border-top:${sizes.line} solid ${colors.neutral.grey.base};`;
+const DatePickerFooter = styled.footer.withConfig({ displayName: "vui--DatePickerFooter", componentId: "vui--17flrd9" }) `display:flex;justify-content:end;margin-top:${sizes.base};margin-left:-${sizes.base};margin-right:-${sizes.base};padding:${sizes.base};padding-bottom:0;border-top:${sizes.line} solid ${colors.neutral.grey.base};`;
 
 export { DatePickerFooter };
 //# sourceMappingURL=styled.js.map

package/dist/components/DateRangePicker/components/Divider.cjs

@@ -7,7 +7,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-const Divider = styled__default.default.div.withConfig({ displayName: "vui--Divider", componentId: "vui--v6fsx5" }) `margin:0 -${index.theme.sizes.base};border-top:1px solid ${index.theme.colors.neutral.grey.base};`;
+const Divider = styled__default.default.div.withConfig({ displayName: "vui--Divider", componentId: "vui--ssvmxc" }) `margin:0 -${index.theme.sizes.base};border-top:1px solid ${index.theme.colors.neutral.grey.base};`;
 
 exports.Divider = Divider;
 //# sourceMappingURL=Divider.cjs.map

package/dist/components/DateRangePicker/components/Divider.js

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 import { theme } from '../../../theme/index.js';
 
-const Divider = styled.div.withConfig({ displayName: "vui--Divider", componentId: "vui--v6fsx5" }) `margin:0 -${theme.sizes.base};border-top:1px solid ${theme.colors.neutral.grey.base};`;
+const Divider = styled.div.withConfig({ displayName: "vui--Divider", componentId: "vui--ssvmxc" }) `margin:0 -${theme.sizes.base};border-top:1px solid ${theme.colors.neutral.grey.base};`;
 
 export { Divider };
 //# sourceMappingURL=Divider.js.map