@headless-adminapp/fluent 1.4.22 → 1.4.23

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 (6) hide show
  1. package/CommandBar/MenuButton.js +39 -15
  2. package/CommandBar/MenuItem.js +1 -1
  3. package/DataGrid/CustomFilter/CustomFilter.js +1 -1
  4. package/DataGrid/CustomizeColumns/AddColumns.js +1 -1
  5. package/DataGrid/CustomizeColumns/CustomizeColumns.js +2 -2
  6. package/package.json +2 -2
package/CommandBar/MenuButton.js CHANGED
@@ -7,26 +7,52 @@ const react_1 = require("react");
7
7
  const MenuList_1 = require("./MenuList");
8
8
  const useStyles = (0, react_components_1.makeStyles)({
9
9
  splitButton: {
10
+ borderRadius: react_components_1.tokens.borderRadiusMedium,
10
11
  '& > button:first-child': {
11
12
  fontWeight: react_components_1.tokens.fontWeightRegular,
12
- borderRightColor: react_components_1.tokens.colorNeutralStroke3,
13
+ paddingRight: 0,
14
+ minWidth: 'unset',
15
+ backgroundColor: 'transparent !important',
16
+ },
17
+ '&:hover:not(:has(:last-child:hover))': {
18
+ backgroundColor: react_components_1.tokens.colorSubtleBackgroundHover,
19
+ '&:active': {
20
+ backgroundColor: react_components_1.tokens.colorSubtleBackgroundPressed,
21
+ },
13
22
  },
14
23
  },
15
24
  menuButton: {
16
25
  fontWeight: react_components_1.tokens.fontWeightRegular,
17
26
  },
18
27
  splitButtonDanger: {
19
- '& > button:first-child:hover': {
20
- color: react_components_1.tokens.colorPaletteRedForeground1,
21
- background: react_components_1.tokens.colorPaletteRedBackground1,
22
- '& .fui-Button__icon': {
23
- color: react_components_1.tokens.colorPaletteRedForeground1,
24
- },
28
+ '&:hover:not(:has(:last-child:hover))': {
29
+ backgroundColor: react_components_1.tokens.colorStatusDangerBackground1,
25
30
  '&:active': {
26
- color: react_components_1.tokens.colorPaletteRedForeground2,
27
- background: react_components_1.tokens.colorPaletteRedBackground2,
31
+ backgroundColor: react_components_1.tokens.colorStatusDangerBackground2,
32
+ },
33
+ },
34
+ '&:hover': {
35
+ '& > button:first-child': {
36
+ color: react_components_1.tokens.colorStatusDangerForeground1,
37
+ // color: tokens.colorPaletteRedForeground1,
38
+ // background: tokens.colorPaletteRedBackground1,
28
39
  '& .fui-Button__icon': {
29
- color: react_components_1.tokens.colorPaletteRedForeground2,
40
+ color: react_components_1.tokens.colorStatusDangerForeground1,
41
+ },
42
+ '&:active': {
43
+ color: react_components_1.tokens.colorStatusDangerForeground2,
44
+ // background: tokens.colorPaletteRedBackground2,
45
+ '& .fui-Button__icon': {
46
+ color: react_components_1.tokens.colorStatusDangerForeground2,
47
+ },
48
+ },
49
+ },
50
+ },
51
+ '& > button:last-child': {
52
+ '&:hover, &[aria-expanded="true"]': {
53
+ backgroundColor: react_components_1.tokens.colorStatusDangerBackground1,
54
+ '&:active': {
55
+ backgroundColor: react_components_1.tokens.colorStatusDangerBackground2,
30
56
  },
31
57
  },
32
58
  },
@@ -34,10 +60,8 @@ const useStyles = (0, react_components_1.makeStyles)({
34
60
  });
35
61
  exports.CommandMenuButton = (0, react_1.memo)((0, react_1.forwardRef)(function CommandMenuButton({ Icon, items, text, danger, disabled, onClick }, ref) {
36
62
  const styles = useStyles();
37
- return (
38
- // <div ref={ref}>
39
- (0, jsx_runtime_1.jsxs)(react_components_1.Menu, { hasIcons: true, positioning: "below-end", children: [onClick ? ((0, jsx_runtime_1.jsx)(react_components_1.MenuTrigger, { disableButtonEnhancement: true, children: (triggerProps) => ((0, jsx_runtime_1.jsx)(react_components_1.SplitButton, { ref: ref, icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), appearance: "subtle", className: (0, react_components_1.mergeClasses)(styles.splitButton, danger && styles.splitButtonDanger), menuButton: triggerProps, disabled: disabled, children: text })) })) : ((0, jsx_runtime_1.jsx)(react_components_1.MenuTrigger, { disableButtonEnhancement: true, children: (0, jsx_runtime_1.jsx)(react_components_1.MenuButton, { ref: ref, appearance: "subtle", icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), className: (0, react_components_1.mergeClasses)(styles.menuButton), children: text }) })), (0, jsx_runtime_1.jsx)(react_components_1.MenuPopover, { children: (0, jsx_runtime_1.jsx)(MenuList_1.MenuList, { items: items }) })] })
40
- // </div>
41
- );
63
+ return ((0, jsx_runtime_1.jsxs)(react_components_1.Menu, { hasIcons: true, positioning: "below-end", children: [onClick ? ((0, jsx_runtime_1.jsx)(react_components_1.MenuTrigger, { disableButtonEnhancement: true, children: (triggerProps) => ((0, jsx_runtime_1.jsx)(react_components_1.SplitButton, { ref: ref, icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), appearance: "subtle", className: (0, react_components_1.mergeClasses)(styles.splitButton, danger && styles.splitButtonDanger), menuButton: triggerProps, disabled: disabled, primaryActionButton: {
64
+ onClick,
65
+ }, children: text })) })) : ((0, jsx_runtime_1.jsx)(react_components_1.MenuTrigger, { disableButtonEnhancement: true, children: (0, jsx_runtime_1.jsx)(react_components_1.MenuButton, { ref: ref, appearance: "subtle", icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), className: (0, react_components_1.mergeClasses)(styles.menuButton), children: text }) })), (0, jsx_runtime_1.jsx)(react_components_1.MenuPopover, { children: (0, jsx_runtime_1.jsx)(MenuList_1.MenuList, { items: items }) })] }));
42
66
  }));
