cx 26.3.3 → 26.3.5

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 (65) hide show
  1. package/build/charts/helpers/SnapPointFinder.d.ts +2 -2
  2. package/build/charts/helpers/SnapPointFinder.d.ts.map +1 -1
  3. package/build/charts/helpers/ValueAtFinder.d.ts +4 -4
  4. package/build/charts/helpers/ValueAtFinder.d.ts.map +1 -1
  5. package/build/charts/helpers/ValueAtFinder.js +5 -2
  6. package/build/data/createAccessorModelProxy.d.ts +11 -6
  7. package/build/data/createAccessorModelProxy.d.ts.map +1 -1
  8. package/build/data/createAccessorModelProxy.js +3 -1
  9. package/build/jsx-runtime.d.ts +1 -2
  10. package/build/jsx-runtime.d.ts.map +1 -1
  11. package/build/ui/createFunctionalComponent.d.ts +1 -4
  12. package/build/ui/createFunctionalComponent.d.ts.map +1 -1
  13. package/build/widgets/form/Calendar.d.ts +0 -1
  14. package/build/widgets/form/Calendar.d.ts.map +1 -1
  15. package/build/widgets/form/Calendar.js +22 -14
  16. package/build/widgets/form/TimeList.d.ts +1 -3
  17. package/build/widgets/form/TimeList.d.ts.map +1 -1
  18. package/build/widgets/index.d.ts +1 -3
  19. package/build/widgets/index.d.ts.map +1 -1
  20. package/build/widgets/index.js +1 -3
  21. package/build/widgets/overlay/Overlay.d.ts +1 -1
  22. package/build/widgets/overlay/Overlay.d.ts.map +1 -1
  23. package/build/widgets/overlay/Overlay.js +19 -10
  24. package/build/widgets/overlay/Window.d.ts.map +1 -1
  25. package/build/widgets/overlay/Window.js +11 -5
  26. package/dist/charts.css +256 -256
  27. package/dist/manifest.js +728 -737
  28. package/dist/widgets.css +6 -14
  29. package/dist/widgets.js +13 -26
  30. package/package.json +1 -1
  31. package/src/charts/BarGraph.scss +31 -31
  32. package/src/charts/Legend.scss +57 -57
  33. package/src/charts/LegendEntry.scss +35 -35
  34. package/src/charts/LineGraph.scss +28 -28
  35. package/src/charts/helpers/SnapPointFinder.ts +136 -136
  36. package/src/charts/helpers/ValueAtFinder.ts +72 -72
  37. package/src/charts/variables.scss +1 -2
  38. package/src/data/createAccessorModelProxy.ts +66 -66
  39. package/src/ui/DataProxy.ts +55 -55
  40. package/src/ui/Rescope.ts +50 -50
  41. package/src/ui/adapter/ArrayAdapter.ts +229 -229
  42. package/src/ui/exprHelpers.ts +96 -96
  43. package/src/util/scss/include.scss +40 -27
  44. package/src/widgets/Button.maps.scss +103 -103
  45. package/src/widgets/Sandbox.ts +104 -104
  46. package/src/widgets/drag-drop/variables.scss +1 -2
  47. package/src/widgets/form/Calendar.tsx +772 -772
  48. package/src/widgets/form/ColorField.scss +112 -117
  49. package/src/widgets/form/DateTimeField.scss +111 -125
  50. package/src/widgets/form/LookupField.scss +228 -251
  51. package/src/widgets/form/MonthField.scss +113 -122
  52. package/src/widgets/form/NumberField.scss +72 -80
  53. package/src/widgets/form/Select.scss +104 -117
  54. package/src/widgets/form/TextField.scss +66 -78
  55. package/src/widgets/form/variables.scss +110 -111
  56. package/src/widgets/grid/Grid.tsx +3885 -4428
  57. package/src/widgets/grid/variables.scss +47 -48
  58. package/src/widgets/index.ts +63 -63
  59. package/src/widgets/nav/Menu.variables.scss +1 -2
  60. package/src/widgets/nav/Tab.ts +6 -4
  61. package/src/widgets/nav/variables.scss +1 -2
  62. package/src/widgets/overlay/Overlay.tsx +1028 -1028
  63. package/src/widgets/overlay/Window.tsx +320 -320
  64. package/src/widgets/overlay/variables.scss +1 -2
  65. package/src/widgets/variables.scss +61 -62
