@lattice-php/lattice 0.18.0 → 0.20.0

package/dist/form/rich-editor/toolbar-button.js

@@ -0,0 +1,28 @@
+import { IconButton } from "../../ui/icon-button.js";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region resources/js/form/rich-editor/toolbar-button.tsx
+/**
+* The shared editor toolbar trigger: an {@link IconButton} that keeps focus in
+* the editor (mousedown is prevented so clicks don't blur it, which would
+* otherwise trigger a precognition request).
+*/
+function ToolbarIconButton({ active = false, icon, label, testId, ...props }) {
+	return /* @__PURE__ */ jsx(IconButton, {
+		size: "sm",
+		icon,
+		label,
+		title: label,
+		active,
+		"data-test": testId,
+		...props,
+		onMouseDown: (event) => {
+			event.preventDefault();
+			props.onMouseDown?.(event);
+		}
+	});
+}
+//#endregion
+export { ToolbarIconButton };
+
+//# sourceMappingURL=toolbar-button.js.map

package/dist/form/rich-editor/toolbar-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"toolbar-button.js","names":[],"sources":["../../../resources/js/form/rich-editor/toolbar-button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { IconButton } from \"@lattice-php/lattice/ui/icon-button\";\n\n/**\n * The shared editor toolbar trigger: an {@link IconButton} that keeps focus in\n * the editor (mousedown is prevented so clicks don't blur it, which would\n * otherwise trigger a precognition request).\n */\nexport function ToolbarIconButton({\n  active = false,\n  icon,\n  label,\n  testId,\n  ...props\n}: React.ComponentProps<\"button\"> & {\n  active?: boolean;\n  icon: string;\n  label: string;\n  testId: string;\n}) {\n  return (\n    <IconButton\n      size=\"sm\"\n      icon={icon}\n      label={label}\n      title={label}\n      active={active}\n      data-test={testId}\n      {...props}\n      onMouseDown={(event) => {\n        event.preventDefault();\n        props.onMouseDown?.(event);\n      }}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;AAQA,SAAgB,kBAAkB,EAChC,SAAS,OACT,MACA,OACA,QACA,GAAG,SAMF;CACD,OACE,oBAAC,YAAD;EACE,MAAK;EACC;EACC;EACP,OAAO;EACC;EACR,aAAW;EACX,GAAI;EACJ,cAAc,UAAU;GACtB,MAAM,eAAe;GACrB,MAAM,cAAc,KAAK;EAC3B;CACD,CAAA;AAEL"}

package/dist/form/types.d.ts

@@ -1,12 +1,7 @@
 import { Method } from '@inertiajs/core';
 import { NodeUnionOf } from '../core/types.js';
 import { FormFieldNodeType, FormNodeType } from '../types/generated.js';
-export type { Checkbox, Choice, DateInput, DateTimeInput, Form, FormNodeType, HiddenInput, NumberInput, PasswordInput, RichEditor, Select, Textarea, TextInput, TimeInput, } from '../types/generated.js';
+export type { Checkbox, Choice, DateInput, DateTimeInput, Form, FormNodeType, HiddenInput, LabelAction, NumberInput, PasswordInput, RichEditor, Select, Textarea, TextInput, TimeInput, } from '../types/generated.js';
 export type FormFieldNode = NodeUnionOf<FormFieldNodeType>;
 export type FormNode = NodeUnionOf<FormNodeType>;
 export type FormMethod = Method;
-export type FormLabelAction = {
-    href: string;
-    label: string;
-    tabIndex?: number;
-};

package/dist/format/date-time.d.ts

@@ -1,10 +1,11 @@
+import { DateTimeStyle } from '../types/generated.js';
 export type FormatOptions = {
     locale?: string;
     timeZone?: string;
 };
 export type DateConfig = {
-    dateStyle: string | null;
-    timeStyle: string | null;
+    dateStyle: DateTimeStyle | null;
+    timeStyle: DateTimeStyle | null;
     month?: string | null;
     year?: string | null;
 };