43
67
  exports.CommandMenuButton.displayName = 'CommandMenuButton';
package/CommandBar/MenuItem.js CHANGED
@@ -33,6 +33,6 @@ exports.MenuItem = (0, react_1.memo)(({ Icon, text, disabled, danger, onClick, i
33
33
  if (!items?.length) {
34
34
  return ((0, jsx_runtime_1.jsx)(react_components_1.MenuItem, { disabled: disabled, onClick: onClick, icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), className: (0, react_components_1.mergeClasses)(danger && styles.danger), children: text }));
35
35
  }
36
- return ((0, jsx_runtime_1.jsxs)(react_components_1.Menu, { hasIcons: true, children: [onClick ? ((0, jsx_runtime_1.jsxs)(react_components_1.MenuSplitGroup, { children: [(0, jsx_runtime_1.jsx)(react_components_1.MenuItem, { icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), className: (0, react_components_1.mergeClasses)(danger && styles.danger), children: text }), (0, jsx_runtime_1.jsx)(react_components_1.MenuTrigger, { disableButtonEnhancement: true, children: (0, jsx_runtime_1.jsx)(react_components_1.MenuItem, { className: (0, react_components_1.mergeClasses)(styles.splitMenuRight) }) })] })) : ((0, jsx_runtime_1.jsx)(react_components_1.MenuTrigger, { disableButtonEnhancement: true, children: (0, jsx_runtime_1.jsx)(react_components_1.MenuItem, { icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), children: text }) })), (0, jsx_runtime_1.jsx)(react_components_1.MenuPopover, { children: (0, jsx_runtime_1.jsx)(MenuList_1.MenuList, { items: items }) })] }));
36
+ return ((0, jsx_runtime_1.jsxs)(react_components_1.Menu, { hasIcons: true, children: [onClick ? ((0, jsx_runtime_1.jsxs)(react_components_1.MenuSplitGroup, { children: [(0, jsx_runtime_1.jsx)(react_components_1.MenuItem, { icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), className: (0, react_components_1.mergeClasses)(danger && styles.danger), onClick: onClick, children: text }), (0, jsx_runtime_1.jsx)(react_components_1.MenuTrigger, { disableButtonEnhancement: true, children: (0, jsx_runtime_1.jsx)(react_components_1.MenuItem, { className: (0, react_components_1.mergeClasses)(styles.splitMenuRight) }) })] })) : ((0, jsx_runtime_1.jsx)(react_components_1.MenuTrigger, { disableButtonEnhancement: true, children: (0, jsx_runtime_1.jsx)(react_components_1.MenuItem, { icon: (0, jsx_runtime_1.jsx)(Icon, { size: 20 }), children: text }) })), (0, jsx_runtime_1.jsx)(react_components_1.MenuPopover, { children: (0, jsx_runtime_1.jsx)(MenuList_1.MenuList, { items: items }) })] }));
37
37
  });