package/src/widgets/form/ColorField.scss CHANGED
@@ -1,117 +1,112 @@
1
- @use "sass:math";
2
- @use "sass:map";
3
- @use "../variables" as *;
4
- @use "../maps" as *;
5
- @use "../../util/call-once.scss" as *;
6
- @use "../../util/scss/add-rules.scss" as *;
7
- @use "../../util/scss/calc.scss" as *;
8
- @use "../../util/scss/clockwise.scss" as *;
9
- @use "../../util/scss/deep-merge.scss" as *;
10
- @use "../../util/scss/besm.scss" as *;
11
- @use "../../util/scss/include.scss" as *;
12
- @use "./Field.scss" as *;
13
- @use "./ColorPicker.scss" as *;
14
-
15
- @mixin cx-colorfield(
16
- $name: "colorfield",
17
- $state-style-map: $cx-std-field-state-style-map,
18
- $placeholder: $cx-input-placeholder,
19
- $empty-text: $cx-empty-text,
20
- $clear-state-style-map: $cx-clear-state-style-map,
21
- $left-icon-state-style-map: $cx-input-left-icon-state-style-map,
22
- $right-icon-state-style-map: $cx-input-right-icon-state-style-map,
23
- $width: $cx-default-input-width,
24
- $icon-size: $cx-default-icon-size,
25
- $besm: $cx-besm
26
- ) {
27
- $block: map.get($besm, block);
28
- $element: map.get($besm, element);
29
- $state: map.get($besm, state);
30
-
31
- .#{$block}#{$name} {
32
- @include cxb-field($besm, $state-style-map, $width: $width, $input: true);
33
- }
34
-
35
- $padding: cx-get-state-rule($state-style-map, default, "padding");
36
-
37
- .#{$element}#{$name}-input {
38
- @include cxe-field-input(
39
- $besm,
40
- $state-style-map,
41
- $placeholder: $placeholder,
42
- $overrides: (
43
- default: (
44
- font-family: $cx-default-colorfield-font-family,
45
- font-size: 11px,
46
- padding: cx-top($padding)
47
- cx-calc(cx-right($padding), $cx-default-clear-size)
48
- cx-bottom($padding)
49
- cx-calc(
50
- cx-left($padding),
51
- $cx-default-input-left-tool-size,
52
- $cx-default-input-left-tool-spacing
53
- ),
54
- )
55
- )
56
- );
57
- }
58
-
59
- .#{$element}#{$name}-clear {
60
- @include cxe-field-button($besm, $clear-state-style-map);
61
-
62
- .#{$state}focus > & {
63
- @include cx-add-state-rules($clear-state-style-map, focus);
64
- }
65
- .#{$state}error > & {
66
- @include cx-add-state-rules($clear-state-style-map, error);
67
- }
68
- }
69
-
70
- .#{$element}#{$name}-right-icon {
71
- @include cxe-field-button($besm, $right-icon-state-style-map);
72
-
73
- .#{$state}focus > & {
74
- @include cx-add-state-rules($right-icon-state-style-map, focus);
75
- }
76
- .#{$state}error > & {
77
- @include cx-add-state-rules($right-icon-state-style-map, error);
78
- }
79
- }
80
-
81
- .#{$element}#{$name}-left-icon {
82
- box-sizing: border-box;
83
-
84
- @include cx-checker-background();
85
-
86
- @include cxe-field-button(
87
- $besm,
88
- cx-deep-map-merge(
89
- $left-icon-state-style-map,
90
- (
91
- default: (
92
- opacity: 1,
93
- cursor: pointer,
94
- ),
95
- )
96
- )
97
- );
98
-
99
- div {
100
- width: 100%;
101
- height: 100%;
102
- border-radius: inherit;
103
- }
104
- }
105
-
106
- .#{$element}#{$name}-icon {
107
- @include cxe-field-button-icon($besm, $icon-size);
108
- }
109
-
110
- .#{$element}#{$name}-empty-text {
111
- @include cxe-field-empty-text($empty-text);
112
- }
113
- }
114
-
115
- @if (cx-should-include("cx/widgets/ColorField")) {
116
- @include cx-colorfield();
117
- }
1
+ @use "sass:math";
2
+ @use "sass:map";
3
+ @use "../variables" as *;
4
+ @use "../maps" as *;
5
+ @use "../../util/call-once.scss" as *;
6
+ @use "../../util/scss/add-rules.scss" as *;
7
+ @use "../../util/scss/calc.scss" as *;
8
+ @use "../../util/scss/clockwise.scss" as *;
9
+ @use "../../util/scss/deep-merge.scss" as *;
10
+ @use "../../util/scss/besm.scss" as *;
11
+ @use "../../util/scss/include.scss" as *;
12
+ @use "./Field.scss" as *;
13
+ @use "./ColorPicker.scss" as *;
14
+
15
+ @mixin cx-colorfield(
16
+ $name: "colorfield",
17
+ $state-style-map: $cx-std-field-state-style-map,
18
+ $placeholder: $cx-input-placeholder,
19
+ $empty-text: $cx-empty-text,
20
+ $clear-state-style-map: $cx-clear-state-style-map,
21
+ $left-icon-state-style-map: $cx-input-left-icon-state-style-map,
22
+ $right-icon-state-style-map: $cx-input-right-icon-state-style-map,
23
+ $width: $cx-default-input-width,
24
+ $icon-size: $cx-default-icon-size,
25
+ $besm: $cx-besm
26
+ ) {
27
+ $block: map.get($besm, block);
28
+ $element: map.get($besm, element);
29
+ $state: map.get($besm, state);
30
+
31
+ .#{$block}#{$name} {
32
+ @include cxb-field($besm, $state-style-map, $width: $width, $input: true);
33
+ }
34
+
35
+ $padding: cx-get-state-rule($state-style-map, default, "padding");
36
+
37
+ .#{$element}#{$name}-input {
38
+ @include cxe-field-input(
39
+ $besm,
40
+ $state-style-map,
41
+ $placeholder: $placeholder,
42
+ $overrides: (
43
+ default: (
44
+ font-family: $cx-default-colorfield-font-family,
45
+ font-size: 11px,
46
+ padding: cx-top($padding) cx-calc(cx-top($padding), $cx-default-clear-size, $cx-default-clear-spacing)
47
+ cx-bottom($padding)
48
+ cx-calc(cx-top($padding), $cx-default-input-left-tool-size, $cx-default-input-left-tool-spacing),
49
+ )
50
+ )
51
+ );
52
+ }
53
+
54
+ .#{$element}#{$name}-clear {
55
+ @include cxe-field-button($besm, $clear-state-style-map);
56
+
57
+ .#{$state}focus > & {
58
+ @include cx-add-state-rules($clear-state-style-map, focus);
59
+ }
60
+ .#{$state}error > & {
61
+ @include cx-add-state-rules($clear-state-style-map, error);
62
+ }
63
+ }
64
+
65
+ .#{$element}#{$name}-right-icon {
66
+ @include cxe-field-button($besm, $right-icon-state-style-map);
67
+
68
+ .#{$state}focus > & {
69
+ @include cx-add-state-rules($right-icon-state-style-map, focus);
70
+ }
71
+ .#{$state}error > & {
72
+ @include cx-add-state-rules($right-icon-state-style-map, error);
73
+ }
74
+ }
75
+
76
+ .#{$element}#{$name}-left-icon {
77
+ box-sizing: border-box;
78
+
79
+ @include cx-checker-background();
80
+
81
+ @include cxe-field-button(
82
+ $besm,
83
+ cx-deep-map-merge(
84
+ $left-icon-state-style-map,
85
+ (
86
+ default: (
87
+ opacity: 1,
88
+ cursor: pointer,
89
+ ),
90
+ )
91
+ )
92
+ );
93
+
94
+ div {
95
+ width: 100%;
96
+ height: 100%;
97
+ border-radius: inherit;
98
+ }
99
+ }
100
+
101
+ .#{$element}#{$name}-icon {
102
+ @include cxe-field-button-icon($besm, $icon-size);
103
+ }
104
+
105
+ .#{$element}#{$name}-empty-text {
106
+ @include cxe-field-empty-text($empty-text);
107
+ }
108
+ }
109
+
110
+ @if (cx-should-include("cx/widgets/ColorField")) {
111
+ @include cx-colorfield();
112
+ }
package/src/widgets/form/DateTimeField.scss CHANGED
@@ -1,125 +1,111 @@
1
- @use "sass:math";
2
- @use "sass:map";
3
- @use "../variables" as *;
4
- @use "../maps" as *;
5
- @use "../../util/scss/add-rules.scss" as *;
6
- @use "../../util/scss/calc.scss" as *;
7
- @use "../../util/scss/clockwise.scss" as *;
8
- @use "../../util/scss/deep-merge.scss" as *;
9
- @use "../../util/scss/besm.scss" as *;
10
- @use "../../util/scss/include.scss" as *;
11
- @use "./Field.scss" as *;
12
-
13
- @mixin cx-datetimefield(
14
- $name: "datetimefield",
15
- $input-state-style-map: $cx-std-field-state-style-map,
16
- $placeholder: $cx-input-placeholder,
17
- $empty-text: $cx-empty-text,
18
- $clear-state-style-map: $cx-clear-state-style-map,
19
- $left-icon-state-style-map: $cx-input-left-icon-state-style-map,
20
- $right-icon-state-style-map: $cx-input-right-icon-state-style-map,
21
- $icon-size: $cx-default-input-icon-size,
22
- $width: $cx-default-input-width,
23
- $besm: $cx-besm
24
- ) {
25
- $block: map.get($besm, block);
26
- $element: map.get($besm, element);
27
- $state: map.get($besm, state);
28
-
29
- .#{$block}#{$name} {
30
- @include cxb-field(
31
- $besm,
32
- $input-state-style-map,
33
- $width: $width,
34
- $input: true
35
- );
36
- }
37
-
38
- $padding: cx-get-state-rule($input-state-style-map, default, "padding");
39
-
40
- .#{$element}#{$name}-input {
41
- @include cxe-field-input(
42
- $besm,
43
- $input-state-style-map,
44
- $placeholder: $placeholder,
45
- $overrides: (
46
- default: (
47
- padding: cx-top($padding)
48
- cx-calc(
49
- cx-right($padding),
50
- $cx-default-clear-size,
51
- $cx-default-clear-spacing
52
- )
53
- cx-bottom($padding)
54
- cx-calc(
55
- cx-left($padding),
56
- $cx-default-input-left-tool-size,
57
- $cx-default-input-left-tool-spacing
58
- ),
59
- )
60
- )
61
- );
62
- }
63
-
64
- .#{$element}#{$name}-clear {
65
- @include cxe-field-button($besm, $clear-state-style-map);
66
-
67
- .#{$state}focus > & {
68
- @include cx-add-state-rules($clear-state-style-map, focus);
69
- }
70
- .#{$state}error > & {
71
- @include cx-add-state-rules($clear-state-style-map, error);
72
- }
73
- }
74
-
75
- .#{$element}#{$name}-left-icon {
76
- @include cxe-field-button(
77
- $besm,
78
- cx-deep-map-merge(
79
- $left-icon-state-style-map,
80
- (
81
- default: (
82
- cursor: pointer,
83
- ),
84
- )
85
- )
86
- );
87
-
88
- .#{$state}disabled > & {
89
- @include cx-add-state-rules($input-state-style-map, disabled);
90
- border-width: 0;
91
- }
92
- .#{$state}focus > & {
93
- @include cx-add-state-rules($left-icon-state-style-map, focus);
94
- }
95
- .#{$state}error > & {
96
- @include cx-add-state-rules($left-icon-state-style-map, error);
97
- }
98
- }
99
-
100
- .#{$element}#{$name}-right-icon {
101
- @include cxe-field-button($besm, $right-icon-state-style-map);
102
- .#{$state}disabled > & {
103
- @include cx-add-state-rules($input-state-style-map, disabled);
104
- border-width: 0;
105
- }
106
- .#{$state}focus > & {
107
- @include cx-add-state-rules($right-icon-state-style-map, focus);
108
- }
109
- .#{$state}error > & {
110
- @include cx-add-state-rules($right-icon-state-style-map, error);
111
- }
112
- }
113
-
114
- .#{$element}#{$name}-icon {
115
- @include cxe-field-button-icon($besm, $icon-size);
116
- }
117
-
118
- .#{$element}#{$name}-empty-text {
119
- @include cxe-field-empty-text($empty-text);
120
- }
121
- }
122
-
123
- @if (cx-should-include("cx/widgets/DateTimeField")) {
124
- @include cx-datetimefield();
125
- }
1
+ @use "sass:math";
2
+ @use "sass:map";
3
+ @use "../variables" as *;
4
+ @use "../maps" as *;
5
+ @use "../../util/scss/add-rules.scss" as *;
6
+ @use "../../util/scss/calc.scss" as *;
7
+ @use "../../util/scss/clockwise.scss" as *;
8
+ @use "../../util/scss/deep-merge.scss" as *;
9
+ @use "../../util/scss/besm.scss" as *;
10
+ @use "../../util/scss/include.scss" as *;
11
+ @use "./Field.scss" as *;
12
+
13
+ @mixin cx-datetimefield(
14
+ $name: "datetimefield",
15
+ $input-state-style-map: $cx-std-field-state-style-map,
16
+ $placeholder: $cx-input-placeholder,
17
+ $empty-text: $cx-empty-text,
18
+ $clear-state-style-map: $cx-clear-state-style-map,
19
+ $left-icon-state-style-map: $cx-input-left-icon-state-style-map,
20
+ $right-icon-state-style-map: $cx-input-right-icon-state-style-map,
21
+ $icon-size: $cx-default-input-icon-size,
22
+ $width: $cx-default-input-width,
23
+ $besm: $cx-besm
24
+ ) {
25
+ $block: map.get($besm, block);
26
+ $element: map.get($besm, element);
27
+ $state: map.get($besm, state);
28
+
29
+ .#{$block}#{$name} {
30
+ @include cxb-field($besm, $input-state-style-map, $width: $width, $input: true);
31
+ }
32
+
33
+ $padding: cx-get-state-rule($input-state-style-map, default, "padding");
34
+
35
+ .#{$element}#{$name}-input {
36
+ @include cxe-field-input(
37
+ $besm,
38
+ $input-state-style-map,
39
+ $placeholder: $placeholder,
40
+ $overrides: (
41
+ default: (
42
+ padding: cx-top($padding) cx-calc(cx-top($padding), $cx-default-clear-size, $cx-default-clear-spacing)
43
+ cx-bottom($padding)
44
+ cx-calc(cx-top($padding), $cx-default-input-left-tool-size, $cx-default-input-left-tool-spacing),
45
+ )
46
+ )
47
+ );
48
+ }
49
+
50
+ .#{$element}#{$name}-clear {
51
+ @include cxe-field-button($besm, $clear-state-style-map);
52
+
53
+ .#{$state}focus > & {
54
+ @include cx-add-state-rules($clear-state-style-map, focus);
55
+ }
56
+ .#{$state}error > & {
57
+ @include cx-add-state-rules($clear-state-style-map, error);
58
+ }
59
+ }
60
+
61
+ .#{$element}#{$name}-left-icon {
62
+ @include cxe-field-button(
63
+ $besm,
64
+ cx-deep-map-merge(
65
+ $left-icon-state-style-map,
66
+ (
67
+ default: (
68
+ cursor: pointer,
69
+ ),
70
+ )
71
+ )
72
+ );
73
+
74
+ .#{$state}disabled > & {
75
+ @include cx-add-state-rules($input-state-style-map, disabled);
76
+ border-width: 0;
77
+ }
78
+ .#{$state}focus > & {
79
+ @include cx-add-state-rules($left-icon-state-style-map, focus);
80
+ }
81
+ .#{$state}error > & {
82
+ @include cx-add-state-rules($left-icon-state-style-map, error);
83
+ }
84
+ }
85
+
86
+ .#{$element}#{$name}-right-icon {
87
+ @include cxe-field-button($besm, $right-icon-state-style-map);
88
+ .#{$state}disabled > & {
89
+ @include cx-add-state-rules($input-state-style-map, disabled);
90
+ border-width: 0;
91
+ }
92
+ .#{$state}focus > & {
93
+ @include cx-add-state-rules($right-icon-state-style-map, focus);
94
+ }
95
+ .#{$state}error > & {
96
+ @include cx-add-state-rules($right-icon-state-style-map, error);
97
+ }
98
+ }
99
+
100
+ .#{$element}#{$name}-icon {
101
+ @include cxe-field-button-icon($besm, $icon-size);
102
+ }
103
+
104
+ .#{$element}#{$name}-empty-text {
105
+ @include cxe-field-empty-text($empty-text);
106
+ }
107
+ }
108
+
109
+ @if (cx-should-include("cx/widgets/DateTimeField")) {
110
+ @include cx-datetimefield();
111
+ }