@cahyo-dimas/freeday 1.39.0 → 1.40.0

package/CHANGELOG.md

@@ -3,6 +3,29 @@
 Semua perubahan penting dicatat di sini. Format longgar mengikuti
 [Keep a Changelog](https://keepachangelog.com/); tiap versi = git tag.
 
+## [1.40.0] — 2026-08-19
+One note from the back-office app (IDU_EMATE_APPL_WEB, #017).
+### Fixed
+- **A picker inside a `.fdy-field` now fills it.** `.fdy-field`, `.fdy-combo` and
+  `.fdy-input-group` all cap at 22rem; `.fdy-datepicker` capped at 14rem and `.fdy-timepicker`
+  at 11rem. In a two-column form grid that left a **224px** date box beside a **319px** combo —
+  measured, not eyeballed — and the row read as ragged with no fix available to the consuming
+  app, because the cap sits on the component. `.fdy-field > .fdy-datepicker` / `> .fdy-timepicker`
+  / `> .fdy-daterange` drop the cap; a picker standing on its own keeps its narrower width, which
+  is right for a short value.
+
+### Added — guards
+- **The enhancer string contract is asserted in a real browser** (#016). 1.39.0 moved every
+  user-facing string in **nine** enhancers into a `TEXT` table read through `textOf()`, and only
+  **one of the nine** — upload — had any browser coverage at all. The node guard proves the
+  literals *sit* in the table; it reads the source as text and cannot prove the wiring *runs*, so a
+  `zone` out of scope or a `getAttribute` on a non-element would have thrown at init with all 51
+  node tests still green. `browser/text-override.mjs` initialises table, stepper, mask, carousel,
+  cascade, form and toast on real markup and asserts **both halves**: the documented Indonesian
+  default still renders, and `data-fdy-text-*` wins. The default is a contract too — an enhancer
+  that quietly turned English would be a breaking change wearing a bugfix's clothes.
+  Mutation-tested: making `textOf()` ignore the attribute fails it by name and value.
+
 ## [1.39.0] — 2026-08-19
 The sweep #013 §2 filed and #015 restated: the vanilla enhancers' strings are reachable now.
 ### Added

package/dist/freeday.bundle.css

@@ -1112,6 +1112,12 @@ a { color: var(--color-primary); }
 /* Freeday — Date picker (input-styled trigger + calendar popover).
  * Built by freeday-datepicker.js from an empty [data-fdy-datepicker] wrapper. */
 .fdy-datepicker{position:relative;display:inline-block;width:100%;max-width:14rem;}
+/* Inside a labelled field, a picker fills the field like every other control.
+   The 14rem/11rem caps above suit a picker standing on its own; in a form grid
+   they leave the date box visibly short of the combo beside it — 224px against
+   319px in a two-column layout — and the row reads as ragged. The field's own
+   max-width is what should govern there. */
+.fdy-field>.fdy-datepicker,.fdy-field>.fdy-timepicker,.fdy-field>.fdy-daterange{max-width:none;}
 .fdy-datepicker__trigger{display:inline-flex;align-items:center;gap:var(--space-2);width:100%;height:var(--control-h);padding:0 var(--space-3);text-align:left;cursor:pointer;font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-text);background:var(--color-surface);border:1.5px solid var(--color-control-border);border-radius:var(--radius-md);box-shadow:inset 0 1px 2px rgba(16,14,30,.06);transition:border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard);}
 .fdy-datepicker__trigger:hover{border-color:var(--color-text-muted);}
 .fdy-datepicker__trigger:focus-visible{outline:none;border-color:var(--color-primary);box-shadow:inset 0 1px 2px rgba(16,14,30,.04),0 0 0 3px color-mix(in srgb,var(--color-primary) 26%,transparent);}

package/dist/freeday.css

@@ -729,6 +729,12 @@ a { color: var(--color-primary); }
 /* Freeday — Date picker (input-styled trigger + calendar popover).
  * Built by freeday-datepicker.js from an empty [data-fdy-datepicker] wrapper. */
 .fdy-datepicker{position:relative;display:inline-block;width:100%;max-width:14rem;}
+/* Inside a labelled field, a picker fills the field like every other control.
+   The 14rem/11rem caps above suit a picker standing on its own; in a form grid
+   they leave the date box visibly short of the combo beside it — 224px against
+   319px in a two-column layout — and the row reads as ragged. The field's own
+   max-width is what should govern there. */
+.fdy-field>.fdy-datepicker,.fdy-field>.fdy-timepicker,.fdy-field>.fdy-daterange{max-width:none;}
 .fdy-datepicker__trigger{display:inline-flex;align-items:center;gap:var(--space-2);width:100%;height:var(--control-h);padding:0 var(--space-3);text-align:left;cursor:pointer;font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-text);background:var(--color-surface);border:1.5px solid var(--color-control-border);border-radius:var(--radius-md);box-shadow:inset 0 1px 2px rgba(16,14,30,.06);transition:border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard);}
 .fdy-datepicker__trigger:hover{border-color:var(--color-text-muted);}
 .fdy-datepicker__trigger:focus-visible{outline:none;border-color:var(--color-primary);box-shadow:inset 0 1px 2px rgba(16,14,30,.04),0 0 0 3px color-mix(in srgb,var(--color-primary) 26%,transparent);}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cahyo-dimas/freeday",
