import{ERROR_TYPES as e,parseRawJson as t,toJson as s}from"@clevercloud/client/esm/utils/env-vars.js";import{LitElement as r,html as n,css as i}from"lit";import{i18n as a}from"./translation.js";import{CcEnvChangeEvent as o}from"./components/cc-env-var-form/cc-env-var-form.events.js";import"./cc-input-text.js";import"./cc-link.js";import"./cc-notice.js";const c=[{name:"VARIABLE_ONE",value:""},{name:"VARIABLE_FOOBAR",value:""},{name:"VARIABLE_PORT",value:""}];class l extends r{static get properties(){return{disabled:{type:Boolean},readonly:{type:Boolean},state:{type:Object},_errors:{type:Array,state:!0},_formattedErrors:{type:Array,state:!0},_skeleton:{type:Boolean,state:!0},_variablesAsJson:{type:String,state:!0}}}constructor(){super(),this.disabled=!1,this.readonly=!1,this.state={type:"loading"},this._errors=[],this._skeleton=!1,this._variablesAsJson=""}_setErrors(t){this._errors=t.map((({type:t,name:s})=>t===e.INVALID_NAME?{msg:a("cc-env-var-editor-json.errors.invalid-name",{name:s}),isWarning:!1}:t===e.DUPLICATED_NAME?{msg:a("cc-env-var-editor-json.errors.duplicated-name",{name:s}),isWarning:!1}:t===e.INVALID_JSON?{msg:a("cc-env-var-editor-json.errors.invalid-json"),isWarning:!1}:t===e.INVALID_JSON_FORMAT?{msg:a("cc-env-var-editor-json.errors.invalid-json-format"),isWarning:!1}:t===e.INVALID_JSON_ENTRY?{msg:a("cc-env-var-editor-json.errors.invalid-json-entry"),isWarning:!1}:t===e.INVALID_NAME_STRICT?{msg:a("cc-env-var-editor-json.errors.invalid-name-strict",{name:s}),isWarning:!1}:t===e.JAVA_INFO?{msg:a("cc-env-var-editor-json.info.java-prop",{name:s}),isWarning:!0}:{line:"?",msg:a("cc-env-var-editor-json.errors.unknown"),isWarning:!1}))}_onInput({detail:s}){if("loading"===this.state.type)return;this._variablesAsJson=s;const{variables:r,errors:n}=t(s,{mode:this.state.validationMode});this._setErrors(n);n.some((({type:t})=>t===e.INVALID_JSON||t===e.INVALID_JSON_FORMAT))||this.dispatchEvent(new o(r))}willUpdate(e){if(e.has("state")){this._skeleton="loading"===this.state.type;const e=("loading"===this.state.type?c:this.state.variables).filter((({isDeleted:e})=>!e));this._variablesAsJson=s(e),this._setErrors([])}}render(){return n`
      ${this.readonly?"":n` <div class="example">${a("cc-env-var-editor-json.example")}</div> `}
      <cc-input-text
        label=${a("cc-env-var-editor-json.label")}
        hidden-label
        multi
        clipboard
        value=${this._variablesAsJson}
        ?disabled=${this.disabled}
        ?readonly=${this.readonly}
        ?skeleton=${this._skeleton}
        @cc-input=${this._onInput}
      ></cc-input-text>

      ${this._errors.length>0?n`
            <div class="error-list">
              ${this._errors.map((({msg:e,isWarning:t})=>n`
                  <cc-notice intent="${t?"info":"warning"}">
                    <div slot="message">${e}</div>
                  </cc-notice>
                `))}
            </div>
          `:""}
    `}static get styles(){return[i`
        :host {
          display: block;
        }

        :host([hidden]) {
          display: none;
        }

        .error-list {
          display: grid;
          grid-gap: 0.75em;
          margin-top: 1em;
        }

        .example {
          line-height: 1.5;
          padding-bottom: 1em;
        }

        /* i18n error message may contain <code> tags */

        cc-notice code,
        .example code {
          background-color: var(--cc-color-bg-neutral, #eee);
          border-radius: var(--cc-border-radius-default, 0.25em);
          font-family: var(--cc-ff-monospace, monospace);
          padding: 0.15em 0.3em;
        }

        cc-input-text {
          --cc-input-font-family: var(--cc-ff-monospace, monospace);
        }
      `]}}window.customElements.define("cc-env-var-editor-json",l);export{l as CcEnvVarEditorJson};
//# sourceMappingURL=cc-env-var-editor-json.js.map
