@conveyorhq/arrow-ds 1.64.1 → 1.65.2

package/package.json

@@ -2,7 +2,7 @@
   "name": "@conveyorhq/arrow-ds",
   "author": "Conveyor",
   "license": "MIT",
-  "version": "1.64.1",
+  "version": "1.65.2",
   "description": "Arrow Design System",
   "repository": "https://github.com/conveyor/arrow-ds",
   "publishConfig": {

package/public/components/Checkbox/Checkbox.d.ts

@@ -1,10 +1,11 @@
 import { InputProps } from "../Input";
 import { StackProps } from "../Stack";
-export interface CheckboxProps extends InputProps {
+export declare type CheckboxProps = InputProps & {
     label?: string;
     hideRequiredStyles?: boolean;
     isRequired?: boolean;
-}
+    checked?: boolean | "indeterminate";
+};
 export declare const Checkbox: {
     ({ checked, children, className, disabled, id: idProp, label, onBlur, onChange, onClick, onFocus, hideRequiredStyles, isRequired, tabIndex, theme: themeProp, ...rest }: CheckboxProps): JSX.Element;
     Group: (props: StackProps) => JSX.Element;

package/public/components/Checkbox/Checkbox.js

@@ -59,10 +59,14 @@ const Checkbox = ({ checked, children, className, disabled = false, id: idProp,
     else if (isRequiredContext !== undefined) {
         calculatedRequired = isRequiredContext;
     }
+    const [isIndeterminate, setIndeterminate] = react_1.useState(false);
+    react_1.useEffect(() => {
+        setIndeterminate(typeof checked === "string" && checked === "indeterminate");
+    }, [checked]);
     const bareCheckbox = (react_1.default.createElement(Box_1.Box, { className: bem_1.bem(cn, { e: "BoxWrapper" }) },
-        react_1.default.createElement(Input_1.Input, Object.assign({ "aria-checked": checked ? "true" : "false", checked: checked, className: bem_1.bem(cn, { e: "Input" }), disabled: disabled, id: id, onChange: onChange, type: "checkbox", onFocus: onFocus, onBlur: onBlur, onClick: label ? handleClick : undefined, tabIndex: tabIndex }, rest)),
+        react_1.default.createElement(Input_1.Input, Object.assign({ "aria-checked": isIndeterminate ? "mixed" : checked, checked: checked, className: bem_1.bem(cn, { e: "Input" }), disabled: disabled, id: id, onChange: onChange, type: "checkbox", onFocus: onFocus, onBlur: onBlur, onClick: label ? handleClick : undefined, tabIndex: tabIndex }, rest)),
         react_1.default.createElement(Box_1.Box, { className: classnames_1.default(bem_1.bem(cn, { e: "Box" }), bem_1.bem(cn, { e: "Box", m: theme }), checked && bem_1.bem(cn, { e: "Box", m: "checked" })) }),
-        checked && (react_1.default.createElement(Icon_1.Icon, { className: classnames_1.default(bem_1.bem(cn, { e: "Check" }), bem_1.bem(cn, { e: "Check", m: theme })), icon: Icon_1.ICON_TYPE.CHECK }))));
+        checked && (react_1.default.createElement(Icon_1.Icon, { className: classnames_1.default(bem_1.bem(cn, { e: "Check" }), bem_1.bem(cn, { e: "Check", m: theme })), icon: isIndeterminate ? Icon_1.ICON_TYPE.MINUS : Icon_1.ICON_TYPE.CHECK }))));
     const checkboxWithLabel = label || children ? (react_1.default.createElement(Label_1.Label, { className: bem_1.bem(cn, { e: "Label" }), isRequired: calculatedRequired && !hideRequiredStyles },
         bareCheckbox,
         react_1.default.createElement(Text_1.Text, { as: "span", className: classnames_1.default(bem_1.bem(cn, { e: "LabelText" }), bem_1.bem(cn, { e: "LabelText", m: theme })) },

package/public/components/Modal/Modal.js

@@ -108,6 +108,15 @@ const Modal = (props) => {
             onClose();
         }
     });
+    react_1.useEffect(() => {
+        if (isOpen) {
+            document.body.classList.add("modal-open");
+        }
+        else {
+            document.body.classList.remove("modal-open");
+        }
+        return () => document.body.classList.remove("modal-open");
+    }, [isOpen]);
     return isOpen ? (react_1.default.createElement(context_1.ModalContext.Provider, { value: { onClose } },
         react_1.default.createElement(Portal_1.Portal, null,
             react_1.default.createElement(react_focus_lock_1.default, { autoFocus: autoFocus, returnFocus: true },

package/public/css/styles.css

@@ -8687,6 +8687,10 @@ override built-in Image component classes */
   padding-right: 128px;
 }
 
+.pl-4 {
+  padding-left: 16px;
+}
+
 .pb-20 {
   padding-bottom: 80px;
 }
@@ -8695,10 +8699,6 @@ override built-in Image component classes */
   padding-top: 8px;
 }
 
-.pl-4 {
-  padding-left: 16px;
-}
-
 .pt-3 {
   padding-top: 12px;
 }