neko-ui 2.6.7 → 2.7.0

package/es/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 | null;\n  hover: string | null;\n  contextMenu: string | null;\n  none: null;\n  [key: string]: string | null;\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: null,\n    };\n    const closeEvent: EventMap = {\n      hover: 'onMouseLeave',\n      click: null,\n      contextMenu: null,\n      none: null,\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","Show","createComponent","createEffect","createMemo","createSignal","mergeProps","onCleanup","onMount","splitProps","isElementInside","isEqual","isFunction","passiveSupported","css","cx","customElement","Portal","popoverCss","portalCss","theme","Popover","props","ref","childRef","closeTimer","portalTimer","isDark","baseStyle","local","trigger","open","setOpen","posi","setPosi","up","setUp","width","setWidth","openChange","next","disabled","onOpenChange","exit","close","e","clearTimeout","setTimeout","target","getAttribute","isContains","type","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","handleOpen","stopPropagation","preventDefault","clientX","clientY","container","getPopupContainer","document","body","childrenProps","_props","openFn","openEvent","click","hover","contextMenu","none","closeFn","closeEvent","Object","assign","portalStyle","p","keys","map","k","join","portalCls","size","popupClass","hostStyle","addEventListener","passive","removeEventListener","documentElement","class","children","destroyInactive","popupCss","content","defaultProps","_","opt","el","element","dispatchEvent","CustomEvent","detail","childNodes","values","removeAttribute"],"mappings":"IA0DYA,EAWAC,knBArEZ,QACEC,QAAAA,CAAI,CACJC,mBAAAA,CAAe,CACfC,gBAAAA,CAAY,CACZC,cAAAA,CAAU,CACVC,gBAAAA,CAAY,CACZC,cAAAA,CAAU,CACVC,aAAAA,CAAS,CACTC,WAAAA,CAAO,CACPC,cAAAA,CAAU,KACL,UAAW,AAClB,QAASC,MAA8D,oCAAiB,AAAxF,QAA0BC,MAA6C,4BAAiB,AAAxF,QAAmCC,MAAoC,+BAAiB,AAAxF,QAA+CC,MAAwB,qCAAiB,AACxF,QAASC,OAAAA,CAAG,CAAEC,MAAAA,CAAE,KAAQ,aAAc,AACtC,QAASC,iBAAAA,CAAa,KAAQ,eAAgB,AAC9C,QAASC,UAAAA,CAAM,KAAQ,cAAe,AACtC,QAASC,cAAAA,CAAU,CAAEC,aAAAA,CAAS,KAAQ,SAAU,AAChD,OAAO,UAAW,AAClB,QAAOC,MAAW,UAAW,2BAyCjBrB,EAAAA,gBAAAA,gHA6CZ,SAASsB,EAAQC,CAAmB,MA0B9BC,EACAC,EACAC,EAkDAC,EA7EJ,GAAM,CAAEC,OAAAA,CAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGR,EAOxB,CAACS,EAAM,CAAGpB,EANLH,EACT,CACEwB,QAAS,OACX,EACAR,GAE6B,CAC7B,QACA,MACA,aACA,WACA,OACA,UACA,OACA,WACA,eACA,2BACA,kBACA,QACA,YACA,oBACA,WACA,UACD,EAIK,CAACS,EAAMC,EAAQ,CAAG3B,EAA6B,MAC/C,CAAC4B,EAAMC,EAAQ,CAAG7B,EAAmB,CAAC,GACtC,CAAC8B,EAAIC,EAAM,CAAG/B,EAAsB,CAAA,GACpC,CAACgC,EAAOC,EAAS,CAAGjC,EAAa,IAOvC,SAASkC,EAAWC,CAAoB,EACjCX,EAAMY,QAAQ,GACbZ,EAAMa,YAAY,EACpBb,EAAMa,YAAY,CAACF,GAEF,KAAK,IAApBX,EAAME,IAAI,EACZC,EAAQQ,GAGd,CACA,SAASG,IACQ,CAAA,IAAXZ,MACFC,EAAQ,MACRO,EAAW,MAEf,CAOA,SAASK,EAAMC,CAAqB,EAClCC,aAAarB,GACbA,EAAasB,WACX,SAEOF,EAAL,GADAC,aAAarB,GACT,QAACoB,EAAAA,EAAEG,MAAM,SAAT,AAACH,EAA0BI,YAAY,CAAC,oBAAqB,QAC/D,OAEF,IAAMC,EAAaxC,EAAgBmC,EAAEG,MAAM,CAAazB,GAEpD,CAAA,AAACQ,KAAU,CAACmB,GAAgBA,GAAcL,AAAW,cAAXA,EAAEM,IAAI,AAAgB,GAClEZ,EAAW,CAAA,EAEf,EACAV,AAAkB,UAAlBA,EAAMC,OAAO,CAAe,IAAM,EAEtC,CA3CA3B,EAAa,KACQ,KAAK,IAApB0B,EAAME,IAAI,EACZC,EAAQH,EAAME,IAAI,CAEtB,GAiBA5B,EAAa,KACP4B,KAAUF,EAAMuB,wBAAwB,EAAI5B,GAC9Cc,EAAS,CAAC,gBAAgB,EAAEd,EAAS6B,WAAW,CAAC,IAAI,CAAC,CAE1D,GAoBA,IAAMC,EAAa,SAAUT,CAAS,EACpCC,aAAapB,GACbA,EAAcqB,WAAW,KAEvB,GADAD,aAAapB,GACT,CAACH,GAAO,CAACC,GAAa,CAACqB,GAAKhB,AAAkB,gBAAlBA,EAAMC,OAAO,CAC3C,OAEF,GAAIe,OAAAA,SAAAA,EAAGM,IAAI,IAAK,UAAYtB,AAAkB,gBAAlBA,EAAMC,OAAO,CAAoB,CAC3DS,EAAW,CAAA,GACX,MACF,CACA,IAAMgB,EAAS/B,EAAUgC,qBAAqB,GACxCC,EAAalC,EAAKiC,qBAAqB,GACvCE,EAAUD,EAAWpB,KAAK,CAAG,EAAIkB,EAAOlB,KAAK,CAAG,EAChDsB,EAASC,OAAOC,WAAW,CAAGN,EAAOO,MAAM,CAC3CC,EAAalC,EAAMmC,SAAS,CAE5BC,EACJ,AAAC,QAACF,SAAAA,EAAYG,UAAU,CAAC,SACvBP,EAASpC,AAAoB,GAApBA,EAAK4C,YAAY,EAC1BR,EAASJ,EAAOa,GAAG,SACrBL,SAAAA,EAAYG,UAAU,CAAC,WACnBG,EAAcxC,EAAMyC,KAAK,CAAG,EAAI,EAChCC,EAAc,CAAC,EAErB,OAAQ1C,EAAMmC,SAAS,EACrB,IAAK,aACL,IAAK,OACL,IAAK,UACHO,EAAMC,IAAI,CAAGjB,EAAOiB,IAAI,CACxBD,CAAK,CAAC,MAAM,CAAG,CAACd,EAAWpB,KAAK,CAAG,EAAI,GACvC,KACF,KAAK,cACL,IAAK,QACL,IAAK,WACHkC,EAAMC,IAAI,CAAGjB,EAAOkB,KAAK,CAAGhB,EAAWpB,KAAK,CAC5CkC,CAAK,CAAC,MAAM,CAAGd,EAAWpB,KAAK,CAAG,EAAI,GACtC,KACF,SAGEkC,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,EAEnDnC,EAAQ,AAAC0C,GACAjE,EAAQiE,EAAML,GAASK,EAAOL,GAEvCnC,EAAM,AAACwC,GACEA,AAAS,CAACX,IAAVW,EAAsBA,EAAO,CAACX,EAEzC,EAAG,GACL,EAEA,SAASY,EAAWhC,CAAa,EAC/BC,aAAarB,GACboB,EAAEiC,eAAe,GACK,gBAAlBjD,EAAMC,OAAO,EAAsBe,AAAW,gBAAXA,EAAEM,IAAI,GAC3CN,EAAEkC,cAAc,GAChB7C,EAAQ,AAAC0C,GAAU,KACdA,GACHJ,KAAM3B,EAAEmC,OAAO,CACfZ,IAAKvB,EAAEoC,OAAO,CACb,MAAQ,CAAE1D,CAAAA,OAAAA,SAAAA,EAAKiC,qBAAqB,GAAGnB,KAAK,GAAI,CAAA,EAAK,EAAI,OAG9DE,EAAW,CAAA,EACb,CAEA,IAAM2C,EAAY9E,EAAW,IAC3B,AAAIQ,EAAWiB,EAAMsD,iBAAiB,EAC7BtD,EAAMsD,iBAAiB,CAAC3D,GAE1B4D,SAASC,IAAI,EAEhBC,EAAgBlF,EAAW,KAC/B,IAAMmF,EAAgD,CAAC,EAejDC,EAASC,AAba,CAC1BC,MAAO,cACPC,MAAO,eACPC,YAAa,gBACbC,KAAM,IACR,CAQwB,CAAChE,EAAMC,OAAO,CAAC,CACjCgE,EAAUC,AARa,CAC3BJ,MAAO,eACPD,MAAO,KACPE,YAAa,KACbC,KAAM,IACR,CAG0B,CAAChE,EAAMC,OAAO,CAAC,CAYzC,OAVAkE,OAAOC,MAAM,CACXV,EACAC,GAAU,CACR,CAACA,EAAO,CAAEX,CACZ,EACAiB,GAAW,CACT,CAACA,EAAQ,CAAElD,CACb,GAGK2C,CACT,GAEMW,EAAc9F,EAAW,KAC7B,IAAM+F,EAAIlE,IAGV,MAAO,CAAC,SAAS,EAAE+D,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,GAAYpG,EAAW,IACpBW,EACL,SACAc,EAAMyC,KAAK,EAAI,QACf,CAAC,EAAEvC,IAAS,KAAO,MAAM,CAAC,EAAEI,IAAO,KAAO,OAAO,CAAC,CAClDN,EAAM4E,IAAI,CACV5E,EAAM6E,UAAU,GAGdC,GAAYvG,EAAW,IACpB,CAAC,qBAAqB,EAC3BuB,IAAW,UAAY,sBACxB,0CAA0C,CAAC,EAyB9C,OAtBAxB,EAAa,KACP4B,MACFuB,IAEAM,OAAOgD,gBAAgB,CAAC,SAAUtD,EAAY,CAC5CuD,QAAShG,CACX,IAEFN,EAAU,KACRqD,OAAOkD,mBAAmB,CAAC,SAAUxD,EAAY,CAAA,EACnD,EACF,GACA9C,EAAQ,KACgB,SAAlBqB,EAAMC,OAAO,EACfsD,SAAS2B,eAAe,CAACH,gBAAgB,CAAC,YAAahE,EAAO,CAAA,EAElE,GACArC,EAAU,KACRuC,aAAarB,GACb2D,SAAS2B,eAAe,CAACD,mBAAmB,CAAC,YAAalE,EAAO,CAAA,EACnE,+BAKOhB,YACAV,gBACAJ,EAAIe,EAAMf,GAAG,gCAELU,oCAAAA,8BAAiBT,EAAG,UAAWc,EAAM4E,IAAI,CAAE5E,EAAMmF,KAAK,IAAO1B,kBACrEzD,EAAMoF,QAAQ,UAEhBhH,qBAAW8B,AAAW,OAAXA,KAAmB,CAACF,EAAMqF,eAAe,0BAClDjG,mCAAwBiE,sDAEpBtD,YACAT,YACAwF,aACAT,YACA7D,gBACAvB,EAAIe,EAAMsF,QAAQ,gCAEX5F,4BAAqBoB,+BAArBpB,8BAAkCiF,OAAiBlB,gBAC1DrF,qBAAW4B,EAAMuF,OAAO,yFACtBvF,EAAMuF,OAAO,kBAO5B,EA3SYpH,EAAAA,YAAAA,wKA+SZ,QAAO,MAAMqH,aAAe,CAC1BL,MAAO,KAAK,EACZlG,IAAK,KAAK,EACVsG,QAAS,KAAK,EACdjC,kBAAmB,KAAK,EACxBrD,QAAS,KAAK,EACdC,KAAM,KAAK,EACXW,aAAc,KAAK,EACnBgE,WAAY,KAAK,EACjBS,SAAU,KAAK,EACfD,gBAAiB,CAAA,EACjBzE,SAAU,KAAK,EACf6B,MAAO,KAAK,EACZN,UAAW,KAAK,EAChBZ,yBAA0B,KAAK,CACjC,CAAE,CACFpC,EAA4B,YAAaqG,aAAc,CAACC,EAAGC,KACzD,IAAMC,EAAKD,EAAIE,OAAO,CAChBnG,EAAQhB,EACZ,CACEoC,aAAaF,CAAoB,EAC/BgF,EAAGE,aAAa,CACd,IAAIC,YAAY,aAAc,CAC5BC,OAAQpF,CACV,GAEJ,EACAyE,SAAU,IAAIO,EAAGK,UAAU,CAACC,MAAM,GAAG,AACvC,EACAR,GAMF,OAHAnH,EAAa,KACXqH,EAAGO,eAAe,CAAC,MACrB,GACO7H,EAAgBmB,EAASC,EAClC,EACA,gBAAeD,CAAQ"}
+{"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","Show","createComponent","createEffect","createMemo","createSignal","mergeProps","onCleanup","onMount","splitProps","isElementInside","isEqual","isFunction","passiveSupported","css","cx","customElement","Portal","popoverCss","portalCss","theme","Popover","props","ref","childRef","closeTimer","portalTimer","isDark","baseStyle","local","trigger","open","setOpen","posi","setPosi","up","setUp","width","setWidth","openChange","next","disabled","onOpenChange","exit","close","e","clearTimeout","setTimeout","target","getAttribute","isContains","type","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","handleOpen","stopPropagation","preventDefault","clientX","clientY","container","getPopupContainer","document","body","childrenProps","_props","openFn","openEvent","click","hover","contextMenu","none","closeFn","closeEvent","Object","assign","portalStyle","p","keys","map","k","join","portalCls","size","popupClass","hostStyle","addEventListener","passive","removeEventListener","documentElement","class","children","destroyInactive","popupCss","content","defaultProps","_","opt","el","element","dispatchEvent","CustomEvent","detail","childNodes","values","removeAttribute"],"mappings":"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"}

package/es/popover/style.js

