@fibery/ui-kit 1.33.1 → 1.33.3
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.
- package/package.json +3 -3
- package/src/actions-menu/actions-menu-item.tsx +4 -0
- package/src/button/base-button.tsx +8 -2
- package/src/button/button.tsx +4 -4
- package/src/design-system.ts +8 -2
- package/src/icons/ast/ClearInputFilled.ts +8 -0
- package/src/icons/ast/Duplicate.ts +8 -0
- package/src/icons/ast/GoTo.ts +8 -0
- package/src/icons/ast/MoveSpace.ts +8 -0
- package/src/icons/ast/PanelAdd.ts +8 -0
- package/src/icons/ast/RuleScheduled.ts +8 -0
- package/src/icons/ast/SearchAdd.ts +8 -0
- package/src/icons/ast/SearchRemove.ts +8 -0
- package/src/icons/ast/Unlink.ts +8 -0
- package/src/icons/ast/index.tsx +9 -0
- package/src/icons/react/ClearInputFilled.tsx +13 -0
- package/src/icons/react/Duplicate.tsx +13 -0
- package/src/icons/react/GoTo.tsx +13 -0
- package/src/icons/react/MoveSpace.tsx +13 -0
- package/src/icons/react/PanelAdd.tsx +13 -0
- package/src/icons/react/RuleScheduled.tsx +13 -0
- package/src/icons/react/SearchAdd.tsx +13 -0
- package/src/icons/react/SearchRemove.tsx +13 -0
- package/src/icons/react/Unlink.tsx +13 -0
- package/src/icons/react/index.tsx +9 -0
- package/src/select/select-in-popover.tsx +13 -6
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fibery/ui-kit",
|
|
3
|
-
"version": "1.33.
|
|
3
|
+
"version": "1.33.3",
|
|
4
4
|
"private": false,
|
|
5
5
|
"files": [
|
|
6
6
|
"src/antd/styles.ts",
|
|
@@ -108,8 +108,8 @@
|
|
|
108
108
|
"svgo": "2.8.0",
|
|
109
109
|
"typescript": "5.4.3",
|
|
110
110
|
"unist-util-reduce": "0.2.2",
|
|
111
|
-
"@fibery/
|
|
112
|
-
"@fibery/
|
|
111
|
+
"@fibery/babel-preset": "7.4.0",
|
|
112
|
+
"@fibery/eslint-config": "8.6.0"
|
|
113
113
|
},
|
|
114
114
|
"jest": {
|
|
115
115
|
"testEnvironment": "jsdom",
|
|
@@ -52,11 +52,15 @@ const dangerousConfirmationCss = css`
|
|
|
52
52
|
color: ${colors.inversedTextColor};
|
|
53
53
|
border-radius: ${border.radius6}px;
|
|
54
54
|
|
|
55
|
+
--actions-menu-item-icon-color: ${colors.inversedTextColor};
|
|
56
|
+
|
|
55
57
|
&:hover,
|
|
56
58
|
&[data-highlighted] {
|
|
57
59
|
background-color: ${themeVars.colorBgActionsMenuItemDangerActive};
|
|
58
60
|
color: ${colors.inversedTextColor};
|
|
59
61
|
border-radius: ${border.radius6}px;
|
|
62
|
+
|
|
63
|
+
--actions-menu-item-icon-color: ${colors.inversedTextColor};
|
|
60
64
|
}
|
|
61
65
|
}
|
|
62
66
|
`;
|
|
@@ -14,7 +14,6 @@ export type BaseButtonProps = {
|
|
|
14
14
|
} & React.ComponentPropsWithRef<"button">;
|
|
15
15
|
|
|
16
16
|
export const baseButton = css`
|
|
17
|
-
all: unset;
|
|
18
17
|
position: relative;
|
|
19
18
|
box-sizing: border-box;
|
|
20
19
|
|
|
@@ -62,6 +61,13 @@ export const baseButton = css`
|
|
|
62
61
|
}
|
|
63
62
|
`;
|
|
64
63
|
|
|
64
|
+
const reset = css`
|
|
65
|
+
/* make sure it doesn't reset properties set from outside (https://the.fibery.io/SoftDev/bug/Next-button-in-integration-is-flaky-and-can-be-out-of-style-10916) */
|
|
66
|
+
:global(:where(.${baseButton})) {
|
|
67
|
+
all: unset;
|
|
68
|
+
}
|
|
69
|
+
`;
|
|
70
|
+
|
|
65
71
|
const variantToThemeMod = {
|
|
66
72
|
solid: "Solid",
|
|
67
73
|
soft: "Soft",
|
|
@@ -109,7 +115,7 @@ export const BaseButton = forwardRef<HTMLButtonElement, BaseButtonProps>(
|
|
|
109
115
|
style={{...colors, ...style}}
|
|
110
116
|
aria-pressed={pressed || buttonProps["aria-pressed"]}
|
|
111
117
|
data-variant={variant}
|
|
112
|
-
className={cx(baseButton, className)}
|
|
118
|
+
className={cx(reset, baseButton, className)}
|
|
113
119
|
ref={ref}
|
|
114
120
|
// eslint-disable-next-line react/button-has-type
|
|
115
121
|
type={type}
|
package/src/button/button.tsx
CHANGED
|
@@ -56,8 +56,8 @@ const buttonSize = {
|
|
|
56
56
|
|
|
57
57
|
border-radius: ${border.radius6}px;
|
|
58
58
|
min-height: 28px;
|
|
59
|
-
padding: ${space.s4}px ${space.
|
|
60
|
-
gap: ${space.
|
|
59
|
+
padding: ${space.s4}px ${space.s10}px;
|
|
60
|
+
gap: ${space.s4}px;
|
|
61
61
|
|
|
62
62
|
${iconSizeVar}: 18px;
|
|
63
63
|
`,
|
|
@@ -68,8 +68,8 @@ const buttonSize = {
|
|
|
68
68
|
|
|
69
69
|
border-radius: ${border.radius6}px;
|
|
70
70
|
min-height: 32px;
|
|
71
|
-
padding: ${space.s6}px ${space.
|
|
72
|
-
gap: ${space.
|
|
71
|
+
padding: ${space.s6}px ${space.s12}px;
|
|
72
|
+
gap: ${space.s6}px;
|
|
73
73
|
|
|
74
74
|
${iconSizeVar}: 18px;
|
|
75
75
|
|
package/src/design-system.ts
CHANGED
|
@@ -322,7 +322,8 @@ export const themeColors = {
|
|
|
322
322
|
opacityListItemGeneralDisabled: [`${opacity.opacity40}`, `${opacity.opacity40}`],
|
|
323
323
|
|
|
324
324
|
// Search Items
|
|
325
|
-
|
|
325
|
+
colorBgSearchRowHover: [slate.slate4, slateDark.slate5],
|
|
326
|
+
colorBgSearchRowCreateHover: [indigo.indigo4, indigoDark.indigo4],
|
|
326
327
|
opacitySearchItemDone: [`${opacity.opacity40}`, `${opacity.opacity40}`],
|
|
327
328
|
// Entity Box Style And States
|
|
328
329
|
// Basic Entity Box State
|
|
@@ -564,7 +565,7 @@ export const themeColors = {
|
|
|
564
565
|
getOpacities(indigo.indigo11).opacity80,
|
|
565
566
|
getOpacities(indigoDark.indigo11).opacity80,
|
|
566
567
|
],
|
|
567
|
-
colorTextButtonOutlineNeutral: [slate.
|
|
568
|
+
colorTextButtonOutlineNeutral: [slate.slate11, slateDark.slate11],
|
|
568
569
|
colorTextButtonOutlineNeutralActive: [
|
|
569
570
|
getOpacities(slate.slate12).opacity80,
|
|
570
571
|
getOpacities(slateDark.slate12).opacity80,
|
|
@@ -624,6 +625,11 @@ export const themeColors = {
|
|
|
624
625
|
// Chat
|
|
625
626
|
colorBgMessageContainer: [slate.slate3, slateDark.slate6],
|
|
626
627
|
colorBgMessageContainerHover: [slate.slate2, slateDark.slate3],
|
|
628
|
+
|
|
629
|
+
colorBgEntityAvatarDefault: [indigo.indigo1, indigoDark.indigo1],
|
|
630
|
+
colorBgEntityAvatarHover: [indigo.indigo3, indigoDark.indigo3],
|
|
631
|
+
colorTextEntityAvatarDefault: [indigo.indigo8, indigoDark.indigo8],
|
|
632
|
+
colorTextEntityAvatarHover: [indigo.indigo9, indigoDark.indigo9],
|
|
627
633
|
} as const;
|
|
628
634
|
|
|
629
635
|
type ThemeDefs = typeof themeColors;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const ClearInputFilled: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","clipRule":"evenodd","d":"m1 10 4.4 5.28a2 2 0 0 0 1.537.72H16a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2H6.937a2 2 0 0 0-1.537.72L1 10Zm8.78-2.78a.75.75 0 0 0-1.06 1.06L10.44 10l-1.72 1.72a.75.75 0 1 0 1.06 1.06l1.72-1.72 1.72 1.72a.75.75 0 1 0 1.06-1.06L12.56 10l1.72-1.72a.75.75 0 0 0-1.06-1.06L11.5 8.94 9.78 7.22Z"},"children":[]}],"metadata":""}]},"name":"clear-input-filled"};
|
|
7
|
+
|
|
8
|
+
export default ClearInputFilled;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const Duplicate: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"d":"M2 3.75C2 2.784 2.784 2 3.75 2h7c.966 0 1.75.784 1.75 1.75V6H11V3.75a.25.25 0 0 0-.25-.25h-7a.25.25 0 0 0-.25.25v7c0 .138.112.25.25.25H6v1.5H3.75A1.75 1.75 0 0 1 2 10.75v-7Z"},"children":[]},{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","clipRule":"evenodd","d":"M9.25 7.5A1.75 1.75 0 0 0 7.5 9.25v7c0 .966.784 1.75 1.75 1.75h7A1.75 1.75 0 0 0 18 16.25v-7a1.75 1.75 0 0 0-1.75-1.75h-7ZM9 9.25A.25.25 0 0 1 9.25 9h7a.25.25 0 0 1 .25.25v7a.25.25 0 0 1-.25.25h-7a.25.25 0 0 1-.25-.25v-7Z"},"children":[]}],"metadata":""}]},"name":"duplicate"};
|
|
7
|
+
|
|
8
|
+
export default Duplicate;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const GoTo: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","clipRule":"evenodd","d":"M4.434 13.434a.8.8 0 1 0 1.132 1.132l4-4a.8.8 0 0 0 0-1.132l-4-4a.8.8 0 1 0-1.132 1.132L7.87 10l-3.435 3.434Zm6 0a.8.8 0 1 0 1.132 1.132l4-4a.8.8 0 0 0 0-1.132l-4-4a.8.8 0 0 0-1.132 1.132L13.87 10l-3.435 3.434Z"},"children":[]}],"metadata":""}]},"name":"go-to"};
|
|
7
|
+
|
|
8
|
+
export default GoTo;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const MoveSpace: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","clipRule":"evenodd","d":"M4.25 2A2.25 2.25 0 0 0 2 4.25V7a2.25 2.25 0 0 0 2.25 2.25H7A2.25 2.25 0 0 0 9.25 7V4.25A2.25 2.25 0 0 0 7 2H4.25Zm0 1.5a.75.75 0 0 0-.75.75V7c0 .414.336.75.75.75H7A.75.75 0 0 0 7.75 7V4.25A.75.75 0 0 0 7 3.5H4.25Zm6.5 9.5A2.25 2.25 0 0 1 13 10.75h2.75A2.25 2.25 0 0 1 18 13v2.75A2.25 2.25 0 0 1 15.75 18H13a2.25 2.25 0 0 1-2.25-2.25V13Zm1.5 0a.75.75 0 0 1 .75-.75h2.75a.75.75 0 0 1 .75.75v2.75a.75.75 0 0 1-.75.75H13a.75.75 0 0 1-.75-.75V13Zm2.25-5.5a2 2 0 1 0 0-4 2 2 0 0 0 0 4Zm0 1.5a3.5 3.5 0 1 0 0-7 3.5 3.5 0 0 0 0 7Zm-8.22 8.28a.75.75 0 1 1-1.06-1.06L6.44 15H2.75a.75.75 0 0 1 0-1.5h3.69l-1.22-1.22a.75.75 0 1 1 1.06-1.06l2.5 2.5a.75.75 0 0 1 0 1.06l-2.5 2.5Z"},"children":[]}],"metadata":""}]},"name":"move-space"};
|
|
7
|
+
|
|
8
|
+
export default MoveSpace;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const PanelAdd: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","clipRule":"evenodd","d":"M2 15.75A2.25 2.25 0 0 0 4.25 18h3a.75.75 0 0 0 0-1.5h-3a.75.75 0 0 1-.75-.75V4.25a.75.75 0 0 1 .75-.75h11.5a.75.75 0 0 1 .75.75v3a.75.75 0 0 0 1.5 0v-3A2.25 2.25 0 0 0 15.75 2H4.25A2.25 2.25 0 0 0 2 4.25v11.5Zm10.863-5.39a2.503 2.503 0 1 0 0 5.007 2.503 2.503 0 0 0 0-5.007Zm2.206 5.676a3.863 3.863 0 1 1 .963-.96l1.768 1.763a.68.68 0 1 1-.96.963l-1.771-1.766Z"},"children":[]}],"metadata":""}]},"name":"panel-add"};
|
|
7
|
+
|
|
8
|
+
export default PanelAdd;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const RuleScheduled: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"d":"M13.333 8.558 9.167 6.15a1.667 1.667 0 0 0-2.5 1.442v4.816a1.666 1.666 0 0 0 2.5 1.442l4.166-2.408a1.667 1.667 0 0 0 0-2.884ZM12.5 10l-4.167 2.408V7.592L12.5 10ZM10 1.667a8.333 8.333 0 1 0 0 16.666 8.333 8.333 0 0 0 0-16.666Zm0 15a6.667 6.667 0 1 1 0-13.334 6.667 6.667 0 0 1 0 13.334Z"},"children":[]}],"metadata":""}]},"name":"rule-scheduled"};
|
|
7
|
+
|
|
8
|
+
export default RuleScheduled;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const SearchAdd: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","clipRule":"evenodd","d":"M2.75 4a.75.75 0 0 0 0 1.5h13.5a.75.75 0 0 0 0-1.5H2.75Zm0 4a.75.75 0 0 0 0 1.5h4.5a.75.75 0 1 0 0-1.5h-4.5Zm10.113 7.727c.82 0 1.58-.256 2.206-.691l1.77 1.766a.68.68 0 0 0 .961-.963l-1.769-1.764a3.863 3.863 0 1 0-3.168 1.652Zm0-6.367a2.503 2.503 0 1 0 0 5.007 2.503 2.503 0 0 0 0-5.007Zm-9.018 7.468a.833.833 0 0 0 1.183 0l2.727-2.736a.837.837 0 0 0-1.183-1.184l-2.135 2.154-1.009-1.017a.836.836 0 1 0-1.183 1.184l1.6 1.6Z"},"children":[]}],"metadata":""}]},"name":"search-add"};
|
|
7
|
+
|
|
8
|
+
export default SearchAdd;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const SearchRemove: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"fillRule":"evenodd","clipRule":"evenodd","d":"M2.75 4a.75.75 0 0 0 0 1.5h13.5a.75.75 0 0 0 0-1.5H2.75Zm0 4a.75.75 0 0 0 0 1.5h4.5a.75.75 0 1 0 0-1.5h-4.5ZM16 11.5c0 .717-.216 1.384-.586 1.94l2.116 2.115a.75.75 0 0 1-1.06 1.06l-2.135-2.134A3.5 3.5 0 1 1 16 11.5Zm-1.5 0a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm-11.182 1a.75.75 0 1 0-1.06 1.06l1.06 1.061-1.06 1.061a.75.75 0 1 0 1.06 1.06l1.06-1.06 1.061 1.06a.75.75 0 1 0 1.061-1.06l-1.06-1.06L6.5 13.56A.75.75 0 0 0 5.44 12.5l-1.061 1.06-1.061-1.06Z"},"children":[]}],"metadata":""}]},"name":"search-remove"};
|
|
7
|
+
|
|
8
|
+
export default SearchRemove;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
|
|
2
|
+
// This icon file is generated automatically.
|
|
3
|
+
|
|
4
|
+
import { IconDefinition } from '../types';
|
|
5
|
+
|
|
6
|
+
const Unlink: IconDefinition = {"icon":{"type":"root","children":[{"type":"element","tagName":"svg","properties":{"viewBox":"0 0 20 20"},"children":[{"type":"element","tagName":"path","properties":{"d":"M3.28 2.22a.75.75 0 0 0-1.06 1.06L8.94 10l-1.922 1.921a.75.75 0 1 0 1.061 1.06L10 11.062l6.72 6.72a.75.75 0 1 0 1.06-1.061L3.28 2.22Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M3.954 8.857a5.083 5.083 0 0 0 7.19 7.189l.612-.613a.75.75 0 1 0-1.06-1.06l-.614.612a3.583 3.583 0 1 1-5.067-5.067l.613-.613a.75.75 0 1 0-1.061-1.061l-.613.613ZM8.244 4.567a.75.75 0 1 0 1.06 1.06l.613-.612a3.583 3.583 0 0 1 5.068 5.067l-.613.613a.75.75 0 0 0 1.06 1.061l.614-.613a5.083 5.083 0 1 0-7.19-7.189l-.612.613Z"},"children":[]},{"type":"element","tagName":"path","properties":{"d":"M11.308 7.631a.75.75 0 1 0 1.06 1.06l.614-.612a.75.75 0 1 0-1.061-1.06l-.613.612Z"},"children":[]}],"metadata":""}]},"name":"unlink"};
|
|
7
|
+
|
|
8
|
+
export default Unlink;
|
package/src/icons/ast/index.tsx
CHANGED
|
@@ -50,6 +50,7 @@ export { default as Chat } from './Chat';
|
|
|
50
50
|
export { default as CheckCircleFilled } from './CheckCircleFilled';
|
|
51
51
|
export { default as CheckCircle } from './CheckCircle';
|
|
52
52
|
export { default as Checked } from './Checked';
|
|
53
|
+
export { default as ClearInputFilled } from './ClearInputFilled';
|
|
53
54
|
export { default as ClearValue } from './ClearValue';
|
|
54
55
|
export { default as Clear } from './Clear';
|
|
55
56
|
export { default as ClockAlarm } from './ClockAlarm';
|
|
@@ -71,6 +72,7 @@ export { default as DoubleArrowRight } from './DoubleArrowRight';
|
|
|
71
72
|
export { default as DragBlockHandleSingle } from './DragBlockHandleSingle';
|
|
72
73
|
export { default as DragBlockHandle } from './DragBlockHandle';
|
|
73
74
|
export { default as DragHandle } from './DragHandle';
|
|
75
|
+
export { default as Duplicate } from './Duplicate';
|
|
74
76
|
export { default as DynamicFilterValue } from './DynamicFilterValue';
|
|
75
77
|
export { default as Email } from './Email';
|
|
76
78
|
export { default as EmojiDelete } from './EmojiDelete';
|
|
@@ -100,6 +102,7 @@ export { default as Github } from './Github';
|
|
|
100
102
|
export { default as Gitlab } from './Gitlab';
|
|
101
103
|
export { default as GlobeSimple } from './GlobeSimple';
|
|
102
104
|
export { default as Globe } from './Globe';
|
|
105
|
+
export { default as GoTo } from './GoTo';
|
|
103
106
|
export { default as GoogleDrive } from './GoogleDrive';
|
|
104
107
|
export { default as GoogleMap } from './GoogleMap';
|
|
105
108
|
export { default as HeadphonesAi } from './HeadphonesAi';
|
|
@@ -145,6 +148,7 @@ export { default as More } from './More';
|
|
|
145
148
|
export { default as MoveBottom } from './MoveBottom';
|
|
146
149
|
export { default as MoveLeft } from './MoveLeft';
|
|
147
150
|
export { default as MoveRight } from './MoveRight';
|
|
151
|
+
export { default as MoveSpace } from './MoveSpace';
|
|
148
152
|
export { default as MoveTop } from './MoveTop';
|
|
149
153
|
export { default as MySpace } from './MySpace';
|
|
150
154
|
export { default as NetworkAdd } from './NetworkAdd';
|
|
@@ -159,6 +163,7 @@ export { default as OnSchedule } from './OnSchedule';
|
|
|
159
163
|
export { default as OpenAsPage } from './OpenAsPage';
|
|
160
164
|
export { default as PageRegularMode } from './PageRegularMode';
|
|
161
165
|
export { default as PageWideMode } from './PageWideMode';
|
|
166
|
+
export { default as PanelAdd } from './PanelAdd';
|
|
162
167
|
export { default as Pencil } from './Pencil';
|
|
163
168
|
export { default as People } from './People';
|
|
164
169
|
export { default as Photo } from './Photo';
|
|
@@ -216,6 +221,9 @@ export { default as RicheditorUnlink } from './RicheditorUnlink';
|
|
|
216
221
|
export { default as RicheditorVideoUpload } from './RicheditorVideoUpload';
|
|
217
222
|
export { default as RightPanel } from './RightPanel';
|
|
218
223
|
export { default as Rows } from './Rows';
|
|
224
|
+
export { default as RuleScheduled } from './RuleScheduled';
|
|
225
|
+
export { default as SearchAdd } from './SearchAdd';
|
|
226
|
+
export { default as SearchRemove } from './SearchRemove';
|
|
219
227
|
export { default as Search } from './Search';
|
|
220
228
|
export { default as SelfReferenceOff } from './SelfReferenceOff';
|
|
221
229
|
export { default as SelfReferenceOn } from './SelfReferenceOn';
|
|
@@ -273,6 +281,7 @@ export { default as UnitsInput } from './UnitsInput';
|
|
|
273
281
|
export { default as UnitsProgressBar } from './UnitsProgressBar';
|
|
274
282
|
export { default as UnitsRichText } from './UnitsRichText';
|
|
275
283
|
export { default as UnitsSnippet } from './UnitsSnippet';
|
|
284
|
+
export { default as Unlink } from './Unlink';
|
|
276
285
|
export { default as Upgrade } from './Upgrade';
|
|
277
286
|
export { default as UsbFlashDrive } from './UsbFlashDrive';
|
|
278
287
|
export { default as UserRole } from './UserRole';
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import ClearInputFilledSvg from '../ast/ClearInputFilled';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const ClearInputFilled = forwardRef<SVGSVGElement, IconBaseProps>(function ClearInputFilled(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={ClearInputFilledSvg} />});
|
|
12
|
+
|
|
13
|
+
export default ClearInputFilled;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import DuplicateSvg from '../ast/Duplicate';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const Duplicate = forwardRef<SVGSVGElement, IconBaseProps>(function Duplicate(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={DuplicateSvg} />});
|
|
12
|
+
|
|
13
|
+
export default Duplicate;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import GoToSvg from '../ast/GoTo';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const GoTo = forwardRef<SVGSVGElement, IconBaseProps>(function GoTo(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={GoToSvg} />});
|
|
12
|
+
|
|
13
|
+
export default GoTo;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import MoveSpaceSvg from '../ast/MoveSpace';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const MoveSpace = forwardRef<SVGSVGElement, IconBaseProps>(function MoveSpace(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={MoveSpaceSvg} />});
|
|
12
|
+
|
|
13
|
+
export default MoveSpace;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import PanelAddSvg from '../ast/PanelAdd';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const PanelAdd = forwardRef<SVGSVGElement, IconBaseProps>(function PanelAdd(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={PanelAddSvg} />});
|
|
12
|
+
|
|
13
|
+
export default PanelAdd;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import RuleScheduledSvg from '../ast/RuleScheduled';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const RuleScheduled = forwardRef<SVGSVGElement, IconBaseProps>(function RuleScheduled(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={RuleScheduledSvg} />});
|
|
12
|
+
|
|
13
|
+
export default RuleScheduled;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import SearchAddSvg from '../ast/SearchAdd';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const SearchAdd = forwardRef<SVGSVGElement, IconBaseProps>(function SearchAdd(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={SearchAddSvg} />});
|
|
12
|
+
|
|
13
|
+
export default SearchAdd;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import SearchRemoveSvg from '../ast/SearchRemove';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const SearchRemove = forwardRef<SVGSVGElement, IconBaseProps>(function SearchRemove(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={SearchRemoveSvg} />});
|
|
12
|
+
|
|
13
|
+
export default SearchRemove;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
|
|
3
|
+
import {forwardRef} from 'react';
|
|
4
|
+
import UnlinkSvg from '../ast/Unlink';
|
|
5
|
+
import { Icon } from '../Icon';
|
|
6
|
+
import { IconBaseProps } from '../types';
|
|
7
|
+
|
|
8
|
+
const Unlink = forwardRef<SVGSVGElement, IconBaseProps>(function Unlink(
|
|
9
|
+
props: IconBaseProps,
|
|
10
|
+
ref: React.Ref<SVGSVGElement>
|
|
11
|
+
) {return <Icon {...props} className={props.className} ref={ref} icon={UnlinkSvg} />});
|
|
12
|
+
|
|
13
|
+
export default Unlink;
|
|
@@ -50,6 +50,7 @@ export { default as Chat } from './Chat';
|
|
|
50
50
|
export { default as CheckCircleFilled } from './CheckCircleFilled';
|
|
51
51
|
export { default as CheckCircle } from './CheckCircle';
|
|
52
52
|
export { default as Checked } from './Checked';
|
|
53
|
+
export { default as ClearInputFilled } from './ClearInputFilled';
|
|
53
54
|
export { default as ClearValue } from './ClearValue';
|
|
54
55
|
export { default as Clear } from './Clear';
|
|
55
56
|
export { default as ClockAlarm } from './ClockAlarm';
|
|
@@ -71,6 +72,7 @@ export { default as DoubleArrowRight } from './DoubleArrowRight';
|
|
|
71
72
|
export { default as DragBlockHandleSingle } from './DragBlockHandleSingle';
|
|
72
73
|
export { default as DragBlockHandle } from './DragBlockHandle';
|
|
73
74
|
export { default as DragHandle } from './DragHandle';
|
|
75
|
+
export { default as Duplicate } from './Duplicate';
|
|
74
76
|
export { default as DynamicFilterValue } from './DynamicFilterValue';
|
|
75
77
|
export { default as Email } from './Email';
|
|
76
78
|
export { default as EmojiDelete } from './EmojiDelete';
|
|
@@ -100,6 +102,7 @@ export { default as Github } from './Github';
|
|
|
100
102
|
export { default as Gitlab } from './Gitlab';
|
|
101
103
|
export { default as GlobeSimple } from './GlobeSimple';
|
|
102
104
|
export { default as Globe } from './Globe';
|
|
105
|
+
export { default as GoTo } from './GoTo';
|
|
103
106
|
export { default as GoogleDrive } from './GoogleDrive';
|
|
104
107
|
export { default as GoogleMap } from './GoogleMap';
|
|
105
108
|
export { default as HeadphonesAi } from './HeadphonesAi';
|
|
@@ -145,6 +148,7 @@ export { default as More } from './More';
|
|
|
145
148
|
export { default as MoveBottom } from './MoveBottom';
|
|
146
149
|
export { default as MoveLeft } from './MoveLeft';
|
|
147
150
|
export { default as MoveRight } from './MoveRight';
|
|
151
|
+
export { default as MoveSpace } from './MoveSpace';
|
|
148
152
|
export { default as MoveTop } from './MoveTop';
|
|
149
153
|
export { default as MySpace } from './MySpace';
|
|
150
154
|
export { default as NetworkAdd } from './NetworkAdd';
|
|
@@ -159,6 +163,7 @@ export { default as OnSchedule } from './OnSchedule';
|
|
|
159
163
|
export { default as OpenAsPage } from './OpenAsPage';
|
|
160
164
|
export { default as PageRegularMode } from './PageRegularMode';
|
|
161
165
|
export { default as PageWideMode } from './PageWideMode';
|
|
166
|
+
export { default as PanelAdd } from './PanelAdd';
|
|
162
167
|
export { default as Pencil } from './Pencil';
|
|
163
168
|
export { default as People } from './People';
|
|
164
169
|
export { default as Photo } from './Photo';
|
|
@@ -216,6 +221,9 @@ export { default as RicheditorUnlink } from './RicheditorUnlink';
|
|
|
216
221
|
export { default as RicheditorVideoUpload } from './RicheditorVideoUpload';
|
|
217
222
|
export { default as RightPanel } from './RightPanel';
|
|
218
223
|
export { default as Rows } from './Rows';
|
|
224
|
+
export { default as RuleScheduled } from './RuleScheduled';
|
|
225
|
+
export { default as SearchAdd } from './SearchAdd';
|
|
226
|
+
export { default as SearchRemove } from './SearchRemove';
|
|
219
227
|
export { default as Search } from './Search';
|
|
220
228
|
export { default as SelfReferenceOff } from './SelfReferenceOff';
|
|
221
229
|
export { default as SelfReferenceOn } from './SelfReferenceOn';
|
|
@@ -273,6 +281,7 @@ export { default as UnitsInput } from './UnitsInput';
|
|
|
273
281
|
export { default as UnitsProgressBar } from './UnitsProgressBar';
|
|
274
282
|
export { default as UnitsRichText } from './UnitsRichText';
|
|
275
283
|
export { default as UnitsSnippet } from './UnitsSnippet';
|
|
284
|
+
export { default as Unlink } from './Unlink';
|
|
276
285
|
export { default as Upgrade } from './Upgrade';
|
|
277
286
|
export { default as UsbFlashDrive } from './UsbFlashDrive';
|
|
278
287
|
export { default as UserRole } from './UserRole';
|
|
@@ -29,6 +29,7 @@ import {
|
|
|
29
29
|
import {SelectControlSettingsProvider} from "./select-control-settings-context";
|
|
30
30
|
import {Menu} from "./custom-select-partials/menu";
|
|
31
31
|
import {useIsPhone} from "../use-is-phone";
|
|
32
|
+
import {useControllableState} from "@fibery/react/src/use-controllable-state";
|
|
32
33
|
|
|
33
34
|
const offset = [0, space.s4] as [number, number];
|
|
34
35
|
const popupHeightVH = 45;
|
|
@@ -124,8 +125,8 @@ export const selectInPopupStyles = {
|
|
|
124
125
|
export type TriggerProps = {
|
|
125
126
|
innerRef: React.Ref<HTMLDivElement>;
|
|
126
127
|
children: ReactNode;
|
|
127
|
-
onClick
|
|
128
|
-
onKeyDown
|
|
128
|
+
onClick?: React.MouseEventHandler;
|
|
129
|
+
onKeyDown?: React.KeyboardEventHandler;
|
|
129
130
|
disabled?: boolean;
|
|
130
131
|
};
|
|
131
132
|
|
|
@@ -190,7 +191,7 @@ function SelectInPopoverInner<Option, IsMulti extends boolean, Group extends Gro
|
|
|
190
191
|
const {
|
|
191
192
|
value,
|
|
192
193
|
virtualized,
|
|
193
|
-
menuIsOpen
|
|
194
|
+
menuIsOpen,
|
|
194
195
|
autoFocus,
|
|
195
196
|
defaultMenuIsOpen,
|
|
196
197
|
placeholder,
|
|
@@ -218,7 +219,13 @@ function SelectInPopoverInner<Option, IsMulti extends boolean, Group extends Gro
|
|
|
218
219
|
getPopupContainer,
|
|
219
220
|
} = props;
|
|
220
221
|
const [triggerElement, setTriggerElement] = useState<HTMLDivElement | null>(null);
|
|
221
|
-
const [visible, setVisible] =
|
|
222
|
+
const [visible, setVisible] = useControllableState({
|
|
223
|
+
value: menuIsOpen,
|
|
224
|
+
defaultValue: false,
|
|
225
|
+
onChange: (value) => {
|
|
226
|
+
return value ? onMenuOpen?.() : onMenuClose?.();
|
|
227
|
+
},
|
|
228
|
+
});
|
|
222
229
|
const blurTimeoutRef = useRef<ReturnType<typeof setTimeout>>();
|
|
223
230
|
const selectRef = useRef<{focus: () => void}>(null);
|
|
224
231
|
const ref = useRef<HTMLDivElement | null>(null);
|
|
@@ -252,7 +259,7 @@ function SelectInPopoverInner<Option, IsMulti extends boolean, Group extends Gro
|
|
|
252
259
|
triggerElement?.focus();
|
|
253
260
|
}
|
|
254
261
|
},
|
|
255
|
-
[onMenuClose, triggerElement]
|
|
262
|
+
[onMenuClose, setVisible, triggerElement]
|
|
256
263
|
);
|
|
257
264
|
|
|
258
265
|
useEffect(() => {
|
|
@@ -278,7 +285,7 @@ function SelectInPopoverInner<Option, IsMulti extends boolean, Group extends Gro
|
|
|
278
285
|
if (onMenuOpen) {
|
|
279
286
|
onMenuOpen();
|
|
280
287
|
}
|
|
281
|
-
}, [onMenuOpen]);
|
|
288
|
+
}, [onMenuOpen, setVisible]);
|
|
282
289
|
|
|
283
290
|
const styles = useMemo(() => {
|
|
284
291
|
return combineStyles<Option, IsMulti, Group>([selectInPopupStyles, selectStyles]);
|