neko-ui 2.9.8-beta.2 → 2.9.8-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/basic-config/index.d.ts +2 -1
- package/es/basic-config/index.js.map +1 -1
- package/es/md/index.js.map +1 -1
- package/es/menu/index.js +1 -1
- package/es/menu/index.js.map +1 -1
- package/es/menu/style.js +4 -1
- package/es/menu/style.js.map +1 -1
- package/es/popover/index.d.ts +1 -1
- package/es/popover/index.js.map +1 -1
- package/lib/basic-config/index.d.ts +2 -1
- package/lib/basic-config/index.js.map +1 -1
- package/lib/md/index.js.map +1 -1
- package/lib/menu/index.js +1 -1
- package/lib/menu/index.js.map +1 -1
- package/lib/menu/style.js +4 -1
- package/lib/menu/style.js.map +1 -1
- package/lib/popover/index.d.ts +1 -1
- package/lib/popover/index.js.map +1 -1
- package/package.json +3 -3
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import type { JSX } from 'solid-js';
|
|
2
|
+
export type JSXElement = JSX.Element | HTMLElement | string | number | boolean;
|
|
2
3
|
export interface BasicConfig {
|
|
3
4
|
/** 组件状态
|
|
4
5
|
* @default 'normal'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/basic-config/index.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["components/basic-config/index.ts"],"sourcesContent":["import type { JSX } from 'solid-js';\n\nexport type JSXElement = JSX.Element | HTMLElement | string | number | boolean;\nexport interface BasicConfig {\n /** 组件状态\n * @default 'normal'\n */\n status: keyof typeof Status;\n /** 组件尺寸\n * @default 'normal'\n */\n size: keyof typeof Size;\n /** 自定义 'label'、'value'、'options' 等映射的key */\n fieldName: Partial<{ [key in keyof typeof FieldName]: string }>;\n}\n\nexport enum Size {\n /** 小 */\n small = 'small',\n /** 默认: 中 */\n normal = 'normal',\n /** 大 */\n large = 'large',\n}\n\nexport enum Status {\n /** 默认 */\n normal = 'normal',\n /** 成功 */\n success = 'success',\n /** 警告 */\n warning = 'warning',\n /** 错误 */\n error = 'error',\n /** 详细 */\n info = 'info',\n /** 主要 */\n primary = 'primary',\n}\n\nexport interface BaseOption {\n /** 图标 */\n icon?: JSXElement;\n /** 值 */\n value?: string | number;\n /** 标题 */\n label?: JSXElement;\n /** 不可用状态 */\n disabled?: boolean;\n /** 自定义类名 */\n class?: string;\n /** 自定义样式 */\n style?: Record<string, unknown>;\n /** 选项状态\n * @default 'normal'\n */\n status?: Status;\n /** 分组子选项 */\n options?: (BaseOption | string)[];\n [key: string]: Any;\n}\n\nexport enum FieldName {\n /** 标题 */\n label = 'label',\n /** 值 */\n value = 'value',\n /** 分组子选项 */\n options = 'options',\n /** 子选项 */\n children = 'children',\n /** 图标 */\n icon = 'icon',\n /** 后缀图标 */\n suffix = 'suffix',\n /** 标题 */\n title = 'title',\n /** 副标题 */\n subTitle = 'subTitle',\n /** 键 */\n key = 'key',\n /** 名称 */\n name = 'name',\n}\n\nexport function camelToKebab(str: string) {\n return str\n .replace(/([A-Z])/g, '-$1') // 在大写字母前添加 \"-\"\n .toLowerCase(); // 转为小写\n}\nexport function clearAttribute(el: HTMLElement | ICustomElement, fields: string[]) {\n fields.forEach((key) => {\n const field = key as 'className';\n const prev = el[field];\n\n el.removeAttribute(camelToKebab(field));\n el[field] = prev;\n });\n}\n"],"names":["Size","Status","FieldName","camelToKebab","str","replace","toLowerCase","clearAttribute","el","fields","forEach","key","prev","removeAttribute"],"mappings":"IAgBYA,EASAC,EAqCAC,mBA9CAF,EAAAA,OAAAA,6EASAC,EAAAA,SAAAA,4IAqCAC,EAAAA,YAAAA,sLAuBZ,QAAO,SAASC,aAAaC,CAAW,EACtC,OAAOA,EACJC,OAAO,CAAC,WAAY,OACpBC,WAAW,EAChB,CACA,OAAO,SAASC,eAAeC,CAAgC,CAAEC,CAAgB,EAC/EA,EAAOC,OAAO,CAAC,AAACC,IAEd,IAAMC,EAAOJ,CAAE,CADDG,EACQ,CAEtBH,EAAGK,eAAe,CAACV,aAHLQ,IAIdH,CAAE,CAJYG,EAIL,CAAGC,CACd,EACF"}
|
package/es/md/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/md/index.tsx"],"sourcesContent":["import { createEffect, For, Match, mergeProps, onCleanup, Show, Switch } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport mdStyle from '../md-style';\nimport theme, { block } from '../theme';\n\nimport { create, dispose } from './worker';\n\nimport '../code';\nimport '../img';\n\nfunction MD(_props: MdProps) {\n let ref: HTMLDivElement | undefined;\n const { baseStyle } = theme;\n const props = mergeProps(\n {\n pictureViewer: true,\n lazyPicture: true,\n text: '',\n tools: ['copy'],\n getAnchorContainer: () => window as unknown as HTMLElement,\n },\n _props,\n );\n const worker = new Worker(create());\n\n worker.addEventListener('message', update);\n function update(e: { data: string }) {\n if (ref) {\n ref.innerHTML = e.data;\n }\n }\n\n createEffect(() => {\n worker.postMessage({\n text: props.text,\n langToolbar: props.tools,\n pictureViewer: props.pictureViewer,\n lazyPicture: props.lazyPicture,\n });\n });\n onCleanup(() => {\n worker.removeEventListener('message', update);\n worker.terminate();\n dispose();\n });\n let list: HTMLAnchorElement[] = [];\n let heading: HTMLHeadingElement[] = [];\n const active: HTMLAnchorElement[] = [];\n\n function handleAnchor(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n const a = e.target as HTMLAnchorElement;\n\n if (a.hash) {\n ref?.querySelector(decodeURIComponent(a.hash))?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n list.forEach((item) => {\n item.classList.remove('active');\n });\n a.classList.add('active');\n } else {\n window.open(a.href);\n }\n }\n function observerEntry(entries: IntersectionObserverEntry[]) {\n entries.forEach((entry) => {\n const id = entry.target.getAttribute('id');\n const all = entry.target.querySelectorAll('a');\n let a: HTMLAnchorElement | undefined;\n\n list.forEach((l) => {\n if (l.hash === `#${id}`) {\n a = l;\n } else if (!l.hash) {\n all.forEach((e) => {\n if (e.href === l.href) {\n a = l;\n }\n });\n }\n });\n if (a) {\n const idx = active.indexOf(a);\n\n active.forEach((e) => {\n e.classList.remove('active');\n });\n if (entry.isIntersecting) {\n active.push(a);\n } else if (idx !== -1) {\n active.splice(idx, 1);\n }\n if (active[0]) {\n active[0].classList.add('active');\n active[0].offsetParent?.scrollTo({\n top: active[0].offsetTop,\n });\n }\n }\n });\n }\n createEffect(() => {\n let observer: IntersectionObserver;\n\n if (ref && props.text.startsWith('[TOC]')) {\n list = [...ref.querySelectorAll<HTMLAnchorElement>('.n-md-toc a[href]')];\n heading = [...ref.querySelectorAll<HTMLHeadingElement>('h1, h2, h3, h4, h5, h6')];\n observer = new IntersectionObserver(observerEntry, {\n rootMargin: '-50px 0px',\n threshold: 0.5,\n });\n heading.forEach((e) => {\n observer.observe(e);\n });\n list.forEach((e) => {\n e.addEventListener('click', handleAnchor);\n });\n }\n onCleanup(() => {\n if (observer) {\n heading.forEach((e) => {\n observer.unobserve(e);\n });\n observer.disconnect();\n }\n list.forEach((e) => {\n e.removeEventListener('click', handleAnchor);\n });\n });\n });\n\n return (\n <>\n <style textContent={baseStyle()} />\n <style textContent={mdStyle} />\n <Show when={props.css}>\n <style textContent={css(props.css)} />\n </Show>\n <Switch>\n <Match when={(props.children || []).length > 0}>\n <article class=\"n-md-box\" part=\"box\">\n <div class=\"n-md-body\" part=\"body\">\n <For each={props.children as []}>{(e) => e}</For>\n </div>\n </article>\n </Match>\n <Match when={props.text}>\n <article ref={ref} class={cx('n-md-box', props.class)} part=\"box\" />\n </Match>\n </Switch>\n </>\n );\n}\n\nexport interface MdProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** md内容 */\n text?: string;\n /** 开启图片查看器\n * @since 2.0.8\n * @default true\n */\n pictureViewer?: boolean;\n /** 开启图片懒加载\n * @since 2.8.3\n * @default true\n */\n lazyPicture?: boolean;\n /** 开启代码块工具条\n * @default ['copy']\n */\n tools?: 'copy'[];\n /** 指定滚动的容器\n * @default () => window\n */\n getAnchorContainer?: () => HTMLElement;\n /** 不进行解析\n * @default false\n */\n notRender?: boolean;\n children?: JSXElement;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n 'n-md',\n {\n class: void 0,\n pictureViewer: void 0,\n lazyPicture: void 0,\n text: void 0,\n tools: void 0,\n getAnchorContainer: void 0,\n css: void 0,\n children: void 0,\n notRender: void 0,\n },\n (_, opt) => {\n const el = opt.element;\n const props = mergeProps(\n {\n text: (!_.notRender && el.textContent) || el.text,\n css: el.css,\n tools: el.tools,\n getAnchorContainer: el.getAnchorContainer,\n },\n _,\n );\n\n createEffect(() => {\n clearAttribute(el, ['css', 'text']);\n el.replaceChildren();\n });\n return (\n <>\n <style textContent={block} />\n <MD {...props} />\n </>\n );\n },\n);\nexport default MD;\n"],"names":["createEffect","For","Match","mergeProps","onCleanup","Show","Switch","css","cx","customElement","clearAttribute","mdStyle","theme","block","create","dispose","MD","_props","ref","baseStyle","props","pictureViewer","lazyPicture","text","tools","getAnchorContainer","window","worker","Worker","update","e","innerHTML","data","addEventListener","postMessage","langToolbar","removeEventListener","terminate","list","heading","active","handleAnchor","preventDefault","stopPropagation","a","target","hash","querySelector","decodeURIComponent","scrollIntoView","behavior","forEach","item","classList","remove","add","open","href","observerEntry","entries","entry","id","getAttribute","all","querySelectorAll","l","idx","indexOf","isIntersecting","push","splice","offsetParent","scrollTo","top","offsetTop","observer","startsWith","IntersectionObserver","rootMargin","threshold","observe","unobserve","disconnect","children","length","class","notRender","_","opt","el","element","textContent","replaceChildren"],"mappings":"kZAAA,QAASA,gBAAAA,CAAY,CAAEC,OAAAA,CAAG,CAAEC,SAAAA,CAAK,CAAEC,cAAAA,CAAU,CAAEC,aAAAA,CAAS,CAAEC,QAAAA,CAAI,CAAEC,UAAAA,CAAM,KAAQ,UAAW,AACzF,QAASC,OAAAA,CAAG,CAAEC,MAAAA,CAAE,KAAQ,aAAc,AACtC,QAASC,iBAAAA,CAAa,KAAQ,eAAgB,AAG9C,QAASC,kBAAAA,CAAc,KAAyB,iBAAkB,AAClE,QAAOC,MAAa,aAAc,AAClC,QAAOC,GAASC,SAAAA,CAAK,KAAQ,UAAW,AAExC,QAASC,UAAAA,CAAM,CAAEC,WAAAA,CAAO,KAAQ,UAAW,AAE3C,OAAO,SAAU,AACjB,OAAO,QAAS,CAEhB,SAASC,EAAGC,CAAe,MACrBC,EACJ,GAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGP,EAChBQ,EAAQjB,EACZ,CACEkB,cAAe,CAAA,EACfC,YAAa,CAAA,EACbC,KAAM,GACNC,MAAO,CAAC,OAAO,CACfC,mBAAoB,IAAMC,MAC5B,EACAT,GAEIU,EAAS,IAAIC,OAAOd,KAG1B,SAASe,EAAOC,CAAmB,EAC7BZ,GACFA,CAAAA,EAAIa,SAAS,CAAGD,EAAEE,IAAI,AAAD,CAEzB,CALAL,EAAOM,gBAAgB,CAAC,UAAWJ,GAOnC7B,EAAa,KACX2B,EAAOO,WAAW,CAAC,CACjBX,KAAMH,EAAMG,IAAI,CAChBY,YAAaf,EAAMI,KAAK,CACxBH,cAAeD,EAAMC,aAAa,CAClCC,YAAaF,EAAME,WAAW,AAChC,EACF,GACAlB,EAAU,KACRuB,EAAOS,mBAAmB,CAAC,UAAWP,GACtCF,EAAOU,SAAS,GAChBtB,GACF,GACA,IAAIuB,EAA4B,EAAE,CAC9BC,EAAgC,EAAE,CAChCC,EAA8B,EAAE,CAEtC,SAASC,EAAaX,CAAQ,EAC5BA,EAAEY,cAAc,GAChBZ,EAAEa,eAAe,GACjB,IAAMC,EAAId,EAAEe,MAAM,CAElB,GAAID,EAAEE,IAAI,CAAE,KACV5B,QAAAA,UAAAA,EAAAA,EAAK6B,aAAa,CAACC,mBAAmBJ,EAAEE,IAAI,KAA5C5B,EAAgD+B,cAAc,CAAC,CAC7DC,SAAU,SACVrC,MAAO,SACT,GACAyB,EAAKa,OAAO,CAAC,AAACC,IACZA,EAAKC,SAAS,CAACC,MAAM,CAAC,SACxB,GACAV,EAAES,SAAS,CAACE,GAAG,CAAC,SAClB,MACE7B,OAAO8B,IAAI,CAACZ,EAAEa,IAAI,CAEtB,CACA,SAASC,EAAcC,CAAoC,EACzDA,EAAQR,OAAO,CAAC,AAACS,QAGXhB,EAFJ,IAAMiB,EAAKD,EAAMf,MAAM,CAACiB,YAAY,CAAC,MAC/BC,EAAMH,EAAMf,MAAM,CAACmB,gBAAgB,CAAC,KAc1C,GAXA1B,EAAKa,OAAO,CAAC,AAACc,IACRA,EAAEnB,IAAI,GAAK,CAAC,CAAC,EAAEe,EAAG,CAAC,CACrBjB,EAAIqB,EACMA,EAAEnB,IAAI,EAChBiB,EAAIZ,OAAO,CAAC,AAACrB,IACPA,EAAE2B,IAAI,GAAKQ,EAAER,IAAI,EACnBb,CAAAA,EAAIqB,CAAAA,CAER,EAEJ,GACIrB,EAAG,CACL,IAAMsB,EAAM1B,EAAO2B,OAAO,CAACvB,GAU3B,GARAJ,EAAOW,OAAO,CAAC,AAACrB,IACdA,EAAEuB,SAAS,CAACC,MAAM,CAAC,SACrB,GACIM,EAAMQ,cAAc,CACtB5B,EAAO6B,IAAI,CAACzB,GACK,KAARsB,GACT1B,EAAO8B,MAAM,CAACJ,EAAK,GAEjB1B,CAAM,CAAC,EAAE,CAAE,KAEbA,EADAA,CAAM,CAAC,EAAE,CAACa,SAAS,CAACE,GAAG,CAAC,iBACxBf,EAAAA,CAAM,CAAC,EAAE,CAAC+B,YAAY,GAAtB/B,EAAwBgC,QAAQ,CAAC,CAC/BC,IAAKjC,CAAM,CAAC,EAAE,CAACkC,SAAS,AAC1B,EACF,CACF,CACF,EACF,CA+BA,OA9BA1E,EAAa,KACX,IAAI2E,EAEAzD,GAAOE,EAAMG,IAAI,CAACqD,UAAU,CAAC,WAC/BtC,EAAO,IAAIpB,EAAI8C,gBAAgB,CAAoB,qBAAqB,CACxEzB,EAAU,IAAIrB,EAAI8C,gBAAgB,CAAqB,0BAA0B,CACjFW,EAAW,IAAIE,qBAAqBnB,EAAe,CACjDoB,WAAY,YACZC,UAAW,EACb,GACAxC,EAAQY,OAAO,CAAC,AAACrB,IACf6C,EAASK,OAAO,CAAClD,EACnB,GACAQ,EAAKa,OAAO,CAAC,AAACrB,IACZA,EAAEG,gBAAgB,CAAC,QAASQ,EAC9B,IAEFrC,EAAU,KACJuE,IACFpC,EAAQY,OAAO,CAAC,AAACrB,IACf6C,EAASM,SAAS,CAACnD,EACrB,GACA6C,EAASO,UAAU,IAErB5C,EAAKa,OAAO,CAAC,AAACrB,IACZA,EAAEM,mBAAmB,CAAC,QAASK,EACjC,EACF,EACF,uDAIwBtB,gDACAR,UACnBN,qBAAWe,EAAMb,GAAG,8DACCA,EAAIa,EAAMb,GAAG,UAElCD,2BACEJ,oBAAY,AAACkB,CAAAA,EAAM+D,QAAQ,EAAI,EAAE,AAAD,EAAGC,MAAM,CAAG,oDAGtCnF,qBAAUmB,EAAM+D,QAAQ,WAAS,AAACrD,GAAMA,YAI9C5B,qBAAYkB,EAAMG,IAAI,6BACPL,oCAAAA,cAAYV,EAAG,WAAYY,EAAMiE,KAAK,aAK9D,CAoCA5E,EACE,OACA,CACE4E,MAAO,KAAK,EACZhE,cAAe,KAAK,EACpBC,YAAa,KAAK,EAClBC,KAAM,KAAK,EACXC,MAAO,KAAK,EACZC,mBAAoB,KAAK,EACzBlB,IAAK,KAAK,EACV4E,SAAU,KAAK,EACfG,UAAW,KAAK,CAClB,EACA,CAACC,EAAGC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAChBtE,EAAQjB,EACZ,CACEoB,KAAM,AAAC,CAACgE,EAAED,SAAS,EAAIG,EAAGE,WAAW,EAAKF,EAAGlE,IAAI,CACjDhB,IAAKkF,EAAGlF,GAAG,CACXiB,MAAOiE,EAAGjE,KAAK,CACfC,mBAAoBgE,EAAGhE,kBAAkB,AAC3C,EACA8D,GAOF,OAJAvF,EAAa,KACXU,EAAe+E,EAAI,CAAC,MAAO,OAAO,EAClCA,EAAGG,eAAe,EACpB,yCAGwB/E,UACnBG,EAAOI,GAGd,EAEF,gBAAeJ,CAAG"}
|
|
1
|
+
{"version":3,"sources":["components/md/index.tsx"],"sourcesContent":["import { createEffect, For, Match, mergeProps, onCleanup, Show, Switch } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport mdStyle from '../md-style';\nimport theme, { block } from '../theme';\n\nimport { create, dispose } from './worker';\n\nimport '../code';\nimport '../img';\n\nfunction MD(_props: MdProps) {\n let ref: HTMLDivElement | undefined;\n const { baseStyle } = theme;\n const props = mergeProps(\n {\n pictureViewer: true,\n lazyPicture: true,\n text: '',\n tools: ['copy'],\n getAnchorContainer: () => window as unknown as HTMLElement,\n },\n _props,\n );\n const worker = new Worker(create());\n\n worker.addEventListener('message', update);\n function update(e: { data: string }) {\n if (ref) {\n ref.innerHTML = e.data;\n }\n }\n\n createEffect(() => {\n worker.postMessage({\n text: props.text,\n langToolbar: props.tools,\n pictureViewer: props.pictureViewer,\n lazyPicture: props.lazyPicture,\n });\n });\n onCleanup(() => {\n worker.removeEventListener('message', update);\n worker.terminate();\n dispose();\n });\n let list: HTMLAnchorElement[] = [];\n let heading: HTMLHeadingElement[] = [];\n const active: HTMLAnchorElement[] = [];\n\n function handleAnchor(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n const a = e.target as HTMLAnchorElement;\n\n if (a.hash) {\n ref?.querySelector(decodeURIComponent(a.hash))?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n list.forEach((item) => {\n item.classList.remove('active');\n });\n a.classList.add('active');\n } else {\n window.open(a.href);\n }\n }\n function observerEntry(entries: IntersectionObserverEntry[]) {\n entries.forEach((entry) => {\n const id = entry.target.getAttribute('id');\n const all = entry.target.querySelectorAll('a');\n let a: HTMLAnchorElement | undefined;\n\n list.forEach((l) => {\n if (l.hash === `#${id}`) {\n a = l;\n } else if (!l.hash) {\n all.forEach((e) => {\n if (e.href === l.href) {\n a = l;\n }\n });\n }\n });\n if (a) {\n const idx = active.indexOf(a);\n\n active.forEach((e) => {\n e.classList.remove('active');\n });\n if (entry.isIntersecting) {\n active.push(a);\n } else if (idx !== -1) {\n active.splice(idx, 1);\n }\n if (active[0]) {\n active[0].classList.add('active');\n active[0].offsetParent?.scrollTo({\n top: active[0].offsetTop,\n });\n }\n }\n });\n }\n createEffect(() => {\n let observer: IntersectionObserver;\n\n if (ref && props.text.startsWith('[TOC]')) {\n list = [...ref.querySelectorAll<HTMLAnchorElement>('.n-md-toc a[href]')];\n heading = [...ref.querySelectorAll<HTMLHeadingElement>('h1, h2, h3, h4, h5, h6')];\n observer = new IntersectionObserver(observerEntry, {\n rootMargin: '-50px 0px',\n threshold: 0.5,\n });\n heading.forEach((e) => {\n observer.observe(e);\n });\n list.forEach((e) => {\n e.addEventListener('click', handleAnchor);\n });\n }\n onCleanup(() => {\n if (observer) {\n heading.forEach((e) => {\n observer.unobserve(e);\n });\n observer.disconnect();\n }\n list.forEach((e) => {\n e.removeEventListener('click', handleAnchor);\n });\n });\n });\n\n return (\n <>\n <style textContent={baseStyle()} />\n <style textContent={mdStyle} />\n <Show when={props.css}>\n <style textContent={css(props.css)} />\n </Show>\n <Switch>\n <Match when={((props.children as []) || []).length > 0}>\n <article class=\"n-md-box\" part=\"box\">\n <div class=\"n-md-body\" part=\"body\">\n <For each={props.children as []}>{(e) => e}</For>\n </div>\n </article>\n </Match>\n <Match when={props.text}>\n <article ref={ref} class={cx('n-md-box', props.class)} part=\"box\" />\n </Match>\n </Switch>\n </>\n );\n}\n\nexport interface MdProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** md内容 */\n text?: string;\n /** 开启图片查看器\n * @since 2.0.8\n * @default true\n */\n pictureViewer?: boolean;\n /** 开启图片懒加载\n * @since 2.8.3\n * @default true\n */\n lazyPicture?: boolean;\n /** 开启代码块工具条\n * @default ['copy']\n */\n tools?: 'copy'[];\n /** 指定滚动的容器\n * @default () => window\n */\n getAnchorContainer?: () => HTMLElement;\n /** 不进行解析\n * @default false\n */\n notRender?: boolean;\n children?: JSXElement;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n 'n-md',\n {\n class: void 0,\n pictureViewer: void 0,\n lazyPicture: void 0,\n text: void 0,\n tools: void 0,\n getAnchorContainer: void 0,\n css: void 0,\n children: void 0,\n notRender: void 0,\n },\n (_, opt) => {\n const el = opt.element;\n const props = mergeProps(\n {\n text: (!_.notRender && el.textContent) || el.text,\n css: el.css,\n tools: el.tools,\n getAnchorContainer: el.getAnchorContainer,\n },\n _,\n );\n\n createEffect(() => {\n clearAttribute(el, ['css', 'text']);\n el.replaceChildren();\n });\n return (\n <>\n <style textContent={block} />\n <MD {...props} />\n </>\n );\n },\n);\nexport default MD;\n"],"names":["createEffect","For","Match","mergeProps","onCleanup","Show","Switch","css","cx","customElement","clearAttribute","mdStyle","theme","block","create","dispose","MD","_props","ref","baseStyle","props","pictureViewer","lazyPicture","text","tools","getAnchorContainer","window","worker","Worker","update","e","innerHTML","data","addEventListener","postMessage","langToolbar","removeEventListener","terminate","list","heading","active","handleAnchor","preventDefault","stopPropagation","a","target","hash","querySelector","decodeURIComponent","scrollIntoView","behavior","forEach","item","classList","remove","add","open","href","observerEntry","entries","entry","id","getAttribute","all","querySelectorAll","l","idx","indexOf","isIntersecting","push","splice","offsetParent","scrollTo","top","offsetTop","observer","startsWith","IntersectionObserver","rootMargin","threshold","observe","unobserve","disconnect","children","length","class","notRender","_","opt","el","element","textContent","replaceChildren"],"mappings":"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"}
|
package/es/menu/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{use as e}from"solid-js/web";import{template as t}from"solid-js/web";import{spread as s}from"solid-js/web";import{setAttribute as i}from"solid-js/web";import{
|
|
1
|
+
import{use as e}from"solid-js/web";import{template as t}from"solid-js/web";import{spread as s}from"solid-js/web";import{setAttribute as i}from"solid-js/web";import{insert as l}from"solid-js/web";import{effect as n}from"solid-js/web";import{delegateEvents as r}from"solid-js/web";import{createComponent as o}from"solid-js/web";import{className as a}from"solid-js/web";import{addEventListener as u}from"solid-js/web";let d=t('<span class="menu-icon" part="icon">'),m=t('<span class="menu-label">'),f=t('<span class="menu-suffix" part="suffix">'),c=t('<div class="sub-menu-children" part="sub-menu-children"><div>'),p=t('<div part="sub-menu"><span class="sub-menu-title"><span class="menu-arrow">'),v=t('<div><span class="menu-group-title">'),g=t('<div part="item">'),h=t("<style> "),b=t("<style>"),y=t('<section class="menu" part="menu">');import{createEffect as C,createMemo as N,createSignal as w,For as $,Match as _,mergeProps as j,Show as A,splitProps as x,Switch as k,untrack as T}from"solid-js";import O from"@moneko/common/lib/frameCallback";import E from"@moneko/common/lib/isFunction";import{css as H,cx as K}from"@moneko/css";import{customElement as L}from"solid-element";import{clearAttribute as D,FieldName as P}from"../basic-config";import q from"../get-options";import F,{block as S}from"../theme";import{style as V}from"./style";function z(t){let r;let{isDark:j,baseStyle:L}=F,[D,S]=x(t,["class","css","items","fieldNames","value","disabled","toggle","multiple","onChange","onOpenChange","openKeys"]),[z,B]=w([]),[G,I]=w([]),J=N(()=>`:host {--sub-menu-bg: ${j()?"rgb(255 255 255 / 1%)":"rgb(0 0 0 / 1%)"} ;}`),M=N(()=>Object.assign({},P,D.fieldNames)),Q=N(()=>q(D.items,M()));function R(e){e.preventDefault(),e.stopPropagation()}function U(e,t){if(t.preventDefault(),!e.disabled&&!D.disabled){let t=[...z()],s=e[M().value];if(D.multiple){let e=t.indexOf(s);-1===e?t.push(s):t.splice(e,1)}else t=D.toggle&&t[0]===s?[]:[s];E(D.onChange)&&D.onChange(D.multiple?t:t[0],e),void 0===D.value&&B(t)}}function W(t){return o($,{get each(){return t.list},children:s=>{function r(){return[o(A,{get when(){return s[t.fieldNames.icon]},get children(){let e=d();return l(e,()=>s[t.fieldNames.icon]),e}}),(()=>{let e=m();return l(e,()=>s[t.fieldNames.label]),e})(),o(A,{get when(){return s[t.fieldNames.suffix]},get children(){let e=f();return l(e,()=>s[t.fieldNames.suffix]),e}})]}function h(){let i=N(()=>G().includes(s[t.fieldNames.value])),[d,m]=w(T(i));function f(e){R(e);let i=G();i=i.includes(s[t.fieldNames.value])?i.filter(e=>e!==s[t.fieldNames.value]):i.concat(s[t.fieldNames.value]),E(D.onOpenChange)&&D.onOpenChange(i),void 0===D.openKeys&&I(i)}function v(){let r;let[a,d]=w();function f(){i()||m(!1)}return C(()=>{d((null==r?void 0:r.offsetHeight)||0)}),(()=>{let i=c(),d=i.firstChild,m=r;return u(i,"animationend",f),"function"==typeof m?e(m,d):r=d,l(d,o(W,{get fieldNames(){return t.fieldNames},get list(){return s[t.fieldNames.children]}})),n(()=>(a(),i.style.setProperty("--h",`${a()}px`))),i})()}return C(()=>{i()&&m(!0)}),(()=>{let e=p(),t=e.firstChild,m=t.firstChild;return u(e,"mousedown",R,!0),u(t,"click",f,!0),l(t,o(r,{}),m),l(e,o(A,{get when(){return d()},get children(){return o(v,{})}}),null),n(t=>{let l=K("sub-menu",s.class),n=!!i(),r=!i();return l!==t._v$&&a(e,t._v$=l),n!==t._v$2&&e.classList.toggle("sub-menu-open",t._v$2=n),r!==t._v$3&&e.classList.toggle("sub-menu-close",t._v$3=r),t},{_v$:void 0,_v$2:void 0,_v$3:void 0}),e})()}return o(k,{get fallback(){return(()=>{let e=g();return u(e,"click",U.bind(null,s),!0),u(e,"mousedown",R,!0),l(e,o(r,{})),n(l=>{let n=K("menu-item",s.class,s.type),r=s.handleClosed,o=D.disabled||s.disabled,u=z().includes(s[t.fieldNames.value]);return n!==l._v$4&&a(e,l._v$4=n),r!==l._v$5&&i(e,"handle-closed",l._v$5=r),o!==l._v$6&&i(e,"aria-disabled",l._v$6=o),u!==l._v$7&&i(e,"aria-selected",l._v$7=u),l},{_v$4:void 0,_v$5:void 0,_v$6:void 0,_v$7:void 0}),e})()},get children(){return[o(_,{get when(){return Array.isArray(s[t.fieldNames.children])},get children(){return o(h,{})}}),o(_,{get when(){return Array.isArray(s[t.fieldNames.options])},get children(){let e=v(),i=e.firstChild;return u(e,"mousedown",R,!0),l(i,o(r,{})),l(e,o(W,{get fieldNames(){return t.fieldNames},get list(){return s[t.fieldNames.options]}}),null),n(()=>a(e,K("menu-group",s.class))),e}})]}})}})}return C(()=>{void 0!==D.value&&null!==D.value?B(Array.isArray(D.value)?D.value:[D.value]):B([])}),C(()=>{Array.isArray(D.openKeys)&&I(D.openKeys)}),C(()=>{Array.isArray(z())&&z().length&&O(()=>{let e=null==r?void 0:r.querySelector("[aria-selected=true]");if(e&&r){let t=e.offsetTop-r.offsetTop;t<r.scrollTop?r.scrollTo({top:t,behavior:"smooth"}):e.offsetTop+e.offsetHeight>r.scrollTop+r.offsetHeight+r.offsetTop&&r.scrollTo({top:t-r.offsetHeight+e.offsetHeight,behavior:"smooth"})}})}),[(()=>{let e=h(),t=e.firstChild;return n(()=>t.data=L()),e})(),(()=>{let e=b();return e.textContent=V,e})(),(()=>{let e=h(),t=e.firstChild;return n(()=>t.data=J()),e})(),o(A,{get when(){return D.css},get children(){let e=h(),t=e.firstChild;return n(()=>t.data=H(D.css)),e}}),(()=>{let t=y(),i=r;return"function"==typeof i?e(i,t):r=t,s(t,S,!1,!0),l(t,o(W,{get fieldNames(){return M()},get list(){return Q()}})),t})()]}L("n-menu",{class:void 0,css:void 0,disabled:void 0,value:void 0,defaultValue:void 0,onOpenChange:void 0,openKeys:void 0,fieldNames:void 0,multiple:void 0,toggle:void 0,onChange:void 0,items:[]},(e,t)=>{let s=t.element,i=j({css:s.css,onChange(e,t){s.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))},onOpenChange(e){s.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},e);return C(()=>{D(s,["css","items","fieldNames"])}),[(()=>{let e=b();return e.textContent=S,e})(),o(z,i)]});export default z;r(["click","mousedown"]);
|
package/es/menu/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/menu/index.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n For,\n Match,\n mergeProps,\n Show,\n splitProps,\n Switch,\n untrack,\n} from 'solid-js';\nimport { frameCallback, isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BaseOption, BasicConfig, CustomElement } from '..';\nimport { clearAttribute, FieldName, type JSXElement } from '../basic-config';\nimport getOptions from '../get-options';\nimport theme, { block } from '../theme';\n\nimport { style } from './style';\n\nfunction Menu(props: MenuProps | MenuMultipleProps) {\n let ref: HTMLDivElement | undefined;\n const { isDark, baseStyle } = theme;\n const [local, other] = splitProps(props, [\n 'class',\n 'css',\n 'items',\n 'fieldNames',\n 'value',\n 'disabled',\n 'toggle',\n 'multiple',\n 'onChange',\n 'onOpenChange',\n 'openKeys',\n ]);\n const [value, setValue] = createSignal<(string | number)[]>([]);\n const [openKeys, setOpenKeys] = createSignal<(string | number)[]>([]);\n const cssVar = createMemo(\n () => `:host {--sub-menu-bg: ${isDark() ? 'rgb(255 255 255 / 1%)' : 'rgb(0 0 0 / 1%)'} ;}`,\n );\n const fieldNames = createMemo(() => Object.assign({}, FieldName, local.fieldNames));\n const options = createMemo(() => getOptions(local.items, fieldNames()));\n\n function preventDefault(e: MouseEvent) {\n e.preventDefault();\n e.stopPropagation();\n }\n\n function change(item: MenuOption, e: MouseEvent) {\n e.preventDefault();\n if (!item.disabled && !local.disabled) {\n let _value = [...value()];\n const key = item[fieldNames().value]!;\n\n if (local.multiple) {\n const idx = _value.indexOf(key);\n\n if (idx === -1) {\n _value.push(key);\n } else {\n _value.splice(idx, 1);\n }\n } else if (local.toggle && _value[0] === key) {\n _value = [];\n } else {\n _value = [key];\n }\n if (isFunction(local.onChange)) {\n local.onChange((local.multiple ? _value : _value[0]) as never, item);\n }\n if (typeof local.value === 'undefined') {\n setValue(_value);\n }\n }\n }\n\n interface RenderMenuProps {\n list: MenuOption[];\n fieldNames: { [key in keyof typeof FieldName]: string };\n }\n function RenderMenu(_: RenderMenuProps) {\n return (\n <For each={_.list}>\n {(item) => {\n function RowTitle() {\n return (\n <>\n <Show when={item[_.fieldNames.icon]}>\n <span class=\"menu-icon\" part=\"icon\">\n {item[_.fieldNames.icon]}\n </span>\n </Show>\n {item[_.fieldNames.label]}\n <span class=\"menu-suffix\" part=\"suffix\">\n {item[_.fieldNames.suffix]}\n </span>\n </>\n );\n }\n\n function SubMenu() {\n const isOpen = createMemo(() => openKeys().includes(item[_.fieldNames.value]));\n const [show, setShow] = createSignal<boolean>(untrack(isOpen));\n\n createEffect(() => {\n if (isOpen()) {\n setShow(true);\n }\n });\n function handleOpen(e: MouseEvent) {\n preventDefault(e);\n let _openKeys = openKeys();\n\n if (_openKeys.includes(item[_.fieldNames.value])) {\n _openKeys = _openKeys.filter((v) => v !== item[_.fieldNames.value]);\n } else {\n _openKeys = _openKeys.concat(item[_.fieldNames.value]);\n }\n\n if (isFunction(local.onOpenChange)) {\n local.onOpenChange(_openKeys);\n }\n if (local.openKeys === void 0) {\n setOpenKeys(_openKeys);\n }\n }\n function Child() {\n let el: HTMLDivElement | undefined;\n const [hei, setHei] = createSignal();\n\n createEffect(() => {\n setHei(el?.offsetHeight || 0);\n });\n function onAnimationEnd() {\n if (!isOpen()) {\n setShow(false);\n }\n }\n return (\n <div\n class=\"sub-menu-children\"\n part=\"sub-menu-children\"\n style={{\n '--h': `${hei()}px`,\n }}\n onAnimationEnd={onAnimationEnd}\n >\n <div ref={el}>\n <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.children]} />\n </div>\n </div>\n );\n }\n\n return (\n <div\n class={cx('sub-menu', item.class)}\n classList={{\n 'sub-menu-open': isOpen(),\n 'sub-menu-close': !isOpen(),\n }}\n part=\"sub-menu\"\n onMouseDown={preventDefault}\n >\n <span class=\"sub-menu-title\" onClick={handleOpen}>\n <RowTitle />\n <span class=\"menu-arrow\" />\n </span>\n <Show when={show()}>\n <Child />\n </Show>\n </div>\n );\n }\n return (\n <Switch\n fallback={\n <div\n class={cx('menu-item', item.class, item.type)}\n part=\"item\"\n handle-closed={item.handleClosed}\n aria-disabled={local.disabled || item.disabled}\n aria-selected={value().includes(item[_.fieldNames.value])}\n onMouseDown={preventDefault}\n onClick={change.bind(null, item)}\n >\n <RowTitle />\n </div>\n }\n >\n <Match when={Array.isArray(item[_.fieldNames.children])}>\n <SubMenu />\n </Match>\n <Match when={Array.isArray(item[_.fieldNames.options])}>\n <div class={cx('menu-group', item.class)} onMouseDown={preventDefault}>\n <span class=\"menu-group-title\">\n <RowTitle />\n </span>\n <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.options]} />\n </div>\n </Match>\n </Switch>\n );\n }}\n </For>\n );\n }\n\n createEffect(() => {\n if (local.value !== void 0 && local.value !== null) {\n setValue(Array.isArray(local.value) ? local.value : [local.value]);\n } else {\n setValue([]);\n }\n });\n createEffect(() => {\n if (Array.isArray(local.openKeys)) {\n setOpenKeys(local.openKeys);\n }\n });\n\n createEffect(() => {\n if (Array.isArray(value()) && value().length) {\n frameCallback(() => {\n const el = ref?.querySelector<HTMLElement>('[aria-selected=true]');\n\n if (el && ref) {\n const next = el.offsetTop - ref.offsetTop;\n\n if (next < ref.scrollTop) {\n ref.scrollTo({\n top: next,\n behavior: 'smooth',\n });\n } else if (\n el.offsetTop + el.offsetHeight >\n ref.scrollTop + ref.offsetHeight + ref.offsetTop\n ) {\n ref.scrollTo({\n top: next - ref.offsetHeight + el.offsetHeight,\n behavior: 'smooth',\n });\n }\n }\n });\n }\n });\n return (\n <>\n <style textContent={baseStyle()} />\n <style textContent={style} />\n <style textContent={cssVar()} />\n <Show when={local.css}>\n <style textContent={css(local.css)} />\n </Show>\n <section ref={ref} class=\"menu\" part=\"menu\" {...other}>\n <RenderMenu fieldNames={fieldNames()} list={options()} />\n </section>\n </>\n );\n}\n\nexport interface BaseMenuProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 菜单展开的keys */\n openKeys?: (string | number)[];\n /** 菜单展开时触发的方法 */\n onOpenChange?: (keys: (string | number)[]) => void;\n /** 选项数据 */\n items?: (string | MenuOption)[];\n /** 自定义节点 'label'、'value'、'options' 的字段 */\n fieldNames?: BasicConfig['fieldName'];\n /** 不可用状态 */\n disabled?: boolean;\n /** 可以取消 */\n toggle?: boolean;\n}\n\nexport interface MenuProps extends BaseMenuProps {\n /** 值修改时的回调方法 */\n onChange?(val: string | number, item: MenuOption): void;\n /** 值 */\n value?: string | number;\n /** 默认值 */\n defaultValue?: string | number;\n /** 可多选\n * @default false\n */\n multiple?: false | never;\n}\n\nexport interface MenuMultipleProps extends BaseMenuProps {\n /** 可多选\n * @default true\n */\n multiple: true;\n /** 值修改时的回调方法 */\n onChange?(val: (string | number)[], item: MenuOption): void;\n /** 值 */\n value?: (string | number)[];\n /** 默认值 */\n defaultValue?: (string | number)[];\n}\n\n/** 菜单选项 */\nexport interface MenuOption extends Omit<BaseOption, 'children' | 'options'> {\n /** 图标 */\n icon?: JSXElement;\n /** 内置类型(状态) */\n type?: 'primary' | 'success' | 'error' | 'warning';\n /** 自定义颜色 */\n color?: string;\n /** 子菜单 */\n children?: (string | MenuOption)[];\n /** 分组子选项 */\n options?: (string | MenuOption)[];\n}\n\nexport type MenuElement = CustomElement<MenuProps, 'onChange' | 'onOpenChange'>;\nexport type MenuMultipleElement = CustomElement<MenuMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<MenuProps>(\n 'n-menu',\n {\n class: void 0,\n css: void 0,\n disabled: void 0,\n value: void 0,\n defaultValue: void 0,\n onOpenChange: void 0,\n openKeys: void 0,\n fieldNames: void 0,\n multiple: void 0,\n toggle: void 0,\n onChange: void 0,\n items: [],\n },\n (_, opt) => {\n const el = opt.element;\n const defaultProps: Partial<MenuProps> = {\n css: el.css,\n onChange(key, item) {\n el.dispatchEvent(\n new CustomEvent('change', {\n detail: [key, item],\n }),\n );\n },\n onOpenChange(keys) {\n el.dispatchEvent(\n new CustomEvent('openchange', {\n detail: keys,\n }),\n );\n },\n };\n const props = mergeProps(defaultProps, _);\n\n createEffect(() => {\n clearAttribute(el, ['css', 'items', 'fieldNames']);\n });\n return (\n <>\n <style textContent={block} />\n <Menu {...props} />\n </>\n );\n },\n);\n\nexport default Menu;\n"],"names":["createEffect","createMemo","createSignal","For","Match","mergeProps","Show","splitProps","Switch","untrack","frameCallback","isFunction","css","cx","customElement","clearAttribute","FieldName","getOptions","theme","block","style","Menu","props","ref","isDark","baseStyle","local","other","value","setValue","openKeys","setOpenKeys","cssVar","fieldNames","Object","assign","options","items","preventDefault","e","stopPropagation","change","item","disabled","_value","key","multiple","idx","indexOf","push","splice","toggle","onChange","RenderMenu","_","list","RowTitle","icon","label","suffix","SubMenu","isOpen","includes","show","setShow","handleOpen","_openKeys","filter","v","concat","onOpenChange","Child","el","hei","setHei","onAnimationEnd","offsetHeight","children","class","bind","type","handleClosed","Array","isArray","length","querySelector","next","offsetTop","scrollTop","scrollTo","top","behavior","defaultValue","opt","element","dispatchEvent","CustomEvent","detail","keys"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["components/menu/index.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n For,\n Match,\n mergeProps,\n Show,\n splitProps,\n Switch,\n untrack,\n} from 'solid-js';\nimport { frameCallback, isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BaseOption, BasicConfig, CustomElement } from '..';\nimport { clearAttribute, FieldName, type JSXElement } from '../basic-config';\nimport getOptions from '../get-options';\nimport theme, { block } from '../theme';\n\nimport { style } from './style';\n\nfunction Menu(props: MenuProps | MenuMultipleProps) {\n let ref: HTMLDivElement | undefined;\n const { isDark, baseStyle } = theme;\n const [local, other] = splitProps(props, [\n 'class',\n 'css',\n 'items',\n 'fieldNames',\n 'value',\n 'disabled',\n 'toggle',\n 'multiple',\n 'onChange',\n 'onOpenChange',\n 'openKeys',\n ]);\n const [value, setValue] = createSignal<(string | number)[]>([]);\n const [openKeys, setOpenKeys] = createSignal<(string | number)[]>([]);\n const cssVar = createMemo(\n () => `:host {--sub-menu-bg: ${isDark() ? 'rgb(255 255 255 / 1%)' : 'rgb(0 0 0 / 1%)'} ;}`,\n );\n const fieldNames = createMemo(() => Object.assign({}, FieldName, local.fieldNames));\n const options = createMemo(() => getOptions(local.items, fieldNames()));\n\n function preventDefault(e: MouseEvent) {\n e.preventDefault();\n e.stopPropagation();\n }\n\n function change(item: MenuOption, e: MouseEvent) {\n e.preventDefault();\n if (!item.disabled && !local.disabled) {\n let _value = [...value()];\n const key = item[fieldNames().value]!;\n\n if (local.multiple) {\n const idx = _value.indexOf(key);\n\n if (idx === -1) {\n _value.push(key);\n } else {\n _value.splice(idx, 1);\n }\n } else if (local.toggle && _value[0] === key) {\n _value = [];\n } else {\n _value = [key];\n }\n if (isFunction(local.onChange)) {\n local.onChange((local.multiple ? _value : _value[0]) as never, item);\n }\n if (typeof local.value === 'undefined') {\n setValue(_value);\n }\n }\n }\n\n interface RenderMenuProps {\n list: MenuOption[];\n fieldNames: { [key in keyof typeof FieldName]: string };\n }\n function RenderMenu(_: RenderMenuProps) {\n return (\n <For each={_.list}>\n {(item) => {\n function RowTitle() {\n return (\n <>\n <Show when={item[_.fieldNames.icon]}>\n <span class=\"menu-icon\" part=\"icon\">\n {item[_.fieldNames.icon]}\n </span>\n </Show>\n <span class=\"menu-label\">{item[_.fieldNames.label]}</span>\n <Show when={item[_.fieldNames.suffix]}>\n <span class=\"menu-suffix\" part=\"suffix\">\n {item[_.fieldNames.suffix]}\n </span>\n </Show>\n </>\n );\n }\n\n function SubMenu() {\n const isOpen = createMemo(() => openKeys().includes(item[_.fieldNames.value]));\n const [show, setShow] = createSignal<boolean>(untrack(isOpen));\n\n createEffect(() => {\n if (isOpen()) {\n setShow(true);\n }\n });\n function handleOpen(e: MouseEvent) {\n preventDefault(e);\n let _openKeys = openKeys();\n\n if (_openKeys.includes(item[_.fieldNames.value])) {\n _openKeys = _openKeys.filter((v) => v !== item[_.fieldNames.value]);\n } else {\n _openKeys = _openKeys.concat(item[_.fieldNames.value]);\n }\n\n if (isFunction(local.onOpenChange)) {\n local.onOpenChange(_openKeys);\n }\n if (local.openKeys === void 0) {\n setOpenKeys(_openKeys);\n }\n }\n function Child() {\n let el: HTMLDivElement | undefined;\n const [hei, setHei] = createSignal();\n\n createEffect(() => {\n setHei(el?.offsetHeight || 0);\n });\n function onAnimationEnd() {\n if (!isOpen()) {\n setShow(false);\n }\n }\n return (\n <div\n class=\"sub-menu-children\"\n part=\"sub-menu-children\"\n style={{\n '--h': `${hei()}px`,\n }}\n onAnimationEnd={onAnimationEnd}\n >\n <div ref={el}>\n <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.children]} />\n </div>\n </div>\n );\n }\n\n return (\n <div\n class={cx('sub-menu', item.class)}\n classList={{\n 'sub-menu-open': isOpen(),\n 'sub-menu-close': !isOpen(),\n }}\n part=\"sub-menu\"\n onMouseDown={preventDefault}\n >\n <span class=\"sub-menu-title\" onClick={handleOpen}>\n <RowTitle />\n <span class=\"menu-arrow\" />\n </span>\n <Show when={show()}>\n <Child />\n </Show>\n </div>\n );\n }\n return (\n <Switch\n fallback={\n <div\n class={cx('menu-item', item.class, item.type)}\n part=\"item\"\n handle-closed={item.handleClosed}\n aria-disabled={local.disabled || item.disabled}\n aria-selected={value().includes(item[_.fieldNames.value])}\n onMouseDown={preventDefault}\n onClick={change.bind(null, item)}\n >\n <RowTitle />\n </div>\n }\n >\n <Match when={Array.isArray(item[_.fieldNames.children])}>\n <SubMenu />\n </Match>\n <Match when={Array.isArray(item[_.fieldNames.options])}>\n <div class={cx('menu-group', item.class)} onMouseDown={preventDefault}>\n <span class=\"menu-group-title\">\n <RowTitle />\n </span>\n <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.options]} />\n </div>\n </Match>\n </Switch>\n );\n }}\n </For>\n );\n }\n\n createEffect(() => {\n if (local.value !== void 0 && local.value !== null) {\n setValue(Array.isArray(local.value) ? local.value : [local.value]);\n } else {\n setValue([]);\n }\n });\n createEffect(() => {\n if (Array.isArray(local.openKeys)) {\n setOpenKeys(local.openKeys);\n }\n });\n\n createEffect(() => {\n if (Array.isArray(value()) && value().length) {\n frameCallback(() => {\n const el = ref?.querySelector<HTMLElement>('[aria-selected=true]');\n\n if (el && ref) {\n const next = el.offsetTop - ref.offsetTop;\n\n if (next < ref.scrollTop) {\n ref.scrollTo({\n top: next,\n behavior: 'smooth',\n });\n } else if (\n el.offsetTop + el.offsetHeight >\n ref.scrollTop + ref.offsetHeight + ref.offsetTop\n ) {\n ref.scrollTo({\n top: next - ref.offsetHeight + el.offsetHeight,\n behavior: 'smooth',\n });\n }\n }\n });\n }\n });\n return (\n <>\n <style textContent={baseStyle()} />\n <style textContent={style} />\n <style textContent={cssVar()} />\n <Show when={local.css}>\n <style textContent={css(local.css)} />\n </Show>\n <section ref={ref} class=\"menu\" part=\"menu\" {...other}>\n <RenderMenu fieldNames={fieldNames()} list={options()} />\n </section>\n </>\n );\n}\n\nexport interface BaseMenuProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 菜单展开的keys */\n openKeys?: (string | number)[];\n /** 菜单展开时触发的方法 */\n onOpenChange?: (keys: (string | number)[]) => void;\n /** 选项数据 */\n items?: (string | MenuOption)[];\n /** 自定义节点 'label'、'value'、'options' 的字段 */\n fieldNames?: BasicConfig['fieldName'];\n /** 不可用状态 */\n disabled?: boolean;\n /** 可以取消 */\n toggle?: boolean;\n}\n\nexport interface MenuProps extends BaseMenuProps {\n /** 值修改时的回调方法 */\n onChange?(val: string | number, item: MenuOption): void;\n /** 值 */\n value?: string | number;\n /** 默认值 */\n defaultValue?: string | number;\n /** 可多选\n * @default false\n */\n multiple?: false | never;\n}\n\nexport interface MenuMultipleProps extends BaseMenuProps {\n /** 可多选\n * @default true\n */\n multiple: true;\n /** 值修改时的回调方法 */\n onChange?(val: (string | number)[], item: MenuOption): void;\n /** 值 */\n value?: (string | number)[];\n /** 默认值 */\n defaultValue?: (string | number)[];\n}\n\n/** 菜单选项 */\nexport interface MenuOption extends Omit<BaseOption, 'children' | 'options'> {\n /** 图标 */\n icon?: JSXElement;\n /** 内置类型(状态) */\n type?: 'primary' | 'success' | 'error' | 'warning';\n /** 自定义颜色 */\n color?: string;\n /** 子菜单 */\n children?: (string | MenuOption)[];\n /** 分组子选项 */\n options?: (string | MenuOption)[];\n}\n\nexport type MenuElement = CustomElement<MenuProps, 'onChange' | 'onOpenChange'>;\nexport type MenuMultipleElement = CustomElement<MenuMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<MenuProps>(\n 'n-menu',\n {\n class: void 0,\n css: void 0,\n disabled: void 0,\n value: void 0,\n defaultValue: void 0,\n onOpenChange: void 0,\n openKeys: void 0,\n fieldNames: void 0,\n multiple: void 0,\n toggle: void 0,\n onChange: void 0,\n items: [],\n },\n (_, opt) => {\n const el = opt.element;\n const defaultProps: Partial<MenuProps> = {\n css: el.css,\n onChange(key, item) {\n el.dispatchEvent(\n new CustomEvent('change', {\n detail: [key, item],\n }),\n );\n },\n onOpenChange(keys) {\n el.dispatchEvent(\n new CustomEvent('openchange', {\n detail: keys,\n }),\n );\n },\n };\n const props = mergeProps(defaultProps, _);\n\n createEffect(() => {\n clearAttribute(el, ['css', 'items', 'fieldNames']);\n });\n return (\n <>\n <style textContent={block} />\n <Menu {...props} />\n </>\n );\n },\n);\n\nexport default Menu;\n"],"names":["createEffect","createMemo","createSignal","For","Match","mergeProps","Show","splitProps","Switch","untrack","frameCallback","isFunction","css","cx","customElement","clearAttribute","FieldName","getOptions","theme","block","style","Menu","props","ref","isDark","baseStyle","local","other","value","setValue","openKeys","setOpenKeys","cssVar","fieldNames","Object","assign","options","items","preventDefault","e","stopPropagation","change","item","disabled","_value","key","multiple","idx","indexOf","push","splice","toggle","onChange","RenderMenu","_","list","RowTitle","icon","label","suffix","SubMenu","isOpen","includes","show","setShow","handleOpen","_openKeys","filter","v","concat","onOpenChange","Child","el","hei","setHei","onAnimationEnd","offsetHeight","children","class","bind","type","handleClosed","Array","isArray","length","querySelector","next","offsetTop","scrollTop","scrollTo","top","behavior","defaultValue","opt","element","dispatchEvent","CustomEvent","detail","keys"],"mappings":"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"}
|
package/es/menu/style.js
CHANGED
package/es/menu/style.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/menu/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n .menu {\n --menu-selection: var(--primary-selection);\n\n max-block-size: 100%;\n display: block;\n overflow-y: auto;\n color: var(--text-color);\n\n ${['primary', 'success', 'error', 'warning']\n .map(\n (s) =>\n `.${s} {--text-color: var(--${s}-color);--text-heading: var(--${s}-color);--text-secondary: var(--${s}-secondary);--component-bg: var(--${s}-details-bg);--menu-selection: var(--${s}-selection);}`,\n )\n .join('')}\n }\n\n .menu-item,\n .menu-group,\n .sub-menu {\n border-radius: calc(var(--border-radius) / 1.5);\n transition:\n 0.3s background-color var(--transition-timing-function),\n 0.3s color var(--transition-timing-function);\n box-sizing: border-box;\n line-height: 1.57;\n }\n\n .menu-icon {\n font-size: var(--font-size);\n }\n\n .menu-group {\n position: relative;\n }\n\n .menu-group-title {\n position: sticky;\n z-index: 1;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 5px;\n font-size: 12px;\n color: var(--text-secondary);\n inset-block-start: -2px;\n column-gap: 5px;\n }\n\n .menu-suffix {\n text-align: end;\n color: var(--text-secondary);\n
|
|
1
|
+
{"version":3,"sources":["components/menu/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n .menu {\n --menu-selection: var(--primary-selection);\n\n max-block-size: 100%;\n display: block;\n overflow-y: auto;\n color: var(--text-color);\n\n ${['primary', 'success', 'error', 'warning']\n .map(\n (s) =>\n `.${s} {--text-color: var(--${s}-color);--text-heading: var(--${s}-color);--text-secondary: var(--${s}-secondary);--component-bg: var(--${s}-details-bg);--menu-selection: var(--${s}-selection);}`,\n )\n .join('')}\n }\n\n .menu-item,\n .menu-group,\n .sub-menu {\n border-radius: calc(var(--border-radius) / 1.5);\n transition:\n 0.3s background-color var(--transition-timing-function),\n 0.3s color var(--transition-timing-function);\n box-sizing: border-box;\n line-height: 1.57;\n }\n\n .menu-icon {\n font-size: var(--font-size);\n }\n\n .menu-group {\n position: relative;\n }\n\n .menu-group-title {\n position: sticky;\n z-index: 1;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 5px;\n font-size: 12px;\n color: var(--text-secondary);\n inset-block-start: -2px;\n column-gap: 5px;\n }\n\n .menu-label {\n flex: 1;\n }\n\n .menu-suffix {\n text-align: end;\n color: var(--text-secondary);\n }\n\n .sub-menu-title {\n display: flex;\n align-items: center;\n border-radius: calc(var(--border-radius) / 1.5);\n padding: 5px 12px;\n column-gap: 5px;\n transition: box-shadow var(--transition-duration) var(--transition-timing-function);\n\n &:hover:not(&[aria-disabled]:not([aria-disabled='false'])) {\n &:not([aria-selected='true'], .error) {\n background-color: var(--disable-bg);\n }\n }\n\n > .menu-arrow {\n position: relative;\n display: block;\n inline-size: 12px;\n block-size: 1.5px;\n pointer-events: none;\n color: var(--text-color);\n opacity: 0.5;\n margin-inline-start: 5px;\n\n &::after,\n &::before {\n position: absolute;\n border-radius: 2px;\n background-color: currentcolor;\n transition:\n transform var(--transition-duration) var(--transition-timing-function),\n color var(--transition-duration) var(--transition-timing-function);\n inline-size: 6px;\n block-size: 1.5px;\n content: '';\n }\n }\n }\n\n .sub-menu {\n cursor: pointer;\n\n &:has([aria-selected='true']) > span {\n color: var(--text-heading);\n }\n }\n\n .sub-menu-children {\n border-radius: calc(var(--border-radius) / 1.5);\n background-color: var(--sub-menu-bg);\n transform-origin: top;\n\n > div {\n padding: 5px 12px;\n }\n }\n\n .sub-menu-open {\n > .sub-menu-children {\n animation: menu-open var(--transition-duration) var(--transition-timing-function) forwards;\n }\n\n > span.sub-menu-title {\n box-shadow: 0 10px 5px 0 rgb(0 0 0 / 1%);\n\n > .menu-arrow {\n &::after {\n transform: rotate(-45deg) translate3d(-1.5px, -1px, 1px);\n }\n\n &::before {\n transform: rotate(45deg) translate3d(1.5px, -1px, 1px);\n }\n }\n }\n }\n\n .sub-menu-close {\n > .sub-menu-children {\n animation: menu-close var(--transition-duration) var(--transition-timing-function) forwards;\n }\n\n > span.sub-menu-title {\n box-shadow: 0 0 0 0 rgb(0 0 0 / 0%);\n\n > .menu-arrow {\n &::after {\n transform: rotate(45deg) translate3d(-1px, 2px, 1px);\n }\n\n &::before {\n transform: rotate(-45deg) translate3d(1px, 2px, 1px);\n }\n }\n }\n }\n\n .menu-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 5px 12px;\n cursor: pointer;\n column-gap: 5px;\n color: var(--text-color);\n\n &:hover:not(&[aria-disabled]:not([aria-disabled='false'])) {\n &:not([aria-selected='true']) {\n color: var(--text-heading);\n background-color: var(--disable-bg);\n }\n }\n\n &[aria-disabled]:not([aria-disabled='false']) {\n cursor: not-allowed;\n color: var(--disable-color);\n }\n\n &[aria-selected='true'] {\n color: var(--text-heading);\n background-color: var(--menu-selection);\n\n & + & {\n border-start-end-radius: 0;\n border-start-start-radius: 0;\n }\n\n &:has(+ &[aria-selected='true']) {\n border-end-end-radius: 0;\n border-end-start-radius: 0;\n }\n }\n }\n\n @keyframes menu-open {\n from {\n transform: scaleY(0);\n block-size: 0;\n opacity: 0;\n }\n\n to {\n transform: scaleY(1);\n block-size: var(--h);\n opacity: 1;\n }\n }\n\n @keyframes menu-close {\n from {\n transform: scaleY(1);\n block-size: var(--h);\n opacity: 1;\n }\n\n to {\n transform: scaleY(0);\n block-size: 0;\n opacity: 0;\n }\n }\n`;\n"],"names":["css","style","map","s","join"],"mappings":"AAAA,OAASA,OAAAA,CAAG,KAAQ,aAAc,AAElC,QAAO,MAAMC,MAAQD,CAAG,CAAC;;;;;;;;;IASrB,EAAE,CAAC,UAAW,UAAW,QAAS,UAAU,CACzCE,GAAG,CACF,AAACC,GACC,CAAC,CAAC,EAAEA,EAAE,sBAAsB,EAAEA,EAAE,8BAA8B,EAAEA,EAAE,gCAAgC,EAAEA,EAAE,kCAAkC,EAAEA,EAAE,qCAAqC,EAAEA,EAAE,aAAa,CAAC,EAEtMC,IAAI,CAAC,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6MhB,CAAC,AAAC"}
|
package/es/popover/index.d.ts
CHANGED
|
@@ -6,7 +6,7 @@ export interface PopoverProps {
|
|
|
6
6
|
/** 自定义样式表 */
|
|
7
7
|
css?: string;
|
|
8
8
|
/** 内容 */
|
|
9
|
-
content?:
|
|
9
|
+
content?: JSXElement;
|
|
10
10
|
/** 挂载到指定的元素,值为一个返回对应 DOM 元素 默认 document.body */
|
|
11
11
|
getPopupContainer?: (node?: HTMLElement | null) => HTMLElement;
|
|
12
12
|
/** 触发行为
|
package/es/popover/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/popover/index.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n Show,\n splitProps,\n} from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { isElementInside, isEqual, isFunction, passiveSupported } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BasicConfig, CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport Empty from '../empty';\nimport theme, { inline } from '../theme';\n\nimport { popoverCss, portalCss } from './style';\n\nexport interface PopoverProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 内容 */\n content?: (() => JSXElement) | JSXElement;\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?: JSXElement;\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\ninterface Posi {\n left?: number;\n top?: number;\n right?: number;\n bottom?: number;\n '--x'?: number;\n}\n\ninterface 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 && (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 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: ${isDark() ? '#1f1f1f' : 'var(--component-bg)'};--popover-shadow-color: rgb(0 0 0 / 5%);position: absolute;}`;\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 textContent={popoverCss} />\n <Show when={local.css}>\n <style textContent={css(local.css)} />\n </Show>\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 textContent={baseStyle()} />\n <style textContent={portalCss} />\n <style textContent={hostStyle()} />\n <style textContent={portalStyle()} />\n <style textContent={width()} />\n <Show when={local.popupCss}>\n <style textContent={css(local.popupCss)} />\n </Show>\n <div ref={ref} onAnimationEnd={exit} class={portalCls()} {...childrenProps()}>\n <Show when={local.content} fallback={<Empty />}>\n <Show when={typeof local.content === 'string'} fallback={local.content}>\n {/* eslint-disable-next-line solid/no-innerhtml */}\n <div innerHTML={local.content} />\n </Show>\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 { baseStyle } = theme;\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 clearAttribute(el, ['content', 'popupCss', 'css']);\n });\n return (\n <>\n <style textContent={inline} />\n <style textContent={baseStyle()} />\n <Popover {...props} />\n </>\n );\n});\nexport default Popover;\n"],"names":["TriggerOption","Placement","createEffect","createMemo","createSignal","mergeProps","onCleanup","onMount","Show","splitProps","Portal","isElementInside","isEqual","isFunction","passiveSupported","css","cx","customElement","clearAttribute","Empty","theme","inline","popoverCss","portalCss","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"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["components/popover/index.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n Show,\n splitProps,\n} from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { isElementInside, isEqual, isFunction, passiveSupported } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BasicConfig, CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport Empty from '../empty';\nimport theme, { inline } from '../theme';\n\nimport { popoverCss, portalCss } from './style';\n\nexport interface PopoverProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 内容 */\n content?: JSXElement;\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?: JSXElement;\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\ninterface Posi {\n left?: number;\n top?: number;\n right?: number;\n bottom?: number;\n '--x'?: number;\n}\n\ninterface 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 && (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 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: ${isDark() ? '#1f1f1f' : 'var(--component-bg)'};--popover-shadow-color: rgb(0 0 0 / 5%);position: absolute;}`;\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 textContent={popoverCss} />\n <Show when={local.css}>\n <style textContent={css(local.css)} />\n </Show>\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 textContent={baseStyle()} />\n <style textContent={portalCss} />\n <style textContent={hostStyle()} />\n <style textContent={portalStyle()} />\n <style textContent={width()} />\n <Show when={local.popupCss}>\n <style textContent={css(local.popupCss)} />\n </Show>\n <div ref={ref} onAnimationEnd={exit} class={portalCls()} {...childrenProps()}>\n <Show when={local.content} fallback={<Empty />}>\n <Show when={typeof local.content === 'string'} fallback={local.content}>\n {/* eslint-disable-next-line solid/no-innerhtml */}\n <div innerHTML={local.content as string} />\n </Show>\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 { baseStyle } = theme;\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 clearAttribute(el, ['content', 'popupCss', 'css']);\n });\n return (\n <>\n <style textContent={inline} />\n <style textContent={baseStyle()} />\n <Popover {...props} />\n </>\n );\n});\nexport default Popover;\n"],"names":["TriggerOption","Placement","createEffect","createMemo","createSignal","mergeProps","onCleanup","onMount","Show","splitProps","Portal","isElementInside","isEqual","isFunction","passiveSupported","css","cx","customElement","clearAttribute","Empty","theme","inline","popoverCss","portalCss","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"],"mappings":"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"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import type { JSX } from 'solid-js';
|
|
2
|
+
export type JSXElement = JSX.Element | HTMLElement | string | number | boolean;
|
|
2
3
|
export interface BasicConfig {
|
|
3
4
|
/** 组件状态
|
|
4
5
|
* @default 'normal'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/basic-config/index.ts"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["components/basic-config/index.ts"],"sourcesContent":["import type { JSX } from 'solid-js';\n\nexport type JSXElement = JSX.Element | HTMLElement | string | number | boolean;\nexport interface BasicConfig {\n /** 组件状态\n * @default 'normal'\n */\n status: keyof typeof Status;\n /** 组件尺寸\n * @default 'normal'\n */\n size: keyof typeof Size;\n /** 自定义 'label'、'value'、'options' 等映射的key */\n fieldName: Partial<{ [key in keyof typeof FieldName]: string }>;\n}\n\nexport enum Size {\n /** 小 */\n small = 'small',\n /** 默认: 中 */\n normal = 'normal',\n /** 大 */\n large = 'large',\n}\n\nexport enum Status {\n /** 默认 */\n normal = 'normal',\n /** 成功 */\n success = 'success',\n /** 警告 */\n warning = 'warning',\n /** 错误 */\n error = 'error',\n /** 详细 */\n info = 'info',\n /** 主要 */\n primary = 'primary',\n}\n\nexport interface BaseOption {\n /** 图标 */\n icon?: JSXElement;\n /** 值 */\n value?: string | number;\n /** 标题 */\n label?: JSXElement;\n /** 不可用状态 */\n disabled?: boolean;\n /** 自定义类名 */\n class?: string;\n /** 自定义样式 */\n style?: Record<string, unknown>;\n /** 选项状态\n * @default 'normal'\n */\n status?: Status;\n /** 分组子选项 */\n options?: (BaseOption | string)[];\n [key: string]: Any;\n}\n\nexport enum FieldName {\n /** 标题 */\n label = 'label',\n /** 值 */\n value = 'value',\n /** 分组子选项 */\n options = 'options',\n /** 子选项 */\n children = 'children',\n /** 图标 */\n icon = 'icon',\n /** 后缀图标 */\n suffix = 'suffix',\n /** 标题 */\n title = 'title',\n /** 副标题 */\n subTitle = 'subTitle',\n /** 键 */\n key = 'key',\n /** 名称 */\n name = 'name',\n}\n\nexport function camelToKebab(str: string) {\n return str\n .replace(/([A-Z])/g, '-$1') // 在大写字母前添加 \"-\"\n .toLowerCase(); // 转为小写\n}\nexport function clearAttribute(el: HTMLElement | ICustomElement, fields: string[]) {\n fields.forEach((key) => {\n const field = key as 'className';\n const prev = el[field];\n\n el.removeAttribute(camelToKebab(field));\n el[field] = prev;\n });\n}\n"],"names":["camelToKebab","str","replace","toLowerCase","clearAttribute","el","fields","forEach","key","prev","removeAttribute","Size","Status","FieldName"],"mappings":"0GAqFO,SAASA,EAAaC,CAAW,EACtC,OAAOA,EACJC,OAAO,CAAC,WAAY,OACpBC,WAAW,EAChB,CACO,SAASC,EAAeC,CAAgC,CAAEC,CAAgB,EAC/EA,EAAOC,OAAO,CAAC,AAACC,IAEd,IAAMC,EAAOJ,CAAE,CADDG,EACQ,CAEtBH,EAAGK,eAAe,CAACV,EAHLQ,IAIdH,CAAE,CAJYG,EAIL,CAAGC,CACd,EACF,wJAbgBT,YAAY,mBAAZA,GAKAI,cAAc,mBAAdA,cA1EJO,sDAAAA,IAAAA,gBASAC,gHAAAA,IAAAA,gBAqCAC,8KAAAA,IAAAA"}
|
package/lib/md/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/md/index.tsx"],"sourcesContent":["import { createEffect, For, Match, mergeProps, onCleanup, Show, Switch } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport mdStyle from '../md-style';\nimport theme, { block } from '../theme';\n\nimport { create, dispose } from './worker';\n\nimport '../code';\nimport '../img';\n\nfunction MD(_props: MdProps) {\n let ref: HTMLDivElement | undefined;\n const { baseStyle } = theme;\n const props = mergeProps(\n {\n pictureViewer: true,\n lazyPicture: true,\n text: '',\n tools: ['copy'],\n getAnchorContainer: () => window as unknown as HTMLElement,\n },\n _props,\n );\n const worker = new Worker(create());\n\n worker.addEventListener('message', update);\n function update(e: { data: string }) {\n if (ref) {\n ref.innerHTML = e.data;\n }\n }\n\n createEffect(() => {\n worker.postMessage({\n text: props.text,\n langToolbar: props.tools,\n pictureViewer: props.pictureViewer,\n lazyPicture: props.lazyPicture,\n });\n });\n onCleanup(() => {\n worker.removeEventListener('message', update);\n worker.terminate();\n dispose();\n });\n let list: HTMLAnchorElement[] = [];\n let heading: HTMLHeadingElement[] = [];\n const active: HTMLAnchorElement[] = [];\n\n function handleAnchor(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n const a = e.target as HTMLAnchorElement;\n\n if (a.hash) {\n ref?.querySelector(decodeURIComponent(a.hash))?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n list.forEach((item) => {\n item.classList.remove('active');\n });\n a.classList.add('active');\n } else {\n window.open(a.href);\n }\n }\n function observerEntry(entries: IntersectionObserverEntry[]) {\n entries.forEach((entry) => {\n const id = entry.target.getAttribute('id');\n const all = entry.target.querySelectorAll('a');\n let a: HTMLAnchorElement | undefined;\n\n list.forEach((l) => {\n if (l.hash === `#${id}`) {\n a = l;\n } else if (!l.hash) {\n all.forEach((e) => {\n if (e.href === l.href) {\n a = l;\n }\n });\n }\n });\n if (a) {\n const idx = active.indexOf(a);\n\n active.forEach((e) => {\n e.classList.remove('active');\n });\n if (entry.isIntersecting) {\n active.push(a);\n } else if (idx !== -1) {\n active.splice(idx, 1);\n }\n if (active[0]) {\n active[0].classList.add('active');\n active[0].offsetParent?.scrollTo({\n top: active[0].offsetTop,\n });\n }\n }\n });\n }\n createEffect(() => {\n let observer: IntersectionObserver;\n\n if (ref && props.text.startsWith('[TOC]')) {\n list = [...ref.querySelectorAll<HTMLAnchorElement>('.n-md-toc a[href]')];\n heading = [...ref.querySelectorAll<HTMLHeadingElement>('h1, h2, h3, h4, h5, h6')];\n observer = new IntersectionObserver(observerEntry, {\n rootMargin: '-50px 0px',\n threshold: 0.5,\n });\n heading.forEach((e) => {\n observer.observe(e);\n });\n list.forEach((e) => {\n e.addEventListener('click', handleAnchor);\n });\n }\n onCleanup(() => {\n if (observer) {\n heading.forEach((e) => {\n observer.unobserve(e);\n });\n observer.disconnect();\n }\n list.forEach((e) => {\n e.removeEventListener('click', handleAnchor);\n });\n });\n });\n\n return (\n <>\n <style textContent={baseStyle()} />\n <style textContent={mdStyle} />\n <Show when={props.css}>\n <style textContent={css(props.css)} />\n </Show>\n <Switch>\n <Match when={(props.children || []).length > 0}>\n <article class=\"n-md-box\" part=\"box\">\n <div class=\"n-md-body\" part=\"body\">\n <For each={props.children as []}>{(e) => e}</For>\n </div>\n </article>\n </Match>\n <Match when={props.text}>\n <article ref={ref} class={cx('n-md-box', props.class)} part=\"box\" />\n </Match>\n </Switch>\n </>\n );\n}\n\nexport interface MdProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** md内容 */\n text?: string;\n /** 开启图片查看器\n * @since 2.0.8\n * @default true\n */\n pictureViewer?: boolean;\n /** 开启图片懒加载\n * @since 2.8.3\n * @default true\n */\n lazyPicture?: boolean;\n /** 开启代码块工具条\n * @default ['copy']\n */\n tools?: 'copy'[];\n /** 指定滚动的容器\n * @default () => window\n */\n getAnchorContainer?: () => HTMLElement;\n /** 不进行解析\n * @default false\n */\n notRender?: boolean;\n children?: JSXElement;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n 'n-md',\n {\n class: void 0,\n pictureViewer: void 0,\n lazyPicture: void 0,\n text: void 0,\n tools: void 0,\n getAnchorContainer: void 0,\n css: void 0,\n children: void 0,\n notRender: void 0,\n },\n (_, opt) => {\n const el = opt.element;\n const props = mergeProps(\n {\n text: (!_.notRender && el.textContent) || el.text,\n css: el.css,\n tools: el.tools,\n getAnchorContainer: el.getAnchorContainer,\n },\n _,\n );\n\n createEffect(() => {\n clearAttribute(el, ['css', 'text']);\n el.replaceChildren();\n });\n return (\n <>\n <style textContent={block} />\n <MD {...props} />\n </>\n );\n },\n);\nexport default MD;\n"],"names":["MD","_props","ref","baseStyle","theme","props","mergeProps","pictureViewer","lazyPicture","text","tools","getAnchorContainer","window","worker","Worker","create","update","e","innerHTML","data","addEventListener","createEffect","postMessage","langToolbar","onCleanup","removeEventListener","terminate","dispose","list","heading","active","handleAnchor","preventDefault","stopPropagation","a","target","hash","querySelector","decodeURIComponent","scrollIntoView","behavior","block","forEach","item","classList","remove","add","open","href","observerEntry","entries","entry","id","getAttribute","all","querySelectorAll","l","idx","indexOf","isIntersecting","push","splice","offsetParent","scrollTo","top","offsetTop","observer","startsWith","IntersectionObserver","rootMargin","threshold","observe","unobserve","disconnect","mdStyle","Show","css","Switch","Match","children","length","For","cx","class","customElement","notRender","_","opt","el","element","textContent","clearAttribute","replaceChildren"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["components/md/index.tsx"],"sourcesContent":["import { createEffect, For, Match, mergeProps, onCleanup, Show, Switch } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport mdStyle from '../md-style';\nimport theme, { block } from '../theme';\n\nimport { create, dispose } from './worker';\n\nimport '../code';\nimport '../img';\n\nfunction MD(_props: MdProps) {\n let ref: HTMLDivElement | undefined;\n const { baseStyle } = theme;\n const props = mergeProps(\n {\n pictureViewer: true,\n lazyPicture: true,\n text: '',\n tools: ['copy'],\n getAnchorContainer: () => window as unknown as HTMLElement,\n },\n _props,\n );\n const worker = new Worker(create());\n\n worker.addEventListener('message', update);\n function update(e: { data: string }) {\n if (ref) {\n ref.innerHTML = e.data;\n }\n }\n\n createEffect(() => {\n worker.postMessage({\n text: props.text,\n langToolbar: props.tools,\n pictureViewer: props.pictureViewer,\n lazyPicture: props.lazyPicture,\n });\n });\n onCleanup(() => {\n worker.removeEventListener('message', update);\n worker.terminate();\n dispose();\n });\n let list: HTMLAnchorElement[] = [];\n let heading: HTMLHeadingElement[] = [];\n const active: HTMLAnchorElement[] = [];\n\n function handleAnchor(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n const a = e.target as HTMLAnchorElement;\n\n if (a.hash) {\n ref?.querySelector(decodeURIComponent(a.hash))?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n list.forEach((item) => {\n item.classList.remove('active');\n });\n a.classList.add('active');\n } else {\n window.open(a.href);\n }\n }\n function observerEntry(entries: IntersectionObserverEntry[]) {\n entries.forEach((entry) => {\n const id = entry.target.getAttribute('id');\n const all = entry.target.querySelectorAll('a');\n let a: HTMLAnchorElement | undefined;\n\n list.forEach((l) => {\n if (l.hash === `#${id}`) {\n a = l;\n } else if (!l.hash) {\n all.forEach((e) => {\n if (e.href === l.href) {\n a = l;\n }\n });\n }\n });\n if (a) {\n const idx = active.indexOf(a);\n\n active.forEach((e) => {\n e.classList.remove('active');\n });\n if (entry.isIntersecting) {\n active.push(a);\n } else if (idx !== -1) {\n active.splice(idx, 1);\n }\n if (active[0]) {\n active[0].classList.add('active');\n active[0].offsetParent?.scrollTo({\n top: active[0].offsetTop,\n });\n }\n }\n });\n }\n createEffect(() => {\n let observer: IntersectionObserver;\n\n if (ref && props.text.startsWith('[TOC]')) {\n list = [...ref.querySelectorAll<HTMLAnchorElement>('.n-md-toc a[href]')];\n heading = [...ref.querySelectorAll<HTMLHeadingElement>('h1, h2, h3, h4, h5, h6')];\n observer = new IntersectionObserver(observerEntry, {\n rootMargin: '-50px 0px',\n threshold: 0.5,\n });\n heading.forEach((e) => {\n observer.observe(e);\n });\n list.forEach((e) => {\n e.addEventListener('click', handleAnchor);\n });\n }\n onCleanup(() => {\n if (observer) {\n heading.forEach((e) => {\n observer.unobserve(e);\n });\n observer.disconnect();\n }\n list.forEach((e) => {\n e.removeEventListener('click', handleAnchor);\n });\n });\n });\n\n return (\n <>\n <style textContent={baseStyle()} />\n <style textContent={mdStyle} />\n <Show when={props.css}>\n <style textContent={css(props.css)} />\n </Show>\n <Switch>\n <Match when={((props.children as []) || []).length > 0}>\n <article class=\"n-md-box\" part=\"box\">\n <div class=\"n-md-body\" part=\"body\">\n <For each={props.children as []}>{(e) => e}</For>\n </div>\n </article>\n </Match>\n <Match when={props.text}>\n <article ref={ref} class={cx('n-md-box', props.class)} part=\"box\" />\n </Match>\n </Switch>\n </>\n );\n}\n\nexport interface MdProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** md内容 */\n text?: string;\n /** 开启图片查看器\n * @since 2.0.8\n * @default true\n */\n pictureViewer?: boolean;\n /** 开启图片懒加载\n * @since 2.8.3\n * @default true\n */\n lazyPicture?: boolean;\n /** 开启代码块工具条\n * @default ['copy']\n */\n tools?: 'copy'[];\n /** 指定滚动的容器\n * @default () => window\n */\n getAnchorContainer?: () => HTMLElement;\n /** 不进行解析\n * @default false\n */\n notRender?: boolean;\n children?: JSXElement;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n 'n-md',\n {\n class: void 0,\n pictureViewer: void 0,\n lazyPicture: void 0,\n text: void 0,\n tools: void 0,\n getAnchorContainer: void 0,\n css: void 0,\n children: void 0,\n notRender: void 0,\n },\n (_, opt) => {\n const el = opt.element;\n const props = mergeProps(\n {\n text: (!_.notRender && el.textContent) || el.text,\n css: el.css,\n tools: el.tools,\n getAnchorContainer: el.getAnchorContainer,\n },\n _,\n );\n\n createEffect(() => {\n clearAttribute(el, ['css', 'text']);\n el.replaceChildren();\n });\n return (\n <>\n <style textContent={block} />\n <MD {...props} />\n </>\n );\n },\n);\nexport default MD;\n"],"names":["MD","_props","ref","baseStyle","theme","props","mergeProps","pictureViewer","lazyPicture","text","tools","getAnchorContainer","window","worker","Worker","create","update","e","innerHTML","data","addEventListener","createEffect","postMessage","langToolbar","onCleanup","removeEventListener","terminate","dispose","list","heading","active","handleAnchor","preventDefault","stopPropagation","a","target","hash","querySelector","decodeURIComponent","scrollIntoView","behavior","block","forEach","item","classList","remove","add","open","href","observerEntry","entries","entry","id","getAttribute","all","querySelectorAll","l","idx","indexOf","isIntersecting","push","splice","offsetParent","scrollTo","top","offsetTop","observer","startsWith","IntersectionObserver","rootMargin","threshold","observe","unobserve","disconnect","mdStyle","Show","css","Switch","Match","children","length","For","cx","class","customElement","notRender","_","opt","el","element","textContent","clearAttribute","replaceChildren"],"mappings":"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"}
|
package/lib/menu/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return $}});const e=require("solid-js/web"),t=require("solid-js"),n=c(require("@moneko/common/lib/frameCallback")),r=c(require("@moneko/common/lib/isFunction")),l=require("@moneko/css"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return $}});const e=require("solid-js/web"),t=require("solid-js"),n=c(require("@moneko/common/lib/frameCallback")),r=c(require("@moneko/common/lib/isFunction")),l=require("@moneko/css"),s=require("solid-element"),i=require("../basic-config"),a=c(require("../get-options")),o=f(require("../theme")),u=require("./style");function c(e){return e&&e.__esModule?e:{default:e}}function d(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(d=function(e){return e?n:t})(e)}function f(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=d(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},l=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var s in e)if("default"!==s&&Object.prototype.hasOwnProperty.call(e,s)){var i=l?Object.getOwnPropertyDescriptor(e,s):null;i&&(i.get||i.set)?Object.defineProperty(r,s,i):r[s]=e[s]}return r.default=e,n&&n.set(e,r),r}const m=(0,e.template)('<span class="menu-icon" part="icon">'),p=(0,e.template)('<span class="menu-label">'),v=(0,e.template)('<span class="menu-suffix" part="suffix">'),g=(0,e.template)('<div class="sub-menu-children" part="sub-menu-children"><div>'),h=(0,e.template)('<div part="sub-menu"><span class="sub-menu-title"><span class="menu-arrow">'),b=(0,e.template)('<div><span class="menu-group-title">'),C=(0,e.template)('<div part="item">'),y=(0,e.template)("<style> "),_=(0,e.template)("<style>"),N=(0,e.template)('<section class="menu" part="menu">');function w(s){let c;let{isDark:d,baseStyle:f}=o.default,[w,$]=(0,t.splitProps)(s,["class","css","items","fieldNames","value","disabled","toggle","multiple","onChange","onOpenChange","openKeys"]),[E,O]=(0,t.createSignal)([]),[A,k]=(0,t.createSignal)([]),x=(0,t.createMemo)(()=>`:host {--sub-menu-bg: ${d()?"rgb(255 255 255 / 1%)":"rgb(0 0 0 / 1%)"} ;}`),M=(0,t.createMemo)(()=>Object.assign({},i.FieldName,w.fieldNames)),j=(0,t.createMemo)(()=>(0,a.default)(w.items,M()));function q(e){e.preventDefault(),e.stopPropagation()}function P(e,t){if(t.preventDefault(),!e.disabled&&!w.disabled){let t=[...E()],n=e[M().value];if(w.multiple){let e=t.indexOf(n);-1===e?t.push(n):t.splice(e,1)}else t=w.toggle&&t[0]===n?[]:[n];(0,r.default)(w.onChange)&&w.onChange(w.multiple?t:t[0],e),void 0===w.value&&O(t)}}function S(n){return(0,e.createComponent)(t.For,{get each(){return n.list},children:s=>{function i(){return[(0,e.createComponent)(t.Show,{get when(){return s[n.fieldNames.icon]},get children(){let t=m();return(0,e.insert)(t,()=>s[n.fieldNames.icon]),t}}),(()=>{let t=p();return(0,e.insert)(t,()=>s[n.fieldNames.label]),t})(),(0,e.createComponent)(t.Show,{get when(){return s[n.fieldNames.suffix]},get children(){let t=v();return(0,e.insert)(t,()=>s[n.fieldNames.suffix]),t}})]}function a(){let a=(0,t.createMemo)(()=>A().includes(s[n.fieldNames.value])),[o,u]=(0,t.createSignal)((0,t.untrack)(a));function c(e){q(e);let t=A();t=t.includes(s[n.fieldNames.value])?t.filter(e=>e!==s[n.fieldNames.value]):t.concat(s[n.fieldNames.value]),(0,r.default)(w.onOpenChange)&&w.onOpenChange(t),void 0===w.openKeys&&k(t)}function d(){let r;let[l,i]=(0,t.createSignal)();function o(){a()||u(!1)}return(0,t.createEffect)(()=>{i(r?.offsetHeight||0)}),(()=>{let t=g(),i=t.firstChild,a=r;return(0,e.addEventListener)(t,"animationend",o),"function"==typeof a?(0,e.use)(a,i):r=i,(0,e.insert)(i,(0,e.createComponent)(S,{get fieldNames(){return n.fieldNames},get list(){return s[n.fieldNames.children]}})),(0,e.effect)(()=>(l(),t.style.setProperty("--h",`${l()}px`))),t})()}return(0,t.createEffect)(()=>{a()&&u(!0)}),(()=>{let n=h(),r=n.firstChild,u=r.firstChild;return(0,e.addEventListener)(n,"mousedown",q,!0),(0,e.addEventListener)(r,"click",c,!0),(0,e.insert)(r,(0,e.createComponent)(i,{}),u),(0,e.insert)(n,(0,e.createComponent)(t.Show,{get when(){return o()},get children(){return(0,e.createComponent)(d,{})}}),null),(0,e.effect)(t=>{let r=(0,l.cx)("sub-menu",s.class),i=!!a(),o=!a();return r!==t._v$&&(0,e.className)(n,t._v$=r),i!==t._v$2&&n.classList.toggle("sub-menu-open",t._v$2=i),o!==t._v$3&&n.classList.toggle("sub-menu-close",t._v$3=o),t},{_v$:void 0,_v$2:void 0,_v$3:void 0}),n})()}return(0,e.createComponent)(t.Switch,{get fallback(){return(()=>{let t=C();return(0,e.addEventListener)(t,"click",P.bind(null,s),!0),(0,e.addEventListener)(t,"mousedown",q,!0),(0,e.insert)(t,(0,e.createComponent)(i,{})),(0,e.effect)(r=>{let i=(0,l.cx)("menu-item",s.class,s.type),a=s.handleClosed,o=w.disabled||s.disabled,u=E().includes(s[n.fieldNames.value]);return i!==r._v$4&&(0,e.className)(t,r._v$4=i),a!==r._v$5&&(0,e.setAttribute)(t,"handle-closed",r._v$5=a),o!==r._v$6&&(0,e.setAttribute)(t,"aria-disabled",r._v$6=o),u!==r._v$7&&(0,e.setAttribute)(t,"aria-selected",r._v$7=u),r},{_v$4:void 0,_v$5:void 0,_v$6:void 0,_v$7:void 0}),t})()},get children(){return[(0,e.createComponent)(t.Match,{get when(){return Array.isArray(s[n.fieldNames.children])},get children(){return(0,e.createComponent)(a,{})}}),(0,e.createComponent)(t.Match,{get when(){return Array.isArray(s[n.fieldNames.options])},get children(){let t=b(),r=t.firstChild;return(0,e.addEventListener)(t,"mousedown",q,!0),(0,e.insert)(r,(0,e.createComponent)(i,{})),(0,e.insert)(t,(0,e.createComponent)(S,{get fieldNames(){return n.fieldNames},get list(){return s[n.fieldNames.options]}}),null),(0,e.effect)(()=>(0,e.className)(t,(0,l.cx)("menu-group",s.class))),t}})]}})}})}return(0,t.createEffect)(()=>{void 0!==w.value&&null!==w.value?O(Array.isArray(w.value)?w.value:[w.value]):O([])}),(0,t.createEffect)(()=>{Array.isArray(w.openKeys)&&k(w.openKeys)}),(0,t.createEffect)(()=>{Array.isArray(E())&&E().length&&(0,n.default)(()=>{let e=c?.querySelector("[aria-selected=true]");if(e&&c){let t=e.offsetTop-c.offsetTop;t<c.scrollTop?c.scrollTo({top:t,behavior:"smooth"}):e.offsetTop+e.offsetHeight>c.scrollTop+c.offsetHeight+c.offsetTop&&c.scrollTo({top:t-c.offsetHeight+e.offsetHeight,behavior:"smooth"})}})}),[(()=>{let t=y(),n=t.firstChild;return(0,e.effect)(()=>n.data=f()),t})(),(()=>{let e=_();return e.textContent=u.style,e})(),(()=>{let t=y(),n=t.firstChild;return(0,e.effect)(()=>n.data=x()),t})(),(0,e.createComponent)(t.Show,{get when(){return w.css},get children(){let t=y(),n=t.firstChild;return(0,e.effect)(()=>n.data=(0,l.css)(w.css)),t}}),(()=>{let t=N(),n=c;return"function"==typeof n?(0,e.use)(n,t):c=t,(0,e.spread)(t,$,!1,!0),(0,e.insert)(t,(0,e.createComponent)(S,{get fieldNames(){return M()},get list(){return j()}})),t})()]}(0,s.customElement)("n-menu",{class:void 0,css:void 0,disabled:void 0,value:void 0,defaultValue:void 0,onOpenChange:void 0,openKeys:void 0,fieldNames:void 0,multiple:void 0,toggle:void 0,onChange:void 0,items:[]},(n,r)=>{let l=r.element,s={css:l.css,onChange(e,t){l.dispatchEvent(new CustomEvent("change",{detail:[e,t]}))},onOpenChange(e){l.dispatchEvent(new CustomEvent("openchange",{detail:e}))}},a=(0,t.mergeProps)(s,n);return(0,t.createEffect)(()=>{(0,i.clearAttribute)(l,["css","items","fieldNames"])}),[(()=>{let e=_();return e.textContent=o.block,e})(),(0,e.createComponent)(w,a)]});const $=w;(0,e.delegateEvents)(["click","mousedown"]);
|
package/lib/menu/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/menu/index.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n For,\n Match,\n mergeProps,\n Show,\n splitProps,\n Switch,\n untrack,\n} from 'solid-js';\nimport { frameCallback, isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BaseOption, BasicConfig, CustomElement } from '..';\nimport { clearAttribute, FieldName, type JSXElement } from '../basic-config';\nimport getOptions from '../get-options';\nimport theme, { block } from '../theme';\n\nimport { style } from './style';\n\nfunction Menu(props: MenuProps | MenuMultipleProps) {\n let ref: HTMLDivElement | undefined;\n const { isDark, baseStyle } = theme;\n const [local, other] = splitProps(props, [\n 'class',\n 'css',\n 'items',\n 'fieldNames',\n 'value',\n 'disabled',\n 'toggle',\n 'multiple',\n 'onChange',\n 'onOpenChange',\n 'openKeys',\n ]);\n const [value, setValue] = createSignal<(string | number)[]>([]);\n const [openKeys, setOpenKeys] = createSignal<(string | number)[]>([]);\n const cssVar = createMemo(\n () => `:host {--sub-menu-bg: ${isDark() ? 'rgb(255 255 255 / 1%)' : 'rgb(0 0 0 / 1%)'} ;}`,\n );\n const fieldNames = createMemo(() => Object.assign({}, FieldName, local.fieldNames));\n const options = createMemo(() => getOptions(local.items, fieldNames()));\n\n function preventDefault(e: MouseEvent) {\n e.preventDefault();\n e.stopPropagation();\n }\n\n function change(item: MenuOption, e: MouseEvent) {\n e.preventDefault();\n if (!item.disabled && !local.disabled) {\n let _value = [...value()];\n const key = item[fieldNames().value]!;\n\n if (local.multiple) {\n const idx = _value.indexOf(key);\n\n if (idx === -1) {\n _value.push(key);\n } else {\n _value.splice(idx, 1);\n }\n } else if (local.toggle && _value[0] === key) {\n _value = [];\n } else {\n _value = [key];\n }\n if (isFunction(local.onChange)) {\n local.onChange((local.multiple ? _value : _value[0]) as never, item);\n }\n if (typeof local.value === 'undefined') {\n setValue(_value);\n }\n }\n }\n\n interface RenderMenuProps {\n list: MenuOption[];\n fieldNames: { [key in keyof typeof FieldName]: string };\n }\n function RenderMenu(_: RenderMenuProps) {\n return (\n <For each={_.list}>\n {(item) => {\n function RowTitle() {\n return (\n <>\n <Show when={item[_.fieldNames.icon]}>\n <span class=\"menu-icon\" part=\"icon\">\n {item[_.fieldNames.icon]}\n </span>\n </Show>\n {item[_.fieldNames.label]}\n <span class=\"menu-suffix\" part=\"suffix\">\n {item[_.fieldNames.suffix]}\n </span>\n </>\n );\n }\n\n function SubMenu() {\n const isOpen = createMemo(() => openKeys().includes(item[_.fieldNames.value]));\n const [show, setShow] = createSignal<boolean>(untrack(isOpen));\n\n createEffect(() => {\n if (isOpen()) {\n setShow(true);\n }\n });\n function handleOpen(e: MouseEvent) {\n preventDefault(e);\n let _openKeys = openKeys();\n\n if (_openKeys.includes(item[_.fieldNames.value])) {\n _openKeys = _openKeys.filter((v) => v !== item[_.fieldNames.value]);\n } else {\n _openKeys = _openKeys.concat(item[_.fieldNames.value]);\n }\n\n if (isFunction(local.onOpenChange)) {\n local.onOpenChange(_openKeys);\n }\n if (local.openKeys === void 0) {\n setOpenKeys(_openKeys);\n }\n }\n function Child() {\n let el: HTMLDivElement | undefined;\n const [hei, setHei] = createSignal();\n\n createEffect(() => {\n setHei(el?.offsetHeight || 0);\n });\n function onAnimationEnd() {\n if (!isOpen()) {\n setShow(false);\n }\n }\n return (\n <div\n class=\"sub-menu-children\"\n part=\"sub-menu-children\"\n style={{\n '--h': `${hei()}px`,\n }}\n onAnimationEnd={onAnimationEnd}\n >\n <div ref={el}>\n <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.children]} />\n </div>\n </div>\n );\n }\n\n return (\n <div\n class={cx('sub-menu', item.class)}\n classList={{\n 'sub-menu-open': isOpen(),\n 'sub-menu-close': !isOpen(),\n }}\n part=\"sub-menu\"\n onMouseDown={preventDefault}\n >\n <span class=\"sub-menu-title\" onClick={handleOpen}>\n <RowTitle />\n <span class=\"menu-arrow\" />\n </span>\n <Show when={show()}>\n <Child />\n </Show>\n </div>\n );\n }\n return (\n <Switch\n fallback={\n <div\n class={cx('menu-item', item.class, item.type)}\n part=\"item\"\n handle-closed={item.handleClosed}\n aria-disabled={local.disabled || item.disabled}\n aria-selected={value().includes(item[_.fieldNames.value])}\n onMouseDown={preventDefault}\n onClick={change.bind(null, item)}\n >\n <RowTitle />\n </div>\n }\n >\n <Match when={Array.isArray(item[_.fieldNames.children])}>\n <SubMenu />\n </Match>\n <Match when={Array.isArray(item[_.fieldNames.options])}>\n <div class={cx('menu-group', item.class)} onMouseDown={preventDefault}>\n <span class=\"menu-group-title\">\n <RowTitle />\n </span>\n <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.options]} />\n </div>\n </Match>\n </Switch>\n );\n }}\n </For>\n );\n }\n\n createEffect(() => {\n if (local.value !== void 0 && local.value !== null) {\n setValue(Array.isArray(local.value) ? local.value : [local.value]);\n } else {\n setValue([]);\n }\n });\n createEffect(() => {\n if (Array.isArray(local.openKeys)) {\n setOpenKeys(local.openKeys);\n }\n });\n\n createEffect(() => {\n if (Array.isArray(value()) && value().length) {\n frameCallback(() => {\n const el = ref?.querySelector<HTMLElement>('[aria-selected=true]');\n\n if (el && ref) {\n const next = el.offsetTop - ref.offsetTop;\n\n if (next < ref.scrollTop) {\n ref.scrollTo({\n top: next,\n behavior: 'smooth',\n });\n } else if (\n el.offsetTop + el.offsetHeight >\n ref.scrollTop + ref.offsetHeight + ref.offsetTop\n ) {\n ref.scrollTo({\n top: next - ref.offsetHeight + el.offsetHeight,\n behavior: 'smooth',\n });\n }\n }\n });\n }\n });\n return (\n <>\n <style textContent={baseStyle()} />\n <style textContent={style} />\n <style textContent={cssVar()} />\n <Show when={local.css}>\n <style textContent={css(local.css)} />\n </Show>\n <section ref={ref} class=\"menu\" part=\"menu\" {...other}>\n <RenderMenu fieldNames={fieldNames()} list={options()} />\n </section>\n </>\n );\n}\n\nexport interface BaseMenuProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 菜单展开的keys */\n openKeys?: (string | number)[];\n /** 菜单展开时触发的方法 */\n onOpenChange?: (keys: (string | number)[]) => void;\n /** 选项数据 */\n items?: (string | MenuOption)[];\n /** 自定义节点 'label'、'value'、'options' 的字段 */\n fieldNames?: BasicConfig['fieldName'];\n /** 不可用状态 */\n disabled?: boolean;\n /** 可以取消 */\n toggle?: boolean;\n}\n\nexport interface MenuProps extends BaseMenuProps {\n /** 值修改时的回调方法 */\n onChange?(val: string | number, item: MenuOption): void;\n /** 值 */\n value?: string | number;\n /** 默认值 */\n defaultValue?: string | number;\n /** 可多选\n * @default false\n */\n multiple?: false | never;\n}\n\nexport interface MenuMultipleProps extends BaseMenuProps {\n /** 可多选\n * @default true\n */\n multiple: true;\n /** 值修改时的回调方法 */\n onChange?(val: (string | number)[], item: MenuOption): void;\n /** 值 */\n value?: (string | number)[];\n /** 默认值 */\n defaultValue?: (string | number)[];\n}\n\n/** 菜单选项 */\nexport interface MenuOption extends Omit<BaseOption, 'children' | 'options'> {\n /** 图标 */\n icon?: JSXElement;\n /** 内置类型(状态) */\n type?: 'primary' | 'success' | 'error' | 'warning';\n /** 自定义颜色 */\n color?: string;\n /** 子菜单 */\n children?: (string | MenuOption)[];\n /** 分组子选项 */\n options?: (string | MenuOption)[];\n}\n\nexport type MenuElement = CustomElement<MenuProps, 'onChange' | 'onOpenChange'>;\nexport type MenuMultipleElement = CustomElement<MenuMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<MenuProps>(\n 'n-menu',\n {\n class: void 0,\n css: void 0,\n disabled: void 0,\n value: void 0,\n defaultValue: void 0,\n onOpenChange: void 0,\n openKeys: void 0,\n fieldNames: void 0,\n multiple: void 0,\n toggle: void 0,\n onChange: void 0,\n items: [],\n },\n (_, opt) => {\n const el = opt.element;\n const defaultProps: Partial<MenuProps> = {\n css: el.css,\n onChange(key, item) {\n el.dispatchEvent(\n new CustomEvent('change', {\n detail: [key, item],\n }),\n );\n },\n onOpenChange(keys) {\n el.dispatchEvent(\n new CustomEvent('openchange', {\n detail: keys,\n }),\n );\n },\n };\n const props = mergeProps(defaultProps, _);\n\n createEffect(() => {\n clearAttribute(el, ['css', 'items', 'fieldNames']);\n });\n return (\n <>\n <style textContent={block} />\n <Menu {...props} />\n </>\n );\n },\n);\n\nexport default Menu;\n"],"names":["Menu","props","ref","isDark","baseStyle","theme","local","other","splitProps","value","setValue","createSignal","openKeys","setOpenKeys","cssVar","createMemo","fieldNames","Object","assign","FieldName","options","getOptions","items","preventDefault","e","stopPropagation","change","item","disabled","_value","key","multiple","idx","indexOf","push","splice","toggle","isFunction","onChange","RenderMenu","_","For","list","RowTitle","Show","icon","label","suffix","SubMenu","isOpen","includes","show","setShow","untrack","handleOpen","_openKeys","filter","v","concat","onOpenChange","Child","el","hei","setHei","onAnimationEnd","createEffect","offsetHeight","children","cx","class","Switch","bind","type","handleClosed","Match","Array","isArray","length","frameCallback","querySelector","next","offsetTop","scrollTop","scrollTo","top","behavior","style","css","customElement","defaultValue","opt","element","defaultProps","dispatchEvent","CustomEvent","detail","keys","mergeProps","clearAttribute","block"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["components/menu/index.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n For,\n Match,\n mergeProps,\n Show,\n splitProps,\n Switch,\n untrack,\n} from 'solid-js';\nimport { frameCallback, isFunction } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BaseOption, BasicConfig, CustomElement } from '..';\nimport { clearAttribute, FieldName, type JSXElement } from '../basic-config';\nimport getOptions from '../get-options';\nimport theme, { block } from '../theme';\n\nimport { style } from './style';\n\nfunction Menu(props: MenuProps | MenuMultipleProps) {\n let ref: HTMLDivElement | undefined;\n const { isDark, baseStyle } = theme;\n const [local, other] = splitProps(props, [\n 'class',\n 'css',\n 'items',\n 'fieldNames',\n 'value',\n 'disabled',\n 'toggle',\n 'multiple',\n 'onChange',\n 'onOpenChange',\n 'openKeys',\n ]);\n const [value, setValue] = createSignal<(string | number)[]>([]);\n const [openKeys, setOpenKeys] = createSignal<(string | number)[]>([]);\n const cssVar = createMemo(\n () => `:host {--sub-menu-bg: ${isDark() ? 'rgb(255 255 255 / 1%)' : 'rgb(0 0 0 / 1%)'} ;}`,\n );\n const fieldNames = createMemo(() => Object.assign({}, FieldName, local.fieldNames));\n const options = createMemo(() => getOptions(local.items, fieldNames()));\n\n function preventDefault(e: MouseEvent) {\n e.preventDefault();\n e.stopPropagation();\n }\n\n function change(item: MenuOption, e: MouseEvent) {\n e.preventDefault();\n if (!item.disabled && !local.disabled) {\n let _value = [...value()];\n const key = item[fieldNames().value]!;\n\n if (local.multiple) {\n const idx = _value.indexOf(key);\n\n if (idx === -1) {\n _value.push(key);\n } else {\n _value.splice(idx, 1);\n }\n } else if (local.toggle && _value[0] === key) {\n _value = [];\n } else {\n _value = [key];\n }\n if (isFunction(local.onChange)) {\n local.onChange((local.multiple ? _value : _value[0]) as never, item);\n }\n if (typeof local.value === 'undefined') {\n setValue(_value);\n }\n }\n }\n\n interface RenderMenuProps {\n list: MenuOption[];\n fieldNames: { [key in keyof typeof FieldName]: string };\n }\n function RenderMenu(_: RenderMenuProps) {\n return (\n <For each={_.list}>\n {(item) => {\n function RowTitle() {\n return (\n <>\n <Show when={item[_.fieldNames.icon]}>\n <span class=\"menu-icon\" part=\"icon\">\n {item[_.fieldNames.icon]}\n </span>\n </Show>\n <span class=\"menu-label\">{item[_.fieldNames.label]}</span>\n <Show when={item[_.fieldNames.suffix]}>\n <span class=\"menu-suffix\" part=\"suffix\">\n {item[_.fieldNames.suffix]}\n </span>\n </Show>\n </>\n );\n }\n\n function SubMenu() {\n const isOpen = createMemo(() => openKeys().includes(item[_.fieldNames.value]));\n const [show, setShow] = createSignal<boolean>(untrack(isOpen));\n\n createEffect(() => {\n if (isOpen()) {\n setShow(true);\n }\n });\n function handleOpen(e: MouseEvent) {\n preventDefault(e);\n let _openKeys = openKeys();\n\n if (_openKeys.includes(item[_.fieldNames.value])) {\n _openKeys = _openKeys.filter((v) => v !== item[_.fieldNames.value]);\n } else {\n _openKeys = _openKeys.concat(item[_.fieldNames.value]);\n }\n\n if (isFunction(local.onOpenChange)) {\n local.onOpenChange(_openKeys);\n }\n if (local.openKeys === void 0) {\n setOpenKeys(_openKeys);\n }\n }\n function Child() {\n let el: HTMLDivElement | undefined;\n const [hei, setHei] = createSignal();\n\n createEffect(() => {\n setHei(el?.offsetHeight || 0);\n });\n function onAnimationEnd() {\n if (!isOpen()) {\n setShow(false);\n }\n }\n return (\n <div\n class=\"sub-menu-children\"\n part=\"sub-menu-children\"\n style={{\n '--h': `${hei()}px`,\n }}\n onAnimationEnd={onAnimationEnd}\n >\n <div ref={el}>\n <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.children]} />\n </div>\n </div>\n );\n }\n\n return (\n <div\n class={cx('sub-menu', item.class)}\n classList={{\n 'sub-menu-open': isOpen(),\n 'sub-menu-close': !isOpen(),\n }}\n part=\"sub-menu\"\n onMouseDown={preventDefault}\n >\n <span class=\"sub-menu-title\" onClick={handleOpen}>\n <RowTitle />\n <span class=\"menu-arrow\" />\n </span>\n <Show when={show()}>\n <Child />\n </Show>\n </div>\n );\n }\n return (\n <Switch\n fallback={\n <div\n class={cx('menu-item', item.class, item.type)}\n part=\"item\"\n handle-closed={item.handleClosed}\n aria-disabled={local.disabled || item.disabled}\n aria-selected={value().includes(item[_.fieldNames.value])}\n onMouseDown={preventDefault}\n onClick={change.bind(null, item)}\n >\n <RowTitle />\n </div>\n }\n >\n <Match when={Array.isArray(item[_.fieldNames.children])}>\n <SubMenu />\n </Match>\n <Match when={Array.isArray(item[_.fieldNames.options])}>\n <div class={cx('menu-group', item.class)} onMouseDown={preventDefault}>\n <span class=\"menu-group-title\">\n <RowTitle />\n </span>\n <RenderMenu fieldNames={_.fieldNames} list={item[_.fieldNames.options]} />\n </div>\n </Match>\n </Switch>\n );\n }}\n </For>\n );\n }\n\n createEffect(() => {\n if (local.value !== void 0 && local.value !== null) {\n setValue(Array.isArray(local.value) ? local.value : [local.value]);\n } else {\n setValue([]);\n }\n });\n createEffect(() => {\n if (Array.isArray(local.openKeys)) {\n setOpenKeys(local.openKeys);\n }\n });\n\n createEffect(() => {\n if (Array.isArray(value()) && value().length) {\n frameCallback(() => {\n const el = ref?.querySelector<HTMLElement>('[aria-selected=true]');\n\n if (el && ref) {\n const next = el.offsetTop - ref.offsetTop;\n\n if (next < ref.scrollTop) {\n ref.scrollTo({\n top: next,\n behavior: 'smooth',\n });\n } else if (\n el.offsetTop + el.offsetHeight >\n ref.scrollTop + ref.offsetHeight + ref.offsetTop\n ) {\n ref.scrollTo({\n top: next - ref.offsetHeight + el.offsetHeight,\n behavior: 'smooth',\n });\n }\n }\n });\n }\n });\n return (\n <>\n <style textContent={baseStyle()} />\n <style textContent={style} />\n <style textContent={cssVar()} />\n <Show when={local.css}>\n <style textContent={css(local.css)} />\n </Show>\n <section ref={ref} class=\"menu\" part=\"menu\" {...other}>\n <RenderMenu fieldNames={fieldNames()} list={options()} />\n </section>\n </>\n );\n}\n\nexport interface BaseMenuProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 菜单展开的keys */\n openKeys?: (string | number)[];\n /** 菜单展开时触发的方法 */\n onOpenChange?: (keys: (string | number)[]) => void;\n /** 选项数据 */\n items?: (string | MenuOption)[];\n /** 自定义节点 'label'、'value'、'options' 的字段 */\n fieldNames?: BasicConfig['fieldName'];\n /** 不可用状态 */\n disabled?: boolean;\n /** 可以取消 */\n toggle?: boolean;\n}\n\nexport interface MenuProps extends BaseMenuProps {\n /** 值修改时的回调方法 */\n onChange?(val: string | number, item: MenuOption): void;\n /** 值 */\n value?: string | number;\n /** 默认值 */\n defaultValue?: string | number;\n /** 可多选\n * @default false\n */\n multiple?: false | never;\n}\n\nexport interface MenuMultipleProps extends BaseMenuProps {\n /** 可多选\n * @default true\n */\n multiple: true;\n /** 值修改时的回调方法 */\n onChange?(val: (string | number)[], item: MenuOption): void;\n /** 值 */\n value?: (string | number)[];\n /** 默认值 */\n defaultValue?: (string | number)[];\n}\n\n/** 菜单选项 */\nexport interface MenuOption extends Omit<BaseOption, 'children' | 'options'> {\n /** 图标 */\n icon?: JSXElement;\n /** 内置类型(状态) */\n type?: 'primary' | 'success' | 'error' | 'warning';\n /** 自定义颜色 */\n color?: string;\n /** 子菜单 */\n children?: (string | MenuOption)[];\n /** 分组子选项 */\n options?: (string | MenuOption)[];\n}\n\nexport type MenuElement = CustomElement<MenuProps, 'onChange' | 'onOpenChange'>;\nexport type MenuMultipleElement = CustomElement<MenuMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<MenuProps>(\n 'n-menu',\n {\n class: void 0,\n css: void 0,\n disabled: void 0,\n value: void 0,\n defaultValue: void 0,\n onOpenChange: void 0,\n openKeys: void 0,\n fieldNames: void 0,\n multiple: void 0,\n toggle: void 0,\n onChange: void 0,\n items: [],\n },\n (_, opt) => {\n const el = opt.element;\n const defaultProps: Partial<MenuProps> = {\n css: el.css,\n onChange(key, item) {\n el.dispatchEvent(\n new CustomEvent('change', {\n detail: [key, item],\n }),\n );\n },\n onOpenChange(keys) {\n el.dispatchEvent(\n new CustomEvent('openchange', {\n detail: keys,\n }),\n );\n },\n };\n const props = mergeProps(defaultProps, _);\n\n createEffect(() => {\n clearAttribute(el, ['css', 'items', 'fieldNames']);\n });\n return (\n <>\n <style textContent={block} />\n <Menu {...props} />\n </>\n );\n },\n);\n\nexport default Menu;\n"],"names":["Menu","props","ref","isDark","baseStyle","theme","local","other","splitProps","value","setValue","createSignal","openKeys","setOpenKeys","cssVar","createMemo","fieldNames","Object","assign","FieldName","options","getOptions","items","preventDefault","e","stopPropagation","change","item","disabled","_value","key","multiple","idx","indexOf","push","splice","toggle","isFunction","onChange","RenderMenu","_","For","list","RowTitle","Show","icon","label","suffix","SubMenu","isOpen","includes","show","setShow","untrack","handleOpen","_openKeys","filter","v","concat","onOpenChange","Child","el","hei","setHei","onAnimationEnd","createEffect","offsetHeight","children","cx","class","Switch","bind","type","handleClosed","Match","Array","isArray","length","frameCallback","querySelector","next","offsetTop","scrollTop","scrollTo","top","behavior","style","css","customElement","defaultValue","opt","element","defaultProps","dispatchEvent","CustomEvent","detail","keys","mergeProps","clearAttribute","block"],"mappings":"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"}
|
package/lib/menu/style.js
CHANGED
package/lib/menu/style.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/menu/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n .menu {\n --menu-selection: var(--primary-selection);\n\n max-block-size: 100%;\n display: block;\n overflow-y: auto;\n color: var(--text-color);\n\n ${['primary', 'success', 'error', 'warning']\n .map(\n (s) =>\n `.${s} {--text-color: var(--${s}-color);--text-heading: var(--${s}-color);--text-secondary: var(--${s}-secondary);--component-bg: var(--${s}-details-bg);--menu-selection: var(--${s}-selection);}`,\n )\n .join('')}\n }\n\n .menu-item,\n .menu-group,\n .sub-menu {\n border-radius: calc(var(--border-radius) / 1.5);\n transition:\n 0.3s background-color var(--transition-timing-function),\n 0.3s color var(--transition-timing-function);\n box-sizing: border-box;\n line-height: 1.57;\n }\n\n .menu-icon {\n font-size: var(--font-size);\n }\n\n .menu-group {\n position: relative;\n }\n\n .menu-group-title {\n position: sticky;\n z-index: 1;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 5px;\n font-size: 12px;\n color: var(--text-secondary);\n inset-block-start: -2px;\n column-gap: 5px;\n }\n\n .menu-suffix {\n text-align: end;\n color: var(--text-secondary);\n
|
|
1
|
+
{"version":3,"sources":["components/menu/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n .menu {\n --menu-selection: var(--primary-selection);\n\n max-block-size: 100%;\n display: block;\n overflow-y: auto;\n color: var(--text-color);\n\n ${['primary', 'success', 'error', 'warning']\n .map(\n (s) =>\n `.${s} {--text-color: var(--${s}-color);--text-heading: var(--${s}-color);--text-secondary: var(--${s}-secondary);--component-bg: var(--${s}-details-bg);--menu-selection: var(--${s}-selection);}`,\n )\n .join('')}\n }\n\n .menu-item,\n .menu-group,\n .sub-menu {\n border-radius: calc(var(--border-radius) / 1.5);\n transition:\n 0.3s background-color var(--transition-timing-function),\n 0.3s color var(--transition-timing-function);\n box-sizing: border-box;\n line-height: 1.57;\n }\n\n .menu-icon {\n font-size: var(--font-size);\n }\n\n .menu-group {\n position: relative;\n }\n\n .menu-group-title {\n position: sticky;\n z-index: 1;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 5px;\n font-size: 12px;\n color: var(--text-secondary);\n inset-block-start: -2px;\n column-gap: 5px;\n }\n\n .menu-label {\n flex: 1;\n }\n\n .menu-suffix {\n text-align: end;\n color: var(--text-secondary);\n }\n\n .sub-menu-title {\n display: flex;\n align-items: center;\n border-radius: calc(var(--border-radius) / 1.5);\n padding: 5px 12px;\n column-gap: 5px;\n transition: box-shadow var(--transition-duration) var(--transition-timing-function);\n\n &:hover:not(&[aria-disabled]:not([aria-disabled='false'])) {\n &:not([aria-selected='true'], .error) {\n background-color: var(--disable-bg);\n }\n }\n\n > .menu-arrow {\n position: relative;\n display: block;\n inline-size: 12px;\n block-size: 1.5px;\n pointer-events: none;\n color: var(--text-color);\n opacity: 0.5;\n margin-inline-start: 5px;\n\n &::after,\n &::before {\n position: absolute;\n border-radius: 2px;\n background-color: currentcolor;\n transition:\n transform var(--transition-duration) var(--transition-timing-function),\n color var(--transition-duration) var(--transition-timing-function);\n inline-size: 6px;\n block-size: 1.5px;\n content: '';\n }\n }\n }\n\n .sub-menu {\n cursor: pointer;\n\n &:has([aria-selected='true']) > span {\n color: var(--text-heading);\n }\n }\n\n .sub-menu-children {\n border-radius: calc(var(--border-radius) / 1.5);\n background-color: var(--sub-menu-bg);\n transform-origin: top;\n\n > div {\n padding: 5px 12px;\n }\n }\n\n .sub-menu-open {\n > .sub-menu-children {\n animation: menu-open var(--transition-duration) var(--transition-timing-function) forwards;\n }\n\n > span.sub-menu-title {\n box-shadow: 0 10px 5px 0 rgb(0 0 0 / 1%);\n\n > .menu-arrow {\n &::after {\n transform: rotate(-45deg) translate3d(-1.5px, -1px, 1px);\n }\n\n &::before {\n transform: rotate(45deg) translate3d(1.5px, -1px, 1px);\n }\n }\n }\n }\n\n .sub-menu-close {\n > .sub-menu-children {\n animation: menu-close var(--transition-duration) var(--transition-timing-function) forwards;\n }\n\n > span.sub-menu-title {\n box-shadow: 0 0 0 0 rgb(0 0 0 / 0%);\n\n > .menu-arrow {\n &::after {\n transform: rotate(45deg) translate3d(-1px, 2px, 1px);\n }\n\n &::before {\n transform: rotate(-45deg) translate3d(1px, 2px, 1px);\n }\n }\n }\n }\n\n .menu-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 5px 12px;\n cursor: pointer;\n column-gap: 5px;\n color: var(--text-color);\n\n &:hover:not(&[aria-disabled]:not([aria-disabled='false'])) {\n &:not([aria-selected='true']) {\n color: var(--text-heading);\n background-color: var(--disable-bg);\n }\n }\n\n &[aria-disabled]:not([aria-disabled='false']) {\n cursor: not-allowed;\n color: var(--disable-color);\n }\n\n &[aria-selected='true'] {\n color: var(--text-heading);\n background-color: var(--menu-selection);\n\n & + & {\n border-start-end-radius: 0;\n border-start-start-radius: 0;\n }\n\n &:has(+ &[aria-selected='true']) {\n border-end-end-radius: 0;\n border-end-start-radius: 0;\n }\n }\n }\n\n @keyframes menu-open {\n from {\n transform: scaleY(0);\n block-size: 0;\n opacity: 0;\n }\n\n to {\n transform: scaleY(1);\n block-size: var(--h);\n opacity: 1;\n }\n }\n\n @keyframes menu-close {\n from {\n transform: scaleY(1);\n block-size: var(--h);\n opacity: 1;\n }\n\n to {\n transform: scaleY(0);\n block-size: 0;\n opacity: 0;\n }\n }\n`;\n"],"names":["style","css","map","s","join"],"mappings":"kGAEaA,6CAAAA,qBAFO,eAEPA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;IASrB,EAAE,CAAC,UAAW,UAAW,QAAS,UAAU,CACzCC,GAAG,CACF,AAACC,GACC,CAAC,CAAC,EAAEA,EAAE,sBAAsB,EAAEA,EAAE,8BAA8B,EAAEA,EAAE,gCAAgC,EAAEA,EAAE,kCAAkC,EAAEA,EAAE,qCAAqC,EAAEA,EAAE,aAAa,CAAC,EAEtMC,IAAI,CAAC,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6MhB,CAAC"}
|
package/lib/popover/index.d.ts
CHANGED
|
@@ -6,7 +6,7 @@ export interface PopoverProps {
|
|
|
6
6
|
/** 自定义样式表 */
|
|
7
7
|
css?: string;
|
|
8
8
|
/** 内容 */
|
|
9
|
-
content?:
|
|
9
|
+
content?: JSXElement;
|
|
10
10
|
/** 挂载到指定的元素,值为一个返回对应 DOM 元素 默认 document.body */
|
|
11
11
|
getPopupContainer?: (node?: HTMLElement | null) => HTMLElement;
|
|
12
12
|
/** 触发行为
|
package/lib/popover/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/popover/index.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n Show,\n splitProps,\n} from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { isElementInside, isEqual, isFunction, passiveSupported } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BasicConfig, CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport Empty from '../empty';\nimport theme, { inline } from '../theme';\n\nimport { popoverCss, portalCss } from './style';\n\nexport interface PopoverProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 内容 */\n content?: (() => JSXElement) | JSXElement;\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?: JSXElement;\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\ninterface Posi {\n left?: number;\n top?: number;\n right?: number;\n bottom?: number;\n '--x'?: number;\n}\n\ninterface 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 && (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 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: ${isDark() ? '#1f1f1f' : 'var(--component-bg)'};--popover-shadow-color: rgb(0 0 0 / 5%);position: absolute;}`;\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 textContent={popoverCss} />\n <Show when={local.css}>\n <style textContent={css(local.css)} />\n </Show>\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 textContent={baseStyle()} />\n <style textContent={portalCss} />\n <style textContent={hostStyle()} />\n <style textContent={portalStyle()} />\n <style textContent={width()} />\n <Show when={local.popupCss}>\n <style textContent={css(local.popupCss)} />\n </Show>\n <div ref={ref} onAnimationEnd={exit} class={portalCls()} {...childrenProps()}>\n <Show when={local.content} fallback={<Empty />}>\n <Show when={typeof local.content === 'string'} fallback={local.content}>\n {/* eslint-disable-next-line solid/no-innerhtml */}\n <div innerHTML={local.content} />\n </Show>\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 { baseStyle } = theme;\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 clearAttribute(el, ['content', 'popupCss', 'css']);\n });\n return (\n <>\n <style textContent={inline} />\n <style textContent={baseStyle()} />\n <Popover {...props} />\n </>\n );\n});\nexport default Popover;\n"],"names":["defaultProps","Popover","props","ref","childRef","closeTimer","portalTimer","isDark","baseStyle","theme","mp","mergeProps","trigger","local","splitProps","open","setOpen","createSignal","posi","setPosi","up","setUp","width","setWidth","openChange","next","disabled","onOpenChange","exit","close","e","clearTimeout","setTimeout","target","getAttribute","isContains","isElementInside","type","createEffect","dropdownMatchSelectWidth","offsetWidth","showPortal","elRect","getBoundingClientRect","portalRect","offsetX","margin","window","innerHeight","bottom","_placement","placement","_isBottom","startsWith","offsetHeight","top","arrowHeight","arrow","_posi","left","right","Math","abs","prev","isEqual","handleOpen","stopPropagation","preventDefault","clientX","clientY","container","createMemo","isFunction","getPopupContainer","document","body","childrenProps","_props","openFn","openEvent","click","hover","contextMenu","none","closeFn","closeEvent","Object","assign","portalStyle","p","keys","map","k","join","portalCls","cx","size","popupClass","hostStyle","addEventListener","passive","passiveSupported","onCleanup","removeEventListener","onMount","documentElement","popoverCss","Show","css","class","children","destroyInactive","Portal","portalCss","popupCss","content","Empty","TriggerOption","Placement","customElement","_","opt","el","element","dispatchEvent","CustomEvent","detail","childNodes","values","clearAttribute","inline"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["components/popover/index.tsx"],"sourcesContent":["import {\n createEffect,\n createMemo,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n Show,\n splitProps,\n} from 'solid-js';\nimport { Portal } from 'solid-js/web';\nimport { isElementInside, isEqual, isFunction, passiveSupported } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BasicConfig, CustomElement } from '..';\nimport { clearAttribute, type JSXElement } from '../basic-config';\nimport Empty from '../empty';\nimport theme, { inline } from '../theme';\n\nimport { popoverCss, portalCss } from './style';\n\nexport interface PopoverProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 内容 */\n content?: JSXElement;\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?: JSXElement;\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\ninterface Posi {\n left?: number;\n top?: number;\n right?: number;\n bottom?: number;\n '--x'?: number;\n}\n\ninterface 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 && (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 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: ${isDark() ? '#1f1f1f' : 'var(--component-bg)'};--popover-shadow-color: rgb(0 0 0 / 5%);position: absolute;}`;\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 textContent={popoverCss} />\n <Show when={local.css}>\n <style textContent={css(local.css)} />\n </Show>\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 textContent={baseStyle()} />\n <style textContent={portalCss} />\n <style textContent={hostStyle()} />\n <style textContent={portalStyle()} />\n <style textContent={width()} />\n <Show when={local.popupCss}>\n <style textContent={css(local.popupCss)} />\n </Show>\n <div ref={ref} onAnimationEnd={exit} class={portalCls()} {...childrenProps()}>\n <Show when={local.content} fallback={<Empty />}>\n <Show when={typeof local.content === 'string'} fallback={local.content}>\n {/* eslint-disable-next-line solid/no-innerhtml */}\n <div innerHTML={local.content as string} />\n </Show>\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 { baseStyle } = theme;\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 clearAttribute(el, ['content', 'popupCss', 'css']);\n });\n return (\n <>\n <style textContent={inline} />\n <style textContent={baseStyle()} />\n <Popover {...props} />\n </>\n );\n});\nexport default Popover;\n"],"names":["defaultProps","Popover","props","ref","childRef","closeTimer","portalTimer","isDark","baseStyle","theme","mp","mergeProps","trigger","local","splitProps","open","setOpen","createSignal","posi","setPosi","up","setUp","width","setWidth","openChange","next","disabled","onOpenChange","exit","close","e","clearTimeout","setTimeout","target","getAttribute","isContains","isElementInside","type","createEffect","dropdownMatchSelectWidth","offsetWidth","showPortal","elRect","getBoundingClientRect","portalRect","offsetX","margin","window","innerHeight","bottom","_placement","placement","_isBottom","startsWith","offsetHeight","top","arrowHeight","arrow","_posi","left","right","Math","abs","prev","isEqual","handleOpen","stopPropagation","preventDefault","clientX","clientY","container","createMemo","isFunction","getPopupContainer","document","body","childrenProps","_props","openFn","openEvent","click","hover","contextMenu","none","closeFn","closeEvent","Object","assign","portalStyle","p","keys","map","k","join","portalCls","cx","size","popupClass","hostStyle","addEventListener","passive","passiveSupported","onCleanup","removeEventListener","onMount","documentElement","popoverCss","Show","css","class","children","destroyInactive","Portal","portalCss","popupCss","content","Empty","TriggerOption","Placement","customElement","_","opt","el","element","dispatchEvent","CustomEvent","detail","childNodes","values","clearAttribute","inline"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "neko-ui",
|
|
3
|
-
"version": "2.9.8-beta.
|
|
3
|
+
"version": "2.9.8-beta.3",
|
|
4
4
|
"description": "WebComponents UI Libraries",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"@testing-library/jest-dom": "6.6.3",
|
|
62
62
|
"@types/jest": "29.5.14",
|
|
63
63
|
"@types/prismjs": "1.26.5",
|
|
64
|
-
"eslint-config-neko": "3.0.
|
|
64
|
+
"eslint-config-neko": "3.0.4",
|
|
65
65
|
"eslint-plugin-solid": "0.14.5",
|
|
66
66
|
"husky": "9.1.7",
|
|
67
67
|
"jest": "29.7.0",
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
"dependencies": {
|
|
74
74
|
"@moneko/common": "1.7.0",
|
|
75
75
|
"@moneko/css": "1.1.5",
|
|
76
|
-
"custom-element-type": "1.0.
|
|
76
|
+
"custom-element-type": "1.0.5",
|
|
77
77
|
"dayjs": "1.11.13",
|
|
78
78
|
"marked-completed": "1.2.14",
|
|
79
79
|
"prismjs": "1.29.0",
|