@@ -33,9 +33,7 @@ import{css as o}from"@moneko/css";export const popoverCss=o`
       drop-shadow(1px calc(var(--direction) * 2px) 8px var(--popover-shadow-color))
       drop-shadow(2px calc(var(--direction) * 4px) 16px var(--popover-shadow-color));
     min-inline-size: 100px;
-    backdrop-filter: blur(16px);
-    /* stylelint-disable-next-line */
-    -webkit-backdrop-filter: blur(16px);
+    backdrop-filter: blur(10px);
     box-sizing: border-box;
   }
 

package/es/popover/style.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/popover/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const popoverCss = css`\n  .popover {\n    position: relative;\n    display: inline-block;\n    box-sizing: border-box;\n\n    &::-webkit-scrollbar {\n      inline-size: 1px;\n    }\n  }\n`;\nexport const portalCss = css`\n  .container {\n    overflow-y: auto;\n    /* stylelint-disable-next-line */\n    max-block-size: -webkit-fill-available;\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  .portal {\n    --direction: 1;\n\n    position: fixed;\n    display: inline-block;\n    border-radius: var(--border-radius);\n    padding: 4px;\n    font-size: var(--font-size);\n    color: var(--text-color);\n    background-color: var(--popover-bg);\n    filter: drop-shadow(0.5px calc(var(--direction) * 1px) 4px var(--popover-shadow-color))\n      drop-shadow(1px calc(var(--direction) * 2px) 8px var(--popover-shadow-color))\n      drop-shadow(2px calc(var(--direction) * 4px) 16px var(--popover-shadow-color));\n    min-inline-size: 100px;\n    backdrop-filter: blur(16px);\n    /* stylelint-disable-next-line */\n    -webkit-backdrop-filter: blur(16px);\n    box-sizing: border-box;\n  }\n\n  .arrow {\n    &::before {\n      position: absolute;\n      inset-inline: 0;\n      inset-block-end: 0;\n      margin: auto;\n      inline-size: 12px;\n      block-size: 8px;\n      background: inherit;\n      content: '';\n      clip-path: polygon(0% 0%, 50% 100%, 100% 0%);\n      transform: translate3d(var(--x, 0), 100%, 0);\n    }\n  }\n\n  .in-up {\n    --direction: -1;\n\n    animation: popover-up-in-effect var(--transition-duration) forwards;\n    transform: scaleY(1);\n  }\n\n  .out-up {\n    --direction: -1;\n\n    animation: popover-up-out-effect var(--transition-duration) forwards;\n    transform: scaleY(1);\n  }\n\n  .in-down {\n    --direction: 1;\n\n    animation: popover-down-in-effect var(--transition-duration) forwards;\n    transform: scaleY(1);\n\n    &::before {\n      inset-block-end: unset;\n      inset-block-start: 0;\n      transform: translate3d(var(--x, 0), -100%, 0) rotate(180deg);\n    }\n  }\n\n  .out-down {\n    --direction: 1;\n\n    animation: popover-down-out-effect var(--transition-duration) forwards;\n    transform: scaleY(1);\n\n    &::before {\n      inset-block-end: unset;\n      inset-block-start: 0;\n      transform: translate3d(var(--x, 0), -100%, 0) rotate(180deg);\n    }\n  }\n\n  @keyframes popover-down-in-effect {\n    0% {\n      transform: scaleY(0.8);\n      transform-origin: 0% 0%;\n      opacity: 0;\n    }\n\n    100% {\n      transform: scaleY(1);\n      transform-origin: 0% 0%;\n      opacity: 1;\n    }\n  }\n\n  @keyframes popover-down-out-effect {\n    0% {\n      transform: scaleY(1);\n      transform-origin: 0% 0%;\n      opacity: 1;\n      pointer-events: none;\n    }\n\n    100% {\n      transform: scaleY(0.8);\n      transform-origin: 0% 0%;\n      opacity: 0;\n      pointer-events: none;\n    }\n  }\n\n  @keyframes popover-up-in-effect {\n    0% {\n      transform: scaleY(0.8);\n      transform-origin: 100% 100%;\n      opacity: 0;\n    }\n\n    100% {\n      transform: scaleY(1);\n      transform-origin: 100% 100%;\n      opacity: 1;\n    }\n  }\n\n  @keyframes popover-up-out-effect {\n    0% {\n      transform: scaleY(1);\n      transform-origin: 100% 100%;\n      opacity: 1;\n      pointer-events: none;\n    }\n\n    100% {\n      transform: scaleY(0.8);\n      transform-origin: 100% 100%;\n      opacity: 0;\n      pointer-events: none;\n    }\n  }\n`;\n"],"names":["css","popoverCss","portalCss"],"mappings":"AAAA,OAASA,OAAAA,CAAG,KAAQ,aAAc,AAElC,QAAO,MAAMC,WAAaD,CAAG,CAAC;;;;;;;;;;AAU9B,CAAC,AAAC,AACF,QAAO,MAAME,UAAYF,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiJ7B,CAAC,AAAC"}
+{"version":3,"sources":["../../components/popover/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const popoverCss = css`\n  .popover {\n    position: relative;\n    display: inline-block;\n    box-sizing: border-box;\n\n    &::-webkit-scrollbar {\n      inline-size: 1px;\n    }\n  }\n`;\nexport const portalCss = css`\n  .container {\n    overflow-y: auto;\n    /* stylelint-disable-next-line */\n    max-block-size: -webkit-fill-available;\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n  }\n\n  .portal {\n    --direction: 1;\n\n    position: fixed;\n    display: inline-block;\n    border-radius: var(--border-radius);\n    padding: 4px;\n    font-size: var(--font-size);\n    color: var(--text-color);\n    background-color: var(--popover-bg);\n    filter: drop-shadow(0.5px calc(var(--direction) * 1px) 4px var(--popover-shadow-color))\n      drop-shadow(1px calc(var(--direction) * 2px) 8px var(--popover-shadow-color))\n      drop-shadow(2px calc(var(--direction) * 4px) 16px var(--popover-shadow-color));\n    min-inline-size: 100px;\n    backdrop-filter: blur(10px);\n    box-sizing: border-box;\n  }\n\n  .arrow {\n    &::before {\n      position: absolute;\n      inset-inline: 0;\n      inset-block-end: 0;\n      margin: auto;\n      inline-size: 12px;\n      block-size: 8px;\n      background: inherit;\n      content: '';\n      clip-path: polygon(0% 0%, 50% 100%, 100% 0%);\n      transform: translate3d(var(--x, 0), 100%, 0);\n    }\n  }\n\n  .in-up {\n    --direction: -1;\n\n    animation: popover-up-in-effect var(--transition-duration) forwards;\n    transform: scaleY(1);\n  }\n\n  .out-up {\n    --direction: -1;\n\n    animation: popover-up-out-effect var(--transition-duration) forwards;\n    transform: scaleY(1);\n  }\n\n  .in-down {\n    --direction: 1;\n\n    animation: popover-down-in-effect var(--transition-duration) forwards;\n    transform: scaleY(1);\n\n    &::before {\n      inset-block-end: unset;\n      inset-block-start: 0;\n      transform: translate3d(var(--x, 0), -100%, 0) rotate(180deg);\n    }\n  }\n\n  .out-down {\n    --direction: 1;\n\n    animation: popover-down-out-effect var(--transition-duration) forwards;\n    transform: scaleY(1);\n\n    &::before {\n      inset-block-end: unset;\n      inset-block-start: 0;\n      transform: translate3d(var(--x, 0), -100%, 0) rotate(180deg);\n    }\n  }\n\n  @keyframes popover-down-in-effect {\n    0% {\n      transform: scaleY(0.8);\n      transform-origin: 0% 0%;\n      opacity: 0;\n    }\n\n    100% {\n      transform: scaleY(1);\n      transform-origin: 0% 0%;\n      opacity: 1;\n    }\n  }\n\n  @keyframes popover-down-out-effect {\n    0% {\n      transform: scaleY(1);\n      transform-origin: 0% 0%;\n      opacity: 1;\n      pointer-events: none;\n    }\n\n    100% {\n      transform: scaleY(0.8);\n      transform-origin: 0% 0%;\n      opacity: 0;\n      pointer-events: none;\n    }\n  }\n\n  @keyframes popover-up-in-effect {\n    0% {\n      transform: scaleY(0.8);\n      transform-origin: 100% 100%;\n      opacity: 0;\n    }\n\n    100% {\n      transform: scaleY(1);\n      transform-origin: 100% 100%;\n      opacity: 1;\n    }\n  }\n\n  @keyframes popover-up-out-effect {\n    0% {\n      transform: scaleY(1);\n      transform-origin: 100% 100%;\n      opacity: 1;\n      pointer-events: none;\n    }\n\n    100% {\n      transform: scaleY(0.8);\n      transform-origin: 100% 100%;\n      opacity: 0;\n      pointer-events: none;\n    }\n  }\n`;\n"],"names":["css","popoverCss","portalCss"],"mappings":"AAAA,OAASA,OAAAA,CAAG,KAAQ,aAAc,AAElC,QAAO,MAAMC,WAAaD,CAAG,CAAC;;;;;;;;;;AAU9B,CAAC,AAAC,AACF,QAAO,MAAME,UAAYF,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+I7B,CAAC,AAAC"}

package/es/prism/css.js

@@ -337,9 +337,7 @@ import{createMemo as o,createRoot as e,getOwner as r}from"solid-js";import{css a
       box-shadow: 0 1px 5px rgb(0 0 0 / 10%);
       line-height: 24px;
       text-transform: uppercase;
-      backdrop-filter: blur(16px);
-      /* stylelint-disable-next-line */
-      -webkit-backdrop-filter: blur(16px);
+      backdrop-filter: blur(10px);
       content: attr(data-lang) '';
       transition-property: background-color, border-color, color;
     }

package/es/prism/css.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/prism/css.ts"],"sourcesContent":["import { createMemo, createRoot, getOwner } from 'solid-js';\nimport { css } from '@moneko/css';\nimport theme from '../theme';\n\nconst prismCss = createRoot(() => {\n  const { isDark } = theme;\n  const baseCss = css`\n    [data-copy]::before {\n      position: absolute;\n      inset-block-start: 32px;\n      inset-inline: 0;\n      z-index: 1;\n      display: inline-block;\n      margin: auto;\n      border: 1px solid;\n      border-radius: var(--border-radius);\n      padding: 4px 8px;\n      inline-size: fit-content;\n      font-size: var(--font-size-sm);\n      transition:\n        background-color 0.3s,\n        color 0.3s,\n        border-color 0.3s;\n      animation-fill-mode: forwards;\n      content: '复制成功';\n    }\n\n    [data-copy='success']::before {\n      border-color: var(--success-border);\n      color: var(--success-color);\n      background-color: var(--success-bg);\n      animation: copy-slide-in var(--transition-duration) var(--transition-timing-function);\n      content: '复制成功';\n    }\n\n    [data-copy='failure']::before {\n      border-color: var(--error-border);\n      color: var(--error-color);\n      background-color: var(--error-bg);\n      animation:\n        copy-slide-in var(--transition-duration) var(--transition-timing-function),\n        error 1s var(--transition-timing-function) 1s;\n      content: '复制失败';\n    }\n\n    [data-copy-exit]::before {\n      animation: copy-slide-out var(--transition-duration) forwards\n        var(--transition-timing-function);\n    }\n\n    @keyframes copy-slide-in {\n      from {\n        transform: translate3d(0, -100%, 0) scale(0);\n        opacity: 0;\n      }\n\n      to {\n        transform: translate3d(0, 0, 0) scale(1);\n        opacity: 1;\n      }\n    }\n\n    @keyframes copy-slide-out {\n      from {\n        transform: translate3d(0, 0, 0) scale(1);\n        opacity: 1;\n      }\n\n      to {\n        transform: translate3d(0, -100%, 0) scale(0);\n        opacity: 0;\n      }\n    }\n\n    pre > code {\n      display: block;\n      overflow: auto;\n      margin: 0 16px 8px;\n      padding: 32px 0 8px;\n      max-inline-size: 100%;\n      font-size: var(--font-size);\n      white-space: pre;\n      line-height: 1.8;\n      pointer-events: auto;\n      transition-duration: var(--transition-duration);\n      transition-timing-function: var(--transition-timing-function);\n      transition-property: box-shadow, background-color, border-color, color;\n    }\n\n    code[class*='language-'],\n    pre[class*='language-'] {\n      color: var(--code-color, #90a4ae);\n\n      &::selection,\n      & ::selection {\n        background-color: var(--text-selection);\n        text-shadow: 0 1px var(--primary-shadow);\n      }\n    }\n\n    .language-css > code,\n    .language-sass > code,\n    .language-scss > code {\n      color: var(--code-lang-style-color, #f76d47);\n    }\n\n    .line-numbers-rows,\n    .toolbar::after,\n    .toolbar-copy::after,\n    pre {\n      transition-duration: var(--transition-duration);\n      transition-timing-function: var(--transition-timing-function);\n    }\n\n    [class*='language-'] .namespace {\n      opacity: 0.7;\n    }\n\n    .tag {\n      color: var(--token-tag, #e53935);\n    }\n\n    .atrule {\n      color: var(--token-atrule, #7c4dff);\n    }\n\n    .attr-name {\n      color: var(--token-attr-name, #39adb5);\n    }\n\n    .attr-value {\n      color: var(--token-attr-value, #f6a434);\n    }\n\n    .attribute {\n      color: var(--token-attribute, #f6a434);\n    }\n\n    .boolean {\n      color: var(--token-boolean, #7c4dff);\n    }\n\n    .builtin {\n      color: var(--token-builtin, #39adb5);\n    }\n\n    .cdata {\n      color: var(--token-cdata, #39adb5);\n    }\n\n    .char {\n      color: var(--token-char, #39adb5);\n    }\n\n    .class {\n      color: var(--token-class, #39adb5);\n    }\n\n    .class-name,\n    .maybe-class-name {\n      color: var(--token-class-name, #6182b8);\n    }\n\n    .comment {\n      color: var(--token-comment, #aabfc9);\n    }\n\n    .constant {\n      color: var(--token-constant, #7c4dff);\n    }\n\n    .deleted {\n      color: var(--token-deleted, #e53935);\n    }\n\n    .doctype {\n      color: var(--token-doctype, #aabfc9);\n    }\n\n    .entity {\n      color: var(--token-entity, #e53935);\n    }\n\n    .function {\n      color: var(--token-function, #7c4dff);\n    }\n\n    .hexcode {\n      color: var(--token-hexcode, #f76d47);\n    }\n\n    .id {\n      font-weight: bold;\n      color: var(--token-id, #7c4dff);\n    }\n\n    .important {\n      font-weight: bold;\n      color: var(--token-important, #7c4dff);\n    }\n\n    .inserted {\n      color: var(--token-inserted, #39adb5);\n    }\n\n    .keyword {\n      color: var(--token-keyword, #7c4dff);\n    }\n\n    .number {\n      color: var(--token-number, #f76d47);\n    }\n\n    .operator {\n      color: var(--token-operator, #39adb5);\n    }\n\n    .prolog {\n      color: var(--token-prolog, #aabfc9);\n    }\n\n    .property {\n      color: var(--token-property, #39adb5);\n    }\n\n    .pseudo-class {\n      color: var(--token-pseudo-class, #f6a434);\n    }\n\n    .pseudo-element {\n      color: var(--token-pseudo-element, #f6a434);\n    }\n\n    .punctuation {\n      color: var(--token-punctuation, #39adb5);\n    }\n\n    .regex {\n      color: var(--token-regex, #6182b8);\n    }\n\n    .selector {\n      color: var(--token-selector, #e53935);\n    }\n\n    .string {\n      color: var(--token-string, #f6a434);\n    }\n\n    .symbol {\n      color: var(--token-symbol, #7c4dff);\n    }\n\n    .unit {\n      color: var(--token-unit, #f76d47);\n    }\n\n    .url {\n      color: var(--token-url, #e53935);\n    }\n\n    .variable {\n      color: var(--token-variable, #e53935);\n    }\n\n    code[class*='language-'],\n    pre,\n    .n-editor textarea {\n      font-family: 'Liberation Mono', Monaco, Menlo, Consolas, 'Source Code Pro', 'Ubuntu Mono',\n        'Microsoft Yahei', '微软雅黑', Courier, 'Helvetica Neue', 'Lantinghei SC', STXihei,\n        WenQuanYi, sans-serif;\n      text-align: start;\n      white-space: pre;\n      word-wrap: normal;\n      word-break: normal;\n      word-spacing: normal;\n      tab-size: 4;\n      hyphens: none;\n    }\n\n    .deleted:not(.prefix) {\n      display: block;\n      color: inherit;\n      background-color: rgb(255 0 0 / 10%);\n    }\n\n    .inserted:not(.prefix) {\n      display: block;\n      color: inherit;\n      background-color: rgb(0 255 128 / 10%);\n    }\n\n    span .inline-color-wrapper {\n      display: inline-block;\n      overflow: hidden;\n      margin: 0 0.333ch;\n      border: var(--border-base);\n      background: repeating-conic-gradient(#eee 0% 25%, transparent 0% 50%) 0 / 10px 10px;\n      outline: 1px solid rgb(0 0 0 / 50%);\n      inline-size: 1.333ch;\n      block-size: 1.333ch;\n      box-sizing: border-box;\n    }\n\n    span .inline-color {\n      display: block;\n      inline-size: 120%;\n      block-size: 120%;\n    }\n\n    pre,\n    .n-editor {\n      position: relative;\n      display: block;\n      overflow: visible;\n      margin: auto;\n      border-radius: var(--border-radius);\n      max-inline-size: 100%;\n      font-size: var(--font-size);\n      white-space: pre-wrap;\n      background-color: var(--primary-component-bg);\n      box-shadow: 0 2px 8px 0 var(--primary-shadow);\n      line-height: 20px;\n      transition-property: color, background-color, box-shadow;\n    }\n\n    pre .toolbar::after {\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-start: 0;\n      z-index: 1;\n      display: block;\n      overflow: hidden;\n      border-radius: var(--border-radius) var(--border-radius) 0 0;\n      inline-size: 100%;\n      block-size: 24px;\n      font-size: var(--font-size);\n      font-family: Ubuntu, sans-serif;\n      font-weight: bold;\n      text-align: center;\n      color: var(--text-color);\n      background-color: var(--code-toolbar-bg, rgb(220 224 229 / 50%));\n      box-shadow: 0 1px 5px rgb(0 0 0 / 10%);\n      line-height: 24px;\n      text-transform: uppercase;\n      backdrop-filter: blur(16px);\n      /* stylelint-disable-next-line */\n      -webkit-backdrop-filter: blur(16px);\n      content: attr(data-lang) '';\n      transition-property: background-color, border-color, color;\n    }\n\n    pre .toolbar::before {\n      position: absolute;\n      inset-block-start: 10px;\n      inset-inline-start: 12px;\n      z-index: 3;\n      display: inline-block;\n      border-radius: var(--border-radius);\n      inline-size: 4px;\n      block-size: 4px;\n      text-align: center;\n      background-color: #fc625d;\n      box-shadow:\n        0 0 0 4px #fc625d,\n        20px 0 0 4px #fdbc40,\n        40px 0 0 4px #35cd4b;\n      cursor: pointer;\n      content: '';\n    }\n\n    pre .toolbar .toolbar-copy {\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-end: 8px;\n      z-index: 3;\n      border: none;\n      padding: 0;\n      background: none;\n      outline: none;\n      cursor: pointer;\n    }\n\n    pre .toolbar .toolbar-copy:active {\n      transform: scale(0.95);\n    }\n\n    .toolbar .toolbar-copy::after {\n      user-select: none;\n      display: block;\n      font-size: 24px;\n      font-family: sans-serif;\n      color: var(--text-color);\n      line-height: 24px;\n      content: '⎘';\n      transition-property: color, transform;\n    }\n\n    .toolbar .toolbar-copy:hover::after {\n      color: var(--primary-color, #5794ff);\n    }\n\n    pre.line-numbers > code {\n      margin: 0 10px 0 54px;\n      white-space: inherit;\n      counter-reset: linenumber;\n    }\n\n    pre.line-numbers .line-numbers-rows {\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-start: 0;\n      overflow-y: auto;\n      border-inline-end: 1px solid var(--border-color);\n      border-radius: var(--border-radius) 0 0 var(--border-radius);\n      padding: 32px 0 8px;\n      inline-size: 44px;\n      max-block-size: inherit;\n      font-size: 100%;\n      background-color: var(--primary-component-bg);\n      letter-spacing: -1px;\n      user-select: none;\n      pointer-events: none;\n      transition-property: background-color, border-color;\n    }\n\n    .line-numbers-rows > span {\n      display: block;\n      counter-increment: linenumber;\n    }\n\n    .line-numbers-rows > span::before {\n      display: block;\n      padding-inline-end: 0.8em;\n      text-align: end;\n      color: #999;\n      opacity: 0.5;\n      content: counter(linenumber);\n    }\n\n    pre::-webkit-scrollbar,\n    pre ::-webkit-scrollbar {\n      display: none;\n    }\n\n    @media print {\n      code[class*='language-'],\n      pre[class*='language-'] {\n        text-shadow: none;\n      }\n    }\n  `;\n  const darkCss = css`\n    :host {\n      --code-color: #eee;\n      --code-lang-style-color: #fd9170;\n      --code-toolbar-bg: rgb(63 63 63 / 70%);\n      --token-atrule: #c792ea;\n      --token-attr-name: #ffcb6b;\n      --token-attr-value: #a5e844;\n      --token-attribute: #a5e844;\n      --token-boolean: #c792ea;\n      --token-builtin: #ffcb6b;\n      --token-cdata: #80cbc4;\n      --token-char: #80cbc4;\n      --token-class: #ffcb6b;\n      --token-class-name: #f2ff00;\n      --token-comment: #616161;\n      --token-constant: #c792ea;\n      --token-deleted: #f66;\n      --token-doctype: #616161;\n      --token-entity: #f66;\n      --token-function: #c792ea;\n      --token-hexcode: #f2ff00;\n      --token-id: #c792ea;\n      --token-important: #c792ea;\n      --token-inserted: #80cbc4;\n      --token-keyword: #c792ea;\n      --token-number: #fd9170;\n      --token-operator: #89ddff;\n      --token-prolog: #616161;\n      --token-property: #80cbc4;\n      --token-pseudo-class: #a5e844;\n      --token-pseudo-element: #a5e844;\n      --token-punctuation: #89ddff;\n      --token-regex: #f2ff00;\n      --token-selector: #f66;\n      --token-string: #a5e844;\n      --token-symbol: #c792ea;\n      --token-tag: #f66;\n      --token-unit: #fd9170;\n      --token-url: #f66;\n      --token-variable: #f66;\n    }\n  `;\n\n  const style = createMemo(() => `${isDark() ? darkCss : ''}${baseCss}`);\n\n  return style;\n}, getOwner());\n\nexport default prismCss;\n"],"names":["createMemo","createRoot","getOwner","css","theme","prismCss","isDark","baseCss","darkCss"],"mappings":"AAAA,OAASA,cAAAA,CAAU,CAAEC,cAAAA,CAAU,CAAEC,YAAAA,CAAQ,KAAQ,UAAW,AAC5D,QAASC,OAAAA,CAAG,KAAQ,aAAc,AAClC,QAAOC,MAAW,UAAW,CAE7B,IAAMC,EAAWJ,EAAW,KAC1B,GAAM,CAAEK,OAAAA,CAAM,CAAE,CAAGF,EACbG,EAAUJ,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6bpB,CAAC,CACKK,EAAUL,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0CpB,CAAC,CAID,OAFcH,EAAW,IAAM,CAAC,EAAEM,IAAWE,EAAU,GAAG,EAAED,EAAQ,CAAC,CAGvE,EAAGL,IAEH,gBAAeG,CAAS"}
+{"version":3,"sources":["../../components/prism/css.ts"],"sourcesContent":["import { createMemo, createRoot, getOwner } from 'solid-js';\nimport { css } from '@moneko/css';\nimport theme from '../theme';\n\nconst prismCss = createRoot(() => {\n  const { isDark } = theme;\n  const baseCss = css`\n    [data-copy]::before {\n      position: absolute;\n      inset-block-start: 32px;\n      inset-inline: 0;\n      z-index: 1;\n      display: inline-block;\n      margin: auto;\n      border: 1px solid;\n      border-radius: var(--border-radius);\n      padding: 4px 8px;\n      inline-size: fit-content;\n      font-size: var(--font-size-sm);\n      transition:\n        background-color 0.3s,\n        color 0.3s,\n        border-color 0.3s;\n      animation-fill-mode: forwards;\n      content: '复制成功';\n    }\n\n    [data-copy='success']::before {\n      border-color: var(--success-border);\n      color: var(--success-color);\n      background-color: var(--success-bg);\n      animation: copy-slide-in var(--transition-duration) var(--transition-timing-function);\n      content: '复制成功';\n    }\n\n    [data-copy='failure']::before {\n      border-color: var(--error-border);\n      color: var(--error-color);\n      background-color: var(--error-bg);\n      animation:\n        copy-slide-in var(--transition-duration) var(--transition-timing-function),\n        error 1s var(--transition-timing-function) 1s;\n      content: '复制失败';\n    }\n\n    [data-copy-exit]::before {\n      animation: copy-slide-out var(--transition-duration) forwards\n        var(--transition-timing-function);\n    }\n\n    @keyframes copy-slide-in {\n      from {\n        transform: translate3d(0, -100%, 0) scale(0);\n        opacity: 0;\n      }\n\n      to {\n        transform: translate3d(0, 0, 0) scale(1);\n        opacity: 1;\n      }\n    }\n\n    @keyframes copy-slide-out {\n      from {\n        transform: translate3d(0, 0, 0) scale(1);\n        opacity: 1;\n      }\n\n      to {\n        transform: translate3d(0, -100%, 0) scale(0);\n        opacity: 0;\n      }\n    }\n\n    pre > code {\n      display: block;\n      overflow: auto;\n      margin: 0 16px 8px;\n      padding: 32px 0 8px;\n      max-inline-size: 100%;\n      font-size: var(--font-size);\n      white-space: pre;\n      line-height: 1.8;\n      pointer-events: auto;\n      transition-duration: var(--transition-duration);\n      transition-timing-function: var(--transition-timing-function);\n      transition-property: box-shadow, background-color, border-color, color;\n    }\n\n    code[class*='language-'],\n    pre[class*='language-'] {\n      color: var(--code-color, #90a4ae);\n\n      &::selection,\n      & ::selection {\n        background-color: var(--text-selection);\n        text-shadow: 0 1px var(--primary-shadow);\n      }\n    }\n\n    .language-css > code,\n    .language-sass > code,\n    .language-scss > code {\n      color: var(--code-lang-style-color, #f76d47);\n    }\n\n    .line-numbers-rows,\n    .toolbar::after,\n    .toolbar-copy::after,\n    pre {\n      transition-duration: var(--transition-duration);\n      transition-timing-function: var(--transition-timing-function);\n    }\n\n    [class*='language-'] .namespace {\n      opacity: 0.7;\n    }\n\n    .tag {\n      color: var(--token-tag, #e53935);\n    }\n\n    .atrule {\n      color: var(--token-atrule, #7c4dff);\n    }\n\n    .attr-name {\n      color: var(--token-attr-name, #39adb5);\n    }\n\n    .attr-value {\n      color: var(--token-attr-value, #f6a434);\n    }\n\n    .attribute {\n      color: var(--token-attribute, #f6a434);\n    }\n\n    .boolean {\n      color: var(--token-boolean, #7c4dff);\n    }\n\n    .builtin {\n      color: var(--token-builtin, #39adb5);\n    }\n\n    .cdata {\n      color: var(--token-cdata, #39adb5);\n    }\n\n    .char {\n      color: var(--token-char, #39adb5);\n    }\n\n    .class {\n      color: var(--token-class, #39adb5);\n    }\n\n    .class-name,\n    .maybe-class-name {\n      color: var(--token-class-name, #6182b8);\n    }\n\n    .comment {\n      color: var(--token-comment, #aabfc9);\n    }\n\n    .constant {\n      color: var(--token-constant, #7c4dff);\n    }\n\n    .deleted {\n      color: var(--token-deleted, #e53935);\n    }\n\n    .doctype {\n      color: var(--token-doctype, #aabfc9);\n    }\n\n    .entity {\n      color: var(--token-entity, #e53935);\n    }\n\n    .function {\n      color: var(--token-function, #7c4dff);\n    }\n\n    .hexcode {\n      color: var(--token-hexcode, #f76d47);\n    }\n\n    .id {\n      font-weight: bold;\n      color: var(--token-id, #7c4dff);\n    }\n\n    .important {\n      font-weight: bold;\n      color: var(--token-important, #7c4dff);\n    }\n\n    .inserted {\n      color: var(--token-inserted, #39adb5);\n    }\n\n    .keyword {\n      color: var(--token-keyword, #7c4dff);\n    }\n\n    .number {\n      color: var(--token-number, #f76d47);\n    }\n\n    .operator {\n      color: var(--token-operator, #39adb5);\n    }\n\n    .prolog {\n      color: var(--token-prolog, #aabfc9);\n    }\n\n    .property {\n      color: var(--token-property, #39adb5);\n    }\n\n    .pseudo-class {\n      color: var(--token-pseudo-class, #f6a434);\n    }\n\n    .pseudo-element {\n      color: var(--token-pseudo-element, #f6a434);\n    }\n\n    .punctuation {\n      color: var(--token-punctuation, #39adb5);\n    }\n\n    .regex {\n      color: var(--token-regex, #6182b8);\n    }\n\n    .selector {\n      color: var(--token-selector, #e53935);\n    }\n\n    .string {\n      color: var(--token-string, #f6a434);\n    }\n\n    .symbol {\n      color: var(--token-symbol, #7c4dff);\n    }\n\n    .unit {\n      color: var(--token-unit, #f76d47);\n    }\n\n    .url {\n      color: var(--token-url, #e53935);\n    }\n\n    .variable {\n      color: var(--token-variable, #e53935);\n    }\n\n    code[class*='language-'],\n    pre,\n    .n-editor textarea {\n      font-family: 'Liberation Mono', Monaco, Menlo, Consolas, 'Source Code Pro', 'Ubuntu Mono',\n        'Microsoft Yahei', '微软雅黑', Courier, 'Helvetica Neue', 'Lantinghei SC', STXihei,\n        WenQuanYi, sans-serif;\n      text-align: start;\n      white-space: pre;\n      word-wrap: normal;\n      word-break: normal;\n      word-spacing: normal;\n      tab-size: 4;\n      hyphens: none;\n    }\n\n    .deleted:not(.prefix) {\n      display: block;\n      color: inherit;\n      background-color: rgb(255 0 0 / 10%);\n    }\n\n    .inserted:not(.prefix) {\n      display: block;\n      color: inherit;\n      background-color: rgb(0 255 128 / 10%);\n    }\n\n    span .inline-color-wrapper {\n      display: inline-block;\n      overflow: hidden;\n      margin: 0 0.333ch;\n      border: var(--border-base);\n      background: repeating-conic-gradient(#eee 0% 25%, transparent 0% 50%) 0 / 10px 10px;\n      outline: 1px solid rgb(0 0 0 / 50%);\n      inline-size: 1.333ch;\n      block-size: 1.333ch;\n      box-sizing: border-box;\n    }\n\n    span .inline-color {\n      display: block;\n      inline-size: 120%;\n      block-size: 120%;\n    }\n\n    pre,\n    .n-editor {\n      position: relative;\n      display: block;\n      overflow: visible;\n      margin: auto;\n      border-radius: var(--border-radius);\n      max-inline-size: 100%;\n      font-size: var(--font-size);\n      white-space: pre-wrap;\n      background-color: var(--primary-component-bg);\n      box-shadow: 0 2px 8px 0 var(--primary-shadow);\n      line-height: 20px;\n      transition-property: color, background-color, box-shadow;\n    }\n\n    pre .toolbar::after {\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-start: 0;\n      z-index: 1;\n      display: block;\n      overflow: hidden;\n      border-radius: var(--border-radius) var(--border-radius) 0 0;\n      inline-size: 100%;\n      block-size: 24px;\n      font-size: var(--font-size);\n      font-family: Ubuntu, sans-serif;\n      font-weight: bold;\n      text-align: center;\n      color: var(--text-color);\n      background-color: var(--code-toolbar-bg, rgb(220 224 229 / 50%));\n      box-shadow: 0 1px 5px rgb(0 0 0 / 10%);\n      line-height: 24px;\n      text-transform: uppercase;\n      backdrop-filter: blur(10px);\n      content: attr(data-lang) '';\n      transition-property: background-color, border-color, color;\n    }\n\n    pre .toolbar::before {\n      position: absolute;\n      inset-block-start: 10px;\n      inset-inline-start: 12px;\n      z-index: 3;\n      display: inline-block;\n      border-radius: var(--border-radius);\n      inline-size: 4px;\n      block-size: 4px;\n      text-align: center;\n      background-color: #fc625d;\n      box-shadow:\n        0 0 0 4px #fc625d,\n        20px 0 0 4px #fdbc40,\n        40px 0 0 4px #35cd4b;\n      cursor: pointer;\n      content: '';\n    }\n\n    pre .toolbar .toolbar-copy {\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-end: 8px;\n      z-index: 3;\n      border: none;\n      padding: 0;\n      background: none;\n      outline: none;\n      cursor: pointer;\n    }\n\n    pre .toolbar .toolbar-copy:active {\n      transform: scale(0.95);\n    }\n\n    .toolbar .toolbar-copy::after {\n      user-select: none;\n      display: block;\n      font-size: 24px;\n      font-family: sans-serif;\n      color: var(--text-color);\n      line-height: 24px;\n      content: '⎘';\n      transition-property: color, transform;\n    }\n\n    .toolbar .toolbar-copy:hover::after {\n      color: var(--primary-color, #5794ff);\n    }\n\n    pre.line-numbers > code {\n      margin: 0 10px 0 54px;\n      white-space: inherit;\n      counter-reset: linenumber;\n    }\n\n    pre.line-numbers .line-numbers-rows {\n      position: absolute;\n      inset-block-start: 0;\n      inset-inline-start: 0;\n      overflow-y: auto;\n      border-inline-end: 1px solid var(--border-color);\n      border-radius: var(--border-radius) 0 0 var(--border-radius);\n      padding: 32px 0 8px;\n      inline-size: 44px;\n      max-block-size: inherit;\n      font-size: 100%;\n      background-color: var(--primary-component-bg);\n      letter-spacing: -1px;\n      user-select: none;\n      pointer-events: none;\n      transition-property: background-color, border-color;\n    }\n\n    .line-numbers-rows > span {\n      display: block;\n      counter-increment: linenumber;\n    }\n\n    .line-numbers-rows > span::before {\n      display: block;\n      padding-inline-end: 0.8em;\n      text-align: end;\n      color: #999;\n      opacity: 0.5;\n      content: counter(linenumber);\n    }\n\n    pre::-webkit-scrollbar,\n    pre ::-webkit-scrollbar {\n      display: none;\n    }\n\n    @media print {\n      code[class*='language-'],\n      pre[class*='language-'] {\n        text-shadow: none;\n      }\n    }\n  `;\n  const darkCss = css`\n    :host {\n      --code-color: #eee;\n      --code-lang-style-color: #fd9170;\n      --code-toolbar-bg: rgb(63 63 63 / 70%);\n      --token-atrule: #c792ea;\n      --token-attr-name: #ffcb6b;\n      --token-attr-value: #a5e844;\n      --token-attribute: #a5e844;\n      --token-boolean: #c792ea;\n      --token-builtin: #ffcb6b;\n      --token-cdata: #80cbc4;\n      --token-char: #80cbc4;\n      --token-class: #ffcb6b;\n      --token-class-name: #f2ff00;\n      --token-comment: #616161;\n      --token-constant: #c792ea;\n      --token-deleted: #f66;\n      --token-doctype: #616161;\n      --token-entity: #f66;\n      --token-function: #c792ea;\n      --token-hexcode: #f2ff00;\n      --token-id: #c792ea;\n      --token-important: #c792ea;\n      --token-inserted: #80cbc4;\n      --token-keyword: #c792ea;\n      --token-number: #fd9170;\n      --token-operator: #89ddff;\n      --token-prolog: #616161;\n      --token-property: #80cbc4;\n      --token-pseudo-class: #a5e844;\n      --token-pseudo-element: #a5e844;\n      --token-punctuation: #89ddff;\n      --token-regex: #f2ff00;\n      --token-selector: #f66;\n      --token-string: #a5e844;\n      --token-symbol: #c792ea;\n      --token-tag: #f66;\n      --token-unit: #fd9170;\n      --token-url: #f66;\n      --token-variable: #f66;\n    }\n  `;\n\n  const style = createMemo(() => `${isDark() ? darkCss : ''}${baseCss}`);\n\n  return style;\n}, getOwner());\n\nexport default prismCss;\n"],"names":["createMemo","createRoot","getOwner","css","theme","prismCss","isDark","baseCss","darkCss"],"mappings":"AAAA,OAASA,cAAAA,CAAU,CAAEC,cAAAA,CAAU,CAAEC,YAAAA,CAAQ,KAAQ,UAAW,AAC5D,QAASC,OAAAA,CAAG,KAAQ,aAAc,AAClC,QAAOC,MAAW,UAAW,CAE7B,IAAMC,EAAWJ,EAAW,KAC1B,GAAM,CAAEK,OAAAA,CAAM,CAAE,CAAGF,EACbG,EAAUJ,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2bpB,CAAC,CACKK,EAAUL,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0CpB,CAAC,CAID,OAFcH,EAAW,IAAM,CAAC,EAAEM,IAAWE,EAAU,GAAG,EAAED,EAAQ,CAAC,CAGvE,EAAGL,IAEH,gBAAeG,CAAS"}

package/es/select/index.js

@@ -1,2 +1,2 @@
-function e(){return(e=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}import{use as t}from"solid-js/web";import{template as n}from"solid-js/web";import{setAttribute as r}from"solid-js/web";import{mergeProps as o}from"solid-js/web";import"solid-js/web";import{insert as l}from"solid-js/web";import{getOwner as i}from"solid-js/web";import{effect as a}from"solid-js/web";import{delegateEvents as s}from"solid-js/web";import{createComponent as d}from"solid-js/web";import{className as c}from"solid-js/web";import{addEventListener as u}from"solid-js/web";let p=n('<span class="prefix">'),v=n('<label class="label">'),f=n('<span class="suffix">'),m=n('<div class="select"><div class="tags">'),g=n("<span>"),b=n('<span class="placeholder">'),h=n("<n-tag>",!0,!1);import{For as w,Show as $,batch as _,createComponent as y,createEffect as j,createMemo as x,createSignal as A,mergeProps as C,onMount as O,splitProps as k,untrack as I}from"solid-js";import E from"@moneko/common/lib/isFunction";import{cx as N}from"@moneko/css";import{customElement as P}from"solid-element";import{style as D}from"./style";import{FieldName as L}from"../basic-config";import B,{defaultProps as F}from"../dropdown";import M from"../get-options";import"../tag";function S(e){let n,s;let[y,C]=k(e,["css","value","onChange","open","onOpenChange","label","prefixIcon","suffixIcon","placeholder","trigger","options"]),[P,F]=A(null),[S,U]=A([]),[V,W]=A(""),[q,z]=A([]),[G,H]=A({}),J=x(()=>Object.assign({},L,C.fieldNames));function K(e){C.disabled||(E(y.onOpenChange)&&y.onOpenChange(e),void 0===y.open&&F(e))}function Q(e){var t,r,o;(null==(t=e.target)?void 0:t.parentElement)===(null==(r=null==n?void 0:null==(o=n.parentNode)?void 0:o.parentNode)?void 0:r.activeElement)&&K(!I(P))}function R(e,t){void 0===y.value&&U(e?Array.isArray(e)?e:[e]:[]),E(y.onChange)&&y.onChange(e,t)}function T({key:e}){switch(e){case"ArrowDown":case"ArrowUp":break;case"Backspace":if(C.multiple){let e=[...I(S)];e.splice(-1,1),R(e,I(G)[I(S).length-1])}else R(void 0,I(G)[I(S)[0]]);break;case"Enter":K(!I(P));break;case"Escape":K(!1)}}function X(e){e.stopPropagation(),e.preventDefault()}function Y(e,t){X(t),R(I(S).filter(t=>t!==e),I(G)[e])}function Z(e){X(e),K(!0)}function ee(e){X(e),I(P)&&K(!1)}j(()=>{_(()=>{let e=J(),t=M(y.options,e);z(t),H(function e(t,n){let r={};for(let o=0,l=t.length;o<l;o++){let l=t[o],i=l[n.options];r[l[n.value]]=l,Array.isArray(i)&&Object.assign(r,e(i,n));let a=l[n.children];r[l[n.value]]=l,Array.isArray(a)&&Object.assign(r,e(a,n))}return r}(t,e))})}),j(()=>{_(()=>{y.open!==I(P)&&void 0!==y.open&&F(y.open),void 0!==y.value&&null!==y.value?U(Array.isArray(y.value)?y.value:[y.value]):U([])})}),O(()=>{if(void 0===y.value){let e=C.defaultValue;U(e?Array.isArray(e)?e:[e]:[])}}),j(()=>{y.label&&W(`.label {--x: ${(null==s?void 0:s.offsetLeft)||0}px; }`)});let et=x(()=>E(y.prefixIcon)?y.prefixIcon():y.prefixIcon),en=x(()=>E(y.label)?y.label():y.label),er=x(()=>E(y.suffixIcon)?y.suffixIcon():y.suffixIcon);return d(B,o({placement:"left",get css(){return D+V()+(y.css||"")},trigger:"none",get items(){return q()},get value(){return S()},onChange:R,get open(){return P()},onOpenChange:K},C,{get children(){let e=m(),o=n,_=e.firstChild,j=s;return u(e,"blur",ee),u(e,"focus",Z),u(e,"keydown",T,!0),"function"==typeof o?t(o,e):n=e,l(e,d($,{get when(){return et()},get children(){let e=p();return l(e,et),e}}),_),l(e,d($,{get when(){return en()},get children(){let e=v();return l(e,en),e}}),_),u(_,"mousedown",Q,!0),"function"==typeof j?t(j,_):s=_,l(_,d($,{get when(){return C.multiple},get fallback(){return d($,{get when(){return S().length},get fallback(){return d($,{get when(){return y.placeholder},get children(){let e=b();return l(e,()=>y.placeholder),e}})},get children(){let e=g();return l(e,()=>{var e;return(null==(e=G()[S()[0]])?void 0:e[J().label])||S()[0]}),a(()=>c(e,N("value",P()&&"opacity"))),e}})},get children(){return d(w,{get each(){return S()},get fallback(){return d($,{get when(){return y.placeholder},get children(){let e=b();return l(e,()=>y.placeholder),e}})},children:e=>(()=>{let t=h();return u(t,"close",Y.bind(null,e)),t._$owner=i(),l(t,()=>{var t;return(null==(t=G()[e])?void 0:t[J().label])||e}),a(n=>{var r,o,l,i,a;let s=N("tag",P()&&"opacity"),d=(null==(r=G()[e])?void 0:r.type)||"primary",u=null==(o=G()[e])?void 0:o.color,p=null==(l=G()[e])?void 0:l.icon,v=!C.disabled&&!(null==(i=G()[e])?void 0:i.disabled),f=C.disabled||(null==(a=G()[e])?void 0:a.disabled);return s!==n._v$3&&c(t,n._v$3=s),d!==n._v$4&&(t.type=n._v$4=d),u!==n._v$5&&(t.color=n._v$5=u),p!==n._v$6&&(t.icon=n._v$6=p),v!==n._v$7&&(t.closeIcon=n._v$7=v),f!==n._v$8&&(t.disabled=n._v$8=f),n},{_v$3:void 0,_v$4:void 0,_v$5:void 0,_v$6:void 0,_v$7:void 0,_v$8:void 0}),t})()})}})),l(e,d($,{get when(){return er()},get children(){let e=f();return l(e,er),e}}),null),a(t=>{let n=C.disabled?-1:0,o=C.disabled;return n!==t._v$&&r(e,"tabindex",t._v$=n),o!==t._v$2&&r(e,"aria-disabled",t._v$2=o),t},{_v$:void 0,_v$2:void 0}),e}}))}P("n-select",e({},F,{options:[],label:void 0,placeholder:"请选择",dropdownMatchSelectWidth:!0,prefixIcon:void 0,suffixIcon:void 0}),(e,t)=>{let n=t.element,r=C({onChange(e,t){n.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))},onOpenChange(e){n.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return j(()=>{n.removeAttribute("options"),n.removeAttribute("field-names"),n.removeAttribute("css")}),y(S,r)});export default S;s(["keydown","mousedown"]);
+function e(){return(e=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e}).apply(this,arguments)}import{use as t}from"solid-js/web";import{template as n}from"solid-js/web";import{setAttribute as r}from"solid-js/web";import{mergeProps as o}from"solid-js/web";import"solid-js/web";import{insert as l}from"solid-js/web";import{getOwner as i}from"solid-js/web";import{effect as a}from"solid-js/web";import{delegateEvents as s}from"solid-js/web";import{createComponent as d}from"solid-js/web";import{className as c}from"solid-js/web";import{addEventListener as u}from"solid-js/web";let p=n('<span class="prefix">'),v=n('<label class="label">'),f=n('<span class="suffix">'),m=n('<div class="select"><div class="tags">'),g=n("<span>"),b=n('<span class="placeholder">'),h=n("<n-tag>",!0,!1);import{For as w,Show as $,batch as _,createComponent as y,createEffect as j,createMemo as x,createSignal as A,mergeProps as C,onMount as O,splitProps as k,untrack as I}from"solid-js";import E from"@moneko/common/lib/isFunction";import{cx as N}from"@moneko/css";import{customElement as P}from"solid-element";import{style as D}from"./style";import{FieldName as L}from"../basic-config";import B,{defaultProps as F}from"../dropdown";import M from"../get-options";import"../tag";function S(e){let n,s;let[y,C]=k(e,["css","value","onChange","open","onOpenChange","label","prefixIcon","suffixIcon","placeholder","trigger","options"]),[P,F]=A(null),[S,U]=A([]),[V,W]=A(""),[q,z]=A([]),[G,H]=A({}),J=x(()=>Object.assign({},L,C.fieldNames));function K(e){C.disabled||(E(y.onOpenChange)&&y.onOpenChange(e),void 0===y.open&&F(e))}function Q(e){var t,r,o;(null==(t=e.target)?void 0:t.parentElement)===(null==n?void 0:null==(o=n.parentNode)?void 0:null==(r=o.parentNode)?void 0:r.activeElement)&&K(!I(P))}function R(e,t){void 0===y.value&&U(e?Array.isArray(e)?e:[e]:[]),E(y.onChange)&&y.onChange(e,t)}function T({key:e}){switch(e){case"ArrowDown":case"ArrowUp":break;case"Backspace":if(C.multiple){let e=[...I(S)];e.splice(-1,1),R(e,I(G)[I(S).length-1])}else R(void 0,I(G)[I(S)[0]]);break;case"Enter":K(!I(P));break;case"Escape":K(!1)}}function X(e){e.stopPropagation(),e.preventDefault()}function Y(e,t){X(t),R(I(S).filter(t=>t!==e),I(G)[e])}function Z(e){X(e),K(!0)}function ee(e){X(e),I(P)&&K(!1)}j(()=>{_(()=>{let e=J(),t=M(y.options,e);z(t),H(function e(t,n){let r={};for(let o=0,l=t.length;o<l;o++){let l=t[o],i=l[n.options];r[l[n.value]]=l,Array.isArray(i)&&Object.assign(r,e(i,n));let a=l[n.children];r[l[n.value]]=l,Array.isArray(a)&&Object.assign(r,e(a,n))}return r}(t,e))})}),j(()=>{_(()=>{y.open!==I(P)&&void 0!==y.open&&F(y.open),void 0!==y.value&&null!==y.value?U(Array.isArray(y.value)?y.value:[y.value]):U([])})}),O(()=>{if(void 0===y.value){let e=C.defaultValue;U(e?Array.isArray(e)?e:[e]:[])}}),j(()=>{y.label&&W(`.label {--x: ${(null==s?void 0:s.offsetLeft)||0}px; }`)});let et=x(()=>E(y.prefixIcon)?y.prefixIcon():y.prefixIcon),en=x(()=>E(y.label)?y.label():y.label),er=x(()=>E(y.suffixIcon)?y.suffixIcon():y.suffixIcon);return d(B,o({placement:"left",get css(){return D+V()+(y.css||"")},trigger:"none",get items(){return q()},get value(){return S()},onChange:R,get open(){return P()},onOpenChange:K},C,{get children(){let e=m(),o=n,_=e.firstChild,j=s;return u(e,"blur",ee),u(e,"focus",Z),u(e,"keydown",T,!0),"function"==typeof o?t(o,e):n=e,l(e,d($,{get when(){return et()},get children(){let e=p();return l(e,et),e}}),_),l(e,d($,{get when(){return en()},get children(){let e=v();return l(e,en),e}}),_),u(_,"mousedown",Q,!0),"function"==typeof j?t(j,_):s=_,l(_,d($,{get when(){return C.multiple},get fallback(){return d($,{get when(){return S().length},get fallback(){return d($,{get when(){return y.placeholder},get children(){let e=b();return l(e,()=>y.placeholder),e}})},get children(){let e=g();return l(e,()=>{var e;return(null==(e=G()[S()[0]])?void 0:e[J().label])||S()[0]}),a(()=>c(e,N("value",P()&&"opacity"))),e}})},get children(){return d(w,{get each(){return S()},get fallback(){return d($,{get when(){return y.placeholder},get children(){let e=b();return l(e,()=>y.placeholder),e}})},children:e=>(()=>{let t=h();return u(t,"close",Y.bind(null,e)),t._$owner=i(),l(t,()=>{var t;return(null==(t=G()[e])?void 0:t[J().label])||e}),a(n=>{var r,o,l,i,a;let s=N("tag",P()&&"opacity"),d=(null==(r=G()[e])?void 0:r.type)||"primary",u=null==(o=G()[e])?void 0:o.color,p=null==(l=G()[e])?void 0:l.icon,v=!C.disabled&&!(null==(i=G()[e])?void 0:i.disabled),f=C.disabled||(null==(a=G()[e])?void 0:a.disabled);return s!==n._v$3&&c(t,n._v$3=s),d!==n._v$4&&(t.type=n._v$4=d),u!==n._v$5&&(t.color=n._v$5=u),p!==n._v$6&&(t.icon=n._v$6=p),v!==n._v$7&&(t.closeIcon=n._v$7=v),f!==n._v$8&&(t.disabled=n._v$8=f),n},{_v$3:void 0,_v$4:void 0,_v$5:void 0,_v$6:void 0,_v$7:void 0,_v$8:void 0}),t})()})}})),l(e,d($,{get when(){return er()},get children(){let e=f();return l(e,er),e}}),null),a(t=>{let n=C.disabled?-1:0,o=C.disabled;return n!==t._v$&&r(e,"tabindex",t._v$=n),o!==t._v$2&&r(e,"aria-disabled",t._v$2=o),t},{_v$:void 0,_v$2:void 0}),e}}))}P("n-select",e({},F,{options:[],label:void 0,placeholder:"请选择",dropdownMatchSelectWidth:!0,prefixIcon:void 0,suffixIcon:void 0}),(e,t)=>{let n=t.element,r=C({onChange(e,t){n.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))},onOpenChange(e){n.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return j(()=>{n.removeAttribute("options"),n.removeAttribute("field-names"),n.removeAttribute("css")}),y(S,r)});export default S;s(["keydown","mousedown"]);
 //# sourceMappingURL=index.js.map

package/es/select/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/select/index.tsx"],"sourcesContent":["import {\n  For,\n  Show,\n  batch,\n  createComponent,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onMount,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { isFunction } from '@moneko/common';\nimport { cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { style } from './style';\nimport { FieldName } from '../basic-config';\nimport Dropdown, { defaultProps } from '../dropdown';\nimport getOptions from '../get-options';\nimport '../tag';\nimport type { CustomElement, DropdownMultipleProps, DropdownProps, MenuOption } from '..';\n\nfunction Select(props: SelectProps) {\n  const [local, other] = splitProps(props, [\n    'css',\n    'value',\n    'onChange',\n    'open',\n    'onOpenChange',\n    'label',\n    'prefixIcon',\n    'suffixIcon',\n    'placeholder',\n    'trigger',\n    'options',\n  ]);\n  let ref: HTMLInputElement | undefined;\n  let tagsRef: HTMLDivElement | undefined;\n  const [open, setOpen] = createSignal<boolean | null>(null);\n  const [value, setValue] = createSignal<(string | number)[]>([]);\n  const [x, setX] = createSignal<string>('');\n  const [options, setOptions] = createSignal<MenuOption[]>([]);\n  const [kv, setKv] = createSignal<Record<string, MenuOption>>({});\n\n  const fieldNames = createMemo(() => Object.assign({}, FieldName, other.fieldNames));\n\n  function getKv(arr: MenuOption[], fieldDic: typeof FieldName) {\n    const optKv: Record<string, MenuOption> = {};\n\n    for (let i = 0, len = arr.length; i < len; i++) {\n      const item = arr[i];\n      const _options = item[fieldDic.options];\n\n      optKv[item[fieldDic.value]!] = item;\n      if (Array.isArray(_options)) {\n        Object.assign(optKv, getKv(_options as MenuOption[], fieldDic));\n      }\n      const _children = item[fieldDic.children];\n\n      optKv[item[fieldDic.value]!] = item;\n      if (Array.isArray(_children)) {\n        Object.assign(optKv, getKv(_children as MenuOption[], fieldDic));\n      }\n    }\n    return optKv;\n  }\n\n  createEffect(() => {\n    batch(() => {\n      const fieldDic = fieldNames();\n      const opts = getOptions(local.options, fieldDic);\n\n      setOptions(opts);\n      setKv(getKv(opts, fieldDic));\n    });\n  });\n\n  function openChange(next: boolean | null) {\n    if (!other.disabled) {\n      if (isFunction(local.onOpenChange)) {\n        local.onOpenChange(next);\n      }\n      if (local.open === void 0) {\n        setOpen(next);\n      }\n    }\n  }\n  function click(e: MouseEvent) {\n    if (\n      (e.target as Element)?.parentElement ===\n      (ref?.parentNode?.parentNode as Document)?.activeElement\n    ) {\n      openChange(!untrack(open));\n    }\n  }\n  function onChange(val: (string | number)[] | string | number | undefined, item: MenuOption) {\n    if (local.value === void 0) {\n      setValue(val ? (Array.isArray(val) ? val : [val]) : []);\n    }\n    if (isFunction(local.onChange)) {\n      local.onChange(val, item);\n    }\n  }\n  function keyDown({ key }: { key: string }) {\n    switch (key) {\n      case 'ArrowDown':\n        // console.log(key);\n        // Object.keys(state.current.kv).indexOf(state.current.value)\n        break;\n      case 'ArrowUp':\n        break;\n      case 'Backspace':\n        if (other.multiple) {\n          const old = [...untrack(value)];\n\n          old.splice(-1, 1);\n          onChange(old, untrack(kv)[untrack(value).length - 1]);\n        } else {\n          onChange(void 0, untrack(kv)[untrack(value)[0]]);\n        }\n        break;\n      case 'Enter':\n        openChange(!untrack(open));\n        break;\n      case 'Escape':\n        openChange(false);\n        break;\n      default:\n        break;\n    }\n  }\n  function preventDefault(e: Event) {\n    e.stopPropagation();\n    e.preventDefault();\n  }\n  function deleteValue(v: string | number, e: CustomEvent) {\n    preventDefault(e);\n    onChange(untrack(value).filter((old) => old !== v) as never, untrack(kv)[v]);\n  }\n  function focus(e: FocusEvent | MouseEvent) {\n    preventDefault(e);\n    openChange(true);\n  }\n  function blur(e: FocusEvent) {\n    preventDefault(e);\n    if (untrack(open)) {\n      openChange(false);\n    }\n  }\n\n  createEffect(() => {\n    batch(() => {\n      if (local.open !== untrack(open) && local.open !== void 0) {\n        setOpen(local.open);\n      }\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  });\n  onMount(() => {\n    if (local.value === void 0) {\n      const val = other.defaultValue;\n\n      setValue(val ? (Array.isArray(val) ? val : [val]) : []);\n    }\n  });\n  createEffect(() => {\n    if (local.label) {\n      setX(`.label {--x: ${tagsRef?.offsetLeft || 0}px; }`);\n    }\n  });\n  const prefix = createMemo(() =>\n    isFunction(local.prefixIcon) ? (local.prefixIcon() as JSX.Element) : local.prefixIcon,\n  );\n  const label = createMemo(() =>\n    isFunction(local.label) ? (local.label() as JSX.Element) : local.label,\n  );\n  const suffix = createMemo(() =>\n    isFunction(local.suffixIcon) ? (local.suffixIcon() as JSX.Element) : local.suffixIcon,\n  );\n\n  return (\n    <Dropdown\n      placement=\"left\"\n      css={style + x() + (local.css || '')}\n      trigger=\"none\"\n      items={options()}\n      value={value() as unknown as string}\n      onChange={onChange}\n      open={open()}\n      onOpenChange={openChange}\n      {...other}\n    >\n      <div\n        ref={ref}\n        class=\"select\"\n        tabindex={other.disabled ? -1 : 0}\n        onKeyDown={keyDown}\n        onFocus={focus}\n        onBlur={blur}\n        aria-disabled={other.disabled}\n      >\n        <Show when={prefix()}>\n          <span class=\"prefix\">{prefix()}</span>\n        </Show>\n        <Show when={label()}>\n          <label class=\"label\">{label()}</label>\n        </Show>\n        <div class=\"tags\" ref={tagsRef} onMouseDown={click}>\n          <Show\n            when={other.multiple}\n            fallback={\n              <Show\n                when={value().length}\n                fallback={\n                  <Show when={local.placeholder}>\n                    <span class=\"placeholder\">{local.placeholder}</span>\n                  </Show>\n                }\n              >\n                <span class={cx('value', open() && 'opacity')}>\n                  {kv()[value()[0]]?.[fieldNames().label] || value()[0]}\n                </span>\n              </Show>\n            }\n          >\n            <For\n              each={value()}\n              fallback={\n                <Show when={local.placeholder}>\n                  <span class=\"placeholder\">{local.placeholder}</span>\n                </Show>\n              }\n            >\n              {(v) => (\n                <n-tag\n                  class={cx('tag', open() && 'opacity')}\n                  type={kv()[v]?.type || 'primary'}\n                  color={kv()[v]?.color}\n                  icon={kv()[v]?.icon}\n                  close-icon={!other.disabled && !kv()[v]?.disabled}\n                  onClose={deleteValue.bind(null, v)}\n                  disabled={other.disabled || kv()[v]?.disabled}\n                >\n                  {kv()[v]?.[fieldNames().label] || v}\n                </n-tag>\n              )}\n            </For>\n          </Show>\n        </div>\n        <Show when={suffix()}>\n          <span class=\"suffix\">{suffix()}</span>\n        </Show>\n      </div>\n    </Dropdown>\n  );\n}\n\n/** 通用API */\ninterface SelectBaseProps {\n  /** 占位符 */\n  placeholder?: string;\n  /** 选项 */\n  options?: (MenuOption | string | number)[];\n  /** 标题 */\n  label?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  /** 前缀图标 */\n  prefixIcon?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  /** 后缀图标 */\n  suffixIcon?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  style?: Record<string, string | number>;\n}\n\n/** 单选 */\nexport interface SelectProps extends Omit<DropdownProps, 'items' | 'children'>, SelectBaseProps {\n  /** 值 */\n  value?: string | number;\n}\n\n/** 多选 */\nexport interface SelectMultipleProps\n  extends Omit<DropdownMultipleProps, 'items' | 'children'>,\n    SelectBaseProps {\n  /** 值\n   * @default []\n   */\n  value?: (string | number)[];\n}\nexport type SelectElement = CustomElement<SelectProps, 'onChange' | 'onOpenChange'>;\nexport type SelectMultipleElement = CustomElement<SelectMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<SelectProps>(\n  'n-select',\n  {\n    ...defaultProps,\n    options: [],\n    label: void 0,\n    placeholder: '请选择',\n    dropdownMatchSelectWidth: true,\n    prefixIcon: void 0,\n    suffixIcon: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onChange(key: string | number, item: MenuOption) {\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: [key, item],\n            }),\n          );\n        },\n        onOpenChange(open: boolean | null) {\n          el.dispatchEvent(\n            new CustomEvent('openchange', {\n              detail: open,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      el.removeAttribute('options');\n      el.removeAttribute('field-names');\n      el.removeAttribute('css');\n    });\n    return createComponent(Select, props);\n  },\n);\nexport default Select;\n"],"names":["For","Show","batch","createComponent","createEffect","createMemo","createSignal","mergeProps","onMount","splitProps","untrack","isFunction","cx","customElement","style","FieldName","Dropdown","defaultProps","getOptions","Select","props","ref","tagsRef","local","other","open","setOpen","value","setValue","x","setX","options","setOptions","kv","setKv","fieldNames","Object","assign","openChange","next","disabled","onOpenChange","click","e","target","parentElement","parentNode","activeElement","onChange","val","item","Array","isArray","keyDown","key","multiple","old","splice","length","preventDefault","stopPropagation","deleteValue","v","filter","focus","blur","fieldDic","opts","getKv","arr","optKv","i","len","_options","_children","children","defaultValue","label","offsetLeft","prefix","prefixIcon","suffix","suffixIcon","css","placeholder","bind","type","color","icon","dropdownMatchSelectWidth","_","opt","el","element","dispatchEvent","CustomEvent","detail","removeAttribute"],"mappings":"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"}
+{"version":3,"sources":["../../components/select/index.tsx"],"sourcesContent":["import {\n  For,\n  Show,\n  batch,\n  createComponent,\n  createEffect,\n  createMemo,\n  createSignal,\n  mergeProps,\n  onMount,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { isFunction } from '@moneko/common';\nimport { cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { style } from './style';\nimport { FieldName } from '../basic-config';\nimport Dropdown, { defaultProps } from '../dropdown';\nimport getOptions from '../get-options';\nimport '../tag';\nimport type { CustomElement, DropdownMultipleProps, DropdownProps, MenuOption } from '..';\n\nfunction Select(props: SelectProps) {\n  const [local, other] = splitProps(props, [\n    'css',\n    'value',\n    'onChange',\n    'open',\n    'onOpenChange',\n    'label',\n    'prefixIcon',\n    'suffixIcon',\n    'placeholder',\n    'trigger',\n    'options',\n  ]);\n  let ref: HTMLInputElement | undefined;\n  let tagsRef: HTMLDivElement | undefined;\n  const [open, setOpen] = createSignal<boolean | null>(null);\n  const [value, setValue] = createSignal<(string | number)[]>([]);\n  const [x, setX] = createSignal<string>('');\n  const [options, setOptions] = createSignal<MenuOption[]>([]);\n  const [kv, setKv] = createSignal<Record<string, MenuOption>>({});\n\n  const fieldNames = createMemo(() => Object.assign({}, FieldName, other.fieldNames));\n\n  function getKv(arr: MenuOption[], fieldDic: typeof FieldName) {\n    const optKv: Record<string, MenuOption> = {};\n\n    for (let i = 0, len = arr.length; i < len; i++) {\n      const item = arr[i];\n      const _options = item[fieldDic.options];\n\n      optKv[item[fieldDic.value]!] = item;\n      if (Array.isArray(_options)) {\n        Object.assign(optKv, getKv(_options as MenuOption[], fieldDic));\n      }\n      const _children = item[fieldDic.children];\n\n      optKv[item[fieldDic.value]!] = item;\n      if (Array.isArray(_children)) {\n        Object.assign(optKv, getKv(_children as MenuOption[], fieldDic));\n      }\n    }\n    return optKv;\n  }\n\n  createEffect(() => {\n    batch(() => {\n      const fieldDic = fieldNames();\n      const opts = getOptions(local.options, fieldDic);\n\n      setOptions(opts);\n      setKv(getKv(opts, fieldDic));\n    });\n  });\n\n  function openChange(next: boolean | null) {\n    if (!other.disabled) {\n      if (isFunction(local.onOpenChange)) {\n        local.onOpenChange(next);\n      }\n      if (local.open === void 0) {\n        setOpen(next);\n      }\n    }\n  }\n  function click(e: MouseEvent) {\n    if (\n      (e.target as Element)?.parentElement ===\n      (ref?.parentNode?.parentNode as Document)?.activeElement\n    ) {\n      openChange(!untrack(open));\n    }\n  }\n  function onChange(val: (string | number)[] | string | number | undefined, item: MenuOption) {\n    if (local.value === void 0) {\n      setValue(val ? (Array.isArray(val) ? val : [val]) : []);\n    }\n    if (isFunction(local.onChange)) {\n      local.onChange(val, item);\n    }\n  }\n  function keyDown({ key }: { key: string }) {\n    switch (key) {\n      case 'ArrowDown':\n        // console.log(key);\n        // Object.keys(state.current.kv).indexOf(state.current.value)\n        break;\n      case 'ArrowUp':\n        break;\n      case 'Backspace':\n        if (other.multiple) {\n          const old = [...untrack(value)];\n\n          old.splice(-1, 1);\n          onChange(old, untrack(kv)[untrack(value).length - 1]);\n        } else {\n          onChange(void 0, untrack(kv)[untrack(value)[0]]);\n        }\n        break;\n      case 'Enter':\n        openChange(!untrack(open));\n        break;\n      case 'Escape':\n        openChange(false);\n        break;\n      default:\n        break;\n    }\n  }\n  function preventDefault(e: Event) {\n    e.stopPropagation();\n    e.preventDefault();\n  }\n  function deleteValue(v: string | number, e: CustomEvent) {\n    preventDefault(e);\n    onChange(untrack(value).filter((old) => old !== v) as never, untrack(kv)[v]);\n  }\n  function focus(e: FocusEvent | MouseEvent) {\n    preventDefault(e);\n    openChange(true);\n  }\n  function blur(e: FocusEvent) {\n    preventDefault(e);\n    if (untrack(open)) {\n      openChange(false);\n    }\n  }\n\n  createEffect(() => {\n    batch(() => {\n      if (local.open !== untrack(open) && local.open !== void 0) {\n        setOpen(local.open);\n      }\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  });\n  onMount(() => {\n    if (local.value === void 0) {\n      const val = other.defaultValue;\n\n      setValue(val ? (Array.isArray(val) ? val : [val]) : []);\n    }\n  });\n  createEffect(() => {\n    if (local.label) {\n      setX(`.label {--x: ${tagsRef?.offsetLeft || 0}px; }`);\n    }\n  });\n  const prefix = createMemo(() =>\n    isFunction(local.prefixIcon) ? (local.prefixIcon() as JSX.Element) : local.prefixIcon,\n  );\n  const label = createMemo(() =>\n    isFunction(local.label) ? (local.label() as JSX.Element) : local.label,\n  );\n  const suffix = createMemo(() =>\n    isFunction(local.suffixIcon) ? (local.suffixIcon() as JSX.Element) : local.suffixIcon,\n  );\n\n  return (\n    <Dropdown\n      placement=\"left\"\n      css={style + x() + (local.css || '')}\n      trigger=\"none\"\n      items={options()}\n      value={value() as unknown as string}\n      onChange={onChange}\n      open={open()}\n      onOpenChange={openChange}\n      {...other}\n    >\n      <div\n        ref={ref}\n        class=\"select\"\n        tabindex={other.disabled ? -1 : 0}\n        onKeyDown={keyDown}\n        onFocus={focus}\n        onBlur={blur}\n        aria-disabled={other.disabled}\n      >\n        <Show when={prefix()}>\n          <span class=\"prefix\">{prefix()}</span>\n        </Show>\n        <Show when={label()}>\n          <label class=\"label\">{label()}</label>\n        </Show>\n        <div class=\"tags\" ref={tagsRef} onMouseDown={click}>\n          <Show\n            when={other.multiple}\n            fallback={\n              <Show\n                when={value().length}\n                fallback={\n                  <Show when={local.placeholder}>\n                    <span class=\"placeholder\">{local.placeholder}</span>\n                  </Show>\n                }\n              >\n                <span class={cx('value', open() && 'opacity')}>\n                  {kv()[value()[0]]?.[fieldNames().label] || value()[0]}\n                </span>\n              </Show>\n            }\n          >\n            <For\n              each={value()}\n              fallback={\n                <Show when={local.placeholder}>\n                  <span class=\"placeholder\">{local.placeholder}</span>\n                </Show>\n              }\n            >\n              {(v) => (\n                <n-tag\n                  class={cx('tag', open() && 'opacity')}\n                  type={kv()[v]?.type || 'primary'}\n                  color={kv()[v]?.color}\n                  icon={kv()[v]?.icon}\n                  close-icon={!other.disabled && !kv()[v]?.disabled}\n                  onClose={deleteValue.bind(null, v)}\n                  disabled={other.disabled || kv()[v]?.disabled}\n                >\n                  {kv()[v]?.[fieldNames().label] || v}\n                </n-tag>\n              )}\n            </For>\n          </Show>\n        </div>\n        <Show when={suffix()}>\n          <span class=\"suffix\">{suffix()}</span>\n        </Show>\n      </div>\n    </Dropdown>\n  );\n}\n\n/** 通用API */\ninterface SelectBaseProps {\n  /** 占位符 */\n  placeholder?: string;\n  /** 选项 */\n  options?: (MenuOption | string | number)[];\n  /** 标题 */\n  label?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  /** 前缀图标 */\n  prefixIcon?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  /** 后缀图标 */\n  suffixIcon?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  style?: Record<string, string | number>;\n}\n\n/** 单选 */\nexport interface SelectProps extends Omit<DropdownProps, 'items' | 'children'>, SelectBaseProps {\n  /** 值 */\n  value?: string | number;\n}\n\n/** 多选 */\nexport interface SelectMultipleProps\n  extends Omit<DropdownMultipleProps, 'items' | 'children'>,\n    SelectBaseProps {\n  /** 值\n   * @default []\n   */\n  value?: (string | number)[];\n}\nexport type SelectElement = CustomElement<SelectProps, 'onChange' | 'onOpenChange'>;\nexport type SelectMultipleElement = CustomElement<SelectMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<SelectProps>(\n  'n-select',\n  {\n    ...defaultProps,\n    options: [],\n    label: void 0,\n    placeholder: '请选择',\n    dropdownMatchSelectWidth: true,\n    prefixIcon: void 0,\n    suffixIcon: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onChange(key: string | number, item: MenuOption) {\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: [key, item],\n            }),\n          );\n        },\n        onOpenChange(open: boolean | null) {\n          el.dispatchEvent(\n            new CustomEvent('openchange', {\n              detail: open,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      el.removeAttribute('options');\n      el.removeAttribute('field-names');\n      el.removeAttribute('css');\n    });\n    return createComponent(Select, props);\n  },\n);\nexport default Select;\n"],"names":["For","Show","batch","createComponent","createEffect","createMemo","createSignal","mergeProps","onMount","splitProps","untrack","isFunction","cx","customElement","style","FieldName","Dropdown","defaultProps","getOptions","Select","props","ref","tagsRef","local","other","open","setOpen","value","setValue","x","setX","options","setOptions","kv","setKv","fieldNames","Object","assign","openChange","next","disabled","onOpenChange","click","e","target","parentElement","parentNode","activeElement","onChange","val","item","Array","isArray","keyDown","key","multiple","old","splice","length","preventDefault","stopPropagation","deleteValue","v","filter","focus","blur","fieldDic","opts","getKv","arr","optKv","i","len","_options","_children","children","defaultValue","label","offsetLeft","prefix","prefixIcon","suffix","suffixIcon","css","placeholder","bind","type","color","icon","dropdownMatchSelectWidth","_","opt","el","element","dispatchEvent","CustomEvent","detail","removeAttribute"],"mappings":"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"}

package/es/theme/index.js

@@ -1,10 +1,10 @@
-var e;import{createEffect as r,createMemo as o,createRoot as a,createSignal as n,getOwner as t}from"solid-js";import i from"@moneko/common/lib/colorParse";import m from"@moneko/common/lib/mixColor";import s from"@moneko/common/lib/toneColor";import{css as l}from"@moneko/css";export{toneColor}from"@moneko/common";export function generateTheme(e,r){let o=s(e,null==r?void 0:r.dark),a=i(o[5]),n=i(e);return{[`--${r.name}-text`]:a.setAlpha(.65).toRgbaString(),[`--${r.name}-secondary`]:a.setAlpha(.45).toRgbaString(),[`--${r.name}-heading`]:o[5],[`--${r.name}-active`]:o[30],[`--${r.name}-color`]:o[40],[`--${r.name}-hover`]:m(o[40],o[30],15),[`--${r.name}-secondary-bg`]:o[70],[`--${r.name}-border`]:o[80],[`--${r.name}-outline`]:m(o[90],o[40],5),[`--${r.name}-selection`]:o[90],[`--on-${r.name}-selection`]:o[10],[`--${r.name}-shadow`]:n.setAlpha(.12).toRgbaString(),[`--${r.name}-details-bg`]:o[95],[`--${r.name}-component-bg`]:o[98],[`--${r.name}-bg`]:o[99],[`--on-${r.name}-bg`]:o[5],[`--${r.name}-base-shadow`]:`0 3px 6px -4px ${n.setAlpha(.12).toRgbaString()}, 0 6px 16px 0 ${n.setAlpha(.08).toRgbaString()}, 0 9px 28px 8px ${n.setAlpha(.05).toRgbaString()}`}}export var ColorScheme;(e=ColorScheme||(ColorScheme={})).light="light",e.dark="dark",e.auto="auto";export default a(function(){let e=ColorScheme[localStorage.getItem("color-scheme")]||"auto",a=window.matchMedia("(prefers-color-scheme: dark)"),[t,i]=n(e),[m,s]=n(a.matches),[c,g]=n({primary:"#5794ff",warning:"#faad14",error:"#ff4d4f",success:"#52c41a"}),[b,d]=n({primary:"#4d81dc",warning:"#bb8314",error:"#901c22",success:"#419418"}),p=o(()=>generateTheme(c().primary,{name:"primary"})),h=o(()=>generateTheme(c().warning,{name:"warning"})),x=o(()=>generateTheme(c().success,{name:"success"})),u=o(()=>generateTheme(c().error,{name:"error"})),f=o(()=>l`
+var e;import{createEffect as o,createMemo as r,createRoot as a,createSignal as n,getOwner as t}from"solid-js";import i from"@moneko/common/lib/colorParse";import m from"@moneko/common/lib/mixColor";import s from"@moneko/common/lib/toneColor";import{css as l}from"@moneko/css";export{toneColor}from"@moneko/common";export function generateTheme(e,o){let r=s(e,null==o?void 0:o.dark),a=i(r[5]),n=i(e);return{[`--${o.name}-text`]:a.setAlpha(.65).toRgbaString(),[`--${o.name}-secondary`]:a.setAlpha(.45).toRgbaString(),[`--${o.name}-heading`]:r[5],[`--${o.name}-active`]:r[30],[`--${o.name}-color`]:r[40],[`--${o.name}-hover`]:m(r[40],r[30],15),[`--${o.name}-secondary-bg`]:r[70],[`--${o.name}-border`]:r[80],[`--${o.name}-outline`]:m(r[90],r[40],5),[`--${o.name}-selection`]:r[90],[`--${o.name}-notify-bg`]:i(r[90]).setAlpha(.8).toRgbaString(),[`--on-${o.name}-selection`]:r[10],[`--${o.name}-shadow`]:n.setAlpha(.12).toRgbaString(),[`--${o.name}-details-bg`]:r[95],[`--${o.name}-component-bg`]:r[98],[`--${o.name}-bg`]:r[99],[`--on-${o.name}-bg`]:r[5],[`--${o.name}-base-shadow`]:`0 3px 6px -4px ${n.setAlpha(.12).toRgbaString()}, 0 6px 16px 0 ${n.setAlpha(.08).toRgbaString()}, 0 9px 28px 8px ${n.setAlpha(.05).toRgbaString()}`}}export var ColorScheme;(e=ColorScheme||(ColorScheme={})).light="light",e.dark="dark",e.auto="auto";export default a(function(){let e=ColorScheme[localStorage.getItem("color-scheme")]||"auto",a=window.matchMedia("(prefers-color-scheme: dark)"),[t,i]=n(e),[m,s]=n(a.matches),[c,g]=n({primary:"#5794ff",warning:"#faad14",error:"#ff4d4f",success:"#52c41a"}),[b,d]=n({primary:"#4d81dc",warning:"#bb8314",error:"#901c22",success:"#419418"}),p=r(()=>generateTheme(c().primary,{name:"primary"})),h=r(()=>generateTheme(c().warning,{name:"warning"})),x=r(()=>generateTheme(c().success,{name:"success"})),f=r(()=>generateTheme(c().error,{name:"error"})),$=r(()=>l`
       :root,
       :host {
         ${p()}
         ${h()}
         ${x()}
-        ${u()}
+        ${f()}
         --bg: transparent;
         --disable-color: rgb(0 0 0 / 25%);
         --disable-bg: rgb(0 0 0 / 4%);
@@ -12,10 +12,10 @@ var e;import{createEffect as r,createMemo as o,createRoot as a,createSignal as n
         --border-color: var(--primary-border);
         --component-bg: var(--primary-bg);
       }
-    `),$=o(()=>generateTheme(b().primary,{name:"primary",dark:!0})),y=o(()=>generateTheme(b().warning,{name:"warning",dark:!0})),v=o(()=>generateTheme(b().success,{name:"success",dark:!0})),S=o(()=>generateTheme(b().error,{name:"error",dark:!0})),k=o(()=>l`
+    `),u=r(()=>generateTheme(b().primary,{name:"primary",dark:!0})),y=r(()=>generateTheme(b().warning,{name:"warning",dark:!0})),v=r(()=>generateTheme(b().success,{name:"success",dark:!0})),S=r(()=>generateTheme(b().error,{name:"error",dark:!0})),k=r(()=>l`
       :root,
       :host {
-        ${$()}
+        ${u()}
         ${y()}
         ${S()}
         ${v()}
@@ -29,6 +29,7 @@ var e;import{createEffect as r,createMemo as o,createRoot as a,createSignal as n
         --primary-selection: rgb(255 255 255 / 5%);
         --primary-details-bg: rgb(255 255 255 / 3%);
         --primary-component-bg: #000;
+        --modal-component-bg: rgb(30 30 30 / 80%);
       }
     `),w=l`
     :root,
@@ -45,9 +46,10 @@ var e;import{createEffect as r,createMemo as o,createRoot as a,createSignal as n
       --text-selection: var(--primary-selection);
       --box-shadow-base: var(--primary-base-shadow);
       --transition-duration: 0.3s;
-      --mask-bg: rgb(0 0 0 / 30%);
-
-      /* --transition-timing-function: cubic-bezier(0.94, -0.1, 0.1, 1.2); */
+      --mask-bg: rgb(0 0 0 / 5%);
+      --modal-component-bg: rgb(255 255 255 / 80%);
+      --modal-box-shadow: 0 5px 35px rgb(0 0 0 / 10%);
+      --notification-box-shadow: 0 4px 16px rgb(0 0 0 / 5%);
       --transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
 
       font-size: var(--font-size);
@@ -71,5 +73,5 @@ var e;import{createEffect as r,createMemo as o,createRoot as a,createSignal as n
       inline-size: 4px;
       block-size: 4px;
     }
-  `;function z(e){s(e.matches)}r(()=>{let e=t();s("dark"===e||"auto"===e&&a.matches)});let C=o(()=>w+(m()?k():f()));return r(()=>{"auto"===t()?a.addEventListener("change",z):a.removeEventListener("change",z),localStorage.setItem("color-scheme",t())}),{baseStyle:C,dark:b,setDark:d,light:c,setLight:g,scheme:t,setScheme:i,isDark:m}},t());
+  `;function C(e){s(e.matches)}o(()=>{let e=t();s("dark"===e||"auto"===e&&a.matches)});let z=r(()=>w+(m()?k():$()));return o(()=>{"auto"===t()?a.addEventListener("change",C):a.removeEventListener("change",C),localStorage.setItem("color-scheme",t())}),{baseStyle:z,dark:b,setDark:d,light:c,setLight:g,scheme:t,setScheme:i,isDark:m}},t());
 //# sourceMappingURL=index.js.map

package/es/theme/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/theme/index.ts"],"sourcesContent":["import {\n  type Accessor,\n  type Setter,\n  createEffect,\n  createMemo,\n  createRoot,\n  createSignal,\n  getOwner,\n} from 'solid-js';\nimport { colorParse, mixColor, toneColor } from '@moneko/common';\nimport { css } from '@moneko/css';\nexport { toneColor } from '@moneko/common';\n\n/** 生成主题色调\n * @param {string} base 基础颜色\n * @param {ThemeOption} option 配置项\n * @returns {Record<string, string>} 主题色调\n */\nexport function generateTheme(base: string, option: ThemeOption): Record<string, string> {\n  const obj = toneColor(base, option?.dark);\n  const textColor = colorParse(obj[5]);\n  const baseColor = colorParse(base);\n\n  return {\n    [`--${option.name}-text`]: textColor.setAlpha(0.65).toRgbaString(),\n    [`--${option.name}-secondary`]: textColor.setAlpha(0.45).toRgbaString(),\n    [`--${option.name}-heading`]: obj[5],\n    [`--${option.name}-active`]: obj[30],\n    [`--${option.name}-color`]: obj[40],\n    // [`--${option.name}-hover`]: obj[50],\n    [`--${option.name}-hover`]: mixColor(obj[40], obj[30], 15),\n    [`--${option.name}-secondary-bg`]: obj[70],\n    [`--${option.name}-border`]: obj[80],\n    // [`--${option.name}-outline`]: obj[90],\n    [`--${option.name}-outline`]: mixColor(obj[90], obj[40], 5),\n    [`--${option.name}-selection`]: obj[90],\n    [`--on-${option.name}-selection`]: obj[10],\n    [`--${option.name}-shadow`]: baseColor.setAlpha(0.12).toRgbaString(),\n    [`--${option.name}-details-bg`]: obj[95],\n    [`--${option.name}-component-bg`]: obj[98],\n    [`--${option.name}-bg`]: obj[99],\n    [`--on-${option.name}-bg`]: obj[5],\n    [`--${option.name}-base-shadow`]: `0 3px 6px -4px ${baseColor\n      .setAlpha(0.12)\n      .toRgbaString()}, 0 6px 16px 0 ${baseColor\n      .setAlpha(0.08)\n      .toRgbaString()}, 0 9px 28px 8px ${baseColor.setAlpha(0.05).toRgbaString()}`,\n  };\n}\n\n/** 颜色模式 */\nexport enum ColorScheme {\n  /** 明亮 */\n  light = 'light',\n  /** 暗黑 */\n  dark = 'dark',\n  /** 跟随系统 */\n  auto = 'auto',\n}\n\nfunction createTheme() {\n  const preset =\n    ColorScheme[localStorage.getItem('color-scheme') as keyof typeof ColorScheme] || 'auto';\n  /** 检测 prefers-color-scheme 媒体查询是否为 light 模式 */\n  const media = window.matchMedia('(prefers-color-scheme: dark)');\n  const [scheme, setScheme] = createSignal<keyof typeof ColorScheme>(preset);\n  const [isDark, setIsDark] = createSignal(media.matches);\n  const [light, setLight] = createSignal({\n    primary: '#5794ff',\n    warning: '#faad14',\n    error: '#ff4d4f',\n    success: '#52c41a',\n  });\n  const [dark, setDark] = createSignal({\n    primary: '#4d81dc',\n    warning: '#bb8314',\n    error: '#901c22',\n    success: '#419418',\n  });\n  const primary = createMemo(() => generateTheme(light().primary, { name: 'primary' }));\n  const warning = createMemo(() => generateTheme(light().warning, { name: 'warning' }));\n  const success = createMemo(() => generateTheme(light().success, { name: 'success' }));\n  const error = createMemo(() => generateTheme(light().error, { name: 'error' }));\n  const lightCss = createMemo(() => {\n    return css`\n      :root,\n      :host {\n        ${primary()}\n        ${warning()}\n        ${success()}\n        ${error()}\n        --bg: transparent;\n        --disable-color: rgb(0 0 0 / 25%);\n        --disable-bg: rgb(0 0 0 / 4%);\n        --disable-border: #d9d9d9;\n        --border-color: var(--primary-border);\n        --component-bg: var(--primary-bg);\n      }\n    `;\n  });\n  const darkPrimary = createMemo(() =>\n    generateTheme(dark().primary, { name: 'primary', dark: true }),\n  );\n  const darkWarning = createMemo(() =>\n    generateTheme(dark().warning, { name: 'warning', dark: true }),\n  );\n  const darkSuccess = createMemo(() =>\n    generateTheme(dark().success, { name: 'success', dark: true }),\n  );\n  const darkError = createMemo(() => generateTheme(dark().error, { name: 'error', dark: true }));\n  const darkCss = createMemo(() => {\n    return css`\n      :root,\n      :host {\n        ${darkPrimary()}\n        ${darkWarning()}\n        ${darkError()}\n        ${darkSuccess()}\n        --bg: #1c1c1c;\n        --disable-color: rgb(255 255 255 / 25%);\n        --disable-bg: rgb(255 255 255 / 8%);\n        --disable-border: #424242;\n        --border-color: #303030;\n        --component-bg: #141414;\n        --primary-shadow: rgb(0 0 0 / 12%);\n        --primary-selection: rgb(255 255 255 / 5%);\n        --primary-details-bg: rgb(255 255 255 / 3%);\n        --primary-component-bg: #000;\n      }\n    `;\n  });\n  const baseCss = css`\n    :root,\n    :host {\n      --font-size: 14px;\n      --font-size-sm: 12px;\n      --font-size-xs: 10px;\n      --font-size-lg: 16px;\n      --border-base: 1px solid var(--border-color);\n      --border-radius: 8px;\n      --text-color: var(--primary-text);\n      --text-secondary: var(--primary-secondary);\n      --text-heading: var(--primary-heading);\n      --text-selection: var(--primary-selection);\n      --box-shadow-base: var(--primary-base-shadow);\n      --transition-duration: 0.3s;\n      --mask-bg: rgb(0 0 0 / 30%);\n\n      /* --transition-timing-function: cubic-bezier(0.94, -0.1, 0.1, 1.2); */\n      --transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n\n      font-size: var(--font-size);\n      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,\n        'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n        'Noto Color Emoji', Helvetica, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans';\n      color: var(--text-color, rgb(0 0 0 / 65%));\n      line-height: 1.8;\n    }\n\n    [disabled]:not([disabled='false']) {\n      cursor: not-allowed;\n      color: var(--disable-color);\n    }\n\n    ::selection {\n      background-color: var(--text-selection);\n    }\n\n    ::-webkit-scrollbar {\n      inline-size: 4px;\n      block-size: 4px;\n    }\n  `;\n\n  function update(e: MediaQueryListEvent) {\n    setIsDark(e.matches);\n  }\n  createEffect(() => {\n    const _ = scheme();\n\n    setIsDark(_ === 'dark' || (_ === 'auto' && media.matches));\n  });\n  const baseStyle = createMemo(() => baseCss + (isDark() ? darkCss() : lightCss()));\n\n  createEffect(() => {\n    if (scheme() === 'auto') {\n      // 监听 prefers-color-scheme 媒体查询变化，自动更新颜色方案\n      media.addEventListener('change', update);\n    } else {\n      media.removeEventListener('change', update);\n    }\n    localStorage.setItem('color-scheme', scheme());\n  });\n\n  return {\n    baseStyle,\n    dark,\n    setDark,\n    light,\n    setLight,\n    scheme,\n    setScheme,\n    isDark,\n  };\n}\n\n/** API */\nexport interface Theme {\n  /** 亮色样式的主要色 */\n  light: Accessor<Color>;\n  /** 设置亮色样式的主要色 */\n  setLight: Setter<Color>;\n  /** 黑色样式的主要色 */\n  dark: Accessor<Color>;\n  /** 设置黑色样式的主要色 */\n  setDark: Setter<Color>;\n  /** 颜色模式\n   * @default 'auto'\n   */\n  scheme: Accessor<keyof typeof ColorScheme>;\n  /** 设置颜色模式 */\n  setScheme: Setter<keyof typeof ColorScheme>;\n  /** 是否为色模式 */\n  isDark: Accessor<boolean>;\n  /** 基本都样式表, 响应 scheme 变化 */\n  baseStyle: Accessor<string>;\n}\n\n/** 主要色 */\ninterface Color {\n  /** 主要\n   * @default '#5794ff'\n   */\n  primary: string;\n  /** 警告\n   * @default '#faad14'\n   */\n  warning: string;\n  /** 错误\n   * @default '#ff4d4f'\n   */\n  error: string;\n  /** 成功\n   * @default '#52c41a'\n   */\n  success: string;\n}\n\nexport interface ThemeOption {\n  /** 是否采用暗色算法\n   * @default false\n   */\n  dark?: boolean;\n  /** 颜色名称 */\n  name: string;\n}\n\nexport default createRoot<Theme>(createTheme, getOwner());\n"],"names":["ColorScheme","createEffect","createMemo","createRoot","createSignal","getOwner","colorParse","mixColor","toneColor","css","generateTheme","base","option","obj","dark","textColor","baseColor","name","setAlpha","toRgbaString","preset","localStorage","getItem","media","window","matchMedia","scheme","setScheme","isDark","setIsDark","matches","light","setLight","primary","warning","error","success","setDark","lightCss","darkPrimary","darkWarning","darkSuccess","darkError","darkCss","baseCss","update","e","_","baseStyle","addEventListener","removeEventListener","setItem"],"mappings":"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"}
+{"version":3,"sources":["../../components/theme/index.ts"],"sourcesContent":["import {\n  type Accessor,\n  type Setter,\n  createEffect,\n  createMemo,\n  createRoot,\n  createSignal,\n  getOwner,\n} from 'solid-js';\nimport { colorParse, mixColor, toneColor } from '@moneko/common';\nimport { css } from '@moneko/css';\nexport { toneColor } from '@moneko/common';\n\n/** 生成主题色调\n * @param {string} base 基础颜色\n * @param {ThemeOption} option 配置项\n * @returns {Record<string, string>} 主题色调\n */\nexport function generateTheme(base: string, option: ThemeOption): Record<string, string> {\n  const obj = toneColor(base, option?.dark);\n  const textColor = colorParse(obj[5]);\n  const baseColor = colorParse(base);\n\n  return {\n    [`--${option.name}-text`]: textColor.setAlpha(0.65).toRgbaString(),\n    [`--${option.name}-secondary`]: textColor.setAlpha(0.45).toRgbaString(),\n    [`--${option.name}-heading`]: obj[5],\n    [`--${option.name}-active`]: obj[30],\n    [`--${option.name}-color`]: obj[40],\n    // [`--${option.name}-hover`]: obj[50],\n    [`--${option.name}-hover`]: mixColor(obj[40], obj[30], 15),\n    [`--${option.name}-secondary-bg`]: obj[70],\n    [`--${option.name}-border`]: obj[80],\n    // [`--${option.name}-outline`]: obj[90],\n    [`--${option.name}-outline`]: mixColor(obj[90], obj[40], 5),\n    [`--${option.name}-selection`]: obj[90],\n    [`--${option.name}-notify-bg`]: colorParse(obj[90]).setAlpha(0.8).toRgbaString(),\n    [`--on-${option.name}-selection`]: obj[10],\n    [`--${option.name}-shadow`]: baseColor.setAlpha(0.12).toRgbaString(),\n    [`--${option.name}-details-bg`]: obj[95],\n    [`--${option.name}-component-bg`]: obj[98],\n    [`--${option.name}-bg`]: obj[99],\n    [`--on-${option.name}-bg`]: obj[5],\n    [`--${option.name}-base-shadow`]: `0 3px 6px -4px ${baseColor\n      .setAlpha(0.12)\n      .toRgbaString()}, 0 6px 16px 0 ${baseColor\n      .setAlpha(0.08)\n      .toRgbaString()}, 0 9px 28px 8px ${baseColor.setAlpha(0.05).toRgbaString()}`,\n  };\n}\n\n/** 颜色模式 */\nexport enum ColorScheme {\n  /** 明亮 */\n  light = 'light',\n  /** 暗黑 */\n  dark = 'dark',\n  /** 跟随系统 */\n  auto = 'auto',\n}\n\nfunction createTheme() {\n  const preset =\n    ColorScheme[localStorage.getItem('color-scheme') as keyof typeof ColorScheme] || 'auto';\n  /** 检测 prefers-color-scheme 媒体查询是否为 light 模式 */\n  const media = window.matchMedia('(prefers-color-scheme: dark)');\n  const [scheme, setScheme] = createSignal<keyof typeof ColorScheme>(preset);\n  const [isDark, setIsDark] = createSignal(media.matches);\n  const [light, setLight] = createSignal({\n    primary: '#5794ff',\n    warning: '#faad14',\n    error: '#ff4d4f',\n    success: '#52c41a',\n  });\n  const [dark, setDark] = createSignal({\n    primary: '#4d81dc',\n    warning: '#bb8314',\n    error: '#901c22',\n    success: '#419418',\n  });\n  const primary = createMemo(() => generateTheme(light().primary, { name: 'primary' }));\n  const warning = createMemo(() => generateTheme(light().warning, { name: 'warning' }));\n  const success = createMemo(() => generateTheme(light().success, { name: 'success' }));\n  const error = createMemo(() => generateTheme(light().error, { name: 'error' }));\n  const lightCss = createMemo(() => {\n    return css`\n      :root,\n      :host {\n        ${primary()}\n        ${warning()}\n        ${success()}\n        ${error()}\n        --bg: transparent;\n        --disable-color: rgb(0 0 0 / 25%);\n        --disable-bg: rgb(0 0 0 / 4%);\n        --disable-border: #d9d9d9;\n        --border-color: var(--primary-border);\n        --component-bg: var(--primary-bg);\n      }\n    `;\n  });\n  const darkPrimary = createMemo(() =>\n    generateTheme(dark().primary, { name: 'primary', dark: true }),\n  );\n  const darkWarning = createMemo(() =>\n    generateTheme(dark().warning, { name: 'warning', dark: true }),\n  );\n  const darkSuccess = createMemo(() =>\n    generateTheme(dark().success, { name: 'success', dark: true }),\n  );\n  const darkError = createMemo(() => generateTheme(dark().error, { name: 'error', dark: true }));\n  const darkCss = createMemo(() => {\n    return css`\n      :root,\n      :host {\n        ${darkPrimary()}\n        ${darkWarning()}\n        ${darkError()}\n        ${darkSuccess()}\n        --bg: #1c1c1c;\n        --disable-color: rgb(255 255 255 / 25%);\n        --disable-bg: rgb(255 255 255 / 8%);\n        --disable-border: #424242;\n        --border-color: #303030;\n        --component-bg: #141414;\n        --primary-shadow: rgb(0 0 0 / 12%);\n        --primary-selection: rgb(255 255 255 / 5%);\n        --primary-details-bg: rgb(255 255 255 / 3%);\n        --primary-component-bg: #000;\n        --modal-component-bg: rgb(30 30 30 / 80%);\n      }\n    `;\n  });\n  const baseCss = css`\n    :root,\n    :host {\n      --font-size: 14px;\n      --font-size-sm: 12px;\n      --font-size-xs: 10px;\n      --font-size-lg: 16px;\n      --border-base: 1px solid var(--border-color);\n      --border-radius: 8px;\n      --text-color: var(--primary-text);\n      --text-secondary: var(--primary-secondary);\n      --text-heading: var(--primary-heading);\n      --text-selection: var(--primary-selection);\n      --box-shadow-base: var(--primary-base-shadow);\n      --transition-duration: 0.3s;\n      --mask-bg: rgb(0 0 0 / 5%);\n      --modal-component-bg: rgb(255 255 255 / 80%);\n      --modal-box-shadow: 0 5px 35px rgb(0 0 0 / 10%);\n      --notification-box-shadow: 0 4px 16px rgb(0 0 0 / 5%);\n      --transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n\n      font-size: var(--font-size);\n      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,\n        'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n        'Noto Color Emoji', Helvetica, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans';\n      color: var(--text-color, rgb(0 0 0 / 65%));\n      line-height: 1.8;\n    }\n\n    [disabled]:not([disabled='false']) {\n      cursor: not-allowed;\n      color: var(--disable-color);\n    }\n\n    ::selection {\n      background-color: var(--text-selection);\n    }\n\n    ::-webkit-scrollbar {\n      inline-size: 4px;\n      block-size: 4px;\n    }\n  `;\n\n  function update(e: MediaQueryListEvent) {\n    setIsDark(e.matches);\n  }\n  createEffect(() => {\n    const _ = scheme();\n\n    setIsDark(_ === 'dark' || (_ === 'auto' && media.matches));\n  });\n  const baseStyle = createMemo(() => baseCss + (isDark() ? darkCss() : lightCss()));\n\n  createEffect(() => {\n    if (scheme() === 'auto') {\n      // 监听 prefers-color-scheme 媒体查询变化，自动更新颜色方案\n      media.addEventListener('change', update);\n    } else {\n      media.removeEventListener('change', update);\n    }\n    localStorage.setItem('color-scheme', scheme());\n  });\n\n  return {\n    baseStyle,\n    dark,\n    setDark,\n    light,\n    setLight,\n    scheme,\n    setScheme,\n    isDark,\n  };\n}\n\n/** API */\nexport interface Theme {\n  /** 亮色样式的主要色 */\n  light: Accessor<Color>;\n  /** 设置亮色样式的主要色 */\n  setLight: Setter<Color>;\n  /** 黑色样式的主要色 */\n  dark: Accessor<Color>;\n  /** 设置黑色样式的主要色 */\n  setDark: Setter<Color>;\n  /** 颜色模式\n   * @default 'auto'\n   */\n  scheme: Accessor<keyof typeof ColorScheme>;\n  /** 设置颜色模式 */\n  setScheme: Setter<keyof typeof ColorScheme>;\n  /** 是否为色模式 */\n  isDark: Accessor<boolean>;\n  /** 基本都样式表, 响应 scheme 变化 */\n  baseStyle: Accessor<string>;\n}\n\n/** 主要色 */\ninterface Color {\n  /** 主要\n   * @default '#5794ff'\n   */\n  primary: string;\n  /** 警告\n   * @default '#faad14'\n   */\n  warning: string;\n  /** 错误\n   * @default '#ff4d4f'\n   */\n  error: string;\n  /** 成功\n   * @default '#52c41a'\n   */\n  success: string;\n}\n\nexport interface ThemeOption {\n  /** 是否采用暗色算法\n   * @default false\n   */\n  dark?: boolean;\n  /** 颜色名称 */\n  name: string;\n}\n\nexport default createRoot<Theme>(createTheme, getOwner());\n"],"names":["ColorScheme","createEffect","createMemo","createRoot","createSignal","getOwner","colorParse","mixColor","toneColor","css","generateTheme","base","option","obj","dark","textColor","baseColor","name","setAlpha","toRgbaString","preset","localStorage","getItem","media","window","matchMedia","scheme","setScheme","isDark","setIsDark","matches","light","setLight","primary","warning","error","success","setDark","lightCss","darkPrimary","darkWarning","darkSuccess","darkError","darkCss","baseCss","update","e","_","baseStyle","addEventListener","removeEventListener","setItem"],"mappings":"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"}

package/es/tree/index.d.ts

@@ -1,101 +1,5 @@
-import { type Schema } from '../from-schema';
-import type { BasicConfig, CustomElement } from '..';
-export interface TreeBaseProp {
-    /** 自定义类名 */
-    class?: string;
-    /** 自定义样式表 */
-    css?: string;
-    /** 尺寸
-     * @default 'normal'
-     */
-    size?: BasicConfig['size'];
-    /** 只读 */
-    readonly?: boolean;
-    /** 开启取消选中, 仅多选模式生效 */
-    toggle?: boolean;
-    /** 方向
-     * @default 'ltr'
-     */
-    direction?: 'rtl' | 'ltr';
-    /** 点击行时的回调函数 */
-    onRowClick?: (e: MouseEvent, key: string, item: TreeData) => void;
-    /** 双击行时的回调函数 */
-    onRowDoubleClick?: (e: MouseEvent, key: string, item: TreeData) => void;
-    /** 自定义渲染行 */
-    renderRow?: (item: TreeData, title: JSX.Element, subTitle?: JSX.Element) => JSX.Element[];
-    /** 开启此选项支持 `JSONSchema`
-     * @default false
-     */
-    fromSchema?: false;
-}
-interface TreeBaseProps extends TreeBaseProp {
-    /** 选中的值, 多选模式时为数组 */
-    value?: string;
-    /** 多选模式
-     * @default false
-     */
-    multiple?: false;
-    /** 选中的值发生修改时的回调函数, 多选模式时入参为数组 */
-    onChange?(key?: string, item?: TreeData): void;
-}
-interface TreeMultipleBaseProps extends TreeBaseProp {
-    /** 选中的值 */
-    value?: string[];
-    /** 多选模式
-     * @default true
-     */
-    multiple: true;
-    onChange?(key?: string[], item?: TreeData): void;
-}
-export interface TreeProps extends TreeBaseProps {
-    /** 数据源 */
-    data: TreeData[];
-}
-export interface TreeSchemaProps extends Omit<TreeBaseProps, 'fromSchema'> {
-    /** 开启此选项支持 `JSONSchema` */
-    fromSchema: true;
-    /** 数据源 */
-    data: Schema;
-}
-export interface TreeStringProps extends TreeBaseProps {
-    /** 数据源 */
-    data: string;
-}
-export interface TreeMultipleProps extends TreeMultipleBaseProps {
-    /** 数据源 */
-    data: TreeData[];
-}
-export interface TreeMultipleSchemaProps extends Omit<TreeMultipleBaseProps, 'fromSchema'> {
-    /** 开启此选项支持 `JSONSchema` */
-    fromSchema: true;
-    /** 数据源 */
-    data: Schema;
-}
-export interface TreeMultipleStringProps extends TreeMultipleBaseProps {
-    /** 数据源 */
-    data: string;
-}
+import './register';
+import type { TreeMultipleProps, TreeMultipleSchemaProps, TreeMultipleStringProps, TreeProps, TreeSchemaProps, TreeStringProps } from './type';
 declare function Tree(_: TreeProps | TreeMultipleProps | TreeMultipleSchemaProps | TreeSchemaProps | TreeMultipleStringProps | TreeStringProps): import("solid-js").JSX.Element;
-type CustomEvents = 'onChange' | 'onRowDoubleClick' | 'onRowClick';
-export type TreeElement = CustomElement<TreeProps, CustomEvents>;
-export type TreeSchemaElement = CustomElement<TreeSchemaProps, CustomEvents>;
-export type TreeStringElement = CustomElement<TreeStringProps, CustomEvents>;
-export type TreeMultipleElement = CustomElement<TreeMultipleProps, CustomEvents>;
-export type TreeMultipleSchemaElement = CustomElement<TreeMultipleSchemaProps, CustomEvents>;
-export type TreeMultipleStringElement = CustomElement<TreeMultipleStringProps, CustomEvents>;
-export interface TreeData<T = string> {
-    /** key(唯一值) */
-    key: T;
-    /** 属性 */
-    name?: string;
-    /** 标题 */
-    title?: string;
-    /** 副标题 */
-    subTitle?: string;
-    /** 详细描述 */
-    description?: string;
-    /** 子项 */
-    children?: TreeData<T>[];
-    [key: string | number | symbol]: T | string | number | symbol | boolean | TreeData<T>[] | undefined;
-}
+export * from './type';
 export default Tree;

package/es/tree/index.js

@@ -1,2 +1,2 @@
-import{use as e}from"solid-js/web";import{template as t}from"solid-js/web";import{style as l}from"solid-js/web";import{setAttribute as o}from"solid-js/web";import{memo as i}from"solid-js/web";import{insert as n}from"solid-js/web";import{effect as r}from"solid-js/web";import{delegateEvents as s}from"solid-js/web";import{createComponent as a}from"solid-js/web";import{className as m}from"solid-js/web";let d=t("<li>"),c=t('<span class="title">'),u=t('<span class="sub-title">'),p=t("<style>"),v=t("<ul>");import{For as h,createComponent as f,createEffect as g,createMemo as w,createSignal as b,mergeProps as y,onCleanup as k,onMount as $}from"solid-js";import C from"@moneko/common/lib/isFunction";import R from"@moneko/common/lib/isString";import j from"@moneko/common/lib/passiveSupported";import{css as _,cx as S}from"@moneko/css";import{customElement as E}from"solid-element";import{style as z}from"./style";import A from"../from-schema";import T from"../theme";function D(t){let s;let f={small:6,normal:8,large:10},{baseStyle:y}=T,[E,D]=b([]),[x,P]=b([]),B=w(()=>"rtl"===t.direction),L=w(()=>void 0!==t.value&&null!==t.value?Array.isArray(t.value)?t.value:[t.value]:[]),q=Symbol("path"),F=Symbol("path-end");function M(e){let l=e.length;if(s&&l){let o=f[t.size||"normal"];for(let t=0;t<l;t++){let l=s.querySelectorAll(`li[data-path="${e[t]}"]`);if(l.length){let e=l[0].getBoundingClientRect(),i=e.height/2+o;if(l.length>1){let{bottom:n,height:r,top:s}=l[1].getBoundingClientRect();i=0===t?s-e.top:n-e.top-r/2+o,l[1].style.setProperty("--c","none")}else 0===t&&l[0].style.setProperty("--c","none");(1!==l.length||0!==t)&&l[0].style.setProperty("--line",`${Math.abs(i)}px`)}}}}return g(()=>{let e=t.fromSchema?A(t.data):R(t.data)?function(e){let t=/[^\s|`│├└]/,l=e.trim().split("\n"),o=[{title:l[0],key:l[0]}];for(let e=1;e<l.length;e++){let i=l[e].search(t);if(-1===i)continue;let n={title:l[e].slice(i+3),depth:i};for(;o.length&&i<=(o[o.length-1].depth||0);)o.pop();if(!o.length)return[];let r=o[o.length-1];r.children||(r.children=[]),n.key=`${r.key}-${n.title}-${i}-${e}`,r.children.push(n),o.push(n)}return[o[0]]}(t.data):t.data;D([...new Set(function e(t,l=0){let o=t.length-1,i=t[o],n=t[0],r=[];for(let s=0,a=t.length;s<a;s++){let a=t[s],m=s===o;(0===s||m)&&(a[q]=n.key+(1===t.length?"":`>${i.key}`),m&&(a[F]=""),r.push(a[q])),a.children&&(r=r.concat(e(a.children,l+1)))}return r}(e))]),P(e)}),g(()=>{let e=E(),t=setTimeout(()=>{clearTimeout(t),M(e)},0);e.length&&window.addEventListener("resize",M.bind(null,e),{passive:j}),k(()=>{clearTimeout(t),window.removeEventListener("resize",M.bind(null,E()),!1)})}),$(()=>{let e=setTimeout(()=>{clearTimeout(e),M(E())},32)}),[(()=>{let e=p();return n(e,y,null),n(e,z,null),n(e,()=>_(t.css),null),e})(),(()=>{let p=v(),f=s;return"function"==typeof f?e(f,p):s=p,n(p,()=>(function e(s,p=0){return a(h,{each:s,children:s=>{let{name:a,title:v,subTitle:h,key:f,children:g}=s,w=a!==v&&a?[a,v]:[v];return[(()=>{let e=d();return e.$$dblclick=e=>null==t.onRowDoubleClick?void 0:t.onRowDoubleClick.call(t,e,f,s),e.$$click=e=>{(function(e,l){if(!t.readonly&&C(t.onChange)){let o=[...L()];if(t.multiple){let t=o.indexOf(e);-1===t?o.push(e):o.splice(t,1)}else o=t.toggle&&o[0]===e?[]:[e];t.onChange(t.multiple?o:o[0],l)}})(s.key,s),null==t.onRowClick||t.onRowClick.call(t,e,s.key,s)},n(e,()=>(function(e,l,o){let i=(null==t.renderRow?void 0:t.renderRow.call(t,e,l,o))||[l,o];return B()?i.reverse():i})(s,(()=>{let e=c();return n(e,()=>(B()?w.reverse():w).join(": ")),e})(),h&&(()=>{let e=u();return n(e,h),e})())),r(i=>{let n=S("row",L().includes(f)&&"active",(t.readonly||!C(t.onChange))&&"non"),r=p?{"--depth":`${2*p}em`}:void 0,a=s[F],d=s[q];return n!==i._v$&&m(e,i._v$=n),i._v$2=l(e,r,i._v$2),a!==i._v$3&&o(e,"data-path-end",i._v$3=a),d!==i._v$4&&o(e,"data-path",i._v$4=d),i},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0}),e})(),i(()=>g?e(g,p+1):null)]}})})(x())),r(()=>m(p,S("tree",t.size,t.class,B()&&"rtl"))),p})()]}E("n-tree",{fromSchema:void 0,size:void 0,data:[],multiple:void 0,value:void 0,onChange:void 0,class:void 0,css:void 0,readonly:void 0,toggle:void 0,direction:void 0,onRowClick:void 0,onRowDoubleClick:void 0,renderRow:void 0},(e,t)=>{let l=t.element,o=y({data:l.data,value:l.value,multiple:l.multiple,fromSchema:l.fromSchema,size:l.size,css:l.css,readonly:l.readonly,toggle:l.toggle,direction:l.direction,onChange(e,t){l.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))},onRowClick(e,t,o){l.dispatchEvent(new CustomEvent("rowclick",{detail:[e,t,o]}))},onRowDoubleClick(e,t,o){l.dispatchEvent(new CustomEvent("rowdoubleclick",{detail:[e,t,o]}))}},e);return g(()=>{l.removeAttribute("css"),l.removeAttribute("data")}),f(D,o)});export default D;s(["click","dblclick"]);
+import{use as e}from"solid-js/web";import{template as t}from"solid-js/web";import{style as l}from"solid-js/web";import{setAttribute as o}from"solid-js/web";import{memo as r}from"solid-js/web";import{insert as n}from"solid-js/web";import{effect as i}from"solid-js/web";import{delegateEvents as s}from"solid-js/web";import{createComponent as a}from"solid-js/web";import{className as m}from"solid-js/web";let c=t("<li>"),u=t('<span class="title">'),p=t('<span class="sub-title">'),d=t("<style>"),f=t("<ul>");import{For as h,createEffect as v,createMemo as g,createSignal as y}from"solid-js";import $ from"@moneko/common/lib/frameCallback";import b from"@moneko/common/lib/isFunction";import k from"@moneko/common/lib/isString";import{css as w,cx as j}from"@moneko/css";import"./register";import{style as _}from"./style";import C from"../from-schema";import R from"../theme";export*from"./type";export default function(t){let s;let S={small:6,normal:8,large:10},{baseStyle:x}=R,[A,P]=y([]),[z,B]=y([]),D=g(()=>"rtl"===t.direction),q=g(()=>void 0!==t.value&&null!==t.value?Array.isArray(t.value)?t.value:[t.value]:[]),E=Symbol("path"),F=Symbol("path-end");return v(()=>{let e=t.fromSchema?C(t.data):k(t.data)?function(e){let t=/[^\s|`│├└]/,l=e.trim().split("\n"),o=[{title:l[0],key:l[0]}];for(let e=1;e<l.length;e++){let r=l[e].search(t);if(-1===r)continue;let n={title:l[e].slice(r+3),depth:r};for(;o.length&&r<=(o[o.length-1].depth||0);)o.pop();if(!o.length)return[];let i=o[o.length-1];i.children||(i.children=[]),n.key=`${i.key}-${n.title}-${r}-${e}`,i.children.push(n),o.push(n)}return[o[0]]}(t.data):t.data;P([...new Set(function e(t,l=0){let o=t.length-1,r=t[o],n=t[0],i=[];for(let s=0,a=t.length;s<a;s++){let a=t[s],m=s===o;(0===s||m)&&(a[E]=n.key+(1===t.length?"":`>${r.key}`),m&&(a[F]=""),i.push(a[E])),a.children&&(i=i.concat(e(a.children,l+1)))}return i}(e))]),B(e)}),v(()=>{let e=A(),l=t.size||"normal";$(()=>{let t=e.length;if(s&&t){let o=S[l];for(let l=0;l<t;l++){let t=s.querySelectorAll(`li[data-path="${e[l]}"]`);if(t.length){let e=t[0].getBoundingClientRect(),r=e.height/2+o;if(t.length>1){let{bottom:n,height:i,top:s}=t[1].getBoundingClientRect();r=0===l?s-e.top:n-e.top-i/2+o,t[1].style.setProperty("--c","none")}else 0===l&&t[0].style.setProperty("--c","none");(1!==t.length||0!==l)&&t[0].style.setProperty("--line",`${Math.abs(r)}px`)}}}})}),[(()=>{let e=d();return n(e,x,null),n(e,_,null),n(e,()=>w(t.css),null),e})(),(()=>{let d=f(),v=s;return"function"==typeof v?e(v,d):s=d,n(d,()=>(function e(s,d=0){return a(h,{each:s,children:s=>{let{name:a,title:f,subTitle:h,key:v,children:g}=s,y=a!==f&&a?[a,f]:[f];return[(()=>{let e=c();return e.$$dblclick=e=>null==t.onRowDoubleClick?void 0:t.onRowDoubleClick.call(t,e,v,s),e.$$click=e=>{(function(e,l){if(!t.readonly&&b(t.onChange)){let o=[...q()];if(t.multiple){let t=o.indexOf(e);-1===t?o.push(e):o.splice(t,1)}else o=t.toggle&&o[0]===e?[]:[e];t.onChange(t.multiple?o:o[0],l)}})(s.key,s),null==t.onRowClick||t.onRowClick.call(t,e,s.key,s)},n(e,()=>(function(e,l,o){let r=(null==t.renderRow?void 0:t.renderRow.call(t,e,l,o))||[l,o];return D()?r.reverse():r})(s,(()=>{let e=u();return n(e,()=>(D()?y.reverse():y).join(": ")),e})(),h&&(()=>{let e=p();return n(e,h),e})())),i(r=>{let n=j("row",q().includes(v)&&"active",(t.readonly||!b(t.onChange))&&"non"),i=d?{"--depth":`${2*d}em`}:void 0,a=s[F],c=s[E];return n!==r._v$&&m(e,r._v$=n),r._v$2=l(e,i,r._v$2),a!==r._v$3&&o(e,"data-path-end",r._v$3=a),c!==r._v$4&&o(e,"data-path",r._v$4=c),r},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0}),e})(),r(()=>g?e(g,d+1):null)]}})})(z())),i(()=>m(d,j("tree",t.size,t.class,D()&&"rtl"))),d})()]}s(["click","dblclick"]);
 //# sourceMappingURL=index.js.map