'use client';
import{jsxs as s,jsx as e}from"react/jsx-runtime";import{useRef as t,useEffect as r}from"react";import{useStockCounterInteraction as l}from"../hooks/useStockCounterInteraction.js";import{createClass as o,createStyle as m,createAttr as n}from"@gem-sdk/system";import{useStockCounter as a}from"../hooks/useStockCounter.js";import{getInlineCss as i}from"../common/helpers.js";import{getProgressBarClasses as c,getContainerClasses as d,getWrapperIconClasses as u,getIconClasses as p,getOuterIconClasses as f,getTextClasses as y,getWrapperClasses as h}from"../common/classes.js";import{getProgressBarStyles as N,getContainerStyles as S,getWrapperStyles as k,getIconStyles as _,getTextStyles as j}from"../common/styles.js";import{getWrapperAttrs as I,getIconAttrs as g}from"../common/attrs.js";let v=({setting:v,styles:H,builderProps:L})=>{let{displayProgressBar:M,borderRadius:O}=H??{},{showIcon:T,icon:b,layout:C="full",oosIcon:x}=v??{},{outputMessage:V,isOutOfStock:q,inventoryQuantity:w,shouldHideCounter:z}=a(v,H),A=t(null),{dispatchStockCounterInteraction:B}=l({element:A,uid:L?.uid}),D=i(L?.uid,O),E=!1!==M&&!q,F=o({...c(H)}),G=m({...N(H,v)}),J=m({...S(H)}),K=o({...d(v)}),P=m({...k(H)}),Q=o({...u(v)}),R=o({...p()}),U=o({...f()}),W=s=>m({..._(H,v,s)}),X=({isOutOfStockIcon:s,isVisible:e})=>n({...g(s,e)}),Y=o({...y(H)}),Z=s=>m({...j(H,s)}),$=o({...h(v,q)}),ss=n({...I(L)});return(r(()=>{B(w)},[w]),z)?null:s("div",{...ss,style:P,ref:A,className:$,children:[e("style",{children:D}),s("div",{className:K,style:J,children:[s("div",{className:Q,children:[T&&(q?e("div",{...X({isOutOfStockIcon:q,isVisible:q}),style:W(!0),className:U,children:e("span",{className:R,dangerouslySetInnerHTML:{__html:x||""}})}):e("div",{...X({isOutOfStockIcon:!q,isVisible:!q}),style:W(!1),className:U,children:e("span",{className:R,dangerouslySetInnerHTML:{__html:b||""}})})),"progress-bar"!==C&&(q?e("p",{dangerouslySetInnerHTML:{__html:V()},className:Y,style:Z(!0)}):e("p",{dangerouslySetInnerHTML:{__html:V()},className:Y,style:Z(!1)}))]}),E&&e("div",{style:G,className:F})]})]})};export{v as default};