package/dist/format/date-time.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-time.js","names":[],"sources":["../../resources/js/format/date-time.ts"],"sourcesContent":["export type FormatOptions = {\n  locale?: string;\n  timeZone?: string;\n};\n\nexport type DateConfig = {\n  dateStyle: string | null;\n  timeStyle: string | null;\n  month?: string | null;\n  year?: string | null;\n};\n\nexport function formatDateValue(value: unknown, date: DateConfig, options?: FormatOptions): string {\n  const parsed = new Date(String(value));\n\n  if (Number.isNaN(parsed.getTime())) {\n    return String(value ?? \"\");\n  }\n\n  const intl: Intl.DateTimeFormatOptions = { timeZone: options?.timeZone };\n\n  if (date.dateStyle) {\n    intl.dateStyle = date.dateStyle as Intl.DateTimeFormatOptions[\"dateStyle\"];\n  }\n\n  if (date.timeStyle) {\n    intl.timeStyle = date.timeStyle as Intl.DateTimeFormatOptions[\"timeStyle\"];\n  }\n\n  if (date.month) {\n    intl.month = date.month as Intl.DateTimeFormatOptions[\"month\"];\n  }\n\n  if (date.year) {\n    intl.year = date.year as Intl.DateTimeFormatOptions[\"year\"];\n  }\n\n  return new Intl.DateTimeFormat(options?.locale, intl).format(parsed);\n}\n\nexport function preciseDateTime(value: unknown, options?: FormatOptions): string {\n  const date = new Date(String(value));\n\n  if (Number.isNaN(date.getTime())) {\n    return \"\";\n  }\n\n  const formatted = new Intl.DateTimeFormat(options?.locale, {\n    year: \"numeric\",\n    month: \"short\",\n    day: \"numeric\",\n    hour: \"2-digit\",\n    minute: \"2-digit\",\n    second: \"2-digit\",\n    timeZone: options?.timeZone,\n    timeZoneName: \"short\",\n  }).format(date);\n\n  return options?.timeZone ? `${formatted} (${options.timeZone})` : formatted;\n}\n"],"mappings":";AAYA,SAAgB,gBAAgB,OAAgB,MAAkB,SAAiC;CACjG,MAAM,SAAS,IAAI,KAAK,OAAO,KAAK,CAAC;CAErC,IAAI,OAAO,MAAM,OAAO,QAAQ,CAAC,GAC/B,OAAO,OAAO,SAAS,EAAE;CAG3B,MAAM,OAAmC,EAAE,UAAU,SAAS,SAAS;CAEvE,IAAI,KAAK,WACP,KAAK,YAAY,KAAK;CAGxB,IAAI,KAAK,WACP,KAAK,YAAY,KAAK;CAGxB,IAAI,KAAK,OACP,KAAK,QAAQ,KAAK;CAGpB,IAAI,KAAK,MACP,KAAK,OAAO,KAAK;CAGnB,OAAO,IAAI,KAAK,eAAe,SAAS,QAAQ,IAAI,EAAE,OAAO,MAAM;AACrE;AAEA,SAAgB,gBAAgB,OAAgB,SAAiC;CAC/E,MAAM,OAAO,IAAI,KAAK,OAAO,KAAK,CAAC;CAEnC,IAAI,OAAO,MAAM,KAAK,QAAQ,CAAC,GAC7B,OAAO;CAGT,MAAM,YAAY,IAAI,KAAK,eAAe,SAAS,QAAQ;EACzD,MAAM;EACN,OAAO;EACP,KAAK;EACL,MAAM;EACN,QAAQ;EACR,QAAQ;EACR,UAAU,SAAS;EACnB,cAAc;CAChB,CAAC,EAAE,OAAO,IAAI;CAEd,OAAO,SAAS,WAAW,GAAG,UAAU,IAAI,QAAQ,SAAS,KAAK;AACpE"}
+{"version":3,"file":"date-time.js","names":[],"sources":["../../resources/js/format/date-time.ts"],"sourcesContent":["import type { DateTimeStyle } from \"@lattice-php/lattice/types/generated\";\n\nexport type FormatOptions = {\n  locale?: string;\n  timeZone?: string;\n};\n\nexport type DateConfig = {\n  dateStyle: DateTimeStyle | null;\n  timeStyle: DateTimeStyle | null;\n  month?: string | null;\n  year?: string | null;\n};\n\nexport function formatDateValue(value: unknown, date: DateConfig, options?: FormatOptions): string {\n  const parsed = new Date(String(value));\n\n  if (Number.isNaN(parsed.getTime())) {\n    return String(value ?? \"\");\n  }\n\n  const intl: Intl.DateTimeFormatOptions = { timeZone: options?.timeZone };\n\n  if (date.dateStyle) {\n    intl.dateStyle = date.dateStyle;\n  }\n\n  if (date.timeStyle) {\n    intl.timeStyle = date.timeStyle;\n  }\n\n  if (date.month) {\n    intl.month = date.month as Intl.DateTimeFormatOptions[\"month\"];\n  }\n\n  if (date.year) {\n    intl.year = date.year as Intl.DateTimeFormatOptions[\"year\"];\n  }\n\n  return new Intl.DateTimeFormat(options?.locale, intl).format(parsed);\n}\n\nexport function preciseDateTime(value: unknown, options?: FormatOptions): string {\n  const date = new Date(String(value));\n\n  if (Number.isNaN(date.getTime())) {\n    return \"\";\n  }\n\n  const formatted = new Intl.DateTimeFormat(options?.locale, {\n    year: \"numeric\",\n    month: \"short\",\n    day: \"numeric\",\n    hour: \"2-digit\",\n    minute: \"2-digit\",\n    second: \"2-digit\",\n    timeZone: options?.timeZone,\n    timeZoneName: \"short\",\n  }).format(date);\n\n  return options?.timeZone ? `${formatted} (${options.timeZone})` : formatted;\n}\n"],"mappings":";AAcA,SAAgB,gBAAgB,OAAgB,MAAkB,SAAiC;CACjG,MAAM,SAAS,IAAI,KAAK,OAAO,KAAK,CAAC;CAErC,IAAI,OAAO,MAAM,OAAO,QAAQ,CAAC,GAC/B,OAAO,OAAO,SAAS,EAAE;CAG3B,MAAM,OAAmC,EAAE,UAAU,SAAS,SAAS;CAEvE,IAAI,KAAK,WACP,KAAK,YAAY,KAAK;CAGxB,IAAI,KAAK,WACP,KAAK,YAAY,KAAK;CAGxB,IAAI,KAAK,OACP,KAAK,QAAQ,KAAK;CAGpB,IAAI,KAAK,MACP,KAAK,OAAO,KAAK;CAGnB,OAAO,IAAI,KAAK,eAAe,SAAS,QAAQ,IAAI,EAAE,OAAO,MAAM;AACrE;AAEA,SAAgB,gBAAgB,OAAgB,SAAiC;CAC/E,MAAM,OAAO,IAAI,KAAK,OAAO,KAAK,CAAC;CAEnC,IAAI,OAAO,MAAM,KAAK,QAAQ,CAAC,GAC7B,OAAO;CAGT,MAAM,YAAY,IAAI,KAAK,eAAe,SAAS,QAAQ;EACzD,MAAM;EACN,OAAO;EACP,KAAK;EACL,MAAM;EACN,QAAQ;EACR,QAAQ;EACR,UAAU,SAAS;EACnB,cAAc;CAChB,CAAC,EAAE,OAAO,IAAI;CAEd,OAAO,SAAS,WAAW,GAAG,UAAU,IAAI,QAAQ,SAAS,KAAK;AACpE"}

package/dist/i18n/backend.js

@@ -1,5 +1,5 @@
-import { localeHeader } from "./locale.js";
 import { setConfig } from "./config.js";
+import { localeHeader } from "./locale.js";
 import { ensureI18n, i18n, preloadLanguages } from "./instance.js";
 import HttpBackend from "i18next-http-backend";
 //#region resources/js/i18n/backend.ts

package/dist/i18n/date-time.d.ts

@@ -1,7 +1,8 @@
 import { ReactNode } from 'react';
+import { DateTimeStyle } from '../types/generated.js';
 export type DateTimeProps = {
     value: unknown;
-    dateStyle?: string | null;
-    timeStyle?: string | null;
+    dateStyle?: DateTimeStyle | null;
+    timeStyle?: DateTimeStyle | null;
 };
 export declare function DateTime({ value, dateStyle, timeStyle, }: DateTimeProps): ReactNode;

package/dist/i18n/date-time.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-time.js","names":[],"sources":["../../resources/js/i18n/date-time.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport {\n  type FormatOptions,\n  formatDateValue,\n  preciseDateTime,\n} from \"@lattice-php/lattice/format/date-time\";\nimport { useLocale } from \"./locale\";\nimport { useTimezone } from \"./timezone\";\n\nexport type DateTimeProps = {\n  value: unknown;\n  dateStyle?: string | null;\n  timeStyle?: string | null;\n};\n\nexport function DateTime({\n  value,\n  dateStyle = \"medium\",\n  timeStyle = \"short\",\n}: DateTimeProps): ReactNode {\n  const { locale } = useLocale();\n  const { timezone } = useTimezone();\n\n  if (value === null || value === undefined || value === \"\") {\n    return null;\n  }\n\n  const options: FormatOptions = { locale, timeZone: timezone };\n  const text = formatDateValue(value, { dateStyle, timeStyle }, options);\n  const iso = isoOrNull(value);\n  const title = preciseDateTime(value, options);\n\n  return (\n    <time dateTime={iso ?? undefined} title={title || undefined}>\n      {text}\n    </time>\n  );\n}\n\nfunction isoOrNull(value: unknown): string | null {\n  const date = new Date(String(value));\n\n  return Number.isNaN(date.getTime()) ? null : date.toISOString();\n}\n"],"mappings":";;;;;AAeA,SAAgB,SAAS,EACvB,OACA,YAAY,UACZ,YAAY,WACe;CAC3B,MAAM,EAAE,WAAW,UAAU;CAC7B,MAAM,EAAE,aAAa,YAAY;CAEjC,IAAI,UAAU,QAAQ,UAAU,KAAA,KAAa,UAAU,IACrD,OAAO;CAGT,MAAM,UAAyB;EAAE;EAAQ,UAAU;CAAS;CAC5D,MAAM,OAAO,gBAAgB,OAAO;EAAE;EAAW;CAAU,GAAG,OAAO;CACrE,MAAM,MAAM,UAAU,KAAK;CAC3B,MAAM,QAAQ,gBAAgB,OAAO,OAAO;CAE5C,OACE,oBAAC,QAAD;EAAM,UAAU,OAAO,KAAA;EAAW,OAAO,SAAS,KAAA;YAC/C;CACG,CAAA;AAEV;AAEA,SAAS,UAAU,OAA+B;CAChD,MAAM,OAAO,IAAI,KAAK,OAAO,KAAK,CAAC;CAEnC,OAAO,OAAO,MAAM,KAAK,QAAQ,CAAC,IAAI,OAAO,KAAK,YAAY;AAChE"}
+{"version":3,"file":"date-time.js","names":[],"sources":["../../resources/js/i18n/date-time.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport {\n  type FormatOptions,\n  formatDateValue,\n  preciseDateTime,\n} from \"@lattice-php/lattice/format/date-time\";\nimport type { DateTimeStyle } from \"@lattice-php/lattice/types/generated\";\nimport { useLocale } from \"./locale\";\nimport { useTimezone } from \"./timezone\";\n\nexport type DateTimeProps = {\n  value: unknown;\n  dateStyle?: DateTimeStyle | null;\n  timeStyle?: DateTimeStyle | null;\n};\n\nexport function DateTime({\n  value,\n  dateStyle = \"medium\",\n  timeStyle = \"short\",\n}: DateTimeProps): ReactNode {\n  const { locale } = useLocale();\n  const { timezone } = useTimezone();\n\n  if (value === null || value === undefined || value === \"\") {\n    return null;\n  }\n\n  const options: FormatOptions = { locale, timeZone: timezone };\n  const text = formatDateValue(value, { dateStyle, timeStyle }, options);\n  const iso = isoOrNull(value);\n  const title = preciseDateTime(value, options);\n\n  return (\n    <time dateTime={iso ?? undefined} title={title || undefined}>\n      {text}\n    </time>\n  );\n}\n\nfunction isoOrNull(value: unknown): string | null {\n  const date = new Date(String(value));\n\n  return Number.isNaN(date.getTime()) ? null : date.toISOString();\n}\n"],"mappings":";;;;;AAgBA,SAAgB,SAAS,EACvB,OACA,YAAY,UACZ,YAAY,WACe;CAC3B,MAAM,EAAE,WAAW,UAAU;CAC7B,MAAM,EAAE,aAAa,YAAY;CAEjC,IAAI,UAAU,QAAQ,UAAU,KAAA,KAAa,UAAU,IACrD,OAAO;CAGT,MAAM,UAAyB;EAAE;EAAQ,UAAU;CAAS;CAC5D,MAAM,OAAO,gBAAgB,OAAO;EAAE;EAAW;CAAU,GAAG,OAAO;CACrE,MAAM,MAAM,UAAU,KAAK;CAC3B,MAAM,QAAQ,gBAAgB,OAAO,OAAO;CAE5C,OACE,oBAAC,QAAD;EAAM,UAAU,OAAO,KAAA;EAAW,OAAO,SAAS,KAAA;YAC/C;CACG,CAAA;AAEV;AAEA,SAAS,UAAU,OAA+B;CAChD,MAAM,OAAO,IAAI,KAAK,OAAO,KAAK,CAAC;CAEnC,OAAO,OAAO,MAAM,KAAK,QAAQ,CAAC,IAAI,OAAO,KAAK,YAAY;AAChE"}

