@ebay/ui-core-react 7.0.0 → 7.1.0-alpha.2

package/ebay-switch.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),b=require("classnames"),o=s=>typeof s<"u",w=({id:s,value:i,name:r,className:u,checked:e,defaultChecked:h=!1,onChange:d=()=>{},...m})=>{const[a,c]=t.useState(h);t.useEffect(()=>{c(!!e)},[e]);const p=n=>{const{value:f="",checked:l=!1}=n.target||{};d(n,{value:f,checked:l}),c(l)};return t.createElement("span",{className:"switch"},t.createElement("input",{...m,className:b("switch__control",u),id:s,role:"switch",type:"checkbox",value:i,"aria-checked":o(e)?e:a,checked:o(e)?e:a,name:r,onChange:p}),t.createElement("span",{className:"switch__button"}))};exports.EbaySwitch=w;

package/ebay-switch.mjs

@@ -0,0 +1,25 @@
+import a, { useState as C, useEffect as w } from "react";
+import E from "classnames";
+const l = (t) => typeof t < "u", b = ({ id: t, value: r, name: i, className: h, checked: e, defaultChecked: m = !1, onChange: u = () => {
+}, ...p }) => {
+  const [s, c] = C(m);
+  w(() => {
+    c(!!e);
+  }, [e]);
+  const f = (n) => {
+    const { value: d = "", checked: o = !1 } = n.target || {};
+    u(n, {
+      value: d,
+      checked: o
+    }), c(o);
+  };
+  return a.createElement(
+    "span",
+    { className: "switch" },
+    a.createElement("input", { ...p, className: E("switch__control", h), id: t, role: "switch", type: "checkbox", value: r, "aria-checked": l(e) ? e : s, checked: l(e) ? e : s, name: i, onChange: f }),
+    a.createElement("span", { className: "switch__button" })
+  );
+};
+export {
+  b as EbaySwitch
+};

package/ebay-tabs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),i=require("classnames"),x=require("./index-DbjwTbDP.js"),E=require("./utils-C9NL3q0j.js"),_=({children:l,index:c,parentId:n,selected:o,focused:r,className:d,refCallback:m,...b})=>a.createElement("div",{...b,ref:m,"aria-controls":`${n||"default"}-tabpanel-${c}`,"aria-selected":o,className:i(d,"tabs__item"),id:`${n||"default"}-tab-${c}`,role:"tab",tabIndex:r?0:-1},a.createElement("span",null,l)),h=({children:l,index:c,parentId:n,selected:o,className:r,...d})=>a.createElement("div",{...d,"aria-labelledby":`default-tab-${c}`,className:i(r,"tabs__panel"),id:`${n||"default"}-tabpanel-${c}`,role:"tabpanel",hidden:!o},a.createElement("div",{className:"tabs__cell"},l)),D=({id:l,className:c,index:n=0,size:o="medium",activation:r="auto",onSelect:d=()=>{},onTabSelect:m=()=>{},children:b})=>{const I=[],[f,N]=a.useState(n),[p,T]=a.useState(n),u=e=>{d({selectedIndex:e}),m(e),N(e)},w=(e,t)=>{x.handleActionKeydown(e,()=>{e.preventDefault(),r==="manual"&&u(t)}),x.handleLeftRightArrowsKeydown(e,()=>{var g;e.preventDefault();const s=E.filterByType(b,_).length,q=["Left","ArrowLeft"].includes(e.key)?-1:1,y=((p===void 0?f:p)+s+q)%s;T(y),(g=I[y])==null||g.focus(),r!=="manual"&&u(y)})};a.useEffect(()=>{u(n)},[n]);const S=o==="large",v=E.filterByType(b,_).map((e,t)=>a.cloneElement(e,{...e.props,refCallback:s=>{I[t]=s},index:t,parentId:l,selected:f===t,focused:p===t,onClick:()=>{u(t),T(t)},onKeyDown:s=>{w(s,t)}})),P=E.filterByType(b,h).map((e,t)=>{const s={index:t,parentId:l,selected:f===t,children:e.props.children};return a.cloneElement(e,s)});return a.createElement("div",{id:l,className:i(c,"tabs")},a.createElement("div",{className:i("tabs__items",{"tabs__items--large":S}),role:"tablist"},v),a.createElement("div",{className:"tabs__content"},P))};exports.EbayTab=_;exports.EbayTabPanel=h;exports.EbayTabs=D;

package/ebay-tabs.mjs

