@eifi1/ui-kit 0.31.0 → 0.32.0

package/src/i18n/locales/it.ts

@@ -23,6 +23,10 @@ export function uiKitLabelsIt(numberLocale = "it-IT"): UiKitLabels {
     !seconds || seconds <= 0
       ? "Troppi tentativi. Attenda un momento e riprovi."
       : `Troppi tentativi. Riprovi tra ${wait(seconds)}.`;
+  // 0.32.0 — when a trial or a grant ends, as `inDays` in src/billing/billing-labels.ts:
+  // 0 (or less) is today, 1 tomorrow.
+  const inDays = (days: number) =>
+    days <= 0 ? "oggi" : days === 1 ? "domani" : `tra ${n(days)} ${plural(days, "giorno", "giorni")}`;
 
   return {
     feedbackAttachment: {
@@ -801,6 +805,10 @@ export function uiKitLabelsIt(numberLocale = "it-IT"): UiKitLabels {
           disclaimer: {
             title: "Responsabilità per contenuti e link",
             body: "Questo è un progetto privato e non commerciale, offerto nell’ambito di una beta chiusa, senza garanzia. I siti esterni a cui rimandiamo sono di responsabilità dei rispettivi gestori; non abbiamo alcun controllo sui loro contenuti.",
+            // 0.32.0 — the commercial variant (docs/billing-harmonization.md §8). "Piano"
+            // and "abbonamento" as the `billing` namespace.
+            commercial:
+              "Questo è un servizio commerciale. I piani a pagamento sono venduti dal nostro rivenditore, che agisce in qualità di Merchant of Record: vende l’abbonamento in nome proprio, incassa il pagamento, emette la fattura e gestisce l’IVA, e all’acquisto si applicano le sue condizioni di vendita. Ci impegniamo affinché i contenuti di questo servizio siano corretti, ma non possiamo garantire che siano completi o aggiornati. I siti esterni a cui rimandiamo sono di responsabilità dei rispettivi gestori; non abbiamo alcun controllo sui loro contenuti.",
           },
         },
         privacy: {
@@ -982,6 +990,7 @@ export function uiKitLabelsIt(numberLocale = "it-IT"): UiKitLabels {
       resendIn: (seconds) => `Invia di nuovo tra ${n(seconds)} s`,
       resent: "Email di conferma inviata",
       resendError: "Impossibile inviare l’email di conferma",
+      rateLimited,
       banner: "Confermi il Suo indirizzo email.",
       dismiss: "Non ora",
     },
@@ -1252,6 +1261,7 @@ export function uiKitLabelsIt(numberLocale = "it-IT"): UiKitLabels {
       inflow: "Entrata",
       // "premere per…": an instruction without a tu imperative, as the kit's Italian is formal.
       direction: (current, next) => `Direzione: ${current} – premere per passare a ${next}`,
+      switchTo: (next) => `Passa a ${next}`,
     },
     columnMapper: {
       paste: "Incolla una tabella",
@@ -1374,7 +1384,7 @@ export function uiKitLabelsIt(numberLocale = "it-IT"): UiKitLabels {
         },
         security: {
           title: "Sicurezza",
-          help: "Come accede: password, codici 2FA, passkey e sessioni.",
+          help: "Come accede, e su quali dispositivi la sessione è aperta.",
         },
         notifications: {
           title: "Notifiche",
@@ -1425,6 +1435,96 @@ export function uiKitLabelsIt(numberLocale = "it-IT"): UiKitLabels {
         "I dati di esempio vengono reimpostati regolarmente; quello che ha creato nella demo viene eliminato.",
       restart: "Avvia una nuova demo",
     },
+    // 0.32.0 — docs/billing-harmonization.md §7, §10 and §12.24: "piano" is what is bought
+    // (Free, Pro), "abbonamento" the standing arrangement and the settings group;
+    // "disdire", the word for ending a contract. "Lei" in sentences, the imperative on
+    // buttons, as everywhere in this catalogue.
+    billing: {
+      group: "Abbonamento",
+      plans: "Piani",
+      interval: "Periodo di fatturazione",
+      yearly: "Annuale",
+      monthly: "Mensile",
+      // As `currency.currency`.
+      currency: "Valuta",
+      perYear: "all’anno",
+      perMonth: "al mese",
+      vatIncluded: "IVA inclusa",
+      free: "Gratuito",
+      notOffered: "Non disponibile per questo periodo di fatturazione",
+      // As `progressBar.unlimited`.
+      unlimited: "Illimitato",
+      limits: "Limiti",
+      features: "Incluso",
+      current: "Piano attuale",
+      choose: (plan) => `Scegli ${plan}`,
+      upgrade: (plan) => `Passa a ${plan}`,
+      // "Passare a" either way: Italian has no plain verb for a downgrade.
+      downgrade: (plan) => `Passa a ${plan}`,
+      isCurrent: "Questo è il Suo piano attuale.",
+      pickFirst: "Scelga prima un piano.",
+      // Agreeing with "abbonamento"; "scaduto", as `invitations.status.expired`.
+      status: {
+        trialing: "In prova",
+        active: "Attivo",
+        past_due: "Pagamento in ritardo",
+        canceled: "Disdetto",
+        expired: "Scaduto",
+        comped: "In omaggio",
+      },
+      trialEnding: (days) =>
+        `Il Suo periodo di prova termina ${inDays(days)}. In seguito potrà ancora vedere tutto, ma per apportare modifiche servirà un piano.`,
+      grantEnding: (days) =>
+        `Il Suo accesso gratuito termina ${inDays(days)}. In seguito potrà ancora vedere tutto, ma per apportare modifiche servirà un piano.`,
+      paymentFailed:
+        "Il Suo ultimo pagamento non è andato a buon fine. Aggiorni il metodo di pagamento per mantenere il Suo piano.",
+      planEnded:
+        "Il Suo piano è terminato. Può ancora vedere ed esportare tutto; scelga un piano per apportare di nuovo modifiche.",
+      // Never why: the owner's payment status is the owner's personal data (§12.6).
+      guestReadOnly: (item) =>
+        item
+          ? `«${item}» per ora è in sola lettura; il proprietario può rimuovere questa limitazione.`
+          : "Per ora è in sola lettura; il proprietario può rimuovere questa limitazione.",
+      processing:
+        "Il Suo pagamento è in elaborazione. Il Suo piano inizia non appena viene confermato; questa pagina si aggiorna da sola.",
+      choosePlan: "Scegli un piano",
+      updatePayment: "Aggiorna il metodo di pagamento",
+      checkAgain: "Verifica di nuovo",
+      lockReason: "Il Suo piano è terminato. Scelga un piano per apportare di nuovo modifiche.",
+      // As `characterCount.limitReached` ("Limite di caratteri raggiunto").
+      limitReached: "Limite del piano raggiunto",
+      limitUpgrade: "Per aggiungerne altri, scelga un piano con un limite più alto.",
+      limitContact: "Per aggiungerne altri, ci chieda un limite più alto.",
+      askForMore: "Chiedi di più",
+      // Both figures arrive formatted; "di", as `characterCount.count`.
+      usage: (used, limit) => `${used} di ${limit}`,
+      contactSubject: (dimension) => `Limite del piano: ${dimension}`,
+      manage: "Pagamento e fatture",
+      cancel: "Disdici l’abbonamento",
+      waitingChanges: (count) =>
+        `${n(count)} ${plural(count, "modifica in attesa", "modifiche in attesa")} di un piano`,
+      // "Scarta", as `wizard.cancelConfirmLabel`.
+      discardWaiting: "Scarta le modifiche in attesa",
+    },
+    // 0.32.0 — docs/text-size-harmonization.md §6: the text-size and contrast settings in
+    // the "Aspetto" group.
+    appearance: {
+      textSize: "Dimensione del testo",
+      textSizeHelp: "Lettere più grandi e un layout che fa loro spazio.",
+      textSizes: { normal: "Normale", large: "Grande", xlarge: "Molto grande" },
+      contrast: "Contrasto",
+      contrastHelp:
+        "Il contrasto aumentato scurisce i testi tenui e le linee e ispessisce i riquadri di focus. «Sistema» segue l’impostazione di questo dispositivo.",
+      contrastModes: { system: "Sistema", standard: "Standard", more: "Aumentato" },
+    },
+    rowActions: {
+      actions: "Azioni",
+      actionsFor: (name) => `Azioni per ${name}`,
+    },
+    appShellMore: {
+      more: "Altro",
+      moreTitle: "Altre pagine",
+    },
   };
 }
 

package/src/i18n/locales/zh.ts

@@ -20,6 +20,9 @@ export function uiKitLabelsZh(numberLocale = "zh-CN"): UiKitLabels {
     seconds < 60 ? `${n(Math.ceil(seconds))} 秒` : `${n(Math.ceil(seconds / 60))} 分钟`;
   const rateLimited = (seconds?: number) =>
     !seconds || seconds <= 0 ? "尝试次数过多，请稍候再试。" : `尝试次数过多，请 ${wait(seconds)}后重试。`;
+  // 0.32.0 — when a trial or a grant ends, as `inDays` in src/billing/billing-labels.ts:
+  // 0 (or less) is today, 1 tomorrow. A numeral brings its own leading space.
+  const inDays = (days: number) => (days <= 0 ? "今天" : days === 1 ? "明天" : ` ${n(days)} 天后`);
 
   return {
     feedbackAttachment: {
@@ -777,6 +780,10 @@ export function uiKitLabelsZh(numberLocale = "zh-CN"): UiKitLabels {
           disclaimer: {
             title: "内容与链接的责任",
             body: "这是一个私人的非商业项目，在封闭测试期间提供，不作任何保证。我们所链接的外部网站由其各自的运营者负责；我们无法控制其内容。",
+            // 0.32.0 — the commercial variant (docs/billing-harmonization.md §8). "套餐"
+            // and "订阅" as the `billing` namespace.
+            commercial:
+              "这是一项商业服务。付费套餐由我们的经销商销售，该经销商作为记录商户（Merchant of Record）行事：它以自己的名义销售订阅、收取款项、开具发票并处理增值税，且该笔购买适用其销售条款。我们尽力确保本服务的内容准确，但无法保证其完整或最新。我们所链接的外部网站由其各自的运营者负责；我们无法控制其内容。",
           },
         },
         privacy: {
@@ -949,6 +956,7 @@ export function uiKitLabelsZh(numberLocale = "zh-CN"): UiKitLabels {
       resendIn: (seconds) => `${n(seconds)} 秒后可重新发送`,
       resent: "确认邮件已发送",
       resendError: "无法发送确认邮件",
+      rateLimited,
       banner: "请确认您的电子邮箱地址。",
       dismiss: "暂不",
     },
@@ -1195,6 +1203,7 @@ export function uiKitLabelsZh(numberLocale = "zh-CN"): UiKitLabels {
       outflow: "支出",
       inflow: "收入",
       direction: (current, next) => `方向：${current}，切换为${next}`,
+      switchTo: (next) => `切换为${next}`,
     },
     columnMapper: {
       paste: "粘贴表格",
@@ -1308,7 +1317,7 @@ export function uiKitLabelsZh(numberLocale = "zh-CN"): UiKitLabels {
         },
         security: {
           title: "安全",
-          help: "您的登录方式：密码、双重验证码、通行密钥和会话。",
+          help: "您的登录方式，以及已在哪些设备上登录。",
         },
         notifications: {
           title: "通知",
@@ -1357,6 +1366,88 @@ export function uiKitLabelsZh(numberLocale = "zh-CN"): UiKitLabels {
       endedSandbox: "示例数据会定期重置；您在演示中创建的内容会被删除。",
       restart: "开始新的演示",
     },
+    // 0.32.0 — docs/billing-harmonization.md §7, §10 and §12.24: "套餐" is what is bought
+    // (Free, Pro), "订阅" the standing arrangement and the settings group. "您".
+    billing: {
+      group: "订阅",
+      plans: "套餐",
+      interval: "计费周期",
+      yearly: "按年",
+      monthly: "按月",
+      // As `currency.currency`.
+      currency: "货币",
+      perYear: "每年",
+      perMonth: "每月",
+      vatIncluded: "含增值税",
+      free: "免费",
+      notOffered: "此计费周期不提供",
+      // As `progressBar.unlimited`.
+      unlimited: "无限制",
+      limits: "限额",
+      features: "包含内容",
+      current: "当前套餐",
+      choose: (plan) => `选择 ${plan}`,
+      upgrade: (plan) => `升级到 ${plan}`,
+      downgrade: (plan) => `切换到 ${plan}`,
+      isCurrent: "这是您当前的套餐。",
+      pickFirst: "请先选择一个套餐。",
+      status: {
+        trialing: "试用中",
+        active: "有效",
+        past_due: "付款逾期",
+        canceled: "已取消",
+        // As `invitations.status.expired`.
+        expired: "已过期",
+        comped: "免费赠送",
+      },
+      trialEnding: (days) =>
+        `您的试用期将于${inDays(days)}结束。之后您仍可查看所有内容，但需要套餐才能进行修改。`,
+      grantEnding: (days) =>
+        `您的免费使用权将于${inDays(days)}结束。之后您仍可查看所有内容，但需要套餐才能进行修改。`,
+      paymentFailed: "您的上一笔付款未成功。请更新付款方式，以保留您的套餐。",
+      planEnded: "您的套餐已结束。您仍可查看和导出所有内容；选择套餐后即可再次进行修改。",
+      // Never why: the owner's payment status is the owner's personal data (§12.6).
+      guestReadOnly: (item) =>
+        item
+          ? `“${item}”目前为只读；其所有者可以解除此限制。`
+          : "此内容目前为只读；其所有者可以解除此限制。",
+      processing: "您的付款正在处理中。确认后您的套餐即会生效；此页面会自动更新。",
+      choosePlan: "选择套餐",
+      updatePayment: "更新付款方式",
+      checkAgain: "再次检查",
+      lockReason: "您的套餐已结束。选择套餐后即可再次进行修改。",
+      // As `characterCount.limitReached` ("已达到字符数上限").
+      limitReached: "已达到套餐上限",
+      limitUpgrade: "如需添加更多，请选择上限更高的套餐。",
+      limitContact: "如需添加更多，请向我们申请更高的上限。",
+      askForMore: "申请提高上限",
+      // Both figures arrive formatted; written as `characterCount.count` writes them.
+      usage: (used, limit) => `${used}/${limit}`,
+      contactSubject: (dimension) => `套餐上限：${dimension}`,
+      manage: "付款与发票",
+      cancel: "取消订阅",
+      waitingChanges: (count) => `${n(count)} 项修改正在等待套餐`,
+      // "放弃", as `wizard.cancelConfirmLabel`.
+      discardWaiting: "放弃等待中的修改",
+    },
+    // 0.32.0 — docs/text-size-harmonization.md §6: the text-size and contrast settings in
+    // the "外观" group.
+    appearance: {
+      textSize: "文字大小",
+      textSizeHelp: "更大的文字，以及为其留出空间的布局。",
+      textSizes: { normal: "标准", large: "大", xlarge: "特大" },
+      contrast: "对比度",
+      contrastHelp: "增强对比度会加深浅色文字和线条，并加粗焦点框。“跟随系统”沿用此设备的设置。",
+      contrastModes: { system: "跟随系统", standard: "标准", more: "增强" },
+    },
+    rowActions: {
+      actions: "操作",
+      actionsFor: (name) => `${name} 的操作`,
+    },
+    appShellMore: {
+      more: "更多",
+      moreTitle: "更多页面",
+    },
   };
 }
 

package/src/i18n/review.ts

@@ -267,6 +267,8 @@ export const KIT_LABEL_SAMPLES: Readonly<Record<string, readonly (readonly unkno
   "ibanInput.country": [["{{code}}"]],
   "ibanInput.length": [[20, 21]],
   "signChip.direction": [["{{current}}", "{{next}}"]],
+  "signChip.switchTo": [["{{next}}"]],
+  "rowActions.actionsFor": [["{{name}}"]],
   "columnMapper.readError": [["{{name}}"]],
   "columnMapper.summary": [
     [1, 1],
@@ -309,6 +311,7 @@ export const KIT_LABEL_SAMPLES: Readonly<Record<string, readonly (readonly unkno
   "register.rateLimited": [[], [30], [300]],
   "forgotPassword.rateLimited": [[], [30], [300]],
   "resetPassword.rateLimited": [[], [30], [300]],
+  "verifyEmail.rateLimited": [[], [30], [300]],
   "emailChange.emailTagUse": [["{{address}}"]],
   "emailChange.pending": [["{{newEmail}}"]],
   "emailChange.pendingHint": [["{{currentEmail}}"]],
@@ -351,4 +354,16 @@ export const KIT_LABEL_SAMPLES: Readonly<Record<string, readonly (readonly unkno
     [3, 12],
   ],
   "demo.minutesLeft": one,
+  // 0.32.0: the subscription parts (docs/billing-harmonization.md §7). A trial or a grant
+  // ending today, tomorrow and in five days; the guest's notice with and without the
+  // item's name.
+  "billing.choose": [["{{plan}}"]],
+  "billing.upgrade": [["{{plan}}"]],
+  "billing.downgrade": [["{{plan}}"]],
+  "billing.trialEnding": [[0], [1], [5]],
+  "billing.grantEnding": [[0], [1], [5]],
+  "billing.guestReadOnly": [["{{item}}"], [undefined]],
+  "billing.usage": [["{{used}}", "{{limit}}"]],
+  "billing.contactSubject": [["{{dimension}}"]],
+  "billing.waitingChanges": one,
 };

package/src/index.ts

@@ -19,11 +19,17 @@ export { useMediaQuery } from "./hooks/use-media-query";
 export { useBodyScrollLock } from "./hooks/use-body-scroll-lock";
 export { useAnchoredRect } from "./hooks/use-anchored-rect";
 export type { AnchorRect } from "./hooks/use-anchored-rect";
-export { useAnchoredPanel, anchoredPanelPlacement, useVisualViewport } from "./hooks/use-anchored-panel";
+export {
+  useAnchoredPanel,
+  anchoredPanelPlacement,
+  useVisualViewport,
+  readKeyboardInset,
+} from "./hooks/use-anchored-panel";
 export type {
   AnchoredPanel,
   AnchoredPanelOptions,
   ViewportBox,
+  KeyboardInsetOptions,
 } from "./hooks/use-anchored-panel";
 export { useEscapeKey, useOutsideClick } from "./hooks/use-dismiss";
 // Focus containment for an overlay, and a live region for a change that moves no focus.
@@ -151,7 +157,7 @@ export * from "./components/icon-picker";
 export * from "./components/choice-card";
 export * from "./components/autocomplete";
 export * from "./components/measured-grid";
-export { useWindowedRows } from "./hooks/use-windowed-rows";
+export { useWindowedRows, WINDOWED_ROW_INDEX } from "./hooks/use-windowed-rows";
 export type { WindowedRows } from "./hooks/use-windowed-rows";
 // Named, not `export *`: file-button.tsx also holds the screening helpers the
 // dropzone shares, which are internal.
@@ -260,7 +266,14 @@ export type {
 // The toast layer over sonner (an OPTIONAL peer, loaded lazily): `toast` mirrors sonner's
 // API so apps migrate by swapping the import; `<Toaster>` carries the placement, theme,
 // tones and z-index both apps had wired by hand.
-export { toast, Toaster, DEFAULT_TOAST_LABELS, TOAST_ACTION_DURATION } from "./components/toast";
+export {
+  toast,
+  Toaster,
+  DEFAULT_TOAST_LABELS,
+  TOAST_ACTION_DURATION,
+  TOASTER_OFFSET_TOP,
+  TOASTER_OFFSET_BOTTOM,
+} from "./components/toast";
 export type {
   ToastId,
   ToastAction,
@@ -485,6 +498,7 @@ export type {
   LegalTextSectionLabels,
   LegalOperatorSectionLabels,
   LegalFramedSectionLabels,
+  LegalDisclaimerSectionLabels,
 } from "./components/legal";
 export { LegalPage, LegalKitSection, LegalAcceptCheckbox, LEGAL_SKELETON } from "./components/legal-page";
 
@@ -507,7 +521,7 @@ export type { RegisterFormProps, RegisterLabels, RegisterValues } from "./auth/r
 export { CompleteNameDialog, DEFAULT_COMPLETE_NAME_LABELS } from "./auth/complete-name-dialog";
 export type { CompleteNameDialogProps, CompleteNameLabels, CompleteNameValues } from "./auth/complete-name-dialog";
 export { taggedEmail } from "./auth/email-tag";
-export { isAuthError, authErrorCode } from "./auth/auth-errors";
+export { isAuthError, authErrorCode, isBillingError } from "./auth/auth-errors";
 export type { AuthErrorCode } from "./auth/auth-errors";
 export { ForgotPasswordForm, DEFAULT_FORGOT_PASSWORD_LABELS } from "./auth/forgot-password-form";
 export type { ForgotPasswordFormProps, ForgotPasswordLabels } from "./auth/forgot-password-form";
@@ -545,7 +559,7 @@ export type { CompanySwitcherProps, CompanySwitcherLabels, CompanySwitcherCompan
 // invitations panel, and the account's own settings — email change, sessions, deletion,
 // export. Callbacks only; the confirmation level is the server's.
 export { isRateLimited, retryAfterSeconds } from "./auth/auth-errors";
-export type { AccountErrorCode, DemoErrorCode, KitErrorCode } from "./auth/auth-errors";
+export type { AccountErrorCode, BillingErrorCode, DemoErrorCode, KitErrorCode } from "./auth/auth-errors";
 export { EmailChangeSetting, DEFAULT_EMAIL_CHANGE_LABELS } from "./account/email-change-setting";
 export type {
   EmailChangeSettingProps,
@@ -667,9 +681,10 @@ export {
   settingsHref,
 } from "./settings/settings-catalogue";
 export type { SettingsGroup, SettingsEntry, SettingsSearchEntriesOptions } from "./settings/settings-catalogue";
-export { DEFAULT_SETTINGS_LABELS } from "./settings/settings-labels";
+export { DEFAULT_SETTINGS_LABELS, useSettingsLabels } from "./settings/settings-labels";
 export type { SettingsLabels, SettingsGroupLabels, SettingsCoreGroup } from "./settings/settings-labels";
-// Only the language follows the account (§6.2).
+// The language follows the account (§6.2); since 0.32 so do the text size and the
+// contrast (useAccountAppearance below, docs/text-size-harmonization.md §6).
 export { useAccountLanguage, resolveAccountLanguage, matchOfferedLanguage } from "./settings/use-account-language";
 export type {
   UseAccountLanguageOptions,
@@ -709,7 +724,13 @@ export {
   NEXT_PARAM,
   DEFAULT_LAST_VISITED_EXCLUDES,
 } from "./landing/routing";
-export type { RootEntryProps, RedirectIfAuthedProps, LastVisitedPageOptions, PathPattern } from "./landing/routing";
+export type {
+  RootEntryProps,
+  RedirectIfAuthedProps,
+  RoutingSession,
+  LastVisitedPageOptions,
+  PathPattern,
+} from "./landing/routing";
 export { PublicHeader } from "./landing/public-header";
 export type { PublicHeaderProps, PublicHeaderBrand } from "./landing/public-header";
 export { DEFAULT_DEMO_LABELS, useDemoLabels } from "./demo/demo-labels";
@@ -732,8 +753,61 @@ export type {
   LegalSkeletonEntry,
   LegalSkeletonPage,
   LegalSectionOwner,
+  LegalDisclaimerVariant,
 } from "./components/legal-page";
 
+// ── 0.32.0: text size and contrast (docs/text-size-harmonization.md) ──
+export * from "./theme/text-size";
+export * from "./theme/contrast";
+export { useBreakpoint, usePhoneLayout, breakpointQuery, BREAKPOINT_REM } from "./hooks/use-breakpoint";
+export type { Breakpoint, BreakpointVariant } from "./hooks/use-breakpoint";
+export { useAccountAppearance, resolveAccountAppearance } from "./settings/use-account-appearance";
+export type {
+  AppearanceSource,
+  AccountAppearanceFields,
+  DeviceAppearance,
+  AccountAppearancePatch,
+  ResolvedAccountAppearance,
+  UseAccountAppearanceOptions,
+  AccountAppearance,
+} from "./settings/use-account-appearance";
+export { DEFAULT_APPEARANCE_LABELS, useAppearanceLabels } from "./components/appearance-labels";
+// The behaviours at Large (§4, §10.7–10.9): a row's actions, the hooks components read.
+export { RowActions, rowActionsColumn, DEFAULT_ROW_ACTIONS_LABELS } from "./components/row-actions";
+export type {
+  RowAction,
+  RowActionList,
+  RowActionsLabels,
+  RowActionsProps,
+  RowActionsCollapse,
+  RowActionsSize,
+  RowActionsColumnOptions,
+} from "./components/row-actions";
+export { useLargeText, useCoarsePointer, useInlineFacts } from "./hooks/use-large-text";
+export type { AppearanceLabels } from "./components/appearance-labels";
+
+// ── 0.32.0: billing — plans, standing, banners, the limit notice (docs/billing-harmonization.md §7) ──
+export { DEFAULT_BILLING_LABELS, useBillingLabels, SUBSCRIPTION_STATUSES } from "./billing/billing-labels";
+export type { BillingLabels, SubscriptionStatus } from "./billing/billing-labels";
+export { BILLING_INTERVALS, planPrice, minorToMajor, formatPlanPrice, billingCurrencyFor } from "./billing/plan-price";
+export type { BillingInterval, BillingCurrency, PlanIntervalPrices, PlanPrices, PlanPriceAnswer } from "./billing/plan-price";
+export { PlanCard, PlanPicker, planRelation } from "./billing/plan-card";
+export type { BillingPlan, PlanRelation, PlanCardProps, PlanPickerProps, PlanChoice } from "./billing/plan-card";
+export { SubscriptionStatusChip, SUBSCRIPTION_STATUS_TONES } from "./billing/subscription-status-chip";
+export type { SubscriptionStatusChipProps } from "./billing/subscription-status-chip";
+export { BillingBanner } from "./billing/billing-banner";
+export type { BillingBannerProps, BillingBannerKind } from "./billing/billing-banner";
+export { PlanLimitNotice, planLimitMailto } from "./billing/plan-limit-notice";
+export type { PlanLimitNoticeProps } from "./billing/plan-limit-notice";
+export { isPlanLimit } from "./billing/plan-limit";
+export type { PlanLimitRefusal } from "./billing/plan-limit";
+export { combineWriteLocks, useBillingLockReason } from "./billing/billing-lock";
+export type { WriteLockSource, CombinedWriteLock, BillingLockReasonOptions } from "./billing/billing-lock";
+export { billingLockAt, isBillingReadOnly, billingDaysLeft } from "./billing/billing-standing";
+export type { BillingStanding } from "./billing/billing-standing";
+export { SubscriptionActions } from "./billing/subscription-actions";
+export type { SubscriptionActionsProps } from "./billing/subscription-actions";
+
 // ── 0.22.0: the inputs round (kastlan's, keksdose's and Kurvenschmiede's audits) ──
 export * from "./components/checkbox-group";
 export * from "./components/one-time-code-input";

package/src/landing/landing-actions.tsx

@@ -23,8 +23,10 @@ export interface LandingActionsProps extends Omit<ComponentPropsWithoutRef<"div"
   session: LandingSession;
   access: AccessChoice;
   /** "Try the demo" without a session, "Continue the demo" with a demo one. Default
-   *  `/demo`, which starts a demo — or, for a live one, continues it (§3.1). */
-  demoHref?: string;
+   *  `/demo`, which starts a demo — or, for a live one, continues it (§3.1). `null`
+   *  (0.31.1): the app has no demo yet, and the action is left out — "Request access"
+   *  stands alone (Kurvenschmiede's 0.31 adoption). */
+  demoHref?: string | null;
   /** "Open app" for a real session: the resume target. Default `/`, which resumes
    *  through `RootEntry`. */
   openAppHref?: string;
@@ -82,9 +84,11 @@ export function LandingActions({
           <Button href={accessLink.href} variant="brand" size={buttonSize} className={extra}>
             {accessLink.label}
           </Button>
-          <Button href={demoHref} variant="secondary" size={buttonSize} className={extra}>
-            {session === "demo" ? labels.continueDemo : labels.tryDemo}
-          </Button>
+          {demoHref !== null && (
+            <Button href={demoHref} variant="secondary" size={buttonSize} className={extra}>
+              {session === "demo" ? labels.continueDemo : labels.tryDemo}
+            </Button>
+          )}
         </>
       )}
     </div>

package/src/landing/public-header.tsx

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
 
-import { Button, PHONE_QUERY } from "../components/ui";
-import { useMediaQuery } from "../hooks/use-media-query";
+import { Button } from "../components/ui";
+import { usePhoneLayout } from "../hooks/use-breakpoint";
 import { TopBar } from "../shell/top-bar";
 import type { TopBarProps } from "../shell/top-bar";
 import { TopBarBrand } from "../shell/top-bar-brand";
@@ -55,7 +55,7 @@ export interface PublicHeaderProps extends Omit<TopBarProps, "brand" | "actions"
  * | user | **Open app** (primary) |
  *
  * A demo session is not "signed in" here: it is still offered access, which is the point
- * of the demo (§5.6). On a phone (`PHONE_QUERY`) the actions take the kit's `sm` size, so
+ * of the demo (§5.6). In the phone layout (`usePhoneLayout()`) the actions take the kit's `sm` size, so
  * the brand mark, the two controls and two actions fit 390px; "Sign in" gives way below
  * `sm` as in keksdose — the sign-in page is one tap away from "Request access" anyway.
  */
@@ -75,7 +75,7 @@ export function PublicHeader({
 }: PublicHeaderProps) {
   const labels = useLandingLabels(labelsProp);
   const accessLink = useAccessAction(access, labelsProp);
-  const phone = useMediaQuery(PHONE_QUERY, false);
+  const phone = usePhoneLayout();
   const size = phone ? "sm" : "md";
   const home = homeHref ?? (session === "none" ? "/" : "/welcome");
 

package/src/landing/routing.tsx

@@ -4,6 +4,15 @@ import { Navigate, Outlet, useLocation } from "react-router";
 
 import { readStored, writeStored } from "../lib/safe-storage";
 import type { LandingSession } from "./landing-actions";
+import { LoadingState } from "../components/loading-state";
+
+/**
+ * 0.31.1: a session that is still being restored — an app whose access token lives in
+ * memory reads it back from its refresh token first (kastlan's 0.31 adoption). Until
+ * then `/` neither shows the landing nor resumes, and a public page neither shows nor
+ * redirects: both render `loading` instead.
+ */
+export type RoutingSession = LandingSession | "loading";
 
 /**
  * The public routes' logic (docs/landing-demo-harmonization.md §3): what `/` shows,
@@ -144,8 +153,11 @@ export function clearLastVisitedPage(key: string): void {
 /* ── RootEntry ───────────────────────────────────────────────────────────── */
 
 export interface RootEntryProps {
-  /** Without a session `/` is the landing; with one (real or demo) it resumes. */
-  session: LandingSession;
+  /** Without a session `/` is the landing; with one (real or demo) it resumes;
+   *  `"loading"` while the app restores one. */
+  session: RoutingSession;
+  /** What shows while `session` is `"loading"`. Default: the kit's `LoadingState`. */
+  loading?: ReactNode;
   /** The remembered page — `readLastVisitedPage(key)`. */
   resumePath?: string | null;
   /** The landing page element. */
@@ -164,7 +176,8 @@ export interface RootEntryProps {
  * home instead, because a session at `/` came to use the app. The landing stays one tap
  * away at `/welcome`, where the signed-in brand link points.
  */
-export function RootEntry({ session, resumePath, landing, home }: RootEntryProps) {
+export function RootEntry({ session, resumePath, landing, home, loading }: RootEntryProps) {
+  if (session === "loading") return <>{loading ?? <LoadingState />}</>;
   if (session === "none") return <>{landing}</>;
   const resume = safeNextPath(resumePath);
   return <Navigate to={resume && resume !== "/" ? resume : home} replace />;
@@ -173,7 +186,10 @@ export function RootEntry({ session, resumePath, landing, home }: RootEntryProps
 /* ── RedirectIfAuthed ────────────────────────────────────────────────────── */
 
 export interface RedirectIfAuthedProps {
-  session: LandingSession;
+  /** `"loading"` while the app restores a session: neither the page nor a redirect. */
+  session: RoutingSession;
+  /** What shows while `session` is `"loading"`. Default: the kit's `LoadingState`. */
+  loading?: ReactNode;
   /**
    * Let a DEMO session through (§5.6): on `/login`, `/register` and the app's invitation
    * pages, so a demo visitor can sign in or accept an invitation — a successful one
@@ -199,8 +215,9 @@ export interface RedirectIfAuthedProps {
  * `allowDemo` around `/login`, `/register` and the invitation pages, and one without
  * around `/demo` (and `/forgot-password`).
  */
-export function RedirectIfAuthed({ session, allowDemo = false, fallback, children }: RedirectIfAuthedProps) {
+export function RedirectIfAuthed({ session, allowDemo = false, fallback, children, loading }: RedirectIfAuthedProps) {
   const { search } = useLocation();
+  if (session === "loading") return <>{loading ?? <LoadingState />}</>;
   if (session === "none" || (session === "demo" && allowDemo)) {
     return children === undefined ? <Outlet /> : <>{children}</>;
   }

package/src/lib/cn.ts

@@ -1,5 +1,16 @@
 import { clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
+import { extendTailwindMerge } from "tailwind-merge";
+
+/**
+ * tailwind-merge, told about the kit's own font sizes (docs/text-size-harmonization.md
+ * §3.2): `text-micro` and `text-caption` are `@theme` sizes in tokens.css, which
+ * tailwind-merge cannot see. Unknown, a `text-<word>` is taken for a COLOUR, so
+ * `cn("text-caption text-[var(--text-muted)]")` dropped the size — the later colour
+ * "won" over it — and `cn("text-xs", "text-caption")` kept both sizes. Registered as
+ * sizes, they merge like `text-xs`: a later size replaces an earlier one, a colour sits
+ * beside them.
+ */
+const merge = extendTailwindMerge({ extend: { theme: { text: ["micro", "caption"] } } });
 
 /** Merge class lists with Tailwind conflict resolution (later wins). */
-export const cn = (...inputs: Parameters<typeof clsx>) => twMerge(clsx(inputs));
+export const cn = (...inputs: Parameters<typeof clsx>) => merge(clsx(inputs));

package/src/rhf/fields.tsx

@@ -1003,7 +1003,7 @@ function RangeBody({
           key={message}
           id={messageIds[i]}
           data-slot="form-message"
-          className="text-[11px] leading-tight text-[var(--danger)]"
+          className="text-caption leading-tight text-[var(--danger)]"
         >
           {message}
         </p>

package/src/rhf/form.tsx

@@ -287,7 +287,7 @@ export function FormDescription({ className, ...rest }: FormDescriptionProps) {
       data-slot="form-description"
       {...rest}
       id={formDescriptionId}
-      className={cn("text-[11px] leading-tight text-[var(--text-muted)]", className)}
+      className={cn("text-caption leading-tight text-[var(--text-muted)]", className)}
     />
   );
 }
@@ -315,7 +315,7 @@ export function FormMessage({ className, children, ...rest }: FormMessageProps)
       data-slot="form-message"
       {...rest}
       id={formMessageId}
-      className={cn("text-[11px] leading-tight text-[var(--danger)]", className)}
+      className={cn("text-caption leading-tight text-[var(--danger)]", className)}
     >
       {body}
     </p>