@thunderid/react 0.3.3 → 0.3.4

package/dist/cjs/components/presentation/OrganizationProfile/BaseOrganizationProfile.styles.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseOrganizationProfile.styles.cjs","names":[],"sources":["../../../../../src/components/presentation/OrganizationProfile/BaseOrganizationProfile.styles.ts"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {css} from '@emotion/css';\nimport {Theme} from '@thunderid/browser';\nimport {useMemo} from 'react';\n\n/**\n * Creates styles for the BaseOrganizationProfile component using BEM methodology\n * @param theme - The theme object containing design tokens\n * @param colorScheme - The current color scheme (used for memoization)\n * @returns Object containing CSS class names for component styling\n */\nconst useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>\n  useMemo(\n    () => ({\n      attributeItem: css`\n        display: flex;\n        gap: ${theme.vars.spacing.unit};\n        padding: calc(${theme.vars.spacing.unit} / 4) 0;\n        align-items: center;\n      `,\n      attributeKey: css`\n        font-size: 0.75rem;\n        font-weight: 500;\n        color: ${theme.vars.colors.text.secondary};\n        min-width: 80px;\n        flex-shrink: 0;\n      `,\n      attributeValue: css`\n        font-size: 0.75rem;\n        color: ${theme.vars.colors.text.primary};\n        word-break: break-word;\n        flex: 1;\n      `,\n      attributesList: css`\n        display: flex;\n        flex-direction: column;\n        gap: calc(${theme.vars.spacing.unit} / 4);\n      `,\n      card: css`\n        background: ${theme.vars.colors.background.surface};\n        border-radius: ${theme.vars.borderRadius.large};\n      `,\n      editButton: css`\n        min-width: auto;\n        padding: calc(${theme.vars.spacing.unit} / 2);\n        min-height: auto;\n      `,\n      field: css`\n        display: flex;\n        align-items: flex-start;\n        padding: calc(${theme.vars.spacing.unit} / 2) 0;\n        border-bottom: 1px solid ${theme.vars.colors.border};\n        min-height: 28px;\n        gap: ${theme.vars.spacing.unit};\n      `,\n      fieldActions: css`\n        display: flex;\n        align-items: center;\n        gap: calc(${theme.vars.spacing.unit} / 2);\n      `,\n      fieldContent: css`\n        flex: 1;\n        display: flex;\n        align-items: center;\n        gap: ${theme.vars.spacing.unit};\n      `,\n      fieldInput: css`\n        margin-bottom: 0;\n      `,\n      fieldLast: css`\n        border-bottom: none;\n      `,\n      handle: css`\n        font-size: 1rem;\n        color: ${theme.vars.colors.text.secondary};\n        margin: 0;\n        font-family: monospace;\n      `,\n      header: css`\n        display: flex;\n        align-items: center;\n        gap: calc(${theme.vars.spacing.unit} * 2);\n        margin-bottom: calc(${theme.vars.spacing.unit} * 3);\n        padding-bottom: calc(${theme.vars.spacing.unit} * 2);\n      `,\n      infoContainer: css`\n        display: flex;\n        flex-direction: column;\n        gap: ${theme.vars.spacing.unit};\n      `,\n      label: css`\n        font-size: 0.875rem;\n        font-weight: 500;\n        color: ${theme.vars.colors.text.secondary};\n        width: 120px;\n        flex-shrink: 0;\n        line-height: 28px;\n      `,\n      name: css`\n        font-size: 1.5rem;\n        font-weight: 600;\n        margin: 0 0 8px 0;\n        color: ${theme.vars.colors.text.primary};\n      `,\n      orgInfo: css`\n        flex: 1;\n      `,\n      permissionBadge: css`\n        padding: calc(${theme.vars.spacing.unit} / 4) ${theme.vars.spacing.unit};\n        border-radius: ${theme.vars.borderRadius.small};\n        font-size: 0.75rem;\n        background-color: ${theme.vars.colors.primary.main};\n        color: ${theme.vars.colors.primary.contrastText};\n        border: 1px solid ${theme.vars.colors.border};\n      `,\n      permissionsList: css`\n        display: flex;\n        flex-wrap: wrap;\n        gap: calc(${theme.vars.spacing.unit} / 2);\n      `,\n      placeholderButton: css`\n        font-style: italic;\n        text-decoration: underline;\n        opacity: 0.7;\n        padding: 0;\n        min-height: auto;\n      `,\n      popup: css`\n        padding: calc(${theme.vars.spacing.unit} * 2);\n      `,\n      root: css`\n        padding: calc(${theme.vars.spacing.unit} * 4);\n        min-width: 600px;\n        margin: 0 auto;\n        font-family: ${theme.vars.typography.fontFamily};\n      `,\n      statusBadge: css`\n        padding: calc(${theme.vars.spacing.unit} / 2) ${theme.vars.spacing.unit};\n        border-radius: ${theme.vars.borderRadius.small};\n        font-size: 0.75rem;\n        font-weight: 500;\n        color: white;\n        text-transform: uppercase;\n        letter-spacing: 0.5px;\n      `,\n      value: css`\n        color: ${theme.vars.colors.text.primary};\n        flex: 1;\n        display: flex;\n        align-items: center;\n        gap: ${theme.vars.spacing.unit};\n        overflow: hidden;\n        min-height: 28px;\n        line-height: 28px;\n        word-break: break-word;\n      `,\n      valueEmpty: css`\n        font-style: italic;\n        opacity: 0.7;\n      `,\n    }),\n    [theme, colorScheme],\n  );\n\nexport default useStyles;\n"],"mappings":";;;;;;;;;;;;;AA4BA,MAAM,aAAa,OAAc,0CAEtB;CACL,eAAe,iBAAG;;eAET,MAAM,KAAK,QAAQ,KAAK;wBACf,MAAM,KAAK,QAAQ,KAAK;;;CAG1C,cAAc,iBAAG;;;iBAGN,MAAM,KAAK,OAAO,KAAK,UAAU;;;;CAI5C,gBAAgB,iBAAG;;iBAER,MAAM,KAAK,OAAO,KAAK,QAAQ;;;;CAI1C,gBAAgB,iBAAG;;;oBAGL,MAAM,KAAK,QAAQ,KAAK;;CAEtC,MAAM,iBAAG;sBACO,MAAM,KAAK,OAAO,WAAW,QAAQ;yBAClC,MAAM,KAAK,aAAa,MAAM;;CAEjD,YAAY,iBAAG;;wBAEG,MAAM,KAAK,QAAQ,KAAK;;;CAG1C,OAAO,iBAAG;;;wBAGQ,MAAM,KAAK,QAAQ,KAAK;mCACb,MAAM,KAAK,OAAO,OAAO;;eAE7C,MAAM,KAAK,QAAQ,KAAK;;CAEjC,cAAc,iBAAG;;;oBAGH,MAAM,KAAK,QAAQ,KAAK;;CAEtC,cAAc,iBAAG;;;;eAIR,MAAM,KAAK,QAAQ,KAAK;;CAEjC,YAAY,iBAAG;;;CAGf,WAAW,iBAAG;;;CAGd,QAAQ,iBAAG;;iBAEA,MAAM,KAAK,OAAO,KAAK,UAAU;;;;CAI5C,QAAQ,iBAAG;;;oBAGG,MAAM,KAAK,QAAQ,KAAK;8BACd,MAAM,KAAK,QAAQ,KAAK;+BACvB,MAAM,KAAK,QAAQ,KAAK;;CAEjD,eAAe,iBAAG;;;eAGT,MAAM,KAAK,QAAQ,KAAK;;CAEjC,OAAO,iBAAG;;;iBAGC,MAAM,KAAK,OAAO,KAAK,UAAU;;;;;CAK5C,MAAM,iBAAG;;;;iBAIE,MAAM,KAAK,OAAO,KAAK,QAAQ;;CAE1C,SAAS,iBAAG;;;CAGZ,iBAAiB,iBAAG;wBACF,MAAM,KAAK,QAAQ,KAAK,QAAQ,MAAM,KAAK,QAAQ,KAAK;yBACvD,MAAM,KAAK,aAAa,MAAM;;4BAE3B,MAAM,KAAK,OAAO,QAAQ,KAAK;iBAC1C,MAAM,KAAK,OAAO,QAAQ,aAAa;4BAC5B,MAAM,KAAK,OAAO,OAAO;;CAE/C,iBAAiB,iBAAG;;;oBAGN,MAAM,KAAK,QAAQ,KAAK;;CAEtC,mBAAmB,iBAAG;;;;;;;CAOtB,OAAO,iBAAG;wBACQ,MAAM,KAAK,QAAQ,KAAK;;CAE1C,MAAM,iBAAG;wBACS,MAAM,KAAK,QAAQ,KAAK;;;uBAGzB,MAAM,KAAK,WAAW,WAAW;;CAElD,aAAa,iBAAG;wBACE,MAAM,KAAK,QAAQ,KAAK,QAAQ,MAAM,KAAK,QAAQ,KAAK;yBACvD,MAAM,KAAK,aAAa,MAAM;;;;;;;CAOjD,OAAO,iBAAG;iBACC,MAAM,KAAK,OAAO,KAAK,QAAQ;;;;eAIjC,MAAM,KAAK,QAAQ,KAAK;;;;;;CAMjC,YAAY,iBAAG;;;;CAIhB,GACD,CAAC,OAAO,YAAY,CACrB;AAEH,6CAAe"}

