@react-hive/honey-style 1.5.0 → 1.6.0

package/dist/index.dev.cjs

@@ -1164,6 +1164,80 @@ function filter (array, pattern) {
 }
 
 
+/***/ }),
+
+/***/ "./src/at-rules/index.ts":
+/*!*******************************!*\
+  !*** ./src/at-rules/index.ts ***!
+  \*******************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   mediaQuery: () => (/* reexport safe */ _media_query__WEBPACK_IMPORTED_MODULE_0__.mediaQuery)
+/* harmony export */ });
+/* harmony import */ var _media_query__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./media-query */ "./src/at-rules/media-query.ts");
+
+
+
+/***/ }),
+
+/***/ "./src/at-rules/media-query.ts":
+/*!*************************************!*\
+  !*** ./src/at-rules/media-query.ts ***!
+  \*************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   mediaQuery: () => (/* binding */ mediaQuery)
+/* harmony export */ });
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils */ "./src/utils.ts");
+
+/**
+ * Constructs a complete `@media` query string from an array of media rule objects.
+ * Each rule defines conditions such as screen size, orientation, or resolution,
+ * which are converted into standard CSS media query syntax.
+ *
+ * @param rules - An array of media rule objects used to generate individual media queries.
+ *
+ * @returns A string containing a full `@media` query that can be used in CSS or injected into a stylesheet.
+ *
+ * @example
+ * ```ts
+ * atMedia([
+ *   { minWidth: '768px', orientation: 'landscape' },
+ *   { mediaType: 'print' }
+ * ]);
+ * // Returns: "@media screen and (min-width: 768px) and (orientation: landscape), print"
+ * ```
+ */
+const mediaQuery = (rules) => {
+    const mediaRules = rules.map(rule => {
+        const rulesConfig = [
+            rule.width && ['width', rule.width],
+            rule.minWidth && ['min-width', rule.minWidth],
+            rule.maxWidth && ['max-width', rule.maxWidth],
+            rule.height && ['height', rule.height],
+            rule.minHeight && ['min-height', rule.minHeight],
+            rule.maxHeight && ['max-height', rule.maxHeight],
+            rule.orientation && ['orientation', rule.orientation],
+            rule.minResolution && ['min-resolution', rule.minResolution],
+            rule.maxResolution && ['max-resolution', rule.maxResolution],
+            rule.resolution && ['resolution', rule.resolution],
+            rule.update && ['update', rule.update],
+        ];
+        const conditions = (0,_utils__WEBPACK_IMPORTED_MODULE_0__.boolFilter)(rulesConfig)
+            .map(ruleConfig => `(${ruleConfig[0]}: ${ruleConfig[1]})`)
+            .join(' and ');
+        const operatorPart = rule.operator ? `${rule.operator} ` : '';
+        const conditionsPart = conditions ? ` and ${conditions}` : '';
+        return `${operatorPart}${rule.mediaType ?? 'screen'}${conditionsPart}`;
+    });
+    return `@media ${mediaRules.join(', ')}`;
+};
+
+
 /***/ }),
 
 /***/ "./src/constants.ts":
