@cloudflare/style-container 8.0.5 → 8.0.7

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Change Log
 
+## 8.0.7
+
+### Patch Changes
+
+- 92aa24bd89: Accept React 18 and 19 in the peer ranges of smoke-tested components and styling packages. Keep React keys out of Grid and FormGrid styling props, and emit declarations compatible with React 19 types.
+
+## 8.0.6
+
+### Patch Changes
+
+- fc455fa761: Require explicit opt-in before injecting source-file debug attributes into package build artifacts.
+
 ## 8.0.5
 
 ### Patch Changes

package/dist/isValidElementProp.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
 /// <reference types="lodash" />
+import type { ElementTag } from './types';
 export declare const ariaAttributes: string[];
-export declare const isValidElementProp: ((tag: keyof JSX.IntrinsicElements, attr: string) => boolean) & import("lodash").MemoizedFunction;
-export declare const filterValidElementProps: <T extends object>(tag: keyof JSX.IntrinsicElements, props: T) => Partial<T>;
+export declare const isValidElementProp: ((tag: ElementTag, attr: string) => boolean) & import("lodash").MemoizedFunction;
+export declare const filterValidElementProps: <T extends object>(tag: ElementTag, props: T) => Partial<T>;
 export default isValidElementProp;

package/dist/types.d.ts

@@ -1,10 +1,10 @@
-import { ComponentType, CSSProperties, DetailedHTMLProps, Ref, HTMLAttributes, ComponentClass, ForwardRefExoticComponent, PropsWithoutRef } from 'react';
+import { ComponentType, ElementType as ReactElementType, ComponentProps, CSSProperties, DetailedHTMLProps, Ref, HTMLAttributes, ComponentClass, ForwardRefExoticComponent, PropsWithoutRef } from 'react';
 import { TMultiRuleObject, TMultiRule } from 'fela-tools';
 import { variables } from '@cloudflare/style-const';
 import type { IRenderer, IStyle } from 'fela';
 import { FelaWithThemeProps } from 'react-fela';
 export { ThemeProvider } from 'react-fela';
-export declare type ElementTag = keyof JSX.IntrinsicElements;
+export declare type ElementTag = Extract<ReactElementType, string>;
 export declare type BaseType = ElementTag | ComponentType<any>;
 export declare type KeyList<T> = Extract<keyof T, string>[];
 export declare type PassthroughProps<P> = KeyList<P> | ((props: P) => KeyList<P>);
@@ -69,20 +69,17 @@ export declare type RefType<Base extends BaseType> = Base extends ElementTag ? E
     ref?: Ref<infer ForwardedRef>;
 }> ? ForwardedRef : never;
 /**
- * Type helper for inferring props. Cannot use ComponentProps from
- * React here because we lose {children?: ReactNode} when it infers
- * props using JSXElementConstructor. Additionally, we want to make
- * sure we don't include 'ref' as a prop which can be found on
- * components created with forwardRef and props for elements on
- * JSX.IntrinsicElements
+ * Infer custom component props directly because ComponentProps can lose
+ * {children?: ReactNode} via JSXElementConstructor. Intrinsic tags use
+ * React's own ComponentProps mapping. Omit 'ref' from either case.
  */
-export declare type InferProps<Base extends BaseType> = PropsWithoutRef<Base extends ElementTag ? JSX.IntrinsicElements[Base] : Base extends ComponentType<infer Props> ? Props : never>;
+export declare type InferProps<Base extends BaseType> = PropsWithoutRef<Base extends ElementTag ? ComponentProps<Base> : Base extends ComponentType<infer Props> ? Props : never>;
 export declare type TStandardTheme = typeof variables;
 /**
  * Type helper for inferring an HTMLElement type based on the element
  * tag type passed in.
  */
-export declare type ElementType<Element extends ElementTag> = JSX.IntrinsicElements[Element] extends DetailedHTMLProps<HTMLAttributes<infer E>, any> ? E : never;
+export declare type ElementType<Element extends ElementTag> = ComponentProps<Element> extends DetailedHTMLProps<HTMLAttributes<infer E>, any> ? E : never;
 export declare type TStaticRule = (attr: {
     theme: TStandardTheme;
 }) => string;

package/es/applyStaticStyles.js

@@ -1,7 +1,5 @@
 var _excluded = ["theme"];
 
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -25,9 +23,7 @@ function applyStaticStyles(staticStyles, ComponentToWrap) {
     var contextTheme = theme || {};
     var result = typeof staticStyles === 'function' ? staticStyles(contextTheme) : staticStyles;
     renderer === null || renderer === void 0 ? void 0 : (_renderer$renderStati = renderer.renderStatic) === null || _renderer$renderStati === void 0 ? void 0 : _renderer$renderStati.call(renderer, result);
-    return /*#__PURE__*/React.createElement(ComponentToWrap, _extends({}, passThroughProps, {
-      "data-source-file": "@cloudflare/style-container:src/applyStaticStyles.tsx:26"
-    }));
+    return /*#__PURE__*/React.createElement(ComponentToWrap, passThroughProps);
   };
 
   var WithThemeHOC = withTheme(CompWithStaticStyles);

