@widergy/energy-ui 3.172.3 → 3.173.0

package/dist/esm/components/UTTable/components/ActionIcons/constants.js

@@ -1 +1 @@
-export const DEAULT_LOADING_SIZE=24;
+export const DEAULT_LOADING_SIZE = 24;

package/dist/esm/components/UTTable/components/ActionIcons/index.js

@@ -1 +1,101 @@
-function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}import CircularProgress from"@material-ui/core/CircularProgress";import React,{memo,useState,Fragment}from"react";import{isEmpty}from"@widergy/web-utils/lib/array";import{object,string}from"prop-types";import UTIcon from"../../../UTIcon";import UTMenu from"../../../UTMenu";import UTTooltip from"../../../UTTooltip";import{columnType,classesType}from"../../types";import styles from"./styles.module.scss";import{DEAULT_LOADING_SIZE}from"./constants";const ActionIcons=_ref=>{let{classes:classes,column:column,dataTestId:dataTestId,rowData:rowData}=_ref;return React.createElement(Fragment,null,column.actions.map((_ref2,i)=>{let{Icon:Icon,buttonClassName:buttonClassName,disabledIconClassName:disabledIconClassName,disabledTooltip:disabledTooltip,iconClassName:iconClassName,iconName:iconName="",iconProps:iconProps,isDisabled:isDisabled=()=>!1,isLoading:isLoading=()=>!1,isVisible:isVisible=()=>!0,key:key,loadingClassName:loadingClassName,loadingSize:loadingSize=DEAULT_LOADING_SIZE,menuItems:menuItems=[],onClick:onClick,tooltip:tooltip,tooltipProps:tooltipProps={},withMenuDivider:withMenuDivider}=_ref2;const[menuAnchor,setMenuAnchor]=useState(),[menuRowContextData,setMenuRowConextData]=useState(),closeMenu=()=>setMenuAnchor(),handleActionClick=(event,eventRowData)=>{isEmpty(menuItems)?onClick(eventRowData):(setMenuRowConextData({...eventRowData,clickCallback:closeMenu}),(event=>{setMenuAnchor(event.currentTarget)})(event))},visibleMenuItems=menuItems.filter(menuItem=>!menuItem.isVisible||menuItem.isVisible(rowData)).map(menuItem=>({...menuItem,disabled:menuItem.isDisabled&&menuItem.isDisabled(rowData)})),tooltipContent=isDisabled(rowData)&&disabledTooltip?"function"==typeof disabledTooltip?disabledTooltip(rowData):disabledTooltip:tooltip,tippyProps={appendTo:()=>document.body,interactive:!1,...tooltipProps};return isVisible(rowData)&&React.createElement(UTTooltip,{content:tooltipContent,key:key,stringContentClassName:styles.tooltip,stringContentProps:null==tooltipProps?void 0:tooltipProps.stringContentProps,tippyProps:tippyProps},React.createElement("span",null,React.createElement("div",{className:"".concat(styles.iconButton," ").concat(classes.actionIconButton," \n                  ").concat((isDisabled(rowData)||isLoading(rowData))&&styles.disabled," ").concat(buttonClassName),"data-testid":"".concat(dataTestId,".").concat(i),onClick:event=>handleActionClick(event,rowData),role:"button"},isLoading(rowData)?React.createElement(CircularProgress,{className:"".concat(classes.actionLoading," ").concat(loadingClassName),size:loadingSize}):isEmpty(iconName)?React.createElement(Icon,{className:"\n                        ".concat(styles.actionIcon,"\n                        ").concat(classes.actionIcon,"\n                        ").concat(iconClassName,"\n                        ").concat(isDisabled(rowData)&&disabledIconClassName)}):React.createElement(UTIcon,_extends({name:iconName},iconProps,{className:"".concat(iconClassName," ").concat(isDisabled(rowData)?disabledIconClassName:""," ").concat((null==iconProps?void 0:iconProps.className)||"")}))),!!menuAnchor&&!isEmpty(menuItems)&&React.createElement(UTMenu,{anchor:menuAnchor,contextData:menuRowContextData,iconBefore:!0,items:visibleMenuItems,onClose:closeMenu,withDivider:withMenuDivider,withMenuItem:!0})))}))};ActionIcons.propTypes={classes:classesType,column:columnType,rowData:object,dataTestId:string};export default memo(ActionIcons);
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import CircularProgress from '@material-ui/core/CircularProgress';
+import React, { memo, useState, Fragment } from 'react';
+import { isEmpty } from '@widergy/web-utils/lib/array';
+import { object, string } from 'prop-types';
+import UTIcon from '../../../UTIcon';
+import UTMenu from '../../../UTMenu';
+import UTTooltip from '../../../UTTooltip';
+import { columnType, classesType } from '../../types';
+import styles from './styles.module.scss';
+import { DEAULT_LOADING_SIZE } from './constants';
+const ActionIcons = _ref => {
+  let {
+    classes,
+    column,
+    dataTestId,
+    rowData
+  } = _ref;
+  return /*#__PURE__*/React.createElement(Fragment, null, column.actions.map((_ref2, i) => {
+    let {
+      Icon,
+      buttonClassName,
+      disabledIconClassName,
+      disabledTooltip,
+      iconClassName,
+      iconName = '',
+      iconProps,
+      isDisabled = () => false,
+      isLoading = () => false,
+      isVisible = () => true,
+      key,
+      loadingClassName,
+      loadingSize = DEAULT_LOADING_SIZE,
+      menuItems = [],
+      onClick,
+      tooltip,
+      tooltipProps = {},
+      withMenuDivider
+    } = _ref2;
+    const [menuAnchor, setMenuAnchor] = useState();
+    const [menuRowContextData, setMenuRowConextData] = useState();
+    const openMenu = event => setMenuAnchor(event.currentTarget);
+    const closeMenu = () => setMenuAnchor();
+    const handleActionClick = (event, eventRowData) => {
+      if (isEmpty(menuItems)) onClick(eventRowData);else {
+        setMenuRowConextData({
+          ...eventRowData,
+          clickCallback: closeMenu
+        });
+        openMenu(event);
+      }
+    };
+    const visibleMenuItems = menuItems.filter(menuItem => !menuItem.isVisible || menuItem.isVisible(rowData)).map(menuItem => ({
+      ...menuItem,
+      disabled: menuItem.isDisabled && menuItem.isDisabled(rowData)
+    }));
+    const getDisabledTooltip = () => typeof disabledTooltip === 'function' ? disabledTooltip(rowData) : disabledTooltip;
+    const tooltipContent = isDisabled(rowData) && disabledTooltip ? getDisabledTooltip() : tooltip;
+    const tippyProps = {
+      appendTo: () => document.body,
+      interactive: false,
+      ...tooltipProps
+    };
+    return isVisible(rowData) && /*#__PURE__*/React.createElement(UTTooltip, {
+      content: tooltipContent,
+      key: key,
+      stringContentClassName: styles.tooltip,
+      stringContentProps: tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.stringContentProps,
+      tippyProps: tippyProps
+    }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("div", {
+      className: "".concat(styles.iconButton, " ").concat(classes.actionIconButton, " \n                  ").concat((isDisabled(rowData) || isLoading(rowData)) && styles.disabled, " ").concat(buttonClassName),
+      "data-testid": "".concat(dataTestId, ".").concat(i),
+      onClick: event => handleActionClick(event, rowData),
+      role: "button"
+    }, isLoading(rowData) ? /*#__PURE__*/React.createElement(CircularProgress, {
+      className: "".concat(classes.actionLoading, " ").concat(loadingClassName),
+      size: loadingSize
+    }) : isEmpty(iconName) ? /*#__PURE__*/React.createElement(Icon, {
+      className: "\n                        ".concat(styles.actionIcon, "\n                        ").concat(classes.actionIcon, "\n                        ").concat(iconClassName, "\n                        ").concat(isDisabled(rowData) && disabledIconClassName)
+    }) : /*#__PURE__*/React.createElement(UTIcon, _extends({
+      name: iconName
+    }, iconProps, {
+      className: "".concat(iconClassName, " ").concat(isDisabled(rowData) ? disabledIconClassName : '', " ").concat((iconProps === null || iconProps === void 0 ? void 0 : iconProps.className) || '')
+    }))), !!menuAnchor && !isEmpty(menuItems) && /*#__PURE__*/React.createElement(UTMenu, {
+      anchor: menuAnchor,
+      contextData: menuRowContextData,
+      iconBefore: true,
+      items: visibleMenuItems,
+      onClose: closeMenu,
+      withDivider: withMenuDivider,
+      withMenuItem: true
+    })));
+  }));
+};
+ActionIcons.propTypes = {
+  classes: classesType,
+  column: columnType,
+  rowData: object,
+  dataTestId: string
+};
+export default /*#__PURE__*/memo(ActionIcons);