package/dist/cjs/components/presentation/OrganizationProfile/OrganizationProfile.cjs

@@ -1,126 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_useThunderID = require('../../../contexts/ThunderID/useThunderID.cjs');
-const require_useTranslation = require('../../../hooks/useTranslation.cjs');
-const require_BaseOrganizationProfile = require('./BaseOrganizationProfile.cjs');
-const require_getOrganization = require('../../../api/getOrganization.cjs');
-const require_updateOrganization = require('../../../api/updateOrganization.cjs');
-let __thunderid_browser = require("@thunderid/browser");
-__thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
-
-//#region src/components/presentation/OrganizationProfile/OrganizationProfile.tsx
-const logger = (0, __thunderid_browser.createPackageComponentLogger)("@thunderid/react", "OrganizationProfile");
-/**
-* OrganizationProfile component displays organization information in a
-* structured and styled format. It automatically fetches organization details
-* using the provided organization ID and displays them using BaseOrganizationProfile.
-*
-* The component supports editing functionality, allowing users to modify organization
-* fields inline. Updates are automatically synced with the backend via the SCIM2 API.
-*
-* This component is the React-specific implementation that automatically
-* retrieves the organization data from ThunderID API.
-*
-* @example
-* ```tsx
-* // Basic usage with editing enabled (default)
-* <OrganizationProfile organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1" />
-*
-* // Read-only mode
-* <OrganizationProfile
-*   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
-*   editable={false}
-* />
-*
-* // With card layout and custom fallbacks
-* <OrganizationProfile
-*   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
-*   cardLayout={true}
-*   loadingFallback={<div>Loading organization...</div>}
-*   errorFallback={<div>Failed to load organization</div>}
-*   fallback={<div>No organization data available</div>}
-* />
-*
-* // With custom fields configuration and update callback
-* <OrganizationProfile
-*   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
-*   fields={[
-*     { key: 'id', label: 'Organization ID', editable: false },
-*     { key: 'name', label: 'Organization Name', editable: true },
-*     { key: 'description', label: 'Description', editable: true, render: (value) => value || 'No description' },
-*     { key: 'created', label: 'Created Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
-*     { key: 'lastModified', label: 'Last Modified Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
-*     { key: 'attributes', label: 'Custom Attributes', editable: true }
-*   ]}
-*   onUpdate={async (payload) => {
-*     console.log('Organization updated:', payload);
-*     // payload contains the updated field values
-*     // The component automatically converts these to patch operations
-*   }}
-* />
-*
-* // In popup mode
-* <OrganizationProfile
-*   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
-*   mode="popup"
-*   open={isOpen}
-*   onOpenChange={setIsOpen}
-*   popupTitle="Edit Organization Profile"
-* />
-* ```
-*/
-const OrganizationProfile = ({ organizationId, mode = "default", open = false, onOpenChange, onUpdate, popupTitle, loadingFallback, errorFallback, preferences,...rest }) => {
-	const { baseUrl, instanceId } = require_useThunderID.default();
-	const { t } = require_useTranslation.default(preferences?.i18n);
-	const [organization, setOrganization] = (0, react.useState)(null);
-	const fetchOrganization = async () => {
-		if (!baseUrl || !organizationId) return;
-		try {
-			setOrganization(await require_getOrganization.default({
-				baseUrl,
-				instanceId,
-				organizationId
-			}));
-		} catch (err) {
-			logger.error("Failed to fetch organization:");
-			setOrganization(null);
-		}
-	};
-	(0, react.useEffect)(() => {
-		fetchOrganization();
-	}, [baseUrl, organizationId]);
-	const handleOrganizationUpdate = async (payload) => {
-		if (!baseUrl || !organizationId) return;
-		try {
-			await require_updateOrganization.default({
-				baseUrl,
-				instanceId,
-				operations: (0, __thunderid_browser.createPatchOperations)(payload),
-				organizationId
-			});
-			await fetchOrganization();
-			if (onUpdate) await onUpdate(payload);
-		} catch (err) {
-			logger.error("Failed to update organization:");
-			throw err;
-		}
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BaseOrganizationProfile.default, {
-		organization,
-		onUpdate: handleOrganizationUpdate,
-		mode: mode === "popup" ? "popup" : "inline",
-		open,
-		onOpenChange,
-		title: popupTitle || t("organization.profile.heading"),
-		preferences,
-		...rest
-	});
-};
-var OrganizationProfile_default = OrganizationProfile;
-
-//#endregion
-exports.default = OrganizationProfile_default;
-//# sourceMappingURL=OrganizationProfile.cjs.map

