@react-hive/honey-layout 17.0.0 → 17.2.0

package/dist/index.dev.cjs

@@ -4606,7 +4606,7 @@ __webpack_require__.r(__webpack_exports__);
  */
 const useHoneyLayerRegistryContext = () => {
     const context = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_HoneyLayerRegistryContext__WEBPACK_IMPORTED_MODULE_2__.HoneyLayerRegistryContext);
-    (0,_react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__.assert)(context, 'The `useHoneyLayerRegistryContext()` hook can only be used inside <HoneyLayerRegistry/> component!');
+    (0,_react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__.assert)(context, '[@react-hive/honey-layout]: The `useHoneyLayerRegistryContext()` hook can only be used inside <HoneyLayerRegistry/> component.');
     return context;
 };
 
@@ -5108,7 +5108,7 @@ __webpack_require__.r(__webpack_exports__);
 
 const useHoneyPopupContext = () => {
     const context = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_components__WEBPACK_IMPORTED_MODULE_2__.HoneyPopupContext);
-    (0,_react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__.assert)(context, 'The `useHoneyPopupContext()` hook can only be used inside <HoneyPopup/> component!');
+    (0,_react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__.assert)(context, '[@react-hive/honey-layout]: The `useHoneyPopupContext()` hook can only be used inside <HoneyPopup/> component.');
     return context;
 };
 
@@ -5460,10 +5460,12 @@ __webpack_require__.r(__webpack_exports__);
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   HONEY_LAYOUT_CSS_PROPERTY_PREFIX: () => (/* binding */ HONEY_LAYOUT_CSS_PROPERTY_PREFIX),
 /* harmony export */   __DEV__: () => (/* binding */ __DEV__)
 /* harmony export */ });
 const ENV = "development" || 0;
 const __DEV__ = ENV !== 'production';
+const HONEY_LAYOUT_CSS_PROPERTY_PREFIX = '$';
 if (__DEV__ && typeof window !== 'undefined' && !process.env.VITEST_WORKER_ID) {
     console.info('[@react-hive/honey-layout]: You are running in development mode. ' +
         'This build is not optimized for production and may include extra checks or logs.');
@@ -5567,37 +5569,21 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @react-hive/honey-style */ "@react-hive/honey-style");
 /* harmony import */ var _react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__);
 /* harmony import */ var _react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @react-hive/honey-utils */ "./node_modules/.pnpm/@react-hive+honey-utils@4.0.0/node_modules/@react-hive/honey-utils/dist/index.mjs");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../constants */ "./src/constants.ts");
+
 
 
 /**
- * Type guard function that checks whether a given CSS property name
- * is classified as a spacing-related property.
- *
- * Spacing properties include margin, padding, positional offsets,
- * and layout gaps (e.g., `gap`, `top`, `marginLeft`, etc.).
- *
- * @param propertyName - The name of the CSS property to check.
- *
- * @returns `true` if the property is a spacing property, otherwise `false`.
- */
-const isSpacingCssProperty = (propertyName) => _react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.CSS_SPACING_PROPERTIES.includes(propertyName);
-/**
- * Type guard function to check if a property name is a color property.
- *
- * @param propertyName - The name of the CSS property.
+ * Determines whether a property name uses the configured CSS property prefix.
  *
- * @returns True if the property name is a color property, false otherwise.
- */
-const isColorCssProperty = (propertyName) => _react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.CSS_COLOR_PROPERTIES.includes(propertyName);
-/**
- * Determines if a given HTML property is a CSS property that is prefixed with a '$'.
- * This convention is typically used for applying dynamic or responsive styles.
+ * This helper is prefix-agnostic by design. The actual prefix is defined by
+ * `HONEY_LAYOUT_CSS_PROPERTY_PREFIX`, which currently uses `$` for honey-layout CSS props.
  *
- * @param propertyName - The HTML property or key to check.
+ * @param propertyName - The property name to check.
  *
- * @returns Returns true if the property is a valid prefixed CSS property, otherwise false.
+ * @returns Returns true if the property name starts with the configured CSS property prefix.
  */
