@tap-payments/os-micro-frontend-shared 0.1.347-test.1 → 0.1.347-test.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -36,20 +36,16 @@ const StatusChip = (_a) => {
36
36
  };
37
37
  }
38
38
  }, [copyText]);
39
- const copyButton = useMemo(() => (_jsx(AnimatePresence, { children: isCopyActive && (_jsx(CopyWrapper, { children: _jsx(motion.img, { initial: { opacity: 0, x: -5 }, animate: { opacity: 1, x: 0 }, exit: { opacity: 0, x: -2 }, transition: { duration: 0.1 }, onClick: handleCopy, src: showCopy ? greenCheckIcon : copyIcon, style: {
40
- height: 12,
41
- width: 12,
42
- objectFit: 'contain',
43
- } }) })) })), [showCopy, isCopyActive, handleCopy]);
39
+ const copyButton = useMemo(() => (_jsx(CopyWrapper, Object.assign({ sx: Object.assign(Object.assign({}, (expandDirection === 'right' && { right: '8px' })), (expandDirection === 'left' && { left: '8px' })) }, { children: _jsx(motion.img, { initial: { opacity: 0, x: -5 }, animate: { opacity: 1, x: 0 }, exit: { opacity: 0, x: -2 }, transition: { duration: 0.1 }, onClick: handleCopy, src: showCopy ? greenCheckIcon : copyIcon, style: {
40
+ height: 12,
41
+ width: 12,
42
+ objectFit: 'contain',
43
+ } }) }))), [showCopy, handleCopy, expandDirection]);
44
+ const isExpandedRightActive = isCopyActive && expandDirection === 'right';
45
+ const isExpandedLeftActive = isCopyActive && expandDirection === 'left';
44
46
  if (!children) {
45
47
  return (_jsx(ChipStyled, Object.assign({}, emptyStatusChipColors, props, { isSelected: false, sx: (theme) => ({ borderColor: theme.palette.divider, width: fullWidth ? '100%' : 'auto' }) }, { children: unknownText ? t(unknownText) : t('unknown') })));
46
48
  }
47
- return (_jsxs(motion.div, Object.assign({ style: Object.assign(Object.assign({ position: 'relative' }, containerStyles), (fullWidth && { width: '100%', minWidth: 0 })), animate: { zIndex: isSelected ? 3 : 0 } }, { children: [_jsx(ChipStyled, Object.assign({}, props, { sx: { visibility: 'hidden', pointerEvents: 'none', width: fullWidth ? '100%' : 'auto' } }, { children: _jsx(Wrapper, { children: children }) })), _jsx(motion.div, Object.assign({ style: { position: 'absolute', top: 0, zIndex: isSelected ? 3 : 0, width: fullWidth ? '100%' : 'auto' }, animate: Object.assign(Object.assign({}, (expandDirection === 'right' && { left: 0 })), (expandDirection === 'left' && { right: 0 })), transition: { delay: isSelected ? 0 : 0.3, duration: 0.2 } }, { children: _jsx(ChipStyled, Object.assign({}, props, { isSelected: isSelected, sx: { width: fullWidth ? '100%' : 'auto' } }, chipStyles, { children: _jsxs(motion.div, Object.assign({ layout: "size", style: Object.assign({ display: 'flex', gap: '4px' }, (fullWidth && { maxWidth: '100%', width: '100%' })), animate: {
48
- paddingRight: isCopyActive ? 12 : 0,
49
- }, transition: { delay: isSelected ? 0 : 0.3, duration: 0.2 } }, { children: [expandDirection === 'left' && copyButton, _jsx(Wrapper, Object.assign({ "data-is-arabic": typeof children === 'string' && isArabic(children) }, { children: children })), expandDirection === 'right' && copyButton, _jsx(AnimatePresence, { children: isCopyActive && (_jsx(CopyWrapper, { children: _jsx(motion.img, { initial: { opacity: 0, x: -5 }, animate: { opacity: 1, x: 0 }, exit: { opacity: 0, x: -2 }, transition: { duration: 0.1 }, onClick: handleCopy, src: showCopy ? greenCheckIcon : copyIcon, style: {
50
- height: 12,
51
- width: 12,
52
- objectFit: 'contain',
53
- } }) })) })] })) })) }))] })));
49
+ return (_jsxs(motion.div, Object.assign({ style: Object.assign(Object.assign({ position: 'relative' }, containerStyles), (fullWidth && { width: '100%', minWidth: 0 })), animate: { zIndex: isSelected ? 3 : 0 } }, { children: [_jsx(ChipStyled, Object.assign({}, props, { sx: { visibility: 'hidden', pointerEvents: 'none', width: fullWidth ? '100%' : 'auto' } }, { children: _jsx(Wrapper, { children: children }) })), _jsx(motion.div, Object.assign({ style: { position: 'absolute', top: 0, zIndex: isSelected ? 3 : 0, width: fullWidth ? '100%' : 'auto', left: 'unset', right: 'unset' }, animate: Object.assign(Object.assign({}, (isExpandedRightActive && { left: 0 })), (isExpandedLeftActive && { right: 0 })), transition: { delay: isSelected ? 0 : 0.3, duration: 0.2 } }, { children: _jsx(ChipStyled, Object.assign({}, props, { isSelected: isSelected, sx: { width: fullWidth ? '100%' : 'auto' } }, chipStyles, { children: _jsxs(motion.div, Object.assign({ layout: "size", style: Object.assign({ display: 'flex', gap: '4px' }, (fullWidth && { maxWidth: '100%', width: '100%' })), animate: Object.assign(Object.assign({}, (isExpandedRightActive && { paddingRight: 12 })), (isExpandedLeftActive && { paddingLeft: 12 })), transition: { delay: isSelected ? 0 : 0.3, duration: 0.2 } }, { children: [_jsx(AnimatePresence, { children: isExpandedLeftActive && copyButton }), _jsx(Wrapper, Object.assign({ "data-is-arabic": typeof children === 'string' && isArabic(children) }, { children: children })), _jsx(AnimatePresence, { children: isExpandedRightActive && copyButton })] })) })) }))] })));
54
50
  };
55
51
  export default StatusChip;
@@ -27,7 +27,6 @@ export const Wrapper = styled(Box)(() => ({
27
27
  }));
28
28
  export const CopyWrapper = styled(Box)(() => ({
29
29
  position: 'absolute',
30
- right: '8px',
31
30
  top: 0,
32
31
  height: '100%',
33
32
  width: '12px',
package/package.json CHANGED
@@ -1,8 +1,8 @@
1
1
  {
2
2
  "name": "@tap-payments/os-micro-frontend-shared",
3
3
  "description": "Shared components and utilities for Tap Payments micro frontends",
4
- "version": "0.1.347-test.1",
5
- "testVersion": 1,
4
+ "version": "0.1.347-test.3",
5
+ "testVersion": 3,
6
6
  "type": "module",
7
7
  "main": "build/index.js",
8
8
  "module": "build/index.js",