package/dist/cjs/components/presentation/OrganizationProfile/OrganizationProfile.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"OrganizationProfile.cjs","names":["logger: ReturnType<typeof createPackageComponentLogger>","OrganizationProfile: FC<OrganizationProfileProps>","useThunderID","useTranslation","getOrganization","updateOrganization","BaseOrganizationProfile"],"sources":["../../../../../src/components/presentation/OrganizationProfile/OrganizationProfile.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\nimport {OrganizationDetails, createPackageComponentLogger} from '@thunderid/browser';\nimport {FC, ReactElement, useEffect, useState} from 'react';\nimport BaseOrganizationProfile, {BaseOrganizationProfileProps} from './BaseOrganizationProfile';\nimport getOrganization from '../../../api/getOrganization';\nimport updateOrganization, {createPatchOperations} from '../../../api/updateOrganization';\nimport useThunderID from '../../../contexts/ThunderID/useThunderID';\nimport useTranslation from '../../../hooks/useTranslation';\n\nconst logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(\n  '@thunderid/react',\n  'OrganizationProfile',\n);\n\n/**\n * Props for the OrganizationProfile component.\n * Extends BaseOrganizationProfileProps but makes the organization prop optional\n * since it will be fetched using the organizationId\n */\nexport type OrganizationProfileProps = Omit<BaseOrganizationProfileProps, 'organization' | 'mode'> & {\n  /**\n   * Component to show when there's an error loading organization data.\n   */\n  errorFallback?: ReactElement;\n\n  /**\n   * Component to show while loading organization data.\n   */\n  loadingFallback?: ReactElement;\n\n  /**\n   * Display mode for the component.\n   */\n  mode?: 'default' | 'popup';\n\n  /**\n   * Callback fired when the popup should be closed (only used in popup mode).\n   */\n  onOpenChange?: (open: boolean) => void;\n\n  /**\n   * Callback fired when the organization should be updated.\n   */\n  onUpdate?: (payload: any) => Promise<void>;\n\n  /**\n   * Whether the popup is open (only used in popup mode).\n   */\n  open?: boolean;\n\n  /**\n   * The ID of the organization to fetch and display.\n   */\n  organizationId: string;\n\n  /**\n   * Custom title for the popup dialog (only used in popup mode).\n   */\n  popupTitle?: string;\n};\n\n/**\n * OrganizationProfile component displays organization information in a\n * structured and styled format. It automatically fetches organization details\n * using the provided organization ID and displays them using BaseOrganizationProfile.\n *\n * The component supports editing functionality, allowing users to modify organization\n * fields inline. Updates are automatically synced with the backend via the SCIM2 API.\n *\n * This component is the React-specific implementation that automatically\n * retrieves the organization data from ThunderID API.\n *\n * @example\n * ```tsx\n * // Basic usage with editing enabled (default)\n * <OrganizationProfile organizationId=\"0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1\" />\n *\n * // Read-only mode\n * <OrganizationProfile\n *   organizationId=\"0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1\"\n *   editable={false}\n * />\n *\n * // With card layout and custom fallbacks\n * <OrganizationProfile\n *   organizationId=\"0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1\"\n *   cardLayout={true}\n *   loadingFallback={<div>Loading organization...</div>}\n *   errorFallback={<div>Failed to load organization</div>}\n *   fallback={<div>No organization data available</div>}\n * />\n *\n * // With custom fields configuration and update callback\n * <OrganizationProfile\n *   organizationId=\"0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1\"\n *   fields={[\n *     { key: 'id', label: 'Organization ID', editable: false },\n *     { key: 'name', label: 'Organization Name', editable: true },\n *     { key: 'description', label: 'Description', editable: true, render: (value) => value || 'No description' },\n *     { key: 'created', label: 'Created Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },\n *     { key: 'lastModified', label: 'Last Modified Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },\n *     { key: 'attributes', label: 'Custom Attributes', editable: true }\n *   ]}\n *   onUpdate={async (payload) => {\n *     console.log('Organization updated:', payload);\n *     // payload contains the updated field values\n *     // The component automatically converts these to patch operations\n *   }}\n * />\n *\n * // In popup mode\n * <OrganizationProfile\n *   organizationId=\"0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1\"\n *   mode=\"popup\"\n *   open={isOpen}\n *   onOpenChange={setIsOpen}\n *   popupTitle=\"Edit Organization Profile\"\n * />\n * ```\n */\nconst OrganizationProfile: FC<OrganizationProfileProps> = ({\n  organizationId,\n  mode = 'default',\n  open = false,\n  onOpenChange,\n  onUpdate,\n  popupTitle,\n  loadingFallback,\n  errorFallback,\n  preferences,\n  ...rest\n}: OrganizationProfileProps): ReactElement => {\n  const {baseUrl, instanceId} = useThunderID();\n  const {t} = useTranslation(preferences?.i18n);\n  const [organization, setOrganization] = useState<OrganizationDetails | null>(null);\n\n  const fetchOrganization = async (): Promise<void> => {\n    if (!baseUrl || !organizationId) {\n      return;\n    }\n\n    try {\n      const orgData: any = await getOrganization({\n        baseUrl,\n        instanceId,\n        organizationId,\n      });\n      setOrganization(orgData);\n    } catch (err) {\n      logger.error('Failed to fetch organization:');\n      setOrganization(null);\n    }\n  };\n\n  useEffect(() => {\n    fetchOrganization();\n  }, [baseUrl, organizationId]);\n\n  const handleOrganizationUpdate = async (payload: any): Promise<void> => {\n    if (!baseUrl || !organizationId) return;\n\n    try {\n      // Convert payload to patch operations format\n      const operations: any = createPatchOperations(payload);\n\n      await updateOrganization({\n        baseUrl,\n        instanceId,\n        operations,\n        organizationId,\n      });\n      // Refetch organization data after update\n      await fetchOrganization();\n\n      // Call the optional onUpdate callback\n      if (onUpdate) {\n        await onUpdate(payload);\n      }\n    } catch (err) {\n      logger.error('Failed to update organization:');\n      throw err;\n    }\n  };\n\n  return (\n    <BaseOrganizationProfile\n      organization={organization}\n      onUpdate={handleOrganizationUpdate}\n      mode={mode === 'popup' ? 'popup' : 'inline'}\n      open={open}\n      onOpenChange={onOpenChange}\n      title={popupTitle || t('organization.profile.heading')}\n      preferences={preferences}\n      {...rest}\n    />\n  );\n};\n\nexport default OrganizationProfile;\n"],"mappings":";;;;;;;;;;;;;;AA0BA,MAAMA,+DACJ,oBACA,sBACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4GD,MAAMC,uBAAqD,EACzD,gBACA,OAAO,WACP,OAAO,OACP,cACA,UACA,YACA,iBACA,eACA,YACA,GAAG,WACyC;CAC5C,MAAM,EAAC,SAAS,eAAcC,8BAAc;CAC5C,MAAM,EAAC,MAAKC,+BAAe,aAAa,KAAK;CAC7C,MAAM,CAAC,cAAc,uCAAwD,KAAK;CAElF,MAAM,oBAAoB,YAA2B;AACnD,MAAI,CAAC,WAAW,CAAC,eACf;AAGF,MAAI;AAMF,mBALqB,MAAMC,gCAAgB;IACzC;IACA;IACA;IACD,CAAC,CACsB;WACjB,KAAK;AACZ,UAAO,MAAM,gCAAgC;AAC7C,mBAAgB,KAAK;;;AAIzB,4BAAgB;AACd,qBAAmB;IAClB,CAAC,SAAS,eAAe,CAAC;CAE7B,MAAM,2BAA2B,OAAO,YAAgC;AACtE,MAAI,CAAC,WAAW,CAAC,eAAgB;AAEjC,MAAI;AAIF,SAAMC,mCAAmB;IACvB;IACA;IACA,2DAL4C,QAAQ;IAMpD;IACD,CAAC;AAEF,SAAM,mBAAmB;AAGzB,OAAI,SACF,OAAM,SAAS,QAAQ;WAElB,KAAK;AACZ,UAAO,MAAM,iCAAiC;AAC9C,SAAM;;;AAIV,QACE,2CAACC;EACe;EACd,UAAU;EACV,MAAM,SAAS,UAAU,UAAU;EAC7B;EACQ;EACd,OAAO,cAAc,EAAE,+BAA+B;EACzC;EACb,GAAI;GACJ;;AAIN,kCAAe"}

