From 476119ea0f2c6c0faa115a5dfe9c3b6c4e7685a2 Mon Sep 17 00:00:00 2001 From: Jonas Hungershausen Date: Mon, 24 Nov 2025 10:43:31 -0500 Subject: [PATCH 1/4] feat: add docs for ory elements v1.2 --- .../{05_migration_0x.mdx => 05_upgrading.mdx} | 35 ++++- .../functions/OryCardValidationMessages.md | 8 +- .../functions/OrySettingsFormSection.md | 32 ++--- .../functions/isUiNodeAnchor.md | 15 ++ .../elements-react/functions/isUiNodeDiv.md | 15 ++ .../elements-react/functions/isUiNodeImage.md | 15 ++ .../elements-react/functions/isUiNodeInput.md | 15 ++ .../functions/isUiNodeScript.md | 15 ++ .../elements-react/functions/isUiNodeText.md | 15 ++ .../functions/resolvePlaceholder.md | 16 +++ .../elements-react/functions/useResendCode.md | 42 ++++++ .../elements-react/{index.mdx => index.md} | 37 +++-- .../theme/functions/DefaultButtonSocial.md | 24 ++-- .../theme/functions/DefaultCard.md | 13 +- .../theme/functions/Settings.md | 24 ++-- .../theme/{index.mdx => index.md} | 12 -- .../elements-react/type-aliases/NodeProps.md | 15 ++ .../OryCardAuthMethodListItemProps.md | 9 ++ .../type-aliases/OryFlowComponents.md | 6 +- .../type-aliases/OryNodeButtonButtonProps.md | 61 +++++++++ .../type-aliases/OryNodeButtonProps.md | 48 +++++-- .../type-aliases/OryNodeCheckboxInputProps.md | 89 ++++++++++++ .../type-aliases/OryNodeCheckboxProps.md | 50 +++++++ .../OryNodeConsentScopeCheckboxProps.md | 26 ++++ .../type-aliases/OryNodeImageProps.md | 10 +- .../type-aliases/OryNodeInputInputProps.md | 129 ++++++++++++++++++ .../type-aliases/OryNodeInputProps.md | 25 +++- .../type-aliases/OryNodeLabelProps.md | 14 +- .../type-aliases/OryNodeSettingsButton.md | 17 +++ .../type-aliases/OryNodeSsoButtonProps.md | 36 +++-- .../type-aliases/OryNodeTextProps.md | 10 +- .../type-aliases/OrySettingsPasskeyProps.md | 32 ++--- .../OrySettingsRecoveryCodesProps.md | 19 ++- .../type-aliases/OrySettingsSsoProps.md | 27 ++-- .../type-aliases/OrySettingsTotpProps.md | 25 ++-- .../type-aliases/OrySettingsWebauthnProps.md | 36 ++--- .../type-aliases/UiNodeAnchor.md | 15 ++ .../elements-react/type-aliases/UiNodeDiv.md | 15 ++ .../type-aliases/UiNodeFixed.md | 5 + .../type-aliases/UiNodeImage.md | 15 ++ .../type-aliases/UiNodeInput.md | 15 ++ .../type-aliases/UiNodeScript.md | 15 ++ .../elements-react/type-aliases/UiNodeText.md | 15 ++ .../@ory/elements-react/variables/Node.md | 39 ++++++ .../@ory/nextjs/app/{index.mdx => index.md} | 12 -- .../reference/@ory/nextjs/middleware/index.md | 5 + .../@ory/nextjs/middleware/index.mdx | 17 --- .../@ory/nextjs/pages/{index.mdx => index.md} | 12 -- docs/elements/reference/index.md | 9 ++ docs/elements/reference/typedoc-sidebar.ts | 116 ++++++++++++++++ src/sidebar.ts | 7 +- 51 files changed, 1104 insertions(+), 225 deletions(-) rename docs/elements/guides/{05_migration_0x.mdx => 05_upgrading.mdx} (72%) create mode 100644 docs/elements/reference/@ory/elements-react/functions/isUiNodeAnchor.md create mode 100644 docs/elements/reference/@ory/elements-react/functions/isUiNodeDiv.md create mode 100644 docs/elements/reference/@ory/elements-react/functions/isUiNodeImage.md create mode 100644 docs/elements/reference/@ory/elements-react/functions/isUiNodeInput.md create mode 100644 docs/elements/reference/@ory/elements-react/functions/isUiNodeScript.md create mode 100644 docs/elements/reference/@ory/elements-react/functions/isUiNodeText.md create mode 100644 docs/elements/reference/@ory/elements-react/functions/resolvePlaceholder.md create mode 100644 docs/elements/reference/@ory/elements-react/functions/useResendCode.md rename docs/elements/reference/@ory/elements-react/{index.mdx => index.md} (80%) rename docs/elements/reference/@ory/elements-react/theme/{index.mdx => index.md} (81%) create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/NodeProps.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/OryNodeButtonButtonProps.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxInputProps.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxProps.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/OryNodeInputInputProps.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/OryNodeSettingsButton.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/UiNodeAnchor.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/UiNodeDiv.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/UiNodeFixed.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/UiNodeImage.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/UiNodeInput.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/UiNodeScript.md create mode 100644 docs/elements/reference/@ory/elements-react/type-aliases/UiNodeText.md create mode 100644 docs/elements/reference/@ory/elements-react/variables/Node.md rename docs/elements/reference/@ory/nextjs/app/{index.mdx => index.md} (70%) create mode 100644 docs/elements/reference/@ory/nextjs/middleware/index.md delete mode 100644 docs/elements/reference/@ory/nextjs/middleware/index.mdx rename docs/elements/reference/@ory/nextjs/pages/{index.mdx => index.md} (60%) create mode 100644 docs/elements/reference/index.md diff --git a/docs/elements/guides/05_migration_0x.mdx b/docs/elements/guides/05_upgrading.mdx similarity index 72% rename from docs/elements/guides/05_migration_0x.mdx rename to docs/elements/guides/05_upgrading.mdx index 42fba28ad..30b3f7350 100644 --- a/docs/elements/guides/05_migration_0x.mdx +++ b/docs/elements/guides/05_upgrading.mdx @@ -1,9 +1,38 @@ --- -id: migration-0x -title: Migration from Ory Elements 0.x to 1.x -sidebar_label: Migration from 0.x to 1.x +id: upgrade +title: Upgrading Ory Elements +sidebar_label: Upgrading --- +# Ory Elements 1.1.0 to 1.2.0 Upgrade Guide + +This guide will show you how to migrate from Ory Elements 1.1.0 to 1.2.0. + +If you are current overriding components using the `components` prop, you may need to update your overrides to pass the correct +props to your custom components. + +- `Node.Button`: Now receives additional props: + - `isSubmitting`: This prop indicates whether this button was used to submit the form and the form is currently submitting. + - `buttonProps`: This prop contains all other button-related props that should be spread onto the button element. +- `Node.Input`: Now receives additional props: + - `inputProps`: This prop contains all other input-related props that should be spread onto the input element. +- `Node.Checkbox`: + - `inputProps`: This prop contains all other checkbox-related props that should be spread onto the checkbox input element. +- `Node.ConsentScopeCheckbox`: + - `inputProps`: This prop contains all other checkbox-related props that should be spread onto the checkbox input element. +- `Node.Label`: + - `fieldError`: This prop contains the error message associated with the field, if any. +- Settings Pages: + - Each settings section now similarly receives the nodes with a `buttonProps` or `inputProps` prop, depending on the type of + node. + +## Fixes + +- If you were using the `RecoveryCodesSettings` component, there was a typo in the prop name for regenerating codes. The correct + prop name is now `regenerateButton` instead of `regnerateButton`. + +# Ory Elements 0.x to 1.x Upgrade Guide + This guide will show you how to migrate from Ory Elements 0.x to 1.x. Ory Elements 1.0 is a complete rewrite of the Ory Elements 0.x library. It is not backwards compatible with 0.x. diff --git a/docs/elements/reference/@ory/elements-react/functions/OryCardValidationMessages.md b/docs/elements/reference/@ory/elements-react/functions/OryCardValidationMessages.md index ede14af13..e6d1636a5 100644 --- a/docs/elements/reference/@ory/elements-react/functions/OryCardValidationMessages.md +++ b/docs/elements/reference/@ory/elements-react/functions/OryCardValidationMessages.md @@ -11,10 +11,10 @@ See also [useOryFlow](useOryFlow.md) ## Parameters -| Parameter | Type | Description | -| ------------------------------------- | -------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| `__namedParameters` | \{ `hiddenMessageIds?`: `number`[]; \} | - | -| `__namedParameters.hiddenMessageIds?` | `number`[] | An array of message IDs that should be hidden. This is useful for hiding specific messages that are not relevant to the user or are rendered elsewhere. If not provided, the default list of message IDs to hide will be used. **Default** `[1040009, 1060003, 1080003, 1010004, 1010014, 1040005, 1010016, 1010003]` **See** https://www.ory.com/docs/kratos/concepts/ui-messages | +| Parameter | Type | Description | +| ------------------------------------- | -------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| `__namedParameters` | \{ `hiddenMessageIds?`: `number`[]; \} | - | +| `__namedParameters.hiddenMessageIds?` | `number`[] | An array of message IDs that should be hidden. This is useful for hiding specific messages that are not relevant to the user or are rendered elsewhere. If not provided, the default list of message IDs to hide will be used. **Default** `[1040009, 1060003, 1080003, 1010004, 1010014, 1040005, 1010016, 1010003]` **See** https://www.ory.sh/docs/kratos/concepts/ui-messages | ## Returns diff --git a/docs/elements/reference/@ory/elements-react/functions/OrySettingsFormSection.md b/docs/elements/reference/@ory/elements-react/functions/OrySettingsFormSection.md index 914d10bdf..f6e51f4ba 100644 --- a/docs/elements/reference/@ory/elements-react/functions/OrySettingsFormSection.md +++ b/docs/elements/reference/@ory/elements-react/functions/OrySettingsFormSection.md @@ -7,7 +7,7 @@ function OrySettingsFormSection(props: { accessKey?: string; aria-activedescendant?: string; aria-atomic?: Booleanish; - aria-autocomplete?: "inline" | "list" | "none" | "both"; + aria-autocomplete?: "none" | "inline" | "list" | "both"; aria-braillelabel?: string; aria-brailleroledescription?: string; aria-busy?: Booleanish; @@ -17,23 +17,23 @@ function OrySettingsFormSection(props: { aria-colindextext?: string; aria-colspan?: number; aria-controls?: string; - aria-current?: boolean | "true" | "false" | "time" | "date" | "page" | "step" | "location"; + aria-current?: boolean | "time" | "date" | "true" | "false" | "page" | "step" | "location"; aria-describedby?: string; aria-description?: string; aria-details?: string; aria-disabled?: Booleanish; - aria-dropeffect?: "copy" | "link" | "none" | "execute" | "move" | "popup"; + aria-dropeffect?: "none" | "copy" | "link" | "execute" | "move" | "popup"; aria-errormessage?: string; aria-expanded?: Booleanish; aria-flowto?: string; aria-grabbed?: Booleanish; aria-haspopup?: | boolean + | "dialog" + | "menu" | "true" | "false" - | "dialog" | "grid" | "listbox" - | "menu" | "tree"; aria-hidden?: Booleanish; aria-invalid?: boolean | "true" | "false" | "grammar" | "spelling"; @@ -74,9 +74,9 @@ function OrySettingsFormSection(props: { aria-valuemin?: number; aria-valuenow?: number; aria-valuetext?: string; - autoCapitalize?: | string & { + autoCapitalize?: | "none" + | string & { } - | "none" | "off" | "on" | "sentences" @@ -106,9 +106,9 @@ function OrySettingsFormSection(props: { hidden?: boolean; id?: string; inlist?: any; - inputMode?: | "text" + inputMode?: | "none" + | "text" | "search" - | "none" | "email" | "tel" | "url" @@ -316,13 +316,13 @@ Can be used independently to render a form section with Ory nodes. | Parameter | Type | Description | | --------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| `props` | \{ `about?`: `string`; `acceptCharset?`: `string`; `accessKey?`: `string`; `aria-activedescendant?`: `string`; `aria-atomic?`: `Booleanish`; `aria-autocomplete?`: `"inline"` \| `"list"` \| `"none"` \| `"both"`; `aria-braillelabel?`: `string`; `aria-brailleroledescription?`: `string`; `aria-busy?`: `Booleanish`; `aria-checked?`: `boolean` \| `"true"` \| `"false"` \| `"mixed"`; `aria-colcount?`: `number`; `aria-colindex?`: `number`; `aria-colindextext?`: `string`; `aria-colspan?`: `number`; `aria-controls?`: `string`; `aria-current?`: `boolean` \| `"true"` \| `"false"` \| `"time"` \| `"date"` \| `"page"` \| `"step"` \| `"location"`; `aria-describedby?`: `string`; `aria-description?`: `string`; `aria-details?`: `string`; `aria-disabled?`: `Booleanish`; `aria-dropeffect?`: `"copy"` \| `"link"` \| `"none"` \| `"execute"` \| `"move"` \| `"popup"`; `aria-errormessage?`: `string`; `aria-expanded?`: `Booleanish`; `aria-flowto?`: `string`; `aria-grabbed?`: `Booleanish`; `aria-haspopup?`: \| `boolean` \| `"true"` \| `"false"` \| `"dialog"` \| `"grid"` \| `"listbox"` \| `"menu"` \| `"tree"`; `aria-hidden?`: `Booleanish`; `aria-invalid?`: `boolean` \| `"true"` \| `"false"` \| `"grammar"` \| `"spelling"`; `aria-keyshortcuts?`: `string`; `aria-label?`: `string`; `aria-labelledby?`: `string`; `aria-level?`: `number`; `aria-live?`: `"off"` \| `"assertive"` \| `"polite"`; `aria-modal?`: `Booleanish`; `aria-multiline?`: `Booleanish`; `aria-multiselectable?`: `Booleanish`; `aria-orientation?`: `"horizontal"` \| `"vertical"`; `aria-owns?`: `string`; `aria-placeholder?`: `string`; `aria-posinset?`: `number`; `aria-pressed?`: `boolean` \| `"true"` \| `"false"` \| `"mixed"`; `aria-readonly?`: `Booleanish`; `aria-relevant?`: \| `"text"` \| `"all"` \| `"additions"` \| `"additions removals"` \| `"additions text"` \| `"removals"` \| `"removals additions"` \| `"removals text"` \| `"text additions"` \| `"text removals"`; `aria-required?`: `Booleanish`; `aria-roledescription?`: `string`; `aria-rowcount?`: `number`; `aria-rowindex?`: `number`; `aria-rowindextext?`: `string`; `aria-rowspan?`: `number`; `aria-selected?`: `Booleanish`; `aria-setsize?`: `number`; `aria-sort?`: `"none"` \| `"other"` \| `"ascending"` \| `"descending"`; `aria-valuemax?`: `number`; `aria-valuemin?`: `number`; `aria-valuenow?`: `number`; `aria-valuetext?`: `string`; `autoCapitalize?`: \| `string` & \{ \} \| `"none"` \| `"off"` \| `"on"` \| `"sentences"` \| `"words"` \| `"characters"`; `autoComplete?`: `string`; `autoCorrect?`: `string`; `autoFocus?`: `boolean`; `autoSave?`: `string`; `children?`: `ReactNode`; `className?`: `string`; `color?`: `string`; `content?`: `string`; `contentEditable?`: `Booleanish` \| `"inherit"` \| `"plaintext-only"`; `contextMenu?`: `string`; `dangerouslySetInnerHTML?`: \{ `__html`: `string` \| `TrustedHTML`; \}; `datatype?`: `string`; `defaultChecked?`: `boolean`; `defaultValue?`: `string` \| `number` \| readonly `string`[]; `dir?`: `string`; `draggable?`: `Booleanish`; `encType?`: `string`; `enterKeyHint?`: `"search"` \| `"previous"` \| `"enter"` \| `"done"` \| `"go"` \| `"next"` \| `"send"`; `exportparts?`: `string`; `hidden?`: `boolean`; `id?`: `string`; `inlist?`: `any`; `inputMode?`: \| `"text"` \| `"search"` \| `"none"` \| `"email"` \| `"tel"` \| `"url"` \| `"numeric"` \| `"decimal"`; `is?`: `string`; `itemID?`: `string`; `itemProp?`: `string`; `itemRef?`: `string`; `itemScope?`: `boolean`; `itemType?`: `string`; `key?`: `null` \| `Key`; `lang?`: `string`; `name?`: `string`; `nodes?`: `UiNode`[]; `nonce?`: `string`; `noValidate?`: `boolean`; `onAbort?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onAbortCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onAnimationEnd?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationEndCapture?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationIteration?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationIterationCapture?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationStart?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationStartCapture?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAuxClick?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onAuxClickCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onBeforeInput?`: `FormEventHandler`\<`HTMLFormElement`\>; `onBeforeInputCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onBlur?`: `FocusEventHandler`\<`HTMLFormElement`\>; `onBlurCapture?`: `FocusEventHandler`\<`HTMLFormElement`\>; `onCanPlay?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onCanPlayCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onCanPlayThrough?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onCanPlayThroughCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onChange?`: `FormEventHandler`\<`HTMLFormElement`\>; `onChangeCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onClick?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onClickCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onCompositionEnd?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionEndCapture?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionStart?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionStartCapture?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionUpdate?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionUpdateCapture?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onContextMenu?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onContextMenuCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onCopy?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onCopyCapture?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onCut?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onCutCapture?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onDoubleClick?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onDoubleClickCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onDrag?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragEnd?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragEndCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragEnter?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragEnterCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragExit?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragExitCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragLeave?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragLeaveCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragOver?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragOverCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragStart?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragStartCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDrop?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDropCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDurationChange?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onDurationChangeCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEmptied?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEmptiedCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEncrypted?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEncryptedCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEnded?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEndedCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onError?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onErrorCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onFocus?`: `FocusEventHandler`\<`HTMLFormElement`\>; `onFocusCapture?`: `FocusEventHandler`\<`HTMLFormElement`\>; `onGotPointerCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onGotPointerCaptureCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onInput?`: `FormEventHandler`\<`HTMLFormElement`\>; `onInputCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onInvalid?`: `FormEventHandler`\<`HTMLFormElement`\>; `onInvalidCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onKeyDown?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyDownCapture?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyPress?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyPressCapture?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyUp?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyUpCapture?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onLoad?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadedData?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadedDataCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadedMetadata?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadedMetadataCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadStart?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadStartCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLostPointerCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onLostPointerCaptureCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onMouseDown?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseDownCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseEnter?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseLeave?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseMove?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseMoveCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseOut?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseOutCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseOver?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseOverCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseUp?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseUpCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onPaste?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onPasteCapture?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onPause?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPauseCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPlay?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPlayCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPlaying?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPlayingCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPointerCancel?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerCancelCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerDown?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerDownCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerEnter?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerLeave?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerMove?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerMoveCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerOut?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerOutCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerOver?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerOverCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerUp?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerUpCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onProgress?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onProgressCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onRateChange?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onRateChangeCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onReset?`: `FormEventHandler`\<`HTMLFormElement`\>; `onResetCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onScroll?`: `UIEventHandler`\<`HTMLFormElement`\>; `onScrollCapture?`: `UIEventHandler`\<`HTMLFormElement`\>; `onSeeked?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSeekedCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSeeking?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSeekingCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSelect?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSelectCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onStalled?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onStalledCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSubmitCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onSuspend?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSuspendCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onTimeUpdate?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onTimeUpdateCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onTouchCancel?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchCancelCapture?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchEnd?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchEndCapture?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchMove?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchMoveCapture?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchStart?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchStartCapture?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTransitionEnd?`: `TransitionEventHandler`\<`HTMLFormElement`\>; `onTransitionEndCapture?`: `TransitionEventHandler`\<`HTMLFormElement`\>; `onVolumeChange?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onVolumeChangeCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onWaiting?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onWaitingCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onWheel?`: `WheelEventHandler`\<`HTMLFormElement`\>; `onWheelCapture?`: `WheelEventHandler`\<`HTMLFormElement`\>; `part?`: `string`; `prefix?`: `string`; `property?`: `string`; `radioGroup?`: `string`; `rel?`: `string`; `resource?`: `string`; `results?`: `number`; `rev?`: `string`; `role?`: `AriaRole`; `security?`: `string`; `slot?`: `string`; `spellCheck?`: `Booleanish`; `style?`: `CSSProperties`; `suppressContentEditableWarning?`: `boolean`; `suppressHydrationWarning?`: `boolean`; `tabIndex?`: `number`; `target?`: `string`; `title?`: `string`; `translate?`: `"no"` \| `"yes"`; `typeof?`: `string`; `unselectable?`: `"off"` \| `"on"`; `vocab?`: `string`; \} | The properties for the OrySettingsFormSection component. | +| `props` | \{ `about?`: `string`; `acceptCharset?`: `string`; `accessKey?`: `string`; `aria-activedescendant?`: `string`; `aria-atomic?`: `Booleanish`; `aria-autocomplete?`: `"none"` \| `"inline"` \| `"list"` \| `"both"`; `aria-braillelabel?`: `string`; `aria-brailleroledescription?`: `string`; `aria-busy?`: `Booleanish`; `aria-checked?`: `boolean` \| `"true"` \| `"false"` \| `"mixed"`; `aria-colcount?`: `number`; `aria-colindex?`: `number`; `aria-colindextext?`: `string`; `aria-colspan?`: `number`; `aria-controls?`: `string`; `aria-current?`: `boolean` \| `"time"` \| `"date"` \| `"true"` \| `"false"` \| `"page"` \| `"step"` \| `"location"`; `aria-describedby?`: `string`; `aria-description?`: `string`; `aria-details?`: `string`; `aria-disabled?`: `Booleanish`; `aria-dropeffect?`: `"none"` \| `"copy"` \| `"link"` \| `"execute"` \| `"move"` \| `"popup"`; `aria-errormessage?`: `string`; `aria-expanded?`: `Booleanish`; `aria-flowto?`: `string`; `aria-grabbed?`: `Booleanish`; `aria-haspopup?`: \| `boolean` \| `"dialog"` \| `"menu"` \| `"true"` \| `"false"` \| `"grid"` \| `"listbox"` \| `"tree"`; `aria-hidden?`: `Booleanish`; `aria-invalid?`: `boolean` \| `"true"` \| `"false"` \| `"grammar"` \| `"spelling"`; `aria-keyshortcuts?`: `string`; `aria-label?`: `string`; `aria-labelledby?`: `string`; `aria-level?`: `number`; `aria-live?`: `"off"` \| `"assertive"` \| `"polite"`; `aria-modal?`: `Booleanish`; `aria-multiline?`: `Booleanish`; `aria-multiselectable?`: `Booleanish`; `aria-orientation?`: `"horizontal"` \| `"vertical"`; `aria-owns?`: `string`; `aria-placeholder?`: `string`; `aria-posinset?`: `number`; `aria-pressed?`: `boolean` \| `"true"` \| `"false"` \| `"mixed"`; `aria-readonly?`: `Booleanish`; `aria-relevant?`: \| `"text"` \| `"all"` \| `"additions"` \| `"additions removals"` \| `"additions text"` \| `"removals"` \| `"removals additions"` \| `"removals text"` \| `"text additions"` \| `"text removals"`; `aria-required?`: `Booleanish`; `aria-roledescription?`: `string`; `aria-rowcount?`: `number`; `aria-rowindex?`: `number`; `aria-rowindextext?`: `string`; `aria-rowspan?`: `number`; `aria-selected?`: `Booleanish`; `aria-setsize?`: `number`; `aria-sort?`: `"none"` \| `"other"` \| `"ascending"` \| `"descending"`; `aria-valuemax?`: `number`; `aria-valuemin?`: `number`; `aria-valuenow?`: `number`; `aria-valuetext?`: `string`; `autoCapitalize?`: \| `"none"` \| `string` & \{ \} \| `"off"` \| `"on"` \| `"sentences"` \| `"words"` \| `"characters"`; `autoComplete?`: `string`; `autoCorrect?`: `string`; `autoFocus?`: `boolean`; `autoSave?`: `string`; `children?`: `ReactNode`; `className?`: `string`; `color?`: `string`; `content?`: `string`; `contentEditable?`: `Booleanish` \| `"inherit"` \| `"plaintext-only"`; `contextMenu?`: `string`; `dangerouslySetInnerHTML?`: \{ `__html`: `string` \| `TrustedHTML`; \}; `datatype?`: `string`; `defaultChecked?`: `boolean`; `defaultValue?`: `string` \| `number` \| readonly `string`[]; `dir?`: `string`; `draggable?`: `Booleanish`; `encType?`: `string`; `enterKeyHint?`: `"search"` \| `"previous"` \| `"enter"` \| `"done"` \| `"go"` \| `"next"` \| `"send"`; `exportparts?`: `string`; `hidden?`: `boolean`; `id?`: `string`; `inlist?`: `any`; `inputMode?`: \| `"none"` \| `"text"` \| `"search"` \| `"email"` \| `"tel"` \| `"url"` \| `"numeric"` \| `"decimal"`; `is?`: `string`; `itemID?`: `string`; `itemProp?`: `string`; `itemRef?`: `string`; `itemScope?`: `boolean`; `itemType?`: `string`; `key?`: `null` \| `Key`; `lang?`: `string`; `name?`: `string`; `nodes?`: `UiNode`[]; `nonce?`: `string`; `noValidate?`: `boolean`; `onAbort?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onAbortCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onAnimationEnd?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationEndCapture?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationIteration?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationIterationCapture?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationStart?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAnimationStartCapture?`: `AnimationEventHandler`\<`HTMLFormElement`\>; `onAuxClick?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onAuxClickCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onBeforeInput?`: `FormEventHandler`\<`HTMLFormElement`\>; `onBeforeInputCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onBlur?`: `FocusEventHandler`\<`HTMLFormElement`\>; `onBlurCapture?`: `FocusEventHandler`\<`HTMLFormElement`\>; `onCanPlay?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onCanPlayCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onCanPlayThrough?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onCanPlayThroughCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onChange?`: `FormEventHandler`\<`HTMLFormElement`\>; `onChangeCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onClick?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onClickCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onCompositionEnd?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionEndCapture?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionStart?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionStartCapture?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionUpdate?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onCompositionUpdateCapture?`: `CompositionEventHandler`\<`HTMLFormElement`\>; `onContextMenu?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onContextMenuCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onCopy?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onCopyCapture?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onCut?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onCutCapture?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onDoubleClick?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onDoubleClickCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onDrag?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragEnd?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragEndCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragEnter?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragEnterCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragExit?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragExitCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragLeave?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragLeaveCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragOver?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragOverCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragStart?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDragStartCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDrop?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDropCapture?`: `DragEventHandler`\<`HTMLFormElement`\>; `onDurationChange?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onDurationChangeCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEmptied?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEmptiedCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEncrypted?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEncryptedCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEnded?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onEndedCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onError?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onErrorCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onFocus?`: `FocusEventHandler`\<`HTMLFormElement`\>; `onFocusCapture?`: `FocusEventHandler`\<`HTMLFormElement`\>; `onGotPointerCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onGotPointerCaptureCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onInput?`: `FormEventHandler`\<`HTMLFormElement`\>; `onInputCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onInvalid?`: `FormEventHandler`\<`HTMLFormElement`\>; `onInvalidCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onKeyDown?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyDownCapture?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyPress?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyPressCapture?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyUp?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onKeyUpCapture?`: `KeyboardEventHandler`\<`HTMLFormElement`\>; `onLoad?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadedData?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadedDataCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadedMetadata?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadedMetadataCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadStart?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLoadStartCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onLostPointerCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onLostPointerCaptureCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onMouseDown?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseDownCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseEnter?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseLeave?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseMove?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseMoveCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseOut?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseOutCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseOver?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseOverCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseUp?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onMouseUpCapture?`: `MouseEventHandler`\<`HTMLFormElement`\>; `onPaste?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onPasteCapture?`: `ClipboardEventHandler`\<`HTMLFormElement`\>; `onPause?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPauseCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPlay?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPlayCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPlaying?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPlayingCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onPointerCancel?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerCancelCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerDown?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerDownCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerEnter?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerLeave?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerMove?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerMoveCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerOut?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerOutCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerOver?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerOverCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerUp?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onPointerUpCapture?`: `PointerEventHandler`\<`HTMLFormElement`\>; `onProgress?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onProgressCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onRateChange?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onRateChangeCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onReset?`: `FormEventHandler`\<`HTMLFormElement`\>; `onResetCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onScroll?`: `UIEventHandler`\<`HTMLFormElement`\>; `onScrollCapture?`: `UIEventHandler`\<`HTMLFormElement`\>; `onSeeked?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSeekedCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSeeking?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSeekingCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSelect?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSelectCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onStalled?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onStalledCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSubmitCapture?`: `FormEventHandler`\<`HTMLFormElement`\>; `onSuspend?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onSuspendCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onTimeUpdate?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onTimeUpdateCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onTouchCancel?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchCancelCapture?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchEnd?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchEndCapture?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchMove?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchMoveCapture?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchStart?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTouchStartCapture?`: `TouchEventHandler`\<`HTMLFormElement`\>; `onTransitionEnd?`: `TransitionEventHandler`\<`HTMLFormElement`\>; `onTransitionEndCapture?`: `TransitionEventHandler`\<`HTMLFormElement`\>; `onVolumeChange?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onVolumeChangeCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onWaiting?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onWaitingCapture?`: `ReactEventHandler`\<`HTMLFormElement`\>; `onWheel?`: `WheelEventHandler`\<`HTMLFormElement`\>; `onWheelCapture?`: `WheelEventHandler`\<`HTMLFormElement`\>; `part?`: `string`; `prefix?`: `string`; `property?`: `string`; `radioGroup?`: `string`; `rel?`: `string`; `resource?`: `string`; `results?`: `number`; `rev?`: `string`; `role?`: `AriaRole`; `security?`: `string`; `slot?`: `string`; `spellCheck?`: `Booleanish`; `style?`: `CSSProperties`; `suppressContentEditableWarning?`: `boolean`; `suppressHydrationWarning?`: `boolean`; `tabIndex?`: `number`; `target?`: `string`; `title?`: `string`; `translate?`: `"no"` \| `"yes"`; `typeof?`: `string`; `unselectable?`: `"off"` \| `"on"`; `vocab?`: `string`; \} | The properties for the OrySettingsFormSection component. | | `props.about?` | `string` | - | | `props.acceptCharset?` | `string` | - | | `props.accessKey?` | `string` | - | | `props.aria-activedescendant?` | `string` | Identifies the currently active element when DOM focus is on a composite widget, textbox, group, or application. | | `props.aria-atomic?` | `Booleanish` | Indicates whether assistive technologies will present all, or only parts of, the changed region based on the change notifications defined by the aria-relevant attribute. | -| `props.aria-autocomplete?` | `"inline"` \| `"list"` \| `"none"` \| `"both"` | Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made. | +| `props.aria-autocomplete?` | `"none"` \| `"inline"` \| `"list"` \| `"both"` | Indicates whether inputting text could trigger display of one or more predictions of the user's intended value for an input and specifies how predictions would be presented if they are made. | | `props.aria-braillelabel?` | `string` | Defines a string value that labels the current element, which is intended to be converted into Braille. **See** aria-label. | | `props.aria-brailleroledescription?` | `string` | Defines a human-readable, author-localized abbreviated description for the role of an element, which is intended to be converted into Braille. **See** aria-roledescription. | | `props.aria-busy?` | `Booleanish` | - | @@ -332,17 +332,17 @@ Can be used independently to render a form section with Ory nodes. | `props.aria-colindextext?` | `string` | Defines a human readable text alternative of aria-colindex. **See** aria-rowindextext. | | `props.aria-colspan?` | `number` | Defines the number of columns spanned by a cell or gridcell within a table, grid, or treegrid. **See** - aria-colindex - aria-rowspan. | | `props.aria-controls?` | `string` | Identifies the element (or elements) whose contents or presence are controlled by the current element. **See** aria-owns. | -| `props.aria-current?` | `boolean` \| `"true"` \| `"false"` \| `"time"` \| `"date"` \| `"page"` \| `"step"` \| `"location"` | Indicates the element that represents the current item within a container or set of related elements. | +| `props.aria-current?` | `boolean` \| `"time"` \| `"date"` \| `"true"` \| `"false"` \| `"page"` \| `"step"` \| `"location"` | Indicates the element that represents the current item within a container or set of related elements. | | `props.aria-describedby?` | `string` | Identifies the element (or elements) that describes the object. **See** aria-labelledby | | `props.aria-description?` | `string` | Defines a string value that describes or annotates the current element. **See** related aria-describedby. | | `props.aria-details?` | `string` | Identifies the element that provides a detailed, extended description for the object. **See** aria-describedby. | | `props.aria-disabled?` | `Booleanish` | Indicates that the element is perceivable but disabled, so it is not editable or otherwise operable. **See** - aria-hidden - aria-readonly. | -| `props.aria-dropeffect?` | `"copy"` \| `"link"` \| `"none"` \| `"execute"` \| `"move"` \| `"popup"` | Indicates what functions can be performed when a dragged object is released on the drop target. **Deprecated** in ARIA 1.1 | +| `props.aria-dropeffect?` | `"none"` \| `"copy"` \| `"link"` \| `"execute"` \| `"move"` \| `"popup"` | Indicates what functions can be performed when a dragged object is released on the drop target. **Deprecated** in ARIA 1.1 | | `props.aria-errormessage?` | `string` | Identifies the element that provides an error message for the object. **See** - aria-invalid - aria-describedby. | | `props.aria-expanded?` | `Booleanish` | Indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. | | `props.aria-flowto?` | `string` | Identifies the next element (or elements) in an alternate reading order of content which, at the user's discretion, allows assistive technology to override the general default of reading in document source order. | | `props.aria-grabbed?` | `Booleanish` | Indicates an element's "grabbed" state in a drag-and-drop operation. **Deprecated** in ARIA 1.1 | -| `props.aria-haspopup?` | \| `boolean` \| `"true"` \| `"false"` \| `"dialog"` \| `"grid"` \| `"listbox"` \| `"menu"` \| `"tree"` | Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. | +| `props.aria-haspopup?` | \| `boolean` \| `"dialog"` \| `"menu"` \| `"true"` \| `"false"` \| `"grid"` \| `"listbox"` \| `"tree"` | Indicates the availability and type of interactive popup element, such as menu or dialog, that can be triggered by an element. | | `props.aria-hidden?` | `Booleanish` | Indicates whether the element is exposed to an accessibility API. **See** aria-disabled. | | `props.aria-invalid?` | `boolean` \| `"true"` \| `"false"` \| `"grammar"` \| `"spelling"` | Indicates the entered value does not conform to the format expected by the application. **See** aria-errormessage. | | `props.aria-keyshortcuts?` | `string` | Indicates keyboard shortcuts that an author has implemented to activate or give focus to an element. | @@ -373,7 +373,7 @@ Can be used independently to render a form section with Ory nodes. | `props.aria-valuemin?` | `number` | Defines the minimum allowed value for a range widget. | | `props.aria-valuenow?` | `number` | Defines the current value for a range widget. **See** aria-valuetext. | | `props.aria-valuetext?` | `string` | Defines the human readable text alternative of aria-valuenow for a range widget. | -| `props.autoCapitalize?` | \| `string` & \{ \} \| `"none"` \| `"off"` \| `"on"` \| `"sentences"` \| `"words"` \| `"characters"` | - | +| `props.autoCapitalize?` | \| `"none"` \| `string` & \{ \} \| `"off"` \| `"on"` \| `"sentences"` \| `"words"` \| `"characters"` | - | | `props.autoComplete?` | `string` | - | | `props.autoCorrect?` | `string` | - | | `props.autoFocus?` | `boolean` | - | @@ -397,7 +397,7 @@ Can be used independently to render a form section with Ory nodes. | `props.hidden?` | `boolean` | - | | `props.id?` | `string` | - | | `props.inlist?` | `any` | - | -| `props.inputMode?` | \| `"text"` \| `"search"` \| `"none"` \| `"email"` \| `"tel"` \| `"url"` \| `"numeric"` \| `"decimal"` | Hints at the type of data that might be entered by the user while editing the element or its contents **See** [https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute) | +| `props.inputMode?` | \| `"none"` \| `"text"` \| `"search"` \| `"email"` \| `"tel"` \| `"url"` \| `"numeric"` \| `"decimal"` | Hints at the type of data that might be entered by the user while editing the element or its contents **See** [https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute](https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute) | | `props.is?` | `string` | Specify that a standard HTML element should behave like a defined custom built-in element **See** [https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is](https://html.spec.whatwg.org/multipage/custom-elements.html#attr-is) | | `props.itemID?` | `string` | - | | `props.itemProp?` | `string` | - | diff --git a/docs/elements/reference/@ory/elements-react/functions/isUiNodeAnchor.md b/docs/elements/reference/@ory/elements-react/functions/isUiNodeAnchor.md new file mode 100644 index 000000000..075b02083 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/functions/isUiNodeAnchor.md @@ -0,0 +1,15 @@ +# isUiNodeAnchor() + +```ts +function isUiNodeAnchor(node: UiNode): node is UiNodeAnchor +``` + +## Parameters + +| Parameter | Type | +| --------- | -------- | +| `node` | `UiNode` | + +## Returns + +`node is UiNodeAnchor` diff --git a/docs/elements/reference/@ory/elements-react/functions/isUiNodeDiv.md b/docs/elements/reference/@ory/elements-react/functions/isUiNodeDiv.md new file mode 100644 index 000000000..eab88e5b7 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/functions/isUiNodeDiv.md @@ -0,0 +1,15 @@ +# isUiNodeDiv() + +```ts +function isUiNodeDiv(node: UiNode): node is UiNodeDiv +``` + +## Parameters + +| Parameter | Type | +| --------- | -------- | +| `node` | `UiNode` | + +## Returns + +`node is UiNodeDiv` diff --git a/docs/elements/reference/@ory/elements-react/functions/isUiNodeImage.md b/docs/elements/reference/@ory/elements-react/functions/isUiNodeImage.md new file mode 100644 index 000000000..b640da48d --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/functions/isUiNodeImage.md @@ -0,0 +1,15 @@ +# isUiNodeImage() + +```ts +function isUiNodeImage(node: UiNode): node is UiNodeImage +``` + +## Parameters + +| Parameter | Type | +| --------- | -------- | +| `node` | `UiNode` | + +## Returns + +`node is UiNodeImage` diff --git a/docs/elements/reference/@ory/elements-react/functions/isUiNodeInput.md b/docs/elements/reference/@ory/elements-react/functions/isUiNodeInput.md new file mode 100644 index 000000000..ba73ef8e0 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/functions/isUiNodeInput.md @@ -0,0 +1,15 @@ +# isUiNodeInput() + +```ts +function isUiNodeInput(node: UiNode): node is UiNodeInput +``` + +## Parameters + +| Parameter | Type | +| --------- | -------- | +| `node` | `UiNode` | + +## Returns + +`node is UiNodeInput` diff --git a/docs/elements/reference/@ory/elements-react/functions/isUiNodeScript.md b/docs/elements/reference/@ory/elements-react/functions/isUiNodeScript.md new file mode 100644 index 000000000..83b32ec17 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/functions/isUiNodeScript.md @@ -0,0 +1,15 @@ +# isUiNodeScript() + +```ts +function isUiNodeScript(node: UiNode): node is UiNodeScript +``` + +## Parameters + +| Parameter | Type | +| --------- | -------- | +| `node` | `UiNode` | + +## Returns + +`node is UiNodeScript` diff --git a/docs/elements/reference/@ory/elements-react/functions/isUiNodeText.md b/docs/elements/reference/@ory/elements-react/functions/isUiNodeText.md new file mode 100644 index 000000000..b2c747793 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/functions/isUiNodeText.md @@ -0,0 +1,15 @@ +# isUiNodeText() + +```ts +function isUiNodeText(node: UiNode): node is UiNodeText +``` + +## Parameters + +| Parameter | Type | +| --------- | -------- | +| `node` | `UiNode` | + +## Returns + +`node is UiNodeText` diff --git a/docs/elements/reference/@ory/elements-react/functions/resolvePlaceholder.md b/docs/elements/reference/@ory/elements-react/functions/resolvePlaceholder.md new file mode 100644 index 000000000..f9768a3fe --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/functions/resolvePlaceholder.md @@ -0,0 +1,16 @@ +# resolvePlaceholder() + +```ts +function resolvePlaceholder(text: UiText, intl: IntlShape): string +``` + +## Parameters + +| Parameter | Type | +| --------- | ----------- | +| `text` | `UiText` | +| `intl` | `IntlShape` | + +## Returns + +`string` diff --git a/docs/elements/reference/@ory/elements-react/functions/useResendCode.md b/docs/elements/reference/@ory/elements-react/functions/useResendCode.md new file mode 100644 index 000000000..a02653350 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/functions/useResendCode.md @@ -0,0 +1,42 @@ +# useResendCode() + +```ts +function useResendCode(): { + resendCode: () => void + resendCodeNode: undefined | UiNode +} +``` + +useResendCode provides a callback to trigger a code resend in the current flow. + +You may use this hook to implement a "Resend Code" button in your forms. + +If the current flow does not support code resending, `resendCodeNode` will be `undefined` and `resendCode` will be a no-op. + +Example: + +```tsx +const { resendCode, resendCodeNode } = useResendCode(); + +return ( + {resendCodeNode && ( + + )} +) +``` + +## Returns + +```ts +{ + resendCode: () => void; + resendCodeNode: undefined | UiNode; +} +``` + +the callback to trigger a code resend + +| Name | Type | Default value | +| ---------------- | ----------------------- | -------------- | +| `resendCode()` | () => `void` | `handleResend` | +| `resendCodeNode` | `undefined` \| `UiNode` | - | diff --git a/docs/elements/reference/@ory/elements-react/index.mdx b/docs/elements/reference/@ory/elements-react/index.md similarity index 80% rename from docs/elements/reference/@ory/elements-react/index.mdx rename to docs/elements/reference/@ory/elements-react/index.md index 8c52069bc..bd466b14e 100644 --- a/docs/elements/reference/@ory/elements-react/index.mdx +++ b/docs/elements/reference/@ory/elements-react/index.md @@ -1,15 +1,3 @@ ---- -id: index -title: "@ory/elements-react" -sidebar_label: "@ory/elements-react" ---- - -```mdx-code-block -import CanonicalUrl from "@site/src/components/CanonicalUrl" - - -``` - # @ory/elements-react This package provides the core functionality for Ory Elements in React. @@ -39,6 +27,7 @@ This package provides the core functionality for Ory Elements in React. - [FormStateAction](type-aliases/FormStateAction.md) - [FormValues](type-aliases/FormValues.md) - [IntlConfig](type-aliases/IntlConfig.md) +- [NodeProps](type-aliases/NodeProps.md) - [OnSubmitHandlerProps](type-aliases/OnSubmitHandlerProps.md) - [OryCardAuthMethodListItemProps](type-aliases/OryCardAuthMethodListItemProps.md) - [OryCardContentProps](type-aliases/OryCardContentProps.md) @@ -55,12 +44,17 @@ This package provides the core functionality for Ory Elements in React. - [OryFormSectionFooterProps](type-aliases/OryFormSectionFooterProps.md) - [OryFormSsoRootProps](type-aliases/OryFormSsoRootProps.md) - [OryNodeAnchorProps](type-aliases/OryNodeAnchorProps.md) +- [OryNodeButtonButtonProps](type-aliases/OryNodeButtonButtonProps.md) - [OryNodeButtonProps](type-aliases/OryNodeButtonProps.md) - [OryNodeCaptchaProps](type-aliases/OryNodeCaptchaProps.md) +- [OryNodeCheckboxInputProps](type-aliases/OryNodeCheckboxInputProps.md) +- [OryNodeCheckboxProps](type-aliases/OryNodeCheckboxProps.md) - [OryNodeConsentScopeCheckboxProps](type-aliases/OryNodeConsentScopeCheckboxProps.md) - [OryNodeImageProps](type-aliases/OryNodeImageProps.md) +- [OryNodeInputInputProps](type-aliases/OryNodeInputInputProps.md) - [OryNodeInputProps](type-aliases/OryNodeInputProps.md) - [OryNodeLabelProps](type-aliases/OryNodeLabelProps.md) +- [OryNodeSettingsButton](type-aliases/OryNodeSettingsButton.md) - [OryNodeSsoButtonProps](type-aliases/OryNodeSsoButtonProps.md) - [OryNodeTextProps](type-aliases/OryNodeTextProps.md) - [OryPageHeaderProps](type-aliases/OryPageHeaderProps.md) @@ -72,13 +66,31 @@ This package provides the core functionality for Ory Elements in React. - [OrySettingsTotpProps](type-aliases/OrySettingsTotpProps.md) - [OrySettingsWebauthnProps](type-aliases/OrySettingsWebauthnProps.md) - [OryToastProps](type-aliases/OryToastProps.md) +- [UiNodeAnchor](type-aliases/UiNodeAnchor.md) +- [UiNodeDiv](type-aliases/UiNodeDiv.md) +- [UiNodeFixed](type-aliases/UiNodeFixed.md) +- [UiNodeImage](type-aliases/UiNodeImage.md) +- [UiNodeInput](type-aliases/UiNodeInput.md) +- [UiNodeScript](type-aliases/UiNodeScript.md) +- [UiNodeText](type-aliases/UiNodeText.md) ## Variables - [OryLocales](variables/OryLocales.md) +## Functions + +- [isUiNodeAnchor](functions/isUiNodeAnchor.md) +- [isUiNodeDiv](functions/isUiNodeDiv.md) +- [isUiNodeImage](functions/isUiNodeImage.md) +- [isUiNodeInput](functions/isUiNodeInput.md) +- [isUiNodeScript](functions/isUiNodeScript.md) +- [isUiNodeText](functions/isUiNodeText.md) +- [resolvePlaceholder](functions/resolvePlaceholder.md) + ## Components +- [Node](variables/Node.md) - [OryCard](functions/OryCard.md) - [OryCardContent](functions/OryCardContent.md) - [OryCardFooter](functions/OryCardFooter.md) @@ -102,6 +114,7 @@ This package provides the core functionality for Ory Elements in React. - [useNodeSorter](functions/useNodeSorter.md) - [useOryConfiguration](functions/useOryConfiguration.md) - [useOryFlow](functions/useOryFlow.md) +- [useResendCode](functions/useResendCode.md) ## Utilities diff --git a/docs/elements/reference/@ory/elements-react/theme/functions/DefaultButtonSocial.md b/docs/elements/reference/@ory/elements-react/theme/functions/DefaultButtonSocial.md index 9a93d5f0d..0d073df83 100644 --- a/docs/elements/reference/@ory/elements-react/theme/functions/DefaultButtonSocial.md +++ b/docs/elements/reference/@ory/elements-react/theme/functions/DefaultButtonSocial.md @@ -3,10 +3,11 @@ ```ts function DefaultButtonSocial(props: { attributes: UiNodeInputAttributes + buttonProps: OryNodeButtonButtonProps + isSubmitting: boolean logos?: Record - node: UiNode - onClick?: () => void - showLabel?: boolean + node: UiNodeInput + provider: string }): Element ``` @@ -14,14 +15,15 @@ The default implementation of a social button for Ory SSO. It renders a button w ## Parameters -| Parameter | Type | Description | -| ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- | -| `props` | \{ `attributes`: `UiNodeInputAttributes`; `logos?`: `Record`\<`string`, `ElementType`\>; `node`: `UiNode`; `onClick?`: () => `void`; `showLabel?`: `boolean`; \} | The props for the DefaultButtonSocial component. | -| `props.attributes` | `UiNodeInputAttributes` | - | -| `props.logos?` | `Record`\<`string`, `ElementType`\> | Logos to use for the social buttons. If not provided, the default logos will be used. | -| `props.node` | `UiNode` | - | -| `props.onClick?` | () => `void` | - | -| `props.showLabel?` | `boolean` | Whether to show the label next to the logo. If not provided, it will be determined based on the number of SSO nodes. | +| Parameter | Type | Description | +| -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------- | +| `props` | \{ `attributes`: `UiNodeInputAttributes`; `buttonProps`: [`OryNodeButtonButtonProps`](../../type-aliases/OryNodeButtonButtonProps.md); `isSubmitting`: `boolean`; `logos?`: `Record`\<`string`, `ElementType`\>; `node`: [`UiNodeInput`](../../type-aliases/UiNodeInput.md); `provider`: `string`; \} | The props for the DefaultButtonSocial component. | +| `props.attributes` | `UiNodeInputAttributes` | **Deprecated** Use node.attributes instead. | +| `props.buttonProps` | [`OryNodeButtonButtonProps`](../../type-aliases/OryNodeButtonButtonProps.md) | - | +| `props.isSubmitting` | `boolean` | - | +| `props.logos?` | `Record`\<`string`, `ElementType`\> | Logos to use for the social buttons. If not provided, the default logos will be used. | +| `props.node` | [`UiNodeInput`](../../type-aliases/UiNodeInput.md) | - | +| `props.provider` | `string` | - | ## Returns diff --git a/docs/elements/reference/@ory/elements-react/theme/functions/DefaultCard.md b/docs/elements/reference/@ory/elements-react/theme/functions/DefaultCard.md index ad527867f..24a6bf28f 100644 --- a/docs/elements/reference/@ory/elements-react/theme/functions/DefaultCard.md +++ b/docs/elements/reference/@ory/elements-react/theme/functions/DefaultCard.md @@ -1,17 +1,20 @@ # `` ```ts -function DefaultCard(props: { children?: ReactNode }): Element +function DefaultCard( + props: { + children?: ReactNode + } & Omit, HTMLDivElement>, "ref">, +): Element ``` The DefaultCard component is a styled container that serves as the main card layout for Ory Elements. ## Parameters -| Parameter | Type | Description | -| ----------------- | ------------------------------- | --------------------------------------------- | -| `props` | \{ `children?`: `ReactNode`; \} | The properties for the DefaultCard component. | -| `props.children?` | `ReactNode` | - | +| Parameter | Type | Description | +| --------- | ---------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------- | +| `props` | \{ `children?`: `ReactNode`; \} & `Omit`\<`DetailedHTMLProps`\<`HTMLAttributes`\<`HTMLDivElement`\>, `HTMLDivElement`\>, `"ref"`\> | The properties for the DefaultCard component. | ## Returns diff --git a/docs/elements/reference/@ory/elements-react/theme/functions/Settings.md b/docs/elements/reference/@ory/elements-react/theme/functions/Settings.md index cf4d6457e..a8f90896c 100644 --- a/docs/elements/reference/@ory/elements-react/theme/functions/Settings.md +++ b/docs/elements/reference/@ory/elements-react/theme/functions/Settings.md @@ -1,12 +1,14 @@ # `` ```ts -function Settings(props: { - children?: ReactNode - components?: OryFlowComponentOverrides - config: OryClientConfiguration - flow: SettingsFlow -}): Element +function Settings( + props: { + children?: ReactNode + components?: OryFlowComponentOverrides + config: OryClientConfiguration + flow: SettingsFlow + } & Omit, HTMLDivElement>, "ref">, +): Element ``` The `Settings` component is used to render the settings flow in Ory Elements. @@ -16,13 +18,9 @@ the settings form. ## Parameters -| Parameter | Type | Description | -| ------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- | -| `props` | \{ `children?`: `ReactNode`; `components?`: [`OryFlowComponentOverrides`](../../type-aliases/OryFlowComponentOverrides.md); `config`: [`OryClientConfiguration`](../../interfaces/OryClientConfiguration.md); `flow`: `SettingsFlow`; \} | The props for the Settings component. | -| `props.children?` | `ReactNode` | Optional children to render If not provided, the default OrySettingsCard will be rendered. | -| `props.components?` | [`OryFlowComponentOverrides`](../../type-aliases/OryFlowComponentOverrides.md) | Optional components to override the default ones. This allows you to customize the appearance and behavior of the settings flow. | -| `props.config` | [`OryClientConfiguration`](../../interfaces/OryClientConfiguration.md) | The Ory client configuration object. This object contains the configuration for the Ory client, such as the base URL and other settings. | -| `props.flow` | `SettingsFlow` | The settings flow object containing the state and data for the settings process. | +| Parameter | Type | Description | +| --------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------- | +| `props` | \{ `children?`: `ReactNode`; `components?`: [`OryFlowComponentOverrides`](../../type-aliases/OryFlowComponentOverrides.md); `config`: [`OryClientConfiguration`](../../interfaces/OryClientConfiguration.md); `flow`: `SettingsFlow`; \} & `Omit`\<`DetailedHTMLProps`\<`HTMLAttributes`\<`HTMLDivElement`\>, `HTMLDivElement`\>, `"ref"`\> | The props for the Settings component. | ## Returns diff --git a/docs/elements/reference/@ory/elements-react/theme/index.mdx b/docs/elements/reference/@ory/elements-react/theme/index.md similarity index 81% rename from docs/elements/reference/@ory/elements-react/theme/index.mdx rename to docs/elements/reference/@ory/elements-react/theme/index.md index a33b634d3..46039ad02 100644 --- a/docs/elements/reference/@ory/elements-react/theme/index.mdx +++ b/docs/elements/reference/@ory/elements-react/theme/index.md @@ -1,15 +1,3 @@ ---- -id: index -title: "@ory/elements-react/theme" -sidebar_label: "theme" ---- - -```mdx-code-block -import CanonicalUrl from "@site/src/components/CanonicalUrl" - - -``` - # @ory/elements-react/theme This package provides the default theme for Ory Elements React. diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/NodeProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/NodeProps.md new file mode 100644 index 000000000..8d330632e --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/NodeProps.md @@ -0,0 +1,15 @@ +# NodeProps + +```ts +type NodeProps = { + node: UiNode +} +``` + +## Properties + +### node + +```ts +node: UiNode +``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryCardAuthMethodListItemProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryCardAuthMethodListItemProps.md index 34c23fda9..dd52f0543 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryCardAuthMethodListItemProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryCardAuthMethodListItemProps.md @@ -2,6 +2,7 @@ ```ts type OryCardAuthMethodListItemProps = { + disabled?: boolean group: string onClick: () => void title?: { @@ -15,6 +16,14 @@ Props for the AuthMethodListItem component. This component is used to render a s ## Properties +### disabled? + +```ts +optional disabled: boolean; +``` + +--- + ### group ```ts diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryFlowComponents.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryFlowComponents.md index a02639d52..90eaeb505 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryFlowComponents.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryFlowComponents.md @@ -34,7 +34,7 @@ type OryFlowComponents = { Anchor: ComponentType Button: ComponentType Captcha: ComponentType - Checkbox: ComponentType + Checkbox: ComponentType CodeInput: ComponentType ConsentScopeCheckbox: ComponentType Image: ComponentType @@ -140,7 +140,7 @@ Node: { Anchor: ComponentType Button: ComponentType Captcha: ComponentType - Checkbox: ComponentType + Checkbox: ComponentType CodeInput: ComponentType ConsentScopeCheckbox: ComponentType Image: ComponentType @@ -156,7 +156,7 @@ Node: { | `Anchor` | `ComponentType`\<[`OryNodeAnchorProps`](OryNodeAnchorProps.md)\> | Anchor component, rendered whenever an "anchor" node is encountered | | `Button` | `ComponentType`\<[`OryNodeButtonProps`](OryNodeButtonProps.md)\> | Button component, rendered whenever a button is encountered in the Ory UI Nodes. | | `Captcha` | `ComponentType`\<[`OryNodeCaptchaProps`](OryNodeCaptchaProps.md)\> | The Captcha component is rendered whenever a "captcha" group is encountered. | -| `Checkbox` | `ComponentType`\<[`OryNodeInputProps`](OryNodeInputProps.md)\> | The Checkbox component is rendered whenever an input node with of boolean type is encountered. | +| `Checkbox` | `ComponentType`\<[`OryNodeCheckboxProps`](OryNodeCheckboxProps.md)\> | The Checkbox component is rendered whenever an input node with of boolean type is encountered. | | `CodeInput` | `ComponentType`\<[`OryNodeInputProps`](OryNodeInputProps.md)\> | Special version of the Input component for OTP codes. | | `ConsentScopeCheckbox` | `ComponentType`\<[`OryNodeConsentScopeCheckboxProps`](OryNodeConsentScopeCheckboxProps.md)\> | Special version of the Input component for scopes in OAuth2 flows. | | `Image` | `ComponentType`\<[`OryNodeImageProps`](OryNodeImageProps.md)\> | The Image component is rendered whenever an "image" node is encountered. For example used in the "Logo" node. | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeButtonButtonProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeButtonButtonProps.md new file mode 100644 index 000000000..0e3a0011a --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeButtonButtonProps.md @@ -0,0 +1,61 @@ +# OryNodeButtonButtonProps + +```ts +type OryNodeButtonButtonProps = { + disabled?: boolean + name: string + onClick: (event: any) => void + type: "button" | "submit" | "reset" + value: string | number | readonly string[] | undefined +} +``` + +## Properties + +### disabled? + +```ts +optional disabled: boolean; +``` + +--- + +### name + +```ts +name: string +``` + +--- + +### onClick() + +```ts +onClick: (event: any) => void; +``` + +#### Parameters + +| Parameter | Type | +| --------- | ----- | +| `event` | `any` | + +#### Returns + +`void` + +--- + +### type + +```ts +type: "button" | "submit" | "reset" +``` + +--- + +### value + +```ts +value: string | number | readonly string[] | undefined; +``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeButtonProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeButtonProps.md index ef3fd4d49..b2ed16077 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeButtonProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeButtonProps.md @@ -3,14 +3,46 @@ ```ts type OryNodeButtonProps = { attributes: UiNodeInputAttributes - node: UiNode -} & Omit, "children"> & - ButtonVariants + buttonProps: OryNodeButtonButtonProps + isSubmitting: boolean + node: UiNodeInput +} ``` -## Type declaration +## Properties -| Name | Type | -| ------------ | ----------------------- | -| `attributes` | `UiNodeInputAttributes` | -| `node` | `UiNode` | +### ~~attributes~~ + +```ts +attributes: UiNodeInputAttributes +``` + +#### Deprecated + +Use node.attributes instead. + +--- + +### buttonProps + +```ts +buttonProps: OryNodeButtonButtonProps +``` + +--- + +### isSubmitting + +```ts +isSubmitting: boolean +``` + +Indicates whether the form is currently being submitted via this button. + +--- + +### node + +```ts +node: UiNodeInput +``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxInputProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxInputProps.md new file mode 100644 index 000000000..eb3f2c0ae --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxInputProps.md @@ -0,0 +1,89 @@ +# OryNodeCheckboxInputProps + +```ts +type OryNodeCheckboxInputProps = { + checked: boolean + disabled?: boolean + name: string + onChange: (event: any) => void + ref: (instance: any) => void + type: "checkbox" + value: string | number | readonly string[] | undefined +} +``` + +## Properties + +### checked + +```ts +checked: boolean +``` + +--- + +### disabled? + +```ts +optional disabled: boolean; +``` + +--- + +### name + +```ts +name: string +``` + +--- + +### onChange() + +```ts +onChange: (event: any) => void; +``` + +#### Parameters + +| Parameter | Type | +| --------- | ----- | +| `event` | `any` | + +#### Returns + +`void` + +--- + +### ref() + +```ts +ref: (instance: any) => void; +``` + +#### Parameters + +| Parameter | Type | +| ---------- | ----- | +| `instance` | `any` | + +#### Returns + +`void` + +--- + +### type + +```ts +type: "checkbox" +``` + +--- + +### value + +```ts +value: string | number | readonly string[] | undefined; +``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxProps.md new file mode 100644 index 000000000..b560d26ab --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxProps.md @@ -0,0 +1,50 @@ +# OryNodeCheckboxProps + +```ts +type OryNodeCheckboxProps = { + attributes: UiNodeInputAttributes + inputProps: OryNodeCheckboxInputProps + node: UiNodeInput + onClick: MouseEventHandler +} +``` + +## Properties + +### ~~attributes~~ + +```ts +attributes: UiNodeInputAttributes +``` + +#### Deprecated + +- use node.attributes + +--- + +### inputProps + +```ts +inputProps: OryNodeCheckboxInputProps +``` + +--- + +### node + +```ts +node: UiNodeInput +``` + +--- + +### ~~onClick~~ + +```ts +onClick: MouseEventHandler +``` + +#### Deprecated + +- use inputProps.onClick diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeConsentScopeCheckboxProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeConsentScopeCheckboxProps.md index 24a6fb84c..fdd70bf07 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeConsentScopeCheckboxProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeConsentScopeCheckboxProps.md @@ -3,6 +3,12 @@ ```ts type OryNodeConsentScopeCheckboxProps = { attributes: UiNodeInputAttributes + inputProps: { + checked: boolean + disabled?: boolean + name: string + value: string + } node: UiNode onCheckedChange: (checked: boolean) => void } @@ -18,6 +24,26 @@ attributes: UiNodeInputAttributes --- +### inputProps + +```ts +inputProps: { + checked: boolean; + disabled?: boolean; + name: string; + value: string; +}; +``` + +| Name | Type | +| ----------- | --------- | +| `checked` | `boolean` | +| `disabled?` | `boolean` | +| `name` | `string` | +| `value` | `string` | + +--- + ### node ```ts diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeImageProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeImageProps.md index 009c7da93..15d98f771 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeImageProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeImageProps.md @@ -3,22 +3,26 @@ ```ts type OryNodeImageProps = { attributes: UiNodeImageAttributes - node: UiNode + node: UiNodeImage } ``` ## Properties -### attributes +### ~~attributes~~ ```ts attributes: UiNodeImageAttributes ``` +#### Deprecated + +Use node.attributes instead. + --- ### node ```ts -node: UiNode +node: UiNodeImage ``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeInputInputProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeInputInputProps.md new file mode 100644 index 000000000..4efc94a6f --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeInputInputProps.md @@ -0,0 +1,129 @@ +# OryNodeInputInputProps + +```ts +type OryNodeInputInputProps = { + autoComplete?: string + disabled?: boolean + maxLength?: number + name: string + onBlur: () => void + onChange: (event: any) => void + onClick: MouseEventHandler + placeholder: string + ref: (instance: any) => void + type: string + value: string | number | readonly string[] | undefined +} +``` + +## Properties + +### autoComplete? + +```ts +optional autoComplete: string; +``` + +--- + +### disabled? + +```ts +optional disabled: boolean; +``` + +--- + +### maxLength? + +```ts +optional maxLength: number; +``` + +--- + +### name + +```ts +name: string +``` + +--- + +### onBlur() + +```ts +onBlur: () => void; +``` + +#### Returns + +`void` + +--- + +### onChange() + +```ts +onChange: (event: any) => void; +``` + +#### Parameters + +| Parameter | Type | +| --------- | ----- | +| `event` | `any` | + +#### Returns + +`void` + +--- + +### onClick + +```ts +onClick: MouseEventHandler +``` + +--- + +### placeholder + +```ts +placeholder: string +``` + +--- + +### ref() + +```ts +ref: (instance: any) => void; +``` + +#### Parameters + +| Parameter | Type | +| ---------- | ----- | +| `instance` | `any` | + +#### Returns + +`void` + +--- + +### type + +```ts +type: string +``` + +--- + +### value + +```ts +value: string | number | readonly string[] | undefined; +``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeInputProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeInputProps.md index d11e0ccf4..4a25c4f98 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeInputProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeInputProps.md @@ -3,31 +3,48 @@ ```ts type OryNodeInputProps = { attributes: UiNodeInputAttributes - node: UiNode + inputProps: OryNodeInputInputProps + node: UiNodeInput onClick?: MouseEventHandler } ``` ## Properties -### attributes +### ~~attributes~~ ```ts attributes: UiNodeInputAttributes ``` +#### Deprecated + +- use node.attributes + +--- + +### inputProps + +```ts +inputProps: OryNodeInputInputProps +``` + --- ### node ```ts -node: UiNode +node: UiNodeInput ``` --- -### onClick? +### ~~onClick?~~ ```ts optional onClick: MouseEventHandler; ``` + +#### Deprecated + +- use inputProps.onClick diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeLabelProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeLabelProps.md index 8ec4c27cf..a8d358bbc 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeLabelProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeLabelProps.md @@ -3,13 +3,15 @@ ```ts type OryNodeLabelProps = { attributes: UiNodeInputAttributes - node: UiNode -} & ComponentPropsWithoutRef<"label"> + fieldError?: object + node: UiNodeInput +} & PropsWithChildren ``` ## Type declaration -| Name | Type | -| ------------ | ----------------------- | -| `attributes` | `UiNodeInputAttributes` | -| `node` | `UiNode` | +| Name | Type | Description | +| ------------- | ------------------------------- | ------------------------------------------- | +| `attributes` | `UiNodeInputAttributes` | **Deprecated** Use node.attributes instead. | +| `fieldError?` | `object` | - | +| `node` | [`UiNodeInput`](UiNodeInput.md) | - | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeSettingsButton.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeSettingsButton.md new file mode 100644 index 000000000..227282ddc --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeSettingsButton.md @@ -0,0 +1,17 @@ +# OryNodeSettingsButton + +```ts +type OryNodeSettingsButton = { + buttonProps: OryNodeButtonButtonProps + onClick: () => void +} & UiNodeInput +``` + +Props for a button used in the settings flow + +## Type declaration + +| Name | Type | Description | +| ------------- | --------------------------------------------------------- | ---------------------------------------- | +| `buttonProps` | [`OryNodeButtonButtonProps`](OryNodeButtonButtonProps.md) | - | +| `onClick()` | () => `void` | **Deprecated** - use buttonProps.onClick | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeSsoButtonProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeSsoButtonProps.md index c4b58d211..ad9dd6878 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeSsoButtonProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeSsoButtonProps.md @@ -3,8 +3,10 @@ ```ts type OryNodeSsoButtonProps = { attributes: UiNodeInputAttributes - node: UiNode - onClick?: () => void + buttonProps: OryNodeButtonButtonProps + isSubmitting: boolean + node: UiNodeInput + provider: string } ``` @@ -12,28 +14,44 @@ Props for the OryNodeSsoButton component. ## Properties -### attributes +### ~~attributes~~ ```ts attributes: UiNodeInputAttributes ``` +#### Deprecated + +Use node.attributes instead. + --- -### node +### buttonProps + +```ts +buttonProps: OryNodeButtonButtonProps +``` + +--- + +### isSubmitting ```ts -node: UiNode +isSubmitting: boolean ``` --- -### onClick()? +### node ```ts -optional onClick: () => void; +node: UiNodeInput ``` -#### Returns +--- -`void` +### provider + +```ts +provider: string +``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeTextProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeTextProps.md index e1e4f53ab..d464c3f68 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeTextProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OryNodeTextProps.md @@ -3,22 +3,26 @@ ```ts type OryNodeTextProps = { attributes: UiNodeTextAttributes - node: UiNode + node: UiNodeText } ``` ## Properties -### attributes +### ~~attributes~~ ```ts attributes: UiNodeTextAttributes ``` +#### Deprecated + +Use node.attributes instead. + --- ### node ```ts -node: UiNode +node: UiNodeText ``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsPasskeyProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsPasskeyProps.md index 1fed7f005..6796dd9a2 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsPasskeyProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsPasskeyProps.md @@ -2,38 +2,32 @@ ```ts type OrySettingsPasskeyProps = { - removeButtons: UiNode & - { - onClick: () => void - }[] - triggerButton: UiNode & { - onClick: () => void - } + isSubmitting: boolean + removeButtons: OryNodeSettingsButton[] + triggerButton: OryNodeSettingsButton } ``` ## Properties -### removeButtons +### isSubmitting ```ts -removeButtons: UiNode & { - onClick: () => void; -}[]; +isSubmitting: boolean ``` --- -### triggerButton +### removeButtons ```ts -triggerButton: UiNode & { - onClick: () => void; -}; +removeButtons: OryNodeSettingsButton[]; ``` -#### Type declaration +--- + +### triggerButton -| Name | Type | -| ----------- | ------------ | -| `onClick()` | () => `void` | +```ts +triggerButton: OryNodeSettingsButton +``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsRecoveryCodesProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsRecoveryCodesProps.md index 4adf77217..21a1b208f 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsRecoveryCodesProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsRecoveryCodesProps.md @@ -3,10 +3,11 @@ ```ts type OrySettingsRecoveryCodesProps = { codes: string[] + isSubmitting: boolean onRegenerate: () => void onReveal: () => void - regnerateButton: UiNode | undefined - revealButton: UiNode | undefined + regenerateButton: UiNodeInput | undefined + revealButton: UiNodeInput | undefined } ``` @@ -20,6 +21,14 @@ codes: string[]; --- +### isSubmitting + +```ts +isSubmitting: boolean +``` + +--- + ### onRegenerate() ```ts @@ -44,10 +53,10 @@ onReveal: () => void; --- -### regnerateButton +### regenerateButton ```ts -regnerateButton: UiNode | undefined +regenerateButton: UiNodeInput | undefined ``` --- @@ -55,5 +64,5 @@ regnerateButton: UiNode | undefined ### revealButton ```ts -revealButton: UiNode | undefined +revealButton: UiNodeInput | undefined ``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsSsoProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsSsoProps.md index ac3fb6070..734b8a2af 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsSsoProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsSsoProps.md @@ -2,25 +2,26 @@ ```ts type OrySettingsSsoProps = { - linkButtons: UiNode & - { - onClick: () => void - }[] - unlinkButtons: UiNode & - { - onClick: () => void - }[] + isSubmitting: boolean + linkButtons: OryNodeSettingsButton[] + unlinkButtons: OryNodeSettingsButton[] } ``` ## Properties +### isSubmitting + +```ts +isSubmitting: boolean +``` + +--- + ### linkButtons ```ts -linkButtons: UiNode & { - onClick: () => void; -}[]; +linkButtons: OryNodeSettingsButton[]; ``` --- @@ -28,7 +29,5 @@ linkButtons: UiNode & { ### unlinkButtons ```ts -unlinkButtons: UiNode & { - onClick: () => void; -}[]; +unlinkButtons: OryNodeSettingsButton[]; ``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsTotpProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsTotpProps.md index df09c0adb..85dd9eee4 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsTotpProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsTotpProps.md @@ -2,16 +2,25 @@ ```ts type OrySettingsTotpProps = { + isSubmitting: boolean onUnlink: () => void - totpImage: UiNode | undefined - totpInput: UiNode | undefined - totpSecret: UiNode | undefined - totpUnlink: UiNode | undefined + totpImage: UiNodeImage | undefined + totpInput: UiNodeInput | undefined + totpSecret: UiNodeText | undefined + totpUnlink: UiNodeInput | undefined } ``` ## Properties +### isSubmitting + +```ts +isSubmitting: boolean +``` + +--- + ### onUnlink() ```ts @@ -27,7 +36,7 @@ onUnlink: () => void; ### totpImage ```ts -totpImage: UiNode | undefined +totpImage: UiNodeImage | undefined ``` --- @@ -35,7 +44,7 @@ totpImage: UiNode | undefined ### totpInput ```ts -totpInput: UiNode | undefined +totpInput: UiNodeInput | undefined ``` --- @@ -43,7 +52,7 @@ totpInput: UiNode | undefined ### totpSecret ```ts -totpSecret: UiNode | undefined +totpSecret: UiNodeText | undefined ``` --- @@ -51,5 +60,5 @@ totpSecret: UiNode | undefined ### totpUnlink ```ts -totpUnlink: UiNode | undefined +totpUnlink: UiNodeInput | undefined ``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsWebauthnProps.md b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsWebauthnProps.md index 2790835bd..6d9c63774 100644 --- a/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsWebauthnProps.md +++ b/docs/elements/reference/@ory/elements-react/type-aliases/OrySettingsWebauthnProps.md @@ -2,23 +2,27 @@ ```ts type OrySettingsWebauthnProps = { - nameInput: UiNode - removeButtons: UiNode & - { - onClick: () => void - }[] - triggerButton: UiNode & { - onClick: () => void - } + isSubmitting: boolean + nameInput: UiNodeInput + removeButtons: OryNodeSettingsButton[] + triggerButton: OryNodeSettingsButton } ``` ## Properties +### isSubmitting + +```ts +isSubmitting: boolean +``` + +--- + ### nameInput ```ts -nameInput: UiNode +nameInput: UiNodeInput ``` --- @@ -26,9 +30,7 @@ nameInput: UiNode ### removeButtons ```ts -removeButtons: UiNode & { - onClick: () => void; -}[]; +removeButtons: OryNodeSettingsButton[]; ``` --- @@ -36,13 +38,5 @@ removeButtons: UiNode & { ### triggerButton ```ts -triggerButton: UiNode & { - onClick: () => void; -}; +triggerButton: OryNodeSettingsButton ``` - -#### Type declaration - -| Name | Type | -| ----------- | ------------ | -| `onClick()` | () => `void` | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeAnchor.md b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeAnchor.md new file mode 100644 index 000000000..b9a7ed10b --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeAnchor.md @@ -0,0 +1,15 @@ +# UiNodeAnchor + +```ts +type UiNodeAnchor = UiNode & { + attributes: UiNodeAnchorAttributes + type: "a" +} +``` + +## Type declaration + +| Name | Type | +| ------------ | ------------------------ | +| `attributes` | `UiNodeAnchorAttributes` | +| `type` | `"a"` | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeDiv.md b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeDiv.md new file mode 100644 index 000000000..55ef6aff0 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeDiv.md @@ -0,0 +1,15 @@ +# UiNodeDiv + +```ts +type UiNodeDiv = UiNode & { + attributes: UiNodeDivisionAttributes + type: "div" +} +``` + +## Type declaration + +| Name | Type | +| ------------ | -------------------------- | +| `attributes` | `UiNodeDivisionAttributes` | +| `type` | `"div"` | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeFixed.md b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeFixed.md new file mode 100644 index 000000000..3fb47d949 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeFixed.md @@ -0,0 +1,5 @@ +# UiNodeFixed + +```ts +type UiNodeFixed = UiNodeInput | UiNodeImage | UiNodeAnchor | UiNodeText | UiNodeScript | UiNodeDiv +``` diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeImage.md b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeImage.md new file mode 100644 index 000000000..2c5835dff --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeImage.md @@ -0,0 +1,15 @@ +# UiNodeImage + +```ts +type UiNodeImage = UiNode & { + attributes: UiNodeImageAttributes + type: "img" +} +``` + +## Type declaration + +| Name | Type | +| ------------ | ----------------------- | +| `attributes` | `UiNodeImageAttributes` | +| `type` | `"img"` | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeInput.md b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeInput.md new file mode 100644 index 000000000..9c65c267f --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeInput.md @@ -0,0 +1,15 @@ +# UiNodeInput + +```ts +type UiNodeInput = UiNode & { + attributes: UiNodeInputAttributes + type: "input" +} +``` + +## Type declaration + +| Name | Type | +| ------------ | ----------------------- | +| `attributes` | `UiNodeInputAttributes` | +| `type` | `"input"` | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeScript.md b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeScript.md new file mode 100644 index 000000000..a5b582e73 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeScript.md @@ -0,0 +1,15 @@ +# UiNodeScript + +```ts +type UiNodeScript = UiNode & { + attributes: UiNodeScriptAttributes + type: "script" +} +``` + +## Type declaration + +| Name | Type | +| ------------ | ------------------------ | +| `attributes` | `UiNodeScriptAttributes` | +| `type` | `"script"` | diff --git a/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeText.md b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeText.md new file mode 100644 index 000000000..2dfe61d21 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/type-aliases/UiNodeText.md @@ -0,0 +1,15 @@ +# UiNodeText + +```ts +type UiNodeText = UiNode & { + attributes: UiNodeTextAttributes + type: "text" +} +``` + +## Type declaration + +| Name | Type | +| ------------ | ---------------------- | +| `attributes` | `UiNodeTextAttributes` | +| `type` | `"text"` | diff --git a/docs/elements/reference/@ory/elements-react/variables/Node.md b/docs/elements/reference/@ory/elements-react/variables/Node.md new file mode 100644 index 000000000..384e9b951 --- /dev/null +++ b/docs/elements/reference/@ory/elements-react/variables/Node.md @@ -0,0 +1,39 @@ +# `` + +```ts +const Node: (__namedParameters: NodeProps) => ReactNode & { + Button: (__namedParameters: ButtonRendererProps) => Element + Checkbox: (__namedParameters: CheckboxRendererProps) => Element + ConsentCheckbox: (__namedParameters: { node: UiNodeInput }) => Element + Image: (__namedParameters: ImageRendererProps) => Element + Input: (__namedParameters: TextBasedInputProps) => Element + SsoButton: (__namedParameters: SsoButtonProps) => Element + Text: (__namedParameters: TextRendererProps) => Element +} +``` + +Use this component to render any UiNode. It will automatically pick the correct sub-component based on the node type and use any +custom components provided via the ComponentsContext. + +Make sure to use this component instead of the custom component directly, to make sure it's integrated properly with the form +system. + +## Type declaration + +| Name | Type | Default value | +| ------------------- | -------------------------------------------------------------------------------------------------- | ------------------------- | +| `Button()` | (`__namedParameters`: `ButtonRendererProps`) => `Element` | `ButtonRenderer` | +| `Checkbox()` | (`__namedParameters`: `CheckboxRendererProps`) => `Element` | `CheckboxRenderer` | +| `ConsentCheckbox()` | (`__namedParameters`: \{ `node`: [`UiNodeInput`](../type-aliases/UiNodeInput.md); \}) => `Element` | `ConsentCheckboxRenderer` | +| `Image()` | (`__namedParameters`: `ImageRendererProps`) => `Element` | `ImageRenderer` | +| `Input()` | (`__namedParameters`: `TextBasedInputProps`) => `Element` | `InputRenderer` | +| `SsoButton()` | (`__namedParameters`: `SsoButtonProps`) => `Element` | `SSOButtonRenderer` | +| `Text()` | (`__namedParameters`: `TextRendererProps`) => `Element` | `TextRenderer` | + +## Param + +NodeProps containing the UiNode to render + +## Returns + +A ReactNode rendering the appropriate component for the given UiNode diff --git a/docs/elements/reference/@ory/nextjs/app/index.mdx b/docs/elements/reference/@ory/nextjs/app/index.md similarity index 70% rename from docs/elements/reference/@ory/nextjs/app/index.mdx rename to docs/elements/reference/@ory/nextjs/app/index.md index dbf3560f5..83153913f 100644 --- a/docs/elements/reference/@ory/nextjs/app/index.mdx +++ b/docs/elements/reference/@ory/nextjs/app/index.md @@ -1,15 +1,3 @@ ---- -id: index -title: "@ory/nextjs/app" -sidebar_label: "app" ---- - -```mdx-code-block -import CanonicalUrl from "@site/src/components/CanonicalUrl" - - -``` - # @ory/nextjs/app ## Interfaces diff --git a/docs/elements/reference/@ory/nextjs/middleware/index.md b/docs/elements/reference/@ory/nextjs/middleware/index.md new file mode 100644 index 000000000..b7b31f1b1 --- /dev/null +++ b/docs/elements/reference/@ory/nextjs/middleware/index.md @@ -0,0 +1,5 @@ +# @ory/nextjs/middleware + +## Functions + +- [createOryMiddleware](functions/createOryMiddleware.md) diff --git a/docs/elements/reference/@ory/nextjs/middleware/index.mdx b/docs/elements/reference/@ory/nextjs/middleware/index.mdx deleted file mode 100644 index 109bce2b5..000000000 --- a/docs/elements/reference/@ory/nextjs/middleware/index.mdx +++ /dev/null @@ -1,17 +0,0 @@ ---- -id: index -title: "@ory/nextjs/middleware" -sidebar_label: "middleware" ---- - -```mdx-code-block -import CanonicalUrl from "@site/src/components/CanonicalUrl" - - -``` - -# @ory/nextjs/middleware - -## Functions - -- [createOryMiddleware](functions/createOryMiddleware.md) diff --git a/docs/elements/reference/@ory/nextjs/pages/index.mdx b/docs/elements/reference/@ory/nextjs/pages/index.md similarity index 60% rename from docs/elements/reference/@ory/nextjs/pages/index.mdx rename to docs/elements/reference/@ory/nextjs/pages/index.md index 604f5f9dc..fe13403be 100644 --- a/docs/elements/reference/@ory/nextjs/pages/index.mdx +++ b/docs/elements/reference/@ory/nextjs/pages/index.md @@ -1,15 +1,3 @@ ---- -id: index -title: "@ory/nextjs/pages" -sidebar_label: "pages" ---- - -```mdx-code-block -import CanonicalUrl from "@site/src/components/CanonicalUrl" - - -``` - # @ory/nextjs/pages ## Hooks diff --git a/docs/elements/reference/index.md b/docs/elements/reference/index.md new file mode 100644 index 000000000..a49e32891 --- /dev/null +++ b/docs/elements/reference/index.md @@ -0,0 +1,9 @@ +# Ory Elements Reference + +## Modules + +- [@ory/elements-react](@ory/elements-react/index.md) +- [@ory/elements-react/theme](@ory/elements-react/theme/index.md) +- [@ory/nextjs/app](@ory/nextjs/app/index.md) +- [@ory/nextjs/middleware](@ory/nextjs/middleware/index.md) +- [@ory/nextjs/pages](@ory/nextjs/pages/index.md) diff --git a/docs/elements/reference/typedoc-sidebar.ts b/docs/elements/reference/typedoc-sidebar.ts index e04fb5eee..02a012415 100644 --- a/docs/elements/reference/typedoc-sidebar.ts +++ b/docs/elements/reference/typedoc-sidebar.ts @@ -115,6 +115,11 @@ const typedocSidebar: SidebarsConfig = { id: "elements/reference/@ory/elements-react/type-aliases/IntlConfig", label: "IntlConfig", }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/NodeProps", + label: "NodeProps", + }, { type: "doc", id: "elements/reference/@ory/elements-react/type-aliases/OnSubmitHandlerProps", @@ -195,6 +200,11 @@ const typedocSidebar: SidebarsConfig = { id: "elements/reference/@ory/elements-react/type-aliases/OryNodeAnchorProps", label: "OryNodeAnchorProps", }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/OryNodeButtonButtonProps", + label: "OryNodeButtonButtonProps", + }, { type: "doc", id: "elements/reference/@ory/elements-react/type-aliases/OryNodeButtonProps", @@ -205,6 +215,16 @@ const typedocSidebar: SidebarsConfig = { id: "elements/reference/@ory/elements-react/type-aliases/OryNodeCaptchaProps", label: "OryNodeCaptchaProps", }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxInputProps", + label: "OryNodeCheckboxInputProps", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/OryNodeCheckboxProps", + label: "OryNodeCheckboxProps", + }, { type: "doc", id: "elements/reference/@ory/elements-react/type-aliases/OryNodeConsentScopeCheckboxProps", @@ -215,6 +235,11 @@ const typedocSidebar: SidebarsConfig = { id: "elements/reference/@ory/elements-react/type-aliases/OryNodeImageProps", label: "OryNodeImageProps", }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/OryNodeInputInputProps", + label: "OryNodeInputInputProps", + }, { type: "doc", id: "elements/reference/@ory/elements-react/type-aliases/OryNodeInputProps", @@ -225,6 +250,11 @@ const typedocSidebar: SidebarsConfig = { id: "elements/reference/@ory/elements-react/type-aliases/OryNodeLabelProps", label: "OryNodeLabelProps", }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/OryNodeSettingsButton", + label: "OryNodeSettingsButton", + }, { type: "doc", id: "elements/reference/@ory/elements-react/type-aliases/OryNodeSsoButtonProps", @@ -280,6 +310,41 @@ const typedocSidebar: SidebarsConfig = { id: "elements/reference/@ory/elements-react/type-aliases/OryToastProps", label: "OryToastProps", }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/UiNodeAnchor", + label: "UiNodeAnchor", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/UiNodeDiv", + label: "UiNodeDiv", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/UiNodeFixed", + label: "UiNodeFixed", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/UiNodeImage", + label: "UiNodeImage", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/UiNodeInput", + label: "UiNodeInput", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/UiNodeScript", + label: "UiNodeScript", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/type-aliases/UiNodeText", + label: "UiNodeText", + }, ], }, { @@ -293,10 +358,56 @@ const typedocSidebar: SidebarsConfig = { }, ], }, + { + type: "category", + label: "Functions", + items: [ + { + type: "doc", + id: "elements/reference/@ory/elements-react/functions/isUiNodeAnchor", + label: "isUiNodeAnchor", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/functions/isUiNodeDiv", + label: "isUiNodeDiv", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/functions/isUiNodeImage", + label: "isUiNodeImage", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/functions/isUiNodeInput", + label: "isUiNodeInput", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/functions/isUiNodeScript", + label: "isUiNodeScript", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/functions/isUiNodeText", + label: "isUiNodeText", + }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/functions/resolvePlaceholder", + label: "resolvePlaceholder", + }, + ], + }, { type: "category", label: "Components", items: [ + { + type: "doc", + id: "elements/reference/@ory/elements-react/variables/Node", + label: "Node", + }, { type: "doc", id: "elements/reference/@ory/elements-react/functions/OryCard", @@ -403,6 +514,11 @@ const typedocSidebar: SidebarsConfig = { id: "elements/reference/@ory/elements-react/functions/useOryFlow", label: "useOryFlow", }, + { + type: "doc", + id: "elements/reference/@ory/elements-react/functions/useResendCode", + label: "useResendCode", + }, ], }, { diff --git a/src/sidebar.ts b/src/sidebar.ts index 8dd49c751..b3ce54aa4 100644 --- a/src/sidebar.ts +++ b/src/sidebar.ts @@ -1311,11 +1311,8 @@ const elements: SidebarItemsConfig = [ label: "Reference", collapsible: false, link: { - type: "generated-index", - title: "Ory Elements Reference", - description: "Learn about the most important Ory Elements concepts!", - slug: "/elements/reference", - keywords: ["guides"], + type: "doc", + id: "elements/reference/index", }, items: [ ...require("../docs/elements/reference/typedoc-sidebar.ts").items, From 0b675f326256ed0f2e4362dadad6a1713f0fe276 Mon Sep 17 00:00:00 2001 From: Jonas Hungershausen Date: Wed, 26 Nov 2025 15:02:25 -0500 Subject: [PATCH 2/4] Apply suggestions from code review Co-authored-by: Vincent --- docs/elements/guides/05_upgrading.mdx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/elements/guides/05_upgrading.mdx b/docs/elements/guides/05_upgrading.mdx index 30b3f7350..256fcf579 100644 --- a/docs/elements/guides/05_upgrading.mdx +++ b/docs/elements/guides/05_upgrading.mdx @@ -1,10 +1,10 @@ --- id: upgrade -title: Upgrading Ory Elements -sidebar_label: Upgrading +title: Upgrade Ory Elements +sidebar_label: Upgrade --- -# Ory Elements 1.1.0 to 1.2.0 Upgrade Guide +# Ory Elements 1.1.0 to 1.2.0 upgrade guide This guide will show you how to migrate from Ory Elements 1.1.0 to 1.2.0. From e4026640e6a866590ee70f04c8d33f2b4fa16676 Mon Sep 17 00:00:00 2001 From: Jonas Hungershausen Date: Wed, 26 Nov 2025 18:05:45 -0500 Subject: [PATCH 3/4] chore: u --- docs/elements/reference/@ory/elements-react/index.md | 6 ------ docs/elements/reference/@ory/elements-react/theme/index.md | 6 ------ docs/elements/reference/@ory/nextjs/app/index.md | 6 ------ docs/elements/reference/@ory/nextjs/pages/index.md | 6 ------ 4 files changed, 24 deletions(-) diff --git a/docs/elements/reference/@ory/elements-react/index.md b/docs/elements/reference/@ory/elements-react/index.md index fb90d8bc3..bd466b14e 100644 --- a/docs/elements/reference/@ory/elements-react/index.md +++ b/docs/elements/reference/@ory/elements-react/index.md @@ -1,9 +1,3 @@ ---- -id: index -title: "@ory/elements-react" -sidebar_label: "@ory/elements-react" ---- - # @ory/elements-react This package provides the core functionality for Ory Elements in React. diff --git a/docs/elements/reference/@ory/elements-react/theme/index.md b/docs/elements/reference/@ory/elements-react/theme/index.md index 101411b18..46039ad02 100644 --- a/docs/elements/reference/@ory/elements-react/theme/index.md +++ b/docs/elements/reference/@ory/elements-react/theme/index.md @@ -1,9 +1,3 @@ ---- -id: index -title: "@ory/elements-react/theme" -sidebar_label: "theme" ---- - # @ory/elements-react/theme This package provides the default theme for Ory Elements React. diff --git a/docs/elements/reference/@ory/nextjs/app/index.md b/docs/elements/reference/@ory/nextjs/app/index.md index 80e1b901d..83153913f 100644 --- a/docs/elements/reference/@ory/nextjs/app/index.md +++ b/docs/elements/reference/@ory/nextjs/app/index.md @@ -1,9 +1,3 @@ ---- -id: index -title: "@ory/nextjs/app" -sidebar_label: "app" ---- - # @ory/nextjs/app ## Interfaces diff --git a/docs/elements/reference/@ory/nextjs/pages/index.md b/docs/elements/reference/@ory/nextjs/pages/index.md index 639238f8f..fe13403be 100644 --- a/docs/elements/reference/@ory/nextjs/pages/index.md +++ b/docs/elements/reference/@ory/nextjs/pages/index.md @@ -1,9 +1,3 @@ ---- -id: index -title: "@ory/nextjs/pages" -sidebar_label: "pages" ---- - # @ory/nextjs/pages ## Hooks From 4e6e4d313fd06cea8f6767a6bb23ec138fdd0cd4 Mon Sep 17 00:00:00 2001 From: Jonas Hungershausen Date: Wed, 26 Nov 2025 18:18:43 -0500 Subject: [PATCH 4/4] chore: u --- docs/elements/guides/05_upgrading.mdx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/docs/elements/guides/05_upgrading.mdx b/docs/elements/guides/05_upgrading.mdx index 256fcf579..78b5bb920 100644 --- a/docs/elements/guides/05_upgrading.mdx +++ b/docs/elements/guides/05_upgrading.mdx @@ -1,10 +1,12 @@ --- id: upgrade title: Upgrade Ory Elements -sidebar_label: Upgrade +sidebar_label: Upgrading --- -# Ory Elements 1.1.0 to 1.2.0 upgrade guide +# Upgrade Guide + +## Ory Elements 1.1.0 to 1.2.0 upgrade guide This guide will show you how to migrate from Ory Elements 1.1.0 to 1.2.0. @@ -31,7 +33,7 @@ props to your custom components. - If you were using the `RecoveryCodesSettings` component, there was a typo in the prop name for regenerating codes. The correct prop name is now `regenerateButton` instead of `regnerateButton`. -# Ory Elements 0.x to 1.x Upgrade Guide +## Ory Elements 0.x to 1.x Upgrade Guide This guide will show you how to migrate from Ory Elements 0.x to 1.x.