@jxsuite/starters 1.2.1 → 1.6.0

package/sites/museum/pages/fr-ca/expositions/[slug].json

@@ -0,0 +1,215 @@
+{
+  "$translationKey": "exhibitions/${slug}",
+  "$layout": "./layouts/fr-ca.json",
+  "$paths": {
+    "contentType": "exhibitions",
+    "param": "slug",
+    "field": "id"
+  },
+  "title": "${state.entry.data.title} — Atrium",
+  "description": "${state.entry.data.description}",
+  "$head": [
+    {
+      "tagName": "meta",
+      "attributes": { "name": "description", "content": "${state.entry.data.description}" }
+    }
+  ],
+  "state": {
+    "entry": {
+      "$prototype": "ContentEntry",
+      "$src": "@jxsuite/parser/ContentEntry.class.json",
+      "contentType": "exhibitions",
+      "field": "id",
+      "id": { "$ref": "#/$params/slug" }
+    },
+    "opens": {
+      "$expression": {
+        "operator": "call",
+        "target": { "$ref": "window#/Intl/formatDate" },
+        "value": [
+          { "$ref": "#/state/entry/data/date" },
+          null,
+          { "day": "numeric", "month": "long", "year": "numeric" }
+        ]
+      }
+    },
+    "closes": {
+      "$expression": {
+        "operator": "call",
+        "target": { "$ref": "window#/Intl/formatDate" },
+        "value": [
+          { "$ref": "#/state/entry/data/until" },
+          null,
+          { "day": "numeric", "month": "long", "year": "numeric" }
+        ]
+      }
+    },
+    "works": {
+      "$expression": {
+        "operator": "call",
+        "target": { "$ref": "window#/Intl/formatNumber" },
+        "value": [{ "$ref": "#/state/entry/data/works" }]
+      }
+    }
+  },
+  "children": [
+    {
+      "tagName": "article",
+      "children": [
+        {
+          "tagName": "mu-pagehead",
+          "$props": {
+            "kicker": "${state.entry.data.gallery}",
+            "title": "${state.entry.data.title}",
+            "standfirst": "${state.entry.data.description}",
+            "metaLabel": "Commissariat",
+            "metaValue": "${state.entry.data.curator}"
+          }
+        },
+        {
+          "tagName": "mu-band",
+          "$props": { "index": "01", "label": "L'exposition", "tone": "chalk" },
+          "children": [
+            {
+              "tagName": "div",
+              "style": {
+                "display": "grid",
+                "gridTemplateColumns": "minmax(0, 1.35fr) minmax(0, 0.75fr)",
+                "columnGap": "clamp(2rem, 5vw, 4rem)",
+                "alignItems": "start",
+                "@--md": { "gridTemplateColumns": "minmax(0, 1fr)", "rowGap": "2.5rem" }
+              },
+              "children": [
+                {
+                  "tagName": "div",
+                  "style": {
+                    "maxWidth": "var(--measure)",
+                    "fontSize": "1.08rem",
+                    "lineHeight": "1.8"
+                  },
+                  "children": {
+                    "$prototype": "Array",
+                    "items": { "$ref": "#/state/entry/$children" },
+                    "map": {
+                      "tagName": "p",
+                      "style": { "margin": "0 0 1.35rem" },
+                      "textContent": "${item.textContent}"
+                    }
+                  }
+                },
+                {
+                  "tagName": "aside",
+                  "style": {
+                    "border": "2px solid var(--color-ink)",
+                    "backgroundColor": "var(--color-card)",
+                    "padding": "clamp(1.1rem, 2.5vw, 1.6rem)"
+                  },
+                  "children": [
+                    {
+                      "tagName": "p",
+                      "style": {
+                        "margin": "0 0 0.5rem",
+                        "fontFamily": "var(--font-label)",
+                        "fontSize": "0.64rem",
+                        "letterSpacing": "var(--label-tracking)",
+                        "textTransform": "var(--label-case)",
+                        "color": "var(--color-muted)"
+                      },
+                      "textContent": "Cartel"
+                    },
+                    {
+                      "tagName": "div",
+                      "attributes": { "aria-hidden": "true" },
+                      "style": {
+                        "aspectRatio": "4 / 3",
+                        "border": "2px solid var(--color-ink)",
+                        "marginBlockEnd": "1.1rem",
+                        "background": "radial-gradient(circle at 62% 40%, hsl(${state.entry.data.hue} 55% 45%) 0 31%, transparent 31.5%), repeating-linear-gradient(${state.entry.data.hue}deg, var(--color-chalk-deep) 0 9px, var(--color-card) 9px 18px)"
+                      }
+                    },
+                    {
+                      "tagName": "mu-fact",
+                      "$props": {
+                        "term": "Ouverture",
+                        "value": "${state.opens}",
+                        "layout": "stack"
+                      }
+                    },
+                    {
+                      "tagName": "mu-fact",
+                      "$props": { "term": "Clôture", "value": "${state.closes}", "layout": "stack" }
+                    },
+                    {
+                      "tagName": "mu-fact",
+                      "$props": { "term": "Objets", "value": "${state.works}", "layout": "stack" }
+                    },
+                    {
+                      "tagName": "mu-fact",
+                      "$props": {
+                        "term": "Où",
+                        "value": "${state.entry.data.gallery}",
+                        "layout": "stack"
+                      }
+                    },
+                    {
+                      "tagName": "mu-fact",
+                      "$props": {
+                        "term": "Commissaire",
+                        "value": "${state.entry.data.curator}",
+                        "layout": "stack"
+                      }
+                    },
+                    {
+                      "tagName": "p",
+                      "style": {
+                        "margin": "1.25rem 0 0",
+                        "paddingBlockStart": "0.9rem",
+                        "borderBlockStart": "1px solid var(--color-hairline)",
+                        "fontSize": "0.9rem",
+                        "lineHeight": "1.6",
+                        "color": "var(--color-muted)"
+                      },
+                      "textContent": "Chaque cartel de cette salle est écrit en trois langues, à longueur égale. Rien n'est abrégé pour le mur le plus court."
+                    }
+                  ]
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "tagName": "mu-band",
+          "$props": { "index": "02", "label": "Aussi à l'affiche", "tone": "card" },
+          "children": [
+            {
+              "tagName": "p",
+              "style": {
+                "margin": "0 0 1.5rem",
+                "lineHeight": "1.75",
+                "maxWidth": "var(--measure)"
+              },
+              "textContent": "Deux autres expositions sont ouvertes en même temps, et le même billet — aucun — donne accès aux trois."
+            },
+            {
+              "tagName": "mu-more",
+              "$props": {
+                "label": "Toute la programmation",
+                "href": "/fr-ca/expositions/"
+              }
+            }
+          ]
+        },
+        {
+          "tagName": "mu-cta",
+          "$props": {
+            "kicker": "Entrée libre",
+            "heading": "C'est au rez-de-chaussée, et c'est ouvert en ce moment.",
+            "text": "De dix heures à six heures, du mardi au dimanche. Entrez par le côté du quai et tournez à gauche au mur de la douane.",
+            "label": "Préparer sa visite",
+            "href": "/fr-ca/visite/"
+          }
+        }
+      ]
+    }
+  ]
+}

package/sites/museum/pages/fr-ca/expositions/index.json

@@ -0,0 +1,104 @@
+{
+  "$translationKey": "exhibitions",
+  "$layout": "./layouts/fr-ca.json",
+  "title": "Expositions — Atrium",
+  "description": "La programmation en cours à Atrium : trois expositions puisées dans la collection de la ville, avec dates, salles et commissaires.",
+  "$head": [
+    {
+      "tagName": "meta",
+      "attributes": {
+        "name": "description",
+        "content": "La programmation en cours à Atrium : trois expositions puisées dans la collection de la ville, avec dates, salles et commissaires."
+      }
+    }
+  ],
+  "state": {
+    "shows": {
+      "$prototype": "ContentCollection",
+      "$src": "@jxsuite/parser/ContentCollection.class.json",
+      "contentType": "exhibitions",
+      "filter": [{ "field": "lang", "op": "==", "value": "fr-CA" }],
+      "sort": [{ "field": "order", "order": "asc" }]
+    }
+  },
+  "children": [
+    {
+      "tagName": "mu-pagehead",
+      "$props": {
+        "kicker": "Programmation",
+        "title": "Ce qui est accroché, et jusqu'à quand",
+        "standfirst": "Trois expositions se tiennent en même temps : une longue, une saisonnière, une dans la cour. Toutes sont puisées dans les réserves du musée plutôt qu'empruntées ; ce que vous voyez ici, c'est la ville qui se regarde.",
+        "metaLabel": "Entrée",
+        "metaValue": "Libre, sans réservation"
+      }
+    },
+    {
+      "tagName": "mu-band",
+      "$props": { "index": "01", "label": "En ce moment", "tone": "chalk" },
+      "children": [
+        {
+          "tagName": "div",
+          "style": { "borderBlockEnd": "1px solid var(--color-hairline)" },
+          "children": {
+            "$prototype": "Array",
+            "items": { "$ref": "#/state/shows" },
+            "map": {
+              "tagName": "mu-exhibition-row",
+              "$props": {
+                "index": "0${item.data.order}",
+                "title": "${item.data.title}",
+                "description": "${item.data.description}",
+                "gallery": "${item.data.gallery}",
+                "curator": "${item.data.curator}",
+                "curatorLabel": "Commissariat",
+                "href": "/fr-ca/expositions/${item.id}/",
+                "hue": "${item.data.hue}",
+                "date": "${item.data.date}",
+                "until": "${item.data.until}",
+                "locale": "${$page.locale}"
+              }
+            }
+          }
+        }
+      ]
+    },
+    {
+      "tagName": "mu-band",
+      "$props": { "index": "02", "label": "Comment fonctionne la programmation", "tone": "card" },
+      "children": [
+        {
+          "tagName": "div",
+          "style": {
+            "display": "grid",
+            "gridTemplateColumns": "minmax(0, 1fr) minmax(0, 1fr)",
+            "columnGap": "clamp(2rem, 5vw, 4rem)",
+            "rowGap": "1.25rem",
+            "@--md": { "gridTemplateColumns": "minmax(0, 1fr)" }
+          },
+          "children": [
+            {
+              "tagName": "p",
+              "style": { "margin": "0", "lineHeight": "1.75" },
+              "textContent": "Une exposition change à chaque saison et deux se tiennent longtemps : il y a donc toujours quelque chose que vous n'avez pas vu et quelque chose sur quoi revenir. Rien n'est billetté séparément et rien ne ferme pour une location privée pendant les heures d'ouverture."
+            },
+            {
+              "tagName": "p",
+              "style": { "margin": "0", "lineHeight": "1.75" },
+              "textContent": "Chaque exposition est écrite de façon autonome dans chacune des langues que le musée publie : la commissaire qui a rédigé le texte de salle en arabe pour la salle 2 ne traduit pas la version anglaise, et les deux divergent par endroits. Le sélecteur en haut de cette page liste les langues où une page existe, et rien d'autre."
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "tagName": "mu-cta",
+      "$props": {
+        "kicker": "Visites guidées",
+        "heading": "Quatre-vingt-dix minutes, le samedi, dans celle des trois langues qui vous convient.",
+        "text": "Réservez au comptoir le jour même, ou écrivez à l'avance si vous venez en groupe de plus de huit personnes.",
+        "label": "Renseignements aux visiteurs",
+        "href": "/fr-ca/visite/"
+      }
+    }
+  ]
+}

package/sites/museum/pages/fr-ca/index.json

@@ -0,0 +1,246 @@
+{
+  "$layout": "./layouts/fr-ca.json",
+  "title": "Atrium — Musée municipal d'art et d'histoire",
+  "description": "Un musée municipal sous une halle de verre : quatre siècles de port, de métiers et de cartes. Entrée libre, du mardi au dimanche, en anglais, en français et en arabe.",
+  "$head": [
+    {
+      "tagName": "meta",
+      "attributes": {
+        "name": "description",
+        "content": "Un musée municipal sous une halle de verre : quatre siècles de port, de métiers et de cartes. Entrée libre, du mardi au dimanche, en anglais, en français et en arabe."
+      }
+    }
+  ],
+  "state": {
+    "objects": {
+      "$expression": {
+        "operator": "call",
+        "target": { "$ref": "window#/Intl/formatNumber" },
+        "value": [18400]
+      }
+    },
+    "visitors": {
+      "$expression": {
+        "operator": "call",
+        "target": { "$ref": "window#/Intl/formatNumber" },
+        "value": [212000]
+      }
+    },
+    "founded": {
+      "$expression": {
+        "operator": "call",
+        "target": { "$ref": "window#/Intl/formatDate" },
+        "value": ["1897-11-04", null, { "day": "numeric", "month": "long", "year": "numeric" }]
+      }
+    },
+    "openDays": {
+      "$expression": {
+        "operator": "call",
+        "target": { "$ref": "window#/Intl/formatList" },
+        "value": [["mardi", "mercredi", "jeudi", "vendredi", "samedi", "dimanche"]]
+      }
+    },
+    "shows": {
+      "$prototype": "ContentCollection",
+      "$src": "@jxsuite/parser/ContentCollection.class.json",
+      "contentType": "exhibitions",
+      "filter": [{ "field": "lang", "op": "==", "value": "fr-CA" }],
+      "sort": [{ "field": "order", "order": "asc" }],
+      "limit": 3
+    }
+  },
+  "children": [
+    {
+      "tagName": "mu-hero",
+      "$props": {
+        "kicker": "Musée municipal d'art et d'histoire",
+        "title": "Quatre siècles, une seule halle de verre",
+        "standfirst": "Atrium conserve ce que la ville a fabriqué, acheté, repêché et contesté depuis la pose du premier quai de pierre — et le montre gratuitement, en trois langues, six jours sur sept.",
+        "primaryLabel": "Préparer sa visite",
+        "primaryHref": "/fr-ca/visite/",
+        "secondaryLabel": "À l'affiche",
+        "secondaryHref": "/fr-ca/expositions/",
+        "noteLabel": "Entrée libre",
+        "note": "Du mardi au dimanche, de 10 h à 18 h"
+      }
+    },
+    {
+      "tagName": "mu-band",
+      "$props": { "index": "01", "label": "En salle en ce moment", "tone": "chalk" },
+      "children": [
+        {
+          "tagName": "h2",
+          "style": {
+            "margin": "0 0 2.25rem",
+            "fontFamily": "var(--font-display)",
+            "fontSize": "clamp(1.7rem, 3.6vw, 2.6rem)",
+            "fontWeight": "500",
+            "lineHeight": "calc(1.08 * var(--leading-scale))",
+            "letterSpacing": "var(--display-tracking)",
+            "maxWidth": "22ch"
+          },
+          "textContent": "Trois expositions, et toutes parlent d'ici"
+        },
+        {
+          "tagName": "div",
+          "style": {
+            "display": "grid",
+            "gridTemplateColumns": "repeat(3, minmax(0, 1fr))",
+            "gap": "clamp(1rem, 2.5vw, 1.75rem)",
+            "@--md": { "gridTemplateColumns": "repeat(2, minmax(0, 1fr))" },
+            "@--sm": { "gridTemplateColumns": "minmax(0, 1fr)" }
+          },
+          "children": {
+            "$prototype": "Array",
+            "items": { "$ref": "#/state/shows" },
+            "map": {
+              "tagName": "mu-exhibition-card",
+              "$props": {
+                "title": "${item.data.title}",
+                "description": "${item.data.description}",
+                "gallery": "${item.data.gallery}",
+                "status": "À l'affiche",
+                "href": "/fr-ca/expositions/${item.id}/",
+                "hue": "${item.data.hue}",
+                "date": "${item.data.date}",
+                "until": "${item.data.until}",
+                "locale": "${$page.locale}"
+              }
+            }
+          }
+        },
+        {
+          "tagName": "mu-more",
+          "$props": {
+            "label": "Toute la programmation",
+            "href": "/fr-ca/expositions/",
+            "space": "2rem"
+          }
+        }
+      ]
+    },
+    {
+      "tagName": "mu-band",
+      "$props": { "index": "02", "label": "Le musée en chiffres", "tone": "card" },
+      "children": [
+        {
+          "tagName": "div",
+          "style": {
+            "display": "grid",
+            "gridTemplateColumns": "repeat(2, minmax(0, 1fr))",
+            "columnGap": "clamp(2rem, 5vw, 4rem)",
+            "@--md": { "gridTemplateColumns": "minmax(0, 1fr)" }
+          },
+          "children": [
+            {
+              "tagName": "div",
+              "children": [
+                {
+                  "tagName": "mu-fact",
+                  "$props": {
+                    "term": "Objets",
+                    "value": "${state.objects}",
+                    "note": "Catalogués, dont environ un dixième est exposé à un moment donné."
+                  }
+                },
+                {
+                  "tagName": "mu-fact",
+                  "$props": {
+                    "term": "Visites",
+                    "value": "${state.visitors}",
+                    "note": "Au cours de la dernière année complète, comptées à la porte."
+                  }
+                }
+              ]
+            },
+            {
+              "tagName": "div",
+              "children": [
+                {
+                  "tagName": "mu-fact",
+                  "$props": {
+                    "term": "Fondation",
+                    "value": "${state.founded}",
+                    "note": "Par une souscription de 240 ménages, dans une pièce au-dessus de la douane."
+                  }
+                },
+                {
+                  "tagName": "mu-fact",
+                  "$props": {
+                    "term": "Ouvert",
+                    "value": "${state.openDays}",
+                    "note": "Fermé le lundi, et les deux jours par année où la halle est nettoyée."
+                  }
+                }
+              ]
+            }
+          ]
+        },
+        {
+          "tagName": "p",
+          "style": {
+            "margin": "2rem 0 0",
+            "paddingBlockStart": "1.1rem",
+            "borderBlockStart": "1px solid var(--color-hairline)",
+            "fontSize": "0.95rem",
+            "lineHeight": "1.6",
+            "color": "var(--color-muted)",
+            "maxWidth": "var(--measure)"
+          },
+          "textContent": "Chaque chiffre est mis en forme par la langue de la page : ce document affiche 18 400 en français, 18,400 en anglais et ١٨٬٤٠٠ en arabe, parce que la route avait déjà dit de quelle langue il s'agit."
+        }
+      ]
+    },
+    {
+      "tagName": "mu-band",
+      "$props": { "index": "03", "label": "Depuis la salle de lecture", "tone": "chalk" },
+      "children": [
+        {
+          "tagName": "div",
+          "style": {
+            "display": "grid",
+            "gridTemplateColumns": "minmax(0, 1.05fr) minmax(0, 1fr)",
+            "columnGap": "clamp(2rem, 5vw, 4rem)",
+            "alignItems": "start",
+            "@--md": { "gridTemplateColumns": "minmax(0, 1fr)", "rowGap": "2rem" }
+          },
+          "children": [
+            {
+              "tagName": "mu-quote",
+              "$props": {
+                "quote": "Un musée, c'est la salle où une ville garde ce sur quoi elle n'arrive pas à s'entendre.",
+                "attribution": "Hélène Fournier, première conservatrice, 1897"
+              }
+            },
+            {
+              "tagName": "div",
+              "style": { "maxWidth": "var(--measure)" },
+              "children": [
+                {
+                  "tagName": "p",
+                  "style": { "margin": "0", "lineHeight": "1.75" },
+                  "textContent": "La salle de lecture du deuxième étage est ouverte à quiconque a une question. Ses rayons portent les registres du port, les carnets d'arpentage, quatre cents boîtes de correspondance d'atelier et les livres de procès-verbaux du musée lui-même — y compris ceux qui consignent des chicanes que le conseil d'administration aurait préféré taire."
+                },
+                {
+                  "tagName": "p",
+                  "style": { "margin": "1.1rem 0 0", "lineHeight": "1.75" },
+                  "textContent": "Aucun rendez-vous pour lire ; il en faut un pour manipuler. Demandez au comptoir et un membre du personnel montera la boîte dans l'heure."
+                }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "tagName": "mu-cta",
+      "$props": {
+        "kicker": "Entrée libre",
+        "heading": "La halle est ouverte. Venez nous contredire.",
+        "text": "Six jours sur sept, de dix heures à six heures, sans billet ni réservation. La cour reste ouverte une heure de plus pendant l'été.",
+        "label": "Préparer sa visite",
+        "href": "/fr-ca/visite/"
+      }
+    }
+  ]
+}