@neo4j-ndl/base 1.1.0 → 1.1.2

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/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # Change Log
2
2
 
3
+ ## 1.1.2
4
+
5
+ ### Patch Changes
6
+
7
+ - 1ec1b64: Add disabled state styling to drag and drop
8
+
9
+ ## 1.1.1
10
+
11
+ ### Patch Changes
12
+
13
+ - ec516de: fix icon button icon size with different parent font-size (em), and storybook icon search dropdown filter
14
+
3
15
  ## 1.1.0
4
16
 
5
17
  ### Minor Changes
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  /**
3
3
  * Do not edit directly
4
- * Generated on Mon, 03 Apr 2023 15:46:06 GMT
4
+ * Generated on Tue, 18 Apr 2023 07:52:52 GMT
5
5
  */
6
6
  exports.__esModule = true;
7
7
  exports.tokens = void 0;
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  /**
3
3
  * Do not edit directly
4
- * Generated on Mon, 03 Apr 2023 15:46:06 GMT
4
+ * Generated on Tue, 18 Apr 2023 07:52:52 GMT
5
5
  */
6
6
  module.exports = {
7
7
  "transitions": {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 03 Apr 2023 15:46:06 GMT
3
+ * Generated on Tue, 18 Apr 2023 07:52:52 GMT
4
4
  */
5
5
  export const tokens = {
6
6
  "transitions": {
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  /**
3
3
  * Do not edit directly
4
- * Generated on Mon, 03 Apr 2023 15:46:06 GMT
4
+ * Generated on Tue, 18 Apr 2023 07:52:52 GMT
5
5
  */
6
6
  module.exports = {
7
7
  "transitions": {
@@ -459,7 +459,7 @@ video {
459
459
  */
460
460
  /**
461
461
  * Do not edit directly
462
- * Generated on Mon, 03 Apr 2023 15:46:06 GMT
462
+ * Generated on Tue, 18 Apr 2023 07:52:52 GMT
463
463
  */
464
464
  :root {
465
465
  --transitions-values-properties-default: all;
@@ -987,6 +987,7 @@ a.ndl-btn{
987
987
  .ndl-icon-btn.ndl-small {
988
988
  width: 24px;
989
989
  height: 24px;
990
+ font-size: 16px;
990
991
  }
991
992
  .ndl-icon-btn.ndl-small .ndl-icon {
992
993
  width: 16px;
@@ -995,6 +996,7 @@ a.ndl-btn{
995
996
  .ndl-icon-btn.ndl-medium {
996
997
  width: 28px;
997
998
  height: 28px;
999
+ font-size: 20px;
998
1000
  }
999
1001
  .ndl-icon-btn.ndl-medium .ndl-icon {
1000
1002
  width: 20px;
@@ -1003,6 +1005,7 @@ a.ndl-btn{
1003
1005
  .ndl-icon-btn.ndl-large {
1004
1006
  width: 40px;
1005
1007
  height: 40px;
1008
+ font-size: 24px;
1006
1009
  }
1007
1010
  .ndl-icon-btn.ndl-large .ndl-icon {
1008
1011
  width: 24px;
@@ -3434,6 +3437,10 @@ a.ndl-btn{
3434
3437
  margin-left: auto;
3435
3438
  margin-right: auto;
3436
3439
  }
3440
+ .ndl-drag-and-drop.ndl-drag-disabled{
3441
+ --tw-text-opacity: 1;
3442
+ color: rgb(178 183 189 / var(--tw-text-opacity));
3443
+ }
3437
3444
  .ndl-drag-and-drop.ndl-drag-active{
3438
3445
  --tw-bg-opacity: 1;
3439
3446
  background-color: rgb(230 248 255 / var(--tw-bg-opacity));
@@ -3454,14 +3461,16 @@ a.ndl-btn{
3454
3461
  .ndl-drag-and-drop .ndl-drag-and-drop-header .ndl-dnd-subtitle{
3455
3462
  font-weight: 400;
3456
3463
  }
3457
- .ndl-drag-and-drop .ndl-drag-and-drop-header .ndl-dnd-browse-link{
3458
- --tw-text-opacity: 1;
3459
- color: rgb(0 111 214 / var(--tw-text-opacity));
3464
+ .ndl-drag-and-drop .ndl-drag-and-drop-header .ndl-dnd-browse-link {
3460
3465
  font-size: var(--font-size-subheading-small);
3461
3466
  font-weight: var(--font-weight-semibold);
3462
3467
  letter-spacing: 0.016rem;
3463
3468
  line-height: 1.25rem;
3464
3469
  }
3470
+ .ndl-drag-and-drop .ndl-drag-and-drop-header .ndl-dnd-browse-link:not(:disabled){
3471
+ --tw-text-opacity: 1;
3472
+ color: rgb(0 111 214 / var(--tw-text-opacity));
3473
+ }
3465
3474
  .ndl-drag-and-drop .ndl-drag-and-drop-header .ndl-upload-img-wrapper{
3466
3475
  position: relative;
3467
3476
  display: inline-block;
@@ -3486,14 +3495,16 @@ a.ndl-btn{
3486
3495
  .ndl-drag-and-drop .ndl-drag-and-drop-footer{
3487
3496
  text-align: center;
3488
3497
  }
3489
- .ndl-drag-and-drop .ndl-drag-and-drop-footer .ndl-file-support-text{
3490
- --tw-text-opacity: 1;
3491
- color: rgb(113 119 128 / var(--tw-text-opacity));
3498
+ .ndl-drag-and-drop .ndl-drag-and-drop-footer .ndl-file-support-text {
3492
3499
  font-size: var(--font-size-body-medium);
3493
3500
  font-weight: var(--font-weight-normal);
3494
3501
  letter-spacing: 0.016rem;
3495
3502
  line-height: 1.25rem;
3496
3503
  }
3504
+ .ndl-drag-and-drop:not(.ndl-drag-disabled) .ndl-file-support-text{
3505
+ --tw-text-opacity: 1;
3506
+ color: rgb(113 119 128 / var(--tw-text-opacity));
3507
+ }
3497
3508
  .ndl-drag-and-drop.ndl-drag-active.ndl-file-invalid{
3498
3509
  --tw-bg-opacity: 1;
3499
3510
  background-color: rgb(255 230 233 / var(--tw-bg-opacity));
@@ -3630,8 +3641,14 @@ a.ndl-btn{
3630
3641
  letter-spacing: 0;
3631
3642
  line-height: 1.25rem;
3632
3643
  }
3644
+ .ndl-node-label .ndl-node-label-content{
3645
+ width: 100%;
3646
+ overflow: hidden;
3647
+ text-overflow: ellipsis;
3648
+ white-space: nowrap;
3649
+ }
3633
3650
  /* Adds an after element that's bigger than the original element and give it a border to get the blue active and focus border.
3634
- This border should have som space between itself and the original element. */
3651
+ This border should have some space between itself and the original element. */
3635
3652
  .ndl-node-label:after{
3636
3653
  position: absolute;
3637
3654
  top: -3px;
@@ -3662,7 +3679,6 @@ a.ndl-btn{
3662
3679
  position: relative;
3663
3680
  display: inline-block;
3664
3681
  cursor: pointer;
3665
- word-break: break-all;
3666
3682
  border-radius: 4px;
3667
3683
  --tw-bg-opacity: 1;
3668
3684
  background-color: rgb(83 91 102 / var(--tw-bg-opacity));
@@ -3682,6 +3698,12 @@ a.ndl-btn{
3682
3698
  --tw-text-opacity: 1;
3683
3699
  color: rgb(178 183 189 / var(--tw-text-opacity));
3684
3700
  }
3701
+ .ndl-property-key-label .ndl-property-key-label-content{
3702
+ width: 100%;
3703
+ overflow: hidden;
3704
+ text-overflow: ellipsis;
3705
+ white-space: nowrap;
3706
+ }
3685
3707
  .ndl-property-key-label:after{
3686
3708
  position: absolute;
3687
3709
  top: -3px;
@@ -3710,14 +3732,14 @@ a.ndl-btn{
3710
3732
  }
3711
3733
  .ndl-relationship-label{
3712
3734
  position: relative;
3713
- display: inline-block;
3735
+ display: flex;
3714
3736
  cursor: pointer;
3715
3737
  }
3716
- .ndl-relationship-label .ndl-relationship-label-content{
3738
+ .ndl-relationship-label .ndl-relationship-label-container{
3717
3739
  position: relative;
3718
3740
  z-index: 10;
3719
3741
  display: inline-block;
3720
- word-break: break-all;
3742
+ width: 100%;
3721
3743
  padding-top: 2px;
3722
3744
  padding-bottom: 2px;
3723
3745
  font-size: var(--font-size-label);
@@ -3725,7 +3747,13 @@ a.ndl-btn{
3725
3747
  letter-spacing: 0;
3726
3748
  line-height: 1.25rem;
3727
3749
  }
3728
- .ndl-relationship-label .ndl-relationship-label-content:after{
3750
+ .ndl-relationship-label .ndl-relationship-label-container .ndl-relationship-label-content{
3751
+ width: 100%;
3752
+ overflow: hidden;
3753
+ text-overflow: ellipsis;
3754
+ white-space: nowrap;
3755
+ }
3756
+ .ndl-relationship-label .ndl-relationship-label-container:after{
3729
3757
  position: absolute;
3730
3758
  left: 0px;
3731
3759
  right: 0px;
@@ -3735,7 +3763,7 @@ a.ndl-btn{
3735
3763
  --tw-content: '';
3736
3764
  content: var(--tw-content);
3737
3765
  }
3738
- .ndl-relationship-label .ndl-relationship-label-content:before{
3766
+ .ndl-relationship-label .ndl-relationship-label-container:before{
3739
3767
  position: absolute;
3740
3768
  left: 0px;
3741
3769
  right: 0px;
@@ -3763,11 +3791,11 @@ a.ndl-btn{
3763
3791
  .ndl-relationship-label:not(.ndl-disabled).ndl-selected .ndl-hexagon-end-active, .ndl-relationship-label:not(.ndl-disabled):focus-visible .ndl-hexagon-end-active, .ndl-relationship-label:not(.ndl-disabled):active .ndl-hexagon-end-active{
3764
3792
  fill: #018bff;
3765
3793
  }
3766
- .ndl-relationship-label:not(.ndl-disabled).ndl-selected .ndl-relationship-label-content:after, .ndl-relationship-label:not(.ndl-disabled):focus-visible .ndl-relationship-label-content:after, .ndl-relationship-label:not(.ndl-disabled):active .ndl-relationship-label-content:after{
3794
+ .ndl-relationship-label:not(.ndl-disabled).ndl-selected .ndl-relationship-label-container:after, .ndl-relationship-label:not(.ndl-disabled):focus-visible .ndl-relationship-label-container:after, .ndl-relationship-label:not(.ndl-disabled):active .ndl-relationship-label-container:after{
3767
3795
  --tw-bg-opacity: 1;
3768
3796
  background-color: rgb(1 139 255 / var(--tw-bg-opacity));
3769
3797
  }
3770
- .ndl-relationship-label:not(.ndl-disabled).ndl-selected .ndl-relationship-label-content:before, .ndl-relationship-label:not(.ndl-disabled):focus-visible .ndl-relationship-label-content:before, .ndl-relationship-label:not(.ndl-disabled):active .ndl-relationship-label-content:before{
3798
+ .ndl-relationship-label:not(.ndl-disabled).ndl-selected .ndl-relationship-label-container:before, .ndl-relationship-label:not(.ndl-disabled):focus-visible .ndl-relationship-label-container:before, .ndl-relationship-label:not(.ndl-disabled):active .ndl-relationship-label-container:before{
3771
3799
  --tw-bg-opacity: 1;
3772
3800
  background-color: rgb(1 139 255 / var(--tw-bg-opacity));
3773
3801
  }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 03 Apr 2023 15:46:06 GMT
3
+ * Generated on Tue, 18 Apr 2023 07:52:52 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 03 Apr 2023 15:46:06 GMT
3
+ * Generated on Tue, 18 Apr 2023 07:52:52 GMT
4
4
  */
5
5
 
6
6
  module.exports = {
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 03 Apr 2023 15:46:06 GMT
3
+ * Generated on Tue, 18 Apr 2023 07:52:52 GMT
4
4
  */
5
5
 
6
6
  export const tokens = {
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Mon, 03 Apr 2023 15:46:06 GMT
3
+ // Generated on Tue, 18 Apr 2023 07:52:52 GMT
4
4
 
5
5
  $transitions-values-properties-default: all;
6
6
  $transitions-values-duration-default: 100ms;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@neo4j-ndl/base",
3
- "version": "1.1.0",
3
+ "version": "1.1.2",
4
4
  "description": "Neo4j base package for the design system",
5
5
  "author": "Neo4j Inc.",
6
6
  "homepage": "",