@hellocoop/react 1.0.0

package/dist/auth.d.ts

@@ -0,0 +1,20 @@
+import type { Claims } from '@hellocoop/types';
+type AuthCookie = {
+    sub: string;
+    iat: number;
+} & Claims & {
+    [key: string]: any;
+};
+export type Auth = {
+    isLoggedIn: false;
+} | ({
+    isLoggedIn: true;
+} & AuthCookie);
+export type AuthState = {
+    auth: Auth | {};
+    isLoading: boolean;
+    isLoggedIn: boolean | undefined;
+};
+export declare const useAuth: () => AuthState;
+export {};
+//# sourceMappingURL=auth.d.ts.map

package/dist/auth.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"auth.d.ts","sourceRoot":"","sources":["../src/auth.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AAe9C,KAAK,UAAU,GAAG;IACV,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAA;CACd,GAAG,MAAM,GAAG;IACT,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAC;CACtB,CAAA;AAEL,MAAM,MAAM,IAAI,GAAG;IACf,UAAU,EAAE,KAAK,CAAA;CACpB,GAAG,CAAC;IACD,UAAU,EAAE,IAAI,CAAC;CACpB,GAAG,UAAU,CAAE,CAAA;AAGhB,MAAM,MAAM,SAAS,GAAG;IACpB,IAAI,EAAE,IAAI,GAAG,EAAE,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,GAAG,SAAS,CAAA;CAClC,CAAA;AAED,eAAO,MAAM,OAAO,QAAO,SAS1B,CAAA"}

package/dist/auth.js

@@ -0,0 +1,31 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAuth = void 0;
+const swr_1 = __importDefault(require("swr"));
+const provider_1 = require("./provider");
+const fetcher = async (url) => {
+    try {
+        const response = await fetch(url);
+        const auth = await response.json();
+        return auth;
+    }
+    catch (err) {
+        console.error(err);
+        return undefined;
+    }
+};
+const useAuth = () => {
+    const defaultAuth = (0, provider_1.useHelloProviderContext)();
+    const { data: auth, isLoading } = (0, swr_1.default)(provider_1.routeConfig.auth, fetcher, {
+        fallbackData: defaultAuth
+    });
+    return {
+        auth: auth || {},
+        isLoading,
+        isLoggedIn: auth === null || auth === void 0 ? void 0 : auth.isLoggedIn
+    };
+};
+exports.useAuth = useAuth;

package/dist/buttons.d.ts

@@ -0,0 +1,35 @@
+import React from 'react';
+import type { ProviderHint, Scope } from '@hellocoop/types';
+import { Button } from '@hellocoop/types';
+interface CommonButtonProps {
+    label?: string;
+    onClick?: any;
+    style?: any;
+    disabled?: boolean;
+    showLoader?: boolean;
+    color?: Button.Color;
+    theme?: Button.Theme;
+    hover?: Button.Hover;
+    targetURI?: string;
+    providerHint?: ProviderHint[] | string;
+}
+export interface BaseButtonProps extends CommonButtonProps {
+    scope?: Scope[] | string;
+    updateScope?: Button.UpdateScope;
+}
+export interface LoginButtonProps extends CommonButtonProps {
+    scope?: Scope[] | string;
+}
+export interface UpdateButtonProps extends CommonButtonProps {
+    updateScope?: Button.UpdateScope;
+}
+export declare function ContinueButton(props: LoginButtonProps): React.JSX.Element;
+export declare function LoginButton(props: LoginButtonProps): React.JSX.Element;
+export declare function UpdateEmailButton(props: UpdateButtonProps): React.JSX.Element;
+export declare function UpdatePictureButton(props: UpdateButtonProps): React.JSX.Element;
+export declare function UpdateDiscordButton(props: UpdateButtonProps): React.JSX.Element;
+export declare function UpdateTwitterButton(props: UpdateButtonProps): React.JSX.Element;
+export declare function UpdateGitHubButton(props: UpdateButtonProps): React.JSX.Element;
+export declare function UpdateGitLabButton(props: UpdateButtonProps): React.JSX.Element;
+export {};
+//# sourceMappingURL=buttons.d.ts.map

