diff --git a/packages/elements-react/api-report/elements-react-theme.api.json b/packages/elements-react/api-report/elements-react-theme.api.json index c0b600006..44890c9c4 100644 --- a/packages/elements-react/api-report/elements-react-theme.api.json +++ b/packages/elements-react/api-report/elements-react-theme.api.json @@ -172,6 +172,156 @@ "name": "", "preserveMemberOrder": false, "members": [ + { + "kind": "Function", + "canonicalReference": "@ory/elements-react!DefaultButtonSocial:function(1)", + "docComment": "", + "excerptTokens": [ + { + "kind": "Content", + "text": "declare function DefaultButtonSocial({ attributes, node, onClick, " + }, + { + "kind": "Reference", + "text": "showLabel", + "canonicalReference": "@ory/elements-react!~__type#showLabel" + }, + { + "kind": "Content", + "text": ": _showLabel, " + }, + { + "kind": "Reference", + "text": "logos", + "canonicalReference": "@ory/elements-react!~__type#logos" + }, + { + "kind": "Content", + "text": ": providedLogos, }: " + }, + { + "kind": "Reference", + "text": "DefaultSocialButtonProps", + "canonicalReference": "@ory/elements-react!~DefaultSocialButtonProps:type" + }, + { + "kind": "Content", + "text": "): " + }, + { + "kind": "Reference", + "text": "react_jsx_runtime.JSX.Element", + "canonicalReference": "@types/react!JSX.Element:interface" + }, + { + "kind": "Content", + "text": ";" + } + ], + "fileUrlPath": "dist/theme/default/index.d.ts", + "returnTypeTokenRange": { + "startIndex": 7, + "endIndex": 8 + }, + "releaseTag": "Public", + "overloadIndex": 1, + "parameters": [ + { + "parameterName": "{ attributes, node, onClick, showLabel: _showLabel, logos: providedLogos, }", + "parameterTypeTokenRange": { + "startIndex": 5, + "endIndex": 6 + }, + "isOptional": false + } + ], + "name": "DefaultButtonSocial" + }, + { + "kind": "Namespace", + "canonicalReference": "@ory/elements-react!DefaultButtonSocial:namespace", + "docComment": "", + "excerptTokens": [ + { + "kind": "Content", + "text": "declare namespace DefaultButtonSocial " + } + ], + "fileUrlPath": "dist/theme/default/index.d.ts", + "releaseTag": "Public", + "name": "DefaultButtonSocial", + "preserveMemberOrder": false, + "members": [ + { + "kind": "Function", + "canonicalReference": "@ory/elements-react!DefaultButtonSocial.WithLogos:function(1)", + "docComment": "", + "excerptTokens": [ + { + "kind": "Content", + "text": "WithLogos: (logos: " + }, + { + "kind": "Reference", + "text": "Record", + "canonicalReference": "!Record:type" + }, + { + "kind": "Content", + "text": "" + }, + { + "kind": "Content", + "text": ") => " + }, + { + "kind": "Content", + "text": "(props: " + }, + { + "kind": "Reference", + "text": "DefaultSocialButtonProps", + "canonicalReference": "@ory/elements-react!~DefaultSocialButtonProps:type" + }, + { + "kind": "Content", + "text": ") => " + }, + { + "kind": "Reference", + "text": "react_jsx_runtime.JSX.Element", + "canonicalReference": "@types/react!JSX.Element:interface" + } + ], + "returnTypeTokenRange": { + "startIndex": 6, + "endIndex": 10 + }, + "releaseTag": "Public", + "overloadIndex": 1, + "parameters": [ + { + "parameterName": "logos", + "parameterTypeTokenRange": { + "startIndex": 1, + "endIndex": 5 + }, + "isOptional": false + } + ], + "name": "WithLogos" + } + ] + }, { "kind": "Function", "canonicalReference": "@ory/elements-react!DefaultCard:function(1)", diff --git a/packages/elements-react/api-report/elements-react-theme.api.md b/packages/elements-react/api-report/elements-react-theme.api.md index 0b2b4516a..5732e9459 100644 --- a/packages/elements-react/api-report/elements-react-theme.api.md +++ b/packages/elements-react/api-report/elements-react-theme.api.md @@ -8,6 +8,7 @@ import { ComponentPropsWithoutRef } from 'react'; import { ComponentType } from 'react'; import { ConfigurationParameters } from '@ory/client-fetch'; import { DetailedHTMLProps } from 'react'; +import { ElementType } from 'react'; import { FlowError } from '@ory/client-fetch'; import { FormEventHandler } from 'react'; import { HTMLAttributes } from 'react'; @@ -28,6 +29,17 @@ import { UiText } from '@ory/client-fetch'; import { VariantProps } from 'class-variance-authority'; import { VerificationFlow } from '@ory/client-fetch'; +// Warning: (ae-forgotten-export) The symbol "DefaultSocialButtonProps" needs to be exported by the entry point index.d.ts +// +// @public (undocumented) +export function DefaultButtonSocial({ attributes, node, onClick, showLabel: _showLabel, logos: providedLogos, }: DefaultSocialButtonProps): react_jsx_runtime.JSX.Element; + +// @public (undocumented) +export namespace DefaultButtonSocial { + var // (undocumented) + WithLogos: (logos: Record) => (props: DefaultSocialButtonProps) => react_jsx_runtime.JSX.Element; +} + // Warning: (ae-forgotten-export) The symbol "OryCardRootProps" needs to be exported by the entry point index.d.ts // // @public (undocumented) @@ -126,8 +138,8 @@ export type VerificationFlowContextProps = { // Warnings were encountered during analysis: // -// dist/theme/default/index.d.ts:27:5 - (ae-forgotten-export) The symbol "OryFlowComponentOverrides" needs to be exported by the entry point index.d.ts -// dist/theme/default/index.d.ts:28:5 - (ae-forgotten-export) The symbol "OryClientConfiguration" needs to be exported by the entry point index.d.ts +// dist/theme/default/index.d.ts:36:5 - (ae-forgotten-export) The symbol "OryFlowComponentOverrides" needs to be exported by the entry point index.d.ts +// dist/theme/default/index.d.ts:37:5 - (ae-forgotten-export) The symbol "OryClientConfiguration" needs to be exported by the entry point index.d.ts // (No @packageDocumentation comment for this package) diff --git a/packages/elements-react/src/theme/default/components/form/index.tsx b/packages/elements-react/src/theme/default/components/form/index.tsx index ea7605c9d..67796774c 100644 --- a/packages/elements-react/src/theme/default/components/form/index.tsx +++ b/packages/elements-react/src/theme/default/components/form/index.tsx @@ -64,3 +64,5 @@ export function DefaultMessage({ message }: OryMessageContentProps) { ) } + +export { DefaultButtonSocial } from "./social" diff --git a/packages/elements-react/src/theme/default/components/form/social.tsx b/packages/elements-react/src/theme/default/components/form/social.tsx index 0bc00e139..1bcac25b1 100644 --- a/packages/elements-react/src/theme/default/components/form/social.tsx +++ b/packages/elements-react/src/theme/default/components/form/social.tsx @@ -7,9 +7,10 @@ import { uiTextToFormattedMessage, useOryFlow, } from "@ory/elements-react" -import logos from "../../provider-logos" +import defaultLogos from "../../provider-logos" import { cn } from "../../utils/cn" import { useIntl } from "react-intl" +import { ElementType } from "react" export function extractProvider( context: object | undefined, @@ -27,6 +28,7 @@ export function extractProvider( type DefaultSocialButtonProps = OryNodeOidcButtonProps & { showLabel?: boolean + logos?: Record } export function DefaultButtonSocial({ @@ -34,7 +36,9 @@ export function DefaultButtonSocial({ node, onClick, showLabel: _showLabel, + logos: providedLogos, }: DefaultSocialButtonProps) { + const logos = { ...defaultLogos, ...providedLogos } const { node_type: _ignoredNodeType, type: _ignoredType, @@ -73,7 +77,7 @@ export function DefaultButtonSocial({ ) : ( @@ -90,6 +94,17 @@ export function DefaultButtonSocial({ ) } +/** + * Returns a variant of DefaultButtonSocial that can use your own logos + * + * @param logos - a record of provider names and their respective logos + * @returns a variant of DefaultButtonSocial that uses the provided logos + */ +DefaultButtonSocial.WithLogos = + (logos: Record) => (props: DefaultSocialButtonProps) => ( + + ) + export function DefaultSocialButtonContainer({ children, nodes, diff --git a/packages/elements-react/src/theme/default/provider-logos/apple.svg b/packages/elements-react/src/theme/default/provider-logos/apple.svg index c85777c57..7cd5e61a2 100644 --- a/packages/elements-react/src/theme/default/provider-logos/apple.svg +++ b/packages/elements-react/src/theme/default/provider-logos/apple.svg @@ -1,4 +1,3 @@ - - - + + diff --git a/packages/elements-react/src/theme/default/provider-logos/google.svg b/packages/elements-react/src/theme/default/provider-logos/google.svg index b8cf5b26b..3f670be38 100644 --- a/packages/elements-react/src/theme/default/provider-logos/google.svg +++ b/packages/elements-react/src/theme/default/provider-logos/google.svg @@ -1 +1,6 @@ - \ No newline at end of file + + + + + +