@reltio/components 1.4.1920 → 1.4.1921

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 (13) hide show
  1. package/cjs/CollaborationItem/components/TextFieldWithMentions/TextFieldWithMentions.js +1 -0
  2. package/cjs/CollaborationItem/components/TextFieldWithMentions/styles.d.ts +1 -1
  3. package/cjs/CollaborationItem/components/TextFieldWithMentions/styles.js +4 -1
  4. package/cjs/EntitySelector/components/EntityOption/EntityOption.d.ts +2 -1
  5. package/cjs/EntitySelector/components/EntityOption/EntityOption.js +3 -2
  6. package/cjs/EntitySelector/components/EntityOption/styles.js +4 -1
  7. package/esm/CollaborationItem/components/TextFieldWithMentions/TextFieldWithMentions.js +1 -0
  8. package/esm/CollaborationItem/components/TextFieldWithMentions/styles.d.ts +1 -1
  9. package/esm/CollaborationItem/components/TextFieldWithMentions/styles.js +4 -1
  10. package/esm/EntitySelector/components/EntityOption/EntityOption.d.ts +2 -1
  11. package/esm/EntitySelector/components/EntityOption/EntityOption.js +3 -2
  12. package/esm/EntitySelector/components/EntityOption/styles.js +4 -1
  13. package/package.json +1 -1
package/cjs/CollaborationItem/components/TextFieldWithMentions/TextFieldWithMentions.js CHANGED
@@ -75,6 +75,7 @@ var TextFieldWithMentions = function (_a) {
75
75
  _b["".concat(MENTIONS_TEXTAREA_CLASSNAME, "__suggestions")] = styles.mentionsSuggestions,
76
76
  _b["".concat(MENTIONS_TEXTAREA_CLASSNAME, "__suggestions__list")] = styles.mentionsSuggestionsList,
77
77
  _b["".concat(MENTIONS_TEXTAREA_CLASSNAME, "__suggestions__item")] = styles.mentionsSuggestionsItem,
78
+ _b["".concat(MENTIONS_TEXTAREA_CLASSNAME, "__suggestions__item--focused")] = styles.mentionsSuggestionsItemFocused,
78
79
  _b) }),
