@widergy/energy-ui 3.172.3 → 3.173.0

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

@@ -1 +1,114 @@
-import React from"react";import{func,number,bool}from"prop-types";var NavigateBeforeIcon=function(props){return React.createElement("svg",props,React.createElement("path",{fill:"#FFF",d:"M5.829 14a.998.998 0 0 1-.78-.373l-4.828-6A1 1 0 0 1 .23 6.36l5-6a1 1 0 1 1 1.536 1.28L2.294 7.011l4.315 5.362A1 1 0 0 1 5.828 14",fillRule:"evenodd"}))};NavigateBeforeIcon.defaultProps={width:"7",height:"14",viewBox:"0 0 7 14",xmlns:"http://www.w3.org/2000/svg"};var NavigateNextIcon=function(props){return React.createElement("svg",props,React.createElement("path",{fill:"#FFF",d:"M1 14a1 1 0 0 1-.768-1.64l4.475-5.371L.393 1.627A1 1 0 0 1 1.95.373l4.829 6a1 1 0 0 1-.012 1.267l-5 6A1 1 0 0 1 1 14",fillRule:"evenodd"}))};NavigateNextIcon.defaultProps={width:"7",height:"14",viewBox:"0 0 7 14",xmlns:"http://www.w3.org/2000/svg"};var NavigateHeaderBeforeIcon=function(props){return React.createElement("svg",props,React.createElement("path",{fill:"#FFF",d:"M5.232.36a1 1 0 0 1 1.536 1.28L2.292 7.01l4.315 5.363a1 1 0 0 1-1.558 1.254l-4.828-6A1 1 0 0 1 .232 6.36Zm7 0a1 1 0 0 1 1.537 1.28L9.293 7.011l4.315 5.362a1 1 0 0 1-1.56 1.254l-4.828-6a1 1 0 0 1 .012-1.267Z",fillRule:"evenodd"}))};NavigateHeaderBeforeIcon.defaultProps={width:"14",height:"14",viewBox:"0 0 14 14",xmlns:"http://www.w3.org/2000/svg"};var NavigateHeaderNextIcon=function(props){return React.createElement("svg",props,React.createElement("path",{fill:"#FFF",d:"M7.545.221a1 1 0 0 1 1.406.152l4.828 6a1 1 0 0 1-.01 1.267l-5 6a1 1 0 1 1-1.537-1.28l4.476-5.371-4.316-5.362A1 1 0 0 1 7.545.221Zm-7 0a1 1 0 0 1 1.406.152l4.828 6a1 1 0 0 1-.01 1.267l-5 6a1 1 0 1 1-1.537-1.28l4.475-5.371L.392 1.627A1 1 0 0 1 .545.221Z",fillRule:"evenodd"}))};NavigateHeaderNextIcon.defaultProps={width:"14",height:"14",viewBox:"0 0 14 14",xmlns:"http://www.w3.org/2000/svg"};import UTTouchableWithoutFeedback from"../../../../../UTTouchableWithoutFeedback";import{classesType}from"../../../../types";import{PAGINATION_LIMIT_DOUBLE_ARROWS}from"../../../../constants";import NavigationButton from"./components/NavigationButton";import{getPageNumbers}from"./utils";import styles from"./styles.module.scss";const Pagination=_ref=>{let{classes:classes,currentPage:currentPage,handlePageChange:handlePageChange,rowsPerPage:rowsPerPage,totalRows:totalRows,isResponsive:isResponsive}=_ref;const totalPages=rowsPerPage>=totalRows?1:Math.ceil(totalRows/rowsPerPage),pageList=getPageNumbers(totalPages,currentPage,isResponsive);return React.createElement("div",{className:"".concat(styles.pagination," ").concat(classes.pagination||"")},totalPages>PAGINATION_LIMIT_DOUBLE_ARROWS&&!isResponsive&&React.createElement(NavigationButton,{classes:classes,className:styles.invertNavigationLabel,Icon:NavigateHeaderBeforeIcon,label:"1",disabled:0===currentPage,onClick:()=>handlePageChange(0)}),React.createElement(NavigationButton,{classes:classes,className:styles.firstArrow,Icon:NavigateBeforeIcon,disabled:0===currentPage,onClick:()=>handlePageChange(currentPage-1)}),pageList.map(page=>React.createElement(UTTouchableWithoutFeedback,{key:"page_".concat(page),className:"\n            ".concat(styles.pageButton,"\n            ").concat(classes.pageButton,"\n            ").concat(currentPage===page&&"".concat(styles.buttonDisabled," ").concat(classes.pageButtonSelected),"\n          "),onClick:()=>handlePageChange(page)},page+1)),React.createElement(NavigationButton,{classes:classes,className:styles.lastArrow,Icon:NavigateNextIcon,disabled:currentPage===totalPages-1,onClick:()=>handlePageChange(currentPage+1)}),totalPages>PAGINATION_LIMIT_DOUBLE_ARROWS&&!isResponsive&&React.createElement(NavigationButton,{classes:classes,className:styles.navigationLabel,Icon:NavigateHeaderNextIcon,label:totalPages,disabled:currentPage===totalPages-1,onClick:()=>handlePageChange(totalPages-1)}))};Pagination.propTypes={classes:classesType,currentPage:number,rowsPerPage:number,handlePageChange:func,totalRows:number,isResponsive:bool};export default Pagination;
+import React from 'react';
+import { func, number, bool } from 'prop-types';
+var NavigateBeforeIcon = function NavigateBeforeIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
+    fill: "#FFF",
+    d: "M5.829 14a.998.998 0 0 1-.78-.373l-4.828-6A1 1 0 0 1 .23 6.36l5-6a1 1 0 1 1 1.536 1.28L2.294 7.011l4.315 5.362A1 1 0 0 1 5.828 14",
+    fillRule: "evenodd"
+  }));
+};
+NavigateBeforeIcon.defaultProps = {
+  width: "7",
+  height: "14",
+  viewBox: "0 0 7 14",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+var NavigateNextIcon = function NavigateNextIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
+    fill: "#FFF",
+    d: "M1 14a1 1 0 0 1-.768-1.64l4.475-5.371L.393 1.627A1 1 0 0 1 1.95.373l4.829 6a1 1 0 0 1-.012 1.267l-5 6A1 1 0 0 1 1 14",
+    fillRule: "evenodd"
+  }));
+};
+NavigateNextIcon.defaultProps = {
+  width: "7",
+  height: "14",
+  viewBox: "0 0 7 14",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+var NavigateHeaderBeforeIcon = function NavigateHeaderBeforeIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
+    fill: "#FFF",
+    d: "M5.232.36a1 1 0 0 1 1.536 1.28L2.292 7.01l4.315 5.363a1 1 0 0 1-1.558 1.254l-4.828-6A1 1 0 0 1 .232 6.36Zm7 0a1 1 0 0 1 1.537 1.28L9.293 7.011l4.315 5.362a1 1 0 0 1-1.56 1.254l-4.828-6a1 1 0 0 1 .012-1.267Z",
+    fillRule: "evenodd"
+  }));
+};
+NavigateHeaderBeforeIcon.defaultProps = {
+  width: "14",
+  height: "14",
+  viewBox: "0 0 14 14",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+var NavigateHeaderNextIcon = function NavigateHeaderNextIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
+    fill: "#FFF",
+    d: "M7.545.221a1 1 0 0 1 1.406.152l4.828 6a1 1 0 0 1-.01 1.267l-5 6a1 1 0 1 1-1.537-1.28l4.476-5.371-4.316-5.362A1 1 0 0 1 7.545.221Zm-7 0a1 1 0 0 1 1.406.152l4.828 6a1 1 0 0 1-.01 1.267l-5 6a1 1 0 1 1-1.537-1.28l4.475-5.371L.392 1.627A1 1 0 0 1 .545.221Z",
+    fillRule: "evenodd"
+  }));
+};
+NavigateHeaderNextIcon.defaultProps = {
+  width: "14",
+  height: "14",
+  viewBox: "0 0 14 14",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+import UTTouchableWithoutFeedback from '../../../../../UTTouchableWithoutFeedback';
+import { classesType } from '../../../../types';
+import { PAGINATION_LIMIT_DOUBLE_ARROWS } from '../../../../constants';
+import NavigationButton from './components/NavigationButton';
+import { getPageNumbers } from './utils';
+import styles from './styles.module.scss';
+const Pagination = _ref => {
+  let {
+    classes,
+    currentPage,
+    handlePageChange,
+    rowsPerPage,
+    totalRows,
+    isResponsive
+  } = _ref;
+  const totalPages = rowsPerPage >= totalRows ? 1 : Math.ceil(totalRows / rowsPerPage);
+  const pageList = getPageNumbers(totalPages, currentPage, isResponsive);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.pagination, " ").concat(classes.pagination || '')
+  }, totalPages > PAGINATION_LIMIT_DOUBLE_ARROWS && !isResponsive && /*#__PURE__*/React.createElement(NavigationButton, {
+    classes: classes,
+    className: styles.invertNavigationLabel,
+    Icon: NavigateHeaderBeforeIcon,
+    label: "1",
+    disabled: currentPage === 0,
+    onClick: () => handlePageChange(0)
+  }), /*#__PURE__*/React.createElement(NavigationButton, {
+    classes: classes,
+    className: styles.firstArrow,
+    Icon: NavigateBeforeIcon,
+    disabled: currentPage === 0,
+    onClick: () => handlePageChange(currentPage - 1)
+  }), pageList.map(page => /*#__PURE__*/React.createElement(UTTouchableWithoutFeedback, {
+    key: "page_".concat(page),
+    className: "\n            ".concat(styles.pageButton, "\n            ").concat(classes.pageButton, "\n            ").concat(currentPage === page && "".concat(styles.buttonDisabled, " ").concat(classes.pageButtonSelected), "\n          "),
+    onClick: () => handlePageChange(page)
+  }, page + 1)), /*#__PURE__*/React.createElement(NavigationButton, {
+    classes: classes,
+    className: styles.lastArrow,
+    Icon: NavigateNextIcon,
+    disabled: currentPage === totalPages - 1,
+    onClick: () => handlePageChange(currentPage + 1)
+  }), totalPages > PAGINATION_LIMIT_DOUBLE_ARROWS && !isResponsive && /*#__PURE__*/React.createElement(NavigationButton, {
+    classes: classes,
+    className: styles.navigationLabel,
+    Icon: NavigateHeaderNextIcon,
+    label: totalPages,
+    disabled: currentPage === totalPages - 1,
+    onClick: () => handlePageChange(totalPages - 1)
+  }));
+};
+Pagination.propTypes = {
+  classes: classesType,
+  currentPage: number,
+  rowsPerPage: number,
+  handlePageChange: func,
+  totalRows: number,
+  isResponsive: bool
+};
+export default Pagination;

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

