@maplibre/maplibre-react-native 9.1.0 → 10.0.0-alpha.2

package/javascript/components/{Camera.js → Camera.tsx}

@@ -1,210 +1,222 @@
-import {toJSONString, viewPropTypes, existenceChange} from '../utils';
+import {toJSONString, existenceChange} from '../utils';
 import * as geoUtils from '../utils/geoUtils';
+import {MaplibreGLEvent} from '../types';
 
-import PropTypes from 'prop-types';
-import {NativeModules, requireNativeComponent} from 'react-native';
-import React from 'react';
+import {
+  NativeMethods,
+  NativeModules,
+  requireNativeComponent,
+  ViewProps,
+} from 'react-native';
+import React, {Component, MutableRefObject, ReactElement} from 'react';
 
 const MapLibreGL = NativeModules.MGLModule;
 
 export const NATIVE_MODULE_NAME = 'RCTMGLCamera';
 
-const SettingsPropTypes = {
+export enum UserTrackingMode {
+  Follow = 'normal',
+  FollowWithHeading = 'compass',
+  FollowWithCourse = 'course',
+}
+
+export type UserTrackingModeChangeCallback = (
+  event: MaplibreGLEvent<
+    'usertrackingmodechange',
+    {
+      followUserLocation: boolean;
+      followUserMode: UserTrackingMode | null;
+    }
+  >,
+) => void;
+
+export interface CameraRef {
+  setCamera: (config: CameraStop | CameraStops) => void;
+  fitBounds: (
+    ne: GeoJSON.Position,
+    sw: GeoJSON.Position,
+    paddingConfig?: number | number[],
+    animationDuration?: number,
+  ) => void;
+  flyTo: (
+    centerCoordinate: GeoJSON.Position,
+    animationDuration?: number,
+  ) => void;
+  moveTo: (
+    centerCoordinate: GeoJSON.Position,
+    animationDuration?: number,
+  ) => void;
+  zoomTo: (zoomLevel: number, animationDuration?: number) => void;
+}
+
+export interface CameraPadding {
+  /**
+   * Left padding in points
+   */
+  paddingLeft?: number;
   /**
-   * Center coordinate on map [lng, lat]
+   * Right padding in points
    */
-  centerCoordinate: PropTypes.arrayOf(PropTypes.number),
+  paddingRight?: number;
+  /**
+   * Top padding in points
+   */
+  paddingTop?: number;
+  /**
+   * Bottom padding in points
+   */
+  paddingBottom?: number;
+}
 
+export interface CameraBounds {
+  /**
+   * North east coordinate of bound
+   */
+  ne: number[];
   /**
-   * Padding around edges of map in points
+   * South west coordinate of bound
    */
-  padding: PropTypes.shape({
-    /**
-     * Left padding in points
-     */
-    paddingLeft: PropTypes.number,
-
-    /**
-     * Right padding in points
-     */
-    paddingRight: PropTypes.number,
-
-    /**
-     * Top padding in points
-     */
-    paddingTop: PropTypes.number,
-
-    /**
-     * Bottom padding in points
-     */
-    paddingBottom: PropTypes.number,
-  }),
+  sw: number[];
+}
+
+interface CameraBoundsWithPadding
+  extends CameraBounds,
+    Partial<CameraPadding> {}
+
+type NativeAnimationMode = 'flight' | 'ease' | 'linear' | 'none' | 'move';
+export type CameraAnimationMode = 'flyTo' | 'easeTo' | 'linearTo' | 'moveTo';
+
+export interface NativeCameraStop extends Required<CameraPadding> {
+  mode: NativeAnimationMode;
+  pitch?: number;
+  heading?: number;
+  duration: number;
+  zoom?: number;
+  centerCoordinate?: string;
+  bounds?: string;
+}
+
+export interface CameraStop {
+  /** The location on which the map should center. */
+  centerCoordinate?: GeoJSON.Position;
+  /** The corners of a box around which the map should bound. Contains padding props for backwards
+   * compatibility; the root `padding` prop should be used instead. */
+  bounds?: CameraBoundsWithPadding;
+  /** The heading (orientation) of the map. */
+  heading?: number;
+  /** The pitch of the map. */
+  pitch?: number;
+  /** The zoom level of the map. */
+  zoomLevel?: number;
+  /** The viewport padding in points. */
+  padding?: CameraPadding;
+  /** The duration the map takes to animate to a new configuration. */
+  animationDuration?: number;
+  /** The easing or path the camera uses to animate to a new configuration. */
+  animationMode?: CameraAnimationMode;
+}
+
+export type CameraStops = {
+  stops: CameraStop[];
+};
 
+interface CameraProps extends Omit<ViewProps, 'style'>, CameraStop {
   /**
-   * Heading on map
+   * If false, the camera will not send any props to the native module. Intended to be used to prevent unnecessary tile fetching and improve performance when the map is not visible. Defaults to true.
    */
-  heading: PropTypes.number,
+  allowUpdates?: boolean;
 
   /**
-   * Pitch on map
+   * Default view settings applied on camera
    */
-  pitch: PropTypes.number,
+  defaultSettings?: CameraStop;
 
   /**
-   * Represents a rectangle in geographical coordinates marking the visible area of the map.
-   * The `bounds.padding*` properties are deprecated; use root `padding` property instead.
+   * The minimun zoom level of the map
    */
-  bounds: PropTypes.shape({
-    /**
-     * North east coordinate of bound
-     */
-    ne: PropTypes.arrayOf(PropTypes.number).isRequired,
-
-    /**
-     * South west coordinate of bound
-     */
-    sw: PropTypes.arrayOf(PropTypes.number).isRequired,
-
-    /**
-     * Left padding in points (deprecated; use root `padding` property instead)
-     */
-    paddingLeft: PropTypes.number,
-
-    /**
-     * Right padding in points (deprecated; use root `padding` property instead)
-     */
-    paddingRight: PropTypes.number,
-
-    /**
-     * Top padding in points (deprecated; use root `padding` property instead)
-     */
-    paddingTop: PropTypes.number,
-
-    /**
-     * Bottom padding in points (deprecated; use root `padding` property instead)
-     */
-    paddingBottom: PropTypes.number,
-  }),
+  minZoomLevel?: number;
 
   /**
-   * Callback that is triggered on user tracking mode changes
+   * The maximun zoom level of the map
    */
-  onUserTrackingModeChange: PropTypes.func,
+  maxZoomLevel?: number;
 
   /**
-   * Zoom level of the map
+   * Restrict map panning so that the center is within these bounds
    */
-  zoomLevel: PropTypes.number,
-};
+  maxBounds?: CameraBounds;
 
-class Camera extends React.Component {
-  static propTypes = {
-    ...viewPropTypes,
-
-    /**
-     * If false, the camera will not send any props to the native module. Intended to be used to prevent unnecessary tile fetching and improve performance when the map is not visible. Defaults to true.
-     */
-    allowUpdates: PropTypes.bool,
-
-    /**
-     * The duration a camera update takes (in ms)
-     */
-    animationDuration: PropTypes.number,
-
-    /**
-     * The animationstyle when the camara updates. One of: `flyTo`, `easeTo`, `linearTo`, `moveTo`
-     */
-    animationMode: PropTypes.oneOf(['flyTo', 'easeTo', 'linearTo', 'moveTo']),
-
-    /**
-     * Default view settings applied on camera
-     */
-    defaultSettings: PropTypes.shape(SettingsPropTypes),
-
-    // normal - view settings
-    ...SettingsPropTypes,
-
-    /**
-     * The minimun zoom level of the map
-     */
-    minZoomLevel: PropTypes.number,
-
-    /**
-     * The maximun zoom level of the map
-     */
-    maxZoomLevel: PropTypes.number,
-
-    /**
-     * Restrict map panning so that the center is within these bounds
-     */
-    maxBounds: PropTypes.shape({
-      /**
-       * northEastCoordinates - North east coordinate of bound
-       */
-      ne: PropTypes.arrayOf(PropTypes.number).isRequired,
-
-      /**
-       * southWestCoordinates - South west coordinate of bound
-       */
-      sw: PropTypes.arrayOf(PropTypes.number).isRequired,
-    }),
-
-    /**
-     * Should the map orientation follow the user's.
-     */
-    followUserLocation: PropTypes.bool,
-
-    /**
-     * The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the `MapLibreGL.UserTrackingModes` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](../example/src/examples/Camera/SetUserTrackingModes.js)
-     */
-    followUserMode: PropTypes.oneOf(['normal', 'compass', 'course']),
-
-    /**
-     * The zoomLevel on map while followUserLocation is set to `true`
-     */
-    followZoomLevel: PropTypes.number,
-
-    /**
-     * The pitch on map while followUserLocation is set to `true`
-     */
-    followPitch: PropTypes.number,
-
-    /**
-     * The heading on map while followUserLocation is set to `true`
-     */
-    followHeading: PropTypes.number,
-
-    /**
-     * Manually update the camera - helpful for when props did not update, however you still want the camera to move
-     */
-    triggerKey: PropTypes.any,
-
-    // Triggered when the
-    onUserTrackingModeChange: PropTypes.func,
-  };
+  /**
+   * Should the map orientation follow the user's.
+   */
+  followUserLocation?: boolean;
 
+  /**
+   * The mode used to track the user location on the map. One of; "normal", "compass", "course". Each mode string is also available as a member on the `MapLibreGL.UserTrackingModes` object. `Follow` (normal), `FollowWithHeading` (compass), `FollowWithCourse` (course). NOTE: `followUserLocation` must be set to `true` for any of the modes to take effect. [Example](../example/src/examples/Camera/SetUserTrackingModes.js)
+   */
+  followUserMode?: UserTrackingMode;
+
+  /**
+   * The zoomLevel on map while followUserLocation is set to `true`
+   */
+  followZoomLevel?: number;
+
+  /**
+   * The pitch on map while followUserLocation is set to `true`
+   */
+  followPitch?: number;
+
+  /**
+   * The heading on map while followUserLocation is set to `true`
+   */
+  followHeading?: number;
+
+  /**
+   * Manually update the camera - helpful for when props did not update, however you still want the camera to move
+   */
+  triggerKey?: string | number;
+
+  // Triggered when the
+  onUserTrackingModeChange?: UserTrackingModeChangeCallback;
+}
+
+interface NativeProps extends Omit<CameraProps, 'maxBounds'> {
+  maxBounds: string | null;
+  stop: NativeCameraStop | null;
+  defaultStop: NativeCameraStop | null;
+}
+
+class Camera extends React.Component<CameraProps> {
   static defaultProps = {
     allowUpdates: true,
     animationMode: 'easeTo',
     animationDuration: 2000,
   };
 
-  static Mode = {
-    Flight: 'flyTo',
-    Move: 'moveTo',
-    Ease: 'easeTo',
-    Linear: 'linearTo',
-  };
+  defaultCamera: NativeCameraStop | null = null;
+  cameraRef: MutableRefObject<
+    (Component<NativeProps> & Readonly<NativeMethods>) | null
+  >;
+
+  constructor(props: CameraProps) {
+    super(props);
+    this.cameraRef = React.createRef<
+      Component<NativeProps> & Readonly<NativeMethods>
+    >();
+  }
 
-  UNSAFE_componentWillReceiveProps(nextProps) {
+  UNSAFE_componentWillReceiveProps(nextProps: CameraProps): void {
     this._handleCameraChange(this.props, nextProps);
   }
 
-  shouldComponentUpdate() {
+  shouldComponentUpdate(): boolean {
     return false;
   }
 
-  _handleCameraChange(currentCamera, nextCamera) {
+  _handleCameraChange(
+    currentCamera: CameraProps,
+    nextCamera: CameraProps,
+  ): void {
     const c = currentCamera;
     const n = nextCamera;
 
@@ -218,15 +230,15 @@ class Camera extends React.Component {
     }
 
     if (c.followUserLocation && !n.followUserLocation) {
-      this.refs.camera.setNativeProps({followUserLocation: false});
+      this.cameraRef.current?.setNativeProps({followUserLocation: false});
       return;
     }
     if (!c.followUserLocation && n.followUserLocation) {
-      this.refs.camera.setNativeProps({followUserLocation: true});
+      this.cameraRef.current?.setNativeProps({followUserLocation: true});
     }
 
     if (n.followUserLocation) {
-      this.refs.camera.setNativeProps({
+      this.cameraRef.current?.setNativeProps({
         followUserMode: n.followUserMode,
         followPitch: n.followPitch || n.pitch,
         followHeading: n.followHeading || n.heading,
@@ -236,22 +248,22 @@ class Camera extends React.Component {
     }
 
     if (n.maxBounds) {
-      this.refs.camera.setNativeProps({
+      this.cameraRef.current?.setNativeProps({
         maxBounds: this._getMaxBounds(),
       });
     }
     if (n.minZoomLevel) {
-      this.refs.camera.setNativeProps({
+      this.cameraRef.current?.setNativeProps({
         minZoomLevel: this.props.minZoomLevel,
       });
     }
     if (n.maxZoomLevel) {
-      this.refs.camera.setNativeProps({
+      this.cameraRef.current?.setNativeProps({
         maxZoomLevel: this.props.maxZoomLevel,
       });
     }
 
-    const cameraConfig = {
+    const cameraConfig: CameraStop = {
       bounds: undefined,
       centerCoordinate: undefined,
       padding: n.padding,
@@ -291,15 +303,18 @@ class Camera extends React.Component {
     }
   }
 
-  _hasCameraChanged(currentCamera, nextCamera) {
+  _hasCameraChanged(
+    currentCamera: CameraProps,
+    nextCamera: CameraProps,
+  ): boolean {
     const c = currentCamera;
     const n = nextCamera;
 
     const hasDefaultPropsChanged =
       c.heading !== n.heading ||
       this._hasCenterCoordinateChanged(
-        c.centerCoordinate,
-        n.centerCoordinate,
+        c?.centerCoordinate,
+        n?.centerCoordinate,
       ) ||
       this._hasBoundsChanged(c.bounds, n.bounds) ||
       this._hasPaddingChanged(c.padding, n.padding) ||
@@ -331,60 +346,66 @@ class Camera extends React.Component {
     );
   }
 
-  _hasCenterCoordinateChanged(cC, nC) {
+  _hasCenterCoordinateChanged(
+    cC?: GeoJSON.Position,
+    nC?: GeoJSON.Position,
+  ): boolean {
     if (!cC && !nC) {
       return false;
     }
 
-    if (existenceChange(cC, nC)) {
+    if (existenceChange(!!cC, !!nC)) {
       return true;
     }
 
-    const isLngDiff = cC[0] !== nC[0];
-    const isLatDiff = cC[1] !== nC[1];
+    const isLngDiff = cC?.[0] !== nC?.[0];
+    const isLatDiff = cC?.[1] !== nC?.[1];
     return isLngDiff || isLatDiff;
   }
 
-  _hasBoundsChanged(cB, nB) {
+  _hasBoundsChanged(
+    cB?: CameraBoundsWithPadding,
+    nB?: CameraBoundsWithPadding,
+  ): boolean {
     if (!cB && !nB) {
       return false;
     }
 
-    if (existenceChange(cB, nB)) {
+    if (existenceChange(!!cB, !!nB)) {
       return true;
     }
 
     return (
-      cB.ne[0] !== nB.ne[0] ||
-      cB.ne[1] !== nB.ne[1] ||
-      cB.sw[0] !== nB.sw[0] ||
-      cB.sw[1] !== nB.sw[1] ||
-      cB.paddingTop !== nB.paddingTop ||
-      cB.paddingLeft !== nB.paddingLeft ||
-      cB.paddingRight !== nB.paddingRight ||
-      cB.paddingBottom !== nB.paddingBottom
+      cB?.ne[0] !== nB?.ne[0] ||
+      cB?.ne[1] !== nB?.ne[1] ||
+      cB?.sw[0] !== nB?.sw[0] ||
+      cB?.sw[1] !== nB?.sw[1] ||
+      cB?.paddingTop !== nB?.paddingTop ||
+      cB?.paddingLeft !== nB?.paddingLeft ||
+      cB?.paddingRight !== nB?.paddingRight ||
+      cB?.paddingBottom !== nB?.paddingBottom
     );
   }
 
-  _hasPaddingChanged(cP, nP) {
+  _hasPaddingChanged(cP?: CameraPadding, nP?: CameraPadding): boolean {
     if (!cP && !nP) {
       return false;
     }
 
-    if (existenceChange(cP, nP)) {
+    if (existenceChange(!!cP, !!nP)) {
       return true;
     }
 
     return (
-      cP.paddingTop !== nP.paddingTop ||
-      cP.paddingLeft !== nP.paddingLeft ||
-      cP.paddingRight !== nP.paddingRight ||
-      cP.paddingBottom !== nP.paddingBottom
+      cP?.paddingTop !== nP?.paddingTop ||
+      cP?.paddingLeft !== nP?.paddingLeft ||
+      cP?.paddingRight !== nP?.paddingRight ||
+      cP?.paddingBottom !== nP?.paddingBottom
     );
   }
 
-  _hasNumberChanged(prev, next) {
-    if (existenceChange(prev, next)) {
+  _hasNumberChanged(prev?: number, next?: number): boolean {
+    if (existenceChange(!!prev, !!next)) {
       return true;
     }
 
@@ -411,11 +432,11 @@ class Camera extends React.Component {
    * @return {void}
    */
   fitBounds(
-    northEastCoordinates,
-    southWestCoordinates,
+    northEastCoordinates: number[],
+    southWestCoordinates: number[],
     padding = 0,
     animationDuration = 0.0,
-  ) {
+  ): void {
     const pad = {
       paddingLeft: 0,
       paddingRight: 0,
@@ -442,14 +463,14 @@ class Camera extends React.Component {
       pad.paddingBottom = padding;
     }
 
-    return this.setCamera({
+    this.setCamera({
       bounds: {
         ne: northEastCoordinates,
         sw: southWestCoordinates,
       },
       padding: pad,
       animationDuration,
-      animationMode: Camera.Mode.Ease,
+      animationMode: 'easeTo',
     });
   }
 
@@ -464,11 +485,11 @@ class Camera extends React.Component {
    *  @param {Number=} animationDuration - Duration of camera animation
    *  @return {void}
    */
-  flyTo(coordinates, animationDuration = 2000) {
-    return this.setCamera({
+  flyTo(coordinates: GeoJSON.Position, animationDuration = 2000): void {
+    this.setCamera({
       centerCoordinate: coordinates,
       animationDuration,
-      animationMode: Camera.Mode.Flight,
+      animationMode: 'flyTo',
     });
   }
 
@@ -483,8 +504,8 @@ class Camera extends React.Component {
    *  @param {Number=} animationDuration - Duration of camera animation
    *  @return {void}
    */
-  moveTo(coordinates, animationDuration = 0) {
-    return this.setCamera({
+  moveTo(coordinates: GeoJSON.Position, animationDuration = 0): void {
+    this.setCamera({
       centerCoordinate: coordinates,
       animationDuration,
     });
@@ -501,11 +522,11 @@ class Camera extends React.Component {
    * @param {Number=} animationDuration - Duration of camera animation
    * @return {void}
    */
-  zoomTo(zoomLevel, animationDuration = 2000) {
-    return this.setCamera({
+  zoomTo(zoomLevel: number, animationDuration = 2000): void {
+    this.setCamera({
       zoomLevel,
       animationDuration,
-      animationMode: Camera.Mode.Flight,
+      animationMode: 'flyTo',
     });
   }
 
@@ -528,27 +549,30 @@ class Camera extends React.Component {
    *
    *  @param {Object} config - Camera configuration
    */
-  setCamera(config = {}) {
+  setCamera(config: CameraStop | CameraStops = {}): void {
     this._setCamera(config);
   }
 
-  _setCamera(config = {}) {
-    let cameraConfig = {};
-
-    if (config.stops) {
-      cameraConfig.stops = [];
+  _setCamera(config: CameraStop | CameraStops = {}): void {
+    if ('stops' in config) {
+      let nativeStops: NativeCameraStop[] = [];
 
       for (const stop of config.stops) {
-        cameraConfig.stops.push(this._createStopConfig(stop));
+        const nativeStop = this._createStopConfig(stop);
+        if (nativeStop) {
+          nativeStops = [...nativeStops, nativeStop];
+        }
       }
+      this.cameraRef.current?.setNativeProps({stop: {stops: nativeStops}});
     } else {
-      cameraConfig = this._createStopConfig(config);
+      const nativeStop = this._createStopConfig(config);
+      if (nativeStop) {
+        this.cameraRef.current?.setNativeProps({stop: nativeStop});
+      }
     }
-
-    this.refs.camera.setNativeProps({stop: cameraConfig});
   }
 
-  _createDefaultCamera() {
+  _createDefaultCamera(): NativeCameraStop | null {
     if (this.defaultCamera) {
       return this.defaultCamera;
     }
@@ -559,24 +583,34 @@ class Camera extends React.Component {
     this.defaultCamera = this._createStopConfig(
       {
         ...this.props.defaultSettings,
-        animationMode: Camera.Mode.Move,
+        animationMode: 'moveTo',
       },
       true,
     );
     return this.defaultCamera;
   }
 
-  _createStopConfig(config = {}, ignoreFollowUserLocation = false) {
+  _createStopConfig(
+    config: CameraStop = {},
+    ignoreFollowUserLocation = false,
+  ): NativeCameraStop | null {
     if (this.props.followUserLocation && !ignoreFollowUserLocation) {
       return null;
     }
 
-    const stopConfig = {
+    const stopConfig: NativeCameraStop = {
       mode: this._getNativeCameraMode(config),
       pitch: config.pitch,
       heading: config.heading,
       duration: config.animationDuration || 0,
       zoom: config.zoomLevel,
+      paddingTop: config.padding?.paddingTop || config.bounds?.paddingTop || 0,
+      paddingRight:
+        config.padding?.paddingRight || config.bounds?.paddingRight || 0,
+      paddingBottom:
+        config.padding?.paddingBottom || config.bounds?.paddingBottom || 0,
+      paddingLeft:
+        config.padding?.paddingLeft || config.bounds?.paddingLeft || 0,
     };
 
     if (config.centerCoordinate) {
@@ -590,32 +624,23 @@ class Camera extends React.Component {
       stopConfig.bounds = toJSONString(geoUtils.makeLatLngBounds(ne, sw));
     }
 
-    stopConfig.paddingTop =
-      config.padding?.paddingTop || config.bounds?.paddingTop || 0;
-    stopConfig.paddingRight =
-      config.padding?.paddingRight || config.bounds?.paddingRight || 0;
-    stopConfig.paddingBottom =
-      config.padding?.paddingBottom || config.bounds?.paddingBottom || 0;
-    stopConfig.paddingLeft =
-      config.padding?.paddingLeft || config.bounds?.paddingLeft || 0;
-
     return stopConfig;
   }
 
-  _getNativeCameraMode(config) {
+  _getNativeCameraMode(config: CameraStop): NativeAnimationMode {
     switch (config.animationMode) {
-      case Camera.Mode.Flight:
+      case 'flyTo':
         return MapLibreGL.CameraModes.Flight;
-      case Camera.Mode.Move:
+      case 'moveTo':
         return MapLibreGL.CameraModes.None;
-      case Camera.Mode.Linear:
+      case 'linearTo':
         return MapLibreGL.CameraModes.Linear;
       default:
         return MapLibreGL.CameraModes.Ease;
     }
   }
 
-  _getMaxBounds() {
+  _getMaxBounds(): string | null {
     const bounds = this.props.maxBounds;
     if (!bounds || !bounds.ne || !bounds.sw) {
       return null;
@@ -623,7 +648,7 @@ class Camera extends React.Component {
     return toJSONString(geoUtils.makeLatLngBounds(bounds.ne, bounds.sw));
   }
 
-  render() {
+  render(): ReactElement {
     const props = Object.assign({}, this.props);
 
     const callbacks = {
@@ -633,7 +658,7 @@ class Camera extends React.Component {
     return (
       <RCTMGLCamera
         testID="Camera"
-        ref="camera"
+        ref={this.cameraRef}
         followUserLocation={this.props.followUserLocation}
         followUserMode={this.props.followUserMode}
         followPitch={this.props.followPitch}
@@ -650,16 +675,6 @@ class Camera extends React.Component {
   }
 }
 
-const RCTMGLCamera = requireNativeComponent(NATIVE_MODULE_NAME, Camera, {
-  nativeOnly: {
-    stop: true,
-  },
-});
-
-Camera.UserTrackingModes = {
-  Follow: 'normal',
-  FollowWithHeading: 'compass',
-  FollowWithCourse: 'course',
-};
+const RCTMGLCamera = requireNativeComponent<NativeProps>(NATIVE_MODULE_NAME);
 
 export default Camera;