@real-life-talent-tree/widget 1.0.0 → 1.0.1

package/dist/talent-tree.iife.js

@@ -307,7 +307,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,o,f,m,f),le[f+o]=!0)}if(f=null,i!==void 0&&(r(i),f=``+i),s(n)&&(r(n.key),f=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return f&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,f,i,a(),l,d)}function p(e){m(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===ie&&(e._payload.status===`fulfilled`?m(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function m(e){return typeof e==`object`&&!!e&&e.$$typeof===g}var h=d(),g=Symbol.for(`react.transitional.element`),_=Symbol.for(`react.portal`),v=Symbol.for(`react.fragment`),y=Symbol.for(`react.strict_mode`),b=Symbol.for(`react.profiler`),x=Symbol.for(`react.consumer`),S=Symbol.for(`react.context`),ee=Symbol.for(`react.forward_ref`),te=Symbol.for(`react.suspense`),ne=Symbol.for(`react.suspense_list`),re=Symbol.for(`react.memo`),ie=Symbol.for(`react.lazy`),C=Symbol.for(`react.activity`),ae=Symbol.for(`react.client.reference`),w=h.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,oe=Object.prototype.hasOwnProperty,se=Array.isArray,T=console.createTask?console.createTask:function(){return null};h={react_stack_bottom_frame:function(e){return e()}};var E,ce={},D=h.react_stack_bottom_frame.bind(h,o)(),O=T(i(o)),le={};e.Fragment=v,e.jsx=function(e,t,n){var r=1e4>w.recentlyCreatedOwnerStacks++;return f(e,t,n,!1,r?Error(`react-stack-top-frame`):D,r?T(i(e)):O)},e.jsxs=function(e,t,n){var r=1e4>w.recentlyCreatedOwnerStacks++;return f(e,t,n,!0,r?Error(`react-stack-top-frame`):D,r?T(i(e)):O)}})()})),L=o(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=Mo():t.exports=No()}))(),Po={level1:Do[1],level2:Do[2],level3:Do[3],level4:Do[4],level5:Do[5],nodeBg:`transparent`,nodeRadius:`8px`,pipEmpty:`#555a6e`,textPrimary:`#5c3317`,textSecondary:`#3a2010`,popupBg:`#fdf6ec`,overlayBg:`rgba(26, 31, 46, 0.6)`};function Fo({level:e,talentName:t}){return(0,L.jsx)(`div`,{className:`talentPips`,"data-tooltip":`${e}/5`,"aria-label":`${t} level ${e}`,children:Array.from({length:5},(t,n)=>n<e?(0,L.jsx)(`div`,{className:`talentPip`,style:{background:`var(--tt-level-${e})`}},n):(0,L.jsx)(`div`,{className:`talentPip talentPipEmpty`},n))})}function Io(){return(0,L.jsx)(`div`,{className:`talentConnector`})}function Lo({name:e,level:t,icon:n,description:r,onClose:i,offset:a=null}){let o=a===null?void 0:{position:`absolute`,top:a,left:`50%`,transform:`translateX(-50%)`,width:`90%`};return(0,L.jsx)(`div`,{className:`talentPopupOverlay`,onClick:i,children:(0,L.jsxs)(`div`,{className:`talentPopup`,style:{borderColor:`var(--tt-level-${t})`,...o},onClick:e=>e.stopPropagation(),children:[(0,L.jsx)(`button`,{className:`talentPopupClose`,onClick:i,"aria-label":`Close`,children:`✕`}),(0,L.jsxs)(`div`,{className:`talentPopupHeader`,children:[n,(0,L.jsx)(`span`,{className:`talentPopupName`,children:e})]}),(0,L.jsxs)(`div`,{className:`talentPopupPips`,children:[(0,L.jsx)(Fo,{level:t,talentName:e}),(0,L.jsxs)(`span`,{className:`talentPopupLevel`,children:[t,`/5`]})]}),(0,L.jsx)(`p`,{className:`talentPopupDesc`,children:r})]})})}function Ro({level:e,iconSrc:t,name:n,showName:r=!0,size:i=`md`,onClick:a}){let[o,s]=(0,wo.useState)(void 0),c=o!==void 0&&o===t,l=[`talentNode`,i,a?`clickable`:``].filter(Boolean).join(` `);return(0,L.jsxs)(L.Fragment,{children:[r&&(0,L.jsx)(`div`,{className:`talentName`,children:n}),(0,L.jsx)(`div`,{className:l,style:{border:`2px solid var(--tt-level-${e})`,boxShadow:e>=4?`0 0 8px color-mix(in srgb, var(--tt-level-${e}) 53%, transparent)`:`none`},onClick:a,children:t&&!c?(0,L.jsx)(`img`,{src:t,alt:n,className:`talentIcon`,onError:()=>s(t)}):(0,L.jsx)(`span`,{className:`talentIconFallback`,"aria-hidden":`true`,children:n.charAt(0).toUpperCase()})})]})}function zo({path:e,onTalentClick:t}){return(0,L.jsxs)(`div`,{className:`talentPath`,children:[(0,L.jsx)(`div`,{className:`talentPathTitle`,children:e.name}),e.talents.map((n,r)=>{let i=e.talents[r+1];return(0,L.jsxs)(`div`,{className:`talentEntry`,children:[(0,L.jsx)(Ro,{level:n.level,iconSrc:n.iconUrl??void 0,name:n.name,onClick:t?e=>t(n,e):void 0}),(0,L.jsx)(Fo,{level:n.level,talentName:n.name}),i&&(0,L.jsx)(Io,{})]},n.id)})]})}function Bo({tree:e,hint:t=`💬 Click on a talent to learn more`}){let[n,r]=(0,wo.useState)(null),[i,a]=(0,wo.useState)(null),o=(0,wo.useRef)(null),s=(e,t)=>{if(n?.id===e.id){r(null),a(null);return}if(r(e),window.innerWidth<=465&&o.current){let e=t.currentTarget.getBoundingClientRect(),n=o.current.getBoundingClientRect();a(e.bottom-n.top+8)}else a(null)};return(0,L.jsxs)(`div`,{ref:o,className:`talentTree`,children:[t&&(0,L.jsx)(`button`,{className:`talentHintBtn`,"data-hint":t,"aria-label":t,tabIndex:-1,children:`i`}),(0,L.jsx)(`div`,{className:`talentPaths`,children:e.paths.map(e=>(0,L.jsx)(zo,{path:e,onTalentClick:s},e.id))}),n&&(0,L.jsx)(Lo,{name:n.name,level:n.level,icon:(0,L.jsx)(Ro,{level:n.level,iconSrc:n.iconUrl??void 0,name:n.name,showName:!1,size:`sm`}),description:n.description??``,onClose:()=>{r(null),a(null)},offset:i})]})}var Vo=`.talentPips{cursor:default;gap:3px;margin-top:5px;display:flex;position:relative}.talentPips:after{content:attr(data-tooltip);color:#fff;white-space:nowrap;pointer-events:none;opacity:0;z-index:10;background:#333;border-radius:4px;padding:3px 7px;font-size:.75rem;transition:opacity .2s;position:absolute;top:50%;left:110%;transform:translateY(-50%)}.talentPips:hover:after{opacity:1}.talentPip{border:1px solid var(--tt-pip-empty);border-radius:50%;width:6px;height:6px}.talentPipEmpty{background:0 0}.talentConnector{background:#d4d4d4;border:1px solid #00000073;border-radius:2px;width:4px;height:13px;margin-top:5px;margin-bottom:8px}.talentPopupOverlay{background:var(--tt-overlay-bg);z-index:20;pointer-events:auto;border-radius:25px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.talentPopup{background:var(--tt-popup-bg);pointer-events:auto;border:2px solid;border-radius:12px;width:72%;padding:14px 16px;position:relative;box-shadow:0 4px 20px #00000059}.talentPopupClose{color:var(--tt-text-primary);cursor:pointer;background:0 0;border:none;padding:0;font-size:1rem;line-height:1;position:absolute;top:8px;right:10px}.talentPopupClose:hover{color:#000}.talentPopupHeader{align-items:center;gap:10px;margin-bottom:4px;display:flex}.talentPopupName{color:#1a1f2e;overflow-wrap:break-word;min-width:0;font-size:.95rem;font-weight:700}.talentPopupPips{align-items:center;margin-top:8px;display:flex}.talentPopupLevel{color:var(--tt-text-primary);align-self:center;margin-left:6px;font-size:.7rem}.talentPopupDesc{color:var(--tt-text-secondary);text-align:left;overflow-wrap:break-word;margin:8px 0 4px;font-size:.78rem;line-height:1.5}@media (width<=950px){.talentPopupOverlay{border-radius:0}}.talentNode{border-radius:var(--tt-node-radius);background:var(--tt-node-bg);flex-shrink:0;justify-content:center;align-items:center;display:flex;overflow:hidden}.talentNode.clickable{cursor:pointer}.talentNode.md{width:46px;height:46px}.talentNode.sm{width:40px;height:40px}.talentIcon{object-fit:contain;width:100%;height:100%;display:block}.talentIconFallback{-webkit-user-select:none;user-select:none;font-size:1.1rem;line-height:1}.talentName{color:var(--tt-text-primary);text-align:center;overflow-wrap:break-word;max-width:70px;font-size:.6rem;line-height:1.2}.talentPath{flex-direction:column;flex:1 1 0;align-items:center;gap:0;min-width:80px;max-width:120px;display:flex}.talentPathTitle{color:var(--tt-text-secondary);text-align:center;letter-spacing:.03em;word-break:break-word;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;margin-bottom:10px;padding:0 4px;font-size:.75rem;font-weight:600}.talentEntry{flex-direction:column;align-items:center;gap:4px;display:flex}.talentTree{padding:24px;position:relative}.talentHintBtn{width:20px;height:20px;color:var(--tt-text-secondary);cursor:default;opacity:.55;background:0 0;border:1.5px solid;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:.65rem;font-weight:700;line-height:1;transition:opacity .15s;display:flex;position:absolute;top:10px;right:10px}.talentHintBtn:hover{opacity:1}.talentHintBtn:after{content:attr(data-hint);white-space:nowrap;color:var(--tt-text-secondary);background:var(--tt-popup-bg);border:1px solid color-mix(in srgb, var(--tt-text-secondary) 20%, transparent);pointer-events:none;opacity:0;border-radius:6px;padding:4px 8px;font-size:.65rem;font-weight:400;transition:opacity .15s;position:absolute;top:50%;right:calc(100% + 8px);transform:translateY(-50%);box-shadow:0 2px 8px #00000014}.talentHintBtn:hover:after{opacity:1}.talentPaths{flex-wrap:wrap;justify-content:center;gap:24px;display:flex}`;function Ho(e){return{id:e.id,ownerId:e.ownerId,slug:e.slug,title:e.title,isPublic:e.isPublic,theme:e.theme??{},paths:(e.paths??[]).map(e=>({id:e.id,name:e.name,displayOrder:e.displayOrder,talents:(e.talents??[]).map(e=>({id:e.id,name:e.name,level:e.level,iconUrl:e.iconUrl,description:e.description,displayOrder:e.displayOrder}))})),publishedAt:e.publishedAt?new Date(e.publishedAt):void 0,createdAt:new Date(e.createdAt),updatedAt:new Date(e.updatedAt)}}function Uo({username:e,slug:t,tree:n}){let r=!n&&e&&t?`${e}/${t}`:null,[i,a]=(0,wo.useState)(null);return(0,wo.useEffect)(()=>{if(!r||!e||!t)return;let n=!1;return fetch(`http://localhost:3002/api/v1/public/${encodeURIComponent(e)}/${encodeURIComponent(t)}`).then(e=>{if(!e.ok)throw Error(`not found`);return e.json()}).then(({data:e})=>{n||a({key:r,status:`ready`,tree:Ho(e)})}).catch(()=>{n||a({key:r,status:`error`})}),()=>{n=!0}},[r,e,t]),n?(0,L.jsx)(Bo,{tree:n}):r?i?.key===r?i.status===`error`?(0,L.jsx)(`span`,{children:`Tree not found.`}):(0,L.jsx)(Bo,{tree:i.tree}):(0,L.jsx)(`span`,{children:`Loading…`}):null}function Wo(){return`:host {
+  <%s key={someKey} {...props} />`,o,f,m,f),le[f+o]=!0)}if(f=null,i!==void 0&&(r(i),f=``+i),s(n)&&(r(n.key),f=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return f&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,f,i,a(),l,d)}function p(e){m(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===ie&&(e._payload.status===`fulfilled`?m(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function m(e){return typeof e==`object`&&!!e&&e.$$typeof===g}var h=d(),g=Symbol.for(`react.transitional.element`),_=Symbol.for(`react.portal`),v=Symbol.for(`react.fragment`),y=Symbol.for(`react.strict_mode`),b=Symbol.for(`react.profiler`),x=Symbol.for(`react.consumer`),S=Symbol.for(`react.context`),ee=Symbol.for(`react.forward_ref`),te=Symbol.for(`react.suspense`),ne=Symbol.for(`react.suspense_list`),re=Symbol.for(`react.memo`),ie=Symbol.for(`react.lazy`),C=Symbol.for(`react.activity`),ae=Symbol.for(`react.client.reference`),w=h.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,oe=Object.prototype.hasOwnProperty,se=Array.isArray,T=console.createTask?console.createTask:function(){return null};h={react_stack_bottom_frame:function(e){return e()}};var E,ce={},D=h.react_stack_bottom_frame.bind(h,o)(),O=T(i(o)),le={};e.Fragment=v,e.jsx=function(e,t,n){var r=1e4>w.recentlyCreatedOwnerStacks++;return f(e,t,n,!1,r?Error(`react-stack-top-frame`):D,r?T(i(e)):O)},e.jsxs=function(e,t,n){var r=1e4>w.recentlyCreatedOwnerStacks++;return f(e,t,n,!0,r?Error(`react-stack-top-frame`):D,r?T(i(e)):O)}})()})),L=o(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=Mo():t.exports=No()}))(),Po={level1:Do[1],level2:Do[2],level3:Do[3],level4:Do[4],level5:Do[5],nodeBg:`transparent`,nodeRadius:`8px`,pipEmpty:`#555a6e`,textPrimary:`#5c3317`,textSecondary:`#3a2010`,popupBg:`#fdf6ec`,overlayBg:`rgba(26, 31, 46, 0.6)`};function Fo({level:e,talentName:t}){return(0,L.jsx)(`div`,{className:`talentPips`,"data-tooltip":`${e}/5`,"aria-label":`${t} level ${e}`,children:Array.from({length:5},(t,n)=>n<e?(0,L.jsx)(`div`,{className:`talentPip`,style:{background:`var(--tt-level-${e})`}},n):(0,L.jsx)(`div`,{className:`talentPip talentPipEmpty`},n))})}function Io(){return(0,L.jsx)(`div`,{className:`talentConnector`})}function Lo({name:e,level:t,icon:n,description:r,onClose:i,offset:a=null}){let o=a===null?void 0:{position:`absolute`,top:a,left:`50%`,transform:`translateX(-50%)`,width:`90%`};return(0,L.jsx)(`div`,{className:`talentPopupOverlay`,onClick:i,children:(0,L.jsxs)(`div`,{className:`talentPopup`,style:{borderColor:`var(--tt-level-${t})`,...o},onClick:e=>e.stopPropagation(),children:[(0,L.jsx)(`button`,{className:`talentPopupClose`,onClick:i,"aria-label":`Close`,children:`✕`}),(0,L.jsxs)(`div`,{className:`talentPopupHeader`,children:[n,(0,L.jsx)(`span`,{className:`talentPopupName`,children:e})]}),(0,L.jsxs)(`div`,{className:`talentPopupPips`,children:[(0,L.jsx)(Fo,{level:t,talentName:e}),(0,L.jsxs)(`span`,{className:`talentPopupLevel`,children:[t,`/5`]})]}),(0,L.jsx)(`p`,{className:`talentPopupDesc`,children:r})]})})}function Ro({level:e,iconSrc:t,name:n,showName:r=!0,size:i=`md`,onClick:a}){let[o,s]=(0,wo.useState)(void 0),c=o!==void 0&&o===t,l=[`talentNode`,i,a?`clickable`:``].filter(Boolean).join(` `);return(0,L.jsxs)(L.Fragment,{children:[r&&(0,L.jsx)(`div`,{className:`talentName`,children:n}),(0,L.jsx)(`div`,{className:l,style:{border:`2px solid var(--tt-level-${e})`,boxShadow:e>=4?`0 0 8px color-mix(in srgb, var(--tt-level-${e}) 53%, transparent)`:`none`},onClick:a,children:t&&!c?(0,L.jsx)(`img`,{src:t,alt:n,className:`talentIcon`,onError:()=>s(t)}):(0,L.jsx)(`span`,{className:`talentIconFallback`,"aria-hidden":`true`,children:n.charAt(0).toUpperCase()})})]})}function zo({path:e,onTalentClick:t}){return(0,L.jsxs)(`div`,{className:`talentPath`,children:[(0,L.jsx)(`div`,{className:`talentPathTitle`,children:e.name}),e.talents.map((n,r)=>{let i=e.talents[r+1];return(0,L.jsxs)(`div`,{className:`talentEntry`,children:[(0,L.jsx)(Ro,{level:n.level,iconSrc:n.iconUrl??void 0,name:n.name,onClick:t?e=>t(n,e):void 0}),(0,L.jsx)(Fo,{level:n.level,talentName:n.name}),i&&(0,L.jsx)(Io,{})]},n.id)})]})}function Bo({tree:e,hint:t=`💬 Click on a talent to learn more`}){let[n,r]=(0,wo.useState)(null),[i,a]=(0,wo.useState)(null),o=(0,wo.useRef)(null),s=(e,t)=>{if(n?.id===e.id){r(null),a(null);return}if(r(e),window.innerWidth<=465&&o.current){let e=t.currentTarget.getBoundingClientRect(),n=o.current.getBoundingClientRect();a(e.bottom-n.top+8)}else a(null)};return(0,L.jsxs)(`div`,{ref:o,className:`talentTree`,children:[t&&(0,L.jsx)(`button`,{className:`talentHintBtn`,"data-hint":t,"aria-label":t,tabIndex:-1,children:`i`}),(0,L.jsx)(`div`,{className:`talentPaths`,children:e.paths.map(e=>(0,L.jsx)(zo,{path:e,onTalentClick:s},e.id))}),n&&(0,L.jsx)(Lo,{name:n.name,level:n.level,icon:(0,L.jsx)(Ro,{level:n.level,iconSrc:n.iconUrl??void 0,name:n.name,showName:!1,size:`sm`}),description:n.description??``,onClose:()=>{r(null),a(null)},offset:i})]})}var Vo=`.talentPips{cursor:default;gap:3px;margin-top:5px;display:flex;position:relative}.talentPips:after{content:attr(data-tooltip);color:#fff;white-space:nowrap;pointer-events:none;opacity:0;z-index:10;background:#333;border-radius:4px;padding:3px 7px;font-size:.75rem;transition:opacity .2s;position:absolute;top:50%;left:110%;transform:translateY(-50%)}.talentPips:hover:after{opacity:1}.talentPip{border:1px solid var(--tt-pip-empty);border-radius:50%;width:6px;height:6px}.talentPipEmpty{background:0 0}.talentConnector{background:#d4d4d4;border:1px solid #00000073;border-radius:2px;width:4px;height:13px;margin-top:5px;margin-bottom:8px}.talentPopupOverlay{background:var(--tt-overlay-bg);z-index:20;pointer-events:auto;border-radius:25px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.talentPopup{background:var(--tt-popup-bg);pointer-events:auto;border:2px solid;border-radius:12px;width:72%;padding:14px 16px;position:relative;box-shadow:0 4px 20px #00000059}.talentPopupClose{color:var(--tt-text-primary);cursor:pointer;background:0 0;border:none;padding:0;font-size:1rem;line-height:1;position:absolute;top:8px;right:10px}.talentPopupClose:hover{color:#000}.talentPopupHeader{align-items:center;gap:10px;margin-bottom:4px;display:flex}.talentPopupName{color:#1a1f2e;overflow-wrap:break-word;min-width:0;font-size:.95rem;font-weight:700}.talentPopupPips{align-items:center;margin-top:8px;display:flex}.talentPopupLevel{color:var(--tt-text-primary);align-self:center;margin-left:6px;font-size:.7rem}.talentPopupDesc{color:var(--tt-text-secondary);text-align:left;overflow-wrap:break-word;margin:8px 0 4px;font-size:.78rem;line-height:1.5}@media (width<=950px){.talentPopupOverlay{border-radius:0}}.talentNode{border-radius:var(--tt-node-radius);background:var(--tt-node-bg);flex-shrink:0;justify-content:center;align-items:center;display:flex;overflow:hidden}.talentNode.clickable{cursor:pointer}.talentNode.md{width:46px;height:46px}.talentNode.sm{width:40px;height:40px}.talentIcon{object-fit:contain;width:100%;height:100%;display:block}.talentIconFallback{-webkit-user-select:none;user-select:none;font-size:1.1rem;line-height:1}.talentName{color:var(--tt-text-primary);text-align:center;overflow-wrap:break-word;max-width:70px;font-size:.6rem;line-height:1.2}.talentPath{flex-direction:column;flex:1 1 0;align-items:center;gap:0;min-width:80px;max-width:120px;display:flex}.talentPathTitle{color:var(--tt-text-secondary);text-align:center;letter-spacing:.03em;word-break:break-word;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;margin-bottom:10px;padding:0 4px;font-size:.75rem;font-weight:600}.talentEntry{flex-direction:column;align-items:center;gap:4px;display:flex}.talentTree{padding:24px;position:relative}.talentHintBtn{width:20px;height:20px;color:var(--tt-text-secondary);cursor:default;opacity:.55;background:0 0;border:1.5px solid;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:.65rem;font-weight:700;line-height:1;transition:opacity .15s;display:flex;position:absolute;top:10px;right:10px}.talentHintBtn:hover{opacity:1}.talentHintBtn:after{content:attr(data-hint);white-space:nowrap;color:var(--tt-text-secondary);background:var(--tt-popup-bg);border:1px solid color-mix(in srgb, var(--tt-text-secondary) 20%, transparent);pointer-events:none;opacity:0;border-radius:6px;padding:4px 8px;font-size:.65rem;font-weight:400;transition:opacity .15s;position:absolute;top:50%;right:calc(100% + 8px);transform:translateY(-50%);box-shadow:0 2px 8px #00000014}.talentHintBtn:hover:after{opacity:1}.talentPaths{flex-wrap:wrap;justify-content:center;gap:24px;display:flex}`;function Ho(e){return{id:e.id,ownerId:e.ownerId,slug:e.slug,title:e.title,isPublic:e.isPublic,theme:e.theme??{},paths:(e.paths??[]).map(e=>({id:e.id,name:e.name,displayOrder:e.displayOrder,talents:(e.talents??[]).map(e=>({id:e.id,name:e.name,level:e.level,iconUrl:e.iconUrl,description:e.description,displayOrder:e.displayOrder}))})),publishedAt:e.publishedAt?new Date(e.publishedAt):void 0,createdAt:new Date(e.createdAt),updatedAt:new Date(e.updatedAt)}}function Uo({username:e,slug:t,apiBase:n,tree:r}){let i=!r&&e&&t?`${e}/${t}`:null,a=n??`https://api.reallifetalenttree.com`,[o,s]=(0,wo.useState)(null);return(0,wo.useEffect)(()=>{if(!i||!e||!t)return;let n=!1;return fetch(`${a}/api/v1/public/${encodeURIComponent(e)}/${encodeURIComponent(t)}`).then(e=>{if(!e.ok)throw Error(`not found`);return e.json()}).then(({data:e})=>{n||s({key:i,status:`ready`,tree:Ho(e)})}).catch(()=>{n||s({key:i,status:`error`})}),()=>{n=!0}},[i,e,t,a]),r?(0,L.jsx)(Bo,{tree:r}):i?o?.key===i?o.status===`error`?(0,L.jsx)(`span`,{children:`Tree not found.`}):(0,L.jsx)(Bo,{tree:o.tree}):(0,L.jsx)(`span`,{children:`Loading…`}):null}function Wo(){return`:host {
   --tt-level-1: ${Po.level1};
   --tt-level-2: ${Po.level2};
   --tt-level-3: ${Po.level3};
@@ -320,4 +320,4 @@ React keys must be passed directly to JSX without using spread:
   --tt-text-secondary: ${Po.textSecondary};
   --tt-popup-bg: ${Po.popupBg};
   --tt-overlay-bg: ${Po.overlayBg};
-}\n`+Vo}var Go=new CSSStyleSheet;Go.replaceSync(Wo());var Ko=class extends HTMLElement{static observedAttributes=[`username`,`slug`];root=null;_tree=void 0;connectedCallback(){let e=this.attachShadow({mode:`open`});e.adoptedStyleSheets=[Go],this.root=To.createRoot(e),this.render()}disconnectedCallback(){this.root?.unmount(),this.root=null}attributeChangedCallback(){this.render()}set tree(e){this._tree=e,this.render()}render(){this.root&&this.root.render(wo.createElement(Uo,{username:this.getAttribute(`username`)??void 0,slug:this.getAttribute(`slug`)??void 0,tree:this._tree}))}};customElements.get(`talent-tree`)||customElements.define(`talent-tree`,Ko)})();
+}\n`+Vo}var Go=new CSSStyleSheet;Go.replaceSync(Wo());var Ko=class extends HTMLElement{static observedAttributes=[`username`,`slug`,`api-base`];root=null;_tree=void 0;connectedCallback(){let e=this.attachShadow({mode:`open`});e.adoptedStyleSheets=[Go],this.root=To.createRoot(e),this.render()}disconnectedCallback(){this.root?.unmount(),this.root=null}attributeChangedCallback(){this.render()}set tree(e){this._tree=e,this.render()}render(){this.root&&this.root.render(wo.createElement(Uo,{username:this.getAttribute(`username`)??void 0,slug:this.getAttribute(`slug`)??void 0,apiBase:this.getAttribute(`api-base`)??void 0,tree:this._tree}))}};customElements.get(`talent-tree`)||customElements.define(`talent-tree`,Ko)})();

package/dist/talent-tree.js

@@ -23623,33 +23623,34 @@ function Ho(e) {
 		updatedAt: new Date(e.updatedAt)
 	};
 }
-function Uo({ username: e, slug: t, tree: n }) {
-	let r = !n && e && t ? `${e}/${t}` : null, [i, a] = (0, wo.useState)(null);
+function Uo({ username: e, slug: t, apiBase: n, tree: r }) {
+	let i = !r && e && t ? `${e}/${t}` : null, a = n ?? "https://api.reallifetalenttree.com", [o, s] = (0, wo.useState)(null);
 	return (0, wo.useEffect)(() => {
-		if (!r || !e || !t) return;
+		if (!i || !e || !t) return;
 		let n = !1;
-		return fetch(`http://localhost:3002/api/v1/public/${encodeURIComponent(e)}/${encodeURIComponent(t)}`).then((e) => {
+		return fetch(`${a}/api/v1/public/${encodeURIComponent(e)}/${encodeURIComponent(t)}`).then((e) => {
 			if (!e.ok) throw Error("not found");
 			return e.json();
 		}).then(({ data: e }) => {
-			n || a({
-				key: r,
+			n || s({
+				key: i,
 				status: "ready",
 				tree: Ho(e)
 			});
 		}).catch(() => {
-			n || a({
-				key: r,
+			n || s({
+				key: i,
 				status: "error"
 			});
 		}), () => {
 			n = !0;
 		};
 	}, [
-		r,
+		i,
 		e,
-		t
-	]), n ? /* @__PURE__ */ (0, L.jsx)(Bo, { tree: n }) : r ? i?.key === r ? i.status === "error" ? /* @__PURE__ */ (0, L.jsx)("span", { children: "Tree not found." }) : /* @__PURE__ */ (0, L.jsx)(Bo, { tree: i.tree }) : /* @__PURE__ */ (0, L.jsx)("span", { children: "Loading…" }) : null;
+		t,
+		a
+	]), r ? /* @__PURE__ */ (0, L.jsx)(Bo, { tree: r }) : i ? o?.key === i ? o.status === "error" ? /* @__PURE__ */ (0, L.jsx)("span", { children: "Tree not found." }) : /* @__PURE__ */ (0, L.jsx)(Bo, { tree: o.tree }) : /* @__PURE__ */ (0, L.jsx)("span", { children: "Loading…" }) : null;
 }
 //#endregion
 //#region src/TalentTreeElement.ts
