Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@spotify-confidence/react

Package Overview
Dependencies
Maintainers
0
Versions
8
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@spotify-confidence/react - npm Package Compare versions

Comparing version 0.0.4 to 0.0.6

dist/index.cjs.js

39

CHANGELOG.md

@@ -9,2 +9,41 @@ # Changelog

## [0.0.6](https://github.com/spotify/confidence-sdk-js/compare/react-v0.0.5...react-v0.0.6) (2024-08-20)
### 🐛 Bug Fixes
* use main&module instead of exports ([5cc01b6](https://github.com/spotify/confidence-sdk-js/commit/5cc01b6c4f7cc9d0857e35ddfcca5cad3ae4d85b))
* workspace star and no amend ([#192](https://github.com/spotify/confidence-sdk-js/issues/192)) ([82c4f7d](https://github.com/spotify/confidence-sdk-js/commit/82c4f7d0d7fae558ac96617f6d51e29966e19400))
### 🧹 Chore
* update package json to expose both es and cjs ([5cc01b6](https://github.com/spotify/confidence-sdk-js/commit/5cc01b6c4f7cc9d0857e35ddfcca5cad3ae4d85b))
### 📚 Documentation
* add documentation to the SDK to resolve MD warnings ([#177](https://github.com/spotify/confidence-sdk-js/issues/177)) ([956594b](https://github.com/spotify/confidence-sdk-js/commit/956594b3f666de3eb9567f7b4855d69a6057d2d0))
### Dependencies
* The following workspace dependencies were updated
* devDependencies
* @spotify-confidence/sdk bumped to 0.1.6
## [0.0.5](https://github.com/spotify/confidence-sdk-js/compare/react-v0.0.4...react-v0.0.5) (2024-07-08)
### ✨ New Features
* improved suspense management ([#167](https://github.com/spotify/confidence-sdk-js/issues/167)) ([0a96d8f](https://github.com/spotify/confidence-sdk-js/commit/0a96d8f8d6ea25a13c1ecdf2f5a1598e53e9c1fc))
### Dependencies
* The following workspace dependencies were updated
* devDependencies
* @spotify-confidence/sdk bumped from 0.1.4 to 0.1.5
## [0.0.3](https://github.com/spotify/confidence-sdk-js/compare/react-v0.0.2...react-v0.0.3) (2024-06-04)

@@ -11,0 +50,0 @@

65

dist/index.d.ts

@@ -14,2 +14,6 @@ import { Closer } from '@spotify-confidence/sdk';

/**
* Confidence Provider for React
* @public
*/
export declare type ConfidenceProvider = FC<PropsWithChildren<{

@@ -23,20 +27,56 @@ confidence: Confidence;

/**
* Confidence Provider for React
* @public
*/
export declare const ConfidenceProvider: ConfidenceProvider;
/**
* Confidence React instance
* @public
*/
export declare class ConfidenceReact implements EventSender, Trackable, FlagResolver {
/* Excluded from this release type: delegate */
constructor(delegate: Confidence);
/** Return configurations of the Confidence instance */
get config(): Configuration;
/* Excluded from this release type: contextState */
/**
* Tracks an event
* @param name - event name
* @param message - data to track */
track(name: string, message?: Value.Struct): void;
/**
* Tracks an event
* @param manager - trackable manager */
track(manager: Trackable.Manager): Closer;
/** Returns context of the current Confidence instance */
getContext(): Context;
setContext(context: Context): void;
/** Set Confidence context */
setContext(context: Context, { transition }?: {
transition?: boolean | undefined;
}): void;
/** Subscribe to flag changes in Confidence */
subscribe(onStateChange?: StateObserver | undefined): () => void;
clearContext(): void;
/** Clears context of current Confidence instance */
clearContext({ transition }?: {
transition?: boolean | undefined;
}): void;
/**
* Creates a new ConfidenceReact instance with context
* @param context - Confidence context
* @returns ConfidenceReact instance
*/
withContext(context: Context): ConfidenceReact;
/** Evaluates a flag */
evaluateFlag<T extends Value>(path: string, defaultValue: T): FlagEvaluation<Value.Widen<T>>;
/** Returns flag value for a given flag */
getFlag<T extends Value>(path: string, defaultValue: T): Promise<Value.Widen<T>>;
/** Hook to access Context */
useContext(): Context;
/** Hook to access the WithContext functionality. Returns a ConfidenceReact instance with the passed context. */
useWithContext(context: Context): ConfidenceReact;
/** Hook to use EvaluateFlag functionality */
useEvaluateFlag<T extends Value>(path: string, defaultValue: T): FlagEvaluation<Value.Widen<T>>;
/** Hook to use getFlag functionality */
useFlag<T extends Value>(path: string, defaultValue: T): Value.Widen<T>;

@@ -46,10 +86,31 @@ private assertContext;

/**
* Enables using Confidence
* @public
*/
export declare const useConfidence: () => ConfidenceReact;
/**
* Use Confidence Context
* @public
*/
export declare function useConfidenceContext(confidence?: ConfidenceReact): Context;
/**
* Use EvaluateFlag
* @public */
export declare function useEvaluateFlag<T extends Value>(path: string, defaultValue: T, confidence?: ConfidenceReact): FlagEvaluation<Value.Widen<T>>;
/**
* Use Flag
* @public
*/
export declare function useFlag<T extends Value>(path: string, defaultValue: T, confidence?: ConfidenceReact): Value.Widen<T>;
/**
* Use with given Confidence Context
* @public
*/
export declare function useWithContext(context: Context, parent?: ConfidenceReact): ConfidenceReact;
export { }

17

package.json
{
"name": "@spotify-confidence/react",
"license": "Apache-2.0",
"version": "0.0.4",
"version": "0.0.6",
"types": "dist/index.d.ts",

@@ -22,16 +22,17 @@ "files": [

"types": "dist/index.d.ts",
"main": "dist/index.js"
"main": "dist/index.cjs.js",
"module": "dist/index.esm.js"
},
"peerDependencies": {
"@spotify-confidence/sdk": "0.1.4",
"@spotify-confidence/sdk": "^0.1.4",
"react": "^18.2.0"
},
"devDependencies": {
"@microsoft/api-extractor": "*",
"@spotify-confidence/sdk": "0.1.4",
"@microsoft/api-extractor": "7.43.1",
"@spotify-confidence/sdk": "0.1.6",
"react": "^18.2.0",
"rollup": "*"
"rollup": "4.14.2"
},
"type": "module",
"main": "dist/index.js"
"main": "dist/index.cjs.js",
"module": "dist/index.esm.js"
}

@@ -42,5 +42,7 @@ # Confidence React SDK

Anywhere in the sub-tree under the `ConfidenceProvider` you can now access the confidence instance with the `useConfidence()` hook. The hook actually returns an instance of `ConfidenceReact` which is a wrapper around the normal `Confidence` API with some slight adaptations to integrate better with React. You can read more about the differences in the following sections.
### Managing context
The `useConfidence()` hook supports the [standard context API's](https://github.com/spotify/confidence-sdk-js/blob/main/packages/sdk/README.md#setting-the-context). Additionally, the following wrapper component can be used to wrap a sub tree with additional context data.
The `ConfidenceReact` instance supports the [standard context API](https://github.com/spotify/confidence-sdk-js/blob/main/packages/sdk/README.md#setting-the-context). Additionally, the following wrapper component can be used to wrap a sub tree with additional context data.

@@ -58,8 +60,12 @@ ```ts

- `useFlag(flagName, defaultValue)` will return the flag value or default.
- `useEvaluateFlag(flagName, defaultValue)` will return more details about the flag evaluation, together with the value
- `useEvaluateFlag(flagName, defaultValue)` will return more details about the flag evaluation, together with the value.
Both of the flag hooks integrate with the React Suspense API so that the suspense fallback will be visible until flag values are available. It is therefore important to wrap .
Alternatively the `ConfidenceReact` instance has the same hooks as methods on the instance itself, remember though, that these instance methods are hooks and the normal rules for hooks apply.
Accessing flags will always attempt to provide a up to date value for the flag within the defined timeout, or else default values.
Both of the flag hooks integrate with the React Suspense API so that the suspense fallback will be shown until flag values are available. It is therefore important to wrap any component using the above hooks in a suspense boundary.
The hooks are also reactive so that if the context changes, any components using the hooks will be re-rendered. As dependent components are re-rendered as soon as the context changes, one might expect that would again trigger the suspense boundary while the flag values are resolved. That is normally not the case however as the `ConfidenceReact.setContext` method is by default wrapped in a React [Transition](https://react.dev/reference/react/startTransition). If you would rather manage the transition logic yourself (with for example [React.useTransition()](https://react.dev/reference/react/useTransition)), or if you want to always trigger a suspense fallback to never show stale values, you can turn off the default behavior by calling `ConfidenceReact.setContext({...}, { transition:false })`.
If the hooks can't resolve the flag values withing the timeout specified on the Confidence instance, they will instead return the default value.
### Tracking events

@@ -66,0 +72,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc