@react-spectrum/utils
Advanced tools
Comparing version
@@ -29,3 +29,3 @@ var $9bLOP$clsx = require("clsx"); | ||
$e720495fead531ee$export$46d604dce8bf8724 = true; | ||
console.warn("Legacy spectrum-prefixed class names enabled for backward compatibility. We recommend replacing instances of CSS overrides targeting spectrum selectors in your app with custom class names of your own, and disabling this flag."); | ||
if (process.env.NODE_ENV !== 'production') console.warn("Legacy spectrum-prefixed class names enabled for backward compatibility. We recommend replacing instances of CSS overrides targeting spectrum selectors in your app with custom class names of your own, and disabling this flag."); | ||
} | ||
@@ -32,0 +32,0 @@ function $e720495fead531ee$export$ce4ab0c55987d1ff(cssModule, ...values) { |
@@ -17,3 +17,3 @@ import $jPV9R$clsx from "clsx"; | ||
$fd933927dbac1f15$export$46d604dce8bf8724 = true; | ||
console.warn("Legacy spectrum-prefixed class names enabled for backward compatibility. We recommend replacing instances of CSS overrides targeting spectrum selectors in your app with custom class names of your own, and disabling this flag."); | ||
if (process.env.NODE_ENV !== 'production') console.warn("Legacy spectrum-prefixed class names enabled for backward compatibility. We recommend replacing instances of CSS overrides targeting spectrum selectors in your app with custom class names of your own, and disabling this flag."); | ||
} | ||
@@ -20,0 +20,0 @@ function $fd933927dbac1f15$export$ce4ab0c55987d1ff(cssModule, ...values) { |
@@ -441,5 +441,5 @@ var $893a66ba513f4a66$exports = require("./BreakpointProvider.main.js"); | ||
// @ts-ignore | ||
if (otherProps.className) console.warn("The className prop is unsafe and is unsupported in React Spectrum v3. Please use style props with Spectrum variables, or UNSAFE_className if you absolutely must do something custom. Note that this may break in future versions due to DOM structure changes."); | ||
if (otherProps.className && process.env.NODE_ENV !== 'production') console.warn("The className prop is unsafe and is unsupported in React Spectrum v3. Please use style props with Spectrum variables, or UNSAFE_className if you absolutely must do something custom. Note that this may break in future versions due to DOM structure changes."); | ||
// @ts-ignore | ||
if (otherProps.style) console.warn("The style prop is unsafe and is unsupported in React Spectrum v3. Please use style props with Spectrum variables, or UNSAFE_style if you absolutely must do something custom. Note that this may break in future versions due to DOM structure changes."); | ||
if (otherProps.style && process.env.NODE_ENV !== 'production') console.warn("The style prop is unsafe and is unsupported in React Spectrum v3. Please use style props with Spectrum variables, or UNSAFE_style if you absolutely must do something custom. Note that this may break in future versions due to DOM structure changes."); | ||
let styleProps = { | ||
@@ -446,0 +446,0 @@ style: style, |
@@ -428,5 +428,5 @@ import {useBreakpoint as $1051245f87c5981d$export$199d6754bdf4e1e3} from "./BreakpointProvider.module.js"; | ||
// @ts-ignore | ||
if (otherProps.className) console.warn("The className prop is unsafe and is unsupported in React Spectrum v3. Please use style props with Spectrum variables, or UNSAFE_className if you absolutely must do something custom. Note that this may break in future versions due to DOM structure changes."); | ||
if (otherProps.className && process.env.NODE_ENV !== 'production') console.warn("The className prop is unsafe and is unsupported in React Spectrum v3. Please use style props with Spectrum variables, or UNSAFE_className if you absolutely must do something custom. Note that this may break in future versions due to DOM structure changes."); | ||
// @ts-ignore | ||
if (otherProps.style) console.warn("The style prop is unsafe and is unsupported in React Spectrum v3. Please use style props with Spectrum variables, or UNSAFE_style if you absolutely must do something custom. Note that this may break in future versions due to DOM structure changes."); | ||
if (otherProps.style && process.env.NODE_ENV !== 'production') console.warn("The style prop is unsafe and is unsupported in React Spectrum v3. Please use style props with Spectrum variables, or UNSAFE_style if you absolutely must do something custom. Note that this may break in future versions due to DOM structure changes."); | ||
let styleProps = { | ||
@@ -433,0 +433,0 @@ style: style, |
@@ -1,2 +0,2 @@ | ||
import React, { ReactNode, CSSProperties, HTMLAttributes, JSXElementConstructor, ReactElement } from "react"; | ||
import { ReactNode, CSSProperties, HTMLAttributes, JSXElementConstructor, ReactElement } from "react"; | ||
import { ColorVersion, DimensionValue, Direction, Responsive, StyleProps, ViewStyleProps, DOMRef, DOMRefValue, FocusableElement, FocusableRef, FocusableRefValue, RefObject } from "@react-types/shared"; | ||
@@ -16,3 +16,3 @@ interface Breakpoints { | ||
} | ||
export function BreakpointProvider(props: BreakpointProviderProps): React.JSX.Element; | ||
export function BreakpointProvider(props: BreakpointProviderProps): ReactNode; | ||
export function useMatchedBreakpoints(breakpoints: Breakpoints): string[]; | ||
@@ -37,3 +37,3 @@ export function useBreakpoint(): BreakpointContext | null; | ||
}; | ||
export function passthroughStyle(value: any): any; | ||
export function passthroughStyle<T>(value: T): T; | ||
export function getResponsiveProp<T>(prop: Responsive<T>, matchedBreakpoints: Breakpoint[]): T | undefined; | ||
@@ -56,5 +56,18 @@ export let shouldKeepSpectrumClassNames: boolean; | ||
}, defaultSlot?: string): T; | ||
export function cssModuleToSlots(cssModule: any): {}; | ||
export function SlotProvider(props: any): React.JSX.Element; | ||
export function ClearSlots(props: any): React.JSX.Element; | ||
export function cssModuleToSlots(cssModule: { | ||
[cssmodule: string]: string; | ||
}): { | ||
[slot: string]: { | ||
UNSAFE_className: string; | ||
}; | ||
}; | ||
export function SlotProvider(props: { | ||
slots?: { | ||
[slot: string]: object; | ||
}; | ||
children?: ReactNode; | ||
}): ReactNode; | ||
export function ClearSlots(props: { | ||
children?: ReactNode; | ||
}): ReactNode; | ||
export function useHasChild(query: string, ref: RefObject<HTMLElement | null>): boolean; | ||
@@ -61,0 +74,0 @@ export function useIsMobileDevice(): boolean; |
{ | ||
"name": "@react-spectrum/utils", | ||
"version": "3.0.0-nightly-c53ab48ec-250115", | ||
"version": "3.0.0-nightly-c7285d5d1-250618", | ||
"description": "Spectrum UI components in React", | ||
@@ -9,3 +9,7 @@ "license": "Apache-2.0", | ||
"exports": { | ||
"types": "./dist/types.d.ts", | ||
"source": "./src/index.ts", | ||
"types": [ | ||
"./dist/types.d.ts", | ||
"./src/index.ts" | ||
], | ||
"import": "./dist/import.mjs", | ||
@@ -28,6 +32,6 @@ "require": "./dist/main.js" | ||
"dependencies": { | ||
"@react-aria/i18n": "3.0.0-nightly-c53ab48ec-250115", | ||
"@react-aria/ssr": "3.0.0-nightly-c53ab48ec-250115", | ||
"@react-aria/utils": "3.0.0-nightly-c53ab48ec-250115", | ||
"@react-types/shared": "3.0.0-nightly-c53ab48ec-250115", | ||
"@react-aria/i18n": "3.0.0-nightly-c7285d5d1-250618", | ||
"@react-aria/ssr": "3.0.0-nightly-c7285d5d1-250618", | ||
"@react-aria/utils": "3.0.0-nightly-c7285d5d1-250618", | ||
"@react-types/shared": "3.0.0-nightly-c7285d5d1-250618", | ||
"@swc/helpers": "^0.5.0", | ||
@@ -34,0 +38,0 @@ "clsx": "^2.0.0" |
@@ -17,9 +17,11 @@ /* | ||
export function keepSpectrumClassNames() { | ||
export function keepSpectrumClassNames(): void { | ||
shouldKeepSpectrumClassNames = true; | ||
console.warn( | ||
'Legacy spectrum-prefixed class names enabled for backward compatibility. ' + | ||
'We recommend replacing instances of CSS overrides targeting spectrum selectors ' + | ||
'in your app with custom class names of your own, and disabling this flag.' | ||
); | ||
if (process.env.NODE_ENV !== 'production') { | ||
console.warn( | ||
'Legacy spectrum-prefixed class names enabled for backward compatibility. ' + | ||
'We recommend replacing instances of CSS overrides targeting spectrum selectors ' + | ||
'in your app with custom class names of your own, and disabling this flag.' | ||
); | ||
} | ||
} | ||
@@ -26,0 +28,0 @@ |
@@ -126,3 +126,3 @@ /* | ||
export function dimensionValue(value: DimensionValue) { | ||
export function dimensionValue(value: DimensionValue): string | undefined { | ||
if (typeof value === 'number') { | ||
@@ -147,3 +147,3 @@ return value + 'px'; | ||
export function responsiveDimensionValue(value: Responsive<DimensionValue>, matchedBreakpoints: Breakpoint[]) { | ||
export function responsiveDimensionValue(value: Responsive<DimensionValue>, matchedBreakpoints: Breakpoint[]): string | undefined { | ||
let responsiveValue = getResponsiveProp(value, matchedBreakpoints); | ||
@@ -164,3 +164,3 @@ if (responsiveValue != null) { | ||
function backgroundColorValue(value: BackgroundColorValue, version = 5) { | ||
function backgroundColorValue(value: BackgroundColorValue, version = 5): string | undefined { | ||
if (!value) { | ||
@@ -173,3 +173,3 @@ return undefined; | ||
function borderColorValue(value: BorderColorValue, version = 5) { | ||
function borderColorValue(value: BorderColorValue, version = 5): string | undefined { | ||
if (!value) { | ||
@@ -186,3 +186,3 @@ return undefined; | ||
function borderSizeValue(value?: BorderSizeValue | null) { | ||
function borderSizeValue(value?: BorderSizeValue | null): string { | ||
return value && value !== 'none' | ||
@@ -193,3 +193,3 @@ ? `var(--spectrum-alias-border-size-${value})` | ||
function borderRadiusValue(value: BorderRadiusValue) { | ||
function borderRadiusValue(value: BorderRadiusValue): string | undefined { | ||
if (!value) { | ||
@@ -202,11 +202,11 @@ return undefined; | ||
function hiddenValue(value: boolean) { | ||
function hiddenValue(value: boolean): string | undefined { | ||
return value ? 'none' : undefined; | ||
} | ||
function anyValue(value: any) { | ||
function anyValue<T>(value: T): T { | ||
return value; | ||
} | ||
function flexValue(value: boolean | number | string) { | ||
function flexValue(value: boolean | number | string): string | undefined { | ||
if (typeof value === 'boolean') { | ||
@@ -219,3 +219,3 @@ return value ? '1' : undefined; | ||
export function convertStyleProps<C extends ColorVersion>(props: ViewStyleProps<C>, handlers: StyleHandlers, direction: Direction, matchedBreakpoints: Breakpoint[]) { | ||
export function convertStyleProps<C extends ColorVersion>(props: ViewStyleProps<C>, handlers: StyleHandlers, direction: Direction, matchedBreakpoints: Breakpoint[]): CSSProperties { | ||
let style: CSSProperties = {}; | ||
@@ -262,3 +262,3 @@ for (let key in props) { | ||
options: StylePropsOptions = {} | ||
) { | ||
): {styleProps: HTMLAttributes<HTMLElement>} { | ||
let { | ||
@@ -278,3 +278,3 @@ UNSAFE_className, | ||
// @ts-ignore | ||
if (otherProps.className) { | ||
if (otherProps.className && process.env.NODE_ENV !== 'production') { | ||
console.warn( | ||
@@ -288,3 +288,3 @@ 'The className prop is unsafe and is unsupported in React Spectrum v3. ' + | ||
// @ts-ignore | ||
if (otherProps.style) { | ||
if (otherProps.style && process.env.NODE_ENV !== 'production') { | ||
console.warn( | ||
@@ -311,3 +311,3 @@ 'The style prop is unsafe and is unsupported in React Spectrum v3. ' + | ||
export function passthroughStyle(value) { | ||
export function passthroughStyle<T>(value: T): T { | ||
return value; | ||
@@ -314,0 +314,0 @@ } |
@@ -17,3 +17,3 @@ /* | ||
export function useHasChild(query: string, ref: RefObject<HTMLElement | null>) { | ||
export function useHasChild(query: string, ref: RefObject<HTMLElement | null>): boolean { | ||
let [hasChild, setHasChild] = useState(true); | ||
@@ -20,0 +20,0 @@ useLayoutEffect(() => { |
@@ -16,3 +16,3 @@ /* | ||
export function useMediaQuery(query: string) { | ||
export function useMediaQuery(query: string): boolean { | ||
let supportsMatchMedia = typeof window !== 'undefined' && typeof window.matchMedia === 'function'; | ||
@@ -19,0 +19,0 @@ let [matches, setMatches] = useState(() => |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Environment variable access
Supply chain riskPackage accesses environment variables, which may be a sign of credential stuffing or data theft.
Found 1 instance in 1 package
Unidentified License
License(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.
Found 2 instances in 1 package
Unidentified License
License(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.
Found 2 instances in 1 package
229755
1.37%3187
0.66%9
Infinity%+ Added
+ Added
+ Added
+ Added
+ Added
+ Added
+ Added
+ Added
+ Added
+ Added
- Removed
- Removed
- Removed
- Removed
- Removed
- Removed
- Removed
- Removed
- Removed