@eifi1/ui-kit 0.31.0 → 0.32.0

package/dist/billing/plan-price.d.ts

@@ -0,0 +1,61 @@
+/**
+ * Money and periods of the plan catalogue (docs/billing-harmonization.md §3.1, §4, §12.17).
+ *
+ * Money crosses the wire as INTEGER MINOR UNITS plus an ISO currency, never as a float
+ * (§4): 4900 CHF is CHF 49.00. The kit turns it into the reader's notation with
+ * `formatMoney`, so no app divides by 100 by hand.
+ */
+/** A billing period: the provider charges per month or per year. */
+type BillingInterval = "month" | "year";
+/** The two currencies every app sells in (§2.6). */
+type BillingCurrency = "CHF" | "EUR";
+/**
+ * The periods in the order the picker offers them — YEARLY FIRST (§12.17): a Merchant of
+ * Record takes about 5 % + 0.50 per transaction, so a small monthly price loses a fifth
+ * of itself (CHF 3 a month loses about 22 %). The page leads with the yearly price.
+ */
+declare const BILLING_INTERVALS: readonly BillingInterval[];
+/** One currency's prices, in minor units, per period. A period left out is not offered. */
+type PlanIntervalPrices = Partial<Record<BillingInterval, number>>;
+/** A plan's prices as server-kit's `PlanSpec.prices` sends them: currency → period →
+ *  minor units, GROSS (§12.17). */
+type PlanPrices = Partial<Record<BillingCurrency, PlanIntervalPrices>>;
+/**
+ * What one plan costs in one currency and period:
+ * - `price` — a gross amount in minor units;
+ * - `free` — a plan with no prices at all (keksdose's free plan), or a price of 0;
+ * - `not-offered` — a plan with prices, but none for this currency and period.
+ */
+type PlanPriceAnswer = {
+    kind: "price";
+    minor: number;
+} | {
+    kind: "free";
+} | {
+    kind: "not-offered";
+};
+/** What `prices` says for `currency` and `interval` — see {@link PlanPriceAnswer}. */
+declare function planPrice(prices: PlanPrices | null | undefined, currency: BillingCurrency, interval: BillingInterval): PlanPriceAnswer;
+/** Minor units as the amount: 4900 CHF → 49, 1250 EUR → 12.5. The currency's minor unit
+ *  comes from `Intl` (CHF and EUR have 2); a code `Intl` cannot read counts as 2. */
+declare function minorToMajor(minor: number, currency: string): number;
+/**
+ * A price in minor units, in the reader's notation: "CHF 49", "CHF 4.90", "49 €",
+ * "4,90 €". A whole amount drops its decimals — a price list reads "CHF 49" — and any
+ * other keeps all of them ("CHF 4.90", never "CHF 4.9").
+ */
+declare function formatPlanPrice(minor: number, currency: string, options?: {
+    locale?: string;
+}): string;
+/**
+ * The currency a payer starts with when the app stores none (§12.18): francs where the
+ * locale's region is Switzerland or Liechtenstein, euros everywhere else — "de-CH" and
+ * "fr-CH" CHF, "de" (Germany, once `Intl` fills the region in) and "it" EUR.
+ *
+ * Only the fallback: an account's stored currency comes first (keksdose's
+ * `reporting_currency` — a de-CH speaker living in Germany pays in euros), and the payer
+ * may switch in the picker either way; checkout takes the one they leave it on (§4).
+ */
+declare function billingCurrencyFor(locale?: string): BillingCurrency;
+
+export { BILLING_INTERVALS, type BillingCurrency, type BillingInterval, type PlanIntervalPrices, type PlanPriceAnswer, type PlanPrices, billingCurrencyFor, formatPlanPrice, minorToMajor, planPrice };

package/dist/billing/plan-price.js

@@ -0,0 +1,45 @@
+"use client";
+import { currencyMinorDigits, formatMoney } from "../lib/format.js";
+const BILLING_INTERVALS = Object.freeze(["year", "month"]);
+function hasAnyPrice(prices) {
+  if (!prices) return false;
+  return Object.values(prices).some(
+    (byInterval) => byInterval && Object.values(byInterval).some((v) => typeof v === "number")
+  );
+}
+function planPrice(prices, currency, interval) {
+  const minor = prices?.[currency]?.[interval];
+  if (typeof minor === "number" && Number.isFinite(minor)) {
+    return minor === 0 ? { kind: "free" } : { kind: "price", minor };
+  }
+  return hasAnyPrice(prices) ? { kind: "not-offered" } : { kind: "free" };
+}
+function minorToMajor(minor, currency) {
+  const digits = currencyMinorDigits(currency) ?? 2;
+  return minor / 10 ** digits;
+}
+function formatPlanPrice(minor, currency, options = {}) {
+  const digits = currencyMinorDigits(currency) ?? 2;
+  const whole = Number.isInteger(minor) && minor % 10 ** digits === 0;
+  return formatMoney(minorToMajor(minor, currency), currency, {
+    locale: options.locale,
+    digits: whole ? 0 : digits
+  });
+}
+function billingCurrencyFor(locale) {
+  if (!locale) return "EUR";
+  try {
+    const region = new Intl.Locale(locale).maximize().region;
+    return region === "CH" || region === "LI" ? "CHF" : "EUR";
+  } catch {
+    return "EUR";
+  }
+}
+export {
+  BILLING_INTERVALS,
+  billingCurrencyFor,
+  formatPlanPrice,
+  minorToMajor,
+  planPrice
+};
+//# sourceMappingURL=plan-price.js.map

