@asgardeo/react 0.5.13 → 0.5.15

package/dist/cjs/index.js

@@ -176,7 +176,8 @@ var AsgardeoContext = (0, import_react.createContext)({
   http: {
     request: () => null,
     requestAll: () => null
-  }
+  },
+  signInOptions: {}
 });
 AsgardeoContext.displayName = "AsgardeoContext";
 var AsgardeoContext_default = AsgardeoContext;
@@ -1289,7 +1290,8 @@ var ThemeProvider = ({
       borderRadius: brandingTheme.borderRadius,
       shadows: brandingTheme.shadows,
       spacing: brandingTheme.spacing,
-      images: brandingTheme.images
+      images: brandingTheme.images,
+      components: brandingTheme.components
     };
     return {
       ...brandingThemeConfig,
@@ -1313,6 +1315,10 @@ var ThemeProvider = ({
       images: {
         ...brandingThemeConfig.images,
         ...themeConfig?.images
+      },
+      components: {
+        ...brandingThemeConfig.components,
+        ...themeConfig?.components
       }
     };
   }, [inheritFromBranding, brandingTheme, themeConfig]);
@@ -1478,6 +1484,7 @@ var AsgardeoProvider = ({
   signUpUrl,
   organizationHandle,
   applicationId,
+  signInOptions,
   ...rest
 }) => {
   const reRenderCheckRef = (0, import_react15.useRef)(false);
@@ -1501,6 +1508,7 @@ var AsgardeoProvider = ({
     scopes,
     signUpUrl,
     signInUrl,
+    signInOptions,
     ...rest
   });
   const [brandingPreference, setBrandingPreference] = (0, import_react15.useState)(null);
@@ -1738,7 +1746,8 @@ var AsgardeoProvider = ({
       http: {
         request: asgardeo.request.bind(asgardeo),
         requestAll: asgardeo.requestAll.bind(asgardeo)
-      }
+      },
+      signInOptions
     }),
     [
       applicationId,
@@ -1754,7 +1763,8 @@ var AsgardeoProvider = ({
       signIn,
       signInSilently,
       user,
-      asgardeo
+      asgardeo,
+      signInOptions
     ]
   );
   return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(AsgardeoContext_default.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(I18nProvider_default, { preferences: preferences?.i18n, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
@@ -2232,7 +2242,7 @@ var useStyles2 = (theme, colorScheme, color, variant, size, fullWidth, disabled,
       align-items: center;
       justify-content: center;
       gap: calc(${theme.vars.spacing.unit} * 1);
-      border-radius: ${shape === "round" ? "50%" : theme.vars.borderRadius.medium};
+      border-radius: ${shape === "round" ? "50%" : theme.vars.components?.Button?.root?.borderRadius || theme.vars.borderRadius.medium};
       font-weight: 500;
       cursor: ${disabled || loading ? "not-allowed" : "pointer"};
       outline: none;
@@ -2563,8 +2573,8 @@ var BaseSignInButton_default = BaseSignInButton;
 var import_browser18 = require("@asgardeo/browser");
 var import_react28 = require("react");
 var import_jsx_runtime11 = require("react/jsx-runtime");
-var SignInButton = (0, import_react28.forwardRef)(({ children, onClick, preferences, ...rest }, ref) => {
-  const { signIn, signInUrl } = useAsgardeo_default();
+var SignInButton = (0, import_react28.forwardRef)(({ children, onClick, preferences, signInOptions: overriddenSignInOptions = {}, ...rest }, ref) => {
+  const { signIn, signInUrl, signInOptions } = useAsgardeo_default();
   const { t } = useTranslation_default(preferences?.i18n);
   const [isLoading, setIsLoading] = (0, import_react28.useState)(false);
   const handleSignIn = async (e) => {
@@ -2574,7 +2584,7 @@ var SignInButton = (0, import_react28.forwardRef)(({ children, onClick, preferen
         window.history.pushState(null, "", signInUrl);
         window.dispatchEvent(new PopStateEvent("popstate", { state: null }));
       } else {
-        await signIn();
+        await signIn(overriddenSignInOptions ?? signInOptions);
       }
       if (onClick) {
         onClick(e);
@@ -3336,7 +3346,7 @@ var useStyles6 = (theme, colorScheme, disabled, hasError, hasStartIcon, hasEndIc
       width: 100%;
       padding: ${theme.vars.spacing.unit} ${rightPadding} ${theme.vars.spacing.unit} ${leftPadding};
       border: 1px solid ${hasError ? theme.vars.colors.error.main : theme.vars.colors.border};
-      border-radius: ${theme.vars.borderRadius.medium};
+      border-radius: ${theme.vars.components?.Field?.root?.borderRadius || theme.vars.borderRadius.medium};
       font-size: ${theme.vars.typography.fontSizes.md};
       color: ${theme.vars.colors.text.primary};
       background-color: ${disabled ? theme.vars.colors.background.disabled : theme.vars.colors.background.surface};
@@ -3520,7 +3530,7 @@ var useStyles7 = (theme, colorScheme, disabled, hasError) => {
       width: 100%;
       padding: ${theme.vars.spacing.unit} calc(${theme.vars.spacing.unit} * 1.5);
       border: 1px solid ${hasError ? theme.vars.colors.error.main : theme.vars.colors.border};
-      border-radius: ${theme.vars.borderRadius.medium};
+      border-radius: ${theme.vars.components?.Field?.root?.borderRadius || theme.vars.borderRadius.medium};
       font-size: ${theme.vars.typography.fontSizes.md};
       color: ${theme.vars.colors.text.primary};
       background-color: ${disabled ? theme.vars.colors.background.disabled : theme.vars.colors.background.surface};
@@ -3660,7 +3670,7 @@ var useStyles8 = (theme, colorScheme, disabled, hasError, length) => {
       font-size: ${theme.vars.typography.fontSizes.xl};
       font-weight: 500;
       border: 2px solid ${hasError ? theme.vars.colors.error.main : theme.vars.colors.border};
-      border-radius: ${theme.vars.borderRadius.medium};
+      border-radius: ${theme.vars.components?.Field?.root?.borderRadius || theme.vars.borderRadius.medium};
       color: ${theme.vars.colors.text.primary};
       background-color: ${disabled ? theme.vars.colors.background.disabled : theme.vars.colors.background.surface};
       outline: none;
@@ -3990,7 +4000,7 @@ var useStyles10 = (theme, colorScheme, hasError, disabled) => {
       width: 100%;
       padding: ${theme.vars.spacing.unit} calc(${theme.vars.spacing.unit} * 1.5);
       border: 1px solid ${theme.vars.colors.border};
-      border-radius: ${theme.vars.borderRadius.medium};
+      border-radius: ${theme.vars.components?.Field?.root?.borderRadius || theme.vars.borderRadius.medium};
       font-size: 1rem;
       color: ${theme.vars.colors.text.primary};
       background-color: ${theme.vars.colors.background.surface};