neko-ui 2.8.0 → 2.8.2

package/lib/md/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/md/index.tsx"],"sourcesContent":["import { For, Match, Switch, createComponent, createEffect, mergeProps, onCleanup } from 'solid-js';\nimport { frameCallback } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport marked from 'marked-completed';\nimport { customElement } from 'solid-element';\nimport '../code';\nimport '../img';\nimport mdStyle from '../md-style';\nimport theme from '../theme';\nimport type { CustomElement } from '..';\n\nfunction katexBlock(code: string) {\n  return `<n-katex display-mode=\"true\">${code}</n-katex>`;\n}\nfunction katexInline(code: string) {\n  return `<n-katex>${code}</n-katex>`;\n}\nfunction img(src: string, title: string, alt: string) {\n  return `<img role=\"img\" src=\"${src}\" alt=\"${alt}\" ${title ? `title=\"${title}\"` : ''}></img>`;\n}\nfunction nImg(src: string, title: string, alt: string) {\n  return `<n-img role=\"img\" src=\"${src}\" alt=\"${alt}\" ${title ? `title=\"${title}\"` : ''}></n-img>`;\n}\nfunction MD(_props: MdProps) {\n  let ref: HTMLDivElement | undefined;\n  const renderer = new marked.Renderer();\n\n  renderer.katexBlock = katexBlock;\n  renderer.katexInline = katexInline;\n  const { baseStyle } = theme;\n  const props = mergeProps(\n    {\n      pictureViewer: true,\n      text: '',\n      tools: ['copy'],\n      getAnchorContainer: () => window as unknown as HTMLElement,\n    },\n    _props,\n  );\n\n  function update(e: { data: string }) {\n    if (ref) {\n      ref.innerHTML = e.data;\n    }\n  }\n  function postMessage(opt: {\n    text: string;\n    pictureViewer?: boolean;\n    langToolbar?: string[];\n    langLineNumber?: boolean;\n  }) {\n    const { text, pictureViewer, langToolbar, ...options } = opt;\n\n    renderer.image = pictureViewer ? nImg : img;\n    const toolbar = !!langToolbar?.length;\n\n    renderer.code = function (code: string, lang: string) {\n      if (lang === 'treeview') {\n        return `<n-tree data=\"${code}\" />`;\n      }\n\n      return `<n-code class=\"n-code\" toolbar=\"${toolbar}\" lang=\"${lang}\" ${\n        options.langLineNumber ? 'line-number=\"true\"' : ''\n      }>${encodeURIComponent(code)}</n-code>`;\n    };\n\n    update({\n      data: marked(text, {\n        renderer: renderer,\n        langToolbar: langToolbar,\n        headerPrefix: '# ',\n        breaks: true,\n        pedantic: false,\n        smartLists: true,\n        smartypants: true,\n        xhtml: true,\n        ...options,\n      }),\n    });\n  }\n  // const work = new Worker(new URL('./worker.ts', import.meta.url));\n\n  // work.addEventListener('message', update);\n  // work.postMessage({\n  //   text: props.text,\n  //   langLineNumber: props.lineNumber,\n  //   langToolbar: props.tools,\n  //   pictureViewer: props.pictureViewer,\n  // });\n  // onCleanup(() => {\n  //   work.terminate();\n  // });\n  createEffect(() => {\n    const call = () =>\n      postMessage({\n        text: props.text,\n        langLineNumber: props.lineNumber,\n        langToolbar: props.tools,\n        pictureViewer: props.pictureViewer,\n      });\n\n    frameCallback(call);\n  });\n  let list: HTMLAnchorElement[] = [];\n  let heading: HTMLHeadingElement[] = [];\n  const active: HTMLAnchorElement[] = [];\n\n  function handleAnchor(e: Event) {\n    e.preventDefault();\n    e.stopPropagation();\n    const a = e.target as HTMLAnchorElement;\n\n    if (a.hash) {\n      ref?.querySelector(decodeURIComponent(a.hash))?.scrollIntoView({\n        behavior: 'smooth',\n        block: 'nearest',\n      });\n      list.forEach((item) => item.classList.remove('active'));\n      a.classList.add('active');\n    } else {\n      window.open(a.href);\n    }\n  }\n  function observerEntry(entries: IntersectionObserverEntry[]) {\n    entries.forEach((entry) => {\n      const id = entry.target.getAttribute('id');\n      const all = entry.target.querySelectorAll('a');\n      let a: HTMLAnchorElement | undefined;\n\n      list.forEach((l) => {\n        if (l.hash === `#${id}`) {\n          a = l;\n        } else if (!l.hash) {\n          all.forEach((e) => {\n            if (e.href === l.href) {\n              a = l;\n            }\n          });\n        }\n      });\n      if (a) {\n        const idx = active.indexOf(a);\n\n        active.forEach((e) => {\n          e.classList.remove('active');\n        });\n        if (entry.isIntersecting) {\n          active.push(a);\n        } else if (idx !== -1) {\n          active.splice(idx, 1);\n        }\n        if (active[0]) {\n          active[0].classList.add('active');\n          active[0].offsetParent?.scrollTo({\n            top: active[0].offsetTop,\n          });\n        }\n      }\n    });\n  }\n  createEffect(() => {\n    let observer: IntersectionObserver;\n\n    if (ref && props.text?.startsWith('[TOC]')) {\n      list = [...ref.querySelectorAll<HTMLAnchorElement>('.n-md-toc a[href]')];\n      heading = [...ref.querySelectorAll<HTMLHeadingElement>('h1, h2, h3, h4, h5, h6')];\n\n      observer = new IntersectionObserver(observerEntry, {\n        rootMargin: '-50px 0px',\n        threshold: 0.5,\n      });\n\n      heading.forEach((e) => observer.observe(e));\n      list.forEach((e) => {\n        e.addEventListener('click', handleAnchor);\n      });\n    }\n    onCleanup(() => {\n      if (observer) {\n        heading.forEach((e) => observer.unobserve(e));\n        observer.disconnect();\n      }\n      list.forEach((e) => {\n        e.removeEventListener('click', handleAnchor);\n      });\n    });\n  });\n\n  return (\n    <>\n      <style>\n        {baseStyle()}\n        {mdStyle}\n        {css(props.css)}\n      </style>\n      <Switch>\n        <Match when={(props.children as [])?.length}>\n          <article class=\"n-md-box\" part=\"box\">\n            <div class=\"n-md-body\" part=\"body\">\n              <For each={props.children as []}>{(e) => e}</For>\n            </div>\n          </article>\n        </Match>\n        <Match when={props.text}>\n          <article ref={ref} class={cx('n-md-box', props.class)} part=\"box\" />\n        </Match>\n      </Switch>\n    </>\n  );\n}\n\nexport interface MdProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** md内容 */\n  text?: string;\n  /** 开启图片查看器\n   * @since 2.0.8\n   * @default true\n   */\n  pictureViewer?: boolean;\n  /** 显示代码块行号\n   * @default true\n   */\n  lineNumber?: boolean;\n  /** 开启代码块工具条\n   * @default ['copy']\n   */\n  tools?: 'copy'[];\n  /** 指定滚动的容器\n   * @default () => window\n   */\n  getAnchorContainer?: () => HTMLElement;\n  /** 不进行解析\n   * @default false\n   */\n  notRender?: boolean;\n  children?: JSX.Element;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n  'n-md',\n  {\n    class: void 0,\n    pictureViewer: void 0,\n    lineNumber: true,\n    text: void 0,\n    tools: void 0,\n    getAnchorContainer: void 0,\n    css: void 0,\n    children: void 0,\n    notRender: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        text: (!_.notRender && el.textContent) || el.text,\n        css: el.css,\n        tools: el.tools,\n        getAnchorContainer: el.getAnchorContainer,\n      },\n      _,\n    );\n\n    createEffect(() => {\n      el.removeAttribute('css');\n      el.replaceChildren();\n    });\n    return createComponent(MD, props);\n  },\n);\nexport default MD;\n"],"names":["katexBlock","code","katexInline","img","src","title","alt","nImg","MD","_props","ref","renderer","marked","Renderer","baseStyle","theme","props","mergeProps","pictureViewer","text","tools","getAnchorContainer","window","createEffect","frameCallback","postMessage","opt","e","langToolbar","options","image","toolbar","length","lang","langLineNumber","encodeURIComponent","data","headerPrefix","breaks","pedantic","smartLists","smartypants","xhtml","innerHTML","lineNumber","list","heading","active","handleAnchor","preventDefault","stopPropagation","a","target","hash","querySelector","decodeURIComponent","scrollIntoView","behavior","block","forEach","item","classList","remove","add","open","href","observerEntry","entries","entry","id","getAttribute","all","querySelectorAll","l","idx","indexOf","isIntersecting","push","splice","offsetParent","scrollTo","top","offsetTop","observer","startsWith","IntersectionObserver","rootMargin","threshold","observe","addEventListener","onCleanup","unobserve","disconnect","removeEventListener","mdStyle","css","Switch","Match","children","For","cx","class","customElement","notRender","_","el","element","textContent","removeAttribute","replaceChildren","createComponent"],"rangeMappings":"","mappings":"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"}
+{"version":3,"sources":["../../components/md/index.tsx"],"sourcesContent":["import { For, Match, Switch, createEffect, mergeProps, onCleanup } from 'solid-js';\nimport { frameCallback } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport marked, { Renderer } from 'marked-completed';\nimport { customElement } from 'solid-element';\nimport '../code';\nimport '../img';\nimport mdStyle from '../md-style';\nimport theme from '../theme';\nimport type { CustomElement } from '..';\n\nfunction MD(_props: MdProps) {\n  let ref: HTMLDivElement | undefined;\n  const renderer = new Renderer();\n\n  renderer.katexBlock = (code: string) => {\n    return `<n-katex display-mode=\"true\">${code}</n-katex>`;\n  };\n  renderer.katexInline = (code: string) => {\n    return `<n-katex>${code}</n-katex>`;\n  };\n  const { baseStyle } = theme;\n  const props = mergeProps(\n    {\n      pictureViewer: true,\n      text: '',\n      tools: ['copy'],\n      getAnchorContainer: () => window as unknown as HTMLElement,\n    },\n    _props,\n  );\n\n  function update(e: { data: string }) {\n    if (ref) {\n      ref.innerHTML = e.data;\n    }\n  }\n  function postMessage(opt: {\n    text: string;\n    pictureViewer?: boolean;\n    langToolbar?: string[];\n    langLineNumber?: boolean;\n  }) {\n    const { text, pictureViewer, langToolbar, ...options } = opt;\n    const tag = pictureViewer ? 'n-img' : 'img';\n\n    renderer.image = (src: string, title: string, alt: string) => {\n      return `<${tag} role=\"img\" src=\"${src}\" alt=\"${alt}\" ${title ? `title=\"${title}\"` : ''}></${tag}>`;\n    };\n    const toolbar = !!langToolbar?.length;\n\n    renderer.code = function (code: string, lang: string) {\n      if (lang === 'treeview') {\n        return `<n-tree data=\"${code}\" />`;\n      }\n\n      return `<n-code class=\"n-code\" toolbar=\"${toolbar}\" lang=\"${lang}\" ${\n        options.langLineNumber ? 'line-number=\"true\"' : ''\n      }>${encodeURIComponent(code)}</n-code>`;\n    };\n\n    update({\n      data: marked(text, {\n        renderer: renderer,\n        langToolbar: langToolbar,\n        headerPrefix: '# ',\n        breaks: true,\n        pedantic: false,\n        smartLists: true,\n        smartypants: true,\n        xhtml: true,\n        ...options,\n      }),\n    });\n  }\n  // const work = new Worker(new URL('./worker.ts', import.meta.url));\n\n  // work.addEventListener('message', update);\n  // work.postMessage({\n  //   text: props.text,\n  //   langLineNumber: props.lineNumber,\n  //   langToolbar: props.tools,\n  //   pictureViewer: props.pictureViewer,\n  // });\n  // onCleanup(() => {\n  //   work.terminate();\n  // });\n  createEffect(() => {\n    const call = () =>\n      postMessage({\n        text: props.text,\n        langLineNumber: props.lineNumber,\n        langToolbar: props.tools,\n        pictureViewer: props.pictureViewer,\n      });\n\n    frameCallback(call);\n  });\n  let list: HTMLAnchorElement[] = [];\n  let heading: HTMLHeadingElement[] = [];\n  const active: HTMLAnchorElement[] = [];\n\n  function handleAnchor(e: Event) {\n    e.preventDefault();\n    e.stopPropagation();\n    const a = e.target as HTMLAnchorElement;\n\n    if (a.hash) {\n      ref?.querySelector(decodeURIComponent(a.hash))?.scrollIntoView({\n        behavior: 'smooth',\n        block: 'nearest',\n      });\n      list.forEach((item) => item.classList.remove('active'));\n      a.classList.add('active');\n    } else {\n      window.open(a.href);\n    }\n  }\n  function observerEntry(entries: IntersectionObserverEntry[]) {\n    entries.forEach((entry) => {\n      const id = entry.target.getAttribute('id');\n      const all = entry.target.querySelectorAll('a');\n      let a: HTMLAnchorElement | undefined;\n\n      list.forEach((l) => {\n        if (l.hash === `#${id}`) {\n          a = l;\n        } else if (!l.hash) {\n          all.forEach((e) => {\n            if (e.href === l.href) {\n              a = l;\n            }\n          });\n        }\n      });\n      if (a) {\n        const idx = active.indexOf(a);\n\n        active.forEach((e) => {\n          e.classList.remove('active');\n        });\n        if (entry.isIntersecting) {\n          active.push(a);\n        } else if (idx !== -1) {\n          active.splice(idx, 1);\n        }\n        if (active[0]) {\n          active[0].classList.add('active');\n          active[0].offsetParent?.scrollTo({\n            top: active[0].offsetTop,\n          });\n        }\n      }\n    });\n  }\n  createEffect(() => {\n    let observer: IntersectionObserver;\n\n    if (ref && props.text?.startsWith('[TOC]')) {\n      list = [...ref.querySelectorAll<HTMLAnchorElement>('.n-md-toc a[href]')];\n      heading = [...ref.querySelectorAll<HTMLHeadingElement>('h1, h2, h3, h4, h5, h6')];\n      observer = new IntersectionObserver(observerEntry, {\n        rootMargin: '-50px 0px',\n        threshold: 0.5,\n      });\n      heading.forEach((e) => observer.observe(e));\n      list.forEach((e) => {\n        e.addEventListener('click', handleAnchor);\n      });\n    }\n    onCleanup(() => {\n      if (observer) {\n        heading.forEach((e) => observer.unobserve(e));\n        observer.disconnect();\n      }\n      list.forEach((e) => {\n        e.removeEventListener('click', handleAnchor);\n      });\n    });\n  });\n\n  return (\n    <>\n      <style>\n        {baseStyle()}\n        {mdStyle}\n        {css(props.css)}\n      </style>\n      <Switch>\n        <Match when={(props.children as [])?.length}>\n          <article class=\"n-md-box\" part=\"box\">\n            <div class=\"n-md-body\" part=\"body\">\n              <For each={props.children as []}>{(e) => e}</For>\n            </div>\n          </article>\n        </Match>\n        <Match when={props.text}>\n          <article ref={ref} class={cx('n-md-box', props.class)} part=\"box\" />\n        </Match>\n      </Switch>\n    </>\n  );\n}\n\nexport interface MdProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** md内容 */\n  text?: string;\n  /** 开启图片查看器\n   * @since 2.0.8\n   * @default true\n   */\n  pictureViewer?: boolean;\n  /** 显示代码块行号\n   * @default true\n   */\n  lineNumber?: boolean;\n  /** 开启代码块工具条\n   * @default ['copy']\n   */\n  tools?: 'copy'[];\n  /** 指定滚动的容器\n   * @default () => window\n   */\n  getAnchorContainer?: () => HTMLElement;\n  /** 不进行解析\n   * @default false\n   */\n  notRender?: boolean;\n  children?: JSX.Element;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n  'n-md',\n  {\n    class: void 0,\n    pictureViewer: void 0,\n    lineNumber: true,\n    text: void 0,\n    tools: void 0,\n    getAnchorContainer: void 0,\n    css: void 0,\n    children: void 0,\n    notRender: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        text: (!_.notRender && el.textContent) || el.text,\n        css: el.css,\n        tools: el.tools,\n        getAnchorContainer: el.getAnchorContainer,\n      },\n      _,\n    );\n\n    createEffect(() => {\n      el.removeAttribute('css');\n      el.replaceChildren();\n    });\n    return <MD {...props} />;\n  },\n);\nexport default MD;\n"],"names":["MD","_props","ref","renderer","Renderer","katexBlock","code","katexInline","baseStyle","theme","props","mergeProps","pictureViewer","text","tools","getAnchorContainer","window","createEffect","frameCallback","postMessage","opt","e","langToolbar","options","tag","image","src","title","alt","toolbar","length","lang","langLineNumber","encodeURIComponent","data","marked","headerPrefix","breaks","pedantic","smartLists","smartypants","xhtml","innerHTML","lineNumber","list","heading","active","handleAnchor","preventDefault","stopPropagation","a","target","hash","querySelector","decodeURIComponent","scrollIntoView","behavior","block","forEach","item","classList","remove","add","open","href","observerEntry","entries","entry","id","getAttribute","all","querySelectorAll","l","idx","indexOf","isIntersecting","push","splice","offsetParent","scrollTo","top","offsetTop","observer","startsWith","IntersectionObserver","rootMargin","threshold","observe","addEventListener","onCleanup","unobserve","disconnect","removeEventListener","mdStyle","css","Switch","Match","children","For","cx","class","customElement","notRender","_","el","element","textContent","removeAttribute","replaceChildren"],"rangeMappings":"","mappings":"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"}

