baseui 10.2.1 → 10.6.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 (142) hide show
  1. package/button/styled-components.js +1 -1
  2. package/button/styled-components.js.flow +4 -1
  3. package/data-table/data-table.js +13 -3
  4. package/data-table/data-table.js.flow +20 -4
  5. package/data-table/types.js.flow +2 -1
  6. package/datepicker/calendar-header.js +227 -95
  7. package/datepicker/calendar-header.js.flow +270 -139
  8. package/datepicker/constants.js +4 -2
  9. package/datepicker/constants.js.flow +2 -0
  10. package/datepicker/day.js +1 -0
  11. package/datepicker/day.js.flow +1 -0
  12. package/datepicker/index.d.ts +1 -0
  13. package/datepicker/types.js.flow +1 -0
  14. package/datepicker/utils/calendar-header-helpers.js +51 -0
  15. package/datepicker/utils/calendar-header-helpers.js.flow +53 -0
  16. package/dnd-list/index.js.flow +2 -1
  17. package/drawer/close-icon.js +3 -2
  18. package/drawer/close-icon.js.flow +2 -2
  19. package/drawer/drawer.js +5 -2
  20. package/drawer/drawer.js.flow +2 -2
  21. package/es/button/styled-components.js +1 -1
  22. package/es/data-table/data-table.js +13 -3
  23. package/es/datepicker/calendar-header.js +184 -84
  24. package/es/datepicker/constants.js +2 -1
  25. package/es/datepicker/day.js +1 -0
  26. package/es/datepicker/utils/calendar-header-helpers.js +34 -0
  27. package/es/dnd-list/index.js +2 -1
  28. package/es/drawer/close-icon.js +3 -2
  29. package/es/drawer/drawer.js +5 -2
  30. package/es/list/list-heading.js +17 -6
  31. package/es/map-marker/constants.js +69 -0
  32. package/es/map-marker/fixed-marker.js +98 -0
  33. package/es/map-marker/floating-marker.js +65 -0
  34. package/es/map-marker/index.js +9 -0
  35. package/es/map-marker/pin-head.js +108 -0
  36. package/es/map-marker/styled-components.js +156 -0
  37. package/es/map-marker/types.js +8 -0
  38. package/es/popover/stateful-container.js +4 -0
  39. package/es/rating/emoticon-rating.js +3 -1
  40. package/es/rating/star-rating.js +3 -1
  41. package/es/select/select-component.js +20 -6
  42. package/es/select/styled-components.js +34 -4
  43. package/es/snackbar/snackbar-context.js +16 -4
  44. package/es/spinner/styled-components.js +1 -1
  45. package/es/table-semantic/styled-components.js +6 -4
  46. package/es/table-semantic/table-builder.js +3 -0
  47. package/es/themes/dark-theme/color-component-tokens.js +1 -1
  48. package/es/themes/dark-theme/color-semantic-tokens.js +8 -7
  49. package/es/themes/light-theme/color-component-tokens.js +9 -9
  50. package/es/themes/light-theme/color-semantic-tokens.js +3 -2
  51. package/es/tokens/colors.js +2 -2
  52. package/es/tooltip/styled-components.js +8 -0
  53. package/esm/button/styled-components.js +1 -1
  54. package/esm/data-table/data-table.js +13 -3
  55. package/esm/datepicker/calendar-header.js +226 -95
  56. package/esm/datepicker/constants.js +2 -1
  57. package/esm/datepicker/day.js +1 -0
  58. package/esm/datepicker/utils/calendar-header-helpers.js +45 -0
  59. package/esm/dnd-list/index.js +2 -1
  60. package/esm/drawer/close-icon.js +3 -2
  61. package/esm/drawer/drawer.js +5 -2
  62. package/esm/list/list-heading.js +17 -6
  63. package/esm/map-marker/constants.js +62 -0
  64. package/esm/map-marker/fixed-marker.js +137 -0
  65. package/esm/map-marker/floating-marker.js +94 -0
  66. package/esm/map-marker/index.js +9 -0
  67. package/esm/map-marker/pin-head.js +144 -0
  68. package/esm/map-marker/styled-components.js +168 -0
  69. package/esm/map-marker/types.js +8 -0
  70. package/esm/popover/stateful-container.js +4 -0
  71. package/esm/rating/emoticon-rating.js +2 -2
  72. package/esm/rating/star-rating.js +2 -2
  73. package/esm/select/select-component.js +19 -6
  74. package/esm/select/styled-components.js +28 -4
  75. package/esm/snackbar/snackbar-context.js +16 -4
  76. package/esm/spinner/styled-components.js +1 -1
  77. package/esm/table-semantic/styled-components.js +6 -4
  78. package/esm/table-semantic/table-builder.js +3 -0
  79. package/esm/themes/dark-theme/color-component-tokens.js +1 -1
  80. package/esm/themes/dark-theme/color-semantic-tokens.js +8 -7
  81. package/esm/themes/light-theme/color-component-tokens.js +9 -9
  82. package/esm/themes/light-theme/color-semantic-tokens.js +3 -2
  83. package/esm/tokens/colors.js +2 -2
  84. package/esm/tooltip/styled-components.js +8 -0
  85. package/index.d.ts +1 -0
  86. package/link/index.d.ts +1 -0
  87. package/list/index.d.ts +36 -0
  88. package/list/list-heading.js +24 -7
  89. package/list/list-heading.js.flow +17 -8
  90. package/map-marker/constants.js +82 -0
  91. package/map-marker/constants.js.flow +74 -0
  92. package/map-marker/fixed-marker.js +152 -0
  93. package/map-marker/fixed-marker.js.flow +137 -0
  94. package/map-marker/floating-marker.js +109 -0
  95. package/map-marker/floating-marker.js.flow +102 -0
  96. package/map-marker/index.d.ts +104 -0
  97. package/map-marker/index.js +55 -0
  98. package/map-marker/index.js.flow +23 -0
  99. package/map-marker/package.json +4 -0
  100. package/map-marker/pin-head.js +159 -0
  101. package/map-marker/pin-head.js.flow +155 -0
  102. package/map-marker/styled-components.js +184 -0
  103. package/map-marker/styled-components.js.flow +177 -0
  104. package/map-marker/types.js +11 -0
  105. package/map-marker/types.js.flow +114 -0
  106. package/menu/index.d.ts +7 -0
  107. package/menu/types.js.flow +12 -0
  108. package/package.json +3 -2
  109. package/popover/stateful-container.js +4 -0
  110. package/popover/stateful-container.js.flow +3 -0
  111. package/rating/emoticon-rating.js +2 -2
  112. package/rating/emoticon-rating.js.flow +4 -1
  113. package/rating/star-rating.js +2 -2
  114. package/rating/star-rating.js.flow +4 -1
  115. package/select/select-component.js +19 -6
  116. package/select/select-component.js.flow +19 -6
  117. package/select/styled-components.js +28 -4
  118. package/select/styled-components.js.flow +30 -2
  119. package/select/types.js.flow +9 -0
  120. package/snackbar/snackbar-context.js +15 -4
  121. package/snackbar/snackbar-context.js.flow +15 -3
  122. package/spinner/styled-components.js +1 -1
  123. package/spinner/styled-components.js.flow +1 -1
  124. package/table-semantic/index.d.ts +1 -0
  125. package/table-semantic/styled-components.js +6 -4
  126. package/table-semantic/styled-components.js.flow +6 -4
  127. package/table-semantic/table-builder.js +3 -0
  128. package/table-semantic/table-builder.js.flow +3 -0
  129. package/theme.ts +2 -0
  130. package/themes/dark-theme/color-component-tokens.js +1 -1
  131. package/themes/dark-theme/color-component-tokens.js.flow +1 -1
  132. package/themes/dark-theme/color-semantic-tokens.js +8 -7
  133. package/themes/dark-theme/color-semantic-tokens.js.flow +7 -6
  134. package/themes/light-theme/color-component-tokens.js +9 -9
  135. package/themes/light-theme/color-component-tokens.js.flow +9 -9
  136. package/themes/light-theme/color-semantic-tokens.js +3 -2
  137. package/themes/light-theme/color-semantic-tokens.js.flow +2 -1
  138. package/themes/types.js.flow +1 -0
  139. package/tokens/colors.js +2 -2
  140. package/tokens/colors.js.flow +2 -2
  141. package/tooltip/styled-components.js +8 -0
  142. package/tooltip/styled-components.js.flow +8 -0
