Ory is the largest open source community in the world for cloud software application security. We maintain advanced open source security software solving authentication, authorization, access control, application network security, and delegation. Ory implements a variety of industry and best-practice standards including OAuth 2.0 / OAuth 2.1, OpenID Connect, Zero Trust Networking, Google Zanzibar Policy Framework, FIDO2 U2F, WebAuthn, TOTP, and more.

Ory Community

Hello Ory team and Community. I've got a question about Ory Elements and custom UI.

I'm trying to do something quite simple and I'd rather not do this in a "hacky" way. I want the login form to render inputs with no labels on them. With the code below I have successfully overridden the header but overriding the Label is causing my form inputs to completely disappear. Any idea why this is happening?

`const myOverrides = {`
  `Card: {`
    `Header: MyCustomHeader,` _`// Override the card header component &lt;- this works`_
  `},`
  `Node: {`
    `Label: () =&gt; null, _// Override labels with our test component &lt;- this doesn't work_`
  `},`
`}`

`export function LoginWithCustomComponents({`
  `_flow_,`
  `_config_,`
}: {
  `flow,`
  `config`
`}) {`
  `return &lt;Login flow={_flow_} config={_config_} components={myOverrides} /&gt;`
}