smarthr-ui 64.0.1 → 65.0.0
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/esm/components/AppHeader/components/desktop/Navigation.js +32 -60
- package/esm/components/AppHeader/components/desktop/Navigation.js.map +1 -1
- package/esm/components/Dialog/FocusTrap.js +24 -23
- package/esm/components/Dialog/FocusTrap.js.map +1 -1
- package/esm/components/Dialog/useBodyScrollLock.js +8 -16
- package/esm/components/Dialog/useBodyScrollLock.js.map +1 -1
- package/esm/components/Dialog/useDialogPortal.js.map +1 -1
- package/esm/components/Dialog/useRemoteTrigger.js +5 -7
- package/esm/components/Dialog/useRemoteTrigger.js.map +1 -1
- package/esm/components/DropZone/DropZone.js +7 -4
- package/esm/components/DropZone/DropZone.js.map +1 -1
- package/esm/components/Dropdown/FilterDropdown/FilterDropdown.js +46 -18
- package/esm/components/Dropdown/FilterDropdown/FilterDropdown.js.map +1 -1
- package/esm/components/Dropdown/SortDropdown/useSortDropdown.d.ts +1 -1
- package/esm/components/FloatArea/FloatArea.d.ts +2 -2
- package/esm/components/FloatArea/FloatArea.js +4 -5
- package/esm/components/FloatArea/FloatArea.js.map +1 -1
- package/esm/components/FormControl/FormControl.js +76 -19
- package/esm/components/FormControl/FormControl.js.map +1 -1
- package/esm/components/Icon/DeprecatedIcon.d.ts +60 -60
- package/esm/components/Icon/Icon.d.ts +193 -193
- package/esm/components/Icon/Icon.js +194 -194
- package/esm/components/Icon/Icon.js.map +1 -1
- package/esm/components/Icon/LanguageIcon.d.ts +1 -1
- package/esm/components/Icon/SparklesIcon.d.ts +1 -1
- package/esm/components/Icon/WarningIcon.d.ts +1 -1
- package/esm/components/Icon/generateIcon.d.ts +1 -2
- package/esm/components/Icon/generateIcon.js +18 -11
- package/esm/components/Icon/generateIcon.js.map +1 -1
- package/esm/components/InformationPanel/InformationPanel.d.ts +3 -2
- package/esm/components/InformationPanel/InformationPanel.js +61 -21
- package/esm/components/InformationPanel/InformationPanel.js.map +1 -1
- package/esm/components/InputFile/InputFile.js +23 -12
- package/esm/components/InputFile/InputFile.js.map +1 -1
- package/esm/components/LineClamp/LineClamp.js +8 -11
- package/esm/components/LineClamp/LineClamp.js.map +1 -1
- package/esm/components/Pagination/Pagination.d.ts +4 -3
- package/esm/components/Pagination/Pagination.js +30 -29
- package/esm/components/Pagination/Pagination.js.map +1 -1
- package/esm/components/Pagination/PaginationControllerItemButton.d.ts +1 -1
- package/esm/components/Pagination/PaginationControllerItemButton.js +14 -11
- package/esm/components/Pagination/PaginationControllerItemButton.js.map +1 -1
- package/esm/components/Pagination/PaginationItemButton.d.ts +1 -1
- package/esm/components/Pagination/PaginationItemButton.js +12 -2
- package/esm/components/Pagination/PaginationItemButton.js.map +1 -1
- package/esm/components/RadioButton/RadioButton.js +10 -11
- package/esm/components/RadioButton/RadioButton.js.map +1 -1
- package/esm/components/RadioButtonPanel/RadioButtonPanel.js +6 -6
- package/esm/components/RadioButtonPanel/RadioButtonPanel.js.map +1 -1
- package/esm/components/Select/Select.d.ts +1 -0
- package/esm/components/Select/Select.js +16 -12
- package/esm/components/Select/Select.js.map +1 -1
- package/esm/components/Stepper/StepStatusIcon.d.ts +6 -2
- package/esm/components/Stepper/StepStatusIcon.js +25 -17
- package/esm/components/Stepper/StepStatusIcon.js.map +1 -1
- package/esm/components/Textarea/Textarea.js +34 -26
- package/esm/components/Textarea/Textarea.js.map +1 -1
- package/esm/libs/tabbable.js.map +1 -1
- package/esm/types/ResponseMessage.d.ts +3 -2
- package/esm/types/index.d.ts +1 -1
- package/lib/components/AppHeader/components/desktop/Navigation.js +33 -91
- package/lib/components/AppHeader/components/desktop/Navigation.js.map +1 -1
- package/lib/components/Dialog/FocusTrap.js +23 -22
- package/lib/components/Dialog/FocusTrap.js.map +1 -1
- package/lib/components/Dialog/useBodyScrollLock.js +7 -15
- package/lib/components/Dialog/useBodyScrollLock.js.map +1 -1
- package/lib/components/Dialog/useDialogPortal.js.map +1 -1
- package/lib/components/Dialog/useRemoteTrigger.js +5 -7
- package/lib/components/Dialog/useRemoteTrigger.js.map +1 -1
- package/lib/components/DropZone/DropZone.js +7 -4
- package/lib/components/DropZone/DropZone.js.map +1 -1
- package/lib/components/Dropdown/FilterDropdown/FilterDropdown.js +46 -18
- package/lib/components/Dropdown/FilterDropdown/FilterDropdown.js.map +1 -1
- package/lib/components/Dropdown/SortDropdown/useSortDropdown.d.ts +1 -1
- package/lib/components/FloatArea/FloatArea.d.ts +2 -2
- package/lib/components/FloatArea/FloatArea.js +4 -5
- package/lib/components/FloatArea/FloatArea.js.map +1 -1
- package/lib/components/FormControl/FormControl.js +76 -19
- package/lib/components/FormControl/FormControl.js.map +1 -1
- package/lib/components/Icon/DeprecatedIcon.d.ts +60 -60
- package/lib/components/Icon/Icon.d.ts +193 -193
- package/lib/components/Icon/Icon.js +193 -193
- package/lib/components/Icon/Icon.js.map +1 -1
- package/lib/components/Icon/LanguageIcon.d.ts +1 -1
- package/lib/components/Icon/SparklesIcon.d.ts +1 -1
- package/lib/components/Icon/WarningIcon.d.ts +1 -1
- package/lib/components/Icon/generateIcon.d.ts +1 -2
- package/lib/components/Icon/generateIcon.js +20 -14
- package/lib/components/Icon/generateIcon.js.map +1 -1
- package/lib/components/InformationPanel/InformationPanel.d.ts +3 -2
- package/lib/components/InformationPanel/InformationPanel.js +61 -21
- package/lib/components/InformationPanel/InformationPanel.js.map +1 -1
- package/lib/components/InputFile/InputFile.js +23 -12
- package/lib/components/InputFile/InputFile.js.map +1 -1
- package/lib/components/LineClamp/LineClamp.js +8 -11
- package/lib/components/LineClamp/LineClamp.js.map +1 -1
- package/lib/components/Pagination/Pagination.d.ts +4 -3
- package/lib/components/Pagination/Pagination.js +30 -29
- package/lib/components/Pagination/Pagination.js.map +1 -1
- package/lib/components/Pagination/PaginationControllerItemButton.d.ts +1 -1
- package/lib/components/Pagination/PaginationControllerItemButton.js +14 -11
- package/lib/components/Pagination/PaginationControllerItemButton.js.map +1 -1
- package/lib/components/Pagination/PaginationItemButton.d.ts +1 -1
- package/lib/components/Pagination/PaginationItemButton.js +12 -2
- package/lib/components/Pagination/PaginationItemButton.js.map +1 -1
- package/lib/components/RadioButton/RadioButton.js +9 -10
- package/lib/components/RadioButton/RadioButton.js.map +1 -1
- package/lib/components/RadioButtonPanel/RadioButtonPanel.js +5 -5
- package/lib/components/RadioButtonPanel/RadioButtonPanel.js.map +1 -1
- package/lib/components/Select/Select.d.ts +1 -0
- package/lib/components/Select/Select.js +16 -12
- package/lib/components/Select/Select.js.map +1 -1
- package/lib/components/Stepper/StepStatusIcon.d.ts +6 -2
- package/lib/components/Stepper/StepStatusIcon.js +26 -18
- package/lib/components/Stepper/StepStatusIcon.js.map +1 -1
- package/lib/components/Textarea/Textarea.js +34 -26
- package/lib/components/Textarea/Textarea.js.map +1 -1
- package/lib/libs/tabbable.js.map +1 -1
- package/lib/types/ResponseMessage.d.ts +3 -2
- package/lib/types/index.d.ts +1 -1
- package/package.json +6 -6
- package/smarthr-ui.css +16 -0
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import React
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { tv } from 'tailwind-variants';
|
|
3
|
-
import { AppNavi } from '../../../AppNavi';
|
|
3
|
+
import { AppNavi, AppNaviAnchor, AppNaviButton, AppNaviCustomTag, AppNaviDropdownMenuButton, } from '../../../AppNavi';
|
|
4
|
+
import { AnchorButton, Button } from '../../../Button';
|
|
5
|
+
import { DropdownMenuGroup } from '../../../Dropdown';
|
|
4
6
|
import { Cluster } from '../../../Layout';
|
|
5
|
-
import {
|
|
6
|
-
import { isChildNavigation, isChildNavigationGroup } from '../../utils';
|
|
7
|
-
import { CommonButton, commonButton } from '../common/CommonButton';
|
|
7
|
+
import { commonButton } from '../common/CommonButton';
|
|
8
8
|
import { ReleaseNotesDropdown } from './ReleaseNotesDropdown';
|
|
9
9
|
const appNavi = tv({
|
|
10
10
|
base: ['shr-overflow-x-auto shr-min-w-[auto]', 'max-[751px]:!shr-hidden'],
|
|
@@ -14,64 +14,36 @@ const appNavi = tv({
|
|
|
14
14
|
},
|
|
15
15
|
},
|
|
16
16
|
});
|
|
17
|
-
export const Navigation = ({ appName, navigations, additionalContent, releaseNote, enableNew, }) => {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
};
|
|
23
|
-
const navigationTitle = tv({
|
|
24
|
-
base: ['shr-px-1 shr-pt-0.5 shr-pb-0.25'],
|
|
25
|
-
});
|
|
26
|
-
const separator = tv({
|
|
27
|
-
base: ['[&&]:shr-mx-0 [&&]:shr-my-0.5 [&&]:shr-border-b-shorthand'],
|
|
28
|
-
});
|
|
29
|
-
// TODO smarthr-ui 側でグループ化された Navigation が対応されたら AppNaviDropdownMenuButton を使った実装に変更する
|
|
30
|
-
const buildButtonsFromNavigations = (navigations) => navigations.map((navigation) => {
|
|
31
|
-
if (isChildNavigation(navigation)) {
|
|
32
|
-
// smarthr-ui の buttons props ではカスタムエレメントは elementAs ではなく tag という名前なので変換する必要がある
|
|
33
|
-
if ('elementAs' in navigation) {
|
|
34
|
-
const { elementAs, ...rest } = navigation;
|
|
35
|
-
return {
|
|
36
|
-
...rest,
|
|
37
|
-
tag: elementAs,
|
|
38
|
-
};
|
|
39
|
-
}
|
|
40
|
-
return navigation;
|
|
17
|
+
export const Navigation = ({ appName, navigations, additionalContent, releaseNote, enableNew, }) => (React.createElement(AppNavi, { label: enableNew ? undefined : appName, className: appNavi({ withReleaseNote: !!releaseNote }), displayDropdownCaret: true, additionalArea: React.createElement(Cluster, { align: "center", className: "shr-flex-nowrap shr-ps-1" },
|
|
18
|
+
additionalContent,
|
|
19
|
+
releaseNote && React.createElement(ReleaseNotesDropdown, { ...releaseNote })) }, buildNavigations(navigations)));
|
|
20
|
+
const buildNavigations = (navigations) => (React.createElement(React.Fragment, null, navigations.map((navigation) => {
|
|
21
|
+
if ('elementAs' in navigation) {
|
|
22
|
+
return (React.createElement(AppNaviCustomTag, { ...navigation, key: navigation.children.toString(), tag: navigation.elementAs }));
|
|
41
23
|
}
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
return
|
|
47
|
-
}
|
|
48
|
-
return {
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
dropdownContent: (React.createElement("div", { className: "shr-py-0.5" }, navigation.childNavigations.map((childNavigation, i) => {
|
|
52
|
-
if (isChildNavigationGroup(childNavigation)) {
|
|
53
|
-
const { childNavigations } = childNavigation;
|
|
54
|
-
return (React.createElement(Fragment, { key: childNavigation.title.toString() },
|
|
55
|
-
React.createElement("div", { className: "shr-px-0.5" },
|
|
56
|
-
React.createElement(Text, { styleType: "subSubBlockTitle", as: "p", className: navigationTitle() }, childNavigation.title),
|
|
57
|
-
childNavigations.map((child) => (React.createElement(Fragment, { key: child.children.toString() }, buildDropdownItemFromNavigation(child))))),
|
|
58
|
-
i + 1 !== navigation.childNavigations.length && React.createElement("hr", { className: separator() })));
|
|
59
|
-
}
|
|
60
|
-
const nextChildNavigation = navigation.childNavigations[i + 1];
|
|
61
|
-
return (React.createElement(Fragment, { key: childNavigation.children.toString() },
|
|
62
|
-
React.createElement("div", { className: "shr-px-0.5" }, buildDropdownItemFromNavigation(childNavigation)),
|
|
63
|
-
isChildNavigationGroup(nextChildNavigation) && React.createElement("hr", { className: separator() })));
|
|
64
|
-
}))),
|
|
65
|
-
};
|
|
66
|
-
});
|
|
67
|
-
const buildDropdownItemFromNavigation = (navigation) => {
|
|
24
|
+
if ('href' in navigation) {
|
|
25
|
+
return React.createElement(AppNaviAnchor, { ...navigation, key: navigation.children.toString() });
|
|
26
|
+
}
|
|
27
|
+
if ('childNavigations' in navigation) {
|
|
28
|
+
return (React.createElement(AppNaviDropdownMenuButton, { label: navigation.children, key: navigation.children.toString() }, buildDropdownMenu(navigation.childNavigations)));
|
|
29
|
+
}
|
|
30
|
+
return React.createElement(AppNaviButton, { ...navigation, key: navigation.children.toString() });
|
|
31
|
+
})));
|
|
32
|
+
const buildDropdownMenu = (navigations) => (React.createElement(React.Fragment, null, navigations.map((navigation) => {
|
|
68
33
|
if ('elementAs' in navigation) {
|
|
69
|
-
const
|
|
70
|
-
|
|
34
|
+
const Component = navigation.elementAs;
|
|
35
|
+
// TODO: DropdownMenuItemを作成し、elementAsを渡せるようにする
|
|
36
|
+
return (React.createElement(Component, { ...navigation, key: navigation.children, "aria-current": navigation.current, className: commonButton({
|
|
37
|
+
current: navigation.current,
|
|
38
|
+
className: navigation.className,
|
|
39
|
+
}) }));
|
|
71
40
|
}
|
|
72
41
|
if ('href' in navigation) {
|
|
73
|
-
return React.createElement(
|
|
42
|
+
return (React.createElement(AnchorButton, { ...navigation, "aria-current": navigation.current && 'page', key: navigation.children.toString() }));
|
|
43
|
+
}
|
|
44
|
+
if ('title' in navigation) {
|
|
45
|
+
return (React.createElement(DropdownMenuGroup, { name: navigation.title, key: navigation.title.toString() }, buildDropdownMenu(navigation.childNavigations)));
|
|
74
46
|
}
|
|
75
|
-
return (React.createElement(
|
|
76
|
-
};
|
|
47
|
+
return (React.createElement(Button, { ...navigation, "aria-current": navigation.current && 'page', key: navigation.children.toString() }));
|
|
48
|
+
})));
|
|
77
49
|
//# sourceMappingURL=Navigation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Navigation.js","sourceRoot":"","sources":["../../../../../src/components/AppHeader/components/desktop/Navigation.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Navigation.js","sourceRoot":"","sources":["../../../../../src/components/AppHeader/components/desktop/Navigation.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,35 +1,36 @@
|
|
|
1
|
-
import React, {
|
|
1
|
+
import React, { useEffect, useRef } from 'react';
|
|
2
2
|
import { tabbable } from '../../libs/tabbable';
|
|
3
3
|
export const FocusTrap = ({ firstFocusTarget, children }) => {
|
|
4
4
|
const ref = useRef(null);
|
|
5
5
|
const dummyFocusRef = useRef(null);
|
|
6
|
-
const handleKeyDown = useCallback((e) => {
|
|
7
|
-
if (e.key !== 'Tab' || ref.current === null) {
|
|
8
|
-
return;
|
|
9
|
-
}
|
|
10
|
-
const tabbables = tabbable(ref.current).filter((elm) => elm.tabIndex >= 0);
|
|
11
|
-
if (tabbables.length === 0) {
|
|
12
|
-
return;
|
|
13
|
-
}
|
|
14
|
-
const firstTabbable = tabbables[0];
|
|
15
|
-
const lastTabbable = tabbables[tabbables.length - 1];
|
|
16
|
-
const currentFocused = Array.from(tabbables).find((elm) => elm === e.target);
|
|
17
|
-
if (e.shiftKey &&
|
|
18
|
-
(currentFocused === firstTabbable || document.activeElement === dummyFocusRef.current)) {
|
|
19
|
-
lastTabbable.focus();
|
|
20
|
-
e.preventDefault();
|
|
21
|
-
}
|
|
22
|
-
else if (!e.shiftKey && currentFocused === lastTabbable) {
|
|
23
|
-
firstTabbable.focus();
|
|
24
|
-
e.preventDefault();
|
|
25
|
-
}
|
|
26
|
-
}, []);
|
|
27
6
|
useEffect(() => {
|
|
7
|
+
const handleKeyDown = (e) => {
|
|
8
|
+
if (e.key !== 'Tab' || ref.current === null) {
|
|
9
|
+
return;
|
|
10
|
+
}
|
|
11
|
+
const tabbables = tabbable(ref.current).filter((elm) => elm.tabIndex >= 0);
|
|
12
|
+
if (tabbables.length === 0) {
|
|
13
|
+
return;
|
|
14
|
+
}
|
|
15
|
+
const firstTabbable = tabbables[0];
|
|
16
|
+
const lastTabbable = tabbables[tabbables.length - 1];
|
|
17
|
+
const currentFocused = tabbables.find((elm) => elm === e.target);
|
|
18
|
+
if (e.shiftKey) {
|
|
19
|
+
if (currentFocused === firstTabbable || document.activeElement === dummyFocusRef.current) {
|
|
20
|
+
e.preventDefault();
|
|
21
|
+
lastTabbable.focus();
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
else if (currentFocused === lastTabbable) {
|
|
25
|
+
e.preventDefault();
|
|
26
|
+
firstTabbable.focus();
|
|
27
|
+
}
|
|
28
|
+
};
|
|
28
29
|
window.addEventListener('keydown', handleKeyDown);
|
|
29
30
|
return () => {
|
|
30
31
|
window.removeEventListener('keydown', handleKeyDown);
|
|
31
32
|
};
|
|
32
|
-
}, [
|
|
33
|
+
}, []);
|
|
33
34
|
useEffect(() => {
|
|
34
35
|
const triggerElement = document.activeElement;
|
|
35
36
|
if (firstFocusTarget?.current) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FocusTrap.js","sourceRoot":"","sources":["../../../src/components/Dialog/FocusTrap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAoC,
|
|
1
|
+
{"version":3,"file":"FocusTrap.js","sourceRoot":"","sources":["../../../src/components/Dialog/FocusTrap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAoC,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAElF,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAM9C,MAAM,CAAC,MAAM,SAAS,GAAc,CAAC,EAAE,gBAAgB,EAAE,QAAQ,EAAE,EAAE,EAAE;IACrE,MAAM,GAAG,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAA;IAC/C,MAAM,aAAa,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAElD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,aAAa,GAAG,CAAC,CAAgB,EAAE,EAAE;YACzC,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,IAAI,GAAG,CAAC,OAAO,KAAK,IAAI,EAAE,CAAC;gBAC5C,OAAM;YACR,CAAC;YAED,MAAM,SAAS,GAAG,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,QAAQ,IAAI,CAAC,CAAC,CAAA;YAE1E,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBAC3B,OAAM;YACR,CAAC;YAED,MAAM,aAAa,GAAG,SAAS,CAAC,CAAC,CAAC,CAAA;YAClC,MAAM,YAAY,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;YACpD,MAAM,cAAc,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,KAAK,CAAC,CAAC,MAAM,CAAC,CAAA;YAEhE,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;gBACf,IAAI,cAAc,KAAK,aAAa,IAAI,QAAQ,CAAC,aAAa,KAAK,aAAa,CAAC,OAAO,EAAE,CAAC;oBACzF,CAAC,CAAC,cAAc,EAAE,CAAA;oBAClB,YAAY,CAAC,KAAK,EAAE,CAAA;gBACtB,CAAC;YACH,CAAC;iBAAM,IAAI,cAAc,KAAK,YAAY,EAAE,CAAC;gBAC3C,CAAC,CAAC,cAAc,EAAE,CAAA;gBAClB,aAAa,CAAC,KAAK,EAAE,CAAA;YACvB,CAAC;QACH,CAAC,CAAA;QAED,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QAEjD,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACtD,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAA;QAE7C,IAAI,gBAAgB,EAAE,OAAO,EAAE,CAAC;YAC9B,gBAAgB,CAAC,OAAO,CAAC,KAAK,EAAE,CAAA;QAClC,CAAC;aAAM,CAAC;YACN,aAAa,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;QAChC,CAAC;QAED,OAAO,GAAG,EAAE;YACV,4BAA4B;YAC5B,IAAI,cAAc,YAAY,WAAW,EAAE,CAAC;gBAC1C,cAAc,CAAC,KAAK,EAAE,CAAA;YACxB,CAAC;QACH,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAA;IAEtB,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG;QAEX,6BAAK,GAAG,EAAE,aAAa,EAAE,QAAQ,EAAE,CAAC,CAAC,GAAI;QACxC,QAAQ,CACL,CACP,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1,28 +1,20 @@
|
|
|
1
|
-
import { useEffect,
|
|
1
|
+
import { useEffect, useRef } from 'react';
|
|
2
2
|
export const useBodyScrollLock = (isOpen) => {
|
|
3
|
-
const
|
|
4
|
-
const [paddingRight, setPaddingRight] = useState(null);
|
|
5
|
-
useEffect(() => {
|
|
6
|
-
setScrollBarWidth(window.innerWidth - document.body.clientWidth);
|
|
7
|
-
}, []);
|
|
8
|
-
useEffect(() => {
|
|
9
|
-
if (scrollBarWidth === null) {
|
|
10
|
-
return;
|
|
11
|
-
}
|
|
12
|
-
const originalPaddingRight = getComputedStyle(document.body).getPropertyValue('padding-right');
|
|
13
|
-
setPaddingRight(scrollBarWidth + parseInt(originalPaddingRight, 10));
|
|
14
|
-
}, [scrollBarWidth]);
|
|
3
|
+
const paddingRightRef = useRef(null);
|
|
15
4
|
useEffect(() => {
|
|
16
5
|
if (!isOpen)
|
|
17
6
|
return;
|
|
18
|
-
if (
|
|
19
|
-
document.body.
|
|
7
|
+
if (paddingRightRef.current === null) {
|
|
8
|
+
const scrollBarWidth = window.innerWidth - document.body.clientWidth;
|
|
9
|
+
const originalPaddingRight = getComputedStyle(document.body).getPropertyValue('padding-right');
|
|
10
|
+
paddingRightRef.current = `${scrollBarWidth + parseInt(originalPaddingRight, 10)}px`;
|
|
20
11
|
}
|
|
12
|
+
document.body.style.paddingInlineEnd = paddingRightRef.current;
|
|
21
13
|
document.body.style.overflow = 'hidden';
|
|
22
14
|
return () => {
|
|
23
15
|
document.body.style.paddingInlineEnd = '';
|
|
24
16
|
document.body.style.overflow = '';
|
|
25
17
|
};
|
|
26
|
-
}, [isOpen
|
|
18
|
+
}, [isOpen]);
|
|
27
19
|
};
|
|
28
20
|
//# sourceMappingURL=useBodyScrollLock.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBodyScrollLock.js","sourceRoot":"","sources":["../../../src/components/Dialog/useBodyScrollLock.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,
|
|
1
|
+
{"version":3,"file":"useBodyScrollLock.js","sourceRoot":"","sources":["../../../src/components/Dialog/useBodyScrollLock.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAEzC,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,MAAe,EAAE,EAAE;IACnD,MAAM,eAAe,GAAG,MAAM,CAAgB,IAAI,CAAC,CAAA;IAEnD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,MAAM;YAAE,OAAM;QAEnB,IAAI,eAAe,CAAC,OAAO,KAAK,IAAI,EAAE,CAAC;YACrC,MAAM,cAAc,GAAG,MAAM,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAA;YACpE,MAAM,oBAAoB,GAAG,gBAAgB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAA;YAE9F,eAAe,CAAC,OAAO,GAAG,GAAG,cAAc,GAAG,QAAQ,CAAC,oBAAoB,EAAE,EAAE,CAAC,IAAI,CAAA;QACtF,CAAC;QAED,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,GAAG,eAAe,CAAC,OAAO,CAAA;QAC9D,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,QAAQ,CAAA;QAEvC,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,GAAG,EAAE,CAAA;YACzC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,EAAE,CAAA;QACnC,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAA;AACd,CAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDialogPortal.js","sourceRoot":"","sources":["../../../src/components/Dialog/useDialogPortal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAExC,MAAM,UAAU,eAAe,CAAC,MAA6C,EAAE,EAAW;IACxF,MAAM,eAAe,GAAG,MAAM,CAC5B,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAoB,CAC3F,CAAC,OAAO,CAAA;IAET,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,eAAe,EAAE,CAAC;YACrB,OAAM;QACR,CAAC;
|
|
1
|
+
{"version":3,"file":"useDialogPortal.js","sourceRoot":"","sources":["../../../src/components/Dialog/useDialogPortal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAExC,MAAM,UAAU,eAAe,CAAC,MAA6C,EAAE,EAAW;IACxF,MAAM,eAAe,GAAG,MAAM,CAC5B,OAAO,QAAQ,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAE,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAoB,CAC3F,CAAC,OAAO,CAAA;IAET,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,eAAe,EAAE,CAAC;YACrB,OAAM;QACR,CAAC;QAED,IAAI,EAAE,EAAE,CAAC;YACP,eAAe,CAAC,EAAE,GAAG,EAAE,CAAA;QACzB,CAAC;QAED,MAAM,aAAa,GAAG,MAAM,IAAI,SAAS,IAAI,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAA;QAC7E,6CAA6C;QAC7C,MAAM,YAAY,GAAG,aAAa,IAAI,QAAQ,CAAC,IAAI,CAAA;QAEnD,YAAY,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QAEzC,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,WAAW,CAAC,eAAe,CAAC,CAAA;QAC3C,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,eAAe,CAAC,CAAC,CAAA;IAEjC,MAAM,mBAAmB,GAAG,WAAW,CACrC,CAAC,QAAmB,EAAE,EAAE;QACtB,IAAI,eAAe,KAAK,IAAI,EAAE,CAAC;YAC7B,OAAO,IAAI,CAAA;QACb,CAAC;QAED,OAAO,YAAY,CAAC,QAAQ,EAAE,eAAe,CAAC,CAAA;IAChD,CAAC,EACD,CAAC,eAAe,CAAC,CAClB,CAAA;IAED,OAAO;QACL,YAAY,EAAE,mBAAmB;KAClC,CAAA;AACH,CAAC"}
|
|
@@ -30,14 +30,12 @@ export function useRemoteTrigger({ onClickClose: orgOnClickClose, onPressEscape:
|
|
|
30
30
|
};
|
|
31
31
|
}, [id]);
|
|
32
32
|
useEffect(() => {
|
|
33
|
-
|
|
34
|
-
|
|
33
|
+
onToggle?.(isOpen);
|
|
34
|
+
if (isOpen) {
|
|
35
|
+
onOpen?.();
|
|
35
36
|
}
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
}
|
|
39
|
-
if (onClose && !isOpen) {
|
|
40
|
-
onClose();
|
|
37
|
+
else {
|
|
38
|
+
onClose?.();
|
|
41
39
|
}
|
|
42
40
|
// HINT: 再レンダリング際にhookを利用していないonToggleなどが渡されると意図せず発火してしまう場合がありえるため
|
|
43
41
|
// onToggle, onOpen, onClose を depsに含めていません
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useRemoteTrigger.js","sourceRoot":"","sources":["../../../src/components/Dialog/useRemoteTrigger.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAExD,MAAM,CAAC,MAAM,aAAa,GAAG,2CAA2C,CAAA;AAExE,MAAM,UAAU,gBAAgB,CAAC,EAC/B,YAAY,EAAE,eAAe,EAC7B,aAAa,EAAE,gBAAgB,EAC/B,QAAQ,EACR,MAAM,EACN,OAAO,EACP,EAAE,GAQH;IACC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE3C,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QACpC,IAAI,eAAe,EAAE,CAAC;YACpB,OAAO,eAAe,CAAC,GAAG,EAAE;gBAC1B,SAAS,CAAC,KAAK,CAAC,CAAA;YAClB,CAAC,CAAC,CAAA;QACJ,CAAC;QAED,SAAS,CAAC,KAAK,CAAC,CAAA;IAClB,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAA;IAErB,MAAM,aAAa,GAAG,WAAW,CAAC,GAAG,EAAE;QACrC,IAAI,gBAAgB,EAAE,CAAC;YACrB,OAAO,gBAAgB,CAAC,GAAG,EAAE;gBAC3B,SAAS,CAAC,KAAK,CAAC,CAAA;YAClB,CAAC,CAAC,CAAA;QACJ,CAAC;QAED,SAAS,CAAC,KAAK,CAAC,CAAA;IAClB,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAA;IAEtB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,CAAC,CAAC,CAAqC,EAAE,EAAE;YACzD,IAAI,EAAE,KAAK,CAAC,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC;gBACvB,SAAS,CAAC,IAAI,CAAC,CAAA;YACjB,CAAC;QACH,CAAC,CAAsD,CAAA;QAEvD,QAAQ,CAAC,gBAAgB,CAAC,aAAa,EAAE,OAAO,CAAC,CAAA;QAEjD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,aAAa,EAAE,OAAO,CAAC,CAAA;QACtD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;IAER,SAAS,CAAC,GAAG,EAAE;QACb,
|
|
1
|
+
{"version":3,"file":"useRemoteTrigger.js","sourceRoot":"","sources":["../../../src/components/Dialog/useRemoteTrigger.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAExD,MAAM,CAAC,MAAM,aAAa,GAAG,2CAA2C,CAAA;AAExE,MAAM,UAAU,gBAAgB,CAAC,EAC/B,YAAY,EAAE,eAAe,EAC7B,aAAa,EAAE,gBAAgB,EAC/B,QAAQ,EACR,MAAM,EACN,OAAO,EACP,EAAE,GAQH;IACC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE3C,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QACpC,IAAI,eAAe,EAAE,CAAC;YACpB,OAAO,eAAe,CAAC,GAAG,EAAE;gBAC1B,SAAS,CAAC,KAAK,CAAC,CAAA;YAClB,CAAC,CAAC,CAAA;QACJ,CAAC;QAED,SAAS,CAAC,KAAK,CAAC,CAAA;IAClB,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAA;IAErB,MAAM,aAAa,GAAG,WAAW,CAAC,GAAG,EAAE;QACrC,IAAI,gBAAgB,EAAE,CAAC;YACrB,OAAO,gBAAgB,CAAC,GAAG,EAAE;gBAC3B,SAAS,CAAC,KAAK,CAAC,CAAA;YAClB,CAAC,CAAC,CAAA;QACJ,CAAC;QAED,SAAS,CAAC,KAAK,CAAC,CAAA;IAClB,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAA;IAEtB,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,CAAC,CAAC,CAAqC,EAAE,EAAE;YACzD,IAAI,EAAE,KAAK,CAAC,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC;gBACvB,SAAS,CAAC,IAAI,CAAC,CAAA;YACjB,CAAC;QACH,CAAC,CAAsD,CAAA;QAEvD,QAAQ,CAAC,gBAAgB,CAAC,aAAa,EAAE,OAAO,CAAC,CAAA;QAEjD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,aAAa,EAAE,OAAO,CAAC,CAAA;QACtD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;IAER,SAAS,CAAC,GAAG,EAAE;QACb,QAAQ,EAAE,CAAC,MAAM,CAAC,CAAA;QAElB,IAAI,MAAM,EAAE,CAAC;YACX,MAAM,EAAE,EAAE,CAAA;QACZ,CAAC;aAAM,CAAC;YACN,OAAO,EAAE,EAAE,CAAA;QACb,CAAC;QACD,kEAAkE;QAClE,2CAA2C;QAC3C,uDAAuD;IACzD,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAA;IAEZ,OAAO;QACL,MAAM;QACN,YAAY;QACZ,aAAa;KACd,CAAA;AACH,CAAC"}
|
|
@@ -32,7 +32,6 @@ export const DropZone = forwardRef(({ children, onSelectFiles, multiple = true,
|
|
|
32
32
|
const [filesDraggedOver, setFilesDraggedOver] = useState(false);
|
|
33
33
|
const { wrapper, input } = useMemo(() => dropZone({ filesDraggedOver }), [filesDraggedOver]);
|
|
34
34
|
useImperativeHandle(ref, () => fileRef.current);
|
|
35
|
-
const selectButtonLabel = useMemo(() => decorators?.selectButtonLabel?.(SELECT_BUTTON_LABEL) || SELECT_BUTTON_LABEL, [decorators]);
|
|
36
35
|
const onDrop = useCallback((e) => {
|
|
37
36
|
overrideEventDefault(e);
|
|
38
37
|
setFilesDraggedOver(false);
|
|
@@ -51,12 +50,16 @@ export const DropZone = forwardRef(({ children, onSelectFiles, multiple = true,
|
|
|
51
50
|
const onChange = useCallback((e) => {
|
|
52
51
|
onSelectFiles(e, e.target.files);
|
|
53
52
|
}, [onSelectFiles]);
|
|
54
|
-
const onClickButton = () => {
|
|
53
|
+
const onClickButton = useCallback(() => {
|
|
55
54
|
fileRef.current.click();
|
|
56
|
-
};
|
|
55
|
+
}, []);
|
|
57
56
|
return (React.createElement("div", { onDrop: onDrop, onDragOver: onDragOver, onDragLeave: onDragLeave, className: wrapper() },
|
|
58
57
|
children,
|
|
59
|
-
React.createElement(
|
|
58
|
+
React.createElement(SelectButton, { decorators: decorators, onClick: onClickButton }),
|
|
60
59
|
React.createElement("input", { ...props, "data-smarthr-ui-input": "true", ref: fileRef, type: "file", multiple: multiple, onChange: onChange, className: input() })));
|
|
61
60
|
});
|
|
61
|
+
const SelectButton = React.memo(({ onClick, decorators }) => {
|
|
62
|
+
const selectButtonLabel = useMemo(() => decorators?.selectButtonLabel?.(SELECT_BUTTON_LABEL) || SELECT_BUTTON_LABEL, [decorators]);
|
|
63
|
+
return (React.createElement(Button, { prefix: React.createElement(FaFolderOpenIcon, null), onClick: onClick }, selectButtonLabel));
|
|
64
|
+
});
|
|
62
65
|
//# sourceMappingURL=DropZone.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropZone.js","sourceRoot":"","sources":["../../../src/components/DropZone/DropZone.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,EAAE,EAKZ,UAAU,EACV,WAAW,EACX,mBAAmB,EACnB,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAI1C,MAAM,QAAQ,GAAG,EAAE,CAAC;IAClB,KAAK,EAAE;QACL,OAAO,EAAE;YACP,qBAAqB;YACrB,wGAAwG;SACzG;QACD,KAAK,EAAE,YAAY;KACpB;IACD,QAAQ,EAAE;QACR,gBAAgB,EAAE;YAChB,IAAI,EAAE;gBACJ,OAAO,EAAE,iBAAiB;aAC3B;YACD,KAAK,EAAE;gBACL,OAAO,EAAE,mBAAmB;aAC7B;SACF;KACF;CACF,CAAC,CAAA;AAwBF,MAAM,mBAAmB,GAAG,SAAS,CAAA;AAErC,MAAM,oBAAoB,GAAG,CAAC,CAAyB,EAAE,EAAE;IACzD,CAAC,CAAC,cAAc,EAAE,CAAA;IAClB,CAAC,CAAC,eAAe,EAAE,CAAA;AACrB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,CAAC,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,GAAG,IAAI,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC1E,MAAM,OAAO,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;IAC9C,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC/D,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAA;IAC5F,mBAAmB,CACjB,GAAG,EACH,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CACtB,CAAA;IAED,MAAM,
|
|
1
|
+
{"version":3,"file":"DropZone.js","sourceRoot":"","sources":["../../../src/components/DropZone/DropZone.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,EAAE,EAKZ,UAAU,EACV,WAAW,EACX,mBAAmB,EACnB,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAI1C,MAAM,QAAQ,GAAG,EAAE,CAAC;IAClB,KAAK,EAAE;QACL,OAAO,EAAE;YACP,qBAAqB;YACrB,wGAAwG;SACzG;QACD,KAAK,EAAE,YAAY;KACpB;IACD,QAAQ,EAAE;QACR,gBAAgB,EAAE;YAChB,IAAI,EAAE;gBACJ,OAAO,EAAE,iBAAiB;aAC3B;YACD,KAAK,EAAE;gBACL,OAAO,EAAE,mBAAmB;aAC7B;SACF;KACF;CACF,CAAC,CAAA;AAwBF,MAAM,mBAAmB,GAAG,SAAS,CAAA;AAErC,MAAM,oBAAoB,GAAG,CAAC,CAAyB,EAAE,EAAE;IACzD,CAAC,CAAC,cAAc,EAAE,CAAA;IAClB,CAAC,CAAC,eAAe,EAAE,CAAA;AACrB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,CAAC,EAAE,QAAQ,EAAE,aAAa,EAAE,QAAQ,GAAG,IAAI,EAAE,UAAU,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC1E,MAAM,OAAO,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAA;IAC9C,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC/D,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,gBAAgB,EAAE,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAA;IAC5F,mBAAmB,CACjB,GAAG,EACH,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CACtB,CAAA;IAED,MAAM,MAAM,GAAG,WAAW,CACxB,CAAC,CAAyB,EAAE,EAAE;QAC5B,oBAAoB,CAAC,CAAC,CAAC,CAAA;QACvB,mBAAmB,CAAC,KAAK,CAAC,CAAA;QAC1B,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,CAAA;QAEtC,IAAI,OAAO,CAAC,OAAO,EAAE,CAAC;YACpB,OAAO,CAAC,OAAO,CAAC,KAAK,GAAG,CAAC,CAAC,YAAY,CAAC,KAAK,CAAA;QAC9C,CAAC;IACH,CAAC,EACD,CAAC,mBAAmB,EAAE,aAAa,CAAC,CACrC,CAAA;IAED,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,CAAyB,EAAE,EAAE;QAC5B,oBAAoB,CAAC,CAAC,CAAC,CAAA;QACvB,mBAAmB,CAAC,IAAI,CAAC,CAAA;IAC3B,CAAC,EACD,CAAC,mBAAmB,CAAC,CACtB,CAAA;IAED,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,mBAAmB,CAAC,KAAK,CAAC,CAAA;IAC5B,CAAC,EAAE,CAAC,mBAAmB,CAAC,CAAC,CAAA;IAEzB,MAAM,QAAQ,GAAG,WAAW,CAC1B,CAAC,CAAgC,EAAE,EAAE;QACnC,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;IAClC,CAAC,EACD,CAAC,aAAa,CAAC,CAChB,CAAA;IAED,MAAM,aAAa,GAAG,WAAW,CAAC,GAAG,EAAE;QACrC,OAAO,CAAC,OAAQ,CAAC,KAAK,EAAE,CAAA;IAC1B,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,CACL,6BAAK,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE;QACxF,QAAQ;QACT,oBAAC,YAAY,IAAC,UAAU,EAAE,UAAU,EAAE,OAAO,EAAE,aAAa,GAAI;QAEhE,kCACM,KAAK,2BACa,MAAM,EAC5B,GAAG,EAAE,OAAO,EACZ,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,KAAK,EAAE,GAClB,CACE,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAC7B,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,EAAE,EAAE;IAC1B,MAAM,iBAAiB,GAAG,OAAO,CAC/B,GAAG,EAAE,CAAC,UAAU,EAAE,iBAAiB,EAAE,CAAC,mBAAmB,CAAC,IAAI,mBAAmB,EACjF,CAAC,UAAU,CAAC,CACb,CAAA;IAED,OAAO,CACL,oBAAC,MAAM,IAAC,MAAM,EAAE,oBAAC,gBAAgB,OAAG,EAAE,OAAO,EAAE,OAAO,IACnD,iBAAiB,CACX,CACV,CAAA;AACH,CAAC,CACF,CAAA"}
|
|
@@ -47,28 +47,45 @@ const filterDropdown = tv({
|
|
|
47
47
|
},
|
|
48
48
|
},
|
|
49
49
|
});
|
|
50
|
-
export const FilterDropdown = ({ isFiltered
|
|
51
|
-
const texts = useMemo(() =>
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
50
|
+
export const FilterDropdown = ({ isFiltered, onApply, onCancel, onReset, onOpen, onClose, children, decorators, responseMessage, triggerSize, ...props }) => {
|
|
51
|
+
const texts = useMemo(() => {
|
|
52
|
+
if (!decorators) {
|
|
53
|
+
return {
|
|
54
|
+
status: STATUS_FILTERED_TEXT,
|
|
55
|
+
triggerButton: TRIGGER_BUTTON_TEXT,
|
|
56
|
+
applyButton: APPLY_BUTTON_TEXT,
|
|
57
|
+
cancelButton: CANCEL_BUTTON_TEXT,
|
|
58
|
+
resetButton: RESET_BUTTON_TEXT,
|
|
59
|
+
};
|
|
60
|
+
}
|
|
61
|
+
return {
|
|
62
|
+
status: executeDecorator(STATUS_FILTERED_TEXT, decorators.status),
|
|
63
|
+
triggerButton: executeDecorator(TRIGGER_BUTTON_TEXT, decorators.triggerButton),
|
|
64
|
+
applyButton: executeDecorator(APPLY_BUTTON_TEXT, decorators.applyButton),
|
|
65
|
+
cancelButton: executeDecorator(CANCEL_BUTTON_TEXT, decorators.cancelButton),
|
|
66
|
+
resetButton: executeDecorator(RESET_BUTTON_TEXT, decorators.resetButton),
|
|
67
|
+
};
|
|
68
|
+
}, [decorators]);
|
|
58
69
|
const filteredIconAriaLabel = useMemo(() => innerText(texts.status), [texts.status]);
|
|
59
70
|
const calcedResponseStatus = useMemo(() => {
|
|
60
71
|
const status = responseMessage?.status;
|
|
61
|
-
const
|
|
72
|
+
const isRequestProcessing = status === 'processing';
|
|
73
|
+
if (status === 'success' || status === 'error') {
|
|
74
|
+
return {
|
|
75
|
+
isRequestProcessing,
|
|
76
|
+
visibleMessageType: status,
|
|
77
|
+
visibleMessage: responseMessage?.text,
|
|
78
|
+
};
|
|
79
|
+
}
|
|
62
80
|
return {
|
|
63
|
-
isRequestProcessing
|
|
64
|
-
visibleMessageType:
|
|
65
|
-
visibleMessage:
|
|
81
|
+
isRequestProcessing,
|
|
82
|
+
visibleMessageType: null,
|
|
83
|
+
visibleMessage: '',
|
|
66
84
|
};
|
|
67
|
-
}, [responseMessage
|
|
68
|
-
const
|
|
85
|
+
}, [responseMessage]);
|
|
86
|
+
const styles = useMemo(() => {
|
|
69
87
|
const { iconWrapper, filteredIcon, inner, actionArea, resetButtonArea, rightButtonArea, message, } = filterDropdown();
|
|
70
|
-
|
|
71
|
-
iconWrapperStyle: iconWrapper({ filtered: isFiltered, triggerSize }),
|
|
88
|
+
const commonStyles = {
|
|
72
89
|
filteredIconStyle: filteredIcon(),
|
|
73
90
|
innerStyle: inner(),
|
|
74
91
|
actionAreaStyle: actionArea(),
|
|
@@ -76,12 +93,23 @@ export const FilterDropdown = ({ isFiltered = false, onApply, onCancel, onReset,
|
|
|
76
93
|
rightButtonAreaStyle: rightButtonArea(),
|
|
77
94
|
messageStyle: message(),
|
|
78
95
|
};
|
|
79
|
-
|
|
96
|
+
return {
|
|
97
|
+
filtered: {
|
|
98
|
+
...commonStyles,
|
|
99
|
+
iconWrapperStyle: iconWrapper({ filtered: true, triggerSize }),
|
|
100
|
+
},
|
|
101
|
+
unfiltered: {
|
|
102
|
+
...commonStyles,
|
|
103
|
+
iconWrapperStyle: iconWrapper({ filtered: false, triggerSize }),
|
|
104
|
+
},
|
|
105
|
+
};
|
|
106
|
+
}, [triggerSize]);
|
|
107
|
+
const { iconWrapperStyle, filteredIconStyle, innerStyle, actionAreaStyle, resetButtonAreaStyle, rightButtonAreaStyle, messageStyle, } = styles[isFiltered ? 'filtered' : 'unfiltered'];
|
|
80
108
|
return (React.createElement(Dropdown, { onOpen: onOpen, onClose: onClose },
|
|
81
109
|
React.createElement(DropdownTrigger, null,
|
|
82
110
|
React.createElement(Button, { ...props, suffix: React.createElement("span", { className: iconWrapperStyle },
|
|
83
111
|
React.createElement(FaFilterIcon, null),
|
|
84
|
-
isFiltered
|
|
112
|
+
isFiltered && (React.createElement(FaCircleCheckIcon, { "aria-label": filteredIconAriaLabel, className: filteredIconStyle }))), size: triggerSize }, texts.triggerButton)),
|
|
85
113
|
React.createElement(DropdownContent, { controllable: true },
|
|
86
114
|
React.createElement("form", { onSubmit: ON_SUBMIT },
|
|
87
115
|
React.createElement("div", { className: innerStyle }, children),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FilterDropdown.js","sourceRoot":"","sources":["../../../../src/components/Dropdown/FilterDropdown/FilterDropdown.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,EAAE,EAAiC,OAAO,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,SAAS,MAAM,iBAAiB,CAAA;AACvC,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,MAAM,EAA4B,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA;AAC9E,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAA;AAC7C,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAA;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAqBpD,MAAM,oBAAoB,GAAG,KAAK,CAAA;AAClC,MAAM,mBAAmB,GAAG,MAAM,CAAA;AAClC,MAAM,iBAAiB,GAAG,IAAI,CAAA;AAC9B,MAAM,kBAAkB,GAAG,OAAO,CAAA;AAClC,MAAM,iBAAiB,GAAG,WAAW,CAAA;AAErC,MAAM,mBAAmB,GAAgD,EAAE,MAAM,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,CAAA;AAEhG,MAAM,SAAS,GAAG,CAAC,CAAkB,EAAE,EAAE;IACvC,CAAC,CAAC,cAAc,EAAE,CAAA;AACpB,CAAC,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,WAAmB,EAAE,SAAoC,EAAE,EAAE,CACrF,SAAS,EAAE,CAAC,WAAW,CAAC,IAAI,WAAW,CAAA;AAEzC,MAAM,cAAc,GAAG,EAAE,CAAC;IACxB,KAAK,EAAE;QACL,WAAW,EAAE;YACX,+BAA+B;YAC/B,sJAAsJ;SACvJ;QACD,YAAY,EAAE,6BAA6B;QAC3C,KAAK,EAAE,WAAW;QAClB,UAAU,EAAE,iFAAiF;QAC7F,eAAe,EAAE,aAAa;QAC9B,eAAe,EAAE,aAAa;QAC9B,OAAO,EAAE,gBAAgB;KAC1B;IACD,QAAQ,EAAE;QACR,QAAQ,EAAE;YACR,IAAI,EAAE;gBACJ,WAAW,EAAE,eAAe;aAC7B;SACF;QACD,WAAW,EAAE;YACX,OAAO,EAAE,EAAE;YACX,CAAC,EAAE;gBACD,WAAW,EAAE,uBAAuB;aACrC;SACF;KACF;CACF,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAA6B,CAAC,EACvD,UAAU,
|
|
1
|
+
{"version":3,"file":"FilterDropdown.js","sourceRoot":"","sources":["../../../../src/components/Dropdown/FilterDropdown/FilterDropdown.tsx"],"names":[],"mappings":"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"}
|
|
@@ -23,7 +23,7 @@ export declare const useSortDropdown: ({ sortFields, defaultOrder, onApply, deco
|
|
|
23
23
|
innerSelectedField: string | undefined;
|
|
24
24
|
innerCheckedOrder: "desc" | "asc";
|
|
25
25
|
};
|
|
26
|
-
SortIcon: import("react").
|
|
26
|
+
SortIcon: import("react").NamedExoticComponent<import("../../Icon").ComponentProps>;
|
|
27
27
|
styles: {
|
|
28
28
|
bodyStyle: string;
|
|
29
29
|
selectStyle: string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ComponentPropsWithoutRef, FC, ReactNode } from 'react';
|
|
2
2
|
import { AbstractSize, CharRelativeSize } from '../../themes/createSpacing';
|
|
3
|
-
import {
|
|
3
|
+
import { ResponseMessageTypeWithoutProcessing } from '../../types';
|
|
4
4
|
type StyleProps = {
|
|
5
5
|
/** コンポーネントの下端から、包含ブロックの下端までの間隔(基準フォントサイズの相対値または抽象値) */
|
|
6
6
|
bottom?: CharRelativeSize | AbstractSize;
|
|
@@ -15,7 +15,7 @@ type Props = StyleProps & {
|
|
|
15
15
|
/** tertiary 領域に表示するボタン */
|
|
16
16
|
tertiaryButton?: ReactNode;
|
|
17
17
|
/** 操作に対するフィードバックメッセージ */
|
|
18
|
-
responseMessage?:
|
|
18
|
+
responseMessage?: ResponseMessageTypeWithoutProcessing;
|
|
19
19
|
};
|
|
20
20
|
type ElementProps = Omit<ComponentPropsWithoutRef<'div'>, keyof Props>;
|
|
21
21
|
export declare const FloatArea: FC<Props & ElementProps>;
|
|
@@ -36,15 +36,14 @@ const floatArea = tv({
|
|
|
36
36
|
},
|
|
37
37
|
});
|
|
38
38
|
export const FloatArea = ({ primaryButton, secondaryButton, tertiaryButton, responseMessage, bottom, zIndex, style, className, ...rest }) => {
|
|
39
|
-
const
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
return (React.createElement(Base, { ...styleProps, ...rest, className: floatArea({ bottom, className }), layer: 3, padding: 1 },
|
|
39
|
+
const styleAttr = useMemo(() => ({ ...style, zIndex }), [style, zIndex]);
|
|
40
|
+
const actualClassName = useMemo(() => floatArea({ bottom, className }), [bottom, className]);
|
|
41
|
+
return (React.createElement(Base, { ...rest, style: styleAttr, layer: 3, padding: 1, className: actualClassName },
|
|
43
42
|
React.createElement(Cluster, { gap: 1 },
|
|
44
43
|
tertiaryButton,
|
|
45
44
|
React.createElement("div", { className: "shr-ms-auto" },
|
|
46
45
|
React.createElement(Cluster, { gap: 1, align: "center" },
|
|
47
|
-
|
|
46
|
+
responseMessage && (React.createElement(ResponseMessage, { type: responseMessage.status }, responseMessage.text)),
|
|
48
47
|
React.createElement(Cluster, { gap: 1 },
|
|
49
48
|
secondaryButton,
|
|
50
49
|
primaryButton))))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FloatArea.js","sourceRoot":"","sources":["../../../src/components/FloatArea/FloatArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA2C,OAAO,EAAE,MAAM,OAAO,CAAA;AAC/E,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAItC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAEpD,MAAM,SAAS,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,8DAA8D;IACpE,QAAQ,EAAE;QACR,MAAM,EAAE;YACN,CAAC,EAAE,cAAc;YACjB,IAAI,EAAE,iBAAiB;YACvB,GAAG,EAAE,gBAAgB;YACrB,IAAI,EAAE,iBAAiB;YACvB,CAAC,EAAE,cAAc;YACjB,IAAI,EAAE,iBAAiB;YACvB,GAAG,EAAE,gBAAgB;YACrB,CAAC,EAAE,cAAc;YACjB,GAAG,EAAE,gBAAgB;YACrB,CAAC,EAAE,cAAc;YACjB,GAAG,EAAE,gBAAgB;YACrB,CAAC,EAAE,cAAc;YACjB,CAAC,EAAE,cAAc;YACjB,GAAG,EAAE,iBAAiB;YACtB,GAAG,EAAE,gBAAgB;YACrB,EAAE,EAAE,cAAc;YAClB,CAAC,EAAE,gBAAgB;YACnB,CAAC,EAAE,cAAc;YACjB,CAAC,EAAE,gBAAgB;YACnB,EAAE,EAAE,cAAc;YAClB,GAAG,EAAE,gBAAgB;YACrB,GAAG,EAAE,cAAc;SACQ;KAC9B;IACD,eAAe,EAAE;QACf,MAAM,EAAE,GAAG;KACZ;CACF,CAAC,CAAA;AAoBF,MAAM,CAAC,MAAM,SAAS,GAA6B,CAAC,EAClD,aAAa,EACb,eAAe,EACf,cAAc,EACd,eAAe,EACf,MAAM,EACN,MAAM,EACN,KAAK,EACL,SAAS,EACT,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,
|
|
1
|
+
{"version":3,"file":"FloatArea.js","sourceRoot":"","sources":["../../../src/components/FloatArea/FloatArea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA2C,OAAO,EAAE,MAAM,OAAO,CAAA;AAC/E,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAItC,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AAC9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AACnC,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAEpD,MAAM,SAAS,GAAG,EAAE,CAAC;IACnB,IAAI,EAAE,8DAA8D;IACpE,QAAQ,EAAE;QACR,MAAM,EAAE;YACN,CAAC,EAAE,cAAc;YACjB,IAAI,EAAE,iBAAiB;YACvB,GAAG,EAAE,gBAAgB;YACrB,IAAI,EAAE,iBAAiB;YACvB,CAAC,EAAE,cAAc;YACjB,IAAI,EAAE,iBAAiB;YACvB,GAAG,EAAE,gBAAgB;YACrB,CAAC,EAAE,cAAc;YACjB,GAAG,EAAE,gBAAgB;YACrB,CAAC,EAAE,cAAc;YACjB,GAAG,EAAE,gBAAgB;YACrB,CAAC,EAAE,cAAc;YACjB,CAAC,EAAE,cAAc;YACjB,GAAG,EAAE,iBAAiB;YACtB,GAAG,EAAE,gBAAgB;YACrB,EAAE,EAAE,cAAc;YAClB,CAAC,EAAE,gBAAgB;YACnB,CAAC,EAAE,cAAc;YACjB,CAAC,EAAE,gBAAgB;YACnB,EAAE,EAAE,cAAc;YAClB,GAAG,EAAE,gBAAgB;YACrB,GAAG,EAAE,cAAc;SACQ;KAC9B;IACD,eAAe,EAAE;QACf,MAAM,EAAE,GAAG;KACZ;CACF,CAAC,CAAA;AAoBF,MAAM,CAAC,MAAM,SAAS,GAA6B,CAAC,EAClD,aAAa,EACb,eAAe,EACf,cAAc,EACd,eAAe,EACf,MAAM,EACN,MAAM,EACN,KAAK,EACL,SAAS,EACT,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,SAAS,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,GAAG,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAA;IACxE,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAA;IAE5F,OAAO,CACL,oBAAC,IAAI,OAAK,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,eAAe;QAChF,oBAAC,OAAO,IAAC,GAAG,EAAE,CAAC;YACZ,cAAc;YACf,6BAAK,SAAS,EAAC,aAAa;gBAC1B,oBAAC,OAAO,IAAC,GAAG,EAAE,CAAC,EAAE,KAAK,EAAC,QAAQ;oBAC5B,eAAe,IAAI,CAClB,oBAAC,eAAe,IAAC,IAAI,EAAE,eAAe,CAAC,MAAM,IAC1C,eAAe,CAAC,IAAI,CACL,CACnB;oBACD,oBAAC,OAAO,IAAC,GAAG,EAAE,CAAC;wBACZ,eAAe;wBACf,aAAa,CACN,CACF,CACN,CACE,CACL,CACR,CAAA;AACH,CAAC,CAAA"}
|