cx 25.1.2 → 25.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.
Files changed (109) hide show
  1. package/dist/data.js +3 -3
  2. package/dist/manifest.js +747 -747
  3. package/dist/widgets.js +8 -2
  4. package/package.json +32 -32
  5. package/src/charts/Legend.js +167 -167
  6. package/src/charts/Legend.scss +40 -40
  7. package/src/charts/LegendEntry.js +128 -128
  8. package/src/charts/LegendEntry.scss +27 -27
  9. package/src/charts/PieChart.d.ts +92 -92
  10. package/src/charts/PieChart.js +529 -529
  11. package/src/charts/axis/Axis.d.ts +113 -113
  12. package/src/charts/axis/Axis.js +280 -280
  13. package/src/charts/axis/CategoryAxis.d.ts +30 -30
  14. package/src/charts/axis/CategoryAxis.js +241 -241
  15. package/src/charts/axis/NumericAxis.js +351 -351
  16. package/src/charts/axis/Stack.js +55 -55
  17. package/src/charts/axis/TimeAxis.d.ts +28 -28
  18. package/src/charts/axis/TimeAxis.js +611 -611
  19. package/src/charts/helpers/PointReducer.js +47 -47
  20. package/src/charts/helpers/SnapPointFinder.js +69 -69
  21. package/src/data/Binding.spec.js +69 -69
  22. package/src/data/Expression.js +229 -229
  23. package/src/data/Expression.spec.js +229 -229
  24. package/src/data/StringTemplate.js +92 -92
  25. package/src/data/StringTemplate.spec.js +132 -127
  26. package/src/data/StructuredSelector.js +2 -1
  27. package/src/data/getAccessor.spec.js +11 -11
  28. package/src/data/getSelector.js +2 -1
  29. package/src/hooks/createLocalStorageRef.d.ts +3 -3
  30. package/src/hooks/createLocalStorageRef.js +20 -20
  31. package/src/index.scss +6 -6
  32. package/src/ui/Culture.d.ts +57 -57
  33. package/src/ui/Culture.js +139 -139
  34. package/src/ui/FocusManager.js +171 -171
  35. package/src/ui/Format.js +108 -108
  36. package/src/ui/HoverSync.js +147 -147
  37. package/src/ui/Instance.d.ts +72 -72
  38. package/src/ui/Instance.js +614 -614
  39. package/src/ui/Repeater.d.ts +61 -61
  40. package/src/ui/index.d.ts +42 -42
  41. package/src/ui/layout/ContentPlaceholder.d.ts +19 -19
  42. package/src/ui/layout/ContentPlaceholder.js +105 -105
  43. package/src/ui/layout/ContentPlaceholder.spec.js +579 -579
  44. package/src/ui/layout/LabelsTopLayout.js +134 -134
  45. package/src/util/Format.js +270 -270
  46. package/src/util/date/encodeDate.d.ts +1 -1
  47. package/src/util/date/encodeDate.js +8 -8
  48. package/src/util/date/encodeDateWithTimezoneOffset.d.ts +1 -1
  49. package/src/util/date/index.d.ts +11 -11
  50. package/src/util/date/index.js +11 -11
  51. package/src/util/date/parseDateInvariant.d.ts +3 -3
  52. package/src/util/date/parseDateInvariant.js +20 -20
  53. package/src/util/getSearchQueryPredicate.js +59 -59
  54. package/src/util/index.d.ts +51 -51
  55. package/src/util/index.js +54 -54
  56. package/src/util/isValidIdentifierName.d.ts +1 -1
  57. package/src/util/isValidIdentifierName.js +5 -5
  58. package/src/util/isValidIdentifierName.spec.js +33 -33
  59. package/src/util/scss/add-rules.scss +38 -38
  60. package/src/widgets/CxCredit.scss +37 -37
  61. package/src/widgets/HighlightedSearchText.js +36 -36
  62. package/src/widgets/HighlightedSearchText.scss +18 -18
  63. package/src/widgets/List.scss +91 -91
  64. package/src/widgets/drag-drop/DropZone.js +214 -214
  65. package/src/widgets/form/Calendar.js +618 -618
  66. package/src/widgets/form/Calendar.scss +196 -196
  67. package/src/widgets/form/Checkbox.scss +127 -127
  68. package/src/widgets/form/ColorField.js +397 -397
  69. package/src/widgets/form/ColorField.scss +96 -96
  70. package/src/widgets/form/ColorPicker.scss +283 -283
  71. package/src/widgets/form/DateTimeField.js +576 -576
  72. package/src/widgets/form/DateTimePicker.js +392 -392
  73. package/src/widgets/form/LookupField.d.ts +179 -179
  74. package/src/widgets/form/LookupField.scss +219 -219
  75. package/src/widgets/form/MonthField.d.ts +99 -99
  76. package/src/widgets/form/MonthField.js +523 -523
  77. package/src/widgets/form/MonthPicker.d.ts +76 -76
  78. package/src/widgets/form/MonthPicker.js +641 -641
  79. package/src/widgets/form/MonthPicker.scss +118 -118
  80. package/src/widgets/form/NumberField.js +459 -459
  81. package/src/widgets/form/NumberField.scss +61 -61
  82. package/src/widgets/form/Radio.scss +121 -121
  83. package/src/widgets/form/Select.scss +99 -99
  84. package/src/widgets/form/Slider.scss +118 -118
  85. package/src/widgets/form/Switch.scss +140 -140
  86. package/src/widgets/form/TextArea.scss +43 -43
  87. package/src/widgets/form/TextField.js +290 -290
  88. package/src/widgets/form/TextField.scss +55 -55
  89. package/src/widgets/form/UploadButton.d.ts +34 -34
  90. package/src/widgets/form/variables.scss +353 -353
  91. package/src/widgets/grid/Grid.d.ts +442 -442
  92. package/src/widgets/grid/Grid.js +3414 -3414
  93. package/src/widgets/grid/Grid.scss +638 -637
  94. package/src/widgets/grid/GridRow.js +228 -228
  95. package/src/widgets/grid/TreeNode.d.ts +23 -23
  96. package/src/widgets/grid/TreeNode.scss +88 -88
  97. package/src/widgets/grid/variables.scss +133 -133
  98. package/src/widgets/nav/Menu.scss +74 -74
  99. package/src/widgets/overlay/Dropdown.js +612 -612
  100. package/src/widgets/overlay/FlyweightTooltipTracker.js +39 -39
  101. package/src/widgets/overlay/Overlay.d.ts +73 -73
  102. package/src/widgets/overlay/Tooltip.js +308 -303
  103. package/src/widgets/overlay/Window.js +202 -202
  104. package/src/widgets/overlay/captureMouse.js +124 -124
  105. package/src/widgets/overlay/createHotPromiseWindowFactory.d.ts +18 -18
  106. package/src/widgets/overlay/createHotPromiseWindowFactory.js +56 -56
  107. package/src/widgets/overlay/index.d.ts +11 -11
  108. package/src/widgets/overlay/index.js +11 -11
  109. package/src/widgets/variables.scss +144 -144
