@ioca/react 1.5.17 → 1.5.19

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 (86) hide show
  1. package/lib/cjs/components/editor/editor.js +4 -2
  2. package/lib/cjs/components/editor/editor.js.map +1 -1
  3. package/lib/cjs/components/input/input.js +3 -1
  4. package/lib/cjs/components/input/input.js.map +1 -1
  5. package/lib/cjs/components/input/textarea.js +1 -1
  6. package/lib/cjs/components/input/textarea.js.map +1 -1
  7. package/lib/cjs/components/message/index.js +3 -2
  8. package/lib/cjs/components/message/index.js.map +1 -1
  9. package/lib/cjs/components/message/message.js +93 -50
  10. package/lib/cjs/components/message/message.js.map +1 -1
  11. package/lib/cjs/components/modal/content.js +16 -8
  12. package/lib/cjs/components/modal/content.js.map +1 -1
  13. package/lib/cjs/components/modal/modal.js +60 -19
  14. package/lib/cjs/components/modal/modal.js.map +1 -1
  15. package/lib/cjs/components/modal/modalManager.js +83 -0
  16. package/lib/cjs/components/modal/modalManager.js.map +1 -0
  17. package/lib/cjs/components/picker/daterange/daterange.js +60 -0
  18. package/lib/cjs/components/picker/daterange/daterange.js.map +1 -0
  19. package/lib/cjs/components/picker/daterange/index.js +11 -0
  20. package/lib/cjs/components/picker/daterange/index.js.map +1 -0
  21. package/lib/cjs/components/picker/daterange/panel.js +55 -0
  22. package/lib/cjs/components/picker/daterange/panel.js.map +1 -0
  23. package/lib/cjs/components/picker/dates/dates.js +12 -4
  24. package/lib/cjs/components/picker/dates/dates.js.map +1 -1
  25. package/lib/cjs/components/picker/dates/index.js +6 -2
  26. package/lib/cjs/components/picker/dates/index.js.map +1 -1
  27. package/lib/cjs/components/picker/dates/panel.js +22 -9
  28. package/lib/cjs/components/picker/dates/panel.js.map +1 -1
  29. package/lib/cjs/components/picker/time/index.js +6 -2
  30. package/lib/cjs/components/picker/time/index.js.map +1 -1
  31. package/lib/cjs/components/popconfirm/popconfirm.js +2 -4
  32. package/lib/cjs/components/popconfirm/popconfirm.js.map +1 -1
  33. package/lib/cjs/index.js +10 -8
  34. package/lib/cjs/index.js.map +1 -1
  35. package/lib/cjs/js/hooks.js +5 -2
  36. package/lib/cjs/js/hooks.js.map +1 -1
  37. package/lib/css/colors.css +2 -2
  38. package/lib/css/index.css +1 -1
  39. package/lib/css/index.css.map +1 -1
  40. package/lib/css/input.css +17 -1
  41. package/lib/es/components/editor/editor.js +4 -2
  42. package/lib/es/components/editor/editor.js.map +1 -1
  43. package/lib/es/components/input/input.js +3 -1
  44. package/lib/es/components/input/input.js.map +1 -1
  45. package/lib/es/components/input/textarea.js +1 -1
  46. package/lib/es/components/input/textarea.js.map +1 -1
  47. package/lib/es/components/message/index.js +3 -3
  48. package/lib/es/components/message/index.js.map +1 -1
  49. package/lib/es/components/message/message.js +93 -51
  50. package/lib/es/components/message/message.js.map +1 -1
  51. package/lib/es/components/modal/content.js +18 -10
  52. package/lib/es/components/modal/content.js.map +1 -1
  53. package/lib/es/components/modal/modal.js +61 -20
  54. package/lib/es/components/modal/modal.js.map +1 -1
  55. package/lib/es/components/modal/modalManager.js +76 -0
  56. package/lib/es/components/modal/modalManager.js.map +1 -0
  57. package/lib/es/components/picker/daterange/daterange.js +50 -0
  58. package/lib/es/components/picker/daterange/daterange.js.map +1 -0
  59. package/lib/es/components/picker/daterange/index.js +6 -0
  60. package/lib/es/components/picker/daterange/index.js.map +1 -0
  61. package/lib/es/components/picker/daterange/panel.js +47 -0
  62. package/lib/es/components/picker/daterange/panel.js.map +1 -0
  63. package/lib/es/components/picker/dates/dates.js +12 -4
  64. package/lib/es/components/picker/dates/dates.js.map +1 -1
  65. package/lib/es/components/picker/dates/index.js +6 -2
  66. package/lib/es/components/picker/dates/index.js.map +1 -1
  67. package/lib/es/components/picker/dates/panel.js +22 -9
  68. package/lib/es/components/picker/dates/panel.js.map +1 -1
  69. package/lib/es/components/picker/time/index.js +6 -2
  70. package/lib/es/components/picker/time/index.js.map +1 -1
  71. package/lib/es/components/popconfirm/popconfirm.js +2 -4
  72. package/lib/es/components/popconfirm/popconfirm.js.map +1 -1
  73. package/lib/es/index.js +2 -1
  74. package/lib/es/index.js.map +1 -1
  75. package/lib/es/js/hooks.js +5 -2
  76. package/lib/es/js/hooks.js.map +1 -1
  77. package/lib/index.js +384 -104
  78. package/lib/types/components/input/type.d.ts +1 -0
  79. package/lib/types/components/message/index.d.ts +5 -3
  80. package/lib/types/components/message/message.d.ts +5 -4
  81. package/lib/types/components/message/type.d.ts +25 -12
  82. package/lib/types/components/picker/daterange/daterange.d.ts +6 -0
  83. package/lib/types/components/picker/daterange/index.d.ts +5 -0
  84. package/lib/types/components/picker/type.d.ts +11 -2
  85. package/lib/types/index.d.ts +2 -1
  86. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"textarea.js","sources":["../../../../packages/components/input/textarea.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport {\n ChangeEvent,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n type KeyboardEvent,\n} from \"react\";\nimport \"../../css/input.css\";\nimport InputContainer from \"./container\";\nimport type { ITextarea } from \"./type\";\n\nconst Textarea = (props: ITextarea) => {\n const {\n ref,\n label,\n name,\n value = \"\",\n labelInline,\n className,\n status = \"normal\",\n message,\n tip,\n autoSize,\n border,\n width,\n style,\n resize,\n onChange,\n onEnter,\n ...restProps\n } = props;\n\n const [textareaValue, setTextareaValue] = useState(value);\n const refTextarea = useRef<HTMLTextAreaElement>(null);\n\n const syncTextareaHeight = () => {\n const ta = refTextarea.current;\n if (!autoSize || !ta) return;\n\n ta.style.height = \"auto\";\n ta.style.height = `${ta.scrollHeight}px`;\n };\n\n const handleChange = (\n e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,\n ) => {\n const v = e.target.value;\n\n setTextareaValue(v);\n\n onChange?.(v, e);\n };\n\n const handleKeydown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.code !== \"Enter\") return;\n\n e.stopPropagation();\n onEnter?.(e);\n };\n\n useEffect(() => {\n setTextareaValue(value);\n }, [value]);\n\n useEffect(() => {\n syncTextareaHeight();\n }, [autoSize, textareaValue]);\n\n useImperativeHandle(ref, () => {\n return {\n input: refTextarea.current,\n };\n });\n\n const inputProps = {\n ref: refTextarea,\n name,\n value: textareaValue,\n className: \"i-input i-textarea\",\n style: resize === false ? { resize: \"none\" as const } : undefined,\n onChange: handleChange,\n onKeyDown: handleKeydown,\n ...restProps,\n };\n\n return (\n <InputContainer\n label={label}\n labelInline={labelInline}\n className={className}\n style={{ width, ...style }}\n tip={message ?? tip}\n status={status}\n >\n <div\n className={classNames(\"i-input-item\", {\n [`i-input-${status}`]: status !== \"normal\",\n \"i-input-borderless\": !border,\n })}\n >\n <textarea {...inputProps} />\n </div>\n </InputContainer>\n );\n};\n\nexport default Textarea;\n"],"names":["_jsx"],"mappings":";;;;;AAaA,MAAM,QAAQ,GAAG,CAAC,KAAgB,KAAI;AAClC,IAAA,MAAM,EACF,GAAG,EACH,KAAK,EACL,IAAI,EACJ,KAAK,GAAG,EAAE,EACV,WAAW,EACX,SAAS,EACT,MAAM,GAAG,QAAQ,EACjB,OAAO,EACP,GAAG,EACH,QAAQ,EACR,MAAM,EACN,KAAK,EACL,KAAK,EACL,MAAM,EACN,QAAQ,EACR,OAAO,EACP,GAAG,SAAS,EACf,GAAG,KAAK;IAET,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AACzD,IAAA,MAAM,WAAW,GAAG,MAAM,CAAsB,IAAI,CAAC;IAErD,MAAM,kBAAkB,GAAG,MAAK;AAC5B,QAAA,MAAM,EAAE,GAAG,WAAW,CAAC,OAAO;AAC9B,QAAA,IAAI,CAAC,QAAQ,IAAI,CAAC,EAAE;YAAE;AAEtB,QAAA,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM;QACxB,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,EAAE,CAAC,YAAY,CAAA,EAAA,CAAI;AAC5C,IAAA,CAAC;AAED,IAAA,MAAM,YAAY,GAAG,CACjB,CAAsD,KACtD;AACA,QAAA,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK;QAExB,gBAAgB,CAAC,CAAC,CAAC;AAEnB,QAAA,QAAQ,GAAG,CAAC,EAAE,CAAC,CAAC;AACpB,IAAA,CAAC;AAED,IAAA,MAAM,aAAa,GAAG,CAAC,CAAqC,KAAI;AAC5D,QAAA,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO;YAAE;QAExB,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,OAAO,GAAG,CAAC,CAAC;AAChB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACX,gBAAgB,CAAC,KAAK,CAAC;AAC3B,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAEX,SAAS,CAAC,MAAK;AACX,QAAA,kBAAkB,EAAE;AACxB,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;AAE7B,IAAA,mBAAmB,CAAC,GAAG,EAAE,MAAK;QAC1B,OAAO;YACH,KAAK,EAAE,WAAW,CAAC,OAAO;SAC7B;AACL,IAAA,CAAC,CAAC;AAEF,IAAA,MAAM,UAAU,GAAG;AACf,QAAA,GAAG,EAAE,WAAW;QAChB,IAAI;AACJ,QAAA,KAAK,EAAE,aAAa;AACpB,QAAA,SAAS,EAAE,oBAAoB;AAC/B,QAAA,KAAK,EAAE,MAAM,KAAK,KAAK,GAAG,EAAE,MAAM,EAAE,MAAe,EAAE,GAAG,SAAS;AACjE,QAAA,QAAQ,EAAE,YAAY;AACtB,QAAA,SAAS,EAAE,aAAa;AACxB,QAAA,GAAG,SAAS;KACf;AAED,IAAA,QACIA,GAAA,CAAC,cAAc,IACX,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAC1B,GAAG,EAAE,OAAO,IAAI,GAAG,EACnB,MAAM,EAAE,MAAM,YAEdA,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE;AAClC,gBAAA,CAAC,WAAW,MAAM,CAAA,CAAE,GAAG,MAAM,KAAK,QAAQ;gBAC1C,oBAAoB,EAAE,CAAC,MAAM;AAChC,aAAA,CAAC,YAEFA,GAAA,CAAA,UAAA,EAAA,EAAA,GAAc,UAAU,GAAI,EAAA,CAC1B,EAAA,CACO;AAEzB;;;;"}