package/es/applyTheme.js

@@ -1,5 +1,3 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 /* eslint-disable behance/no-deprecated */
@@ -21,11 +19,8 @@ function applyTheme(ComponentToWrap) {
   class ThemedComponent extends Component {
     render() {
       return /*#__PURE__*/React.createElement(ThemeProvider, {
-        theme: mergeThemes(this.props.theme || {}, ...themes),
-        "data-source-file": "@cloudflare/style-container:src/applyTheme.tsx:31"
-      }, /*#__PURE__*/React.createElement(ComponentToWrap, _extends({}, this.props, {
-        "data-source-file": "@cloudflare/style-container:src/applyTheme.tsx:32"
-      })));
+        theme: mergeThemes(this.props.theme || {}, ...themes)
+      }, /*#__PURE__*/React.createElement(ComponentToWrap, this.props));
     }
 
   }

package/es/withRenderer.js

@@ -10,9 +10,7 @@ function withRenderer(ComponentToWrap) {
     var renderer = useContext(RendererContext);
     return /*#__PURE__*/React.createElement(ComponentToWrap, _extends({
       renderer: renderer
-    }, props, {
-      "data-source-file": "@cloudflare/style-container:src/withRenderer.tsx:17"
-    }));
+    }, props));
   };
 
   WithRendererComponent.displayName = getReactDisplayName(ComponentToWrap);

package/lib/applyStaticStyles.js

@@ -21,8 +21,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -38,9 +36,7 @@ function applyStaticStyles(staticStyles, ComponentToWrap) {
     var contextTheme = theme || {};
     var result = typeof staticStyles === 'function' ? staticStyles(contextTheme) : staticStyles;
     renderer === null || renderer === void 0 ? void 0 : (_renderer$renderStati = renderer.renderStatic) === null || _renderer$renderStati === void 0 ? void 0 : _renderer$renderStati.call(renderer, result);
-    return /*#__PURE__*/_react.default.createElement(ComponentToWrap, _extends({}, passThroughProps, {
-      "data-source-file": "@cloudflare/style-container:src/applyStaticStyles.tsx:26"
-    }));
+    return /*#__PURE__*/_react.default.createElement(ComponentToWrap, passThroughProps);
   };
 
   var WithThemeHOC = (0, _reactFela.withTheme)(CompWithStaticStyles);

package/lib/applyTheme.js

@@ -27,8 +27,6 @@ function _construct(Parent, args, Class) { if (_isNativeReflectConstruct()) { _c
 
 function _isNativeFunction(fn) { return Function.toString.call(fn).indexOf("[native code]") !== -1; }
 
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -75,11 +73,8 @@ function applyTheme(ComponentToWrap) {
       key: "render",
       value: function render() {
         return /*#__PURE__*/_react.default.createElement(_reactFela.ThemeProvider, {
-          theme: _mergeThemes.default.apply(void 0, [this.props.theme || {}].concat(themes)),
-          "data-source-file": "@cloudflare/style-container:src/applyTheme.tsx:31"
-        }, /*#__PURE__*/_react.default.createElement(ComponentToWrap, _extends({}, this.props, {
-          "data-source-file": "@cloudflare/style-container:src/applyTheme.tsx:32"
-        })));
+          theme: _mergeThemes.default.apply(void 0, [this.props.theme || {}].concat(themes))
+        }, /*#__PURE__*/_react.default.createElement(ComponentToWrap, this.props));
       }
     }]);
 

package/lib/withRenderer.js

@@ -26,9 +26,7 @@ function withRenderer(ComponentToWrap) {
     var renderer = (0, _react.useContext)(_reactFela.RendererContext);
     return /*#__PURE__*/_react.default.createElement(ComponentToWrap, _extends({
       renderer: renderer
-    }, props, {
-      "data-source-file": "@cloudflare/style-container:src/withRenderer.tsx:17"
-    }));
+    }, props));
   };
 
   WithRendererComponent.displayName = (0, _reactDisplayName.default)(ComponentToWrap);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudflare/style-container",
   "description": "Cloudflare Style Container",
-  "version": "8.0.5",
+  "version": "8.0.7",
   "main": "lib/index.js",
   "module": "es/index.js",
   "author": "Vojtech Miksu <vojtech@cloudflare.com>",
@@ -23,7 +23,7 @@
   },
   "peerDependencies": {
     "@cloudflare/style-const": "^6.0.0",
-    "react": "^15.0.0-0 || ^16.0.0-0 || ^17.0.0-0"
+    "react": "^15.0.0-0 || ^16.0.0-0 || ^17.0.0-0 || ^18.0.0-0 || ^19.0.0-0"
   },
   "stratus": {
     "srcDirectory": "./src",