'use client';
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),core=require("@gem-sdk/core"),React=require("react");const RectangleListVariant=({value:e,isVariantOutStock:t,checked:o,swatchAutoWidth:r,swatchWidth:a,swatchHeight:l,optionTransform:c,optionTypography:s,optionBgColor:i,optionTextColor:n,optionBorder:g,optionRounded:p,optionHasShadow:d,optionShadow:b,optionTypo:v})=>{let S=()=>core.makeStyle({bg:core.getSingleColorVariable(i?.active),bs:g?.active?.border,bw:g?.active?.width,bc:core.getSingleColorVariable(g?.active?.color)}),y=core.makeStyleResponsive("w",core.makeWidth(a,r)),m=React.useMemo(()=>({...p,active:{...p?.active||{},radiusType:"custom"}}),[p]),u=core.composeTypographyClassName(v,s),C=core.composeTypographyStyle(v,s);return jsxRuntime.jsx("div",{className:core.cls(o?core.getGlobalColorClass("bg",i?.active):core.getGlobalColorStateClass("bg",i),core.handleConvertClassColor(g),u,"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":t}),style:{...o?{}:core.getGlobalColorStateStyle("bg",i),...o?S():{},...core.makeStyle({tt:c}),...C,...core.makeStyleResponsive("h",l),...y,...o?core.getRadiusStyleActiveState(m):core.composeRadius(p),...o?core.getStyleShadow({value:b?.active,state:"active",styleAppliedFor:"box-shadow",isEnableShadow:d?.active},!0):core.getStyleShadowState(b,"box-shadow",d),...o?{}:core.handleConvertBorderStyle(g),...o?{}:core.handleConvertBorderWidth(g),...o?{}:core.handleConvertBorderColor(g)},children:jsxRuntime.jsx("span",{className:core.cls("gp-flex gp-items-center gp-px-[16px]",o?core.getGlobalColorClass("text",n?.active):core.getGlobalColorStateClass("text",n)),style:{...o?core.makeStyle({c:core.getSingleColorVariable(n?.active)}):core.getGlobalColorStateStyle("c",n)},children:e?.label})})};exports.default=RectangleListVariant;
