@homebound/beam 2.366.1 → 2.368.0

package/dist/components/SuperDrawer/components/SuperDrawerHeader.d.ts

@@ -4,7 +4,7 @@ interface SuperDrawerHeaderProps {
     hideControls?: boolean;
 }
 interface SuperDrawerHeaderStructuredProps {
-    title: string;
+    title: string | ReactNode;
     left?: ReactNode;
     right?: ReactNode;
     hideControls?: boolean;

package/dist/components/SuperDrawer/components/SuperDrawerHeader.js

@@ -16,7 +16,7 @@ function SuperDrawerHeader(props) {
     const currentContent = (_b = contentStack.current[contentStack.current.length - 1]) === null || _b === void 0 ? void 0 : _b.opts;
     const isDetail = currentContent !== firstContent;
     const tid = (0, utils_1.useTestIds)({}, "superDrawerHeader");
-    return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsxs)("div", { css: Css_1.Css.df.aic.jcsb.gap3.$, ...tid, children: [isStructuredProps(props) ? ((0, jsx_runtime_1.jsxs)("div", { css: Css_1.Css.df.jcsb.aic.gap2.fg1.$, children: [(0, jsx_runtime_1.jsxs)("div", { css: Css_1.Css.fg1.df.aic.gap2.$, children: [(0, jsx_runtime_1.jsx)("h1", { children: props.title }), props.left] }), props.right && (0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.fs0.$, children: props.right })] })) : ((0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.fg1.$, children: props.children })), !hideControls && ((0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.fs0.if(isDetail).vh.$, children: (0, jsx_runtime_1.jsx)(ButtonGroup_1.ButtonGroup, { buttons: [
+    return (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsxs)("div", { css: Css_1.Css.df.aic.jcsb.gap3.$, ...tid, children: [isStructuredProps(props) ? ((0, jsx_runtime_1.jsxs)("div", { css: Css_1.Css.df.jcsb.aic.gap2.fg1.$, children: [(0, jsx_runtime_1.jsxs)("div", { css: Css_1.Css.fg1.df.aic.gap2.$, children: [typeof props.title === "string" ? (0, jsx_runtime_1.jsx)("h1", { children: props.title }) : props.title, props.left] }), props.right && (0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.fs0.$, children: props.right })] })) : ((0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.fg1.$, children: props.children })), !hideControls && ((0, jsx_runtime_1.jsx)("div", { css: Css_1.Css.fs0.if(isDetail).vh.$, children: (0, jsx_runtime_1.jsx)(ButtonGroup_1.ButtonGroup, { buttons: [
                         { icon: "chevronLeft", onClick: () => onPrevClick && onPrevClick(), disabled: !onPrevClick },
                         { icon: "chevronRight", onClick: () => onNextClick && onNextClick(), disabled: !onNextClick },
                     ], ...tid.actions }) }))] }), sdHeaderDiv);

package/dist/forms/BoundNumberField.js

@@ -8,7 +8,7 @@ const utils_1 = require("../utils");
 const defaultLabel_1 = require("../utils/defaultLabel");
 /** Wraps `NumberField` and binds it to a form field. */
 function BoundNumberField(props) {
-    const { field, readOnly, onChange = (value) => field.set(value), label = (0, defaultLabel_1.defaultLabel)(field.key.replace(/InCents$/, "")), type = field.key.endsWith("InCents") ? "cents" : undefined, onFocus, onBlur, onEnter, ...others } = props;
+    const { field, readOnly, onChange = (value) => field.set(value), label = (0, defaultLabel_1.defaultLabel)(field.key.replace(/(InCents|InMills)$/, "")), type = field.key.endsWith("InCents") ? "cents" : field.key.endsWith("InMills") ? "mills" : undefined, onFocus, onBlur, onEnter, ...others } = props;
     const testId = (0, utils_1.useTestIds)(props, label || field.key);
     return ((0, jsx_runtime_1.jsx)(mobx_react_1.Observer, { children: () => ((0, jsx_runtime_1.jsx)(NumberField_1.NumberField, { label: label, value: typeof field.value === "number" ? field.value : undefined, onChange: onChange, type: type, readOnly: readOnly !== null && readOnly !== void 0 ? readOnly : field.readOnly, errorMsg: field.touched ? field.errors.join(" ") : undefined, required: field.required, onFocus: () => {
                 field.focus();

package/dist/forms/formStateDomain.d.ts

@@ -19,6 +19,7 @@ export interface AuthorInput {
     birthday?: Date | null;
     heightInInches?: number | null;
     royaltiesInCents?: number | null;
+    royaltiesInMills?: number | null;
     books?: BookInput[] | null;
     address?: AuthorAddress | null;
     favoriteSport?: string | null;

package/dist/inputs/NumberField.d.ts

@@ -1,7 +1,7 @@
 import { ReactNode } from "react";
 import { PresentationFieldProps } from "../components/PresentationContext";
 import { Xss } from "../Css";
-export type NumberFieldType = "cents" | "dollars" | "percent" | "basisPoints" | "days";
+export type NumberFieldType = "cents" | "dollars" | "percent" | "basisPoints" | "days" | "mills";
 export interface NumberFieldProps extends Pick<PresentationFieldProps, "labelStyle" | "fullWidth"> {
     label: string;
     /** If set, the label will be defined as 'aria-label` on the input element */

package/dist/inputs/NumberField.js

@@ -19,7 +19,7 @@ function NumberField(props) {
     const { disabled, required, readOnly, type, label, onBlur, onFocus, errorMsg, helperText, value, onChange, xss, displayDirection = false, numFractionDigits = type === "dollars" ? 2 : undefined, truncate = false, onEnter, numberFormatOptions, numIntegerDigits, useGrouping = true, sizeToContent = false, positiveOnly = false, ...otherProps } = props;
     const isDisabled = !!disabled;
     const isReadOnly = !!readOnly;
-    const factor = type === "percent" || type === "cents" ? 100 : type === "basisPoints" ? 10000 : 1;
+    const factor = type === "percent" ? 100 : type === "cents" ? 100 : type === "mills" ? 1000 : type === "basisPoints" ? 10000 : 1;
     const signDisplay = displayDirection ? "always" : "auto";
     const defaultFormatOptions = (0, react_1.useMemo)(() => ({
         [truncate ? "maximumFractionDigits" : "minimumFractionDigits"]: numFractionDigits,
@@ -40,11 +40,13 @@ function NumberField(props) {
                 ? { style: "percent", minimumFractionDigits: 2 }
                 : type === "cents"
                     ? { style: "currency", currency: "USD", minimumFractionDigits: 2 }
-                    : type === "dollars"
-                        ? { style: "currency", currency: "USD", minimumFractionDigits: numFractionDigits !== null && numFractionDigits !== void 0 ? numFractionDigits : 2 }
-                        : type === "days"
-                            ? { style: "unit", unit: "day", unitDisplay: "long", maximumFractionDigits: 0 }
-                            : {};
+                    : type === "mills"
+                        ? { style: "currency", currency: "USD", minimumFractionDigits: 3 }
+                        : type === "dollars"
+                            ? { style: "currency", currency: "USD", minimumFractionDigits: numFractionDigits !== null && numFractionDigits !== void 0 ? numFractionDigits : 2 }
+                            : type === "days"
+                                ? { style: "unit", unit: "day", unitDisplay: "long", maximumFractionDigits: 0 }
+                                : {};
         return { ...defaultFormatOptions, ...typeFormat };
     }, [type, numberFormatOptions, defaultFormatOptions, numFractionDigits]);
     const numberParser = (0, react_1.useMemo)(() => new number_1.NumberParser(locale, formatOptions), [locale, formatOptions]);

package/dist/inputs/RichTextField.js

@@ -89,6 +89,7 @@ function RichTextField(props) {
         // The <trix-editor /> web component's `trix-initialize` event may fire before a `useEffect` hook in the component is executed, making it difficult ot attach the event listener locally.
         window.addEventListener("trix-initialize", onEditorInit);
         return id;
+        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [readOnly]);
     (0, react_2.useEffect)(() => {
         // If our value prop changes (without the change coming from us), reload it

package/dist/inputs/TextField.d.ts

@@ -19,6 +19,8 @@ export interface TextFieldProps<X> extends BeamTextFieldProps<X> {
     endAdornment?: ReactNode;
     startAdornment?: ReactNode;
     hideErrorMessage?: boolean;
+    /** Allow focusing without selecting, i.e. to let the user keep typing after we've pre-filled text + called focus, like the Add New component. */
+    selectOnFocus?: boolean;
 }
 export declare function TextField<X extends Only<TextFieldXss, X>>(props: TextFieldProps<X>): import("@emotion/react/jsx-runtime").JSX.Element;
 export type TextFieldApi = {

package/dist/inputs/TextFieldBase.d.ts

@@ -18,5 +18,7 @@ export interface TextFieldBaseProps<X> extends Pick<BeamTextFieldProps<X>, "labe
     hideErrorMessage?: boolean;
     alwaysShowHelperText?: boolean;
     unfocusedPlaceholder?: ReactNode;
+    /** Allow focusing without selecting, i.e. to let the user keep typing after we've pre-filled text + called focus, like the Add New component. */
+    selectOnFocus?: boolean;
 }
 export declare function TextFieldBase<X extends Only<TextFieldXss, X>>(props: TextFieldBaseProps<X>): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/inputs/TextFieldBase.js

@@ -20,7 +20,7 @@ function TextFieldBase(props) {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     const { fieldProps, wrap = false } = (0, PresentationContext_1.usePresentationContext)();
     const { labelLeftFieldWidth = "50%" } = fieldProps !== null && fieldProps !== void 0 ? fieldProps : {};
-    const { label, required, labelProps, inputProps, inputRef, inputWrapRef, groupProps, compact = (_a = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.compact) !== null && _a !== void 0 ? _a : false, errorMsg, helperText, multiline = false, onChange, onBlur, onFocus, xss, endAdornment, startAdornment, labelStyle = (_b = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.labelStyle) !== null && _b !== void 0 ? _b : "above", contrast = false, borderless = (_c = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.borderless) !== null && _c !== void 0 ? _c : false, textAreaMinHeight = 96, clearable = false, tooltip, visuallyDisabled = (_d = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.visuallyDisabled) !== null && _d !== void 0 ? _d : true, errorInTooltip = (_e = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.errorInTooltip) !== null && _e !== void 0 ? _e : false, hideErrorMessage = false, alwaysShowHelperText = false, fullWidth = (_f = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.fullWidth) !== null && _f !== void 0 ? _f : false, unfocusedPlaceholder, } = props;
+    const { label, required, labelProps, inputProps, inputRef, inputWrapRef, groupProps, compact = (_a = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.compact) !== null && _a !== void 0 ? _a : false, errorMsg, helperText, multiline = false, onChange, onBlur, onFocus, xss, endAdornment, startAdornment, labelStyle = (_b = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.labelStyle) !== null && _b !== void 0 ? _b : "above", contrast = false, borderless = (_c = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.borderless) !== null && _c !== void 0 ? _c : false, textAreaMinHeight = 96, clearable = false, tooltip, visuallyDisabled = (_d = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.visuallyDisabled) !== null && _d !== void 0 ? _d : true, errorInTooltip = (_e = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.errorInTooltip) !== null && _e !== void 0 ? _e : false, hideErrorMessage = false, alwaysShowHelperText = false, fullWidth = (_f = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.fullWidth) !== null && _f !== void 0 ? _f : false, unfocusedPlaceholder, selectOnFocus = true, } = props;
     const typeScale = (_g = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.typeScale) !== null && _g !== void 0 ? _g : (inputProps.readOnly && labelStyle !== "hidden" ? "smMd" : "sm");
     const internalProps = props.internalProps || {};
     const { compound = false, forceFocus = false, forceHover = false } = internalProps;
@@ -104,7 +104,8 @@ function TextFieldBase(props) {
         }
     }
     const onFocusChained = (0, react_aria_1.chain)((e) => {
-        e.target.select();
+        if (selectOnFocus)
+            e.target.select();
     }, onFocus);
     // Simulate clicking `ElementType` when using an unfocused placeholder
     function handleUnfocusedPlaceholderClick(e) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homebound/beam",
-  "version": "2.366.1",
+  "version": "2.368.0",
   "author": "Homebound",
   "license": "MIT",
   "main": "dist/index.js",