package/dist/billing/plan-price.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/billing/plan-price.ts"],"sourcesContent":["import { currencyMinorDigits, formatMoney } from \"../lib/format\";\n\n/**\n * Money and periods of the plan catalogue (docs/billing-harmonization.md §3.1, §4, §12.17).\n *\n * Money crosses the wire as INTEGER MINOR UNITS plus an ISO currency, never as a float\n * (§4): 4900 CHF is CHF 49.00. The kit turns it into the reader's notation with\n * `formatMoney`, so no app divides by 100 by hand.\n */\n\n/** A billing period: the provider charges per month or per year. */\nexport type BillingInterval = \"month\" | \"year\";\n\n/** The two currencies every app sells in (§2.6). */\nexport type BillingCurrency = \"CHF\" | \"EUR\";\n\n/**\n * The periods in the order the picker offers them — YEARLY FIRST (§12.17): a Merchant of\n * Record takes about 5 % + 0.50 per transaction, so a small monthly price loses a fifth\n * of itself (CHF 3 a month loses about 22 %). The page leads with the yearly price.\n */\nexport const BILLING_INTERVALS: readonly BillingInterval[] = Object.freeze([\"year\", \"month\"]);\n\n/** One currency's prices, in minor units, per period. A period left out is not offered. */\nexport type PlanIntervalPrices = Partial<Record<BillingInterval, number>>;\n\n/** A plan's prices as server-kit's `PlanSpec.prices` sends them: currency → period →\n *  minor units, GROSS (§12.17). */\nexport type PlanPrices = Partial<Record<BillingCurrency, PlanIntervalPrices>>;\n\n/**\n * What one plan costs in one currency and period:\n * - `price` — a gross amount in minor units;\n * - `free` — a plan with no prices at all (keksdose's free plan), or a price of 0;\n * - `not-offered` — a plan with prices, but none for this currency and period.\n */\nexport type PlanPriceAnswer =\n  | { kind: \"price\"; minor: number }\n  | { kind: \"free\" }\n  | { kind: \"not-offered\" };\n\n/** Whether a price table holds any figure at all. */\nfunction hasAnyPrice(prices: PlanPrices | null | undefined): boolean {\n  if (!prices) return false;\n  return Object.values(prices).some(\n    (byInterval) => byInterval && Object.values(byInterval).some((v) => typeof v === \"number\"),\n  );\n}\n\n/** What `prices` says for `currency` and `interval` — see {@link PlanPriceAnswer}. */\nexport function planPrice(\n  prices: PlanPrices | null | undefined,\n  currency: BillingCurrency,\n  interval: BillingInterval,\n): PlanPriceAnswer {\n  const minor = prices?.[currency]?.[interval];\n  if (typeof minor === \"number\" && Number.isFinite(minor)) {\n    return minor === 0 ? { kind: \"free\" } : { kind: \"price\", minor };\n  }\n  return hasAnyPrice(prices) ? { kind: \"not-offered\" } : { kind: \"free\" };\n}\n\n/** Minor units as the amount: 4900 CHF → 49, 1250 EUR → 12.5. The currency's minor unit\n *  comes from `Intl` (CHF and EUR have 2); a code `Intl` cannot read counts as 2. */\nexport function minorToMajor(minor: number, currency: string): number {\n  const digits = currencyMinorDigits(currency) ?? 2;\n  return minor / 10 ** digits;\n}\n\n/**\n * A price in minor units, in the reader's notation: \"CHF 49\", \"CHF 4.90\", \"49 €\",\n * \"4,90 €\". A whole amount drops its decimals — a price list reads \"CHF 49\" — and any\n * other keeps all of them (\"CHF 4.90\", never \"CHF 4.9\").\n */\nexport function formatPlanPrice(minor: number, currency: string, options: { locale?: string } = {}): string {\n  const digits = currencyMinorDigits(currency) ?? 2;\n  const whole = Number.isInteger(minor) && minor % 10 ** digits === 0;\n  return formatMoney(minorToMajor(minor, currency), currency, {\n    locale: options.locale,\n    digits: whole ? 0 : digits,\n  });\n}\n\n/**\n * The currency a payer starts with when the app stores none (§12.18): francs where the\n * locale's region is Switzerland or Liechtenstein, euros everywhere else — \"de-CH\" and\n * \"fr-CH\" CHF, \"de\" (Germany, once `Intl` fills the region in) and \"it\" EUR.\n *\n * Only the fallback: an account's stored currency comes first (keksdose's\n * `reporting_currency` — a de-CH speaker living in Germany pays in euros), and the payer\n * may switch in the picker either way; checkout takes the one they leave it on (§4).\n */\nexport function billingCurrencyFor(locale?: string): BillingCurrency {\n  if (!locale) return \"EUR\";\n  try {\n    const region = new Intl.Locale(locale).maximize().region;\n    return region === \"CH\" || region === \"LI\" ? \"CHF\" : \"EUR\";\n  } catch {\n    return \"EUR\";\n  }\n}\n"],"mappings":";AAAA,SAAS,qBAAqB,mBAAmB;AAqB1C,MAAM,oBAAgD,OAAO,OAAO,CAAC,QAAQ,OAAO,CAAC;AAqB5F,SAAS,YAAY,QAAgD;AACnE,MAAI,CAAC,OAAQ,QAAO;AACpB,SAAO,OAAO,OAAO,MAAM,EAAE;AAAA,IAC3B,CAAC,eAAe,cAAc,OAAO,OAAO,UAAU,EAAE,KAAK,CAAC,MAAM,OAAO,MAAM,QAAQ;AAAA,EAC3F;AACF;AAGO,SAAS,UACd,QACA,UACA,UACiB;AACjB,QAAM,QAAQ,SAAS,QAAQ,IAAI,QAAQ;AAC3C,MAAI,OAAO,UAAU,YAAY,OAAO,SAAS,KAAK,GAAG;AACvD,WAAO,UAAU,IAAI,EAAE,MAAM,OAAO,IAAI,EAAE,MAAM,SAAS,MAAM;AAAA,EACjE;AACA,SAAO,YAAY,MAAM,IAAI,EAAE,MAAM,cAAc,IAAI,EAAE,MAAM,OAAO;AACxE;AAIO,SAAS,aAAa,OAAe,UAA0B;AACpE,QAAM,SAAS,oBAAoB,QAAQ,KAAK;AAChD,SAAO,QAAQ,MAAM;AACvB;AAOO,SAAS,gBAAgB,OAAe,UAAkB,UAA+B,CAAC,GAAW;AAC1G,QAAM,SAAS,oBAAoB,QAAQ,KAAK;AAChD,QAAM,QAAQ,OAAO,UAAU,KAAK,KAAK,QAAQ,MAAM,WAAW;AAClE,SAAO,YAAY,aAAa,OAAO,QAAQ,GAAG,UAAU;AAAA,IAC1D,QAAQ,QAAQ;AAAA,IAChB,QAAQ,QAAQ,IAAI;AAAA,EACtB,CAAC;AACH;AAWO,SAAS,mBAAmB,QAAkC;AACnE,MAAI,CAAC,OAAQ,QAAO;AACpB,MAAI;AACF,UAAM,SAAS,IAAI,KAAK,OAAO,MAAM,EAAE,SAAS,EAAE;AAClD,WAAO,WAAW,QAAQ,WAAW,OAAO,QAAQ;AAAA,EACtD,QAAQ;AACN,WAAO;AAAA,EACT;AACF;","names":[]}