@@ -0,0 +1,66 @@
+import c, { useState as x, useEffect as L, cloneElement as g } from "react";
+import f from "classnames";
+import { h as P, a as k } from "./index-B5oC9Rl1.mjs";
+import { b as _ } from "./utils-BipBqkOS.mjs";
+const N = ({ children: n, index: l, parentId: t, selected: r, focused: o, className: d, refCallback: u, ...m }) => c.createElement(
+  "div",
+  { ...m, ref: u, "aria-controls": `${t || "default"}-tabpanel-${l}`, "aria-selected": r, className: f(d, "tabs__item"), id: `${t || "default"}-tab-${l}`, role: "tab", tabIndex: o ? 0 : -1 },
+  c.createElement("span", null, n)
+), A = ({ children: n, index: l, parentId: t, selected: r, className: o, ...d }) => c.createElement(
+  "div",
+  { ...d, "aria-labelledby": `default-tab-${l}`, className: f(o, "tabs__panel"), id: `${t || "default"}-tabpanel-${l}`, role: "tabpanel", hidden: !r },
+  c.createElement("div", { className: "tabs__cell" }, n)
+), H = ({ id: n, className: l, index: t = 0, size: r = "medium", activation: o = "auto", onSelect: d = () => {
+}, onTabSelect: u = () => {
+}, children: m }) => {
+  const y = [], [p, T] = x(t), [i, I] = x(t), b = (e) => {
+    d({ selectedIndex: e }), u(e), T(e);
+  }, $ = (e, a) => {
+    P(e, () => {
+      e.preventDefault(), o === "manual" && b(a);
+    }), k(e, () => {
+      var h;
+      e.preventDefault();
+      const s = _(m, N).length, K = ["Left", "ArrowLeft"].includes(e.key) ? -1 : 1, E = ((i === void 0 ? p : i) + s + K) % s;
+      I(E), (h = y[E]) == null || h.focus(), o !== "manual" && b(E);
+    });
+  };
+  L(() => {
+    b(t);
+  }, [t]);
+  const w = r === "large", v = _(m, N).map((e, a) => g(e, {
+    ...e.props,
+    refCallback: (s) => {
+      y[a] = s;
+    },
+    index: a,
+    parentId: n,
+    selected: p === a,
+    focused: i === a,
+    onClick: () => {
+      b(a), I(a);
+    },
+    onKeyDown: (s) => {
+      $(s, a);
+    }
+  })), D = _(m, A).map((e, a) => {
+    const s = {
+      index: a,
+      parentId: n,
+      selected: p === a,
+      children: e.props.children
+    };
+    return g(e, s);
+  });
+  return c.createElement(
+    "div",
+    { id: n, className: f(l, "tabs") },
+    c.createElement("div", { className: f("tabs__items", { "tabs__items--large": w }), role: "tablist" }, v),
+    c.createElement("div", { className: "tabs__content" }, D)
+  );
+};
+export {
+  N as EbayTab,
+  A as EbayTabPanel,
+  H as EbayTabs
+};

package/ebay-textbox.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("./textbox-WnB-9F4y.js");exports.EbayTextbox=x.EbayTextbox;exports.EbayTextboxPostfixIcon=x.EbayTextboxPostfixIcon;exports.EbayTextboxPostfixText=x.EbayTextboxPostfixText;exports.EbayTextboxPrefixIcon=x.EbayTextboxPrefixIcon;exports.EbayTextboxPrefixText=x.EbayTextboxPrefixText;

package/ebay-textbox.mjs

@@ -0,0 +1,8 @@
+import { E as b, c as o, d as e, a as t, b as s } from "./textbox-BxYjEAZK.mjs";
+export {
+  b as EbayTextbox,
+  o as EbayTextboxPostfixIcon,
+  e as EbayTextboxPostfixText,
+  t as EbayTextboxPrefixIcon,
+  s as EbayTextboxPrefixText
+};

package/ebay-toast-dialog.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react"),s=require("classnames"),i=require("./dialog-previous-button-7ePoYWyj.js");require("./icon-button-BB6GFLm7.js");const r=({className:t,onClose:e=()=>{},...o})=>a.createElement(i.DialogBaseWithState,{...o,isModal:!1,baseEl:"aside",classPrefix:"toast-dialog",buttonPosition:"right",transitionElement:"root",className:s(t,"toast-dialog--transition"),onCloseBtnClick:e});exports.EbayToast=r;

package/ebay-toast-dialog.mjs

@@ -0,0 +1,9 @@
+import s from "react";
+import i from "classnames";
+import { D as e } from "./dialog-previous-button-gmkm4c8J.mjs";
+import "./icon-button-Dy8rjzH7.mjs";
+const c = ({ className: t, onClose: o = () => {
+}, ...a }) => s.createElement(e, { ...a, isModal: !1, baseEl: "aside", classPrefix: "toast-dialog", buttonPosition: "right", transitionElement: "root", className: i(t, "toast-dialog--transition"), onCloseBtnClick: o });
+export {
+  c as EbayToast
+};

package/ebay-tooltip.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),u=require("./utils-C9NL3q0j.js"),t=require("./use-tooltip-BavqG36Z.js");require("classnames");require("./icon-DK6eEQD8.js");require("./array.polyfill.flat-5BAolFdk.js");const c=()=>null,T=()=>null,g=({className:E,pointer:y,overlayStyle:f,noHover:l,onFocus:h=()=>{},onBlur:b=()=>{},onMouseEnter:d=()=>{},onMouseLeave:m=()=>{},onExpand:q,onCollapse:C,children:i,...M})=>{const{isExpanded:O,expandTooltip:s,collapseTooltip:r}=t.useTooltip({onCollapse:C,onExpand:q}),n=e.useRef(),w=o=>{d(o),l||(clearTimeout(n.current),s())},H=o=>{m(o),l||(clearTimeout(n.current),n.current=setTimeout(()=>{r()},300))},P=o=>{h(o),s()},R=o=>{b(o),r()},p=u.findComponent(i,c),a=u.findComponent(i,T);if(!a)throw new Error("EbayTooltip: Please use a EbayTooltipHost that defines the host of the tooltip");if(!p)throw new Error("EbayTooltip: Please use a EbayTooltipContent that defines the content of the tooltip");return e.createElement(t.Tooltip,{...M,className:E,type:"tooltip",isExpanded:O,onFocus:P,onBlur:R,onMouseEnter:w,onMouseLeave:H},e.createElement(t.TooltipHost,{...a.props}),e.createElement(t.TooltipContent,{...p.props,type:"tooltip",style:f,pointer:y}))};exports.Tooltip=t.Tooltip;exports.EbayTooltip=g;exports.EbayTooltipContent=c;exports.EbayTooltipHost=T;