@@ -1 +1,11 @@
-import{MAX_PAGINATION_ITEMS}from"../../../../constants";export const getPageNumbers=(totalPages,currentPage,isResponsive)=>{if(isResponsive)return[currentPage];if(totalPages<=MAX_PAGINATION_ITEMS)return[...Array(totalPages).keys()];const paginationFactor=MAX_PAGINATION_ITEMS/2;if(currentPage<Math.ceil(paginationFactor))return[...Array(MAX_PAGINATION_ITEMS).keys()];if(totalPages-currentPage<paginationFactor)return[...Array(totalPages).keys()].slice(totalPages-MAX_PAGINATION_ITEMS,totalPages);const floorFactor=Math.floor(paginationFactor),ceilFactor=Math.ceil(paginationFactor);return[...Array(currentPage+ceilFactor).keys()].slice(currentPage-floorFactor)};
+import { MAX_PAGINATION_ITEMS } from '../../../../constants';
+export const getPageNumbers = (totalPages, currentPage, isResponsive) => {
+  if (isResponsive) return [currentPage];
+  if (totalPages <= MAX_PAGINATION_ITEMS) return [...Array(totalPages).keys()];
+  const paginationFactor = MAX_PAGINATION_ITEMS / 2;
+  if (currentPage < Math.ceil(paginationFactor)) return [...Array(MAX_PAGINATION_ITEMS).keys()];
+  if (totalPages - currentPage < paginationFactor) return [...Array(totalPages).keys()].slice(totalPages - MAX_PAGINATION_ITEMS, totalPages);
+  const floorFactor = Math.floor(paginationFactor);
+  const ceilFactor = Math.ceil(paginationFactor);
+  return [...Array(currentPage + ceilFactor).keys()].slice(currentPage - floorFactor);
+};

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

