@firecms/core 3.0.0-canary.207 → 3.0.0-canary.209
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/app/Scaffold.d.ts +4 -0
- package/dist/core/DefaultAppBar.d.ts +8 -2
- package/dist/core/FireCMS.d.ts +2 -2
- package/dist/index.es.js +120 -111
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +120 -111
- package/dist/index.umd.js.map +1 -1
- package/dist/types/firecms.d.ts +1 -1
- package/package.json +5 -5
- package/src/app/Scaffold.tsx +13 -3
- package/src/core/DefaultAppBar.tsx +17 -5
- package/src/core/FireCMS.tsx +1 -1
- package/src/types/firecms.tsx +1 -1
package/dist/app/Scaffold.d.ts
CHANGED
|
@@ -13,6 +13,10 @@ export interface ScaffoldProps {
|
|
|
13
13
|
* Note that this has no effect if you are using a custom AppBar or Drawer.
|
|
14
14
|
*/
|
|
15
15
|
logo?: string;
|
|
16
|
+
/**
|
|
17
|
+
* If true, the main content will be padded in large layouts. Defaults to true.
|
|
18
|
+
*/
|
|
19
|
+
padding?: boolean;
|
|
16
20
|
className?: string;
|
|
17
21
|
style?: React.CSSProperties;
|
|
18
22
|
}
|
|
@@ -1,11 +1,17 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { User } from "../types";
|
|
3
3
|
export type DefaultAppBarProps<ADDITIONAL_PROPS = object> = {
|
|
4
|
+
/**
|
|
5
|
+
* The content of the app bar, usually a title or logo. This includes a link to the home page.
|
|
6
|
+
*/
|
|
4
7
|
title?: React.ReactNode;
|
|
5
8
|
/**
|
|
6
|
-
* A component that gets rendered on the upper side of the main toolbar
|
|
9
|
+
* A component that gets rendered on the upper side to the end of the main toolbar
|
|
7
10
|
*/
|
|
8
11
|
endAdornment?: React.ReactNode;
|
|
12
|
+
/**
|
|
13
|
+
* A component that gets rendered on the upper side to the start of the main toolbar
|
|
14
|
+
*/
|
|
9
15
|
startAdornment?: React.ReactNode;
|
|
10
16
|
dropDownActions?: React.ReactNode;
|
|
11
17
|
includeModeToggle?: boolean;
|
|
@@ -20,4 +26,4 @@ export type DefaultAppBarProps<ADDITIONAL_PROPS = object> = {
|
|
|
20
26
|
*
|
|
21
27
|
|
|
22
28
|
*/
|
|
23
|
-
export declare const DefaultAppBar: ({ title, endAdornment, startAdornment, dropDownActions, includeModeToggle, className, style, user: userProp }: DefaultAppBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
29
|
+
export declare const DefaultAppBar: ({ title, endAdornment, startAdornment, dropDownActions, includeModeToggle, className, style, user: userProp, logo: logoProp, }: DefaultAppBarProps) => import("react/jsx-runtime").JSX.Element;
|
package/dist/core/FireCMS.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { FireCMSProps, User } from "../types";
|
|
2
2
|
/**
|
|
3
3
|
* If you are using independent components of the CMS
|
|
4
4
|
* you need to wrap them with this main component, so the internal hooks work.
|
|
@@ -11,4 +11,4 @@ import { EntityCollection, FireCMSProps, User } from "../types";
|
|
|
11
11
|
|
|
12
12
|
* @group Core
|
|
13
13
|
*/
|
|
14
|
-
export declare function FireCMS<USER extends User
|
|
14
|
+
export declare function FireCMS<USER extends User>(props: FireCMSProps<USER>): import("react/jsx-runtime").JSX.Element;
|
package/dist/index.es.js
CHANGED
|
@@ -15390,14 +15390,16 @@ const DefaultAppBar = function DefaultAppBar2(t0) {
|
|
|
15390
15390
|
includeModeToggle: t1,
|
|
15391
15391
|
className,
|
|
15392
15392
|
style,
|
|
15393
|
-
user: userProp
|
|
15393
|
+
user: userProp,
|
|
15394
|
+
logo: logoProp
|
|
15394
15395
|
} = t0;
|
|
15395
15396
|
const includeModeToggle = t1 === void 0 ? true : t1;
|
|
15396
15397
|
const {
|
|
15397
15398
|
hasDrawer,
|
|
15398
15399
|
drawerOpen,
|
|
15399
|
-
logo
|
|
15400
|
+
logo: appLogo
|
|
15400
15401
|
} = useApp();
|
|
15402
|
+
const logo = logoProp ?? appLogo;
|
|
15401
15403
|
const navigation = useNavigationController();
|
|
15402
15404
|
const breadcrumbs = useBreadcrumbsController();
|
|
15403
15405
|
const authController = useAuthController();
|
|
@@ -15481,7 +15483,7 @@ const DefaultAppBar = function DefaultAppBar2(t0) {
|
|
|
15481
15483
|
}
|
|
15482
15484
|
let t7;
|
|
15483
15485
|
if ($[18] !== breadcrumbs.breadcrumbs) {
|
|
15484
|
-
t7 = breadcrumbs.breadcrumbs && /* @__PURE__ */ jsx("div", { className: "mr-8 hidden lg:block", children: /* @__PURE__ */ jsx("div", { className: "flex flex-row gap-2", children: breadcrumbs.breadcrumbs.map(_temp$a) }) });
|
|
15486
|
+
t7 = (breadcrumbs.breadcrumbs ?? []).length > 0 && /* @__PURE__ */ jsx("div", { className: "mr-8 hidden lg:block", children: /* @__PURE__ */ jsx("div", { className: "flex flex-row gap-2", children: breadcrumbs.breadcrumbs.map(_temp$a) }) });
|
|
15485
15487
|
$[18] = breadcrumbs.breadcrumbs;
|
|
15486
15488
|
$[19] = t7;
|
|
15487
15489
|
} else {
|
|
@@ -23514,92 +23516,94 @@ function AppBar(t0) {
|
|
|
23514
23516
|
AppBar.componentType = "AppBar";
|
|
23515
23517
|
const DRAWER_WIDTH = 280;
|
|
23516
23518
|
const Scaffold = React__default.memo(function Scaffold2(props) {
|
|
23517
|
-
const $ = c(
|
|
23519
|
+
const $ = c(48);
|
|
23518
23520
|
const {
|
|
23519
23521
|
children,
|
|
23520
23522
|
autoOpenDrawer,
|
|
23521
23523
|
logo,
|
|
23522
23524
|
className,
|
|
23523
|
-
style
|
|
23525
|
+
style,
|
|
23526
|
+
padding: t0
|
|
23524
23527
|
} = props;
|
|
23525
|
-
|
|
23528
|
+
const padding = t0 === void 0 ? true : t0;
|
|
23529
|
+
let t1;
|
|
23526
23530
|
if ($[0] !== children) {
|
|
23527
|
-
|
|
23531
|
+
t1 = React__default.Children.toArray(children).filter(_temp);
|
|
23528
23532
|
$[0] = children;
|
|
23529
|
-
$[1] =
|
|
23533
|
+
$[1] = t1;
|
|
23530
23534
|
} else {
|
|
23531
|
-
|
|
23535
|
+
t1 = $[1];
|
|
23532
23536
|
}
|
|
23533
|
-
const drawerChildren =
|
|
23537
|
+
const drawerChildren = t1;
|
|
23534
23538
|
if (drawerChildren.length > 1) {
|
|
23535
23539
|
throw Error("Only one Drawer component is allowed in Scaffold");
|
|
23536
23540
|
}
|
|
23537
|
-
let
|
|
23541
|
+
let t2;
|
|
23538
23542
|
if ($[2] !== children) {
|
|
23539
|
-
|
|
23543
|
+
t2 = React__default.Children.toArray(children).filter(_temp2);
|
|
23540
23544
|
$[2] = children;
|
|
23541
|
-
$[3] =
|
|
23545
|
+
$[3] = t2;
|
|
23542
23546
|
} else {
|
|
23543
|
-
|
|
23547
|
+
t2 = $[3];
|
|
23544
23548
|
}
|
|
23545
|
-
const appBarChildren =
|
|
23549
|
+
const appBarChildren = t2;
|
|
23546
23550
|
if (appBarChildren.length > 1) {
|
|
23547
23551
|
throw Error("Only one AppBar component is allowed in Scaffold");
|
|
23548
23552
|
}
|
|
23549
|
-
let
|
|
23553
|
+
let t3;
|
|
23550
23554
|
if ($[4] !== children) {
|
|
23551
|
-
|
|
23555
|
+
t3 = React__default.Children.toArray(children).filter(_temp3);
|
|
23552
23556
|
$[4] = children;
|
|
23553
|
-
$[5] =
|
|
23557
|
+
$[5] = t3;
|
|
23554
23558
|
} else {
|
|
23555
|
-
|
|
23559
|
+
t3 = $[5];
|
|
23556
23560
|
}
|
|
23557
|
-
const otherChildren =
|
|
23561
|
+
const otherChildren = t3;
|
|
23558
23562
|
const includeDrawer = drawerChildren.length > 0;
|
|
23559
23563
|
const largeLayout = useLargeLayout();
|
|
23560
23564
|
const [drawerOpen, setDrawerOpen] = React__default.useState(false);
|
|
23561
23565
|
const [onHover, setOnHover] = React__default.useState(false);
|
|
23562
|
-
let
|
|
23566
|
+
let t4;
|
|
23563
23567
|
if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
|
|
23564
|
-
|
|
23565
|
-
$[6] =
|
|
23568
|
+
t4 = () => setOnHover(true);
|
|
23569
|
+
$[6] = t4;
|
|
23566
23570
|
} else {
|
|
23567
|
-
|
|
23571
|
+
t4 = $[6];
|
|
23568
23572
|
}
|
|
23569
|
-
const setOnHoverTrue =
|
|
23570
|
-
let
|
|
23573
|
+
const setOnHoverTrue = t4;
|
|
23574
|
+
let t5;
|
|
23571
23575
|
if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
|
|
23572
|
-
|
|
23573
|
-
$[7] =
|
|
23576
|
+
t5 = () => setOnHover(false);
|
|
23577
|
+
$[7] = t5;
|
|
23574
23578
|
} else {
|
|
23575
|
-
|
|
23579
|
+
t5 = $[7];
|
|
23576
23580
|
}
|
|
23577
|
-
const setOnHoverFalse =
|
|
23578
|
-
let
|
|
23581
|
+
const setOnHoverFalse = t5;
|
|
23582
|
+
let t6;
|
|
23579
23583
|
if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
|
|
23580
|
-
|
|
23584
|
+
t6 = () => {
|
|
23581
23585
|
setDrawerOpen(true);
|
|
23582
23586
|
};
|
|
23583
|
-
$[8] =
|
|
23587
|
+
$[8] = t6;
|
|
23584
23588
|
} else {
|
|
23585
|
-
|
|
23589
|
+
t6 = $[8];
|
|
23586
23590
|
}
|
|
23587
|
-
const handleDrawerOpen =
|
|
23588
|
-
let
|
|
23591
|
+
const handleDrawerOpen = t6;
|
|
23592
|
+
let t7;
|
|
23589
23593
|
if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
|
|
23590
|
-
|
|
23594
|
+
t7 = () => {
|
|
23591
23595
|
setDrawerOpen(false);
|
|
23592
23596
|
};
|
|
23593
|
-
$[9] =
|
|
23597
|
+
$[9] = t7;
|
|
23594
23598
|
} else {
|
|
23595
|
-
|
|
23599
|
+
t7 = $[9];
|
|
23596
23600
|
}
|
|
23597
|
-
const handleDrawerClose =
|
|
23601
|
+
const handleDrawerClose = t7;
|
|
23598
23602
|
const computedDrawerOpen = drawerOpen || Boolean(largeLayout && autoOpenDrawer && onHover);
|
|
23599
23603
|
const hasAppBar = Boolean(appBarChildren.length > 0);
|
|
23600
|
-
let
|
|
23604
|
+
let t8;
|
|
23601
23605
|
if ($[10] !== autoOpenDrawer || $[11] !== computedDrawerOpen || $[12] !== includeDrawer || $[13] !== logo || $[14] !== onHover) {
|
|
23602
|
-
|
|
23606
|
+
t8 = {
|
|
23603
23607
|
logo,
|
|
23604
23608
|
hasDrawer: includeDrawer,
|
|
23605
23609
|
drawerHovered: onHover,
|
|
@@ -23613,21 +23617,21 @@ const Scaffold = React__default.memo(function Scaffold2(props) {
|
|
|
23613
23617
|
$[12] = includeDrawer;
|
|
23614
23618
|
$[13] = logo;
|
|
23615
23619
|
$[14] = onHover;
|
|
23616
|
-
$[15] =
|
|
23620
|
+
$[15] = t8;
|
|
23617
23621
|
} else {
|
|
23618
|
-
|
|
23622
|
+
t8 = $[15];
|
|
23619
23623
|
}
|
|
23620
|
-
let
|
|
23624
|
+
let t9;
|
|
23621
23625
|
if ($[16] !== className) {
|
|
23622
|
-
|
|
23626
|
+
t9 = cls("flex h-screen w-screen bg-surface-50 dark:bg-surface-900 text-surface-900 dark:text-white overflow-hidden", className);
|
|
23623
23627
|
$[16] = className;
|
|
23624
|
-
$[17] =
|
|
23628
|
+
$[17] = t9;
|
|
23625
23629
|
} else {
|
|
23626
|
-
|
|
23630
|
+
t9 = $[17];
|
|
23627
23631
|
}
|
|
23628
|
-
let
|
|
23632
|
+
let t10;
|
|
23629
23633
|
if ($[18] !== style) {
|
|
23630
|
-
|
|
23634
|
+
t10 = {
|
|
23631
23635
|
paddingTop: "env(safe-area-inset-top)",
|
|
23632
23636
|
paddingLeft: "env(safe-area-inset-left)",
|
|
23633
23637
|
paddingRight: "env(safe-area-inset-right)",
|
|
@@ -23636,96 +23640,101 @@ const Scaffold = React__default.memo(function Scaffold2(props) {
|
|
|
23636
23640
|
...style
|
|
23637
23641
|
};
|
|
23638
23642
|
$[18] = style;
|
|
23639
|
-
$[19] =
|
|
23643
|
+
$[19] = t10;
|
|
23640
23644
|
} else {
|
|
23641
|
-
|
|
23645
|
+
t10 = $[19];
|
|
23642
23646
|
}
|
|
23643
|
-
const
|
|
23644
|
-
let
|
|
23645
|
-
if ($[20] !== computedDrawerOpen || $[21] !== includeDrawer || $[22] !== onHover || $[23] !==
|
|
23646
|
-
|
|
23647
|
+
const t11 = includeDrawer && drawerChildren;
|
|
23648
|
+
let t12;
|
|
23649
|
+
if ($[20] !== computedDrawerOpen || $[21] !== includeDrawer || $[22] !== onHover || $[23] !== t11) {
|
|
23650
|
+
t12 = /* @__PURE__ */ jsx(DrawerWrapper, { displayed: includeDrawer, onMouseEnter: setOnHoverTrue, onMouseMove: setOnHoverTrue, onMouseLeave: setOnHoverFalse, open: computedDrawerOpen, hovered: onHover, setDrawerOpen, children: t11 });
|
|
23647
23651
|
$[20] = computedDrawerOpen;
|
|
23648
23652
|
$[21] = includeDrawer;
|
|
23649
23653
|
$[22] = onHover;
|
|
23650
|
-
$[23] =
|
|
23651
|
-
$[24] =
|
|
23654
|
+
$[23] = t11;
|
|
23655
|
+
$[24] = t12;
|
|
23652
23656
|
} else {
|
|
23653
|
-
|
|
23657
|
+
t12 = $[24];
|
|
23654
23658
|
}
|
|
23655
|
-
let
|
|
23659
|
+
let t13;
|
|
23656
23660
|
if ($[25] !== hasAppBar) {
|
|
23657
|
-
|
|
23661
|
+
t13 = hasAppBar && /* @__PURE__ */ jsx(DrawerHeader, {});
|
|
23658
23662
|
$[25] = hasAppBar;
|
|
23659
|
-
$[26] =
|
|
23663
|
+
$[26] = t13;
|
|
23660
23664
|
} else {
|
|
23661
|
-
|
|
23665
|
+
t13 = $[26];
|
|
23662
23666
|
}
|
|
23663
|
-
const
|
|
23664
|
-
|
|
23665
|
-
|
|
23666
|
-
|
|
23667
|
-
|
|
23667
|
+
const t14 = !hasAppBar;
|
|
23668
|
+
const t15 = hasAppBar && !padding;
|
|
23669
|
+
let t16;
|
|
23670
|
+
if ($[27] !== padding || $[28] !== t14 || $[29] !== t15) {
|
|
23671
|
+
t16 = cls(defaultBorderMixin, "flex-grow overflow-auto m-0 ", {
|
|
23672
|
+
"lg:mt-4": t14,
|
|
23673
|
+
"mt-1 lg:m-0 lg:mx-4 lg:mb-4 lg:rounded-lg lg:border lg:border-solid": padding,
|
|
23674
|
+
"border-t": t15
|
|
23668
23675
|
});
|
|
23669
|
-
$[27] =
|
|
23676
|
+
$[27] = padding;
|
|
23670
23677
|
$[28] = t14;
|
|
23678
|
+
$[29] = t15;
|
|
23679
|
+
$[30] = t16;
|
|
23671
23680
|
} else {
|
|
23672
|
-
|
|
23681
|
+
t16 = $[30];
|
|
23673
23682
|
}
|
|
23674
|
-
let
|
|
23675
|
-
if ($[
|
|
23676
|
-
|
|
23677
|
-
$[
|
|
23678
|
-
$[
|
|
23683
|
+
let t17;
|
|
23684
|
+
if ($[31] !== otherChildren) {
|
|
23685
|
+
t17 = /* @__PURE__ */ jsx(ErrorBoundary, { children: otherChildren });
|
|
23686
|
+
$[31] = otherChildren;
|
|
23687
|
+
$[32] = t17;
|
|
23679
23688
|
} else {
|
|
23680
|
-
|
|
23689
|
+
t17 = $[32];
|
|
23681
23690
|
}
|
|
23682
|
-
let
|
|
23683
|
-
if ($[
|
|
23684
|
-
|
|
23685
|
-
$[31] = t14;
|
|
23686
|
-
$[32] = t15;
|
|
23691
|
+
let t18;
|
|
23692
|
+
if ($[33] !== t16 || $[34] !== t17) {
|
|
23693
|
+
t18 = /* @__PURE__ */ jsx("div", { className: t16, children: t17 });
|
|
23687
23694
|
$[33] = t16;
|
|
23695
|
+
$[34] = t17;
|
|
23696
|
+
$[35] = t18;
|
|
23688
23697
|
} else {
|
|
23689
|
-
|
|
23698
|
+
t18 = $[35];
|
|
23690
23699
|
}
|
|
23691
|
-
let
|
|
23692
|
-
if ($[
|
|
23693
|
-
|
|
23694
|
-
|
|
23695
|
-
|
|
23700
|
+
let t19;
|
|
23701
|
+
if ($[36] !== t13 || $[37] !== t18) {
|
|
23702
|
+
t19 = /* @__PURE__ */ jsxs("main", { className: "flex flex-col flex-grow overflow-auto", children: [
|
|
23703
|
+
t13,
|
|
23704
|
+
t18
|
|
23696
23705
|
] });
|
|
23697
|
-
$[
|
|
23698
|
-
$[
|
|
23699
|
-
$[
|
|
23706
|
+
$[36] = t13;
|
|
23707
|
+
$[37] = t18;
|
|
23708
|
+
$[38] = t19;
|
|
23700
23709
|
} else {
|
|
23701
|
-
|
|
23710
|
+
t19 = $[38];
|
|
23702
23711
|
}
|
|
23703
|
-
let
|
|
23704
|
-
if ($[
|
|
23705
|
-
|
|
23712
|
+
let t20;
|
|
23713
|
+
if ($[39] !== appBarChildren || $[40] !== t10 || $[41] !== t12 || $[42] !== t19 || $[43] !== t9) {
|
|
23714
|
+
t20 = /* @__PURE__ */ jsxs("div", { className: t9, style: t10, children: [
|
|
23706
23715
|
appBarChildren,
|
|
23707
|
-
|
|
23708
|
-
|
|
23716
|
+
t12,
|
|
23717
|
+
t19
|
|
23709
23718
|
] });
|
|
23710
|
-
$[
|
|
23711
|
-
$[
|
|
23712
|
-
$[
|
|
23713
|
-
$[
|
|
23714
|
-
$[
|
|
23715
|
-
$[
|
|
23719
|
+
$[39] = appBarChildren;
|
|
23720
|
+
$[40] = t10;
|
|
23721
|
+
$[41] = t12;
|
|
23722
|
+
$[42] = t19;
|
|
23723
|
+
$[43] = t9;
|
|
23724
|
+
$[44] = t20;
|
|
23716
23725
|
} else {
|
|
23717
|
-
|
|
23726
|
+
t20 = $[44];
|
|
23718
23727
|
}
|
|
23719
|
-
let
|
|
23720
|
-
if ($[
|
|
23721
|
-
|
|
23722
|
-
$[
|
|
23723
|
-
$[
|
|
23724
|
-
$[
|
|
23728
|
+
let t21;
|
|
23729
|
+
if ($[45] !== t20 || $[46] !== t8) {
|
|
23730
|
+
t21 = /* @__PURE__ */ jsx(AppContext.Provider, { value: t8, children: t20 });
|
|
23731
|
+
$[45] = t20;
|
|
23732
|
+
$[46] = t8;
|
|
23733
|
+
$[47] = t21;
|
|
23725
23734
|
} else {
|
|
23726
|
-
|
|
23735
|
+
t21 = $[47];
|
|
23727
23736
|
}
|
|
23728
|
-
return
|
|
23737
|
+
return t21;
|
|
23729
23738
|
}, equal);
|
|
23730
23739
|
const DrawerHeader = () => {
|
|
23731
23740
|
const $ = c(1);
|