package/dist/esm/components/UTTable/components/Cell/components/ActionButton/index.js

@@ -1 +1,24 @@
-import React,{memo}from"react";import{object}from"prop-types";import{objectIsEmpty}from"@widergy/web-utils/lib/object";import UTButton from"../../../../../UTButton";import{columnType}from"../../../../types";const ActionButton=_ref=>{var _column$actions;let{column:column,rowData:rowData}=_ref;const actionConfig=null===(_column$actions=column.actions)||void 0===_column$actions?void 0:_column$actions[0];return!objectIsEmpty(actionConfig)&&React.createElement(UTButton,{classNames:actionConfig.buttonClassNames,key:actionConfig.key,onClick:()=>actionConfig.onClick(rowData),variant:"text"},actionConfig.text)};ActionButton.propTypes={column:columnType,rowData:object};export default memo(ActionButton);
+import React, { memo } from 'react';
+import { object } from 'prop-types';
+import { objectIsEmpty } from '@widergy/web-utils/lib/object';
+import UTButton from '../../../../../UTButton';
+import { columnType } from '../../../../types';
+const ActionButton = _ref => {
+  var _column$actions;
+  let {
+    column,
+    rowData
+  } = _ref;
+  const actionConfig = (_column$actions = column.actions) === null || _column$actions === void 0 ? void 0 : _column$actions[0];
+  return !objectIsEmpty(actionConfig) && /*#__PURE__*/React.createElement(UTButton, {
+    classNames: actionConfig.buttonClassNames,
+    key: actionConfig.key,
+    onClick: () => actionConfig.onClick(rowData),
+    variant: "text"
+  }, actionConfig.text);
+};
+ActionButton.propTypes = {
+  column: columnType,
+  rowData: object
+};
+export default /*#__PURE__*/memo(ActionButton);

