musae 1.0.27-beta.3 → 1.0.27-beta.31

package/dist/components/avatar/avatar.cjs

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var React = require('react');
-var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var context = require('./context.cjs');
 var hooks = require('../theme/hooks.cjs');
 var theme = require('../theme/theme.cjs');

package/dist/components/avatar/avatar.mjs

@@ -1,7 +1,7 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import React, { forwardRef, useContext } from 'react';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import Context, { CLASS_NAMES } from './context.mjs';
 import { useTheme } from '../theme/hooks.mjs';
 import { $label } from '../theme/theme.mjs';

package/dist/components/badge/badge.cjs

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var React = require('react');
 var useClassNames = require('../../hooks/use-class-names.cjs');
-var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var theme = require('../theme/theme.cjs');
 var hooks = require('../theme/hooks.cjs');
 var relax = require('@aiszlab/relax');

package/dist/components/badge/badge.mjs

@@ -1,7 +1,7 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import React from 'react';
 import { useClassNames } from '../../hooks/use-class-names.mjs';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { $label } from '../theme/theme.mjs';
 import { useTheme } from '../theme/hooks.mjs';
 import { isVoid } from '@aiszlab/relax';

package/dist/components/bench/bench.cjs

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var React = require('react');
-var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var hooks = require('./hooks.cjs');
 var theme = require('../theme/theme.cjs');
 var className = require('@aiszlab/relax/class-name');

package/dist/components/bench/bench.mjs

@@ -1,6 +1,6 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import React from 'react';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { useLogo, useNavigations, useMenuKeys, useMenuItems } from './hooks.mjs';
 import { $title } from '../theme/theme.mjs';
 import { stringify } from '@aiszlab/relax/class-name';

package/dist/components/breadcrumb/breadcrumb.cjs

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var React = require('react');
-var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var theme = require('../theme/theme.cjs');
 var hooks = require('../theme/hooks.cjs');
 var useClassNames = require('../../hooks/use-class-names.cjs');

package/dist/components/breadcrumb/breadcrumb.mjs

@@ -1,6 +1,6 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import React from 'react';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { $label } from '../theme/theme.mjs';
 import { useTheme } from '../theme/hooks.mjs';
 import { useClassNames } from '../../hooks/use-class-names.mjs';

package/dist/components/breadcrumb/item.cjs

