baseui 12.1.3 → 13.0.0

package/list/index.d.ts

@@ -7,26 +7,26 @@ export { ARTWORK_SIZES, SHAPE } from './constants';
 export * from './styled-components';
 export * from './types';
 /** @deprecated use ArtworkSizes instead. To be removed in future versions.*/
-export declare type ArtworkSizesT = ArtworkSizes;
+export type ArtworkSizesT = ArtworkSizes;
 /** @deprecated use Shape instead. To be removed in future versions.*/
-export declare type ShapeT = Shape;
+export type ShapeT = Shape;
 /** @deprecated use StyledRootProps instead. To be removed in future versions.*/
-export declare type StyledRootPropsT = StyledRootProps;
+export type StyledRootPropsT = StyledRootProps;
 /** @deprecated use StyledArtworkContainerProps instead. To be removed in future versions.*/
-export declare type StyledArtworkContainerPropsT = StyledArtworkContainerProps;
+export type StyledArtworkContainerPropsT = StyledArtworkContainerProps;
 /** @deprecated use StyledContentProps instead. To be removed in future versions.*/
-export declare type StyledContentPropsT = StyledContentProps;
+export type StyledContentPropsT = StyledContentProps;
 /** @deprecated use ListProps instead. To be removed in future versions.*/
-export declare type PropsT = ListProps;
+export type PropsT = ListProps;
 /** @deprecated use LabelProps instead. To be removed in future versions.*/
-export declare type LabelPropsT = LabelProps;
+export type LabelPropsT = LabelProps;
 /** @deprecated use MenuAdapterProps instead. To be removed in future versions.*/
-export declare type MenuAdapterPropsT = MenuAdapterProps;
+export type MenuAdapterPropsT = MenuAdapterProps;
 /** @deprecated use HeadingProps instead. To be removed in future versions.*/
-export declare type HeadingPropsT = HeadingProps;
+export type HeadingPropsT = HeadingProps;
 /** @deprecated use StyledHeadingHeadingProps instead. To be removed in future versions.*/
-export declare type StyledHeadingHeadingPropsT = StyledHeadingHeadingProps;
+export type StyledHeadingHeadingPropsT = StyledHeadingHeadingProps;
 /** @deprecated To be removed in future versions.*/
-export declare type StyledHeadingEndEnhancerContainerPropsT = {
+export type StyledHeadingEndEnhancerContainerPropsT = {
     $isText: boolean;
 };

package/list/list-heading.js

@@ -41,6 +41,7 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
+// @ts-ignore
 function RenderNode(props) {
   var component = props.component,
       restProps = _objectWithoutProperties(props, _excluded);
@@ -60,7 +61,8 @@ function RenderNode(props) {
   }
 
   return Component;
-}
+} // @ts-ignore
+
 
 function isMaxLinesValid(maxLines) {
   return maxLines === 1 || maxLines === 2;
@@ -116,27 +118,24 @@ var ListHeading = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     }
   }
 
