@tap-payments/os-micro-frontend-shared 0.1.141 → 0.1.142

package/build/components/TableCells/CustomCells/TerminalsBrandCell/TerminalsBrandCell.d.ts

@@ -1,11 +1,11 @@
 /// <reference types="react" />
 import { TextAndLang } from '../../../../types/index.js';
 type TerminalsBrandCellProps = {
-    name: TextAndLang[];
+    name?: TextAndLang[];
     icon?: React.ReactNode;
-    displayRules: {
-        showIcon: boolean;
-        showLabel: boolean;
+    displayRules?: {
+        showIcon?: boolean;
+        showLabel?: boolean;
     };
 };
 declare const TerminalsBrandCell: (props: TerminalsBrandCellProps) => import("react/jsx-runtime").JSX.Element | null;

package/build/components/TableCells/CustomCells/TerminalsBrandCell/TerminalsBrandCell.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
@@ -7,12 +8,12 @@ import { getNameText } from '../../../../utils/index.js';
 const TerminalsBrandCell = (props) => {
     const { name, icon, displayRules } = props;
     const { i18n } = useTranslation();
+    const brandName = useMemo(() => (name ? getNameText(name, i18n.language) : null), [name, i18n.language]);
     if (!name && !icon)
         return null;
-    const { showIcon, showLabel } = displayRules;
-    const brandName = name ? getNameText(name, i18n.language) : '';
-    const displayLabel = showLabel && !!brandName;
+    const { showIcon = true, showLabel = true } = displayRules || {};
     const displayIcon = showIcon && !!icon;
+    const displayLabel = showLabel;
     if (!displayIcon && !displayLabel)
         return null;
     return (_jsxs(Stack, Object.assign({ "data-testid": "TerminalsBrandCell", direction: "row", alignItems: "center", spacing: 1, color: "text.primary" }, { children: [displayIcon && (_jsx(Chip, Object.assign({ variant: "circular", sx: { '&.CustomVariant_circular': { minWidth: 32, height: 32 } } }, { children: icon }))), displayLabel && (_jsx(Tooltip, Object.assign({ title: brandName }, { children: _jsx(Typography, Object.assign({ noWrap: true, fontSize: 12, fontWeight: 500 }, { children: brandName })) })))] })));

package/build/components/TableCells/CustomCells/TerminalsPlatformCell/TerminalsPlatformCell.d.ts

@@ -2,7 +2,7 @@
 import { StackProps } from '@mui/material/Stack';
 import { TextAndLang } from '../../../../types/index.js';
 type TerminalsPlatformCellProps = StackProps & {
-    name: TextAndLang[];
+    name?: TextAndLang[];
     icon?: React.ReactNode;
     displayRules?: {
         showIcon?: boolean;

package/build/components/TableCells/CustomCells/TerminalsPlatformCell/TerminalsPlatformCell.js

@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo } from 'react';
+import { memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import Stack from '@mui/material/Stack';
 import Typography from '@mui/material/Typography';
@@ -20,10 +20,10 @@ import { getNameText } from '../../../../utils/index.js';
 const TerminalsPlatformCell = (_a) => {
     var { name, icon, displayRules } = _a, props = __rest(_a, ["name", "icon", "displayRules"]);
     const { i18n } = useTranslation();
+    const platformName = useMemo(() => (name ? getNameText(name, i18n.language) : null), [name, i18n.language]);
     const { showIcon = true, showLabel = true } = displayRules || {};
-    const platformName = getNameText(name, i18n.language);
     const displayIcon = showIcon && !!icon;
-    const displayLabel = showLabel || !!platformName;
+    const displayLabel = showLabel;
     if (!displayIcon && !displayLabel)
         return null;
     return (_jsxs(Stack, Object.assign({ "data-testid": "TerminalsPlatformCell", direction: "row", alignItems: "center", spacing: 1, color: "text.primary" }, props, { children: [displayIcon && (_jsx(Chip, Object.assign({ variant: "circular", sx: { '&.CustomVariant_circular': { minWidth: 32, height: 32 } } }, { children: icon }))), displayLabel && (_jsx(Tooltip, Object.assign({ title: platformName }, { children: _jsx(Typography, Object.assign({ noWrap: true, fontSize: 12, fontWeight: 500 }, { children: platformName || (_jsx(Box, Object.assign({ component: "span", sx: { opacity: 0.2 } }, { children: "Unavailable" }))) })) })))] })));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.1.141",
+  "version": "0.1.142",
   "testVersion": 0,
   "type": "module",
   "main": "build/index.js",