import { g as i, r as e, h as s, H as n, a as t } from "./p-9b9ccd0c.js";

import { L as r } from "./p-311eedf3.js";

const a = ":host{display:grid;block-size:100%;inline-size:100%;align-items:center;justify-content:center}.slide{display:grid;max-inline-size:1100px;grid-template-columns:1fr 550px;background-color:var(--color-accent-surface-elevation-1);border-radius:16px;overflow:hidden}.slide__illustration{overflow:hidden;max-block-size:700px}.slide__sign-in{display:grid;block-size:100%;inline-size:100%;padding:48px}.slide__sign-in-container{display:grid;gap:var(--spacing-gap-xxl);max-inline-size:480px;place-self:center}.slide__sign-in-header{display:grid;gap:var(--spacing-gap-xxl)}.slide__sign-in-title{font-size:var(--font-size-header-h2);color:var(--color-text-neutral-strawberry);letter-spacing:0.02em;font-weight:var(--font-style-semi-bold);line-height:var(--line-height-tight)}.slide__sign-in-description{display:grid;color:var(--color-text-neutral-disabled);gap:40px;font-size:var(--font-size-body-l);font-weight:var(--font-style-regular);line-height:var(--line-height-spacious)}.terms-conditions{text-decoration:underline}.sign-in-btn{padding-inline-start:48px !important;padding-inline-end:48px !important}";

var o = undefined && undefined.__classPrivateFieldSet || function(i, e, s, n, t) {
  if (n === "m") throw new TypeError("Private method is not writable");
  if (n === "a" && !t) throw new TypeError("Private accessor was defined without a setter");
  if (typeof e === "function" ? i !== e || !t : !e.has(i)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
  return n === "a" ? t.call(i, s) : t ? t.value = s : e.set(i, s), s;
};

var l = undefined && undefined.__classPrivateFieldGet || function(i, e, s, n) {
  if (s === "a" && !n) throw new TypeError("Private accessor was defined without a getter");
  if (typeof e === "function" ? i !== e || !n : !e.has(i)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
  return s === "m" ? n : s === "a" ? n.call(i) : n ? n.value : e.get(i);
};

var d;

const c = i(`./gx-ide-assets/welcome-page/images/copyrights-illustration.png`);

const g = i(`./gx-ide-assets/welcome-page/images/icon-next.svg`);

const p = [ "resets/box-sizing", "utils/typography", "components/button" ];

const h = class {
  constructor(i) {
    e(this, i);
    /**
         * The component hard-coded strings translations.
         */
    // eslint-disable-next-line @stencil-community/own-props-must-be-private
        d.set(this, void 0);
    this.termsCallback = undefined;
    this.signInCallback = undefined;
  }
  async componentWillLoad() {
    o(this, d, await r.getComponentStrings(this.el), "f");
  }
  render() {
    return s(n, null, s("ch-theme", {
      model: p
    }), s("section", {
      class: "slide"
    }, s("div", {
      class: "slide__illustration",
      role: "img",
      "aria-label": l(this, d, "f").illustrationAriaLabel
    }, s("img", {
      // base image (acts like a background)
      src: c,
      class: "slide__illustration",
      alt: l(this, d, "f").illustrationFigureAriaLabel
    })), s("div", {
      class: "slide__sign-in"
    }, s("div", {
      class: "slide__sign-in-container"
    }, s("header", {
      class: "slide__sign-in-header"
    }, s("img", {
      src: g,
      alt: l(this, d, "f").illustrationAlternativeText
    }), s("h2", {
      class: "slide__sign-in-title"
    }, l(this, d, "f").title)), s("div", {
      class: "slide__sign-in-description"
    }, s("p", null, s("span", null, l(this, d, "f").descriptionText)), s("span", null, l(this, d, "f").byContinuingTextFirstPart, s("a", {
      class: "terms-conditions",
      onClick: this.termsCallback
    }, l(this, d, "f").byContinuingCallBackText))), s("div", null, s("button", {
      class: "button-primary sign-in-btn",
      onClick: this.signInCallback
    }, l(this, d, "f").signInButtonCaption))))));
  }
  static get assetsDirs() {
    return [ "gx-ide-assets/sign-in" ];
  }
  get el() {
    return t(this);
  }
};

d = new WeakMap;

h.style = a;

export { h as gx_ide_sign_in };
//# sourceMappingURL=p-f339e8a0.entry.js.map