cx 24.9.1 → 24.9.2

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 (55) hide show
  1. package/dist/charts.js +22 -25
  2. package/dist/data.js +26 -29
  3. package/dist/manifest.js +775 -775
  4. package/dist/svg.js +59 -56
  5. package/dist/ui.js +51 -52
  6. package/dist/widgets.js +46 -49
  7. package/package.json +32 -32
  8. package/src/charts/Legend.js +151 -151
  9. package/src/charts/PieLabel.js +71 -71
  10. package/src/charts/axis/NumericAxis.js +347 -347
  11. package/src/charts/axis/Stack.js +55 -55
  12. package/src/charts/helpers/PointReducer.js +43 -43
  13. package/src/charts/helpers/SnapPointFinder.js +69 -69
  14. package/src/data/Binding.spec.js +69 -69
  15. package/src/data/StringTemplate.spec.js +105 -105
  16. package/src/data/getAccessor.spec.js +11 -11
  17. package/src/index.scss +6 -6
  18. package/src/svg/Text.d.ts +40 -40
  19. package/src/ui/Culture.d.ts +55 -55
  20. package/src/ui/Culture.js +139 -139
  21. package/src/ui/FocusManager.js +171 -171
  22. package/src/ui/Instance.d.ts +72 -72
  23. package/src/ui/VDOM.d.ts +12 -12
  24. package/src/ui/app/startAppLoop.js +58 -58
  25. package/src/ui/index.d.ts +42 -42
  26. package/src/ui/layout/LabelsTopLayout.js +134 -134
  27. package/src/util/Console.d.ts +4 -4
  28. package/src/util/scss/add-rules.scss +38 -38
  29. package/src/widgets/CxCredit.scss +37 -37
  30. package/src/widgets/List.scss +91 -91
  31. package/src/widgets/drag-drop/DropZone.js +214 -214
  32. package/src/widgets/form/Calendar.scss +196 -196
  33. package/src/widgets/form/ColorField.js +397 -397
  34. package/src/widgets/form/ColorPicker.scss +283 -283
  35. package/src/widgets/form/DateTimeField.js +573 -573
  36. package/src/widgets/form/MonthField.js +516 -516
  37. package/src/widgets/form/MonthPicker.scss +118 -118
  38. package/src/widgets/form/NumberField.js +459 -459
  39. package/src/widgets/form/NumberField.scss +61 -61
  40. package/src/widgets/form/Select.scss +99 -99
  41. package/src/widgets/form/Slider.scss +118 -118
  42. package/src/widgets/form/Switch.scss +140 -140
  43. package/src/widgets/form/TextArea.scss +43 -43
  44. package/src/widgets/form/TextField.js +290 -289
  45. package/src/widgets/form/TextField.scss +55 -55
  46. package/src/widgets/form/UploadButton.d.ts +34 -34
  47. package/src/widgets/grid/TreeNode.scss +88 -88
  48. package/src/widgets/grid/variables.scss +88 -88
  49. package/src/widgets/nav/Menu.scss +74 -74
  50. package/src/widgets/overlay/Dropdown.js +612 -612
  51. package/src/widgets/overlay/FlyweightTooltipTracker.js +39 -39
  52. package/src/widgets/overlay/Tooltip.js +300 -300
  53. package/src/widgets/overlay/Window.js +196 -196
  54. package/src/widgets/overlay/captureMouse.js +124 -124
  55. package/src/widgets/overlay/variables.scss +83 -83
@@ -1,151 +1,151 @@
1
- import { Widget, VDOM } from "../ui/Widget";
2
- import { HtmlElement } from "../widgets/HtmlElement";
3
- import { PureContainer } from "../ui/PureContainer";
4
- import { getShape } from "./shapes";
5
- import { isUndefined } from "../util/isUndefined";
6
- import { isArray } from "../util/isArray";
7
- import { withHoverSync } from "../ui/HoverSync";
8
-
9
- export class Legend extends HtmlElement {
10
- prepareData(context, instance) {
11
- let { data } = instance;
12
- data.stateMods = Object.assign(data.stateMods || {}, {
13
- vertical: this.vertical,
14
- });
15
- super.prepareData(context, instance);
16
- }
17
-
18
- declareData() {
19
- super.declareData(...arguments, {
20
- shape: undefined,
21
- });
22
- }
23
-
24
- isValidHtmlAttribute(attrName) {
25
- switch (attrName) {
26
- case "shapeSize":
27
- case "svgSize":
28
- case "shape":
29
- return false;
30
-
31
- default:
32
- return super.isValidHtmlAttribute(attrName);
33
- }
34
- }
35
-
36
- explore(context, instance) {
37
- if (!context.legends) context.legends = {};
38
-
39
- instance.legends = context.legends;
40
-
41
- context.addLegendEntry = (legendName, entry) => {
42
- if (!legendName) return;
43
-
44
- //case when all legends are scoped and new entry is added outside the scope
45
- if (!context.legends) return;
46
-
47
- let legend = context.legends[legendName];
48
- if (!legend)
49
- legend = context.legends[legendName] = {
50
- entries: [],
51
- names: {},
52
- };
53
-
54
- if (!legend.names[entry.name]) {
55
- legend.entries.push(entry);
56
- legend.names[entry.name] = entry;
57
- }
58
- };
59
-
60
- super.explore(context, instance);
61
- }
62
-
63
- renderChildren(context, instance) {
64
- const CSS = this.CSS;
65
-
66
- let entries = instance.legends[this.name] && instance.legends[this.name].entries,
67
- list;
68
-
69
- if (isArray(entries) && entries.length > 0) {
70
- list = (
71
- <div key="wrap" className={CSS.element(this.baseClass, "wrap")}>
72
- {entries.map((e, i) =>
73
- withHoverSync(i, e.hoverSync, e.hoverChannel, e.hoverId, ({ onMouseMove, onMouseLeave, hover }) => (
74
- <div
75
- key={i}
76
- className={CSS.element(this.baseClass, "entry", {
77
- "color-root": true,
78
- hover,
79
- disabled: e.disabled,
80
- selected: e.selected,
81
- })}
82
- onClick={e.onClick}
83
- onMouseMove={onMouseMove}
84
- onMouseLeave={onMouseLeave}
85
- >
86
- {this.renderShape(e, instance.data.shape)}
87
- {e.name}
88
- </div>
89
- )),
90
- )}
91
- </div>
92
- );
93
- }
94
-
95
- return [list, super.renderChildren(context, instance)];
96
- }
97
-
98
- renderShape(entry, legendEntriesShape) {
99
- const className = this.CSS.element(this.baseClass, "shape", {
100
- [`color-${entry.colorIndex}`]: entry.colorIndex != null && (isUndefined(entry.active) || entry.active),
101
- });
102
- const shape = getShape(legendEntriesShape || entry.shape || "square");
103
-
104
- return (
105
- <svg
106
- className={this.CSS.element(this.baseClass, "svg")}
107
- style={{
108
- width: `${this.svgSize}px`,
109
- height: `${this.svgSize}px`,
110
- marginTop: `${-this.svgSize / 2}px`,
111
- }}
112
- >
113
- {shape(this.svgSize / 2, this.svgSize / 2, entry.shapeSize || this.shapeSize, {
114
- style: entry.style,
115
- className: className,
116
- })}
117
- </svg>
118
- );
119
- }
120
- }
121
-
122
- Legend.prototype.name = "legend";
123
- Legend.prototype.baseClass = "legend";
124
- Legend.prototype.vertical = false;
125
- Legend.prototype.memoize = false;
126
- Legend.prototype.shapeSize = 18;
127
- Legend.prototype.shape = null;
128
- Legend.prototype.svgSize = 20;
129
-
130
- Widget.alias("legend", Legend);
131
-
132
- Legend.Scope = class extends PureContainer {
133
- explore(context, instance) {
134
- context.push("legends", (instance.legends = {}));
135
- super.explore(context, instance);
136
- }
137
-
138
- exploreCleanup(context, instance) {
139
- context.pop("legends");
140
- }
141
-
142
- prepare(context, instance) {
143
- context.push("legends", instance.legends);
144
- }
145
-
146
- prepareCleanup(context, instance) {
147
- context.pop("legends");
148
- }
149
- };
150
-
151
- export const LegendScope = Legend.Scope;
1
+ import { Widget, VDOM } from "../ui/Widget";
2
+ import { HtmlElement } from "../widgets/HtmlElement";
3
+ import { PureContainer } from "../ui/PureContainer";
4
+ import { getShape } from "./shapes";
5
+ import { isUndefined } from "../util/isUndefined";
6
+ import { isArray } from "../util/isArray";
7
+ import { withHoverSync } from "../ui/HoverSync";
8
+
9
+ export class Legend extends HtmlElement {
10
+ prepareData(context, instance) {
11
+ let { data } = instance;
12
+ data.stateMods = Object.assign(data.stateMods || {}, {
13
+ vertical: this.vertical,
14
+ });
15
+ super.prepareData(context, instance);
16
+ }
17
+
18
+ declareData() {
19
+ super.declareData(...arguments, {
20
+ shape: undefined,
21
+ });
22
+ }
23
+
24
+ isValidHtmlAttribute(attrName) {
25
+ switch (attrName) {
26
+ case "shapeSize":
27
+ case "svgSize":
28
+ case "shape":
29
+ return false;
30
+
31
+ default:
32
+ return super.isValidHtmlAttribute(attrName);
33
+ }
34
+ }
35
+
36
+ explore(context, instance) {
37
+ if (!context.legends) context.legends = {};
38
+
39
+ instance.legends = context.legends;
40
+
41
+ context.addLegendEntry = (legendName, entry) => {
42
+ if (!legendName) return;
43
+
44
+ //case when all legends are scoped and new entry is added outside the scope
45
+ if (!context.legends) return;
46
+
47
+ let legend = context.legends[legendName];
48
+ if (!legend)
49
+ legend = context.legends[legendName] = {
50
+ entries: [],
51
+ names: {},
52
+ };
53
+
54
+ if (!legend.names[entry.name]) {
55
+ legend.entries.push(entry);
56
+ legend.names[entry.name] = entry;
57
+ }
58
+ };
59
+
60
+ super.explore(context, instance);
61
+ }
62
+
63
+ renderChildren(context, instance) {
64
+ const CSS = this.CSS;
65
+
66
+ let entries = instance.legends[this.name] && instance.legends[this.name].entries,
67
+ list;
68
+
69
+ if (isArray(entries) && entries.length > 0) {
70
+ list = (
71
+ <div key="wrap" className={CSS.element(this.baseClass, "wrap")}>
72
+ {entries.map((e, i) =>
73
+ withHoverSync(i, e.hoverSync, e.hoverChannel, e.hoverId, ({ onMouseMove, onMouseLeave, hover }) => (
74
+ <div
75
+ key={i}
76
+ className={CSS.element(this.baseClass, "entry", {
77
+ "color-root": true,
78
+ hover,
79
+ disabled: e.disabled,
80
+ selected: e.selected,
81
+ })}
82
+ onClick={e.onClick}
83
+ onMouseMove={onMouseMove}
84
+ onMouseLeave={onMouseLeave}
85
+ >
86
+ {this.renderShape(e, instance.data.shape)}
87
+ {e.name}
88
+ </div>
89
+ )),
90
+ )}
91
+ </div>
92
+ );
93
+ }
94
+
95
+ return [list, super.renderChildren(context, instance)];
96
+ }
97
+
98
+ renderShape(entry, legendEntriesShape) {
99
+ const className = this.CSS.element(this.baseClass, "shape", {
100
+ [`color-${entry.colorIndex}`]: entry.colorIndex != null && (isUndefined(entry.active) || entry.active),
101
+ });
102
+ const shape = getShape(legendEntriesShape || entry.shape || "square");
103
+
104
+ return (
105
+ <svg
106
+ className={this.CSS.element(this.baseClass, "svg")}
107
+ style={{
108
+ width: `${this.svgSize}px`,
109
+ height: `${this.svgSize}px`,
110
+ marginTop: `${-this.svgSize / 2}px`,
111
+ }}
112
+ >
113
+ {shape(this.svgSize / 2, this.svgSize / 2, entry.shapeSize || this.shapeSize, {
114
+ style: entry.style,
115
+ className: className,
116
+ })}
117
+ </svg>
118
+ );
119
+ }
120
+ }
121
+
122
+ Legend.prototype.name = "legend";
123
+ Legend.prototype.baseClass = "legend";
124
+ Legend.prototype.vertical = false;
125
+ Legend.prototype.memoize = false;
126
+ Legend.prototype.shapeSize = 18;
127
+ Legend.prototype.shape = null;
128
+ Legend.prototype.svgSize = 20;
129
+
130
+ Widget.alias("legend", Legend);
131
+
132
+ Legend.Scope = class extends PureContainer {
133
+ explore(context, instance) {
134
+ context.push("legends", (instance.legends = {}));
135
+ super.explore(context, instance);
136
+ }
137
+
138
+ exploreCleanup(context, instance) {
139
+ context.pop("legends");
140
+ }
141
+
142
+ prepare(context, instance) {
143
+ context.push("legends", instance.legends);
144
+ }
145
+
146
+ prepareCleanup(context, instance) {
147
+ context.pop("legends");
148
+ }
149
+ };
150
+
151
+ export const LegendScope = Legend.Scope;
@@ -1,71 +1,71 @@
1
- import { VDOM } from "../ui/Widget";
2
- import { BoundedObject } from "../svg/BoundedObject";
3
- import { Rect } from "../svg/util/Rect";
4
- import { parseStyle } from "../util/parseStyle";
5
-
6
- export class PieLabel extends BoundedObject {
7
- init() {
8
- this.lineStyle = parseStyle(this.lineStyle);
9
- super.init();
10
- }
11
-
12
- declareData(...args) {
13
- super.declareData(...args, {
14
- distance: undefined,
15
- lineStyle: { structured: true },
16
- lineStroke: undefined,
17
- lineClass: { structured: true },
18
- lineColorIndex: undefined,
19
- });
20
- }
21
-
22
- calculateBounds(context, instance) {
23
- var { data } = instance;
24
- var bounds = Rect.add(Rect.add(Rect.multiply(instance.parentRect, data.anchors), data.offset), data.margin);
25
- instance.originalBounds = bounds;
26
- instance.actualBounds = context.placePieLabel(bounds, data.distance);
27
- return new Rect({ t: 0, r: bounds.width(), b: bounds.height(), l: 0 });
28
- }
29
-
30
- prepare(context, instance) {
31
- super.prepare(context, instance);
32
- if (!context.registerPieLabel)
33
- throw new Error("PieLabel components are allowed only within PieLabelsContainer components.");
34
- let right = instance.parentRect.r > instance.parentRect.l;
35
- context.push("textDirection", right ? "right" : "left");
36
- context.registerPieLabel(instance);
37
- }
38
-
39
- prepareCleanup(context, instance) {
40
- context.pop("textDirection");
41
- }
42
-
43
- render(context, instance, key) {
44
- let { originalBounds, actualBounds, data } = instance;
45
-
46
- return (
47
- <g key={key} className={data.classNames}>
48
- <line
49
- className={this.CSS.element(
50
- this.baseClass,
51
- "line",
52
- data.lineColorIndex != null && "color-" + data.lineColorIndex
53
- )}
54
- x1={actualBounds.l < originalBounds.l ? actualBounds.r : actualBounds.l}
55
- y1={(actualBounds.t + actualBounds.b) / 2}
56
- x2={(originalBounds.l + originalBounds.r) / 2}
57
- y2={(originalBounds.t + originalBounds.b) / 2}
58
- stroke={data.lineStroke}
59
- style={data.lineStyle}
60
- />
61
- <g transform={`translate(${instance.actualBounds.l} ${instance.actualBounds.t})`}>
62
- {this.renderChildren(context, instance)}
63
- </g>
64
- </g>
65
- );
66
- }
67
- }
68
-
69
- PieLabel.prototype.distance = 100;
70
- PieLabel.prototype.baseClass = "pielabel";
71
- PieLabel.prototype.styled = true;
1
+ import { VDOM } from "../ui/Widget";
2
+ import { BoundedObject } from "../svg/BoundedObject";
3
+ import { Rect } from "../svg/util/Rect";
4
+ import { parseStyle } from "../util/parseStyle";
5
+
6
+ export class PieLabel extends BoundedObject {
7
+ init() {
8
+ this.lineStyle = parseStyle(this.lineStyle);
9
+ super.init();
10
+ }
11
+
12
+ declareData(...args) {
13
+ super.declareData(...args, {
14
+ distance: undefined,
15
+ lineStyle: { structured: true },
16
+ lineStroke: undefined,
17
+ lineClass: { structured: true },
18
+ lineColorIndex: undefined,
19
+ });
20
+ }
21
+
22
+ calculateBounds(context, instance) {
23
+ var { data } = instance;
24
+ var bounds = Rect.add(Rect.add(Rect.multiply(instance.parentRect, data.anchors), data.offset), data.margin);
25
+ instance.originalBounds = bounds;
26
+ instance.actualBounds = context.placePieLabel(bounds, data.distance);
27
+ return new Rect({ t: 0, r: bounds.width(), b: bounds.height(), l: 0 });
28
+ }
29
+
30
+ prepare(context, instance) {
31
+ super.prepare(context, instance);
32
+ if (!context.registerPieLabel)
33
+ throw new Error("PieLabel components are allowed only within PieLabelsContainer components.");
34
+ let right = instance.parentRect.r > instance.parentRect.l;
35
+ context.push("textDirection", right ? "right" : "left");
36
+ context.registerPieLabel(instance);
37
+ }
38
+
39
+ prepareCleanup(context, instance) {
40
+ context.pop("textDirection");
41
+ }
42
+
43
+ render(context, instance, key) {
44
+ let { originalBounds, actualBounds, data } = instance;
45
+
46
+ return (
47
+ <g key={key} className={data.classNames}>
48
+ <line
49
+ className={this.CSS.element(
50
+ this.baseClass,
51
+ "line",
52
+ data.lineColorIndex != null && "color-" + data.lineColorIndex
53
+ )}
54
+ x1={actualBounds.l < originalBounds.l ? actualBounds.r : actualBounds.l}
55
+ y1={(actualBounds.t + actualBounds.b) / 2}
56
+ x2={(originalBounds.l + originalBounds.r) / 2}
57
+ y2={(originalBounds.t + originalBounds.b) / 2}
58
+ stroke={data.lineStroke}
59
+ style={data.lineStyle}
60
+ />
61
+ <g transform={`translate(${instance.actualBounds.l} ${instance.actualBounds.t})`}>
62
+ {this.renderChildren(context, instance)}
63
+ </g>
64
+ </g>
65
+ );
66
+ }
67
+ }
68
+
69
+ PieLabel.prototype.distance = 100;
70
+ PieLabel.prototype.baseClass = "pielabel";
71
+ PieLabel.prototype.styled = true;