@notificationapi/react 0.0.37 → 1.0.1

package/dist/assets/Divider.js

@@ -0,0 +1,343 @@
+import * as l from "react";
+import { g as A, a as R, s as x, m as w, b as $, u as S, c as T, P as r, f as V } from "./DefaultPropsProvider.js";
+import { jsx as v } from "react/jsx-runtime";
+let b = 0;
+function L(t) {
+  const [e, i] = l.useState(t), o = t || e;
+  return l.useEffect(() => {
+    e == null && (b += 1, i(`mui-${b}`));
+  }, [e]), o;
+}
+const N = {
+  ...l
+}, m = N.useId;
+function k(t) {
+  if (m !== void 0) {
+    const e = m();
+    return t ?? e;
+  }
+  return L(t);
+}
+function z({
+  controlled: t,
+  default: e,
+  name: i,
+  state: o = "value"
+}) {
+  const {
+    current: n
+  } = l.useRef(t !== void 0), [d, a] = l.useState(e), s = n ? t : d;
+  if (process.env.NODE_ENV !== "production") {
+    l.useEffect(() => {
+      n !== (t !== void 0) && console.error([`MUI: A component is changing the ${n ? "" : "un"}controlled ${o} state of ${i} to be ${n ? "un" : ""}controlled.`, "Elements should not switch from uncontrolled to controlled (or vice versa).", `Decide between using a controlled or uncontrolled ${i} element for the lifetime of the component.`, "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.", "More info: https://fb.me/react-controlled-components"].join(`
+`));
+    }, [o, i, t]);
+    const {
+      current: p
+    } = l.useRef(e);
+    l.useEffect(() => {
+      !n && !Object.is(p, e) && console.error([`MUI: A component is changing the default ${o} state of an uncontrolled ${i} after being initialized. To suppress this warning opt to use a controlled ${i}.`].join(`
+`));
+    }, [JSON.stringify(e)]);
+  }
+  const c = l.useCallback((p) => {
+    n || a(p);
+  }, []);
+  return [s, c];
+}
+function O(t) {
+  return R("MuiDivider", t);
+}
+A("MuiDivider", ["root", "absolute", "fullWidth", "inset", "middle", "flexItem", "light", "vertical", "withChildren", "withChildrenVertical", "textAlignRight", "textAlignLeft", "wrapper", "wrapperVertical"]);
+const W = (t) => {
+  const {
+    absolute: e,
+    children: i,
+    classes: o,
+    flexItem: n,
+    light: d,
+    orientation: a,
+    textAlign: s,
+    variant: c
+  } = t;
+  return V({
+    root: ["root", e && "absolute", c, d && "light", a === "vertical" && "vertical", n && "flexItem", i && "withChildren", i && a === "vertical" && "withChildrenVertical", s === "right" && a !== "vertical" && "textAlignRight", s === "left" && a !== "vertical" && "textAlignLeft"],
+    wrapper: ["wrapper", a === "vertical" && "wrapperVertical"]
+  }, O, o);
+}, E = x("div", {
+  name: "MuiDivider",
+  slot: "Root",
+  overridesResolver: (t, e) => {
+    const {
+      ownerState: i
+    } = t;
+    return [e.root, i.absolute && e.absolute, e[i.variant], i.light && e.light, i.orientation === "vertical" && e.vertical, i.flexItem && e.flexItem, i.children && e.withChildren, i.children && i.orientation === "vertical" && e.withChildrenVertical, i.textAlign === "right" && i.orientation !== "vertical" && e.textAlignRight, i.textAlign === "left" && i.orientation !== "vertical" && e.textAlignLeft];
+  }
+})(w(({
+  theme: t
+}) => ({
+  margin: 0,
+  // Reset browser default style.
+  flexShrink: 0,
+  borderWidth: 0,
+  borderStyle: "solid",
+  borderColor: (t.vars || t).palette.divider,
+  borderBottomWidth: "thin",
+  variants: [{
+    props: {
+      absolute: !0
+    },
+    style: {
+      position: "absolute",
+      bottom: 0,
+      left: 0,
+      width: "100%"
+    }
+  }, {
+    props: {
+      light: !0
+    },
+    style: {
+      borderColor: t.vars ? `rgba(${t.vars.palette.dividerChannel} / 0.08)` : $(t.palette.divider, 0.08)
+    }
+  }, {
+    props: {
+      variant: "inset"
+    },
+    style: {
+      marginLeft: 72
+    }
+  }, {
+    props: {
+      variant: "middle",
+      orientation: "horizontal"
+    },
+    style: {
+      marginLeft: t.spacing(2),
+      marginRight: t.spacing(2)
+    }
+  }, {
+    props: {
+      variant: "middle",
+      orientation: "vertical"
+    },
+    style: {
+      marginTop: t.spacing(1),
+      marginBottom: t.spacing(1)
+    }
+  }, {
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      height: "100%",
+      borderBottomWidth: 0,
+      borderRightWidth: "thin"
+    }
+  }, {
+    props: {
+      flexItem: !0
+    },
+    style: {
+      alignSelf: "stretch",
+      height: "auto"
+    }
+  }, {
+    props: ({
+      ownerState: e
+    }) => !!e.children,
+    style: {
+      display: "flex",
+      textAlign: "center",
+      border: 0,
+      borderTopStyle: "solid",
+      borderLeftStyle: "solid",
+      "&::before, &::after": {
+        content: '""',
+        alignSelf: "center"
+      }
+    }
+  }, {
+    props: ({
+      ownerState: e
+    }) => e.children && e.orientation !== "vertical",
+    style: {
+      "&::before, &::after": {
+        width: "100%",
+        borderTop: `thin solid ${(t.vars || t).palette.divider}`,
+        borderTopStyle: "inherit"
+      }
+    }
+  }, {
+    props: ({
+      ownerState: e
+    }) => e.orientation === "vertical" && e.children,
+    style: {
+      flexDirection: "column",
+      "&::before, &::after": {
+        height: "100%",
+        borderLeft: `thin solid ${(t.vars || t).palette.divider}`,
+        borderLeftStyle: "inherit"
+      }
+    }
+  }, {
+    props: ({
+      ownerState: e
+    }) => e.textAlign === "right" && e.orientation !== "vertical",
+    style: {
+      "&::before": {
+        width: "90%"
+      },
+      "&::after": {
+        width: "10%"
+      }
+    }
+  }, {
+    props: ({
+      ownerState: e
+    }) => e.textAlign === "left" && e.orientation !== "vertical",
+    style: {
+      "&::before": {
+        width: "10%"
+      },
+      "&::after": {
+        width: "90%"
+      }
+    }
+  }]
+}))), M = x("span", {
+  name: "MuiDivider",
+  slot: "Wrapper",
+  overridesResolver: (t, e) => {
+    const {
+      ownerState: i
+    } = t;
+    return [e.wrapper, i.orientation === "vertical" && e.wrapperVertical];
+  }
+})(w(({
+  theme: t
+}) => ({
+  display: "inline-block",
+  paddingLeft: `calc(${t.spacing(1)} * 1.2)`,
+  paddingRight: `calc(${t.spacing(1)} * 1.2)`,
+  whiteSpace: "nowrap",
+  variants: [{
+    props: {
+      orientation: "vertical"
+    },
+    style: {
+      paddingTop: `calc(${t.spacing(1)} * 1.2)`,
+      paddingBottom: `calc(${t.spacing(1)} * 1.2)`
+    }
+  }]
+}))), h = /* @__PURE__ */ l.forwardRef(function(e, i) {
+  const o = S({
+    props: e,
+    name: "MuiDivider"
+  }), {
+    absolute: n = !1,
+    children: d,
+    className: a,
+    orientation: s = "horizontal",
+    component: c = d || s === "vertical" ? "div" : "hr",
+    flexItem: p = !1,
+    light: y = !1,
+    role: f = c !== "hr" ? "separator" : void 0,
+    textAlign: I = "center",
+    variant: C = "fullWidth",
+    ...D
+  } = o, u = {
+    ...o,
+    absolute: n,
+    component: c,
+    flexItem: p,
+    light: y,
+    orientation: s,
+    role: f,
+    textAlign: I,
+    variant: C
+  }, g = W(u);
+  return /* @__PURE__ */ v(E, {
+    as: c,
+    className: T(g.root, a),
+    role: f,
+    ref: i,
+    ownerState: u,
+    "aria-orientation": f === "separator" && (c !== "hr" || s === "vertical") ? s : void 0,
+    ...D,
+    children: d ? /* @__PURE__ */ v(M, {
+      className: g.wrapper,
+      ownerState: u,
+      children: d
+    }) : null
+  });
+});
+h && (h.muiSkipListHighlight = !0);
+process.env.NODE_ENV !== "production" && (h.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Absolutely position the element.
+   * @default false
+   */
+  absolute: r.bool,
+  /**
+   * The content of the component.
+   */
+  children: r.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: r.object,
+  /**
+   * @ignore
+   */
+  className: r.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: r.elementType,
+  /**
+   * If `true`, a vertical divider will have the correct height when used in flex container.
+   * (By default, a vertical divider will have a calculated height of `0px` if it is the child of a flex container.)
+   * @default false
+   */
+  flexItem: r.bool,
+  /**
+   * If `true`, the divider will have a lighter color.
+   * @default false
+   * @deprecated Use <Divider sx={{ opacity: 0.6 }} /> (or any opacity or color) instead. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
+   */
+  light: r.bool,
+  /**
+   * The component orientation.
+   * @default 'horizontal'
+   */
+  orientation: r.oneOf(["horizontal", "vertical"]),
+  /**
+   * @ignore
+   */
+  role: r.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: r.oneOfType([r.arrayOf(r.oneOfType([r.func, r.object, r.bool])), r.func, r.object]),
+  /**
+   * The text alignment.
+   * @default 'center'
+   */
+  textAlign: r.oneOf(["center", "left", "right"]),
+  /**
+   * The variant to use.
+   * @default 'fullWidth'
+   */
+  variant: r.oneOfType([r.oneOf(["fullWidth", "inset", "middle"]), r.string])
+});
+export {
+  h as D,
+  k as a,
+  z as u
+};

