@deephaven/dashboard 0.11.2-beta.11 → 0.11.2-js-plugins.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.
Files changed (5) hide show
  1. package/dist/layout/hooks.d.ts +13 -0
  2. package/dist/layout/hooks.d.ts.map +1 -1
  3. package/dist/layout/hooks.js +73 -1
  4. package/dist/layout/hooks.js.map +1 -1
  5. package/package.json +14 -11
package/dist/layout/hooks.d.ts CHANGED
@@ -1,6 +1,19 @@
1
1
  /// <reference types="pouchdb-core" />
2
+ import { ComponentType } from 'react';
2
3
  import GoldenLayout from '@deephaven/golden-layout';
4
+ import { VariableDefinition } from '@deephaven/jsapi-shim';
5
+ import { DashboardPluginComponentProps, PanelComponentType, PanelDehydrateFunction, PanelHydrateFunction, PanelProps } from '../DashboardPlugin';
3
6
  export declare const useListener: (eventEmitter: GoldenLayout.EventEmitter, eventName: string, callback: Function) => void;
7
+ /**
8
+ * Register a component that opens when a specified widget type is triggered with the PanelEvent.OPEN
9
+ * @param dashboardPluginProps The dashboard plugin props
10
+ * @param componentName Name the component should be registered under
11
+ * @param componentType ComponentType to register
12
+ * @param openType Specify which widget types this component should open for. Can either provide a string to match, or a function returning a bool.
13
+ * @param hydrate Custom hydration function for the component
14
+ * @param dehydrate Custom dehydration function for the component
15
+ */
16
+ export declare const useWidget: <P extends PanelProps, C extends ComponentType<P>>(dashboardPluginProps: DashboardPluginComponentProps, componentName: string, componentType: PanelComponentType<P, C>, openType: string | ((widget: VariableDefinition) => boolean), hydrate?: PanelHydrateFunction | undefined, dehydrate?: PanelDehydrateFunction | undefined) => void;
4
17
  declare const _default: {
5
18
  useListener: (eventEmitter: GoldenLayout.EventEmitter, eventName: string, callback: Function) => void;
6
19
  };
package/dist/layout/hooks.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../src/layout/hooks.ts"],"names":[],"mappings":";AACA,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,eAAO,MAAM,WAAW,iBACR,yBAAyB,aAC5B,MAAM,YAEP,QAAQ,KACjB,IAOsC,CAAC;;;;AAE1C,wBAA+B"}
1
+ {"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../src/layout/hooks.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAqC,MAAM,OAAO,CAAC;AAEzE,OAAO,YAAY,MAAM,0BAA0B,CAAC;AACpD,OAAO,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAC3D,OAAO,EACL,6BAA6B,EAC7B,kBAAkB,EAClB,sBAAsB,EACtB,oBAAoB,EACpB,UAAU,EACX,MAAM,oBAAoB,CAAC;AAI5B,eAAO,MAAM,WAAW,iBACR,yBAAyB,aAC5B,MAAM,YAEP,QAAQ,KACjB,IAOsC,CAAC;AAE1C;;;;;;;;GAQG;AACH,eAAO,MAAM,SAAS,2EACE,6BAA6B,iBACpC,MAAM,wEAEQ,kBAAkB,KAAK,OAAO,kGAG1D,IAqDF,CAAC;;;;AAEF,wBAA+B"}
package/dist/layout/hooks.js CHANGED
@@ -1,10 +1,82 @@
1
- import { useEffect } from 'react';
1
+ import { useCallback, useEffect } from 'react';
2
+ import shortid from 'shortid';
3
+ import PanelEvent from "../PanelEvent.js";
4
+ import LayoutUtils from "./LayoutUtils.js";
2
5
  export var useListener = (eventEmitter, eventName, callback) => useEffect(() => {
3
6
  eventEmitter.on(eventName, callback);
4
7
  return () => {
5
8
  eventEmitter.off(eventName, callback);
6
9
  };
7
10
  }, [eventEmitter, eventName, callback]);
