musae 0.3.3 → 0.3.6

package/dist/components/upload/uploadeds.mjs

@@ -1,70 +1,130 @@
+import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _regeneratorRuntime from '@babel/runtime/helpers/regeneratorRuntime';
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import React, { forwardRef, useState, useRef, useImperativeHandle } from 'react';
-import { useEvent } from '@aiszlab/relax';
+import React, { forwardRef, useMemo, useImperativeHandle } from 'react';
+import _stylex from '../../node_modules/.pnpm/@stylexjs_stylex@0.7.5/node_modules/@stylexjs/stylex/lib/es/stylex.mjs';
+import { useControlledState, useIdentity, useEvent } from '@aiszlab/relax';
+import { typography } from '../theme/theme.mjs';
+import { isControlled } from './utils.mjs';
+import { leaf } from '@aiszlab/fuzzy/path';
 import Loading from '../icon/icons/mock/loading.mjs';
-import Redo from '../icon/icons/content/clear.mjs';
+import AttachFile from '../icon/icons/editor/attch-file.mjs';
+import Delete from '../icon/icons/action/delete.mjs';
 
+var _excluded = ["key"];
+var styles = {
+  item: {
+    display: "musaex-78zum5",
+    alignItems: "musaex-6s0dn4",
+    gap: "musaex-1lsrmdg",
+    $$css: true
+  }
+};
 var Uploadeds = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var uploader = _ref.uploader,