package/ebay-tooltip.mjs

@@ -0,0 +1,39 @@
+import e, { useRef as R } from "react";
+import { f as p } from "./utils-BipBqkOS.mjs";
+import { u as B, T as F, a as H, b as L } from "./use-tooltip-Bibsm2rU.mjs";
+import "classnames";
+import "./icon-B_a65KUD.mjs";
+import "./array.polyfill.flat-Bj5UhY_-.mjs";
+const P = () => null, v = () => null, D = ({ className: c, pointer: u, overlayStyle: m, noHover: n, onFocus: T = () => {
+}, onBlur: f = () => {
+}, onMouseEnter: E = () => {
+}, onMouseLeave: h = () => {
+}, onExpand: y, onCollapse: d, children: s, ...b }) => {
+  const { isExpanded: w, expandTooltip: l, collapseTooltip: r } = B({ onCollapse: d, onExpand: y }), t = R(), C = (o) => {
+    E(o), n || (clearTimeout(t.current), l());
+  }, M = (o) => {
+    h(o), n || (clearTimeout(t.current), t.current = setTimeout(() => {
+      r();
+    }, 300));
+  }, O = (o) => {
+    T(o), l();
+  }, x = (o) => {
+    f(o), r();
+  }, a = p(s, P), i = p(s, v);
+  if (!i)
+    throw new Error("EbayTooltip: Please use a EbayTooltipHost that defines the host of the tooltip");
+  if (!a)
+    throw new Error("EbayTooltip: Please use a EbayTooltipContent that defines the content of the tooltip");
+  return e.createElement(
+    F,
+    { ...b, className: c, type: "tooltip", isExpanded: w, onFocus: O, onBlur: x, onMouseEnter: C, onMouseLeave: M },
+    e.createElement(H, { ...i.props }),
+    e.createElement(L, { ...a.props, type: "tooltip", style: m, pointer: u })
+  );
+};
+export {
+  D as EbayTooltip,
+  P as EbayTooltipContent,
+  v as EbayTooltipHost,
+  F as Tooltip
+};

package/ebay-tourtip.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),i=require("./utils-C9NL3q0j.js"),n=require("./use-tooltip-BavqG36Z.js"),F=require("classnames");require("./icon-DK6eEQD8.js");require("./array.polyfill.flat-5BAolFdk.js");const T=()=>null,d=()=>null,y=({index:e,children:r})=>t.createElement(t.Fragment,null,e!==void 0&&t.createElement("span",{className:"tourtip__index"},e),r),f=({as:e,children:r,className:a,...o})=>{const s=e||"h2";return t.createElement(s,{...o,className:F("tourtip__heading",a)},r)},P=({a11yCloseText:e,"aria-label":r,className:a,children:o,onCollapse:s,onExpand:b,overlayStyle:m,pointer:h,...C})=>{const p=t.useRef(),{isExpanded:u,collapseTooltip:g}=n.useTooltip({onExpand:b,onCollapse:s,initialExpanded:!0,hostRef:p}),H=t.useRef(),l=i.findComponent(o,T);if(!l)throw new Error("EbayTourtip: Please use a EbayTourtipContent that defines the content of the tourtip");const{children:q,contentProps:w}=l.props,c=i.findComponent(o,d);if(!c)throw new Error("EbayTourtip: Please use a EbayTourtipHost that defines the host of the tourtip");const R=i.findComponent(o,f),E=i.findComponent(o,y);return t.createElement(n.Tooltip,{...C,className:a,type:"tourtip",isExpanded:u,ref:H},t.createElement(n.TooltipHost,{...c.props,forwardedRef:p,"aria-label":r,"aria-expanded":u}),t.createElement(n.TooltipContent,{...w,a11yCloseText:e,onClose:g,pointer:h,showCloseButton:!0,style:m,type:"tourtip"},R,q,E&&t.createElement(n.TooltipFooter,{type:"tourtip"},E)))};exports.Tooltip=n.Tooltip;exports.EbayTourtip=P;exports.EbayTourtipContent=T;exports.EbayTourtipFooter=y;exports.EbayTourtipHeading=f;exports.EbayTourtipHost=d;

package/ebay-tourtip.mjs

@@ -0,0 +1,43 @@
+import t, { useRef as m } from "react";
+import { f as n } from "./utils-BipBqkOS.mjs";
+import { u as w, T as H, a as R, b as x, c as _ } from "./use-tooltip-Bibsm2rU.mjs";
+import F from "classnames";
+import "./icon-B_a65KUD.mjs";
+import "./array.polyfill.flat-Bj5UhY_-.mjs";
+const N = () => null, P = () => null, v = ({ index: o, children: r }) => t.createElement(
+  t.Fragment,
+  null,
+  o !== void 0 && t.createElement("span", { className: "tourtip__index" }, o),
+  r
+), B = ({ as: o, children: r, className: a, ...e }) => {
+  const s = o || "h2";
+  return t.createElement(s, { ...e, className: F("tourtip__heading", a) }, r);
+}, G = ({ a11yCloseText: o, "aria-label": r, className: a, children: e, onCollapse: s, onExpand: E, overlayStyle: f, pointer: T, ...d }) => {
+  const i = m(), { isExpanded: p, collapseTooltip: h } = w({ onExpand: E, onCollapse: s, initialExpanded: !0, hostRef: i }), y = m(), l = n(e, N);
+  if (!l)
+    throw new Error("EbayTourtip: Please use a EbayTourtipContent that defines the content of the tourtip");
+  const { children: b, contentProps: C } = l.props, c = n(e, P);
+  if (!c)
+    throw new Error("EbayTourtip: Please use a EbayTourtipHost that defines the host of the tourtip");
+  const g = n(e, B), u = n(e, v);
+  return t.createElement(
+    H,
+    { ...d, className: a, type: "tourtip", isExpanded: p, ref: y },
+    t.createElement(R, { ...c.props, forwardedRef: i, "aria-label": r, "aria-expanded": p }),
+    t.createElement(
+      x,
+      { ...C, a11yCloseText: o, onClose: h, pointer: T, showCloseButton: !0, style: f, type: "tourtip" },
+      g,
+      b,
+      u && t.createElement(_, { type: "tourtip" }, u)
+    )
+  );
+};
+export {
+  G as EbayTourtip,
+  N as EbayTourtipContent,
+  v as EbayTourtipFooter,
+  B as EbayTourtipHeading,
+  P as EbayTourtipHost,
+  H as Tooltip
+};

