@neo4j-ndl/base 3.0.0-alpha-4904fb7 → 3.0.0-alpha-73cdbc3

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.
@@ -22,7 +22,7 @@
22
22
  "use strict";
23
23
  /**
24
24
  * Do not edit directly
25
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
25
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
26
26
  */
27
27
  Object.defineProperty(exports, "__esModule", { value: true });
28
28
  exports.tokens = void 0;
@@ -22,7 +22,7 @@
22
22
  "use strict";
23
23
  /**
24
24
  * Do not edit directly
25
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
25
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
26
26
  */
27
27
  Object.defineProperty(exports, "__esModule", { value: true });
28
28
  exports.tokens = void 0;
@@ -22,7 +22,7 @@
22
22
  "use strict";
23
23
  /**
24
24
  * Do not edit directly
25
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
25
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
26
26
  */
27
27
  module.exports = {
28
28
  "transitions": {
@@ -21,7 +21,7 @@
21
21
 
22
22
  /**
23
23
  * Do not edit directly
24
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
24
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
25
25
  */
26
26
  export const tokens = {
27
27
  "transitions": [
@@ -21,7 +21,7 @@
21
21
 
22
22
  /**
23
23
  * Do not edit directly
24
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
24
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
25
25
  */
26
26
  export const tokens = {
27
27
  "transitions": {
@@ -22,7 +22,7 @@
22
22
  "use strict";
23
23
  /**
24
24
  * Do not edit directly
25
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
25
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
26
26
  */
27
27
  module.exports = {
28
28
  "transitions": {
@@ -1232,8 +1232,8 @@ h6,
1232
1232
  }
1233
1233
  .ndl-btn.ndl-medium {
1234
1234
  height:36px;
1235
- padding-left:24px;
1236
- padding-right:24px;
1235
+ padding-left:16px;
1236
+ padding-right:16px;
1237
1237
  padding-top:8px;
1238
1238
  padding-bottom:8px;
1239
1239
  font-family:var(--font-font-family-body-label), sans-serif;
@@ -2936,11 +2936,14 @@ a.ndl-btn {
2936
2936
  .ndl-dialog {
2937
2937
  border-radius:16px;
2938
2938
  background-color:rgb(var(--theme-palette-neutral-bg-weak));
2939
- padding:48px;
2939
+ padding:32px;
2940
2940
  --tw-shadow:var(--theme-shadow-overlay);
2941
2941
  --tw-shadow-colored:var(--theme-shadow-overlay);
2942
2942
  box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
2943
2943
  }
2944
+ .ndl-dialog .ndl-dialog-type-icon{
2945
+ width:88px;
2946
+ }
2944
2947
  .ndl-dialog .ndl-dialog-type-icon.ndl-info {
2945
2948
  color:rgb(var(--theme-palette-primary-icon));
2946
2949
  }
@@ -2953,13 +2956,18 @@ a.ndl-btn {
2953
2956
  .ndl-dialog .ndl-dialog-type-icon.ndl-danger {
2954
2957
  color:rgb(var(--theme-palette-danger-icon));
2955
2958
  }
2959
+ .ndl-dialog.ndl-with-icon .ndl-dialog-close {
2960
+ top:48px;
2961
+ }
2962
+ .ndl-dialog.ndl-with-icon .ndl-dialog-header {
2963
+ margin-bottom:24px;
2964
+ }
2956
2965
  .ndl-dialog .ndl-dialog-close {
2957
2966
  position:absolute;
2958
- top:48px;
2959
2967
  right:48px;
2960
2968
  }
2961
2969
  .ndl-dialog-header {
2962
- margin-bottom:24px;
2970
+ margin-bottom:4px;
2963
2971
  }
2964
2972
  .ndl-dialog.ndl-with-close-button .ndl-dialog-header {
2965
2973
  margin-right:48px;
@@ -3148,18 +3156,20 @@ a.ndl-btn {
3148
3156
  padding:4px;
3149
3157
  color:rgb(var(--theme-palette-neutral-text-weak));
3150
3158
  }
3159
+ .ndl-segmented-control.ndl-floating {
3160
+ --tw-shadow:var(--theme-shadow-overlay);
3161
+ --tw-shadow-colored:var(--theme-shadow-overlay);
3162
+ box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3163
+ }
3151
3164
  .ndl-segmented-control > button {
3152
3165
  cursor:pointer;
3153
3166
  border-radius:4px;
3154
3167
  }
3155
3168
  .ndl-segmented-control > button:focus-visible {
3156
- outline:2px solid transparent;
3157
- outline-offset:2px;
3158
- --tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
3159
- --tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
3160
- box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
3161
- --tw-ring-inset:inset;
3162
- --tw-ring-color:rgb(var(--theme-palette-primary-focus));
3169
+ outline-style:solid;
3170
+ outline-width:2px;
3171
+ outline-offset:-2px;
3172
+ outline-color:rgb(var(--theme-palette-primary-focus));
3163
3173
  }
3164
3174
  .ndl-segmented-control > button:hover {
3165
3175
  background-color:rgb(var(--theme-palette-neutral-hover));
@@ -3168,14 +3178,19 @@ a.ndl-btn {
3168
3178
  background-color:rgb(var(--theme-palette-neutral-pressed));
3169
3179
  }
3170
3180
  .ndl-segmented-control .ndl-current {
3171
- background-color:rgb(var(--theme-palette-primary-bg-strong));
3172
- color:rgb(var(--theme-palette-neutral-text-inverse));
3173
- --tw-shadow:var(--theme-shadow-overlay);
3174
- --tw-shadow-colored:var(--theme-shadow-overlay);
3175
- box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3181
+ border-width:1px;
3182
+ border-style:solid;
3183
+ border-color:rgb(var(--theme-palette-primary-border-weak));
3184
+ background-color:rgb(var(--theme-palette-primary-bg-weak));
3185
+ color:rgb(var(--theme-palette-primary-text));
3176
3186
  }
3177
3187
  .ndl-segmented-control .ndl-current:hover {
3178
- background-color:rgb(var(--theme-palette-primary-icon));
3188
+ border-style:none;
3189
+ background-color:rgb(var(--theme-palette-neutral-hover));
3190
+ color:rgb(var(--theme-neutral-text-weak));
3191
+ }
3192
+ .ndl-segmented-control .ndl-current:active {
3193
+ background-color:rgb(var(--theme-palette-neutral-pressed));
3179
3194
  }
3180
3195
  .ndl-segmented-control.ndl-large {
3181
3196
  height:48px;
@@ -3194,9 +3209,18 @@ a.ndl-btn {
3194
3209
  .ndl-segmented-control.ndl-large .ndl-segment-icon {
3195
3210
  padding:10px;
3196
3211
  }
3212
+ .ndl-segmented-control.ndl-large .ndl-segment-icon.ndl-current:not(:hover) {
3213
+ padding:9px;
3214
+ }
3197
3215
  .ndl-segmented-control.ndl-large > button {
3198
3216
  height:40px;
3199
3217
  }
3218
+ .ndl-segmented-control.ndl-large .ndl-current.ndl-segment-item:not(:hover) {
3219
+ padding-left:15px;
3220
+ padding-right:15px;
3221
+ padding-top:7px;
3222
+ padding-bottom:7px;
3223
+ }
3200
3224
  .ndl-segmented-control.ndl-small {
3201
3225
  height:36px;
3202
3226
  font-family:var(--font-font-family-subheading-small), sans-serif;
@@ -3214,9 +3238,18 @@ a.ndl-btn {
3214
3238
  .ndl-segmented-control.ndl-small .ndl-segment-icon {
3215
3239
  padding:6px;
3216
3240
  }
3241
+ .ndl-segmented-control.ndl-small .ndl-segment-icon.ndl-current:not(:hover) {
3242
+ padding:5px;
3243
+ }
3217
3244
  .ndl-segmented-control.ndl-small > button {
3218
3245
  height:28px;
3219
3246
  }
3247
+ .ndl-segmented-control.ndl-small .ndl-current.ndl-segment-item:not(:hover) {
3248
+ padding-left:11px;
3249
+ padding-right:11px;
3250
+ padding-top:3px;
3251
+ padding-bottom:3px;
3252
+ }
3220
3253
  @keyframes ndl-spinner{
3221
3254
  0%{
3222
3255
  transform:translate3d(0%, 0%, 0) rotate(0deg);
@@ -4765,8 +4798,8 @@ a.ndl-btn {
4765
4798
  }
4766
4799
  .ndl-cypher-editor .cm-editor .cm-button.ndl-medium, .ndl-codemirror-editor .cm-editor .cm-button.ndl-medium {
4767
4800
  height:36px;
4768
- padding-left:24px;
4769
- padding-right:24px;
4801
+ padding-left:16px;
4802
+ padding-right:16px;
4770
4803
  padding-top:8px;
4771
4804
  padding-bottom:8px;
4772
4805
  font-family:var(--font-font-family-body-label), sans-serif;
@@ -5008,17 +5041,17 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
5008
5041
  border-radius:4px;
5009
5042
  outline-offset:0px;
5010
5043
  }
5011
- .ndl-textarea .ndl-textarea-wrapper {
5044
+ .ndl-text-area .ndl-text-area-wrapper {
5012
5045
  position:relative;
5013
5046
  width:100%;
5014
5047
  }
5015
- .ndl-textarea textarea::-moz-placeholder {
5048
+ .ndl-text-area textarea::-moz-placeholder {
5016
5049
  color:rgb(var(--theme-palette-neutral-text-weaker));
5017
5050
  }
5018
- .ndl-textarea textarea::placeholder {
5051
+ .ndl-text-area textarea::placeholder {
5019
5052
  color:rgb(var(--theme-palette-neutral-text-weaker));
5020
5053
  }
5021
- .ndl-textarea textarea {
5054
+ .ndl-text-area textarea {
5022
5055
  width:100%;
5023
5056
  border-radius:4px;
5024
5057
  border-width:1px;
@@ -5034,23 +5067,23 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
5034
5067
 
5035
5068
  min-height:80px;
5036
5069
  }
5037
- .ndl-textarea textarea:active,
5038
- .ndl-textarea textarea:focus {
5070
+ .ndl-text-area textarea:active,
5071
+ .ndl-text-area textarea:focus {
5039
5072
  outline-style:solid;
5040
5073
  outline-width:2px;
5041
5074
  outline-offset:-1px;
5042
5075
  outline-color:rgb(var(--theme-palette-primary-focus));
5043
5076
  }
5044
- .ndl-textarea textarea:disabled {
5077
+ .ndl-text-area textarea:disabled {
5045
5078
  cursor:not-allowed;
5046
5079
  color:rgb(var(--theme-palette-neutral-text-weakest));
5047
5080
  background-color:inherit;
5048
5081
  }
5049
- .ndl-textarea textarea:disabled:active {
5082
+ .ndl-text-area textarea:disabled:active {
5050
5083
  outline:2px solid transparent;
5051
5084
  outline-offset:2px;
5052
5085
  }
5053
- .ndl-textarea .ndl-textarea-label {
5086
+ .ndl-text-area .ndl-text-area-label {
5054
5087
  display:inline-flex;
5055
5088
  align-items:flex-start;
5056
5089
  -moz-column-gap:12px;
@@ -5061,57 +5094,57 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
5061
5094
  letter-spacing:0.016rem;
5062
5095
  line-height:1.25rem;
5063
5096
  }
5064
- .ndl-textarea .ndl-textarea-label.ndl-fluid {
5097
+ .ndl-text-area .ndl-text-area-label.ndl-fluid {
5065
5098
  display:flex;
5066
5099
  width:100%;
5067
5100
  }
5068
- .ndl-textarea .ndl-textarea-label.ndl-label-before {
5101
+ .ndl-text-area .ndl-text-area-label.ndl-label-before {
5069
5102
  flex-direction:row-reverse;
5070
5103
  }
5071
- .ndl-textarea .ndl-textarea-wrapper{
5104
+ .ndl-text-area .ndl-text-area-wrapper{
5072
5105
  display:flex;
5073
5106
  width:100%;
5074
5107
  }
5075
- .ndl-textarea .ndl-textarea-wrapper .ndl-textarea-optional {
5108
+ .ndl-text-area .ndl-text-area-wrapper .ndl-text-area-optional {
5076
5109
  color:rgb(var(--theme-palette-neutral-text-weaker));
5077
5110
  font-style:italic;
5078
5111
  margin-left:auto;
5079
5112
  }
5080
- .ndl-textarea .ndl-textarea-wrapper .ndl-information-icon-small {
5113
+ .ndl-text-area .ndl-text-area-wrapper .ndl-information-icon-small {
5081
5114
  margin-top:2px;
5082
5115
  margin-left:3px;
5083
5116
  width:16px;
5084
5117
  height:16px;
5085
5118
  color:rgb(var(--theme-palette-neutral-text-weak));
5086
5119
  }
5087
- .ndl-textarea .ndl-textarea-wrapper .ndl-information-icon-large {
5120
+ .ndl-text-area .ndl-text-area-wrapper .ndl-information-icon-large {
5088
5121
  margin-top:2px;
5089
5122
  margin-left:3px;
5090
5123
  width:20px;
5091
5124
  height:20px;
5092
5125
  color:rgb(var(--theme-palette-neutral-text-weak));
5093
5126
  }
5094
- .ndl-textarea.ndl-type-text .ndl-textarea-label {
5127
+ .ndl-text-area.ndl-type-text .ndl-text-area-label {
5095
5128
  flex-direction:column-reverse;
5096
5129
  align-items:flex-start;
5097
5130
  row-gap:5px;
5098
5131
  }
5099
- .ndl-textarea.ndl-type-text .ndl-textarea-label .ndl-textarea-label-text {
5132
+ .ndl-text-area.ndl-type-text .ndl-text-area-label .ndl-text-area-label-text {
5100
5133
  color:rgb(var(--theme-palette-neutral-text-weak));
5101
5134
  }
5102
- .ndl-textarea.ndl-type-text .ndl-textarea-no-label {
5135
+ .ndl-text-area.ndl-type-text .ndl-text-area-no-label {
5103
5136
  row-gap:0px;
5104
5137
  }
5105
- .ndl-textarea.ndl-type-radio {
5138
+ .ndl-text-area.ndl-type-radio {
5106
5139
  display:flex;
5107
5140
  align-items:center;
5108
5141
  color:rgb(var(--theme-palette-neutral-text-default));
5109
5142
  }
5110
- .ndl-textarea.ndl-disabled .ndl-textarea-label {
5143
+ .ndl-text-area.ndl-disabled .ndl-text-area-label {
5111
5144
  cursor:not-allowed;
5112
5145
  color:rgb(var(--theme-palette-neutral-text-weakest));
5113
5146
  }
5114
- .ndl-textarea .ndl-textarea-msg {
5147
+ .ndl-text-area .ndl-text-area-msg {
5115
5148
  margin-top:4px;
5116
5149
  display:flex;
5117
5150
  flex-direction:row;
@@ -5121,23 +5154,23 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
5121
5154
  line-height:1rem;
5122
5155
  color:rgb(var(--theme-palette-neutral-text-weaker));
5123
5156
  }
5124
- .ndl-textarea .ndl-textarea-msg .ndl-error-text{
5157
+ .ndl-text-area .ndl-text-area-msg .ndl-error-text{
5125
5158
  display:inline-block;
5126
5159
  }
5127
- .ndl-textarea.ndl-has-error textarea {
5160
+ .ndl-text-area.ndl-has-error textarea {
5128
5161
  outline-color:rgb(var(--theme-palette-danger-border-strong));
5129
5162
  border-width:2px;
5130
5163
  border-color:rgb(var(--theme-palette-danger-border-strong));
5131
5164
  }
5132
- .ndl-textarea.ndl-has-error .ndl-textarea-msg {
5165
+ .ndl-text-area.ndl-has-error .ndl-text-area-msg {
5133
5166
  color:rgb(var(--theme-palette-danger-text));
5134
5167
  }
5135
- .ndl-textarea.ndl-has-icon .ndl-error-icon {
5168
+ .ndl-text-area.ndl-has-icon .ndl-error-icon {
5136
5169
  width:20px;
5137
5170
  height:20px;
5138
5171
  color:rgb(var(--theme-palette-danger-text));
5139
5172
  }
5140
- .ndl-textarea.ndl-large textarea {
5173
+ .ndl-text-area.ndl-large textarea {
5141
5174
  padding-top:12px;
5142
5175
  padding-bottom:12px;
5143
5176
  font-family:var(--font-font-family-body-large), sans-serif;
@@ -5147,27 +5180,27 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
5147
5180
  line-height:1.5rem;
5148
5181
  min-height:100px;
5149
5182
  }
5150
- .ndl-textarea.ndl-large .ndl-textarea-label{
5183
+ .ndl-text-area.ndl-large .ndl-text-area-label{
5151
5184
  font-family:var(--font-font-family-body-large), sans-serif;
5152
5185
  font-size:var(--font-size-body-large);
5153
5186
  font-weight:var(--font-weight-normal);
5154
5187
  letter-spacing:0.016rem;
5155
5188
  line-height:1.5rem;
5156
5189
  }
5157
- .ndl-textarea.ndl-large .ndl-textarea-msg{
5190
+ .ndl-text-area.ndl-large .ndl-text-area-msg{
5158
5191
  font-family:var(--font-font-family-body-medium), sans-serif;
5159
5192
  font-size:var(--font-size-body-medium);
5160
5193
  font-weight:var(--font-weight-normal);
5161
5194
  letter-spacing:0.016rem;
5162
5195
  line-height:1.25rem;
5163
5196
  }
5164
- .ndl-textarea.ndl-large.ndl-has-icon .ndl-icon {
5197
+ .ndl-text-area.ndl-large.ndl-has-icon .ndl-icon {
5165
5198
  position:absolute;
5166
5199
  width:24px;
5167
5200
  height:24px;
5168
5201
  color:rgb(var(--theme-palette-neutral-text-weak));
5169
5202
  }
5170
- .ndl-textarea.ndl-small textarea, .ndl-textarea.ndl-medium textarea {
5203
+ .ndl-text-area.ndl-small textarea, .ndl-text-area.ndl-medium textarea {
5171
5204
  padding-top:8px;
5172
5205
  padding-bottom:8px;
5173
5206
  font-family:var(--font-font-family-body-medium), sans-serif;
@@ -5176,14 +5209,14 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
5176
5209
  letter-spacing:0.016rem;
5177
5210
  line-height:1.25rem;
5178
5211
  }
5179
- .ndl-textarea.ndl-small .ndl-textarea-label, .ndl-textarea.ndl-medium .ndl-textarea-label{
5212
+ .ndl-text-area.ndl-small .ndl-text-area-label, .ndl-text-area.ndl-medium .ndl-text-area-label{
5180
5213
  font-family:var(--font-font-family-body-medium), sans-serif;
5181
5214
  font-size:var(--font-size-body-medium);
5182
5215
  font-weight:var(--font-weight-normal);
5183
5216
  letter-spacing:0.016rem;
5184
5217
  line-height:1.25rem;
5185
5218
  }
5186
- .ndl-textarea.ndl-small.ndl-has-icon .ndl-icon, .ndl-textarea.ndl-medium.ndl-has-icon .ndl-icon {
5219
+ .ndl-text-area.ndl-small.ndl-has-icon .ndl-icon, .ndl-text-area.ndl-medium.ndl-has-icon .ndl-icon {
5187
5220
  width:20px;
5188
5221
  height:20px;
5189
5222
  position:absolute;
@@ -21,7 +21,7 @@
21
21
 
22
22
  /**
23
23
  * Do not edit directly
24
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
24
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
25
25
  */
26
26
 
27
27
  :root {
@@ -21,7 +21,7 @@
21
21
 
22
22
  /**
23
23
  * Do not edit directly
24
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
24
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
25
25
  */
26
26
 
27
27
  module.exports = {
@@ -21,7 +21,7 @@
21
21
 
22
22
  /**
23
23
  * Do not edit directly
24
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
24
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
25
25
  */
26
26
 
27
27
  export const tokens = {
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Mon, 14 Oct 2024 15:52:01 GMT
3
+ // Generated on Thu, 17 Oct 2024 15:06:50 GMT
4
4
 
5
5
  $transitions-values-properties-default: all;
6
6
  $transitions-values-duration-quick: 100ms;
@@ -21,7 +21,7 @@
21
21
 
22
22
  /**
23
23
  * Do not edit directly
24
- * Generated on Mon, 14 Oct 2024 15:52:01 GMT
24
+ * Generated on Thu, 17 Oct 2024 15:06:50 GMT
25
25
  */
26
26
  export const tokens: {
27
27
  transitions: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@neo4j-ndl/base",
3
- "version": "3.0.0-alpha-4904fb7",
3
+ "version": "3.0.0-alpha-73cdbc3",
4
4
  "description": "Neo4j base package for the design system",
5
5
  "author": "Neo4j Inc.",
6
6
  "homepage": "https://www.neo4j.design",