@cornerstonejs/core 1.75.2 → 1.76.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cornerstonejs/core",
-  "version": "1.75.2",
+  "version": "1.76.0",
   "description": "",
   "main": "src/index.ts",
   "types": "dist/types/index.d.ts",
@@ -47,5 +47,5 @@
     "type": "individual",
     "url": "https://ohif.org/donate"
   },
-  "gitHead": "f3239736baf99aec3e0744d0905b9cc1a43ae7cd"
+  "gitHead": "97c7f819997bdff7dda77b94e99c5ae2f7502fc5"
 }

package/src/RenderingEngine/helpers/addImageSlicesToViewports.ts

@@ -1,4 +1,3 @@
-import { StackViewport } from '..';
 import type {
   IStackViewport,
   IStackInput,
@@ -20,9 +19,7 @@ import type {
 async function addImageSlicesToViewports(
   renderingEngine: IRenderingEngine,
   stackInputs: Array<IStackInput>,
-  viewportIds: Array<string>,
-  immediateRender = false,
-  suppressEvents = false
+  viewportIds: Array<string>
 ): Promise<void> {
   // Check if all viewports are volumeViewports
   for (const viewportId of viewportIds) {
@@ -45,7 +42,7 @@ async function addImageSlicesToViewports(
   const addStackPromises = viewportIds.map(async (viewportId) => {
     const viewport = renderingEngine.getViewport(viewportId) as IStackViewport;
 
-    return viewport.addImages(stackInputs, immediateRender, suppressEvents);
+    return viewport.addImages(stackInputs);
   });
 
   await Promise.all(addStackPromises);

package/src/loaders/imageLoader.ts

@@ -283,14 +283,26 @@ export function createAndCacheDerivedImage(
   );
   const derivedImageId = imageId;
 
-  ['imagePixelModule', 'imagePlaneModule', 'generalSeriesModule'].forEach(
-    (type) => {
-      genericMetadataProvider.add(derivedImageId, {
-        type,
-        metadata: metaData.get(type, referencedImageId),
-      });
-    }
-  );
+  ['imagePlaneModule', 'generalSeriesModule'].forEach((type) => {
+    genericMetadataProvider.add(derivedImageId, {
+      type,
+      metadata: metaData.get(type, referencedImageId),
+    });
+  });
+
+  const imagePixelModule = metaData.get('imagePixelModule', referencedImageId);
+  // TODO - add a general way to specify this
+  genericMetadataProvider.add(derivedImageId, {
+    type: 'imagePixelModule',
+    metadata: {
+      ...imagePixelModule,
+      bitsAllocated: 8,
+      bitsStored: 8,
+      highBit: 7,
+      samplesPerPixel: 1,
+      pixelRepresentation: 0,
+    },
+  });
 
   const localImage = createAndCacheLocalImage(
     { scalarData: imageScalarData, onCacheAdd, skipCreateBuffer },

package/src/types/IStackViewport.ts

@@ -1,179 +1,3 @@
-import CPUIImageData from './CPUIImageData';
-import ICamera from './ICamera';
-import IImageData from './IImageData';
-import { IViewport } from './IViewport';
-import Point2 from './Point2';
-import Point3 from './Point3';
-import { Scaling } from './ScalingParameters';
-import StackViewportProperties from './StackViewportProperties';
-import type IImage from './IImage';
-import { IStackInput } from './IStackInput';
-/**
- * Interface for Stack Viewport
- */
-export default interface IStackViewport extends IViewport {
-  modality: string;
-  /** Scaling parameters */
-  scaling: Scaling;
+import type IStackViewport from '../RenderingEngine/StackViewport';
 
-  stackActorReInitialized: boolean;
-  /**
-   * Resizes the viewport - only used in CPU fallback for StackViewport. The
-   * GPU resizing happens inside the RenderingEngine.
-   */
-  resize: () => void;
-  /**
-   * Returns the frame of reference UID, if the image doesn't have imagePlaneModule
-   * metadata, it returns undefined, otherwise, frameOfReferenceUID is returned.
-   */
-  getFrameOfReferenceUID: () => string;
-
-  /**
-   * Update the default properties of the viewport and add properties by imageId if specified
-   * setting the VOI, inverting the colors and setting the interpolation type, rotation
-   */
-  setDefaultProperties(
-    ViewportProperties: StackViewportProperties,
-    imageId?: string
-  ): void;
-
-  /**
-   * Remove the global default properties of the viewport or remove default properties for an imageId if specified
-   */
-  clearDefaultProperties(imageId?: string): void;
-  /**
-   * Sets the properties for the viewport on the default actor. Properties include
-   * setting the VOI, inverting the colors and setting the interpolation type, rotation
-   */
-  setProperties(
-    {
-      voiRange,
-      invert,
-      interpolationType,
-      rotation,
-      colormap,
-    }: StackViewportProperties,
-    suppressEvents?: boolean
-  ): void;
-  /**
-   * Retrieve the viewport default properties
-   */
-  getDefaultProperties: (imageId?: string) => StackViewportProperties;
-  /**
-   * Retrieve the viewport properties
-   */
-  getProperties: () => StackViewportProperties;
-  /**
-   * canvasToWorld Returns the world coordinates of the given `canvasPos`
-   * projected onto the plane defined by the `Viewport`'s camera.
-   */
-  canvasToWorld: (canvasPos: Point2) => Point3;
-  /**
-   * Returns the canvas coordinates of the given `worldPos`
-   * projected onto the `Viewport`'s `canvas`.
-   */
-  worldToCanvas: (worldPos: Point3) => Point2;
-  /**
-   * Returns the index of the imageId being renderer
-   */
-  getCurrentImageIdIndex: () => number;
-  /**
-   * Returns the list of image Ids for the current viewport
-   */
-  getImageIds: () => string[];
-  /**
-   * Returns true if the viewport contains the imageId
-   */
-  hasImageId: (imageId: string) => boolean;
-  /**
-   * Returns true if the viewport contains the imageURI
-   */
-  hasImageURI: (imageURI: string) => boolean;
-  /**
-   * Returns the currently rendered imageId
-   */
-  getCurrentImageId: () => string;
-  /**
-   * Add Image Slices actors to the viewport
-   */
-  addImages(
-    stackInputs: Array<IStackInput>,
-    immediateRender: boolean,
-    suppressEvents: boolean
-  );
-
-  getImageDataMetadata(image: IImage): any;
-  /**
-   * Custom rendering pipeline for the rendering for the CPU fallback
-   */
-  customRenderViewportToCanvas: () => {
-    canvas: HTMLCanvasElement;
-    element: HTMLDivElement;
-    viewportId: string;
-    renderingEngineId: string;
-  };
-  /**
-   * Returns the image and its properties that is being shown inside the
-   * stack viewport. It returns, the image dimensions, image direction,
-   * image scalar data, vtkImageData object, metadata, and scaling (e.g., PET suvbw)
-   */
-  getImageData(): IImageData | CPUIImageData;
-  /**
-   * Returns the raw/loaded image being shown inside the stack viewport.
-   */
-  getCornerstoneImage: () => IImage;
-  /**
-   * Reset the viewport properties to the his default values if possible
-   */
-  resetToDefaultProperties(): void;
-  /**
-   * Reset the viewport properties to the default metadata values
-   */
-  resetProperties(): void;
-  /**
-   * If the user has selected CPU rendering, return the CPU camera, otherwise
-   * return the default camera
-   */
-  getCamera(): ICamera;
-  /**
-   * Set the camera based on the provided camera object.
-   */
-  setCamera(cameraInterface: ICamera): void;
-  /**
-   * Sets the imageIds to be visualized inside the stack viewport. It accepts
-   * list of imageIds, the index of the first imageId to be viewed. It is a
-   * asynchronous function that returns a promise resolving to imageId being
-   * displayed in the stack viewport.
-   *
-   * @param retrieveConfiguration - Set this to a progressive retriever of your
-   *       choice for progressive retrieval, or leave empty for non-progressive.
-   */
-  setStack(
-    imageIds: Array<string>,
-    currentImageIdIndex?: number
-  ): Promise<string>;
-  /**
-   * Centers Pan and resets the zoom for stack viewport.
-   */
-  resetCamera(resetPan?: boolean, resetZoom?: boolean): boolean;
-  /**
-   * Loads the image based on the provided imageIdIndex. It is an Async function which
-   * returns a promise that resolves to the imageId.
-   */
-  setImageIdIndex(imageIdIndex: number): Promise<string>;
-  /**
-   * Calibrates the image with new metadata that has been added for imageId. To calibrate
-   * a viewport, you should add your calibration data manually to
-   * calibratedPixelSpacingMetadataProvider and call viewport.calibrateSpacing
-   * for it get applied.
-   */
-  calibrateSpacing(imageId: string): void;
-  /**
-   * If the renderer is CPU based, throw an error. Otherwise, returns the `vtkRenderer` responsible for rendering the `Viewport`.
-   */
-  getRenderer(): any;
-  /**
-   * It sets the colormap to the default colormap.
-   */
-  unsetColormap(): void;
-}
+export default IStackViewport;

package/src/utilities/getScalingParameters.ts

@@ -17,8 +17,8 @@ export default function getScalingParameters(
   const { modality } = generalSeriesModule;
 
   const scalingParameters = {
-    rescaleSlope: modalityLutModule.rescaleSlope,
-    rescaleIntercept: modalityLutModule.rescaleIntercept,
+    rescaleSlope: modalityLutModule.rescaleSlope || 1,
+    rescaleIntercept: modalityLutModule.rescaleIntercept ?? 0,
     modality,
   };
 

package/src/utilities/loadImageToCanvas.ts

@@ -1,4 +1,11 @@
-import type { IImage, ViewportInputOptions } from '../types';
+import type {
+  IImage,
+  ViewPresentation,
+  ViewReference,
+  ViewportInputOptions,
+  Point3,
+  IVolume,
+} from '../types';
 
 import { loadAndCacheImage } from '../loaders/imageLoader';
 import * as metaData from '../metaData';
@@ -7,10 +14,52 @@ import imageLoadPoolManager from '../requestPool/imageLoadPoolManager';
 import renderToCanvasGPU from './renderToCanvasGPU';
 import renderToCanvasCPU from './renderToCanvasCPU';
 import { getConfiguration } from '../init';
+import cache from '../cache';
 
-export interface LoadImageOptions {
-  canvas: HTMLCanvasElement;
+/**
+ * The original load image options specified just an image id,  which is optimal
+ * for things like thumbnails rendering a single image.
+ */
+export type StackLoadImageOptions = {
   imageId: string;
+};
+
+/**
+ * The full image load options allows specifying more parameters for both the
+ * presentation and the view so that a specific view can be referenced/displayed.
+ */
+export type FullImageLoadOptions = {
+  viewReference: ViewReference;
+  viewPresentation: ViewPresentation;
+  imageId: undefined;
+};
+
+/**
+ * The canvas load position allows for determining the rendered position of
+ * image data within the canvas, and can be used to map loaded canvas points
+ * to and from other viewport positions for things like external computations
+ * on the load image to canvas view and the viewport view (which may contain
+ * extraneous data such as segmentation and thus not be usable for external
+ * computations.)
+ */
+export type CanvasLoadPosition = {
+  origin: Point3;
+  topRight: Point3;
+  bottomLeft: Point3;
+  thicknessMm: number;
+};
+
+/**
+ * The image canvas can be loaded/set with various view conditions to specify the initial
+ * view as well as how and where ot render the image.
+ */
+export type LoadImageOptions = {
+  canvas: HTMLCanvasElement;
+  // Define the view specification as optional here, and then incorporate specific
+  // requirements in mix in types.
+  imageId?: string;
+  viewReference?: ViewReference;
+  viewPresentation?: ViewPresentation;
   requestType?: RequestType;
   priority?: number;
   renderingEngineId?: string;
@@ -24,7 +73,7 @@ export interface LoadImageOptions {
   physicalPixels?: boolean;
   // Sets the viewport input options  Defaults to scale to fit 110%
   viewportOptions?: ViewportInputOptions;
-}
+} & (StackLoadImageOptions | FullImageLoadOptions);
 
 /**
  * Loads and renders an imageId to a Canvas. It will use the GPU rendering pipeline
@@ -46,55 +95,61 @@ export interface LoadImageOptions {
  * @param useCPURendering - Force the use of the CPU rendering pipeline (default to false)
  * @param thumbnail - Render a thumbnail image
  * @param imageAspect - assign the width based on the aspect ratio of the image
- * @param physicalPixels - set the width/height to the physical pixel size
  * @returns - A promise that resolves when the image has been rendered with the imageId
  */
 export default function loadImageToCanvas(
   options: LoadImageOptions
-): Promise<string> {
+): Promise<CanvasLoadPosition> {
   const {
     canvas,
     imageId,
+    viewReference,
     requestType = RequestType.Thumbnail,
     priority = -5,
     renderingEngineId = '_thumbnails',
     useCPURendering = false,
     thumbnail = false,
     imageAspect = false,
-    physicalPixels = false,
-    viewportOptions,
+    viewportOptions: baseViewportOptions,
   } = options;
+  const volumeId = viewReference?.volumeId;
+  const isVolume = volumeId && !imageId;
+  const viewportOptions =
+    viewReference && baseViewportOptions
+      ? { ...baseViewportOptions, viewReference }
+      : baseViewportOptions;
 
-  const devicePixelRatio = window.devicePixelRatio || 1;
   const renderFn = useCPURendering ? renderToCanvasCPU : renderToCanvasGPU;
 
   return new Promise((resolve, reject) => {
-    function successCallback(image: IImage, imageId: string) {
+    function successCallback(imageOrVolume: IImage | IVolume, imageId: string) {
       const { modality } = metaData.get('generalSeriesModule', imageId) || {};
 
-      image.isPreScaled = image.isPreScaled || image.preScale?.scaled;
+      const image = !isVolume && (imageOrVolume as IImage);
+      const volume = isVolume && (imageOrVolume as IVolume);
+      if (image) {
+        image.isPreScaled = image.isPreScaled || image.preScale?.scaled;
+      }
 
       if (thumbnail) {
         canvas.height = 256;
         canvas.width = 256;
       }
-      if (physicalPixels) {
-        canvas.width = canvas.offsetWidth * devicePixelRatio;
-        canvas.height = canvas.offsetHeight * devicePixelRatio;
+      if (imageAspect && image) {
+        canvas.width = image && (canvas.height * image.width) / image.height;
       }
-      if (imageAspect) {
-        canvas.width = (canvas.height * image.width) / image.height;
+      canvas.style.width = `${canvas.width / devicePixelRatio}px`;
+      canvas.style.height = `${canvas.height / devicePixelRatio}px`;
+      if (volume && useCPURendering) {
+        reject(new Error('CPU rendering of volume not supported'));
       }
-
       renderFn(
         canvas,
-        image,
+        imageOrVolume,
         modality,
         renderingEngineId,
         viewportOptions
-      ).then(() => {
-        resolve(imageId);
-      });
+      ).then(resolve);
     }
 
     function errorCallback(error: Error, imageId: string) {
@@ -113,29 +168,35 @@ export default function loadImageToCanvas(
       );
     }
 
-    const { useNorm16Texture, preferSizeOverAccuracy } =
-      getConfiguration().rendering;
-    const useNativeDataType = useNorm16Texture || preferSizeOverAccuracy;
+    const { useNorm16Texture } = getConfiguration().rendering;
 
     // IMPORTANT: Request type should be passed if not the 'interaction'
     // highest priority will be used for the request type in the imageRetrievalPool
     const options = {
       targetBuffer: {
-        type: useNativeDataType ? undefined : 'Float32Array',
+        type: useNorm16Texture ? undefined : 'Float32Array',
       },
       preScale: {
         enabled: true,
       },
-      useNativeDataType,
       useRGBA: !!useCPURendering,
       requestType,
     };
 
-    imageLoadPoolManager.addRequest(
-      sendRequest.bind(null, imageId, null, options),
-      requestType,
-      { imageId },
-      priority
-    );
+    if (volumeId) {
+      const volume = cache.getVolume(volumeId) as unknown as IVolume;
+      if (!volume) {
+        reject(new Error(`Volume id ${volumeId} not found in cache`));
+      }
+      const useImageId = volume.imageIds[0];
+      successCallback(volume, useImageId);
+    } else {
+      imageLoadPoolManager.addRequest(
+        sendRequest.bind(null, imageId, null, options),
+        requestType,
+        { imageId },
+        priority
+      );
+    }
   });
 }

package/src/utilities/renderToCanvasCPU.ts

@@ -2,11 +2,13 @@ import {
   IImage,
   CPUFallbackEnabledElement,
   ViewportInputOptions,
+  IVolume,
 } from '../types';
 
 import getDefaultViewport from '../RenderingEngine/helpers/cpuFallback/rendering/getDefaultViewport';
 import calculateTransform from '../RenderingEngine/helpers/cpuFallback/rendering/calculateTransform';
 import drawImageSync from '../RenderingEngine/helpers/cpuFallback/drawImageSync';
+import type { CanvasLoadPosition } from './loadImageToCanvas';
 
 /**
  * Renders a cornerstone image object to a canvas.
@@ -17,11 +19,16 @@ import drawImageSync from '../RenderingEngine/helpers/cpuFallback/drawImageSync'
  */
 export default function renderToCanvasCPU(
   canvas: HTMLCanvasElement,
-  image: IImage,
+  imageOrVolume: IImage | IVolume,
   modality?: string,
   _renderingEngineId?: string,
   _viewportOptions?: ViewportInputOptions
-): Promise<string> {
+): Promise<CanvasLoadPosition> {
+  const volume = imageOrVolume as IVolume;
+  if (volume.volumeId) {
+    throw new Error('Unsupported volume rendering for CPU');
+  }
+  const image = imageOrVolume as IImage;
   const viewport = getDefaultViewport(canvas, image, modality);
 
   const enabledElement: CPUFallbackEnabledElement = {
@@ -36,6 +43,6 @@ export default function renderToCanvasCPU(
   const invalidated = true;
   return new Promise((resolve, reject) => {
     drawImageSync(enabledElement, invalidated);
-    resolve(image.imageId);
+    resolve(null);
   });
 }

package/src/utilities/renderToCanvasGPU.ts

@@ -2,11 +2,18 @@ import getOrCreateCanvas, {
   EPSILON,
 } from '../RenderingEngine/helpers/getOrCreateCanvas';
 import { ViewportType, Events } from '../enums';
-import StackViewport from '../RenderingEngine/StackViewport';
-import { IImage, ViewportInputOptions } from '../types';
+import {
+  IImage,
+  IStackViewport,
+  IVolume,
+  ViewportInputOptions,
+  IVolumeViewport,
+  ViewReference,
+} from '../types';
 import { getRenderingEngine } from '../RenderingEngine/getRenderingEngine';
 import RenderingEngine from '../RenderingEngine';
 import isPTPrescaledWithSUV from './isPTPrescaledWithSUV';
+import { CanvasLoadPosition } from './loadImageToCanvas';
 
 /**
  * Renders an cornerstone image to a Canvas. This method will handle creation
@@ -23,26 +30,33 @@ import isPTPrescaledWithSUV from './isPTPrescaledWithSUV';
  * renderToCanvasGPU(canvas, image)
  * ```
  * @param canvas - Canvas element to render to
- * @param image - The image to render
+ * @param imageOrVolume - The image to render
  * @param modality - [Default = undefined] The modality of the image
  * @returns - A promise that resolves when the image has been rendered with the imageId
  */
 export default function renderToCanvasGPU(
   canvas: HTMLCanvasElement,
-  image: IImage,
+  imageOrVolume: IImage | IVolume,
   modality = undefined,
   renderingEngineId = '_thumbnails',
-  viewportOptions: ViewportInputOptions = { displayArea: { imageArea: [1, 1] } }
-): Promise<string> {
+  viewportOptions: ViewportInputOptions & { viewReference?: ViewReference } = {
+    displayArea: { imageArea: [1, 1] },
+  }
+): Promise<CanvasLoadPosition> {
   if (!canvas || !(canvas instanceof HTMLCanvasElement)) {
     throw new Error('canvas element is required');
   }
 
-  const imageIdToPrint = image.imageId;
+  const isVolume = !(imageOrVolume as IImage).imageId;
+  const image = !isVolume && (imageOrVolume as IImage);
+  const volume = isVolume && (imageOrVolume as IVolume);
+  const imageIdToPrint = image?.imageId || volume?.volumeId;
   const viewportId = `renderGPUViewport-${imageIdToPrint}`;
-  const imageId = image.imageId;
   const element = document.createElement('div');
   const devicePixelRatio = window.devicePixelRatio || 1;
+  if (!viewportOptions.displayArea) {
+    viewportOptions.displayArea = { imageArea: [1, 1] };
+  }
   const originalWidth = canvas.width;
   const originalHeight = canvas.height;
   // The canvas width/height are set by flooring the CSS size converted
@@ -50,17 +64,12 @@ export default function renderToCanvasGPU(
   // isn't exact, and using the exact value sometimes leads to an off by 1
   // in the actual size, so adding EPSILON to the size resolves
   // the problem.
-  element.style.width = `${originalWidth + EPSILON}px`;
-  element.style.height = `${originalHeight + EPSILON}px`;
+  // Don't touch the canvas size here as what we get out is a canvas at the right size
+  element.style.width = `${originalWidth / devicePixelRatio + EPSILON}px`;
+  element.style.height = `${originalHeight / devicePixelRatio + EPSILON}px`;
   element.style.visibility = 'hidden';
   element.style.position = 'absolute';
 
-  // Up-sampling the provided canvas to match the device pixel ratio
-  // since we use device pixel ratio to determine the size of the canvas
-  // inside the rendering engine.
-  canvas.width = originalWidth * devicePixelRatio;
-  canvas.height = originalHeight * devicePixelRatio;
-
   document.body.appendChild(element);
 
   // add id to the element so we can find it later, and fix the : which is not allowed in css
@@ -73,20 +82,20 @@ export default function renderToCanvasGPU(
     (getRenderingEngine(renderingEngineId) as RenderingEngine) ||
     new RenderingEngine(renderingEngineId);
 
-  let viewport = renderingEngine.getViewport(viewportId) as StackViewport;
+  let viewport = renderingEngine.getViewport(viewportId);
 
   if (!viewport) {
-    const stackViewportInput = {
+    const viewportInput = {
       viewportId,
-      type: ViewportType.STACK,
+      type: isVolume ? ViewportType.ORTHOGRAPHIC : ViewportType.STACK,
       element,
       defaultOptions: {
         ...viewportOptions,
         suppressEvents: true,
       },
     };
-    renderingEngine.enableElement(stackViewportInput);
-    viewport = renderingEngine.getViewport(viewportId) as StackViewport;
+    renderingEngine.enableElement(viewportInput);
+    viewport = renderingEngine.getViewport(viewportId);
   }
 
   return new Promise((resolve) => {
@@ -94,11 +103,20 @@ export default function renderToCanvasGPU(
     // enable it and later disable it without losing the canvas context
     let elementRendered = false;
 
+    let { viewReference } = viewportOptions;
+
     // Create a named function to handle the event
     const onImageRendered = (eventDetail) => {
       if (elementRendered) {
         return;
       }
+      if (viewReference) {
+        const useViewRef = viewReference;
+        viewReference = null;
+        viewport.setViewReference(useViewRef);
+        viewport.render();
+        return;
+      }
 
       // Copy the temporary canvas to the given canvas
       const context = canvas.getContext('2d');
@@ -114,6 +132,16 @@ export default function renderToCanvasGPU(
         canvas.height // destination dimensions
       );
 
+      const origin = viewport.canvasToWorld([0, 0]);
+      const topRight = viewport.canvasToWorld([
+        temporaryCanvas.width / devicePixelRatio,
+        0,
+      ]);
+      const bottomLeft = viewport.canvasToWorld([
+        0,
+        temporaryCanvas.height / devicePixelRatio,
+      ]);
+      const thicknessMm = 1;
       elementRendered = true;
 
       // remove based on id
@@ -135,17 +163,26 @@ export default function renderToCanvasGPU(
           element.remove();
         });
       }, 0);
-      resolve(imageId);
+      resolve({
+        origin,
+        bottomLeft,
+        topRight,
+        thicknessMm,
+      });
     };
 
     element.addEventListener(Events.IMAGE_RENDERED, onImageRendered);
-    viewport.renderImageObject(image);
+    if (isVolume) {
+      (viewport as IVolumeViewport).setVolumes([volume], false, true);
+    } else {
+      (viewport as IStackViewport).renderImageObject(imageOrVolume);
+    }
 
     // force a reset camera to center the image and undo the small scaling
     viewport.resetCamera();
 
     if (modality === 'PT' && !isPTPrescaledWithSUV(image)) {
-      viewport.setProperties({
+      (viewport as IStackViewport).setProperties({
         voiRange: {
           lower: image.minPixelValue,
           upper: image.maxPixelValue,