@@ -1 +1 @@
-export const PREPOSITION="de";
+export const PREPOSITION = 'de';

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

@@ -1 +1,55 @@
-import React,{memo}from"react";import{arrayOf,number,func,string,bool}from"prop-types";import{classesType}from"../../types";import PageSizeSelector from"./components/PageSizeSelector";import Pagination from"./components/Pagination";import{PREPOSITION}from"./constants";import styles from"./styles.module.scss";const TableFooter=_ref=>{let{classes:classes,page:page,handlePageChange:handlePageChange,onChangeRowPerPage:onChangeRowPerPage,rowsPerPage:rowsPerPage,rowsPerPageOptions:rowsPerPageOptions,hidePageSelector:hidePageSelector=!1,paginatorDataTestId:paginatorDataTestId,totalRows:totalRows,totalRowsLabel:totalRowsLabel,isResponsive:isResponsive}=_ref;return React.createElement("div",{className:styles.tableFooter,"data-testid":paginatorDataTestId},!hidePageSelector&&React.createElement(PageSizeSelector,{classes:classes,options:rowsPerPageOptions,rowsPerPage:rowsPerPage,onChangeRowPerPage:onChangeRowPerPage,totalRows:totalRows,label:"".concat(PREPOSITION," ").concat(totalRows," ").concat(totalRowsLabel),dataTestId:paginatorDataTestId?"".concat(paginatorDataTestId,".pageSizeSelector"):void 0}),React.createElement(Pagination,{classes:classes,currentPage:page,handlePageChange:handlePageChange,rowsPerPage:rowsPerPage,totalRows:totalRows,isResponsive:isResponsive}))};TableFooter.propTypes={classes:classesType,page:number,handlePageChange:func,onChangeRowPerPage:func,rowsPerPage:number,rowsPerPageOptions:arrayOf(number),hidePageSelector:bool,paginatorDataTestId:string,totalRows:number,totalRowsLabel:string,isResponsive:bool};export default memo(TableFooter);
+import React, { memo } from 'react';
+import { arrayOf, number, func, string, bool } from 'prop-types';
+import { classesType } from '../../types';
+import PageSizeSelector from './components/PageSizeSelector';
+import Pagination from './components/Pagination';
+import { PREPOSITION } from './constants';
+import styles from './styles.module.scss';
+const TableFooter = _ref => {
+  let {
+    classes,
+    page,
+    handlePageChange,
+    onChangeRowPerPage,
+    rowsPerPage,
+    rowsPerPageOptions,
+    hidePageSelector = false,
+    paginatorDataTestId,
+    totalRows,
+    totalRowsLabel,
+    isResponsive
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.tableFooter,
+    "data-testid": paginatorDataTestId
+  }, !hidePageSelector && /*#__PURE__*/React.createElement(PageSizeSelector, {
+    classes: classes,
+    options: rowsPerPageOptions,
+    rowsPerPage: rowsPerPage,
+    onChangeRowPerPage: onChangeRowPerPage,
+    totalRows: totalRows,
+    label: "".concat(PREPOSITION, " ").concat(totalRows, " ").concat(totalRowsLabel),
+    dataTestId: paginatorDataTestId ? "".concat(paginatorDataTestId, ".pageSizeSelector") : undefined
+  }), /*#__PURE__*/React.createElement(Pagination, {
+    classes: classes,
+    currentPage: page,
+    handlePageChange: handlePageChange,
+    rowsPerPage: rowsPerPage,
+    totalRows: totalRows,
+    isResponsive: isResponsive
+  }));
+};
+TableFooter.propTypes = {
+  classes: classesType,
+  page: number,
+  handlePageChange: func,
+  onChangeRowPerPage: func,
+  rowsPerPage: number,
+  rowsPerPageOptions: arrayOf(number),
+  hidePageSelector: bool,
+  paginatorDataTestId: string,
+  totalRows: number,
+  totalRowsLabel: string,
+  isResponsive: bool
+};
+export default /*#__PURE__*/memo(TableFooter);

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

