@coopdigital/react 1.12.0 → 1.13.0

package/dist/components/DatePicker/datepicker-utils.js

@@ -1,212 +1,201 @@
-import { addYears, isValid, parse, format, isBefore } from 'date-fns';
-
+import { addYears, format, isBefore, isValid, parse } from "date-fns";
+//#region src/components/DatePicker/datepicker-utils.ts
 function isValidDate(date) {
-    return !!date && typeof date !== "string" && typeof date !== "number" && isValid(date);
+	return !!date && typeof date !== "string" && typeof date !== "number" && isValid(date);
 }
 function isValidRangeFrom(date) {
-    return !!date && typeof date === "object" && "from" in date && isValid(date.from);
+	return !!date && typeof date === "object" && "from" in date && isValid(date.from);
 }
 function isValidRangeTo(date) {
-    return !!date && typeof date === "object" && "to" in date && isValid(date.to);
+	return !!date && typeof date === "object" && "to" in date && isValid(date.to);
 }
 function getISODateString(date) {
-    return format(date, "yyyy-MM-dd");
+	return format(date, "yyyy-MM-dd");
 }
 function getRangeFromString(input) {
-    if (input.includes("-")) {
-        const [from, to] = input.split("-");
-        return { from: from.trim(), to: to.trim() };
-    }
-    return { from: undefined, to: undefined };
+	if (input.includes("-")) {
+		const [from, to] = input.split("-");
+		return {
+			from: from.trim(),
+			to: to.trim()
+		};
+	}
+	return {
+		from: void 0,
+		to: void 0
+	};
 }
 const getStartDate = (date) => {
-    if (isValidDate(date))
-        return addYears(date, -1);
-    else if (isValidRangeFrom(date))
-        return addYears(date.from, -1);
-    return undefined;
+	if (isValidDate(date)) return addYears(date, -1);
+	else if (isValidRangeFrom(date)) return addYears(date.from, -1);
 };
 const getEndDate = (date) => {
-    if (isValidDate(date))
-        return addYears(date, 1);
-    else if (isValidRangeTo(date))
-        return addYears(date.to, 1);
-    return undefined;
+	if (isValidDate(date)) return addYears(date, 1);
+	else if (isValidRangeTo(date)) return addYears(date.to, 1);
 };
 const getDefaultMonth = (date) => {
-    if (isValid(date))
-        return date;
-    else if (isValidRangeFrom(date))
-        return date.from;
-    return undefined;
+	if (isValid(date)) return date;
+	else if (isValidRangeFrom(date)) return date.from;
 };
 const getInitialDate = (mode, date) => {
-    var _a;
-    let initialDate = date;
-    if (mode === "range") {
-        let from, to;
-        if ("from" in date) {
-            from = date.from;
-            to = (_a = date.to) !== null && _a !== void 0 ? _a : date.from;
-        }
-        else {
-            from = to = date;
-        }
-        initialDate = { from, to };
-    }
-    return initialDate;
+	let initialDate = date;
+	if (mode === "range") {
+		let from, to;
+		if ("from" in date) {
+			from = date.from;
+			to = date.to ?? date.from;
+		} else from = to = date;
+		initialDate = {
+			from,
+			to
+		};
+	}
+	return initialDate;
 };
 /**
- * Each getter returns an object with the following shape:
- *
- * message ........... read out by screen readers in the picker live region
- * state.event ....... attached to the onChange / onSelect event when it fires
- * state.field ....... value(s) for the hidden input field(s)
- * state.input ....... value for the visible input field
- * state.value ....... parsed date object(s)
- * validated ......... boolean indicating dates are valid
- * view .............. date (month) to show in the picker window
- */
+* Each getter returns an object with the following shape:
+*
+* message ........... read out by screen readers in the picker live region
+* state.event ....... attached to the onChange / onSelect event when it fires
+* state.field ....... value(s) for the hidden input field(s)
+* state.input ....... value for the visible input field
+* state.value ....... parsed date object(s)
+* validated ......... boolean indicating dates are valid
+* view .............. date (month) to show in the picker window
+*/
 const initialState = {
-    state: { input: "" },
-    validated: false,
+	state: { input: "" },
+	validated: false
 };
 function getSingleDate(date, df, now) {
-    if (!date)
-        return initialState;
-    let parsed;
-    let input = "";
-    if (typeof date === "string") {
-        input = date !== null && date !== void 0 ? date : "";
-        parsed = parse(date, df, now);
-    }
-    else if (isValidDate(date)) {
-        input = format(date, df);
-        parsed = date;
-    }
-    else {
-        return initialState;
-    }
-    if (isValidDate(parsed)) {
-        const isoString = getISODateString(parsed);
-        return {
-            message: `Selected ${input}`,
-            state: { event: isoString, field: isoString, input, value: parsed },
-            validated: true,
-            view: parsed,
-        };
-    }
-    return { state: { input: date.toString() }, validated: false };
+	if (!date) return initialState;
+	let parsed;
+	let input = "";
+	if (typeof date === "string") {
+		input = date ?? "";
+		parsed = parse(date, df, now);
+	} else if (isValidDate(date)) {
+		input = format(date, df);
+		parsed = date;
+	} else return initialState;
+	if (isValidDate(parsed)) {
+		const isoString = getISODateString(parsed);
+		return {
+			message: `Selected ${input}`,
+			state: {
+				event: isoString,
+				field: isoString,
+				input,
+				value: parsed
+			},
+			validated: true,
+			view: parsed
+		};
+	}
+	return {
+		state: { input: date.toString() },
+		validated: false
+	};
 }
 function getMultipleDate(date, df, now) {
-    if (!date)
-        return initialState;
-    let parsed = [];
-    let input = "";
-    if (typeof date === "string") {
-        parsed = date
-            .split(",")
-            .map((d) => parse(d.trim(), df, now))
-            .filter((d) => isValid(d));
-        input = date;
-    }
-    else if (Array.isArray(date)) {
-        parsed = date.filter((d) => isValid(d));
-        input = parsed.map((d) => format(d, df)).join(", ");
-    }
-    if (parsed.length > 0) {
-        const formattedArray = parsed.map((d) => format(d, df));
-        const isoString = parsed.map((d) => getISODateString(d));
-        return {
-            message: `Selected ${formattedArray.join(", ")}`,
-            state: {
-                event: isoString,
-                field: isoString.join(","),
-                input,
-                value: parsed,
-            },
-            validated: true,
-            view: parsed.at(-1),
-        };
-    }
-    return { state: { input }, validated: false };
+	if (!date) return initialState;
+	let parsed = [];
+	let input = "";
+	if (typeof date === "string") {
+		parsed = date.split(",").map((d) => parse(d.trim(), df, now)).filter((d) => isValid(d));
+		input = date;
+	} else if (Array.isArray(date)) {
+		parsed = date.filter((d) => isValid(d));
+		input = parsed.map((d) => format(d, df)).join(", ");
+	}
+	if (parsed.length > 0) {
+		const formattedArray = parsed.map((d) => format(d, df));
+		const isoString = parsed.map((d) => getISODateString(d));
+		return {
+			message: `Selected ${formattedArray.join(", ")}`,
+			state: {
+				event: isoString,
+				field: isoString.join(","),
+				input,
+				value: parsed
+			},
+			validated: true,
+			view: parsed.at(-1)
+		};
+	}
+	return {
+		state: { input },
+		validated: false
+	};
 }
 function getRangeDate(date, df, now) {
-    if (!date)
-        return initialState;
-    const parsed = { from: undefined, to: undefined };
-    const formatted = {};
-    let input = "";
-    if (typeof date === "string") {
-        if (date.includes("-")) {
-            const { from, to } = getRangeFromString(date);
-            if (from && to) {
-                parsed.from = parse(from, df, now);
-                parsed.to = parse(to, df, now);
-                formatted.from = from;
-                formatted.to = to;
-            }
-            input = `${from} - ${to}`;
-        }
-        else {
-            input = date;
-        }
-    }
-    else if ((date === null || date === void 0 ? void 0 : date.from) && (date === null || date === void 0 ? void 0 : date.to) && isValid(date.from) && isValid(date.to)) {
-        parsed.from = date.from;
-        parsed.to = date.to;
-        formatted.from = format(parsed.from, df);
-        formatted.to = format(parsed.to, df);
-        input = `${formatted.from} - ${formatted.to}`;
-    }
-    else {
-        return initialState;
-    }
-    if (isValidDate(parsed.from) && isValidDate(parsed.to)) {
-        if (isBefore(parsed.to, parsed.from)) {
-            const { from: pf, to: pt } = parsed;
-            parsed.from = pt;
-            parsed.to = pf;
-        }
-        const isoString = {
-            from: getISODateString(parsed.from),
-            to: getISODateString(parsed.to),
-        };
-        return {
-            message: `Selected ${formatted.from} to ${formatted.to}`,
-            state: { event: isoString, field: isoString, input, value: parsed },
-            validated: true,
-            view: parsed.to,
-        };
-    }
-    return { state: { input }, validated: false };
+	if (!date) return initialState;
+	const parsed = {
+		from: void 0,
+		to: void 0
+	};
+	const formatted = {};
+	let input = "";
+	if (typeof date === "string") if (date.includes("-")) {
+		const { from, to } = getRangeFromString(date);
+		if (from && to) {
+			parsed.from = parse(from, df, now);
+			parsed.to = parse(to, df, now);
+			formatted.from = from;
+			formatted.to = to;
+		}
+		input = `${from} - ${to}`;
+	} else input = date;
+	else if (date?.from && date?.to && isValid(date.from) && isValid(date.to)) {
+		parsed.from = date.from;
+		parsed.to = date.to;
+		formatted.from = format(parsed.from, df);
+		formatted.to = format(parsed.to, df);
+		input = `${formatted.from} - ${formatted.to}`;
+	} else return initialState;
+	if (isValidDate(parsed.from) && isValidDate(parsed.to)) {
+		if (isBefore(parsed.to, parsed.from)) {
+			const { from: pf, to: pt } = parsed;
+			parsed.from = pt;
+			parsed.to = pf;
+		}
+		const isoString = {
+			from: getISODateString(parsed.from),
+			to: getISODateString(parsed.to)
+		};
+		return {
+			message: `Selected ${formatted.from} to ${formatted.to}`,
+			state: {
+				event: isoString,
+				field: isoString,
+				input,
+				value: parsed
+			},
+			validated: true,
+			view: parsed.to
+		};
+	}
+	return {
+		state: { input },
+		validated: false
+	};
 }
 const getDateValues = (mode, selected, dateFormat, now) => {
-    if (isSingle(mode))
-        return getSingleDate(selected, dateFormat, now);
-    else if (isMultiple(mode))
-        return getMultipleDate(selected, dateFormat, now);
-    else if (isRange(mode))
-        return getRangeDate(selected, dateFormat, now);
+	if (isSingle(mode, selected)) return getSingleDate(selected, dateFormat, now);
+	else if (isMultiple(mode, selected)) return getMultipleDate(selected, dateFormat, now);
+	else if (isRange(mode, selected)) return getRangeDate(selected, dateFormat, now);
 };
 const shouldSkipParsing = (value) => {
-    return typeof value !== "string" ? true : value.length < 8 || value.split("/").length < 3;
+	return typeof value !== "string" ? true : value.length < 8 || value.split("/").length < 3;
 };
 const shouldClose = (mode, value, closeOnSelect) => {
-    var _a, _b;
-    if (!closeOnSelect || !value)
-        return false;
-    else if (isSingle(mode))
-        return true;
-    else if (isRange(mode) && ((_a = value === null || value === void 0 ? void 0 : value.to) === null || _a === void 0 ? void 0 : _a.getTime()) !== ((_b = value === null || value === void 0 ? void 0 : value.from) === null || _b === void 0 ? void 0 : _b.getTime()))
-        return true;
-    else
-        return false;
+	if (!closeOnSelect || !value) return false;
+	else if (isSingle(mode, value)) return true;
+	else if (isRange(mode, value) && value?.to?.getTime() !== value?.from?.getTime()) return true;
+	else return false;
 };
