@admin-layout/tailwind-design-pro 10.0.9-alpha.45 → 10.0.9-alpha.46
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.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {jsxs,jsx}from'react/jsx-runtime';import {useState,useRef,useEffect}from'react';import {Sidebar}from'../Sidebar/Sidebar.js';import {GlobalHeader}from'../GlobalHeader/Header.js';import {Outlet}from'@remix-run/react';import warning from'warning';import {omit}from'lodash-es';import {SettingDrawer}from'../../SettingDrawer/SettingDrawer.js';import {defaultSettings,useComponentSize,getMenuSeparation,getThemeColors}from'@admin-layout/client';import isBrowser from'../../../utils/isBrowser/index.js';import {getPageTitleInfo}from'../getPageTitle.js';import {useTheme}from'../../ThemeProvider/ThemeProvider.js';import {MainHeader}from'../GlobalHeader/MainHeader.js';import'../GlobalHeader/Logo.js';import'react-router';import'../../../helpers/DynamicIcon.js';import'@app/dialog/WrappedDialogsSwitch';import'@common-stack/components-pro';import {FooterSlot}from'../slot-fill/Footer.js';import'reflect-metadata';import'@admin-layout/client/lib/constants/layout.js';import {config}from'../../../config/env-config.js';const useHorizontalScroll = ({
|
|
1
|
+
import {jsxs,jsx}from'react/jsx-runtime';import {useState,useRef,useEffect}from'react';import {Sidebar}from'../Sidebar/Sidebar.js';import {GlobalHeader}from'../GlobalHeader/Header.js';import {Outlet}from'@remix-run/react';import warning from'warning';import {omit}from'lodash-es';import {SettingDrawer}from'../../SettingDrawer/SettingDrawer.js';import {defaultSettings,useComponentSize,getMenuSeparation,getThemeColors}from'@admin-layout/client';import isBrowser from'../../../utils/isBrowser/index.js';import {getPageTitleInfo}from'../getPageTitle.js';import {useTheme}from'../../ThemeProvider/ThemeProvider.js';import {MainHeader}from'../GlobalHeader/MainHeader.js';import'../GlobalHeader/Logo.js';import'react-router';import'../../../helpers/DynamicIcon.js';import'@app/dialog/WrappedDialogsSwitch';import'@common-stack/components-pro';import {FooterSlot}from'../slot-fill/Footer.js';import'reflect-metadata';import'@admin-layout/client/lib/constants/layout.js';import {config}from'../../../config/env-config.js';import {useScrollThreshold}from'../../../hooks/useScrollThreshold.js';const useHorizontalScroll = ({
|
|
2
2
|
setScrolled,
|
|
3
3
|
setSearchOptionsShown,
|
|
4
4
|
onScrollReachEnd
|
|
@@ -112,14 +112,14 @@ const BasicLayout = props => {
|
|
|
112
112
|
...defaultProps
|
|
113
113
|
}, propsWithSettings);
|
|
114
114
|
const settingRef = useRef(settings);
|
|
115
|
-
settings?.regions?.scrollThreshold || 50;
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
115
|
+
const scrollThreshold = settings?.regions?.scrollThreshold || 50;
|
|
116
|
+
const {
|
|
117
|
+
componentVisibility
|
|
118
|
+
} = useScrollThreshold([{
|
|
119
|
+
threshold: scrollThreshold,
|
|
120
|
+
id: 'search-bar',
|
|
121
|
+
useWindowScroll: true
|
|
122
|
+
}]);
|
|
123
123
|
useEffect(() => {
|
|
124
124
|
// Only update if the primaryColor actually needs to change
|
|
125
125
|
if (settingRef.current?.primaryColor === '#3FA541C' && primaryColor !== '#3FA541C') {
|
|
@@ -188,7 +188,8 @@ const BasicLayout = props => {
|
|
|
188
188
|
searchOptionsShown: searchOptionsShown,
|
|
189
189
|
setSearchOptionsShown: setSearchOptionsShown,
|
|
190
190
|
authorities: authorities,
|
|
191
|
-
picture: picture
|
|
191
|
+
picture: picture,
|
|
192
|
+
componentVisibility: componentVisibility
|
|
192
193
|
}), jsx(SettingDrawer, {
|
|
193
194
|
primaryColor: primaryColor,
|
|
194
195
|
settings: settings,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../src/components/Layout/BasicLayout/index.tsx"],"sourcesContent":[null],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../src/components/Layout/BasicLayout/index.tsx"],"sourcesContent":[null],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
import {useState,useRef,useCallback,useEffect}from'react';const throttle = (fn, wait = 100) => {
|
|
2
|
+
let time = Date.now();
|
|
3
|
+
return function (...args) {
|
|
4
|
+
if (time + wait - Date.now() < 0) {
|
|
5
|
+
fn(...args);
|
|
6
|
+
time = Date.now();
|
|
7
|
+
}
|
|
8
|
+
};
|
|
9
|
+
};
|
|
10
|
+
const useScrollThreshold = configs => {
|
|
11
|
+
const [componentVisibility, setComponentVisibility] = useState({});
|
|
12
|
+
const containerRef = useRef(null);
|
|
13
|
+
const visibilityRef = useRef({});
|
|
14
|
+
const updateVisibility = useCallback(scrollPosition => {
|
|
15
|
+
const newVisibility = {};
|
|
16
|
+
let hasChanges = false;
|
|
17
|
+
configs.forEach(({
|
|
18
|
+
threshold,
|
|
19
|
+
id
|
|
20
|
+
}) => {
|
|
21
|
+
const isVisible = scrollPosition >= threshold;
|
|
22
|
+
if (visibilityRef.current[id] !== isVisible) {
|
|
23
|
+
hasChanges = true;
|
|
24
|
+
}
|
|
25
|
+
newVisibility[id] = isVisible;
|
|
26
|
+
});
|
|
27
|
+
if (hasChanges) {
|
|
28
|
+
visibilityRef.current = newVisibility;
|
|
29
|
+
setComponentVisibility(newVisibility);
|
|
30
|
+
}
|
|
31
|
+
}, [configs]);
|
|
32
|
+
useEffect(() => {
|
|
33
|
+
const config = configs[0]; // Assuming we're only using one config for now
|
|
34
|
+
const useWindowScroll = config?.useWindowScroll ?? false;
|
|
35
|
+
const throttledUpdate = throttle(() => {
|
|
36
|
+
const scrollPosition = useWindowScroll ? window.scrollY : containerRef.current?.scrollTop ?? 0;
|
|
37
|
+
updateVisibility(scrollPosition);
|
|
38
|
+
}, 50);
|
|
39
|
+
const handleScroll = () => {
|
|
40
|
+
throttledUpdate();
|
|
41
|
+
};
|
|
42
|
+
if (useWindowScroll) {
|
|
43
|
+
window.addEventListener('scroll', handleScroll);
|
|
44
|
+
} else if (containerRef.current) {
|
|
45
|
+
containerRef.current.addEventListener('scroll', handleScroll);
|
|
46
|
+
}
|
|
47
|
+
updateVisibility(useWindowScroll ? window.scrollY : containerRef.current?.scrollTop ?? 0);
|
|
48
|
+
return () => {
|
|
49
|
+
if (useWindowScroll) {
|
|
50
|
+
window.removeEventListener('scroll', handleScroll);
|
|
51
|
+
} else if (containerRef.current) {
|
|
52
|
+
containerRef.current.removeEventListener('scroll', handleScroll);
|
|
53
|
+
}
|
|
54
|
+
};
|
|
55
|
+
}, [configs, updateVisibility]);
|
|
56
|
+
return {
|
|
57
|
+
containerRef,
|
|
58
|
+
componentVisibility
|
|
59
|
+
};
|
|
60
|
+
};export{useScrollThreshold};//# sourceMappingURL=useScrollThreshold.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useScrollThreshold.js","sources":["../../src/hooks/useScrollThreshold.ts"],"sourcesContent":[null],"names":[],"mappings":"0DAQA,MAAM,QAAQ,GAAG,CAAC,EAAY,EAAE,IAAe,GAAA,GAAG,KAAI;AAClD,EAAA,IAAA,OAAW,IAAA,CAAA,GAAK,EAAG;SACZ,UAAA,OAAwB,EAAA;QAC3B,IAAI,GAAA,IAAO,GAAA,IAAO,CAAA,GAAI,EAAC,GAAK,CAAA,EAAA;AACxB,MAAA,EAAA,CAAA,GAAA,IAAG,CAAA;AACH,MAAA,IAAA,GAAA,IAAO,CAAA,GAAA,EAAI;;AAEnB,GAAA;AACJ,CAAC;AAEY,MAAA,kBAAkB,GAAG,OAAC,IAAoC;QAC7D,CAAA,mBAAoB,EAAA,sBAAwB,CAAA,WAAY,CAAA,EAA0B,CAAE;AAC1F,EAAA,MAAA,eAAqB,MAAA,CAAA,IAAuB,CAAA;AAC5C,EAAA,MAAA,gBAAsB,MAAA,CAAA,EAAgC,CAAA;AAEtD,EAAA,MAAA,mBAAyB,WAAA,CAAA,cACpB;UACS,aAAA,GAAA,EAAyC;QAC/C,UAAI,GAAA,KAAa;WAEV,CAAA,OAAQ,CAAA,CAAA;AACX,MAAA,SAAA;;;YAGA,SAAC,GAAA,cAAA,IAAA,SAAA;AACD,MAAA,IAAA,aAAA,CAAA,OAAiB,CAAG,iBAAU,EAAA;AAClC,QAAA,UAAG,GAAA,IAAA;;AAGC,MAAA,aAAA,CAAA,EAAA,CAAA,GAAc,SAAU;;QAE5B,UAAC,EAAA;AACL,MACA,aACF,CAAA,OAAA,GAAA,aAAA;MAEO,sBAAM,CAAA,aAAA,CAAA;;AAEX,GAAA,EAAA,CAAA,OAAA,CAAM;AAEN,EAAA,SAAA,CAAA,MAAqB;AACjB,IAAA,MAAA,MAAA;yBACgB,GAAA,MAAe,EAAA,eAAE,IAAA,KAAA;UACpC,eAAM,GAAA,QAAA,CAAA,MAAA;YAED,cAAY,GAAG,eAAK,GAAA,MAAA,CAAA,OAAA,GAAA,YAAA,CAAA,OAAA,EAAA,SAAA,IAAA,CAAA;AACtB,MAAA,gBAAA,CAAA,cAAkB,CAAA;AACtB,KAAA,EAAA,EAAC,CAAC;UAEE,YAAA,GAAA,MAAkB;AAClB,MAAA,eAAuB,EAAA;;AACpB,IAAA,IAAA,eAAgB,EAAA;YACnB,CAAY,yBAAS,EAAA,YAAyB,CAAA;WACjD,IAAA,YAAA,CAAA,OAAA,EAAA;AAED,MAAA,YAAA,CAAA,OAAgC,CAAA,gBAAG,CAAA,QAAc,EAAA,YAAG,CAAA;AAEpD;oBACQ,CAAA,eAAkB,GAAA,MAAA,CAAA,OAAA,GAAA,YAAA,CAAA,OAAA,EAAA,SAAA,IAAA,CAAA,CAAA;AAClB,IAAA,OAAA,MAAA;yBACH,EAAA;AAAM,QAAA,MAAA,CAAA,mBAAiB,CAAO,QAAE,EAAC,YAAA,CAAA;iBAClB,YAAC,QAAQ,EAAA;oBACxB,CAAA,OAAA,CAAA,mBAAA,CAAA,QAAA,EAAA,YAAA,CAAA;AACL;AACJ,KAAC;KAEM,CAAA,OAAA,EAAA,gBAAA,CAAA,CAAA;SACS;gBACO;;AAE3B,GAAE;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@admin-layout/tailwind-design-pro",
|
|
3
|
-
"version": "10.0.9-alpha.
|
|
3
|
+
"version": "10.0.9-alpha.46",
|
|
4
4
|
"description": "Sample core for higher packages to depend on",
|
|
5
5
|
"license": "ISC",
|
|
6
6
|
"author": "CDMBase LLC",
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
}
|
|
59
59
|
}
|
|
60
60
|
},
|
|
61
|
-
"gitHead": "
|
|
61
|
+
"gitHead": "b2f98cdfe7fde9a05938039633b23a44b7f01ead",
|
|
62
62
|
"typescript": {
|
|
63
63
|
"definition": "lib/index.d.ts"
|
|
64
64
|
}
|