@sproutsocial/seeds-react-image 1.0.0 → 1.0.1

package/.turbo/turbo-build.log

@@ -8,14 +8,14 @@ CLI Target: es2022
 CLI Cleaning output folder
 CJS Build start
 ESM Build start
-CJS dist/index.js     3.88 KB
+CJS dist/index.js     3.89 KB
 CJS dist/index.js.map 5.26 KB
-CJS ⚡️ Build success in 81ms
-ESM dist/esm/index.js     2.09 KB
-ESM dist/esm/index.js.map 5.20 KB
-ESM ⚡️ Build success in 83ms
+CJS ⚡️ Build success in 99ms
+ESM dist/esm/index.js     2.10 KB
+ESM dist/esm/index.js.map 5.21 KB
+ESM ⚡️ Build success in 102ms
 DTS Build start
-DTS ⚡️ Build success in 22476ms
+DTS ⚡️ Build success in 42550ms
 DTS dist/index.d.ts  1.50 KB
 DTS dist/index.d.mts 1.50 KB
-Done in 26.15s.
+Done in 47.30s.

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @sproutsocial/seeds-react-image
 
+## 1.0.1
+
+### Patch Changes
+
+- 9fd8bac: Update dependencies to use semantic package version instead of wildcards
+- Updated dependencies [9fd8bac]
+  - @sproutsocial/seeds-react-system-props@3.0.2
+  - @sproutsocial/seeds-react-theme@2.2.1
+
 ## 1.0.0
 
 ### Major Changes

package/dist/esm/index.js