@@ -23,11 +23,14 @@ var Item = function Item(_ref) {
         className: "musaex-tem6mo"
       },
       1: {
-        className: "musaex-tem6mo musaex-ipt7de musaex-db68te musaex-10rslkf musaex-1nx0wnt musaex-fagghw musaex-1ptezny"
+        className: "musaex-tem6mo musaex-ipt7de musaex-db68te musaex-5nhjnm musaex-1i6b086 musaex-fagghw musaex-1ptezny"
       }
     }[!!isLink << 0],
     separator: {
       className: "musaex-1erkn4t"
+    },
+    anchor: {
+      className: "musaex-1hl2dhg musaex-1heor9g"
     }
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("li", {
@@ -36,9 +39,9 @@ var Item = function Item(_ref) {
       "--color-surface": theme.colors.surface,
       "--color-on-surface": theme.colors["on-surface"]
     })
-  }, isLink && /*#__PURE__*/React.createElement("a", {
+  }, isLink && (/*#__PURE__*/React.createElement("a", _objectSpread(_objectSpread({}, styled.anchor), {}, {
     href: href
-  }, label), !isLink && label), !max && (/*#__PURE__*/React.createElement("li", {
+  }), label)), !isLink && label), !max && (/*#__PURE__*/React.createElement("li", {
     role: "separator",
     className: className.stringify(classNames.separator, styled.separator.className),
     style: styled.separator.style

package/dist/components/breadcrumb/item.mjs

@@ -19,11 +19,14 @@ var Item = function Item(_ref) {
         className: "musaex-tem6mo"
       },
       1: {
-        className: "musaex-tem6mo musaex-ipt7de musaex-db68te musaex-10rslkf musaex-1nx0wnt musaex-fagghw musaex-1ptezny"
+        className: "musaex-tem6mo musaex-ipt7de musaex-db68te musaex-5nhjnm musaex-1i6b086 musaex-fagghw musaex-1ptezny"
       }
     }[!!isLink << 0],
     separator: {
       className: "musaex-1erkn4t"
+    },
+    anchor: {
+      className: "musaex-1hl2dhg musaex-1heor9g"
     }
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("li", {
@@ -32,9 +35,9 @@ var Item = function Item(_ref) {
       "--color-surface": theme.colors.surface,
       "--color-on-surface": theme.colors["on-surface"]
     })
-  }, isLink && /*#__PURE__*/React.createElement("a", {
+  }, isLink && (/*#__PURE__*/React.createElement("a", _objectSpread(_objectSpread({}, styled.anchor), {}, {
     href: href
-  }, label), !isLink && label), !max && (/*#__PURE__*/React.createElement("li", {
+  }), label)), !isLink && label), !max && (/*#__PURE__*/React.createElement("li", {
     role: "separator",
     className: stringify(classNames.separator, styled.separator.className),
     style: styled.separator.style

package/dist/components/button/button.cjs

@@ -6,7 +6,7 @@ var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var React = require('react');
 var className = require('@aiszlab/relax/class-name');
-var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var tokens_stylex = require('../theme/tokens.stylex.cjs');
 var hooks = require('../theme/hooks.cjs');
 var hooks$1 = require('./hooks.cjs');

package/dist/components/button/button.mjs

@@ -2,7 +2,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import React, { forwardRef } from 'react';
 import { stringify } from '@aiszlab/relax/class-name';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { OPACITY } from '../theme/tokens.stylex.mjs';
 import { useTheme } from '../theme/hooks.mjs';
 import { useButton } from './hooks.mjs';

package/dist/components/button/styles.cjs

@@ -36,7 +36,7 @@ var styles = {
       kMzoRj: "musaex-k59kd",
       kWkggS: "musaex-onffnr",
       kMwMTN: "musaex-1nt3oiv",
-      kwh8RV: "musaex-8eoi9k",
+      kkqDRM: "musaex-52rqan",
       $$css: true
     },
     outlined: {
@@ -44,12 +44,12 @@ var styles = {
       ksu8eU: "musaex-1y0btm7",
       kVAM5u: "musaex-1u22kak",
       kMwMTN: "musaex-erz01e",
-      kGzVvX: "musaex-liky03",
+      kHE3J0: "musaex-iy4r31",
       $$css: true
     },
     text: {
       kMwMTN: "musaex-erz01e",
-      kGzVvX: "musaex-liky03",
+      kHE3J0: "musaex-iy4r31",
       $$css: true
     }
   },
@@ -117,7 +117,7 @@ var styles = {
       kGVxlE: null,
       kVAM5u: null,
       kWkggS: null,
-      kwh8RV: null,
+      kkqDRM: null,
       $$css: true
     },
     filled: {
@@ -129,7 +129,7 @@ var styles = {
       $$css: true
     },
     text: {
-      kGzVvX: null,
+      kHE3J0: null,
       $$css: true
     }
   }

package/dist/components/button/styles.d.ts

@@ -31,7 +31,9 @@ declare const styles: {
             readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", "var(--color-button)">;
             readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-on-button)">;
             readonly ":hover": import("@stylexjs/stylex").StyleXClassNameFor<":hover", {
-                readonly boxShadow: import("@stylexjs/stylex").StyleXVar<string>;
+                readonly "@media (hover: hover)": {
+                    readonly boxShadow: import("@stylexjs/stylex").StyleXVar<string>;
+                };
             }>;
         }>;
         readonly outlined: Readonly<{
@@ -40,13 +42,17 @@ declare const styles: {
             readonly borderColor: import("@stylexjs/stylex").StyleXClassNameFor<"borderColor", "var(--color-button)">;
             readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-button)">;
             readonly ":hover": import("@stylexjs/stylex").StyleXClassNameFor<":hover", {
-                readonly backgroundColor: "var(--color-button-opacity-08)";
+                readonly "@media (hover: hover)": {
+                    readonly backgroundColor: "var(--color-button-opacity-08)";
+                };
             }>;
         }>;
         readonly text: Readonly<{
             readonly color: import("@stylexjs/stylex").StyleXClassNameFor<"color", "var(--color-button)">;
             readonly ":hover": import("@stylexjs/stylex").StyleXClassNameFor<":hover", {
-                readonly backgroundColor: "var(--color-button-opacity-08)";
+                readonly "@media (hover: hover)": {
+                    readonly backgroundColor: "var(--color-button-opacity-08)";
+                };
             }>;
         }>;
     }>;
@@ -116,7 +122,9 @@ declare const styles: {
             readonly borderColor: import("@stylexjs/stylex").StyleXClassNameFor<"borderColor", null>;
             readonly backgroundColor: import("@stylexjs/stylex").StyleXClassNameFor<"backgroundColor", null>;
             readonly ":hover": import("@stylexjs/stylex").StyleXClassNameFor<":hover", {
-                readonly boxShadow: null;
+                readonly "@media (hover: hover)": {
+                    readonly boxShadow: null;
+                };
             }>;
         }>;
         readonly filled: Readonly<{
@@ -127,7 +135,9 @@ declare const styles: {
         }>;
         readonly text: Readonly<{
             readonly ":hover": import("@stylexjs/stylex").StyleXClassNameFor<":hover", {
-                readonly backgroundColor: null;
+                readonly "@media (hover: hover)": {
+                    readonly backgroundColor: null;
+                };
             }>;
         }>;
     }>;

package/dist/components/button/styles.mjs

@@ -32,7 +32,7 @@ var styles = {
       kMzoRj: "musaex-k59kd",
       kWkggS: "musaex-onffnr",
       kMwMTN: "musaex-1nt3oiv",
-      kwh8RV: "musaex-8eoi9k",
+      kkqDRM: "musaex-52rqan",
       $$css: true
     },
     outlined: {
@@ -40,12 +40,12 @@ var styles = {
       ksu8eU: "musaex-1y0btm7",
       kVAM5u: "musaex-1u22kak",
       kMwMTN: "musaex-erz01e",
-      kGzVvX: "musaex-liky03",
+      kHE3J0: "musaex-iy4r31",
       $$css: true
     },
     text: {
       kMwMTN: "musaex-erz01e",
-      kGzVvX: "musaex-liky03",
+      kHE3J0: "musaex-iy4r31",
       $$css: true
     }
   },
@@ -113,7 +113,7 @@ var styles = {
       kGVxlE: null,
       kVAM5u: null,
       kWkggS: null,
-      kwh8RV: null,
+      kkqDRM: null,
       $$css: true
     },
     filled: {
@@ -125,7 +125,7 @@ var styles = {
       $$css: true
     },
     text: {
-      kGzVvX: null,
+      kHE3J0: null,
       $$css: true
     }
   }

package/dist/components/calendar/calendar.cjs

@@ -6,7 +6,7 @@ var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var React = require('react');
 var hooks = require('./hooks.cjs');
 var useClassNames = require('../../hooks/use-class-names.cjs');
-var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var className = require('@aiszlab/relax/class-name');
 var hooks$1 = require('../theme/hooks.cjs');
 var iconButton = require('../icon-button/icon-button.cjs');
@@ -38,6 +38,7 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var className$1 = _ref.className,
     style = _ref.style,
     value = _ref.value,
+    disabledDate = _ref.disabledDate,
     _onClick = _ref.onClick;
   var classNames = useClassNames.useClassNames(context.CLASS_NAMES);
   var _useValue = hooks.useValue({
@@ -58,7 +59,8 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var dateCells = hooks.useDateCells({
     timespan: timespan,
     focusedAt: focusedAt,
-    click: onClick,
+    onClick: onClick,
+    disabledDate: disabledDate,
     classNames: classNames
   });
   var headCells = hooks.useHeadCells({
@@ -72,7 +74,7 @@ var Calendar = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     header: stylex.props(theme.$label.large, styles.header),
     heading: stylex.props(styles.heading, theme.$body.medium),
     body: {
-      className: "musaex-1mwwwfo"
+      className: "musaex-1vathgz musaex-4jqler"
     }
   };
   React.useImperativeHandle(ref, function () {

package/dist/components/calendar/calendar.d.ts

@@ -3,5 +3,6 @@ import type { CalendarRef } from "../../types/calendar";
 declare const Calendar: React.ForwardRefExoticComponent<import("../../types/element").ComponentProps & {
     value?: import("dayjs").Dayjs | [import("@aiszlab/relax/types").Partialable<import("dayjs").Dayjs>, import("@aiszlab/relax/types").Partialable<import("dayjs").Dayjs>];
     onClick?: (value: import("dayjs").Dayjs) => void;
+    disabledDate?: (date: import("dayjs").Dayjs) => boolean;
 } & React.RefAttributes<CalendarRef>>;
 export default Calendar;

package/dist/components/calendar/calendar.mjs

@@ -2,7 +2,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import React, { forwardRef, useImperativeHandle } from 'react';
 import { useValue, useFocusedAt, useDateCells, useHeadCells } from './hooks.mjs';
 import { useClassNames } from '../../hooks/use-class-names.mjs';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { stringify } from '@aiszlab/relax/class-name';
 import { useTheme } from '../theme/hooks.mjs';
 import IconButton from '../icon-button/icon-button.mjs';
@@ -34,6 +34,7 @@ var Calendar = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var className = _ref.className,
     style = _ref.style,
     value = _ref.value,
+    disabledDate = _ref.disabledDate,
     _onClick = _ref.onClick;
   var classNames = useClassNames(CLASS_NAMES);
   var _useValue = useValue({
@@ -54,7 +55,8 @@ var Calendar = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var dateCells = useDateCells({
     timespan: timespan,
     focusedAt: focusedAt,
-    click: onClick,
+    onClick: onClick,
+    disabledDate: disabledDate,
     classNames: classNames
   });
   var headCells = useHeadCells({
@@ -68,7 +70,7 @@ var Calendar = /*#__PURE__*/forwardRef(function (_ref, ref) {
     header: props($label.large, styles.header),
     heading: props(styles.heading, $body.medium),
     body: {
-      className: "musaex-1mwwwfo"
+      className: "musaex-1vathgz musaex-4jqler"
     }
   };
   useImperativeHandle(ref, function () {

package/dist/components/calendar/contribution.cjs

@@ -6,7 +6,7 @@ var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
 var dayjs = require('dayjs');
 var React = require('react');
-var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var hooks = require('../theme/hooks.cjs');
 var tooltip = require('../tooltip/tooltip.cjs');
 var relax = require('@aiszlab/relax');

package/dist/components/calendar/contribution.mjs

@@ -2,7 +2,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import dayjs from 'dayjs';
 import React, { useMemo } from 'react';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
 import { useTheme } from '../theme/hooks.mjs';
 import Tooltip from '../tooltip/tooltip.mjs';
 import { min, clamp, toFunction } from '@aiszlab/relax';

package/dist/components/calendar/hooks.cjs

@@ -8,7 +8,7 @@ var React = require('react');
 var relax = require('@aiszlab/relax');
 var timespan = require('../../utils/timespan.cjs');
 var className = require('@aiszlab/relax/class-name');
-var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.17.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.18.3/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
 var iconButton = require('../icon-button/icon-button.cjs');
 var theme = require('../theme/theme.cjs');
 var useThemeColorVars = require('../../hooks/use-theme-color-vars.cjs');
@@ -30,7 +30,6 @@ var styles = {
     kgeoSG: "musaex-10tli2e",
     kEoFBp: "musaex-1hmns74",
     kLkRvE: "musaex-14lex9m",
-    kxmVGU: "musaex-rt65ts",
     kgzTxl: "musaex-4dflte",
     $$css: true
   },
@@ -39,17 +38,17 @@ var styles = {
     $$css: true
   },
   range: {
-    kSJ0CW: "musaex-1682cnc",
-    koaPKo: "musaex-typ5od",
+    kSJ0CW: "musaex-1d34y9o",
+    koaPKo: "musaex-vgnsxj",
     $$css: true
   },
   from: {
     kSJ0CW: "musaex-fbisj7",
-    koaPKo: "musaex-typ5od",
+    koaPKo: "musaex-vgnsxj",
     $$css: true
   },
   to: {
-    kSJ0CW: "musaex-1682cnc",
+    kSJ0CW: "musaex-1d34y9o",
     koaPKo: "musaex-1gkks1t",
     $$css: true
   }
@@ -80,7 +79,8 @@ var useHeadCells = function useHeadCells(_ref) {
 var useDateCells = function useDateCells(_ref2) {
   var timespan = _ref2.timespan,
     focusedAt = _ref2.focusedAt,
-    click = _ref2.click,
+    _onClick = _ref2.onClick,
+    disabledDate = _ref2.disabledDate,
     classNames = _ref2.classNames;
   var _themeColorVars = useThemeColorVars.useThemeColorVars(["secondary-container"]);
   return React.useMemo(function () {
@@ -90,35 +90,38 @@ var useDateCells = function useDateCells(_ref2) {
     var to = end.endOf("week");
     var gap = to.diff(from, "d") + 1;
     var dateCells = Array.from(new Array(gap).keys()).reduce(function (prev, _, index) {
+      var _prev$at;
       if (prev.at(prev.length - 1).length === 7) prev.push([]);
       var currentAt = from.add(index, "d");
       var formatted = currentAt.format("YYYY-MM-DD");
       var isFrom = timespan.isFrom(currentAt);
       var isTo = timespan.isTo(currentAt);
       var isBetween = timespan.isBetween(currentAt);
-      var isDisabled = currentAt.isBefore(start, "d") || currentAt.isAfter(end, "d");
+      var isHidden = currentAt.isBefore(start, "d") || currentAt.isAfter(end, "d");
+      var isDisabled = isHidden || !!(disabledDate !== null && disabledDate !== void 0 && disabledDate(currentAt));
       var isSelected = isFrom || isTo;
       var styled = {
-        cell: stylex.props(styles.cell, styles.date, isDisabled && styles.hidden, isBetween && styles.range, isFrom && timespan.isRange && styles.from, isTo && timespan.isRange && styles.to, theme.$body.large),
+        cell: stylex.props(styles.cell, styles.date, isHidden && styles.hidden, isBetween && styles.range, isFrom && timespan.isRange && styles.from, isTo && timespan.isRange && styles.to, theme.$body.large),
         trigger: {
-          className: "musaex-zzs3sa musaex-1nnj97i"
+          className: "musaex-zzs3sa"
         }
       };
-      prev.at(prev.length - 1).push(/*#__PURE__*/React.createElement("td", {
+      (_prev$at = prev.at(prev.length - 1)) === null || _prev$at === void 0 || _prev$at.push(/*#__PURE__*/React.createElement("td", {
         title: formatted,
         key: formatted,
-        className: className.stringify(classNames.dateCell, _objectSpread(_defineProperty({}, classNames.dateCellSelected, isSelected), timespan.isRange && _defineProperty(_defineProperty(_defineProperty({}, classNames.dateCellInRange, isBetween), classNames.dateCellRangeFrom, isFrom), classNames.dateCellRangeTo, isTo)), styled.cell.className),
+        className: className.stringify(classNames.dateCell, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, classNames.dateCellSelected, isSelected), classNames.dateCellInRange, !!timespan.isRange && isBetween), classNames.dateCellRangeFrom, !!timespan.isRange && isFrom), classNames.dateCellRangeTo, !!timespan.isRange && isTo), styled.cell.className),
         style: _objectSpread(_objectSpread({}, styled.cell.style), _themeColorVars),
         "aria-selected": isSelected,
-        "aria-hidden": isDisabled
+        "aria-hidden": isHidden
       }, /*#__PURE__*/React.createElement(iconButton.default, {
         variant: isSelected ? "filled" : "text",
         size: "small",
         color: isSelected ? "primary" : "secondary",
+        disabled: isDisabled,
         className: className.stringify(classNames.date, styled.trigger.className),
         style: styled.trigger.style,
         onClick: function onClick() {
-          click(currentAt);
+          _onClick(currentAt);
         }
       }, currentAt.date())));
       return prev;
@@ -128,15 +131,15 @@ var useDateCells = function useDateCells(_ref2) {
         key: index
       }, cells);
     });
-  }, [focusedAt, timespan, classNames, click, _themeColorVars]);
+  }, [focusedAt, timespan, classNames, _onClick, disabledDate, _themeColorVars]);
 };
 /**
  * @description
  * time span
  */
-var useValue = function useValue(_ref4) {
-  var _click = _ref4.onClick,
-    value = _ref4.value;
+var useValue = function useValue(_ref3) {
+  var _click = _ref3.onClick,
+    value = _ref3.value;
   // change handler
   var onClick = React.useCallback(function (_value) {
     _click === null || _click === void 0 || _click(_value);
@@ -161,9 +164,9 @@ var useValue = function useValue(_ref4) {
  * @description
  * point at
  */
-var useFocusedAt = function useFocusedAt(_ref5) {
-  var _ref5$focusedAt = _ref5.focusedAt,
-    _focusedAt = _ref5$focusedAt === void 0 ? dayjs() : _ref5$focusedAt;
+var useFocusedAt = function useFocusedAt(_ref4) {
+  var _ref4$focusedAt = _ref4.focusedAt,
+    _focusedAt = _ref4$focusedAt === void 0 ? dayjs() : _ref4$focusedAt;
   var _useState = React.useState(_focusedAt),
     _useState2 = _slicedToArray(_useState, 2),
     focusedAt = _useState2[0],

package/dist/components/calendar/hooks.d.ts

@@ -15,10 +15,11 @@ export declare const useHeadCells: ({ classNames }: {
  * @description
  * dates
  */
-export declare const useDateCells: ({ timespan, focusedAt, click, classNames, }: {
+export declare const useDateCells: ({ timespan, focusedAt, onClick, disabledDate, classNames, }: {
     timespan: Timespan;
     focusedAt: Dayjs;
-    click: Required<CalendarProps>["onClick"];
+    onClick: Required<CalendarProps>["onClick"];
+    disabledDate?: CalendarProps["disabledDate"];
     classNames: typeof CLASS_NAMES;
 }) => React.JSX.Element[];
 /**