package/src/ui/Format.js CHANGED
@@ -1,108 +1,108 @@
1
- import { Culture, getCurrentCultureCache } from "./Culture";
2
- import { Format as Fmt, resolveMinMaxFractionDigits, setGetFormatCacheCallback } from "../util/Format";
3
- import { setGetExpressionCacheCallback } from "../data/Expression";
4
- import { setGetStringTemplateCacheCallback } from "../data/StringTemplate";
5
- import { parseDateInvariant } from "../util";
6
- import { GlobalCacheIdentifier } from "../util/GlobalCacheIdentifier";
7
-
8
- export const Format = Fmt;
9
-
10
- let cultureSensitiveFormatsRegistered = false;
11
-
12
- export function resolveNumberFormattingFlags(flags) {
13
- if (!flags) return null;
14
- let result = {};
15
- if (flags.indexOf("+") >= 0) result.signDisplay = "exceptZero";
16
- if (flags.indexOf("c") >= 0) result.notation = "compact";
17
- if (flags.indexOf("a") >= 0) result.currencySign = "accounting";
18
- return result;
19
- }
20
-
21
- export function enableCultureSensitiveFormatting() {
22
- if (cultureSensitiveFormatsRegistered) return;
23
-
24
- cultureSensitiveFormatsRegistered = true;
25
-
26
- Fmt.registerFactory(["number", "n"], (format, minimumFractionDigits, maximumFractionDigits, flags) => {
27
- let culture = Culture.getNumberCulture();
28
-
29
- let formatter = culture.getFormatter({
30
- ...resolveMinMaxFractionDigits(minimumFractionDigits, maximumFractionDigits),
31
- ...resolveNumberFormattingFlags(flags),
32
- });
33
-
34
- return (value) => formatter.format(value);
35
- });
36
-
37
- Fmt.registerFactory("currency", (format, currency, minimumFractionDigits, maximumFractionDigits, flags) => {
38
- let culture = Culture.getNumberCulture();
39
- currency = currency || Culture.defaultCurrency;
40
-
41
- let formatter = culture.getFormatter({
42
- style: "currency",
43
- currency: currency,
44
- ...resolveMinMaxFractionDigits(minimumFractionDigits, maximumFractionDigits),
45
- ...resolveNumberFormattingFlags(flags),
46
- });
47
-
48
- return (value) => formatter.format(value);
49
- });
50
-
51
- Fmt.registerFactory(["percentage", "p", "%"], (format, minimumFractionDigits, maximumFractionDigits, flags) => {
52
- let culture = Culture.getNumberCulture();
53
- let formatter = culture.getFormatter({
54
- style: "percent",
55
- ...resolveMinMaxFractionDigits(minimumFractionDigits, maximumFractionDigits),
56
- ...resolveNumberFormattingFlags(flags),
57
- });
58
- return (value) => formatter.format(value);
59
- });
60
-
61
- Fmt.registerFactory(["percentSign", "ps"], (format, minimumFractionDigits, maximumFractionDigits, flags) => {
62
- let culture = Culture.getNumberCulture();
63
- let formatter = culture.getFormatter({
64
- style: "percent",
65
- ...resolveMinMaxFractionDigits(minimumFractionDigits, maximumFractionDigits),
66
- ...resolveNumberFormattingFlags(flags),
67
- });
68
- return (value) => formatter.format(value / 100);
69
- });
70
-
71
- Fmt.registerFactory(["date", "d"], (fmt, format = "yyyyMMdd") => {
72
- let culture = Culture.getDateTimeCulture();
73
- let formatter = culture.getFormatter(format);
74
- return (value) => formatter.format(parseDateInvariant(value));
75
- });
76
-
77
- Fmt.registerFactory(["time", "t"], (fmt, format = "hhmmss") => {
78
- let culture = Culture.getDateTimeCulture();
79
- let formatter = culture.getFormatter(format);
80
- return (value) => formatter.format(parseDateInvariant(value));
81
- });
82
-
83
- Fmt.registerFactory(["datetime", "dt"], (fmt, format = "yyyyMd hhmm") => {
84
- let culture = Culture.getDateTimeCulture();
85
- let formatter = culture.getFormatter(format);
86
- return (value) => formatter.format(parseDateInvariant(value));
87
- });
88
-
89
- setGetFormatCacheCallback(() => {
90
- let cache = getCurrentCultureCache();
91
- if (!cache.formatCache) cache.formatCache = {};
92
- return cache.formatCache;
93
- });
94
-
95
- setGetExpressionCacheCallback(() => {
96
- let cache = getCurrentCultureCache();
97
- if (!cache.exprCache) cache.exprCache = {};
98
- return cache.exprCache;
99
- });
100
-
101
- setGetStringTemplateCacheCallback(() => {
102
- let cache = getCurrentCultureCache();
103
- if (!cache.strTplCache) cache.strTplCache = {};
104
- return cache.strTplCache;
105
- });
106
-
107
- GlobalCacheIdentifier.change();
108
- }
1
+ import { Culture, getCurrentCultureCache } from "./Culture";
2
+ import { Format as Fmt, resolveMinMaxFractionDigits, setGetFormatCacheCallback } from "../util/Format";
3
+ import { setGetExpressionCacheCallback } from "../data/Expression";
4
+ import { setGetStringTemplateCacheCallback } from "../data/StringTemplate";
5
+ import { parseDateInvariant } from "../util";
6
+ import { GlobalCacheIdentifier } from "../util/GlobalCacheIdentifier";
7
+
8
+ export const Format = Fmt;
9
+
10
+ let cultureSensitiveFormatsRegistered = false;
11
+
12
+ export function resolveNumberFormattingFlags(flags) {
13
+ if (!flags) return null;
14
+ let result = {};
15
+ if (flags.indexOf("+") >= 0) result.signDisplay = "exceptZero";
16
+ if (flags.indexOf("c") >= 0) result.notation = "compact";
17
+ if (flags.indexOf("a") >= 0) result.currencySign = "accounting";
18
+ return result;
19
+ }
20
+
21
+ export function enableCultureSensitiveFormatting() {
22
+ if (cultureSensitiveFormatsRegistered) return;
23
+
24
+ cultureSensitiveFormatsRegistered = true;
25
+
26
+ Fmt.registerFactory(["number", "n"], (format, minimumFractionDigits, maximumFractionDigits, flags) => {
27
+ let culture = Culture.getNumberCulture();
28
+
29
+ let formatter = culture.getFormatter({
30
+ ...resolveMinMaxFractionDigits(minimumFractionDigits, maximumFractionDigits),
31
+ ...resolveNumberFormattingFlags(flags),
32
+ });
33
+
34
+ return (value) => formatter.format(value);
35
+ });
36
+
37
+ Fmt.registerFactory("currency", (format, currency, minimumFractionDigits, maximumFractionDigits, flags) => {
38
+ let culture = Culture.getNumberCulture();
39
+ currency = currency || Culture.defaultCurrency;
40
+
41
+ let formatter = culture.getFormatter({
42
+ style: "currency",
43
+ currency: currency,
44
+ ...resolveMinMaxFractionDigits(minimumFractionDigits, maximumFractionDigits),
45
+ ...resolveNumberFormattingFlags(flags),
46
+ });
47
+
48
+ return (value) => formatter.format(value);
49
+ });
50
+
51
+ Fmt.registerFactory(["percentage", "p", "%"], (format, minimumFractionDigits, maximumFractionDigits, flags) => {
52
+ let culture = Culture.getNumberCulture();
53
+ let formatter = culture.getFormatter({
54
+ style: "percent",
55
+ ...resolveMinMaxFractionDigits(minimumFractionDigits, maximumFractionDigits),
56
+ ...resolveNumberFormattingFlags(flags),
57
+ });
58
+ return (value) => formatter.format(value);
59
+ });
60
+
61
+ Fmt.registerFactory(["percentSign", "ps"], (format, minimumFractionDigits, maximumFractionDigits, flags) => {
62
+ let culture = Culture.getNumberCulture();
63
+ let formatter = culture.getFormatter({
64
+ style: "percent",
65
+ ...resolveMinMaxFractionDigits(minimumFractionDigits, maximumFractionDigits),
66
+ ...resolveNumberFormattingFlags(flags),
67
+ });
68
+ return (value) => formatter.format(value / 100);
69
+ });
70
+
71
+ Fmt.registerFactory(["date", "d"], (fmt, format = "yyyyMMdd") => {
72
+ let culture = Culture.getDateTimeCulture();
73
+ let formatter = culture.getFormatter(format);
74
+ return (value) => formatter.format(parseDateInvariant(value));
75
+ });
76
+
77
+ Fmt.registerFactory(["time", "t"], (fmt, format = "hhmmss") => {
78
+ let culture = Culture.getDateTimeCulture();
79
+ let formatter = culture.getFormatter(format);
80
+ return (value) => formatter.format(parseDateInvariant(value));
81
+ });
82
+
83
+ Fmt.registerFactory(["datetime", "dt"], (fmt, format = "yyyyMd hhmm") => {
84
+ let culture = Culture.getDateTimeCulture();
85
+ let formatter = culture.getFormatter(format);
86
+ return (value) => formatter.format(parseDateInvariant(value));
87
+ });
88
+
89
+ setGetFormatCacheCallback(() => {
90
+ let cache = getCurrentCultureCache();
91
+ if (!cache.formatCache) cache.formatCache = {};
92
+ return cache.formatCache;
93
+ });
94
+
95
+ setGetExpressionCacheCallback(() => {
96
+ let cache = getCurrentCultureCache();
97
+ if (!cache.exprCache) cache.exprCache = {};
98
+ return cache.exprCache;
99
+ });
100
+
101
+ setGetStringTemplateCacheCallback(() => {
102
+ let cache = getCurrentCultureCache();
103
+ if (!cache.strTplCache) cache.strTplCache = {};
104
+ return cache.strTplCache;
105
+ });
106
+
107
+ GlobalCacheIdentifier.change();
108
+ }
@@ -1,147 +1,147 @@
1
- /*
2
- HoverSync transfers through the context methods for reporting and subscribing to hover data to
3
- its descendants. How this should work is that each component can subscribe and unsubscribe
4
- to a hover channel and receive info about hover changes.
5
- Also, each component should report mouse enter/leave events.
6
- Similar to controllers, hover sync should transcend into child contexts.
7
- */
8
-
9
- import { dummyCallback } from "../util/dummyCallback";
10
- import { parseStyle } from "../util/parseStyle";
11
- import { SubscriberList } from "../util/SubscriberList";
12
- import { Container } from "./Container";
13
- import { PureContainer } from "./PureContainer";
14
- import { VDOM } from "./VDOM";
15
-
16
- export class HoverSync extends PureContainer {
17
- initInstance(context, instance) {
18
- let channels = {};
19
- instance.hoverSync = {
20
- report: (channel, hoverId, active) => {
21
- let ch = channels[channel];
22
- if (!ch) return;
23
- let state = active && hoverId != null;
24
- if (ch.state !== state && (ch.state === hoverId || active)) {
25
- ch.state = state;
26
- ch.subscribers.notify(state);
27
- }
28
- },
29
- subscribe: (channel, callback) => {
30
- let ch = channels[channel];
31
- if (!ch)
32
- ch = channels[channel] = {
33
- subscribers: new SubscriberList(),
34
- state: false,
35
- };
36
- return ch.subscribers.subscribe(callback);
37
- },
38
- };
39
- }
40
-
41
- explore(context, instance) {
42
- context.push("hoverSync", instance.hoverSync);
43
- super.explore(context, instance);
44
- }
45
-
46
- exploreCleanup(context, instance) {
47
- context.pop("hoverSync");
48
- }
49
- }
50
-
51
- class HoverSyncChild extends VDOM.Component {
52
- constructor(props) {
53
- super(props);
54
- this.state = { hover: false };
55
- this.onMouseMove = this.onMouseMove.bind(this);
56
- this.onMouseLeave = this.onMouseLeave.bind(this);
57
- }
58
-
59
- onMouseMove() {
60
- this.props.hoverSync.report(this.props.hoverChannel, this.props.hoverId, true);
61
- }
62
-
63
- onMouseLeave() {
64
- this.props.hoverSync.report(this.props.hoverChannel, this.props.hoverId, false);
65
- }
66
-
67
- compontentWillUnmount() {
68
- this.unsubscribe();
69
- }
70
-
71
- componentDidMount() {
72
- this.unsubscribe = this.props.hoverSync.subscribe(this.props.hoverChannel, (hoverId) => {
73
- let hover = hoverId === this.props.hoverId;
74
- if (hover !== this.state.hover) this.setState({ hover });
75
- });
76
- }
77
-
78
- render() {
79
- return this.props.render({
80
- hover: this.state.hover,
81
- onMouseLeave: this.onMouseLeave,
82
- onMouseMove: this.onMouseMove,
83
- key: "child",
84
- });
85
- }
86
- }
87
-
88
- export function withHoverSync(key, hoverSync, hoverChannel, hoverId, render) {
89
- if (!hoverSync || !hoverChannel || hoverId == null)
90
- return render({ key, hover: false, onMouseLeave: dummyCallback, onMouseMove: dummyCallback });
91
- return (
92
- <HoverSyncChild key={key} hoverSync={hoverSync} hoverChannel={hoverChannel} hoverId={hoverId} render={render} />
93
- );
94
- }
95
-
96
- export class HoverSyncElement extends Container {
97
- declareData(...args) {
98
- super.declareData(...args, {
99
- hoverId: undefined,
100
- hoverClass: { structured: true },
101
- hoverStyle: { structured: true },
102
- });
103
- }
104
-
105
- prepareData(context, instance) {
106
- instance.hoverSync = context.hoverSync;
107
- instance.inSvg = !!context.inSvg;
108
- let { data } = instance;
109
- data.hoverStyle = parseStyle(data.hoverStyle);
110
- super.prepareData(context, instance);
111
- }
112
-
113
- render(context, instance, key) {
114
- let { data, inSvg } = instance;
115
- let { CSS } = this;
116
- let children = this.renderChildren(context, instance);
117
- let eventHandlers = instance.getJsxEventProps();
118
- return withHoverSync(
119
- key,
120
- instance.hoverSync,
121
- this.hoverChannel,
122
- data.hoverId,
123
- ({ hover, onMouseMove, onMouseLeave, key }) => {
124
- let style = {
125
- ...data.style,
126
- ...(hover && data.hoverStyle),
127
- };
128
- return VDOM.createElement(
129
- inSvg ? "g" : "div",
130
- {
131
- key,
132
- className: CSS.expand(data.classNames, CSS.state({ hover }), hover && data.hoverClass),
133
- style,
134
- ...eventHandlers,
135
- onMouseLeave,
136
- onMouseMove,
137
- },
138
- children,
139
- );
140
- },
141
- );
142
- }
143
- }
144
-
145
- HoverSyncElement.prototype.baseClass = "hoversyncelement";
146
- HoverSyncElement.prototype.styled = true;
147
- HoverSyncElement.prototype.hoverChannel = "default";
1
+ /*
2
+ HoverSync transfers through the context methods for reporting and subscribing to hover data to
3
+ its descendants. How this should work is that each component can subscribe and unsubscribe
4
+ to a hover channel and receive info about hover changes.
5
+ Also, each component should report mouse enter/leave events.
6
+ Similar to controllers, hover sync should transcend into child contexts.
7
+ */
8
+
9
+ import { dummyCallback } from "../util/dummyCallback";
10
+ import { parseStyle } from "../util/parseStyle";
11
+ import { SubscriberList } from "../util/SubscriberList";
12
+ import { Container } from "./Container";
13
+ import { PureContainer } from "./PureContainer";
14
+ import { VDOM } from "./VDOM";
15
+
16
+ export class HoverSync extends PureContainer {
17
+ initInstance(context, instance) {
18
+ let channels = {};
19
+ instance.hoverSync = {
20
+ report: (channel, hoverId, active) => {
21
+ let ch = channels[channel];
22
+ if (!ch) return;
23
+ let state = active && hoverId != null;
24
+ if (ch.state !== state && (ch.state === hoverId || active)) {
25
+ ch.state = state;
26
+ ch.subscribers.notify(state);
27
+ }
28
+ },
29
+ subscribe: (channel, callback) => {
30
+ let ch = channels[channel];
31
+ if (!ch)
32
+ ch = channels[channel] = {
33
+ subscribers: new SubscriberList(),
34
+ state: false,
35
+ };
36
+ return ch.subscribers.subscribe(callback);
37
+ },
38
+ };
39
+ }
40
+
41
+ explore(context, instance) {
42
+ context.push("hoverSync", instance.hoverSync);
43
+ super.explore(context, instance);
44
+ }
45
+
46
+ exploreCleanup(context, instance) {
47
+ context.pop("hoverSync");
48
+ }
49
+ }
50
+
51
+ class HoverSyncChild extends VDOM.Component {
52
+ constructor(props) {
53
+ super(props);
54
+ this.state = { hover: false };
55
+ this.onMouseMove = this.onMouseMove.bind(this);
56
+ this.onMouseLeave = this.onMouseLeave.bind(this);
57
+ }
58
+
59
+ onMouseMove() {
60
+ this.props.hoverSync.report(this.props.hoverChannel, this.props.hoverId, true);
61
+ }
62
+
63
+ onMouseLeave() {
64
+ this.props.hoverSync.report(this.props.hoverChannel, this.props.hoverId, false);
65
+ }
66
+
67
+ compontentWillUnmount() {
68
+ this.unsubscribe();
69
+ }
70
+
71
+ componentDidMount() {
72
+ this.unsubscribe = this.props.hoverSync.subscribe(this.props.hoverChannel, (hoverId) => {
73
+ let hover = hoverId === this.props.hoverId;
74
+ if (hover !== this.state.hover) this.setState({ hover });
75
+ });
76
+ }
77
+
78
+ render() {
79
+ return this.props.render({
80
+ hover: this.state.hover,
81
+ onMouseLeave: this.onMouseLeave,
82
+ onMouseMove: this.onMouseMove,
83
+ key: "child",
84
+ });
85
+ }
86
+ }
87
+
88
+ export function withHoverSync(key, hoverSync, hoverChannel, hoverId, render) {
89
+ if (!hoverSync || !hoverChannel || hoverId == null)
90
+ return render({ key, hover: false, onMouseLeave: dummyCallback, onMouseMove: dummyCallback });
91
+ return (
92
+ <HoverSyncChild key={key} hoverSync={hoverSync} hoverChannel={hoverChannel} hoverId={hoverId} render={render} />
93
+ );
94
+ }
95
+
96
+ export class HoverSyncElement extends Container {
97
+ declareData(...args) {
98
+ super.declareData(...args, {
99
+ hoverId: undefined,
100
+ hoverClass: { structured: true },
101
+ hoverStyle: { structured: true },
102
+ });
103
+ }
104
+
105
+ prepareData(context, instance) {
106
+ instance.hoverSync = context.hoverSync;
107
+ instance.inSvg = !!context.inSvg;
108
+ let { data } = instance;
109
+ data.hoverStyle = parseStyle(data.hoverStyle);
110
+ super.prepareData(context, instance);
111
+ }
112
+
113
+ render(context, instance, key) {
114
+ let { data, inSvg } = instance;
115
+ let { CSS } = this;
116
+ let children = this.renderChildren(context, instance);
117
+ let eventHandlers = instance.getJsxEventProps();
118
+ return withHoverSync(
119
+ key,
120
+ instance.hoverSync,
121
+ this.hoverChannel,
122
+ data.hoverId,
123
+ ({ hover, onMouseMove, onMouseLeave, key }) => {
124
+ let style = {
125
+ ...data.style,
126
+ ...(hover && data.hoverStyle),
127
+ };
128
+ return VDOM.createElement(
129
+ inSvg ? "g" : "div",
130
+ {
131
+ key,
132
+ className: CSS.expand(data.classNames, CSS.state({ hover }), hover && data.hoverClass),
133
+ style,
134
+ ...eventHandlers,
135
+ onMouseLeave,
136
+ onMouseMove,
137
+ },
138
+ children,
139
+ );
140
+ },
141
+ );
142
+ }
143
+ }
144
+
145
+ HoverSyncElement.prototype.baseClass = "hoversyncelement";
146
+ HoverSyncElement.prototype.styled = true;
147
+ HoverSyncElement.prototype.hoverChannel = "default";
@@ -1,72 +1,72 @@
1
- import { Record } from "../core";
2
- import { RenderingContext } from "./RenderingContext";
3
- import { View } from "../data/View";
4
- import { Widget } from "./Widget";
5
-
6
- export class Instance<ViewModel = any, Controller = any> {
7
- store: View<ViewModel>;
8
- data: Record;
9
- widget: Widget;
10
- key: number;
11
- id: string;
12
- controller: Controller;
13
- parentOptions: any;
14
- children?: Instance[];
15
-
16
- constructor(widget: Widget, key: string | number, parent?: Instance, store?: View);
17
-
18
- setStore(store: View): void;
19
-
20
- init(context: RenderingContext): void;
21
-
22
- explore(context: RenderingContext): boolean;
23
-
24
- prepare(context: RenderingContext): void;
25
-
26
- cleanup(context: RenderingContext): void;
27
-
28
- render(context: RenderingContext, keyPrefix?: string): JSX.Element | void;
29
-
30
- setState(state: Cx.Record): void;
31
-
32
- set(prop: string, value: any, internal?: boolean);
33
-
34
- definePropertySetter(prop: string, setter: (value: any) => void): boolean;
35
-
36
- /**
37
- * @protected
38
- * @param prop
39
- * @param value
40
- * @returns {boolean}
41
- */
42
- protected doSet(prop: string, value: any): boolean;
43
-
44
- replaceState(state: Cx.Config);
45
-
46
- getInstanceCache(): InstanceCache;
47
-
48
- clearChildrenCache();
49
-
50
- getChild(context: RenderingContext | null, widget: Widget, keyPrefix?: string, store?: View): Instance;
51
-
52
- getDetachedChild(widget: Widget, key: number | string, store?: View): Instance;
53
-
54
- // TODO: check return type
55
- prepareRenderCleanupChild(widget: Widget, store?: View, keyPrefix?: string, options?: object): JSX.Element | void;
56
-
57
- getJsxEventProps(): Cx.Config;
58
-
59
- nestedDataSet(key: string, value: any, dataConfig: Cx.Config): boolean;
60
-
61
- invokeControllerMethod(methodName: string, ...args: any[]);
62
- }
63
-
64
- export class InstanceCache {
65
- constructor(parent: Instance);
66
-
67
- getChild(widget: Widget, store: View, keyPrefix?: string): Instance;
68
-
69
- mark();
70
-
71
- sweep();
72
- }
1
+ import { Record } from "../core";
2
+ import { RenderingContext } from "./RenderingContext";
3
+ import { View } from "../data/View";
4
+ import { Widget } from "./Widget";
5
+
6
+ export class Instance<ViewModel = any, Controller = any> {
7
+ store: View<ViewModel>;
8
+ data: Record;
9
+ widget: Widget;
10
+ key: number;
11
+ id: string;
12
+ controller: Controller;
13
+ parentOptions: any;
14
+ children?: Instance[];
15
+
16
+ constructor(widget: Widget, key: string | number, parent?: Instance, store?: View);
17
+
18
+ setStore(store: View): void;
19
+
20
+ init(context: RenderingContext): void;
21
+
22
+ explore(context: RenderingContext): boolean;
23
+
24
+ prepare(context: RenderingContext): void;
25
+
26
+ cleanup(context: RenderingContext): void;
27
+
28
+ render(context: RenderingContext, keyPrefix?: string): JSX.Element | void;
29
+
30
+ setState(state: Cx.Record): void;
31
+
32
+ set(prop: string, value: any, internal?: boolean);
33
+
34
+ definePropertySetter(prop: string, setter: (value: any) => void): boolean;
35
+
36
+ /**
37
+ * @protected
38
+ * @param prop
39
+ * @param value
40
+ * @returns {boolean}
41
+ */
42
+ protected doSet(prop: string, value: any): boolean;
43
+
44
+ replaceState(state: Cx.Config);
45
+
46
+ getInstanceCache(): InstanceCache;
47
+
48
+ clearChildrenCache();
49
+
50
+ getChild(context: RenderingContext | null, widget: Widget, keyPrefix?: string, store?: View): Instance;
51
+
52
+ getDetachedChild(widget: Widget, key: number | string, store?: View): Instance;
53
+
54
+ // TODO: check return type
55
+ prepareRenderCleanupChild(widget: Widget, store?: View, keyPrefix?: string, options?: object): JSX.Element | void;
56
+
57
+ getJsxEventProps(): Cx.Config;
58
+
59
+ nestedDataSet(key: string, value: any, dataConfig: Cx.Config): boolean;
60
+
61
+ invokeControllerMethod(methodName: string, ...args: any[]);
62
+ }
63
+
64
+ export class InstanceCache {
65
+ constructor(parent: Instance);
66
+
67
+ getChild(widget: Widget, store: View, keyPrefix?: string): Instance;
68
+
69
+ mark();
70
+
71
+ sweep();
72
+ }