@popsure/dirty-swan 0.37.1 → 0.37.2-rc.1

package/dist/cjs/index.js

@@ -13957,6 +13957,7 @@ var TableTrueFalse = function (_a) {
     return (jsxRuntime.jsx("svg", __assign({ width: "12", height: "12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.707 1.707A1 1 0 0010.293.293L6 4.586 1.707.293A1 1 0 00.293 1.707L4.586 6 .293 10.293a1 1 0 101.414 1.414L6 7.414l4.293 4.293a1 1 0 001.414-1.414L7.414 6l4.293-4.293z", fill: "#D2D2D8" }, void 0) }), void 0));
 };
 
+var headerId = 'comparison-table-header';
 var useComparisonTable = function () {
     var _a = require$$0.useState(false), showMore = _a[0], setShowMore = _a[1];
     var _b = require$$0.useState(1400), headerWidth = _b[0], setHeaderWidth = _b[1];
@@ -14035,8 +14036,19 @@ var useComparisonTable = function () {
             return [2 /*return*/];
         });
     }); };
+    require$$0.useEffect(function () {
+        if (headerRef.current) {
+            return;
+        }
+        var headerById = document.getElementById(headerId);
+        console.log('headerById :>> ', headerById);
+        if (headerById) {
+            scrollContainerCallbackRef(headerById);
+        }
+    }, [scrollContainerCallbackRef]);
     return {
         headerWidth: headerWidth,
+        headerId: headerId,
         contentContainerRef: contentContainerRef,
         selectedSection: selectedSection,
         setSelectedSection: setSelectedSection,
@@ -14056,13 +14068,13 @@ styleInject(css_248z$3);
 var ComparisonTable = function (props) {
     var _a;
     var headers = props.headers, data = props.data, hideDetails = props.hideDetails, styles = props.styles, hideScrollBars = props.hideScrollBars, collapsibleSections = props.collapsibleSections, cellWidth = props.cellWidth, firstColumnWidth = props.firstColumnWidth, stickyHeaderTopOffset = props.stickyHeaderTopOffset, growContent = props.growContent;
-    var _b = useComparisonTable(), headerWidth = _b.headerWidth, contentContainerRef = _b.contentContainerRef, selectedSection = _b.selectedSection, setSelectedSection = _b.setSelectedSection, selectedTabIndex = _b.selectedTabIndex, scrollContainerCallbackRef = _b.scrollContainerCallbackRef, handleArrowsClick = _b.handleArrowsClick, toggleMoreRows = _b.toggleMoreRows, showMore = _b.showMore;
+    var _b = useComparisonTable(), headerWidth = _b.headerWidth, contentContainerRef = _b.contentContainerRef, selectedSection = _b.selectedSection, setSelectedSection = _b.setSelectedSection, selectedTabIndex = _b.selectedTabIndex, scrollContainerCallbackRef = _b.scrollContainerCallbackRef, handleArrowsClick = _b.handleArrowsClick, toggleMoreRows = _b.toggleMoreRows, showMore = _b.showMore, headerId = _b.headerId;
     var cssVariablesStyle = __assign(__assign(__assign(__assign({ '--tableWidth': headerWidth + "px" }, (cellWidth ? { '--cellWidth': cellWidth + "px" } : {})), (firstColumnWidth
         ? { '--firstColumnWidth': firstColumnWidth + "px" }
         : {})), (stickyHeaderTopOffset
         ? { '--stickyHeaderTopOffset': stickyHeaderTopOffset + "px" }
         : {})), (growContent ? { '--growContent': '100%' } : {}));
-    return (jsxRuntime.jsx(dist.exports.ScrollSync, __assign({ onSync: scrollContainerCallbackRef }, { children: jsxRuntime.jsxs("div", __assign({ style: cssVariablesStyle }, { children: [jsxRuntime.jsx("div", __assign({ className: classNames(baseStyles.header, styles === null || styles === void 0 ? void 0 : styles.header) }, { children: jsxRuntime.jsx(dist.exports.ScrollSyncPane, { children: jsxRuntime.jsx("div", __assign({ className: classNames(baseStyles.container, (_a = {},
+    return (jsxRuntime.jsx(dist.exports.ScrollSync, __assign({ onSync: scrollContainerCallbackRef }, { children: jsxRuntime.jsxs("div", __assign({ style: cssVariablesStyle }, { children: [jsxRuntime.jsx("div", __assign({ className: classNames(baseStyles.header, styles === null || styles === void 0 ? void 0 : styles.header) }, { children: jsxRuntime.jsx(dist.exports.ScrollSyncPane, { children: jsxRuntime.jsx("div", __assign({ id: headerId, className: classNames(baseStyles.container, (_a = {},
                                 _a[baseStyles.noScrollBars] = hideScrollBars,
                                 _a)) }, { children: jsxRuntime.jsx("div", __assign({ className: classNames(baseStyles['overflow-container']) }, { children: jsxRuntime.jsxs("div", __assign({ className: baseStyles['group-container'] }, { children: [jsxRuntime.jsx(TableArrows, { onClick: handleArrowsClick, active: {
                                                 left: selectedTabIndex > 0,