package/dist/esm/components/UTTable/components/Cell/index.js

@@ -1 +1,60 @@
-import React,{memo}from"react";import{object,string}from"prop-types";import ActionIcons from"../ActionIcons";import Status from"../Status";import{CELL_TYPES,COLUMN_POSITION}from"../../constants";import{classesType,columnSizesType,columnType}from"../../types";import ActionButton from"./components/ActionButton";import styles from"./styles.module.scss";const Cell=_ref=>{let{actionDataTestId:actionDataTestId,align:align=COLUMN_POSITION.LEFT,classes:classes,column:column,columnSizes:columnSizes,dataTestId:dataTestId,defaultNullValue:defaultNullValue,rowData:rowData,style:style}=_ref;const cellAlignStyles=column.align?styles["".concat(column.align,"Align")]:[CELL_TYPES.ACTION_ICONS,CELL_TYPES.ACTION_BUTTON].includes(column.type)?styles.centerAlign:styles["".concat(align,"Align")],cellStyle={width:column.withoutPadding?style.paddingLeft+style.paddingRight+columnSizes[column.key]:columnSizes[column.key],...style,paddingBottom:column.withoutPadding?0:style.paddingBottom,paddingLeft:column.withoutPadding?0:style.paddingLeft,paddingRight:column.withoutPadding?0:style.paddingRight,paddingTop:column.withoutPadding?0:style.paddingTop};return React.createElement("div",{className:" ".concat(styles.rowElement," ").concat(cellAlignStyles," ").concat(classes.rowCell),"data-testid":dataTestId,style:cellStyle},column.cellRenderer?column.cellRenderer(rowData[column.key],rowData):column.type===CELL_TYPES.ACTION_BUTTON?React.createElement(ActionButton,{column:column,rowData:rowData}):column.type===CELL_TYPES.ACTION_ICONS?React.createElement(ActionIcons,{classes:classes,column:column,dataTestId:actionDataTestId,rowData:rowData}):column.type===CELL_TYPES.STATUS?React.createElement(Status,{classes:classes,definition:column.status,label:rowData[column.labelKey],value:rowData[column.key]}):React.createElement("span",null,rowData[column.key]||defaultNullValue))};Cell.propTypes={actionDataTestId:string,align:string,classes:classesType,column:columnType,columnSizes:columnSizesType,dataTestId:string,defaultNullValue:string,rowData:object,style:object};export default memo(Cell);
+import React, { memo } from 'react';
+import { object, string } from 'prop-types';
+import ActionIcons from '../ActionIcons';
+import Status from '../Status';
+import { CELL_TYPES, COLUMN_POSITION } from '../../constants';
+import { classesType, columnSizesType, columnType } from '../../types';
+import ActionButton from './components/ActionButton';
+import styles from './styles.module.scss';
+const Cell = _ref => {
+  let {
+    actionDataTestId,
+    align = COLUMN_POSITION.LEFT,
+    classes,
+    column,
+    columnSizes,
+    dataTestId,
+    defaultNullValue,
+    rowData,
+    style
+  } = _ref;
+  const cellAlignStyles = column.align ? styles["".concat(column.align, "Align")] : [CELL_TYPES.ACTION_ICONS, CELL_TYPES.ACTION_BUTTON].includes(column.type) ? styles.centerAlign : styles["".concat(align, "Align")];
+  const cellStyle = {
+    width: column.withoutPadding ? style.paddingLeft + style.paddingRight + columnSizes[column.key] : columnSizes[column.key],
+    ...style,
+    paddingBottom: column.withoutPadding ? 0 : style.paddingBottom,
+    paddingLeft: column.withoutPadding ? 0 : style.paddingLeft,
+    paddingRight: column.withoutPadding ? 0 : style.paddingRight,
+    paddingTop: column.withoutPadding ? 0 : style.paddingTop
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: " ".concat(styles.rowElement, " ").concat(cellAlignStyles, " ").concat(classes.rowCell),
+    "data-testid": dataTestId,
+    style: cellStyle
+  }, column.cellRenderer ? column.cellRenderer(rowData[column.key], rowData) : column.type === CELL_TYPES.ACTION_BUTTON ? /*#__PURE__*/React.createElement(ActionButton, {
+    column: column,
+    rowData: rowData
+  }) : column.type === CELL_TYPES.ACTION_ICONS ? /*#__PURE__*/React.createElement(ActionIcons, {
+    classes: classes,
+    column: column,
+    dataTestId: actionDataTestId,
+    rowData: rowData
+  }) : column.type === CELL_TYPES.STATUS ? /*#__PURE__*/React.createElement(Status, {
+    classes: classes,
+    definition: column.status,
+    label: rowData[column.labelKey],
+    value: rowData[column.key]
+  }) : /*#__PURE__*/React.createElement("span", null, rowData[column.key] || defaultNullValue));
+};
+Cell.propTypes = {
+  actionDataTestId: string,
+  align: string,
+  classes: classesType,
+  column: columnType,
+  columnSizes: columnSizesType,
+  dataTestId: string,
+  defaultNullValue: string,
+  rowData: object,
+  style: object
+};
+export default /*#__PURE__*/memo(Cell);

