cozy-ui 126.2.0 → 126.3.0

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+# [126.3.0](https://github.com/cozy/cozy-ui/compare/v126.2.0...v126.3.0) (2025-06-17)
+
+
+### Features
+
+* **ExtendableFab:** Forward ref in ExtendableFab component ([86e0b93](https://github.com/cozy/cozy-ui/commit/86e0b93))
+
 # [126.2.0](https://github.com/cozy/cozy-ui/compare/v126.1.0...v126.2.0) (2025-06-16)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cozy-ui",
-  "version": "126.2.0",
+  "version": "126.3.0",
   "description": "Cozy apps UI SDK",
   "main": "./index.js",
   "bin": {

package/react/Fab/ExtendableFab.jsx

@@ -1,30 +1,31 @@
-import React from 'react'
+import React, { forwardRef } from 'react'
 
 import Fab from '.'
 import Icon from '../Icon'
 import useScroll from '../hooks/useScroll'
 
-const ExtendableFab = ({
-  label,
-  icon,
-  follow,
-  topLimit = 50,
-  scrollOptions,
-  ...rest
-}) => {
-  const { scrollTop } = useScroll(follow, scrollOptions)
-  const isBelowTopLimit = scrollTop < topLimit
+const ExtendableFab = forwardRef(
+  ({ label, icon, follow, topLimit = 50, scrollOptions, ...rest }, ref) => {
+    const { scrollTop } = useScroll(follow, scrollOptions)
+    const isBelowTopLimit = scrollTop < topLimit
 
-  return (
-    <Fab
-      aria-label={label}
-      variant={isBelowTopLimit ? 'extended' : 'circular'}
-      {...rest}
-    >
-      <Icon icon={icon} {...(isBelowTopLimit && { className: 'u-mr-half' })} />
-      {isBelowTopLimit && label}
-    </Fab>
-  )
-}
+    return (
+      <Fab
+        ref={ref}
+        aria-label={label}
+        variant={isBelowTopLimit ? 'extended' : 'circular'}
+        {...rest}
+      >
+        <Icon
+          icon={icon}
+          {...(isBelowTopLimit && { className: 'u-mr-half' })}
+        />
+        {isBelowTopLimit && label}
+      </Fab>
+    )
+  }
+)
+
+ExtendableFab.displayName = 'ExtendableFab'
 
 export default ExtendableFab

package/stylus/cozy-ui/build.styl

@@ -1421,6 +1421,7 @@ Display an chip that represents complex identity
     NB: `flex` being much more complex, it has its own set of utility classes, [see further](section-utilities.html#kssref-utilities-flexbox).
 
     .u-dn - Display none
+    .u-dc - Display contents
     .u-di - Display inline
     .u-db - Display block
     .u-dib - Display inline-block

package/transpiled/react/Fab/ExtendableFab.d.ts

@@ -1,9 +1,3 @@
 export default ExtendableFab;
-declare function ExtendableFab({ label, icon, follow, topLimit, scrollOptions, ...rest }: {
-    [x: string]: any;
-    label: any;
-    icon: any;
-    follow: any;
-    topLimit?: number | undefined;
-    scrollOptions: any;
-}): JSX.Element;
+declare const ExtendableFab: React.ForwardRefExoticComponent<React.RefAttributes<any>>;
+import React from "react";

package/transpiled/react/Fab/ExtendableFab.js

@@ -1,12 +1,11 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["label", "icon", "follow", "topLimit", "scrollOptions"];
-import React from 'react';
+import React, { forwardRef } from 'react';
 import Fab from "cozy-ui/transpiled/react/Fab";
 import Icon from "cozy-ui/transpiled/react/Icon";
 import useScroll from "cozy-ui/transpiled/react/hooks/useScroll";
-
-var ExtendableFab = function ExtendableFab(_ref) {
+var ExtendableFab = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var label = _ref.label,
       icon = _ref.icon,
       follow = _ref.follow,
@@ -20,6 +19,7 @@ var ExtendableFab = function ExtendableFab(_ref) {
 
   var isBelowTopLimit = scrollTop < topLimit;
   return /*#__PURE__*/React.createElement(Fab, _extends({
+    ref: ref,
     "aria-label": label,
     variant: isBelowTopLimit ? 'extended' : 'circular'
   }, rest), /*#__PURE__*/React.createElement(Icon, _extends({
@@ -27,6 +27,6 @@ var ExtendableFab = function ExtendableFab(_ref) {
   }, isBelowTopLimit && {
     className: 'u-mr-half'
   })), isBelowTopLimit && label);
-};
-
+});
+ExtendableFab.displayName = 'ExtendableFab';
 export default ExtendableFab;