@react-hive/honey-layout 6.5.2 → 8.0.0

package/dist/providers/HoneyLayoutProvider.d.ts

@@ -1,8 +1,8 @@
 import { PropsWithChildren } from 'react';
-import { HoneyStyleContextValue } from '@react-hive/honey-style';
+import { HoneyStyleProviderProps } from '@react-hive/honey-style';
 import { UseHoneyMediaQueryOptions } from '../hooks';
-interface HoneyLayoutProviderProps extends HoneyStyleContextValue {
+interface HoneyLayoutProviderProps extends HoneyStyleProviderProps {
     mediaQueryOptions?: UseHoneyMediaQueryOptions;
 }
-export declare const HoneyLayoutProvider: ({ children, theme, mediaQueryOptions, }: PropsWithChildren<HoneyLayoutProviderProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const HoneyLayoutProvider: ({ children, theme, mediaQueryOptions, ...props }: PropsWithChildren<HoneyLayoutProviderProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/types/css.types.d.ts

@@ -1,37 +1,8 @@
-import { HoneyCSSDimensionUnit, HoneyBreakpointName, HoneyCSSDimensionValue, HoneyStyledContext, HoneyColor } from '@react-hive/honey-style';
+import { HoneyBreakpointName, HoneyStyledContext, HoneyColor, HoneyCSSSpacingValue, HoneyCSSColorProperty, HoneyCSSSpacingProperty, HoneyCSSShorthandSpacingProperty, HoneyRawCSSSpacingValue } from '@react-hive/honey-style';
 /**
  * The types for handling CSS properties and values, focusing on dimensions, colors, media queries, and other essential CSS concepts.
  */
 import * as CSS from 'csstype';
-/**
- * Represents a tuple of 2 to 4 values using standard CSS shorthand conventions.
- *
- * This type models how properties like `margin`, `padding`, `gap`, and `borderRadius`
- * can accept multiple values to control different sides or axes.
- *
- * Value interpretation follows CSS shorthand behavior:
- * - `[T, T]` → [top & bottom, left & right]
- * - `[T, T, T]` → [top, left & right, bottom]
- * - `[T, T, T, T]` → [top, right, bottom, left]
- *
- * @template T - The type of each spacing value (e.g., number, string, or token).
- */
-export type HoneyCSSShorthandTuple<T> = [T, T] | [T, T, T] | [T, T, T, T];
-/**
- * Represents a CSS layout value that can be a single value or a shorthand array of values.
- *
- * Useful for properties like `margin`, `padding`, or `borderRadius`, which allow:
- * - A single value (applied to all sides)
- * - A tuple of 2–4 values using standard CSS shorthand behavior
- *
- * Examples:
- * - `'8px'`
- * - `['8px', '12px']`
- * - `['8px', '12px', '16px', '20px']`
- *
- * @template T - The type of each individual value.
- */
-export type HoneyCSSMultiValue<T> = T | HoneyCSSShorthandTuple<T>;
 /**
  * @see https://developer.mozilla.org/en-US/docs/Web/CSS/easing-function/steps#step-position
  */
@@ -40,56 +11,12 @@ type HoneyCSSStepFunctionPosition = 'jump-start' | 'jump-end' | 'jump-none' | 'j
  * Defining the allowed timing functions for the transition
  */
 export type HoneyCSSTimingFunction = 'ease' | 'linear' | `linear(${string})` | `cubic-bezier(${number}, ${number}, ${number}, ${number})` | 'ease-in' | 'ease-out' | 'ease-in-out' | 'step-start' | 'step-end' | `steps(${number})` | `steps(${number}, ${HoneyCSSStepFunctionPosition})`;
-/**
- * Represents CSS properties related to spacing and positioning.
- */
-export type HoneyCSSSpacingProperty = keyof Pick<CSS.Properties, 'margin' | 'marginTop' | 'marginRight' | 'marginBottom' | 'marginLeft' | 'padding' | 'paddingTop' | 'paddingRight' | 'paddingBottom' | 'paddingLeft' | 'top' | 'right' | 'bottom' | 'left' | 'gap' | 'rowGap' | 'columnGap'>;
-/**
- * Represents shorthand spacing properties that support multi-value arrays.
- *
- * These properties accept 2–4 space-separated values
- * to control spacing on multiple sides (e.g., top, right, bottom, left).
- */
-export type HoneyCSSShorthandSpacingProperty = keyof Pick<CSS.Properties, 'margin' | 'padding' | 'gap'>;
-/**
- * Represents a subset of CSS properties that define color-related styles.
- */
-export type HoneyCSSColorProperty = keyof Pick<CSS.Properties, 'color' | 'backgroundColor' | 'borderColor' | 'borderTopColor' | 'borderRightColor' | 'borderBottomColor' | 'borderLeftColor' | 'outlineColor' | 'textDecorationColor' | 'fill' | 'stroke'>;
-/**
- * Represents a spacing value used in layout-related CSS properties.
- *
- * Can be:
- * - A single numeric value (e.g., `8`)
- * - A single dimension string (e.g., `'1rem'`)
- * - A shorthand array of 2–4 values (e.g., `[8, 12]` or `['1rem', '2rem', '1.5rem']`)
- *
- * Commonly used for properties like `margin`, `padding`, `gap`, etc.
- */
-export type HoneyCSSSpacingValue = HoneyCSSMultiValue<number | HoneyCSSDimensionValue>;
-/**
- * Converts a tuple of spacing values into a valid CSS shorthand string using a consistent unit.
- *
- * Acts as a type-level converter that transforms 2–4 spacing values (e.g., `[8, 12]`) into a space-separated
- * CSS string (e.g., `'8px 12px'`), suitable for shorthand-compatible properties like `margin`, `padding`, or `gap`.
- *
- * This type enforces unit consistency across all values and is useful for generating precise, typed spacing strings.
- *
- * Example outputs:
- * - `'8px 12px'` for `[8, 12]`
- * - `'1rem 2rem 1.5rem'` for `[1, 2, 1.5]`
- * - `'4px 8px 12px 16px'` for `[4, 8, 12, 16]`
- *
- * @template Tuple - A tuple of 2 to 4 values to be converted into a CSS shorthand string.
- * @template Unit - The CSS unit to apply to each value (e.g., `'px'`, `'rem'`, `'%'`).
- */
-export type HoneyCSSShorthandDimensionOutput<Tuple extends HoneyCSSShorthandTuple<unknown>, Unit extends HoneyCSSDimensionUnit> = Tuple extends [unknown, unknown] ? `${HoneyCSSDimensionValue<Unit>} ${HoneyCSSDimensionValue<Unit>}` : Tuple extends [unknown, unknown, unknown] ? `${HoneyCSSDimensionValue<Unit>} ${HoneyCSSDimensionValue<Unit>} ${HoneyCSSDimensionValue<Unit>}` : Tuple extends [unknown, unknown, unknown, unknown] ? `${HoneyCSSDimensionValue<Unit>} ${HoneyCSSDimensionValue<Unit>} ${HoneyCSSDimensionValue<Unit>} ${HoneyCSSDimensionValue<Unit>}` : never;
 /**
  * A type representing a function that returns a value for a specific CSS property based on the provided theme.
  *
  * @template CSSProperty - The CSS property this function will generate a value for.
  */
 type HoneyCSSPropertyValueFn<CSSProperty extends keyof CSS.Properties> = (context: HoneyStyledContext<object>) => CSS.Properties[CSSProperty];
-type HoneyRawCSSSpacingValue = number | HoneyCSSDimensionValue | CSS.Globals;
 /**
  * Represents a non-responsive (raw) CSS property value for a specific CSS property.
  *

package/dist/utils/utils.d.ts

@@ -1,4 +1,3 @@
-import { HoneyHEXColor } from '@react-hive/honey-style';
 export declare const camelToDashCase: (inputString: string) => string;
 /**
  * Splits a string into an array of filtered from redundant spaces words.
@@ -8,15 +7,6 @@ export declare const camelToDashCase: (inputString: string) => string;
  * @returns An array of words from the input string.
  */
 export declare const splitStringIntoWords: (inputString: string) => string[];
-/**
- * Converts a pixel value to rem.
- *
- * @param px - The pixel value to be converted to rem.
- * @param base - The base value for conversion. Default is 16, which is the typical root font size.
- *
- * @returns The value in rem as a string.
- */
-export declare const pxToRem: (px: number, base?: number) => string;
 /**
  * Calculates the Euclidean distance between two points in 2D space.
  *
@@ -46,17 +36,6 @@ export declare const calculateMovingSpeed: (delta: number, elapsedTime: number)
  * @returns The calculated percentage of the value.
  */
 export declare const calculatePercentage: (value: number, percentage: number) => number;
-/**
- * Converts a 3-character or 6-character HEX color code to an 8-character HEX with alpha (RRGGBBAA) format.
- *
- * @param hex - The 3-character or 6-character HEX color code (e.g., "#RGB" or "#RRGGBB" or "RGB" or "RRGGBB").
- * @param alpha - The alpha transparency value between 0 (fully transparent) and 1 (fully opaque).
- *
- * @throws {Error} If alpha value is not between 0 and 1, or if the hex code is invalid.
- *
- * @returns The 8-character HEX with alpha (RRGGBBAA) format color code, or null if input is invalid.
- */
-export declare const convertHexToHexWithAlpha: (hex: string, alpha: number) => HoneyHEXColor;
 interface HTMLElementTransformationValues {
     translateX: number;
     translateY: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-hive/honey-layout",
-  "version": "6.5.2",
+  "version": "8.0.0",
   "description": "",
   "keywords": [
     "react",
@@ -33,7 +33,7 @@
     "dist"
   ],
   "peerDependencies": {
-    "@react-hive/honey-style": "^1.6.0",
+    "@react-hive/honey-style": "^2.2.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
@@ -56,21 +56,21 @@
     "@types/lodash.merge": "4.6.9",
     "@types/lodash.throttle": "4.1.9",
     "@types/mdx": "2.0.13",
-    "@types/node": "22.15.32",
+    "@types/node": "22.15.33",
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
-    "@vitejs/plugin-react": "4.5.1",
+    "@vitejs/plugin-react": "4.6.0",
     "eslint": "9.29.0",
     "eslint-plugin-react": "7.37.5",
     "husky": "9.1.7",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
-    "prettier": "3.5.3",
-    "ts-jest": "29.3.4",
+    "prettier": "3.6.2",
+    "ts-jest": "29.4.0",
     "tsx": "4.20.3",
     "typescript": "5.8.3",
     "typescript-eslint": "8.35.0",
-    "vite": "6.3.5",
+    "vite": "7.0.0",
     "vite-plugin-checker": "0.9.3",
     "vite-plugin-dts": "4.5.4"
   },

package/dist/constants.d.ts

@@ -1,3 +0,0 @@
-import { HoneyCSSColorProperty, HoneyCSSSpacingProperty } from './types';
-export declare const CSS_SPACING_PROPERTIES: readonly HoneyCSSSpacingProperty[];
-export declare const CSS_COLOR_PROPERTIES: readonly HoneyCSSColorProperty[];