package/dist/esm/components/UTTable/components/HeaderCell/constants.js

@@ -1 +1,4 @@
-export const ORDER_DIRECTION={ASC:"asc",DESC:"desc"};
+export const ORDER_DIRECTION = {
+  ASC: 'asc',
+  DESC: 'desc'
+};

package/dist/esm/components/UTTable/components/HeaderCell/index.js

@@ -1 +1,60 @@
-import ArrowUpwardIcon from"@material-ui/icons/ArrowUpward";import React,{memo}from"react";import UnfoldMoreIcon from"@material-ui/icons/UnfoldMore";import{bool,func,object,shape,string}from"prop-types";import UTTouchableWithoutFeedback from"../../../UTTouchableWithoutFeedback";import{CELL_ACTION_TYPES,CELL_TYPES,COLUMN_POSITION}from"../../constants";import{classesType,columnSizesType,columnType}from"../../types";import styles from"./styles.module.scss";import{getNewOrder}from"./utils";import{ORDER_DIRECTION}from"./constants";const HeaderCell=_ref=>{let{align:align=COLUMN_POSITION.LEFT,classes:classes,column:column,columnSizes:columnSizes,dataTestId:dataTestId,handleOrder:handleOrder,order:order,removeDefaultOrderIcon:removeDefaultOrderIcon,style:style}=_ref;const OrderICon=order.key!==column.key?UnfoldMoreIcon:ArrowUpwardIcon,cellAlignStyles=column.align?styles["".concat(column.align,"Align")]:[CELL_TYPES.ACTION_ICONS,CELL_TYPES.ACTION_BUTTON].includes(column.type)?styles.centerAlign:styles["".concat(align,"Align")],activeCell=order.key===column.key,isSortable=column.sortable&&!CELL_ACTION_TYPES.includes(column.type);return React.createElement(UTTouchableWithoutFeedback,{className:"\n      ".concat(styles.rowElement,"\n      ").concat(isSortable?classes.headerCellHover:styles.disableClick,"\n      ").concat(cellAlignStyles,"\n      ").concat(classes.headerCell,"\n      ").concat(activeCell?classes.headerActiveCell:classes.headerInactiveCell,"\n      "),dataTestId:dataTestId,onClick:isSortable?()=>handleOrder(getNewOrder(order,column)):null,style:{width:columnSizes[column.key],...style}},React.createElement("div",null,column.categoryName&&React.createElement("div",{className:"".concat(styles.headerCellCategoryName," ").concat(classes.headerCellCategoryName)},column.categoryName),React.createElement("span",{className:styles.headerCellName},column.name),column.unit&&React.createElement("div",{className:"".concat(styles.unit," ").concat(classes.headerCellUnit)},column.unit)),isSortable&&React.createElement(OrderICon,{className:"\n            ".concat(styles.orderIcon,"\n            ").concat(classes.orderIcon,"\n            ").concat(order.key!==column.key&&removeDefaultOrderIcon&&styles.hideIcon,"\n            ").concat(order.direction===ORDER_DIRECTION.DESC&&styles.invertArrow,"\n          ")}))};HeaderCell.propTypes={align:string,classes:classesType,column:columnType,columnSizes:columnSizesType,dataTestId:string,handleOrder:func,order:shape({key:string,direction:string}),removeDefaultOrderIcon:bool,style:object};export default memo(HeaderCell);
+import ArrowUpwardIcon from '@material-ui/icons/ArrowUpward';
+import React, { memo } from 'react';
+import UnfoldMoreIcon from '@material-ui/icons/UnfoldMore';
+import { bool, func, object, shape, string } from 'prop-types';
+import UTTouchableWithoutFeedback from '../../../UTTouchableWithoutFeedback';
+import { CELL_ACTION_TYPES, CELL_TYPES, COLUMN_POSITION } from '../../constants';
+import { classesType, columnSizesType, columnType } from '../../types';
+import styles from './styles.module.scss';
+import { getNewOrder } from './utils';
+import { ORDER_DIRECTION } from './constants';
+const HeaderCell = _ref => {
+  let {
+    align = COLUMN_POSITION.LEFT,
+    classes,
+    column,
+    columnSizes,
+    dataTestId,
+    handleOrder,
+    order,
+    removeDefaultOrderIcon,
+    style
+  } = _ref;
+  const handleClick = () => handleOrder(getNewOrder(order, column));
+  const OrderICon = order.key !== column.key ? UnfoldMoreIcon : ArrowUpwardIcon;
+  const cellAlignStyles = column.align ? styles["".concat(column.align, "Align")] : [CELL_TYPES.ACTION_ICONS, CELL_TYPES.ACTION_BUTTON].includes(column.type) ? styles.centerAlign : styles["".concat(align, "Align")];
+  const activeCell = order.key === column.key;
+  const isSortable = column.sortable && !CELL_ACTION_TYPES.includes(column.type);
+  return /*#__PURE__*/React.createElement(UTTouchableWithoutFeedback, {
+    className: "\n      ".concat(styles.rowElement, "\n      ").concat(isSortable ? classes.headerCellHover : styles.disableClick, "\n      ").concat(cellAlignStyles, "\n      ").concat(classes.headerCell, "\n      ").concat(activeCell ? classes.headerActiveCell : classes.headerInactiveCell, "\n      "),
+    dataTestId: dataTestId,
+    onClick: isSortable ? handleClick : null,
+    style: {
+      width: columnSizes[column.key],
+      ...style
+    }
+  }, /*#__PURE__*/React.createElement("div", null, column.categoryName && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.headerCellCategoryName, " ").concat(classes.headerCellCategoryName)
+  }, column.categoryName), /*#__PURE__*/React.createElement("span", {
+    className: styles.headerCellName
+  }, column.name), column.unit && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.unit, " ").concat(classes.headerCellUnit)
+  }, column.unit)), isSortable && /*#__PURE__*/React.createElement(OrderICon, {
+    className: "\n            ".concat(styles.orderIcon, "\n            ").concat(classes.orderIcon, "\n            ").concat(order.key !== column.key && removeDefaultOrderIcon && styles.hideIcon, "\n            ").concat(order.direction === ORDER_DIRECTION.DESC && styles.invertArrow, "\n          ")
+  }));
+};
+HeaderCell.propTypes = {
+  align: string,
+  classes: classesType,
+  column: columnType,
+  columnSizes: columnSizesType,
+  dataTestId: string,
+  handleOrder: func,
+  order: shape({
+    key: string,
+    direction: string
+  }),
+  removeDefaultOrderIcon: bool,
+  style: object
+};
+export default /*#__PURE__*/memo(HeaderCell);

