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

unctx

Package Overview
Dependencies
Maintainers
1
Versions
23
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

unctx - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

7

CHANGELOG.md

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

### [0.0.2](https://github.com/unjs/unctx/compare/v0.0.1...v0.0.2) (2021-03-30)
### Features
* simplify useContext ([4a740bc](https://github.com/unjs/unctx/commit/4a740bc9c7c6013569859018ef5d622acbb6b55a))
### 0.0.1 (2021-03-30)

@@ -7,0 +14,0 @@

5

dist/index.d.ts

@@ -13,4 +13,5 @@ interface UseContext<T> {

declare const defaultNamespace: ContextNamespace;
declare const useContext: <T>(key: string) => UseContext<T>;
declare const getContext: <T>(key: string) => UseContext<T>;
declare const useContext: <T>(key: string) => () => T;
export { ContextNamespace, UseContext, createContext, createNamespace, defaultNamespace, useContext };
export { ContextNamespace, UseContext, createContext, createNamespace, defaultNamespace, getContext, useContext };

4

dist/index.js

@@ -29,3 +29,4 @@ 'use strict';

const defaultNamespace = _globalThis[globalKey] || (_globalThis[globalKey] = createNamespace());
const useContext = (key) => defaultNamespace.get(key);
const getContext = (key) => defaultNamespace.get(key);
const useContext = (key) => getContext(key).use;

@@ -35,2 +36,3 @@ exports.createContext = createContext;

exports.defaultNamespace = defaultNamespace;
exports.getContext = getContext;
exports.useContext = useContext;
{
"name": "unctx",
"version": "0.0.1",
"version": "0.0.2",
"description": "Composition-api in Vanilla js",

@@ -5,0 +5,0 @@ "repository": "unjs/unctx",

@@ -13,3 +13,3 @@ # 🍦 unctx

[Vue.js](https://vuejs.org) introduced an amazing pattern called [Composition API](https://v3.vuejs.org/guide/composition-api-introduction.html) that allows organizing complex logic by spliting it into reusable functions and grouping in logical order. `unctx` allows easily implementing composition api pattern in your javascript libraries without hassle.
[Vue.js](https://vuejs.org) introduced an amazing pattern called [Composition API](https://v3.vuejs.org/guide/composition-api-introduction.html) that allows organizing complex logic by splitting it into reusable functions and grouping in logical order. `unctx` allows easily implementing composition api pattern in your javascript libraries without hassle.

@@ -53,15 +53,14 @@ ## Integration

Composition of functions is possible using temporary context injection. Under the hood a temporary singleton variable is kept (per context)
To avoid issues with multiple version of library, `unctx` provides a safe global namespace to access context by key (kept in [`globalThis`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis)). **Important:** Please use a verbose name for key to avoid conflict with other js libraries. Using npm package name is recommended. Using symbols has no effect since it still causes multiple context issue.
To avoid issues with multiple instances of library, `unctx` provides a safe global namespace to access contexts with (kept in [`globalThis`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/globalThis))
```js
import { useContext, getContext } from 'unctx'
**Important:** Please use a verbose name for key to avoid conflict with other js libraries. Using npm package name is recommended.
const useAwesome = useContext('awesome-lib')
```js
import { useContext } from 'unctx'
const { use: useAwesome, call } = useContext('awesome-lib')
// or
// const awesomeContext = getContext('awesome-lib')
```
You can also create your own internal namespace with `createNamespace` utility for more advanced usecases.
You can also create your own internal namespace with `createNamespace` utility for more advanced use cases.

@@ -77,2 +76,6 @@ ## Typescript

## Under the hood
Composition of functions is possible using temporary context injection. When calling `ctx.call(instance, cb)`, `instance` argument will be stored in a temporary variable then `cb` is called. Any function inside `cb`, can then implicitly access instance by using `ctx.use` (or `useAwesome`)
## Pitfalls

@@ -82,3 +85,3 @@

To avoid leaking context, `call` method synchronously sets context and unsets it as soon as possible. Because of this, `useAwesome` should happen before first `await` call and reused if necessary.
To avoid leaking context, `call` method synchronously sets context and unset it as soon as possible. Because of this, `useAwesome` should happen before first `await` call and reused if necessary.

@@ -85,0 +88,0 @@ ```js

Sorry, the diff of this file is not supported yet

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