cx 24.9.4 → 24.10.0

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 (71) hide show
  1. package/dist/charts.css +19 -16
  2. package/dist/charts.js +127 -94
  3. package/dist/data.js +29 -26
  4. package/dist/manifest.js +692 -692
  5. package/dist/svg.js +56 -59
  6. package/dist/ui.js +52 -51
  7. package/dist/widgets.js +44 -40
  8. package/package.json +32 -32
  9. package/src/charts/Legend.js +49 -33
  10. package/src/charts/Legend.scss +40 -42
  11. package/src/charts/LegendEntry.js +120 -121
  12. package/src/charts/LegendEntry.scss +27 -31
  13. package/src/charts/PieLabel.js +71 -71
  14. package/src/charts/axis/NumericAxis.js +347 -347
  15. package/src/charts/axis/Stack.js +55 -55
  16. package/src/charts/helpers/PointReducer.js +43 -43
  17. package/src/charts/helpers/SnapPointFinder.js +69 -69
  18. package/src/data/Binding.spec.js +69 -69
  19. package/src/data/Expression.js +221 -221
  20. package/src/data/Expression.spec.js +184 -184
  21. package/src/data/StringTemplate.spec.js +105 -105
  22. package/src/data/getAccessor.spec.js +11 -11
  23. package/src/index.scss +6 -6
  24. package/src/svg/Text.d.ts +40 -40
  25. package/src/ui/Culture.d.ts +55 -55
  26. package/src/ui/Culture.js +139 -139
  27. package/src/ui/FocusManager.js +171 -171
  28. package/src/ui/Instance.d.ts +72 -72
  29. package/src/ui/VDOM.d.ts +12 -12
  30. package/src/ui/app/startAppLoop.js +58 -58
  31. package/src/ui/index.d.ts +42 -42
  32. package/src/ui/layout/LabelsTopLayout.js +134 -134
  33. package/src/util/Console.d.ts +4 -4
  34. package/src/util/index.d.ts +51 -51
  35. package/src/util/index.js +54 -54
  36. package/src/util/isValidIdentifierName.d.ts +1 -1
  37. package/src/util/isValidIdentifierName.js +5 -5
  38. package/src/util/isValidIdentifierName.spec.js +33 -33
  39. package/src/util/scss/add-rules.scss +38 -38
  40. package/src/widgets/CxCredit.scss +37 -37
  41. package/src/widgets/HighlightedSearchText.js +36 -36
  42. package/src/widgets/HighlightedSearchText.scss +18 -18
  43. package/src/widgets/List.scss +91 -91
  44. package/src/widgets/drag-drop/DropZone.js +214 -214
  45. package/src/widgets/form/Calendar.scss +196 -196
  46. package/src/widgets/form/ColorField.js +397 -397
  47. package/src/widgets/form/ColorPicker.scss +283 -283
  48. package/src/widgets/form/DateTimeField.js +573 -573
  49. package/src/widgets/form/LookupField.d.ts +179 -179
  50. package/src/widgets/form/MonthField.js +516 -516
  51. package/src/widgets/form/MonthPicker.scss +118 -118
  52. package/src/widgets/form/NumberField.js +459 -459
  53. package/src/widgets/form/NumberField.scss +61 -61
  54. package/src/widgets/form/Select.scss +99 -99
  55. package/src/widgets/form/Slider.scss +118 -118
  56. package/src/widgets/form/Switch.scss +140 -140
  57. package/src/widgets/form/TextArea.scss +43 -43
  58. package/src/widgets/form/TextField.js +290 -290
  59. package/src/widgets/form/TextField.scss +55 -55
  60. package/src/widgets/form/UploadButton.d.ts +34 -34
  61. package/src/widgets/form/variables.scss +353 -353
  62. package/src/widgets/grid/TreeNode.scss +88 -88
  63. package/src/widgets/grid/variables.scss +88 -88
  64. package/src/widgets/nav/Menu.scss +74 -74
  65. package/src/widgets/overlay/Dropdown.js +612 -612
  66. package/src/widgets/overlay/FlyweightTooltipTracker.js +39 -39
  67. package/src/widgets/overlay/Tooltip.js +300 -300
  68. package/src/widgets/overlay/Window.js +196 -196
  69. package/src/widgets/overlay/captureMouse.js +124 -124
  70. package/src/widgets/overlay/variables.scss +83 -83
  71. package/src/widgets/variables.scss +144 -144
