@godxjp/ui 33.8.0 → 33.9.1

package/dist/props/registry.d.ts

@@ -1676,6 +1676,65 @@ export declare const COMPONENT_PROP_REGISTRY: {
             readonly reason: "Per-locale validation messages keyed by BCP-47 tag; marks each locale's tab and sends the ACTIVE one through FormField. `error` (one message) cannot say which locale failed.";
         }];
     };
+    readonly TranslatableLocaleProp: {
+        readonly group: "data-entry";
+        readonly file: "components/data-entry.prop.ts";
+        readonly vocabulary: readonly ["ValueProp", "DefaultValueProp", "OnValueChangeProp", {
+            readonly field: "locales";
+            readonly local: true;
+            readonly reason: "The BCP-47 tags a translatable control edits, in tab order (gh#1336). A per-field list, not a value.";
+        }, {
+            readonly field: "defaultLocale";
+            readonly local: true;
+            readonly reason: "The locale tab selected first — the AppProvider's `defaultLocale`, scoped to one field.";
+        }, {
+            readonly field: "fallbackLocale";
+            readonly local: true;
+            readonly reason: "The locale whose text an EMPTY locale shows as its placeholder — the AppProvider's `fallbackLocale`, scoped to one field.";
+        }, {
+            readonly field: "errors";
+            readonly local: true;
+            readonly reason: "Per-locale validation messages keyed by BCP-47 tag; `error` (one message) cannot say which locale failed.";
+        }];
+    };
+    readonly TranslatableFieldControlProp: {
+        readonly group: "data-entry";
+        readonly file: "components/data-entry.prop.ts";
+        readonly vocabulary: readonly ["ValueProp", "OnValueChangeProp", "PlaceholderProp", {
+            readonly field: "lang";
+            readonly local: true;
+            readonly reason: "The active locale's BCP-47 tag, handed to the control as its HTML `lang` attribute.";
+        }];
+    };
+    readonly TranslatableFieldProp: {
+        readonly group: "data-entry";
+        readonly file: "components/data-entry.prop.ts";
+        readonly vocabulary: readonly ["ValueProp", "DefaultValueProp", "OnValueChangeProp", "SizeProp", "PlaceholderProp", "IdProp", "ClassNameProp", {
+            readonly field: "locales";
+            readonly local: true;
+            readonly reason: "The BCP-47 tags the field edits, in tab order (gh#1336). Defaults to the app's content / registered locales; a per-field list, not a value.";
+        }, {
+            readonly field: "defaultLocale";
+            readonly local: true;
+            readonly reason: "The locale tab selected first — the AppProvider's own `defaultLocale` spelling, scoped to one field.";
+        }, {
+            readonly field: "fallbackLocale";
+            readonly local: true;
+            readonly reason: "The locale whose text an EMPTY locale shows as its placeholder — the AppProvider's own `fallbackLocale` spelling, scoped to one field.";
+        }, {
+            readonly field: "errors";
+            readonly local: true;
+            readonly reason: "Per-locale validation messages keyed by BCP-47 tag; marks each locale's tab and sends the ACTIVE one through FormField.";
+        }, {
+            readonly field: "renderControl";
+            readonly local: true;
+            readonly reason: "The one control in the panel, rendered from the active locale's props (gh#1365) — the engine is shared by TranslatableInput, TranslatableTextarea and @godxjp/block-editor's TranslatableRichText. `render*` as in renderPreview / renderEmbed.";
+        }, {
+            readonly field: "toPlaceholder";
+            readonly local: true;
+            readonly reason: "Turns the fallback locale's stored text into a plain placeholder (HTML → text for a rich-text control). No vocabulary entry describes a value-to-placeholder mapping.";
+        }];
+    };
     readonly TranslatableTextareaProp: {
         readonly group: "data-entry";
         readonly file: "components/data-entry.prop.ts";

package/dist/props/registry.js

@@ -1912,6 +1912,92 @@ const COMPONENT_PROP_REGISTRY = {
       }
     ]
   },
+  TranslatableLocaleProp: {
+    group: "data-entry",
+    file: "components/data-entry.prop.ts",
+    vocabulary: [
+      "ValueProp",
+      "DefaultValueProp",
+      "OnValueChangeProp",
+      {
+        field: "locales",
+        local: true,
+        reason: "The BCP-47 tags a translatable control edits, in tab order (gh#1336). A per-field list, not a value."
+      },
+      {
+        field: "defaultLocale",
+        local: true,
+        reason: "The locale tab selected first \u2014 the AppProvider's `defaultLocale`, scoped to one field."
+      },
+      {
+        field: "fallbackLocale",
+        local: true,
+        reason: "The locale whose text an EMPTY locale shows as its placeholder \u2014 the AppProvider's `fallbackLocale`, scoped to one field."
+      },
+      {
+        field: "errors",
+        local: true,
+        reason: "Per-locale validation messages keyed by BCP-47 tag; `error` (one message) cannot say which locale failed."
+      }
+    ]
+  },
+  TranslatableFieldControlProp: {
+    group: "data-entry",
+    file: "components/data-entry.prop.ts",
+    vocabulary: [
+      "ValueProp",
+      "OnValueChangeProp",
+      "PlaceholderProp",
+      {
+        field: "lang",
+        local: true,
+        reason: "The active locale's BCP-47 tag, handed to the control as its HTML `lang` attribute."
+      }
+    ]
+  },
+  TranslatableFieldProp: {
+    group: "data-entry",
+    file: "components/data-entry.prop.ts",
+    vocabulary: [
+      "ValueProp",
+      "DefaultValueProp",
+      "OnValueChangeProp",
+      "SizeProp",
+      "PlaceholderProp",
+      "IdProp",
+      "ClassNameProp",
+      {
+        field: "locales",
+        local: true,
+        reason: "The BCP-47 tags the field edits, in tab order (gh#1336). Defaults to the app's content / registered locales; a per-field list, not a value."
+      },
+      {
+        field: "defaultLocale",
+        local: true,
+        reason: "The locale tab selected first \u2014 the AppProvider's own `defaultLocale` spelling, scoped to one field."
+      },
+      {
+        field: "fallbackLocale",
+        local: true,
+        reason: "The locale whose text an EMPTY locale shows as its placeholder \u2014 the AppProvider's own `fallbackLocale` spelling, scoped to one field."
+      },
+      {
+        field: "errors",
+        local: true,
+        reason: "Per-locale validation messages keyed by BCP-47 tag; marks each locale's tab and sends the ACTIVE one through FormField."
+      },
+      {
+        field: "renderControl",
+        local: true,
+        reason: "The one control in the panel, rendered from the active locale's props (gh#1365) \u2014 the engine is shared by TranslatableInput, TranslatableTextarea and @godxjp/block-editor's TranslatableRichText. `render*` as in renderPreview / renderEmbed."
+      },
+      {
+        field: "toPlaceholder",
+        local: true,
+        reason: "Turns the fallback locale's stored text into a plain placeholder (HTML \u2192 text for a rich-text control). No vocabulary entry describes a value-to-placeholder mapping."
+      }
+    ]
+  },
   TranslatableTextareaProp: {
     group: "data-entry",
     file: "components/data-entry.prop.ts",

package/dist/styles/data-display-layout.css

@@ -1660,6 +1660,47 @@
     gap: var(--space-1);
   }
 