package/lib/menu/index.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return N}});const e=require("solid-js/web"),t=require("solid-js"),n=c(require("@moneko/common/lib/frameCallback")),r=c(require("@moneko/common/lib/isFunction")),s=require("@moneko/css"),l=require("solid-element"),i=require("./style"),a=require("../basic-config"),o=c(require("../get-options")),u=c(require("../theme"));function c(e){return e&&e.__esModule?e:{default:e}}const d=(0,e.template)('<span class="menu-icon" part="icon">'),m=(0,e.template)('<span class="menu-suffix" part="suffix">'),f=(0,e.template)('<div class="sub-menu-children" part="sub-menu-children"><div>'),p=(0,e.template)('<div part="sub-menu"><span class="sub-menu-title"><span class="menu-arrow">'),v=(0,e.template)('<div><span class="menu-group-title">'),g=(0,e.template)('<div part="item">'),h=(0,e.template)("<style>"),b=(0,e.template)('<section class="menu" part="menu">');function C(l){let c;let{isDark:C,baseStyle:N}=u.default,[y,E]=(0,t.splitProps)(l,["class","css","items","fieldNames","value","disabled","toggle","multiple","onChange","onOpenChange","openKeys"]),[_,w]=(0,t.createSignal)([]),[$,A]=(0,t.createSignal)([]),q=(0,t.createMemo)(()=>`:host {--sub-menu-bg: ${C()?"rgb(255 255 255 / 1%)":"rgb(0 0 0 / 1%)"} ;}`),x=(0,t.createMemo)(()=>Object.assign({},a.FieldName,y.fieldNames)),k=(0,t.createMemo)(()=>(0,o.default)(y.items,x()));function O(e){e.preventDefault(),e.stopPropagation()}function M(e,t){if(t.preventDefault(),!e.disabled&&!y.disabled){let t=[..._()],n=e[x().value];if(y.multiple){let e=t.indexOf(n);-1===e?t.push(n):t.splice(e,1)}else t=y.toggle&&t[0]===n?[]:[n];(0,r.default)(y.onChange)&&y.onChange(y.multiple?t:t[0],e),void 0===y.value&&w(t)}}function S(n){return(0,e.createComponent)(t.For,{get each(){return n.list},children:l=>{function i(){return[(0,e.createComponent)(t.Show,{get when(){return l[n.fieldNames.icon]},get children(){let t=d();return(0,e.insert)(t,()=>l[n.fieldNames.icon]),t}}),(0,e.memo)(()=>l[n.fieldNames.label]),(()=>{let t=m();return(0,e.insert)(t,()=>l[n.fieldNames.suffix]),t})()]}function a(){let a=(0,t.createMemo)(()=>$().includes(l[n.fieldNames.value])),[o,u]=(0,t.createSignal)((0,t.untrack)(a));function c(e){O(e);let t=$();t=t.includes(l[n.fieldNames.value])?t.filter(e=>e!==l[n.fieldNames.value]):t.concat(l[n.fieldNames.value]),(0,r.default)(y.onOpenChange)&&y.onOpenChange(t),void 0===y.openKeys&&A(t)}function d(){let r;let[s,i]=(0,t.createSignal)();function o(){a()||u(!1)}return(0,t.createEffect)(()=>{i(r?.offsetHeight||0)}),(()=>{let t=f(),i=t.firstChild,a=r;return(0,e.addEventListener)(t,"animationend",o),"function"==typeof a?(0,e.use)(a,i):r=i,(0,e.insert)(i,(0,e.createComponent)(S,{get fieldNames(){return n.fieldNames},get list(){return l[n.fieldNames.children]}})),(0,e.effect)(()=>(s(),t.style.setProperty("--h",`${s()}px`))),t})()}return(0,t.createEffect)(()=>{a()&&u(!0)}),(()=>{let n=p(),r=n.firstChild,u=r.firstChild;return(0,e.addEventListener)(n,"mousedown",O,!0),(0,e.addEventListener)(r,"click",c,!0),(0,e.insert)(r,(0,e.createComponent)(i,{}),u),(0,e.insert)(n,(0,e.createComponent)(t.Show,{get when(){return o()},get children(){return(0,e.createComponent)(d,{})}}),null),(0,e.effect)(()=>(0,e.className)(n,(0,s.cx)("sub-menu",l.class,`sub-menu-${a()?"open":"close"}`))),n})()}return(0,e.createComponent)(t.Switch,{get fallback(){return(()=>{let t=g();return(0,e.addEventListener)(t,"click",M.bind(null,l),!0),(0,e.addEventListener)(t,"mousedown",O,!0),(0,e.insert)(t,(0,e.createComponent)(i,{})),(0,e.effect)(r=>{let i=(0,s.cx)("menu-item",l.class,l.type),a=l.handleClosed,o=y.disabled||l.disabled,u=_().includes(l[n.fieldNames.value]);return i!==r._v$&&(0,e.className)(t,r._v$=i),a!==r._v$2&&(0,e.setAttribute)(t,"handle-closed",r._v$2=a),o!==r._v$3&&(0,e.setAttribute)(t,"aria-disabled",r._v$3=o),u!==r._v$4&&(0,e.setAttribute)(t,"aria-selected",r._v$4=u),r},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0}),t})()},get children(){return[(0,e.createComponent)(t.Match,{get when(){return Array.isArray(l[n.fieldNames.children])},get children(){return(0,e.createComponent)(a,{})}}),(0,e.createComponent)(t.Match,{get when(){return Array.isArray(l[n.fieldNames.options])},get children(){let t=v(),r=t.firstChild;return(0,e.addEventListener)(t,"mousedown",O,!0),(0,e.insert)(r,(0,e.createComponent)(i,{})),(0,e.insert)(t,(0,e.createComponent)(S,{get fieldNames(){return n.fieldNames},get list(){return l[n.fieldNames.options]}}),null),(0,e.effect)(()=>(0,e.className)(t,(0,s.cx)("menu-group",l.class))),t}})]}})}})}return(0,t.createEffect)(()=>{void 0!==y.value&&null!==y.value?w(Array.isArray(y.value)?y.value:[y.value]):w([])}),(0,t.createEffect)(()=>{Array.isArray(y.openKeys)&&A(y.openKeys)}),(0,t.createEffect)(()=>{_()?.length&&(0,n.default)(()=>{let e=c?.querySelector("[aria-selected=true]");if(e&&c){let t=e.offsetTop-c.offsetTop;t<c.scrollTop?c.scrollTo({top:t,behavior:"smooth"}):e.offsetTop+e.offsetHeight>c.scrollTop+c.offsetHeight+c.offsetTop&&c.scrollTo({top:t-c.offsetHeight+e.offsetHeight,behavior:"smooth"})}})}),[(()=>{let t=h();return(0,e.insert)(t,N,null),(0,e.insert)(t,i.style,null),(0,e.insert)(t,q,null),(0,e.insert)(t,()=>(0,s.css)(y.css),null),t})(),(()=>{let t=b(),n=c;return"function"==typeof n?(0,e.use)(n,t):c=t,(0,e.spread)(t,E,!1,!0),(0,e.insert)(t,(0,e.createComponent)(S,{get fieldNames(){return x()},get list(){return k()}})),t})()]}(0,l.customElement)("n-menu",{class:void 0,css:void 0,disabled:void 0,value:void 0,defaultValue:void 0,onOpenChange:void 0,openKeys:void 0,fieldNames:void 0,multiple:void 0,toggle:void 0,onChange:void 0,items:[]},(e,n)=>{let r=n.element,s={css:r.css,onChange(e,t){r.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))},onOpenChange(e){r.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},l=(0,t.mergeProps)(s,e);return(0,t.createEffect)(()=>{r.removeAttribute("items"),r.removeAttribute("field-names"),r.removeAttribute("css")}),(0,t.createComponent)(C,l)});const N=C;(0,e.delegateEvents)(["click","mousedown"]);
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return N}});const e=require("solid-js/web"),t=require("solid-js"),n=c(require("@moneko/common/lib/frameCallback")),r=c(require("@moneko/common/lib/isFunction")),s=require("@moneko/css"),l=require("solid-element"),i=require("./style"),o=require("../basic-config"),a=c(require("../get-options")),u=c(require("../theme"));function c(e){return e&&e.__esModule?e:{default:e}}const d=(0,e.template)('<span class="menu-icon" part="icon">'),m=(0,e.template)('<span class="menu-suffix" part="suffix">'),f=(0,e.template)('<div class="sub-menu-children" part="sub-menu-children"><div>'),p=(0,e.template)('<div part="sub-menu"><span class="sub-menu-title"><span class="menu-arrow">'),v=(0,e.template)('<div><span class="menu-group-title">'),g=(0,e.template)('<div part="item">'),h=(0,e.template)("<style>"),b=(0,e.template)('<section class="menu" part="menu">');function C(l){let c;let{isDark:C,baseStyle:N}=u.default,[_,y]=(0,t.splitProps)(l,["class","css","items","fieldNames","value","disabled","toggle","multiple","onChange","onOpenChange","openKeys"]),[$,E]=(0,t.createSignal)([]),[w,A]=(0,t.createSignal)([]),q=(0,t.createMemo)(()=>`:host {--sub-menu-bg: ${C()?"rgb(255 255 255 / 1%)":"rgb(0 0 0 / 1%)"} ;}`),x=(0,t.createMemo)(()=>Object.assign({},o.FieldName,_.fieldNames)),k=(0,t.createMemo)(()=>(0,a.default)(_.items,x()));function O(e){e.preventDefault(),e.stopPropagation()}function L(e,t){if(t.preventDefault(),!e.disabled&&!_.disabled){let t=[...$()],n=e[x().value];if(_.multiple){let e=t.indexOf(n);-1===e?t.push(n):t.splice(e,1)}else t=_.toggle&&t[0]===n?[]:[n];(0,r.default)(_.onChange)&&_.onChange(_.multiple?t:t[0],e),void 0===_.value&&E(t)}}function M(n){return(0,e.createComponent)(t.For,{get each(){return n.list},children:l=>{function i(){return[(0,e.createComponent)(t.Show,{get when(){return l[n.fieldNames.icon]},get children(){let t=d();return(0,e.insert)(t,()=>l[n.fieldNames.icon]),t}}),(0,e.memo)(()=>l[n.fieldNames.label]),(()=>{let t=m();return(0,e.insert)(t,()=>l[n.fieldNames.suffix]),t})()]}function o(){let o=(0,t.createMemo)(()=>w().includes(l[n.fieldNames.value])),[a,u]=(0,t.createSignal)((0,t.untrack)(o));function c(e){O(e);let t=w();t=t.includes(l[n.fieldNames.value])?t.filter(e=>e!==l[n.fieldNames.value]):t.concat(l[n.fieldNames.value]),(0,r.default)(_.onOpenChange)&&_.onOpenChange(t),void 0===_.openKeys&&A(t)}function d(){let r;let[s,i]=(0,t.createSignal)();function a(){o()||u(!1)}return(0,t.createEffect)(()=>{i(r?.offsetHeight||0)}),(()=>{let t=f(),i=t.firstChild,o=r;return(0,e.addEventListener)(t,"animationend",a),"function"==typeof o?(0,e.use)(o,i):r=i,(0,e.insert)(i,(0,e.createComponent)(M,{get fieldNames(){return n.fieldNames},get list(){return l[n.fieldNames.children]}})),(0,e.effect)(()=>(s(),t.style.setProperty("--h",`${s()}px`))),t})()}return(0,t.createEffect)(()=>{o()&&u(!0)}),(()=>{let n=p(),r=n.firstChild,u=r.firstChild;return(0,e.addEventListener)(n,"mousedown",O,!0),(0,e.addEventListener)(r,"click",c,!0),(0,e.insert)(r,(0,e.createComponent)(i,{}),u),(0,e.insert)(n,(0,e.createComponent)(t.Show,{get when(){return a()},get children(){return(0,e.createComponent)(d,{})}}),null),(0,e.effect)(t=>{let r=(0,s.cx)("sub-menu",l.class),i=!!o(),a=!o();return r!==t._v$&&(0,e.className)(n,t._v$=r),i!==t._v$2&&n.classList.toggle("sub-menu-open",t._v$2=i),a!==t._v$3&&n.classList.toggle("sub-menu-close",t._v$3=a),t},{_v$:void 0,_v$2:void 0,_v$3:void 0}),n})()}return(0,e.createComponent)(t.Switch,{get fallback(){return(()=>{let t=g();return(0,e.addEventListener)(t,"click",L.bind(null,l),!0),(0,e.addEventListener)(t,"mousedown",O,!0),(0,e.insert)(t,(0,e.createComponent)(i,{})),(0,e.effect)(r=>{let i=(0,s.cx)("menu-item",l.class,l.type),o=l.handleClosed,a=_.disabled||l.disabled,u=$().includes(l[n.fieldNames.value]);return i!==r._v$4&&(0,e.className)(t,r._v$4=i),o!==r._v$5&&(0,e.setAttribute)(t,"handle-closed",r._v$5=o),a!==r._v$6&&(0,e.setAttribute)(t,"aria-disabled",r._v$6=a),u!==r._v$7&&(0,e.setAttribute)(t,"aria-selected",r._v$7=u),r},{_v$4:void 0,_v$5:void 0,_v$6:void 0,_v$7:void 0}),t})()},get children(){return[(0,e.createComponent)(t.Match,{get when(){return Array.isArray(l[n.fieldNames.children])},get children(){return(0,e.createComponent)(o,{})}}),(0,e.createComponent)(t.Match,{get when(){return Array.isArray(l[n.fieldNames.options])},get children(){let t=v(),r=t.firstChild;return(0,e.addEventListener)(t,"mousedown",O,!0),(0,e.insert)(r,(0,e.createComponent)(i,{})),(0,e.insert)(t,(0,e.createComponent)(M,{get fieldNames(){return n.fieldNames},get list(){return l[n.fieldNames.options]}}),null),(0,e.effect)(()=>(0,e.className)(t,(0,s.cx)("menu-group",l.class))),t}})]}})}})}return(0,t.createEffect)(()=>{void 0!==_.value&&null!==_.value?E(Array.isArray(_.value)?_.value:[_.value]):E([])}),(0,t.createEffect)(()=>{Array.isArray(_.openKeys)&&A(_.openKeys)}),(0,t.createEffect)(()=>{$()?.length&&(0,n.default)(()=>{let e=c?.querySelector("[aria-selected=true]");if(e&&c){let t=e.offsetTop-c.offsetTop;t<c.scrollTop?c.scrollTo({top:t,behavior:"smooth"}):e.offsetTop+e.offsetHeight>c.scrollTop+c.offsetHeight+c.offsetTop&&c.scrollTo({top:t-c.offsetHeight+e.offsetHeight,behavior:"smooth"})}})}),[(()=>{let t=h();return(0,e.insert)(t,N,null),(0,e.insert)(t,i.style,null),(0,e.insert)(t,q,null),(0,e.insert)(t,()=>(0,s.css)(_.css),null),t})(),(()=>{let t=b(),n=c;return"function"==typeof n?(0,e.use)(n,t):c=t,(0,e.spread)(t,y,!1,!0),(0,e.insert)(t,(0,e.createComponent)(M,{get fieldNames(){return x()},get list(){return k()}})),t})()]}(0,l.customElement)("n-menu",{class:void 0,css:void 0,disabled:void 0,value:void 0,defaultValue:void 0,onOpenChange:void 0,openKeys:void 0,fieldNames:void 0,multiple:void 0,toggle:void 0,onChange:void 0,items:[]},(n,r)=>{let s=r.element,l={css:s.css,onChange(e,t){s.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))},onOpenChange(e){s.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},i=(0,t.mergeProps)(l,n);return(0,t.createEffect)(()=>{s.removeAttribute("items"),s.removeAttribute("field-names"),s.removeAttribute("css")}),(0,e.createComponent)(C,i)});const N=C;(0,e.delegateEvents)(["click","mousedown"]);
 //# sourceMappingURL=index.js.map

