@tap-payments/os-micro-frontend-shared 0.1.133 → 0.1.134-test.1

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.
@@ -0,0 +1,10 @@
1
+ /// <reference types="react" />
2
+ import { BoxProps } from '@mui/material/Box';
3
+ import { Currency } from '../../types/index.js';
4
+ interface DisplayAmountI extends BoxProps {
5
+ amount: number;
6
+ selectedCurrency: Currency;
7
+ }
8
+ declare function DisplayAmount({ amount, selectedCurrency, ...props }: DisplayAmountI): import("react/jsx-runtime").JSX.Element;
9
+ declare const _default: import("react").MemoExoticComponent<typeof DisplayAmount>;
10
+ export default _default;
@@ -0,0 +1,22 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
12
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
+ import { memo } from 'react';
14
+ import { formatAmountWithCurrency } from '../../utils/index.js';
15
+ import { DecimalSpan, CurrencySpan } from './style';
16
+ function DisplayAmount(_a) {
17
+ var _b;
18
+ var { amount, selectedCurrency } = _a, props = __rest(_a, ["amount", "selectedCurrency"]);
19
+ const { integerAmount, decimalAmount } = formatAmountWithCurrency(amount, (_b = selectedCurrency === null || selectedCurrency === void 0 ? void 0 : selectedCurrency.code) === null || _b === void 0 ? void 0 : _b.english);
20
+ return (_jsxs(CurrencySpan, Object.assign({}, props, { children: [_jsx("span", { children: integerAmount }), _jsx("span", { children: "." }), _jsx(DecimalSpan, { children: decimalAmount })] })));
21
+ }
22
+ export default memo(DisplayAmount);
@@ -0,0 +1,2 @@
1
+ import DisplayAmount from './DisplayAmount';
2
+ export default DisplayAmount;
@@ -0,0 +1,2 @@
1
+ import DisplayAmount from './DisplayAmount';
2
+ export default DisplayAmount;
@@ -0,0 +1,5 @@
1
+ /// <reference types="react" />
2
+ export declare const DecimalSpan: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
3
+ export declare const CurrencySpan: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
4
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
5
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
@@ -0,0 +1,14 @@
1
+ import Box from '@mui/material/Box';
2
+ import { styled } from '@mui/material/styles';
3
+ export const DecimalSpan = styled('span')(() => ({
4
+ fontWeight: 400,
5
+ }));
6
+ export const CurrencySpan = styled(Box)(() => ({
7
+ fontWeight: 700,
8
+ fontSize: '11px',
9
+ display: 'flex',
10
+ alignItems: 'center',
11
+ cursor: 'default',
12
+ whiteSpace: 'nowrap',
13
+ overflow: 'auto',
14
+ }));
@@ -0,0 +1,6 @@
1
+ interface LanguageDropdownProps {
2
+ defaultLanguage?: string;
3
+ onChange?: (language: string) => void;
4
+ }
5
+ export default function LanguageDropdown({ defaultLanguage, onChange }: LanguageDropdownProps): import("react/jsx-runtime").JSX.Element;
6
+ export {};
@@ -0,0 +1,24 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useState } from 'react';
3
+ import Box from '@mui/material/Box';
4
+ import ClickAwayListener from '@mui/material/ClickAwayListener';
5
+ import { Menu, MenuItem } from '../index.js';
6
+ import { Button } from './style';
7
+ const languages = ['EN', 'AR'];
8
+ export default function LanguageDropdown({ defaultLanguage = 'EN', onChange }) {
9
+ const [language, setLanguage] = useState(defaultLanguage);
10
+ const [anchorEl, setAnchorEl] = useState(null);
11
+ const open = Boolean(anchorEl);
12
+ const onOpen = (event) => {
13
+ setAnchorEl(event.currentTarget);
14
+ };
15
+ const onCLose = () => {
16
+ setAnchorEl(null);
17
+ };
18
+ const onClick = (lang) => {
19
+ setLanguage(lang);
20
+ onChange === null || onChange === void 0 ? void 0 : onChange(lang);
21
+ onCLose();
22
+ };
23
+ return (_jsx(ClickAwayListener, Object.assign({ onClickAway: onCLose }, { children: _jsxs(Box, { children: [_jsx(Button, Object.assign({ onClick: onOpen, open: open }, { children: _jsx(Box, Object.assign({ component: "span" }, { children: language })) })), _jsx(Menu, Object.assign({ open: open, anchorEl: anchorEl, sx: { marginTop: '8px', marginBottom: '8px', width: 31.8 } }, { children: languages.map((lang) => lang !== language && (_jsx(MenuItem, Object.assign({ onClick: () => onClick(lang) }, { children: lang }), lang))) }))] }) })));
24
+ }
@@ -0,0 +1,2 @@
1
+ import LanguageDropdown from './LanguageDropdown';
2
+ export default LanguageDropdown;
@@ -0,0 +1,2 @@
1
+ import LanguageDropdown from './LanguageDropdown';
2
+ export default LanguageDropdown;
@@ -0,0 +1,6 @@
1
+ /// <reference types="react" />
2
+ export declare const Button: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
3
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
5
+ open?: boolean | undefined;
6
+ }, {}, {}>;
@@ -0,0 +1,5 @@
1
+ import Box from '@mui/material/Box';
2
+ import { styled } from '@mui/material/styles';
3
+ export const Button = styled(Box, { shouldForwardProp: (props) => props !== 'open' })(({ theme, open }) => (Object.assign({ backgroundColor: theme.palette.common.white, border: `1px solid ${theme.palette.divider}`, fontSize: '11px', color: theme.palette.text.primary, padding: '8px', borderRadius: '4px', display: 'flex', alignItems: 'center', height: 32, gap: '4px' }, (open && {
4
+ borderColor: theme.palette.info.dark,
5
+ }))));
@@ -111,3 +111,5 @@ export * from './LazyImage';
111
111
  export { default as SearchListInput } from './SearchListInput';
112
112
  export { default as ErrorToast } from './ErrorToast';
113
113
  export { default as ToggleView, type ToggleViewsValues, ToggleViews } from './ToggleView';
114
+ export { default as LanguageDropdown } from './LanguageDropdown';
115
+ export { default as DisplayAmount } from './DisplayAmount';
@@ -111,3 +111,5 @@ export * from './LazyImage';
111
111
  export { default as SearchListInput } from './SearchListInput';
112
112
  export { default as ErrorToast } from './ErrorToast';
113
113
  export { default as ToggleView, ToggleViews } from './ToggleView';
114
+ export { default as LanguageDropdown } from './LanguageDropdown';
115
+ export { default as DisplayAmount } from './DisplayAmount';
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.133",
5
- "testVersion": 0,
4
+ "version": "0.1.134-test.1",
5
+ "testVersion": 1,
6
6
  "type": "module",
7
7
  "main": "build/index.js",
8
8
  "module": "build/index.js",
@@ -136,4 +136,4 @@
136
136
  "publishConfig": {
137
137
  "registry": "https://registry.npmjs.org/"
138
138
  }
139
- }
139
+ }