neko-ui 2.8.21 → 2.8.23

package/es/input/index.js

@@ -1,2 +1,2 @@
-import{use as e}from"solid-js/web";import{template as t}from"solid-js/web";import{setAttribute as o}from"solid-js/web";import{memo as l}from"solid-js/web";import{insert as r}from"solid-js/web";import{effect as n}from"solid-js/web";import{delegateEvents as s}from"solid-js/web";import{createComponent as i}from"solid-js/web";import{className as a}from"solid-js/web";import{addEventListener as u}from"solid-js/web";let d=t("<style> "),c=t("<style>"),p=t('<span class="prefix">'),f=t('<label class="label">'),v=t('<span class="caps-lock">'),m=t('<span class="suffix">'),h=t('<fieldset><input class="input" part="input">');import{Show as w,createEffect as b,createMemo as g,createSignal as y,mergeProps as $}from"solid-js";import _ from"@moneko/common/lib/isFunction";import{css as x,cx as C}from"@moneko/css";import{customElement as k}from"solid-element";import{style as I}from"./style";import j from"../theme";function L(t){let s;let{baseStyle:$}=j,[k,L]=y(),[D,K]=y(!1);function z(e){var o;null==t.onChange||t.onChange.call(t,function(e){if(t.parser)return _(t.parser)?t.parser(e):t.parser;if("number"===t.type&&"string"==typeof e){let t=e.replace(/[^\d]/g,"");return t.length?parseFloat(t):void 0}return e}(null==(o=e.target)?void 0:o.value))}function E(e){null==t.onMouseDown||t.onMouseDown.call(t,e)}function M(e){t.capsLockIcon&&K(e.getModifierState("CapsLock")),null==t.onKeyDown||t.onKeyDown.call(t,e)}function B(e){null==t.onBlur||t.onBlur.call(t,e)}function F(e){null==t.onKeyUp||t.onKeyUp.call(t,e)}let P=g(()=>t.formatter?_(t.formatter)?t.formatter(t.value):t.formatter:t.value);return b(()=>{t.label&&L(`.label {--x: ${(null==s?void 0:s.offsetLeft)||0}px;opacity:1;}`)}),[(()=>{let e=d(),t=e.firstChild;return n(()=>t.data=$()),e})(),(()=>{let e=c();return e.textContent=I,e})(),(()=>{let e=d(),t=e.firstChild;return n(()=>t.data=k()),e})(),i(w,{get when(){return t.css},get children(){let e=d(),o=e.firstChild;return n(()=>o.data=x(t.css)),e}}),(()=>{let d=h(),c=d.firstChild,b=s;return r(d,i(w,{get when(){return t.prefixIcon},get children(){let e=p();return r(e,()=>t.prefixIcon),e}}),c),u(c,"blur",B),u(c,"keyup",F,!0),u(c,"keydown",M,!0),u(c,"mousedown",E,!0),u(c,"change",z),"function"==typeof b?e(b,c):s=c,r(d,i(w,{get when(){return t.label},get children(){let e=f();return r(e,()=>t.label),e}}),null),r(d,i(w,{get when(){return l(()=>!!t.capsLockIcon)()&&D()},get children(){let e=v();return r(e,()=>t.capsLockIcon),e}}),null),r(d,i(w,{get when(){return t.suffixIcon},get children(){let e=m();return r(e,()=>t.suffixIcon),e}}),null),n(e=>{let l=C("fieldset",t.size,t.status,t.class),r=t.disabled,n=t.type,s=t.autoComplete,i=t.accept,u=t.placeholder;return l!==e._v$&&a(d,e._v$=l),r!==e._v$2&&(d.disabled=e._v$2=r),n!==e._v$3&&o(c,"type",e._v$3=n),s!==e._v$4&&o(c,"autocomplete",e._v$4=s),i!==e._v$5&&o(c,"accept",e._v$5=i),u!==e._v$6&&o(c,"placeholder",e._v$6=u),e},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0,_v$6:void 0}),n(()=>c.value=P()),d})()]}export const defaultInportProps={class:void 0,css:void 0,suffixIcon:void 0,prefixIcon:void 0,capsLockIcon:void 0,size:void 0,disabled:void 0,status:void 0,type:void 0,label:void 0,value:void 0,defaultValue:void 0,formatter:void 0,parser:void 0,onChange:void 0,onMouseDown:void 0,onKeyDown:void 0,accept:void 0,autoComplete:void 0,placeholder:"请输入"};k("n-input",defaultInportProps,(e,t)=>{let o=t.element;return i(L,$({css:o.css,size:o.size||"normal",value:o.value||o.defaultValue||"",type:o.type||"text",onChange(e){o.dispatchEvent(new CustomEvent("change",{detail:e}))}},e))});export default L;s(["keydown","keyup","mousedown"]);
+import{use as e}from"solid-js/web";import{template as t}from"solid-js/web";import{setAttribute as o}from"solid-js/web";import{memo as l}from"solid-js/web";import{insert as r}from"solid-js/web";import{effect as n}from"solid-js/web";import{delegateEvents as s}from"solid-js/web";import{createComponent as i}from"solid-js/web";import{className as a}from"solid-js/web";import{addEventListener as u}from"solid-js/web";let d=t("<style> "),c=t("<style>"),p=t('<span class="prefix">'),f=t('<label class="label">'),v=t('<span class="caps-lock">'),m=t('<span class="suffix">'),h=t('<fieldset><input class="input" part="input">');import{createEffect as w,createMemo as b,createSignal as g,mergeProps as y,Show as $}from"solid-js";import _ from"@moneko/common/lib/isFunction";import{css as x,cx as C}from"@moneko/css";import{customElement as k}from"solid-element";import I from"../theme";import{style as j}from"./style";function L(t){let s;let{baseStyle:y}=I,[k,L]=g(),[D,K]=g(!1);function z(e){var o;null==t.onChange||t.onChange.call(t,function(e){if(t.parser)return _(t.parser)?t.parser(e):t.parser;if("number"===t.type&&"string"==typeof e){let t=e.replace(/[^\d]/g,"");return t.length?parseFloat(t):void 0}return e}(null==(o=e.target)?void 0:o.value))}function E(e){null==t.onMouseDown||t.onMouseDown.call(t,e)}function M(e){t.capsLockIcon&&K(e.getModifierState("CapsLock")),null==t.onKeyDown||t.onKeyDown.call(t,e)}function B(e){null==t.onBlur||t.onBlur.call(t,e)}function F(e){null==t.onKeyUp||t.onKeyUp.call(t,e)}let P=b(()=>t.formatter?_(t.formatter)?t.formatter(t.value):t.formatter:t.value);return w(()=>{t.label&&L(`.label {--x: ${(null==s?void 0:s.offsetLeft)||0}px;opacity:1;}`)}),[(()=>{let e=d(),t=e.firstChild;return n(()=>t.data=y()),e})(),(()=>{let e=c();return e.textContent=j,e})(),(()=>{let e=d(),t=e.firstChild;return n(()=>t.data=k()),e})(),i($,{get when(){return t.css},get children(){let e=d(),o=e.firstChild;return n(()=>o.data=x(t.css)),e}}),(()=>{let d=h(),c=d.firstChild,w=s;return r(d,i($,{get when(){return t.prefixIcon},get children(){let e=p();return r(e,()=>t.prefixIcon),e}}),c),u(c,"blur",B),u(c,"keyup",F,!0),u(c,"keydown",M,!0),u(c,"mousedown",E,!0),u(c,"change",z),"function"==typeof w?e(w,c):s=c,r(d,i($,{get when(){return t.label},get children(){let e=f();return r(e,()=>t.label),e}}),null),r(d,i($,{get when(){return l(()=>!!t.capsLockIcon)()&&D()},get children(){let e=v();return r(e,()=>t.capsLockIcon),e}}),null),r(d,i($,{get when(){return t.suffixIcon},get children(){let e=m();return r(e,()=>t.suffixIcon),e}}),null),n(e=>{let l=C("fieldset",t.size,t.status,t.class),r=t.disabled,n=t.type,s=t.autoComplete,i=t.accept,u=t.placeholder;return l!==e._v$&&a(d,e._v$=l),r!==e._v$2&&(d.disabled=e._v$2=r),n!==e._v$3&&o(c,"type",e._v$3=n),s!==e._v$4&&o(c,"autocomplete",e._v$4=s),i!==e._v$5&&o(c,"accept",e._v$5=i),u!==e._v$6&&o(c,"placeholder",e._v$6=u),e},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0,_v$6:void 0}),n(()=>c.value=P()),d})()]}export const defaultInportProps={class:void 0,css:void 0,suffixIcon:void 0,prefixIcon:void 0,capsLockIcon:void 0,size:void 0,disabled:void 0,status:void 0,type:void 0,label:void 0,value:void 0,defaultValue:void 0,formatter:void 0,parser:void 0,onChange:void 0,onMouseDown:void 0,onKeyDown:void 0,accept:void 0,autoComplete:void 0,placeholder:"请输入"};k("n-input",defaultInportProps,(e,t)=>{let o=t.element;return i(L,y({css:o.css,size:o.size||"normal",value:o.value||o.defaultValue||"",type:o.type||"text",onChange(e){o.dispatchEvent(new CustomEvent("change",{detail:e}))}},e))});export default L;s(["keydown","keyup","mousedown"]);
 //# sourceMappingURL=index.js.map