-    onError = _ref.onError;
-  var _useState = useState(new Map()),
-    _useState2 = _slicedToArray(_useState, 2),
-    items = _useState2[0],
-    setItems = _useState2[1];
-  var _counter = useRef(0);
-  var loaded = useEvent(function (id, status) {
-    // update uploaded list status
-    setItems(function (_items) {
-      var current = _items.get(id);
-      if (!current) return _items;
-      return new Map(_items).set(id, _objectSpread(_objectSpread({}, current), {}, {
-        status: status
-      }));
-    });
+    onError = _ref.onError,
+    value = _ref.value,
+    onChange = _ref.onChange,
+    _ref$limit = _ref.limit,
+    limit = _ref$limit === void 0 ? Infinity : _ref$limit;
+  var _useControlledState = useControlledState(value, {
+      defaultState: []
+    }),
+    _useControlledState2 = _slicedToArray(_useControlledState, 2),
+    values = _useControlledState2[0],
+    setValues = _useControlledState2[1];
+  var _useIdentity = useIdentity(),
+    _useIdentity2 = _slicedToArray(_useIdentity, 2),
+    identity = _useIdentity2[1];
+  // convert to map, for performance
+  var items = useMemo(function () {
+    return values.reduce(function (prev, _item) {
+      var _isControlled = isControlled(_item);
+      if (_isControlled) {
+        var _item$key;
+        var _id = (_item$key = _item.key) !== null && _item$key !== void 0 ? _item$key : _item.url;
+        prev.set(_id, {
+          key: _id,
+          status: "success",
+          url: _item.url
+        });
+        return prev;
+      }
+      prev.set(_item.key, _item);
+      return prev;
+    }, new Map());
+  }, [values]);
+  // when loading status changed
+  // use this func to set new status & callback
+  var onLoaded = useEvent(function (id, status, _ref2) {
+    var url = _ref2.url,
+      error = _ref2.error;
+    if (!items.has(id)) return;
+    var _items = new Map(items);
+    var _values = Array.from(_items.set(id, _objectSpread(_objectSpread({}, _items.get(id)), {}, {
+      status: status,
+      url: url,
+      error: error
+    })).values());
+    setValues(_values);
+    // change handler
+    onChange === null || onChange === void 0 || onChange(_values);
   });
   useImperativeHandle(ref, function () {
     return {
       add: function () {
         var _add = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(file) {
-          var hasUploader, status, id, url;
+          var _hasUploader, _isOnlyOne, _isOverLimit, _key, _values, _url;
           return _regeneratorRuntime().wrap(function _callee$(_context) {
             while (1) switch (_context.prev = _context.next) {
               case 0:
-                hasUploader = !!uploader;
-                status = hasUploader ? "loading" : "success"; // push current file
-                id = _counter.current++;
-                setItems(function (items) {
-                  return new Map(items).set(id, {
-                    file: file,
-                    status: status
-                  });
-                });
-                // call request by user provided
-                if (hasUploader) {
-                  _context.next = 6;
+                _hasUploader = !!uploader;
+                _isOnlyOne = limit === 1;
+                _isOverLimit = items.size >= limit; // over `limit`
+                if (!(_isOverLimit && !_isOnlyOne)) {
+                  _context.next = 5;
                   break;
                 }
                 return _context.abrupt("return");
-              case 6:
-                _context.next = 8;
-                return uploader(file)["catch"](function (error) {
-                  loaded(id, "error");
-                  onError === null || onError === void 0 || onError(error);
-                  return null;
-                });
-              case 8:
-                url = _context.sent;
-                if (url) {
+              case 5:
+                // show loading in `add` trigger
+                _key = identity();
+                _values = Array.from(new Map(_isOnlyOne ? [] : items).set(_key, {
+                  key: _key,
+                  file: file,
+                  status: _hasUploader ? "loading" : "success"
+                }).values());
+                setValues(_values);
+                onChange === null || onChange === void 0 || onChange(_values);
+                // when no uploader, use original file
+                if (_hasUploader) {
                   _context.next = 11;
                   break;
                 }
                 return _context.abrupt("return");
               case 11:
-                loaded(id, "success");
-              case 12:
+                _context.next = 13;
+                return uploader(file)["catch"](function (error) {
+                  return new Error(error.message);
+                });
+              case 13:
+                _url = _context.sent;
+                if (!(_url instanceof Error)) {
+                  _context.next = 18;
+                  break;
+                }
+                onLoaded(_key, "error", {
+                  error: _url
+                });
+                onError === null || onError === void 0 || onError(_url);
+                return _context.abrupt("return");
+              case 18:
+                onLoaded(_key, "success", {
+                  url: _url
+                });
+              case 19:
               case "end":
                 return _context.stop();
             }
@@ -77,33 +137,37 @@ var Uploadeds = /*#__PURE__*/forwardRef(function (_ref, ref) {
       }()
     };
   });
-  var remove = useEvent(function (id) {
-    setItems(function (_items) {
-      var next = new Map(_items);
-      next["delete"](id);
-      return next;
-    });
+  var remove = useEvent(function (key) {
+    var _items = new Map(items);
+    _items["delete"](key);
+    var _values = Array.from(_items.values());
+    setValues(_values);
+    onChange === null || onChange === void 0 || onChange(_values);
   });
   var styled = {
     uploadeds: {
-      className: "musaex-78zum5 musaex-dt5ytf musaex-4ttznp"
+      className: "musaex-78zum5 musaex-dt5ytf musaex-1lsrmdg"
     },
-    item: {
-      className: "musaex-78zum5 musaex-6s0dn4 musaex-1lsrmdg"
+    item: _stylex.props(styles.item, typography.body.small),
+    filename: {
+      className: "musaex-98rzlu musaex-b3r6kr musaex-lyipyv"
     }
   };
   return /*#__PURE__*/React.createElement("div", {
     className: styled.uploadeds.className,
     style: styled.uploadeds.style
-  }, Array.from(items.entries()).map(function (_ref2) {
-    var _ref3 = _slicedToArray(_ref2, 2),
-      key = _ref3[0],
-      item = _ref3[1];
+  }, Array.from(items.values()).map(function (_ref3) {
+    var _item$file$name, _item$file, _item$url;
+    var key = _ref3.key,
+      item = _objectWithoutProperties(_ref3, _excluded);
     return /*#__PURE__*/React.createElement("div", {
       key: key,
       className: styled.item.className,
       style: styled.item.style
-    }, /*#__PURE__*/React.createElement(Loading, null), item.file.name, /*#__PURE__*/React.createElement(Redo, {
+    }, item.status === "loading" && /*#__PURE__*/React.createElement(Loading, null), item.status !== "loading" && /*#__PURE__*/React.createElement(AttachFile, null), /*#__PURE__*/React.createElement("span", {
+      className: styled.filename.className,
+      style: styled.filename.style
+    }, (_item$file$name = (_item$file = item.file) === null || _item$file === void 0 ? void 0 : _item$file.name) !== null && _item$file$name !== void 0 ? _item$file$name : leaf((_item$url = item.url) !== null && _item$url !== void 0 ? _item$url : "")), /*#__PURE__*/React.createElement(Delete, {
       onClick: function onClick() {
         return remove(key);
       }

package/dist/components/upload/utils.cjs

@@ -0,0 +1,9 @@
+/**
+ * @description
+ * check current value is provided by user
+ */
+var isControlled = function isControlled(value) {
+  return !value.key || !value.file;
+};
+
+exports.isControlled = isControlled;

package/dist/components/upload/utils.d.ts

@@ -0,0 +1,6 @@
+import type { Value, ControlledValue } from "musae/types/upload";
+/**
+ * @description
+ * check current value is provided by user
+ */
+export declare const isControlled: (value: Value) => value is ControlledValue;

package/dist/components/upload/utils.mjs

@@ -0,0 +1,9 @@
+/**
+ * @description
+ * check current value is provided by user
+ */
+var isControlled = function isControlled(value) {
+  return !value.key || !value.file;
+};
+
+export { isControlled };

package/dist/components/visually-hidden/visually-hidden.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import type { VisuallyHiddenProps } from "./types";
+import type { VisuallyHiddenProps } from "musae/types/visually-hidden";
 declare const VisuallyHidden: ({ children }: VisuallyHiddenProps) => React.JSX.Element;
 export default VisuallyHidden;

package/dist/components/waterfall/sequential.d.ts

@@ -1,4 +1,4 @@
-import type { WaterfallProps } from "./types";
+import type { WaterfallProps } from "musae/types/waterfall";
 import React from "react";
 import type { RequiredIn } from "@aiszlab/relax/types";
 declare const Sequential: ({ children, columns, className, style, rowGap, }: RequiredIn<Omit<WaterfallProps, "sequential" | "gutter">, "children" | "columns"> & {

package/dist/components/waterfall/waterfall.d.ts

@@ -1,4 +1,4 @@
-import type { WaterfallProps } from "./types";
+import type { WaterfallProps } from "musae/types/waterfall";
 import React from "react";
 declare const Waterfall: ({ columns, gutter, children, sequential, className, style, }: WaterfallProps) => React.JSX.Element | null;
 export default Waterfall;

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

@@ -1,4 +1,4 @@
-import { WatermarkProps } from "./types";
+import type { WatermarkProps } from "musae/types/watermark";
 /**
  * @description
  * watermarks

package/dist/components/watermark/watermark.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
-import { WatermarkProps } from "./types";
+import type { WatermarkProps } from "musae/types/watermark";
 declare const Watermark: ({ children, mark: _mark, width, height, font: { color, fontSize, fontFamily, fontStyle, fontWeight, textAlign, }, }: WatermarkProps) => React.JSX.Element;
 export default Watermark;

package/dist/hooks/use-class-names.d.ts

@@ -266,4 +266,8 @@ export declare const useClassNames: <T extends ComponentToken = ComponentToken>(
         0: string;
         1: string;
     };
+    48: {};
+    49: {
+        0: string;
+    };
 }[T];

package/dist/hooks/use-closable.cjs

@@ -1,4 +1,3 @@
-var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
 var relax = require('@aiszlab/relax');
 var React = require('react');
 var button = require('../components/button/button.cjs');
@@ -26,18 +25,11 @@ var useClosable = function useClosable(_ref) {
   // closer react element for dialog
   var closer = React.useMemo(function () {
     if (!triggers.has("close")) return null;
-    var styled = {
-      className: "musaex-167ikqz musaex-134unf5"
-    };
     return /*#__PURE__*/React.createElement(button.Button, {
       shape: "circular",
       variant: "text",
       prefix: /*#__PURE__*/React.createElement(close.default, null),
       onClick: onClose,
-      className: styled.className,
-      style: _objectSpread(_objectSpread({}, styled.style), {}, {
-        position: "absolute"
-      }),
       size: "small"
     });
   }, [triggers, onClose]);

package/dist/hooks/use-closable.mjs

@@ -1,4 +1,3 @@
-import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import { isUndefined, useEvent } from '@aiszlab/relax';
 import React, { useMemo } from 'react';
 import { Button } from '../components/button/button.mjs';
@@ -26,18 +25,11 @@ var useClosable = function useClosable(_ref) {
   // closer react element for dialog
   var closer = useMemo(function () {
     if (!triggers.has("close")) return null;
-    var styled = {
-      className: "musaex-167ikqz musaex-134unf5"
-    };
     return /*#__PURE__*/React.createElement(Button, {
       shape: "circular",
       variant: "text",
       prefix: /*#__PURE__*/React.createElement(Close, null),
       onClick: onClose,
-      className: styled.className,
-      style: _objectSpread(_objectSpread({}, styled.style), {}, {
-        position: "absolute"
-      }),
       size: "small"
     });
   }, [triggers, onClose]);

package/dist/hooks/use-container.d.ts

@@ -1,4 +1,4 @@
-import type { PortalProps } from "../types/portal";
+import type { PortalProps } from "musae/types/portal";
 /**
  * @description
  * container

package/dist/hooks/use-lazy-boolean.cjs

@@ -5,7 +5,7 @@ var React = require('react');
 var useLazyBoolean = function useLazyBoolean() {
   var _useBoolean = relax.useBoolean(),
     _useBoolean2 = _slicedToArray(_useBoolean, 2),
-    isTrue = _useBoolean2[0],
+    isTruthy = _useBoolean2[0],
     _useBoolean2$ = _useBoolean2[1],
     _turnOn = _useBoolean2$.turnOn,
     _turnOff = _useBoolean2$.turnOff,
@@ -52,7 +52,7 @@ var useLazyBoolean = function useLazyBoolean() {
     });
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  return [isTrue, {
+  return [isTruthy, {
     turnOn: turnOn,
     turnOff: turnOff,
     toggle: toggle,

package/dist/hooks/use-lazy-boolean.mjs

@@ -5,7 +5,7 @@ import { useCallback } from 'react';
 var useLazyBoolean = function useLazyBoolean() {
   var _useBoolean = useBoolean(),
     _useBoolean2 = _slicedToArray(_useBoolean, 2),
-    isTrue = _useBoolean2[0],
+    isTruthy = _useBoolean2[0],
     _useBoolean2$ = _useBoolean2[1],
     _turnOn = _useBoolean2$.turnOn,
     _turnOff = _useBoolean2$.turnOff,
@@ -52,7 +52,7 @@ var useLazyBoolean = function useLazyBoolean() {
     });
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  return [isTrue, {
+  return [isTruthy, {
     turnOn: turnOn,
     turnOff: turnOff,
     toggle: toggle,

package/dist/index.cjs

@@ -24,6 +24,7 @@ var drawer = require('./components/drawer/drawer.cjs');
 var dialog = require('./components/dialog/dialog.cjs');
 var tag = require('./components/tag/tag.cjs');
 var calendar = require('./components/calendar/calendar.cjs');
+var contribution = require('./components/calendar/contribution.cjs');
 var datePicker = require('./components/date-picker/date-picker.cjs');
 var timePicker = require('./components/time-picker/time-picker.cjs');
 var dateRangePicker = require('./components/date-range-picker/date-range-picker.cjs');
@@ -90,6 +91,7 @@ exports.Drawer = drawer.default;
 exports.Dialog = dialog.default;
 exports.Tag = tag.default;
 exports.Calendar = calendar.default;
+exports.ContributionCalendar = contribution.default;
 exports.DatePicker = datePicker.default;
 exports.TimePicker = timePicker.default;
 exports.DateRangePicker = dateRangePicker.default;

package/dist/index.d.ts

@@ -23,7 +23,7 @@ export { Empty } from "./components/empty";
 export { Drawer } from "./components/drawer";
 export { Dialog } from "./components/dialog";
 export { Tag } from "./components/tag";
-export { Calendar } from "./components/calendar";
+export { Calendar, ContributionCalendar } from "./components/calendar";
 export { DatePicker } from "./components/date-picker";
 export { TimePicker } from "./components/time-picker";
 export { DateRangePicker } from "./components/date-range-picker";

package/dist/index.mjs

@@ -24,6 +24,7 @@ export { default as Drawer } from './components/drawer/drawer.mjs';
 export { default as Dialog } from './components/dialog/dialog.mjs';
 export { default as Tag } from './components/tag/tag.mjs';
 export { default as Calendar } from './components/calendar/calendar.mjs';
+export { default as ContributionCalendar } from './components/calendar/contribution.mjs';
 export { default as DatePicker } from './components/date-picker/date-picker.mjs';
 export { default as TimePicker } from './components/time-picker/time-picker.mjs';
 export { default as DateRangePicker } from './components/date-range-picker/date-range-picker.mjs';

package/dist/locale/locales/en_US.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var componentToken = require('../../utils/component-token.cjs');
 
-var en_US = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+var en_US = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
   locale: "en_US"
 }, componentToken.ComponentToken.Dialog, {
   confirm: "Confirm",
@@ -29,6 +29,10 @@ var en_US = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_def
 }), componentToken.ComponentToken.I18nButton, {
   zh_CN: "Chinese",
   en_US: "English"
+}), componentToken.ComponentToken.Drawer, {
+  confirm: "Confirm"
+}), componentToken.ComponentToken.Upload, {
+  upload: "Upload"
 });
 
 exports.default = en_US;

package/dist/locale/locales/en_US.mjs

@@ -1,7 +1,7 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import { ComponentToken } from '../../utils/component-token.mjs';
 
-var en_US = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+var en_US = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
   locale: "en_US"
 }, ComponentToken.Dialog, {
   confirm: "Confirm",
@@ -27,6 +27,10 @@ var en_US = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_def
 }), ComponentToken.I18nButton, {
   zh_CN: "Chinese",
   en_US: "English"
+}), ComponentToken.Drawer, {
+  confirm: "Confirm"
+}), ComponentToken.Upload, {
+  upload: "Upload"
 });
 
 export { en_US as default };

package/dist/locale/locales/zh_CN.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var componentToken = require('../../utils/component-token.cjs');
 
-var zh_CN = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+var zh_CN = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
   locale: "zh_CN"
 }, componentToken.ComponentToken.Dialog, {
   confirm: "确认",
@@ -29,6 +29,10 @@ var zh_CN = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_def
 }), componentToken.ComponentToken.I18nButton, {
   zh_CN: "中文",
   en_US: "英文"
+}), componentToken.ComponentToken.Drawer, {
+  confirm: "确认"
+}), componentToken.ComponentToken.Upload, {
+  upload: "上传"
 });
 
 exports.default = zh_CN;

package/dist/locale/locales/zh_CN.mjs

@@ -1,7 +1,7 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import { ComponentToken } from '../../utils/component-token.mjs';
 
-var zh_CN = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+var zh_CN = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
   locale: "zh_CN"
 }, ComponentToken.Dialog, {
   confirm: "确认",
@@ -27,6 +27,10 @@ var zh_CN = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_def
 }), ComponentToken.I18nButton, {
   zh_CN: "中文",
   en_US: "英文"
+}), ComponentToken.Drawer, {
+  confirm: "确认"
+}), ComponentToken.Upload, {
+  upload: "上传"
 });
 
 export { zh_CN as default };