-  "version": "1.39.0",
+  "version": "1.40.0",
   "description": "Freeday — token-driven, framework-agnostic UI KIT (design source-of-truth).",
   "type": "module",
   "license": "MIT",
@@ -92,7 +92,7 @@
   "scripts": {
     "build": "node tokens/build.mjs",
     "test": "node --test",
-    "test:browser": "node --test browser/vanilla.mjs browser/adapter.mjs browser/layout.mjs browser/theme.mjs browser/state.mjs browser/root-init.mjs browser/upload-states.mjs browser/number.mjs browser/card-stretch.mjs",
+    "test:browser": "node --test browser/vanilla.mjs browser/adapter.mjs browser/layout.mjs browser/theme.mjs browser/state.mjs browser/root-init.mjs browser/upload-states.mjs browser/number.mjs browser/card-stretch.mjs browser/text-override.mjs",
     "prepack": "node tokens/build.mjs",
     "version": "node tokens/build.mjs && git add dist",
     "typecheck:react": "tsc -p adapters/react/tsconfig.json --noEmit"

package/src/components/datepicker.css

@@ -1,6 +1,12 @@
 /* Freeday — Date picker (input-styled trigger + calendar popover).
  * Built by freeday-datepicker.js from an empty [data-fdy-datepicker] wrapper. */
 .fdy-datepicker{position:relative;display:inline-block;width:100%;max-width:14rem;}
+/* Inside a labelled field, a picker fills the field like every other control.
+   The 14rem/11rem caps above suit a picker standing on its own; in a form grid
+   they leave the date box visibly short of the combo beside it — 224px against
+   319px in a two-column layout — and the row reads as ragged. The field's own
+   max-width is what should govern there. */
+.fdy-field>.fdy-datepicker,.fdy-field>.fdy-timepicker,.fdy-field>.fdy-daterange{max-width:none;}
 .fdy-datepicker__trigger{display:inline-flex;align-items:center;gap:var(--space-2);width:100%;height:var(--control-h);padding:0 var(--space-3);text-align:left;cursor:pointer;font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-text);background:var(--color-surface);border:1.5px solid var(--color-control-border);border-radius:var(--radius-md);box-shadow:inset 0 1px 2px rgba(16,14,30,.06);transition:border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard);}
 .fdy-datepicker__trigger:hover{border-color:var(--color-text-muted);}
 .fdy-datepicker__trigger:focus-visible{outline:none;border-color:var(--color-primary);box-shadow:inset 0 1px 2px rgba(16,14,30,.04),0 0 0 3px color-mix(in srgb,var(--color-primary) 26%,transparent);}