smarthr-ui 64.0.0 → 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/AccordionPanel/AccordionPanel.js +2 -33
- package/esm/components/AccordionPanel/AccordionPanel.js.map +1 -1
- package/esm/components/AccordionPanel/AccordionPanelTrigger.js +33 -3
- package/esm/components/AccordionPanel/AccordionPanelTrigger.js.map +1 -1
- package/esm/components/AccordionPanel/accordionPanelHelper.d.ts +0 -10
- package/esm/components/AccordionPanel/accordionPanelHelper.js +0 -10
- package/esm/components/AccordionPanel/accordionPanelHelper.js.map +1 -1
- 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 +86 -45
- 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/Input/CurrencyInput/CurrencyInput.js +6 -6
- package/esm/components/Input/CurrencyInput/CurrencyInput.js.map +1 -1
- package/esm/components/Input/CurrencyInput/useClassNames.d.ts +1 -1
- package/esm/components/Input/CurrencyInput/useClassNames.js +3 -3
- package/esm/components/Input/CurrencyInput/useClassNames.js.map +1 -1
- package/esm/components/Input/Input.js +14 -6
- package/esm/components/Input/Input.js.map +1 -1
- package/esm/components/Input/InputWithTooltip/InputWithTooltip.js +6 -12
- package/esm/components/Input/InputWithTooltip/InputWithTooltip.js.map +1 -1
- package/esm/components/Input/SearchInput/SearchInput.js +5 -3
- package/esm/components/Input/SearchInput/SearchInput.js.map +1 -1
- package/esm/components/InputFile/InputFile.js +23 -12
- package/esm/components/InputFile/InputFile.js.map +1 -1
- package/esm/components/Layout/Cluster/Cluster.js +10 -3
- package/esm/components/Layout/Cluster/Cluster.js.map +1 -1
- package/esm/components/Layout/Sidebar/Sidebar.js +12 -4
- package/esm/components/Layout/Sidebar/Sidebar.js.map +1 -1
- package/esm/components/LineClamp/LineClamp.js +8 -11
- package/esm/components/LineClamp/LineClamp.js.map +1 -1
- package/esm/components/Loader/Loader.d.ts +2 -2
- package/esm/components/Loader/Loader.js +11 -9
- package/esm/components/Loader/Loader.js.map +1 -1
- package/esm/components/NotificationBar/NotificationBar.d.ts +2 -1
- package/esm/components/NotificationBar/NotificationBar.js +40 -28
- package/esm/components/NotificationBar/NotificationBar.js.map +1 -1
- package/esm/components/PageCounter/PageCounter.js +20 -10
- package/esm/components/PageCounter/PageCounter.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/ResponseMessage/ResponseMessage.js +8 -14
- package/esm/components/ResponseMessage/ResponseMessage.js.map +1 -1
- package/esm/components/SegmentedControl/SegmentedControl.js +16 -10
- package/esm/components/SegmentedControl/SegmentedControl.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/SideNav/SideNavItemButton.js +6 -6
- package/esm/components/SideNav/SideNavItemButton.js.map +1 -1
- package/esm/components/StatusLabel/StatusLabel.js +9 -11
- package/esm/components/StatusLabel/StatusLabel.js.map +1 -1
- package/esm/components/Stepper/HorizontalStepItem.d.ts +2 -2
- package/esm/components/Stepper/StepCounter.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/Stepper/Stepper.js +14 -27
- package/esm/components/Stepper/Stepper.js.map +1 -1
- package/esm/components/Stepper/VerticalStepItem.d.ts +1 -1
- package/esm/components/Text/RangeSeparator.js +14 -4
- package/esm/components/Text/RangeSeparator.js.map +1 -1
- package/esm/components/Text/Text.d.ts +1 -1
- package/esm/components/Text/Text.js +22 -13
- package/esm/components/Text/Text.js.map +1 -1
- package/esm/components/Textarea/Textarea.js +34 -26
- package/esm/components/Textarea/Textarea.js.map +1 -1
- package/esm/components/Tooltip/TooltipPortal.js +1 -1
- package/esm/components/Tooltip/TooltipPortal.js.map +1 -1
- package/esm/components/UpwardLink/UpwardLink.d.ts +2 -2
- package/esm/components/UpwardLink/UpwardLink.js +3 -3
- package/esm/components/UpwardLink/UpwardLink.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/AccordionPanel/AccordionPanel.js +1 -32
- package/lib/components/AccordionPanel/AccordionPanel.js.map +1 -1
- package/lib/components/AccordionPanel/AccordionPanelTrigger.js +32 -2
- package/lib/components/AccordionPanel/AccordionPanelTrigger.js.map +1 -1
- package/lib/components/AccordionPanel/accordionPanelHelper.d.ts +0 -10
- package/lib/components/AccordionPanel/accordionPanelHelper.js +1 -11
- package/lib/components/AccordionPanel/accordionPanelHelper.js.map +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 +86 -45
- 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/Input/CurrencyInput/CurrencyInput.js +6 -6
- package/lib/components/Input/CurrencyInput/CurrencyInput.js.map +1 -1
- package/lib/components/Input/CurrencyInput/useClassNames.d.ts +1 -1
- package/lib/components/Input/CurrencyInput/useClassNames.js +3 -3
- package/lib/components/Input/CurrencyInput/useClassNames.js.map +1 -1
- package/lib/components/Input/Input.js +13 -5
- package/lib/components/Input/Input.js.map +1 -1
- package/lib/components/Input/InputWithTooltip/InputWithTooltip.js +6 -12
- package/lib/components/Input/InputWithTooltip/InputWithTooltip.js.map +1 -1
- package/lib/components/Input/SearchInput/SearchInput.js +5 -3
- package/lib/components/Input/SearchInput/SearchInput.js.map +1 -1
- package/lib/components/InputFile/InputFile.js +23 -12
- package/lib/components/InputFile/InputFile.js.map +1 -1
- package/lib/components/Layout/Cluster/Cluster.js +10 -3
- package/lib/components/Layout/Cluster/Cluster.js.map +1 -1
- package/lib/components/Layout/Sidebar/Sidebar.js +12 -4
- package/lib/components/Layout/Sidebar/Sidebar.js.map +1 -1
- package/lib/components/LineClamp/LineClamp.js +8 -11
- package/lib/components/LineClamp/LineClamp.js.map +1 -1
- package/lib/components/Loader/Loader.d.ts +2 -2
- package/lib/components/Loader/Loader.js +14 -43
- package/lib/components/Loader/Loader.js.map +1 -1
- package/lib/components/NotificationBar/NotificationBar.d.ts +2 -1
- package/lib/components/NotificationBar/NotificationBar.js +40 -28
- package/lib/components/NotificationBar/NotificationBar.js.map +1 -1
- package/lib/components/PageCounter/PageCounter.js +20 -10
- package/lib/components/PageCounter/PageCounter.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/ResponseMessage/ResponseMessage.js +8 -14
- package/lib/components/ResponseMessage/ResponseMessage.js.map +1 -1
- package/lib/components/SegmentedControl/SegmentedControl.js +17 -11
- package/lib/components/SegmentedControl/SegmentedControl.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/SideNav/SideNavItemButton.js +6 -6
- package/lib/components/SideNav/SideNavItemButton.js.map +1 -1
- package/lib/components/StatusLabel/StatusLabel.js +9 -11
- package/lib/components/StatusLabel/StatusLabel.js.map +1 -1
- package/lib/components/Stepper/HorizontalStepItem.d.ts +2 -2
- package/lib/components/Stepper/StepCounter.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/Stepper/Stepper.js +14 -27
- package/lib/components/Stepper/Stepper.js.map +1 -1
- package/lib/components/Stepper/VerticalStepItem.d.ts +1 -1
- package/lib/components/Text/RangeSeparator.js +14 -4
- package/lib/components/Text/RangeSeparator.js.map +1 -1
- package/lib/components/Text/Text.d.ts +1 -1
- package/lib/components/Text/Text.js +22 -13
- package/lib/components/Text/Text.js.map +1 -1
- package/lib/components/Textarea/Textarea.js +34 -26
- package/lib/components/Textarea/Textarea.js.map +1 -1
- package/lib/components/Tooltip/TooltipPortal.js +1 -1
- package/lib/components/Tooltip/TooltipPortal.js.map +1 -1
- package/lib/components/UpwardLink/UpwardLink.d.ts +2 -2
- package/lib/components/UpwardLink/UpwardLink.js +36 -6
- package/lib/components/UpwardLink/UpwardLink.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 +9 -9
- package/smarthr-ui.css +3 -47
- package/esm/components/Button/style.d.ts +0 -3
- package/esm/components/Button/style.js +0 -8
- package/esm/components/Button/style.js.map +0 -1
- package/lib/components/Button/style.d.ts +0 -3
- package/lib/components/Button/style.js +0 -15
- package/lib/components/Button/style.js.map +0 -1
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import React, { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
|
|
3
3
|
import { tv } from 'tailwind-variants';
|
|
4
4
|
import { flatArrayToMap } from '../../libs/map';
|
|
5
|
-
import {
|
|
5
|
+
import { getNewExpandedItems } from './accordionPanelHelper';
|
|
6
6
|
export const AccordionPanelContext = React.createContext({
|
|
7
7
|
iconPosition: 'left',
|
|
8
8
|
expandedItems: new Map(),
|
|
@@ -19,37 +19,6 @@ export const AccordionPanel = ({ iconPosition = 'left', expandableMultiply = tru
|
|
|
19
19
|
const onClickTrigger = useCallback((itemName, isExpanded) => {
|
|
20
20
|
setExpanded(getNewExpandedItems(expandedItems, itemName, isExpanded, expandableMultiply));
|
|
21
21
|
}, [expandableMultiply, expandedItems]);
|
|
22
|
-
const handleKeyPress = (event) => {
|
|
23
|
-
if (!parentRef?.current) {
|
|
24
|
-
return;
|
|
25
|
-
}
|
|
26
|
-
const keyCode = event.keyCode;
|
|
27
|
-
const item = event.target;
|
|
28
|
-
switch (keyCode) {
|
|
29
|
-
case keycodes.HOME: {
|
|
30
|
-
event.preventDefault();
|
|
31
|
-
focusFirstSibling(parentRef.current);
|
|
32
|
-
break;
|
|
33
|
-
}
|
|
34
|
-
case keycodes.END: {
|
|
35
|
-
event.preventDefault();
|
|
36
|
-
focusLastSibling(parentRef.current);
|
|
37
|
-
break;
|
|
38
|
-
}
|
|
39
|
-
case keycodes.LEFT:
|
|
40
|
-
case keycodes.UP: {
|
|
41
|
-
event.preventDefault();
|
|
42
|
-
focusPreviousSibling(item, parentRef.current);
|
|
43
|
-
break;
|
|
44
|
-
}
|
|
45
|
-
case keycodes.RIGHT:
|
|
46
|
-
case keycodes.DOWN: {
|
|
47
|
-
event.preventDefault();
|
|
48
|
-
focusNextSibling(item, parentRef.current);
|
|
49
|
-
break;
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
22
|
useEffect(() => {
|
|
54
23
|
if (defaultExpanded.length > 0)
|
|
55
24
|
setExpanded(flatArrayToMap(defaultExpanded));
|
|
@@ -62,6 +31,6 @@ export const AccordionPanel = ({ iconPosition = 'left', expandableMultiply = tru
|
|
|
62
31
|
expandableMultiply,
|
|
63
32
|
parentRef,
|
|
64
33
|
} },
|
|
65
|
-
React.createElement("div", { ...props, className: styles, ref: parentRef,
|
|
34
|
+
React.createElement("div", { ...props, className: styles, ref: parentRef, role: "presentation" })));
|
|
66
35
|
};
|
|
67
36
|
//# sourceMappingURL=AccordionPanel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionPanel.js","sourceRoot":"","sources":["../../../src/components/AccordionPanel/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,EAAE,EAGZ,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,OAAO,
|
|
1
|
+
{"version":3,"file":"AccordionPanel.js","sourceRoot":"","sources":["../../../src/components/AccordionPanel/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,EAAE,EAGZ,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAA;AAc5D,MAAM,CAAC,MAAM,qBAAqB,GAAG,KAAK,CAAC,aAAa,CAOrD;IACD,YAAY,EAAE,MAAM;IACpB,aAAa,EAAE,IAAI,GAAG,EAAE;IACxB,kBAAkB,EAAE,IAAI;IACxB,SAAS,EAAE,IAAI;CAChB,CAAC,CAAA;AAEF,MAAM,gBAAgB,GAAG,EAAE,CAAC;IAC1B,IAAI,EAAE,2BAA2B;CAClC,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAAmC,CAAC,EAC7D,YAAY,GAAG,MAAM,EACrB,kBAAkB,GAAG,IAAI,EACzB,eAAe,GAAG,EAAE,EACpB,SAAS,EACT,OAAO,EAAE,YAAY,EACrB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,CAAC,aAAa,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,CAAA;IAC9E,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC9C,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,gBAAgB,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;IAE1E,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,QAAgB,EAAE,UAAmB,EAAE,EAAE;QACxC,WAAW,CAAC,mBAAmB,CAAC,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,kBAAkB,CAAC,CAAC,CAAA;IAC3F,CAAC,EACD,CAAC,kBAAkB,EAAE,aAAa,CAAC,CACpC,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,eAAe,CAAC,MAAM,GAAG,CAAC;YAAE,WAAW,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC,CAAA;IAC9E,CAAC,EAAE,CAAC,eAAe,CAAC,CAAC,CAAA;IAErB,OAAO,CACL,oBAAC,qBAAqB,CAAC,QAAQ,IAC7B,KAAK,EAAE;YACL,cAAc;YACd,YAAY;YACZ,aAAa;YACb,YAAY;YACZ,kBAAkB;YAClB,SAAS;SACV;QAGD,gCAAS,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,EAAC,cAAc,GAAG,CAC1C,CAClC,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -7,7 +7,7 @@ import { FaCaretDownIcon, FaCaretRightIcon } from '../Icon';
|
|
|
7
7
|
import { Cluster } from '../Layout';
|
|
8
8
|
import { AccordionPanelContext } from './AccordionPanel';
|
|
9
9
|
import { AccordionPanelItemContext } from './AccordionPanelItem';
|
|
10
|
-
import { getNewExpandedItems } from './accordionPanelHelper';
|
|
10
|
+
import { focusFirstSibling, focusLastSibling, focusNextSibling, focusPreviousSibling, getNewExpandedItems, } from './accordionPanelHelper';
|
|
11
11
|
const accordionPanelTrigger = tv({
|
|
12
12
|
slots: {
|
|
13
13
|
title: 'shr-grow shr-leading-tight',
|
|
@@ -41,7 +41,7 @@ export const AccordionPanelTrigger = ({ children, className, headingType = 'bloc
|
|
|
41
41
|
};
|
|
42
42
|
}, [className]);
|
|
43
43
|
const { name } = useContext(AccordionPanelItemContext);
|
|
44
|
-
const { iconPosition, expandedItems, onClickTrigger, onClickProps, expandableMultiply } = useContext(AccordionPanelContext);
|
|
44
|
+
const { iconPosition, expandedItems, onClickTrigger, onClickProps, expandableMultiply, parentRef, } = useContext(AccordionPanelContext);
|
|
45
45
|
const isExpanded = getIsInclude(expandedItems, name);
|
|
46
46
|
const handleClick = useCallback(() => {
|
|
47
47
|
if (onClickTrigger)
|
|
@@ -51,10 +51,40 @@ export const AccordionPanelTrigger = ({ children, className, headingType = 'bloc
|
|
|
51
51
|
onClickProps(mapToKeyArray(newExpandedItems));
|
|
52
52
|
}
|
|
53
53
|
}, [onClickTrigger, name, isExpanded, onClickProps, expandedItems, expandableMultiply]);
|
|
54
|
+
const handleKeyDown = useCallback((event) => {
|
|
55
|
+
if (!parentRef?.current) {
|
|
56
|
+
return;
|
|
57
|
+
}
|
|
58
|
+
const item = event.target;
|
|
59
|
+
switch (event.key) {
|
|
60
|
+
case 'Home': {
|
|
61
|
+
event.preventDefault();
|
|
62
|
+
focusFirstSibling(parentRef.current);
|
|
63
|
+
break;
|
|
64
|
+
}
|
|
65
|
+
case 'End': {
|
|
66
|
+
event.preventDefault();
|
|
67
|
+
focusLastSibling(parentRef.current);
|
|
68
|
+
break;
|
|
69
|
+
}
|
|
70
|
+
case 'ArrowLeft':
|
|
71
|
+
case 'ArrowUp': {
|
|
72
|
+
event.preventDefault();
|
|
73
|
+
focusPreviousSibling(item, parentRef.current);
|
|
74
|
+
break;
|
|
75
|
+
}
|
|
76
|
+
case 'ArrowRight':
|
|
77
|
+
case 'ArrowDown': {
|
|
78
|
+
event.preventDefault();
|
|
79
|
+
focusNextSibling(item, parentRef.current);
|
|
80
|
+
break;
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
}, [parentRef]);
|
|
54
84
|
return (
|
|
55
85
|
// eslint-disable-next-line smarthr/a11y-heading-in-sectioning-content
|
|
56
86
|
React.createElement(Heading, { tag: headingTag, type: headingType },
|
|
57
|
-
React.createElement("button", { ...props, id: `${name}-trigger`, "aria-expanded": isExpanded, "aria-controls": `${name}-content`, onClick: handleClick, className: buttonStyle, "data-component": "AccordionHeaderButton", type: "button" },
|
|
87
|
+
React.createElement("button", { ...props, id: `${name}-trigger`, "aria-expanded": isExpanded, "aria-controls": `${name}-content`, onClick: handleClick, onKeyDown: handleKeyDown, className: buttonStyle, "data-component": "AccordionHeaderButton", type: "button" },
|
|
58
88
|
React.createElement(Cluster, { className: "shr-flex-nowrap", align: "center", as: "span" },
|
|
59
89
|
iconPosition === 'left' && React.createElement(FaCaretRightIcon, { className: leftIconStyle }),
|
|
60
90
|
React.createElement("span", { className: titleStyle }, children),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionPanelTrigger.js","sourceRoot":"","sources":["../../../src/components/AccordionPanel/AccordionPanelTrigger.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,KAAK,EAAE,EAIZ,WAAW,EACX,UAAU,EACV,OAAO,GACR,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,EAAE,EAAE,MAAM,mBAAmB,CAAA;AAEtC,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAC5D,OAAO,EAAE,OAAO,EAAmB,MAAM,YAAY,CAAA;AACrD,OAAO,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAGnC,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAA;AAChE,OAAO,
|
|
1
|
+
{"version":3,"file":"AccordionPanelTrigger.js","sourceRoot":"","sources":["../../../src/components/AccordionPanel/AccordionPanelTrigger.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,14 +1,4 @@
|
|
|
1
1
|
export declare const getNewExpandedItems: (prevExpandedItems: Map<string, string>, itemName: string, isExpanded: boolean, expandableMultiply: boolean) => Map<string, string>;
|
|
2
|
-
export declare const keycodes: {
|
|
3
|
-
SPACE: number;
|
|
4
|
-
ENTER: number;
|
|
5
|
-
HOME: number;
|
|
6
|
-
END: number;
|
|
7
|
-
UP: number;
|
|
8
|
-
RIGHT: number;
|
|
9
|
-
DOWN: number;
|
|
10
|
-
LEFT: number;
|
|
11
|
-
};
|
|
12
2
|
export declare const getSiblingButtons: (parent: HTMLDivElement) => HTMLElement[];
|
|
13
3
|
export declare const focusFirstSibling: (parent: HTMLDivElement) => void;
|
|
14
4
|
export declare const focusLastSibling: (parent: HTMLDivElement) => void;
|
|
@@ -14,16 +14,6 @@ export const getNewExpandedItems = (prevExpandedItems, itemName, isExpanded, exp
|
|
|
14
14
|
}
|
|
15
15
|
return newState;
|
|
16
16
|
};
|
|
17
|
-
export const keycodes = {
|
|
18
|
-
SPACE: 32,
|
|
19
|
-
ENTER: 13,
|
|
20
|
-
HOME: 36,
|
|
21
|
-
END: 35,
|
|
22
|
-
UP: 38,
|
|
23
|
-
RIGHT: 39,
|
|
24
|
-
DOWN: 40,
|
|
25
|
-
LEFT: 37,
|
|
26
|
-
};
|
|
27
17
|
export const getSiblingButtons = (parent) => Array.from(parent.querySelectorAll('[data-component="AccordionHeaderButton"]'));
|
|
28
18
|
export const focusFirstSibling = (parent) => {
|
|
29
19
|
const siblings = getSiblingButtons(parent);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"accordionPanelHelper.js","sourceRoot":"","sources":["../../../src/components/AccordionPanel/accordionPanelHelper.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,mBAAmB,GAAG,CACjC,iBAAsC,EACtC,QAAgB,EAChB,UAAmB,EACnB,kBAA2B,EAC3B,EAAE;IACF,IAAI,QAA6B,CAAA;IAEjC,IAAI,kBAAkB,EAAE,CAAC;QACvB,QAAQ,GAAG,IAAI,GAAG,CAAC,iBAAiB,CAAC,CAAA;QAErC,IAAI,UAAU,EAAE,CAAC;YACf,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;QAClC,CAAC;aAAM,CAAC;YACN,QAAQ,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;QAC3B,CAAC;IACH,CAAC;SAAM,CAAC;QACN,QAAQ,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,GAAG,EAAE,CAAA;IACrE,CAAC;IAED,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"accordionPanelHelper.js","sourceRoot":"","sources":["../../../src/components/AccordionPanel/accordionPanelHelper.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,mBAAmB,GAAG,CACjC,iBAAsC,EACtC,QAAgB,EAChB,UAAmB,EACnB,kBAA2B,EAC3B,EAAE;IACF,IAAI,QAA6B,CAAA;IAEjC,IAAI,kBAAkB,EAAE,CAAC;QACvB,QAAQ,GAAG,IAAI,GAAG,CAAC,iBAAiB,CAAC,CAAA;QAErC,IAAI,UAAU,EAAE,CAAC;YACf,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;QAClC,CAAC;aAAM,CAAC;YACN,QAAQ,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;QAC3B,CAAC;IACH,CAAC;SAAM,CAAC;QACN,QAAQ,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,GAAG,EAAE,CAAA;IACrE,CAAC;IAED,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,MAAsB,EAAiB,EAAE,CACzE,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,CAAC,0CAA0C,CAAC,CAAC,CAAA;AAEjF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,MAAsB,EAAQ,EAAE;IAChE,MAAM,QAAQ,GAAG,iBAAiB,CAAC,MAAM,CAAC,CAAA;IAC1C,MAAM,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IACzB,KAAK,CAAC,KAAK,EAAE,CAAA;AACf,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,MAAsB,EAAQ,EAAE;IAC/D,MAAM,QAAQ,GAAG,iBAAiB,CAAC,MAAM,CAAC,CAAA;IAC1C,MAAM,IAAI,GAAG,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;IAC1C,IAAI,CAAC,KAAK,EAAE,CAAA;AACd,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAiB,EAAE,MAAsB,EAAQ,EAAE;IAClF,MAAM,QAAQ,GAAG,iBAAiB,CAAC,MAAM,CAAC,CAAA;IAC1C,MAAM,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;IAEtC,IAAI,OAAO,KAAK,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACpC,MAAM,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;QACzB,KAAK,CAAC,KAAK,EAAE,CAAA;IACf,CAAC;SAAM,IAAI,OAAO,KAAK,CAAC,CAAC,EAAE,CAAC;QAC1B,MAAM,IAAI,GAAG,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAC,CAAA;QAClC,IAAI,CAAC,KAAK,EAAE,CAAA;IACd,CAAC;AACH,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,IAAiB,EAAE,MAAsB,EAAQ,EAAE;IACtF,MAAM,QAAQ,GAAG,iBAAiB,CAAC,MAAM,CAAC,CAAA;IAC1C,MAAM,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;IAEtC,IAAI,OAAO,KAAK,CAAC,EAAE,CAAC;QAClB,MAAM,IAAI,GAAG,QAAQ,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;QAC1C,IAAI,CAAC,KAAK,EAAE,CAAA;IACd,CAAC;SAAM,IAAI,OAAO,KAAK,CAAC,CAAC,EAAE,CAAC;QAC1B,MAAM,QAAQ,GAAG,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAC,CAAA;QACtC,QAAQ,CAAC,KAAK,EAAE,CAAA;IAClB,CAAC;AACH,CAAC,CAAA"}
|
|
@@ -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":"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"}
|