@tap-payments/os-micro-frontend-shared 0.0.95 → 0.0.97

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.
Files changed (11) hide show
  1. package/build/components/SearchButton/styles.d.ts +1 -1
  2. package/build/components/TableCells/CustomCells/ActionCell/style.d.ts +1 -1
  3. package/build/components/TableCells/CustomCells/ApplicationStatusCell/ApplicationStatusCell.js +2 -2
  4. package/build/components/TableCells/CustomCells/SourceMergedCell/style.d.ts +1 -1
  5. package/build/components/TableCells/CustomCells/StatusCell/style.d.ts +1 -1
  6. package/build/components/VirtualTable/components/ColumnFilter/Inputs/Inputs.js +31 -18
  7. package/build/components/VirtualTable/style.d.ts +1 -1
  8. package/build/constants/assets.d.ts +1 -0
  9. package/build/constants/assets.js +1 -0
  10. package/build/types/table.d.ts +1 -1
  11. package/package.json +1 -1
package/build/components/SearchButton/styles.d.ts CHANGED
@@ -554,9 +554,9 @@ export declare const Icon: import("@emotion/styled").StyledComponent<{
554
554
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
555
555
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
556
556
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
557
- referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
558
557
  src?: string | undefined;
559
558
  alt?: string | undefined;
559
+ referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
560
560
  crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
561
561
  useMap?: string | undefined;
562
562
  loading?: "eager" | "lazy" | undefined;
package/build/components/TableCells/CustomCells/ActionCell/style.d.ts CHANGED
@@ -269,9 +269,9 @@ export declare const ActionIcon: import("@emotion/styled").StyledComponent<{
269
269
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
270
270
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
271
271
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
272
- referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
273
272
  src?: string | undefined;
274
273
  alt?: string | undefined;
274
+ referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
275
275
  crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
276
276
  useMap?: string | undefined;
277
277
  loading?: "eager" | "lazy" | undefined;
package/build/components/TableCells/CustomCells/ApplicationStatusCell/ApplicationStatusCell.js CHANGED
@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
10
10
  return t;
11
11
  };
12
12
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
13
- import { acceptanceDisabledRoundedIcon, payoutDisabledRoundedIcon, payoutEnabledIcon, acceptanceEnabledIcon } from '../../../../constants/index.js';
13
+ import { acceptanceDisabledRoundedIcon, payoutDisabledRoundedIcon, acceptanceEnabledIcon, payoutGreenIcon } from '../../../../constants/index.js';
14
14
  import Tooltip from '../../../Tooltip';
15
15
  import TableCell from '../../TableCell';
16
16
  import { AppsWrapper, IconWrapper } from './style';
@@ -18,5 +18,5 @@ export default function ApplicationStatusCell(_a) {
18
18
  var { acceptance, payout, hideAcceptance, hidePayout } = _a, props = __rest(_a, ["acceptance", "payout", "hideAcceptance", "hidePayout"]);
19
19
  const isAcceptanceEnabled = (acceptance === null || acceptance === void 0 ? void 0 : acceptance.toLowerCase()) === 'enabled';
20
20
  const isPayoutEnabled = (payout === null || payout === void 0 ? void 0 : payout.toLowerCase()) === 'enabled';
21
- return (_jsx(TableCell, Object.assign({}, props, { children: _jsxs(AppsWrapper, { children: [!hideAcceptance && (_jsx(Tooltip, Object.assign({ title: 'Acceptance' }, { children: _jsxs(IconWrapper, { children: [_jsx("img", { src: isAcceptanceEnabled ? acceptanceEnabledIcon : acceptanceDisabledRoundedIcon, alt: acceptance }), ' '] }) }), acceptance)), !hidePayout && (_jsx(Tooltip, Object.assign({ title: 'Payouts' }, { children: _jsx(IconWrapper, { children: _jsx("img", { src: isPayoutEnabled ? payoutEnabledIcon : payoutDisabledRoundedIcon, alt: payout }) }) }), payout))] }) })));
21
+ return (_jsx(TableCell, Object.assign({}, props, { children: _jsxs(AppsWrapper, { children: [!hideAcceptance && (_jsx(Tooltip, Object.assign({ title: 'Acceptance' }, { children: _jsxs(IconWrapper, { children: [_jsx("img", { src: isAcceptanceEnabled ? acceptanceEnabledIcon : acceptanceDisabledRoundedIcon, alt: acceptance }), ' '] }) }), acceptance)), !hidePayout && (_jsx(Tooltip, Object.assign({ title: 'Payouts' }, { children: _jsx(IconWrapper, { children: _jsx("img", { src: isPayoutEnabled ? payoutGreenIcon : payoutDisabledRoundedIcon, alt: payout }) }) }), payout))] }) })));
22
22
  }
package/build/components/TableCells/CustomCells/SourceMergedCell/style.d.ts CHANGED
@@ -273,9 +273,9 @@ export declare const MultiRefundIcon: import("@emotion/styled").StyledComponent<
273
273
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
274
274
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
275
275
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
276
- referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
277
276
  src?: string | undefined;
278
277
  alt?: string | undefined;
278
+ referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
279
279
  crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
280
280
  useMap?: string | undefined;
281
281
  loading?: "eager" | "lazy" | undefined;
package/build/components/TableCells/CustomCells/StatusCell/style.d.ts CHANGED
@@ -262,9 +262,9 @@ export declare const MultiRefundIcon: import("@emotion/styled").StyledComponent<
262
262
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
263
263
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
264
264
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
265
- referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
266
265
  src?: string | undefined;
267
266
  alt?: string | undefined;
267
+ referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
268
268
  crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
269
269
  useMap?: string | undefined;
270
270
  loading?: "eager" | "lazy" | undefined;
package/build/components/VirtualTable/components/ColumnFilter/Inputs/Inputs.js CHANGED
@@ -1,5 +1,5 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Fragment, useCallback, useEffect, useMemo, useState } from 'react';
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import { useCallback, useEffect, useMemo, useState } from 'react';
3
3
  import Box from '@mui/material/Box';
