How to use the @sitecore-jss/sitecore-jss.mediaApi.updateImageUrl function in @sitecore-jss/sitecore-jss

To help you get started, we’ve selected a few @sitecore-jss/sitecore-jss examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github Sitecore / jss / packages / sitecore-jss-react-native / src / components / Image.tsx View on Github external
if (height) {
    imgStyles.height = typeof height !== 'number' ? Number(height) : height;
  }

  // react native styles/StyleSheets can be merged by passing them as an array to the native Image component
  newAttrs.style = style ? [imgStyles, style] : imgStyles;

  // in react-native, you need to "import" static assets via `require` statements
  // when the packager builds your app, it (presumably) statically analyzes your code, extracts
  // the assets that are `require`d into an array/map, then assigns them a numerical value.
  if (typeof src === 'number') {
    newAttrs.source = src;
  } else {
    // assume we have a "network image", i.e. something loaded via http(s)
    // update image URL for jss handler and image rendering params
    const uri = mediaApi.updateImageUrl(src, imageUrlParams);
    // for network images, the "source" prop is an object with at least "uri" value, e.g. { uri: 'http://aviato.com/myimg.jpg' }
    newAttrs.source = { uri };
  }

  return newAttrs;
};
github Sitecore / jss / packages / sitecore-jss-angular / src / components / image.directive.ts View on Github external
private getImageAttrs(fieldAttrs: any, parsedAttrs: any, imageParams: any): any {
    const combinedAttrs = {
      ...fieldAttrs,
      ...parsedAttrs,
    };
    // tslint:disable-next-line:prefer-const
    let { src, srcSet, ...otherAttrs } = combinedAttrs;
    if (!src) {
      return null;
    }
    const newAttrs = {
      ...otherAttrs,
    };
    // update image URL for jss handler and image rendering params
    src = mediaApi.updateImageUrl(src, imageParams);
    if (srcSet) {
      // replace with HTML-formatted srcset, including updated image URLs
      newAttrs.srcSet = mediaApi.getSrcSet(src, srcSet, imageParams);
    } else {
      newAttrs.src = src;
    }
    return newAttrs;
  }
github Sitecore / jss / packages / sitecore-jss-react / src / components / Image.tsx View on Github external
src: string;
    srcSet: any;
    otherAttrs: any[];
  },
  imageParams: any
) => {
  if (!src) {
    return null;
  }

  const newAttrs: any = {
    ...otherAttrs,
  };

  // update image URL for jss handler and image rendering params
  const resolvedSrc = mediaApi.updateImageUrl(src, imageParams);
  if (srcSet) {
    // replace with HTML-formatted srcset, including updated image URLs
    newAttrs.srcSet = mediaApi.getSrcSet(resolvedSrc, srcSet, imageParams);
  } else {
    newAttrs.src = resolvedSrc;
  }
  return newAttrs;
};

@sitecore-jss/sitecore-jss

This module is provided as a part of Sitecore JavaScript Rendering SDK. It contains the core JSS APIs (layout service) and utilities.

Apache-2.0
Latest version published 8 days ago

Package Health Score

81 / 100
Full package analysis

Similar packages