@@ -1 +1,19 @@
-import React from"react";import{string}from"prop-types";import V0 from"./versions/V0";import V1 from"./versions/V1";const TableHeader=_ref=>{let{version:version="V0",...props}=_ref;const Component={V0:V0,V1:V1}[version];return React.createElement(Component,props)};TableHeader.propTypes={version:string};export default TableHeader;
+import React from 'react';
+import { string } from 'prop-types';
+import V0 from './versions/V0';
+import V1 from './versions/V1';
+const TableHeader = _ref => {
+  let {
+    version = 'V0',
+    ...props
+  } = _ref;
+  const Component = {
+    V0,
+    V1
+  }[version];
+  return /*#__PURE__*/React.createElement(Component, props);
+};
+TableHeader.propTypes = {
+  version: string
+};
+export default TableHeader;

package/dist/esm/components/UTTable/components/TableHeader/versions/V0/index.js

@@ -1 +1,60 @@
-import React,{memo}from"react";import{func,node,string,bool}from"prop-types";var RefreshIcon=function(props){return React.createElement("svg",props,React.createElement("path",{fill:"#FF6026",d:"M17.303 10.426a1.001 1.001 0 0 0-1.256.65C15.11 14.022 12.352 16 9.184 16 5.222 16 2 12.86 2 9s3.222-7 7.184-7c1.728 0 3.358.602 4.645 1.67l-2.166-.357a.99.99 0 0 0-1.15.823.999.999 0 0 0 .824 1.149l4.246.702a1.025 1.025 0 0 0 .507-.048c.037-.014.067-.04.103-.06.066-.033.135-.063.192-.111.036-.03.06-.071.09-.105.047-.05.097-.096.132-.156.025-.043.035-.094.054-.142.024-.06.056-.114.068-.18l.754-4a1 1 0 1 0-1.966-.37l-.272 1.44A9.23 9.23 0 0 0 9.185 0C4.12 0 0 4.037 0 9s4.12 9 9.184 9c4.042 0 7.566-2.54 8.77-6.318a1.001 1.001 0 0 0-.65-1.256",fillRule:"evenodd"}))};RefreshIcon.defaultProps={width:"18",height:"18",viewBox:"0 0 18 18",xmlns:"http://www.w3.org/2000/svg"};import UTButton from"../../../../../UTButton";import UTLabel from"../../../../../UTLabel";import{classesType}from"../../../../types";import{TEST_IDS}from"../../../../../../constants/testIds";import styles from"./styles.module.scss";const{table:table}=TEST_IDS,TableHeader=_ref=>{let{classes:classes,disabled:disabled,GeneralActions:GeneralActions,onReload:onReload,title:title,titleDataTestId:titleDataTestId}=_ref;return React.createElement("div",{className:"".concat(styles.header," ").concat(classes.headerContainer)},React.createElement("div",{className:styles.titleContainer},React.createElement(UTLabel,{className:classes.tableTitle,dataTestId:null!=titleDataTestId?titleDataTestId:table.tableHeader.title,variant:"subtitle1",weight:"medium"},title),onReload&&React.createElement(UTButton,{classNames:{icon:"".concat(styles.reloadIcon," ").concat(classes.reloadIcon),root:"".concat(classes.reloadButton," ").concat(disabled&&classes.reloadButtonDisabled)},Icon:RefreshIcon,onClick:onReload,variant:"text"})),GeneralActions)};TableHeader.propTypes={classes:classesType,disabled:bool,GeneralActions:node,onReload:func,title:string,titleDataTestId:string};export default memo(TableHeader);
+import React, { memo } from 'react';
+import { func, node, string, bool } from 'prop-types';
+var RefreshIcon = function RefreshIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("path", {
+    fill: "#FF6026",
+    d: "M17.303 10.426a1.001 1.001 0 0 0-1.256.65C15.11 14.022 12.352 16 9.184 16 5.222 16 2 12.86 2 9s3.222-7 7.184-7c1.728 0 3.358.602 4.645 1.67l-2.166-.357a.99.99 0 0 0-1.15.823.999.999 0 0 0 .824 1.149l4.246.702a1.025 1.025 0 0 0 .507-.048c.037-.014.067-.04.103-.06.066-.033.135-.063.192-.111.036-.03.06-.071.09-.105.047-.05.097-.096.132-.156.025-.043.035-.094.054-.142.024-.06.056-.114.068-.18l.754-4a1 1 0 1 0-1.966-.37l-.272 1.44A9.23 9.23 0 0 0 9.185 0C4.12 0 0 4.037 0 9s4.12 9 9.184 9c4.042 0 7.566-2.54 8.77-6.318a1.001 1.001 0 0 0-.65-1.256",
+    fillRule: "evenodd"
+  }));
+};
+RefreshIcon.defaultProps = {
+  width: "18",
+  height: "18",
+  viewBox: "0 0 18 18",
+  xmlns: "http://www.w3.org/2000/svg"
+};
+import UTButton from '../../../../../UTButton';
+import UTLabel from '../../../../../UTLabel';
+import { classesType } from '../../../../types';
+import { TEST_IDS } from '../../../../../../constants/testIds';
+import styles from './styles.module.scss';
+const {
+  table
+} = TEST_IDS;
+const TableHeader = _ref => {
+  let {
+    classes,
+    disabled,
+    GeneralActions,
+    onReload,
+    title,
+    titleDataTestId
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.header, " ").concat(classes.headerContainer)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.titleContainer
+  }, /*#__PURE__*/React.createElement(UTLabel, {
+    className: classes.tableTitle,
+    dataTestId: titleDataTestId !== null && titleDataTestId !== void 0 ? titleDataTestId : table.tableHeader.title,
+    variant: "subtitle1",
+    weight: "medium"
+  }, title), onReload && /*#__PURE__*/React.createElement(UTButton, {
+    classNames: {
+      icon: "".concat(styles.reloadIcon, " ").concat(classes.reloadIcon),
+      root: "".concat(classes.reloadButton, " ").concat(disabled && classes.reloadButtonDisabled)
+    },
+    Icon: RefreshIcon,
+    onClick: onReload,
+    variant: "text"
+  })), GeneralActions);
+};
+TableHeader.propTypes = {
+  classes: classesType,
+  disabled: bool,
+  GeneralActions: node,
+  onReload: func,
+  title: string,
+  titleDataTestId: string
+};
+export default /*#__PURE__*/memo(TableHeader);

