@veeqo/ui 14.9.0 → 14.10.0-beta-1

package/dist/components/AnimatedDropdown/AnimatedDropdown.cjs

@@ -2,8 +2,11 @@
 
 var React = require('react');
 var reactTransitionGroup = require('react-transition-group');
-var styled = require('./styled.cjs');
+var buildClassnames = require('../../utils/buildClassnames.cjs');
+require('uid/secure');
+var BasicDropdown = require('./components/BasicDropdown.cjs');
 var useClickAway = require('./hooks/useClickAway.cjs');
+var AnimatedDropdown_module = require('./AnimatedDropdown.module.scss.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -15,16 +18,30 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
  */
 const AnimatedDropdown = ({ cta, shouldShowDropdown, children, className = 'animated-dropdown', reversed = false, onClickAway = () => { }, timeout = 350, transitionClassnames = 'dropdown', onClick, onMouseEnter, onMouseLeave, }) => {
     const dropdownRef = React.useRef(null);
+    const dropdownContentRef = React.useRef(null);
     useClickAway.useClickAway(dropdownRef, (event) => {
         if (shouldShowDropdown) {
             onClickAway(event);
         }
     });
-    return (React__default.default.createElement(styled.Container, { className: `${className}-container ${className}`, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, ref: dropdownRef },
+    return (React__default.default.createElement("div", { className: buildClassnames.buildClassnames([
+            AnimatedDropdown_module.container,
+            `${className}-container`,
+            className,
+        ]), onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, ref: dropdownRef },
         !reversed && cta,
-        React__default.default.createElement(styled.Wrap, { className: `${className}-wrap ${className}` },
-            React__default.default.createElement(reactTransitionGroup.CSSTransition, { in: shouldShowDropdown, timeout: timeout, classNames: transitionClassnames, unmountOnExit: true },
-                React__default.default.createElement(styled.Dropdown, { role: "dialog", reversed: reversed, className: `${className}-basic-dropdown ${className}` }, children))),
+        React__default.default.createElement("div", { className: buildClassnames.buildClassnames([
+                AnimatedDropdown_module.wrap,
+                `${className}-wrap`,
+                className,
+            ]) },
+            React__default.default.createElement(reactTransitionGroup.CSSTransition, { in: shouldShowDropdown, timeout: timeout, classNames: transitionClassnames, unmountOnExit: true, nodeRef: dropdownContentRef },
+                React__default.default.createElement(BasicDropdown.BasicDropdown, { role: "dialog", ref: dropdownContentRef, className: buildClassnames.buildClassnames([
+                        AnimatedDropdown_module.dropdown,
+                        reversed && AnimatedDropdown_module.reversed,
+                        `${className}-basic-dropdown`,
+                        className,
+                    ]) }, children))),
         reversed && cta));
 };
 

package/dist/components/AnimatedDropdown/AnimatedDropdown.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AnimatedDropdown.cjs","sources":["../../../src/components/AnimatedDropdown/AnimatedDropdown.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport { Wrap, Dropdown, Container } from './styled';\n\nimport { AnimatedDropdownProps } from './types';\nimport { useClickAway } from './hooks/useClickAway';\n\n/**\n * @deprecated - Use `Dropdown` component instead.\n * This component is deprecated and will be removed in future versions.\n */\nexport const AnimatedDropdown = ({\n  cta,\n  shouldShowDropdown,\n  children,\n  className = 'animated-dropdown',\n  reversed = false,\n  onClickAway = () => {},\n  timeout = 350,\n  transitionClassnames = 'dropdown',\n  onClick,\n  onMouseEnter,\n  onMouseLeave,\n}: AnimatedDropdownProps) => {\n  const dropdownRef = useRef<HTMLDivElement>(null);\n\n  useClickAway(dropdownRef, (event: Event) => {\n    if (shouldShowDropdown) {\n      onClickAway(event);\n    }\n  });\n\n  return (\n    <Container\n      className={`${className}-container ${className}`}\n      onClick={onClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      ref={dropdownRef}\n    >\n      {!reversed && cta}\n      <Wrap className={`${className}-wrap ${className}`}>\n        <CSSTransition\n          in={shouldShowDropdown}\n          timeout={timeout}\n          classNames={transitionClassnames}\n          unmountOnExit\n        >\n          <Dropdown\n            role=\"dialog\"\n            reversed={reversed}\n            className={`${className}-basic-dropdown ${className}`}\n          >\n            {children}\n          </Dropdown>\n        </CSSTransition>\n      </Wrap>\n      {reversed && cta}\n    </Container>\n  );\n};\n"],"names":["useRef","useClickAway","React","Container","Wrap","CSSTransition","Dropdown"],"mappings":";;;;;;;;;;;AAQA;;;AAGG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAC/B,GAAG,EACH,kBAAkB,EAClB,QAAQ,EACR,SAAS,GAAG,mBAAmB,EAC/B,QAAQ,GAAG,KAAK,EAChB,WAAW,GAAG,MAAK,EAAE,CAAC,EACtB,OAAO,GAAG,GAAG,EACb,oBAAoB,GAAG,UAAU,EACjC,OAAO,EACP,YAAY,EACZ,YAAY,GACU,KAAI;AAC1B,IAAA,MAAM,WAAW,GAAGA,YAAM,CAAiB,IAAI,CAAC;AAEhD,IAAAC,yBAAY,CAAC,WAAW,EAAE,CAAC,KAAY,KAAI;AACzC,QAAA,IAAI,kBAAkB,EAAE;YACtB,WAAW,CAAC,KAAK,CAAC;AACnB,QAAA;AACH,IAAA,CAAC,CAAC;IAEF,QACEC,sBAAA,CAAA,aAAA,CAACC,gBAAS,EAAA,EACR,SAAS,EAAE,CAAA,EAAG,SAAS,CAAA,WAAA,EAAc,SAAS,CAAA,CAAE,EAChD,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,GAAG,EAAE,WAAW,EAAA;QAEf,CAAC,QAAQ,IAAI,GAAG;QACjBD,sBAAA,CAAA,aAAA,CAACE,WAAI,IAAC,SAAS,EAAE,GAAG,SAAS,CAAA,MAAA,EAAS,SAAS,CAAA,CAAE,EAAA;AAC/C,YAAAF,sBAAA,CAAA,aAAA,CAACG,kCAAa,EAAA,EACZ,EAAE,EAAE,kBAAkB,EACtB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,oBAAoB,EAChC,aAAa,EAAA,IAAA,EAAA;gBAEbH,sBAAA,CAAA,aAAA,CAACI,eAAQ,IACP,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,CAAA,EAAG,SAAS,CAAA,gBAAA,EAAmB,SAAS,EAAE,EAAA,EAEpD,QAAQ,CACA,CACG,CACX;AACN,QAAA,QAAQ,IAAI,GAAG,CACN;AAEhB;;;;"}
+{"version":3,"file":"AnimatedDropdown.cjs","sources":["../../../src/components/AnimatedDropdown/AnimatedDropdown.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport { buildClassnames } from '../../utils';\nimport { BasicDropdown } from './components/BasicDropdown';\nimport { AnimatedDropdownProps } from './types';\nimport { useClickAway } from './hooks/useClickAway';\nimport animatedDropdownStyles from './AnimatedDropdown.module.scss';\n\n/**\n * @deprecated - Use `Dropdown` component instead.\n * This component is deprecated and will be removed in future versions.\n */\nexport const AnimatedDropdown = ({\n  cta,\n  shouldShowDropdown,\n  children,\n  className = 'animated-dropdown',\n  reversed = false,\n  onClickAway = () => {},\n  timeout = 350,\n  transitionClassnames = 'dropdown',\n  onClick,\n  onMouseEnter,\n  onMouseLeave,\n}: AnimatedDropdownProps) => {\n  const dropdownRef = useRef<HTMLDivElement>(null);\n  const dropdownContentRef = useRef<HTMLDivElement>(null);\n\n  useClickAway(dropdownRef, (event: Event) => {\n    if (shouldShowDropdown) {\n      onClickAway(event);\n    }\n  });\n\n  return (\n    <div\n      className={buildClassnames([\n        animatedDropdownStyles.container,\n        `${className}-container`,\n        className,\n      ])}\n      onClick={onClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      ref={dropdownRef}\n    >\n      {!reversed && cta}\n      <div\n        className={buildClassnames([\n          animatedDropdownStyles.wrap,\n          `${className}-wrap`,\n          className,\n        ])}\n      >\n        <CSSTransition\n          in={shouldShowDropdown}\n          timeout={timeout}\n          classNames={transitionClassnames}\n          unmountOnExit\n          nodeRef={dropdownContentRef}\n        >\n          <BasicDropdown\n            role=\"dialog\"\n            ref={dropdownContentRef}\n            className={buildClassnames([\n              animatedDropdownStyles.dropdown,\n              reversed && animatedDropdownStyles.reversed,\n              `${className}-basic-dropdown`,\n              className,\n            ])}\n          >\n            {children}\n          </BasicDropdown>\n        </CSSTransition>\n      </div>\n      {reversed && cta}\n    </div>\n  );\n};\n"],"names":["useRef","useClickAway","React","buildClassnames","animatedDropdownStyles","CSSTransition","BasicDropdown"],"mappings":";;;;;;;;;;;;;;AASA;;;AAGG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAC/B,GAAG,EACH,kBAAkB,EAClB,QAAQ,EACR,SAAS,GAAG,mBAAmB,EAC/B,QAAQ,GAAG,KAAK,EAChB,WAAW,GAAG,MAAK,EAAE,CAAC,EACtB,OAAO,GAAG,GAAG,EACb,oBAAoB,GAAG,UAAU,EACjC,OAAO,EACP,YAAY,EACZ,YAAY,GACU,KAAI;AAC1B,IAAA,MAAM,WAAW,GAAGA,YAAM,CAAiB,IAAI,CAAC;AAChD,IAAA,MAAM,kBAAkB,GAAGA,YAAM,CAAiB,IAAI,CAAC;AAEvD,IAAAC,yBAAY,CAAC,WAAW,EAAE,CAAC,KAAY,KAAI;AACzC,QAAA,IAAI,kBAAkB,EAAE;YACtB,WAAW,CAAC,KAAK,CAAC;AACnB,QAAA;AACH,IAAA,CAAC,CAAC;AAEF,IAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAEC,+BAAe,CAAC;AACzB,YAAAC,uBAAsB,CAAC,SAAS;AAChC,YAAA,CAAA,EAAG,SAAS,CAAA,UAAA,CAAY;YACxB,SAAS;AACV,SAAA,CAAC,EACF,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,GAAG,EAAE,WAAW,EAAA;QAEf,CAAC,QAAQ,IAAI,GAAG;QACjBF,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAEC,+BAAe,CAAC;AACzB,gBAAAC,uBAAsB,CAAC,IAAI;AAC3B,gBAAA,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO;gBACnB,SAAS;aACV,CAAC,EAAA;AAEF,YAAAF,sBAAA,CAAA,aAAA,CAACG,kCAAa,EAAA,EACZ,EAAE,EAAE,kBAAkB,EACtB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,oBAAoB,EAChC,aAAa,EAAA,IAAA,EACb,OAAO,EAAE,kBAAkB,EAAA;AAE3B,gBAAAH,sBAAA,CAAA,aAAA,CAACI,2BAAa,EAAA,EACZ,IAAI,EAAC,QAAQ,EACb,GAAG,EAAE,kBAAkB,EACvB,SAAS,EAAEH,+BAAe,CAAC;AACzB,wBAAAC,uBAAsB,CAAC,QAAQ;wBAC/B,QAAQ,IAAIA,uBAAsB,CAAC,QAAQ;AAC3C,wBAAA,CAAA,EAAG,SAAS,CAAA,eAAA,CAAiB;wBAC7B,SAAS;AACV,qBAAA,CAAC,EAAA,EAED,QAAQ,CACK,CACF,CACZ;AACL,QAAA,QAAQ,IAAI,GAAG,CACZ;AAEV;;;;"}

package/dist/components/AnimatedDropdown/AnimatedDropdown.js

@@ -1,7 +1,10 @@
 import React__default, { useRef } from 'react';
 import { CSSTransition } from 'react-transition-group';
-import { Container, Wrap, Dropdown } from './styled.js';
+import { buildClassnames } from '../../utils/buildClassnames.js';
+import 'uid/secure';
+import { BasicDropdown } from './components/BasicDropdown.js';
 import { useClickAway } from './hooks/useClickAway.js';
+import animatedDropdownStyles from './AnimatedDropdown.module.scss.js';
 
 /**
  * @deprecated - Use `Dropdown` component instead.
@@ -9,16 +12,30 @@ import { useClickAway } from './hooks/useClickAway.js';
  */
 const AnimatedDropdown = ({ cta, shouldShowDropdown, children, className = 'animated-dropdown', reversed = false, onClickAway = () => { }, timeout = 350, transitionClassnames = 'dropdown', onClick, onMouseEnter, onMouseLeave, }) => {
     const dropdownRef = useRef(null);
+    const dropdownContentRef = useRef(null);
     useClickAway(dropdownRef, (event) => {
         if (shouldShowDropdown) {
             onClickAway(event);
         }
     });
-    return (React__default.createElement(Container, { className: `${className}-container ${className}`, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, ref: dropdownRef },
+    return (React__default.createElement("div", { className: buildClassnames([
+            animatedDropdownStyles.container,
+            `${className}-container`,
+            className,
+        ]), onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, ref: dropdownRef },
         !reversed && cta,
-        React__default.createElement(Wrap, { className: `${className}-wrap ${className}` },
-            React__default.createElement(CSSTransition, { in: shouldShowDropdown, timeout: timeout, classNames: transitionClassnames, unmountOnExit: true },
-                React__default.createElement(Dropdown, { role: "dialog", reversed: reversed, className: `${className}-basic-dropdown ${className}` }, children))),
+        React__default.createElement("div", { className: buildClassnames([
+                animatedDropdownStyles.wrap,
+                `${className}-wrap`,
+                className,
+            ]) },
+            React__default.createElement(CSSTransition, { in: shouldShowDropdown, timeout: timeout, classNames: transitionClassnames, unmountOnExit: true, nodeRef: dropdownContentRef },
+                React__default.createElement(BasicDropdown, { role: "dialog", ref: dropdownContentRef, className: buildClassnames([
+                        animatedDropdownStyles.dropdown,
+                        reversed && animatedDropdownStyles.reversed,
+                        `${className}-basic-dropdown`,
+                        className,
+                    ]) }, children))),
         reversed && cta));
 };
 

package/dist/components/AnimatedDropdown/AnimatedDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnimatedDropdown.js","sources":["../../../src/components/AnimatedDropdown/AnimatedDropdown.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport { Wrap, Dropdown, Container } from './styled';\n\nimport { AnimatedDropdownProps } from './types';\nimport { useClickAway } from './hooks/useClickAway';\n\n/**\n * @deprecated - Use `Dropdown` component instead.\n * This component is deprecated and will be removed in future versions.\n */\nexport const AnimatedDropdown = ({\n  cta,\n  shouldShowDropdown,\n  children,\n  className = 'animated-dropdown',\n  reversed = false,\n  onClickAway = () => {},\n  timeout = 350,\n  transitionClassnames = 'dropdown',\n  onClick,\n  onMouseEnter,\n  onMouseLeave,\n}: AnimatedDropdownProps) => {\n  const dropdownRef = useRef<HTMLDivElement>(null);\n\n  useClickAway(dropdownRef, (event: Event) => {\n    if (shouldShowDropdown) {\n      onClickAway(event);\n    }\n  });\n\n  return (\n    <Container\n      className={`${className}-container ${className}`}\n      onClick={onClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      ref={dropdownRef}\n    >\n      {!reversed && cta}\n      <Wrap className={`${className}-wrap ${className}`}>\n        <CSSTransition\n          in={shouldShowDropdown}\n          timeout={timeout}\n          classNames={transitionClassnames}\n          unmountOnExit\n        >\n          <Dropdown\n            role=\"dialog\"\n            reversed={reversed}\n            className={`${className}-basic-dropdown ${className}`}\n          >\n            {children}\n          </Dropdown>\n        </CSSTransition>\n      </Wrap>\n      {reversed && cta}\n    </Container>\n  );\n};\n"],"names":["React"],"mappings":";;;;;AAQA;;;AAGG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAC/B,GAAG,EACH,kBAAkB,EAClB,QAAQ,EACR,SAAS,GAAG,mBAAmB,EAC/B,QAAQ,GAAG,KAAK,EAChB,WAAW,GAAG,MAAK,EAAE,CAAC,EACtB,OAAO,GAAG,GAAG,EACb,oBAAoB,GAAG,UAAU,EACjC,OAAO,EACP,YAAY,EACZ,YAAY,GACU,KAAI;AAC1B,IAAA,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC;AAEhD,IAAA,YAAY,CAAC,WAAW,EAAE,CAAC,KAAY,KAAI;AACzC,QAAA,IAAI,kBAAkB,EAAE;YACtB,WAAW,CAAC,KAAK,CAAC;AACnB,QAAA;AACH,IAAA,CAAC,CAAC;IAEF,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,SAAS,EAAE,CAAA,EAAG,SAAS,CAAA,WAAA,EAAc,SAAS,CAAA,CAAE,EAChD,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,GAAG,EAAE,WAAW,EAAA;QAEf,CAAC,QAAQ,IAAI,GAAG;QACjBA,cAAA,CAAA,aAAA,CAAC,IAAI,IAAC,SAAS,EAAE,GAAG,SAAS,CAAA,MAAA,EAAS,SAAS,CAAA,CAAE,EAAA;AAC/C,YAAAA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EACZ,EAAE,EAAE,kBAAkB,EACtB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,oBAAoB,EAChC,aAAa,EAAA,IAAA,EAAA;gBAEbA,cAAA,CAAA,aAAA,CAAC,QAAQ,IACP,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,CAAA,EAAG,SAAS,CAAA,gBAAA,EAAmB,SAAS,EAAE,EAAA,EAEpD,QAAQ,CACA,CACG,CACX;AACN,QAAA,QAAQ,IAAI,GAAG,CACN;AAEhB;;;;"}
+{"version":3,"file":"AnimatedDropdown.js","sources":["../../../src/components/AnimatedDropdown/AnimatedDropdown.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport { buildClassnames } from '../../utils';\nimport { BasicDropdown } from './components/BasicDropdown';\nimport { AnimatedDropdownProps } from './types';\nimport { useClickAway } from './hooks/useClickAway';\nimport animatedDropdownStyles from './AnimatedDropdown.module.scss';\n\n/**\n * @deprecated - Use `Dropdown` component instead.\n * This component is deprecated and will be removed in future versions.\n */\nexport const AnimatedDropdown = ({\n  cta,\n  shouldShowDropdown,\n  children,\n  className = 'animated-dropdown',\n  reversed = false,\n  onClickAway = () => {},\n  timeout = 350,\n  transitionClassnames = 'dropdown',\n  onClick,\n  onMouseEnter,\n  onMouseLeave,\n}: AnimatedDropdownProps) => {\n  const dropdownRef = useRef<HTMLDivElement>(null);\n  const dropdownContentRef = useRef<HTMLDivElement>(null);\n\n  useClickAway(dropdownRef, (event: Event) => {\n    if (shouldShowDropdown) {\n      onClickAway(event);\n    }\n  });\n\n  return (\n    <div\n      className={buildClassnames([\n        animatedDropdownStyles.container,\n        `${className}-container`,\n        className,\n      ])}\n      onClick={onClick}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      ref={dropdownRef}\n    >\n      {!reversed && cta}\n      <div\n        className={buildClassnames([\n          animatedDropdownStyles.wrap,\n          `${className}-wrap`,\n          className,\n        ])}\n      >\n        <CSSTransition\n          in={shouldShowDropdown}\n          timeout={timeout}\n          classNames={transitionClassnames}\n          unmountOnExit\n          nodeRef={dropdownContentRef}\n        >\n          <BasicDropdown\n            role=\"dialog\"\n            ref={dropdownContentRef}\n            className={buildClassnames([\n              animatedDropdownStyles.dropdown,\n              reversed && animatedDropdownStyles.reversed,\n              `${className}-basic-dropdown`,\n              className,\n            ])}\n          >\n            {children}\n          </BasicDropdown>\n        </CSSTransition>\n      </div>\n      {reversed && cta}\n    </div>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;AASA;;;AAGG;AACI,MAAM,gBAAgB,GAAG,CAAC,EAC/B,GAAG,EACH,kBAAkB,EAClB,QAAQ,EACR,SAAS,GAAG,mBAAmB,EAC/B,QAAQ,GAAG,KAAK,EAChB,WAAW,GAAG,MAAK,EAAE,CAAC,EACtB,OAAO,GAAG,GAAG,EACb,oBAAoB,GAAG,UAAU,EACjC,OAAO,EACP,YAAY,EACZ,YAAY,GACU,KAAI;AAC1B,IAAA,MAAM,WAAW,GAAG,MAAM,CAAiB,IAAI,CAAC;AAChD,IAAA,MAAM,kBAAkB,GAAG,MAAM,CAAiB,IAAI,CAAC;AAEvD,IAAA,YAAY,CAAC,WAAW,EAAE,CAAC,KAAY,KAAI;AACzC,QAAA,IAAI,kBAAkB,EAAE;YACtB,WAAW,CAAC,KAAK,CAAC;AACnB,QAAA;AACH,IAAA,CAAC,CAAC;AAEF,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,eAAe,CAAC;AACzB,YAAA,sBAAsB,CAAC,SAAS;AAChC,YAAA,CAAA,EAAG,SAAS,CAAA,UAAA,CAAY;YACxB,SAAS;AACV,SAAA,CAAC,EACF,OAAO,EAAE,OAAO,EAChB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,GAAG,EAAE,WAAW,EAAA;QAEf,CAAC,QAAQ,IAAI,GAAG;QACjBA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,eAAe,CAAC;AACzB,gBAAA,sBAAsB,CAAC,IAAI;AAC3B,gBAAA,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO;gBACnB,SAAS;aACV,CAAC,EAAA;AAEF,YAAAA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EACZ,EAAE,EAAE,kBAAkB,EACtB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,oBAAoB,EAChC,aAAa,EAAA,IAAA,EACb,OAAO,EAAE,kBAAkB,EAAA;AAE3B,gBAAAA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EACZ,IAAI,EAAC,QAAQ,EACb,GAAG,EAAE,kBAAkB,EACvB,SAAS,EAAE,eAAe,CAAC;AACzB,wBAAA,sBAAsB,CAAC,QAAQ;wBAC/B,QAAQ,IAAI,sBAAsB,CAAC,QAAQ;AAC3C,wBAAA,CAAA,EAAG,SAAS,CAAA,eAAA,CAAiB;wBAC7B,SAAS;AACV,qBAAA,CAAC,EAAA,EAED,QAAQ,CACK,CACF,CACZ;AACL,QAAA,QAAQ,IAAI,GAAG,CACZ;AAEV;;;;"}

package/dist/components/AnimatedDropdown/AnimatedDropdown.module.scss.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
+
+___$insertStyle("._container_9gxyg_1 {\n  box-sizing: border-box;\n  position: relative;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n}\n\n._wrap_9gxyg_12 {\n  box-sizing: border-box;\n  position: relative;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  min-width: 100%;\n}\n\n._dropdown_9gxyg_24 {\n  flex-direction: column;\n  position: absolute;\n  z-index: var(--layers-popup);\n  top: 6px;\n  /* CSSTransition applies global class names that cannot be scoped by CSS Modules.\n     The compound selector (.localClass:global(.globalClass)) keeps the transition\n     styles properly scoped while targeting the global classes added by\n     react-transition-group. */\n}\n._dropdown_9gxyg_24.dropdown-enter {\n  opacity: 0;\n  transform: translateY(-6px);\n}\n._dropdown_9gxyg_24.dropdown-enter-active {\n  opacity: 1;\n  transform: translateY(0);\n  transition: all 200ms;\n}\n._dropdown_9gxyg_24.dropdown-exit {\n  opacity: 1;\n  transform: translateY(0);\n}\n._dropdown_9gxyg_24.dropdown-exit-active {\n  opacity: 0;\n  transform: translateY(-6px);\n  transition: all 200ms;\n}\n\n._reversed_9gxyg_53 {\n  top: auto;\n  bottom: 8px;\n}");
+var animatedDropdownStyles = {"container":"_container_9gxyg_1","wrap":"_wrap_9gxyg_12","dropdown":"_dropdown_9gxyg_24","reversed":"_reversed_9gxyg_53"};
+
+module.exports = animatedDropdownStyles;
+//# sourceMappingURL=AnimatedDropdown.module.scss.cjs.map

package/dist/components/AnimatedDropdown/AnimatedDropdown.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimatedDropdown.module.scss.cjs","sources":["../../../src/components/AnimatedDropdown/AnimatedDropdown.module.scss"],"sourcesContent":[".container {\n  box-sizing: border-box;\n  position: relative;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n}\n\n.wrap {\n  box-sizing: border-box;\n  position: relative;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  min-width: 100%;\n}\n\n.dropdown {\n  flex-direction: column;\n  position: absolute;\n  z-index: var(--layers-popup);\n  top: 6px;\n\n  /* CSSTransition applies global class names that cannot be scoped by CSS Modules.\n     The compound selector (.localClass:global(.globalClass)) keeps the transition\n     styles properly scoped while targeting the global classes added by\n     react-transition-group. */\n  &:global(.dropdown-enter) {\n    opacity: 0;\n    transform: translateY(-6px);\n  }\n\n  &:global(.dropdown-enter-active) {\n    opacity: 1;\n    transform: translateY(0);\n    transition: all 200ms;\n  }\n\n  &:global(.dropdown-exit) {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  &:global(.dropdown-exit-active) {\n    opacity: 0;\n    transform: translateY(-6px);\n    transition: all 200ms;\n  }\n}\n\n.reversed {\n  top: auto;\n  bottom: 8px;\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,yxCAAA;AACA,6BAAA,CAAA,WAAA,CAAA,oBAAA,CAAA,MAAA,CAAA,gBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,UAAA,CAAA,oBAAA;;;;"}

package/dist/components/AnimatedDropdown/AnimatedDropdown.module.scss.js

@@ -0,0 +1,7 @@
+import insertStyle from '../../_virtual/____insertStyle.js';
+
+insertStyle("._container_9gxyg_1 {\n  box-sizing: border-box;\n  position: relative;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n}\n\n._wrap_9gxyg_12 {\n  box-sizing: border-box;\n  position: relative;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  min-width: 100%;\n}\n\n._dropdown_9gxyg_24 {\n  flex-direction: column;\n  position: absolute;\n  z-index: var(--layers-popup);\n  top: 6px;\n  /* CSSTransition applies global class names that cannot be scoped by CSS Modules.\n     The compound selector (.localClass:global(.globalClass)) keeps the transition\n     styles properly scoped while targeting the global classes added by\n     react-transition-group. */\n}\n._dropdown_9gxyg_24.dropdown-enter {\n  opacity: 0;\n  transform: translateY(-6px);\n}\n._dropdown_9gxyg_24.dropdown-enter-active {\n  opacity: 1;\n  transform: translateY(0);\n  transition: all 200ms;\n}\n._dropdown_9gxyg_24.dropdown-exit {\n  opacity: 1;\n  transform: translateY(0);\n}\n._dropdown_9gxyg_24.dropdown-exit-active {\n  opacity: 0;\n  transform: translateY(-6px);\n  transition: all 200ms;\n}\n\n._reversed_9gxyg_53 {\n  top: auto;\n  bottom: 8px;\n}");
+var animatedDropdownStyles = {"container":"_container_9gxyg_1","wrap":"_wrap_9gxyg_12","dropdown":"_dropdown_9gxyg_24","reversed":"_reversed_9gxyg_53"};
+
+export { animatedDropdownStyles as default };
+//# sourceMappingURL=AnimatedDropdown.module.scss.js.map

package/dist/components/AnimatedDropdown/AnimatedDropdown.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnimatedDropdown.module.scss.js","sources":["../../../src/components/AnimatedDropdown/AnimatedDropdown.module.scss"],"sourcesContent":[".container {\n  box-sizing: border-box;\n  position: relative;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n}\n\n.wrap {\n  box-sizing: border-box;\n  position: relative;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-start;\n  align-items: flex-start;\n  min-width: 100%;\n}\n\n.dropdown {\n  flex-direction: column;\n  position: absolute;\n  z-index: var(--layers-popup);\n  top: 6px;\n\n  /* CSSTransition applies global class names that cannot be scoped by CSS Modules.\n     The compound selector (.localClass:global(.globalClass)) keeps the transition\n     styles properly scoped while targeting the global classes added by\n     react-transition-group. */\n  &:global(.dropdown-enter) {\n    opacity: 0;\n    transform: translateY(-6px);\n  }\n\n  &:global(.dropdown-enter-active) {\n    opacity: 1;\n    transform: translateY(0);\n    transition: all 200ms;\n  }\n\n  &:global(.dropdown-exit) {\n    opacity: 1;\n    transform: translateY(0);\n  }\n\n  &:global(.dropdown-exit-active) {\n    opacity: 0;\n    transform: translateY(-6px);\n    transition: all 200ms;\n  }\n}\n\n.reversed {\n  top: auto;\n  bottom: 8px;\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,yxCAAA;AACA,6BAAA,CAAA,WAAA,CAAA,oBAAA,CAAA,MAAA,CAAA,gBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,UAAA,CAAA,oBAAA;;;;"}

package/dist/components/AnimatedDropdown/components/BasicDropdown.cjs

@@ -1,15 +1,17 @@
 'use strict';
 
 var React = require('react');
-var styled = require('./styled.cjs');
+var buildClassnames = require('../../../utils/buildClassnames.cjs');
+require('uid/secure');
+var BasicDropdown_module = require('./BasicDropdown.module.scss.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 const BasicDropdown = React.forwardRef((props, ref) => {
-    const { children, className, role } = props;
-    return (React__default.default.createElement(styled.Container, { className: className, ref: ref, role: role }, children));
+    const { children, className, role, ...rest } = props;
+    return (React__default.default.createElement("div", { className: buildClassnames.buildClassnames([BasicDropdown_module.basicDropdown, className]), ref: ref, role: role, ...rest }, children));
 });
 
 exports.BasicDropdown = BasicDropdown;

package/dist/components/AnimatedDropdown/components/BasicDropdown.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BasicDropdown.cjs","sources":["../../../../src/components/AnimatedDropdown/components/BasicDropdown.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { Container } from './styled';\n\nimport { BasicDropdownProps } from '../types';\n\nexport const BasicDropdown = forwardRef<HTMLDivElement, BasicDropdownProps>(\n  (props: BasicDropdownProps, ref) => {\n    const { children, className, role } = props;\n\n    return (\n      <Container className={className} ref={ref} role={role}>\n        {children}\n      </Container>\n    );\n  },\n);\n"],"names":["forwardRef","React","Container"],"mappings":";;;;;;;;;AAMO,MAAM,aAAa,GAAGA,gBAAU,CACrC,CAAC,KAAyB,EAAE,GAAG,KAAI;IACjC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK;AAE3C,IAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,gBAAS,IAAC,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,IAClD,QAAQ,CACC;AAEhB,CAAC;;;;"}
+{"version":3,"file":"BasicDropdown.cjs","sources":["../../../../src/components/AnimatedDropdown/components/BasicDropdown.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { buildClassnames } from '../../../utils';\nimport { BasicDropdownProps } from '../types';\nimport basicDropdownStyles from './BasicDropdown.module.scss';\n\nexport const BasicDropdown = forwardRef<HTMLDivElement, BasicDropdownProps>(\n  (props: BasicDropdownProps, ref) => {\n    const { children, className, role, ...rest } = props;\n\n    return (\n      <div className={buildClassnames([basicDropdownStyles.basicDropdown, className])} ref={ref} role={role} {...rest}>\n        {children}\n      </div>\n    );\n  },\n);\n"],"names":["forwardRef","React","buildClassnames","basicDropdownStyles"],"mappings":";;;;;;;;;;;AAMO,MAAM,aAAa,GAAGA,gBAAU,CACrC,CAAC,KAAyB,EAAE,GAAG,KAAI;AACjC,IAAA,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK;AAEpD,IAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEC,+BAAe,CAAC,CAACC,oBAAmB,CAAC,aAAa,EAAE,SAAS,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAA,GAAM,IAAI,EAAA,EAC5G,QAAQ,CACL;AAEV,CAAC;;;;"}

package/dist/components/AnimatedDropdown/components/BasicDropdown.js

@@ -1,9 +1,11 @@
 import React__default, { forwardRef } from 'react';
-import { Container } from './styled.js';
+import { buildClassnames } from '../../../utils/buildClassnames.js';
+import 'uid/secure';
+import basicDropdownStyles from './BasicDropdown.module.scss.js';
 
 const BasicDropdown = forwardRef((props, ref) => {
-    const { children, className, role } = props;
-    return (React__default.createElement(Container, { className: className, ref: ref, role: role }, children));
+    const { children, className, role, ...rest } = props;
+    return (React__default.createElement("div", { className: buildClassnames([basicDropdownStyles.basicDropdown, className]), ref: ref, role: role, ...rest }, children));
 });
 
 export { BasicDropdown };

package/dist/components/AnimatedDropdown/components/BasicDropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"BasicDropdown.js","sources":["../../../../src/components/AnimatedDropdown/components/BasicDropdown.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { Container } from './styled';\n\nimport { BasicDropdownProps } from '../types';\n\nexport const BasicDropdown = forwardRef<HTMLDivElement, BasicDropdownProps>(\n  (props: BasicDropdownProps, ref) => {\n    const { children, className, role } = props;\n\n    return (\n      <Container className={className} ref={ref} role={role}>\n        {children}\n      </Container>\n    );\n  },\n);\n"],"names":["React"],"mappings":";;;AAMO,MAAM,aAAa,GAAG,UAAU,CACrC,CAAC,KAAyB,EAAE,GAAG,KAAI;IACjC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK;AAE3C,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,IAAC,SAAS,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,IAClD,QAAQ,CACC;AAEhB,CAAC;;;;"}
+{"version":3,"file":"BasicDropdown.js","sources":["../../../../src/components/AnimatedDropdown/components/BasicDropdown.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport { buildClassnames } from '../../../utils';\nimport { BasicDropdownProps } from '../types';\nimport basicDropdownStyles from './BasicDropdown.module.scss';\n\nexport const BasicDropdown = forwardRef<HTMLDivElement, BasicDropdownProps>(\n  (props: BasicDropdownProps, ref) => {\n    const { children, className, role, ...rest } = props;\n\n    return (\n      <div className={buildClassnames([basicDropdownStyles.basicDropdown, className])} ref={ref} role={role} {...rest}>\n        {children}\n      </div>\n    );\n  },\n);\n"],"names":["React"],"mappings":";;;;;AAMO,MAAM,aAAa,GAAG,UAAU,CACrC,CAAC,KAAyB,EAAE,GAAG,KAAI;AACjC,IAAA,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK;AAEpD,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,eAAe,CAAC,CAAC,mBAAmB,CAAC,aAAa,EAAE,SAAS,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAA,GAAM,IAAI,EAAA,EAC5G,QAAQ,CACL;AAEV,CAAC;;;;"}

package/dist/components/AnimatedDropdown/components/BasicDropdown.module.scss.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var ___$insertStyle = require('../../../_virtual/____insertStyle.cjs');
+
+___$insertStyle("._basicDropdown_1y6wv_1 {\n  display: inline-flex;\n  background-color: #ffffff;\n  box-shadow: 1px 4px 15px rgba(27, 33, 38, 0.25);\n  border-radius: var(--radius-base);\n  overflow: hidden;\n}");
+var basicDropdownStyles = {"basicDropdown":"_basicDropdown_1y6wv_1"};
+
+module.exports = basicDropdownStyles;
+//# sourceMappingURL=BasicDropdown.module.scss.cjs.map

package/dist/components/AnimatedDropdown/components/BasicDropdown.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasicDropdown.module.scss.cjs","sources":["../../../../src/components/AnimatedDropdown/components/BasicDropdown.module.scss"],"sourcesContent":[".basicDropdown {\n  display: inline-flex;\n  background-color: #ffffff;\n  box-shadow: 1px 4px 15px rgba(27, 33, 38, 0.25);\n  border-radius: var(--radius-base);\n  overflow: hidden;\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,oMAAA;AACA,0BAAA,CAAA,eAAA,CAAA,wBAAA;;;;"}

package/dist/components/AnimatedDropdown/components/BasicDropdown.module.scss.js

@@ -0,0 +1,7 @@
+import insertStyle from '../../../_virtual/____insertStyle.js';
+
+insertStyle("._basicDropdown_1y6wv_1 {\n  display: inline-flex;\n  background-color: #ffffff;\n  box-shadow: 1px 4px 15px rgba(27, 33, 38, 0.25);\n  border-radius: var(--radius-base);\n  overflow: hidden;\n}");
+var basicDropdownStyles = {"basicDropdown":"_basicDropdown_1y6wv_1"};
+
+export { basicDropdownStyles as default };
+//# sourceMappingURL=BasicDropdown.module.scss.js.map

package/dist/components/AnimatedDropdown/components/BasicDropdown.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BasicDropdown.module.scss.js","sources":["../../../../src/components/AnimatedDropdown/components/BasicDropdown.module.scss"],"sourcesContent":[".basicDropdown {\n  display: inline-flex;\n  background-color: #ffffff;\n  box-shadow: 1px 4px 15px rgba(27, 33, 38, 0.25);\n  border-radius: var(--radius-base);\n  overflow: hidden;\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,oMAAA;AACA,0BAAA,CAAA,eAAA,CAAA,wBAAA;;;;"}

package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/DodecadeCalendar.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index = require('../../../../../Grid/index.cjs');
+var Grid = require('../../../../../Grid/Grid.cjs');
 var styled = require('./styled.cjs');
 var utils = require('./utils.cjs');
 
@@ -9,7 +9,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-const DodecadeCalendar = ({ currentYear, onFocusYear }) => (React__default.default.createElement(index.Grid, { columns: 3, spacing: "sm", role: "grid" }, utils.getYearsAround(currentYear).map((year) => (React__default.default.createElement(styled.SubCalendarOption, { key: `year-option-${year}`, "aria-label": `Go to ${year}`, onClick: onFocusYear(year) }, year)))));
+const DodecadeCalendar = ({ currentYear, onFocusYear }) => (React__default.default.createElement(Grid.Grid, { columns: 3, spacing: "sm", role: "grid" }, utils.getYearsAround(currentYear).map((year) => (React__default.default.createElement(styled.SubCalendarOption, { key: `year-option-${year}`, "aria-label": `Go to ${year}`, onClick: onFocusYear(year) }, year)))));
 
 exports.DodecadeCalendar = DodecadeCalendar;
 //# sourceMappingURL=DodecadeCalendar.cjs.map

package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/DodecadeCalendar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DodecadeCalendar.cjs","sources":["../../../../../../../src/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/DodecadeCalendar.tsx"],"sourcesContent":["import React from 'react';\nimport { Grid } from '../../../../../Grid';\nimport { SubCalendarOption } from './styled';\nimport { getYearsAround } from './utils';\n\ntype DodecadeCalendarProps = {\n  currentYear: number;\n  onFocusYear: (year: number) => () => void;\n};\n\nexport const DodecadeCalendar = ({ currentYear, onFocusYear }: DodecadeCalendarProps) => (\n  <Grid columns={3} spacing=\"sm\" role=\"grid\">\n    {getYearsAround(currentYear).map((year) => (\n      <SubCalendarOption\n        key={`year-option-${year}`}\n        aria-label={`Go to ${year}`}\n        onClick={onFocusYear(year)}\n      >\n        {year}\n      </SubCalendarOption>\n    ))}\n  </Grid>\n);\n"],"names":["React","Grid","getYearsAround","SubCalendarOption"],"mappings":";;;;;;;;;;;AAUO,MAAM,gBAAgB,GAAG,CAAC,EAAE,WAAW,EAAE,WAAW,EAAyB,MAClFA,sBAAA,CAAA,aAAA,CAACC,UAAI,EAAA,EAAC,OAAO,EAAE,CAAC,EAAE,OAAO,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAA,EACvCC,oBAAc,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,MACpCF,sBAAA,CAAA,aAAA,CAACG,wBAAiB,EAAA,EAChB,GAAG,EAAE,CAAA,YAAA,EAAe,IAAI,EAAE,EAAA,YAAA,EACd,CAAA,MAAA,EAAS,IAAI,CAAA,CAAE,EAC3B,OAAO,EAAE,WAAW,CAAC,IAAI,CAAC,EAAA,EAEzB,IAAI,CACa,CACrB,CAAC,CACG;;;;"}
+{"version":3,"file":"DodecadeCalendar.cjs","sources":["../../../../../../../src/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/DodecadeCalendar.tsx"],"sourcesContent":["import React from 'react';\nimport { Grid } from '../../../../../Grid';\nimport { SubCalendarOption } from './styled';\nimport { getYearsAround } from './utils';\n\ntype DodecadeCalendarProps = {\n  currentYear: number;\n  onFocusYear: (year: number) => () => void;\n};\n\nexport const DodecadeCalendar = ({ currentYear, onFocusYear }: DodecadeCalendarProps) => (\n  <Grid columns={3} spacing=\"sm\" role=\"grid\">\n    {getYearsAround(currentYear).map((year) => (\n      <SubCalendarOption\n        key={`year-option-${year}`}\n        aria-label={`Go to ${year}`}\n        onClick={onFocusYear(year)}\n      >\n        {year}\n      </SubCalendarOption>\n    ))}\n  </Grid>\n);\n"],"names":["React","Grid","getYearsAround","SubCalendarOption"],"mappings":";;;;;;;;;;;AAUO,MAAM,gBAAgB,GAAG,CAAC,EAAE,WAAW,EAAE,WAAW,EAAyB,MAClFA,sBAAA,CAAA,aAAA,CAACC,SAAI,EAAA,EAAC,OAAO,EAAE,CAAC,EAAE,OAAO,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAA,EACvCC,oBAAc,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,MACpCF,sBAAA,CAAA,aAAA,CAACG,wBAAiB,EAAA,EAChB,GAAG,EAAE,CAAA,YAAA,EAAe,IAAI,EAAE,EAAA,YAAA,EACd,CAAA,MAAA,EAAS,IAAI,CAAA,CAAE,EAC3B,OAAO,EAAE,WAAW,CAAC,IAAI,CAAC,EAAA,EAEzB,IAAI,CACa,CACrB,CAAC,CACG;;;;"}

package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/DodecadeCalendar.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { Grid } from '../../../../../Grid/index.js';
+import { Grid } from '../../../../../Grid/Grid.js';
 import { SubCalendarOption } from './styled.js';
 import { getYearsAround } from './utils.js';
 

package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/YearCalendar.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 var React = require('react');
-var index = require('../../../../../Grid/index.cjs');
+var Grid = require('../../../../../Grid/Grid.cjs');
 var styled = require('./styled.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -10,7 +10,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 const MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
 const YearCalendar = ({ onFocusMonth }) => {
-    return (React__default.default.createElement(index.Grid, { columns: 3, spacing: "sm", role: "grid" }, MONTHS.map((month, monthIndex) => (React__default.default.createElement(styled.SubCalendarOption, { key: `month-option-${month}`, "aria-label": `Go to ${month}`, onClick: onFocusMonth(monthIndex) }, month)))));
+    return (React__default.default.createElement(Grid.Grid, { columns: 3, spacing: "sm", role: "grid" }, MONTHS.map((month, monthIndex) => (React__default.default.createElement(styled.SubCalendarOption, { key: `month-option-${month}`, "aria-label": `Go to ${month}`, onClick: onFocusMonth(monthIndex) }, month)))));
 };
 
 exports.YearCalendar = YearCalendar;

package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/YearCalendar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"YearCalendar.cjs","sources":["../../../../../../../src/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/YearCalendar.tsx"],"sourcesContent":["import React from 'react';\nimport { Grid } from '../../../../../Grid';\nimport { SubCalendarOption } from './styled';\n\ntype MonthCalendarProps = {\n  onFocusMonth: (monthIndex: number) => () => void;\n};\n\nconst MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n\nexport const YearCalendar = ({ onFocusMonth }: MonthCalendarProps) => {\n  return (\n    <Grid columns={3} spacing=\"sm\" role=\"grid\">\n      {MONTHS.map((month, monthIndex) => (\n        <SubCalendarOption\n          key={`month-option-${month}`}\n          aria-label={`Go to ${month}`}\n          onClick={onFocusMonth(monthIndex)}\n        >\n          {month}\n        </SubCalendarOption>\n      ))}\n    </Grid>\n  );\n};\n"],"names":["React","Grid","SubCalendarOption"],"mappings":";;;;;;;;;;AAQA,MAAM,MAAM,GAAG,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;MAEtF,YAAY,GAAG,CAAC,EAAE,YAAY,EAAsB,KAAI;IACnE,QACEA,sBAAA,CAAA,aAAA,CAACC,UAAI,EAAA,EAAC,OAAO,EAAE,CAAC,EAAE,OAAO,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAA,EACvC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,UAAU,MAC5BD,sBAAA,CAAA,aAAA,CAACE,wBAAiB,EAAA,EAChB,GAAG,EAAE,CAAA,aAAA,EAAgB,KAAK,CAAA,CAAE,EAAA,YAAA,EAChB,CAAA,MAAA,EAAS,KAAK,CAAA,CAAE,EAC5B,OAAO,EAAE,YAAY,CAAC,UAAU,CAAC,EAAA,EAEhC,KAAK,CACY,CACrB,CAAC,CACG;AAEX;;;;"}
+{"version":3,"file":"YearCalendar.cjs","sources":["../../../../../../../src/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/YearCalendar.tsx"],"sourcesContent":["import React from 'react';\nimport { Grid } from '../../../../../Grid';\nimport { SubCalendarOption } from './styled';\n\ntype MonthCalendarProps = {\n  onFocusMonth: (monthIndex: number) => () => void;\n};\n\nconst MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\n\nexport const YearCalendar = ({ onFocusMonth }: MonthCalendarProps) => {\n  return (\n    <Grid columns={3} spacing=\"sm\" role=\"grid\">\n      {MONTHS.map((month, monthIndex) => (\n        <SubCalendarOption\n          key={`month-option-${month}`}\n          aria-label={`Go to ${month}`}\n          onClick={onFocusMonth(monthIndex)}\n        >\n          {month}\n        </SubCalendarOption>\n      ))}\n    </Grid>\n  );\n};\n"],"names":["React","Grid","SubCalendarOption"],"mappings":";;;;;;;;;;AAQA,MAAM,MAAM,GAAG,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;MAEtF,YAAY,GAAG,CAAC,EAAE,YAAY,EAAsB,KAAI;IACnE,QACEA,sBAAA,CAAA,aAAA,CAACC,SAAI,EAAA,EAAC,OAAO,EAAE,CAAC,EAAE,OAAO,EAAC,IAAI,EAAC,IAAI,EAAC,MAAM,EAAA,EACvC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,UAAU,MAC5BD,sBAAA,CAAA,aAAA,CAACE,wBAAiB,EAAA,EAChB,GAAG,EAAE,CAAA,aAAA,EAAgB,KAAK,CAAA,CAAE,EAAA,YAAA,EAChB,CAAA,MAAA,EAAS,KAAK,CAAA,CAAE,EAC5B,OAAO,EAAE,YAAY,CAAC,UAAU,CAAC,EAAA,EAEhC,KAAK,CACY,CACrB,CAAC,CACG;AAEX;;;;"}

package/dist/components/Calendars/components/subcomponents/CalendarGrid/subCalendars/YearCalendar.js

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { Grid } from '../../../../../Grid/index.js';
+import { Grid } from '../../../../../Grid/Grid.js';
 import { SubCalendarOption } from './styled.js';
 
 const MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs

@@ -13,7 +13,6 @@ require('../../../../../theme/modules/sizes.cjs');
 require('../../../../../theme/modules/text.cjs');
 require('styled-components');
 require('framer-motion');
-require('../../../../Tooltip/components/styled.cjs');
 require('../../../../Tooltip/components/TooltipPopover.cjs');
 require('react-dom');
 require('../../../../Text/Text.cjs');

package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BodyCell.cjs","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { Cell, flexRender } from '@tanstack/react-table';\nimport { SELECTION_COLUMN_ID } from '../../../constants';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\nimport { usePinnedColumnStyles } from '../../../hooks';\n\nimport { useExpandableCell } from './hooks';\nimport styles from './BodyCell.module.scss';\n\ntype ColumnCellProps = {\n  /**\n   * Cell within the TanStack Table instance.\n   */\n  cell: Cell<any, any>;\n\n  /**\n   * ARIA roles for the grid.\n   */\n  ariaRoles: AriaRoles;\n\n  /**\n   * Whether row selection is enabled.\n   */\n  enableRowSelection: boolean;\n\n  /**\n   * Whether row expanding is enabled for the grid.\n   */\n  enableExpanding: boolean;\n};\n\n/**\n * Renders a cell element, and its content, for a given column and row, within the grid body.\n */\nexport const BodyCell = ({\n  cell,\n  ariaRoles,\n  enableRowSelection,\n  enableExpanding,\n}: ColumnCellProps) => {\n  const { justifyContent, textAlign, rowHeader, generateDataTestId } = cell.column.columnDef.meta!;\n  const CellElement = rowHeader ? 'th' : 'td';\n\n  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });\n\n  const { expandButtonProps, contentMarginLeft } = useExpandableCell({\n    cell,\n    enableExpanding,\n    enableRowSelection,\n  });\n\n  const bodyCellClassname = buildClassnames([\n    styles.bodyCell,\n    pinnedCellClassName,\n    'data-grid-cell',\n  ]);\n\n  const cellContext = cell.getContext();\n  const cellTestId = useMemo(\n    () => (generateDataTestId ? generateDataTestId(cellContext.row.original) : undefined),\n    [generateDataTestId, cellContext.row.original],\n  );\n\n  const isSelectionCol = enableRowSelection && cell.column.id === SELECTION_COLUMN_ID;\n\n  // Capture shift key state for range selection in selection column.\n  const captureShiftKeyForSelection = isSelectionCol\n    ? (e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>) => {\n        if ('key' in e && e.key !== ' ') return;\n\n        const { row, table } = cell.getContext();\n        if (!row.getCanSelect()) return;\n\n        const { rangeSelectionState } = table.options.meta || {};\n        if (rangeSelectionState) rangeSelectionState.isShiftKeyPressed = e.shiftKey;\n      }\n    : undefined;\n\n  return (\n    <CellElement\n      className={bodyCellClassname}\n      aria-colindex={cell.column.getIndex() + 1}\n      scope={rowHeader ? 'row' : undefined}\n      role={rowHeader ? 'rowheader' : ariaRoles.cell}\n      style={pinnedCellStyles}\n      data-testid={cellTestId}\n    >\n      <CellContent\n        contentStyle={\n          {\n            marginLeft: contentMarginLeft,\n            justifyContent,\n            textAlign,\n          } as React.CSSProperties\n        }\n        expandButtonProps={expandButtonProps}\n        onMouseDown={captureShiftKeyForSelection}\n        onKeyDown={captureShiftKeyForSelection}\n      >\n        {flexRender(cell.column.columnDef.cell, cellContext)}\n      </CellContent>\n    </CellElement>\n  );\n};\n"],"names":["usePinnedColumnStyles","useExpandableCell","buildClassnames","styles","useMemo","SELECTION_COLUMN_ID","React","CellContent","flexRender"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA;;AAEG;AACI,MAAM,QAAQ,GAAG,CAAC,EACvB,IAAI,EACJ,SAAS,EACT,kBAAkB,EAClB,eAAe,GACC,KAAI;AACpB,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,kBAAkB,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;IAChG,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;AAE3C,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAGA,2CAAqB,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;AAEhG,IAAA,MAAM,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,GAAGC,mCAAiB,CAAC;QACjE,IAAI;QACJ,eAAe;QACf,kBAAkB;AACnB,KAAA,CAAC;IAEF,MAAM,iBAAiB,GAAGC,+BAAe,CAAC;AACxC,QAAAC,eAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;AACjB,KAAA,CAAC;AAEF,IAAA,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,EAAE;AACrC,IAAA,MAAM,UAAU,GAAGC,aAAO,CACxB,OAAO,kBAAkB,GAAG,kBAAkB,CAAC,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC,EACrF,CAAC,kBAAkB,EAAE,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,CAC/C;IAED,MAAM,cAAc,GAAG,kBAAkB,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE,KAAKC,6BAAmB;;IAGnF,MAAM,2BAA2B,GAAG;AAClC,UAAE,CAAC,CAAyE,KAAI;YAC5E,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG;gBAAE;YAEjC,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,EAAE;AACxC,YAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE;gBAAE;YAEzB,MAAM,EAAE,mBAAmB,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,EAAE;AACxD,YAAA,IAAI,mBAAmB;AAAE,gBAAA,mBAAmB,CAAC,iBAAiB,GAAG,CAAC,CAAC,QAAQ;QAC7E;UACA,SAAS;IAEb,QACEC,qCAAC,WAAW,EAAA,EACV,SAAS,EAAE,iBAAiB,mBACb,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,EACpC,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC,IAAI,EAC9C,KAAK,EAAE,gBAAgB,EAAA,aAAA,EACV,UAAU,EAAA;QAEvBA,sBAAA,CAAA,aAAA,CAACC,uBAAW,EAAA,EACV,YAAY,EACV;AACE,gBAAA,UAAU,EAAE,iBAAiB;gBAC7B,cAAc;gBACd,SAAS;aACa,EAE1B,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,2BAA2B,EACxC,SAAS,EAAE,2BAA2B,EAAA,EAErCC,qBAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,WAAW,CAAC,CACxC,CACF;AAElB;;;;"}
+{"version":3,"file":"BodyCell.cjs","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { Cell, flexRender } from '@tanstack/react-table';\nimport { SELECTION_COLUMN_ID } from '../../../constants';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\nimport { usePinnedColumnStyles } from '../../../hooks';\n\nimport { useExpandableCell } from './hooks';\nimport styles from './BodyCell.module.scss';\n\ntype ColumnCellProps = {\n  /**\n   * Cell within the TanStack Table instance.\n   */\n  cell: Cell<any, any>;\n\n  /**\n   * ARIA roles for the grid.\n   */\n  ariaRoles: AriaRoles;\n\n  /**\n   * Whether row selection is enabled.\n   */\n  enableRowSelection: boolean;\n\n  /**\n   * Whether row expanding is enabled for the grid.\n   */\n  enableExpanding: boolean;\n};\n\n/**\n * Renders a cell element, and its content, for a given column and row, within the grid body.\n */\nexport const BodyCell = ({\n  cell,\n  ariaRoles,\n  enableRowSelection,\n  enableExpanding,\n}: ColumnCellProps) => {\n  const { justifyContent, textAlign, rowHeader, generateDataTestId } = cell.column.columnDef.meta!;\n  const CellElement = rowHeader ? 'th' : 'td';\n\n  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });\n\n  const { expandButtonProps, contentMarginLeft } = useExpandableCell({\n    cell,\n    enableExpanding,\n    enableRowSelection,\n  });\n\n  const bodyCellClassname = buildClassnames([\n    styles.bodyCell,\n    pinnedCellClassName,\n    'data-grid-cell',\n  ]);\n\n  const cellContext = cell.getContext();\n  const cellTestId = useMemo(\n    () => (generateDataTestId ? generateDataTestId(cellContext.row.original) : undefined),\n    [generateDataTestId, cellContext.row.original],\n  );\n\n  const isSelectionCol = enableRowSelection && cell.column.id === SELECTION_COLUMN_ID;\n\n  // Capture shift key state for range selection in selection column.\n  const captureShiftKeyForSelection = isSelectionCol\n    ? (e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>) => {\n        if ('key' in e && e.key !== ' ') return;\n\n        const { row, table } = cell.getContext();\n        if (!row.getCanSelect()) return;\n\n        const { rangeSelectionState } = table.options.meta || {};\n        if (rangeSelectionState) rangeSelectionState.isShiftKeyPressed = e.shiftKey;\n      }\n    : undefined;\n\n  return (\n    <CellElement\n      className={bodyCellClassname}\n      aria-colindex={cell.column.getIndex() + 1}\n      scope={rowHeader ? 'row' : undefined}\n      role={rowHeader ? 'rowheader' : ariaRoles.cell}\n      style={pinnedCellStyles}\n      data-testid={cellTestId}\n    >\n      <CellContent\n        contentStyle={\n          {\n            marginLeft: contentMarginLeft,\n            justifyContent,\n            textAlign,\n          } as React.CSSProperties\n        }\n        expandButtonProps={expandButtonProps}\n        onMouseDown={captureShiftKeyForSelection}\n        onKeyDown={captureShiftKeyForSelection}\n      >\n        {flexRender(cell.column.columnDef.cell, cellContext)}\n      </CellContent>\n    </CellElement>\n  );\n};\n"],"names":["usePinnedColumnStyles","useExpandableCell","buildClassnames","styles","useMemo","SELECTION_COLUMN_ID","React","CellContent","flexRender"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA;;AAEG;AACI,MAAM,QAAQ,GAAG,CAAC,EACvB,IAAI,EACJ,SAAS,EACT,kBAAkB,EAClB,eAAe,GACC,KAAI;AACpB,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,kBAAkB,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;IAChG,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;AAE3C,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAGA,2CAAqB,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;AAEhG,IAAA,MAAM,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,GAAGC,mCAAiB,CAAC;QACjE,IAAI;QACJ,eAAe;QACf,kBAAkB;AACnB,KAAA,CAAC;IAEF,MAAM,iBAAiB,GAAGC,+BAAe,CAAC;AACxC,QAAAC,eAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;AACjB,KAAA,CAAC;AAEF,IAAA,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,EAAE;AACrC,IAAA,MAAM,UAAU,GAAGC,aAAO,CACxB,OAAO,kBAAkB,GAAG,kBAAkB,CAAC,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC,EACrF,CAAC,kBAAkB,EAAE,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,CAC/C;IAED,MAAM,cAAc,GAAG,kBAAkB,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE,KAAKC,6BAAmB;;IAGnF,MAAM,2BAA2B,GAAG;AAClC,UAAE,CAAC,CAAyE,KAAI;YAC5E,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG;gBAAE;YAEjC,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,EAAE;AACxC,YAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE;gBAAE;YAEzB,MAAM,EAAE,mBAAmB,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,EAAE;AACxD,YAAA,IAAI,mBAAmB;AAAE,gBAAA,mBAAmB,CAAC,iBAAiB,GAAG,CAAC,CAAC,QAAQ;QAC7E;UACA,SAAS;IAEb,QACEC,qCAAC,WAAW,EAAA,EACV,SAAS,EAAE,iBAAiB,mBACb,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,EACpC,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC,IAAI,EAC9C,KAAK,EAAE,gBAAgB,EAAA,aAAA,EACV,UAAU,EAAA;QAEvBA,sBAAA,CAAA,aAAA,CAACC,uBAAW,EAAA,EACV,YAAY,EACV;AACE,gBAAA,UAAU,EAAE,iBAAiB;gBAC7B,cAAc;gBACd,SAAS;aACa,EAE1B,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,2BAA2B,EACxC,SAAS,EAAE,2BAA2B,EAAA,EAErCC,qBAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,WAAW,CAAC,CACxC,CACF;AAElB;;;;"}

package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js

@@ -11,7 +11,6 @@ import '../../../../../theme/modules/sizes.js';
 import '../../../../../theme/modules/text.js';
 import 'styled-components';
 import 'framer-motion';
-import '../../../../Tooltip/components/styled.js';
 import '../../../../Tooltip/components/TooltipPopover.js';
 import 'react-dom';
 import '../../../../Text/Text.js';

package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"BodyCell.js","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { Cell, flexRender } from '@tanstack/react-table';\nimport { SELECTION_COLUMN_ID } from '../../../constants';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\nimport { usePinnedColumnStyles } from '../../../hooks';\n\nimport { useExpandableCell } from './hooks';\nimport styles from './BodyCell.module.scss';\n\ntype ColumnCellProps = {\n  /**\n   * Cell within the TanStack Table instance.\n   */\n  cell: Cell<any, any>;\n\n  /**\n   * ARIA roles for the grid.\n   */\n  ariaRoles: AriaRoles;\n\n  /**\n   * Whether row selection is enabled.\n   */\n  enableRowSelection: boolean;\n\n  /**\n   * Whether row expanding is enabled for the grid.\n   */\n  enableExpanding: boolean;\n};\n\n/**\n * Renders a cell element, and its content, for a given column and row, within the grid body.\n */\nexport const BodyCell = ({\n  cell,\n  ariaRoles,\n  enableRowSelection,\n  enableExpanding,\n}: ColumnCellProps) => {\n  const { justifyContent, textAlign, rowHeader, generateDataTestId } = cell.column.columnDef.meta!;\n  const CellElement = rowHeader ? 'th' : 'td';\n\n  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });\n\n  const { expandButtonProps, contentMarginLeft } = useExpandableCell({\n    cell,\n    enableExpanding,\n    enableRowSelection,\n  });\n\n  const bodyCellClassname = buildClassnames([\n    styles.bodyCell,\n    pinnedCellClassName,\n    'data-grid-cell',\n  ]);\n\n  const cellContext = cell.getContext();\n  const cellTestId = useMemo(\n    () => (generateDataTestId ? generateDataTestId(cellContext.row.original) : undefined),\n    [generateDataTestId, cellContext.row.original],\n  );\n\n  const isSelectionCol = enableRowSelection && cell.column.id === SELECTION_COLUMN_ID;\n\n  // Capture shift key state for range selection in selection column.\n  const captureShiftKeyForSelection = isSelectionCol\n    ? (e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>) => {\n        if ('key' in e && e.key !== ' ') return;\n\n        const { row, table } = cell.getContext();\n        if (!row.getCanSelect()) return;\n\n        const { rangeSelectionState } = table.options.meta || {};\n        if (rangeSelectionState) rangeSelectionState.isShiftKeyPressed = e.shiftKey;\n      }\n    : undefined;\n\n  return (\n    <CellElement\n      className={bodyCellClassname}\n      aria-colindex={cell.column.getIndex() + 1}\n      scope={rowHeader ? 'row' : undefined}\n      role={rowHeader ? 'rowheader' : ariaRoles.cell}\n      style={pinnedCellStyles}\n      data-testid={cellTestId}\n    >\n      <CellContent\n        contentStyle={\n          {\n            marginLeft: contentMarginLeft,\n            justifyContent,\n            textAlign,\n          } as React.CSSProperties\n        }\n        expandButtonProps={expandButtonProps}\n        onMouseDown={captureShiftKeyForSelection}\n        onKeyDown={captureShiftKeyForSelection}\n      >\n        {flexRender(cell.column.columnDef.cell, cellContext)}\n      </CellContent>\n    </CellElement>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAoCA;;AAEG;AACI,MAAM,QAAQ,GAAG,CAAC,EACvB,IAAI,EACJ,SAAS,EACT,kBAAkB,EAClB,eAAe,GACC,KAAI;AACpB,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,kBAAkB,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;IAChG,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;AAE3C,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAG,qBAAqB,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;AAEhG,IAAA,MAAM,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,GAAG,iBAAiB,CAAC;QACjE,IAAI;QACJ,eAAe;QACf,kBAAkB;AACnB,KAAA,CAAC;IAEF,MAAM,iBAAiB,GAAG,eAAe,CAAC;AACxC,QAAA,MAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;AACjB,KAAA,CAAC;AAEF,IAAA,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,EAAE;AACrC,IAAA,MAAM,UAAU,GAAG,OAAO,CACxB,OAAO,kBAAkB,GAAG,kBAAkB,CAAC,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC,EACrF,CAAC,kBAAkB,EAAE,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,CAC/C;IAED,MAAM,cAAc,GAAG,kBAAkB,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE,KAAK,mBAAmB;;IAGnF,MAAM,2BAA2B,GAAG;AAClC,UAAE,CAAC,CAAyE,KAAI;YAC5E,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG;gBAAE;YAEjC,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,EAAE;AACxC,YAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE;gBAAE;YAEzB,MAAM,EAAE,mBAAmB,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,EAAE;AACxD,YAAA,IAAI,mBAAmB;AAAE,gBAAA,mBAAmB,CAAC,iBAAiB,GAAG,CAAC,CAAC,QAAQ;QAC7E;UACA,SAAS;IAEb,QACEA,6BAAC,WAAW,EAAA,EACV,SAAS,EAAE,iBAAiB,mBACb,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,EACpC,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC,IAAI,EAC9C,KAAK,EAAE,gBAAgB,EAAA,aAAA,EACV,UAAU,EAAA;QAEvBA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,YAAY,EACV;AACE,gBAAA,UAAU,EAAE,iBAAiB;gBAC7B,cAAc;gBACd,SAAS;aACa,EAE1B,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,2BAA2B,EACxC,SAAS,EAAE,2BAA2B,EAAA,EAErC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,WAAW,CAAC,CACxC,CACF;AAElB;;;;"}
+{"version":3,"file":"BodyCell.js","sources":["../../../../../../src/components/DataGrid/components/Body/BodyCell/BodyCell.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { Cell, flexRender } from '@tanstack/react-table';\nimport { SELECTION_COLUMN_ID } from '../../../constants';\n\nimport { buildClassnames } from '../../../../../utils';\n\nimport { AriaRoles } from '../../../types';\nimport { CellContent } from '../../CellContent';\nimport { usePinnedColumnStyles } from '../../../hooks';\n\nimport { useExpandableCell } from './hooks';\nimport styles from './BodyCell.module.scss';\n\ntype ColumnCellProps = {\n  /**\n   * Cell within the TanStack Table instance.\n   */\n  cell: Cell<any, any>;\n\n  /**\n   * ARIA roles for the grid.\n   */\n  ariaRoles: AriaRoles;\n\n  /**\n   * Whether row selection is enabled.\n   */\n  enableRowSelection: boolean;\n\n  /**\n   * Whether row expanding is enabled for the grid.\n   */\n  enableExpanding: boolean;\n};\n\n/**\n * Renders a cell element, and its content, for a given column and row, within the grid body.\n */\nexport const BodyCell = ({\n  cell,\n  ariaRoles,\n  enableRowSelection,\n  enableExpanding,\n}: ColumnCellProps) => {\n  const { justifyContent, textAlign, rowHeader, generateDataTestId } = cell.column.columnDef.meta!;\n  const CellElement = rowHeader ? 'th' : 'td';\n\n  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({ column: cell.column });\n\n  const { expandButtonProps, contentMarginLeft } = useExpandableCell({\n    cell,\n    enableExpanding,\n    enableRowSelection,\n  });\n\n  const bodyCellClassname = buildClassnames([\n    styles.bodyCell,\n    pinnedCellClassName,\n    'data-grid-cell',\n  ]);\n\n  const cellContext = cell.getContext();\n  const cellTestId = useMemo(\n    () => (generateDataTestId ? generateDataTestId(cellContext.row.original) : undefined),\n    [generateDataTestId, cellContext.row.original],\n  );\n\n  const isSelectionCol = enableRowSelection && cell.column.id === SELECTION_COLUMN_ID;\n\n  // Capture shift key state for range selection in selection column.\n  const captureShiftKeyForSelection = isSelectionCol\n    ? (e: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent<HTMLDivElement>) => {\n        if ('key' in e && e.key !== ' ') return;\n\n        const { row, table } = cell.getContext();\n        if (!row.getCanSelect()) return;\n\n        const { rangeSelectionState } = table.options.meta || {};\n        if (rangeSelectionState) rangeSelectionState.isShiftKeyPressed = e.shiftKey;\n      }\n    : undefined;\n\n  return (\n    <CellElement\n      className={bodyCellClassname}\n      aria-colindex={cell.column.getIndex() + 1}\n      scope={rowHeader ? 'row' : undefined}\n      role={rowHeader ? 'rowheader' : ariaRoles.cell}\n      style={pinnedCellStyles}\n      data-testid={cellTestId}\n    >\n      <CellContent\n        contentStyle={\n          {\n            marginLeft: contentMarginLeft,\n            justifyContent,\n            textAlign,\n          } as React.CSSProperties\n        }\n        expandButtonProps={expandButtonProps}\n        onMouseDown={captureShiftKeyForSelection}\n        onKeyDown={captureShiftKeyForSelection}\n      >\n        {flexRender(cell.column.columnDef.cell, cellContext)}\n      </CellContent>\n    </CellElement>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;AAoCA;;AAEG;AACI,MAAM,QAAQ,GAAG,CAAC,EACvB,IAAI,EACJ,SAAS,EACT,kBAAkB,EAClB,eAAe,GACC,KAAI;AACpB,IAAA,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,kBAAkB,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAK;IAChG,MAAM,WAAW,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI;AAE3C,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAG,qBAAqB,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC;AAEhG,IAAA,MAAM,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,GAAG,iBAAiB,CAAC;QACjE,IAAI;QACJ,eAAe;QACf,kBAAkB;AACnB,KAAA,CAAC;IAEF,MAAM,iBAAiB,GAAG,eAAe,CAAC;AACxC,QAAA,MAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;AACjB,KAAA,CAAC;AAEF,IAAA,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,EAAE;AACrC,IAAA,MAAM,UAAU,GAAG,OAAO,CACxB,OAAO,kBAAkB,GAAG,kBAAkB,CAAC,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,SAAS,CAAC,EACrF,CAAC,kBAAkB,EAAE,WAAW,CAAC,GAAG,CAAC,QAAQ,CAAC,CAC/C;IAED,MAAM,cAAc,GAAG,kBAAkB,IAAI,IAAI,CAAC,MAAM,CAAC,EAAE,KAAK,mBAAmB;;IAGnF,MAAM,2BAA2B,GAAG;AAClC,UAAE,CAAC,CAAyE,KAAI;YAC5E,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG;gBAAE;YAEjC,MAAM,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,UAAU,EAAE;AACxC,YAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE;gBAAE;YAEzB,MAAM,EAAE,mBAAmB,EAAE,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,IAAI,EAAE;AACxD,YAAA,IAAI,mBAAmB;AAAE,gBAAA,mBAAmB,CAAC,iBAAiB,GAAG,CAAC,CAAC,QAAQ;QAC7E;UACA,SAAS;IAEb,QACEA,6BAAC,WAAW,EAAA,EACV,SAAS,EAAE,iBAAiB,mBACb,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE,SAAS,GAAG,KAAK,GAAG,SAAS,EACpC,IAAI,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC,IAAI,EAC9C,KAAK,EAAE,gBAAgB,EAAA,aAAA,EACV,UAAU,EAAA;QAEvBA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,YAAY,EACV;AACE,gBAAA,UAAU,EAAE,iBAAiB;gBAC7B,cAAc;gBACd,SAAS;aACa,EAE1B,iBAAiB,EAAE,iBAAiB,EACpC,WAAW,EAAE,2BAA2B,EACxC,SAAS,EAAE,2BAA2B,EAAA,EAErC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,EAAE,WAAW,CAAC,CACxC,CACF;AAElB;;;;"}

package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.cjs

@@ -9,7 +9,6 @@ require('@tanstack/react-table');
 require('../../../../Stack/Stack.cjs');
 var index = require('../../../../../theme/index.cjs');
 require('framer-motion');
-require('../../../../Tooltip/components/styled.cjs');
 require('../../../../Tooltip/components/TooltipPopover.cjs');
 require('react-dom');
 require('../../../../Text/Text.cjs');

package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingBodyCell.cjs","sources":["../../../../../../src/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.tsx"],"sourcesContent":["import React from 'react';\nimport { Column } from '@tanstack/react-table';\n\nimport { Skeleton } from '../../../../Skeleton';\nimport { buildClassnames } from '../../../../../utils';\nimport { usePinnedColumnStyles } from '../../../hooks';\nimport { CellContent } from '../../CellContent';\nimport { theme } from '../../../../../theme';\n\nimport styles from '../BodyCell/BodyCell.module.scss';\n\ntype LoadingBodyCellProps = {\n  /**\n   * The TanStack Table column instance.\n   */\n  column: Column<any, any>;\n};\n\n/**\n * A cell component for the DataGrid that displays a skeleton loader.\n */\nexport const LoadingBodyCell = ({ column }: LoadingBodyCellProps) => {\n  const { justifyContent, textAlign } = column.columnDef.meta!;\n  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({\n    column,\n  });\n\n  const loadingCellClassname = buildClassnames([\n    styles.bodyCell,\n    pinnedCellClassName,\n    'data-grid-cell',\n    'data-grid-cell-loading',\n  ]);\n\n  return (\n    <td\n      className={loadingCellClassname}\n      style={pinnedCellStyles}\n      aria-colindex={column.getIndex() + 1}\n    >\n      <CellContent\n        contentStyle={\n          {\n            justifyContent,\n            textAlign,\n          } as React.CSSProperties\n        }\n      >\n        <Skeleton width=\"75%\" height={theme.sizes[3]} />\n      </CellContent>\n    </td>\n  );\n};\n"],"names":["usePinnedColumnStyles","buildClassnames","styles","React","CellContent","Skeleton","theme"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAkBA;;AAEG;MACU,eAAe,GAAG,CAAC,EAAE,MAAM,EAAwB,KAAI;IAClE,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,SAAS,CAAC,IAAK;AAC5D,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAGA,2CAAqB,CAAC;QACtE,MAAM;AACP,KAAA,CAAC;IAEF,MAAM,oBAAoB,GAAGC,+BAAe,CAAC;AAC3C,QAAAC,eAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;QAChB,wBAAwB;AACzB,KAAA,CAAC;AAEF,IAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,oBAAoB,EAC/B,KAAK,EAAE,gBAAgB,mBACR,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EAAA;QAEpCA,sBAAA,CAAA,aAAA,CAACC,uBAAW,EAAA,EACV,YAAY,EACV;gBACE,cAAc;gBACd,SAAS;AACa,aAAA,EAAA;AAG1B,YAAAD,sBAAA,CAAA,aAAA,CAACE,iBAAQ,EAAA,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAEC,WAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAI,CACpC,CACX;AAET;;;;"}
+{"version":3,"file":"LoadingBodyCell.cjs","sources":["../../../../../../src/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.tsx"],"sourcesContent":["import React from 'react';\nimport { Column } from '@tanstack/react-table';\n\nimport { Skeleton } from '../../../../Skeleton';\nimport { buildClassnames } from '../../../../../utils';\nimport { usePinnedColumnStyles } from '../../../hooks';\nimport { CellContent } from '../../CellContent';\nimport { theme } from '../../../../../theme';\n\nimport styles from '../BodyCell/BodyCell.module.scss';\n\ntype LoadingBodyCellProps = {\n  /**\n   * The TanStack Table column instance.\n   */\n  column: Column<any, any>;\n};\n\n/**\n * A cell component for the DataGrid that displays a skeleton loader.\n */\nexport const LoadingBodyCell = ({ column }: LoadingBodyCellProps) => {\n  const { justifyContent, textAlign } = column.columnDef.meta!;\n  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({\n    column,\n  });\n\n  const loadingCellClassname = buildClassnames([\n    styles.bodyCell,\n    pinnedCellClassName,\n    'data-grid-cell',\n    'data-grid-cell-loading',\n  ]);\n\n  return (\n    <td\n      className={loadingCellClassname}\n      style={pinnedCellStyles}\n      aria-colindex={column.getIndex() + 1}\n    >\n      <CellContent\n        contentStyle={\n          {\n            justifyContent,\n            textAlign,\n          } as React.CSSProperties\n        }\n      >\n        <Skeleton width=\"75%\" height={theme.sizes[3]} />\n      </CellContent>\n    </td>\n  );\n};\n"],"names":["usePinnedColumnStyles","buildClassnames","styles","React","CellContent","Skeleton","theme"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAkBA;;AAEG;MACU,eAAe,GAAG,CAAC,EAAE,MAAM,EAAwB,KAAI;IAClE,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,SAAS,CAAC,IAAK;AAC5D,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAGA,2CAAqB,CAAC;QACtE,MAAM;AACP,KAAA,CAAC;IAEF,MAAM,oBAAoB,GAAGC,+BAAe,CAAC;AAC3C,QAAAC,eAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;QAChB,wBAAwB;AACzB,KAAA,CAAC;AAEF,IAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,oBAAoB,EAC/B,KAAK,EAAE,gBAAgB,mBACR,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EAAA;QAEpCA,sBAAA,CAAA,aAAA,CAACC,uBAAW,EAAA,EACV,YAAY,EACV;gBACE,cAAc;gBACd,SAAS;AACa,aAAA,EAAA;AAG1B,YAAAD,sBAAA,CAAA,aAAA,CAACE,iBAAQ,EAAA,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAEC,WAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAI,CACpC,CACX;AAET;;;;"}

package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.js

@@ -7,7 +7,6 @@ import '@tanstack/react-table';
 import '../../../../Stack/Stack.js';
 import { theme } from '../../../../../theme/index.js';
 import 'framer-motion';
-import '../../../../Tooltip/components/styled.js';
 import '../../../../Tooltip/components/TooltipPopover.js';
 import 'react-dom';
 import '../../../../Text/Text.js';

package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoadingBodyCell.js","sources":["../../../../../../src/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.tsx"],"sourcesContent":["import React from 'react';\nimport { Column } from '@tanstack/react-table';\n\nimport { Skeleton } from '../../../../Skeleton';\nimport { buildClassnames } from '../../../../../utils';\nimport { usePinnedColumnStyles } from '../../../hooks';\nimport { CellContent } from '../../CellContent';\nimport { theme } from '../../../../../theme';\n\nimport styles from '../BodyCell/BodyCell.module.scss';\n\ntype LoadingBodyCellProps = {\n  /**\n   * The TanStack Table column instance.\n   */\n  column: Column<any, any>;\n};\n\n/**\n * A cell component for the DataGrid that displays a skeleton loader.\n */\nexport const LoadingBodyCell = ({ column }: LoadingBodyCellProps) => {\n  const { justifyContent, textAlign } = column.columnDef.meta!;\n  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({\n    column,\n  });\n\n  const loadingCellClassname = buildClassnames([\n    styles.bodyCell,\n    pinnedCellClassName,\n    'data-grid-cell',\n    'data-grid-cell-loading',\n  ]);\n\n  return (\n    <td\n      className={loadingCellClassname}\n      style={pinnedCellStyles}\n      aria-colindex={column.getIndex() + 1}\n    >\n      <CellContent\n        contentStyle={\n          {\n            justifyContent,\n            textAlign,\n          } as React.CSSProperties\n        }\n      >\n        <Skeleton width=\"75%\" height={theme.sizes[3]} />\n      </CellContent>\n    </td>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;AAkBA;;AAEG;MACU,eAAe,GAAG,CAAC,EAAE,MAAM,EAAwB,KAAI;IAClE,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,SAAS,CAAC,IAAK;AAC5D,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAG,qBAAqB,CAAC;QACtE,MAAM;AACP,KAAA,CAAC;IAEF,MAAM,oBAAoB,GAAG,eAAe,CAAC;AAC3C,QAAA,MAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;QAChB,wBAAwB;AACzB,KAAA,CAAC;AAEF,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,oBAAoB,EAC/B,KAAK,EAAE,gBAAgB,mBACR,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EAAA;QAEpCA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,YAAY,EACV;gBACE,cAAc;gBACd,SAAS;AACa,aAAA,EAAA;AAG1B,YAAAA,cAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAI,CACpC,CACX;AAET;;;;"}
+{"version":3,"file":"LoadingBodyCell.js","sources":["../../../../../../src/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.tsx"],"sourcesContent":["import React from 'react';\nimport { Column } from '@tanstack/react-table';\n\nimport { Skeleton } from '../../../../Skeleton';\nimport { buildClassnames } from '../../../../../utils';\nimport { usePinnedColumnStyles } from '../../../hooks';\nimport { CellContent } from '../../CellContent';\nimport { theme } from '../../../../../theme';\n\nimport styles from '../BodyCell/BodyCell.module.scss';\n\ntype LoadingBodyCellProps = {\n  /**\n   * The TanStack Table column instance.\n   */\n  column: Column<any, any>;\n};\n\n/**\n * A cell component for the DataGrid that displays a skeleton loader.\n */\nexport const LoadingBodyCell = ({ column }: LoadingBodyCellProps) => {\n  const { justifyContent, textAlign } = column.columnDef.meta!;\n  const { pinnedCellClassName, pinnedCellStyles } = usePinnedColumnStyles({\n    column,\n  });\n\n  const loadingCellClassname = buildClassnames([\n    styles.bodyCell,\n    pinnedCellClassName,\n    'data-grid-cell',\n    'data-grid-cell-loading',\n  ]);\n\n  return (\n    <td\n      className={loadingCellClassname}\n      style={pinnedCellStyles}\n      aria-colindex={column.getIndex() + 1}\n    >\n      <CellContent\n        contentStyle={\n          {\n            justifyContent,\n            textAlign,\n          } as React.CSSProperties\n        }\n      >\n        <Skeleton width=\"75%\" height={theme.sizes[3]} />\n      </CellContent>\n    </td>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;AAkBA;;AAEG;MACU,eAAe,GAAG,CAAC,EAAE,MAAM,EAAwB,KAAI;IAClE,MAAM,EAAE,cAAc,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,SAAS,CAAC,IAAK;AAC5D,IAAA,MAAM,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,GAAG,qBAAqB,CAAC;QACtE,MAAM;AACP,KAAA,CAAC;IAEF,MAAM,oBAAoB,GAAG,eAAe,CAAC;AAC3C,QAAA,MAAM,CAAC,QAAQ;QACf,mBAAmB;QACnB,gBAAgB;QAChB,wBAAwB;AACzB,KAAA,CAAC;AAEF,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,oBAAoB,EAC/B,KAAK,EAAE,gBAAgB,mBACR,MAAM,CAAC,QAAQ,EAAE,GAAG,CAAC,EAAA;QAEpCA,cAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,YAAY,EACV;gBACE,cAAc;gBACd,SAAS;AACa,aAAA,EAAA;AAG1B,YAAAA,cAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAI,CACpC,CACX;AAET;;;;"}

package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs

@@ -13,7 +13,6 @@ var usePinnedColumnLayout = require('../../hooks/usePinnedColumnLayout.cjs');
 require('@tanstack/react-table');
 require('../../../Stack/Stack.cjs');
 require('framer-motion');
-require('../../../Tooltip/components/styled.cjs');
 require('../../../Tooltip/components/TooltipPopover.cjs');
 require('react-dom');
 require('../../../Text/Text.cjs');

package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"GridContainer.cjs","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.tsx"],"sourcesContent":["import React, { RefObject, CSSProperties, ReactNode, AriaAttributes } from 'react';\nimport { Table } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\nimport { SizeScale } from 'Theme/modules/sizes';\n\nimport { useScrollPosition } from '../../../../hooks';\nimport { BorderMode } from '../../types/enums';\nimport { AriaRoles } from '../../types';\nimport { buildClassnames } from '../../../../utils/buildClassnames';\n\nimport { Container } from './Container';\n\nimport styles from './GridContainer.module.scss';\nimport { usePinnedColumnLayout } from '../../hooks';\n\ntype GridContainerProps = Pick<AriaAttributes, 'aria-label'> &\n  Pick<React.HTMLAttributes<HTMLTableElement>, 'id' | 'className'> & {\n    /**\n     * Reference to be used for the outer container element.\n     */\n    containerRef?: RefObject<HTMLDivElement>;\n\n    /**\n     * Reference to be used for the table element.\n     */\n    tableRef?: RefObject<HTMLTableElement>;\n\n    /**\n     * Border mode.\n     */\n    borderMode: BorderMode;\n\n    /**\n     * Additional container styles.\n     */\n    containerStyles?: CSSProperties;\n\n    /**\n     * ARIA roles used in the grid.\n     */\n    ariaRoles: AriaRoles;\n\n    /**\n     * Whether resizeable columns are enabled or not.\n     */\n    enableResizeableColumns: boolean;\n\n    /**\n     * Density of the grid.\n     */\n    density: keyof SizeScale;\n\n    /**\n     * The TanStack Table instance.\n     */\n    table: Table<any>;\n\n    /**\n     * Child elements (table contents).\n     */\n    children: ReactNode;\n  };\n\nconst gridContainerClassname = buildClassnames([styles.dataGridStyle, 'data-grid']);\n\n/**\n * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies\n * styling and sets table-specific CSS variables (such as density).\n */\nexport const GridContainer = ({\n  containerRef,\n  tableRef,\n  borderMode,\n  containerStyles,\n  ariaRoles,\n  enableResizeableColumns,\n  density,\n  table,\n  children,\n  id,\n  className,\n  'aria-label': ariaLabel,\n}: GridContainerProps) => {\n  const { pinnedColumnLayoutStyles } = usePinnedColumnLayout({ table });\n  const { scrollPosition, onScroll, enableTransition } = useScrollPosition({ containerRef });\n\n  // CSS variables to control pinned column shadow visibility\n  const hideShadows = !scrollPosition || scrollPosition === 'none';\n  const shadowVisibility = {\n    '--pinned-left-shadow-opacity': hideShadows || scrollPosition === 'start' ? 0 : 1,\n    '--pinned-right-shadow-opacity': hideShadows || scrollPosition === 'end' ? 0 : 1,\n    '--pinned-shadow-transition-duration': enableTransition ? '0.3s' : '0s',\n  };\n\n  return (\n    <Container\n      ref={containerRef}\n      borderMode={borderMode}\n      style={containerStyles}\n      onScroll={onScroll}\n    >\n      <table\n        id={id}\n        ref={tableRef}\n        className={buildClassnames([gridContainerClassname, className])}\n        role={ariaRoles.table}\n        style={\n          {\n            tableLayout: enableResizeableColumns ? 'fixed' : 'auto',\n            '--density': theme.sizes[density],\n            ...pinnedColumnLayoutStyles,\n            ...shadowVisibility,\n          } as CSSProperties\n        }\n        aria-colcount={table.getFlatHeaders().length}\n        aria-rowcount={table.getRowCount()}\n        aria-label={ariaLabel}\n      >\n        {children}\n      </table>\n    </Container>\n  );\n};\n"],"names":["buildClassnames","styles","usePinnedColumnLayout","useScrollPosition","React","Container","theme"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAgEA,MAAM,sBAAsB,GAAGA,+BAAe,CAAC,CAACC,oBAAM,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;AAEnF;;;AAGG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,uBAAuB,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,EAAE,EACF,SAAS,EACT,YAAY,EAAE,SAAS,GACJ,KAAI;IACvB,MAAM,EAAE,wBAAwB,EAAE,GAAGC,2CAAqB,CAAC,EAAE,KAAK,EAAE,CAAC;AACrE,IAAA,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAGC,mCAAiB,CAAC,EAAE,YAAY,EAAE,CAAC;;IAG1F,MAAM,WAAW,GAAG,CAAC,cAAc,IAAI,cAAc,KAAK,MAAM;AAChE,IAAA,MAAM,gBAAgB,GAAG;AACvB,QAAA,8BAA8B,EAAE,WAAW,IAAI,cAAc,KAAK,OAAO,GAAG,CAAC,GAAG,CAAC;AACjF,QAAA,+BAA+B,EAAE,WAAW,IAAI,cAAc,KAAK,KAAK,GAAG,CAAC,GAAG,CAAC;QAChF,qCAAqC,EAAE,gBAAgB,GAAG,MAAM,GAAG,IAAI;KACxE;AAED,IAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,mBAAS,IACR,GAAG,EAAE,YAAY,EACjB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,eAAe,EACtB,QAAQ,EAAE,QAAQ,EAAA;QAElBD,sBAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,QAAQ,EACb,SAAS,EAAEJ,+BAAe,CAAC,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,EAC/D,IAAI,EAAE,SAAS,CAAC,KAAK,EACrB,KAAK,EACH;gBACE,WAAW,EAAE,uBAAuB,GAAG,OAAO,GAAG,MAAM;AACvD,gBAAA,WAAW,EAAEM,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,gBAAA,GAAG,wBAAwB;AAC3B,gBAAA,GAAG,gBAAgB;AACH,aAAA,EAAA,eAAA,EAEL,KAAK,CAAC,cAAc,EAAE,CAAC,MAAM,mBAC7B,KAAK,CAAC,WAAW,EAAE,gBACtB,SAAS,EAAA,EAEpB,QAAQ,CACH,CACE;AAEhB;;;;"}
+{"version":3,"file":"GridContainer.cjs","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.tsx"],"sourcesContent":["import React, { RefObject, CSSProperties, ReactNode, AriaAttributes } from 'react';\nimport { Table } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\nimport { SizeScale } from 'Theme/modules/sizes';\n\nimport { useScrollPosition } from '../../../../hooks';\nimport { BorderMode } from '../../types/enums';\nimport { AriaRoles } from '../../types';\nimport { buildClassnames } from '../../../../utils/buildClassnames';\n\nimport { Container } from './Container';\n\nimport styles from './GridContainer.module.scss';\nimport { usePinnedColumnLayout } from '../../hooks';\n\ntype GridContainerProps = Pick<AriaAttributes, 'aria-label'> &\n  Pick<React.HTMLAttributes<HTMLTableElement>, 'id' | 'className'> & {\n    /**\n     * Reference to be used for the outer container element.\n     */\n    containerRef?: RefObject<HTMLDivElement>;\n\n    /**\n     * Reference to be used for the table element.\n     */\n    tableRef?: RefObject<HTMLTableElement>;\n\n    /**\n     * Border mode.\n     */\n    borderMode: BorderMode;\n\n    /**\n     * Additional container styles.\n     */\n    containerStyles?: CSSProperties;\n\n    /**\n     * ARIA roles used in the grid.\n     */\n    ariaRoles: AriaRoles;\n\n    /**\n     * Whether resizeable columns are enabled or not.\n     */\n    enableResizeableColumns: boolean;\n\n    /**\n     * Density of the grid.\n     */\n    density: keyof SizeScale;\n\n    /**\n     * The TanStack Table instance.\n     */\n    table: Table<any>;\n\n    /**\n     * Child elements (table contents).\n     */\n    children: ReactNode;\n  };\n\nconst gridContainerClassname = buildClassnames([styles.dataGridStyle, 'data-grid']);\n\n/**\n * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies\n * styling and sets table-specific CSS variables (such as density).\n */\nexport const GridContainer = ({\n  containerRef,\n  tableRef,\n  borderMode,\n  containerStyles,\n  ariaRoles,\n  enableResizeableColumns,\n  density,\n  table,\n  children,\n  id,\n  className,\n  'aria-label': ariaLabel,\n}: GridContainerProps) => {\n  const { pinnedColumnLayoutStyles } = usePinnedColumnLayout({ table });\n  const { scrollPosition, onScroll, enableTransition } = useScrollPosition({ containerRef });\n\n  // CSS variables to control pinned column shadow visibility\n  const hideShadows = !scrollPosition || scrollPosition === 'none';\n  const shadowVisibility = {\n    '--pinned-left-shadow-opacity': hideShadows || scrollPosition === 'start' ? 0 : 1,\n    '--pinned-right-shadow-opacity': hideShadows || scrollPosition === 'end' ? 0 : 1,\n    '--pinned-shadow-transition-duration': enableTransition ? '0.3s' : '0s',\n  };\n\n  return (\n    <Container\n      ref={containerRef}\n      borderMode={borderMode}\n      style={containerStyles}\n      onScroll={onScroll}\n    >\n      <table\n        id={id}\n        ref={tableRef}\n        className={buildClassnames([gridContainerClassname, className])}\n        role={ariaRoles.table}\n        style={\n          {\n            tableLayout: enableResizeableColumns ? 'fixed' : 'auto',\n            '--density': theme.sizes[density],\n            ...pinnedColumnLayoutStyles,\n            ...shadowVisibility,\n          } as CSSProperties\n        }\n        aria-colcount={table.getFlatHeaders().length}\n        aria-rowcount={table.getRowCount()}\n        aria-label={ariaLabel}\n      >\n        {children}\n      </table>\n    </Container>\n  );\n};\n"],"names":["buildClassnames","styles","usePinnedColumnLayout","useScrollPosition","React","Container","theme"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAgEA,MAAM,sBAAsB,GAAGA,+BAAe,CAAC,CAACC,oBAAM,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;AAEnF;;;AAGG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,uBAAuB,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,EAAE,EACF,SAAS,EACT,YAAY,EAAE,SAAS,GACJ,KAAI;IACvB,MAAM,EAAE,wBAAwB,EAAE,GAAGC,2CAAqB,CAAC,EAAE,KAAK,EAAE,CAAC;AACrE,IAAA,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAGC,mCAAiB,CAAC,EAAE,YAAY,EAAE,CAAC;;IAG1F,MAAM,WAAW,GAAG,CAAC,cAAc,IAAI,cAAc,KAAK,MAAM;AAChE,IAAA,MAAM,gBAAgB,GAAG;AACvB,QAAA,8BAA8B,EAAE,WAAW,IAAI,cAAc,KAAK,OAAO,GAAG,CAAC,GAAG,CAAC;AACjF,QAAA,+BAA+B,EAAE,WAAW,IAAI,cAAc,KAAK,KAAK,GAAG,CAAC,GAAG,CAAC;QAChF,qCAAqC,EAAE,gBAAgB,GAAG,MAAM,GAAG,IAAI;KACxE;AAED,IAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,mBAAS,IACR,GAAG,EAAE,YAAY,EACjB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,eAAe,EACtB,QAAQ,EAAE,QAAQ,EAAA;QAElBD,sBAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,QAAQ,EACb,SAAS,EAAEJ,+BAAe,CAAC,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,EAC/D,IAAI,EAAE,SAAS,CAAC,KAAK,EACrB,KAAK,EACH;gBACE,WAAW,EAAE,uBAAuB,GAAG,OAAO,GAAG,MAAM;AACvD,gBAAA,WAAW,EAAEM,WAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,gBAAA,GAAG,wBAAwB;AAC3B,gBAAA,GAAG,gBAAgB;AACH,aAAA,EAAA,eAAA,EAEL,KAAK,CAAC,cAAc,EAAE,CAAC,MAAM,mBAC7B,KAAK,CAAC,WAAW,EAAE,gBACtB,SAAS,EAAA,EAEpB,QAAQ,CACH,CACE;AAEhB;;;;"}

package/dist/components/DataGrid/components/GridContainer/GridContainer.js

@@ -11,7 +11,6 @@ import { usePinnedColumnLayout } from '../../hooks/usePinnedColumnLayout.js';
 import '@tanstack/react-table';
 import '../../../Stack/Stack.js';
 import 'framer-motion';
-import '../../../Tooltip/components/styled.js';
 import '../../../Tooltip/components/TooltipPopover.js';
 import 'react-dom';
 import '../../../Text/Text.js';

package/dist/components/DataGrid/components/GridContainer/GridContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"GridContainer.js","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.tsx"],"sourcesContent":["import React, { RefObject, CSSProperties, ReactNode, AriaAttributes } from 'react';\nimport { Table } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\nimport { SizeScale } from 'Theme/modules/sizes';\n\nimport { useScrollPosition } from '../../../../hooks';\nimport { BorderMode } from '../../types/enums';\nimport { AriaRoles } from '../../types';\nimport { buildClassnames } from '../../../../utils/buildClassnames';\n\nimport { Container } from './Container';\n\nimport styles from './GridContainer.module.scss';\nimport { usePinnedColumnLayout } from '../../hooks';\n\ntype GridContainerProps = Pick<AriaAttributes, 'aria-label'> &\n  Pick<React.HTMLAttributes<HTMLTableElement>, 'id' | 'className'> & {\n    /**\n     * Reference to be used for the outer container element.\n     */\n    containerRef?: RefObject<HTMLDivElement>;\n\n    /**\n     * Reference to be used for the table element.\n     */\n    tableRef?: RefObject<HTMLTableElement>;\n\n    /**\n     * Border mode.\n     */\n    borderMode: BorderMode;\n\n    /**\n     * Additional container styles.\n     */\n    containerStyles?: CSSProperties;\n\n    /**\n     * ARIA roles used in the grid.\n     */\n    ariaRoles: AriaRoles;\n\n    /**\n     * Whether resizeable columns are enabled or not.\n     */\n    enableResizeableColumns: boolean;\n\n    /**\n     * Density of the grid.\n     */\n    density: keyof SizeScale;\n\n    /**\n     * The TanStack Table instance.\n     */\n    table: Table<any>;\n\n    /**\n     * Child elements (table contents).\n     */\n    children: ReactNode;\n  };\n\nconst gridContainerClassname = buildClassnames([styles.dataGridStyle, 'data-grid']);\n\n/**\n * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies\n * styling and sets table-specific CSS variables (such as density).\n */\nexport const GridContainer = ({\n  containerRef,\n  tableRef,\n  borderMode,\n  containerStyles,\n  ariaRoles,\n  enableResizeableColumns,\n  density,\n  table,\n  children,\n  id,\n  className,\n  'aria-label': ariaLabel,\n}: GridContainerProps) => {\n  const { pinnedColumnLayoutStyles } = usePinnedColumnLayout({ table });\n  const { scrollPosition, onScroll, enableTransition } = useScrollPosition({ containerRef });\n\n  // CSS variables to control pinned column shadow visibility\n  const hideShadows = !scrollPosition || scrollPosition === 'none';\n  const shadowVisibility = {\n    '--pinned-left-shadow-opacity': hideShadows || scrollPosition === 'start' ? 0 : 1,\n    '--pinned-right-shadow-opacity': hideShadows || scrollPosition === 'end' ? 0 : 1,\n    '--pinned-shadow-transition-duration': enableTransition ? '0.3s' : '0s',\n  };\n\n  return (\n    <Container\n      ref={containerRef}\n      borderMode={borderMode}\n      style={containerStyles}\n      onScroll={onScroll}\n    >\n      <table\n        id={id}\n        ref={tableRef}\n        className={buildClassnames([gridContainerClassname, className])}\n        role={ariaRoles.table}\n        style={\n          {\n            tableLayout: enableResizeableColumns ? 'fixed' : 'auto',\n            '--density': theme.sizes[density],\n            ...pinnedColumnLayoutStyles,\n            ...shadowVisibility,\n          } as CSSProperties\n        }\n        aria-colcount={table.getFlatHeaders().length}\n        aria-rowcount={table.getRowCount()}\n        aria-label={ariaLabel}\n      >\n        {children}\n      </table>\n    </Container>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;AAgEA,MAAM,sBAAsB,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;AAEnF;;;AAGG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,uBAAuB,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,EAAE,EACF,SAAS,EACT,YAAY,EAAE,SAAS,GACJ,KAAI;IACvB,MAAM,EAAE,wBAAwB,EAAE,GAAG,qBAAqB,CAAC,EAAE,KAAK,EAAE,CAAC;AACrE,IAAA,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAG,iBAAiB,CAAC,EAAE,YAAY,EAAE,CAAC;;IAG1F,MAAM,WAAW,GAAG,CAAC,cAAc,IAAI,cAAc,KAAK,MAAM;AAChE,IAAA,MAAM,gBAAgB,GAAG;AACvB,QAAA,8BAA8B,EAAE,WAAW,IAAI,cAAc,KAAK,OAAO,GAAG,CAAC,GAAG,CAAC;AACjF,QAAA,+BAA+B,EAAE,WAAW,IAAI,cAAc,KAAK,KAAK,GAAG,CAAC,GAAG,CAAC;QAChF,qCAAqC,EAAE,gBAAgB,GAAG,MAAM,GAAG,IAAI;KACxE;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,IACR,GAAG,EAAE,YAAY,EACjB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,eAAe,EACtB,QAAQ,EAAE,QAAQ,EAAA;QAElBA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,eAAe,CAAC,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,EAC/D,IAAI,EAAE,SAAS,CAAC,KAAK,EACrB,KAAK,EACH;gBACE,WAAW,EAAE,uBAAuB,GAAG,OAAO,GAAG,MAAM;AACvD,gBAAA,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,gBAAA,GAAG,wBAAwB;AAC3B,gBAAA,GAAG,gBAAgB;AACH,aAAA,EAAA,eAAA,EAEL,KAAK,CAAC,cAAc,EAAE,CAAC,MAAM,mBAC7B,KAAK,CAAC,WAAW,EAAE,gBACtB,SAAS,EAAA,EAEpB,QAAQ,CACH,CACE;AAEhB;;;;"}
+{"version":3,"file":"GridContainer.js","sources":["../../../../../src/components/DataGrid/components/GridContainer/GridContainer.tsx"],"sourcesContent":["import React, { RefObject, CSSProperties, ReactNode, AriaAttributes } from 'react';\nimport { Table } from '@tanstack/react-table';\n\nimport { theme } from 'Theme';\nimport { SizeScale } from 'Theme/modules/sizes';\n\nimport { useScrollPosition } from '../../../../hooks';\nimport { BorderMode } from '../../types/enums';\nimport { AriaRoles } from '../../types';\nimport { buildClassnames } from '../../../../utils/buildClassnames';\n\nimport { Container } from './Container';\n\nimport styles from './GridContainer.module.scss';\nimport { usePinnedColumnLayout } from '../../hooks';\n\ntype GridContainerProps = Pick<AriaAttributes, 'aria-label'> &\n  Pick<React.HTMLAttributes<HTMLTableElement>, 'id' | 'className'> & {\n    /**\n     * Reference to be used for the outer container element.\n     */\n    containerRef?: RefObject<HTMLDivElement>;\n\n    /**\n     * Reference to be used for the table element.\n     */\n    tableRef?: RefObject<HTMLTableElement>;\n\n    /**\n     * Border mode.\n     */\n    borderMode: BorderMode;\n\n    /**\n     * Additional container styles.\n     */\n    containerStyles?: CSSProperties;\n\n    /**\n     * ARIA roles used in the grid.\n     */\n    ariaRoles: AriaRoles;\n\n    /**\n     * Whether resizeable columns are enabled or not.\n     */\n    enableResizeableColumns: boolean;\n\n    /**\n     * Density of the grid.\n     */\n    density: keyof SizeScale;\n\n    /**\n     * The TanStack Table instance.\n     */\n    table: Table<any>;\n\n    /**\n     * Child elements (table contents).\n     */\n    children: ReactNode;\n  };\n\nconst gridContainerClassname = buildClassnames([styles.dataGridStyle, 'data-grid']);\n\n/**\n * The Grid container, which includes a wrapper and the table element itself. Controls table layout, applies\n * styling and sets table-specific CSS variables (such as density).\n */\nexport const GridContainer = ({\n  containerRef,\n  tableRef,\n  borderMode,\n  containerStyles,\n  ariaRoles,\n  enableResizeableColumns,\n  density,\n  table,\n  children,\n  id,\n  className,\n  'aria-label': ariaLabel,\n}: GridContainerProps) => {\n  const { pinnedColumnLayoutStyles } = usePinnedColumnLayout({ table });\n  const { scrollPosition, onScroll, enableTransition } = useScrollPosition({ containerRef });\n\n  // CSS variables to control pinned column shadow visibility\n  const hideShadows = !scrollPosition || scrollPosition === 'none';\n  const shadowVisibility = {\n    '--pinned-left-shadow-opacity': hideShadows || scrollPosition === 'start' ? 0 : 1,\n    '--pinned-right-shadow-opacity': hideShadows || scrollPosition === 'end' ? 0 : 1,\n    '--pinned-shadow-transition-duration': enableTransition ? '0.3s' : '0s',\n  };\n\n  return (\n    <Container\n      ref={containerRef}\n      borderMode={borderMode}\n      style={containerStyles}\n      onScroll={onScroll}\n    >\n      <table\n        id={id}\n        ref={tableRef}\n        className={buildClassnames([gridContainerClassname, className])}\n        role={ariaRoles.table}\n        style={\n          {\n            tableLayout: enableResizeableColumns ? 'fixed' : 'auto',\n            '--density': theme.sizes[density],\n            ...pinnedColumnLayoutStyles,\n            ...shadowVisibility,\n          } as CSSProperties\n        }\n        aria-colcount={table.getFlatHeaders().length}\n        aria-rowcount={table.getRowCount()}\n        aria-label={ariaLabel}\n      >\n        {children}\n      </table>\n    </Container>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;AAgEA,MAAM,sBAAsB,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,aAAa,EAAE,WAAW,CAAC,CAAC;AAEnF;;;AAGG;AACI,MAAM,aAAa,GAAG,CAAC,EAC5B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,eAAe,EACf,SAAS,EACT,uBAAuB,EACvB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,EAAE,EACF,SAAS,EACT,YAAY,EAAE,SAAS,GACJ,KAAI;IACvB,MAAM,EAAE,wBAAwB,EAAE,GAAG,qBAAqB,CAAC,EAAE,KAAK,EAAE,CAAC;AACrE,IAAA,MAAM,EAAE,cAAc,EAAE,QAAQ,EAAE,gBAAgB,EAAE,GAAG,iBAAiB,CAAC,EAAE,YAAY,EAAE,CAAC;;IAG1F,MAAM,WAAW,GAAG,CAAC,cAAc,IAAI,cAAc,KAAK,MAAM;AAChE,IAAA,MAAM,gBAAgB,GAAG;AACvB,QAAA,8BAA8B,EAAE,WAAW,IAAI,cAAc,KAAK,OAAO,GAAG,CAAC,GAAG,CAAC;AACjF,QAAA,+BAA+B,EAAE,WAAW,IAAI,cAAc,KAAK,KAAK,GAAG,CAAC,GAAG,CAAC;QAChF,qCAAqC,EAAE,gBAAgB,GAAG,MAAM,GAAG,IAAI;KACxE;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,IACR,GAAG,EAAE,YAAY,EACjB,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,eAAe,EACtB,QAAQ,EAAE,QAAQ,EAAA;QAElBA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,eAAe,CAAC,CAAC,sBAAsB,EAAE,SAAS,CAAC,CAAC,EAC/D,IAAI,EAAE,SAAS,CAAC,KAAK,EACrB,KAAK,EACH;gBACE,WAAW,EAAE,uBAAuB,GAAG,OAAO,GAAG,MAAM;AACvD,gBAAA,WAAW,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC;AACjC,gBAAA,GAAG,wBAAwB;AAC3B,gBAAA,GAAG,gBAAgB;AACH,aAAA,EAAA,eAAA,EAEL,KAAK,CAAC,cAAc,EAAE,CAAC,MAAM,mBAC7B,KAAK,CAAC,WAAW,EAAE,gBACtB,SAAS,EAAA,EAEpB,QAAQ,CACH,CACE;AAEhB;;;;"}

package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs

@@ -12,7 +12,6 @@ require('../../../../../theme/modules/sizes.cjs');
 require('../../../../../theme/modules/text.cjs');
 require('styled-components');
 require('framer-motion');
-require('../../../../Tooltip/components/styled.cjs');
 require('../../../../Tooltip/components/TooltipPopover.cjs');
 require('react-dom');
 require('../../../../Text/Text.cjs');