package/lib/menu/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/menu/index.tsx"],"sourcesContent":["import {\n  For,\n  Match,\n  Show,\n  Switch,\n  createComponent,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { frameCallback, isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { style } from './style';\nimport { FieldName } from '../basic-config';\nimport getOptions from '../get-options';\nimport theme from '../theme';\nimport type { BaseOption, BasicConfig, CustomElement } from '..';\n\nfunction Menu(props: MenuProps | MenuMultipleProps) {\n  let ref: HTMLDivElement | undefined;\n  const { isDark, baseStyle } = theme;\n  const [local, other] = splitProps(props, [\n    'class',\n    'css',\n    'items',\n    'fieldNames',\n    'value',\n    'disabled',\n    'toggle',\n    'multiple',\n    'onChange',\n    'onOpenChange',\n    'openKeys',\n  ]);\n  const [value, setValue] = createSignal<(string | number)[]>([]);\n  const [openKeys, setOpenKeys] = createSignal<(string | number)[]>([]);\n  const cssVar = createMemo(\n    () => `:host {--sub-menu-bg: ${isDark() ? 'rgb(255 255 255 / 1%)' : 'rgb(0 0 0 / 1%)'} ;}`,\n  );\n  const fieldNames = createMemo(() => Object.assign({}, FieldName, local.fieldNames));\n  const options = createMemo(() => getOptions(local.items, fieldNames()));\n\n  function preventDefault(e: MouseEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n  }\n\n  function change(item: MenuOption, e: MouseEvent) {\n    e.preventDefault();\n    if (!item.disabled && !local.disabled) {\n      let _value = [...value()];\n      const key = item[fieldNames().value]!;\n\n      if (local.multiple) {\n        const idx = _value.indexOf(key);\n\n        if (idx === -1) {\n          _value.push(key);\n        } else {\n          _value.splice(idx, 1);\n        }\n      } else if (local.toggle && _value[0] === key) {\n        _value = [];\n      } else {\n        _value = [key];\n      }\n      if (isFunction(local.onChange)) {\n        local.onChange((local.multiple ? _value : _value[0]) as never, item);\n      }\n      if (typeof local.value === 'undefined') {\n        setValue(_value);\n      }\n    }\n  }\n\n  interface RenderMenuProps {\n    list: MenuOption[];\n    fieldNames: { [key in keyof typeof FieldName]: string };\n  }\n  function RenderMenu(_: RenderMenuProps) {\n    return (\n      <For each={_.list}>\n        {(item) => {\n          function RowTitle() {\n            return (\n              <>\n                <Show when={item[_.fieldNames.icon]}>\n                  <span class=\"menu-icon\" part=\"icon\">\n                    {item[_.fieldNames.icon]}\n                  </span>\n                </Show>\n                {item[_.fieldNames.label]}\n                <span class=\"menu-suffix\" part=\"suffix\">\n                  {item[_.fieldNames.suffix]}\n                </span>\n              </>\n            );\n          }\n\n          function SubMenu() {\n            const isOpen = createMemo(() => openKeys().includes(item[_.fieldNames.value]!));\n            const [show, setShow] = createSignal<boolean>(untrack(isOpen));\n\n            createEffect(() => {\n              if (isOpen()) {\n                setShow(true);\n              }\n            });\n            function handleOpen(e: MouseEvent) {\n              preventDefault(e);\n              let _openKeys = openKeys();\n\n              if (_openKeys.includes(item[_.fieldNames.value]!)) {\n                _openKeys = _openKeys.filter((v) => v !== item[_.fieldNames.value]);\n              } else {\n                _openKeys = _openKeys.concat(item[_.fieldNames.value]!);\n              }\n\n              if (isFunction(local.onOpenChange)) {\n                local.onOpenChange(_openKeys);\n              }\n              if (local.openKeys === void 0) {\n                setOpenKeys(_openKeys);\n              }\n            }\n            function Child() {\n              let el: HTMLDivElement | undefined;\n              const [hei, setHei] = createSignal();\n\n              createEffect(() => {\n                setHei(el?.offsetHeight || 0);\n              });\n              function onAnimationEnd() {\n                if (!isOpen()) {\n                  setShow(false);\n                }\n              }\n              return (\n                <div\n                  class=\"sub-menu-children\"\n                  part=\"sub-menu-children\"\n                  style={{\n                    '--h': `${hei()}px`,\n                  }}\n                  onAnimationEnd={onAnimationEnd}\n                >\n                  <div ref={el}>\n                    <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.children]!} />\n                  </div>\n                </div>\n              );\n            }\n\n            return (\n              <div\n                class={cx('sub-menu', item.class, `sub-menu-${isOpen() ? 'open' : 'close'}`)}\n                part=\"sub-menu\"\n                onMouseDown={preventDefault}\n              >\n                <span class=\"sub-menu-title\" onClick={handleOpen}>\n                  <RowTitle />\n                  <span class=\"menu-arrow\" />\n                </span>\n                <Show when={show()}>\n                  <Child />\n                </Show>\n              </div>\n            );\n          }\n          return (\n            <Switch\n              fallback={\n                <div\n                  class={cx('menu-item', item.class, item.type)}\n                  part=\"item\"\n                  handle-closed={item.handleClosed}\n                  aria-disabled={local.disabled || item.disabled}\n                  aria-selected={value().includes(item[_.fieldNames.value]!)}\n                  onMouseDown={preventDefault}\n                  onClick={change.bind(null, item)}\n                >\n                  <RowTitle />\n                </div>\n              }\n            >\n              <Match when={Array.isArray(item[_.fieldNames.children])}>\n                <SubMenu />\n              </Match>\n              <Match when={Array.isArray(item[_.fieldNames.options])}>\n                <div class={cx('menu-group', item.class)} onMouseDown={preventDefault}>\n                  <span class=\"menu-group-title\">\n                    <RowTitle />\n                  </span>\n                  <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.options]!} />\n                </div>\n              </Match>\n            </Switch>\n          );\n        }}\n      </For>\n    );\n  }\n\n  createEffect(() => {\n    if (local.value !== void 0 && local.value !== null) {\n      setValue(Array.isArray(local.value) ? local.value : [local.value]);\n    } else {\n      setValue([]);\n    }\n  });\n  createEffect(() => {\n    if (Array.isArray(local.openKeys)) {\n      setOpenKeys(local.openKeys);\n    }\n  });\n\n  createEffect(() => {\n    if (value()?.length) {\n      frameCallback(() => {\n        const el = ref?.querySelector<HTMLElement>('[aria-selected=true]');\n\n        if (el && ref) {\n          const next = el.offsetTop - ref.offsetTop;\n\n          if (next < ref.scrollTop) {\n            ref.scrollTo({\n              top: next,\n              behavior: 'smooth',\n            });\n          } else if (\n            el.offsetTop + el.offsetHeight >\n            ref.scrollTop + ref.offsetHeight + ref.offsetTop\n          ) {\n            ref.scrollTo({\n              top: next - ref.offsetHeight + el.offsetHeight,\n              behavior: 'smooth',\n            });\n          }\n        }\n      });\n    }\n  });\n  return (\n    <>\n      <style>\n        {baseStyle()}\n        {style}\n        {cssVar()}\n        {css(local.css)}\n      </style>\n      <section ref={ref} class=\"menu\" part=\"menu\" {...other}>\n        <RenderMenu fieldNames={fieldNames()} list={options()} />\n      </section>\n    </>\n  );\n}\n\nexport interface BaseMenuProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** 菜单展开的keys */\n  openKeys?: (string | number)[];\n  /** 菜单展开时触发的方法 */\n  onOpenChange?: (keys: (string | number)[]) => void;\n  /** 选项数据 */\n  items?: (string | MenuOption)[];\n  /** 自定义节点 'label'、'value'、'options' 的字段 */\n  fieldNames?: BasicConfig['fieldName'];\n  /** 不可用状态 */\n  disabled?: boolean;\n  /** 可以取消 */\n  toggle?: boolean;\n}\n\nexport interface MenuProps extends BaseMenuProps {\n  /** 值修改时的回调方法 */\n  onChange?(val: string | number, item: MenuOption): void;\n  /** 值 */\n  value?: string | number;\n  /** 默认值 */\n  defaultValue?: string | number;\n  /** 可多选\n   * @default false\n   */\n  multiple?: false | never;\n}\n\nexport interface MenuMultipleProps extends BaseMenuProps {\n  /** 可多选\n   * @default true\n   */\n  multiple: true;\n  /** 值修改时的回调方法 */\n  onChange?(val: (string | number)[], item: MenuOption): void;\n  /** 值 */\n  value?: (string | number)[];\n  /** 默认值 */\n  defaultValue?: (string | number)[];\n}\n\n/** 菜单选项 */\nexport interface MenuOption extends Omit<BaseOption, 'children' | 'options'> {\n  /** 图标 */\n  icon?: JSX.Element;\n  /** 内置类型(状态) */\n  type?: 'primary' | 'success' | 'error' | 'warning';\n  /** 自定义颜色 */\n  color?: string;\n  /** 子菜单 */\n  children?: (string | MenuOption)[];\n  /** 分组子选项 */\n  options?: (string | MenuOption)[];\n}\n\nexport type MenuElement = CustomElement<MenuProps, 'onChange' | 'onOpenChange'>;\nexport type MenuMultipleElement = CustomElement<MenuMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<MenuProps>(\n  'n-menu',\n  {\n    class: void 0,\n    css: void 0,\n    disabled: void 0,\n    value: void 0,\n    defaultValue: void 0,\n    onOpenChange: void 0,\n    openKeys: void 0,\n    fieldNames: void 0,\n    multiple: void 0,\n    toggle: void 0,\n    onChange: void 0,\n    items: [],\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const defaultProps: Partial<MenuProps> = {\n      css: el.css,\n      onChange(key, item) {\n        el.dispatchEvent(\n          new CustomEvent('change', {\n            detail: [key, item],\n          }),\n        );\n      },\n      onOpenChange(keys) {\n        el.dispatchEvent(\n          new CustomEvent('openchange', {\n            detail: keys,\n          }),\n        );\n      },\n    };\n    const props = mergeProps(defaultProps, _);\n\n    createEffect(() => {\n      el.removeAttribute('items');\n      el.removeAttribute('field-names');\n      el.removeAttribute('css');\n    });\n    return createComponent(Menu, props);\n  },\n);\n\nexport default Menu;\n"],"names":["Menu","props","ref","isDark","baseStyle","theme","local","other","splitProps","value","setValue","createSignal","openKeys","setOpenKeys","cssVar","createMemo","fieldNames","Object","assign","FieldName","options","getOptions","items","preventDefault","e","stopPropagation","change","item","disabled","_value","key","multiple","idx","indexOf","push","splice","toggle","isFunction","onChange","RenderMenu","_","For","list","RowTitle","Show","icon","label","suffix","SubMenu","isOpen","includes","show","setShow","untrack","handleOpen","_openKeys","filter","v","concat","onOpenChange","Child","el","hei","setHei","onAnimationEnd","createEffect","offsetHeight","children","cx","class","Switch","bind","type","handleClosed","Match","Array","isArray","length","frameCallback","querySelector","next","offsetTop","scrollTop","scrollTo","top","behavior","style","css","customElement","defaultValue","opt","element","defaultProps","dispatchEvent","CustomEvent","detail","keys","mergeProps","removeAttribute","createComponent"],"rangeMappings":"","mappings":"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"}
+{"version":3,"sources":["../../components/menu/index.tsx"],"sourcesContent":["import {\n  For,\n  Match,\n  Show,\n  Switch,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { frameCallback, isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { style } from './style';\nimport { FieldName } from '../basic-config';\nimport getOptions from '../get-options';\nimport theme from '../theme';\nimport type { BaseOption, BasicConfig, CustomElement } from '..';\n\nfunction Menu(props: MenuProps | MenuMultipleProps) {\n  let ref: HTMLDivElement | undefined;\n  const { isDark, baseStyle } = theme;\n  const [local, other] = splitProps(props, [\n    'class',\n    'css',\n    'items',\n    'fieldNames',\n    'value',\n    'disabled',\n    'toggle',\n    'multiple',\n    'onChange',\n    'onOpenChange',\n    'openKeys',\n  ]);\n  const [value, setValue] = createSignal<(string | number)[]>([]);\n  const [openKeys, setOpenKeys] = createSignal<(string | number)[]>([]);\n  const cssVar = createMemo(\n    () => `:host {--sub-menu-bg: ${isDark() ? 'rgb(255 255 255 / 1%)' : 'rgb(0 0 0 / 1%)'} ;}`,\n  );\n  const fieldNames = createMemo(() => Object.assign({}, FieldName, local.fieldNames));\n  const options = createMemo(() => getOptions(local.items, fieldNames()));\n\n  function preventDefault(e: MouseEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n  }\n\n  function change(item: MenuOption, e: MouseEvent) {\n    e.preventDefault();\n    if (!item.disabled && !local.disabled) {\n      let _value = [...value()];\n      const key = item[fieldNames().value]!;\n\n      if (local.multiple) {\n        const idx = _value.indexOf(key);\n\n        if (idx === -1) {\n          _value.push(key);\n        } else {\n          _value.splice(idx, 1);\n        }\n      } else if (local.toggle && _value[0] === key) {\n        _value = [];\n      } else {\n        _value = [key];\n      }\n      if (isFunction(local.onChange)) {\n        local.onChange((local.multiple ? _value : _value[0]) as never, item);\n      }\n      if (typeof local.value === 'undefined') {\n        setValue(_value);\n      }\n    }\n  }\n\n  interface RenderMenuProps {\n    list: MenuOption[];\n    fieldNames: { [key in keyof typeof FieldName]: string };\n  }\n  function RenderMenu(_: RenderMenuProps) {\n    return (\n      <For each={_.list}>\n        {(item) => {\n          function RowTitle() {\n            return (\n              <>\n                <Show when={item[_.fieldNames.icon]}>\n                  <span class=\"menu-icon\" part=\"icon\">\n                    {item[_.fieldNames.icon]}\n                  </span>\n                </Show>\n                {item[_.fieldNames.label]}\n                <span class=\"menu-suffix\" part=\"suffix\">\n                  {item[_.fieldNames.suffix]}\n                </span>\n              </>\n            );\n          }\n\n          function SubMenu() {\n            const isOpen = createMemo(() => openKeys().includes(item[_.fieldNames.value]!));\n            const [show, setShow] = createSignal<boolean>(untrack(isOpen));\n\n            createEffect(() => {\n              if (isOpen()) {\n                setShow(true);\n              }\n            });\n            function handleOpen(e: MouseEvent) {\n              preventDefault(e);\n              let _openKeys = openKeys();\n\n              if (_openKeys.includes(item[_.fieldNames.value]!)) {\n                _openKeys = _openKeys.filter((v) => v !== item[_.fieldNames.value]);\n              } else {\n                _openKeys = _openKeys.concat(item[_.fieldNames.value]!);\n              }\n\n              if (isFunction(local.onOpenChange)) {\n                local.onOpenChange(_openKeys);\n              }\n              if (local.openKeys === void 0) {\n                setOpenKeys(_openKeys);\n              }\n            }\n            function Child() {\n              let el: HTMLDivElement | undefined;\n              const [hei, setHei] = createSignal();\n\n              createEffect(() => {\n                setHei(el?.offsetHeight || 0);\n              });\n              function onAnimationEnd() {\n                if (!isOpen()) {\n                  setShow(false);\n                }\n              }\n              return (\n                <div\n                  class=\"sub-menu-children\"\n                  part=\"sub-menu-children\"\n                  style={{\n                    '--h': `${hei()}px`,\n                  }}\n                  onAnimationEnd={onAnimationEnd}\n                >\n                  <div ref={el}>\n                    <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.children]!} />\n                  </div>\n                </div>\n              );\n            }\n\n            return (\n              <div\n                class={cx('sub-menu', item.class)}\n                classList={{\n                  'sub-menu-open': isOpen(),\n                  'sub-menu-close': !isOpen(),\n                }}\n                part=\"sub-menu\"\n                onMouseDown={preventDefault}\n              >\n                <span class=\"sub-menu-title\" onClick={handleOpen}>\n                  <RowTitle />\n                  <span class=\"menu-arrow\" />\n                </span>\n                <Show when={show()}>\n                  <Child />\n                </Show>\n              </div>\n            );\n          }\n          return (\n            <Switch\n              fallback={\n                <div\n                  class={cx('menu-item', item.class, item.type)}\n                  part=\"item\"\n                  handle-closed={item.handleClosed}\n                  aria-disabled={local.disabled || item.disabled}\n                  aria-selected={value().includes(item[_.fieldNames.value]!)}\n                  onMouseDown={preventDefault}\n                  onClick={change.bind(null, item)}\n                >\n                  <RowTitle />\n                </div>\n              }\n            >\n              <Match when={Array.isArray(item[_.fieldNames.children])}>\n                <SubMenu />\n              </Match>\n              <Match when={Array.isArray(item[_.fieldNames.options])}>\n                <div class={cx('menu-group', item.class)} onMouseDown={preventDefault}>\n                  <span class=\"menu-group-title\">\n                    <RowTitle />\n                  </span>\n                  <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.options]!} />\n                </div>\n              </Match>\n            </Switch>\n          );\n        }}\n      </For>\n    );\n  }\n\n  createEffect(() => {\n    if (local.value !== void 0 && local.value !== null) {\n      setValue(Array.isArray(local.value) ? local.value : [local.value]);\n    } else {\n      setValue([]);\n    }\n  });\n  createEffect(() => {\n    if (Array.isArray(local.openKeys)) {\n      setOpenKeys(local.openKeys);\n    }\n  });\n\n  createEffect(() => {\n    if (value()?.length) {\n      frameCallback(() => {\n        const el = ref?.querySelector<HTMLElement>('[aria-selected=true]');\n\n        if (el && ref) {\n          const next = el.offsetTop - ref.offsetTop;\n\n          if (next < ref.scrollTop) {\n            ref.scrollTo({\n              top: next,\n              behavior: 'smooth',\n            });\n          } else if (\n            el.offsetTop + el.offsetHeight >\n            ref.scrollTop + ref.offsetHeight + ref.offsetTop\n          ) {\n            ref.scrollTo({\n              top: next - ref.offsetHeight + el.offsetHeight,\n              behavior: 'smooth',\n            });\n          }\n        }\n      });\n    }\n  });\n  return (\n    <>\n      <style>\n        {baseStyle()}\n        {style}\n        {cssVar()}\n        {css(local.css)}\n      </style>\n      <section ref={ref} class=\"menu\" part=\"menu\" {...other}>\n        <RenderMenu fieldNames={fieldNames()} list={options()} />\n      </section>\n    </>\n  );\n}\n\nexport interface BaseMenuProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** 菜单展开的keys */\n  openKeys?: (string | number)[];\n  /** 菜单展开时触发的方法 */\n  onOpenChange?: (keys: (string | number)[]) => void;\n  /** 选项数据 */\n  items?: (string | MenuOption)[];\n  /** 自定义节点 'label'、'value'、'options' 的字段 */\n  fieldNames?: BasicConfig['fieldName'];\n  /** 不可用状态 */\n  disabled?: boolean;\n  /** 可以取消 */\n  toggle?: boolean;\n}\n\nexport interface MenuProps extends BaseMenuProps {\n  /** 值修改时的回调方法 */\n  onChange?(val: string | number, item: MenuOption): void;\n  /** 值 */\n  value?: string | number;\n  /** 默认值 */\n  defaultValue?: string | number;\n  /** 可多选\n   * @default false\n   */\n  multiple?: false | never;\n}\n\nexport interface MenuMultipleProps extends BaseMenuProps {\n  /** 可多选\n   * @default true\n   */\n  multiple: true;\n  /** 值修改时的回调方法 */\n  onChange?(val: (string | number)[], item: MenuOption): void;\n  /** 值 */\n  value?: (string | number)[];\n  /** 默认值 */\n  defaultValue?: (string | number)[];\n}\n\n/** 菜单选项 */\nexport interface MenuOption extends Omit<BaseOption, 'children' | 'options'> {\n  /** 图标 */\n  icon?: JSX.Element;\n  /** 内置类型(状态) */\n  type?: 'primary' | 'success' | 'error' | 'warning';\n  /** 自定义颜色 */\n  color?: string;\n  /** 子菜单 */\n  children?: (string | MenuOption)[];\n  /** 分组子选项 */\n  options?: (string | MenuOption)[];\n}\n\nexport type MenuElement = CustomElement<MenuProps, 'onChange' | 'onOpenChange'>;\nexport type MenuMultipleElement = CustomElement<MenuMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<MenuProps>(\n  'n-menu',\n  {\n    class: void 0,\n    css: void 0,\n    disabled: void 0,\n    value: void 0,\n    defaultValue: void 0,\n    onOpenChange: void 0,\n    openKeys: void 0,\n    fieldNames: void 0,\n    multiple: void 0,\n    toggle: void 0,\n    onChange: void 0,\n    items: [],\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const defaultProps: Partial<MenuProps> = {\n      css: el.css,\n      onChange(key, item) {\n        el.dispatchEvent(\n          new CustomEvent('change', {\n            detail: [key, item],\n          }),\n        );\n      },\n      onOpenChange(keys) {\n        el.dispatchEvent(\n          new CustomEvent('openchange', {\n            detail: keys,\n          }),\n        );\n      },\n    };\n    const props = mergeProps(defaultProps, _);\n\n    createEffect(() => {\n      el.removeAttribute('items');\n      el.removeAttribute('field-names');\n      el.removeAttribute('css');\n    });\n    return <Menu {...props} />;\n  },\n);\n\nexport default Menu;\n"],"names":["Menu","props","ref","isDark","baseStyle","theme","local","other","splitProps","value","setValue","createSignal","openKeys","setOpenKeys","cssVar","createMemo","fieldNames","Object","assign","FieldName","options","getOptions","items","preventDefault","e","stopPropagation","change","item","disabled","_value","key","multiple","idx","indexOf","push","splice","toggle","isFunction","onChange","RenderMenu","_","For","list","RowTitle","Show","icon","label","suffix","SubMenu","isOpen","includes","show","setShow","untrack","handleOpen","_openKeys","filter","v","concat","onOpenChange","Child","el","hei","setHei","onAnimationEnd","createEffect","offsetHeight","children","cx","class","Switch","bind","type","handleClosed","Match","Array","isArray","length","frameCallback","querySelector","next","offsetTop","scrollTop","scrollTo","top","behavior","style","css","customElement","defaultValue","opt","element","defaultProps","dispatchEvent","CustomEvent","detail","keys","mergeProps","removeAttribute"],"rangeMappings":"","mappings":"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"}

package/lib/modal/index.js

@@ -1,2 +1,2 @@
-"use strict";var e,t,n;Object.defineProperty(exports,"__esModule",{value:!0}),function(e,t){for(var n in t)Object.defineProperty(e,n,{enumerable:!0,get:t[n]})}(exports,{OpenState:function(){return e},default:function(){return g}});const o=require("solid-js/web"),l=require("solid-js"),r=require("@moneko/css"),c=require("solid-element"),s=(n=require("./store"))&&n.__esModule?n:{default:n},i=require("./style");require("../button");const a=(0,o.template)('<span class="modal-close">'),d=(0,o.template)('<n-button class="modal-close">',!0,!1),u=(0,o.template)("<style>"),m=(0,o.template)(`<n-button class="modal-close">⛌`,!0,!1),p=(0,o.template)('<div><div class="modal-content"><div class="modal-header"><strong class="modal-title"></strong></div><div class="modal-body">');function f(e){let t;let n=document.documentElement,{setNum:c}=s.default,[f,g]=(0,l.createSignal)("closed"),[v,h]=(0,l.createSignal)({x:0,y:0,width:0,height:0}),k=(0,l.createMemo)(()=>{let{x:e,y:t,width:n,height:o}=v();return`.portal { --y: ${-(t-o/2)}px;--x: ${-(e-n/2)}px;}`});function E(t){g(t),e.onOpenChange?.(t)}function b(e){e.preventDefault()}function w(t){b(t),"keydown"===t.type?e.escClosable&&"Escape"===t.key&&E("closeing"):E("closeing")}function C(){"closeing"===f()&&E("closed")}function y(n){b(n),e.maskClosable&&n.target===t&&E("closeing")}function L(e){h(t=>({...t,x:n.clientWidth/2-e.clientX,y:n.clientHeight/2-e.clientY}))}(0,l.createEffect)(()=>{void 0!==e.open&&e.open!==(0,l.untrack)(f)&&g(e.open)}),(0,l.createEffect)(()=>{"open"===f()?(c(e=>e+1),n.addEventListener("mousewheel",b,{passive:!1}),e.escClosable&&n.addEventListener("keydown",w,!1)):"closeing"===f()?c(e=>e-1):n.addEventListener("click",L,!0),(0,l.onCleanup)(()=>{n.removeEventListener("mousewheel",b,!1),n.removeEventListener("keydown",w,!1),n.removeEventListener("click",L,!0)})});let x=(0,l.createMemo)(()=>null===e.closeIcon||!1===e.closeIcon?null:["function","object"].includes(typeof e.closeIcon)?()=>(()=>{let t=a();return(0,o.insert)(t,()=>e.closeIcon),t})():()=>(()=>{let t=d();return(0,o.addEventListener)(t,"click",w,!0),t.danger=!0,t.circle=!0,t.flat=!0,t._$owner=(0,o.getOwner)(),(0,o.insert)(t,()=>e.closeIcon),t})());return(0,o.createComponent)(l.Show,{get when(){return"closed"!==f()},get children(){return(0,o.createComponent)(o.Portal,{useShadow:!0,get children(){return[(()=>{let e=u();return(0,o.insert)(e,k,null),(0,o.insert)(e,i.style,null),e})(),(()=>{let n=p(),c=t,s=n.firstChild,i=s.firstChild,a=i.firstChild,d=i.nextSibling;return(0,o.addEventListener)(n,"click",y,!0),(0,o.addEventListener)(n,"animationend",C),"function"==typeof c?(0,o.use)(c,n):t=n,(0,o.insert)(a,()=>e.title),(0,o.insert)(s,(0,o.createComponent)(l.Show,{get when(){return void 0===e.closeIcon},get fallback(){return x()},get children(){let e=m();return(0,o.addEventListener)(e,"click",w,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=(0,o.getOwner)(),e}}),d),(0,o.insert)(d,()=>e.content),(0,o.effect)(()=>(0,o.className)(n,(0,r.cx)("portal","open"===f()?"open":"closeing",e.maskBlur&&"mask-blur"))),n})()]}})}})}(t=e||(e={})).closed="closed",t.closeing="closeing",t.open="open",(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},(e,t)=>{let n=(0,l.mergeProps)({onOpenChange(e){t.element.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return(0,l.createComponent)(f,n)});const g=f;(0,o.delegateEvents)(["click"]);
+"use strict";var e,t,n;Object.defineProperty(exports,"__esModule",{value:!0}),function(e,t){for(var n in t)Object.defineProperty(e,n,{enumerable:!0,get:t[n]})}(exports,{OpenState:function(){return e},default:function(){return m}});const o=require("solid-js/web"),l=require("solid-js"),s=require("solid-element"),r=(n=require("./store"))&&n.__esModule?n:{default:n},c=require("./style");require("../button");const i=(0,o.template)('<span class="modal-close">'),a=(0,o.template)('<n-button class="modal-close">',!0,!1),d=(0,o.template)("<style>"),u=(0,o.template)(`<n-button class="modal-close">⛌`,!0,!1),v=(0,o.template)('<div class="portal"><div class="modal-content"><div class="modal-header"><strong class="modal-title"></strong></div><div class="modal-body">');function p(e){let t;let n=document.documentElement,{setNum:s}=r.default,[p,m]=(0,l.createSignal)("closed"),[g,f]=(0,l.createSignal)({x:0,y:0,width:0,height:0}),h=(0,l.createMemo)(()=>{let{x:e,y:t,width:n,height:o}=g();return`.portal { --y: ${-(t-o/2)}px;--x: ${-(e-n/2)}px;}`});function E(t){m(t),e.onOpenChange?.(t)}function b(e){e.preventDefault()}function k(t){b(t),"keydown"===t.type?e.escClosable&&"Escape"===t.key&&E("closeing"):E("closeing")}function w(){"closeing"===p()&&E("closed")}function C(n){b(n),e.maskClosable&&n.target===t&&E("closeing")}function y(e){f(t=>({...t,x:n.clientWidth/2-e.clientX,y:n.clientHeight/2-e.clientY}))}(0,l.createEffect)(()=>{void 0!==e.open&&e.open!==(0,l.untrack)(p)&&m(e.open)}),(0,l.createEffect)(()=>{"open"===p()?(s(e=>e+1),n.addEventListener("mousewheel",b,{passive:!1}),e.escClosable&&n.addEventListener("keydown",k,!1)):"closeing"===p()?s(e=>e-1):n.addEventListener("click",y,!0),(0,l.onCleanup)(()=>{n.removeEventListener("mousewheel",b,!1),n.removeEventListener("keydown",k,!1),n.removeEventListener("click",y,!0)})});let _=(0,l.createMemo)(()=>null===e.closeIcon||!1===e.closeIcon?null:["function","object"].includes(typeof e.closeIcon)?()=>(()=>{let t=i();return(0,o.insert)(t,()=>e.closeIcon),t})():()=>(()=>{let t=a();return(0,o.addEventListener)(t,"click",k,!0),t.danger=!0,t.circle=!0,t.flat=!0,t._$owner=(0,o.getOwner)(),(0,o.insert)(t,()=>e.closeIcon),t})());return(0,o.createComponent)(l.Show,{get when(){return"closed"!==p()},get children(){return(0,o.createComponent)(o.Portal,{useShadow:!0,get children(){return[(()=>{let e=d();return(0,o.insert)(e,h,null),(0,o.insert)(e,c.style,null),e})(),(()=>{let n=v(),s=t,r=n.firstChild,c=r.firstChild,i=c.firstChild,a=c.nextSibling;return(0,o.addEventListener)(n,"click",C,!0),(0,o.addEventListener)(n,"animationend",w),"function"==typeof s?(0,o.use)(s,n):t=n,(0,o.insert)(i,()=>e.title),(0,o.insert)(r,(0,o.createComponent)(l.Show,{get when(){return void 0===e.closeIcon},get fallback(){return _()},get children(){let e=u();return(0,o.addEventListener)(e,"click",k,!0),e.danger=!0,e.circle=!0,e.flat=!0,e._$owner=(0,o.getOwner)(),e}}),a),(0,o.insert)(a,()=>e.content),(0,o.effect)(t=>{let o=!("open"!==p()),l="open"!==p(),s=!!e.maskBlur;return o!==t._v$&&n.classList.toggle("open",t._v$=o),l!==t._v$2&&n.classList.toggle("closeing",t._v$2=l),s!==t._v$3&&n.classList.toggle("mask-blur",t._v$3=s),t},{_v$:void 0,_v$2:void 0,_v$3:void 0}),n})()]}})}})}(t=e||(e={})).closed="closed",t.closeing="closeing",t.open="open",(0,s.customElement)("n-modal",{open:"closed",maskClosable:!0,escClosable:!0,onOpenChange:void 0,closeIcon:void 0,content:void 0,title:void 0,maskBlur:void 0},(e,t)=>{let n=(0,l.mergeProps)({onOpenChange(e){t.element.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return(0,o.createComponent)(p,n)});const m=p;(0,o.delegateEvents)(["click"]);
 //# sourceMappingURL=index.js.map

package/lib/modal/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/modal/index.tsx"],"sourcesContent":["import {\n  Show,\n  createComponent,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  untrack,\n} from 'solid-js';\nimport { cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { Portal } from 'solid-js/web';\nimport modalStore from './store';\nimport { style } from './style';\nimport '../button';\nimport type { CustomElement } from '..';\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?: JSX.Element | null;\n  /** 内容 */\n  content: JSX.Element;\n  /** 标题 */\n  title?: JSX.Element;\n  /** 遮罩模糊\n   * @default false\n   */\n  maskBlur?: 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(props: ModalProps) {\n  const doc = document.documentElement;\n  const { setNum } = modalStore;\n  const [open, setOpen] = createSignal<OpenStateKey>('closed');\n  const [posi, setPosi] = createSignal({\n    x: 0,\n    y: 0,\n    width: 0,\n    height: 0,\n  });\n  let portal: 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;}`;\n  });\n\n  function openChange(visi: OpenStateKey) {\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  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 () => <span class=\"modal-close\">{props.closeIcon}</span>;\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  return (\n    <Show when={open() !== OpenState.closed}>\n      <Portal useShadow={true}>\n        <style>\n          {getCss()}\n          {style}\n        </style>\n        <div\n          ref={portal}\n          class={cx(\n            'portal',\n            open() === OpenState.open ? 'open' : 'closeing',\n            props.maskBlur && 'mask-blur',\n          )}\n          onAnimationEnd={handleDestroy}\n          onClick={portalClick}\n        >\n          <div class=\"modal-content\">\n            <div class=\"modal-header\">\n              <strong class=\"modal-title\">{props.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\">{props.content}</div>\n            {/* <div class=\"modal-footer\">{props.footer}</div> */}\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  },\n  (_, opt) => {\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    return createComponent(Modal, props);\n  },\n);\nexport default Modal;\n"],"names":["OpenState","Modal","props","portal","doc","document","documentElement","setNum","modalStore","open","setOpen","createSignal","posi","setPosi","x","y","width","height","getCss","createMemo","openChange","visi","onOpenChange","preventDefault","e","close","type","escClosable","key","handleDestroy","portalClick","maskClosable","target","point","prev","clientWidth","clientX","clientHeight","clientY","createEffect","untrack","addEventListener","passive","onCleanup","removeEventListener","closeIcon","includes","Show","Portal","style","title","content","cx","maskBlur","customElement","_","opt","mergeProps","element","dispatchEvent","CustomEvent","detail","createComponent"],"rangeMappings":"","mappings":"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"}
+{"version":3,"sources":["../../components/modal/index.tsx"],"sourcesContent":["import {\n  Show,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  untrack,\n} from 'solid-js';\nimport { customElement } from 'solid-element';\nimport { Portal } from 'solid-js/web';\nimport modalStore from './store';\nimport { style } from './style';\nimport '../button';\nimport type { CustomElement } from '..';\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?: JSX.Element | null;\n  /** 内容 */\n  content: JSX.Element;\n  /** 标题 */\n  title?: JSX.Element;\n  /** 遮罩模糊\n   * @default false\n   */\n  maskBlur?: 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(props: ModalProps) {\n  const doc = document.documentElement;\n  const { setNum } = modalStore;\n  const [open, setOpen] = createSignal<OpenStateKey>('closed');\n  const [posi, setPosi] = createSignal({\n    x: 0,\n    y: 0,\n    width: 0,\n    height: 0,\n  });\n  let portal: 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;}`;\n  });\n\n  function openChange(visi: OpenStateKey) {\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  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 () => <span class=\"modal-close\">{props.closeIcon}</span>;\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  return (\n    <Show when={open() !== OpenState.closed}>\n      <Portal useShadow={true}>\n        <style>\n          {getCss()}\n          {style}\n        </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 class=\"modal-content\">\n            <div class=\"modal-header\">\n              <strong class=\"modal-title\">{props.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\">{props.content}</div>\n            {/* <div class=\"modal-footer\">{props.footer}</div> */}\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  },\n  (_, opt) => {\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    return <Modal {...props} />;\n  },\n);\nexport default Modal;\n"],"names":["OpenState","Modal","props","portal","doc","document","documentElement","setNum","modalStore","open","setOpen","createSignal","posi","setPosi","x","y","width","height","getCss","createMemo","openChange","visi","onOpenChange","preventDefault","e","close","type","escClosable","key","handleDestroy","portalClick","maskClosable","target","point","prev","clientWidth","clientX","clientHeight","clientY","createEffect","untrack","addEventListener","passive","onCleanup","removeEventListener","closeIcon","includes","Show","Portal","style","title","content","maskBlur","customElement","_","opt","mergeProps","element","dispatchEvent","CustomEvent","detail"],"rangeMappings":"","mappings":"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"}

package/lib/notification/notification.js

@@ -1,2 +1,2 @@
-"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"),n=require("@moneko/css"),r=i(require("./queque")),l=require("./styles"),o=i(require("../theme"));function i(e){return e&&e.__esModule?e:{default:e}}const s=(0,e.template)("<style>"),c=(0,e.template)('<span class="close">'),u=(0,e.template)('<div><div class="content">'),a="n-notification-box",d=(i,d,m=3e3,h,f)=>{let p=(0,t.createUniqueId)(),{list:g,add:y,remove:q}=r.default,{baseStyle:w}=o.default,b=document.getElementById(a);if(y({type:i,icon:f,children:d,close:h,uniqueId:p}),m&&m>0){let e=setTimeout(()=>{q(p),clearTimeout(e)},m)}if(!b){(b=document.createElement("div")).id=a,b.style.position="fixed",b.style.insetBlockStart="16px",b.style.insetInlineStart="50%",b.style.transform="translateX(-50%)",b.attachShadow({mode:"open"});let r=(0,e.render)(()=>((0,t.createEffect)(()=>{0===g().length&&(r(),b?.remove())}),(0,e.createComponent)(t.Show,{get when(){return g().length},get children(){return[(()=>{let t=s();return(0,e.insert)(t,w,null),(0,e.insert)(t,l.styles,null),t})(),(0,e.createComponent)(t.For,{get each(){return g()},children:r=>(()=>{let l=u(),o=l.firstChild;return(0,e.insert)(l,(0,e.createComponent)(t.Show,{get when(){return r.icon},get children(){return r.icon}}),o),(0,e.insert)(o,()=>r.children),(0,e.insert)(l,(0,e.createComponent)(t.Show,{get when(){return r.close},get children(){let e=c();return e.$$click=()=>q(r.uniqueId),e}}),null),(0,e.effect)(()=>(0,e.className)(l,(0,n.cx)("notification",r.type,r.closeing&&"closeing"))),l})()})]}})),b.shadowRoot);document.body.appendChild(b)}return p};(0,e.delegateEvents)(["click"]);
+"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"),n=require("@moneko/css"),r=i(require("./queque")),l=require("./styles"),o=i(require("../theme"));function i(e){return e&&e.__esModule?e:{default:e}}const s=(0,e.template)("<style>"),c=(0,e.template)('<span class="close">'),u=(0,e.template)('<div><div class="content">'),a="n-notification-box",d=(i,d,m=3e3,h,f)=>{let p=(0,t.createUniqueId)(),{list:g,add:v,remove:y}=r.default,{baseStyle:q}=o.default,_=document.getElementById(a);if(v({type:i,icon:f,children:d,close:h,uniqueId:p}),m&&m>0){let e=setTimeout(()=>{y(p),clearTimeout(e)},m)}if(!_){(_=document.createElement("div")).id=a,_.style.position="fixed",_.style.insetBlockStart="16px",_.style.insetInlineStart="50%",_.style.transform="translateX(-50%)",_.attachShadow({mode:"open"});let r=(0,e.render)(()=>((0,t.createEffect)(()=>{0===g().length&&(r(),_?.remove())}),(0,e.createComponent)(t.Show,{get when(){return g().length},get children(){return[(()=>{let t=s();return(0,e.insert)(t,q,null),(0,e.insert)(t,l.styles,null),t})(),(0,e.createComponent)(t.For,{get each(){return g()},children:r=>(()=>{let l=u(),o=l.firstChild;return(0,e.insert)(l,(0,e.createComponent)(t.Show,{get when(){return r.icon},get children(){return r.icon}}),o),(0,e.insert)(o,()=>r.children),(0,e.insert)(l,(0,e.createComponent)(t.Show,{get when(){return r.close},get children(){let e=c();return e.$$click=()=>y(r.uniqueId),e}}),null),(0,e.effect)(t=>{let o=(0,n.cx)("notification",r.type),i=!!r.closeing;return o!==t._v$&&(0,e.className)(l,t._v$=o),i!==t._v$2&&l.classList.toggle("closeing",t._v$2=i),t},{_v$:void 0,_v$2:void 0}),l})()})]}})),_.shadowRoot);document.body.appendChild(_)}return p};(0,e.delegateEvents)(["click"]);
 //# sourceMappingURL=notification.js.map

package/lib/notification/notification.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/notification/notification.tsx"],"sourcesContent":["import { For, Show, createEffect, createUniqueId } from 'solid-js';\nimport { cx } from '@moneko/css';\nimport { render } from 'solid-js/web';\nimport queque, { type NotificationType } from './queque';\nimport { styles } from './styles';\nimport theme from '../theme';\n\nconst mountId = 'n-notification-box';\n\nconst notification = (\n  type: keyof typeof NotificationType,\n  children: JSX.Element,\n  duration = 3000,\n  close?: boolean,\n  icon?: JSX.Element,\n) => {\n  const uniqueId = createUniqueId();\n  const { list, add, remove } = queque;\n  const { baseStyle } = theme;\n  let mount = document.getElementById(mountId);\n\n  add({\n    type,\n    icon,\n    children,\n    close,\n    uniqueId,\n  });\n  if (duration && duration > 0) {\n    const timer = setTimeout(() => {\n      remove(uniqueId);\n      clearTimeout(timer);\n    }, duration);\n  }\n  if (!mount) {\n    mount = document.createElement('div');\n    mount.id = mountId;\n    mount.style.position = 'fixed';\n    mount.style.insetBlockStart = '16px';\n    mount.style.insetInlineStart = '50%';\n    mount.style.transform = 'translateX(-50%)';\n    mount.attachShadow({ mode: 'open' });\n\n    const unmount = render(() => {\n      createEffect(() => {\n        if (list().length === 0) {\n          unmount();\n          mount?.remove();\n        }\n      });\n      return (\n        <Show when={list().length}>\n          <style>\n            {baseStyle()}\n            {styles}\n          </style>\n          <For each={list()}>\n            {(item) => {\n              return (\n                <div class={cx('notification', item.type, item.closeing && 'closeing')}>\n                  <Show when={item.icon}>{item.icon}</Show>\n                  <div class=\"content\">{item.children}</div>\n                  <Show when={item.close}>\n                    <span class=\"close\" onClick={() => remove(item.uniqueId)} />\n                  </Show>\n                </div>\n              );\n            }}\n          </For>\n        </Show>\n      );\n    }, mount!.shadowRoot!);\n\n    document.body.appendChild(mount);\n  }\n  return uniqueId;\n};\n\nexport default notification;\n"],"names":["mountId","type","children","duration","close","icon","uniqueId","createUniqueId","list","add","remove","queque","baseStyle","theme","mount","document","getElementById","timer","setTimeout","clearTimeout","createElement","id","style","position","insetBlockStart","insetInlineStart","transform","attachShadow","mode","unmount","render","createEffect","length","Show","styles","For","item","cx","closeing","shadowRoot","body","appendChild"],"rangeMappings":"","mappings":"kGA8EA,+CAAA,qBA5EuB,0BAFiC,sBACrC,2BAE2B,uBACvB,wBACL,0LAEZA,EAAU,qBAuEhB,EArEqB,CACnBC,EACAC,EACAC,EAAW,GAAI,CACfC,EACAC,KAEA,IAAMC,EAAWC,GAAAA,gBAAc,IACzB,CAAEC,KAAAA,CAAI,CAAEC,IAAAA,CAAG,CAAEC,OAAAA,CAAM,CAAE,CAAGC,SAAM,CAC9B,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CACvBC,EAAQC,SAASC,cAAc,CAAChB,GASpC,GAPAS,EAAI,CACFR,KAAAA,EACAI,KAAAA,EACAH,SAAAA,EACAE,MAAAA,EACAE,SAAAA,CACF,GACIH,GAAYA,EAAW,EAAG,CAC5B,IAAMc,EAAQC,WAAW,KACvBR,EAAOJ,GACPa,aAAaF,EACf,EAAGd,EACL,CACA,GAAI,CAACW,EAAO,CAEVA,AADAA,CAAAA,EAAQC,SAASK,aAAa,CAAC,MAAK,EAC9BC,EAAE,CAAGrB,EACXc,EAAMQ,KAAK,CAACC,QAAQ,CAAG,QACvBT,EAAMQ,KAAK,CAACE,eAAe,CAAG,OAC9BV,EAAMQ,KAAK,CAACG,gBAAgB,CAAG,MAC/BX,EAAMQ,KAAK,CAACI,SAAS,CAAG,mBACxBZ,EAAMa,YAAY,CAAC,CAAEC,KAAM,MAAO,GAElC,IAAMC,EAAUC,GAAAA,QAAM,EAAC,KACrBC,GAAAA,cAAY,EAAC,KACW,IAAlBvB,IAAOwB,MAAM,GACfH,IACAf,GAAOJ,SAEX,yBAEGuB,MAAI,oBAAOzB,IAAOwB,MAAM,6DAEpBpB,uBACAsB,QAAM,mCAERC,KAAG,oBAAO3B,cACR,AAAC4B,6EAGKH,MAAI,oBAAOG,EAAK/B,IAAI,wBAAG+B,EAAK/B,IAAI,0BACX+B,EAAKlC,QAAQ,uCAClC+B,MAAI,oBAAOG,EAAKhC,KAAK,4CACS,IAAMM,EAAO0B,EAAK9B,QAAQ,gDAJ/C+B,GAAAA,IAAE,EAAC,eAAgBD,EAAKnC,IAAI,CAAEmC,EAAKE,QAAQ,EAAI,2BAYpExB,EAAOyB,UAAU,EAEpBxB,SAASyB,IAAI,CAACC,WAAW,CAAC3B,EAC5B,CACA,OAAOR,CACT"}
+{"version":3,"sources":["../../components/notification/notification.tsx"],"sourcesContent":["import { For, Show, createEffect, createUniqueId } from 'solid-js';\nimport { cx } from '@moneko/css';\nimport { render } from 'solid-js/web';\nimport queque, { type NotificationType } from './queque';\nimport { styles } from './styles';\nimport theme from '../theme';\n\nconst mountId = 'n-notification-box';\n\nconst notification = (\n  type: keyof typeof NotificationType,\n  children: JSX.Element,\n  duration = 3000,\n  close?: boolean,\n  icon?: JSX.Element,\n) => {\n  const uniqueId = createUniqueId();\n  const { list, add, remove } = queque;\n  const { baseStyle } = theme;\n  let mount = document.getElementById(mountId);\n\n  add({\n    type,\n    icon,\n    children,\n    close,\n    uniqueId,\n  });\n  if (duration && duration > 0) {\n    const timer = setTimeout(() => {\n      remove(uniqueId);\n      clearTimeout(timer);\n    }, duration);\n  }\n  if (!mount) {\n    mount = document.createElement('div');\n    mount.id = mountId;\n    mount.style.position = 'fixed';\n    mount.style.insetBlockStart = '16px';\n    mount.style.insetInlineStart = '50%';\n    mount.style.transform = 'translateX(-50%)';\n    mount.attachShadow({ mode: 'open' });\n\n    const unmount = render(() => {\n      createEffect(() => {\n        if (list().length === 0) {\n          unmount();\n          mount?.remove();\n        }\n      });\n      return (\n        <Show when={list().length}>\n          <style>\n            {baseStyle()}\n            {styles}\n          </style>\n          <For each={list()}>\n            {(item) => {\n              return (\n                <div\n                  class={cx('notification', item.type)}\n                  classList={{\n                    closeing: item.closeing,\n                  }}\n                >\n                  <Show when={item.icon}>{item.icon}</Show>\n                  <div class=\"content\">{item.children}</div>\n                  <Show when={item.close}>\n                    <span class=\"close\" onClick={() => remove(item.uniqueId)} />\n                  </Show>\n                </div>\n              );\n            }}\n          </For>\n        </Show>\n      );\n    }, mount!.shadowRoot!);\n\n    document.body.appendChild(mount);\n  }\n  return uniqueId;\n};\n\nexport default notification;\n"],"names":["mountId","type","children","duration","close","icon","uniqueId","createUniqueId","list","add","remove","queque","baseStyle","theme","mount","document","getElementById","timer","setTimeout","clearTimeout","createElement","id","style","position","insetBlockStart","insetInlineStart","transform","attachShadow","mode","unmount","render","createEffect","length","Show","styles","For","item","cx","closeing","shadowRoot","body","appendChild"],"rangeMappings":"","mappings":"kGAmFA,+CAAA,qBAjFuB,0BAFiC,sBACrC,2BAE2B,uBACvB,wBACL,0LAEZA,EAAU,qBA4EhB,EA1EqB,CACnBC,EACAC,EACAC,EAAW,GAAI,CACfC,EACAC,KAEA,IAAMC,EAAWC,GAAAA,gBAAc,IACzB,CAAEC,KAAAA,CAAI,CAAEC,IAAAA,CAAG,CAAEC,OAAAA,CAAM,CAAE,CAAGC,SAAM,CAC9B,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CACvBC,EAAQC,SAASC,cAAc,CAAChB,GASpC,GAPAS,EAAI,CACFR,KAAAA,EACAI,KAAAA,EACAH,SAAAA,EACAE,MAAAA,EACAE,SAAAA,CACF,GACIH,GAAYA,EAAW,EAAG,CAC5B,IAAMc,EAAQC,WAAW,KACvBR,EAAOJ,GACPa,aAAaF,EACf,EAAGd,EACL,CACA,GAAI,CAACW,EAAO,CAEVA,AADAA,CAAAA,EAAQC,SAASK,aAAa,CAAC,MAAK,EAC9BC,EAAE,CAAGrB,EACXc,EAAMQ,KAAK,CAACC,QAAQ,CAAG,QACvBT,EAAMQ,KAAK,CAACE,eAAe,CAAG,OAC9BV,EAAMQ,KAAK,CAACG,gBAAgB,CAAG,MAC/BX,EAAMQ,KAAK,CAACI,SAAS,CAAG,mBACxBZ,EAAMa,YAAY,CAAC,CAAEC,KAAM,MAAO,GAElC,IAAMC,EAAUC,GAAAA,QAAM,EAAC,KACrBC,GAAAA,cAAY,EAAC,KACW,IAAlBvB,IAAOwB,MAAM,GACfH,IACAf,GAAOJ,SAEX,yBAEGuB,MAAI,oBAAOzB,IAAOwB,MAAM,6DAEpBpB,uBACAsB,QAAM,mCAERC,KAAG,oBAAO3B,cACR,AAAC4B,6EAQKH,MAAI,oBAAOG,EAAK/B,IAAI,wBAAG+B,EAAK/B,IAAI,0BACX+B,EAAKlC,QAAQ,uCAClC+B,MAAI,oBAAOG,EAAKhC,KAAK,4CACS,IAAMM,EAAO0B,EAAK9B,QAAQ,oCARlD+B,GAAAA,IAAE,EAAC,eAAgBD,EAAKnC,IAAI,MAEvBmC,EAAKE,QAAQ,4IAcpCxB,EAAOyB,UAAU,EAEpBxB,SAASyB,IAAI,CAACC,WAAW,CAAC3B,EAC5B,CACA,OAAOR,CACT"}

package/lib/pagination/index.js

@@ -1,2 +1,2 @@
-"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"),n=o(require("@moneko/common/lib/isFunction")),r=require("@moneko/css"),i=require("solid-element"),l=require("./styles");require("../button");const a=o(require("../theme"));function o(e){return e&&e.__esModule?e:{default:e}}require("../typography");const s=(0,e.template)("<li>"),c=(0,e.template)(`<li><slot name="total-text"><n-typography>共 <!> 项`,!0,!1),u=(0,e.template)("<style>"),p=(0,e.template)(`<nav aria-label="pagination" class="pagination"><ul><li><n-button class="pagination-item pagination-prev">〈</n-button></li><li><n-button class="pagination-item pagination-next">〉`,!0,!1),v=(0,e.template)("<li><n-button>",!0,!1);function g(i){let{baseStyle:o}=a.default,[g,d]=(0,t.splitProps)(i,["page","pageSize","total","css","totalText"]),[f,m]=(0,t.createSignal)(1),[$,h]=(0,t.createSignal)(20),[_,b]=(0,t.createSignal)(0);(0,t.createEffect)(()=>{(0,t.batch)(()=>{"number"==typeof g.page&&g.page!==(0,t.untrack)(f)&&m(g.page),"number"==typeof g.pageSize&&g.pageSize!==(0,t.untrack)($)&&h(g.pageSize),"number"==typeof g.total&&g.total!==(0,t.untrack)(_)&&b(g.total)})});let C=(0,t.createMemo)(()=>Math.ceil(_()/$())),x=(0,t.createMemo)(()=>{let e=C(),t=[];if(e<=5)for(let n=1;n<=e;n++)t.push(n);else{let n=Math.min(e,Math.max(1,f()-Math.floor(2.5))+5-1);for(let e=n-5+1;e<=n;e++)t.push(e)}if(t.length){let n=t[t.length-1],r=t[0];r>=2&&(2===r?t.splice(0,1,"p"):t.unshift("p"),t.unshift(1),n<e&&(n+=1,t.push(n))),n===e-1?(t.splice(t.length-1,1,"n"),t.push(e)):n<e-1&&(t.push("n"),t.push(e))}return t});function y(e){let n=(0,t.untrack)(f),r="n"===e?n+5:"p"===e?n-5:e;r<1?r=1:r>(0,t.untrack)(C)&&(r=(0,t.untrack)(C)),n!==r&&(void 0===g.page&&m(r),d.onChange?.(r,(0,t.untrack)($)))}let w=()=>{let r=(0,t.createMemo)(()=>[(f()-1)*$()+1,f()*$()]);return(0,e.createComponent)(t.Show,{get when(){return!1!==g.totalText},get children(){let t=s();return(0,e.insert)(t,(()=>{let t=(0,e.memo)(()=>!!(0,n.default)(g.totalText));return()=>t()?g.totalText(_(),r()):(()=>{let t=c(),n=t.firstChild,r=n.firstChild,i=r.firstChild.nextSibling;return i.nextSibling,n._$owner=(0,e.getOwner)(),r._$owner=(0,e.getOwner)(),(0,e.insert)(r,_,i),t})()})()),t}})};return(0,e.createComponent)(t.Show,{get when(){return x().length},get children(){return[(()=>{let t=u();return(0,e.insert)(t,o,null),(0,e.insert)(t,l.styles,null),(0,e.insert)(t,()=>(0,r.css)(g.css),null),t})(),(()=>{let n=p(),i=n.firstChild,l=i.firstChild,a=l.firstChild,o=l.nextSibling,s=o.firstChild;return(0,e.insert)(i,(0,e.createComponent)(w,{}),l),a.$$click=()=>y((0,t.untrack)(f)-1),a.flat=!0,a.circle=!0,a._$owner=(0,e.getOwner)(),(0,e.insert)(i,(0,e.createComponent)(t.For,{get each(){return x()},children:n=>{let i=(0,t.createMemo)(()=>n===f());return(()=>{let t=v(),l=t.firstChild;return l.$$click=()=>y(n),l.circle="number"!=typeof n,l._$owner=(0,e.getOwner)(),(0,e.insert)(l,n),(0,e.effect)(t=>{let a=(0,r.cx)("pagination-item","number"!=typeof n&&`pagination-${n}`),o=d.size,s=!i(),c=i()?"primary":"default",u=i(),p=i()&&"page";return a!==t._v$5&&(0,e.className)(l,t._v$5=a),o!==t._v$6&&(l.size=t._v$6=o),s!==t._v$7&&(l.flat=t._v$7=s),c!==t._v$8&&(l.type=t._v$8=c),u!==t._v$9&&(l.fill=t._v$9=u),p!==t._v$10&&(l.ariaCurrent=t._v$10=p),t},{_v$5:void 0,_v$6:void 0,_v$7:void 0,_v$8:void 0,_v$9:void 0,_v$10:void 0}),t})()}}),o),s.$$click=()=>y((0,t.untrack)(f)+1),s.flat=!0,s.circle=!0,s._$owner=(0,e.getOwner)(),(0,e.effect)(e=>{let t=d.size,n=1===f(),r=d.size,i=f()===C();return t!==e._v$&&(a.size=e._v$=t),n!==e._v$2&&(a.disabled=e._v$2=n),r!==e._v$3&&(s.size=e._v$3=r),i!==e._v$4&&(s.disabled=e._v$4=i),e},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0}),n})()]}})}(0,i.customElement)("n-pagination",{class:void 0,css:void 0,page:void 0,pageSize:void 0,total:0,size:void 0,onChange:void 0,totalText:void 0},(e,n)=>{let r=n.element,i=(0,t.mergeProps)({css:r.css,onChange(e,t){r.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))}},e,{totalText:!!r.querySelector("[slot='total-text']")||e.totalText});return(0,t.createEffect)(()=>{r.removeAttribute("css")}),(0,t.createComponent)(g,i)});const d=g;(0,e.delegateEvents)(["click"]);
+"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"),n=o(require("@moneko/common/lib/isFunction")),r=require("@moneko/css"),i=require("solid-element"),l=require("./styles");require("../button");const a=o(require("../theme"));function o(e){return e&&e.__esModule?e:{default:e}}require("../typography");const s=(0,e.template)("<li>"),c=(0,e.template)(`<li><slot name="total-text"><n-typography>共 <!> 项`,!0,!1),u=(0,e.template)("<style>"),p=(0,e.template)(`<nav aria-label="pagination" class="pagination"><ul><li><n-button class="pagination-item pagination-prev">〈</n-button></li><li><n-button class="pagination-item pagination-next">〉`,!0,!1),v=(0,e.template)('<li><n-button class="pagination-item">',!0,!1);function g(i){let{baseStyle:o}=a.default,[g,d]=(0,t.splitProps)(i,["page","pageSize","total","css","totalText"]),[f,$]=(0,t.createSignal)(1),[h,m]=(0,t.createSignal)(20),[_,b]=(0,t.createSignal)(0);(0,t.createEffect)(()=>{(0,t.batch)(()=>{"number"==typeof g.page&&g.page!==(0,t.untrack)(f)&&$(g.page),"number"==typeof g.pageSize&&g.pageSize!==(0,t.untrack)(h)&&m(g.pageSize),"number"==typeof g.total&&g.total!==(0,t.untrack)(_)&&b(g.total)})});let C=(0,t.createMemo)(()=>Math.ceil(_()/h())),y=(0,t.createMemo)(()=>{let e=C(),t=[];if(e<=5)for(let n=1;n<=e;n++)t.push(n);else{let n=Math.min(e,Math.max(1,f()-Math.floor(2.5))+5-1);for(let e=n-5+1;e<=n;e++)t.push(e)}if(t.length){let n=t[t.length-1],r=t[0];r>=2&&(2===r?t.splice(0,1,"p"):t.unshift("p"),t.unshift(1),n<e&&(n+=1,t.push(n))),n===e-1?(t.splice(t.length-1,1,"n"),t.push(e)):n<e-1&&(t.push("n"),t.push(e))}return t});function w(e){let n=(0,t.untrack)(f),r="n"===e?n+5:"p"===e?n-5:e;r<1?r=1:r>(0,t.untrack)(C)&&(r=(0,t.untrack)(C)),n!==r&&(void 0===g.page&&$(r),d.onChange?.(r,(0,t.untrack)(h)))}let x=()=>{let r=(0,t.createMemo)(()=>[(f()-1)*h()+1,f()*h()]);return(0,e.createComponent)(t.Show,{get when(){return!1!==g.totalText},get children(){let t=s();return(0,e.insert)(t,(()=>{let t=(0,e.memo)(()=>!!(0,n.default)(g.totalText));return()=>t()?g.totalText(_(),r()):(()=>{let t=c(),n=t.firstChild,r=n.firstChild,i=r.firstChild.nextSibling;return i.nextSibling,n._$owner=(0,e.getOwner)(),r._$owner=(0,e.getOwner)(),(0,e.insert)(r,_,i),t})()})()),t}})};return(0,e.createComponent)(t.Show,{get when(){return y().length},get children(){return[(()=>{let t=u();return(0,e.insert)(t,o,null),(0,e.insert)(t,l.styles,null),(0,e.insert)(t,()=>(0,r.css)(g.css),null),t})(),(()=>{let n=p(),r=n.firstChild,i=r.firstChild,l=i.firstChild,a=i.nextSibling,o=a.firstChild;return(0,e.insert)(r,(0,e.createComponent)(x,{}),i),l.$$click=()=>w((0,t.untrack)(f)-1),l.flat=!0,l.circle=!0,l._$owner=(0,e.getOwner)(),(0,e.insert)(r,(0,e.createComponent)(t.For,{get each(){return y()},children:n=>{let r=(0,t.createMemo)(()=>n===f());return(()=>{let t=v(),i=t.firstChild;return i.$$click=()=>w(n),i.circle="number"!=typeof n,i._$owner=(0,e.getOwner)(),(0,e.insert)(i,n),(0,e.effect)(t=>{let l={[`pagination-${n}`]:"number"!=typeof n},a=d.size,o=!r(),s=r()?"primary":"default",c=r(),u=r()&&"page";return t._v$5=(0,e.classList)(i,l,t._v$5),a!==t._v$6&&(i.size=t._v$6=a),o!==t._v$7&&(i.flat=t._v$7=o),s!==t._v$8&&(i.type=t._v$8=s),c!==t._v$9&&(i.fill=t._v$9=c),u!==t._v$10&&(i.ariaCurrent=t._v$10=u),t},{_v$5:void 0,_v$6:void 0,_v$7:void 0,_v$8:void 0,_v$9:void 0,_v$10:void 0}),t})()}}),a),o.$$click=()=>w((0,t.untrack)(f)+1),o.flat=!0,o.circle=!0,o._$owner=(0,e.getOwner)(),(0,e.effect)(e=>{let t=d.size,n=1===f(),r=d.size,i=f()===C();return t!==e._v$&&(l.size=e._v$=t),n!==e._v$2&&(l.disabled=e._v$2=n),r!==e._v$3&&(o.size=e._v$3=r),i!==e._v$4&&(o.disabled=e._v$4=i),e},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0}),n})()]}})}(0,i.customElement)("n-pagination",{class:void 0,css:void 0,page:void 0,pageSize:void 0,total:0,size:void 0,onChange:void 0,totalText:void 0},(n,r)=>{let i=r.element,l=(0,t.mergeProps)({css:i.css,onChange(e,t){i.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))}},n,{totalText:!!i.querySelector("[slot='total-text']")||n.totalText});return(0,t.createEffect)(()=>{i.removeAttribute("css")}),(0,e.createComponent)(g,l)});const d=g;(0,e.delegateEvents)(["click"]);
 //# sourceMappingURL=index.js.map

package/lib/pagination/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/pagination/index.tsx"],"sourcesContent":["import {\n  For,\n  Show,\n  batch,\n  createComponent,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { styles } from './styles';\nimport '../button';\nimport theme from '../theme';\nimport '../typography';\nimport type { BasicConfig, CustomElement } from '..';\n\nfunction Pagination(_: PaginationProps) {\n  const { baseStyle } = theme;\n  const maxCount = 5;\n  const [local, other] = splitProps(_, ['page', 'pageSize', 'total', 'css', 'totalText']);\n  const [page, setPage] = createSignal(1);\n  const [pageSize, setPageSize] = createSignal(20);\n  const [total, setTotal] = createSignal(0);\n\n  createEffect(() => {\n    batch(() => {\n      if (typeof local.page === 'number' && local.page !== untrack(page)) {\n        setPage(local.page);\n      }\n      if (typeof local.pageSize === 'number' && local.pageSize !== untrack(pageSize)) {\n        setPageSize(local.pageSize);\n      }\n      if (typeof local.total === 'number' && local.total !== untrack(total)) {\n        setTotal(local.total);\n      }\n    });\n  });\n  const totalPages = createMemo(() => Math.ceil(total() / pageSize()));\n  const pages = createMemo(() => {\n    const totals = totalPages();\n    const arr: (number | 'p' | 'n')[] = [];\n\n    if (totals <= maxCount) {\n      for (let i = 1; i <= totals; i++) {\n        arr.push(i);\n      }\n    } else {\n      const right = Math.min(totals, Math.max(1, page() - Math.floor(maxCount / 2)) + maxCount - 1);\n\n      for (let i = right - maxCount + 1; i <= right; i++) {\n        arr.push(i);\n      }\n    }\n\n    if (arr.length) {\n      let last = arr[arr.length - 1] as number;\n      const fast = arr[0] as number;\n\n      if (fast >= 2) {\n        if (fast === 2) {\n          arr.splice(0, 1, 'p');\n        } else {\n          arr.unshift('p');\n        }\n        arr.unshift(1);\n        if (last < totals) {\n          last += 1;\n          arr.push(last);\n        }\n      }\n      if (last === totals - 1) {\n        arr.splice(arr.length - 1, 1, 'n');\n        arr.push(totals);\n      } else if (last < totals - 1) {\n        arr.push('n');\n        arr.push(totals);\n      }\n    }\n    return arr;\n  });\n\n  function changePage(curr: number | 'p' | 'n') {\n    const p = untrack(page);\n    let next = curr === 'n' ? p + maxCount : curr === 'p' ? p - maxCount : curr;\n\n    if (next < 1) {\n      next = 1;\n    } else if (next > untrack(totalPages)) {\n      next = untrack(totalPages);\n    }\n    if (p !== next) {\n      if (local.page === void 0) {\n        setPage(next);\n      }\n      other.onChange?.(next, untrack(pageSize));\n    }\n  }\n  const TotalText = () => {\n    const ranges = createMemo(() => [(page() - 1) * pageSize() + 1, page() * pageSize()]);\n\n    return (\n      <Show when={local.totalText !== false}>\n        <li>\n          {isFunction(local.totalText) ? (\n            local.totalText(total(), ranges())\n          ) : (\n            <li>\n              <slot name=\"total-text\">\n                <n-typography>共 {total()} 项</n-typography>\n              </slot>\n            </li>\n          )}\n        </li>\n      </Show>\n    );\n  };\n\n  return (\n    <Show when={pages().length}>\n      <style>\n        {baseStyle()}\n        {styles}\n        {css(local.css)}\n      </style>\n      <nav aria-label=\"pagination\" class=\"pagination\">\n        <ul>\n          <TotalText />\n          <li>\n            <n-button\n              class=\"pagination-item pagination-prev\"\n              size={other.size}\n              flat={true}\n              circle={true}\n              disabled={page() === 1}\n              onClick={() => changePage(untrack(page) - 1)}\n            >\n              〈\n            </n-button>\n          </li>\n          <For each={pages()}>\n            {(curr) => {\n              const isCurrent = createMemo(() => curr === page());\n\n              return (\n                <li>\n                  <n-button\n                    class={cx('pagination-item', typeof curr !== 'number' && `pagination-${curr}`)}\n                    size={other.size}\n                    flat={!isCurrent()}\n                    circle={typeof curr !== 'number'}\n                    type={isCurrent() ? 'primary' : 'default'}\n                    fill={isCurrent()}\n                    aria-current={isCurrent() && 'page'}\n                    onClick={() => changePage(curr)}\n                  >\n                    {curr}\n                  </n-button>\n                </li>\n              );\n            }}\n          </For>\n          <li>\n            <n-button\n              class=\"pagination-item pagination-next\"\n              size={other.size}\n              flat={true}\n              circle={true}\n              disabled={page() === totalPages()}\n              onClick={() => changePage(untrack(page) + 1)}\n            >\n              〉\n            </n-button>\n          </li>\n        </ul>\n      </nav>\n    </Show>\n  );\n}\n\n/** API */\nexport interface PaginationProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义类名 */\n  css?: string;\n  /** 当前页数\n   * @default 1\n   */\n  page?: number;\n  /** 每页显示的数据条目数量\n   * @default 20\n   */\n  pageSize?: number;\n  /** 总数\n   * @default 0\n   */\n  total?: number;\n  /** 尺寸\n   * @default 'normal'\n   */\n  size?: BasicConfig['size'];\n  /** 用于显示数据总量和当前数据顺序;\n   * 支持直接赋值给 'totalText' 属性\n   * 或者通过[slot=\"total-text\"]插槽\n   * @default true\n   */\n  totalText?: ((total: number, range: [start: number, end: number]) => JSX.Element) | false;\n  /** 值修改时的回调方法 */\n  onChange?(page: number, pageSize: number): void;\n  children?: JSX.Element;\n}\nexport type PaginationElement = CustomElement<PaginationProps>;\n\ncustomElement<PaginationProps>(\n  'n-pagination',\n  {\n    class: void 0,\n    css: void 0,\n    page: void 0,\n    pageSize: void 0,\n    total: 0,\n    size: void 0,\n    onChange: void 0,\n    totalText: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        css: el.css,\n        onChange(page: number, pageSize: number) {\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: [page, pageSize],\n            }),\n          );\n        },\n      },\n      _,\n      {\n        totalText: (!!el.querySelector(\"[slot='total-text']\") as false) || _.totalText,\n      },\n    );\n\n    createEffect(() => {\n      el.removeAttribute('css');\n    });\n    return createComponent(Pagination, props);\n  },\n);\nexport default Pagination;\n"],"names":["Pagination","_","baseStyle","theme","local","other","splitProps","page","setPage","createSignal","pageSize","setPageSize","total","setTotal","createEffect","batch","untrack","totalPages","createMemo","Math","ceil","pages","totals","arr","i","push","right","min","max","floor","maxCount","length","last","fast","splice","unshift","changePage","curr","p","next","onChange","TotalText","ranges","Show","totalText","isFunction","styles","css","For","isCurrent","cx","size","customElement","class","opt","el","element","props","mergeProps","dispatchEvent","CustomEvent","detail","querySelector","removeAttribute","createComponent"],"rangeMappings":"","mappings":"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"}
+{"version":3,"sources":["../../components/pagination/index.tsx"],"sourcesContent":["import {\n  For,\n  Show,\n  batch,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { isFunction } from '@moneko/common';\nimport { css } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { styles } from './styles';\nimport '../button';\nimport theme from '../theme';\nimport '../typography';\nimport type { BasicConfig, CustomElement } from '..';\n\nfunction Pagination(_: PaginationProps) {\n  const { baseStyle } = theme;\n  const maxCount = 5;\n  const [local, other] = splitProps(_, ['page', 'pageSize', 'total', 'css', 'totalText']);\n  const [page, setPage] = createSignal(1);\n  const [pageSize, setPageSize] = createSignal(20);\n  const [total, setTotal] = createSignal(0);\n\n  createEffect(() => {\n    batch(() => {\n      if (typeof local.page === 'number' && local.page !== untrack(page)) {\n        setPage(local.page);\n      }\n      if (typeof local.pageSize === 'number' && local.pageSize !== untrack(pageSize)) {\n        setPageSize(local.pageSize);\n      }\n      if (typeof local.total === 'number' && local.total !== untrack(total)) {\n        setTotal(local.total);\n      }\n    });\n  });\n  const totalPages = createMemo(() => Math.ceil(total() / pageSize()));\n  const pages = createMemo(() => {\n    const totals = totalPages();\n    const arr: (number | 'p' | 'n')[] = [];\n\n    if (totals <= maxCount) {\n      for (let i = 1; i <= totals; i++) {\n        arr.push(i);\n      }\n    } else {\n      const right = Math.min(totals, Math.max(1, page() - Math.floor(maxCount / 2)) + maxCount - 1);\n\n      for (let i = right - maxCount + 1; i <= right; i++) {\n        arr.push(i);\n      }\n    }\n\n    if (arr.length) {\n      let last = arr[arr.length - 1] as number;\n      const fast = arr[0] as number;\n\n      if (fast >= 2) {\n        if (fast === 2) {\n          arr.splice(0, 1, 'p');\n        } else {\n          arr.unshift('p');\n        }\n        arr.unshift(1);\n        if (last < totals) {\n          last += 1;\n          arr.push(last);\n        }\n      }\n      if (last === totals - 1) {\n        arr.splice(arr.length - 1, 1, 'n');\n        arr.push(totals);\n      } else if (last < totals - 1) {\n        arr.push('n');\n        arr.push(totals);\n      }\n    }\n    return arr;\n  });\n\n  function changePage(curr: number | 'p' | 'n') {\n    const p = untrack(page);\n    let next = curr === 'n' ? p + maxCount : curr === 'p' ? p - maxCount : curr;\n\n    if (next < 1) {\n      next = 1;\n    } else if (next > untrack(totalPages)) {\n      next = untrack(totalPages);\n    }\n    if (p !== next) {\n      if (local.page === void 0) {\n        setPage(next);\n      }\n      other.onChange?.(next, untrack(pageSize));\n    }\n  }\n  const TotalText = () => {\n    const ranges = createMemo(() => [(page() - 1) * pageSize() + 1, page() * pageSize()]);\n\n    return (\n      <Show when={local.totalText !== false}>\n        <li>\n          {isFunction(local.totalText) ? (\n            local.totalText(total(), ranges())\n          ) : (\n            <li>\n              <slot name=\"total-text\">\n                <n-typography>共 {total()} 项</n-typography>\n              </slot>\n            </li>\n          )}\n        </li>\n      </Show>\n    );\n  };\n\n  return (\n    <Show when={pages().length}>\n      <style>\n        {baseStyle()}\n        {styles}\n        {css(local.css)}\n      </style>\n      <nav aria-label=\"pagination\" class=\"pagination\">\n        <ul>\n          <TotalText />\n          <li>\n            <n-button\n              class=\"pagination-item pagination-prev\"\n              size={other.size}\n              flat={true}\n              circle={true}\n              disabled={page() === 1}\n              onClick={() => changePage(untrack(page) - 1)}\n            >\n              〈\n            </n-button>\n          </li>\n          <For each={pages()}>\n            {(curr) => {\n              const isCurrent = createMemo(() => curr === page());\n\n              return (\n                <li>\n                  <n-button\n                    class=\"pagination-item\"\n                    classList={{\n                      [`pagination-${curr}`]: typeof curr !== 'number',\n                    }}\n                    size={other.size}\n                    flat={!isCurrent()}\n                    circle={typeof curr !== 'number'}\n                    type={isCurrent() ? 'primary' : 'default'}\n                    fill={isCurrent()}\n                    aria-current={isCurrent() && 'page'}\n                    onClick={() => changePage(curr)}\n                  >\n                    {curr}\n                  </n-button>\n                </li>\n              );\n            }}\n          </For>\n          <li>\n            <n-button\n              class=\"pagination-item pagination-next\"\n              size={other.size}\n              flat={true}\n              circle={true}\n              disabled={page() === totalPages()}\n              onClick={() => changePage(untrack(page) + 1)}\n            >\n              〉\n            </n-button>\n          </li>\n        </ul>\n      </nav>\n    </Show>\n  );\n}\n\n/** API */\nexport interface PaginationProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义类名 */\n  css?: string;\n  /** 当前页数\n   * @default 1\n   */\n  page?: number;\n  /** 每页显示的数据条目数量\n   * @default 20\n   */\n  pageSize?: number;\n  /** 总数\n   * @default 0\n   */\n  total?: number;\n  /** 尺寸\n   * @default 'normal'\n   */\n  size?: BasicConfig['size'];\n  /** 用于显示数据总量和当前数据顺序;\n   * 支持直接赋值给 'totalText' 属性\n   * 或者通过[slot=\"total-text\"]插槽\n   * @default true\n   */\n  totalText?: ((total: number, range: [start: number, end: number]) => JSX.Element) | false;\n  /** 值修改时的回调方法 */\n  onChange?(page: number, pageSize: number): void;\n  children?: JSX.Element;\n}\nexport type PaginationElement = CustomElement<PaginationProps>;\n\ncustomElement<PaginationProps>(\n  'n-pagination',\n  {\n    class: void 0,\n    css: void 0,\n    page: void 0,\n    pageSize: void 0,\n    total: 0,\n    size: void 0,\n    onChange: void 0,\n    totalText: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        css: el.css,\n        onChange(page: number, pageSize: number) {\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: [page, pageSize],\n            }),\n          );\n        },\n      },\n      _,\n      {\n        totalText: (!!el.querySelector(\"[slot='total-text']\") as false) || _.totalText,\n      },\n    );\n\n    createEffect(() => {\n      el.removeAttribute('css');\n    });\n    return <Pagination {...props} />;\n  },\n);\nexport default Pagination;\n"],"names":["Pagination","_","baseStyle","theme","local","other","splitProps","page","setPage","createSignal","pageSize","setPageSize","total","setTotal","createEffect","batch","untrack","totalPages","createMemo","Math","ceil","pages","totals","arr","i","push","right","min","max","floor","maxCount","length","last","fast","splice","unshift","changePage","curr","p","next","onChange","TotalText","ranges","Show","totalText","isFunction","styles","css","For","isCurrent","size","customElement","class","opt","el","element","props","mergeProps","dispatchEvent","CustomEvent","detail","querySelector","removeAttribute"],"rangeMappings":"","mappings":"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"}

package/lib/popover/index.js

@@ -1,2 +1,2 @@
-"use strict";var e,t,n,o;Object.defineProperty(exports,"__esModule",{value:!0}),function(e,t){for(var n in t)Object.defineProperty(e,n,{enumerable:!0,get:t[n]})}(exports,{Placement:function(){return t},TriggerOption:function(){return e},default:function(){return M},defaultProps:function(){return C}});const r=require("solid-js/web"),i=require("solid-js"),l=g(require("@moneko/common/lib/isElementInside")),s=g(require("@moneko/common/lib/isEqual")),c=g(require("@moneko/common/lib/isFunction")),u=g(require("@moneko/common/lib/passiveSupported")),a=require("@moneko/css"),p=require("solid-element"),d=require("./style");require("../empty");const m=g(require("../theme"));function g(e){return e&&e.__esModule?e:{default:e}}const f=(0,r.template)("<style>"),h=(0,r.template)("<span>"),v=(0,r.template)("<div>"),w=(0,r.template)("<n-empty>",!0,!1);function b(e){let t,n,o,p;let{isDark:g,baseStyle:b}=m.default,C=(0,i.mergeProps)({trigger:"hover"},e),[M]=(0,i.splitProps)(C,["class","css","popupClass","popupCss","size","trigger","open","disabled","onOpenChange","dropdownMatchSelectWidth","destroyInactive","arrow","placement","getPopupContainer","children","content"]),[x,E]=(0,i.createSignal)(null),[y,P]=(0,i.createSignal)({}),[k,q]=(0,i.createSignal)(!1),[L,O]=(0,i.createSignal)("");function S(e){M.disabled||(M.onOpenChange&&M.onOpenChange(e),void 0===M.open&&E(e))}function R(){!1===x()&&(E(null),S(null))}function T(e){clearTimeout(o),o=setTimeout(()=>{if(clearTimeout(o),e.target?.getAttribute("handle-closed")==="false")return;let n=(0,l.default)(e.target,t);(x()&&!n||n&&"mousedown"!==e.type)&&S(!1)},"hover"===M.trigger?300:0)}(0,i.createEffect)(()=>{void 0!==M.open&&E(M.open)}),(0,i.createEffect)(()=>{x()&&M.dropdownMatchSelectWidth&&n&&O(`.portal {width: ${n.offsetWidth}px;}`)});let $=function(e){clearTimeout(p),p=setTimeout(()=>{if(clearTimeout(p),!t||!n||!e&&"contextMenu"===M.trigger)return;if(e?.type==="scroll"&&"contextMenu"===M.trigger){S(!1);return}let o=n.getBoundingClientRect(),r=t.getBoundingClientRect(),i=r.width/2-o.width/2,l=window.innerHeight-o.bottom,c=M.placement,u=!c?.startsWith("top")&&l>.8*t.offsetHeight&&l>o.top||c?.startsWith("bottom"),a=M.arrow?8:4,d={};switch(M.placement){case"bottomLeft":case"left":case"topLeft":d.left=o.left,d["--x"]=-r.width/2+16;break;case"bottomRight":case"right":case"topRight":d.left=o.right-r.width,d["--x"]=r.width/2-16;break;default:d.left=Math.abs(i>o.left?o.left:o.left-i),d["--x"]=-(d.left-o.left+i)}u?d.top=o.bottom+a:d.bottom=window.innerHeight-o.top+a,P(e=>(0,s.default)(e,d)?e:d),q(e=>!u===e?e:!u)},32)};function j(e){clearTimeout(o),e.stopPropagation(),"contextMenu"===M.trigger&&"contextmenu"===e.type&&(e.preventDefault(),P(n=>({...n,left:e.clientX,top:e.clientY,"--x":-(t?.getBoundingClientRect().width||0)/2+16}))),S(!0)}let W=(0,i.createMemo)(()=>(0,c.default)(M.getPopupContainer)?M.getPopupContainer(n):document.body),_=(0,i.createMemo)(()=>{let e={},t={click:"onMouseDown",hover:"onMouseEnter",contextMenu:"onContextMenu",none:void 0}[M.trigger],n={hover:"onMouseLeave",click:void 0,contextMenu:void 0,none:void 0}[M.trigger];return Object.assign(e,t&&{[t]:j},n&&{[n]:T}),e}),z=(0,i.createMemo)(()=>{let e=y();return`.portal {${Object.keys(e).map(t=>`${t}:${e[t]}px;`).join("")}z-index: 1;}`}),I=(0,i.createMemo)(()=>(0,a.cx)("portal",M.arrow&&"arrow",`${x()?"in":"out"}-${k()?"up":"down"}`,M.size,M.popupClass)),B=(0,i.createMemo)(()=>`:host {--popover-bg: ${g()?"#1f1f1f":"var(--component-bg)"};--popover-shadow-color: rgb(0 0 0 / 5%);}`);return(0,i.createEffect)(()=>{x()&&($(),window.addEventListener("scroll",$,{passive:u.default})),(0,i.onCleanup)(()=>{window.removeEventListener("scroll",$,!1)})}),(0,i.onMount)(()=>{"none"!==M.trigger&&document.documentElement.addEventListener("mousedown",T,!1)}),(0,i.onCleanup)(()=>{clearTimeout(o),document.documentElement.removeEventListener("mousedown",T,!1)}),[(()=>{let e=f();return(0,r.insert)(e,b,null),(0,r.insert)(e,d.popoverCss,null),(0,r.insert)(e,()=>(0,a.css)(M.css),null),e})(),(()=>{let e=h(),t=n;return"function"==typeof t?(0,r.use)(t,e):n=e,(0,r.spread)(e,(0,r.mergeProps)({get class(){return(0,a.cx)("popover",M.size,M.class)}},_),!1,!0),(0,r.insert)(e,()=>M.children),e})(),(0,r.createComponent)(i.Show,{get when(){return null!==x()||!M.destroyInactive},get children(){return(0,r.createComponent)(r.Portal,{useShadow:!0,get mount(){return W()},get children(){return[(()=>{let e=f();return(0,r.insert)(e,b,null),(0,r.insert)(e,d.portalCss,null),(0,r.insert)(e,B,null),(0,r.insert)(e,z,null),(0,r.insert)(e,L,null),(0,r.insert)(e,()=>(0,a.css)(M.popupCss),null),e})(),(()=>{let e=v(),n=t;return(0,r.addEventListener)(e,"animationend",R),"function"==typeof n?(0,r.use)(n,e):t=e,(0,r.spread)(e,(0,r.mergeProps)({get class(){return I()}},_),!1,!0),(0,r.insert)(e,(0,r.createComponent)(i.Show,{get when(){return M.content},get fallback(){return(()=>{let e=w();return e._$owner=(0,r.getOwner)(),e})()},get children(){return M.content}})),e})()]}})}})]}(n=e||(e={})).hover="hover",n.click="click",n.contextMenu="contextMenu",n.none="none",(o=t||(t={})).bottomLeft="bottomLeft",o.bottom="bottom",o.bottomRight="bottomRight",o.topLeft="topLeft",o.top="top",o.topRight="topRight",o.left="left",o.right="right";const C={class:void 0,css:void 0,content:void 0,getPopupContainer:void 0,trigger:void 0,open:void 0,onOpenChange:void 0,popupClass:void 0,popupCss:void 0,destroyInactive:!0,disabled:void 0,arrow:void 0,placement:void 0,dropdownMatchSelectWidth:void 0};(0,p.customElement)("n-popover",C,(e,t)=>{let n=t.element,o=(0,i.mergeProps)({onOpenChange(e){n.dispatchEvent(new CustomEvent("openchange",{detail:e}))},children:[...n.childNodes.values()]},e);return(0,i.createEffect)(()=>{n.removeAttribute("css")}),(0,i.createComponent)(b,o)});const M=b;
+"use strict";var e,t,n,o;Object.defineProperty(exports,"__esModule",{value:!0}),function(e,t){for(var n in t)Object.defineProperty(e,n,{enumerable:!0,get:t[n]})}(exports,{Placement:function(){return t},TriggerOption:function(){return e},default:function(){return M},defaultProps:function(){return C}});const r=require("solid-js/web"),i=require("solid-js"),l=g(require("@moneko/common/lib/isElementInside")),s=g(require("@moneko/common/lib/isEqual")),c=g(require("@moneko/common/lib/isFunction")),u=g(require("@moneko/common/lib/passiveSupported")),a=require("@moneko/css"),p=require("solid-element"),d=require("./style");require("../empty");const m=g(require("../theme"));function g(e){return e&&e.__esModule?e:{default:e}}const f=(0,r.template)("<style>"),h=(0,r.template)("<span>"),v=(0,r.template)("<div>"),w=(0,r.template)("<n-empty>",!0,!1);function b(e){let t,n,o,p;let{isDark:g,baseStyle:b}=m.default,C=(0,i.mergeProps)({trigger:"hover"},e),[M]=(0,i.splitProps)(C,["class","css","popupClass","popupCss","size","trigger","open","disabled","onOpenChange","dropdownMatchSelectWidth","destroyInactive","arrow","placement","getPopupContainer","children","content"]),[x,E]=(0,i.createSignal)(null),[y,P]=(0,i.createSignal)({}),[k,q]=(0,i.createSignal)(!1),[L,O]=(0,i.createSignal)("");function S(e){M.disabled||(M.onOpenChange&&M.onOpenChange(e),void 0===M.open&&E(e))}function R(){!1===x()&&(E(null),S(null))}function T(e){clearTimeout(o),o=setTimeout(()=>{if(clearTimeout(o),e.target?.getAttribute("handle-closed")==="false")return;let n=(0,l.default)(e.target,t);(x()&&!n||n&&"mousedown"!==e.type)&&S(!1)},"hover"===M.trigger?300:0)}(0,i.createEffect)(()=>{void 0!==M.open&&E(M.open)}),(0,i.createEffect)(()=>{x()&&M.dropdownMatchSelectWidth&&n&&O(`.portal {width: ${n.offsetWidth}px;}`)});let $=function(e){clearTimeout(p),p=setTimeout(()=>{if(clearTimeout(p),!t||!n||!e&&"contextMenu"===M.trigger)return;if(e?.type==="scroll"&&"contextMenu"===M.trigger){S(!1);return}let o=n.getBoundingClientRect(),r=t.getBoundingClientRect(),i=r.width/2-o.width/2,l=window.innerHeight-o.bottom,c=M.placement,u=!c?.startsWith("top")&&l>.8*t.offsetHeight&&l>o.top||c?.startsWith("bottom"),a=M.arrow?8:4,d={};switch(M.placement){case"bottomLeft":case"left":case"topLeft":d.left=o.left,d["--x"]=-r.width/2+16;break;case"bottomRight":case"right":case"topRight":d.left=o.right-r.width,d["--x"]=r.width/2-16;break;default:d.left=Math.abs(i>o.left?o.left:o.left-i),d["--x"]=-(d.left-o.left+i)}u?d.top=o.bottom+a:d.bottom=window.innerHeight-o.top+a,P(e=>(0,s.default)(e,d)?e:d),q(e=>!u===e?e:!u)},32)};function j(e){clearTimeout(o),e.stopPropagation(),"contextMenu"===M.trigger&&"contextmenu"===e.type&&(e.preventDefault(),P(n=>({...n,left:e.clientX,top:e.clientY,"--x":-(t?.getBoundingClientRect().width||0)/2+16}))),S(!0)}let W=(0,i.createMemo)(()=>(0,c.default)(M.getPopupContainer)?M.getPopupContainer(n):document.body),_=(0,i.createMemo)(()=>{let e={},t={click:"onMouseDown",hover:"onMouseEnter",contextMenu:"onContextMenu",none:void 0}[M.trigger],n={hover:"onMouseLeave",click:void 0,contextMenu:void 0,none:void 0}[M.trigger];return Object.assign(e,t&&{[t]:j},n&&{[n]:T}),e}),z=(0,i.createMemo)(()=>{let e=y();return`.portal {${Object.keys(e).map(t=>`${t}:${e[t]}px;`).join("")}z-index: 1;}`}),I=(0,i.createMemo)(()=>(0,a.cx)("portal",M.arrow&&"arrow",`${x()?"in":"out"}-${k()?"up":"down"}`,M.size,M.popupClass)),B=(0,i.createMemo)(()=>`:host {--popover-bg: ${g()?"#1f1f1f":"var(--component-bg)"};--popover-shadow-color: rgb(0 0 0 / 5%);}`);return(0,i.createEffect)(()=>{x()&&($(),window.addEventListener("scroll",$,{passive:u.default})),(0,i.onCleanup)(()=>{window.removeEventListener("scroll",$,!1)})}),(0,i.onMount)(()=>{"none"!==M.trigger&&document.documentElement.addEventListener("mousedown",T,!1)}),(0,i.onCleanup)(()=>{clearTimeout(o),document.documentElement.removeEventListener("mousedown",T,!1)}),[(()=>{let e=f();return(0,r.insert)(e,b,null),(0,r.insert)(e,d.popoverCss,null),(0,r.insert)(e,()=>(0,a.css)(M.css),null),e})(),(()=>{let e=h(),t=n;return"function"==typeof t?(0,r.use)(t,e):n=e,(0,r.spread)(e,(0,r.mergeProps)({get class(){return(0,a.cx)("popover",M.size,M.class)}},_),!1,!0),(0,r.insert)(e,()=>M.children),e})(),(0,r.createComponent)(i.Show,{get when(){return null!==x()||!M.destroyInactive},get children(){return(0,r.createComponent)(r.Portal,{useShadow:!0,get mount(){return W()},get children(){return[(()=>{let e=f();return(0,r.insert)(e,b,null),(0,r.insert)(e,d.portalCss,null),(0,r.insert)(e,B,null),(0,r.insert)(e,z,null),(0,r.insert)(e,L,null),(0,r.insert)(e,()=>(0,a.css)(M.popupCss),null),e})(),(()=>{let e=v(),n=t;return(0,r.addEventListener)(e,"animationend",R),"function"==typeof n?(0,r.use)(n,e):t=e,(0,r.spread)(e,(0,r.mergeProps)({get class(){return I()}},_),!1,!0),(0,r.insert)(e,(0,r.createComponent)(i.Show,{get when(){return M.content},get fallback(){return(()=>{let e=w();return e._$owner=(0,r.getOwner)(),e})()},get children(){return M.content}})),e})()]}})}})]}(n=e||(e={})).hover="hover",n.click="click",n.contextMenu="contextMenu",n.none="none",(o=t||(t={})).bottomLeft="bottomLeft",o.bottom="bottom",o.bottomRight="bottomRight",o.topLeft="topLeft",o.top="top",o.topRight="topRight",o.left="left",o.right="right";const C={class:void 0,css:void 0,content:void 0,getPopupContainer:void 0,trigger:void 0,open:void 0,onOpenChange:void 0,popupClass:void 0,popupCss:void 0,destroyInactive:!0,disabled:void 0,arrow:void 0,placement:void 0,dropdownMatchSelectWidth:void 0};(0,p.customElement)("n-popover",C,(e,t)=>{let n=t.element,o=(0,i.mergeProps)({onOpenChange(e){n.dispatchEvent(new CustomEvent("openchange",{detail:e}))},children:[...n.childNodes.values()]},e);return(0,i.createEffect)(()=>{n.removeAttribute("css")}),(0,r.createComponent)(b,o)});const M=b;
 //# sourceMappingURL=index.js.map

package/lib/popover/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/popover/index.tsx"],"sourcesContent":["import {\n  Show,\n  createComponent,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  onMount,\n  splitProps,\n} from 'solid-js';\nimport { isElementInside, isEqual, isFunction, passiveSupported } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { Portal } from 'solid-js/web';\nimport { popoverCss, portalCss } from './style';\nimport '../empty';\nimport theme from '../theme';\nimport type { BasicConfig, CustomElement } from '..';\n\nexport interface PopoverProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** 内容 */\n  content?: (() => JSX.Element) | JSX.Element;\n  /** 挂载到指定的元素，值为一个返回对应 DOM 元素 默认 document.body */\n  getPopupContainer?: (node?: HTMLElement | null) => HTMLElement;\n  /** 触发行为\n   * @default 'hover'\n   */\n  trigger?: keyof typeof TriggerOption;\n  /** 打开内容气泡 */\n  open?: boolean | null;\n  /** 内容打开关闭时的回调方法 */\n  onOpenChange?: (open: boolean | null) => void;\n  /** 气泡的自定义类名 */\n  popupClass?: string;\n  /** 气泡的自定义样式表 */\n  popupCss?: string;\n  /** 关闭后是否销毁  */\n  destroyInactive?: boolean;\n  /** 不可用状态  */\n  disabled?: boolean;\n  /** 添加一个箭头显示  */\n  arrow?: boolean;\n  /** 指定气泡显示的方向 */\n  placement?: keyof typeof Placement;\n  /** 气泡宽度与触发dom一致  */\n  dropdownMatchSelectWidth?: boolean;\n  /** 尺寸\n   * @default 'normal'\n   */\n  size?: BasicConfig['size'];\n  children?: JSX.Element;\n}\n\nexport enum TriggerOption {\n  /** 鼠标移入 */\n  hover = 'hover',\n  /** 点击 */\n  click = 'click',\n  /** 右键 */\n  contextMenu = 'contextMenu',\n  /** 无 */\n  none = 'none',\n}\n\nexport enum Placement {\n  /** 左下 */\n  bottomLeft = 'bottomLeft',\n  /** 下 */\n  bottom = 'bottom',\n  /** 右下 */\n  bottomRight = 'bottomRight',\n  /** 左上 */\n  topLeft = 'topLeft',\n  /** 上 */\n  top = 'top',\n  /** 右上 */\n  topRight = 'topRight',\n  /** 左 */\n  left = 'left',\n  /** 右 */\n  right = 'right',\n}\n\ntype Posi = {\n  left?: number;\n  top?: number;\n  right?: number;\n  bottom?: number;\n  '--x'?: number;\n};\n\ntype EventMap = {\n  click?: string;\n  hover?: string;\n  contextMenu?: string;\n  none?: never;\n  [key: string]: string | undefined;\n};\nfunction Popover(props: PopoverProps) {\n  const { isDark, baseStyle } = theme;\n  const mp = mergeProps(\n    {\n      trigger: 'hover',\n    },\n    props,\n  );\n  const [local] = splitProps(mp, [\n    'class',\n    'css',\n    'popupClass',\n    'popupCss',\n    'size',\n    'trigger',\n    'open',\n    'disabled',\n    'onOpenChange',\n    'dropdownMatchSelectWidth',\n    'destroyInactive',\n    'arrow',\n    'placement',\n    'getPopupContainer',\n    'children',\n    'content',\n  ]);\n  let ref: HTMLDivElement | undefined;\n  let childRef: HTMLSpanElement | undefined;\n  let closeTimer: NodeJS.Timeout | undefined;\n  const [open, setOpen] = createSignal<boolean | null>(null);\n  const [posi, setPosi] = createSignal<Posi>({});\n  const [up, setUp] = createSignal<boolean>(false);\n  const [width, setWidth] = createSignal('');\n\n  createEffect(() => {\n    if (local.open !== void 0) {\n      setOpen(local.open);\n    }\n  });\n  function openChange(next: boolean | null) {\n    if (!local.disabled) {\n      if (local.onOpenChange) {\n        local.onOpenChange(next);\n      }\n      if (local.open === void 0) {\n        setOpen(next);\n      }\n    }\n  }\n  function exit() {\n    if (open() === false) {\n      setOpen(null);\n      openChange(null);\n    }\n  }\n  createEffect(() => {\n    if (open() && local.dropdownMatchSelectWidth && childRef) {\n      setWidth(`.portal {width: ${childRef.offsetWidth}px;}`);\n    }\n  });\n\n  function close(e: MouseEvent | Event) {\n    clearTimeout(closeTimer);\n    closeTimer = setTimeout(\n      () => {\n        clearTimeout(closeTimer);\n        if ((e.target as HTMLElement)?.getAttribute('handle-closed') === 'false') {\n          return;\n        }\n        const isContains = isElementInside(e.target as Element, ref);\n\n        if ((open() && !isContains) || (isContains && e.type !== 'mousedown')) {\n          openChange(false);\n        }\n      },\n      local.trigger === 'hover' ? 300 : 0,\n    );\n  }\n  let portalTimer: NodeJS.Timeout | undefined;\n  const showPortal = function (e?: Event): void {\n    clearTimeout(portalTimer);\n    portalTimer = setTimeout(() => {\n      clearTimeout(portalTimer);\n      if (!ref || !childRef || (!e && local.trigger === 'contextMenu')) {\n        return;\n      }\n      if (e?.type === 'scroll' && local.trigger === 'contextMenu') {\n        openChange(false);\n        return;\n      }\n      const elRect = childRef!.getBoundingClientRect();\n      const portalRect = ref!.getBoundingClientRect();\n      const offsetX = portalRect.width / 2 - elRect.width / 2;\n      const margin = window.innerHeight - elRect.bottom;\n      const _placement = local.placement;\n\n      const _isBottom =\n        (!_placement?.startsWith('top') &&\n          margin > ref!.offsetHeight * 0.8 &&\n          margin > elRect.top) ||\n        _placement?.startsWith('bottom');\n      const arrowHeight = local.arrow ? 8 : 4;\n      const _posi: Posi = {};\n\n      switch (local.placement) {\n        case 'bottomLeft':\n        case 'left':\n        case 'topLeft':\n          _posi.left = elRect.left;\n          _posi['--x'] = -portalRect.width / 2 + 16;\n          break;\n        case 'bottomRight':\n        case 'right':\n        case 'topRight':\n          _posi.left = elRect.right - portalRect.width;\n          _posi['--x'] = portalRect.width / 2 - 16;\n          break;\n        case 'bottom':\n        case 'top':\n        default:\n          _posi.left = Math.abs(offsetX > elRect.left ? elRect.left : elRect.left - offsetX);\n          _posi['--x'] = -(_posi.left - elRect.left + offsetX);\n          break;\n      }\n      if (_isBottom) {\n        _posi.top = elRect.bottom + arrowHeight;\n      } else {\n        _posi.bottom = window.innerHeight - elRect.top + arrowHeight;\n      }\n      setPosi((prev) => {\n        return isEqual(prev, _posi) ? prev : _posi;\n      });\n      setUp((prev) => {\n        return prev === !_isBottom ? prev : !_isBottom;\n      });\n    }, 32);\n  };\n\n  function handleOpen(e: MouseEvent) {\n    clearTimeout(closeTimer);\n    e.stopPropagation();\n    if (local.trigger === 'contextMenu' && e.type === 'contextmenu') {\n      e.preventDefault();\n      setPosi((prev) => ({\n        ...prev,\n        left: e.clientX,\n        top: e.clientY,\n        ['--x']: -(ref?.getBoundingClientRect().width || 0) / 2 + 16,\n      }));\n    }\n    openChange(true);\n  }\n\n  const container = createMemo(() => {\n    if (isFunction(local.getPopupContainer)) {\n      return local.getPopupContainer(childRef);\n    }\n    return document.body;\n  });\n  const childrenProps = createMemo(() => {\n    const _props: Partial<Record<keyof EventMap, void>> = {};\n\n    const openEvent: EventMap = {\n      click: 'onMouseDown',\n      hover: 'onMouseEnter',\n      contextMenu: 'onContextMenu',\n      none: void 0,\n    };\n    const closeEvent: EventMap = {\n      hover: 'onMouseLeave',\n      click: void 0,\n      contextMenu: void 0,\n      none: void 0,\n    };\n\n    const openFn = openEvent[local.trigger];\n    const closeFn = closeEvent[local.trigger];\n\n    Object.assign(\n      _props,\n      openFn && {\n        [openFn]: handleOpen,\n      },\n      closeFn && {\n        [closeFn]: close,\n      },\n    );\n\n    return _props;\n  });\n\n  const portalStyle = createMemo(() => {\n    const p = posi();\n\n    // max-block-size: calc(100vb - ${(up() ? p.bottom : p.top) || 0}px);\n    return `.portal {${Object.keys(p)\n      .map((k) => `${k}:${p[k as keyof Posi]}px;`)\n      .join('')}z-index: 1;}`;\n  });\n  const portalCls = createMemo(() => {\n    return cx(\n      'portal',\n      local.arrow && 'arrow',\n      `${open() ? 'in' : 'out'}-${up() ? 'up' : 'down'}`,\n      local.size,\n      local.popupClass,\n    );\n  });\n  const hostStyle = createMemo(() => {\n    return `:host {--popover-bg: ${\n      isDark() ? '#1f1f1f' : 'var(--component-bg)'\n    };--popover-shadow-color: rgb(0 0 0 / 5%);}`;\n  });\n\n  createEffect(() => {\n    if (open()) {\n      showPortal();\n\n      window.addEventListener('scroll', showPortal, {\n        passive: passiveSupported,\n      });\n    }\n    onCleanup(() => {\n      window.removeEventListener('scroll', showPortal, false);\n    });\n  });\n  onMount(() => {\n    if (local.trigger !== 'none') {\n      document.documentElement.addEventListener('mousedown', close, false);\n    }\n  });\n  onCleanup(() => {\n    clearTimeout(closeTimer);\n    document.documentElement.removeEventListener('mousedown', close, false);\n  });\n\n  return (\n    <>\n      <style>\n        {baseStyle()}\n        {popoverCss}\n        {css(local.css)}\n      </style>\n      <span ref={childRef} class={cx('popover', local.size, local.class)} {...childrenProps()}>\n        {local.children}\n      </span>\n      <Show when={open() !== null || !local.destroyInactive}>\n        <Portal useShadow mount={container()}>\n          <style>\n            {baseStyle()}\n            {portalCss}\n            {hostStyle()}\n            {portalStyle()}\n            {width()}\n            {css(local.popupCss)}\n          </style>\n          <div ref={ref} onAnimationEnd={exit} class={portalCls()} {...childrenProps()}>\n            <Show when={local.content} fallback={<n-empty />}>\n              {local.content as JSX.Element}\n            </Show>\n          </div>\n        </Portal>\n      </Show>\n    </>\n  );\n}\n\nexport type PopoverElement = CustomElement<PopoverProps, 'onOpenChange'>;\n\nexport const defaultProps = {\n  class: void 0,\n  css: void 0,\n  content: void 0,\n  getPopupContainer: void 0,\n  trigger: void 0,\n  open: void 0,\n  onOpenChange: void 0,\n  popupClass: void 0,\n  popupCss: void 0,\n  destroyInactive: true,\n  disabled: void 0,\n  arrow: void 0,\n  placement: void 0,\n  dropdownMatchSelectWidth: void 0,\n};\ncustomElement<PopoverProps>('n-popover', defaultProps, (_, opt) => {\n  const el = opt.element;\n  const props = mergeProps(\n    {\n      onOpenChange(next: boolean | null) {\n        el.dispatchEvent(\n          new CustomEvent('openchange', {\n            detail: next,\n          }),\n        );\n      },\n      children: [...el.childNodes.values()],\n    },\n    _,\n  );\n\n  createEffect(() => {\n    el.removeAttribute('css');\n  });\n  return createComponent(Popover, props);\n});\nexport default Popover;\n"],"names":["TriggerOption","Placement","defaultProps","Popover","props","ref","childRef","closeTimer","portalTimer","isDark","baseStyle","theme","mp","mergeProps","trigger","local","splitProps","open","setOpen","createSignal","posi","setPosi","up","setUp","width","setWidth","openChange","next","disabled","onOpenChange","exit","close","e","clearTimeout","setTimeout","target","getAttribute","isContains","isElementInside","type","createEffect","dropdownMatchSelectWidth","offsetWidth","showPortal","elRect","getBoundingClientRect","portalRect","offsetX","margin","window","innerHeight","bottom","_placement","placement","_isBottom","startsWith","offsetHeight","top","arrowHeight","arrow","_posi","left","right","Math","abs","prev","isEqual","handleOpen","stopPropagation","preventDefault","clientX","clientY","container","createMemo","isFunction","getPopupContainer","document","body","childrenProps","_props","openFn","openEvent","click","hover","contextMenu","none","closeFn","closeEvent","Object","assign","portalStyle","p","keys","map","k","join","portalCls","cx","size","popupClass","hostStyle","addEventListener","passive","passiveSupported","onCleanup","removeEventListener","onMount","documentElement","popoverCss","css","class","children","Show","destroyInactive","Portal","portalCss","popupCss","content","customElement","_","opt","el","element","dispatchEvent","CustomEvent","detail","childNodes","values","removeAttribute","createComponent"],"rangeMappings":"","mappings":"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"}
+{"version":3,"sources":["../../components/popover/index.tsx"],"sourcesContent":["import {\n  Show,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onCleanup,\n  onMount,\n  splitProps,\n} from 'solid-js';\nimport { isElementInside, isEqual, isFunction, passiveSupported } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { Portal } from 'solid-js/web';\nimport { popoverCss, portalCss } from './style';\nimport '../empty';\nimport theme from '../theme';\nimport type { BasicConfig, CustomElement } from '..';\n\nexport interface PopoverProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** 内容 */\n  content?: (() => JSX.Element) | JSX.Element;\n  /** 挂载到指定的元素，值为一个返回对应 DOM 元素 默认 document.body */\n  getPopupContainer?: (node?: HTMLElement | null) => HTMLElement;\n  /** 触发行为\n   * @default 'hover'\n   */\n  trigger?: keyof typeof TriggerOption;\n  /** 打开内容气泡 */\n  open?: boolean | null;\n  /** 内容打开关闭时的回调方法 */\n  onOpenChange?: (open: boolean | null) => void;\n  /** 气泡的自定义类名 */\n  popupClass?: string;\n  /** 气泡的自定义样式表 */\n  popupCss?: string;\n  /** 关闭后是否销毁  */\n  destroyInactive?: boolean;\n  /** 不可用状态  */\n  disabled?: boolean;\n  /** 添加一个箭头显示  */\n  arrow?: boolean;\n  /** 指定气泡显示的方向 */\n  placement?: keyof typeof Placement;\n  /** 气泡宽度与触发dom一致  */\n  dropdownMatchSelectWidth?: boolean;\n  /** 尺寸\n   * @default 'normal'\n   */\n  size?: BasicConfig['size'];\n  children?: JSX.Element;\n}\n\nexport enum TriggerOption {\n  /** 鼠标移入 */\n  hover = 'hover',\n  /** 点击 */\n  click = 'click',\n  /** 右键 */\n  contextMenu = 'contextMenu',\n  /** 无 */\n  none = 'none',\n}\n\nexport enum Placement {\n  /** 左下 */\n  bottomLeft = 'bottomLeft',\n  /** 下 */\n  bottom = 'bottom',\n  /** 右下 */\n  bottomRight = 'bottomRight',\n  /** 左上 */\n  topLeft = 'topLeft',\n  /** 上 */\n  top = 'top',\n  /** 右上 */\n  topRight = 'topRight',\n  /** 左 */\n  left = 'left',\n  /** 右 */\n  right = 'right',\n}\n\ntype Posi = {\n  left?: number;\n  top?: number;\n  right?: number;\n  bottom?: number;\n  '--x'?: number;\n};\n\ntype EventMap = {\n  click?: string;\n  hover?: string;\n  contextMenu?: string;\n  none?: never;\n  [key: string]: string | undefined;\n};\nfunction Popover(props: PopoverProps) {\n  const { isDark, baseStyle } = theme;\n  const mp = mergeProps(\n    {\n      trigger: 'hover',\n    },\n    props,\n  );\n  const [local] = splitProps(mp, [\n    'class',\n    'css',\n    'popupClass',\n    'popupCss',\n    'size',\n    'trigger',\n    'open',\n    'disabled',\n    'onOpenChange',\n    'dropdownMatchSelectWidth',\n    'destroyInactive',\n    'arrow',\n    'placement',\n    'getPopupContainer',\n    'children',\n    'content',\n  ]);\n  let ref: HTMLDivElement | undefined;\n  let childRef: HTMLSpanElement | undefined;\n  let closeTimer: NodeJS.Timeout | undefined;\n  const [open, setOpen] = createSignal<boolean | null>(null);\n  const [posi, setPosi] = createSignal<Posi>({});\n  const [up, setUp] = createSignal<boolean>(false);\n  const [width, setWidth] = createSignal('');\n\n  createEffect(() => {\n    if (local.open !== void 0) {\n      setOpen(local.open);\n    }\n  });\n  function openChange(next: boolean | null) {\n    if (!local.disabled) {\n      if (local.onOpenChange) {\n        local.onOpenChange(next);\n      }\n      if (local.open === void 0) {\n        setOpen(next);\n      }\n    }\n  }\n  function exit() {\n    if (open() === false) {\n      setOpen(null);\n      openChange(null);\n    }\n  }\n  createEffect(() => {\n    if (open() && local.dropdownMatchSelectWidth && childRef) {\n      setWidth(`.portal {width: ${childRef.offsetWidth}px;}`);\n    }\n  });\n\n  function close(e: MouseEvent | Event) {\n    clearTimeout(closeTimer);\n    closeTimer = setTimeout(\n      () => {\n        clearTimeout(closeTimer);\n        if ((e.target as HTMLElement)?.getAttribute('handle-closed') === 'false') {\n          return;\n        }\n        const isContains = isElementInside(e.target as Element, ref);\n\n        if ((open() && !isContains) || (isContains && e.type !== 'mousedown')) {\n          openChange(false);\n        }\n      },\n      local.trigger === 'hover' ? 300 : 0,\n    );\n  }\n  let portalTimer: NodeJS.Timeout | undefined;\n  const showPortal = function (e?: Event): void {\n    clearTimeout(portalTimer);\n    portalTimer = setTimeout(() => {\n      clearTimeout(portalTimer);\n      if (!ref || !childRef || (!e && local.trigger === 'contextMenu')) {\n        return;\n      }\n      if (e?.type === 'scroll' && local.trigger === 'contextMenu') {\n        openChange(false);\n        return;\n      }\n      const elRect = childRef!.getBoundingClientRect();\n      const portalRect = ref!.getBoundingClientRect();\n      const offsetX = portalRect.width / 2 - elRect.width / 2;\n      const margin = window.innerHeight - elRect.bottom;\n      const _placement = local.placement;\n\n      const _isBottom =\n        (!_placement?.startsWith('top') &&\n          margin > ref!.offsetHeight * 0.8 &&\n          margin > elRect.top) ||\n        _placement?.startsWith('bottom');\n      const arrowHeight = local.arrow ? 8 : 4;\n      const _posi: Posi = {};\n\n      switch (local.placement) {\n        case 'bottomLeft':\n        case 'left':\n        case 'topLeft':\n          _posi.left = elRect.left;\n          _posi['--x'] = -portalRect.width / 2 + 16;\n          break;\n        case 'bottomRight':\n        case 'right':\n        case 'topRight':\n          _posi.left = elRect.right - portalRect.width;\n          _posi['--x'] = portalRect.width / 2 - 16;\n          break;\n        case 'bottom':\n        case 'top':\n        default:\n          _posi.left = Math.abs(offsetX > elRect.left ? elRect.left : elRect.left - offsetX);\n          _posi['--x'] = -(_posi.left - elRect.left + offsetX);\n          break;\n      }\n      if (_isBottom) {\n        _posi.top = elRect.bottom + arrowHeight;\n      } else {\n        _posi.bottom = window.innerHeight - elRect.top + arrowHeight;\n      }\n      setPosi((prev) => {\n        return isEqual(prev, _posi) ? prev : _posi;\n      });\n      setUp((prev) => {\n        return prev === !_isBottom ? prev : !_isBottom;\n      });\n    }, 32);\n  };\n\n  function handleOpen(e: MouseEvent) {\n    clearTimeout(closeTimer);\n    e.stopPropagation();\n    if (local.trigger === 'contextMenu' && e.type === 'contextmenu') {\n      e.preventDefault();\n      setPosi((prev) => ({\n        ...prev,\n        left: e.clientX,\n        top: e.clientY,\n        ['--x']: -(ref?.getBoundingClientRect().width || 0) / 2 + 16,\n      }));\n    }\n    openChange(true);\n  }\n\n  const container = createMemo(() => {\n    if (isFunction(local.getPopupContainer)) {\n      return local.getPopupContainer(childRef);\n    }\n    return document.body;\n  });\n  const childrenProps = createMemo(() => {\n    const _props: Partial<Record<keyof EventMap, void>> = {};\n\n    const openEvent: EventMap = {\n      click: 'onMouseDown',\n      hover: 'onMouseEnter',\n      contextMenu: 'onContextMenu',\n      none: void 0,\n    };\n    const closeEvent: EventMap = {\n      hover: 'onMouseLeave',\n      click: void 0,\n      contextMenu: void 0,\n      none: void 0,\n    };\n\n    const openFn = openEvent[local.trigger];\n    const closeFn = closeEvent[local.trigger];\n\n    Object.assign(\n      _props,\n      openFn && {\n        [openFn]: handleOpen,\n      },\n      closeFn && {\n        [closeFn]: close,\n      },\n    );\n\n    return _props;\n  });\n\n  const portalStyle = createMemo(() => {\n    const p = posi();\n\n    // max-block-size: calc(100vb - ${(up() ? p.bottom : p.top) || 0}px);\n    return `.portal {${Object.keys(p)\n      .map((k) => `${k}:${p[k as keyof Posi]}px;`)\n      .join('')}z-index: 1;}`;\n  });\n  const portalCls = createMemo(() => {\n    return cx(\n      'portal',\n      local.arrow && 'arrow',\n      `${open() ? 'in' : 'out'}-${up() ? 'up' : 'down'}`,\n      local.size,\n      local.popupClass,\n    );\n  });\n  const hostStyle = createMemo(() => {\n    return `:host {--popover-bg: ${\n      isDark() ? '#1f1f1f' : 'var(--component-bg)'\n    };--popover-shadow-color: rgb(0 0 0 / 5%);}`;\n  });\n\n  createEffect(() => {\n    if (open()) {\n      showPortal();\n\n      window.addEventListener('scroll', showPortal, {\n        passive: passiveSupported,\n      });\n    }\n    onCleanup(() => {\n      window.removeEventListener('scroll', showPortal, false);\n    });\n  });\n  onMount(() => {\n    if (local.trigger !== 'none') {\n      document.documentElement.addEventListener('mousedown', close, false);\n    }\n  });\n  onCleanup(() => {\n    clearTimeout(closeTimer);\n    document.documentElement.removeEventListener('mousedown', close, false);\n  });\n\n  return (\n    <>\n      <style>\n        {baseStyle()}\n        {popoverCss}\n        {css(local.css)}\n      </style>\n      <span ref={childRef} class={cx('popover', local.size, local.class)} {...childrenProps()}>\n        {local.children}\n      </span>\n      <Show when={open() !== null || !local.destroyInactive}>\n        <Portal useShadow mount={container()}>\n          <style>\n            {baseStyle()}\n            {portalCss}\n            {hostStyle()}\n            {portalStyle()}\n            {width()}\n            {css(local.popupCss)}\n          </style>\n          <div ref={ref} onAnimationEnd={exit} class={portalCls()} {...childrenProps()}>\n            <Show when={local.content} fallback={<n-empty />}>\n              {local.content as JSX.Element}\n            </Show>\n          </div>\n        </Portal>\n      </Show>\n    </>\n  );\n}\n\nexport type PopoverElement = CustomElement<PopoverProps, 'onOpenChange'>;\n\nexport const defaultProps = {\n  class: void 0,\n  css: void 0,\n  content: void 0,\n  getPopupContainer: void 0,\n  trigger: void 0,\n  open: void 0,\n  onOpenChange: void 0,\n  popupClass: void 0,\n  popupCss: void 0,\n  destroyInactive: true,\n  disabled: void 0,\n  arrow: void 0,\n  placement: void 0,\n  dropdownMatchSelectWidth: void 0,\n};\ncustomElement<PopoverProps>('n-popover', defaultProps, (_, opt) => {\n  const el = opt.element;\n  const props = mergeProps(\n    {\n      onOpenChange(next: boolean | null) {\n        el.dispatchEvent(\n          new CustomEvent('openchange', {\n            detail: next,\n          }),\n        );\n      },\n      children: [...el.childNodes.values()],\n    },\n    _,\n  );\n\n  createEffect(() => {\n    el.removeAttribute('css');\n  });\n  return <Popover {...props} />;\n});\nexport default Popover;\n"],"names":["TriggerOption","Placement","defaultProps","Popover","props","ref","childRef","closeTimer","portalTimer","isDark","baseStyle","theme","mp","mergeProps","trigger","local","splitProps","open","setOpen","createSignal","posi","setPosi","up","setUp","width","setWidth","openChange","next","disabled","onOpenChange","exit","close","e","clearTimeout","setTimeout","target","getAttribute","isContains","isElementInside","type","createEffect","dropdownMatchSelectWidth","offsetWidth","showPortal","elRect","getBoundingClientRect","portalRect","offsetX","margin","window","innerHeight","bottom","_placement","placement","_isBottom","startsWith","offsetHeight","top","arrowHeight","arrow","_posi","left","right","Math","abs","prev","isEqual","handleOpen","stopPropagation","preventDefault","clientX","clientY","container","createMemo","isFunction","getPopupContainer","document","body","childrenProps","_props","openFn","openEvent","click","hover","contextMenu","none","closeFn","closeEvent","Object","assign","portalStyle","p","keys","map","k","join","portalCls","cx","size","popupClass","hostStyle","addEventListener","passive","passiveSupported","onCleanup","removeEventListener","onMount","documentElement","popoverCss","css","class","children","Show","destroyInactive","Portal","portalCss","popupCss","content","customElement","_","opt","el","element","dispatchEvent","CustomEvent","detail","childNodes","values","removeAttribute"],"rangeMappings":"","mappings":"qBAyDYA,EAWAC,sNAoVZ,OAAuB,mBAAvB,GArCaC,YAAY,mBAAZA,qBAtWU,0BAJhB,wBACgE,mDAAA,2CAAA,8CAAA,kDAC/C,yBACM,2BAEQ,mBAC/B,8BACW,2LAsFlB,SAASC,EAAQC,CAAmB,MA0B9BC,EACAC,EACAC,EAkDAC,EA7EJ,GAAM,CAAEC,OAAAA,CAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CAC7BC,EAAKC,GAAAA,YAAU,EACnB,CACEC,QAAS,OACX,EACAV,GAEI,CAACW,EAAM,CAAGC,GAAAA,YAAU,EAACJ,EAAI,CAC7B,QACA,MACA,aACA,WACA,OACA,UACA,OACA,WACA,eACA,2BACA,kBACA,QACA,YACA,oBACA,WACA,UACD,EAIK,CAACK,EAAMC,EAAQ,CAAGC,GAAAA,cAAY,EAAiB,MAC/C,CAACC,EAAMC,EAAQ,CAAGF,GAAAA,cAAY,EAAO,CAAC,GACtC,CAACG,EAAIC,EAAM,CAAGJ,GAAAA,cAAY,EAAU,CAAA,GACpC,CAACK,EAAOC,EAAS,CAAGN,GAAAA,cAAY,EAAC,IAOvC,SAASO,EAAWC,CAAoB,EACjCZ,EAAMa,QAAQ,GACbb,EAAMc,YAAY,EACpBd,EAAMc,YAAY,CAACF,GAEF,KAAK,IAApBZ,EAAME,IAAI,EACZC,EAAQS,GAGd,CACA,SAASG,IACQ,CAAA,IAAXb,MACFC,EAAQ,MACRQ,EAAW,MAEf,CAOA,SAASK,EAAMC,CAAqB,EAClCC,aAAa1B,GACbA,EAAa2B,WACX,KAEE,GADAD,aAAa1B,GACT,AAACyB,EAAEG,MAAM,EAAkBC,aAAa,mBAAqB,QAC/D,OAEF,IAAMC,EAAaC,GAAAA,SAAe,EAACN,EAAEG,MAAM,CAAa9B,GAEpD,CAAA,AAACY,KAAU,CAACoB,GAAgBA,GAAcL,AAAW,cAAXA,EAAEO,IAAI,AAAgB,GAClEb,EAAW,CAAA,EAEf,EACAX,AAAkB,UAAlBA,EAAMD,OAAO,CAAe,IAAM,EAEtC,CA3CA0B,GAAAA,cAAY,EAAC,KACQ,KAAK,IAApBzB,EAAME,IAAI,EACZC,EAAQH,EAAME,IAAI,CAEtB,GAiBAuB,GAAAA,cAAY,EAAC,KACPvB,KAAUF,EAAM0B,wBAAwB,EAAInC,GAC9CmB,EAAS,CAAC,gBAAgB,EAAEnB,EAASoC,WAAW,CAAC,IAAI,CAAC,CAE1D,GAoBA,IAAMC,EAAa,SAAUX,CAAS,EACpCC,aAAazB,GACbA,EAAc0B,WAAW,KAEvB,GADAD,aAAazB,GACT,CAACH,GAAO,CAACC,GAAa,CAAC0B,GAAKjB,AAAkB,gBAAlBA,EAAMD,OAAO,CAC3C,OAEF,GAAIkB,GAAGO,OAAS,UAAYxB,AAAkB,gBAAlBA,EAAMD,OAAO,CAAoB,CAC3DY,EAAW,CAAA,GACX,MACF,CACA,IAAMkB,EAAStC,EAAUuC,qBAAqB,GACxCC,EAAazC,EAAKwC,qBAAqB,GACvCE,EAAUD,EAAWtB,KAAK,CAAG,EAAIoB,EAAOpB,KAAK,CAAG,EAChDwB,EAASC,OAAOC,WAAW,CAAGN,EAAOO,MAAM,CAC3CC,EAAarC,EAAMsC,SAAS,CAE5BC,EACJ,AAAC,CAACF,GAAYG,WAAW,QACvBP,EAAS3C,AAAoB,GAApBA,EAAKmD,YAAY,EAC1BR,EAASJ,EAAOa,GAAG,EACrBL,GAAYG,WAAW,UACnBG,EAAc3C,EAAM4C,KAAK,CAAG,EAAI,EAChCC,EAAc,CAAC,EAErB,OAAQ7C,EAAMsC,SAAS,EACrB,IAAK,aACL,IAAK,OACL,IAAK,UACHO,EAAMC,IAAI,CAAGjB,EAAOiB,IAAI,CACxBD,CAAK,CAAC,MAAM,CAAG,CAACd,EAAWtB,KAAK,CAAG,EAAI,GACvC,KACF,KAAK,cACL,IAAK,QACL,IAAK,WACHoC,EAAMC,IAAI,CAAGjB,EAAOkB,KAAK,CAAGhB,EAAWtB,KAAK,CAC5CoC,CAAK,CAAC,MAAM,CAAGd,EAAWtB,KAAK,CAAG,EAAI,GACtC,KACF,SAGEoC,EAAMC,IAAI,CAAGE,KAAKC,GAAG,CAACjB,EAAUH,EAAOiB,IAAI,CAAGjB,EAAOiB,IAAI,CAAGjB,EAAOiB,IAAI,CAAGd,GAC1Ea,CAAK,CAAC,MAAM,CAAG,CAAEA,CAAAA,EAAMC,IAAI,CAAGjB,EAAOiB,IAAI,CAAGd,CAAM,CAEtD,CACIO,EACFM,EAAMH,GAAG,CAAGb,EAAOO,MAAM,CAAGO,EAE5BE,EAAMT,MAAM,CAAGF,OAAOC,WAAW,CAAGN,EAAOa,GAAG,CAAGC,EAEnDrC,EAAQ,AAAC4C,GACAC,GAAAA,SAAO,EAACD,EAAML,GAASK,EAAOL,GAEvCrC,EAAM,AAAC0C,GACEA,AAAS,CAACX,IAAVW,EAAsBA,EAAO,CAACX,EAEzC,EAAG,GACL,EAEA,SAASa,EAAWnC,CAAa,EAC/BC,aAAa1B,GACbyB,EAAEoC,eAAe,GACK,gBAAlBrD,EAAMD,OAAO,EAAsBkB,AAAW,gBAAXA,EAAEO,IAAI,GAC3CP,EAAEqC,cAAc,GAChBhD,EAAQ,AAAC4C,GAAU,CAAA,CACjB,GAAGA,CAAI,CACPJ,KAAM7B,EAAEsC,OAAO,CACfb,IAAKzB,EAAEuC,OAAO,CACb,MAAQ,CAAElE,CAAAA,GAAKwC,wBAAwBrB,OAAS,CAAA,EAAK,EAAI,EAC5D,CAAA,IAEFE,EAAW,CAAA,EACb,CAEA,IAAM8C,EAAYC,GAAAA,YAAU,EAAC,IAC3B,AAAIC,GAAAA,SAAU,EAAC3D,EAAM4D,iBAAiB,EAC7B5D,EAAM4D,iBAAiB,CAACrE,GAE1BsE,SAASC,IAAI,EAEhBC,EAAgBL,GAAAA,YAAU,EAAC,KAC/B,IAAMM,EAAgD,CAAC,EAejDC,EAASC,AAba,CAC1BC,MAAO,cACPC,MAAO,eACPC,YAAa,gBACbC,KAAM,KAAK,CACb,CAQwB,CAACtE,EAAMD,OAAO,CAAC,CACjCwE,EAAUC,AARa,CAC3BJ,MAAO,eACPD,MAAO,KAAK,EACZE,YAAa,KAAK,EAClBC,KAAM,KAAK,CACb,CAG0B,CAACtE,EAAMD,OAAO,CAAC,CAYzC,OAVA0E,OAAOC,MAAM,CACXV,EACAC,GAAU,CACR,CAACA,EAAO,CAAEb,CACZ,EACAmB,GAAW,CACT,CAACA,EAAQ,CAAEvD,CACb,GAGKgD,CACT,GAEMW,EAAcjB,GAAAA,YAAU,EAAC,KAC7B,IAAMkB,EAAIvE,IAGV,MAAO,CAAC,SAAS,EAAEoE,OAAOI,IAAI,CAACD,GAC5BE,GAAG,CAAC,AAACC,GAAM,CAAC,EAAEA,EAAE,CAAC,EAAEH,CAAC,CAACG,EAAgB,CAAC,GAAG,CAAC,EAC1CC,IAAI,CAAC,IAAI,YAAY,CAAC,AAC3B,GACMC,EAAYvB,GAAAA,YAAU,EAAC,IACpBwB,GAAAA,IAAE,EACP,SACAlF,EAAM4C,KAAK,EAAI,QACf,CAAC,EAAE1C,IAAS,KAAO,MAAM,CAAC,EAAEK,IAAO,KAAO,OAAO,CAAC,CAClDP,EAAMmF,IAAI,CACVnF,EAAMoF,UAAU,GAGdC,EAAY3B,GAAAA,YAAU,EAAC,IACpB,CAAC,qBAAqB,EAC3BhE,IAAW,UAAY,sBACxB,0CAA0C,CAAC,EAyB9C,MAtBA+B,GAAAA,cAAY,EAAC,KACPvB,MACF0B,IAEAM,OAAOoD,gBAAgB,CAAC,SAAU1D,EAAY,CAC5C2D,QAASC,SAAgB,AAC3B,IAEFC,GAAAA,WAAS,EAAC,KACRvD,OAAOwD,mBAAmB,CAAC,SAAU9D,EAAY,CAAA,EACnD,EACF,GACA+D,GAAAA,SAAO,EAAC,KACgB,SAAlB3F,EAAMD,OAAO,EACf8D,SAAS+B,eAAe,CAACN,gBAAgB,CAAC,YAAatE,EAAO,CAAA,EAElE,GACAyE,GAAAA,WAAS,EAAC,KACRvE,aAAa1B,GACbqE,SAAS+B,eAAe,CAACF,mBAAmB,CAAC,YAAa1E,EAAO,CAAA,EACnE,yCAKOrB,uBACAkG,YAAU,0BACVC,GAAAA,KAAG,EAAC9F,EAAM8F,GAAG,gCAELvG,4CAAAA,uDAAiB2F,GAAAA,IAAE,EAAC,UAAWlF,EAAMmF,IAAI,CAAEnF,EAAM+F,KAAK,IAAOhC,6BACrE/D,EAAMgG,QAAQ,8BAEhBC,MAAI,oBAAO/F,AAAW,OAAXA,KAAmB,CAACF,EAAMkG,eAAe,6CAClDC,QAAM,kCAAkB1C,gEAEpB9D,uBACAyG,WAAS,sBACTf,uBACAV,uBACAlE,2BACAqF,GAAAA,KAAG,EAAC9F,EAAMqG,QAAQ,gCAEX/G,gDAAqByB,uCAArBzB,wDAAkC2F,MAAiBlB,+CAC1DkC,MAAI,oBAAOjG,EAAMsG,OAAO,sGACtBtG,EAAMsG,OAAO,kBAO5B,EAtTYrH,EAAAA,IAAAA,gFAWAC,EAAAA,IAAAA,iKA+SL,MAAMC,EAAe,CAC1B4G,MAAO,KAAK,EACZD,IAAK,KAAK,EACVQ,QAAS,KAAK,EACd1C,kBAAmB,KAAK,EACxB7D,QAAS,KAAK,EACdG,KAAM,KAAK,EACXY,aAAc,KAAK,EACnBsE,WAAY,KAAK,EACjBiB,SAAU,KAAK,EACfH,gBAAiB,CAAA,EACjBrF,SAAU,KAAK,EACf+B,MAAO,KAAK,EACZN,UAAW,KAAK,EAChBZ,yBAA0B,KAAK,CACjC,EACA6E,GAAAA,eAAa,EAAe,YAAapH,EAAc,CAACqH,EAAGC,KACzD,IAAMC,EAAKD,EAAIE,OAAO,CAChBtH,EAAQS,GAAAA,YAAU,EACtB,CACEgB,aAAaF,CAAoB,EAC/B8F,EAAGE,aAAa,CACd,IAAIC,YAAY,aAAc,CAC5BC,OAAQlG,CACV,GAEJ,EACAoF,SAAU,IAAIU,EAAGK,UAAU,CAACC,MAAM,GAAG,AACvC,EACAR,GAMF,MAHA/E,GAAAA,cAAY,EAAC,KACXiF,EAAGO,eAAe,CAAC,MACrB,yBACQ7H,EAAYC,EACtB,SACA,EAAeD"}

package/lib/provider/index.js

@@ -1,2 +1,2 @@
-"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return l}});const t=require("solid-js/web"),r=require("solid-js"),n=require("solid-element"),o=(e=require("../theme"))&&e.__esModule?e:{default:e},s=(0,t.template)("<style>");function c(e){let{baseStyle:c,scheme:l,setScheme:u}=o.default;return(0,n.noShadowDOM)(),(0,r.createEffect)(()=>{e.onScheme?.(l())}),(0,r.createEffect)(()=>{e.scheme&&u(e.scheme)}),[(()=>{let e=s();return(0,t.insert)(e,c),e})(),(0,t.memo)(()=>e.children)]}(0,n.customElement)("n-provider",(e,t)=>{let n=t.element,o=(0,r.mergeProps)({onScheme(e){n.dispatchEvent(new CustomEvent("scheme",{detail:e}))}},e);return(0,r.createComponent)(c,o)});const l=c;
+"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return l}});const t=require("solid-js/web"),r=require("solid-js"),n=require("solid-element"),o=(e=require("../theme"))&&e.__esModule?e:{default:e},s=(0,t.template)("<style>");function c(e){let{baseStyle:c,scheme:l,setScheme:u}=o.default;return(0,n.noShadowDOM)(),(0,r.createEffect)(()=>{e.onScheme?.(l())}),(0,r.createEffect)(()=>{e.scheme&&u(e.scheme)}),[(()=>{let e=s();return(0,t.insert)(e,c),e})(),(0,t.memo)(()=>e.children)]}(0,n.customElement)("n-provider",(e,n)=>{let o=n.element,s=(0,r.mergeProps)({onScheme(e){o.dispatchEvent(new CustomEvent("scheme",{detail:e}))}},e);return(0,t.createComponent)(c,s)});const l=c;
 //# sourceMappingURL=index.js.map

package/lib/provider/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/provider/index.tsx"],"sourcesContent":["import { createComponent, createEffect, mergeProps } from 'solid-js';\nimport { customElement, noShadowDOM } from 'solid-element';\nimport theme, { ColorScheme } from '../theme';\nimport type { CustomElement } from '..';\n\nfunction Provider(props: ProviderProps) {\n  const { baseStyle, scheme, setScheme } = theme;\n\n  noShadowDOM();\n  createEffect(() => {\n    props.onScheme?.(scheme());\n  });\n  createEffect(() => {\n    if (props.scheme) {\n      setScheme(props.scheme);\n    }\n  });\n  return (\n    <>\n      <style>{baseStyle()}</style>\n      {props.children}\n    </>\n  );\n}\nexport interface ProviderProps {\n  /** 主题, 等同于使用 setScheme\n   * @default 'auto'\n   */\n  scheme?: keyof typeof ColorScheme;\n  /** 包裹的子项 */\n  children?: JSX.Element;\n  /** 响应 scheme 变化 */\n  onScheme?(scheme: keyof typeof ColorScheme): void;\n}\nexport type ProviderElement = CustomElement<ProviderProps, 'onScheme'>;\n\ncustomElement<ProviderProps>('n-provider', (_, opt) => {\n  const el = opt.element;\n  const props = mergeProps(\n    {\n      onScheme(scheme: keyof typeof ColorScheme) {\n        el.dispatchEvent(\n          new CustomEvent('scheme', {\n            detail: scheme,\n          }),\n        );\n      },\n    },\n    _,\n  );\n\n  return createComponent(Provider, props);\n});\nexport default Provider;\n"],"names":["Provider","props","baseStyle","scheme","setScheme","theme","noShadowDOM","createEffect","onScheme","children","customElement","_","opt","el","element","mergeProps","dispatchEvent","CustomEvent","detail","createComponent"],"rangeMappings":"","mappings":"wGAqDA,+CAAA,+CArD0D,sBACf,8BACR,qEAGnC,SAASA,EAASC,CAAoB,EACpC,GAAM,CAAEC,UAAAA,CAAS,CAAEC,OAAAA,CAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CAW9C,MATAC,GAAAA,aAAW,IACXC,GAAAA,cAAY,EAAC,KACXN,EAAMO,QAAQ,GAAGL,IACnB,GACAI,GAAAA,cAAY,EAAC,KACPN,EAAME,MAAM,EACdC,EAAUH,EAAME,MAAM,CAE1B,yCAGYD,wBACPD,EAAMQ,QAAQ,EAGrB,CAaAC,GAAAA,eAAa,EAAgB,aAAc,CAACC,EAAGC,KAC7C,IAAMC,EAAKD,EAAIE,OAAO,CAChBb,EAAQc,GAAAA,YAAU,EACtB,CACEP,SAASL,CAAgC,EACvCU,EAAGG,aAAa,CACd,IAAIC,YAAY,SAAU,CACxBC,OAAQf,CACV,GAEJ,CACF,EACAQ,GAGF,MAAOQ,GAAAA,iBAAe,EAACnB,EAAUC,EACnC,SACA,EAAeD"}
+{"version":3,"sources":["../../components/provider/index.tsx"],"sourcesContent":["import { createEffect, mergeProps } from 'solid-js';\nimport { customElement, noShadowDOM } from 'solid-element';\nimport theme, { ColorScheme } from '../theme';\nimport type { CustomElement } from '..';\n\nfunction Provider(props: ProviderProps) {\n  const { baseStyle, scheme, setScheme } = theme;\n\n  noShadowDOM();\n  createEffect(() => {\n    props.onScheme?.(scheme());\n  });\n  createEffect(() => {\n    if (props.scheme) {\n      setScheme(props.scheme);\n    }\n  });\n  return (\n    <>\n      <style>{baseStyle()}</style>\n      {props.children}\n    </>\n  );\n}\nexport interface ProviderProps {\n  /** 主题, 等同于使用 setScheme\n   * @default 'auto'\n   */\n  scheme?: keyof typeof ColorScheme;\n  /** 包裹的子项 */\n  children?: JSX.Element;\n  /** 响应 scheme 变化 */\n  onScheme?(scheme: keyof typeof ColorScheme): void;\n}\nexport type ProviderElement = CustomElement<ProviderProps, 'onScheme'>;\n\ncustomElement<ProviderProps>('n-provider', (_, opt) => {\n  const el = opt.element;\n  const props = mergeProps(\n    {\n      onScheme(scheme: keyof typeof ColorScheme) {\n        el.dispatchEvent(\n          new CustomEvent('scheme', {\n            detail: scheme,\n          }),\n        );\n      },\n    },\n    _,\n  );\n\n  return <Provider {...props} />;\n});\nexport default Provider;\n"],"names":["Provider","props","baseStyle","scheme","setScheme","theme","noShadowDOM","createEffect","onScheme","children","customElement","_","opt","el","element","mergeProps","dispatchEvent","CustomEvent","detail"],"rangeMappings":"","mappings":"wGAqDA,+CAAA,+CArDyC,sBACE,8BACR,qEAGnC,SAASA,EAASC,CAAoB,EACpC,GAAM,CAAEC,UAAAA,CAAS,CAAEC,OAAAA,CAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CAW9C,MATAC,GAAAA,aAAW,IACXC,GAAAA,cAAY,EAAC,KACXN,EAAMO,QAAQ,GAAGL,IACnB,GACAI,GAAAA,cAAY,EAAC,KACPN,EAAME,MAAM,EACdC,EAAUH,EAAME,MAAM,CAE1B,yCAGYD,wBACPD,EAAMQ,QAAQ,EAGrB,CAaAC,GAAAA,eAAa,EAAgB,aAAc,CAACC,EAAGC,KAC7C,IAAMC,EAAKD,EAAIE,OAAO,CAChBb,EAAQc,GAAAA,YAAU,EACtB,CACEP,SAASL,CAAgC,EACvCU,EAAGG,aAAa,CACd,IAAIC,YAAY,SAAU,CACxBC,OAAQf,CACV,GAEJ,CACF,EACAQ,GAGF,4BAAQX,EAAaC,EACvB,SACA,EAAeD"}