profile-pane 3.1.4 → 3.2.0

package/lib/sections/contactInfo/ContactInfoSection.js

@@ -0,0 +1,229 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.renderContactInfoSection = renderContactInfoSection;
+var _litHtml = require("lit-html");
+var _ContactInfoEditDialog = require("./ContactInfoEditDialog");
+var _solidUi = require("solid-ui");
+var _texts = require("../../texts");
+var _collapsibleSection = require("../shared/collapsibleSection");
+var _contactTypeUtils = require("../shared/contactTypeUtils");
+var _profileIcons = require("../../icons-svg/profileIcons");
+var _contactIcons = require("../../icons-svg/contactIcons");
+function toText(value) {
+  if (!value) return '';
+  if (typeof value === 'string') return value;
+  if (typeof value === 'object' && 'value' in value) {
+    const v = value.value;
+    return typeof v === 'string' ? v : '';
+  }
+  return '';
+}
+function normalizeContactValue(rawValue, kind) {
+  if (!rawValue) return '';
+  return kind === 'email' ? rawValue.replace(/^mailto:/i, '') : rawValue.replace(/^tel:/i, '');
+}
+function resolveContactValue(store, point, kind) {
+  if (!point) return '';
+  const directValue = toText(point.valueNode || point.entryNode).trim();
+  const looksLikeExpectedValue = kind === 'email' ? /^mailto:/i.test(directValue) || /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(directValue) : /^tel:/i.test(directValue) || /^[+()\-\s\d]{5,}$/.test(directValue);
+  if (looksLikeExpectedValue) {
+    return normalizeContactValue(directValue, kind);
+  }
+  const entryNode = point.entryNode || point.valueNode;
+  if (entryNode) {
+    const storedValueNode = store.any(entryNode, _solidUi.ns.vcard('value'));
+    const storedValue = toText(storedValueNode).trim();
+    if (storedValue) return normalizeContactValue(storedValue, kind);
+  }
+  return normalizeContactValue(directValue, kind);
+}
+function renderPhone(phone, store) {
+  if (!phone) return (0, _litHtml.html)``;
+  const phoneValue = resolveContactValue(store, phone, 'phone');
+  const phoneType = (0, _contactTypeUtils.normalizePhoneTypeForEdit)(phone.type);
+  return (0, _litHtml.html)`<li class="contact-info__item flex gap-2xs" role="listitem">
+        <div class="contact-info__icon-wrapper flex-center">
+          <span class="contact-info__icon" aria-hidden="true">${_contactIcons.phoneIcon}</span>
+        </div>
+        <div class="flex-column">
+          <span class="contact-info__contact-point-value">${phoneValue}</span>
+          ${phoneType ? (0, _litHtml.html)`<span class="contact-info__contact-point-type"> ${phoneType}</span>` : (0, _litHtml.html)``}
+        </div>
+      </li>`;
+}
+function renderPhones(phones, store) {
+  if (!phones || !phones.length || !phones[0]) return (0, _litHtml.html)``;
+  return (0, _litHtml.html)`${renderPhone(phones[0], store)}${phones.length > 1 ? renderPhones(phones.slice(1), store) : (0, _litHtml.html)``}`;
+}
+function renderEmail(email, store) {
+  if (!email) return (0, _litHtml.html)``;
+  const emailValue = resolveContactValue(store, email, 'email');
+  const emailType = (0, _contactTypeUtils.normalizeEmailTypeForEdit)(email.type);
+  return (0, _litHtml.html)`<li class="contact-info__item flex gap-2xs" role="listitem">
+        <div class="contact-info__icon-wrapper flex-center">
+          <span class="contact-info__icon" aria-hidden="true">${_contactIcons.emailIcon}</span>
+        </div>
+        <div class="flex-column">
+          <span class="contact-info__contact-point-value">${emailValue}</span>
+          ${emailType ? (0, _litHtml.html)`<span class="contact-info__contact-point-type">${emailType}</span>` : (0, _litHtml.html)``}
+        </div>
+      </li>`;
+}
+function renderEmails(emails, store) {
+  if (!emails || !emails.length || !emails[0]) return (0, _litHtml.html)``;
+  return (0, _litHtml.html)`${renderEmail(emails[0], store)}${emails.length > 1 ? renderEmails(emails.slice(1), store) : (0, _litHtml.html)``}`;
+}
+function renderAddress(address) {
+  if (!address) return (0, _litHtml.html)``;
+  const streetAddress = toText(address.streetAddress || address.fullAddress).trim();
+  const locality = toText(address.locality).trim();
+  const region = toText(address.region).trim();
+  const postalCode = toText(address.postalCode).trim();
+  const countryName = toText(address.countryName).trim();
+  const localityRegion = [locality, region].filter(Boolean).join(', ');
+  const localityRegionPostal = [localityRegion, postalCode].filter(Boolean).join(' ');
+  return (0, _litHtml.html)`
+        <li class="contact-info__item flex gap-2xs" role="listitem">
+          <div class="contact-info__icon-wrapper flex-center">
+            <span class="contact-info__icon" aria-hidden="true">${_profileIcons.locationIcon}</span>
+          </div>
+          <span class="contact-info__address">
+            ${streetAddress ? (0, _litHtml.html)`${streetAddress}<br />` : (0, _litHtml.html)``}
+            ${localityRegionPostal ? (0, _litHtml.html)`${localityRegionPostal}<br />` : (0, _litHtml.html)``}
+            ${countryName}
+          </span>
+        </li>`;
+}
+function renderAddresses(addresses) {
+  if (!addresses || !addresses.length || !addresses[0]) return (0, _litHtml.html)``;
+  return (0, _litHtml.html)`${renderAddress(addresses[0])}${addresses.length > 1 ? renderAddresses(addresses.slice(1)) : (0, _litHtml.html)``}`;
+}
+function renderContactInfoSectionDefault(store, subject, contactInfo, viewerMode, onSaved) {
+  const hasAnyContactInfo = contactInfo?.emails.length > 0 || contactInfo?.phones.length > 0 || contactInfo?.addresses.length > 0;
+  const isOwner = viewerMode === 'owner';
+  return (0, _litHtml.html)`
+    <section
+      aria-labelledby="contact-details-heading"
+      class="profile__section border-lighter profile-section-collapsible profile-section-collapsible--inline-mobile-actions"
+      role="region"
+      tabindex="-1"
+      data-expanded="false"
+    >
+      <header class="profile__section-header profile-section-collapsible__header">
+        <h2 id="contact-details-heading" tabindex="-1">${_texts.contactInfoHeadingText}</h2>
+        <div class="profile-section-collapsible__actions flex-column">
+          ${isOwner ? (0, _litHtml.html)`
+            <button 
+              type="button" 
+              class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button" 
+              aria-label="Edit contact information"
+              @click=${event => {
+    return (0, _ContactInfoEditDialog.createContactInfoEditDialog)(event, store, subject, contactInfo, viewerMode, onSaved);
+  }}>
+              <span class="profile-section-collapsible__edit-label">${_profileIcons.editIcon} Edit</span>
+              <span class="profile-section-collapsible__edit-icon" aria-hidden="true">${_profileIcons.editIcon}</span>
+            </button>
+          ` : (0, _litHtml.html)``}
+          <button
+            type="button"
+            class="inline-flex-row"
+            aria-label="Toggle contact information section"
+            aria-controls="contact-details-panel"
+            aria-expanded="false"
+            @click=${_collapsibleSection.toggleCollapsibleSection}
+          >
+            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
+          </button>
+        </div>
+      </header>
+      <div id="contact-details-panel" class="profile-section-collapsible__content" aria-hidden="true">
+        ${contactInfo.phones.length > 0 ? (0, _litHtml.html)`
+              <ul class="contact-info__list flex-column" role="list" aria-label="Phone numbers">
+                ${renderPhones(contactInfo.phones, store)}
+              </ul>
+            ` : (0, _litHtml.html)``}
+        ${contactInfo.emails.length > 0 ? (0, _litHtml.html)`
+              <ul class="contact-info__list flex-column" role="list" aria-label="Email addresses">
+                ${renderEmails(contactInfo.emails, store)}
+              </ul>
+            ` : (0, _litHtml.html)``}
+        ${contactInfo.addresses.length > 0 ? (0, _litHtml.html)`
+              <ul class="contact-info__list flex-column" role="list" aria-label="Postal addresses">
+                ${renderAddresses(contactInfo.addresses)}
+              </ul>
+            ` : (0, _litHtml.html)``}
+        ${hasAnyContactInfo ? (0, _litHtml.html)`` : (0, _litHtml.html)`<p>No contact details added yet.</p>`}
+      </div>
+    </section>
+  `;
+}
+function renderOwnerEmptyContactInfoContent(_store, _subject, _contactInfo, _viewerMode, _onSaved) {
+  return (0, _litHtml.html)`
+      <div class="profile__empty-state-content flex-column-center" role="group" aria-label="Empty contact information section">    
+        <div class="contact-info__empty-icon-wrapper">
+          <span class="contact-info__empty-icon inline-flex-row">${_profileIcons.envelopeIcon}</span>
+        </div>
+        <p class="profile__empty-state-message contact-info__empty-message">
+            No additional contact info added yet.
+        </p>
+      </div>
+  `;
+}
+function renderOwnerEmptyContactInfoSection(store, subject, contactInfo, viewerMode, onSaved) {
+  return (0, _litHtml.html)`
+    <section 
+      aria-labelledby="contact-details-heading" 
+      data-profile-section="contact-info"
+      class="profile__section--empty border-lighter rounded-md gap-lg profile-section-collapsible profile-section-collapsible--inline-mobile-actions" 
+      role="region"
+      tabindex="-1"
+      data-expanded="false"
+    >
+      <header class="profile__section-header profile-section-collapsible__header">
+        <h2 id="contact-details-heading" tabindex="-1">${_texts.contactInfoEmptyHeadingText}</h2>
+        <div class="profile-section-collapsible__actions flex-column">
+          <button
+            type="button"
+            class="profile__action-button profile-action-text flex-center profile-section-collapsible__edit-button"
+            aria-label="Add contact information"
+            @click=${event => {
+    return (0, _ContactInfoEditDialog.createContactInfoEditDialog)(event, store, subject, contactInfo, viewerMode, onSaved);
+  }}
+          >
+            <span class="profile-section-collapsible__edit-label">${_profileIcons.addIcon} Add Contact</span>
+            <span class="profile-section-collapsible__edit-icon profile-section-collapsible__edit-icon--add" aria-hidden="true">${_profileIcons.plusIcon}</span>
+          </button>
+          <button
+            type="button"
+            class="inline-flex-row"
+            aria-label="Toggle contact information section"
+            aria-controls="contact-details-panel"
+            aria-expanded="false"
+            @click=${_collapsibleSection.toggleCollapsibleSection}
+          >
+            <span class="profile-section-collapsible__chevron" aria-hidden="true">⌄</span>
+          </button>
+        </div>
+      </header>
+      <div id="contact-details-panel" class="profile-section-collapsible__content" aria-hidden="true">
+        ${renderOwnerEmptyContactInfoContent(store, subject, contactInfo, viewerMode, onSaved)}
+      </div>
+    </section>
+  `;
+}
+function renderContactInfoSection(store, subject, contactInfo, viewerMode, onSaved) {
+  const safeContactInfo = {
+    emails: contactInfo?.emails || [],
+    phones: contactInfo?.phones || [],
+    addresses: contactInfo?.addresses || []
+  };
+  const hasAnyContactInfo = safeContactInfo.emails.length > 0 || safeContactInfo.phones.length > 0 || safeContactInfo.addresses.length > 0;
+  const showOwnerEmptyContactInfo = !hasAnyContactInfo && viewerMode === 'owner';
+  const showSection = true;
+  return showSection ? (0, _litHtml.html)`
+    ${showOwnerEmptyContactInfo ? renderOwnerEmptyContactInfoSection(store, subject, safeContactInfo, viewerMode, onSaved) : renderContactInfoSectionDefault(store, subject, safeContactInfo, viewerMode, onSaved)}
+  ` : '';
+}

