@selfcommunity/react-ui 0.11.0-alpha.71 → 0.11.0-alpha.72

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.
@@ -104,7 +104,7 @@ function CategoryFollowButton(inProps) {
104
104
  if (!scCategory || !categoryFollowEnabled || (scCategory && followed && scCategory.auto_follow === types_1.SCCategoryAutoFollowType.FORCED)) {
105
105
  return null;
106
106
  }
107
- if (scCategoriesManager.isLoading(scCategory) || followed === null) {
107
+ if (scUserContext.user && (scCategoriesManager.isLoading(scCategory) || followed === null)) {
108
108
  return ((0, jsx_runtime_1.jsx)(Root, Object.assign({ size: "small", variant: "outlined", loading: true, className: (0, classnames_1.default)(classes.root, className) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.categoryFollowButton.follow", id: "ui.categoryFollowButton.follow" }) })));
109
109
  }
110
110
  /**
@@ -86,7 +86,7 @@ function PaywallsConfigurator(inProps) {
86
86
  * Handle change content type access
87
87
  * @param panel
88
88
  */
89
- const handleChange = (panel) => (event, isExpanded) => {
89
+ const handleChange = (panel) => (_event, _isExpanded) => {
90
90
  setExpanded(panel);
91
91
  onChangeContentAccessType(panel);
92
92
  };
@@ -115,7 +115,7 @@ function PaywallsConfigurator(inProps) {
115
115
  onChangePaymentProducts === null || onChangePaymentProducts === void 0 ? void 0 : onChangePaymentProducts(products);
116
116
  handleToggleCreatePaymentPrice();
117
117
  };
118
- const handleDeleteProduct = (p, i) => {
118
+ const handleDeleteProduct = (_p, i) => {
119
119
  const products = [...value.slice(0, i), ...value.slice(i + 1)];
120
120
  setValue(products);
121
121
  onChangePaymentProducts === null || onChangePaymentProducts === void 0 ? void 0 : onChangePaymentProducts(products);
@@ -143,7 +143,7 @@ function PaywallsConfigurator(inProps) {
143
143
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
144
144
  // @ts-ignore
145
145
  const { key } = props, optionProps = tslib_1.__rest(props, ["key"]);
146
- return ((0, jsx_runtime_1.jsxs)("li", Object.assign({}, optionProps, (selected && { style: { backgroundColor: '#f9fafc' } }), { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.productItemCheckIcon, style: { visibility: selected ? 'visible' : 'hidden' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "check" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: "span", className: classes.productItemCardIcon }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "card_giftcard" }) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.productItemContent }, { children: [option.name, (0, jsx_runtime_1.jsx)("br", {}), option.payment_prices && option.payment_prices[0] && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: (0, payment_1.getConvertedAmount)(option.payment_prices[0]) }), ' ', option.payment_prices.length > 1 && (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["+", option.payment_prices.length - 1] })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.productItemRemoveIcon, style: { visibility: selected ? 'visible' : 'hidden' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow" }) }))] }), option.id));
146
+ return ((0, jsx_runtime_1.jsxs)("li", Object.assign({}, optionProps, (selected && { style: { backgroundColor: '#f9fafc' } }), { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.productItemCheckIcon, style: { visibility: selected ? 'visible' : 'hidden' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "check" }) })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: "span", className: classes.productItemCardIcon }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "pagamenti" }) })), (0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ className: classes.productItemContent }, { children: [option.name, (0, jsx_runtime_1.jsx)("br", {}), option.payment_prices && option.payment_prices[0] && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { children: (0, payment_1.getConvertedAmount)(option.payment_prices[0]) }), ' ', option.payment_prices.length > 1 && (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["+", option.payment_prices.length - 1] })] }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.productItemRemoveIcon, style: { visibility: selected ? 'visible' : 'hidden' } }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "arrow" }) }))] }), option.id));
147
147
  };