package/dist/assets/IconButton.js

@@ -0,0 +1,225 @@
+import * as c from "react";
+import { g as z, a as R, s as I, h as a, m as g, b as f, u as O, c as C, P as e, f as h } from "./DefaultPropsProvider.js";
+import { c as y } from "./createSimplePaletteValueFilter.js";
+import { jsx as T } from "react/jsx-runtime";
+import { B as S, c as $ } from "./ButtonBase.js";
+function x(o) {
+  return R("MuiIconButton", o);
+}
+const w = z("MuiIconButton", ["root", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorError", "colorInfo", "colorSuccess", "colorWarning", "edgeStart", "edgeEnd", "sizeSmall", "sizeMedium", "sizeLarge"]), j = (o) => {
+  const {
+    classes: t,
+    disabled: r,
+    color: s,
+    edge: n,
+    size: i
+  } = o, l = {
+    root: ["root", r && "disabled", s !== "default" && `color${a(s)}`, n && `edge${a(n)}`, `size${a(i)}`]
+  };
+  return h(l, x, t);
+}, k = I(S, {
+  name: "MuiIconButton",
+  slot: "Root",
+  overridesResolver: (o, t) => {
+    const {
+      ownerState: r
+    } = o;
+    return [t.root, r.color !== "default" && t[`color${a(r.color)}`], r.edge && t[`edge${a(r.edge)}`], t[`size${a(r.size)}`]];
+  }
+})(g(({
+  theme: o
+}) => ({
+  textAlign: "center",
+  flex: "0 0 auto",
+  fontSize: o.typography.pxToRem(24),
+  padding: 8,
+  borderRadius: "50%",
+  color: (o.vars || o).palette.action.active,
+  transition: o.transitions.create("background-color", {
+    duration: o.transitions.duration.shortest
+  }),
+  variants: [{
+    props: (t) => !t.disableRipple,
+    style: {
+      "--IconButton-hoverBg": o.vars ? `rgba(${o.vars.palette.action.activeChannel} / ${o.vars.palette.action.hoverOpacity})` : f(o.palette.action.active, o.palette.action.hoverOpacity),
+      "&:hover": {
+        backgroundColor: "var(--IconButton-hoverBg)",
+        // Reset on touch devices, it doesn't add specificity
+        "@media (hover: none)": {
+          backgroundColor: "transparent"
+        }
+      }
+    }
+  }, {
+    props: {
+      edge: "start"
+    },
+    style: {
+      marginLeft: -12
+    }
+  }, {
+    props: {
+      edge: "start",
+      size: "small"
+    },
+    style: {
+      marginLeft: -3
+    }
+  }, {
+    props: {
+      edge: "end"
+    },
+    style: {
+      marginRight: -12
+    }
+  }, {
+    props: {
+      edge: "end",
+      size: "small"
+    },
+    style: {
+      marginRight: -3
+    }
+  }]
+})), g(({
+  theme: o
+}) => ({
+  variants: [{
+    props: {
+      color: "inherit"
+    },
+    style: {
+      color: "inherit"
+    }
+  }, ...Object.entries(o.palette).filter(y()).map(([t]) => ({
+    props: {
+      color: t
+    },
+    style: {
+      color: (o.vars || o).palette[t].main
+    }
+  })), ...Object.entries(o.palette).filter(y()).map(([t]) => ({
+    props: {
+      color: t
+    },
+    style: {
+      "--IconButton-hoverBg": o.vars ? `rgba(${(o.vars || o).palette[t].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : f((o.vars || o).palette[t].main, o.palette.action.hoverOpacity)
+    }
+  })), {
+    props: {
+      size: "small"
+    },
+    style: {
+      padding: 5,
+      fontSize: o.typography.pxToRem(18)
+    }
+  }, {
+    props: {
+      size: "large"
+    },
+    style: {
+      padding: 12,
+      fontSize: o.typography.pxToRem(28)
+    }
+  }],
+  [`&.${w.disabled}`]: {
+    backgroundColor: "transparent",
+    color: (o.vars || o).palette.action.disabled
+  }
+}))), P = /* @__PURE__ */ c.forwardRef(function(t, r) {
+  const s = O({
+    props: t,
+    name: "MuiIconButton"
+  }), {
+    edge: n = !1,
+    children: i,
+    className: l,
+    color: v = "default",
+    disabled: p = !1,
+    disableFocusRipple: d = !1,
+    size: b = "medium",
+    ...m
+  } = s, u = {
+    ...s,
+    edge: n,
+    color: v,
+    disabled: p,
+    disableFocusRipple: d,
+    size: b
+  }, B = j(u);
+  return /* @__PURE__ */ T(k, {
+    className: C(B.root, l),
+    centerRipple: !0,
+    focusRipple: !d,
+    disabled: p,
+    ref: r,
+    ...m,
+    ownerState: u,
+    children: i
+  });
+});
+process.env.NODE_ENV !== "production" && (P.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The icon to display.
+   */
+  children: $(e.node, (o) => c.Children.toArray(o.children).some((r) => /* @__PURE__ */ c.isValidElement(r) && r.props.onClick) ? new Error(["MUI: You are providing an onClick event listener to a child of a button element.", "Prefer applying it to the IconButton directly.", "This guarantees that the whole <button> will be responsive to click events."].join(`
+`)) : null),
+  /**
+   * 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/#custom-colors).
+   * @default 'default'
+   */
+  color: e.oneOfType([e.oneOf(["inherit", "default", "primary", "secondary", "error", "info", "success", "warning"]), e.string]),
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: e.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: e.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: 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 size of the component.
+   * `small` is equivalent to the dense button styling.
+   * @default 'medium'
+   */
+  size: e.oneOfType([e.oneOf(["small", "medium", "large"]), 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])
+});
+export {
+  P as I
+};