@activecollab/components 2.0.278 → 2.0.280
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/dist/cjs/components/ConfirmDialog/ConfirmDialog.js +2 -5
- package/dist/cjs/components/ConfirmDialog/ConfirmDialog.js.map +1 -1
- package/dist/cjs/components/Dialog/Dialog.js +2 -6
- package/dist/cjs/components/Dialog/Dialog.js.map +1 -1
- package/dist/cjs/components/Dialog/Styles.js +3 -5
- package/dist/cjs/components/Dialog/Styles.js.map +1 -1
- package/dist/cjs/components/Filter/Filter.js +45 -6
- package/dist/cjs/components/Filter/Filter.js.map +1 -1
- package/dist/cjs/components/Filter/InputSubmenu.js +59 -0
- package/dist/cjs/components/Filter/InputSubmenu.js.map +1 -0
- package/dist/cjs/components/Filter/StartMenu.js +3 -2
- package/dist/cjs/components/Filter/StartMenu.js.map +1 -1
- package/dist/cjs/components/Filter/Styles.js +28 -1
- package/dist/cjs/components/Filter/Styles.js.map +1 -1
- package/dist/esm/components/ConfirmDialog/ConfirmDialog.d.ts +0 -1
- package/dist/esm/components/ConfirmDialog/ConfirmDialog.d.ts.map +1 -1
- package/dist/esm/components/ConfirmDialog/ConfirmDialog.js +2 -4
- package/dist/esm/components/ConfirmDialog/ConfirmDialog.js.map +1 -1
- package/dist/esm/components/Dialog/Dialog.d.ts +0 -1
- package/dist/esm/components/Dialog/Dialog.d.ts.map +1 -1
- package/dist/esm/components/Dialog/Dialog.js +3 -6
- package/dist/esm/components/Dialog/Dialog.js.map +1 -1
- package/dist/esm/components/Dialog/Styles.d.ts +1 -3
- package/dist/esm/components/Dialog/Styles.d.ts.map +1 -1
- package/dist/esm/components/Dialog/Styles.js +2 -2
- package/dist/esm/components/Dialog/Styles.js.map +1 -1
- package/dist/esm/components/Filter/Filter.d.ts +8 -0
- package/dist/esm/components/Filter/Filter.d.ts.map +1 -1
- package/dist/esm/components/Filter/Filter.js +40 -7
- package/dist/esm/components/Filter/Filter.js.map +1 -1
- package/dist/esm/components/Filter/InputSubmenu.d.ts +12 -0
- package/dist/esm/components/Filter/InputSubmenu.d.ts.map +1 -0
- package/dist/esm/components/Filter/InputSubmenu.js +43 -0
- package/dist/esm/components/Filter/InputSubmenu.js.map +1 -0
- package/dist/esm/components/Filter/StartMenu.js +3 -2
- package/dist/esm/components/Filter/StartMenu.js.map +1 -1
- package/dist/esm/components/Filter/Styles.d.ts +3 -0
- package/dist/esm/components/Filter/Styles.d.ts.map +1 -1
- package/dist/esm/components/Filter/Styles.js +27 -0
- package/dist/esm/components/Filter/Styles.js.map +1 -1
- package/dist/index.js +135 -36
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -3,8 +3,9 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.StyledStartMenuTitle = exports.StyledStartMenuNoResults = exports.StyledStartMenuListItem = exports.StyledStartMenuList = exports.StyledStartMenuDot = exports.StyledMenuFooter = exports.StyledMenu = void 0;
|
|
6
|
+
exports.StyledStartMenuTitle = exports.StyledStartMenuNoResults = exports.StyledStartMenuListItem = exports.StyledStartMenuList = exports.StyledStartMenuDot = exports.StyledMenuFooter = exports.StyledMenu = exports.StyledInputSubmenuFooter = exports.StyledInputSubmenu = exports.StyledInput = void 0;
|
|
7
7
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
8
|
+
var _Input = require("../Input");
|
|
8
9
|
var _List = require("../List");
|
|
9
10
|
var _Menu = require("../Menu");
|
|
10
11
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -54,6 +55,29 @@ var StyledStartMenuDot = exports.StyledStartMenuDot = _styledComponents.default.
|
|
|
54
55
|
displayName: "Styles__StyledStartMenuDot",
|
|
55
56
|
componentId: "sc-lxuoiz-6"
|
|
56
57
|
})(["border-radius:50%;background-color:var(--color-primary);color:var(--page-paper-main);line-height:15px;width:15px;font-weight:bold;font-size:10px;text-align:center;margin-left:4px;"]);
|
|
58
|
+
var StyledInputSubmenu = exports.StyledInputSubmenu = _styledComponents.default.div.withConfig({
|
|
59
|
+
displayName: "Styles__StyledInputSubmenu",
|
|
60
|
+
componentId: "sc-lxuoiz-7"
|
|
61
|
+
})(["", ""], {
|
|
62
|
+
"paddingLeft": "0.75rem",
|
|
63
|
+
"paddingRight": "0.75rem",
|
|
64
|
+
"paddingBottom": "0.5rem",
|
|
65
|
+
"paddingTop": "0.75rem"
|
|
66
|
+
});
|
|
67
|
+
var StyledInputSubmenuFooter = exports.StyledInputSubmenuFooter = (0, _styledComponents.default)(_Menu.MenuFooter).withConfig({
|
|
68
|
+
displayName: "Styles__StyledInputSubmenuFooter",
|
|
69
|
+
componentId: "sc-lxuoiz-8"
|
|
70
|
+
})(["", " height:auto;"], {
|
|
71
|
+
"justifyContent": "space-between",
|
|
72
|
+
"paddingTop": "0.75rem"
|
|
73
|
+
});
|
|
74
|
+
var StyledInput = exports.StyledInput = (0, _styledComponents.default)(_Input.Input).withConfig({
|
|
75
|
+
displayName: "Styles__StyledInput",
|
|
76
|
+
componentId: "sc-lxuoiz-9"
|
|
77
|
+
})(["", ""], {
|
|
78
|
+
"marginBottom": "1.25rem",
|
|
79
|
+
"width": "100%"
|
|
80
|
+
});
|
|
57
81
|
StyledMenu.displayName = "StyledMenu";
|
|
58
82
|
StyledMenuFooter.displayName = "StyledMenuFooter";
|
|
59
83
|
StyledStartMenuList.displayName = "StyledStartMenuList";
|
|
@@ -61,4 +85,7 @@ StyledStartMenuListItem.displayName = "StyledStartMenuListItem";
|
|
|
61
85
|
StyledStartMenuTitle.displayName = "StyledStartMenuTitle";
|
|
62
86
|
StyledStartMenuDot.displayName = "StyledStartMenuDot";
|
|
63
87
|
StyledStartMenuNoResults.displayName = "StyledStartMenuNoResults";
|
|
88
|
+
StyledInputSubmenu.displayName = "StyledInputSubmenu";
|
|
89
|
+
StyledInputSubmenuFooter.displayName = "StyledInputSubmenuFooter";
|
|
90
|
+
StyledInput.displayName = "StyledInput";
|
|
64
91
|
//# sourceMappingURL=Styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireDefault","require","_List","_Menu","e","__esModule","default","StyledMenu","exports","styled","Menu","withConfig","displayName","componentId","StyledMenuFooter","MenuFooter","StyledStartMenuList","List","StyledStartMenuListItem","ListItem","StyledStartMenuTitle","div","StyledStartMenuNoResults","StyledStartMenuDot","span"],"sources":["../../../../src/components/Filter/Styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { ListItem, ListProps, List, ListItemProps } from \"../List\";\nimport { Menu, IMenu, MenuFooter, IMenuFooter } from \"../Menu\";\n\nexport const StyledMenu = styled(Menu)<IMenu>`\n ${tw`tw-relative`}\n ${tw`tw-overflow-hidden`}\n`;\n\nexport const StyledMenuFooter = styled(MenuFooter)<IMenuFooter>`\n ${tw`tw-justify-center`}\n`;\n\nexport const StyledStartMenuList = styled(List)<ListProps>`\n ${tw`tw-py-2`}\n`;\n\nexport const StyledStartMenuListItem = styled(ListItem)<ListItemProps>`\n ${tw`tw-pr-3`}\n`;\n\nexport const StyledStartMenuTitle = styled.div`\n ${tw`tw-flex-1`}\n`;\n\nexport const StyledStartMenuNoResults = styled.div`\n ${tw`tw-py-0.5`}\n ${tw`tw-text-center`}\n`;\n\nexport const StyledStartMenuDot = styled.span`\n border-radius: 50%;\n background-color: var(--color-primary);\n color: var(--page-paper-main);\n line-height: 15px;\n width: 15px;\n font-weight: bold;\n font-size: 10px;\n text-align: center;\n margin-left: 4px;\n`;\n\nStyledMenu.displayName = \"StyledMenu\";\nStyledMenuFooter.displayName = \"StyledMenuFooter\";\nStyledStartMenuList.displayName = \"StyledStartMenuList\";\nStyledStartMenuListItem.displayName = \"StyledStartMenuListItem\";\nStyledStartMenuTitle.displayName = \"StyledStartMenuTitle\";\nStyledStartMenuDot.displayName = \"StyledStartMenuDot\";\nStyledStartMenuNoResults.displayName = \"StyledStartMenuNoResults\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAGA,IAAAC,
|
|
1
|
+
{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireDefault","require","_Input","_List","_Menu","e","__esModule","default","StyledMenu","exports","styled","Menu","withConfig","displayName","componentId","StyledMenuFooter","MenuFooter","StyledStartMenuList","List","StyledStartMenuListItem","ListItem","StyledStartMenuTitle","div","StyledStartMenuNoResults","StyledStartMenuDot","span","StyledInputSubmenu","StyledInputSubmenuFooter","StyledInput","Input"],"sources":["../../../../src/components/Filter/Styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { Input } from \"../Input\";\nimport { ListItem, ListProps, List, ListItemProps } from \"../List\";\nimport { Menu, IMenu, MenuFooter, IMenuFooter } from \"../Menu\";\n\nexport const StyledMenu = styled(Menu)<IMenu>`\n ${tw`tw-relative`}\n ${tw`tw-overflow-hidden`}\n`;\n\nexport const StyledMenuFooter = styled(MenuFooter)<IMenuFooter>`\n ${tw`tw-justify-center`}\n`;\n\nexport const StyledStartMenuList = styled(List)<ListProps>`\n ${tw`tw-py-2`}\n`;\n\nexport const StyledStartMenuListItem = styled(ListItem)<ListItemProps>`\n ${tw`tw-pr-3`}\n`;\n\nexport const StyledStartMenuTitle = styled.div`\n ${tw`tw-flex-1`}\n`;\n\nexport const StyledStartMenuNoResults = styled.div`\n ${tw`tw-py-0.5`}\n ${tw`tw-text-center`}\n`;\n\nexport const StyledStartMenuDot = styled.span`\n border-radius: 50%;\n background-color: var(--color-primary);\n color: var(--page-paper-main);\n line-height: 15px;\n width: 15px;\n font-weight: bold;\n font-size: 10px;\n text-align: center;\n margin-left: 4px;\n`;\n\nexport const StyledInputSubmenu = styled.div`\n ${tw`tw-px-3 tw-pt-3 tw-pb-2`}\n`;\n\nexport const StyledInputSubmenuFooter = styled(MenuFooter)<IMenuFooter>`\n ${tw`tw-justify-between tw-pt-3`}\n height: auto;\n`;\n\nexport const StyledInput = styled(Input)`\n ${tw`tw-w-full tw-mb-5`}\n`;\n\nStyledMenu.displayName = \"StyledMenu\";\nStyledMenuFooter.displayName = \"StyledMenuFooter\";\nStyledStartMenuList.displayName = \"StyledStartMenuList\";\nStyledStartMenuListItem.displayName = \"StyledStartMenuListItem\";\nStyledStartMenuTitle.displayName = \"StyledStartMenuTitle\";\nStyledStartMenuDot.displayName = \"StyledStartMenuDot\";\nStyledStartMenuNoResults.displayName = \"StyledStartMenuNoResults\";\nStyledInputSubmenu.displayName = \"StyledInputSubmenu\";\nStyledInputSubmenuFooter.displayName = \"StyledInputSubmenuFooter\";\nStyledInput.displayName = \"StyledInput\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAGA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAA+D,SAAAD,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAExD,IAAMG,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAG,IAAAE,yBAAM,EAACC,UAAI,CAAC,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,kBAChC;EAAA;AAAY,CAAC,EACb;EAAA;AAAmB,CAAC,CACzB;AAEM,IAAMC,gBAAgB,GAAAN,OAAA,CAAAM,gBAAA,GAAG,IAAAL,yBAAM,EAACM,gBAAU,CAAC,CAAAJ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aAC5C;EAAA;AAAkB,CAAC,CACxB;AAEM,IAAMG,mBAAmB,GAAAR,OAAA,CAAAQ,mBAAA,GAAG,IAAAP,yBAAM,EAACQ,UAAI,CAAC,CAAAN,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aACzC;EAAA;EAAA;AAAQ,CAAC,CACd;AAEM,IAAMK,uBAAuB,GAAAV,OAAA,CAAAU,uBAAA,GAAG,IAAAT,yBAAM,EAACU,cAAQ,CAAC,CAAAR,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aACjD;EAAA;AAAQ,CAAC,CACd;AAEM,IAAMO,oBAAoB,GAAAZ,OAAA,CAAAY,oBAAA,GAAGX,yBAAM,CAACY,GAAG,CAAAV,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aACxC;EAAA;AAAU,CAAC,CAChB;AAEM,IAAMS,wBAAwB,GAAAd,OAAA,CAAAc,wBAAA,GAAGb,yBAAM,CAACY,GAAG,CAAAV,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,kBAC5C;EAAA;EAAA;AAAU,CAAC,EACX;EAAA;AAAe,CAAC,CACrB;AAEM,IAAMU,kBAAkB,GAAAf,OAAA,CAAAe,kBAAA,GAAGd,yBAAM,CAACe,IAAI,CAAAb,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,2LAU5C;AAEM,IAAMY,kBAAkB,GAAAjB,OAAA,CAAAiB,kBAAA,GAAGhB,yBAAM,CAACY,GAAG,CAAAV,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aACtC;EAAA;EAAA;EAAA;EAAA;AAAwB,CAAC,CAC9B;AAEM,IAAMa,wBAAwB,GAAAlB,OAAA,CAAAkB,wBAAA,GAAG,IAAAjB,yBAAM,EAACM,gBAAU,CAAC,CAAAJ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,0BACpD;EAAA;EAAA;AAA2B,CAAC,CAEjC;AAEM,IAAMc,WAAW,GAAAnB,OAAA,CAAAmB,WAAA,GAAG,IAAAlB,yBAAM,EAACmB,YAAK,CAAC,CAAAjB,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,aAClC;EAAA;EAAA;AAAkB,CAAC,CACxB;AAEDN,UAAU,CAACK,WAAW,GAAG,YAAY;AACrCE,gBAAgB,CAACF,WAAW,GAAG,kBAAkB;AACjDI,mBAAmB,CAACJ,WAAW,GAAG,qBAAqB;AACvDM,uBAAuB,CAACN,WAAW,GAAG,yBAAyB;AAC/DQ,oBAAoB,CAACR,WAAW,GAAG,sBAAsB;AACzDW,kBAAkB,CAACX,WAAW,GAAG,oBAAoB;AACrDU,wBAAwB,CAACV,WAAW,GAAG,0BAA0B;AACjEa,kBAAkB,CAACb,WAAW,GAAG,oBAAoB;AACrDc,wBAAwB,CAACd,WAAW,GAAG,0BAA0B;AACjEe,WAAW,CAACf,WAAW,GAAG,aAAa","ignoreList":[]}
|
|
@@ -10,7 +10,6 @@ export interface ConfirmDialogProps {
|
|
|
10
10
|
cancelBtnText?: string;
|
|
11
11
|
shouldShowCancelButton?: boolean;
|
|
12
12
|
isLoading?: boolean;
|
|
13
|
-
fullWidth?: boolean;
|
|
14
13
|
}
|
|
15
14
|
export declare const ConfirmDialog: React.ForwardRefExoticComponent<ConfirmDialogProps & React.RefAttributes<HTMLDivElement>>;
|
|
16
15
|
//# sourceMappingURL=ConfirmDialog.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmDialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAQrD,MAAM,WAAW,kBAAkB;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,SAAS,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ConfirmDialog.d.ts","sourceRoot":"","sources":["../../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAQrD,MAAM,WAAW,kBAAkB;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,aAAa,2FAyEzB,CAAC"}
|
|
@@ -14,8 +14,7 @@ export const ConfirmDialog = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
14
14
|
confirmBtnText = "OK",
|
|
15
15
|
cancelBtnText = "Cancel",
|
|
16
16
|
shouldShowCancelButton = true,
|
|
17
|
-
isLoading = false
|
|
18
|
-
fullWidth = false
|
|
17
|
+
isLoading = false
|
|
19
18
|
} = _ref;
|
|
20
19
|
useEffect(() => {
|
|
21
20
|
const handleKeyDown = event => {
|
|
@@ -36,8 +35,7 @@ export const ConfirmDialog = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
36
35
|
open: open,
|
|
37
36
|
onClose: onCancel,
|
|
38
37
|
className: classnames("c-confirm-dialog", className),
|
|
39
|
-
disableCloseOnEsc: isLoading
|
|
40
|
-
fullWidth: fullWidth
|
|
38
|
+
disableCloseOnEsc: isLoading
|
|
41
39
|
}, /*#__PURE__*/React.createElement(Dialog.Title, null, dialogTitle), /*#__PURE__*/React.createElement(Dialog.ContentDivider, null), /*#__PURE__*/React.createElement(Dialog.Content, null, /*#__PURE__*/React.createElement(Body2, {
|
|
42
40
|
lineHeight: "loose",
|
|
43
41
|
color: "secondary",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmDialog.js","names":["React","forwardRef","useEffect","classnames","Button","Dialog","Body2","ConfirmDialog","_ref","ref","open","onCancel","onConfirm","className","dialogTitle","dialogContent","confirmBtnText","cancelBtnText","shouldShowCancelButton","isLoading","
|
|
1
|
+
{"version":3,"file":"ConfirmDialog.js","names":["React","forwardRef","useEffect","classnames","Button","Dialog","Body2","ConfirmDialog","_ref","ref","open","onCancel","onConfirm","className","dialogTitle","dialogContent","confirmBtnText","cancelBtnText","shouldShowCancelButton","isLoading","handleKeyDown","event","key","preventDefault","window","addEventListener","removeEventListener","createElement","onClose","disableCloseOnEsc","Title","ContentDivider","Content","lineHeight","color","whitespace","Actions","variant","style","marginRight","onClick","disabled","type","displayName"],"sources":["../../../../src/components/ConfirmDialog/ConfirmDialog.tsx"],"sourcesContent":["import React, { forwardRef, useEffect } from \"react\";\n\nimport classnames from \"classnames\";\n\nimport { Button } from \"../Button/Button\";\nimport { Dialog } from \"../Dialog\";\nimport { Body2 } from \"../Typography/Variants/Body2\";\n\nexport interface ConfirmDialogProps {\n open?: boolean;\n onCancel?: () => void;\n onConfirm?: () => void;\n className?: string;\n dialogTitle?: string;\n dialogContent?: string;\n confirmBtnText?: string;\n cancelBtnText?: string;\n shouldShowCancelButton?: boolean;\n isLoading?: boolean;\n}\n\nexport const ConfirmDialog = forwardRef<HTMLDivElement, ConfirmDialogProps>(\n (\n {\n open = false,\n onCancel,\n onConfirm,\n className,\n dialogTitle = \"Discard changes?\",\n dialogContent = \"All unsaved changes will be lost.\",\n confirmBtnText = \"OK\",\n cancelBtnText = \"Cancel\",\n shouldShowCancelButton = true,\n isLoading = false,\n },\n ref\n ) => {\n useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Enter\" && onConfirm) {\n event.preventDefault();\n onConfirm();\n }\n };\n\n if (open) {\n window.addEventListener(\"keydown\", handleKeyDown);\n }\n\n return () => {\n window.removeEventListener(\"keydown\", handleKeyDown);\n };\n }, [open, onConfirm]);\n\n return (\n <Dialog\n ref={ref}\n open={open}\n onClose={onCancel}\n className={classnames(\"c-confirm-dialog\", className)}\n disableCloseOnEsc={isLoading}\n >\n <Dialog.Title>{dialogTitle}</Dialog.Title>\n <Dialog.ContentDivider />\n <Dialog.Content>\n <Body2 lineHeight=\"loose\" color=\"secondary\" whitespace=\"pre-line\">\n {dialogContent}\n </Body2>\n </Dialog.Content>\n <Dialog.ContentDivider />\n <Dialog.Actions>\n <Button\n variant=\"primary\"\n style={{ marginRight: \"12px\" }}\n onClick={onConfirm}\n disabled={isLoading}\n >\n {confirmBtnText}\n </Button>\n {shouldShowCancelButton ? (\n <Button\n variant=\"secondary\"\n data-action=\"cancel\"\n onClick={onCancel}\n type=\"button\"\n disabled={isLoading}\n >\n {cancelBtnText}\n </Button>\n ) : null}\n </Dialog.Actions>\n </Dialog>\n );\n }\n);\n\nConfirmDialog.displayName = \"ConfirmDialog\";\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,QAAQ,OAAO;AAEpD,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,MAAM,QAAQ,kBAAkB;AACzC,SAASC,MAAM,QAAQ,WAAW;AAClC,SAASC,KAAK,QAAQ,8BAA8B;AAepD,OAAO,MAAMC,aAAa,gBAAGN,UAAU,CACrC,CAAAO,IAAA,EAaEC,GAAG,KACA;EAAA,IAbH;IACEC,IAAI,GAAG,KAAK;IACZC,QAAQ;IACRC,SAAS;IACTC,SAAS;IACTC,WAAW,GAAG,kBAAkB;IAChCC,aAAa,GAAG,mCAAmC;IACnDC,cAAc,GAAG,IAAI;IACrBC,aAAa,GAAG,QAAQ;IACxBC,sBAAsB,GAAG,IAAI;IAC7BC,SAAS,GAAG;EACd,CAAC,GAAAX,IAAA;EAGDN,SAAS,CAAC,MAAM;IACd,MAAMkB,aAAa,GAAIC,KAAoB,IAAK;MAC9C,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,IAAIV,SAAS,EAAE;QACtCS,KAAK,CAACE,cAAc,CAAC,CAAC;QACtBX,SAAS,CAAC,CAAC;MACb;IACF,CAAC;IAED,IAAIF,IAAI,EAAE;MACRc,MAAM,CAACC,gBAAgB,CAAC,SAAS,EAAEL,aAAa,CAAC;IACnD;IAEA,OAAO,MAAM;MACXI,MAAM,CAACE,mBAAmB,CAAC,SAAS,EAAEN,aAAa,CAAC;IACtD,CAAC;EACH,CAAC,EAAE,CAACV,IAAI,EAAEE,SAAS,CAAC,CAAC;EAErB,oBACEZ,KAAA,CAAA2B,aAAA,CAACtB,MAAM;IACLI,GAAG,EAAEA,GAAI;IACTC,IAAI,EAAEA,IAAK;IACXkB,OAAO,EAAEjB,QAAS;IAClBE,SAAS,EAAEV,UAAU,CAAC,kBAAkB,EAAEU,SAAS,CAAE;IACrDgB,iBAAiB,EAAEV;EAAU,gBAE7BnB,KAAA,CAAA2B,aAAA,CAACtB,MAAM,CAACyB,KAAK,QAAEhB,WAA0B,CAAC,eAC1Cd,KAAA,CAAA2B,aAAA,CAACtB,MAAM,CAAC0B,cAAc,MAAE,CAAC,eACzB/B,KAAA,CAAA2B,aAAA,CAACtB,MAAM,CAAC2B,OAAO,qBACbhC,KAAA,CAAA2B,aAAA,CAACrB,KAAK;IAAC2B,UAAU,EAAC,OAAO;IAACC,KAAK,EAAC,WAAW;IAACC,UAAU,EAAC;EAAU,GAC9DpB,aACI,CACO,CAAC,eACjBf,KAAA,CAAA2B,aAAA,CAACtB,MAAM,CAAC0B,cAAc,MAAE,CAAC,eACzB/B,KAAA,CAAA2B,aAAA,CAACtB,MAAM,CAAC+B,OAAO,qBACbpC,KAAA,CAAA2B,aAAA,CAACvB,MAAM;IACLiC,OAAO,EAAC,SAAS;IACjBC,KAAK,EAAE;MAAEC,WAAW,EAAE;IAAO,CAAE;IAC/BC,OAAO,EAAE5B,SAAU;IACnB6B,QAAQ,EAAEtB;EAAU,GAEnBH,cACK,CAAC,EACRE,sBAAsB,gBACrBlB,KAAA,CAAA2B,aAAA,CAACvB,MAAM;IACLiC,OAAO,EAAC,WAAW;IACnB,eAAY,QAAQ;IACpBG,OAAO,EAAE7B,QAAS;IAClB+B,IAAI,EAAC,QAAQ;IACbD,QAAQ,EAAEtB;EAAU,GAEnBF,aACK,CAAC,GACP,IACU,CACV,CAAC;AAEb,CACF,CAAC;AAEDV,aAAa,CAACoC,WAAW,GAAG,eAAe","ignoreList":[]}
|
|
@@ -7,7 +7,6 @@ export interface DialogProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
7
7
|
disableCloseOnEsc?: boolean;
|
|
8
8
|
animate?: "fade" | "slide";
|
|
9
9
|
onClickOutside?: (event: any) => void;
|
|
10
|
-
fullWidth?: boolean;
|
|
11
10
|
}
|
|
12
11
|
export declare const _Dialog: React.ForwardRefExoticComponent<DialogProps & {
|
|
13
12
|
children?: React.ReactNode | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAc,cAAc,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAe7E,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,CAAC,KAAK,KAAA,KAAK,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAc,cAAc,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAe7E,MAAM,WAAW,WAAY,SAAQ,cAAc,CAAC,cAAc,CAAC;IACjE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,CAAC,KAAK,KAAA,KAAK,IAAI,CAAC;CAClC;AAED,eAAO,MAAM,OAAO;;wCAwDnB,CAAC;AAKF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;CAKjB,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
|
-
const _excluded = ["children", "open", "onClose", "className", "enableBackgroundClick", "disableCloseOnEsc", "animate", "onClickOutside"
|
|
3
|
+
const _excluded = ["children", "open", "onClose", "className", "enableBackgroundClick", "disableCloseOnEsc", "animate", "onClickOutside"];
|
|
4
4
|
import React, { forwardRef } from "react";
|
|
5
5
|
import classnames from "classnames";
|
|
6
6
|
|
|
@@ -23,8 +23,7 @@ export const _Dialog = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
23
23
|
enableBackgroundClick = false,
|
|
24
24
|
disableCloseOnEsc = false,
|
|
25
25
|
animate = "slide",
|
|
26
|
-
onClickOutside
|
|
27
|
-
fullWidth = false
|
|
26
|
+
onClickOutside
|
|
28
27
|
} = _ref,
|
|
29
28
|
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
30
29
|
const animateDialog = () => {
|
|
@@ -33,15 +32,13 @@ export const _Dialog = /*#__PURE__*/forwardRef((_ref, ref) => {
|
|
|
33
32
|
return /*#__PURE__*/React.createElement(Fade, {
|
|
34
33
|
in: open
|
|
35
34
|
}, /*#__PURE__*/React.createElement(StyledDialog, {
|
|
36
|
-
$fullWidth: fullWidth,
|
|
37
35
|
className: classnames("c-dialog", className)
|
|
38
36
|
}, children));
|
|
39
37
|
default:
|
|
40
38
|
return /*#__PURE__*/React.createElement(SlideFromTop, {
|
|
41
39
|
in: open
|
|
42
40
|
}, /*#__PURE__*/React.createElement(StyledDialog, {
|
|
43
|
-
className: classnames("c-dialog", className)
|
|
44
|
-
$fullWidth: fullWidth
|
|
41
|
+
className: classnames("c-dialog", className)
|
|
45
42
|
}, children));
|
|
46
43
|
}
|
|
47
44
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.js","names":["React","forwardRef","classnames","DialogActions","DialogContent","DialogContentDivider","DialogTitle","StyledDialog","Modal","Fade","SlideFromTop","_Dialog","_ref","ref","children","open","onClose","className","enableBackgroundClick","disableCloseOnEsc","animate","onClickOutside","
|
|
1
|
+
{"version":3,"file":"Dialog.js","names":["React","forwardRef","classnames","DialogActions","DialogContent","DialogContentDivider","DialogTitle","StyledDialog","Modal","Fade","SlideFromTop","_Dialog","_ref","ref","children","open","onClose","className","enableBackgroundClick","disableCloseOnEsc","animate","onClickOutside","rest","_objectWithoutPropertiesLoose","_excluded","animateDialog","createElement","in","_extends","disableBackgroundClick","displayName","Dialog","Object","assign","Title","Content","ContentDivider","Actions"],"sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import React, { forwardRef, HTMLAttributes, PropsWithChildren } from \"react\";\n\nimport classnames from \"classnames\";\n\n// import { DialogContext } from \"./DialogContext\";\n\nimport { DialogActions } from \"./DialogActions\";\nimport { DialogContent } from \"./DialogContent\";\nimport { DialogContentDivider } from \"./DialogContentDivider\";\nimport { DialogTitle } from \"./DialogTitle\";\nimport { StyledDialog } from \"./Styles\";\nimport { Modal } from \"../Modal\";\nimport { Fade } from \"../Transitions\";\nimport { SlideFromTop } from \"../Transitions/SlideFromTop\";\n\nexport interface DialogProps extends HTMLAttributes<HTMLDivElement> {\n open?: boolean;\n onClose?: () => void;\n className?: string;\n enableBackgroundClick?: boolean;\n disableCloseOnEsc?: boolean;\n animate?: \"fade\" | \"slide\";\n onClickOutside?: (event) => void;\n}\n\nexport const _Dialog = forwardRef<\n HTMLDivElement,\n PropsWithChildren<DialogProps>\n>(\n (\n {\n children,\n open = false,\n onClose,\n className,\n enableBackgroundClick = false,\n disableCloseOnEsc = false,\n animate = \"slide\",\n onClickOutside,\n ...rest\n },\n ref\n ) => {\n const animateDialog = () => {\n switch (animate) {\n case \"fade\":\n return (\n <Fade in={open}>\n <StyledDialog className={classnames(\"c-dialog\", className)}>\n {children}\n </StyledDialog>\n </Fade>\n );\n default:\n return (\n <SlideFromTop in={open}>\n <StyledDialog className={classnames(\"c-dialog\", className)}>\n {children}\n </StyledDialog>\n </SlideFromTop>\n );\n }\n };\n\n return (\n // <DialogContext.Provider value={{}}>\n\n <Modal\n ref={ref}\n open={open}\n onClose={onClose}\n disableBackgroundClick={!enableBackgroundClick}\n disableCloseOnEsc={disableCloseOnEsc}\n onClickOutside={onClickOutside}\n {...rest}\n >\n {animateDialog()}\n </Modal>\n // </DialogContext.Provider>\n );\n }\n);\n\n_Dialog.displayName = \"Dialog\";\n\n// https://github.com/DefinitelyTyped/DefinitelyTyped/issues/34757\nexport const Dialog = Object.assign({}, _Dialog, {\n Title: DialogTitle,\n Content: DialogContent,\n ContentDivider: DialogContentDivider,\n Actions: DialogActions,\n});\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAAIC,UAAU,QAA2C,OAAO;AAE5E,OAAOC,UAAU,MAAM,YAAY;;AAEnC;;AAEA,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SAASC,WAAW,QAAQ,eAAe;AAC3C,SAASC,YAAY,QAAQ,UAAU;AACvC,SAASC,KAAK,QAAQ,UAAU;AAChC,SAASC,IAAI,QAAQ,gBAAgB;AACrC,SAASC,YAAY,QAAQ,6BAA6B;AAY1D,OAAO,MAAMC,OAAO,gBAAGV,UAAU,CAI/B,CAAAW,IAAA,EAYEC,GAAG,KACA;EAAA,IAZH;MACEC,QAAQ;MACRC,IAAI,GAAG,KAAK;MACZC,OAAO;MACPC,SAAS;MACTC,qBAAqB,GAAG,KAAK;MAC7BC,iBAAiB,GAAG,KAAK;MACzBC,OAAO,GAAG,OAAO;MACjBC;IAEF,CAAC,GAAAT,IAAA;IADIU,IAAI,GAAAC,6BAAA,CAAAX,IAAA,EAAAY,SAAA;EAIT,MAAMC,aAAa,GAAGA,CAAA,KAAM;IAC1B,QAAQL,OAAO;MACb,KAAK,MAAM;QACT,oBACEpB,KAAA,CAAA0B,aAAA,CAACjB,IAAI;UAACkB,EAAE,EAAEZ;QAAK,gBACbf,KAAA,CAAA0B,aAAA,CAACnB,YAAY;UAACU,SAAS,EAAEf,UAAU,CAAC,UAAU,EAAEe,SAAS;QAAE,GACxDH,QACW,CACV,CAAC;MAEX;QACE,oBACEd,KAAA,CAAA0B,aAAA,CAAChB,YAAY;UAACiB,EAAE,EAAEZ;QAAK,gBACrBf,KAAA,CAAA0B,aAAA,CAACnB,YAAY;UAACU,SAAS,EAAEf,UAAU,CAAC,UAAU,EAAEe,SAAS;QAAE,GACxDH,QACW,CACF,CAAC;IAErB;EACF,CAAC;EAED;IAAA;IACE;IAEAd,KAAA,CAAA0B,aAAA,CAAClB,KAAK,EAAAoB,QAAA;MACJf,GAAG,EAAEA,GAAI;MACTE,IAAI,EAAEA,IAAK;MACXC,OAAO,EAAEA,OAAQ;MACjBa,sBAAsB,EAAE,CAACX,qBAAsB;MAC/CC,iBAAiB,EAAEA,iBAAkB;MACrCE,cAAc,EAAEA;IAAe,GAC3BC,IAAI,GAEPG,aAAa,CAAC,CACV;IACP;EAAA;AAEJ,CACF,CAAC;AAEDd,OAAO,CAACmB,WAAW,GAAG,QAAQ;;AAE9B;AACA,OAAO,MAAMC,MAAM,GAAGC,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAEtB,OAAO,EAAE;EAC/CuB,KAAK,EAAE5B,WAAW;EAClB6B,OAAO,EAAE/B,aAAa;EACtBgC,cAAc,EAAE/B,oBAAoB;EACpCgC,OAAO,EAAElC;AACX,CAAC,CAAC","ignoreList":[]}
|
|
@@ -1,6 +1,4 @@
|
|
|
1
|
-
export declare const StyledDialog: import("styled-components").StyledComponent<"div", any, {
|
|
2
|
-
$fullWidth?: boolean;
|
|
3
|
-
}, never>;
|
|
1
|
+
export declare const StyledDialog: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
4
2
|
export declare const StyledDialogTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
5
3
|
export declare const StyledDialogContent: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
6
4
|
export declare const StyledDialogContentDivider: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Dialog/Styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,YAAY
|
|
1
|
+
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Dialog/Styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,YAAY,oEA2BxB,CAAC;AAIF,eAAO,MAAM,iBAAiB,oEAK7B,CAAC;AAGF,eAAO,MAAM,mBAAmB,oEAQ/B,CAAC;AAGF,eAAO,MAAM,0BAA0B,oEAGtC,CAAC;AAGF,eAAO,MAAM,mBAAmB,oEAK/B,CAAC"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import styled
|
|
1
|
+
import styled from "styled-components";
|
|
2
2
|
import { BoxSizingStyle } from "../BoxSizingStyle";
|
|
3
3
|
import { screen } from "../BreakPoints";
|
|
4
4
|
import { FontStyle } from "../FontStyle";
|
|
5
5
|
export const StyledDialog = styled.div.withConfig({
|
|
6
6
|
displayName: "Styles__StyledDialog",
|
|
7
7
|
componentId: "sc-jwpvgm-0"
|
|
8
|
-
})(["display:flex;flex-direction:column;flex:1 1 auto;max-height:calc(100vh - 156px);background-color:var(--page-paper-main);color:var(--color-theme-900);box-shadow:var(--shadow-primary);border-radius:8px;width:310px;margin:60px auto 30px auto;position:relative
|
|
8
|
+
})(["display:flex;flex-direction:column;flex:1 1 auto;max-height:calc(100vh - 156px);background-color:var(--page-paper-main);color:var(--color-theme-900);box-shadow:var(--shadow-primary);border-radius:8px;width:310px;margin:60px auto 30px auto;position:relative;@media (max-width:640px){width:calc(100% - 32px);max-width:640px;margin-left:16px !important;margin-right:16px !important;}", " ", " ", "{width:540px;margin:126px auto 30px auto;}"], FontStyle, BoxSizingStyle, screen.sm);
|
|
9
9
|
StyledDialog.displayName = "StyledDialog";
|
|
10
10
|
export const StyledDialogTitle = styled.div.withConfig({
|
|
11
11
|
displayName: "Styles__StyledDialogTitle",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.js","names":["styled","
|
|
1
|
+
{"version":3,"file":"Styles.js","names":["styled","BoxSizingStyle","screen","FontStyle","StyledDialog","div","withConfig","displayName","componentId","sm","StyledDialogTitle","StyledDialogContent","StyledDialogContentDivider","StyledDialogActions"],"sources":["../../../../src/components/Dialog/Styles.ts"],"sourcesContent":["import styled from \"styled-components\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { screen } from \"../BreakPoints\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const StyledDialog = styled.div`\n display: flex;\n flex-direction: column;\n flex: 1 1 auto;\n max-height: calc(100vh - 156px);\n background-color: var(--page-paper-main);\n color: var(--color-theme-900);\n box-shadow: var(--shadow-primary);\n border-radius: 8px;\n width: 310px;\n margin: 60px auto 30px auto;\n position: relative;\n\n @media (max-width: 640px) {\n width: calc(100% - 32px);\n max-width: 640px;\n margin-left: 16px !important;\n margin-right: 16px !important;\n }\n\n ${FontStyle}\n ${BoxSizingStyle}\n\n ${screen.sm} {\n width: 540px;\n margin: 126px auto 30px auto;\n }\n`;\n\nStyledDialog.displayName = \"StyledDialog\";\n\nexport const StyledDialogTitle = styled.div`\n padding: 20px 30px;\n\n ${FontStyle}\n ${BoxSizingStyle}\n`;\nStyledDialogTitle.displayName = \"StyledDialogTitle\";\n\nexport const StyledDialogContent = styled.div`\n padding: 20px 30px;\n max-height: 580px;\n overflow-y: auto;\n flex: 1 1 auto;\n\n ${FontStyle}\n ${BoxSizingStyle}\n`;\nStyledDialogContent.displayName = \"StyledDialogContent\";\n\nexport const StyledDialogContentDivider = styled.div`\n border-top: 1px solid var(--border-primary);\n height: 1px;\n`;\nStyledDialogContentDivider.displayName = \"StyledDialogContentDivider\";\n\nexport const StyledDialogActions = styled.div`\n padding: 20px 30px;\n\n ${FontStyle}\n ${BoxSizingStyle}\n`;\nStyledDialogActions.displayName = \"StyledDialogActions\";\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AAEtC,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,SAAS,QAAQ,cAAc;AAExC,OAAO,MAAMC,YAAY,GAAGJ,MAAM,CAACK,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6bAoBlCL,SAAS,EACTF,cAAc,EAEdC,MAAM,CAACO,EAAE,CAIZ;AAEDL,YAAY,CAACG,WAAW,GAAG,cAAc;AAEzC,OAAO,MAAMG,iBAAiB,GAAGV,MAAM,CAACK,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oCAGvCL,SAAS,EACTF,cAAc,CACjB;AACDS,iBAAiB,CAACH,WAAW,GAAG,mBAAmB;AAEnD,OAAO,MAAMI,mBAAmB,GAAGX,MAAM,CAACK,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,mFAMzCL,SAAS,EACTF,cAAc,CACjB;AACDU,mBAAmB,CAACJ,WAAW,GAAG,qBAAqB;AAEvD,OAAO,MAAMK,0BAA0B,GAAGZ,MAAM,CAACK,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,8DAGnD;AACDI,0BAA0B,CAACL,WAAW,GAAG,4BAA4B;AAErE,OAAO,MAAMM,mBAAmB,GAAGb,MAAM,CAACK,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,oCAGzCL,SAAS,EACTF,cAAc,CACjB;AACDY,mBAAmB,CAACN,WAAW,GAAG,qBAAqB","ignoreList":[]}
|
|
@@ -11,6 +11,14 @@ export type DataType = {
|
|
|
11
11
|
defaultValue?: string;
|
|
12
12
|
emptyValue?: string;
|
|
13
13
|
emptyAction?: (e: string | undefined) => void;
|
|
14
|
+
/** Type of submenu - 'select' renders options list, 'input' renders an input field with save button */
|
|
15
|
+
type?: "select" | "input";
|
|
16
|
+
/** Placeholder text for input field (only used when type='input') */
|
|
17
|
+
inputPlaceholder?: string;
|
|
18
|
+
/** Label for the save button (only used when type='input') */
|
|
19
|
+
saveLabel?: string;
|
|
20
|
+
/** Label for the clear button (only used when type='input') */
|
|
21
|
+
clearLabel?: string;
|
|
14
22
|
};
|
|
15
23
|
export type SelectedType = {
|
|
16
24
|
[key: number | string]: Array<string>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../../../src/components/Filter/Filter.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,EAAE,EACF,YAAY,EAKZ,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../../../src/components/Filter/Filter.tsx"],"names":[],"mappings":"AAAA,OAAc,EACZ,EAAE,EACF,YAAY,EAKZ,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAGf,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAS3C,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAU,MAAM,WAAW,CAAC;AAGxE,MAAM,MAAM,QAAQ,GAAG;IACrB,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,OAAO,EAAE,KAAK,CAAC,iBAAiB,GAAG,gBAAgB,CAAC,CAAC;IACrD,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;IAC9C,uGAAuG;IACvG,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC1B,qEAAqE;IACrE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,8DAA8D;IAC9D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+DAA+D;IAC/D,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;CACvC,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,gCAAgC;IAChC,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;IACtB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,YAAY,CAAC;IACxB,wBAAwB;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yDAAyD;IACzD,YAAY,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,QAAQ,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;IAC3C,4CAA4C;IAC5C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,iDAAiD;IACjD,YAAY,EAAE,MAAM,CAAC;IACrB,yDAAyD;IACzD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mCAAmC;IACnC,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4CAA4C;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,MAAM,EAAE,EAAE,CAAC,iBAAiB,CAAC,WAAW,CAAC,CA0QrD,CAAC"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
2
2
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
3
|
-
const _excluded = ["id", "title", "submenu", "searchPlaceholder", "disableInternalSort", "isSingleSelect", "defaultValue"];
|
|
3
|
+
const _excluded = ["id", "title", "submenu", "searchPlaceholder", "disableInternalSort", "isSingleSelect", "defaultValue", "type", "inputPlaceholder", "saveLabel", "clearLabel"];
|
|
4
4
|
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
|
5
5
|
import { MoveFocusInside } from "react-focus-lock";
|
|
6
|
+
import { InputSubmenu } from "./InputSubmenu";
|
|
6
7
|
import { StartMenu } from "./StartMenu";
|
|
7
8
|
import { StyledMenu, StyledMenuFooter } from "./Styles";
|
|
8
9
|
import { Submenu } from "./Submenu";
|
|
@@ -83,6 +84,27 @@ export const Filter = _ref => {
|
|
|
83
84
|
setFilter(newFilters);
|
|
84
85
|
onChange(newFilters);
|
|
85
86
|
}, [filter, menu, onChange]);
|
|
87
|
+
const handleInputSave = useCallback((id, value) => {
|
|
88
|
+
let newFilters = {};
|
|
89
|
+
if (value.trim()) {
|
|
90
|
+
newFilters = _extends({}, filter, {
|
|
91
|
+
[id]: [value]
|
|
92
|
+
});
|
|
93
|
+
} else {
|
|
94
|
+
newFilters = _extends({}, filter);
|
|
95
|
+
delete newFilters[id];
|
|
96
|
+
}
|
|
97
|
+
setFilter(newFilters);
|
|
98
|
+
onChange(newFilters);
|
|
99
|
+
setIndex();
|
|
100
|
+
}, [filter, onChange, setIndex]);
|
|
101
|
+
const handleInputClear = useCallback(id => {
|
|
102
|
+
const newFilters = _extends({}, filter);
|
|
103
|
+
delete newFilters[id];
|
|
104
|
+
setFilter(newFilters);
|
|
105
|
+
onChange(newFilters);
|
|
106
|
+
setIndex();
|
|
107
|
+
}, [filter, onChange, setIndex]);
|
|
86
108
|
const count = useMemo(() => {
|
|
87
109
|
let c = 0;
|
|
88
110
|
Object.values(filter).forEach(entry => {
|
|
@@ -99,7 +121,7 @@ export const Filter = _ref => {
|
|
|
99
121
|
}
|
|
100
122
|
for (const entry of data) {
|
|
101
123
|
var _entry$submenu;
|
|
102
|
-
if (((_entry$submenu = entry.submenu) == null ? void 0 : _entry$submenu.length) > 1) {
|
|
124
|
+
if (entry.type === "input" || ((_entry$submenu = entry.submenu) == null ? void 0 : _entry$submenu.length) > 1) {
|
|
103
125
|
return true;
|
|
104
126
|
}
|
|
105
127
|
}
|
|
@@ -143,7 +165,7 @@ export const Filter = _ref => {
|
|
|
143
165
|
shouldRenderSubmenus: shouldRenderSubmenus,
|
|
144
166
|
emptyFilterText: emptyFilterText
|
|
145
167
|
}, children))), shouldRenderSubmenus && data.map((_ref2, index) => {
|
|
146
|
-
var _filter$id;
|
|
168
|
+
var _filter$id$, _filter$id, _filter$id2;
|
|
147
169
|
let {
|
|
148
170
|
id,
|
|
149
171
|
title,
|
|
@@ -151,7 +173,11 @@ export const Filter = _ref => {
|
|
|
151
173
|
searchPlaceholder,
|
|
152
174
|
disableInternalSort,
|
|
153
175
|
isSingleSelect,
|
|
154
|
-
defaultValue
|
|
176
|
+
defaultValue,
|
|
177
|
+
type: submenuType = "select",
|
|
178
|
+
inputPlaceholder,
|
|
179
|
+
saveLabel = "Save",
|
|
180
|
+
clearLabel
|
|
155
181
|
} = _ref2,
|
|
156
182
|
rest = _objectWithoutPropertiesLoose(_ref2, _excluded);
|
|
157
183
|
return /*#__PURE__*/React.createElement(SlideLeftRightTransition, {
|
|
@@ -170,7 +196,14 @@ export const Filter = _ref => {
|
|
|
170
196
|
indexPage: menu === "index"
|
|
171
197
|
}, /*#__PURE__*/React.createElement(MoveFocusInside, {
|
|
172
198
|
disabled: enteredMenu !== id
|
|
173
|
-
}, /*#__PURE__*/React.createElement(
|
|
199
|
+
}, submenuType === "input" ? /*#__PURE__*/React.createElement(InputSubmenu, {
|
|
200
|
+
value: (_filter$id$ = (_filter$id = filter[id]) == null ? void 0 : _filter$id[0]) != null ? _filter$id$ : "",
|
|
201
|
+
placeholder: inputPlaceholder,
|
|
202
|
+
saveLabel: saveLabel,
|
|
203
|
+
clearLabel: clearLabel,
|
|
204
|
+
onSave: value => handleInputSave(id, value),
|
|
205
|
+
onClear: () => handleInputClear(id)
|
|
206
|
+
}) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Select, _extends({
|
|
174
207
|
options: submenu,
|
|
175
208
|
selected: filter[id],
|
|
176
209
|
onChange: handleChange,
|
|
@@ -182,11 +215,11 @@ export const Filter = _ref => {
|
|
|
182
215
|
disableSearch: Boolean(submenu.length <= 7),
|
|
183
216
|
disabledInternalSort: disableInternalSort,
|
|
184
217
|
defaultValue: defaultValue
|
|
185
|
-
}, rest)), (_filter$
|
|
218
|
+
}, rest)), (_filter$id2 = filter[id]) != null && _filter$id2.length ? /*#__PURE__*/React.createElement(StyledMenuFooter, null, /*#__PURE__*/React.createElement(Button, {
|
|
186
219
|
variant: "text colored",
|
|
187
220
|
size: "small",
|
|
188
221
|
onClick: handleReset
|
|
189
|
-
}, resetLabel)) : null)));
|
|
222
|
+
}, resetLabel)) : null))));
|
|
190
223
|
}))));
|
|
191
224
|
};
|
|
192
225
|
//# sourceMappingURL=Filter.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Filter.js","names":["React","useCallback","useEffect","useMemo","useState","MoveFocusInside","StartMenu","StyledMenu","StyledMenuFooter","Submenu","Button","CounterButton","FilterIcon","Select","ResizeTransition","SlideLeftRightTransition","Filter","_ref","data","selected","label","clearAllText","resetLabel","onChange","width","noResultText","emptyFilterText","children","icon","createElement","position","disabled","className","open","setOpen","menu","setMenu","isLeft","setIsLeft","height","setHeight","enteredMenu","setEnteredMenu","filter","setFilter","Object","keys","length","handleOpen","handleClose","handleHeight","element","_element$offsetHeight","offsetHeight","handleItemClick","value","setIndex","handleChange","selectedArray","newFilters","_extends","handleClearAll","event","stopPropagation","handleReset","count","c","values","forEach","entry","shouldRenderSubmenus","_entry$submenu","submenu","onOpen","onClose","target","active","counter","tooltipText","onClearAll","labelClassName","in","style","direction","onEnter","onEntered","onHeightChange","onItemClick","map","_ref2","index","_filter$id","id","title","searchPlaceholder","disableInternalSort","isSingleSelect","defaultValue","rest","_objectWithoutPropertiesLoose","_excluded","key","onBack","indexPage","options","type","autoHeightMax","placeholder","keepSameOptionsOrder","Boolean","disableSearch","disabledInternalSort","variant","size","onClick"],"sources":["../../../../src/components/Filter/Filter.tsx"],"sourcesContent":["import React, {\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useState,\n PropsWithChildren,\n} from \"react\";\nimport { MoveFocusInside } from \"react-focus-lock\";\n\nimport { Placement } from \"@popperjs/core\";\n\nimport { StartMenu } from \"./StartMenu\";\nimport { StyledMenu, StyledMenuFooter } from \"./Styles\";\nimport { Submenu } from \"./Submenu\";\nimport { Button } from \"../Button\";\nimport { CounterButton } from \"../CounterButton\";\nimport { FilterIcon } from \"../Icons\";\nimport { IOptionGroupProps, IOptionItemProps, Select } from \"../Select\";\nimport { ResizeTransition, SlideLeftRightTransition } from \"../Transitions\";\n\nexport type DataType = {\n id: number | string;\n title: string;\n searchPlaceholder?: string;\n disableInternalSort?: boolean;\n submenu: Array<IOptionGroupProps | IOptionItemProps>;\n isSingleSelect?: boolean;\n defaultValue?: string;\n emptyValue?: string;\n emptyAction?: (e: string | undefined) => void;\n};\n\nexport type SelectedType = {\n [key: number | string]: Array<string>;\n};\n\nexport interface FilterProps {\n /** Data rendered in submenus */\n data: Array<DataType>;\n /** Selected data inside submenus */\n selected?: SelectedType;\n /** Main filter label */\n label: string;\n /** Filter width */\n width?: number;\n /** Text displayed for the tooltip of clear all button */\n clearAllText: string;\n /** Handler for changes on the filter */\n onChange: (selected: SelectedType) => void;\n /** Label for reset button inside submenu */\n resetLabel?: string;\n /** Text to show when search results are empty */\n noResultText: string;\n /** Text to show when there are no submenus to display */\n emptyFilterText?: string;\n /** Position of the dropped menu. */\n position?: Placement;\n /** Icon of the trigger element. */\n icon?: ReactElement;\n /** Disabled state of the trigger. */\n disabled?: boolean;\n /** Applies passed classes for label text */\n className?: string;\n}\n\nexport const Filter: FC<PropsWithChildren<FilterProps>> = ({\n data,\n selected = {},\n label,\n clearAllText,\n resetLabel = \"Reset\",\n onChange,\n width = 260,\n noResultText,\n emptyFilterText,\n children,\n icon = <FilterIcon />,\n position = \"bottom-end\",\n disabled = false,\n className,\n}) => {\n const [open, setOpen] = useState(false);\n const [menu, setMenu] = useState<number | string>(\"index\");\n const [isLeft, setIsLeft] = useState(true);\n const [height, setHeight] = useState(0);\n const [enteredMenu, setEnteredMenu] = useState<number | string>(\"index\");\n const [filter, setFilter] = useState<SelectedType>(() => selected);\n\n useEffect(() => {\n if (Object.keys(selected).length > 0 || Object.keys(filter).length > 0) {\n setFilter(selected);\n }\n }, [selected, filter]);\n\n const handleOpen = useCallback(() => {\n setOpen(true);\n }, []);\n\n const handleClose = useCallback(() => {\n setOpen(false);\n setMenu(\"index\");\n setHeight(0);\n }, []);\n\n const handleHeight = useCallback((element) => {\n setHeight(element?.offsetHeight ?? 0);\n }, []);\n\n const handleItemClick = useCallback((value) => {\n setMenu(value);\n setIsLeft(true);\n }, []);\n\n const setIndex = useCallback(() => {\n setMenu(\"index\");\n setIsLeft(false);\n }, []);\n\n const handleChange = useCallback(\n (selectedArray) => {\n let newFilters = {};\n if (selectedArray.length) {\n newFilters = {\n ...filter,\n [menu]: selectedArray,\n };\n } else {\n newFilters = { ...filter };\n delete newFilters[menu];\n }\n setFilter(newFilters);\n onChange(newFilters);\n },\n [filter, menu, onChange]\n );\n\n const handleClearAll = useCallback(\n (event) => {\n event.stopPropagation();\n setFilter({});\n onChange({});\n },\n [onChange]\n );\n\n const handleReset = useCallback(() => {\n const newFilters = { ...filter };\n delete newFilters[menu];\n setFilter(newFilters);\n onChange(newFilters);\n }, [filter, menu, onChange]);\n\n const count = useMemo(() => {\n let c = 0;\n\n Object.values(filter).forEach((entry) => {\n if (typeof entry === \"string\") {\n return (c += 1);\n }\n\n return (c += entry.length);\n });\n return c;\n }, [filter]);\n\n const shouldRenderSubmenus = useMemo(() => {\n if (data.length === 0) {\n return false;\n }\n\n for (const entry of data) {\n if (entry.submenu?.length > 1) {\n return true;\n }\n }\n\n return false;\n }, [data]);\n\n return (\n <StyledMenu\n open={open}\n onOpen={handleOpen}\n onClose={handleClose}\n position={position}\n target={\n <CounterButton\n active={open}\n label={label}\n icon={icon}\n counter={count}\n tooltipText={clearAllText}\n onClearAll={handleClearAll}\n disabled={disabled}\n labelClassName={className}\n />\n }\n >\n <ResizeTransition in>\n <div style={{ height, width }}>\n <SlideLeftRightTransition\n in={menu === \"index\"}\n direction={isLeft ? \"left\" : \"right\"}\n onEnter={handleHeight}\n onEntered={() => setEnteredMenu(\"index\")}\n >\n <MoveFocusInside>\n <StartMenu\n data={data}\n selected={filter}\n style={{ width }}\n onHeightChange={setHeight}\n onItemClick={handleItemClick}\n shouldRenderSubmenus={shouldRenderSubmenus}\n emptyFilterText={emptyFilterText}\n >\n {children}\n </StartMenu>\n </MoveFocusInside>\n </SlideLeftRightTransition>\n {shouldRenderSubmenus &&\n data.map(\n (\n {\n id,\n title,\n submenu,\n searchPlaceholder,\n disableInternalSort,\n isSingleSelect,\n defaultValue,\n ...rest\n }: DataType,\n index: number\n ) => (\n <SlideLeftRightTransition\n key={`filter-submenu-${index}`}\n in={menu === id}\n direction={isLeft ? \"left\" : \"right\"}\n onEnter={handleHeight}\n onEntered={() => setEnteredMenu(id)}\n >\n <Submenu\n title={title}\n onBack={setIndex}\n onHeightChange={setHeight}\n style={{ width }}\n indexPage={menu === \"index\"}\n >\n <MoveFocusInside disabled={enteredMenu !== id}>\n <Select\n options={submenu}\n selected={filter[id]}\n onChange={handleChange}\n type={isSingleSelect ? \"single\" : \"multiple\"}\n autoHeightMax={255}\n placeholder={searchPlaceholder}\n noResultText={noResultText}\n keepSameOptionsOrder={Boolean(submenu.length <= 7)}\n disableSearch={Boolean(submenu.length <= 7)}\n disabledInternalSort={disableInternalSort}\n defaultValue={defaultValue}\n {...rest}\n />\n {filter[id]?.length ? (\n <StyledMenuFooter>\n <Button\n variant=\"text colored\"\n size=\"small\"\n onClick={handleReset}\n >\n {resetLabel}\n </Button>\n </StyledMenuFooter>\n ) : null}\n </MoveFocusInside>\n </Submenu>\n </SlideLeftRightTransition>\n )\n )}\n </div>\n </ResizeTransition>\n </StyledMenu>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Filter.js","names":["React","useCallback","useEffect","useMemo","useState","MoveFocusInside","InputSubmenu","StartMenu","StyledMenu","StyledMenuFooter","Submenu","Button","CounterButton","FilterIcon","Select","ResizeTransition","SlideLeftRightTransition","Filter","_ref","data","selected","label","clearAllText","resetLabel","onChange","width","noResultText","emptyFilterText","children","icon","createElement","position","disabled","className","open","setOpen","menu","setMenu","isLeft","setIsLeft","height","setHeight","enteredMenu","setEnteredMenu","filter","setFilter","Object","keys","length","handleOpen","handleClose","handleHeight","element","_element$offsetHeight","offsetHeight","handleItemClick","value","setIndex","handleChange","selectedArray","newFilters","_extends","handleClearAll","event","stopPropagation","handleReset","handleInputSave","id","trim","handleInputClear","count","c","values","forEach","entry","shouldRenderSubmenus","_entry$submenu","type","submenu","onOpen","onClose","target","active","counter","tooltipText","onClearAll","labelClassName","in","style","direction","onEnter","onEntered","onHeightChange","onItemClick","map","_ref2","index","_filter$id$","_filter$id","_filter$id2","title","searchPlaceholder","disableInternalSort","isSingleSelect","defaultValue","submenuType","inputPlaceholder","saveLabel","clearLabel","rest","_objectWithoutPropertiesLoose","_excluded","key","onBack","indexPage","placeholder","onSave","onClear","Fragment","options","autoHeightMax","keepSameOptionsOrder","Boolean","disableSearch","disabledInternalSort","variant","size","onClick"],"sources":["../../../../src/components/Filter/Filter.tsx"],"sourcesContent":["import React, {\n FC,\n ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useState,\n PropsWithChildren,\n} from \"react\";\nimport { MoveFocusInside } from \"react-focus-lock\";\n\nimport { Placement } from \"@popperjs/core\";\n\nimport { InputSubmenu } from \"./InputSubmenu\";\nimport { StartMenu } from \"./StartMenu\";\nimport { StyledMenu, StyledMenuFooter } from \"./Styles\";\nimport { Submenu } from \"./Submenu\";\nimport { Button } from \"../Button\";\nimport { CounterButton } from \"../CounterButton\";\nimport { FilterIcon } from \"../Icons\";\nimport { IOptionGroupProps, IOptionItemProps, Select } from \"../Select\";\nimport { ResizeTransition, SlideLeftRightTransition } from \"../Transitions\";\n\nexport type DataType = {\n id: number | string;\n title: string;\n searchPlaceholder?: string;\n disableInternalSort?: boolean;\n submenu: Array<IOptionGroupProps | IOptionItemProps>;\n isSingleSelect?: boolean;\n defaultValue?: string;\n emptyValue?: string;\n emptyAction?: (e: string | undefined) => void;\n /** Type of submenu - 'select' renders options list, 'input' renders an input field with save button */\n type?: \"select\" | \"input\";\n /** Placeholder text for input field (only used when type='input') */\n inputPlaceholder?: string;\n /** Label for the save button (only used when type='input') */\n saveLabel?: string;\n /** Label for the clear button (only used when type='input') */\n clearLabel?: string;\n};\n\nexport type SelectedType = {\n [key: number | string]: Array<string>;\n};\n\nexport interface FilterProps {\n /** Data rendered in submenus */\n data: Array<DataType>;\n /** Selected data inside submenus */\n selected?: SelectedType;\n /** Main filter label */\n label: string;\n /** Filter width */\n width?: number;\n /** Text displayed for the tooltip of clear all button */\n clearAllText: string;\n /** Handler for changes on the filter */\n onChange: (selected: SelectedType) => void;\n /** Label for reset button inside submenu */\n resetLabel?: string;\n /** Text to show when search results are empty */\n noResultText: string;\n /** Text to show when there are no submenus to display */\n emptyFilterText?: string;\n /** Position of the dropped menu. */\n position?: Placement;\n /** Icon of the trigger element. */\n icon?: ReactElement;\n /** Disabled state of the trigger. */\n disabled?: boolean;\n /** Applies passed classes for label text */\n className?: string;\n}\n\nexport const Filter: FC<PropsWithChildren<FilterProps>> = ({\n data,\n selected = {},\n label,\n clearAllText,\n resetLabel = \"Reset\",\n onChange,\n width = 260,\n noResultText,\n emptyFilterText,\n children,\n icon = <FilterIcon />,\n position = \"bottom-end\",\n disabled = false,\n className,\n}) => {\n const [open, setOpen] = useState(false);\n const [menu, setMenu] = useState<number | string>(\"index\");\n const [isLeft, setIsLeft] = useState(true);\n const [height, setHeight] = useState(0);\n const [enteredMenu, setEnteredMenu] = useState<number | string>(\"index\");\n const [filter, setFilter] = useState<SelectedType>(() => selected);\n\n useEffect(() => {\n if (Object.keys(selected).length > 0 || Object.keys(filter).length > 0) {\n setFilter(selected);\n }\n }, [selected, filter]);\n\n const handleOpen = useCallback(() => {\n setOpen(true);\n }, []);\n\n const handleClose = useCallback(() => {\n setOpen(false);\n setMenu(\"index\");\n setHeight(0);\n }, []);\n\n const handleHeight = useCallback((element) => {\n setHeight(element?.offsetHeight ?? 0);\n }, []);\n\n const handleItemClick = useCallback((value) => {\n setMenu(value);\n setIsLeft(true);\n }, []);\n\n const setIndex = useCallback(() => {\n setMenu(\"index\");\n setIsLeft(false);\n }, []);\n\n const handleChange = useCallback(\n (selectedArray) => {\n let newFilters = {};\n if (selectedArray.length) {\n newFilters = {\n ...filter,\n [menu]: selectedArray,\n };\n } else {\n newFilters = { ...filter };\n delete newFilters[menu];\n }\n setFilter(newFilters);\n onChange(newFilters);\n },\n [filter, menu, onChange]\n );\n\n const handleClearAll = useCallback(\n (event) => {\n event.stopPropagation();\n setFilter({});\n onChange({});\n },\n [onChange]\n );\n\n const handleReset = useCallback(() => {\n const newFilters = { ...filter };\n delete newFilters[menu];\n setFilter(newFilters);\n onChange(newFilters);\n }, [filter, menu, onChange]);\n\n const handleInputSave = useCallback(\n (id: number | string, value: string) => {\n let newFilters = {};\n if (value.trim()) {\n newFilters = {\n ...filter,\n [id]: [value],\n };\n } else {\n newFilters = { ...filter };\n delete newFilters[id];\n }\n setFilter(newFilters);\n onChange(newFilters);\n setIndex();\n },\n [filter, onChange, setIndex]\n );\n\n const handleInputClear = useCallback(\n (id: number | string) => {\n const newFilters = { ...filter };\n delete newFilters[id];\n setFilter(newFilters);\n onChange(newFilters);\n setIndex();\n },\n [filter, onChange, setIndex]\n );\n\n const count = useMemo(() => {\n let c = 0;\n\n Object.values(filter).forEach((entry) => {\n if (typeof entry === \"string\") {\n return (c += 1);\n }\n\n return (c += entry.length);\n });\n return c;\n }, [filter]);\n\n const shouldRenderSubmenus = useMemo(() => {\n if (data.length === 0) {\n return false;\n }\n\n for (const entry of data) {\n if (entry.type === \"input\" || entry.submenu?.length > 1) {\n return true;\n }\n }\n\n return false;\n }, [data]);\n\n return (\n <StyledMenu\n open={open}\n onOpen={handleOpen}\n onClose={handleClose}\n position={position}\n target={\n <CounterButton\n active={open}\n label={label}\n icon={icon}\n counter={count}\n tooltipText={clearAllText}\n onClearAll={handleClearAll}\n disabled={disabled}\n labelClassName={className}\n />\n }\n >\n <ResizeTransition in>\n <div style={{ height, width }}>\n <SlideLeftRightTransition\n in={menu === \"index\"}\n direction={isLeft ? \"left\" : \"right\"}\n onEnter={handleHeight}\n onEntered={() => setEnteredMenu(\"index\")}\n >\n <MoveFocusInside>\n <StartMenu\n data={data}\n selected={filter}\n style={{ width }}\n onHeightChange={setHeight}\n onItemClick={handleItemClick}\n shouldRenderSubmenus={shouldRenderSubmenus}\n emptyFilterText={emptyFilterText}\n >\n {children}\n </StartMenu>\n </MoveFocusInside>\n </SlideLeftRightTransition>\n {shouldRenderSubmenus &&\n data.map(\n (\n {\n id,\n title,\n submenu,\n searchPlaceholder,\n disableInternalSort,\n isSingleSelect,\n defaultValue,\n type: submenuType = \"select\",\n inputPlaceholder,\n saveLabel = \"Save\",\n clearLabel,\n ...rest\n }: DataType,\n index: number\n ) => (\n <SlideLeftRightTransition\n key={`filter-submenu-${index}`}\n in={menu === id}\n direction={isLeft ? \"left\" : \"right\"}\n onEnter={handleHeight}\n onEntered={() => setEnteredMenu(id)}\n >\n <Submenu\n title={title}\n onBack={setIndex}\n onHeightChange={setHeight}\n style={{ width }}\n indexPage={menu === \"index\"}\n >\n <MoveFocusInside disabled={enteredMenu !== id}>\n {submenuType === \"input\" ? (\n <InputSubmenu\n value={filter[id]?.[0] ?? \"\"}\n placeholder={inputPlaceholder}\n saveLabel={saveLabel}\n clearLabel={clearLabel}\n onSave={(value) => handleInputSave(id, value)}\n onClear={() => handleInputClear(id)}\n />\n ) : (\n <>\n <Select\n options={submenu}\n selected={filter[id]}\n onChange={handleChange}\n type={isSingleSelect ? \"single\" : \"multiple\"}\n autoHeightMax={255}\n placeholder={searchPlaceholder}\n noResultText={noResultText}\n keepSameOptionsOrder={Boolean(submenu.length <= 7)}\n disableSearch={Boolean(submenu.length <= 7)}\n disabledInternalSort={disableInternalSort}\n defaultValue={defaultValue}\n {...rest}\n />\n {filter[id]?.length ? (\n <StyledMenuFooter>\n <Button\n variant=\"text colored\"\n size=\"small\"\n onClick={handleReset}\n >\n {resetLabel}\n </Button>\n </StyledMenuFooter>\n ) : null}\n </>\n )}\n </MoveFocusInside>\n </Submenu>\n </SlideLeftRightTransition>\n )\n )}\n </div>\n </ResizeTransition>\n </StyledMenu>\n );\n};\n"],"mappings":";;;AAAA,OAAOA,KAAK,IAGVC,WAAW,EACXC,SAAS,EACTC,OAAO,EACPC,QAAQ,QAEH,OAAO;AACd,SAASC,eAAe,QAAQ,kBAAkB;AAIlD,SAASC,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,UAAU,EAAEC,gBAAgB,QAAQ,UAAU;AACvD,SAASC,OAAO,QAAQ,WAAW;AACnC,SAASC,MAAM,QAAQ,WAAW;AAClC,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,UAAU,QAAQ,UAAU;AACrC,SAA8CC,MAAM,QAAQ,WAAW;AACvE,SAASC,gBAAgB,EAAEC,wBAAwB,QAAQ,gBAAgB;AAuD3E,OAAO,MAAMC,MAA0C,GAAGC,IAAA,IAepD;EAAA,IAfqD;IACzDC,IAAI;IACJC,QAAQ,GAAG,CAAC,CAAC;IACbC,KAAK;IACLC,YAAY;IACZC,UAAU,GAAG,OAAO;IACpBC,QAAQ;IACRC,KAAK,GAAG,GAAG;IACXC,YAAY;IACZC,eAAe;IACfC,QAAQ;IACRC,IAAI,gBAAG7B,KAAA,CAAA8B,aAAA,CAACjB,UAAU,MAAE,CAAC;IACrBkB,QAAQ,GAAG,YAAY;IACvBC,QAAQ,GAAG,KAAK;IAChBC;EACF,CAAC,GAAAf,IAAA;EACC,MAAM,CAACgB,IAAI,EAAEC,OAAO,CAAC,GAAG/B,QAAQ,CAAC,KAAK,CAAC;EACvC,MAAM,CAACgC,IAAI,EAAEC,OAAO,CAAC,GAAGjC,QAAQ,CAAkB,OAAO,CAAC;EAC1D,MAAM,CAACkC,MAAM,EAAEC,SAAS,CAAC,GAAGnC,QAAQ,CAAC,IAAI,CAAC;EAC1C,MAAM,CAACoC,MAAM,EAAEC,SAAS,CAAC,GAAGrC,QAAQ,CAAC,CAAC,CAAC;EACvC,MAAM,CAACsC,WAAW,EAAEC,cAAc,CAAC,GAAGvC,QAAQ,CAAkB,OAAO,CAAC;EACxE,MAAM,CAACwC,MAAM,EAAEC,SAAS,CAAC,GAAGzC,QAAQ,CAAe,MAAMgB,QAAQ,CAAC;EAElElB,SAAS,CAAC,MAAM;IACd,IAAI4C,MAAM,CAACC,IAAI,CAAC3B,QAAQ,CAAC,CAAC4B,MAAM,GAAG,CAAC,IAAIF,MAAM,CAACC,IAAI,CAACH,MAAM,CAAC,CAACI,MAAM,GAAG,CAAC,EAAE;MACtEH,SAAS,CAACzB,QAAQ,CAAC;IACrB;EACF,CAAC,EAAE,CAACA,QAAQ,EAAEwB,MAAM,CAAC,CAAC;EAEtB,MAAMK,UAAU,GAAGhD,WAAW,CAAC,MAAM;IACnCkC,OAAO,CAAC,IAAI,CAAC;EACf,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMe,WAAW,GAAGjD,WAAW,CAAC,MAAM;IACpCkC,OAAO,CAAC,KAAK,CAAC;IACdE,OAAO,CAAC,OAAO,CAAC;IAChBI,SAAS,CAAC,CAAC,CAAC;EACd,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMU,YAAY,GAAGlD,WAAW,CAAEmD,OAAO,IAAK;IAAA,IAAAC,qBAAA;IAC5CZ,SAAS,EAAAY,qBAAA,GAACD,OAAO,oBAAPA,OAAO,CAAEE,YAAY,YAAAD,qBAAA,GAAI,CAAC,CAAC;EACvC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAME,eAAe,GAAGtD,WAAW,CAAEuD,KAAK,IAAK;IAC7CnB,OAAO,CAACmB,KAAK,CAAC;IACdjB,SAAS,CAAC,IAAI,CAAC;EACjB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMkB,QAAQ,GAAGxD,WAAW,CAAC,MAAM;IACjCoC,OAAO,CAAC,OAAO,CAAC;IAChBE,SAAS,CAAC,KAAK,CAAC;EAClB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMmB,YAAY,GAAGzD,WAAW,CAC7B0D,aAAa,IAAK;IACjB,IAAIC,UAAU,GAAG,CAAC,CAAC;IACnB,IAAID,aAAa,CAACX,MAAM,EAAE;MACxBY,UAAU,GAAAC,QAAA,KACLjB,MAAM;QACT,CAACR,IAAI,GAAGuB;MAAa,EACtB;IACH,CAAC,MAAM;MACLC,UAAU,GAAAC,QAAA,KAAQjB,MAAM,CAAE;MAC1B,OAAOgB,UAAU,CAACxB,IAAI,CAAC;IACzB;IACAS,SAAS,CAACe,UAAU,CAAC;IACrBpC,QAAQ,CAACoC,UAAU,CAAC;EACtB,CAAC,EACD,CAAChB,MAAM,EAAER,IAAI,EAAEZ,QAAQ,CACzB,CAAC;EAED,MAAMsC,cAAc,GAAG7D,WAAW,CAC/B8D,KAAK,IAAK;IACTA,KAAK,CAACC,eAAe,CAAC,CAAC;IACvBnB,SAAS,CAAC,CAAC,CAAC,CAAC;IACbrB,QAAQ,CAAC,CAAC,CAAC,CAAC;EACd,CAAC,EACD,CAACA,QAAQ,CACX,CAAC;EAED,MAAMyC,WAAW,GAAGhE,WAAW,CAAC,MAAM;IACpC,MAAM2D,UAAU,GAAAC,QAAA,KAAQjB,MAAM,CAAE;IAChC,OAAOgB,UAAU,CAACxB,IAAI,CAAC;IACvBS,SAAS,CAACe,UAAU,CAAC;IACrBpC,QAAQ,CAACoC,UAAU,CAAC;EACtB,CAAC,EAAE,CAAChB,MAAM,EAAER,IAAI,EAAEZ,QAAQ,CAAC,CAAC;EAE5B,MAAM0C,eAAe,GAAGjE,WAAW,CACjC,CAACkE,EAAmB,EAAEX,KAAa,KAAK;IACtC,IAAII,UAAU,GAAG,CAAC,CAAC;IACnB,IAAIJ,KAAK,CAACY,IAAI,CAAC,CAAC,EAAE;MAChBR,UAAU,GAAAC,QAAA,KACLjB,MAAM;QACT,CAACuB,EAAE,GAAG,CAACX,KAAK;MAAC,EACd;IACH,CAAC,MAAM;MACLI,UAAU,GAAAC,QAAA,KAAQjB,MAAM,CAAE;MAC1B,OAAOgB,UAAU,CAACO,EAAE,CAAC;IACvB;IACAtB,SAAS,CAACe,UAAU,CAAC;IACrBpC,QAAQ,CAACoC,UAAU,CAAC;IACpBH,QAAQ,CAAC,CAAC;EACZ,CAAC,EACD,CAACb,MAAM,EAAEpB,QAAQ,EAAEiC,QAAQ,CAC7B,CAAC;EAED,MAAMY,gBAAgB,GAAGpE,WAAW,CACjCkE,EAAmB,IAAK;IACvB,MAAMP,UAAU,GAAAC,QAAA,KAAQjB,MAAM,CAAE;IAChC,OAAOgB,UAAU,CAACO,EAAE,CAAC;IACrBtB,SAAS,CAACe,UAAU,CAAC;IACrBpC,QAAQ,CAACoC,UAAU,CAAC;IACpBH,QAAQ,CAAC,CAAC;EACZ,CAAC,EACD,CAACb,MAAM,EAAEpB,QAAQ,EAAEiC,QAAQ,CAC7B,CAAC;EAED,MAAMa,KAAK,GAAGnE,OAAO,CAAC,MAAM;IAC1B,IAAIoE,CAAC,GAAG,CAAC;IAETzB,MAAM,CAAC0B,MAAM,CAAC5B,MAAM,CAAC,CAAC6B,OAAO,CAAEC,KAAK,IAAK;MACvC,IAAI,OAAOA,KAAK,KAAK,QAAQ,EAAE;QAC7B,OAAQH,CAAC,IAAI,CAAC;MAChB;MAEA,OAAQA,CAAC,IAAIG,KAAK,CAAC1B,MAAM;IAC3B,CAAC,CAAC;IACF,OAAOuB,CAAC;EACV,CAAC,EAAE,CAAC3B,MAAM,CAAC,CAAC;EAEZ,MAAM+B,oBAAoB,GAAGxE,OAAO,CAAC,MAAM;IACzC,IAAIgB,IAAI,CAAC6B,MAAM,KAAK,CAAC,EAAE;MACrB,OAAO,KAAK;IACd;IAEA,KAAK,MAAM0B,KAAK,IAAIvD,IAAI,EAAE;MAAA,IAAAyD,cAAA;MACxB,IAAIF,KAAK,CAACG,IAAI,KAAK,OAAO,IAAI,EAAAD,cAAA,GAAAF,KAAK,CAACI,OAAO,qBAAbF,cAAA,CAAe5B,MAAM,IAAG,CAAC,EAAE;QACvD,OAAO,IAAI;MACb;IACF;IAEA,OAAO,KAAK;EACd,CAAC,EAAE,CAAC7B,IAAI,CAAC,CAAC;EAEV,oBACEnB,KAAA,CAAA8B,aAAA,CAACtB,UAAU;IACT0B,IAAI,EAAEA,IAAK;IACX6C,MAAM,EAAE9B,UAAW;IACnB+B,OAAO,EAAE9B,WAAY;IACrBnB,QAAQ,EAAEA,QAAS;IACnBkD,MAAM,eACJjF,KAAA,CAAA8B,aAAA,CAAClB,aAAa;MACZsE,MAAM,EAAEhD,IAAK;MACbb,KAAK,EAAEA,KAAM;MACbQ,IAAI,EAAEA,IAAK;MACXsD,OAAO,EAAEb,KAAM;MACfc,WAAW,EAAE9D,YAAa;MAC1B+D,UAAU,EAAEvB,cAAe;MAC3B9B,QAAQ,EAAEA,QAAS;MACnBsD,cAAc,EAAErD;IAAU,CAC3B;EACF,gBAEDjC,KAAA,CAAA8B,aAAA,CAACf,gBAAgB;IAACwE,EAAE;EAAA,gBAClBvF,KAAA,CAAA8B,aAAA;IAAK0D,KAAK,EAAE;MAAEhD,MAAM;MAAEf;IAAM;EAAE,gBAC5BzB,KAAA,CAAA8B,aAAA,CAACd,wBAAwB;IACvBuE,EAAE,EAAEnD,IAAI,KAAK,OAAQ;IACrBqD,SAAS,EAAEnD,MAAM,GAAG,MAAM,GAAG,OAAQ;IACrCoD,OAAO,EAAEvC,YAAa;IACtBwC,SAAS,EAAEA,CAAA,KAAMhD,cAAc,CAAC,OAAO;EAAE,gBAEzC3C,KAAA,CAAA8B,aAAA,CAACzB,eAAe,qBACdL,KAAA,CAAA8B,aAAA,CAACvB,SAAS;IACRY,IAAI,EAAEA,IAAK;IACXC,QAAQ,EAAEwB,MAAO;IACjB4C,KAAK,EAAE;MAAE/D;IAAM,CAAE;IACjBmE,cAAc,EAAEnD,SAAU;IAC1BoD,WAAW,EAAEtC,eAAgB;IAC7BoB,oBAAoB,EAAEA,oBAAqB;IAC3ChD,eAAe,EAAEA;EAAgB,GAEhCC,QACQ,CACI,CACO,CAAC,EAC1B+C,oBAAoB,IACnBxD,IAAI,CAAC2E,GAAG,CACN,CAAAC,KAAA,EAeEC,KAAa;IAAA,IAAAC,WAAA,EAAAC,UAAA,EAAAC,WAAA;IAAA,IAdb;QACEhC,EAAE;QACFiC,KAAK;QACLtB,OAAO;QACPuB,iBAAiB;QACjBC,mBAAmB;QACnBC,cAAc;QACdC,YAAY;QACZ3B,IAAI,EAAE4B,WAAW,GAAG,QAAQ;QAC5BC,gBAAgB;QAChBC,SAAS,GAAG,MAAM;QAClBC;MAEQ,CAAC,GAAAb,KAAA;MADNc,IAAI,GAAAC,6BAAA,CAAAf,KAAA,EAAAgB,SAAA;IAAA,oBAIT/G,KAAA,CAAA8B,aAAA,CAACd,wBAAwB;MACvBgG,GAAG,sBAAoBhB,KAAQ;MAC/BT,EAAE,EAAEnD,IAAI,KAAK+B,EAAG;MAChBsB,SAAS,EAAEnD,MAAM,GAAG,MAAM,GAAG,OAAQ;MACrCoD,OAAO,EAAEvC,YAAa;MACtBwC,SAAS,EAAEA,CAAA,KAAMhD,cAAc,CAACwB,EAAE;IAAE,gBAEpCnE,KAAA,CAAA8B,aAAA,CAACpB,OAAO;MACN0F,KAAK,EAAEA,KAAM;MACba,MAAM,EAAExD,QAAS;MACjBmC,cAAc,EAAEnD,SAAU;MAC1B+C,KAAK,EAAE;QAAE/D;MAAM,CAAE;MACjByF,SAAS,EAAE9E,IAAI,KAAK;IAAQ,gBAE5BpC,KAAA,CAAA8B,aAAA,CAACzB,eAAe;MAAC2B,QAAQ,EAAEU,WAAW,KAAKyB;IAAG,GAC3CsC,WAAW,KAAK,OAAO,gBACtBzG,KAAA,CAAA8B,aAAA,CAACxB,YAAY;MACXkD,KAAK,GAAAyC,WAAA,IAAAC,UAAA,GAAEtD,MAAM,CAACuB,EAAE,CAAC,qBAAV+B,UAAA,CAAa,CAAC,CAAC,YAAAD,WAAA,GAAI,EAAG;MAC7BkB,WAAW,EAAET,gBAAiB;MAC9BC,SAAS,EAAEA,SAAU;MACrBC,UAAU,EAAEA,UAAW;MACvBQ,MAAM,EAAG5D,KAAK,IAAKU,eAAe,CAACC,EAAE,EAAEX,KAAK,CAAE;MAC9C6D,OAAO,EAAEA,CAAA,KAAMhD,gBAAgB,CAACF,EAAE;IAAE,CACrC,CAAC,gBAEFnE,KAAA,CAAA8B,aAAA,CAAA9B,KAAA,CAAAsH,QAAA,qBACEtH,KAAA,CAAA8B,aAAA,CAAChB,MAAM,EAAA+C,QAAA;MACL0D,OAAO,EAAEzC,OAAQ;MACjB1D,QAAQ,EAAEwB,MAAM,CAACuB,EAAE,CAAE;MACrB3C,QAAQ,EAAEkC,YAAa;MACvBmB,IAAI,EAAE0B,cAAc,GAAG,QAAQ,GAAG,UAAW;MAC7CiB,aAAa,EAAE,GAAI;MACnBL,WAAW,EAAEd,iBAAkB;MAC/B3E,YAAY,EAAEA,YAAa;MAC3B+F,oBAAoB,EAAEC,OAAO,CAAC5C,OAAO,CAAC9B,MAAM,IAAI,CAAC,CAAE;MACnD2E,aAAa,EAAED,OAAO,CAAC5C,OAAO,CAAC9B,MAAM,IAAI,CAAC,CAAE;MAC5C4E,oBAAoB,EAAEtB,mBAAoB;MAC1CE,YAAY,EAAEA;IAAa,GACvBK,IAAI,CACT,CAAC,EACD,CAAAV,WAAA,GAAAvD,MAAM,CAACuB,EAAE,CAAC,aAAVgC,WAAA,CAAYnD,MAAM,gBACjBhD,KAAA,CAAA8B,aAAA,CAACrB,gBAAgB,qBACfT,KAAA,CAAA8B,aAAA,CAACnB,MAAM;MACLkH,OAAO,EAAC,cAAc;MACtBC,IAAI,EAAC,OAAO;MACZC,OAAO,EAAE9D;IAAY,GAEpB1C,UACK,CACQ,CAAC,GACjB,IACJ,CAEW,CACV,CACe,CAAC;EAAA,CAE/B,CACC,CACW,CACR,CAAC;AAEjB,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { FC } from "react";
|
|
2
|
+
interface InputSubmenuProps {
|
|
3
|
+
value?: string;
|
|
4
|
+
placeholder?: string;
|
|
5
|
+
saveLabel: string;
|
|
6
|
+
clearLabel?: string;
|
|
7
|
+
onSave: (value: string) => void;
|
|
8
|
+
onClear: () => void;
|
|
9
|
+
}
|
|
10
|
+
export declare const InputSubmenu: FC<InputSubmenuProps>;
|
|
11
|
+
export {};
|
|
12
|
+
//# sourceMappingURL=InputSubmenu.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputSubmenu.d.ts","sourceRoot":"","sources":["../../../../src/components/Filter/InputSubmenu.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAoC,MAAM,OAAO,CAAC;AASpE,UAAU,iBAAiB;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,EAAE,EAAE,CAAC,iBAAiB,CAoD9C,CAAC"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import React, { useState, useCallback, useEffect } from "react";
|
|
2
|
+
import { StyledInputSubmenu, StyledInputSubmenuFooter, StyledInput } from "./Styles";
|
|
3
|
+
import { Button } from "../Button";
|
|
4
|
+
export const InputSubmenu = _ref => {
|
|
5
|
+
let {
|
|
6
|
+
value = "",
|
|
7
|
+
placeholder,
|
|
8
|
+
saveLabel,
|
|
9
|
+
clearLabel = "Clear",
|
|
10
|
+
onSave,
|
|
11
|
+
onClear
|
|
12
|
+
} = _ref;
|
|
13
|
+
const [inputValue, setInputValue] = useState(value);
|
|
14
|
+
useEffect(() => {
|
|
15
|
+
setInputValue(value);
|
|
16
|
+
}, [value]);
|
|
17
|
+
const handleChange = useCallback(event => {
|
|
18
|
+
setInputValue(event.target.value);
|
|
19
|
+
}, []);
|
|
20
|
+
const handleSave = useCallback(() => {
|
|
21
|
+
onSave(inputValue);
|
|
22
|
+
}, [inputValue, onSave]);
|
|
23
|
+
const handleKeyDown = useCallback(event => {
|
|
24
|
+
if (event.key === "Enter") {
|
|
25
|
+
onSave(inputValue);
|
|
26
|
+
}
|
|
27
|
+
}, [inputValue, onSave]);
|
|
28
|
+
return /*#__PURE__*/React.createElement(StyledInputSubmenu, null, /*#__PURE__*/React.createElement(StyledInput, {
|
|
29
|
+
value: inputValue,
|
|
30
|
+
onChange: handleChange,
|
|
31
|
+
onKeyDown: handleKeyDown,
|
|
32
|
+
placeholder: placeholder
|
|
33
|
+
}), /*#__PURE__*/React.createElement(StyledInputSubmenuFooter, null, /*#__PURE__*/React.createElement(Button, {
|
|
34
|
+
variant: "primary",
|
|
35
|
+
size: "small",
|
|
36
|
+
onClick: handleSave
|
|
37
|
+
}, saveLabel), /*#__PURE__*/React.createElement(Button, {
|
|
38
|
+
variant: "text gray",
|
|
39
|
+
size: "small",
|
|
40
|
+
onClick: onClear
|
|
41
|
+
}, clearLabel)));
|
|
42
|
+
};
|
|
43
|
+
//# sourceMappingURL=InputSubmenu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputSubmenu.js","names":["React","useState","useCallback","useEffect","StyledInputSubmenu","StyledInputSubmenuFooter","StyledInput","Button","InputSubmenu","_ref","value","placeholder","saveLabel","clearLabel","onSave","onClear","inputValue","setInputValue","handleChange","event","target","handleSave","handleKeyDown","key","createElement","onChange","onKeyDown","variant","size","onClick"],"sources":["../../../../src/components/Filter/InputSubmenu.tsx"],"sourcesContent":["import React, { FC, useState, useCallback, useEffect } from \"react\";\n\nimport {\n StyledInputSubmenu,\n StyledInputSubmenuFooter,\n StyledInput,\n} from \"./Styles\";\nimport { Button } from \"../Button\";\n\ninterface InputSubmenuProps {\n value?: string;\n placeholder?: string;\n saveLabel: string;\n clearLabel?: string;\n onSave: (value: string) => void;\n onClear: () => void;\n}\n\nexport const InputSubmenu: FC<InputSubmenuProps> = ({\n value = \"\",\n placeholder,\n saveLabel,\n clearLabel = \"Clear\",\n onSave,\n onClear,\n}) => {\n const [inputValue, setInputValue] = useState(value);\n\n useEffect(() => {\n setInputValue(value);\n }, [value]);\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n setInputValue(event.target.value);\n },\n []\n );\n\n const handleSave = useCallback(() => {\n onSave(inputValue);\n }, [inputValue, onSave]);\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === \"Enter\") {\n onSave(inputValue);\n }\n },\n [inputValue, onSave]\n );\n\n return (\n <StyledInputSubmenu>\n <StyledInput\n value={inputValue}\n onChange={handleChange}\n onKeyDown={handleKeyDown}\n placeholder={placeholder}\n />\n <StyledInputSubmenuFooter>\n <Button variant=\"primary\" size=\"small\" onClick={handleSave}>\n {saveLabel}\n </Button>\n <Button variant=\"text gray\" size=\"small\" onClick={onClear}>\n {clearLabel}\n </Button>\n </StyledInputSubmenuFooter>\n </StyledInputSubmenu>\n );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,QAAQ,EAAEC,WAAW,EAAEC,SAAS,QAAQ,OAAO;AAEnE,SACEC,kBAAkB,EAClBC,wBAAwB,EACxBC,WAAW,QACN,UAAU;AACjB,SAASC,MAAM,QAAQ,WAAW;AAWlC,OAAO,MAAMC,YAAmC,GAAGC,IAAA,IAO7C;EAAA,IAP8C;IAClDC,KAAK,GAAG,EAAE;IACVC,WAAW;IACXC,SAAS;IACTC,UAAU,GAAG,OAAO;IACpBC,MAAM;IACNC;EACF,CAAC,GAAAN,IAAA;EACC,MAAM,CAACO,UAAU,EAAEC,aAAa,CAAC,GAAGhB,QAAQ,CAACS,KAAK,CAAC;EAEnDP,SAAS,CAAC,MAAM;IACdc,aAAa,CAACP,KAAK,CAAC;EACtB,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAEX,MAAMQ,YAAY,GAAGhB,WAAW,CAC7BiB,KAA0C,IAAK;IAC9CF,aAAa,CAACE,KAAK,CAACC,MAAM,CAACV,KAAK,CAAC;EACnC,CAAC,EACD,EACF,CAAC;EAED,MAAMW,UAAU,GAAGnB,WAAW,CAAC,MAAM;IACnCY,MAAM,CAACE,UAAU,CAAC;EACpB,CAAC,EAAE,CAACA,UAAU,EAAEF,MAAM,CAAC,CAAC;EAExB,MAAMQ,aAAa,GAAGpB,WAAW,CAC9BiB,KAA4C,IAAK;IAChD,IAAIA,KAAK,CAACI,GAAG,KAAK,OAAO,EAAE;MACzBT,MAAM,CAACE,UAAU,CAAC;IACpB;EACF,CAAC,EACD,CAACA,UAAU,EAAEF,MAAM,CACrB,CAAC;EAED,oBACEd,KAAA,CAAAwB,aAAA,CAACpB,kBAAkB,qBACjBJ,KAAA,CAAAwB,aAAA,CAAClB,WAAW;IACVI,KAAK,EAAEM,UAAW;IAClBS,QAAQ,EAAEP,YAAa;IACvBQ,SAAS,EAAEJ,aAAc;IACzBX,WAAW,EAAEA;EAAY,CAC1B,CAAC,eACFX,KAAA,CAAAwB,aAAA,CAACnB,wBAAwB,qBACvBL,KAAA,CAAAwB,aAAA,CAACjB,MAAM;IAACoB,OAAO,EAAC,SAAS;IAACC,IAAI,EAAC,OAAO;IAACC,OAAO,EAAER;EAAW,GACxDT,SACK,CAAC,eACTZ,KAAA,CAAAwB,aAAA,CAACjB,MAAM;IAACoB,OAAO,EAAC,WAAW;IAACC,IAAI,EAAC,OAAO;IAACC,OAAO,EAAEd;EAAQ,GACvDF,UACK,CACgB,CACR,CAAC;AAEzB,CAAC","ignoreList":[]}
|
|
@@ -29,7 +29,8 @@ export const StartMenu = _ref => {
|
|
|
29
29
|
let {
|
|
30
30
|
id,
|
|
31
31
|
title,
|
|
32
|
-
submenu
|
|
32
|
+
submenu,
|
|
33
|
+
type
|
|
33
34
|
} = _ref2;
|
|
34
35
|
let count = 0;
|
|
35
36
|
// Popricati o ovome kada je selected[id] vrednost 0.
|
|
@@ -39,7 +40,7 @@ export const StartMenu = _ref => {
|
|
|
39
40
|
var _selected$id;
|
|
40
41
|
count = (_selected$id = selected[id]) == null ? void 0 : _selected$id.length;
|
|
41
42
|
}
|
|
42
|
-
if ((submenu == null ? void 0 : submenu.length) > 1) {
|
|
43
|
+
if (type === "input" || (submenu == null ? void 0 : submenu.length) > 1) {
|
|
43
44
|
return /*#__PURE__*/React.createElement(StyledStartMenuListItem, {
|
|
44
45
|
key: "filter-list-item-" + index,
|
|
45
46
|
onClick: () => onItemClick(id)
|