neko-ui 2.8.2 → 2.8.4
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/code/index.d.ts +0 -1
- package/es/code/index.js +1 -1
- package/es/code/index.js.map +1 -1
- package/es/code/worker.js +1 -1
- package/es/code/worker.js.map +1 -1
- package/es/img/index.d.ts +5 -0
- package/es/img/index.js +1 -1
- package/es/img/index.js.map +1 -1
- package/es/index.d.ts +1 -0
- package/es/index.js +1 -1
- package/es/index.js.map +1 -1
- package/es/md/index.d.ts +5 -0
- package/es/md/index.js +1 -1
- package/es/md/index.js.map +1 -1
- package/es/md-style/index.js +4 -1
- package/es/md-style/index.js.map +1 -1
- package/es/prism/index.d.ts +27 -0
- package/es/prism/index.js +2 -0
- package/es/prism/index.js.map +1 -0
- package/es/theme/index.js +1 -1
- package/es/theme/index.js.map +1 -1
- package/lib/code/index.d.ts +0 -1
- package/lib/code/index.js +1 -1
- package/lib/code/index.js.map +1 -1
- package/lib/code/worker.js +1 -1
- package/lib/code/worker.js.map +1 -1
- package/lib/img/index.d.ts +5 -0
- package/lib/img/index.js +1 -1
- package/lib/img/index.js.map +1 -1
- package/lib/index.d.ts +1 -0
- package/lib/index.js +1 -1
- package/lib/index.js.map +1 -1
- package/lib/md/index.d.ts +5 -0
- package/lib/md/index.js +1 -1
- package/lib/md/index.js.map +1 -1
- package/lib/md-style/index.js +4 -1
- package/lib/md-style/index.js.map +1 -1
- package/lib/prism/index.d.ts +27 -0
- package/lib/prism/index.js +2 -0
- package/lib/prism/index.js.map +1 -0
- package/lib/theme/index.js +1 -1
- package/lib/theme/index.js.map +1 -1
- package/package.json +7 -4
- package/umd/index.js +8 -1
- package/es/prism/prism.js +0 -2
- package/es/prism/prism.js.map +0 -1
- package/lib/prism/prism.js +0 -2
- package/lib/prism/prism.js.map +0 -1
package/es/theme/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../components/theme/index.ts"],"sourcesContent":["import {\n type Accessor,\n type Setter,\n createEffect,\n createMemo,\n createRoot,\n createSignal,\n getOwner,\n} from 'solid-js';\nimport { colorParse, mixColor, toneColor } from '@moneko/common';\nimport { CSSObject, css } from '@moneko/css';\nexport { toneColor } from '@moneko/common';\n\n/** 生成主题色调\n * @param {string} base 基础颜色\n * @param {ThemeOption} option 配置项\n * @returns {Record<string, string>} 主题色调\n */\nexport function generateColor(base: string, option: ThemeOption): Record<string, string> {\n const obj = toneColor(base, option?.dark);\n const textColor = colorParse(obj[5]);\n const baseColor = colorParse(base);\n\n return {\n [`--${option.name}-text`]: textColor.setAlpha(0.65).toRgbaString(),\n [`--${option.name}-secondary`]: textColor.setAlpha(0.45).toRgbaString(),\n [`--${option.name}-heading`]: obj[5],\n [`--${option.name}-active`]: obj[30],\n [`--${option.name}-color`]: obj[40],\n [`--${option.name}-hover`]: mixColor(obj[40], obj[30], 15),\n [`--${option.name}-secondary-bg`]: obj[70],\n [`--${option.name}-border`]: obj[80],\n [`--${option.name}-outline`]: mixColor(obj[90], obj[40], 5),\n [`--${option.name}-selection`]: obj[90],\n [`--${option.name}-notify-bg`]: colorParse(obj[90]).setAlpha(0.8).toRgbaString(),\n [`--on-${option.name}-selection`]: obj[10],\n [`--${option.name}-shadow`]: baseColor.setAlpha(0.12).toRgbaString(),\n [`--${option.name}-shadow-1`]: baseColor.setAlpha(0.08).toRgbaString(),\n [`--${option.name}-shadow-2`]: baseColor.setAlpha(0.05).toRgbaString(),\n [`--${option.name}-details-bg`]: obj[95],\n [`--${option.name}-component-bg`]: obj[98],\n [`--${option.name}-bg`]: obj[99],\n [`--on-${option.name}-bg`]: obj[5],\n };\n}\n\n/** 颜色模式 */\nexport enum ColorScheme {\n /** 明亮 */\n light = 'light',\n /** 暗黑 */\n dark = 'dark',\n /** 跟随系统 */\n auto = 'auto',\n}\n\nfunction createTheme() {\n const baseTokens = css({\n ':root,:host': {\n '--scrollbar-size': '4px',\n '--font-size': '14px',\n '--font-size-sm': '12px',\n '--font-size-xs': '10px',\n '--font-size-lg': '16px',\n '--border-base': '1px solid var(--border-color)',\n '--border-radius': '8px',\n '--text-color': 'var(--primary-text)',\n '--text-secondary': 'var(--primary-secondary)',\n '--text-heading': 'var(--primary-heading)',\n '--text-selection': 'var(--primary-selection)',\n '--transition-duration': '0.3s',\n '--mask-bg': 'rgb(0 0 0 / 5%)',\n '--modal-component-bg': 'rgb(255 255 255 / 80%)',\n '--modal-box-shadow': '0 5px 35px rgb(0 0 0 / 10%)',\n '--notification-box-shadow': '0 4px 16px rgb(0 0 0 / 5%)',\n '--transition-timing-function': 'cubic-bezier(0.645, 0.045, 0.355, 1)',\n fontSize: 'var(--font-size)',\n fontFamily:\n \"-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji', Helvetica, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans'\",\n color: 'var(--text-color, rgb(0 0 0 / 65%))',\n lineHeight: 1.8,\n },\n '[disabled]:not([disabled=\"false\"])': {\n cursor: 'not-allowed',\n color: 'var(--disable-color)',\n },\n '::selection': {\n backgroundColor: 'var(--text-selection)',\n },\n '::-webkit-scrollbar': {\n inlineSize: 'var(--scrollbar-size)',\n blockSize: 'var(--scrollbar-size)',\n },\n });\n const preset =\n ColorScheme[localStorage.getItem('color-scheme') as keyof typeof ColorScheme] || 'auto';\n /** 检测 prefers-color-scheme 媒体查询是否为 light 模式 */\n const media = window.matchMedia('(prefers-color-scheme: dark)');\n const [scheme, setScheme] = createSignal<keyof typeof ColorScheme>(preset);\n const [isDark, setIsDark] = createSignal(media.matches);\n const [light, setLight] = createSignal({\n primary: '#5794ff',\n warning: '#faad14',\n error: '#ff4d4f',\n success: '#52c41a',\n });\n const [dark, setDark] = createSignal({\n primary: '#4d81dc',\n warning: '#bb8314',\n error: '#901c22',\n success: '#419418',\n });\n const primary = createMemo(() => generateColor(light().primary, { name: 'primary' }));\n const darkPrimary = createMemo(() =>\n generateColor(dark().primary, { name: 'primary', dark: true }),\n );\n const warning = createMemo(() => generateColor(light().warning, { name: 'warning' }));\n const darkWarning = createMemo(() =>\n generateColor(dark().warning, { name: 'warning', dark: true }),\n );\n const success = createMemo(() => generateColor(light().success, { name: 'success' }));\n const darkSuccess = createMemo(() =>\n generateColor(dark().success, { name: 'success', dark: true }),\n );\n const error = createMemo(() => generateColor(light().error, { name: 'error' }));\n const darkError = createMemo(() => generateColor(dark().error, { name: 'error', dark: true }));\n\n function getHostCss(tokens: CSSObject) {\n let str = '';\n\n for (const key in tokens) {\n if (Object.prototype.hasOwnProperty.call(tokens, key)) {\n str += `${key}:${tokens[key]};`;\n }\n }\n return `${baseTokens}:root,:host{${str}}`;\n }\n const lightCss = createMemo(() => {\n const tokens = Object.assign({}, primary(), warning(), success(), error(), {\n '--bg': 'transparent',\n '--disable-color': 'rgb(0 0 0 / 25%)',\n '--disable-bg': 'rgb(0 0 0 / 4%)',\n '--disable-border': '#d9d9d9',\n '--border-color': 'var(--primary-border)',\n '--component-bg': 'var(--primary-bg)',\n });\n\n return getHostCss(tokens);\n });\n const darkCss = createMemo(() => {\n const tokens = Object.assign({}, darkPrimary(), darkWarning(), darkSuccess(), darkError(), {\n '--bg': '#1c1c1c',\n '--disable-color': 'rgb(255 255 255 / 25%)',\n '--disable-bg': 'rgb(255 255 255 / 8%)',\n '--disable-border': '#424242',\n '--border-color': '#303030',\n '--component-bg': '#141414',\n '--primary-shadow': 'rgb(0 0 0 / 12%)',\n '--primary-selection': 'rgb(255 255 255 / 5%)',\n '--primary-details-bg': 'rgb(255 255 255 / 3%)',\n '--primary-component-bg': '#000',\n '--modal-component-bg': 'rgb(30 30 30 / 80%)',\n });\n\n return getHostCss(tokens);\n });\n\n function update(e: MediaQueryListEvent) {\n setIsDark(e.matches);\n }\n createEffect(() => {\n const _ = scheme();\n\n setIsDark(_ === 'dark' || (_ === 'auto' && media.matches));\n });\n const baseStyle = createMemo(() => (isDark() ? darkCss() : lightCss()));\n\n createEffect(() => {\n if (scheme() === 'auto') {\n // 监听 prefers-color-scheme 媒体查询变化，自动更新颜色方案\n media.addEventListener('change', update);\n } else {\n media.removeEventListener('change', update);\n }\n localStorage.setItem('color-scheme', scheme());\n });\n\n return {\n baseStyle,\n dark,\n setDark,\n light,\n setLight,\n scheme,\n setScheme,\n isDark,\n };\n}\n\n/** API */\nexport interface Theme {\n /** 亮色样式的主要色 */\n light: Accessor<Color>;\n /** 设置亮色样式的主要色 */\n setLight: Setter<Color>;\n /** 黑色样式的主要色 */\n dark: Accessor<Color>;\n /** 设置黑色样式的主要色 */\n setDark: Setter<Color>;\n /** 颜色模式\n * @default 'auto'\n */\n scheme: Accessor<keyof typeof ColorScheme>;\n /** 设置颜色模式 */\n setScheme: Setter<keyof typeof ColorScheme>;\n /** 是否为色模式 */\n isDark: Accessor<boolean>;\n /** 基本都样式表, 响应 scheme 变化 */\n baseStyle: Accessor<string>;\n}\n\n/** 主要色 */\ninterface Color {\n /** 主要\n * @default '#5794ff'\n */\n primary: string;\n /** 警告\n * @default '#faad14'\n */\n warning: string;\n /** 错误\n * @default '#ff4d4f'\n */\n error: string;\n /** 成功\n * @default '#52c41a'\n */\n success: string;\n}\n\nexport interface ThemeOption {\n /** 是否采用暗色算法\n * @default false\n */\n dark?: boolean;\n /** 颜色名称 */\n name: string;\n}\n\nexport default createRoot<Theme>(createTheme, getOwner());\n"],"names":["ColorScheme","createEffect","createMemo","createRoot","createSignal","getOwner","colorParse","mixColor","toneColor","css","generateColor","base","option","obj","dark","textColor","baseColor","name","setAlpha","toRgbaString","baseTokens","fontSize","fontFamily","color","lineHeight","cursor","backgroundColor","inlineSize","blockSize","preset","localStorage","getItem","media","window","matchMedia","scheme","setScheme","isDark","setIsDark","matches","light","setLight","primary","warning","error","success","setDark","darkPrimary","darkWarning","darkSuccess","darkError","getHostCss","tokens","str","key","Object","prototype","hasOwnProperty","call","lightCss","assign","darkCss","update","e","_","baseStyle","addEventListener","removeEventListener","setItem"],"rangeMappings":"","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../components/theme/index.ts"],"sourcesContent":["import {\n type Accessor,\n type Setter,\n createEffect,\n createMemo,\n createRoot,\n createSignal,\n getOwner,\n} from 'solid-js';\nimport { colorParse, mixColor, toneColor } from '@moneko/common';\nimport { CSSObject, css } from '@moneko/css';\nexport { toneColor } from '@moneko/common';\n\n/** 生成主题色调\n * @param {string} base 基础颜色\n * @param {ThemeOption} option 配置项\n * @returns {Record<string, string>} 主题色调\n */\nexport function generateColor(base: string, option: ThemeOption): Record<string, string> {\n const obj = toneColor(base, option?.dark);\n const textColor = colorParse(obj[5]);\n const baseColor = colorParse(base);\n\n return {\n [`--${option.name}-text`]: textColor.setAlpha(0.65).toRgbaString(),\n [`--${option.name}-secondary`]: textColor.setAlpha(0.45).toRgbaString(),\n [`--${option.name}-heading`]: obj[5],\n [`--${option.name}-active`]: obj[30],\n [`--${option.name}-color`]: obj[40],\n [`--${option.name}-hover`]: mixColor(obj[40], obj[30], 15),\n [`--${option.name}-secondary-bg`]: obj[70],\n [`--${option.name}-border`]: obj[80],\n [`--${option.name}-outline`]: mixColor(obj[90], obj[40], 5),\n [`--${option.name}-selection`]: obj[90],\n [`--${option.name}-notify-bg`]: colorParse(obj[90]).setAlpha(0.8).toRgbaString(),\n [`--on-${option.name}-selection`]: obj[10],\n [`--${option.name}-shadow`]: baseColor.setAlpha(0.12).toRgbaString(),\n [`--${option.name}-shadow-1`]: baseColor.setAlpha(0.08).toRgbaString(),\n [`--${option.name}-shadow-2`]: baseColor.setAlpha(0.05).toRgbaString(),\n [`--${option.name}-details-bg`]: obj[95],\n [`--${option.name}-component-bg`]: obj[98],\n [`--${option.name}-bg`]: obj[99],\n [`--on-${option.name}-bg`]: obj[5],\n };\n}\n\n/** 颜色模式 */\nexport enum ColorScheme {\n /** 明亮 */\n light = 'light',\n /** 暗黑 */\n dark = 'dark',\n /** 跟随系统 */\n auto = 'auto',\n}\n\nfunction createTheme() {\n const baseTokens = css({\n ':root,:host': {\n '--scrollbar-size': '4px',\n '--font-size': '14px',\n '--font-size-sm': '12px',\n '--font-size-xs': '10px',\n '--font-size-lg': '16px',\n '--border-base': '1px solid var(--border-color)',\n '--border-radius': '8px',\n '--text-color': 'var(--primary-text)',\n '--text-secondary': 'var(--primary-secondary)',\n '--text-heading': 'var(--primary-heading)',\n '--text-selection': 'var(--primary-selection)',\n '--transition-duration': '0.3s',\n '--mask-bg': 'rgb(0 0 0 / 5%)',\n '--modal-component-bg': 'rgb(255 255 255 / 80%)',\n '--modal-box-shadow': '0 5px 35px rgb(0 0 0 / 10%)',\n '--notification-box-shadow': '0 4px 16px rgb(0 0 0 / 5%)',\n '--transition-timing-function': 'cubic-bezier(0.645, 0.045, 0.355, 1)',\n fontSize: 'var(--font-size)',\n fontFamily:\n \"-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji', Helvetica, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans'\",\n color: 'var(--text-color, rgb(0 0 0 / 65%))',\n lineHeight: 1.8,\n },\n '[disabled]:not([disabled=\"false\"]):not(n-img)': {\n cursor: 'not-allowed',\n color: 'var(--disable-color)',\n },\n '::selection': {\n backgroundColor: 'var(--text-selection)',\n },\n '::-webkit-scrollbar': {\n inlineSize: 'var(--scrollbar-size)',\n blockSize: 'var(--scrollbar-size)',\n },\n });\n const preset =\n ColorScheme[localStorage.getItem('color-scheme') as keyof typeof ColorScheme] || 'auto';\n /** 检测 prefers-color-scheme 媒体查询是否为 light 模式 */\n const media = window.matchMedia('(prefers-color-scheme: dark)');\n const [scheme, setScheme] = createSignal<keyof typeof ColorScheme>(preset);\n const [isDark, setIsDark] = createSignal(media.matches);\n const [light, setLight] = createSignal({\n primary: '#5794ff',\n warning: '#faad14',\n error: '#ff4d4f',\n success: '#52c41a',\n });\n const [dark, setDark] = createSignal({\n primary: '#4d81dc',\n warning: '#bb8314',\n error: '#901c22',\n success: '#419418',\n });\n const primary = createMemo(() => generateColor(light().primary, { name: 'primary' }));\n const darkPrimary = createMemo(() =>\n generateColor(dark().primary, { name: 'primary', dark: true }),\n );\n const warning = createMemo(() => generateColor(light().warning, { name: 'warning' }));\n const darkWarning = createMemo(() =>\n generateColor(dark().warning, { name: 'warning', dark: true }),\n );\n const success = createMemo(() => generateColor(light().success, { name: 'success' }));\n const darkSuccess = createMemo(() =>\n generateColor(dark().success, { name: 'success', dark: true }),\n );\n const error = createMemo(() => generateColor(light().error, { name: 'error' }));\n const darkError = createMemo(() => generateColor(dark().error, { name: 'error', dark: true }));\n\n function getHostCss(tokens: CSSObject) {\n let str = '';\n\n for (const key in tokens) {\n if (Object.prototype.hasOwnProperty.call(tokens, key)) {\n str += `${key}:${tokens[key]};`;\n }\n }\n return `${baseTokens}:root,:host{${str}}`;\n }\n const lightCss = createMemo(() => {\n const tokens = Object.assign({}, primary(), warning(), success(), error(), {\n '--bg': 'transparent',\n '--disable-color': 'rgb(0 0 0 / 25%)',\n '--disable-bg': 'rgb(0 0 0 / 4%)',\n '--disable-border': '#d9d9d9',\n '--border-color': 'var(--primary-border)',\n '--component-bg': 'var(--primary-bg)',\n });\n\n return getHostCss(tokens);\n });\n const darkCss = createMemo(() => {\n const tokens = Object.assign({}, darkPrimary(), darkWarning(), darkSuccess(), darkError(), {\n '--bg': '#1c1c1c',\n '--disable-color': 'rgb(255 255 255 / 25%)',\n '--disable-bg': 'rgb(255 255 255 / 8%)',\n '--disable-border': '#424242',\n '--border-color': '#303030',\n '--component-bg': '#141414',\n '--primary-shadow': 'rgb(0 0 0 / 12%)',\n '--primary-selection': 'rgb(255 255 255 / 5%)',\n '--primary-details-bg': 'rgb(255 255 255 / 3%)',\n '--primary-component-bg': '#000',\n '--modal-component-bg': 'rgb(30 30 30 / 80%)',\n });\n\n return getHostCss(tokens);\n });\n\n function update(e: MediaQueryListEvent) {\n setIsDark(e.matches);\n }\n createEffect(() => {\n const _ = scheme();\n\n setIsDark(_ === 'dark' || (_ === 'auto' && media.matches));\n });\n const baseStyle = createMemo(() => (isDark() ? darkCss() : lightCss()));\n\n createEffect(() => {\n if (scheme() === 'auto') {\n // 监听 prefers-color-scheme 媒体查询变化，自动更新颜色方案\n media.addEventListener('change', update);\n } else {\n media.removeEventListener('change', update);\n }\n localStorage.setItem('color-scheme', scheme());\n });\n\n return {\n baseStyle,\n dark,\n setDark,\n light,\n setLight,\n scheme,\n setScheme,\n isDark,\n };\n}\n\n/** API */\nexport interface Theme {\n /** 亮色样式的主要色 */\n light: Accessor<Color>;\n /** 设置亮色样式的主要色 */\n setLight: Setter<Color>;\n /** 黑色样式的主要色 */\n dark: Accessor<Color>;\n /** 设置黑色样式的主要色 */\n setDark: Setter<Color>;\n /** 颜色模式\n * @default 'auto'\n */\n scheme: Accessor<keyof typeof ColorScheme>;\n /** 设置颜色模式 */\n setScheme: Setter<keyof typeof ColorScheme>;\n /** 是否为色模式 */\n isDark: Accessor<boolean>;\n /** 基本都样式表, 响应 scheme 变化 */\n baseStyle: Accessor<string>;\n}\n\n/** 主要色 */\ninterface Color {\n /** 主要\n * @default '#5794ff'\n */\n primary: string;\n /** 警告\n * @default '#faad14'\n */\n warning: string;\n /** 错误\n * @default '#ff4d4f'\n */\n error: string;\n /** 成功\n * @default '#52c41a'\n */\n success: string;\n}\n\nexport interface ThemeOption {\n /** 是否采用暗色算法\n * @default false\n */\n dark?: boolean;\n /** 颜色名称 */\n name: string;\n}\n\nexport default createRoot<Theme>(createTheme, getOwner());\n"],"names":["ColorScheme","createEffect","createMemo","createRoot","createSignal","getOwner","colorParse","mixColor","toneColor","css","generateColor","base","option","obj","dark","textColor","baseColor","name","setAlpha","toRgbaString","baseTokens","fontSize","fontFamily","color","lineHeight","cursor","backgroundColor","inlineSize","blockSize","preset","localStorage","getItem","media","window","matchMedia","scheme","setScheme","isDark","setIsDark","matches","light","setLight","primary","warning","error","success","setDark","darkPrimary","darkWarning","darkSuccess","darkError","getHostCss","tokens","str","key","Object","prototype","hasOwnProperty","call","lightCss","assign","darkCss","update","e","_","baseStyle","addEventListener","removeEventListener","setItem"],"rangeMappings":"","mappings":"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"}
|
package/lib/code/index.d.ts
CHANGED
package/lib/code/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return b}});const e=require("solid-js/web"),t=require("solid-js"),n=c(require("@moneko/common/lib/isFunction")),l=c(require("@moneko/common/lib/setClipboard")),r=require("@moneko/css"),o=require("solid-element"),i=require("./style"),a=c(require("../prism")),s=c(require("../prism/css")),u=c(require("../theme"));function c(e){return e&&e.__esModule?e:{default:e}}const d=(0,e.template)('<div class="toolbar"><button class="toolbar-copy">'),g=(0,e.template)("<pre><code>"),v=(0,e.template)("<style>"),f=(0,e.template)("<div><textarea>"),m=/^diff-([\w-]+)/i;function p(o){let c;let{baseStyle:p}=u.default,[b,h]=(0,t.createSignal)(""),[$,_]=(0,t.createSignal)(20),[C,y]=(0,t.createSignal)(!1),q=new IntersectionObserver(e=>{y(e[0].isIntersecting)});function k(){(0,l.default)((0,t.untrack)(b),c)}function E(){return(()=>{let n=g(),l=n.firstChild,r=c;return(0,e.insert)(n,(0,e.createComponent)(t.Show,{get when(){return o.toolbar},get children(){let t=d(),n=t.firstChild;return(0,e.addEventListener)(n,"click",k,!0),(0,e.effect)(()=>(0,e.setAttribute)(t,"data-lang",o.lang?.split(" ")[0])),t}}),l),"function"==typeof r?(0,e.use)(r,l):c=l,(0,e.effect)(t=>{let r={[`language-${o.lang}`]:!!o.lang,"line-numbers":o.lineNumber,"not-toolbar":!o.toolbar,[o.class]:!o.edit},i=`language-${o.lang}`;return t._v$=(0,e.classList)(n,r,t._v$),i!==t._v$2&&(0,e.className)(l,t._v$2=i),t},{_v$:void 0,_v$2:void 0}),n})()}function w({target:e}){let t=`${e.value}${/\n$/.test(e.value)?"":""}`;h(t),(0,n.default)(o.onChange)&&o.onChange(t)}return(0,t.createEffect)(()=>{if(o.code){let e=o.code.replace(/^\n/,"");try{h(decodeURIComponent(e))}catch(t){h(e)}}else h("")}),(0,t.createEffect)(()=>{!function(e){if(!e.code||!C())return;q.unobserve(c),q.disconnect(),m.test(e.lang)&&!a.default.languages[e.lang]&&(a.default.languages[e.lang]=a.default.languages.diff);let t=a.default.languages[e.lang]||a.default.languages.markup;c.innerHTML=a.default.highlight(e.code,t,e.lang),_(c.getBoundingClientRect().height-(o.toolbar?40:16))}({lang:o.lang||"markup",code:b()})}),(0,t.onMount)(()=>{q.observe(c)}),(0,t.onCleanup)(()=>{q.unobserve(c),q.disconnect()}),[(()=>{let t=v();return(0,e.insert)(t,p,null),(0,e.insert)(t,s.default,null),(0,e.insert)(t,i.style,null),(0,e.insert)(t,()=>(0,r.css)(o.css),null),t})(),(0,e.createComponent)(t.Show,{get when(){return o.edit},get fallback(){return E()},get children(){let t=f(),n=t.firstChild;return(0,e.addEventListener)(n,"input",w,!0),(0,e.insert)(t,E,null),(0,e.effect)(l=>{let i=(0,r.cx)("n-editor",o.class),a=!!o.lineNumber,s=!o.toolbar,u=`${$()}px`;return i!==l._v$3&&(0,e.className)(t,l._v$3=i),a!==l._v$4&&n.classList.toggle("line-numbers",l._v$4=a),s!==l._v$5&&n.classList.toggle("not-toolbar",l._v$5=s),u!==l._v$6&&(null!=(l._v$6=u)?n.style.setProperty("height",u):n.style.removeProperty("height")),l},{_v$3:void 0,_v$4:void 0,_v$5:void 0,_v$6:void 0}),(0,e.effect)(()=>n.value=b()),t}})]}(0,o.customElement)("n-code",{class:void 0,code:void 0,lang:void 0,children:void 0,edit:void 0,toolbar:void 0,css:void 0,lineNumber:void 0,onChange:void 0},(n,l)=>{let r=l.element,o=(0,t.mergeProps)({code:r.textContent,css:r.css,onChange(e){r.dispatchEvent(new CustomEvent("change",{detail:e}))}},n);return(0,t.createEffect)(()=>{r.replaceChildren(),r.removeAttribute("css")}),(0,e.createComponent)(p,o)});const b=p;(0,e.delegateEvents)(["click","input"]);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/lib/code/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../components/code/index.tsx"],"sourcesContent":["import {\n Show,\n createEffect,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n untrack,\n} from 'solid-js';\nimport { isFunction, setClipboard } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { style } from './style';\nimport
|
|
1
|
+
{"version":3,"sources":["../../components/code/index.tsx"],"sourcesContent":["import {\n Show,\n createEffect,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n untrack,\n} from 'solid-js';\nimport { isFunction, setClipboard } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\nimport { style } from './style';\nimport Prism from '../prism';\nimport prismCss from '../prism/css';\nimport theme from '../theme';\nimport type { CustomElement } from '..';\n\nexport interface CodeProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** 内容 */\n code?: string;\n /** 语言 */\n lang?: string;\n /** 显示代码行号 */\n lineNumber?: boolean;\n /** 支持编辑 */\n edit?: boolean;\n /** 开启代码块工具条 */\n toolbar?: boolean;\n /** 编辑修改时的回调 */\n onChange?: (code: string) => void;\n children?: JSX.Element;\n}\n\nexport type CodeElement = CustomElement<CodeProps>;\n\nconst diffLang = /^diff-([\\w-]+)/i;\n\nfunction Code(props: CodeProps) {\n const { baseStyle } = theme;\n let codeEl: HTMLPreElement;\n const [code, setCode] = createSignal<string>('');\n const [hei, setHei] = createSignal(20);\n const [isIntersecting, setIsIntersecting] = createSignal(false);\n const observer = new IntersectionObserver((entries) => {\n setIsIntersecting(entries[0].isIntersecting);\n });\n\n function copy() {\n setClipboard(untrack(code), codeEl);\n }\n function pre() {\n return (\n <pre\n classList={{\n [`language-${props.lang}`]: !!props.lang,\n 'line-numbers': props.lineNumber,\n 'not-toolbar': !props.toolbar,\n [props.class as string]: !props.edit,\n }}\n >\n <Show when={props.toolbar}>\n <div class=\"toolbar\" data-lang={props.lang?.split(' ')[0]}>\n <button class=\"toolbar-copy\" onClick={copy} />\n </div>\n </Show>\n <code ref={codeEl} class={`language-${props.lang}`} />\n </pre>\n );\n }\n function change({ target }: { target: HTMLTextAreaElement }) {\n const c = `${target.value}${/\\n$/.test(target.value) ? '\\u200b' : ''}`;\n\n setCode(c);\n if (isFunction(props.onChange)) {\n props.onChange(c);\n }\n }\n function postMessage(opt: { lang: string; code?: string }) {\n if (!opt.code || !isIntersecting()) return;\n observer.unobserve(codeEl);\n observer.disconnect();\n if (diffLang.test(opt.lang) && !Prism.languages[opt.lang]) {\n Prism.languages[opt.lang] = Prism.languages.diff;\n }\n const language = Prism.languages[opt.lang] || Prism.languages.markup;\n\n codeEl.innerHTML = Prism.highlight(opt.code, language, opt.lang);\n setHei(codeEl.getBoundingClientRect().height - (props.toolbar ? 40 : 16));\n }\n\n // const work = new Worker(new URL(\"./worker.ts\", import.meta.url), {\n // name: \"wastedTime\",\n // /* webpackEntryOptions: { filename: \"workers/[name].js\" } */\n // });\n // work.addEventListener('message', update);\n\n // work.postMessage({\n // lang: props.lang,\n // code: code(),\n // });\n // onCleanup(() => {\n // work.terminate();\n // });\n createEffect(() => {\n if (props.code) {\n const _code = props.code.replace(/^\\n/, '');\n\n try {\n setCode(decodeURIComponent(_code));\n } catch (error) {\n setCode(_code);\n }\n } else {\n setCode('');\n }\n });\n createEffect(() => {\n postMessage({\n lang: props.lang || 'markup',\n code: code(),\n });\n });\n onMount(() => {\n // 开始观察目标元素\n observer.observe(codeEl);\n });\n onCleanup(() => {\n // 停止观察目标元素\n observer.unobserve(codeEl);\n observer.disconnect();\n });\n\n return (\n <>\n <style>\n {baseStyle()}\n {prismCss()}\n {style}\n {css(props.css)}\n </style>\n <Show when={props.edit} fallback={pre()}>\n <div class={cx('n-editor', props.class)}>\n <textarea\n value={code()}\n classList={{\n 'line-numbers': props.lineNumber,\n 'not-toolbar': !props.toolbar,\n }}\n style={{ height: `${hei()}px` }}\n onInput={change}\n />\n {pre()}\n </div>\n </Show>\n </>\n );\n}\n\ncustomElement<CodeProps>(\n 'n-code',\n {\n class: void 0,\n code: void 0,\n lang: void 0,\n children: void 0,\n edit: void 0,\n toolbar: void 0,\n css: void 0,\n lineNumber: void 0,\n onChange: void 0,\n },\n (_, opt) => {\n const el = opt.element;\n const props = mergeProps(\n {\n code: el.textContent,\n css: el.css,\n onChange(val: string) {\n el.dispatchEvent(\n new CustomEvent('change', {\n detail: val,\n }),\n );\n },\n },\n _,\n );\n\n createEffect(() => {\n el.replaceChildren();\n el.removeAttribute('css');\n });\n\n return <Code {...props} />;\n },\n);\nexport default Code;\n"],"names":["diffLang","Code","props","codeEl","baseStyle","theme","code","setCode","createSignal","hei","setHei","isIntersecting","setIsIntersecting","observer","IntersectionObserver","entries","copy","setClipboard","untrack","pre","Show","toolbar","lang","split","lineNumber","class","edit","change","target","c","value","test","isFunction","onChange","createEffect","_code","replace","decodeURIComponent","error","postMessage","opt","unobserve","disconnect","Prism","languages","diff","language","markup","innerHTML","highlight","getBoundingClientRect","height","onMount","observe","onCleanup","prismCss","style","css","cx","customElement","children","_","el","element","mergeProps","textContent","val","dispatchEvent","CustomEvent","detail","replaceChildren","removeAttribute"],"rangeMappings":"","mappings":"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"}
|
package/lib/code/worker.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";self.
|
|
1
|
+
"use strict";self.importScripts(new URL("../prism",require("url").pathToFileURL(__filename).toString()).toString()),self.addEventListener("message",function(e){let s;try{let{code:t,lang:i}=e.data;self.Prism.highlight&&self.Prism.languages?s=self.Prism.highlight(t,self.Prism.languages[i],i):s=t}catch(e){s=e}self.postMessage(s)},!1);
|
|
2
2
|
//# sourceMappingURL=worker.js.map
|
package/lib/code/worker.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../components/code/worker.ts"],"sourcesContent":["self.
|
|
1
|
+
{"version":3,"sources":["../../components/code/worker.ts"],"sourcesContent":["self.importScripts(new URL('../prism', import.meta.url).toString());\nself.addEventListener(\n 'message',\n function (e) {\n let result;\n\n try {\n const { code, lang } = e.data;\n\n if (self.Prism.highlight && self.Prism.languages) {\n result = self.Prism.highlight(code, self.Prism.languages[lang], lang);\n } else {\n result = code;\n }\n } catch (error) {\n result = error;\n }\n self.postMessage(result); // 向主线程发送消息\n },\n false,\n);\n"],"names":["self","importScripts","URL","toString","addEventListener","e","result","code","lang","data","Prism","highlight","languages","error","postMessage"],"rangeMappings":"","mappings":"aAAAA,KAAKC,aAAa,CAAC,IAAIC,IAAI,WAAY,qDAAiBC,QAAQ,IAChEH,KAAKI,gBAAgB,CACnB,UACA,SAAUC,CAAC,EACT,IAAIC,EAEJ,GAAI,CACF,GAAM,CAAEC,KAAAA,CAAI,CAAEC,KAAAA,CAAI,CAAE,CAAGH,EAAEI,IAAI,AAEzBT,CAAAA,KAAKU,KAAK,CAACC,SAAS,EAAIX,KAAKU,KAAK,CAACE,SAAS,CAC9CN,EAASN,KAAKU,KAAK,CAACC,SAAS,CAACJ,EAAMP,KAAKU,KAAK,CAACE,SAAS,CAACJ,EAAK,CAAEA,GAEhEF,EAASC,CAEb,CAAE,MAAOM,EAAO,CACdP,EAASO,CACX,CACAb,KAAKc,WAAW,CAACR,EACnB,EACA,CAAA"}
|
package/lib/img/index.d.ts
CHANGED
|
@@ -29,6 +29,11 @@ export interface ImgProps {
|
|
|
29
29
|
* @default true
|
|
30
30
|
*/
|
|
31
31
|
lazy?: boolean;
|
|
32
|
+
/** 禁止点开大图
|
|
33
|
+
* @since 2.8.3
|
|
34
|
+
* @default false
|
|
35
|
+
*/
|
|
36
|
+
disabled?: boolean;
|
|
32
37
|
}
|
|
33
38
|
export type ImgElement = CustomElement<ImgProps, 'onOpenChange'>;
|
|
34
39
|
declare function Img(_: ImgProps): import("solid-js").JSX.Element;
|
package/lib/img/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return
|
|
1
|
+
"use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return d}});const t=require("solid-js/web"),n=require("solid-js"),o=require("solid-element"),i=require("./style"),s=(e=require("../spin"))&&e.__esModule?e:{default:e},l=(0,t.template)("<style>"),r=(0,t.template)('<img class="img" part="img">'),a=(0,t.template)('<div class="portal"><span class="close"></span><img class="img">');function c(e){let o,c;let d=(0,n.mergeProps)({lazy:!0,disabled:!1},e),[u,v]=(0,n.createSignal)(null),[p,g]=(0,n.createSignal)({width:0,height:0,left:0,top:0}),[m,f]=(0,n.createSignal)(!1),[$,_]=(0,n.createSignal)(!1),[b,E]=(0,n.createSignal)(!0),C=new IntersectionObserver(e=>{_(e[0].isIntersecting),e[0].isIntersecting&&(o&&C.unobserve(o),C.disconnect())});function h(){let{width:e,height:t,top:n,left:o}=p();return`.portal {--img: url(${d.src});inline-size: ${e}px;block-size: ${t}px;inset-block-start: ${n}px;inset-inline-start: ${o}px;}`}function L(e){d.disabled||(v(e),d.onOpenChange?.(e))}function y(e){e.preventDefault()}function k(e){y(e),"keydown"===e.type?d.escClosable&&"Escape"===e.key&&L(!1):L(!1)}function w(){!1===u()&&L(null)}function S(e){d.disabled||(e.stopPropagation(),y(e),m()||(g(e.target?.getBoundingClientRect()),L(!0)))}function x(){f(!0),E(!1)}function O(e){d.onLoad?.(e),E(!1)}function P(e){y(e),d.maskClosable&&e.target===c&&L(!1)}return(0,n.createEffect)(()=>{void 0!==d.open&&d.open!==(0,n.untrack)(u)&&v(d.open)}),(0,n.createEffect)(()=>{!0===u()&&(document.documentElement.addEventListener("mousewheel",y,{passive:!1}),d.escClosable&&document.documentElement.addEventListener("keydown",k,!1)),(0,n.onCleanup)(()=>{document.documentElement.removeEventListener("mousewheel",y,!1),document.documentElement.removeEventListener("keydown",k,!1)})}),(0,n.onMount)(()=>{o&&C.observe(o)}),(0,n.onCleanup)(()=>{o&&C.unobserve(o),C.disconnect()}),[(()=>{let e=l();return(0,t.insert)(e,i.imgCss),e})(),(0,t.createComponent)(s.default,{get spin(){return b()},get children(){let e=r(),n=o;return(0,t.addEventListener)(e,"load",O),(0,t.addEventListener)(e,"error",x),(0,t.addEventListener)(e,"click",S,!0),"function"==typeof n?(0,t.use)(n,e):o=e,(0,t.effect)(n=>{let o=!!u(),i=!!m(),s=$()?d.src:void 0,l=d.alt;return o!==n._v$&&e.classList.toggle("none",n._v$=o),i!==n._v$2&&e.classList.toggle("error",n._v$2=i),s!==n._v$3&&(0,t.setAttribute)(e,"src",n._v$3=s),l!==n._v$4&&(0,t.setAttribute)(e,"alt",n._v$4=l),n},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0}),e}}),(0,t.createComponent)(n.Show,{get when(){return null!==u()},get children(){return(0,t.createComponent)(t.Portal,{useShadow:!0,get children(){return[(()=>{let e=l();return(0,t.insert)(e,h,null),(0,t.insert)(e,i.imgCss,null),(0,t.insert)(e,i.style,null),e})(),(()=>{let e=a(),n=c,o=e.firstChild,i=o.nextSibling;return(0,t.addEventListener)(e,"click",P,!0),(0,t.addEventListener)(e,"animationend",w),"function"==typeof n?(0,t.use)(n,e):c=e,(0,t.addEventListener)(o,"click",k,!0),(0,t.effect)(n=>{let o=!!u(),s=!u(),l=d.srcFull||d.src,r=d.alt;return o!==n._v$5&&e.classList.toggle("open",n._v$5=o),s!==n._v$6&&e.classList.toggle("closeing",n._v$6=s),l!==n._v$7&&(0,t.setAttribute)(i,"src",n._v$7=l),r!==n._v$8&&(0,t.setAttribute)(i,"alt",n._v$8=r),n},{_v$5:void 0,_v$6:void 0,_v$7:void 0,_v$8:void 0}),e})()]}})}})]}(0,o.customElement)("n-img",{src:void 0,srcFull:void 0,alt:void 0,open:null,maskClosable:!0,escClosable:!0,onOpenChange:void 0,onLoad:void 0,lazy:void 0,disabled:void 0},(e,o)=>{let i=(0,n.mergeProps)({onOpenChange(e){o.element.dispatchEvent(new CustomEvent("openchange",{detail:e}))},onLoad(){o.element.dispatchEvent(new CustomEvent("load"))}},e);return(0,t.createComponent)(c,i)});const d=c;(0,t.delegateEvents)(["click"]);
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/lib/img/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../components/img/index.tsx"],"sourcesContent":["import {\n Show,\n createEffect,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n untrack,\n} from 'solid-js';\nimport { customElement } from 'solid-element';\nimport { Portal } from 'solid-js/web';\nimport { imgCss, style } from './style';\nimport Spin from '../spin';\nimport type { CustomElement } from '..';\n\nexport interface ImgProps {\n /** 图片地址 */\n src?: string;\n /** 查看大图的地址, 默认使用 `src`\n * @since 2.1.2\n */\n srcFull?: string;\n /** 图片 alt */\n alt?: string;\n /** 大图查看 */\n open?: boolean | null;\n /** 开启关闭大图的回调函数 */\n onOpenChange?: (open: boolean | null) => void;\n /** 图片加载完成 */\n onLoad?(e: Event): void;\n /** 点击遮罩关闭\n * @since 2.0.8\n * @default true\n */\n maskClosable?: boolean;\n /** 通过 `esc` 按键关闭\n * @default true\n */\n escClosable?: boolean;\n /**\n * 懒加载\n * @since 2.8.1\n * @default true\n */\n lazy?: boolean;\n}\nexport type ImgElement = CustomElement<ImgProps, 'onOpenChange'>;\n\nfunction Img(_: ImgProps) {\n let imgRef: HTMLImageElement | undefined;\n let portal: HTMLDivElement | undefined;\n const props = mergeProps({ lazy: true }, _);\n const [open, setOpen] = createSignal<boolean | null>(null);\n const [posi, setPosi] = createSignal({\n width: 0,\n height: 0,\n left: 0,\n top: 0,\n });\n const [isError, setIsError] = createSignal(false);\n const [isIntersecting, setIsIntersecting] = createSignal(false);\n const [loading, setLoading] = createSignal(true);\n const observer = new IntersectionObserver((entries) => {\n setIsIntersecting(entries[0].isIntersecting);\n if (entries[0].isIntersecting) {\n if (imgRef) {\n observer.unobserve(imgRef);\n }\n observer.disconnect();\n }\n });\n\n function getCss() {\n const { width, height, top, left } = posi();\n\n return `.portal {
|
|
1
|
+
{"version":3,"sources":["../../components/img/index.tsx"],"sourcesContent":["import {\n Show,\n createEffect,\n createSignal,\n mergeProps,\n onCleanup,\n onMount,\n untrack,\n} from 'solid-js';\nimport { customElement } from 'solid-element';\nimport { Portal } from 'solid-js/web';\nimport { imgCss, style } from './style';\nimport Spin from '../spin';\nimport type { CustomElement } from '..';\n\nexport interface ImgProps {\n /** 图片地址 */\n src?: string;\n /** 查看大图的地址, 默认使用 `src`\n * @since 2.1.2\n */\n srcFull?: string;\n /** 图片 alt */\n alt?: string;\n /** 大图查看 */\n open?: boolean | null;\n /** 开启关闭大图的回调函数 */\n onOpenChange?: (open: boolean | null) => void;\n /** 图片加载完成 */\n onLoad?(e: Event): void;\n /** 点击遮罩关闭\n * @since 2.0.8\n * @default true\n */\n maskClosable?: boolean;\n /** 通过 `esc` 按键关闭\n * @default true\n */\n escClosable?: boolean;\n /**\n * 懒加载\n * @since 2.8.1\n * @default true\n */\n lazy?: boolean;\n /** 禁止点开大图\n * @since 2.8.3\n * @default false\n */\n disabled?: boolean;\n}\nexport type ImgElement = CustomElement<ImgProps, 'onOpenChange'>;\n\nfunction Img(_: ImgProps) {\n let imgRef: HTMLImageElement | undefined;\n let portal: HTMLDivElement | undefined;\n const props = mergeProps({ lazy: true, disabled: false }, _);\n const [open, setOpen] = createSignal<boolean | null>(null);\n const [posi, setPosi] = createSignal({\n width: 0,\n height: 0,\n left: 0,\n top: 0,\n });\n const [isError, setIsError] = createSignal(false);\n const [isIntersecting, setIsIntersecting] = createSignal(false);\n const [loading, setLoading] = createSignal(true);\n const observer = new IntersectionObserver((entries) => {\n setIsIntersecting(entries[0].isIntersecting);\n if (entries[0].isIntersecting) {\n if (imgRef) {\n observer.unobserve(imgRef);\n }\n observer.disconnect();\n }\n });\n\n function getCss() {\n const { width, height, top, left } = posi();\n\n return `.portal {--img: url(${props.src});inline-size: ${width}px;block-size: ${height}px;inset-block-start: ${top}px;inset-inline-start: ${left}px;}`;\n }\n function openChange(visi: boolean | null) {\n if (!props.disabled) {\n setOpen(visi);\n props.onOpenChange?.(visi);\n }\n }\n function preventDefault(e: Event) {\n e.preventDefault();\n }\n function close(e: KeyboardEvent | Event) {\n preventDefault(e);\n if (e.type === 'keydown') {\n if (props.escClosable && (e as KeyboardEvent).key === 'Escape') {\n openChange(false);\n }\n } else {\n openChange(false);\n }\n }\n function handleDestroy() {\n if (open() === false) {\n openChange(null);\n }\n }\n function handleOpen(e: Event) {\n if (!props.disabled) {\n e.stopPropagation();\n preventDefault(e);\n if (!isError()) {\n setPosi((e.target as HTMLImageElement)?.getBoundingClientRect());\n openChange(true);\n }\n }\n }\n function handleError() {\n setIsError(true);\n setLoading(false);\n }\n function handleLoad(e: Event) {\n props.onLoad?.(e);\n setLoading(false);\n }\n function portalClick(e: Event) {\n preventDefault(e);\n if (props.maskClosable && e.target === portal) {\n openChange(false);\n }\n }\n\n createEffect(() => {\n if (props.open !== void 0 && props.open !== untrack(open)) {\n setOpen(props.open);\n }\n });\n createEffect(() => {\n if (open() === true) {\n document.documentElement.addEventListener('mousewheel', preventDefault, {\n passive: false,\n });\n\n if (props.escClosable) {\n document.documentElement.addEventListener('keydown', close, false);\n }\n }\n\n onCleanup(() => {\n document.documentElement.removeEventListener('mousewheel', preventDefault, false);\n document.documentElement.removeEventListener('keydown', close, false);\n });\n });\n\n onMount(() => {\n if (imgRef) {\n observer.observe(imgRef);\n }\n });\n onCleanup(() => {\n if (imgRef) {\n observer.unobserve(imgRef);\n }\n observer.disconnect();\n });\n\n return (\n <>\n <style>{imgCss}</style>\n <Spin spin={loading()}>\n <img\n ref={imgRef}\n class=\"img\"\n part=\"img\"\n classList={{\n none: !!open(),\n error: isError(),\n }}\n src={isIntersecting() ? props.src : void 0}\n alt={props.alt}\n onClick={handleOpen}\n onError={handleError}\n onLoad={handleLoad}\n />\n </Spin>\n <Show when={open() !== null}>\n <Portal useShadow={true}>\n <style>\n {getCss()}\n {imgCss}\n {style}\n </style>\n <div\n ref={portal}\n class=\"portal\"\n classList={{\n open: !!open(),\n closeing: !open(),\n }}\n onAnimationEnd={handleDestroy}\n onClick={portalClick}\n >\n <span class=\"close\" onClick={close} />\n <img class=\"img\" src={props.srcFull || props.src} alt={props.alt} />\n </div>\n </Portal>\n </Show>\n </>\n );\n}\n\ncustomElement<ImgProps>(\n 'n-img',\n {\n src: void 0,\n srcFull: void 0,\n alt: void 0,\n open: null as boolean | null,\n maskClosable: true,\n escClosable: true,\n onOpenChange: void 0,\n onLoad: void 0,\n lazy: void 0,\n disabled: void 0,\n },\n (_, opt) => {\n const props = mergeProps(\n {\n onOpenChange(open: boolean | null) {\n opt.element.dispatchEvent(\n new CustomEvent('openchange', {\n detail: open,\n }),\n );\n },\n onLoad() {\n opt.element.dispatchEvent(new CustomEvent('load'));\n },\n },\n _,\n );\n\n return <Img {...props} />;\n },\n);\nexport default Img;\n"],"names":["Img","_","imgRef","portal","props","mergeProps","lazy","disabled","open","setOpen","createSignal","posi","setPosi","width","height","left","top","isError","setIsError","isIntersecting","setIsIntersecting","loading","setLoading","observer","IntersectionObserver","entries","unobserve","disconnect","getCss","src","openChange","visi","onOpenChange","preventDefault","e","close","type","escClosable","key","handleDestroy","handleOpen","stopPropagation","target","getBoundingClientRect","handleError","handleLoad","onLoad","portalClick","maskClosable","createEffect","untrack","document","documentElement","addEventListener","passive","onCleanup","removeEventListener","onMount","observe","imgCss","Spin","alt","Show","Portal","style","srcFull","customElement","opt","element","dispatchEvent","CustomEvent","detail"],"rangeMappings":"","mappings":"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"}
|
package/lib/index.d.ts
CHANGED
|
@@ -40,6 +40,7 @@ export { default as Tree, type TreeElement, type TreeMultipleElement, type TreeM
|
|
|
40
40
|
export { default as Typography, type TypographyElement, type TypographyProps } from './typography';
|
|
41
41
|
export { default as dayjs } from './date-picker/dayjs';
|
|
42
42
|
export { default as Provider, type ProviderElement, type ProviderProps } from './provider';
|
|
43
|
+
export { default as Prism } from './prism';
|
|
43
44
|
export { hot, customElement, noShadowDOM, withSolid, getCurrentElement } from 'solid-element';
|
|
44
45
|
export type { CustomElement } from 'custom-element-type';
|
|
45
46
|
import type { AvatarElement, AvatarGroupElement, BackTopElement, ButtonElement, CaptureScreenElement, CarouselElement, CheckboxBoolElement, CheckboxGroupElement, CodeElement, ColorPaletteElement, ColorPickerElement, CronElement, DatePickerElement, DropdownElement, DropdownMultipleElement, EmptyElement, HighlightTextElement, ImgElement, InputElement, InputNumberElement, MdElement, MenuElement, MenuMultipleElement, ModalElement, PaginationElement, PopoverElement, ProviderElement, RadioElement, SegmentedElement, SelectElement, SelectMultipleElement, SkeletonElement, SpinElement, SwitchElement, TableElement, TabsElement, TagElement, TreeElement, TreeMultipleElement, TreeMultipleSchemaElement, TreeMultipleStringElement, TreeSchemaElement, TreeStringElement, TypographyElement } from '.';
|
package/lib/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),function(e,r){for(var t in r)Object.defineProperty(e,t,{enumerable:!0,get:r[t]})}(exports,{Avatar:function(){return e.default},AvatarGroup:function(){return r.default},BackTop:function(){return t.default},Button:function(){return u.default},CaptureScreen:function(){return i.default},Carousel:function(){return o.default},Checkbox:function(){return f.default},Code:function(){return a.default},ColorPalette:function(){return c.default},ColorPicker:function(){return l.default},Cron:function(){return d.default},DatePicker:function(){return p.default},Dropdown:function(){return q.default},Empty:function(){return s.default},FieldName:function(){return n.FieldName},HighlightText:function(){return h.default},Img:function(){return y.default},Input:function(){return b.default},InputNumber:function(){return S.default},Md:function(){return v.default},Menu:function(){return k.default},Modal:function(){return
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),function(e,r){for(var t in r)Object.defineProperty(e,t,{enumerable:!0,get:r[t]})}(exports,{Avatar:function(){return e.default},AvatarGroup:function(){return r.default},BackTop:function(){return t.default},Button:function(){return u.default},CaptureScreen:function(){return i.default},Carousel:function(){return o.default},Checkbox:function(){return f.default},Code:function(){return a.default},ColorPalette:function(){return c.default},ColorPicker:function(){return l.default},Cron:function(){return d.default},DatePicker:function(){return p.default},Dropdown:function(){return q.default},Empty:function(){return s.default},FieldName:function(){return n.FieldName},HighlightText:function(){return h.default},Img:function(){return y.default},Input:function(){return b.default},InputNumber:function(){return S.default},Md:function(){return v.default},Menu:function(){return k.default},Modal:function(){return P.default},OpenState:function(){return P.OpenState},Pagination:function(){return C.default},Popover:function(){return M.default},Prism:function(){return H.default},Provider:function(){return G.default},Radio:function(){return j.default},Segmented:function(){return _.default},Select:function(){return T.default},Size:function(){return n.Size},Skeleton:function(){return x.default},Spin:function(){return D.default},Status:function(){return n.Status},Switch:function(){return E.default},Table:function(){return I.default},Tabs:function(){return N.default},Tag:function(){return W.default},Tree:function(){return A.default},Typography:function(){return B.default},customElement:function(){return R.customElement},dayjs:function(){return F.default},fromSchema:function(){return m.default},generateColor:function(){return z.generateColor},getCurrentElement:function(){return R.getCurrentElement},getOptions:function(){return g.default},hot:function(){return R.hot},mdStyle:function(){return O.default},noShadowDOM:function(){return R.noShadowDOM},notification:function(){return w.default},theme:function(){return z.default},toneColor:function(){return z.toneColor},withSolid:function(){return R.withSolid}});const e=J(require("./avatar")),r=J(require("./avatar/group")),t=J(require("./back-top")),n=require("./basic-config"),u=J(require("./button")),i=J(require("./capture-screen")),o=J(require("./carousel")),f=J(require("./checkbox")),a=J(require("./code")),c=J(require("./color-palette")),l=J(require("./color-picker")),d=J(require("./cron")),p=J(require("./date-picker")),q=J(require("./dropdown")),s=J(require("./empty")),m=J(require("./from-schema")),g=J(require("./get-options")),h=J(require("./highlight-text")),y=J(require("./img")),b=J(require("./input")),S=J(require("./input-number")),v=J(require("./md")),O=J(require("./md-style")),k=J(require("./menu")),P=L(require("./modal")),w=J(require("./notification")),C=J(require("./pagination")),M=J(require("./popover")),j=J(require("./radio")),_=J(require("./segmented")),T=J(require("./select")),x=J(require("./skeleton")),D=J(require("./spin")),E=J(require("./switch")),I=J(require("./table")),N=J(require("./tabs")),W=J(require("./tag")),z=L(require("./theme")),A=J(require("./tree")),B=J(require("./typography")),F=J(require("./date-picker/dayjs")),G=J(require("./provider")),H=J(require("./prism")),R=require("solid-element");function J(e){return e&&e.__esModule?e:{default:e}}function K(e){if("function"!=typeof WeakMap)return null;var r=new WeakMap,t=new WeakMap;return(K=function(e){return e?t:r})(e)}function L(e,r){if(!r&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var t=K(r);if(t&&t.has(e))return t.get(e);var n={__proto__:null},u=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if("default"!==i&&Object.prototype.hasOwnProperty.call(e,i)){var o=u?Object.getOwnPropertyDescriptor(e,i):null;o&&(o.get||o.set)?Object.defineProperty(n,i,o):n[i]=e[i]}return n.default=e,t&&t.set(e,n),n}
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../components/index.ts"],"sourcesContent":["'use client';\n\nexport { default as Avatar, type AvatarElement, type AvatarProps } from './avatar';\nexport {\n default as AvatarGroup,\n type AvatarGroupElement,\n type AvatarGroupProps,\n} from './avatar/group';\nexport { default as BackTop, type BackTopElement, type BackTopProps } from './back-top';\nexport { type BaseOption, type BasicConfig, FieldName, Size, Status } from './basic-config';\nexport { default as Button, type ButtonElement, type ButtonProps } from './button';\nexport {\n default as CaptureScreen,\n type CaptureScreenElement,\n type CaptureScreenProps,\n} from './capture-screen';\nexport { default as Carousel, type CarouselElement, type CarouselProps } from './carousel';\nexport {\n default as Checkbox,\n type CheckboxBoolElement,\n type CheckboxBoolProps,\n type CheckboxGroupElement,\n type CheckboxGroupProps,\n} from './checkbox';\nexport { default as Code, type CodeElement, type CodeProps } from './code';\nexport {\n default as ColorPalette,\n type ColorPaletteElement,\n type ColorPaletteProps,\n} from './color-palette';\nexport {\n default as ColorPicker,\n type ColorPickerElement,\n type ColorPickerProps,\n} from './color-picker';\nexport { default as Cron, type CronElement, type CronProps } from './cron';\nexport { default as DatePicker, type DatePickerProps, type DatePickerElement } from './date-picker';\nexport {\n default as Dropdown,\n type DropdownElement,\n type DropdownMultipleElement,\n type DropdownMultipleProps,\n type DropdownProps,\n} from './dropdown';\nexport { default as Empty, type EmptyElement, type EmptyProps } from './empty';\nexport { default as fromSchema } from './from-schema';\nexport { default as getOptions } from './get-options';\nexport {\n default as HighlightText,\n type HighlightTextElement,\n type HighlightTextProps,\n} from './highlight-text';\nexport { default as Img, type ImgElement, type ImgProps } from './img';\nexport { default as Input, type InputElement, type InputProps } from './input';\nexport {\n default as InputNumber,\n type InputNumberElement,\n type InputNumberProps,\n} from './input-number';\nexport { default as Md, type MdElement, type MdProps } from './md';\nexport { default as mdStyle } from './md-style';\nexport {\n default as Menu,\n type MenuElement,\n type MenuMultipleElement,\n type MenuMultipleProps,\n type MenuOption,\n type MenuProps,\n} from './menu';\nexport {\n default as Modal,\n type ModalElement,\n type ModalProps,\n type OpenStateKey,\n OpenState,\n} from './modal';\nexport {\n default as notification,\n type NotificationType,\n type NotificationProps,\n} from './notification';\nexport { default as Pagination, type PaginationProps, type PaginationElement } from './pagination';\nexport { default as Popover, type PopoverElement, type PopoverProps } from './popover';\nexport { default as Radio, type RadioElement, type RadioOption, type RadioProps } from './radio';\nexport { default as Segmented, type SegmentedElement, type SegmentedProps } from './segmented';\nexport {\n default as Select,\n type SelectElement,\n type SelectMultipleElement,\n type SelectMultipleProps,\n type SelectProps,\n} from './select';\nexport { default as Skeleton, type SkeletonElement, type SkeletonProps } from './skeleton';\nexport { default as Spin, type SpinElement, type SpinProps } from './spin';\nexport { default as Switch, type SwitchElement, type SwitchProps } from './switch';\nexport { default as Table, type TableElement, type TableProps } from './table';\nexport { default as Tabs, type TabOption, type TabsElement, type TabsProps } from './tabs';\nexport { default as Tag, type TagElement, type TagProps } from './tag';\nexport {\n default as theme,\n type ColorScheme,\n type ThemeOption,\n generateColor,\n toneColor,\n} from './theme';\nexport {\n default as Tree,\n type TreeElement,\n type TreeMultipleElement,\n type TreeMultipleProps,\n type TreeMultipleSchemaElement,\n type TreeMultipleSchemaProps,\n type TreeMultipleStringElement,\n type TreeMultipleStringProps,\n type TreeProps,\n type TreeSchemaElement,\n type TreeSchemaProps,\n type TreeStringElement,\n type TreeStringProps,\n type TreeData,\n} from './tree';\nexport { default as Typography, type TypographyElement, type TypographyProps } from './typography';\nexport { default as dayjs } from './date-picker/dayjs';\nexport { default as Provider, type ProviderElement, type ProviderProps } from './provider';\nexport { hot, customElement, noShadowDOM, withSolid, getCurrentElement } from 'solid-element';\nexport type { CustomElement } from 'custom-element-type';\nimport type {\n AvatarElement,\n AvatarGroupElement,\n BackTopElement,\n ButtonElement,\n CaptureScreenElement,\n CarouselElement,\n CheckboxBoolElement,\n CheckboxGroupElement,\n CodeElement,\n ColorPaletteElement,\n ColorPickerElement,\n CronElement,\n DatePickerElement,\n DropdownElement,\n DropdownMultipleElement,\n EmptyElement,\n HighlightTextElement,\n ImgElement,\n InputElement,\n InputNumberElement,\n MdElement,\n MenuElement,\n MenuMultipleElement,\n ModalElement,\n PaginationElement,\n PopoverElement,\n ProviderElement,\n RadioElement,\n SegmentedElement,\n SelectElement,\n SelectMultipleElement,\n SkeletonElement,\n SpinElement,\n SwitchElement,\n TableElement,\n TabsElement,\n TagElement,\n TreeElement,\n TreeMultipleElement,\n TreeMultipleSchemaElement,\n TreeMultipleStringElement,\n TreeSchemaElement,\n TreeStringElement,\n TypographyElement,\n} from '.';\nimport type { ICustomElement, Transform } from 'custom-element-type';\n\n/** 组件列表\n * @author monako97\n * @ignore optional\n */\ninterface CustomElementTags {\n /** 头像 */\n 'n-avatar': AvatarElement;\n /** 头像组 */\n 'n-avatar-group': AvatarGroupElement;\n /** 返回顶部 */\n 'n-back-top': BackTopElement;\n /** 按钮 */\n 'n-button': ButtonElement;\n /** 捕获屏幕 */\n 'n-capture-screen': CaptureScreenElement;\n /** 走马灯、轮播 */\n 'n-carousel': CarouselElement;\n /** 复选框 */\n 'n-checkbox': CheckboxBoolElement | CheckboxGroupElement;\n /** 代码框 */\n 'n-code': CodeElement;\n /** 取色器 */\n 'n-color-palette': ColorPaletteElement;\n /** 取色器(弹出类型) */\n 'n-color-picker': ColorPickerElement;\n /** 下拉面板 */\n 'n-dropdown': DropdownElement | DropdownMultipleElement;\n /** 空面板 */\n 'n-empty': EmptyElement;\n /** 匹配高亮文字 */\n 'n-highlight-text': HighlightTextElement;\n /** 图片查看器 */\n 'n-img': ImgElement;\n /** 输入框 */\n 'n-input': InputElement;\n /** 数字输入框 */\n 'n-input-number': InputNumberElement;\n /** Markdown渲染 */\n 'n-md': MdElement;\n /** 弹出气泡面板 */\n 'n-popover': PopoverElement;\n /** 单选项 */\n 'n-radio': RadioElement;\n /** 分段控制器 */\n 'n-segmented': SegmentedElement;\n /** 下拉选择框 */\n 'n-select': SelectElement | SelectMultipleElement;\n /** 骨架屏 */\n 'n-skeleton': SkeletonElement;\n /** 加载中 */\n 'n-spin': SpinElement;\n /** 开关 */\n 'n-switch': SwitchElement;\n /** 树形渲染 */\n 'n-tree':\n | TreeElement\n | TreeStringElement\n | TreeSchemaElement\n | TreeMultipleElement\n | TreeMultipleStringElement\n | TreeMultipleSchemaElement;\n /** 文字排版 */\n 'n-typography': TypographyElement;\n /** 标签页 */\n 'n-tabs': TabsElement;\n /** 标签 */\n 'n-tag': TagElement;\n /** 导航菜单 */\n 'n-menu': MenuElement | MenuMultipleElement;\n /** Cron表达式编辑器 */\n 'n-cron': CronElement;\n /** 日期选择器\n * @since 2.1.0\n */\n 'n-data-picker': DatePickerElement;\n /** 数据表格\n * @since 2.2.0\n */\n 'n-table': TableElement;\n /** 分页器\n * @since 2.2.0\n */\n 'n-pagination': PaginationElement;\n /** 响应内部变化\n * @since 2.3.0\n */\n 'n-provider': ProviderElement;\n /** 模态框\n * @since 2.6.0\n */\n 'n-modal': ModalElement;\n}\ntype IntrinsicNekoElement = Transform<CustomElementTags>;\n\ndeclare module 'solid-js' {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace JSX {\n export interface IntrinsicElements extends HTMLElementTags, IntrinsicNekoElement {}\n }\n interface HTMLElementTagNameMap extends IntrinsicNekoElement {}\n}\ndeclare global {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace JSX {\n export interface IntrinsicElements extends IntrinsicNekoElement {}\n }\n interface HTMLElementTagNameMap extends IntrinsicNekoElement {}\n}\n\nexport interface ComponentOptions<T> {\n element: T & ICustomElement;\n}\n"],"names":["Avatar","AvatarGroup","BackTop","Button","CaptureScreen","Carousel","Checkbox","Code","ColorPalette","ColorPicker","Cron","DatePicker","Dropdown","Empty","FieldName","HighlightText","Img","Input","InputNumber","Md","Menu","Modal","OpenState","Pagination","Popover","Provider","Radio","Segmented","Select","Size","Skeleton","Spin","Status","Switch","Table","Tabs","Tag","Tree","Typography","customElement","dayjs","fromSchema","generateColor","getCurrentElement","getOptions","hot","mdStyle","noShadowDOM","notification","theme","toneColor","withSolid"],"rangeMappings":"","mappings":"+JAEoBA,MAAM,mBAANA,SAAM,EAEbC,WAAW,mBAAXA,SAAW,EAIJC,OAAO,mBAAPA,SAAO,EAEPC,MAAM,mBAANA,SAAM,EAEbC,aAAa,mBAAbA,SAAa,EAINC,QAAQ,mBAARA,SAAQ,EAEfC,QAAQ,mBAARA,SAAQ,EAMDC,IAAI,mBAAJA,SAAI,EAEXC,YAAY,mBAAZA,SAAY,EAKZC,WAAW,mBAAXA,SAAW,EAIJC,IAAI,mBAAJA,SAAI,EACJC,UAAU,mBAAVA,SAAU,EAEjBC,QAAQ,mBAARA,SAAQ,EAMDC,KAAK,mBAALA,SAAK,EAnCmBC,SAAS,mBAATA,WAAS,EAuCxCC,aAAa,mBAAbA,SAAa,EAINC,GAAG,mBAAHA,SAAG,EACHC,KAAK,mBAALA,SAAK,EAEZC,WAAW,mBAAXA,SAAW,EAIJC,EAAE,mBAAFA,SAAE,EAGTC,IAAI,mBAAJA,SAAI,EAQJC,KAAK,mBAALA,SAAK,EAIhBC,SAAS,mBAATA,WAAS,EAOSC,UAAU,mBAAVA,SAAU,EACVC,OAAO,mBAAPA,SAAO,EAyCPC,QAAQ,mBAARA,SAAQ,EAxCRC,KAAK,mBAALA,SAAK,EACLC,SAAS,mBAATA,SAAS,EAEhBC,MAAM,mBAANA,SAAM,EA7EoCC,IAAI,mBAAJA,MAAI,EAmFvCC,QAAQ,mBAARA,SAAQ,EACRC,IAAI,mBAAJA,SAAI,EApFqCC,MAAM,mBAANA,QAAM,EAqF/CC,MAAM,mBAANA,SAAM,EACNC,KAAK,mBAALA,SAAK,EACLC,IAAI,mBAAJA,SAAI,EACJC,GAAG,mBAAHA,SAAG,EASVC,IAAI,mBAAJA,SAAI,EAeGC,UAAU,mBAAVA,SAAU,EAGhBC,aAAa,mBAAbA,eAAa,EAFPC,KAAK,mBAALA,SAAK,EA7ELC,UAAU,mBAAVA,SAAU,EAyD5BC,aAAa,mBAAbA,eAAa,EAsBsCC,iBAAiB,mBAAjBA,mBAAiB,EA9ElDC,UAAU,mBAAVA,SAAU,EA8ErBC,GAAG,mBAAHA,KAAG,EAhEQC,OAAO,mBAAPA,SAAO,EAgEEC,WAAW,mBAAXA,aAAW,EA/C3BC,YAAY,mBAAZA,SAAY,EAsBZC,KAAK,mBAALA,SAAK,EAIhBC,SAAS,mBAATA,WAAS,EAqB+BC,SAAS,mBAATA,WAAS,sBA1HqB,yBAKjE,+BACoE,yBACA,8BACH,yBAKjE,iCACuE,2BAOvE,2BAC2D,uBAK3D,gCAKA,+BAC2D,uBACkB,8BAO7E,2BAC8D,wBAC/B,8BACA,8BAK/B,iCACwD,sBACM,wBAK9D,+BACqD,qBACzB,2BAQ5B,uBAOA,wBAKA,+BAC6E,6BACT,0BACY,wBACN,4BAO1E,yBACuE,2BACZ,uBACM,yBACH,wBACa,uBACnB,sBAOxD,wBAgBA,uBAC6E,6BACnD,oCAC6C,yBACA"}
|
|
1
|
+
{"version":3,"sources":["../components/index.ts"],"sourcesContent":["'use client';\n\nexport { default as Avatar, type AvatarElement, type AvatarProps } from './avatar';\nexport {\n default as AvatarGroup,\n type AvatarGroupElement,\n type AvatarGroupProps,\n} from './avatar/group';\nexport { default as BackTop, type BackTopElement, type BackTopProps } from './back-top';\nexport { type BaseOption, type BasicConfig, FieldName, Size, Status } from './basic-config';\nexport { default as Button, type ButtonElement, type ButtonProps } from './button';\nexport {\n default as CaptureScreen,\n type CaptureScreenElement,\n type CaptureScreenProps,\n} from './capture-screen';\nexport { default as Carousel, type CarouselElement, type CarouselProps } from './carousel';\nexport {\n default as Checkbox,\n type CheckboxBoolElement,\n type CheckboxBoolProps,\n type CheckboxGroupElement,\n type CheckboxGroupProps,\n} from './checkbox';\nexport { default as Code, type CodeElement, type CodeProps } from './code';\nexport {\n default as ColorPalette,\n type ColorPaletteElement,\n type ColorPaletteProps,\n} from './color-palette';\nexport {\n default as ColorPicker,\n type ColorPickerElement,\n type ColorPickerProps,\n} from './color-picker';\nexport { default as Cron, type CronElement, type CronProps } from './cron';\nexport { default as DatePicker, type DatePickerProps, type DatePickerElement } from './date-picker';\nexport {\n default as Dropdown,\n type DropdownElement,\n type DropdownMultipleElement,\n type DropdownMultipleProps,\n type DropdownProps,\n} from './dropdown';\nexport { default as Empty, type EmptyElement, type EmptyProps } from './empty';\nexport { default as fromSchema } from './from-schema';\nexport { default as getOptions } from './get-options';\nexport {\n default as HighlightText,\n type HighlightTextElement,\n type HighlightTextProps,\n} from './highlight-text';\nexport { default as Img, type ImgElement, type ImgProps } from './img';\nexport { default as Input, type InputElement, type InputProps } from './input';\nexport {\n default as InputNumber,\n type InputNumberElement,\n type InputNumberProps,\n} from './input-number';\nexport { default as Md, type MdElement, type MdProps } from './md';\nexport { default as mdStyle } from './md-style';\nexport {\n default as Menu,\n type MenuElement,\n type MenuMultipleElement,\n type MenuMultipleProps,\n type MenuOption,\n type MenuProps,\n} from './menu';\nexport {\n default as Modal,\n type ModalElement,\n type ModalProps,\n type OpenStateKey,\n OpenState,\n} from './modal';\nexport {\n default as notification,\n type NotificationType,\n type NotificationProps,\n} from './notification';\nexport { default as Pagination, type PaginationProps, type PaginationElement } from './pagination';\nexport { default as Popover, type PopoverElement, type PopoverProps } from './popover';\nexport { default as Radio, type RadioElement, type RadioOption, type RadioProps } from './radio';\nexport { default as Segmented, type SegmentedElement, type SegmentedProps } from './segmented';\nexport {\n default as Select,\n type SelectElement,\n type SelectMultipleElement,\n type SelectMultipleProps,\n type SelectProps,\n} from './select';\nexport { default as Skeleton, type SkeletonElement, type SkeletonProps } from './skeleton';\nexport { default as Spin, type SpinElement, type SpinProps } from './spin';\nexport { default as Switch, type SwitchElement, type SwitchProps } from './switch';\nexport { default as Table, type TableElement, type TableProps } from './table';\nexport { default as Tabs, type TabOption, type TabsElement, type TabsProps } from './tabs';\nexport { default as Tag, type TagElement, type TagProps } from './tag';\nexport {\n default as theme,\n type ColorScheme,\n type ThemeOption,\n generateColor,\n toneColor,\n} from './theme';\nexport {\n default as Tree,\n type TreeElement,\n type TreeMultipleElement,\n type TreeMultipleProps,\n type TreeMultipleSchemaElement,\n type TreeMultipleSchemaProps,\n type TreeMultipleStringElement,\n type TreeMultipleStringProps,\n type TreeProps,\n type TreeSchemaElement,\n type TreeSchemaProps,\n type TreeStringElement,\n type TreeStringProps,\n type TreeData,\n} from './tree';\nexport { default as Typography, type TypographyElement, type TypographyProps } from './typography';\nexport { default as dayjs } from './date-picker/dayjs';\nexport { default as Provider, type ProviderElement, type ProviderProps } from './provider';\nexport { default as Prism } from './prism';\nexport { hot, customElement, noShadowDOM, withSolid, getCurrentElement } from 'solid-element';\nexport type { CustomElement } from 'custom-element-type';\nimport type {\n AvatarElement,\n AvatarGroupElement,\n BackTopElement,\n ButtonElement,\n CaptureScreenElement,\n CarouselElement,\n CheckboxBoolElement,\n CheckboxGroupElement,\n CodeElement,\n ColorPaletteElement,\n ColorPickerElement,\n CronElement,\n DatePickerElement,\n DropdownElement,\n DropdownMultipleElement,\n EmptyElement,\n HighlightTextElement,\n ImgElement,\n InputElement,\n InputNumberElement,\n MdElement,\n MenuElement,\n MenuMultipleElement,\n ModalElement,\n PaginationElement,\n PopoverElement,\n ProviderElement,\n RadioElement,\n SegmentedElement,\n SelectElement,\n SelectMultipleElement,\n SkeletonElement,\n SpinElement,\n SwitchElement,\n TableElement,\n TabsElement,\n TagElement,\n TreeElement,\n TreeMultipleElement,\n TreeMultipleSchemaElement,\n TreeMultipleStringElement,\n TreeSchemaElement,\n TreeStringElement,\n TypographyElement,\n} from '.';\nimport type { ICustomElement, Transform } from 'custom-element-type';\n\n/** 组件列表\n * @author monako97\n * @ignore optional\n */\ninterface CustomElementTags {\n /** 头像 */\n 'n-avatar': AvatarElement;\n /** 头像组 */\n 'n-avatar-group': AvatarGroupElement;\n /** 返回顶部 */\n 'n-back-top': BackTopElement;\n /** 按钮 */\n 'n-button': ButtonElement;\n /** 捕获屏幕 */\n 'n-capture-screen': CaptureScreenElement;\n /** 走马灯、轮播 */\n 'n-carousel': CarouselElement;\n /** 复选框 */\n 'n-checkbox': CheckboxBoolElement | CheckboxGroupElement;\n /** 代码框 */\n 'n-code': CodeElement;\n /** 取色器 */\n 'n-color-palette': ColorPaletteElement;\n /** 取色器(弹出类型) */\n 'n-color-picker': ColorPickerElement;\n /** 下拉面板 */\n 'n-dropdown': DropdownElement | DropdownMultipleElement;\n /** 空面板 */\n 'n-empty': EmptyElement;\n /** 匹配高亮文字 */\n 'n-highlight-text': HighlightTextElement;\n /** 图片查看器 */\n 'n-img': ImgElement;\n /** 输入框 */\n 'n-input': InputElement;\n /** 数字输入框 */\n 'n-input-number': InputNumberElement;\n /** Markdown渲染 */\n 'n-md': MdElement;\n /** 弹出气泡面板 */\n 'n-popover': PopoverElement;\n /** 单选项 */\n 'n-radio': RadioElement;\n /** 分段控制器 */\n 'n-segmented': SegmentedElement;\n /** 下拉选择框 */\n 'n-select': SelectElement | SelectMultipleElement;\n /** 骨架屏 */\n 'n-skeleton': SkeletonElement;\n /** 加载中 */\n 'n-spin': SpinElement;\n /** 开关 */\n 'n-switch': SwitchElement;\n /** 树形渲染 */\n 'n-tree':\n | TreeElement\n | TreeStringElement\n | TreeSchemaElement\n | TreeMultipleElement\n | TreeMultipleStringElement\n | TreeMultipleSchemaElement;\n /** 文字排版 */\n 'n-typography': TypographyElement;\n /** 标签页 */\n 'n-tabs': TabsElement;\n /** 标签 */\n 'n-tag': TagElement;\n /** 导航菜单 */\n 'n-menu': MenuElement | MenuMultipleElement;\n /** Cron表达式编辑器 */\n 'n-cron': CronElement;\n /** 日期选择器\n * @since 2.1.0\n */\n 'n-data-picker': DatePickerElement;\n /** 数据表格\n * @since 2.2.0\n */\n 'n-table': TableElement;\n /** 分页器\n * @since 2.2.0\n */\n 'n-pagination': PaginationElement;\n /** 响应内部变化\n * @since 2.3.0\n */\n 'n-provider': ProviderElement;\n /** 模态框\n * @since 2.6.0\n */\n 'n-modal': ModalElement;\n}\ntype IntrinsicNekoElement = Transform<CustomElementTags>;\n\ndeclare module 'solid-js' {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace JSX {\n export interface IntrinsicElements extends HTMLElementTags, IntrinsicNekoElement {}\n }\n interface HTMLElementTagNameMap extends IntrinsicNekoElement {}\n}\ndeclare global {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace JSX {\n export interface IntrinsicElements extends IntrinsicNekoElement {}\n }\n interface HTMLElementTagNameMap extends IntrinsicNekoElement {}\n}\n\nexport interface ComponentOptions<T> {\n element: T & ICustomElement;\n}\n"],"names":["Avatar","AvatarGroup","BackTop","Button","CaptureScreen","Carousel","Checkbox","Code","ColorPalette","ColorPicker","Cron","DatePicker","Dropdown","Empty","FieldName","HighlightText","Img","Input","InputNumber","Md","Menu","Modal","OpenState","Pagination","Popover","Prism","Provider","Radio","Segmented","Select","Size","Skeleton","Spin","Status","Switch","Table","Tabs","Tag","Tree","Typography","customElement","dayjs","fromSchema","generateColor","getCurrentElement","getOptions","hot","mdStyle","noShadowDOM","notification","theme","toneColor","withSolid"],"rangeMappings":"","mappings":"+JAEoBA,MAAM,mBAANA,SAAM,EAEbC,WAAW,mBAAXA,SAAW,EAIJC,OAAO,mBAAPA,SAAO,EAEPC,MAAM,mBAANA,SAAM,EAEbC,aAAa,mBAAbA,SAAa,EAINC,QAAQ,mBAARA,SAAQ,EAEfC,QAAQ,mBAARA,SAAQ,EAMDC,IAAI,mBAAJA,SAAI,EAEXC,YAAY,mBAAZA,SAAY,EAKZC,WAAW,mBAAXA,SAAW,EAIJC,IAAI,mBAAJA,SAAI,EACJC,UAAU,mBAAVA,SAAU,EAEjBC,QAAQ,mBAARA,SAAQ,EAMDC,KAAK,mBAALA,SAAK,EAnCmBC,SAAS,mBAATA,WAAS,EAuCxCC,aAAa,mBAAbA,SAAa,EAINC,GAAG,mBAAHA,SAAG,EACHC,KAAK,mBAALA,SAAK,EAEZC,WAAW,mBAAXA,SAAW,EAIJC,EAAE,mBAAFA,SAAE,EAGTC,IAAI,mBAAJA,SAAI,EAQJC,KAAK,mBAALA,SAAK,EAIhBC,SAAS,mBAATA,WAAS,EAOSC,UAAU,mBAAVA,SAAU,EACVC,OAAO,mBAAPA,SAAO,EA0CPC,KAAK,mBAALA,SAAK,EADLC,QAAQ,mBAARA,SAAQ,EAxCRC,KAAK,mBAALA,SAAK,EACLC,SAAS,mBAATA,SAAS,EAEhBC,MAAM,mBAANA,SAAM,EA7EoCC,IAAI,mBAAJA,MAAI,EAmFvCC,QAAQ,mBAARA,SAAQ,EACRC,IAAI,mBAAJA,SAAI,EApFqCC,MAAM,mBAANA,QAAM,EAqF/CC,MAAM,mBAANA,SAAM,EACNC,KAAK,mBAALA,SAAK,EACLC,IAAI,mBAAJA,SAAI,EACJC,GAAG,mBAAHA,SAAG,EASVC,IAAI,mBAAJA,SAAI,EAeGC,UAAU,mBAAVA,SAAU,EAIhBC,aAAa,mBAAbA,eAAa,EAHPC,KAAK,mBAALA,SAAK,EA7ELC,UAAU,mBAAVA,SAAU,EAyD5BC,aAAa,mBAAbA,eAAa,EAuBsCC,iBAAiB,mBAAjBA,mBAAiB,EA/ElDC,UAAU,mBAAVA,SAAU,EA+ErBC,GAAG,mBAAHA,KAAG,EAjEQC,OAAO,mBAAPA,SAAO,EAiEEC,WAAW,mBAAXA,aAAW,EAhD3BC,YAAY,mBAAZA,SAAY,EAsBZC,KAAK,mBAALA,SAAK,EAIhBC,SAAS,mBAATA,WAAS,EAsB+BC,SAAS,mBAATA,WAAS,sBA3HqB,yBAKjE,+BACoE,yBACA,8BACH,yBAKjE,iCACuE,2BAOvE,2BAC2D,uBAK3D,gCAKA,+BAC2D,uBACkB,8BAO7E,2BAC8D,wBAC/B,8BACA,8BAK/B,iCACwD,sBACM,wBAK9D,+BACqD,qBACzB,2BAQ5B,uBAOA,wBAKA,+BAC6E,6BACT,0BACY,wBACN,4BAO1E,yBACuE,2BACZ,uBACM,yBACH,wBACa,uBACnB,sBAOxD,wBAgBA,uBAC6E,6BACnD,oCAC6C,2BAC7C,sBAC6C"}
|
package/lib/md/index.d.ts
CHANGED
package/lib/md/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return p}});const e=require("solid-js/web"),t=require("solid-js"),r=
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return p}});const e=require("solid-js/web"),t=require("solid-js"),r=c(require("@moneko/common/lib/frameCallback")),n=require("@moneko/css"),o=function(e,t){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=s(void 0);if(r&&r.has(e))return r.get(e);var n={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&Object.prototype.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(n,a,l):n[a]=e[a]}return n.default=e,r&&r.set(e,n),n}(require("marked-completed")),a=require("solid-element");require("../code"),require("../img");const l=c(require("../md-style")),i=c(require("../theme"));function c(e){return e&&e.__esModule?e:{default:e}}function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(s=function(e){return e?r:t})(e)}const u=(0,e.template)("<style>"),d=(0,e.template)('<article class="n-md-box" part="box"><div class="n-md-body" part="body">'),f=(0,e.template)('<article part="box">');function h(a){let c;let s=new o.Renderer;s.katexBlock=e=>`<n-katex display-mode="true">${e}</n-katex>`,s.katexInline=e=>`<n-katex>${e}</n-katex>`;let{baseStyle:h}=i.default,p=(0,t.mergeProps)({pictureViewer:!0,lazyPicture:!0,text:"",tools:["copy"],getAnchorContainer:()=>window},a);(0,t.createEffect)(()=>{(0,r.default)(()=>(function(e){var t;let{text:r,pictureViewer:n,lazyPicture:a,langToolbar:l,...i}=e;s.image=(e,t,r)=>`<n-img lazy="${a}" disabled="${!n}" role="img" src="${e}" alt="${r}" ${t?`title="${t}"`:""}></n-img>`;let u=!!l?.length;s.code=function(e,t){return"treeview"===t?`<n-tree data="${e}" />`:`<n-code class="n-code" toolbar="${u}" lang="${t}" ${i.langLineNumber?'line-number="true"':""}>${encodeURIComponent(e)}</n-code>`},t={data:(0,o.default)(r,{renderer:s,langToolbar:l,headerPrefix:"# ",breaks:!0,pedantic:!1,smartLists:!0,smartypants:!0,xhtml:!0,...i})},c&&(c.innerHTML=t.data)})({text:p.text,langLineNumber:p.lineNumber,langToolbar:p.tools,pictureViewer:p.pictureViewer,lazyPicture:p.lazyPicture}))});let m=[],g=[],b=[];function v(e){e.preventDefault(),e.stopPropagation();let t=e.target;t.hash?(c?.querySelector(decodeURIComponent(t.hash))?.scrollIntoView({behavior:"smooth",block:"nearest"}),m.forEach(e=>e.classList.remove("active")),t.classList.add("active")):window.open(t.href)}function y(e){e.forEach(e=>{let t;let r=e.target.getAttribute("id"),n=e.target.querySelectorAll("a");if(m.forEach(e=>{e.hash===`#${r}`?t=e:e.hash||n.forEach(r=>{r.href===e.href&&(t=e)})}),t){let r=b.indexOf(t);b.forEach(e=>{e.classList.remove("active")}),e.isIntersecting?b.push(t):-1!==r&&b.splice(r,1),b[0]&&(b[0].classList.add("active"),b[0].offsetParent?.scrollTo({top:b[0].offsetTop}))}})}return(0,t.createEffect)(()=>{let e;c&&p.text?.startsWith("[TOC]")&&(m=[...c.querySelectorAll(".n-md-toc a[href]")],g=[...c.querySelectorAll("h1, h2, h3, h4, h5, h6")],e=new IntersectionObserver(y,{rootMargin:"-50px 0px",threshold:.5}),g.forEach(t=>e.observe(t)),m.forEach(e=>{e.addEventListener("click",v)})),(0,t.onCleanup)(()=>{e&&(g.forEach(t=>e.unobserve(t)),e.disconnect()),m.forEach(e=>{e.removeEventListener("click",v)})})}),[(()=>{let t=u();return(0,e.insert)(t,h,null),(0,e.insert)(t,l.default,null),(0,e.insert)(t,()=>(0,n.css)(p.css),null),t})(),(0,e.createComponent)(t.Switch,{get children(){return[(0,e.createComponent)(t.Match,{get when(){return p.children?.length},get children(){let r=d(),n=r.firstChild;return(0,e.insert)(n,(0,e.createComponent)(t.For,{get each(){return p.children},children:e=>e})),r}}),(0,e.createComponent)(t.Match,{get when(){return p.text},get children(){let t=f(),r=c;return"function"==typeof r?(0,e.use)(r,t):c=t,(0,e.effect)(()=>(0,e.className)(t,(0,n.cx)("n-md-box",p.class))),t}})]}})]}(0,a.customElement)("n-md",{class:void 0,pictureViewer:void 0,lazyPicture:void 0,lineNumber:!0,text:void 0,tools:void 0,getAnchorContainer:void 0,css:void 0,children:void 0,notRender:void 0},(r,n)=>{let o=n.element,a=(0,t.mergeProps)({text:!r.notRender&&o.textContent||o.text,css:o.css,tools:o.tools,getAnchorContainer:o.getAnchorContainer},r);return(0,t.createEffect)(()=>{o.removeAttribute("css"),o.replaceChildren()}),(0,e.createComponent)(h,a)});const p=h;
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/lib/md/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../components/md/index.tsx"],"sourcesContent":["import { For, Match, Switch, createEffect, mergeProps, onCleanup } from 'solid-js';\nimport { frameCallback } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport marked, { Renderer } from 'marked-completed';\nimport { customElement } from 'solid-element';\nimport '../code';\nimport '../img';\nimport mdStyle from '../md-style';\nimport theme from '../theme';\nimport type { CustomElement } from '..';\n\nfunction MD(_props: MdProps) {\n let ref: HTMLDivElement | undefined;\n const renderer = new Renderer();\n\n renderer.katexBlock = (code: string) => {\n return `<n-katex display-mode=\"true\">${code}</n-katex>`;\n };\n renderer.katexInline = (code: string) => {\n return `<n-katex>${code}</n-katex>`;\n };\n const { baseStyle } = theme;\n const props = mergeProps(\n {\n pictureViewer: true,\n text: '',\n tools: ['copy'],\n getAnchorContainer: () => window as unknown as HTMLElement,\n },\n _props,\n );\n\n function update(e: { data: string }) {\n if (ref) {\n ref.innerHTML = e.data;\n }\n }\n function postMessage(opt: {\n text: string;\n pictureViewer?: boolean;\n langToolbar?: string[];\n langLineNumber?: boolean;\n }) {\n const { text, pictureViewer, langToolbar, ...options } = opt;\n const tag = pictureViewer ? 'n-img' : 'img';\n\n renderer.image = (src: string, title: string, alt: string) => {\n return `<${tag} role=\"img\" src=\"${src}\" alt=\"${alt}\" ${title ? `title=\"${title}\"` : ''}></${tag}>`;\n };\n const toolbar = !!langToolbar?.length;\n\n renderer.code = function (code: string, lang: string) {\n if (lang === 'treeview') {\n return `<n-tree data=\"${code}\" />`;\n }\n\n return `<n-code class=\"n-code\" toolbar=\"${toolbar}\" lang=\"${lang}\" ${\n options.langLineNumber ? 'line-number=\"true\"' : ''\n }>${encodeURIComponent(code)}</n-code>`;\n };\n\n update({\n data: marked(text, {\n renderer: renderer,\n langToolbar: langToolbar,\n headerPrefix: '# ',\n breaks: true,\n pedantic: false,\n smartLists: true,\n smartypants: true,\n xhtml: true,\n ...options,\n }),\n });\n }\n // const work = new Worker(new URL('./worker.ts', import.meta.url));\n\n // work.addEventListener('message', update);\n // work.postMessage({\n // text: props.text,\n // langLineNumber: props.lineNumber,\n // langToolbar: props.tools,\n // pictureViewer: props.pictureViewer,\n // });\n // onCleanup(() => {\n // work.terminate();\n // });\n createEffect(() => {\n const call = () =>\n postMessage({\n text: props.text,\n langLineNumber: props.lineNumber,\n langToolbar: props.tools,\n pictureViewer: props.pictureViewer,\n });\n\n frameCallback(call);\n });\n let list: HTMLAnchorElement[] = [];\n let heading: HTMLHeadingElement[] = [];\n const active: HTMLAnchorElement[] = [];\n\n function handleAnchor(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n const a = e.target as HTMLAnchorElement;\n\n if (a.hash) {\n ref?.querySelector(decodeURIComponent(a.hash))?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n list.forEach((item) => item.classList.remove('active'));\n a.classList.add('active');\n } else {\n window.open(a.href);\n }\n }\n function observerEntry(entries: IntersectionObserverEntry[]) {\n entries.forEach((entry) => {\n const id = entry.target.getAttribute('id');\n const all = entry.target.querySelectorAll('a');\n let a: HTMLAnchorElement | undefined;\n\n list.forEach((l) => {\n if (l.hash === `#${id}`) {\n a = l;\n } else if (!l.hash) {\n all.forEach((e) => {\n if (e.href === l.href) {\n a = l;\n }\n });\n }\n });\n if (a) {\n const idx = active.indexOf(a);\n\n active.forEach((e) => {\n e.classList.remove('active');\n });\n if (entry.isIntersecting) {\n active.push(a);\n } else if (idx !== -1) {\n active.splice(idx, 1);\n }\n if (active[0]) {\n active[0].classList.add('active');\n active[0].offsetParent?.scrollTo({\n top: active[0].offsetTop,\n });\n }\n }\n });\n }\n createEffect(() => {\n let observer: IntersectionObserver;\n\n if (ref && props.text?.startsWith('[TOC]')) {\n list = [...ref.querySelectorAll<HTMLAnchorElement>('.n-md-toc a[href]')];\n heading = [...ref.querySelectorAll<HTMLHeadingElement>('h1, h2, h3, h4, h5, h6')];\n observer = new IntersectionObserver(observerEntry, {\n rootMargin: '-50px 0px',\n threshold: 0.5,\n });\n heading.forEach((e) => observer.observe(e));\n list.forEach((e) => {\n e.addEventListener('click', handleAnchor);\n });\n }\n onCleanup(() => {\n if (observer) {\n heading.forEach((e) => observer.unobserve(e));\n observer.disconnect();\n }\n list.forEach((e) => {\n e.removeEventListener('click', handleAnchor);\n });\n });\n });\n\n return (\n <>\n <style>\n {baseStyle()}\n {mdStyle}\n {css(props.css)}\n </style>\n <Switch>\n <Match when={(props.children as [])?.length}>\n <article class=\"n-md-box\" part=\"box\">\n <div class=\"n-md-body\" part=\"body\">\n <For each={props.children as []}>{(e) => e}</For>\n </div>\n </article>\n </Match>\n <Match when={props.text}>\n <article ref={ref} class={cx('n-md-box', props.class)} part=\"box\" />\n </Match>\n </Switch>\n </>\n );\n}\n\nexport interface MdProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** md内容 */\n text?: string;\n /** 开启图片查看器\n * @since 2.0.8\n * @default true\n */\n pictureViewer?: boolean;\n /** 显示代码块行号\n * @default true\n */\n lineNumber?: boolean;\n /** 开启代码块工具条\n * @default ['copy']\n */\n tools?: 'copy'[];\n /** 指定滚动的容器\n * @default () => window\n */\n getAnchorContainer?: () => HTMLElement;\n /** 不进行解析\n * @default false\n */\n notRender?: boolean;\n children?: JSX.Element;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n 'n-md',\n {\n class: void 0,\n pictureViewer: void 0,\n lineNumber: true,\n text: void 0,\n tools: void 0,\n getAnchorContainer: void 0,\n css: void 0,\n children: void 0,\n notRender: void 0,\n },\n (_, opt) => {\n const el = opt.element;\n const props = mergeProps(\n {\n text: (!_.notRender && el.textContent) || el.text,\n css: el.css,\n tools: el.tools,\n getAnchorContainer: el.getAnchorContainer,\n },\n _,\n );\n\n createEffect(() => {\n el.removeAttribute('css');\n el.replaceChildren();\n });\n return <MD {...props} />;\n },\n);\nexport default MD;\n"],"names":["MD","_props","ref","renderer","Renderer","katexBlock","code","katexInline","baseStyle","theme","props","mergeProps","pictureViewer","text","tools","getAnchorContainer","window","createEffect","frameCallback","postMessage","opt","e","langToolbar","options","tag","image","src","title","alt","toolbar","length","lang","langLineNumber","encodeURIComponent","data","marked","headerPrefix","breaks","pedantic","smartLists","smartypants","xhtml","innerHTML","lineNumber","list","heading","active","handleAnchor","preventDefault","stopPropagation","a","target","hash","querySelector","decodeURIComponent","scrollIntoView","behavior","block","forEach","item","classList","remove","add","open","href","observerEntry","entries","entry","id","getAttribute","all","querySelectorAll","l","idx","indexOf","isIntersecting","push","splice","offsetParent","scrollTo","top","offsetTop","observer","startsWith","IntersectionObserver","rootMargin","threshold","observe","addEventListener","onCleanup","unobserve","disconnect","removeEventListener","mdStyle","css","Switch","Match","children","For","cx","class","customElement","notRender","_","el","element","textContent","removeAttribute","replaceChildren"],"rangeMappings":"","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../components/md/index.tsx"],"sourcesContent":["import { For, Match, Switch, createEffect, mergeProps, onCleanup } from 'solid-js';\nimport { frameCallback } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport marked, { Renderer } from 'marked-completed';\nimport { customElement } from 'solid-element';\nimport '../code';\nimport '../img';\nimport mdStyle from '../md-style';\nimport theme from '../theme';\nimport type { CustomElement } from '..';\n\nfunction MD(_props: MdProps) {\n let ref: HTMLDivElement | undefined;\n const renderer = new Renderer();\n\n renderer.katexBlock = (code: string) => {\n return `<n-katex display-mode=\"true\">${code}</n-katex>`;\n };\n renderer.katexInline = (code: string) => {\n return `<n-katex>${code}</n-katex>`;\n };\n const { baseStyle } = theme;\n const props = mergeProps(\n {\n pictureViewer: true,\n lazyPicture: true,\n text: '',\n tools: ['copy'],\n getAnchorContainer: () => window as unknown as HTMLElement,\n },\n _props,\n );\n\n function update(e: { data: string }) {\n if (ref) {\n ref.innerHTML = e.data;\n }\n }\n function postMessage(opt: {\n text: string;\n pictureViewer?: boolean;\n lazyPicture?: boolean;\n langToolbar?: string[];\n langLineNumber?: boolean;\n }) {\n const { text, pictureViewer, lazyPicture, langToolbar, ...options } = opt;\n\n renderer.image = (src: string, title: string, alt: string) => {\n return `<n-img lazy=\"${lazyPicture}\" disabled=\"${!pictureViewer}\" role=\"img\" src=\"${src}\" alt=\"${alt}\" ${title ? `title=\"${title}\"` : ''}></n-img>`;\n };\n const toolbar = !!langToolbar?.length;\n\n renderer.code = function (code: string, lang: string) {\n if (lang === 'treeview') {\n return `<n-tree data=\"${code}\" />`;\n }\n\n return `<n-code class=\"n-code\" toolbar=\"${toolbar}\" lang=\"${lang}\" ${\n options.langLineNumber ? 'line-number=\"true\"' : ''\n }>${encodeURIComponent(code)}</n-code>`;\n };\n\n update({\n data: marked(text, {\n renderer: renderer,\n langToolbar: langToolbar,\n headerPrefix: '# ',\n breaks: true,\n pedantic: false,\n smartLists: true,\n smartypants: true,\n xhtml: true,\n ...options,\n }),\n });\n }\n // const work = new Worker(new URL('./worker.ts', import.meta.url));\n\n // work.addEventListener('message', update);\n // work.postMessage({\n // text: props.text,\n // langLineNumber: props.lineNumber,\n // langToolbar: props.tools,\n // pictureViewer: props.pictureViewer,\n // });\n // onCleanup(() => {\n // work.terminate();\n // });\n createEffect(() => {\n const call = () =>\n postMessage({\n text: props.text,\n langLineNumber: props.lineNumber,\n langToolbar: props.tools,\n pictureViewer: props.pictureViewer,\n lazyPicture: props.lazyPicture,\n });\n\n frameCallback(call);\n });\n let list: HTMLAnchorElement[] = [];\n let heading: HTMLHeadingElement[] = [];\n const active: HTMLAnchorElement[] = [];\n\n function handleAnchor(e: Event) {\n e.preventDefault();\n e.stopPropagation();\n const a = e.target as HTMLAnchorElement;\n\n if (a.hash) {\n ref?.querySelector(decodeURIComponent(a.hash))?.scrollIntoView({\n behavior: 'smooth',\n block: 'nearest',\n });\n list.forEach((item) => item.classList.remove('active'));\n a.classList.add('active');\n } else {\n window.open(a.href);\n }\n }\n function observerEntry(entries: IntersectionObserverEntry[]) {\n entries.forEach((entry) => {\n const id = entry.target.getAttribute('id');\n const all = entry.target.querySelectorAll('a');\n let a: HTMLAnchorElement | undefined;\n\n list.forEach((l) => {\n if (l.hash === `#${id}`) {\n a = l;\n } else if (!l.hash) {\n all.forEach((e) => {\n if (e.href === l.href) {\n a = l;\n }\n });\n }\n });\n if (a) {\n const idx = active.indexOf(a);\n\n active.forEach((e) => {\n e.classList.remove('active');\n });\n if (entry.isIntersecting) {\n active.push(a);\n } else if (idx !== -1) {\n active.splice(idx, 1);\n }\n if (active[0]) {\n active[0].classList.add('active');\n active[0].offsetParent?.scrollTo({\n top: active[0].offsetTop,\n });\n }\n }\n });\n }\n createEffect(() => {\n let observer: IntersectionObserver;\n\n if (ref && props.text?.startsWith('[TOC]')) {\n list = [...ref.querySelectorAll<HTMLAnchorElement>('.n-md-toc a[href]')];\n heading = [...ref.querySelectorAll<HTMLHeadingElement>('h1, h2, h3, h4, h5, h6')];\n observer = new IntersectionObserver(observerEntry, {\n rootMargin: '-50px 0px',\n threshold: 0.5,\n });\n heading.forEach((e) => observer.observe(e));\n list.forEach((e) => {\n e.addEventListener('click', handleAnchor);\n });\n }\n onCleanup(() => {\n if (observer) {\n heading.forEach((e) => observer.unobserve(e));\n observer.disconnect();\n }\n list.forEach((e) => {\n e.removeEventListener('click', handleAnchor);\n });\n });\n });\n\n return (\n <>\n <style>\n {baseStyle()}\n {mdStyle}\n {css(props.css)}\n </style>\n <Switch>\n <Match when={(props.children as [])?.length}>\n <article class=\"n-md-box\" part=\"box\">\n <div class=\"n-md-body\" part=\"body\">\n <For each={props.children as []}>{(e) => e}</For>\n </div>\n </article>\n </Match>\n <Match when={props.text}>\n <article ref={ref} class={cx('n-md-box', props.class)} part=\"box\" />\n </Match>\n </Switch>\n </>\n );\n}\n\nexport interface MdProps {\n /** 自定义类名 */\n class?: string;\n /** 自定义样式表 */\n css?: string;\n /** md内容 */\n text?: string;\n /** 开启图片查看器\n * @since 2.0.8\n * @default true\n */\n pictureViewer?: boolean;\n /** 开启图片懒加载\n * @since 2.8.3\n * @default true\n */\n lazyPicture?: boolean;\n /** 显示代码块行号\n * @default true\n */\n lineNumber?: boolean;\n /** 开启代码块工具条\n * @default ['copy']\n */\n tools?: 'copy'[];\n /** 指定滚动的容器\n * @default () => window\n */\n getAnchorContainer?: () => HTMLElement;\n /** 不进行解析\n * @default false\n */\n notRender?: boolean;\n children?: JSX.Element;\n}\n\nexport type MdElement = CustomElement<MdProps>;\n\ncustomElement<MdProps>(\n 'n-md',\n {\n class: void 0,\n pictureViewer: void 0,\n lazyPicture: void 0,\n lineNumber: true,\n text: void 0,\n tools: void 0,\n getAnchorContainer: void 0,\n css: void 0,\n children: void 0,\n notRender: void 0,\n },\n (_, opt) => {\n const el = opt.element;\n const props = mergeProps(\n {\n text: (!_.notRender && el.textContent) || el.text,\n css: el.css,\n tools: el.tools,\n getAnchorContainer: el.getAnchorContainer,\n },\n _,\n );\n\n createEffect(() => {\n el.removeAttribute('css');\n el.replaceChildren();\n });\n return <MD {...props} />;\n },\n);\nexport default MD;\n"],"names":["MD","_props","ref","renderer","Renderer","katexBlock","code","katexInline","baseStyle","theme","props","mergeProps","pictureViewer","lazyPicture","text","tools","getAnchorContainer","window","createEffect","frameCallback","postMessage","opt","e","langToolbar","options","image","src","title","alt","toolbar","length","lang","langLineNumber","encodeURIComponent","data","marked","headerPrefix","breaks","pedantic","smartLists","smartypants","xhtml","innerHTML","lineNumber","list","heading","active","handleAnchor","preventDefault","stopPropagation","a","target","hash","querySelector","decodeURIComponent","scrollIntoView","behavior","block","forEach","item","classList","remove","add","open","href","observerEntry","entries","entry","id","getAttribute","all","querySelectorAll","l","idx","indexOf","isIntersecting","push","splice","offsetParent","scrollTo","top","offsetTop","observer","startsWith","IntersectionObserver","rootMargin","threshold","observe","addEventListener","onCleanup","unobserve","disconnect","removeEventListener","mdStyle","css","Switch","Match","children","For","cx","class","customElement","notRender","_","el","element","textContent","removeAttribute","replaceChildren"],"rangeMappings":"","mappings":"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"}
|
package/lib/md-style/index.js
CHANGED
|
@@ -298,12 +298,15 @@
|
|
|
298
298
|
display: flex;
|
|
299
299
|
overflow: hidden;
|
|
300
300
|
margin: auto;
|
|
301
|
-
border-radius: var(--border-radius);
|
|
302
301
|
max-inline-size: 100%;
|
|
303
302
|
inline-size: fit-content;
|
|
304
303
|
cursor: pointer;
|
|
305
304
|
}
|
|
306
305
|
|
|
306
|
+
n-img::part(img) {
|
|
307
|
+
min-inline-size: 25px;
|
|
308
|
+
}
|
|
309
|
+
|
|
307
310
|
ul {
|
|
308
311
|
font-size: var(--font-size);
|
|
309
312
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../components/md-style/index.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nconst mdStyle = css`\n :host,\n :root {\n --table-heading-bg: var(--border-color);\n }\n\n .n-photo-header > span,\n .n-md-body,\n .n-md-toc {\n backdrop-filter: blur(10px);\n }\n\n .n-md-box:not(.site-doc-main) {\n position: relative;\n display: flex;\n margin: 0 auto;\n max-inline-size: 1280px;\n flex-direction: row-reverse;\n gap: 16px;\n }\n\n .n-md-toc,\n .n-md-body {\n border-radius: var(--border-radius);\n background-color: var(--component-bg);\n box-shadow: 0 2px 8px 0 var(--primary-shadow);\n }\n\n .n-md-body {\n overflow: hidden;\n margin: 0 auto 24px;\n padding: 24px;\n color: var(--text-color);\n max-inline-size: 100%;\n box-sizing: border-box;\n overflow-wrap: break-word;\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: background-color;\n flex: 1;\n }\n\n .n-md-body .n-md-body,\n .n-md-body n-md {\n overflow: visible;\n margin: 0;\n padding: 0;\n background-color: unset;\n backdrop-filter: none;\n box-shadow: none;\n }\n\n .n-md-body:has(div:only-child:empty) {\n margin: 0;\n padding: 0;\n background-color: unset;\n backdrop-filter: none;\n box-shadow: none;\n }\n\n a {\n position: relative;\n text-decoration: none;\n color: var(--text-color);\n }\n\n a:visited {\n color: var(--text-secondary);\n }\n\n a:hover {\n color: var(--primary-hover, #80b3ff);\n }\n\n p {\n padding: 0;\n font-size: var(--font-size);\n line-height: 1.8;\n vertical-align: baseline;\n word-wrap: break-word;\n word-break: break-word;\n content-visibility: auto;\n contain-intrinsic-size: 32px;\n margin-block-end: 1em;\n }\n\n ol {\n margin: 0;\n padding: 0 0 0 24px;\n font-size: var(--font-size);\n }\n\n .n-md-toc {\n position: sticky;\n inset-block-start: 24px;\n inset-inline-end: 0;\n z-index: 10;\n display: block;\n overflow-y: auto;\n margin: 0 0 24px;\n padding: 16px;\n max-inline-size: 200px;\n block-size: fit-content;\n max-block-size: calc(100vb - 132px);\n box-sizing: border-box;\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: border-color, background-color, box-shadow;\n }\n\n .n-md-toc li,\n .n-md-toc ol {\n display: grid;\n inline-size: fit-content;\n max-inline-size: 100%;\n font-size: var(--font-size-sm);\n list-style: none;\n }\n\n .n-md-toc li a {\n overflow: hidden;\n max-inline-size: 100%;\n font-size: var(--font-size-sm);\n text-overflow: ellipsis;\n text-decoration: none;\n white-space: nowrap;\n color: var(--text-color);\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: color;\n }\n\n .n-md-toc .active,\n .n-md-toc .active a {\n color: var(--primary-color, #5794ff);\n text-shadow: 0 1px var(--primary-shadow);\n }\n\n .n-md-toc a[href^='http'],\n .n-md-toc a[href^='\\/\\/'],\n .n-md-body table a[href^='http'] {\n &:not(:has(img, n-img))::after {\n content: ' ⎋';\n opacity: 0.3;\n }\n }\n\n a[href^='mailto:']::after {\n content: ' 📧';\n opacity: 0.4;\n }\n\n a[href]:has(img, n-img)::before {\n content: none !important;\n }\n\n a[href]:not(.site-pagination-link)::before {\n position: absolute;\n inset-block-end: 0;\n inset-inline-start: 0;\n inline-size: 100%;\n block-size: 2px;\n background-color: var(--primary-hover, #80b3ff);\n transform: scaleX(0);\n transform-origin: center;\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: transform, background-color;\n opacity: 0.5;\n content: '';\n }\n\n a:hover::before {\n transform: scaleX(1);\n }\n\n th img[src*='browser-logos'] {\n display: block;\n inline-size: 32px;\n block-size: 32px;\n }\n\n h1::before,\n h2::before,\n h3::before,\n h4::before,\n h5::before,\n h6::before {\n color: var(--primary-color, #5794ff);\n content: attr(data-prefix);\n }\n\n h1[data-prefix]::before,\n h2[data-prefix]::before,\n h3[data-prefix]::before,\n h4[data-prefix]::before,\n h5[data-prefix]::before,\n h6[data-prefix]::before {\n color: var(--primary-color, #5794ff);\n content: attr(data-prefix) !important;\n }\n\n code:not([class]),\n mark {\n border-radius: var(--border-radius);\n padding: 2px 7px;\n font-size: 90%;\n color: var(--primary-heading);\n background-color: var(--text-selection);\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: background-color, color;\n }\n\n [data-prefix] code,\n [data-prefix] mark {\n font-size: 60%;\n }\n\n h1,\n h2,\n h3,\n h4,\n h5 {\n margin-block: 1em;\n font-weight: 500;\n color: var(--text-heading);\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: border-color, background-color, box-shadow, color;\n }\n\n table,\n tr th,\n tr td,\n blockquote,\n blockquote::after,\n blockquote::before,\n blockquote p {\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n }\n\n dl {\n padding: 0;\n margin-block-end: 1em;\n }\n\n h1 {\n font-size: 1.6em;\n line-height: 54px;\n }\n\n h2 {\n font-size: 1.5em;\n line-height: 42px;\n counter-increment: section;\n }\n\n h2::before {\n content: counter(section) '. ';\n }\n\n h1,\n h2 {\n border-block-end: 1px dotted var(--border-color);\n padding-block-end: 10px;\n }\n\n h3 {\n font-size: 1.4em;\n line-height: 30px;\n }\n\n h4 {\n font-size: 1.3em;\n line-height: 28px;\n }\n\n h5 {\n font-size: 1.2em;\n list-style: none;\n }\n\n hr {\n margin: 16px 0;\n border: 0 none;\n padding: 0;\n block-size: 2px;\n text-align: start;\n color: var(--text-color);\n background-color: var(--border-color);\n }\n\n p img,\n p n-img {\n position: relative;\n display: flex;\n overflow: hidden;\n margin: auto;\n border-radius: var(--border-radius);\n max-inline-size: 100%;\n inline-size: fit-content;\n cursor: pointer;\n }\n\n ul {\n font-size: var(--font-size);\n }\n\n dl dt {\n margin-block-start: 16px;\n padding: 10px 0;\n font-size: 1em;\n font-weight: bold;\n font-style: italic;\n }\n\n dl dd {\n margin-block-end: 16px;\n margin-inline-start: 0;\n padding: 0 16px;\n }\n\n table {\n overflow: hidden;\n margin-block-end: 16px;\n border-block-end: 1px solid var(--table-heading-bg);\n inline-size: 100%;\n max-inline-size: 100%;\n border-spacing: 0;\n transition-property: border-color;\n word-break: break-all;\n }\n\n table:last-child {\n margin-block-end: 0;\n }\n\n table tbody tr:nth-child(2n) {\n background-color: var(--primary-details-bg);\n }\n\n table tbody tr:hover {\n background-color: var(--primary-selection);\n }\n\n table tr th {\n font-weight: 500;\n min-inline-size: 54px;\n color: var(--text-heading);\n background-color: var(--table-heading-bg);\n transition-property: background-color, color;\n }\n\n table tr th,\n table td {\n padding: 8px 16px;\n }\n\n tr:first-child th:first-child {\n border-start-start-radius: var(--border-radius);\n }\n\n tr:first-child th:last-child {\n border-start-end-radius: var(--border-radius);\n }\n\n blockquote {\n position: relative;\n margin: 30px 48px;\n border-radius: var(--border-radius);\n padding: 16px;\n font-weight: 500;\n background-color: var(--primary-selection);\n transition-property: background-color;\n }\n\n blockquote::before,\n blockquote::after {\n position: absolute;\n font-size: 56px;\n font-family: sans-serif;\n color: var(--primary-active);\n transition-property: color;\n content: '❞';\n line-height: 1;\n }\n\n blockquote::before {\n inset-block-start: -8px;\n inset-inline-start: 0;\n transform: translateX(-44px) rotate(180deg);\n }\n\n blockquote::after {\n inset-inline-end: 0;\n inset-block-end: -8px;\n transform: translateX(44px);\n }\n\n blockquote.n-tip {\n margin: 16px 0 16px 8px;\n border-inline-start: 4px solid var(--primary-color, #5794ff);\n }\n\n blockquote.n-tip::after {\n content: none;\n }\n\n blockquote.n-tip::before {\n inset-block-start: 18px;\n inset-inline-start: -12px;\n border-radius: 100%;\n inline-size: 20px;\n block-size: 20px;\n font-size: 14px;\n font-weight: bold;\n text-align: center;\n color: #fff;\n background-color: var(--primary-color, #5794ff);\n transform: none;\n content: '!';\n line-height: 20px;\n }\n\n blockquote cite {\n font-size: var(--font-size);\n color: var(--cite-color, #bfbfbf);\n line-height: 20px;\n }\n\n blockquote cite::before {\n content: '\\\\2014 \\\\00A0';\n }\n\n blockquote p {\n margin: auto 0;\n font-size: var(--font-size);\n line-height: 24px;\n transition-property: color;\n }\n\n details {\n overflow: hidden;\n border-inline-start: 5px solid var(--primary-hover, #5794ff);\n border-radius: var(--border-radius);\n padding: 12px 24px;\n background: var(--primary-details-bg);\n box-sizing: border-box;\n user-select: none;\n box-shadow: 0 2px 8px 0 var(--primary-shadow, rgb(0 0 0 / 5%));\n }\n\n details,\n details summary {\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: background-color, transform, border-color;\n }\n\n details:not(:last-of-type) {\n margin-block-end: 16px;\n }\n\n details > summary,\n details > summary ~ * {\n font-size: var(--font-size);\n font-weight: normal;\n font-style: normal;\n line-height: 1.4;\n transition-property: background-color, transform, border-color, margin;\n }\n\n details > summary:not(:last-of-type) details > summary ~ *:not(:last-of-type) {\n margin-block-end: 16px;\n }\n\n details > summary {\n font-weight: 500;\n outline: none;\n cursor: pointer;\n transform: translateX(-18px);\n }\n\n details > summary::-webkit-details-marker,\n details > summary::marker {\n display: none;\n color: transparent;\n }\n\n details > summary::before {\n display: inline-block;\n margin-inline-end: 4px;\n inline-size: 14px;\n font-weight: lighter;\n text-align: center;\n opacity: 0.5;\n content: '⛌';\n transform: rotate(45deg);\n }\n\n details[open] {\n user-select: auto;\n }\n\n details[open] > details {\n margin-block-start: 10px;\n }\n\n details[open] > summary {\n margin-block-end: 10px;\n }\n\n details[open] > summary::before {\n transform: rotate(0);\n }\n\n .katex-display {\n overflow-x: auto;\n }\n\n .n-photo-header {\n display: flex;\n flex-wrap: wrap;\n padding: 16px;\n gap: 16px;\n }\n\n .n-photo-header > span {\n border-radius: 8px;\n padding: 4px 10px;\n font-size: 14px;\n font-weight: lighter;\n background-color: rgb(0 0 0 / 20%);\n }\n\n .n-code {\n display: block;\n margin-block-end: 16px;\n }\n\n .n-code:last-child {\n margin-block-end: 0;\n }\n\n @media screen and (width <= 1100px) {\n .n-md-box,\n .n-md-box:not(.site-doc-main),\n .n-md-body {\n max-inline-size: auto;\n }\n\n .n-md-toc {\n position: fixed;\n inset-inline-end: 16px;\n transform: translateX(100%);\n transition: transform var(--transition-duration) var(--transition-timing-function);\n\n &:hover {\n transform: translateX(0);\n }\n }\n }\n`;\n\nexport default mdStyle;\n"],"names":["css"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"kGAwjBA,+CAAA,qBAxjBoB,eAwjBpB,EAtjBgBA,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAojBpB,CAAC"}
|
|
1
|
+
{"version":3,"sources":["../../components/md-style/index.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nconst mdStyle = css`\n :host,\n :root {\n --table-heading-bg: var(--border-color);\n }\n\n .n-photo-header > span,\n .n-md-body,\n .n-md-toc {\n backdrop-filter: blur(10px);\n }\n\n .n-md-box:not(.site-doc-main) {\n position: relative;\n display: flex;\n margin: 0 auto;\n max-inline-size: 1280px;\n flex-direction: row-reverse;\n gap: 16px;\n }\n\n .n-md-toc,\n .n-md-body {\n border-radius: var(--border-radius);\n background-color: var(--component-bg);\n box-shadow: 0 2px 8px 0 var(--primary-shadow);\n }\n\n .n-md-body {\n overflow: hidden;\n margin: 0 auto 24px;\n padding: 24px;\n color: var(--text-color);\n max-inline-size: 100%;\n box-sizing: border-box;\n overflow-wrap: break-word;\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: background-color;\n flex: 1;\n }\n\n .n-md-body .n-md-body,\n .n-md-body n-md {\n overflow: visible;\n margin: 0;\n padding: 0;\n background-color: unset;\n backdrop-filter: none;\n box-shadow: none;\n }\n\n .n-md-body:has(div:only-child:empty) {\n margin: 0;\n padding: 0;\n background-color: unset;\n backdrop-filter: none;\n box-shadow: none;\n }\n\n a {\n position: relative;\n text-decoration: none;\n color: var(--text-color);\n }\n\n a:visited {\n color: var(--text-secondary);\n }\n\n a:hover {\n color: var(--primary-hover, #80b3ff);\n }\n\n p {\n padding: 0;\n font-size: var(--font-size);\n line-height: 1.8;\n vertical-align: baseline;\n word-wrap: break-word;\n word-break: break-word;\n content-visibility: auto;\n contain-intrinsic-size: 32px;\n margin-block-end: 1em;\n }\n\n ol {\n margin: 0;\n padding: 0 0 0 24px;\n font-size: var(--font-size);\n }\n\n .n-md-toc {\n position: sticky;\n inset-block-start: 24px;\n inset-inline-end: 0;\n z-index: 10;\n display: block;\n overflow-y: auto;\n margin: 0 0 24px;\n padding: 16px;\n max-inline-size: 200px;\n block-size: fit-content;\n max-block-size: calc(100vb - 132px);\n box-sizing: border-box;\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: border-color, background-color, box-shadow;\n }\n\n .n-md-toc li,\n .n-md-toc ol {\n display: grid;\n inline-size: fit-content;\n max-inline-size: 100%;\n font-size: var(--font-size-sm);\n list-style: none;\n }\n\n .n-md-toc li a {\n overflow: hidden;\n max-inline-size: 100%;\n font-size: var(--font-size-sm);\n text-overflow: ellipsis;\n text-decoration: none;\n white-space: nowrap;\n color: var(--text-color);\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: color;\n }\n\n .n-md-toc .active,\n .n-md-toc .active a {\n color: var(--primary-color, #5794ff);\n text-shadow: 0 1px var(--primary-shadow);\n }\n\n .n-md-toc a[href^='http'],\n .n-md-toc a[href^='\\/\\/'],\n .n-md-body table a[href^='http'] {\n &:not(:has(img, n-img))::after {\n content: ' ⎋';\n opacity: 0.3;\n }\n }\n\n a[href^='mailto:']::after {\n content: ' 📧';\n opacity: 0.4;\n }\n\n a[href]:has(img, n-img)::before {\n content: none !important;\n }\n\n a[href]:not(.site-pagination-link)::before {\n position: absolute;\n inset-block-end: 0;\n inset-inline-start: 0;\n inline-size: 100%;\n block-size: 2px;\n background-color: var(--primary-hover, #80b3ff);\n transform: scaleX(0);\n transform-origin: center;\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: transform, background-color;\n opacity: 0.5;\n content: '';\n }\n\n a:hover::before {\n transform: scaleX(1);\n }\n\n th img[src*='browser-logos'] {\n display: block;\n inline-size: 32px;\n block-size: 32px;\n }\n\n h1::before,\n h2::before,\n h3::before,\n h4::before,\n h5::before,\n h6::before {\n color: var(--primary-color, #5794ff);\n content: attr(data-prefix);\n }\n\n h1[data-prefix]::before,\n h2[data-prefix]::before,\n h3[data-prefix]::before,\n h4[data-prefix]::before,\n h5[data-prefix]::before,\n h6[data-prefix]::before {\n color: var(--primary-color, #5794ff);\n content: attr(data-prefix) !important;\n }\n\n code:not([class]),\n mark {\n border-radius: var(--border-radius);\n padding: 2px 7px;\n font-size: 90%;\n color: var(--primary-heading);\n background-color: var(--text-selection);\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: background-color, color;\n }\n\n [data-prefix] code,\n [data-prefix] mark {\n font-size: 60%;\n }\n\n h1,\n h2,\n h3,\n h4,\n h5 {\n margin-block: 1em;\n font-weight: 500;\n color: var(--text-heading);\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: border-color, background-color, box-shadow, color;\n }\n\n table,\n tr th,\n tr td,\n blockquote,\n blockquote::after,\n blockquote::before,\n blockquote p {\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n }\n\n dl {\n padding: 0;\n margin-block-end: 1em;\n }\n\n h1 {\n font-size: 1.6em;\n line-height: 54px;\n }\n\n h2 {\n font-size: 1.5em;\n line-height: 42px;\n counter-increment: section;\n }\n\n h2::before {\n content: counter(section) '. ';\n }\n\n h1,\n h2 {\n border-block-end: 1px dotted var(--border-color);\n padding-block-end: 10px;\n }\n\n h3 {\n font-size: 1.4em;\n line-height: 30px;\n }\n\n h4 {\n font-size: 1.3em;\n line-height: 28px;\n }\n\n h5 {\n font-size: 1.2em;\n list-style: none;\n }\n\n hr {\n margin: 16px 0;\n border: 0 none;\n padding: 0;\n block-size: 2px;\n text-align: start;\n color: var(--text-color);\n background-color: var(--border-color);\n }\n\n p img,\n p n-img {\n position: relative;\n display: flex;\n overflow: hidden;\n margin: auto;\n max-inline-size: 100%;\n inline-size: fit-content;\n cursor: pointer;\n }\n\n n-img::part(img) {\n min-inline-size: 25px;\n }\n\n ul {\n font-size: var(--font-size);\n }\n\n dl dt {\n margin-block-start: 16px;\n padding: 10px 0;\n font-size: 1em;\n font-weight: bold;\n font-style: italic;\n }\n\n dl dd {\n margin-block-end: 16px;\n margin-inline-start: 0;\n padding: 0 16px;\n }\n\n table {\n overflow: hidden;\n margin-block-end: 16px;\n border-block-end: 1px solid var(--table-heading-bg);\n inline-size: 100%;\n max-inline-size: 100%;\n border-spacing: 0;\n transition-property: border-color;\n word-break: break-all;\n }\n\n table:last-child {\n margin-block-end: 0;\n }\n\n table tbody tr:nth-child(2n) {\n background-color: var(--primary-details-bg);\n }\n\n table tbody tr:hover {\n background-color: var(--primary-selection);\n }\n\n table tr th {\n font-weight: 500;\n min-inline-size: 54px;\n color: var(--text-heading);\n background-color: var(--table-heading-bg);\n transition-property: background-color, color;\n }\n\n table tr th,\n table td {\n padding: 8px 16px;\n }\n\n tr:first-child th:first-child {\n border-start-start-radius: var(--border-radius);\n }\n\n tr:first-child th:last-child {\n border-start-end-radius: var(--border-radius);\n }\n\n blockquote {\n position: relative;\n margin: 30px 48px;\n border-radius: var(--border-radius);\n padding: 16px;\n font-weight: 500;\n background-color: var(--primary-selection);\n transition-property: background-color;\n }\n\n blockquote::before,\n blockquote::after {\n position: absolute;\n font-size: 56px;\n font-family: sans-serif;\n color: var(--primary-active);\n transition-property: color;\n content: '❞';\n line-height: 1;\n }\n\n blockquote::before {\n inset-block-start: -8px;\n inset-inline-start: 0;\n transform: translateX(-44px) rotate(180deg);\n }\n\n blockquote::after {\n inset-inline-end: 0;\n inset-block-end: -8px;\n transform: translateX(44px);\n }\n\n blockquote.n-tip {\n margin: 16px 0 16px 8px;\n border-inline-start: 4px solid var(--primary-color, #5794ff);\n }\n\n blockquote.n-tip::after {\n content: none;\n }\n\n blockquote.n-tip::before {\n inset-block-start: 18px;\n inset-inline-start: -12px;\n border-radius: 100%;\n inline-size: 20px;\n block-size: 20px;\n font-size: 14px;\n font-weight: bold;\n text-align: center;\n color: #fff;\n background-color: var(--primary-color, #5794ff);\n transform: none;\n content: '!';\n line-height: 20px;\n }\n\n blockquote cite {\n font-size: var(--font-size);\n color: var(--cite-color, #bfbfbf);\n line-height: 20px;\n }\n\n blockquote cite::before {\n content: '\\\\2014 \\\\00A0';\n }\n\n blockquote p {\n margin: auto 0;\n font-size: var(--font-size);\n line-height: 24px;\n transition-property: color;\n }\n\n details {\n overflow: hidden;\n border-inline-start: 5px solid var(--primary-hover, #5794ff);\n border-radius: var(--border-radius);\n padding: 12px 24px;\n background: var(--primary-details-bg);\n box-sizing: border-box;\n user-select: none;\n box-shadow: 0 2px 8px 0 var(--primary-shadow, rgb(0 0 0 / 5%));\n }\n\n details,\n details summary {\n transition-duration: var(--transition-duration);\n transition-timing-function: var(--transition-timing-function);\n transition-property: background-color, transform, border-color;\n }\n\n details:not(:last-of-type) {\n margin-block-end: 16px;\n }\n\n details > summary,\n details > summary ~ * {\n font-size: var(--font-size);\n font-weight: normal;\n font-style: normal;\n line-height: 1.4;\n transition-property: background-color, transform, border-color, margin;\n }\n\n details > summary:not(:last-of-type) details > summary ~ *:not(:last-of-type) {\n margin-block-end: 16px;\n }\n\n details > summary {\n font-weight: 500;\n outline: none;\n cursor: pointer;\n transform: translateX(-18px);\n }\n\n details > summary::-webkit-details-marker,\n details > summary::marker {\n display: none;\n color: transparent;\n }\n\n details > summary::before {\n display: inline-block;\n margin-inline-end: 4px;\n inline-size: 14px;\n font-weight: lighter;\n text-align: center;\n opacity: 0.5;\n content: '⛌';\n transform: rotate(45deg);\n }\n\n details[open] {\n user-select: auto;\n }\n\n details[open] > details {\n margin-block-start: 10px;\n }\n\n details[open] > summary {\n margin-block-end: 10px;\n }\n\n details[open] > summary::before {\n transform: rotate(0);\n }\n\n .katex-display {\n overflow-x: auto;\n }\n\n .n-photo-header {\n display: flex;\n flex-wrap: wrap;\n padding: 16px;\n gap: 16px;\n }\n\n .n-photo-header > span {\n border-radius: 8px;\n padding: 4px 10px;\n font-size: 14px;\n font-weight: lighter;\n background-color: rgb(0 0 0 / 20%);\n }\n\n .n-code {\n display: block;\n margin-block-end: 16px;\n }\n\n .n-code:last-child {\n margin-block-end: 0;\n }\n\n @media screen and (width <= 1100px) {\n .n-md-box,\n .n-md-box:not(.site-doc-main),\n .n-md-body {\n max-inline-size: auto;\n }\n\n .n-md-toc {\n position: fixed;\n inset-inline-end: 16px;\n transform: translateX(100%);\n transition: transform var(--transition-duration) var(--transition-timing-function);\n\n &:hover {\n transform: translateX(0);\n }\n }\n }\n`;\n\nexport default mdStyle;\n"],"names":["css"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"kGA2jBA,+CAAA,qBA3jBoB,eA2jBpB,EAzjBgBA,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAujBpB,CAAC"}
|