148
148
  /**
149
149
  * Fetch events
@@ -222,7 +222,7 @@ function PaywallsConfigurator(inProps) {
222
222
  defaultMessage: 'ui.paywallsConfigurator.connected.noProducts'
223
223
  }) }) }), -1)), value.map((p, i) => {
224
224
  var _a, _b, _c;
225
- return ((0, jsx_runtime_1.jsxs)(material_1.ListItem, Object.assign({ secondaryAction: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", color: "secondary", size: "small", onClick: () => handleDeleteProduct(p, i), startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "delete" }) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.connected.products.btnRemove", defaultMessage: "ui.paywallsConfigurator.connected.products.btnRemove" }) })), divider: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "card_giftcard" }) }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: p.name, secondary: `Prices: ${((_a = p.payment_prices) === null || _a === void 0 ? void 0 : _a.length)
225
+ return ((0, jsx_runtime_1.jsxs)(material_1.ListItem, Object.assign({ secondaryAction: (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "contained", color: "secondary", size: "small", onClick: () => handleDeleteProduct(p, i), startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "delete" }) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.connected.products.btnRemove", defaultMessage: "ui.paywallsConfigurator.connected.products.btnRemove" }) })), divider: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.ListItemAvatar, { children: (0, jsx_runtime_1.jsx)(material_1.Avatar, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "dredit-card" }) }) }), (0, jsx_runtime_1.jsx)(material_1.ListItemText, { primary: p.name, secondary: `Prices: ${((_a = p.payment_prices) === null || _a === void 0 ? void 0 : _a.length)
226
226
  ? p.payment_prices
227
227
  .slice(0, 3)
228
228
  .map((price) => (0, payment_1.getConvertedAmount)(price))
@@ -233,7 +233,7 @@ function PaywallsConfigurator(inProps) {
233
233
  defaultMessage: 'ui.paywallsConfigurator.connected.products.others'
234
234
  }, { count: ((_c = p.payment_prices) === null || _c === void 0 ? void 0 : _c.length) - 3 })
235
235
  : ''}` })] }), i));
236
- })] })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "outlined", size: "small", fullWidth: true, disableRipple: true, onClick: handleOpenPricesList, startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "list" }) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.openPriceslist", defaultMessage: "ui.paywallsConfigurator.openPriceslist" }) }))] })), !loading && ((0, jsx_runtime_1.jsx)(PaymentProductsPopper, Object.assign({ id: open ? 'payment-products' : undefined, open: open, anchorEl: anchorEl, placement: "bottom-start" }, { children: (0, jsx_runtime_1.jsx)(ClickAwayListener_1.default, Object.assign({ onClickAway: handleClose }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paymentProductsPopperTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.connected.products.content", defaultMessage: "ui.paywallsConfigurator.connected.products.content" }) })), (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { loading: loadingProducts, loadingText: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.autoCompleteProductsLoading }, { children: (0, jsx_runtime_1.jsx)(material_1.CircularProgress, {}) })), id: "payment-products-autocomplete", className: classes.paymentProductsAutocompletePopperRoot, open: true, multiple: true, onClose: (event, reason) => {
236
+ })] })), (0, jsx_runtime_1.jsx)(material_1.Button, Object.assign({ variant: "outlined", size: "small", fullWidth: true, disableRipple: true, onClick: handleOpenPricesList, startIcon: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "list" }) }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.openPriceslist", defaultMessage: "ui.paywallsConfigurator.openPriceslist" }) }))] })), !loading && ((0, jsx_runtime_1.jsx)(PaymentProductsPopper, Object.assign({ id: open ? 'payment-products' : undefined, open: open, anchorEl: anchorEl, placement: "bottom-start" }, { children: (0, jsx_runtime_1.jsx)(ClickAwayListener_1.default, Object.assign({ onClickAway: handleClose }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.paymentProductsPopperTitle }, { children: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.paywallsConfigurator.connected.products.content", defaultMessage: "ui.paywallsConfigurator.connected.products.content" }) })), (0, jsx_runtime_1.jsx)(material_1.Autocomplete, { loading: loadingProducts, loadingText: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.autoCompleteProductsLoading }, { children: (0, jsx_runtime_1.jsx)(material_1.CircularProgress, {}) })), id: "payment-products-autocomplete", className: classes.paymentProductsAutocompletePopperRoot, open: true, multiple: true, onClose: (_event, reason) => {
237
237
  if (reason === 'escape') {
238
238
  handleClose();
239
239
  }
@@ -24,13 +24,13 @@ const classes = {
24
24
  const Root = (0, material_1.styled)(lab_1.LoadingButton, {
25
25
  name: PREFIX,
26
26
  slot: 'Root',
27
- overridesResolver: (props, styles) => [styles.root, styles.voted]
28
- })(({ theme }) => ({}));
27
+ overridesResolver: (_props, styles) => [styles.root, styles.voted]
28
+ })(() => ({}));
29
29
  const DialogRoot = (0, material_1.styled)(BaseDialog_1.default, {
30
30
  name: PREFIX,
31
31
  slot: 'Root',
32
- overridesResolver: (props, styles) => styles.dialogRoot
33
- })(({ theme }) => ({}));
32
+ overridesResolver: (_props, styles) => styles.dialogRoot
33
+ })(() => ({}));
34
34
  /**
35
35
  * > API documentation for the Community-JS Vote Audience Button component. Learn about the available props and the CSS API.
36
36
 
@@ -69,13 +69,13 @@ function VoteAudienceButton(inProps) {
69
69
  // CONTEXT
70
70
  const scUserContext = (0, react_core_1.useSCUser)();
71
71
  // HANDLERS
72
- const handleOpen = (event) => {
72
+ const handleOpen = (_event) => {
73
73
  setOpen(true);
74
74
  };
75
- const handleClose = (event) => {
75
+ const handleClose = (_event) => {
76
76
  setOpen(false);
77
77
  };
78
- const handleChangeTab = (event, newValue) => {
78
+ const handleChangeTab = (_event, newValue) => {
79
79
  setTab(newValue);
80
80
  };
81
81
  // HOOKS
@@ -105,14 +105,14 @@ function VoteAudienceButton(inProps) {
105
105
  const audienceIcon = (0, react_1.useMemo)(() => {
106
106
  if (reactions.default && !isLoading && !error) {
107
107
  return ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ className: classes.reactionList }, { children: contributionReactionsCount &&
108
- contributionReactionsCount.slice(0, 3).map((count, i) => ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: (0, jsx_runtime_1.jsx)("img", { alt: count.reaction.label, src: count.reaction.image, width: "100%", height: "100%" }) }, count.reaction.id))) })));
108
+ contributionReactionsCount.slice(0, 3).map((count, _i) => ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: (0, jsx_runtime_1.jsx)("img", { alt: count.reaction.label, src: count.reaction.image, width: "100%", height: "100%" }) }, count.reaction.id))) })));
109
109
  }
110
110
  return scUserContext.user && contributionVoted ? (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "thumb_up" }) : (0, jsx_runtime_1.jsx)(material_1.Icon, { children: "thumb_up_off_alt" });
111
111
  }, [reactions.default, isLoading, error, contributionReactionsCount, scUserContext.user, contributionVoted]);
112
112
  const dialogTitle = (0, react_1.useMemo)(() => {
113
113
  if (reactions.default && !isLoading) {
114
114
  return ((0, jsx_runtime_1.jsxs)(material_1.Tabs, Object.assign({ className: classes.dialogTabs, value: tab, onChange: handleChangeTab, "aria-label": "reactions" }, { children: [(0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.voteAudienceButton.dialog.tab.all", id: "ui.voteAudienceButton.dialog.tab.all" }) }), contributionReactionsCount &&
115
- contributionReactionsCount.map((count) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, { children: (0, jsx_runtime_1.jsx)("img", { alt: count.reaction.label, src: count.reaction.image, width: "100%", height: "100%" }) }), count.count] }) }, count.reaction.id)))] })));
115
+ contributionReactionsCount.map((count) => ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Icon, Object.assign({ fontSize: "medium" }, { children: (0, jsx_runtime_1.jsx)("img", { alt: count.reaction.label, src: count.reaction.image, width: "100%", height: "100%" }) })), count.count] }) }, count.reaction.id)))] })));
116
116
  }
117
117
  else {
118
118
  return (0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { defaultMessage: "ui.voteAudienceButton.dialog.title", id: "ui.voteAudienceButton.dialog.title" });
@@ -22,12 +22,12 @@ const classes = {
22
22
  const Root = (0, material_1.styled)(lab_1.LoadingButton, {
23
23
  name: PREFIX,
24
24
  slot: 'Root',
25
- overridesResolver: (props, styles) => [styles.root, styles.voted]
26
- })(({ theme }) => ({}));
25
+ overridesResolver: (_props, styles) => [styles.root, styles.voted]
26
+ })(() => ({}));
27
27
  const PopperRoot = (0, material_1.styled)(material_1.Popper, {
28
28
  name: PREFIX,
29
29
  slot: 'Root',
30
- overridesResolver: (props, styles) => styles.popperRoot
30
+ overridesResolver: (_props, styles) => styles.popperRoot
31
31
  })(() => ({}));
32
32
  /**
33
33
  * > API documentation for the Community-JS Vote Button component. Learn about the available props and the CSS API.
@@ -72,7 +72,7 @@ function VoteButton(inProps) {
72
72
  handleClearTimeout();
73
73
  timeoutRef.current = setTimeout(() => setAnchorEl(event.target), 1000);
74
74
  };
75
- const handleMouseLeave = (event) => {
75
+ const handleMouseLeave = (_event) => {
76
76
  handleClearTimeout();
77
77
  timeoutRef.current = setTimeout(() => setAnchorEl(null), 500);
78
78
  };
@@ -141,9 +141,9 @@ function VoteButton(inProps) {
141
141
  ? handleMouseEnter
142
142
  : () => handleVoteAction(contributionReaction ? contributionReaction : reactions.default ? reactions.default : null), disabled: isLoading || Boolean(error), loading: isVoting, className: (0, classnames_1.default)(classes.root, className, {
143
143
  [classes.voted]: scUserContext.user && contributionVoted
144
- }) }, rest, rootProps, { children: scUserContext.user && contributionVoted ? (contributionReaction ? ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: (0, jsx_runtime_1.jsx)("img", { alt: contributionReaction.label, src: contributionReaction.image, width: "100%", height: "100%" }) })) : ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: "thumb_up" }))) : ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: "thumb_up_off_alt" })) })));
144
+ }) }, rest, rootProps, { children: scUserContext.user && contributionVoted ? (contributionReaction ? ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: contributionReaction.label }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: (0, jsx_runtime_1.jsx)("img", { alt: contributionReaction.label, src: contributionReaction.image, width: "100%", height: "100%" }) }) }))) : ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: "thumb_up" }))) : ((0, jsx_runtime_1.jsx)(material_1.Icon, { children: "thumb_up_off_alt" })) })));
145
145
  return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [reactions.default ? (button) : ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: contributionVoted ? ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.voteButton.voteDown", defaultMessage: "ui.voteButton.voteDown" })) : ((0, jsx_runtime_1.jsx)(react_intl_1.FormattedMessage, { id: "ui.voteButton.voteUp", defaultMessage: "ui.voteButton.voteUp" })) }, { children: (0, jsx_runtime_1.jsx)("span", { children: button }) }))), reactions.default && Boolean(anchorEl) && !isVoting && !isLoading && ((0, jsx_runtime_1.jsx)(PopperRoot, Object.assign({ id: `vote_${contributionId}_${contributionType}_popper`, className: classes.popperRoot, open: true, anchorEl: anchorEl, placement: "top", keepMounted: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Paper, Object.assign({ className: classes.reactionList, onMouseEnter: handleClearTimeout, onMouseLeave: handleMouseLeave }, { children: reactions.reactions
146
146
  .filter((reaction) => !contributionVoted || (contributionVoted && contributionReaction.id !== reaction.id) ? reaction.active : reaction)
147
- .map((reaction) => ((0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.reaction, onClick: () => handleVoteAction(reaction) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: (0, jsx_runtime_1.jsx)("img", { alt: reaction.label, src: reaction.image, width: "100%", height: "100%" }) }) }), reaction.id))) })) })))] }));
147
+ .map((reaction) => ((0, jsx_runtime_1.jsx)(material_1.Tooltip, Object.assign({ title: reaction.label }, { children: (0, jsx_runtime_1.jsx)(material_1.IconButton, Object.assign({ className: classes.reaction, onClick: () => handleVoteAction(reaction) }, { children: (0, jsx_runtime_1.jsx)(material_1.Icon, { children: (0, jsx_runtime_1.jsx)("img", { alt: reaction.label, src: reaction.image, width: "100%", height: "100%" }) }) })) }), reaction.id))) })) })))] }));
148
148
  }
149
149
  exports.default = VoteButton;
@@ -102,7 +102,7 @@ export default function CategoryFollowButton(inProps) {
102
102
  if (!scCategory || !categoryFollowEnabled || (scCategory && followed && scCategory.auto_follow === SCCategoryAutoFollowType.FORCED)) {
103
103
  return null;
104
104
  }
105
- if (scCategoriesManager.isLoading(scCategory) || followed === null) {
105
+ if (scUserContext.user && (scCategoriesManager.isLoading(scCategory) || followed === null)) {
106
106
  return (_jsx(Root, Object.assign({ size: "small", variant: "outlined", loading: true, className: classNames(classes.root, className) }, { children: _jsx(FormattedMessage, { defaultMessage: "ui.categoryFollowButton.follow", id: "ui.categoryFollowButton.follow" }) })));
107
107
  }
108
108
  /**
@@ -84,7 +84,7 @@ export default function PaywallsConfigurator(inProps) {
84
84
  * Handle change content type access
85
85
  * @param panel
86
86
  */
