@local-civics/mgmt-ui 0.1.74 → 0.1.75
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/dist/index.d.ts +7 -23
- package/dist/index.js +11 -68
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +14 -70
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -5,22 +5,6 @@ import * as React from 'react';
|
|
|
5
5
|
* NavbarProps
|
|
6
6
|
*/
|
|
7
7
|
interface NavbarProps {
|
|
8
|
-
active: string;
|
|
9
|
-
navigate: (to: string) => void;
|
|
10
|
-
onLogout: () => void;
|
|
11
|
-
onSwitchAccounts?: () => void;
|
|
12
|
-
}
|
|
13
|
-
/**
|
|
14
|
-
* Navbar
|
|
15
|
-
* @param props
|
|
16
|
-
* @constructor
|
|
17
|
-
*/
|
|
18
|
-
declare const Navbar: (props: NavbarProps) => JSX.Element;
|
|
19
|
-
|
|
20
|
-
/**
|
|
21
|
-
* NavbarProps
|
|
22
|
-
*/
|
|
23
|
-
interface NestedNavbarProps {
|
|
24
8
|
active: string;
|
|
25
9
|
version: string;
|
|
26
10
|
image: string;
|
|
@@ -35,7 +19,7 @@ interface NestedNavbarProps {
|
|
|
35
19
|
onLogout: () => void;
|
|
36
20
|
onSwitchAccounts?: () => void;
|
|
37
21
|
}
|
|
38
|
-
declare function
|
|
22
|
+
declare function Navbar(props: NavbarProps): JSX.Element;
|
|
39
23
|
|
|
40
24
|
/**
|
|
41
25
|
* AccountItem
|
|
@@ -656,12 +640,12 @@ declare const AdminProvider: (props: AdminProviderProps) => JSX.Element;
|
|
|
656
640
|
* AppProps
|
|
657
641
|
*/
|
|
658
642
|
type AppProps = {
|
|
659
|
-
loading
|
|
660
|
-
account
|
|
661
|
-
accounts
|
|
662
|
-
navbar
|
|
643
|
+
loading?: boolean;
|
|
644
|
+
account?: string;
|
|
645
|
+
accounts?: AccountItem[];
|
|
646
|
+
navbar?: React.ReactElement<NavbarProps>;
|
|
663
647
|
page: React.ReactNode;
|
|
664
|
-
onAccountChange
|
|
648
|
+
onAccountChange?: (account: string) => Promise<void>;
|
|
665
649
|
};
|
|
666
650
|
/**
|
|
667
651
|
* App
|
|
@@ -670,4 +654,4 @@ type AppProps = {
|
|
|
670
654
|
*/
|
|
671
655
|
declare const App: (props: AppProps) => JSX.Element;
|
|
672
656
|
|
|
673
|
-
export { AccountItem, AdminProvider, AdminProviderProps, App, AppProps, Badge, BadgeClass, BadgeItem, BadgeProps, BadgeUserItem, Badges, BadgesProps, Class, ClassItem, ClassProps, Classes, ClassesProps, Dashboard, DashboardClass, DashboardProps, Home, HomeProps, Lesson, LessonClass, LessonItem, LessonProps, LessonUserItem, Lessons, LessonsProps, MemberItem, Navbar, NavbarProps,
|
|
657
|
+
export { AccountItem, AdminProvider, AdminProviderProps, App, AppProps, Badge, BadgeClass, BadgeItem, BadgeProps, BadgeUserItem, Badges, BadgesProps, Class, ClassItem, ClassProps, Classes, ClassesProps, Dashboard, DashboardClass, DashboardProps, Home, HomeProps, Lesson, LessonClass, LessonItem, LessonProps, LessonUserItem, Lessons, LessonsProps, MemberItem, Navbar, NavbarProps, Organization, OrganizationProps, People, PeopleProps, StartAnonymousLesson, StartAnonymousLessonProps, Student, StudentProps, SwitchAccount, SwitchAccountProps, TrialHome, TrialHomeProps, TrialRegistration, TrialRegistrationProps, UserItem };
|
package/dist/index.js
CHANGED
|
@@ -34,65 +34,6 @@ function _interopNamespaceDefault(e) {
|
|
|
34
34
|
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
35
35
|
var papa__namespace = /*#__PURE__*/_interopNamespaceDefault(papa);
|
|
36
36
|
|
|
37
|
-
const useStyles$p = core.createStyles((theme) => ({
|
|
38
|
-
link: {
|
|
39
|
-
width: 50,
|
|
40
|
-
height: 50,
|
|
41
|
-
borderRadius: theme.radius.md,
|
|
42
|
-
display: "flex",
|
|
43
|
-
alignItems: "center",
|
|
44
|
-
justifyContent: "center",
|
|
45
|
-
color: theme.colorScheme === "dark" ? theme.colors.dark[0] : theme.colors.gray[7],
|
|
46
|
-
"&:hover": {
|
|
47
|
-
backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[0]
|
|
48
|
-
}
|
|
49
|
-
},
|
|
50
|
-
active: {
|
|
51
|
-
"&, &:hover": {
|
|
52
|
-
backgroundColor: theme.fn.variant({ variant: "light", color: theme.primaryColor }).background,
|
|
53
|
-
color: theme.fn.variant({ variant: "light", color: theme.primaryColor }).color
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
}));
|
|
57
|
-
const data$1 = [
|
|
58
|
-
{ icon: icons.IconHome2, label: "Home", href: "/home" },
|
|
59
|
-
{ icon: icons.IconGauge, label: "Dashboard", href: "/dashboard" },
|
|
60
|
-
{ icon: icons.IconCategory2, label: "Classes", href: "/classes" },
|
|
61
|
-
{ icon: icons.IconAlbum, label: "Badges", href: "/badges" },
|
|
62
|
-
{ icon: icons.IconLambda, label: "Lessons", href: "/lessons" }
|
|
63
|
-
];
|
|
64
|
-
const NavbarLink = ({ icon: Icon, label, active, onClick }) => {
|
|
65
|
-
const { classes, cx } = useStyles$p();
|
|
66
|
-
return /* @__PURE__ */ React__namespace.createElement(core.Tooltip, { label, position: "right", transitionDuration: 0 }, /* @__PURE__ */ React__namespace.createElement(core.UnstyledButton, { onClick, className: cx(classes.link, { [classes.active]: active }) }, /* @__PURE__ */ React__namespace.createElement(Icon, { stroke: 1.5 })));
|
|
67
|
-
};
|
|
68
|
-
const Navbar = (props) => {
|
|
69
|
-
const links = data$1.map((link) => /* @__PURE__ */ React__namespace.createElement(
|
|
70
|
-
NavbarLink,
|
|
71
|
-
{
|
|
72
|
-
key: link.label,
|
|
73
|
-
label: link.label,
|
|
74
|
-
icon: link.icon,
|
|
75
|
-
active: link.label === props.active,
|
|
76
|
-
onClick: () => props.navigate(link.href)
|
|
77
|
-
}
|
|
78
|
-
));
|
|
79
|
-
return /* @__PURE__ */ React__namespace.createElement(core.Navbar, { width: { base: 80 }, p: "md" }, /* @__PURE__ */ React__namespace.createElement(core.Center, null, /* @__PURE__ */ React__namespace.createElement(core.Avatar, { color: "blue", radius: "sm" }, /* @__PURE__ */ React__namespace.createElement("div", { style: { width: 15, marginLeft: "auto", marginRight: "auto" } }, /* @__PURE__ */ React__namespace.createElement(core.Image, { fit: "contain", src: "https://cdn.localcivics.io/brand/l.png" })))), /* @__PURE__ */ React__namespace.createElement(core.Navbar.Section, { grow: true, mt: 50 }, /* @__PURE__ */ React__namespace.createElement(core.Stack, { justify: "center", spacing: 0 }, links)), /* @__PURE__ */ React__namespace.createElement(core.Navbar.Section, null, /* @__PURE__ */ React__namespace.createElement(core.Stack, { justify: "center", spacing: 0 }, /* @__PURE__ */ React__namespace.createElement(
|
|
80
|
-
NavbarLink,
|
|
81
|
-
{
|
|
82
|
-
icon: icons.IconSwitchHorizontal,
|
|
83
|
-
label: "Switch accounts",
|
|
84
|
-
onClick: props.onSwitchAccounts
|
|
85
|
-
}
|
|
86
|
-
), /* @__PURE__ */ React__namespace.createElement(
|
|
87
|
-
NavbarLink,
|
|
88
|
-
{
|
|
89
|
-
icon: icons.IconLogout,
|
|
90
|
-
label: "Logout",
|
|
91
|
-
onClick: props.onLogout
|
|
92
|
-
}
|
|
93
|
-
))));
|
|
94
|
-
};
|
|
95
|
-
|
|
96
37
|
var __defProp$9 = Object.defineProperty;
|
|
97
38
|
var __getOwnPropSymbols$9 = Object.getOwnPropertySymbols;
|
|
98
39
|
var __hasOwnProp$9 = Object.prototype.hasOwnProperty;
|
|
@@ -353,7 +294,7 @@ const data = [
|
|
|
353
294
|
]
|
|
354
295
|
}
|
|
355
296
|
];
|
|
356
|
-
function
|
|
297
|
+
function Navbar(props) {
|
|
357
298
|
const { classes, cx } = useStyles$m();
|
|
358
299
|
const [burgerOpen, setBurgerOpen] = React__namespace.useState(false);
|
|
359
300
|
const toggle = () => setBurgerOpen(!burgerOpen);
|
|
@@ -2856,17 +2797,17 @@ var __spreadValues = (a, b) => {
|
|
|
2856
2797
|
return a;
|
|
2857
2798
|
};
|
|
2858
2799
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
2859
|
-
const useStyles = core.createStyles((theme) => ({
|
|
2800
|
+
const useStyles = core.createStyles((theme, props) => ({
|
|
2860
2801
|
footer: {
|
|
2861
2802
|
paddingTop: theme.spacing.md,
|
|
2862
2803
|
paddingBottom: theme.spacing.md,
|
|
2863
|
-
paddingLeft: theme.spacing.md,
|
|
2804
|
+
paddingLeft: props.navbar ? theme.spacing.md : 0,
|
|
2864
2805
|
backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[6] : theme.colors.gray[0],
|
|
2865
2806
|
borderTop: `1px solid ${theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[2]}`,
|
|
2866
2807
|
[theme.fn.largerThan("sm")]: {
|
|
2867
2808
|
paddingTop: theme.spacing.xl * 2,
|
|
2868
2809
|
paddingBottom: theme.spacing.xl * 2,
|
|
2869
|
-
paddingLeft: theme.spacing.xl * 13
|
|
2810
|
+
paddingLeft: props.navbar ? theme.spacing.xl * 13 : 0
|
|
2870
2811
|
}
|
|
2871
2812
|
},
|
|
2872
2813
|
logo: {
|
|
@@ -2938,14 +2879,14 @@ const useStyles = core.createStyles((theme) => ({
|
|
|
2938
2879
|
}
|
|
2939
2880
|
}));
|
|
2940
2881
|
const App = (props) => {
|
|
2941
|
-
const { classes } = useStyles();
|
|
2882
|
+
const { classes } = useStyles(props);
|
|
2942
2883
|
const account = useAccount(props.account, props.accounts, props.onAccountChange);
|
|
2943
2884
|
return /* @__PURE__ */ React__namespace.createElement(
|
|
2944
2885
|
core.AppShell,
|
|
2945
2886
|
{
|
|
2946
2887
|
padding: "xs",
|
|
2947
|
-
navbar: /* @__PURE__ */ React__namespace.createElement(
|
|
2948
|
-
|
|
2888
|
+
navbar: props.navbar && /* @__PURE__ */ React__namespace.createElement(
|
|
2889
|
+
Navbar,
|
|
2949
2890
|
__spreadProps(__spreadValues({}, props.navbar.props), {
|
|
2950
2891
|
onSwitchAccounts: account.accounts && account.accounts.length > 1 ? () => account.setChangeModalOpen(true) : void 0
|
|
2951
2892
|
})
|
|
@@ -2992,7 +2933,7 @@ const App = (props) => {
|
|
|
2992
2933
|
})
|
|
2993
2934
|
},
|
|
2994
2935
|
/* @__PURE__ */ React__namespace.createElement("div", { style: { position: "relative" } }, (props.loading || account.opened) && /* @__PURE__ */ React__namespace.createElement(core.Center, { style: { height: 400 } }, /* @__PURE__ */ React__namespace.createElement(core.Loader, null)), !props.loading && !account.opened && props.page),
|
|
2995
|
-
/* @__PURE__ */ React__namespace.createElement(
|
|
2936
|
+
!!account.accounts && !!account.account && /* @__PURE__ */ React__namespace.createElement(
|
|
2996
2937
|
SwitchAccount,
|
|
2997
2938
|
{
|
|
2998
2939
|
opened: account.opened,
|
|
@@ -3021,6 +2962,9 @@ const useAccount = (account, accounts, onAccountChange) => {
|
|
|
3021
2962
|
setChangeModalOpen,
|
|
3022
2963
|
onAccountChange: (account2) => {
|
|
3023
2964
|
setLoading(true);
|
|
2965
|
+
if (!onAccountChange) {
|
|
2966
|
+
return;
|
|
2967
|
+
}
|
|
3024
2968
|
onAccountChange(account2).then(() => {
|
|
3025
2969
|
setActive(account2);
|
|
3026
2970
|
setLoading(false);
|
|
@@ -3049,7 +2993,6 @@ exports.Home = Home;
|
|
|
3049
2993
|
exports.Lesson = Lesson;
|
|
3050
2994
|
exports.Lessons = Lessons;
|
|
3051
2995
|
exports.Navbar = Navbar;
|
|
3052
|
-
exports.NestedNavbar = NestedNavbar;
|
|
3053
2996
|
exports.Organization = Organization;
|
|
3054
2997
|
exports.People = People;
|
|
3055
2998
|
exports.StartAnonymousLesson = StartAnonymousLesson;
|