widenarrow-ui 1.0.39 → 1.0.41

package/lib/index.js

@@ -770,7 +770,7 @@ var Icon$2n = function (_a) {
 
 var Icon$2m = function (_a) {
     var className = _a.className;
-    return (jsxRuntime.jsxs("svg", __assign({ className: className, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24px", height: "24px" }, { children: [jsxRuntime.jsx("title", { children: "tag-plus-outline" }), jsxRuntime.jsx("path", { d: "M6.5 5A1.5 1.5 0 1 0 8 6.5A1.5 1.5 0 0 0 6.5 5M6.5 5A1.5 1.5 0 1 0 8 6.5A1.5 1.5 0 0 0 6.5 5M21.41 11.58L12.41 2.58A2 2 0 0 0 11 2H4A2 2 0 0 0 2 4V11A2 2 0 0 0 2.59 12.42L3 12.82A5.62 5.62 0 0 1 5.08 12.08L4 11V4H11L20 13L13 20L11.92 18.92A5.57 5.57 0 0 1 11.18 21L11.59 21.41A2 2 0 0 0 13 22A2 2 0 0 0 14.41 21.41L21.41 14.41A2 2 0 0 0 22 13A2 2 0 0 0 21.41 11.58M6.5 5A1.5 1.5 0 1 0 8 6.5A1.5 1.5 0 0 0 6.5 5M10 19H7V22H5V19H2V17H5V14H7V17H10Z" })] })));
+    return (jsxRuntime.jsx("svg", __assign({ className: className, xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24px", height: "24px" }, { children: jsxRuntime.jsx("path", { d: "M6.5 5A1.5 1.5 0 1 0 8 6.5A1.5 1.5 0 0 0 6.5 5M6.5 5A1.5 1.5 0 1 0 8 6.5A1.5 1.5 0 0 0 6.5 5M21.41 11.58L12.41 2.58A2 2 0 0 0 11 2H4A2 2 0 0 0 2 4V11A2 2 0 0 0 2.59 12.42L3 12.82A5.62 5.62 0 0 1 5.08 12.08L4 11V4H11L20 13L13 20L11.92 18.92A5.57 5.57 0 0 1 11.18 21L11.59 21.41A2 2 0 0 0 13 22A2 2 0 0 0 14.41 21.41L21.41 14.41A2 2 0 0 0 22 13A2 2 0 0 0 21.41 11.58M6.5 5A1.5 1.5 0 1 0 8 6.5A1.5 1.5 0 0 0 6.5 5M10 19H7V22H5V19H2V17H5V14H7V17H10Z" }) })));
 };
 
 var Icon$2l = function (_a) {
@@ -835,7 +835,7 @@ var Icon$2a = function (_a) {
 
 var Icon$29 = function (_a) {
     var className = _a.className;
-    return (jsxRuntime.jsx("svg", __assign({ className: className, xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24" }, { children: jsxRuntime.jsx("path", { d: "M2.5 2.5H9.16667V9.16667H2.5V2.5ZM10.8333 2.5H17.5V9.16667H10.8333V2.5ZM2.5 10.8333H9.16667V17.5H2.5V10.8333ZM13.3333 10.8333H15V13.3333H17.5V15H15V17.5H13.3333V15H10.8333V13.3333H13.3333V10.8333ZM12.5 4.16667V7.5H15.8333V4.16667H12.5ZM4.16667 4.16667V7.5H7.5V4.16667H4.16667ZM4.16667 12.5V15.8333H7.5V12.5H4.16667Z" }) })));
+    return (jsxRuntime.jsx("svg", __assign({ className: className, xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "-2 -2 24 24" }, { children: jsxRuntime.jsx("path", { d: "M2.5 2.5H9.16667V9.16667H2.5V2.5ZM10.8333 2.5H17.5V9.16667H10.8333V2.5ZM2.5 10.8333H9.16667V17.5H2.5V10.8333ZM13.3333 10.8333H15V13.3333H17.5V15H15V17.5H13.3333V15H10.8333V13.3333H13.3333V10.8333ZM12.5 4.16667V7.5H15.8333V4.16667H12.5ZM4.16667 4.16667V7.5H7.5V4.16667H4.16667ZM4.16667 12.5V15.8333H7.5V12.5H4.16667Z" }) })));
 };
 
 var Icon$28 = function (_a) {
@@ -1335,7 +1335,7 @@ var Icon$C = function (_a) {
 
 var Icon$B = function (_a) {
     var className = _a.className;
-    return (jsxRuntime.jsxs("svg", __assign({ className: className, xmlns: "http://www.w3.org/2000/svg", fill: "none", width: "21px", height: "22px", viewBox: "0 0 24 24" }, { children: [jsxRuntime.jsx("path", { fillRule: "evenodd", d: "M2.087 15.35V16H8v2H0v-2.65c0-1.03.532-2.01 1.45-2.53A13.867 13.867 0 0 1 8 11.004v2.064c-1.88.173-4.088.672-5.485 1.472-.261.15-.428.47-.428.81ZM9.391 11c-.162-.014-.495-.008-.762-.004-.111.002-.21.004-.281.004h-.033H9.39Z", clipRule: "evenodd" }), jsxRuntime.jsx("path", { d: "M8.348 10c2.306 0 4.174-1.79 4.174-4s-1.868-4-4.174-4-4.174 1.79-4.174 4 1.868 4 4.174 4Zm0-6c1.148 0 2.087.9 2.087 2s-.94 2-2.087 2C7.2 8 6.26 7.1 6.26 6S7.2 4 8.348 4ZM22.6 11H11.4c-.77 0-1.393.619-1.393 1.375L10 20.625c0 .756.63 1.375 1.4 1.375h11.2c.77 0 1.4-.619 1.4-1.375v-8.25c0-.756-.63-1.375-1.4-1.375Zm0 2.75L17 17.188l-5.6-3.438v-1.375l5.6 3.438 5.6-3.438v1.375Z" }), jsxRuntime.jsx("path", { fillRule: "evenodd", d: "M12.26 9.598a4.309 4.309 0 0 0 1.827.402c2.306 0 4.174-1.79 4.174-4s-1.868-4-4.174-4c-.655 0-1.275.144-1.826.402 1.39.649 2.348 2.016 2.348 3.598 0 1.582-.958 2.95-2.348 3.598Z", clipRule: "evenodd" })] })));
+    return (jsxRuntime.jsxs("svg", __assign({ className: className, xmlns: "http://www.w3.org/2000/svg", fill: "none", width: "24px", height: "24px", viewBox: "-2 -2 28 26" }, { children: [jsxRuntime.jsx("path", { fillRule: "evenodd", d: "M2.087 15.35V16H8v2H0v-2.65c0-1.03.532-2.01 1.45-2.53A13.867 13.867 0 0 1 8 11.004v2.064c-1.88.173-4.088.672-5.485 1.472-.261.15-.428.47-.428.81ZM9.391 11c-.162-.014-.495-.008-.762-.004-.111.002-.21.004-.281.004h-.033H9.39Z", clipRule: "evenodd" }), jsxRuntime.jsx("path", { d: "M8.348 10c2.306 0 4.174-1.79 4.174-4s-1.868-4-4.174-4-4.174 1.79-4.174 4 1.868 4 4.174 4Zm0-6c1.148 0 2.087.9 2.087 2s-.94 2-2.087 2C7.2 8 6.26 7.1 6.26 6S7.2 4 8.348 4ZM22.6 11H11.4c-.77 0-1.393.619-1.393 1.375L10 20.625c0 .756.63 1.375 1.4 1.375h11.2c.77 0 1.4-.619 1.4-1.375v-8.25c0-.756-.63-1.375-1.4-1.375Zm0 2.75L17 17.188l-5.6-3.438v-1.375l5.6 3.438 5.6-3.438v1.375Z" }), jsxRuntime.jsx("path", { fillRule: "evenodd", d: "M12.26 9.598a4.309 4.309 0 0 0 1.827.402c2.306 0 4.174-1.79 4.174-4s-1.868-4-4.174-4c-.655 0-1.275.144-1.826.402 1.39.649 2.348 2.016 2.348 3.598 0 1.582-.958 2.95-2.348 3.598Z", clipRule: "evenodd" })] })));
 };
 
 var Icon$A = function (_a) {
@@ -2041,7 +2041,7 @@ var styles$j = {"body":"Button-module_AK7AMO","container":"Button-module_0j8mdA"
 var s$j = classNames.bind(styles$j);
 var Button = react.memo(function (_a) {
     var _b, _c;
-    var className = _a.className, id = _a.id, style = _a.style, _d = _a.type, type = _d === void 0 ? exports.HierarchyTypes.PRIMARY : _d, _e = _a.size, size = _e === void 0 ? exports.SizeTypes.MEDIUM : _e, text = _a.text, toolTip = _a.toolTip, icon = _a.icon, iconSize = _a.iconSize, withIconLeft = _a.withIconLeft, rotateIconByDegree = _a.rotateIconByDegree, withEllipsis = _a.withEllipsis, onClickCallback = _a.onClickCallback, loading = _a.loading, disabled = _a.disabled, children = _a.children, autoFocus = _a.autoFocus, ariaLabel = _a.ariaLabel, tabIndex = _a.tabIndex;
+    var className = _a.className, id = _a.id, style = _a.style, _d = _a.type, type = _d === void 0 ? exports.HierarchyTypes.PRIMARY : _d, _e = _a.size, size = _e === void 0 ? exports.SizeTypes.MEDIUM : _e, text = _a.text, toolTip = _a.toolTip, icon = _a.icon, iconSize = _a.iconSize, withIconRight = _a.withIconRight, rotateIconByDegree = _a.rotateIconByDegree, withEllipsis = _a.withEllipsis, onClickCallback = _a.onClickCallback, loading = _a.loading, disabled = _a.disabled, children = _a.children, autoFocus = _a.autoFocus, ariaLabel = _a.ariaLabel, tabIndex = _a.tabIndex;
     var mergedClassNames = s$j('container', (_b = {
             container_primary: type === exports.HierarchyTypes.PRIMARY,
             container_secondary: type === exports.HierarchyTypes.SECONDARY,
@@ -2067,11 +2067,11 @@ var Button = react.memo(function (_a) {
         }
         return jsxRuntime.jsx(Icon, { icon: icon, size: iconSize || exports.SizeTypes.MEDIUM, className: s$j('icon'), rotateIconByDegree: rotateIconByDegree });
     };
-    var getInnerMarkup = function () { return (jsxRuntime.jsxs("div", __assign({ className: s$j('inner') }, { children: [icon && withIconLeft ? jsxRuntime.jsx("div", __assign({ className: s$j('iconContainer') }, { children: getButtonIcon() })) : null, text ? (jsxRuntime.jsx("span", __assign({ className: s$j('text', {
-                    text_withIconLeft: icon && withIconLeft,
-                    text_withIconRight: icon && !withIconLeft,
+    var getInnerMarkup = function () { return (jsxRuntime.jsxs("div", __assign({ className: s$j('inner') }, { children: [icon && !withIconRight ? jsxRuntime.jsx("div", __assign({ className: s$j('iconContainer') }, { children: getButtonIcon() })) : null, text ? (jsxRuntime.jsx("span", __assign({ className: s$j('text', {
+                    text_withIconLeft: icon && !withIconRight,
+                    text_withIconRight: icon && withIconRight,
                     text_withEllipsis: withEllipsis
-                }) }, { children: text }))) : null, icon && !withIconLeft ? jsxRuntime.jsx("div", __assign({ className: s$j('iconContainer') }, { children: getButtonIcon() })) : null] }))); };
+                }) }, { children: text }))) : null, icon && withIconRight ? jsxRuntime.jsx("div", __assign({ className: s$j('iconContainer') }, { children: getButtonIcon() })) : null] }))); };
     var baseAttributes = (_c = {
             className: mergedClassNames,
             id: id,
@@ -2091,26 +2091,27 @@ var Button = react.memo(function (_a) {
     return buttonMarkup;
 });
 
-var styles$i = {"body":"Checkbox-module_et5-hi","container":"Checkbox-module_pUY-sk","container_disabled":"Checkbox-module_R-WdsF","container_withHelperText":"Checkbox-module_LXApNe","container_enabled":"Checkbox-module_gWKAcZ","label":"Checkbox-module_JBaRmp","box":"Checkbox-module_KLUVKO","label_withHelperText":"Checkbox-module_YXNy27","label_isBlocked":"Checkbox-module_iDzbdV","label_withWordWrap":"Checkbox-module_sk8jg7","box_isChecked":"Checkbox-module_bQFvLF","box_isIndeterminate":"Checkbox-module_8QNUb3","box_isDisabled":"Checkbox-module_qbmebz","box_isCheckedAndDisabled":"Checkbox-module_QPcUI7","box_isFake":"Checkbox-module_uNeZ8r","input":"Checkbox-module_-039s6","input_disabled":"Checkbox-module_Nt3GpM","icon":"Checkbox-module_VMxEfA","helperText":"Checkbox-module_mkQr-O"};
+var styles$i = {"body":"Checkbox-module_et5-hi","container":"Checkbox-module_pUY-sk","container_disabled":"Checkbox-module_R-WdsF","container_withHelperText":"Checkbox-module_LXApNe","container_withEllipsis":"Checkbox-module_OMFVzd","container_enabled":"Checkbox-module_gWKAcZ","label":"Checkbox-module_JBaRmp","box":"Checkbox-module_KLUVKO","label_withHelperText":"Checkbox-module_YXNy27","label_isBlocked":"Checkbox-module_iDzbdV","label_withWordWrap":"Checkbox-module_sk8jg7","box_isChecked":"Checkbox-module_bQFvLF","box_isIndeterminate":"Checkbox-module_8QNUb3","box_isDisabled":"Checkbox-module_qbmebz","box_isCheckedAndDisabled":"Checkbox-module_QPcUI7","box_isFake":"Checkbox-module_uNeZ8r","input":"Checkbox-module_-039s6","input_disabled":"Checkbox-module_Nt3GpM","icon":"Checkbox-module_VMxEfA","helperText":"Checkbox-module_mkQr-O"};
 
 var s$i = classNames.bind(styles$i);
 var Checkbox = function (_a) {
     var _b;
-    var name = _a.name, className = _a.className, label = _a.label, helperText = _a.helperText, onChange = _a.onChange, onChangeFake = _a.onChangeFake, wordWrap = _a.wordWrap, checked = _a.checked, blocked = _a.blocked, indeterminate = _a.indeterminate, disabled = _a.disabled, isFake = _a.isFake, ariaLabel = _a.ariaLabel;
+    var name = _a.name, value = _a.value, className = _a.className, label = _a.label, helperText = _a.helperText, onChange = _a.onChange, onChangeFake = _a.onChangeFake, wordWrap = _a.wordWrap, withEllipsis = _a.withEllipsis, checked = _a.checked, blocked = _a.blocked, indeterminate = _a.indeterminate, disabled = _a.disabled, isFake = _a.isFake, ariaLabel = _a.ariaLabel;
     var onClickRealInput = function (event) {
         if (!disabled && onChange) {
-            onChange(event);
+            onChange(value || name || '', event);
         }
     };
     var onClickFakeInput = function (event) {
         if (!disabled && onChangeFake) {
-            onChangeFake(event);
+            onChangeFake(value || name || '', event);
         }
     };
     return (jsxRuntime.jsxs("div", __assign({ className: s$i('container', (_b = {
                 container_enabled: !disabled,
                 container_disabled: disabled,
-                container_withHelperText: helperText
+                container_withHelperText: helperText,
+                container_withEllipsis: withEllipsis
             },
             _b[className] = className,
             _b)) }, { children: [isFake ? (jsxRuntime.jsx("div", __assign({ className: s$i('box', {
@@ -2126,7 +2127,7 @@ var Checkbox = function (_a) {
                             box_isIndeterminate: indeterminate && !checked,
                             box_isDisabled: disabled,
                             box_isCheckedAndDisabled: disabled && checked
-                        }) }, { children: (checked || indeterminate) && jsxRuntime.jsx(Icon, { icon: checked ? exports.IconTypes.CHECK : exports.IconTypes.CHECK_INDETERMINATE, className: s$i('icon') }) }))] })), label && (jsxRuntime.jsxs(Label, __assign({ htmlFor: name, withWordBreak: wordWrap, disabled: disabled, marginBottom: '0', marginTop: '0', className: s$i('label', { label_isBlocked: blocked, label_withWordWrap: wordWrap, label_withHelperText: helperText }) }, { children: [label, helperText ? jsxRuntime.jsx("span", __assign({ className: s$i('helperText') }, { children: helperText })) : null] })))] })));
+                        }) }, { children: (checked || indeterminate) && jsxRuntime.jsx(Icon, { icon: checked ? exports.IconTypes.CHECK : exports.IconTypes.CHECK_INDETERMINATE, className: s$i('icon') }) }))] })), label && (jsxRuntime.jsxs(Label, __assign({ htmlFor: name, withWordBreak: wordWrap, disabled: disabled, withEllipsis: withEllipsis, marginBottom: '0', marginTop: '0', className: s$i('label', { label_isBlocked: blocked, label_withWordWrap: wordWrap, label_withHelperText: helperText }) }, { children: [label, helperText ? jsxRuntime.jsx("span", __assign({ className: s$i('helperText') }, { children: helperText })) : null] })))] })));
 };
 
 var styles$h = {"body":"Image-module_R0tivq","container":"Image-module_dYcZ5E","hoverOverlay":"Image-module_RZIW5V","container_withContainer":"Image-module_KohPWB","backgroundImage":"Image-module_c9gqLs","container_withAspectRatio":"Image-module_1OcRcC","image":"Image-module_1pa50f","ar4_1":"Image-module_BLQniT","ar3_1":"Image-module_qHwkv6","ar21_9":"Image-module_mBTxSg","ar16_9":"Image-module_nBLWjn","ar21_13":"Image-module_gxLQIV","ar4_3":"Image-module_qCRFSM","ar1_1":"Image-module_L0IiPU","backgroundImage_sizeContain":"Image-module_U-PVTF","backgroundImage_positionCenter":"Image-module_rSvAOx","backgroundImage_positionTop":"Image-module_MLdHRI","backgroundImage_positionBottom":"Image-module_4efd0J","lazy-image":"Image-module_cR0QR3","lazyloading":"Image-module_yIpGSs","lazyloaded":"Image-module_DFxhJb","hoverOverlayColor_blue":"Image-module_NsN9mb","hoverOverlayColor_lightBlue":"Image-module_2w0ChB","hoverOverlayColor_yellow":"Image-module_DMLlor","hoverOverlayColor_orange":"Image-module_J3iwe9","hoverOverlayColor_green":"Image-module_Ptd1Ve","hoverOverlayColor_red":"Image-module_RtgY-W","hoverOverlayColor_white":"Image-module_CI4wIF","hoverOverlayColor_grey1":"Image-module_XtlHIJ","hoverOverlayColor_grey2":"Image-module_ZqQzaU","hoverOverlayColor_grey3":"Image-module_cO-8NN","hoverOverlayColor_grey4":"Image-module_UIJSnG","hoverOverlayColor_grey5":"Image-module_-yqLQm","hoverOverlayColor_grey6":"Image-module_DLAtSn","hoverOverlayColor_grey7":"Image-module_l8oZVN","hoverOverlayColor_black":"Image-module_Pva4Sh"};
@@ -2853,7 +2854,7 @@ var MultiActionButton = function (_a) {
     return buttonMarkup;
 };
 
-var styles$2 = {"body":"SortableTable-module_255i6l","container":"SortableTable-module_gOksTd","table":"SortableTable-module_dfN-ML","table_loading":"SortableTable-module_7Xgt8Z","headerButton":"SortableTable-module_AadsXB","spinner":"SortableTable-module_w6cEGh","row":"SortableTable-module_XTdF1B","row_notInView":"SortableTable-module_WrgDHR","row_header":"SortableTable-module_kQXB-F","row_stickyHeader":"SortableTable-module_fot04-","cell":"SortableTable-module_BbzTcK","cell_header":"SortableTable-module_8ypAZw","cell_alignCenter":"SortableTable-module_WyBmBy","cell_alignRight":"SortableTable-module_d3tm0o","cellData":"SortableTable-module_NCWDUf","cellData_withEllipsis":"SortableTable-module_linqtd"};
+var styles$2 = {"body":"SortableTable-module_255i6l","container":"SortableTable-module_gOksTd","container_withMinWidth":"SortableTable-module_zbtuXT","table":"SortableTable-module_dfN-ML","table_loading":"SortableTable-module_7Xgt8Z","headerButton":"SortableTable-module_AadsXB","spinner":"SortableTable-module_w6cEGh","row":"SortableTable-module_XTdF1B","row_notInView":"SortableTable-module_WrgDHR","row_header":"SortableTable-module_kQXB-F","row_stickyHeader":"SortableTable-module_fot04-","cell":"SortableTable-module_BbzTcK","cell_header":"SortableTable-module_8ypAZw","cell_alignCenter":"SortableTable-module_WyBmBy","cell_alignRight":"SortableTable-module_d3tm0o","cellData":"SortableTable-module_NCWDUf","cellData_withEllipsis":"SortableTable-module_linqtd"};
 
 var s$2 = classNames.bind(styles$2);
 var SortableTableRow = function (_a) {
@@ -2867,7 +2868,7 @@ var SortableTableRow = function (_a) {
 };
 var SortableTable = function (_a) {
     var _b, _c;
-    var cells = _a.cells, data = _a.data, _d = _a.sortBy, sortBy = _d === void 0 ? [{ keyName: 'name', ascending: true }] : _d, _e = _a.skeletonRows, skeletonRows = _e === void 0 ? 6 : _e, loading = _a.loading, className = _a.className, headerClassName = _a.headerClassName, rowClassName = _a.rowClassName, withStickyHeader = _a.withStickyHeader, withIntersectionObserver = _a.withIntersectionObserver, onSortCallback = _a.onSortCallback;
+    var cells = _a.cells, data = _a.data, _d = _a.sortBy, sortBy = _d === void 0 ? [{ keyName: 'name', ascending: true }] : _d, _e = _a.skeletonRows, skeletonRows = _e === void 0 ? 6 : _e, loading = _a.loading, className = _a.className, headerClassName = _a.headerClassName, rowClassName = _a.rowClassName, withStickyHeader = _a.withStickyHeader, withIntersectionObserver = _a.withIntersectionObserver, minWidth = _a.minWidth, onSortCallback = _a.onSortCallback;
     var _f = react.useState(!ramda.is(Function, onSortCallback) ? sortBy : []), sortByLocalState = _f[0], setSortByLocalState = _f[1];
     var noData = !loading && isArrayWithContent(data) === false;
     var getTableHeaderCell = function (cell) {
@@ -2939,7 +2940,7 @@ var SortableTable = function (_a) {
         }
         return null;
     };
-    return (jsxRuntime.jsxs("div", __assign({ className: s$2('container', (_b = {}, _b[className] = className, _b)) }, { children: [loading ? jsxRuntime.jsx(SolidSpinner, { className: s$2('spinner'), type: exports.HierarchyTypes.PRIMARY, size: exports.SizeTypes.MEDIUM }) : null, jsxRuntime.jsxs("table", __assign({ className: s$2('table', { table_loading: loading }) }, { children: [jsxRuntime.jsx("thead", { children: jsxRuntime.jsx("tr", __assign({ className: s$2('row', (_c = { row_header: true, row_stickyHeader: withStickyHeader }, _c[headerClassName] = headerClassName, _c)) }, { children: cells.map(function (cell, i) { return (jsxRuntime.jsx("th", __assign({ className: s$2('cell', {
+    return (jsxRuntime.jsxs("div", __assign({ className: s$2('container', (_b = {}, _b[className] = className, _b.container_withMinWidth = !!minWidth, _b)) }, { children: [loading ? jsxRuntime.jsx(SolidSpinner, { className: s$2('spinner'), type: exports.HierarchyTypes.PRIMARY, size: exports.SizeTypes.MEDIUM }) : null, jsxRuntime.jsxs("table", __assign({ className: s$2('table', { table_loading: loading }), style: { minWidth: minWidth || 'auto' } }, { children: [jsxRuntime.jsx("thead", { children: jsxRuntime.jsx("tr", __assign({ className: s$2('row', (_c = { row_header: true, row_stickyHeader: withStickyHeader }, _c[headerClassName] = headerClassName, _c)) }, { children: cells.map(function (cell, i) { return (jsxRuntime.jsx("th", __assign({ className: s$2('cell', {
                                     cell_alignRight: cell.alignRight,
                                     cell_alignCenter: cell.alignCenter,
                                     cell_header: true