package/dist/cjs/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.cjs

@@ -1,288 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_useTheme = require('../../../contexts/Theme/useTheme.cjs');
-const require_useTranslation = require('../../../hooks/useTranslation.cjs');
-const require_Button = require('../../primitives/Button/Button.cjs');
-const require_Typography = require('../../primitives/Typography/Typography.cjs');
-const require_Avatar = require('../../primitives/Avatar/Avatar.cjs');
-const require_BaseOrganizationSwitcher_styles = require('./BaseOrganizationSwitcher.styles.cjs');
-const require_Building = require('../../primitives/Icons/Building.cjs');
-const require_Check = require('../../primitives/Icons/Check.cjs');
-const require_ChevronDown = require('../../primitives/Icons/ChevronDown.cjs');
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
-let __emotion_css = require("@emotion/css");
-__emotion_css = require_rolldown_runtime.__toESM(__emotion_css);
-let __floating_ui_react = require("@floating-ui/react");
-__floating_ui_react = require_rolldown_runtime.__toESM(__floating_ui_react);
-
-//#region src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx
-/**
-* BaseOrganizationSwitcher component displays an organization selector with a dropdown menu.
-* When clicked, it shows a popover with available organizations to switch between.
-* This component serves as the base for framework-specific implementations.
-*/
-const BaseOrganizationSwitcher = ({ organizations, currentOrganization, loading = false, error, onOrganizationSwitch, onManageProfile, className = "", style, renderOrganization, renderLoading, renderError, showRole = false, showMemberCount = true, menuItems = [], portalId = "thunderid-organization-switcher", showTriggerLabel = true, avatarSize = 24, fallback = null, preferences }) => {
-	const { theme, colorScheme, direction } = require_useTheme.default();
-	const styles = require_BaseOrganizationSwitcher_styles.default(theme, colorScheme);
-	const [isOpen, setIsOpen] = (0, react.useState)(false);
-	const [hoveredItemIndex, setHoveredItemIndex] = (0, react.useState)(null);
-	const { t } = require_useTranslation.default(preferences?.i18n);
-	const isRTL = direction === "rtl";
-	const { refs, floatingStyles, context } = (0, __floating_ui_react.useFloating)({
-		middleware: [
-			(0, __floating_ui_react.offset)(5),
-			(0, __floating_ui_react.flip)({ fallbackAxisSideDirection: "end" }),
-			(0, __floating_ui_react.shift)({ padding: 5 })
-		],
-		onOpenChange: setIsOpen,
-		open: isOpen,
-		placement: "bottom-end",
-		whileElementsMounted: __floating_ui_react.autoUpdate
-	});
-	const { getReferenceProps, getFloatingProps } = (0, __floating_ui_react.useInteractions)([
-		(0, __floating_ui_react.useClick)(context),
-		(0, __floating_ui_react.useDismiss)(context),
-		(0, __floating_ui_react.useRole)(context)
-	]);
-	if (fallback && !currentOrganization && !loading && organizations.length === 0) return fallback;
-	const handleOrganizationSwitch = (organization) => {
-		onOrganizationSwitch(organization);
-		setIsOpen(false);
-	};
-	const handleMenuItemClick = (item) => {
-		if (item.onClick) item.onClick();
-		setIsOpen(false);
-	};
-	const switchableOrganizations = organizations.filter((org) => org.id !== currentOrganization?.id);
-	const defaultRenderOrganization = (organization, isSelected) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Avatar.Avatar, {
-			variant: "square",
-			imageUrl: organization.avatar,
-			name: organization.name,
-			size: avatarSize * 1.25,
-			alt: `${organization.name} avatar`
-		}),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: (0, __emotion_css.cx)(styles["organizationInfo"]),
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.default, {
-				variant: "body2",
-				fontWeight: "medium",
-				className: (0, __emotion_css.cx)(styles["organizationName"]),
-				children: organization.name
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: (0, __emotion_css.cx)(styles["organizationMeta"]),
-				children: [
-					showMemberCount && organization.memberCount !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
-						organization.memberCount,
-						" ",
-						organization.memberCount === 1 ? t("organization.switcher.member") : t("organization.switcher.members")
-					] }),
-					showRole && organization.role && showMemberCount && organization.memberCount !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: " • " }),
-					showRole && organization.role && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-						className: (0, __emotion_css.cx)(styles["roleCapitalized"]),
-						children: organization.role
-					})
-				]
-			})]
-		}),
-		isSelected && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Check.default, {
-			width: "16",
-			height: "16",
-			color: theme.vars.colors.text.primary
-		})
-	] });
-	const defaultRenderLoading = () => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: (0, __emotion_css.cx)(styles["loadingContainer"]),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.default, {
-			variant: "caption",
-			className: (0, __emotion_css.cx)(styles["loadingText"]),
-			children: t("organization.switcher.loading.placeholder.organizations")
-		})
-	});
-	const defaultRenderError = (errorMessage) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: (0, __emotion_css.cx)(styles["errorContainer"]),
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.default, {
-			variant: "caption",
-			className: (0, __emotion_css.cx)(styles["errorText"]),
-			children: errorMessage
-		})
-	});
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, __emotion_css.cx)(styles["root"], className),
-		style,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Button.default, {
-			ref: refs.setReference,
-			className: (0, __emotion_css.cx)(styles["trigger"]),
-			color: "tertiary",
-			variant: "outline",
-			size: "medium",
-			...getReferenceProps(),
-			children: [currentOrganization ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Avatar.Avatar, {
-				variant: "square",
-				imageUrl: currentOrganization.avatar,
-				name: currentOrganization.name,
-				size: avatarSize,
-				alt: `${currentOrganization.name} avatar`
-			}), showTriggerLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.default, {
-				variant: "body2",
-				className: (0, __emotion_css.cx)(styles["triggerLabel"]),
-				children: currentOrganization.name
-			})] }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Building.default, {
-				width: avatarSize,
-				height: avatarSize
-			}), showTriggerLabel && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.default, {
-				variant: "body2",
-				className: (0, __emotion_css.cx)(styles["triggerLabel"]),
-				children: t("elements.fields.organization.select.label")
-			})] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				style: {
-					display: "inline-flex",
-					transform: isRTL ? "scaleX(-1)" : "none"
-				},
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ChevronDown.default, {
-					width: "16",
-					height: "16"
-				})
-			})]
-		}), isOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__floating_ui_react.FloatingPortal, {
-			id: portalId,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__floating_ui_react.FloatingFocusManager, {
-				context,
-				modal: false,
-				initialFocus: -1,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					ref: refs.setFloating,
-					className: (0, __emotion_css.cx)(styles["content"]),
-					style: floatingStyles,
-					...getFloatingProps(),
-					children: [
-						currentOrganization && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: (0, __emotion_css.cx)(styles["header"]),
-							children: [
-								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Avatar.Avatar, {
-									variant: "square",
-									imageUrl: currentOrganization.avatar,
-									name: currentOrganization.name,
-									size: avatarSize * 1.5,
-									alt: `${currentOrganization.name} avatar`
-								}),
-								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-									className: (0, __emotion_css.cx)(styles["headerInfo"]),
-									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.default, {
-										noWrap: true,
-										className: (0, __emotion_css.cx)(styles["headerName"]),
-										variant: "body1",
-										fontWeight: "medium",
-										children: currentOrganization.name
-									}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-										className: (0, __emotion_css.cx)(styles["headerMeta"]),
-										children: [showMemberCount && currentOrganization.memberCount !== void 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Typography.default, {
-											noWrap: true,
-											variant: "caption",
-											color: "secondary",
-											children: [
-												currentOrganization.memberCount,
-												" ",
-												currentOrganization.memberCount === 1 ? t("organization.switcher.member") : t("organization.switcher.members"),
-												showRole && currentOrganization.role && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [" • ", currentOrganization.role] })
-											]
-										}), showRole && currentOrganization.role && (!showMemberCount || currentOrganization.memberCount === void 0) && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.default, {
-											noWrap: true,
-											className: (0, __emotion_css.cx)(styles["headerRole"]),
-											variant: "caption",
-											color: "secondary",
-											children: currentOrganization.role
-										})]
-									})]
-								}),
-								onManageProfile && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.default, {
-									onClick: onManageProfile,
-									color: "tertiary",
-									variant: "outline",
-									size: "small",
-									"aria-label": "Manage Organization Profile",
-									className: (0, __emotion_css.cx)(styles["manageButton"]),
-									endIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
-										width: "16",
-										height: "16",
-										viewBox: "0 0 24 24",
-										fill: "none",
-										stroke: "currentColor",
-										strokeWidth: "2",
-										strokeLinecap: "round",
-										strokeLinejoin: "round",
-										children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("circle", {
-											cx: "12",
-											cy: "12",
-											r: "3"
-										}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1 1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" })]
-									}),
-									children: t("organization.switcher.buttons.manage.text")
-								})
-							]
-						}),
-						organizations.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							className: (0, __emotion_css.cx)(styles["header"], styles["sectionHeaderContainer"]),
-							style: { borderTop: currentOrganization ? `1px solid ${theme.vars.colors.border}` : "none" },
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Typography.default, {
-								variant: "caption",
-								fontWeight: 600,
-								className: (0, __emotion_css.cx)(styles["sectionHeader"]),
-								children: t("organization.switcher.switch.organization")
-							})
-						}),
-						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							className: (0, __emotion_css.cx)(styles["menu"]),
-							children: (() => {
-								if (loading) return renderLoading ? renderLoading() : defaultRenderLoading();
-								if (error) return renderError ? renderError(error) : defaultRenderError(error);
-								return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [switchableOrganizations.map((organization) => {
-									const isSelected = false;
-									return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.default, {
-										onClick: () => handleOrganizationSwitch(organization),
-										className: (0, __emotion_css.cx)(styles["menuItem"]),
-										color: "tertiary",
-										variant: "text",
-										size: "small",
-										style: { backgroundColor: hoveredItemIndex === switchableOrganizations.indexOf(organization) ? theme.vars.colors.action?.hover : "transparent" },
-										onMouseEnter: () => setHoveredItemIndex(switchableOrganizations.indexOf(organization)),
-										onMouseLeave: () => setHoveredItemIndex(null),
-										children: renderOrganization ? renderOrganization(organization, isSelected) : defaultRenderOrganization(organization, isSelected)
-									}, organization.id);
-								}), menuItems.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, __emotion_css.cx)(styles["menuDivider"]) }), menuItems.map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: item.href ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
-									href: item.href,
-									style: { backgroundColor: hoveredItemIndex === switchableOrganizations.length + index ? theme.vars.colors.action?.hover : "transparent" },
-									className: (0, __emotion_css.cx)(styles["menuItem"]),
-									onMouseEnter: () => setHoveredItemIndex(switchableOrganizations.length + index),
-									onMouseLeave: () => setHoveredItemIndex(null),
-									onFocus: () => setHoveredItemIndex(switchableOrganizations.length + index),
-									onBlur: () => setHoveredItemIndex(null),
-									children: [item.icon, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: item.label })]
-								}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Button.default, {
-									onClick: () => handleMenuItemClick(item),
-									style: { backgroundColor: hoveredItemIndex === switchableOrganizations.length + index ? theme.vars.colors.action?.hover : "transparent" },
-									className: (0, __emotion_css.cx)(styles["menuItem"]),
-									color: "tertiary",
-									variant: "text",
-									size: "small",
-									startIcon: item.icon,
-									onMouseEnter: () => setHoveredItemIndex(switchableOrganizations.length + index),
-									onMouseLeave: () => setHoveredItemIndex(null),
-									children: item.label
-								}) }, index))] })] });
-							})()
-						})
-					]
-				})
-			})
-		})]
-	});
-};
-var BaseOrganizationSwitcher_default = BaseOrganizationSwitcher;
-
-//#endregion
-exports.BaseOrganizationSwitcher = BaseOrganizationSwitcher;
-exports.default = BaseOrganizationSwitcher_default;
-//# sourceMappingURL=BaseOrganizationSwitcher.cjs.map