package/dist/billing/subscription-actions.d.ts

@@ -0,0 +1,133 @@
+import * as react from 'react';
+import { ComponentPropsWithoutRef } from 'react';
+import { e4 as LabelOverride, bH as BillingLabels } from '../delete-account-setting-BvdQdbv3.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
+import '../data-table-labels-kpAAVi6g.js';
+import '../components/data-table-sort.js';
+import '../components/swipeable-row.js';
+import '../components/mini-calendar.js';
+import '../components/calendar-heatmap.js';
+import '../components/popover.js';
+import '../hooks/use-breakpoint.js';
+import '../components/chip.js';
+import 'lucide-react';
+import '../components/field-parts.js';
+import '../components/field-sync.js';
+import '../wizard/types.js';
+import '../tour/tour.js';
+import '../search/command-palette.js';
+import '../search/global-search.js';
+import '../search/search-index.js';
+import '../components/month-picker.js';
+import '../components/page-contents.js';
+import '../components/series-chart-labels.js';
+import '../components/pie-chart-labels.js';
+import '../components/sparkline.js';
+import '../components/stat-tile.js';
+import '../components/signature-pad.js';
+import '../components/password-strength.js';
+import '../components/swatch-picker.js';
+import '../components/tile-radio.js';
+import '../components/icon-picker.js';
+import '../components/dialog-frame.js';
+import '../components/modal.js';
+import '../hooks/use-search-param-state.js';
+import '../components/measured-grid.js';
+import '../components/user-avatar.js';
+import '../lib/person-name.js';
+import '../components/status-dot.js';
+import '../components/progress-bar.js';
+import '../components/signed-amount.js';
+import '../shell/topbar-action-menu.js';
+import '../components/menu-item.js';
+import '../components/floating-panel.js';
+import '../hooks/use-authed-src.js';
+import '../components/account-settings-labels.js';
+import '../components/bulk-action-bar.js';
+import '../components/list.js';
+import '../components/breadcrumbs.js';
+import '../components/toast.js';
+import '../components/description-list.js';
+import '../components/line-items.js';
+import '../components/error-boundary.js';
+import '../components/authed-image.js';
+import '../components/image-grid.js';
+import '../components/lightbox.js';
+import '../components/write-lock.js';
+import '../auth/sign-in-form.js';
+import '../landing/access.js';
+import '../landing/landing-labels.js';
+import '../shell/topbar-controls.js';
+import '../theme/palette-presets.js';
+import '../theme/chart-palette.js';
+import '../theme/theme-store.js';
+import 'zustand/middleware';
+import 'zustand';
+import '../auth/complete-name-dialog.js';
+import '../auth/forgot-password-form.js';
+import '../auth/status-parts.js';
+import '../auth/reset-password-form.js';
+import '../auth/verify-email.js';
+import '../auth/not-found-page.js';
+import '../auth/accept-invitation.js';
+import '../shell/company-switcher.js';
+import '../account/email-change-setting.js';
+import '../account/sessions-setting.js';
+import '../lib/format.js';
+import '../account/data-export-setting.js';
+import '../components/account-chips.js';
+import '../admin/admin-parts.js';
+import '../admin/admin-action-log.js';
+import '../settings/settings-labels.js';
+import '../demo/demo-labels.js';
+import '../components/appearance-labels.js';
+import '../theme/contrast.js';
+import '../theme/text-size.js';
+import '../components/reauth-dialog.js';
+import '../components/server-wake.js';
+import '../lib/server-wake.js';
+import '../components/translation-review-labels.js';
+import '../lib/translation-review.js';
+import '../components/country-select.js';
+import '../components/inline-edit-field.js';
+import '../lib/iban.js';
+import '../lib/phone.js';
+import '../components/sign-chip.js';
+import '../components/column-mapper.js';
+import '../lib/column-mapping.js';
+import '../lib/table-text.js';
+import '../components/focus-ring.js';
+
+interface SubscriptionActionsProps extends Omit<ComponentPropsWithoutRef<"div">, "children"> {
+    /** "Payment and invoices", as a link — or {@link onManage}. Without either, none. */
+    manageHref?: string;
+    /** "Payment and invoices", as the app's call: `POST /billing/portal`, then off to its
+     *  `url` (§4). The kit sends no request. */
+    onManage?: () => void;
+    /** "Cancel subscription", as a link — or {@link onCancel}. Without either, none. */
+    cancelHref?: string;
+    /** "Cancel subscription", as the app's call — usually the portal again, where the
+     *  provider's cancel and withdrawal functions are (§12.26). */
+    onCancel?: () => void;
+    /** Which of the two is under way: its spinner, no second press. */
+    pending?: "manage" | "cancel" | null;
+    /** Prop > `<UiKitProvider labels={{ billing }}>` > English. */
+    labels?: LabelOverride<BillingLabels>;
+}
+/**
+ * The two ways to the provider's hosted portal on the subscription page
+ * (docs/billing-harmonization.md §2.8, §7, §12.26): "Payment and invoices" — the payment
+ * method and the invoices live there, never in the app — and a VISIBLE "Cancel
+ * subscription". Consumer law wants the second in plain sight: Germany's cancellation
+ * button (§312k BGB) and the EU withdrawal function (Directive (EU) 2023/2673, from
+ * 19 June 2026) are in the portal, and the app's page must not hide the way there behind
+ * "manage".
+ *
+ * Neither takes the write lock: a read-only payer must be able to pay, leave or cancel
+ * (§3.3).
+ */
+declare function SubscriptionActions({ manageHref, onManage, cancelHref, onCancel, pending, labels: labelsProp, className, ...rest }: SubscriptionActionsProps): react.JSX.Element | null;
+
+export { SubscriptionActions, type SubscriptionActionsProps };

