@homebound/beam 2.417.9 → 2.417.11

package/dist/index.cjs

@@ -5557,15 +5557,10 @@ function Day(props) {
       ...otherProps,
       ref: buttonRef,
       type: "button",
-      css: {
-        ...Css.relative.pbPx(4).outline0.if(disabled).cursorNotAllowed.$,
-        // Do not apply interaction styles for disabled or already selected days.
-        ...!selected && !disabled && {
-          "&:hover:not(:active) > div": Css.bgGray100.$
-        },
-        ...!disabled && { "&:active > div": Css.bgGray400.gray900.$ },
-        "&:focus:not(:active) > div": Css.ba.bcBlue700.if(selected).bcBlue900.$
-      },
+      className: "beam-day-button",
+      css: Css.relative.pbPx(4).outline0.if(disabled).cursorNotAllowed.$,
+      ...selected && { "data-selected": "" },
+      ...disabled && { "data-disabled": "" },
       ...tid,
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
@@ -10006,7 +10001,7 @@ var disabledSelectedBoxStyles = Css.bgGray400.bcGray400.$;
 var disabledColor = Css.gray300.$;
 var focusRingStyles = Css.bshFocus.$;
 var hoverBorderStyles = Css.bcBlue900.$;
-var markStyles = { ">svg": Css.absolute.topPx(-1).leftPx(-1).$ };
+var markSvgStyles = Css.absolute.topPx(-1).leftPx(-1).$;
 var labelStyles = Css.sm.$;
 var descStyles = Css.sm.gray700.$;
 function StyledCheckbox(props) {
@@ -10025,8 +10020,7 @@ function StyledCheckbox(props) {
         ...isDisabled && disabledBoxStyles,
         ...isDisabled && isSelected && disabledSelectedBoxStyles,
         ...isFocusVisible && focusRingStyles,
-        ...isHovered && hoverBorderStyles,
-        ...markStyles
+        ...isHovered && hoverBorderStyles
       },
       "aria-hidden": "true",
       "data-checked": isSelected ? true : isIndeterminate ? "mixed" : false,
@@ -10035,14 +10029,14 @@ function StyledCheckbox(props) {
     }
   );
 }
-var checkmarkSmall = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("svg", { width: "16", height: "16", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
+var checkmarkSmall = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("svg", { width: "16", height: "16", css: markSvgStyles, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
   "path",
   {
     d: "M6.66669 10.3907L4.47135 8.19533L3.52869 9.138L6.66669 12.276L13.138 5.80467L12.1954 4.862L6.66669 10.3907Z",
     fill: "rgba(255,255,255,1)" /* White */
   }
 ) });
-var dashSmall = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("svg", { width: "16", height: "16", children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("rect", { x: "4", y: "7.5", width: "8", height: "1.35", fill: "rgba(255,255,255,1)" /* White */ }) });
+var dashSmall = /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("svg", { width: "16", height: "16", css: markSvgStyles, children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)("rect", { x: "4", y: "7.5", width: "8", height: "1.35", fill: "rgba(255,255,255,1)" /* White */ }) });
 
 // src/inputs/TreeSelectField/TreeOption.tsx
 var import_jsx_runtime50 = require("@emotion/react/jsx-runtime");
@@ -15966,30 +15960,17 @@ function FormLines(props) {
     ..."labelLeftFieldWidth" in props ? { labelLeftFieldWidth } : {},
     ...width2 === "full" ? { fullWidth: true } : {}
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(PresentationProvider, { fieldProps: newFieldProps, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
-    "div",
-    {
-      css: {
-        // Note that we're purposefully not using display:flex so that our children's margins will collapse.
-        ...Css.w(sizes[width2]).$
-      },
-      children: import_react85.Children.map(children, (child) => {
-        if (child === null || child === void 0 || typeof child === "boolean") {
-          return child;
-        }
-        if (child && typeof child === "object" && "type" in child && child.type.isFormHeading) {
-          const clone = (0, import_react85.cloneElement)(child, { isFirst: firstFormHeading });
-          firstFormHeading = false;
-          return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { css: Css.mb(gap).$, children: clone });
-        } else {
-          return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { css: Css.mb(gap).$, children: child });
-        }
-      })
+  return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(PresentationProvider, { fieldProps: newFieldProps, children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { css: Css.df.fdc.gap(gap).pb(gap).w(sizes[width2]).$, children: import_react85.Children.map(children, (child) => {
+    if (child && typeof child === "object" && "type" in child && child.type.isFormHeading) {
+      const clone = (0, import_react85.cloneElement)(child, { isFirst: firstFormHeading });
+      firstFormHeading = false;
+      return clone;
     }
-  ) });
+    return child;
+  }) }) });
 }
 function FormDivider() {
-  return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { css: Css.hPx(1).my2.bgGray200.$ });
+  return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { css: Css.hPx(1).bgGray200.$ });
 }
 function FieldGroup(props) {
   const { title, children, widths: widths2 = [] } = props;
@@ -16225,22 +16206,13 @@ function BoundSelectAndTextField(props) {
 }
 
 // src/forms/FormHeading.tsx
-var import_jsx_runtime118 = require("@emotion/react/jsx-runtime");
+var import_jsx_runtime118 = (
+  // Add space before the heading, but only if it's not first.
+  require("@emotion/react/jsx-runtime")
+);
 function FormHeading(props) {
   const { title, xss, isFirst = false, ...others } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
-    "h3",
-    {
-      css: {
-        ...Css.md.$,
-        // Add space before the heading, but only if it's not first.
-        ...!isFirst && Css.mt4.$,
-        ...xss
-      },
-      ...others,
-      children: title
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("h3", { css: { ...Css.md.if(!isFirst).mt1.$, ...xss }, ...others, children: title });
 }
 FormHeading.isFormHeading = true;