package/dist/i18n/index.js

@@ -1,9 +1,10 @@
 import { currentLocale, localeHeader, setLocale, useLocale } from "./locale.js";
 import { i18n, translate, useT } from "./instance.js";
 import { configureI18n, enableBackend } from "./backend.js";
-import { LocaleReload } from "./locale-reload.js";
 import { LocaleSwitcher, useLocaleOptions } from "./locale-switcher.js";
-import { configureI18nFromPageProps, i18nConfigFromPageProps } from "./page-props.js";
+import { i18nConfigFromPageProps } from "./shared-props.js";
+import { configureI18nFromPageProps } from "./page-props.js";
 import { currentTimezone, setTimezone, useTimezone } from "./timezone.js";
 import { DateTime } from "./date-time.js";
+import { LocaleReload } from "./locale-reload.js";
 export { DateTime, LocaleReload, LocaleSwitcher, configureI18n, configureI18nFromPageProps, currentLocale, currentTimezone, enableBackend, i18n, i18nConfigFromPageProps, localeHeader, setLocale, setTimezone, translate, useLocale, useLocaleOptions, useT, useTimezone };

package/dist/i18n/instance.js

@@ -1,5 +1,5 @@
-import { currentLocale, subscribeLocale, useLocale } from "./locale.js";
 import { useConfig } from "./config.js";
+import { currentLocale, subscribeLocale, useLocale } from "./locale.js";
 import { useCallback, useSyncExternalStore } from "react";
 import i18next from "i18next";
 //#region resources/js/i18n/instance.ts

package/dist/i18n/page-props.d.ts

@@ -1,3 +1,4 @@
-import { ConfigureI18nOptions, I18nConfig } from './backend.js';
-export declare function i18nConfigFromPageProps(props: unknown): I18nConfig | undefined;
+import { ConfigureI18nOptions } from './backend.js';
+import { i18nConfigFromPageProps } from './shared-props.js';
+export { i18nConfigFromPageProps };
 export declare function configureI18nFromPageProps(props: unknown, options?: ConfigureI18nOptions): Promise<void>;

package/dist/i18n/page-props.js

@@ -1,20 +1,6 @@
 import { configureI18n } from "./backend.js";
+import { i18nConfigFromPageProps } from "./shared-props.js";
 //#region resources/js/i18n/page-props.ts
-function isRecord(value) {
-	return typeof value === "object" && value !== null;
-}
-function isStringArray(value) {
-	return Array.isArray(value) && value.every((item) => typeof item === "string");
-}
-function isI18nConfig(value) {
-	return isRecord(value) && typeof value.enabled === "boolean" && typeof value.saveMissing === "boolean" && isStringArray(value.locales) && isStringArray(value.preloadLocales) && (value.timezone === void 0 || value.timezone === null || typeof value.timezone === "string");
-}
-function i18nConfigFromPageProps(props) {
-	if (!isRecord(props)) return;
-	const shared = props.lattice;
-	const config = isRecord(shared) ? shared.i18n : void 0;
-	return isI18nConfig(config) ? config : void 0;
-}
 function configureI18nFromPageProps(props, options = {}) {
 	return configureI18n(i18nConfigFromPageProps(props), options);
 }

package/dist/i18n/page-props.js.map

@@ -1 +1 @@
-{"version":3,"file":"page-props.js","names":[],"sources":["../../resources/js/i18n/page-props.ts"],"sourcesContent":["import { configureI18n, type ConfigureI18nOptions, type I18nConfig } from \"./backend\";\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n  return typeof value === \"object\" && value !== null;\n}\n\nfunction isStringArray(value: unknown): value is string[] {\n  return Array.isArray(value) && value.every((item) => typeof item === \"string\");\n}\n\nfunction isI18nConfig(value: unknown): value is I18nConfig {\n  return (\n    isRecord(value) &&\n    typeof value.enabled === \"boolean\" &&\n    typeof value.saveMissing === \"boolean\" &&\n    isStringArray(value.locales) &&\n    isStringArray(value.preloadLocales) &&\n    (value.timezone === undefined || value.timezone === null || typeof value.timezone === \"string\")\n  );\n}\n\nexport function i18nConfigFromPageProps(props: unknown): I18nConfig | undefined {\n  if (!isRecord(props)) {\n    return undefined;\n  }\n\n  const shared = props.lattice;\n  const config = isRecord(shared) ? shared.i18n : undefined;\n\n  return isI18nConfig(config) ? config : undefined;\n}\n\nexport function configureI18nFromPageProps(\n  props: unknown,\n  options: ConfigureI18nOptions = {},\n): Promise<void> {\n  return configureI18n(i18nConfigFromPageProps(props), options);\n}\n"],"mappings":";;AAEA,SAAS,SAAS,OAAkD;CAClE,OAAO,OAAO,UAAU,YAAY,UAAU;AAChD;AAEA,SAAS,cAAc,OAAmC;CACxD,OAAO,MAAM,QAAQ,KAAK,KAAK,MAAM,OAAO,SAAS,OAAO,SAAS,QAAQ;AAC/E;AAEA,SAAS,aAAa,OAAqC;CACzD,OACE,SAAS,KAAK,KACd,OAAO,MAAM,YAAY,aACzB,OAAO,MAAM,gBAAgB,aAC7B,cAAc,MAAM,OAAO,KAC3B,cAAc,MAAM,cAAc,MACjC,MAAM,aAAa,KAAA,KAAa,MAAM,aAAa,QAAQ,OAAO,MAAM,aAAa;AAE1F;AAEA,SAAgB,wBAAwB,OAAwC;CAC9E,IAAI,CAAC,SAAS,KAAK,GACjB;CAGF,MAAM,SAAS,MAAM;CACrB,MAAM,SAAS,SAAS,MAAM,IAAI,OAAO,OAAO,KAAA;CAEhD,OAAO,aAAa,MAAM,IAAI,SAAS,KAAA;AACzC;AAEA,SAAgB,2BACd,OACA,UAAgC,CAAC,GAClB;CACf,OAAO,cAAc,wBAAwB,KAAK,GAAG,OAAO;AAC9D"}
+{"version":3,"file":"page-props.js","names":[],"sources":["../../resources/js/i18n/page-props.ts"],"sourcesContent":["import { configureI18n, type ConfigureI18nOptions } from \"./backend\";\nimport { i18nConfigFromPageProps } from \"./shared-props\";\n\nexport { i18nConfigFromPageProps };\n\nexport function configureI18nFromPageProps(\n  props: unknown,\n  options: ConfigureI18nOptions = {},\n): Promise<void> {\n  return configureI18n(i18nConfigFromPageProps(props), options);\n}\n"],"mappings":";;;AAKA,SAAgB,2BACd,OACA,UAAgC,CAAC,GAClB;CACf,OAAO,cAAc,wBAAwB,KAAK,GAAG,OAAO;AAC9D"}

