musae 0.2.26 → 0.3.1

package/dist/components/button/button.cjs

@@ -0,0 +1,298 @@
+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 className = require('../../utils/class-name.cjs');
+var relax = require('@aiszlab/relax');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.7.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var hooks = require('../theme/hooks.cjs');
+var hooks$1 = require('./hooks.cjs');
+var ripple = require('../ripple/ripple.cjs');
+var theme = require('../theme/theme.cjs');
+var colors = require('../../utils/colors.cjs');
+var layer = require('../../utils/layer.cjs');
+var useClassNames = require('../../hooks/use-class-names.cjs');
+var componentToken = require('../../utils/component-token.cjs');
+
+var _excluded = ["children", "className", "style", "color", "size", "variant", "shape", "disabled", "ripple", "type", "onClick", "prefix", "suffix"];
+var styles = {
+  button: {
+    position: "musaex-1n2onr6",
+    overflow: "musaex-b3r6kr",
+    overflowX: null,
+    overflowY: null,
+    display: "musaex-3nfvp2",
+    alignItems: "musaex-6s0dn4",
+    justifyContent: "musaex-l56j7k",
+    gap: "musaex-1lsrmdg",
+    rowGap: null,
+    columnGap: null,
+    whiteSpace: "musaex-uxw1ft",
+    transitionProperty: "musaex-fagghw",
+    transitionDuration: "musaex-1d8287x",
+    willChange: "musaex-19v51jg",
+    flexShrink: "musaex-2lah0s",
+    $$css: true
+  },
+  small: {
+    paddingBlock: "musaex-133qg4p",
+    paddingTop: null,
+    paddingBottom: null,
+    paddingInline: "musaex-n18ftv",
+    paddingStart: null,
+    paddingLeft: null,
+    paddingEnd: null,
+    paddingRight: null,
+    minHeight: "musaex-1ite1z3",
+    minWidth: "musaex-8pi1lr",
+    $$css: true
+  },
+  medium: {
+    paddingBlock: "musaex-15v7278",
+    paddingTop: null,
+    paddingBottom: null,
+    paddingInline: "musaex-ei3nwd",
+    paddingStart: null,
+    paddingLeft: null,
+    paddingEnd: null,
+    paddingRight: null,
+    minHeight: "musaex-1p0x9m9",
+    minWidth: "musaex-qt0gpg",
+    $$css: true
+  },
+  large: {
+    paddingBlock: "musaex-qhkzqn",
+    paddingTop: null,
+    paddingBottom: null,
+    paddingInline: "musaex-1mavw9y",
+    paddingStart: null,
+    paddingLeft: null,
+    paddingEnd: null,
+    paddingRight: null,
+    minHeight: "musaex-1fdzm4i",
+    minWidth: "musaex-sffz45",
+    $$css: true
+  },
+  circular: {
+    borderRadius: "musaex-z7qqyb",
+    borderStartStartRadius: null,
+    borderStartEndRadius: null,
+    borderEndStartRadius: null,
+    borderEndEndRadius: null,
+    borderTopLeftRadius: null,
+    borderTopRightRadius: null,
+    borderBottomLeftRadius: null,
+    borderBottomRightRadius: null,
+    padding: null,
+    paddingInline: null,
+    paddingStart: null,
+    paddingLeft: null,
+    paddingEnd: null,
+    paddingRight: null,
+    paddingBlock: null,
+    paddingTop: null,
+    paddingBottom: null,
+    aspectRatio: "musaex-1plog1",
+    justifyContent: "musaex-l56j7k",
+    $$css: true
+  },
+  rounded: {
+    borderRadius: "musaex-z7qqyb",
+    borderStartStartRadius: null,
+    borderStartEndRadius: null,
+    borderEndStartRadius: null,
+    borderEndEndRadius: null,
+    borderTopLeftRadius: null,
+    borderTopRightRadius: null,
+    borderBottomLeftRadius: null,
+    borderBottomRightRadius: null,
+    minWidth: null,
+    $$css: true
+  },
+  filled: function filled(props) {
+    return [{
+      border: "musaex-1gs6z28",
+      borderWidth: null,
+      borderInlineWidth: null,
+      borderInlineStartWidth: null,
+      borderLeftWidth: null,
+      borderInlineEndWidth: null,
+      borderRightWidth: null,
+      borderBlockWidth: null,
+      borderTopWidth: null,
+      borderBottomWidth: null,
+      borderStyle: null,
+      borderInlineStyle: null,
+      borderInlineStartStyle: null,
+      borderLeftStyle: null,
+      borderInlineEndStyle: null,
+      borderRightStyle: null,
+      borderBlockStyle: null,
+      borderTopStyle: null,
+      borderBottomStyle: null,
+      borderColor: null,
+      borderInlineColor: null,
+      borderInlineStartColor: null,
+      borderLeftColor: null,
+      borderInlineEndColor: null,
+      borderRightColor: null,
+      borderBlockColor: null,
+      borderTopColor: null,
+      borderBottomColor: null,
+      backgroundColor: "musaex-q1mx2j",
+      color: "musaex-19dipnz",
+      boxShadow: "musaex-1nadr2t",
+      $$css: true
+    }, {
+      "--backgroundColor": props.backgroundColor != null ? props.backgroundColor : "initial",
+      "--color": props.color != null ? props.color : "initial"
+    }];
+  },
+  outlined: function outlined(props) {
+    return [{
+      borderWidth: "musaex-bupo1m",
+      borderInlineWidth: null,
+      borderInlineStartWidth: null,
+      borderLeftWidth: null,
+      borderInlineEndWidth: null,
+      borderRightWidth: null,
+      borderBlockWidth: null,
+      borderTopWidth: null,
+      borderBottomWidth: null,
+      borderStyle: "musaex-1y0btm7",
+      borderInlineStyle: null,
+      borderInlineStartStyle: null,
+      borderLeftStyle: null,
+      borderInlineEndStyle: null,
+      borderRightStyle: null,
+      borderBlockStyle: null,
+      borderTopStyle: null,
+      borderBottomStyle: null,
+      borderColor: "musaex-eqt46j",
+      borderInlineColor: null,
+      borderInlineStartColor: null,
+      borderLeftColor: null,
+      borderInlineEndColor: null,
+      borderRightColor: null,
+      borderBlockColor: null,
+      borderTopColor: null,
+      borderBottomColor: null,
+      color: "musaex-19dipnz",
+      backgroundColor: "musaex-rl4t6d",
+      $$css: true
+    }, {
+      "--borderColor": props.color != null ? props.color : "initial",
+      "--color": props.color != null ? props.color : "initial",
+      "--1e2mv7m": props.hoveredBackgroundColor != null ? props.hoveredBackgroundColor : "initial"
+    }];
+  },
+  text: function text(props) {
+    return [{
+      color: "musaex-19dipnz",
+      backgroundColor: "musaex-rl4t6d",
+      $$css: true
+    }, {
+      "--color": props.color != null ? props.color : "initial",
+      "--1e2mv7m": props.hoveredBackgroundColor != null ? props.hoveredBackgroundColor : "initial"
+    }];
+  },
+  disabled: function disabled(props) {
+    return [{
+      backgroundColor: "musaex-q1mx2j",
+      color: "musaex-19dipnz",
+      cursor: "musaex-1h6gzvc",
+      boxShadow: null,
+      borderColor: "musaex-eqt46j",
+      borderInlineColor: null,
+      borderInlineStartColor: null,
+      borderLeftColor: null,
+      borderInlineEndColor: null,
+      borderRightColor: null,
+      borderBlockColor: null,
+      borderTopColor: null,
+      borderBottomColor: null,
+      $$css: true
+    }, {
+      "--backgroundColor": props.backgroundColor != null ? props.backgroundColor : "initial",
+      "--color": props.color != null ? props.color : "initial",
+      "--borderColor": props.outlineColor != null ? props.outlineColor : "initial"
+    }];
+  }
+};
+/**
+ * @author murukal
+ *
+ * @description
+ * button
+ * 1. diff from normal html button, this button is default type `button`, not `submit`
+ */
+var Button = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+    className$1 = _ref.className,
+    style = _ref.style,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? "primary" : _ref$color,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? "medium" : _ref$size,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? "filled" : _ref$variant,
+    _ref$shape = _ref.shape,
+    shape = _ref$shape === void 0 ? "rounded" : _ref$shape,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    _ref$ripple = _ref.ripple,
+    ripple$1 = _ref$ripple === void 0 ? true : _ref$ripple,
+    _ref$type = _ref.type,
+    type = _ref$type === void 0 ? "button" : _ref$type,
+    _onClick = _ref.onClick,
+    prefix = _ref.prefix,
+    suffix = _ref.suffix,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var classNames = useClassNames.useClassNames(componentToken.ComponentToken.Button);
+  var theme$1 = hooks.useTheme();
+  var _useButton = hooks$1.useButton({
+      onClick: _onClick
+    }),
+    onClick = _useButton.onClick,
+    clear = _useButton.clear,
+    ripples = _useButton.ripples;
+  var styled = {
+    button: stylex.default.props(styles.button, theme.typography.label[size],
+    // size
+    styles[size],
+    // variant
+    variant === "filled" && styles.filled({
+      backgroundColor: theme$1.colors[color],
+      color: theme$1.colors["on-".concat(color)]
+    }), variant === "outlined" && styles.outlined({
+      color: theme$1.colors[color],
+      hoveredBackgroundColor: layer.layer(theme$1.colors[colors.ColorToken.Primary], "thin")
+    }), variant === "text" && styles.text({
+      color: theme$1.colors[color],
+      hoveredBackgroundColor: layer.layer(theme$1.colors[colors.ColorToken.Primary], "thin")
+    }),
+    // shape
+    styles[shape],
+    // disabled
+    disabled && styles.disabled({
+      backgroundColor: variant === "filled" ? layer.layer(theme$1.colors[colors.ColorToken.OnSurface], "medium") : "transparent",
+      color: layer.layer(theme$1.colors[colors.ColorToken.OnSurface], "thicker"),
+      outlineColor: variant === "outlined" ? layer.layer(theme$1.colors[colors.ColorToken.OnSurface], "thicker") : null
+    }))
+  };
+  return /*#__PURE__*/React.createElement("button", _objectSpread({
+    onClick: onClick,
+    ref: ref,
+    disabled: disabled,
+    className: relax.clsx(classNames[className.ButtonClassToken.Button], className$1, styled.button.className),
+    style: _objectSpread(_objectSpread({}, styled.button.style), style),
+    type: type
+  }, props), prefix, children, suffix, ripple$1 && /*#__PURE__*/React.createElement(ripple.default, {
+    ripples: ripples,
+    onClear: clear
+  }));
+});
+
+exports.Button = Button;
+exports.default = Button;

