@exmg/exm-grid 1.2.3 → 1.2.5

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 (8) hide show
  1. package/.rollup.cache/root/repo/packages/exm-grid/dist/styles/exm-grid-styles-css.js +7 -5
  2. package/.rollup.cache/root/repo/packages/exm-grid/dist/table/exm-grid-base.d.ts +2 -1
  3. package/.rollup.cache/root/repo/packages/exm-grid/dist/table/exm-grid-base.js +2 -1
  4. package/README.md +1 -0
  5. package/dist/styles/exm-grid-styles-css.js +7 -5
  6. package/dist/table/exm-grid-base.d.ts +2 -1
  7. package/dist/table/exm-grid-base.js +2 -1
  8. package/package.json +4 -4
package/.rollup.cache/root/repo/packages/exm-grid/dist/styles/exm-grid-styles-css.js CHANGED
@@ -4,12 +4,9 @@ export const gridOutlineStyles = css `
4
4
  --exm-theme-table-surface: var(--md-sys-color-background);
5
5
  --exm-theme-table-toolbar-background-color: var(--md-sys-color-background);
6
6
  --exm-table-th-background-color: var(--md-sys-color-background);
7
- border: 1px solid var(--md-sys-color-outline-variant);
7
+ --exm-table-tr-alternate-background-color: var(--exm-table-row-alternate-background-color, #cbc9d420);
8
+ border: 1px solid var(--exm-theme-table-outline-color, var(--md-sys-color-outline-variant));
8
9
  border-radius: 1rem;
9
-
10
- tr:nth-child(odd) {
11
- background-color: #cbc9d429;
12
- }
13
10
  }
14
11
  `;
15
12
  export const style = css `
@@ -61,6 +58,7 @@ export const style = css `
61
58
  --exm-table-col-number-padding-right: var(--exm-theme-table-col-number-padding-right, 10px);
62
59
  --exm-table-checkbox-cell-width: var(--exm-theme-table-checkbox-cell-width, 24px);
63
60
  --exm-table-toolbar-setting-position: var(--exm-theme-table-toolbar-setting-position, absolute);
61
+ --exm-table-tr-alternate-background-color: transparent;
64
62
  }
65
63
 