package/dist/billing/subscription-actions.js

@@ -0,0 +1,28 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/cn.js";
+import { Button } from "../components/ui.js";
+import { useBillingLabels } from "./billing-labels.js";
+function SubscriptionActions({
+  manageHref,
+  onManage,
+  cancelHref,
+  onCancel,
+  pending,
+  labels: labelsProp,
+  className,
+  ...rest
+}) {
+  const labels = useBillingLabels(labelsProp);
+  const manage = manageHref !== void 0 ? /* @__PURE__ */ jsx(Button, { href: manageHref, variant: "secondary", children: labels.manage }) : onManage !== void 0 ? /* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", onClick: onManage, pending: pending === "manage", children: labels.manage }) : null;
+  const cancel = cancelHref !== void 0 ? /* @__PURE__ */ jsx(Button, { href: cancelHref, variant: "link", tone: "danger", children: labels.cancel }) : onCancel !== void 0 ? /* @__PURE__ */ jsx(Button, { type: "button", variant: "link", tone: "danger", onClick: onCancel, pending: pending === "cancel", children: labels.cancel }) : null;
+  if (!manage && !cancel) return null;
+  return /* @__PURE__ */ jsxs("div", { ...rest, className: cn("flex flex-wrap items-center gap-x-4 gap-y-2", className), children: [
+    manage,
+    cancel
+  ] });
+}
+export {
+  SubscriptionActions
+};
+//# sourceMappingURL=subscription-actions.js.map

