'use client';
import{jsxs as e,jsx as t}from"react/jsx-runtime";import{useSelectedOption as o,useProduct as a,useVariantOutStock as i}from"@gem-sdk/core";import{useMemo as l}from"react";import r from"../base/base.js";import s from"../color/color.js";import n from"../image/Image.js";import m from"../image-shopify/ImageShopify.js";import c from"../rectangle-list/RectangleList.js";import{createClass as p,createStyle as u,createAttr as d}from"@gem-sdk/system";import{getVariantItemLabelClass as h,getTooltipClass as f,getTooltipSvgClass as g,getVariantOptionClass as v}from"../../common/variants/classes.js";import{getLabelVariantStyle as b}from"../../common/variants/styles.js";import{getVariantOptionAttr as w}from"../../common/variants/attrs.js";let y=y=>{let{name:N,variantKey:j,optionName:S,optionValue:$,typeOfOption:k}=y,{setSelectedOption:O}=o(),x=a(),C=l(()=>{if(!y.presetConfiguration)return;let{presets:e,optionType:t}=y.presetConfiguration;return e?.[t||"rectangle_list"]},[y.presetConfiguration]),I=l(()=>{if(!y.showAsSwatches)return c;switch(k){case"color":return s;case"image":return n;case"image_shopify":return m;default:return r}},[k,y.showAsSwatches]),L=i(N??"",y.value?.label??"",{position:y.optionPosition,optionNumber:y.optionNumber||0}),V=l(()=>"disable"===y.soldOutStyle,[y.soldOutStyle]),F=l(()=>"line"===y.soldOutStyle,[y.soldOutStyle]),A=p(h({...y,available:L})),M=p(f()),P=p(g()),E=p(v()),R=u(b(C?.width)),_=d(w(y,"React"));return e("label",{className:A,style:R,htmlFor:`${y.uid}-${j}`,children:[e("div",{className:M,children:[t("p",{className:"gp-text-[#F9F9F9]",children:y.value?.label}),t("svg",{className:P,width:"8",height:"4",viewBox:"0 0 16 10",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t("path",{d:"M8 10L0 0L16 1.41326e-06L8 10Z",fill:"#333333"})})]}),t("input",{checked:y.checked,name:`${x?.id}-options-${N?.toString().replaceAll('"','\\"')}`,id:`${y.uid}-${j}`,value:y.value?.label,type:"radio",className:"gp-sr-only",onChange:()=>{if(L||!V){O(N,y.value?.label,x?.id);let e=new CustomEvent("change-selected-option",{bubbles:!0,cancelable:!0,composed:!0,detail:{optionId:N,optionValue:y.value?.label,productId:x?.id}});window.dispatchEvent(e)}}}),t("span",{className:"gp-sr-only",children:y.value?.label}),t("div",{..._,className:E,children:t(I,{...y,optionName:S,optionNameValue:$,preset:C,isVariantOutStock:V&&!L&&0!==y.optionPosition,soldOutMark:V,soldOutMarkLine:F,available:L,swatchValue:y.value,product:x,variantKey:`${y.uid}-${j}`})})]})};y.defaultProps={};export{y as default};