package/ebay-video.js

@@ -0,0 +1 @@
+"use strict";var U=Object.defineProperty;var X=(n,r,a)=>r in n?U(n,r,{enumerable:!0,configurable:!0,writable:!0,value:a}):n[r]=a;var T=(n,r,a)=>X(n,typeof r!="symbol"?r+"":r,a);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),b=require("classnames"),d=require("shaka-player/dist/shaka-player.ui"),Z=require("./utils-C9NL3q0j.js"),R=require("./icon-DK6eEQD8.js"),ee=require("./progress-spinner-CDgxI8R_.js"),te=require("react-dom/client"),w=({...n})=>e.createElement("source",{...n}),ne=7e3,re=11,V={addBigPlayButton:!1,addSeekBar:!0,controlPanelElements:["play_pause","time_and_duration","spacer","mute","report","captions","fullscreen"]},ae=({callback:n,children:r})=>e.createElement("button",{className:"video-player__report-button",ref:n},e.createElement(R.EbayIcon,{name:"flag24"}),r);function oe(n=()=>{}){const r=class extends d.ui.Element{constructor(a,u,y){super(a,u);const i=document.createElement("div"),E=()=>{const m=i.firstChild;a.appendChild(m),i.remove(),this.eventManager.listen(m,"click",n)};te.createRoot(i).render(e.createElement(ae,{callback:E},y))}};return r.Factory=class{constructor(a){T(this,"reportText");this.reportText=a}create(a,u){return new r(a,u,this.reportText)}},{Report:r}}const le=({width:n,height:r,thumbnail:a,action:u,muted:y,playView:i="inline",a11yLoadText:E,a11yPlayText:m,reportText:_,volumeSlider:A,volume:x=1,hideReportButton:I,errorText:L,onVolumeChange:F=()=>{},onLoadError:M=()=>{},onPlay:z=()=>{},onReport:$=()=>{},children:j,...D})=>{const[P,v]=e.useState(),[S,H]=e.useState(),[k,W]=e.useState(),[h,C]=e.useState(),N=e.useRef(null),l=e.useRef(null),s=e.useRef(null),p=e.useRef(null),f=Z.filterByType(j,w).map(({props:t})=>t),B=t=>{v(!0),C(!0),M(t)},g=(t=0)=>{var o;!f.length||!s.current||(v(!1),s.current.load((o=f[t])==null?void 0:o.src).then(()=>{C(!1)}).catch(c=>{switch(console.error(c),c.code){case ne:return;case re:setTimeout(()=>g(t),0);break;default:{const q=f.length>t+1&&t+1;q?setTimeout(()=>g(q),0):B(c)}}}).finally(()=>{v(!0)}))};e.useEffect(()=>{const t=l.current,o=N.current;if(!(!t||!o)&&(t.volume=x,d.polyfill.installAll(),s.current=new d.Player(t),!!s.current)){if(s.current.addEventListener("error",B),s.current.addEventListener("buffering",c=>{H(c.buffering)}),p.current=new d.ui.Overlay(s.current,o,t,_),p.current.configure({addBigPlayButton:!0,controlPanelElements:[],addSeekBar:!1}),!I){const{Report:c}=oe($);d.ui.Controls.registerElement("report",new c.Factory(_))}g(),ce(o)}},[]),e.useEffect(()=>{switch(u){case"play":l.current.play();break;case"pause":l.current.pause();break}},[u]);const Y=()=>{if(!p.current)return;const t=A?{controlPanelElements:se(V.controlPanelElements)}:{};p.current.configure({...V,...t}),l.current.controls=!1},G=t=>{t.stopPropagation(),Y(),i==="fullscreen"&&l.current.requestFullscreen(),W(!0),z(t,{player:s.current})},J=()=>{l.current.play()},K=t=>{const o=t.currentTarget;F(t,{volume:Math.round((o.volume+Number.EPSILON)*100)/100,muted:o.muted})},Q=()=>{l.current.controls=!1},O={width:n?`${n}px`:void 0,height:r?`${r}px`:void 0};return e.createElement("div",{style:O,className:b("video-player",{"video-player--poster":!k})},!k&&P&&!h&&!S&&e.createElement("div",{className:"shaka-play-button-container"},e.createElement("button",{onClick:J,className:"shaka-play-button",style:{opacity:1,zIndex:999},"aria-label":m},e.createElement(R.EbayIcon,{name:"playFilled64Colored"}))),e.createElement("div",{className:"video-player__container",ref:N},e.createElement("video",{ref:l,style:O,poster:a,muted:y||!1,onPlaying:G,onPause:Q,onVolumeChange:K,...D},f.map((t,o)=>e.createElement("source",{key:o,...t})))),e.createElement("div",{className:b("video-player__overlay",{"video-player__overlay--hidden":!h})},e.createElement(R.EbayIcon,{name:"attention64"}),e.createElement("div",{className:"video-player__overlay-text"},L)),e.createElement("div",{className:b("video-player__overlay",{"video-player__overlay--hidden":P&&(h||!S)})},e.createElement(ee.EbayProgressSpinner,{size:"large","aria-label":E})))};function se(n){const r=n.length-2>0?n.length-2:n.length,a=[...n];return a.splice(r,0,"volume"),a}function ce(n){const r=n.querySelectorAll(".shaka-spinner")[0];r&&r.setAttribute("hidden","")}exports.EbayVideo=le;exports.EbayVideoSource=w;