package/dist/billing/subscription-actions.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/billing/subscription-actions.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from \"react\";\n\nimport type { LabelOverride } from \"../i18n/kit-labels\";\nimport { cn } from \"../lib/cn\";\nimport { Button } from \"../components/ui\";\nimport { useBillingLabels } from \"./billing-labels\";\nimport type { BillingLabels } from \"./billing-labels\";\n\nexport interface SubscriptionActionsProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n  /** \"Payment and invoices\", as a link — or {@link onManage}. Without either, none. */\n  manageHref?: string;\n  /** \"Payment and invoices\", as the app's call: `POST /billing/portal`, then off to its\n   *  `url` (§4). The kit sends no request. */\n  onManage?: () => void;\n  /** \"Cancel subscription\", as a link — or {@link onCancel}. Without either, none. */\n  cancelHref?: string;\n  /** \"Cancel subscription\", as the app's call — usually the portal again, where the\n   *  provider's cancel and withdrawal functions are (§12.26). */\n  onCancel?: () => void;\n  /** Which of the two is under way: its spinner, no second press. */\n  pending?: \"manage\" | \"cancel\" | null;\n  /** Prop > `<UiKitProvider labels={{ billing }}>` > English. */\n  labels?: LabelOverride<BillingLabels>;\n}\n\n/**\n * The two ways to the provider's hosted portal on the subscription page\n * (docs/billing-harmonization.md §2.8, §7, §12.26): \"Payment and invoices\" — the payment\n * method and the invoices live there, never in the app — and a VISIBLE \"Cancel\n * subscription\". Consumer law wants the second in plain sight: Germany's cancellation\n * button (§312k BGB) and the EU withdrawal function (Directive (EU) 2023/2673, from\n * 19 June 2026) are in the portal, and the app's page must not hide the way there behind\n * \"manage\".\n *\n * Neither takes the write lock: a read-only payer must be able to pay, leave or cancel\n * (§3.3).\n */\nexport function SubscriptionActions({\n  manageHref,\n  onManage,\n  cancelHref,\n  onCancel,\n  pending,\n  labels: labelsProp,\n  className,\n  ...rest\n}: SubscriptionActionsProps) {\n  const labels = useBillingLabels(labelsProp);\n  const manage =\n    manageHref !== undefined ? (\n      <Button href={manageHref} variant=\"secondary\">\n        {labels.manage}\n      </Button>\n    ) : onManage !== undefined ? (\n      <Button type=\"button\" variant=\"secondary\" onClick={onManage} pending={pending === \"manage\"}>\n        {labels.manage}\n      </Button>\n    ) : null;\n  const cancel =\n    cancelHref !== undefined ? (\n      <Button href={cancelHref} variant=\"link\" tone=\"danger\">\n        {labels.cancel}\n      </Button>\n    ) : onCancel !== undefined ? (\n      <Button type=\"button\" variant=\"link\" tone=\"danger\" onClick={onCancel} pending={pending === \"cancel\"}>\n        {labels.cancel}\n      </Button>\n    ) : null;\n  if (!manage && !cancel) return null;\n  return (\n    <div {...rest} className={cn(\"flex flex-wrap items-center gap-x-4 gap-y-2\", className)}>\n      {manage}\n      {cancel}\n    </div>\n  );\n}\n"],"mappings":";AAkDM,cAoBF,YApBE;AA/CN,SAAS,UAAU;AACnB,SAAS,cAAc;AACvB,SAAS,wBAAwB;AAgC1B,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,GAAG;AACL,GAA6B;AAC3B,QAAM,SAAS,iBAAiB,UAAU;AAC1C,QAAM,SACJ,eAAe,SACb,oBAAC,UAAO,MAAM,YAAY,SAAQ,aAC/B,iBAAO,QACV,IACE,aAAa,SACf,oBAAC,UAAO,MAAK,UAAS,SAAQ,aAAY,SAAS,UAAU,SAAS,YAAY,UAC/E,iBAAO,QACV,IACE;AACN,QAAM,SACJ,eAAe,SACb,oBAAC,UAAO,MAAM,YAAY,SAAQ,QAAO,MAAK,UAC3C,iBAAO,QACV,IACE,aAAa,SACf,oBAAC,UAAO,MAAK,UAAS,SAAQ,QAAO,MAAK,UAAS,SAAS,UAAU,SAAS,YAAY,UACxF,iBAAO,QACV,IACE;AACN,MAAI,CAAC,UAAU,CAAC,OAAQ,QAAO;AAC/B,SACE,qBAAC,SAAK,GAAG,MAAM,WAAW,GAAG,+CAA+C,SAAS,GAClF;AAAA;AAAA,IACA;AAAA,KACH;AAEJ;","names":[]}

package/dist/billing/subscription-status-chip.d.ts