1
+ {"version":3,"file":"textarea.js","sources":["../../../../packages/components/input/textarea.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport {\n ChangeEvent,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n type KeyboardEvent,\n} from \"react\";\nimport \"../../css/input.css\";\nimport InputContainer from \"./container\";\nimport type { ITextarea } from \"./type\";\n\nconst Textarea = (props: ITextarea) => {\n const {\n ref,\n label,\n name,\n value = \"\",\n labelInline,\n className,\n status = \"normal\",\n message,\n tip,\n autoSize,\n border,\n width,\n style,\n resize,\n onChange,\n onEnter,\n ...restProps\n } = props;\n\n const [textareaValue, setTextareaValue] = useState(value);\n const refTextarea = useRef<HTMLTextAreaElement>(null);\n\n const syncTextareaHeight = () => {\n const ta = refTextarea.current;\n if (!autoSize || !ta) return;\n\n ta.style.height = \"auto\";\n ta.style.height = `${ta.scrollHeight}px`;\n };\n\n const handleChange = (\n e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,\n ) => {\n const v = e.target.value;\n\n setTextareaValue(v);\n\n onChange?.(v, e);\n };\n\n const handleKeydown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.code !== \"Enter\") return;\n\n e.stopPropagation();\n onEnter?.(e);\n };\n\n useEffect(() => {\n setTextareaValue(value);\n }, [value]);\n\n useEffect(() => {\n syncTextareaHeight();\n }, [autoSize, textareaValue]);\n\n useImperativeHandle(ref, () => {\n return {\n input: refTextarea.current,\n };\n });\n\n const inputProps = {\n ref: refTextarea,\n name,\n value: textareaValue,\n className: \"i-input i-textarea\",\n style: resize === false ? { resize: \"none\" as const } : undefined,\n onChange: handleChange,\n onKeyDown: handleKeydown,\n ...restProps,\n };\n\n return (\n <InputContainer\n label={label}\n labelInline={labelInline}\n className={classNames(\"i-textarea-label\", className)}\n style={{ width, ...style }}\n tip={message ?? tip}\n status={status}\n >\n <div\n className={classNames(\"i-input-item\", {\n [`i-input-${status}`]: status !== \"normal\",\n \"i-input-borderless\": !border,\n })}\n >\n <textarea {...inputProps} />\n </div>\n </InputContainer>\n );\n};\n\nexport default Textarea;\n"],"names":["_jsx"],"mappings":";;;;;AAaA,MAAM,QAAQ,GAAG,CAAC,KAAgB,KAAI;AAClC,IAAA,MAAM,EACF,GAAG,EACH,KAAK,EACL,IAAI,EACJ,KAAK,GAAG,EAAE,EACV,WAAW,EACX,SAAS,EACT,MAAM,GAAG,QAAQ,EACjB,OAAO,EACP,GAAG,EACH,QAAQ,EACR,MAAM,EACN,KAAK,EACL,KAAK,EACL,MAAM,EACN,QAAQ,EACR,OAAO,EACP,GAAG,SAAS,EACf,GAAG,KAAK;IAET,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AACzD,IAAA,MAAM,WAAW,GAAG,MAAM,CAAsB,IAAI,CAAC;IAErD,MAAM,kBAAkB,GAAG,MAAK;AAC5B,QAAA,MAAM,EAAE,GAAG,WAAW,CAAC,OAAO;AAC9B,QAAA,IAAI,CAAC,QAAQ,IAAI,CAAC,EAAE;YAAE;AAEtB,QAAA,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,MAAM;QACxB,EAAE,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,EAAE,CAAC,YAAY,CAAA,EAAA,CAAI;AAC5C,IAAA,CAAC;AAED,IAAA,MAAM,YAAY,GAAG,CACjB,CAAsD,KACtD;AACA,QAAA,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK;QAExB,gBAAgB,CAAC,CAAC,CAAC;AAEnB,QAAA,QAAQ,GAAG,CAAC,EAAE,CAAC,CAAC;AACpB,IAAA,CAAC;AAED,IAAA,MAAM,aAAa,GAAG,CAAC,CAAqC,KAAI;AAC5D,QAAA,IAAI,CAAC,CAAC,IAAI,KAAK,OAAO;YAAE;QAExB,CAAC,CAAC,eAAe,EAAE;AACnB,QAAA,OAAO,GAAG,CAAC,CAAC;AAChB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACX,gBAAgB,CAAC,KAAK,CAAC;AAC3B,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAEX,SAAS,CAAC,MAAK;AACX,QAAA,kBAAkB,EAAE;AACxB,IAAA,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC;AAE7B,IAAA,mBAAmB,CAAC,GAAG,EAAE,MAAK;QAC1B,OAAO;YACH,KAAK,EAAE,WAAW,CAAC,OAAO;SAC7B;AACL,IAAA,CAAC,CAAC;AAEF,IAAA,MAAM,UAAU,GAAG;AACf,QAAA,GAAG,EAAE,WAAW;QAChB,IAAI;AACJ,QAAA,KAAK,EAAE,aAAa;AACpB,QAAA,SAAS,EAAE,oBAAoB;AAC/B,QAAA,KAAK,EAAE,MAAM,KAAK,KAAK,GAAG,EAAE,MAAM,EAAE,MAAe,EAAE,GAAG,SAAS;AACjE,QAAA,QAAQ,EAAE,YAAY;AACtB,QAAA,SAAS,EAAE,aAAa;AACxB,QAAA,GAAG,SAAS;KACf;IAED,QACIA,IAAC,cAAc,EAAA,EACX,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,SAAS,EAAE,UAAU,CAAC,kBAAkB,EAAE,SAAS,CAAC,EACpD,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAC1B,GAAG,EAAE,OAAO,IAAI,GAAG,EACnB,MAAM,EAAE,MAAM,EAAA,QAAA,EAEdA,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE;AAClC,gBAAA,CAAC,WAAW,MAAM,CAAA,CAAE,GAAG,MAAM,KAAK,QAAQ;gBAC1C,oBAAoB,EAAE,CAAC,MAAM;AAChC,aAAA,CAAC,YAEFA,GAAA,CAAA,UAAA,EAAA,EAAA,GAAc,UAAU,GAAI,EAAA,CAC1B,EAAA,CACO;AAEzB;;;;"}
@@ -1,6 +1,6 @@
1
- import message from './message.js';
1
+ import message, { MessageContainer } from './message.js';
2
2
 
3
+ const Message = Object.assign(message, { Container: MessageContainer });
3
4
 
4
-
5
- export { message as default };
5
+ export { MessageContainer, Message as default };
6
6
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
1
+ {"version":3,"file":"index.js","sources":["../../../../packages/components/message/index.tsx"],"sourcesContent":["import message, { MessageContainer } from \"./message\";\n\nconst Message = Object.assign(message, { Container: MessageContainer });\n\nexport { MessageContainer };\nexport default Message;\n"],"names":[],"mappings":";;AAEA,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,OAAO,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE;;;;"}
@@ -1,22 +1,21 @@
1
1
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
- import { useReactive } from '../../js/hooks.js';
3
2
  import classNames from 'classnames';
4
3
  import { uid } from 'radash';
5
4
  import { useRef, useEffect, isValidElement } from 'react';
6
- import { createRoot } from 'react-dom/client';
5
+ import { useReactive } from '../../js/hooks.js';
7
6
 
8
7
  const AlignMap = {
9
8
  left: "flex-start",
10
9
  center: "center",
11
10
  right: "flex-end",
12
11
  };