package/dist/cjs/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseOrganizationSwitcher.cjs","names":["BaseOrganizationSwitcher: FC<BaseOrganizationSwitcherProps>","useTheme","styles: Record<string, string>","useStyles","useTranslation","isRTL: boolean","autoUpdate","switchableOrganizations: Organization[]","Avatar","Typography","Check","Button","Building","ChevronDown","FloatingPortal","FloatingFocusManager"],"sources":["../../../../../src/components/presentation/OrganizationSwitcher/BaseOrganizationSwitcher.tsx"],"sourcesContent":["/**\n * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).\n *\n * WSO2 LLC. licenses this file to you under the Apache License,\n * Version 2.0 (the \"License\"); you may not use this file except\n * in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing,\n * software distributed under the License is distributed on an\n * \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\n * KIND, either express or implied. See the License for the\n * specific language governing permissions and limitations\n * under the License.\n */\n\n// Removed BEM and vendor prefix utilities\nimport {cx} from '@emotion/css';\nimport {\n  useFloating,\n  autoUpdate,\n  offset,\n  flip,\n  shift,\n  useClick,\n  useDismiss,\n  useRole,\n  useInteractions,\n  FloatingFocusManager,\n  FloatingPortal,\n} from '@floating-ui/react';\nimport {Preferences} from '@thunderid/browser';\nimport {CSSProperties, FC, ReactElement, ReactNode, useState} from 'react';\nimport useStyles from './BaseOrganizationSwitcher.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport useTranslation from '../../../hooks/useTranslation';\nimport {Avatar} from '../../primitives/Avatar/Avatar';\nimport Button from '../../primitives/Button/Button';\nimport Building from '../../primitives/Icons/Building';\nimport Check from '../../primitives/Icons/Check';\nimport ChevronDown from '../../primitives/Icons/ChevronDown';\nimport Typography from '../../primitives/Typography/Typography';\n\ninterface MenuItem {\n  href?: string;\n  icon?: ReactNode;\n  label: ReactNode;\n  onClick?: () => void;\n}\n\n/**\n * Interface for organization data.\n */\nexport interface Organization {\n  /**\n   * Avatar URL for the organization.\n   */\n  avatar?: string;\n  /**\n   * Unique identifier for the organization.\n   */\n  id: string;\n  /**\n   * Number of members in the organization.\n   */\n  memberCount?: number;\n  /**\n   * Additional metadata for the organization.\n   */\n  metadata?: Record<string, any>;\n  /**\n   * Display name of the organization.\n   */\n  name: string;\n  /**\n   * User's role in the organization.\n   */\n  role?: 'owner' | 'admin' | 'member';\n  /**\n   * URL slug for the organization.\n   */\n  slug?: string;\n}\n\n/**\n * Props interface for the BaseOrganizationSwitcher component.\n */\nexport interface BaseOrganizationSwitcherProps {\n  /**\n   * Optional size for the avatar\n   */\n  avatarSize?: number;\n  /**\n   * Custom class name for styling.\n   */\n  className?: string;\n  /**\n   * Currently selected organization.\n   */\n  currentOrganization?: Organization;\n  /**\n   * Error message to display.\n   */\n  error?: string;\n  /**\n   * Optional element to render when no organization is selected.\n   */\n  fallback?: ReactElement | null;\n  /**\n   * Whether the component is in a loading state.\n   */\n  loading?: boolean;\n  /**\n   * Additional menu items to display at the bottom of the dropdown.\n   */\n  menuItems?: MenuItem[];\n  /**\n   * Handler for when the manage profile button is clicked.\n   */\n  onManageProfile?: () => void;\n  /**\n   * Handler for when an organization is selected.\n   */\n  onOrganizationSwitch: (organization: Organization) => void;\n  /**\n   * List of available organizations.\n   */\n  organizations: Organization[];\n  /**\n   * The HTML element ID where the portal should be mounted\n   */\n  portalId?: string;\n  /**\n   * Component-level preferences to override global i18n and theme settings.\n   * Preferences are deep-merged with global ones, with component preferences\n   * taking precedence. Affects this component and all its descendants.\n   */\n  preferences?: Preferences;\n  /**\n   * Custom render function for the error state.\n   */\n  renderError?: (error: string) => ReactElement;\n  /**\n   * Custom render function for the loading state.\n   */\n  renderLoading?: () => ReactElement;\n  /**\n   * Custom render function for the organization item.\n   */\n  renderOrganization?: (organization: Organization, isSelected: boolean) => ReactElement;\n  /**\n   * Whether to show the member count.\n   */\n  showMemberCount?: boolean;\n  /**\n   * Whether to show the role badge.\n   */\n  showRole?: boolean;\n  /**\n   * Show organization name next to avatar in the trigger button\n   */\n  showTriggerLabel?: boolean;\n\n  /**\n   * Custom styles for the component.\n   */\n  style?: CSSProperties;\n}\n\n/**\n * BaseOrganizationSwitcher component displays an organization selector with a dropdown menu.\n * When clicked, it shows a popover with available organizations to switch between.\n * This component serves as the base for framework-specific implementations.\n */\nexport const BaseOrganizationSwitcher: FC<BaseOrganizationSwitcherProps> = ({\n  organizations,\n  currentOrganization,\n  loading = false,\n  error,\n  onOrganizationSwitch,\n  onManageProfile,\n  className = '',\n  style,\n  renderOrganization,\n  renderLoading,\n  renderError,\n  showRole = false,\n  showMemberCount = true,\n  menuItems = [],\n  portalId = 'thunderid-organization-switcher',\n  showTriggerLabel = true,\n  avatarSize = 24,\n  fallback = null,\n  preferences,\n}: BaseOrganizationSwitcherProps): ReactElement | null => {\n  const {theme, colorScheme, direction} = useTheme();\n  const styles: Record<string, string> = useStyles(theme, colorScheme);\n  const [isOpen, setIsOpen] = useState(false);\n  const [hoveredItemIndex, setHoveredItemIndex] = useState<number | null>(null);\n  const {t} = useTranslation(preferences?.i18n);\n  const isRTL: boolean = direction === 'rtl';\n\n  const {refs, floatingStyles, context} = useFloating({\n    middleware: [offset(5), flip({fallbackAxisSideDirection: 'end'}), shift({padding: 5})],\n    onOpenChange: setIsOpen,\n    open: isOpen,\n    placement: 'bottom-end',\n    whileElementsMounted: autoUpdate,\n  });\n\n  const click: any = useClick(context);\n  const dismiss: any = useDismiss(context);\n  const role: any = useRole(context);\n\n  const {getReferenceProps, getFloatingProps} = useInteractions([click, dismiss, role]);\n\n  if (fallback && !currentOrganization && !loading && organizations.length === 0) {\n    return fallback;\n  }\n\n  const handleOrganizationSwitch = (organization: Organization): void => {\n    onOrganizationSwitch(organization);\n    setIsOpen(false);\n  };\n\n  const handleMenuItemClick = (item: MenuItem): void => {\n    if (item.onClick) {\n      item.onClick();\n    }\n    setIsOpen(false);\n  };\n\n  // Filter out current organization from switchable list\n  const switchableOrganizations: Organization[] = organizations.filter(\n    (org: Organization): boolean => org.id !== currentOrganization?.id,\n  );\n\n  const defaultRenderOrganization = (organization: Organization, isSelected: boolean): ReactElement => (\n    <>\n      <Avatar\n        variant=\"square\"\n        imageUrl={organization.avatar}\n        name={organization.name}\n        size={avatarSize * 1.25}\n        alt={`${organization.name} avatar`}\n      />\n      <div className={cx(styles['organizationInfo'])}>\n        <Typography variant=\"body2\" fontWeight=\"medium\" className={cx(styles['organizationName'])}>\n          {organization.name}\n        </Typography>\n        <div className={cx(styles['organizationMeta'])}>\n          {showMemberCount && organization.memberCount !== undefined && (\n            <span>\n              {organization.memberCount}{' '}\n              {organization.memberCount === 1 ? t('organization.switcher.member') : t('organization.switcher.members')}\n            </span>\n          )}\n          {showRole && organization.role && showMemberCount && organization.memberCount !== undefined && (\n            <span> • </span>\n          )}\n          {showRole && organization.role && <span className={cx(styles['roleCapitalized'])}>{organization.role}</span>}\n        </div>\n      </div>\n      {isSelected && <Check width=\"16\" height=\"16\" color={theme.vars.colors.text.primary} />}\n    </>\n  );\n\n  const defaultRenderLoading = (): ReactElement => (\n    <div className={cx(styles['loadingContainer'])}>\n      <Typography variant=\"caption\" className={cx(styles['loadingText'])}>\n        {t('organization.switcher.loading.placeholder.organizations')}\n      </Typography>\n    </div>\n  );\n\n  const defaultRenderError = (errorMessage: string): ReactElement => (\n    <div className={cx(styles['errorContainer'])}>\n      <Typography variant=\"caption\" className={cx(styles['errorText'])}>\n        {errorMessage}\n      </Typography>\n    </div>\n  );\n\n  return (\n    <div className={cx(styles['root'], className)} style={style}>\n      <Button\n        ref={refs.setReference}\n        className={cx(styles['trigger'])}\n        color=\"tertiary\"\n        variant=\"outline\"\n        size=\"medium\"\n        {...getReferenceProps()}\n      >\n        {currentOrganization ? (\n          <>\n            <Avatar\n              variant=\"square\"\n              imageUrl={currentOrganization.avatar}\n              name={currentOrganization.name}\n              size={avatarSize}\n              alt={`${currentOrganization.name} avatar`}\n            />\n            {showTriggerLabel && (\n              <Typography variant=\"body2\" className={cx(styles['triggerLabel'])}>\n                {currentOrganization.name}\n              </Typography>\n            )}\n          </>\n        ) : (\n          <>\n            <Building width={avatarSize} height={avatarSize} />\n            {showTriggerLabel && (\n              <Typography variant=\"body2\" className={cx(styles['triggerLabel'])}>\n                {t('elements.fields.organization.select.label')}\n              </Typography>\n            )}\n          </>\n        )}\n        <span style={{display: 'inline-flex', transform: isRTL ? 'scaleX(-1)' : 'none'}}>\n          <ChevronDown width=\"16\" height=\"16\" />\n        </span>\n      </Button>\n\n      {isOpen && (\n        <FloatingPortal id={portalId}>\n          <FloatingFocusManager context={context} modal={false} initialFocus={-1}>\n            <div\n              ref={refs.setFloating}\n              className={cx(styles['content'])}\n              style={floatingStyles}\n              {...getFloatingProps()}\n            >\n              {/* Header - Current Organization */}\n              {currentOrganization && (\n                <div className={cx(styles['header'])}>\n                  <Avatar\n                    variant=\"square\"\n                    imageUrl={currentOrganization.avatar}\n                    name={currentOrganization.name}\n                    size={avatarSize * 1.5}\n                    alt={`${currentOrganization.name} avatar`}\n                  />\n                  <div className={cx(styles['headerInfo'])}>\n                    <Typography noWrap className={cx(styles['headerName'])} variant=\"body1\" fontWeight=\"medium\">\n                      {currentOrganization.name}\n                    </Typography>\n                    <div className={cx(styles['headerMeta'])}>\n                      {showMemberCount && currentOrganization.memberCount !== undefined && (\n                        <Typography\n                          noWrap\n                          // ...existing code...\n                          variant=\"caption\"\n                          color=\"secondary\"\n                        >\n                          {currentOrganization.memberCount}{' '}\n                          {currentOrganization.memberCount === 1\n                            ? t('organization.switcher.member')\n                            : t('organization.switcher.members')}\n                          {showRole && currentOrganization.role && <span> • {currentOrganization.role}</span>}\n                        </Typography>\n                      )}\n                      {showRole &&\n                        currentOrganization.role &&\n                        (!showMemberCount || currentOrganization.memberCount === undefined) && (\n                          <Typography noWrap className={cx(styles['headerRole'])} variant=\"caption\" color=\"secondary\">\n                            {currentOrganization.role}\n                          </Typography>\n                        )}\n                    </div>\n                  </div>\n                  {onManageProfile && (\n                    <Button\n                      onClick={onManageProfile}\n                      color=\"tertiary\"\n                      variant=\"outline\"\n                      size=\"small\"\n                      aria-label=\"Manage Organization Profile\"\n                      className={cx(styles['manageButton'])}\n                      endIcon={\n                        <svg\n                          width=\"16\"\n                          height=\"16\"\n                          viewBox=\"0 0 24 24\"\n                          fill=\"none\"\n                          stroke=\"currentColor\"\n                          strokeWidth=\"2\"\n                          strokeLinecap=\"round\"\n                          strokeLinejoin=\"round\"\n                        >\n                          <circle cx=\"12\" cy=\"12\" r=\"3\" />\n                          <path d=\"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1 1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z\" />\n                        </svg>\n                      }\n                    >\n                      {t('organization.switcher.buttons.manage.text')}\n                    </Button>\n                  )}\n                </div>\n              )}\n\n              {/* Section Header for Other Organizations */}\n              {organizations.length > 1 && (\n                <div\n                  className={cx(styles['header'], styles['sectionHeaderContainer'])}\n                  style={{\n                    borderTop: currentOrganization ? `1px solid ${theme.vars.colors.border}` : 'none',\n                  }}\n                >\n                  <Typography variant=\"caption\" fontWeight={600} className={cx(styles['sectionHeader'])}>\n                    {t('organization.switcher.switch.organization')}\n                  </Typography>\n                </div>\n              )}\n\n              {/* Content */}\n              <div className={cx(styles['menu'])}>\n                {((): ReactElement => {\n                  if (loading) {\n                    return renderLoading ? renderLoading() : defaultRenderLoading();\n                  }\n                  if (error) {\n                    return renderError ? renderError(error) : defaultRenderError(error);\n                  }\n                  return (\n                    <>\n                      {switchableOrganizations.map((organization: Organization): ReactElement => {\n                        const isSelected = false; // Never selected since we exclude current org\n                        return (\n                          <Button\n                            key={organization.id}\n                            onClick={(): void => handleOrganizationSwitch(organization)}\n                            className={cx(styles['menuItem'])}\n                            color=\"tertiary\"\n                            variant=\"text\"\n                            size=\"small\"\n                            style={{\n                              backgroundColor:\n                                hoveredItemIndex === switchableOrganizations.indexOf(organization)\n                                  ? theme.vars.colors.action?.hover\n                                  : 'transparent',\n                            }}\n                            onMouseEnter={(): void =>\n                              setHoveredItemIndex(switchableOrganizations.indexOf(organization))\n                            }\n                            onMouseLeave={(): void => setHoveredItemIndex(null)}\n                          >\n                            {renderOrganization\n                              ? renderOrganization(organization, isSelected)\n                              : defaultRenderOrganization(organization, isSelected)}\n                          </Button>\n                        );\n                      })}\n\n                      {/* Menu Items */}\n                      {menuItems.length > 0 && (\n                        <>\n                          <div className={cx(styles['menuDivider'])} />\n                          {menuItems.map(\n                            (item: any, index: number): ReactElement => (\n                              <div key={index}>\n                                {item.href ? (\n                                  <a\n                                    href={item.href}\n                                    style={{\n                                      backgroundColor:\n                                        hoveredItemIndex === switchableOrganizations.length + index\n                                          ? theme.vars.colors.action?.hover\n                                          : 'transparent',\n                                    }}\n                                    className={cx(styles['menuItem'])}\n                                    onMouseEnter={(): void =>\n                                      setHoveredItemIndex(switchableOrganizations.length + index)\n                                    }\n                                    onMouseLeave={(): void => setHoveredItemIndex(null)}\n                                    onFocus={(): void => setHoveredItemIndex(switchableOrganizations.length + index)}\n                                    onBlur={(): void => setHoveredItemIndex(null)}\n                                  >\n                                    {item.icon}\n                                    <span>{item.label}</span>\n                                  </a>\n                                ) : (\n                                  <Button\n                                    onClick={(): void => handleMenuItemClick(item)}\n                                    style={{\n                                      backgroundColor:\n                                        hoveredItemIndex === switchableOrganizations.length + index\n                                          ? theme.vars.colors.action?.hover\n                                          : 'transparent',\n                                    }}\n                                    className={cx(styles['menuItem'])}\n                                    color=\"tertiary\"\n                                    variant=\"text\"\n                                    size=\"small\"\n                                    startIcon={item.icon}\n                                    onMouseEnter={(): void =>\n                                      setHoveredItemIndex(switchableOrganizations.length + index)\n                                    }\n                                    onMouseLeave={(): void => setHoveredItemIndex(null)}\n                                  >\n                                    {item.label}\n                                  </Button>\n                                )}\n                              </div>\n                            ),\n                          )}\n                        </>\n                      )}\n                    </>\n                  );\n                })()}\n              </div>\n            </div>\n          </FloatingFocusManager>\n        </FloatingPortal>\n      )}\n    </div>\n  );\n};\n\nexport default BaseOrganizationSwitcher;\n"],"mappings":"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"}