11
+ /**
12
+ * Register a component that opens when a specified widget type is triggered with the PanelEvent.OPEN
13
+ * @param dashboardPluginProps The dashboard plugin props
14
+ * @param componentName Name the component should be registered under
15
+ * @param componentType ComponentType to register
16
+ * @param openType Specify which widget types this component should open for. Can either provide a string to match, or a function returning a bool.
17
+ * @param hydrate Custom hydration function for the component
18
+ * @param dehydrate Custom dehydration function for the component
19
+ */
20
+
21
+ export var useWidget = (dashboardPluginProps, componentName, componentType, openType, hydrate, dehydrate) => {
22
+ var {
23
+ id,
24
+ layout,
25
+ registerComponent
26
+ } = dashboardPluginProps;
27
+ var handlePanelOpen = useCallback(_ref => {
28
+ var {
29
+ dragEvent,
30
+ fetch,
31
+ panelId = shortid.generate(),
32
+ widget
33
+ } = _ref;
34
+ var {
35
+ name,
36
+ type
37
+ } = widget;
38
+
39
+ if (typeof openType === 'string') {
40
+ if (openType !== type) {
41
+ return;
42
+ }
43
+ } else if (!openType(widget)) {
44
+ return;
45
+ }
46
+
47
+ var metadata = {
48
+ name,
49
+ type
50
+ };
51
+ var config = {
52
+ type: 'react-component',
53
+ component: componentName,
54
+ props: {
55
+ localDashboardId: id,
56
+ id: panelId,
57
+ metadata,
58
+ fetch
59
+ },
60
+ title: name,
61
+ id: panelId
62
+ };
63
+ var {
64
+ root
65
+ } = layout;
66
+ LayoutUtils.openComponent({
67
+ root,
68
+ config,
69
+ dragEvent
70
+ });
71
+ }, [componentName, id, layout, openType]);
72
+ useEffect(() => {
73
+ var cleanups = [registerComponent(componentName, componentType, hydrate, dehydrate)];
74
+ return () => {
75
+ cleanups.forEach(cleanup => cleanup());
76
+ };
77
+ }, [componentName, componentType, dehydrate, hydrate, registerComponent]);
78
+ useListener(layout.eventHub, PanelEvent.OPEN, handlePanelOpen);
79
+ };
8
80
  export default {
9
81
  useListener
10
82
  };
