@mirror-physics/fractal-ui 0.2.0-next.42 → 0.2.0-next.43

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.cjs CHANGED
@@ -939,25 +939,42 @@ Chip.displayName = "Chip";
939
939
  // src/components/Checkbox/Checkbox.tsx
940
940
  var import_fractal_icons6 = require("@mirror-physics/fractal-icons");
941
941
  var import_jsx_runtime16 = require("react/jsx-runtime");
942
- function Checkbox({ checked, onCheckedChange, className, disabled, onClick, onKeyDown, ...props }) {
942
+ function Checkbox({
943
+ checked,
944
+ indeterminate = false,
945
+ onCheckedChange,
946
+ className,
947
+ disabled,
948
+ onClick,
949
+ onKeyDown,
950
+ ...props
951
+ }) {
943
952
  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
944
953
  "button",
945
954
  {
946
955
  ...props,
947
- className: cn("fractal-checkbox", checked && "fractal-checkbox--checked", className),
956
+ className: cn(
957
+ "fractal-checkbox",
958
+ (checked || indeterminate) && "fractal-checkbox--checked",
959
+ indeterminate && "fractal-checkbox--indeterminate",
960
+ className
961
+ ),
948
962
  type: "button",
949
963
  role: "checkbox",
950
- "aria-checked": checked,
964
+ "aria-checked": indeterminate ? "mixed" : checked,
951
965
  disabled,
952
966
  onClick: (event) => {
953
967
  onClick?.(event);
954
- if (!event.defaultPrevented) onCheckedChange(!checked);
968
+ if (!event.defaultPrevented) onCheckedChange(indeterminate || !checked);
955
969
  },
956
970
  onKeyDown: (event) => {
957
971
  onKeyDown?.(event);
958
972
  if (event.key === " " || event.key === "Enter") event.stopPropagation();
959
973
  },
960
- children: checked ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_fractal_icons6.CheckboxChecked, { "aria-hidden": "true", size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_fractal_icons6.Checkbox, { "aria-hidden": "true", size: 18 })
974
+ children: indeterminate ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("span", { className: "fractal-checkbox__indeterminate-icon", "aria-hidden": "true", children: [
975
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_fractal_icons6.Checkbox, { size: 18 }),
976
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_fractal_icons6.Minus, { className: "fractal-checkbox__indeterminate-mark", size: 12 })
977
+ ] }) : checked ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_fractal_icons6.CheckboxChecked, { "aria-hidden": "true", size: 18 }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_fractal_icons6.Checkbox, { "aria-hidden": "true", size: 18 })
961
978
  }
962
979
  );
963
980
  }