@neo4j-ndl/base 3.3.2 → 3.3.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/lib/cjs/tokens/js/storybook-design-token.js +1 -1
- package/lib/cjs/tokens/js/tokens-esm.js +1 -1
- package/lib/cjs/tokens/js/tokens.js +1 -1
- package/lib/esm/tokens/js/storybook-design-token.js +1 -1
- package/lib/esm/tokens/js/tokens-esm.js +1 -1
- package/lib/esm/tokens/js/tokens.js +1 -1
- package/lib/neo4j-ds-styles.css +78 -39
- package/lib/tokens/css/tokens.css +1 -1
- package/lib/tokens/js/tokens-raw.js +1 -1
- package/lib/tokens/js/tokens.js +1 -1
- package/lib/tokens/scss/tokens.scss +1 -1
- package/lib/types/tokens/js/storybook-design-token.d.ts +1 -1
- package/package.json +5 -5
package/lib/neo4j-ds-styles.css
CHANGED
|
@@ -1133,11 +1133,6 @@ h6,
|
|
|
1133
1133
|
width:100%;
|
|
1134
1134
|
flex-direction:column;
|
|
1135
1135
|
}
|
|
1136
|
-
.ndl-accordion .ndl-accordion-item {
|
|
1137
|
-
box-sizing:border-box;
|
|
1138
|
-
height:48px;
|
|
1139
|
-
width:auto;
|
|
1140
|
-
}
|
|
1141
1136
|
.ndl-accordion .ndl-accordion-item-expanded {
|
|
1142
1137
|
height:auto;
|
|
1143
1138
|
}
|
|
@@ -1145,11 +1140,8 @@ h6,
|
|
|
1145
1140
|
position:relative;
|
|
1146
1141
|
box-sizing:border-box;
|
|
1147
1142
|
display:flex;
|
|
1148
|
-
|
|
1143
|
+
flex-shrink:0;
|
|
1149
1144
|
align-items:center;
|
|
1150
|
-
padding-top:12px;
|
|
1151
|
-
padding-bottom:12px;
|
|
1152
|
-
padding-right:12px;
|
|
1153
1145
|
}
|
|
1154
1146
|
.ndl-accordion .ndl-accordion-item-header-button-disabled {
|
|
1155
1147
|
cursor:not-allowed;
|
|
@@ -1158,17 +1150,9 @@ h6,
|
|
|
1158
1150
|
.ndl-accordion .ndl-accordion-item-header-button:focus-visible {
|
|
1159
1151
|
outline-style:solid;
|
|
1160
1152
|
outline-width:2px;
|
|
1161
|
-
outline-offset:-2px;
|
|
1162
1153
|
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
1163
1154
|
}
|
|
1164
|
-
.ndl-accordion .ndl-accordion-item-header-button:hover {
|
|
1165
|
-
background-color:rgb(var(--theme-palette-neutral-hover));
|
|
1166
|
-
}
|
|
1167
|
-
.ndl-accordion .ndl-accordion-item-header-button:active {
|
|
1168
|
-
background-color:rgb(var(--theme-palette-neutral-pressed));
|
|
1169
|
-
}
|
|
1170
1155
|
.ndl-accordion .ndl-accordion-item-header-button-title {
|
|
1171
|
-
margin-left:12px;
|
|
1172
1156
|
display:flex;
|
|
1173
1157
|
width:100%;
|
|
1174
1158
|
}
|
|
@@ -1179,18 +1163,17 @@ h6,
|
|
|
1179
1163
|
pointer-events:none;
|
|
1180
1164
|
box-sizing:border-box;
|
|
1181
1165
|
display:flex;
|
|
1182
|
-
width:100%;
|
|
1183
1166
|
flex-direction:row;
|
|
1184
1167
|
align-items:center;
|
|
1168
|
+
gap:12px;
|
|
1185
1169
|
}
|
|
1186
1170
|
.ndl-accordion .ndl-accordion-item-header-icon-wrapper-left {
|
|
1187
1171
|
flex-direction:row-reverse;
|
|
1188
1172
|
}
|
|
1189
|
-
.ndl-accordion .ndl-accordion-item-header-icon
|
|
1190
|
-
margin-left:12px;
|
|
1173
|
+
.ndl-accordion .ndl-accordion-item-header-icon{
|
|
1191
1174
|
width:20px;
|
|
1192
1175
|
height:20px;
|
|
1193
|
-
}
|
|
1176
|
+
}
|
|
1194
1177
|
.ndl-accordion .ndl-accordion-item-content {
|
|
1195
1178
|
visibility:hidden;
|
|
1196
1179
|
height:0px;
|
|
@@ -1203,19 +1186,53 @@ h6,
|
|
|
1203
1186
|
outline-offset:1px;
|
|
1204
1187
|
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
1205
1188
|
}
|
|
1206
|
-
.ndl-accordion .ndl-accordion-item-content-right {
|
|
1207
|
-
padding-left:32px;
|
|
1208
|
-
}
|
|
1209
1189
|
.ndl-accordion .ndl-accordion-item-content-expanded {
|
|
1210
1190
|
visibility:visible;
|
|
1211
1191
|
height:auto;
|
|
1212
1192
|
}
|
|
1213
1193
|
.ndl-accordion .ndl-accordion-item-content-inner {
|
|
1214
1194
|
box-sizing:border-box;
|
|
1215
|
-
padding-left:
|
|
1216
|
-
padding-right:
|
|
1217
|
-
padding-bottom:
|
|
1218
|
-
|
|
1195
|
+
padding-left:8px;
|
|
1196
|
+
padding-right:8px;
|
|
1197
|
+
padding-bottom:8px;
|
|
1198
|
+
}
|
|
1199
|
+
.ndl-accordion .ndl-accordion-item-classic {
|
|
1200
|
+
box-sizing:border-box;
|
|
1201
|
+
width:auto;
|
|
1202
|
+
}
|
|
1203
|
+
.ndl-accordion .ndl-accordion-item-classic .ndl-accordion-item-header-icon-wrapper {
|
|
1204
|
+
width:100%;
|
|
1205
|
+
}
|
|
1206
|
+
.ndl-accordion .ndl-accordion-item-classic .ndl-accordion-item-header-button {
|
|
1207
|
+
width:100%;
|
|
1208
|
+
padding:8px;
|
|
1209
|
+
}
|
|
1210
|
+
.ndl-accordion .ndl-accordion-item-classic .ndl-accordion-item-header-button:focus-visible {
|
|
1211
|
+
outline-offset:-2px;
|
|
1212
|
+
}
|
|
1213
|
+
.ndl-accordion .ndl-accordion-item-classic .ndl-accordion-item-header-button:hover {
|
|
1214
|
+
background-color:rgb(var(--theme-palette-neutral-hover));
|
|
1215
|
+
}
|
|
1216
|
+
.ndl-accordion .ndl-accordion-item-classic .ndl-accordion-item-header-button:active {
|
|
1217
|
+
background-color:rgb(var(--theme-palette-neutral-pressed));
|
|
1218
|
+
}
|
|
1219
|
+
.ndl-accordion .ndl-accordion-item-classic .ndl-accordion-item-content-left {
|
|
1220
|
+
padding-left:32px;
|
|
1221
|
+
}
|
|
1222
|
+
.ndl-accordion .ndl-accordion-item-clean {
|
|
1223
|
+
box-sizing:border-box;
|
|
1224
|
+
width:auto;
|
|
1225
|
+
}
|
|
1226
|
+
.ndl-accordion .ndl-accordion-item-clean .ndl-accordion-item-header {
|
|
1227
|
+
display:flex;
|
|
1228
|
+
flex-direction:row;
|
|
1229
|
+
align-items:center;
|
|
1230
|
+
justify-content:space-between;
|
|
1231
|
+
gap:12px;
|
|
1232
|
+
padding:8px;
|
|
1233
|
+
}
|
|
1234
|
+
.ndl-accordion .ndl-accordion-item-clean .ndl-accordion-item-header-button:focus-visible {
|
|
1235
|
+
outline-offset:1px;
|
|
1219
1236
|
}
|
|
1220
1237
|
.ndl-btn{
|
|
1221
1238
|
transition:background-color var(--transitions-stripped-quick);
|
|
@@ -2619,10 +2636,12 @@ a.ndl-btn {
|
|
|
2619
2636
|
border-radius:8px;
|
|
2620
2637
|
background-color:rgb(var(--theme-palette-neutral-bg-default));
|
|
2621
2638
|
}
|
|
2622
|
-
.ndl-menu .ndl-menu-item:focus-visible:not(.ndl-disabled){
|
|
2623
|
-
|
|
2624
|
-
|
|
2625
|
-
|
|
2639
|
+
.ndl-menu .ndl-menu-item:focus-visible:not(.ndl-disabled) {
|
|
2640
|
+
outline-style:solid;
|
|
2641
|
+
outline-width:2px;
|
|
2642
|
+
outline-offset:-2px;
|
|
2643
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
2644
|
+
}
|
|
2626
2645
|
.ndl-menu .ndl-menu-item.ndl-disabled {
|
|
2627
2646
|
cursor:not-allowed;
|
|
2628
2647
|
}
|
|
@@ -2648,13 +2667,15 @@ a.ndl-btn {
|
|
|
2648
2667
|
letter-spacing:0.016rem;
|
|
2649
2668
|
line-height:1.25rem;
|
|
2650
2669
|
}
|
|
2651
|
-
.ndl-menu .ndl-menu-item-icon{
|
|
2652
|
-
|
|
2653
|
-
|
|
2654
|
-
|
|
2655
|
-
|
|
2656
|
-
|
|
2657
|
-
|
|
2670
|
+
.ndl-menu .ndl-menu-item-icon {
|
|
2671
|
+
display:flex;
|
|
2672
|
+
height:20px;
|
|
2673
|
+
width:16px;
|
|
2674
|
+
flex-shrink:0;
|
|
2675
|
+
align-items:center;
|
|
2676
|
+
justify-content:center;
|
|
2677
|
+
color:rgb(var(--theme-palette-neutral-text-weak));
|
|
2678
|
+
}
|
|
2658
2679
|
.ndl-menu .ndl-menu-header {
|
|
2659
2680
|
margin-bottom:16px;
|
|
2660
2681
|
padding-left:8px;
|
|
@@ -7719,6 +7740,10 @@ button.ndl-avatar:focus-visible {
|
|
|
7719
7740
|
width:24px;
|
|
7720
7741
|
height:24px;
|
|
7721
7742
|
}
|
|
7743
|
+
.n-size-token-8 {
|
|
7744
|
+
width:32px;
|
|
7745
|
+
height:32px;
|
|
7746
|
+
}
|
|
7722
7747
|
.n-size-token-9 {
|
|
7723
7748
|
width:48px;
|
|
7724
7749
|
height:48px;
|
|
@@ -7887,6 +7912,9 @@ button.ndl-avatar:focus-visible {
|
|
|
7887
7912
|
.n-gap-token-6 {
|
|
7888
7913
|
gap:16px;
|
|
7889
7914
|
}
|
|
7915
|
+
.n-gap-token-7 {
|
|
7916
|
+
gap:24px;
|
|
7917
|
+
}
|
|
7890
7918
|
.n-gap-token-8 {
|
|
7891
7919
|
gap:32px;
|
|
7892
7920
|
}
|
|
@@ -42613,6 +42641,9 @@ button.ndl-avatar:focus-visible {
|
|
|
42613
42641
|
.n-stroke-palette-primary-bg-strong {
|
|
42614
42642
|
stroke:rgb(var(--theme-palette-primary-bg-strong));
|
|
42615
42643
|
}
|
|
42644
|
+
.n-p-10 {
|
|
42645
|
+
padding:40px;
|
|
42646
|
+
}
|
|
42616
42647
|
.n-p-14 {
|
|
42617
42648
|
padding:56px;
|
|
42618
42649
|
}
|
|
@@ -42641,6 +42672,10 @@ button.ndl-avatar:focus-visible {
|
|
|
42641
42672
|
padding-left:40px;
|
|
42642
42673
|
padding-right:40px;
|
|
42643
42674
|
}
|
|
42675
|
+
.n-px-5 {
|
|
42676
|
+
padding-left:20px;
|
|
42677
|
+
padding-right:20px;
|
|
42678
|
+
}
|
|
42644
42679
|
.n-px-token-3 {
|
|
42645
42680
|
padding-left:4px;
|
|
42646
42681
|
padding-right:4px;
|
|
@@ -42665,6 +42700,10 @@ button.ndl-avatar:focus-visible {
|
|
|
42665
42700
|
padding-left:48px;
|
|
42666
42701
|
padding-right:48px;
|
|
42667
42702
|
}
|
|
42703
|
+
.n-py-6 {
|
|
42704
|
+
padding-top:24px;
|
|
42705
|
+
padding-bottom:24px;
|
|
42706
|
+
}
|
|
42668
42707
|
.n-py-token-2 {
|
|
42669
42708
|
padding-top:2px;
|
|
42670
42709
|
padding-bottom:2px;
|
package/lib/tokens/js/tokens.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neo4j-ndl/base",
|
|
3
|
-
"version": "3.3.
|
|
3
|
+
"version": "3.3.4",
|
|
4
4
|
"description": "Neo4j base package for the design system",
|
|
5
5
|
"author": "Neo4j Inc.",
|
|
6
6
|
"homepage": "https://www.neo4j.design",
|
|
@@ -10,13 +10,13 @@
|
|
|
10
10
|
"types": "./lib/types/index.d.ts",
|
|
11
11
|
"exports": {
|
|
12
12
|
".": {
|
|
13
|
+
"types": "./lib/types/index.d.ts",
|
|
13
14
|
"require": "./lib/cjs/index.js",
|
|
14
|
-
"import": "./lib/esm/index.js"
|
|
15
|
-
"types": "./lib/types/index.d.ts"
|
|
15
|
+
"import": "./lib/esm/index.js"
|
|
16
16
|
},
|
|
17
17
|
"./lib/neo4j-ds-styles.css": {
|
|
18
|
-
"
|
|
19
|
-
"
|
|
18
|
+
"require": "./lib/neo4j-ds-styles.css",
|
|
19
|
+
"import": "./lib/neo4j-ds-styles.css"
|
|
20
20
|
}
|
|
21
21
|
},
|
|
22
22
|
"directories": {
|