@warleon/jsonresume-theme-html
Version:
A JSON Resume theme, compatible with the latest resume schema
273 lines (272 loc) • 11 kB
JavaScript
(function($,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("@rbardini/html"),require("micromark"),require("striptags"),require("feather-icons")):typeof define=="function"&&define.amd?define(["exports","@rbardini/html","micromark","striptags","feather-icons"],i):($=typeof globalThis<"u"?globalThis:$||self,i($.jsonresumeThemeEven={},$.html,$.micromark,$.striptags,$.feather))})(this,function($,i,C,I,b){"use strict";var y=Object.freeze,G=Object.defineProperty;var w=($,i)=>y(G($,"raw",{value:y(i||$.slice())}));var L;function d(t,e=!1){const n=C(t);return e?I(n):n}const j=t=>new Date(t).toLocaleDateString("en",{month:"short",year:"numeric",timeZone:"UTC"});function p(t){return i.html`<time datetime="${t}">${j(t)}</time>`}function P(t=[]){return t.length>0&&i.html`
<section id="awards">
<h3>Awards</h3>
<div class="stack">
${t.map(({awarder:e,date:n,summary:s,title:a})=>i.html`
<article>
<header>
<h4>${a}</h4>
<div class="meta">
${e&&i.html`<div>Awarded by <strong>${e}</strong></div>`} ${n&&p(n)}
</div>
</header>
${s&&d(s)}
</article>
`)}
</div>
</section>
`}const R=t=>t.replace(/^(https?:|)\/\//,"").replace(/\/$/,"");function h(t,e){return e?t?i.html`<a href="${t}">${e}</a>`:e:t&&i.html`<a href="${t}">${R(t)}</a>`}function q(t=[]){return t.length>0&&i.html`
<section id="certificates">
<h3>Certificates</h3>
<div class="stack">
${t.map(({date:e,issuer:n,name:s,url:a})=>i.html`
<article>
<header>
<h4>${h(a,s)}</h4>
<div class="meta">
${n&&i.html`<div>Issued by <strong>${n}</strong></div>`} ${e&&p(e)}
</div>
</header>
</article>
`)}
</div>
</section>
`}function g(t,e){return e===t?p(e):i.html`<time-duration>${p(t)} – ${e?p(e):"Present"}</time-duration>`}function S(t=[]){return t.length>0&&i.html`
<section id="education">
<h3>Education</h3>
<div class="stack">
${t.map(({area:e,courses:n=[],institution:s,startDate:a,endDate:l,studyType:r,url:c})=>i.html`
<article>
<header>
<h4>${h(c,s)}</h4>
<div class="meta">
${e&&i.html`<strong>${e}</strong>`}
${a&&i.html`<div>${g(a,l)}</div>`}
</div>
</header>
${r&&d(r)}
${n.length>0&&i.html`
<h5>Courses</h5>
<ul>
${n.map(o=>i.html`<li>${d(o)}</li>`)}
</ul>
`}
</article>
`)}
</div>
</section>
`}function f(t,e){return(b.icons[t.toLowerCase()]||e&&b.icons[e.toLowerCase()])?.toSvg({width:16,height:16})}const T=t=>Intl.DisplayNames?new Intl.DisplayNames(["en"],{type:"region"}).of(t):t;function A(t={}){const{email:e,image:n,label:s,location:a,name:l,phone:r,profiles:c=[],summary:o,url:u}=t;return i.html`
<header class="masthead">
${n&&i.html`<img src="${n}" alt="" />`}
<div>${l&&i.html`<h1>${l}</h1>`} ${s&&i.html`<h2>${s}</h2>`}</div>
${o&&i.html`<article>${d(o)}</article>`}
<ul class="icon-list">
${a?.city&&i.html`
<li>
${f("map-pin")} ${a.city}${a.countryCode&&i.html`, ${T(a.countryCode)}`}
</li>
`}
${e&&i.html`
<li>
${f("mail")}
<a href="mailto:${e}">${e}</a>
</li>
`}
${r&&i.html`
<li>
${f("phone")}
<a href="tel:${r.replace(/\s/g,"")}">${r}</a>
</li>
`}
${u&&i.html`<li>${f("link")} ${h(u)}</li>`}
${c.map(({network:v,url:m,username:k})=>i.html`
<li>
${v&&f(v,"user")} ${h(m,k)}
${v&&i.html`<span class="network">(${v})</span>`}
</li>
`)}
</ul>
</header>
`}function E(t=[]){return t.length>0&&i.html`
<section id="interests">
<h3>Interests</h3>
<div class="grid-list">
${t.map(({keywords:e=[],name:n})=>i.html`
<div>
${n&&i.html`<h4>${n}</h4>`}
${e.length>0&&i.html`
<ul class="tag-list">
${e.map(s=>i.html`<li>${s}</li>`)}
</ul>
`}
</div>
`)}
</div>
</section>
`}function O(t=[]){return t.length>0&&i.html`
<section id="languages">
<h3>Languages</h3>
<div class="grid-list">
${t.map(({fluency:e,language:n})=>i.html`<div>${n&&i.html`<h4>${n}</h4>`} ${e}</div>`)}
</div>
</section>
`}function W(t={}){const{name:e,summary:n}=t;return i.html`
${e&&i.html`<title>${e}</title>`}
${n&&i.html`<meta name="description" content="${d(n,!0)}" />`}
`}const F=t=>Intl.ListFormat?new Intl.ListFormat("en").format(t):t.join(", ");function M(t=[]){return t.length>0&&i.html`
<section id="projects">
<h3>Projects</h3>
<div class="stack">
${t.map(({description:e,entity:n,highlights:s=[],keywords:a=[],name:l,startDate:r,endDate:c,roles:o=[],type:u,url:v})=>i.html`
<article>
<header>
<h4>${h(v,l)}</h4>
<div class="meta">
<div>
${o.length>0&&i.html`<strong>${F(o)}</strong>`}
${n&&i.html`at <strong>${n}</strong>`}
</div>
${r&&i.html`<div>${g(r,c)}</div>`} ${u&&i.html`<div>${u}</div>`}
</div>
</header>
${e&&d(e)}
${s.length>0&&i.html`
<ul>
${s.map(m=>i.html`<li>${d(m)}</li>`)}
</ul>
`}
${a.length>0&&i.html`
<ul class="tag-list">
${a.map(m=>i.html`<li>${m}</li>`)}
</ul>
`}
</article>
`)}
</div>
</section>
`}function N(t=[]){return t.length>0&&i.html`
<section id="publications">
<h3>Publications</h3>
<div class="stack">
${t.map(({name:e,publisher:n,releaseDate:s,summary:a,url:l})=>i.html`
<article>
<header>
<h4>${h(l,e)}</h4>
<div class="meta">
${n&&i.html`<div>Published by <strong>${n}</strong></div>`}
${s&&p(s)}
</div>
</header>
${a&&d(a)}
</article>
`)}
</div>
</section>
`}function U(t=[]){return t.length>0&&i.html`
<section id="references">
<h3>References</h3>
<div class="stack">
${t.map(({name:e,reference:n})=>i.html`
<blockquote>
${n&&d(n)}
${e&&i.html`
<p>
<cite>${e}</cite>
</p>
`}
</blockquote>
`)}
</div>
</section>
`}function V(t=[]){return t.length>0&&i.html`
<section id="skills">
<h3>Skills</h3>
<div class="grid-list">
${t.map(({keywords:e=[],name:n})=>i.html`
<div>
${n&&i.html`<h4>${n}</h4>`}
${e.length>0&&i.html`
<ul class="tag-list">
${e.map(s=>i.html`<li>${s}</li>`)}
</ul>
`}
</div>
`)}
</div>
</section>
`}function x(t=[]){return t.length>0&&i.html`
<section id="volunteer">
<h3>Volunteer</h3>
<div class="stack">
${t.map(({highlights:e=[],organization:n,position:s,startDate:a,endDate:l,summary:r,url:c})=>i.html`
<article>
<header>
<h4>${h(c,n)}</h4>
<div class="meta">
<strong>${s}</strong>
${a&&i.html`<div>${g(a,l)}</div>`}
</div>
</header>
${r&&d(r)}
${e.length>0&&i.html`
<ul>
${e.map(o=>i.html`<li>${d(o)}</li>`)}
</ul>
`}
</article>
`)}
</div>
</section>
`}function B(t=[]){const e=t.reduce((n,{description:s,name:a,url:l,...r})=>{const c=n[n.length-1];return c&&c.name===a&&c.description===s&&c.url===l?c.items.push(r):n.push({description:s,name:a,url:l,items:[r]}),n},[]);return t.length>0&&i.html`
<section id="work">
<h3>Work</h3>
<div class="stack">
${e.map(({description:n,name:s,url:a,items:l=[]})=>i.html`
<article>
<header>
<h4>${h(a,s)}</h4>
<div class="meta">${n&&i.html`<div>${n}</div>`}</div>
</header>
<div class="timeline">
${l.map(({highlights:r=[],location:c,position:o,startDate:u,endDate:v,summary:m})=>i.html`
<div>
<div>
<h5>${o}</h5>
<div class="meta">
${u&&i.html`<div>${g(u,v)}</div>`}
${c&&i.html`<div>${c}</div>`}
</div>
</div>
${m&&d(m)}
${r.length>0&&i.html`
<ul>
${r.map(k=>i.html`<li>${d(k)}</li>`)}
</ul>
`}
</div>
`)}
</div>
</article>
`)}
</div>
</section>
`}function H(t,{css:e,js:n}={}){return i.html`
<html lang="en">
<head>
<meta charset="utf-8" />
${W(t.basics)}
<meta name="viewport" content="width=device-width, initial-scale=1" />
${e&&i.html`<style>
${e}
</style>`}
${n&&i.html(L||(L=w([`<script type="module">
`,`
<\/script>`])),n)}
</head>
<body>
${A(t.basics)} ${B(t.work)} ${x(t.volunteer)} ${S(t.education)}
${M(t.projects)} ${P(t.awards)} ${q(t.certificates)}
${N(t.publications)} ${V(t.skills)} ${O(t.languages)}
${E(t.interests)} ${U(t.references)}
</body>
</html>`}const Z={mediaType:"print",printBackground:!0},z=t=>H(t,{css:"",js:""});$.pdfRenderOptions=Z,$.render=z,Object.defineProperty($,Symbol.toStringTag,{value:"Module"})});