-  return (
-    /*#__PURE__*/
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    _react.default.createElement(Root, _extends({
-      ref: ref
-    }, rootProps), /*#__PURE__*/_react.default.createElement(Content, contentProps, /*#__PURE__*/_react.default.createElement(_styledComponents.StyledHeadingContentRow, null, /*#__PURE__*/_react.default.createElement(HeadingContainer, _extends({
-      $maxLines: isMaxLinesValid(maxLines) ? maxLines : 1
-    }, headingContainerProps), /*#__PURE__*/_react.default.createElement(RenderNode, {
-      component: props.heading
-    })), EndEnhancer && /*#__PURE__*/_react.default.createElement(EndEnhancerContainer, _extends({
-      $isText: isEndEnhancerString
-    }, endEnhancerContainerProps), /*#__PURE__*/_react.default.createElement(RenderNode, {
-      component: EndEnhancer
-    }))), (Boolean(SubHeading) || EndEnhancerDescription) && /*#__PURE__*/_react.default.createElement(_styledComponents.StyledHeadingContentRow, null, /*#__PURE__*/_react.default.createElement(SubHeadingContainer, _extends({
-      $maxLines: isMaxLinesValid(maxLines) ? maxLines : 1
-    }, subHeadingContainerProps), /*#__PURE__*/_react.default.createElement(RenderNode, {
-      component: SubHeading
-    })), Boolean(EndEnhancerDescription) && isEndEnhancerString && /*#__PURE__*/_react.default.createElement(EndEnhancerDescriptionContainer, endEnhancerDescriptionContainerProps, /*#__PURE__*/_react.default.createElement(RenderNode, {
-      component: EndEnhancerDescription
-    })))))
-  );
+  return /*#__PURE__*/_react.default.createElement(Root // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  , _extends({
+    ref: ref
+  }, rootProps), /*#__PURE__*/_react.default.createElement(Content, contentProps, /*#__PURE__*/_react.default.createElement(_styledComponents.StyledHeadingContentRow, null, /*#__PURE__*/_react.default.createElement(HeadingContainer, _extends({
+    $maxLines: isMaxLinesValid(maxLines) ? maxLines : 1
+  }, headingContainerProps), /*#__PURE__*/_react.default.createElement(RenderNode, {
+    component: props.heading
+  })), EndEnhancer && /*#__PURE__*/_react.default.createElement(EndEnhancerContainer, _extends({
+    $isText: isEndEnhancerString
+  }, endEnhancerContainerProps), /*#__PURE__*/_react.default.createElement(RenderNode, {
+    component: EndEnhancer
+  }))), (Boolean(SubHeading) || EndEnhancerDescription) && /*#__PURE__*/_react.default.createElement(_styledComponents.StyledHeadingContentRow, null, /*#__PURE__*/_react.default.createElement(SubHeadingContainer, _extends({
+    $maxLines: isMaxLinesValid(maxLines) ? maxLines : 1
+  }, subHeadingContainerProps), /*#__PURE__*/_react.default.createElement(RenderNode, {
+    component: SubHeading
+  })), Boolean(EndEnhancerDescription) && isEndEnhancerString && /*#__PURE__*/_react.default.createElement(EndEnhancerDescriptionContainer, endEnhancerDescriptionContainerProps, /*#__PURE__*/_react.default.createElement(RenderNode, {
+    component: EndEnhancerDescription
+  })))));
 });
 
 ListHeading.displayName = 'ListHeading';

package/list/list-item.js

@@ -75,14 +75,18 @@ var ListItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
     }
   }, [props.artworkSize, props.sublist]);
 
