gantri-components 2.109.0 → 2.110.0

package/dist/components/image/image.constants.d.ts

@@ -1,4 +1,3 @@
-import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
-import { ImageTransformationsVariant, Transformations } from './image.types';
-import { Optional } from '../../types/common';
-export declare const TRANSFORMATION_VARIANTS_MAP: Record<ImageTransformationsVariant, Optional<ResolutionAwareProp<Transformations>>>;
+import { ResolutionAwarePropBase } from '../../types/resolution-aware-prop.type';
+import { ImageTransformationsVariantOption, Transformations } from './image.types';
+export declare const TRANSFORMATION_VARIANTS_MAP: Record<ImageTransformationsVariantOption, ResolutionAwarePropBase<Transformations>>;

package/dist/components/image/image.helpers.d.ts

@@ -1,7 +1,9 @@
 import { IGravity } from '@cloudinary/url-gen/qualifiers/gravity/GravityQualifier';
-import { AspectRatio, Dpr, ImageDimension, ImageProps, ImageSource, TransformationMode, TransformationQuality, TransformationType } from './image.types';
+import { AspectRatio, Dpr, ImageDimension, ImageProps, ImageSource, ImageTransformationsVariant, TransformationMode, TransformationQuality, Transformations, TransformationType } from './image.types';
 import { ResolutionAwarePropBase } from '../../types/resolution-aware-prop.type';
 import { Optional } from '../../types/common';
 export declare const extractSizePropertyValue: (prop: Optional<ImageDimension>) => Optional<ImageDimension>;
 export declare const generateCloudinaryUrl: (source: ImageSource, imageName?: string, aspectRatio?: AspectRatio, width?: Optional<ImageDimension>, height?: Optional<ImageDimension>, mode?: Optional<TransformationMode>, quality?: Optional<TransformationQuality>, dpr?: Optional<Dpr>, type?: Optional<TransformationType>, gravity?: Optional<IGravity>) => string;
 export declare const generateImages: (params: Partial<ImageProps>, type?: TransformationType) => string | ResolutionAwarePropBase<string>;
+/** Converts transformation variant shorthand to full transformations. */
+export declare const getVariantTransformation: (transformationsVariant: Optional<ImageTransformationsVariant>) => ResolutionAwarePropBase<Transformations> | null;

package/dist/components/image/image.types.d.ts

@@ -7,7 +7,8 @@ import { Optional } from '../../types/common';
 export type AspectRatio = 'unset' | string | number;
 export type ImageDimension = string | number | 'unset';
 export type Dpr = number | 'auto';
-export type ImageTransformationsVariant = 'f' | 'h' | 'q' | 'ffh' | 'hff' | 'hhf';
+export type ImageTransformationsVariantOption = 'f' | 'h' | 'q';
+export type ImageTransformationsVariant = ImageTransformationsVariantOption | `${ImageTransformationsVariantOption}${ImageTransformationsVariantOption}` | `${ImageTransformationsVariantOption}${ImageTransformationsVariantOption}${ImageTransformationsVariantOption}`;
 export interface ImageProps {
     alt: string;
     className?: string;
@@ -40,12 +41,21 @@ export interface ImageProps {
     transformations?: Optional<ResolutionAwareProp<Transformations>>;
     /**
      * Used to define common transformation for images.
+     *
+     * @example
+     * ```text
      * f => full width
+     *
      * h => half width
+     *
      * q => quarter width
+     *
      * ffh => desktop full width, tablet full width, mobile half width
+     *
      * hff => desktop half width, tablet full width, mobile full width
+     *
      * hhf => desktop half width, tablet half width, mobile full width
+     * ```
      */
     transformationsVariant?: Optional<ImageTransformationsVariant>;
     width?: Optional<ResolutionAwareProp<ImageDimension>>;