'use client';
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),React=require("react"),RectangleList=require("./RectangleList.js"),helper=require("../../../../../common/helper.js");const VariantItem=({name:e,variantKey:t,...o})=>{let{setSelectedOption:a}=core.useSelectedOption(),i=core.useProduct(),s=React.useMemo(()=>{if(!o.presetConfiguration)return;let{presets:e,optionType:t}=o.presetConfiguration;return e?.[t||"rectangle_list"]},[o.presetConfiguration]),l=s?.itemSpacing,n=s?.numberPerRow||5,r=React.useMemo(()=>({minWidth:`${100/n}%`,paddingLeft:helper.postPurchaseSpacing[l||"none"],paddingTop:helper.postPurchaseSpacing[l||"none"],width:`${100/n}%`}),[l,n]),u=React.useMemo(()=>RectangleList.default,[]),c=core.useVariantOutStock(e??"",o.value?.label??"",{position:o.optionPosition,optionNumber:o.optionNumber}),d=React.useMemo(()=>"Disable"===o.soldOutStyle&&o.soldOutMark,[o.soldOutStyle,o.soldOutMark]),p=React.useMemo(()=>"Line"===o.soldOutStyle&&o.soldOutMark,[o.soldOutStyle,o.soldOutMark]),m=()=>{if(c||!d){a(e,o.value?.label,i?.id);let t=new CustomEvent("change-selected-option",{bubbles:!0,cancelable:!0,composed:!0,detail:{optionId:e,optionValue:o.value?.label,productId:i?.id}});window.dispatchEvent(t)}};return jsxRuntime.jsxs("label",{className:core.cls({"gp-pointer-events-none":d&&!c,"gp-flex gp-items-center":!0}),style:{...r},htmlFor:`${o.uid}-${t}`,children:[jsxRuntime.jsx("input",{checked:o.checked,name:`${i?.id}-options-${e?.toString().replaceAll('"','\\"')}`,id:`${o.uid}-${t}`,value:o.value?.label,type:"radio",className:"gp-sr-only",onChange:m}),jsxRuntime.jsx("span",{className:"gp-sr-only",children:o.value?.label}),jsxRuntime.jsx(u,{...o,preset:s,isVariantOutStock:d&&!c&&0!==o.optionPosition,soldOutMark:d,soldOutMarkLine:p,available:c})]})};VariantItem.defaultProps={},exports.default=VariantItem;