package/ebay-video.mjs

@@ -0,0 +1,173 @@
+var Z = Object.defineProperty;
+var ee = (t, r, n) => r in t ? Z(t, r, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[r] = n;
+var A = (t, r, n) => ee(t, typeof r != "symbol" ? r + "" : r, n);
+import o, { useState as f, useRef as y, useEffect as V } from "react";
+import R from "classnames";
+import E, { ui as te } from "shaka-player/dist/shaka-player.ui";
+import { b as re } from "./utils-BipBqkOS.mjs";
+import { E as P } from "./icon-B_a65KUD.mjs";
+import { E as ne } from "./progress-spinner-BugUcF5c.mjs";
+import { createRoot as oe } from "react-dom/client";
+const ae = ({ ...t }) => o.createElement("source", { ...t }), le = 7e3, se = 11, L = {
+  addBigPlayButton: !1,
+  addSeekBar: !0,
+  controlPanelElements: [
+    "play_pause",
+    "time_and_duration",
+    "spacer",
+    "mute",
+    "report",
+    "captions",
+    // 'quality', // uncomment this to show a gear icon for video quality control
+    "fullscreen"
+  ]
+}, ce = ({ callback: t, children: r }) => o.createElement(
+  "button",
+  { className: "video-player__report-button", ref: t },
+  o.createElement(P, { name: "flag24" }),
+  r
+);
+function ie(t = () => {
+}) {
+  const r = class extends te.Element {
+    constructor(n, i, v) {
+      super(n, i);
+      const u = document.createElement("div"), h = () => {
+        const d = u.firstChild;
+        n.appendChild(d), u.remove(), this.eventManager.listen(d, "click", t);
+      };
+      oe(u).render(o.createElement(ce, { callback: h }, v));
+    }
+  };
+  return r.Factory = class {
+    constructor(n) {
+      A(this, "reportText");
+      this.reportText = n;
+    }
+    create(n, i) {
+      return new r(n, i, this.reportText);
+    }
+  }, { Report: r };
+}
+const be = ({ width: t, height: r, thumbnail: n, action: i, muted: v, playView: u = "inline", a11yLoadText: h, a11yPlayText: d, reportText: k, volumeSlider: F, volume: I = 1, hideReportButton: q, errorText: z, onVolumeChange: M = () => {
+}, onLoadError: $ = () => {
+}, onPlay: D = () => {
+}, onReport: H = () => {
+}, children: W, ...Y }) => {
+  const [C, g] = f(), [N, j] = f(), [B, G] = f(), [b, S] = f(), O = y(null), l = y(null), s = y(null), m = y(null), p = re(W, ae).map(({ props: e }) => e), w = (e) => {
+    g(!0), S(!0), $(e);
+  }, _ = (e = 0) => {
+    var a;
+    !p.length || !s.current || (g(!1), s.current.load((a = p[e]) == null ? void 0 : a.src).then(() => {
+      S(!1);
+    }).catch((c) => {
+      switch (console.error(c), c.code) {
+        case le:
+          return;
+        case se:
+          setTimeout(() => _(e), 0);
+          break;
+        default: {
+          const x = p.length > e + 1 && e + 1;
+          x ? setTimeout(() => _(x), 0) : w(c);
+        }
+      }
+    }).finally(() => {
+      g(!0);
+    }));
+  };
+  V(() => {
+    const e = l.current, a = O.current;
+    if (!(!e || !a) && (e.volume = I, E.polyfill.installAll(), s.current = new E.Player(e), !!s.current)) {
+      if (s.current.addEventListener("error", w), s.current.addEventListener("buffering", (c) => {
+        j(c.buffering);
+      }), m.current = new E.ui.Overlay(s.current, a, e, k), m.current.configure({
+        addBigPlayButton: !0,
+        controlPanelElements: [],
+        addSeekBar: !1
+      }), !q) {
+        const { Report: c } = ie(H);
+        E.ui.Controls.registerElement("report", new c.Factory(k));
+      }
+      _(), de(a);
+    }
+  }, []), V(() => {
+    switch (i) {
+      case "play":
+        l.current.play();
+        break;
+      case "pause":
+        l.current.pause();
+        break;
+    }
+  }, [i]);
+  const J = () => {
+    if (!m.current)
+      return;
+    const e = F ? {
+      controlPanelElements: ue(L.controlPanelElements)
+    } : {};
+    m.current.configure({
+      ...L,
+      ...e
+    }), l.current.controls = !1;
+  }, K = (e) => {
+    e.stopPropagation(), J(), u === "fullscreen" && l.current.requestFullscreen(), G(!0), D(e, { player: s.current });
+  }, Q = () => {
+    l.current.play();
+  }, U = (e) => {
+    const a = e.currentTarget;
+    M(e, {
+      volume: Math.round((a.volume + Number.EPSILON) * 100) / 100,
+      muted: a.muted
+    });
+  }, X = () => {
+    l.current.controls = !1;
+  }, T = {
+    width: t ? `${t}px` : void 0,
+    height: r ? `${r}px` : void 0
+  };
+  return o.createElement(
+    "div",
+    { style: T, className: R("video-player", { "video-player--poster": !B }) },
+    !B && C && !b && !N && o.createElement(
+      "div",
+      { className: "shaka-play-button-container" },
+      o.createElement(
+        "button",
+        { onClick: Q, className: "shaka-play-button", style: { opacity: 1, zIndex: 999 }, "aria-label": d },
+        o.createElement(P, { name: "playFilled64Colored" })
+      )
+    ),
+    o.createElement(
+      "div",
+      { className: "video-player__container", ref: O },
+      o.createElement("video", { ref: l, style: T, poster: n, muted: v || !1, onPlaying: K, onPause: X, onVolumeChange: U, ...Y }, p.map((e, a) => o.createElement("source", { key: a, ...e })))
+    ),
+    o.createElement(
+      "div",
+      { className: R("video-player__overlay", { "video-player__overlay--hidden": !b }) },
+      o.createElement(P, { name: "attention64" }),
+      o.createElement("div", { className: "video-player__overlay-text" }, z)
+    ),
+    o.createElement(
+      "div",
+      { className: R("video-player__overlay", {
+        "video-player__overlay--hidden": C && (b || !N)
+      }) },
+      o.createElement(ne, { size: "large", "aria-label": h })
+    )
+  );
+};
+function ue(t) {
+  const r = t.length - 2 > 0 ? t.length - 2 : t.length, n = [...t];
+  return n.splice(r, 0, "volume"), n;
+}
+function de(t) {
+  const r = t.querySelectorAll(".shaka-spinner")[0];
+  r && r.setAttribute("hidden", "");
+}
+export {
+  be as EbayVideo,
+  ae as EbayVideoSource
+};

package/hooks-Ctier7Yv.js

@@ -0,0 +1 @@
+"use strict";const o=require("react"),N=require("classnames"),n="floating-label__label",T=["rgb(245, 245, 245)","rgb(247, 247, 247)"],v=t=>t&&!T.includes(getComputedStyle(t).backgroundColor),g=t=>{var a;return((a=t==null?void 0:t.value)==null?void 0:a.length)>0},p=t=>(t==null?void 0:t.tagName)==="SELECT",f=(t,a)=>{if(p(t)&&!g(t.querySelector("option"))){t.style["min-width"]="";const l=t.offsetWidth;t.querySelector("option").text=a,!a&&l>t.offsetWidth&&(t.style["min-width"]=`${l}px`)}},G=t=>p(t)?t.querySelector("option").text:t==null?void 0:t.placeholder;function I({ref:t,inputId:a,className:l,disabled:q,label:c,inputSize:y,inputValue:d,placeholder:b,invalid:R,opaqueLabel:$,type:m,onMount:B=()=>{}}){const L=o.useRef(null),s=()=>t||L,[F,u]=o.useState(!!d),[k,h]=o.useState(!1),[i,C]=o.useState(!1),E=o.useRef(""),A=()=>{var e;h(!0),u(g((e=s())==null?void 0:e.current)),C(!1),f(s().current,"")},P=()=>{var e;h(!0),u(!0),C(!0),f((e=s())==null?void 0:e.current,E.current)};o.useEffect(()=>{var e,r;c&&(E.current=G((e=s())==null?void 0:e.current),f((r=s())==null?void 0:r.current,""),B())},[]),o.useEffect(()=>{var e,r,x;c&&u(i||g((e=s())==null?void 0:e.current)||v((x=(r=s())==null?void 0:r.current)==null?void 0:x.parentNode))},[i,d]);const W=N(l,n,{[`${n}--disabled`]:q,[`${n}--animate`]:k,[`${n}--inline`]:!F&&m!=="date",[`${n}--focus`]:i,[`${n}--invalid`]:R}),S=N("floating-label",{"floating-label--large":y==="large","floating-label--opaque":$}),_=o.useCallback(({children:e})=>o.createElement(o.Fragment,null,e),[]),w=o.useCallback(({children:e})=>o.createElement("span",{className:S},e),[S]);return c?{label:o.createElement("label",{htmlFor:a,className:W},c),Container:w,onBlur:A,onFocus:P,ref:s(),placeholder:F?b:null}:{label:null,Container:_,onBlur:()=>{},onFocus:()=>{},ref:s(),placeholder:b}}exports.useFloatingLabel=I;

package/hooks-r29zhPsY.mjs

@@ -0,0 +1,63 @@
+import c, { useRef as N, useState as f, useEffect as S, useCallback as y } from "react";
+import $ from "classnames";
+const n = "floating-label__label", O = [
+  "rgb(245, 245, 245)",
+  "rgb(247, 247, 247)"
+  // From skin version 12.6.0
+], j = (t) => t && !O.includes(getComputedStyle(t).backgroundColor), g = (t) => {
+  var r;
+  return ((r = t == null ? void 0 : t.value) == null ? void 0 : r.length) > 0;
+}, B = (t) => (t == null ? void 0 : t.tagName) === "SELECT", d = (t, r) => {
+  if (B(t) && !g(t.querySelector("option"))) {
+    t.style["min-width"] = "";
+    const l = t.offsetWidth;
+    t.querySelector("option").text = r, !r && l > t.offsetWidth && (t.style["min-width"] = `${l}px`);
+  }
+}, z = (t) => B(t) ? t.querySelector("option").text : t == null ? void 0 : t.placeholder;
+function K({ ref: t, inputId: r, className: l, disabled: R, label: s, inputSize: q, inputValue: b, placeholder: h, invalid: L, opaqueLabel: k, type: A, onMount: P = () => {
+} }) {
+  const W = N(null), o = () => t || W, [F, i] = f(!!b), [_, C] = f(!1), [u, m] = f(!1), p = N(""), w = () => {
+    var e;
+    C(!0), i(g((e = o()) == null ? void 0 : e.current)), m(!1), d(o().current, "");
+  }, T = () => {
+    var e;
+    C(!0), i(!0), m(!0), d((e = o()) == null ? void 0 : e.current, p.current);
+  };
+  S(() => {
+    var e, a;
+    s && (p.current = z((e = o()) == null ? void 0 : e.current), d((a = o()) == null ? void 0 : a.current, ""), P());
+  }, []), S(() => {
+    var e, a, x;
+    s && i(u || g((e = o()) == null ? void 0 : e.current) || j((x = (a = o()) == null ? void 0 : a.current) == null ? void 0 : x.parentNode));
+  }, [u, b]);
+  const v = $(l, n, {
+    [`${n}--disabled`]: R,
+    [`${n}--animate`]: _,
+    [`${n}--inline`]: !F && A !== "date",
+    [`${n}--focus`]: u,
+    [`${n}--invalid`]: L
+  }), E = $("floating-label", {
+    "floating-label--large": q === "large",
+    "floating-label--opaque": k
+  }), G = y(({ children: e }) => c.createElement(c.Fragment, null, e), []), I = y(({ children: e }) => c.createElement("span", { className: E }, e), [E]);
+  return s ? {
+    label: c.createElement("label", { htmlFor: r, className: v }, s),
+    Container: I,
+    onBlur: w,
+    onFocus: T,
+    ref: o(),
+    placeholder: F ? h : null
+  } : {
+    label: null,
+    Container: G,
+    onBlur: () => {
+    },
+    onFocus: () => {
+    },
+    ref: o(),
+    placeholder: h
+  };
+}
+export {
+  K as u
+};

package/icon-B_a65KUD.mjs

@@ -0,0 +1,42 @@
+import o, { forwardRef as g, useState as p, useEffect as w } from "react";
+import I from "classnames";
+import "./array.polyfill.flat-Bj5UhY_-.mjs";
+const E = (n) => n.displayName || n.name || "Component", h = (n) => {
+  const e = g((t, a) => o.createElement(n, { ...t, forwardedRef: a }));
+  return e.displayName = E(n), e;
+}, $ = () => Math.random().toString(16).slice(-4), y = ({ name: n, className: e, noSkinClasses: t = !1, a11yText: a, a11yVariant: c, forwardedRef: l, ...d }) => {
+  const [m, f] = p("");
+  w(() => {
+    f($());
+  }, []);
+  const s = c === "label", i = a && `icon-title-${m}`, u = a ? {
+    "aria-labelledby": s ? void 0 : i,
+    "aria-label": s ? a : void 0,
+    role: "img"
+  } : {
+    "aria-hidden": !0
+  }, r = v(n), N = ["icon", `icon--${R(r) || r}`, k(r)].filter(Boolean).join(" "), b = I(e, { [N]: !t });
+  return o.createElement(
+    "svg",
+    { ...d, className: b, xmlns: "http://www.w3.org/2000/svg", focusable: !1, ref: l, ...u },
+    a && !s && o.createElement("title", { id: i }, a),
+    o.createElement("use", { xlinkHref: `#icon-${r}` })
+  );
+};
+function R(n) {
+  const e = n.split("-"), t = e[e.length - 1];
+  return t === "colored" ? e[e.length - 2] : isNaN(Number(t)) ? "" : t;
+}
+function k(n) {
+  const e = n.split("-"), t = e.indexOf("filled");
+  return t === -1 ? "" : `icon--${e.slice(0, t + 1).join("-")}`;
+}
+function v(n) {
+  return n.replace(/([0-9]+)/g, (e, t) => `-${t}`).replace(/([A-Z])/g, (e, t) => `-${t.toLowerCase()}`);
+}
+const j = h(y);
+export {
+  j as E,
+  $ as r,
+  h as w
+};

package/icon-DK6eEQD8.js

@@ -0,0 +1 @@
+"use strict";const a=require("react"),I=require("classnames");require("./array.polyfill.flat-5BAolFdk.js");const h=t=>t.displayName||t.name||"Component",c=t=>{const e=a.forwardRef((n,r)=>a.createElement(t,{...n,forwardedRef:r}));return e.displayName=h(t),e},l=()=>Math.random().toString(16).slice(-4),p=({name:t,className:e,noSkinClasses:n=!1,a11yText:r,a11yVariant:d,forwardedRef:f,...m})=>{const[u,b]=a.useState("");a.useEffect(()=>{b(l())},[]);const o=d==="label",i=r&&`icon-title-${u}`,N=r?{"aria-labelledby":o?void 0:i,"aria-label":o?r:void 0,role:"img"}:{"aria-hidden":!0},s=R(t),w=["icon",`icon--${E(s)||s}`,y(s)].filter(Boolean).join(" "),g=I(e,{[w]:!n});return a.createElement("svg",{...m,className:g,xmlns:"http://www.w3.org/2000/svg",focusable:!1,ref:f,...N},r&&!o&&a.createElement("title",{id:i},r),a.createElement("use",{xlinkHref:`#icon-${s}`}))};function E(t){const e=t.split("-"),n=e[e.length-1];return n==="colored"?e[e.length-2]:isNaN(Number(n))?"":n}function y(t){const e=t.split("-"),n=e.indexOf("filled");return n===-1?"":`icon--${e.slice(0,n+1).join("-")}`}function R(t){return t.replace(/([0-9]+)/g,(e,n)=>`-${n}`).replace(/([A-Z])/g,(e,n)=>`-${n.toLowerCase()}`)}const $=c(p);exports.EbayIcon=$;exports.randomId=l;exports.withForwardRef=c;

package/icon-button-BB6GFLm7.js

@@ -0,0 +1 @@
+"use strict";const e=require("react"),p=require("classnames"),y=require("./icon-DK6eEQD8.js"),w=require("./badge-CoHKfiPt.js");require("./array.polyfill.flat-5BAolFdk.js");const B=({href:c,icon:E,badgeNumber:a,badgeAriaLabel:m,transparent:b,className:q,forwardedRef:o,size:r,onEscape:$=()=>{},onKeyDown:k=()=>{},...s})=>{const n=c?"icon-link":"icon-btn",i=p(q,n,r&&`${n}--${r}`,{[`${n}--badged`]:a,[`${n}--transparent`]:b}),l=e.createElement(e.Fragment,null,e.createElement(y.EbayIcon,{name:E}),a&&e.createElement(w.EbayBadge,{type:"icon",number:a,"aria-label":m})),u=t=>{(t.key==="Escape"||t.key==="Esc")&&$(t),k(t)};return c?e.createElement("a",{ref:o,className:i,href:c,onKeyDown:u,...s},l):e.createElement("button",{ref:o,type:"button",className:i,onKeyDown:u,...s},l)},I=y.withForwardRef(B);exports.EbayIconButton=I;

package/icon-button-Dy8rjzH7.mjs

@@ -0,0 +1,24 @@
+import t from "react";
+import w from "classnames";
+import { w as $, E as k } from "./icon-B_a65KUD.mjs";
+import { E as B } from "./badge-BX5HuO-3.mjs";
+import "./array.polyfill.flat-Bj5UhY_-.mjs";
+const D = ({ href: a, icon: i, badgeNumber: o, badgeAriaLabel: y, transparent: p, className: b, forwardedRef: c, size: r, onEscape: f = () => {
+}, onKeyDown: u = () => {
+}, ...s }) => {
+  const n = a ? "icon-link" : "icon-btn", m = w(b, n, r && `${n}--${r}`, {
+    [`${n}--badged`]: o,
+    [`${n}--transparent`]: p
+  }), l = t.createElement(
+    t.Fragment,
+    null,
+    t.createElement(k, { name: i }),
+    o && t.createElement(B, { type: "icon", number: o, "aria-label": y })
+  ), E = (e) => {
+    (e.key === "Escape" || e.key === "Esc") && f(e), u(e);
+  };
+  return a ? t.createElement("a", { ref: c, className: m, href: a, onKeyDown: E, ...s }, l) : t.createElement("button", { ref: c, type: "button", className: m, onKeyDown: E, ...s }, l);
+}, g = $(D);
+export {
+  g as E
+};

package/index-B5oC9Rl1.mjs

@@ -0,0 +1,22 @@
+function i(n, e, t = () => {
+}) {
+  n.includes(e.key) && t();
+}
+function c(n, e) {
+  o(n.key) && e();
+}
+function o(n) {
+  return [" ", "Enter"].includes(n);
+}
+function a(n, e) {
+  i(["Esc", "Escape"], n, e);
+}
+function s(n, e) {
+  i(["Left", "ArrowLeft", "Right", "ArrowRight"], n, e);
+}
+export {
+  s as a,
+  a as b,
+  c as h,
+  o as i
+};

package/index-DbjwTbDP.js

@@ -0,0 +1 @@
+"use strict";function t(n,e,o=()=>{}){n.includes(e.key)&&o()}function c(n,e){i(n.key)&&e()}function i(n){return[" ","Enter"].includes(n)}function d(n,e){t(["Esc","Escape"],n,e)}function r(n,e){t(["Left","ArrowLeft","Right","ArrowRight"],n,e)}exports.handleActionKeydown=c;exports.handleEscapeKeydown=d;exports.handleLeftRightArrowsKeydown=r;exports.isActionKey=i;

package/label-CnrpYJ-g.js

@@ -0,0 +1 @@
+"use strict";const e=require("react"),d=require("classnames"),i=({className:l,children:a,stacked:s=!1,required:t=!1,position:r="start",...n})=>{const c=d("field__label",l,{"field__label--stacked":s},{"field__label--end":r==="end"}),u=t?e.createElement(e.Fragment,null," ",e.createElement("sup",null,"*")):null;return e.createElement("label",{className:c,...n},a,u)};exports.Label=i;

package/label-DgOo6Mql.mjs

@@ -0,0 +1,19 @@
+import e from "react";
+import o from "classnames";
+const i = ({ className: l, children: a, stacked: t = !1, required: r = !1, position: s = "start", ...n }) => {
+  const m = o("field__label", l, { "field__label--stacked": t }, { "field__label--end": s === "end" }), c = r ? e.createElement(
+    e.Fragment,
+    null,
+    " ",
+    e.createElement("sup", null, "*")
+  ) : null;
+  return e.createElement(
+    "label",
+    { className: m, ...n },
+    a,
+    c
+  );
+};
+export {
+  i as L
+};