import{template as e}from"@gem-sdk/core";import{getDynamicSourceLocales as t,createSettingId as s}from"../../../helpers.js";import{createStyle as i,createClass as o,If as r}from"@gem-sdk/system";import{composeContainerStyles as m,composeTextareaStyles as d}from"./common/styles.js";import{composeContainerClasses as l,composeTextFieldClasses as a}from"./common/classes.js";import{TextField as p}from"../../settings/text-field/configs/translate.js";let n=({setting:n,builderProps:c,className:f,builderAttrs:$,advanced:u,pageContext:g,styles:x})=>{let{text:v,name:y,placeholder:j,required:h}=n??{},k=t({val:j,uid:c?.uid,settingId:s({id:p?.placeholder?.id}),pageContext:g??{}}),F=i(m(u,n)),T=o(l(u,c)),q=o(a(n,c,f??"")),C=i(d(u,n,x));return e`
    <div
      ${$}
      data-id="${c?.uid}"
      class="${T}"
      style="${F}"
    >
      <input
        type="text"
        class="${q}"
        style="${C}"
        placeholder="${k}"
        ${r(h,"required")}
        name="${""===y||void 0===y?"contact[first_name]":y}"
        value="${v}"
      ></input>
    </div>
  `};export{n as default};
