@youversion/platform-react-ui 0.6.0 → 0.8.0

package/README.md

@@ -30,13 +30,13 @@ Get your App Key at [platform.youversion.com](https://platform.youversion.com/)
 Wrap your app with the provider and use components:
 
 ```tsx
-import { BibleSDKProvider, BibleTextView } from '@youversion/platform-react-ui';
+import { YouVersionProvider, BibleTextView } from '@youversion/platform-react-ui';
 
 function App() {
   return (
-    <BibleSDKProvider appKey={"YOUR_APP_KEY"}>
+    <YouVersionProvider appKey={"YOUR_APP_KEY"}>
       <BibleTextView reference="JHN.1.1-4" versionId={111} />
-    </BibleSDKProvider>
+    </YouVersionProvider>
   );
 }
 ```
@@ -47,20 +47,20 @@ Toggle theme via the `YVPProvider`:
 
 ```tsx
 import { useState } from 'react';
-import { BibleSDKProvider, YVPProvider, BibleTextView } from '@youversion/platform-react-ui';
+import { YouVersionProvider, YVPProvider, BibleTextView } from '@youversion/platform-react-ui';
 
 export default function App() {
   const [theme, setTheme] = useState<'light' | 'dark'>('light');
 
   return (
-    <BibleSDKProvider appKey="YOUR_APP_KEY">
+    <YouVersionProvider appKey="YOUR_APP_KEY">
       <YVPProvider config={{ appKey: "YOUR_APP_KEY" }} theme={theme}>
         <button onClick={() => setTheme(theme === 'light' ? 'dark' : 'light')}>
           Toggle theme
         </button>
         <BibleTextView reference="JHN.1.1-4" versionId={111} />
       </YVPProvider>
-    </BibleSDKProvider>
+    </YouVersionProvider>
   );
 }
 ```

package/dist/components/{SignInButton.d.ts → YouVersionAuthButton.d.ts}

@@ -1,26 +1,18 @@
 import React from 'react';
-import { type SignInWithYouVersionPermissionValues, type SignInWithYouVersionResult } from '@youversion/platform-core';
+import { type SignInWithYouVersionPermissionValues } from '@youversion/platform-core';
 interface SignInAuthProps {
     /**
      * Called when the sign-in flow fails.
      * @param error - The error thrown by the sign-in flow.
      */
     onAuthError?: (error: Error) => void;
-    /**
-     * Called when the sign-in flow succeeds.
-     * @param result - The result of the sign-in flow.
-     */
-    onSuccess?: (result: SignInWithYouVersionResult) => void;
     /**
      * Permissions that are requested but not required for sign-in to succeed.
      */
-    optionalPermissions?: SignInWithYouVersionPermissionValues[];
-    /**
-     * Permissions that must be granted for sign-in to succeed.
-     */
-    requiredPermissions?: SignInWithYouVersionPermissionValues[];
+    permissions?: SignInWithYouVersionPermissionValues[];
+    redirectUrl: string;
 }
-export interface SignInButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, SignInAuthProps {
+export interface YouVersionAuthButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, SignInAuthProps {
     /**
      * The background color of the button.
      *
@@ -49,32 +41,40 @@ export interface SignInButtonProps extends React.ButtonHTMLAttributes<HTMLButton
      * - `outline` - Button with contrast border.
      */
     variant?: 'default' | 'outline';
+    /**
+     * The mode of the signIn/SignOut button
+     *
+     * - `signIn` - Renders the YouVersionAuthButton
+     * - `signOut` - Renders the SignOutButton
+     * - `auto` - Renders the YouVersionAuthButton when there
+     *   is not a user signed in and renders the SignOutButton
+     *   when there is a user signed in.
+     *
+     * */
+    mode?: 'signIn' | 'signOut' | 'auto';
 }
 /**
- * SignInButton - Initiates the YouVersion OAuth sign-in flow on click.
+ * YouVersionAuthButton - Initiates the YouVersion OAuth sign-in flow on click.
  *
  * Key behaviors:
  * - Prevents default click behavior and triggers the SDK `signIn` method.
- * - Calls `onSuccess` with the SignInWithYouVersionResult when sign-in succeeds.
  * - Calls `onAuthError` when the underlying sign-in flow throws.
  *
- * @param {SignInButtonProps} props - Component props (see {@link SignInButtonProps}).
+ * @param {YouVersionAuthButtonProps} props - Component props (see {@link YouVersionAuthButtonProps}).
  * @returns {React.ReactElement} A button element that starts the sign-in flow.
  *
  * @example
- * import { SignInButton, SignInWithYouVersionPermission } from '@youversion/platform-react-ui';
- * import { useAuthentication } from '@youversion/platform-react-ui';
+ * import { YouVersionAuthButton, SignInWithYouVersionPermission } from '@youversion/platform-react-ui';
+ * import { useYVAuth } from '@youversion/platform-react-hooks';
  *
  * export default function UnauthenticatedView() {
- *   const auth = useAuthentication();
+ *   const { auth } = useYVAuth();
  *
  *   return (
  *     <div>
  *       {auth.error && <p className="text-red-600">Error: {auth.error.message}</p>}
- *       <SignInButton
- *         requiredPermissions={[SignInWithYouVersionPermission.bibles]}
- *         optionalPermissions={[SignInWithYouVersionPermission.highlights]}
- *         onSuccess={(result) => console.log('signed in', result)}
+ *       <YouVersionAuthButton
+ *         permissions={[SignInWithYouVersionPermission.bibles]}
  *         onAuthError={(err) => console.error(err)}
  *       />
  *     </div>
@@ -83,19 +83,18 @@ export interface SignInButtonProps extends React.ButtonHTMLAttributes<HTMLButton
  *
  * @example
  * // Example: different button styles shown in the example app
- * <SignInButton /> // default light background, labeled
- * <SignInButton size="short" variant="outline" /> // shorter label with outline
+ * <YouVersionAuthButton /> // default light background, labeled
+ * <YouVersionAuthButton size="short" variant="outline" /> // shorter label with outline
  *
  * @example
  * // Example showing permission enum usage from the example app
  * import { SignInWithYouVersionPermission } from '@youversion/platform-react-ui';
  *
- * <SignInButton
- *   requiredPermissions={[SignInWithYouVersionPermission.bibles]}
- *   optionalPermissions={[SignInWithYouVersionPermission.highlights]}
+ * <YouVersionAuthButton
+ *   permissions={[SignInWithYouVersionPermission.bibles]}
  * />
  *
  */
-export declare const SignInButton: React.ForwardRefExoticComponent<SignInButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export declare const YouVersionAuthButton: React.ForwardRefExoticComponent<YouVersionAuthButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export {};
-//# sourceMappingURL=SignInButton.d.ts.map
+//# sourceMappingURL=YouVersionAuthButton.d.ts.map

package/dist/components/YouVersionAuthButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"YouVersionAuthButton.d.ts","sourceRoot":"","sources":["../../src/components/YouVersionAuthButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,oCAAoC,EAAE,MAAM,2BAA2B,CAAC;AAMtF,UAAU,eAAe;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACrC;;OAEG;IACH,WAAW,CAAC,EAAE,oCAAoC,EAAE,CAAC;IACrD,WAAW,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,yBACf,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EACnD,eAAe;IACjB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC9B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;IACnC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IACpC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC;;;;;;;;;SASK;IACL,IAAI,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;CACtC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCG;AACH,eAAO,MAAM,oBAAoB,qGAmIhC,CAAC"}

package/dist/components/{SignInButton.stories.d.ts → YouVersionAuthButton.stories.d.ts}

@@ -1,15 +1,16 @@
 import type { StoryObj } from '@storybook/react-vite';
 declare const meta: {
     title: string;
-    component: import("react").ForwardRefExoticComponent<import("./SignInButton").SignInButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+    component: import("react").ForwardRefExoticComponent<import("./YouVersionAuthButton").YouVersionAuthButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
     parameters: {
         layout: string;
     };
     tags: string[];
     beforeEach(): Promise<void>;
     args: {
-        onSuccess: import("storybook/test").Mock<(...args: any[]) => any>;
+        redirectUrl: string;
         onAuthError: import("storybook/test").Mock<(...args: any[]) => any>;
+        mode: "auto";
     };
     argTypes: {
         onAuthError: {
@@ -17,22 +18,18 @@ declare const meta: {
                 disable: true;
             };
         };
-        onSuccess: {
+        permissions: {
             table: {
                 disable: true;
             };
         };
-        optionalPermissions: {
-            table: {
-                disable: true;
-            };
-        };
-        requiredPermissions: {
-            table: {
-                disable: true;
+        background: {
+            control: {
+                type: "select";
             };
+            options: string[];
         };
-        background: {
+        mode: {
             control: {
                 type: "select";
             };
@@ -85,4 +82,4 @@ export declare const DarkRectangleShortOutline: Story;
 export declare const DarkRectangleIcon: Story;
 export declare const DarkRectangleIconOutline: Story;
 export declare const InteractionTestWithMockedAuth: Story;
-//# sourceMappingURL=SignInButton.stories.d.ts.map
+//# sourceMappingURL=YouVersionAuthButton.stories.d.ts.map

package/dist/components/YouVersionAuthButton.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"YouVersionAuthButton.stories.d.ts","sourceRoot":"","sources":["../../src/components/YouVersionAuthButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAQ5D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+DmC,CAAC;AAE9C,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,YAAY,EAAE,KAI1B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAIxB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAK/B,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAIvB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAK9B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAI5B,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAKnC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAKjC,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,KAMxC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAKhC,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAMvC,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAIlB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAKzB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAKvB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAM9B,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAKtB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAM7B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAK3B,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAMlC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAMhC,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KAOvC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAM/B,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,KAOtC,CAAC;AAEF,eAAO,MAAM,6BAA6B,EAAE,KAc3C,CAAC"}

package/dist/components/index.d.ts

@@ -1,7 +1,7 @@
 export { BibleChapterPicker, type RootProps, type TriggerProps } from './bible-chapter-picker';
 export { BibleReader, type BibleReaderRootProps } from './bible-reader';
 export { BibleVersionPicker, type BibleVersionPickerRootProps, type BibleVersionPickerTriggerProps, } from './bible-version-picker';
-export { SignInButton, type SignInButtonProps } from './SignInButton';
+export { YouVersionAuthButton, type YouVersionAuthButtonProps } from './YouVersionAuthButton';
 export { VerseOfTheDay, type VerseOfTheDayProps } from './verse-of-the-day';
 export { BibleTextView, type BibleTextViewProps } from './verse';
 export { BibleWidgetView, type BibleWidgetViewProps } from './bible-widget-view';

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,KAAK,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC/F,OAAO,EAAE,WAAW,EAAE,KAAK,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACxE,OAAO,EACL,kBAAkB,EAClB,KAAK,2BAA2B,EAChC,KAAK,8BAA8B,GACpC,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACtE,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,KAAK,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC/F,OAAO,EAAE,WAAW,EAAE,KAAK,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACxE,OAAO,EACL,kBAAkB,EAClB,KAAK,2BAA2B,EAChC,KAAK,8BAA8B,GACpC,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,wBAAwB,CAAC;AAC9F,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAC;AACjE,OAAO,EAAE,eAAe,EAAE,KAAK,oBAAoB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/components/verse-of-the-day.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"verse-of-the-day.stories.d.ts","sourceRoot":"","sources":["../../src/components/verse-of-the-day.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAK5D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,QAAA,MAAM,IAAI;;;;;;;;;yBA2CE,KAAK,CAAC,aAAa,KAAG,KAAK,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCd,CAAC;AAEvC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAoCrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAInB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC"}
+{"version":3,"file":"verse-of-the-day.stories.d.ts","sourceRoot":"","sources":["../../src/components/verse-of-the-day.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAK5D,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD,QAAA,MAAM,IAAI;;;;;;;;;yBA2CE,KAAK,CAAC,aAAa,KAAG,KAAK,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsCd,CAAC;AAEvC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAmCrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAInB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC"}