@@ -0,0 +1,149 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import { fb as SubscriptionStatus, e4 as LabelOverride, bH as BillingLabels } from '../delete-account-setting-BvdQdbv3.js';
+import { ChipTone, ChipSize, ChipVariant, ChipShape } from '../components/chip.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
+import '../data-table-labels-kpAAVi6g.js';
+import '../components/data-table-sort.js';
+import '../components/swipeable-row.js';
+import '../components/mini-calendar.js';
+import '../components/calendar-heatmap.js';
+import '../components/popover.js';
+import '../hooks/use-breakpoint.js';
+import '../components/field-sync.js';
+import '../wizard/types.js';
+import '../tour/tour.js';
+import '../search/command-palette.js';
+import '../search/global-search.js';
+import '../search/search-index.js';
+import '../components/month-picker.js';
+import '../components/page-contents.js';
+import '../components/series-chart-labels.js';
+import '../components/pie-chart-labels.js';
+import '../components/sparkline.js';
+import '../components/stat-tile.js';
+import '../components/signature-pad.js';
+import '../components/password-strength.js';
+import '../components/swatch-picker.js';
+import '../components/tile-radio.js';
+import '../components/icon-picker.js';
+import '../components/dialog-frame.js';
+import '../components/modal.js';
+import '../hooks/use-search-param-state.js';
+import '../components/measured-grid.js';
+import 'lucide-react';
+import '../components/user-avatar.js';
+import '../lib/person-name.js';
+import '../components/status-dot.js';
+import '../components/progress-bar.js';
+import '../components/signed-amount.js';
+import '../components/field-parts.js';
+import '../shell/topbar-action-menu.js';
+import '../components/menu-item.js';
+import '../components/floating-panel.js';
+import '../hooks/use-authed-src.js';
+import '../components/account-settings-labels.js';
+import '../components/bulk-action-bar.js';
+import '../components/list.js';
+import '../components/breadcrumbs.js';
+import '../components/toast.js';
+import '../components/description-list.js';
+import '../components/line-items.js';
+import '../components/error-boundary.js';
+import '../components/authed-image.js';
+import '../components/image-grid.js';
+import '../components/lightbox.js';
+import '../components/write-lock.js';
+import '../auth/sign-in-form.js';
+import '../landing/access.js';
+import '../landing/landing-labels.js';
+import '../shell/topbar-controls.js';
+import '../theme/palette-presets.js';
+import '../theme/chart-palette.js';
+import '../theme/theme-store.js';
+import 'zustand/middleware';
+import 'zustand';
+import '../auth/complete-name-dialog.js';
+import '../auth/forgot-password-form.js';
+import '../auth/status-parts.js';
+import '../auth/reset-password-form.js';
+import '../auth/verify-email.js';
+import '../auth/not-found-page.js';
+import '../auth/accept-invitation.js';
+import '../shell/company-switcher.js';
+import '../account/email-change-setting.js';
+import '../account/sessions-setting.js';
+import '../lib/format.js';
+import '../account/data-export-setting.js';
+import '../components/account-chips.js';
+import '../admin/admin-parts.js';
+import '../admin/admin-action-log.js';
+import '../settings/settings-labels.js';
+import '../demo/demo-labels.js';
+import '../components/appearance-labels.js';
+import '../theme/contrast.js';
+import '../theme/text-size.js';
+import '../components/reauth-dialog.js';
+import '../components/server-wake.js';
+import '../lib/server-wake.js';
+import '../components/translation-review-labels.js';
+import '../lib/translation-review.js';
+import '../components/country-select.js';
+import '../components/inline-edit-field.js';
+import '../lib/iban.js';
+import '../lib/phone.js';
+import '../components/sign-chip.js';
+import '../components/column-mapper.js';
+import '../lib/column-mapping.js';
+import '../lib/table-text.js';
+import '../components/focus-ring.js';
+
+/**
+ * The tone of each status (docs/billing-harmonization.md §3.2, §3.3). The tone follows
+ * the STANDING, so a roster reads at a glance who can write:
+ *
+ * - `active` green: paid, in good standing;
+ * - `trialing` blue (info): in good standing until `trial_ends_at`, nothing wrong;
+ * - `past_due` amber: a payment failed, still in good standing while the provider retries;
+ * - `expired` red: out of good standing — read-only until a plan is chosen;
+ * - `canceled` grey: the payer's own choice, nothing to warn about;
+ * - `comped` purple, a hue rather than a tone: free by grant — neither paid nor in trouble,
+ *   only different from both.
+ */
+declare const SUBSCRIPTION_STATUS_TONES: Readonly<Record<SubscriptionStatus, ChipTone>>;
+interface SubscriptionStatusChipProps {
+    /**
+     * The row's `status` as the API sends it (§3.2). A value the kit does not know yet is
+     * shown as itself, in `neutral` — an unknown status is still a fact an operator should
+     * see. `null` / `undefined` renders nothing.
+     */
+    status: SubscriptionStatus | (string & {}) | null | undefined;
+    /** Over {@link SUBSCRIPTION_STATUS_TONES}. */
+    tone?: ChipTone;
+    /** Over the status's word, for an app whose word is its own. */
+    children?: ReactNode;
+    /** Default `sm` (a roster's `extra` column, §6). */
+    size?: ChipSize;
+    /** Default `soft`. */
+    variant?: ChipVariant;
+    /** Default `square`, the status tag of `AccountStateChip`. */
+    shape?: ChipShape;
+    /** Default true, as `AccountStateChip`. */
+    caps?: boolean;
+    className?: string;
+    /** Prop > `<UiKitProvider labels={{ billing: { status } }}>` > English. */
+    labels?: LabelOverride<BillingLabels>;
+    [key: `data-${string}`]: string | number | boolean | undefined;
+}
+/**
+ * A subscription's status as a chip, in the kit's words and tones (§6: the operator's
+ * roster shows the plan and the standing; §7: the subscription page). ALWAYS A WORD, never
+ * colour alone: "Trial", "Active", "Payment overdue", "Cancelled", "Expired",
+ * "Complimentary" — the tone repeats what the word says. Carries `data-status` with the
+ * key, for a test or a style hook.
+ */
+declare function SubscriptionStatusChip({ status, tone, children, size, variant, shape, caps, className, labels: labelsProp, ...rest }: SubscriptionStatusChipProps): react.JSX.Element | null;
+
+export { SUBSCRIPTION_STATUS_TONES, SubscriptionStatusChip, type SubscriptionStatusChipProps };

package/dist/billing/subscription-status-chip.js

@@ -0,0 +1,48 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { Chip } from "../components/chip.js";
+import { useBillingLabels } from "./billing-labels.js";
+const SUBSCRIPTION_STATUS_TONES = Object.freeze({
+  trialing: "info",
+  active: "success",
+  past_due: "warning",
+  canceled: "neutral",
+  expired: "danger",
+  comped: "purple"
+});
+const isKnown = (value) => Object.prototype.hasOwnProperty.call(SUBSCRIPTION_STATUS_TONES, value);
+function SubscriptionStatusChip({
+  status,
+  tone,
+  children,
+  size = "sm",
+  variant,
+  shape = "square",
+  caps = true,
+  className,
+  labels: labelsProp,
+  ...rest
+}) {
+  const labels = useBillingLabels(labelsProp);
+  if (status === null || status === void 0 || status === "") return null;
+  const known = isKnown(status);
+  return /* @__PURE__ */ jsx(
+    Chip,
+    {
+      ...rest,
+      "data-status": status,
+      tone: tone ?? (known ? SUBSCRIPTION_STATUS_TONES[status] : "neutral"),
+      size,
+      variant,
+      shape,
+      caps,
+      className,
+      children: children ?? (known ? labels.status[status] : status)
+    }
+  );
+}
+export {
+  SUBSCRIPTION_STATUS_TONES,
+  SubscriptionStatusChip
+};
+//# sourceMappingURL=subscription-status-chip.js.map

