cx 26.4.3 → 26.5.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 (74) hide show
  1. package/build/charts/axis/Axis.d.ts +8 -0
  2. package/build/charts/axis/Axis.d.ts.map +1 -1
  3. package/build/charts/axis/Axis.js +18 -1
  4. package/build/charts/axis/TimeAxis.js +1 -0
  5. package/build/data/AugmentedViewBase.d.ts.map +1 -1
  6. package/build/data/AugmentedViewBase.js +5 -4
  7. package/build/data/View.d.ts +0 -1
  8. package/build/data/View.d.ts.map +1 -1
  9. package/build/data/View.js +1 -3
  10. package/build/ui/Format.d.ts.map +1 -1
  11. package/build/ui/Format.js +26 -2
  12. package/build/util/Format.d.ts.map +1 -1
  13. package/build/util/Format.js +6 -0
  14. package/build/util/date/dateQuarter.d.ts +7 -0
  15. package/build/util/date/dateQuarter.d.ts.map +1 -0
  16. package/build/util/date/dateQuarter.js +8 -0
  17. package/build/util/date/dayBefore.d.ts +12 -0
  18. package/build/util/date/dayBefore.d.ts.map +1 -0
  19. package/build/util/date/dayBefore.js +15 -0
  20. package/build/util/date/index.d.ts +2 -0
  21. package/build/util/date/index.d.ts.map +1 -1
  22. package/build/util/date/index.js +2 -0
  23. package/build/widgets/form/DateTimePicker.d.ts.map +1 -1
  24. package/build/widgets/form/DateTimePicker.js +53 -31
  25. package/build/widgets/form/Field.d.ts.map +1 -1
  26. package/build/widgets/form/Field.js +2 -1
  27. package/build/widgets/form/LookupField.js +2 -1
  28. package/build/widgets/form/Wheel.d.ts +8 -0
  29. package/build/widgets/form/Wheel.d.ts.map +1 -1
  30. package/build/widgets/form/Wheel.js +30 -7
  31. package/build/widgets/grid/Grid.d.ts +1 -1
  32. package/build/widgets/grid/Grid.d.ts.map +1 -1
  33. package/dist/charts.css +6 -0
  34. package/dist/charts.js +18 -1
  35. package/dist/data.js +5 -4
  36. package/dist/manifest.js +772 -763
  37. package/dist/ui.js +33 -1
  38. package/dist/util.js +32 -0
  39. package/dist/widgets.css +9 -3
  40. package/dist/widgets.js +230 -174
  41. package/package.json +1 -1
  42. package/src/charts/RangeMarker.scss +3 -0
  43. package/src/charts/axis/Axis.tsx +31 -1
  44. package/src/charts/axis/TimeAxis.tsx +1 -0
  45. package/src/charts/index.scss +1 -0
  46. package/src/data/AugmentedViewBase.ts +5 -4
  47. package/src/data/View.ts +16 -61
  48. package/src/ui/DataProxy.ts +55 -55
  49. package/src/ui/Format.spec.ts +32 -0
  50. package/src/ui/Format.ts +27 -2
  51. package/src/ui/Rescope.ts +50 -50
  52. package/src/ui/adapter/ArrayAdapter.ts +229 -229
  53. package/src/ui/exprHelpers.ts +96 -96
  54. package/src/util/Format.spec.ts +11 -0
  55. package/src/util/Format.ts +7 -0
  56. package/src/util/date/dateQuarter.ts +8 -0
  57. package/src/util/date/dayBefore.ts +15 -0
  58. package/src/util/date/index.ts +2 -0
  59. package/src/widgets/Sandbox.ts +104 -104
  60. package/src/widgets/form/ColorField.scss +112 -112
  61. package/src/widgets/form/DateTimeField.scss +111 -111
  62. package/src/widgets/form/DateTimePicker.tsx +453 -392
  63. package/src/widgets/form/Field.tsx +2 -1
  64. package/src/widgets/form/LookupField.maps.scss +26 -26
  65. package/src/widgets/form/LookupField.scss +10 -3
  66. package/src/widgets/form/LookupField.tsx +4 -1
  67. package/src/widgets/form/MonthField.scss +113 -113
  68. package/src/widgets/form/NumberField.scss +72 -72
  69. package/src/widgets/form/Select.scss +104 -104
  70. package/src/widgets/form/TextField.scss +66 -66
  71. package/src/widgets/form/ValidationGroup.spec.tsx +30 -1
  72. package/src/widgets/form/Wheel.tsx +36 -7
  73. package/src/widgets/grid/Grid.tsx +1 -1
  74. package/src/widgets/nav/MenuItem.tsx +525 -525
package/src/widgets/form/DateTimeField.scss CHANGED
@@ -1,111 +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($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
- }
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
+ }