package/lib/sections/contactInfo/mutations.d.ts

@@ -0,0 +1,4 @@
+import { LiveStore, NamedNode } from 'rdflib';
+import { ContactMutationPlan } from './types';
+export declare function processContactInfoMutations(store: LiveStore, subject: NamedNode, mutationPlan: ContactMutationPlan): Promise<void>;
+//# sourceMappingURL=mutations.d.ts.map

package/lib/sections/contactInfo/mutations.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mutations.d.ts","sourceRoot":"","sources":["../../../src/sections/contactInfo/mutations.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAiB,MAAM,QAAQ,CAAA;AAE5D,OAAO,EAAqB,mBAAmB,EAAmB,MAAM,SAAS,CAAA;AAqKjF,wBAAsB,2BAA2B,CAAC,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,mBAAmB,iBASxH"}

package/lib/sections/contactInfo/mutations.js

@@ -0,0 +1,150 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.processContactInfoMutations = processContactInfoMutations;
+var _rdflib = require("rdflib");
+var _solidUi = require("solid-ui");
+var _rdfMutationHelpers = require("../shared/rdfMutationHelpers");
+var _idNodeFactory = require("../shared/idNodeFactory");
+var _texts = require("../../texts");
+function buildPhoneStatements(subject, doc, node, phone) {
+  const normalizedValue = phone.value.startsWith('tel:') ? phone.value : `tel:${phone.value}`;
+  const valueNode = (0, _rdflib.sym)(normalizedValue);
+  const inserts = [(0, _rdflib.st)(subject, _solidUi.ns.vcard('hasTelephone'), node, doc), (0, _rdflib.st)(node, _solidUi.ns.vcard('value'), valueNode, doc)];
+  if (phone.type) {
+    inserts.push((0, _rdflib.st)(node, _solidUi.ns.rdf('type'), _solidUi.ns.vcard(phone.type), doc));
+  }
+  return inserts;
+}
+function buildEmailStatements(subject, doc, node, email) {
+  const normalizedValue = email.value.startsWith('mailto:') ? email.value : `mailto:${email.value}`;
+  const valueNode = (0, _rdflib.sym)(normalizedValue);
+  const inserts = [(0, _rdflib.st)(subject, _solidUi.ns.vcard('hasEmail'), node, doc), (0, _rdflib.st)(node, _solidUi.ns.vcard('value'), valueNode, doc)];
+  if (email.type) {
+    inserts.push((0, _rdflib.st)(node, _solidUi.ns.rdf('type'), _solidUi.ns.vcard(email.type), doc));
+  }
+  return inserts;
+}
+function buildAddressStatements(subject, doc, node, address) {
+  const inserts = [(0, _rdflib.st)(subject, _solidUi.ns.vcard('hasAddress'), node, doc)];
+  if (address.type) inserts.push((0, _rdflib.st)(node, _solidUi.ns.rdf('type'), _solidUi.ns.vcard(address.type), doc));
+  if (address.streetAddress) inserts.push((0, _rdflib.st)(node, _solidUi.ns.vcard('street-address'), address.streetAddress, doc));
+  if (address.locality) inserts.push((0, _rdflib.st)(node, _solidUi.ns.vcard('locality'), address.locality, doc));
+  if (address.region) inserts.push((0, _rdflib.st)(node, _solidUi.ns.vcard('region'), address.region, doc));
+  if (address.postalCode) inserts.push((0, _rdflib.st)(node, _solidUi.ns.vcard('postal-code'), address.postalCode, doc));
+  if (address.countryName) inserts.push((0, _rdflib.st)(node, _solidUi.ns.vcard('country-name'), address.countryName, doc));
+  return inserts;
+}
+async function mutatePhoneEntries(store, subject, phoneOps) {
+  const doc = subject.doc();
+  const existingPhoneNodes = store.each(subject, _solidUi.ns.vcard('hasTelephone'), null, doc);
+  const deletions = [];
+  const insertions = [];
+  phoneOps.remove.forEach(phone => {
+    if (!phone.entryNode) return;
+    const existingNode = (0, _rdfMutationHelpers.findExistingNode)(existingPhoneNodes, phone.entryNode);
+    if (existingNode) {
+      const linkedPhoneStatements = (0, _rdfMutationHelpers.collectLinkedNodeStatements)(store, subject, _solidUi.ns.vcard('hasTelephone'), doc);
+      const matchingLinkStatement = linkedPhoneStatements.linkStatements.find(statement => statement.object?.value === existingNode.value);
+      if (matchingLinkStatement) {
+        deletions.push(matchingLinkStatement);
+      }
+      deletions.push(...(0, _rdfMutationHelpers.collectNodeStatements)(store, existingNode, doc));
+    }
+  });
+  phoneOps.update.forEach(phone => {
+    if (!phone.entryNode) return;
+    const existingNode = (0, _rdfMutationHelpers.findExistingNode)(existingPhoneNodes, phone.entryNode);
+    if (!existingNode) {
+      insertions.push(...buildPhoneStatements(subject, doc, (0, _idNodeFactory.createIdNode)(doc), phone));
+      return;
+    }
+    const linkedPhoneStatements = (0, _rdfMutationHelpers.collectLinkedNodeStatements)(store, subject, _solidUi.ns.vcard('hasTelephone'), doc);
+    const matchingLinkStatement = linkedPhoneStatements.linkStatements.find(statement => statement.object?.value === existingNode.value);
+    if (matchingLinkStatement) {
+      deletions.push(matchingLinkStatement);
+    }
+    deletions.push(...(0, _rdfMutationHelpers.collectNodeStatements)(store, existingNode, doc));
+    insertions.push(...buildPhoneStatements(subject, doc, existingNode, phone));
+  });
+  phoneOps.create.forEach(phone => {
+    insertions.push(...buildPhoneStatements(subject, doc, (0, _idNodeFactory.createIdNode)(doc), phone));
+  });
+  await (0, _rdfMutationHelpers.applyUpdaterPatch)(store, deletions, insertions);
+}
+async function mutateEmailEntries(store, subject, emailOps) {
+  const doc = subject.doc();
+  const existingEmailNodes = store.each(subject, _solidUi.ns.vcard('hasEmail'), null, doc);
+  const deletions = [];
+  const insertions = [];
+  emailOps.remove.forEach(email => {
+    if (!email.entryNode) return;
+    const existingNode = (0, _rdfMutationHelpers.findExistingNode)(existingEmailNodes, email.entryNode);
+    if (existingNode) {
+      const linkedEmailStatements = (0, _rdfMutationHelpers.collectLinkedNodeStatements)(store, subject, _solidUi.ns.vcard('hasEmail'), doc);
+      const matchingLinkStatement = linkedEmailStatements.linkStatements.find(statement => statement.object?.value === existingNode.value);
+      if (matchingLinkStatement) {
+        deletions.push(matchingLinkStatement);
+      }
+      deletions.push(...(0, _rdfMutationHelpers.collectNodeStatements)(store, existingNode, doc));
+    }
+  });
+  emailOps.update.forEach(email => {
+    if (!email.entryNode) return;
+    const existingNode = (0, _rdfMutationHelpers.findExistingNode)(existingEmailNodes, email.entryNode);
+    if (!existingNode) {
+      insertions.push(...buildEmailStatements(subject, doc, (0, _idNodeFactory.createIdNode)(doc), email));
+      return;
+    }
+    deletions.push(...(0, _rdfMutationHelpers.collectNodeStatements)(store, existingNode, doc));
+    insertions.push(...buildEmailStatements(subject, doc, existingNode, email));
+  });
+  emailOps.create.forEach(email => {
+    insertions.push(...buildEmailStatements(subject, doc, (0, _idNodeFactory.createIdNode)(doc), email));
+  });
+  await (0, _rdfMutationHelpers.applyUpdaterPatch)(store, deletions, insertions);
+}
+async function mutateAddressEntries(store, subject, addressOps) {
+  const doc = subject.doc();
+  const existingAddressNodes = store.each(subject, _solidUi.ns.vcard('hasAddress'), null, doc);
+  const deletions = [];
+  const insertions = [];
+  addressOps.remove.forEach(address => {
+    if (!address.entryNode) return;
+    const existingNode = (0, _rdfMutationHelpers.findExistingNode)(existingAddressNodes, address.entryNode);
+    if (existingNode) {
+      const linkedAddressStatements = (0, _rdfMutationHelpers.collectLinkedNodeStatements)(store, subject, _solidUi.ns.vcard('hasAddress'), doc);
+      const matchingLinkStatement = linkedAddressStatements.linkStatements.find(statement => statement.object?.value === existingNode.value);
+      if (matchingLinkStatement) {
+        deletions.push(matchingLinkStatement);
+      }
+      deletions.push(...(0, _rdfMutationHelpers.collectNodeStatements)(store, existingNode, doc));
+    }
+  });
+  addressOps.update.forEach(address => {
+    if (!address.entryNode) return;
+    const existingNode = (0, _rdfMutationHelpers.findExistingNode)(existingAddressNodes, address.entryNode);
+    if (!existingNode) {
+      insertions.push(...buildAddressStatements(subject, doc, (0, _idNodeFactory.createIdNode)(doc), address));
+      return;
+    }
+    deletions.push(...(0, _rdfMutationHelpers.collectNodeStatements)(store, existingNode, doc));
+    insertions.push(...buildAddressStatements(subject, doc, existingNode, address));
+  });
+  addressOps.create.forEach(address => {
+    insertions.push(...buildAddressStatements(subject, doc, (0, _idNodeFactory.createIdNode)(doc), address));
+  });
+  await (0, _rdfMutationHelpers.applyUpdaterPatch)(store, deletions, insertions);
+}
+async function processContactInfoMutations(store, subject, mutationPlan) {
+  try {
+    await mutatePhoneEntries(store, subject, mutationPlan.phoneOps);
+    await mutateEmailEntries(store, subject, mutationPlan.emailOps);
+    await mutateAddressEntries(store, subject, mutationPlan.addressOps);
+  } catch (error) {
+    const message = error instanceof Error ? error.message : String(error);
+    throw new Error(`${_texts.mutationSaveContactInfoFailedPrefixText} ${message}`);
+  }
+}