@@ -1255,6 +1329,7 @@ const VALID_HTML_ATTRS = new Set([
     'muted',
     'poster',
     'preload',
+    'role',
     'src',
     'srcSet',
     'useMap',
@@ -1429,6 +1504,16 @@ const VALID_EVENT_ATTRS = new Set([
     // Image
     'onLoad',
     'onError',
+    // Transition
+    'onTransitionEnd',
+    'onTransitionStart',
+    'onTransitionRun',
+    'onTransitionCancel',
+    // Animation
+    'onAnimationStart',
+    'onAnimationEnd',
+    'onAnimationIteration',
+    'onAnimationCancel',
 ]);
 const VALID_DOM_ELEMENT_ATTRS = new Set([
     ...VALID_HTML_ATTRS,
@@ -1889,6 +1974,7 @@ __webpack_require__.r(__webpack_exports__);
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
 /* harmony export */   assert: () => (/* binding */ assert),
+/* harmony export */   boolFilter: () => (/* binding */ boolFilter),
 /* harmony export */   combineClassNames: () => (/* binding */ combineClassNames),
 /* harmony export */   filterNonHtmlAttrs: () => (/* binding */ filterNonHtmlAttrs),
 /* harmony export */   generateId: () => (/* binding */ generateId),
@@ -1897,7 +1983,6 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   isObject: () => (/* binding */ isObject),
 /* harmony export */   isString: () => (/* binding */ isString),
 /* harmony export */   isStyledComponent: () => (/* binding */ isStyledComponent),
-/* harmony export */   mediaQuery: () => (/* binding */ mediaQuery),
 /* harmony export */   processCss: () => (/* binding */ processCss),
 /* harmony export */   resolveClassName: () => (/* binding */ resolveClassName),
 /* harmony export */   toKebabCase: () => (/* binding */ toKebabCase)
@@ -1925,6 +2010,19 @@ const isFunction = (value) => typeof value === 'function';
  * @returns `true` if the value is `null` or `undefined`, otherwise `false`.
  */
 const isNil = (value) => value === undefined || value === null;
+/**
+ * Filters out `null`, `undefined`, and other falsy values from an array,
+ * returning a typed array of only truthy `Item` values.
+ *
+ * Useful when working with optional or nullable items that need to be sanitized.
+ *
+ * @template T - The type of the items in the array.
+ *
+ * @param array - An array of items that may include `null`, `undefined`, or falsy values.
+ *
+ * @returns A new array containing only truthy `Item` values.
+ */
+const boolFilter = (array) => array.filter(Boolean);
 /**
  * Generates a short, consistent hash string from an input string using a DJB2-inspired algorithm.
  *
@@ -1991,48 +2089,6 @@ const filterNonHtmlAttrs = (attrs) => Object.entries(attrs).reduce((allowedAttrs
     }
     return allowedAttrs;
 }, {});
-/**
- * Constructs a complete `@media` query string from an array of media rule objects.
- * Each rule defines conditions such as screen size, orientation, or resolution,
- * which are converted into standard CSS media query syntax.
- *
- * @param rules - An array of media rule objects used to generate individual media queries.
- *
- * @returns A string containing a full `@media` query that can be used in CSS or injected into a stylesheet.
- *
- * @example
- * ```ts
- * atMedia([
- *   { minWidth: '768px', orientation: 'landscape' },
- *   { mediaType: 'print' }
- * ]);
- * // Returns: "@media screen and (min-width: 768px) and (orientation: landscape), print"
- * ```
- */
-const mediaQuery = (rules) => {
-    const mediaRules = rules.map(rule => {
-        const conditions = [
-            rule.width && ['width', rule.width],
-            rule.minWidth && ['min-width', rule.minWidth],
-            rule.maxWidth && ['max-width', rule.maxWidth],
-            rule.height && ['height', rule.height],
-            rule.minHeight && ['min-height', rule.minHeight],
-            rule.maxHeight && ['max-height', rule.maxHeight],
-            rule.orientation && ['orientation', rule.orientation],
-            rule.minResolution && ['min-resolution', rule.minResolution],
-            rule.maxResolution && ['max-resolution', rule.maxResolution],
-            rule.resolution && ['resolution', rule.resolution],
-            rule.update && ['update', rule.update],
-        ]
-            .filter(Boolean)
-            .map(r => r && `(${r[0]}: ${r[1]})`)
-            .join(' and ');
-        const operatorPart = rule.operator ? `${rule.operator} ` : '';
-        const conditionsPart = conditions ? ` and ${conditions}` : '';
-        return `${operatorPart}${rule.mediaType ?? 'screen'}${conditionsPart}`;
-    });
-    return `@media ${mediaRules.join(', ')}`;
-};
 
 
 /***/ }),
@@ -2133,6 +2189,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   __DEV__: () => (/* reexport safe */ _constants__WEBPACK_IMPORTED_MODULE_0__.__DEV__),
 /* harmony export */   createGlobalStyle: () => (/* reexport safe */ _global_style__WEBPACK_IMPORTED_MODULE_6__.createGlobalStyle),
 /* harmony export */   css: () => (/* reexport safe */ _css__WEBPACK_IMPORTED_MODULE_5__.css),
+/* harmony export */   mediaQuery: () => (/* reexport safe */ _at_rules__WEBPACK_IMPORTED_MODULE_8__.mediaQuery),
 /* harmony export */   styled: () => (/* reexport safe */ _styled__WEBPACK_IMPORTED_MODULE_7__.styled),
 /* harmony export */   useHoneyStyle: () => (/* reexport safe */ _hooks__WEBPACK_IMPORTED_MODULE_3__.useHoneyStyle)
 /* harmony export */ });
@@ -2144,6 +2201,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _css__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./css */ "./src/css.ts");
 /* harmony import */ var _global_style__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./global-style */ "./src/global-style.ts");
 /* harmony import */ var _styled__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./styled */ "./src/styled.ts");
+/* harmony import */ var _at_rules__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./at-rules */ "./src/at-rules/index.ts");
+