package/dist/i18n/shared-props.d.ts

@@ -0,0 +1,7 @@
+import { I18nConfig } from '../types/generated.js';
+/**
+ * Parse the backend-shared `lattice.i18n` Inertia prop. Lives apart from the
+ * configure entrypoint so callers can inspect the prop without pulling the
+ * i18next backend into their bundle.
+ */
+export declare function i18nConfigFromPageProps(props: unknown): I18nConfig | undefined;

package/dist/i18n/shared-props.js

@@ -0,0 +1,25 @@
+//#region resources/js/i18n/shared-props.ts
+function isRecord(value) {
+	return typeof value === "object" && value !== null;
+}
+function isStringArray(value) {
+	return Array.isArray(value) && value.every((item) => typeof item === "string");
+}
+function isI18nConfig(value) {
+	return isRecord(value) && typeof value.enabled === "boolean" && typeof value.saveMissing === "boolean" && isStringArray(value.locales) && isStringArray(value.preloadLocales) && (value.timezone === void 0 || value.timezone === null || typeof value.timezone === "string");
+}
+/**
+* Parse the backend-shared `lattice.i18n` Inertia prop. Lives apart from the
+* configure entrypoint so callers can inspect the prop without pulling the
+* i18next backend into their bundle.
+*/
+function i18nConfigFromPageProps(props) {
+	if (!isRecord(props)) return;
+	const shared = props.lattice;
+	const config = isRecord(shared) ? shared.i18n : void 0;
+	return isI18nConfig(config) ? config : void 0;
+}
+//#endregion
+export { i18nConfigFromPageProps };
+
+//# sourceMappingURL=shared-props.js.map

package/dist/i18n/shared-props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shared-props.js","names":[],"sources":["../../resources/js/i18n/shared-props.ts"],"sourcesContent":["import type { I18nConfig } from \"@lattice-php/lattice/types/generated\";\n\nfunction isRecord(value: unknown): value is Record<string, unknown> {\n  return typeof value === \"object\" && value !== null;\n}\n\nfunction isStringArray(value: unknown): value is string[] {\n  return Array.isArray(value) && value.every((item) => typeof item === \"string\");\n}\n\nfunction isI18nConfig(value: unknown): value is I18nConfig {\n  return (\n    isRecord(value) &&\n    typeof value.enabled === \"boolean\" &&\n    typeof value.saveMissing === \"boolean\" &&\n    isStringArray(value.locales) &&\n    isStringArray(value.preloadLocales) &&\n    (value.timezone === undefined || value.timezone === null || typeof value.timezone === \"string\")\n  );\n}\n\n/**\n * Parse the backend-shared `lattice.i18n` Inertia prop. Lives apart from the\n * configure entrypoint so callers can inspect the prop without pulling the\n * i18next backend into their bundle.\n */\nexport function i18nConfigFromPageProps(props: unknown): I18nConfig | undefined {\n  if (!isRecord(props)) {\n    return undefined;\n  }\n\n  const shared = props.lattice;\n  const config = isRecord(shared) ? shared.i18n : undefined;\n\n  return isI18nConfig(config) ? config : undefined;\n}\n"],"mappings":";AAEA,SAAS,SAAS,OAAkD;CAClE,OAAO,OAAO,UAAU,YAAY,UAAU;AAChD;AAEA,SAAS,cAAc,OAAmC;CACxD,OAAO,MAAM,QAAQ,KAAK,KAAK,MAAM,OAAO,SAAS,OAAO,SAAS,QAAQ;AAC/E;AAEA,SAAS,aAAa,OAAqC;CACzD,OACE,SAAS,KAAK,KACd,OAAO,MAAM,YAAY,aACzB,OAAO,MAAM,gBAAgB,aAC7B,cAAc,MAAM,OAAO,KAC3B,cAAc,MAAM,cAAc,MACjC,MAAM,aAAa,KAAA,KAAa,MAAM,aAAa,QAAQ,OAAO,MAAM,aAAa;AAE1F;;;;;;AAOA,SAAgB,wBAAwB,OAAwC;CAC9E,IAAI,CAAC,SAAS,KAAK,GACjB;CAGF,MAAM,SAAS,MAAM;CACrB,MAAM,SAAS,SAAS,MAAM,IAAI,OAAO,OAAO,KAAA;CAEhD,OAAO,aAAa,MAAM,IAAI,SAAS,KAAA;AACzC"}

package/dist/icons/icon-renderer.js.map

