cotomy 1.0.3 → 1.0.5

package/README.md

@@ -243,7 +243,7 @@ The Form layer builds on `CotomyElement` for common form flows.
   - `loadActionUrl: string` — Defaults to `actionUrl`; override or set for custom endpoints
   - `canLoad: boolean` — Defaults to `hasEntityKey`
 - Naming & binding
-  - `bindNameGenerator(): ICotomyBindNameGenerator` — Defaults to `CotomyBracketBindNameGenerator` (`user[name]`)
+  - `bindNameGenerator(): ICotomyBindNameGenerator` — Defaults to `CotomyViewRenderer.defaultBindNameGenerator` (initial value: `CotomyBracketBindNameGenerator`, `user[name]`)
   - `renderer(): CotomyViewRenderer` — Applies `[data-cotomy-bind]` to view elements
 - `filler(type, (input, value))` — Register fillers; defaults provided for `datetime-local`, `checkbox`, `radio`
   - Fills non-array, non-object fields by matching input/select/textarea `name`
@@ -255,15 +255,21 @@ The Form layer builds on `CotomyElement` for common form flows.
 - `mail`, `tel`, `url` — Wrap the value in a corresponding anchor tag.
 - `number` — Uses `Intl.NumberFormat` with `data-cotomy-locale`/`data-cotomy-currency` inheritance.
   - `data-cotomy-fraction-digits="2"` — Forces fixed fraction digits (sets both `minimumFractionDigits` and `maximumFractionDigits`). Works with or without `data-cotomy-currency` (e.g. `0` → `0.00`).
-- `utc` — Treats the value as UTC (or appends `Z` when missing) and formats with `data-cotomy-format` (default `YYYY/MM/DD HH:mm`).
-- `date` — Renders local dates with `data-cotomy-format` (default `YYYY/MM/DD`) when the input is a valid `Date` value.
+- `utc` — Treats the value as UTC (or appends `Z` when missing) and formats with `data-cotomy-format` (default `YYYY/MM/DD HH:mm`). By default it renders in local time; set `data-cotomy-timezone` (element or ancestor) to render in a specific IANA timezone.
+- `date` — Renders local dates with `data-cotomy-format` (default `YYYY/MM/DD`) when the input is a valid `Date` value. By default it renders in local time; set `data-cotomy-timezone` (element or ancestor) to render in a specific IANA timezone.
+
+### UTC Renderer
+
+- Supports ISO 8601 offsets (`+09:00`, `-05:00`)
+- Explicitly supports `Z` (UTC indicator)
+- Offset-less timestamps are treated as UTC (internally appends "Z" before parsing)
+- `data-cotomy-timezone` is optional. When omitted, output stays local; when set, output is converted to the specified IANA timezone (supports ancestor inheritance).
 
 Example:
 
 ```ts
 const view = new CotomyViewRenderer(
-  new CotomyElement(document.querySelector("#profile")!),
-  new CotomyBracketBindNameGenerator()
+  new CotomyElement(document.querySelector("#profile")!)
 );
 
 await view.applyAsync(apiResponse); // apiResponse is CotomyApiResponse from CotomyApi
@@ -289,6 +295,24 @@ form.apiFailed(e => console.error("API failed", e.response.status));
 form.submitFailed(e => console.warn("Submit failed", e.response.status));
 ```
 
+To switch the default bind naming style for a page, set it from your page controller:
+
+```ts
+import {
+  CotomyDotBindNameGenerator,
+  CotomyEntityFillApiForm,
+  CotomyPageController
+} from "cotomy";
+
+CotomyPageController.set(class extends CotomyPageController {
+  protected override async initializeAsync(): Promise<void> {
+    this.defaultBindNameGenerator = new CotomyDotBindNameGenerator();
+
+    this.setForm(CotomyEntityFillApiForm.byId("profile-form", CotomyEntityFillApiForm)!);
+  }
+});
+```
+
 ### Entity API forms
 
 `CotomyEntityApiForm` targets REST endpoints that identify records with a single surrogate key.  

package/dist/browser/cotomy.js