-/* oxlint-disable eslint/no-unused-vars */
 const isSingle = (m, d) => m === "single";
 const isMultiple = (m, d) => m === "multiple";
 const isRange = (m, d) => m === "range";
-/* oxlint-enable eslint/no-unused-vars */
-
+//#endregion
 export { getDateValues, getDefaultMonth, getEndDate, getISODateString, getInitialDate, getMultipleDate, getRangeDate, getRangeFromString, getSingleDate, getStartDate, isMultiple, isRange, isSingle, isValidDate, isValidRangeFrom, isValidRangeTo, shouldClose, shouldSkipParsing };

package/dist/components/DatePicker/index.d.ts

@@ -1,4 +1,2 @@
-import DatePicker from "./DatePicker";
-export default DatePicker;
-export { DatePicker };
-export * from "./DatePicker";
+import { DatePicker, DatePickerProps } from "./DatePicker.js";
+export { DatePicker, DatePicker as default, DatePickerProps };

package/dist/components/DatePicker/index.js

@@ -0,0 +1,5 @@
+import { DatePicker } from "./DatePicker.js";
+//#region src/components/DatePicker/index.ts
+var DatePicker_default = DatePicker;
+//#endregion
+export { DatePicker, DatePicker_default as default };

package/dist/components/Dialog/Dialog.d.ts

