'use client';
import{jsx as e}from"react/jsx-runtime";import{makeStyleResponsive as t,makeWidth as a,composeTypographyClassName as i,composeTypographyStyle as r,cls as c,getGlobalColorStateClass as o,getGlobalColorClass as s,handleConvertClassColor as l,getGlobalColorStateStyle as p,makeStyle as n,composeRadius as g,getRadiusStyleActiveState as v,getStyleShadowState as b,getStyleShadow as d,handleConvertBorderStyle as m,handleConvertBorderWidth as x,handleConvertBorderColor as u,getSingleColorVariable as f}from"@gem-sdk/core";import{useMemo as h}from"react";let RectangleListVariant=({value:w,isVariantOutStock:y,checked:j,swatchAutoWidth:L,swatchWidth:N,swatchHeight:R,optionTransform:V,optionTypography:k,optionBgColor:A,optionTextColor:E,optionBorder:F,optionRounded:S,optionHasShadow:T,optionShadow:q,optionTypo:z})=>{let B=()=>n({bg:f(A?.active),bs:F?.active?.border,bw:F?.active?.width,bc:f(F?.active?.color)}),C=t("w",a(N,L)),D=h(()=>({...S,active:{...S?.active||{},radiusType:"custom"}}),[S]),G=i(z,k),H=r(z,k);return e("div",{className:c(j?s("bg",A?.active):o("bg",A),l(F),G,"gp-box-border gp-inline-flex gp-cursor-pointer gp-items-center gp-justify-center gp-text-center",{"gp-pointer-events-none  !gp-cursor-not-allowed":y}),style:{...j?{}:p("bg",A),...j?B():{},...n({tt:V}),...H,...t("h",R),...C,...j?v(D):g(S),...j?d({value:q?.active,state:"active",styleAppliedFor:"box-shadow",isEnableShadow:T?.active},!0):b(q,"box-shadow",T),...j?{}:m(F),...j?{}:x(F),...j?{}:u(F)},children:e("span",{className:c("gp-flex gp-items-center gp-px-[16px]",j?s("text",E?.active):o("text",E)),style:{...j?n({c:f(E?.active)}):p("c",E)},children:w?.label})})};export{RectangleListVariant as default};
