@cypress-design/react-docmenu 0.6.0 → 0.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +1 -1
- package/CHANGELOG.md +6 -0
- package/DocMenuReact.cy.tsx +43 -73
- package/_DocLink.tsx +21 -0
- package/dist/_DocLink.d.ts.map +1 -1
- package/dist/index.es.mjs +18 -1
- package/dist/index.es.mjs.map +1 -1
- package/dist/index.umd.js +18 -1
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
package/dist/index.umd.js
CHANGED
|
@@ -201,6 +201,23 @@ var DocLink = React__namespace.forwardRef(function (_a, ref) {
|
|
|
201
201
|
// on mount, if the item is active,
|
|
202
202
|
// send the top position to the parent
|
|
203
203
|
React__namespace.useEffect(setActiveMarkerPosition, [onActive, active]);
|
|
204
|
+
React__namespace.useEffect(function () {
|
|
205
|
+
if (active && activeLIRef.current) {
|
|
206
|
+
// if active check if the item is visible in the
|
|
207
|
+
// viewport and scrollIntoView if not
|
|
208
|
+
var rect = activeLIRef.current.getBoundingClientRect();
|
|
209
|
+
if (rect.top > 0 && rect.bottom < window.innerHeight) {
|
|
210
|
+
return;
|
|
211
|
+
}
|
|
212
|
+
if (rect.left > 0 && rect.right < window.innerWidth) {
|
|
213
|
+
return;
|
|
214
|
+
}
|
|
215
|
+
activeLIRef.current.scrollIntoView({
|
|
216
|
+
block: 'nearest',
|
|
217
|
+
inline: 'nearest',
|
|
218
|
+
});
|
|
219
|
+
}
|
|
220
|
+
}, [active]);
|
|
204
221
|
React__namespace.useImperativeHandle(ref, function () { return ({
|
|
205
222
|
setActiveMarkerPosition: setActiveMarkerPosition,
|
|
206
223
|
}); });
|
|
@@ -427,4 +444,4 @@ var DocMenu = function (_a) {
|
|
|
427
444
|
module.exports = DocMenu;
|
|
428
445
|
//# sourceMappingURL=index.umd.js.map
|
|
429
446
|
|
|
430
|
-
/* <wind-keep class="container relative absolute h-[36px] w-[4px] z-50 rounded-full bg-indigo-500 dark:bg-indigo-400 ml-[6.5px] mt-[4px] transition ease-in-out text-indigo-500 dark:text-indigo-400 text-gray-900 dark:text-gray-100 text-gray-800 dark:text-gray-200 rotate-0 -rotate-90 transition-all grid grid-rows-[0fr] grid-rows-[1fr] overflow-hidden filter list-none p-0 block w-full pl-[24px] text-gray-700 dark:text-gray-500 py-[8px] text-[16px] leading-[24px] leading-[20px] text-[14px] py-[12px] left-[6.5px] top-[4px] bottom-[4px] z-10 hidden group-hover:block bg-gray-300 text-indigo-400 text-gray-500 bg-indigo-400 left-0 transform transition-transform text-gray-400 dark:text-gray-700 flex py-[10px] items-center text-start font-medium pl-[48px] left-[8px] top-0 w-[1px] h-full bg-gray-100 dark:bg-gray-900"> */
|
|
447
|
+
/* <wind-keep class="container relative absolute h-[36px] w-[4px] z-50 rounded-full bg-indigo-500 dark:bg-indigo-400 ml-[6.5px] mt-[4px] transition ease-in-out text-indigo-500 dark:text-indigo-400 text-gray-900 dark:text-gray-100 text-gray-800 dark:text-gray-200 rotate-0 -rotate-90 transition-all grid grid-rows-[0fr] grid-rows-[1fr] overflow-hidden filter list-none p-0 visible block inline w-full pl-[24px] text-gray-700 dark:text-gray-500 py-[8px] text-[16px] leading-[24px] leading-[20px] text-[14px] py-[12px] left-[6.5px] top-[4px] bottom-[4px] z-10 hidden group-hover:block bg-gray-300 text-indigo-400 text-gray-500 bg-indigo-400 left-0 transform transition-transform text-gray-400 dark:text-gray-700 flex py-[10px] items-center text-start font-medium pl-[48px] left-[8px] top-0 w-[1px] h-full bg-gray-100 dark:bg-gray-900"> */
|