package/dist/esm/components/UTTable/components/HeaderCell/utils.js

@@ -1 +1,9 @@
-import{ORDER_DIRECTION}from"./constants";export const getNewOrder=(order,column)=>{if(order.key===column.key&&order.direction===ORDER_DIRECTION.DESC)return{};return{direction:order.key===column.key&&order.direction===ORDER_DIRECTION.ASC?ORDER_DIRECTION.DESC:ORDER_DIRECTION.ASC,key:column.key}};
+import { ORDER_DIRECTION } from './constants';
+export const getNewOrder = (order, column) => {
+  if (order.key === column.key && order.direction === ORDER_DIRECTION.DESC) return {};
+  const direction = order.key === column.key && order.direction === ORDER_DIRECTION.ASC ? ORDER_DIRECTION.DESC : ORDER_DIRECTION.ASC;
+  return {
+    direction,
+    key: column.key
+  };
+};

package/dist/esm/components/UTTable/components/PrimaryAction/index.js

@@ -1 +1,37 @@
-import React from"react";import{bool,object,objectOf,string}from"prop-types";import ActionIcons from"../ActionIcons";import UTTouchableWithoutFeedback from"../../../UTTouchableWithoutFeedback";import{columnType}from"../../types";import styles from"./styles.module.scss";const PrimaryAction=_ref=>{let{actionDataTestId:actionDataTestId,classes:classes,column:column,rowData:rowData,showBottomBorder:showBottomBorder}=_ref;const{onClick:onClick}=column;return React.createElement(UTTouchableWithoutFeedback,{className:"".concat(classes.actionCell," ").concat(showBottomBorder?"".concat(styles.lastCellContainer," ").concat(classes.lastCellContainer):styles.cellContainer),onClick:()=>onClick(rowData)},React.createElement("span",{className:styles.columnName}," ",column.name," "),column.actions&&React.createElement(ActionIcons,{classes:classes,column:column,dataTestId:"".concat(actionDataTestId,".primaryAction"),rowData:rowData}))};PrimaryAction.propTypes={actionDataTestId:string,classes:objectOf(string),column:columnType,rowData:object,showBottomBorder:bool};export default PrimaryAction;
+import React from 'react';
+import { bool, object, objectOf, string } from 'prop-types';
+import ActionIcons from '../ActionIcons';
+import UTTouchableWithoutFeedback from '../../../UTTouchableWithoutFeedback';
+import { columnType } from '../../types';
+import styles from './styles.module.scss';
+const PrimaryAction = _ref => {
+  let {
+    actionDataTestId,
+    classes,
+    column,
+    rowData,
+    showBottomBorder
+  } = _ref;
+  const {
+    onClick
+  } = column;
+  return /*#__PURE__*/React.createElement(UTTouchableWithoutFeedback, {
+    className: "".concat(classes.actionCell, " ").concat(showBottomBorder ? "".concat(styles.lastCellContainer, " ").concat(classes.lastCellContainer) : styles.cellContainer),
+    onClick: () => onClick(rowData)
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles.columnName
+  }, " ", column.name, " "), column.actions && /*#__PURE__*/React.createElement(ActionIcons, {
+    classes: classes,
+    column: column,
+    dataTestId: "".concat(actionDataTestId, ".primaryAction"),
+    rowData: rowData
+  }));
+};
+PrimaryAction.propTypes = {
+  actionDataTestId: string,
+  classes: objectOf(string),
+  column: columnType,
+  rowData: object,
+  showBottomBorder: bool
+};
+export default PrimaryAction;