package/dist/billing/subscription-status-chip.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/billing/subscription-status-chip.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\n\nimport type { LabelOverride } from \"../i18n/kit-labels\";\nimport { Chip } from \"../components/chip\";\nimport type { ChipShape, ChipSize, ChipTone, ChipVariant } from \"../components/chip\";\nimport { useBillingLabels } from \"./billing-labels\";\nimport type { BillingLabels, SubscriptionStatus } from \"./billing-labels\";\n\n/**\n * The tone of each status (docs/billing-harmonization.md §3.2, §3.3). The tone follows\n * the STANDING, so a roster reads at a glance who can write:\n *\n * - `active` green: paid, in good standing;\n * - `trialing` blue (info): in good standing until `trial_ends_at`, nothing wrong;\n * - `past_due` amber: a payment failed, still in good standing while the provider retries;\n * - `expired` red: out of good standing — read-only until a plan is chosen;\n * - `canceled` grey: the payer's own choice, nothing to warn about;\n * - `comped` purple, a hue rather than a tone: free by grant — neither paid nor in trouble,\n *   only different from both.\n */\nexport const SUBSCRIPTION_STATUS_TONES: Readonly<Record<SubscriptionStatus, ChipTone>> = Object.freeze({\n  trialing: \"info\",\n  active: \"success\",\n  past_due: \"warning\",\n  canceled: \"neutral\",\n  expired: \"danger\",\n  comped: \"purple\",\n});\n\nexport interface SubscriptionStatusChipProps {\n  /**\n   * The row's `status` as the API sends it (§3.2). A value the kit does not know yet is\n   * shown as itself, in `neutral` — an unknown status is still a fact an operator should\n   * see. `null` / `undefined` renders nothing.\n   */\n  status: SubscriptionStatus | (string & {}) | null | undefined;\n  /** Over {@link SUBSCRIPTION_STATUS_TONES}. */\n  tone?: ChipTone;\n  /** Over the status's word, for an app whose word is its own. */\n  children?: ReactNode;\n  /** Default `sm` (a roster's `extra` column, §6). */\n  size?: ChipSize;\n  /** Default `soft`. */\n  variant?: ChipVariant;\n  /** Default `square`, the status tag of `AccountStateChip`. */\n  shape?: ChipShape;\n  /** Default true, as `AccountStateChip`. */\n  caps?: boolean;\n  className?: string;\n  /** Prop > `<UiKitProvider labels={{ billing: { status } }}>` > English. */\n  labels?: LabelOverride<BillingLabels>;\n  [key: `data-${string}`]: string | number | boolean | undefined;\n}\n\n// Own keys only: `\"toString\" in {}` is true.\nconst isKnown = (value: string): value is SubscriptionStatus =>\n  Object.prototype.hasOwnProperty.call(SUBSCRIPTION_STATUS_TONES, value);\n\n/**\n * A subscription's status as a chip, in the kit's words and tones (§6: the operator's\n * roster shows the plan and the standing; §7: the subscription page). ALWAYS A WORD, never\n * colour alone: \"Trial\", \"Active\", \"Payment overdue\", \"Cancelled\", \"Expired\",\n * \"Complimentary\" — the tone repeats what the word says. Carries `data-status` with the\n * key, for a test or a style hook.\n */\nexport function SubscriptionStatusChip({\n  status,\n  tone,\n  children,\n  size = \"sm\",\n  variant,\n  shape = \"square\",\n  caps = true,\n  className,\n  labels: labelsProp,\n  ...rest\n}: SubscriptionStatusChipProps) {\n  const labels = useBillingLabels(labelsProp);\n  if (status === null || status === undefined || status === \"\") return null;\n  const known = isKnown(status);\n  return (\n    <Chip\n      {...rest}\n      data-status={status}\n      tone={tone ?? (known ? SUBSCRIPTION_STATUS_TONES[status] : \"neutral\")}\n      size={size}\n      variant={variant}\n      shape={shape}\n      caps={caps}\n      className={className}\n    >\n      {children ?? (known ? labels.status[status] : status)}\n    </Chip>\n  );\n}\n"],"mappings":";AAiFI;AA9EJ,SAAS,YAAY;AAErB,SAAS,wBAAwB;AAe1B,MAAM,4BAA4E,OAAO,OAAO;AAAA,EACrG,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AACV,CAAC;AA4BD,MAAM,UAAU,CAAC,UACf,OAAO,UAAU,eAAe,KAAK,2BAA2B,KAAK;AAShE,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP;AAAA,EACA,QAAQ;AAAA,EACR,GAAG;AACL,GAAgC;AAC9B,QAAM,SAAS,iBAAiB,UAAU;AAC1C,MAAI,WAAW,QAAQ,WAAW,UAAa,WAAW,GAAI,QAAO;AACrE,QAAM,QAAQ,QAAQ,MAAM;AAC5B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAa;AAAA,MACb,MAAM,SAAS,QAAQ,0BAA0B,MAAM,IAAI;AAAA,MAC3D;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEC,uBAAa,QAAQ,OAAO,OAAO,MAAM,IAAI;AAAA;AAAA,EAChD;AAEJ;","names":[]}

package/dist/chart.d.ts

@@ -13,18 +13,21 @@ export { TimeTickUnit } from './components/series-chart-ticks.js';
 import 'recharts';
 import 'react';
 import './lib/direction.js';
-import './delete-account-setting-DCFS5Vof.js';
+import './components/chart-height.js';
+import './delete-account-setting-BvdQdbv3.js';
 import './components/tooltip.js';
 import './hooks/use-anchored-rect.js';
 import './lib/clipping.js';
-import './data-table-labels-DUELeXpa.js';
+import './data-table-labels-kpAAVi6g.js';
 import './components/data-table-sort.js';
 import './components/swipeable-row.js';
 import './components/mini-calendar.js';
 import './components/calendar-heatmap.js';
 import './components/popover.js';
+import './hooks/use-breakpoint.js';
 import './components/chip.js';
 import 'lucide-react';