@@ -95,9 +95,9 @@ var Image = class extends React.Component {
 import "react";
 
 // src/index.ts
-var src_default = Image;
+var index_default = Image;
 export {
   Image,
-  src_default as default
+  index_default as default
 };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Image.tsx","../../src/styles.ts","../../src/ImageTypes.ts","../../src/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport ImageContainer from \"./styles\";\nimport type { TypeImageProps } from \"./ImageTypes\";\n\ntype TypeState = {\n  didError: boolean;\n  didLoad: boolean;\n  imageUrl: string;\n};\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = () => {};\n\nexport default class Image extends React.Component<TypeImageProps, TypeState> {\n  static defaultProps = {\n    title: \"\",\n    onError: noop,\n    onClick: noop,\n    onLoad: noop,\n  };\n\n  override state = {\n    didError: false,\n    didLoad: false,\n    imageUrl: this.props.src,\n  };\n\n  imageRef?: HTMLImageElement | null;\n\n  override componentDidMount() {\n    // eslint-disable-next-line react/no-did-mount-set-state\n    if (this.imageRef) {\n      this.setState({\n        didLoad: this.imageRef.complete,\n      });\n    }\n  }\n\n  override componentDidUpdate(prevProps: TypeImageProps) {\n    if (this.props.src !== prevProps.src) {\n      this.setState({\n        didError: false,\n        didLoad: false,\n        imageUrl: this.props.src,\n      });\n    }\n  }\n\n  onError = (e: React.SyntheticEvent<HTMLImageElement, Event>) => {\n    if (!this.state.didError && this.props.defaultImage) {\n      this.setState({\n        didError: true,\n        imageUrl: this.props.defaultImage,\n      });\n    }\n\n    this.props.onError(e);\n  };\n\n  onLoad = () => {\n    this.setState({\n      didLoad: true,\n    });\n    this.props.onLoad();\n  };\n\n  onClick = () => {\n    this.props.onClick();\n  };\n\n  override render() {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { alt, title, onClick, onError, onLoad, src, qa, ...rest } =\n      this.props;\n    return (\n      <ImageContainer\n        isLoading={!this.state.didLoad}\n        ref={(img) => (this.imageRef = img)}\n        onClick={this.onClick}\n        src={this.state.imageUrl}\n        onError={(e: React.SyntheticEvent<HTMLImageElement, Event>) =>\n          this.onError(e)\n        }\n        onLoad={this.onLoad}\n        alt={alt}\n        title={title}\n        data-qa-image={title ? title : alt ? alt : \"\"}\n        data-qa-image-src={src || \"\"}\n        {...(qa as any)}\n        {...rest}\n      />\n    );\n  }\n}\n","import styled, { css } from \"styled-components\";\nimport { COMMON, LAYOUT } from \"@sproutsocial/seeds-react-system-props\";\n\ninterface ImageContainerProps {\n  isLoading?: boolean;\n}\nconst ImageContainer = styled.img.attrs({\n  className: \"Image\",\n})<ImageContainerProps>`\n  display: block;\n\n  ${(props) =>\n    props.isLoading &&\n    css`\n      visibility: hidden;\n    `}\n\n  ${COMMON}\n  ${LAYOUT}\n`;\n\nexport default ImageContainer;\n","import * as React from \"react\";\nimport type {\n  TypeSystemCommonProps,\n  TypeSystemLayoutProps,\n  TypeStyledComponentsCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeImageProps\n  extends TypeStyledComponentsCommonProps,\n    TypeSystemCommonProps,\n    TypeSystemLayoutProps,\n    Omit<React.ComponentPropsWithoutRef<\"img\">, \"color\" | \"height\" | \"width\"> {\n  src: string;\n\n  /** Alt text is required for non-decorative images */\n  alt: string;\n  title: string;\n  onError: (e: React.SyntheticEvent<HTMLImageElement, Event>) => void;\n  onClick: () => void;\n\n  /** A URL for a default image to load if the source image is not available */\n  defaultImage?: string;\n  onLoad: () => void;\n  qa?: object;\n}\n","import Image from \"./Image\";\n\nexport default Image;\nexport { Image };\nexport * from \"./ImageTypes\";\n"],"mappings":";AAAA,YAAY,WAAW;;;ACAvB,OAAO,UAAU,WAAW;AAC5B,SAAS,QAAQ,cAAc;AAK/B,IAAM,iBAAiB,OAAO,IAAI,MAAM;AAAA,EACtC,WAAW;AACb,CAAC;AAAA;AAAA;AAAA,IAGG,CAAC,UACD,MAAM,aACN;AAAA;AAAA,KAEC;AAAA;AAAA,IAED,MAAM;AAAA,IACN,MAAM;AAAA;AAGV,IAAO,iBAAQ;;;ADsDT;AAhEN,IAAM,OAAO,MAAM;AAAC;AAEpB,IAAqB,QAArB,cAAyC,gBAAqC;AAAA,EAC5E,OAAO,eAAe;AAAA,IACpB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,QAAQ;AAAA,EACV;AAAA,EAES,QAAQ;AAAA,IACf,UAAU;AAAA,IACV,SAAS;AAAA,IACT,UAAU,KAAK,MAAM;AAAA,EACvB;AAAA,EAEA;AAAA,EAES,oBAAoB;AAE3B,QAAI,KAAK,UAAU;AACjB,WAAK,SAAS;AAAA,QACZ,SAAS,KAAK,SAAS;AAAA,MACzB,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAES,mBAAmB,WAA2B;AACrD,QAAI,KAAK,MAAM,QAAQ,UAAU,KAAK;AACpC,WAAK,SAAS;AAAA,QACZ,UAAU;AAAA,QACV,SAAS;AAAA,QACT,UAAU,KAAK,MAAM;AAAA,MACvB,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,UAAU,CAAC,MAAqD;AAC9D,QAAI,CAAC,KAAK,MAAM,YAAY,KAAK,MAAM,cAAc;AACnD,WAAK,SAAS;AAAA,QACZ,UAAU;AAAA,QACV,UAAU,KAAK,MAAM;AAAA,MACvB,CAAC;AAAA,IACH;AAEA,SAAK,MAAM,QAAQ,CAAC;AAAA,EACtB;AAAA,EAEA,SAAS,MAAM;AACb,SAAK,SAAS;AAAA,MACZ,SAAS;AAAA,IACX,CAAC;AACD,SAAK,MAAM,OAAO;AAAA,EACpB;AAAA,EAEA,UAAU,MAAM;AACd,SAAK,MAAM,QAAQ;AAAA,EACrB;AAAA,EAES,SAAS;AAEhB,UAAM,EAAE,KAAK,OAAO,SAAS,SAAS,QAAQ,KAAK,IAAI,GAAG,KAAK,IAC7D,KAAK;AACP,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,CAAC,KAAK,MAAM;AAAA,QACvB,KAAK,CAAC,QAAS,KAAK,WAAW;AAAA,QAC/B,SAAS,KAAK;AAAA,QACd,KAAK,KAAK,MAAM;AAAA,QAChB,SAAS,CAAC,MACR,KAAK,QAAQ,CAAC;AAAA,QAEhB,QAAQ,KAAK;AAAA,QACb;AAAA,QACA;AAAA,QACA,iBAAe,QAAQ,QAAQ,MAAM,MAAM;AAAA,QAC3C,qBAAmB,OAAO;AAAA,QACzB,GAAI;AAAA,QACJ,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;;;AE7FA,OAAuB;;;ACEvB,IAAO,cAAQ;","names":[]}