@@ -1 +1 @@
-{"version":3,"file":"icon-renderer.js","names":[],"sources":["../../resources/js/icons/icon-renderer.tsx"],"sourcesContent":["import { createContext, useContext, useMemo } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport { Icon, useSprite } from \"./sprite\";\n\nexport type IconRendererProps = {\n  className?: string;\n  icon: string;\n};\n\nexport type IconRendererFunction = (props: IconRendererProps) => ReactNode;\n\ntype IconRendererProviderProps = {\n  children: ReactNode;\n  mode?: \"replace\" | \"stack\";\n  renderer: IconRendererFunction;\n};\n\nconst IconRenderersContext = createContext<IconRendererFunction[]>([]);\nconst loggedMissingIcons = new Set<string>();\n\nexport function IconRendererProvider({\n  children,\n  mode = \"stack\",\n  renderer,\n}: IconRendererProviderProps) {\n  const parentRenderers = useContext(IconRenderersContext);\n  const renderers = useMemo(\n    () => (mode === \"replace\" ? [renderer] : [renderer, ...parentRenderers]),\n    [mode, parentRenderers, renderer],\n  );\n\n  return (\n    <IconRenderersContext.Provider value={renderers}>{children}</IconRenderersContext.Provider>\n  );\n}\n\nexport function IconRenderer({ className, icon }: IconRendererProps) {\n  const renderers = useContext(IconRenderersContext);\n  const { ids } = useSprite();\n\n  // Custom renderers (the override stack) take precedence over the sprite.\n  for (const renderer of renderers) {\n    const rendered = renderer({ className, icon });\n\n    if (rendered !== null && rendered !== undefined && rendered !== false) {\n      return rendered;\n    }\n  }\n\n  // When the sprite is wired and the icon is genuinely absent, show a visible\n  // marker. When `ids` is unknown (not yet wired), optimistically emit the\n  // sprite reference rather than crying wolf.\n  if (ids && !ids.includes(icon)) {\n    logMissingIcon(icon);\n    return <MissingIcon className={className} />;\n  }\n\n  return <Icon className={className} name={icon} />;\n}\n\nfunction MissingIcon({ className }: { className?: string }) {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      className={cn(\"size-lt-icon-md text-lt-muted-fg\", className)}\n      data-lattice-missing-icon=\"\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n      viewBox=\"0 0 24 24\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n      <path d=\"M12 17h.01\" />\n    </svg>\n  );\n}\n\nfunction logMissingIcon(icon: string): void {\n  if (!import.meta.env.DEV || loggedMissingIcons.has(icon)) {\n    return;\n  }\n\n  loggedMissingIcons.add(icon);\n  console.log(`[Lattice] Missing icon renderer for \"${icon}\".`);\n}\n"],"mappings":";;;;;AAkBA,IAAM,uBAAuB,cAAsC,CAAC,CAAC;AAGrE,SAAgB,qBAAqB,EACnC,UACA,OAAO,SACP,YAC4B;CAC5B,MAAM,kBAAkB,WAAW,oBAAoB;CACvD,MAAM,YAAY,cACT,SAAS,YAAY,CAAC,QAAQ,IAAI,CAAC,UAAU,GAAG,eAAe,GACtE;EAAC;EAAM;EAAiB;CAAQ,CAClC;CAEA,OACE,oBAAC,qBAAqB,UAAtB;EAA+B,OAAO;EAAY;CAAwC,CAAA;AAE9F;AAEA,SAAgB,aAAa,EAAE,WAAW,QAA2B;CACnE,MAAM,YAAY,WAAW,oBAAoB;CACjD,MAAM,EAAE,QAAQ,UAAU;CAG1B,KAAK,MAAM,YAAY,WAAW;EAChC,MAAM,WAAW,SAAS;GAAE;GAAW;EAAK,CAAC;EAE7C,IAAI,aAAa,QAAQ,aAAa,KAAA,KAAa,aAAa,OAC9D,OAAO;CAEX;CAKA,IAAI,OAAO,CAAC,IAAI,SAAS,IAAI,GAE3B,OAAO,oBAAC,aAAD,EAAwB,UAAY,CAAA;CAG7C,OAAO,oBAAC,MAAD;EAAiB;EAAW,MAAM;CAAO,CAAA;AAClD;AAEA,SAAS,YAAY,EAAE,aAAqC;CAC1D,OACE,qBAAC,OAAD;EACE,eAAY;EACZ,WAAW,GAAG,oCAAoC,SAAS;EAC3D,6BAA0B;EAC1B,MAAK;EACL,QAAO;EACP,eAAc;EACd,gBAAe;EACf,aAAY;EACZ,SAAQ;YATV;GAWE,oBAAC,UAAD;IAAQ,IAAG;IAAK,IAAG;IAAK,GAAE;GAAM,CAAA;GAChC,oBAAC,QAAD,EAAM,GAAE,uCAAwC,CAAA;GAChD,oBAAC,QAAD,EAAM,GAAE,aAAc,CAAA;EACnB;;AAET"}
+{"version":3,"file":"icon-renderer.js","names":[],"sources":["../../resources/js/icons/icon-renderer.tsx"],"sourcesContent":["import { createContext, useContext, useMemo } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport { Icon, useSprite } from \"./sprite\";\n\nexport type IconRendererProps = {\n  className?: string;\n  icon: string;\n};\n\nexport type IconRendererFunction = (props: IconRendererProps) => ReactNode;\n\ntype IconRendererProviderProps = {\n  children: ReactNode;\n  mode?: \"replace\" | \"stack\";\n  renderer: IconRendererFunction;\n};\n\nconst IconRenderersContext = createContext<IconRendererFunction[]>([]);\nconst loggedMissingIcons = new Set<string>();\n\nexport function IconRendererProvider({\n  children,\n  mode = \"stack\",\n  renderer,\n}: IconRendererProviderProps) {\n  const parentRenderers = useContext(IconRenderersContext);\n  const renderers = useMemo(\n    () => (mode === \"replace\" ? [renderer] : [renderer, ...parentRenderers]),\n    [mode, parentRenderers, renderer],\n  );\n\n  return (\n    <IconRenderersContext.Provider value={renderers}>{children}</IconRenderersContext.Provider>\n  );\n}\n\nexport function IconRenderer({ className, icon }: IconRendererProps) {\n  const renderers = useContext(IconRenderersContext);\n  const { ids } = useSprite();\n\n  for (const renderer of renderers) {\n    const rendered = renderer({ className, icon });\n\n    if (rendered !== null && rendered !== undefined && rendered !== false) {\n      return rendered;\n    }\n  }\n\n  // When the sprite is wired and the icon is genuinely absent, show a visible\n  // marker. When `ids` is unknown (not yet wired), optimistically emit the\n  // sprite reference rather than crying wolf.\n  if (ids && !ids.includes(icon)) {\n    logMissingIcon(icon);\n    return <MissingIcon className={className} />;\n  }\n\n  return <Icon className={className} name={icon} />;\n}\n\nfunction MissingIcon({ className }: { className?: string }) {\n  return (\n    <svg\n      aria-hidden=\"true\"\n      className={cn(\"size-lt-icon-md text-lt-muted-fg\", className)}\n      data-lattice-missing-icon=\"\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      strokeWidth=\"2\"\n      viewBox=\"0 0 24 24\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n      <path d=\"M12 17h.01\" />\n    </svg>\n  );\n}\n\nfunction logMissingIcon(icon: string): void {\n  if (!import.meta.env.DEV || loggedMissingIcons.has(icon)) {\n    return;\n  }\n\n  loggedMissingIcons.add(icon);\n  console.log(`[Lattice] Missing icon renderer for \"${icon}\".`);\n}\n"],"mappings":";;;;;AAkBA,IAAM,uBAAuB,cAAsC,CAAC,CAAC;AAGrE,SAAgB,qBAAqB,EACnC,UACA,OAAO,SACP,YAC4B;CAC5B,MAAM,kBAAkB,WAAW,oBAAoB;CACvD,MAAM,YAAY,cACT,SAAS,YAAY,CAAC,QAAQ,IAAI,CAAC,UAAU,GAAG,eAAe,GACtE;EAAC;EAAM;EAAiB;CAAQ,CAClC;CAEA,OACE,oBAAC,qBAAqB,UAAtB;EAA+B,OAAO;EAAY;CAAwC,CAAA;AAE9F;AAEA,SAAgB,aAAa,EAAE,WAAW,QAA2B;CACnE,MAAM,YAAY,WAAW,oBAAoB;CACjD,MAAM,EAAE,QAAQ,UAAU;CAE1B,KAAK,MAAM,YAAY,WAAW;EAChC,MAAM,WAAW,SAAS;GAAE;GAAW;EAAK,CAAC;EAE7C,IAAI,aAAa,QAAQ,aAAa,KAAA,KAAa,aAAa,OAC9D,OAAO;CAEX;CAKA,IAAI,OAAO,CAAC,IAAI,SAAS,IAAI,GAE3B,OAAO,oBAAC,aAAD,EAAwB,UAAY,CAAA;CAG7C,OAAO,oBAAC,MAAD;EAAiB;EAAW,MAAM;CAAO,CAAA;AAClD;AAEA,SAAS,YAAY,EAAE,aAAqC;CAC1D,OACE,qBAAC,OAAD;EACE,eAAY;EACZ,WAAW,GAAG,oCAAoC,SAAS;EAC3D,6BAA0B;EAC1B,MAAK;EACL,QAAO;EACP,eAAc;EACd,gBAAe;EACf,aAAY;EACZ,SAAQ;YATV;GAWE,oBAAC,UAAD;IAAQ,IAAG;IAAK,IAAG;IAAK,GAAE;GAAM,CAAA;GAChC,oBAAC,QAAD,EAAM,GAAE,uCAAwC,CAAA;GAChD,oBAAC,QAAD,EAAM,GAAE,aAAc,CAAA;EACnB;;AAET"}

package/dist/index.d.ts

@@ -4,9 +4,10 @@ export { chatComponents } from './chat/plugin.js';
 export { getActionEffects, isActionEffect, dispatchEffects, dispatchActionError, } from './effects/dispatch.js';
 export { useEffectDispatcher } from './effects/use-effect-dispatcher.js';
 export { builtinEffectHandlers, effectHandler, mergeEffectHandlers } from './effects/registry.js';
+export { registerRichEditorExtension } from './form/rich-editor/registry.js';
 export { initializeTheme, updateAppearance, useAppearance } from './appearance/index.js';
 export { copyToClipboard, useClipboard } from './clipboard/index.js';
-export { createLatticeApp, type CreateLatticeAppOptions } from './create-app.js';
+export { createLatticeApp, type CreateLatticeAppI18nOptions, type CreateLatticeAppOptions, } from './create-app.js';
 export { EventBridge } from './event-bridge.js';
 export { Icon, IconRenderer, IconRendererProvider, SpriteProvider } from './icons/index.js';
 export { createLayoutResolver, createPageResolver, pageComponentName, withVisitHeaders, } from './inertia.js';
@@ -25,13 +26,14 @@ export type { ButtonVariant } from './ui/button.js';
 export type { ReloadComponentEvent } from './events/event-names.js';
 export type { ComponentProps, KnownPageContainer, LayoutPayload, Node, NodeOfType, NodeProps, NodeType, PageContainer, PageBreadcrumb, PagePayload, PropsOf, RendererComponent, RendererComponentModule, RendererComponentProps, Schema, UnknownComponent, WireNode, } from './core/types.js';
 export { RealtimeListeners } from './realtime/listeners.js';
-export type { ChannelVisibility, DateFormat, ListenerPayload, NumberFormat, } from './types/generated.js';
+export type { ChannelVisibility, DateFormat, Listen, NumberFormat } from './types/generated.js';
 export { columnCell } from './table/registry.js';
 export type { ColumnCellArgs, ColumnCellComponent, ColumnRegistry } from './table/registry.js';
 export type { ColumnProps, ColumnPropsOf } from './table/types.js';
 export type { Method } from '@inertiajs/core';
 export type { ActionEffect, ActionResponse } from './effects/dispatch.js';
