@availity/mui-datepicker 1.1.3 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/index.d.mts +3 -1
  3. package/dist/index.d.ts +3 -1
  4. package/dist/index.js +12 -1
  5. package/dist/index.mjs +12 -1
  6. package/package.json +1 -1
  7. package/src/lib/Datepicker.tsx +11 -1
package/CHANGELOG.md CHANGED
@@ -2,6 +2,13 @@
2
2
 
3
3
  This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
4
4
 
5
+ ## [1.2.0](https://github.com/Availity/element/compare/@availity/mui-datepicker@1.1.3...@availity/mui-datepicker@1.2.0) (2025-06-23)
6
+
7
+
8
+ ### Features
9
+
10
+ * **mui-datepicker:** allow clearable ([60a645f](https://github.com/Availity/element/commit/60a645f8205da1bf886e3de277b3167cef54991c))
11
+
5
12
  ## [1.1.3](https://github.com/Availity/element/compare/@availity/mui-datepicker@1.1.2...@availity/mui-datepicker@1.1.3) (2025-06-13)
6
13
 
7
14
  ### Dependency Updates
package/dist/index.d.mts CHANGED
@@ -10,7 +10,9 @@ type DatepickerProps = {
10
10
  * @default bottom-start
11
11
  */
12
12
  placement?: 'bottom-start' | 'bottom' | 'bottom-end';
13
+ /** Determines if the clear button appears in the action bar */
14
+ clearable?: boolean;
13
15
  } & Omit<DatePickerProps<Dayjs, false>, 'components' | 'componentsProps' | 'desktopModeMediaQuery' | 'DialogProps' | 'OpenPickerButtonProps' | 'openTo' | 'orientation' | 'PaperProps' | 'PopperProps' | 'reduceAnimations' | 'renderInput' | 'rifmFormatter' | 'showToolbar' | 'slots' | 'slotProps' | 'ToolbarComponent' | 'toolbarFormat' | 'toolbarPlaceholder' | 'toolbarTitle' | 'TransitionComponent' | 'value'>;
14
- declare const Datepicker: ({ FieldProps, placement, ...props }: DatepickerProps) => JSX.Element;
16
+ declare const Datepicker: ({ FieldProps, placement, clearable, ...props }: DatepickerProps) => JSX.Element;
15
17
 
16
18
  export { Datepicker, type DatepickerProps };
package/dist/index.d.ts CHANGED
@@ -10,7 +10,9 @@ type DatepickerProps = {
10
10
  * @default bottom-start
11
11
  */
12
12
  placement?: 'bottom-start' | 'bottom' | 'bottom-end';
13
+ /** Determines if the clear button appears in the action bar */
14
+ clearable?: boolean;
13
15
  } & Omit<DatePickerProps<Dayjs, false>, 'components' | 'componentsProps' | 'desktopModeMediaQuery' | 'DialogProps' | 'OpenPickerButtonProps' | 'openTo' | 'orientation' | 'PaperProps' | 'PopperProps' | 'reduceAnimations' | 'renderInput' | 'rifmFormatter' | 'showToolbar' | 'slots' | 'slotProps' | 'ToolbarComponent' | 'toolbarFormat' | 'toolbarPlaceholder' | 'toolbarTitle' | 'TransitionComponent' | 'value'>;
14
- declare const Datepicker: ({ FieldProps, placement, ...props }: DatepickerProps) => JSX.Element;
16
+ declare const Datepicker: ({ FieldProps, placement, clearable, ...props }: DatepickerProps) => JSX.Element;
15
17
 
16
18
  export { Datepicker, type DatepickerProps };
package/dist/index.js CHANGED
@@ -61,13 +61,24 @@ var import_jsx_runtime = require("react/jsx-runtime");
61
61
  var paperProps = { elevation: 8, variant: "elevation", sx: { marginTop: "4px" } };
62
62
  var PickerTextField = (params) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_textfield.TextField, __spreadProps(__spreadValues({}, params), { placeholder: "MM/DD/YYYY" }));
63
63
  var Datepicker = (_a) => {
64
- var _b = _a, { FieldProps, placement = "bottom-start" } = _b, props = __objRest(_b, ["FieldProps", "placement"]);
64
+ var _b = _a, {
65
+ FieldProps,
66
+ placement = "bottom-start",
67
+ clearable
68
+ } = _b, props = __objRest(_b, [
69
+ "FieldProps",
70
+ "placement",
71
+ "clearable"
72
+ ]);
65
73
  var _a2, _b2, _c, _d, _e, _f;
66
74
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
67
75
  import_DatePicker.DatePicker,
68
76
  __spreadProps(__spreadValues({}, props), {
69
77
  dayOfWeekFormatter: (weekday) => weekday.format("dd"),
70
78
  slotProps: {
79
+ actionBar: {
80
+ actions: clearable ? ["clear"] : []
81
+ },
71
82
  desktopPaper: paperProps,
72
83
  mobilePaper: __spreadProps(__spreadValues({}, paperProps), {
73
84
  "aria-label": ((_a2 = FieldProps == null ? void 0 : FieldProps.label) == null ? void 0 : _a2.toString()) || ((_b2 = FieldProps == null ? void 0 : FieldProps.inputProps) == null ? void 0 : _b2["aria-label"]) || "Date picker",
package/dist/index.mjs CHANGED
@@ -38,13 +38,24 @@ import { jsx } from "react/jsx-runtime";
38
38
  var paperProps = { elevation: 8, variant: "elevation", sx: { marginTop: "4px" } };
39
39
  var PickerTextField = (params) => /* @__PURE__ */ jsx(TextField, __spreadProps(__spreadValues({}, params), { placeholder: "MM/DD/YYYY" }));
40
40
  var Datepicker = (_a) => {
41
- var _b = _a, { FieldProps, placement = "bottom-start" } = _b, props = __objRest(_b, ["FieldProps", "placement"]);
41
+ var _b = _a, {
42
+ FieldProps,
43
+ placement = "bottom-start",
44
+ clearable
45
+ } = _b, props = __objRest(_b, [
46
+ "FieldProps",
47
+ "placement",
48
+ "clearable"
49
+ ]);
42
50
  var _a2, _b2, _c, _d, _e, _f;
43
51
  return /* @__PURE__ */ jsx(
44
52
  MuiDatePicker,
45
53
  __spreadProps(__spreadValues({}, props), {
46
54
  dayOfWeekFormatter: (weekday) => weekday.format("dd"),
47
55
  slotProps: {
56
+ actionBar: {
57
+ actions: clearable ? ["clear"] : []
58
+ },
48
59
  desktopPaper: paperProps,
49
60
  mobilePaper: __spreadProps(__spreadValues({}, paperProps), {
50
61
  "aria-label": ((_a2 = FieldProps == null ? void 0 : FieldProps.label) == null ? void 0 : _a2.toString()) || ((_b2 = FieldProps == null ? void 0 : FieldProps.inputProps) == null ? void 0 : _b2["aria-label"]) || "Date picker",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@availity/mui-datepicker",
3
- "version": "1.1.3",
3
+ "version": "1.2.0",
4
4
  "description": "Availity MUI Datepicker Component - part of the @availity/element design system",
5
5
  "keywords": [
6
6
  "react",
package/src/lib/Datepicker.tsx CHANGED
@@ -12,6 +12,8 @@ export type DatepickerProps = {
12
12
  * @default bottom-start
13
13
  */
14
14
  placement?: 'bottom-start' | 'bottom' | 'bottom-end';
15
+ /** Determines if the clear button appears in the action bar */
16
+ clearable?: boolean;
15
17
  } & Omit<
16
18
  MuiDatePickerProps<Dayjs, false>,
17
19
  | 'components'
@@ -41,12 +43,20 @@ const paperProps = { elevation: 8, variant: 'elevation', sx: { marginTop: '4px'
41
43
 
42
44
  const PickerTextField = (params: TextFieldProps) => <TextField {...params} placeholder="MM/DD/YYYY" />;
43
45
 
44
- export const Datepicker = ({ FieldProps, placement = 'bottom-start', ...props }: DatepickerProps): JSX.Element => {
46
+ export const Datepicker = ({
47
+ FieldProps,
48
+ placement = 'bottom-start',
49
+ clearable,
50
+ ...props
51
+ }: DatepickerProps): JSX.Element => {
45
52
  return (
46
53
  <MuiDatePicker
47
54
  {...props}
48
55
  dayOfWeekFormatter={(weekday: Dayjs) => weekday.format('dd')}
49
56
  slotProps={{
57
+ actionBar: {
58
+ actions: clearable ? ['clear'] : [],
59
+ },
50
60
  desktopPaper: paperProps,
51
61
  mobilePaper: {
52
62
  ...paperProps,