@finsemble/finsemble-ui 7.2.0-beta.0 → 7.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +10 -9
- package/react/components/appCatalog/AppCatalogComponent.d.ts +12 -0
- package/react/components/appCatalog/components/AppCard.d.ts +13 -0
- package/react/components/appCatalog/components/Carousel.d.ts +5 -0
- package/react/components/appCatalog/components/Showcase/AppShowcase.d.ts +9 -0
- package/react/components/common/ButtonRow.d.ts +1 -1
- package/react/components/common/ButtonRow.js +4 -6
- package/react/components/common/ButtonRow.js.map +1 -1
- package/react/components/common/FinsembleToggleButtonBar.js +1 -1
- package/react/components/common/FinsembleToggleButtonBar.js.map +1 -1
- package/react/components/common/css/FinsembleToggle.css +6 -6
- package/react/components/fdc3Resolver/ResolverContainer.js +1 -0
- package/react/components/fdc3Resolver/ResolverContainer.js.map +1 -1
- package/react/components/fdc3Resolver/ResolverDialog.js +27 -8
- package/react/components/fdc3Resolver/ResolverDialog.js.map +1 -1
- package/react/components/legacyControls/FinsembleDialogButton.js +5 -1
- package/react/components/legacyControls/FinsembleDialogButton.js.map +1 -1
- package/react/components/legacyControls/FinsembleDialogTextInput.d.ts +1 -0
- package/react/components/legacyControls/FinsembleDialogTextInput.js +1 -1
- package/react/components/legacyControls/FinsembleDialogTextInput.js.map +1 -1
- package/react/components/menu/keyboardNavigation.js.map +1 -1
- package/react/components/menu/menuHelpers.d.ts +1 -1
- package/react/components/notifications/components/views/CardView.js.map +1 -1
- package/react/components/notifications/components/views/ListView.js.map +1 -1
- package/react/components/processMonitor/stores/ProcessMonitorStore.d.ts +3 -3
- package/react/components/sdd/AppEditPage.js +1 -1
- package/react/components/sdd/AppEditPage.js.map +1 -1
- package/react/components/sdd/Appearance.d.ts +1 -13
- package/react/components/sdd/Appearance.js +2 -2
- package/react/components/sdd/Appearance.js.map +1 -1
- package/react/components/sdd/AssetsPage.d.ts +1 -13
- package/react/components/sdd/AssetsPage.js +50 -47
- package/react/components/sdd/AssetsPage.js.map +1 -1
- package/react/components/sdd/SmartDesktopDesigner.d.ts +1 -1
- package/react/components/sdd/SmartDesktopDesigner.js +7 -3
- package/react/components/sdd/SmartDesktopDesigner.js.map +1 -1
- package/react/components/sdd/Themes.d.ts +1 -6
- package/react/components/sdd/Themes.js +5 -52
- package/react/components/sdd/Themes.js.map +1 -1
- package/react/components/sdd/common/fsbl_functions.d.ts +1 -1
- package/react/components/sdd/common/views.js +0 -2
- package/react/components/sdd/common/views.js.map +1 -1
- package/react/components/sdd/css/addApp.css +11 -5
- package/react/components/sdd/fixtures/themeProps.d.ts +0 -4
- package/react/components/sdd/fixtures/themeProps.js +0 -15
- package/react/components/sdd/fixtures/themeProps.js.map +1 -1
- package/react/components/sdd/fixtures/views.js +1 -1
- package/react/components/sdd/fixtures/views.js.map +1 -1
- package/react/components/sdd/smartDesktopClient.d.ts +3 -3
- package/react/components/sdd/stories/Appearance.stories.d.ts +1 -1
- package/react/components/sdd/stories/Appearance.stories.js +0 -12
- package/react/components/sdd/stories/Appearance.stories.js.map +1 -1
- package/react/components/sdd/stories/AssetsPage.stories.d.ts +1 -1
- package/react/components/sdd/stories/AssetsPage.stories.js +0 -24
- package/react/components/sdd/stories/AssetsPage.stories.js.map +1 -1
- package/react/components/sdd/stories/SmartDesktopDesigner.stories.d.ts +1 -1
- package/react/components/sdd/stories/SmartDesktopDesigner.stories.js +16 -1
- package/react/components/sdd/stories/SmartDesktopDesigner.stories.js.map +1 -1
- package/react/components/sdd/stories/Themes.stories.d.ts +1 -1
- package/react/components/sdd/stories/Themes.stories.js +0 -25
- package/react/components/sdd/stories/Themes.stories.js.map +1 -1
- package/react/components/sdd/tests/AddApp.spec.js +108 -2
- package/react/components/sdd/tests/AddApp.spec.js.map +1 -1
- package/react/components/sdd/tests/AppEditPage.spec.js +123 -8
- package/react/components/sdd/tests/AppEditPage.spec.js.map +1 -1
- package/react/components/singleInputDialog/SingleInputDialog.js +1 -1
- package/react/components/singleInputDialog/SingleInputDialog.js.map +1 -1
- package/react/components/toolbar/appLauncher/stores/appLauncherStore.d.ts +2 -2
- package/react/components/toolbar/workspaceManagementMenu/stores/workspaceManagementMenuStore.d.ts +2 -2
- package/react/components/userPreferences/components/LeftNav.js +2 -6
- package/react/components/userPreferences/components/LeftNav.js.map +1 -1
- package/react/components/userPreferences/components/workspaces/WorkspaceItem.js.map +1 -1
- package/react/components/windowTitleBar/WindowTitleBarShell.js +69 -20
- package/react/components/windowTitleBar/WindowTitleBarShell.js.map +1 -1
- package/react/components/windowTitleBar/components/left/LinkerButtonDeprecated.d.ts +25 -0
- package/react/components/windowTitleBar/components/left/LinkerGroupsDeprecated.d.ts +23 -0
- package/react/components/windowTitleBar/components/left/ShareButton.d.ts +16 -0
- package/react/components/windowTitleBar/components/windowTitle.js +2 -2
- package/react/components/windowTitleBar/components/windowTitle.js.map +1 -1
- package/react/reducers/smartDesktopDesignerReducer.js +1 -0
- package/react/reducers/smartDesktopDesignerReducer.js.map +1 -1
- package/react/tsconfig.tsbuildinfo +1 -1
- package/react/types/smartDesktopDesignerTypes.d.ts +1 -0
- package/react/types/smartDesktopDesignerTypes.js.map +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@finsemble/finsemble-ui",
|
|
3
|
-
"version": "7.2.
|
|
3
|
+
"version": "7.2.1",
|
|
4
4
|
"description": "Ready-made React components to give you a head-start building your SmartDesktop.",
|
|
5
5
|
"types": "index.d.ts",
|
|
6
6
|
"files": [
|
|
@@ -16,8 +16,9 @@
|
|
|
16
16
|
"dev": "yarn copy-css && yarn watch",
|
|
17
17
|
"monodev": "yarn dev",
|
|
18
18
|
"new-component": "node ./src/componentTemplateGenerator.js",
|
|
19
|
-
"obfuscate": "
|
|
20
|
-
"pack_obfuscate": "npm install ../api/api.tgz --force --no-package-lock && npm install --force --no-package-lock && yarn run obfuscate &&
|
|
19
|
+
"obfuscate": "yarn run build",
|
|
20
|
+
"pack_obfuscate": "npm install ../api/api.tgz --force --no-package-lock && npm install --force --no-package-lock && yarn run obfuscate && yarn run pack",
|
|
21
|
+
"pack": "npm pack && mv *.tgz ui.tgz",
|
|
21
22
|
"test": "yarn test-mocha && yarn test-storybook",
|
|
22
23
|
"test-mocha": "ts-mocha -p ./spec/tsconfig.spec.json \"./spec/**/*.spec.ts\"",
|
|
23
24
|
"test-storybook": "ts-mocha -p ./spec/tsconfig.storybook.json \"./src/**/*.spec.ts*\" --require src/enzymeSetup.js --require ignore-styles",
|
|
@@ -28,7 +29,7 @@
|
|
|
28
29
|
"build-storybook": "build-storybook"
|
|
29
30
|
},
|
|
30
31
|
"dependencies": {
|
|
31
|
-
"@finsemble/finsemble-api": "
|
|
32
|
+
"@finsemble/finsemble-api": "7.2.1",
|
|
32
33
|
"@q42/floating-focus-a11y": "^1.3.3",
|
|
33
34
|
"@reduxjs/toolkit": "^1.5.0",
|
|
34
35
|
"@svgr/webpack": "^5.5.0",
|
|
@@ -62,7 +63,7 @@
|
|
|
62
63
|
"@babel/preset-env": "^7.16.0",
|
|
63
64
|
"@babel/preset-react": "^7.12.10",
|
|
64
65
|
"@babel/register": "^7.16.0",
|
|
65
|
-
"@storybook/addon-actions": "6.5.
|
|
66
|
+
"@storybook/addon-actions": "6.5.8",
|
|
66
67
|
"@storybook/addon-essentials": "6.5.7",
|
|
67
68
|
"@storybook/addon-links": "6.5.5",
|
|
68
69
|
"@storybook/react": "6.5.6",
|
|
@@ -91,13 +92,13 @@
|
|
|
91
92
|
"rimraf": "3.0.2",
|
|
92
93
|
"sinon": "^14.0.0",
|
|
93
94
|
"ts-mocha": "10.0.0",
|
|
94
|
-
"typescript": "4.
|
|
95
|
+
"typescript": "4.7.3"
|
|
95
96
|
},
|
|
96
97
|
"resolutions": {
|
|
98
|
+
"trim-newlines": "4.0.1",
|
|
99
|
+
"nth-check": "2.0.1",
|
|
97
100
|
"glob-parent": "~5.1.2",
|
|
98
|
-
"
|
|
99
|
-
"trim": "~0.0.3",
|
|
100
|
-
"ansi-regex": "^5.0.1"
|
|
101
|
+
"trim": "~0.0.3"
|
|
101
102
|
},
|
|
102
103
|
"repository": {
|
|
103
104
|
"type": "git",
|
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
export class AppCatalogComponent extends React.Component<any, any, any> {
|
|
2
2
|
constructor(props: any);
|
|
3
|
+
state: {
|
|
4
|
+
apps: never[];
|
|
5
|
+
isLoading: boolean;
|
|
6
|
+
serverError: boolean;
|
|
7
|
+
installed: never[];
|
|
8
|
+
tags: never[];
|
|
9
|
+
installationActionTaken: null;
|
|
10
|
+
};
|
|
3
11
|
bindCorrectContext(): void;
|
|
4
12
|
addedAppsChanged(): void;
|
|
5
13
|
/**
|
|
@@ -62,8 +70,11 @@ export class AppCatalogComponent extends React.Component<any, any, any> {
|
|
|
62
70
|
* @memberof AppMarket
|
|
63
71
|
*/
|
|
64
72
|
getActiveTags(): array;
|
|
73
|
+
UNSAFE_componentWillMount(): void;
|
|
65
74
|
_asyncAppRequest: Promise<void> | undefined;
|
|
66
75
|
_asyncTagsRequest: Promise<void> | undefined;
|
|
76
|
+
componentDidMount(): void;
|
|
77
|
+
componentWillUnmount(): void;
|
|
67
78
|
/**
|
|
68
79
|
* Returns the activeApp from the Store
|
|
69
80
|
*
|
|
@@ -78,5 +89,6 @@ export class AppCatalogComponent extends React.Component<any, any, any> {
|
|
|
78
89
|
* @memberof AppMarket
|
|
79
90
|
*/
|
|
80
91
|
getFilteredApps(): object;
|
|
92
|
+
render(): JSX.Element;
|
|
81
93
|
}
|
|
82
94
|
import React from "react";
|
|
@@ -8,6 +8,17 @@ export default AppCard;
|
|
|
8
8
|
*/
|
|
9
9
|
declare class AppCard extends React.Component<any, any, any> {
|
|
10
10
|
constructor(props: any);
|
|
11
|
+
state: {
|
|
12
|
+
checkShown: boolean;
|
|
13
|
+
checkHighlighted: boolean;
|
|
14
|
+
awaitingInstall: boolean;
|
|
15
|
+
toggleCheckAfterAction: boolean;
|
|
16
|
+
titleUnderlined: boolean;
|
|
17
|
+
appName: any;
|
|
18
|
+
id: any;
|
|
19
|
+
entitled: any;
|
|
20
|
+
tags: any;
|
|
21
|
+
};
|
|
11
22
|
bindCorrectContext(): void;
|
|
12
23
|
/**
|
|
13
24
|
* Toggles the highlight state of the check mark for installing an app
|
|
@@ -45,6 +56,8 @@ declare class AppCard extends React.Component<any, any, any> {
|
|
|
45
56
|
* @param {object} e React Synthetic event
|
|
46
57
|
*/
|
|
47
58
|
addTag(name: string, e: object): void;
|
|
59
|
+
componentDidMount(): void;
|
|
60
|
+
render(): JSX.Element;
|
|
48
61
|
footer: HTMLDivElement | null | undefined;
|
|
49
62
|
tagNamesList: HTMLDivElement | null | undefined;
|
|
50
63
|
}
|
|
@@ -7,6 +7,10 @@
|
|
|
7
7
|
*/
|
|
8
8
|
export default class Carousel extends React.Component<any, any, any> {
|
|
9
9
|
constructor(props: any);
|
|
10
|
+
state: {
|
|
11
|
+
firstIndex: number;
|
|
12
|
+
titleHighlighted: boolean;
|
|
13
|
+
};
|
|
10
14
|
bindCorrectContext(): void;
|
|
11
15
|
/**
|
|
12
16
|
* Pages through the carousel by one card (right)
|
|
@@ -33,5 +37,6 @@ export default class Carousel extends React.Component<any, any, any> {
|
|
|
33
37
|
* Function to build the items in the carousel
|
|
34
38
|
*/
|
|
35
39
|
buildCarousel(): any[];
|
|
40
|
+
render(): JSX.Element;
|
|
36
41
|
}
|
|
37
42
|
import React from "react";
|
|
@@ -1,6 +1,14 @@
|
|
|
1
1
|
export default AppShowcase;
|
|
2
2
|
declare class AppShowcase extends React.Component<any, any, any> {
|
|
3
3
|
constructor(props: any);
|
|
4
|
+
state: {
|
|
5
|
+
name: any;
|
|
6
|
+
iconUrl: any;
|
|
7
|
+
entitled: any;
|
|
8
|
+
imageIndex: number;
|
|
9
|
+
imageModalOpen: boolean;
|
|
10
|
+
modalImage: null;
|
|
11
|
+
};
|
|
4
12
|
bindCorrectContext(): void;
|
|
5
13
|
/**
|
|
6
14
|
* Pages right through the app's images.
|
|
@@ -24,5 +32,6 @@ declare class AppShowcase extends React.Component<any, any, any> {
|
|
|
24
32
|
* @param {string} name The tag name
|
|
25
33
|
*/
|
|
26
34
|
addTag(name: string): void;
|
|
35
|
+
render(): JSX.Element;
|
|
27
36
|
}
|
|
28
37
|
import React from "react";
|
|
@@ -7,17 +7,15 @@ const defaultProps = {
|
|
|
7
7
|
showDefaultIcon: false,
|
|
8
8
|
className: "row-btn",
|
|
9
9
|
};
|
|
10
|
-
const ButtonRow = ({ label, onClick, iconClass, disabled, img, showDefaultIcon, className, }) => {
|
|
10
|
+
const ButtonRow = ({ label, onClick, iconClass, disabled, img, showDefaultIcon, className, ariaSelected, role = "button", }) => {
|
|
11
11
|
const [imgError, setImgError] = useState(false);
|
|
12
|
-
return (React.createElement("div", { className: disabled ? "row-btn-disabled" : className, role:
|
|
12
|
+
return (React.createElement("div", { className: disabled ? "row-btn-disabled" : className, role: role, tabIndex: 0, "aria-selected": ariaSelected, onClick: () => {
|
|
13
13
|
if (!disabled) {
|
|
14
|
-
|
|
15
|
-
func();
|
|
14
|
+
onClick();
|
|
16
15
|
}
|
|
17
16
|
}, onKeyDown: (e) => {
|
|
18
17
|
if ((e.key === "Enter" || e.key === " ") && !disabled) {
|
|
19
|
-
|
|
20
|
-
func();
|
|
18
|
+
onClick();
|
|
21
19
|
}
|
|
22
20
|
} },
|
|
23
21
|
img && (React.createElement("img", { src: img, alt: "", style: showDefaultIcon || imgError ? { display: "none" } : { width: "auto", height: "20px" }, onError: () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonRow.js","sourceRoot":"","sources":["../../../src/components/common/ButtonRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAexC,MAAM,YAAY,GAAmB;IACpC,KAAK,EAAE,EAAE;IACT,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;IACjB,SAAS,EAAE,EAAE;IACb,QAAQ,EAAE,KAAK;IACf,eAAe,EAAE,KAAK;IACtB,SAAS,EAAE,SAAS;CACpB,CAAC;AAEF,MAAM,SAAS,GAA6B,CAAC,EAC5C,KAAK,EACL,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,EACH,eAAe,EACf,SAAS,
|
|
1
|
+
{"version":3,"file":"ButtonRow.js","sourceRoot":"","sources":["../../../src/components/common/ButtonRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAexC,MAAM,YAAY,GAAmB;IACpC,KAAK,EAAE,EAAE;IACT,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;IACjB,SAAS,EAAE,EAAE;IACb,QAAQ,EAAE,KAAK;IACf,eAAe,EAAE,KAAK;IACtB,SAAS,EAAE,SAAS;CACpB,CAAC;AAEF,MAAM,SAAS,GAA6B,CAAC,EAC5C,KAAK,EACL,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,EACH,eAAe,EACf,SAAS,EACT,YAAY,EACZ,IAAI,GAAG,QAAQ,GACf,EAAE,EAAE;IACJ,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAChD,OAAO,CACN,6BACC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS,EACpD,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,CAAC,mBACI,YAAY,EAC3B,OAAO,EAAE,GAAG,EAAE;YACb,IAAI,CAAC,QAAQ,EAAE;gBACd,OAAO,EAAE,CAAC;aACV;QACF,CAAC,EACD,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;YAChB,IAAI,CAAC,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,IAAI,CAAC,QAAQ,EAAE;gBACtD,OAAO,EAAE,CAAC;aACV;QACF,CAAC;QAEA,GAAG,IAAI,CACP,6BACC,GAAG,EAAE,GAAG,EACR,GAAG,EAAC,EAAE,EACN,KAAK,EAAE,eAAe,IAAI,QAAQ,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,EAC5F,OAAO,EAAE,GAAG,EAAE;gBACb,WAAW,CAAC,IAAI,CAAC,CAAC;YACnB,CAAC,GACA,CACF;QACA,CAAC,eAAe,IAAI,QAAQ,CAAC,IAAI,2BAAG,SAAS,EAAC,0BAA0B,GAAG;QAC5E,8BAAM,SAAS,EAAC,UAAU,IAAE,KAAK,CAAQ;QACzC,2BAAG,SAAS,EAAE,SAAS,iBAAe,IAAI,GAAI,CACzC,CACN,CAAC;AACH,CAAC,CAAC;AAEF,SAAS,CAAC,YAAY,GAAG,YAAY,CAAC;AACtC,eAAe,SAAS,CAAC","sourcesContent":["import React, { useState } from \"react\";\n\nexport interface ButtonRowProps {\n\tlabel?: string;\n\tonClick: Function;\n\ticonClass?: string;\n\tdisabled?: boolean;\n\timg?: string;\n\tshowDefaultIcon?: boolean;\n\tclassName?: string;\n\trole?: string;\n\ttabIndex?: number;\n\tariaSelected?: boolean;\n}\n\nconst defaultProps: ButtonRowProps = {\n\tlabel: \"\",\n\tonClick: () => {},\n\ticonClass: \"\",\n\tdisabled: false,\n\tshowDefaultIcon: false,\n\tclassName: \"row-btn\",\n};\n\nconst ButtonRow: React.FC<ButtonRowProps> = ({\n\tlabel,\n\tonClick,\n\ticonClass,\n\tdisabled,\n\timg,\n\tshowDefaultIcon,\n\tclassName,\n\tariaSelected,\n\trole = \"button\",\n}) => {\n\tconst [imgError, setImgError] = useState(false);\n\treturn (\n\t\t<div\n\t\t\tclassName={disabled ? \"row-btn-disabled\" : className}\n\t\t\trole={role}\n\t\t\ttabIndex={0}\n\t\t\taria-selected={ariaSelected}\n\t\t\tonClick={() => {\n\t\t\t\tif (!disabled) {\n\t\t\t\t\tonClick();\n\t\t\t\t}\n\t\t\t}}\n\t\t\tonKeyDown={(e) => {\n\t\t\t\tif ((e.key === \"Enter\" || e.key === \" \") && !disabled) {\n\t\t\t\t\tonClick();\n\t\t\t\t}\n\t\t\t}}\n\t\t>\n\t\t\t{img && (\n\t\t\t\t<img\n\t\t\t\t\tsrc={img}\n\t\t\t\t\talt=\"\"\n\t\t\t\t\tstyle={showDefaultIcon || imgError ? { display: \"none\" } : { width: \"auto\", height: \"20px\" }}\n\t\t\t\t\tonError={() => {\n\t\t\t\t\t\tsetImgError(true);\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{(showDefaultIcon || imgError) && <i className=\"ff-finsemble default-img\" />}\n\t\t\t<span className=\"row__lbl\">{label}</span>\n\t\t\t<i className={iconClass} aria-hidden={true} />\n\t\t</div>\n\t);\n};\n\nButtonRow.defaultProps = defaultProps;\nexport default ButtonRow;\n"]}
|
|
@@ -20,7 +20,7 @@ export const FinsembleToggleButtonBar = ({ selected, options, onChange, enabled
|
|
|
20
20
|
}
|
|
21
21
|
(_b = buttons[fromKey + direction]) === null || _b === void 0 ? void 0 : _b.focus();
|
|
22
22
|
};
|
|
23
|
-
return (React.createElement("span", { className: "
|
|
23
|
+
return (React.createElement("span", { className: "finsembleToggleButtonBar" },
|
|
24
24
|
React.createElement("span", { className: "toggle-text-label-wrapper", role: "radiogroup", ref: buttonList }, options.map((option, key) => (React.createElement("span", { key: key, className: `toggle-text-label ${enabled ? "" : "disabled"} toggle-${key}`, role: "radio", "aria-checked": selected === option.value, tabIndex: selected === option.value && enabled ? 0 : -1, onClick: () => {
|
|
25
25
|
enabled && onChange(option.value);
|
|
26
26
|
}, onKeyDown: (e) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FinsembleToggleButtonBar.js","sourceRoot":"","sources":["../../../src/components/common/FinsembleToggleButtonBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,2BAA2B,CAAC;AAanC,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,EACxC,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,OAAO,GAAG,IAAI,GACiB,EAAE,EAAE;IACnC,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEhD,MAAM,YAAY,GAAG,CAAC,OAAe,EAAE,SAAiB,EAAE,EAAE;;QAC3D,MAAM,OAAO,GAAG,MAAA,UAAU,CAAC,OAAO,0CAAE,gBAAgB,CAAC,gBAAgB,CAAwC,CAAC;QAC9G,IAAI,OAAO,KAAK,SAAS,EAAE;YAC1B,OAAO;SACP;QAED,IAAI,OAAO,KAAK,OAAO,CAAC,MAAM,EAAE;YAC/B,OAAO;SACP;QAED,IAAI,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;QACjC,IAAI,MAAM,GAAG,CAAC,EAAE;YACf,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;SAC5B;aAAM,IAAI,MAAM,IAAI,OAAO,CAAC,MAAM,EAAE;YACpC,MAAM,GAAG,CAAC,CAAC;SACX;QAED,MAAA,OAAO,CAAC,OAAO,GAAG,SAAS,CAAC,0CAAE,KAAK,EAAE,CAAC;IACvC,CAAC,CAAC;IAEF,OAAO,CACN,8BAAM,SAAS,EAAC,
|
|
1
|
+
{"version":3,"file":"FinsembleToggleButtonBar.js","sourceRoot":"","sources":["../../../src/components/common/FinsembleToggleButtonBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,2BAA2B,CAAC;AAanC,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,EACxC,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,OAAO,GAAG,IAAI,GACiB,EAAE,EAAE;IACnC,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEhD,MAAM,YAAY,GAAG,CAAC,OAAe,EAAE,SAAiB,EAAE,EAAE;;QAC3D,MAAM,OAAO,GAAG,MAAA,UAAU,CAAC,OAAO,0CAAE,gBAAgB,CAAC,gBAAgB,CAAwC,CAAC;QAC9G,IAAI,OAAO,KAAK,SAAS,EAAE;YAC1B,OAAO;SACP;QAED,IAAI,OAAO,KAAK,OAAO,CAAC,MAAM,EAAE;YAC/B,OAAO;SACP;QAED,IAAI,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;QACjC,IAAI,MAAM,GAAG,CAAC,EAAE;YACf,MAAM,GAAG,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;SAC5B;aAAM,IAAI,MAAM,IAAI,OAAO,CAAC,MAAM,EAAE;YACpC,MAAM,GAAG,CAAC,CAAC;SACX;QAED,MAAA,OAAO,CAAC,OAAO,GAAG,SAAS,CAAC,0CAAE,KAAK,EAAE,CAAC;IACvC,CAAC,CAAC;IAEF,OAAO,CACN,8BAAM,SAAS,EAAC,0BAA0B;QACzC,8BAAM,SAAS,EAAC,2BAA2B,EAAC,IAAI,EAAC,YAAY,EAAC,GAAG,EAAE,UAAU,IAC3E,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE,CAAC,CAC7B,8BACC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,qBAAqB,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,UAAU,WAAW,GAAG,EAAE,EACzE,IAAI,EAAC,OAAO,kBACE,QAAQ,KAAK,MAAM,CAAC,KAAK,EACvC,QAAQ,EAAE,QAAQ,KAAK,MAAM,CAAC,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACvD,OAAO,EAAE,GAAG,EAAE;gBACb,OAAO,IAAI,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACnC,CAAC,EACD,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;gBAChB,QAAQ,CAAC,CAAC,GAAG,EAAE;oBACd,KAAK,WAAW,CAAC,CAAC;wBACjB,YAAY,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;wBACtB,MAAM;qBACN;oBACD,KAAK,YAAY,CAAC,CAAC;wBAClB,YAAY,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;wBACrB,MAAM;qBACN;oBACD,KAAK,OAAO,CAAC,CAAC;wBACb,OAAO,IAAI,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;qBAClC;oBACD,OAAO,CAAC,CAAC;qBACR;iBACD;YACF,CAAC,IAEA,MAAM,CAAC,KAAK,CACP,CACP,CAAC,CACI,CACD,CACP,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { useRef } from \"react\";\nimport \"./css/FinsembleToggle.css\";\n\nexport interface FinsembleToggleButtonBarProps {\n\tlabel?: string;\n\tselected: any; // <T>\n\toptions: {\n\t\tlabel: string | React.ReactChild;\n\t\tvalue: any; // <T>\n\t}[];\n\tonChange: (newSelected: any /* <T> */) => void;\n\tenabled?: boolean;\n}\n\nexport const FinsembleToggleButtonBar = ({\n\tselected,\n\toptions,\n\tonChange,\n\tenabled = true,\n}: FinsembleToggleButtonBarProps) => {\n\tconst buttonList = useRef<HTMLDivElement>(null);\n\n\tconst changeButton = (fromKey: number, direction: 1 | -1) => {\n\t\tconst buttons = buttonList.current?.querySelectorAll(\"[role='radio']\") as NodeListOf<HTMLElement> | undefined;\n\t\tif (buttons === undefined) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (fromKey === buttons.length) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet newKey = fromKey + direction;\n\t\tif (newKey < 0) {\n\t\t\tnewKey = buttons.length - 1;\n\t\t} else if (newKey >= buttons.length) {\n\t\t\tnewKey = 0;\n\t\t}\n\n\t\tbuttons[fromKey + direction]?.focus();\n\t};\n\n\treturn (\n\t\t<span className=\"finsembleToggleButtonBar\">\n\t\t\t<span className=\"toggle-text-label-wrapper\" role=\"radiogroup\" ref={buttonList}>\n\t\t\t\t{options.map((option, key) => (\n\t\t\t\t\t<span\n\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\tclassName={`toggle-text-label ${enabled ? \"\" : \"disabled\"} toggle-${key}`}\n\t\t\t\t\t\trole=\"radio\"\n\t\t\t\t\t\taria-checked={selected === option.value}\n\t\t\t\t\t\ttabIndex={selected === option.value && enabled ? 0 : -1}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tenabled && onChange(option.value);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\tswitch (e.key) {\n\t\t\t\t\t\t\t\tcase \"ArrowLeft\": {\n\t\t\t\t\t\t\t\t\tchangeButton(key, -1);\n\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tcase \"ArrowRight\": {\n\t\t\t\t\t\t\t\t\tchangeButton(key, 1);\n\t\t\t\t\t\t\t\t\tbreak;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tcase \"Enter\": {\n\t\t\t\t\t\t\t\t\tenabled && onChange(option.value);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdefault: {\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{option.label}\n\t\t\t\t\t</span>\n\t\t\t\t))}\n\t\t\t</span>\n\t\t</span>\n\t);\n};\n"]}
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
.
|
|
1
|
+
.finsembleToggleButtonBar {
|
|
2
2
|
background-color: var(--core-primary);
|
|
3
3
|
padding: 4px;
|
|
4
4
|
border-radius: 5px;
|
|
5
5
|
}
|
|
6
6
|
|
|
7
|
-
.
|
|
7
|
+
.finsembleToggleButtonBar .toggle-text-label.disabled {
|
|
8
8
|
opacity: 0.5;
|
|
9
9
|
}
|
|
10
10
|
|
|
11
|
-
.
|
|
11
|
+
.finsembleToggleButtonBar .toggle-text-label {
|
|
12
12
|
border-radius: 5px;
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
.
|
|
15
|
+
.finsembleToggleButtonBar .toggle-text-label[aria-checked="true"] {
|
|
16
16
|
background-color: var(--accent-primary-1);
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
-
.
|
|
20
|
-
.
|
|
19
|
+
.finsembleToggleButtonBar .toggle-text-label[aria-checked="false"]:focus,
|
|
20
|
+
.finsembleToggleButtonBar .toggle-text-label[aria-checked="false"]:hover {
|
|
21
21
|
background-color: var(--core-primary-3);
|
|
22
22
|
}
|
|
@@ -20,6 +20,7 @@ export const ResolverContainer = () => {
|
|
|
20
20
|
setIntentRaiser((_a = choices.originatingAppName) !== null && _a !== void 0 ? _a : "");
|
|
21
21
|
setResolutionList(choices.resolutionList);
|
|
22
22
|
finsembleWindow.show();
|
|
23
|
+
finsembleWindow.focus();
|
|
23
24
|
};
|
|
24
25
|
// We want to register as an IntentResolverListener, but we only want to register once
|
|
25
26
|
// However, the IntentResovlerListener handler needs to have access to this component's states
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResolverContainer.js","sourceRoot":"","sources":["../../../src/components/fdc3Resolver/ResolverContainer.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAYlD,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACrC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACrD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAM,GAAG,EAAE,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IACtE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAM,GAAG,EAAE,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IAC1E,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAmB,EAAE,CAAC,CAAC;IAE3E,MAAM,QAAQ,GAAG,GAAG,EAAE;QACrB,eAAe,CAAC,IAAI,EAAE,CAAC;QACvB,eAAe,CAAC,EAAE,CAAC,CAAC;QACpB,iBAAiB,CAAC,EAAE,CAAC,CAAC;IACvB,CAAC,CAAC;IACF,MAAM,aAAa,GAAG,CAAC,OAA4B,EAAE,EAAE;;QACtD,eAAe,CAAC,MAAA,OAAO,CAAC,kBAAkB,mCAAI,EAAE,CAAC,CAAC;QAClD,iBAAiB,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;QAC1C,eAAe,CAAC,IAAI,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"ResolverContainer.js","sourceRoot":"","sources":["../../../src/components/fdc3Resolver/ResolverContainer.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAYlD,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACrC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACrD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAM,GAAG,EAAE,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IACtE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAM,GAAG,EAAE,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IAC1E,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAmB,EAAE,CAAC,CAAC;IAE3E,MAAM,QAAQ,GAAG,GAAG,EAAE;QACrB,eAAe,CAAC,IAAI,EAAE,CAAC;QACvB,eAAe,CAAC,EAAE,CAAC,CAAC;QACpB,iBAAiB,CAAC,EAAE,CAAC,CAAC;IACvB,CAAC,CAAC;IACF,MAAM,aAAa,GAAG,CAAC,OAA4B,EAAE,EAAE;;QACtD,eAAe,CAAC,MAAA,OAAO,CAAC,kBAAkB,mCAAI,EAAE,CAAC,CAAC;QAClD,iBAAiB,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;QAC1C,eAAe,CAAC,IAAI,EAAE,CAAC;QACvB,eAAe,CAAC,KAAK,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,sFAAsF;IACtF,8FAA8F;IAC9F,4EAA4E;IAC5E,IAAI,SAAS,EAAE;QACd,YAAY,CAAC,KAAK,CAAC,CAAC;QAEpB,MAAM,qBAAqB,GAAG,CAAC,OAA4B,EAAE,EAAE,CAC9D,IAAI,OAAO,CAAqB,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;YACnD,aAAa,CAAC,OAAO,CAAC,CAAC;YACvB,eAAe,CAAC,GAAG,EAAE,CAAC,CAAC,MAA0B,EAAE,EAAE;gBACpD,QAAQ,EAAE,CAAC;gBACX,iFAAiF;gBACjF,MAAM,CAAC,kBAAkB,GAAG,OAAO,CAAC,kBAAkB,CAAC;gBACvD,MAAM,CAAC,oBAAoB,GAAG,OAAO,CAAC,oBAAoB,CAAC;gBAC3D,OAAO,CAAC,MAAM,CAAC,CAAC;YACjB,CAAC,CAAC,CAAC;YACH,iBAAiB,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE;gBAC5B,QAAQ,EAAE,CAAC;gBACX,MAAM,CAAC,EAAE,GAAG,EAAE,mBAAmB,EAAE,CAAC,CAAC;YACtC,CAAC,CAAC,CAAC;QACJ,CAAC,CAAC,CAAC;QAEJ,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,0BAA0B,CAAC,qBAAqB,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;QAC5F,QAAQ,EAAE,CAAC;KACX;IAED,OAAO,CACN,oBAAC,cAAc,IACd,YAAY,EAAE,YAAY,EAC1B,cAAc,EAAE,cAAc,EAC9B,MAAM,EAAE,CAAC,QAAa,EAAE,EAAE;YACzB,YAAY,CAAC,QAAQ,CAAC,CAAC;QACxB,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;YACd,cAAc,EAAE,CAAC;QAClB,CAAC,GACA,CACF,CAAC;AACH,CAAC,CAAC","sourcesContent":["/*!\n * Copyright 2017 by ChartIQ, Inc.\n * All rights reserved.\n */\nimport React, { useState } from \"react\";\nimport { ResolverDialog } from \"./ResolverDialog\";\nimport { ResolutionList } from \"../../types/fdc3\";\nimport { clients } from \"@finsemble/finsemble-api\";\n\ntype ResolverResolution = clients.Interop.types.ResolverResolution;\n\ntype ResolverChoicesType = {\n\tresolutionList: ResolutionList[];\n\toriginatingAppName?: string;\n\toriginatingAppWindow?: string;\n};\n\nexport const ResolverContainer = () => {\n\tconst [firstLoad, setFirstLoad] = useState(true);\n\tconst [intentRaiser, setIntentRaiser] = useState(\"\");\n\tconst [sendCallback, setSendCallback] = useState<any>(() => () => {});\n\tconst [cancelCallback, setCancelCallback] = useState<any>(() => () => {});\n\tconst [resolutionList, setResolutionList] = useState<ResolutionList[]>([]);\n\n\tconst clearAll = () => {\n\t\tfinsembleWindow.hide();\n\t\tsetIntentRaiser(\"\");\n\t\tsetResolutionList([]);\n\t};\n\tconst handleChoices = (choices: ResolverChoicesType) => {\n\t\tsetIntentRaiser(choices.originatingAppName ?? \"\");\n\t\tsetResolutionList(choices.resolutionList);\n\t\tfinsembleWindow.show();\n\t\tfinsembleWindow.focus();\n\t};\n\n\t// We want to register as an IntentResolverListener, but we only want to register once\n\t// However, the IntentResovlerListener handler needs to have access to this component's states\n\t// So, this block will register the listener, and then never be called again\n\tif (firstLoad) {\n\t\tsetFirstLoad(false);\n\n\t\tconst handleResolverChoices = (choices: ResolverChoicesType) =>\n\t\t\tnew Promise<ResolverResolution>((resolve, reject) => {\n\t\t\t\thandleChoices(choices);\n\t\t\t\tsetSendCallback(() => (result: ResolverResolution) => {\n\t\t\t\t\tclearAll();\n\t\t\t\t\t// originatingAppName and originatingAppWindow returned to support auto-associate\n\t\t\t\t\tresult.originatingAppName = choices.originatingAppName;\n\t\t\t\t\tresult.originatingAppWindow = choices.originatingAppWindow;\n\t\t\t\t\tresolve(result);\n\t\t\t\t});\n\t\t\t\tsetCancelCallback(() => () => {\n\t\t\t\t\tclearAll();\n\t\t\t\t\treject({ err: \"Cancelled by user\" });\n\t\t\t\t});\n\t\t\t});\n\n\t\tFSBL.internal.interopAdmin.registerUIResolverListener(handleResolverChoices).then(() => {});\n\t\tclearAll();\n\t}\n\n\treturn (\n\t\t<ResolverDialog\n\t\t\tintentRaiser={intentRaiser}\n\t\t\tresolutionList={resolutionList}\n\t\t\tonSend={(selected: any) => {\n\t\t\t\tsendCallback(selected);\n\t\t\t}}\n\t\t\tonCancel={() => {\n\t\t\t\tcancelCallback();\n\t\t\t}}\n\t\t/>\n\t);\n};\n"]}
|
|
@@ -2,7 +2,15 @@ import React, { useState } from "react";
|
|
|
2
2
|
import { Button } from "../common/Button";
|
|
3
3
|
import "./ResolverDialog.css";
|
|
4
4
|
import { FinsembleSelect } from "../common/FinsembleSelect";
|
|
5
|
-
|
|
5
|
+
import FloatingFocus from "@q42/floating-focus-a11y";
|
|
6
|
+
// The package FloatingFocus injects a focus indicator that moves around the page, but only for
|
|
7
|
+
// keyboard users. (Mouse users don't see the indicator.) All that needs to be done is to envoke it.
|
|
8
|
+
new FloatingFocus();
|
|
9
|
+
const Tile = ({ text, callback }) => (React.createElement("button", { className: "appTile", onClick: callback, title: text, role: "button", onKeyDown: (e) => {
|
|
10
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
11
|
+
callback();
|
|
12
|
+
}
|
|
13
|
+
} },
|
|
6
14
|
React.createElement("span", { className: "tileHeader" }, text)));
|
|
7
15
|
export const ResolverDialog = ({ intentRaiser, onSend, onCancel, resolutionList = [] }) => {
|
|
8
16
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
@@ -18,6 +26,18 @@ export const ResolverDialog = ({ intentRaiser, onSend, onCancel, resolutionList
|
|
|
18
26
|
* expand this to use data that is proprietary to Finsemble, such as the window's current title.
|
|
19
27
|
*/
|
|
20
28
|
const displayName = (app) => { var _a, _b; return (_b = (_a = app.meta.title) !== null && _a !== void 0 ? _a : app.meta.name) !== null && _b !== void 0 ? _b : app.meta.appId; };
|
|
29
|
+
const clickAction = (app) => {
|
|
30
|
+
var _a, _b;
|
|
31
|
+
onSend({
|
|
32
|
+
intent: (_b = (_a = resolutionList[intentNumber]) === null || _a === void 0 ? void 0 : _a.intent) === null || _b === void 0 ? void 0 : _b.name,
|
|
33
|
+
selectedApp: { name: app.meta.name },
|
|
34
|
+
windowName: app.windowName,
|
|
35
|
+
});
|
|
36
|
+
};
|
|
37
|
+
const handleCancel = () => {
|
|
38
|
+
setIntentNumber(0); // sets to default value
|
|
39
|
+
onCancel();
|
|
40
|
+
};
|
|
21
41
|
return (React.createElement("div", { className: "resolverDialog" },
|
|
22
42
|
resolutionList.length > 1 ? (React.createElement(React.Fragment, null,
|
|
23
43
|
React.createElement("h3", null,
|
|
@@ -58,14 +78,13 @@ export const ResolverDialog = ({ intentRaiser, onSend, onCancel, resolutionList
|
|
|
58
78
|
React.createElement("h2", null, "...or, send to a running app"),
|
|
59
79
|
React.createElement("div", { className: "appSelector" },
|
|
60
80
|
React.createElement("ul", null, openApps.map((app, index) => (React.createElement("li", { key: index, tabIndex: 0, onClick: () => {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
});
|
|
81
|
+
clickAction(app);
|
|
82
|
+
}, onKeyDown: (e) => {
|
|
83
|
+
if (e.key === "Enter" || e.key === " ") {
|
|
84
|
+
clickAction(app);
|
|
85
|
+
}
|
|
67
86
|
} }, `${app.index + 1} - ${displayName(app)}`))))))) : (React.createElement(React.Fragment, null)),
|
|
68
87
|
React.createElement("div", { className: "actionGroupRight" },
|
|
69
|
-
React.createElement(Button, { fashion: "ghost", text: "Cancel", onClick:
|
|
88
|
+
React.createElement(Button, { fashion: "ghost", text: "Cancel", onClick: handleCancel }))));
|
|
70
89
|
};
|
|
71
90
|
//# sourceMappingURL=ResolverDialog.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResolverDialog.js","sourceRoot":"","sources":["../../../src/components/fdc3Resolver/ResolverDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,sBAAsB,CAAC;AAE9B,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;
|
|
1
|
+
{"version":3,"file":"ResolverDialog.js","sourceRoot":"","sources":["../../../src/components/fdc3Resolver/ResolverDialog.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useState } from \"react\";\nimport { Button } from \"../common/Button\";\nimport \"./ResolverDialog.css\";\nimport { ResolutionCandidate, ResolutionList } from \"../../types/fdc3\";\nimport { FinsembleSelect } from \"../common/FinsembleSelect\";\n\nimport FloatingFocus from \"@q42/floating-focus-a11y\";\n// The package FloatingFocus injects a focus indicator that moves around the page, but only for\n// keyboard users. (Mouse users don't see the indicator.) All that needs to be done is to envoke it.\nnew FloatingFocus();\n// If you want to make changes to the indicator, the styles are being maintained in assets/css/focus.css\n\ntype TileProps = {\n\ttext: string;\n\tcallback: () => void;\n};\n\nconst Tile = ({ text, callback }: TileProps) => (\n\t<button\n\t\tclassName=\"appTile\"\n\t\tonClick={callback}\n\t\ttitle={text}\n\t\trole=\"button\"\n\t\tonKeyDown={(e) => {\n\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\n\t\t\t\tcallback();\n\t\t\t}\n\t\t}}\n\t>\n\t\t<span className=\"tileHeader\">{text}</span>\n\t</button>\n);\n\ntype openApp = {\n\tname: string;\n\tid: string;\n};\nexport type ReceivingAppType = {\n\tname: string;\n\topen: openApp[];\n};\nexport type ResolverProps = {\n\tintentRaiser: string;\n\tonSend: any;\n\tonCancel: any;\n\tresolutionList?: ResolutionList[];\n};\n\nexport const ResolverDialog = ({ intentRaiser, onSend, onCancel, resolutionList = [] }: ResolverProps) => {\n\tconst [intentNumber, setIntentNumber] = useState(0);\n\tconst intent = resolutionList[intentNumber]?.intent?.displayName || \"\";\n\tconst contextType = resolutionList[intentNumber]?.context?.type ?? \"data\";\n\tconst receivingApps = resolutionList[intentNumber]?.launchableApps || [];\n\tconst openApps = (resolutionList[intentNumber]?.openApps || []).map((app, key) => {\n\t\treturn {\n\t\t\t...app,\n\t\t\tindex: key,\n\t\t};\n\t});\n\n\t/**\n\t * Calculates what text to display in the UX. AppD prefers `title` when available. However, in the future we may\n\t * expand this to use data that is proprietary to Finsemble, such as the window's current title.\n\t */\n\tconst displayName = (app: ResolutionCandidate): string => app.meta.title ?? app.meta.name ?? app.meta.appId;\n\n\tconst clickAction = (app: ResolutionCandidate) => {\n\t\tonSend({\n\t\t\tintent: resolutionList[intentNumber]?.intent?.name,\n\t\t\tselectedApp: { name: app.meta.name },\n\t\t\twindowName: app.windowName,\n\t\t});\n\t};\n\n\tconst handleCancel = () => {\n\t\tsetIntentNumber(0); // sets to default value\n\t\tonCancel();\n\t};\n\n\treturn (\n\t\t<div className=\"resolverDialog\">\n\t\t\t{resolutionList.length > 1 ? (\n\t\t\t\t<>\n\t\t\t\t\t<h3>\n\t\t\t\t\t\t<span className=\"sourceText\">{intentRaiser}</span> wants to send{\" \"}\n\t\t\t\t\t\t<span className=\"intentText\">"{contextType}"</span> to another app.\n\t\t\t\t\t</h3>\n\t\t\t\t\t<p>How do you want to handle this?</p>\n\n\t\t\t\t\t<h2>Choose an action:</h2>\n\n\t\t\t\t\t<FinsembleSelect\n\t\t\t\t\t\tselected={[`${intentNumber}`]}\n\t\t\t\t\t\toptions={resolutionList.map((item) => item.intent?.displayName || \"\")}\n\t\t\t\t\t\tvalues={resolutionList.map((item, key) => `${key}`)}\n\t\t\t\t\t\tupdateCallback={(values: string[]) => {\n\t\t\t\t\t\t\tsetIntentNumber(+values[0]);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tsize={Math.min(resolutionList.length, 5)}\n\t\t\t\t\t\tlimit={1}\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\t<>\n\t\t\t\t\t<h3>\n\t\t\t\t\t\t<span className=\"sourceText\">{intentRaiser}</span> wants to{\" \"}\n\t\t\t\t\t\t<span className=\"intentText\">"{intent}"</span>.\n\t\t\t\t\t</h3>\n\t\t\t\t\t<p>How do you want to handle this?</p>\n\t\t\t\t</>\n\t\t\t)}\n\n\t\t\t<h2>Open a new app...</h2>\n\n\t\t\t<div className=\"appListGrid\">\n\t\t\t\t{receivingApps.map((app, key) => (\n\t\t\t\t\t<Tile\n\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\ttext={displayName(app)}\n\t\t\t\t\t\tcallback={() => {\n\t\t\t\t\t\t\tonSend({\n\t\t\t\t\t\t\t\tintent: resolutionList[intentNumber]?.intent?.name,\n\t\t\t\t\t\t\t\tselectedApp: {\n\t\t\t\t\t\t\t\t\tappId: app.appId,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</div>\n\n\t\t\t{openApps.length ? (\n\t\t\t\t<>\n\t\t\t\t\t<h2>...or, send to a running app</h2>\n\n\t\t\t\t\t<div className=\"appSelector\">\n\t\t\t\t\t\t<ul>\n\t\t\t\t\t\t\t{openApps.map((app, index) => (\n\t\t\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t\t\tkey={index}\n\t\t\t\t\t\t\t\t\ttabIndex={0}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tclickAction(app);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\t\t\t\tif (e.key === \"Enter\" || e.key === \" \") {\n\t\t\t\t\t\t\t\t\t\t\tclickAction(app);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{`${app.index + 1} - ${displayName(app)}`}\n\t\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</ul>\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\n\t\t\t<div className=\"actionGroupRight\">\n\t\t\t\t<Button fashion=\"ghost\" text=\"Cancel\" onClick={handleCancel} />\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n"]}
|
|
@@ -12,6 +12,10 @@ export const FinsembleDialogButton = (props) => {
|
|
|
12
12
|
// [Julianna Langston, 2021-04-19] I don't think this is being used, since the css class `fsbl-button-md` doesn't exist anywhere. Candidate for removal, along with associated prop.
|
|
13
13
|
const size = (_a = props.buttonSize) !== null && _a !== void 0 ? _a : "md"; // `fsbl-button-md` css doesn't exist anywhere?
|
|
14
14
|
const classes = `fsbl-button fsbl-button-${size} ${(_b = props.className) !== null && _b !== void 0 ? _b : ""}`;
|
|
15
|
-
return props.show !== false ? (React.createElement("div", { className: classes, onClick: props.onClick
|
|
15
|
+
return props.show !== false ? (React.createElement("div", { className: classes, onClick: props.onClick, role: "button", tabIndex: 0, onKeyDown: (e) => {
|
|
16
|
+
if (e.key === "Enter") {
|
|
17
|
+
props === null || props === void 0 ? void 0 : props.onClick();
|
|
18
|
+
}
|
|
19
|
+
} }, props.children)) : null;
|
|
16
20
|
};
|
|
17
21
|
//# sourceMappingURL=FinsembleDialogButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FinsembleDialogButton.js","sourceRoot":"","sources":["../../../src/components/legacyControls/FinsembleDialogButton.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAwD,CAAC,KAAU,EAAE,EAAE;IACxG,0BAA0B;;IAE1B,oLAAoL;IACpL,MAAM,IAAI,GAAG,MAAA,KAAK,CAAC,UAAU,mCAAI,IAAI,CAAC,CAAC,+CAA+C;IACtF,MAAM,OAAO,GAAG,2BAA2B,IAAI,IAAI,MAAA,KAAK,CAAC,SAAS,mCAAI,EAAE,EAAE,CAAC;IAC3E,OAAO,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,CAC7B,
|
|
1
|
+
{"version":3,"file":"FinsembleDialogButton.js","sourceRoot":"","sources":["../../../src/components/legacyControls/FinsembleDialogButton.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAwD,CAAC,KAAU,EAAE,EAAE;IACxG,0BAA0B;;IAE1B,oLAAoL;IACpL,MAAM,IAAI,GAAG,MAAA,KAAK,CAAC,UAAU,mCAAI,IAAI,CAAC,CAAC,+CAA+C;IACtF,MAAM,OAAO,GAAG,2BAA2B,IAAI,IAAI,MAAA,KAAK,CAAC,SAAS,mCAAI,EAAE,EAAE,CAAC;IAC3E,OAAO,KAAK,CAAC,IAAI,KAAK,KAAK,CAAC,CAAC,CAAC,CAC7B,6BACC,SAAS,EAAE,OAAO,EAClB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,IAAI,EAAE,QAAQ,EACd,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;YAChB,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE;gBACtB,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,OAAO,EAAE,CAAC;aACjB;QACF,CAAC,IAEA,KAAK,CAAC,QAAQ,CACV,CACN,CAAC,CAAC,CAAC,IAAI,CAAC;AACV,CAAC,CAAC","sourcesContent":["/*!\n * Copyright 2017 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport * as React from \"react\";\n\nexport type FinsembleDialogButtonProps = {\n\tbuttonSize?: string;\n\tclassName?: string;\n\tshow?: boolean;\n\tonClick?: Function;\n};\n\n/**\n * Button that is rendered on a dialog.\n */\nexport const FinsembleDialogButton: React.FunctionComponent<FinsembleDialogButtonProps> = (props: any) => {\n\t// Default size is medium.\n\n\t// [Julianna Langston, 2021-04-19] I don't think this is being used, since the css class `fsbl-button-md` doesn't exist anywhere. Candidate for removal, along with associated prop.\n\tconst size = props.buttonSize ?? \"md\"; // `fsbl-button-md` css doesn't exist anywhere?\n\tconst classes = `fsbl-button fsbl-button-${size} ${props.className ?? \"\"}`;\n\treturn props.show !== false ? (\n\t\t<div\n\t\t\tclassName={classes}\n\t\t\tonClick={props.onClick}\n\t\t\trole={\"button\"}\n\t\t\ttabIndex={0}\n\t\t\tonKeyDown={(e) => {\n\t\t\t\tif (e.key === \"Enter\") {\n\t\t\t\t\tprops?.onClick();\n\t\t\t\t}\n\t\t\t}}\n\t\t>\n\t\t\t{props.children}\n\t\t</div>\n\t) : null;\n};\n"]}
|
|
@@ -58,7 +58,7 @@ export const FinsembleDialogTextInput = (props) => {
|
|
|
58
58
|
return (React.createElement("div", { className: classes },
|
|
59
59
|
React.createElement("label", { htmlFor: "single-input" }, props.inputLabel || ""),
|
|
60
60
|
React.createElement("div", { className: "form-group" },
|
|
61
|
-
React.createElement("input", { id: "single-input", autoFocus: props.autoFocus, type: "text", maxLength: props.maxLength, onChange: changeEvent, placeholder: placeholder, ref: textInput, value: textValue })),
|
|
61
|
+
React.createElement("input", { id: "single-input", autoFocus: props.autoFocus, type: "text", maxLength: props.maxLength, onChange: changeEvent, placeholder: placeholder, ref: textInput, value: textValue, "aria-label": props.ariaLabel })),
|
|
62
62
|
props.children));
|
|
63
63
|
};
|
|
64
64
|
//# sourceMappingURL=FinsembleDialogTextInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FinsembleDialogTextInput.js","sourceRoot":"","sources":["../../../src/components/legacyControls/FinsembleDialogTextInput.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,MAAM,uBAAuB,GAAG,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"FinsembleDialogTextInput.js","sourceRoot":"","sources":["../../../src/components/legacyControls/FinsembleDialogTextInput.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2017 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport * as React from \"react\";\nconst DIALOG_INPUT_BASE_CLASS = \"dialog-input\";\n\nexport type FinsembleDialogTextInputProps = {\n\tclassName?: string;\n\tmaxLength?: number;\n\tplaceholder?: string;\n\tautoFocus?: boolean;\n\tfocusOnShow?: boolean;\n\tinputLabel?: string;\n\tvalue?: string;\n\tonInputChange: React.ChangeEventHandler;\n\tinputPattern?: string;\n\tariaLabel?: string;\n};\n\n/**\n * A big text field that's shown on dialogs.\n */\nexport const FinsembleDialogTextInput: React.FunctionComponent<FinsembleDialogTextInputProps> = (props) => {\n\tconst [textValue, setTextValue] = React.useState<string>(props.value ?? \"\");\n\tconst textInput: React.Ref<HTMLInputElement> = React.useRef(null);\n\tconst inputPatternRegEx: RegExp | undefined = props.inputPattern ? new RegExp(props.inputPattern) : undefined;\n\t/**\n\t * Focuses the input field.\n\t */\n\tconst focusInput = () => {\n\t\tif (textInput?.current?.focus) textInput.current.focus();\n\t};\n\n\t/**\n\t * Listens for the shown event so it can focus the input.\n\t */\n\tReact.useEffect(() => {\n\t\tif (props.focusOnShow) {\n\t\t\tfinsembleWindow.addEventListener(\"shown\", focusInput);\n\t\t}\n\t\treturn () => {\n\t\t\tif (props.focusOnShow) {\n\t\t\t\tfinsembleWindow.removeEventListener(\"shown\", focusInput);\n\t\t\t}\n\t\t};\n\t}, [props.focusOnShow]);\n\n\tReact.useEffect(() => {\n\t\tif (props.value !== textValue) {\n\t\t\tsetTextValue(props.value ?? \"\");\n\t\t}\n\t}, [props.value]);\n\n\tconst placeholder = props.placeholder ?? \"\";\n\tconst classes = `${props.className ?? \"\"} ${DIALOG_INPUT_BASE_CLASS}`;\n\n\t/**\n\t * If the input is a match for the props.inputPattern regular expression, then pass on the change\n\t *\n\t * @param {React.ChangeEvent<HTMLInputElement>} e\n\t */\n\tconst changeEvent = (e: React.ChangeEvent<HTMLInputElement>) => {\n\t\tif (inputPatternRegEx === undefined || e.target.value.match(inputPatternRegEx)) {\n\t\t\tprops.onInputChange(e);\n\t\t\tsetTextValue(e.target.value);\n\t\t} else {\n\t\t\tFSBL.Clients.Logger.system.debug(\n\t\t\t\t`FinsembleDialogTextInput: input '${e.target.value}' failed to match against props.inputPattern '${props.inputPattern}'`\n\t\t\t);\n\t\t}\n\t};\n\n\treturn (\n\t\t<div className={classes}>\n\t\t\t<label htmlFor=\"single-input\">{props.inputLabel || \"\"}</label>\n\t\t\t<div className=\"form-group\">\n\t\t\t\t<input\n\t\t\t\t\tid=\"single-input\"\n\t\t\t\t\tautoFocus={props.autoFocus}\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tmaxLength={props.maxLength}\n\t\t\t\t\tonChange={changeEvent}\n\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\tref={textInput}\n\t\t\t\t\tvalue={textValue}\n\t\t\t\t\taria-label={props.ariaLabel}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t{props.children}\n\t\t</div>\n\t);\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"keyboardNavigation.js","sourceRoot":"","sources":["../../../src/components/menu/keyboardNavigation.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Keyboard navigation allows the end user to navigate through menus using\n * arrow keys and to select items using the enter key.\n *\n * When an element is selected then the keyboard navigation state is reset\n * so that the user will begin again with the first item.\n *\n * @param childWin - Main window or child window reference.\n * @param [className] - Selector of elements to apply navigation on.\n * @example\n * applyMenuKeyboardNavigation(window, \".menu-item\");\n */\nexport const applyMenuKeyboardNavigation = (childWin: Window, className: string = \".menu-item\") => {\n\tlet selectedItem: number = 0;\n\n\tlet selectedIcon: number = -1;\n\n\tnew MutationObserver(() => {\n\t\t// Reset selectedIndex when elements added or removed\n\t\t// from the DOM. The motivation behind this was an issue\n\t\t// with Brad's search menu where the order of focus is\n\t\t// messed up when his list of result changes.\n\t\tselectedItem = 0;\n\t}).observe(childWin.document.body, {\n\t\tchildList: true,\n\t\tcharacterData: false,\n\t\tsubtree: true,\n\t});\n\n\t/**\n\t * Returns list of elements\n\t */\n\tconst getElements = () => childWin.document.querySelectorAll(className) as NodeListOf<HTMLElement>;\n\n\tconst getMenuItemIcons = (index: number) => {\n\t\tconst menuItems = getElements();\n\t\treturn menuItems[index].querySelectorAll(\".menu-item-icon\") as NodeListOf<HTMLElement>;\n\t};\n\n\t/**\n\t * Sets the focus on a menu item\n\t * @param index The index of the menu item in the list\n\t */\n\tconst focusOn = (index: number) => {\n\t\tconst menuItems = getElements();\n\n\t\t// Menu could have no items\n\t\tif (!menuItems.length) return;\n\n\t\t// Focus on element and scroll if needed\n\t\tmenuItems[index].focus();\n\t};\n\n\tconst focusOnFirst = () => {\n\t\tselectedItem = 0;\n\t\tselectedIcon = -1;\n\t\tfocusOn(0);\n\t};\n\n\tconst focusOnLast = () => {\n\t\tselectedIcon = -1;\n\t\tconst { length } = getElements();\n\t\tif (length) {\n\t\t\tselectedItem = length - 1;\n\t\t\tfocusOn(length - 1);\n\t\t}\n\t};\n\n\t/**\n\t * Sets the focus on a menu item's icon\n\t * @param index The index of the menu item in the list\n\t * @param iconIndex The index of the menu item's icon (-1 = menu text, not icon)\n\t */\n\tconst focusOnIcon = (index: number, iconIndex: number) => {\n\t\tconst menuItems = getElements();\n\t\t// Menu could have no items\n\t\tif (!menuItems.length) return;\n\n\t\tconst icons = getMenuItemIcons(index);\n\t\t// Defend against possible js runtime error\n\t\tif (icons.length <= iconIndex) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Focus on menu item text, if relevant\n\t\tif (iconIndex === -1) {\n\t\t\tmenuItems[index].focus();\n\t\t\treturn;\n\t\t}\n\n\t\ticons[iconIndex].focus();\n\t};\n\n\t/**\n\t * Simulates mouse events\n\t */\n\tconst clickOnItem = () => {\n\t\tconst elements = getElements();\n\t\tconst selectedItemElement = elements[selectedItem as any];\n\t\t[\"mousedown\", \"click\", \"mouseup\"].forEach((event) => {\n\t\t\tif (selectedIcon > -1) {\n\t\t\t\tconst icons = getMenuItemIcons(selectedItem as any);\n\t\t\t\tconst selectedIconElement = icons[selectedIcon as any];\n\t\t\t\tif (selectedIconElement) {\n\t\t\t\t\tselectedIconElement.dispatchEvent(\n\t\t\t\t\t\tnew MouseEvent(event, {\n\t\t\t\t\t\t\tview: childWin,\n\t\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\t\tcancelable: true,\n\t\t\t\t\t\t\tbuttons: 1,\n\t\t\t\t\t\t})\n\t\t\t\t\t);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (selectedItemElement && selectedItemElement.dispatchEvent) {\n\t\t\t\tselectedItemElement.dispatchEvent(\n\t\t\t\t\tnew MouseEvent(event, {\n\t\t\t\t\t\tview: childWin,\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcancelable: true,\n\t\t\t\t\t\tbuttons: 1,\n\t\t\t\t\t})\n\t\t\t\t);\n\t\t\t}\n\t\t});\n\t};\n\n\t/**\n\t * Invoked when a user presses on the arrow up key\n\t */\n\tconst onArrowUp = () => {\n\t\tselectedIcon = -1;\n\n\t\t// Set the focus on the previous item\n\t\tselectedItem--;\n\t\tif (selectedItem < 0) {\n\t\t\t// If we are back to the begining\n\t\t\t// set the focus on last item\n\t\t\tfocusOnLast();\n\t\t\treturn;\n\t\t}\n\t\tfocusOn(selectedItem);\n\t};\n\n\t/**\n\t * Invoked when user press the arrow down key\n\t */\n\tconst onArrowDown = () => {\n\t\tselectedIcon = -1;\n\n\t\t// The the focus on the next item\n\t\tselectedItem++;\n\t\t// If we reached the end, then go back to first item\n\t\tif (selectedItem === getElements().length) {\n\t\t\tselectedItem = 0;\n\t\t}\n\t\tfocusOn(selectedItem);\n\t};\n\n\t/**\n\t * Invoked when user press the arrow right key\n\t */\n\tconst onArrowRight = () => {\n\t\tconst menuItems = getElements();\n\t\t// Menu could have no items\n\t\tif (!menuItems.length) return;\n\n\t\tconst icons = getMenuItemIcons(selectedItem);\n\t\tif (icons.length === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tselectedIcon++;\n\t\tif (selectedIcon === icons.length) {\n\t\t\tselectedIcon = -1;\n\t\t}\n\t\tfocusOnIcon(selectedItem, selectedIcon);\n\t};\n\n\t/**\n\t * Invoked when user press the arrow left key\n\t */\n\tconst onArrowLeft = () => {\n\t\tconst menuItems = getElements();\n\t\t// Menu could have no items\n\t\tif (!menuItems.length) return;\n\n\t\tconst icons = getMenuItemIcons(selectedItem);\n\t\tif (icons.length === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tselectedIcon--;\n\t\tif (selectedIcon === icons.length) {\n\t\t\tselectedIcon = -1;\n\t\t}\n\t\tfocusOnIcon(selectedItem, selectedIcon);\n\t};\n\n\tconst actionDictionary = {\n\t\tArrowDown: onArrowDown,\n\t\tArrowUp: onArrowUp,\n\t\tArrowLeft: onArrowLeft,\n\t\tArrowRight: onArrowRight,\n\t\tEnter: clickOnItem,\n\t\tHome: focusOnFirst,\n\t\tEnd: focusOnLast,\n\t};\n\n\tchildWin.addEventListener(\"keydown\", (e) => {\n\t\tconst { key } = e as KeyboardEvent;\n\n\t\tif (key in actionDictionary) {\n\t\t\tactionDictionary[key as keyof typeof actionDictionary]?.();\n\t\t\te.preventDefault();\n\t\t}\n\t});\n\n\tchildWin.addEventListener(\"blur\", focusOnFirst);\n\tchildWin.addEventListener(\"focus\", focusOnFirst);\n};\n"]}
|
|
1
|
+
{"version":3,"file":"keyboardNavigation.js","sourceRoot":"","sources":["../../../src/components/menu/keyboardNavigation.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * Keyboard navigation allows the end user to navigate through menus using\n * arrow keys and to select items using the enter key.\n *\n * When an element is selected then the keyboard navigation state is reset\n * so that the user will begin again with the first item.\n *\n * @param childWin - Main window or child window reference.\n * @param [className] - Selector of elements to apply navigation on.\n * @example\n * applyMenuKeyboardNavigation(window, \".menu-item\");\n */\nexport const applyMenuKeyboardNavigation = (childWin: Window, className: string = \".menu-item\") => {\n\tlet selectedItem: number = 0;\n\n\tlet selectedIcon: number = -1;\n\n\tnew MutationObserver(() => {\n\t\t// Reset selectedIndex when elements added or removed\n\t\t// from the DOM. The motivation behind this was an issue\n\t\t// with Brad's search menu where the order of focus is\n\t\t// messed up when his list of result changes.\n\t\tselectedItem = 0;\n\t}).observe(childWin.document.body, {\n\t\tchildList: true,\n\t\tcharacterData: false,\n\t\tsubtree: true,\n\t});\n\n\t/**\n\t * Returns list of elements\n\t */\n\tconst getElements = () => childWin.document.querySelectorAll(className) as NodeListOf<HTMLElement>;\n\n\tconst getMenuItemIcons = (index: number) => {\n\t\tconst menuItems = getElements();\n\t\treturn menuItems[index].querySelectorAll(\".menu-item-icon\") as NodeListOf<HTMLElement>;\n\t};\n\n\t/**\n\t * Sets the focus on a menu item\n\t * @param index The index of the menu item in the list\n\t */\n\tconst focusOn = (index: number) => {\n\t\tconst menuItems = getElements();\n\n\t\t// Menu could have no items\n\t\tif (!menuItems.length) return;\n\n\t\t// Focus on element and scroll if needed\n\t\tmenuItems[index].focus();\n\t};\n\n\tconst focusOnFirst = () => {\n\t\tselectedItem = 0;\n\t\tselectedIcon = -1;\n\t\tfocusOn(0);\n\t};\n\n\tconst focusOnLast = () => {\n\t\tselectedIcon = -1;\n\t\tconst { length } = getElements();\n\t\tif (length) {\n\t\t\tselectedItem = length - 1;\n\t\t\tfocusOn(length - 1);\n\t\t}\n\t};\n\n\t/**\n\t * Sets the focus on a menu item's icon\n\t * @param index The index of the menu item in the list\n\t * @param iconIndex The index of the menu item's icon (-1 = menu text, not icon)\n\t */\n\tconst focusOnIcon = (index: number, iconIndex: number) => {\n\t\tconst menuItems = getElements();\n\t\t// Menu could have no items\n\t\tif (!menuItems.length) return;\n\n\t\tconst icons = getMenuItemIcons(index);\n\t\t// Defend against possible js runtime error\n\t\tif (icons.length <= iconIndex) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Focus on menu item text, if relevant\n\t\tif (iconIndex === -1) {\n\t\t\tmenuItems[index].focus();\n\t\t\treturn;\n\t\t}\n\n\t\ticons[iconIndex].focus();\n\t};\n\n\t/**\n\t * Simulates mouse events\n\t */\n\tconst clickOnItem = () => {\n\t\tconst elements = getElements();\n\t\tconst selectedItemElement = elements[selectedItem as any];\n\t\t[\"mousedown\", \"click\", \"mouseup\"].forEach((event) => {\n\t\t\tif (selectedIcon > -1) {\n\t\t\t\tconst icons = getMenuItemIcons(selectedItem as any);\n\t\t\t\tconst selectedIconElement = icons[selectedIcon as any];\n\t\t\t\tif (selectedIconElement) {\n\t\t\t\t\tselectedIconElement.dispatchEvent(\n\t\t\t\t\t\tnew MouseEvent(event, {\n\t\t\t\t\t\t\tview: childWin,\n\t\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\t\tcancelable: true,\n\t\t\t\t\t\t\tbuttons: 1,\n\t\t\t\t\t\t})\n\t\t\t\t\t);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (selectedItemElement && selectedItemElement.dispatchEvent) {\n\t\t\t\tselectedItemElement.dispatchEvent(\n\t\t\t\t\tnew MouseEvent(event, {\n\t\t\t\t\t\tview: childWin,\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcancelable: true,\n\t\t\t\t\t\tbuttons: 1,\n\t\t\t\t\t})\n\t\t\t\t);\n\t\t\t}\n\t\t});\n\t};\n\n\t/**\n\t * Invoked when a user presses on the arrow up key\n\t */\n\tconst onArrowUp = () => {\n\t\tselectedIcon = -1;\n\n\t\t// Set the focus on the previous item\n\t\tselectedItem--;\n\t\tif (selectedItem < 0) {\n\t\t\t// If we are back to the begining\n\t\t\t// set the focus on last item\n\t\t\tfocusOnLast();\n\t\t\treturn;\n\t\t}\n\t\tfocusOn(selectedItem);\n\t};\n\n\t/**\n\t * Invoked when user press the arrow down key\n\t */\n\tconst onArrowDown = () => {\n\t\tselectedIcon = -1;\n\n\t\t// The the focus on the next item\n\t\tselectedItem++;\n\t\t// If we reached the end, then go back to first item\n\t\tif (selectedItem === getElements().length) {\n\t\t\tselectedItem = 0;\n\t\t}\n\t\tfocusOn(selectedItem);\n\t};\n\n\t/**\n\t * Invoked when user press the arrow right key\n\t */\n\tconst onArrowRight = () => {\n\t\tconst menuItems = getElements();\n\t\t// Menu could have no items\n\t\tif (!menuItems.length) return;\n\n\t\tconst icons = getMenuItemIcons(selectedItem);\n\t\tif (icons.length === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tselectedIcon++;\n\t\tif (selectedIcon === icons.length) {\n\t\t\tselectedIcon = -1;\n\t\t}\n\t\tfocusOnIcon(selectedItem, selectedIcon);\n\t};\n\n\t/**\n\t * Invoked when user press the arrow left key\n\t */\n\tconst onArrowLeft = () => {\n\t\tconst menuItems = getElements();\n\t\t// Menu could have no items\n\t\tif (!menuItems.length) return;\n\n\t\tconst icons = getMenuItemIcons(selectedItem);\n\t\tif (icons.length === 0) {\n\t\t\treturn;\n\t\t}\n\n\t\tselectedIcon--;\n\t\tif (selectedIcon === icons.length) {\n\t\t\tselectedIcon = -1;\n\t\t}\n\t\tfocusOnIcon(selectedItem, selectedIcon);\n\t};\n\n\tconst actionDictionary = {\n\t\tArrowDown: onArrowDown,\n\t\tArrowUp: onArrowUp,\n\t\tArrowLeft: onArrowLeft,\n\t\tArrowRight: onArrowRight,\n\t\tEnter: clickOnItem,\n\t\tHome: focusOnFirst,\n\t\tEnd: focusOnLast,\n\t};\n\n\tchildWin.addEventListener(\"keydown\", (e) => {\n\t\tconst { key } = e as KeyboardEvent;\n\n\t\tif (key in actionDictionary) {\n\t\t\tactionDictionary[key as keyof typeof actionDictionary]?.();\n\t\t\te.preventDefault();\n\t\t}\n\t});\n\n\tchildWin.addEventListener(\"blur\", focusOnFirst);\n\tchildWin.addEventListener(\"focus\", focusOnFirst);\n};\n"]}
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* @param menuId The shell ID (e.g. filemenu)
|
|
6
6
|
* @param menuContentHeight The height of menu contents.
|
|
7
7
|
*/
|
|
8
|
-
export declare const calculatePosition: (menuId: string, menuContentHeight?: number
|
|
8
|
+
export declare const calculatePosition: (menuId: string, menuContentHeight?: number) => Promise<{
|
|
9
9
|
top: number;
|
|
10
10
|
left: number;
|
|
11
11
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardView.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/views/CardView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAK5D,UAAU;AACV,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAElE,aAAa;AACb,OAAO,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AACxE,OAAO,eAAe,MAAM,oBAAoB,CAAC;AAEjD,QAAQ;AACR,OAAO,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAI9D,IAAK,OAKJ;AALD,WAAK,OAAO;IACX,0BAAe,CAAA;IACf,iCAAsB,CAAA;IACtB,kCAAuB,CAAA;IACvB,0BAAe,CAAA;AAChB,CAAC,EALI,OAAO,KAAP,OAAO,QAKX;AAED,MAAM,OAAO,GAAG,CAAC,qBAAuD,EAAE,gBAAyB,EAAE,EAAE;IACtG,IAAI,gBAAgB,EAAE;QACrB,OAAO,MAAM,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,KAAK,CAAC,CAAC,KAAsB,EAAE,EAAE,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC;KAClG;SAAM;QACN,OAAO,MAAM,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC,KAAK,CAChD,CAAC,KAAsB,EAAE,EAAE,CAC1B,KAAK,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,YAA2B,EAAE,EAAE,CAAC,CAAC,YAAY,CAAC,SAAS,CAAC,CAAC,MAAM,KAAK,CAAC,CAC1G,CAAC;KACF;AACF,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAuD,CAAC,KAAgC,EAAE,EAAE;;IAChH,MAAM,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;IAEhC,MAAM,oBAAoB,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAC9D,MAAM,EAAE,kBAAkB,EAAE,YAAY,EAAE,qBAAqB,EAAE,wBAAwB,EAAE,GAAG,oBAAoB,CAAC;IACnH,MAAM,YAAY,GAAG,eAAe,CAAC,kBAAkB,CAAC,CAAC;IAEzD,MAAM,qBAAqB,GAAqC;QAC/D,KAAK,EAAE,EAAE;QACT,SAAS,EAAE,EAAE;QACb,QAAQ,EAAE,EAAE;QACZ,KAAK,EAAE,EAAE;KACT,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACd,IAAI,YAAY,KAAK,EAAE,EAAE;YACxB,wBAAwB,CAAC,aAAa,CAAC,CAAC;SACxC;aAAM;YACN,wBAAwB,CAAC,mBAAmB,CAAC,aAAa,EAAE,YAAY,CAAC,CAAC,CAAC;SAC3E;IACF,CAAC,EAAE,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,CAAC;IAElC,MAAM,4BAA4B,GAAG,YAAY,CAAC,CAAC,CAAC,MAAA,YAAY,CAAC,GAAG
|
|
1
|
+
{"version":3,"file":"CardView.js","sourceRoot":"","sources":["../../../../../src/components/notifications/components/views/CardView.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useContext, useEffect } from \"react\";\nimport { isToday, isYesterday, isThisWeek } from \"date-fns\";\n\n// Types\nimport { NotificationCardViewProps } from \"../../types\";\n\n// Context\nimport { NotificationsContext } from \"../../notificationsContext\";\n\n// Components\nimport { NotificationCardShell } from \"../shared/NotificationCardShell\";\nimport NoNotifications from \"../NoNotifications\";\n\n// Utils\nimport { getActiveFilter, searchNotifications } from \"../../utils\";\n\nimport { services } from \"@finsemble/finsemble-api\";\nimport { ErrorBoundary } from \"../../../common/ErrorBoundary\";\n\ntype INotification = services.notification.types.INotification;\n\nenum Periods {\n\tTODAY = \"today\",\n\tTHIS_WEEK = \"thisWeek\",\n\tYESTERDAY = \"yesterday\",\n\tOLDER = \"older\",\n}\n\nconst isEmpty = (byPeriodNotifications: Record<Periods, INotification[]>, accountForSnooze: boolean) => {\n\tif (accountForSnooze) {\n\t\treturn Object.values(byPeriodNotifications).every((value: INotification[]) => value.length === 0);\n\t} else {\n\t\treturn Object.values(byPeriodNotifications).every(\n\t\t\t(value: INotification[]) =>\n\t\t\t\tvalue.length === 0 || value.filter((notification: INotification) => !notification.isSnoozed).length === 0\n\t\t);\n\t}\n};\n\nexport const CardView: React.FunctionComponent<NotificationCardViewProps> = (props: NotificationCardViewProps) => {\n\tconst { notifications } = props;\n\n\tconst notificationsContext = useContext(NotificationsContext);\n\tconst { drawerControlProps, searchString, filteredNotifications, setFilteredNotifications } = notificationsContext;\n\tconst activeFilter = getActiveFilter(drawerControlProps);\n\n\tconst byPeriodNotifications: Record<Periods, INotification[]> = {\n\t\ttoday: [],\n\t\tyesterday: [],\n\t\tthisWeek: [],\n\t\tolder: [],\n\t};\n\n\tuseEffect(() => {\n\t\tif (searchString === \"\") {\n\t\t\tsetFilteredNotifications(notifications);\n\t\t} else {\n\t\t\tsetFilteredNotifications(searchNotifications(notifications, searchString));\n\t\t}\n\t}, [searchString, notifications]);\n\n\tconst controlFilteredNotifications = activeFilter ? activeFilter.run?.(filteredNotifications) : [];\n\n\tcontrolFilteredNotifications.reduce((accumulator: any, notification: INotification) => {\n\t\tconst notificationDate: number = Date.parse(notification.issuedAt);\n\t\tif (isToday(notificationDate)) {\n\t\t\taccumulator.today.push(notification);\n\t\t} else if (isYesterday(notificationDate)) {\n\t\t\taccumulator.yesterday.push(notification);\n\t\t} else if (isThisWeek(notificationDate)) {\n\t\t\taccumulator.thisWeek.push(notification);\n\t\t} else {\n\t\t\taccumulator.older.push(notification);\n\t\t}\n\t\treturn accumulator;\n\t}, byPeriodNotifications);\n\n\tconst NotificationCardComponent = props.notificationCard ? props.notificationCard : NotificationCardShell;\n\n\tconst renderSeparatorLabel = (period: string) => {\n\t\tif (period === Periods.TODAY) {\n\t\t\treturn <p className=\"notification-day\">Today</p>;\n\t\t} else if (period === Periods.YESTERDAY) {\n\t\t\treturn <p className=\"notification-day\">Yesterday</p>;\n\t\t} else if (period === Periods.THIS_WEEK) {\n\t\t\treturn <p className=\"notification-day\">This Week</p>;\n\t\t} else {\n\t\t\treturn <p className=\"notification-day\">Older</p>;\n\t\t}\n\t};\n\n\tconst renderNotificationsBlock = (period: Periods) =>\n\t\tbyPeriodNotifications[period]\n\t\t\t.sort((a: INotification, b: INotification) => Date.parse(b.issuedAt) - Date.parse(a.issuedAt))\n\t\t\t.filter((notification) => (activeFilter.action === \"snoozed\" ? notification.isSnoozed : !notification.isSnoozed))\n\t\t\t.map((notification, index) => {\n\t\t\t\tconst key = `${index}_${notification.id ? notification.id : notification.issuedAt}`;\n\t\t\t\treturn (\n\t\t\t\t\t<div key={key}>\n\t\t\t\t\t\t{index === 0 ? renderSeparatorLabel(period) : null}\n\t\t\t\t\t\t<ErrorBoundary key={key}>\n\t\t\t\t\t\t\t<NotificationCardComponent\n\t\t\t\t\t\t\t\tkey={notification.id}\n\t\t\t\t\t\t\t\tnotification={notification}\n\t\t\t\t\t\t\t\tremoveNotification={() => {}}\n\t\t\t\t\t\t\t\tuiContext={\"center\"}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t<div className=\"divider\"> </div>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t});\n\n\treturn isEmpty(byPeriodNotifications, activeFilter.action === \"snoozed\") ? (\n\t\t<NoNotifications />\n\t) : (\n\t\t<>{Object.keys(byPeriodNotifications).map((period) => renderNotificationsBlock(period as Periods))}</>\n\t);\n};\n\nexport default CardView;\n"]}
|