react-better-html 1.1.189 → 1.1.191

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 CHANGED
@@ -359,6 +359,8 @@ type PageHolderComponentType = {
359
359
  pageBackgroundColor?: React.CSSProperties["backgroundColor"];
360
360
  pageBackgroundImage?: React.CSSProperties["backgroundImage"];
361
361
  contentMaxWidth?: React.CSSProperties["maxWidth"];
362
+ /** @default true */
363
+ contentInsideBox?: boolean;
362
364
  behindComponent?: React.ReactNode;
363
365
  sideComponent?: React.ReactNode;
364
366
  /** @default "right" */
@@ -670,6 +672,7 @@ type FormRowComponentType = {
670
672
  titleFontSize?: React.CSSProperties["fontSize"];
671
673
  description?: string;
672
674
  descriptionFontSize?: React.CSSProperties["fontSize"];
675
+ required?: boolean;
673
676
  alignChildren?: React.CSSProperties["justifyContent"];
674
677
  isLoading?: boolean;
675
678
  withActions?: boolean;
package/dist/index.d.ts CHANGED
@@ -359,6 +359,8 @@ type PageHolderComponentType = {
359
359
  pageBackgroundColor?: React.CSSProperties["backgroundColor"];
360
360
  pageBackgroundImage?: React.CSSProperties["backgroundImage"];
361
361
  contentMaxWidth?: React.CSSProperties["maxWidth"];
362
+ /** @default true */
363
+ contentInsideBox?: boolean;
362
364
  behindComponent?: React.ReactNode;
363
365
  sideComponent?: React.ReactNode;
364
366
  /** @default "right" */
@@ -670,6 +672,7 @@ type FormRowComponentType = {
670
672
  titleFontSize?: React.CSSProperties["fontSize"];
671
673
  description?: string;
672
674
  descriptionFontSize?: React.CSSProperties["fontSize"];
675
+ required?: boolean;
673
676
  alignChildren?: React.CSSProperties["justifyContent"];
674
677
  isLoading?: boolean;
675
678
  withActions?: boolean;
package/dist/index.js CHANGED
@@ -3837,6 +3837,7 @@ PageHolderComponent.center = (0, import_react15.forwardRef)(function Center({
3837
3837
  pageBackgroundColor,
3838
3838
  pageBackgroundImage,
3839
3839
  contentMaxWidth,
3840
+ contentInsideBox,
3840
3841
  behindComponent,
3841
3842
  sideComponent,
3842
3843
  sideComponentPosition = "right",
@@ -3849,6 +3850,7 @@ PageHolderComponent.center = (0, import_react15.forwardRef)(function Center({
3849
3850
  const { app } = useBetterHtmlContextInternal();
3850
3851
  const breakingPoint = mediaQuery.size1000;
3851
3852
  const withSideComponent = sideComponent && !breakingPoint;
3853
+ const ContentTag = contentInsideBox !== false ? Div_default.box : Div_default;
3852
3854
  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
3853
3855
  Div_default.row,
3854
3856
  {
@@ -3875,7 +3877,7 @@ PageHolderComponent.center = (0, import_react15.forwardRef)(function Center({
3875
3877
  ),
3876
3878
  sideComponentPosition === "left" && withSideComponent && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Div_default, { width: "50%" }),
3877
3879
  /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Div_default.column, { position: "relative", width: `${withSideComponent ? 50 : 100}%`, alignItems: "center", zIndex: 2, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
3878
- Div_default.box,
3880
+ ContentTag,
3879
3881
  {
3880
3882
  width: `calc(100% - ${theme2.styles.space * 2}px)`,
3881
3883
  maxWidth: !noMaxContentWidth ? contentMaxWidth ?? app.contentMaxWidth / 2 : void 0,
@@ -7678,6 +7680,7 @@ FormRowComponent.withTitle = (0, import_react23.forwardRef)(function WithTitle({
7678
7680
  titleFontSize,
7679
7681
  description,
7680
7682
  descriptionFontSize,
7683
+ required,
7681
7684
  alignChildren = "flex-start",
7682
7685
  isLoading,
7683
7686
  withActions,
@@ -7695,7 +7698,13 @@ FormRowComponent.withTitle = (0, import_react23.forwardRef)(function WithTitle({
7695
7698
  /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Div_default.row, { width: "100%", alignItems: "center", gap: titleGap, children: [
7696
7699
  icon && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Icon_default, { name: icon }),
7697
7700
  /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Div_default.column, { flex: 1, gap: theme2.styles.gap / 2, children: [
7698
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Text_default, { as: titleAs, fontSize: titleFontSize, children: title }),
7701
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Text_default, { as: titleAs, fontSize: titleFontSize, children: [
7702
+ title,
7703
+ required && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Text_default, { as: "span", fontSize: 16, color: theme2.colors.error, children: [
7704
+ " ",
7705
+ "*"
7706
+ ] })
7707
+ ] }),
7699
7708
  description && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Text_default, { fontSize: descriptionFontSize, color: theme2.colors.textSecondary, children: description })
7700
7709
  ] }),
7701
7710
  isLoading && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Div_default, { width: 26 - titleGap })