@mezzanine-ui/react 0.14.10 → 0.15.1

package/Accordion/Accordion.js

@@ -20,7 +20,8 @@ const Accordion = forwardRef(function Accordion(props, ref) {
         var _a, _b;
         return ({
             detailsId: ((_a = summary === null || summary === void 0 ? void 0 : summary.props) === null || _a === void 0 ? void 0 : _a.id)
-                ? `${summary.props.id}-details` : undefined,
+                ? `${summary.props.id}-details`
+                : undefined,
             disabled,
             expanded: expandedProp || expanded,
             summaryId: (_b = summary === null || summary === void 0 ? void 0 : summary.props) === null || _b === void 0 ? void 0 : _b.id,

package/Accordion/AccordionDetails.js

@@ -7,7 +7,7 @@ import cx from 'clsx';
 
 const AccordionDetails = forwardRef(function AccordionDetails(props, ref) {
     const { className, children, expanded: expandedProp, ...rest } = props;
-    const { detailsId, expanded, summaryId, } = useContext(AccordionControlContext) || {};
+    const { detailsId, expanded, summaryId } = useContext(AccordionControlContext) || {};
     const ariaProps = useMemo(() => {
         if (summaryId && detailsId) {
             return {

package/Accordion/AccordionSummary.js

@@ -8,7 +8,7 @@ import cx from 'clsx';
 
 const AccordionSummary = forwardRef(function AccordionSummary(props, ref) {
     const { className, children, iconClassName: iconClassNameProp, prefixIcon, suffixActions, ...rest } = props;
-    const { detailsId, disabled, expanded, toggleExpanded, } = useContext(AccordionControlContext) || {};
+    const { detailsId, disabled, expanded, toggleExpanded } = useContext(AccordionControlContext) || {};
     const onToggle = useCallback((e) => {
         e.stopPropagation();
         if (typeof toggleExpanded === 'function' && !disabled) {
@@ -43,7 +43,9 @@ const AccordionSummary = forwardRef(function AccordionSummary(props, ref) {
     }, [disabled, expanded, iconClassNameProp, onToggle]);
     return (jsxs("div", { ...rest, ...ariaProps, ref: ref, className: cx(accordionClasses.summary, {
             [accordionClasses.summaryDisabled]: disabled,
-        }, className), onClick: onToggle, onKeyDown: onKeyDown, role: "button", tabIndex: 0, children: [jsxs("div", { className: accordionClasses.summaryMainPart, children: [suffixActions ? (prefixIcon || (jsx(DefaultIcon, { className: accordionClasses.summaryMainPartPrefix }))) : null, children] }), suffixActions || (jsx(DefaultIcon, {}))] }));
+        }, className), onClick: onToggle, onKeyDown: onKeyDown, role: "button", tabIndex: 0, children: [jsxs("div", { className: accordionClasses.summaryMainPart, children: [suffixActions
+                        ? prefixIcon || (jsx(DefaultIcon, { className: accordionClasses.summaryMainPartPrefix }))
+                        : null, children] }), suffixActions || jsx(DefaultIcon, {})] }));
 });
 var AccordionSummary$1 = AccordionSummary;
 

package/Accordion/index.d.ts

@@ -1,3 +1,3 @@
-export { AccordionProps, default, } from './Accordion';
+export { AccordionProps, default } from './Accordion';
 export { AccordionSummaryProps, default as AccordionSummary, } from './AccordionSummary';
 export { AccordionDetailsProps, default as AccordionDetails, } from './AccordionDetails';

package/Alert/index.d.ts

@@ -1,2 +1,2 @@
-export { AlertSeverity, } from '@mezzanine-ui/core/alert';
-export { AlertProps, default, } from './Alert';
+export { AlertSeverity } from '@mezzanine-ui/core/alert';
+export { AlertProps, default } from './Alert';

package/Anchor/Anchor.d.ts

@@ -0,0 +1,30 @@
+import { NativeElementPropsWithoutKeyAndRef } from '../utils/jsx-types';
+export interface AnchorProps extends Omit<NativeElementPropsWithoutKeyAndRef<'div'>, 'onClick'> {
+    /** The current active anchor ID */
+    activeAnchorId?: string;
+    /** Whether apply ellipsis or not
+     * @default false
+     */
+    ellipsis?: boolean;
+    /**
+     * Anchor list.
+     */
+    list: {
+        id: string;
+        name: string;
+    }[];
+    /**
+     * The maximum width for anchor container. This might be useful when you need to set `ellipsis: true`.
+     */
+    maxWidth?: number;
+    /**
+     * Trigger when user click on any anchor.
+     */
+    onClick?: (nextAnchorId: string) => void;
+}
+/**
+ * The react component for `mezzanine` anchor.
+ * This component should always be full width of its parent.
+ */
+declare const Anchor: import("react").ForwardRefExoticComponent<AnchorProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Anchor;

package/Anchor/Anchor.js

@@ -0,0 +1,21 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { anchorClasses } from '@mezzanine-ui/core/anchor';
+import Typography from '../Typography/Typography.js';
+import cx from 'clsx';
+
+/**
+ * The react component for `mezzanine` anchor.
+ * This component should always be full width of its parent.
+ */
+const Anchor = forwardRef(function Anchor(props, ref) {
+    const { activeAnchorId, className, children, ellipsis = false, list, maxWidth, onClick, style, ...rest } = props;
+    const resolvedStyle = {
+        ...(style || {}),
+        ...(maxWidth ? { maxWidth: `${maxWidth}px` } : {}),
+    };
+    return (jsxs("div", { ref: ref, className: cx(anchorClasses.host, className), style: resolvedStyle, ...rest, children: [jsx("div", { className: anchorClasses.bar }), list.map((anchor) => (jsx("button", { type: "button", onClick: () => onClick === null || onClick === void 0 ? void 0 : onClick(anchor.id), className: cx(anchorClasses.anchor, activeAnchorId === anchor.id && anchorClasses.anchorActive), children: jsx(Typography, { variant: "input3", color: "inherit", ellipsis: ellipsis, children: anchor.name }) }, anchor.id)))] }));
+});
+var Anchor$1 = Anchor;
+
+export { Anchor$1 as default };

package/Anchor/index.d.ts

@@ -0,0 +1 @@
+export { AnchorProps, default } from './Anchor';

package/Anchor/index.js

@@ -0,0 +1 @@
+export { default } from './Anchor.js';

package/AppBar/AppBar.js

@@ -18,9 +18,7 @@ const componentOrders = (type) => {
 };
 const AppBar = forwardRef((props, ref) => {
     const { orientation = 'horizontal', className, children, ...rest } = props;
-    const SortedChildren = Children
-        .toArray(children)
-        .sort((unknownBefore, unknownAfter) => {
+    const SortedChildren = Children.toArray(children).sort((unknownBefore, unknownAfter) => {
         const { type: beforeType } = unknownBefore;
         const { type: afterType } = unknownAfter;
         const beforeOrder = componentOrders(beforeType);

package/AppBar/index.d.ts

@@ -1,4 +1,4 @@
-export { AppBarBrandProps, default as AppBarBrand, } from './AppBarBrand';
-export { AppBarMainProps, default as AppBarMain, } from './AppBarMain';
-export { AppBarSupportProps, default as AppBarSupport, } from './AppBarSupport';
-export { AppBarChild, AppBarChildren, AppBarProps, default, } from './AppBar';
+export { AppBarBrandProps, default as AppBarBrand } from './AppBarBrand';
+export { AppBarMainProps, default as AppBarMain } from './AppBarMain';
+export { AppBarSupportProps, default as AppBarSupport } from './AppBarSupport';
+export { AppBarChild, AppBarChildren, AppBarProps, default } from './AppBar';

package/Badge/index.d.ts

@@ -1,2 +1,2 @@
-export { BadgeProps, default, } from './Badge';
+export { BadgeProps, default } from './Badge';
 export { BadgeContainerProps, default as BadgeContainer, } from './BadgeContainer';

package/Button/Button.js

@@ -10,7 +10,7 @@ import cx from 'clsx';
  * The react component for `mezzanine` button.
  */
 const Button = forwardRef(function Button(props, ref) {
-    const { size: globalSize, } = useContext(MezzanineConfig);
+    const { size: globalSize } = useContext(MezzanineConfig);
     const { children, className, color = 'primary', component: Component = 'button', danger = false, disabled = false, loading = false, onClick, prefix: prefixProp, size = globalSize, suffix: suffixProp, variant = 'text', ...rest } = props;
     let prefix = prefixProp;
     let suffix = suffixProp;

package/Button/ButtonGroup.js

@@ -8,7 +8,7 @@ import cx from 'clsx';
  * The react component for `mezzanine` button group.
  */
 const ButtonGroup = forwardRef(function ButtonGroup(props, ref) {
-    const { size: globalSize, } = useContext(MezzanineConfig);
+    const { size: globalSize } = useContext(MezzanineConfig);
     const { attached = false, children, className, color = 'primary', danger = false, disabled = false, fullWidth = false, orientation = 'horizontal', role = 'group', size = globalSize, spacing, style: styleProp, variant = 'text', ...rest } = props;
     const cssVars = toButtonGroupCssVars({ size, spacing });
     const style = {

package/Button/IconButton.js

@@ -7,7 +7,7 @@ import Button from './Button.js';
  */
 const IconButton = forwardRef(function IconButton(props, ref) {
     const { children, ...rest } = props;
-    return (jsx(Button, { ...rest, ref: ref, prefix: children }));
+    return jsx(Button, { ...rest, ref: ref, prefix: children });
 });
 
 export { IconButton as default };

package/Button/index.d.ts

@@ -3,8 +3,8 @@ import { ButtonComponent, ButtonPropsBase } from './typings';
 import { ButtonProps } from './Button';
 import { IconButtonProps } from './IconButton';
 export type { ButtonColor, ButtonGroupOrientation, ButtonGroupSpacing, ButtonSize, ButtonVariant, } from '@mezzanine-ui/core/button';
-export { ButtonGroupChild, ButtonGroupProps, default as ButtonGroup } from './ButtonGroup';
-export type { ButtonComponent, ButtonProps, ButtonPropsBase, IconButtonProps, };
+export { ButtonGroupChild, ButtonGroupProps, default as ButtonGroup, } from './ButtonGroup';
+export type { ButtonComponent, ButtonProps, ButtonPropsBase, IconButtonProps };
 /**
  * @remark
  * Add type alias here for parsable to react docgen typescript.

package/Calendar/Calendar.js

@@ -46,7 +46,15 @@ const Calendar = forwardRef(function Calendar(props, ref) {
     else if (mode === 'year') {
         controls = (jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.controlsButton, calendarClasses.buttonDisabled), disabled: true, "aria-disabled": true, children: displayYearRange }));
     }
-    return (jsxs("div", { ...restCalendarProps, ref: ref, className: cx(calendarClasses.host, className), children: [jsx(CalendarControls, { disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, onNext: onNext ? () => { onNext(mode); } : undefined, onPrev: onPrev ? () => { onPrev(mode); } : undefined, children: controls }), displayCalendar] }));
+    return (jsxs("div", { ...restCalendarProps, ref: ref, className: cx(calendarClasses.host, className), children: [jsx(CalendarControls, { disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, onNext: onNext
+                    ? () => {
+                        onNext(mode);
+                    }
+                    : undefined, onPrev: onPrev
+                    ? () => {
+                        onPrev(mode);
+                    }
+                    : undefined, children: controls }), displayCalendar] }));
 });
 var Calendar$1 = Calendar;
 

package/Calendar/CalendarContext.js

@@ -5,9 +5,9 @@ const CalendarContext = createContext(undefined);
 function useCalendarContext() {
     const configs = useContext(CalendarContext);
     if (!configs) {
-        throw new Error('Cannot find values in your context. '
-            + 'Make sure you use `CalendarConfigProvider` in your app '
-            + 'and pass in one of the following as methods: `CalendarMethodsMoment`.');
+        throw new Error('Cannot find values in your context. ' +
+            'Make sure you use `CalendarConfigProvider` in your app ' +
+            'and pass in one of the following as methods: `CalendarMethodsMoment`.');
     }
     return configs;
 }

package/Calendar/CalendarDays.js

@@ -26,15 +26,22 @@ function CalendarDays(props) {
                             ? thisMonth + 1
                             : thisMonth;
                     const date = setDate(setMonth(referenceDate, month), dateNum);
-                    const disabled = ((isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(date)) || (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(date)) || (isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(date))) || false;
+                    const disabled = (isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(date)) ||
+                        (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(date)) ||
+                        (isDateDisabled === null || isDateDisabled === void 0 ? void 0 : isDateDisabled(date)) ||
+                        false;
                     const inactive = !disabled && (isPrevMonth || isNextMonth);
                     const inRange = !inactive && isDateInRange && isDateInRange(date);
                     const active = !disabled && !inactive && value && isDateIncluded(date, value);
-                    const onMouseEnter = onDateHover ? () => {
-                        onDateHover(date);
-                    } : undefined;
+                    const onMouseEnter = onDateHover
+                        ? () => {
+                            onDateHover(date);
+                        }
+                        : undefined;
                     const onClick = onClickProp
-                        ? () => { onClickProp(date); }
+                        ? () => {
+                            onClickProp(date);
+                        }
                         : undefined;
                     return (jsx(CalendarCell, { today: isSameDate(date, getNow()), active: active, disabled: isPrevMonth || isNextMonth, children: jsx("button", { type: "button", "aria-disabled": disabled, disabled: disabled, onMouseEnter: onMouseEnter, className: cx(calendarClasses.button, {
                                 [calendarClasses.buttonInRange]: inRange,

package/Calendar/CalendarMonths.js

@@ -16,10 +16,20 @@ function CalendarMonths(props) {
                 const monthDateType = setMonth(referenceDate, month);
                 const active = value && isMonthIncluded(monthDateType, value);
                 /** @NOTE Current month should be disabled when current year is disabled */
-                const disabled = ((isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(monthDateType)) || (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(monthDateType))) || false;
+                const disabled = (isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(monthDateType)) ||
+                    (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(monthDateType)) ||
+                    false;
                 const inRange = isMonthInRange && isMonthInRange(monthDateType);
-                const onClick = onClickProp ? () => { onClickProp(monthDateType); } : undefined;
-                const onMouseEnter = onMonthHover ? () => { onMonthHover(monthDateType); } : undefined;
+                const onClick = onClickProp
+                    ? () => {
+                        onClickProp(monthDateType);
+                    }
+                    : undefined;
+                const onMouseEnter = onMonthHover
+                    ? () => {
+                        onMonthHover(monthDateType);
+                    }
+                    : undefined;
                 return (jsx("button", { type: "button", "aria-disabled": disabled, disabled: disabled, className: cx(calendarClasses.button, {
                         [calendarClasses.buttonActive]: active,
                         [calendarClasses.buttonInRange]: inRange,

package/Calendar/CalendarWeeks.js

@@ -32,21 +32,29 @@ function CalendarWeeks(props) {
                     const date = setDate(setMonth(referenceDate, month), dateNum);
                     dates.push(date);
                 });
-                const disabled = ((isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(dates[0])) || (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(dates[0])) || (isWeekDisabled === null || isWeekDisabled === void 0 ? void 0 : isWeekDisabled(dates[0]))) || false;
+                const disabled = (isYearDisabled === null || isYearDisabled === void 0 ? void 0 : isYearDisabled(dates[0])) ||
+                    (isMonthDisabled === null || isMonthDisabled === void 0 ? void 0 : isMonthDisabled(dates[0])) ||
+                    (isWeekDisabled === null || isWeekDisabled === void 0 ? void 0 : isWeekDisabled(dates[0])) ||
+                    false;
                 const inactive = !disabled && (weekStartInPrevMonth || weekStartInNextMonth);
                 const active = !disabled && !inactive && value && isWeekIncluded(dates[0], value);
                 const inRange = !disabled && !inactive && isWeekInRange && isWeekInRange(dates[0]);
-                const onMouseEnter = onWeekHover ? () => {
-                    onWeekHover(dates[0]);
-                } : undefined;
-                const onClick = onClickProp ? () => {
-                    onClickProp(dates[0]);
-                } : undefined;
+                const onMouseEnter = onWeekHover
+                    ? () => {
+                        onWeekHover(dates[0]);
+                    }
+                    : undefined;
+                const onClick = onClickProp
+                    ? () => {
+                        onClickProp(dates[0]);
+                    }
+                    : undefined;
                 return (jsx("button", { type: "button", className: cx(calendarClasses.button, calendarClasses.row, {
                         [calendarClasses.buttonActive]: active,
                         [calendarClasses.buttonInRange]: inRange,
                         [calendarClasses.buttonDisabled]: disabled,
-                    }), disabled: disabled, "aria-disabled": disabled, onClick: onClick, onMouseEnter: onMouseEnter, children: week.map((dateNum, dateIndex) => (jsx(CalendarCell, { today: isSameDate(dates[dateIndex], getNow()), disabled: disabled || !isInMonth(dates[dateIndex], getMonth(referenceDate)), active: active, children: dateNum }, `${getMonth(dates[dateIndex])}/${getDate(dates[dateIndex])}`))) }, `CALENDAR_WEEKS/WEEK_OF/${index}`));
+                    }), disabled: disabled, "aria-disabled": disabled, onClick: onClick, onMouseEnter: onMouseEnter, children: week.map((dateNum, dateIndex) => (jsx(CalendarCell, { today: isSameDate(dates[dateIndex], getNow()), disabled: disabled ||
+                            !isInMonth(dates[dateIndex], getMonth(referenceDate)), active: active, children: dateNum }, `${getMonth(dates[dateIndex])}/${getDate(dates[dateIndex])}`))) }, `CALENDAR_WEEKS/WEEK_OF/${index}`));
             })] }));
 }
 

package/Calendar/CalendarYears.js

@@ -10,7 +10,7 @@ import cx from 'clsx';
  * You may use it to compose your own calendar.
  */
 function CalendarYears(props) {
-    const { getNow, getYear, isYearIncluded, setYear, } = useCalendarContext();
+    const { getNow, getYear, isYearIncluded, setYear } = useCalendarContext();
     const { className, isYearDisabled, isYearInRange, onClick: onClickProp, onYearHover, referenceDate, value, ...rest } = props;
     const [start] = useMemo(() => getCalendarYearRange(getYear(referenceDate)), [getYear, referenceDate]);
     return (jsx("div", { className: cx(calendarClasses.board, className), ...rest, children: jsx("div", { className: calendarClasses.twelveGrid, children: calendarYearsBase.map((base) => {
@@ -18,10 +18,21 @@ function CalendarYears(props) {
                 const yearDateType = setYear(getNow(), thisYear);
                 const disabled = isYearDisabled && isYearDisabled(yearDateType);
                 const inactive = !disabled && (base === 0 || base === 11);
-                const active = !disabled && !inactive && value && isYearIncluded(yearDateType, value);
+                const active = !disabled &&
+                    !inactive &&
+                    value &&
+                    isYearIncluded(yearDateType, value);
                 const inRange = isYearInRange && isYearInRange(yearDateType);
-                const onClick = onClickProp ? () => { onClickProp(yearDateType); } : undefined;
-                const onMouseEnter = onYearHover ? () => { onYearHover(yearDateType); } : undefined;
+                const onClick = onClickProp
+                    ? () => {
+                        onClickProp(yearDateType);
+                    }
+                    : undefined;
+                const onMouseEnter = onYearHover
+                    ? () => {
+                        onYearHover(yearDateType);
+                    }
+                    : undefined;
                 return (jsx("button", { type: "button", "aria-disabled": disabled, disabled: disabled, className: cx(calendarClasses.button, {
                         [calendarClasses.buttonActive]: active,
                         [calendarClasses.buttonInRange]: inRange,

package/Calendar/index.d.ts

@@ -1,12 +1,12 @@
 export { CalendarControlModifier, UseCalendarControlModifiersResult, useCalendarControlModifiers, } from './useCalendarControlModifiers';
-export { useCalendarModeStack, } from './useCalendarModeStack';
-export { useCalendarControls, } from './useCalendarControls';
+export { useCalendarModeStack } from './useCalendarModeStack';
+export { useCalendarControls } from './useCalendarControls';
 export { CalendarConfigs, CalendarConfigProviderProps, CalendarContext, useCalendarContext, default as CalendarConfigProvider, } from './CalendarContext';
-export { CalendarYearsProps, default as CalendarYears, } from './CalendarYears';
-export { CalendarWeeksProps, default as CalendarWeeks, } from './CalendarWeeks';
+export { CalendarYearsProps, default as CalendarYears } from './CalendarYears';
+export { CalendarWeeksProps, default as CalendarWeeks } from './CalendarWeeks';
 export { CalendarMonthsProps, default as CalendarMonths, } from './CalendarMonths';
-export { CalendarDaysProps, default as CalendarDays, } from './CalendarDays';
+export { CalendarDaysProps, default as CalendarDays } from './CalendarDays';
 export { CalendarDayOfWeekProps, default as CalendarDayOfWeek, } from './CalendarDayOfWeek';
 export { CalendarControlsProps, default as CalendarControls, } from './CalendarControls';
-export { CalendarCellProps, default as CalendarCell, } from './CalendarCell';
-export { CalendarProps, default, } from './Calendar';
+export { CalendarCellProps, default as CalendarCell } from './CalendarCell';
+export { CalendarProps, default } from './Calendar';

package/Calendar/useCalendarControlModifiers.js

@@ -3,24 +3,15 @@ import { useMemo } from 'react';
 import { useCalendarContext } from './CalendarContext.js';
 
 function useCalendarControlModifiers() {
-    const { addYear, addMonth, } = useCalendarContext();
+    const { addYear, addMonth } = useCalendarContext();
     return useMemo(() => ({
         year: [
             (date) => addYear(date, -calendarYearModuler),
             (date) => addYear(date, calendarYearModuler),
         ],
-        month: [
-            (date) => addYear(date, -1),
-            (date) => addYear(date, 1),
-        ],
-        week: [
-            (date) => addMonth(date, -1),
-            (date) => addMonth(date, 1),
-        ],
-        day: [
-            (date) => addMonth(date, -1),
-            (date) => addMonth(date, 1),
-        ],
+        month: [(date) => addYear(date, -1), (date) => addYear(date, 1)],
+        week: [(date) => addMonth(date, -1), (date) => addMonth(date, 1)],
+        day: [(date) => addMonth(date, -1), (date) => addMonth(date, 1)],
     }), [addYear, addMonth]);
 }
 

package/Calendar/useCalendarControls.js

@@ -7,7 +7,7 @@ function useCalendarControls(referenceDateProp, mode) {
     useEffect(() => {
         setReferenceDate(referenceDateProp);
     }, [referenceDateProp]);
-    const { currentMode, pushModeStack, popModeStack, } = useCalendarModeStack(mode || 'day');
+    const { currentMode, pushModeStack, popModeStack } = useCalendarModeStack(mode || 'day');
     const modifierGroup = useCalendarControlModifiers();
     const onPrev = () => {
         const [handleMinus] = modifierGroup[currentMode];

package/Calendar/useCalendarModeStack.js

@@ -4,7 +4,7 @@ function useCalendarModeStack(mode) {
     const [modeStack, setModeStack] = useState([mode]);
     const [currentMode] = modeStack;
     const pushModeStack = (newMode) => setModeStack((prev) => [newMode, ...prev]);
-    const popModeStack = () => setModeStack((prev) => (prev.length > 1 ? prev.slice(1, prev.length) : prev));
+    const popModeStack = () => setModeStack((prev) => prev.length > 1 ? prev.slice(1, prev.length) : prev);
     return {
         currentMode,
         pushModeStack,

package/Card/Card.d.ts

@@ -8,7 +8,7 @@ export interface CardProps extends Omit<NativeElementPropsWithoutKeyAndRef<'div'
     actions?: ReactNode;
     /**
      * Card cover.
-    */
+     */
     cover?: ReactNode;
     /**
      * The container of the text content(title, subtitle and description).

package/Card/Card.js

@@ -9,11 +9,11 @@ import cx from 'clsx';
  */
 const Card = forwardRef(function Card(props, ref) {
     const { actions, className, contentProps, cover, description, descriptionProps, metaProps, subtitle, subtitleProps, title, titleProps, ...rest } = props;
-    const { variant = 'h3', } = titleProps || {};
-    const titleTypography = (title ? (jsx(Typography, { variant: variant, ...titleProps, children: title })) : null);
-    const subtitleTypography = (subtitle ? (jsx(Typography, { ...subtitleProps, children: subtitle })) : null);
-    const contentHeader = (titleTypography || subtitleTypography ? (jsxs("div", { className: cardClasses.metaContentsHeader, children: [titleTypography, subtitleTypography] })) : null);
-    const descriptionTypography = (description ? (jsx(Typography, { ...descriptionProps, children: description })) : null);
+    const { variant = 'h3' } = titleProps || {};
+    const titleTypography = title ? (jsx(Typography, { variant: variant, ...titleProps, children: title })) : null;
+    const subtitleTypography = subtitle ? (jsx(Typography, { ...subtitleProps, children: subtitle })) : null;
+    const contentHeader = titleTypography || subtitleTypography ? (jsxs("div", { className: cardClasses.metaContentsHeader, children: [titleTypography, subtitleTypography] })) : null;
+    const descriptionTypography = description ? (jsx(Typography, { ...descriptionProps, children: description })) : null;
     return (jsxs("div", { ref: ref, className: cx(cardClasses.host, className), ...rest, children: [cover, jsxs("div", { className: cardClasses.meta, ...metaProps, children: [jsxs("div", { className: cardClasses.metaContents, ...contentProps, children: [contentHeader, descriptionTypography] }), actions] })] }));
 });
 var Card$1 = Card;

package/Card/CardActions.js

@@ -9,7 +9,7 @@ import cx from 'clsx';
  */
 const CardActions = forwardRef(function CardActions(props, ref) {
     const { cancelText, cancelButtonProps, className, confirmText, confirmButtonProps, hideCancelButton, hideConfirmButton, loading, onCancel, onConfirm, otherActions, ...rest } = props;
-    return (jsxs("div", { ref: ref, className: cx(cardActionsClasses.host, className), ...rest, children: [otherActions || (jsx("div", {})), jsx(ConfirmActions, { cancelText: cancelText, confirmText: confirmText, cancelButtonProps: cancelButtonProps, confirmButtonProps: confirmButtonProps, hideCancelButton: hideCancelButton || !cancelText, hideConfirmButton: hideConfirmButton || !confirmText, loading: loading })] }));
+    return (jsxs("div", { ref: ref, className: cx(cardActionsClasses.host, className), ...rest, children: [otherActions || jsx("div", {}), jsx(ConfirmActions, { cancelText: cancelText, confirmText: confirmText, cancelButtonProps: cancelButtonProps, confirmButtonProps: confirmButtonProps, hideCancelButton: hideCancelButton || !cancelText, hideConfirmButton: hideConfirmButton || !confirmText, loading: loading })] }));
 });
 var CardActions$1 = CardActions;
 

package/Card/index.d.ts

@@ -1,2 +1,2 @@
-export { CardActionsProps, default as CardActions, } from './CardActions';
-export { CardProps, default, } from './Card';
+export { CardActionsProps, default as CardActions } from './CardActions';
+export { CardProps, default } from './Card';

package/Checkbox/CheckAll.js

@@ -11,7 +11,7 @@ import cx from 'clsx';
 const CheckAll = forwardRef(function CheckAll(props, ref) {
     const { children, className, label, ...rest } = props;
     const checkboxGroup = children && Children.only(children);
-    const { disabled, name, onChange, options, size, value, } = (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.props) || {};
+    const { disabled, name, onChange, options, size, value } = (checkboxGroup === null || checkboxGroup === void 0 ? void 0 : checkboxGroup.props) || {};
     const enabledOptions = useMemo(() => options === null || options === void 0 ? void 0 : options.filter((option) => !option.disabled), [options]);
     let allChecked = false;
     let indeterminate = false;

package/Checkbox/Checkbox.js

@@ -12,8 +12,8 @@ import cx from 'clsx';
  * The react component for `mezzanine` checkbox.
  */
 const Checkbox = forwardRef(function Checkbox(props, ref) {
-    const { size: globalSize, } = useContext(MezzanineConfig);
-    const { disabled: disabledFromFormControl, severity, } = useContext(FormControlContext) || {};
+    const { size: globalSize } = useContext(MezzanineConfig);
+    const { disabled: disabledFromFormControl, severity } = useContext(FormControlContext) || {};
     const checkboxGroup = useContext(CheckboxGroupContext);
     const { disabled: disabledFromGroup, name: nameFromGroup, size: sizeFromGroup, } = checkboxGroup || {};
     const { checked: checkedProp, children, defaultChecked, disabled = (disabledFromGroup !== null && disabledFromGroup !== void 0 ? disabledFromGroup : disabledFromFormControl) || false, error = severity === 'error' || false, indeterminate: indeterminateProp = false, onChange: onChangeProp, size = sizeFromGroup || globalSize, value, inputProps, ...rest } = props;
@@ -26,10 +26,10 @@ const Checkbox = forwardRef(function Checkbox(props, ref) {
         value,
     });
     const indeterminate = !checked && indeterminateProp;
-    return (jsx(InputCheck, { ...rest, ref: ref, control: (jsx("span", { className: cx(checkboxClasses.host, {
+    return (jsx(InputCheck, { ...rest, ref: ref, control: jsx("span", { className: cx(checkboxClasses.host, {
                 [checkboxClasses.checked]: checked,
                 [checkboxClasses.indeterminate]: indeterminate,
-            }), children: jsx("input", { ...restInputProps, "aria-checked": indeterminate ? 'mixed' : checked, "aria-disabled": disabled, checked: checked, disabled: disabled, id: inputId, onChange: onChange, name: name, type: "checkbox", value: value }) })), disabled: disabled, error: error, htmlFor: inputId, size: size, children: children }));
+            }), children: jsx("input", { ...restInputProps, "aria-checked": indeterminate ? 'mixed' : checked, "aria-disabled": disabled, checked: checked, disabled: disabled, id: inputId, onChange: onChange, name: name, type: "checkbox", value: value }) }), disabled: disabled, error: error, htmlFor: inputId, size: size, children: children }));
 });
 var Checkbox$1 = Checkbox;
 

package/Checkbox/CheckboxGroup.js

@@ -20,7 +20,9 @@ const CheckboxGroup = forwardRef(function CheckboxGroup(props, ref) {
         name,
         onChange(event) {
             const { checked, value: targetValue } = event.target;
-            const newValue = checked ? [...value, targetValue] : value.filter((v) => v !== targetValue);
+            const newValue = checked
+                ? [...value, targetValue]
+                : value.filter((v) => v !== targetValue);
             setValue(newValue);
             if (onChange) {
                 onChange(newValue, event);

package/Checkbox/index.d.ts

@@ -1,4 +1,4 @@
 export type { CheckboxSize, CheckboxGroupOrientation, CheckboxGroupOption, } from '@mezzanine-ui/core/checkbox';
-export { CheckboxProps, default, } from './Checkbox';
-export { CheckboxGroupProps, default as CheckboxGroup, } from './CheckboxGroup';
-export { CheckAllProps, default as CheckAll, } from './CheckAll';
+export { CheckboxProps, default } from './Checkbox';
+export { CheckboxGroupProps, default as CheckboxGroup } from './CheckboxGroup';
+export { CheckAllProps, default as CheckAll } from './CheckAll';

package/ConfirmActions/ConfirmActions.js

@@ -8,7 +8,7 @@ import ButtonGroup from '../Button/ButtonGroup.js';
  */
 const ConfirmActions = forwardRef(function ConfirmActions(props, ref) {
     const { cancelButtonProps, cancelText, confirmButtonProps, confirmText, hideCancelButton, hideConfirmButton, loading, onCancel, onConfirm, ...rest } = props;
-    const { disabled: cancelButtonDisabled = loading, } = cancelButtonProps || {};
+    const { disabled: cancelButtonDisabled = loading } = cancelButtonProps || {};
     return (jsxs(ButtonGroup, { ...rest, ref: ref, children: [!hideCancelButton && (jsx(Button, { variant: "outlined", ...cancelButtonProps, disabled: cancelButtonDisabled, onClick: onCancel, children: cancelText })), !hideConfirmButton && (jsx(Button, { variant: "contained", ...confirmButtonProps, loading: loading, onClick: onConfirm, children: confirmText }))] }));
 });
 var ConfirmActions$1 = ConfirmActions;

package/ConfirmActions/index.d.ts

@@ -1 +1 @@
-export { ConfirmActionsProps, default, } from './ConfirmActions';
+export { ConfirmActionsProps, default } from './ConfirmActions';

package/DatePicker/DatePicker.js

@@ -17,14 +17,10 @@ import { FormControlContext } from '../Form/FormControlContext.js';
  */
 const DatePicker = forwardRef(function DatePicker(props, ref) {
     const { disabled: disabledFromFormControl, fullWidth: fullWidthFromFormControl, required: requiredFromFormControl, severity, } = useContext(FormControlContext) || {};
-    const { defaultDateFormat, getNow, } = useCalendarContext();
+    const { defaultDateFormat, getNow } = useCalendarContext();
     const { calendarProps, className, clearable = true, defaultValue, disabledMonthSwitch = false, disableOnNext, disableOnPrev, disabledYearSwitch = false, disabled = disabledFromFormControl || false, displayMonthLocale, error = severity === 'error' || false, fadeProps, format = defaultDateFormat, fullWidth = fullWidthFromFormControl || false, inputProps, isDateDisabled, isMonthDisabled, isWeekDisabled, isYearDisabled, mode = 'day', onCalendarToggle: onCalendarToggleProp, onChange: onChangeProp, placeholder, popperProps, prefix, readOnly, referenceDate: referenceDateProp, required = requiredFromFormControl || false, size, value: valueProp, ...restTriggerProps } = props;
     const { onBlur: onBlurProp, onKeyDown: onKeyDownProp, onFocus: onFocusProp, size: inputSize = format.length + 2, ...restInputProp } = inputProps || {};
-    const formats = useMemo(() => [
-        format,
-        defaultDateFormat,
-        getDefaultModeFormat(mode),
-    ], [defaultDateFormat, format, mode]);
+    const formats = useMemo(() => [format, defaultDateFormat, getDefaultModeFormat(mode)], [defaultDateFormat, format, mode]);
     /** Calender display control */
     const [open, setOpen] = useState(false);
     const preventOpen = readOnly;
@@ -127,7 +123,7 @@ const DatePicker = forwardRef(function DatePicker(props, ref) {
         }
         onCalendarToggle(!open);
     };
-    const suffixActionIcon = (jsx(Icon, { icon: CalendarIcon, onClick: onIconClick }));
+    const suffixActionIcon = jsx(Icon, { icon: CalendarIcon, onClick: onIconClick });
     return (jsxs(Fragment, { children: [jsx(PickerTrigger, { ...restTriggerProps, ref: triggerComposedRef, className: className, clearable: clearable, disabled: disabled, error: error, fullWidth: fullWidth, inputProps: resolvedInputProps, inputRef: inputRef, onChange: onInputChange, onClear: onClear, placeholder: placeholder, prefix: prefix, readOnly: readOnly, required: required, size: size, suffixActionIcon: suffixActionIcon, value: inputValue }), jsx(DatePickerCalendar, { ref: calendarRef, anchor: anchorRef, calendarProps: calendarProps, disabledMonthSwitch: disabledMonthSwitch, disableOnNext: disableOnNext, disableOnPrev: disableOnPrev, disabledYearSwitch: disabledYearSwitch, displayMonthLocale: displayMonthLocale, fadeProps: fadeProps, isDateDisabled: isDateDisabled, isMonthDisabled: isMonthDisabled, isWeekDisabled: isWeekDisabled, isYearDisabled: isYearDisabled, mode: mode, onChange: onCalendarChange, open: open, popperProps: popperProps, referenceDate: referenceDate, value: internalValue })] }));
 });
 var DatePicker$1 = DatePicker;

package/DatePicker/DatePickerCalendar.js

@@ -25,7 +25,9 @@ const DatePickerCalendar = forwardRef(function DatePickerCalendar(props, ref) {
         }
         if (currentMode === 'month') {
             return (target) => {
-                const result = currentMode === mode ? target : setMonth(referenceDate, getMonth(target));
+                const result = currentMode === mode
+                    ? target
+                    : setMonth(referenceDate, getMonth(target));
                 updateReferenceDate(result);
                 popModeStack();
                 if (currentMode === mode && onChangeProp) {
@@ -35,7 +37,9 @@ const DatePickerCalendar = forwardRef(function DatePickerCalendar(props, ref) {
         }
         if (currentMode === 'year') {
             return (target) => {
-                const result = currentMode === mode ? target : setYear(referenceDate, getYear(target));
+                const result = currentMode === mode
+                    ? target
+                    : setYear(referenceDate, getYear(target));
                 updateReferenceDate(result);
                 popModeStack();
                 if (currentMode === mode && onChangeProp) {

package/DatePicker/index.d.ts

@@ -1,2 +1,2 @@
 export { DatePickerCalendarProps, default as DatePickerCalendar, } from './DatePickerCalendar';
-export { DatePickerProps, default, } from './DatePicker';
+export { DatePickerProps, default } from './DatePicker';