diff --git a/custom_components/reflex_clerk_api/__init__.py b/custom_components/reflex_clerk_api/__init__.py index e480af7..e935c06 100644 --- a/custom_components/reflex_clerk_api/__init__.py +++ b/custom_components/reflex_clerk_api/__init__.py @@ -25,6 +25,12 @@ sign_out_button, sign_up_button, ) +from .organization_components import ( + create_organization, + organization_profile, + organization_switcher, + organization_list, +) from .user_components import user_button, user_profile __all__ = [ @@ -36,7 +42,11 @@ "clerk_loaded", "clerk_loading", "clerk_provider", + "create_organization", "on_load", + "organization_list", + "organization_profile", + "organization_switcher", "protect", "redirect_to_user_profile", "register_on_auth_change_handler", diff --git a/custom_components/reflex_clerk_api/organization_components.py b/custom_components/reflex_clerk_api/organization_components.py index 3883d0e..bb1ced1 100644 --- a/custom_components/reflex_clerk_api/organization_components.py +++ b/custom_components/reflex_clerk_api/organization_components.py @@ -1,6 +1,7 @@ -from typing import Optional +import reflex as rx from reflex_clerk_api.base import ClerkBase +from reflex_clerk_api.models import Appearance class CreateOrganization(ClerkBase): @@ -9,24 +10,30 @@ class CreateOrganization(ClerkBase): This component renders Clerk's React component, allowing users to set up new organizations with customizable appearance and routing. - - Props: - appearance: Optional object to style your components. Will only affect Clerk components. - path: The path where the component is mounted when routing is set to 'path'. - routing: The routing strategy for your pages. Defaults to 'path' for frameworks - that handle routing, or 'hash' for other SDKs. - after_create_organization_url: The full URL or path to navigate to after creating an organization. - fallback: An optional element to be rendered while the component is mounting. """ tag = "CreateOrganization" - # Optional props that CreateOrganization supports - appearance: Optional[str] = None - path: Optional[str] = None - routing: Optional[str] = None - after_create_organization_url: Optional[str] = None - fallback: Optional[str] = None + appearance: Appearance | None = None + "Optional object to style your components. Will only affect Clerk components." + + path: str | None = None + "The path where the component is mounted when routing is set to 'path'." + + routing: str | None = None + "The routing strategy for your pages. Defaults to 'path' for frameworks that handle routing, or 'hash' for other SDKs." + + after_create_organization_url: str | None = None + "The full URL or path to navigate to after creating an organization." + + skip_invitation_screen: bool | None = None + "Controls whether to skip the invitation screen when creating an organization." + + hide_slug: bool | None = None + "Controls whether the optional slug field in the Organization creation screen is hidden." + + fallback: rx.Component | None = None + "An optional element to be rendered while the component is mounting." class OrganizationProfile(ClerkBase): @@ -35,26 +42,27 @@ class OrganizationProfile(ClerkBase): This component renders Clerk's React component, allowing users to manage organization information, members, billing, and security settings. - - Props: - appearance: Optional object to style your components. Will only affect Clerk components. - path: The path where the component is mounted when routing is set to 'path'. - routing: The routing strategy for your pages. Defaults to 'path' for frameworks - that handle routing, or 'hash' for other SDKs. - after_leave_organization_url: The full URL or path to navigate to after leaving an organization. - custom_pages: An array of custom pages to add to the organization profile. - fallback: An optional element to be rendered while the component is mounting. """ tag = "OrganizationProfile" - # Optional props that OrganizationProfile supports - appearance: Optional[str] = None - path: Optional[str] = None - routing: Optional[str] = None - after_leave_organization_url: Optional[str] = None - custom_pages: Optional[str] = None - fallback: Optional[str] = None + appearance: Appearance | None = None + "Optional object to style your components. Will only affect Clerk components." + + path: str | None = None + "The path where the component is mounted when routing is set to 'path'." + + routing: str | None = None + "The routing strategy for your pages. Defaults to 'path' for frameworks that handle routing, or 'hash' for other SDKs." + + after_leave_organization_url: str | None = None + "The full URL or path to navigate to after leaving an organization." + + custom_pages: list | None = None + "An array of custom pages to add to the organization profile." + + fallback: rx.Component | None = None + "An optional element to be rendered while the component is mounting." class OrganizationSwitcher(ClerkBase): @@ -63,35 +71,48 @@ class OrganizationSwitcher(ClerkBase): This component renders Clerk's React component, providing a dropdown interface for organization switching with customizable appearance. - - Props: - appearance: Optional object to style your components. Will only affect Clerk components. - organization_profile_mode: Controls whether selecting the organization opens as a modal or navigates to a page. - organization_profile_url: The full URL or path leading to the organization management interface. - create_organization_mode: Controls whether selecting create organization opens as a modal or navigates to a page. - create_organization_url: The full URL or path leading to the create organization interface. - after_leave_organization_url: The full URL or path to navigate to after leaving an organization. - after_create_organization_url: The full URL or path to navigate to after creating an organization. - after_select_organization_url: The full URL or path to navigate to after selecting an organization. - default_open: Controls whether the OrganizationSwitcher should open by default during the first render. - hide_personal_account: Controls whether the personal account option is hidden in the switcher. - fallback: An optional element to be rendered while the component is mounting. """ tag = "OrganizationSwitcher" - # Optional props that OrganizationSwitcher supports - appearance: Optional[str] = None - organization_profile_mode: Optional[str] = None - organization_profile_url: Optional[str] = None - create_organization_mode: Optional[str] = None - create_organization_url: Optional[str] = None - after_leave_organization_url: Optional[str] = None - after_create_organization_url: Optional[str] = None - after_select_organization_url: Optional[str] = None - default_open: Optional[str] = None - hide_personal_account: Optional[str] = None - fallback: Optional[str] = None + appearance: Appearance | None = None + "Optional object to style your components. Will only affect Clerk components." + + organization_profile_mode: str | None = None + "Controls whether selecting the organization opens as a modal or navigates to a page. Defaults to 'modal'." + + organization_profile_url: str | None = None + "The full URL or path leading to the organization management interface." + + organization_profile_props: dict | None = None + "Specify options for the underlying OrganizationProfile component." + + create_organization_mode: str | None = None + "Controls whether selecting create organization opens as a modal or navigates to a page. Defaults to 'modal'." + + create_organization_url: str | None = None + "The full URL or path leading to the create organization interface." + + after_leave_organization_url: str | None = None + "The full URL or path to navigate to after leaving an organization." + + after_create_organization_url: str | None = None + "The full URL or path to navigate to after creating an organization." + + after_select_organization_url: str | None = None + "The full URL or path to navigate to after selecting an organization." + + default_open: bool | None = None + "Controls whether the OrganizationSwitcher should open by default during the first render." + + hide_personal: bool | None = None + "Controls whether the personal account option is hidden in the switcher." + + hide_slug: bool | None = None + "Controls whether the optional slug field in the Organization creation screen is hidden." + + fallback: rx.Component | None = None + "An optional element to be rendered while the component is mounting." class OrganizationList(ClerkBase): @@ -100,31 +121,39 @@ class OrganizationList(ClerkBase): This component renders Clerk's React component, providing an interface to view and manage organization memberships. - - Props: - appearance: Optional object to style your components. Will only affect Clerk components. - after_create_organization_url: The full URL or path to navigate to after creating an organization. - after_select_organization_url: The full URL or path to navigate to after selecting an organization. - after_select_personal_url: The full URL or path to navigate to after selecting the personal account. - create_organization_mode: Controls whether selecting create organization opens as a modal or navigates to a page. - create_organization_url: The full URL or path leading to the create organization interface. - hide_personal_account: Controls whether the personal account option is hidden in the list. - skip_invitation_screen: Controls whether to skip the invitation screen when creating an organization. - fallback: An optional element to be rendered while the component is mounting. """ tag = "OrganizationList" - # Optional props that OrganizationList supports - appearance: Optional[str] = None - after_create_organization_url: Optional[str] = None - after_select_organization_url: Optional[str] = None - after_select_personal_url: Optional[str] = None - create_organization_mode: Optional[str] = None - create_organization_url: Optional[str] = None - hide_personal_account: Optional[str] = None - skip_invitation_screen: Optional[str] = None - fallback: Optional[str] = None + appearance: Appearance | None = None + "Optional object to style your components. Will only affect Clerk components." + + after_create_organization_url: str | None = None + "The full URL or path to navigate to after creating an organization." + + after_select_organization_url: str | None = None + "The full URL or path to navigate to after selecting an organization." + + after_select_personal_url: str | None = None + "The full URL or path to navigate to after selecting the personal account." + + create_organization_mode: str | None = None + "Controls whether selecting create organization opens as a modal or navigates to a page. Defaults to 'modal'." + + create_organization_url: str | None = None + "The full URL or path leading to the create organization interface." + + hide_personal: bool | None = None + "Controls whether the personal account option is hidden in the list." + + hide_slug: bool | None = None + "Controls whether the optional slug field in the Organization creation screen is hidden." + + skip_invitation_screen: bool | None = None + "Controls whether to skip the invitation screen when creating an organization." + + fallback: rx.Component | None = None + "An optional element to be rendered while the component is mounting." create_organization = CreateOrganization.create