66
64
  ::slotted([slot='pagination']) {
@@ -180,6 +178,10 @@ export const style = css `
180
178
  text-transform: var(--mdc-typography-body2-text-transform, inherit);
181
179
  }
182
180
 
181
+ table tbody tr:nth-child(odd) {
182
+ background-color: var(--exm-table-tr-alternate-background-color, transparent);
183
+ }
184
+
183
185
  td {
184
186
  height: var(--exm-table-td-height);
185
187
  }
package/.rollup.cache/root/repo/packages/exm-grid/dist/table/exm-grid-base.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { ExmgElement } from '@exmg/lit-base/index.js';
2
- import '@exmg/exm-sortable/exm-sortable.js';
3
2
  import { SORT_DIRECTION } from './types/exm-grid-types.js';
3
+ import '@exmg/exm-sortable/exm-sortable.js';
4
4
  type GenericPropertyValues<T, V = unknown> = Map<T, V>;
5
5
  type Props = Exclude<keyof ExmGridBase, number | symbol>;
6
6
  type SmartPropertyValue = GenericPropertyValues<Props>;
@@ -18,6 +18,7 @@ type SmartPropertyValue = GenericPropertyValues<Props>;
18
18
  * `--exm-table-box-shadow` | table box shadow | `#{0px 1px 5px 0px rgba($onSurface, .2), 0px 2px 2px 0px rgba($onSurface, .14), 0px 3px 1px -2px rgba($onSurface, .12)},`
19
19
  * `--exm-table-row-divider-color` | table rows separator color | `#dbdbdb;`
20
20
  * `--exm-table-row-selected-color` | selected row text color | `#02182b;`
21
+ * `--exm-table-row-alternate-background-color` | alternate row background color | `#cbc9d420;`
21
22
  * `--exm-table-row-selected-background-color` | selected row background color | `#e2f1fe;`
22
23
  * `--exm-table-row-hover-color` | row hover text color | `#02182b;`
23
24
  * `--exm-table-row-hover-background-color` | row hover background color | `#f1f1f1;`
package/.rollup.cache/root/repo/packages/exm-grid/dist/table/exm-grid-base.js CHANGED
@@ -3,12 +3,12 @@ import { html } from 'lit';
3
3
  import { ExmgElement } from '@exmg/lit-base/index.js';
4
4
  import { property, state } from 'lit/decorators.js';
5
5
  import { cache } from 'lit/directives/cache.js';
6
- import '@exmg/exm-sortable/exm-sortable.js';
7
6
  import { ExmRowSelectable } from './featrues/exm-row-selectable.js';
8
7
  import { ExmQuerySelectors } from './utils/exm-query-selectors.js';
9
8
  import { ExmRowExpandable } from './featrues/exm-row-expandable.js';
10
9
  import { ExmColumnSortable } from './featrues/exm-column-sortable.js';
11
10
  import { ExmRowSortable } from './featrues/exm-row-sortable.js';
11
+ import '@exmg/exm-sortable/exm-sortable.js';
12
12
  /**
13
13
  * ### Styling
14
14
  * The following custom properties and mixins are available for styling:
@@ -23,6 +23,7 @@ import { ExmRowSortable } from './featrues/exm-row-sortable.js';
23
23
  * `--exm-table-box-shadow` | table box shadow | `#{0px 1px 5px 0px rgba($onSurface, .2), 0px 2px 2px 0px rgba($onSurface, .14), 0px 3px 1px -2px rgba($onSurface, .12)},`
24
24
  * `--exm-table-row-divider-color` | table rows separator color | `#dbdbdb;`
25
25
  * `--exm-table-row-selected-color` | selected row text color | `#02182b;`
26
+ * `--exm-table-row-alternate-background-color` | alternate row background color | `#cbc9d420;`
26
27
  * `--exm-table-row-selected-background-color` | selected row background color | `#e2f1fe;`
27
28
  * `--exm-table-row-hover-color` | row hover text color | `#02182b;`
28
29
  * `--exm-table-row-hover-background-color` | row hover background color | `#f1f1f1;`
package/README.md CHANGED
@@ -448,6 +448,7 @@ Additionally you can also override css variables:
448
448
  | Custom property | Description | Default |
449
449
  | ------------------------------------------------------------- | ------------------------------------------------------- | -------------------------------------------------------------- |
450
450
  | `--exm-arrow-upward-url` | Url to icon that is used for soring direction indicator | `url('/node_modules/@exmg/exm-grid/assets/arrow-upward.svg');` |
451
+ | `--exm-theme-table-outline-color` | table outline color | `--md-sys-color-outline-variant` |
451
452
  | `--exm-theme-table-card-width` | table card width | `100%;` |
452
453
  | `--exm-theme-table-card-margin-bottom` | table bottom margin | `5px;` |
453
454
  | `--exm-theme-table-on-surface` | table text color | `#02182b;` |
package/dist/styles/exm-grid-styles-css.js CHANGED
@@ -5,12 +5,9 @@ const gridOutlineStyles = css `
5
5
  --exm-theme-table-surface: var(--md-sys-color-background);
6
6
  --exm-theme-table-toolbar-background-color: var(--md-sys-color-background);
7
7
  --exm-table-th-background-color: var(--md-sys-color-background);
8
- border: 1px solid var(--md-sys-color-outline-variant);
8
+ --exm-table-tr-alternate-background-color: var(--exm-table-row-alternate-background-color, #cbc9d420);
9
+ border: 1px solid var(--exm-theme-table-outline-color, var(--md-sys-color-outline-variant));
9
10
  border-radius: 1rem;
10
-
11
- tr:nth-child(odd) {
12
- background-color: #cbc9d429;
13
- }
14
11
  }
15
12
  `;
16
13
  const style = css `
@@ -62,6 +59,7 @@ const style = css `
62
59
  --exm-table-col-number-padding-right: var(--exm-theme-table-col-number-padding-right, 10px);
63
60
  --exm-table-checkbox-cell-width: var(--exm-theme-table-checkbox-cell-width, 24px);
64
61
  --exm-table-toolbar-setting-position: var(--exm-theme-table-toolbar-setting-position, absolute);
62
+ --exm-table-tr-alternate-background-color: transparent;
65
63
  }
66
64
 
67
65
  ::slotted([slot='pagination']) {
@@ -181,6 +179,10 @@ const style = css `
181
179
  text-transform: var(--mdc-typography-body2-text-transform, inherit);
182
180
  }
183
181
 
182
+ table tbody tr:nth-child(odd) {
183
+ background-color: var(--exm-table-tr-alternate-background-color, transparent);
184
+ }
185
+
184
186
  td {
185
187
  height: var(--exm-table-td-height);
186
188
  }
package/dist/table/exm-grid-base.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { ExmgElement } from '@exmg/lit-base/index.js';
2
- import '@exmg/exm-sortable/exm-sortable.js';
3
2
  import { SORT_DIRECTION } from './types/exm-grid-types.js';
3
+ import '@exmg/exm-sortable/exm-sortable.js';
4
4
  type GenericPropertyValues<T, V = unknown> = Map<T, V>;
5
5
  type Props = Exclude<keyof ExmGridBase, number | symbol>;
6
6
  type SmartPropertyValue = GenericPropertyValues<Props>;
@@ -18,6 +18,7 @@ type SmartPropertyValue = GenericPropertyValues<Props>;
18
18
  * `--exm-table-box-shadow` | table box shadow | `#{0px 1px 5px 0px rgba($onSurface, .2), 0px 2px 2px 0px rgba($onSurface, .14), 0px 3px 1px -2px rgba($onSurface, .12)},`
19
19
  * `--exm-table-row-divider-color` | table rows separator color | `#dbdbdb;`
20
20
  * `--exm-table-row-selected-color` | selected row text color | `#02182b;`
21
+ * `--exm-table-row-alternate-background-color` | alternate row background color | `#cbc9d420;`
21
22
  * `--exm-table-row-selected-background-color` | selected row background color | `#e2f1fe;`
22
23
  * `--exm-table-row-hover-color` | row hover text color | `#02182b;`
23
24
  * `--exm-table-row-hover-background-color` | row hover background color | `#f1f1f1;`
package/dist/table/exm-grid-base.js CHANGED
@@ -3,12 +3,12 @@ import { html } from 'lit';
3
3
  import { ExmgElement } from '@exmg/lit-base/index.js';
4
4
  import { property, state } from 'lit/decorators.js';
5
5
  import { cache } from 'lit/directives/cache.js';
6
- import '@exmg/exm-sortable/exm-sortable.js';
7
6
  import { ExmRowSelectable } from './featrues/exm-row-selectable.js';
8
7
  import { ExmQuerySelectors } from './utils/exm-query-selectors.js';
9
8
  import { ExmRowExpandable } from './featrues/exm-row-expandable.js';
10
9
  import { ExmColumnSortable } from './featrues/exm-column-sortable.js';
11
10
  import { ExmRowSortable } from './featrues/exm-row-sortable.js';
11
+ import '@exmg/exm-sortable/exm-sortable.js';
12
12
 
13
13
  /**
14
14
  * ### Styling
@@ -24,6 +24,7 @@ import { ExmRowSortable } from './featrues/exm-row-sortable.js';
24
24
  * `--exm-table-box-shadow` | table box shadow | `#{0px 1px 5px 0px rgba($onSurface, .2), 0px 2px 2px 0px rgba($onSurface, .14), 0px 3px 1px -2px rgba($onSurface, .12)},`
25
25
  * `--exm-table-row-divider-color` | table rows separator color | `#dbdbdb;`
26
26
  * `--exm-table-row-selected-color` | selected row text color | `#02182b;`
27
+ * `--exm-table-row-alternate-background-color` | alternate row background color | `#cbc9d420;`
27
28
  * `--exm-table-row-selected-background-color` | selected row background color | `#e2f1fe;`
28
29
  * `--exm-table-row-hover-color` | row hover text color | `#02182b;`
29
30
  * `--exm-table-row-hover-background-color` | row hover background color | `#f1f1f1;`
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@exmg/exm-grid",
3
- "version": "1.2.3",
3
+ "version": "1.2.5",
4
4
  "type": "module",
5
5
  "description": "exmg grid element",
6
6
  "contributors": [
@@ -39,8 +39,8 @@
39
39
  "directory": "packages/exm-grid"
40
40
  },
41
41
  "dependencies": {
42
- "@exmg/exm-search": "^1.2.3",
43
- "@exmg/exm-sortable": "^1.2.3"
42
+ "@exmg/exm-search": "^1.2.5",
43
+ "@exmg/exm-sortable": "^1.2.5"
44
44
  },
45
45
  "peerDependencies": {
46
46
  "@exmg/lit-base": "^3.0.0",
@@ -54,5 +54,5 @@
54
54
  "publishConfig": {
55
55
  "access": "public"
56
56
  },
57
- "gitHead": "88d4a421d86cfdb2493aa3a54098e92a38e46b51"
57
+ "gitHead": "93055dd9ec113fc8161acb417322c4d6b44cd530"
58
58
  }