+  var isTapTarget = Boolean(props.onClick);
   return /*#__PURE__*/_react.default.createElement(Root // eslint-disable-next-line @typescript-eslint/no-explicit-any
   , _extends({
     ref: ref,
     $shape: props.shape || _constants.SHAPE.DEFAULT,
+    $as: isTapTarget ? 'button' : 'li',
+    $isTapTarget: isTapTarget,
     "aria-label": props['aria-label'],
     "aria-selected": props['aria-selected'],
     id: props.id,
-    role: props.role
+    role: props.role,
+    onClick: props.onClick
   }, rootProps), Artwork && /*#__PURE__*/_react.default.createElement(ArtworkContainer, _extends({
     $artworkSize: artworkSize,
     $sublist: Boolean(props.sublist)

package/list/list-item.js.flow

@@ -53,15 +53,20 @@ const ListItem = React.forwardRef<PropsT, HTMLLIElement>((props: PropsT, ref) =>
     }
   }, [props.artworkSize, props.sublist]);
 
+  const isTapTarget = Boolean(props.onClick);
+
   return (
     <Root
       // flowlint-next-line unclear-type:off
       ref={(ref: any)}
       $shape={props.shape || SHAPE.DEFAULT}
+      $as={isTapTarget ? 'button' : 'li'}
+      $isTapTarget={isTapTarget}
       aria-label={props['aria-label']}
       aria-selected={props['aria-selected']}
       id={props.id}
       role={props.role}
+      onClick={props.onClick}
       {...rootProps}
     >
       {Artwork && (

package/list/styled-components.js

@@ -19,8 +19,10 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 var StyledRoot = (0, _styles.styled)('li', function (_ref) {
   var $theme = _ref.$theme,
-      $shape = _ref.$shape;
-  return {
+      $shape = _ref.$shape,
+      _ref$$isTapTarget = _ref.$isTapTarget,
+      $isTapTarget = _ref$$isTapTarget === void 0 ? false : _ref$$isTapTarget;
+  return _objectSpread({
     alignItems: 'center',
     backgroundColor: $theme.colors.backgroundPrimary,
     display: 'flex',
@@ -31,12 +33,23 @@ var StyledRoot = (0, _styles.styled)('li', function (_ref) {
     borderBottomLeftRadius: $shape === _constants.SHAPE.ROUND ? $theme.borders.radius400 : 0,
     borderBottomRightRadius: $shape === _constants.SHAPE.ROUND ? $theme.borders.radius400 : 0,
     overflow: 'hidden'
-  };
+  }, $isTapTarget ? {
+    // button style reset
+    borderRadius: 0,
+    textAlign: 'inherit',
+    boxShadow: 'none',
+    padding: 0,
+    cursor: 'pointer',
+    border: 'none',
+    color: 'inherit',
+    font: 'inherit'
+  } : {});
 });
 exports.StyledRoot = StyledRoot;
 StyledRoot.displayName = "StyledRoot";
 StyledRoot.displayName = 'StyledRoot';
-var StyledContent = (0, _styles.styled)('div', function (_ref2) {
+var StyledContent = (0, _styles.styled)('div', // @ts-ignore
+function (_ref2) {
   var $mLeft = _ref2.$mLeft,
       $sublist = _ref2.$sublist,
       $theme = _ref2.$theme;

package/list/styled-components.js.flow

@@ -17,20 +17,36 @@ import type {
 import { artworkSizeToValue } from './utils.js';
 import { SHAPE } from './constants.js';
 
-export const StyledRoot = styled<StyledRootPropsT>('li', ({ $theme, $shape }) => {
-  return {
-    alignItems: 'center',
-    backgroundColor: $theme.colors.backgroundPrimary,
-    display: 'flex',
-    listStyleType: 'none',
-    width: '100%',
-    borderTopLeftRadius: $shape === SHAPE.ROUND ? $theme.borders.radius400 : 0,
-    borderTopRightRadius: $shape === SHAPE.ROUND ? $theme.borders.radius400 : 0,
-    borderBottomLeftRadius: $shape === SHAPE.ROUND ? $theme.borders.radius400 : 0,
-    borderBottomRightRadius: $shape === SHAPE.ROUND ? $theme.borders.radius400 : 0,
-    overflow: 'hidden',
-  };
-});
+export const StyledRoot = styled<StyledRootPropsT>(
+  'li',
+  ({ $theme, $shape, $isTapTarget = false }) => {
+    return {
+      alignItems: 'center',
+      backgroundColor: $theme.colors.backgroundPrimary,
+      display: 'flex',
+      listStyleType: 'none',
+      width: '100%',
+      borderTopLeftRadius: $shape === SHAPE.ROUND ? $theme.borders.radius400 : 0,
+      borderTopRightRadius: $shape === SHAPE.ROUND ? $theme.borders.radius400 : 0,
+      borderBottomLeftRadius: $shape === SHAPE.ROUND ? $theme.borders.radius400 : 0,
+      borderBottomRightRadius: $shape === SHAPE.ROUND ? $theme.borders.radius400 : 0,
+      overflow: 'hidden',
+      ...($isTapTarget
+        ? {
+            // button style reset
+            borderRadius: 0,
+            textAlign: 'inherit',
+            boxShadow: 'none',
+            padding: 0,
+            cursor: 'pointer',
+            border: 'none',
+            color: 'inherit',
+            font: 'inherit',
+          }
+        : {}),
+    };
+  }
+);
 
 export const StyledContent = styled<StyledContentPropsT>('div', ({ $mLeft, $sublist, $theme }) => {
   return {

package/list/types.d.ts

@@ -2,26 +2,27 @@ import type * as React from 'react';
 import type { Override } from '../helpers/overrides';
 import type { IconProps } from '../icon';
 import type { ARTWORK_SIZES, SHAPE } from './constants';
-export declare type ArtworkSizes = typeof ARTWORK_SIZES.SMALL | typeof ARTWORK_SIZES.MEDIUM | typeof ARTWORK_SIZES.LARGE;
-export declare type Shape = typeof SHAPE.DEFAULT | typeof SHAPE.ROUND;
-export declare type StyledRootProps = {
+export type ArtworkSizes = typeof ARTWORK_SIZES.SMALL | typeof ARTWORK_SIZES.MEDIUM | typeof ARTWORK_SIZES.LARGE;
+export type Shape = typeof SHAPE.DEFAULT | typeof SHAPE.ROUND;
+export type StyledRootProps = {
     $shape: Shape;
+    $isTapTarget?: boolean;
 };
-export declare type StyledArtworkContainerProps = {
+export type StyledArtworkContainerProps = {
     $artworkSize: ArtworkSizes | number;
     $sublist?: boolean;
 };
-export declare type StyledContentProps = {
+export type StyledContentProps = {
     $mLeft: boolean;
     $sublist: boolean;
 };
-export declare type ListOverrides = {
+export type ListOverrides = {
     Root?: Override;
     ArtworkContainer?: Override;
     Content?: Override;
     EndEnhancerContainer?: Override;
 };
-export declare type ListProps = {
+export type ListProps = {
     artwork?: React.ComponentType<{
         size: IconProps['size'];
     } & IconProps>;
@@ -32,22 +33,23 @@ export declare type ListProps = {
     'aria-label'?: string;
     'aria-selected'?: boolean;
     id?: String;
+    onClick?: (a: React.SyntheticEvent<HTMLButtonElement>) => unknown;
     overrides?: ListOverrides;
     role?: string;
     sublist?: boolean;
 };
-export declare type LabelOverrides = {
+export type LabelOverrides = {
     LabelContent?: Override;
     LabelDescription?: Override;
     LabelSublistContent?: Override;
 };
-export declare type LabelProps = {
+export type LabelProps = {
     children: React.ReactNode;
     description?: React.ReactNode;
     sublist?: boolean;
     overrides?: LabelOverrides;
 };
-export declare type HeadingOverrides = {
+export type HeadingOverrides = {
     Root?: Override;
     Content?: Override;
     HeadingContainer?: Override;
@@ -55,7 +57,7 @@ export declare type HeadingOverrides = {
     EndEnhancerContainer?: Override;
     EndEnhancerDescriptionContainer?: Override;
 };
-export declare type HeadingProps = {
+export type HeadingProps = {
     heading: React.ReactNode | React.ComponentType<{}>;
     subHeading?: React.ReactNode | React.ComponentType<{}>;
     endEnhancer?: React.ReactNode | React.ComponentType<{}>;
@@ -63,10 +65,10 @@ export declare type HeadingProps = {
     overrides?: HeadingOverrides;
     maxLines?: 1 | 2;
 };
-export declare type StyledHeadingHeadingProps = {
+export type StyledHeadingHeadingProps = {
     $maxLines: number;
 };
-export declare type MenuAdapterProps = {
+export type MenuAdapterProps = {
     item?: any;
     onMouseEnter?: (a: MouseEvent) => unknown;
     onClick?: (a: MouseEvent) => unknown;

package/list/types.js.flow

@@ -21,6 +21,7 @@ export type ShapeT = typeof SHAPE.DEFAULT | typeof SHAPE.ROUND;
 
 export type StyledRootPropsT = {
   $shape: ShapeT,
+  $isTapTarget?: boolean,
 };
 export type StyledArtworkContainerPropsT = {
   $artworkSize: ArtworkSizesT | number,
@@ -47,6 +48,7 @@ export type PropsT = {|
   'aria-label'?: string,
   'aria-selected'?: boolean,
   id?: String,
+  onClick?: (SyntheticEvent<HTMLButtonElement>) => mixed,
   overrides?: OverridesT,
   role?: string,
   sublist?: boolean,

package/locale/es_AR.js

@@ -64,6 +64,7 @@ var es_AR = {
     optionsLabel: 'Selecciona una columna para filtrar',
     optionsSearch: 'Busque una columna para filtrar por...',
     optionsEmpty: 'Sin columnas disponibles.',
+    categoricalFilterSearchLabel: 'Buscar categorías',
     categoricalFilterSelectAll: 'Seleccionar Todo',
     categoricalFilterSelectClear: 'Borrar',
     categoricalFilterEmpty: 'No se encontraron categorías',
@@ -86,7 +87,8 @@ var es_AR = {
     booleanColumnTrueShort: 'V',
     booleanColumnFalseShort: 'F',
     selectRow: 'Seleccionar fila',
-    selectAllRows: 'Seleccionar todas las filas'
+    selectAllRows: 'Seleccionar todas las filas',
+    sortColumn: 'Clasificar columna'
   },
   buttongroup: {
     ariaLabel: 'grupo de botones'

package/locale/index.d.ts

@@ -13,34 +13,37 @@ import type { PaginationLocale as PaginationLocaleAlias } from '../pagination';
 import type { SelectLocale as SelectLocaleAlias } from '../select';
 import type { ToastLocale as ToastLocaleAlias } from '../toast';
 export declare const LocaleContext: React.Context<Locale>;
-export declare type LocaleProviderProps = {
-    locale: Partial<Locale>;
+type DeepPartial<T> = {
+    [P in keyof T]?: DeepPartial<T[P]>;
+};
+export type LocaleProviderProps = {
+    locale: DeepPartial<Locale>;
     children: React.ReactNode | undefined | null;
 };
 declare const LocaleProvider: React.FC<LocaleProviderProps>;
 export default LocaleProvider;
 export type { Locale };
 /** @deprecated inded use type exported from the component itself */
-export declare type AccordionLocale = AccordionLocaleAlias;
+export type AccordionLocale = AccordionLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type BreadcrumbLocale = BreadcrumbLocaleAlias;
+export type BreadcrumbLocale = BreadcrumbLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type DatepickerLocale = DatepickerLocaleAlias;
+export type DatepickerLocale = DatepickerLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type DataTableLocale = DataTableLocaleAlias;
+export type DataTableLocale = DataTableLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type ButtonGroupLocale = ButtonGroupLocaleAlias;
+export type ButtonGroupLocale = ButtonGroupLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type FileUploaderLocale = FileUploaderLocaleAlias;
+export type FileUploaderLocale = FileUploaderLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type MenuLocale = MenuLocaleAlias;
+export type MenuLocale = MenuLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type ModalLocale = ModalLocaleAlias;
+export type ModalLocale = ModalLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type DrawerLocale = DrawerLocaleAlias;
+export type DrawerLocale = DrawerLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type PaginationLocale = PaginationLocaleAlias;
+export type PaginationLocale = PaginationLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type SelectLocale = SelectLocaleAlias;
+export type SelectLocale = SelectLocaleAlias;
 /** @deprecated inded use type exported from the component itself */
-export declare type ToastLocale = ToastLocaleAlias;
+export type ToastLocale = ToastLocaleAlias;

package/locale/index.js

@@ -25,6 +25,7 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
+// @ts-ignore
 var LocaleContext = /*#__PURE__*/React.createContext(_en_US.default);
 exports.LocaleContext = LocaleContext;
 
@@ -34,9 +35,14 @@ var LocaleProvider = function LocaleProvider(props) {
   var locale = props.locale,
       children = props.children;
   var parentLocale = (_React$useContext = React.useContext(LocaleContext)) !== null && _React$useContext !== void 0 ? _React$useContext : {};
-  return /*#__PURE__*/React.createElement(LocaleContext.Provider, {
-    value: (0, _justExtend.default)({}, _en_US.default, parentLocale, locale)
-  }, children);
+  return (
+    /*#__PURE__*/
+    // this is poorly documented but specifying true enforces that the object is deeply extended
+    // https://www.npmjs.com/package/just-extend
+    React.createElement(LocaleContext.Provider, {
+      value: (0, _justExtend.default)(true, {}, _en_US.default, parentLocale, locale)
+    }, children)
+  );
 };
 
 var _default = LocaleProvider;

package/locale/tr_TR.js

@@ -64,6 +64,7 @@ var tr_TR = {
     optionsLabel: 'Filtrelenecek sütunu seçin',
     optionsSearch: 'Filtrelemek için bir sütun arayın...',
     optionsEmpty: 'Sütun yok.',
+    categoricalFilterSearchLabel: 'Arama kategorileri',
     categoricalFilterSelectAll: 'Tümünü Seç',
     categoricalFilterSelectClear: 'Temizle',
     categoricalFilterEmpty: 'Kategori bulunamadı',
@@ -86,7 +87,8 @@ var tr_TR = {
     booleanColumnTrueShort: 'D',
     booleanColumnFalseShort: 'Y',
     selectRow: 'satır seç',
-    selectAllRows: 'Tüm satırları seç'
+    selectAllRows: 'Tüm satırları seç',
+    sortColumn: 'Sıralama sütunu'
   },
   buttongroup: {
     ariaLabel: 'buton grup'

package/locale/types.d.ts

@@ -10,7 +10,7 @@ import type { DrawerLocale } from '../drawer';
 import type { PaginationLocale } from '../pagination';
 import type { SelectLocale } from '../select';
 import type { ToastLocale } from '../toast';
-export declare type Locale = {
+export type Locale = {
     accordion: AccordionLocale;
     breadcrumbs: BreadcrumbLocale;
     datepicker: DatepickerLocale;

package/map-marker/calculate-offsets.d.ts

@@ -0,0 +1,2 @@
+import type { FloatingRouteMarkerAnchorPositions } from './types';
+export declare function calculateFloatingRouteMarkerOffsets(anchorPosition: FloatingRouteMarkerAnchorPositions, offset?: number): string;

package/map-marker/calculate-offsets.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.calculateFloatingRouteMarkerOffsets = calculateFloatingRouteMarkerOffsets;
+
+var _constants = require("./constants");
+
+var _Object$freeze;
+
+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; }
+
+var arrowSize = 8;
+var FLOATING_ROUTE_MARKER_OFFSETS = Object.freeze((_Object$freeze = {}, _defineProperty(_Object$freeze, _constants.FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.topLeft, function (offset) {
+  return "translate(calc(".concat(arrowSize, "px + ").concat(offset, "px), calc(").concat(arrowSize, "px + ").concat(offset, "px))");
+}), _defineProperty(_Object$freeze, _constants.FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.topRight, function (offset) {
+  return "translate(calc(-100% - ".concat(arrowSize, "px - ").concat(offset, "px), calc(").concat(arrowSize, "px + ").concat(offset, "px))");
+}), _defineProperty(_Object$freeze, _constants.FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.bottomLeft, function (offset) {
+  return "translate(calc(".concat(arrowSize, "px + ").concat(offset, "px), calc(-100% - ").concat(arrowSize, "px - ").concat(offset, "px))");
+}), _defineProperty(_Object$freeze, _constants.FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.bottomRight, function (offset) {
+  return "translate(calc(-100% - ".concat(arrowSize, "px - ").concat(offset, "px), calc(-100% - ").concat(arrowSize, "px - ").concat(offset, "px))");
+}), _defineProperty(_Object$freeze, _constants.FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.topCenter, function (offset) {
+  return "translate(-50%, calc(".concat(arrowSize, "px + ").concat(offset, "px))");
+}), _defineProperty(_Object$freeze, _constants.FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.bottomCenter, function (offset) {
+  return "translate(-50%, calc(-100% - ".concat(arrowSize, "px - ").concat(offset, "px))");
+}), _defineProperty(_Object$freeze, _constants.FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.leftCenter, function (offset) {
+  return "translate(calc(".concat(arrowSize, "px + ").concat(offset, "px), -50% )");
+}), _defineProperty(_Object$freeze, _constants.FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.rightCenter, function (offset) {
+  return "translate(calc(-100% - ".concat(arrowSize, "px - ").concat(offset, "px), -50%)");
+}), _Object$freeze));
+
+function calculateFloatingRouteMarkerOffsets(anchorPosition) {
+  var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+  return FLOATING_ROUTE_MARKER_OFFSETS[anchorPosition](offset);
+}

package/map-marker/calculate-offsets.js.flow

@@ -0,0 +1,47 @@
+/*
+Copyright (c) Uber Technologies, Inc.
+
+This source code is licensed under the MIT license found in the
+LICENSE file in the root directory of this source tree.
+*/
+// @flow
+import { FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS } from './constants';
+import type { FloatingRouteMarkerAnchorPositionsT } from './types';
+
+const arrowSize = 8;
+const FLOATING_ROUTE_MARKER_OFFSETS = Object.freeze({
+  [FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.topLeft]: (offset) =>
+    `translate(calc(${arrowSize}px + ${offset}px), calc(${arrowSize}px + ${offset}px))`,
+
+  [FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.topRight]: (offset) =>
+    `translate(calc(-100% - ${arrowSize}px - ${offset}px), calc(${arrowSize}px + ${offset}px))`,
+
+  [FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.bottomLeft]: (offset) =>
+    `translate(calc(${arrowSize}px + ${offset}px), calc(-100% - ${arrowSize}px - ${offset}px))`,
+
+  [FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.bottomRight]: (offset) =>
+    `translate(calc(-100% - ${arrowSize}px - ${offset}px), calc(-100% - ${arrowSize}px - ${offset}px))`,
+
+  [FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.topCenter]: (offset) =>
+    `translate(-50%, calc(${arrowSize}px + ${offset}px))`,
+
+  [FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.bottomCenter]: (offset) =>
+    `translate(-50%, calc(-100% - ${arrowSize}px - ${offset}px))`,
+
+  [FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.leftCenter]: (offset) =>
+    `translate(calc(${arrowSize}px + ${offset}px), -50% )`,
+
+  [FLOATING_ROUTE_MARKER_ANCHOR_POSITIONS.rightCenter]: (offset) =>
+    `translate(calc(-100% - ${arrowSize}px - ${offset}px), -50%)`,
+});
+
+export function calculateFloatingRouteMarkerOffsets(
+  anchorPosition: FloatingRouteMarkerAnchorPositionsT,
+  offset: number = 0
+) {
+  return FLOATING_ROUTE_MARKER_OFFSETS[anchorPosition](offset);
+}
+
+declare var __DEV__: boolean;
+declare var __NODE__: boolean;
+declare var __BROWSER__: boolean;