package/dist/esm/components/UTTable/components/TableHeader/versions/V1/ActionsMobile.js

@@ -1 +1,78 @@
-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 isEmpty from"lodash/isEmpty";import partition from"lodash/partition";import React from"react";import{arrayOf,bool,func,object,objectOf,shape,string}from"prop-types";import UTButton from"../../../../../UTButton";import UTMenu from"../../../../../UTMenu";import UTTooltip from"../../../../../UTTooltip";import styles from"./styles.module.scss";import{getMenuItems}from"./utils";const ActionsMobile=_ref=>{var _classes$wrapperHeade;let{actions:actions,anchor:anchor,classes:classes,closeMenu:closeMenu,menuButtonRef:menuButtonRef,openMenu:openMenu,tableHeaderDataTestId:tableHeaderDataTestId}=_ref;const[primaryActions,secondaryActions]=partition(actions,_ref2=>{let{isPrimary:isPrimary}=_ref2;return isPrimary});return React.createElement(React.Fragment,null,!isEmpty(secondaryActions)&&React.createElement(React.Fragment,null,React.createElement("div",{ref:menuButtonRef},React.createElement(UTButton,{dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".dotMenuButton"):"",Icon:"IconDots",onClick:openMenu,variant:"text"})),React.createElement(UTMenu,{anchor:anchor,classNames:{menuItemContainer:"".concat(styles.wrapperHeaderMenuItem," ").concat(null!==(_classes$wrapperHeade=classes.wrapperHeaderMenuItem)&&void 0!==_classes$wrapperHeade?_classes$wrapperHeade:"")},dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".dotMenu"):"",iconBefore:!0,items:getMenuItems(secondaryActions,closeMenu),onClose:closeMenu,onOpen:openMenu,popperProps:{disablePortal:!0}})),primaryActions.map(actionConfig=>actionConfig.tooltip?React.createElement(UTTooltip,_extends({key:actionConfig.dataTestId||String(actionConfig.children),className:actionConfig.tooltipClassName,content:actionConfig.tooltip,tippyProps:{arrow:!1,placement:"top"}},actionConfig.tooltipProps),React.createElement("div",null,React.createElement(UTButton,_extends({hideTextOnResponsive:!0},actionConfig)))):React.createElement(UTButton,_extends({key:actionConfig.dataTestId||String(actionConfig.children),dataTestId:actionConfig.dataTestId,hideTextOnResponsive:!0},actionConfig))))};ActionsMobile.propTypes={actions:arrayOf(shape({children:string,dataTestId:string,isPrimary:bool,tooltip:string})),anchor:object,classes:objectOf(string),closeMenu:func,menuButtonRef:object,openMenu:func,tableHeaderDataTestId:string};export default ActionsMobile;
+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 isEmpty from 'lodash/isEmpty';
+import partition from 'lodash/partition';
+import React from 'react';
+import { arrayOf, bool, func, object, objectOf, shape, string } from 'prop-types';
+import UTButton from '../../../../../UTButton';
+import UTMenu from '../../../../../UTMenu';
+import UTTooltip from '../../../../../UTTooltip';
+import styles from './styles.module.scss';
+import { getMenuItems } from './utils';
+const ActionsMobile = _ref => {
+  var _classes$wrapperHeade;
+  let {
+    actions,
+    anchor,
+    classes,
+    closeMenu,
+    menuButtonRef,
+    openMenu,
+    tableHeaderDataTestId
+  } = _ref;
+  const [primaryActions, secondaryActions] = partition(actions, _ref2 => {
+    let {
+      isPrimary
+    } = _ref2;
+    return isPrimary;
+  });
+  return /*#__PURE__*/React.createElement(React.Fragment, null, !isEmpty(secondaryActions) && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    ref: menuButtonRef
+  }, /*#__PURE__*/React.createElement(UTButton, {
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".dotMenuButton") : '',
+    Icon: "IconDots",
+    onClick: openMenu,
+    variant: "text"
+  })), /*#__PURE__*/React.createElement(UTMenu, {
+    anchor: anchor,
+    classNames: {
+      menuItemContainer: "".concat(styles.wrapperHeaderMenuItem, " ").concat((_classes$wrapperHeade = classes.wrapperHeaderMenuItem) !== null && _classes$wrapperHeade !== void 0 ? _classes$wrapperHeade : '')
+    },
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".dotMenu") : '',
+    iconBefore: true,
+    items: getMenuItems(secondaryActions, closeMenu),
+    onClose: closeMenu,
+    onOpen: openMenu,
+    popperProps: {
+      disablePortal: true
+    }
+  })), primaryActions.map(actionConfig => actionConfig.tooltip ? /*#__PURE__*/React.createElement(UTTooltip, _extends({
+    key: actionConfig.dataTestId || String(actionConfig.children),
+    className: actionConfig.tooltipClassName,
+    content: actionConfig.tooltip,
+    tippyProps: {
+      arrow: false,
+      placement: 'top'
+    }
+  }, actionConfig.tooltipProps), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(UTButton, _extends({
+    hideTextOnResponsive: true
+  }, actionConfig)))) : /*#__PURE__*/React.createElement(UTButton, _extends({
+    key: actionConfig.dataTestId || String(actionConfig.children),
+    dataTestId: actionConfig.dataTestId,
+    hideTextOnResponsive: true
+  }, actionConfig))));
+};
+ActionsMobile.propTypes = {
+  actions: arrayOf(shape({
+    children: string,
+    dataTestId: string,
+    isPrimary: bool,
+    tooltip: string
+  })),
+  anchor: object,
+  classes: objectOf(string),
+  closeMenu: func,
+  menuButtonRef: object,
+  openMenu: func,
+  tableHeaderDataTestId: string
+};
+export default ActionsMobile;