87
- const handleChange = (panel) => (event, isExpanded) => {
87
+ const handleChange = (panel) => (_event, _isExpanded) => {
88
88
  setExpanded(panel);
89
89
  onChangeContentAccessType(panel);
90
90
  };
@@ -113,7 +113,7 @@ export default function PaywallsConfigurator(inProps) {
113
113
  onChangePaymentProducts === null || onChangePaymentProducts === void 0 ? void 0 : onChangePaymentProducts(products);
114
114
  handleToggleCreatePaymentPrice();
115
115
  };
116
- const handleDeleteProduct = (p, i) => {
116
+ const handleDeleteProduct = (_p, i) => {
117
117
  const products = [...value.slice(0, i), ...value.slice(i + 1)];
118
118
  setValue(products);
119
119
  onChangePaymentProducts === null || onChangePaymentProducts === void 0 ? void 0 : onChangePaymentProducts(products);
@@ -141,7 +141,7 @@ export default function PaywallsConfigurator(inProps) {
141
141
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
142
142
  // @ts-ignore
143
143
  const { key } = props, optionProps = __rest(props, ["key"]);
144
- return (_jsxs("li", Object.assign({}, optionProps, (selected && { style: { backgroundColor: '#f9fafc' } }), { children: [_jsx(Box, Object.assign({ className: classes.productItemCheckIcon, style: { visibility: selected ? 'visible' : 'hidden' } }, { children: _jsx(Icon, { children: "check" }) })), _jsx(Box, Object.assign({ component: "span", className: classes.productItemCardIcon }, { children: _jsx(Icon, { children: "card_giftcard" }) })), _jsxs(Box, Object.assign({ className: classes.productItemContent }, { children: [option.name, _jsx("br", {}), option.payment_prices && option.payment_prices[0] && (_jsxs(_Fragment, { children: [_jsx("span", { children: getConvertedAmount(option.payment_prices[0]) }), ' ', option.payment_prices.length > 1 && _jsxs(_Fragment, { children: ["+", option.payment_prices.length - 1] })] }))] })), _jsx(Box, Object.assign({ className: classes.productItemRemoveIcon, style: { visibility: selected ? 'visible' : 'hidden' } }, { children: _jsx(Icon, { children: "arrow" }) }))] }), option.id));
144
+ return (_jsxs("li", Object.assign({}, optionProps, (selected && { style: { backgroundColor: '#f9fafc' } }), { children: [_jsx(Box, Object.assign({ className: classes.productItemCheckIcon, style: { visibility: selected ? 'visible' : 'hidden' } }, { children: _jsx(Icon, { children: "check" }) })), _jsx(Box, Object.assign({ component: "span", className: classes.productItemCardIcon }, { children: _jsx(Icon, { children: "pagamenti" }) })), _jsxs(Box, Object.assign({ className: classes.productItemContent }, { children: [option.name, _jsx("br", {}), option.payment_prices && option.payment_prices[0] && (_jsxs(_Fragment, { children: [_jsx("span", { children: getConvertedAmount(option.payment_prices[0]) }), ' ', option.payment_prices.length > 1 && _jsxs(_Fragment, { children: ["+", option.payment_prices.length - 1] })] }))] })), _jsx(Box, Object.assign({ className: classes.productItemRemoveIcon, style: { visibility: selected ? 'visible' : 'hidden' } }, { children: _jsx(Icon, { children: "arrow" }) }))] }), option.id));
145
145
  };
146
146
  /**
147
147
  * Fetch events
@@ -220,7 +220,7 @@ export default function PaywallsConfigurator(inProps) {
220
220
  defaultMessage: 'ui.paywallsConfigurator.connected.noProducts'
221
221
  }) }) }), -1)), value.map((p, i) => {
222
222
  var _a, _b, _c;
223
- return (_jsxs(ListItem, Object.assign({ secondaryAction: _jsx(Button, Object.assign({ variant: "contained", color: "secondary", size: "small", onClick: () => handleDeleteProduct(p, i), startIcon: _jsx(Icon, { children: "delete" }) }, { children: _jsx(FormattedMessage, { id: "ui.paywallsConfigurator.connected.products.btnRemove", defaultMessage: "ui.paywallsConfigurator.connected.products.btnRemove" }) })), divider: true }, { children: [_jsx(ListItemAvatar, { children: _jsx(Avatar, { children: _jsx(Icon, { children: "card_giftcard" }) }) }), _jsx(ListItemText, { primary: p.name, secondary: `Prices: ${((_a = p.payment_prices) === null || _a === void 0 ? void 0 : _a.length)
223
+ return (_jsxs(ListItem, Object.assign({ secondaryAction: _jsx(Button, Object.assign({ variant: "contained", color: "secondary", size: "small", onClick: () => handleDeleteProduct(p, i), startIcon: _jsx(Icon, { children: "delete" }) }, { children: _jsx(FormattedMessage, { id: "ui.paywallsConfigurator.connected.products.btnRemove", defaultMessage: "ui.paywallsConfigurator.connected.products.btnRemove" }) })), divider: true }, { children: [_jsx(ListItemAvatar, { children: _jsx(Avatar, { children: _jsx(Icon, { children: "dredit-card" }) }) }), _jsx(ListItemText, { primary: p.name, secondary: `Prices: ${((_a = p.payment_prices) === null || _a === void 0 ? void 0 : _a.length)
224
224
  ? p.payment_prices
225
225
  .slice(0, 3)
226
226
  .map((price) => getConvertedAmount(price))
@@ -231,7 +231,7 @@ export default function PaywallsConfigurator(inProps) {
231
231
  defaultMessage: 'ui.paywallsConfigurator.connected.products.others'
232
232
  }, { count: ((_c = p.payment_prices) === null || _c === void 0 ? void 0 : _c.length) - 3 })
233
233
  : ''}` })] }), i));
234
- })] })), _jsx(Button, Object.assign({ variant: "outlined", size: "small", fullWidth: true, disableRipple: true, onClick: handleOpenPricesList, startIcon: _jsx(Icon, { children: "list" }) }, { children: _jsx(FormattedMessage, { id: "ui.paywallsConfigurator.openPriceslist", defaultMessage: "ui.paywallsConfigurator.openPriceslist" }) }))] })), !loading && (_jsx(PaymentProductsPopper, Object.assign({ id: open ? 'payment-products' : undefined, open: open, anchorEl: anchorEl, placement: "bottom-start" }, { children: _jsx(ClickAwayListener, Object.assign({ onClickAway: handleClose }, { children: _jsxs(Box, { children: [_jsx(Box, Object.assign({ className: classes.paymentProductsPopperTitle }, { children: _jsx(FormattedMessage, { id: "ui.paywallsConfigurator.connected.products.content", defaultMessage: "ui.paywallsConfigurator.connected.products.content" }) })), _jsx(Autocomplete, { loading: loadingProducts, loadingText: _jsx(Box, Object.assign({ className: classes.autoCompleteProductsLoading }, { children: _jsx(CircularProgress, {}) })), id: "payment-products-autocomplete", className: classes.paymentProductsAutocompletePopperRoot, open: true, multiple: true, onClose: (event, reason) => {
234
+ })] })), _jsx(Button, Object.assign({ variant: "outlined", size: "small", fullWidth: true, disableRipple: true, onClick: handleOpenPricesList, startIcon: _jsx(Icon, { children: "list" }) }, { children: _jsx(FormattedMessage, { id: "ui.paywallsConfigurator.openPriceslist", defaultMessage: "ui.paywallsConfigurator.openPriceslist" }) }))] })), !loading && (_jsx(PaymentProductsPopper, Object.assign({ id: open ? 'payment-products' : undefined, open: open, anchorEl: anchorEl, placement: "bottom-start" }, { children: _jsx(ClickAwayListener, Object.assign({ onClickAway: handleClose }, { children: _jsxs(Box, { children: [_jsx(Box, Object.assign({ className: classes.paymentProductsPopperTitle }, { children: _jsx(FormattedMessage, { id: "ui.paywallsConfigurator.connected.products.content", defaultMessage: "ui.paywallsConfigurator.connected.products.content" }) })), _jsx(Autocomplete, { loading: loadingProducts, loadingText: _jsx(Box, Object.assign({ className: classes.autoCompleteProductsLoading }, { children: _jsx(CircularProgress, {}) })), id: "payment-products-autocomplete", className: classes.paymentProductsAutocompletePopperRoot, open: true, multiple: true, onClose: (_event, reason) => {
235
235
  if (reason === 'escape') {
236
236
  handleClose();
237
237
  }
@@ -22,13 +22,13 @@ const classes = {
22
22
  const Root = styled(LoadingButton, {
23
23
  name: PREFIX,
24
24
  slot: 'Root',
25
- overridesResolver: (props, styles) => [styles.root, styles.voted]
26
- })(({ theme }) => ({}));
25
+ overridesResolver: (_props, styles) => [styles.root, styles.voted]
26
+ })(() => ({}));
27
27
  const DialogRoot = styled(BaseDialog, {
28
28
  name: PREFIX,
29
29
  slot: 'Root',
30
- overridesResolver: (props, styles) => styles.dialogRoot
31
- })(({ theme }) => ({}));
30
+ overridesResolver: (_props, styles) => styles.dialogRoot
31
+ })(() => ({}));
32
32
  /**
33
33
  * > API documentation for the Community-JS Vote Audience Button component. Learn about the available props and the CSS API.
34
34
 
@@ -67,13 +67,13 @@ export default function VoteAudienceButton(inProps) {
67
67
  // CONTEXT
68
68
  const scUserContext = useSCUser();
69
69
  // HANDLERS
70
- const handleOpen = (event) => {
70
+ const handleOpen = (_event) => {
71
71
  setOpen(true);
72
72
  };
73
- const handleClose = (event) => {
73
+ const handleClose = (_event) => {
74
74
  setOpen(false);
75
75
  };
76
- const handleChangeTab = (event, newValue) => {
76
+ const handleChangeTab = (_event, newValue) => {
77
77
  setTab(newValue);
78
78
  };
79
79
  // HOOKS
@@ -103,14 +103,14 @@ export default function VoteAudienceButton(inProps) {
103
103
  const audienceIcon = useMemo(() => {
104
104
  if (reactions.default && !isLoading && !error) {
105
105
  return (_jsx(Box, Object.assign({ className: classes.reactionList }, { children: contributionReactionsCount &&
106
- contributionReactionsCount.slice(0, 3).map((count, i) => (_jsx(Icon, { children: _jsx("img", { alt: count.reaction.label, src: count.reaction.image, width: "100%", height: "100%" }) }, count.reaction.id))) })));
106
+ contributionReactionsCount.slice(0, 3).map((count, _i) => (_jsx(Icon, { children: _jsx("img", { alt: count.reaction.label, src: count.reaction.image, width: "100%", height: "100%" }) }, count.reaction.id))) })));
107
107
  }
108
108
  return scUserContext.user && contributionVoted ? _jsx(Icon, { children: "thumb_up" }) : _jsx(Icon, { children: "thumb_up_off_alt" });
109
109
  }, [reactions.default, isLoading, error, contributionReactionsCount, scUserContext.user, contributionVoted]);
110
110
  const dialogTitle = useMemo(() => {
111
111
  if (reactions.default && !isLoading) {
112
112
  return (_jsxs(Tabs, Object.assign({ className: classes.dialogTabs, value: tab, onChange: handleChangeTab, "aria-label": "reactions" }, { children: [_jsx(Tab, { label: _jsx(FormattedMessage, { defaultMessage: "ui.voteAudienceButton.dialog.tab.all", id: "ui.voteAudienceButton.dialog.tab.all" }) }), contributionReactionsCount &&
113
- contributionReactionsCount.map((count) => (_jsx(Tab, { label: _jsxs(_Fragment, { children: [_jsx(Icon, { children: _jsx("img", { alt: count.reaction.label, src: count.reaction.image, width: "100%", height: "100%" }) }), count.count] }) }, count.reaction.id)))] })));
113
+ contributionReactionsCount.map((count) => (_jsx(Tab, { label: _jsxs(_Fragment, { children: [_jsx(Icon, Object.assign({ fontSize: "medium" }, { children: _jsx("img", { alt: count.reaction.label, src: count.reaction.image, width: "100%", height: "100%" }) })), count.count] }) }, count.reaction.id)))] })));
114
114
  }
115
115
  else {
116
116
  return _jsx(FormattedMessage, { defaultMessage: "ui.voteAudienceButton.dialog.title", id: "ui.voteAudienceButton.dialog.title" });
@@ -20,12 +20,12 @@ const classes = {
20
20
  const Root = styled(LoadingButton, {
21
21
  name: PREFIX,
22
22
  slot: 'Root',
23
- overridesResolver: (props, styles) => [styles.root, styles.voted]
24
- })(({ theme }) => ({}));
23
+ overridesResolver: (_props, styles) => [styles.root, styles.voted]
24
+ })(() => ({}));
25
25
  const PopperRoot = styled(Popper, {
26
26
  name: PREFIX,
27
27
  slot: 'Root',
28
- overridesResolver: (props, styles) => styles.popperRoot
28
+ overridesResolver: (_props, styles) => styles.popperRoot
29
29
  })(() => ({}));
30
30
  /**
31
31
  * > API documentation for the Community-JS Vote Button component. Learn about the available props and the CSS API.
@@ -70,7 +70,7 @@ export default function VoteButton(inProps) {
70
70
  handleClearTimeout();
71
71
  timeoutRef.current = setTimeout(() => setAnchorEl(event.target), 1000);
72
72
  };
73
- const handleMouseLeave = (event) => {
73
+ const handleMouseLeave = (_event) => {
74
74
  handleClearTimeout();
75
75
  timeoutRef.current = setTimeout(() => setAnchorEl(null), 500);
76
76
  };
@@ -139,8 +139,8 @@ export default function VoteButton(inProps) {
139
139
  ? handleMouseEnter
140
140
  : () => handleVoteAction(contributionReaction ? contributionReaction : reactions.default ? reactions.default : null), disabled: isLoading || Boolean(error), loading: isVoting, className: classNames(classes.root, className, {
141
141
  [classes.voted]: scUserContext.user && contributionVoted
142
- }) }, rest, rootProps, { children: scUserContext.user && contributionVoted ? (contributionReaction ? (_jsx(Icon, { children: _jsx("img", { alt: contributionReaction.label, src: contributionReaction.image, width: "100%", height: "100%" }) })) : (_jsx(Icon, { children: "thumb_up" }))) : (_jsx(Icon, { children: "thumb_up_off_alt" })) })));
142
+ }) }, rest, rootProps, { children: scUserContext.user && contributionVoted ? (contributionReaction ? (_jsx(Tooltip, Object.assign({ title: contributionReaction.label }, { children: _jsx(Icon, { children: _jsx("img", { alt: contributionReaction.label, src: contributionReaction.image, width: "100%", height: "100%" }) }) }))) : (_jsx(Icon, { children: "thumb_up" }))) : (_jsx(Icon, { children: "thumb_up_off_alt" })) })));
143
143
  return (_jsxs(_Fragment, { children: [reactions.default ? (button) : (_jsx(Tooltip, Object.assign({ title: contributionVoted ? (_jsx(FormattedMessage, { id: "ui.voteButton.voteDown", defaultMessage: "ui.voteButton.voteDown" })) : (_jsx(FormattedMessage, { id: "ui.voteButton.voteUp", defaultMessage: "ui.voteButton.voteUp" })) }, { children: _jsx("span", { children: button }) }))), reactions.default && Boolean(anchorEl) && !isVoting && !isLoading && (_jsx(PopperRoot, Object.assign({ id: `vote_${contributionId}_${contributionType}_popper`, className: classes.popperRoot, open: true, anchorEl: anchorEl, placement: "top", keepMounted: true }, { children: _jsx(Paper, Object.assign({ className: classes.reactionList, onMouseEnter: handleClearTimeout, onMouseLeave: handleMouseLeave }, { children: reactions.reactions
144
144
  .filter((reaction) => !contributionVoted || (contributionVoted && contributionReaction.id !== reaction.id) ? reaction.active : reaction)
145
- .map((reaction) => (_jsx(IconButton, Object.assign({ className: classes.reaction, onClick: () => handleVoteAction(reaction) }, { children: _jsx(Icon, { children: _jsx("img", { alt: reaction.label, src: reaction.image, width: "100%", height: "100%" }) }) }), reaction.id))) })) })))] }));
145
+ .map((reaction) => (_jsx(Tooltip, Object.assign({ title: reaction.label }, { children: _jsx(IconButton, Object.assign({ className: classes.reaction, onClick: () => handleVoteAction(reaction) }, { children: _jsx(Icon, { children: _jsx("img", { alt: reaction.label, src: reaction.image, width: "100%", height: "100%" }) }) })) }), reaction.id))) })) })))] }));
146
146
  }