@griffel/react - npm Package Compare versions

Comparing version 1.6.2 to 1.7.0

lib/RendererContext.cjs

@@ -20,15 +20,11 @@ 'use client';
 });
+const _jsxruntime = require("react/jsx-runtime");
 const _core = require("@griffel/core");
-const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _react = require("react");
 const _canUseDOM = require("./utils/canUseDOM.cjs");
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
 /**
  * @private
- */ const RendererContext = /*#__PURE__*/ _react.default.createContext(/*#__PURE__*/ (0, _core.createDOMRenderer)());
+ */ const RendererContext = /*#__PURE__*/ (0, _react.createContext)(/*#__PURE__*/ (0, _core.createDOMRenderer)());
 const RendererProvider = ({ children, renderer, targetDocument })=>{
-    _react.default.useMemo(()=>{
+    (0, _react.useMemo)(()=>{
         if ((0, _canUseDOM.canUseDOM)()) {
@@ -43,8 +39,9 @@ // "rehydrateCache()" can't be called in effects as it needs to be called before any component will be rendered to
     ]);
-    return _react.default.createElement(RendererContext.Provider, {
-        value: renderer
-    }, children);
+    return (0, _jsxruntime.jsx)(RendererContext.Provider, {
+        value: renderer,
+        children: children
+    });
 };
 function useRenderer() {
-    return _react.default.useContext(RendererContext);
+    return (0, _react.useContext)(RendererContext);
 } //# sourceMappingURL=RendererContext.js.map

lib/TextDirectionContext.cjs

@@ -20,18 +20,15 @@ 'use client';
 });
-const _react = /*#__PURE__*/ _interop_require_default(require("react"));
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
+const _jsxruntime = require("react/jsx-runtime");
+const _react = require("react");
 /**
  * @private
- */ const TextDirectionContext = /*#__PURE__*/ _react.default.createContext('ltr');
+ */ const TextDirectionContext = /*#__PURE__*/ (0, _react.createContext)('ltr');
 const TextDirectionProvider = ({ children, dir })=>{
-    return _react.default.createElement(TextDirectionContext.Provider, {
-        value: dir
-    }, children);
+    return (0, _jsxruntime.jsx)(TextDirectionContext.Provider, {
+        value: dir,
+        children: children
+    });
 };
 function useTextDirection() {
-    return _react.default.useContext(TextDirectionContext);
+    return (0, _react.useContext)(TextDirectionContext);
 } //# sourceMappingURL=TextDirectionContext.js.map

lib/utils/canUseDOM.cjs

 /**
  * Verifies if an application can use DOM.
+ *
+ * @internal
  */ "use strict";
@@ -4,0 +6,0 @@ Object.defineProperty(exports, "__esModule", {

package.json

 {
   "name": "@griffel/react",
-  "version": "1.6.2",
+  "version": "1.7.0",
   "description": "React implementation of Atomic CSS-in-JS",
@@ -34,4 +34,4 @@ "license": "MIT",
   "peerDependencies": {
-    "react": ">=16.8.0 <20.0.0"
+    "react": ">=16.14.0 <20.0.0"
   }
 }

src/__css.d.ts

@@ -1,7 +0,1 @@
-import type { CSSClassesMapBySlot } from '@griffel/core';
-/**
- * A version of makeStyles() that accepts build output as an input and skips all runtime transforms & DOM insertion.
- *
- * @internal
- */
-export declare function __css<Slots extends string>(classesMapBySlot: CSSClassesMapBySlot<Slots>): () => Record<Slots, string>;
+export {};

src/__resetCSS.d.ts

@@ -1,6 +0,1 @@
-/**
- * A version of makeResetStyles() that accepts build output as an input and skips all runtime transforms & DOM insertion.
- *
- * @internal
- */
-export declare function __resetCSS(ltrClassName: string, rtlClassName: string | null): () => string;
+export {};

src/__resetStyles.d.ts

@@ -1,7 +0,1 @@
-import type { CSSRulesByBucket } from '@griffel/core';
-/**
- * A version of makeResetStyles() that accepts build output as an input and skips all runtime transforms.
- *
- * @internal
- */
-export declare function __resetStyles(ltrClassName: string, rtlClassName: string | null, cssRules: CSSRulesByBucket | string[]): () => string;
+export {};

src/__staticCSS.d.ts

@@ -1,6 +0,1 @@
-/**
- * A version of makeStaticStyles() that accepts build output as an input and skips all runtime transforms & DOM insertion.
- *
- * @internal
- */
-export declare function __staticCSS(): () => void;
+export {};

src/__staticStyles.d.ts

@@ -1,7 +0,1 @@
-import type { CSSRulesByBucket } from '@griffel/core';
-/**
- * A version of makeStaticStyles() that accepts build output as an input and skips all runtime transforms.
- *
- * @internal
- */
-export declare function __staticStyles(cssRules: CSSRulesByBucket): () => void;
+export {};

src/__styles.d.ts

@@ -1,7 +0,1 @@
-import type { CSSClassesMapBySlot, CSSRulesByBucket } from '@griffel/core';
-/**
- * A version of makeStyles() that accepts build output as an input and skips all runtime transforms.
- *
- * @internal
- */
-export declare function __styles<Slots extends string>(classesMapBySlot: CSSClassesMapBySlot<Slots>, cssRules: CSSRulesByBucket): () => Record<Slots, string>;
+export {};

src/RendererContext.d.ts

 import type { GriffelRenderer } from '@griffel/core';
-import React from 'react';
+import { type FC, type ReactNode } from 'react';
 export interface RendererProviderProps {
@@ -13,3 +13,3 @@ /** An instance of Griffel renderer. */
      */
-    children: React.ReactNode;
+    children: ReactNode;
 }
@@ -19,3 +19,3 @@ /**
  */
-export declare const RendererProvider: React.FC<RendererProviderProps>;
+export declare const RendererProvider: FC<RendererProviderProps>;
 /**
@@ -22,0 +22,0 @@ * Returns an instance of current makeStyles() renderer.

src/RendererContext.js

 'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { createDOMRenderer, rehydrateRendererCache } from '@griffel/core';
-import React from 'react';
+import { createContext, useContext, useMemo } from 'react';
 import { canUseDOM } from './utils/canUseDOM.js';
@@ -8,3 +9,3 @@ /**
  */
-const RendererContext = /*#__PURE__*/ React.createContext(/*#__PURE__*/ createDOMRenderer());
+const RendererContext = /*#__PURE__*/ createContext(/*#__PURE__*/ createDOMRenderer());
 /**
@@ -14,3 +15,3 @@ * @public
 export const RendererProvider = ({ children, renderer, targetDocument }) => {
-    React.useMemo(() => {
+    useMemo(() => {
         if (canUseDOM()) {
@@ -22,3 +23,3 @@ // "rehydrateCache()" can't be called in effects as it needs to be called before any component will be rendered to
     }, [renderer, targetDocument]);
-    return React.createElement(RendererContext.Provider, { value: renderer }, children);
+    return _jsx(RendererContext.Provider, { value: renderer, children: children });
 };
@@ -31,4 +32,4 @@ /**
 export function useRenderer() {
-    return React.useContext(RendererContext);
+    return useContext(RendererContext);
 }
 //# sourceMappingURL=RendererContext.js.map

src/RendererContext.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"RendererContext.js","sourceRoot":"","sources":["../../../../packages/react/src/RendererContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAE1E,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAiBjD;;GAEG;AACH,MAAM,eAAe,GAAG,aAAa,CAAC,KAAK,CAAC,aAAa,CAAkB,aAAa,CAAC,iBAAiB,EAAE,CAAC,CAAC;AAE9G;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,EAAE;IAC1G,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACjB,IAAI,SAAS,EAAE,EAAE,CAAC;YAChB,kHAAkH;YAClH,oCAAoC;YACpC,sBAAsB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC;QACnD,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC;IAE/B,OAAO,oBAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,QAAQ,IAAG,QAAQ,CAA4B,CAAC;AAC1F,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,UAAU,WAAW;IACzB,OAAO,KAAK,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC;AAC3C,CAAC"}
+{"version":3,"file":"RendererContext.js","sourceRoot":"","sources":["../../../../packages/react/src/RendererContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAE1E,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAA2B,MAAM,OAAO,CAAC;AAEpF,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAiBjD;;GAEG;AACH,MAAM,eAAe,GAAG,aAAa,CAAC,aAAa,CAAkB,aAAa,CAAC,iBAAiB,EAAE,CAAC,CAAC;AAExG;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAA8B,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,cAAc,EAAE,EAAE,EAAE;IACpG,OAAO,CAAC,GAAG,EAAE;QACX,IAAI,SAAS,EAAE,EAAE,CAAC;YAChB,kHAAkH;YAClH,oCAAoC;YACpC,sBAAsB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC;QACnD,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC;IAE/B,OAAO,KAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,QAAQ,YAAG,QAAQ,GAA4B,CAAC;AAC1F,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,UAAU,WAAW;IACzB,OAAO,UAAU,CAAC,eAAe,CAAC,CAAC;AACrC,CAAC"}

src/TextDirectionContext.d.ts

@@ -1,2 +0,2 @@
-import React from 'react';
+import { type FC, type ReactNode } from 'react';
 export interface TextDirectionProviderProps {
@@ -8,3 +8,3 @@ /** Indicates the directionality of the element's text. */
      */
-    children: React.ReactNode;
+    children: ReactNode;
 }
@@ -14,3 +14,3 @@ /**
  */
-export declare const TextDirectionProvider: React.FC<TextDirectionProviderProps>;
+export declare const TextDirectionProvider: FC<TextDirectionProviderProps>;
 /**
@@ -17,0 +17,0 @@ * Returns current directionality of the element's text.

src/TextDirectionContext.js

 'use client';
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from 'react';
 /**
  * @private
  */
-const TextDirectionContext = /*#__PURE__*/ React.createContext('ltr');
+const TextDirectionContext = /*#__PURE__*/ createContext('ltr');
 /**
@@ -11,3 +12,3 @@ * @public
 export const TextDirectionProvider = ({ children, dir }) => {
-    return React.createElement(TextDirectionContext.Provider, { value: dir }, children);
+    return _jsx(TextDirectionContext.Provider, { value: dir, children: children });
 };
@@ -20,4 +21,4 @@ /**
 export function useTextDirection() {
-    return React.useContext(TextDirectionContext);
+    return useContext(TextDirectionContext);
 }
 //# sourceMappingURL=TextDirectionContext.js.map

src/TextDirectionContext.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"TextDirectionContext.js","sourceRoot":"","sources":["../../../../packages/react/src/TextDirectionContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B;;GAEG;AACH,MAAM,oBAAoB,GAAG,aAAa,CAAC,KAAK,CAAC,aAAa,CAAgB,KAAK,CAAC,CAAC;AAErF;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAyC,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,EAAE,EAAE;IAC/F,OAAO,oBAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,GAAG,IAAG,QAAQ,CAAiC,CAAC;AAC/F,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,UAAU,gBAAgB;IAC9B,OAAO,KAAK,CAAC,UAAU,CAAC,oBAAoB,CAAC,CAAC;AAChD,CAAC"}
+{"version":3,"file":"TextDirectionContext.js","sourceRoot":"","sources":["../../../../packages/react/src/TextDirectionContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,aAAa,EAAE,UAAU,EAA2B,MAAM,OAAO,CAAC;AAY3E;;GAEG;AACH,MAAM,oBAAoB,GAAG,aAAa,CAAC,aAAa,CAAgB,KAAK,CAAC,CAAC;AAE/E;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAmC,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,EAAE,EAAE;IACzF,OAAO,KAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,GAAG,YAAG,QAAQ,GAAiC,CAAC;AAC/F,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,UAAU,gBAAgB;IAC9B,OAAO,UAAU,CAAC,oBAAoB,CAAC,CAAC;AAC1C,CAAC"}

src/useInsertionEffect.d.ts

@@ -1,2 +0,1 @@
-import React from 'react';
-export declare const useInsertionEffect: typeof React.useInsertionEffect | undefined;
+export {};

src/useInsertionEffect.js

 'use client';
 import React from 'react';
+/**
+ * @internal
+ */
 export const useInsertionEffect = 
@@ -4,0 +7,0 @@ // @ts-expect-error Hack to make sure that `useInsertionEffect` will not cause bundling issues in older React versions

src/useInsertionEffect.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"useInsertionEffect.js","sourceRoot":"","sources":["../../../../packages/react/src/useInsertionEffect.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,CAAC,MAAM,kBAAkB;AAC7B,sHAAsH;AACtH,6CAA6C;AAC7C,KAAK,CAAC,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC"}
+{"version":3,"file":"useInsertionEffect.js","sourceRoot":"","sources":["../../../../packages/react/src/useInsertionEffect.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;GAEG;AACH,MAAM,CAAC,MAAM,kBAAkB;AAC7B,sHAAsH;AACtH,6CAA6C;AAC7C,KAAK,CAAC,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,cAAc,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC"}

src/utils/canUseDOM.d.ts

@@ -1,4 +0,1 @@
-/**
- * Verifies if an application can use DOM.
- */
-export declare function canUseDOM(): boolean;
+export {};

src/utils/canUseDOM.js

 /**
  * Verifies if an application can use DOM.
+ *
+ * @internal
  */
@@ -4,0 +6,0 @@ export function canUseDOM() {

src/utils/canUseDOM.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"canUseDOM.js","sourceRoot":"","sources":["../../../../../packages/react/src/utils/canUseDOM.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,UAAU,SAAS;IACvB,OAAO,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,IAAI,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;AAC/F,CAAC"}
+{"version":3,"file":"canUseDOM.js","sourceRoot":"","sources":["../../../../../packages/react/src/utils/canUseDOM.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,UAAU,SAAS;IACvB,OAAO,OAAO,MAAM,KAAK,WAAW,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,IAAI,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;AAC/F,CAAC"}

src/utils/isInsideComponent.d.ts

@@ -1,1 +0,1 @@
-export declare function isInsideComponent(): boolean;
+export {};

src/utils/isInsideComponent.js

@@ -18,2 +18,5 @@ 'use client';
 }
+/**
+ * @internal
+ */
 export function isInsideComponent() {
@@ -20,0 +23,0 @@ // React 18 always logs errors if a dispatcher is not present:

src/utils/isInsideComponent.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"isInsideComponent.js","sourceRoot":"","sources":["../../../../../packages/react/src/utils/isInsideComponent.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,SAAS,aAAa;IACpB,IAAI,CAAC;QACH,OAAQ,KAAa,CAAC,EAAE,CAAC,MAAM,CAAC,iEAAiE,CAAC,CAAC,CAAC,CAAC,CAAC;IACxG,CAAC;IAAC,MAAM,CAAC;QACP,YAAY;IACd,CAAC;IAED,IAAI,CAAC;QACH,OAAQ,KAAa,CAAC,EAAE,CAAC,MAAM,CAAC,oDAAoD,CAAC,CAAC,CAAC,sBAAsB;aAC1G,OAAO,CAAC;IACb,CAAC;IAAC,MAAM,CAAC;QACP,qBAAqB;IACvB,CAAC;AACH,CAAC;AAED,MAAM,UAAU,iBAAiB;IAC/B,8DAA8D;IAC9D,2HAA2H;IAC3H,IAAI,CAAC;QACH,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;QAEnC,sEAAsE;QACtE,IAAI,UAAU,KAAK,IAAI,IAAI,UAAU,KAAK,SAAS,EAAE,CAAC;YACpD,OAAO,KAAK,CAAC;QACf,CAAC;QAED,+GAA+G;QAC/G,gCAAgC;QAChC,UAAU,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;QAC1B,OAAO,IAAI,CAAC;IACd,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,KAAK,CAAC;IACf,CAAC;AACH,CAAC"}
+{"version":3,"file":"isInsideComponent.js","sourceRoot":"","sources":["../../../../../packages/react/src/utils/isInsideComponent.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,SAAS,aAAa;IACpB,IAAI,CAAC;QACH,OAAQ,KAAa,CAAC,EAAE,CAAC,MAAM,CAAC,iEAAiE,CAAC,CAAC,CAAC,CAAC,CAAC;IACxG,CAAC;IAAC,MAAM,CAAC;QACP,YAAY;IACd,CAAC;IAED,IAAI,CAAC;QACH,OAAQ,KAAa,CAAC,EAAE,CAAC,MAAM,CAAC,oDAAoD,CAAC,CAAC,CAAC,sBAAsB;aAC1G,OAAO,CAAC;IACb,CAAC;IAAC,MAAM,CAAC;QACP,qBAAqB;IACvB,CAAC;AACH,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,iBAAiB;IAC/B,8DAA8D;IAC9D,2HAA2H;IAC3H,IAAI,CAAC;QACH,MAAM,UAAU,GAAG,aAAa,EAAE,CAAC;QAEnC,sEAAsE;QACtE,IAAI,UAAU,KAAK,IAAI,IAAI,UAAU,KAAK,SAAS,EAAE,CAAC;YACpD,OAAO,KAAK,CAAC;QACf,CAAC;QAED,+GAA+G;QAC/G,gCAAgC;QAChC,UAAU,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;QAC1B,OAAO,IAAI,CAAC;IACd,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,KAAK,CAAC;IACf,CAAC;AACH,CAAC"}

New alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Number of medium supply chain risk alerts

0

-100%

Worsened metrics

Total package byte prevSize

62925

-2.87%

Lines of code

991

-3.13%

No dependency changes