@@ -0,0 +1,62 @@
1
+ var _Object$freeze, _Object$freeze2;
2
+
3
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
4
+
5
+ /*
6
+ Copyright (c) Uber Technologies, Inc.
7
+
8
+ This source code is licensed under the MIT license found in the
9
+ LICENSE file in the root directory of this source tree.
10
+ */
11
+ export var NEEDLE_SIZES = Object.freeze({
12
+ none: 'none',
13
+ short: 'short',
14
+ medium: 'medium',
15
+ tall: 'tall'
16
+ });
17
+ export var NEEDLE_HEIGHTS = Object.freeze((_Object$freeze = {}, _defineProperty(_Object$freeze, NEEDLE_SIZES.none, 0), _defineProperty(_Object$freeze, NEEDLE_SIZES.short, 4), _defineProperty(_Object$freeze, NEEDLE_SIZES.medium, 12), _defineProperty(_Object$freeze, NEEDLE_SIZES.tall, 20), _Object$freeze));
18
+ export var PINHEAD_SIZES_SHAPES = Object.freeze({
19
+ xSmallCircle: 'x-small-circle',
20
+ xSmallSquare: 'x-small-square',
21
+ small: 'small',
22
+ medium: 'medium',
23
+ large: 'large'
24
+ });
25
+ export var xSmallPinheadDimension = {
26
+ height: 16,
27
+ icon: 4
28
+ };
29
+ export var PINHEAD_DIMENSIONS = Object.freeze((_Object$freeze2 = {}, _defineProperty(_Object$freeze2, PINHEAD_SIZES_SHAPES.xSmallSquare, xSmallPinheadDimension), _defineProperty(_Object$freeze2, PINHEAD_SIZES_SHAPES.xSmallCircle, xSmallPinheadDimension), _defineProperty(_Object$freeze2, PINHEAD_SIZES_SHAPES.small, {
30
+ height: 24,
31
+ icon: 16
32
+ }), _defineProperty(_Object$freeze2, PINHEAD_SIZES_SHAPES.medium, {
33
+ height: 36,
34
+ icon: 16
35
+ }), _defineProperty(_Object$freeze2, PINHEAD_SIZES_SHAPES.large, {
36
+ height: 48,
37
+ icon: 24
38
+ }), _Object$freeze2));
39
+ export var PINHEAD_TYPES = Object.freeze({
40
+ floating: 'floating',
41
+ fixed: 'fixed'
42
+ });
43
+ export var FLOATING_MARKER_SIZES = Object.freeze({
44
+ small: 'small',
45
+ medium: 'medium',
46
+ large: 'large'
47
+ });
48
+ export var FLOATING_MARKER_ANCHOR_POSITIONS = Object.freeze({
49
+ none: 'none',
50
+ topLeft: 'top-left',
51
+ topRight: 'top-right',
52
+ bottomRight: 'bottom-right',
53
+ bottomLeft: 'bottom-left'
54
+ });
55
+ export var FLOATING_MARKER_ANCHOR_TYPES = Object.freeze({
56
+ circle: 'circle',
57
+ square: 'square'
58
+ });
59
+ export var dragShadowHeight = 4;
60
+ export var dragShadowMarginTop = 6;
61
+ export var dragShadowWidth = 6;
62
+ export var anchorSize = 16;
@@ -0,0 +1,137 @@
1
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
3
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
+
5
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
6
+
7
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
8
+
9
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
10
+
11
+ function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
12
+
13
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
14
+
15
+ /*
16
+ Copyright (c) Uber Technologies, Inc.
17
+
18
+ This source code is licensed under the MIT license found in the
19
+ LICENSE file in the root directory of this source tree.
20
+ */
21
+ import * as React from 'react';
22
+ import { useStyletron } from '../styles/index.js';
23
+ import { getOverrides } from '../helpers/overrides.js';
24
+ import { PINHEAD_TYPES, NEEDLE_SIZES, NEEDLE_HEIGHTS, PINHEAD_SIZES_SHAPES, dragShadowHeight, dragShadowMarginTop, dragShadowWidth } from './constants.js';
25
+ import PinHead from './pin-head.js';
26
+ import { FixedMarkerDragContainer as StyledFixedMarkerDragContainer, FixedMarkerRoot as StyledRoot, Needle as StyledNeedle, DragShadow as StyledDragShadow, DragShadowContainer as StyledDragShadowContainer } from './styled-components.js';
27
+
28
+ var Needle = function Needle(_ref) {
29
+ var size = _ref.size,
30
+ background = _ref.background,
31
+ _ref$overrides = _ref.overrides,
32
+ overrides = _ref$overrides === void 0 ? {} : _ref$overrides;
33
+
34
+ var _getOverrides = getOverrides(overrides.Needle, StyledNeedle),
35
+ _getOverrides2 = _slicedToArray(_getOverrides, 2),
36
+ Needle = _getOverrides2[0],
37
+ needleProps = _getOverrides2[1];
38
+
39
+ return /*#__PURE__*/React.createElement(Needle, _extends({
40
+ $background: background,
41
+ $height: NEEDLE_HEIGHTS[size]
42
+ }, needleProps));
43
+ };
44
+
45
+ var DragShadow = function DragShadow(_ref2) {
46
+ var background = _ref2.background,
47
+ dragging = _ref2.dragging,
48
+ height = _ref2.height,
49
+ _ref2$overrides = _ref2.overrides,
50
+ overrides = _ref2$overrides === void 0 ? {} : _ref2$overrides;
51
+
52
+ var _getOverrides3 = getOverrides(overrides.DragShadowContainer, StyledDragShadowContainer),
53
+ _getOverrides4 = _slicedToArray(_getOverrides3, 2),
54
+ DragShadowContainer = _getOverrides4[0],
55
+ dragShadowContainerProps = _getOverrides4[1];
56
+
57
+ var _getOverrides5 = getOverrides(overrides.DragShadow, StyledDragShadow),
58
+ _getOverrides6 = _slicedToArray(_getOverrides5, 2),
59
+ DragShadow = _getOverrides6[0],
60
+ dragShadowProps = _getOverrides6[1];
61
+
62
+ return /*#__PURE__*/React.createElement(DragShadowContainer, _extends({
63
+ $width: dragShadowWidth,
64
+ $height: height,
65
+ $dragging: dragging
66
+ }, dragShadowContainerProps), /*#__PURE__*/React.createElement(DragShadow, _extends({
67
+ $width: dragShadowWidth,
68
+ $background: background
69
+ }, dragShadowProps)));
70
+ };
71
+
72
+ var FixedMarker = function FixedMarker(_ref3) {
73
+ var _ref3$size = _ref3.size,
74
+ size = _ref3$size === void 0 ? PINHEAD_SIZES_SHAPES.medium : _ref3$size,
75
+ _ref3$needle = _ref3.needle,
76
+ needle = _ref3$needle === void 0 ? NEEDLE_SIZES.medium : _ref3$needle,
77
+ label = _ref3.label,
78
+ startEnhancer = _ref3.startEnhancer,
79
+ endEnhancer = _ref3.endEnhancer,
80
+ color = _ref3.color,
81
+ background = _ref3.background,
82
+ _ref3$dragging = _ref3.dragging,
83
+ dragging = _ref3$dragging === void 0 ? false : _ref3$dragging,
84
+ _ref3$overrides = _ref3.overrides,
85
+ overrides = _ref3$overrides === void 0 ? {} : _ref3$overrides;
86
+
87
+ var _useStyletron = useStyletron(),
88
+ _useStyletron2 = _slicedToArray(_useStyletron, 2),
89
+ theme = _useStyletron2[1];
90
+
91
+ var _theme$colors = theme.colors,
92
+ backgroundInversePrimary = _theme$colors.backgroundInversePrimary,
93
+ primaryB = _theme$colors.primaryB;
94
+ color = color || primaryB;
95
+ background = background || backgroundInversePrimary;
96
+ var doesPinHeadTransformOnDrag = needle !== NEEDLE_SIZES.none;
97
+
98
+ var _getOverrides7 = getOverrides(overrides.Root, StyledRoot),
99
+ _getOverrides8 = _slicedToArray(_getOverrides7, 2),
100
+ Root = _getOverrides8[0],
101
+ rootProps = _getOverrides8[1];
102
+
103
+ var _getOverrides9 = getOverrides(overrides.DragContainer, StyledFixedMarkerDragContainer),
104
+ _getOverrides10 = _slicedToArray(_getOverrides9, 2),
105
+ FixedMarkerDragContainer = _getOverrides10[0],
106
+ fixedMarkerDragContainerProps = _getOverrides10[1];
107
+
108
+ return /*#__PURE__*/React.createElement(Root, _extends({
109
+ "data-baseweb": "fixed-map-marker"
110
+ }, rootProps), /*#__PURE__*/React.createElement(FixedMarkerDragContainer, _extends({
111
+ $translateAmount: dragShadowMarginTop + dragShadowHeight,
112
+ $performTranslate: doesPinHeadTransformOnDrag && dragging
113
+ }, fixedMarkerDragContainerProps), /*#__PURE__*/React.createElement(PinHead, _extends({
114
+ size: size,
115
+ label: label
116
+ }, startEnhancer ? {
117
+ startEnhancer: startEnhancer
118
+ } : {}, endEnhancer ? {
119
+ endEnhancer: endEnhancer
120
+ } : {}, {
121
+ color: color,
122
+ background: background,
123
+ type: PINHEAD_TYPES.fixed,
124
+ overrides: overrides
125
+ })), /*#__PURE__*/React.createElement(Needle, {
126
+ size: needle,
127
+ background: background,
128
+ overrides: overrides
129
+ })), doesPinHeadTransformOnDrag && /*#__PURE__*/React.createElement(DragShadow, {
130
+ background: background,
131
+ dragging: dragging,
132
+ height: dragShadowMarginTop + dragShadowHeight,
133
+ overrides: overrides
134
+ }));
135
+ };
136
+
137
+ export default FixedMarker;
@@ -0,0 +1,94 @@
1
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
3
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
+
5
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
6
+
7
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
8
+
9
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
10
+
11
+ function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
12
+
13
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
14
+
15
+ /*
16
+ Copyright (c) Uber Technologies, Inc.
17
+
18
+ This source code is licensed under the MIT license found in the
19
+ LICENSE file in the root directory of this source tree.
20
+ */
21
+ import * as React from 'react';
22
+ import { useStyletron } from '../styles/index.js';
23
+ import PinHead from './pin-head.js';
24
+ import { getOverrides } from '../helpers/overrides.js';
25
+ import { FloatingMarkerRoot as StyledRoot, FloatingMarkerAnchorContainer as StyledFloatingMarkerAnchorContainer, FloatingMarkerPinHeadContainer as StyledFloatingMarkerPinHeadContainer } from './styled-components.js';
26
+ import { FLOATING_MARKER_ANCHOR_POSITIONS, PINHEAD_SIZES_SHAPES, PINHEAD_TYPES, FLOATING_MARKER_ANCHOR_TYPES, anchorSize } from './constants.js';
27
+
28
+ var FloatingMarker = function FloatingMarker(_ref) {
29
+ var color = _ref.color,
30
+ background = _ref.background,
31
+ label = _ref.label,
32
+ _ref$size = _ref.size,
33
+ size = _ref$size === void 0 ? PINHEAD_SIZES_SHAPES.medium : _ref$size,
34
+ _ref$anchor = _ref.anchor,
35
+ anchor = _ref$anchor === void 0 ? FLOATING_MARKER_ANCHOR_POSITIONS.bottomLeft : _ref$anchor,
36
+ endEnhancer = _ref.endEnhancer,
37
+ startEnhancer = _ref.startEnhancer,
38
+ _ref$anchorType = _ref.anchorType,
39
+ anchorType = _ref$anchorType === void 0 ? FLOATING_MARKER_ANCHOR_TYPES.circle : _ref$anchorType,
40
+ _ref$overrides = _ref.overrides,
41
+ overrides = _ref$overrides === void 0 ? {} : _ref$overrides;
42
+
43
+ var _useStyletron = useStyletron(),
44
+ _useStyletron2 = _slicedToArray(_useStyletron, 2),
45
+ theme = _useStyletron2[1];
46
+
47
+ var _theme$colors = theme.colors,
48
+ backgroundPrimary = _theme$colors.backgroundPrimary,
49
+ backgroundInversePrimary = _theme$colors.backgroundInversePrimary,
50
+ primaryA = _theme$colors.primaryA,
51
+ primaryB = _theme$colors.primaryB;
52
+ color = color || primaryA;
53
+ background = background || backgroundPrimary;
54
+ var anchorPinHeadSize = anchorType === FLOATING_MARKER_ANCHOR_TYPES.circle ? PINHEAD_SIZES_SHAPES.xSmallCircle : PINHEAD_SIZES_SHAPES.xSmallSquare;
55
+
56
+ var _getOverrides = getOverrides(overrides.Root, StyledRoot),
57
+ _getOverrides2 = _slicedToArray(_getOverrides, 2),
58
+ Root = _getOverrides2[0],
59
+ rootProps = _getOverrides2[1];
60
+
61
+ var _getOverrides3 = getOverrides(overrides.PinHeadContainer, StyledFloatingMarkerPinHeadContainer),
62
+ _getOverrides4 = _slicedToArray(_getOverrides3, 2),
63
+ FloatingMarkerPinHeadContainer = _getOverrides4[0],
64
+ floatingMarkerPinHeadContainerProps = _getOverrides4[1];
65
+
66
+ var _getOverrides5 = getOverrides(overrides.AnchorContainer, StyledFloatingMarkerAnchorContainer),
67
+ _getOverrides6 = _slicedToArray(_getOverrides5, 2),
68
+ FloatingMarkerAnchorContainer = _getOverrides6[0],
69
+ floatingMarkerAnchorContainerProps = _getOverrides6[1];
70
+
71
+ return /*#__PURE__*/React.createElement(Root, _extends({
72
+ "data-baseweb": "floating-map-marker"
73
+ }, rootProps), /*#__PURE__*/React.createElement(FloatingMarkerPinHeadContainer, _extends({
74
+ $anchor: anchor,
75
+ $anchorSize: anchorSize
76
+ }, floatingMarkerPinHeadContainerProps), /*#__PURE__*/React.createElement(PinHead, {
77
+ size: size,
78
+ color: color,
79
+ background: background,
80
+ type: PINHEAD_TYPES.floating,
81
+ label: label,
82
+ startEnhancer: startEnhancer,
83
+ endEnhancer: endEnhancer,
84
+ overrides: overrides
85
+ })), anchor !== FLOATING_MARKER_ANCHOR_POSITIONS.none && /*#__PURE__*/React.createElement(FloatingMarkerAnchorContainer, floatingMarkerAnchorContainerProps, /*#__PURE__*/React.createElement(PinHead, {
86
+ size: anchorPinHeadSize,
87
+ color: primaryB,
88
+ background: backgroundInversePrimary,
89
+ type: PINHEAD_TYPES.fixed,
90
+ overrides: overrides
91
+ })));
92
+ };
93
+
94
+ export default FloatingMarker;
@@ -0,0 +1,9 @@
1
+ /*
2
+ Copyright (c) Uber Technologies, Inc.
3
+
4
+ This source code is licensed under the MIT license found in the
5
+ LICENSE file in the root directory of this source tree.
6
+ */
7
+ export { default as FixedMarker } from './fixed-marker.js';
8
+ export { default as FloatingMarker } from './floating-marker.js';
9
+ export { FLOATING_MARKER_ANCHOR_POSITIONS, FLOATING_MARKER_SIZES, FLOATING_MARKER_ANCHOR_TYPES, NEEDLE_SIZES, PINHEAD_SIZES_SHAPES } from './constants.js';
@@ -0,0 +1,144 @@
1
+ function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
3
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4
+
5
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
6
+
7
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
8
+
9
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
10
+
11
+ function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
12
+
13
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
14
+
15
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
16
+
17
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
18
+
19
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
20
+
21
+ /*
22
+ Copyright (c) Uber Technologies, Inc.
23
+
24
+ This source code is licensed under the MIT license found in the
25
+ LICENSE file in the root directory of this source tree.
26
+ */
27
+ import * as React from 'react';
28
+ import { useStyletron, styled } from '../styles/index.js';
29
+ import { getOverrides } from '../helpers/overrides.js';
30
+ import { InnerXSmallAnchor as StyledInnerXSmallAnchor, OuterXSmallAnchor as StyledOuterXSmallAnchor, PinHead as StyledPinHead } from './styled-components.js';
31
+ import { PINHEAD_DIMENSIONS, PINHEAD_TYPES, PINHEAD_SIZES_SHAPES } from './constants.js';
32
+ export var _ContentItem = styled('div', function (_ref) {
33
+ var _match;
34
+
35
+ var $theme = _ref.$theme,
36
+ $color = _ref.$color,
37
+ $height = _ref.$height,
38
+ $size = _ref.$size;
39
+ var match = (_match = {}, _defineProperty(_match, PINHEAD_SIZES_SHAPES.xSmallCircle, 'LabelSmall'), _defineProperty(_match, PINHEAD_SIZES_SHAPES.xSmallSquare, 'LabelSmall'), _defineProperty(_match, PINHEAD_SIZES_SHAPES.small, 'LabelSmall'), _defineProperty(_match, PINHEAD_SIZES_SHAPES.medium, 'LabelMedium'), _defineProperty(_match, PINHEAD_SIZES_SHAPES.large, 'LabelLarge'), _match);
40
+ return _objectSpread(_objectSpread({}, $theme.typography[match[$size]]), {}, {
41
+ display: 'flex',
42
+ alignItems: 'center',
43
+ textAlign: 'center',
44
+ lineHeight: "".concat($height, "px"),
45
+ height: "".concat($height, "px"),
46
+ color: $color
47
+ });
48
+ });
49
+ _ContentItem.displayName = "_ContentItem";
50
+
51
+ var PinHead = function PinHead(_ref2) {
52
+ var _ref2$size = _ref2.size,
53
+ size = _ref2$size === void 0 ? PINHEAD_SIZES_SHAPES.medium : _ref2$size,
54
+ _ref2$label = _ref2.label,
55
+ label = _ref2$label === void 0 ? '' : _ref2$label,
56
+ StartEnhancer = _ref2.startEnhancer,
57
+ EndEnhancer = _ref2.endEnhancer,
58
+ color = _ref2.color,
59
+ background = _ref2.background,
60
+ _ref2$type = _ref2.type,
61
+ type = _ref2$type === void 0 ? PINHEAD_TYPES.fixed : _ref2$type,
62
+ anchorType = _ref2.anchorType,
63
+ _ref2$overrides = _ref2.overrides,
64
+ overrides = _ref2$overrides === void 0 ? {} : _ref2$overrides;
65
+
66
+ var _useStyletron = useStyletron(),
67
+ _useStyletron2 = _slicedToArray(_useStyletron, 2),
68
+ theme = _useStyletron2[1];
69
+
70
+ var _theme$colors = theme.colors,
71
+ backgroundPrimary = _theme$colors.backgroundPrimary,
72
+ primaryA = _theme$colors.primaryA;
73
+ color = color || backgroundPrimary;
74
+ background = background || primaryA;
75
+ var activeElements = [label, StartEnhancer, EndEnhancer].filter(function (x) {
76
+ return x;
77
+ });
78
+ var gridTemplateColumns = activeElements.map(function () {
79
+ return 'auto';
80
+ }).join(' ');
81
+ var forceCircle = activeElements.length === 1 && !label;
82
+ var _PINHEAD_DIMENSIONS$s = PINHEAD_DIMENSIONS[size],
83
+ height = _PINHEAD_DIMENSIONS$s.height,
84
+ icon = _PINHEAD_DIMENSIONS$s.icon;
85
+
86
+ var _getOverrides = getOverrides(overrides.PinHead, StyledPinHead),
87
+ _getOverrides2 = _slicedToArray(_getOverrides, 2),
88
+ PinHead = _getOverrides2[0],
89
+ pinHeadProps = _getOverrides2[1];
90
+
91
+ var _getOverrides3 = getOverrides(overrides.PinHeadContent, _ContentItem),
92
+ _getOverrides4 = _slicedToArray(_getOverrides3, 2),
93
+ ContentItem = _getOverrides4[0],
94
+ contentItemProps = _getOverrides4[1];
95
+
96
+ var _getOverrides5 = getOverrides(overrides.InnerAnchor, StyledInnerXSmallAnchor),
97
+ _getOverrides6 = _slicedToArray(_getOverrides5, 2),
98
+ InnerXSmallAnchor = _getOverrides6[0],
99
+ innerXSmallAnchorProps = _getOverrides6[1];
100
+
101
+ var _getOverrides7 = getOverrides(overrides.OuterAnchor, StyledOuterXSmallAnchor),
102
+ _getOverrides8 = _slicedToArray(_getOverrides7, 2),
103
+ OuterXSmallAnchor = _getOverrides8[0],
104
+ outerXSmallAnchorProps = _getOverrides8[1];
105
+
106
+ if (type === PINHEAD_TYPES.fixed && (size === PINHEAD_SIZES_SHAPES.xSmallSquare || size === PINHEAD_SIZES_SHAPES.xSmallCircle)) {
107
+ var round = size === PINHEAD_SIZES_SHAPES.xSmallCircle;
108
+ return /*#__PURE__*/React.createElement(OuterXSmallAnchor, _extends({
109
+ $round: round,
110
+ $background: background,
111
+ $size: height
112
+ }, outerXSmallAnchorProps), /*#__PURE__*/React.createElement(InnerXSmallAnchor, _extends({
113
+ $color: color,
114
+ $round: round,
115
+ $size: icon
116
+ }, innerXSmallAnchorProps)));
117
+ }
118
+
119
+ return /*#__PURE__*/React.createElement(PinHead, _extends({
120
+ $background: background,
121
+ $height: height,
122
+ $gridTemplateColumns: gridTemplateColumns,
123
+ $forceCircle: forceCircle,
124
+ $type: type
125
+ }, pinHeadProps), StartEnhancer && /*#__PURE__*/React.createElement(ContentItem, _extends({
126
+ $height: height,
127
+ $color: color,
128
+ $size: size
129
+ }, contentItemProps), /*#__PURE__*/React.createElement(StartEnhancer, {
130
+ size: icon
131
+ })), label && /*#__PURE__*/React.createElement(ContentItem, _extends({
132
+ $height: height,
133
+ $color: color,
134
+ $size: size
135
+ }, contentItemProps), label), EndEnhancer && /*#__PURE__*/React.createElement(ContentItem, _extends({
136
+ $height: height,
137
+ $color: color,
138
+ $size: size
139
+ }, contentItemProps), /*#__PURE__*/React.createElement(EndEnhancer, {
140
+ size: icon
141
+ })));
142
+ };
143
+
144
+ export default PinHead;
@@ -0,0 +1,168 @@
1
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
2
+
3
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
4
+
5
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
6
+
7
+ /*
8
+ Copyright (c) Uber Technologies, Inc.
9
+
10
+ This source code is licensed under the MIT license found in the
11
+ LICENSE file in the root directory of this source tree.
12
+ */
13
+ import { styled } from '../styles/index.js';
14
+ import { FLOATING_MARKER_ANCHOR_POSITIONS, xSmallPinheadDimension } from './constants.js';
15
+ export var getAnchorTransform = function getAnchorTransform(anchor, anchorSize) {
16
+ var _FLOATING_MARKER_ANCH;
17
+
18
+ return (_FLOATING_MARKER_ANCH = {}, _defineProperty(_FLOATING_MARKER_ANCH, FLOATING_MARKER_ANCHOR_POSITIONS.none, ""), _defineProperty(_FLOATING_MARKER_ANCH, FLOATING_MARKER_ANCHOR_POSITIONS.topLeft, "translate(".concat(anchorSize, "px, ").concat(anchorSize, "px)")), _defineProperty(_FLOATING_MARKER_ANCH, FLOATING_MARKER_ANCHOR_POSITIONS.topRight, "translate(-100%, ".concat(anchorSize, "px)")), _defineProperty(_FLOATING_MARKER_ANCH, FLOATING_MARKER_ANCHOR_POSITIONS.bottomLeft, "translate(".concat(anchorSize, "px, -100%)")), _defineProperty(_FLOATING_MARKER_ANCH, FLOATING_MARKER_ANCHOR_POSITIONS.bottomRight, "translate(-100%, -100%)"), _FLOATING_MARKER_ANCH)[anchor];
19
+ };
20
+ export var DragShadowContainer = styled('div', function (_ref) {
21
+ var $theme = _ref.$theme,
22
+ $height = _ref.$height,
23
+ $width = _ref.$width,
24
+ $dragging = _ref.$dragging;
25
+ return {
26
+ width: "".concat($width, "px"),
27
+ height: "".concat($height, "px"),
28
+ opacity: $dragging ? 1 : 0,
29
+ visibility: $dragging ? 'visible' : 'hidden',
30
+ transition: "".concat($theme.animation.timing300, " ").concat($theme.animation.easeOutCurve, " all"),
31
+ position: 'relative',
32
+ boxShadow: $theme.lighting.shadow600
33
+ };
34
+ });
35
+ DragShadowContainer.displayName = "DragShadowContainer";
36
+ export var DragShadow = styled('div', function (_ref2) {
37
+ var $theme = _ref2.$theme,
38
+ $background = _ref2.$background,
39
+ $width = _ref2.$width;
40
+ return {
41
+ background: $background,
42
+ borderRadius: '50%',
43
+ width: "".concat($width, "px"),
44
+ height: "".concat(4, "px"),
45
+ position: 'absolute',
46
+ bottom: 0
47
+ };
48
+ });
49
+ DragShadow.displayName = "DragShadow";
50
+ export var Needle = styled('div', function (_ref3) {
51
+ var $theme = _ref3.$theme,
52
+ $background = _ref3.$background,
53
+ $height = _ref3.$height;
54
+ return {
55
+ background: $background,
56
+ width: '4px',
57
+ height: "".concat($height, "px"),
58
+ boxShadow: $theme.lighting.shadow600
59
+ };
60
+ });
61
+ Needle.displayName = "Needle";
62
+ export var FloatingMarkerRoot = styled('div', function () {
63
+ return {
64
+ position: 'relative',
65
+ height: "".concat(xSmallPinheadDimension.height, "px"),
66
+ width: "".concat(xSmallPinheadDimension.height, "px")
67
+ };
68
+ });
69
+ FloatingMarkerRoot.displayName = "FloatingMarkerRoot";
70
+ export var FloatingMarkerPinHeadContainer = styled('div', function (_ref4) {
71
+ var $theme = _ref4.$theme,
72
+ $anchor = _ref4.$anchor,
73
+ $anchorSize = _ref4.$anchorSize;
74
+ return {
75
+ position: 'absolute',
76
+ transition: "".concat($theme.animation.timing300, " ").concat($theme.animation.easeOutCurve, " all"),
77
+ transform: getAnchorTransform($anchor, $anchorSize)
78
+ };
79
+ });
80
+ FloatingMarkerPinHeadContainer.displayName = "FloatingMarkerPinHeadContainer";
81
+ export var FloatingMarkerAnchorContainer = styled('div', function () {
82
+ return {
83
+ position: 'absolute'
84
+ };
85
+ });
86
+ FloatingMarkerAnchorContainer.displayName = "FloatingMarkerAnchorContainer";
87
+ export var FixedMarkerRoot = styled('div', function () {
88
+ return {
89
+ display: 'flex',
90
+ alignItems: 'center',
91
+ flexDirection: 'column'
92
+ };
93
+ });
94
+ FixedMarkerRoot.displayName = "FixedMarkerRoot";
95
+ export var FixedMarkerDragContainer = styled('div', function (_ref5) {
96
+ var $theme = _ref5.$theme,
97
+ $translateAmount = _ref5.$translateAmount,
98
+ $performTranslate = _ref5.$performTranslate;
99
+ return {
100
+ transform: "translateY(".concat($performTranslate ? '0px' : "".concat($translateAmount, "px"), ")"),
101
+ transition: "".concat($theme.animation.timing300, " ").concat($theme.animation.easeOutCurve, " all"),
102
+ display: 'flex',
103
+ alignItems: 'center',
104
+ flexDirection: 'column'
105
+ };
106
+ });
107
+ FixedMarkerDragContainer.displayName = "FixedMarkerDragContainer";
108
+ export var OuterXSmallAnchor = styled('div', function (_ref6) {
109
+ var $theme = _ref6.$theme,
110
+ $round = _ref6.$round,
111
+ $background = _ref6.$background,
112
+ $size = _ref6.$size;
113
+ return {
114
+ background: $background,
115
+ display: 'flex',
116
+ alignItems: 'center',
117
+ justifyContent: 'center',
118
+ height: "".concat($size, "px"),
119
+ width: "".concat($size, "px"),
120
+ borderRadius: $round ? '50%' : 0,
121
+ boxShadow: $theme.lighting.shadow600
122
+ };
123
+ });
124
+ OuterXSmallAnchor.displayName = "OuterXSmallAnchor";
125
+ export var InnerXSmallAnchor = styled('div', function (_ref7) {
126
+ var $round = _ref7.$round,
127
+ $color = _ref7.$color,
128
+ $size = _ref7.$size;
129
+ return {
130
+ background: $color,
131
+ height: "".concat($size, "px"),
132
+ width: "".concat($size, "px"),
133
+ borderRadius: $round ? '50%' : 0
134
+ };
135
+ });
136
+ InnerXSmallAnchor.displayName = "InnerXSmallAnchor";
137
+ export var PinHead = styled('div', function (_ref8) {
138
+ var $theme = _ref8.$theme,
139
+ $height = _ref8.$height,
140
+ $background = _ref8.$background,
141
+ $gridTemplateColumns = _ref8.$gridTemplateColumns,
142
+ $type = _ref8.$type,
143
+ $forceCircle = _ref8.$forceCircle;
144
+ var sharedStyles = {
145
+ fixed: {
146
+ padding: '0px 12px',
147
+ borderRadius: "".concat($height, "px")
148
+ },
149
+ floating: {
150
+ padding: '0px 8px'
151
+ }
152
+ };
153
+ return _objectSpread(_objectSpread({
154
+ background: $background,
155
+ height: "".concat($height, "px"),
156
+ display: 'grid',
157
+ gridTemplateColumns: $gridTemplateColumns,
158
+ gap: '8px',
159
+ boxShadow: $theme.lighting.shadow600,
160
+ whiteSpace: 'nowrap'
161
+ }, sharedStyles[$type]), $forceCircle && {
162
+ width: "".concat($height, "px"),
163
+ display: 'flex',
164
+ justifyContent: 'center',
165
+ boxSizing: 'border-box'
166
+ });
167
+ });
168
+ PinHead.displayName = "PinHead";
@@ -0,0 +1,8 @@
1
+ /*
2
+ Copyright (c) Uber Technologies, Inc.
3
+
4
+ This source code is licensed under the MIT license found in the
5
+ LICENSE file in the root directory of this source tree.
6
+ */
7
+ import * as React from 'react';
8
+ import { FLOATING_MARKER_ANCHOR_POSITIONS, NEEDLE_SIZES, PINHEAD_SIZES_SHAPES, FLOATING_MARKER_SIZES, PINHEAD_TYPES, FLOATING_MARKER_ANCHOR_TYPES } from './constants.js';
@@ -64,6 +64,10 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
64
64
  _this.props.onBlur(e);