+{"version":3,"sources":["../../src/Image.tsx","../../src/styles.ts","../../src/ImageTypes.ts","../../src/index.ts"],"sourcesContent":["import * as React from \"react\";\nimport ImageContainer from \"./styles\";\nimport type { TypeImageProps } from \"./ImageTypes\";\n\ntype TypeState = {\n  didError: boolean;\n  didLoad: boolean;\n  imageUrl: string;\n};\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = () => {};\n\nexport default class Image extends React.Component<TypeImageProps, TypeState> {\n  static defaultProps = {\n    title: \"\",\n    onError: noop,\n    onClick: noop,\n    onLoad: noop,\n  };\n\n  override state = {\n    didError: false,\n    didLoad: false,\n    imageUrl: this.props.src,\n  };\n\n  imageRef?: HTMLImageElement | null;\n\n  override componentDidMount() {\n    // eslint-disable-next-line react/no-did-mount-set-state\n    if (this.imageRef) {\n      this.setState({\n        didLoad: this.imageRef.complete,\n      });\n    }\n  }\n\n  override componentDidUpdate(prevProps: TypeImageProps) {\n    if (this.props.src !== prevProps.src) {\n      this.setState({\n        didError: false,\n        didLoad: false,\n        imageUrl: this.props.src,\n      });\n    }\n  }\n\n  onError = (e: React.SyntheticEvent<HTMLImageElement, Event>) => {\n    if (!this.state.didError && this.props.defaultImage) {\n      this.setState({\n        didError: true,\n        imageUrl: this.props.defaultImage,\n      });\n    }\n\n    this.props.onError(e);\n  };\n\n  onLoad = () => {\n    this.setState({\n      didLoad: true,\n    });\n    this.props.onLoad();\n  };\n\n  onClick = () => {\n    this.props.onClick();\n  };\n\n  override render() {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { alt, title, onClick, onError, onLoad, src, qa, ...rest } =\n      this.props;\n    return (\n      <ImageContainer\n        isLoading={!this.state.didLoad}\n        ref={(img) => (this.imageRef = img)}\n        onClick={this.onClick}\n        src={this.state.imageUrl}\n        onError={(e: React.SyntheticEvent<HTMLImageElement, Event>) =>\n          this.onError(e)\n        }\n        onLoad={this.onLoad}\n        alt={alt}\n        title={title}\n        data-qa-image={title ? title : alt ? alt : \"\"}\n        data-qa-image-src={src || \"\"}\n        {...(qa as any)}\n        {...rest}\n      />\n    );\n  }\n}\n","import styled, { css } from \"styled-components\";\nimport { COMMON, LAYOUT } from \"@sproutsocial/seeds-react-system-props\";\n\ninterface ImageContainerProps {\n  isLoading?: boolean;\n}\nconst ImageContainer = styled.img.attrs({\n  className: \"Image\",\n})<ImageContainerProps>`\n  display: block;\n\n  ${(props) =>\n    props.isLoading &&\n    css`\n      visibility: hidden;\n    `}\n\n  ${COMMON}\n  ${LAYOUT}\n`;\n\nexport default ImageContainer;\n","import * as React from \"react\";\nimport type {\n  TypeSystemCommonProps,\n  TypeSystemLayoutProps,\n  TypeStyledComponentsCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeImageProps\n  extends TypeStyledComponentsCommonProps,\n    TypeSystemCommonProps,\n    TypeSystemLayoutProps,\n    Omit<React.ComponentPropsWithoutRef<\"img\">, \"color\" | \"height\" | \"width\"> {\n  src: string;\n\n  /** Alt text is required for non-decorative images */\n  alt: string;\n  title: string;\n  onError: (e: React.SyntheticEvent<HTMLImageElement, Event>) => void;\n  onClick: () => void;\n\n  /** A URL for a default image to load if the source image is not available */\n  defaultImage?: string;\n  onLoad: () => void;\n  qa?: object;\n}\n","import Image from \"./Image\";\n\nexport default Image;\nexport { Image };\nexport * from \"./ImageTypes\";\n"],"mappings":";AAAA,YAAY,WAAW;;;ACAvB,OAAO,UAAU,WAAW;AAC5B,SAAS,QAAQ,cAAc;AAK/B,IAAM,iBAAiB,OAAO,IAAI,MAAM;AAAA,EACtC,WAAW;AACb,CAAC;AAAA;AAAA;AAAA,IAGG,CAAC,UACD,MAAM,aACN;AAAA;AAAA,KAEC;AAAA;AAAA,IAED,MAAM;AAAA,IACN,MAAM;AAAA;AAGV,IAAO,iBAAQ;;;ADsDT;AAhEN,IAAM,OAAO,MAAM;AAAC;AAEpB,IAAqB,QAArB,cAAyC,gBAAqC;AAAA,EAC5E,OAAO,eAAe;AAAA,IACpB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,QAAQ;AAAA,EACV;AAAA,EAES,QAAQ;AAAA,IACf,UAAU;AAAA,IACV,SAAS;AAAA,IACT,UAAU,KAAK,MAAM;AAAA,EACvB;AAAA,EAEA;AAAA,EAES,oBAAoB;AAE3B,QAAI,KAAK,UAAU;AACjB,WAAK,SAAS;AAAA,QACZ,SAAS,KAAK,SAAS;AAAA,MACzB,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAES,mBAAmB,WAA2B;AACrD,QAAI,KAAK,MAAM,QAAQ,UAAU,KAAK;AACpC,WAAK,SAAS;AAAA,QACZ,UAAU;AAAA,QACV,SAAS;AAAA,QACT,UAAU,KAAK,MAAM;AAAA,MACvB,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,UAAU,CAAC,MAAqD;AAC9D,QAAI,CAAC,KAAK,MAAM,YAAY,KAAK,MAAM,cAAc;AACnD,WAAK,SAAS;AAAA,QACZ,UAAU;AAAA,QACV,UAAU,KAAK,MAAM;AAAA,MACvB,CAAC;AAAA,IACH;AAEA,SAAK,MAAM,QAAQ,CAAC;AAAA,EACtB;AAAA,EAEA,SAAS,MAAM;AACb,SAAK,SAAS;AAAA,MACZ,SAAS;AAAA,IACX,CAAC;AACD,SAAK,MAAM,OAAO;AAAA,EACpB;AAAA,EAEA,UAAU,MAAM;AACd,SAAK,MAAM,QAAQ;AAAA,EACrB;AAAA,EAES,SAAS;AAEhB,UAAM,EAAE,KAAK,OAAO,SAAS,SAAS,QAAQ,KAAK,IAAI,GAAG,KAAK,IAC7D,KAAK;AACP,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,CAAC,KAAK,MAAM;AAAA,QACvB,KAAK,CAAC,QAAS,KAAK,WAAW;AAAA,QAC/B,SAAS,KAAK;AAAA,QACd,KAAK,KAAK,MAAM;AAAA,QAChB,SAAS,CAAC,MACR,KAAK,QAAQ,CAAC;AAAA,QAEhB,QAAQ,KAAK;AAAA,QACb;AAAA,QACA;AAAA,QACA,iBAAe,QAAQ,QAAQ,MAAM,MAAM;AAAA,QAC3C,qBAAmB,OAAO;AAAA,QACzB,GAAI;AAAA,QACJ,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;;;AE7FA,OAAuB;;;ACEvB,IAAO,gBAAQ;","names":[]}

