@launchdarkly/toolbar 1.6.0 → 2.2.0-beta.1

package/dist/core/ui/Toolbar/context/FlagSdkOverrideProvider.d.ts

@@ -1,14 +1,18 @@
 import { IFlagOverridePlugin } from '../../../../types';
+import { ApiVariation } from '../types/ldApi';
 interface LocalFlag {
     key: string;
     name: string;
     currentValue: any;
     isOverridden: boolean;
-    type: 'boolean' | 'string' | 'number' | 'object';
+    type: 'boolean' | 'multivariate' | 'string' | 'number' | 'object';
+    availableVariations: ApiVariation[];
 }
 interface FlagSdkOverrideContextType {
     flags: Record<string, LocalFlag>;
     isLoading: boolean;
+    setOverride: (flagKey: string, value: any) => void;
+    removeOverride: (flagKey: string) => void;
 }
 interface FlagSdkOverrideProviderProps {
     children: React.ReactNode;

package/dist/core/ui/Toolbar/context/api/ApiBundleProvider.d.ts

@@ -0,0 +1,8 @@
+interface ApiBundleProviderProps {
+    authUrl: string;
+    clientSideId?: string;
+    providedProjectKey?: string;
+    children: React.ReactNode;
+}
+export declare function ApiBundleProvider(props: ApiBundleProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/core/ui/Toolbar/context/api/ApiProvider.d.ts

@@ -0,0 +1,15 @@
+import { FlagsPaginationParams, FlagsResponse, ApiFlag, ProjectsResponse } from '../../types/ldApi';
+interface ApiProviderContextValue {
+    apiReady: boolean;
+    getFlag: (flagKey: string) => Promise<ApiFlag>;
+    getProjects: () => Promise<ProjectsResponse>;
+    getFlags: (projectKey: string, params?: FlagsPaginationParams) => Promise<FlagsResponse>;
+}
+export interface ApiProviderProps {
+    children: React.ReactNode;
+}
+export declare function ApiProvider({ children }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useApi(): ApiProviderContextValue;
+export {};

package/dist/core/ui/Toolbar/context/{AuthProvider.d.ts → api/AuthProvider.d.ts}

@@ -1,12 +1,13 @@
 import { Dispatch, SetStateAction } from 'react';
-type AuthProviderType = {
+interface AuthContextType {
     authenticated: boolean;
     authenticating: boolean;
     loading: boolean;
     setAuthenticating: Dispatch<SetStateAction<boolean>>;
-};
+    logout: () => void;
+}
 export declare function AuthProvider({ children }: {
     children: React.ReactNode;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function useAuthContext(): AuthProviderType;
+export declare function useAuthContext(): AuthContextType;
 export {};

package/dist/core/ui/Toolbar/context/api/EnvironmentProvider.d.ts

@@ -0,0 +1,12 @@
+import { FC } from 'react';
+interface EnvironmentContextType {
+    environment: string;
+    setEnvironment: (environment: string) => void;
+}
+interface EnvironmentProviderProps {
+    children: React.ReactNode;
+    clientSideId?: string;
+}
+export declare const EnvironmentProvider: FC<EnvironmentProviderProps>;
+export declare function useEnvironmentContext(): EnvironmentContextType;
+export {};

package/dist/core/ui/Toolbar/context/api/FlagsProvider.d.ts

@@ -0,0 +1,12 @@
+import { ApiFlag, FlagsResponse } from '../../types/ldApi';
+interface FlagsContextType {
+    flags: ApiFlag[];
+    loading: boolean;
+    getProjectFlags: (projectKey: string) => Promise<FlagsResponse>;
+    resetFlags: () => void;
+}
+export declare const FlagsProvider: ({ children }: {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare function useFlagsContext(): FlagsContextType;
+export {};

package/dist/core/ui/Toolbar/context/{IFrameProvider.d.ts → api/IFrameProvider.d.ts}

@@ -1,15 +1,17 @@
 import { RefObject } from 'react';
-export declare const IFRAME_API_MESSAGES: {
-    AUTHENTICATION: {
-        authenticated: string;
-        authenticationRequired: string;
-        error: string;
-    };
-    GET_FLAG: {
-        request: string;
-        response: string;
-        error: string;
-    };
+export declare const IFRAME_COMMANDS: {
+    LOGOUT: string;
+    GET_PROJECTS: string;
+    GET_FLAGS: string;
+    GET_FLAG: string;
+};
+export declare const getResponseTopic: (command: string) => string;
+export declare const getErrorTopic: (command: string) => string;
+export declare const IFRAME_EVENTS: {
+    AUTHENTICATED: string;
+    AUTH_REQUIRED: string;
+    AUTH_ERROR: string;
+    API_READY: string;
 };
 interface IFrameProviderProps {
     children: React.ReactNode;

package/dist/core/ui/Toolbar/context/api/ProjectProvider.d.ts

@@ -0,0 +1,17 @@
+import { ApiProject, ProjectsResponse, ApiEnvironment } from '../../types/ldApi';
+interface ProjectContextType {
+    projectKey: string;
+    setProjectKey: (projectKey: string) => void;
+    getProjects: () => Promise<ProjectsResponse>;
+    projects: ApiProject[];
+    environments: ApiEnvironment[];
+    loading: boolean;
+}
+interface ProjectProviderProps {
+    children: React.ReactNode;
+    clientSideId?: string;
+    providedProjectKey?: string;
+}
+export declare const ProjectProvider: ({ children, clientSideId, providedProjectKey }: ProjectProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare function useProjectContext(): ProjectContextType;
+export {};

package/dist/core/ui/Toolbar/context/api/index.d.ts

@@ -0,0 +1,7 @@
+export * from './ApiBundleProvider';
+export * from './ApiProvider';
+export * from './AuthProvider';
+export * from './EnvironmentProvider';
+export * from './FlagsProvider';
+export * from './IFrameProvider';
+export * from './ProjectProvider';

package/dist/core/ui/Toolbar/context/index.d.ts

@@ -1,6 +1,7 @@
-export { DevServerProvider, useDevServerContext } from './DevServerProvider';
-export { SearchProvider, useSearchContext } from './SearchProvider';
-export { ToolbarUIProvider, useToolbarUIContext } from './ToolbarUIProvider';
-export { FlagSdkOverrideProvider, useFlagSdkOverrideContext, type LocalFlag, type FlagSdkOverrideContextType, } from './FlagSdkOverrideProvider';
-export { AnalyticsProvider, useAnalytics } from './AnalyticsProvider';
-export { StarredFlagsProvider, useStarredFlags } from './StarredFlagsProvider';
+export * from './api';
+export * from './state';
+export * from './telemetry';
+export * from './DevServerProvider';
+export * from './FlagSdkOverrideProvider';
+export * from './StarredFlagsProvider';
+export * from './ElementSelectionProvider';

package/dist/core/ui/Toolbar/context/state/ActiveTabProvider.d.ts

@@ -0,0 +1,10 @@
+import type { ActiveTabId } from '../../types';
+interface ActiveTabContextType {
+    activeTab: ActiveTabId;
+    setActiveTab: (tab: ActiveTabId) => void;
+}
+export declare function ActiveTabProvider({ children }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useActiveTabContext(): ActiveTabContextType;
+export {};

package/dist/core/ui/Toolbar/context/state/PluginsProvider.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import { IEventInterceptionPlugin, IFlagOverridePlugin } from '../../../../../types';
+interface PluginsContextValue {
+    baseUrl: string;
+    flagOverridePlugin?: IFlagOverridePlugin;
+    eventInterceptionPlugin?: IEventInterceptionPlugin;
+}
+export interface PluginsProviderProps {
+    children: ReactNode;
+    baseUrl: string;
+    flagOverridePlugin?: IFlagOverridePlugin;
+    eventInterceptionPlugin?: IEventInterceptionPlugin;
+}
+export declare function PluginsProvider({ children, baseUrl, flagOverridePlugin, eventInterceptionPlugin, }: PluginsProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function usePlugins(): PluginsContextValue;
+export {};

package/dist/core/ui/Toolbar/context/{SearchProvider.d.ts → state/SearchProvider.d.ts}

@@ -1,8 +1,8 @@
 import React, { Dispatch, type SetStateAction } from 'react';
-type SearchContextType = {
+interface SearchContextType {
     searchTerm: string;
     setSearchTerm: Dispatch<SetStateAction<string>>;
-};
+}
 export declare function SearchProvider({ children }: {
     children: React.ReactNode;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/core/ui/Toolbar/context/state/ToolbarStateBundleProvider.d.ts

@@ -0,0 +1,13 @@
+import { IEventInterceptionPlugin, IFlagOverridePlugin } from '../../../../../types';
+import { ToolbarPosition } from '../../types';
+interface ToolbarStateBundleProviderProps {
+    initialPosition?: ToolbarPosition;
+    domId: string;
+    devServerUrl?: string;
+    baseUrl: string;
+    flagOverridePlugin?: IFlagOverridePlugin;
+    eventInterceptionPlugin?: IEventInterceptionPlugin;
+    children: React.ReactNode;
+}
+export declare function ToolbarStateBundleProvider(props: ToolbarStateBundleProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/core/ui/Toolbar/{hooks/useToolbarState.d.ts → context/state/ToolbarStateProvider.d.ts}

@@ -1,12 +1,7 @@
-import { Dispatch, SetStateAction } from 'react';
-import { ActiveTabId } from '../types';
-export interface UseToolbarStateProps {
-    defaultActiveTab: ActiveTabId;
-    domId: string;
-}
-export interface UseToolbarStateReturn {
+import React, { Dispatch, SetStateAction, ReactNode } from 'react';
+import { ActiveTabId, ToolbarMode } from '../../types';
+export interface ToolbarStateContextValue {
     isExpanded: boolean;
-    activeTab: ActiveTabId;
     previousTab: ActiveTabId;
     isAnimating: boolean;
     searchIsExpanded: boolean;
@@ -14,16 +9,21 @@ export interface UseToolbarStateReturn {
     hasBeenExpanded: boolean;
     reloadOnFlagChangeIsEnabled: boolean;
     isAutoCollapseEnabled: boolean;
-    optInToNewFeatures: boolean;
+    mode: ToolbarMode;
     toolbarRef: React.RefObject<HTMLDivElement | null>;
     handleTabChange: (tabId: string) => void;
     handleClose: () => void;
     handleSearch: (newSearchTerm: string) => void;
     handleToggleReloadOnFlagChange: () => void;
     handleToggleAutoCollapse: () => void;
-    handleToggleOptInToNewFeatures: () => void;
     handleCircleClick: () => void;
     setIsAnimating: Dispatch<SetStateAction<boolean>>;
     setSearchIsExpanded: Dispatch<SetStateAction<boolean>>;
 }
-export declare function useToolbarState(props: UseToolbarStateProps): UseToolbarStateReturn;
+export interface ToolbarStateProviderProps {
+    children: ReactNode;
+    domId: string;
+    devServerUrl?: string;
+}
+export declare function ToolbarStateProvider({ children, domId, devServerUrl }: ToolbarStateProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useToolbarState(): ToolbarStateContextValue;

package/dist/core/ui/Toolbar/context/{ToolbarUIProvider.d.ts → state/ToolbarUIProvider.d.ts}

@@ -1,5 +1,5 @@
 import type { FC, ReactNode } from 'react';
-import type { ToolbarPosition } from '../types/toolbar';
+import { ToolbarPosition } from '../../types';
 interface ToolbarUIContextValue {
     position: ToolbarPosition;
     handlePositionChange: (position: ToolbarPosition) => void;

package/dist/core/ui/Toolbar/context/state/index.d.ts

@@ -0,0 +1,6 @@
+export * from './ActiveTabProvider';
+export * from './PluginsProvider';
+export * from './SearchProvider';
+export * from './ToolbarStateBundleProvider';
+export * from './ToolbarStateProvider';
+export * from './ToolbarUIProvider';

package/dist/core/ui/Toolbar/context/{AnalyticsProvider.d.ts → telemetry/AnalyticsProvider.d.ts}

@@ -1,5 +1,5 @@
-import { ToolbarAnalytics } from '../../../utils/analytics';
-import { ToolbarMode } from '../types';
+import { ToolbarAnalytics } from '../../../../utils/analytics';
+import { ToolbarMode } from '../../types';
 interface AnalyticsProviderProps {
     children: React.ReactNode;
     mode?: ToolbarMode;

package/dist/core/ui/Toolbar/context/telemetry/TelemetryBundleProvider.d.ts

@@ -0,0 +1,11 @@
+import { ToolbarMode } from '../../types';
+interface TelemetryBundleProviderProps {
+    mode: ToolbarMode;
+    baseUrl?: string;
+    clientSideId?: string;
+    streamUrl?: string;
+    eventsUrl?: string;
+    children: React.ReactNode;
+}
+export declare function TelemetryBundleProvider(props: TelemetryBundleProviderProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/core/ui/Toolbar/context/telemetry/index.d.ts

@@ -0,0 +1,3 @@
+export * from './TelemetryBundleProvider';
+export * from './AnalyticsProvider';
+export * from './InternalClientProvider';

package/dist/core/ui/Toolbar/hooks/index.d.ts

@@ -1,4 +1,3 @@
-export { useToolbarState } from './useToolbarState';
 export { useToolbarAnimations } from './useToolbarAnimations';
 export { useToolbarVisibility } from './useToolbarVisibility';
 export { useToolbarDrag } from './useToolbarDrag';

package/dist/core/ui/Toolbar/types/ldApi.d.ts

@@ -0,0 +1,40 @@
+export interface ApiProject {
+    _id: string;
+    key: string;
+    name: string;
+    environments: ApiEnvironment[];
+}
+export interface ApiEnvironment {
+    _id: string;
+    key: string;
+    name: string;
+}
+export interface ApiFlag {
+    archived: boolean;
+    clientSideAvailability: {
+        usingEnvironmentId: boolean;
+        usingMobileKey: boolean;
+    };
+    customProperties: Record<string, any>;
+    description: string;
+    key: string;
+    kind: 'boolean' | 'string' | 'number' | 'object' | 'multivariate';
+    name: string;
+    variations: ApiVariation[];
+}
+export interface ApiVariation {
+    _id: string;
+    name: string;
+    value: any;
+}
+export interface FlagsResponse {
+    items: ApiFlag[];
+}
+export interface ProjectsResponse {
+    items: ApiProject[];
+}
+export interface FlagsPaginationParams {
+    limit?: number;
+    offset?: number;
+    query?: string;
+}

package/dist/core/ui/Toolbar/types/toolbar.d.ts

@@ -1,12 +1,13 @@
-export type TabId = 'flag-sdk' | 'flag-dev-server' | 'events' | 'settings';
+export type TabId = 'flag-sdk' | 'flag-dev-server' | 'events' | 'settings' | 'flags' | 'monitoring' | 'interactive' | 'ai' | 'optimize';
 export type ActiveTabId = TabId | undefined;
 export declare const TAB_ORDER: readonly TabId[];
 export type ToolbarMode = 'dev-server' | 'sdk';
 export declare const DEV_SERVER_TABS: readonly TabId[];
 export declare const SDK_MODE_TABS: readonly TabId[];
+export declare const NEW_TOOLBAR_TABS: readonly TabId[];
 export declare function getToolbarMode(devServerUrl?: string): ToolbarMode;
 export declare function getTabsForMode(mode: ToolbarMode, hasFlagOverridePlugin: boolean, hasEventInterceptionPlugin: boolean): readonly TabId[];
-export declare function getDefaultActiveTab(mode: ToolbarMode, hasFlagOverridePlugin?: boolean, hasEventInterceptionPlugin?: boolean): TabId;
+export declare function getDefaultActiveTab(mode: ToolbarMode, hasFlagOverridePlugin?: boolean, hasEventInterceptionPlugin?: boolean, useNewToolbarDesign?: boolean): TabId;
 export interface FeatureFlag {
     id: string;
     name: string;

package/dist/core/ui/Toolbar/utils/clipboard.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Copy text to clipboard with fallback for older browsers
+ * @param text - The text to copy to clipboard
+ * @returns Promise that resolves to true if copy was successful, false otherwise
+ */
+export declare function copyToClipboard(text: string): Promise<boolean>;

package/dist/core/ui/Toolbar/utils/localStorage.d.ts

@@ -1,16 +1,19 @@
 import { ToolbarPosition } from '../types/toolbar';
 export declare const TOOLBAR_STORAGE_KEYS: {
+    readonly ENVIRONMENT: "ld-toolbar-environment";
     readonly SETTINGS: "ld-toolbar-settings";
     readonly DISABLED: "ld-toolbar-disabled";
     readonly PROJECT: "ld-toolbar-project";
-    readonly OPT_IN_TO_NEW_FEATURES: "ld-toolbar-opt-in-to-new-features";
     readonly STARRED_FLAGS: "ld-toolbar-starred-flags";
+    readonly MCP_ALERT_DISMISSED: "ld-toolbar-mcp-alert-dismissed";
 };
+export type PreferredIde = 'cursor' | 'windsurf' | 'vscode' | 'github-copilot';
+export declare const PREFERRED_IDES: PreferredIde[];
 export interface ToolbarSettings {
     position: ToolbarPosition;
     reloadOnFlagChange: boolean;
     autoCollapse: boolean;
-    optInToNewFeatures: boolean;
+    preferredIde: PreferredIde;
 }
 export declare const DEFAULT_SETTINGS: ToolbarSettings;
 export declare function saveToolbarPosition(position: ToolbarPosition): void;
@@ -19,7 +22,9 @@ export declare function saveToolbarAutoCollapse(autoCollapse: boolean): void;
 export declare function loadToolbarAutoCollapse(): boolean;
 export declare function saveReloadOnFlagChange(isReloadOnFlagChange: boolean): void;
 export declare function loadReloadOnFlagChange(): boolean;
-export declare function saveOptInToNewFeatures(optInToNewFeatures: boolean): void;
-export declare function loadOptInToNewFeatures(): boolean;
 export declare function loadStarredFlags(): Set<string>;
 export declare function saveStarredFlags(starredFlags: Set<string>): void;
+export declare function savePreferredIde(ide: PreferredIde): void;
+export declare function loadPreferredIde(): PreferredIde;
+export declare function saveMCPAlertDismissed(dismissed: boolean): void;
+export declare function loadMCPAlertDismissed(): boolean;

package/dist/core/utils/analytics.d.ts

@@ -54,6 +54,10 @@ export declare class ToolbarAnalytics {
      * Track opening a flag deeplink
      */
     trackOpenFlagDeeplink(flagKey: string, baseUrl: string): void;
+    /**
+     * Track clearing events
+     */
+    trackClearEvents(): void;
     /**
      * Track Event clicks
      */
@@ -62,10 +66,30 @@ export declare class ToolbarAnalytics {
      * Track Reload on Flag Change toggles
      */
     trackReloadOnFlagChangeToggle(enabled: boolean): void;
+    /**
+     * Track successful login
+     */
+    trackLoginSuccess(): void;
+    /**
+     * Track when user closes the login screen without logging in
+     */
+    trackLoginCancelled(): void;
+    /**
+     * Track when user logs out
+     */
+    trackLogout(): void;
+    /**
+     * Track authentication errors
+     */
+    trackAuthError(error: unknown): void;
     /**
      * Track project switching in dev server mode
      */
     trackProjectSwitch(fromProject: string, toProject: string): void;
+    /**
+     * Track API errors
+     */
+    trackApiError(error: unknown): void;
     /**
      * Track refresh button clicks in dev server mode
      */
@@ -74,4 +98,8 @@ export declare class ToolbarAnalytics {
      * Track user feedback
      */
     trackFeedback(feedback: string, sentiment: FeedbackSentiment): void;
+    /**
+     * Track flag key copy
+     */
+    trackFlagKeyCopy(flagKey: string): void;
 }

package/dist/flags/toolbarFlags.d.ts

@@ -7,4 +7,7 @@
  * To add a toolbar feature flag, export it here like:
  * export const myFeature = createToolbarFlagFunction('my-feature-key', defaultValue);
  */
-export declare const __placeholder: () => boolean;
+export declare const useNewToolbarDesign: () => boolean;
+export declare const enableInteractiveIcon: () => boolean;
+export declare const enableAiIcon: () => boolean;
+export declare const enableOptimizeIcon: () => boolean;

package/dist/index.cjs

@@ -552,9 +552,7 @@ async function lazyLoad(signal, url) {
         throw new Error(`Could not load LaunchDarkly developer toolbar bundle from ${url}`);
     }
 }
-var package_namespaceObject = {
-    rE: "1.6.0"
-};
+var package_namespaceObject = JSON.parse('{"rE":"2.2.0-beta.1"}');
 function useLaunchDarklyToolbar(args) {
     const { toolbarBundleUrl, enabled, ...initConfig } = args;
     const configRef = (0, external_react_namespaceObject.useRef)(null);