@nubitio/react-admin 0.5.24 → 0.5.27

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.
Files changed (2) hide show
  1. package/dist/style.css +258 -2
  2. package/package.json +7 -7
package/dist/style.css CHANGED
@@ -3655,10 +3655,10 @@ html[data-density=compact] .nb-drawer__footer {
3655
3655
  outline: 0;
3656
3656
  transition: background var(--transition-fast), box-shadow var(--transition-fast);
3657
3657
  }
3658
- .nb-datagrid--zebra .nb-datagrid__row:nth-child(even) td {
3658
+ .nb-datagrid--zebra .nb-datagrid__row:nth-child(even) td:not(.nb-datagrid__cell--dirty):not(.nb-datagrid__cell--active) {
3659
3659
  background: var(--grid-row-alt-bg);
3660
3660
  }
3661
- .nb-datagrid__row:hover td {
3661
+ .nb-datagrid__row:hover td:not(.nb-datagrid__cell--dirty):not(.nb-datagrid__cell--active):not(.nb-datagrid__edit-cell) {
3662
3662
  background: var(--grid-row-hover-bg, var(--surface-2));
3663
3663
  }
3664
3664
  .nb-datagrid__row:focus-visible {
@@ -4952,6 +4952,262 @@ html[data-density=compact] .nb-datagrid .nb-badge {
4952
4952
  box-shadow: none;
4953
4953
  }
4954
4954
  }
4955
+ .nb-datagrid__row--editing {
4956
+ background: color-mix(in srgb, var(--accent-color, var(--accent)) 5%, var(--surface-0));
4957
+ }
4958
+
4959
+ .nb-datagrid__row--dirty .nb-datagrid__cell--dirty {
4960
+ background: color-mix(in srgb, #4caf50 34%, var(--surface-1, #fff));
4961
+ }
4962
+
4963
+ .nb-datagrid__row--saving {
4964
+ opacity: 0.6;
4965
+ pointer-events: none;
4966
+ }
4967
+
4968
+ .nb-datagrid__data-cell {
4969
+ cursor: default;
4970
+ }
4971
+
4972
+ .nb-datagrid__cell--editable {
4973
+ cursor: cell;
4974
+ }
4975
+ .nb-datagrid__cell--editable:hover:not(.nb-datagrid__cell--dirty):not(.nb-datagrid__cell--active) {
4976
+ background: color-mix(in srgb, var(--accent) 4%, var(--surface-0));
4977
+ }
4978
+
4979
+ .nb-datagrid__table td.nb-datagrid__cell--dirty {
4980
+ background: color-mix(in srgb, #4caf50 34%, var(--surface-1, #fff));
4981
+ box-shadow: inset 0 0 0 1px color-mix(in srgb, #4caf50 72%, transparent);
4982
+ }
4983
+
4984
+ .nb-datagrid--zebra .nb-datagrid__row:nth-child(even) td.nb-datagrid__cell--dirty,
4985
+ .nb-datagrid__row:hover td.nb-datagrid__cell--dirty,
4986
+ .nb-datagrid__row--selected td.nb-datagrid__cell--dirty {
4987
+ background: color-mix(in srgb, #4caf50 34%, var(--surface-1, #fff));
4988
+ box-shadow: inset 0 0 0 1px color-mix(in srgb, #4caf50 72%, transparent);
4989
+ }
4990
+
4991
+ .nb-datagrid__table td.nb-datagrid__cell--active {
4992
+ background: color-mix(in srgb, #4caf50 42%, var(--surface-1, #fff));
4993
+ box-shadow: inset 0 0 0 2px color-mix(in srgb, #4caf50 78%, transparent);
4994
+ }
4995
+
4996
+ .nb-datagrid--zebra .nb-datagrid__row:nth-child(even) td.nb-datagrid__cell--active,
4997
+ .nb-datagrid__row:hover td.nb-datagrid__cell--active,
4998
+ .nb-datagrid__row--selected td.nb-datagrid__cell--active {
4999
+ background: color-mix(in srgb, #4caf50 42%, var(--surface-1, #fff));
5000
+ box-shadow: inset 0 0 0 2px color-mix(in srgb, #4caf50 78%, transparent);
5001
+ }
5002
+
5003
+ .nb-datagrid__edit-cell {
5004
+ padding: 2px 4px;
5005
+ vertical-align: middle;
5006
+ }
5007
+
5008
+ .nb-inline-cell {
5009
+ width: 100%;
5010
+ min-width: 0;
5011
+ }
5012
+ .nb-inline-cell .nb-inline-control,
5013
+ .nb-inline-cell .nb-inline-control input,
5014
+ .nb-inline-cell .nb-inline-control select,
5015
+ .nb-inline-cell .nb-inline-control textarea,
5016
+ .nb-inline-cell .nb-form__control,
5017
+ .nb-inline-cell .nb-form__control input,
5018
+ .nb-inline-cell .nb-form__control select,
5019
+ .nb-inline-cell .nb-form__control textarea {
5020
+ font-size: 13px;
5021
+ line-height: 1.3;
5022
+ height: 28px;
5023
+ min-height: 28px;
5024
+ padding: 0 8px;
5025
+ border: 1px solid color-mix(in srgb, var(--border-color) 85%, var(--accent));
5026
+ border-radius: var(--radius-sm);
5027
+ box-sizing: border-box;
5028
+ width: 100%;
5029
+ background: var(--surface-0);
5030
+ color: var(--text-primary);
5031
+ box-shadow: none;
5032
+ transition: border-color 0.12s, box-shadow 0.12s;
5033
+ }
5034
+ .nb-inline-cell .nb-inline-control:focus,
5035
+ .nb-inline-cell .nb-inline-control input:focus,
5036
+ .nb-inline-cell .nb-inline-control select:focus,
5037
+ .nb-inline-cell .nb-inline-control textarea:focus,
5038
+ .nb-inline-cell .nb-form__control:focus,
5039
+ .nb-inline-cell .nb-form__control input:focus,
5040
+ .nb-inline-cell .nb-form__control select:focus,
5041
+ .nb-inline-cell .nb-form__control textarea:focus {
5042
+ outline: none;
5043
+ border-color: var(--accent);
5044
+ box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent);
5045
+ }
5046
+ .nb-datagrid__cell--dirty .nb-inline-cell .nb-inline-control:focus, .nb-datagrid__cell--active .nb-inline-cell .nb-inline-control:focus, .nb-datagrid__cell--dirty .nb-inline-cell .nb-form__control:focus, .nb-datagrid__cell--active .nb-inline-cell .nb-form__control:focus {
5047
+ border-color: color-mix(in srgb, #4caf50 70%, var(--accent-color, var(--accent)));
5048
+ box-shadow: 0 0 0 2px color-mix(in srgb, #4caf50 28%, transparent);
5049
+ }
5050
+ .nb-inline-cell .nb-inline-control textarea,
5051
+ .nb-inline-cell .nb-form__control textarea {
5052
+ height: 52px;
5053
+ padding: 4px 8px;
5054
+ resize: vertical;
5055
+ }
5056
+ .nb-inline-cell .nb-form-switch,
5057
+ .nb-inline-cell .nb-form-checkbox {
5058
+ margin: 0;
5059
+ }
5060
+ .nb-inline-cell .nb-dropdown {
5061
+ width: 100%;
5062
+ }
5063
+ .nb-inline-cell .nb-dropdown__trigger {
5064
+ height: 28px;
5065
+ min-height: 28px;
5066
+ font-size: 13px;
5067
+ padding: 0 8px;
5068
+ border-radius: var(--radius-sm);
5069
+ }
5070
+ .nb-inline-cell .nb-date-picker {
5071
+ width: 100%;
5072
+ }
5073
+ .nb-inline-cell .nb-date-picker__trigger {
5074
+ height: 28px;
5075
+ min-height: 28px;
5076
+ border-radius: var(--radius-sm);
5077
+ border: 1px solid color-mix(in srgb, var(--border-color) 85%, var(--accent));
5078
+ background: var(--surface-0);
5079
+ }
5080
+ .nb-inline-cell .nb-date-picker__input {
5081
+ font-size: 13px;
5082
+ padding: 0 4px;
5083
+ }
5084
+ .nb-inline-cell .nb-form__lookup {
5085
+ width: 100%;
5086
+ }
5087
+ .nb-inline-cell .nb-form__lookup .nb-form__control,
5088
+ .nb-inline-cell .nb-form__lookup.has-value .nb-form__control {
5089
+ height: 28px;
5090
+ min-height: 28px;
5091
+ font-size: 13px;
5092
+ padding-right: 52px;
5093
+ }
5094
+ .nb-inline-cell .nb-form__lookup-toggle,
5095
+ .nb-inline-cell .nb-form__lookup-clear {
5096
+ width: 24px;
5097
+ height: 24px;
5098
+ }
5099
+ .nb-inline-cell.nb-inline-cell--error .nb-inline-control,
5100
+ .nb-inline-cell.nb-inline-cell--error .nb-inline-control input,
5101
+ .nb-inline-cell.nb-inline-cell--error .nb-inline-control select,
5102
+ .nb-inline-cell.nb-inline-cell--error .nb-form__control,
5103
+ .nb-inline-cell.nb-inline-cell--error .nb-date-picker__trigger {
5104
+ border-color: var(--color-danger);
5105
+ }
5106
+
5107
+ .nb-datagrid__inline-actions {
5108
+ display: flex;
5109
+ align-items: center;
5110
+ justify-content: center;
5111
+ gap: 4px;
5112
+ }
5113
+
5114
+ .nb-datagrid__inline-btn {
5115
+ display: inline-flex;
5116
+ align-items: center;
5117
+ justify-content: center;
5118
+ width: 30px;
5119
+ height: 30px;
5120
+ border: 1px solid transparent;
5121
+ border-radius: var(--radius-sm);
5122
+ cursor: pointer;
5123
+ font-size: 15px;
5124
+ transition: background 0.1s, color 0.1s;
5125
+ }
5126
+ .nb-datagrid__inline-btn:disabled {
5127
+ opacity: 0.4;
5128
+ cursor: default;
5129
+ }
5130
+ .nb-datagrid__inline-btn--save {
5131
+ background: var(--accent);
5132
+ color: #fff;
5133
+ }
5134
+ .nb-datagrid__inline-btn--save:hover:not(:disabled) {
5135
+ background: color-mix(in srgb, var(--accent) 85%, #000);
5136
+ }
5137
+ .nb-datagrid__inline-btn--cancel {
5138
+ background: transparent;
5139
+ color: var(--text-secondary);
5140
+ border-color: var(--border-color);
5141
+ }
5142
+ .nb-datagrid__inline-btn--cancel:hover:not(:disabled) {
5143
+ background: var(--surface-2);
5144
+ color: var(--text-primary);
5145
+ }
5146
+
5147
+ .nb-datagrid__toolbar-icon-action--save {
5148
+ color: var(--accent);
5149
+ }
5150
+ .nb-datagrid__toolbar-icon-action--save:hover {
5151
+ background: color-mix(in srgb, var(--accent) 12%, transparent);
5152
+ }
5153
+
5154
+ .nb-datagrid__toolbar-icon-action--revert {
5155
+ color: var(--text-secondary);
5156
+ }
5157
+ .nb-datagrid__toolbar-icon-action--revert:hover {
5158
+ background: var(--surface-2);
5159
+ color: var(--text-primary);
5160
+ }
5161
+
5162
+ .nb-datagrid__batch-bar {
5163
+ display: flex;
5164
+ align-items: center;
5165
+ gap: var(--space-3);
5166
+ padding: 8px 14px;
5167
+ background: color-mix(in srgb, #4caf50 10%, var(--surface-0));
5168
+ border-bottom: 1px solid color-mix(in srgb, #4caf50 24%, transparent);
5169
+ font-size: 13px;
5170
+ }
5171
+ .nb-datagrid__batch-bar--compact {
5172
+ padding-block: 6px;
5173
+ }
5174
+
5175
+ .nb-datagrid__batch-bar-label {
5176
+ flex: 1;
5177
+ color: var(--text-secondary);
5178
+ }
5179
+
5180
+ .nb-datagrid__batch-bar-actions {
5181
+ display: flex;
5182
+ gap: var(--space-2);
5183
+ }
5184
+
5185
+ .nb-datagrid__batch-bar-btn {
5186
+ height: 30px;
5187
+ padding: 0 14px;
5188
+ border-radius: var(--radius-sm);
5189
+ font-size: 13px;
5190
+ font-weight: 500;
5191
+ cursor: pointer;
5192
+ transition: background 0.1s;
5193
+ }
5194
+ .nb-datagrid__batch-bar-btn--save {
5195
+ background: var(--accent);
5196
+ color: #fff;
5197
+ border: none;
5198
+ }
5199
+ .nb-datagrid__batch-bar-btn--save:hover {
5200
+ background: color-mix(in srgb, var(--accent) 85%, #000);
5201
+ }
5202
+ .nb-datagrid__batch-bar-btn--discard {
5203
+ background: transparent;
5204
+ color: var(--text-secondary);
5205
+ border: 1px solid var(--border-color);
5206
+ }
5207
+ .nb-datagrid__batch-bar-btn--discard:hover {
5208
+ background: var(--surface-2);
5209
+ color: var(--text-primary);
5210
+ }
4955
5211
  .nb-form {
4956
5212
  color: var(--text-primary);
4957
5213
  display: flex;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nubitio/react-admin",
3
- "version": "0.5.24",
3
+ "version": "0.5.27",
4
4
  "type": "module",
5
5
  "description": "Batteries-included admin stack: core runtime, CRUD, Hydra adapter, and AdminShell.",
6
6
  "license": "MIT",
@@ -50,12 +50,12 @@
50
50
  "access": "public"
51
51
  },
52
52
  "dependencies": {
53
- "@nubitio/crud": "^0.5.24",
54
- "@nubitio/admin": "^0.5.24",
55
- "@nubitio/dashboard": "^0.5.24",
56
- "@nubitio/ui": "^0.5.24",
57
- "@nubitio/hydra": "^0.5.24",
58
- "@nubitio/core": "^0.5.24"
53
+ "@nubitio/admin": "^0.5.27",
54
+ "@nubitio/core": "^0.5.27",
55
+ "@nubitio/crud": "^0.5.27",
56
+ "@nubitio/ui": "^0.5.27",
57
+ "@nubitio/hydra": "^0.5.27",
58
+ "@nubitio/dashboard": "^0.5.27"
59
59
  },
60
60
  "peerDependencies": {
61
61
  "@tanstack/react-query": "^5.0.0",