@xhub-short/ui 1.0.0-beta.24 → 1.0.0-beta.26

package/dist/{chunk-26KDWJRI.js → chunk-3OB3OVYR.js}

@@ -111,7 +111,7 @@ function AuthorDescription({
 }
 
 // src/components/AuthorInfo/AuthorInfo.css.ts
-var AUTHOR_INFO_CSS = `.sv-author-info{display:flex;align-items:center;gap:var(--sv-author-gap,12px);width:100%}.sv-author-info--vertical{flex-direction:column;align-items:flex-start}.sv-author-info--horizontal{flex-direction:row;align-items:center}.sv-author-info--compact{gap:var(--sv-author-gap-compact,8px)}.sv-author-info__avatar{position:relative;flex-shrink:0;width:var(--sv-author-avatar-size,48px);height:var(--sv-author-avatar-size,48px);border-radius:50%;overflow:hidden;background:var(--sv-author-avatar-bg,rgba(255,255,255,.1));cursor:pointer;transition:transform .15s ease}.sv-author-info__avatar:hover{transform:scale(1.05)}.sv-author-info__avatar:active{transform:scale(.98)}.sv-author-info__avatar-img{width:100%;height:100%;object-fit:cover;border-radius:50%}.sv-author-info__avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--sv-author-avatar-placeholder-bg,linear-gradient(135deg,#667eea 0%,#764ba2 100%));color:var(--sv-author-avatar-placeholder-color,#fff);font-size:calc(var(--sv-author-avatar-size,48px)* .4);font-weight:600;text-transform:uppercase}.sv-author-info__avatar-placeholder svg{width:60%;height:60%;opacity:.9}.sv-author-info__avatar--small{width:var(--sv-author-avatar-size-small,32px);height:var(--sv-author-avatar-size-small,32px)}.sv-author-info__avatar--large{width:var(--sv-author-avatar-size-large,64px);height:var(--sv-author-avatar-size-large,64px)}.sv-author-info__verified-badge{position:absolute;bottom:-2px;right:-2px;width:calc(var(--sv-author-avatar-size,48px)* .35);height:calc(var(--sv-author-avatar-size,48px)* .35);min-width:14px;min-height:14px;border-radius:50%;background:var(--sv-verified-badge-bg,#1DA1F2);display:flex;align-items:center;justify-content:center;border:2px solid var(--sv-verified-badge-border,#000)}.sv-author-info__verified-badge svg{width:60%;height:60%;color:var(--sv-verified-badge-color,#fff)}.sv-author-info__content{display:flex;flex-direction:column;gap:var(--sv-author-content-gap,2px);flex:1;min-width:0}.sv-author-info__name{display:flex;align-items:center;gap:var(--sv-author-name-gap,4px);font-size:var(--sv-author-name-size,16px);font-weight:var(--sv-author-name-weight,600);color:var(--sv-author-name-color,#fff);cursor:pointer;transition:opacity .15s ease}.sv-author-info__name:hover{opacity:.8}.sv-author-info__name-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sv-author-info__name--with-at::before{content:'@';opacity:.8}.sv-author-info__name-verified{flex-shrink:0;width:var(--sv-author-name-verified-size,14px);height:var(--sv-author-name-verified-size,14px);color:var(--sv-verified-badge-bg,#1DA1F2)}.sv-author-info__description{font-size:var(--sv-author-desc-size,13px);color:var(--sv-author-desc-color,rgba(255,255,255,.7));line-height:var(--sv-author-desc-line-height,1.4);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:var(--sv-author-desc-lines,2);-webkit-box-orient:vertical}.sv-author-info__description--single-line{-webkit-line-clamp:1;white-space:nowrap;display:block}.sv-author-info__follow-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sv-follow-btn-gap,6px);padding:var(--sv-follow-btn-padding,8px 16px);min-width:var(--sv-follow-btn-min-width,88px);border:0;border-radius:var(--sv-follow-btn-radius,4px);font-size:var(--sv-follow-btn-size,14px);font-weight:var(--sv-follow-btn-weight,600);cursor:pointer;transition:all .2s ease;outline:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.sv-author-info__follow-btn--default{background:var(--sv-follow-btn-bg,#fe2c55);color:var(--sv-follow-btn-color,#fff)}.sv-author-info__follow-btn--default:hover:not(:disabled){background:var(--sv-follow-btn-bg-hover,#f46);transform:scale(1.02)}.sv-author-info__follow-btn--default:active:not(:disabled){transform:scale(.98)}.sv-author-info__follow-btn--following{background:var(--sv-follow-btn-following-bg,transparent);color:var(--sv-follow-btn-following-color,rgba(255,255,255,.9));border:1px solid var(--sv-follow-btn-following-border,rgba(255,255,255,.3))}.sv-author-info__follow-btn--following:hover:not(:disabled){background:var(--sv-follow-btn-following-bg-hover,rgba(255,255,255,.1));border-color:var(--sv-follow-btn-following-border-hover,rgba(255,255,255,.5))}.sv-author-info__follow-btn--pending{opacity:.6;pointer-events:none;cursor:wait}.sv-author-info__follow-btn:disabled{opacity:.5;cursor:not-allowed}.sv-author-info__follow-btn-icon{width:var(--sv-follow-btn-icon-size,16px);height:var(--sv-follow-btn-icon-size,16px);flex-shrink:0}.sv-author-info__follow-btn-spinner{width:var(--sv-follow-btn-icon-size,16px);height:var(--sv-follow-btn-icon-size,16px);border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:sv-author-info-spin .6s linear infinite}@keyframes sv-author-info-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.sv-author-info__follow-btn--small{padding:var(--sv-follow-btn-padding-small,6px 12px);font-size:var(--sv-follow-btn-size-small,12px);min-width:var(--sv-follow-btn-min-width-small,72px)}.sv-author-info__follow-btn--large{padding:var(--sv-follow-btn-padding-large,10px 20px);font-size:var(--sv-follow-btn-size-large,16px);min-width:var(--sv-follow-btn-min-width-large,100px)}.sv-author-info__follow-btn--icon-only{min-width:unset;padding:var(--sv-follow-btn-icon-padding,8px);border-radius:50%}.sv-author-info--inline{justify-content:space-between}.sv-author-info--inline .sv-author-info__content{flex:1}.sv-author-info--stacked{flex-direction:column;align-items:center;text-align:center}.sv-author-info--stacked .sv-author-info__content{align-items:center}.sv-author-info--overlay{text-shadow:var(--sv-author-overlay-shadow,0 1px 2px rgba(0,0,0,.5))}.sv-author-info--overlay .sv-author-info__avatar{border:2px solid var(--sv-author-overlay-avatar-border,rgba(255,255,255,.5))}.sv-author-info--avatar-badge{position:relative;display:flex;flex-direction:column;align-items:center;width:auto;gap:0}.sv-author-info--avatar-badge .sv-author-info__avatar{width:var(--sv-avatar-badge-size,48px);height:var(--sv-avatar-badge-size,48px);border:2px solid var(--sv-avatar-badge-border,#fff)}.sv-author-info--avatar-badge .sv-author-info__follow-btn{position:absolute;bottom:var(--sv-avatar-badge-btn-bottom,-10px);left:50%;transform:translateX(-50%);min-width:unset;width:var(--sv-avatar-badge-btn-size,24px);height:var(--sv-avatar-badge-btn-size,24px);padding:0;border-radius:50%;background:var(--sv-color-primary,#fe2c55);border:2px solid var(--sv-bg-primary,#000);z-index:1}.sv-author-info--avatar-badge .sv-author-info__follow-btn:hover:not(:disabled){transform:translateX(-50%)scale(1.1)}.sv-author-info--avatar-badge .sv-author-info__follow-btn:active:not(:disabled){transform:translateX(-50%)scale(.95)}.sv-author-info--avatar-badge .sv-author-info__follow-btn-icon{width:var(--sv-avatar-badge-icon-size,14px);height:var(--sv-avatar-badge-icon-size,14px)}.sv-author-info--avatar-badge .sv-author-info__follow-btn--following{display:none}.sv-author-info--avatar-badge .sv-author-info__content{display:none}.sv-author-info--avatar-badge{margin-bottom:var(--sv-avatar-badge-margin,16px)}`;
+var AUTHOR_INFO_CSS = `.sv-author-info{display:flex;align-items:center;gap:var(--sv-author-gap,12px);width:100%}.sv-author-info--vertical{flex-direction:column;align-items:flex-start}.sv-author-info--horizontal{flex-direction:row;align-items:center}.sv-author-info--compact{gap:var(--sv-author-gap-compact,8px)}.sv-author-info__avatar{position:relative;flex-shrink:0;width:var(--sv-author-avatar-size,48px);height:var(--sv-author-avatar-size,48px);border-radius:50%;overflow:hidden;background:var(--sv-author-avatar-bg,rgba(255,255,255,.1));cursor:pointer;transition:transform .15s ease}.sv-author-info__avatar:hover{transform:scale(1.05)}.sv-author-info__avatar:active{transform:scale(.98)}.sv-author-info__avatar-img{width:100%;height:100%;object-fit:cover;border-radius:50%}.sv-author-info__avatar-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:var(--sv-author-avatar-placeholder-bg,linear-gradient(135deg,#667eea 0%,#764ba2 100%));color:var(--sv-author-avatar-placeholder-color,#fff);font-size:calc(var(--sv-author-avatar-size,48px)* .4);font-weight:600;text-transform:uppercase}.sv-author-info__avatar-placeholder svg{width:60%;height:60%;opacity:.9}.sv-author-info__avatar--small{width:var(--sv-author-avatar-size-small,32px);height:var(--sv-author-avatar-size-small,32px)}.sv-author-info__avatar--large{width:var(--sv-author-avatar-size-large,64px);height:var(--sv-author-avatar-size-large,64px)}.sv-author-info__verified-badge{position:absolute;bottom:-2px;right:-2px;width:calc(var(--sv-author-avatar-size,48px)* .35);height:calc(var(--sv-author-avatar-size,48px)* .35);min-width:14px;min-height:14px;border-radius:50%;background:var(--sv-verified-badge-bg,#1DA1F2);display:flex;align-items:center;justify-content:center;border:2px solid var(--sv-verified-badge-border,#000)}.sv-author-info__verified-badge svg{width:60%;height:60%;color:var(--sv-verified-badge-color,#fff)}.sv-author-info__content{display:flex;flex-direction:column;gap:var(--sv-author-content-gap,2px);flex:1;min-width:0}.sv-author-info__name{display:flex;align-items:center;gap:var(--sv-author-name-gap,4px);font-size:var(--sv-author-name-size,16px);font-weight:var(--sv-author-name-weight,600);color:var(--sv-author-name-color,#fff);cursor:pointer;transition:opacity .15s ease}.sv-author-info__name:hover{opacity:.8}.sv-author-info__name-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sv-author-info__name--with-at::before{content:'@';opacity:.8}.sv-author-info__name-verified{flex-shrink:0;width:var(--sv-author-name-verified-size,14px);height:var(--sv-author-name-verified-size,14px);color:var(--sv-verified-badge-bg,#1DA1F2)}.sv-author-info__description{font-size:var(--sv-author-desc-size,13px);color:var(--sv-author-desc-color,rgba(255,255,255,.7));line-height:var(--sv-author-desc-line-height,1.4);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:var(--sv-author-desc-lines,2);-webkit-box-orient:vertical}.sv-author-info__description--single-line{-webkit-line-clamp:1;white-space:nowrap;display:block}.sv-author-info__follow-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sv-follow-btn-gap,6px);padding:var(--sv-follow-btn-padding,8px 16px);min-width:var(--sv-follow-btn-min-width,88px);border:0;border-radius:var(--sv-follow-btn-radius,4px);font-size:var(--sv-follow-btn-size,14px);font-weight:var(--sv-follow-btn-weight,600);cursor:pointer;transition:all .2s ease;outline:none;user-select:none;-webkit-tap-highlight-color:transparent}.sv-author-info__follow-btn--default{background:var(--sv-follow-btn-bg,#fe2c55);color:var(--sv-follow-btn-color,#fff)}.sv-author-info__follow-btn--default:hover:not(:disabled){background:var(--sv-follow-btn-bg-hover,#f46);transform:scale(1.02)}.sv-author-info__follow-btn--default:active:not(:disabled){transform:scale(.98)}.sv-author-info__follow-btn--following{background:var(--sv-follow-btn-following-bg,transparent);color:var(--sv-follow-btn-following-color,rgba(255,255,255,.9));border:1px solid var(--sv-follow-btn-following-border,rgba(255,255,255,.3))}.sv-author-info__follow-btn--following:hover:not(:disabled){background:var(--sv-follow-btn-following-bg-hover,rgba(255,255,255,.1));border-color:var(--sv-follow-btn-following-border-hover,rgba(255,255,255,.5))}.sv-author-info__follow-btn--pending{opacity:.6;pointer-events:none;cursor:wait}.sv-author-info__follow-btn:disabled{opacity:.5;cursor:not-allowed}.sv-author-info__follow-btn-icon{width:var(--sv-follow-btn-icon-size,16px);height:var(--sv-follow-btn-icon-size,16px);flex-shrink:0}.sv-author-info__follow-btn-spinner{width:var(--sv-follow-btn-icon-size,16px);height:var(--sv-follow-btn-icon-size,16px);border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:sv-author-info-spin .6s linear infinite}@keyframes sv-author-info-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.sv-author-info__follow-btn--small{padding:var(--sv-follow-btn-padding-small,6px 12px);font-size:var(--sv-follow-btn-size-small,12px);min-width:var(--sv-follow-btn-min-width-small,72px)}.sv-author-info__follow-btn--large{padding:var(--sv-follow-btn-padding-large,10px 20px);font-size:var(--sv-follow-btn-size-large,16px);min-width:var(--sv-follow-btn-min-width-large,100px)}.sv-author-info__follow-btn--icon-only{min-width:unset;padding:var(--sv-follow-btn-icon-padding,8px);border-radius:50%}.sv-author-info--inline{justify-content:space-between}.sv-author-info--inline .sv-author-info__content{flex:1}.sv-author-info--stacked{flex-direction:column;align-items:center;text-align:center}.sv-author-info--stacked .sv-author-info__content{align-items:center}.sv-author-info--overlay{text-shadow:var(--sv-author-overlay-shadow,0 1px 2px rgba(0,0,0,.5))}.sv-author-info--overlay .sv-author-info__avatar{border:2px solid var(--sv-author-overlay-avatar-border,rgba(255,255,255,.5))}.sv-author-info--avatar-badge{position:relative;display:flex;flex-direction:column;align-items:center;width:auto;gap:0}.sv-author-info--avatar-badge .sv-author-info__avatar{width:var(--sv-avatar-badge-size,48px);height:var(--sv-avatar-badge-size,48px);border:2px solid var(--sv-avatar-badge-border,#fff)}.sv-author-info--avatar-badge .sv-author-info__follow-btn{position:absolute;bottom:var(--sv-avatar-badge-btn-bottom,-10px);left:50%;transform:translateX(-50%);min-width:unset;width:var(--sv-avatar-badge-btn-size,24px);height:var(--sv-avatar-badge-btn-size,24px);padding:0;border-radius:50%;background:var(--sv-color-primary,#fe2c55);border:2px solid var(--sv-bg-primary,#000);z-index:1}.sv-author-info--avatar-badge .sv-author-info__follow-btn:hover:not(:disabled){transform:translateX(-50%)scale(1.1)}.sv-author-info--avatar-badge .sv-author-info__follow-btn:active:not(:disabled){transform:translateX(-50%)scale(.95)}.sv-author-info--avatar-badge .sv-author-info__follow-btn-icon{width:var(--sv-avatar-badge-icon-size,14px);height:var(--sv-avatar-badge-icon-size,14px)}.sv-author-info--avatar-badge .sv-author-info__follow-btn--following{display:none}.sv-author-info--avatar-badge .sv-author-info__content{display:none}.sv-author-info--avatar-badge{margin-bottom:var(--sv-avatar-badge-margin,16px)}`;
 function DefaultVerifiedIcon() {
   return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M22.5 12.5c0-1.58-.875-2.95-2.148-3.6.154-.435.238-.905.238-1.4 0-2.21-1.71-3.998-3.818-3.998-.47 0-.92.084-1.336.25C14.818 2.415 13.51 1.5 12 1.5s-2.816.917-3.437 2.25c-.415-.165-.866-.25-1.336-.25-2.11 0-3.818 1.79-3.818 4 0 .494.083.964.237 1.4-1.272.65-2.147 2.018-2.147 3.6 0 1.495.782 2.798 1.942 3.486-.02.17-.032.34-.032.514 0 2.21 1.708 4 3.818 4 .47 0 .92-.086 1.335-.25.62 1.334 1.926 2.25 3.437 2.25 1.512 0 2.818-.916 3.437-2.25.415.163.865.248 1.336.248 2.11 0 3.818-1.79 3.818-4 0-.174-.012-.344-.033-.513 1.158-.687 1.943-1.99 1.943-3.484zm-6.616-3.334l-4.334 6.5c-.145.217-.382.334-.625.334-.143 0-.288-.04-.416-.126l-.115-.094-2.415-2.415c-.293-.293-.293-.768 0-1.06s.768-.294 1.06 0l1.77 1.767 3.825-5.74c.23-.345.696-.436 1.04-.207.346.23.44.696.21 1.04z" }) });
 }

package/dist/{chunk-4WTGO44D.js → chunk-7WXAQHJI.js}

@@ -181,7 +181,7 @@ function VideoHashtags({
 }
 
 // src/components/VideoInfo/VideoInfo.css.ts
-var VIDEO_INFO_CSS = `.sv-video-info{display:flex;flex-direction:column;gap:var(--sv-video-info-gap,6px);color:var(--sv-video-info-color,#fff);font-family:var(--sv-font-family,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif);text-shadow:var(--sv-video-info-text-shadow,0 1px 2px rgba(0,0,0,.5));max-width:100%;overflow:hidden;transition:opacity .3s cubic-bezier(.4,0,.2,1);user-select:none;-webkit-user-select:none}.sv-video-info--hidden{opacity:0;pointer-events:none}.sv-video-info--overlay{pointer-events:none}.sv-video-info--overlay>*{pointer-events:auto}.sv-video-info__author{display:flex;align-items:center;gap:var(--sv-video-info-author-gap,6px);cursor:pointer;transition:opacity .15s ease}.sv-video-info__author:hover{opacity:.85}.sv-video-info__author:active{opacity:.7}.sv-video-info__author-name{font-size:var(--sv-video-info-author-font-size,16px);font-weight:var(--sv-video-info-author-font-weight,700);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.sv-video-info__author-prefix{opacity:.95}.sv-video-info__verified-badge{display:inline-flex;align-items:center;justify-content:center;width:var(--sv-video-info-verified-size,14px);height:var(--sv-video-info-verified-size,14px);background:var(--sv-video-info-verified-bg,#20d5ec);border-radius:50%;flex-shrink:0}.sv-video-info__verified-badge svg,.sv-video-info__verified-badge span{font-size:10px;color:#fff;font-weight:bold}.sv-video-info__caption{font-size:var(--sv-video-info-caption-font-size,14px);line-height:var(--sv-video-info-caption-line-height,1.4);color:var(--sv-video-info-caption-color,#fff);display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.sv-video-info__caption--lines-1{-webkit-line-clamp:1}.sv-video-info__caption--lines-2{-webkit-line-clamp:2}.sv-video-info__caption--lines-3{-webkit-line-clamp:3}.sv-video-info__caption--expanded{-webkit-line-clamp:unset}.sv-video-info__caption--clickable{cursor:pointer;transition:opacity .15s ease}.sv-video-info__caption--clickable:hover{opacity:.85}.sv-video-info__caption--clickable:active{opacity:.7}.sv-video-info__caption-more{background:0 0;border:0;color:var(--sv-video-info-caption-more-color,rgba(255,255,255,.7));font-size:var(--sv-video-info-caption-font-size,14px);padding:0;margin-left:4px;cursor:pointer}.sv-video-info__caption-more:hover{color:var(--sv-video-info-caption-color,#fff)}.sv-video-info__hashtags{display:inline-flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--sv-video-info-hashtag-gap,6px);font-size:var(--sv-video-info-hashtag-font-size,14px)}.sv-video-info__hashtags--inline{gap:var(--sv-video-info-hashtag-gap-inline,4px)}.sv-video-info__hashtag{display:inline-flex;color:var(--sv-video-info-hashtag-color,#fff);font-weight:var(--sv-video-info-hashtag-font-weight,500);background:0 0;border:0;padding:0;cursor:pointer;transition:opacity .15s ease;white-space:nowrap}.sv-video-info__hashtag:hover{opacity:.8;text-decoration:underline}.sv-video-info__hashtag--not-clickable{cursor:default}.sv-video-info__hashtag--not-clickable:hover{opacity:1;text-decoration:none}.sv-video-info__caption .sv-video-info__hashtag{display:inline}.sv-video-info__location{display:flex;align-items:center;gap:var(--sv-video-info-location-gap,4px);font-size:var(--sv-video-info-location-font-size,13px);color:var(--sv-video-info-location-color,rgba(255,255,255,.9));cursor:pointer;transition:opacity .15s ease}.sv-video-info__location:hover{opacity:.8}.sv-video-info__location-icon{font-size:14px;flex-shrink:0}.sv-video-info__location-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sv-video-info__music{display:flex;align-items:center;gap:var(--sv-video-info-music-gap,8px);font-size:var(--sv-video-info-music-font-size,13px);color:var(--sv-video-info-music-color,#fff);cursor:pointer;transition:opacity .15s ease;overflow:hidden}.sv-video-info__music:hover{opacity:.8}.sv-video-info__music-icon{font-size:14px;flex-shrink:0}.sv-video-info__music-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sv-video-info__music-text--marquee{animation:sv-video-info-marquee 8s linear infinite}@keyframes sv-video-info-marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}`;
+var VIDEO_INFO_CSS = `.sv-video-info{display:flex;flex-direction:column;gap:var(--sv-video-info-gap,6px);color:var(--sv-video-info-color,#fff);font-family:var(--sv-font-family,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif);text-shadow:var(--sv-video-info-text-shadow,0 1px 2px rgba(0,0,0,.5));max-width:100%;overflow:hidden;transition:opacity .3s cubic-bezier(.4,0,.2,1)}.sv-video-info--hidden{opacity:0;pointer-events:none}.sv-video-info--overlay{pointer-events:none}.sv-video-info--overlay>*{pointer-events:auto}.sv-video-info__author{display:flex;align-items:center;gap:var(--sv-video-info-author-gap,6px);cursor:pointer;transition:opacity .15s ease}.sv-video-info__author:hover{opacity:.85}.sv-video-info__author:active{opacity:.7}.sv-video-info__author-name{font-size:var(--sv-video-info-author-font-size,16px);font-weight:var(--sv-video-info-author-font-weight,700);line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}.sv-video-info__author-prefix{opacity:.95}.sv-video-info__verified-badge{display:inline-flex;align-items:center;justify-content:center;width:var(--sv-video-info-verified-size,14px);height:var(--sv-video-info-verified-size,14px);background:var(--sv-video-info-verified-bg,#20d5ec);border-radius:50%;flex-shrink:0}.sv-video-info__verified-badge svg,.sv-video-info__verified-badge span{font-size:10px;color:#fff;font-weight:bold}.sv-video-info__caption{font-size:var(--sv-video-info-caption-font-size,14px);line-height:var(--sv-video-info-caption-line-height,1.4);color:var(--sv-video-info-caption-color,#fff);display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.sv-video-info__caption--lines-1{-webkit-line-clamp:1}.sv-video-info__caption--lines-2{-webkit-line-clamp:2}.sv-video-info__caption--lines-3{-webkit-line-clamp:3}.sv-video-info__caption--expanded{-webkit-line-clamp:unset}.sv-video-info__caption--clickable{cursor:pointer;transition:opacity .15s ease}.sv-video-info__caption--clickable:hover{opacity:.85}.sv-video-info__caption--clickable:active{opacity:.7}.sv-video-info__caption-more{background:0 0;border:0;color:var(--sv-video-info-caption-more-color,rgba(255,255,255,.7));font-size:var(--sv-video-info-caption-font-size,14px);padding:0;margin-left:4px;cursor:pointer}.sv-video-info__caption-more:hover{color:var(--sv-video-info-caption-color,#fff)}.sv-video-info__hashtags{display:inline-flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:var(--sv-video-info-hashtag-gap,6px);font-size:var(--sv-video-info-hashtag-font-size,14px)}.sv-video-info__hashtags--inline{gap:var(--sv-video-info-hashtag-gap-inline,4px)}.sv-video-info__hashtag{display:inline-flex;color:var(--sv-video-info-hashtag-color,#fff);font-weight:var(--sv-video-info-hashtag-font-weight,500);background:0 0;border:0;padding:0;cursor:pointer;transition:opacity .15s ease;white-space:nowrap}.sv-video-info__hashtag:hover{opacity:.8;text-decoration:underline}.sv-video-info__hashtag--not-clickable{cursor:default}.sv-video-info__hashtag--not-clickable:hover{opacity:1;text-decoration:none}.sv-video-info__caption .sv-video-info__hashtag{display:inline}.sv-video-info__location{display:flex;align-items:center;gap:var(--sv-video-info-location-gap,4px);font-size:var(--sv-video-info-location-font-size,13px);color:var(--sv-video-info-location-color,rgba(255,255,255,.9));cursor:pointer;transition:opacity .15s ease}.sv-video-info__location:hover{opacity:.8}.sv-video-info__location-icon{font-size:14px;flex-shrink:0}.sv-video-info__location-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sv-video-info__music{display:flex;align-items:center;gap:var(--sv-video-info-music-gap,8px);font-size:var(--sv-video-info-music-font-size,13px);color:var(--sv-video-info-music-color,#fff);cursor:pointer;transition:opacity .15s ease;overflow:hidden}.sv-video-info__music:hover{opacity:.8}.sv-video-info__music-icon{font-size:14px;flex-shrink:0}.sv-video-info__music-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sv-video-info__music-text--marquee{animation:sv-video-info-marquee 8s linear infinite}@keyframes sv-video-info-marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}`;
 function DefaultLocationIcon() {
   return /* @__PURE__ */ jsx("span", { className: "sv-video-info__location-icon", children: "\u{1F4CD}" });
 }

package/dist/{chunk-K3YQHGDX.js → chunk-BNI7CYRI.js}

@@ -1,4 +1,4 @@
-import { useDoubleTap, VideoSlotPlayIndicatorInner } from './chunk-AKLFOFWW.js';
+import { useDoubleTap, VideoSlotPlayIndicatorInner } from './chunk-MFJS65C5.js';
 import { ImageCarouselHeadless } from './chunk-GSNIZ6DF.js';
 import { clsx2 } from './chunk-EDWS2IPH.js';
 import { injectComponentCSS } from './chunk-CAWE42LH.js';

package/dist/{chunk-OM4L7RE5.js → chunk-JM76QJ4H.js}

@@ -664,6 +664,7 @@ function useVideoElement(config) {
   const [isEnded, setIsEnded] = useState(false);
   const currentSrcRef = useRef(null);
   const retryCountRef = useRef(0);
+  const hasHandledAutoPlayRef = useRef(false);
   const [retryTrigger, setRetryTrigger] = useState(0);
   useEffect(() => {
     const video = videoRef.current;
@@ -678,6 +679,7 @@ function useVideoElement(config) {
     setIsPaused(true);
     setIsEnded(false);
     setError(null);
+    hasHandledAutoPlayRef.current = false;
     if (hlsRef.current) {
       hlsRef.current.destroy();
       hlsRef.current = null;
@@ -730,7 +732,8 @@ function useVideoElement(config) {
       setIsBuffering(false);
       setIsReady(true);
       onCanPlay?.();
-      if (autoPlay) {
+      if (autoPlay && !hasHandledAutoPlayRef.current) {
+        hasHandledAutoPlayRef.current = true;
         video.play().catch(() => {
         });
       }

package/dist/{chunk-AKLFOFWW.js → chunk-MFJS65C5.js}

@@ -176,149 +176,6 @@ function useDoubleTap({
     lastPosition: lastPositionRef
   };
 }
-var DEFAULT_HOLD_DELAY = 2e3;
-var DEFAULT_BOOST_SPEED = 2;
-var DEFAULT_PULL_DOWN_THRESHOLD = 50;
-var DEFAULT_MOVEMENT_THRESHOLD2 = 15;
-function useLongPressSpeed({
-  onSpeedBoost,
-  onSpeedReset,
-  onSpeedLock,
-  boostSpeed = DEFAULT_BOOST_SPEED,
-  holdDelay = DEFAULT_HOLD_DELAY,
-  pullDownThreshold = DEFAULT_PULL_DOWN_THRESHOLD,
-  disabled = false,
-  movementThreshold = DEFAULT_MOVEMENT_THRESHOLD2,
-  resetKey
-}) {
-  const [isSpeedBoosted, setIsSpeedBoosted] = useState(false);
-  const [isSpeedLocked, setIsSpeedLocked] = useState(false);
-  const holdTimerRef = useRef(null);
-  const isBoostedRef = useRef(false);
-  const isLockedRef = useRef(false);
-  const pointerStartRef = useRef(null);
-  const boostStartYRef = useRef(null);
-  const preboostMovementRef = useRef(0);
-  const isTrackingRef = useRef(false);
-  const cancelTimer = useCallback(() => {
-    if (holdTimerRef.current) {
-      clearTimeout(holdTimerRef.current);
-      holdTimerRef.current = null;
-    }
-  }, []);
-  useEffect(() => {
-    return () => {
-      cancelTimer();
-    };
-  }, [cancelTimer]);
-  useEffect(() => {
-    if (disabled) {
-      cancelTimer();
-      if (isBoostedRef.current) {
-        isBoostedRef.current = false;
-        setIsSpeedBoosted(false);
-      }
-    }
-  }, [disabled, cancelTimer]);
-  const prevResetKeyRef = useRef(resetKey);
-  if (prevResetKeyRef.current !== resetKey) {
-    prevResetKeyRef.current = resetKey;
-    if (isLockedRef.current) {
-      isLockedRef.current = false;
-      setIsSpeedLocked(false);
-    }
-    if (isBoostedRef.current) {
-      isBoostedRef.current = false;
-      setIsSpeedBoosted(false);
-    }
-  }
-  const handlePointerDown = useCallback(
-    (e) => {
-      if (e.button !== 0) return;
-      if (disabled) return;
-      if (isLockedRef.current) return;
-      pointerStartRef.current = { x: e.clientX, y: e.clientY };
-      preboostMovementRef.current = 0;
-      isTrackingRef.current = true;
-      cancelTimer();
-      holdTimerRef.current = setTimeout(() => {
-        holdTimerRef.current = null;
-        isBoostedRef.current = true;
-        setIsSpeedBoosted(true);
-        boostStartYRef.current = pointerStartRef.current?.y ?? e.clientY;
-        onSpeedBoost?.(boostSpeed);
-      }, holdDelay);
-    },
-    [disabled, boostSpeed, holdDelay, cancelTimer, onSpeedBoost]
-  );
-  const handlePointerMove = useCallback(
-    (e) => {
-      if (!isTrackingRef.current) return;
-      if (!pointerStartRef.current) return;
-      if (!isBoostedRef.current) {
-        preboostMovementRef.current += Math.abs(e.movementX) + Math.abs(e.movementY);
-        if (preboostMovementRef.current > movementThreshold * 2) {
-          cancelTimer();
-          isTrackingRef.current = false;
-        }
-      } else {
-        if (boostStartYRef.current !== null && !isLockedRef.current) {
-          const deltaY = e.clientY - boostStartYRef.current;
-          if (deltaY > pullDownThreshold) {
-            isLockedRef.current = true;
-            setIsSpeedLocked(true);
-            onSpeedLock?.(boostSpeed);
-          }
-        }
-      }
-    },
-    [movementThreshold, pullDownThreshold, boostSpeed, cancelTimer, onSpeedLock]
-  );
-  const handlePointerUp = useCallback(
-    (_e) => {
-      cancelTimer();
-      isTrackingRef.current = false;
-      pointerStartRef.current = null;
-      boostStartYRef.current = null;
-      if (isBoostedRef.current && !isLockedRef.current) {
-        isBoostedRef.current = false;
-        setIsSpeedBoosted(false);
-        onSpeedReset?.();
-      } else if (isBoostedRef.current && isLockedRef.current) {
-        isBoostedRef.current = false;
-        setIsSpeedBoosted(false);
-      }
-    },
-    [cancelTimer, onSpeedReset]
-  );
-  const handlePointerCancel = useCallback(
-    (_e) => {
-      cancelTimer();
-      isTrackingRef.current = false;
-      pointerStartRef.current = null;
-      boostStartYRef.current = null;
-      if (isBoostedRef.current && !isLockedRef.current) {
-        isBoostedRef.current = false;
-        setIsSpeedBoosted(false);
-        onSpeedReset?.();
-      } else if (isBoostedRef.current) {
-        isBoostedRef.current = false;
-        setIsSpeedBoosted(false);
-      }
-    },
-    [cancelTimer, onSpeedReset]
-  );
-  return {
-    handlers: {
-      onPointerDown: handlePointerDown,
-      onPointerMove: handlePointerMove,
-      onPointerUp: handlePointerUp,
-      onPointerCancel: handlePointerCancel
-    },
-    isSpeedBoosted,
-    isSpeedLocked
-  };
-}
 function invariantContextError(hookName, componentName) {
   const baseMessage = `${hookName} must be used within a VideoSlot component.`;
   if (process.env.NODE_ENV !== "production") {
@@ -508,4 +365,4 @@ function VideoSlotPlayIndicator(props) {
 }
 VideoSlotPlayIndicator.displayName = "VideoSlotPlayIndicator";
 
-export { VideoSlotContext, VideoSlotPlayIndicator, VideoSlotPlayIndicatorInner, useDoubleTap, useLongPressSpeed, useOptionalVideoSlotContext, useVideoSlotContext, useVideoSlotIsActive, useVideoSlotIsPlaying, useVideoSlotPlayer, useVideoSlotResource, useVideoSlotVideo };
+export { VideoSlotContext, VideoSlotPlayIndicator, VideoSlotPlayIndicatorInner, useDoubleTap, useOptionalVideoSlotContext, useVideoSlotContext, useVideoSlotIsActive, useVideoSlotIsPlaying, useVideoSlotPlayer, useVideoSlotResource, useVideoSlotVideo };

package/dist/{chunk-C27FC7E2.js → chunk-NJXIYSDZ.js}

@@ -58,7 +58,6 @@ var ACTION_BAR_CSS = (
   touch-action: manipulation;
   -webkit-tap-highlight-color: transparent;
   user-select: none;
-  -webkit-user-select: none;
   
   /* Transition */
   transition: transform 0.15s ease, opacity 0.15s ease;

package/dist/{chunk-7QQREYXV.js → chunk-VJ744W5N.js}

@@ -1,71 +1,12 @@
-import { useDoubleTap, useLongPressSpeed, VideoSlotContext, useVideoSlotContext } from './chunk-AKLFOFWW.js';
+import { useDoubleTap, VideoSlotContext, useVideoSlotContext } from './chunk-MFJS65C5.js';
 import { HeartFilledIcon } from './chunk-ANCP53F3.js';
 import { clsx2 } from './chunk-EDWS2IPH.js';
 import { injectComponentCSS } from './chunk-CAWE42LH.js';
-import { memo, useMemo, useState, useCallback, useEffect, useRef, useInsertionEffect } from 'react';
+import { memo, useMemo, useState, useCallback, useEffect, useInsertionEffect, useRef } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 // src/components/VideoSlot/VideoSlot.css.ts
-var VIDEO_SLOT_CSS = `.sv-video-slot{position:relative;width:100%;height:100%;overflow:hidden;background-color:var(--sv-bg-primary,#000);touch-action:none;user-select:none;-webkit-user-select:none;will-change:contents;contain:layout style paint}.sv-video-slot--active{z-index:1}.sv-video-slot--loading .sv-video-slot__video{opacity:0}.sv-video-slot--loading .sv-video-slot__poster{opacity:1}.sv-video-slot--playing .sv-video-slot__video{opacity:1}.sv-video-slot--playing .sv-video-slot__poster{opacity:0}.sv-video-slot--paused .sv-video-slot__video{opacity:1}.sv-video-slot--paused .sv-video-slot__poster{opacity:0}.sv-video-slot__poster--hidden{opacity:0;pointer-events:none}.sv-video-slot--error{display:flex;align-items:center;justify-content:center}.sv-video-slot__video-container{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.sv-video-slot__video{width:100%;height:100%;object-fit:cover;background-color:transparent;transition:opacity var(--sv-transition-duration,300ms)ease-out}.sv-video-slot__video[data-loaded="true"]{opacity:1}.sv-video-slot__poster{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:var(--sv-bg-primary,#000);z-index:var(--sv-z-poster,3);transition:opacity var(--sv-transition-duration,300ms)ease-out;pointer-events:none}.sv-video-slot__poster-image{width:100%;height:100%;object-fit:cover}.sv-video-slot__poster--first-frame .sv-video-slot__poster-image{image-rendering:auto}.sv-video-slot__poster--skeleton{background:linear-gradient(110deg,var(--sv-skeleton-bg,rgba(255,255,255,.05))0%,var(--sv-skeleton-shimmer,rgba(255,255,255,.1))50%,var(--sv-skeleton-bg,rgba(255,255,255,.05))100%);background-size:200% 100%;animation:sv-slot-skeleton-shimmer 1.5s ease-in-out infinite}@keyframes sv-slot-skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.sv-video-slot__overlay{position:absolute;inset:0;z-index:var(--sv-z-overlay,4);background:linear-gradient(to top,rgba(0,0,0,.6)0%,rgba(0,0,0,.3)20%,transparent 40%,transparent 60%,rgba(0,0,0,.2)80%,rgba(0,0,0,.4)100%);pointer-events:none}.sv-video-slot__overlay-top,.sv-video-slot__overlay-bottom,.sv-video-slot__overlay-left,.sv-video-slot__overlay-right,.sv-video-slot__actions,.sv-video-slot__author{pointer-events:none}.sv-video-slot__overlay button,.sv-video-slot__overlay a,.sv-video-slot__overlay [role="button"],.sv-video-slot__overlay input,.sv-video-slot__overlay label,.sv-video-slot__overlay .sv-progress-bar,.sv-video-slot__overlay .sv-author-info,.sv-video-slot__overlay .sv-video-info,.sv-video-slot__overlay .sv-action-bar{pointer-events:auto}.sv-video-slot__actions>*{pointer-events:auto}.sv-video-slot__overlay-top{position:absolute;top:0;left:0;right:0;padding:var(--sv-spacing-md,16px);padding-top:calc(var(--sv-safe-area-top,0)+var(--sv-spacing-md,16px))}.sv-video-slot__overlay-bottom{position:absolute;bottom:0;left:0;right:0;padding:var(--sv-spacing-md,16px);padding-bottom:calc(var(--sv-safe-area-bottom,0)+var(--sv-spacing-md,16px));display:flex;flex-direction:column;gap:var(--sv-spacing-sm,8px)}.sv-video-slot__overlay-left{position:absolute;top:50%;left:0;transform:translateY(-50%);padding:var(--sv-spacing-md,16px)}.sv-video-slot__overlay-right{position:absolute;top:50%;right:0;transform:translateY(-50%);padding:var(--sv-spacing-md,16px)}.sv-video-slot__actions{position:absolute;right:var(--sv-spacing-sm,8px);bottom:calc(var(--sv-safe-area-bottom,0)+var(--sv-actions-bottom,80px)+var(--sv-playlist-bar-offset,0));display:flex;flex-direction:column;align-items:center;transition:bottom .3s ease-in-out}.sv-video-slot__author{position:absolute;left:var(--sv-spacing-md,16px);bottom:calc(var(--sv-safe-area-bottom,0)+var(--sv-author-bottom,100px)+var(--sv-playlist-bar-offset,0));right:80px;max-width:calc(100% - 100px);transition:bottom .3s ease-in-out}.sv-video-slot__error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--sv-bg-primary,#000);color:var(--sv-text-secondary,#999);text-align:center;padding:var(--sv-spacing-lg,20px);gap:var(--sv-spacing-md,16px);z-index:var(--sv-z-indicator,3)}.sv-video-slot__error-icon{font-size:48px;opacity:.6}.sv-video-slot__error-message{font-size:var(--sv-font-size-md,14px);max-width:200px}.sv-video-slot__error-retry{padding:var(--sv-spacing-sm,8px)var(--sv-spacing-md,16px);background-color:var(--sv-color-primary,#fe2c55);color:#fff;border:0;border-radius:var(--sv-radius-md,8px);font-size:var(--sv-font-size-sm,12px);font-weight:600;cursor:pointer;transition:background-color 150ms ease}.sv-video-slot__error-retry:hover{background-color:var(--sv-color-primary-hover,#e02850)}.sv-video-slot__error-retry:active{transform:scale(.96)}.sv-video-slot__spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:var(--sv-z-slot-spinner,2)}.sv-video-slot__spinner-circle{width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--sv-color-primary,#fe2c55);border-radius:50%;animation:sv-slot-spin .8s linear infinite}@keyframes sv-slot-spin{to{transform:rotate(360deg)}}.sv-video-slot__play-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:50%;z-index:var(--sv-z-indicator,3);opacity:0;transition:opacity 200ms ease-out;pointer-events:none}.sv-video-slot__play-indicator--visible{opacity:.65}.sv-video-slot__play-indicator--persist{opacity:.65}.sv-video-slot__play-indicator--animating-out{animation:sv-slot-indicator-out var(--sv-indicator-duration,200ms)ease-out forwards}@keyframes sv-slot-indicator-out{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}100%{opacity:0;transform:translate(-50%,-50%)scale(1.5)}}.sv-video-slot__play-indicator-icon{color:#fff;font-size:28px;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.sv-video-slot__progress{position:absolute;bottom:0;left:0;right:0;height:3px;background-color:rgba(255,255,255,.2);z-index:var(--sv-z-progress,4)}.sv-video-slot__progress-bar{height:100%;background-color:var(--sv-color-primary,#fe2c55);transition:width 100ms linear}.sv-video-slot__progress-buffered{position:absolute;top:0;left:0;height:100%;background-color:rgba(255,255,255,.3)}`;
-
-// src/components/VideoSlot/SpeedBoostIndicator.css.ts
-var SPEED_BOOST_INDICATOR_CSS = `.sv-speed-boost{position:absolute;top:calc(var(--sv-safe-area-top,0)+60px);left:50%;transform:translateX(-50%);z-index:20;display:flex;align-items:center;gap:6px;padding:6px 14px;border-radius:20px;background:rgba(0,0,0,.65);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;font-size:13px;font-weight:600;letter-spacing:.02em;white-space:nowrap;pointer-events:none;user-select:none;-webkit-user-select:none;animation:sv-speed-boost-in 200ms ease-out both}.sv-speed-boost--locked{background:rgba(0,0,0,.75);border:1px solid rgba(255,255,255,.15)}.sv-speed-boost--exit{animation:sv-speed-boost-out 200ms ease-in forwards}.sv-speed-boost__icon{display:flex;align-items:center;font-size:14px;animation:sv-speed-boost-pulse 600ms ease-in-out infinite alternate}.sv-speed-boost--locked .sv-speed-boost__icon{animation:none}.sv-speed-boost__lock{display:flex;align-items:center;font-size:11px;margin-left:2px}.sv-speed-boost__hint{font-size:11px;font-weight:normal;opacity:.7;margin-left:4px}@keyframes sv-speed-boost-in{0%{opacity:0;transform:translateX(-50%)scale(.8)translateY(-8px)}100%{opacity:1;transform:translateX(-50%)scale(1)translateY(0)}}@keyframes sv-speed-boost-out{0%{opacity:1;transform:translateX(-50%)scale(1)translateY(0)}100%{opacity:0;transform:translateX(-50%)scale(.9)translateY(-4px)}}@keyframes sv-speed-boost-pulse{0%{opacity:.7}100%{opacity:1}}`;
-function SpeedBoostIndicatorBase({
-  isVisible,
-  isLocked,
-  speed = 2,
-  showHint = true
-}) {
-  useEffect(() => {
-    return injectComponentCSS("speed-boost-indicator", SPEED_BOOST_INDICATOR_CSS);
-  }, []);
-  const [shouldRender, setShouldRender] = useState(false);
-  const [isExiting, setIsExiting] = useState(false);
-  const exitTimerRef = useRef(null);
-  useEffect(() => {
-    if (isVisible) {
-      setIsExiting(false);
-      setShouldRender(true);
-      if (exitTimerRef.current) {
-        clearTimeout(exitTimerRef.current);
-        exitTimerRef.current = null;
-      }
-    } else if (shouldRender && !isLocked) {
-      setIsExiting(true);
-      exitTimerRef.current = setTimeout(() => {
-        setShouldRender(false);
-        setIsExiting(false);
-        exitTimerRef.current = null;
-      }, 200);
-    } else if (!isVisible && !isLocked) {
-      setShouldRender(false);
-      setIsExiting(false);
-    }
-    return () => {
-      if (exitTimerRef.current) {
-        clearTimeout(exitTimerRef.current);
-      }
-    };
-  }, [isVisible, isLocked, shouldRender]);
-  const isVisibleOrLocked = shouldRender || isLocked;
-  if (!isVisibleOrLocked) return null;
-  const classNames = [
-    "sv-speed-boost",
-    isLocked && "sv-speed-boost--locked",
-    isExiting && !isLocked && "sv-speed-boost--exit"
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxs("div", { className: classNames, "aria-live": "polite", role: "status", children: [
-    /* @__PURE__ */ jsx("span", { className: "sv-speed-boost__icon", "aria-hidden": "true", children: "\u25B6\u25B6" }),
-    /* @__PURE__ */ jsxs("span", { children: [
-      speed,
-      "x"
-    ] }),
-    isLocked && /* @__PURE__ */ jsx("span", { className: "sv-speed-boost__lock", "aria-label": "Speed locked", children: "locked" }),
-    showHint && isVisible && !isLocked && /* @__PURE__ */ jsx("span", { className: "sv-speed-boost__hint", children: "\u2193 pull down to lock" })
-  ] });
-}
-var SpeedBoostIndicator = memo(SpeedBoostIndicatorBase);
-SpeedBoostIndicator.displayName = "SpeedBoostIndicator";
+var VIDEO_SLOT_CSS = `.sv-video-slot{position:relative;width:100%;height:100%;overflow:hidden;background-color:var(--sv-bg-primary,#000);touch-action:none;user-select:none;-webkit-user-select:none;will-change:contents;contain:layout style paint}.sv-video-slot--active{z-index:1}.sv-video-slot--loading .sv-video-slot__video{opacity:0}.sv-video-slot--loading .sv-video-slot__poster{opacity:1}.sv-video-slot--playing .sv-video-slot__video{opacity:1}.sv-video-slot--playing .sv-video-slot__poster{opacity:0}.sv-video-slot--paused .sv-video-slot__video{opacity:1}.sv-video-slot--paused .sv-video-slot__poster{opacity:0}.sv-video-slot__poster--hidden{opacity:0;pointer-events:none}.sv-video-slot--error{display:flex;align-items:center;justify-content:center}.sv-video-slot__video-container{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.sv-video-slot__video{width:100%;height:100%;object-fit:cover;background-color:transparent;transition:opacity var(--sv-transition-duration,300ms)ease-out}.sv-video-slot__video[data-loaded="true"]{opacity:1}.sv-video-slot__poster{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:var(--sv-bg-primary,#000);z-index:var(--sv-z-poster,3);transition:opacity var(--sv-transition-duration,300ms)ease-out;pointer-events:none}.sv-video-slot__poster-image{width:100%;height:100%;object-fit:cover}.sv-video-slot__poster--first-frame .sv-video-slot__poster-image{image-rendering:auto}.sv-video-slot__poster--skeleton{background:linear-gradient(110deg,var(--sv-skeleton-bg,rgba(255,255,255,.05))0%,var(--sv-skeleton-shimmer,rgba(255,255,255,.1))50%,var(--sv-skeleton-bg,rgba(255,255,255,.05))100%);background-size:200% 100%;animation:sv-slot-skeleton-shimmer 1.5s ease-in-out infinite}@keyframes sv-slot-skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.sv-video-slot__overlay{position:absolute;inset:0;z-index:var(--sv-z-overlay,2);background:linear-gradient(to top,rgba(0,0,0,.6)0%,rgba(0,0,0,.3)20%,transparent 40%,transparent 60%,rgba(0,0,0,.2)80%,rgba(0,0,0,.4)100%);pointer-events:none}.sv-video-slot__overlay-top,.sv-video-slot__overlay-bottom,.sv-video-slot__overlay-left,.sv-video-slot__overlay-right,.sv-video-slot__actions,.sv-video-slot__author{pointer-events:none}.sv-video-slot__overlay button,.sv-video-slot__overlay a,.sv-video-slot__overlay [role="button"],.sv-video-slot__overlay input,.sv-video-slot__overlay label,.sv-video-slot__overlay .sv-progress-bar,.sv-video-slot__overlay .sv-author-info,.sv-video-slot__overlay .sv-video-info,.sv-video-slot__overlay .sv-action-bar{pointer-events:auto}.sv-video-slot__overlay-top{position:absolute;top:0;left:0;right:0;padding:var(--sv-spacing-md,16px);padding-top:calc(var(--sv-safe-area-top,0)+var(--sv-spacing-md,16px))}.sv-video-slot__overlay-bottom{position:absolute;bottom:0;left:0;right:0;padding:var(--sv-spacing-md,16px);padding-bottom:calc(var(--sv-safe-area-bottom,0)+var(--sv-spacing-md,16px));display:flex;flex-direction:column;gap:var(--sv-spacing-sm,8px)}.sv-video-slot__overlay-left{position:absolute;top:50%;left:0;transform:translateY(-50%);padding:var(--sv-spacing-md,16px)}.sv-video-slot__overlay-right{position:absolute;top:50%;right:0;transform:translateY(-50%);padding:var(--sv-spacing-md,16px)}.sv-video-slot__actions{position:absolute;right:var(--sv-spacing-sm,8px);bottom:calc(var(--sv-safe-area-bottom,0)+var(--sv-actions-bottom,80px)+var(--sv-playlist-bar-offset,0));display:flex;flex-direction:column;align-items:center;transition:bottom .3s ease-in-out}.sv-video-slot__author{position:absolute;left:var(--sv-spacing-md,16px);bottom:calc(var(--sv-safe-area-bottom,0)+var(--sv-author-bottom,100px)+var(--sv-playlist-bar-offset,0));right:80px;max-width:calc(100% - 100px);transition:bottom .3s ease-in-out}.sv-video-slot__error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:var(--sv-bg-primary,#000);color:var(--sv-text-secondary,#999);text-align:center;padding:var(--sv-spacing-lg,20px);gap:var(--sv-spacing-md,16px);z-index:var(--sv-z-indicator,3)}.sv-video-slot__error-icon{font-size:48px;opacity:.6}.sv-video-slot__error-message{font-size:var(--sv-font-size-md,14px);max-width:200px}.sv-video-slot__error-retry{padding:var(--sv-spacing-sm,8px)var(--sv-spacing-md,16px);background-color:var(--sv-color-primary,#fe2c55);color:#fff;border:0;border-radius:var(--sv-radius-md,8px);font-size:var(--sv-font-size-sm,12px);font-weight:600;cursor:pointer;transition:background-color 150ms ease}.sv-video-slot__error-retry:hover{background-color:var(--sv-color-primary-hover,#e02850)}.sv-video-slot__error-retry:active{transform:scale(.96)}.sv-video-slot__spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:var(--sv-z-slot-spinner,2)}.sv-video-slot__spinner-circle{width:40px;height:40px;border:3px solid rgba(255,255,255,.2);border-top-color:var(--sv-color-primary,#fe2c55);border-radius:50%;animation:sv-slot-spin .8s linear infinite}@keyframes sv-slot-spin{to{transform:rotate(360deg)}}.sv-video-slot__play-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:50%;z-index:var(--sv-z-indicator,3);opacity:0;transition:opacity 200ms ease-out;pointer-events:none}.sv-video-slot__play-indicator--visible{opacity:.65}.sv-video-slot__play-indicator--persist{opacity:.65}.sv-video-slot__play-indicator--animating-out{animation:sv-slot-indicator-out var(--sv-indicator-duration,200ms)ease-out forwards}@keyframes sv-slot-indicator-out{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}100%{opacity:0;transform:translate(-50%,-50%)scale(1.5)}}.sv-video-slot__play-indicator-icon{color:#fff;font-size:28px;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.sv-video-slot__progress{position:absolute;bottom:0;left:0;right:0;height:3px;background-color:rgba(255,255,255,.2);z-index:var(--sv-z-progress,4)}.sv-video-slot__progress-bar{height:100%;background-color:var(--sv-color-primary,#fe2c55);transition:width 100ms linear}.sv-video-slot__progress-buffered{position:absolute;top:0;left:0;height:100%;background-color:rgba(255,255,255,.3)}`;
 
 // src/components/VideoSlot/constants.ts
 var VIDEO_ID_ATTR = "data-video-id";
@@ -123,14 +64,7 @@ function VideoSlotHeadlessBase({
   renderError,
   renderLoading,
   restoreFrame,
-  onSpeedBoost,
-  onSpeedReset,
-  onSpeedLock,
-  style,
-  disableSpeedBoost,
-  speedBoostSpeed,
-  speedBoostHoldDelay,
-  speedBoostPullDownThreshold
+  style
 }) {
   useInsertionEffect(() => {
     return injectComponentCSS("video-slot", VIDEO_SLOT_CSS);
@@ -202,37 +136,6 @@ function VideoSlotHeadlessBase({
     onDoubleTap: handleDoubleTap,
     onLongPress: onLongPress ? handleLongPress : void 0
   });
-  const { handlers: speedHandlers, isSpeedBoosted, isSpeedLocked } = useLongPressSpeed({
-    onSpeedBoost,
-    onSpeedReset,
-    onSpeedLock,
-    boostSpeed: speedBoostSpeed,
-    holdDelay: speedBoostHoldDelay,
-    pullDownThreshold: speedBoostPullDownThreshold,
-    disabled: disableSpeedBoost || !onSpeedBoost,
-    resetKey: video.id
-  });
-  const mergedHandlers = useMemo(() => {
-    if (disableSpeedBoost || !onSpeedBoost) {
-      return tapHandlers;
-    }
-    return {
-      onPointerDown: (e) => {
-        tapHandlers.onPointerDown(e);
-        speedHandlers.onPointerDown(e);
-      },
-      onPointerMove: (e) => {
-        tapHandlers.onPointerMove(e);
-        speedHandlers.onPointerMove(e);
-      },
-      onPointerUp: (e) => {
-        tapHandlers.onPointerUp(e);
-        speedHandlers.onPointerUp(e);
-      },
-      onClick: tapHandlers.onClick,
-      onPointerCancel: speedHandlers.onPointerCancel
-    };
-  }, [tapHandlers, speedHandlers, disableSpeedBoost, onSpeedBoost]);
   const handleRetry = useCallback(() => {
     playerControls.play();
   }, [playerControls]);
@@ -278,14 +181,14 @@ function VideoSlotHeadlessBase({
     {
       ref: containerRef,
       className: clsx2(...stateClasses, className),
-      ...mergedHandlers,
+      ...tapHandlers,
       ...{
         [VIDEO_ID_ATTR]: video.id,
         [SLOT_ACTIVE_ATTR]: resourceState.isActive ? "true" : "false",
         [PLAYER_STATE_ATTR]: playerStateString,
         [LOADING_ATTR]: playerState.isLoading ? "true" : "false"
       },
-      style: { WebkitUserSelect: "none", ...style },
+      style,
       children: [
         restoreFrame && !playerState.isPlaying && !playerState.error && /* @__PURE__ */ jsx(
           "div",
@@ -305,13 +208,6 @@ function VideoSlotHeadlessBase({
             "aria-hidden": "true"
           }
         ),
-        onSpeedBoost && /* @__PURE__ */ jsx(
-          SpeedBoostIndicator,
-          {
-            isVisible: isSpeedBoosted,
-            isLocked: isSpeedLocked
-          }
-        ),
         playerState.error && (renderError ? renderError(playerState.error, handleRetry) : /* @__PURE__ */ jsx(DefaultErrorUI, { error: playerState.error, onRetry: handleRetry })),
         playerState.isLoading && !playerState.error && !restoreFrame && (renderLoading ? renderLoading() : /* @__PURE__ */ jsx(DefaultLoadingUI, {})),
         children

package/dist/components/ActionBar/index.d.ts

@@ -244,6 +244,6 @@ declare const ActionBarHeadless: typeof ActionBarHeadlessRoot & {
  * - --sv-action-count-color: Count text color (default: white)
  * - --sv-action-bar-gap: Gap between action buttons (default: 16px)
  */
-declare const ACTION_BAR_CSS = "\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACTION BAR - Container for action buttons\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-action-bar {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--sv-action-bar-gap, 12px);\n  padding: var(--sv-action-bar-padding, 8px 0);\n  \n  /* Auto-hide transition */\n  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n/* Hidden state for auto-hide */\n.sv-action-bar--hidden {\n  opacity: 0;\n  pointer-events: none;\n}\n\n/* Horizontal variant */\n.sv-action-bar--horizontal {\n  flex-direction: row;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACTION BUTTON - Individual action button (Like, Comment, Share, etc.)\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-action-button {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--sv-action-button-gap, 4px);\n  \n  /* Reset button styles */\n  appearance: none;\n  background: transparent;\n  border: none;\n  padding: 0;\n  margin: 0;\n  cursor: pointer;\n  \n  /* Interaction */\n  outline: none;\n  touch-action: manipulation;\n  -webkit-tap-highlight-color: transparent;\n  user-select: none;\n  -webkit-user-select: none;\n  \n  /* Transition */\n  transition: transform 0.15s ease, opacity 0.15s ease;\n}\n\n/* Hover state */\n.sv-action-button:hover {\n  transform: scale(1.05);\n}\n\n/* Active (pressed) state */\n.sv-action-button:active {\n  transform: scale(0.95);\n}\n\n/* Focus visible state (keyboard navigation) */\n.sv-action-button:focus-visible {\n  outline: 2px solid var(--sv-focus-ring-color, rgba(255, 255, 255, 0.6));\n  outline-offset: 2px;\n  border-radius: 8px;\n}\n\n/* Disabled state */\n.sv-action-button:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n  transform: none;\n}\n\n/* Pending state - No visual change, debounce handles rapid clicks */\n/* Button remains fully interactive for smooth UX like TikTok/Instagram */\n.sv-action-button--pending {\n  /* No opacity change - keep button fully visible */\n  /* No pointer-events:none - allow continuous clicks */\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACTION BUTTON ICON\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-action-button__icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  \n  width: var(--sv-action-button-size, 48px);\n  height: var(--sv-action-button-size, 48px);\n  \n  /* Background circle */\n  border-radius: 50%;\n  \n  /* Icon color */\n  color: var(--sv-action-button-color, white);\n  \n  /* Icon size - applied to SVG children */\n  font-size: var(--sv-action-button-icon-size, 24px);\n  \n  /* Smooth transitions */\n  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;\n}\n\n/* SVG icon sizing */\n.sv-action-button__icon svg {\n  width: var(--sv-action-button-icon-size, 24px);\n  height: var(--sv-action-button-icon-size, 24px);\n  fill: currentColor;\n}\n\n\n/* Active state - icon filled */\n.sv-action-button--active .sv-action-button__icon {\n  color: var(--sv-action-button-active-color, #fe2c55);\n}\n\n/* Like animation (pop effect) */\n.sv-action-button--like-animate .sv-action-button__icon {\n  animation: sv-like-pop 0.3s ease;\n}\n\n@keyframes sv-like-pop {\n  0% {\n    transform: scale(1);\n  }\n  25% {\n    transform: scale(1.2);\n  }\n  50% {\n    transform: scale(0.95);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACTION BUTTON COUNT\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-action-button__count {\n  font-size: var(--sv-action-count-font-size, 12px);\n  font-weight: 600;\n  color: var(--sv-action-count-color, white);\n  \n  /* Prevent layout shift on number change */\n  min-width: 2ch;\n  text-align: center;\n  \n  /* Text shadow for readability on video */\n  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);\n  \n  /* Line height */\n  line-height: 1.2;\n  \n  /* Transition for count updates */\n  transition: transform 0.15s ease;\n}\n\n/* Count update animation */\n.sv-action-button--count-update .sv-action-button__count {\n  animation: sv-count-bounce 0.3s ease;\n}\n\n@keyframes sv-count-bounce {\n  0% {\n    transform: scale(1);\n  }\n  50% {\n    transform: scale(1.15);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n/* Hide count when zero */\n.sv-action-button__count--hidden {\n  visibility: hidden;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * VARIANTS\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Minimal variant - no background */\n.sv-action-button--minimal .sv-action-button__icon {\n  background: transparent;\n}\n\n.sv-action-button--minimal:hover .sv-action-button__icon {\n  background: rgba(255, 255, 255, 0.1);\n}\n\n/* Compact variant - smaller size */\n.sv-action-button--compact {\n  gap: 2px;\n}\n\n.sv-action-button--compact .sv-action-button__icon {\n  width: var(--sv-action-button-size-compact, 40px);\n  height: var(--sv-action-button-size-compact, 40px);\n}\n\n.sv-action-button--compact .sv-action-button__count {\n  font-size: var(--sv-action-count-font-size-compact, 11px);\n}\n\n/* Large variant */\n.sv-action-button--large .sv-action-button__icon {\n  width: var(--sv-action-button-size-large, 56px);\n  height: var(--sv-action-button-size-large, 56px);\n}\n\n.sv-action-button--large .sv-action-button__icon svg {\n  width: var(--sv-action-button-icon-size-large, 28px);\n  height: var(--sv-action-button-icon-size-large, 28px);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * SPECIFIC BUTTON TYPES\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Like button - red when active */\n.sv-action-button--like.sv-action-button--active .sv-action-button__icon {\n  color: var(--sv-like-color, #fe2c55);\n}\n\n/* Bookmark button - yellow when active */\n.sv-action-button--bookmark.sv-action-button--active .sv-action-button__icon {\n  color: var(--sv-bookmark-color, #ffc107);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * RESPONSIVE\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Small screens - slightly smaller buttons */\n@media (max-width: 375px) {\n  .sv-action-button__icon {\n    width: 44px;\n    height: 44px;\n  }\n  \n  .sv-action-button__icon svg {\n    width: 22px;\n    height: 22px;\n  }\n  \n  .sv-action-button__count {\n    font-size: 11px;\n  }\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACCESSIBILITY\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Reduced motion preference */\n@media (prefers-reduced-motion: reduce) {\n  .sv-action-button,\n  .sv-action-button__icon,\n  .sv-action-button__count {\n    transition: none;\n    animation: none;\n  }\n}\n";
+declare const ACTION_BAR_CSS = "\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACTION BAR - Container for action buttons\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-action-bar {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--sv-action-bar-gap, 12px);\n  padding: var(--sv-action-bar-padding, 8px 0);\n  \n  /* Auto-hide transition */\n  transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n}\n\n/* Hidden state for auto-hide */\n.sv-action-bar--hidden {\n  opacity: 0;\n  pointer-events: none;\n}\n\n/* Horizontal variant */\n.sv-action-bar--horizontal {\n  flex-direction: row;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACTION BUTTON - Individual action button (Like, Comment, Share, etc.)\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-action-button {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: var(--sv-action-button-gap, 4px);\n  \n  /* Reset button styles */\n  appearance: none;\n  background: transparent;\n  border: none;\n  padding: 0;\n  margin: 0;\n  cursor: pointer;\n  \n  /* Interaction */\n  outline: none;\n  touch-action: manipulation;\n  -webkit-tap-highlight-color: transparent;\n  user-select: none;\n  \n  /* Transition */\n  transition: transform 0.15s ease, opacity 0.15s ease;\n}\n\n/* Hover state */\n.sv-action-button:hover {\n  transform: scale(1.05);\n}\n\n/* Active (pressed) state */\n.sv-action-button:active {\n  transform: scale(0.95);\n}\n\n/* Focus visible state (keyboard navigation) */\n.sv-action-button:focus-visible {\n  outline: 2px solid var(--sv-focus-ring-color, rgba(255, 255, 255, 0.6));\n  outline-offset: 2px;\n  border-radius: 8px;\n}\n\n/* Disabled state */\n.sv-action-button:disabled {\n  opacity: 0.4;\n  cursor: not-allowed;\n  transform: none;\n}\n\n/* Pending state - No visual change, debounce handles rapid clicks */\n/* Button remains fully interactive for smooth UX like TikTok/Instagram */\n.sv-action-button--pending {\n  /* No opacity change - keep button fully visible */\n  /* No pointer-events:none - allow continuous clicks */\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACTION BUTTON ICON\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-action-button__icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  \n  width: var(--sv-action-button-size, 48px);\n  height: var(--sv-action-button-size, 48px);\n  \n  /* Background circle */\n  border-radius: 50%;\n  \n  /* Icon color */\n  color: var(--sv-action-button-color, white);\n  \n  /* Icon size - applied to SVG children */\n  font-size: var(--sv-action-button-icon-size, 24px);\n  \n  /* Smooth transitions */\n  transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;\n}\n\n/* SVG icon sizing */\n.sv-action-button__icon svg {\n  width: var(--sv-action-button-icon-size, 24px);\n  height: var(--sv-action-button-icon-size, 24px);\n  fill: currentColor;\n}\n\n\n/* Active state - icon filled */\n.sv-action-button--active .sv-action-button__icon {\n  color: var(--sv-action-button-active-color, #fe2c55);\n}\n\n/* Like animation (pop effect) */\n.sv-action-button--like-animate .sv-action-button__icon {\n  animation: sv-like-pop 0.3s ease;\n}\n\n@keyframes sv-like-pop {\n  0% {\n    transform: scale(1);\n  }\n  25% {\n    transform: scale(1.2);\n  }\n  50% {\n    transform: scale(0.95);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACTION BUTTON COUNT\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-action-button__count {\n  font-size: var(--sv-action-count-font-size, 12px);\n  font-weight: 600;\n  color: var(--sv-action-count-color, white);\n  \n  /* Prevent layout shift on number change */\n  min-width: 2ch;\n  text-align: center;\n  \n  /* Text shadow for readability on video */\n  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);\n  \n  /* Line height */\n  line-height: 1.2;\n  \n  /* Transition for count updates */\n  transition: transform 0.15s ease;\n}\n\n/* Count update animation */\n.sv-action-button--count-update .sv-action-button__count {\n  animation: sv-count-bounce 0.3s ease;\n}\n\n@keyframes sv-count-bounce {\n  0% {\n    transform: scale(1);\n  }\n  50% {\n    transform: scale(1.15);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n\n/* Hide count when zero */\n.sv-action-button__count--hidden {\n  visibility: hidden;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * VARIANTS\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Minimal variant - no background */\n.sv-action-button--minimal .sv-action-button__icon {\n  background: transparent;\n}\n\n.sv-action-button--minimal:hover .sv-action-button__icon {\n  background: rgba(255, 255, 255, 0.1);\n}\n\n/* Compact variant - smaller size */\n.sv-action-button--compact {\n  gap: 2px;\n}\n\n.sv-action-button--compact .sv-action-button__icon {\n  width: var(--sv-action-button-size-compact, 40px);\n  height: var(--sv-action-button-size-compact, 40px);\n}\n\n.sv-action-button--compact .sv-action-button__count {\n  font-size: var(--sv-action-count-font-size-compact, 11px);\n}\n\n/* Large variant */\n.sv-action-button--large .sv-action-button__icon {\n  width: var(--sv-action-button-size-large, 56px);\n  height: var(--sv-action-button-size-large, 56px);\n}\n\n.sv-action-button--large .sv-action-button__icon svg {\n  width: var(--sv-action-button-icon-size-large, 28px);\n  height: var(--sv-action-button-icon-size-large, 28px);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * SPECIFIC BUTTON TYPES\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Like button - red when active */\n.sv-action-button--like.sv-action-button--active .sv-action-button__icon {\n  color: var(--sv-like-color, #fe2c55);\n}\n\n/* Bookmark button - yellow when active */\n.sv-action-button--bookmark.sv-action-button--active .sv-action-button__icon {\n  color: var(--sv-bookmark-color, #ffc107);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * RESPONSIVE\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Small screens - slightly smaller buttons */\n@media (max-width: 375px) {\n  .sv-action-button__icon {\n    width: 44px;\n    height: 44px;\n  }\n  \n  .sv-action-button__icon svg {\n    width: 22px;\n    height: 22px;\n  }\n  \n  .sv-action-button__count {\n    font-size: 11px;\n  }\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n * ACCESSIBILITY\n * \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Reduced motion preference */\n@media (prefers-reduced-motion: reduce) {\n  .sv-action-button,\n  .sv-action-button__icon,\n  .sv-action-button__count {\n    transition: none;\n    animation: none;\n  }\n}\n";
 
 export { ACTION_BAR_CSS, CompoundBookmark as ActionBarBookmark, CompoundComment as ActionBarComment, ActionBarHeadless, type ActionBarHeadlessExtendedProps, CompoundLike as ActionBarLike, CompoundShare as ActionBarShare, ActionButton, type ActionButtonExtendedProps, BookmarkButton, type BookmarkButtonProps, CommentButton, type CommentButtonProps, LikeButton, type LikeButtonProps, ShareButton, type ShareButtonProps };

package/dist/components/ActionBar/index.js

@@ -1 +1 @@
-export { ACTION_BAR_CSS, CompoundBookmark as ActionBarBookmark, CompoundComment as ActionBarComment, ActionBarHeadless, CompoundLike as ActionBarLike, CompoundShare as ActionBarShare, ActionButton, BookmarkButton, CommentButton, LikeButton, ShareButton } from '../../chunk-C27FC7E2.js';
+export { ACTION_BAR_CSS, CompoundBookmark as ActionBarBookmark, CompoundComment as ActionBarComment, ActionBarHeadless, CompoundLike as ActionBarLike, CompoundShare as ActionBarShare, ActionButton, BookmarkButton, CommentButton, LikeButton, ShareButton } from '../../chunk-NJXIYSDZ.js';

package/dist/components/ArticleSlot/index.js

@@ -1 +1 @@
-export { ARTICLE_ACTIVE_ATTR, ARTICLE_ID_ATTR, ARTICLE_SLOT_ACTIVE_CLASS, ARTICLE_SLOT_CLASS, ARTICLE_SLOT_CLEAN_MODE_CLASS, ARTICLE_SLOT_CSS, ArticleSlotActions, ArticleSlotBottom, ArticleSlotCaption, ArticleSlotHeadless, ArticleSlotMusic, ArticleSlotOverlay, ArticleSlotPlayIndicator, ArticleSlotReadMore, ARTICLE_ACTIVE_ATTR as IMAGE_POST_ACTIVE_ATTR, ARTICLE_ID_ATTR as IMAGE_POST_ID_ATTR, ARTICLE_SLOT_ACTIVE_CLASS as IMAGE_POST_SLOT_ACTIVE_CLASS, ARTICLE_SLOT_CLASS as IMAGE_POST_SLOT_CLASS, ARTICLE_SLOT_CLEAN_MODE_CLASS as IMAGE_POST_SLOT_CLEAN_MODE_CLASS, ARTICLE_SLOT_CSS as IMAGE_POST_SLOT_CSS, ArticleSlotActions as ImagePostSlotActions, ArticleSlotBottom as ImagePostSlotBottom, ArticleSlotCaption as ImagePostSlotCaption, ArticleSlotHeadless as ImagePostSlotHeadless, ArticleSlotMusic as ImagePostSlotMusic, ArticleSlotOverlay as ImagePostSlotOverlay, ArticleSlotPlayIndicator as ImagePostSlotPlayIndicator, ArticleSlotReadMore as ImagePostSlotReadMore, useArticleSlotContext, useArticleSlotContext as useImagePostSlotContext, useOptionalArticleSlotContext, useOptionalArticleSlotContext as useOptionalImagePostSlotContext } from '../../chunk-K3YQHGDX.js';
+export { ARTICLE_ACTIVE_ATTR, ARTICLE_ID_ATTR, ARTICLE_SLOT_ACTIVE_CLASS, ARTICLE_SLOT_CLASS, ARTICLE_SLOT_CLEAN_MODE_CLASS, ARTICLE_SLOT_CSS, ArticleSlotActions, ArticleSlotBottom, ArticleSlotCaption, ArticleSlotHeadless, ArticleSlotMusic, ArticleSlotOverlay, ArticleSlotPlayIndicator, ArticleSlotReadMore, ARTICLE_ACTIVE_ATTR as IMAGE_POST_ACTIVE_ATTR, ARTICLE_ID_ATTR as IMAGE_POST_ID_ATTR, ARTICLE_SLOT_ACTIVE_CLASS as IMAGE_POST_SLOT_ACTIVE_CLASS, ARTICLE_SLOT_CLASS as IMAGE_POST_SLOT_CLASS, ARTICLE_SLOT_CLEAN_MODE_CLASS as IMAGE_POST_SLOT_CLEAN_MODE_CLASS, ARTICLE_SLOT_CSS as IMAGE_POST_SLOT_CSS, ArticleSlotActions as ImagePostSlotActions, ArticleSlotBottom as ImagePostSlotBottom, ArticleSlotCaption as ImagePostSlotCaption, ArticleSlotHeadless as ImagePostSlotHeadless, ArticleSlotMusic as ImagePostSlotMusic, ArticleSlotOverlay as ImagePostSlotOverlay, ArticleSlotPlayIndicator as ImagePostSlotPlayIndicator, ArticleSlotReadMore as ImagePostSlotReadMore, useArticleSlotContext, useArticleSlotContext as useImagePostSlotContext, useOptionalArticleSlotContext, useOptionalArticleSlotContext as useOptionalImagePostSlotContext } from '../../chunk-BNI7CYRI.js';

package/dist/components/AuthorInfo/index.d.ts

@@ -273,6 +273,6 @@ declare function useOptionalAuthorInfoContext(): AuthorInfoContextValue | null;
  * - --sv-author-desc-color: Description text color
  * - --sv-follow-btn-*: Follow button styling
  */
-declare const AUTHOR_INFO_CSS = "\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   AUTHOR INFO - Container\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info {\n  display: flex;\n  align-items: center;\n  gap: var(--sv-author-gap, 12px);\n  width: 100%;\n}\n\n.sv-author-info--vertical {\n  flex-direction: column;\n  align-items: flex-start;\n}\n\n.sv-author-info--horizontal {\n  flex-direction: row;\n  align-items: center;\n}\n\n.sv-author-info--compact {\n  gap: var(--sv-author-gap-compact, 8px);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   AVATAR\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__avatar {\n  position: relative;\n  flex-shrink: 0;\n  width: var(--sv-author-avatar-size, 48px);\n  height: var(--sv-author-avatar-size, 48px);\n  border-radius: 50%;\n  overflow: hidden;\n  background: var(--sv-author-avatar-bg, rgba(255, 255, 255, 0.1));\n  cursor: pointer;\n  transition: transform 0.15s ease;\n}\n\n.sv-author-info__avatar:hover {\n  transform: scale(1.05);\n}\n\n.sv-author-info__avatar:active {\n  transform: scale(0.98);\n}\n\n.sv-author-info__avatar-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: 50%;\n}\n\n.sv-author-info__avatar-placeholder {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--sv-author-avatar-placeholder-bg, linear-gradient(135deg, #667eea 0%, #764ba2 100%));\n  color: var(--sv-author-avatar-placeholder-color, #fff);\n  font-size: calc(var(--sv-author-avatar-size, 48px) * 0.4);\n  font-weight: 600;\n  text-transform: uppercase;\n}\n\n.sv-author-info__avatar-placeholder svg {\n  width: 60%;\n  height: 60%;\n  opacity: 0.9;\n}\n\n/* Avatar sizes */\n.sv-author-info__avatar--small {\n  width: var(--sv-author-avatar-size-small, 32px);\n  height: var(--sv-author-avatar-size-small, 32px);\n}\n\n.sv-author-info__avatar--large {\n  width: var(--sv-author-avatar-size-large, 64px);\n  height: var(--sv-author-avatar-size-large, 64px);\n}\n\n/* Verified badge */\n.sv-author-info__verified-badge {\n  position: absolute;\n  bottom: -2px;\n  right: -2px;\n  width: calc(var(--sv-author-avatar-size, 48px) * 0.35);\n  height: calc(var(--sv-author-avatar-size, 48px) * 0.35);\n  min-width: 14px;\n  min-height: 14px;\n  border-radius: 50%;\n  background: var(--sv-verified-badge-bg, #1DA1F2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: 2px solid var(--sv-verified-badge-border, #000);\n}\n\n.sv-author-info__verified-badge svg {\n  width: 60%;\n  height: 60%;\n  color: var(--sv-verified-badge-color, #fff);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   INFO (Name + Description container)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--sv-author-content-gap, 2px);\n  flex: 1;\n  min-width: 0; /* Allow text truncation */\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   NAME\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__name {\n  display: flex;\n  align-items: center;\n  gap: var(--sv-author-name-gap, 4px);\n  font-size: var(--sv-author-name-size, 16px);\n  font-weight: var(--sv-author-name-weight, 600);\n  color: var(--sv-author-name-color, #fff);\n  cursor: pointer;\n  transition: opacity 0.15s ease;\n}\n\n.sv-author-info__name:hover {\n  opacity: 0.8;\n}\n\n.sv-author-info__name-text {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.sv-author-info__name--with-at::before {\n  content: '@';\n  opacity: 0.8;\n}\n\n.sv-author-info__name-verified {\n  flex-shrink: 0;\n  width: var(--sv-author-name-verified-size, 14px);\n  height: var(--sv-author-name-verified-size, 14px);\n  color: var(--sv-verified-badge-bg, #1DA1F2);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   DESCRIPTION / BIO\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__description {\n  font-size: var(--sv-author-desc-size, 13px);\n  color: var(--sv-author-desc-color, rgba(255, 255, 255, 0.7));\n  line-height: var(--sv-author-desc-line-height, 1.4);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: -webkit-box;\n  -webkit-line-clamp: var(--sv-author-desc-lines, 2);\n  -webkit-box-orient: vertical;\n}\n\n.sv-author-info__description--single-line {\n  -webkit-line-clamp: 1;\n  white-space: nowrap;\n  display: block;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   FOLLOW BUTTON\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__follow-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--sv-follow-btn-gap, 6px);\n  padding: var(--sv-follow-btn-padding, 8px 16px);\n  min-width: var(--sv-follow-btn-min-width, 88px);\n  border: none;\n  border-radius: var(--sv-follow-btn-radius, 4px);\n  font-size: var(--sv-follow-btn-size, 14px);\n  font-weight: var(--sv-follow-btn-weight, 600);\n  cursor: pointer;\n  transition: all 0.2s ease;\n  outline: none;\n  user-select: none;\n  -webkit-user-select: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n/* Not following state (primary CTA) */\n.sv-author-info__follow-btn--default {\n  background: var(--sv-follow-btn-bg, #fe2c55);\n  color: var(--sv-follow-btn-color, #fff);\n}\n\n.sv-author-info__follow-btn--default:hover:not(:disabled) {\n  background: var(--sv-follow-btn-bg-hover, #ff4466);\n  transform: scale(1.02);\n}\n\n.sv-author-info__follow-btn--default:active:not(:disabled) {\n  transform: scale(0.98);\n}\n\n/* Following state (outline) */\n.sv-author-info__follow-btn--following {\n  background: var(--sv-follow-btn-following-bg, transparent);\n  color: var(--sv-follow-btn-following-color, rgba(255, 255, 255, 0.9));\n  border: 1px solid var(--sv-follow-btn-following-border, rgba(255, 255, 255, 0.3));\n}\n\n.sv-author-info__follow-btn--following:hover:not(:disabled) {\n  background: var(--sv-follow-btn-following-bg-hover, rgba(255, 255, 255, 0.1));\n  border-color: var(--sv-follow-btn-following-border-hover, rgba(255, 255, 255, 0.5));\n}\n\n/* Pending state */\n.sv-author-info__follow-btn--pending {\n  opacity: 0.6;\n  pointer-events: none;\n  cursor: wait;\n}\n\n.sv-author-info__follow-btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n/* Icon in button */\n.sv-author-info__follow-btn-icon {\n  width: var(--sv-follow-btn-icon-size, 16px);\n  height: var(--sv-follow-btn-icon-size, 16px);\n  flex-shrink: 0;\n}\n\n/* Loading spinner */\n.sv-author-info__follow-btn-spinner {\n  width: var(--sv-follow-btn-icon-size, 16px);\n  height: var(--sv-follow-btn-icon-size, 16px);\n  border: 2px solid currentColor;\n  border-top-color: transparent;\n  border-radius: 50%;\n  animation: sv-author-info-spin 0.6s linear infinite;\n}\n\n@keyframes sv-author-info-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Button sizes */\n.sv-author-info__follow-btn--small {\n  padding: var(--sv-follow-btn-padding-small, 6px 12px);\n  font-size: var(--sv-follow-btn-size-small, 12px);\n  min-width: var(--sv-follow-btn-min-width-small, 72px);\n}\n\n.sv-author-info__follow-btn--large {\n  padding: var(--sv-follow-btn-padding-large, 10px 20px);\n  font-size: var(--sv-follow-btn-size-large, 16px);\n  min-width: var(--sv-follow-btn-min-width-large, 100px);\n}\n\n/* Icon-only button */\n.sv-author-info__follow-btn--icon-only {\n  min-width: unset;\n  padding: var(--sv-follow-btn-icon-padding, 8px);\n  border-radius: 50%;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   LAYOUT VARIANTS\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Inline variant (avatar + name inline, follow button on right) */\n.sv-author-info--inline {\n  justify-content: space-between;\n}\n\n.sv-author-info--inline .sv-author-info__content {\n  flex: 1;\n}\n\n/* Stacked variant (avatar above name) */\n.sv-author-info--stacked {\n  flex-direction: column;\n  align-items: center;\n  text-align: center;\n}\n\n.sv-author-info--stacked .sv-author-info__content {\n  align-items: center;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   OVERLAY MODE (for use on video)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info--overlay {\n  /* Text shadow for readability on video */\n  text-shadow: var(--sv-author-overlay-shadow, 0 1px 2px rgba(0, 0, 0, 0.5));\n}\n\n.sv-author-info--overlay .sv-author-info__avatar {\n  border: 2px solid var(--sv-author-overlay-avatar-border, rgba(255, 255, 255, 0.5));\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   AVATAR-BADGE VARIANT (TikTok-style avatar with follow badge)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info--avatar-badge {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: auto;\n  gap: 0;\n}\n\n/* Avatar in badge variant */\n.sv-author-info--avatar-badge .sv-author-info__avatar {\n  width: var(--sv-avatar-badge-size, 48px);\n  height: var(--sv-avatar-badge-size, 48px);\n  border: 2px solid var(--sv-avatar-badge-border, #fff);\n}\n\n/* Follow button as overlay badge */\n.sv-author-info--avatar-badge .sv-author-info__follow-btn {\n  position: absolute;\n  bottom: var(--sv-avatar-badge-btn-bottom, -10px);\n  left: 50%;\n  transform: translateX(-50%);\n  min-width: unset;\n  width: var(--sv-avatar-badge-btn-size, 24px);\n  height: var(--sv-avatar-badge-btn-size, 24px);\n  padding: 0;\n  border-radius: 50%;\n  background: var(--sv-color-primary, #fe2c55);\n  border: 2px solid var(--sv-bg-primary, #000);\n  z-index: 1;\n}\n\n.sv-author-info--avatar-badge .sv-author-info__follow-btn:hover:not(:disabled) {\n  transform: translateX(-50%) scale(1.1);\n}\n\n.sv-author-info--avatar-badge .sv-author-info__follow-btn:active:not(:disabled) {\n  transform: translateX(-50%) scale(0.95);\n}\n\n/* Icon size in badge button */\n.sv-author-info--avatar-badge .sv-author-info__follow-btn-icon {\n  width: var(--sv-avatar-badge-icon-size, 14px);\n  height: var(--sv-avatar-badge-icon-size, 14px);\n}\n\n/* Hide button when following (TikTok behavior) */\n.sv-author-info--avatar-badge .sv-author-info__follow-btn--following {\n  display: none;\n}\n\n/* Hide content section in badge variant */\n.sv-author-info--avatar-badge .sv-author-info__content {\n  display: none;\n}\n\n/* Add margin bottom for action bar spacing */\n.sv-author-info--avatar-badge {\n  margin-bottom: var(--sv-avatar-badge-margin, 16px);\n}\n";
+declare const AUTHOR_INFO_CSS = "\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   AUTHOR INFO - Container\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info {\n  display: flex;\n  align-items: center;\n  gap: var(--sv-author-gap, 12px);\n  width: 100%;\n}\n\n.sv-author-info--vertical {\n  flex-direction: column;\n  align-items: flex-start;\n}\n\n.sv-author-info--horizontal {\n  flex-direction: row;\n  align-items: center;\n}\n\n.sv-author-info--compact {\n  gap: var(--sv-author-gap-compact, 8px);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   AVATAR\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__avatar {\n  position: relative;\n  flex-shrink: 0;\n  width: var(--sv-author-avatar-size, 48px);\n  height: var(--sv-author-avatar-size, 48px);\n  border-radius: 50%;\n  overflow: hidden;\n  background: var(--sv-author-avatar-bg, rgba(255, 255, 255, 0.1));\n  cursor: pointer;\n  transition: transform 0.15s ease;\n}\n\n.sv-author-info__avatar:hover {\n  transform: scale(1.05);\n}\n\n.sv-author-info__avatar:active {\n  transform: scale(0.98);\n}\n\n.sv-author-info__avatar-img {\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n  border-radius: 50%;\n}\n\n.sv-author-info__avatar-placeholder {\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--sv-author-avatar-placeholder-bg, linear-gradient(135deg, #667eea 0%, #764ba2 100%));\n  color: var(--sv-author-avatar-placeholder-color, #fff);\n  font-size: calc(var(--sv-author-avatar-size, 48px) * 0.4);\n  font-weight: 600;\n  text-transform: uppercase;\n}\n\n.sv-author-info__avatar-placeholder svg {\n  width: 60%;\n  height: 60%;\n  opacity: 0.9;\n}\n\n/* Avatar sizes */\n.sv-author-info__avatar--small {\n  width: var(--sv-author-avatar-size-small, 32px);\n  height: var(--sv-author-avatar-size-small, 32px);\n}\n\n.sv-author-info__avatar--large {\n  width: var(--sv-author-avatar-size-large, 64px);\n  height: var(--sv-author-avatar-size-large, 64px);\n}\n\n/* Verified badge */\n.sv-author-info__verified-badge {\n  position: absolute;\n  bottom: -2px;\n  right: -2px;\n  width: calc(var(--sv-author-avatar-size, 48px) * 0.35);\n  height: calc(var(--sv-author-avatar-size, 48px) * 0.35);\n  min-width: 14px;\n  min-height: 14px;\n  border-radius: 50%;\n  background: var(--sv-verified-badge-bg, #1DA1F2);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: 2px solid var(--sv-verified-badge-border, #000);\n}\n\n.sv-author-info__verified-badge svg {\n  width: 60%;\n  height: 60%;\n  color: var(--sv-verified-badge-color, #fff);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   INFO (Name + Description container)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__content {\n  display: flex;\n  flex-direction: column;\n  gap: var(--sv-author-content-gap, 2px);\n  flex: 1;\n  min-width: 0; /* Allow text truncation */\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   NAME\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__name {\n  display: flex;\n  align-items: center;\n  gap: var(--sv-author-name-gap, 4px);\n  font-size: var(--sv-author-name-size, 16px);\n  font-weight: var(--sv-author-name-weight, 600);\n  color: var(--sv-author-name-color, #fff);\n  cursor: pointer;\n  transition: opacity 0.15s ease;\n}\n\n.sv-author-info__name:hover {\n  opacity: 0.8;\n}\n\n.sv-author-info__name-text {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.sv-author-info__name--with-at::before {\n  content: '@';\n  opacity: 0.8;\n}\n\n.sv-author-info__name-verified {\n  flex-shrink: 0;\n  width: var(--sv-author-name-verified-size, 14px);\n  height: var(--sv-author-name-verified-size, 14px);\n  color: var(--sv-verified-badge-bg, #1DA1F2);\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   DESCRIPTION / BIO\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__description {\n  font-size: var(--sv-author-desc-size, 13px);\n  color: var(--sv-author-desc-color, rgba(255, 255, 255, 0.7));\n  line-height: var(--sv-author-desc-line-height, 1.4);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  display: -webkit-box;\n  -webkit-line-clamp: var(--sv-author-desc-lines, 2);\n  -webkit-box-orient: vertical;\n}\n\n.sv-author-info__description--single-line {\n  -webkit-line-clamp: 1;\n  white-space: nowrap;\n  display: block;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   FOLLOW BUTTON\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info__follow-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--sv-follow-btn-gap, 6px);\n  padding: var(--sv-follow-btn-padding, 8px 16px);\n  min-width: var(--sv-follow-btn-min-width, 88px);\n  border: none;\n  border-radius: var(--sv-follow-btn-radius, 4px);\n  font-size: var(--sv-follow-btn-size, 14px);\n  font-weight: var(--sv-follow-btn-weight, 600);\n  cursor: pointer;\n  transition: all 0.2s ease;\n  outline: none;\n  user-select: none;\n  -webkit-tap-highlight-color: transparent;\n}\n\n/* Not following state (primary CTA) */\n.sv-author-info__follow-btn--default {\n  background: var(--sv-follow-btn-bg, #fe2c55);\n  color: var(--sv-follow-btn-color, #fff);\n}\n\n.sv-author-info__follow-btn--default:hover:not(:disabled) {\n  background: var(--sv-follow-btn-bg-hover, #ff4466);\n  transform: scale(1.02);\n}\n\n.sv-author-info__follow-btn--default:active:not(:disabled) {\n  transform: scale(0.98);\n}\n\n/* Following state (outline) */\n.sv-author-info__follow-btn--following {\n  background: var(--sv-follow-btn-following-bg, transparent);\n  color: var(--sv-follow-btn-following-color, rgba(255, 255, 255, 0.9));\n  border: 1px solid var(--sv-follow-btn-following-border, rgba(255, 255, 255, 0.3));\n}\n\n.sv-author-info__follow-btn--following:hover:not(:disabled) {\n  background: var(--sv-follow-btn-following-bg-hover, rgba(255, 255, 255, 0.1));\n  border-color: var(--sv-follow-btn-following-border-hover, rgba(255, 255, 255, 0.5));\n}\n\n/* Pending state */\n.sv-author-info__follow-btn--pending {\n  opacity: 0.6;\n  pointer-events: none;\n  cursor: wait;\n}\n\n.sv-author-info__follow-btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n/* Icon in button */\n.sv-author-info__follow-btn-icon {\n  width: var(--sv-follow-btn-icon-size, 16px);\n  height: var(--sv-follow-btn-icon-size, 16px);\n  flex-shrink: 0;\n}\n\n/* Loading spinner */\n.sv-author-info__follow-btn-spinner {\n  width: var(--sv-follow-btn-icon-size, 16px);\n  height: var(--sv-follow-btn-icon-size, 16px);\n  border: 2px solid currentColor;\n  border-top-color: transparent;\n  border-radius: 50%;\n  animation: sv-author-info-spin 0.6s linear infinite;\n}\n\n@keyframes sv-author-info-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Button sizes */\n.sv-author-info__follow-btn--small {\n  padding: var(--sv-follow-btn-padding-small, 6px 12px);\n  font-size: var(--sv-follow-btn-size-small, 12px);\n  min-width: var(--sv-follow-btn-min-width-small, 72px);\n}\n\n.sv-author-info__follow-btn--large {\n  padding: var(--sv-follow-btn-padding-large, 10px 20px);\n  font-size: var(--sv-follow-btn-size-large, 16px);\n  min-width: var(--sv-follow-btn-min-width-large, 100px);\n}\n\n/* Icon-only button */\n.sv-author-info__follow-btn--icon-only {\n  min-width: unset;\n  padding: var(--sv-follow-btn-icon-padding, 8px);\n  border-radius: 50%;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   LAYOUT VARIANTS\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n/* Inline variant (avatar + name inline, follow button on right) */\n.sv-author-info--inline {\n  justify-content: space-between;\n}\n\n.sv-author-info--inline .sv-author-info__content {\n  flex: 1;\n}\n\n/* Stacked variant (avatar above name) */\n.sv-author-info--stacked {\n  flex-direction: column;\n  align-items: center;\n  text-align: center;\n}\n\n.sv-author-info--stacked .sv-author-info__content {\n  align-items: center;\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   OVERLAY MODE (for use on video)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info--overlay {\n  /* Text shadow for readability on video */\n  text-shadow: var(--sv-author-overlay-shadow, 0 1px 2px rgba(0, 0, 0, 0.5));\n}\n\n.sv-author-info--overlay .sv-author-info__avatar {\n  border: 2px solid var(--sv-author-overlay-avatar-border, rgba(255, 255, 255, 0.5));\n}\n\n/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n   AVATAR-BADGE VARIANT (TikTok-style avatar with follow badge)\n   \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 */\n\n.sv-author-info--avatar-badge {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  width: auto;\n  gap: 0;\n}\n\n/* Avatar in badge variant */\n.sv-author-info--avatar-badge .sv-author-info__avatar {\n  width: var(--sv-avatar-badge-size, 48px);\n  height: var(--sv-avatar-badge-size, 48px);\n  border: 2px solid var(--sv-avatar-badge-border, #fff);\n}\n\n/* Follow button as overlay badge */\n.sv-author-info--avatar-badge .sv-author-info__follow-btn {\n  position: absolute;\n  bottom: var(--sv-avatar-badge-btn-bottom, -10px);\n  left: 50%;\n  transform: translateX(-50%);\n  min-width: unset;\n  width: var(--sv-avatar-badge-btn-size, 24px);\n  height: var(--sv-avatar-badge-btn-size, 24px);\n  padding: 0;\n  border-radius: 50%;\n  background: var(--sv-color-primary, #fe2c55);\n  border: 2px solid var(--sv-bg-primary, #000);\n  z-index: 1;\n}\n\n.sv-author-info--avatar-badge .sv-author-info__follow-btn:hover:not(:disabled) {\n  transform: translateX(-50%) scale(1.1);\n}\n\n.sv-author-info--avatar-badge .sv-author-info__follow-btn:active:not(:disabled) {\n  transform: translateX(-50%) scale(0.95);\n}\n\n/* Icon size in badge button */\n.sv-author-info--avatar-badge .sv-author-info__follow-btn-icon {\n  width: var(--sv-avatar-badge-icon-size, 14px);\n  height: var(--sv-avatar-badge-icon-size, 14px);\n}\n\n/* Hide button when following (TikTok behavior) */\n.sv-author-info--avatar-badge .sv-author-info__follow-btn--following {\n  display: none;\n}\n\n/* Hide content section in badge variant */\n.sv-author-info--avatar-badge .sv-author-info__content {\n  display: none;\n}\n\n/* Add margin bottom for action bar spacing */\n.sv-author-info--avatar-badge {\n  margin-bottom: var(--sv-avatar-badge-margin, 16px);\n}\n";
 
 export { AUTHOR_INFO_CSS, AuthorAvatar, type AuthorAvatarProps, AuthorDescription, type AuthorDescriptionProps, AuthorInfoContext, type AuthorInfoContextValue, AuthorInfoHeadless, type AuthorInfoHeadlessExtendedProps, type AuthorInfoVariant, AuthorName, type AuthorNameProps, type AvatarSize, FollowButton, type FollowButtonProps, type FollowButtonSize, useAuthorInfoContext, useOptionalAuthorInfoContext };

package/dist/components/AuthorInfo/index.js

@@ -1 +1 @@
-export { AUTHOR_INFO_CSS, AuthorAvatar, AuthorDescription, AuthorInfoContext, AuthorInfoHeadless, AuthorName, FollowButton, useAuthorInfoContext, useOptionalAuthorInfoContext } from '../../chunk-26KDWJRI.js';
+export { AUTHOR_INFO_CSS, AuthorAvatar, AuthorDescription, AuthorInfoContext, AuthorInfoHeadless, AuthorName, FollowButton, useAuthorInfoContext, useOptionalAuthorInfoContext } from '../../chunk-3OB3OVYR.js';