diff --git a/CHANGELOG.md b/CHANGELOG.md index d7e4a28..237b371 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,13 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/) and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html). +## [0.0.1a4] - 2025-12-05 +### Added +- Added support for Clerk Provider themes, as well as ids for support with callbacks + +## Fixed +- Fixed issue with DashAuth components not being available + ## [0.0.1a3] - 2025-11-25 ## Fixed - Fixed issue with Clerk components missing and also adding necessary session data to callback for login. diff --git a/dash_auth_plus/clerk_auth.py b/dash_auth_plus/clerk_auth.py index 1d36f3c..f58b77c 100644 --- a/dash_auth_plus/clerk_auth.py +++ b/dash_auth_plus/clerk_auth.py @@ -379,7 +379,7 @@ def add_clerk_script(index_string): if not self.initialized: return index_string - if clerk_script and "" in index_string: + if self.clerk_script and "" in index_string: # Inject scripts and styles before closing head tag index_string = index_string.replace( "", diff --git a/dash_auth_plus/package-info.json b/dash_auth_plus/package-info.json index 839b809..20434d9 100644 --- a/dash_auth_plus/package-info.json +++ b/dash_auth_plus/package-info.json @@ -19,6 +19,7 @@ "devDependencies": { "@babel/core": "^7.24.5", "@clerk/clerk-react": "^5.2.10", + "@clerk/themes": "^2.4.42", "@types/ramda": "^0.30.1", "@types/react": "^18.2.55", "@types/react-dom": "^18.2.19", diff --git a/package-lock.json b/package-lock.json index e6858f1..027912f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "devDependencies": { "@babel/core": "^7.24.5", "@clerk/clerk-react": "^5.2.10", + "@clerk/themes": "^2.4.42", "@types/ramda": "^0.30.1", "@types/react": "^18.2.55", "@types/react-dom": "^18.2.19", @@ -347,19 +348,19 @@ } }, "node_modules/@clerk/shared": { - "version": "3.9.6", - "resolved": "https://registry.npmjs.org/@clerk/shared/-/shared-3.9.6.tgz", - "integrity": "sha512-zScvDbNKBcGfkD7Db4LCoEbB8qZ/WFwuB77xqRgXiHDa+pBzEPyFB5nQSt1zQfLqOK3POng0GsPBoXEWKb4Ikw==", + "version": "3.38.0", + "resolved": "https://registry.npmjs.org/@clerk/shared/-/shared-3.38.0.tgz", + "integrity": "sha512-9R63kyHXq4DntdQXWxwpFZSq04AR8rby0cqAnUfTsAddyxQOmyjgHZADKkrMYUbhGiJnLBysUmZBPyVizjaopg==", "dev": true, "hasInstallScript": true, "license": "MIT", "dependencies": { - "@clerk/types": "^4.60.0", + "csstype": "3.1.3", "dequal": "2.0.3", "glob-to-regexp": "0.4.1", "js-cookie": "3.0.5", "std-env": "^3.9.0", - "swr": "^2.3.3" + "swr": "2.3.4" }, "engines": { "node": ">=18.17.0" @@ -377,6 +378,20 @@ } } }, + "node_modules/@clerk/themes": { + "version": "2.4.42", + "resolved": "https://registry.npmjs.org/@clerk/themes/-/themes-2.4.42.tgz", + "integrity": "sha512-jKsX82ZefeBZDIpolfXK4NkZM0YmwtlgHKJtEhHprBeO9ZaxW781ydhY9D84YuFeTP7+CE3WKLgOKj3Ar0pJlw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@clerk/shared": "^3.38.0", + "tslib": "2.8.1" + }, + "engines": { + "node": ">=18.17.0" + } + }, "node_modules/@clerk/types": { "version": "4.60.0", "resolved": "https://registry.npmjs.org/@clerk/types/-/types-4.60.0.tgz", @@ -5240,9 +5255,9 @@ } }, "node_modules/swr": { - "version": "2.3.3", - "resolved": "https://registry.npmjs.org/swr/-/swr-2.3.3.tgz", - "integrity": "sha512-dshNvs3ExOqtZ6kJBaAsabhPdHyeY4P2cKwRCniDVifBMoG/SVI7tfLWqPXriVspf2Rg4tPzXJTnwaihIeFw2A==", + "version": "2.3.4", + "resolved": "https://registry.npmjs.org/swr/-/swr-2.3.4.tgz", + "integrity": "sha512-bYd2lrhc+VarcpkgWclcUi92wYCpOgMws9Sd1hG1ntAu0NEy+14CbotuFjshBU2kt9rYj9TSmDcybpxpeTU1fg==", "dev": true, "license": "MIT", "dependencies": { @@ -5665,9 +5680,9 @@ } }, "node_modules/use-sync-external-store": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.5.0.tgz", - "integrity": "sha512-Rb46I4cGGVBmjamjphe8L/UnvJD+uPPtTkNvX5mZgqdbavhI4EbgIWJiIHXJ8bc/i9EQGPRh4DwEURJ552Do0A==", + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.6.0.tgz", + "integrity": "sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==", "dev": true, "license": "MIT", "peerDependencies": { diff --git a/package.json b/package.json index 839b809..20434d9 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "devDependencies": { "@babel/core": "^7.24.5", "@clerk/clerk-react": "^5.2.10", + "@clerk/themes": "^2.4.42", "@types/ramda": "^0.30.1", "@types/react": "^18.2.55", "@types/react-dom": "^18.2.19", diff --git a/src/ts/components/ClerkProvider.tsx b/src/ts/components/ClerkProvider.tsx index 4bd879c..cc6b305 100644 --- a/src/ts/components/ClerkProvider.tsx +++ b/src/ts/components/ClerkProvider.tsx @@ -1,16 +1,42 @@ import React, { PropsWithChildren } from "react"; import { ClerkProvider as ClerkClerkProvider } from '@clerk/clerk-react' +import { dark, neobrutalism } from '@clerk/themes' + +const themes = { + 'dark': dark, + 'neobrutalism': neobrutalism +}; export interface ClerkProviderProps { PUBLISHABLE_KEY: string; afterSignOutUrl?: string; children: React.ReactNode; + themeName?: string; + id?: string; + [key: string]: any; } -const ClerkProvider: React.FC> = ({ PUBLISHABLE_KEY, afterSignOutUrl, children, ...others }) => { +const ClerkProvider: React.FC> = ({ + PUBLISHABLE_KEY, + afterSignOutUrl, + children, + themeName, + ...others +}) => { + + const appearance = React.useMemo(() => { + const theme = themeName ? themes[themeName as keyof typeof themes] : undefined; + return theme ? { baseTheme: theme } : undefined; + }, [themeName]); + return ( - + {children} );