@shadow-library/ui 0.1.0 → 0.1.2
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/components/AppLayout/AppLayout.d.ts +9 -7
- package/components/AppLayout/AppLayout.js +28 -22
- package/components/AppLayout/AppLayout.js.map +1 -1
- package/components/AppLayout/AppLayout.module.css.js +4 -0
- package/components/AppLayout/AppLayout.module.css.js.map +1 -0
- package/components/AppLayout/ContentFooter.d.ts +3 -4
- package/components/AppLayout/ContentFooter.js +10 -15
- package/components/AppLayout/ContentFooter.js.map +1 -1
- package/components/AppLayout/SideNavbar.d.ts +8 -8
- package/components/AppLayout/SideNavbar.js +41 -17
- package/components/AppLayout/SideNavbar.js.map +1 -1
- package/components/AppLayout/SideNavbarGroup.d.ts +19 -0
- package/components/AppLayout/SideNavbarGroup.js +16 -0
- package/components/AppLayout/SideNavbarGroup.js.map +1 -0
- package/components/AppLayout/SideNavbarItem.d.ts +8 -3
- package/components/AppLayout/SideNavbarItem.js +71 -28
- package/components/AppLayout/SideNavbarItem.js.map +1 -1
- package/components/AppLayout/TopNavbar.d.ts +7 -3
- package/components/AppLayout/TopNavbar.js +37 -18
- package/components/AppLayout/TopNavbar.js.map +1 -1
- package/components/AppLayout/app-layout.utils.d.ts +14 -0
- package/components/AppLayout/app-layout.utils.js +6 -0
- package/components/AppLayout/app-layout.utils.js.map +1 -0
- package/components/AppLayout/hooks/use-active-nav-label.d.ts +2 -0
- package/components/AppLayout/hooks/use-active-nav-label.js +29 -0
- package/components/AppLayout/hooks/use-active-nav-label.js.map +1 -0
- package/components/AppLayout/hooks/use-layout-state.js +11 -13
- package/components/AppLayout/hooks/use-layout-state.js.map +1 -1
- package/components/AppLayout/hooks/use-side-navbar-item.d.ts +4 -4
- package/components/AppLayout/hooks/use-side-navbar-item.js +21 -32
- package/components/AppLayout/hooks/use-side-navbar-item.js.map +1 -1
- package/components/AppLayout/index.d.ts +1 -1
- package/components/AppLayout/layout.types.d.ts +9 -9
- package/components/Logo/Alphabets.d.ts +2 -7
- package/components/Logo/Alphabets.js +119 -31
- package/components/Logo/Alphabets.js.map +1 -1
- package/components/Logo/BrandMark.js +38 -16
- package/components/Logo/BrandMark.js.map +1 -1
- package/components/Logo/Logo.js +17 -13
- package/components/Logo/Logo.js.map +1 -1
- package/components/Logo/Logo.module.css.js +4 -0
- package/components/Logo/Logo.module.css.js.map +1 -0
- package/components/Logo/hooks/use-logo.js +13 -15
- package/components/Logo/hooks/use-logo.js.map +1 -1
- package/hooks/useSearchParams.js +16 -19
- package/hooks/useSearchParams.js.map +1 -1
- package/index.d.ts +6 -4
- package/index.js +10 -5
- package/index.js.map +1 -1
- package/lib/api-error.js +16 -20
- package/lib/api-error.js.map +1 -1
- package/lib/api-request.d.ts +2 -2
- package/lib/api-request.js +105 -117
- package/lib/api-request.js.map +1 -1
- package/lib/generate-api.js +193 -230
- package/lib/generate-api.js.map +1 -1
- package/lib/utils.js +5 -21
- package/lib/utils.js.map +1 -1
- package/package.json +22 -4
- package/styles/AppLayout.module.css +82 -0
- package/styles/Logo.module.css +51 -0
- package/styles.css +2 -0
- package/styles.css.map +1 -0
- package/styles.layer.css +4 -0
- package/theme.d.ts +6 -6
- package/theme.js +111 -114
- package/theme.js.map +1 -1
- package/types.d.ts +1 -0
- package/components/AppLayout/index.js +0 -3
- package/components/AppLayout/index.js.map +0 -1
- package/components/AppLayout/layout.types.js +0 -2
- package/components/AppLayout/layout.types.js.map +0 -1
- package/components/Logo/index.js +0 -3
- package/components/Logo/index.js.map +0 -1
- package/hooks/index.js +0 -2
- package/hooks/index.js.map +0 -1
- package/lib/index.js +0 -5
- package/lib/index.js.map +0 -1
- package/types.js +0 -5
- package/types.js.map +0 -1
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
/* AppLayout */
|
|
2
|
+
.main {
|
|
3
|
+
display: flex;
|
|
4
|
+
flex-direction: column;
|
|
5
|
+
min-height: 100dvh;
|
|
6
|
+
background: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-8));
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.mainContent {
|
|
10
|
+
flex: 1;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
/* SideNavbar - Logo Section */
|
|
14
|
+
.logoSection {
|
|
15
|
+
display: flex;
|
|
16
|
+
align-items: center;
|
|
17
|
+
justify-content: center;
|
|
18
|
+
min-height: 56px;
|
|
19
|
+
position: relative;
|
|
20
|
+
margin-bottom: 5px;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.logoSection::after {
|
|
24
|
+
content: '';
|
|
25
|
+
position: absolute;
|
|
26
|
+
bottom: 0;
|
|
27
|
+
left: 50%;
|
|
28
|
+
transform: translateX(-50%);
|
|
29
|
+
width: calc(100% - 20px);
|
|
30
|
+
height: 1px;
|
|
31
|
+
background: light-dark(var(--mantine-color-gray-2), var(--mantine-color-dark-5));
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
.brandIcon {
|
|
35
|
+
height: 40px;
|
|
36
|
+
width: 48px;
|
|
37
|
+
flex-shrink: 0;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
/* SideNavbar */
|
|
41
|
+
.navToggleSection {
|
|
42
|
+
border-top: 0.5px solid light-dark(var(--mantine-color-shadowSlate-1), var(--mantine-color-shadowSlate-7));
|
|
43
|
+
display: flex;
|
|
44
|
+
justify-content: flex-end;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.navToggleSectionCollapsed {
|
|
48
|
+
justify-content: center;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
/* SideNavbar - Group divider */
|
|
52
|
+
.navGroupDivider {
|
|
53
|
+
width: 80%;
|
|
54
|
+
align-self: center;
|
|
55
|
+
margin-block: 4px;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
/* SideNavbarItem */
|
|
59
|
+
.collapsedItem {
|
|
60
|
+
width: 100%;
|
|
61
|
+
border-radius: var(--mantine-radius-sm);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
.childNavLink {
|
|
65
|
+
--nl-color: light-dark(var(--mantine-color-dark-7), var(--mantine-color-dark-1));
|
|
66
|
+
|
|
67
|
+
&[data-active] {
|
|
68
|
+
font-weight: 600;
|
|
69
|
+
--nl-bg: transparent;
|
|
70
|
+
--nl-hover: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));
|
|
71
|
+
--nl-color: var(--mantine-primary-color-filled);
|
|
72
|
+
|
|
73
|
+
svg {
|
|
74
|
+
stroke-width: 3px;
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
/* ContentFooter */
|
|
80
|
+
.footer {
|
|
81
|
+
border-top: 1px solid light-dark(var(--mantine-color-gray-2), var(--mantine-color-dark-5));
|
|
82
|
+
}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
@keyframes glow-pulse {
|
|
2
|
+
0%,
|
|
3
|
+
100% {
|
|
4
|
+
filter: drop-shadow(0 0 4px var(--glow-color-low));
|
|
5
|
+
}
|
|
6
|
+
50% {
|
|
7
|
+
filter: drop-shadow(0 0 10px var(--glow-color-high));
|
|
8
|
+
}
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.logoRoot {
|
|
12
|
+
height: 100%;
|
|
13
|
+
width: 100%;
|
|
14
|
+
display: flex;
|
|
15
|
+
align-items: center;
|
|
16
|
+
justify-content: space-between;
|
|
17
|
+
gap: 4px;
|
|
18
|
+
|
|
19
|
+
svg {
|
|
20
|
+
height: 100%;
|
|
21
|
+
stroke-width: 50px;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
&.center {
|
|
25
|
+
justify-content: center;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.compactBrandContainer {
|
|
30
|
+
height: 100%;
|
|
31
|
+
padding: 4px;
|
|
32
|
+
border-radius: 6px;
|
|
33
|
+
backdrop-filter: blur(12px);
|
|
34
|
+
-webkit-backdrop-filter: blur(12px);
|
|
35
|
+
|
|
36
|
+
& > svg {
|
|
37
|
+
animation: glow-pulse 3s ease-in-out infinite;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
@media (prefers-reduced-motion: reduce) {
|
|
41
|
+
& > svg {
|
|
42
|
+
animation: none;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.divider {
|
|
48
|
+
height: 70%;
|
|
49
|
+
margin-top: auto;
|
|
50
|
+
margin-bottom: auto;
|
|
51
|
+
}
|
package/styles.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.AppLayout-module_main__NgNhZ{background:light-dark(var(--mantine-color-gray-0),var(--mantine-color-dark-8));display:flex;flex-direction:column;min-height:100dvh}.AppLayout-module_mainContent__gYUmE{flex:1}.AppLayout-module_logoSection__rOoy-{align-items:center;display:flex;justify-content:center;margin-bottom:5px;min-height:56px;position:relative}.AppLayout-module_logoSection__rOoy-:after{background:light-dark(var(--mantine-color-gray-2),var(--mantine-color-dark-5));bottom:0;content:"";height:1px;left:50%;position:absolute;transform:translateX(-50%);width:calc(100% - 20px)}.AppLayout-module_brandIcon__40dPn{flex-shrink:0;height:40px;width:48px}.AppLayout-module_navToggleSection__gaGZd{border-top:.5px solid light-dark(var(--mantine-color-shadowSlate-1),var(--mantine-color-shadowSlate-7));display:flex;justify-content:flex-end}.AppLayout-module_navToggleSectionCollapsed__K7Np2{justify-content:center}.AppLayout-module_navGroupDivider__q7CSz{align-self:center;margin-block:4px;width:80%}.AppLayout-module_collapsedItem__D3Jai{border-radius:var(--mantine-radius-sm);width:100%}.AppLayout-module_childNavLink__ppVJS{--nl-color:light-dark(var(--mantine-color-dark-7),var(--mantine-color-dark-1));&[data-active]{--nl-bg:transparent;--nl-hover:light-dark(var(--mantine-color-gray-0),var(--mantine-color-dark-6));--nl-color:var(--mantine-primary-color-filled);font-weight:600;svg{stroke-width:3px}}}.AppLayout-module_footer__GpgvI{border-top:1px solid light-dark(var(--mantine-color-gray-2),var(--mantine-color-dark-5))}@keyframes Logo-module_glow-pulse__ZUY3J{0%,to{filter:drop-shadow(0 0 4px var(--glow-color-low))}50%{filter:drop-shadow(0 0 10px var(--glow-color-high))}}.Logo-module_logoRoot__Ib9Mx{align-items:center;display:flex;gap:4px;height:100%;justify-content:space-between;width:100%;svg{stroke-width:50px;height:100%}&.Logo-module_center__hduz-{justify-content:center}}.Logo-module_compactBrandContainer__MGhZQ{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:6px;height:100%;padding:4px;&>svg{animation:Logo-module_glow-pulse__ZUY3J 3s ease-in-out infinite}@media (prefers-reduced-motion:reduce){&>svg{animation:none}}}.Logo-module_divider__CCRn7{height:70%;margin-bottom:auto;margin-top:auto}
|
|
2
|
+
/*# sourceMappingURL=styles.css.map */
|
package/styles.css.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["AppLayout.module.css","Logo.module.css"],"names":[],"mappings":"AACA,8BAIE,8EAAgF,CAHhF,YAAa,CACb,qBAAsB,CACtB,iBAEF,CAEA,qCACE,MACF,CAGA,qCAEE,kBAAmB,CADnB,YAAa,CAEb,sBAAuB,CAGvB,iBAAkB,CAFlB,eAAgB,CAChB,iBAEF,CAEA,2CAQE,8EAAgF,CALhF,QAAS,CAFT,UAAW,CAMX,UAAW,CAHX,QAAS,CAFT,iBAAkB,CAGlB,0BAA2B,CAC3B,uBAGF,CAEA,mCAGE,aAAc,CAFd,WAAY,CACZ,UAEF,CAGA,0CACE,uGAA0G,CAC1G,YAAa,CACb,wBACF,CAEA,mDACE,sBACF,CAGA,yCAEE,iBAAkB,CAClB,gBAAiB,CAFjB,SAGF,CAGA,uCAEE,sCAAuC,CADvC,UAEF,CAEA,sCACE,8EAAgF,CAEhF,eAEE,mBAAoB,CACpB,8EAAgF,CAChF,8CAA+C,CAH/C,eAAgB,CAKhB,IACE,gBACF,CACF,CACF,CAGA,gCACE,wFACF,CCjFA,yCACE,MAEE,iDACF,CACA,IACE,mDACF,CACF,CAEA,6BAIE,kBAAmB,CADnB,YAAa,CAGb,OAAQ,CALR,WAAY,CAIZ,6BAA8B,CAH9B,UAAW,CAMX,IAEE,iBAAkB,CADlB,WAEF,CAEA,4BACE,sBACF,CACF,CAEA,0CAIE,0BAA2B,CAC3B,kCAAmC,CAFnC,iBAAkB,CAFlB,WAAY,CACZ,WAAY,CAKZ,MACE,+DACF,CAEA,uCACE,MACE,cACF,CACF,CACF,CAEA,4BACE,UAAW,CAEX,kBAAmB,CADnB,eAEF","file":"styles.css","sourcesContent":["/* AppLayout */\n.main {\n display: flex;\n flex-direction: column;\n min-height: 100dvh;\n background: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-8));\n}\n\n.mainContent {\n flex: 1;\n}\n\n/* SideNavbar - Logo Section */\n.logoSection {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 56px;\n position: relative;\n margin-bottom: 5px;\n}\n\n.logoSection::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n width: calc(100% - 20px);\n height: 1px;\n background: light-dark(var(--mantine-color-gray-2), var(--mantine-color-dark-5));\n}\n\n.brandIcon {\n height: 40px;\n width: 48px;\n flex-shrink: 0;\n}\n\n/* SideNavbar */\n.navToggleSection {\n border-top: 0.5px solid light-dark(var(--mantine-color-shadowSlate-1), var(--mantine-color-shadowSlate-7));\n display: flex;\n justify-content: flex-end;\n}\n\n.navToggleSectionCollapsed {\n justify-content: center;\n}\n\n/* SideNavbar - Group divider */\n.navGroupDivider {\n width: 80%;\n align-self: center;\n margin-block: 4px;\n}\n\n/* SideNavbarItem */\n.collapsedItem {\n width: 100%;\n border-radius: var(--mantine-radius-sm);\n}\n\n.childNavLink {\n --nl-color: light-dark(var(--mantine-color-dark-7), var(--mantine-color-dark-1));\n\n &[data-active] {\n font-weight: 600;\n --nl-bg: transparent;\n --nl-hover: light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-6));\n --nl-color: var(--mantine-primary-color-filled);\n\n svg {\n stroke-width: 3px;\n }\n }\n}\n\n/* ContentFooter */\n.footer {\n border-top: 1px solid light-dark(var(--mantine-color-gray-2), var(--mantine-color-dark-5));\n}\n","@keyframes glow-pulse {\n 0%,\n 100% {\n filter: drop-shadow(0 0 4px var(--glow-color-low));\n }\n 50% {\n filter: drop-shadow(0 0 10px var(--glow-color-high));\n }\n}\n\n.logoRoot {\n height: 100%;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 4px;\n\n svg {\n height: 100%;\n stroke-width: 50px;\n }\n\n &.center {\n justify-content: center;\n }\n}\n\n.compactBrandContainer {\n height: 100%;\n padding: 4px;\n border-radius: 6px;\n backdrop-filter: blur(12px);\n -webkit-backdrop-filter: blur(12px);\n\n & > svg {\n animation: glow-pulse 3s ease-in-out infinite;\n }\n\n @media (prefers-reduced-motion: reduce) {\n & > svg {\n animation: none;\n }\n }\n}\n\n.divider {\n height: 70%;\n margin-top: auto;\n margin-bottom: auto;\n}\n"]}
|
package/styles.layer.css
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
@layer shadow-library {
|
|
2
|
+
.AppLayout-module_main__NgNhZ{background:light-dark(var(--mantine-color-gray-0),var(--mantine-color-dark-8));display:flex;flex-direction:column;min-height:100dvh}.AppLayout-module_mainContent__gYUmE{flex:1}.AppLayout-module_logoSection__rOoy-{align-items:center;display:flex;justify-content:center;margin-bottom:5px;min-height:56px;position:relative}.AppLayout-module_logoSection__rOoy-:after{background:light-dark(var(--mantine-color-gray-2),var(--mantine-color-dark-5));bottom:0;content:"";height:1px;left:50%;position:absolute;transform:translateX(-50%);width:calc(100% - 20px)}.AppLayout-module_brandIcon__40dPn{flex-shrink:0;height:40px;width:48px}.AppLayout-module_navToggleSection__gaGZd{border-top:.5px solid light-dark(var(--mantine-color-shadowSlate-1),var(--mantine-color-shadowSlate-7));display:flex;justify-content:flex-end}.AppLayout-module_navToggleSectionCollapsed__K7Np2{justify-content:center}.AppLayout-module_navGroupDivider__q7CSz{align-self:center;margin-block:4px;width:80%}.AppLayout-module_collapsedItem__D3Jai{border-radius:var(--mantine-radius-sm);width:100%}.AppLayout-module_childNavLink__ppVJS{--nl-color:light-dark(var(--mantine-color-dark-7),var(--mantine-color-dark-1));&[data-active]{--nl-bg:transparent;--nl-hover:light-dark(var(--mantine-color-gray-0),var(--mantine-color-dark-6));--nl-color:var(--mantine-primary-color-filled);font-weight:600;svg{stroke-width:3px}}}.AppLayout-module_footer__GpgvI{border-top:1px solid light-dark(var(--mantine-color-gray-2),var(--mantine-color-dark-5))}@keyframes Logo-module_glow-pulse__ZUY3J{0%,to{filter:drop-shadow(0 0 4px var(--glow-color-low))}50%{filter:drop-shadow(0 0 10px var(--glow-color-high))}}.Logo-module_logoRoot__Ib9Mx{align-items:center;display:flex;gap:4px;height:100%;justify-content:space-between;width:100%;svg{stroke-width:50px;height:100%}&.Logo-module_center__hduz-{justify-content:center}}.Logo-module_compactBrandContainer__MGhZQ{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:6px;height:100%;padding:4px;&>svg{animation:Logo-module_glow-pulse__ZUY3J 3s ease-in-out infinite}@media (prefers-reduced-motion:reduce){&>svg{animation:none}}}.Logo-module_divider__CCRn7{height:70%;margin-bottom:auto;margin-top:auto}
|
|
3
|
+
/*# sourceMappingURL=styles.css.map */
|
|
4
|
+
}
|
package/theme.d.ts
CHANGED
|
@@ -88,53 +88,53 @@ export declare const shadowTheme: {
|
|
|
88
88
|
} | undefined;
|
|
89
89
|
radius?: {
|
|
90
90
|
[x: string & {}]: string | undefined;
|
|
91
|
+
xl?: string | undefined;
|
|
91
92
|
xs?: string | undefined;
|
|
92
93
|
sm?: string | undefined;
|
|
93
94
|
md?: string | undefined;
|
|
94
95
|
lg?: string | undefined;
|
|
95
|
-
xl?: string | undefined;
|
|
96
96
|
} | undefined;
|
|
97
97
|
defaultRadius?: import("@mantine/core").MantineRadius | undefined;
|
|
98
98
|
spacing?: {
|
|
99
99
|
[x: number]: string | undefined;
|
|
100
100
|
[x: string & {}]: string | undefined;
|
|
101
|
+
xl?: string | undefined;
|
|
101
102
|
xs?: string | undefined;
|
|
102
103
|
sm?: string | undefined;
|
|
103
104
|
md?: string | undefined;
|
|
104
105
|
lg?: string | undefined;
|
|
105
|
-
xl?: string | undefined;
|
|
106
106
|
} | undefined;
|
|
107
107
|
fontSizes?: {
|
|
108
108
|
[x: string & {}]: string | undefined;
|
|
109
|
+
xl?: string | undefined;
|
|
109
110
|
xs?: string | undefined;
|
|
110
111
|
sm?: string | undefined;
|
|
111
112
|
md?: string | undefined;
|
|
112
113
|
lg?: string | undefined;
|
|
113
|
-
xl?: string | undefined;
|
|
114
114
|
} | undefined;
|
|
115
115
|
lineHeights?: {
|
|
116
116
|
[x: string & {}]: string | undefined;
|
|
117
|
+
xl?: string | undefined;
|
|
117
118
|
xs?: string | undefined;
|
|
118
119
|
sm?: string | undefined;
|
|
119
120
|
md?: string | undefined;
|
|
120
121
|
lg?: string | undefined;
|
|
121
|
-
xl?: string | undefined;
|
|
122
122
|
} | undefined;
|
|
123
123
|
breakpoints?: {
|
|
124
124
|
[x: string & {}]: string | undefined;
|
|
125
|
+
xl?: string | undefined;
|
|
125
126
|
xs?: string | undefined;
|
|
126
127
|
sm?: string | undefined;
|
|
127
128
|
md?: string | undefined;
|
|
128
129
|
lg?: string | undefined;
|
|
129
|
-
xl?: string | undefined;
|
|
130
130
|
} | undefined;
|
|
131
131
|
shadows?: {
|
|
132
132
|
[x: string & {}]: string | undefined;
|
|
133
|
+
xl?: string | undefined;
|
|
133
134
|
xs?: string | undefined;
|
|
134
135
|
sm?: string | undefined;
|
|
135
136
|
md?: string | undefined;
|
|
136
137
|
lg?: string | undefined;
|
|
137
|
-
xl?: string | undefined;
|
|
138
138
|
} | undefined;
|
|
139
139
|
respectReducedMotion?: boolean | undefined;
|
|
140
140
|
cursorType?: "default" | "pointer" | undefined;
|
package/theme.js
CHANGED
|
@@ -1,115 +1,112 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
},
|
|
110
|
-
}),
|
|
111
|
-
},
|
|
112
|
-
cursorType: 'pointer',
|
|
113
|
-
focusRing: 'auto',
|
|
1
|
+
import { createTheme, Table, ActionIcon, Tooltip, Modal, Paper, Badge, Card } from '@mantine/core';
|
|
2
|
+
|
|
3
|
+
const cyan = ["#e8fffe", "#c0f9f7", "#85f0ec", "#40e3dd", "#12d4cc", "#00bfb8", "#009e98", "#007d78", "#005e5a", "#003e3b"];
|
|
4
|
+
const slate = ["#f5f6f8", "#e5e8ed", "#c8cdd6", "#a2aab6", "#788596", "#546070", "#3a4555", "#253040", "#141e2e", "#0c1220"];
|
|
5
|
+
const terracotta = ["#f9e5dd", "#f2cbbb", "#ecb09a", "#e59678", "#df7c56", "#b26345", "#864a34", "#593223", "#2c1911", "#160c09"];
|
|
6
|
+
const shadowTheme = createTheme({
|
|
7
|
+
colors: { cyan, slate, terracotta },
|
|
8
|
+
primaryColor: "cyan",
|
|
9
|
+
primaryShade: { light: 6, dark: 5 },
|
|
10
|
+
autoContrast: true,
|
|
11
|
+
fontFamily: 'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
|
|
12
|
+
fontFamilyMonospace: '"JetBrains Mono", "Fira Code", "Cascadia Code", monospace',
|
|
13
|
+
fontSizes: {
|
|
14
|
+
xs: "11px",
|
|
15
|
+
sm: "13px",
|
|
16
|
+
md: "14px",
|
|
17
|
+
lg: "16px",
|
|
18
|
+
xl: "18px"
|
|
19
|
+
},
|
|
20
|
+
lineHeights: {
|
|
21
|
+
xs: "1.4",
|
|
22
|
+
sm: "1.5",
|
|
23
|
+
md: "1.7",
|
|
24
|
+
lg: "1.8",
|
|
25
|
+
xl: "1.9"
|
|
26
|
+
},
|
|
27
|
+
headings: {
|
|
28
|
+
fontFamily: "Inter, -apple-system, BlinkMacSystemFont, sans-serif",
|
|
29
|
+
fontWeight: "500",
|
|
30
|
+
sizes: {
|
|
31
|
+
h1: { fontSize: "28px", lineHeight: "1.3" },
|
|
32
|
+
h2: { fontSize: "22px", lineHeight: "1.35" },
|
|
33
|
+
h3: { fontSize: "18px", lineHeight: "1.4" },
|
|
34
|
+
h4: { fontSize: "16px", lineHeight: "1.45" },
|
|
35
|
+
h5: { fontSize: "14px", lineHeight: "1.5" },
|
|
36
|
+
h6: { fontSize: "13px", lineHeight: "1.5" }
|
|
37
|
+
}
|
|
38
|
+
},
|
|
39
|
+
defaultRadius: "sm",
|
|
40
|
+
radius: {
|
|
41
|
+
xs: "2px",
|
|
42
|
+
sm: "3px",
|
|
43
|
+
md: "4px",
|
|
44
|
+
lg: "6px",
|
|
45
|
+
xl: "8px"
|
|
46
|
+
},
|
|
47
|
+
spacing: {
|
|
48
|
+
xs: "4px",
|
|
49
|
+
sm: "8px",
|
|
50
|
+
md: "12px",
|
|
51
|
+
lg: "16px",
|
|
52
|
+
xl: "24px"
|
|
53
|
+
},
|
|
54
|
+
shadows: {
|
|
55
|
+
xs: "0 1px 2px rgba(0, 0, 0, 0.08)",
|
|
56
|
+
sm: "0 2px 6px rgba(0, 0, 0, 0.10)",
|
|
57
|
+
md: "0 4px 12px rgba(0, 0, 0, 0.12)",
|
|
58
|
+
lg: "0 8px 24px rgba(0, 0, 0, 0.14)",
|
|
59
|
+
xl: "0 16px 40px rgba(0, 0, 0, 0.16)"
|
|
60
|
+
},
|
|
61
|
+
components: {
|
|
62
|
+
Card: Card.extend({
|
|
63
|
+
defaultProps: {
|
|
64
|
+
radius: "md",
|
|
65
|
+
padding: "lg"
|
|
66
|
+
},
|
|
67
|
+
styles: {
|
|
68
|
+
root: {
|
|
69
|
+
border: `0.5px solid light-dark(${slate[1]}, ${slate[7]})`
|
|
70
|
+
}
|
|
71
|
+
}
|
|
72
|
+
}),
|
|
73
|
+
Badge: Badge.extend({
|
|
74
|
+
defaultProps: {
|
|
75
|
+
variant: "light"
|
|
76
|
+
}
|
|
77
|
+
}),
|
|
78
|
+
Paper: Paper.extend({
|
|
79
|
+
defaultProps: {
|
|
80
|
+
radius: "md"
|
|
81
|
+
}
|
|
82
|
+
}),
|
|
83
|
+
Modal: Modal.extend({
|
|
84
|
+
defaultProps: {
|
|
85
|
+
radius: "md",
|
|
86
|
+
centered: true
|
|
87
|
+
}
|
|
88
|
+
}),
|
|
89
|
+
Tooltip: Tooltip.extend({
|
|
90
|
+
defaultProps: {
|
|
91
|
+
radius: "xs"
|
|
92
|
+
}
|
|
93
|
+
}),
|
|
94
|
+
ActionIcon: ActionIcon.extend({
|
|
95
|
+
defaultProps: {
|
|
96
|
+
variant: "subtle"
|
|
97
|
+
}
|
|
98
|
+
}),
|
|
99
|
+
Table: Table.extend({
|
|
100
|
+
defaultProps: {
|
|
101
|
+
striped: false,
|
|
102
|
+
highlightOnHover: true,
|
|
103
|
+
withColumnBorders: false
|
|
104
|
+
}
|
|
105
|
+
})
|
|
106
|
+
},
|
|
107
|
+
cursorType: "pointer",
|
|
108
|
+
focusRing: "auto"
|
|
114
109
|
});
|
|
115
|
-
|
|
110
|
+
|
|
111
|
+
export { shadowTheme };
|
|
112
|
+
//# sourceMappingURL=theme.js.map
|
package/theme.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.js","
|
|
1
|
+
{"version":3,"file":"theme.js","sources":["../src/theme.ts"],"sourcesContent":["/**\n * Importing npm packages\n */\nimport { ActionIcon, Badge, Card, createTheme, type DefaultMantineColor, type MantineColorsTuple, Modal, Paper, Table, Tooltip } from '@mantine/core';\n\n/**\n * Importing user defined packages\n */\n\n/**\n * Defining types\n */\n\ntype ShadowColors = 'cyan' | 'slate' | 'terracotta';\n\ndeclare module '@mantine/core' {\n export interface MantineThemeColorsOverride {\n colors: Record<ShadowColors | DefaultMantineColor, MantineColorsTuple>;\n }\n}\n\n/**\n * Declaring the constants\n */\n\nconst cyan: MantineColorsTuple = ['#e8fffe', '#c0f9f7', '#85f0ec', '#40e3dd', '#12d4cc', '#00bfb8', '#009e98', '#007d78', '#005e5a', '#003e3b'];\nconst slate: MantineColorsTuple = ['#f5f6f8', '#e5e8ed', '#c8cdd6', '#a2aab6', '#788596', '#546070', '#3a4555', '#253040', '#141e2e', '#0c1220'];\nconst terracotta: MantineColorsTuple = ['#f9e5dd', '#f2cbbb', '#ecb09a', '#e59678', '#df7c56', '#b26345', '#864a34', '#593223', '#2c1911', '#160c09'];\n\nexport const shadowTheme = createTheme({\n colors: { cyan, slate, terracotta },\n primaryColor: 'cyan',\n primaryShade: { light: 6, dark: 5 },\n autoContrast: true,\n\n fontFamily: 'Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif',\n fontFamilyMonospace: '\"JetBrains Mono\", \"Fira Code\", \"Cascadia Code\", monospace',\n fontSizes: {\n xs: '11px',\n sm: '13px',\n md: '14px',\n lg: '16px',\n xl: '18px',\n },\n lineHeights: {\n xs: '1.4',\n sm: '1.5',\n md: '1.7',\n lg: '1.8',\n xl: '1.9',\n },\n headings: {\n fontFamily: 'Inter, -apple-system, BlinkMacSystemFont, sans-serif',\n fontWeight: '500',\n sizes: {\n h1: { fontSize: '28px', lineHeight: '1.3' },\n h2: { fontSize: '22px', lineHeight: '1.35' },\n h3: { fontSize: '18px', lineHeight: '1.4' },\n h4: { fontSize: '16px', lineHeight: '1.45' },\n h5: { fontSize: '14px', lineHeight: '1.5' },\n h6: { fontSize: '13px', lineHeight: '1.5' },\n },\n },\n\n defaultRadius: 'sm',\n radius: {\n xs: '2px',\n sm: '3px',\n md: '4px',\n lg: '6px',\n xl: '8px',\n },\n\n spacing: {\n xs: '4px',\n sm: '8px',\n md: '12px',\n lg: '16px',\n xl: '24px',\n },\n\n shadows: {\n xs: '0 1px 2px rgba(0, 0, 0, 0.08)',\n sm: '0 2px 6px rgba(0, 0, 0, 0.10)',\n md: '0 4px 12px rgba(0, 0, 0, 0.12)',\n lg: '0 8px 24px rgba(0, 0, 0, 0.14)',\n xl: '0 16px 40px rgba(0, 0, 0, 0.16)',\n },\n\n components: {\n Card: Card.extend({\n defaultProps: {\n radius: 'md',\n padding: 'lg',\n },\n styles: {\n root: {\n border: `0.5px solid light-dark(${slate[1]}, ${slate[7]})`,\n },\n },\n }),\n\n Badge: Badge.extend({\n defaultProps: {\n variant: 'light',\n },\n }),\n\n Paper: Paper.extend({\n defaultProps: {\n radius: 'md',\n },\n }),\n\n Modal: Modal.extend({\n defaultProps: {\n radius: 'md',\n centered: true,\n },\n }),\n\n Tooltip: Tooltip.extend({\n defaultProps: {\n radius: 'xs',\n },\n }),\n\n ActionIcon: ActionIcon.extend({\n defaultProps: {\n variant: 'subtle',\n },\n }),\n\n Table: Table.extend({\n defaultProps: {\n striped: false,\n highlightOnHover: true,\n withColumnBorders: false,\n },\n }),\n },\n\n cursorType: 'pointer',\n focusRing: 'auto',\n});\n\nexport type ShadowTheme = typeof shadowTheme;\n"],"names":[],"mappings":"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"}
|
package/types.d.ts
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AppLayout/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"layout.types.js","sourceRoot":"","sources":["../../../src/components/AppLayout/layout.types.ts"],"names":[],"mappings":""}
|
package/components/Logo/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Logo/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC"}
|
package/hooks/index.js
DELETED
package/hooks/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}
|
package/lib/index.js
DELETED
package/lib/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC"}
|
package/types.js
DELETED
package/types.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA;;GAEG"}
|