@rathnasgala/theme 0.0.12 → 0.0.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rathnasgala/theme",
-  "version": "0.0.12",
+  "version": "0.0.14",
   "description": "Managed Gala static-site theme payload",
   "license": "MIT",
   "repository": {

package/payload/.gala/managed-files.json

@@ -2,49 +2,50 @@
   "schemaVersion": 1,
   "themePackage": {
     "name": "@rathnasgala/theme",
-    "version": "0.0.12",
+    "version": "0.0.14",
     "availableDesignThemes": [
       "editorial"
     ],
     "securityAdvisories": []
   },
   "files": {
-    ".gitignore": "b5fa24e10155097a0d372926fd2e59e6072e7cc2cb6399bbfb4beb8b33ea315b",
     ".gala/publish.yml.template": "73080241d89bd09964b797a8bcc8e18471412e11bc873efad76305b60f497d08",
+    ".gitignore": "b5fa24e10155097a0d372926fd2e59e6072e7cc2cb6399bbfb4beb8b33ea315b",
     "eleventy.config.js": "efe587447e3dc374a220c7fa037fdf2fffc02d09ba43a4d2b96d6c6aae0e3325",
-    "package.json": "cccea6fc4edf4b4b653bd5cfc0901ab20dd92ac8975408fb01ae3670005da641",
-    "package-lock.json": "c97a6a2f794aef083a39a8d2628eccc4a3c484e1c6225899b77ec1fb7c466d9e",
     "lib/build-manifest.js": "88949f0112d683ca809bb67ca969e15634792423559a67bc79a534cd807e5535",
-    "lib/site-config.js": "ab7cc170dc30c74ea5ef08b8ff6a82f9820998ae4190a06d64375dfd7d515864",
-    "lib/performance-budget.js": "124c43494c092a956accec46d1463ea063ed73363d0db01f24aaea987459d683",
     "lib/engagement-snapshot.js": "298c11b1ab135a3a98a4e31b6320ab60dfd7fda6a9d9053df37d86282a5a6687",
+    "lib/performance-budget.js": "124c43494c092a956accec46d1463ea063ed73363d0db01f24aaea987459d683",
+    "lib/provider-fixtures/embeds.v1.json": "5f26909fb433135321ddf7fdd14e45aeb702805c88f5676941166c5735143ee2",
+    "lib/provider-fixtures/share-intents.v1.json": "66a8eedfcff711253ee45ceb94b53f7d5a6be3ddbbb3d1f0d4e31a114326cc0a",
     "lib/publication-state.js": "1b59c29a18bbb1193bddea898dac3a4fb832c7bc4751263be086f3d64392dea0",
     "lib/render-markdown.js": "40e6d6743b76de6c16d138475f188a4263967530c370d8b26a363f4df58c2caf",
     "lib/seo.js": "107de8804931945b8e73894877fc394d6b535a9d0d969a4ba5b68f2e136e0a17",
     "lib/share-targets.js": "458aff86fab2b62a364442cd8c612565c6e0b53eef2f20cb6237cc562b1e0731",
-    "lib/provider-fixtures/embeds.v1.json": "5f26909fb433135321ddf7fdd14e45aeb702805c88f5676941166c5735143ee2",
-    "lib/provider-fixtures/share-intents.v1.json": "66a8eedfcff711253ee45ceb94b53f7d5a6be3ddbbb3d1f0d4e31a114326cc0a",
+    "lib/site-config.js": "ab7cc170dc30c74ea5ef08b8ff6a82f9820998ae4190a06d64375dfd7d515864",
+    "package-lock.json": "c97a6a2f794aef083a39a8d2628eccc4a3c484e1c6225899b77ec1fb7c466d9e",
+    "package.json": "4c60bea06f39aec755ac68caf8d8841c1d59d0f6121fad7f4396231ce14712dc",
     "src/404.njk": "be0d44370ac5402156aaf3d32ea581057bc61ec94c1a5f92bb809733af7a8a20",
-    "src/_includes/layouts/base.njk": "1bd300b68db1786b593ae5ef4325d68f21a5c79a78ac1cb3aba09fdba57bec9d",
-    "src/_includes/layouts/post.njk": "1accd2832064ad19ee7bf18daf5fa1e60569f32c9b7a547934a6361f747d7eb7",
-    "src/_includes/components/ui.njk": "de062ca818759edb53dc5e94ab839ac9453fda1fe458c61c04d9d89ef880c6af",
     "src/_data/buildManifest.js": "628163305984e0d3537e27b0d4050f5ba5ead12a834878266d2ce8004ffe1b1e",
     "src/_data/engagementSnapshot.js": "9217dacebfaf008f7a0ad67ff4e8d1fa8fba609a9dc7e3430c78c5b32024da0e",
     "src/_data/feedLinks.js": "06c93352ebd888acb431a1c9a8be6ecff757895468e9f2d336761038751c2d5e",
     "src/_data/languages.js": "1358748f7fa2f74406d3295a030827d6229a53e94da72cf712e719d7a356aeac",
     "src/_data/site.js": "d9c001f4cc12a34027dd92303530b11b5402d47613459bb997e22c4bcbea326d",
-    "src/assets/theme-mode.js": "3797c84dbaa090b5b21427a31928b5dd97f13d04d99833f5e1e74c6b50e01dcc",
-    "src/assets/interactions.js": "3cd88a919bde8b894fe8509be8db1b07ddd9459df8b31dac83bf9b0215cd73df",
+    "src/_includes/components/ui.njk": "b95eca21eb78182989c114f8d03342769553470672e7402e1330e9070c293ff5",
+    "src/_includes/layouts/base.njk": "d132b0a920e3dd9b60543394da4498b4d25b3821bdaaea0b3a5da55e9200b663",
+    "src/_includes/layouts/post.njk": "1accd2832064ad19ee7bf18daf5fa1e60569f32c9b7a547934a6361f747d7eb7",
     "src/assets/embed-codepen.svg": "e9def697f38c466fb2b6652535c4c814e8cbbbefc6e052a69f335aeb27e8356b",
     "src/assets/embed-gist.svg": "fcd9bc2bf29a5c118492b853c0a01390b7539c38ddb985da3c2a6e2f246a39f7",
     "src/assets/embed-x.svg": "0ae74edc6790ec7e933067fe5392bce756e93fa7ad71caacf1c1ca99fa4ec9b6",
     "src/assets/embed-youtube.svg": "10d192f2b14b67664fea88c8cf246321d20190def51d59fad5762e552219b067",
+    "src/assets/interactions.js": "fafa38854663f840fb4eb206d3ca06a836abf36bedb035a4e8ac211805709f09",
     "src/assets/preferences.js": "789127bee013ed6a1bbf8cefd7b9109291c16220e7a6e09314e3c93c54731d1d",
     "src/assets/search.js": "df425f0239277792ad39f2138bc89cb66cc4ecda5ed59042d46abc2f05372088",
+    "src/assets/theme-mode.js": "3797c84dbaa090b5b21427a31928b5dd97f13d04d99833f5e1e74c6b50e01dcc",
     "src/assets/theme.css": "2c835fb79531d7b4a71bc2d41a6deb6e6b3689bf8603d903a3ba93add66c0d60",
+    "src/cname.11ty.js": "206fc224df91c569e18312158e7f69803061f2952513f501ada54bd06c4f8006",
     "src/contact.njk": "f4d74d038781e15af0acef571901c91e7753a2e21b6bef617429585698839a34",
-    "src/index.njk": "5c313f0fcdad3ddbfb79376bc9671b3f37539ef70c14bdbbd26d6e2e6de250e8",
     "src/feed.11ty.js": "009bd2384e08e02a9405683bab1653bab3aeaec16accb0fd01ba69b24c777da9",
+    "src/index.njk": "5c313f0fcdad3ddbfb79376bc9671b3f37539ef70c14bdbbd26d6e2e6de250e8",
     "src/languages.11ty.js": "399559199c65570d7d5efd88e20254838e316f81c06d7b28ec34990e963db915",
     "src/posts.11ty.js": "89c0e4742a67cd03f9fd13c8c8d4ca56375d97628b3cb439af7f9c92c240104a",
     "src/redirects.11ty.js": "3c163246a59f5364861db6a6f05ae88afc938a5379d86cf42776d8d49b0031f3",

package/payload/package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "build": "eleventy",
     "test": "node --test",
-    "lint": "node --check eleventy.config.js && node --check lib/build-manifest.js && node --check lib/engagement-snapshot.js && node --check lib/performance-budget.js && node --check lib/publication-state.js && node --check lib/render-markdown.js && node --check lib/seo.js && node --check lib/share-targets.js && node --check lib/site-config.js && node --check scripts/push.js && node --check src/_data/buildManifest.js && node --check src/_data/engagementSnapshot.js && node --check src/_data/feedLinks.js && node --check src/_data/languages.js && node --check src/_data/site.js && node --check src/assets/interactions.js && node --check src/assets/preferences.js && node --check src/assets/search.js && node --check src/assets/theme-mode.js && node --check src/feed.11ty.js && node --check src/languages.11ty.js && node --check src/posts.11ty.js && node --check src/redirects.11ty.js && node --check src/search-index.11ty.js && node --check src/sitemap.11ty.js && node --check test/build-manifest.test.js && node --check test/component-contract.test.js && node --check test/config.test.js && node --check test/eleventy-manifest-build.test.js && node --check test/engagement-client.test.js && node --check test/engagement-snapshot.test.js && node --check test/feed.test.js && node --check test/fixtures/xss-payloads.js && node --check test/managed-files.test.js && node --check test/performance-budget.test.js && node --check test/preferences.test.js && node --check test/publication-state.test.js && node --check test/render-markdown.test.js && node --check test/search.test.js && node --check test/seo.test.js && node --check test/share-targets.test.js && node --check test/supporting-surfaces.test.js && node --check test/theme-contract.test.js && node --check test/theme-contrast.test.js && node --check test/theme-mode.test.js && node --check test/theme-release-workflow.test.js",
+    "lint": "node --check eleventy.config.js && node --check lib/build-manifest.js && node --check lib/engagement-snapshot.js && node --check lib/performance-budget.js && node --check lib/publication-state.js && node --check lib/render-markdown.js && node --check lib/seo.js && node --check lib/share-targets.js && node --check lib/site-config.js && node --check scripts/push.js && node --check src/_data/buildManifest.js && node --check src/_data/engagementSnapshot.js && node --check src/_data/feedLinks.js && node --check src/_data/languages.js && node --check src/_data/site.js && node --check src/assets/interactions.js && node --check src/assets/preferences.js && node --check src/assets/search.js && node --check src/assets/theme-mode.js && node --check src/cname.11ty.js && node --check src/feed.11ty.js && node --check src/languages.11ty.js && node --check src/posts.11ty.js && node --check src/redirects.11ty.js && node --check src/search-index.11ty.js && node --check src/sitemap.11ty.js && node --check test/build-manifest.test.js && node --check test/cname.test.js && node --check test/component-contract.test.js && node --check test/config.test.js && node --check test/eleventy-manifest-build.test.js && node --check test/engagement-client.test.js && node --check test/engagement-snapshot.test.js && node --check test/feed.test.js && node --check test/fixtures/xss-payloads.js && node --check test/managed-files.test.js && node --check test/performance-budget.test.js && node --check test/preferences.test.js && node --check test/publication-state.test.js && node --check test/render-markdown.test.js && node --check test/search.test.js && node --check test/seo.test.js && node --check test/share-targets.test.js && node --check test/supporting-surfaces.test.js && node --check test/theme-contract.test.js && node --check test/theme-contrast.test.js && node --check test/theme-mode.test.js && node --check test/theme-release-workflow.test.js",
     "push": "node scripts/push.js"
   },
   "engines": {

package/payload/src/_includes/components/ui.njk

@@ -21,7 +21,16 @@
      at the moment of intent, and the intent is replayed once they are back. #}
   <section class="gala-engagement-actions" aria-label="Reader actions" data-engagement-actions>
     <div class="gala-reaction-actions" role="group" aria-label="React to this article">
-      {% for reaction in ['like', 'love', 'insightful', 'curious', 'celebrate', 'support'] %}<button type="button" data-reaction="{{ reaction }}" aria-pressed="false">{{ reaction | capitalize }}</button>{% endfor %}
+      {# The six the platform actually stores (io.gala.api.engagement.ReactionType). Offering
+         any other name renders a button that can only ever fail on the way to the API. #}
+      {% for reaction in [
+        { value: 'like', label: 'Like' },
+        { value: 'insightful', label: 'Insightful' },
+        { value: 'celebrate', label: 'Celebrate' },
+        { value: 'funny', label: 'Funny' },
+        { value: 'mind-blown', label: 'Mind blown' },
+        { value: 'thank-you', label: 'Thank you' }
+      ] %}<button type="button" data-reaction="{{ reaction.value }}" aria-pressed="false">{{ reaction.label }}</button>{% endfor %}
     </div>
     <button type="button" data-follow-article aria-pressed="false">Follow article</button>
     <form data-comment-create>

package/payload/src/_includes/layouts/base.njk

@@ -56,11 +56,14 @@
     <main id="main-content">{{ content | safe }}</main>
     <footer class="gala-page-footer">
       <p>&copy; {{ site.site.name }}</p>
-      {# Which footer the click came from, which language it was read in, and whose site it was.
-         site.id is the identifier available to a built page and resolves to its owner. #}
+      {# Which repository sent the traffic, which footer the click came from, which language it
+         was read in, and which author owns it. Sites registered before these managed values
+         existed fall back rather than emitting the literal placeholder. #}
       {% set galaLinkPlacement = 'article-footer' if post else 'site-footer' %}
       {% set galaLinkLanguage = post.language or site.site.defaultLanguage %}
-      {% if attributionTier != 'PAID' %}<p><a href="https://gala67.com/?utm_source=gala-site&amp;utm_medium=referral&amp;utm_campaign=built-with-gala&amp;utm_content={{ galaLinkPlacement | urlencode }}&amp;utm_term={{ galaLinkLanguage | urlencode }}&amp;utm_id={{ site.site.id | urlencode }}" rel="external">Built with Gala</a></p>{% endif %}
+      {% set galaLinkSource = site.site.repository if site.site.repository and site.site.repository != 'unavailable' else 'gala-site' %}
+      {% set galaLinkOwner = site.site.ownerId if site.site.ownerId and site.site.ownerId != 'unavailable' else site.site.id %}
+      {% if attributionTier != 'PAID' %}<p><a href="https://gala67.com/?utm_source={{ galaLinkSource | urlencode }}&amp;utm_medium=referral&amp;utm_campaign=built-with-gala&amp;utm_content={{ galaLinkPlacement | urlencode }}&amp;utm_term={{ galaLinkLanguage | urlencode }}&amp;utm_id={{ galaLinkOwner | urlencode }}" rel="external">Built with Gala</a></p>{% endif %}
     </footer>
     <dialog id="gala-settings-dialog" class="gala-dialog" aria-labelledby="gala-settings-title">
       <form method="dialog" class="gala-dialog__close"><button type="submit" aria-label="Close settings">Close</button></form>

package/payload/src/assets/interactions.js

@@ -39,7 +39,10 @@ document.addEventListener('click', async (event) => {
   if (reaction) {
     const region = reaction.closest('[data-engagement-url]');
     if (!region) return;
-    if (!sessionUser) return requestSession({ kind: 'reaction', element: reaction });
+    if (!sessionUser) {
+      return requestSession({ kind: 'reaction', region,
+        selector: `[data-reaction="${reaction.dataset.reaction}"]` });
+    }
     const active = reaction.getAttribute('aria-pressed') !== 'true';
     const saved = await mutateEngagement(region, active ? 'reaction.add' : 'reaction.remove', {
       articleId: region.dataset.articleId,
@@ -54,7 +57,9 @@ document.addEventListener('click', async (event) => {
   if (follow) {
     const region = follow.closest('[data-engagement-url]');
     if (!region) return;
-    if (!sessionUser) return requestSession({ kind: 'follow', element: follow });
+    if (!sessionUser) {
+      return requestSession({ kind: 'follow', region, selector: '[data-follow-article]' });
+    }
     const active = follow.getAttribute('aria-pressed') !== 'true';
     const saved = await mutateEngagement(region, active ? 'follow.add' : 'follow.remove', {
       targetType: 'articles', targetId: region.dataset.articleId
@@ -358,7 +363,13 @@ function recordView(region) {
 document.addEventListener('focusin', (event) => {
   if (sessionUser || pendingIntent) return;
   const field = event.target.closest('[data-comment-create] textarea, [data-comment-editor] textarea');
-  if (field) requestSession({ kind: 'comment', element: field });
+  if (!field) return;
+  const region = field.closest('[data-engagement-url]');
+  const form = field.closest('[data-comment-create], [data-comment-editor]');
+  if (!region || !form) return;
+  requestSession({ kind: 'comment', region,
+    selector: `${form.matches('[data-comment-create]') ? '[data-comment-create]' : '[data-comment-editor]'} textarea`,
+    field });
 });
 
 document.addEventListener('submit', async (event) => {
@@ -371,7 +382,9 @@ document.addEventListener('submit', async (event) => {
   const body = form.elements.body?.value;
   if (!region || typeof body !== 'string' || body.trim() === '') return;
   if (!sessionUser) {
-    return requestSession({ kind: 'comment', element: form.querySelector('textarea') });
+    return requestSession({ kind: 'comment', region,
+      selector: `${create ? '[data-comment-create]' : '[data-comment-editor]'} textarea`,
+      field: form.querySelector('textarea') });
   }
   if (create) {
     const saved = await mutateEngagement(region, 'comment.create', {
@@ -407,13 +420,14 @@ const pendingEngagementWrites = new Map();
 let pendingIntent = null;
 
 function requestSession(intent) {
-  const field = intent.element;
+  const field = intent.field;
   pendingIntent = {
     kind: intent.kind,
-    element: field,
+    region: intent.region,
+    selector: intent.selector,
     // Held here rather than left in the DOM, because signing in re-renders the region.
-    draft: field && 'value' in field ? field.value : null,
-    caret: field && 'selectionStart' in field ? field.selectionStart : null
+    draft: field ? field.value : null,
+    caret: field ? field.selectionStart : null
   };
   // One window, not three. Asking used to open a modal, containing a frame, containing a
   // button, that opened a popup. The popup is the only part that has to exist, because it is
@@ -424,7 +438,7 @@ function requestSession(intent) {
   const source = new URL(frame.getAttribute('src'), window.location.href);
   const signIn = new URL('/v1/widget/session/sign-in', source.origin);
   signIn.searchParams.set('siteId', source.searchParams.get('siteId') ?? '');
-  if (field && typeof field.blur === 'function') field.blur();
+  if (field) field.blur();
   if (!window.open(signIn, 'gala-sign-in', 'popup,width=520,height=680')) {
     pendingIntent = null;
     if (status) status.textContent = 'Allow pop-ups for this site to sign in, then try again.';
@@ -434,14 +448,19 @@ function requestSession(intent) {
 /** Puts the reader back exactly where the sign-in interrupted them. */
 function resumeIntent() {
   const intent = pendingIntent;
-  pendingIntent = null;
   if (!intent) return;
-  const element = intent.element;
-  if (!element || !element.isConnected) return;
+  // The sign-in window is still closing at the moment the session arrives, so focus set now
+  // would be handed straight back to it. Wait until this page actually holds focus.
+  if (!document.hasFocus()) return;
+  // Re-found rather than remembered: signing in re-renders the engagement region, so a node
+  // captured before the interruption may no longer be the one on the page.
+  const element = intent.region?.querySelector(intent.selector);
+  if (!element) return;
+  pendingIntent = null;
   if (intent.kind === 'comment') {
-    if ('value' in element && intent.draft != null && element.value === '') element.value = intent.draft;
+    if (intent.draft != null && element.value === '') element.value = intent.draft;
     element.focus();
-    if (intent.caret != null && 'setSelectionRange' in element) {
+    if (intent.caret != null && typeof element.setSelectionRange === 'function') {
       element.setSelectionRange(intent.caret, intent.caret);
     }
     return;
@@ -451,6 +470,12 @@ function resumeIntent() {
   element.click();
 }
 
+// Signing in happens in another window, so the moment this one is focused again is the moment
+// the reader is back and the interrupted action can be finished.
+window.addEventListener('focus', () => {
+  if (sessionUser && pendingIntent) resumeIntent();
+});
+
 document.querySelectorAll('[data-engagement-url]').forEach((region) => {
   refreshEngagement(region);
   recordView(region);

package/payload/src/cname.11ty.js

@@ -0,0 +1,53 @@
+/**
+ * Emits the CNAME file GitHub Pages needs to serve a custom domain.
+ *
+ * The published branch is force-pushed on every run, so anything not produced by the build is
+ * gone the next time someone writes a post. Deriving it from the site configuration means the
+ * custom domain is restated on every publish and cannot be lost, and there is exactly one place
+ * that decides what the domain is.
+ */
+const PROVIDER_HOST = /\.github\.io$/;
+
+/**
+ * The host this repository may claim as its own, or null.
+ *
+ * A site served under a path is served that way because GitHub gives it the domain held by the
+ * owner's main site — https://docs.github.com/en/pages/configuring-a-custom-domain-for-your-github-pages-site/about-custom-domains-and-github-pages
+ * puts a project site at `www.octocat.com/octo-project`. GitHub reads this file from the
+ * published branch and treats it as *this* repository's own domain, which overrides that
+ * inheritance: the blog would move to the domain root and take the address away from the site
+ * that owns it. So a path-prefixed site deliberately claims nothing.
+ */
+export function customDomainHost(canonicalBaseUrl, pathPrefix = '/') {
+  if (pathPrefix !== '/') return null;
+  if (typeof canonicalBaseUrl !== 'string' || canonicalBaseUrl === '') return null;
+  let host;
+  try {
+    host = new URL(canonicalBaseUrl).host;
+  } catch {
+    return null;
+  }
+  // A provider-default site is served from the owner's github.io origin and must not claim a
+  // custom domain, or GitHub would reject a domain it cannot verify.
+  return PROVIDER_HOST.test(host) ? null : host;
+}
+
+function claimed(site) {
+  return customDomainHost(site?.hosting?.canonicalBaseUrl, site?.hosting?.pathPrefix ?? '/');
+}
+
+export default class CustomDomain {
+  data() {
+    return {
+      permalink: ({ site }) => claimed(site) ? '/CNAME' : false,
+      // GitHub Pages requires this exact extensionless name, so Eleventy's guard against
+      // extensionless output does not apply here.
+      eleventyAllowMissingExtension: true,
+      eleventyExcludeFromCollections: true
+    };
+  }
+
+  render({ site }) {
+    return `${claimed(site)}\n`;
+  }
+}