package/dist/layout/hooks.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/layout/hooks.ts"],"names":["useEffect","useListener","eventEmitter","eventName","callback","on","off"],"mappings":"AAAA,SAASA,SAAT,QAA0B,OAA1B;AAGA,OAAO,IAAMC,WAAW,GAAG,CACzBC,YADyB,EAEzBC,SAFyB,EAIzBC,QAJyB,KAMzBJ,SAAS,CAAC,MAAM;AACdE,EAAAA,YAAY,CAACG,EAAb,CAAgBF,SAAhB,EAA2BC,QAA3B;AAEA,SAAO,MAAM;AACXF,IAAAA,YAAY,CAACI,GAAb,CAAiBH,SAAjB,EAA4BC,QAA5B;AACD,GAFD;AAGD,CANQ,EAMN,CAACF,YAAD,EAAeC,SAAf,EAA0BC,QAA1B,CANM,CANJ;AAcP,eAAe;AAAEH,EAAAA;AAAF,CAAf","sourcesContent":["import { useEffect } from 'react';\nimport GoldenLayout from '@deephaven/golden-layout';\n\nexport const useListener = (\n eventEmitter: GoldenLayout.EventEmitter,\n eventName: string,\n // eslint-disable-next-line @typescript-eslint/ban-types\n callback: Function\n): void =>\n useEffect(() => {\n eventEmitter.on(eventName, callback);\n\n return () => {\n eventEmitter.off(eventName, callback);\n };\n }, [eventEmitter, eventName, callback]);\n\nexport default { useListener };\n"],"file":"hooks.js"}
1
+ {"version":3,"sources":["../../src/layout/hooks.ts"],"names":["useCallback","useEffect","shortid","PanelEvent","LayoutUtils","useListener","eventEmitter","eventName","callback","on","off","useWidget","dashboardPluginProps","componentName","componentType","openType","hydrate","dehydrate","id","layout","registerComponent","handlePanelOpen","dragEvent","fetch","panelId","generate","widget","name","type","metadata","config","component","props","localDashboardId","title","root","openComponent","cleanups","forEach","cleanup","eventHub","OPEN"],"mappings":"AAAA,SAAmCA,WAAnC,EAAgDC,SAAhD,QAAiE,OAAjE;AACA,OAAOC,OAAP,MAAoB,SAApB;OAUOC,U;OACAC,W;AAEP,OAAO,IAAMC,WAAW,GAAG,CACzBC,YADyB,EAEzBC,SAFyB,EAIzBC,QAJyB,KAMzBP,SAAS,CAAC,MAAM;AACdK,EAAAA,YAAY,CAACG,EAAb,CAAgBF,SAAhB,EAA2BC,QAA3B;AAEA,SAAO,MAAM;AACXF,IAAAA,YAAY,CAACI,GAAb,CAAiBH,SAAjB,EAA4BC,QAA5B;AACD,GAFD;AAGD,CANQ,EAMN,CAACF,YAAD,EAAeC,SAAf,EAA0BC,QAA1B,CANM,CANJ;AAcP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,IAAMG,SAAS,GAAG,CACvBC,oBADuB,EAEvBC,aAFuB,EAGvBC,aAHuB,EAIvBC,QAJuB,EAKvBC,OALuB,EAMvBC,SANuB,KAOd;AACT,MAAM;AAAEC,IAAAA,EAAF;AAAMC,IAAAA,MAAN;AAAcC,IAAAA;AAAd,MAAoCR,oBAA1C;AACA,MAAMS,eAAe,GAAGrB,WAAW,CACjC,QAUM;AAAA,QAVL;AACCsB,MAAAA,SADD;AAECC,MAAAA,KAFD;AAGCC,MAAAA,OAAO,GAAGtB,OAAO,CAACuB,QAAR,EAHX;AAICC,MAAAA;AAJD,KAUK;AACJ,QAAM;AAAEC,MAAAA,IAAF;AAAQC,MAAAA;AAAR,QAAiBF,MAAvB;;AACA,QAAI,OAAOX,QAAP,KAAoB,QAAxB,EAAkC;AAChC,UAAIA,QAAQ,KAAKa,IAAjB,EAAuB;AACrB;AACD;AACF,KAJD,MAIO,IAAI,CAACb,QAAQ,CAACW,MAAD,CAAb,EAAuB;AAC5B;AACD;;AACD,QAAMG,QAAQ,GAAG;AAAEF,MAAAA,IAAF;AAAQC,MAAAA;AAAR,KAAjB;AACA,QAAME,MAAM,GAAG;AACbF,MAAAA,IAAI,EAAE,iBADO;AAEbG,MAAAA,SAAS,EAAElB,aAFE;AAGbmB,MAAAA,KAAK,EAAE;AACLC,QAAAA,gBAAgB,EAAEf,EADb;AAELA,QAAAA,EAAE,EAAEM,OAFC;AAGLK,QAAAA,QAHK;AAILN,QAAAA;AAJK,OAHM;AASbW,MAAAA,KAAK,EAAEP,IATM;AAUbT,MAAAA,EAAE,EAAEM;AAVS,KAAf;AAaA,QAAM;AAAEW,MAAAA;AAAF,QAAWhB,MAAjB;AACAf,IAAAA,WAAW,CAACgC,aAAZ,CAA0B;AAAED,MAAAA,IAAF;AAAQL,MAAAA,MAAR;AAAgBR,MAAAA;AAAhB,KAA1B;AACD,GApCgC,EAqCjC,CAACT,aAAD,EAAgBK,EAAhB,EAAoBC,MAApB,EAA4BJ,QAA5B,CArCiC,CAAnC;AAwCAd,EAAAA,SAAS,CAAC,MAAM;AACd,QAAMoC,QAAQ,GAAG,CACfjB,iBAAiB,CAACP,aAAD,EAAgBC,aAAhB,EAA+BE,OAA/B,EAAwCC,SAAxC,CADF,CAAjB;AAIA,WAAO,MAAM;AACXoB,MAAAA,QAAQ,CAACC,OAAT,CAAiBC,OAAO,IAAIA,OAAO,EAAnC;AACD,KAFD;AAGD,GARQ,EAQN,CAAC1B,aAAD,EAAgBC,aAAhB,EAA+BG,SAA/B,EAA0CD,OAA1C,EAAmDI,iBAAnD,CARM,CAAT;AAUAf,EAAAA,WAAW,CAACc,MAAM,CAACqB,QAAR,EAAkBrC,UAAU,CAACsC,IAA7B,EAAmCpB,eAAnC,CAAX;AACD,CA5DM;AA8DP,eAAe;AAAEhB,EAAAA;AAAF,CAAf","sourcesContent":["import { ComponentType, DragEvent, useCallback, useEffect } from 'react';\nimport shortid from 'shortid';\nimport GoldenLayout from '@deephaven/golden-layout';\nimport { VariableDefinition } from '@deephaven/jsapi-shim';\nimport {\n DashboardPluginComponentProps,\n PanelComponentType,\n PanelDehydrateFunction,\n PanelHydrateFunction,\n PanelProps,\n} from '../DashboardPlugin';\nimport PanelEvent from '../PanelEvent';\nimport LayoutUtils from './LayoutUtils';\n\nexport const useListener = (\n eventEmitter: GoldenLayout.EventEmitter,\n eventName: string,\n // eslint-disable-next-line @typescript-eslint/ban-types\n callback: Function\n): void =>\n useEffect(() => {\n eventEmitter.on(eventName, callback);\n\n return () => {\n eventEmitter.off(eventName, callback);\n };\n }, [eventEmitter, eventName, callback]);\n\n/**\n * Register a component that opens when a specified widget type is triggered with the PanelEvent.OPEN\n * @param dashboardPluginProps The dashboard plugin props\n * @param componentName Name the component should be registered under\n * @param componentType ComponentType to register\n * @param openType Specify which widget types this component should open for. Can either provide a string to match, or a function returning a bool.\n * @param hydrate Custom hydration function for the component\n * @param dehydrate Custom dehydration function for the component\n */\nexport const useWidget = <P extends PanelProps, C extends ComponentType<P>>(\n dashboardPluginProps: DashboardPluginComponentProps,\n componentName: string,\n componentType: PanelComponentType<P, C>,\n openType: string | ((widget: VariableDefinition) => boolean),\n hydrate?: PanelHydrateFunction,\n dehydrate?: PanelDehydrateFunction\n): void => {\n const { id, layout, registerComponent } = dashboardPluginProps;\n const handlePanelOpen = useCallback(\n ({\n dragEvent,\n fetch,\n panelId = shortid.generate(),\n widget,\n }: {\n dragEvent: DragEvent;\n fetch: () => Promise<unknown>;\n panelId?: string;\n widget: VariableDefinition;\n }) => {\n const { name, type } = widget;\n if (typeof openType === 'string') {\n if (openType !== type) {\n return;\n }\n } else if (!openType(widget)) {\n return;\n }\n const metadata = { name, type };\n const config = {\n type: 'react-component',\n component: componentName,\n props: {\n localDashboardId: id,\n id: panelId,\n metadata,\n fetch,\n },\n title: name,\n id: panelId,\n };\n\n const { root } = layout;\n LayoutUtils.openComponent({ root, config, dragEvent });\n },\n [componentName, id, layout, openType]\n );\n\n useEffect(() => {\n const cleanups = [\n registerComponent(componentName, componentType, hydrate, dehydrate),\n ];\n\n return () => {\n cleanups.forEach(cleanup => cleanup());\n };\n }, [componentName, componentType, dehydrate, hydrate, registerComponent]);\n\n useListener(layout.eventHub, PanelEvent.OPEN, handlePanelOpen);\n};\n\nexport default { useListener };\n"],"file":"hooks.js"}
package/package.json CHANGED
@@ -1,14 +1,13 @@
1
1
  {
2
2
  "name": "@deephaven/dashboard",
3
- "version": "0.11.2-beta.11+7cf384a",
3
+ "version": "0.11.2-js-plugins.1+149206d",
4
4
  "description": "Deephaven Dashboard",
5
5
  "author": "Deephaven Data Labs LLC",
6
6
  "license": "Apache-2.0",
7
7
  "type": "module",
8
8
  "repository": {
9
9
  "type": "git",
10
- "url": "https://github.com/deephaven/web-client-ui.git",
11
- "directory": "packages/dashboard"
10
+ "url": "https://github.com/deephaven/web-client-ui"
12
11
  },
13
12
  "source": "src/index.ts",
14
13
  "main": "dist/index.js",
@@ -30,8 +29,8 @@
30
29
  "start": "cross-env NODE_ENV=development npm run watch"
31
30
  },
32
31
  "dependencies": {
33
- "@deephaven/golden-layout": "^0.11.2-beta.11+7cf384a",
34
- "@deephaven/react-hooks": "^0.11.2-beta.11+7cf384a",
32
+ "@deephaven/golden-layout": "^0.11.2-js-plugins.1+149206d",
33
+ "@deephaven/react-hooks": "^0.11.2-js-plugins.1+149206d",
35
34
  "deep-equal": "^2.0.4",
36
35
  "jquery": "^3.5.1",
37
36
  "lodash.ismatch": "^4.1.1",
@@ -49,11 +48,15 @@
49
48
  },
50
49
  "devDependencies": {
51
50
  "@babel/cli": "^7.16.0",
52
- "@deephaven/components": "^0.11.2-beta.11+7cf384a",
53
- "@deephaven/log": "^0.11.2-beta.11+7cf384a",
54
- "@deephaven/mocks": "^0.11.2-beta.11+7cf384a",
55
- "@deephaven/redux": "^0.11.2-beta.11+7cf384a",
56
- "@deephaven/tsconfig": "^0.11.2-beta.11+7cf384a",
51
+ "@deephaven/components": "^0.11.2-js-plugins.1+149206d",
52
+ "@deephaven/log": "^0.11.2-js-plugins.1+149206d",
53
+ "@deephaven/mocks": "^0.11.2-js-plugins.1+149206d",
54
+ "@deephaven/redux": "^0.11.2-js-plugins.1+149206d",
55
+ "@deephaven/tsconfig": "^0.11.2-js-plugins.1+149206d",
56
+ "@storybook/addon-actions": "^6.2.3",
57
+ "@storybook/addon-essentials": "^6.2.3",
58
+ "@storybook/addon-links": "^6.2.3",
59
+ "@storybook/react": "^6.2.3",
57
60
  "@types/react": "^17.0.2",
58
61
  "cross-env": "^7.0.2",
59
62
  "identity-obj-proxy": "^3.0.0",
@@ -70,5 +73,5 @@
70
73
  "publishConfig": {
71
74
  "access": "public"
72
75
  },
73
- "gitHead": "7cf384aa6b5b03ad0c1d553305f3725a6fc476b0"
76
+ "gitHead": "149206de19fa4378a12f33c46d0daa886ab45d95"
74
77
  }