13
- const GlobalConfig = {
12
+ const ContainerConfig = {
13
+ align: "center",
14
+ fromBottom: false,
15
+ unshift: false,
14
16
  gap: 12,
15
- };
16
- const ItemDefaultConfig = {
17
+ offset: "12px",
17
18
  duration: 3000,
18
- closable: true,
19
- active: false,
20
19
  };
21
20
  const handler = {
22
21
  oneInstance: null,
@@ -33,12 +32,12 @@ const heights = {
33
32
  center: [],
34
33
  right: [],
35
34
  };
36
- const MessageItem = function ({ ref, active, content, top, className, style, onClick, }) {
35
+ const MessageItem = function ({ ref, active, content, top, bottom, className, style, onClick, }) {
37
36
  return (jsx("div", { ref: ref, className: classNames("i-message", className, {
38
37
  "i-message-active": active,
39
38
  }), style: {
40
39
  ...style,
41
- top,
40
+ ...(bottom !== undefined ? { bottom } : { top }),
42
41
  }, onClick: onClick, children: content }));
43
42
  };
44
43
  function Messages() {
@@ -55,26 +54,32 @@ function Messages() {
55
54
  right: [],
56
55
  },
57
56
  });
58
- const offsetTop = {
59
- left: 0,
60
- center: 0,
61
- right: 0,
62
- };
63
57
  useEffect(() => {
64
58
  Object.assign(handler, {
65
59
  callout: function (item) {
66
60
  const { align = "center", unshift, onShow } = item;
67
- const size = queue[align][unshift ? "unshift" : "push"](item);
61
+ queue[align][unshift ? "unshift" : "push"](item);
68
62
  state.items[align] = [...queue[align]];
69
63
  item.close = this.close.bind(item);
70
- setTimeout(() => {
64
+ // Pre-fill 0-height placeholder so heights stays index-aligned with queue
65
+ if (unshift) {
66
+ heights[align].unshift(0);
67
+ }
68
+ else {
69
+ heights[align].push(0);
70
+ }
71
+ state.tops[align] = [...heights[align]];
72
+ requestAnimationFrame(() => {
71
73
  const h = ref.current?.offsetHeight || 0;
72
- queue[align][unshift ? 0 : size - 1].active = true;
74
+ const idx = queue[align].findIndex((i) => i.id === item.id);
75
+ if (idx < 0)
76
+ return;
77
+ queue[align][idx].active = true;
73
78
  state.items[align] = [...queue[align]];
74
- heights[align][unshift ? "unshift" : "push"](h);
79
+ heights[align][idx] = h;
75
80
  state.tops[align] = [...heights[align]];
76
81
  onShow?.();
77
- }, 12);
82
+ });
78
83
  if (item.duration !== 0) {
79
84
  item.timer = setTimeout(() => {
80
85
  this.close.call(item);
@@ -101,36 +106,65 @@ function Messages() {
101
106
  },
102
107
  });
103
108
  }, []);
104
- const renderItems = (item, i) => {
105
- if (!item)
106
- return jsx(Fragment, {});
107
- const { id, active, content, align = "center", className } = item;
108
- offsetTop[align] += state.tops[align][i - 1] || 0;
109
- const top = GlobalConfig.gap * i + offsetTop[align];
110
- return (jsx(MessageItem, { ref: ref, active: active, content: content, top: top, className: className, style: { alignSelf: AlignMap[align] }, onClick: handler.close.bind(item) }, id));
109
+ const renderGroup = (align) => {
110
+ const items = state.items[align];
111
+ const tops = state.tops[align];
112
+ const gap = ContainerConfig.gap;
113
+ if (ContainerConfig.fromBottom) {
114
+ // bottom-up: calculate bottom-edge positions
115
+ let offset = 0;
116
+ const bottoms = [];
117
+ for (let i = items.length - 1; i >= 0; i--) {
118
+ bottoms[i] = offset;
119
+ offset += (tops[i] || 0) + gap;
120
+ }
121
+ return items.map((item, i) => {
122
+ if (!item)
123
+ return jsx(Fragment, {});
124
+ const { id, active, content, className, style: itemStyle } = item;
125
+ return (jsx(MessageItem, { ref: ref, active: active, content: content, bottom: bottoms[i], className: className, style: {
126
+ ...itemStyle,
127
+ alignSelf: AlignMap[align],
128
+ }, onClick: handler.close.bind(item) }, id));
129
+ });
130
+ }
131
+ // top-down (default)
132
+ let offset = 0;
133
+ return items.map((item, i) => {
134
+ if (!item)
135
+ return jsx(Fragment, {});
136
+ const { id, active, content, className, style: itemStyle } = item;
137
+ const top = offset;
138
+ offset += (tops[i] || 0) + gap;
139
+ return (jsx(MessageItem, { ref: ref, active: active, content: content, top: top, className: className, style: {
140
+ ...itemStyle,
141
+ alignSelf: AlignMap[align],
142
+ }, onClick: handler.close.bind(item) }, id));
143
+ });
111
144
  };
112
- return (jsxs("div", { className: 'i-messages', children: [state.items.left.map(renderItems), state.items.center.map(renderItems), state.items.right.map(renderItems)] }));
145
+ return (jsxs("div", { className: "i-messages", style: {
146
+ margin: ContainerConfig.offset,
147
+ }, children: [renderGroup("left"), renderGroup("center"), renderGroup("right")] }));
113
148
  }
114
149
  function message(config) {
115
- if (["string", "number"].includes(typeof config) ||
116
- isValidElement(config)) {
150
+ if (typeof config !== "object" || isValidElement(config)) {
117
151
  config = { content: config };
118
152
  }
119
- config = Object.assign({ id: uid(7) }, ItemDefaultConfig, config);
120
- handler.callout(config);
153
+ const msg = {
154
+ id: uid(7),
155
+ active: false,
156
+ align: ContainerConfig.align,
157
+ duration: ContainerConfig.duration,
158
+ closable: true,
159
+ unshift: ContainerConfig.unshift,
160
+ ...config,
161
+ };
162
+ handler.callout(msg);
121
163
  return {
122
- instance: config,
123
- close: handler.close.bind(config),
164
+ instance: msg,
165
+ close: handler.close.bind(msg),
124
166
  };
125
167
  }
126
- function createContainer() {
127
- if (typeof document === "undefined")
128
- return null;
129
- const container = document.createElement("div");
130
- container.dataset.id = "messages";
131
- document.body.append(container);
132
- return container;
133
- }
134
168
  message.error = (content) => {
135
169
  return message({
136
170
  content,
@@ -173,16 +207,24 @@ message.one = (config) => {
173
207
  handler.oneInstance = instance;
174
208
  }
175
209
  };
176
- // 初始化消息容器
177
- let container = null;
178
- let root = null;
179
- if (typeof window !== "undefined") {
180
- container = createContainer();
181
- if (container) {
182
- root = createRoot(container);
183
- root.render(jsx(Messages, {}));
184
- }
210
+ function MessageContainer({ align = "center", fromBottom = false, unshift = false, gap = 12, offset = "12px", duration = 3000, }) {
211
+ ContainerConfig.align = align;
212
+ ContainerConfig.fromBottom = fromBottom;
213
+ ContainerConfig.unshift = unshift;
214
+ ContainerConfig.gap = gap;
215
+ ContainerConfig.offset = offset;
216
+ ContainerConfig.duration = duration;
217
+ return null;
218
+ }
219
+ // 默认 Portal 到 document.body(仅在客户端执行,避免 SSR 问题)
220
+ if (typeof document !== "undefined") {
221
+ import('react-dom/client').then(({ createRoot }) => {
222
+ const container = document.createElement("div");
223
+ container.dataset.id = "messages";
224
+ document.body.append(container);
225
+ createRoot(container).render(jsx(Messages, {}));
226
+ });
185
227
  }
186
228
 
187
- export { message as default };
229
+ export { MessageContainer, message as default };
188
230
  //# sourceMappingURL=message.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"message.js","sources":["../../../../packages/components/message/message.tsx"],"sourcesContent":["import { useReactive } from \"../../js/hooks\";\nimport classNames from \"classnames\";\nimport { uid } from \"radash\";\nimport { ReactNode, isValidElement, useEffect, useRef } from \"react\";\nimport { createRoot } from \"react-dom/client\";\nimport \"./index.css\";\nimport type { IMessage, IMessageItem, THeights, TMessageQueue } from \"./type\";\n\nconst AlignMap = {\n\tleft: \"flex-start\",\n\tcenter: \"center\",\n\tright: \"flex-end\",\n};\n\nconst GlobalConfig = {\n\talign: \"center\",\n\toffset: \"12px\",\n\tgap: 12,\n};\n\nconst ItemDefaultConfig = {\n\tduration: 3000,\n\tclosable: true,\n\tactive: false,\n};\n\nconst handler: {\n\toneInstance: null | IMessage;\n\tcallout: (item: IMessage) => void;\n\tclose: () => void;\n} = {\n\toneInstance: null,\n\tcallout(item: IMessage) {},\n\tclose() {},\n};\n\nconst queue: TMessageQueue = {\n\tleft: [],\n\tcenter: [],\n\tright: [],\n};\nconst heights: THeights = {\n\tleft: [],\n\tcenter: [],\n\tright: [],\n};\n\nconst MessageItem = function ({\n\tref,\n\tactive,\n\tcontent,\n\ttop,\n\tclassName,\n\tstyle,\n\tonClick,\n}: IMessageItem) {\n\treturn (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={classNames(\"i-message\", className, {\n\t\t\t\t\"i-message-active\": active,\n\t\t\t})}\n\t\t\tstyle={{\n\t\t\t\t...style,\n\t\t\t\ttop,\n\t\t\t}}\n\t\t\tonClick={onClick}\n\t\t>\n\t\t\t{content}\n\t\t</div>\n\t);\n};\n\nfunction Messages() {\n\tconst ref = useRef<HTMLDivElement>(null);\n\tconst state = useReactive<{\n\t\ttops: THeights;\n\t\titems: TMessageQueue;\n\t}>({\n\t\titems: {\n\t\t\tleft: [],\n\t\t\tcenter: [],\n\t\t\tright: [],\n\t\t},\n\t\ttops: {\n\t\t\tleft: [],\n\t\t\tcenter: [],\n\t\t\tright: [],\n\t\t},\n\t});\n\tconst offsetTop = {\n\t\tleft: 0,\n\t\tcenter: 0,\n\t\tright: 0,\n\t};\n\n\tuseEffect(() => {\n\t\tObject.assign(handler, {\n\t\t\tcallout: function (item: IMessage) {\n\t\t\t\tconst { align = \"center\", unshift, onShow } = item;\n\t\t\t\tconst size = queue[align][unshift ? \"unshift\" : \"push\"](item);\n\t\t\t\tstate.items[align] = [...queue[align]];\n\t\t\t\titem.close = this.close.bind(item);\n\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tconst h = ref.current?.offsetHeight || 0;\n\n\t\t\t\t\tqueue[align][unshift ? 0 : size - 1].active = true;\n\t\t\t\t\tstate.items[align] = [...queue[align]];\n\t\t\t\t\theights[align][unshift ? \"unshift\" : \"push\"](h);\n\t\t\t\t\tstate.tops[align] = [...heights[align]];\n\t\t\t\t\tonShow?.();\n\t\t\t\t}, 12);\n\n\t\t\t\tif (item.duration !== 0) {\n\t\t\t\t\titem.timer = setTimeout(() => {\n\t\t\t\t\t\tthis.close.call(item);\n\t\t\t\t\t}, item.duration);\n\t\t\t\t}\n\t\t\t},\n\t\t\tclose: function () {\n\t\t\t\tconst item = this as IMessage;\n\t\t\t\tconst { align = \"center\", onHide } = item;\n\t\t\t\tconst index = queue[align].findIndex((i) => i.id === item.id);\n\t\t\t\tif (index < 0) return;\n\n\t\t\t\tqueue[align][index].active = false;\n\t\t\t\tstate.items[align] = [...queue[align]];\n\n\t\t\t\titem.timer = setTimeout(() => {\n\t\t\t\t\tconst index = queue[align].findIndex(\n\t\t\t\t\t\t(i) => i.id === item.id\n\t\t\t\t\t);\n\n\t\t\t\t\tqueue[align].splice(index, 1);\n\t\t\t\t\theights[align].splice(index, 1);\n\t\t\t\t\tstate.tops[align] = [...heights[align]];\n\t\t\t\t\tstate.items[align] = [...queue[align]];\n\t\t\t\t\titem.timer && clearTimeout(item.timer);\n\t\t\t\t\tonHide?.();\n\t\t\t\t}, 240);\n\t\t\t},\n\t\t});\n\t}, []);\n\n\tconst renderItems = (item, i) => {\n\t\tif (!item) return <></>;\n\n\t\tconst { id, active, content, align = \"center\", className } = item;\n\t\toffsetTop[align] += state.tops[align][i - 1] || 0;\n\t\tconst top = GlobalConfig.gap * i + offsetTop[align];\n\n\t\treturn (\n\t\t\t<MessageItem\n\t\t\t\tkey={id}\n\t\t\t\tref={ref}\n\t\t\t\tactive={active}\n\t\t\t\tcontent={content}\n\t\t\t\ttop={top}\n\t\t\t\tclassName={className}\n\t\t\t\tstyle={{ alignSelf: AlignMap[align] }}\n\t\t\t\tonClick={handler.close.bind(item)}\n\t\t\t/>\n\t\t);\n\t};\n\n\treturn (\n\t\t<div className='i-messages'>\n\t\t\t{state.items.left.map(renderItems)}\n\t\t\t{state.items.center.map(renderItems)}\n\t\t\t{state.items.right.map(renderItems)}\n\t\t</div>\n\t);\n}\n\nexport function setMessageConfig(config: IMessage) {\n\tObject.assign(GlobalConfig, config);\n}\n\nfunction message(config: IMessage | ReactNode) {\n\tif (\n\t\t[\"string\", \"number\"].includes(typeof config) ||\n\t\tisValidElement(config)\n\t) {\n\t\tconfig = { content: config as ReactNode };\n\t}\n\n\tconfig = Object.assign(\n\t\t{ id: uid(7) },\n\t\tItemDefaultConfig,\n\t\tconfig as IMessage\n\t);\n\n\thandler.callout(config as IMessage);\n\n\treturn {\n\t\tinstance: config,\n\t\tclose: handler.close.bind(config),\n\t};\n}\n\nfunction createContainer() {\n\tif (typeof document === \"undefined\") return null;\n\tconst container = document.createElement(\"div\");\n\tcontainer.dataset.id = \"messages\";\n\tdocument.body.append(container);\n\treturn container;\n}\n\nmessage.error = (content: ReactNode) => {\n\treturn message({\n\t\tcontent,\n\t\tclassName: \"bg-error\",\n\t});\n};\n\nmessage.success = (content: ReactNode) => {\n\treturn message({\n\t\tcontent,\n\t\tclassName: \"bg-success\",\n\t});\n};\n\nmessage.warning = (content: ReactNode) => {\n\treturn message({\n\t\tcontent,\n\t\tclassName: \"bg-warning\",\n\t});\n};\n\nmessage.info = (content: ReactNode) => {\n\treturn message({\n\t\tcontent,\n\t\tclassName: \"bg-blue\",\n\t});\n};\n\nmessage.one = (config: IMessage) => {\n\tconst o = handler.oneInstance;\n\n\tif (o) {\n\t\tif (o.active && o.duration !== 0) {\n\t\t\tclearTimeout(o.timer);\n\t\t\to.timer = setTimeout(() => {\n\t\t\t\to.close?.();\n\t\t\t}, o.duration);\n\t\t} else {\n\t\t\thandler.callout(o);\n\t\t}\n\t} else {\n\t\tconst { instance } = message(config);\n\t\thandler.oneInstance = instance;\n\t}\n};\n\n// 初始化消息容器\nlet container: HTMLElement | null = null;\nlet root: any = null;\n\nif (typeof window !== \"undefined\") {\n\tcontainer = createContainer();\n\tif (container) {\n\t\troot = createRoot(container);\n\t\troot.render(<Messages />);\n\t}\n}\n\nexport default message;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"message.js","sources":["../../../../packages/components/message/message.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { uid } from \"radash\";\nimport { ReactNode, isValidElement, useEffect, useRef } from \"react\";\nimport { useReactive } from \"../../js/hooks\";\nimport \"./index.css\";\nimport type {\n\tIMessage,\n\tIMessageConfig,\n\tIMessageContainerProps,\n\tIMessageItem,\n\tTHeights,\n\tTMessageQueue,\n} from \"./type\";\n\nconst AlignMap = {\n\tleft: \"flex-start\",\n\tcenter: \"center\",\n\tright: \"flex-end\",\n};\n\nconst ContainerConfig = {\n\talign: \"center\",\n\tfromBottom: false,\n\tunshift: false,\n\tgap: 12,\n\toffset: \"12px\",\n\tduration: 3000,\n};\n\nconst handler: {\n\toneInstance: null | IMessage;\n\tcallout: (item: IMessage) => void;\n\tclose: () => void;\n} = {\n\toneInstance: null,\n\tcallout(item: IMessage) {},\n\tclose() {},\n};\n\nconst queue: TMessageQueue = {\n\tleft: [],\n\tcenter: [],\n\tright: [],\n};\nconst heights: THeights = {\n\tleft: [],\n\tcenter: [],\n\tright: [],\n};\n\nconst MessageItem = function ({\n\tref,\n\tactive,\n\tcontent,\n\ttop,\n\tbottom,\n\tclassName,\n\tstyle,\n\tonClick,\n}: IMessageItem) {\n\treturn (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tclassName={classNames(\"i-message\", className, {\n\t\t\t\t\"i-message-active\": active,\n\t\t\t})}\n\t\t\tstyle={{\n\t\t\t\t...style,\n\t\t\t\t...(bottom !== undefined ? { bottom } : { top }),\n\t\t\t}}\n\t\t\tonClick={onClick}\n\t\t>\n\t\t\t{content}\n\t\t</div>\n\t);\n};\n\nfunction Messages() {\n\tconst ref = useRef<HTMLDivElement>(null);\n\tconst state = useReactive<{\n\t\ttops: THeights;\n\t\titems: TMessageQueue;\n\t}>({\n\t\titems: {\n\t\t\tleft: [],\n\t\t\tcenter: [],\n\t\t\tright: [],\n\t\t},\n\t\ttops: {\n\t\t\tleft: [],\n\t\t\tcenter: [],\n\t\t\tright: [],\n\t\t},\n\t});\n\n\tuseEffect(() => {\n\t\tObject.assign(handler, {\n\t\t\tcallout: function (item: IMessage) {\n\t\t\t\tconst { align = \"center\", unshift, onShow } = item;\n\t\t\t\tqueue[align][unshift ? \"unshift\" : \"push\"](item);\n\t\t\t\tstate.items[align] = [...queue[align]];\n\t\t\t\titem.close = this.close.bind(item);\n\n\t\t\t\t// Pre-fill 0-height placeholder so heights stays index-aligned with queue\n\t\t\t\tif (unshift) {\n\t\t\t\t\theights[align].unshift(0);\n\t\t\t\t} else {\n\t\t\t\t\theights[align].push(0);\n\t\t\t\t}\n\t\t\t\tstate.tops[align] = [...heights[align]];\n\n\t\t\t\trequestAnimationFrame(() => {\n\t\t\t\t\tconst h = ref.current?.offsetHeight || 0;\n\t\t\t\t\tconst idx = queue[align].findIndex((i) => i.id === item.id);\n\t\t\t\t\tif (idx < 0) return;\n\n\t\t\t\t\tqueue[align][idx].active = true;\n\t\t\t\t\tstate.items[align] = [...queue[align]];\n\t\t\t\t\theights[align][idx] = h;\n\t\t\t\t\tstate.tops[align] = [...heights[align]];\n\t\t\t\t\tonShow?.();\n\t\t\t\t});\n\n\t\t\t\tif (item.duration !== 0) {\n\t\t\t\t\titem.timer = setTimeout(() => {\n\t\t\t\t\t\tthis.close.call(item);\n\t\t\t\t\t}, item.duration);\n\t\t\t\t}\n\t\t\t},\n\t\t\tclose: function () {\n\t\t\t\tconst item = this as unknown as IMessage;\n\t\t\t\tconst { align = \"center\", onHide } = item;\n\t\t\t\tconst index = queue[align].findIndex((i) => i.id === item.id);\n\t\t\t\tif (index < 0) return;\n\n\t\t\t\tqueue[align][index].active = false;\n\t\t\t\tstate.items[align] = [...queue[align]];\n\n\t\t\t\titem.timer = setTimeout(() => {\n\t\t\t\t\tconst index = queue[align].findIndex(\n\t\t\t\t\t\t(i) => i.id === item.id,\n\t\t\t\t\t);\n\n\t\t\t\t\tqueue[align].splice(index, 1);\n\t\t\t\t\theights[align].splice(index, 1);\n\t\t\t\t\tstate.tops[align] = [...heights[align]];\n\t\t\t\t\tstate.items[align] = [...queue[align]];\n\t\t\t\t\titem.timer && clearTimeout(item.timer);\n\t\t\t\t\tonHide?.();\n\t\t\t\t}, 240);\n\t\t\t},\n\t\t});\n\t}, []);\n\n\tconst renderGroup = (align: string) => {\n\t\tconst items = state.items[align];\n\t\tconst tops = state.tops[align];\n\t\tconst gap = ContainerConfig.gap;\n\n\t\tif (ContainerConfig.fromBottom) {\n\t\t\t// bottom-up: calculate bottom-edge positions\n\t\t\tlet offset = 0;\n\t\t\tconst bottoms: number[] = [];\n\t\t\tfor (let i = items.length - 1; i >= 0; i--) {\n\t\t\t\tbottoms[i] = offset;\n\t\t\t\toffset += (tops[i] || 0) + gap;\n\t\t\t}\n\n\t\t\treturn items.map((item: IMessage, i: number) => {\n\t\t\t\tif (!item) return <></>;\n\n\t\t\t\tconst { id, active, content, className, style: itemStyle } =\n\t\t\t\t\titem;\n\n\t\t\t\treturn (\n\t\t\t\t\t<MessageItem\n\t\t\t\t\t\tkey={id}\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\tactive={active}\n\t\t\t\t\t\tcontent={content}\n\t\t\t\t\t\tbottom={bottoms[i]}\n\t\t\t\t\t\tclassName={className}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t...itemStyle,\n\t\t\t\t\t\t\talignSelf: AlignMap[align],\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={handler.close.bind(item)}\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t});\n\t\t}\n\n\t\t// top-down (default)\n\t\tlet offset = 0;\n\t\treturn items.map((item: IMessage, i: number) => {\n\t\t\tif (!item) return <></>;\n\n\t\t\tconst { id, active, content, className, style: itemStyle } = item;\n\t\t\tconst top = offset;\n\n\t\t\toffset += (tops[i] || 0) + gap;\n\n\t\t\treturn (\n\t\t\t\t<MessageItem\n\t\t\t\t\tkey={id}\n\t\t\t\t\tref={ref}\n\t\t\t\t\tactive={active}\n\t\t\t\t\tcontent={content}\n\t\t\t\t\ttop={top}\n\t\t\t\t\tclassName={className}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\t...itemStyle,\n\t\t\t\t\t\talignSelf: AlignMap[align],\n\t\t\t\t\t}}\n\t\t\t\t\tonClick={handler.close.bind(item)}\n\t\t\t\t/>\n\t\t\t);\n\t\t});\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"i-messages\"\n\t\t\tstyle={{\n\t\t\t\tmargin: ContainerConfig.offset,\n\t\t\t}}\n\t\t>\n\t\t\t{renderGroup(\"left\")}\n\t\t\t{renderGroup(\"center\")}\n\t\t\t{renderGroup(\"right\")}\n\t\t</div>\n\t);\n}\n\nfunction message(config: IMessageConfig | ReactNode) {\n\tif (typeof config !== \"object\" || isValidElement(config as ReactNode)) {\n\t\tconfig = { content: config as ReactNode };\n\t}\n\n\tconst msg: IMessage = {\n\t\tid: uid(7),\n\t\tactive: false,\n\t\talign: ContainerConfig.align,\n\t\tduration: ContainerConfig.duration,\n\t\tclosable: true,\n\t\tunshift: ContainerConfig.unshift,\n\t\t...(config as IMessageConfig),\n\t};\n\n\thandler.callout(msg);\n\n\treturn {\n\t\tinstance: msg,\n\t\tclose: handler.close.bind(msg),\n\t};\n}\n\nmessage.error = (content: ReactNode) => {\n\treturn message({\n\t\tcontent,\n\t\tclassName: \"bg-error\",\n\t});\n};\n\nmessage.success = (content: ReactNode) => {\n\treturn message({\n\t\tcontent,\n\t\tclassName: \"bg-success\",\n\t});\n};\n\nmessage.warning = (content: ReactNode) => {\n\treturn message({\n\t\tcontent,\n\t\tclassName: \"bg-warning\",\n\t});\n};\n\nmessage.info = (content: ReactNode) => {\n\treturn message({\n\t\tcontent,\n\t\tclassName: \"bg-blue\",\n\t});\n};\n\nmessage.one = (config: IMessageConfig) => {\n\tconst o = handler.oneInstance;\n\n\tif (o) {\n\t\tif (o.active && o.duration !== 0) {\n\t\t\tclearTimeout(o.timer);\n\t\t\to.timer = setTimeout(() => {\n\t\t\t\to.close?.();\n\t\t\t}, o.duration);\n\t\t} else {\n\t\t\thandler.callout(o);\n\t\t}\n\t} else {\n\t\tconst { instance } = message(config);\n\t\thandler.oneInstance = instance;\n\t}\n};\n\nfunction MessageContainer({\n\talign = \"center\",\n\tfromBottom = false,\n\tunshift = false,\n\tgap = 12,\n\toffset = \"12px\",\n\tduration = 3000,\n}: IMessageContainerProps) {\n\tContainerConfig.align = align;\n\tContainerConfig.fromBottom = fromBottom;\n\tContainerConfig.unshift = unshift;\n\tContainerConfig.gap = gap;\n\tContainerConfig.offset = offset;\n\tContainerConfig.duration = duration;\n\n\treturn null;\n}\n\n// 默认 Portal 到 document.body(仅在客户端执行,避免 SSR 问题)\nif (typeof document !== \"undefined\") {\n\timport(\"react-dom/client\").then(({ createRoot }) => {\n\t\tconst container = document.createElement(\"div\");\n\t\tcontainer.dataset.id = \"messages\";\n\t\tdocument.body.append(container);\n\t\tcreateRoot(container).render(<Messages />);\n\t});\n}\n\nexport { MessageContainer };\nexport default message;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
@@ -1,16 +1,23 @@
1
1
  import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
- import { useMemo } from 'react';
2
+ import { memo, useState, useMemo } from 'react';
3
3
  import Button from '../button/button.js';
4
4
  import Helpericon from '../utils/helpericon/helpericon.js';
5
5
 
6
- function Content(props) {
6
+ const Content = (props) => {
7
7
  const { title, footer, hideCloseButton, footerLeft, okButtonProps, cancelButtonProps, children, onOk, onClose, } = props;
8
8
  const showHeader = title || !hideCloseButton;
9
+ const [loading, setLoading] = useState(false);
9
10
  const handleOk = async () => {
10
- const ret = await onOk?.();
11
- if (ret === false)
12
- return;
13
- onClose?.();
11
+ setLoading(true);
12
+ try {
13
+ const ret = await onOk?.();
14
+ if (ret === false)
15
+ return;
16
+ onClose?.();
17
+ }
18
+ finally {
19
+ setLoading(false);
20
+ }
14
21
  };
15
22
  const renderFooter = useMemo(() => {
16
23
  if (footer || footer === null)
@@ -18,16 +25,17 @@ function Content(props) {
18
25
  const propsOk = Object.assign({
19
26
  children: "确定",
20
27
  onClick: handleOk,
21
- }, okButtonProps);
28
+ }, okButtonProps, { loading });
22
29
  const propsCancel = Object.assign({
23
30
  secondary: true,
24
31
  children: "关闭",
25
32
  onClick: onClose,
26
33
  }, cancelButtonProps);
27
34
  return (jsxs(Fragment, { children: [footerLeft, jsx(Button, { ...propsOk }), jsx(Button, { ...propsCancel })] }));
28
- }, [footer, okButtonProps, cancelButtonProps]);
35
+ }, [footer, okButtonProps, cancelButtonProps, loading]);
29
36
  return (jsxs(Fragment, { children: [showHeader && (jsxs("header", { className: 'i-modal-header', children: [title && jsx("b", { children: title }), jsx(Helpericon, { active: !hideCloseButton, className: 'i-modal-close', onClick: onClose })] })), jsx("div", { className: 'i-modal-content', children: children }), jsx("footer", { className: 'i-modal-footer', children: renderFooter })] }));
30
- }
37
+ };
38
+ var Content$1 = memo(Content);
31
39
 
32
- export { Content as default };
40
+ export { Content$1 as default };
33
41
  //# sourceMappingURL=content.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"content.js","sources":["../../../../packages/components/modal/content.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport Button from \"../button\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport { IModalContent } from \"./type\";\n\nexport default function Content(props: IModalContent) {\n\tconst {\n\t\ttitle,\n\t\tfooter,\n\t\thideCloseButton,\n\t\tfooterLeft,\n\t\tokButtonProps,\n\t\tcancelButtonProps,\n\t\tchildren,\n\t\tonOk,\n\t\tonClose,\n\t} = props;\n\tconst showHeader = title || !hideCloseButton;\n\n\tconst handleOk = async () => {\n\t\tconst ret = await onOk?.();\n\n\t\tif (ret === false) return;\n\n\t\tonClose?.();\n\t};\n\n\tconst renderFooter = useMemo(() => {\n\t\tif (footer || footer === null) return footer;\n\n\t\tconst propsOk = Object.assign(\n\t\t\t{\n\t\t\t\tchildren: \"确定\",\n\t\t\t\tonClick: handleOk,\n\t\t\t},\n\t\t\tokButtonProps\n\t\t);\n\t\tconst propsCancel = Object.assign(\n\t\t\t{\n\t\t\t\tsecondary: true,\n\t\t\t\tchildren: \"关闭\",\n\t\t\t\tonClick: onClose,\n\t\t\t},\n\t\t\tcancelButtonProps\n\t\t);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{footerLeft}\n\t\t\t\t<Button {...propsOk} />\n\t\t\t\t<Button {...propsCancel} />\n\t\t\t</>\n\t\t);\n\t}, [footer, okButtonProps, cancelButtonProps]);\n\n\treturn (\n\t\t<>\n\t\t\t{showHeader && (\n\t\t\t\t<header className='i-modal-header'>\n\t\t\t\t\t{title && <b>{title}</b>}\n\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive={!hideCloseButton}\n\t\t\t\t\t\tclassName='i-modal-close'\n\t\t\t\t\t\tonClick={onClose}\n\t\t\t\t\t/>\n\t\t\t\t</header>\n\t\t\t)}\n\n\t\t\t<div className='i-modal-content'>{children}</div>\n\n\t\t\t<footer className='i-modal-footer'>{renderFooter}</footer>\n\t\t</>\n\t);\n}\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;AAMc,SAAU,OAAO,CAAC,KAAoB,EAAA;IACnD,MAAM,EACL,KAAK,EACL,MAAM,EACN,eAAe,EACf,UAAU,EACV,aAAa,EACb,iBAAiB,EACjB,QAAQ,EACR,IAAI,EACJ,OAAO,GACP,GAAG,KAAK;AACT,IAAA,MAAM,UAAU,GAAG,KAAK,IAAI,CAAC,eAAe;AAE5C,IAAA,MAAM,QAAQ,GAAG,YAAW;AAC3B,QAAA,MAAM,GAAG,GAAG,MAAM,IAAI,IAAI;QAE1B,IAAI,GAAG,KAAK,KAAK;YAAE;QAEnB,OAAO,IAAI;AACZ,IAAA,CAAC;AAED,IAAA,MAAM,YAAY,GAAG,OAAO,CAAC,MAAK;AACjC,QAAA,IAAI,MAAM,IAAI,MAAM,KAAK,IAAI;AAAE,YAAA,OAAO,MAAM;AAE5C,QAAA,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,CAC5B;AACC,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,OAAO,EAAE,QAAQ;SACjB,EACD,aAAa,CACb;AACD,QAAA,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAChC;AACC,YAAA,SAAS,EAAE,IAAI;AACf,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,OAAO,EAAE,OAAO;SAChB,EACD,iBAAiB,CACjB;AAED,QAAA,QACCA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACE,UAAU,EACXC,GAAA,CAAC,MAAM,EAAA,EAAA,GAAK,OAAO,EAAA,CAAI,EACvBA,IAAC,MAAM,EAAA,EAAA,GAAK,WAAW,EAAA,CAAI,CAAA,EAAA,CACzB;IAEL,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,iBAAiB,CAAC,CAAC;IAE9C,QACCF,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACE,UAAU,KACVD,iBAAQ,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAAA,CAChC,KAAK,IAAIE,qBAAI,KAAK,EAAA,CAAK,EAExBA,GAAA,CAAC,UAAU,EAAA,EACV,MAAM,EAAE,CAAC,eAAe,EACxB,SAAS,EAAC,eAAe,EACzB,OAAO,EAAE,OAAO,EAAA,CACf,CAAA,EAAA,CACM,CACT,EAEDA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,iBAAiB,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAO,EAEjDA,GAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAC,gBAAgB,YAAE,YAAY,EAAA,CAAU,CAAA,EAAA,CACxD;AAEL;;;;"}
1
+ {"version":3,"file":"content.js","sources":["../../../../packages/components/modal/content.tsx"],"sourcesContent":["import { memo, useMemo, useState } from \"react\";\nimport Button from \"../button\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport { IModalContent } from \"./type\";\n\nconst Content = (props: IModalContent) => {\n\tconst {\n\t\ttitle,\n\t\tfooter,\n\t\thideCloseButton,\n\t\tfooterLeft,\n\t\tokButtonProps,\n\t\tcancelButtonProps,\n\t\tchildren,\n\t\tonOk,\n\t\tonClose,\n\t} = props;\n\tconst showHeader = title || !hideCloseButton;\n\n\tconst [loading, setLoading] = useState(false);\n\n\tconst handleOk = async () => {\n\t\tsetLoading(true);\n\t\ttry {\n\t\t\tconst ret = await onOk?.();\n\n\t\t\tif (ret === false) return;\n\n\t\t\tonClose?.();\n\t\t} finally {\n\t\t\tsetLoading(false);\n\t\t}\n\t};\n\n\tconst renderFooter = useMemo(() => {\n\t\tif (footer || footer === null) return footer;\n\n\t\tconst propsOk = Object.assign(\n\t\t\t{\n\t\t\t\tchildren: \"确定\",\n\t\t\t\tonClick: handleOk,\n\t\t\t},\n\t\t\tokButtonProps,\n\t\t\t{ loading }\n\t\t);\n\t\tconst propsCancel = Object.assign(\n\t\t\t{\n\t\t\t\tsecondary: true,\n\t\t\t\tchildren: \"关闭\",\n\t\t\t\tonClick: onClose,\n\t\t\t},\n\t\t\tcancelButtonProps\n\t\t);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{footerLeft}\n\t\t\t\t<Button {...propsOk} />\n\t\t\t\t<Button {...propsCancel} />\n\t\t\t</>\n\t\t);\n\t}, [footer, okButtonProps, cancelButtonProps, loading]);\n\n\treturn (\n\t\t<>\n\t\t\t{showHeader && (\n\t\t\t\t<header className='i-modal-header'>\n\t\t\t\t\t{title && <b>{title}</b>}\n\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive={!hideCloseButton}\n\t\t\t\t\t\tclassName='i-modal-close'\n\t\t\t\t\t\tonClick={onClose}\n\t\t\t\t\t/>\n\t\t\t\t</header>\n\t\t\t)}\n\n\t\t\t<div className='i-modal-content'>{children}</div>\n\n\t\t\t<footer className='i-modal-footer'>{renderFooter}</footer>\n\t\t</>\n\t);\n};\n\nexport default memo(Content);\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":";;;;;AAMA,MAAM,OAAO,GAAG,CAAC,KAAoB,KAAI;IACxC,MAAM,EACL,KAAK,EACL,MAAM,EACN,eAAe,EACf,UAAU,EACV,aAAa,EACb,iBAAiB,EACjB,QAAQ,EACR,IAAI,EACJ,OAAO,GACP,GAAG,KAAK;AACT,IAAA,MAAM,UAAU,GAAG,KAAK,IAAI,CAAC,eAAe;IAE5C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AAE7C,IAAA,MAAM,QAAQ,GAAG,YAAW;QAC3B,UAAU,CAAC,IAAI,CAAC;AAChB,QAAA,IAAI;AACH,YAAA,MAAM,GAAG,GAAG,MAAM,IAAI,IAAI;YAE1B,IAAI,GAAG,KAAK,KAAK;gBAAE;YAEnB,OAAO,IAAI;QACZ;gBAAU;YACT,UAAU,CAAC,KAAK,CAAC;QAClB;AACD,IAAA,CAAC;AAED,IAAA,MAAM,YAAY,GAAG,OAAO,CAAC,MAAK;AACjC,QAAA,IAAI,MAAM,IAAI,MAAM,KAAK,IAAI;AAAE,YAAA,OAAO,MAAM;AAE5C,QAAA,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,CAC5B;AACC,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,OAAO,EAAE,QAAQ;AACjB,SAAA,EACD,aAAa,EACb,EAAE,OAAO,EAAE,CACX;AACD,QAAA,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAChC;AACC,YAAA,SAAS,EAAE,IAAI;AACf,YAAA,QAAQ,EAAE,IAAI;AACd,YAAA,OAAO,EAAE,OAAO;SAChB,EACD,iBAAiB,CACjB;AAED,QAAA,QACCA,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACE,UAAU,EACXC,GAAA,CAAC,MAAM,EAAA,EAAA,GAAK,OAAO,EAAA,CAAI,EACvBA,IAAC,MAAM,EAAA,EAAA,GAAK,WAAW,EAAA,CAAI,CAAA,EAAA,CACzB;IAEL,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,iBAAiB,EAAE,OAAO,CAAC,CAAC;IAEvD,QACCF,IAAA,CAAAC,QAAA,EAAA,EAAA,QAAA,EAAA,CACE,UAAU,KACVD,iBAAQ,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAAA,CAChC,KAAK,IAAIE,qBAAI,KAAK,EAAA,CAAK,EAExBA,GAAA,CAAC,UAAU,EAAA,EACV,MAAM,EAAE,CAAC,eAAe,EACxB,SAAS,EAAC,eAAe,EACzB,OAAO,EAAE,OAAO,EAAA,CACf,CAAA,EAAA,CACM,CACT,EAEDA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,iBAAiB,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAO,EAEjDA,GAAA,CAAA,QAAA,EAAA,EAAQ,SAAS,EAAC,gBAAgB,YAAE,YAAY,EAAA,CAAU,CAAA,EAAA,CACxD;AAEL,CAAC;AAED,gBAAe,IAAI,CAAC,OAAO,CAAC;;;;"}
@@ -1,32 +1,48 @@
1
1
  import { jsx, jsxs } from 'react/jsx-runtime';
2
2
  import classNames from 'classnames';
3
- import { useState, useRef, useEffect } from 'react';
3
+ import { useRef, useState, useCallback, useEffect } from 'react';
4
4
  import { createPortal } from 'react-dom';
5
5
  import { useKeydown } from '../../js/hooks.js';
6
6
  import Content from './content.js';
7
7
  import ModalContext from './context.js';
8
+ import { updateVisible, subscribe, register, getContainer, isTop } from './modalManager.js';
8
9
  import useModal from './useModal.js';
9
10
 
11
+ let midCounter = 0;
10
12
  function Modal(props) {
11
13
  const { visible, title, footer, okButtonProps, cancelButtonProps, closable = true, hideBackdrop, backdropClosable = true, hideCloseButton, disableEsc, width, height, customized, fixed, hideShadow, children, style, className, keepDOM, footerLeft, onClick, onVisibleChange, onClose, onOk, ...restProps } = props;
14
+ const midRef = useRef(`modal-${++midCounter}`);
15
+ const mid = midRef.current;
12
16
  const [show, setShow] = useState(visible);
13
17
  const [active, setActive] = useState(false);
14
18
  const [bounced, setBounced] = useState(false);
15
19
  const [mounted, setMounted] = useState(false);
20
+ const [top, setTop] = useState(false);
16
21
  const toggable = useRef(true);
17
- const handleShow = async () => {
22
+ const layerRef = useRef(null);
23
+ const handleShow = useCallback(() => {
18
24
  if (!toggable.current)
19
25
  return;
20
- (!keepDOM || !show) && setShow(true);
26
+ if (!keepDOM || !show)
27
+ setShow(true);
21
28
  toggable.current = false;
22
- const timer = setTimeout(() => {
29
+ updateVisible(mid, true);
30
+ const raf = requestAnimationFrame(() => {
31
+ if (!layerRef.current) {
32
+ requestAnimationFrame(() => {
33
+ setActive(true);
34
+ onVisibleChange?.(true);
35
+ toggable.current = true;
36
+ });
37
+ return;
38
+ }
23
39
  setActive(true);
24
40
  onVisibleChange?.(true);
25
41
  toggable.current = true;
26
- }, 64);
27
- return () => clearTimeout(timer);
28
- };
29
- const handleHide = () => {
42
+ });
43
+ return () => cancelAnimationFrame(raf);
44
+ }, [keepDOM, show, onVisibleChange]);
45
+ const handleHide = useCallback(() => {
30
46
  if (!toggable.current)
31
47
  return;
32
48
  toggable.current = false;
@@ -39,28 +55,53 @@ function Modal(props) {
39
55
  return () => clearTimeout(timer);
40
56
  }
41
57
  setActive(false);
58
+ updateVisible(mid, false);
42
59
  const timer = setTimeout(() => {
43
- !keepDOM && setShow(false);
60
+ if (!keepDOM)
61
+ setShow(false);
44
62
  toggable.current = true;
45
63
  onVisibleChange?.(false);
46
64
  onClose?.();
47
65
  }, 240);
48
66
  return () => clearTimeout(timer);
49
- };
67
+ }, [closable, keepDOM, onClose, onVisibleChange]);
50
68
  const handleBackdropClick = () => {
51
69
  backdropClosable && handleHide();
52
70
  };
53
- useKeydown((e) => {
54
- if (e.code !== "Escape" || !visible)
55
- return;
56
- handleHide();
57
- }, { disabled: disableEsc });
71
+ useEffect(() => {
72
+ const unsub = subscribe(() => {
73
+ setTop(isTop(mid));
74
+ });
75
+ return unsub;
76
+ }, []);
77
+ useEffect(() => {
78
+ const unregister = register({
79
+ mid,
80
+ visible: !!visible,
81
+ hideBackdrop: !!hideBackdrop,
82
+ closable: !!closable,
83
+ });
84
+ return unregister;
85
+ }, []);
58
86
  useEffect(() => {
59
87
  visible ? handleShow() : handleHide();
60
88
  }, [visible]);
89
+ useEffect(() => {
90
+ if (!show)
91
+ return;
92
+ const raf = requestAnimationFrame(() => {
93
+ setActive(top);
94
+ });
95
+ return () => cancelAnimationFrame(raf);
96
+ }, [top]);
61
97
  useEffect(() => {
62
98
  setMounted(true);
63
99
  }, []);
100
+ useKeydown((e) => {
101
+ if (e.code !== "Escape" || !visible || !top)
102
+ return;
103
+ handleHide();
104
+ }, { disabled: disableEsc });
64
105
  const handleClick = () => {
65
106
  if (typeof document === "undefined")
66
107
  return;
@@ -68,12 +109,12 @@ function Modal(props) {
68
109
  };
69
110
  if (!show || !mounted)
70
111
  return null;
71
- return createPortal(jsx("div", { className: classNames("i-modal-container", {
72
- "i-modal-backdrop": !hideBackdrop,
73
- "i-modal-customized": customized,
112
+ return createPortal(jsx("div", { ref: layerRef, className: classNames("i-modal-layer", {
74
113
  "i-modal-active": active,
114
+ "i-modal-customized": customized,
115
+ "i-modal-hide-backdrop": hideBackdrop,
75
116
  fixed,
76
- }, className), style: style, onClick: handleBackdropClick, "aria-modal": 'true', inert: !active, children: jsx("div", { className: classNames("i-modal", {
117
+ }, className), style: style, onClick: handleBackdropClick, children: jsx("div", { className: classNames("i-modal", {
77
118
  bounced,
78
119
  shadow: !hideShadow,
79
120
  }), style: {
@@ -83,7 +124,7 @@ function Modal(props) {
83
124
  e.stopPropagation();
84
125
  handleClick();
85
126
  onClick?.(e);
86
- }, role: 'dialog', "aria-labelledby": title ? "modal-title" : undefined, ...restProps, children: jsxs(ModalContext.Provider, { value: true, children: [customized && children, !customized && (jsx(Content, { title: title, hideCloseButton: hideCloseButton, footer: footer, okButtonProps: okButtonProps, cancelButtonProps: cancelButtonProps, children: children, footerLeft: footerLeft, onOk: onOk, onClose: handleHide }))] }) }) }), document?.body ?? null);
127
+ }, role: "dialog", "aria-modal": top, "data-mid": mid, ...restProps, children: jsxs(ModalContext.Provider, { value: true, children: [customized && children, !customized && (jsx(Content, { title: title, hideCloseButton: hideCloseButton, footer: footer, okButtonProps: okButtonProps, cancelButtonProps: cancelButtonProps, children: children, footerLeft: footerLeft, onOk: onOk, onClose: handleHide }))] }) }) }), getContainer());
87
128
  }
88
129
  Modal.useModal = useModal;
89
130
 
@@ -1 +1 @@
1
- {"version":3,"file":"modal.js","sources":["../../../../packages/components/modal/modal.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useEffect, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useKeydown } from \"../../js/hooks\";\nimport Content from \"./content\";\nimport ModalContext from \"./context\";\nimport \"./index.css\";\nimport { CompositionModal, IModal } from \"./type\";\nimport useModal from \"./useModal\";\n\nfunction Modal(props: IModal) {\n\tconst {\n\t\tvisible,\n\t\ttitle,\n\t\tfooter,\n\t\tokButtonProps,\n\t\tcancelButtonProps,\n\t\tclosable = true,\n\t\thideBackdrop,\n\t\tbackdropClosable = true,\n\t\thideCloseButton,\n\t\tdisableEsc,\n\t\twidth,\n\t\theight,\n\t\tcustomized,\n\t\tfixed,\n\t\thideShadow,\n\t\tchildren,\n\t\tstyle,\n\t\tclassName,\n\t\tkeepDOM,\n\t\tfooterLeft,\n\t\tonClick,\n\t\tonVisibleChange,\n\t\tonClose,\n\t\tonOk,\n\t\t...restProps\n\t} = props;\n\n\tconst [show, setShow] = useState(visible);\n\tconst [active, setActive] = useState(false);\n\tconst [bounced, setBounced] = useState(false);\n\tconst [mounted, setMounted] = useState(false);\n\tconst toggable = useRef(true);\n\n\tconst handleShow = async () => {\n\t\tif (!toggable.current) return;\n\n\t\t(!keepDOM || !show) && setShow(true);\n\t\ttoggable.current = false;\n\n\t\tconst timer = setTimeout(() => {\n\t\t\tsetActive(true);\n\t\t\tonVisibleChange?.(true);\n\t\t\ttoggable.current = true;\n\t\t}, 64);\n\n\t\treturn () => clearTimeout(timer);\n\t};\n\n\tconst handleHide = () => {\n\t\tif (!toggable.current) return;\n\t\ttoggable.current = false;\n\n\t\tif (!closable) {\n\t\t\tsetBounced(true);\n\t\t\tconst timer = setTimeout(() => {\n\t\t\t\tsetBounced(false);\n\t\t\t\ttoggable.current = true;\n\t\t\t}, 400);\n\t\t\treturn () => clearTimeout(timer);\n\t\t}\n\n\t\tsetActive(false);\n\t\tconst timer = setTimeout(() => {\n\t\t\t!keepDOM && setShow(false);\n\t\t\ttoggable.current = true;\n\t\t\tonVisibleChange?.(false);\n\t\t\tonClose?.();\n\t\t}, 240);\n\n\t\treturn () => clearTimeout(timer);\n\t};\n\n\tconst handleBackdropClick = () => {\n\t\tbackdropClosable && handleHide();\n\t};\n\n\tuseKeydown(\n\t\t(e) => {\n\t\t\tif (e.code !== \"Escape\" || !visible) return;\n\t\t\thandleHide();\n\t\t},\n\t\t{ disabled: disableEsc }\n\t);\n\n\tuseEffect(() => {\n\t\tvisible ? handleShow() : handleHide();\n\t}, [visible]);\n\n\tuseEffect(() => {\n\t\tsetMounted(true);\n\t}, []);\n\n\tconst handleClick = () => {\n\t\tif (typeof document === \"undefined\") return;\n\t\tdocument.documentElement.click();\n\t};\n\n\tif (!show || !mounted) return null;\n\n\treturn createPortal(\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-modal-container\",\n\t\t\t\t{\n\t\t\t\t\t\"i-modal-backdrop\": !hideBackdrop,\n\t\t\t\t\t\"i-modal-customized\": customized,\n\t\t\t\t\t\"i-modal-active\": active,\n\t\t\t\t\tfixed,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={style}\n\t\t\tonClick={handleBackdropClick}\n\t\t\taria-modal='true'\n\t\t\tinert={!active}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-modal\", {\n\t\t\t\t\tbounced,\n\t\t\t\t\tshadow: !hideShadow,\n\t\t\t\t})}\n\t\t\t\tstyle={{\n\t\t\t\t\twidth,\n\t\t\t\t\theight,\n\t\t\t\t}}\n\t\t\t\tonClick={(e) => {\n\t\t\t\t\te.stopPropagation();\n\t\t\t\t\thandleClick();\n\t\t\t\t\tonClick?.(e);\n\t\t\t\t}}\n\t\t\t\trole='dialog'\n\t\t\t\taria-labelledby={title ? \"modal-title\" : undefined}\n\t\t\t\t{...restProps}\n\t\t\t>\n\t\t\t\t<ModalContext.Provider value={true}>\n\t\t\t\t\t{customized && children}\n\n\t\t\t\t\t{!customized && (\n\t\t\t\t\t\t<Content\n\t\t\t\t\t\t\ttitle={title}\n\t\t\t\t\t\t\thideCloseButton={hideCloseButton}\n\t\t\t\t\t\t\tfooter={footer}\n\t\t\t\t\t\t\tokButtonProps={okButtonProps}\n\t\t\t\t\t\t\tcancelButtonProps={cancelButtonProps}\n\t\t\t\t\t\t\tchildren={children}\n\t\t\t\t\t\t\tfooterLeft={footerLeft}\n\t\t\t\t\t\t\tonOk={onOk}\n\t\t\t\t\t\t\tonClose={handleHide}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</ModalContext.Provider>\n\t\t\t</div>\n\t\t</div>,\n\t\tdocument?.body ?? null\n\t);\n}\n\nModal.useModal = useModal;\n\nexport default Modal as CompositionModal;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
1
+ {"version":3,"file":"modal.js","sources":["../../../../packages/components/modal/modal.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useKeydown } from \"../../js/hooks\";\nimport Content from \"./content\";\nimport ModalContext from \"./context\";\nimport \"./index.css\";\nimport {\n getContainer,\n isTop,\n register,\n subscribe,\n updateVisible,\n} from \"./modalManager\";\nimport { CompositionModal, IModal } from \"./type\";\nimport useModal from \"./useModal\";\n\nlet midCounter = 0;\n\nfunction Modal(props: IModal) {\n const {\n visible,\n title,\n footer,\n okButtonProps,\n cancelButtonProps,\n closable = true,\n hideBackdrop,\n backdropClosable = true,\n hideCloseButton,\n disableEsc,\n width,\n height,\n customized,\n fixed,\n hideShadow,\n children,\n style,\n className,\n keepDOM,\n footerLeft,\n onClick,\n onVisibleChange,\n onClose,\n onOk,\n ...restProps\n } = props;\n\n const midRef = useRef(`modal-${++midCounter}`);\n const mid = midRef.current;\n\n const [show, setShow] = useState(visible);\n const [active, setActive] = useState(false);\n const [bounced, setBounced] = useState(false);\n const [mounted, setMounted] = useState(false);\n const [top, setTop] = useState(false);\n const toggable = useRef(true);\n const layerRef = useRef(null);\n\n const handleShow = useCallback(() => {\n if (!toggable.current) return;\n\n if (!keepDOM || !show) setShow(true);\n toggable.current = false;\n\n updateVisible(mid, true);\n\n const raf = requestAnimationFrame(() => {\n if (!layerRef.current) {\n requestAnimationFrame(() => {\n setActive(true);\n onVisibleChange?.(true);\n toggable.current = true;\n });\n return;\n }\n setActive(true);\n onVisibleChange?.(true);\n toggable.current = true;\n });\n\n return () => cancelAnimationFrame(raf);\n }, [keepDOM, show, onVisibleChange]);\n\n const handleHide = useCallback(() => {\n if (!toggable.current) return;\n toggable.current = false;\n\n if (!closable) {\n setBounced(true);\n const timer = setTimeout(() => {\n setBounced(false);\n toggable.current = true;\n }, 400);\n return () => clearTimeout(timer);\n }\n\n setActive(false);\n updateVisible(mid, false);\n const timer = setTimeout(() => {\n if (!keepDOM) setShow(false);\n toggable.current = true;\n onVisibleChange?.(false);\n onClose?.();\n }, 240);\n\n return () => clearTimeout(timer);\n }, [closable, keepDOM, onClose, onVisibleChange]);\n\n const handleBackdropClick = () => {\n backdropClosable && handleHide();\n };\n\n useEffect(() => {\n const unsub = subscribe(() => {\n setTop(isTop(mid));\n });\n return unsub;\n }, []);\n\n useEffect(() => {\n const unregister = register({\n mid,\n visible: !!visible,\n hideBackdrop: !!hideBackdrop,\n closable: !!closable,\n });\n return unregister;\n }, []);\n\n useEffect(() => {\n visible ? handleShow() : handleHide();\n }, [visible]);\n\n useEffect(() => {\n if (!show) return;\n const raf = requestAnimationFrame(() => {\n setActive(top);\n });\n return () => cancelAnimationFrame(raf);\n }, [top]);\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n useKeydown(\n (e) => {\n if (e.code !== \"Escape\" || !visible || !top) return;\n handleHide();\n },\n { disabled: disableEsc },\n );\n\n const handleClick = () => {\n if (typeof document === \"undefined\") return;\n document.documentElement.click();\n };\n\n if (!show || !mounted) return null;\n\n return createPortal(\n <div\n ref={layerRef}\n className={classNames(\n \"i-modal-layer\",\n {\n \"i-modal-active\": active,\n \"i-modal-customized\": customized,\n \"i-modal-hide-backdrop\": hideBackdrop,\n fixed,\n },\n className,\n )}\n style={style}\n onClick={handleBackdropClick}\n >\n <div\n className={classNames(\"i-modal\", {\n bounced,\n shadow: !hideShadow,\n })}\n style={{\n width,\n height,\n }}\n onClick={(e) => {\n e.stopPropagation();\n handleClick();\n onClick?.(e);\n }}\n role=\"dialog\"\n aria-modal={top}\n data-mid={mid}\n {...restProps}\n >\n <ModalContext.Provider value={true}>\n {customized && children}\n\n {!customized && (\n <Content\n title={title}\n hideCloseButton={hideCloseButton}\n footer={footer}\n okButtonProps={okButtonProps}\n cancelButtonProps={cancelButtonProps}\n children={children}\n footerLeft={footerLeft}\n onOk={onOk}\n onClose={handleHide}\n />\n )}\n </ModalContext.Provider>\n </div>\n </div>,\n getContainer(),\n );\n}\n\nModal.useModal = useModal;\n\nexport default Modal as CompositionModal;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}