@popsure/dirty-swan 0.66.26 → 0.66.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +16 -7
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/lib/components/tabs/Tabs.d.ts +1 -0
- package/dist/esm/components/table/Table.js +9 -1
- package/dist/esm/components/table/Table.js.map +1 -1
- package/dist/esm/components/table/Table.test.js +25 -0
- package/dist/esm/components/table/Table.test.js.map +1 -1
- package/dist/esm/components/table/components/TableCell/ButtonCell/ButtonCell.js +3 -3
- package/dist/esm/components/table/components/TableCell/ButtonCell/ButtonCell.js.map +1 -1
- package/dist/esm/components/table/components/TableCell/TableCell.js +3 -2
- package/dist/esm/components/table/components/TableCell/TableCell.js.map +1 -1
- package/dist/esm/components/tabs/Tabs.js +1 -1
- package/dist/esm/components/tabs/Tabs.js.map +1 -1
- package/dist/esm/lib/components/tabs/Tabs.d.ts +1 -0
- package/package.json +1 -1
- package/src/lib/components/table/Table.test.tsx +43 -0
- package/src/lib/components/table/Table.tsx +9 -1
- package/src/lib/components/table/components/TableCell/ButtonCell/ButtonCell.module.scss +5 -0
- package/src/lib/components/table/components/TableCell/ButtonCell/ButtonCell.tsx +1 -0
- package/src/lib/components/table/components/TableCell/TableCell.module.scss +6 -0
- package/src/lib/components/table/components/TableCell/TableCell.tsx +1 -0
- package/src/lib/components/tabs/Tabs.tsx +2 -0
package/dist/cjs/index.js
CHANGED
|
@@ -22659,8 +22659,8 @@ var Accordion = function (_a) {
|
|
|
22659
22659
|
}) }));
|
|
22660
22660
|
};
|
|
22661
22661
|
|
|
22662
|
-
var css_248z$b = ".TableCell-module_th__2rjCU {\n vertical-align: middle;\n scroll-snap-align: end;\n width: 50%;\n padding: 28px 24px;\n}\n@media (min-width: 34rem) {\n .TableCell-module_th__2rjCU {\n width: auto;\n scroll-snap-align: unset;\n }\n}\n.TableCell-module_thNavigation__qZ2sY {\n width: 100%;\n}\n@media (min-width: 34rem) {\n .TableCell-module_thNavigation__qZ2sY {\n width: auto;\n }\n}\n\n.TableCell-module_navigationTitle__2FiRB {\n padding-left: 0;\n}\n\n.TableCell-module_headerCell__aVTIn {\n vertical-align: top;\n}\n\n.TableCell-module_subtitleCell__1DzfG {\n vertical-align: middle;\n}\n\n.TableCell-module_fixedCell__cL3-m {\n position: sticky;\n left: 0;\n z-index: 2;\n padding-left: 0;\n}\n\n.TableCell-module_selectedColumnTop__1GcJz {\n border-radius: 16px 16px 0 0;\n}\n\n.TableCell-module_selectedColumnBottom__qiMke {\n border-radius: 0 0 16px 16px;\n}\n\n.TableCell-module_fixedCard__2LO8s {\n position: sticky;\n left: 0;\n right: 0;\n z-index: 2;\n width: 100%;\n}";
|
|
22663
|
-
var styles$b = {"th":"TableCell-module_th__2rjCU","thNavigation":"TableCell-module_thNavigation__qZ2sY","navigationTitle":"TableCell-module_navigationTitle__2FiRB","headerCell":"TableCell-module_headerCell__aVTIn","subtitleCell":"TableCell-module_subtitleCell__1DzfG","fixedCell":"TableCell-module_fixedCell__cL3-m","selectedColumnTop":"TableCell-module_selectedColumnTop__1GcJz","selectedColumnBottom":"TableCell-module_selectedColumnBottom__qiMke","fixedCard":"TableCell-module_fixedCard__2LO8s"};
|
|
22662
|
+
var css_248z$b = ".TableCell-module_th__2rjCU {\n vertical-align: middle;\n scroll-snap-align: end;\n width: 50%;\n padding: 28px 24px;\n}\n@media (min-width: 34rem) {\n .TableCell-module_th__2rjCU {\n width: auto;\n scroll-snap-align: unset;\n }\n}\n.TableCell-module_thNavigation__qZ2sY {\n width: 100%;\n}\n@media (min-width: 34rem) {\n .TableCell-module_thNavigation__qZ2sY {\n width: auto;\n }\n}\n\n.TableCell-module_navigationTitle__2FiRB {\n padding-left: 0;\n}\n\n.TableCell-module_headerCell__aVTIn {\n vertical-align: top;\n}\n\n.TableCell-module_subtitleCell__1DzfG {\n vertical-align: middle;\n}\n\n.TableCell-module_fixedCell__cL3-m {\n position: sticky;\n left: 0;\n z-index: 2;\n padding-left: 0;\n}\n\n.TableCell-module_buttonCell__15CRG {\n height: 1px;\n}\n\n.TableCell-module_selectedColumnTop__1GcJz {\n border-radius: 16px 16px 0 0;\n}\n\n.TableCell-module_selectedColumnBottom__qiMke {\n border-radius: 0 0 16px 16px;\n}\n\n.TableCell-module_fixedCard__2LO8s {\n position: sticky;\n left: 0;\n right: 0;\n z-index: 2;\n width: 100%;\n}";
|
|
22663
|
+
var styles$b = {"th":"TableCell-module_th__2rjCU","thNavigation":"TableCell-module_thNavigation__qZ2sY","navigationTitle":"TableCell-module_navigationTitle__2FiRB","headerCell":"TableCell-module_headerCell__aVTIn","subtitleCell":"TableCell-module_subtitleCell__1DzfG","fixedCell":"TableCell-module_fixedCell__cL3-m","buttonCell":"TableCell-module_buttonCell__15CRG","selectedColumnTop":"TableCell-module_selectedColumnTop__1GcJz","selectedColumnBottom":"TableCell-module_selectedColumnBottom__qiMke","fixedCard":"TableCell-module_fixedCard__2LO8s"};
|
|
22664
22664
|
styleInject(css_248z$b);
|
|
22665
22665
|
|
|
22666
22666
|
var css_248z$a = "@media (max-width: 34rem) {\n .BaseCell-module_maxWidth__14Cly {\n max-width: calc(100% - 64px);\n }\n}\n\n.BaseCell-module_icon__1775U {\n margin: 2px;\n}\n\n.BaseCell-module_description__3_kfe {\n word-break: break-word;\n}";
|
|
@@ -22750,14 +22750,14 @@ var CardCell = function (_a) {
|
|
|
22750
22750
|
return (jsxRuntime.jsx("div", { className: "ta-left", children: jsxRuntime.jsx(Card, __assign({ title: title, description: description, density: "medium", icon: renderedIcon, onClick: onClick }, (href && { href: href, as: 'a' }), { actionIcon: null, showActionIcon: false })) }));
|
|
22751
22751
|
};
|
|
22752
22752
|
|
|
22753
|
-
var css_248z$7 = ".ButtonCell-module_buttonCell__x4NNi {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: calc(100% + 40px);\n margin-left: -20px;\n margin-right: -20px;\n padding: 16px 24px;\n border-radius: 12px;\n border: 1px solid #e7e7ed;\n background-color: transparent;\n color: #26262e;\n cursor: pointer;\n transition: border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;\n text-align: left;\n}\n.ButtonCell-module_buttonCell__x4NNi:hover:not(:disabled):not(.ButtonCell-module_selected__22pF_) {\n background-color: #FAF8F5;\n}\n.ButtonCell-module_buttonCell__x4NNi:focus-visible {\n outline: 1px solid #26262e;\n outline-offset: 0;\n}\n@media (max-width: 34rem) {\n .ButtonCell-module_buttonCell__x4NNi {\n pointer-events: none;\n }\n}\n\n.ButtonCell-module_selected__22pF_ {\n border: 1px solid #26262e;\n background-color: #FAF8F5;\n}\n\n.ButtonCell-module_disabled__1TmtK {\n background-color: #f7f7fd;\n cursor: default;\n opacity: 1;\n pointer-events: none;\n}";
|
|
22754
|
-
var styles$7 = {"buttonCell":"ButtonCell-module_buttonCell__x4NNi","selected":"ButtonCell-module_selected__22pF_","disabled":"ButtonCell-module_disabled__1TmtK"};
|
|
22753
|
+
var css_248z$7 = ".ButtonCell-module_wrapper__1H62k {\n height: 100%;\n}\n\n.ButtonCell-module_buttonCell__x4NNi {\n flex: 1;\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: calc(100% + 40px);\n margin-left: -20px;\n margin-right: -20px;\n padding: 16px 24px;\n border-radius: 12px;\n border: 1px solid #e7e7ed;\n background-color: transparent;\n color: #26262e;\n cursor: pointer;\n transition: border-color 0.3s ease-in-out, background-color 0.3s ease-in-out;\n text-align: left;\n}\n.ButtonCell-module_buttonCell__x4NNi:hover:not(:disabled):not(.ButtonCell-module_selected__22pF_) {\n background-color: #FAF8F5;\n}\n.ButtonCell-module_buttonCell__x4NNi:focus-visible {\n outline: 1px solid #26262e;\n outline-offset: 0;\n}\n@media (max-width: 34rem) {\n .ButtonCell-module_buttonCell__x4NNi {\n pointer-events: none;\n }\n}\n\n.ButtonCell-module_selected__22pF_ {\n border: 1px solid #26262e;\n background-color: #FAF8F5;\n}\n\n.ButtonCell-module_disabled__1TmtK {\n background-color: #f7f7fd;\n cursor: default;\n opacity: 1;\n pointer-events: none;\n}";
|
|
22754
|
+
var styles$7 = {"wrapper":"ButtonCell-module_wrapper__1H62k","buttonCell":"ButtonCell-module_buttonCell__x4NNi","selected":"ButtonCell-module_selected__22pF_","disabled":"ButtonCell-module_disabled__1TmtK"};
|
|
22755
22755
|
styleInject(css_248z$7);
|
|
22756
22756
|
|
|
22757
22757
|
var ButtonCell = function (_a) {
|
|
22758
22758
|
var _b;
|
|
22759
22759
|
var isSelected = _a.isSelected, onClick = _a.onClick, buttonCaption = _a.buttonCaption, price = _a.price, disabled = _a.disabled, className = _a.className, dataCy = _a.dataCy, dataTestId = _a.dataTestId;
|
|
22760
|
-
return (jsxRuntime.jsx("div", { className: classNames("w100 d-flex fd-column ai-start jc-center gap8", className), "data-cy": dataCy, "data-testid": dataTestId, children: jsxRuntime.jsxs("button", { className: classNames('w100 wmx5', styles$7.buttonCell, (_b = {},
|
|
22760
|
+
return (jsxRuntime.jsx("div", { className: classNames("w100 d-flex fd-column ai-start jc-center gap8", styles$7.wrapper, className), "data-cy": dataCy, "data-testid": dataTestId, children: jsxRuntime.jsxs("button", { className: classNames('w100 wmx5', styles$7.buttonCell, (_b = {},
|
|
22761
22761
|
_b[styles$7.selected] = isSelected,
|
|
22762
22762
|
_b[styles$7.disabled] = disabled,
|
|
22763
22763
|
_b)), type: "button", onClick: onClick, disabled: disabled, children: [jsxRuntime.jsxs("div", { className: "d-flex fd-column ai-start", children: [jsxRuntime.jsx("span", { className: "p-p fw-bold", children: buttonCaption }), price && jsxRuntime.jsx("span", { className: "p-p", children: price })] }), !disabled && (isSelected ? (jsxRuntime.jsx(CircleSelectedIcon, { size: 16 })) : (jsxRuntime.jsx(CircleUnselectedIcon, { size: 16 })))] }) }));
|
|
@@ -22787,6 +22787,7 @@ var TableCell = React.memo(function (_a) {
|
|
|
22787
22787
|
_b[styles$b.navigationTitle] = isNavigation && isTopLeftCell,
|
|
22788
22788
|
_b[styles$b.fixedCell] = isFirstCellInRow && colSpan < 1,
|
|
22789
22789
|
_b[styles$b.fixedCard] = cellProps.type === 'CARD',
|
|
22790
|
+
_b[styles$b.buttonCell] = cellProps.type === 'BUTTON',
|
|
22790
22791
|
_b[styles$b.selectedColumnTop] = selectedColumnPosition === 'top',
|
|
22791
22792
|
_b[styles$b.selectedColumnBottom] = selectedColumnPosition === 'bottom',
|
|
22792
22793
|
_b)), colSpan: isBelowDesktop && cellProps.type === 'CARD' ? 2 : colSpan, children: [!cellProps.type && (jsxRuntime.jsx(BaseCell, __assign({}, cellProps, { fontVariant: (_c = cellProps.fontVariant) !== null && _c !== void 0 ? _c : (isTopLeftCell ? 'TITLE' : 'NORMAL') }))), cellProps.type === 'CTA' && (jsxRuntime.jsx(CTACell, __assign({}, cellProps, { centered: isNavigation }))), cellProps.type === 'BUTTON' && jsxRuntime.jsx(ButtonCell, __assign({}, cellProps)), cellProps.type === 'CARD' && jsxRuntime.jsx(CardCell, __assign({}, cellProps))] })));
|
|
@@ -23114,7 +23115,7 @@ var Tabs = function (_a) {
|
|
|
23114
23115
|
var _a;
|
|
23115
23116
|
return (jsxRuntime.jsx("button", { ref: setTabRef(index), type: "button", role: "tab", "aria-selected": activeIndex === index, tabIndex: activeIndex === index ? 0 : -1, className: classNames('p-p bg-transparent c-pointer', styles$1.tab, (_a = {},
|
|
23116
23117
|
_a[styles$1.tabActive] = activeIndex === index,
|
|
23117
|
-
_a)), onClick: function () { return onTabChange(index); }, onKeyDown: function (e) { return handleKeyDown(e, index); }, children: tab.label }, tab.id));
|
|
23118
|
+
_a)), onClick: function () { return onTabChange(index); }, onKeyDown: function (e) { return handleKeyDown(e, index); }, "data-testid": tab.dataTestId, children: tab.label }, tab.id));
|
|
23118
23119
|
}) }));
|
|
23119
23120
|
};
|
|
23120
23121
|
|
|
@@ -23122,6 +23123,9 @@ var defaultTextOverrides = {
|
|
|
23122
23123
|
showDetails: 'Show details',
|
|
23123
23124
|
hideDetails: 'Hide details',
|
|
23124
23125
|
};
|
|
23126
|
+
var getCellDataTestId = function (cell) {
|
|
23127
|
+
return cell && 'dataTestId' in cell ? cell.dataTestId : undefined;
|
|
23128
|
+
};
|
|
23125
23129
|
var Table = function (_a) {
|
|
23126
23130
|
var _b, _c, _d, _e, _f;
|
|
23127
23131
|
var cellReplacements = _a.cellReplacements, className = _a.className, collapsibleSections = _a.collapsibleSections, _g = _a.hideColumns, hideColumns = _g === void 0 ? [] : _g, hideDetails = _a.hideDetails, _h = _a.hideRows, hideRows = _h === void 0 ? [] : _h, imageComponent = _a.imageComponent, modalContentRenderer = _a.modalContentRenderer, onModalOpen = _a.onModalOpen, onSelectionChanged = _a.onSelectionChanged, scrollOnOpen = _a.scrollOnOpen, _j = _a.scrollTopOffset, scrollTopOffset = _j === void 0 ? 0 : _j, _k = _a.stickyHeaderTopOffset, stickyHeaderTopOffset = _k === void 0 ? 0 : _k, tableData = _a.tableData, definedTextOverrides = _a.textOverrides, title = _a.title, externalActiveSection = _a.activeSection, _l = _a.hideTableNavigation, hideTableNavigation = _l === void 0 ? false : _l, _m = _a.hideStickyHeader, hideStickyHeader = _m === void 0 ? false : _m, _o = _a.showSelectedColumn, showSelectedColumn = _o === void 0 ? false : _o, _p = _a.mobileNavigationMode, mobileNavigationMode = _p === void 0 ? 'arrows' : _p;
|
|
@@ -23146,6 +23150,7 @@ var Table = function (_a) {
|
|
|
23146
23150
|
var currentActiveSection = headerRow === null || headerRow === void 0 ? void 0 : headerRow[activeSection];
|
|
23147
23151
|
var mobileTabs = useTabs
|
|
23148
23152
|
? (_d = headerRow === null || headerRow === void 0 ? void 0 : headerRow.slice(1).map(function (cell, index) {
|
|
23153
|
+
var _a;
|
|
23149
23154
|
var label = '';
|
|
23150
23155
|
if (!cell.type)
|
|
23151
23156
|
label = String(cell.text || '');
|
|
@@ -23153,7 +23158,11 @@ var Table = function (_a) {
|
|
|
23153
23158
|
label = String(cell.title || '');
|
|
23154
23159
|
else if (cell.type === 'BUTTON')
|
|
23155
23160
|
label = String(cell.buttonCaption || '');
|
|
23156
|
-
|
|
23161
|
+
var replacement = cell.cellId
|
|
23162
|
+
? cellReplacements === null || cellReplacements === void 0 ? void 0 : cellReplacements[cell.cellId]
|
|
23163
|
+
: undefined;
|
|
23164
|
+
var dataTestId = (_a = getCellDataTestId(replacement)) !== null && _a !== void 0 ? _a : getCellDataTestId(cell);
|
|
23165
|
+
return { id: String(index), label: label, dataTestId: dataTestId };
|
|
23157
23166
|
})) !== null && _d !== void 0 ? _d : []
|
|
23158
23167
|
: [];
|
|
23159
23168
|
var currentActiveSectionReplacements = ((currentActiveSection === null || currentActiveSection === void 0 ? void 0 : currentActiveSection.cellId) &&
|