@hybridcore/ui 1.5.90 → 1.6.1

package/dist/FormControlLabel-BkRfrhNy.js

@@ -0,0 +1,601 @@
+import { a as l, _ as j } from "./objectWithoutPropertiesLoose-DJteAcBH.js";
+import * as P from "react";
+import { P as e } from "./index-C__OZmYy.js";
+import { b as E, g as _, s as L, c as T, a as M, r as ne, u as G } from "./styled-Bsjp3kFh.js";
+import { alpha as ae } from "@mui/system";
+import { u as J, f as se } from "./InputLabel-rEwwnD4_.js";
+import { jsxs as K, jsx as b } from "react/jsx-runtime";
+import { B as re, r as q } from "./ButtonBase-sObABYY2.js";
+import { u as le } from "./useControlled-BYdyS7Pn.js";
+import { c as $ } from "./capitalize-quqpGCFu.js";
+import { c as U } from "./createSvgIcon-DX-SqL8M.js";
+import { T as A } from "./Typography-B-Z5Y0Xq.js";
+function ce(o) {
+  return E("PrivateSwitchBase", o);
+}
+_("PrivateSwitchBase", ["root", "checked", "disabled", "input", "edgeStart", "edgeEnd"]);
+const ie = ["autoFocus", "checked", "checkedIcon", "className", "defaultChecked", "disabled", "disableFocusRipple", "edge", "icon", "id", "inputProps", "inputRef", "name", "onBlur", "onChange", "onFocus", "readOnly", "required", "tabIndex", "type", "value"], de = (o) => {
+  const {
+    classes: t,
+    checked: a,
+    disabled: s,
+    edge: n
+  } = o, r = {
+    root: ["root", a && "checked", s && "disabled", n && `edge${$(n)}`],
+    input: ["input"]
+  };
+  return M(r, ce, t);
+}, pe = L(re)(({
+  ownerState: o
+}) => l({
+  padding: 9,
+  borderRadius: "50%"
+}, o.edge === "start" && {
+  marginLeft: o.size === "small" ? -3 : -12
+}, o.edge === "end" && {
+  marginRight: o.size === "small" ? -3 : -12
+})), ue = L("input")({
+  cursor: "inherit",
+  position: "absolute",
+  opacity: 0,
+  width: "100%",
+  height: "100%",
+  top: 0,
+  left: 0,
+  margin: 0,
+  padding: 0,
+  zIndex: 1
+}), Q = /* @__PURE__ */ P.forwardRef(function(t, a) {
+  const {
+    autoFocus: s,
+    checked: n,
+    checkedIcon: r,
+    className: x,
+    defaultChecked: i,
+    disabled: R,
+    disableFocusRipple: d = !1,
+    edge: v = !1,
+    icon: I,
+    id: g,
+    inputProps: F,
+    inputRef: y,
+    name: c,
+    onBlur: m,
+    onChange: C,
+    onFocus: f,
+    readOnly: N,
+    required: B = !1,
+    tabIndex: k,
+    type: p,
+    value: V
+  } = t, X = j(t, ie), [D, Y] = le({
+    controlled: n,
+    default: !!i,
+    name: "SwitchBase",
+    state: "checked"
+  }), h = J(), Z = (u) => {
+    f && f(u), h && h.onFocus && h.onFocus(u);
+  }, ee = (u) => {
+    m && m(u), h && h.onBlur && h.onBlur(u);
+  }, oe = (u) => {
+    if (u.nativeEvent.defaultPrevented)
+      return;
+    const W = u.target.checked;
+    Y(W), C && C(u, W);
+  };
+  let O = R;
+  h && typeof O > "u" && (O = h.disabled);
+  const te = p === "checkbox" || p === "radio", z = l({}, t, {
+    checked: D,
+    disabled: O,
+    disableFocusRipple: d,
+    edge: v
+  }), H = de(z);
+  return /* @__PURE__ */ K(pe, l({
+    component: "span",
+    className: T(H.root, x),
+    centerRipple: !0,
+    focusRipple: !d,
+    disabled: O,
+    tabIndex: null,
+    role: void 0,
+    onFocus: Z,
+    onBlur: ee,
+    ownerState: z,
+    ref: a
+  }, X, {
+    children: [/* @__PURE__ */ b(ue, l({
+      autoFocus: s,
+      checked: n,
+      defaultChecked: i,
+      className: H.input,
+      disabled: O,
+      id: te ? g : void 0,
+      name: c,
+      onChange: oe,
+      readOnly: N,
+      ref: y,
+      required: B,
+      ownerState: z,
+      tabIndex: k,
+      type: p
+    }, p === "checkbox" && V === void 0 ? {} : {
+      value: V
+    }, F)), D ? r : I]
+  }));
+});
+process.env.NODE_ENV !== "production" && (Q.propTypes = {
+  /**
+   * If `true`, the `input` element is focused during the first mount.
+   */
+  autoFocus: e.bool,
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: e.bool,
+  /**
+   * The icon to display when the component is checked.
+   */
+  checkedIcon: e.node.isRequired,
+  /**
+   * Override or extend the styles applied to the component.
+   * See [CSS API](#css) below for more details.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * @ignore
+   */
+  defaultChecked: e.bool,
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: e.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: e.bool,
+  /**
+   * If given, uses a negative margin to counteract the padding on one
+   * side (this is often helpful for aligning the left or right
+   * side of the icon with content above or below, without ruining the border
+   * size and shape).
+   * @default false
+   */
+  edge: e.oneOf(["end", "start", !1]),
+  /**
+   * The icon to display when the component is unchecked.
+   */
+  icon: e.node.isRequired,
+  /**
+   * The id of the `input` element.
+   */
+  id: e.string,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: e.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: q,
+  /*
+   * @ignore
+   */
+  name: e.string,
+  /**
+   * @ignore
+   */
+  onBlur: e.func,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {object} event The event source of the callback.
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: e.func,
+  /**
+   * @ignore
+   */
+  onFocus: e.func,
+  /**
+   * It prevents the user from changing the value of the field
+   * (not from interacting with the field).
+   */
+  readOnly: e.bool,
+  /**
+   * If `true`, the `input` element is required.
+   */
+  required: e.bool,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.object,
+  /**
+   * @ignore
+   */
+  tabIndex: e.oneOfType([e.number, e.string]),
+  /**
+   * The input component prop `type`.
+   */
+  type: e.string.isRequired,
+  /**
+   * The value of the component.
+   */
+  value: e.any
+});
+const be = U(/* @__PURE__ */ b("path", {
+  d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+}), "CheckBoxOutlineBlank"), me = U(/* @__PURE__ */ b("path", {
+  d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
+}), "CheckBox"), fe = U(/* @__PURE__ */ b("path", {
+  d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z"
+}), "IndeterminateCheckBox");
+function he(o) {
+  return E("MuiCheckbox", o);
+}
+const w = _("MuiCheckbox", ["root", "checked", "disabled", "indeterminate", "colorPrimary", "colorSecondary"]), ge = ["checkedIcon", "color", "icon", "indeterminate", "indeterminateIcon", "inputProps", "size", "className"], ye = (o) => {
+  const {
+    classes: t,
+    indeterminate: a,
+    color: s
+  } = o, n = {
+    root: ["root", a && "indeterminate", `color${$(s)}`]
+  }, r = M(n, he, t);
+  return l({}, t, r);
+}, Ce = L(Q, {
+  shouldForwardProp: (o) => ne(o) || o === "classes",
+  name: "MuiCheckbox",
+  slot: "Root",
+  overridesResolver: (o, t) => {
+    const {
+      ownerState: a
+    } = o;
+    return [t.root, a.indeterminate && t.indeterminate, a.color !== "default" && t[`color${$(a.color)}`]];
+  }
+})(({
+  theme: o,
+  ownerState: t
+}) => l({
+  color: (o.vars || o).palette.text.secondary
+}, !t.disableRipple && {
+  "&:hover": {
+    backgroundColor: o.vars ? `rgba(${t.color === "default" ? o.vars.palette.action.activeChannel : o.vars.palette.primary.mainChannel} / ${o.vars.palette.action.hoverOpacity})` : ae(t.color === "default" ? o.palette.action.active : o.palette[t.color].main, o.palette.action.hoverOpacity),
+    // Reset on touch devices, it doesn't add specificity
+    "@media (hover: none)": {
+      backgroundColor: "transparent"
+    }
+  }
+}, t.color !== "default" && {
+  [`&.${w.checked}, &.${w.indeterminate}`]: {
+    color: (o.vars || o).palette[t.color].main
+  },
+  [`&.${w.disabled}`]: {
+    color: (o.vars || o).palette.action.disabled
+  }
+})), ke = /* @__PURE__ */ b(me, {}), ve = /* @__PURE__ */ b(be, {}), Pe = /* @__PURE__ */ b(fe, {}), xe = /* @__PURE__ */ P.forwardRef(function(t, a) {
+  var s, n;
+  const r = G({
+    props: t,
+    name: "MuiCheckbox"
+  }), {
+    checkedIcon: x = ke,
+    color: i = "primary",
+    icon: R = ve,
+    indeterminate: d = !1,
+    indeterminateIcon: v = Pe,
+    inputProps: I,
+    size: g = "medium",
+    className: F
+  } = r, y = j(r, ge), c = d ? v : R, m = d ? v : x, C = l({}, r, {
+    color: i,
+    indeterminate: d,
+    size: g
+  }), f = ye(C);
+  return /* @__PURE__ */ b(Ce, l({
+    type: "checkbox",
+    inputProps: l({
+      "data-indeterminate": d
+    }, I),
+    icon: /* @__PURE__ */ P.cloneElement(c, {
+      fontSize: (s = c.props.fontSize) != null ? s : g
+    }),
+    checkedIcon: /* @__PURE__ */ P.cloneElement(m, {
+      fontSize: (n = m.props.fontSize) != null ? n : g
+    }),
+    ownerState: C,
+    ref: a,
+    className: T(f.root, F)
+  }, y, {
+    classes: f
+  }));
+});
+process.env.NODE_ENV !== "production" && (xe.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: e.bool,
+  /**
+   * The icon to display when the component is checked.
+   * @default <CheckBoxIcon />
+   */
+  checkedIcon: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
+   * @default 'primary'
+   */
+  color: e.oneOfType([e.oneOf(["default", "primary", "secondary", "error", "info", "success", "warning"]), e.string]),
+  /**
+   * The default checked state. Use when the component is not controlled.
+   */
+  defaultChecked: e.bool,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: e.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   * @default false
+   */
+  disableRipple: e.bool,
+  /**
+   * The icon to display when the component is unchecked.
+   * @default <CheckBoxOutlineBlankIcon />
+   */
+  icon: e.node,
+  /**
+   * The id of the `input` element.
+   */
+  id: e.string,
+  /**
+   * If `true`, the component appears indeterminate.
+   * This does not set the native input element to indeterminate due
+   * to inconsistent behavior across browsers.
+   * However, we set a `data-indeterminate` attribute on the `input`.
+   * @default false
+   */
+  indeterminate: e.bool,
+  /**
+   * The icon to display when the component is indeterminate.
+   * @default <IndeterminateCheckBoxIcon />
+   */
+  indeterminateIcon: e.node,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: e.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: q,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: e.func,
+  /**
+   * If `true`, the `input` element is required.
+   * @default false
+   */
+  required: e.bool,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense checkbox styling.
+   * @default 'medium'
+   */
+  size: e.oneOfType([e.oneOf(["medium", "small"]), e.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The value of the component. The DOM API casts this to a string.
+   * The browser uses "on" as the default value.
+   */
+  value: e.any
+});
+function Re(o) {
+  return E("MuiFormControlLabel", o);
+}
+const S = _("MuiFormControlLabel", ["root", "labelPlacementStart", "labelPlacementTop", "labelPlacementBottom", "disabled", "label", "error"]), Ie = ["checked", "className", "componentsProps", "control", "disabled", "disableTypography", "inputRef", "label", "labelPlacement", "name", "onChange", "slotProps", "value"], Fe = (o) => {
+  const {
+    classes: t,
+    disabled: a,
+    labelPlacement: s,
+    error: n
+  } = o, r = {
+    root: ["root", a && "disabled", `labelPlacement${$(s)}`, n && "error"],
+    label: ["label", a && "disabled"]
+  };
+  return M(r, Re, t);
+}, Be = L("label", {
+  name: "MuiFormControlLabel",
+  slot: "Root",
+  overridesResolver: (o, t) => {
+    const {
+      ownerState: a
+    } = o;
+    return [{
+      [`& .${S.label}`]: t.label
+    }, t.root, t[`labelPlacement${$(a.labelPlacement)}`]];
+  }
+})(({
+  theme: o,
+  ownerState: t
+}) => l({
+  display: "inline-flex",
+  alignItems: "center",
+  cursor: "pointer",
+  // For correct alignment with the text.
+  verticalAlign: "middle",
+  WebkitTapHighlightColor: "transparent",
+  marginLeft: -11,
+  marginRight: 16,
+  // used for row presentation of radio/checkbox
+  [`&.${S.disabled}`]: {
+    cursor: "default"
+  }
+}, t.labelPlacement === "start" && {
+  flexDirection: "row-reverse",
+  marginLeft: 16,
+  // used for row presentation of radio/checkbox
+  marginRight: -11
+}, t.labelPlacement === "top" && {
+  flexDirection: "column-reverse",
+  marginLeft: 16
+}, t.labelPlacement === "bottom" && {
+  flexDirection: "column",
+  marginLeft: 16
+}, {
+  [`& .${S.label}`]: {
+    [`&.${S.disabled}`]: {
+      color: (o.vars || o).palette.text.disabled
+    }
+  }
+})), Oe = /* @__PURE__ */ P.forwardRef(function(t, a) {
+  var s;
+  const n = G({
+    props: t,
+    name: "MuiFormControlLabel"
+  }), {
+    className: r,
+    componentsProps: x = {},
+    control: i,
+    disabled: R,
+    disableTypography: d,
+    label: v,
+    labelPlacement: I = "end",
+    slotProps: g = {}
+  } = n, F = j(n, Ie), y = J();
+  let c = R;
+  typeof c > "u" && typeof i.props.disabled < "u" && (c = i.props.disabled), typeof c > "u" && y && (c = y.disabled);
+  const m = {
+    disabled: c
+  };
+  ["checked", "name", "onChange", "value", "inputRef"].forEach((p) => {
+    typeof i.props[p] > "u" && typeof n[p] < "u" && (m[p] = n[p]);
+  });
+  const C = se({
+    props: n,
+    muiFormControl: y,
+    states: ["error"]
+  }), f = l({}, n, {
+    disabled: c,
+    labelPlacement: I,
+    error: C.error
+  }), N = Fe(f), B = (s = g.typography) != null ? s : x.typography;
+  let k = v;
+  return k != null && k.type !== A && !d && (k = /* @__PURE__ */ b(A, l({
+    component: "span"
+  }, B, {
+    className: T(N.label, B == null ? void 0 : B.className),
+    children: k
+  }))), /* @__PURE__ */ K(Be, l({
+    className: T(N.root, r),
+    ownerState: f,
+    ref: a
+  }, F, {
+    children: [/* @__PURE__ */ P.cloneElement(i, m), k]
+  }));
+});
+process.env.NODE_ENV !== "production" && (Oe.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * If `true`, the component appears selected.
+   */
+  checked: e.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  componentsProps: e.shape({
+    typography: e.object
+  }),
+  /**
+   * A control element. For instance, it can be a `Radio`, a `Switch` or a `Checkbox`.
+   */
+  control: e.element.isRequired,
+  /**
+   * If `true`, the control is disabled.
+   */
+  disabled: e.bool,
+  /**
+   * If `true`, the label is rendered as it is passed without an additional typography node.
+   */
+  disableTypography: e.bool,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: q,
+  /**
+   * A text or an element to be used in an enclosing label element.
+   */
+  label: e.node,
+  /**
+   * The position of the label.
+   * @default 'end'
+   */
+  labelPlacement: e.oneOf(["bottom", "end", "start", "top"]),
+  /**
+   * @ignore
+   */
+  name: e.string,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.SyntheticEvent} event The event source of the callback.
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: e.func,
+  /**
+   * The props used for each slot inside.
+   * @default {}
+   */
+  slotProps: e.shape({
+    typography: e.object
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The value of the component.
+   */
+  value: e.any
+});
+export {
+  xe as C,
+  Oe as F
+};