package/lib/sections/contactInfo/selectors.d.ts

@@ -0,0 +1,4 @@
+import { LiveStore, NamedNode } from 'rdflib';
+import { ContactInfo } from './types';
+export declare function presentContactInfo(subject: NamedNode, store: LiveStore): ContactInfo;
+//# sourceMappingURL=selectors.d.ts.map

package/lib/sections/contactInfo/selectors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectors.d.ts","sourceRoot":"","sources":["../../../src/sections/contactInfo/selectors.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,SAAS,EAAQ,MAAM,QAAQ,CAAA;AAEnD,OAAO,EAAkB,WAAW,EAAgB,MAAM,SAAS,CAAA;AAiHnE,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,GAAG,WAAW,CAMpF"}

package/lib/sections/contactInfo/selectors.js

@@ -0,0 +1,104 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.presentContactInfo = presentContactInfo;
+var _solidUi = require("solid-ui");
+function termValue(term) {
+  if (!term) return '';
+  if (typeof term === 'string') return term;
+  return term.value || '';
+}
+function isEmailValue(value) {
+  const normalized = (value || '').trim();
+  if (!normalized) return false;
+  if (/^mailto:/i.test(normalized)) return true;
+  return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(normalized);
+}
+function isPhoneValue(value) {
+  const normalized = (value || '').trim();
+  if (!normalized) return false;
+  if (/^tel:/i.test(normalized)) return true;
+  return /^[+()\-\s\d]{5,}$/.test(normalized);
+}
+function resolvePointValueNode(store, entryNode, doc, kind) {
+  const expected = kind === 'email' ? isEmailValue : isPhoneValue;
+  const entryValue = termValue(entryNode);
+  if (expected(entryValue)) return entryNode;
+  const inDocStatements = store.statementsMatching(entryNode, _solidUi.ns.vcard('value'), null, doc);
+  const anyGraphStatements = store.statementsMatching(entryNode, _solidUi.ns.vcard('value'));
+  for (const statement of [...inDocStatements, ...anyGraphStatements]) {
+    const objectNode = statement.object;
+    if (expected(termValue(objectNode))) {
+      return objectNode;
+    }
+  }
+  return null;
+}
+function selectEmails(subject, store) {
+  const emails = [];
+  const emailNodes = store.each(subject, _solidUi.ns.vcard('hasEmail'), null, subject.doc()) || null;
+  emailNodes.forEach(node => {
+    const valueNode = resolvePointValueNode(store, node, subject.doc(), 'email');
+    if (!valueNode) return;
+    const type = store.any(node, _solidUi.ns.rdf('type'), null, subject.doc());
+    emails.push({
+      entryNode: node,
+      type,
+      valueNode
+    });
+  });
+  return emails;
+}
+/* SAM need to look at this doesn't seem to be working 
+although it was working in add-to-contacts button */
+function selectPhones(subject, store) {
+  const phoneNumbers = [];
+  const phoneNodes = store.each(subject, _solidUi.ns.vcard('hasTelephone'), null, subject.doc()) || null;
+  phoneNodes.forEach(node => {
+    const valueNode = resolvePointValueNode(store, node, subject.doc(), 'phone');
+    if (!valueNode) return;
+    const type = store.any(node, _solidUi.ns.rdf('type'), null, subject.doc());
+    phoneNumbers.push({
+      entryNode: node,
+      type,
+      valueNode
+    });
+  });
+  return phoneNumbers;
+}
+function selectAddresses(subject, store) {
+  const addresses = [];
+  const addressNodes = store.each(subject, _solidUi.ns.vcard('hasAddress'), null, subject.doc()) || null;
+  addressNodes.map(node => {
+    const streetAddress = termValue(store.any(node, _solidUi.ns.vcard('street-address'), null, subject.doc()));
+    const locality = termValue(store.any(node, _solidUi.ns.vcard('locality'), null, subject.doc()));
+    const region = termValue(store.any(node, _solidUi.ns.vcard('region'), null, subject.doc()));
+    const postalCode = termValue(store.any(node, _solidUi.ns.vcard('postal-code'), null, subject.doc()));
+    const countryName = termValue(store.any(node, _solidUi.ns.vcard('country-name'), null, subject.doc()));
+    const type = store.any(node, _solidUi.ns.rdf('type'), null, subject.doc());
+    addresses.push({
+      entryNode: node,
+      ...(type ? {
+        type
+      } : {}),
+      streetAddress,
+      locality,
+      region,
+      postalCode,
+      countryName
+    });
+  });
+  return addresses;
+}
+function presentContactInfo(subject, store) {
+  const emails = selectEmails(subject, store);
+  const phones = selectPhones(subject, store);
+  const addresses = selectAddresses(subject, store);
+  return {
+    emails,
+    phones,
+    addresses
+  };
+}

