| class OtpInput extends HTMLElement { | |
| constructor() { | |
| super(); | |
| this.attachShadow({ mode: "open" }); | |
| this.values = []; | |
| } | |
| connectedCallback() { | |
| this.length = Number(this.getAttribute("length") || 6); | |
| this.values = Array(this.length).fill(""); |
| <div | |
| id="demo" | |
| data-signals="{ values: { 0: 0, 1: 0, 2: 0, 3: 0, 4: 0, 5: 0 } }" | |
| data-computed:bar="Object.values($values).join('')" | |
| data-on-signal-patch="@post('/examples/one_time_passcode')" | |
| > | |
| <h3>OTP Input:</h3> | |
| <div | |
| data-on:keydown__prevent=" | |
| const input = event.target; |
| package examples | |
| import ( | |
| "context" | |
| "fmt" | |
| "log" | |
| "net/http" | |
| "os" | |
| "strconv" | |
| "time" |
| router.Route("/api", func(apiRouter chi.Router) { | |
| apiRouter.Route("/todos", func(todosRouter chi.Router) { | |
| todosRouter.Get("/", func(w http.ResponseWriter, r *http.Request) { | |
| sessionID, mvc, err := mvcSession(w, r) | |
| if err != nil { | |
| http.Error(w, err.Error(), http.StatusInternalServerError) | |
| return | |
| } |
| package site | |
| import ( | |
| "fmt" | |
| "github.com/dustin/go-humanize" | |
| build "github.com/starfederation/datastar/build" | |
| datastar "github.com/starfederation/datastar/sdk/go" | |
| ) | |
| templ Home() { |
| package examples | |
| import ( | |
| "context" | |
| "fmt" | |
| "log" | |
| "net/http" | |
| "os" | |
| "strconv" | |
| "time" |
| <template | |
| data-rocket-ds-password-strength | |
| data-props-password="string|="> | |
| <script data-static> | |
| const requirements = [ | |
| { label: '8+ characters', check: (pwd) => pwd.length >= 8 }, | |
| { label: '12+ characters', check: (pwd) => pwd.length >= 12 }, | |
| { label: 'Lowercase letter', check: (pwd) => /[a-z]/.test(pwd) }, | |
| { label: 'Uppercase letter', check: (pwd) => /[A-Z]/.test(pwd) }, | |
| { label: 'Number', check: (pwd) => /\d/.test(pwd) }, |
| package examples | |
| import ( | |
| "github.com/XANi/loremipsum" | |
| "github.com/go-chi/chi/v5" | |
| . "github.com/starfederation/datastar-dev/site/shared" | |
| datastar "github.com/starfederation/datastar/sdk/go" | |
| "math/rand/v2" | |
| "net/http" | |
| "time" |
| [{ | |
| "message": "Argument of type 'Node | Element | null | undefined' is not assignable to parameter of type 'Node | Element | null'.\n Type 'undefined' is not assignable to type 'Node | Element | null'.", | |
| "startLineNumber": 193, | |
| "startColumn": 52, | |
| "endLineNumber": 193, | |
| "endColumn": 63 | |
| },{ | |
| "message": "Type 'boolean | undefined' is not assignable to type 'boolean'.\n Type 'undefined' is not assignable to type 'boolean'.", | |
| "startLineNumber": 211, | |
| "startColumn": 5, |