@@ -1,94 +1,95 @@
-import React, { type DialogHTMLAttributes, type HTMLAttributes, type JSX, type ReactEventHandler, type ReactNode, type Ref } from "react";
-export interface DialogProps extends Omit<DialogHTMLAttributes<HTMLDialogElement>, "closedby"> {
-    /** Content inside the Dialog.
-     *
-     * This should be a `<Dialog.Header>` and `<Dialog.Body>`, although arbitrary JSX children are also accepted. */
-    children: string | ReactNode;
-    /** **(Optional)** Specify additional CSS classes to be applied to the component. */
-    className?: string;
-    /** **(Optional)** Specify how the dialog can be closed. Set this to `none` to disable escape key and click-outside behaviour.
-     *
-     * Default: `any` */
-    closedBy?: "any" | "none";
-    /** **(Optional)** Specify the Dialog id. Will be auto-generated if not set. */
-    id?: string;
-    /** Specify an accessible label for the dialog that will be read out by screen readers. */
-    label: string;
-    /** **(Optional)** Specify the Dialog mode.
-     *
-     * Default: `dialog`
-     */
-    mode?: "sheet" | "dialog";
-    /** **(Optional)** Specific a callback to run when the Dialog closes. */
-    onClose?: ReactEventHandler<HTMLDialogElement>;
-    /** **(Optional)** Specific a callback to run when the Dialog opens. */
-    onOpen?: ReactEventHandler<HTMLDialogElement>;
-    /** **(Optional)** Specific a callback to run when the Dialog opens or closes. */
-    onToggle?: ReactEventHandler<HTMLDialogElement>;
-    /** Specify the Dialog open state. This should reflect the value of your `useState`.
-     *
-     * Default: `false`
-     */
-    open: boolean;
-    /** **(Optional)** Specify the Dialog position. This only applies when the `mode` is set to `sheet`.
-     *
-     * Default: `bottom`
-     */
-    position?: "right" | "bottom" | "left";
-    /** **(Optional)** Specify a custom React ref for this component. */
-    ref?: Ref<HTMLDialogElement>;
-    /** **(Optional)** Specify an ARIA role for the dialog. Use `alertdialog` if the message includes urgent information that requires an explicit user action.
-     *
-     * Default: `dialog`
-     */
-    role?: "dialog" | "alertdialog";
+import React, { DialogHTMLAttributes, HTMLAttributes, JSX, ReactEventHandler, ReactNode, Ref } from "react";
+//#region src/components/Dialog/Dialog.d.ts
+interface DialogProps extends Omit<DialogHTMLAttributes<HTMLDialogElement>, "closedby"> {
+  /** Content inside the Dialog.
+   *
+   * This should be a `<Dialog.Header>` and `<Dialog.Body>`, although arbitrary JSX children are also accepted. */
+  children: string | ReactNode;
+  /** **(Optional)** Specify additional CSS classes to be applied to the component. */
+  className?: string;
+  /** **(Optional)** Specify how the dialog can be closed. Set this to `none` to disable escape key and click-outside behaviour.
+   *
+   * Default: `any` */
+  closedBy?: "any" | "none";
+  /** **(Optional)** Specify the Dialog id. Will be auto-generated if not set. */
+  id?: string;
+  /** Specify an accessible label for the dialog that will be read out by screen readers. */
+  label: string;
+  /** **(Optional)** Specify the Dialog mode.
+   *
+   * Default: `dialog`
+   */
+  mode?: "sheet" | "dialog";
+  /** **(Optional)** Specific a callback to run when the Dialog closes. */
+  onClose?: ReactEventHandler<HTMLDialogElement>;
+  /** **(Optional)** Specific a callback to run when the Dialog opens. */
+  onOpen?: ReactEventHandler<HTMLDialogElement>;
+  /** **(Optional)** Specific a callback to run when the Dialog opens or closes. */
+  onToggle?: ReactEventHandler<HTMLDialogElement>;
+  /** Specify the Dialog open state. This should reflect the value of your `useState`.
+   *
+   * Default: `false`
+   */
+  open: boolean;
+  /** **(Optional)** Specify the Dialog position. This only applies when the `mode` is set to `sheet`.
+   *
+   * Default: `bottom`
+   */
+  position?: "right" | "bottom" | "left";
+  /** **(Optional)** Specify a custom React ref for this component. */
+  ref?: Ref<HTMLDialogElement>;
+  /** **(Optional)** Specify an ARIA role for the dialog. Use `alertdialog` if the message includes urgent information that requires an explicit user action.
+   *
+   * Default: `dialog`
+   */
+  role?: "dialog" | "alertdialog";
 }
 interface DialogHeaderProps extends HTMLAttributes<HTMLDivElement> {
-    /** **(Optional)** Content inside the Dialog Header. */
-    children?: React.ReactNode;
-    /** **(Optional)** Specify additional CSS classes to be applied to the component. */
-    className?: string;
-    /** **(Optional)** Specify whether to render the close button.
-     *
-     * Default: `true`
-     */
-    closeButton?: boolean;
+  /** **(Optional)** Content inside the Dialog Header. */
+  children?: React.ReactNode;
+  /** **(Optional)** Specify additional CSS classes to be applied to the component. */
+  className?: string;
+  /** **(Optional)** Specify whether to render the close button.
+   *
+   * Default: `true`
+   */
+  closeButton?: boolean;
 }
 interface DialogBodyProps extends HTMLAttributes<HTMLDivElement> {
-    /** **(Optional)** Content inside the Dialog Body. */
-    children?: React.ReactNode;
-    /** **(Optional)** Specify additional CSS classes to be applied to the component. */
-    className?: string;
+  /** **(Optional)** Content inside the Dialog Body. */
+  children?: React.ReactNode;
+  /** **(Optional)** Specify additional CSS classes to be applied to the component. */
+  className?: string;
 }
 declare const Dialog: {
-    ({ children, className, closedBy, label, mode, onClose, onOpen, onToggle, open, position, ref, role, ...props }: DialogProps): JSX.Element;
+  ({ children, className, closedBy, label, mode, onClose, onOpen, onToggle, open, position, ref, role, ...props }: DialogProps): JSX.Element;
+  slot: {
+    name: string;
+  };
+  Header: {
+    ({ children, className, closeButton, ...props }: DialogHeaderProps): JSX.Element;
     slot: {
-        name: string;
-    };
-    Header: {
-        ({ children, className, closeButton, ...props }: DialogHeaderProps): JSX.Element;
-        slot: {
-            name: string;
-        };
+      name: string;
     };
-    Body: {
-        ({ children, className, ...props }: DialogBodyProps): JSX.Element;
-        slot: {
-            name: string;
-        };
+  };
+  Body: {
+    ({ children, className, ...props }: DialogBodyProps): JSX.Element;
+    slot: {
+      name: string;
     };
+  };
 };
 declare const DialogHeader: {
-    ({ children, className, closeButton, ...props }: DialogHeaderProps): JSX.Element;
-    slot: {
-        name: string;
-    };
+  ({ children, className, closeButton, ...props }: DialogHeaderProps): JSX.Element;
+  slot: {
+    name: string;
+  };
 };
 declare const DialogBody: {
-    ({ children, className, ...props }: DialogBodyProps): JSX.Element;
-    slot: {
-        name: string;
-    };
+  ({ children, className, ...props }: DialogBodyProps): JSX.Element;
+  slot: {
+    name: string;
+  };
 };
-export default Dialog;
-export { Dialog, DialogBody, DialogHeader };
+//#endregion
+export { Dialog, Dialog as default, DialogBody, DialogHeader, DialogProps };