@vidispine/vdt-mui 23.3.0-pre.2 → 23.3.0-pre.4

package/dist/es/inputs/BasicDateTimeInput/BasicDateTimeInput.js

@@ -1,116 +1,42 @@
 import { jsx as F } from "react/jsx-runtime";
-import e from "prop-types";
-import O from "@mui/material/TextField";
+import P from "@mui/material/TextField";
 const B = {
-  Root: O
-};
-function i({
-  name: t,
-  label: s,
-  value: n,
+  Root: P
+}, I = ({
+  name: e,
+  label: a,
+  value: t,
   defaultValue: d,
-  error: r,
-  helperText: u,
-  required: p,
-  disabled: f,
-  fullWidth: c,
-  variant: m,
-  type: v,
-  onChange: h,
-  onBlur: g,
-  onFocus: b,
-  components: T,
-  componentsProps: x
-}) {
+  error: n,
+  helperText: i,
+  required: s,
+  disabled: u,
+  fullWidth: p,
+  variant: v,
+  type: c,
+  onChange: m,
+  onBlur: f,
+  onFocus: h,
+  components: x,
+  componentsProps: C
+}) => {
   const {
-    Root: C
-  } = T, y = (o) => {
-    var a;
-    h(o, {
-      value: (a = o == null ? void 0 : o.target) == null ? void 0 : a.value
+    Root: T
+  } = x, g = (o) => {
+    var l;
+    m(o, {
+      value: (l = o == null ? void 0 : o.target) == null ? void 0 : l.value
     });
-  }, P = n !== void 0, l = !!r;
-  return /* @__PURE__ */ F(C, { id: t, name: t, label: s, ...P ? {
-    value: n
+  }, b = t !== void 0, r = !!n;
+  return /* @__PURE__ */ F(T, { id: e, name: e, label: a, ...b ? {
+    value: t
   } : {
     defaultValue: d
-  }, helperText: l ? r : u, error: l, required: p, disabled: f, fullWidth: c, variant: m, type: v, InputLabelProps: {
+  }, helperText: r ? n : i, error: r, required: s, disabled: u, fullWidth: p, variant: v, type: c, InputLabelProps: {
     shrink: !0
-  }, onChange: y, onBlur: g, onFocus: b, ...x.root });
-}
-i.propTypes = {
-  /**
-   * Name of input
-   */
-  name: e.string,
-  /**
-   * Label of input
-   */
-  label: e.string,
-  /**
-   * Value of input
-   */
-  value: e.string,
-  /**
-   * Default value of input (use if uncontrolled)
-   */
-  defaultValue: e.string,
-  /**
-   * Help text underneath input
-   */
-  helperText: e.string,
-  /**
-   * Error to display underneath input (overrides `helperText`)
-   */
-  error: e.string,
-  /**
-   * Set if input is required
-   */
-  required: e.bool,
-  /**
-   * Set if input is disabled
-   */
-  disabled: e.bool,
-  /**
-   * Set if input should be full width
-   */
-  fullWidth: e.bool,
-  /**
-   * Set variant of input
-   */
-  variant: e.oneOf(["outlined", "filled", "standard"]),
-  /**
-   * Set type of input
-   */
-  type: e.oneOf(["date", "datetime-local", "month", "week", "time"]),
-  // Callbacks
-  /**
-   * Callback when value changed
-   */
-  onChange: e.func,
-  /**
-   * Callback when input is blurred
-   */
-  onBlur: e.func,
-  /**
-   * Callback when input is focused
-   */
-  onFocus: e.func,
-  // Overrides
-  /**
-   * Replace internal components
-   */
-  components: e.shape({
-    Root: e.elementType
-  }),
-  /**
-   * Add internal component props
-   */
-  componentsProps: e.shape({
-    root: e.instanceOf(Object)
-  })
+  }, onChange: g, onBlur: f, onFocus: h, ...C.root });
 };
-i.defaultProps = {
+I.defaultProps = {
   name: void 0,
   label: void 0,
   value: void 0,
@@ -129,5 +55,5 @@ i.defaultProps = {
   componentsProps: void 0
 };
 export {
-  i as default
+  I as default
 };

package/dist/es/inputs/BasicDateTimeInput/index.d.ts

@@ -0,0 +1,3 @@
+import Component from './BasicDateTimeInput';
+declare const StyledComponent: typeof Component;
+export default StyledComponent;

package/dist/es/inputs/BasicDateTimeInput/index.js

@@ -4,7 +4,7 @@ import i from "./BasicDateTimeInput.js";
 const e = "BasicDateTimeInput", t = `Vdt${e}`, n = m(t)(i), s = r(n, {
   name: t,
   overridesResolver: (a, o) => o.root
-})(() => ({}));
+})({});
 s.displayName = e;
 export {
   s as default

package/dist/es/inputs/BooleanInput/BooleanInput.d.ts

@@ -0,0 +1,85 @@
+/// <reference types="react" />
+import { FormControl as MuiFormControl, FormControlLabel as MuiFormControlLabel, FormHelperText as MuiFormHelperText, Switch as MuiSwitch, Checkbox as MuiCheckbox } from '@mui/material';
+import type { StyledComponent, WithOverrideProps } from '../../_types';
+type StyledMuiFormControlLabelType = StyledComponent<typeof MuiFormControlLabel, {
+    size?: 'small' | 'medium';
+}>;
+declare const StyledMuiFormControlLabel: StyledMuiFormControlLabelType;
+type StyledMuiFormHelperTextType = StyledComponent<typeof MuiFormHelperText, {
+    fullWidth?: boolean;
+    textAlign?: React.CSSProperties['textAlign'];
+}>;
+declare const StyledMuiFormHelperText: StyledMuiFormHelperTextType;
+declare const defaultComponents: {
+    Root: typeof MuiFormControl;
+    FormControlLabel: typeof StyledMuiFormControlLabel;
+    FormHelperText: typeof StyledMuiFormHelperText;
+    Switch: typeof MuiSwitch;
+    Checkbox: typeof MuiCheckbox;
+};
+export interface BooleanInputProps extends WithOverrideProps<typeof defaultComponents> {
+    /**
+     * Name of input
+     */
+    name?: string;
+    /**
+     * Value of input
+     */
+    value?: boolean;
+    /**
+     * Default value of input (use for uncontrolled)
+     */
+    defaultValue?: boolean;
+    /**
+     * Label to use
+     */
+    label?: string;
+    /**
+     * Help text underneath input
+     */
+    helperText?: string;
+    /**
+     * Error to display underneath input (overrides `helperText`)
+     */
+    error?: string;
+    /**
+     * Set if required
+     */
+    required?: boolean;
+    /**
+     * Set if disabled
+     */
+    disabled?: boolean;
+    /**
+     * Set if input should be full width
+     */
+    fullWidth?: boolean;
+    /**
+     * Radio label placement
+     */
+    labelPlacement?: 'end' | 'start' | 'bottom' | 'top';
+    /**
+     * Set size of input
+     */
+    size?: 'medium' | 'small';
+    /**
+     * Set type of switch
+     */
+    type?: 'checkbox' | 'switch';
+    /**
+     * Callback when value changed
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>, payload: {
+        value: boolean;
+    }) => void;
+    /**
+     * Callback when input is blurred
+     */
+    onBlur?: React.FocusEventHandler<HTMLButtonElement>;
+    /**
+     * Callback when input is focused
+     */
+    onFocus?: React.FocusEventHandler<HTMLButtonElement>;
+}
+declare const BooleanInput: React.FC<BooleanInputProps>;
+export default BooleanInput;

package/dist/es/inputs/BooleanInput/BooleanInput.js

@@ -1,178 +1,92 @@
-import { jsxs as z, jsx as c } from "react/jsx-runtime";
-import e from "prop-types";
-import A from "@mui/material/FormControl";
+import { jsxs as j, jsx as i } from "react/jsx-runtime";
+import z from "@mui/material/FormControl";
 import B from "@mui/material/FormControlLabel";
 import I from "@mui/material/FormHelperText";
-import V from "@mui/material/Switch";
-import W from "@mui/material/Checkbox";
-import { styled as b } from "@mui/material/styles";
-const q = b(B, {
+import E from "@mui/material/Switch";
+import P from "@mui/material/Checkbox";
+import { styled as f } from "@mui/material/styles";
+const V = f(B, {
   shouldForwardProp: (o) => o !== "size"
 })(({
   theme: o,
-  size: t,
-  labelPlacement: r
+  size: r,
+  labelPlacement: e
 }) => ({
   "& .MuiTypography-root": {
-    ...t === "small" && {
+    ...r === "small" && {
       fontSize: "0.8rem"
     }
   },
   "&.Mui-error": {
     color: o.palette.error.main
   },
-  ...r === "end" ? {
+  ...e === "end" ? {
     marginRight: 0
   } : {},
-  ...r === "start" ? {
+  ...e === "start" ? {
     marginLeft: 0
   } : {},
-  ...["bottom", "top"].includes(r) ? {
+  ...["bottom", "top"].includes(e) ? {
     marginRight: 0,
     marginLeft: 0
   } : {}
-})), E = b(I, {
+})), W = f(I, {
   shouldForwardProp: (o) => !["fullWidth", "textAlign"].includes(o)
 })(({
   fullWidth: o,
-  textAlign: t
+  textAlign: r
 }) => o ? {
-  textAlign: t
+  textAlign: r
 } : {}), $ = {
-  Root: A,
-  FormControlLabel: q,
-  FormHelperText: E,
-  Switch: V,
-  Checkbox: W
-};
-function x({
+  Root: z,
+  FormControlLabel: V,
+  FormHelperText: W,
+  Switch: E,
+  Checkbox: P
+}, q = ({
   name: o,
-  label: t,
-  value: r,
-  defaultValue: g,
+  label: r,
+  value: e,
+  defaultValue: x,
   helperText: m,
   error: a,
-  required: s,
+  required: d,
   disabled: C,
-  labelPlacement: d,
-  size: p,
-  fullWidth: u,
-  type: T,
-  onChange: F,
-  onBlur: y,
-  onFocus: O,
+  labelPlacement: c,
+  size: s,
+  fullWidth: h,
+  type: g,
+  onChange: b,
+  onBlur: F,
+  onFocus: v,
   components: k,
-  componentsProps: n
-}) {
+  componentsProps: t
+}) => {
   const {
-    Root: v,
-    FormControlLabel: w,
-    FormHelperText: L,
-    Switch: M,
-    Checkbox: j
-  } = k, H = {
+    Root: T,
+    FormControlLabel: L,
+    FormHelperText: w,
+    Switch: y,
+    Checkbox: M
+  } = k, S = {
     end: "left",
     start: "right",
     top: "center",
     bottom: "center"
-  }, S = (l) => {
-    var h;
-    F(l, {
-      value: (h = l == null ? void 0 : l.target) == null ? void 0 : h.checked
+  }, H = (l) => {
+    var p;
+    b(l, {
+      value: (p = l == null ? void 0 : l.target) == null ? void 0 : p.checked
     });
-  }, i = !!a, f = (a || "").trim(), [R, P] = T === "switch" ? [M, n.switch] : [j, n.checkbox];
-  return /* @__PURE__ */ z(v, { error: i, required: s, disabled: C, fullWidth: u, ...n.root, children: [
-    /* @__PURE__ */ c(w, { label: s ? `${t} *` : t, labelPlacement: t ? d : "end", size: p, control: /* @__PURE__ */ c(R, { id: o, name: o, checked: r, size: p, type: "checkbox", defaultChecked: g, ...i ? {
+  }, n = !!a, u = (a || "").trim(), [R, A] = g === "switch" ? [y, t.switch] : [M, t.checkbox];
+  return /* @__PURE__ */ j(T, { error: n, required: d, disabled: C, fullWidth: h, ...t.root, children: [
+    /* @__PURE__ */ i(L, { label: d ? `${r} *` : r, labelPlacement: r ? c : "end", size: s, control: /* @__PURE__ */ i(R, { id: o, name: o, checked: e, size: s, type: "checkbox", defaultChecked: x, ...n ? {
       color: "error"
-    } : {}, onChange: S, onBlur: y, onFocus: O, ...P }), ...n.formControlLabel }),
-    (f || m) && /* @__PURE__ */ c(L, { fullWidth: u, textAlign: H[d], ...n.formHelperText, children: i ? f : m })
+    } : {}, onChange: H, onBlur: F, onFocus: v, ...A }), ...t.formControlLabel }),
+    (u || m) && /* @__PURE__ */ i(w, { fullWidth: h, textAlign: S[c], ...t.formHelperText, children: n ? u : m })
   ] });
-}
-x.propTypes = {
-  /**
-   * Name of input
-   */
-  name: e.string,
-  /**
-   * Value of input
-   */
-  value: e.bool,
-  /**
-   * Default value of input (use for uncontrolled)
-   */
-  defaultValue: e.bool,
-  /**
-   * Label to use
-   */
-  label: e.string,
-  /**
-   * Help text underneath input
-   */
-  helperText: e.string,
-  /**
-   * Error to display underneath input (overrides `helperText`)
-   */
-  error: e.string,
-  /**
-   * Set if required
-   */
-  required: e.bool,
-  /**
-   * Set if disabled
-   */
-  disabled: e.bool,
-  /**
-   * Set if input should be full width
-   */
-  fullWidth: e.bool,
-  /**
-   * Label placement
-   */
-  labelPlacement: e.oneOf(["end", "start", "bottom", "top"]),
-  /**
-   * Set size of input
-   */
-  size: e.oneOf(["medium", "small"]),
-  /**
-   * Set type of switch
-   */
-  type: e.oneOf(["checkbox", "switch"]),
-  // Callbacks
-  /**
-   * Callback when value changed
-   */
-  onChange: e.func,
-  /**
-   * Callback when input is blurred
-   */
-  onBlur: e.func,
-  /**
-   * Callback when input is focused
-   */
-  onFocus: e.func,
-  // Overrides
-  /**
-   * Replace internal components
-   */
-  components: e.shape({
-    Root: e.elementType,
-    FormControlLabel: e.elementType,
-    FormHelperText: e.elementType,
-    Switch: e.elementType,
-    Checkbox: e.elementType
-  }),
-  /**
-   * Add internal component props
-   */
-  componentsProps: e.shape({
-    root: e.instanceOf(Object),
-    formControlLabel: e.instanceOf(Object),
-    formHelperText: e.instanceOf(Object),
-    switch: e.instanceOf(Object),
-    checkbox: e.instanceOf(Object)
-  })
 };
-x.defaultProps = {
+q.defaultProps = {
   name: void 0,
   label: void 0,
   value: void 0,
@@ -192,5 +106,5 @@ x.defaultProps = {
   componentsProps: void 0
 };
 export {
-  x as default
+  q as default
 };

package/dist/es/inputs/BooleanInput/index.d.ts

@@ -0,0 +1,3 @@
+import Component from './BooleanInput';
+declare const StyledComponent: typeof Component;
+export default StyledComponent;

package/dist/es/inputs/BooleanInput/index.js

@@ -4,7 +4,7 @@ import m from "./BooleanInput.js";
 const o = "BooleanInput", e = `Vdt${o}`, s = r(e)(m), p = n(s, {
   name: e,
   overridesResolver: (i, t) => t.root
-})(() => ({}));
+})({});
 p.displayName = o;
 export {
   p as default

package/dist/es/inputs/CheckboxGroupInput/CheckboxGroupInput.d.ts

@@ -0,0 +1,106 @@
+/// <reference types="react" />
+import { FormControl as MuiFormControl, FormHelperText as MuiFormHelperText, InputLabel as MuiInputLabel, OutlinedInput as MuiOutlinedInput, FilledInput as MuiFilledInput, Input as MuiInput, Checkbox as MuiCheckbox } from '@mui/material';
+import VdtFormControlLabel from '../_components/FormControlLabel';
+import VdtCheckboxGroup from './components/CheckboxGroup';
+import type { StyledComponent, WithOverrideProps } from '../../_types';
+declare const StyledMuiInputLabel: typeof MuiInputLabel;
+declare const StyledMuiInput: StyledComponent<typeof MuiInput>;
+declare const StyledMuiFilledInput: StyledComponent<typeof MuiFilledInput>;
+declare const StyledMuiOutlinedInput: StyledComponent<typeof MuiOutlinedInput>;
+declare const defaultComponents: {
+    Root: typeof MuiFormControl;
+    InputLabel: typeof StyledMuiInputLabel;
+    Input: typeof StyledMuiInput;
+    FilledInput: typeof StyledMuiFilledInput;
+    OutlinedInput: typeof StyledMuiOutlinedInput;
+    FormControlLabel: typeof VdtFormControlLabel;
+    FormGroup: typeof VdtCheckboxGroup;
+    FormHelperText: typeof MuiFormHelperText;
+    Checkbox: typeof MuiCheckbox;
+};
+export interface CheckboxGroupInputProps extends WithOverrideProps<typeof defaultComponents> {
+    /**
+     * Name of input
+     */
+    name?: string;
+    /**
+     * Label of input
+     */
+    label?: string;
+    /**
+     * Value of input
+     */
+    value?: string[];
+    /**
+     * Default value of input (use if uncontrolled)
+     */
+    defaultValue?: string[];
+    /**
+     * Options for input
+     */
+    options?: {
+        value: string;
+        name?: string;
+        label?: string;
+        count?: string | number;
+        disabled?: boolean;
+    }[];
+    /**
+     * Help text underneath input
+     */
+    helperText?: string;
+    /**
+     * Error to display underneath input (overrides `helperText`)
+     */
+    error?: string;
+    /**
+     * Set if required
+     */
+    required?: boolean;
+    /**
+     * Set if disabled
+     */
+    disabled?: boolean;
+    /**
+     * Set if input should be full width
+     */
+    fullWidth?: boolean;
+    /**
+     * Set direction inputs should be aligned
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /**
+     * Checkbox label placement
+     */
+    labelPlacement?: 'end' | 'start' | 'bottom' | 'top';
+    /**
+     * Alignment of inputs
+     *
+     * Only used when `orientation:horizontal`
+     */
+    justifyContent?: 'flex-start' | 'center' | 'space-around' | 'space-evenly' | 'space-between' | 'flex-end';
+    /**
+     * Set variant of input
+     */
+    variant?: 'outlined' | 'filled' | 'standard';
+    /**
+     * Set size of input
+     */
+    size?: 'medium' | 'small';
+    /**
+     * Callback when value changed
+     */
+    onChange?: (event: React.FormEvent<HTMLInputElement | HTMLTextAreaElement>, payload: {
+        value?: string[];
+    }) => void;
+    /**
+     * Callback when input is blurred
+     */
+    onBlur?: React.FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
+    /**
+     * Callback when input is focused
+     */
+    onFocus?: React.FocusEventHandler<HTMLInputElement | HTMLTextAreaElement>;
+}
+declare const CheckboxGroupInput: React.FC<CheckboxGroupInputProps>;
+export default CheckboxGroupInput;