package/dist/buttons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"buttons.d.ts","sourceRoot":"","sources":["../src/buttons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAA;AAC3D,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AAMzC,UAAU,iBAAiB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,GAAG,CAAA;IACb,KAAK,CAAC,EAAE,GAAG,CAAA;IACX,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC,KAAK,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC,KAAK,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC,KAAK,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,YAAY,CAAC,EAAE,YAAY,EAAE,GAAG,MAAM,CAAA;CACzC;AAED,MAAM,WAAW,eAAgB,SAAQ,iBAAiB;IACtD,KAAK,CAAC,EAAE,KAAK,EAAE,GAAG,MAAM,CAAA;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC,WAAW,CAAA;CACnC;AAED,MAAM,WAAW,gBAAiB,SAAQ,iBAAiB;IACvD,KAAK,CAAC,EAAE,KAAK,EAAE,GAAG,MAAM,CAAA;CAC3B;AAED,MAAM,WAAW,iBAAkB,SAAQ,iBAAiB;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC,WAAW,CAAA;CACnC;AAyDD,wBAAgB,cAAc,CAAC,KAAK,EAAE,gBAAgB,qBAErD;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,qBAElD;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,iBAAiB,qBAEzD;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,iBAAiB,qBAE3D;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,iBAAiB,qBAE3D;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,iBAAiB,qBAE3D;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,iBAAiB,qBAE1D;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,iBAAiB,qBAE1D"}

package/dist/buttons.js

@@ -0,0 +1,105 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UpdateGitLabButton = exports.UpdateGitHubButton = exports.UpdateTwitterButton = exports.UpdateDiscordButton = exports.UpdatePictureButton = exports.UpdateEmailButton = exports.LoginButton = exports.ContinueButton = void 0;
+const react_1 = __importStar(require("react"));
+const types_1 = require("@hellocoop/types");
+const provider_1 = require("./provider");
+let checkedForStylesheet = false;
+function BaseButton({ scope, updateScope, targetURI, providerHint, label, style, color = "black", theme = "ignore-light", hover = "pop", showLoader = false, disabled = false }) {
+    var _a;
+    //check if dev has added Hellō stylesheet to pages with Hellō buttons
+    if (!checkedForStylesheet) {
+        const hasStylesheet = typeof document != 'undefined' && !Array.from(document.head.getElementsByTagName('link')).find((element) => {
+            var _a;
+            return element.getAttribute('rel') === 'stylesheet' &&
+                ((_a = element.getAttribute('href')) === null || _a === void 0 ? void 0 : _a.startsWith(types_1.Button.STYLES_URL));
+        });
+        if (!hasStylesheet)
+            console.info('Could not find Hellō stylesheet. Please add to pages with Hellō buttons. See http://hello.dev/docs/buttons/#stylesheet for more info.');
+        checkedForStylesheet = true;
+    }
+    const helloBtnClass = (_a = types_1.Button.CLASS_MAPPING[color]) === null || _a === void 0 ? void 0 : _a[theme];
+    const [clicked, setClicked] = (0, react_1.useState)(false);
+    const loginRoute = new URL(provider_1.routeConfig.login, window.location.origin);
+    if (scope) {
+        if (typeof scope == 'string')
+            loginRoute.searchParams.set("scope", scope);
+        else
+            loginRoute.searchParams.set("scope", scope.join(" "));
+    }
+    targetURI = targetURI || (typeof window != 'undefined' && window.location.pathname) || "";
+    //window can be undefined when running server-side
+    loginRoute.searchParams.set("target_uri", targetURI);
+    if (updateScope)
+        loginRoute.searchParams.set("scope", "profile_update " + updateScope);
+    if (providerHint) {
+        if (typeof providerHint == 'string')
+            loginRoute.searchParams.set("provider_hint", providerHint);
+        else
+            loginRoute.searchParams.set("provider_hint", providerHint.join(" "));
+    }
+    const onClickHandler = () => {
+        setClicked(true);
+        window.location.href = loginRoute.href;
+    };
+    return (react_1.default.createElement("button", { onClick: onClickHandler, disabled: disabled || clicked, style: style, className: `hello-btn ${helloBtnClass} ${types_1.Button.HOVER_MAPPING[hover]} ${(showLoader || clicked) ? 'hello-btn-loader' : ''}` }, label));
+}
+function ContinueButton(props) {
+    return react_1.default.createElement(BaseButton, { ...props, label: "\u014D\u00A0\u00A0\u00A0Continue with Hell\u014D" });
+}
+exports.ContinueButton = ContinueButton;
+function LoginButton(props) {
+    return react_1.default.createElement(BaseButton, { ...props, label: "\u014D\u00A0\u00A0\u00A0Log in with Hell\u014D" });
+}
+exports.LoginButton = LoginButton;
+function UpdateEmailButton(props) {
+    return react_1.default.createElement(BaseButton, { ...props, label: "\u014D\u00A0\u00A0\u00A0Update Email with Hell\u014D", updateScope: "email", style: { width: '275px' } });
+}
+exports.UpdateEmailButton = UpdateEmailButton;
+function UpdatePictureButton(props) {
+    return react_1.default.createElement(BaseButton, { ...props, label: "\u014D\u00A0\u00A0\u00A0Update Picture with Hell\u014D", updateScope: "picture", style: { width: '275px' } });
+}
+exports.UpdatePictureButton = UpdatePictureButton;
+function UpdateDiscordButton(props) {
+    return react_1.default.createElement(BaseButton, { ...props, label: "\u014D\u00A0\u00A0\u00A0Update Discord with Hell\u014D", updateScope: "discord", style: { width: '275px' } });
+}
+exports.UpdateDiscordButton = UpdateDiscordButton;
+function UpdateTwitterButton(props) {
+    return react_1.default.createElement(BaseButton, { ...props, label: "\u014D\u00A0\u00A0\u00A0Update Twitter with Hell\u014D", updateScope: "twitter", style: { width: '275px' } });
+}
+exports.UpdateTwitterButton = UpdateTwitterButton;
+function UpdateGitHubButton(props) {
+    return react_1.default.createElement(BaseButton, { ...props, label: "\u014D\u00A0\u00A0\u00A0Update GitHub with Hell\u014D", updateScope: "github", style: { width: '275px' } });
+}
+exports.UpdateGitHubButton = UpdateGitHubButton;
+function UpdateGitLabButton(props) {
+    return react_1.default.createElement(BaseButton, { ...props, label: "\u014D\u00A0\u00A0\u00A0Update GitLab with Hell\u014D", updateScope: "gitlab", style: { width: '275px' } });
+}
+exports.UpdateGitLabButton = UpdateGitLabButton;
+//TBD
+// export function UpdateProfileButton() {
+//     return <UpdateBaseButton label="ō&nbsp;&nbsp;&nbsp;Update Picture with Hellō" updateScope="profile" />
+// }