-const is$PrefixedCssProperty = (propertyName) => propertyName[0] === '$';
+const isPrefixedCssProperty = (propertyName) => propertyName[0] === _constants__WEBPACK_IMPORTED_MODULE_2__.HONEY_LAYOUT_CSS_PROPERTY_PREFIX;
 /**
  * Retrieves the CSS property value for a specific breakpoint, potentially resolving it to include units.
  *
@@ -5626,12 +5612,12 @@ const getCssPropertyValue = (propertyName, propertyValue, breakpoint) => {
     if (resolvedValue === undefined) {
         return undefined;
     }
-    if (isSpacingCssProperty(propertyName)) {
+    if ((0,_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.isCssSpacingProperty)(propertyName)) {
         if (typeof resolvedValue === 'number' || Array.isArray(resolvedValue)) {
             return (0,_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.resolveSpacing)(resolvedValue, 'px');
         }
     }
-    else if (isColorCssProperty(propertyName)) {
+    else if ((0,_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.isCssColorProperty)(propertyName)) {
         if (typeof resolvedValue === 'string' && (0,_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.isThemeColorValue)(resolvedValue)) {
             return (0,_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.resolveColor)(resolvedValue);
         }
@@ -5649,7 +5635,7 @@ const getCssPropertyValue = (propertyName, propertyValue, breakpoint) => {
  * @returns An array of tuples where each tuple contains a Honey-prefixed CSS property and its value.
  */
 const matchCssProperties = (props, breakpoint) => Object.entries(props).filter(([propertyName, propertyValue]) => {
-    const isMatchingXsBreakpoint = breakpoint === 'xs' && is$PrefixedCssProperty(propertyName);
+    const isMatchingXsBreakpoint = breakpoint === 'xs' && isPrefixedCssProperty(propertyName);
     return (isMatchingXsBreakpoint ||
         (propertyValue && typeof propertyValue === 'object' && breakpoint in propertyValue));
 });
@@ -5667,7 +5653,7 @@ const matchCssProperties = (props, breakpoint) => Object.entries(props).filter((
  */
 const createStyles = (breakpoint) => ({ theme, ...props }) => (0,_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.css) `
     ${matchCssProperties(props, breakpoint).map(([prefixedPropertyName, propertyValue]) => {
-    const propertyName = prefixedPropertyName.slice(1);
+    const propertyName = prefixedPropertyName.slice(_constants__WEBPACK_IMPORTED_MODULE_2__.HONEY_LAYOUT_CSS_PROPERTY_PREFIX.length);
     return (0,_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.css) `
         ${(0,_react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__.camelToDashCase)(propertyName)}: ${getCssPropertyValue(propertyName, propertyValue, breakpoint)};
       `;
@@ -5683,7 +5669,7 @@ const createStyles = (breakpoint) => ({ theme, ...props }) => (0,_react_hive_hon
  *
  * @returns Returns true if at least one property in `props` has styles for the specified breakpoint; otherwise, false.
  */
-const hasBreakpointStyles = (breakpoint, props) => Object.entries(props).some(([propertyName, propertyValue]) => is$PrefixedCssProperty(propertyName) &&
+const hasBreakpointStyles = (breakpoint, props) => Object.entries(props).some(([propertyName, propertyValue]) => isPrefixedCssProperty(propertyName) &&
     typeof propertyValue === 'object' &&
     breakpoint in propertyValue);
 /**
@@ -5700,7 +5686,9 @@ const hasBreakpointStyles = (breakpoint, props) => Object.entries(props).some(([
  */
 const applyBreakpointStyles = (breakpoint) => ({ theme, ...props }) => {
     const breakpointConfig = theme.breakpoints[breakpoint];
-    if (!breakpointConfig || !hasBreakpointStyles(breakpoint, props)) {
+    (0,_react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__.assert)(breakpointConfig, `[@react-hive/honey-layout]: Missing breakpoint configuration for "${breakpoint}". ` +
+        `Expected theme.breakpoints.${breakpoint} to be defined.`);
+    if (!hasBreakpointStyles(breakpoint, props)) {
         return null;
     }
     return (0,_react_hive_honey_style__WEBPACK_IMPORTED_MODULE_0__.css) `
@@ -5874,7 +5862,7 @@ __webpack_require__.r(__webpack_exports__);
  */
 const useHoneyLayout = () => {
     const context = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_contexts__WEBPACK_IMPORTED_MODULE_2__.HoneyLayoutContext);
-    (0,_react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__.assert)(context, 'The `useHoneyLayout()` hook must be used inside <HoneyLayoutProvider/> component!');
+    (0,_react_hive_honey_utils__WEBPACK_IMPORTED_MODULE_1__.assert)(context, '[@react-hive/honey-layout]: The `useHoneyLayout()` hook must be used inside <HoneyLayoutProvider/> component.');
     return context;
 };
 
@@ -14692,6 +14680,7 @@ var __webpack_exports__ = {};
   \**********************/
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   HONEY_LAYOUT_CSS_PROPERTY_PREFIX: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_1__.HONEY_LAYOUT_CSS_PROPERTY_PREFIX),
 /* harmony export */   HoneyBox: () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.HoneyBox),
 /* harmony export */   HoneyContextMenu: () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.HoneyContextMenu),
 /* harmony export */   HoneyFlex: () => (/* reexport safe */ _components__WEBPACK_IMPORTED_MODULE_3__.HoneyFlex),