@homebound/beam 2.140.0 → 2.141.2

package/dist/components/NavLink.d.ts

@@ -9,10 +9,11 @@ export interface NavLinkProps extends BeamFocusableProps {
     icon?: IconKey;
     variant: NavLinkVariant;
     openInNew?: boolean;
+    contrast?: boolean;
 }
 declare type NavLinkVariant = "side" | "global";
 export declare function NavLink(props: NavLinkProps): import("@emotion/react/jsx-runtime").JSX.Element;
-export declare function getNavLinkStyles(variant: NavLinkVariant): {
+export declare function getNavLinkStyles(variant: NavLinkVariant, contrast: boolean): {
     baseStyles: {};
     hoverStyles: {};
     disabledStyles: {};

package/dist/components/NavLink.js

@@ -10,7 +10,7 @@ const Css_1 = require("../Css");
 const utils_1 = require("../utils");
 const Icon_1 = require("./Icon");
 function NavLink(props) {
-    const { disabled: isDisabled, label, openInNew, ...otherProps } = props;
+    const { disabled: isDisabled, label, openInNew, contrast = false, ...otherProps } = props;
     const ariaProps = { children: label, isDisabled, ...otherProps };
     const { href, active = false, icon = false, variant } = ariaProps;
     const ref = (0, react_1.useRef)();
@@ -19,7 +19,7 @@ function NavLink(props) {
     const { type, ...otherButtonProps } = buttonProps;
     const { hoverProps, isHovered } = (0, react_aria_1.useHover)({ isDisabled });
     const { isFocusVisible, focusProps } = (0, react_aria_1.useFocusRing)(ariaProps);
-    const { baseStyles, activeStyles, focusRingStyles, hoverStyles, disabledStyles, pressedStyles } = (0, react_1.useMemo)(() => getNavLinkStyles(variant), [variant]);
+    const { baseStyles, activeStyles, focusRingStyles, hoverStyles, disabledStyles, pressedStyles } = (0, react_1.useMemo)(() => getNavLinkStyles(variant, contrast), [variant, contrast]);
     const external = (0, utils_1.isAbsoluteUrl)(href) || openInNew;
     const linkAttributes = {
         className: components_1.navLink,
@@ -43,19 +43,19 @@ function NavLink(props) {
     return external ? ((0, jsx_runtime_1.jsx)("a", Object.assign({ href: href }, (0, react_aria_1.mergeProps)(otherButtonProps, focusProps, hoverProps), linkAttributes, { children: linkContent }), void 0)) : ((0, jsx_runtime_1.jsx)(react_router_dom_1.Link, Object.assign({ to: href }, (0, react_aria_1.mergeProps)(otherButtonProps, focusProps, hoverProps), linkAttributes, { children: linkContent }), void 0));
 }
 exports.NavLink = NavLink;
-function getNavLinkStyles(variant) {
-    return navLinkVariantStyles[variant];
+function getNavLinkStyles(variant, contrast) {
+    return navLinkVariantStyles(contrast)[variant];
 }
 exports.getNavLinkStyles = getNavLinkStyles;
 const baseStyles = Css_1.Css.df.aic.hPx(32).pyPx(6).px1.br4.smEm.outline0.$;
-const navLinkVariantStyles = {
+const navLinkVariantStyles = (contrast) => ({
     side: {
-        baseStyles: { ...baseStyles, ...Css_1.Css.gray700.$ },
-        activeStyles: Css_1.Css.lightBlue700.bgLightBlue50.$,
-        disabledStyles: Css_1.Css.gray400.cursorNotAllowed.$,
-        focusRingStyles: Css_1.Css.bgLightBlue50.bshFocus.$,
-        hoverStyles: Css_1.Css.gray700.bgGray100.$,
-        pressedStyles: Css_1.Css.gray700.bgGray200.$,
+        baseStyles: { ...baseStyles, ...Css_1.Css.gray700.if(contrast).gray600.$ },
+        activeStyles: Css_1.Css.lightBlue700.bgLightBlue50.if(contrast).white.bgGray700.$,
+        disabledStyles: Css_1.Css.gray400.cursorNotAllowed.if(contrast).gray800.$,
+        focusRingStyles: Css_1.Css.bgLightBlue50.bshFocus.if(contrast).bgGray700.white.$,
+        hoverStyles: Css_1.Css.gray700.bgGray100.if(contrast).bgGray800.gray600.$,
+        pressedStyles: Css_1.Css.gray700.bgGray200.if(contrast).bgGray200.gray800.$,
     },
     global: {
         baseStyles: { ...baseStyles, ...Css_1.Css.add("width", "max-content").gray500.$ },
@@ -64,5 +64,5 @@ const navLinkVariantStyles = {
         focusRingStyles: Css_1.Css.gray500.bgGray900.add("boxShadow", `0px 1px 2px rgba(0, 0, 0, 0.05), 0px 0px 0px 2px #242424, 0px 0px 0px 4px #0EA5E9`).$,
         hoverStyles: Css_1.Css.gray500.bgGray900.$,
         pressedStyles: Css_1.Css.gray500.bgGray700.$,
-    },
-};
+    }
+});

package/dist/forms/BoundDateField.js

@@ -8,12 +8,12 @@ const utils_1 = require("../utils");
 const defaultLabel_1 = require("../utils/defaultLabel");
 /** Wraps `TextField` and binds it to a form field. */
 function BoundDateField(props) {
-    const { field, onChange = (value) => field.set(value), label = (0, defaultLabel_1.defaultLabel)(field.key), onBlur, onFocus, onEnter, ...others } = props;
+    const { field, readOnly, onChange = (value) => field.set(value), label = (0, defaultLabel_1.defaultLabel)(field.key), onBlur, onFocus, onEnter, ...others } = props;
     const testId = (0, utils_1.useTestIds)(props, field.key);
     return ((0, jsx_runtime_1.jsx)(mobx_react_1.Observer, { children: () => ((0, jsx_runtime_1.jsx)(inputs_1.DateField, Object.assign({ label: label, value: field.value || undefined, onChange: (value) => {
                 onChange(value);
                 field.maybeAutoSave();
-            }, errorMsg: field.touched ? field.errors.join(" ") : undefined, required: field.required, onBlur: () => {
+            }, readOnly: readOnly !== null && readOnly !== void 0 ? readOnly : field.readOnly, errorMsg: field.touched ? field.errors.join(" ") : undefined, required: field.required, onBlur: () => {
                 field.blur();
                 (0, utils_1.maybeCall)(onBlur);
             }, onFocus: () => {

package/package.json

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