package/dist/index.d.ts

@@ -0,0 +1,6 @@
+export * from './auth';
+export * from './buttons';
+export * from './login-status';
+export * from './logout';
+export * from './provider';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA;AACtB,cAAc,WAAW,CAAA;AACzB,cAAc,gBAAgB,CAAA;AAC9B,cAAc,UAAU,CAAA;AACxB,cAAc,YAAY,CAAA"}

package/dist/index.js

@@ -0,0 +1,21 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./auth"), exports);
+__exportStar(require("./buttons"), exports);
+__exportStar(require("./login-status"), exports);
+__exportStar(require("./logout"), exports);
+__exportStar(require("./provider"), exports);

package/dist/login-status.d.ts

@@ -0,0 +1,7 @@
+export declare function LoggedIn({ children }: {
+    children: any;
+}): any;
+export declare function LoggedOut({ children }: {
+    children: any;
+}): any;
+//# sourceMappingURL=login-status.d.ts.map

package/dist/login-status.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"login-status.d.ts","sourceRoot":"","sources":["../src/login-status.tsx"],"names":[],"mappings":"AAIA,wBAAgB,QAAQ,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAC,GAAG,CAAA;CAAE,OAGtD;AAED,wBAAgB,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAC,GAAG,CAAA;CAAE,OAGvD"}