+import './components/field-parts.js';
 import './components/field-sync.js';
 import './wizard/types.js';
 import './tour/tour.js';
@@ -90,6 +93,9 @@ import './admin/admin-parts.js';
 import './admin/admin-action-log.js';
 import './settings/settings-labels.js';
 import './demo/demo-labels.js';
+import './components/appearance-labels.js';
+import './theme/contrast.js';
+import './theme/text-size.js';
 import './components/reauth-dialog.js';
 import './components/server-wake.js';
 import './lib/server-wake.js';
@@ -103,4 +109,4 @@ import './components/sign-chip.js';
 import './components/column-mapper.js';
 import './lib/column-mapping.js';
 import './lib/table-text.js';
-import './components/field-parts.js';
+import './components/focus-ring.js';

package/dist/components/account-chips.d.ts

@@ -3,7 +3,11 @@ import { ReactElement, ReactNode } from 'react';
 import { LucideIcon } from 'lucide-react';
 import { DateInput, FormatDateStyle, FormatRelativeTimeOptions } from '../lib/format.js';
 import { ChipTone, ChipSize, ChipVariant, ChipShape } from './chip.js';
-import { d as DataTableColumn } from '../data-table-labels-DUELeXpa.js';
+import { d as DataTableColumn } from '../data-table-labels-kpAAVi6g.js';
+import './field-parts.js';
+import './tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
 import './data-table-sort.js';
 import './swipeable-row.js';
 
@@ -147,10 +151,18 @@ interface DateMarkProps {
     /**
      * `"date"` (default): the date in `dateStyle` — "Created". `"relative"`: how long
      * ago — "Last login", where the question is "recently?" — with the full date and
-     * time in a tooltip (keksdose's last-seen column).
+     * time beside it (keksdose's last-seen column; see `absolute`).
      */
     display?: "date" | "relative";
-    /** Default `medium`. Under `"relative"`, the style of the tooltip's date (default
+    /**
+     * Where a `"relative"` mark puts the exact date and time (0.32,
+     * docs/text-size-harmonization.md §4: "relative dates show the absolute one beside
+     * them", at every size — a touch screen never opens the tooltip it used to live in):
+     * `"below"` (default), a muted second line under the words, so a table column keeps
+     * its width; `"inline"`, after them on the same line, for a sentence or a wide cell.
+     */
+    absolute?: "below" | "inline";
+    /** Default `medium`. Under `"relative"`, the style of the exact date beside it (default
      *  `dateTime`) and of the date `relative.absoluteAfterDays` switches to. Given, it wins
      *  over the provider's `formatDate`. */
     dateStyle?: FormatDateStyle | Intl.DateTimeFormatOptions;
@@ -174,7 +186,7 @@ interface DateMarkProps {
  * an empty answer, it is `Intl`'s `medium` date as before. The relative display is not
  * a calendar day and keeps `formatRelativeTime`.
  */
-declare function DateMark({ value, display, dateStyle, relative, empty, locale: localeProp, className, }: DateMarkProps): react.JSX.Element;
+declare function DateMark({ value, display, dateStyle, relative, absolute, empty, locale: localeProp, className, }: DateMarkProps): react.JSX.Element;
 interface DateColumnOptions<T> extends Omit<DateMarkProps, "value" | "className"> {
     key: string;
     header: ReactNode;

package/dist/components/account-chips.js

@@ -1,11 +1,10 @@
 "use client";
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { cn } from "../lib/cn.js";
 import { formatDate, formatRelativeTime, toDate, EMPTY_FORMATTED_VALUE } from "../lib/format.js";
 import { useKitDateFormatter, useKitLabels, useKitLocale } from "../i18n/kit-labels.js";
 import { toLocalIso } from "../lib/dates.js";
 import { Chip } from "./chip.js";
-import { Tooltip } from "./tooltip.js";
 function RoleChip({
   value: role,
   roles,
@@ -99,6 +98,7 @@ function DateMark({
   display = "date",
   dateStyle,
   relative,
+  absolute = "below",
   empty = EMPTY_FORMATTED_VALUE,
   locale: localeProp,
   className
@@ -113,7 +113,25 @@ function DateMark({
     return /* @__PURE__ */ jsx("time", { dateTime: date.toISOString(), className: cls, children: own || formatDate(date, dateStyle ?? "medium", { locale }) });
   }
   const text = formatRelativeTime(date, { ...relative, locale, absoluteStyle: dateStyle ?? "medium" });
-  return /* @__PURE__ */ jsx(Tooltip, { label: formatDate(date, dateStyle ?? "dateTime", { locale }), lazy: true, children: /* @__PURE__ */ jsx("time", { dateTime: date.toISOString(), className: cls, children: text }) });
+  const exact = formatDate(date, dateStyle ?? "dateTime", { locale });
+  const sameDay = text === formatDate(date, dateStyle ?? "medium", { locale });
+  const iso = date.toISOString();
+  if (sameDay) {
+    return /* @__PURE__ */ jsx("time", { dateTime: iso, className: cls, children: exact });
+  }
+  return /* @__PURE__ */ jsxs(
+    "time",
+    {
+      dateTime: iso,
+      "data-slot": "date-mark",
+      className: cn(absolute === "below" ? "inline-flex flex-col leading-tight" : "inline", className),
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "whitespace-nowrap tabular-nums", children: text }),
+        absolute === "inline" && " \xB7 ",
+        /* @__PURE__ */ jsx("span", { className: cn("whitespace-nowrap tabular-nums text-[var(--text-muted)]", absolute === "below" && "text-xs"), children: exact })
+      ]
+    }
+  );
 }
 function dateColumn({
   key,