package/dist/index.js

@@ -28,12 +28,12 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.ts
-var src_exports = {};
-__export(src_exports, {
+var index_exports = {};
+__export(index_exports, {
   Image: () => Image,
-  default: () => src_default
+  default: () => index_default
 });
-module.exports = __toCommonJS(src_exports);
+module.exports = __toCommonJS(index_exports);
 
 // src/Image.tsx
 var React = __toESM(require("react"));
@@ -132,7 +132,7 @@ var Image = class extends React.Component {
 var React2 = require("react");
 
 // src/index.ts
-var src_default = Image;
+var index_default = Image;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Image

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/Image.tsx","../src/styles.ts","../src/ImageTypes.ts"],"sourcesContent":["import Image from \"./Image\";\n\nexport default Image;\nexport { Image };\nexport * from \"./ImageTypes\";\n","import * as React from \"react\";\nimport ImageContainer from \"./styles\";\nimport type { TypeImageProps } from \"./ImageTypes\";\n\ntype TypeState = {\n  didError: boolean;\n  didLoad: boolean;\n  imageUrl: string;\n};\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = () => {};\n\nexport default class Image extends React.Component<TypeImageProps, TypeState> {\n  static defaultProps = {\n    title: \"\",\n    onError: noop,\n    onClick: noop,\n    onLoad: noop,\n  };\n\n  override state = {\n    didError: false,\n    didLoad: false,\n    imageUrl: this.props.src,\n  };\n\n  imageRef?: HTMLImageElement | null;\n\n  override componentDidMount() {\n    // eslint-disable-next-line react/no-did-mount-set-state\n    if (this.imageRef) {\n      this.setState({\n        didLoad: this.imageRef.complete,\n      });\n    }\n  }\n\n  override componentDidUpdate(prevProps: TypeImageProps) {\n    if (this.props.src !== prevProps.src) {\n      this.setState({\n        didError: false,\n        didLoad: false,\n        imageUrl: this.props.src,\n      });\n    }\n  }\n\n  onError = (e: React.SyntheticEvent<HTMLImageElement, Event>) => {\n    if (!this.state.didError && this.props.defaultImage) {\n      this.setState({\n        didError: true,\n        imageUrl: this.props.defaultImage,\n      });\n    }\n\n    this.props.onError(e);\n  };\n\n  onLoad = () => {\n    this.setState({\n      didLoad: true,\n    });\n    this.props.onLoad();\n  };\n\n  onClick = () => {\n    this.props.onClick();\n  };\n\n  override render() {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { alt, title, onClick, onError, onLoad, src, qa, ...rest } =\n      this.props;\n    return (\n      <ImageContainer\n        isLoading={!this.state.didLoad}\n        ref={(img) => (this.imageRef = img)}\n        onClick={this.onClick}\n        src={this.state.imageUrl}\n        onError={(e: React.SyntheticEvent<HTMLImageElement, Event>) =>\n          this.onError(e)\n        }\n        onLoad={this.onLoad}\n        alt={alt}\n        title={title}\n        data-qa-image={title ? title : alt ? alt : \"\"}\n        data-qa-image-src={src || \"\"}\n        {...(qa as any)}\n        {...rest}\n      />\n    );\n  }\n}\n","import styled, { css } from \"styled-components\";\nimport { COMMON, LAYOUT } from \"@sproutsocial/seeds-react-system-props\";\n\ninterface ImageContainerProps {\n  isLoading?: boolean;\n}\nconst ImageContainer = styled.img.attrs({\n  className: \"Image\",\n})<ImageContainerProps>`\n  display: block;\n\n  ${(props) =>\n    props.isLoading &&\n    css`\n      visibility: hidden;\n    `}\n\n  ${COMMON}\n  ${LAYOUT}\n`;\n\nexport default ImageContainer;\n","import * as React from \"react\";\nimport type {\n  TypeSystemCommonProps,\n  TypeSystemLayoutProps,\n  TypeStyledComponentsCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeImageProps\n  extends TypeStyledComponentsCommonProps,\n    TypeSystemCommonProps,\n    TypeSystemLayoutProps,\n    Omit<React.ComponentPropsWithoutRef<\"img\">, \"color\" | \"height\" | \"width\"> {\n  src: string;\n\n  /** Alt text is required for non-decorative images */\n  alt: string;\n  title: string;\n  onError: (e: React.SyntheticEvent<HTMLImageElement, Event>) => void;\n  onClick: () => void;\n\n  /** A URL for a default image to load if the source image is not available */\n  defaultImage?: string;\n  onLoad: () => void;\n  qa?: object;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;;;ACAvB,+BAA4B;AAC5B,sCAA+B;AAK/B,IAAM,iBAAiB,yBAAAA,QAAO,IAAI,MAAM;AAAA,EACtC,WAAW;AACb,CAAC;AAAA;AAAA;AAAA,IAGG,CAAC,UACD,MAAM,aACN;AAAA;AAAA,KAEC;AAAA;AAAA,IAED,sCAAM;AAAA,IACN,sCAAM;AAAA;AAGV,IAAO,iBAAQ;;;ADsDT;AAhEN,IAAM,OAAO,MAAM;AAAC;AAEpB,IAAqB,QAArB,cAAyC,gBAAqC;AAAA,EAC5E,OAAO,eAAe;AAAA,IACpB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,QAAQ;AAAA,EACV;AAAA,EAES,QAAQ;AAAA,IACf,UAAU;AAAA,IACV,SAAS;AAAA,IACT,UAAU,KAAK,MAAM;AAAA,EACvB;AAAA,EAEA;AAAA,EAES,oBAAoB;AAE3B,QAAI,KAAK,UAAU;AACjB,WAAK,SAAS;AAAA,QACZ,SAAS,KAAK,SAAS;AAAA,MACzB,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAES,mBAAmB,WAA2B;AACrD,QAAI,KAAK,MAAM,QAAQ,UAAU,KAAK;AACpC,WAAK,SAAS;AAAA,QACZ,UAAU;AAAA,QACV,SAAS;AAAA,QACT,UAAU,KAAK,MAAM;AAAA,MACvB,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,UAAU,CAAC,MAAqD;AAC9D,QAAI,CAAC,KAAK,MAAM,YAAY,KAAK,MAAM,cAAc;AACnD,WAAK,SAAS;AAAA,QACZ,UAAU;AAAA,QACV,UAAU,KAAK,MAAM;AAAA,MACvB,CAAC;AAAA,IACH;AAEA,SAAK,MAAM,QAAQ,CAAC;AAAA,EACtB;AAAA,EAEA,SAAS,MAAM;AACb,SAAK,SAAS;AAAA,MACZ,SAAS;AAAA,IACX,CAAC;AACD,SAAK,MAAM,OAAO;AAAA,EACpB;AAAA,EAEA,UAAU,MAAM;AACd,SAAK,MAAM,QAAQ;AAAA,EACrB;AAAA,EAES,SAAS;AAEhB,UAAM,EAAE,KAAK,OAAO,SAAS,SAAS,QAAQ,KAAK,IAAI,GAAG,KAAK,IAC7D,KAAK;AACP,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,CAAC,KAAK,MAAM;AAAA,QACvB,KAAK,CAAC,QAAS,KAAK,WAAW;AAAA,QAC/B,SAAS,KAAK;AAAA,QACd,KAAK,KAAK,MAAM;AAAA,QAChB,SAAS,CAAC,MACR,KAAK,QAAQ,CAAC;AAAA,QAEhB,QAAQ,KAAK;AAAA,QACb;AAAA,QACA;AAAA,QACA,iBAAe,QAAQ,QAAQ,MAAM,MAAM;AAAA,QAC3C,qBAAmB,OAAO;AAAA,QACzB,GAAI;AAAA,QACJ,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;;;AE7FA,IAAAC,SAAuB;;;AHEvB,IAAO,cAAQ;","names":["styled","React"]}
+{"version":3,"sources":["../src/index.ts","../src/Image.tsx","../src/styles.ts","../src/ImageTypes.ts"],"sourcesContent":["import Image from \"./Image\";\n\nexport default Image;\nexport { Image };\nexport * from \"./ImageTypes\";\n","import * as React from \"react\";\nimport ImageContainer from \"./styles\";\nimport type { TypeImageProps } from \"./ImageTypes\";\n\ntype TypeState = {\n  didError: boolean;\n  didLoad: boolean;\n  imageUrl: string;\n};\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = () => {};\n\nexport default class Image extends React.Component<TypeImageProps, TypeState> {\n  static defaultProps = {\n    title: \"\",\n    onError: noop,\n    onClick: noop,\n    onLoad: noop,\n  };\n\n  override state = {\n    didError: false,\n    didLoad: false,\n    imageUrl: this.props.src,\n  };\n\n  imageRef?: HTMLImageElement | null;\n\n  override componentDidMount() {\n    // eslint-disable-next-line react/no-did-mount-set-state\n    if (this.imageRef) {\n      this.setState({\n        didLoad: this.imageRef.complete,\n      });\n    }\n  }\n\n  override componentDidUpdate(prevProps: TypeImageProps) {\n    if (this.props.src !== prevProps.src) {\n      this.setState({\n        didError: false,\n        didLoad: false,\n        imageUrl: this.props.src,\n      });\n    }\n  }\n\n  onError = (e: React.SyntheticEvent<HTMLImageElement, Event>) => {\n    if (!this.state.didError && this.props.defaultImage) {\n      this.setState({\n        didError: true,\n        imageUrl: this.props.defaultImage,\n      });\n    }\n\n    this.props.onError(e);\n  };\n\n  onLoad = () => {\n    this.setState({\n      didLoad: true,\n    });\n    this.props.onLoad();\n  };\n\n  onClick = () => {\n    this.props.onClick();\n  };\n\n  override render() {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const { alt, title, onClick, onError, onLoad, src, qa, ...rest } =\n      this.props;\n    return (\n      <ImageContainer\n        isLoading={!this.state.didLoad}\n        ref={(img) => (this.imageRef = img)}\n        onClick={this.onClick}\n        src={this.state.imageUrl}\n        onError={(e: React.SyntheticEvent<HTMLImageElement, Event>) =>\n          this.onError(e)\n        }\n        onLoad={this.onLoad}\n        alt={alt}\n        title={title}\n        data-qa-image={title ? title : alt ? alt : \"\"}\n        data-qa-image-src={src || \"\"}\n        {...(qa as any)}\n        {...rest}\n      />\n    );\n  }\n}\n","import styled, { css } from \"styled-components\";\nimport { COMMON, LAYOUT } from \"@sproutsocial/seeds-react-system-props\";\n\ninterface ImageContainerProps {\n  isLoading?: boolean;\n}\nconst ImageContainer = styled.img.attrs({\n  className: \"Image\",\n})<ImageContainerProps>`\n  display: block;\n\n  ${(props) =>\n    props.isLoading &&\n    css`\n      visibility: hidden;\n    `}\n\n  ${COMMON}\n  ${LAYOUT}\n`;\n\nexport default ImageContainer;\n","import * as React from \"react\";\nimport type {\n  TypeSystemCommonProps,\n  TypeSystemLayoutProps,\n  TypeStyledComponentsCommonProps,\n} from \"@sproutsocial/seeds-react-system-props\";\n\nexport interface TypeImageProps\n  extends TypeStyledComponentsCommonProps,\n    TypeSystemCommonProps,\n    TypeSystemLayoutProps,\n    Omit<React.ComponentPropsWithoutRef<\"img\">, \"color\" | \"height\" | \"width\"> {\n  src: string;\n\n  /** Alt text is required for non-decorative images */\n  alt: string;\n  title: string;\n  onError: (e: React.SyntheticEvent<HTMLImageElement, Event>) => void;\n  onClick: () => void;\n\n  /** A URL for a default image to load if the source image is not available */\n  defaultImage?: string;\n  onLoad: () => void;\n  qa?: object;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;;;ACAvB,+BAA4B;AAC5B,sCAA+B;AAK/B,IAAM,iBAAiB,yBAAAA,QAAO,IAAI,MAAM;AAAA,EACtC,WAAW;AACb,CAAC;AAAA;AAAA;AAAA,IAGG,CAAC,UACD,MAAM,aACN;AAAA;AAAA,KAEC;AAAA;AAAA,IAED,sCAAM;AAAA,IACN,sCAAM;AAAA;AAGV,IAAO,iBAAQ;;;ADsDT;AAhEN,IAAM,OAAO,MAAM;AAAC;AAEpB,IAAqB,QAArB,cAAyC,gBAAqC;AAAA,EAC5E,OAAO,eAAe;AAAA,IACpB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,QAAQ;AAAA,EACV;AAAA,EAES,QAAQ;AAAA,IACf,UAAU;AAAA,IACV,SAAS;AAAA,IACT,UAAU,KAAK,MAAM;AAAA,EACvB;AAAA,EAEA;AAAA,EAES,oBAAoB;AAE3B,QAAI,KAAK,UAAU;AACjB,WAAK,SAAS;AAAA,QACZ,SAAS,KAAK,SAAS;AAAA,MACzB,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAES,mBAAmB,WAA2B;AACrD,QAAI,KAAK,MAAM,QAAQ,UAAU,KAAK;AACpC,WAAK,SAAS;AAAA,QACZ,UAAU;AAAA,QACV,SAAS;AAAA,QACT,UAAU,KAAK,MAAM;AAAA,MACvB,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,UAAU,CAAC,MAAqD;AAC9D,QAAI,CAAC,KAAK,MAAM,YAAY,KAAK,MAAM,cAAc;AACnD,WAAK,SAAS;AAAA,QACZ,UAAU;AAAA,QACV,UAAU,KAAK,MAAM;AAAA,MACvB,CAAC;AAAA,IACH;AAEA,SAAK,MAAM,QAAQ,CAAC;AAAA,EACtB;AAAA,EAEA,SAAS,MAAM;AACb,SAAK,SAAS;AAAA,MACZ,SAAS;AAAA,IACX,CAAC;AACD,SAAK,MAAM,OAAO;AAAA,EACpB;AAAA,EAEA,UAAU,MAAM;AACd,SAAK,MAAM,QAAQ;AAAA,EACrB;AAAA,EAES,SAAS;AAEhB,UAAM,EAAE,KAAK,OAAO,SAAS,SAAS,QAAQ,KAAK,IAAI,GAAG,KAAK,IAC7D,KAAK;AACP,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,CAAC,KAAK,MAAM;AAAA,QACvB,KAAK,CAAC,QAAS,KAAK,WAAW;AAAA,QAC/B,SAAS,KAAK;AAAA,QACd,KAAK,KAAK,MAAM;AAAA,QAChB,SAAS,CAAC,MACR,KAAK,QAAQ,CAAC;AAAA,QAEhB,QAAQ,KAAK;AAAA,QACb;AAAA,QACA;AAAA,QACA,iBAAe,QAAQ,QAAQ,MAAM,MAAM;AAAA,QAC3C,qBAAmB,OAAO;AAAA,QACzB,GAAI;AAAA,QACJ,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;;;AE7FA,IAAAC,SAAuB;;;AHEvB,IAAO,gBAAQ;","names":["styled","React"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sproutsocial/seeds-react-image",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Seeds React Image",
   "author": "Sprout Social, Inc.",
   "license": "MIT",
@@ -18,8 +18,8 @@
     "test:watch": "jest --watch --coverage=false"
   },
   "dependencies": {
-    "@sproutsocial/seeds-react-theme": "^*",
-    "@sproutsocial/seeds-react-system-props": "^*"
+    "@sproutsocial/seeds-react-theme": "^2.2.0",
+    "@sproutsocial/seeds-react-system-props": "^3.0.1"
   },
   "devDependencies": {
     "@types/react": "^18.0.0",