neko-ui 2.13.3 → 2.13.5
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/README.md +13 -8
- package/es/marquee/style.js +1 -1
- package/es/marquee/style.js.map +1 -1
- package/lib/marquee/style.js +1 -1
- package/lib/marquee/style.js.map +1 -1
- package/package.json +3 -3
- package/umd/index.js +1 -1
- package/umd/manifest.json +1 -1
package/README.md
CHANGED
|
@@ -32,7 +32,6 @@
|
|
|
32
32
|
[](https://github.com/monako97/neko-ui/actions/workflows/cd.yml)
|
|
33
33
|
[](https://app.fossa.com/projects/git%2Bgithub.com%2Fmonako97%2Fneko-ui?ref=badge_shield)
|
|
34
34
|
|
|
35
|
-
|
|
36
35
|
[![neko-ui][install-tag]][npm-url]
|
|
37
36
|
|
|
38
37
|
## 安装
|
|
@@ -55,10 +54,16 @@ pnpm add neko-ui -S
|
|
|
55
54
|
|
|
56
55
|
```html
|
|
57
56
|
<!-- 引入 CDN 资源 -->
|
|
58
|
-
<script src="https://cdn.jsdelivr.net/npm/neko-ui/
|
|
57
|
+
<script src="https://cdn.jsdelivr.net/npm/neko-ui/lib/index.js"></script>
|
|
58
|
+
<script>
|
|
59
|
+
const { Input } = NekoUI;
|
|
60
|
+
|
|
61
|
+
// 在使用前注册一次就行
|
|
62
|
+
NekoUI.registry(Input);
|
|
63
|
+
</script>
|
|
59
64
|
<!-- 使用 -->
|
|
60
65
|
<body>
|
|
61
|
-
<n-
|
|
66
|
+
<n-input></n-input>
|
|
62
67
|
</body>
|
|
63
68
|
```
|
|
64
69
|
|
|
@@ -66,14 +71,14 @@ pnpm add neko-ui -S
|
|
|
66
71
|
|
|
67
72
|
`neko-ui` 默认支持基于 ES modules 的 tree shaking，直接引入 `import { theme } from 'neko-ui';` 就会有按需加载的效果。
|
|
68
73
|
|
|
69
|
-
###
|
|
74
|
+
### 手动注册组件
|
|
70
75
|
|
|
71
76
|
```jsx
|
|
72
77
|
// 按需引入
|
|
73
|
-
import 'neko-ui
|
|
74
|
-
|
|
75
|
-
//
|
|
76
|
-
|
|
78
|
+
import { Button, DatePicker, registry } from 'neko-ui';
|
|
79
|
+
|
|
80
|
+
// 注册组件
|
|
81
|
+
registry(Button, DatePicker);
|
|
77
82
|
|
|
78
83
|
// 使用
|
|
79
84
|
function Demo() {
|
package/es/marquee/style.js
CHANGED
|
@@ -8,7 +8,6 @@ import{css as e}from"@moneko/css";export const style=e`
|
|
|
8
8
|
margin: auto;
|
|
9
9
|
white-space: nowrap;
|
|
10
10
|
inline-size: 100%;
|
|
11
|
-
gap: 48px;
|
|
12
11
|
|
|
13
12
|
&.n-marquee-mask {
|
|
14
13
|
mask-image: linear-gradient(
|
|
@@ -29,6 +28,7 @@ import{css as e}from"@moneko/css";export const style=e`
|
|
|
29
28
|
animation-iteration-count: infinite;
|
|
30
29
|
animation-name: marquee-content;
|
|
31
30
|
animation-timing-function: linear;
|
|
31
|
+
padding: 0 24px;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
.n-marquee-hover-pause {
|
package/es/marquee/style.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/marquee/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n .n-marquee {\n --speed: 15s;\n\n position: relative;\n display: flex;\n overflow: hidden;\n margin: auto;\n white-space: nowrap;\n inline-size: 100%;\n
|
|
1
|
+
{"version":3,"sources":["components/marquee/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n .n-marquee {\n --speed: 15s;\n\n position: relative;\n display: flex;\n overflow: hidden;\n margin: auto;\n white-space: nowrap;\n inline-size: 100%;\n\n &.n-marquee-mask {\n mask-image: linear-gradient(\n to right,\n transparent 0,\n var(--component-bg) 25%,\n var(--component-bg) 75%,\n transparent 100%\n );\n mask-composite: intersect;\n }\n }\n\n .n-marquee-item {\n display: flex;\n align-items: center;\n animation-duration: var(--speed);\n animation-iteration-count: infinite;\n animation-name: marquee-content;\n animation-timing-function: linear;\n padding: 0 24px;\n }\n\n .n-marquee-hover-pause {\n &:hover .n-marquee-item {\n animation-play-state: paused;\n }\n }\n\n @keyframes marquee-content {\n from {\n transform: translate3d(0%, 0, 0);\n }\n\n to {\n transform: translate3d(-100%, 0, 0);\n }\n }\n`;\n"],"names":["css","style"],"mappings":"AAAA,OAASA,OAAAA,CAAG,KAAQ,aAAc,AAElC,QAAO,MAAMC,MAAQD,CAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDzB,CAAC,AAAC"}
|
package/lib/marquee/style.js
CHANGED
|
@@ -8,7 +8,6 @@
|
|
|
8
8
|
margin: auto;
|
|
9
9
|
white-space: nowrap;
|
|
10
10
|
inline-size: 100%;
|
|
11
|
-
gap: 48px;
|
|
12
11
|
|
|
13
12
|
&.n-marquee-mask {
|
|
14
13
|
mask-image: linear-gradient(
|
|
@@ -29,6 +28,7 @@
|
|
|
29
28
|
animation-iteration-count: infinite;
|
|
30
29
|
animation-name: marquee-content;
|
|
31
30
|
animation-timing-function: linear;
|
|
31
|
+
padding: 0 24px;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
.n-marquee-hover-pause {
|
package/lib/marquee/style.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/marquee/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n .n-marquee {\n --speed: 15s;\n\n position: relative;\n display: flex;\n overflow: hidden;\n margin: auto;\n white-space: nowrap;\n inline-size: 100%;\n
|
|
1
|
+
{"version":3,"sources":["components/marquee/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n .n-marquee {\n --speed: 15s;\n\n position: relative;\n display: flex;\n overflow: hidden;\n margin: auto;\n white-space: nowrap;\n inline-size: 100%;\n\n &.n-marquee-mask {\n mask-image: linear-gradient(\n to right,\n transparent 0,\n var(--component-bg) 25%,\n var(--component-bg) 75%,\n transparent 100%\n );\n mask-composite: intersect;\n }\n }\n\n .n-marquee-item {\n display: flex;\n align-items: center;\n animation-duration: var(--speed);\n animation-iteration-count: infinite;\n animation-name: marquee-content;\n animation-timing-function: linear;\n padding: 0 24px;\n }\n\n .n-marquee-hover-pause {\n &:hover .n-marquee-item {\n animation-play-state: paused;\n }\n }\n\n @keyframes marquee-content {\n from {\n transform: translate3d(0%, 0, 0);\n }\n\n to {\n transform: translate3d(-100%, 0, 0);\n }\n }\n`;\n"],"names":["style","css"],"mappings":"kGAEaA,6CAAAA,qBAFO,eAEPA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDzB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "neko-ui",
|
|
3
|
-
"version": "2.13.
|
|
3
|
+
"version": "2.13.5",
|
|
4
4
|
"description": "WebComponents UI Libraries",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -62,7 +62,7 @@
|
|
|
62
62
|
"ui libraries"
|
|
63
63
|
],
|
|
64
64
|
"devDependencies": {
|
|
65
|
-
"@moneko/core": "3.48.
|
|
65
|
+
"@moneko/core": "3.48.6",
|
|
66
66
|
"@moneko/solid": "1.11.1",
|
|
67
67
|
"@solidjs/testing-library": "0.8.10",
|
|
68
68
|
"@swc/jest": "0.2.39",
|
|
@@ -78,7 +78,7 @@
|
|
|
78
78
|
"shadow-dom-testing-library": "1.12.0"
|
|
79
79
|
},
|
|
80
80
|
"dependencies": {
|
|
81
|
-
"@moneko/common": "1.8.
|
|
81
|
+
"@moneko/common": "1.8.1",
|
|
82
82
|
"@moneko/css": "1.2.0",
|
|
83
83
|
"custom-element-type": "1.0.7",
|
|
84
84
|
"dayjs": "1.11.13",
|
package/umd/index.js
CHANGED
|
@@ -2859,7 +2859,6 @@
|
|
|
2859
2859
|
margin: auto;
|
|
2860
2860
|
white-space: nowrap;
|
|
2861
2861
|
inline-size: 100%;
|
|
2862
|
-
gap: 48px;
|
|
2863
2862
|
|
|
2864
2863
|
&.n-marquee-mask {
|
|
2865
2864
|
mask-image: linear-gradient(
|
|
@@ -2880,6 +2879,7 @@
|
|
|
2880
2879
|
animation-iteration-count: infinite;
|
|
2881
2880
|
animation-name: marquee-content;
|
|
2882
2881
|
animation-timing-function: linear;
|
|
2882
|
+
padding: 0 24px;
|
|
2883
2883
|
}
|
|
2884
2884
|
|
|
2885
2885
|
.n-marquee-hover-pause {
|
package/umd/manifest.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"filename":"manifest.json","name":"neko-ui","description":"WebComponents UI Libraries","start_url":"/?source=pwa","display":"standalone","background_color":"#fff","icons":[{"src":"/favicon.ico","sizes":"48x48","type":"image/x-icon"}],"version":"2.13.
|
|
1
|
+
{"filename":"manifest.json","name":"neko-ui","description":"WebComponents UI Libraries","start_url":"/?source=pwa","display":"standalone","background_color":"#fff","icons":[{"src":"/favicon.ico","sizes":"48x48","type":"image/x-icon"}],"version":"2.13.5-118bfcd088e34fee","hash":"118bfcd088e34fee","content_assets":["index.js"]}
|