38
38
  exports.MenuItem.displayName = 'MenuItem';
package/DataGrid/CustomFilter/CustomFilter.js CHANGED
@@ -135,5 +135,5 @@ const DrawerContent = ({ onClose }) => {
135
135
  if (!value)
136
136
  return;
137
137
  handleAddFilter(value);
138
- }, options: attributeOptions.filter((x) => !columnFiltersInternal[x.value]) }) })] }) }), (0, jsx_runtime_1.jsxs)(DrawerFooter_1.DrawerFooter, { children: [(0, jsx_runtime_1.jsx)(react_components_1.Button, { appearance: "primary", disabled: !isValid, onClick: handleApply, children: "Apply" }), (0, jsx_runtime_1.jsx)(react_components_1.Button, { onClick: handleCancel, children: "Cancel" })] })] }));
138
+ }, options: attributeOptions.filter((x) => !columnFiltersInternal[x.value]) }) })] }) }), (0, jsx_runtime_1.jsxs)(DrawerFooter_1.DrawerFooter, { children: [(0, jsx_runtime_1.jsx)(react_components_1.Button, { appearance: "primary", disabled: !isValid, onClick: handleApply, style: { fontWeight: react_components_1.tokens.fontWeightRegular }, children: "Apply" }), (0, jsx_runtime_1.jsx)(react_components_1.Button, { onClick: handleCancel, style: { fontWeight: react_components_1.tokens.fontWeightRegular }, children: "Cancel" })] })] }));
139
139
  };
package/DataGrid/CustomizeColumns/AddColumns.js CHANGED
@@ -85,5 +85,5 @@ function AddColumns({ onColumnAdd, onColumnRemove, columns, opened, onClose, })
85
85
  else {
86
86
  onColumnAdd(column);
87
87
  }
88
- }, children: column.label }, column.id))) }), (0, jsx_runtime_1.jsx)(DrawerFooter_1.DrawerFooter, { children: (0, jsx_runtime_1.jsx)(react_components_1.Button, { onClick: onClose, children: strings.close }) })] }));
88
+ }, children: column.label }, column.id))) }), (0, jsx_runtime_1.jsx)(DrawerFooter_1.DrawerFooter, { children: (0, jsx_runtime_1.jsx)(react_components_1.Button, { onClick: onClose, style: { fontWeight: react_components_1.tokens.fontWeightRegular }, children: strings.close }) })] }));
89
89
  }
package/DataGrid/CustomizeColumns/CustomizeColumns.js CHANGED
@@ -62,7 +62,7 @@ function CustomizeColumns({ onClose, opened }) {
62
62
  columns: items,
63
63
  });
64
64
  onClose();
65
- }, appearance: "primary", children: strings.apply }), (0, jsx_runtime_1.jsx)(react_components_1.Button, { onClick: () => {
65
+ }, appearance: "primary", style: { fontWeight: react_components_1.tokens.fontWeightRegular }, children: strings.apply }), (0, jsx_runtime_1.jsx)(react_components_1.Button, { onClick: () => {
66
66
  onClose();
67
- }, children: strings.cancel })] })] }));
67
+ }, style: { fontWeight: react_components_1.tokens.fontWeightRegular }, children: strings.cancel })] })] }));
68
68
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@headless-adminapp/fluent",
3
- "version": "1.4.22",
3
+ "version": "1.4.23",
4
4
  "description": "",
5
5
  "main": "index.js",
6
6
  "types": "index.d.ts",
@@ -51,5 +51,5 @@
51
51
  "uuid": "11.0.3",
52
52
  "yup": "^1.4.0"
53
53
  },
54
- "gitHead": "8f687a2b8c3151c30c57f43105ac47c5d8c3ee79"
54
+ "gitHead": "1e2ade4328e5b2cfe223ab23318da6f456cb9de1"
55
55
  }