package/lib/sections/contactInfo/types.d.ts

@@ -0,0 +1,44 @@
+import { Node } from 'rdflib';
+import { MutationOps } from '../shared/types';
+export interface PointDetails {
+    entryNode: Node;
+    type: Node;
+    valueNode: Node;
+}
+export interface AddressDetails {
+    entryNode: Node;
+    type?: Node;
+    streetAddress?: string;
+    locality?: string;
+    region?: string;
+    postalCode?: string;
+    countryName?: string;
+}
+export interface ContactInfo {
+    emails: PointDetails[];
+    phones: PointDetails[];
+    addresses: AddressDetails[];
+}
+export type ContactRowStatus = 'existing' | 'new' | 'modified' | 'deleted';
+export type ContactPointRow = {
+    value: string;
+    type: string;
+    entryNode: string;
+    status: ContactRowStatus;
+};
+export type ContactAddressRow = {
+    streetAddress?: string;
+    locality?: string;
+    region?: string;
+    postalCode?: string;
+    countryName?: string;
+    type: string;
+    entryNode: string;
+    status: ContactRowStatus;
+};
+export type ContactMutationPlan = {
+    phoneOps: MutationOps<ContactPointRow>;
+    emailOps: MutationOps<ContactPointRow>;
+    addressOps: MutationOps<ContactAddressRow>;
+};
+//# sourceMappingURL=types.d.ts.map