package/dist/esm/components/UTTable/components/ResponsiveCell/index.js

@@ -1 +1,51 @@
-import React,{Fragment}from"react";import{object,bool,string}from"prop-types";import{columnType,classesType}from"../../types";import{COLUMN_SIZES,CELL_TYPES}from"../../constants";import Status from"../Status";import styles from"./styles.module.scss";const ResponsiveCell=_ref=>{let{classes:classes,column:column,dataTestId:dataTestId,defaultNullValue:defaultNullValue,rowData:rowData,rowStyles:rowStyles,showBottomBorder:showBottomBorder}=_ref;const isBigCell=COLUMN_SIZES[column.size]>COLUMN_SIZES.medium||column.cellRenderer&&!column.asRowInResponsive||column.type===CELL_TYPES.STATUS;return React.createElement(Fragment,null,column.categoryName&&React.createElement("span",{className:"".concat(styles.categoryName," ").concat(classes.categoryNameCell),style:{...rowStyles.responsiveCell}},column.categoryName),React.createElement("div",{"data-testid":dataTestId,className:"".concat(showBottomBorder?"".concat(styles.lastCellContainer," ").concat(classes.lastCellContainer):styles.cellContainer," ").concat(classes.responsiveCell," ").concat(isBigCell?styles.bigCell:styles.smallCell),style:{...rowStyles.responsiveCell}},(column.name||column.unit)&&React.createElement("div",{className:"".concat(isBigCell?styles.bigCellInfoContainer:styles.infoContainer," ").concat(classes.responsiveCellTitle)},React.createElement("span",{className:styles.columnName},column.name),React.createElement("span",{className:"".concat(styles.unit," ").concat(classes.headerCellUnit)}," ",column.unit," ")),column.cellRenderer?column.cellRenderer(rowData[column.key],rowData):column.type===CELL_TYPES.STATUS?React.createElement(Status,{classes:classes,definition:column.status,label:rowData[column.labelKey],value:rowData[column.key]}):"string"!=typeof rowData[column.key]?rowData[column.key]||defaultNullValue:React.createElement("span",null,rowData[column.key]||defaultNullValue)))};ResponsiveCell.propTypes={column:columnType,classes:classesType,rowData:object,rowStyles:object,showBottomBorder:bool,defaultNullValue:string,dataTestId:string};export default ResponsiveCell;
+import React, { Fragment } from 'react';
+import { object, bool, string } from 'prop-types';
+import { columnType, classesType } from '../../types';
+import { COLUMN_SIZES, CELL_TYPES } from '../../constants';
+import Status from '../Status';
+import styles from './styles.module.scss';
+const ResponsiveCell = _ref => {
+  let {
+    classes,
+    column,
+    dataTestId,
+    defaultNullValue,
+    rowData,
+    rowStyles,
+    showBottomBorder
+  } = _ref;
+  const isBigCell = COLUMN_SIZES[column.size] > COLUMN_SIZES.medium || column.cellRenderer && !column.asRowInResponsive || column.type === CELL_TYPES.STATUS;
+  return /*#__PURE__*/React.createElement(Fragment, null, column.categoryName && /*#__PURE__*/React.createElement("span", {
+    className: "".concat(styles.categoryName, " ").concat(classes.categoryNameCell),
+    style: {
+      ...rowStyles.responsiveCell
+    }
+  }, column.categoryName), /*#__PURE__*/React.createElement("div", {
+    "data-testid": dataTestId,
+    className: "".concat(showBottomBorder ? "".concat(styles.lastCellContainer, " ").concat(classes.lastCellContainer) : styles.cellContainer, " ").concat(classes.responsiveCell, " ").concat(isBigCell ? styles.bigCell : styles.smallCell),
+    style: {
+      ...rowStyles.responsiveCell
+    }
+  }, (column.name || column.unit) && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(isBigCell ? styles.bigCellInfoContainer : styles.infoContainer, " ").concat(classes.responsiveCellTitle)
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles.columnName
+  }, column.name), /*#__PURE__*/React.createElement("span", {
+    className: "".concat(styles.unit, " ").concat(classes.headerCellUnit)
+  }, " ", column.unit, " ")), column.cellRenderer ? column.cellRenderer(rowData[column.key], rowData) : column.type === CELL_TYPES.STATUS ? /*#__PURE__*/React.createElement(Status, {
+    classes: classes,
+    definition: column.status,
+    label: rowData[column.labelKey],
+    value: rowData[column.key]
+  }) : typeof rowData[column.key] !== 'string' ? rowData[column.key] || defaultNullValue : /*#__PURE__*/React.createElement("span", null, rowData[column.key] || defaultNullValue)));
+};
+ResponsiveCell.propTypes = {
+  column: columnType,
+  classes: classesType,
+  rowData: object,
+  rowStyles: object,
+  showBottomBorder: bool,
+  defaultNullValue: string,
+  dataTestId: string
+};
+export default ResponsiveCell;