@@ -289,6 +289,12 @@ __webpack_require__.d(__webpack_exports__, {
 // EXTERNAL MODULE: ./node_modules/dayjs/dayjs.min.js
 var dayjs_min = __webpack_require__(353);
 var dayjs_min_default = /*#__PURE__*/__webpack_require__.n(dayjs_min);
+// EXTERNAL MODULE: ./node_modules/dayjs/plugin/timezone.js
+var timezone = __webpack_require__(569);
+var timezone_default = /*#__PURE__*/__webpack_require__.n(timezone);
+// EXTERNAL MODULE: ./node_modules/dayjs/plugin/utc.js
+var utc = __webpack_require__(826);
+var utc_default = /*#__PURE__*/__webpack_require__.n(utc);
 ;// ./node_modules/http-status-codes/build/es/status-codes.js
 // Generated file. Do not edit
 var StatusCodes;
@@ -2257,6 +2263,10 @@ CotomyWindow._instance = null;
 
 
 
+
+
+dayjs_min_default().extend((utc_default()));
+dayjs_min_default().extend((timezone_default()));
 class CotomyApiException extends Error {
     constructor(status, message, response, bodyText = "") {
         super(message);
@@ -2452,19 +2462,20 @@ class CotomyDotBindNameGenerator {
     }
 }
 class CotomyViewRenderer {
-    constructor(element, bindNameGenerator) {
+    static get defaultBindNameGenerator() {
+        return this._defaultBindNameGenerator ?? new CotomyBracketBindNameGenerator();
+    }
+    static set defaultBindNameGenerator(generator) {
+        this._defaultBindNameGenerator = generator;
+    }
+    static resetDefaultBindNameGenerator() {
+        this._defaultBindNameGenerator = null;
+    }
+    constructor(element, bindNameGenerator = CotomyViewRenderer.defaultBindNameGenerator) {
         this.element = element;
         this.bindNameGenerator = bindNameGenerator;
         this._renderers = {};
-        this._builded = false;
-    }
-    get locale() {
-        const languages = (navigator.languages && navigator.languages.length ? navigator.languages : [navigator.language]).filter(Boolean);
-        let locale = this.element.attribute("data-cotomy-locale")
-            || this.element.closest("[data-cotomy-locale]")?.attribute("data-cotomy-locale")
-            || languages[0]
-            || 'en-US';
-        return locale.includes("-") ? locale.split("-")[0] : locale;
+        this._initialized = false;
     }
     renderer(type, callback) {
         this._renderers[type] = callback;
@@ -2475,7 +2486,7 @@ class CotomyViewRenderer {
         return this._renderers;
     }
     get initialized() {
-        return this._builded;
+        return this._initialized;
     }
     initialize() {
         if (!this.initialized) {
@@ -2507,16 +2518,27 @@ class CotomyViewRenderer {
                         ...(currency ? { style: "currency", currency } : {}),
                         ...(hasFractionDigits ? { minimumFractionDigits: fractionDigits, maximumFractionDigits: fractionDigits } : {}),
                     };
-                    element.text = new Intl.NumberFormat(this.locale, options).format(value);
+                    const languages = (navigator.languages && navigator.languages.length ? navigator.languages : [navigator.language]).filter(Boolean);
+                    const localeAttribute = element.attribute("data-cotomy-locale")
+                        || element.closest("[data-cotomy-locale]")?.attribute("data-cotomy-locale")
+                        || this.element.attribute("data-cotomy-locale")
+                        || this.element.closest("[data-cotomy-locale]")?.attribute("data-cotomy-locale")
+                        || languages[0]
+                        || "en-US";
+                    const locale = localeAttribute.includes("-") ? localeAttribute.split("-")[0] : localeAttribute;
+                    element.text = new Intl.NumberFormat(locale, options).format(value);
                 }
             });
             this.renderer("utc", (element, value) => {
                 if (value) {
-                    const hasOffset = /[+-]\d{2}:\d{2}$/.test(value);
+                    const hasOffset = /([+-]\d{2}:\d{2}|Z)$/.test(value);
                     const date = hasOffset ? new Date(value) : new Date(`${value}Z`);
                     if (!isNaN(date.getTime())) {
                         const format = element.attribute("data-cotomy-format") ?? "YYYY/MM/DD HH:mm";
-                        element.text = dayjs_min_default()(date).format(format);
+                        const timezone = element.attribute("data-cotomy-timezone")
+                            || element.closest("[data-cotomy-timezone]")?.attribute("data-cotomy-timezone");
+                        const dt = dayjs_min_default()(date);
+                        element.text = timezone && timezone.trim() !== "" ? dt.tz(timezone).format(format) : dt.format(format);
                     }
                 }
             });
@@ -2525,11 +2547,14 @@ class CotomyViewRenderer {
                     const date = new Date(value);
                     if (!isNaN(date.getTime())) {
                         const format = element.attribute("data-cotomy-format") ?? "YYYY/MM/DD";
-                        element.text = dayjs_min_default()(date).format(format);
+                        const timezone = element.attribute("data-cotomy-timezone")
+                            || element.closest("[data-cotomy-timezone]")?.attribute("data-cotomy-timezone");
+                        const dt = dayjs_min_default()(date);
+                        element.text = timezone && timezone.trim() !== "" ? dt.tz(timezone).format(format) : dt.format(format);
                     }
                 }
             });
-            this._builded = true;
+            this._initialized = true;
         }
         return this;
     }
@@ -2587,6 +2612,7 @@ class CotomyViewRenderer {
         return this;
     }
 }
+CotomyViewRenderer._defaultBindNameGenerator = null;
 class CotomyApi {
     constructor(_options = {
         baseUrl: null, headers: null, credentials: null, redirect: null,
@@ -3048,7 +3074,7 @@ class CotomyEntityFillApiForm extends CotomyEntityApiForm {
         return this.actionUrl;
     }
     bindNameGenerator() {
-        return new CotomyBracketBindNameGenerator();
+        return CotomyViewRenderer.defaultBindNameGenerator;
     }
     renderer() {
         return new CotomyViewRenderer(this, this.bindNameGenerator());
@@ -3140,18 +3166,13 @@ class CotomyEntityFillApiForm extends CotomyEntityApiForm {
     }
 }
 
-// EXTERNAL MODULE: ./node_modules/dayjs/plugin/timezone.js
-var timezone = __webpack_require__(569);
-var timezone_default = /*#__PURE__*/__webpack_require__.n(timezone);
-// EXTERNAL MODULE: ./node_modules/dayjs/plugin/utc.js
-var utc = __webpack_require__(826);
-var utc_default = /*#__PURE__*/__webpack_require__.n(utc);
 ;// ./src/page.ts
 
 
 
 
 
+
 dayjs_min_default().extend((utc_default()));
 dayjs_min_default().extend((timezone_default()));
 class CotomyUrl {
@@ -3213,6 +3234,12 @@ class CotomyPageController {
         }
         return this._instance;
     }
+    get defaultBindNameGenerator() {
+        return CotomyViewRenderer.defaultBindNameGenerator;
+    }
+    set defaultBindNameGenerator(value) {
+        CotomyViewRenderer.defaultBindNameGenerator = value;
+    }
     setForm(form) {
         if (!form.id) {
             form.generateId();