react-better-html 1.1.160 → 1.1.161
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.mts +5 -2
- package/dist/index.d.ts +5 -2
- package/dist/index.js +19 -2
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +19 -2
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -319,14 +319,17 @@ declare const Modal: typeof ModalComponent & {
|
|
|
319
319
|
type PageHolderProps = {
|
|
320
320
|
/** @default false */
|
|
321
321
|
noMaxContentWidth?: boolean;
|
|
322
|
-
backgroundColor?:
|
|
322
|
+
backgroundColor?: React.CSSProperties["backgroundColor"];
|
|
323
|
+
backgroundImage?: React.CSSProperties["backgroundImage"];
|
|
323
324
|
children?: React.ReactNode;
|
|
324
325
|
} & ComponentPaddingProps;
|
|
325
326
|
type PageHolderComponentType = {
|
|
326
327
|
(props: ComponentPropWithRef<HTMLDivElement, PageHolderProps>): React.ReactElement;
|
|
327
328
|
center: (props: ComponentPropWithRef<HTMLDivElement, PageHolderProps & {
|
|
328
|
-
pageBackgroundColor?:
|
|
329
|
+
pageBackgroundColor?: React.CSSProperties["backgroundColor"];
|
|
330
|
+
pageBackgroundImage?: React.CSSProperties["backgroundImage"];
|
|
329
331
|
contentMaxWidth?: React.CSSProperties["maxWidth"];
|
|
332
|
+
behindComponent?: React.ReactNode;
|
|
330
333
|
sideComponent?: React.ReactNode;
|
|
331
334
|
/** @default "right" */
|
|
332
335
|
sideComponentPosition?: "left" | "right";
|
package/dist/index.d.ts
CHANGED
|
@@ -319,14 +319,17 @@ declare const Modal: typeof ModalComponent & {
|
|
|
319
319
|
type PageHolderProps = {
|
|
320
320
|
/** @default false */
|
|
321
321
|
noMaxContentWidth?: boolean;
|
|
322
|
-
backgroundColor?:
|
|
322
|
+
backgroundColor?: React.CSSProperties["backgroundColor"];
|
|
323
|
+
backgroundImage?: React.CSSProperties["backgroundImage"];
|
|
323
324
|
children?: React.ReactNode;
|
|
324
325
|
} & ComponentPaddingProps;
|
|
325
326
|
type PageHolderComponentType = {
|
|
326
327
|
(props: ComponentPropWithRef<HTMLDivElement, PageHolderProps>): React.ReactElement;
|
|
327
328
|
center: (props: ComponentPropWithRef<HTMLDivElement, PageHolderProps & {
|
|
328
|
-
pageBackgroundColor?:
|
|
329
|
+
pageBackgroundColor?: React.CSSProperties["backgroundColor"];
|
|
330
|
+
pageBackgroundImage?: React.CSSProperties["backgroundImage"];
|
|
329
331
|
contentMaxWidth?: React.CSSProperties["maxWidth"];
|
|
332
|
+
behindComponent?: React.ReactNode;
|
|
330
333
|
sideComponent?: React.ReactNode;
|
|
331
334
|
/** @default "right" */
|
|
332
335
|
sideComponentPosition?: "left" | "right";
|
package/dist/index.js
CHANGED
|
@@ -3659,7 +3659,9 @@ var PageHolderComponent = (0, import_react14.forwardRef)(function PageHolder({ n
|
|
|
3659
3659
|
});
|
|
3660
3660
|
PageHolderComponent.center = (0, import_react14.forwardRef)(function Center({
|
|
3661
3661
|
pageBackgroundColor,
|
|
3662
|
+
pageBackgroundImage,
|
|
3662
3663
|
contentMaxWidth,
|
|
3664
|
+
behindComponent,
|
|
3663
3665
|
sideComponent,
|
|
3664
3666
|
sideComponentPosition = "right",
|
|
3665
3667
|
noMaxContentWidth,
|
|
@@ -3674,17 +3676,32 @@ PageHolderComponent.center = (0, import_react14.forwardRef)(function Center({
|
|
|
3674
3676
|
return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
|
|
3675
3677
|
Div_default.row,
|
|
3676
3678
|
{
|
|
3679
|
+
position: "relative",
|
|
3677
3680
|
width: "100%",
|
|
3678
3681
|
minHeight: "100svh",
|
|
3679
3682
|
alignItems: "center",
|
|
3680
3683
|
justifyContent: "center",
|
|
3681
3684
|
backgroundColor: pageBackgroundColor,
|
|
3685
|
+
backgroundImage: pageBackgroundImage,
|
|
3682
3686
|
children: [
|
|
3687
|
+
behindComponent && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
3688
|
+
Div_default,
|
|
3689
|
+
{
|
|
3690
|
+
position: "fixed",
|
|
3691
|
+
width: `${withSideComponent ? 50 : 100}%`,
|
|
3692
|
+
height: "100svh",
|
|
3693
|
+
top: 0,
|
|
3694
|
+
left: sideComponentPosition === "right" ? 0 : "auto",
|
|
3695
|
+
right: sideComponentPosition === "left" ? 0 : "auto",
|
|
3696
|
+
zIndex: 1,
|
|
3697
|
+
children: behindComponent
|
|
3698
|
+
}
|
|
3699
|
+
),
|
|
3683
3700
|
sideComponentPosition === "left" && withSideComponent && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Div_default, { width: "50%" }),
|
|
3684
|
-
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Div_default.column, { width: `${withSideComponent ? 50 : 100}%`, alignItems: "center", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
3701
|
+
/* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Div_default.column, { position: "relative", width: `${withSideComponent ? 50 : 100}%`, alignItems: "center", zIndex: 2, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
|
3685
3702
|
Div_default.box,
|
|
3686
3703
|
{
|
|
3687
|
-
width: `calc(100% - ${theme2.styles.space
|
|
3704
|
+
width: `calc(100% - ${theme2.styles.space * 2}px)`,
|
|
3688
3705
|
maxWidth: !noMaxContentWidth ? contentMaxWidth ?? app.contentMaxWidth / 2 : void 0,
|
|
3689
3706
|
marginInline: theme2.styles.space,
|
|
3690
3707
|
marginBlock: theme2.styles.space,
|