@port60/template-kit 1.0.0 → 1.1.0

package/README.md

@@ -50,11 +50,27 @@ See the [AI quickstart](https://developers.port60.com/guides/ai-quickstart/).
 
 ## The contract
 
-Kit 1.0.0 authors **port60-liquid@2**, content model **2.0**, using the contract under
+Kit 1.1.0 authors **port60-liquid@2**, content model **2.0**, using the contract under
 `src/vendor/contract/v2`. Collection envelopes, independent header/footer navigation,
 resolved actions and page-scoped sections are explicit. V1 sources need a deliberate migration,
 not a manifest-only relabel. Historical v1 contracts remain frozen for existing platform pins.
 
+### Added in 1.1.0
+
+The v2 dialect adds `t` and `local_date`, matching the compatible platform host. Use
+`t: site.locale.code` only for supported interface phrases, not tenant-authored content.
+The initial phrase catalogue is Arabic; unknown phrases or languages preserve the supplied
+text. `local_date` formats English, Welsh or Arabic Gregorian dates in UTC with fixed
+`date` and `datetime` styles. It does not convert the tenant's prayer wall-clock times.
+
+Schedule rows can carry stable `key` values for prayer icons, independently of their supplied
+display names. Shared mobile island styling also uses logical offsets for both directions.
+Historical v1 filters and contracts are unchanged. These additions do not imply complete
+Arabic live-island, typography or legal-copy support.
+
+Deploy the compatible host before uploading templates that use the new filters. Kit 1.0.0
+will correctly reject them. See the [localisation guide](https://developers.port60.com/guides/localisation/).
+
 ## Designer previews
 
 The scaffold creates `preview/config.json` and `preview/media/`. Optional `content` points to

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@port60/template-kit",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "description": "Build Port60 site templates locally: scaffold, live-preview, validate against the platform contract, and package for studio upload. AI-agent ready: every scaffold ships AGENTS.md and validate emits machine-readable JSON.",
   "type": "module",
   "bin": {

package/src/commands/create.mjs

@@ -60,7 +60,7 @@ export function create(args) {
   }, null, 2) + '\n');
   writeFileSync(join(target, 'README.md'), `# ${label}
 
-A Port60 site template using \`port60-liquid@2\`, content model \`2.0\` and kit \`1.0.0\`.
+A Port60 site template using \`port60-liquid@2\`, content model \`2.0\` and kit \`${KIT_PACKAGE.version}\`.
 Existing v1 platform pins keep historical support; this kit accepts v2 authoring only.
 Start with \`npm install\`, then:
 

package/src/lib/agentsMd.mjs

@@ -1,3 +1,7 @@
+import { readFileSync } from 'node:fs';
+
+const KIT_VERSION = JSON.parse(readFileSync(new URL('../../package.json', import.meta.url), 'utf8')).version;
+
 // A contract briefing shared by every generated coding-agent instruction file.
 export function agentsMd(name) {
   return `# Working on the "${name}" Port60 template
@@ -8,7 +12,7 @@ identity, authored content and inline editing markers while changing presentatio
 
 ## Versions and iteration
 
-Use format port60-liquid@2, content model2.0 and kit1.0.0. Existing v1 platform pins retain
+Use format port60-liquid@2, content model 2.0 and kit ${KIT_VERSION}. Existing v1 platform pins retain
 their historical contract; this kit explicitly rejects v1 for new authoring and uploads.
 Never relabel v1 without migrating its reads. Published name/version identities are immutable.
 
@@ -98,6 +102,11 @@ retains its field marker; resolved fallback actions do not.
   not a transfer of route ownership or tenant entitlements.
 - Hero photos need a palette scrim, a carousel for multiple photos and a designed no-photo state.
 - Preserve settings and Looks. Use platform fonts and declared CSS tokens.
+- The host owns lang/dir and Arabic fonts. Use logical CSS properties. Read site.locale.code.
+- The next coordinated kit release adds t for supported interface phrases and local_date for
+  fixed Gregorian date/datetime formatting in UTC. Do not use these on registry kit 1.0.0.
+  Never translate authored text, infer prayer identities from translated names or convert
+  supplied prayer wall-clock strings. Details: /guides/localisation/ in the developer docs.
 - Scope behaviour-dependent hidden content under .p60-js so no-JavaScript stays readable.
 - Keep loops bounded. Test empty collections, cleared text and unknown enum values.
 

package/src/vendor/contract/v2/content-model.json

@@ -746,7 +746,7 @@
       "since": "2.0",
       "cap": 4,
       "moreHref": null,
-      "description": "TYPE-DERIVED recurring schedules. `type` is an OPEN enum; 'worship' is the first (its shape is the layout worship contract: times, labels, today, next). Other institutions arrive as new types; render the types you know, ignore the rest.",
+      "description": "TYPE-DERIVED recurring schedules. `type` is an OPEN enum; 'worship' is the first (times, labels, today, next, jumah). Mosque daily times and next may carry a stable `key`: fajr, zuhr, asr, maghrib or isha. Use key for icons, never replace the supplied name. Missing/unknown keys remain readable without an icon. Friday rows are `jumah`, not `jumuah`. Other institutions arrive as new types; render the types you know, ignore the rest.",
       "item": {
         "type": {
           "type": "string",

package/src/vendor/contract/v2/dialect.json

@@ -88,7 +88,9 @@
     "upcase",
     "url_decode",
     "url_encode",
-    "where"
+    "where",
+    "t",
+    "local_date"
   ],
   "excluded": {
     "tags": [

package/src/vendor/contract/v2.lock.json

@@ -92,7 +92,9 @@
         "upcase",
         "url_decode",
         "url_encode",
-        "where"
+        "where",
+        "t",
+        "local_date"
       ],
       "excluded": {
         "tags": [
@@ -2596,7 +2598,7 @@
           "since": "2.0",
           "cap": 4,
           "moreHref": null,
-          "description": "TYPE-DERIVED recurring schedules. `type` is an OPEN enum; 'worship' is the first (its shape is the layout worship contract: times, labels, today, next). Other institutions arrive as new types; render the types you know, ignore the rest.",
+          "description": "TYPE-DERIVED recurring schedules. `type` is an OPEN enum; 'worship' is the first (times, labels, today, next, jumah). Mosque daily times and next may carry a stable `key`: fajr, zuhr, asr, maghrib or isha. Use key for icons, never replace the supplied name. Missing/unknown keys remain readable without an icon. Friday rows are `jumah`, not `jumuah`. Other institutions arrive as new types; render the types you know, ignore the rest.",
           "item": {
             "type": {
               "type": "string",

package/src/vendor/engine/dialect.mjs

@@ -5,6 +5,8 @@
 // JSON); this module does no file loading.
 
 /** Marker protocol for island placement: the island tag emits these; the renderer splits on them. */
+import { templateMessage, templateDate } from './locale.mjs';
+
 export const ISLAND_MARK_START = '\u0000P60_ISLAND:';
 export const ISLAND_MARK_END = '\u0000';
 
@@ -31,6 +33,8 @@ export function configureDialect(liquid, dialect, islandNames) {
   }
   // Filters LiquidJS ships beyond our whitelist (e.g. its non-standard json/inspect debug filters).
   const allowed = new Set(dialect.filters);
+  if (allowed.has('t')) liquid.registerFilter('t', templateMessage);
+  if (allowed.has('local_date')) liquid.registerFilter('local_date', templateDate);
   for (const name of ['json', 'inspect', 'to_integer', 'normalize_whitespace', 'find', 'find_exp', 'group_by', 'group_by_exp', 'where_exp', 'sum']) {
     if (!allowed.has(name)) {
       liquid.registerFilter(name, () => {

package/src/vendor/engine/locale.mjs

@@ -0,0 +1,74 @@
+// Template interface copy only. Never translate tenant-authored content or source record labels.
+// Plain JS so the host and kit use the exact same implementation, without network or tenant state.
+const arabic = Object.freeze({
+  'Explore': 'تصفّح', 'Menu': 'القائمة', 'Open menu': 'فتح القائمة', 'Close menu': 'إغلاق القائمة',
+  'Skip to content': 'انتقل إلى المحتوى', 'Skip to main content': 'انتقل إلى المحتوى الرئيسي',
+  'Search the website': 'ابحث في الموقع', 'Search this site': 'ابحث في الموقع',
+  'Main': 'التنقل الرئيسي', 'Footer': 'تذييل الصفحة', 'Social links': 'حسابات التواصل',
+  'Cookies': 'ملفات تعريف الارتباط', 'Cookie settings': 'إعدادات ملفات تعريف الارتباط',
+  'Previous image': 'الصورة السابقة', 'Next image': 'الصورة التالية',
+  'Previous campaign': 'الحملة السابقة', 'Next campaign': 'الحملة التالية',
+  'At the mosque': 'في المسجد', 'Prayer times': 'مواقيت الصلاة',
+  'Prayer and Jumuah times': 'مواقيت الصلاة والجمعة', 'Prayer schedule': 'مواقيت الصلاة',
+  'Prayer timetable': 'جدول الصلاة', 'Daily prayer timetable': 'جدول الصلوات اليومية',
+  'Daily prayer times': 'مواقيت الصلوات اليومية', 'Daily prayers': 'الصلوات اليومية',
+  'Prayer': 'الصلاة', 'Jumuah': 'الجمعة', 'Friday prayer': 'صلاة الجمعة',
+  'Friday at the mosque': 'الجمعة في المسجد', 'Prayer information': 'معلومات الصلاة',
+  'Full timetable': 'الجدول الكامل', 'Next:': 'الصلاة القادمة:',
+  'Begins': 'بداية الوقت', 'Congregation': 'الجماعة', 'Jama’at': 'الجماعة',
+  'Read article': 'اقرأ الخبر', 'Read more': 'اقرأ المزيد', 'Find out more': 'اعرف المزيد',
+  'Event details': 'تفاصيل الفعالية', 'View event': 'عرض الفعالية',
+  'View course': 'عرض الدورة', 'Explore course': 'اكتشف الدورة',
+  'View campaign': 'عرض الحملة', 'Explore campaign': 'اكتشف الحملة',
+  'Support this campaign': 'ادعم هذه الحملة', 'Online': 'عبر الإنترنت',
+  'Tickets not on sale': 'التذاكر غير متاحة للبيع', 'Sold out': 'اكتمل العدد',
+  'Free': 'مجاناً', 'From': 'من', 'Registration': 'التسجيل', 'Tickets': 'تذاكر',
+  'Get tickets': 'احجز تذكرتك', 'Book a place': 'احجز مكانك',
+  'Download': 'تنزيل', 'Read document': 'اقرأ المستند', 'View document': 'عرض المستند',
+  'All articles': 'جميع الأخبار', 'All events': 'جميع الفعاليات', 'All courses': 'جميع الدورات',
+  'All campaigns': 'جميع الحملات', 'All services': 'جميع الخدمات',
+  'Article': 'خبر', 'Course': 'دورة', 'Campaign': 'حملة', 'Service': 'خدمة',
+  'Article unavailable': 'الخبر غير متاح', 'Course unavailable': 'الدورة غير متاحة',
+  'This article is not available to view.': 'هذا الخبر غير متاح للعرض.',
+  'This course is not available to view.': 'هذه الدورة غير متاحة للعرض.',
+  'Browse': 'تصفّح', 'Browse courses': 'تصفّح الدورات', 'Back to': 'العودة إلى',
+  'Availability': 'التوفّر', 'Course details': 'تفاصيل الدورة', 'Course options': 'خيارات الدورة',
+  'Course enrolment': 'التسجيل في الدورة', 'Open article photograph': 'فتح صورة الخبر',
+  'Children': 'الأطفال', 'Adults': 'البالغون', 'Families': 'العائلات', 'Everyone': 'الجميع',
+  'Starts': 'البداية', 'Ends': 'النهاية', 'Monthly': 'شهرياً', 'One payment': 'دفعة واحدة',
+  'No places currently available': 'لا توجد أماكن متاحة حالياً', 'Not supplied': 'غير محدد',
+  'Payment': 'الدفع', 'Price': 'السعر', 'Term fee': 'رسوم الفصل', 'Updated': 'آخر تحديث',
+  'Where': 'المكان', 'Who it is for': 'الفئة المستهدفة', 'Open document': 'فتح المستند',
+  'Word document': 'مستند Word', 'Support this appeal': 'ادعم هذا النداء',
+  'View available sessions and enrolment details.': 'اطّلع على الجلسات المتاحة وتفاصيل التسجيل.',
+  'min read': 'دقائق للقراءة', '% of target reached': '% من الهدف',
+});
+
+export const templateMessageKeys = Object.freeze(Object.keys(arabic));
+const language = value => typeof value === 'string' && value.length <= 35
+  ? value.toLowerCase().split('-')[0] : 'en';
+
+/** Unknown copy/languages retain the supplied English UI fallback. Output remains autoescaped. */
+export function templateMessage(message, locale) {
+  if (typeof message !== 'string') return '';
+  return language(locale) === 'ar' && Object.hasOwn(arabic, message) ? arabic[message] : message;
+}
+
+// Exactly six formatter instances at most. No per-tenant or arbitrary-pattern cache growth.
+const formatters = new Map();
+export function templateDate(value, locale, style = 'date') {
+  // A timestamp needs an explicit offset. Date.parse on a zone-less timestamp would depend
+  // on the kit author's machine rather than the host's UTC rendering contract.
+  if (typeof value !== 'string' || value.length > 64 || !/^\d{4}-\d{2}-\d{2}(?:T\d{2}:\d{2}(?::\d{2}(?:\.\d{1,9})?)?(?:Z|[+-]\d{2}:\d{2}))?$/.test(value)) return '';
+  const timestamp = Date.parse(value);
+  if (!Number.isFinite(timestamp) || !['date', 'datetime'].includes(style)) return '';
+  const day = value.slice(0, 10);
+  if (new Date(Date.parse(`${day}T00:00:00Z`)).toISOString().slice(0, 10) !== day) return '';
+  const lang = ['ar', 'cy'].includes(language(locale)) ? language(locale) : 'en-GB';
+  const key = `${lang}:${style}`;
+  if (!formatters.has(key)) formatters.set(key, new Intl.DateTimeFormat(lang, {
+    calendar: 'gregory', timeZone: 'UTC', day: '2-digit', month: 'long', year: 'numeric',
+    ...(style === 'datetime' ? { hour: '2-digit', minute: '2-digit', hourCycle: 'h23' } : {}),
+  }));
+  return formatters.get(key).format(timestamp);
+}

package/src/vendor/validator/platform-base.css

@@ -1064,11 +1064,10 @@ textarea.p60-form-control {
    escapes ANY wrapper depth; layouts here are symmetric, so the sheet lands exactly 0..100vw. */
 @media (max-width: 640px) {
   .donate-card {
-    width: 100vw;
-    margin-left: calc(50% - 50vw);
+    inline-size: 100vw;
+    margin-inline-start: calc(50% - 50vw);
     border-radius: 0;
-    border-left: 0;
-    border-right: 0;
+    border-inline: 0;
     padding: 1.4rem 1.1rem;
   }
 }
@@ -2368,14 +2367,14 @@ html:has(.donation-giftaid-dialog[open]) { overflow: hidden; }
 @media (max-width: 640px) {
   .article-grid {
     display: flex;
-    width: 100vw;
-    margin-left: calc(50% - 50vw);
+    inline-size: 100vw;
+    margin-inline-start: calc(50% - 50vw);
     overflow-x: auto;
     -webkit-overflow-scrolling: touch;
     scroll-snap-type: x proximity;
     gap: 0.9rem;
     padding: 0.2rem 22px 0.6rem;
-    scroll-padding-left: 22px;
+    scroll-padding-inline-start: 22px;
     scrollbar-width: none;
   }
   .article-grid::-webkit-scrollbar { display: none; }
@@ -2779,8 +2778,8 @@ html:has(.donation-giftaid-dialog[open]) { overflow: hidden; }
 @media (max-width: 640px) {
   .events-carousel {
     position: relative;
-    width: 100vw;
-    margin-left: calc(50% - 50vw);
+    inline-size: 100vw;
+    margin-inline-start: calc(50% - 50vw);
     gap: 0;
   }
   .events-carousel .carousel-slide { border-radius: 0; }
@@ -5031,8 +5030,8 @@ html:has(.donation-giftaid-dialog[open]) { overflow: hidden; }
    Cooperative gestures keep page-scrolling safe over the full-width canvas. */
 @media (max-width: 640px) {
   .impact-map-stage {
-    width: 100vw;
-    margin-left: calc(50% - 50vw);
+    inline-size: 100vw;
+    margin-inline-start: calc(50% - 50vw);
     border-radius: 0;
   }
 }