package/dist/components/button/{button.js → button.mjs}

@@ -1,17 +1,17 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import React, { forwardRef } from 'react';
-import { ButtonClassToken } from '../../utils/class-name.js';
+import { ButtonClassToken } from '../../utils/class-name.mjs';
 import { clsx } from '@aiszlab/relax';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.7.5/node_modules/@stylexjs/stylex/lib/es/stylex.js';
-import { useTheme } from '../theme/hooks.js';
-import { useButton } from './hooks.js';
-import Ripple from '../ripple/ripple.js';
-import { typography } from '../theme/theme.js';
-import { ColorToken } from '../../utils/colors.js';
-import { layer } from '../../utils/layer.js';
-import { useClassNames } from '../../hooks/use-class-names.js';
-import { ComponentToken } from '../../utils/component-token.js';
+import _stylex from '../../node_modules/.pnpm/@stylexjs_stylex@0.7.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { useTheme } from '../theme/hooks.mjs';
+import { useButton } from './hooks.mjs';
+import Ripple from '../ripple/ripple.mjs';
+import { typography } from '../theme/theme.mjs';
+import { ColorToken } from '../../utils/colors.mjs';
+import { layer } from '../../utils/layer.mjs';
+import { useClassNames } from '../../hooks/use-class-names.mjs';
+import { ComponentToken } from '../../utils/component-token.mjs';
 
 var _excluded = ["children", "className", "style", "color", "size", "variant", "shape", "disabled", "ripple", "type", "onClick", "prefix", "suffix"];
 var styles = {
@@ -22,6 +22,7 @@ var styles = {
     overflowY: null,
     display: "musaex-3nfvp2",
     alignItems: "musaex-6s0dn4",
+    justifyContent: "musaex-l56j7k",
     gap: "musaex-1lsrmdg",
     rowGap: null,
     columnGap: null,
@@ -245,7 +246,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
     _onClick = _ref.onClick,
     prefix = _ref.prefix,
     suffix = _ref.suffix,
-    props$1 = _objectWithoutProperties(_ref, _excluded);
+    props = _objectWithoutProperties(_ref, _excluded);
   var classNames = useClassNames(ComponentToken.Button);
   var theme = useTheme();
   var _useButton = useButton({
@@ -255,7 +256,7 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
     clear = _useButton.clear,
     ripples = _useButton.ripples;
   var styled = {
-    button: props(styles.button, typography.label[size],
+    button: _stylex.props(styles.button, typography.label[size],
     // size
     styles[size],
     // variant
@@ -285,11 +286,10 @@ var Button = /*#__PURE__*/forwardRef(function (_ref, ref) {
     className: clsx(classNames[ButtonClassToken.Button], className, styled.button.className),
     style: _objectSpread(_objectSpread({}, styled.button.style), style),
     type: type
-  }, props$1), prefix, children, suffix, ripple && /*#__PURE__*/React.createElement(Ripple, {
+  }, props), prefix, children, suffix, ripple && /*#__PURE__*/React.createElement(Ripple, {
     ripples: ripples,
     onClear: clear
   }));
 });
-var Button$1 = Button;
 
-export { Button, Button$1 as default };
+export { Button, Button as default };

package/dist/components/button/hooks.cjs

@@ -0,0 +1,24 @@
+var React = require('react');
+var relax = require('@aiszlab/relax');
+var hooks = require('../ripple/hooks.cjs');
+
+/**
+ * @description
+ * hooks for button component
+ */
+var useButton = function useButton(props) {
+  var _useRipple = hooks.useRipple(),
+    ripples = _useRipple.ripples,
+    add = _useRipple.add,
+    clear = _useRipple.clear;
+  var ripple = React.useCallback(function (e) {
+    add(e);
+  }, [add]);
+  return {
+    ripples: ripples,
+    onClick: relax.chain(props.onClick, ripple),
+    clear: clear
+  };
+};
+
+exports.useButton = useButton;

package/dist/components/button/{hooks.js → hooks.mjs}

@@ -1,6 +1,6 @@
 import { useCallback } from 'react';
 import { chain } from '@aiszlab/relax';
-import { useRipple } from '../ripple/hooks.js';
+import { useRipple } from '../ripple/hooks.mjs';
 
 /**
  * @description

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

@@ -1,5 +1,5 @@
 import type { ButtonHTMLAttributes, MouseEventHandler, ReactNode } from "react";
-import type { ComponentProps } from "../../types/element";
+import type { ComponentProps } from "musae/types/element";
 export type Variant = "filled" | "outlined" | "text";
 export type Color = "primary" | "secondary" | "tertiary";
 type Size = "small" | "medium" | "large";

package/dist/components/calendar/calendar.cjs

@@ -0,0 +1,109 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+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 className = require('../../utils/class-name.cjs');
+var stylex = require('../../node_modules/.pnpm/@stylexjs_stylex@0.7.5/node_modules/@stylexjs/stylex/lib/es/stylex.cjs');
+var theme = require('../theme/theme.cjs');
+var relax = require('@aiszlab/relax');
+var button = require('../button/button.cjs');
+var hooks$1 = require('../theme/hooks.cjs');
+var colors = require('../../utils/colors.cjs');
+var componentToken = require('../../utils/component-token.cjs');
+var keyboardDoubleArrowLeft = require('../icon/icons/hardware/keyboard-double-arrow-left.cjs');
+var keyboardDoubleArrowRight = require('../icon/icons/hardware/keyboard-double-arrow-right.cjs');
+var keyboardArrowLeft = require('../icon/icons/hardware/keyboard-arrow-left.cjs');
+var keyboardArrowRight = require('../icon/icons/hardware/keyboard-arrow-right.cjs');
+
+var styles = {
+  header: function header(props) {
+    return [{
+      display: "musaex-78zum5",
+      alignItems: "musaex-6s0dn4",
+      columnGap: "musaex-21kgnr",
+      paddingInline: "musaex-1dhq86w",
+      paddingStart: null,
+      paddingLeft: null,
+      paddingEnd: null,
+      paddingRight: null,
+      color: "musaex-19dipnz",
+      $$css: true
+    }, {
+      "--color": props.color != null ? props.color : "initial"
+    }];
+  }
+};
+var Calendar = function Calendar(_ref) {
+  var className$1 = _ref.className,
+    style = _ref.style,
+    value = _ref.value,
+    _onClick = _ref.onClick,
+    _focusedAt = _ref.focusedAt;
+  var _useValue = hooks.useValue({
+      onClick: _onClick,
+      value: value
+    }),
+    timespan = _useValue.timespan,
+    onClick = _useValue.onClick;
+  var _useFocusedAt = hooks.useFocusedAt({
+      focusedAt: _focusedAt
+    }),
+    focusedAt = _useFocusedAt.focusedAt,
+    toPrevYear = _useFocusedAt.toPrevYear,
+    toPrevMonth = _useFocusedAt.toPrevMonth,
+    toNextYear = _useFocusedAt.toNextYear,
+    toNextMonth = _useFocusedAt.toNextMonth;
+  var dateCells = hooks.useDateCells({
+    timespan: timespan,
+    focusedAt: focusedAt,
+    click: onClick
+  });
+  var headCells = hooks.useHeadCells();
+  var classNames = useClassNames.useClassNames(componentToken.ComponentToken.Calendar);
+  var theme$1 = hooks$1.useTheme();
+  var styled = {
+    calendar: {
+      className: "musaex-eq5yr9"
+    },
+    header: stylex.default.props(theme.typography.label.large, styles.header({
+      color: theme$1.colors[colors.ColorToken.OnSurfaceVariant]
+    })),
+    heading: {
+      className: "musaex-98rzlu musaex-78zum5 musaex-l56j7k"
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: relax.clsx(styled.calendar.className, className$1),
+    style: _objectSpread(_objectSpread({}, styled.calendar.style), style)
+  }, /*#__PURE__*/React.createElement("header", {
+    className: relax.clsx(classNames[className.CalendarClassToken.Header], styled.header.className),
+    style: styled.header.style
+  }, /*#__PURE__*/React.createElement(button.Button, {
+    variant: "text",
+    prefix: /*#__PURE__*/React.createElement(keyboardDoubleArrowLeft.default, null),
+    onClick: toPrevYear,
+    shape: "circular"
+  }), /*#__PURE__*/React.createElement(button.Button, {
+    variant: "text",
+    prefix: /*#__PURE__*/React.createElement(keyboardArrowLeft.default, null),
+    onClick: toPrevMonth,
+    shape: "circular"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: relax.clsx(classNames[className.CalendarClassToken.Heading], styled.heading.className),
+    style: styled.heading.style
+  }, focusedAt.format("YYYY-MM")), /*#__PURE__*/React.createElement(button.Button, {
+    variant: "text",
+    prefix: /*#__PURE__*/React.createElement(keyboardArrowRight.default, null),
+    onClick: toNextMonth,
+    shape: "circular"
+  }), /*#__PURE__*/React.createElement(button.Button, {
+    variant: "text",
+    prefix: /*#__PURE__*/React.createElement(keyboardDoubleArrowRight.default, null),
+    onClick: toNextYear,
+    shape: "circular"
+  })), /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, headCells)), /*#__PURE__*/React.createElement("tbody", null, dateCells)));
+};
+
+exports.default = Calendar;