4
4
  import Collapse from '@mui/material/Collapse';
5
5
  import lodashValues from 'lodash/values';
@@ -23,25 +23,38 @@ function Inputs({ onCloseDropdown, filter: { options = [], onConfirm, data, isOn
23
23
  const onClickClear = () => {
24
24
  setValues(options.reduce((acc, { apiKey }) => (Object.assign(Object.assign({}, acc), { [apiKey]: '' })), {}));
25
25
  };
26
- const isInputHasValue = (key) => values[key] !== undefined && values[key].length > 0;
27
26
  const getInputValue = (key) => (values[key] !== undefined && values[key].length ? values[key] : '');
28
- const onClickResetInput = (key) => {
29
- if (isInputHasValue(key))
30
- setValues(Object.assign(Object.assign({}, values), { [key]: '' }));
31
- };
32
27
  const showClearButton = useMemo(() => lodashValues(values).some((x) => Boolean(x)), [values]);
33
- const getFilterByApiKey = useCallback((apiKey) => {
34
- return options.find((option) => option.apiKey === apiKey);
28
+ const getFilterByApiKey = useCallback((key) => {
29
+ return options === null || options === void 0 ? void 0 : options.find((option) => option.apiKey === key);
35
30
  }, [options]);
36
- const isInputDisabled = useCallback((key, filterGroup) => {
37
- const inputWithValue = (values === null || values === void 0 ? void 0 : values[key]) !== undefined && (values === null || values === void 0 ? void 0 : values[key]) !== '' && (values === null || values === void 0 ? void 0 : values[key]) !== null;
38
- const isAnyInputWithValue = Object.entries(values).some(([inputKey, val]) => { var _a; return Boolean(val) && (((_a = getFilterByApiKey(inputKey)) === null || _a === void 0 ? void 0 : _a.filterGroup) !== filterGroup || !filterGroup); });
31
+ const isAnyInputWithValue = (group) => Object.entries(values).some(([inputKey, val]) => { var _a; return Boolean(val) && (((_a = getFilterByApiKey(inputKey)) === null || _a === void 0 ? void 0 : _a.filterGroup) !== group || !group); });
32
+ return (_jsxs(Wrapper, Object.assign({ component: "article", "data-testid": "ColumnFilterInputs" }, { children: [_jsx(Text, Object.assign({ component: "header", "data-testid": "ColumnFilterInputs_title" }, { children: t('filterBy') })), _jsx(InputsWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_inputs", component: "main" }, { children: options.map(({ placeholder, apiKey, isDisabled, filterGroup, render }) => {
33
+ const inputValue = getInputValue(apiKey);
34
+ return (_jsx(ColumnFilterInput, { apiKey: apiKey, isOnlyOneFilter: isOnlyOneFilter, setValues: setValues, options: options, value: inputValue, render: render, placeholder: placeholder, isDisabled: isDisabled, filterGroup: filterGroup, isAnyInputWithValue: isAnyInputWithValue(filterGroup) }, apiKey));
35
+ }) })), _jsx(Collapse, Object.assign({ in: showClearButton, component: "section", "data-testid": "ColumnFilterInputs_Collapse" }, { children: _jsx(ClearWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_ClearWrapper" }, { children: _jsx(ClearButton, Object.assign({ type: "button", onClick: onClickClear, "data-testid": "ColumnFilterInputs_ClearButton" }, { children: t('clear') })) })) })), _jsxs(Footer, Object.assign({ component: "footer", "data-testid": "ColumnFilterInputs_footer" }, { children: [_jsx(CancelButton, Object.assign({ type: "button", onClick: onClickCancel, "data-testid": "ColumnFilterInputs_CancelButton" }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ type: "button", onClick: onClickOkay, "data-testid": "ColumnFilterInputs_OkayButton" }, { children: t('okay') }))] }))] })));
36
+ }
37
+ function ColumnFilterInput({ apiKey, isOnlyOneFilter, setValues, value, render, placeholder, isDisabled, isAnyInputWithValue, }) {
38
+ const [anchorEl, setAnchorEl] = useState(null);
39
+ const isInputHasValue = useMemo(() => value !== undefined && value.length > 0, [value]);
40
+ const onClickResetInput = (key) => {
41
+ if (isInputHasValue)
42
+ setValues((prev) => (Object.assign(Object.assign({}, prev), { [key]: '' })));
43
+ };
44
+ const isInputDisabled = useMemo(() => {
45
+ const inputWithValue = value !== undefined && value !== '' && value !== null;
39
46
  return isOnlyOneFilter && !inputWithValue && isAnyInputWithValue;
40
- }, [options, values, isOnlyOneFilter]);
41
- return (_jsxs(Wrapper, Object.assign({ component: "article", "data-testid": "ColumnFilterInputs" }, { children: [_jsx(Text, Object.assign({ component: "header", "data-testid": "ColumnFilterInputs_title" }, { children: t('filterBy') })), _jsx(InputsWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_inputs", component: "main" }, { children: options.map(({ placeholder, apiKey, isDisabled, filterGroup, render }) => (_jsx(Fragment, { children: render ? (render()) : (_jsx(InputStyled, { className: "input", "data-testid": "ColumnFilterInputs_InputStyled", name: apiKey, placeholder: placeholder, onChange: (e) => {
42
- setValues(Object.assign(Object.assign({}, values), { [apiKey]: e.target.value }));
43
- }, disabled: isDisabled || isInputDisabled(apiKey, filterGroup), value: getInputValue(apiKey), inputProps: { autoComplete: 'off', 'data-testid': 'ColumnFilterInputs_input' }, endAdornment: _jsx(Box, { component: "img", "data-testid": "ColumnFilterInputs_icon", "data-icon": isInputHasValue(apiKey) ? 'close' : 'search', src: isInputHasValue(apiKey) ? grayCloseIcon : searchIcon, alt: "search", className: "icon", sx: { cursor: isInputHasValue(apiKey) ? 'pointer' : 'default' }, onClick: () => {
44
- onClickResetInput(apiKey);
45
- } }) })) }, apiKey))) })), _jsx(Collapse, Object.assign({ in: showClearButton, component: "section", "data-testid": "ColumnFilterInputs_Collapse" }, { children: _jsx(ClearWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_ClearWrapper" }, { children: _jsx(ClearButton, Object.assign({ type: "button", onClick: onClickClear, "data-testid": "ColumnFilterInputs_ClearButton" }, { children: t('clear') })) })) })), _jsxs(Footer, Object.assign({ component: "footer", "data-testid": "ColumnFilterInputs_footer" }, { children: [_jsx(CancelButton, Object.assign({ type: "button", onClick: onClickCancel, "data-testid": "ColumnFilterInputs_CancelButton" }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ type: "button", onClick: onClickOkay, "data-testid": "ColumnFilterInputs_OkayButton" }, { children: t('okay') }))] }))] })));
47
+ }, [value, isOnlyOneFilter, isAnyInputWithValue]);
48
+ if (render) {
49
+ return (_jsx(_Fragment, { children: render({
50
+ anchorEl,
51
+ setAnchorEl,
52
+ }) }));
53
+ }
54
+ return (_jsx(InputStyled, { className: "input", "data-testid": "ColumnFilterInputs_InputStyled", name: apiKey, placeholder: placeholder, onChange: (e) => {
55
+ setValues((prev) => (Object.assign(Object.assign({}, prev), { [apiKey]: e.target.value })));
56
+ }, disabled: isDisabled || isInputDisabled, value: value, inputProps: { autoComplete: 'off', 'data-testid': 'ColumnFilterInputs_input' }, endAdornment: _jsx(Box, { component: "img", "data-testid": "ColumnFilterInputs_icon", "data-icon": isInputHasValue ? 'close' : 'search', src: isInputHasValue ? grayCloseIcon : searchIcon, alt: "search", className: "icon", sx: { cursor: isInputHasValue ? 'pointer' : 'default' }, onClick: () => {
57
+ onClickResetInput(apiKey);
58
+ } }) }));
46
59
  }
47
60
  export default Inputs;
package/build/components/VirtualTable/style.d.ts CHANGED
@@ -306,9 +306,9 @@ export declare const ActionIcon: import("@emotion/styled").StyledComponent<{
306
306
  onAnimationIterationCapture?: import("react").AnimationEventHandler<HTMLImageElement> | undefined;
307
307
  onTransitionEnd?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
308
308
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLImageElement> | undefined;
309
- referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
310
309
  src?: string | undefined;
311
310
  alt?: string | undefined;
311
+ referrerPolicy?: import("react").HTMLAttributeReferrerPolicy | undefined;
312
312
  crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
313
313
  useMap?: string | undefined;
314
314
  loading?: "eager" | "lazy" | undefined;
package/build/constants/assets.d.ts CHANGED
@@ -135,6 +135,7 @@ export declare const acceptanceEnabledIcon: string;
135
135
  export declare const acceptanceAppDisabledIcon: string;
136
136
  export declare const payoutAppDisabledIcon: string;
137
137
  export declare const payoutEnabledIcon: string;
138
+ export declare const payoutGreenIcon: string;
138
139
  export declare const payoutDisabledRoundedIcon: string;
139
140
  export declare const acceptanceDisabledRoundedIcon: string;
140
141
  export declare const authenticationAppIcon: string;
package/build/constants/assets.js CHANGED
@@ -136,6 +136,7 @@ export const acceptanceEnabledIcon = `${lightUrl}/acceptanceEnabled.svg`;
136
136
  export const acceptanceAppDisabledIcon = `${appBaseUrl}/acceptanceAppIconDisabled.svg`;
137
137
  export const payoutAppDisabledIcon = `${appBaseUrl}/payoutsAppIconDisabled.svg`;
138
138
  export const payoutEnabledIcon = `${lightUrl}/payoutEnabled.svg`;
139
+ export const payoutGreenIcon = `${lightUrl}/payoutAppGreenIcon.svg`;
139
140
  export const payoutDisabledRoundedIcon = `${lightUrl}/payoutDisabledRounded.svg`;
140
141
  export const acceptanceDisabledRoundedIcon = `${lightUrl}/acceptanceDisabledRounded.svg`;
141
142
  export const authenticationAppIcon = `${appBaseUrl}/AuthenticationApp.svg`;
package/build/types/table.d.ts CHANGED
@@ -70,7 +70,7 @@ export interface IColumnFilterOption {
70
70
  options?: IColumnFilterOption[];
71
71
  isDisabled?: boolean;
72
72
  filterGroup?: string;
73
- render?: () => React.ReactNode;
73
+ render?: (v: any) => React.ReactNode;
74
74
  }
75
75
  export type IColumnListFilterOption = Omit<IColumnFilterOption, 'apiKey' | 'options'> & {
76
76
  value: string;
package/package.json CHANGED
@@ -1,7 +1,7 @@
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.0.95",
4
+ "version": "0.0.97",
5
5
  "type": "module",
6
6
  "main": "build/index.js",
7
7
  "module": "build/index.js",