65
65
  }
66
66
 
67
+ if (_this.props.focusLock || _this.props.autoFocus) {
68
+ return;
69
+ }
70
+
67
71
  _this.close();
68
72
  });
69
73
 
@@ -213,8 +213,8 @@ var EmoticonRating = /*#__PURE__*/function (_React$Component) {
213
213
  return /*#__PURE__*/React.createElement(Root, _extends({
214
214
  "data-baseweb": "emoticon-rating",
215
215
  role: "radiogroup",
216
- onBlur: function onBlur() {
217
- return _this2.updatePreview(undefined);
216
+ onBlur: function onBlur(e) {
217
+ if (!e.currentTarget.contains(e.relatedTarget)) _this2.updatePreview(undefined);
218
218
  },
219
219
  onMouseLeave: function onMouseLeave() {
220
220
  return _this2.updatePreview(undefined);
@@ -216,8 +216,8 @@ var StarRating = /*#__PURE__*/function (_React$Component) {
216
216
  return /*#__PURE__*/React.createElement(Root, _extends({
217
217
  "data-baseweb": "star-rating",
218
218
  role: "radiogroup",
219
- onBlur: function onBlur() {
220
- return _this2.updatePreview(undefined);
219
+ onBlur: function onBlur(e) {
220
+ if (!e.currentTarget.contains(e.relatedTarget)) _this2.updatePreview(undefined);
221
221
  },
222
222
  onMouseLeave: function onMouseLeave() {
223
223
  return _this2.updatePreview(undefined);