package/es/input/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/input/index.tsx"],"sourcesContent":["import { Show, createEffect, createMemo, createSignal, mergeProps } from 'solid-js';\nimport { isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { style } from './style';\nimport theme from '../theme';\nimport type { BasicConfig, CustomElement } from '..';\n\nexport interface InputProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** 前缀 */\n  prefixIcon?: JSX.Element;\n  /** 后缀 */\n  suffixIcon?: JSX.Element;\n  /** 大写锁定图标, 可以结合密码输入框使用\n   * @since 2.5.2\n   */\n  capsLockIcon?: JSX.Element;\n  /** 禁用 */\n  disabled?: boolean;\n  /** 自动完成 */\n  autoComplete?: string;\n  /** 占位文本 */\n  placeholder?: string;\n  /** 组件尺寸\n   * @default 'normal'\n   */\n  size?: BasicConfig['size'];\n  /** 描述 */\n  label?: JSX.Element;\n  /** 状态 */\n  status?: 'error' | 'warning' | 'success';\n  /** 类型\n   * @default 'text'\n   */\n  type?: 'email' | 'hidden' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url';\n  /** HTML attribute: accept */\n  accept?: string;\n  /** 值 */\n  value?: string | number;\n  /** 默认值 */\n  defaultValue?: string | number;\n  /** 值变更时触发的函数 */\n  onChange?: (value: InputProps['value']) => void;\n  onKeyDown?(e: KeyboardEvent): void;\n  onMouseDown?(e: MouseEvent): void;\n  onFocus?(e: FocusEvent): void;\n  onBlur?(e: FocusEvent): void;\n  onKeyUp?(e: KeyboardEvent): void;\n  /** 指定输入框展示值的格式 */\n  formatter?: (value?: InputProps['value']) => InputProps['value'];\n  /** 搭配 formatter 使用, 将转换后的值转回原来的值 */\n  parser?: (value?: InputProps['value']) => InputProps['value'];\n}\n\nfunction Input(props: InputProps) {\n  const { baseStyle } = theme;\n  let inputRef: HTMLInputElement | undefined;\n  const [x, setX] = createSignal<string>();\n  const [capsLock, setCapsLock] = createSignal(false);\n\n  function parserValue(val: InputProps['value']) {\n    if (props.parser) {\n      return isFunction(props.parser) ? props.parser(val) : props.parser;\n    } else if (props.type === 'number' && typeof val === 'string') {\n      const num = val.replace(/[^\\d]/g, '');\n\n      return num.length ? parseFloat(num) : void 0;\n    }\n    return val;\n  }\n\n  function handleInput(e: Event & { target: HTMLInputElement }) {\n    props.onChange?.(parserValue(e.target?.value));\n  }\n  function handleMouseDown(e: MouseEvent) {\n    props.onMouseDown?.(e);\n  }\n  function handleKeyDown(e: KeyboardEvent) {\n    if (props.capsLockIcon) {\n      setCapsLock(e.getModifierState('CapsLock'));\n    }\n    props.onKeyDown?.(e);\n  }\n  function handleBlur(e: FocusEvent) {\n    props.onBlur?.(e);\n  }\n  function handleKeyUp(e: KeyboardEvent) {\n    props.onKeyUp?.(e);\n  }\n\n  const value = createMemo(() => {\n    if (props.formatter) {\n      return isFunction(props.formatter) ? props.formatter(props.value) : props.formatter;\n    }\n    return props.value;\n  });\n\n  createEffect(() => {\n    if (props.label) {\n      setX(`.label {--x: ${inputRef?.offsetLeft || 0}px;opacity:1;}`);\n    }\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <style textContent={x()} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <fieldset\n        class={cx('fieldset', props.size, props.status, props.class)}\n        disabled={props.disabled}\n      >\n        <Show when={props.prefixIcon}>\n          <span class=\"prefix\">{props.prefixIcon}</span>\n        </Show>\n        <input\n          ref={inputRef}\n          class=\"input\"\n          part=\"input\"\n          onChange={handleInput}\n          type={props.type}\n          value={value()}\n          autocomplete={props.autoComplete}\n          accept={props.accept}\n          placeholder={props.placeholder}\n          onMouseDown={handleMouseDown}\n          onKeyDown={handleKeyDown}\n          onKeyUp={handleKeyUp}\n          onBlur={handleBlur}\n        />\n        <Show when={props.label}>\n          <label class=\"label\">{props.label}</label>\n        </Show>\n        <Show when={props.capsLockIcon && capsLock()}>\n          <span class=\"caps-lock\">{props.capsLockIcon}</span>\n        </Show>\n        <Show when={props.suffixIcon}>\n          <span class=\"suffix\">{props.suffixIcon}</span>\n        </Show>\n      </fieldset>\n    </>\n  );\n}\n\nexport type InputElement = CustomElement<InputProps>;\n\nexport const defaultInportProps = {\n  class: void 0,\n  css: void 0,\n  suffixIcon: void 0,\n  prefixIcon: void 0,\n  capsLockIcon: void 0,\n  size: void 0,\n  disabled: void 0,\n  status: void 0,\n  type: void 0,\n  label: void 0,\n  value: void 0,\n  defaultValue: void 0,\n  formatter: void 0,\n  parser: void 0,\n  onChange: void 0,\n  onMouseDown: void 0,\n  onKeyDown: void 0,\n  accept: void 0,\n  autoComplete: void 0,\n  placeholder: '请输入',\n};\n\ncustomElement<InputProps>('n-input', defaultInportProps, (_, opt) => {\n  const el = opt.element;\n  const props = mergeProps(\n    {\n      css: el.css,\n      size: el.size || 'normal',\n      value: el.value || el.defaultValue || '',\n      type: el.type || 'text',\n      onChange(val?: number | string) {\n        el.dispatchEvent(\n          new CustomEvent('change', {\n            detail: val,\n          }),\n        );\n      },\n    },\n    _,\n  );\n\n  return <Input {...props} />;\n});\n\nexport default Input;\n"],"names":["Show","createEffect","createMemo","createSignal","mergeProps","isFunction","css","cx","customElement","style","theme","Input","props","inputRef","baseStyle","x","setX","capsLock","setCapsLock","handleInput","e","onChange","parserValue","val","parser","type","num","replace","length","parseFloat","target","value","handleMouseDown","onMouseDown","handleKeyDown","capsLockIcon","getModifierState","onKeyDown","handleBlur","onBlur","handleKeyUp","onKeyUp","formatter","label","offsetLeft","prefixIcon","suffixIcon","size","status","class","disabled","autoComplete","accept","placeholder","defaultInportProps","defaultValue","_","opt","el","element","dispatchEvent","CustomEvent","detail"],"mappings":"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"}
+{"version":3,"sources":["../../components/input/index.tsx"],"sourcesContent":["import { createEffect, createMemo, createSignal, mergeProps, Show } from 'solid-js';\nimport { isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BasicConfig, CustomElement } from '..';\nimport theme from '../theme';\n\nimport { style } from './style';\n\nexport interface InputProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** 前缀 */\n  prefixIcon?: JSX.Element;\n  /** 后缀 */\n  suffixIcon?: JSX.Element;\n  /** 大写锁定图标, 可以结合密码输入框使用\n   * @since 2.5.2\n   */\n  capsLockIcon?: JSX.Element;\n  /** 禁用 */\n  disabled?: boolean;\n  /** 自动完成 */\n  autoComplete?: string;\n  /** 占位文本 */\n  placeholder?: string;\n  /** 组件尺寸\n   * @default 'normal'\n   */\n  size?: BasicConfig['size'];\n  /** 描述 */\n  label?: JSX.Element;\n  /** 状态 */\n  status?: 'error' | 'warning' | 'success';\n  /** 类型\n   * @default 'text'\n   */\n  type?: 'email' | 'hidden' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url';\n  /** HTML attribute: accept */\n  accept?: string;\n  /** 值 */\n  value?: string | number;\n  /** 默认值 */\n  defaultValue?: string | number;\n  /** 值变更时触发的函数 */\n  onChange?: (value: InputProps['value']) => void;\n  onKeyDown?(e: KeyboardEvent): void;\n  onMouseDown?(e: MouseEvent): void;\n  onFocus?(e: FocusEvent): void;\n  onBlur?(e: FocusEvent): void;\n  onKeyUp?(e: KeyboardEvent): void;\n  /** 指定输入框展示值的格式 */\n  formatter?: (value?: InputProps['value']) => InputProps['value'];\n  /** 搭配 formatter 使用, 将转换后的值转回原来的值 */\n  parser?: (value?: InputProps['value']) => InputProps['value'];\n}\n\nfunction Input(props: InputProps) {\n  const { baseStyle } = theme;\n  let inputRef: HTMLInputElement | undefined;\n  const [x, setX] = createSignal<string>();\n  const [capsLock, setCapsLock] = createSignal(false);\n\n  function parserValue(val: InputProps['value']) {\n    if (props.parser) {\n      return isFunction(props.parser) ? props.parser(val) : props.parser;\n    } else if (props.type === 'number' && typeof val === 'string') {\n      const num = val.replace(/[^\\d]/g, '');\n\n      return num.length ? parseFloat(num) : void 0;\n    }\n    return val;\n  }\n\n  function handleInput(e: Event & { target?: HTMLInputElement }) {\n    props.onChange?.(parserValue(e.target?.value));\n  }\n  function handleMouseDown(e: MouseEvent) {\n    props.onMouseDown?.(e);\n  }\n  function handleKeyDown(e: KeyboardEvent) {\n    if (props.capsLockIcon) {\n      setCapsLock(e.getModifierState('CapsLock'));\n    }\n    props.onKeyDown?.(e);\n  }\n  function handleBlur(e: FocusEvent) {\n    props.onBlur?.(e);\n  }\n  function handleKeyUp(e: KeyboardEvent) {\n    props.onKeyUp?.(e);\n  }\n\n  const value = createMemo(() => {\n    if (props.formatter) {\n      return isFunction(props.formatter) ? props.formatter(props.value) : props.formatter;\n    }\n    return props.value;\n  });\n\n  createEffect(() => {\n    if (props.label) {\n      setX(`.label {--x: ${inputRef?.offsetLeft || 0}px;opacity:1;}`);\n    }\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <style textContent={x()} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <fieldset\n        class={cx('fieldset', props.size, props.status, props.class)}\n        disabled={props.disabled}\n      >\n        <Show when={props.prefixIcon}>\n          <span class=\"prefix\">{props.prefixIcon}</span>\n        </Show>\n        <input\n          ref={inputRef}\n          class=\"input\"\n          part=\"input\"\n          onChange={handleInput}\n          type={props.type}\n          value={value()}\n          autocomplete={props.autoComplete}\n          accept={props.accept}\n          placeholder={props.placeholder}\n          onMouseDown={handleMouseDown}\n          onKeyDown={handleKeyDown}\n          onKeyUp={handleKeyUp}\n          onBlur={handleBlur}\n        />\n        <Show when={props.label}>\n          <label class=\"label\">{props.label}</label>\n        </Show>\n        <Show when={props.capsLockIcon && capsLock()}>\n          <span class=\"caps-lock\">{props.capsLockIcon}</span>\n        </Show>\n        <Show when={props.suffixIcon}>\n          <span class=\"suffix\">{props.suffixIcon}</span>\n        </Show>\n      </fieldset>\n    </>\n  );\n}\n\nexport type InputElement = CustomElement<InputProps>;\n\nexport const defaultInportProps = {\n  class: void 0,\n  css: void 0,\n  suffixIcon: void 0,\n  prefixIcon: void 0,\n  capsLockIcon: void 0,\n  size: void 0,\n  disabled: void 0,\n  status: void 0,\n  type: void 0,\n  label: void 0,\n  value: void 0,\n  defaultValue: void 0,\n  formatter: void 0,\n  parser: void 0,\n  onChange: void 0,\n  onMouseDown: void 0,\n  onKeyDown: void 0,\n  accept: void 0,\n  autoComplete: void 0,\n  placeholder: '请输入',\n};\n\ncustomElement<InputProps>('n-input', defaultInportProps, (_, opt) => {\n  const el = opt.element;\n  const props = mergeProps(\n    {\n      css: el.css,\n      size: el.size || 'normal',\n      value: el.value || el.defaultValue || '',\n      type: el.type || 'text',\n      onChange(val?: number | string) {\n        el.dispatchEvent(\n          new CustomEvent('change', {\n            detail: val,\n          }),\n        );\n      },\n    },\n    _,\n  );\n\n  return <Input {...props} />;\n});\n\nexport default Input;\n"],"names":["createEffect","createMemo","createSignal","mergeProps","Show","isFunction","css","cx","customElement","theme","style","Input","props","inputRef","baseStyle","x","setX","capsLock","setCapsLock","handleInput","e","onChange","parserValue","val","parser","type","num","replace","length","parseFloat","target","value","handleMouseDown","onMouseDown","handleKeyDown","capsLockIcon","getModifierState","onKeyDown","handleBlur","onBlur","handleKeyUp","onKeyUp","formatter","label","offsetLeft","prefixIcon","suffixIcon","size","status","class","disabled","autoComplete","accept","placeholder","defaultInportProps","defaultValue","_","opt","el","element","dispatchEvent","CustomEvent","detail"],"mappings":"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"}

package/es/input-number/README.mdx

@@ -0,0 +1,10 @@
+---
+type: 数据录入
+title: 数字输入框
+subtitle: n-input-number
+icon: ①
+---
+
+# 数字输入框
+
+> 在页面中进行数字输入, 可以通过按下鼠标后拖动来快速调整数值

package/es/input-number/examples/basic.md

@@ -0,0 +1,26 @@
+---
+title: 基本使用
+description: 可以通过 `value` 设置值, 通过 `change` 事件获取值变更的消息
+order: 1
+---
+
+```html
+<n-input-number label="获取焦点时按住鼠标左键开始拖动试试" value="0"></n-input-number>
+<script>
+  const el = container.querySelector('n-input-number');
+
+  el.onchange = function (e) {
+    console.log('html', e.detail);
+  };
+</script>
+```
+
+```jsx
+<n-input-number
+  label="获取焦点时按住鼠标左键开始拖动试试"
+  value={0}
+  onChange={(e) => {
+    console.log('jsx', e.detail);
+  }}
+/>
+```

package/es/input-number/examples/formatter.md

@@ -0,0 +1,36 @@
+---
+title: 自定义格式
+description: 通过 `formatter` 和 `parser` 来自定义输入栏显示内容
+order: 2
+---
+
+```html
+<n-input-number label="完成度" min="0" max="1" step="0.01"></n-input-number>
+<script>
+  const el = container.querySelector('n-input-number');
+
+  el.formatter = function (v = 0) {
+    return `${Number((v * 100).toFixed(2))}%`;
+  };
+  el.parser = function (v = '') {
+    return Number(v.replace(/%$/, '') || '0') / 100;
+  };
+</script>
+```
+
+```jsx
+<n-input-number
+  label="完成度"
+  min={0}
+  max={1}
+  step={0.01}
+  formatter={() =>
+    (v = 0) =>
+      `${Number((v * 100).toFixed(2))}%`
+    }
+  parser={() =>
+    (v = '0%') =>
+      Number(v.replace(/%$/, '')) / 100
+    }
+/>
+```

package/es/input-number/examples/max-min.md

@@ -0,0 +1,13 @@
+---
+title: 最大值 & 最小值
+description: 通过设置 `min` 来约束最小值; 通过设置 `max` 来约束最大值
+order: 3
+---
+
+```html
+<n-input-number label="范围" placeholder="请输入0~100以内的数值" min="0" max="100"></n-input-number>
+```
+
+```jsx
+<n-input-number label="范围" placeholder="请输入0~100以内的数值" min={0} max={100} />
+```

package/es/input-number/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/input-number/index.tsx"],"sourcesContent":["import { createEffect, createSignal, mergeProps, onCleanup } from 'solid-js';\nimport { passiveSupported } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport Input, { defaultInportProps } from '../input';\nimport type { CustomElement, InputProps } from '..';\n\nconst style = css`\n  /** 隐藏原生加减控件 */\n  .number[type='number'] {\n    appearance: textfield;\n  }\n\n  .number[type='number']::-webkit-inner-spin-button,\n  .number[type='number']::-webkit-outer-spin-button {\n    appearance: none;\n  }\n`;\n\n/** API\n * @since 2.0.0\n */\nexport interface InputNumberProps extends Omit<InputProps, 'value' | 'defaultValue' | 'onChange'> {\n  /** 值 */\n  value?: number;\n  /** 默认值\n   * @default 0\n   */\n  defaultValue?: number;\n  /** 最小值\n   * @default Number.MIN_SAFE_INTEGER\n   */\n  min?: number;\n  /** 最大值\n   * @default Number.MAX_SAFE_INTEGER\n   */\n  max?: number;\n  /** 值变更时触发的函数 */\n  onChange?: (value?: number) => void;\n  /** 每次改变步数，可以为小数\n   * @default 1\n   */\n  step?: number;\n  /** 数值精度\n   * @default 2\n   */\n  precision?: number;\n}\nexport type InputNumberElement = CustomElement<InputNumberProps>;\n\nfunction InputNumber(props: InputNumberProps) {\n  const [move, setMove] = createSignal(false);\n\n  function onMouseDown(e: MouseEvent) {\n    e.stopPropagation();\n    setMove(true);\n  }\n  function onKeyDown(e: KeyboardEvent) {\n    switch (e.key) {\n      case 'ArrowUp':\n        // eslint-disable-next-line @typescript-eslint/no-use-before-define\n        mouseMove({ movementX: 0, movementY: -1 });\n        break;\n      case 'ArrowDown':\n        // eslint-disable-next-line @typescript-eslint/no-use-before-define\n        mouseMove({ movementX: 0, movementY: 1 });\n        break;\n      default:\n        break;\n    }\n  }\n  function mouseUp() {\n    setMove(false);\n  }\n  const _ = mergeProps(\n    {\n      size: 'normal',\n      value: '',\n      defaultValue: 0,\n      type: 'text',\n      onKeyDown: onKeyDown,\n      onMouseDown: onMouseDown,\n      step: 1,\n      precision: 2,\n      max: Number.MAX_SAFE_INTEGER,\n      min: Number.MIN_SAFE_INTEGER,\n    },\n    props,\n  );\n\n  function change(val?: string | number) {\n    let _val = typeof val === 'string' ? parseFloat(val) : val;\n\n    if (isNaN(_val as number)) {\n      _val = '' as unknown as number;\n    }\n    if (typeof _val !== 'undefined') {\n      if (_val < (_.min as number)) _val = _.min;\n      if ((_val as number) > (_.max as number)) _val = _.max;\n    }\n    props.onChange?.(_val);\n  }\n\n  function mouseMove(e: { movementX: number; movementY: number }) {\n    const { movementX, movementY } = e;\n    const _val = _.value;\n    const val = typeof _val === 'number' && !isNaN(_val) ? _val : Number(_val) || 0;\n\n    change(Number(Number(val + (movementX - movementY) * (_.step as number)).toFixed(_.precision)));\n  }\n\n  createEffect(() => {\n    if (move()) {\n      document.body.addEventListener('mousemove', mouseMove, {\n        passive: passiveSupported,\n      });\n      document.body.addEventListener('mouseup', mouseUp, {\n        passive: passiveSupported,\n      });\n    }\n    onCleanup(() => {\n      document.body.removeEventListener('mousemove', mouseMove, false);\n      document.body.removeEventListener('mouseup', mouseUp, passiveSupported);\n    });\n  });\n\n  return (\n    <Input\n      {...(_ as InputProps)}\n      class={cx('number', props.class)}\n      onChange={change}\n      css={style + (props.css || '')}\n    />\n  );\n}\n\ncustomElement<InputNumberProps>(\n  'n-input-number',\n  {\n    ...defaultInportProps,\n    defaultValue: void 0,\n    max: void 0,\n    min: void 0,\n    onChange: void 0,\n    step: void 0,\n    precision: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onChange(val?: number | string) {\n          el.value = val;\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: val,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    return <InputNumber {...props} />;\n  },\n);\n\nexport default InputNumber;\n"],"names":["createEffect","createSignal","mergeProps","onCleanup","passiveSupported","css","cx","customElement","Input","defaultInportProps","style","InputNumber","props","move","setMove","mouseUp","_","size","value","defaultValue","type","onKeyDown","e","key","mouseMove","movementX","movementY","onMouseDown","stopPropagation","step","precision","max","Number","MAX_SAFE_INTEGER","min","MIN_SAFE_INTEGER","change","val","_val","parseFloat","isNaN","onChange","toFixed","document","body","addEventListener","passive","removeEventListener","class","opt","el","element","dispatchEvent","CustomEvent","detail"],"mappings":"4TAAA,QAASA,gBAAAA,CAAY,CAAEC,gBAAAA,CAAY,CAAEC,cAAAA,CAAU,CAAEC,aAAAA,CAAS,KAAQ,UAAW,AAC7E,QAASC,MAAwB,qCAAiB,AAClD,QAASC,OAAAA,CAAG,CAAEC,MAAAA,CAAE,KAAQ,aAAc,AACtC,QAASC,iBAAAA,CAAa,KAAQ,eAAgB,AAC9C,QAAOC,GAASC,sBAAAA,CAAkB,KAAQ,UAAW,CAGrD,IAAMC,EAAQL,CAAG,CAAC;;;;;;;;;;AAUlB,CAAC,CAiCD,SAASM,EAAYC,CAAuB,EAC1C,GAAM,CAACC,EAAMC,EAAQ,CAAGb,EAAa,CAAA,GAoBrC,SAASc,IACPD,EAAQ,CAAA,EACV,CACA,IAAME,EAAId,EACR,CACEe,KAAM,SACNC,MAAO,GACPC,aAAc,EACdC,KAAM,OACNC,UAvBJ,SAAmBC,CAAgB,EACjC,OAAQA,EAAEC,GAAG,EACX,IAAK,UAEHC,EAAU,CAAEC,UAAW,EAAGC,UAAW,EAAG,GACxC,KACF,KAAK,YAEHF,EAAU,CAAEC,UAAW,EAAGC,UAAW,CAAE,EAI3C,CACF,EAWIC,YA5BJ,SAAqBL,CAAa,EAChCA,EAAEM,eAAe,GACjBd,EAAQ,CAAA,EACV,EA0BIe,KAAM,EACNC,UAAW,EACXC,IAAKC,OAAOC,gBAAgB,CAC5BC,IAAKF,OAAOG,gBAAgB,AAC9B,EACAvB,GAGF,SAASwB,EAAOC,CAAqB,EACnC,IAAIC,EAAO,AAAe,UAAf,OAAOD,EAAmBE,WAAWF,GAAOA,EAEnDG,MAAMF,IACRA,CAAAA,EAAO,EAAsB,EAEX,KAAA,IAATA,IACLA,EAAQtB,EAAEkB,GAAG,EAAaI,CAAAA,EAAOtB,EAAEkB,GAAG,AAAD,EACpCI,EAAmBtB,EAAEe,GAAG,EAAaO,CAAAA,EAAOtB,EAAEe,GAAG,AAAD,SAEvDnB,EAAM6B,QAAQ,EAAd7B,EAAM6B,QAAQ,MAAd7B,EAAiB0B,EACnB,CAEA,SAASd,EAAUF,CAA2C,EAC5D,GAAM,CAAEG,UAAAA,CAAS,CAAEC,UAAAA,CAAS,CAAE,CAAGJ,EAC3BgB,EAAOtB,EAAEE,KAAK,CAGpBkB,EAAOJ,OAAOA,OAAOK,AAFT,CAAA,AAAgB,UAAhB,OAAOC,GAAsBE,MAAMF,GAAeN,OAAOM,IAAS,EAAvBA,CAAuB,EAEnD,AAACb,CAAAA,EAAYC,CAAQ,EAAMV,EAAEa,IAAI,EAAaa,OAAO,CAAC1B,EAAEc,SAAS,GAC9F,CAiBA,OAfA9B,EAAa,KACPa,MACF8B,SAASC,IAAI,CAACC,gBAAgB,CAAC,YAAarB,EAAW,CACrDsB,QAAS1C,CACX,GACAuC,SAASC,IAAI,CAACC,gBAAgB,CAAC,UAAW9B,EAAS,CACjD+B,QAAS1C,CACX,IAEFD,EAAU,KACRwC,SAASC,IAAI,CAACG,mBAAmB,CAAC,YAAavB,EAAW,CAAA,GAC1DmB,SAASC,IAAI,CAACG,mBAAmB,CAAC,UAAWhC,EAASX,EACxD,EACF,KAGGI,IACMQ,sBACEV,EAAG,SAAUM,EAAMoC,KAAK,YACrBZ,mBACL1B,EAASE,CAAAA,EAAMP,GAAG,EAAI,EAAC,KAGlC,CAEAE,EACE,iBACA,KACKE,GACHU,aAAc,KAAK,EACnBY,IAAK,KAAK,EACVG,IAAK,KAAK,EACVO,SAAU,KAAK,EACfZ,KAAM,KAAK,EACXC,UAAW,KAAK,IAElB,CAACd,EAAGiC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAetB,SAAQxC,EAdMT,EACZ,CACEuC,SAASJ,CAAqB,EAC5Ba,EAAGhC,KAAK,CAAGmB,EACXa,EAAGE,aAAa,CACd,IAAIC,YAAY,SAAU,CACxBC,OAAQjB,CACV,GAEJ,CACF,EACArB,GAIJ,EAGF,gBAAeL,CAAY"}
+{"version":3,"sources":["../../components/input-number/index.tsx"],"sourcesContent":["import { createEffect, createSignal, mergeProps, onCleanup } from 'solid-js';\nimport { passiveSupported } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement, InputProps } from '..';\nimport Input, { defaultInportProps } from '../input';\n\nconst style = css`\n  /** 隐藏原生加减控件 */\n  .number[type='number'] {\n    appearance: textfield;\n  }\n\n  .number[type='number']::-webkit-inner-spin-button,\n  .number[type='number']::-webkit-outer-spin-button {\n    appearance: none;\n  }\n`;\n\n/** API\n * @since 2.0.0\n */\nexport interface InputNumberProps extends Omit<InputProps, 'value' | 'defaultValue' | 'onChange'> {\n  /** 值 */\n  value?: number;\n  /** 默认值\n   * @default 0\n   */\n  defaultValue?: number;\n  /** 最小值\n   * @default Number.MIN_SAFE_INTEGER\n   */\n  min?: number;\n  /** 最大值\n   * @default Number.MAX_SAFE_INTEGER\n   */\n  max?: number;\n  /** 值变更时触发的函数 */\n  onChange?: (value?: number) => void;\n  /** 每次改变步数，可以为小数\n   * @default 1\n   */\n  step?: number;\n  /** 数值精度\n   * @default 2\n   */\n  precision?: number;\n}\nexport type InputNumberElement = CustomElement<InputNumberProps>;\n\nfunction InputNumber(props: InputNumberProps) {\n  const [move, setMove] = createSignal(false);\n\n  function onMouseDown(e: MouseEvent) {\n    e.stopPropagation();\n    setMove(true);\n  }\n  function onKeyDown(e: KeyboardEvent) {\n    switch (e.key) {\n      case 'ArrowUp':\n        mouseMove({ movementX: 0, movementY: -1 });\n        break;\n      case 'ArrowDown':\n        mouseMove({ movementX: 0, movementY: 1 });\n        break;\n      default:\n        break;\n    }\n  }\n  function mouseUp() {\n    setMove(false);\n  }\n  const _ = mergeProps(\n    {\n      size: 'normal',\n      value: '',\n      defaultValue: 0,\n      type: 'text',\n      onKeyDown: onKeyDown,\n      onMouseDown: onMouseDown,\n      step: 1,\n      precision: 2,\n      max: Number.MAX_SAFE_INTEGER,\n      min: Number.MIN_SAFE_INTEGER,\n    },\n    props,\n  );\n\n  function change(val?: string | number) {\n    let _val = typeof val === 'string' ? parseFloat(val) : val;\n\n    if (isNaN(_val!)) {\n      _val = '' as unknown as number;\n    }\n    if (typeof _val !== 'undefined') {\n      if (_val < _.min) _val = _.min;\n      if (_val > _.max) _val = _.max;\n    }\n    props.onChange?.(_val);\n  }\n\n  function mouseMove(e: { movementX: number; movementY: number }) {\n    const { movementX, movementY } = e;\n    const _val = _.value;\n    const val = typeof _val === 'number' && !isNaN(_val) ? _val : Number(_val) || 0;\n\n    change(Number(Number(val + (movementX - movementY) * _.step).toFixed(_.precision)));\n  }\n\n  createEffect(() => {\n    if (move()) {\n      document.body.addEventListener('mousemove', mouseMove, {\n        passive: passiveSupported,\n      });\n      document.body.addEventListener('mouseup', mouseUp, {\n        passive: passiveSupported,\n      });\n    }\n    onCleanup(() => {\n      document.body.removeEventListener('mousemove', mouseMove, false);\n      document.body.removeEventListener('mouseup', mouseUp, passiveSupported);\n    });\n  });\n\n  return (\n    <Input\n      {...(_ as InputProps)}\n      class={cx('number', props.class)}\n      onChange={change}\n      css={style + (props.css || '')}\n    />\n  );\n}\n\ncustomElement<InputNumberProps>(\n  'n-input-number',\n  {\n    ...defaultInportProps,\n    defaultValue: void 0,\n    max: void 0,\n    min: void 0,\n    onChange: void 0,\n    step: void 0,\n    precision: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onChange(val?: number | string) {\n          el.value = val;\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: val,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    return <InputNumber {...props} />;\n  },\n);\n\nexport default InputNumber;\n"],"names":["createEffect","createSignal","mergeProps","onCleanup","passiveSupported","css","cx","customElement","Input","defaultInportProps","style","InputNumber","props","move","setMove","mouseUp","_","size","value","defaultValue","type","onKeyDown","e","key","mouseMove","movementX","movementY","onMouseDown","stopPropagation","step","precision","max","Number","MAX_SAFE_INTEGER","min","MIN_SAFE_INTEGER","change","val","_val","parseFloat","isNaN","onChange","toFixed","document","body","addEventListener","passive","removeEventListener","class","opt","el","element","dispatchEvent","CustomEvent","detail"],"mappings":"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"}

package/es/katex/README.mdx

@@ -0,0 +1,42 @@
+---
+type: 数据展示
+title: 数学公式
+subtitle: n-katex
+icon: ∛
+---
+
+export const katex = import('n-katex');
+
+# 数学公式
+
+> 使用该组件你需要安装 **[n-katex](https://www.npmjs.com/package/n-katex)**
+
+## Install
+
+```shell
+yarn add n-katex -S
+# or
+npm install n-katex
+```
+
+## 在 jsx 中使用
+
+```jsx
+import 'n-katex';
+
+<n-katex>{'\\underbrace{a+b+\\dots+n}_{m2}'}</n-katex>;
+```
+
+## 在 html5 中使用
+
+```html
+<!-- 引入 CDN 资源 -->
+<script src="https://cdn.jsdelivr.net/npm/n-katex@1.0.5/umd/index.js"></script>
+<!-- 使用 -->
+<body>
+  行内公式
+  <n-katex>\underbrace{a+b+\dots+n}_{m2}</n-katex>
+</body>
+```
+
+> [点击查看 KaTex 完整配置项](https://katex.org/docs/options.html)

package/es/katex/examples/block.md

@@ -0,0 +1,25 @@
+---
+title: 块级公式
+description: 单独使用一块区域作为公式展示
+order: 2
+---
+
+```html
+<n-katex display-mode="true" fleqn="true">
+\begin{array}{c}
+  S= \binom{N}{n},A_{k}=\binom{M}{k}\cdot \binom{N-M}{n-k} \\
+  P\left ( A_{k}\right ) = \frac{\binom{M}{k}\cdot \binom{N-M}{n-k}}{\binom{N}{n}}
+\end{array}
+</n-katex>
+```
+
+```jsx
+<n-katex display-mode="true" fleqn="false">
+{`
+\\begin{array}{c}
+  S= \\binom{N}{n},A_{k}=\\binom{M}{k}\\cdot \\binom{N-M}{n-k} \\\\
+  P\\left ( A_{k}\\right ) = \\frac{\\binom{M}{k}\\cdot \\binom{N-M}{n-k}}{\\binom{N}{n}}
+\\end{array}
+`}
+</n-katex>
+```

package/es/katex/examples/inline.md

@@ -0,0 +1,19 @@
+---
+title: 内联公式
+description: 在行内与其余内容置于一处的效果
+order: 1
+---
+
+```html
+<p>
+  行内公式
+  <n-katex>\underbrace{a+b+\dots+n}_{m2}</n-katex>
+</p>
+```
+
+```jsx
+<p>
+  行内公式
+  <n-katex>{'\\underbrace{a+b+\\dots+n}_{m2}'}</n-katex>
+</p>
+```

package/es/md/README.mdx

@@ -0,0 +1,10 @@
+---
+type: 数据展示
+title: Markdown
+subtitle: n-md
+icon: 🔱
+---
+
+# Markdown
+
+> 在 web 页面中渲染 markdown 文档

package/es/md/examples/in-children.md

@@ -0,0 +1,23 @@
+---
+title: 直接在写在标签内
+description: 直接在标签内写 `markdown` 内容
+order: 1
+---
+
+```html
+<n-md>
+#### 第一种方式
+
+!> 直接在写在标签内
+</n-md>
+```
+
+```jsx
+<n-md>
+    {`
+#### 第一种方式
+
+!> 直接在写在标签内
+`}
+  </n-md>
+```

package/es/md/examples/in-text.md

@@ -0,0 +1,32 @@
+---
+title: 通过属性传递
+description: 在 `text` 属性上传递 `markdown` 内容
+order: 2
+---
+
+```html
+<n-md></n-md>
+<script>
+  const el = container.querySelector('n-md');
+  el.text = `
+#### 第二种方式 (开启了图片查看器)
+
+!> 写在 text 属性上
+
+![图片](https://react-photo-view.vercel.app/_next/static/media/5.7ace37c7.jpg)
+`;
+</script>
+```
+
+```jsx
+<n-md
+  picture-viewer={false}
+  text={`
+#### 第二种方式 (关闭了图片查看器)
+
+!> 写在 text 属性上
+
+![图片](https://react-photo-view.vercel.app/_next/static/media/3.70695fb9.jpg)
+`}
+/>
+```

package/es/md/examples/math.md

@@ -0,0 +1,36 @@
+---
+title: 数学公式
+description: 通过 `$` 包裹的将渲染为行内公式, 通过 `$$` 包裹的将渲染为块级公式
+order: 3
+---
+
+```html
+<n-md>
+内联公式$\left(\LARGE{AB}\right)$
+内联公式$\xcancel{ABC}$
+
+$$
+\begin{equation}
+  x = a_0 + \cfrac{1}{a_1
+          + \cfrac{1}{a_2
+          + \cfrac{1}{a_3 + \cfrac{1}{a_4} } } }
+\end{equation}
+$$
+</n-md>
+```
+
+```jsx
+<n-md
+  text={`
+内联公式$\\left(\\LARGE{AB}\\right)$
+内联公式$\\xcancel{ABC}$
+
+$$
+\\begin{equation}
+  x = a_0 + \\cfrac{1}{a_1
+          + \\cfrac{1}{a_2
+          + \\cfrac{1}{a_3 + \\cfrac{1}{a_4} } } }
+\\end{equation}
+$$`}
+/>
+```

package/es/md/index.js

@@ -1,2 +1,2 @@
-function e(e,t,r,o,n,i,l){try{var a=e[i](l),s=a.value}catch(e){r(e);return}a.done?t(s):Promise.resolve(s).then(o,n)}function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}import{use as r}from"solid-js/web";import{template as o}from"solid-js/web";import{insert as n}from"solid-js/web";import{effect as i}from"solid-js/web";import{createComponent as l}from"solid-js/web";import{className as a}from"solid-js/web";let s=o("<style> "),c=o("<style>"),d=o('<article class="n-md-box" part="box"><div class="n-md-body" part="body">'),u=o('<article part="box">');import{For as m,Match as h,Show as f,Switch as p,createEffect as v,mergeProps as b,onCleanup as g}from"solid-js";import w from"@moneko/common/lib/frameCallback";import{css as x,cx as y}from"@moneko/css";import{customElement as k}from"solid-element";import"../code";import"../img";import C from"../md-style";import $ from"../theme";function E(o){let k,E;let{baseStyle:L}=$,P=b({webWorker:!1,pictureViewer:!0,lazyPicture:!0,text:"",tools:["copy"],getAnchorContainer:()=>window},o);function j(){return new Worker("https://cdn.jsdelivr.net/npm/neko-ui@latest/es/md/worker.js")}let A=P.webWorker?j():void 0;function O(e){E&&(E.innerHTML=e.data)}function z(){var r;return r=function*(e){let{text:r,pictureViewer:o,lazyPicture:n,langToolbar:i}=e,l=function(e,t){if(null==e)return{};var r,o,n={},i=Object.keys(e);for(o=0;o<i.length;o++)t.indexOf(r=i[o])>=0||(n[r]=e[r]);return n}(e,["text","pictureViewer","lazyPicture","langToolbar"]),a=(yield import("marked-completed")).default;k||((k=new a.Renderer).katexBlock=e=>`<n-katex display-mode="true">${e}</n-katex>`,k.katexInline=e=>`<n-katex>${e}</n-katex>`),k.image=(e,t,r)=>`<n-img lazy="${n}" disabled="${!o}" role="img" src="${e}" alt="${r}" ${t?`title="${t}"`:""}></n-img>`;let s=!!(null==i?void 0:i.length);k.code=function(e,t){return"treeview"===t?`<n-tree data="${e}" />`:`<n-code class="n-code" toolbar="${s}" language="${t}" ${l.langLineNumber?'line-number="true"':""}>${encodeURIComponent(e)}</n-code>`},O({data:a(r,t({renderer:k,langToolbar:i,headerPrefix:"# ",breaks:!0,pedantic:!1,smartLists:!0,smartypants:!0,xhtml:!0},l))})},(z=function(){var t=this,o=arguments;return new Promise(function(n,i){var l=r.apply(t,o);function a(t){e(l,n,i,a,s,"next",t)}function s(t){e(l,n,i,a,s,"throw",t)}a(void 0)})}).apply(this,arguments)}v(()=>{P.webWorker&&(A||(A=j()),A.addEventListener("message",O))}),v(()=>{A?A.postMessage(JSON.stringify({text:P.text,langLineNumber:P.lineNumber,langToolbar:P.tools,pictureViewer:P.pictureViewer,lazyPicture:P.lazyPicture})):w(()=>(function(e){return z.apply(this,arguments)})({text:P.text,langLineNumber:P.lineNumber,langToolbar:P.tools,pictureViewer:P.pictureViewer,lazyPicture:P.lazyPicture}))}),g(()=>{A&&(A.removeEventListener("message",O),A.terminate())});let N=[],T=[],V=[];function I(e){e.preventDefault(),e.stopPropagation();let t=e.target;if(t.hash){var r;null==E||null==(r=E.querySelector(decodeURIComponent(t.hash)))||r.scrollIntoView({behavior:"smooth",block:"nearest"}),N.forEach(e=>e.classList.remove("active")),t.classList.add("active")}else window.open(t.href)}function W(e){e.forEach(e=>{let t;let r=e.target.getAttribute("id"),o=e.target.querySelectorAll("a");if(N.forEach(e=>{e.hash===`#${r}`?t=e:e.hash||o.forEach(r=>{r.href===e.href&&(t=e)})}),t){let r=V.indexOf(t);if(V.forEach(e=>{e.classList.remove("active")}),e.isIntersecting?V.push(t):-1!==r&&V.splice(r,1),V[0]){var n;V[0].classList.add("active"),null==(n=V[0].offsetParent)||n.scrollTo({top:V[0].offsetTop})}}})}return v(()=>{var e;let t;E&&(null==(e=P.text)?void 0:e.startsWith("[TOC]"))&&(N=[...E.querySelectorAll(".n-md-toc a[href]")],T=[...E.querySelectorAll("h1, h2, h3, h4, h5, h6")],t=new IntersectionObserver(W,{rootMargin:"-50px 0px",threshold:.5}),T.forEach(e=>t.observe(e)),N.forEach(e=>{e.addEventListener("click",I)})),g(()=>{t&&(T.forEach(e=>t.unobserve(e)),t.disconnect()),N.forEach(e=>{e.removeEventListener("click",I)})})}),[(()=>{let e=s(),t=e.firstChild;return i(()=>t.data=L()),e})(),(()=>{let e=c();return e.textContent=C,e})(),l(f,{get when(){return P.css},get children(){let e=s(),t=e.firstChild;return i(()=>t.data=x(P.css)),e}}),l(p,{get children(){return[l(h,{get when(){var R;return null==(R=P.children)?void 0:R.length},get children(){let e=d();return n(e.firstChild,l(m,{get each(){return P.children},children:e=>e})),e}}),l(h,{get when(){return P.text},get children(){let e=u(),t=E;return"function"==typeof t?r(t,e):E=e,i(()=>a(e,y("n-md-box",P.class))),e}})]}})]}k("n-md",{class:void 0,pictureViewer:void 0,lazyPicture:void 0,lineNumber:!0,text:void 0,tools:void 0,getAnchorContainer:void 0,css:void 0,children:void 0,notRender:void 0,webWorker:void 0},(e,t)=>{let r=t.element,o=b({text:!e.notRender&&r.textContent||r.text,css:r.css,tools:r.tools,getAnchorContainer:r.getAnchorContainer},e);return v(()=>{r.removeAttribute("css"),r.replaceChildren()}),l(E,o)});export default E;
+function e(e,t,r,o,n,i,l){try{var a=e[i](l),s=a.value}catch(e){r(e);return}a.done?t(s):Promise.resolve(s).then(o,n)}function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e}).apply(this,arguments)}import{use as r}from"solid-js/web";import{template as o}from"solid-js/web";import"solid-js/web";import{insert as n}from"solid-js/web";import{effect as i}from"solid-js/web";import{createComponent as l}from"solid-js/web";import{className as a}from"solid-js/web";let s=o("<style> "),c=o("<style>"),d=o('<article class="n-md-box" part="box"><div class="n-md-body" part="body">'),u=o('<article part="box">');import{createEffect as m,For as h,Match as f,mergeProps as p,onCleanup as v,Show as b,Switch as g}from"solid-js";import w from"@moneko/common/lib/frameCallback";import{css as x,cx as y}from"@moneko/css";import{customElement as k}from"solid-element";import C from"../md-style";import $ from"../theme";import"../code";import"../img";function j(o){let k,j;let{baseStyle:E}=$,L=p({webWorker:!1,pictureViewer:!0,lazyPicture:!0,text:"",tools:["copy"],getAnchorContainer:()=>window},o);function P(){return new Worker("https://cdn.jsdelivr.net/npm/neko-ui@latest/es/md/worker.js")}let A=L.webWorker?P():void 0;function O(e){j&&(j.innerHTML=e.data)}function z(){var r;return r=function*(e){let{text:r,pictureViewer:o,lazyPicture:n,langToolbar:i}=e,l=function(e,t){if(null==e)return{};var r,o,n={},i=Object.keys(e);for(o=0;o<i.length;o++)t.indexOf(r=i[o])>=0||(n[r]=e[r]);return n}(e,["text","pictureViewer","lazyPicture","langToolbar"]),a=(yield import("marked-completed")).default;k||((k=new a.Renderer).katexBlock=e=>`<n-katex display-mode="true">${e}</n-katex>`,k.katexInline=e=>`<n-katex>${e}</n-katex>`),k.image=(e,t,r)=>`<n-img lazy="${n}" disabled="${!o}" role="img" src="${e}" alt="${r}" ${t?`title="${t}"`:""}></n-img>`;let s=!!(null==i?void 0:i.length);k.code=function(e,t){return"treeview"===t?`<n-tree data="${e}" />`:`<n-code class="n-code" toolbar="${s}" language="${t}" ${l.langLineNumber?'line-number="true"':""}>${encodeURIComponent(e)}</n-code>`},O({data:a(r,t({renderer:k,langToolbar:i,headerPrefix:"# ",breaks:!0,pedantic:!1,smartLists:!0,smartypants:!0,xhtml:!0},l))})},(z=function(){var t=this,o=arguments;return new Promise(function(n,i){var l=r.apply(t,o);function a(t){e(l,n,i,a,s,"next",t)}function s(t){e(l,n,i,a,s,"throw",t)}a(void 0)})}).apply(this,arguments)}m(()=>{L.webWorker&&(A||(A=P()),A.addEventListener("message",O))}),m(()=>{A?A.postMessage(JSON.stringify({text:L.text,langLineNumber:L.lineNumber,langToolbar:L.tools,pictureViewer:L.pictureViewer,lazyPicture:L.lazyPicture})):w(()=>(function(e){return z.apply(this,arguments)})({text:L.text,langLineNumber:L.lineNumber,langToolbar:L.tools,pictureViewer:L.pictureViewer,lazyPicture:L.lazyPicture}))}),v(()=>{A&&(A.removeEventListener("message",O),A.terminate())});let N=[],T=[],V=[];function I(e){e.preventDefault(),e.stopPropagation();let t=e.target;if(t.hash){var r;null==j||null==(r=j.querySelector(decodeURIComponent(t.hash)))||r.scrollIntoView({behavior:"smooth",block:"nearest"}),N.forEach(e=>{e.classList.remove("active")}),t.classList.add("active")}else window.open(t.href)}function W(e){e.forEach(e=>{let t;let r=e.target.getAttribute("id"),o=e.target.querySelectorAll("a");if(N.forEach(e=>{e.hash===`#${r}`?t=e:e.hash||o.forEach(r=>{r.href===e.href&&(t=e)})}),t){let r=V.indexOf(t);if(V.forEach(e=>{e.classList.remove("active")}),e.isIntersecting?V.push(t):-1!==r&&V.splice(r,1),V[0]){var n;V[0].classList.add("active"),null==(n=V[0].offsetParent)||n.scrollTo({top:V[0].offsetTop})}}})}return m(()=>{let e;j&&L.text.startsWith("[TOC]")&&(N=[...j.querySelectorAll(".n-md-toc a[href]")],T=[...j.querySelectorAll("h1, h2, h3, h4, h5, h6")],e=new IntersectionObserver(W,{rootMargin:"-50px 0px",threshold:.5}),T.forEach(t=>{e.observe(t)}),N.forEach(e=>{e.addEventListener("click",I)})),v(()=>{e&&(T.forEach(t=>{e.unobserve(t)}),e.disconnect()),N.forEach(e=>{e.removeEventListener("click",I)})})}),[(()=>{let e=s(),t=e.firstChild;return i(()=>t.data=E()),e})(),(()=>{let e=c();return e.textContent=C,e})(),l(b,{get when(){return L.css},get children(){let e=s(),t=e.firstChild;return i(()=>t.data=x(L.css)),e}}),l(g,{get children(){return[l(f,{get when(){return(L.children||[]).length>0},get children(){let e=d();return n(e.firstChild,l(h,{get each(){return L.children},children:e=>e})),e}}),l(f,{get when(){return L.text},get children(){let e=u(),t=j;return"function"==typeof t?r(t,e):j=e,i(()=>a(e,y("n-md-box",L.class))),e}})]}})]}k("n-md",{class:void 0,pictureViewer:void 0,lazyPicture:void 0,lineNumber:!0,text:void 0,tools:void 0,getAnchorContainer:void 0,css:void 0,children:void 0,notRender:void 0,webWorker:void 0},(e,t)=>{let r=t.element,o=p({text:!e.notRender&&r.textContent||r.text,css:r.css,tools:r.tools,getAnchorContainer:r.getAnchorContainer},e);return m(()=>{r.removeAttribute("css"),r.replaceChildren()}),l(j,o)});export default j;
 //# sourceMappingURL=index.js.map

package/es/md/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/md/index.tsx"],"sourcesContent":["import { For, Match, Show, Switch, createEffect, mergeProps, onCleanup } from 'solid-js';\nimport { frameCallback } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\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 renderer: marked.Renderer | undefined;\n  let ref: HTMLDivElement | undefined;\n  const { baseStyle } = theme;\n  const props = mergeProps(\n    {\n      webWorker: false,\n      pictureViewer: true,\n      lazyPicture: true,\n      text: '',\n      tools: ['copy'],\n      getAnchorContainer: () => window as unknown as HTMLElement,\n    },\n    _props,\n  );\n\n  function initWorker() {\n    return new Worker('https://cdn.jsdelivr.net/npm/neko-ui@latest/es/md/worker.js');\n  }\n  // eslint-disable-next-line solid/reactivity\n  let worker: Worker | undefined = props.webWorker ? initWorker() : void 0;\n\n  function update(e: { data: string }) {\n    if (ref) {\n      ref.innerHTML = e.data;\n    }\n  }\n  async function postMessage(opt: {\n    text: string;\n    pictureViewer?: boolean;\n    lazyPicture?: boolean;\n    langToolbar?: string[];\n    langLineNumber?: boolean;\n  }) {\n    const { text, pictureViewer, lazyPicture, langToolbar, ...options } = opt;\n    const marked = (await import('marked-completed')).default;\n\n    if (!renderer) {\n      renderer = new marked.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    }\n\n    renderer.image = (src: string, title: string, alt: string) => {\n      return `<n-img lazy=\"${lazyPicture}\" disabled=\"${!pictureViewer}\" role=\"img\" src=\"${src}\" alt=\"${alt}\" ${title ? `title=\"${title}\"` : ''}></n-img>`;\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}\" language=\"${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  createEffect(() => {\n    if (props.webWorker) {\n      if (!worker) {\n        worker = initWorker();\n      }\n      worker.addEventListener('message', update);\n    }\n  });\n\n  createEffect(() => {\n    if (worker) {\n      worker.postMessage(\n        JSON.stringify({\n          text: props.text,\n          langLineNumber: props.lineNumber,\n          langToolbar: props.tools,\n          pictureViewer: props.pictureViewer,\n          lazyPicture: props.lazyPicture,\n        }),\n      );\n    } else {\n      const call = () =>\n        postMessage({\n          text: props.text,\n          langLineNumber: props.lineNumber,\n          langToolbar: props.tools,\n          pictureViewer: props.pictureViewer,\n          lazyPicture: props.lazyPicture,\n        });\n\n      frameCallback(call);\n    }\n  });\n  onCleanup(() => {\n    if (worker) {\n      worker.removeEventListener('message', update);\n      worker.terminate();\n    }\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 textContent={baseStyle()} />\n      <style textContent={mdStyle} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\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   * @since 2.8.3\n   * @default true\n   */\n  lazyPicture?: 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   * 使用 web worker\n   */\n  webWorker?: boolean;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n  'n-md',\n  {\n    class: void 0,\n    pictureViewer: void 0,\n    lazyPicture: 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    webWorker: 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":["For","Match","Show","Switch","createEffect","mergeProps","onCleanup","frameCallback","css","cx","customElement","mdStyle","theme","MD","_props","renderer","ref","baseStyle","props","webWorker","pictureViewer","lazyPicture","text","tools","getAnchorContainer","window","initWorker","Worker","worker","update","e","innerHTML","data","postMessage","opt","langToolbar","options","marked","default","Renderer","katexBlock","code","katexInline","image","src","title","alt","toolbar","length","lang","langLineNumber","encodeURIComponent","headerPrefix","breaks","pedantic","smartLists","smartypants","xhtml","addEventListener","JSON","stringify","lineNumber","removeEventListener","terminate","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","unobserve","disconnect","children","class","notRender","_","el","element","textContent","removeAttribute","replaceChildren"],"mappings":"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"}
+{"version":3,"sources":["../../components/md/index.tsx"],"sourcesContent":["import { createEffect, For, Match, mergeProps, onCleanup, Show, Switch } from 'solid-js';\nimport { frameCallback } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport mdStyle from '../md-style';\nimport theme from '../theme';\n\nimport '../code';\nimport '../img';\n\nfunction MD(_props: MdProps) {\n  let renderer: marked.Renderer | undefined;\n  let ref: HTMLDivElement | undefined;\n  const { baseStyle } = theme;\n  const props = mergeProps(\n    {\n      webWorker: false,\n      pictureViewer: true,\n      lazyPicture: true,\n      text: '',\n      tools: ['copy'],\n      getAnchorContainer: () => window as unknown as HTMLElement,\n    },\n    _props,\n  );\n\n  function initWorker() {\n    return new Worker('https://cdn.jsdelivr.net/npm/neko-ui@latest/es/md/worker.js');\n  }\n  // eslint-disable-next-line solid/reactivity\n  let worker: Worker | undefined = props.webWorker ? initWorker() : void 0;\n\n  function update(e: { data: string }) {\n    if (ref) {\n      ref.innerHTML = e.data;\n    }\n  }\n  async function postMessage(opt: {\n    text: string;\n    pictureViewer?: boolean;\n    lazyPicture?: boolean;\n    langToolbar?: string[];\n    langLineNumber?: boolean;\n  }) {\n    const { text, pictureViewer, lazyPicture, langToolbar, ...options } = opt;\n    const marked = (await import('marked-completed')).default;\n\n    if (!renderer) {\n      renderer = new marked.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    }\n\n    renderer.image = (src: string, title: string, alt: string) => {\n      return `<n-img lazy=\"${lazyPicture}\" disabled=\"${!pictureViewer}\" role=\"img\" src=\"${src}\" alt=\"${alt}\" ${title ? `title=\"${title}\"` : ''}></n-img>`;\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}\" language=\"${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  createEffect(() => {\n    if (props.webWorker) {\n      if (!worker) {\n        worker = initWorker();\n      }\n      worker.addEventListener('message', update);\n    }\n  });\n\n  createEffect(() => {\n    if (worker) {\n      worker.postMessage(\n        JSON.stringify({\n          text: props.text,\n          langLineNumber: props.lineNumber,\n          langToolbar: props.tools,\n          pictureViewer: props.pictureViewer,\n          lazyPicture: props.lazyPicture,\n        }),\n      );\n    } else {\n      const call = () =>\n        postMessage({\n          text: props.text,\n          langLineNumber: props.lineNumber,\n          langToolbar: props.tools,\n          pictureViewer: props.pictureViewer,\n          lazyPicture: props.lazyPicture,\n        });\n\n      frameCallback(call);\n    }\n  });\n  onCleanup(() => {\n    if (worker) {\n      worker.removeEventListener('message', update);\n      worker.terminate();\n    }\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) => {\n        item.classList.remove('active');\n      });\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) => {\n        observer.observe(e);\n      });\n      list.forEach((e) => {\n        e.addEventListener('click', handleAnchor);\n      });\n    }\n    onCleanup(() => {\n      if (observer) {\n        heading.forEach((e) => {\n          observer.unobserve(e);\n        });\n        observer.disconnect();\n      }\n      list.forEach((e) => {\n        e.removeEventListener('click', handleAnchor);\n      });\n    });\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={mdStyle} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <Switch>\n        <Match when={(props.children || []).length > 0}>\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   * @since 2.8.3\n   * @default true\n   */\n  lazyPicture?: 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   * 使用 web worker\n   */\n  webWorker?: boolean;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n  'n-md',\n  {\n    class: void 0,\n    pictureViewer: void 0,\n    lazyPicture: 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    webWorker: 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":["createEffect","For","Match","mergeProps","onCleanup","Show","Switch","frameCallback","css","cx","customElement","mdStyle","theme","MD","_props","renderer","ref","baseStyle","props","webWorker","pictureViewer","lazyPicture","text","tools","getAnchorContainer","window","initWorker","Worker","worker","update","e","innerHTML","data","postMessage","opt","langToolbar","options","marked","default","Renderer","katexBlock","code","katexInline","image","src","title","alt","toolbar","length","lang","langLineNumber","encodeURIComponent","headerPrefix","breaks","pedantic","smartLists","smartypants","xhtml","addEventListener","JSON","stringify","lineNumber","removeEventListener","terminate","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","unobserve","disconnect","children","class","notRender","_","el","element","textContent","removeAttribute","replaceChildren"],"mappings":"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"}

package/es/menu/README.mdx

@@ -0,0 +1,10 @@
+---
+type: 通用
+title: 导航菜单
+subtitle: n-menu
+icon: ☰
+---
+
+# Menu 导航菜单
+
+> 为页面和功能提供导航的菜单列表。

package/es/menu/examples/basic.md

@@ -0,0 +1,17 @@
+---
+title: 最简单的用法
+order: 1
+---
+
+```html
+<n-menu></n-menu>
+<script>
+  const el = container.querySelector('n-menu');
+
+  el.items = ['A', 'B', { value: 'C', disabled: true }, 'D'];
+</script>
+```
+
+```jsx
+<n-menu items={['A', 'B', { value: 'C', disabled: true }, 'D']} />
+```

package/es/menu/examples/field-names.md

@@ -0,0 +1,42 @@
+---
+title: 自定义字段名
+description: 自定义节点 'label'、'value'、'options' 的字段
+order: 4
+---
+
+```html
+<n-menu></n-menu>
+<script>
+  const el = container.querySelector('n-menu');
+
+  el.fieldNames = {
+    label: 'name',
+    options: 'children',
+    children: 'options',
+  };
+  el.items = [
+    {
+      value: '1',
+      name: '动物',
+      children: ['牛', '马'],
+    },
+  ];
+</script>
+```
+
+```jsx
+<n-menu
+  field-names={{
+    label: 'name',
+    options: 'children',
+    children: 'options',
+  }}
+  items={[
+    {
+      value: '1',
+      name: '动物',
+      children: ['牛', '马'],
+    },
+  ]}
+/>
+```