package/dist/login-status.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LoggedOut = exports.LoggedIn = void 0;
+const auth_1 = require("./auth");
+const isLoggedIn = () => { var _a; return ((_a = (0, auth_1.useAuth)()) === null || _a === void 0 ? void 0 : _a.isLoggedIn) || false; };
+function LoggedIn({ children }) {
+    if (isLoggedIn())
+        return children;
+}
+exports.LoggedIn = LoggedIn;
+function LoggedOut({ children }) {
+    if (!isLoggedIn())
+        return children;
+}
+exports.LoggedOut = LoggedOut;

package/dist/logout.d.ts

@@ -0,0 +1,3 @@
+export declare const getLogOutRoute: () => string;
+export declare function logOut(): void;
+//# sourceMappingURL=logout.d.ts.map

package/dist/logout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"logout.d.ts","sourceRoot":"","sources":["../src/logout.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,cAA2B,CAAA;AAEtD,wBAAgB,MAAM,SAErB"}

package/dist/logout.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.logOut = exports.getLogOutRoute = void 0;
+const provider_1 = require("./provider");
+const getLogOutRoute = () => provider_1.routeConfig.logout;
+exports.getLogOutRoute = getLogOutRoute;
+function logOut() {
+    window.location.href = provider_1.routeConfig.logout;
+}
+exports.logOut = logOut;

package/dist/provider.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export type RouteConfig = {
+    login: string;
+    auth: string;
+    logout: string;
+};
+export declare const routeConfig: RouteConfig;
+declare const HelloProvider: ({ children, auth, config }: any) => React.JSX.Element;
+declare const useHelloProviderContext: () => undefined;
+export { HelloProvider, useHelloProviderContext };
+//# sourceMappingURL=provider.d.ts.map

package/dist/provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAA;AAExD,MAAM,MAAM,WAAW,GAAG;IACtB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;CACjB,CAAA;AACD,eAAO,MAAM,WAAW,EAAE,WAIzB,CAAA;AAKD,QAAA,MAAM,aAAa,+BAAgC,GAAG,sBASrD,CAAA;AAED,QAAA,MAAM,uBAAuB,iBAE5B,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,uBAAuB,EAAE,CAAA"}

package/dist/provider.js

@@ -0,0 +1,47 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useHelloProviderContext = exports.HelloProvider = exports.routeConfig = void 0;
+const react_1 = __importStar(require("react"));
+exports.routeConfig = {
+    login: '/api/hellocoop?login=true',
+    auth: '/api/hellocoop?auth=true',
+    logout: '/api/hellocoop?logout=true',
+};
+const HelloContext = (0, react_1.createContext)(undefined);
+const HelloProvider = ({ children, auth, config }) => {
+    if (config === null || config === void 0 ? void 0 : config.login)
+        exports.routeConfig.login = config.login;
+    if (config === null || config === void 0 ? void 0 : config.auth)
+        exports.routeConfig.auth = config.auth;
+    if (config === null || config === void 0 ? void 0 : config.logout)
+        exports.routeConfig.logout = config.logout;
+    return (react_1.default.createElement(HelloContext.Provider, { value: auth }, children));
+};
+exports.HelloProvider = HelloProvider;
+const useHelloProviderContext = () => {
+    return (0, react_1.useContext)(HelloContext);
+};
+exports.useHelloProviderContext = useHelloProviderContext;

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "@hellocoop/react",
+  "version": "1.0.0",
+  "description": "React SDK for Hellō https://hello.dev",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/hellocoop/packages.git"
+  },
+  "homepage": "https://www.hello.dev/docs/sdks/react",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist/"
+  ],
+  "keywords": [
+    "reactjs",
+    "react",
+    "react.js",
+    "hello",
+    "openid",
+    "oidc",
+    "sso"
+  ],
+  "author": {
+    "name": "Hello Identity Co-op",
+    "email": "contact@hello.coop",
+    "url": "https://hello.coop"
+  },
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/hellocoop/packages/issues"
+  },
+  "scripts": {
+    "watch": "tsc --watch --declaration",
+    "build": "npm run build:clean && npm run build:src",
+    "build:clean": "rimraf dist/",
+    "build:src": "tsc --declaration"
+  },
+  "peerDependencies": {
+    "react": ">=17",
+    "react-dom": ">=17"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.21",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "rimraf": "^5.0.1",
+    "typescript": "^5.2.2"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "dependencies": {
+    "swr": "^2.2.2"
+  }
+}