package/dist/esm/components/UTTable/components/Status/index.js

@@ -1 +1,38 @@
-import React,{memo}from"react";import{arrayOf,string,shape,oneOfType,bool}from"prop-types";import{stringCompare}from"@widergy/web-utils/lib/string";import styles from"./styles.module.scss";const Status=_ref=>{let{definition:definition,label:label,value:value}=_ref;const isBool="boolean"==typeof value,currentDefinition=(isBool||value)&&definition.find(el=>isBool?el.value===value:el.value&&stringCompare(el.value,value)),{className:className,label:definitionLabel,Icon:Icon,iconClassName:iconClassName,labelClassName:labelClassName}=currentDefinition||{};return currentDefinition&&React.createElement("div",{className:"".concat(styles.statusContainer," ").concat(className)},Icon&&React.createElement(Icon,{className:iconClassName}),React.createElement("span",{className:"".concat(styles.statusLabel," ").concat(labelClassName)},definitionLabel||label||value))};Status.propTypes={definition:arrayOf(shape({value:oneOfType([bool,string]),label:string,backgroundColor:string,textColor:string})),label:string,value:oneOfType([bool,string])};export default memo(Status);
+import React, { memo } from 'react';
+import { arrayOf, string, shape, oneOfType, bool } from 'prop-types';
+import { stringCompare } from '@widergy/web-utils/lib/string';
+import styles from './styles.module.scss';
+const Status = _ref => {
+  let {
+    definition,
+    label,
+    value
+  } = _ref;
+  const isBool = typeof value === 'boolean';
+  const currentDefinition = (isBool || value) && definition.find(el => isBool ? el.value === value : el.value && stringCompare(el.value, value));
+  const {
+    className,
+    label: definitionLabel,
+    Icon,
+    iconClassName,
+    labelClassName
+  } = currentDefinition || {};
+  return currentDefinition && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.statusContainer, " ").concat(className)
+  }, Icon && /*#__PURE__*/React.createElement(Icon, {
+    className: iconClassName
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "".concat(styles.statusLabel, " ").concat(labelClassName)
+  }, definitionLabel || label || value));
+};
+Status.propTypes = {
+  definition: arrayOf(shape({
+    value: oneOfType([bool, string]),
+    label: string,
+    backgroundColor: string,
+    textColor: string
+  })),
+  label: string,
+  value: oneOfType([bool, string])
+};
+export default /*#__PURE__*/memo(Status);

package/dist/esm/components/UTTable/components/TableFooter/components/PageSizeSelector/index.js

@@ -1 +1,53 @@
-import React from"react";import{arrayOf,string,number,func}from"prop-types";import UTSelect from"../../../../../UTSelect";import UTLabel from"../../../../../UTLabel";import{classesType}from"../../../../types";import{getPageSizeOptions}from"./utils";import styles from"./styles.module.scss";const PageSizeSelector=_ref=>{let{classes:classes,dataTestId:dataTestId,options:options,rowsPerPage:rowsPerPage,onChangeRowPerPage:onChangeRowPerPage,label:label,totalRows:totalRows}=_ref;return React.createElement("div",{className:styles.pageSizeSelector},React.createElement("div",{className:styles.selectorContainer},React.createElement(UTSelect,{options:getPageSizeOptions(options,totalRows),dataTestId:dataTestId,labelKey:"label",valueKey:"value",input:{onChange:onChangeRowPerPage,value:rowsPerPage},itemDataTestId:dataTestId?"".concat(dataTestId,".option"):void 0,disableFirstOption:!0,variant:"outlined",selectProps:{className:"".concat(styles.pageSizeSelectContainer," ").concat(classes.pageSizeSelectContainer),classes:{select:classes.pageSizeSelect}}})),React.createElement(UTLabel,{className:"".concat(styles.label," ").concat(classes.totalRowsLabel)},label))};PageSizeSelector.propTypes={classes:classesType,dataTestId:string,options:arrayOf(number),rowsPerPage:number,onChangeRowPerPage:func,label:string,totalRows:number};export default PageSizeSelector;
+import React from 'react';
+import { arrayOf, string, number, func } from 'prop-types';
+import UTSelect from '../../../../../UTSelect';
+import UTLabel from '../../../../../UTLabel';
+import { classesType } from '../../../../types';
+import { getPageSizeOptions } from './utils';
+import styles from './styles.module.scss';
+const PageSizeSelector = _ref => {
+  let {
+    classes,
+    dataTestId,
+    options,
+    rowsPerPage,
+    onChangeRowPerPage,
+    label,
+    totalRows
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.pageSizeSelector
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.selectorContainer
+  }, /*#__PURE__*/React.createElement(UTSelect, {
+    options: getPageSizeOptions(options, totalRows),
+    dataTestId: dataTestId,
+    labelKey: "label",
+    valueKey: "value",
+    input: {
+      onChange: onChangeRowPerPage,
+      value: rowsPerPage
+    },
+    itemDataTestId: dataTestId ? "".concat(dataTestId, ".option") : undefined,
+    disableFirstOption: true,
+    variant: "outlined",
+    selectProps: {
+      className: "".concat(styles.pageSizeSelectContainer, " ").concat(classes.pageSizeSelectContainer),
+      classes: {
+        select: classes.pageSizeSelect
+      }
+    }
+  })), /*#__PURE__*/React.createElement(UTLabel, {
+    className: "".concat(styles.label, " ").concat(classes.totalRowsLabel)
+  }, label));
+};
+PageSizeSelector.propTypes = {
+  classes: classesType,
+  dataTestId: string,
+  options: arrayOf(number),
+  rowsPerPage: number,
+  onChangeRowPerPage: func,
+  label: string,
+  totalRows: number
+};
+export default PageSizeSelector;