+  .ui-rich-text-editor {
+    border: var(--stroke-hairline) solid hsl(var(--input));
+    border-radius: var(--control-radius, var(--radius));
+    background-color: hsl(var(--background));
+    transition: border-color var(--duration-fast);
+  }
+
+  .ui-rich-text-editor:focus-within {
+    border-color: hsl(var(--ring));
+  }
+
+  .ui-rich-text-editor[data-status="error"] {
+    border-color: var(--control-status-error-border-color);
+  }
+
+  .ui-rich-text-editor[data-status="warning"] {
+    border-color: var(--control-status-warning-border-color, hsl(var(--text-warning)));
+  }
+
+  .ui-rich-text-editor[data-disabled] {
+    background-color: hsl(var(--muted));
+  }
+
+  .ui-rich-text-editor-toolbar {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: var(--space-1) var(--space-3);
+    padding: var(--space-1);
+    border-block-end: var(--stroke-hairline) solid hsl(var(--border));
+  }
+
+  .ui-rich-text-editor-toolbar svg {
+    inline-size: var(--control-icon-size);
+    block-size: var(--control-icon-size);
+  }
+
+  .ui-rich-text-editor .ui-block-editor-content {
+    padding: var(--block-editor-frame-padding);
+  }
+
   .ui-block-editor-wikilink {
     color: hsl(var(--prose-link-color, var(--text-link, var(--primary))));
     text-decoration-line: underline;

package/dist/styles/layers.json

@@ -1,5 +1,5 @@
 {
-  "version": "33.8.0",
+  "version": "33.9.1",
   "generatedBy": "scripts/gen-style-layers.mjs — do not edit by hand; run `pnpm gen:style-layers`",
   "base": "base.css",
   "fonts": "fonts.css",
@@ -200,6 +200,7 @@
         "dialog-layout.css",
         "alert-layout.css",
         "data-display-layout.css",
+        "data-entry-layout.css",
         "form-layout.css",
         "navigation-layout.css"
       ]
@@ -848,6 +849,20 @@
         "motion.css"
       ]
     },
+    "RichTextEditor": {
+      "layers": [
+        "layout.css",
+        "control.css",
+        "toggle.css",
+        "text-layout.css",
+        "dialog-layout.css",
+        "alert-layout.css",
+        "data-display-layout.css",
+        "data-entry-layout.css",
+        "form-layout.css",
+        "navigation-layout.css"
+      ]
+    },
     "ScrollArea": {
       "layers": [
         "data-display-layout.css"
@@ -1107,6 +1122,15 @@
         "navigation-layout.css"
       ]
     },
+    "TranslatableField": {
+      "layers": [
+        "control.css",
+        "toggle.css",
+        "dialog-layout.css",
+        "data-entry-layout.css",
+        "navigation-layout.css"
+      ]
+    },
     "TranslatableInput": {
       "layers": [
         "control.css",
@@ -1116,6 +1140,20 @@
         "navigation-layout.css"
       ]
     },
+    "TranslatableRichText": {
+      "layers": [
+        "layout.css",
+        "control.css",
+        "toggle.css",
+        "text-layout.css",
+        "dialog-layout.css",
+        "alert-layout.css",
+        "data-display-layout.css",
+        "data-entry-layout.css",
+        "form-layout.css",
+        "navigation-layout.css"
+      ]
+    },
     "TranslatableTextarea": {
       "layers": [
         "control.css",

package/dist/styles/layout.css

@@ -1507,6 +1507,14 @@
     }
   }
 
+  .ui-toolbar-control {
+    display: grid;
+    align-items: center;
+    gap: var(--space-stack-xs);
+    min-block-size: var(--control-height);
+    min-width: 0;
+  }
+
   .ui-toolbar-label {
     display: flex;
     align-items: center;
@@ -1534,6 +1542,7 @@
     align-items: center;
     gap: var(--space-2);
     width: 100%;
+    min-block-size: var(--control-height);
   }
 
   .ui-filter-bar-end .ui-toolbar-clear {