-export type { EffectHandler, EffectHandlerRegistry, EffectOf, EffectProps, } from './effects/registry.js';
+export type { EffectHandler, EffectHandlerRegistry, EffectOf, EffectProps, EffectPropsOf, } from './effects/registry.js';
+export type { EditorExtensionPayloadOf, EditorExtensionProps, RichEditorExtensionDefinition, ToolbarButton, ToolbarControl, ToolbarItem, } from './form/rich-editor/registry.js';
 export type { Appearance, ResolvedAppearance, UseAppearanceReturn } from './appearance/index.js';
 export type { CopiedValue, CopyFn, UseClipboardReturn } from './clipboard/index.js';
 export type { Callout, ToastMessage, Variant } from './toast/index.js';

package/dist/index.js

@@ -2,16 +2,16 @@ import { initializeTheme, updateAppearance, useAppearance } from "./appearance/i
 import { createPlugin, createRegistry, eagerComponent, extendRegistry, lazyComponent } from "./core/registry.js";
 import { useColumnRegistry, useComponentRegistry } from "./core/registry-context.js";
 import { LATTICE_EVENT } from "./events/event-names.js";
-import { LATTICE_REF_HEADER, withRefHeader } from "./core/component-ref.js";
-import { withHeaders } from "./core/headers.js";
+import { onToast, showToast } from "./toast/toast.js";
+import { onCallout } from "./toast/callout.js";
 import { Icon, SpriteProvider } from "./icons/sprite.js";
 import { IconRenderer, IconRendererProvider } from "./icons/icon-renderer.js";
 import { CollapsedContext, useCollapsed } from "./core/collapsed-context.js";
 import { Renderer } from "./core/renderer.js";
-import { onToast, showToast } from "./toast/toast.js";
-import { onCallout } from "./toast/callout.js";
-import { EventBridge } from "./event-bridge.js";
 import { Toaster } from "./toast/toaster.js";
+import { EventBridge } from "./event-bridge.js";
+import { LATTICE_REF_HEADER, withRefHeader } from "./core/component-ref.js";
+import { withHeaders } from "./core/headers.js";
 import Callouts from "./layout/components/callouts.js";
 import { builtinEffectHandlers, effectHandler, mergeEffectHandlers } from "./effects/registry.js";
 import { dispatchActionError, dispatchEffects, getActionEffects, isActionEffect } from "./effects/dispatch.js";
@@ -27,6 +27,7 @@ import { copyToClipboard } from "./ui/copyable-text.js";
 import { columnCell } from "./table/registry.js";
 import { registry } from "./registry.js";
 import { createLatticeApp } from "./create-app.js";
+import { registerRichEditorExtension } from "./form/rich-editor/registry.js";
 import { useClipboard } from "./clipboard/index.js";
 import { Provider } from "./provider.js";
-export { Callouts, EventBridge, Icon, IconRenderer, IconRendererProvider, LATTICE_EVENT, LATTICE_REF_HEADER, OutletContext, Provider, RealtimeListeners, Renderer, SchemaLayout, CollapsedContext as SidebarCollapsedContext, SpriteProvider, Toaster, builtinEffectHandlers, chatComponents, columnCell, copyToClipboard, createLatticeApp, createLayoutResolver, createPageResolver, createPlugin, createRegistry, dispatchActionError, dispatchEffects, eagerComponent, effectHandler, extendRegistry, getActionEffects, initializeTheme, isActionEffect, layoutComponents, lazyComponent, mergeEffectHandlers, onCallout, onToast, pageComponentName, registry, showToast, updateAppearance, useAppearance, useChat, useClipboard, useColumnRegistry, useComponentRegistry, useEffectDispatcher, useCollapsed as useSidebarCollapsed, withHeaders, withRefHeader, withVisitHeaders };
+export { Callouts, EventBridge, Icon, IconRenderer, IconRendererProvider, LATTICE_EVENT, LATTICE_REF_HEADER, OutletContext, Provider, RealtimeListeners, Renderer, SchemaLayout, CollapsedContext as SidebarCollapsedContext, SpriteProvider, Toaster, builtinEffectHandlers, chatComponents, columnCell, copyToClipboard, createLatticeApp, createLayoutResolver, createPageResolver, createPlugin, createRegistry, dispatchActionError, dispatchEffects, eagerComponent, effectHandler, extendRegistry, getActionEffects, initializeTheme, isActionEffect, layoutComponents, lazyComponent, mergeEffectHandlers, onCallout, onToast, pageComponentName, registerRichEditorExtension, registry, showToast, updateAppearance, useAppearance, useChat, useClipboard, useColumnRegistry, useComponentRegistry, useEffectDispatcher, useCollapsed as useSidebarCollapsed, withHeaders, withRefHeader, withVisitHeaders };

package/dist/lattice.css

@@ -27,7 +27,6 @@
   --lt-success-fg: var(--success-foreground, oklch(0.985 0 0));
   --lt-info: var(--info, oklch(0.62 0.14 240));
   --lt-info-fg: var(--info-foreground, oklch(0.985 0 0));
-  /* Interaction states (hover / active / disabled) */
   --lt-primary-hover: var(--primary-hover, oklch(0.43 0.092 182));
   --lt-primary-active: var(--primary-active, oklch(0.39 0.092 182));
   --lt-danger-hover: var(--destructive-hover, oklch(0.53 0.21 27.3));
@@ -62,15 +61,14 @@
   --lt-control-h-lg: 2.5rem;
 
   /* Table cell padding — table density lever */
-  --lt-table-cell-x: calc(var(--spacing) * 4); /* 1rem */
-  --lt-table-cell-y: calc(var(--spacing) * 4); /* 1rem */
+  --lt-table-cell-x: calc(var(--spacing) * 4);
+  --lt-table-cell-y: calc(var(--spacing) * 4);
 
   --lt-font-weight-normal: 400;
   --lt-font-weight-medium: 500;
   --lt-font-weight-semibold: 600;
   --lt-font-weight-bold: 700;
 
-  /* Elevation */
   --lt-shadow-xs: 0 1px 1px 0 oklch(0 0 0 / 0.04);
   --lt-shadow-sm: 0 1px 2px 0 oklch(0 0 0 / 0.05);
   --lt-shadow-md:
@@ -78,7 +76,6 @@
   --lt-shadow-lg:
     0 8px 16px -4px oklch(0 0 0 / 0.12), 0 2px 4px -2px oklch(0 0 0 / 0.08);
 
-  /* Z-index scale */
   --lt-z-dropdown: 1000;
   --lt-z-sticky: 1100;
   --lt-z-overlay: 1200;
@@ -86,17 +83,15 @@
   --lt-z-popover: 1400;
   --lt-z-toast: 1500;
 
-  /* Motion */
   --lt-duration-fast: 120ms;
   --lt-duration-base: 160ms;
 
-  /* Layout dimensions */
   --lt-sidebar-w: 16rem;
   --lt-sidebar-w-collapsed: 4rem;
   --lt-container-max: 80rem;
 
   /* Card / section content inset — the gutter apps can break out of */
-  --lt-gutter: calc(var(--spacing) * 6); /* 1.5rem */
+  --lt-gutter: calc(var(--spacing) * 6);
 
   color-scheme: light;
 }
@@ -129,7 +124,6 @@
   --lt-info: var(--info, oklch(0.7 0.14 240));
   --lt-info-fg: var(--info-foreground, oklch(0.205 0 0));
 
-  /* Interaction states (dark) */
   --lt-primary-hover: var(--primary-hover, oklch(0.79 0.105 182));
   --lt-primary-active: var(--primary-active, oklch(0.84 0.105 182));
   --lt-danger-hover: var(--destructive-hover, oklch(0.47 0.13 26));
@@ -219,7 +213,6 @@
     "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
     "Segoe UI Symbol", "Noto Color Emoji";
 
-  /* Base spacing unit */
   --spacing: 0.25rem;
 
   --text-xs: 0.625rem;
