🎩 You're Invited:Meet the Socket team at Black Hat in Las Vegas, August 3-6.RSVP →
Sign In

react-native-patina

Package Overview
Dependencies
Maintainers
1
Versions
8
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-native-patina - npm Package Compare versions

Comparing version
0.1.4
 to
0.1.5
+7
-0
CHANGELOG.md
# react-native-patina
## 0.1.5 (2021-07-28)
### Fixed
- Fix the Flow component-type definitions, so props-checking works again.
- Stop including raw source code in the NPM package.
## 0.1.4 (2021-07-07)

@@ -4,0 +11,0 @@ 

+0
-1
lib/cacheStyles.js

@@ -34,2 +34,1 @@ import { StyleSheet } from 'react-native';

}
//# sourceMappingURL=cacheStyles.js.map
+0
-1
lib/index.js
export * from './cacheStyles';
export * from './ThemeContext';
//# sourceMappingURL=index.js.map
+0
-1
lib/ThemeContext.js

@@ -60,2 +60,1 @@ import * as React from 'react';

}
//# sourceMappingURL=ThemeContext.js.map
+2
-3
package.json
{
"name": "react-native-patina",
"version": "0.1.4",
"version": "0.1.5",
"private": false,

@@ -20,4 +20,3 @@ "description": "A simple, type-aware theming library",

"/package.json",
"/README.md",
"/src/*"
"/README.md"
],