package/dist/components/calendar/{calendar.js → calendar.mjs}

@@ -1,19 +1,19 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import React from 'react';
-import { useValue, useFocusedAt, useDateCells, useHeadCells } from './hooks.js';
-import { useClassNames } from '../../hooks/use-class-names.js';
-import { CalendarClassToken } from '../../utils/class-name.js';
-import { props } from '../../node_modules/.pnpm/@stylexjs_stylex@0.7.5/node_modules/@stylexjs/stylex/lib/es/stylex.js';
-import { typography } from '../theme/theme.js';
+import { useValue, useFocusedAt, useDateCells, useHeadCells } from './hooks.mjs';
+import { useClassNames } from '../../hooks/use-class-names.mjs';
+import { CalendarClassToken } from '../../utils/class-name.mjs';
+import _stylex from '../../node_modules/.pnpm/@stylexjs_stylex@0.7.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { typography } from '../theme/theme.mjs';
 import { clsx } from '@aiszlab/relax';
-import Button from '../button/button.js';
-import { useTheme } from '../theme/hooks.js';
-import { ColorToken } from '../../utils/colors.js';
-import { ComponentToken } from '../../utils/component-token.js';
-import KeyboardDoubleArrowLeft from '../icon/icons/hardware/keyboard-double-arrow-left.js';
-import KeyboardDoubleArrowRight from '../icon/icons/hardware/keyboard-double-arrow-right.js';
-import KeyboardArrowLeft from '../icon/icons/hardware/keyboard-arrow-left.js';
-import KeyboardArrowRight from '../icon/icons/hardware/keyboard-arrow-right.js';
+import { Button } from '../button/button.mjs';
+import { useTheme } from '../theme/hooks.mjs';
+import { ColorToken } from '../../utils/colors.mjs';
+import { ComponentToken } from '../../utils/component-token.mjs';
+import KeyboardDoubleArrowLeft from '../icon/icons/hardware/keyboard-double-arrow-left.mjs';
+import KeyboardDoubleArrowRight from '../icon/icons/hardware/keyboard-double-arrow-right.mjs';
+import KeyboardArrowLeft from '../icon/icons/hardware/keyboard-arrow-left.mjs';
+import KeyboardArrowRight from '../icon/icons/hardware/keyboard-arrow-right.mjs';
 
 var styles = {
   header: function header(props) {
@@ -65,7 +65,7 @@ var Calendar = function Calendar(_ref) {
     calendar: {
       className: "musaex-eq5yr9"
     },
-    header: props(typography.label.large, styles.header({
+    header: _stylex.props(typography.label.large, styles.header({
       color: theme.colors[ColorToken.OnSurfaceVariant]
     })),
     heading: {
@@ -103,6 +103,5 @@ var Calendar = function Calendar(_ref) {
     shape: "circular"
   })), /*#__PURE__*/React.createElement("table", null, /*#__PURE__*/React.createElement("thead", null, /*#__PURE__*/React.createElement("tr", null, headCells)), /*#__PURE__*/React.createElement("tbody", null, dateCells)));
 };
-var Calendar$1 = Calendar;
 
-export { Calendar$1 as default };
+export { Calendar as default };