@thi.ng/rdom-forms
Advanced tools
@thi.ng/rdom-forms - npm Package Compare versions
Comparing version 0.3.0 to 0.3.1
| # Change Log | ||
| - **Last updated**: 2024-03-27T09:53:45Z | ||
| - **Last updated**: 2024-03-28T10:57:28Z | ||
| - **Generator**: [thi.ng/monopub](https://thi.ng/monopub) | ||
@@ -12,2 +12,8 @@ | ||
| ### [0.3.1](https://github.com/thi-ng/umbrella/tree/@thi.ng/rdom-forms@0.3.1) (2024-03-28) | ||
| #### 🩹 Bug fixes | ||
| - fix multiFile() handling/detection ([5339339](https://github.com/thi-ng/umbrella/commit/5339339)) | ||
| ## [0.3.0](https://github.com/thi-ng/umbrella/tree/@thi.ng/rdom-forms@0.3.0) (2024-03-27) | ||
@@ -14,0 +20,0 @@ |
@@ -314,3 +314,3 @@ import { isArray } from "@thi.ng/checks/is-array"; | ||
| const val = $val; | ||
| const isMulti = val.id.startsWith("multi"); | ||
| const isMulti = val.type.startsWith("multi"); | ||
| return __component( | ||
@@ -317,0 +317,0 @@ val, |
| { | ||
| "name": "@thi.ng/rdom-forms", | ||
| "version": "0.3.0", | ||
| "version": "0.3.1", | ||
| "description": "Data-driven declarative & extensible HTML form generation", | ||
@@ -43,4 +43,4 @@ "type": "module", | ||
| "@thi.ng/hiccup-html": "^2.5.0", | ||
| "@thi.ng/rdom": "^1.1.19", | ||
| "@thi.ng/rstream": "^8.3.17" | ||
| "@thi.ng/rdom": "^1.1.20", | ||
| "@thi.ng/rstream": "^8.3.18" | ||
| }, | ||
@@ -101,3 +101,3 @@ "devDependencies": { | ||
| }, | ||
| "gitHead": "feb3b24654f2c931cd3c3308c1c0c807ee14d0e4\n" | ||
| "gitHead": "db5f5a5d1b223a8e6b4999d67836678038fd3560\n" | ||
| } |
@@ -18,2 +18,4 @@ <!-- This file is generated - DO NOT EDIT! --> | ||
| - [About](#about) | ||
| - [Examples](#examples) | ||
| - [Login form](#login-form) | ||
| - [Status](#status) | ||
@@ -42,6 +44,64 @@ - [Related packages](#related-packages) | ||
| All generated form elements are unstyled by default, but can be fully customized (in various stages) via user-provided options. | ||
| All generated form elements are unstyled by default, but can be fully customized | ||
| (in various stages) via user-provided options. | ||
| Please see the example project linked further below, which demonstrates all currently provided elements... | ||
| ## Examples | ||
| Please see the [rdom-formgen example | ||
| project](https://github.com/thi-ng/umbrella/blob/develop/examples/rdom-formgen), | ||
| which demonstrates **all** supported elements and various customization | ||
| options... | ||
| ### Login form | ||
| ```ts tangle:export/readme1.ts | ||
| import { | ||
| compileForm, form, hidden, password, str, submit | ||
| } from "@thi.ng/rdom-forms"; | ||
| // compile form from given field descriptions | ||
| const loginForm = compileForm( | ||
| form({ action: "/login", method: "post" }, | ||
| // string input | ||
| str({ id: "user", label: "Username", desc: "or email address" }), | ||
| // password | ||
| password({ id: "pass", label: "Password", desc: "min. 8 characters", min: 8 }), | ||
| // hidden form value | ||
| hidden({ name: "target", value: "user-home" }), | ||
| submit({ title: "Login", label: "" }) | ||
| ), | ||
| { | ||
| // disable reactive value subscriptions | ||
| behaviors: { values: false }, | ||
| // customize attribs for label descriptions | ||
| descAttribs: { class: "desc" } | ||
| } | ||
| ); | ||
| // use thi.ng/hiccup to serialize as HTML | ||
| import { serialize } from "@thi.ng/hiccup"; | ||
| console.log(serialize(loginForm)); | ||
| ``` | ||
| Resulting output (reformatted): | ||
| ```html | ||
| <form action="/login" method="post"> | ||
| <div> | ||
| <label for="user">Username<span class="desc">or email address</span></label> | ||
| <input type="text" id="user" name="user" /> | ||
| </div> | ||
| <div> | ||
| <label for="pass">Password<span class="desc">min. 8 characters</span></label> | ||
| <input type="password" autocomplete minlength="8" id="pass" name="pass" /> | ||
| </div> | ||
| <input type="hidden" id="target" name="target" value="user-home" /> | ||
| <div> | ||
| <label for="submit-0"></label> | ||
| <input type="submit" value="Login" id="submit-0" name="submit-0" /> | ||
| </div> | ||
| </form> | ||
| ``` | ||
| ## Status | ||
@@ -77,3 +137,3 @@ | ||
| Package sizes (brotli'd, pre-treeshake): ESM: 2.29 KB | ||
| Package sizes (brotli'd, pre-treeshake): ESM: 2.28 KB | ||
@@ -80,0 +140,0 @@ ## Dependencies |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by3.79%
53476
- Number of lines in readme file
- increased by47.62%
186
Dependency changes
Updated@thi.ng/rdom@^1.1.20
Updated@thi.ng/rstream@^8.3.18