import{makeStyleResponsive as e,makeWidth as o,template as r}from"@gem-sdk/core";import{getPPCInlineStyleChoice as t}from"./common/getProductPropertiesChoiceInlineCss.js";import{getDynamicSourceLocales as s}from"../../../../helpers.js";import{createClass as i,createStyle as m,createAttr as c}from"@gem-sdk/system";import{getPPCWrapperClasses as l,getPPCLabelClasses as $,getPPCWrapperClassesMain as d}from"./common/getProductPropertiesChoiceClasses.js";import{getPPCContainerStyles as p,getPPCLabelStyles as u,getPPCInputStyles as a}from"./common/getProductPropertiesChoiceStyles.js";import{getPPCInputAttrs as n}from"./common/getProductPropertiesChoiceAttrs.js";let ProductPropertyChoice=({setting:P,styles:f,builderProps:y,pageContext:h,attributes:C})=>{let g=y?.uid,{name:j,type:v,childItem:b,translate:k}=P??{},{valueTextColor:I,fullWidth:_,width:x}=f??{},w=e("w",o(x,_)),A=`properties[${j}]`,S=t(g,I),q=i({...l()}),z=i({...$(f)}),B=m({...p(f)}),D=i({...d()}),E=m({...u(f)}),F=c({...n(C)}),G=m({...a(f)});return r`<div style="${{...w}}" class="${D}">
      <style>${S}</style>

      ${b?.map((e,o)=>{let t=s({val:e,uid:g,settingId:`childItem_${o}`,pageContext:h,translate:k});return r`
            <div class="${q}" style="${B}">
              <input
                ${{...F}}
                type="${v}"
                id="${g}-${j}-${o}"
                name="${"radio"===v||"checkbox"===v?A:`${A}[]`}"
                value="${t}"
                style="${G}"
                form="{{ product_form_id }}"
              />
              <label
                for="${g}-${j}-${o}"
                class="${z}"
                style="${E}"
              >
                ${t}
              </label>
            </div>`}).join("")}
      </div>
  `};export{ProductPropertyChoice as default};
