neko-ui 2.10.0 → 2.10.2

package/es/highlight-text/index.js

@@ -5,4 +5,4 @@ import{use as t}from"solid-js/web";import{template as e}from"solid-js/web";impor
     white-space: break-spaces;
     cursor: auto;
   }
-`;function b(t,e,i,r,l){let s=new RegExp(i,r).exec(l);if(s){let i;let r=new Range;i=0+s.index,t.firstChild&&(r.setStart(t.firstChild,i),i+=s[0].length,r.setEnd(t.firstChild,i));let l=CSS.highlights.get(e);l?l.add(r):CSS.highlights.set(e,new Highlight().add(r))}}function S(e){let f;let{baseStyle:x}=w,u=d(),C=a(()=>{var t;return`${e.text}${null!=(t=e.extra)?t:""}`});return g(()=>{if(f&&e.highlight){if(Array.isArray(e.highlight))for(let t=0,i=e.highlight.length;t<i;t++){let i=e.highlight[t],r="string"==typeof i,l=r?i:i.highlight;l.length&&b(f,u,l,r?e.flag:i.flag,C())}else e.highlight.length&&b(f,u,e.highlight,e.flag,C())}}),g(()=>{if(f&&"string"==typeof e.extra){var t;let i=new Range,r=(null==(t=e.text)?void 0:t.length)||0;f.firstChild&&(i.setStart(f.firstChild,r),r+=e.extra.length,i.setEnd(f.firstChild,r));let l=CSS.highlights.get(u);l?l.add(i):CSS.highlights.set(u,new Highlight().add(i))}}),[(()=>{let t=h(),e=t.firstChild;return r(()=>e.data=x()),t})(),(()=>{let t=o();return t.textContent=v,t})(),(()=>{let t=o();return t.textContent=`::highlight(${u}) {color: var(--primary-color, #5794ff);}`,t})(),l(m,{get when(){return e.css},get children(){return c(e.css)}}),(()=>{let l=n(),h=f;return"function"==typeof h?t(h,l):f=l,i(l,C),r(()=>s(l,p("text",e.class))),l})()]}x("n-highlight-text",{class:void 0,css:void 0,text:void 0,highlight:void 0,flag:void 0,extra:void 0,children:void 0},(t,e)=>{let i=e.element,r=f({text:i.textContent,css:i.css},t);return g(()=>{u(i,["css","text","highlight","extra"]),i.replaceChildren()}),[(()=>{let t=o();return t.textContent=C,t})(),l(S,r)]});export default S;
+`;function b(t,e,i,r,l){let s=new RegExp(i,r).exec(l);if(s){let i;let r=new Range;i=0+s.index,t.firstChild&&(r.setStart(t.firstChild,i),i+=s[0].length,r.setEnd(t.firstChild,i));let l=CSS.highlights.get(e);l?l.add(r):CSS.highlights.set(e,new Highlight().add(r))}}function S(e){let f;let{baseStyle:x}=w,u=d(),C=a(()=>{var t;return`${e.text}${null!=(t=e.extra)?t:""}`});return g(()=>{if(f&&e.highlight){if(Array.isArray(e.highlight))for(let t=0,i=e.highlight.length;t<i;t++){let i=e.highlight[t],r="string"==typeof i,l=r?i:i.highlight;l.length&&b(f,u,l,r?e.flag:i.flag,C())}else e.highlight.length&&b(f,u,e.highlight,e.flag,C())}}),g(()=>{if(f&&"string"==typeof e.extra){var t;let i=new Range,r=(null==(t=e.text)?void 0:t.length)||0;f.firstChild&&(i.setStart(f.firstChild,r),r+=e.extra.length,i.setEnd(f.firstChild,r));let l=CSS.highlights.get(u);l?l.add(i):CSS.highlights.set(u,new Highlight().add(i))}}),[(()=>{let t=h(),e=t.firstChild;return r(()=>e.data=x()),t})(),(()=>{let t=o();return t.textContent=v,t})(),(()=>{let t=o();return t.textContent=`::highlight(${u}) {color: var(--primary-color, #5794ff);}`,t})(),l(m,{get when(){return e.css},get children(){let t=h(),i=t.firstChild;return r(()=>i.data=c(e.css)),t}}),(()=>{let l=n(),h=f;return"function"==typeof h?t(h,l):f=l,i(l,C),r(()=>s(l,p("text",e.class))),l})()]}x("n-highlight-text",{class:void 0,css:void 0,text:void 0,highlight:void 0,flag:void 0,extra:void 0,children:void 0},(t,e)=>{let i=e.element,r=f({text:i.textContent,css:i.css},t);return g(()=>{u(i,["css","text","highlight","extra"]),i.replaceChildren()}),[(()=>{let t=o();return t.textContent=C,t})(),l(S,r)]});export default S;

package/es/highlight-text/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/highlight-text/index.tsx"],"sourcesContent":["import { createEffect, createMemo, createUniqueId, mergeProps, Show } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { inline } from '../theme';\n\nconst style = css`\n  .text {\n    word-break: break-word;\n    word-wrap: break-word;\n    white-space: break-spaces;\n    cursor: auto;\n  }\n`;\n\nfunction highlight(\n  box: HTMLDivElement,\n  id: string,\n  regExp: string,\n  flag: HighlightRule['flag'],\n  text: string,\n) {\n  const regex = new RegExp(regExp, flag);\n  const match = regex.exec(text);\n\n  if (match) {\n    const range = new Range();\n    let pos = 0;\n\n    pos += match.index;\n    if (box.firstChild) {\n      range.setStart(box.firstChild, pos);\n      pos += match[0].length;\n      range.setEnd(box.firstChild, pos);\n    }\n    const highlight = CSS.highlights.get(id);\n\n    if (highlight) {\n      highlight.add(range);\n    } else {\n      CSS.highlights.set(id, new Highlight().add(range));\n    }\n  }\n}\n\nexport type HighlightTextJson =\n  | {\n      highlight?: boolean;\n      text: string;\n    }[]\n  | null;\nexport interface HighlightTextProps {\n  /** 自定义样式表 */\n  css?: string;\n  /** 自定义类名 */\n  class?: string;\n  /** 内容 */\n  text?: string;\n  /** 需要高亮的内容 */\n  highlight?: string | (HighlightRule | string)[];\n  /** RegExp flag */\n  flag?: HighlightRule['flag'];\n  /** 额外需要高亮的内容 */\n  extra?: string;\n  children?: string;\n}\n\ninterface HighlightRule {\n  /** 需要高亮的内容 */\n  highlight: string;\n  /** RegExp flag */\n  flag?: 'g' | 'i' | 'm' | 'u' | 'y';\n}\n\nexport interface Highlight {\n  /** 命中高亮 */\n  hit?: boolean;\n  /** 内容 */\n  text: string;\n}\n\nfunction HighlightText(props: HighlightTextProps) {\n  const { baseStyle } = theme;\n  let box: HTMLDivElement | undefined;\n  const id = createUniqueId();\n  const text = createMemo(() => `${props.text}${props.extra ?? ''}`);\n\n  createEffect(() => {\n    if (box && props.highlight) {\n      if (Array.isArray(props.highlight)) {\n        for (let i = 0, len = props.highlight.length; i < len; i++) {\n          const item = props.highlight[i];\n          const isOne = typeof item === 'string';\n          const hitStr = isOne ? item : item.highlight;\n\n          if (hitStr.length) {\n            highlight(box, id, hitStr, isOne ? props.flag : item.flag, text());\n          }\n        }\n      } else if (props.highlight.length) {\n        highlight(box, id, props.highlight, props.flag, text());\n      }\n    }\n  });\n  createEffect(() => {\n    if (box && typeof props.extra === 'string') {\n      const range = new Range();\n      let pos = props.text?.length || 0;\n\n      if (box.firstChild) {\n        range.setStart(box.firstChild, pos);\n        pos += props.extra.length;\n        range.setEnd(box.firstChild, pos);\n      }\n      const highlight = CSS.highlights.get(id);\n\n      if (highlight) {\n        highlight.add(range);\n      } else {\n        CSS.highlights.set(id, new Highlight().add(range));\n      }\n    }\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <style textContent={`::highlight(${id}) {color: var(--primary-color, #5794ff);}`} />\n      <Show when={props.css}>{css(props.css)}</Show>\n      <div ref={box} class={cx('text', props.class)}>\n        {text()}\n      </div>\n    </>\n  );\n}\n\nexport type HighlightTextElement = CustomElement<HighlightTextProps>;\ncustomElement<HighlightTextProps>(\n  'n-highlight-text',\n  {\n    class: void 0,\n    css: void 0,\n    text: void 0,\n    highlight: void 0,\n    flag: void 0,\n    extra: void 0,\n    children: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        text: el.textContent,\n        css: el.css,\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css', 'text', 'highlight', 'extra']);\n      el.replaceChildren();\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <HighlightText {...props} />\n      </>\n    );\n  },\n);\nexport default HighlightText;\n"],"names":["createEffect","createMemo","createUniqueId","mergeProps","Show","css","cx","customElement","clearAttribute","theme","inline","style","highlight","box","id","regExp","flag","text","match","regex","RegExp","exec","pos","range","Range","index","firstChild","setStart","length","setEnd","CSS","highlights","get","add","set","Highlight","HighlightText","props","baseStyle","extra","Array","isArray","i","len","item","isOne","hitStr","class","children","_","opt","el","element","textContent","replaceChildren"],"mappings":"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"}
+{"version":3,"sources":["components/highlight-text/index.tsx"],"sourcesContent":["import { createEffect, createMemo, createUniqueId, mergeProps, Show } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { inline } from '../theme';\n\nconst style = css`\n  .text {\n    word-break: break-word;\n    word-wrap: break-word;\n    white-space: break-spaces;\n    cursor: auto;\n  }\n`;\n\nfunction highlight(\n  box: HTMLDivElement,\n  id: string,\n  regExp: string,\n  flag: HighlightRule['flag'],\n  text: string,\n) {\n  const regex = new RegExp(regExp, flag);\n  const match = regex.exec(text);\n\n  if (match) {\n    const range = new Range();\n    let pos = 0;\n\n    pos += match.index;\n    if (box.firstChild) {\n      range.setStart(box.firstChild, pos);\n      pos += match[0].length;\n      range.setEnd(box.firstChild, pos);\n    }\n    const highlight = CSS.highlights.get(id);\n\n    if (highlight) {\n      highlight.add(range);\n    } else {\n      CSS.highlights.set(id, new Highlight().add(range));\n    }\n  }\n}\n\nexport type HighlightTextJson =\n  | {\n      highlight?: boolean;\n      text: string;\n    }[]\n  | null;\nexport interface HighlightTextProps {\n  /** 自定义样式表 */\n  css?: string;\n  /** 自定义类名 */\n  class?: string;\n  /** 内容 */\n  text?: string;\n  /** 需要高亮的内容 */\n  highlight?: string | (HighlightRule | string)[];\n  /** RegExp flag */\n  flag?: HighlightRule['flag'];\n  /** 额外需要高亮的内容 */\n  extra?: string;\n  children?: string;\n}\n\ninterface HighlightRule {\n  /** 需要高亮的内容 */\n  highlight: string;\n  /** RegExp flag */\n  flag?: 'g' | 'i' | 'm' | 'u' | 'y';\n}\n\nexport interface Highlight {\n  /** 命中高亮 */\n  hit?: boolean;\n  /** 内容 */\n  text: string;\n}\n\nfunction HighlightText(props: HighlightTextProps) {\n  const { baseStyle } = theme;\n  let box: HTMLDivElement | undefined;\n  const id = createUniqueId();\n  const text = createMemo(() => `${props.text}${props.extra ?? ''}`);\n\n  createEffect(() => {\n    if (box && props.highlight) {\n      if (Array.isArray(props.highlight)) {\n        for (let i = 0, len = props.highlight.length; i < len; i++) {\n          const item = props.highlight[i];\n          const isOne = typeof item === 'string';\n          const hitStr = isOne ? item : item.highlight;\n\n          if (hitStr.length) {\n            highlight(box, id, hitStr, isOne ? props.flag : item.flag, text());\n          }\n        }\n      } else if (props.highlight.length) {\n        highlight(box, id, props.highlight, props.flag, text());\n      }\n    }\n  });\n  createEffect(() => {\n    if (box && typeof props.extra === 'string') {\n      const range = new Range();\n      let pos = props.text?.length || 0;\n\n      if (box.firstChild) {\n        range.setStart(box.firstChild, pos);\n        pos += props.extra.length;\n        range.setEnd(box.firstChild, pos);\n      }\n      const highlight = CSS.highlights.get(id);\n\n      if (highlight) {\n        highlight.add(range);\n      } else {\n        CSS.highlights.set(id, new Highlight().add(range));\n      }\n    }\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <style textContent={`::highlight(${id}) {color: var(--primary-color, #5794ff);}`} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <div ref={box} class={cx('text', props.class)}>\n        {text()}\n      </div>\n    </>\n  );\n}\n\nexport type HighlightTextElement = CustomElement<HighlightTextProps>;\ncustomElement<HighlightTextProps>(\n  'n-highlight-text',\n  {\n    class: void 0,\n    css: void 0,\n    text: void 0,\n    highlight: void 0,\n    flag: void 0,\n    extra: void 0,\n    children: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        text: el.textContent,\n        css: el.css,\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css', 'text', 'highlight', 'extra']);\n      el.replaceChildren();\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <HighlightText {...props} />\n      </>\n    );\n  },\n);\nexport default HighlightText;\n"],"names":["createEffect","createMemo","createUniqueId","mergeProps","Show","css","cx","customElement","clearAttribute","theme","inline","style","highlight","box","id","regExp","flag","text","match","regex","RegExp","exec","pos","range","Range","index","firstChild","setStart","length","setEnd","CSS","highlights","get","add","set","Highlight","HighlightText","props","baseStyle","extra","Array","isArray","i","len","item","isOne","hitStr","class","children","_","opt","el","element","textContent","replaceChildren"],"mappings":"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"}

package/es/modal/index.js

@@ -1 +1 @@
-var e;function t(e,t,o,n,r,l,s){try{var i=e[l](s),c=i.value}catch(e){o(e);return}i.done?t(c):Promise.resolve(c).then(n,r)}function o(e){return function(){var o=this,n=arguments;return new Promise(function(r,l){var s=e.apply(o,n);function i(e){t(s,r,l,i,c,"next",e)}function c(e){t(s,r,l,i,c,"throw",e)}i(void 0)})}}function n(){return(n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e}).apply(this,arguments)}import{use as r}from"solid-js/web";import{template as l}from"solid-js/web";import{spread as s}from"solid-js/web";import{mergeProps as i}from"solid-js/web";import{memo as c}from"solid-js/web";import{insert as a}from"solid-js/web";import{getOwner as d}from"solid-js/web";import{effect as m}from"solid-js/web";import{delegateEvents as p}from"solid-js/web";import{createComponent as u}from"solid-js/web";import{addEventListener as v}from"solid-js/web";let f=l('<span class="modal-close">'),g=l('<n-button class="modal-close">',!0,!1),y=l("<style> "),h=l("<style>"),b=l(`<n-button class="modal-close">⛌`,!0,!1),w=l("<n-button>",!0,!1),k=l('<n-button type="primary">',!0,!1),x=l('<div class="modal-footer">'),$=l('<div class="portal"><div class="modal-content"><div class="modal-header"><strong class="modal-title"></strong></div><div class="modal-body">');import{createEffect as C,createMemo as _,createSignal as j,mergeProps as E,onCleanup as L,onMount as O,Show as P,untrack as T}from"solid-js";import{Portal as I}from"solid-js/web";import S from"@moneko/common/lib/isFunction";import B from"@moneko/common/lib/passiveSupported";import{customElement as X}from"solid-element";import{clearAttribute as Y}from"../basic-config";import D from"./hooks";import{defaultPosi as F}from"./posi";import H from"./store";import{style as W}from"./style";export var OpenState;function q(e){let t,l;let p=document.documentElement,{setNum:X}=H,Y=E({okText:"确认",cancelText:"取消"},e),[D,q]=j(!1),[z,A]=j(!1),[G,J]=j("closed"),[K,M]=j(F),N=[0,0],Q=_(()=>{let{x:e,y:t,width:o,height:n}=K();return`.portal { --y: ${-(t-n/2)}px;--x: ${-(e-o/2)}px; --movement-x: ${N[0]}px; --movement-y: ${N[1]}px;}`});function R(e){return U.apply(this,arguments)}function U(){return(U=o(function*(e){if(A(!1),"closeing"===e&&(l.style.removeProperty("--x"),l.style.removeProperty("--y"),S(Y.onCancel)&&(A(!0),!(yield Y.onCancel())))){A(!1);return}J(e),null==Y.onOpenChange||Y.onOpenChange.call(Y,e)})).apply(this,arguments)}function V(e){e.preventDefault()}function Z(e){V(e),"keydown"===e.type?Y.escClosable&&"Escape"===e.key&&R("closeing"):R("closeing")}function ee(){"closeing"===G()&&R("closed")}function et(e){return eo.apply(this,arguments)}function eo(){return(eo=o(function*(e){if(V(e),S(Y.onOk)&&(A(!0),!(yield Y.onOk(e)))){A(!1);return}J("closeing"),null==Y.onOpenChange||Y.onOpenChange.call(Y,"closeing")})).apply(this,arguments)}function en(e){V(e),Y.maskClosable&&e.target===t&&R("closeing")}function er(e){M(t=>n({},t,{x:p.clientWidth/2-e.clientX,y:p.clientHeight/2-e.clientY}))}C(()=>{void 0!==Y.open&&Y.open!==T(G)&&J(Y.open)}),C(()=>{"open"===G()?(X(e=>e+1),p.addEventListener("mousewheel",V,{passive:!1}),Y.escClosable&&p.addEventListener("keydown",Z,!1)):"closeing"===G()?X(e=>e-1):p.addEventListener("click",er,!0),L(()=>{p.removeEventListener("mousewheel",V,!1),p.removeEventListener("keydown",Z,!1),p.removeEventListener("click",er,!0)})});let el=_(()=>null===Y.closeIcon||!1===Y.closeIcon?null:["function","object"].includes(typeof Y.closeIcon)?()=>(()=>{let e=f();return a(e,(()=>{let e=c(()=>!!S(Y.closeIcon));return()=>e()?Y.closeIcon():Y.closeIcon})()),e})():()=>(()=>{let e=g();return v(e,"click",Z,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=d(),a(e,()=>Y.closeIcon),e})());function es(e){l&&(N[0]=N[0]+e.movementX,N[1]=N[1]+e.movementY,t.style.setProperty("--movement-x",`${N[0]}px`),t.style.setProperty("--movement-y",`${N[1]}px`),l.style.setProperty("--x",`${N[0]}px`),l.style.setProperty("--y",`${N[1]}px`))}function ei(e){q(e.target===l)}function ec(){q(!1)}C(()=>{D()&&document.body.addEventListener("mousemove",es,{passive:B}),L(()=>{document.body.removeEventListener("mousemove",es,!1)})}),O(()=>{document.body.addEventListener("mouseup",ec,{passive:B})}),L(()=>{document.body.removeEventListener("mouseup",ec,!1)});let ea=_(()=>S(Y.title)?Y.title():Y.title),ed=_(()=>S(Y.content)?Y.content():Y.content);return u(P,{get when(){return"closed"!==G()},get children(){return u(I,{useShadow:!0,get children(){return[(()=>{let e=y(),t=e.firstChild;return m(()=>t.data=Q()),e})(),(()=>{let e=h();return e.textContent=W,e})(),(()=>{let e=$(),o=t,n=e.firstChild,c=l,p=n.firstChild,f=p.firstChild,g=p.nextSibling;return v(e,"click",en,!0),v(e,"animationend",ee),"function"==typeof o?r(o,e):t=e,v(n,"mousedown",ei,!0),"function"==typeof c?r(c,n):l=n,a(f,ea),a(n,u(P,{get when(){return void 0===Y.closeIcon},get fallback(){return el()},get children(){let e=b();return v(e,"click",Z,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=d(),e}}),g),a(g,ed),a(n,u(P,{get when(){return Y.cancelText||Y.okText},get children(){let e=x();return a(e,u(P,{get when(){return Y.cancelText},get children(){let e=w();return s(e,i(()=>Y.cancelProps,{onClick:Z}),!1,!0),e._$owner=d(),a(e,()=>Y.cancelText),e}}),null),a(e,u(P,{get when(){return Y.okText},get children(){let e=k();return e.fill=!0,s(e,i(()=>Y.okProps,{get loading(){return z()},onClick:et}),!1,!0),e._$owner=d(),a(e,()=>Y.okText),e}}),null),e}}),null),m(t=>{let o=!("open"!==G()),r="open"!==G(),l=!!Y.maskBlur,s=!!Y.centered,i=!!D();return o!==t._v$&&e.classList.toggle("open",t._v$=o),r!==t._v$2&&e.classList.toggle("closeing",t._v$2=r),l!==t._v$3&&e.classList.toggle("mask-blur",t._v$3=l),s!==t._v$4&&n.classList.toggle("centered",t._v$4=s),i!==t._v$5&&n.classList.toggle("moveing",t._v$5=i),t},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0}),e})()]}})}})}(e=OpenState||(OpenState={})).closed="closed",e.closeing="closeing",e.open="open",X("n-modal",{open:"closed",maskClosable:!0,escClosable:!0,onOpenChange:void 0,closeIcon:void 0,content:void 0,title:void 0,maskBlur:void 0,okText:void 0,cancelText:void 0,okProps:void 0,cancelProps:void 0,centered:void 0},(e,t)=>{let o=t.element,n=E({onOpenChange(e){t.element.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return C(()=>{Y(o,["content"])}),u(q,n)}),q.open=D;export default q;p(["click","mousedown"]);
+var e;function t(e,t,o,n,r,l,s){try{var i=e[l](s),c=i.value}catch(e){o(e);return}i.done?t(c):Promise.resolve(c).then(n,r)}function o(e){return function(){var o=this,n=arguments;return new Promise(function(r,l){var s=e.apply(o,n);function i(e){t(s,r,l,i,c,"next",e)}function c(e){t(s,r,l,i,c,"throw",e)}i(void 0)})}}function n(){return(n=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e}).apply(this,arguments)}import{use as r}from"solid-js/web";import{template as l}from"solid-js/web";import{spread as s}from"solid-js/web";import{mergeProps as i}from"solid-js/web";import{memo as c}from"solid-js/web";import{insert as a}from"solid-js/web";import{getOwner as d}from"solid-js/web";import{effect as m}from"solid-js/web";import{delegateEvents as p}from"solid-js/web";import{createComponent as u}from"solid-js/web";import{addEventListener as v}from"solid-js/web";let f=l('<span class="modal-close">'),g=l('<n-button class="modal-close">',!0,!1),y=l("<style> "),h=l("<style>"),b=l(`<n-button class="modal-close">⛌`,!0,!1),w=l("<n-button>",!0,!1),k=l('<n-button type="primary">',!0,!1),x=l('<div class="modal-footer">'),$=l('<div class="portal"><div class="modal-content"><div class="modal-header"><strong class="modal-title"></strong></div><div class="modal-body">');import{createEffect as C,createMemo as _,createSignal as j,mergeProps as E,onCleanup as L,onMount as O,Show as P,untrack as T}from"solid-js";import{Portal as I}from"solid-js/web";import S from"@moneko/common/lib/isFunction";import B from"@moneko/common/lib/passiveSupported";import{customElement as X}from"solid-element";import{clearAttribute as Y}from"../basic-config";import D from"./hooks";import{defaultPosi as F}from"./posi";import H from"./store";import{style as W}from"./style";export var OpenState;function q(e){let t,l;let p=document.documentElement,{setNum:X}=H,Y=E({okText:"确认",cancelText:"取消"},e),[D,q]=j(!1),[z,A]=j(!1),[G,J]=j("closed"),[K,M]=j(F),N=[0,0],Q=_(()=>{let{x:e,y:t,width:o,height:n}=K();return`.portal { --y: ${-(t-n/2)}px;--x: ${-(e-o/2)}px; --movement-x: ${N[0]}px; --movement-y: ${N[1]}px;}`});function R(e){return U.apply(this,arguments)}function U(){return(U=o(function*(e){if(A(!1),"closeing"===e&&(l.style.removeProperty("--x"),l.style.removeProperty("--y"),S(Y.onCancel)&&(A(!0),!(yield Y.onCancel())))){A(!1);return}J(e),null==Y.onOpenChange||Y.onOpenChange.call(Y,e)})).apply(this,arguments)}function V(e){e.preventDefault()}function Z(e){V(e),"keydown"===e.type?Y.escClosable&&"Escape"===e.key&&R("closeing"):R("closeing")}function ee(){"closeing"===G()&&R("closed")}function et(e){return eo.apply(this,arguments)}function eo(){return(eo=o(function*(e){if(V(e),S(Y.onOk)&&(A(!0),!(yield Y.onOk(e)))){A(!1);return}J("closeing"),null==Y.onOpenChange||Y.onOpenChange.call(Y,"closeing")})).apply(this,arguments)}function en(e){V(e),Y.maskClosable&&e.target===t&&R("closeing")}function er(e){M(t=>n({},t,{x:p.clientWidth/2-e.clientX,y:p.clientHeight/2-e.clientY}))}C(()=>{void 0!==Y.open&&Y.open!==T(G)&&J(Y.open)}),C(()=>{"open"===G()?(X(e=>e+1),p.addEventListener("mousewheel",V,{passive:B}),Y.escClosable&&p.addEventListener("keydown",Z,!1)):"closeing"===G()?X(e=>e-1):p.addEventListener("click",er,!0),L(()=>{p.removeEventListener("mousewheel",V,!1),p.removeEventListener("keydown",Z,!1),p.removeEventListener("click",er,!0)})});let el=_(()=>null===Y.closeIcon||!1===Y.closeIcon?null:["function","object"].includes(typeof Y.closeIcon)?()=>(()=>{let e=f();return a(e,(()=>{let e=c(()=>!!S(Y.closeIcon));return()=>e()?Y.closeIcon():Y.closeIcon})()),e})():()=>(()=>{let e=g();return v(e,"click",Z,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=d(),a(e,()=>Y.closeIcon),e})());function es(e){l&&(N[0]=N[0]+e.movementX,N[1]=N[1]+e.movementY,t.style.setProperty("--movement-x",`${N[0]}px`),t.style.setProperty("--movement-y",`${N[1]}px`),l.style.setProperty("--x",`${N[0]}px`),l.style.setProperty("--y",`${N[1]}px`))}function ei(e){q(e.target===l)}function ec(){q(!1)}C(()=>{D()&&document.body.addEventListener("mousemove",es,{passive:B}),L(()=>{document.body.removeEventListener("mousemove",es,!1)})}),O(()=>{document.body.addEventListener("mouseup",ec,{passive:B})}),L(()=>{document.body.removeEventListener("mouseup",ec,!1)});let ea=_(()=>S(Y.title)?Y.title():Y.title),ed=_(()=>S(Y.content)?Y.content():Y.content);return u(P,{get when(){return"closed"!==G()},get children(){return u(I,{useShadow:!0,get children(){return[(()=>{let e=y(),t=e.firstChild;return m(()=>t.data=Q()),e})(),(()=>{let e=h();return e.textContent=W,e})(),(()=>{let e=$(),o=t,n=e.firstChild,c=l,p=n.firstChild,f=p.firstChild,g=p.nextSibling;return v(e,"click",en,!0),v(e,"animationend",ee),"function"==typeof o?r(o,e):t=e,v(n,"mousedown",ei,!0),"function"==typeof c?r(c,n):l=n,a(f,ea),a(n,u(P,{get when(){return void 0===Y.closeIcon},get fallback(){return el()},get children(){let e=b();return v(e,"click",Z,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=d(),e}}),g),a(g,ed),a(n,u(P,{get when(){return Y.cancelText||Y.okText},get children(){let e=x();return a(e,u(P,{get when(){return Y.cancelText},get children(){let e=w();return s(e,i(()=>Y.cancelProps,{onClick:Z}),!1,!0),e._$owner=d(),a(e,()=>Y.cancelText),e}}),null),a(e,u(P,{get when(){return Y.okText},get children(){let e=k();return e.fill=!0,s(e,i(()=>Y.okProps,{get loading(){return z()},onClick:et}),!1,!0),e._$owner=d(),a(e,()=>Y.okText),e}}),null),e}}),null),m(t=>{let o=!("open"!==G()),r="open"!==G(),l=!!Y.maskBlur,s=!!Y.centered,i=!!D();return o!==t._v$&&e.classList.toggle("open",t._v$=o),r!==t._v$2&&e.classList.toggle("closeing",t._v$2=r),l!==t._v$3&&e.classList.toggle("mask-blur",t._v$3=l),s!==t._v$4&&n.classList.toggle("centered",t._v$4=s),i!==t._v$5&&n.classList.toggle("moveing",t._v$5=i),t},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0}),e})()]}})}})}(e=OpenState||(OpenState={})).closed="closed",e.closeing="closeing",e.open="open",X("n-modal",{open:"closed",maskClosable:!0,escClosable:!0,onOpenChange:void 0,closeIcon:void 0,content:void 0,title:void 0,maskBlur:void 0,okText:void 0,cancelText:void 0,okProps:void 0,cancelProps:void 0,centered:void 0},(e,t)=>{let o=t.element,n=E({onOpenChange(e){t.element.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return C(()=>{Y(o,["content"])}),u(q,n)}),q.open=D;export default q;p(["click","mousedown"]);

package/es/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/modal/index.tsx"],"sourcesContent":["import {\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  onMount,\n  Show,\n  untrack,\n} from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { isFunction, passiveSupported } from '@moneko/common';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport type { ButtonProps } from '../button';\n\nimport open from './hooks';\nimport { defaultPosi } from './posi';\nimport modalStore from './store';\nimport { style } from './style';\n\n/**\n * API\n * @since 2.6.0\n */\nexport interface ModalProps {\n  /** 是否打开模态框 */\n  open?: OpenStateKey;\n  /** 开启关闭的回调函数 */\n  onOpenChange?: (open: OpenStateKey) => void;\n  /** 点击遮罩关闭\n   * @default true\n   */\n  maskClosable?: boolean;\n  /** 通过 `esc` 按键关闭\n   * @default true\n   */\n  escClosable?: boolean;\n  /**\n   * 自定义关闭图标, 设置为 null 或 false 时隐藏关闭按钮\n   */\n  closeIcon?: JSXElement | (() => JSXElement);\n  /** 内容 */\n  content?: JSXElement | (() => JSXElement);\n  /** 标题 */\n  title?: JSXElement | (() => JSXElement);\n  /** 遮罩模糊\n   * @default false\n   */\n  maskBlur?: boolean;\n  okText?: string | false | null;\n  cancelText?: string | false | null;\n  onCancel?(): Promise<boolean> | boolean;\n  onOk?(e: MouseEvent | Event): Promise<boolean> | boolean;\n  okProps?: Omit<ButtonProps, 'children' | 'onClick' | 'loading'>;\n  cancelProps?: Omit<ButtonProps, 'children' | 'onClick'>;\n  centered?: boolean;\n}\n\n/**\n * OpenStateKey\n */\nexport enum OpenState {\n  /** 完全关闭 */\n  closed = 'closed',\n  /** 正在关闭 */\n  closeing = 'closeing',\n  /** 打开 */\n  open = 'open',\n}\nexport type OpenStateKey = keyof typeof OpenState;\nexport type ModalElement = CustomElement<ModalProps, 'onOpenChange'>;\n\nfunction Modal(_: ModalProps) {\n  const doc = document.documentElement;\n  const { setNum } = modalStore;\n  const props = mergeProps(\n    {\n      okText: '确认',\n      cancelText: '取消',\n    },\n    _,\n  );\n  const [moveing, setMoveing] = createSignal(false);\n  const [loading, setLoading] = createSignal(false);\n  const [open, setOpen] = createSignal<OpenStateKey>('closed');\n  const [posi, setPosi] = createSignal(defaultPosi);\n  const movement = [0, 0];\n  let portal: HTMLDivElement | undefined;\n  let modal: HTMLDivElement | undefined;\n\n  const getCss = createMemo(() => {\n    const { x, y, width, height } = posi();\n\n    return `.portal { --y: ${-(y - height / 2)}px;--x: ${-(x - width / 2)}px; --movement-x: ${\n      movement[0]\n    }px; --movement-y: ${movement[1]}px;}`;\n  });\n\n  async function openChange(visi: OpenStateKey) {\n    setLoading(false);\n    if (visi === OpenState.closeing) {\n      modal!.style.removeProperty('--x');\n      modal!.style.removeProperty('--y');\n      if (isFunction(props.onCancel)) {\n        setLoading(true);\n        if (!(await props.onCancel())) {\n          setLoading(false);\n          return;\n        }\n      }\n    }\n    setOpen(visi);\n    props.onOpenChange?.(visi);\n  }\n  function preventDefault(e: Event) {\n    e.preventDefault();\n  }\n  function close(e: KeyboardEvent | Event) {\n    preventDefault(e);\n    if (e.type === 'keydown') {\n      if (props.escClosable && (e as KeyboardEvent).key === 'Escape') {\n        openChange(OpenState.closeing);\n      }\n    } else {\n      openChange(OpenState.closeing);\n    }\n  }\n  function handleDestroy() {\n    if (open() === OpenState.closeing) {\n      openChange(OpenState.closed);\n    }\n  }\n  async function handleOk(e: MouseEvent | Event) {\n    preventDefault(e);\n    if (isFunction(props.onOk)) {\n      setLoading(true);\n      if (!(await props.onOk(e))) {\n        setLoading(false);\n        return;\n      }\n    }\n\n    setOpen(OpenState.closeing);\n    props.onOpenChange?.(OpenState.closeing);\n  }\n  function portalClick(e: Event) {\n    preventDefault(e);\n    if (props.maskClosable && e.target === portal) {\n      openChange(OpenState.closeing);\n    }\n  }\n\n  createEffect(() => {\n    if (props.open !== void 0 && props.open !== untrack(open)) {\n      setOpen(props.open);\n    }\n  });\n\n  function point(e: MouseEvent) {\n    setPosi((prev) => ({\n      ...prev,\n      x: doc.clientWidth / 2 - e.clientX,\n      y: doc.clientHeight / 2 - e.clientY,\n    }));\n  }\n  createEffect(() => {\n    if (open() === OpenState.open) {\n      setNum((prev) => prev + 1);\n      doc.addEventListener('mousewheel', preventDefault, {\n        passive: false,\n      });\n\n      if (props.escClosable) {\n        doc.addEventListener('keydown', close, false);\n      }\n    } else if (open() === OpenState.closeing) {\n      setNum((prev) => prev - 1);\n    } else {\n      doc.addEventListener('click', point, true);\n    }\n\n    onCleanup(() => {\n      doc.removeEventListener('mousewheel', preventDefault, false);\n      doc.removeEventListener('keydown', close, false);\n      doc.removeEventListener('click', point, true);\n    });\n  });\n  const closeIcon = createMemo(() => {\n    if (props.closeIcon === null || props.closeIcon === false) {\n      return null;\n    }\n    if (['function', 'object'].includes(typeof props.closeIcon)) {\n      return () => (\n        <span class=\"modal-close\">\n          {isFunction(props.closeIcon) ? props.closeIcon() : props.closeIcon}\n        </span>\n      );\n    }\n    return () => (\n      <n-button class=\"modal-close\" danger={true} circle={true} flat={true} onClick={close}>\n        {props.closeIcon}\n      </n-button>\n    );\n  });\n\n  function move(ev: MouseEvent) {\n    if (modal) {\n      movement[0] = movement[0] + ev.movementX;\n      movement[1] = movement[1] + ev.movementY;\n\n      portal!.style.setProperty('--movement-x', `${movement[0]}px`);\n      portal!.style.setProperty('--movement-y', `${movement[1]}px`);\n      modal!.style.setProperty('--x', `${movement[0]}px`);\n      modal!.style.setProperty('--y', `${movement[1]}px`);\n    }\n  }\n\n  function mouseDown(e: MouseEvent) {\n    setMoveing(e.target === modal);\n  }\n  function mouseUp() {\n    setMoveing(false);\n  }\n  createEffect(() => {\n    if (moveing()) {\n      document.body.addEventListener('mousemove', move, {\n        passive: passiveSupported,\n      });\n    }\n    onCleanup(() => {\n      document.body.removeEventListener('mousemove', move, false);\n    });\n  });\n\n  onMount(() => {\n    document.body.addEventListener('mouseup', mouseUp, {\n      passive: passiveSupported,\n    });\n  });\n  onCleanup(() => {\n    document.body.removeEventListener('mouseup', mouseUp, false);\n  });\n  const title = createMemo(() => (isFunction(props.title) ? props.title() : props.title));\n  const content = createMemo(() => (isFunction(props.content) ? props.content() : props.content));\n\n  return (\n    <Show when={open() !== OpenState.closed}>\n      <Portal useShadow={true}>\n        <style textContent={getCss()} />\n        <style textContent={style} />\n        <div\n          ref={portal}\n          class=\"portal\"\n          classList={{\n            open: open() === OpenState.open,\n            closeing: open() !== OpenState.open,\n            'mask-blur': props.maskBlur,\n          }}\n          onAnimationEnd={handleDestroy}\n          onClick={portalClick}\n        >\n          <div\n            ref={modal}\n            classList={{\n              'modal-content': true,\n              centered: props.centered,\n              moveing: moveing(),\n            }}\n            onMouseDown={mouseDown}\n          >\n            <div class=\"modal-header\">\n              <strong class=\"modal-title\">{title()}</strong>\n            </div>\n            <Show when={props.closeIcon === void 0} fallback={closeIcon() as JSXElement}>\n              <n-button class=\"modal-close\" danger={true} circle={true} flat={true} onClick={close}>\n                ⛌\n              </n-button>\n            </Show>\n            <div class=\"modal-body\">{content()}</div>\n            <Show when={props.cancelText || props.okText}>\n              <div class=\"modal-footer\">\n                <Show when={props.cancelText}>\n                  <n-button {...props.cancelProps} onClick={close}>\n                    {props.cancelText}\n                  </n-button>\n                </Show>\n                <Show when={props.okText}>\n                  <n-button\n                    type=\"primary\"\n                    fill={true}\n                    {...props.okProps}\n                    loading={loading()}\n                    onClick={handleOk}\n                  >\n                    {props.okText}\n                  </n-button>\n                </Show>\n              </div>\n            </Show>\n          </div>\n        </div>\n      </Portal>\n    </Show>\n  );\n}\n\ncustomElement<ModalProps>(\n  'n-modal',\n  {\n    open: 'closed' as OpenStateKey,\n    maskClosable: true,\n    escClosable: true,\n    onOpenChange: void 0,\n    closeIcon: void 0,\n    content: void 0,\n    title: void 0,\n    maskBlur: void 0,\n    okText: void 0,\n    cancelText: void 0,\n    okProps: void 0,\n    cancelProps: void 0,\n    centered: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onOpenChange(open: OpenStateKey) {\n          opt.element.dispatchEvent(\n            new CustomEvent('openchange', {\n              detail: open,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['content']);\n    });\n    return <Modal {...props} />;\n  },\n);\n\nModal.open = open;\n\nexport default Modal;\n"],"names":["OpenState","createEffect","createMemo","createSignal","mergeProps","onCleanup","onMount","Show","untrack","Portal","isFunction","passiveSupported","customElement","clearAttribute","open","defaultPosi","modalStore","style","Modal","_","portal","modal","doc","document","documentElement","setNum","props","okText","cancelText","moveing","setMoveing","loading","setLoading","setOpen","posi","setPosi","movement","getCss","x","y","width","height","openChange","visi","removeProperty","onCancel","onOpenChange","preventDefault","e","close","type","escClosable","key","handleDestroy","handleOk","onOk","portalClick","maskClosable","target","point","prev","clientWidth","clientX","clientHeight","clientY","addEventListener","passive","removeEventListener","closeIcon","includes","move","ev","movementX","movementY","setProperty","mouseDown","mouseUp","body","title","content","cancelProps","okProps","maskBlur","centered","opt","el","element","dispatchEvent","CustomEvent","detail"],"mappings":"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"}
+{"version":3,"sources":["components/modal/index.tsx"],"sourcesContent":["import {\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  onMount,\n  Show,\n  untrack,\n} from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { isFunction, passiveSupported } from '@moneko/common';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport type { ButtonProps } from '../button';\n\nimport open from './hooks';\nimport { defaultPosi } from './posi';\nimport modalStore from './store';\nimport { style } from './style';\n\n/**\n * API\n * @since 2.6.0\n */\nexport interface ModalProps {\n  /** 是否打开模态框 */\n  open?: OpenStateKey;\n  /** 开启关闭的回调函数 */\n  onOpenChange?: (open: OpenStateKey) => void;\n  /** 点击遮罩关闭\n   * @default true\n   */\n  maskClosable?: boolean;\n  /** 通过 `esc` 按键关闭\n   * @default true\n   */\n  escClosable?: boolean;\n  /**\n   * 自定义关闭图标, 设置为 null 或 false 时隐藏关闭按钮\n   */\n  closeIcon?: JSXElement | (() => JSXElement);\n  /** 内容 */\n  content?: JSXElement | (() => JSXElement);\n  /** 标题 */\n  title?: JSXElement | (() => JSXElement);\n  /** 遮罩模糊\n   * @default false\n   */\n  maskBlur?: boolean;\n  okText?: string | false | null;\n  cancelText?: string | false | null;\n  onCancel?(): Promise<boolean> | boolean;\n  onOk?(e: MouseEvent | Event): Promise<boolean> | boolean;\n  okProps?: Omit<ButtonProps, 'children' | 'onClick' | 'loading'>;\n  cancelProps?: Omit<ButtonProps, 'children' | 'onClick'>;\n  centered?: boolean;\n}\n\n/**\n * OpenStateKey\n */\nexport enum OpenState {\n  /** 完全关闭 */\n  closed = 'closed',\n  /** 正在关闭 */\n  closeing = 'closeing',\n  /** 打开 */\n  open = 'open',\n}\nexport type OpenStateKey = keyof typeof OpenState;\nexport type ModalElement = CustomElement<ModalProps, 'onOpenChange'>;\n\nfunction Modal(_: ModalProps) {\n  const doc = document.documentElement;\n  const { setNum } = modalStore;\n  const props = mergeProps(\n    {\n      okText: '确认',\n      cancelText: '取消',\n    },\n    _,\n  );\n  const [moveing, setMoveing] = createSignal(false);\n  const [loading, setLoading] = createSignal(false);\n  const [open, setOpen] = createSignal<OpenStateKey>('closed');\n  const [posi, setPosi] = createSignal(defaultPosi);\n  const movement = [0, 0];\n  let portal: HTMLDivElement | undefined;\n  let modal: HTMLDivElement | undefined;\n\n  const getCss = createMemo(() => {\n    const { x, y, width, height } = posi();\n\n    return `.portal { --y: ${-(y - height / 2)}px;--x: ${-(x - width / 2)}px; --movement-x: ${\n      movement[0]\n    }px; --movement-y: ${movement[1]}px;}`;\n  });\n\n  async function openChange(visi: OpenStateKey) {\n    setLoading(false);\n    if (visi === OpenState.closeing) {\n      modal!.style.removeProperty('--x');\n      modal!.style.removeProperty('--y');\n      if (isFunction(props.onCancel)) {\n        setLoading(true);\n        if (!(await props.onCancel())) {\n          setLoading(false);\n          return;\n        }\n      }\n    }\n    setOpen(visi);\n    props.onOpenChange?.(visi);\n  }\n  function preventDefault(e: Event) {\n    e.preventDefault();\n  }\n  function close(e: KeyboardEvent | Event) {\n    preventDefault(e);\n    if (e.type === 'keydown') {\n      if (props.escClosable && (e as KeyboardEvent).key === 'Escape') {\n        openChange(OpenState.closeing);\n      }\n    } else {\n      openChange(OpenState.closeing);\n    }\n  }\n  function handleDestroy() {\n    if (open() === OpenState.closeing) {\n      openChange(OpenState.closed);\n    }\n  }\n  async function handleOk(e: MouseEvent | Event) {\n    preventDefault(e);\n    if (isFunction(props.onOk)) {\n      setLoading(true);\n      if (!(await props.onOk(e))) {\n        setLoading(false);\n        return;\n      }\n    }\n\n    setOpen(OpenState.closeing);\n    props.onOpenChange?.(OpenState.closeing);\n  }\n  function portalClick(e: Event) {\n    preventDefault(e);\n    if (props.maskClosable && e.target === portal) {\n      openChange(OpenState.closeing);\n    }\n  }\n\n  createEffect(() => {\n    if (props.open !== void 0 && props.open !== untrack(open)) {\n      setOpen(props.open);\n    }\n  });\n\n  function point(e: MouseEvent) {\n    setPosi((prev) => ({\n      ...prev,\n      x: doc.clientWidth / 2 - e.clientX,\n      y: doc.clientHeight / 2 - e.clientY,\n    }));\n  }\n  createEffect(() => {\n    if (open() === OpenState.open) {\n      setNum((prev) => prev + 1);\n      doc.addEventListener('mousewheel', preventDefault, {\n        passive: passiveSupported,\n      });\n\n      if (props.escClosable) {\n        doc.addEventListener('keydown', close, false);\n      }\n    } else if (open() === OpenState.closeing) {\n      setNum((prev) => prev - 1);\n    } else {\n      doc.addEventListener('click', point, true);\n    }\n\n    onCleanup(() => {\n      doc.removeEventListener('mousewheel', preventDefault, false);\n      doc.removeEventListener('keydown', close, false);\n      doc.removeEventListener('click', point, true);\n    });\n  });\n  const closeIcon = createMemo(() => {\n    if (props.closeIcon === null || props.closeIcon === false) {\n      return null;\n    }\n    if (['function', 'object'].includes(typeof props.closeIcon)) {\n      return () => (\n        <span class=\"modal-close\">\n          {isFunction(props.closeIcon) ? props.closeIcon() : props.closeIcon}\n        </span>\n      );\n    }\n    return () => (\n      <n-button class=\"modal-close\" danger={true} circle={true} flat={true} onClick={close}>\n        {props.closeIcon}\n      </n-button>\n    );\n  });\n\n  function move(ev: MouseEvent) {\n    if (modal) {\n      movement[0] = movement[0] + ev.movementX;\n      movement[1] = movement[1] + ev.movementY;\n\n      portal!.style.setProperty('--movement-x', `${movement[0]}px`);\n      portal!.style.setProperty('--movement-y', `${movement[1]}px`);\n      modal!.style.setProperty('--x', `${movement[0]}px`);\n      modal!.style.setProperty('--y', `${movement[1]}px`);\n    }\n  }\n\n  function mouseDown(e: MouseEvent) {\n    setMoveing(e.target === modal);\n  }\n  function mouseUp() {\n    setMoveing(false);\n  }\n  createEffect(() => {\n    if (moveing()) {\n      document.body.addEventListener('mousemove', move, {\n        passive: passiveSupported,\n      });\n    }\n    onCleanup(() => {\n      document.body.removeEventListener('mousemove', move, false);\n    });\n  });\n\n  onMount(() => {\n    document.body.addEventListener('mouseup', mouseUp, {\n      passive: passiveSupported,\n    });\n  });\n  onCleanup(() => {\n    document.body.removeEventListener('mouseup', mouseUp, false);\n  });\n  const title = createMemo(() => (isFunction(props.title) ? props.title() : props.title));\n  const content = createMemo(() => (isFunction(props.content) ? props.content() : props.content));\n\n  return (\n    <Show when={open() !== OpenState.closed}>\n      <Portal useShadow={true}>\n        <style textContent={getCss()} />\n        <style textContent={style} />\n        <div\n          ref={portal}\n          class=\"portal\"\n          classList={{\n            open: open() === OpenState.open,\n            closeing: open() !== OpenState.open,\n            'mask-blur': props.maskBlur,\n          }}\n          onAnimationEnd={handleDestroy}\n          onClick={portalClick}\n        >\n          <div\n            ref={modal}\n            classList={{\n              'modal-content': true,\n              centered: props.centered,\n              moveing: moveing(),\n            }}\n            onMouseDown={mouseDown}\n          >\n            <div class=\"modal-header\">\n              <strong class=\"modal-title\">{title()}</strong>\n            </div>\n            <Show when={props.closeIcon === void 0} fallback={closeIcon() as JSXElement}>\n              <n-button class=\"modal-close\" danger={true} circle={true} flat={true} onClick={close}>\n                ⛌\n              </n-button>\n            </Show>\n            <div class=\"modal-body\">{content()}</div>\n            <Show when={props.cancelText || props.okText}>\n              <div class=\"modal-footer\">\n                <Show when={props.cancelText}>\n                  <n-button {...props.cancelProps} onClick={close}>\n                    {props.cancelText}\n                  </n-button>\n                </Show>\n                <Show when={props.okText}>\n                  <n-button\n                    type=\"primary\"\n                    fill={true}\n                    {...props.okProps}\n                    loading={loading()}\n                    onClick={handleOk}\n                  >\n                    {props.okText}\n                  </n-button>\n                </Show>\n              </div>\n            </Show>\n          </div>\n        </div>\n      </Portal>\n    </Show>\n  );\n}\n\ncustomElement<ModalProps>(\n  'n-modal',\n  {\n    open: 'closed' as OpenStateKey,\n    maskClosable: true,\n    escClosable: true,\n    onOpenChange: void 0,\n    closeIcon: void 0,\n    content: void 0,\n    title: void 0,\n    maskBlur: void 0,\n    okText: void 0,\n    cancelText: void 0,\n    okProps: void 0,\n    cancelProps: void 0,\n    centered: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onOpenChange(open: OpenStateKey) {\n          opt.element.dispatchEvent(\n            new CustomEvent('openchange', {\n              detail: open,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['content']);\n    });\n    return <Modal {...props} />;\n  },\n);\n\nModal.open = open;\n\nexport default Modal;\n"],"names":["OpenState","createEffect","createMemo","createSignal","mergeProps","onCleanup","onMount","Show","untrack","Portal","isFunction","passiveSupported","customElement","clearAttribute","open","defaultPosi","modalStore","style","Modal","_","portal","modal","doc","document","documentElement","setNum","props","okText","cancelText","moveing","setMoveing","loading","setLoading","setOpen","posi","setPosi","movement","getCss","x","y","width","height","openChange","visi","removeProperty","onCancel","onOpenChange","preventDefault","e","close","type","escClosable","key","handleDestroy","handleOk","onOk","portalClick","maskClosable","target","point","prev","clientWidth","clientX","clientHeight","clientY","addEventListener","passive","removeEventListener","closeIcon","includes","move","ev","movementX","movementY","setProperty","mouseDown","mouseUp","body","title","content","cancelProps","okProps","maskBlur","centered","opt","el","element","dispatchEvent","CustomEvent","detail"],"mappings":"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"}

package/es/modal/style.js

@@ -45,14 +45,24 @@ import{css as o}from"@moneko/css";export const style=o`
     justify-content: flex-end;
   }
 
+  .modal-body {
+    overflow: auto;
+    max-block-size: calc(100vb - 150px);
+
+    &::-webkit-scrollbar {
+      inline-size: 5px;
+      block-size: 5px;
+    }
+  }
+
   .modal-content {
-    cursor: grab;
     margin: auto;
     border-radius: var(--border-radius);
     padding: 20px 24px;
     background-color: var(--modal-component-bg);
     opacity: var(--opacity);
     box-shadow: var(--modal-box-shadow);
+    cursor: grab;
     min-inline-size: 200px;
     max-inline-size: calc(100% - 32px);
     transform: translate3d(var(--x), var(--y), 1px) scale3d(var(--scale), var(--scale), 1);

package/es/modal/style.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/modal/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n  .portal {\n    --opacity: 0;\n    --scale: 0;\n    --timing: ease-in;\n\n    position: fixed;\n    box-sizing: border-box;\n    inset-block-start: 0;\n    inset-inline-start: 0;\n    inline-size: 100%;\n    block-size: 100%;\n    z-index: 99999;\n    display: flex;\n\n    &::before {\n      position: absolute;\n      z-index: -1;\n      background-color: var(--mask-bg);\n      opacity: var(--opacity);\n      transition: opacity 0.2s var(--timing);\n      inset-inline-start: 0;\n      inset-block-start: 0;\n      content: '';\n      inline-size: 100%;\n      block-size: 100%;\n      pointer-events: none;\n    }\n  }\n\n  .mask-blur::before {\n    backdrop-filter: blur(10px);\n  }\n\n  .modal-header,\n  .modal-body,\n  .modal-footer {\n    cursor: auto;\n  }\n\n  .modal-footer {\n    display: flex;\n    gap: 8px;\n    margin-block-start: 24px;\n    justify-content: flex-end;\n  }\n\n  .modal-content {\n    cursor: grab;\n    margin: auto;\n    border-radius: var(--border-radius);\n    padding: 20px 24px;\n    background-color: var(--modal-component-bg);\n    opacity: var(--opacity);\n    box-shadow: var(--modal-box-shadow);\n    min-inline-size: 200px;\n    max-inline-size: calc(100% - 32px);\n    transform: translate3d(var(--x), var(--y), 1px) scale3d(var(--scale), var(--scale), 1);\n    transition-property: transform, opacity;\n    transition-duration: 0.2s;\n    transition-timing-function: var(--timing);\n    backdrop-filter: blur(10px);\n\n    &:active {\n      cursor: grabbing;\n    }\n\n    &.moveing {\n      transition-property: none;\n      transition-duration: none;\n      transition-timing-function: none;\n      user-select: none;\n\n      * {\n        pointer-events: none;\n      }\n    }\n\n    &.centered {\n      text-align: center;\n\n      .modal-body,\n      .modal-footer {\n        justify-content: center;\n        text-align: center;\n      }\n    }\n  }\n\n  .open {\n    --opacity: 0;\n    --timing: ease-in;\n\n    animation: zoom-in 0.2s var(--timing) forwards;\n  }\n\n  .closeing {\n    --opacity: 1;\n    --timing: ease-out;\n\n    animation: zoom-out 0.2s var(--timing) forwards;\n  }\n\n  .modal-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-end;\n  }\n\n  .modal-title {\n    flex: 1;\n  }\n\n  .modal-close {\n    position: absolute;\n    inset-inline-end: 10px;\n    inset-block-start: 10px;\n\n    &::part(label) {\n      color: var(--text-color);\n    }\n  }\n\n  @keyframes zoom-in {\n    0% {\n      --opacity: 0;\n      --scale: 0;\n\n      pointer-events: none;\n    }\n\n    100% {\n      --opacity: 1;\n      --scale: 1;\n      --x: var(--movement-x);\n      --y: var(--movement-y);\n    }\n  }\n\n  @keyframes zoom-out {\n    0% {\n      --opacity: 1;\n      --scale: 1;\n      --x: var(--movement-x);\n      --y: var(--movement-y);\n    }\n\n    100% {\n      --opacity: 0;\n      --scale: 0;\n\n      pointer-events: none;\n    }\n  }\n`;\n"],"names":["css","style"],"mappings":"AAAA,OAASA,OAAAA,CAAG,KAAQ,aAAc,AAElC,QAAO,MAAMC,MAAQD,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JzB,CAAC,AAAC"}
+{"version":3,"sources":["components/modal/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n  .portal {\n    --opacity: 0;\n    --scale: 0;\n    --timing: ease-in;\n\n    position: fixed;\n    box-sizing: border-box;\n    inset-block-start: 0;\n    inset-inline-start: 0;\n    inline-size: 100%;\n    block-size: 100%;\n    z-index: 99999;\n    display: flex;\n\n    &::before {\n      position: absolute;\n      z-index: -1;\n      background-color: var(--mask-bg);\n      opacity: var(--opacity);\n      transition: opacity 0.2s var(--timing);\n      inset-inline-start: 0;\n      inset-block-start: 0;\n      content: '';\n      inline-size: 100%;\n      block-size: 100%;\n      pointer-events: none;\n    }\n  }\n\n  .mask-blur::before {\n    backdrop-filter: blur(10px);\n  }\n\n  .modal-header,\n  .modal-body,\n  .modal-footer {\n    cursor: auto;\n  }\n\n  .modal-footer {\n    display: flex;\n    gap: 8px;\n    margin-block-start: 24px;\n    justify-content: flex-end;\n  }\n\n  .modal-body {\n    overflow: auto;\n    max-block-size: calc(100vb - 150px);\n\n    &::-webkit-scrollbar {\n      inline-size: 5px;\n      block-size: 5px;\n    }\n  }\n\n  .modal-content {\n    margin: auto;\n    border-radius: var(--border-radius);\n    padding: 20px 24px;\n    background-color: var(--modal-component-bg);\n    opacity: var(--opacity);\n    box-shadow: var(--modal-box-shadow);\n    cursor: grab;\n    min-inline-size: 200px;\n    max-inline-size: calc(100% - 32px);\n    transform: translate3d(var(--x), var(--y), 1px) scale3d(var(--scale), var(--scale), 1);\n    transition-property: transform, opacity;\n    transition-duration: 0.2s;\n    transition-timing-function: var(--timing);\n    backdrop-filter: blur(10px);\n\n    &:active {\n      cursor: grabbing;\n    }\n\n    &.moveing {\n      transition-property: none;\n      transition-duration: none;\n      transition-timing-function: none;\n      user-select: none;\n\n      * {\n        pointer-events: none;\n      }\n    }\n\n    &.centered {\n      text-align: center;\n\n      .modal-body,\n      .modal-footer {\n        justify-content: center;\n        text-align: center;\n      }\n    }\n  }\n\n  .open {\n    --opacity: 0;\n    --timing: ease-in;\n\n    animation: zoom-in 0.2s var(--timing) forwards;\n  }\n\n  .closeing {\n    --opacity: 1;\n    --timing: ease-out;\n\n    animation: zoom-out 0.2s var(--timing) forwards;\n  }\n\n  .modal-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-end;\n  }\n\n  .modal-title {\n    flex: 1;\n  }\n\n  .modal-close {\n    position: absolute;\n    inset-inline-end: 10px;\n    inset-block-start: 10px;\n\n    &::part(label) {\n      color: var(--text-color);\n    }\n  }\n\n  @keyframes zoom-in {\n    0% {\n      --opacity: 0;\n      --scale: 0;\n\n      pointer-events: none;\n    }\n\n    100% {\n      --opacity: 1;\n      --scale: 1;\n      --x: var(--movement-x);\n      --y: var(--movement-y);\n    }\n  }\n\n  @keyframes zoom-out {\n    0% {\n      --opacity: 1;\n      --scale: 1;\n      --x: var(--movement-x);\n      --y: var(--movement-y);\n    }\n\n    100% {\n      --opacity: 0;\n      --scale: 0;\n\n      pointer-events: none;\n    }\n  }\n`;\n"],"names":["css","style"],"mappings":"AAAA,OAASA,OAAAA,CAAG,KAAQ,aAAc,AAElC,QAAO,MAAMC,MAAQD,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoKzB,CAAC,AAAC"}

package/eslint.config.mjs

@@ -1,9 +1,5 @@
-import eslint from '@moneko/eslint';
-import solid from 'eslint-plugin-solid/configs/typescript';
+import recommended from '@moneko/eslint/solid';
 
-const conf = [
-  ...eslint.configs.recommended,
-  { ignores: ['**/**/*.mdx?', 'lib', 'docs', 'coverage', 'prism.js'] },
-];
-
-export default conf.concat(solid);
+export default recommended.concat({
+  ignores: ['**/**/*.mdx?', 'lib', 'docs', 'coverage', 'prism.js'],
+});

package/lib/highlight-text/index.js

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return d}});const e=require("solid-js/web"),t=require("solid-js"),r=require("@moneko/css"),i=require("solid-element"),n=require("../basic-config"),l=o(require("../theme"));function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(s=function(e){return e?r:t})(e)}function o(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=s(t);if(r&&r.has(e))return r.get(e);var i={__proto__:null},n=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var l in e)if("default"!==l&&Object.prototype.hasOwnProperty.call(e,l)){var o=n?Object.getOwnPropertyDescriptor(e,l):null;o&&(o.get||o.set)?Object.defineProperty(i,l,o):i[l]=e[l]}return i.default=e,r&&r.set(e,i),i}const h=(0,e.template)("<style> "),a=(0,e.template)("<style>"),c=(0,e.template)("<div>"),g=(0,r.css)`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return d}});const e=require("solid-js/web"),t=require("solid-js"),r=require("@moneko/css"),i=require("solid-element"),n=require("../basic-config"),l=o(require("../theme"));function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(s=function(e){return e?r:t})(e)}function o(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=s(t);if(r&&r.has(e))return r.get(e);var i={__proto__:null},n=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var l in e)if("default"!==l&&Object.prototype.hasOwnProperty.call(e,l)){var o=n?Object.getOwnPropertyDescriptor(e,l):null;o&&(o.get||o.set)?Object.defineProperty(i,l,o):i[l]=e[l]}return i.default=e,r&&r.set(e,i),i}const h=(0,e.template)("<style> "),a=(0,e.template)("<style>"),c=(0,e.template)("<div>"),f=(0,r.css)`
   .text {
     word-break: break-word;
     word-wrap: break-word;
     white-space: break-spaces;
     cursor: auto;
   }
-`;function f(e,t,r,i,n){let l=new RegExp(r,i).exec(n);if(l){let r;let i=new Range;r=0+l.index,e.firstChild&&(i.setStart(e.firstChild,r),r+=l[0].length,i.setEnd(e.firstChild,r));let n=CSS.highlights.get(t);n?n.add(i):CSS.highlights.set(t,new Highlight().add(i))}}function u(i){let n;let{baseStyle:s}=l.default,o=(0,t.createUniqueId)(),u=(0,t.createMemo)(()=>`${i.text}${i.extra??""}`);return(0,t.createEffect)(()=>{if(n&&i.highlight){if(Array.isArray(i.highlight))for(let e=0,t=i.highlight.length;e<t;e++){let t=i.highlight[e],r="string"==typeof t,l=r?t:t.highlight;l.length&&f(n,o,l,r?i.flag:t.flag,u())}else i.highlight.length&&f(n,o,i.highlight,i.flag,u())}}),(0,t.createEffect)(()=>{if(n&&"string"==typeof i.extra){let e=new Range,t=i.text?.length||0;n.firstChild&&(e.setStart(n.firstChild,t),t+=i.extra.length,e.setEnd(n.firstChild,t));let r=CSS.highlights.get(o);r?r.add(e):CSS.highlights.set(o,new Highlight().add(e))}}),[(()=>{let t=h(),r=t.firstChild;return(0,e.effect)(()=>r.data=s()),t})(),(()=>{let e=a();return e.textContent=g,e})(),(()=>{let e=a();return e.textContent=`::highlight(${o}) {color: var(--primary-color, #5794ff);}`,e})(),(0,e.createComponent)(t.Show,{get when(){return i.css},get children(){return(0,r.css)(i.css)}}),(()=>{let t=c(),l=n;return"function"==typeof l?(0,e.use)(l,t):n=t,(0,e.insert)(t,u),(0,e.effect)(()=>(0,e.className)(t,(0,r.cx)("text",i.class))),t})()]}(0,i.customElement)("n-highlight-text",{class:void 0,css:void 0,text:void 0,highlight:void 0,flag:void 0,extra:void 0,children:void 0},(r,i)=>{let s=i.element,o=(0,t.mergeProps)({text:s.textContent,css:s.css},r);return(0,t.createEffect)(()=>{(0,n.clearAttribute)(s,["css","text","highlight","extra"]),s.replaceChildren()}),[(()=>{let e=a();return e.textContent=l.inline,e})(),(0,e.createComponent)(u,o)]});const d=u;
+`;function g(e,t,r,i,n){let l=new RegExp(r,i).exec(n);if(l){let r;let i=new Range;r=0+l.index,e.firstChild&&(i.setStart(e.firstChild,r),r+=l[0].length,i.setEnd(e.firstChild,r));let n=CSS.highlights.get(t);n?n.add(i):CSS.highlights.set(t,new Highlight().add(i))}}function u(i){let n;let{baseStyle:s}=l.default,o=(0,t.createUniqueId)(),u=(0,t.createMemo)(()=>`${i.text}${i.extra??""}`);return(0,t.createEffect)(()=>{if(n&&i.highlight){if(Array.isArray(i.highlight))for(let e=0,t=i.highlight.length;e<t;e++){let t=i.highlight[e],r="string"==typeof t,l=r?t:t.highlight;l.length&&g(n,o,l,r?i.flag:t.flag,u())}else i.highlight.length&&g(n,o,i.highlight,i.flag,u())}}),(0,t.createEffect)(()=>{if(n&&"string"==typeof i.extra){let e=new Range,t=i.text?.length||0;n.firstChild&&(e.setStart(n.firstChild,t),t+=i.extra.length,e.setEnd(n.firstChild,t));let r=CSS.highlights.get(o);r?r.add(e):CSS.highlights.set(o,new Highlight().add(e))}}),[(()=>{let t=h(),r=t.firstChild;return(0,e.effect)(()=>r.data=s()),t})(),(()=>{let e=a();return e.textContent=f,e})(),(()=>{let e=a();return e.textContent=`::highlight(${o}) {color: var(--primary-color, #5794ff);}`,e})(),(0,e.createComponent)(t.Show,{get when(){return i.css},get children(){let t=h(),n=t.firstChild;return(0,e.effect)(()=>n.data=(0,r.css)(i.css)),t}}),(()=>{let t=c(),l=n;return"function"==typeof l?(0,e.use)(l,t):n=t,(0,e.insert)(t,u),(0,e.effect)(()=>(0,e.className)(t,(0,r.cx)("text",i.class))),t})()]}(0,i.customElement)("n-highlight-text",{class:void 0,css:void 0,text:void 0,highlight:void 0,flag:void 0,extra:void 0,children:void 0},(r,i)=>{let s=i.element,o=(0,t.mergeProps)({text:s.textContent,css:s.css},r);return(0,t.createEffect)(()=>{(0,n.clearAttribute)(s,["css","text","highlight","extra"]),s.replaceChildren()}),[(()=>{let e=a();return e.textContent=l.inline,e})(),(0,e.createComponent)(u,o)]});const d=u;

package/lib/highlight-text/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/highlight-text/index.tsx"],"sourcesContent":["import { createEffect, createMemo, createUniqueId, mergeProps, Show } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { inline } from '../theme';\n\nconst style = css`\n  .text {\n    word-break: break-word;\n    word-wrap: break-word;\n    white-space: break-spaces;\n    cursor: auto;\n  }\n`;\n\nfunction highlight(\n  box: HTMLDivElement,\n  id: string,\n  regExp: string,\n  flag: HighlightRule['flag'],\n  text: string,\n) {\n  const regex = new RegExp(regExp, flag);\n  const match = regex.exec(text);\n\n  if (match) {\n    const range = new Range();\n    let pos = 0;\n\n    pos += match.index;\n    if (box.firstChild) {\n      range.setStart(box.firstChild, pos);\n      pos += match[0].length;\n      range.setEnd(box.firstChild, pos);\n    }\n    const highlight = CSS.highlights.get(id);\n\n    if (highlight) {\n      highlight.add(range);\n    } else {\n      CSS.highlights.set(id, new Highlight().add(range));\n    }\n  }\n}\n\nexport type HighlightTextJson =\n  | {\n      highlight?: boolean;\n      text: string;\n    }[]\n  | null;\nexport interface HighlightTextProps {\n  /** 自定义样式表 */\n  css?: string;\n  /** 自定义类名 */\n  class?: string;\n  /** 内容 */\n  text?: string;\n  /** 需要高亮的内容 */\n  highlight?: string | (HighlightRule | string)[];\n  /** RegExp flag */\n  flag?: HighlightRule['flag'];\n  /** 额外需要高亮的内容 */\n  extra?: string;\n  children?: string;\n}\n\ninterface HighlightRule {\n  /** 需要高亮的内容 */\n  highlight: string;\n  /** RegExp flag */\n  flag?: 'g' | 'i' | 'm' | 'u' | 'y';\n}\n\nexport interface Highlight {\n  /** 命中高亮 */\n  hit?: boolean;\n  /** 内容 */\n  text: string;\n}\n\nfunction HighlightText(props: HighlightTextProps) {\n  const { baseStyle } = theme;\n  let box: HTMLDivElement | undefined;\n  const id = createUniqueId();\n  const text = createMemo(() => `${props.text}${props.extra ?? ''}`);\n\n  createEffect(() => {\n    if (box && props.highlight) {\n      if (Array.isArray(props.highlight)) {\n        for (let i = 0, len = props.highlight.length; i < len; i++) {\n          const item = props.highlight[i];\n          const isOne = typeof item === 'string';\n          const hitStr = isOne ? item : item.highlight;\n\n          if (hitStr.length) {\n            highlight(box, id, hitStr, isOne ? props.flag : item.flag, text());\n          }\n        }\n      } else if (props.highlight.length) {\n        highlight(box, id, props.highlight, props.flag, text());\n      }\n    }\n  });\n  createEffect(() => {\n    if (box && typeof props.extra === 'string') {\n      const range = new Range();\n      let pos = props.text?.length || 0;\n\n      if (box.firstChild) {\n        range.setStart(box.firstChild, pos);\n        pos += props.extra.length;\n        range.setEnd(box.firstChild, pos);\n      }\n      const highlight = CSS.highlights.get(id);\n\n      if (highlight) {\n        highlight.add(range);\n      } else {\n        CSS.highlights.set(id, new Highlight().add(range));\n      }\n    }\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <style textContent={`::highlight(${id}) {color: var(--primary-color, #5794ff);}`} />\n      <Show when={props.css}>{css(props.css)}</Show>\n      <div ref={box} class={cx('text', props.class)}>\n        {text()}\n      </div>\n    </>\n  );\n}\n\nexport type HighlightTextElement = CustomElement<HighlightTextProps>;\ncustomElement<HighlightTextProps>(\n  'n-highlight-text',\n  {\n    class: void 0,\n    css: void 0,\n    text: void 0,\n    highlight: void 0,\n    flag: void 0,\n    extra: void 0,\n    children: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        text: el.textContent,\n        css: el.css,\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css', 'text', 'highlight', 'extra']);\n      el.replaceChildren();\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <HighlightText {...props} />\n      </>\n    );\n  },\n);\nexport default HighlightText;\n"],"names":["style","css","highlight","box","id","regExp","flag","text","match","regex","RegExp","exec","pos","range","Range","index","firstChild","setStart","length","setEnd","CSS","highlights","get","add","set","Highlight","HighlightText","props","baseStyle","theme","createUniqueId","createMemo","extra","createEffect","Array","isArray","i","len","item","isOne","hitStr","Show","cx","class","customElement","children","_","opt","el","element","mergeProps","textContent","clearAttribute","replaceChildren","inline"],"mappings":"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"}
+{"version":3,"sources":["components/highlight-text/index.tsx"],"sourcesContent":["import { createEffect, createMemo, createUniqueId, mergeProps, Show } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { inline } from '../theme';\n\nconst style = css`\n  .text {\n    word-break: break-word;\n    word-wrap: break-word;\n    white-space: break-spaces;\n    cursor: auto;\n  }\n`;\n\nfunction highlight(\n  box: HTMLDivElement,\n  id: string,\n  regExp: string,\n  flag: HighlightRule['flag'],\n  text: string,\n) {\n  const regex = new RegExp(regExp, flag);\n  const match = regex.exec(text);\n\n  if (match) {\n    const range = new Range();\n    let pos = 0;\n\n    pos += match.index;\n    if (box.firstChild) {\n      range.setStart(box.firstChild, pos);\n      pos += match[0].length;\n      range.setEnd(box.firstChild, pos);\n    }\n    const highlight = CSS.highlights.get(id);\n\n    if (highlight) {\n      highlight.add(range);\n    } else {\n      CSS.highlights.set(id, new Highlight().add(range));\n    }\n  }\n}\n\nexport type HighlightTextJson =\n  | {\n      highlight?: boolean;\n      text: string;\n    }[]\n  | null;\nexport interface HighlightTextProps {\n  /** 自定义样式表 */\n  css?: string;\n  /** 自定义类名 */\n  class?: string;\n  /** 内容 */\n  text?: string;\n  /** 需要高亮的内容 */\n  highlight?: string | (HighlightRule | string)[];\n  /** RegExp flag */\n  flag?: HighlightRule['flag'];\n  /** 额外需要高亮的内容 */\n  extra?: string;\n  children?: string;\n}\n\ninterface HighlightRule {\n  /** 需要高亮的内容 */\n  highlight: string;\n  /** RegExp flag */\n  flag?: 'g' | 'i' | 'm' | 'u' | 'y';\n}\n\nexport interface Highlight {\n  /** 命中高亮 */\n  hit?: boolean;\n  /** 内容 */\n  text: string;\n}\n\nfunction HighlightText(props: HighlightTextProps) {\n  const { baseStyle } = theme;\n  let box: HTMLDivElement | undefined;\n  const id = createUniqueId();\n  const text = createMemo(() => `${props.text}${props.extra ?? ''}`);\n\n  createEffect(() => {\n    if (box && props.highlight) {\n      if (Array.isArray(props.highlight)) {\n        for (let i = 0, len = props.highlight.length; i < len; i++) {\n          const item = props.highlight[i];\n          const isOne = typeof item === 'string';\n          const hitStr = isOne ? item : item.highlight;\n\n          if (hitStr.length) {\n            highlight(box, id, hitStr, isOne ? props.flag : item.flag, text());\n          }\n        }\n      } else if (props.highlight.length) {\n        highlight(box, id, props.highlight, props.flag, text());\n      }\n    }\n  });\n  createEffect(() => {\n    if (box && typeof props.extra === 'string') {\n      const range = new Range();\n      let pos = props.text?.length || 0;\n\n      if (box.firstChild) {\n        range.setStart(box.firstChild, pos);\n        pos += props.extra.length;\n        range.setEnd(box.firstChild, pos);\n      }\n      const highlight = CSS.highlights.get(id);\n\n      if (highlight) {\n        highlight.add(range);\n      } else {\n        CSS.highlights.set(id, new Highlight().add(range));\n      }\n    }\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <style textContent={`::highlight(${id}) {color: var(--primary-color, #5794ff);}`} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <div ref={box} class={cx('text', props.class)}>\n        {text()}\n      </div>\n    </>\n  );\n}\n\nexport type HighlightTextElement = CustomElement<HighlightTextProps>;\ncustomElement<HighlightTextProps>(\n  'n-highlight-text',\n  {\n    class: void 0,\n    css: void 0,\n    text: void 0,\n    highlight: void 0,\n    flag: void 0,\n    extra: void 0,\n    children: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        text: el.textContent,\n        css: el.css,\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css', 'text', 'highlight', 'extra']);\n      el.replaceChildren();\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <HighlightText {...props} />\n      </>\n    );\n  },\n);\nexport default HighlightText;\n"],"names":["style","css","highlight","box","id","regExp","flag","text","match","regex","RegExp","exec","pos","range","Range","index","firstChild","setStart","length","setEnd","CSS","highlights","get","add","set","Highlight","HighlightText","props","baseStyle","theme","createUniqueId","createMemo","extra","createEffect","Array","isArray","i","len","item","isOne","hitStr","Show","cx","class","customElement","children","_","opt","el","element","mergeProps","textContent","clearAttribute","replaceChildren","inline"],"mappings":"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"}

package/lib/modal/index.js

@@ -1 +1 @@
-"use strict";var e;function t(e,t){for(var n in t)Object.defineProperty(e,n,{enumerable:!0,get:t[n]})}Object.defineProperty(exports,"__esModule",{value:!0}),t(exports,{OpenState:function(){return e},default:function(){return $}});const n=require("solid-js/web"),o=require("solid-js"),r=m(require("@moneko/common/lib/isFunction")),l=m(require("@moneko/common/lib/passiveSupported")),c=require("solid-element"),s=require("../basic-config"),i=m(require("./hooks")),a=require("./posi"),d=m(require("./store")),u=require("./style");function m(e){return e&&e.__esModule?e:{default:e}}const p=(0,n.template)('<span class="modal-close">'),v=(0,n.template)('<n-button class="modal-close">',!0,!1),g=(0,n.template)("<style> "),f=(0,n.template)("<style>"),y=(0,n.template)(`<n-button class="modal-close">⛌`,!0,!1),h=(0,n.template)("<n-button>",!0,!1),k=(0,n.template)('<n-button type="primary">',!0,!1),w=(0,n.template)('<div class="modal-footer">'),C=(0,n.template)('<div class="portal"><div class="modal-content"><div class="modal-header"><strong class="modal-title"></strong></div><div class="modal-body">');function x(e){let t,c;let s=document.documentElement,{setNum:i}=d.default,m=(0,o.mergeProps)({okText:"确认",cancelText:"取消"},e),[x,$]=(0,o.createSignal)(!1),[b,E]=(0,o.createSignal)(!1),[_,L]=(0,o.createSignal)("closed"),[P,O]=(0,o.createSignal)(a.defaultPosi),S=[0,0],q=(0,o.createMemo)(()=>{let{x:e,y:t,width:n,height:o}=P();return`.portal { --y: ${-(t-o/2)}px;--x: ${-(e-n/2)}px; --movement-x: ${S[0]}px; --movement-y: ${S[1]}px;}`});async function T(e){if(E(!1),"closeing"===e&&(c.style.removeProperty("--x"),c.style.removeProperty("--y"),(0,r.default)(m.onCancel)&&(E(!0),!await m.onCancel()))){E(!1);return}L(e),m.onOpenChange?.(e)}function I(e){e.preventDefault()}function M(e){I(e),"keydown"===e.type?m.escClosable&&"Escape"===e.key&&T("closeing"):T("closeing")}function j(){"closeing"===_()&&T("closed")}async function B(e){if(I(e),(0,r.default)(m.onOk)&&(E(!0),!await m.onOk(e))){E(!1);return}L("closeing"),m.onOpenChange?.("closeing")}function X(e){I(e),m.maskClosable&&e.target===t&&T("closeing")}function Y(e){O(t=>({...t,x:s.clientWidth/2-e.clientX,y:s.clientHeight/2-e.clientY}))}(0,o.createEffect)(()=>{void 0!==m.open&&m.open!==(0,o.untrack)(_)&&L(m.open)}),(0,o.createEffect)(()=>{"open"===_()?(i(e=>e+1),s.addEventListener("mousewheel",I,{passive:!1}),m.escClosable&&s.addEventListener("keydown",M,!1)):"closeing"===_()?i(e=>e-1):s.addEventListener("click",Y,!0),(0,o.onCleanup)(()=>{s.removeEventListener("mousewheel",I,!1),s.removeEventListener("keydown",M,!1),s.removeEventListener("click",Y,!0)})});let A=(0,o.createMemo)(()=>null===m.closeIcon||!1===m.closeIcon?null:["function","object"].includes(typeof m.closeIcon)?()=>(()=>{let e=p();return(0,n.insert)(e,(()=>{let e=(0,n.memo)(()=>!!(0,r.default)(m.closeIcon));return()=>e()?m.closeIcon():m.closeIcon})()),e})():()=>(()=>{let e=v();return(0,n.addEventListener)(e,"click",M,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=(0,n.getOwner)(),(0,n.insert)(e,()=>m.closeIcon),e})());function D(e){c&&(S[0]=S[0]+e.movementX,S[1]=S[1]+e.movementY,t.style.setProperty("--movement-x",`${S[0]}px`),t.style.setProperty("--movement-y",`${S[1]}px`),c.style.setProperty("--x",`${S[0]}px`),c.style.setProperty("--y",`${S[1]}px`))}function F(e){$(e.target===c)}function H(){$(!1)}(0,o.createEffect)(()=>{x()&&document.body.addEventListener("mousemove",D,{passive:l.default}),(0,o.onCleanup)(()=>{document.body.removeEventListener("mousemove",D,!1)})}),(0,o.onMount)(()=>{document.body.addEventListener("mouseup",H,{passive:l.default})}),(0,o.onCleanup)(()=>{document.body.removeEventListener("mouseup",H,!1)});let W=(0,o.createMemo)(()=>(0,r.default)(m.title)?m.title():m.title),z=(0,o.createMemo)(()=>(0,r.default)(m.content)?m.content():m.content);return(0,n.createComponent)(o.Show,{get when(){return"closed"!==_()},get children(){return(0,n.createComponent)(n.Portal,{useShadow:!0,get children(){return[(()=>{let e=g(),t=e.firstChild;return(0,n.effect)(()=>t.data=q()),e})(),(()=>{let e=f();return e.textContent=u.style,e})(),(()=>{let e=C(),r=t,l=e.firstChild,s=c,i=l.firstChild,a=i.firstChild,d=i.nextSibling;return(0,n.addEventListener)(e,"click",X,!0),(0,n.addEventListener)(e,"animationend",j),"function"==typeof r?(0,n.use)(r,e):t=e,(0,n.addEventListener)(l,"mousedown",F,!0),"function"==typeof s?(0,n.use)(s,l):c=l,(0,n.insert)(a,W),(0,n.insert)(l,(0,n.createComponent)(o.Show,{get when(){return void 0===m.closeIcon},get fallback(){return A()},get children(){let e=y();return(0,n.addEventListener)(e,"click",M,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=(0,n.getOwner)(),e}}),d),(0,n.insert)(d,z),(0,n.insert)(l,(0,n.createComponent)(o.Show,{get when(){return m.cancelText||m.okText},get children(){let e=w();return(0,n.insert)(e,(0,n.createComponent)(o.Show,{get when(){return m.cancelText},get children(){let e=h();return(0,n.spread)(e,(0,n.mergeProps)(()=>m.cancelProps,{onClick:M}),!1,!0),e._$owner=(0,n.getOwner)(),(0,n.insert)(e,()=>m.cancelText),e}}),null),(0,n.insert)(e,(0,n.createComponent)(o.Show,{get when(){return m.okText},get children(){let e=k();return e.fill=!0,(0,n.spread)(e,(0,n.mergeProps)(()=>m.okProps,{get loading(){return b()},onClick:B}),!1,!0),e._$owner=(0,n.getOwner)(),(0,n.insert)(e,()=>m.okText),e}}),null),e}}),null),(0,n.effect)(t=>{let n=!("open"!==_()),o="open"!==_(),r=!!m.maskBlur,c=!!m.centered,s=!!x();return n!==t._v$&&e.classList.toggle("open",t._v$=n),o!==t._v$2&&e.classList.toggle("closeing",t._v$2=o),r!==t._v$3&&e.classList.toggle("mask-blur",t._v$3=r),c!==t._v$4&&l.classList.toggle("centered",t._v$4=c),s!==t._v$5&&l.classList.toggle("moveing",t._v$5=s),t},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0}),e})()]}})}})}!function(e){e.closed="closed",e.closeing="closeing",e.open="open"}(e||(e={})),(0,c.customElement)("n-modal",{open:"closed",maskClosable:!0,escClosable:!0,onOpenChange:void 0,closeIcon:void 0,content:void 0,title:void 0,maskBlur:void 0,okText:void 0,cancelText:void 0,okProps:void 0,cancelProps:void 0,centered:void 0},(e,t)=>{let r=t.element,l=(0,o.mergeProps)({onOpenChange(e){t.element.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return(0,o.createEffect)(()=>{(0,s.clearAttribute)(r,["content"])}),(0,n.createComponent)(x,l)}),x.open=i.default;const $=x;(0,n.delegateEvents)(["click","mousedown"]);
+"use strict";var e;function t(e,t){for(var n in t)Object.defineProperty(e,n,{enumerable:!0,get:t[n]})}Object.defineProperty(exports,"__esModule",{value:!0}),t(exports,{OpenState:function(){return e},default:function(){return $}});const n=require("solid-js/web"),o=require("solid-js"),r=m(require("@moneko/common/lib/isFunction")),l=m(require("@moneko/common/lib/passiveSupported")),c=require("solid-element"),s=require("../basic-config"),i=m(require("./hooks")),a=require("./posi"),d=m(require("./store")),u=require("./style");function m(e){return e&&e.__esModule?e:{default:e}}const p=(0,n.template)('<span class="modal-close">'),v=(0,n.template)('<n-button class="modal-close">',!0,!1),g=(0,n.template)("<style> "),f=(0,n.template)("<style>"),y=(0,n.template)(`<n-button class="modal-close">⛌`,!0,!1),h=(0,n.template)("<n-button>",!0,!1),k=(0,n.template)('<n-button type="primary">',!0,!1),w=(0,n.template)('<div class="modal-footer">'),C=(0,n.template)('<div class="portal"><div class="modal-content"><div class="modal-header"><strong class="modal-title"></strong></div><div class="modal-body">');function x(e){let t,c;let s=document.documentElement,{setNum:i}=d.default,m=(0,o.mergeProps)({okText:"确认",cancelText:"取消"},e),[x,$]=(0,o.createSignal)(!1),[b,E]=(0,o.createSignal)(!1),[_,L]=(0,o.createSignal)("closed"),[P,O]=(0,o.createSignal)(a.defaultPosi),S=[0,0],q=(0,o.createMemo)(()=>{let{x:e,y:t,width:n,height:o}=P();return`.portal { --y: ${-(t-o/2)}px;--x: ${-(e-n/2)}px; --movement-x: ${S[0]}px; --movement-y: ${S[1]}px;}`});async function T(e){if(E(!1),"closeing"===e&&(c.style.removeProperty("--x"),c.style.removeProperty("--y"),(0,r.default)(m.onCancel)&&(E(!0),!await m.onCancel()))){E(!1);return}L(e),m.onOpenChange?.(e)}function I(e){e.preventDefault()}function M(e){I(e),"keydown"===e.type?m.escClosable&&"Escape"===e.key&&T("closeing"):T("closeing")}function j(){"closeing"===_()&&T("closed")}async function B(e){if(I(e),(0,r.default)(m.onOk)&&(E(!0),!await m.onOk(e))){E(!1);return}L("closeing"),m.onOpenChange?.("closeing")}function X(e){I(e),m.maskClosable&&e.target===t&&T("closeing")}function Y(e){O(t=>({...t,x:s.clientWidth/2-e.clientX,y:s.clientHeight/2-e.clientY}))}(0,o.createEffect)(()=>{void 0!==m.open&&m.open!==(0,o.untrack)(_)&&L(m.open)}),(0,o.createEffect)(()=>{"open"===_()?(i(e=>e+1),s.addEventListener("mousewheel",I,{passive:l.default}),m.escClosable&&s.addEventListener("keydown",M,!1)):"closeing"===_()?i(e=>e-1):s.addEventListener("click",Y,!0),(0,o.onCleanup)(()=>{s.removeEventListener("mousewheel",I,!1),s.removeEventListener("keydown",M,!1),s.removeEventListener("click",Y,!0)})});let A=(0,o.createMemo)(()=>null===m.closeIcon||!1===m.closeIcon?null:["function","object"].includes(typeof m.closeIcon)?()=>(()=>{let e=p();return(0,n.insert)(e,(()=>{let e=(0,n.memo)(()=>!!(0,r.default)(m.closeIcon));return()=>e()?m.closeIcon():m.closeIcon})()),e})():()=>(()=>{let e=v();return(0,n.addEventListener)(e,"click",M,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=(0,n.getOwner)(),(0,n.insert)(e,()=>m.closeIcon),e})());function D(e){c&&(S[0]=S[0]+e.movementX,S[1]=S[1]+e.movementY,t.style.setProperty("--movement-x",`${S[0]}px`),t.style.setProperty("--movement-y",`${S[1]}px`),c.style.setProperty("--x",`${S[0]}px`),c.style.setProperty("--y",`${S[1]}px`))}function F(e){$(e.target===c)}function H(){$(!1)}(0,o.createEffect)(()=>{x()&&document.body.addEventListener("mousemove",D,{passive:l.default}),(0,o.onCleanup)(()=>{document.body.removeEventListener("mousemove",D,!1)})}),(0,o.onMount)(()=>{document.body.addEventListener("mouseup",H,{passive:l.default})}),(0,o.onCleanup)(()=>{document.body.removeEventListener("mouseup",H,!1)});let W=(0,o.createMemo)(()=>(0,r.default)(m.title)?m.title():m.title),z=(0,o.createMemo)(()=>(0,r.default)(m.content)?m.content():m.content);return(0,n.createComponent)(o.Show,{get when(){return"closed"!==_()},get children(){return(0,n.createComponent)(n.Portal,{useShadow:!0,get children(){return[(()=>{let e=g(),t=e.firstChild;return(0,n.effect)(()=>t.data=q()),e})(),(()=>{let e=f();return e.textContent=u.style,e})(),(()=>{let e=C(),r=t,l=e.firstChild,s=c,i=l.firstChild,a=i.firstChild,d=i.nextSibling;return(0,n.addEventListener)(e,"click",X,!0),(0,n.addEventListener)(e,"animationend",j),"function"==typeof r?(0,n.use)(r,e):t=e,(0,n.addEventListener)(l,"mousedown",F,!0),"function"==typeof s?(0,n.use)(s,l):c=l,(0,n.insert)(a,W),(0,n.insert)(l,(0,n.createComponent)(o.Show,{get when(){return void 0===m.closeIcon},get fallback(){return A()},get children(){let e=y();return(0,n.addEventListener)(e,"click",M,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=(0,n.getOwner)(),e}}),d),(0,n.insert)(d,z),(0,n.insert)(l,(0,n.createComponent)(o.Show,{get when(){return m.cancelText||m.okText},get children(){let e=w();return(0,n.insert)(e,(0,n.createComponent)(o.Show,{get when(){return m.cancelText},get children(){let e=h();return(0,n.spread)(e,(0,n.mergeProps)(()=>m.cancelProps,{onClick:M}),!1,!0),e._$owner=(0,n.getOwner)(),(0,n.insert)(e,()=>m.cancelText),e}}),null),(0,n.insert)(e,(0,n.createComponent)(o.Show,{get when(){return m.okText},get children(){let e=k();return e.fill=!0,(0,n.spread)(e,(0,n.mergeProps)(()=>m.okProps,{get loading(){return b()},onClick:B}),!1,!0),e._$owner=(0,n.getOwner)(),(0,n.insert)(e,()=>m.okText),e}}),null),e}}),null),(0,n.effect)(t=>{let n=!("open"!==_()),o="open"!==_(),r=!!m.maskBlur,c=!!m.centered,s=!!x();return n!==t._v$&&e.classList.toggle("open",t._v$=n),o!==t._v$2&&e.classList.toggle("closeing",t._v$2=o),r!==t._v$3&&e.classList.toggle("mask-blur",t._v$3=r),c!==t._v$4&&l.classList.toggle("centered",t._v$4=c),s!==t._v$5&&l.classList.toggle("moveing",t._v$5=s),t},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0}),e})()]}})}})}!function(e){e.closed="closed",e.closeing="closeing",e.open="open"}(e||(e={})),(0,c.customElement)("n-modal",{open:"closed",maskClosable:!0,escClosable:!0,onOpenChange:void 0,closeIcon:void 0,content:void 0,title:void 0,maskBlur:void 0,okText:void 0,cancelText:void 0,okProps:void 0,cancelProps:void 0,centered:void 0},(e,t)=>{let r=t.element,l=(0,o.mergeProps)({onOpenChange(e){t.element.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return(0,o.createEffect)(()=>{(0,s.clearAttribute)(r,["content"])}),(0,n.createComponent)(x,l)}),x.open=i.default;const $=x;(0,n.delegateEvents)(["click","mousedown"]);

package/lib/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/modal/index.tsx"],"sourcesContent":["import {\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  onMount,\n  Show,\n  untrack,\n} from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { isFunction, passiveSupported } from '@moneko/common';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport type { ButtonProps } from '../button';\n\nimport open from './hooks';\nimport { defaultPosi } from './posi';\nimport modalStore from './store';\nimport { style } from './style';\n\n/**\n * API\n * @since 2.6.0\n */\nexport interface ModalProps {\n  /** 是否打开模态框 */\n  open?: OpenStateKey;\n  /** 开启关闭的回调函数 */\n  onOpenChange?: (open: OpenStateKey) => void;\n  /** 点击遮罩关闭\n   * @default true\n   */\n  maskClosable?: boolean;\n  /** 通过 `esc` 按键关闭\n   * @default true\n   */\n  escClosable?: boolean;\n  /**\n   * 自定义关闭图标, 设置为 null 或 false 时隐藏关闭按钮\n   */\n  closeIcon?: JSXElement | (() => JSXElement);\n  /** 内容 */\n  content?: JSXElement | (() => JSXElement);\n  /** 标题 */\n  title?: JSXElement | (() => JSXElement);\n  /** 遮罩模糊\n   * @default false\n   */\n  maskBlur?: boolean;\n  okText?: string | false | null;\n  cancelText?: string | false | null;\n  onCancel?(): Promise<boolean> | boolean;\n  onOk?(e: MouseEvent | Event): Promise<boolean> | boolean;\n  okProps?: Omit<ButtonProps, 'children' | 'onClick' | 'loading'>;\n  cancelProps?: Omit<ButtonProps, 'children' | 'onClick'>;\n  centered?: boolean;\n}\n\n/**\n * OpenStateKey\n */\nexport enum OpenState {\n  /** 完全关闭 */\n  closed = 'closed',\n  /** 正在关闭 */\n  closeing = 'closeing',\n  /** 打开 */\n  open = 'open',\n}\nexport type OpenStateKey = keyof typeof OpenState;\nexport type ModalElement = CustomElement<ModalProps, 'onOpenChange'>;\n\nfunction Modal(_: ModalProps) {\n  const doc = document.documentElement;\n  const { setNum } = modalStore;\n  const props = mergeProps(\n    {\n      okText: '确认',\n      cancelText: '取消',\n    },\n    _,\n  );\n  const [moveing, setMoveing] = createSignal(false);\n  const [loading, setLoading] = createSignal(false);\n  const [open, setOpen] = createSignal<OpenStateKey>('closed');\n  const [posi, setPosi] = createSignal(defaultPosi);\n  const movement = [0, 0];\n  let portal: HTMLDivElement | undefined;\n  let modal: HTMLDivElement | undefined;\n\n  const getCss = createMemo(() => {\n    const { x, y, width, height } = posi();\n\n    return `.portal { --y: ${-(y - height / 2)}px;--x: ${-(x - width / 2)}px; --movement-x: ${\n      movement[0]\n    }px; --movement-y: ${movement[1]}px;}`;\n  });\n\n  async function openChange(visi: OpenStateKey) {\n    setLoading(false);\n    if (visi === OpenState.closeing) {\n      modal!.style.removeProperty('--x');\n      modal!.style.removeProperty('--y');\n      if (isFunction(props.onCancel)) {\n        setLoading(true);\n        if (!(await props.onCancel())) {\n          setLoading(false);\n          return;\n        }\n      }\n    }\n    setOpen(visi);\n    props.onOpenChange?.(visi);\n  }\n  function preventDefault(e: Event) {\n    e.preventDefault();\n  }\n  function close(e: KeyboardEvent | Event) {\n    preventDefault(e);\n    if (e.type === 'keydown') {\n      if (props.escClosable && (e as KeyboardEvent).key === 'Escape') {\n        openChange(OpenState.closeing);\n      }\n    } else {\n      openChange(OpenState.closeing);\n    }\n  }\n  function handleDestroy() {\n    if (open() === OpenState.closeing) {\n      openChange(OpenState.closed);\n    }\n  }\n  async function handleOk(e: MouseEvent | Event) {\n    preventDefault(e);\n    if (isFunction(props.onOk)) {\n      setLoading(true);\n      if (!(await props.onOk(e))) {\n        setLoading(false);\n        return;\n      }\n    }\n\n    setOpen(OpenState.closeing);\n    props.onOpenChange?.(OpenState.closeing);\n  }\n  function portalClick(e: Event) {\n    preventDefault(e);\n    if (props.maskClosable && e.target === portal) {\n      openChange(OpenState.closeing);\n    }\n  }\n\n  createEffect(() => {\n    if (props.open !== void 0 && props.open !== untrack(open)) {\n      setOpen(props.open);\n    }\n  });\n\n  function point(e: MouseEvent) {\n    setPosi((prev) => ({\n      ...prev,\n      x: doc.clientWidth / 2 - e.clientX,\n      y: doc.clientHeight / 2 - e.clientY,\n    }));\n  }\n  createEffect(() => {\n    if (open() === OpenState.open) {\n      setNum((prev) => prev + 1);\n      doc.addEventListener('mousewheel', preventDefault, {\n        passive: false,\n      });\n\n      if (props.escClosable) {\n        doc.addEventListener('keydown', close, false);\n      }\n    } else if (open() === OpenState.closeing) {\n      setNum((prev) => prev - 1);\n    } else {\n      doc.addEventListener('click', point, true);\n    }\n\n    onCleanup(() => {\n      doc.removeEventListener('mousewheel', preventDefault, false);\n      doc.removeEventListener('keydown', close, false);\n      doc.removeEventListener('click', point, true);\n    });\n  });\n  const closeIcon = createMemo(() => {\n    if (props.closeIcon === null || props.closeIcon === false) {\n      return null;\n    }\n    if (['function', 'object'].includes(typeof props.closeIcon)) {\n      return () => (\n        <span class=\"modal-close\">\n          {isFunction(props.closeIcon) ? props.closeIcon() : props.closeIcon}\n        </span>\n      );\n    }\n    return () => (\n      <n-button class=\"modal-close\" danger={true} circle={true} flat={true} onClick={close}>\n        {props.closeIcon}\n      </n-button>\n    );\n  });\n\n  function move(ev: MouseEvent) {\n    if (modal) {\n      movement[0] = movement[0] + ev.movementX;\n      movement[1] = movement[1] + ev.movementY;\n\n      portal!.style.setProperty('--movement-x', `${movement[0]}px`);\n      portal!.style.setProperty('--movement-y', `${movement[1]}px`);\n      modal!.style.setProperty('--x', `${movement[0]}px`);\n      modal!.style.setProperty('--y', `${movement[1]}px`);\n    }\n  }\n\n  function mouseDown(e: MouseEvent) {\n    setMoveing(e.target === modal);\n  }\n  function mouseUp() {\n    setMoveing(false);\n  }\n  createEffect(() => {\n    if (moveing()) {\n      document.body.addEventListener('mousemove', move, {\n        passive: passiveSupported,\n      });\n    }\n    onCleanup(() => {\n      document.body.removeEventListener('mousemove', move, false);\n    });\n  });\n\n  onMount(() => {\n    document.body.addEventListener('mouseup', mouseUp, {\n      passive: passiveSupported,\n    });\n  });\n  onCleanup(() => {\n    document.body.removeEventListener('mouseup', mouseUp, false);\n  });\n  const title = createMemo(() => (isFunction(props.title) ? props.title() : props.title));\n  const content = createMemo(() => (isFunction(props.content) ? props.content() : props.content));\n\n  return (\n    <Show when={open() !== OpenState.closed}>\n      <Portal useShadow={true}>\n        <style textContent={getCss()} />\n        <style textContent={style} />\n        <div\n          ref={portal}\n          class=\"portal\"\n          classList={{\n            open: open() === OpenState.open,\n            closeing: open() !== OpenState.open,\n            'mask-blur': props.maskBlur,\n          }}\n          onAnimationEnd={handleDestroy}\n          onClick={portalClick}\n        >\n          <div\n            ref={modal}\n            classList={{\n              'modal-content': true,\n              centered: props.centered,\n              moveing: moveing(),\n            }}\n            onMouseDown={mouseDown}\n          >\n            <div class=\"modal-header\">\n              <strong class=\"modal-title\">{title()}</strong>\n            </div>\n            <Show when={props.closeIcon === void 0} fallback={closeIcon() as JSXElement}>\n              <n-button class=\"modal-close\" danger={true} circle={true} flat={true} onClick={close}>\n                ⛌\n              </n-button>\n            </Show>\n            <div class=\"modal-body\">{content()}</div>\n            <Show when={props.cancelText || props.okText}>\n              <div class=\"modal-footer\">\n                <Show when={props.cancelText}>\n                  <n-button {...props.cancelProps} onClick={close}>\n                    {props.cancelText}\n                  </n-button>\n                </Show>\n                <Show when={props.okText}>\n                  <n-button\n                    type=\"primary\"\n                    fill={true}\n                    {...props.okProps}\n                    loading={loading()}\n                    onClick={handleOk}\n                  >\n                    {props.okText}\n                  </n-button>\n                </Show>\n              </div>\n            </Show>\n          </div>\n        </div>\n      </Portal>\n    </Show>\n  );\n}\n\ncustomElement<ModalProps>(\n  'n-modal',\n  {\n    open: 'closed' as OpenStateKey,\n    maskClosable: true,\n    escClosable: true,\n    onOpenChange: void 0,\n    closeIcon: void 0,\n    content: void 0,\n    title: void 0,\n    maskBlur: void 0,\n    okText: void 0,\n    cancelText: void 0,\n    okProps: void 0,\n    cancelProps: void 0,\n    centered: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onOpenChange(open: OpenStateKey) {\n          opt.element.dispatchEvent(\n            new CustomEvent('openchange', {\n              detail: open,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['content']);\n    });\n    return <Modal {...props} />;\n  },\n);\n\nModal.open = open;\n\nexport default Modal;\n"],"names":["Modal","_","portal","modal","doc","document","documentElement","setNum","modalStore","props","mergeProps","okText","cancelText","moveing","setMoveing","createSignal","loading","setLoading","open","setOpen","posi","setPosi","defaultPosi","movement","getCss","createMemo","x","y","width","height","openChange","visi","style","removeProperty","isFunction","onCancel","onOpenChange","preventDefault","e","close","type","escClosable","key","handleDestroy","handleOk","onOk","portalClick","maskClosable","target","point","prev","clientWidth","clientX","clientHeight","clientY","createEffect","untrack","addEventListener","passive","onCleanup","removeEventListener","closeIcon","includes","move","ev","movementX","movementY","setProperty","mouseDown","mouseUp","body","passiveSupported","onMount","title","content","Show","Portal","cancelProps","okProps","maskBlur","centered","OpenState","customElement","opt","el","element","dispatchEvent","CustomEvent","detail","clearAttribute"],"mappings":"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"}
+{"version":3,"sources":["components/modal/index.tsx"],"sourcesContent":["import {\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  onMount,\n  Show,\n  untrack,\n} from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { isFunction, passiveSupported } from '@moneko/common';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport type { ButtonProps } from '../button';\n\nimport open from './hooks';\nimport { defaultPosi } from './posi';\nimport modalStore from './store';\nimport { style } from './style';\n\n/**\n * API\n * @since 2.6.0\n */\nexport interface ModalProps {\n  /** 是否打开模态框 */\n  open?: OpenStateKey;\n  /** 开启关闭的回调函数 */\n  onOpenChange?: (open: OpenStateKey) => void;\n  /** 点击遮罩关闭\n   * @default true\n   */\n  maskClosable?: boolean;\n  /** 通过 `esc` 按键关闭\n   * @default true\n   */\n  escClosable?: boolean;\n  /**\n   * 自定义关闭图标, 设置为 null 或 false 时隐藏关闭按钮\n   */\n  closeIcon?: JSXElement | (() => JSXElement);\n  /** 内容 */\n  content?: JSXElement | (() => JSXElement);\n  /** 标题 */\n  title?: JSXElement | (() => JSXElement);\n  /** 遮罩模糊\n   * @default false\n   */\n  maskBlur?: boolean;\n  okText?: string | false | null;\n  cancelText?: string | false | null;\n  onCancel?(): Promise<boolean> | boolean;\n  onOk?(e: MouseEvent | Event): Promise<boolean> | boolean;\n  okProps?: Omit<ButtonProps, 'children' | 'onClick' | 'loading'>;\n  cancelProps?: Omit<ButtonProps, 'children' | 'onClick'>;\n  centered?: boolean;\n}\n\n/**\n * OpenStateKey\n */\nexport enum OpenState {\n  /** 完全关闭 */\n  closed = 'closed',\n  /** 正在关闭 */\n  closeing = 'closeing',\n  /** 打开 */\n  open = 'open',\n}\nexport type OpenStateKey = keyof typeof OpenState;\nexport type ModalElement = CustomElement<ModalProps, 'onOpenChange'>;\n\nfunction Modal(_: ModalProps) {\n  const doc = document.documentElement;\n  const { setNum } = modalStore;\n  const props = mergeProps(\n    {\n      okText: '确认',\n      cancelText: '取消',\n    },\n    _,\n  );\n  const [moveing, setMoveing] = createSignal(false);\n  const [loading, setLoading] = createSignal(false);\n  const [open, setOpen] = createSignal<OpenStateKey>('closed');\n  const [posi, setPosi] = createSignal(defaultPosi);\n  const movement = [0, 0];\n  let portal: HTMLDivElement | undefined;\n  let modal: HTMLDivElement | undefined;\n\n  const getCss = createMemo(() => {\n    const { x, y, width, height } = posi();\n\n    return `.portal { --y: ${-(y - height / 2)}px;--x: ${-(x - width / 2)}px; --movement-x: ${\n      movement[0]\n    }px; --movement-y: ${movement[1]}px;}`;\n  });\n\n  async function openChange(visi: OpenStateKey) {\n    setLoading(false);\n    if (visi === OpenState.closeing) {\n      modal!.style.removeProperty('--x');\n      modal!.style.removeProperty('--y');\n      if (isFunction(props.onCancel)) {\n        setLoading(true);\n        if (!(await props.onCancel())) {\n          setLoading(false);\n          return;\n        }\n      }\n    }\n    setOpen(visi);\n    props.onOpenChange?.(visi);\n  }\n  function preventDefault(e: Event) {\n    e.preventDefault();\n  }\n  function close(e: KeyboardEvent | Event) {\n    preventDefault(e);\n    if (e.type === 'keydown') {\n      if (props.escClosable && (e as KeyboardEvent).key === 'Escape') {\n        openChange(OpenState.closeing);\n      }\n    } else {\n      openChange(OpenState.closeing);\n    }\n  }\n  function handleDestroy() {\n    if (open() === OpenState.closeing) {\n      openChange(OpenState.closed);\n    }\n  }\n  async function handleOk(e: MouseEvent | Event) {\n    preventDefault(e);\n    if (isFunction(props.onOk)) {\n      setLoading(true);\n      if (!(await props.onOk(e))) {\n        setLoading(false);\n        return;\n      }\n    }\n\n    setOpen(OpenState.closeing);\n    props.onOpenChange?.(OpenState.closeing);\n  }\n  function portalClick(e: Event) {\n    preventDefault(e);\n    if (props.maskClosable && e.target === portal) {\n      openChange(OpenState.closeing);\n    }\n  }\n\n  createEffect(() => {\n    if (props.open !== void 0 && props.open !== untrack(open)) {\n      setOpen(props.open);\n    }\n  });\n\n  function point(e: MouseEvent) {\n    setPosi((prev) => ({\n      ...prev,\n      x: doc.clientWidth / 2 - e.clientX,\n      y: doc.clientHeight / 2 - e.clientY,\n    }));\n  }\n  createEffect(() => {\n    if (open() === OpenState.open) {\n      setNum((prev) => prev + 1);\n      doc.addEventListener('mousewheel', preventDefault, {\n        passive: passiveSupported,\n      });\n\n      if (props.escClosable) {\n        doc.addEventListener('keydown', close, false);\n      }\n    } else if (open() === OpenState.closeing) {\n      setNum((prev) => prev - 1);\n    } else {\n      doc.addEventListener('click', point, true);\n    }\n\n    onCleanup(() => {\n      doc.removeEventListener('mousewheel', preventDefault, false);\n      doc.removeEventListener('keydown', close, false);\n      doc.removeEventListener('click', point, true);\n    });\n  });\n  const closeIcon = createMemo(() => {\n    if (props.closeIcon === null || props.closeIcon === false) {\n      return null;\n    }\n    if (['function', 'object'].includes(typeof props.closeIcon)) {\n      return () => (\n        <span class=\"modal-close\">\n          {isFunction(props.closeIcon) ? props.closeIcon() : props.closeIcon}\n        </span>\n      );\n    }\n    return () => (\n      <n-button class=\"modal-close\" danger={true} circle={true} flat={true} onClick={close}>\n        {props.closeIcon}\n      </n-button>\n    );\n  });\n\n  function move(ev: MouseEvent) {\n    if (modal) {\n      movement[0] = movement[0] + ev.movementX;\n      movement[1] = movement[1] + ev.movementY;\n\n      portal!.style.setProperty('--movement-x', `${movement[0]}px`);\n      portal!.style.setProperty('--movement-y', `${movement[1]}px`);\n      modal!.style.setProperty('--x', `${movement[0]}px`);\n      modal!.style.setProperty('--y', `${movement[1]}px`);\n    }\n  }\n\n  function mouseDown(e: MouseEvent) {\n    setMoveing(e.target === modal);\n  }\n  function mouseUp() {\n    setMoveing(false);\n  }\n  createEffect(() => {\n    if (moveing()) {\n      document.body.addEventListener('mousemove', move, {\n        passive: passiveSupported,\n      });\n    }\n    onCleanup(() => {\n      document.body.removeEventListener('mousemove', move, false);\n    });\n  });\n\n  onMount(() => {\n    document.body.addEventListener('mouseup', mouseUp, {\n      passive: passiveSupported,\n    });\n  });\n  onCleanup(() => {\n    document.body.removeEventListener('mouseup', mouseUp, false);\n  });\n  const title = createMemo(() => (isFunction(props.title) ? props.title() : props.title));\n  const content = createMemo(() => (isFunction(props.content) ? props.content() : props.content));\n\n  return (\n    <Show when={open() !== OpenState.closed}>\n      <Portal useShadow={true}>\n        <style textContent={getCss()} />\n        <style textContent={style} />\n        <div\n          ref={portal}\n          class=\"portal\"\n          classList={{\n            open: open() === OpenState.open,\n            closeing: open() !== OpenState.open,\n            'mask-blur': props.maskBlur,\n          }}\n          onAnimationEnd={handleDestroy}\n          onClick={portalClick}\n        >\n          <div\n            ref={modal}\n            classList={{\n              'modal-content': true,\n              centered: props.centered,\n              moveing: moveing(),\n            }}\n            onMouseDown={mouseDown}\n          >\n            <div class=\"modal-header\">\n              <strong class=\"modal-title\">{title()}</strong>\n            </div>\n            <Show when={props.closeIcon === void 0} fallback={closeIcon() as JSXElement}>\n              <n-button class=\"modal-close\" danger={true} circle={true} flat={true} onClick={close}>\n                ⛌\n              </n-button>\n            </Show>\n            <div class=\"modal-body\">{content()}</div>\n            <Show when={props.cancelText || props.okText}>\n              <div class=\"modal-footer\">\n                <Show when={props.cancelText}>\n                  <n-button {...props.cancelProps} onClick={close}>\n                    {props.cancelText}\n                  </n-button>\n                </Show>\n                <Show when={props.okText}>\n                  <n-button\n                    type=\"primary\"\n                    fill={true}\n                    {...props.okProps}\n                    loading={loading()}\n                    onClick={handleOk}\n                  >\n                    {props.okText}\n                  </n-button>\n                </Show>\n              </div>\n            </Show>\n          </div>\n        </div>\n      </Portal>\n    </Show>\n  );\n}\n\ncustomElement<ModalProps>(\n  'n-modal',\n  {\n    open: 'closed' as OpenStateKey,\n    maskClosable: true,\n    escClosable: true,\n    onOpenChange: void 0,\n    closeIcon: void 0,\n    content: void 0,\n    title: void 0,\n    maskBlur: void 0,\n    okText: void 0,\n    cancelText: void 0,\n    okProps: void 0,\n    cancelProps: void 0,\n    centered: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onOpenChange(open: OpenStateKey) {\n          opt.element.dispatchEvent(\n            new CustomEvent('openchange', {\n              detail: open,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['content']);\n    });\n    return <Modal {...props} />;\n  },\n);\n\nModal.open = open;\n\nexport default Modal;\n"],"names":["Modal","_","portal","modal","doc","document","documentElement","setNum","modalStore","props","mergeProps","okText","cancelText","moveing","setMoveing","createSignal","loading","setLoading","open","setOpen","posi","setPosi","defaultPosi","movement","getCss","createMemo","x","y","width","height","openChange","visi","style","removeProperty","isFunction","onCancel","onOpenChange","preventDefault","e","close","type","escClosable","key","handleDestroy","handleOk","onOk","portalClick","maskClosable","target","point","prev","clientWidth","clientX","clientHeight","clientY","createEffect","untrack","addEventListener","passive","passiveSupported","onCleanup","removeEventListener","closeIcon","includes","move","ev","movementX","movementY","setProperty","mouseDown","mouseUp","body","onMount","title","content","Show","Portal","cancelProps","okProps","maskBlur","centered","OpenState","customElement","opt","el","element","dispatchEvent","CustomEvent","detail","clearAttribute"],"mappings":"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"}

package/lib/modal/style.js

@@ -45,14 +45,24 @@
     justify-content: flex-end;
   }
 
+  .modal-body {
+    overflow: auto;
+    max-block-size: calc(100vb - 150px);
+
+    &::-webkit-scrollbar {
+      inline-size: 5px;
+      block-size: 5px;
+    }
+  }
+
   .modal-content {
-    cursor: grab;
     margin: auto;
     border-radius: var(--border-radius);
     padding: 20px 24px;
     background-color: var(--modal-component-bg);
     opacity: var(--opacity);
     box-shadow: var(--modal-box-shadow);
+    cursor: grab;
     min-inline-size: 200px;
     max-inline-size: calc(100% - 32px);
     transform: translate3d(var(--x), var(--y), 1px) scale3d(var(--scale), var(--scale), 1);

package/lib/modal/style.js.map

@@ -1 +1 @@
-{"version":3,"sources":["components/modal/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n  .portal {\n    --opacity: 0;\n    --scale: 0;\n    --timing: ease-in;\n\n    position: fixed;\n    box-sizing: border-box;\n    inset-block-start: 0;\n    inset-inline-start: 0;\n    inline-size: 100%;\n    block-size: 100%;\n    z-index: 99999;\n    display: flex;\n\n    &::before {\n      position: absolute;\n      z-index: -1;\n      background-color: var(--mask-bg);\n      opacity: var(--opacity);\n      transition: opacity 0.2s var(--timing);\n      inset-inline-start: 0;\n      inset-block-start: 0;\n      content: '';\n      inline-size: 100%;\n      block-size: 100%;\n      pointer-events: none;\n    }\n  }\n\n  .mask-blur::before {\n    backdrop-filter: blur(10px);\n  }\n\n  .modal-header,\n  .modal-body,\n  .modal-footer {\n    cursor: auto;\n  }\n\n  .modal-footer {\n    display: flex;\n    gap: 8px;\n    margin-block-start: 24px;\n    justify-content: flex-end;\n  }\n\n  .modal-content {\n    cursor: grab;\n    margin: auto;\n    border-radius: var(--border-radius);\n    padding: 20px 24px;\n    background-color: var(--modal-component-bg);\n    opacity: var(--opacity);\n    box-shadow: var(--modal-box-shadow);\n    min-inline-size: 200px;\n    max-inline-size: calc(100% - 32px);\n    transform: translate3d(var(--x), var(--y), 1px) scale3d(var(--scale), var(--scale), 1);\n    transition-property: transform, opacity;\n    transition-duration: 0.2s;\n    transition-timing-function: var(--timing);\n    backdrop-filter: blur(10px);\n\n    &:active {\n      cursor: grabbing;\n    }\n\n    &.moveing {\n      transition-property: none;\n      transition-duration: none;\n      transition-timing-function: none;\n      user-select: none;\n\n      * {\n        pointer-events: none;\n      }\n    }\n\n    &.centered {\n      text-align: center;\n\n      .modal-body,\n      .modal-footer {\n        justify-content: center;\n        text-align: center;\n      }\n    }\n  }\n\n  .open {\n    --opacity: 0;\n    --timing: ease-in;\n\n    animation: zoom-in 0.2s var(--timing) forwards;\n  }\n\n  .closeing {\n    --opacity: 1;\n    --timing: ease-out;\n\n    animation: zoom-out 0.2s var(--timing) forwards;\n  }\n\n  .modal-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-end;\n  }\n\n  .modal-title {\n    flex: 1;\n  }\n\n  .modal-close {\n    position: absolute;\n    inset-inline-end: 10px;\n    inset-block-start: 10px;\n\n    &::part(label) {\n      color: var(--text-color);\n    }\n  }\n\n  @keyframes zoom-in {\n    0% {\n      --opacity: 0;\n      --scale: 0;\n\n      pointer-events: none;\n    }\n\n    100% {\n      --opacity: 1;\n      --scale: 1;\n      --x: var(--movement-x);\n      --y: var(--movement-y);\n    }\n  }\n\n  @keyframes zoom-out {\n    0% {\n      --opacity: 1;\n      --scale: 1;\n      --x: var(--movement-x);\n      --y: var(--movement-y);\n    }\n\n    100% {\n      --opacity: 0;\n      --scale: 0;\n\n      pointer-events: none;\n    }\n  }\n`;\n"],"names":["style","css"],"mappings":"kGAEaA,6CAAAA,qBAFO,eAEPA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JzB,CAAC"}
+{"version":3,"sources":["components/modal/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n  .portal {\n    --opacity: 0;\n    --scale: 0;\n    --timing: ease-in;\n\n    position: fixed;\n    box-sizing: border-box;\n    inset-block-start: 0;\n    inset-inline-start: 0;\n    inline-size: 100%;\n    block-size: 100%;\n    z-index: 99999;\n    display: flex;\n\n    &::before {\n      position: absolute;\n      z-index: -1;\n      background-color: var(--mask-bg);\n      opacity: var(--opacity);\n      transition: opacity 0.2s var(--timing);\n      inset-inline-start: 0;\n      inset-block-start: 0;\n      content: '';\n      inline-size: 100%;\n      block-size: 100%;\n      pointer-events: none;\n    }\n  }\n\n  .mask-blur::before {\n    backdrop-filter: blur(10px);\n  }\n\n  .modal-header,\n  .modal-body,\n  .modal-footer {\n    cursor: auto;\n  }\n\n  .modal-footer {\n    display: flex;\n    gap: 8px;\n    margin-block-start: 24px;\n    justify-content: flex-end;\n  }\n\n  .modal-body {\n    overflow: auto;\n    max-block-size: calc(100vb - 150px);\n\n    &::-webkit-scrollbar {\n      inline-size: 5px;\n      block-size: 5px;\n    }\n  }\n\n  .modal-content {\n    margin: auto;\n    border-radius: var(--border-radius);\n    padding: 20px 24px;\n    background-color: var(--modal-component-bg);\n    opacity: var(--opacity);\n    box-shadow: var(--modal-box-shadow);\n    cursor: grab;\n    min-inline-size: 200px;\n    max-inline-size: calc(100% - 32px);\n    transform: translate3d(var(--x), var(--y), 1px) scale3d(var(--scale), var(--scale), 1);\n    transition-property: transform, opacity;\n    transition-duration: 0.2s;\n    transition-timing-function: var(--timing);\n    backdrop-filter: blur(10px);\n\n    &:active {\n      cursor: grabbing;\n    }\n\n    &.moveing {\n      transition-property: none;\n      transition-duration: none;\n      transition-timing-function: none;\n      user-select: none;\n\n      * {\n        pointer-events: none;\n      }\n    }\n\n    &.centered {\n      text-align: center;\n\n      .modal-body,\n      .modal-footer {\n        justify-content: center;\n        text-align: center;\n      }\n    }\n  }\n\n  .open {\n    --opacity: 0;\n    --timing: ease-in;\n\n    animation: zoom-in 0.2s var(--timing) forwards;\n  }\n\n  .closeing {\n    --opacity: 1;\n    --timing: ease-out;\n\n    animation: zoom-out 0.2s var(--timing) forwards;\n  }\n\n  .modal-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-end;\n  }\n\n  .modal-title {\n    flex: 1;\n  }\n\n  .modal-close {\n    position: absolute;\n    inset-inline-end: 10px;\n    inset-block-start: 10px;\n\n    &::part(label) {\n      color: var(--text-color);\n    }\n  }\n\n  @keyframes zoom-in {\n    0% {\n      --opacity: 0;\n      --scale: 0;\n\n      pointer-events: none;\n    }\n\n    100% {\n      --opacity: 1;\n      --scale: 1;\n      --x: var(--movement-x);\n      --y: var(--movement-y);\n    }\n  }\n\n  @keyframes zoom-out {\n    0% {\n      --opacity: 1;\n      --scale: 1;\n      --x: var(--movement-x);\n      --y: var(--movement-y);\n    }\n\n    100% {\n      --opacity: 0;\n      --scale: 0;\n\n      pointer-events: none;\n    }\n  }\n`;\n"],"names":["style","css"],"mappings":"kGAEaA,6CAAAA,qBAFO,eAEPA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoKzB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "neko-ui",
-  "version": "2.10.0",
+  "version": "2.10.2",
   "description": "WebComponents UI Libraries",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -16,10 +16,13 @@
   "scripts": {
     "build": "mo build library solid",
     "changelog": "mo changelog CHANGELOG.md && git add CHANGELOG.md",
+    "lint:commit": "pure-lint mode=commit && npm run changelog",
+    "lint:ci": "pure-lint mode=ci",
     "lint": "mo eslint [components,site] --fix",
-    "postlint": "mo stylelint [components,site] --fix && jest --coverage",
+    "postlint": "jest --coverage",
+    "postlint2": "mo stylelint [components,site] --fix && jest --coverage",
     "precommit": "npm run lint && npm run changelog",
-    "prepare": "mo githooks pre-commit=\"npm run precommit\" commit-msg=\"npx --no -- commitlint --edit ${1}\"",
+    "prepare": "mo githooks pre-commit=\"npm run lint:commit\" commit-msg=\"npx --no -- commitlint --edit ${1}\"",
     "start": "mo start library solid",
     "test": "jest --coverage --watchAll"
   },
@@ -53,16 +56,15 @@
   "devDependencies": {
     "@commitlint/cli": "19.8.0",
     "@commitlint/config-conventional": "19.8.0",
-    "@moneko/core": "3.30.2",
-    "@moneko/eslint": "1.0.1",
-    "@moneko/stylelint": "1.0.2",
+    "@moneko/core": "3.35.5",
+    "@moneko/eslint": "1.2.1",
+    "@moneko/stylelint": "1.2.0",
     "@moneko/solid": "1.11.0",
     "@solidjs/testing-library": "0.8.10",
     "@swc/jest": "0.2.37",
     "@testing-library/jest-dom": "6.6.3",
     "@types/jest": "29.5.14",
     "@types/prismjs": "1.26.5",
-    "eslint-plugin-solid": "0.14.5",
     "husky": "9.1.7",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
@@ -72,7 +74,7 @@
     "shadow-dom-testing-library": "1.12.0"
   },
   "dependencies": {
-    "@moneko/common": "1.7.3",
+    "@moneko/common": "1.7.6",
     "@moneko/css": "1.1.5",
     "custom-element-type": "1.0.6",
     "dayjs": "1.11.13",