import {
  __decorateClass
} from "../../chunks/chunk.QU3DSPNU.js";
import { ifDefined } from "lit/directives/if-defined.js";
import { GdsElement } from "../../gds-element.js";
import { tokens } from "../../tokens.style.js";
import { styleExpressionProperty } from "../../utils/decorators/style-expression-property.js";
import {
  gdsCustomElement,
  html
} from "../../utils/helpers/custom-element-scoping.js";
import {
  withMarginProps,
  withPositioningProps,
  withSizeXProps,
  withSizeYProps
} from "../../utils/mixins/declarative-layout-mixins.js";
import { withImageProps } from "../../utils/mixins/props-image.js";
import IMGStyles from "./img.styles.js";
let GdsImg = class extends withPositioningProps(
  withMarginProps(withSizeXProps(withSizeYProps(withImageProps(GdsElement))))
) {
  render() {
    return html`<img
      src="${ifDefined(this.src)}"
      alt="${ifDefined(this.alt)}"
      srcset=${ifDefined(this.srcset)}
      sizes=${ifDefined(this.sizes)}
      loading=${ifDefined(this.loading)}
      decoding=${ifDefined(this.decoding)}
    />`;
  }
};
GdsImg.styles = [tokens, IMGStyles];
__decorateClass([
  styleExpressionProperty({ selector: "img" })
], GdsImg.prototype, "aspect-ratio", 2);
__decorateClass([
  styleExpressionProperty({
    property: "border-radius",
    valueTemplate: (v) => `var(--gds-sys-space-${v})`
  })
], GdsImg.prototype, "border-radius", 2);
__decorateClass([
  styleExpressionProperty({
    selector: "img"
  })
], GdsImg.prototype, "object-fit", 2);
__decorateClass([
  styleExpressionProperty({
    selector: "img"
  })
], GdsImg.prototype, "object-position", 2);
GdsImg = __decorateClass([
  gdsCustomElement("gds-img")
], GdsImg);
export {
  GdsImg
};
