@admin-layout/tailwind-design-pro 10.0.9-alpha.47 → 10.0.9-alpha.48
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/lib/components/Layout/BasicLayout/index.d.ts.map +1 -1
- package/lib/components/Layout/BasicLayout/index.js +57 -48
- package/lib/components/Layout/BasicLayout/index.js.map +1 -1
- package/lib/components/Layout/GlobalHeader/Header.d.ts.map +1 -1
- package/lib/components/Layout/GlobalHeader/Header.js +23 -16
- package/lib/components/Layout/GlobalHeader/Header.js.map +1 -1
- package/lib/components/Layout/Sidebar/Sidebar.d.ts.map +1 -1
- package/lib/components/Layout/Sidebar/Sidebar.js +28 -28
- package/lib/components/Layout/Sidebar/Sidebar.js.map +1 -1
- package/lib/components/Layout/Sidebar/SidebarMenu.d.ts.map +1 -1
- package/lib/components/Layout/Sidebar/SidebarMenu.js +25 -11
- package/lib/components/Layout/Sidebar/SidebarMenu.js.map +1 -1
- package/lib/hooks/index.d.ts +1 -0
- package/lib/hooks/index.d.ts.map +1 -1
- package/lib/hooks/useMediaQuery.d.ts +14 -0
- package/lib/hooks/useMediaQuery.d.ts.map +1 -0
- package/lib/hooks/useMediaQuery.js +49 -0
- package/lib/hooks/useMediaQuery.js.map +1 -0
- package/lib/icons.d.ts +2 -0
- package/lib/icons.d.ts.map +1 -1
- package/lib/icons.js +4 -2
- package/lib/icons.js.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/BasicLayout/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAOtF,OAAO,EACH,gBAAgB,EAGhB,iBAAiB,EAIpB,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/BasicLayout/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiE,MAAM,OAAO,CAAC;AAOtF,OAAO,EACH,gBAAgB,EAGhB,iBAAiB,EAIpB,MAAM,sBAAsB,CAAC;AAS9B,eAAO,MAAM,mBAAmB;;;;uCA4B/B,CAAC;AAgCF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAC9B,gBAAgB,GAAG,iBAAiB,GAAG;IAAE,WAAW,CAAC,EAAE,GAAG,CAAC;IAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAuM3F,CAAC"}
|
|
@@ -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';import {useScrollThreshold}from'../../../hooks/useScrollThreshold.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';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import'../../../hooks/use-get-current-lat-long.js';import {useMediaQuery}from'../../../hooks/useMediaQuery.js';const useHorizontalScroll = ({
|
|
2
2
|
setScrolled,
|
|
3
3
|
setSearchOptionsShown,
|
|
4
4
|
onScrollReachEnd
|
|
@@ -96,6 +96,9 @@ const BasicLayout = props => {
|
|
|
96
96
|
theme,
|
|
97
97
|
isDarkMode
|
|
98
98
|
} = useTheme();
|
|
99
|
+
const {
|
|
100
|
+
isMobile
|
|
101
|
+
} = useMediaQuery();
|
|
99
102
|
const onScrollReachEnd = () => {
|
|
100
103
|
setScrollEnd(prevScrollEnd => !prevScrollEnd);
|
|
101
104
|
};
|
|
@@ -157,61 +160,67 @@ const BasicLayout = props => {
|
|
|
157
160
|
// Get background color based on dark mode
|
|
158
161
|
const backgroundColor = isDarkMode ? theme.colors.background.dark : theme.colors.background.light;
|
|
159
162
|
return jsxs("div", {
|
|
160
|
-
className: "flex h-screen bg-background font-sans",
|
|
163
|
+
className: "flex flex-col h-screen bg-background font-sans",
|
|
161
164
|
ref: horizontalScrollRef,
|
|
162
165
|
style: {
|
|
163
166
|
backgroundColor: backgroundColor
|
|
164
167
|
},
|
|
165
|
-
children: [settings?.
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
collapsed: collapsed,
|
|
170
|
-
setCollapsed: setCollapsed,
|
|
168
|
+
children: [settings?.regions.showHeader && LAYOUT_ROOT != '/' && jsx(GlobalHeader, {
|
|
169
|
+
toggleSideMenu: toggleSideMenu,
|
|
170
|
+
settings: settings,
|
|
171
|
+
upperMenus: getMenuSeparation(menuData).upperMenus,
|
|
171
172
|
routeParams: routeParams,
|
|
172
|
-
|
|
173
|
+
collapsed: collapsed
|
|
174
|
+
}), LAYOUT_ROOT === '/' && settings?.regions.showHeader && jsx(MainHeader, {
|
|
175
|
+
scrolled: scrolled,
|
|
176
|
+
location: location,
|
|
177
|
+
menuData: menuData,
|
|
178
|
+
settings: settings,
|
|
179
|
+
pageTitleInfo: pageTitleInfo,
|
|
180
|
+
onSettingChange: onSettingChange,
|
|
181
|
+
searchOptionsShown: searchOptionsShown,
|
|
182
|
+
setSearchOptionsShown: setSearchOptionsShown,
|
|
183
|
+
authorities: authorities,
|
|
184
|
+
picture: picture,
|
|
185
|
+
componentVisibility: componentVisibility
|
|
173
186
|
}), jsxs("div", {
|
|
174
|
-
className: "flex flex-
|
|
175
|
-
children: [settings?.regions.
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
upperMenus: getMenuSeparation(menuData).upperMenus,
|
|
179
|
-
routeParams: routeParams,
|
|
180
|
-
collapsed: collapsed
|
|
181
|
-
}), LAYOUT_ROOT === '/' && settings?.regions.showHeader && jsx(MainHeader, {
|
|
182
|
-
scrolled: scrolled,
|
|
183
|
-
location: location,
|
|
187
|
+
className: "flex flex-1 relative",
|
|
188
|
+
children: [settings?.layout.navigationMode !== 'topbar' && settings?.regions.showMenu && !settings?.layout.splitMenus && LAYOUT_ROOT != '/' && jsx(Sidebar, {
|
|
189
|
+
isSideMenuOpen: isSideMenuOpen,
|
|
190
|
+
closeSideMenu: closeSideMenu,
|
|
184
191
|
menuData: menuData,
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
onSettingChange: onSettingChange,
|
|
197
|
-
actor: actor,
|
|
198
|
-
colorList: getThemeColors(settings?.theme)
|
|
199
|
-
}), jsxs("main", {
|
|
200
|
-
className: "relative",
|
|
201
|
-
children: [searchOptionsShown && settings?.regions?.searchBarOverlay && jsx("div", {
|
|
202
|
-
className: "fixed inset-0 bg-black bg-opacity-50 z-30 cursor-pointer",
|
|
203
|
-
onClick: e => {
|
|
204
|
-
e.stopPropagation();
|
|
205
|
-
setSearchOptionsShown(false);
|
|
206
|
-
}
|
|
207
|
-
}), jsx(Outlet, {})]
|
|
208
|
-
}), jsx("div", {
|
|
209
|
-
ref: refFooter,
|
|
210
|
-
className: footerFixed ? 'fixed bottom-0 w-full' : '',
|
|
211
|
-
children: jsx(FooterSlot, {
|
|
192
|
+
collapsed: collapsed,
|
|
193
|
+
setCollapsed: setCollapsed,
|
|
194
|
+
routeParams: routeParams,
|
|
195
|
+
settings: settings
|
|
196
|
+
}), jsxs("div", {
|
|
197
|
+
className: "flex flex-col flex-1 overflow-auto",
|
|
198
|
+
style: {
|
|
199
|
+
marginLeft: settings?.layout.navigationMode !== 'topbar' && settings?.regions.showMenu && !settings?.layout.splitMenus && settings?.layout.fixedSidebar && !isMobile && LAYOUT_ROOT != '/' ? collapsed ? '64px' : '256px' : '0px'
|
|
200
|
+
},
|
|
201
|
+
children: [jsx(SettingDrawer, {
|
|
202
|
+
primaryColor: primaryColor,
|
|
212
203
|
settings: settings,
|
|
213
|
-
|
|
214
|
-
|
|
204
|
+
onSettingChange: onSettingChange,
|
|
205
|
+
actor: actor,
|
|
206
|
+
colorList: getThemeColors(settings?.theme)
|
|
207
|
+
}), jsxs("main", {
|
|
208
|
+
className: "flex-1 p-4",
|
|
209
|
+
children: [searchOptionsShown && settings?.regions?.searchBarOverlay && jsx("div", {
|
|
210
|
+
className: "fixed inset-0 bg-black bg-opacity-50 z-30 cursor-pointer",
|
|
211
|
+
onClick: e => {
|
|
212
|
+
e.stopPropagation();
|
|
213
|
+
setSearchOptionsShown(false);
|
|
214
|
+
}
|
|
215
|
+
}), jsx(Outlet, {})]
|
|
216
|
+
}), jsx("div", {
|
|
217
|
+
ref: refFooter,
|
|
218
|
+
className: footerFixed ? 'fixed bottom-0 w-full' : '',
|
|
219
|
+
children: jsx(FooterSlot, {
|
|
220
|
+
settings: settings,
|
|
221
|
+
active: settings?.regions?.showFooter === undefined ? true : settings?.regions?.showFooter
|
|
222
|
+
})
|
|
223
|
+
})]
|
|
215
224
|
})]
|
|
216
225
|
})]
|
|
217
226
|
});
|
|
@@ -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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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/GlobalHeader/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/GlobalHeader/Header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,sBAAsB,EAAE,MAAM,eAAe,CAAC;AAGvD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,GAAG,GAAG,CAyE/D,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {jsx,jsxs}from'react/jsx-runtime';import React__default from'react';import {Link}from'@remix-run/react';import {RightContent}from'./RightContent.js';import {icons}from'../../../icons.js';const GlobalHeader = props => {
|
|
1
|
+
import {jsx,jsxs}from'react/jsx-runtime';import React__default from'react';import {Link}from'@remix-run/react';import {RightContent}from'./RightContent.js';import {icons}from'../../../icons.js';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import'../../../hooks/use-get-current-lat-long.js';import {useMediaQuery}from'../../../hooks/useMediaQuery.js';const GlobalHeader = props => {
|
|
2
2
|
const {
|
|
3
3
|
theme,
|
|
4
4
|
layout,
|
|
@@ -12,37 +12,44 @@ import {jsx,jsxs}from'react/jsx-runtime';import React__default from'react';impor
|
|
|
12
12
|
MenuIcon,
|
|
13
13
|
SearchIcon
|
|
14
14
|
} = icons;
|
|
15
|
+
const {
|
|
16
|
+
isMobile
|
|
17
|
+
} = useMediaQuery();
|
|
15
18
|
// Calculate header styles
|
|
16
19
|
const headerStyles = React__default.useMemo(() => ({
|
|
17
|
-
backgroundColor: settings?.navTheme === 'realDark' ? '#222' : '',
|
|
20
|
+
backgroundColor: settings?.navTheme === 'realDark' ? '#222' : 'white',
|
|
18
21
|
color: settings?.navTheme === 'realDark' ? '#fff' : ''
|
|
19
22
|
}), [settings]);
|
|
20
23
|
if (!settings?.regions?.showHeader) return null;
|
|
21
24
|
return jsx("header", {
|
|
22
|
-
className:
|
|
25
|
+
className: `z-10 py-4 dark:bg-gray-800 top-0 border-b border-gray-200 ${settings?.layout?.fixedHeader ? 'sticky' : 'relative'}`,
|
|
23
26
|
style: headerStyles,
|
|
24
27
|
children: jsxs("div", {
|
|
25
|
-
className: "
|
|
28
|
+
className: "flex items-center justify-between h-full px-4 sm:px-6 mx-auto text-gray-700 dark:text-gray-200",
|
|
26
29
|
children: [jsx("button", {
|
|
27
|
-
className: "p-1
|
|
30
|
+
className: "p-1 -ml-1 rounded-md md:hidden focus:outline-none focus:shadow-outline-purple",
|
|
28
31
|
onClick: toggleSideMenu,
|
|
29
32
|
"aria-label": "Menu",
|
|
30
33
|
children: jsx(MenuIcon, {
|
|
31
34
|
className: "w-6 h-6"
|
|
32
35
|
})
|
|
33
|
-
}),
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
36
|
+
}), jsx("div", {
|
|
37
|
+
children: jsxs(Link, {
|
|
38
|
+
to: "/",
|
|
39
|
+
className: "ml-6 flex items-center gap-2.5 text-lg font-bold text-gray-800 dark:text-gray-200",
|
|
40
|
+
style: headerStyles,
|
|
41
|
+
children: [jsx("img", {
|
|
42
|
+
src: settings?.logo,
|
|
43
|
+
className: "w-[28px]"
|
|
44
|
+
}), !isMobile && jsx("span", {
|
|
45
|
+
children: settings?.title
|
|
46
|
+
})]
|
|
47
|
+
})
|
|
48
|
+
}), settings?.regions?.searchBarRender && jsx("div", {
|
|
49
|
+
className: "flex-1 max-w-xl mx-4 hidden md:block",
|
|
43
50
|
style: headerStyles,
|
|
44
51
|
children: jsxs("div", {
|
|
45
|
-
className: "relative w-full
|
|
52
|
+
className: "relative w-full focus-within:text-purple-500",
|
|
46
53
|
style: headerStyles,
|
|
47
54
|
children: [jsx("div", {
|
|
48
55
|
className: "absolute inset-y-0 flex items-center pl-2",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Header.js","sources":["../../../../src/components/Layout/GlobalHeader/Header.tsx"],"sourcesContent":[null],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Header.js","sources":["../../../../src/components/Layout/GlobalHeader/Header.tsx"],"sourcesContent":[null],"names":[],"mappings":"wYAOa,MAAA,YAAY,GAA2C,KAAC,IAAS;AAC1E,EAAA,MAAA;AACA,IAAA,KAAA;AAEA,IAAA,MAAM;IAEN,UAA0B;IAC1B,WAAM;AAGM,IAAA,SAAA;AACA,IAAA,QAAA;AACqB,IAAA;AAIjC,GAAA,GAAA,KAAK;AAA+B,EAAA,MAAA;AACpC,IAAA,QACI;AAuDR,IAAE;AAEF,GAAA,GAAA,KAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/Sidebar/Sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"Sidebar.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/Sidebar/Sidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAG7C,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAuM1C,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {jsxs,jsx}from'react/jsx-runtime';import React__default,{useState,useEffect}from'react';import {
|
|
1
|
+
import {jsxs,jsx}from'react/jsx-runtime';import React__default,{useState,useEffect}from'react';import {useTranslation}from'react-i18next';import BottomMenuDropDown from'../GlobalFooter/BottomMenuDropdown.js';import {getMenuSeparation}from'@admin-layout/client';import {Divider}from'./Divider.js';import {SidebarMenu}from'./SidebarMenu.js';import {RightContent}from'../GlobalHeader/RightContent.js';import {icons}from'../../../icons.js';import'@react-icons/all-files/fa/FaMoon.js';import'@react-icons/all-files/fa/FaSun.js';import'../../../hooks/use-get-current-lat-long.js';import {useMediaQuery}from'../../../hooks/useMediaQuery.js';const Sidebar = props => {
|
|
2
2
|
const {
|
|
3
3
|
isSideMenuOpen,
|
|
4
4
|
closeSideMenu,
|
|
@@ -14,10 +14,13 @@ import {jsxs,jsx}from'react/jsx-runtime';import React__default,{useState,useEffe
|
|
|
14
14
|
t,
|
|
15
15
|
i18n
|
|
16
16
|
} = useTranslation('menu');
|
|
17
|
+
const {
|
|
18
|
+
isMobile
|
|
19
|
+
} = useMediaQuery();
|
|
17
20
|
const {
|
|
18
21
|
OutlineDashIcon,
|
|
19
|
-
|
|
20
|
-
|
|
22
|
+
ChevronLeftIcon,
|
|
23
|
+
ChevronRightIcon
|
|
21
24
|
} = icons;
|
|
22
25
|
useEffect(() => {
|
|
23
26
|
if (!iconModule) {
|
|
@@ -78,23 +81,17 @@ import {jsxs,jsx}from'react/jsx-runtime';import React__default,{useState,useEffe
|
|
|
78
81
|
color: settings?.navTheme === 'realDark' ? '#fff' : ''
|
|
79
82
|
}), [settings]);
|
|
80
83
|
const renderSidebarContent = () => jsxs("div", {
|
|
81
|
-
className: "
|
|
84
|
+
className: " text-gray-500 dark:text-gray-400 relative",
|
|
82
85
|
style: SidebarStyles,
|
|
83
|
-
children: [
|
|
84
|
-
to: "/",
|
|
85
|
-
className: "ml-6 flex items-center gap-2.5 text-lg font-bold text-gray-800 dark:text-gray-200",
|
|
86
|
-
style: SidebarStyles,
|
|
87
|
-
children: [jsx("img", {
|
|
88
|
-
src: settings?.logo,
|
|
89
|
-
className: "w-[28px]"
|
|
90
|
-
}), !collapsed && jsx("span", {
|
|
91
|
-
children: settings?.title
|
|
92
|
-
})]
|
|
93
|
-
}), jsx("button", {
|
|
86
|
+
children: [jsx("button", {
|
|
94
87
|
onClick: toggleCollapsed,
|
|
95
|
-
className: "rounded-
|
|
88
|
+
className: "w-6 h-6 text-center bg-white text-gray-300 flex items-center justify-center rounded-full shadow-[0_2px_8px_-2px_rgba(0,0,0,0.05),0_1px_4px_-1px_rgba(25,15,15,0.07),0_0_1px_0_rgba(0,0,0,0.08)] hover:text-gray-600 hover:shadow-[0_4px_16px_-4px_rgba(0,0,0,0.05),0_2px_8px_-2px_rgba(25,15,15,0.07),0_1px_2px_0_rgba(0,0,0,0.08)] transition-colors text-[22px] absolute right-[-13px] top-[20px]",
|
|
96
89
|
"aria-label": collapsed ? 'Expand sidebar' : 'Collapse sidebar',
|
|
97
|
-
children: collapsed ? jsx(
|
|
90
|
+
children: collapsed ? jsx(ChevronRightIcon, {
|
|
91
|
+
fontSize: '11px'
|
|
92
|
+
}) : jsx(ChevronLeftIcon, {
|
|
93
|
+
fontSize: '11px'
|
|
94
|
+
})
|
|
98
95
|
}), jsxs("div", {
|
|
99
96
|
className: "min-h-[93vh]",
|
|
100
97
|
children: [jsxs("div", {
|
|
@@ -144,12 +141,15 @@ import {jsxs,jsx}from'react/jsx-runtime';import React__default,{useState,useEffe
|
|
|
144
141
|
settings: settings,
|
|
145
142
|
collapsed: collapsed
|
|
146
143
|
})
|
|
144
|
+
}), jsx("div", {
|
|
145
|
+
className: "p-4",
|
|
146
|
+
children: settings?.layout?.navigationMode === 'sidebar' && jsx(RightContent, {
|
|
147
|
+
upperMenus: getMenuSeparation(menuData).upperMenus,
|
|
148
|
+
collapsed: collapsed,
|
|
149
|
+
routeParams: routeParams,
|
|
150
|
+
settings: settings
|
|
151
|
+
})
|
|
147
152
|
})]
|
|
148
|
-
}), settings?.layout?.navigationMode === 'sidebar' && jsx(RightContent, {
|
|
149
|
-
upperMenus: getMenuSeparation(menuData).upperMenus,
|
|
150
|
-
collapsed: collapsed,
|
|
151
|
-
routeParams: routeParams,
|
|
152
|
-
settings: settings
|
|
153
153
|
}), jsx("div", {
|
|
154
154
|
className: "absolute bottom-0 left-0 p-4 dark:border-gray-700",
|
|
155
155
|
children: jsx(BottomMenuDropDown, {
|
|
@@ -160,16 +160,16 @@ import {jsxs,jsx}from'react/jsx-runtime';import React__default,{useState,useEffe
|
|
|
160
160
|
})]
|
|
161
161
|
});
|
|
162
162
|
return jsxs("div", {
|
|
163
|
-
children: [jsx("aside", {
|
|
164
|
-
className:
|
|
163
|
+
children: [!isMobile && jsx("aside", {
|
|
164
|
+
className: `${settings?.layout?.fixedSidebar ? 'fixed' : 'relative'} border-r border-gray-200 z-20 h-screen bg-white dark:bg-gray-800 md:block flex-shrink-0 transition-all duration-300 ease-in-out ${collapsed ? 'w-16' : 'w-64'}`,
|
|
165
165
|
style: SidebarStyles,
|
|
166
166
|
children: renderSidebarContent()
|
|
167
|
-
}), isSideMenuOpen && jsx("div", {
|
|
168
|
-
className: "fixed inset-0 z-10 flex items-end bg-black bg-opacity-50 sm:items-center sm:justify-center",
|
|
167
|
+
}), isSideMenuOpen && isMobile && jsx("div", {
|
|
168
|
+
className: "fixed inset-0 z-10 flex items-end bg-black bg-opacity-50 sm:items-center sm:justify-center transition-opacity duration-300",
|
|
169
169
|
onClick: closeSideMenu
|
|
170
|
-
}), isSideMenuOpen && jsx("aside", {
|
|
170
|
+
}), isSideMenuOpen && isMobile && jsx("aside", {
|
|
171
171
|
id: "mobile-sidebar",
|
|
172
|
-
className: `fixed inset-y-0 z-20 flex-shrink-0
|
|
172
|
+
className: `fixed inset-y-0 z-20 flex-shrink-0 mt-16 bg-white dark:bg-gray-800 md:hidden transition-transform duration-300 ease-in-out transform ${collapsed ? 'w-16' : 'w-64'}`,
|
|
173
173
|
style: SidebarStyles,
|
|
174
174
|
children: renderSidebarContent()
|
|
175
175
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Sidebar.js","sources":["../../../../src/components/Layout/Sidebar/Sidebar.tsx"],"sourcesContent":[null],"names":["React","_jsxs"
|
|
1
|
+
{"version":3,"file":"Sidebar.js","sources":["../../../../src/components/Layout/Sidebar/Sidebar.tsx"],"sourcesContent":[null],"names":["React","_jsxs"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SidebarMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/Sidebar/SidebarMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"SidebarMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/Layout/Sidebar/SidebarMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAKnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAEjD,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA2MlD,CAAC"}
|
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import {jsx,jsxs}from'react/jsx-runtime';import {useState}from'react';import {Link}from'@remix-run/react';import {generateMenuPath}from'@admin-layout/client';import {generateLightShade}from'../BasicLayout/utils.js';import {icons}from'../../../icons.js';const SidebarMenu = ({
|
|
1
|
+
import {jsx,jsxs}from'react/jsx-runtime';import {useState}from'react';import {useLocation,Link}from'@remix-run/react';import {generateMenuPath}from'@admin-layout/client';import {generateLightShade}from'../BasicLayout/utils.js';import {icons}from'../../../icons.js';const SidebarMenu = ({
|
|
2
2
|
menuData,
|
|
3
3
|
routeParams,
|
|
4
4
|
settings,
|
|
5
5
|
collapsed
|
|
6
6
|
}) => {
|
|
7
7
|
const [openMenusByLevel, setOpenMenusByLevel] = useState({});
|
|
8
|
-
const [activePath, setActivePath] = useState('/dashboard');
|
|
9
8
|
const [hoveredMenu, setHoveredMenu] = useState(null);
|
|
10
9
|
const [popupPosition, setPopupPosition] = useState({
|
|
11
10
|
top: 0,
|
|
@@ -13,8 +12,22 @@ import {jsx,jsxs}from'react/jsx-runtime';import {useState}from'react';import {Li
|
|
|
13
12
|
});
|
|
14
13
|
const {
|
|
15
14
|
ChevronDownIcon,
|
|
16
|
-
|
|
15
|
+
ChevronUpIcon
|
|
17
16
|
} = icons;
|
|
17
|
+
const location = useLocation();
|
|
18
|
+
const isMenuItemActive = itemPath => {
|
|
19
|
+
const currentPath = location.pathname;
|
|
20
|
+
const menuPath = generateMenuPath(itemPath, routeParams);
|
|
21
|
+
// Exact match
|
|
22
|
+
if (currentPath === menuPath) {
|
|
23
|
+
return true;
|
|
24
|
+
}
|
|
25
|
+
// Check if current path is a child of the menu item path
|
|
26
|
+
if (menuPath && currentPath.startsWith(menuPath + '/')) {
|
|
27
|
+
return true;
|
|
28
|
+
}
|
|
29
|
+
return false;
|
|
30
|
+
};
|
|
18
31
|
const toggleMenu = (path, depth, e) => {
|
|
19
32
|
e.preventDefault();
|
|
20
33
|
if (collapsed) return;
|
|
@@ -26,8 +39,6 @@ import {jsx,jsxs}from'react/jsx-runtime';import {useState}from'react';import {Li
|
|
|
26
39
|
const handleMenuClick = (path, hasChildren, depth, e) => {
|
|
27
40
|
if (hasChildren && !collapsed) {
|
|
28
41
|
toggleMenu(path, depth, e);
|
|
29
|
-
} else {
|
|
30
|
-
setActivePath(path);
|
|
31
42
|
}
|
|
32
43
|
};
|
|
33
44
|
const getFirstLetter = name => {
|
|
@@ -102,10 +113,13 @@ import {jsx,jsxs}from'react/jsx-runtime';import {useState}from'react';import {Li
|
|
|
102
113
|
const renderMenuItem = (item, depth = 0, isHoverMenu = false) => {
|
|
103
114
|
const hasChildren = item.children && item.children.length > 0;
|
|
104
115
|
const isOpen = openMenusByLevel[depth] === item.path;
|
|
105
|
-
const isActive =
|
|
116
|
+
const isActive = isMenuItemActive(item.path);
|
|
106
117
|
const isHovered = hoveredMenu === item.path;
|
|
107
118
|
const paddingLeft = `${depth * 1}rem`;
|
|
108
119
|
const bgColor = generateLightShade(settings?.primaryColor, 0.89);
|
|
120
|
+
// Determine styling based on whether it's a parent or child item
|
|
121
|
+
const isParentWithChildren = hasChildren && depth === 0;
|
|
122
|
+
const shouldApplyBackground = isActive && !isParentWithChildren || isHovered;
|
|
109
123
|
return jsxs("div", {
|
|
110
124
|
className: `w-full relative group ${isHovered && collapsed && !isHoverMenu ? `rounded-md` : ''}`,
|
|
111
125
|
style: {
|
|
@@ -118,15 +132,15 @@ import {jsx,jsxs}from'react/jsx-runtime';import {useState}from'react';import {Li
|
|
|
118
132
|
className: `flex items-center justify-between w-full px-1 py-2 hover:bg-gray-100 text-sm cursor-pointer transition-colors rounded-md mx-1 my-0.5 whitespace-nowrap overflow-hidden text-ellipsis`,
|
|
119
133
|
style: {
|
|
120
134
|
paddingLeft: `calc(1rem + ${paddingLeft})`,
|
|
121
|
-
backgroundColor:
|
|
135
|
+
backgroundColor: shouldApplyBackground ? bgColor : ''
|
|
122
136
|
},
|
|
123
137
|
onClick: e => handleMenuClick(item.path, hasChildren, depth, e),
|
|
124
138
|
children: [jsxs("div", {
|
|
125
139
|
className: `flex items-center ${collapsed && !isHoverMenu ? 'justify-center w-full' : 'gap-3'}`,
|
|
126
140
|
children: [item.icon ? jsx("span", {
|
|
127
|
-
className:
|
|
141
|
+
className: `flex-shrink-0`,
|
|
128
142
|
style: {
|
|
129
|
-
color: isActive
|
|
143
|
+
color: isActive ? settings?.primaryColor : ''
|
|
130
144
|
},
|
|
131
145
|
children: item.icon
|
|
132
146
|
}) : collapsed && !isHoverMenu ? jsx("span", {
|
|
@@ -147,9 +161,9 @@ import {jsx,jsxs}from'react/jsx-runtime';import {useState}from'react';import {Li
|
|
|
147
161
|
color: isActive ? settings?.primaryColor : ''
|
|
148
162
|
},
|
|
149
163
|
className: "flex-shrink-0 ml-1",
|
|
150
|
-
children: isOpen ? jsx(
|
|
164
|
+
children: isOpen ? jsx(ChevronUpIcon, {
|
|
151
165
|
className: "h-4 w-4"
|
|
152
|
-
}) : jsx(
|
|
166
|
+
}) : jsx(ChevronDownIcon, {
|
|
153
167
|
className: "h-4 w-4"
|
|
154
168
|
})
|
|
155
169
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SidebarMenu.js","sources":["../../../../src/components/Layout/Sidebar/SidebarMenu.tsx"],"sourcesContent":[null],"names":["
|
|
1
|
+
{"version":3,"file":"SidebarMenu.js","sources":["../../../../src/components/Layout/Sidebar/SidebarMenu.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":"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"}
|
package/lib/hooks/index.d.ts
CHANGED
package/lib/hooks/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,cAAc,oBAAoB,CAAC;AACnC,cAAc,4BAA4B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,cAAc,oBAAoB,CAAC;AACnC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,iBAAiB,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
interface MediaQueryResult {
|
|
2
|
+
width: number;
|
|
3
|
+
height: number;
|
|
4
|
+
isMobile: boolean;
|
|
5
|
+
xs: boolean;
|
|
6
|
+
sm: boolean;
|
|
7
|
+
md: boolean;
|
|
8
|
+
lg: boolean;
|
|
9
|
+
xl: boolean;
|
|
10
|
+
'2xl': boolean;
|
|
11
|
+
}
|
|
12
|
+
export declare const useMediaQuery: () => MediaQueryResult;
|
|
13
|
+
export {};
|
|
14
|
+
//# sourceMappingURL=useMediaQuery.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMediaQuery.d.ts","sourceRoot":"","sources":["../../src/hooks/useMediaQuery.ts"],"names":[],"mappings":"AAEA,UAAU,gBAAgB;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,EAAE,EAAE,OAAO,CAAC;IACZ,EAAE,EAAE,OAAO,CAAC;IACZ,EAAE,EAAE,OAAO,CAAC;IACZ,EAAE,EAAE,OAAO,CAAC;IACZ,EAAE,EAAE,OAAO,CAAC;IACZ,KAAK,EAAE,OAAO,CAAC;CAClB;AAoBD,eAAO,MAAM,aAAa,QAAO,gBAyChC,CAAC"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import {useState,useEffect}from'react';const breakpoints = {
|
|
2
|
+
xs: 0,
|
|
3
|
+
sm: 640,
|
|
4
|
+
md: 768,
|
|
5
|
+
lg: 1024,
|
|
6
|
+
xl: 1280,
|
|
7
|
+
'2xl': 1536
|
|
8
|
+
};
|
|
9
|
+
const getFlags = width => ({
|
|
10
|
+
xs: width < breakpoints.sm,
|
|
11
|
+
sm: width >= breakpoints.sm && width < breakpoints.md,
|
|
12
|
+
md: width >= breakpoints.md && width < breakpoints.lg,
|
|
13
|
+
lg: width >= breakpoints.lg && width < breakpoints.xl,
|
|
14
|
+
xl: width >= breakpoints.xl && width < breakpoints['2xl'],
|
|
15
|
+
'2xl': width >= breakpoints['2xl']
|
|
16
|
+
});
|
|
17
|
+
const useMediaQuery = () => {
|
|
18
|
+
const getDimensions = () => {
|
|
19
|
+
const width = window.innerWidth;
|
|
20
|
+
const height = window.innerHeight;
|
|
21
|
+
const isMobile = width < breakpoints.md;
|
|
22
|
+
const flags = getFlags(width);
|
|
23
|
+
return {
|
|
24
|
+
width,
|
|
25
|
+
height,
|
|
26
|
+
isMobile,
|
|
27
|
+
...flags
|
|
28
|
+
};
|
|
29
|
+
};
|
|
30
|
+
const [state, setState] = useState(() => typeof window !== 'undefined' ? getDimensions() : {
|
|
31
|
+
width: 0,
|
|
32
|
+
height: 0,
|
|
33
|
+
isMobile: false,
|
|
34
|
+
xs: false,
|
|
35
|
+
sm: false,
|
|
36
|
+
md: false,
|
|
37
|
+
lg: false,
|
|
38
|
+
xl: false,
|
|
39
|
+
'2xl': false
|
|
40
|
+
});
|
|
41
|
+
useEffect(() => {
|
|
42
|
+
const handleResize = () => {
|
|
43
|
+
setState(getDimensions());
|
|
44
|
+
};
|
|
45
|
+
window.addEventListener('resize', handleResize);
|
|
46
|
+
return () => window.removeEventListener('resize', handleResize);
|
|
47
|
+
}, []);
|
|
48
|
+
return state;
|
|
49
|
+
};export{useMediaQuery};//# sourceMappingURL=useMediaQuery.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useMediaQuery.js","sources":["../../src/hooks/useMediaQuery.ts"],"sourcesContent":[null],"names":[],"mappings":"uCAcA,MAAM,WAAW,GAAG;AAChB,EAAA,EAAA,EAAE;AACF,EAAA,EAAA,EAAE,GAAK;AACP,EAAA,EAAA,EAAE,GAAK;AACP,EAAA,EAAA,EAAE,IAAM;AACR,EAAA,EAAA,EAAE,IAAM;AACR,EAAA,KAAA,EAAK;CACR;AAED,MAAM,QAAQ,GAAG,UAA2E;AACxF,EAAA,EAAA,EAAE,KAAE,GAAQ,WAAA,CAAA,EAAY;IACxB,EAAE,KAAO,IAAA,WAAe,CAAA,EAAC,IAAE,KAAS,GAAA,WAAc,CAAA,EAAC;IACnD,EAAE,KAAO,IAAA,WAAe,CAAA,EAAC,IAAE,KAAS,GAAA,WAAc,CAAA,EAAC;IACnD,EAAE,KAAO,IAAA,WAAe,CAAA,EAAC,IAAE,KAAS,GAAA,WAAc,CAAA,EAAC;AACnD,EAAA,EAAA,EAAE,KAAE,IAAS,WAAA,CAAA,EAAY,IAAM,KAAA,GAAQ,WAAA,CAAA,KAAY,CAAA;AACnD,EAAA,KAAA,EAAK,KAAO,IAAA,WAAe,CAAA;AAC9B,CAAA,CAAC;AAEK,MAAM,aAAa,GAAG,MAAuB;QAC1C,aAAA,GAAgB,MAAK;AACvB,IAAA,MAAA,KAAW,GAAA,MAAS,CAAA;AACpB,IAAA,MAAA,MAAY,GAAA,MAAS,CAAA;AACrB,IAAA,MAAA,gBAAiB,GAAA,WAAmB,CAAA,EAAA;AACpC,IAAA,MAAA,gBAAc,CAAA,KAAS,CAAA;WAEhB;;YAEH;cACQ;AACR,MAAA,GAAA;;AAER,GAAA;AAEA,EAAA,MAAA,CAAA,KAAO,EAAK,QAAE,CAAA,GAAY,QAAA,CAAA,MAAgC,OAC/C,MAAA,gBAAsB,GAAA,aAAA,EAAA,GAAA;SACxB;AACD,IAAA,MAAE,EAAA,CAAA;AACI,IAAA,QAAA,EAAA,KAAO;AACP,IAAA,EAAA,EAAA,KAAA;AACA,IAAA,EAAA,EAAA,KAAA;AACA,IAAA,EAAA,EAAA,KAAA;AACA,IAAA,EAAA,EAAA,KAAA;AACA,IAAA,EAAA,EAAA,KAAA;AACA,IAAA,KAAA,EAAA;AACA,GAAA,CAAA;AACA,EAAA,SAAA,CAAA;AACH,IAAA,MACV,YAAC,GAAA,MAAA;MAEO,QAAC,cAAK,EAAA,CAAA;;AAEP,IAAA,MAAA,CAAA,gBAAS,CAAA,QAAe,EAAE,YAAA,CAAA;AAC9B,IAAA,OAAE,MAAA,MAAA,CAAA,mBAAA,CAAA,QAAA,EAAA,YAAA,CAAA;AAEF,GAAA,EAAA,EAAA,CAAA;SACO,KAAA;"}
|
package/lib/icons.d.ts
CHANGED
|
@@ -10,5 +10,7 @@ export declare const icons: {
|
|
|
10
10
|
CheckIcon: import("@react-icons/all-files/lib").IconType;
|
|
11
11
|
ChevronBackCircleIcon: import("@react-icons/all-files/lib").IconType;
|
|
12
12
|
ChevronForwardCircleIcon: import("@react-icons/all-files/lib").IconType;
|
|
13
|
+
ChevronUpIcon: import("@react-icons/all-files/lib").IconType;
|
|
14
|
+
ChevronLeftIcon: import("@react-icons/all-files/lib").IconType;
|
|
13
15
|
};
|
|
14
16
|
//# sourceMappingURL=icons.d.ts.map
|
package/lib/icons.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../src/icons.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../src/icons.ts"],"names":[],"mappings":"AAcA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;CAcjB,CAAC"}
|
package/lib/icons.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {FaSearch}from'@react-icons/all-files/fa/FaSearch.js';import {IoMenu}from'@react-icons/all-files/io5/IoMenu.js';import {AiOutlineDash}from'@react-icons/all-files/ai/AiOutlineDash.js';import {FaChevronDown}from'@react-icons/all-files/fa/FaChevronDown.js';import {FaChevronRight}from'@react-icons/all-files/fa/FaChevronRight.js';import {MdClose}from'@react-icons/all-files/md/MdClose.js';import {RiSettings5Fill}from'@react-icons/all-files/ri/RiSettings5Fill.js';import {IoMdCopy}from'@react-icons/all-files/io/IoMdCopy.js';import {FaCheck}from'@react-icons/all-files/fa/FaCheck.js';import {IoChevronBackCircleOutline}from'@react-icons/all-files/io5/IoChevronBackCircleOutline.js';import {IoChevronForwardCircleOutline}from'@react-icons/all-files/io5/IoChevronForwardCircleOutline.js';const icons = {
|
|
1
|
+
import {FaSearch}from'@react-icons/all-files/fa/FaSearch.js';import {IoMenu}from'@react-icons/all-files/io5/IoMenu.js';import {AiOutlineDash}from'@react-icons/all-files/ai/AiOutlineDash.js';import {FaChevronDown}from'@react-icons/all-files/fa/FaChevronDown.js';import {FaChevronUp}from'@react-icons/all-files/fa/FaChevronUp.js';import {FaChevronRight}from'@react-icons/all-files/fa/FaChevronRight.js';import {FaChevronLeft}from'@react-icons/all-files/fa/FaChevronLeft.js';import {MdClose}from'@react-icons/all-files/md/MdClose.js';import {RiSettings5Fill}from'@react-icons/all-files/ri/RiSettings5Fill.js';import {IoMdCopy}from'@react-icons/all-files/io/IoMdCopy.js';import {FaCheck}from'@react-icons/all-files/fa/FaCheck.js';import {IoChevronBackCircleOutline}from'@react-icons/all-files/io5/IoChevronBackCircleOutline.js';import {IoChevronForwardCircleOutline}from'@react-icons/all-files/io5/IoChevronForwardCircleOutline.js';const icons = {
|
|
2
2
|
SearchIcon: FaSearch,
|
|
3
3
|
ChevronDownIcon: FaChevronDown,
|
|
4
4
|
ChevronRightIcon: FaChevronRight,
|
|
@@ -9,5 +9,7 @@ import {FaSearch}from'@react-icons/all-files/fa/FaSearch.js';import {IoMenu}from
|
|
|
9
9
|
CopyIcon: IoMdCopy,
|
|
10
10
|
CheckIcon: FaCheck,
|
|
11
11
|
ChevronBackCircleIcon: IoChevronBackCircleOutline,
|
|
12
|
-
ChevronForwardCircleIcon: IoChevronForwardCircleOutline
|
|
12
|
+
ChevronForwardCircleIcon: IoChevronForwardCircleOutline,
|
|
13
|
+
ChevronUpIcon: FaChevronUp,
|
|
14
|
+
ChevronLeftIcon: FaChevronLeft
|
|
13
15
|
};export{icons};//# sourceMappingURL=icons.js.map
|
package/lib/icons.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icons.js","sources":["../src/icons.ts"],"sourcesContent":[null],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"icons.js","sources":["../src/icons.ts"],"sourcesContent":[null],"names":[],"mappings":"g6BAca,MAAA,KAAK,GAAG;sBACP;gCACK;kCACC;kBACR;gCACO;oBACN;oCACQ;oBACT;oBACC;mDACY;yDACG;4BACX;;"}
|
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.48",
|
|
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": "5dd0452bde63f03574b9f05b3934e4136cec46db",
|
|
62
62
|
"typescript": {
|
|
63
63
|
"definition": "lib/index.d.ts"
|
|
64
64
|
}
|