@jsonresume/jsonresume-theme-professional 1.0.16 → 1.0.19

package/src/ui/Resume.jsx

@@ -0,0 +1,43 @@
+import styled from 'styled-components';
+import Projects from './Projects.jsx';
+import Hero from './Hero.jsx';
+import Summary from './Summary.jsx';
+import Education from './Education.jsx';
+import Work from './Work.jsx';
+import Certificates from './Certificates.jsx';
+import Publications from './Publications.jsx';
+import Awards from './Awards.jsx';
+import Skills from './Skills.jsx';
+import Interests from './Interests.jsx';
+import Languages from './Languages.jsx';
+import References from './References.jsx';
+import Volunteer from './Volunteer.jsx';
+
+const Layout = styled.div`
+  max-width: 660px;
+  margin: 0 auto;
+  line-height: calc(1ex / 0.32);
+  margin-bottom: 40px;
+`;
+
+const Resume = ({ resume }) => {
+  return (
+    <Layout>
+      <Hero basics={resume.basics} />
+      <Summary basics={resume.basics} />
+      <Work work={resume.work} />
+      <Projects projects={resume.projects} />
+      <Education education={resume.education} />
+      <Certificates certificates={resume.certificates} />
+      <Publications publications={resume.publications} />
+      <Awards awards={resume.awards} />
+      <Volunteer volunteer={resume.volunteer} />
+      <Languages languages={resume.languages} />
+      <Skills skills={resume.skills} />
+      <Interests interests={resume.interests} />
+      <References references={resume.references} />
+    </Layout>
+  );
+};
+
+export default Resume;

package/src/ui/Section.jsx

@@ -0,0 +1,40 @@
+import styled from 'styled-components';
+
+const Section = styled.div`
+  max-width: 700px;
+  margin: 0 auto 18px;
+
+  h2 {
+    margin: 0;
+    padding: 0;
+    margin-bottom: 3px;
+    font-weight: 600;
+  }
+
+  hr {
+    margin: 0;
+    padding: 0;
+    margin-top: 7px;
+    margin-bottom: 3px;
+  }
+`;
+
+const Container = styled.div`
+  margin: 0 8px;
+`;
+
+const SectionComponent = ({ children, title }) => {
+  return (
+    <Section>
+      {title && (
+        <>
+          <h2>{title}</h2>
+          <hr />
+        </>
+      )}
+      <Container>{children}</Container>
+    </Section>
+  );
+};
+
+export default SectionComponent;

package/src/ui/Skills.jsx

@@ -0,0 +1,21 @@
+import OneLineList from './OneLineList.jsx';
+
+import Section from './Section.jsx';
+
+const Skills = ({ skills }) => {
+  if (!skills) {
+    return null;
+  }
+
+  return (
+    <div>
+      <Section title="Skills">
+        {skills.map((w, key) => {
+          return <OneLineList key={key} name={w.name} items={w.keywords} />;
+        })}
+      </Section>
+    </div>
+  );
+};
+
+export default Skills;

package/src/ui/SubTitle.jsx

@@ -0,0 +1,12 @@
+import styled from 'styled-components';
+
+const Text = styled.div`
+  font-size: 22px;
+  font-weight: 600;
+`;
+
+const SubTitle = ({ children }) => {
+  return <Text>{children}</Text>;
+};
+
+export default SubTitle;

package/src/ui/Summary.jsx

@@ -0,0 +1,20 @@
+import styled from 'styled-components';
+import { marked } from 'marked';
+import Section from './Section.jsx';
+
+const Summary = styled.div``;
+
+const SummaryComponent = ({ basics }) => {
+  const { summary } = basics;
+  const htmlContent = summary ? marked.parse(summary, { breaks: true }) : '';
+
+  return (
+    <Section>
+      <div className="secondary">
+        <Summary dangerouslySetInnerHTML={{ __html: htmlContent }} />
+      </div>
+    </Section>
+  );
+};
+
+export default SummaryComponent;

package/src/ui/Volunteer.jsx

@@ -0,0 +1,30 @@
+import Section from './Section.jsx';
+import Experience from './Experience.jsx';
+
+const Volunteer = ({ volunteer }) => {
+  if (!volunteer) {
+    return null;
+  }
+
+  return (
+    <div>
+      <Section title="Volunteer">
+        {volunteer.map((w, key) => {
+          return (
+            <Experience
+              title={w.position}
+              subTitle={w.organization}
+              startDate={w.startDate}
+              endDate={w.endDate}
+              summary={w.summary}
+              highlights={w.highlights}
+              key={key}
+            />
+          );
+        })}
+      </Section>
+    </div>
+  );
+};
+
+export default Volunteer;

package/src/ui/Work.jsx

@@ -0,0 +1,30 @@
+import Section from './Section.jsx';
+import Experience from './Experience.jsx';
+
+const Work = ({ work }) => {
+  if (!work) {
+    return null;
+  }
+
+  return (
+    <div>
+      <Section title="Experience">
+        {work.map((w, key) => {
+          return (
+            <Experience
+              title={w.position}
+              subTitle={w.name}
+              startDate={w.startDate}
+              endDate={w.endDate}
+              summary={w.summary}
+              highlights={w.highlights}
+              key={key}
+            />
+          );
+        })}
+      </Section>
+    </div>
+  );
+};
+
+export default Work;

package/vite.config.js

@@ -0,0 +1,33 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+export default defineConfig({
+  plugins: [react()],
+  build: {
+    ssr: true,
+    target: 'node18',
+    outDir: './dist',
+    emptyOutDir: true,
+    minify: false,
+    lib: {
+      entry: './src/index.jsx',
+      formats: ['es'],
+      fileName: 'index',
+    },
+    rollupOptions: {
+      external: ['react', 'react-dom', 'react-dom/server', 'react/jsx-runtime'],
+      output: {
+        exports: 'named',
+      },
+    },
+  },
+  ssr: {
+    // Force bundle these packages instead of externalizing
+    noExternal: [
+      'styled-components',
+      '@emotion/is-prop-valid',
+      'stylis',
+      'shallowequal',
+    ],
+  },
+});