@@ -24,0 +23,0 @@ "scripts": {

-1
lib/cacheStyles.js.map
{"version":3,"file":"cacheStyles.js","sourceRoot":"","sources":["../src/cacheStyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,UAAU,EAAwB,MAAM,cAAc,CAAA;AAE3E,IAAI,SAAS,GAAG,CAAC,CAAA;AAEjB;;GAEG;AACH,MAAM,UAAU,WAAW,CAGzB,QAAkC;IAClC,MAAM,KAAK,GAA2C,EAAE,CAAA;IAExD,OAAO,SAAS,UAAU,CAAC,KAAY;QACrC,qCAAqC;QACrC,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,KAAK,KAAK;YAAE,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAA;QAEvE,4DAA4D;QAC5D,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE;YACrC,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,KAAK,KAAK,EAAE;gBAC5B,MAAM,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;gBAChC,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,CAAA;gBACvB,OAAO,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAA;aACtB;SACF;QAED,6CAA6C;QAC7C,MAAM,KAAK,GAAG,UAAU,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAA;QAChD,KAAK,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAA;QAC/B,IAAI,KAAK,CAAC,MAAM,GAAG,SAAS;YAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;QACjD,OAAO,KAAK,CAAA;IACd,CAAC,CAAA;AACH,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,YAAY,CAAC,IAAY;IACvC,SAAS,GAAG,IAAI,CAAA;AAClB,CAAC"}
-1
lib/index.js.map
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA"}
-1
lib/ThemeContext.js.map
{"version":3,"file":"ThemeContext.js","sourceRoot":"","sources":["../src/ThemeContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAqC9B;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAC9B,YAAmB;IAEnB,IAAI,SAAS,GAAgC,EAAE,CAAA;IAC/C,IAAI,KAAK,GAAU,YAAY,CAAA;IAC/B,MAAM,OAAO,GAAG,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;IAE1C,SAAS,QAAQ;QACf,OAAO,KAAK,CAAA;IACd,CAAC;IAED,SAAS,WAAW,CAAC,SAAgB;QACnC,KAAK,GAAG,SAAS,CAAA;QACjB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,EAAE,CAAC;YAAE,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAA;IAChE,CAAC;IAED,SAAS,UAAU,CAAC,QAA8B;QAChD,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QACxB,OAAO,GAAG,EAAE;YACV,SAAS,GAAG,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAA;QACzD,CAAC,CAAA;IACH,CAAC;IAED,SAAS,aAAa,CAAC,KAAyB;QAC9C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;QACzD,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,EAAE,EAAE,CAAC,CAAA;QAEpD,OAAO,CACL,oBAAC,OAAO,CAAC,QAAQ,IAAC,KAAK,EAAE,UAAU,IAAG,KAAK,CAAC,QAAQ,CAAoB,CACzE,CAAA;IACH,CAAC;IAED,SAAS,QAAQ;QACf,OAAO,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;IAClC,CAAC;IAED,SAAS,SAAS,CAChB,SAAqC;QAErC,SAAS,SAAS,CAAC,KAAyB;YAC1C,MAAM,KAAK,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;YACvC,mBAAmB;YACnB,OAAO,oBAAC,SAAS,oBAAK,KAAK,IAAE,KAAK,EAAE,KAAK,IAAI,CAAA;QAC/C,CAAC;QACD,SAAS,CAAC,WAAW,GAAG,aAAa,aAAa,CAAC,SAAS,CAAC,GAAG,CAAA;QAChE,OAAO,SAAS,CAAA;IAClB,CAAC;IAED,OAAO;QACL,QAAQ;QACR,WAAW;QACX,UAAU;QACV,aAAa;QACb,QAAQ;QACR,SAAS;KACV,CAAA;AACH,CAAC;AAED;;GAEG;AACH,SAAS,aAAa,CAAC,SAAmC;IACxD,IAAI,SAAS,CAAC,WAAW,IAAI,IAAI;QAAE,OAAO,SAAS,CAAC,WAAW,CAAA;IAC/D,IAAI,SAAS,CAAC,IAAI,IAAI,IAAI;QAAE,OAAO,SAAS,CAAC,IAAI,CAAA;IACjD,OAAO,WAAW,CAAA;AACpB,CAAC"}
-40
src/cacheStyles.ts
import { ImageStyle, StyleSheet, TextStyle, ViewStyle } from 'react-native'
let cacheSize = 1
/**
* Memoizes a theme-to-stylesheet conversion function.
*/
export function cacheStyles<
Theme,
Styles extends { [key: string]: ViewStyle | TextStyle | ImageStyle }
>(callback: (theme: Theme) => Styles): (theme: Theme) => Styles {
const cache: Array<{ theme: Theme; style: Styles }> = []
return function styleCache(theme: Theme) {
// Quickly try the first cache entry:
if (cache.length > 0 && cache[0].theme === theme) return cache[0].style
// If we have a deeper cache entry, recycle it to the front:
for (let i = 1; i < cache.length; ++i) {
if (cache[i].theme === theme) {
const [row] = cache.splice(i, 1)
cache.splice(0, 0, row)
return cache[0].style
}
}
// Ok, this our first time seeing this theme:
const style = StyleSheet.create(callback(theme))
cache.unshift({ theme, style })
if (cache.length > cacheSize) cache.splice(-1, 1)
return style
}
}
/**
* Adjusts the number of style objects `cacheStyles` should remember.
*/
export function setCacheSize(size: number): void {
cacheSize = size
}
-47
src/index.flow.js
// @flow
import * as React from 'react'
/**
* A callback passed to watchTheme.
*/
export type WatchCallback<Theme> = (theme: Theme) => void
/**
* Undoes the effect of `watchTheme`.
*/
export type Unsubscribe = () => void
interface ProviderProps {
children?: React.Node;
}
type RemoveTheme<Theme, Props: { theme: Theme }> = $Diff<
Props,
{ theme: Theme }
>
/**
* A set of tools for listening to theme changes.
*/
export type ThemeContext<Theme> = {
// Direct theme access:
getTheme(): Theme,
changeTheme(theme: Theme): void,
watchTheme(callback: WatchCallback<Theme>): Unsubscribe,
// React component access:
ThemeProvider: React.ComponentType<ProviderProps>,
useTheme(): Theme,
withTheme<Props: { theme: Theme }>(
Component: React.ComponentType<Props>
): (props: RemoveTheme<Theme, Props>) => React.Node
}
declare export function makeThemeContext<Theme>(
theme: Theme
): ThemeContext<Theme>
declare export function cacheStyles<Theme, Styles: Object>(
callback: (theme: Theme) => Styles
): (theme: Theme) => Styles
-2
src/index.ts
export * from './cacheStyles'
export * from './ThemeContext'
-107
src/ThemeContext.tsx
import * as React from 'react'
/**
* A callback passed to watchTheme.
*/
export type WatchCallback<Theme> = (theme: Theme) => void
/**
* Undoes the effect of `watchTheme`.
*/
export type Unsubscribe = () => void
export interface ThemeProviderProps {
children?: React.ReactNode
}
type RemoveTheme<Props> = 'theme' extends keyof Props
? Pick<Props, Exclude<keyof Props, 'theme'>>
: Props
/**
* A set of tools for listening to theme changes.
*/
export interface ThemeContext<Theme> {
// Direct theme access:
getTheme: () => Theme
changeTheme: (theme: Theme) => void
watchTheme: (callback: WatchCallback<Theme>) => Unsubscribe
// React component access:
ThemeProvider: (props: ThemeProviderProps) => JSX.Element
useTheme: () => Theme
withTheme: <Props extends { theme: Theme }>(
Component: React.ComponentType<Props>
) => (props: RemoveTheme<Props>) => JSX.Element
}
/**
* Constructs a unique ThemeContext.
* Several of these can coexist within an application.
*/
export function makeThemeContext<Theme>(
initialTheme: Theme
): ThemeContext<Theme> {
let callbacks: Array<WatchCallback<Theme>> = []
let theme: Theme = initialTheme
const Context = React.createContext(theme)
function getTheme(): Theme {
return theme
}
function changeTheme(nextTheme: Theme): void {
theme = nextTheme
for (let i = 0; i < callbacks.length; ++i) callbacks[i](theme)
}
function watchTheme(callback: WatchCallback<Theme>): Unsubscribe {
callbacks.push(callback)
return () => {
callbacks = callbacks.filter(item => item !== callback)
}
}
function ThemeProvider(props: ThemeProviderProps): JSX.Element {
const [themeState, setThemeState] = React.useState(theme)
React.useEffect(() => watchTheme(setThemeState), [])
return (
<Context.Provider value={themeState}>{props.children}</Context.Provider>
)
}
function useTheme(): Theme {
return React.useContext(Context)
}
function withTheme<Props extends { theme: Theme }>(
Component: React.ComponentType<Props>
): (props: RemoveTheme<Props>) => JSX.Element {
function WithTheme(props: RemoveTheme<Props>): JSX.Element {
const theme = React.useContext(Context)
// @ts-expect-error
return <Component {...props} theme={theme} />
}
WithTheme.displayName = `WithTheme(${componentName(Component)})`
return WithTheme
}
return {
getTheme,
changeTheme,
watchTheme,
ThemeProvider,
useTheme,
withTheme
}
}
/**
* Gets a component's display name.
*/
function componentName(Component: React.ComponentType<any>): string {
if (Component.displayName != null) return Component.displayName
if (Component.name != null) return Component.name
return 'Component'
}
lib/index.js.flow

Sorry, the diff of this file is not supported yet