package/src/widgets/overlay/variables.scss CHANGED
@@ -1,83 +1,83 @@
1
- // TOOLTIP
2
- $cx-tooltip-background-color: white !default;
3
- $cx-tooltip-border-color: #d5d5d5 !default;
4
- $cx-tooltip-border-width: 1px !default;
5
- $cx-tooltip-border-radius: 5px !default;
6
- $cx-tooltip-arrow-size: 5px !default;
7
- $cx-tooltip-color: null !default;
8
- $cx-tooltip-padding: 10px !default;
9
-
10
- $cx-tooltip-background-color-error: white !default;
11
- $cx-tooltip-border-color-error: #e63001 !default;
12
- $cx-tooltip-color-error: null !default;
13
-
14
- // DROPDOWN
15
- $cx-default-dropdown-color: $cx-default-color !default;
16
- $cx-default-dropdown-background-color: white !default;
17
- $cx-default-dropdown-arrow-size: 6px !default;
18
- $cx-default-dropdown-arrow-offset: 16px !default;
19
-
20
- $cx-dropdown-styles: (
21
- color: $cx-default-dropdown-color,
22
- background-color: $cx-default-dropdown-background-color,
23
- border-radius: $cx-default-border-radius,
24
- border-color: $cx-default-border-color,
25
- border-width: 0,
26
- box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.29),
27
- white-space: normal,
28
- font-weight: normal,
29
- font-size: $cx-default-font-size,
30
- text-align: left,
31
- line-height: normal,
32
- ) !default;
33
-
34
- // TOAST
35
- $cx-default-toast-color: $cx-default-color !default;
36
- $cx-default-toast-background-color: rgb(255, 255, 255) !default;
37
- $cx-default-toast-border-width: 0 !default;
38
- $cx-default-toast-border-color: rgba(255, 255, 255, 0) !default;
39
- $cx-default-toast-box-shadow: 0 0 5px 1px rgba(128, 128, 128, 0.3) !default;
40
- $cx-default-toast-padding: 10px !default;
41
-
42
- $cx-toast-mods: (
43
- warning: (
44
- default: (
45
- color: #fff,
46
- background-color: #f09037,
47
- ),
48
- ),
49
- primary: (
50
- default: (
51
- color: #fff,
52
- background-color: #1f99f8,
53
- ),
54
- ),
55
- success: (
56
- default: (
57
- color: #fff,
58
- background-color: #5cb85c,
59
- ),
60
- ),
61
- error: (
62
- default: (
63
- color: #fff,
64
- background-color: #d9534f,
65
- ),
66
- ),
67
- ) !default;
68
-
69
- // WINDOW
70
- @import "Window.variables";
71
-
72
- $cx-dependencies: map-merge(
73
- $cx-dependencies,
74
- (
75
- "cx/widgets/Overlay": "cx/widgets/captureMouse",
76
- "cx/widgets/Dropdown": "cx/widgets/Overlay",
77
- "cx/widgets/Window": "cx/widgets/Overlay",
78
- "cx/widgets/Tooltip": "cx/widgets/Dropdown",
79
- "cx/widgets/enableMsgBoxAlerts": "cx/widgets/MsgBox",
80
- "cx/widgets/MsgBox": "cx/widgets/Window" "cx/widgets/FlexRow",
81
- "cx/widgets/Toast": "cx/widgets/Overlay",
82
- )
83
- );
1
+ // TOOLTIP
2
+ $cx-tooltip-background-color: white !default;
3
+ $cx-tooltip-border-color: #d5d5d5 !default;
4
+ $cx-tooltip-border-width: 1px !default;
5
+ $cx-tooltip-border-radius: 5px !default;
6
+ $cx-tooltip-arrow-size: 5px !default;
7
+ $cx-tooltip-color: null !default;
8
+ $cx-tooltip-padding: 10px !default;
9
+
10
+ $cx-tooltip-background-color-error: white !default;
11
+ $cx-tooltip-border-color-error: #e63001 !default;
12
+ $cx-tooltip-color-error: null !default;
13
+
14
+ // DROPDOWN
15
+ $cx-default-dropdown-color: $cx-default-color !default;
16
+ $cx-default-dropdown-background-color: white !default;
17
+ $cx-default-dropdown-arrow-size: 6px !default;
18
+ $cx-default-dropdown-arrow-offset: 16px !default;
19
+
20
+ $cx-dropdown-styles: (
21
+ color: $cx-default-dropdown-color,
22
+ background-color: $cx-default-dropdown-background-color,
23
+ border-radius: $cx-default-border-radius,
24
+ border-color: $cx-default-border-color,
25
+ border-width: 0,
26
+ box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.29),
27
+ white-space: normal,
28
+ font-weight: normal,
29
+ font-size: $cx-default-font-size,
30
+ text-align: left,
31
+ line-height: normal,
32
+ ) !default;
33
+
34
+ // TOAST
35
+ $cx-default-toast-color: $cx-default-color !default;
36
+ $cx-default-toast-background-color: rgb(255, 255, 255) !default;
37
+ $cx-default-toast-border-width: 0 !default;
38
+ $cx-default-toast-border-color: rgba(255, 255, 255, 0) !default;
39
+ $cx-default-toast-box-shadow: 0 0 5px 1px rgba(128, 128, 128, 0.3) !default;
40
+ $cx-default-toast-padding: 10px !default;
41
+
42
+ $cx-toast-mods: (
43
+ warning: (
44
+ default: (
45
+ color: #fff,
46
+ background-color: #f09037,
47
+ ),
48
+ ),
49
+ primary: (
50
+ default: (
51
+ color: #fff,
52
+ background-color: #1f99f8,
53
+ ),
54
+ ),
55
+ success: (
56
+ default: (
57
+ color: #fff,
58
+ background-color: #5cb85c,
59
+ ),
60
+ ),
61
+ error: (
62
+ default: (
63
+ color: #fff,
64
+ background-color: #d9534f,
65
+ ),
66
+ ),
67
+ ) !default;
68
+
69
+ // WINDOW
70
+ @import "Window.variables";
71
+
72
+ $cx-dependencies: map-merge(
73
+ $cx-dependencies,
74
+ (
75
+ "cx/widgets/Overlay": "cx/widgets/captureMouse",
76
+ "cx/widgets/Dropdown": "cx/widgets/Overlay",
77
+ "cx/widgets/Window": "cx/widgets/Overlay",
78
+ "cx/widgets/Tooltip": "cx/widgets/Dropdown",
79
+ "cx/widgets/enableMsgBoxAlerts": "cx/widgets/MsgBox",
80
+ "cx/widgets/MsgBox": "cx/widgets/Window" "cx/widgets/FlexRow",
81
+ "cx/widgets/Toast": "cx/widgets/Overlay",
82
+ )
83
+ );
package/src/widgets/variables.scss CHANGED
@@ -1,144 +1,144 @@
1
- // Padding
2
- $cx-default-padding-extra-small: 3px !default;
3
- $cx-default-padding-small: 5px !default;
4
- $cx-default-padding-medium: 10px !default;
5
- $cx-default-padding-large: 15px !default;
6
- $cx-default-padding-extra-large: 20px !default;
7
-
8
- $cx-pad-size: (
9
- xsmall: $cx-default-padding-extra-small,
10
- small: $cx-default-padding-small,
11
- medium: $cx-default-padding-medium,
12
- large: $cx-default-padding-large,
13
- xlarge: $cx-default-padding-extra-large,
14
- ) !default;
15
-
16
- @import "form/variables";
17
- @import "grid/variables";
18
- @import "nav/variables";
19
- @import "overlay/variables";
20
- @import "drag-drop/variables";
21
- @import "Button.variables";
22
-
23
- // HEADING
24
- $cx-caption-style-map: () !default;
25
-
26
- $cx-caption-level-style-map: (
27
- 1: (
28
- margin: 0,
29
- padding: 0,
30
- ),
31
- 2: (
32
- margin: 0,
33
- padding: 0,
34
- ),
35
- 3: (
36
- margin: 0,
37
- padding: 0,
38
- ),
39
- 4: (
40
- margin: 0,
41
- padding: 0,
42
- ),
43
- 5: (
44
- margin: 0,
45
- padding: 0,
46
- ),
47
- 6: (
48
- margin: 0,
49
- padding: 0,
50
- ),
51
- ) !default;
52
-
53
- // SECTION
54
- $cx-section-styles: () !default;
55
-
56
- $cx-section-mods: (
57
- card: (
58
- default: (
59
- background-color: rgba(255, 255, 255, 0.9),
60
- border-radius: 3px,
61
- ),
62
- ),
63
- warning: (
64
- default: (
65
- color: #fff,
66
- background-color: #f09037,
67
- border-radius: 3px,
68
- ),
69
- ),
70
- primary: (
71
- default: (
72
- color: #fff,
73
- background-color: #1f99f8,
74
- border-radius: 3px,
75
- ),
76
- ),
77
- success: (
78
- default: (
79
- color: #fff,
80
- background-color: #5cb85c,
81
- border-radius: 3px,
82
- ),
83
- ),
84
- error: (
85
- default: (
86
- color: #fff,
87
- background-color: #d9534f,
88
- border-radius: 3px,
89
- ),
90
- ),
91
- ) !default;
92
-
93
- // ProgressBar
94
- $cx-default-progressbar-width: 180px !default;
95
- $cx-default-progressbar-height: 24px !default;
96
- $cx-default-progressbar-font-size: smaller !default;
97
- $cx-default-progressbar-color: $cx-default-color !default;
98
- $cx-default-progressbar-background-color: rgba(#fff, 0.5) !default;
99
- $cx-default-progressbar-border-width: 1px !default;
100
- $cx-default-progressbar-border-color: #98d4ff !default;
101
- $cx-default-progressbar-border-radius: 0 !default;
102
-
103
- $cx-default-progressbar-indicator-background-color: rgba(#98d4ff, 0.8) !default;
104
-
105
- $cx-progressbar-state-style-map: (
106
- default: (
107
- position: relative,
108
- width: $cx-default-progressbar-width,
109
- min-height: $cx-default-progressbar-height,
110
- background-color: $cx-default-progressbar-background-color,
111
- border-style: solid,
112
- border-color: $cx-default-progressbar-border-color,
113
- border-width: $cx-default-progressbar-border-width,
114
- border-radius: $cx-default-progressbar-border-radius,
115
- font-size: $cx-default-progressbar-font-size,
116
- text-align: center,
117
- line-height: $cx-default-progressbar-height,
118
- ),
119
- disabled: (
120
- opacity: 0.2,
121
- ),
122
- );
123
-
124
- $cx-progressbar-mods: ();
125
-
126
- $cx-highlightedsearchtext-style-map: (
127
- font-weight: bold,
128
- ) !default;
129
-
130
- // for backward compatibility
131
- .cxm-well {
132
- @extend .cxm-card !optional;
133
- }
134
-
135
- $cx-dependencies: map-merge(
136
- $cx-dependencies,
137
- (
138
- "cx/widgets/FlexRow": "cx/widgets/FlexBox",
139
- "cx/widgets/FlexCol": "cx/widgets/FlexBox",
140
- "cx/widgets/CxCredit": "cx/widgets/Tooltip",
141
- "cx/widgets/Button": "cx/widgets/HtmlElement",
142
- "cx/widgets/HtmlElement": "cx/widgets/Tooltip",
143
- )
144
- );
1
+ // Padding
2
+ $cx-default-padding-extra-small: 3px !default;
3
+ $cx-default-padding-small: 5px !default;
4
+ $cx-default-padding-medium: 10px !default;
5
+ $cx-default-padding-large: 15px !default;
6
+ $cx-default-padding-extra-large: 20px !default;
7
+
8
+ $cx-pad-size: (
9
+ xsmall: $cx-default-padding-extra-small,
10
+ small: $cx-default-padding-small,
11
+ medium: $cx-default-padding-medium,
12
+ large: $cx-default-padding-large,
13
+ xlarge: $cx-default-padding-extra-large,
14
+ ) !default;
15
+
16
+ @import "form/variables";
17
+ @import "grid/variables";
18
+ @import "nav/variables";
19
+ @import "overlay/variables";
20
+ @import "drag-drop/variables";
21
+ @import "Button.variables";
22
+
23
+ // HEADING
24
+ $cx-caption-style-map: () !default;
25
+
26
+ $cx-caption-level-style-map: (
27
+ 1: (
28
+ margin: 0,
29
+ padding: 0,
30
+ ),
31
+ 2: (
32
+ margin: 0,
33
+ padding: 0,
34
+ ),
35
+ 3: (
36
+ margin: 0,
37
+ padding: 0,
38
+ ),
39
+ 4: (
40
+ margin: 0,
41
+ padding: 0,
42
+ ),
43
+ 5: (
44
+ margin: 0,
45
+ padding: 0,
46
+ ),
47
+ 6: (
48
+ margin: 0,
49
+ padding: 0,
50
+ ),
51
+ ) !default;
52
+
53
+ // SECTION
54
+ $cx-section-styles: () !default;
55
+
56
+ $cx-section-mods: (
57
+ card: (
58
+ default: (
59
+ background-color: rgba(255, 255, 255, 0.9),
60
+ border-radius: 3px,
61
+ ),
62
+ ),
63
+ warning: (
64
+ default: (
65
+ color: #fff,
66
+ background-color: #f09037,
67
+ border-radius: 3px,
68
+ ),
69
+ ),
70
+ primary: (
71
+ default: (
72
+ color: #fff,
73
+ background-color: #1f99f8,
74
+ border-radius: 3px,
75
+ ),
76
+ ),
77
+ success: (
78
+ default: (
79
+ color: #fff,
80
+ background-color: #5cb85c,
81
+ border-radius: 3px,
82
+ ),
83
+ ),
84
+ error: (
85
+ default: (
86
+ color: #fff,
87
+ background-color: #d9534f,
88
+ border-radius: 3px,
89
+ ),
90
+ ),
91
+ ) !default;
92
+
93
+ // ProgressBar
94
+ $cx-default-progressbar-width: 180px !default;
95
+ $cx-default-progressbar-height: 24px !default;
96
+ $cx-default-progressbar-font-size: smaller !default;
97
+ $cx-default-progressbar-color: $cx-default-color !default;
98
+ $cx-default-progressbar-background-color: rgba(#fff, 0.5) !default;
99
+ $cx-default-progressbar-border-width: 1px !default;
100
+ $cx-default-progressbar-border-color: #98d4ff !default;
101
+ $cx-default-progressbar-border-radius: 0 !default;
102
+
103
+ $cx-default-progressbar-indicator-background-color: rgba(#98d4ff, 0.8) !default;
104
+
105
+ $cx-progressbar-state-style-map: (
106
+ default: (
107
+ position: relative,
108
+ width: $cx-default-progressbar-width,
109
+ min-height: $cx-default-progressbar-height,
110
+ background-color: $cx-default-progressbar-background-color,
111
+ border-style: solid,
112
+ border-color: $cx-default-progressbar-border-color,
113
+ border-width: $cx-default-progressbar-border-width,
114
+ border-radius: $cx-default-progressbar-border-radius,
115
+ font-size: $cx-default-progressbar-font-size,
116
+ text-align: center,
117
+ line-height: $cx-default-progressbar-height,
118
+ ),
119
+ disabled: (
120
+ opacity: 0.2,
121
+ ),
122
+ );
123
+
124
+ $cx-progressbar-mods: ();
125
+
126
+ $cx-highlightedsearchtext-style-map: (
127
+ font-weight: bold,
128
+ ) !default;
129
+
130
+ // for backward compatibility
131
+ .cxm-well {
132
+ @extend .cxm-card !optional;
133
+ }
134
+
135
+ $cx-dependencies: map-merge(
136
+ $cx-dependencies,
137
+ (
138
+ "cx/widgets/FlexRow": "cx/widgets/FlexBox",
139
+ "cx/widgets/FlexCol": "cx/widgets/FlexBox",
140
+ "cx/widgets/CxCredit": "cx/widgets/Tooltip",
141
+ "cx/widgets/Button": "cx/widgets/HtmlElement",
142
+ "cx/widgets/HtmlElement": "cx/widgets/Tooltip",
143
+ )
144
+ );