package/lib/sections/contactInfo/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/sections/contactInfo/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAG7C,MAAM,WAAW,YAAY;IAC3B,SAAS,EAAE,IAAI,CAAC;IAChB,IAAI,EAAE,IAAI,CAAC;IACX,SAAS,EAAE,IAAI,CAAA;CAChB;AACD,MAAM,WAAW,cAAc;IAC7B,SAAS,EAAE,IAAI,CAAC;IAChB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB;AAED,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,SAAS,EAAE,cAAc,EAAE,CAAA;CAC5B;AAED,MAAM,MAAM,gBAAgB,GAAG,UAAU,GAAG,KAAK,GAAG,UAAU,GAAG,SAAS,CAAA;AAE1E,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,gBAAgB,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,EAAE,MAAM,CAAA;IACZ,SAAS,EAAE,MAAM,CAAA;IACjB,MAAM,EAAE,gBAAgB,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,QAAQ,EAAE,WAAW,CAAC,eAAe,CAAC,CAAA;IACtC,QAAQ,EAAE,WAAW,CAAC,eAAe,CAAC,CAAA;IACtC,UAAU,EAAE,WAAW,CAAC,iBAAiB,CAAC,CAAA;CAC3C,CAAA"}

package/lib/sections/contactInfo/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/sections/education/EducationEditDialog.d.ts

@@ -0,0 +1,7 @@
+import { EducationDetails } from './types';
+import '../../styles/EditDialogs.css';
+import '../../styles/ContactInfoEditDialog.css';
+import { LiveStore, NamedNode } from 'rdflib';
+import { ViewerMode } from '../../types';
+export declare function createEducationEditDialog(event: Event, store: LiveStore, subject: NamedNode, educationData: EducationDetails[], viewerMode: ViewerMode, onSaved?: () => Promise<void> | void): Promise<void>;
+//# sourceMappingURL=EducationEditDialog.d.ts.map

package/lib/sections/education/EducationEditDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EducationEditDialog.d.ts","sourceRoot":"","sources":["../../../src/sections/education/EducationEditDialog.ts"],"names":[],"mappings":"AAEA,OAAO,EAAgB,gBAAgB,EAAE,MAAM,SAAS,CAAA;AACxD,OAAO,8BAA8B,CAAA;AACrC,OAAO,wCAAwC,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAA;AAE7C,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AA4bxC,wBAAsB,yBAAyB,CAC7C,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,SAAS,EAClB,aAAa,EAAE,gBAAgB,EAAE,EACjC,UAAU,EAAE,UAAU,EACtB,OAAO,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,iBAwDrC"}