intable 0.0.42 → 0.0.44
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/LICENSE +21 -21
- package/README.md +97 -97
- package/dist/__uno.css +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.js +35 -41
- package/dist/plugins/RenderPlugin/index.js +8 -12
- package/dist/plugins/TooltipPlugin.js +1 -1
- package/dist/style.css +2 -2
- package/dist/test.d.ts +4 -0
- package/dist/test.js +40 -0
- package/dist/theme/antd.scss +41 -41
- package/dist/theme/dark.scss +46 -46
- package/dist/theme/element-plus.scss +38 -38
- package/dist/theme/github.scss +80 -80
- package/dist/theme/material.scss +73 -73
- package/dist/theme/shadcn.scss +66 -66
- package/dist/theme/stripe.scss +57 -57
- package/package.json +1 -1
package/LICENSE
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2025 huodoushigemi
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 huodoushigemi
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,97 +1,97 @@
|
|
|
1
|
-
# Intable
|
|
2
|
-
|
|
3
|
-
> 🎯 一个组件搞定所有表格场景 — SolidJS / React / Vue 框架通用
|
|
4
|
-
|
|
5
|
-
[](https://www.npmjs.com/package/intable)
|
|
6
|
-
[](LICENSE)
|
|
7
|
-
[](https://github.com/huodoushigemi/intable/stargazers)
|
|
8
|
-
|
|
9
|
-
---
|
|
10
|
-
|
|
11
|
-
## [🚀 在线体验 Demo](https://huodoushigemi.github.io/intable)
|
|
12
|
-
|
|
13
|
-
---
|
|
14
|
-
|
|
15
|
-
## 🎯 核心功能一览
|
|
16
|
-
|
|
17
|
-
- ✅ **虚拟滚动** — 百万行数据流畅运行
|
|
18
|
-
- ✅ **单元格编辑** — text / number / date / select / checkbox / range / color
|
|
19
|
-
- ✅ **列筛选排序** — 内置 FilterPlugin / SortPlugin
|
|
20
|
-
- ✅ **Excel 复制粘贴** — 多单元格选区 TSV 兼容
|
|
21
|
-
- ✅ **撤销重做** — Ctrl+Z / Ctrl+Y
|
|
22
|
-
- ✅ **Excel 导入导出** — 一键导出 xlsx
|
|
23
|
-
- ✅ **数据校验** — Zod schema 集成
|
|
24
|
-
- ✅ **变更比对** — DiffPlugin 高亮追踪
|
|
25
|
-
|
|
26
|
-
---
|
|
27
|
-
|
|
28
|
-
## 🤖 AI 时代的工作流
|
|
29
|
-
|
|
30
|
-
**安装 Skill：**
|
|
31
|
-
|
|
32
|
-
```bash
|
|
33
|
-
npx skills add huodoushigemi/intable -y --skill intable
|
|
34
|
-
```
|
|
35
|
-
|
|
36
|
-
**效果：** 描述需求（如"加一个大数据量的可编辑表格"），Copilot 自动给出正确代码。
|
|
37
|
-
|
|
38
|
-
---
|
|
39
|
-
|
|
40
|
-
📈 真实项目对比，以「用户管理」模块为例：
|
|
41
|
-
|
|
42
|
-
| 指标 | 使用前 | 使用后 |
|
|
43
|
-
|------|--------|--------|
|
|
44
|
-
| 代码行数 | 500+ | **200-** |
|
|
45
|
-
| AI 消耗 | 100% | **<70%** |
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
---
|
|
49
|
-
|
|
50
|
-
## 🚀 快速开始
|
|
51
|
-
|
|
52
|
-
```bash
|
|
53
|
-
# SolidJS
|
|
54
|
-
pnpm add intable
|
|
55
|
-
|
|
56
|
-
# React
|
|
57
|
-
pnpm add @intable/react
|
|
58
|
-
|
|
59
|
-
# Vue 3
|
|
60
|
-
pnpm add @intable/vue
|
|
61
|
-
```
|
|
62
|
-
|
|
63
|
-
**创建一个表格，只需几行代码：**
|
|
64
|
-
|
|
65
|
-
```tsx
|
|
66
|
-
import Intable from 'intable'
|
|
67
|
-
// import Intable from '@intable/react'
|
|
68
|
-
// import Intable from '@intable/vue'
|
|
69
|
-
|
|
70
|
-
<Intable
|
|
71
|
-
columns={[
|
|
72
|
-
{ id: 'name', name: '姓名', width: 120 },
|
|
73
|
-
{ id: 'age', name: '年龄', width: 80 },
|
|
74
|
-
]}
|
|
75
|
-
data={[
|
|
76
|
-
{ id: 1, name: 'Alice', age: 28 },
|
|
77
|
-
{ id: 2, name: 'Bob', age: 32 },
|
|
78
|
-
]}
|
|
79
|
-
border
|
|
80
|
-
/>
|
|
81
|
-
```
|
|
82
|
-
|
|
83
|
-
---
|
|
84
|
-
|
|
85
|
-
## 🌟 为什么选择 Intable
|
|
86
|
-
|
|
87
|
-
1. **插件化架构** — 责任链 `rewriteProps` 管道，插件完全可组合、可替换
|
|
88
|
-
2. **框架通用** — SolidJS / React / Vue 共享同一套插件 API
|
|
89
|
-
3. **性能优先** — 虚拟滚动，行/列双向渲染，百万行不卡顿
|
|
90
|
-
4. **AI 集成** — Copilot Skill 让 AI 写出正确用法
|
|
91
|
-
5. **渐进增强** — 从简单表格到复杂企业级需求，平滑升级
|
|
92
|
-
|
|
93
|
-
---
|
|
94
|
-
|
|
95
|
-
## License
|
|
96
|
-
|
|
97
|
-
MIT
|
|
1
|
+
# Intable
|
|
2
|
+
|
|
3
|
+
> 🎯 一个组件搞定所有表格场景 — SolidJS / React / Vue 框架通用
|
|
4
|
+
|
|
5
|
+
[](https://www.npmjs.com/package/intable)
|
|
6
|
+
[](LICENSE)
|
|
7
|
+
[](https://github.com/huodoushigemi/intable/stargazers)
|
|
8
|
+
|
|
9
|
+
---
|
|
10
|
+
|
|
11
|
+
## [🚀 在线体验 Demo](https://huodoushigemi.github.io/intable)
|
|
12
|
+
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
## 🎯 核心功能一览
|
|
16
|
+
|
|
17
|
+
- ✅ **虚拟滚动** — 百万行数据流畅运行
|
|
18
|
+
- ✅ **单元格编辑** — text / number / date / select / checkbox / range / color
|
|
19
|
+
- ✅ **列筛选排序** — 内置 FilterPlugin / SortPlugin
|
|
20
|
+
- ✅ **Excel 复制粘贴** — 多单元格选区 TSV 兼容
|
|
21
|
+
- ✅ **撤销重做** — Ctrl+Z / Ctrl+Y
|
|
22
|
+
- ✅ **Excel 导入导出** — 一键导出 xlsx
|
|
23
|
+
- ✅ **数据校验** — Zod schema 集成
|
|
24
|
+
- ✅ **变更比对** — DiffPlugin 高亮追踪
|
|
25
|
+
|
|
26
|
+
---
|
|
27
|
+
|
|
28
|
+
## 🤖 AI 时代的工作流
|
|
29
|
+
|
|
30
|
+
**安装 Skill：**
|
|
31
|
+
|
|
32
|
+
```bash
|
|
33
|
+
npx skills add huodoushigemi/intable -y --skill intable
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
**效果：** 描述需求（如"加一个大数据量的可编辑表格"），Copilot 自动给出正确代码。
|
|
37
|
+
|
|
38
|
+
---
|
|
39
|
+
|
|
40
|
+
📈 真实项目对比，以「用户管理」模块为例：
|
|
41
|
+
|
|
42
|
+
| 指标 | 使用前 | 使用后 |
|
|
43
|
+
|------|--------|--------|
|
|
44
|
+
| 代码行数 | 500+ | **200-** |
|
|
45
|
+
| AI 消耗 | 100% | **<70%** |
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
---
|
|
49
|
+
|
|
50
|
+
## 🚀 快速开始
|
|
51
|
+
|
|
52
|
+
```bash
|
|
53
|
+
# SolidJS
|
|
54
|
+
pnpm add intable
|
|
55
|
+
|
|
56
|
+
# React
|
|
57
|
+
pnpm add @intable/react
|
|
58
|
+
|
|
59
|
+
# Vue 3
|
|
60
|
+
pnpm add @intable/vue
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
**创建一个表格，只需几行代码：**
|
|
64
|
+
|
|
65
|
+
```tsx
|
|
66
|
+
import Intable from 'intable'
|
|
67
|
+
// import Intable from '@intable/react'
|
|
68
|
+
// import Intable from '@intable/vue'
|
|
69
|
+
|
|
70
|
+
<Intable
|
|
71
|
+
columns={[
|
|
72
|
+
{ id: 'name', name: '姓名', width: 120 },
|
|
73
|
+
{ id: 'age', name: '年龄', width: 80 },
|
|
74
|
+
]}
|
|
75
|
+
data={[
|
|
76
|
+
{ id: 1, name: 'Alice', age: 28 },
|
|
77
|
+
{ id: 2, name: 'Bob', age: 32 },
|
|
78
|
+
]}
|
|
79
|
+
border
|
|
80
|
+
/>
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
---
|
|
84
|
+
|
|
85
|
+
## 🌟 为什么选择 Intable
|
|
86
|
+
|
|
87
|
+
1. **插件化架构** — 责任链 `rewriteProps` 管道，插件完全可组合、可替换
|
|
88
|
+
2. **框架通用** — SolidJS / React / Vue 共享同一套插件 API
|
|
89
|
+
3. **性能优先** — 虚拟滚动，行/列双向渲染，百万行不卡顿
|
|
90
|
+
4. **AI 集成** — Copilot Skill 让 AI 写出正确用法
|
|
91
|
+
5. **渐进增强** — 从简单表格到复杂企业级需求，平滑升级
|
|
92
|
+
|
|
93
|
+
---
|
|
94
|
+
|
|
95
|
+
## License
|
|
96
|
+
|
|
97
|
+
MIT
|
package/dist/__uno.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--un-bg-opacity:100%;--un-leading:initial;--un-content:"";--un-translate-x:initial;--un-translate-y:initial;--un-translate-z:initial;--un-text-opacity:100%;--un-border-opacity:100%;--un-space-y-reverse:initial;--un-space-x-reverse:initial;--un-outline-style:solid;--un-outline-opacity:100%}}@property --un-text-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-leading{syntax:"*";inherits:false}@property --un-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --un-outline-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-border-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-bg-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-inset-ring-color{syntax:"*";inherits:false}@property --un-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow-color{syntax:"*";inherits:false}@property --un-ring-color{syntax:"*";inherits:false}@property --un-ring-inset{syntax:"*";inherits:false}@property --un-ring-offset-color{syntax:"*";inherits:false}@property --un-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --un-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow-color{syntax:"*";inherits:false}@property --un-translate-x{syntax:"*";inherits:false;initial-value:0}@property --un-translate-y{syntax:"*";inherits:false;initial-value:0}@property --un-translate-z{syntax:"*";inherits:false;initial-value:0}@property --un-numeric-figure{syntax:"*";inherits:false}@property --un-numeric-fraction{syntax:"*";inherits:false}@property --un-numeric-spacing{syntax:"*";inherits:false}@property --un-ordinal{syntax:"*";inherits:false}@property --un-slashed-zero{syntax:"*";inherits:false}@property --un-space-y-reverse{syntax:"*";inherits:false;initial-value:0}:root,:host{--spacing:.25rem;--radius-DEFAULT:.25rem;--colors-gray-DEFAULT:#99a1af;--leading-snug:1.375;--colors-gray-800:#1e2939;--colors-white:#fff;--colors-gray-100:#f3f4f6;--colors-gray-900:#101828;--text-sm-fontSize:.875rem;--text-sm-lineHeight:1.25rem;--text-xs-fontSize:.75rem;--text-xs-lineHeight:1rem;--default-transition-timingFunction:cubic-bezier(.4,0,.2,1);--default-transition-duration:.15s;--radius-md:.375rem;--radius-xl:.75rem;--fontWeight-medium:500;--fontWeight-semibold:600;--tracking-wide:.025em;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--radius-sm:.25rem;--colors-blue-DEFAULT:#54a2ff;--colors-red-DEFAULT:#ff6568;--text-2xl-fontSize:1.5rem;--text-2xl-lineHeight:2rem;--colors-green-DEFAULT:#05df72;--colors-black:#000;--font-sans:ui-sans-serif,system-ui,-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";--default-font-family:var(--font-sans);--default-monoFont-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--colors-gray-DEFAULT:lab(65.9269% -.832677 -8.17474);--colors-gray-800:lab(16.1051% -1.18239 -11.7533);--colors-gray-100:lab(96.1596% -.082314 -1.13575);--colors-gray-900:lab(8.11897% .811271 -12.254);--colors-blue-DEFAULT:lab(65.0361% -1.42065 -56.9802);--colors-red-DEFAULT:lab(63.7053% 60.745 31.3109);--colors-green-DEFAULT:lab(78.503% -64.9264 39.7492)}}*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-featureSettings,normal);font-variation-settings:var(--default-font-variationSettings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-monoFont-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-monoFont-featureSettings,normal);font-variation-settings:var(--default-monoFont-variationSettings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden~=until-found])){display:none!important}.container{width:100%}.aic{align-items:center}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.text-2xl{font-size:var(--text-2xl-fontSize);line-height:var(--un-leading,var(--text-2xl-lineHeight))}.text-3{font-size:.75rem}.text-3\.5{font-size:.875rem}.text-4{font-size:1rem}.text-sm{font-size:var(--text-sm-fontSize);line-height:var(--un-leading,var(--text-sm-lineHeight))}.text-xs{font-size:var(--text-xs-fontSize);line-height:var(--un-leading,var(--text-xs-lineHeight))}.c-\[--c-primary\]{color:color-mix(in oklab,var(--c-primary)var(--un-text-opacity),transparent)}.c-\#1e3a8a{color:color-mix(in oklab,#1e3a8a var(--un-text-opacity),transparent)}.c-\#7c2d12{color:color-mix(in oklab,#7c2d12 var(--un-text-opacity),transparent)}.c-blue{color:color-mix(in srgb,var(--colors-blue-DEFAULT)var(--un-text-opacity),transparent)}.c-gray\/70{color:color-mix(in srgb,var(--colors-gray-DEFAULT)70%,transparent)}.c-red\/75{color:color-mix(in srgb,var(--colors-red-DEFAULT)75%,transparent)}.leading-5{--un-leading:calc(4px*5);line-height:20px}.lh-\[1\]{--un-leading:1;line-height:1}.tracking-wide{--un-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.font-medium{--un-font-weight:var(--fontWeight-medium);font-weight:var(--fontWeight-medium)}.font-mono{font-family:var(--font-mono)}.font-semibold{--un-font-weight:var(--fontWeight-semibold);font-weight:var(--fontWeight-semibold)}.m9{margin:36px}.mx-1{margin-inline:4px}.mx-2{margin-inline:8px}.mx-3\!{margin-inline:12px!important}.my-1{margin-block:4px}.ml{margin-left:16px}.ml-\.5{margin-left:2px}.ml-1{margin-left:4px}.mr--1{margin-right:-4px}.mr-1{margin-right:4px}.mr-2{margin-right:8px}.mr-2\.5{margin-right:10px}.mt-1{margin-top:4px}.p-0\!{padding:0!important}.p-1{padding:4px}.p-4\!{padding:16px!important}.px,.px-4{padding-inline:16px}.px-1\.5{padding-inline:6px}.px-2{padding-inline:8px}.px-3{padding-inline:12px}.py-1{padding-block:4px}.py-1\.5{padding-block:6px}.py-2{padding-block:8px}.pl-1{padding-left:4px}.pl-4{padding-left:16px}.pr-4{padding-right:16px}.ps{padding-inline-start:16px}.text-center{text-align:center}.outline-0{outline-style:var(--un-outline-style);outline-width:0}.outline-1\.5px{outline-style:var(--un-outline-style);outline-width:1.5px}.outline-2{outline-style:var(--un-outline-style);outline-width:2px}.outline-\[--c-primary\]{outline-color:color-mix(in oklab,var(--c-primary)var(--un-outline-opacity),transparent)}.outline-blue{outline-color:color-mix(in srgb,var(--colors-blue-DEFAULT)var(--un-outline-opacity),transparent)}.outline-none{--un-outline-style:none;outline-style:none}.outline-solid{--un-outline-style:solid;outline-style:solid}.b,.b-1,.border{border-width:1px}.b-2px{border-width:2px}.b-r-0{border-right-width:0}.b-\[--table-bg\]{border-color:color-mix(in oklab,var(--table-bg)var(--un-border-opacity),transparent)}.b-\#00000000\!{border-color:color-mix(in oklab,#0000 var(--un-border-opacity),transparent)!important}.b-\#4f7ff0{border-color:color-mix(in oklab,#4f7ff0 var(--un-border-opacity),transparent)}.b-\#f59e0b{border-color:color-mix(in oklab,#f59e0b var(--un-border-opacity),transparent)}.rd-1{border-radius:.25rem}.rd-1\.5{border-radius:.375rem}.rd-2{border-radius:.5rem}.rd-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rd-l-4{border-top-left-radius:1rem;border-bottom-left-radius:1rem}.b-dashed{--un-border-style:dashed;border-style:dashed}.b-solid{--un-border-style:solid;border-style:solid}.bg-\[--bg\]{background-color:color-mix(in oklab,var(--bg)var(--un-bg-opacity),transparent)}.bg-\[--c-primary\]{background-color:color-mix(in oklab,var(--c-primary)var(--un-bg-opacity),transparent)}.bg-\[--table-bg\]{background-color:color-mix(in oklab,var(--table-bg)var(--un-bg-opacity),transparent)}.bg-\[--table-header-bg\]{background-color:color-mix(in oklab,var(--table-header-bg)var(--un-bg-opacity),transparent)}.bg-\#dbe6ff\/75{background-color:#dbe6ffbf;background-color:lab(91.0303% -.143617 -13.4803/.75)}.bg-\#fff{background-color:color-mix(in oklab,#fff var(--un-bg-opacity),transparent)}.bg-\#fff3d6\/85{background-color:#fff3d6d9;background-color:lab(96.236% .744313 15.5662/.85)}.bg-blue\/20\!{background-color:color-mix(in srgb,var(--colors-blue-DEFAULT)20%,transparent)!important}.bg-gray\/20{background-color:color-mix(in srgb,var(--colors-gray-DEFAULT)20%,transparent)}.bg-green\!{background-color:color-mix(in srgb,var(--colors-green-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-red\!{background-color:color-mix(in srgb,var(--colors-red-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-transparent{background-color:#0000}.hover\:bg-\[--li-hover-bg\]:hover{background-color:color-mix(in oklab,var(--li-hover-bg)var(--un-bg-opacity),transparent)}.hover\:bg-black\/8:hover{background-color:color-mix(in srgb,var(--colors-black)8%,transparent)}.op-0{opacity:0}.op-15{opacity:.15}.op-60{opacity:.6}.op-75{opacity:.75}.op40{opacity:.4}.opacity-50{opacity:.5}.group:hover .group-hover\:op-100{opacity:1}.hover\:underline:hover{text-decoration-line:underline}.flex{display:flex}.flex-1{flex:1}.flex-none{flex:none}.flex-shrink{flex-shrink:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.gap-1{gap:4px}.gap-1\.5{gap:6px}.gap-2{gap:8px}.grid{display:grid}.size-3\.5{width:14px;height:14px}.size-4\!{width:16px!important;height:16px!important}.size-full{width:100%;height:100%}.h-1\!{height:4px!important}.h-2\.5{height:10px}.h-3\.5{height:14px}.h-5{height:20px}.h-6{height:24px}.h-6\.5{height:26px}.h-a\!{height:auto!important}.h-full{height:100%}.max-h-100{max-height:400px}.max-h-60{max-height:240px}.max-h-inherit{max-height:inherit}.min-h-16{min-height:64px}.min-h-40{min-height:160px}.min-h-a\!{min-height:auto!important}.min-w-24{min-width:96px}.min-w-44{min-width:176px}.min-w-52{min-width:208px}.w-10{width:40px}.w-10px\!{width:10px!important}.w-2\.5{width:10px}.w-3\.5{width:14px}.w-6\.5{width:26px}.w-8\!{width:32px!important}.w-a\!{width:auto!important}.w-full{width:100%}.after\:h-1:after{height:4px}.after\:w-1:after{width:4px}.inline{display:inline}.block{display:block}.inline-block{display:inline-block}.contents{display:contents}.hidden{display:none}.visible{visibility:visible}.collapse{visibility:collapse}.cursor-pointer{cursor:pointer}.cursor-crosshair{cursor:crosshair}.cursor-s-resize{cursor:s-resize}.cursor-w-resize{cursor:w-resize}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.resize{resize:both}.resize-none{resize:none}.select-none{-webkit-user-select:none;user-select:none}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.uppercase{text-transform:uppercase}.shadow-sm{--un-shadow:0 1px 3px 0 var(--un-shadow-color,#0000001a),0 1px 2px -1px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow),var(--un-inset-ring-shadow),var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.shadow-xl{--un-shadow:0 20px 25px -5px var(--un-shadow-color,#0000001a),0 8px 10px -6px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow),var(--un-inset-ring-shadow),var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.translate-x--1\/2{--un-translate-x:-50%;translate:var(--un-translate-x)var(--un-translate-y)}.translate-x-1\/2{--un-translate-x:50%;translate:var(--un-translate-x)var(--un-translate-y)}.translate-y--1\/2{--un-translate-y:-50%;translate:var(--un-translate-x)var(--un-translate-y)}.transform{transform:var(--un-rotate-x)var(--un-rotate-y)var(--un-rotate-z)var(--un-skew-x)var(--un-skew-y)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.items-start{align-items:flex-start}.items-center{align-items:center}.box-border{box-sizing:border-box}.inset-0{inset:0}.bottom-0{bottom:0}.left--0,.left-0{left:0}.right-0{right:0}.top-0{top:0}.top-1\/2{top:50%}.justify-end\!{justify-content:flex-end!important}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.z--1{z-index:-1}.z-1{z-index:1}.z-2{z-index:2}.z-9{z-index:9}.overflow-auto{overflow:auto}.of-y-auto{overflow-y:auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.filter{filter:var(--un-blur,)var(--un-brightness,)var(--un-contrast,)var(--un-grayscale,)var(--un-hue-rotate,)var(--un-invert,)var(--un-saturate,)var(--un-sepia,)var(--un-drop-shadow,)}.table{display:table}.table-cell{display:table-cell}.tabular-nums{--un-numeric-spacing:tabular-nums;font-variant-numeric:var(--un-ordinal,)var(--un-slashed-zero,)var(--un-numeric-figure,)var(--un-numeric-spacing,)var(--un-numeric-fraction,)}:where(.space-y-5>:not(:last-child)){--un-space-y-reverse:0;margin-block-start:calc(calc(4px*5)*var(--un-space-y-reverse));margin-block-end:calc(calc(4px*5)*calc(1 - var(--un-space-y-reverse)))}@supports (color:color-mix(in lab, red, red)){.c-blue{color:color-mix(in oklab,var(--colors-blue-DEFAULT)var(--un-text-opacity),transparent)}.c-gray\/70{color:color-mix(in oklab,var(--colors-gray-DEFAULT)70%,transparent)}.c-red\/75{color:color-mix(in oklab,var(--colors-red-DEFAULT)75%,transparent)}.outline-blue{outline-color:color-mix(in oklab,var(--colors-blue-DEFAULT)var(--un-outline-opacity),transparent)}.bg-blue\/20\!{background-color:color-mix(in oklab,var(--colors-blue-DEFAULT)20%,transparent)!important}.bg-gray\/20{background-color:color-mix(in oklab,var(--colors-gray-DEFAULT)20%,transparent)}.bg-green\!{background-color:color-mix(in oklab,var(--colors-green-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-red\!{background-color:color-mix(in oklab,var(--colors-red-DEFAULT)var(--un-bg-opacity),transparent)!important}.hover\:bg-black\/8:hover{background-color:color-mix(in oklab,var(--colors-black)8%,transparent)}}
|
|
1
|
+
@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--un-bg-opacity:100%;--un-leading:initial;--un-content:"";--un-translate-x:initial;--un-translate-y:initial;--un-translate-z:initial;--un-text-opacity:100%;--un-border-opacity:100%;--un-space-y-reverse:initial;--un-space-x-reverse:initial;--un-outline-style:solid;--un-outline-opacity:100%}}@property --un-text-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-leading{syntax:"*";inherits:false}@property --un-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --un-outline-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-border-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-bg-opacity{syntax:"<percentage>";inherits:false;initial-value:100%}@property --un-inset-ring-color{syntax:"*";inherits:false}@property --un-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-inset-shadow-color{syntax:"*";inherits:false}@property --un-ring-color{syntax:"*";inherits:false}@property --un-ring-inset{syntax:"*";inherits:false}@property --un-ring-offset-color{syntax:"*";inherits:false}@property --un-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --un-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --un-shadow-color{syntax:"*";inherits:false}@property --un-translate-x{syntax:"*";inherits:false;initial-value:0}@property --un-translate-y{syntax:"*";inherits:false;initial-value:0}@property --un-translate-z{syntax:"*";inherits:false;initial-value:0}@property --un-numeric-figure{syntax:"*";inherits:false}@property --un-numeric-fraction{syntax:"*";inherits:false}@property --un-numeric-spacing{syntax:"*";inherits:false}@property --un-ordinal{syntax:"*";inherits:false}@property --un-slashed-zero{syntax:"*";inherits:false}@property --un-space-y-reverse{syntax:"*";inherits:false;initial-value:0}:root,:host{--spacing:.25rem;--radius-DEFAULT:.25rem;--colors-gray-DEFAULT:#99a1af;--leading-snug:1.375;--colors-gray-800:#1e2939;--colors-white:#fff;--colors-gray-100:#f3f4f6;--colors-gray-900:#101828;--text-sm-fontSize:.875rem;--text-sm-lineHeight:1.25rem;--text-xs-fontSize:.75rem;--text-xs-lineHeight:1rem;--default-transition-timingFunction:cubic-bezier(.4,0,.2,1);--default-transition-duration:.15s;--radius-md:.375rem;--radius-xl:.75rem;--fontWeight-medium:500;--fontWeight-semibold:600;--tracking-wide:.025em;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--radius-sm:.25rem;--colors-blue-DEFAULT:#54a2ff;--colors-red-DEFAULT:#ff6568;--text-2xl-fontSize:1.5rem;--text-2xl-lineHeight:2rem;--colors-green-DEFAULT:#05df72;--colors-black:#000;--font-sans:ui-sans-serif,system-ui,-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";--default-font-family:var(--font-sans);--default-monoFont-family:var(--font-mono)}@supports (color:lab(0% 0 0)){:root,:host{--colors-gray-DEFAULT:lab(65.9269% -.832707 -8.17474);--colors-gray-800:lab(16.1051% -1.18239 -11.7533);--colors-gray-100:lab(96.1596% -.082314 -1.13575);--colors-gray-900:lab(8.11897% .811279 -12.254);--colors-blue-DEFAULT:lab(65.0361% -1.42062 -56.9803);--colors-red-DEFAULT:lab(63.7053% 60.7449 31.3109);--colors-green-DEFAULT:lab(78.503% -64.9265 39.7492)}}*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-featureSettings,normal);font-variation-settings:var(--default-font-variationSettings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-monoFont-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-monoFont-featureSettings,normal);font-variation-settings:var(--default-monoFont-variationSettings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden~=until-found])){display:none!important}.container{width:100%}.aic{align-items:center}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.text-2xl{font-size:var(--text-2xl-fontSize);line-height:var(--un-leading,var(--text-2xl-lineHeight))}.text-3{font-size:.75rem}.text-3\.5{font-size:.875rem}.text-4{font-size:1rem}.text-sm{font-size:var(--text-sm-fontSize);line-height:var(--un-leading,var(--text-sm-lineHeight))}.text-xs{font-size:var(--text-xs-fontSize);line-height:var(--un-leading,var(--text-xs-lineHeight))}.c-\[--c-primary\]{color:color-mix(in oklab,var(--c-primary)var(--un-text-opacity),transparent)}.c-\#1e3a8a{color:color-mix(in oklab,#1e3a8a var(--un-text-opacity),transparent)}.c-\#7c2d12{color:color-mix(in oklab,#7c2d12 var(--un-text-opacity),transparent)}.c-blue{color:color-mix(in srgb,var(--colors-blue-DEFAULT)var(--un-text-opacity),transparent)}.c-gray\/70{color:color-mix(in srgb,var(--colors-gray-DEFAULT)70%,transparent)}.c-red\/75{color:color-mix(in srgb,var(--colors-red-DEFAULT)75%,transparent)}.leading-5{--un-leading:calc(4px*5);line-height:20px}.lh-\[1\]{--un-leading:1;line-height:1}.tracking-wide{--un-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.font-medium{--un-font-weight:var(--fontWeight-medium);font-weight:var(--fontWeight-medium)}.font-mono{font-family:var(--font-mono)}.font-semibold{--un-font-weight:var(--fontWeight-semibold);font-weight:var(--fontWeight-semibold)}.m9{margin:36px}.mx-1{margin-inline:4px}.mx-2{margin-inline:8px}.mx-3\!{margin-inline:12px!important}.my-1{margin-block:4px}.ml{margin-left:16px}.ml-\.5{margin-left:2px}.ml-1{margin-left:4px}.mr--1{margin-right:-4px}.mr-1{margin-right:4px}.mr-2{margin-right:8px}.mr-2\.5{margin-right:10px}.mt-1{margin-top:4px}.p-0\!{padding:0!important}.p-1{padding:4px}.p-4\!{padding:16px!important}.px,.px-4{padding-inline:16px}.px-1\.5{padding-inline:6px}.px-2{padding-inline:8px}.px-3{padding-inline:12px}.py-1{padding-block:4px}.py-1\.5{padding-block:6px}.py-2{padding-block:8px}.pl-1{padding-left:4px}.pl-4{padding-left:16px}.pr-4{padding-right:16px}.ps{padding-inline-start:16px}.text-center{text-align:center}.outline-0{outline-style:var(--un-outline-style);outline-width:0}.outline-1\.5px{outline-style:var(--un-outline-style);outline-width:1.5px}.outline-2{outline-style:var(--un-outline-style);outline-width:2px}.outline-\[--c-primary\]{outline-color:color-mix(in oklab,var(--c-primary)var(--un-outline-opacity),transparent)}.outline-blue{outline-color:color-mix(in srgb,var(--colors-blue-DEFAULT)var(--un-outline-opacity),transparent)}.outline-none{--un-outline-style:none;outline-style:none}.outline-solid{--un-outline-style:solid;outline-style:solid}.b,.b-1,.border{border-width:1px}.b-2px{border-width:2px}.b-r-0{border-right-width:0}.b-\[--table-bg\]{border-color:color-mix(in oklab,var(--table-bg)var(--un-border-opacity),transparent)}.b-\#00000000\!{border-color:color-mix(in oklab,#0000 var(--un-border-opacity),transparent)!important}.b-\#4f7ff0{border-color:color-mix(in oklab,#4f7ff0 var(--un-border-opacity),transparent)}.b-\#f59e0b{border-color:color-mix(in oklab,#f59e0b var(--un-border-opacity),transparent)}.rd-1{border-radius:.25rem}.rd-1\.5{border-radius:.375rem}.rd-2{border-radius:.5rem}.rd-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rd-l-4{border-top-left-radius:1rem;border-bottom-left-radius:1rem}.b-dashed{--un-border-style:dashed;border-style:dashed}.b-solid{--un-border-style:solid;border-style:solid}.bg-\[--bg\]{background-color:color-mix(in oklab,var(--bg)var(--un-bg-opacity),transparent)}.bg-\[--c-primary\]{background-color:color-mix(in oklab,var(--c-primary)var(--un-bg-opacity),transparent)}.bg-\[--table-bg\]{background-color:color-mix(in oklab,var(--table-bg)var(--un-bg-opacity),transparent)}.bg-\[--table-header-bg\]{background-color:color-mix(in oklab,var(--table-header-bg)var(--un-bg-opacity),transparent)}.bg-\#dbe6ff\/75{background-color:#dbe6ffbf;background-color:lab(91.0303% -.143617 -13.4803/.75)}.bg-\#fff{background-color:color-mix(in oklab,#fff var(--un-bg-opacity),transparent)}.bg-\#fff3d6\/85{background-color:#fff3d6d9;background-color:lab(96.236% .744224 15.5662/.85)}.bg-blue\/20\!{background-color:color-mix(in srgb,var(--colors-blue-DEFAULT)20%,transparent)!important}.bg-gray\/20{background-color:color-mix(in srgb,var(--colors-gray-DEFAULT)20%,transparent)}.bg-green\!{background-color:color-mix(in srgb,var(--colors-green-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-red\!{background-color:color-mix(in srgb,var(--colors-red-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-transparent{background-color:#0000}.hover\:bg-\[--li-hover-bg\]:hover{background-color:color-mix(in oklab,var(--li-hover-bg)var(--un-bg-opacity),transparent)}.hover\:bg-black\/8:hover{background-color:color-mix(in srgb,var(--colors-black)8%,transparent)}.op-0{opacity:0}.op-15{opacity:.15}.op-60{opacity:.6}.op-75{opacity:.75}.op40{opacity:.4}.opacity-50{opacity:.5}.group:hover .group-hover\:op-100{opacity:1}.hover\:underline:hover{text-decoration-line:underline}.flex{display:flex}.flex-1{flex:1}.flex-none{flex:none}.flex-shrink{flex-shrink:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.gap-1{gap:4px}.gap-1\.5{gap:6px}.gap-2{gap:8px}.grid{display:grid}.size-3\.5{width:14px;height:14px}.size-4\!{width:16px!important;height:16px!important}.size-full{width:100%;height:100%}.h-1\!{height:4px!important}.h-2\.5{height:10px}.h-3\.5{height:14px}.h-5{height:20px}.h-6{height:24px}.h-6\.5{height:26px}.h-a\!{height:auto!important}.h-full{height:100%}.max-h-100{max-height:400px}.max-h-60{max-height:240px}.max-h-inherit{max-height:inherit}.min-h-16{min-height:64px}.min-h-40{min-height:160px}.min-h-a\!{min-height:auto!important}.min-w-24{min-width:96px}.min-w-44{min-width:176px}.min-w-52{min-width:208px}.w-10{width:40px}.w-10px\!{width:10px!important}.w-2\.5{width:10px}.w-3\.5{width:14px}.w-6\.5{width:26px}.w-8\!{width:32px!important}.w-a\!{width:auto!important}.w-full{width:100%}.after\:h-1:after{height:4px}.after\:w-1:after{width:4px}.inline{display:inline}.block{display:block}.inline-block{display:inline-block}.contents{display:contents}.hidden{display:none}.visible{visibility:visible}.collapse{visibility:collapse}.cursor-pointer{cursor:pointer}.cursor-crosshair{cursor:crosshair}.cursor-s-resize{cursor:s-resize}.cursor-w-resize{cursor:w-resize}.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.resize{resize:both}.resize-none{resize:none}.select-none{-webkit-user-select:none;user-select:none}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.uppercase{text-transform:uppercase}.shadow-sm{--un-shadow:0 1px 3px 0 var(--un-shadow-color,#0000001a),0 1px 2px -1px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow),var(--un-inset-ring-shadow),var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.shadow-xl{--un-shadow:0 20px 25px -5px var(--un-shadow-color,#0000001a),0 8px 10px -6px var(--un-shadow-color,#0000001a);box-shadow:var(--un-inset-shadow),var(--un-inset-ring-shadow),var(--un-ring-offset-shadow),var(--un-ring-shadow),var(--un-shadow)}.translate-x--1\/2{--un-translate-x:-50%;translate:var(--un-translate-x)var(--un-translate-y)}.translate-x-1\/2{--un-translate-x:50%;translate:var(--un-translate-x)var(--un-translate-y)}.translate-y--1\/2{--un-translate-y:-50%;translate:var(--un-translate-x)var(--un-translate-y)}.transform{transform:var(--un-rotate-x)var(--un-rotate-y)var(--un-rotate-z)var(--un-skew-x)var(--un-skew-y)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,--un-gradient-from,--un-gradient-via,--un-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--un-ease,var(--default-transition-timingFunction));transition-duration:var(--un-duration,var(--default-transition-duration))}.items-start{align-items:flex-start}.items-center{align-items:center}.box-border{box-sizing:border-box}.inset-0{inset:0}.bottom-0{bottom:0}.left--0,.left-0{left:0}.right-0{right:0}.top-0{top:0}.top-1\/2{top:50%}.justify-end\!{justify-content:flex-end!important}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.sticky{position:sticky}.z--1{z-index:-1}.z-1{z-index:1}.z-2{z-index:2}.z-9{z-index:9}.overflow-auto{overflow:auto}.of-y-auto{overflow-y:auto}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:1s linear infinite spin}.filter{filter:var(--un-blur,)var(--un-brightness,)var(--un-contrast,)var(--un-grayscale,)var(--un-hue-rotate,)var(--un-invert,)var(--un-saturate,)var(--un-sepia,)var(--un-drop-shadow,)}.table{display:table}.table-cell{display:table-cell}.tabular-nums{--un-numeric-spacing:tabular-nums;font-variant-numeric:var(--un-ordinal,)var(--un-slashed-zero,)var(--un-numeric-figure,)var(--un-numeric-spacing,)var(--un-numeric-fraction,)}:where(.space-y-5>:not(:last-child)){--un-space-y-reverse:0;margin-block-start:calc(calc(4px*5)*var(--un-space-y-reverse));margin-block-end:calc(calc(4px*5)*calc(1 - var(--un-space-y-reverse)))}@supports (color:color-mix(in lab, red, red)){.c-blue{color:color-mix(in oklab,var(--colors-blue-DEFAULT)var(--un-text-opacity),transparent)}.c-gray\/70{color:color-mix(in oklab,var(--colors-gray-DEFAULT)70%,transparent)}.c-red\/75{color:color-mix(in oklab,var(--colors-red-DEFAULT)75%,transparent)}.outline-blue{outline-color:color-mix(in oklab,var(--colors-blue-DEFAULT)var(--un-outline-opacity),transparent)}.bg-blue\/20\!{background-color:color-mix(in oklab,var(--colors-blue-DEFAULT)20%,transparent)!important}.bg-gray\/20{background-color:color-mix(in oklab,var(--colors-gray-DEFAULT)20%,transparent)}.bg-green\!{background-color:color-mix(in oklab,var(--colors-green-DEFAULT)var(--un-bg-opacity),transparent)!important}.bg-red\!{background-color:color-mix(in oklab,var(--colors-red-DEFAULT)var(--un-bg-opacity),transparent)!important}.hover\:bg-black\/8:hover{background-color:color-mix(in oklab,var(--colors-black)8%,transparent)}}
|
package/dist/index.d.ts
CHANGED
|
@@ -114,16 +114,17 @@ export type THProps = {
|
|
|
114
114
|
colspan?: number;
|
|
115
115
|
style?: any;
|
|
116
116
|
};
|
|
117
|
-
|
|
117
|
+
interface TDProps {
|
|
118
118
|
x: number;
|
|
119
119
|
y: number;
|
|
120
120
|
data: any;
|
|
121
121
|
col: TableColumn;
|
|
122
122
|
value?: any;
|
|
123
|
+
onChange?: (v: any) => void;
|
|
123
124
|
children?: JSX.Element;
|
|
124
125
|
rowspan?: number;
|
|
125
126
|
colspan?: number;
|
|
126
|
-
}
|
|
127
|
+
}
|
|
127
128
|
type Obj = Record<string | symbol, any>;
|
|
128
129
|
export interface TableColumn extends Obj {
|
|
129
130
|
id: any;
|
package/dist/index.js
CHANGED
|
@@ -109,40 +109,44 @@ var THead = () => {
|
|
|
109
109
|
} });
|
|
110
110
|
} });
|
|
111
111
|
}, TBody = () => {
|
|
112
|
-
let { props: _ } = useContext(Ctx);
|
|
112
|
+
let { props: _, store: K } = useContext(Ctx);
|
|
113
113
|
return createComponent(_.Tbody, { get children() {
|
|
114
114
|
return createComponent(_.EachRows, {
|
|
115
115
|
get each() {
|
|
116
116
|
return _.data;
|
|
117
117
|
},
|
|
118
|
-
children: (
|
|
118
|
+
children: (q, J) => createComponent(_.Tr, {
|
|
119
119
|
get y() {
|
|
120
|
-
return
|
|
120
|
+
return J();
|
|
121
121
|
},
|
|
122
122
|
get data() {
|
|
123
|
-
return
|
|
123
|
+
return q();
|
|
124
124
|
},
|
|
125
125
|
get children() {
|
|
126
126
|
return createComponent(_.EachCells, {
|
|
127
127
|
get each() {
|
|
128
128
|
return _.columns;
|
|
129
129
|
},
|
|
130
|
-
children: (
|
|
130
|
+
children: (Y, X) => createComponent(_.Td, {
|
|
131
131
|
get col() {
|
|
132
|
-
return
|
|
132
|
+
return Y();
|
|
133
133
|
},
|
|
134
134
|
get x() {
|
|
135
|
-
return
|
|
135
|
+
return X();
|
|
136
136
|
},
|
|
137
137
|
get y() {
|
|
138
|
-
return
|
|
138
|
+
return J();
|
|
139
139
|
},
|
|
140
140
|
get data() {
|
|
141
|
-
return
|
|
141
|
+
return q();
|
|
142
142
|
},
|
|
143
143
|
get value() {
|
|
144
|
-
return
|
|
145
|
-
}
|
|
144
|
+
return q()[Y().id];
|
|
145
|
+
},
|
|
146
|
+
onChange: (_) => K.commands.rowChange({
|
|
147
|
+
...q(),
|
|
148
|
+
[Y().id]: _
|
|
149
|
+
})
|
|
146
150
|
})
|
|
147
151
|
});
|
|
148
152
|
}
|
|
@@ -153,7 +157,8 @@ var THead = () => {
|
|
|
153
157
|
function BasePlugin() {
|
|
154
158
|
let _ = {
|
|
155
159
|
col: null,
|
|
156
|
-
data: null
|
|
160
|
+
data: null,
|
|
161
|
+
onChange: null
|
|
157
162
|
}, K = (_) => (() => {
|
|
158
163
|
var K = _tmpl$();
|
|
159
164
|
return spread(K, _, !1, !1), K;
|
|
@@ -273,23 +278,19 @@ function BasePlugin() {
|
|
|
273
278
|
}), createComponent(_, q);
|
|
274
279
|
},
|
|
275
280
|
Th: ({ Th: _ = Q }, { store: K }) => (J) => {
|
|
276
|
-
let [Y, X] = createSignal(), { props: Z } = useContext(Ctx), Q = combineProps(J, {
|
|
277
|
-
|
|
278
|
-
return unFn(Z.cellClass, J);
|
|
279
|
-
},
|
|
280
|
-
get style() {
|
|
281
|
-
return unFn(Z.cellStyle, J);
|
|
282
|
-
}
|
|
283
|
-
}, {
|
|
281
|
+
let [Y, X] = createSignal(), { props: Z } = useContext(Ctx), Q = combineProps(J, {
|
|
282
|
+
ref: X,
|
|
284
283
|
get class() {
|
|
285
|
-
return J.col.class;
|
|
284
|
+
return [unFn(Z.cellClass, J), J.col.class].filter(Boolean).join(" ");
|
|
286
285
|
},
|
|
287
286
|
get style() {
|
|
288
|
-
return
|
|
287
|
+
return [
|
|
288
|
+
unFn(Z.cellStyle, J),
|
|
289
|
+
J.col.style,
|
|
290
|
+
J.col.width && `width: ${J.col.width}px; max-width: ${J.col.width}px`
|
|
291
|
+
].filter(Boolean).join(";");
|
|
289
292
|
}
|
|
290
|
-
}
|
|
291
|
-
return J.col.width ? `width: ${J.col.width}px; max-width: ${J.col.width}px` : "";
|
|
292
|
-
} });
|
|
293
|
+
});
|
|
293
294
|
return createEffect(() => {
|
|
294
295
|
if (J.covered || (J.colspan ?? 1) != 1) return;
|
|
295
296
|
let { x: _ } = J;
|
|
@@ -301,26 +302,19 @@ function BasePlugin() {
|
|
|
301
302
|
} }));
|
|
302
303
|
},
|
|
303
304
|
Td: ({ Td: _ = $ }, { store: K }) => (K) => {
|
|
304
|
-
let { props: J } = useContext(Ctx), Y =
|
|
305
|
+
let { props: J } = useContext(Ctx), Y = mergeProps$1(K, {
|
|
305
306
|
get class() {
|
|
306
|
-
return unFn(J.cellClass, K);
|
|
307
|
+
return [unFn(J.cellClass, K), K.col.class].filter(Boolean).join(" ");
|
|
307
308
|
},
|
|
308
309
|
get style() {
|
|
309
|
-
return
|
|
310
|
+
return [
|
|
311
|
+
unFn(J.cellStyle, K),
|
|
312
|
+
K.col.style,
|
|
313
|
+
K.col.width && `width: ${K.col.width}px; max-width: ${K.col.width}px`
|
|
314
|
+
].filter(Boolean).join(";");
|
|
310
315
|
}
|
|
311
|
-
}
|
|
312
|
-
|
|
313
|
-
return K.col.class;
|
|
314
|
-
},
|
|
315
|
-
get style() {
|
|
316
|
-
return K.col.style;
|
|
317
|
-
}
|
|
318
|
-
}, { get style() {
|
|
319
|
-
return K.col.width ? `width: ${K.col.width}px; max-width: ${K.col.width}px` : "";
|
|
320
|
-
} });
|
|
321
|
-
return createComponent(_, mergeProps(Y, { get children() {
|
|
322
|
-
return K.children;
|
|
323
|
-
} }));
|
|
316
|
+
});
|
|
317
|
+
return createComponent(_, Y);
|
|
324
318
|
},
|
|
325
319
|
EachRows: ({ EachRows: _ }) => _ || ((_) => createComponent(For, {
|
|
326
320
|
get each() {
|
|
@@ -1,31 +1,27 @@
|
|
|
1
1
|
import { renderComponent, solidComponent } from "../../components/utils.js";
|
|
2
2
|
import { resolveOptions, toArr } from "../../utils.js";
|
|
3
3
|
import { Checkbox, Files } from "./components.js";
|
|
4
|
-
import { createComponent, insert,
|
|
5
|
-
import { mergeProps as mergeProps$1 } from "solid-js";
|
|
4
|
+
import { createComponent, insert, mergeProps, template } from "solid-js/web";
|
|
6
5
|
var _tmpl$ = /* @__PURE__ */ template("<div class=\"flex items-center h-full\">");
|
|
7
6
|
const RenderPlugin = {
|
|
8
7
|
name: "render",
|
|
9
8
|
priority: -Infinity,
|
|
10
9
|
store: () => ({ renders: { ...renders } }),
|
|
11
|
-
rewriteProps: { Td: ({ Td:
|
|
10
|
+
rewriteProps: { Td: ({ Td: d }, { store: f }) => (p) => createComponent(d, mergeProps(p, { get children() {
|
|
12
11
|
return (() => {
|
|
13
|
-
let
|
|
14
|
-
return renderComponent(
|
|
15
|
-
...h.data,
|
|
16
|
-
[h.col.id]: e
|
|
17
|
-
}) }), m);
|
|
12
|
+
let d = ((e) => typeof e == "string" ? f.renders[e] : e)(p.col.render ?? p.col.type);
|
|
13
|
+
return d ? renderComponent(d, p, f) : text(p);
|
|
18
14
|
})();
|
|
19
15
|
} })) }
|
|
20
16
|
};
|
|
21
|
-
var text = (e) =>
|
|
17
|
+
var text = (e) => e.col.enum ? toArr(e.value).map((d) => resolveOptions(e.col.enum).find((e) => e.value == d)?.label ?? d).join(", ") : e.value;
|
|
22
18
|
const renders = {
|
|
23
19
|
text,
|
|
24
20
|
number: text,
|
|
25
21
|
date: text,
|
|
26
22
|
checkbox: (e) => (() => {
|
|
27
|
-
var
|
|
28
|
-
return insert(
|
|
23
|
+
var d = _tmpl$();
|
|
24
|
+
return insert(d, createComponent(Checkbox, {
|
|
29
25
|
class: "",
|
|
30
26
|
get value() {
|
|
31
27
|
return e.value;
|
|
@@ -33,7 +29,7 @@ const renders = {
|
|
|
33
29
|
get onChange() {
|
|
34
30
|
return e.onChange;
|
|
35
31
|
}
|
|
36
|
-
})),
|
|
32
|
+
})), d;
|
|
37
33
|
})(),
|
|
38
34
|
file: (e) => createComponent(Files, {
|
|
39
35
|
get value() {
|
|
@@ -9,7 +9,7 @@ const TooltipPlugin = {
|
|
|
9
9
|
rewriteProps: { Td: ({ Td: c }, { store: l }) => (u) => {
|
|
10
10
|
let d = () => {
|
|
11
11
|
let s = u.col.tooltip;
|
|
12
|
-
if (s != null) return typeof s == "boolean"
|
|
12
|
+
if (s != null) return typeof s == "boolean" && (s = s && u.value != null ? String(u.value) : void 0), typeof s == "function" && (s = s(u)), renderComponent(s, u, l);
|
|
13
13
|
}, [f, p] = createSignal();
|
|
14
14
|
return u = combineProps({ ref: p }, u), createComponent(c, mergeProps(u, { get children() {
|
|
15
15
|
return createComponent(Show, {
|