package/dist/esm/components/UTTable/components/TableHeader/versions/V1/index.js

@@ -1 +1,173 @@
-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 isEmpty from"lodash/isEmpty";import React,{Fragment,useEffect,useState}from"react";import{arrayOf,bool,elementType,func,number,objectOf,oneOfType,shape,string}from"prop-types";import UTButton from"../../../../../UTButton";import UTLabel from"../../../../../UTLabel";import UTTooltip from"../../../../../UTTooltip";import useScrollBasedMenu from"../../../../../../utils/hooks/use-scroll-based-menu";import{classesType}from"../../../../types";import ActionsMobile from"./ActionsMobile";import styles from"./styles.module.scss";import{reloadWindow}from"./utils";const TableHeader=_ref=>{var _classes$wrapperHeade,_classes$textElements,_classes$titleAndDesc,_classes$selectedLabe,_classes$refreshAndAc;let{actions:actions,automaticRefreshDelay:automaticRefreshDelay,classes:classes,description:description,isDesktop:isDesktop,isMobile:isMobile,loading:loading,onRefresh:onRefresh=reloadWindow,ongoingRefreshLabel:ongoingRefreshLabel,refreshLabel:refreshLabel,selectedLabel:selectedLabel,tableHeaderDataTestId:tableHeaderDataTestId,title:title,withAutomaticRefresh:withAutomaticRefresh,withRefresh:withRefresh}=_ref;const{anchor:anchor,closeMenu:closeMenu,openMenu:openMenu,ref:menuButtonRef}=useScrollBasedMenu(),[latestRefresh,setLatestRefresh]=useState(new Date),handleRefresh=()=>{onRefresh()};return useEffect(()=>{loading||setLatestRefresh(new Date)},[loading]),useEffect(()=>{let automaticRefreshTimeOut;return withAutomaticRefresh&&(automaticRefreshTimeOut=setTimeout(()=>{closeMenu(),handleRefresh()},automaticRefreshDelay)),()=>clearTimeout(automaticRefreshTimeOut)},[latestRefresh]),React.createElement("section",{className:"".concat(styles.wrapperHeader," ").concat(null!==(_classes$wrapperHeade=classes.wrapperHeader)&&void 0!==_classes$wrapperHeade?_classes$wrapperHeade:""),"data-testid":tableHeaderDataTestId},React.createElement("article",{className:"".concat(styles.textElements," ").concat(null!==(_classes$textElements=classes.textElements)&&void 0!==_classes$textElements?_classes$textElements:"")},(isMobile||title||description||selectedLabel)&&React.createElement("div",{className:"".concat(styles.titleAndDescription," ").concat(null!==(_classes$titleAndDesc=classes.titleAndDescription)&&void 0!==_classes$titleAndDesc?_classes$titleAndDesc:"")},title&&React.createElement(UTLabel,{dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".title"):"",weight:"medium"},title),description&&React.createElement(UTLabel,{colorTheme:"gray",dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".description"):"",shade:"04",variant:"small"},description),isMobile&&selectedLabel&&React.createElement(UTLabel,{className:"".concat(styles.selectedLabel," ").concat(null!==(_classes$selectedLabe=classes.selectedLabel)&&void 0!==_classes$selectedLabe?_classes$selectedLabe:""),colorTheme:"accent",dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".selectedLabel"):"",variant:"small",weight:"medium"},selectedLabel)),!isMobile&&selectedLabel&&React.createElement(UTLabel,{colorTheme:"accent",dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".selectedLabel"):"",variant:"small",weight:"medium"},selectedLabel)),React.createElement("article",{className:"".concat(styles.refreshAndActions," ").concat(null!==(_classes$refreshAndAc=classes.refreshAndActions)&&void 0!==_classes$refreshAndAc?_classes$refreshAndAc:"")},withRefresh&&React.createElement(React.Fragment,null,!isMobile&&(loading?React.createElement(UTLabel,{colorTheme:"gray",dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".ongoingRefreshLabel"):"",variant:"small",weight:"medium"},ongoingRefreshLabel):React.createElement(UTLabel,{colorTheme:"gray",dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".refreshLabel"):"",variant:"small",weight:"medium"},refreshLabel)),React.createElement(UTTooltip,{arrow:!1,content:isMobile&&(loading?React.createElement(UTLabel,{colorTheme:"negative",dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".ongoingRefreshLabel"):"",variant:"small",weight:"medium"},ongoingRefreshLabel):React.createElement(UTLabel,{colorTheme:"negative",dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".refreshLabel"):"",variant:"small",weight:"medium"},refreshLabel)),dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".tooltip"):"",tippyProps:{placement:"top"}},React.createElement("span",null,React.createElement(UTButton,{dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".button"):"",Icon:"IconReload",onClick:handleRefresh,size:"small",variant:"text"})))),!Array.isArray(actions)||isEmpty(actions)||isDesktop?Array.isArray(actions)&&actions.map((actionConfig,index)=>actionConfig.tooltip?React.createElement(UTTooltip,_extends({className:actionConfig.tooltipClassName,content:actionConfig.tooltip,dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".").concat(index):"",tippyProps:{arrow:!1,placement:"top"}},actionConfig.tooltipProps),React.createElement("div",null,React.createElement(UTButton,actionConfig))):React.createElement(UTButton,_extends({dataTestId:tableHeaderDataTestId?"".concat(tableHeaderDataTestId,".").concat(index):""},actionConfig))):React.createElement(ActionsMobile,{actions:actions,anchor:anchor,classes:classes,closeMenu:closeMenu,menuButtonRef:menuButtonRef,openMenu:openMenu,tableHeaderDataTestId:tableHeaderDataTestId})))};TableHeader.propTypes={actions:arrayOf(shape({classes:objectOf(string),classNames:objectOf(string),colorTheme:string,count:number,dataTestId:string,disabled:bool,hideTextOnResponsive:bool,Icon:oneOfType([elementType,string]),iconPlacement:string,isPrimary:bool,LeftIcon:oneOfType([elementType,string]),loading:bool,onClick:func,RightIcon:oneOfType([elementType,string]),size:string,type:string,variant:string})),automaticRefreshDelay:number,classes:classesType,description:string,isDesktop:bool,isMobile:bool,loading:bool,onRefresh:func,ongoingRefreshLabel:string,refreshLabel:string,selectedLabel:string,tableHeaderDataTestId:string,title:string,withAutomaticRefresh:bool,withRefresh:bool};export default TableHeader;
+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 isEmpty from 'lodash/isEmpty';
+import React, { Fragment, useEffect, useState } from 'react';
+import { arrayOf, bool, elementType, func, number, objectOf, oneOfType, shape, string } from 'prop-types';
+import UTButton from '../../../../../UTButton';
+import UTLabel from '../../../../../UTLabel';
+import UTTooltip from '../../../../../UTTooltip';
+import useScrollBasedMenu from '../../../../../../utils/hooks/use-scroll-based-menu';
+import { classesType } from '../../../../types';
+import ActionsMobile from './ActionsMobile';
+import styles from './styles.module.scss';
+import { reloadWindow } from './utils';
+const TableHeader = _ref => {
+  var _classes$wrapperHeade, _classes$textElements, _classes$titleAndDesc, _classes$selectedLabe, _classes$refreshAndAc;
+  let {
+    actions,
+    automaticRefreshDelay,
+    classes,
+    description,
+    isDesktop,
+    isMobile,
+    loading,
+    onRefresh = reloadWindow,
+    ongoingRefreshLabel,
+    refreshLabel,
+    selectedLabel,
+    tableHeaderDataTestId,
+    title,
+    withAutomaticRefresh,
+    withRefresh
+  } = _ref;
+  const {
+    anchor,
+    closeMenu,
+    openMenu,
+    ref: menuButtonRef
+  } = useScrollBasedMenu();
+  const [latestRefresh, setLatestRefresh] = useState(new Date());
+  const handleRefresh = () => {
+    onRefresh();
+  };
+  useEffect(() => {
+    if (!loading) {
+      setLatestRefresh(new Date());
+    }
+  }, [loading]);
+  useEffect(() => {
+    let automaticRefreshTimeOut;
+    if (withAutomaticRefresh) {
+      automaticRefreshTimeOut = setTimeout(() => {
+        closeMenu();
+        handleRefresh();
+      }, automaticRefreshDelay);
+    }
+    return () => clearTimeout(automaticRefreshTimeOut);
+  }, [latestRefresh]);
+  return /*#__PURE__*/React.createElement("section", {
+    className: "".concat(styles.wrapperHeader, " ").concat((_classes$wrapperHeade = classes.wrapperHeader) !== null && _classes$wrapperHeade !== void 0 ? _classes$wrapperHeade : ''),
+    "data-testid": tableHeaderDataTestId
+  }, /*#__PURE__*/React.createElement("article", {
+    className: "".concat(styles.textElements, " ").concat((_classes$textElements = classes.textElements) !== null && _classes$textElements !== void 0 ? _classes$textElements : '')
+  }, (isMobile || title || description || selectedLabel) && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.titleAndDescription, " ").concat((_classes$titleAndDesc = classes.titleAndDescription) !== null && _classes$titleAndDesc !== void 0 ? _classes$titleAndDesc : '')
+  }, title && /*#__PURE__*/React.createElement(UTLabel, {
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".title") : '',
+    weight: "medium"
+  }, title), description && /*#__PURE__*/React.createElement(UTLabel, {
+    colorTheme: "gray",
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".description") : '',
+    shade: "04",
+    variant: "small"
+  }, description), isMobile && selectedLabel && /*#__PURE__*/React.createElement(UTLabel, {
+    className: "".concat(styles.selectedLabel, " ").concat((_classes$selectedLabe = classes.selectedLabel) !== null && _classes$selectedLabe !== void 0 ? _classes$selectedLabe : ''),
+    colorTheme: "accent",
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".selectedLabel") : '',
+    variant: "small",
+    weight: "medium"
+  }, selectedLabel)), !isMobile && selectedLabel && /*#__PURE__*/React.createElement(UTLabel, {
+    colorTheme: "accent",
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".selectedLabel") : '',
+    variant: "small",
+    weight: "medium"
+  }, selectedLabel)), /*#__PURE__*/React.createElement("article", {
+    className: "".concat(styles.refreshAndActions, " ").concat((_classes$refreshAndAc = classes.refreshAndActions) !== null && _classes$refreshAndAc !== void 0 ? _classes$refreshAndAc : '')
+  }, withRefresh && /*#__PURE__*/React.createElement(React.Fragment, null, !isMobile && (loading ? /*#__PURE__*/React.createElement(UTLabel, {
+    colorTheme: "gray",
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".ongoingRefreshLabel") : '',
+    variant: "small",
+    weight: "medium"
+  }, ongoingRefreshLabel) : /*#__PURE__*/React.createElement(UTLabel, {
+    colorTheme: "gray",
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".refreshLabel") : '',
+    variant: "small",
+    weight: "medium"
+  }, refreshLabel)), /*#__PURE__*/React.createElement(UTTooltip, {
+    arrow: false,
+    content: isMobile && (loading ? /*#__PURE__*/React.createElement(UTLabel, {
+      colorTheme: "negative",
+      dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".ongoingRefreshLabel") : '',
+      variant: "small",
+      weight: "medium"
+    }, ongoingRefreshLabel) : /*#__PURE__*/React.createElement(UTLabel, {
+      colorTheme: "negative",
+      dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".refreshLabel") : '',
+      variant: "small",
+      weight: "medium"
+    }, refreshLabel)),
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".tooltip") : '',
+    tippyProps: {
+      placement: 'top'
+    }
+  }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(UTButton, {
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".button") : '',
+    Icon: "IconReload",
+    onClick: handleRefresh,
+    size: "small",
+    variant: "text"
+  })))), Array.isArray(actions) && !isEmpty(actions) && !isDesktop ? /*#__PURE__*/React.createElement(ActionsMobile, {
+    actions: actions,
+    anchor: anchor,
+    classes: classes,
+    closeMenu: closeMenu,
+    menuButtonRef: menuButtonRef,
+    openMenu: openMenu,
+    tableHeaderDataTestId: tableHeaderDataTestId
+  }) : Array.isArray(actions) && actions.map((actionConfig, index) => actionConfig.tooltip ? /*#__PURE__*/React.createElement(UTTooltip, _extends({
+    className: actionConfig.tooltipClassName,
+    content: actionConfig.tooltip,
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".").concat(index) : '',
+    tippyProps: {
+      arrow: false,
+      placement: 'top'
+    }
+  }, actionConfig.tooltipProps), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(UTButton, actionConfig))) : /*#__PURE__*/React.createElement(UTButton, _extends({
+    dataTestId: tableHeaderDataTestId ? "".concat(tableHeaderDataTestId, ".").concat(index) : ''
+  }, actionConfig)))));
+};
+TableHeader.propTypes = {
+  actions: arrayOf(shape({
+    classes: objectOf(string),
+    classNames: objectOf(string),
+    colorTheme: string,
+    count: number,
+    dataTestId: string,
+    disabled: bool,
+    hideTextOnResponsive: bool,
+    Icon: oneOfType([elementType, string]),
+    iconPlacement: string,
+    isPrimary: bool,
+    LeftIcon: oneOfType([elementType, string]),
+    loading: bool,
+    onClick: func,
+    RightIcon: oneOfType([elementType, string]),
+    size: string,
+    type: string,
+    variant: string
+  })),
+  automaticRefreshDelay: number,
+  classes: classesType,
+  description: string,
+  isDesktop: bool,
+  isMobile: bool,
+  loading: bool,
+  onRefresh: func,
+  ongoingRefreshLabel: string,
+  refreshLabel: string,
+  selectedLabel: string,
+  tableHeaderDataTestId: string,
+  title: string,
+  withAutomaticRefresh: bool,
+  withRefresh: bool
+};
+export default TableHeader;