79
80
  react_1.default.createElement(react_mentions_1.Mention, { trigger: "+", data: users.map(function (_a) {
80
81
  var username = _a.username;
package/cjs/CollaborationItem/components/TextFieldWithMentions/styles.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  type StylesProps = {
2
2
  placeholder?: string;
3
3
  };
4
- export declare const useStyles: (props: StylesProps) => import("@mui/styles").ClassNameMap<"root" | "mentionsControl" | "mentionsHighlighter" | "mentionsInput" | "mentionsSuggestions" | "mentionsSuggestionsList" | "mentionsSuggestionsItem" | "mention">;
4
+ export declare const useStyles: (props: StylesProps) => import("@mui/styles").ClassNameMap<"root" | "mentionsControl" | "mentionsHighlighter" | "mentionsInput" | "mentionsSuggestions" | "mentionsSuggestionsList" | "mentionsSuggestionsItem" | "mentionsSuggestionsItemFocused" | "mention">;
5
5
  export {};
package/cjs/CollaborationItem/components/TextFieldWithMentions/styles.js CHANGED
@@ -45,10 +45,13 @@ exports.useStyles = (0, styles_1.makeStyles)(function (theme) { return ({
45
45
  color: theme.palette.text.primary,
46
46
  fontSize: '13px',
47
47
  transition: theme.transitions.create(['background-color']),
48
- '&:hover, &--focused': {
48
+ '&:hover': {
49
49
  backgroundColor: 'rgba(0,0,0,0.04)'
50
50
  }
51
51
  },
52
+ mentionsSuggestionsItemFocused: {
53
+ backgroundColor: 'rgba(0,0,0,0.04)'
54
+ },
52
55
  mention: {
53
56
  position: 'relative',
54
57
  zIndex: 1,
package/cjs/EntitySelector/components/EntityOption/EntityOption.d.ts CHANGED
@@ -6,6 +6,7 @@ type Props = {
6
6
  innerRef: ForwardedRef<HTMLLIElement>;
7
7
  selectOption: (option: Partial<EntityOptionType>) => void;
8
8
  data: EntityOptionType;
9
+ isFocused: boolean;
9
10
  };
10
- export declare const EntityOption: ({ innerRef, innerProps, selectOption, data }: Props) => JSX.Element;
11
+ export declare const EntityOption: ({ innerRef, innerProps, selectOption, data, isFocused }: Props) => JSX.Element;
11
12
  export {};
package/cjs/EntitySelector/components/EntityOption/EntityOption.js CHANGED
@@ -17,16 +17,17 @@ Object.defineProperty(exports, "__esModule", { value: true });
17
17
  exports.EntityOption = void 0;
18
18
  var react_1 = __importDefault(require("react"));
19
19
  var ui_i18n_1 = __importDefault(require("ui-i18n"));
20
+ var classnames_1 = __importDefault(require("classnames"));
20
21
  var MenuItem_1 = __importDefault(require("@mui/material/MenuItem"));
21
22
  var EntityTypeIcon_1 = require("../../../EntityTypeIcon");
22
23
  var ExpandedValueTooltip_1 = require("../../../ExpandedValueTooltip");
23
24
  var styles_1 = require("./styles");
24
25
  var EntityOption = function (_a) {
25
- var innerRef = _a.innerRef, innerProps = _a.innerProps, selectOption = _a.selectOption, data = _a.data;
26
+ var innerRef = _a.innerRef, innerProps = _a.innerProps, selectOption = _a.selectOption, data = _a.data, isFocused = _a.isFocused;
26
27
  var styles = (0, styles_1.useStyles)();
27
28
  var uri = data.uri, entityType = data.entityType, label = data.label, secondaryLabel = data.secondaryLabel;
28
29
  if (uri !== '') {
29
- return (react_1.default.createElement(MenuItem_1.default, __assign({ className: styles.entityContainer, ref: innerRef, key: uri, onClick: function () { return selectOption({ label: label, uri: uri, entityType: entityType }); } }, innerProps),
30
+ return (react_1.default.createElement(MenuItem_1.default, __assign({ className: (0, classnames_1.default)(styles.entityContainer, { focused: isFocused }), ref: innerRef, key: uri, onClick: function () { return selectOption({ label: label, uri: uri, entityType: entityType }); } }, innerProps),
30
31
  react_1.default.createElement(EntityTypeIcon_1.EntityTypeIcon, { className: styles.entityAvatar, entityType: entityType }),
31
32
  react_1.default.createElement(ExpandedValueTooltip_1.ExpandedValueTooltip, { value: "".concat(label).concat(secondaryLabel ? ', ' + secondaryLabel : '') },
32
33
  react_1.default.createElement("span", { className: styles.entityLabel },
package/cjs/EntitySelector/components/EntityOption/styles.js CHANGED
@@ -8,7 +8,10 @@ exports.useStyles = (0, styles_1.makeStyles)({
8
8
  alignItems: 'center',
9
9
  height: '32px',
10
10
  minHeight: '32px',
11
- padding: 0
11
+ padding: 0,
12
+ '&.focused': {
13
+ backgroundColor: 'rgba(0,0,0,0.04)'
14
+ }
12
15
  },
13
16
  entityLabel: {
14
17
  height: '15px',
package/esm/CollaborationItem/components/TextFieldWithMentions/TextFieldWithMentions.js CHANGED
@@ -46,6 +46,7 @@ export var TextFieldWithMentions = function (_a) {
46
46
  _b["".concat(MENTIONS_TEXTAREA_CLASSNAME, "__suggestions")] = styles.mentionsSuggestions,
47
47
  _b["".concat(MENTIONS_TEXTAREA_CLASSNAME, "__suggestions__list")] = styles.mentionsSuggestionsList,
48
48
  _b["".concat(MENTIONS_TEXTAREA_CLASSNAME, "__suggestions__item")] = styles.mentionsSuggestionsItem,
49
+ _b["".concat(MENTIONS_TEXTAREA_CLASSNAME, "__suggestions__item--focused")] = styles.mentionsSuggestionsItemFocused,
49
50
  _b) }),
50
51
  React.createElement(Mention, { trigger: "+", data: users.map(function (_a) {
51
52
  var username = _a.username;
package/esm/CollaborationItem/components/TextFieldWithMentions/styles.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  type StylesProps = {
2
2
  placeholder?: string;
3
3
  };
4
- export declare const useStyles: (props: StylesProps) => import("@mui/styles").ClassNameMap<"root" | "mentionsControl" | "mentionsHighlighter" | "mentionsInput" | "mentionsSuggestions" | "mentionsSuggestionsList" | "mentionsSuggestionsItem" | "mention">;
4
+ export declare const useStyles: (props: StylesProps) => import("@mui/styles").ClassNameMap<"root" | "mentionsControl" | "mentionsHighlighter" | "mentionsInput" | "mentionsSuggestions" | "mentionsSuggestionsList" | "mentionsSuggestionsItem" | "mentionsSuggestionsItemFocused" | "mention">;
5
5
  export {};
package/esm/CollaborationItem/components/TextFieldWithMentions/styles.js CHANGED
@@ -42,10 +42,13 @@ export var useStyles = makeStyles(function (theme) { return ({
42
42
  color: theme.palette.text.primary,
43
43
  fontSize: '13px',
44
44
  transition: theme.transitions.create(['background-color']),
45
- '&:hover, &--focused': {
45
+ '&:hover': {
46
46
  backgroundColor: 'rgba(0,0,0,0.04)'
47
47
  }
48
48
  },
49
+ mentionsSuggestionsItemFocused: {
50
+ backgroundColor: 'rgba(0,0,0,0.04)'
51
+ },
49
52
  mention: {
50
53
  position: 'relative',
51
54
  zIndex: 1,
package/esm/EntitySelector/components/EntityOption/EntityOption.d.ts CHANGED
@@ -6,6 +6,7 @@ type Props = {
6
6
  innerRef: ForwardedRef<HTMLLIElement>;
7
7
  selectOption: (option: Partial<EntityOptionType>) => void;
8
8
  data: EntityOptionType;
9
+ isFocused: boolean;
9
10
  };
10
- export declare const EntityOption: ({ innerRef, innerProps, selectOption, data }: Props) => JSX.Element;
11
+ export declare const EntityOption: ({ innerRef, innerProps, selectOption, data, isFocused }: Props) => JSX.Element;
11
12
  export {};
package/esm/EntitySelector/components/EntityOption/EntityOption.js CHANGED
@@ -11,16 +11,17 @@ var __assign = (this && this.__assign) || function () {
11
11
  };
12
12
  import React from 'react';
13
13
  import i18n from 'ui-i18n';
14
+ import classNames from 'classnames';
14
15
  import MenuItem from '@mui/material/MenuItem';
15
16
  import { EntityTypeIcon } from '../../../EntityTypeIcon';
16
17
  import { ExpandedValueTooltip } from '../../../ExpandedValueTooltip';
17
18
  import { useStyles } from './styles';
18
19
  export var EntityOption = function (_a) {
19
- var innerRef = _a.innerRef, innerProps = _a.innerProps, selectOption = _a.selectOption, data = _a.data;
20
+ var innerRef = _a.innerRef, innerProps = _a.innerProps, selectOption = _a.selectOption, data = _a.data, isFocused = _a.isFocused;
20
21
  var styles = useStyles();
21
22
  var uri = data.uri, entityType = data.entityType, label = data.label, secondaryLabel = data.secondaryLabel;
22
23
  if (uri !== '') {
23
- return (React.createElement(MenuItem, __assign({ className: styles.entityContainer, ref: innerRef, key: uri, onClick: function () { return selectOption({ label: label, uri: uri, entityType: entityType }); } }, innerProps),
24
+ return (React.createElement(MenuItem, __assign({ className: classNames(styles.entityContainer, { focused: isFocused }), ref: innerRef, key: uri, onClick: function () { return selectOption({ label: label, uri: uri, entityType: entityType }); } }, innerProps),
24
25
  React.createElement(EntityTypeIcon, { className: styles.entityAvatar, entityType: entityType }),
25
26
  React.createElement(ExpandedValueTooltip, { value: "".concat(label).concat(secondaryLabel ? ', ' + secondaryLabel : '') },
26
27
  React.createElement("span", { className: styles.entityLabel },
package/esm/EntitySelector/components/EntityOption/styles.js CHANGED
@@ -5,7 +5,10 @@ export var useStyles = makeStyles({
5
5
  alignItems: 'center',
6
6
  height: '32px',
7
7
  minHeight: '32px',
8
- padding: 0
8
+ padding: 0,
9
+ '&.focused': {
10
+ backgroundColor: 'rgba(0,0,0,0.04)'
11
+ }
9
12
  },
10
13
  entityLabel: {
11
14
  height: '15px',
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@reltio/components",
3
- "version": "1.4.1920",
3
+ "version": "1.4.1921",
4
4
  "license": "SEE LICENSE IN LICENSE FILE",
5
5
  "main": "./cjs/index.js",
6
6
  "module": "./esm/index.js",