@crispy-seed/data-table 0.8.0 → 0.10.0
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/dist/data-table-recipe.css +116 -2
- package/dist/data-table-recipe.layered.css +121 -1
- package/dist/index.cjs +3506 -320
- package/dist/index.d.ts +159 -26
- package/dist/index.js +3508 -322
- package/dist/record-preview-recipe.css +16 -0
- package/dist/record-preview-recipe.layered.css +19 -0
- package/dist/resizable-panel-recipe.css +38 -10
- package/dist/resizable-panel-recipe.layered.css +42 -10
- package/dist/styles.css +182 -11
- package/package.json +3 -2
|
@@ -224,4 +224,20 @@
|
|
|
224
224
|
gap: 8px;
|
|
225
225
|
padding: 8px 12px;
|
|
226
226
|
border-top: 1px solid var(--seed-color-stroke-neutral-muted);
|
|
227
|
+
}
|
|
228
|
+
.seed-record-preview__tabsRoot {
|
|
229
|
+
flex: 1;
|
|
230
|
+
min-height: 0;
|
|
231
|
+
display: flex;
|
|
232
|
+
flex-direction: column;
|
|
233
|
+
overflow: hidden;
|
|
234
|
+
}
|
|
235
|
+
.seed-record-preview__tabPanel {
|
|
236
|
+
flex: 1;
|
|
237
|
+
min-height: 0;
|
|
238
|
+
overflow-y: auto;
|
|
239
|
+
padding: 8px 12px;
|
|
240
|
+
}
|
|
241
|
+
.seed-record-preview__tabBadge {
|
|
242
|
+
margin-inline-start: 6px;
|
|
227
243
|
}
|
|
@@ -260,4 +260,23 @@
|
|
|
260
260
|
padding: 8px 12px;
|
|
261
261
|
display: flex;
|
|
262
262
|
}
|
|
263
|
+
|
|
264
|
+
.seed-record-preview__tabsRoot {
|
|
265
|
+
flex-direction: column;
|
|
266
|
+
flex: 1;
|
|
267
|
+
min-height: 0;
|
|
268
|
+
display: flex;
|
|
269
|
+
overflow: hidden;
|
|
270
|
+
}
|
|
271
|
+
|
|
272
|
+
.seed-record-preview__tabPanel {
|
|
273
|
+
flex: 1;
|
|
274
|
+
min-height: 0;
|
|
275
|
+
padding: 8px 12px;
|
|
276
|
+
overflow-y: auto;
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
.seed-record-preview__tabBadge {
|
|
280
|
+
margin-inline-start: 6px;
|
|
281
|
+
}
|
|
263
282
|
}
|
|
@@ -3,6 +3,13 @@
|
|
|
3
3
|
display: flex;
|
|
4
4
|
height: 100%;
|
|
5
5
|
}
|
|
6
|
+
.seed-resizable-panel__root[data-floating='true'] {
|
|
7
|
+
position: absolute;
|
|
8
|
+
inset: 0;
|
|
9
|
+
display: block;
|
|
10
|
+
height: auto;
|
|
11
|
+
pointer-events: none;
|
|
12
|
+
}
|
|
6
13
|
.seed-resizable-panel__spacer {
|
|
7
14
|
flex: 0 0 auto;
|
|
8
15
|
height: 100%;
|
|
@@ -34,27 +41,32 @@
|
|
|
34
41
|
}
|
|
35
42
|
.seed-resizable-panel__panel[data-floating='true'] {
|
|
36
43
|
position: absolute;
|
|
37
|
-
top:
|
|
38
|
-
bottom:
|
|
44
|
+
top: 0;
|
|
45
|
+
bottom: 0;
|
|
39
46
|
z-index: 20;
|
|
47
|
+
pointer-events: auto;
|
|
40
48
|
border-inline-end: none;
|
|
41
49
|
border-inline-start: none;
|
|
42
|
-
border-radius: 12px;
|
|
43
|
-
box-shadow: 0 0 0 1px rgba(28,40,64,0.04), 0 4px 8px -4px rgba(28,40,64,0.12), 0 4px 12px -2px rgba(24,41,75,0.16);
|
|
44
50
|
transform: none;
|
|
45
51
|
opacity: 1;
|
|
46
52
|
}
|
|
47
53
|
.seed-resizable-panel__panel[data-floating='true'][data-side='left'] {
|
|
48
|
-
left:
|
|
54
|
+
left: 0;
|
|
55
|
+
border-top-right-radius: 12px;
|
|
56
|
+
border-bottom-right-radius: 12px;
|
|
57
|
+
box-shadow: 1px 0 0 rgba(28,40,64,0.04), 8px 0 16px -6px rgba(28,40,64,0.12), 8px 0 24px -4px rgba(24,41,75,0.16);
|
|
49
58
|
}
|
|
50
59
|
.seed-resizable-panel__panel[data-floating='true'][data-side='right'] {
|
|
51
|
-
right:
|
|
60
|
+
right: 0;
|
|
61
|
+
border-top-left-radius: 12px;
|
|
62
|
+
border-bottom-left-radius: 12px;
|
|
63
|
+
box-shadow: -1px 0 0 rgba(28,40,64,0.04), -8px 0 16px -6px rgba(28,40,64,0.12), -8px 0 24px -4px rgba(24,41,75,0.16);
|
|
52
64
|
}
|
|
53
65
|
.seed-resizable-panel__panel[data-floating='true'][data-side='left'][data-state='open'] {
|
|
54
66
|
animation: seed-enter;
|
|
55
67
|
animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
|
|
56
68
|
animation-duration: 0.18s;
|
|
57
|
-
--seed-enter-translate-x:
|
|
69
|
+
--seed-enter-translate-x: -100%;
|
|
58
70
|
--seed-enter-translate-y: 0;
|
|
59
71
|
--seed-enter-opacity: 0;
|
|
60
72
|
--seed-enter-scale: 1;
|
|
@@ -69,7 +81,7 @@
|
|
|
69
81
|
animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
|
|
70
82
|
animation-duration: 0.14s;
|
|
71
83
|
animation-fill-mode: forwards;
|
|
72
|
-
--seed-exit-translate-x:
|
|
84
|
+
--seed-exit-translate-x: -100%;
|
|
73
85
|
--seed-exit-translate-y: 0;
|
|
74
86
|
--seed-exit-opacity: 0;
|
|
75
87
|
--seed-exit-scale: 1;
|
|
@@ -83,7 +95,7 @@
|
|
|
83
95
|
animation: seed-enter;
|
|
84
96
|
animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
|
|
85
97
|
animation-duration: 0.18s;
|
|
86
|
-
--seed-enter-translate-x:
|
|
98
|
+
--seed-enter-translate-x: 100%;
|
|
87
99
|
--seed-enter-translate-y: 0;
|
|
88
100
|
--seed-enter-opacity: 0;
|
|
89
101
|
--seed-enter-scale: 1;
|
|
@@ -98,7 +110,7 @@
|
|
|
98
110
|
animation-timing-function: cubic-bezier(0.4, 0, 1, 1);
|
|
99
111
|
animation-duration: 0.14s;
|
|
100
112
|
animation-fill-mode: forwards;
|
|
101
|
-
--seed-exit-translate-x:
|
|
113
|
+
--seed-exit-translate-x: 100%;
|
|
102
114
|
--seed-exit-translate-y: 0;
|
|
103
115
|
--seed-exit-opacity: 0;
|
|
104
116
|
--seed-exit-scale: 1;
|
|
@@ -111,6 +123,22 @@
|
|
|
111
123
|
.seed-resizable-panel__inner {
|
|
112
124
|
height: 100%;
|
|
113
125
|
}
|
|
126
|
+
.seed-resizable-panel__backdrop {
|
|
127
|
+
position: absolute;
|
|
128
|
+
inset: 0;
|
|
129
|
+
z-index: 19;
|
|
130
|
+
pointer-events: auto;
|
|
131
|
+
background: rgba(15, 19, 32, 0.32);
|
|
132
|
+
opacity: 0;
|
|
133
|
+
transition: opacity 0.16s cubic-bezier(0.4, 0, 1, 1);
|
|
134
|
+
}
|
|
135
|
+
.seed-resizable-panel__backdrop[data-state='open'] {
|
|
136
|
+
opacity: 1;
|
|
137
|
+
transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
|
|
138
|
+
}
|
|
139
|
+
.seed-resizable-panel__backdrop[data-state='closed'] {
|
|
140
|
+
opacity: 0;
|
|
141
|
+
}
|
|
114
142
|
.seed-resizable-panel__handle {
|
|
115
143
|
position: absolute;
|
|
116
144
|
top: 0;
|
|
@@ -5,6 +5,14 @@
|
|
|
5
5
|
position: relative;
|
|
6
6
|
}
|
|
7
7
|
|
|
8
|
+
.seed-resizable-panel__root[data-floating="true"] {
|
|
9
|
+
pointer-events: none;
|
|
10
|
+
height: auto;
|
|
11
|
+
display: block;
|
|
12
|
+
position: absolute;
|
|
13
|
+
inset: 0;
|
|
14
|
+
}
|
|
15
|
+
|
|
8
16
|
.seed-resizable-panel__spacer {
|
|
9
17
|
flex: none;
|
|
10
18
|
height: 100%;
|
|
@@ -43,26 +51,31 @@
|
|
|
43
51
|
|
|
44
52
|
.seed-resizable-panel__panel[data-floating="true"] {
|
|
45
53
|
z-index: 20;
|
|
54
|
+
pointer-events: auto;
|
|
46
55
|
opacity: 1;
|
|
47
56
|
border-inline: none;
|
|
48
|
-
border-radius: 12px;
|
|
49
57
|
position: absolute;
|
|
50
|
-
top:
|
|
51
|
-
bottom:
|
|
58
|
+
top: 0;
|
|
59
|
+
bottom: 0;
|
|
52
60
|
transform: none;
|
|
53
|
-
box-shadow: 0 0 0 1px #1c28400a, 0 4px 8px -4px #1c28401f, 0 4px 12px -2px #18294b29;
|
|
54
61
|
}
|
|
55
62
|
|
|
56
63
|
.seed-resizable-panel__panel[data-floating="true"][data-side="left"] {
|
|
57
|
-
|
|
64
|
+
border-top-right-radius: 12px;
|
|
65
|
+
border-bottom-right-radius: 12px;
|
|
66
|
+
left: 0;
|
|
67
|
+
box-shadow: 1px 0 #1c28400a, 8px 0 16px -6px #1c28401f, 8px 0 24px -4px #18294b29;
|
|
58
68
|
}
|
|
59
69
|
|
|
60
70
|
.seed-resizable-panel__panel[data-floating="true"][data-side="right"] {
|
|
61
|
-
|
|
71
|
+
border-top-left-radius: 12px;
|
|
72
|
+
border-bottom-left-radius: 12px;
|
|
73
|
+
right: 0;
|
|
74
|
+
box-shadow: -1px 0 #1c28400a, -8px 0 16px -6px #1c28401f, -8px 0 24px -4px #18294b29;
|
|
62
75
|
}
|
|
63
76
|
|
|
64
77
|
.seed-resizable-panel__panel[data-floating="true"][data-side="left"][data-state="open"] {
|
|
65
|
-
--seed-enter-translate-x:
|
|
78
|
+
--seed-enter-translate-x: -100%;
|
|
66
79
|
--seed-enter-translate-y: 0;
|
|
67
80
|
--seed-enter-opacity: 0;
|
|
68
81
|
--seed-enter-scale: 1;
|
|
@@ -76,7 +89,7 @@
|
|
|
76
89
|
}
|
|
77
90
|
|
|
78
91
|
.seed-resizable-panel__panel[data-floating="true"][data-side="left"][data-state="closed"] {
|
|
79
|
-
--seed-exit-translate-x:
|
|
92
|
+
--seed-exit-translate-x: -100%;
|
|
80
93
|
--seed-exit-translate-y: 0;
|
|
81
94
|
--seed-exit-opacity: 0;
|
|
82
95
|
--seed-exit-scale: 1;
|
|
@@ -90,7 +103,7 @@
|
|
|
90
103
|
}
|
|
91
104
|
|
|
92
105
|
.seed-resizable-panel__panel[data-floating="true"][data-side="right"][data-state="open"] {
|
|
93
|
-
--seed-enter-translate-x:
|
|
106
|
+
--seed-enter-translate-x: 100%;
|
|
94
107
|
--seed-enter-translate-y: 0;
|
|
95
108
|
--seed-enter-opacity: 0;
|
|
96
109
|
--seed-enter-scale: 1;
|
|
@@ -104,7 +117,7 @@
|
|
|
104
117
|
}
|
|
105
118
|
|
|
106
119
|
.seed-resizable-panel__panel[data-floating="true"][data-side="right"][data-state="closed"] {
|
|
107
|
-
--seed-exit-translate-x:
|
|
120
|
+
--seed-exit-translate-x: 100%;
|
|
108
121
|
--seed-exit-translate-y: 0;
|
|
109
122
|
--seed-exit-opacity: 0;
|
|
110
123
|
--seed-exit-scale: 1;
|
|
@@ -121,6 +134,25 @@
|
|
|
121
134
|
height: 100%;
|
|
122
135
|
}
|
|
123
136
|
|
|
137
|
+
.seed-resizable-panel__backdrop {
|
|
138
|
+
z-index: 19;
|
|
139
|
+
pointer-events: auto;
|
|
140
|
+
opacity: 0;
|
|
141
|
+
background: #0f132052;
|
|
142
|
+
transition: opacity .16s cubic-bezier(.4, 0, 1, 1);
|
|
143
|
+
position: absolute;
|
|
144
|
+
inset: 0;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
.seed-resizable-panel__backdrop[data-state="open"] {
|
|
148
|
+
opacity: 1;
|
|
149
|
+
transition-timing-function: cubic-bezier(.16, 1, .3, 1);
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
.seed-resizable-panel__backdrop[data-state="closed"] {
|
|
153
|
+
opacity: 0;
|
|
154
|
+
}
|
|
155
|
+
|
|
124
156
|
.seed-resizable-panel__handle {
|
|
125
157
|
z-index: 2;
|
|
126
158
|
cursor: col-resize;
|
package/dist/styles.css
CHANGED
|
@@ -4937,6 +4937,7 @@ tbody tr:last-child .seed-data-table__cell {
|
|
|
4937
4937
|
align-items: center;
|
|
4938
4938
|
gap: 6px;
|
|
4939
4939
|
margin-inline-start: auto;
|
|
4940
|
+
transition: opacity .15s;
|
|
4940
4941
|
display: flex;
|
|
4941
4942
|
}
|
|
4942
4943
|
|
|
@@ -4956,8 +4957,9 @@ tr:hover .seed-data-table__entityActions, .seed-data-table__entityActions:focus-
|
|
|
4956
4957
|
justify-content: center;
|
|
4957
4958
|
align-items: center;
|
|
4958
4959
|
margin: 0;
|
|
4959
|
-
padding:
|
|
4960
|
+
padding: 2px;
|
|
4960
4961
|
font-family: inherit;
|
|
4962
|
+
transition: background-color .2s, color .2s, box-shadow .2s;
|
|
4961
4963
|
display: inline-flex;
|
|
4962
4964
|
}
|
|
4963
4965
|
|
|
@@ -4979,6 +4981,124 @@ tr:hover .seed-data-table__entityActions, .seed-data-table__entityActions:focus-
|
|
|
4979
4981
|
text-decoration: underline;
|
|
4980
4982
|
}
|
|
4981
4983
|
|
|
4984
|
+
.seed-data-table__chip {
|
|
4985
|
+
box-sizing: border-box;
|
|
4986
|
+
max-width: 100%;
|
|
4987
|
+
height: 22px;
|
|
4988
|
+
font-size: 10px;
|
|
4989
|
+
font-weight: var(--seed-font-weight-regular);
|
|
4990
|
+
text-overflow: ellipsis;
|
|
4991
|
+
white-space: nowrap;
|
|
4992
|
+
border-radius: 7px;
|
|
4993
|
+
flex-shrink: 0;
|
|
4994
|
+
align-items: center;
|
|
4995
|
+
padding: 0 4px;
|
|
4996
|
+
line-height: 22px;
|
|
4997
|
+
display: inline-flex;
|
|
4998
|
+
overflow: clip;
|
|
4999
|
+
}
|
|
5000
|
+
|
|
5001
|
+
.seed-data-table__chipList {
|
|
5002
|
+
align-items: center;
|
|
5003
|
+
gap: var(--seed-dimension-x1_5);
|
|
5004
|
+
flex-wrap: nowrap;
|
|
5005
|
+
width: 100%;
|
|
5006
|
+
min-width: 0;
|
|
5007
|
+
display: flex;
|
|
5008
|
+
overflow: hidden;
|
|
5009
|
+
}
|
|
5010
|
+
|
|
5011
|
+
.seed-data-table__chipRemove {
|
|
5012
|
+
box-sizing: border-box;
|
|
5013
|
+
width: 12px;
|
|
5014
|
+
height: 12px;
|
|
5015
|
+
color: inherit;
|
|
5016
|
+
opacity: .6;
|
|
5017
|
+
cursor: pointer;
|
|
5018
|
+
background: none;
|
|
5019
|
+
border: none;
|
|
5020
|
+
border-radius: 999px;
|
|
5021
|
+
flex-shrink: 0;
|
|
5022
|
+
justify-content: center;
|
|
5023
|
+
align-items: center;
|
|
5024
|
+
margin: 0;
|
|
5025
|
+
margin-inline-start: 2px;
|
|
5026
|
+
padding: 0;
|
|
5027
|
+
transition: opacity .12s, background-color .12s;
|
|
5028
|
+
display: inline-flex;
|
|
5029
|
+
}
|
|
5030
|
+
|
|
5031
|
+
.seed-data-table__chipRemove:hover {
|
|
5032
|
+
opacity: 1;
|
|
5033
|
+
background-color: #00000014;
|
|
5034
|
+
}
|
|
5035
|
+
|
|
5036
|
+
.seed-data-table__chipInput {
|
|
5037
|
+
min-width: 40px;
|
|
5038
|
+
height: 22px;
|
|
5039
|
+
font-family: inherit;
|
|
5040
|
+
font-size: var(--seed-font-size-t4);
|
|
5041
|
+
color: var(--seed-color-fg-neutral);
|
|
5042
|
+
letter-spacing: -.14px;
|
|
5043
|
+
background: none;
|
|
5044
|
+
border: none;
|
|
5045
|
+
outline: none;
|
|
5046
|
+
flex: auto;
|
|
5047
|
+
margin: 0;
|
|
5048
|
+
padding: 0;
|
|
5049
|
+
}
|
|
5050
|
+
|
|
5051
|
+
.seed-data-table__expandOverlay {
|
|
5052
|
+
box-sizing: border-box;
|
|
5053
|
+
top: -1px;
|
|
5054
|
+
z-index: 10;
|
|
5055
|
+
min-height: calc(100% + 2px);
|
|
5056
|
+
padding-inline: var(--seed-dimension-x3);
|
|
5057
|
+
padding-block: var(--seed-dimension-x3);
|
|
5058
|
+
background-color: var(--seed-color-bg-layer-floating);
|
|
5059
|
+
border-radius: var(--seed-radius-r5);
|
|
5060
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak), var(--seed-shadow-s3);
|
|
5061
|
+
color: var(--seed-color-fg-neutral);
|
|
5062
|
+
font-size: var(--seed-font-size-t4);
|
|
5063
|
+
line-height: var(--seed-line-height-t4);
|
|
5064
|
+
letter-spacing: -.14px;
|
|
5065
|
+
cursor: default;
|
|
5066
|
+
align-items: flex-start;
|
|
5067
|
+
display: flex;
|
|
5068
|
+
position: absolute;
|
|
5069
|
+
inset-inline: -1px;
|
|
5070
|
+
}
|
|
5071
|
+
|
|
5072
|
+
.seed-data-table__expandOverlayText {
|
|
5073
|
+
white-space: normal;
|
|
5074
|
+
word-break: break-word;
|
|
5075
|
+
width: 100%;
|
|
5076
|
+
min-width: 0;
|
|
5077
|
+
}
|
|
5078
|
+
|
|
5079
|
+
.seed-data-table__cellSuffixRow {
|
|
5080
|
+
align-items: center;
|
|
5081
|
+
gap: 4px;
|
|
5082
|
+
width: 100%;
|
|
5083
|
+
min-width: 0;
|
|
5084
|
+
display: flex;
|
|
5085
|
+
}
|
|
5086
|
+
|
|
5087
|
+
.seed-data-table__cellSuffixText {
|
|
5088
|
+
text-overflow: ellipsis;
|
|
5089
|
+
white-space: nowrap;
|
|
5090
|
+
flex: 1;
|
|
5091
|
+
min-width: 0;
|
|
5092
|
+
overflow: clip;
|
|
5093
|
+
}
|
|
5094
|
+
|
|
5095
|
+
.seed-data-table__cellSuffixIcon {
|
|
5096
|
+
color: color-mix(in srgb, var(--seed-color-fg-neutral) 55%, transparent);
|
|
5097
|
+
flex-shrink: 0;
|
|
5098
|
+
align-items: center;
|
|
5099
|
+
display: inline-flex;
|
|
5100
|
+
}
|
|
5101
|
+
|
|
4982
5102
|
.seed-data-table__toolbar {
|
|
4983
5103
|
box-sizing: border-box;
|
|
4984
5104
|
align-items: center;
|
|
@@ -10285,12 +10405,39 @@ tr:hover .seed-data-table__entityActions, .seed-data-table__entityActions:focus-
|
|
|
10285
10405
|
display: flex;
|
|
10286
10406
|
}
|
|
10287
10407
|
|
|
10408
|
+
.seed-record-preview__tabsRoot {
|
|
10409
|
+
flex-direction: column;
|
|
10410
|
+
flex: 1;
|
|
10411
|
+
min-height: 0;
|
|
10412
|
+
display: flex;
|
|
10413
|
+
overflow: hidden;
|
|
10414
|
+
}
|
|
10415
|
+
|
|
10416
|
+
.seed-record-preview__tabPanel {
|
|
10417
|
+
flex: 1;
|
|
10418
|
+
min-height: 0;
|
|
10419
|
+
padding: 8px 12px;
|
|
10420
|
+
overflow-y: auto;
|
|
10421
|
+
}
|
|
10422
|
+
|
|
10423
|
+
.seed-record-preview__tabBadge {
|
|
10424
|
+
margin-inline-start: 6px;
|
|
10425
|
+
}
|
|
10426
|
+
|
|
10288
10427
|
.seed-resizable-panel__root {
|
|
10289
10428
|
height: 100%;
|
|
10290
10429
|
display: flex;
|
|
10291
10430
|
position: relative;
|
|
10292
10431
|
}
|
|
10293
10432
|
|
|
10433
|
+
.seed-resizable-panel__root[data-floating="true"] {
|
|
10434
|
+
pointer-events: none;
|
|
10435
|
+
height: auto;
|
|
10436
|
+
display: block;
|
|
10437
|
+
position: absolute;
|
|
10438
|
+
inset: 0;
|
|
10439
|
+
}
|
|
10440
|
+
|
|
10294
10441
|
.seed-resizable-panel__spacer {
|
|
10295
10442
|
flex: none;
|
|
10296
10443
|
height: 100%;
|
|
@@ -10329,26 +10476,31 @@ tr:hover .seed-data-table__entityActions, .seed-data-table__entityActions:focus-
|
|
|
10329
10476
|
|
|
10330
10477
|
.seed-resizable-panel__panel[data-floating="true"] {
|
|
10331
10478
|
z-index: 20;
|
|
10479
|
+
pointer-events: auto;
|
|
10332
10480
|
opacity: 1;
|
|
10333
10481
|
border-inline: none;
|
|
10334
|
-
border-radius: 12px;
|
|
10335
10482
|
position: absolute;
|
|
10336
|
-
top:
|
|
10337
|
-
bottom:
|
|
10483
|
+
top: 0;
|
|
10484
|
+
bottom: 0;
|
|
10338
10485
|
transform: none;
|
|
10339
|
-
box-shadow: 0 0 0 1px #1c28400a, 0 4px 8px -4px #1c28401f, 0 4px 12px -2px #18294b29;
|
|
10340
10486
|
}
|
|
10341
10487
|
|
|
10342
10488
|
.seed-resizable-panel__panel[data-floating="true"][data-side="left"] {
|
|
10343
|
-
|
|
10489
|
+
border-top-right-radius: 12px;
|
|
10490
|
+
border-bottom-right-radius: 12px;
|
|
10491
|
+
left: 0;
|
|
10492
|
+
box-shadow: 1px 0 #1c28400a, 8px 0 16px -6px #1c28401f, 8px 0 24px -4px #18294b29;
|
|
10344
10493
|
}
|
|
10345
10494
|
|
|
10346
10495
|
.seed-resizable-panel__panel[data-floating="true"][data-side="right"] {
|
|
10347
|
-
|
|
10496
|
+
border-top-left-radius: 12px;
|
|
10497
|
+
border-bottom-left-radius: 12px;
|
|
10498
|
+
right: 0;
|
|
10499
|
+
box-shadow: -1px 0 #1c28400a, -8px 0 16px -6px #1c28401f, -8px 0 24px -4px #18294b29;
|
|
10348
10500
|
}
|
|
10349
10501
|
|
|
10350
10502
|
.seed-resizable-panel__panel[data-floating="true"][data-side="left"][data-state="open"] {
|
|
10351
|
-
--seed-enter-translate-x:
|
|
10503
|
+
--seed-enter-translate-x: -100%;
|
|
10352
10504
|
--seed-enter-translate-y: 0;
|
|
10353
10505
|
--seed-enter-opacity: 0;
|
|
10354
10506
|
--seed-enter-scale: 1;
|
|
@@ -10362,7 +10514,7 @@ tr:hover .seed-data-table__entityActions, .seed-data-table__entityActions:focus-
|
|
|
10362
10514
|
}
|
|
10363
10515
|
|
|
10364
10516
|
.seed-resizable-panel__panel[data-floating="true"][data-side="left"][data-state="closed"] {
|
|
10365
|
-
--seed-exit-translate-x:
|
|
10517
|
+
--seed-exit-translate-x: -100%;
|
|
10366
10518
|
--seed-exit-translate-y: 0;
|
|
10367
10519
|
--seed-exit-opacity: 0;
|
|
10368
10520
|
--seed-exit-scale: 1;
|
|
@@ -10376,7 +10528,7 @@ tr:hover .seed-data-table__entityActions, .seed-data-table__entityActions:focus-
|
|
|
10376
10528
|
}
|
|
10377
10529
|
|
|
10378
10530
|
.seed-resizable-panel__panel[data-floating="true"][data-side="right"][data-state="open"] {
|
|
10379
|
-
--seed-enter-translate-x:
|
|
10531
|
+
--seed-enter-translate-x: 100%;
|
|
10380
10532
|
--seed-enter-translate-y: 0;
|
|
10381
10533
|
--seed-enter-opacity: 0;
|
|
10382
10534
|
--seed-enter-scale: 1;
|
|
@@ -10390,7 +10542,7 @@ tr:hover .seed-data-table__entityActions, .seed-data-table__entityActions:focus-
|
|
|
10390
10542
|
}
|
|
10391
10543
|
|
|
10392
10544
|
.seed-resizable-panel__panel[data-floating="true"][data-side="right"][data-state="closed"] {
|
|
10393
|
-
--seed-exit-translate-x:
|
|
10545
|
+
--seed-exit-translate-x: 100%;
|
|
10394
10546
|
--seed-exit-translate-y: 0;
|
|
10395
10547
|
--seed-exit-opacity: 0;
|
|
10396
10548
|
--seed-exit-scale: 1;
|
|
@@ -10407,6 +10559,25 @@ tr:hover .seed-data-table__entityActions, .seed-data-table__entityActions:focus-
|
|
|
10407
10559
|
height: 100%;
|
|
10408
10560
|
}
|
|
10409
10561
|
|
|
10562
|
+
.seed-resizable-panel__backdrop {
|
|
10563
|
+
z-index: 19;
|
|
10564
|
+
pointer-events: auto;
|
|
10565
|
+
opacity: 0;
|
|
10566
|
+
background: #0f132052;
|
|
10567
|
+
transition: opacity .16s cubic-bezier(.4, 0, 1, 1);
|
|
10568
|
+
position: absolute;
|
|
10569
|
+
inset: 0;
|
|
10570
|
+
}
|
|
10571
|
+
|
|
10572
|
+
.seed-resizable-panel__backdrop[data-state="open"] {
|
|
10573
|
+
opacity: 1;
|
|
10574
|
+
transition-timing-function: cubic-bezier(.16, 1, .3, 1);
|
|
10575
|
+
}
|
|
10576
|
+
|
|
10577
|
+
.seed-resizable-panel__backdrop[data-state="closed"] {
|
|
10578
|
+
opacity: 0;
|
|
10579
|
+
}
|
|
10580
|
+
|
|
10410
10581
|
.seed-resizable-panel__handle {
|
|
10411
10582
|
z-index: 2;
|
|
10412
10583
|
cursor: col-resize;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@crispy-seed/data-table",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.10.0",
|
|
4
4
|
"description": "Self-contained, publishable build of seed-design's Attio-measured DataTable, ResizablePanel and RecordPreview — one install, one CSS import.",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"NOTICE"
|
|
38
38
|
],
|
|
39
39
|
"scripts": {
|
|
40
|
-
"build": "bunchee --dts-bundle --external @seed-design/css/recipes/avatar,@seed-design/css/recipes/avatar-stack,@seed-design/css/recipes/badge,@seed-design/css/recipes/checkbox,@seed-design/css/recipes/checkbox-group,@seed-design/css/recipes/checkmark,@seed-design/css/recipes/menu,@seed-design/css/recipes/menu-item,@seed-design/css/recipes/segmented-control,@seed-design/css/recipes/select,@seed-design/css/recipes/select-item,@seed-design/css/recipes/select-trigger,@seed-design/css/recipes/switch,@seed-design/css/recipes/switchmark,@seed-design/css/recipes/text-input && node scripts/copy-css.mjs",
|
|
40
|
+
"build": "bunchee --dts-bundle --external @seed-design/css/recipes/avatar,@seed-design/css/recipes/avatar-stack,@seed-design/css/recipes/badge,@seed-design/css/recipes/checkbox,@seed-design/css/recipes/checkbox-group,@seed-design/css/recipes/checkmark,@seed-design/css/recipes/menu,@seed-design/css/recipes/menu-item,@seed-design/css/recipes/segmented-control,@seed-design/css/recipes/select,@seed-design/css/recipes/select-item,@seed-design/css/recipes/select-trigger,@seed-design/css/recipes/switch,@seed-design/css/recipes/switchmark,@seed-design/css/recipes/tabs,@seed-design/css/recipes/text-input && node scripts/copy-css.mjs",
|
|
41
41
|
"clean": "rm -rf dist"
|
|
42
42
|
},
|
|
43
43
|
"peerDependencies": {
|
|
@@ -69,6 +69,7 @@
|
|
|
69
69
|
"@seed-design/react-segmented-control": "^2.0.2",
|
|
70
70
|
"@seed-design/react-select": "^1.0.1",
|
|
71
71
|
"@seed-design/react-switch": "^2.0.1",
|
|
72
|
+
"@seed-design/react-tabs": "^2.0.1",
|
|
72
73
|
"@seed-design/react-text-field": "^2.0.1",
|
|
73
74
|
"@types/react": "^19.2.2",
|
|
74
75
|
"@types/react-dom": "^19.2.1",
|