baseui 0.0.0-next-2992a67 → 0.0.0-next-ecc760f

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/constants.js

@@ -22,7 +22,8 @@ var NEEDLE_SIZES = Object.freeze({
   tall: 'tall'
 });
 exports.NEEDLE_SIZES = NEEDLE_SIZES;
-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));
+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)); // Important: keep this sorted by size, as it used to determine label size when a secondary label is used.
+
 exports.NEEDLE_HEIGHTS = NEEDLE_HEIGHTS;
 var PINHEAD_SIZES_SHAPES = Object.freeze({
   xxSmallCircle: 'xx-small-circle',

package/map-marker/fixed-marker.js.flow

@@ -6,136 +6,12 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 import * as React from 'react';
-import { useStyletron, type ThemeT } from '../styles/index.js';
-import { getOverrides } from '../helpers/overrides.js';
-import {
-  PINHEAD_TYPES,
-  NEEDLE_SIZES,
-  PINHEAD_SIZES_SHAPES,
-  LABEL_ENHANCER_POSITIONS,
-  KIND,
-  dragShadowHeight,
-  dragShadowMarginTop,
-} from './constants.js';
-import PinHead from './pin-head.js';
-import Needle from './needle.js';
-import DragShadow from './drag-shadow.js';
-import { StyledFixedMarkerDragContainer, StyledFixedMarkerRoot } from './styled-components.js';
-import type { FixedMarkerPropsT, KindT } from './types.js';
-
-type Colors = {
-  color: string,
-  backgroundColor: string,
-};
-
-function getColors(kind: KindT, theme: ThemeT): Colors {
-  if (kind === KIND.accent) {
-    return {
-      color: theme.colors.contentInversePrimary,
-      backgroundColor: theme.colors.backgroundAccent,
-    };
-  }
-  if (kind === KIND.negative) {
-    return {
-      color: theme.colors.contentInversePrimary,
-      backgroundColor: theme.colors.backgroundNegative,
-    };
-  }
-  return {
-    color: theme.colors.contentInversePrimary,
-    backgroundColor: theme.colors.backgroundInversePrimary,
-  };
-}
-
-const FixedMarker = ({
-  size = PINHEAD_SIZES_SHAPES.medium,
-  needle = NEEDLE_SIZES.medium,
-  label,
-  startEnhancer,
-  endEnhancer,
-  kind = KIND.default,
-  dragging = false,
-  overrides = {},
-  labelEnhancerContent = null,
-  labelEnhancerPosition = LABEL_ENHANCER_POSITIONS.bottom,
-  badgeEnhancerSize = null,
-  badgeEnhancerContent = null,
-  ...restProps
-}: FixedMarkerPropsT) => {
-  const [, theme] = useStyletron();
-  const { color, backgroundColor } = getColors(kind, theme);
-
-  const doesPinHeadTransformOnDrag =
-    needle !== NEEDLE_SIZES.none &&
-    size !== PINHEAD_SIZES_SHAPES.xxSmallCircle &&
-    size !== PINHEAD_SIZES_SHAPES.xxSmallSquare;
-
-  const [Root, rootProps] = getOverrides(overrides.Root, StyledFixedMarkerRoot);
-  const [FixedMarkerDragContainer, fixedMarkerDragContainerProps] = getOverrides(
-    overrides.DragContainer,
-    StyledFixedMarkerDragContainer
-  );
-
-  const renderNeedle =
-    needle !== NEEDLE_SIZES.none &&
-    ![PINHEAD_SIZES_SHAPES.xxSmallCircle, PINHEAD_SIZES_SHAPES.xxSmallSquare].includes(size);
-
-  if (__DEV__) {
-    if (
-      needle !== NEEDLE_SIZES.none &&
-      [PINHEAD_SIZES_SHAPES.xxSmallCircle, PINHEAD_SIZES_SHAPES.xxSmallSquare].includes(size)
-    ) {
-      console.warn(
-        `Needles cannot be rendered with ${PINHEAD_SIZES_SHAPES.xxSmallCircle} or ${PINHEAD_SIZES_SHAPES.xxSmallSquare} pin heads`
-      );
-    }
-  }
-  const enhancers = {};
-  if (startEnhancer) {
-    enhancers.startEnhancer = startEnhancer;
-  }
-  if (endEnhancer) {
-    enhancers.endEnhancer = endEnhancer;
-  }
-  return (
-    <Root data-baseweb="fixed-map-marker" {...rootProps}>
-      <FixedMarkerDragContainer
-        $translateAmount={dragShadowMarginTop + dragShadowHeight}
-        $performTranslate={doesPinHeadTransformOnDrag && !dragging}
-        {...fixedMarkerDragContainerProps}
-      >
-        <PinHead
-          size={size}
-          label={label}
-          {...enhancers}
-          color={color}
-          background={backgroundColor}
-          type={PINHEAD_TYPES.fixed}
-          overrides={overrides}
-          badgeEnhancerSize={badgeEnhancerSize}
-          badgeEnhancerContent={badgeEnhancerContent}
-          labelEnhancerContent={labelEnhancerContent}
-          labelEnhancerPosition={labelEnhancerPosition}
-          needle={needle}
-        />
-        {renderNeedle && (
-          <Needle size={needle} background={backgroundColor} overrides={overrides} />
-        )}
-      </FixedMarkerDragContainer>
-      {doesPinHeadTransformOnDrag && (
-        <DragShadow
-          background={backgroundColor}
-          dragging={dragging}
-          height={dragShadowMarginTop + dragShadowHeight}
-          overrides={overrides}
-        />
-      )}
-    </Root>
-  );
-};
+import type { FixedMarkerPropsT } from './types.js';
+declare var FixedMarker: (props: FixedMarkerPropsT) => React.Node;
 
 export default FixedMarker;
 
+
 declare var __DEV__: boolean;
 declare var __NODE__: boolean;
 declare var __BROWSER__: boolean;

package/map-marker/floating-marker.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import type { FloatingMarkerProps } from './types';
-declare const FloatingMarker: ({ label, size, anchor, endEnhancer, startEnhancer, anchorType, overrides, }: FloatingMarkerProps) => JSX.Element;
+declare const FloatingMarker: ({ label, secondaryLabel, size, anchor, endEnhancer, startEnhancer, anchorType, overrides, }: FloatingMarkerProps) => JSX.Element;
 export default FloatingMarker;

package/map-marker/floating-marker.js

@@ -39,6 +39,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+// @ts-ignore
 function getAnchorPinHeadSize(anchorType) {
   if (anchorType === _constants.FLOATING_MARKER_ANCHOR_TYPES.circle) {
     return _constants.PINHEAD_SIZES_SHAPES.xSmallCircle;
@@ -53,6 +54,7 @@ function getAnchorPinHeadSize(anchorType) {
 
 var FloatingMarker = function FloatingMarker(_ref) {
   var label = _ref.label,
+      secondaryLabel = _ref.secondaryLabel,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? _constants.PINHEAD_SIZES_SHAPES.medium : _ref$size,
       _ref$anchor = _ref.anchor,
@@ -102,6 +104,7 @@ var FloatingMarker = function FloatingMarker(_ref) {
     background: backgroundPrimary,
     type: _constants.PINHEAD_TYPES.floating,
     label: label,
+    secondaryLabel: secondaryLabel,
     startEnhancer: startEnhancer,
     endEnhancer: endEnhancer,
     overrides: overrides

package/map-marker/floating-marker.js.flow

@@ -6,98 +6,8 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 import * as React from 'react';
-import { useStyletron } from '../styles/index.js';
-import PinHead from './pin-head.js';
-import { getOverrides } from '../helpers/overrides.js';
-import {
-  StyledFloatingMarkerRoot,
-  StyledFloatingMarkerAnchorContainer,
-  StyledFloatingMarkerPinHeadContainer,
-} from './styled-components.js';
 import type { FloatingMarkerPropsT } from './types.js';
-import {
-  FLOATING_MARKER_ANCHOR_POSITIONS,
-  PINHEAD_SIZES_SHAPES,
-  PINHEAD_TYPES,
-  FLOATING_MARKER_ANCHOR_TYPES,
-  PINHEAD_DIMENSIONS,
-} from './constants.js';
-
-function getAnchorPinHeadSize(anchorType) {
-  if (anchorType === FLOATING_MARKER_ANCHOR_TYPES.circle) {
-    return PINHEAD_SIZES_SHAPES.xSmallCircle;
-  } else if (anchorType === FLOATING_MARKER_ANCHOR_TYPES.square) {
-    return PINHEAD_SIZES_SHAPES.xSmallSquare;
-  } else if (anchorType === FLOATING_MARKER_ANCHOR_TYPES.xxSmallSquare) {
-    return PINHEAD_SIZES_SHAPES.xxSmallSquare;
-  } else {
-    return PINHEAD_SIZES_SHAPES.xxSmallCircle;
-  }
-}
-
-const FloatingMarker = ({
-  label,
-  size = PINHEAD_SIZES_SHAPES.medium,
-  anchor = FLOATING_MARKER_ANCHOR_POSITIONS.bottomLeft,
-  endEnhancer,
-  startEnhancer,
-  anchorType = FLOATING_MARKER_ANCHOR_TYPES.circle,
-  overrides = {},
-}: FloatingMarkerPropsT) => {
-  const [, theme] = useStyletron();
-  const {
-    colors: { backgroundPrimary, backgroundInversePrimary, primaryA, primaryB },
-  } = theme;
-
-  const anchorPinHeadSize = getAnchorPinHeadSize(anchorType);
-
-  const [Root, rootProps] = getOverrides(overrides.Root, StyledFloatingMarkerRoot);
-  const [FloatingMarkerPinHeadContainer, floatingMarkerPinHeadContainerProps] = getOverrides(
-    overrides.PinHeadContainer,
-    StyledFloatingMarkerPinHeadContainer
-  );
-
-  const [FloatingMarkerAnchorContainer, floatingMarkerAnchorContainerProps] = getOverrides(
-    overrides.AnchorContainer,
-    StyledFloatingMarkerAnchorContainer
-  );
-
-  return (
-    <Root
-      data-baseweb="floating-map-marker"
-      $size={PINHEAD_DIMENSIONS[anchorPinHeadSize].height}
-      {...rootProps}
-    >
-      <FloatingMarkerPinHeadContainer
-        $anchor={anchor}
-        $anchorSize={PINHEAD_DIMENSIONS[anchorPinHeadSize].height}
-        {...floatingMarkerPinHeadContainerProps}
-      >
-        <PinHead
-          size={size}
-          color={primaryA}
-          background={backgroundPrimary}
-          type={PINHEAD_TYPES.floating}
-          label={label}
-          startEnhancer={startEnhancer}
-          endEnhancer={endEnhancer}
-          overrides={overrides}
-        />
-      </FloatingMarkerPinHeadContainer>
-      {anchor !== FLOATING_MARKER_ANCHOR_POSITIONS.none && (
-        <FloatingMarkerAnchorContainer {...floatingMarkerAnchorContainerProps}>
-          <PinHead
-            size={anchorPinHeadSize}
-            color={primaryB}
-            background={backgroundInversePrimary}
-            type={PINHEAD_TYPES.fixed}
-            overrides={overrides}
-          />
-        </FloatingMarkerAnchorContainer>
-      )}
-    </Root>
-  );
-};
+declare var FloatingMarker: (props: FloatingMarkerPropsT) => React.Node;
 
 export default FloatingMarker;
 

package/map-marker/floating-route-marker.js

@@ -40,10 +40,8 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var FloatingRouteMarker = function FloatingRouteMarker(_ref) {
   var label = _ref.label,
       secondaryLabel = _ref.secondaryLabel,
-      _ref$startEnhancer = _ref.startEnhancer,
-      StartEnhancer = _ref$startEnhancer === void 0 ? null : _ref$startEnhancer,
-      _ref$endEnhancer = _ref.endEnhancer,
-      EndEnhancer = _ref$endEnhancer === void 0 ? null : _ref$endEnhancer,
+      StartEnhancer = _ref.startEnhancer,
+      EndEnhancer = _ref.endEnhancer,
       _ref$selected = _ref.selected,
       selected = _ref$selected === void 0 ? false : _ref$selected,
       _ref$anchorPosition = _ref.anchorPosition,
@@ -65,7 +63,7 @@ var FloatingRouteMarker = function FloatingRouteMarker(_ref) {
       Root = _getOverrides2[0],
       rootProps = _getOverrides2[1];
 
-  var _getOverrides3 = (0, _overrides.getOverrides)(overrides.IconContainer, _styledComponents.StyledContentItem),
+  var _getOverrides3 = (0, _overrides.getOverrides)(overrides.IconContainer, _styledComponents.StyledLabelSlot),
       _getOverrides4 = _slicedToArray(_getOverrides3, 2),
       IconContainer = _getOverrides4[0],
       iconContainerProps = _getOverrides4[1];