@@ -293,12 +286,41 @@
 }
 
 /*
- * Status colours for Badge and Icon table cells. Each tone sets a soft
- * background and a readable foreground in oklch; the `.dark` block swaps them.
- * Defined here (not as utility strings in the renderer) so the palette lives
- * with the theme and can be overridden, and so the cells can pick a tone by
- * name without Tailwind needing to see every class. Gray follows the muted token.
+ * Named colours. Semantic names alias the theme tokens; hue names carry their
+ * own oklch values with `.dark` overrides. Renderers resolve a named colour to
+ * `var(--lt-color-<name>)` for paint, or to an `.lt-tone-<name>` class for the
+ * soft-background/strong-foreground pair used by badge and icon cells. Defined
+ * here (not as utility strings in the renderers) so the palette lives with the
+ * theme and can be overridden, and so a colour can be picked by name at
+ * runtime without Tailwind needing to see every class.
  */
+:root {
+  --lt-color-default: var(--lt-fg);
+  --lt-color-muted: var(--lt-muted-fg);
+  --lt-color-primary: var(--lt-primary);
+  --lt-color-success: var(--lt-success);
+  --lt-color-info: var(--lt-info);
+  --lt-color-warning: var(--lt-warning);
+  --lt-color-danger: var(--lt-danger);
+  --lt-color-gray: var(--lt-muted-fg);
+  --lt-color-red: oklch(0.51 0.19 27);
+  --lt-color-orange: oklch(0.55 0.14 55);
+  --lt-color-yellow: oklch(0.52 0.1 85);
+  --lt-color-green: oklch(0.52 0.13 152);
+  --lt-color-blue: oklch(0.54 0.17 252);
+  --lt-color-purple: oklch(0.53 0.19 305);
+}
+
+[data-theme="dark"],
+.dark {
+  --lt-color-red: oklch(0.83 0.11 27);
+  --lt-color-orange: oklch(0.84 0.1 65);
+  --lt-color-yellow: oklch(0.87 0.11 100);
+  --lt-color-green: oklch(0.85 0.13 155);
+  --lt-color-blue: oklch(0.84 0.11 250);
+  --lt-color-purple: oklch(0.85 0.11 305);
+}
+
 .lt-cell-badge {
   display: inline-flex;
   align-items: center;
@@ -308,67 +330,98 @@
   font-size: 0.75rem;
   line-height: 1rem;
   font-weight: 500;
-  background-color: var(--lt-cell-bg, var(--lt-muted));
-  color: var(--lt-cell-fg, var(--lt-muted-fg));
+  background-color: var(--lt-tone-bg, var(--lt-muted));
+  color: var(--lt-tone-fg, var(--lt-muted-fg));
 }
 
 .lt-cell-icon {
   display: inline-flex;
-  color: var(--lt-cell-fg, var(--lt-fg));
+  color: var(--lt-tone-fg, var(--lt-fg));
+}
+
+.lt-tone-gray {
+  --lt-tone-bg: var(--lt-muted);
+  --lt-tone-fg: var(--lt-color-gray);
+}
+.lt-tone-red {
+  --lt-tone-bg: oklch(0.94 0.03 25);
+  --lt-tone-fg: var(--lt-color-red);
+}
+.lt-tone-orange {
+  --lt-tone-bg: oklch(0.95 0.04 65);
+  --lt-tone-fg: var(--lt-color-orange);
+}
+.lt-tone-yellow {
+  --lt-tone-bg: oklch(0.96 0.05 100);
+  --lt-tone-fg: var(--lt-color-yellow);
+}
+.lt-tone-green {
+  --lt-tone-bg: oklch(0.95 0.05 155);
+  --lt-tone-fg: var(--lt-color-green);
+}
+.lt-tone-blue {
+  --lt-tone-bg: oklch(0.95 0.03 245);
+  --lt-tone-fg: var(--lt-color-blue);
+}
+.lt-tone-purple {
+  --lt-tone-bg: oklch(0.95 0.03 305);
+  --lt-tone-fg: var(--lt-color-purple);
 }
 