package/dist/esm/components/UTTable/components/TableHeader/versions/V1/utils.js

@@ -1 +1,28 @@
-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 React from"react";import UTIcon from"../../../../../UTIcon";export const reloadWindow=()=>{var _window;null===(_window=window)||void 0===_window||null===(_window=_window.location)||void 0===_window||_window.reload()};export const getMenuItems=(actions,closeMenu)=>actions.map(action=>{const{Icon:Icon,iconProps:iconProps,LeftIcon:LeftIcon,onClick:onClick}=action,resolvedIcon=null!=LeftIcon?LeftIcon:Icon;return{...action,Icon:resolvedIcon?"string"==typeof resolvedIcon?()=>React.createElement(UTIcon,_extends({name:resolvedIcon},iconProps)):resolvedIcon:void 0,label:action.children,onClick:()=>{onClick(),closeMenu()}}});
+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 React from 'react';
+import UTIcon from '../../../../../UTIcon';
+export const reloadWindow = () => {
+  var _window;
+  (_window = window) === null || _window === void 0 || (_window = _window.location) === null || _window === void 0 || _window.reload();
+};
+export const getMenuItems = (actions, closeMenu) => actions.map(action => {
+  const {
+    Icon,
+    iconProps,
+    LeftIcon,
+    onClick
+  } = action;
+  // Icon is deprecated in favor of LeftIcon
+  const resolvedIcon = LeftIcon !== null && LeftIcon !== void 0 ? LeftIcon : Icon;
+  return {
+    ...action,
+    Icon: resolvedIcon ? typeof resolvedIcon === 'string' ? () => /*#__PURE__*/React.createElement(UTIcon, _extends({
+      name: resolvedIcon
+    }, iconProps)) : resolvedIcon : undefined,
+    label: action.children,
+    onClick: () => {
+      onClick();
+      closeMenu();
+    }
+  };
+});

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

@@ -1 +1,5 @@
-export const tippyProps={appendTo:()=>document.body,interactive:!1,maxWidth:"none"};
+export const tippyProps = {
+  appendTo: () => document.body,
+  interactive: false,
+  maxWidth: 'none'
+};