@@ -23672,7 +23673,11 @@ function Wo() {
 var Go = new CSSStyleSheet();
 Go.replaceSync(Wo());
 var Ko = class extends HTMLElement {
-	static observedAttributes = ["username", "slug"];
+	static observedAttributes = [
+		"username",
+		"slug",
+		"api-base"
+	];
 	root = null;
 	_tree = void 0;
 	connectedCallback() {
@@ -23692,6 +23697,7 @@ var Ko = class extends HTMLElement {
 		this.root && this.root.render(wo.createElement(Uo, {
 			username: this.getAttribute("username") ?? void 0,
 			slug: this.getAttribute("slug") ?? void 0,
+			apiBase: this.getAttribute("api-base") ?? void 0,
 			tree: this._tree
 		}));
 	}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@real-life-talent-tree/widget",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "publishConfig": {
     "access": "public"
   },
@@ -36,14 +36,14 @@
     "test": "vitest run"
   },
   "dependencies": {
-    "@real-life-talent-tree/core": "1.0.0",
-    "@real-life-talent-tree/ui": "1.0.0",
+    "@real-life-talent-tree/core": "1.0.1",
+    "@real-life-talent-tree/ui": "1.0.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@real-life-talent-tree/config-eslint": "1.0.0",
-    "@real-life-talent-tree/config-ts": "1.0.0",
+    "@real-life-talent-tree/config-eslint": "1.0.1",
+    "@real-life-talent-tree/config-ts": "1.0.1",
     "@testing-library/dom": "*",
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",