package/dist/esm/components/UTTable/components/TableFooter/components/PageSizeSelector/utils.js

@@ -1 +1,13 @@
-import{isEmpty}from"@widergy/web-utils/lib/array";const getPrevOption=(options,index)=>0===index?0:options[index-1];export const getPageSizeOptions=(originalOptions,totalRows)=>{const filteredOptions=originalOptions.filter((_,index)=>getPrevOption(originalOptions,index)<totalRows);return isEmpty(filteredOptions)?[{value:originalOptions[0],label:totalRows}]:filteredOptions.map(value=>({value:value,label:Math.min(value,totalRows)}))};
+import { isEmpty } from '@widergy/web-utils/lib/array';
+const getPrevOption = (options, index) => index === 0 ? 0 : options[index - 1];
+export const getPageSizeOptions = (originalOptions, totalRows) => {
+  const filteredOptions = originalOptions.filter((_, index) => getPrevOption(originalOptions, index) < totalRows);
+  if (isEmpty(filteredOptions)) return [{
+    value: originalOptions[0],
+    label: totalRows
+  }];
+  return filteredOptions.map(value => ({
+    value,
+    label: Math.min(value, totalRows)
+  }));
+};

package/dist/esm/components/UTTable/components/TableFooter/components/Pagination/components/NavigationButton/index.js

@@ -1 +1,32 @@
-import React,{memo}from"react";import{bool,elementType,func,number,oneOfType,string}from"prop-types";import UTTouchableWithoutFeedback from"../../../../../../../UTTouchableWithoutFeedback";import{classesType}from"../../../../../../types";import styles from"./styles.module.scss";const NavigationButton=_ref=>{let{classes:classes,Icon:Icon,label:label,onClick:onClick,className:className,disabled:disabled}=_ref;return React.createElement(UTTouchableWithoutFeedback,{className:"\n      ".concat(className,"\n      ").concat(styles.navigationButton,"\n      ").concat(classes.navigationButton,"\n      ").concat(disabled&&"".concat(styles.buttonDisabled," ").concat(classes.navigationButtonDisabled),"\n    "),onClick:onClick},label&&React.createElement("span",{className:styles.label},label),React.createElement(Icon,{className:classes.navigationArrow}))};NavigationButton.propTypes={classes:classesType,className:string,disabled:bool,Icon:elementType,label:oneOfType([string,number]),onClick:func};export default memo(NavigationButton);
+import React, { memo } from 'react';
+import { bool, elementType, func, number, oneOfType, string } from 'prop-types';
+import UTTouchableWithoutFeedback from '../../../../../../../UTTouchableWithoutFeedback';
+import { classesType } from '../../../../../../types';
+import styles from './styles.module.scss';
+const NavigationButton = _ref => {
+  let {
+    classes,
+    Icon,
+    label,
+    onClick,
+    className,
+    disabled
+  } = _ref;
+  return /*#__PURE__*/React.createElement(UTTouchableWithoutFeedback, {
+    className: "\n      ".concat(className, "\n      ").concat(styles.navigationButton, "\n      ").concat(classes.navigationButton, "\n      ").concat(disabled && "".concat(styles.buttonDisabled, " ").concat(classes.navigationButtonDisabled), "\n    "),
+    onClick: onClick
+  }, label && /*#__PURE__*/React.createElement("span", {
+    className: styles.label
+  }, label), /*#__PURE__*/React.createElement(Icon, {
+    className: classes.navigationArrow
+  }));
+};
+NavigationButton.propTypes = {
+  classes: classesType,
+  className: string,
+  disabled: bool,
+  Icon: elementType,
+  label: oneOfType([string, number]),
+  onClick: func
+};
+export default /*#__PURE__*/memo(NavigationButton);