-.lt-cell-tone-gray {
-  --lt-cell-bg: var(--lt-muted);
-  --lt-cell-fg: var(--lt-muted-fg);
+.lt-tone-default,
+.lt-tone-primary,
+.lt-tone-success,
+.lt-tone-info,
+.lt-tone-warning,
+.lt-tone-danger {
+  --lt-tone-bg: color-mix(in oklab, var(--lt-tone-fg) 12%, transparent);
 }
-.lt-cell-tone-red {
-  --lt-cell-bg: oklch(0.94 0.03 25);
-  --lt-cell-fg: oklch(0.51 0.19 27);
+.lt-tone-default {
+  --lt-tone-fg: var(--lt-color-default);
 }
-.lt-cell-tone-orange {
-  --lt-cell-bg: oklch(0.95 0.04 65);
-  --lt-cell-fg: oklch(0.55 0.14 55);
+.lt-tone-muted {
+  --lt-tone-bg: var(--lt-muted);
+  --lt-tone-fg: var(--lt-color-muted);
 }
-.lt-cell-tone-yellow {
-  --lt-cell-bg: oklch(0.96 0.05 100);
-  --lt-cell-fg: oklch(0.52 0.1 85);
+.lt-tone-primary {
+  --lt-tone-fg: var(--lt-color-primary);
 }
-.lt-cell-tone-green {
-  --lt-cell-bg: oklch(0.95 0.05 155);
-  --lt-cell-fg: oklch(0.52 0.13 152);
+.lt-tone-success {
+  --lt-tone-fg: var(--lt-color-success);
 }
-.lt-cell-tone-blue {
-  --lt-cell-bg: oklch(0.95 0.03 245);
-  --lt-cell-fg: oklch(0.54 0.17 252);
+.lt-tone-info {
+  --lt-tone-fg: var(--lt-color-info);
 }
-.lt-cell-tone-purple {
-  --lt-cell-bg: oklch(0.95 0.03 305);
-  --lt-cell-fg: oklch(0.53 0.19 305);
+.lt-tone-warning {
+  --lt-tone-fg: var(--lt-color-warning);
+}
+.lt-tone-danger {
+  --lt-tone-fg: var(--lt-color-danger);
 }
 
-.dark .lt-cell-tone-red {
-  --lt-cell-bg: oklch(0.29 0.08 27);
-  --lt-cell-fg: oklch(0.83 0.11 27);
+[data-theme="dark"] .lt-tone-red,
+.dark .lt-tone-red {
+  --lt-tone-bg: oklch(0.29 0.08 27);
 }
-.dark .lt-cell-tone-orange {
-  --lt-cell-bg: oklch(0.3 0.07 65);
-  --lt-cell-fg: oklch(0.84 0.1 65);
+[data-theme="dark"] .lt-tone-orange,
+.dark .lt-tone-orange {
+  --lt-tone-bg: oklch(0.3 0.07 65);
 }
-.dark .lt-cell-tone-yellow {
-  --lt-cell-bg: oklch(0.31 0.06 100);
-  --lt-cell-fg: oklch(0.87 0.11 100);
+[data-theme="dark"] .lt-tone-yellow,
+.dark .lt-tone-yellow {
+  --lt-tone-bg: oklch(0.31 0.06 100);
 }
-.dark .lt-cell-tone-green {
-  --lt-cell-bg: oklch(0.3 0.07 155);
-  --lt-cell-fg: oklch(0.85 0.13 155);
+[data-theme="dark"] .lt-tone-green,
+.dark .lt-tone-green {
+  --lt-tone-bg: oklch(0.3 0.07 155);
 }
-.dark .lt-cell-tone-blue {
-  --lt-cell-bg: oklch(0.3 0.07 245);
-  --lt-cell-fg: oklch(0.84 0.11 250);
+[data-theme="dark"] .lt-tone-blue,
+.dark .lt-tone-blue {
+  --lt-tone-bg: oklch(0.3 0.07 245);
 }
-.dark .lt-cell-tone-purple {
-  --lt-cell-bg: oklch(0.3 0.07 305);
-  --lt-cell-fg: oklch(0.85 0.11 305);
+[data-theme="dark"] .lt-tone-purple,
+.dark .lt-tone-purple {
+  --lt-tone-bg: oklch(0.3 0.07 305);
 }
 
 /*
@@ -402,6 +455,15 @@
   margin: calc(var(--spacing) * 2) 0;
 }
 
+/* TipTap renders the empty-editor placeholder via this attribute hook. */
+.lattice-prose :where(p.is-editor-empty:first-child)::before {
+  content: attr(data-placeholder);
+  color: var(--lt-muted-fg);
+  float: left;
+  height: 0;
+  pointer-events: none;
+}
+
 .lattice-prose :where(ul) {
   list-style: disc;
   padding-left: calc(var(--spacing) * 6);

package/dist/layout/components/breadcrumbs.js

@@ -1,13 +1,15 @@
+import { useT } from "../../i18n/instance.js";
 import { nodeIdentity } from "../../core/test-id.js";
 import { Link, usePage } from "@inertiajs/react";
 import { Fragment } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region resources/js/layout/components/breadcrumbs.tsx
 var BreadcrumbsComponent = ({ node }) => {
+	const { t } = useT("lattice");
 	const crumbs = usePage().props.lattice?.breadcrumbs ?? [];
 	if (crumbs.length === 0) return null;
 	return /* @__PURE__ */ jsx("nav", {
-		"aria-label": "Breadcrumb",
+		"aria-label": t("common.breadcrumb", "Breadcrumb"),
 		"data-lattice-component": nodeIdentity(node),
 		children: /* @__PURE__ */ jsx("ol", {
 			className: "flex items-center gap-2 text-sm text-lt-muted-fg",

package/dist/layout/components/breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumbs.js","names":[],"sources":["../../../resources/js/layout/components/breadcrumbs.tsx"],"sourcesContent":["import { Link, usePage } from \"@inertiajs/react\";\nimport { Fragment } from \"react\";\nimport type { PagePayload, RendererComponent } from \"@lattice-php/lattice/core/types\";\nimport { nodeIdentity } from \"@lattice-php/lattice/core/test-id\";\n\nconst BreadcrumbsComponent: RendererComponent<\"breadcrumbs\"> = ({ node }) => {\n  const page = usePage();\n  const crumbs = (page.props.lattice as PagePayload | undefined)?.breadcrumbs ?? [];\n\n  if (crumbs.length === 0) {\n    return null;\n  }\n\n  return (\n    <nav aria-label=\"Breadcrumb\" data-lattice-component={nodeIdentity(node)}>\n      <ol className=\"flex items-center gap-2 text-sm text-lt-muted-fg\">\n        {crumbs.map((crumb, index) => {\n          const isLast = index === crumbs.length - 1;\n\n          return (\n            <Fragment key={crumb.href}>\n              <li>\n                {isLast ? (\n                  <span aria-current=\"page\" className=\"text-lt-fg\">\n                    {crumb.title}\n                  </span>\n                ) : (\n                  <Link className=\"hover:text-lt-fg\" href={crumb.href}>\n                    {crumb.title}\n                  </Link>\n                )}\n              </li>\n              {isLast ? null : <li aria-hidden=\"true\">/</li>}\n            </Fragment>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n};\n\nexport default BreadcrumbsComponent;\n"],"mappings":";;;;;AAKA,IAAM,wBAA0D,EAAE,WAAW;CAE3E,MAAM,SADO,QACG,EAAK,MAAM,SAAqC,eAAe,CAAC;CAEhF,IAAI,OAAO,WAAW,GACpB,OAAO;CAGT,OACE,oBAAC,OAAD;EAAK,cAAW;EAAa,0BAAwB,aAAa,IAAI;YACpE,oBAAC,MAAD;GAAI,WAAU;aACX,OAAO,KAAK,OAAO,UAAU;IAC5B,MAAM,SAAS,UAAU,OAAO,SAAS;IAEzC,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,MAAD,EAAA,UACG,SACC,oBAAC,QAAD;KAAM,gBAAa;KAAO,WAAU;eACjC,MAAM;IACH,CAAA,IAEN,oBAAC,MAAD;KAAM,WAAU;KAAmB,MAAM,MAAM;eAC5C,MAAM;IACH,CAAA,EAEN,CAAA,GACH,SAAS,OAAO,oBAAC,MAAD;KAAI,eAAY;eAAO;IAAK,CAAA,CACrC,EAAA,GAbK,MAAM,IAaX;GAEd,CAAC;EACC,CAAA;CACD,CAAA;AAET"}
+{"version":3,"file":"breadcrumbs.js","names":[],"sources":["../../../resources/js/layout/components/breadcrumbs.tsx"],"sourcesContent":["import { Link, usePage } from \"@inertiajs/react\";\nimport { Fragment } from \"react\";\nimport type { PagePayload, RendererComponent } from \"@lattice-php/lattice/core/types\";\nimport { nodeIdentity } from \"@lattice-php/lattice/core/test-id\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\n\nconst BreadcrumbsComponent: RendererComponent<\"breadcrumbs\"> = ({ node }) => {\n  const { t } = useT(\"lattice\");\n  const page = usePage();\n  const crumbs = (page.props.lattice as PagePayload | undefined)?.breadcrumbs ?? [];\n\n  if (crumbs.length === 0) {\n    return null;\n  }\n\n  return (\n    <nav\n      aria-label={t(\"common.breadcrumb\", \"Breadcrumb\")}\n      data-lattice-component={nodeIdentity(node)}\n    >\n      <ol className=\"flex items-center gap-2 text-sm text-lt-muted-fg\">\n        {crumbs.map((crumb, index) => {\n          const isLast = index === crumbs.length - 1;\n\n          return (\n            <Fragment key={crumb.href}>\n              <li>\n                {isLast ? (\n                  <span aria-current=\"page\" className=\"text-lt-fg\">\n                    {crumb.title}\n                  </span>\n                ) : (\n                  <Link className=\"hover:text-lt-fg\" href={crumb.href}>\n                    {crumb.title}\n                  </Link>\n                )}\n              </li>\n              {isLast ? null : <li aria-hidden=\"true\">/</li>}\n            </Fragment>\n          );\n        })}\n      </ol>\n    </nav>\n  );\n};\n\nexport default BreadcrumbsComponent;\n"],"mappings":";;;;;;AAMA,IAAM,wBAA0D,EAAE,WAAW;CAC3E,MAAM,EAAE,MAAM,KAAK,SAAS;CAE5B,MAAM,SADO,QACG,EAAK,MAAM,SAAqC,eAAe,CAAC;CAEhF,IAAI,OAAO,WAAW,GACpB,OAAO;CAGT,OACE,oBAAC,OAAD;EACE,cAAY,EAAE,qBAAqB,YAAY;EAC/C,0BAAwB,aAAa,IAAI;YAEzC,oBAAC,MAAD;GAAI,WAAU;aACX,OAAO,KAAK,OAAO,UAAU;IAC5B,MAAM,SAAS,UAAU,OAAO,SAAS;IAEzC,OACE,qBAAC,UAAD,EAAA,UAAA,CACE,oBAAC,MAAD,EAAA,UACG,SACC,oBAAC,QAAD;KAAM,gBAAa;KAAO,WAAU;eACjC,MAAM;IACH,CAAA,IAEN,oBAAC,MAAD;KAAM,WAAU;KAAmB,MAAM,MAAM;eAC5C,MAAM;IACH,CAAA,EAEN,CAAA,GACH,SAAS,OAAO,oBAAC,MAAD;KAAI,eAAY;eAAO;IAAK,CAAA,CACrC,EAAA,GAbK,MAAM,IAaX;GAEd,CAAC;EACC,CAAA;CACD,CAAA;AAET"}

package/dist/layout/components/callouts.js

@@ -1,7 +1,7 @@
+import { onCallout } from "../../toast/callout.js";
 import { cn } from "../../lib/utils.js";
 import { Icon } from "../../icons/sprite.js";
 import { RenderNode } from "../../core/renderer.js";
-import { onCallout } from "../../toast/callout.js";
 import { useT } from "../../i18n/instance.js";
 import { variantStyles } from "../../toast/variant-styles.js";
 import { useEffect, useState } from "react";

package/dist/lib/color.d.ts

@@ -0,0 +1,9 @@
+import { CSSProperties } from 'react';
+import { Color, ColorName } from '../types/generated.js';
+export declare function namedColor(value: ColorName): Color;
+export declare function coerceColor(value: unknown): Color | undefined;
+export declare function colorValue(color: Color): string;
+export declare function toneProps(color: Color): {
+    className?: string;
+    style?: CSSProperties;
+};