@triptyk/ember-yeti-table 3.0.0
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/LICENSE.md +9 -0
- package/README.md +132 -0
- package/addon-main.cjs +4 -0
- package/declarations/themes/default-theme.d.ts +28 -0
- package/declarations/themes/default-theme.d.ts.map +1 -0
- package/declarations/utils/create-regex.d.ts +2 -0
- package/declarations/utils/create-regex.d.ts.map +1 -0
- package/declarations/utils/filtering-utils.d.ts +5 -0
- package/declarations/utils/filtering-utils.d.ts.map +1 -0
- package/declarations/utils/sorting-utils.d.ts +24 -0
- package/declarations/utils/sorting-utils.d.ts.map +1 -0
- package/dist/_app_/components/yeti-table/body.js +1 -0
- package/dist/_app_/components/yeti-table/header.js +1 -0
- package/dist/_app_/components/yeti-table/pagination.js +1 -0
- package/dist/_app_/components/yeti-table/table.js +1 -0
- package/dist/_app_/components/yeti-table/tbody/row/cell.js +1 -0
- package/dist/_app_/components/yeti-table/tbody/row.js +1 -0
- package/dist/_app_/components/yeti-table/tbody.js +1 -0
- package/dist/_app_/components/yeti-table/tfoot/row/cell.js +1 -0
- package/dist/_app_/components/yeti-table/tfoot/row.js +1 -0
- package/dist/_app_/components/yeti-table/tfoot.js +1 -0
- package/dist/_app_/components/yeti-table/thead/row/cell.js +1 -0
- package/dist/_app_/components/yeti-table/thead/row/column.js +1 -0
- package/dist/_app_/components/yeti-table/thead/row.js +1 -0
- package/dist/_app_/components/yeti-table/thead.js +1 -0
- package/dist/_app_/components/yeti-table.js +1 -0
- package/dist/_app_/themes/default-theme.js +1 -0
- package/dist/_app_/utils/create-regex.js +1 -0
- package/dist/_app_/utils/filtering-utils.js +1 -0
- package/dist/_app_/utils/sorting-utils.js +1 -0
- package/dist/components/yeti-table/body.js +37 -0
- package/dist/components/yeti-table/body.js.map +1 -0
- package/dist/components/yeti-table/header.js +30 -0
- package/dist/components/yeti-table/header.js.map +1 -0
- package/dist/components/yeti-table/pagination.js +86 -0
- package/dist/components/yeti-table/pagination.js.map +1 -0
- package/dist/components/yeti-table/table.js +38 -0
- package/dist/components/yeti-table/table.js.map +1 -0
- package/dist/components/yeti-table/tbody/row/cell.js +35 -0
- package/dist/components/yeti-table/tbody/row/cell.js.map +1 -0
- package/dist/components/yeti-table/tbody/row.js +47 -0
- package/dist/components/yeti-table/tbody/row.js.map +1 -0
- package/dist/components/yeti-table/tbody.js +20 -0
- package/dist/components/yeti-table/tbody.js.map +1 -0
- package/dist/components/yeti-table/tfoot/row/cell.js +31 -0
- package/dist/components/yeti-table/tfoot/row/cell.js.map +1 -0
- package/dist/components/yeti-table/tfoot/row.js +31 -0
- package/dist/components/yeti-table/tfoot/row.js.map +1 -0
- package/dist/components/yeti-table/tfoot.js +20 -0
- package/dist/components/yeti-table/tfoot.js.map +1 -0
- package/dist/components/yeti-table/thead/row/cell.js +24 -0
- package/dist/components/yeti-table/thead/row/cell.js.map +1 -0
- package/dist/components/yeti-table/thead/row/column.js +202 -0
- package/dist/components/yeti-table/thead/row/column.js.map +1 -0
- package/dist/components/yeti-table/thead/row.js +41 -0
- package/dist/components/yeti-table/thead/row.js.map +1 -0
- package/dist/components/yeti-table/thead.js +35 -0
- package/dist/components/yeti-table/thead.js.map +1 -0
- package/dist/components/yeti-table.js +618 -0
- package/dist/components/yeti-table.js.map +1 -0
- package/dist/themes/default-theme.js +51 -0
- package/dist/themes/default-theme.js.map +1 -0
- package/dist/utils/create-regex.js +34 -0
- package/dist/utils/create-regex.js.map +1 -0
- package/dist/utils/filtering-utils.js +55 -0
- package/dist/utils/filtering-utils.js.map +1 -0
- package/dist/utils/sorting-utils.js +93 -0
- package/dist/utils/sorting-utils.js.map +1 -0
- package/package.json +124 -0
- package/src/.gitkeep +0 -0
- package/src/components/yeti-table/body.gjs +94 -0
- package/src/components/yeti-table/header.gjs +54 -0
- package/src/components/yeti-table/pagination.gjs +155 -0
- package/src/components/yeti-table/table.gjs +34 -0
- package/src/components/yeti-table/tbody/row/cell.gjs +51 -0
- package/src/components/yeti-table/tbody/row.gjs +89 -0
- package/src/components/yeti-table/tbody.gjs +55 -0
- package/src/components/yeti-table/tfoot/row/cell.gjs +45 -0
- package/src/components/yeti-table/tfoot/row.gjs +44 -0
- package/src/components/yeti-table/tfoot.gjs +33 -0
- package/src/components/yeti-table/thead/row/cell.gjs +52 -0
- package/src/components/yeti-table/thead/row/column.gjs +260 -0
- package/src/components/yeti-table/thead/row.gjs +71 -0
- package/src/components/yeti-table/thead.gjs +45 -0
- package/src/components/yeti-table.gjs +780 -0
- package/src/themes/default-theme.js +53 -0
- package/src/utils/create-regex.js +65 -0
- package/src/utils/filtering-utils.js +75 -0
- package/src/utils/sorting-utils.js +108 -0
package/LICENSE.md
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
The MIT License (MIT)
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2020
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
|
6
|
+
|
|
7
|
+
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
|
8
|
+
|
|
9
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
# Yeti Table [](https://travis-ci.org/miguelcobain/ember-yeti-table) [](http://emberobserver.com/addons/ember-yeti-table)
|
|
2
|
+
|
|
3
|
+
Yeti Table provides a new expressive way to build tables in Ember with flexibility in mind.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```
|
|
8
|
+
ember install ember-yeti-table
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Why Yeti Table?
|
|
12
|
+
|
|
13
|
+
Perhaps the biggest difference compared to other table solution is that Yeti Table uses templates to define your columns.
|
|
14
|
+
In many other table solutions you need to define columns in javascript.
|
|
15
|
+
Yeti Table was born from an experimentation of trying to define columns in templates.
|
|
16
|
+
|
|
17
|
+
In practice, this empowers customization and feels more in line with writing regular HTML tables.
|
|
18
|
+
This fact has many implications on the whole API of Yeti Table.
|
|
19
|
+
|
|
20
|
+
Yeti table currently weights around `6.17kb` (minified and gzipped).
|
|
21
|
+
|
|
22
|
+
## Features
|
|
23
|
+
|
|
24
|
+
Yeti Table was built with the needs of a real production app in mind. Out of the box, it supports:
|
|
25
|
+
|
|
26
|
+
- **Client side row sorting** - On a single column or on multiple columns.
|
|
27
|
+
- **Client side row filtering** - You can apply a global filter to the table or just to specific columns.
|
|
28
|
+
- **Client side pagination** - Provides pagination controls, but encourages you to build your own as well.
|
|
29
|
+
- **Server side data** - Allows your server to drive the table pagination, filtering and sorting if you choose to. Useful when the dataset is too large to fetch.
|
|
30
|
+
- **Customization** - Does not provide any styles. You can customize pretty much everything about how the tables are rendered on your templates. This includes custom css classes, click handlers and custom filtering and sorting logic.
|
|
31
|
+
|
|
32
|
+
## Usage
|
|
33
|
+
|
|
34
|
+
Your starting point for Yeti Table will be the `@data` argument. It accepts an array of objects
|
|
35
|
+
or a promise that resolves to such an array.
|
|
36
|
+
|
|
37
|
+
Then you must define your table columns inside the header component, each of them with a `@prop` argument that corresponds to the
|
|
38
|
+
property key of each object that you want to display for that column. Yeti Table will update itself based on
|
|
39
|
+
these property names, e.g if a `firstName` property of an object changes, Yeti Table might need to re-sort
|
|
40
|
+
or re-filter the rows.
|
|
41
|
+
|
|
42
|
+
Afterwards, we just need to define our table body. If you use `<table.body/>` in the blockless form,
|
|
43
|
+
Yeti Table "unrolls" all the rows for you. This is useful for simple tables. Here is such an example:
|
|
44
|
+
|
|
45
|
+
```hbs
|
|
46
|
+
<YetiTable @data={{this.data}} as |table|>
|
|
47
|
+
|
|
48
|
+
<table.header as |header|>
|
|
49
|
+
<header.column @prop="firstName">
|
|
50
|
+
First name
|
|
51
|
+
</header.column>
|
|
52
|
+
<header.column @prop="lastName">
|
|
53
|
+
Last name
|
|
54
|
+
</header.column>
|
|
55
|
+
<header.column @prop="points">
|
|
56
|
+
Points
|
|
57
|
+
</header.column>
|
|
58
|
+
</table.header>
|
|
59
|
+
|
|
60
|
+
<table.body/>
|
|
61
|
+
|
|
62
|
+
</YetiTable>
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
You will probably need to make more customizations, and to do so you will need to use `<table.header>`
|
|
66
|
+
and/or `<table.body>` in the block form. This form allows you to:
|
|
67
|
+
|
|
68
|
+
- Use any component or markup as a cell's content
|
|
69
|
+
- Use the row data across multiple cells of the same row
|
|
70
|
+
- Attach click listeners to the row or cell
|
|
71
|
+
- Use row data to conditionally add classes
|
|
72
|
+
|
|
73
|
+
Each `<body.row>` component accepts an optional `@onClick` action that will be called if the row is clicked.
|
|
74
|
+
|
|
75
|
+
Additionally, you might need to toggle the visibility of each row, and for that we can use the `@visible` argument
|
|
76
|
+
on the `<header.column>` component. It defaults to `true`. Setting it to false will hide all the cells for that column
|
|
77
|
+
accross all rows.
|
|
78
|
+
|
|
79
|
+
The `<header.column>` component also accepts a `@columnClass` argument. Yeti Table will apply this class all the cells
|
|
80
|
+
for that column accross all rows.
|
|
81
|
+
|
|
82
|
+
Check out more advanced features on the [Yeti Table documentation site](https://miguelcobain.github.io/ember-yeti-table).
|
|
83
|
+
|
|
84
|
+
## Compatibility
|
|
85
|
+
|
|
86
|
+
- Ember.js v3.20 or above
|
|
87
|
+
- Ember CLI v3.20 or above
|
|
88
|
+
|
|
89
|
+
## Editor integration
|
|
90
|
+
|
|
91
|
+
You can get autocomplete and additional information inside [Visual Studio Code](https://code.visualstudio.com/) by installing [els-addon-docs](https://github.com/lifeart/els-addon-docs) addon for [Unstable Ember Language Server](https://marketplace.visualstudio.com/items?itemName=lifeart.vscode-ember-unstable).
|
|
92
|
+
|
|
93
|
+
## Credits
|
|
94
|
+
|
|
95
|
+
Credits to the amazing [Ember Table](https://github.com/Addepar/ember-table) addon.
|
|
96
|
+
|
|
97
|
+
Yeti Table was also inpired by [DataTables](https://datatables.net/) in a lot of its features.
|
|
98
|
+
|
|
99
|
+
## Contributing
|
|
100
|
+
|
|
101
|
+
### Installation
|
|
102
|
+
|
|
103
|
+
- `git clone <repository-url>`
|
|
104
|
+
- `cd ember-yeti-table`
|
|
105
|
+
- `npm install`
|
|
106
|
+
|
|
107
|
+
### Linting
|
|
108
|
+
|
|
109
|
+
- `npm run lint:hbs`
|
|
110
|
+
- `npm run lint:js`
|
|
111
|
+
- `npm run lint:js -- --fix`
|
|
112
|
+
|
|
113
|
+
### Running tests
|
|
114
|
+
|
|
115
|
+
- `ember test` – Runs the test suite on the current Ember version
|
|
116
|
+
- `ember test --server` – Runs the test suite in "watch mode"
|
|
117
|
+
- `ember try:each` – Runs the test suite against multiple Ember versions
|
|
118
|
+
|
|
119
|
+
### Running the dummy application
|
|
120
|
+
|
|
121
|
+
- `ember serve`
|
|
122
|
+
- Visit the dummy application at [http://localhost:4200](http://localhost:4200).
|
|
123
|
+
|
|
124
|
+
For more information on using ember-cli, visit [https://ember-cli.com/](https://ember-cli.com/).
|
|
125
|
+
|
|
126
|
+
## Contributing
|
|
127
|
+
|
|
128
|
+
See the [Contributing](CONTRIBUTING.md) guide for details.
|
|
129
|
+
|
|
130
|
+
## License
|
|
131
|
+
|
|
132
|
+
This project is licensed under the [MIT License](LICENSE.md).
|
package/addon-main.cjs
ADDED
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
declare const _default: {
|
|
2
|
+
table: string;
|
|
3
|
+
row: string;
|
|
4
|
+
thead: string;
|
|
5
|
+
theadRow: string;
|
|
6
|
+
theadCell: string;
|
|
7
|
+
tbody: string;
|
|
8
|
+
tbodyRow: string;
|
|
9
|
+
tbodyCell: string;
|
|
10
|
+
tfoot: string;
|
|
11
|
+
tfootRow: string;
|
|
12
|
+
tfootCell: string;
|
|
13
|
+
sorting: {
|
|
14
|
+
columnSortable: string;
|
|
15
|
+
columnSorted: string;
|
|
16
|
+
columnSortedAsc: string;
|
|
17
|
+
columnSortedDesc: string;
|
|
18
|
+
};
|
|
19
|
+
pagination: {
|
|
20
|
+
controls: string;
|
|
21
|
+
info: string;
|
|
22
|
+
pageSize: string;
|
|
23
|
+
next: string;
|
|
24
|
+
previous: string;
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
export default _default;
|
|
28
|
+
//# sourceMappingURL=default-theme.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"default-theme.d.ts","sourceRoot":"","sources":["../../src/themes/default-theme.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AACA,wBAkDE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"create-regex.d.ts","sourceRoot":"","sources":["../../src/utils/create-regex.ts"],"names":[],"mappings":"AAWA,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,UAAQ,EAAE,KAAK,UAAO,EAAE,eAAe,UAAO,sBA6BtG"}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type Column from '../components/yeti-table/thead/row/column.ts';
|
|
2
|
+
import type { TableData } from '../components/yeti-table/body.ts';
|
|
3
|
+
import type { FilterFunction } from '../components/yeti-table.ts';
|
|
4
|
+
export default function filterData(data: TableData[], columns: Column[], globalFilter: string, filterFunction?: FilterFunction, filterUsing?: string): TableData[];
|
|
5
|
+
//# sourceMappingURL=filtering-utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"filtering-utils.d.ts","sourceRoot":"","sources":["../../src/utils/filtering-utils.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,MAAM,8CAA8C,CAAC;AACvE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AA8BlE,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,YAAY,EAAE,MAAM,EAAE,cAAc,CAAC,EAAE,cAAc,EAAE,WAAW,CAAC,EAAE,MAAM,eAoCnJ"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import type { IterableElement } from 'type-fest';
|
|
2
|
+
export type ComparatorFunction<T> = (a: T, b: T) => number;
|
|
3
|
+
export type SortProps = {
|
|
4
|
+
prop?: string;
|
|
5
|
+
direction?: 'asc' | 'desc' | null;
|
|
6
|
+
}[];
|
|
7
|
+
export type SortFunction<T> = (itemA: T, itemB: T, sorts: SortProps, compare: ComparatorFunction<T>) => number;
|
|
8
|
+
/**
|
|
9
|
+
* An implementation of the standard merge sort algorithm.
|
|
10
|
+
*
|
|
11
|
+
* This is necessary because we need a stable sorting algorithm that accepts
|
|
12
|
+
* a general comparator. The built in sort function and Ember's sort functions
|
|
13
|
+
* are not stable, and `_.sortBy` doesn't take a general comparator. Ideally
|
|
14
|
+
* lodash would add a `_.sort` function whose API would mimic this function's.
|
|
15
|
+
*
|
|
16
|
+
* @function
|
|
17
|
+
* @param {Array} array The array to be sorted
|
|
18
|
+
* @param {Comparator} comparator The comparator function to compare elements with.
|
|
19
|
+
* @return {Array} A sorted array
|
|
20
|
+
*/
|
|
21
|
+
export declare function mergeSort<T extends Array<unknown>>(array: T, comparator?: ComparatorFunction<IterableElement<T>>): T;
|
|
22
|
+
export declare function sortMultiple<T>(itemA: T, itemB: T, sorts: SortProps, compare: ComparatorFunction<T>): number | undefined;
|
|
23
|
+
export declare function compareValues<T>(itemA: T, itemB: T): 0 | 1 | -1;
|
|
24
|
+
//# sourceMappingURL=sorting-utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"sorting-utils.d.ts","sourceRoot":"","sources":["../../src/utils/sorting-utils.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAEjD,MAAM,MAAM,kBAAkB,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC;AAE3D,MAAM,MAAM,SAAS,GAAG;IAAE,IAAI,CAAC,EAAE,MAAM,CAAC;IAAC,SAAS,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,IAAI,CAAA;CAAE,EAAE,CAAC;AAC/E,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC,KAAK,MAAM,CAAC;AA8B/G;;;;;;;;;;;;GAYG;AACH,wBAAgB,SAAS,CAAC,CAAC,SAAS,KAAK,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,UAAU,GAAE,kBAAkB,CAAC,eAAe,CAAC,CAAC,CAAC,CAAW,GAAG,CAAC,CAU7H;AAED,wBAAgB,YAAY,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,kBAAkB,CAAC,CAAC,CAAC,sBAenG;AA2BD,wBAAgB,aAAa,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,cAMlD"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/body";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/header";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/pagination";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/table";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/tbody/row/cell";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/tbody/row";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/tbody";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/tfoot/row/cell";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/tfoot/row";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/tfoot";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/thead/row/cell";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/thead/row/column";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/thead/row";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table/thead";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/components/yeti-table";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/themes/default-theme";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/utils/create-regex";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/utils/filtering-utils";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from "@triptyk/ember-yeti-table/utils/sorting-utils";
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import { action } from '@ember/object';
|
|
2
|
+
import Component from '@glimmer/component';
|
|
3
|
+
import { get, fn, hash } from '@ember/helper';
|
|
4
|
+
import TBodyRow from './tbody/row.js';
|
|
5
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
6
|
+
import { setComponentTemplate } from '@ember/component';
|
|
7
|
+
import { n } from 'decorator-transforms/runtime-esm';
|
|
8
|
+
|
|
9
|
+
class Body extends Component {
|
|
10
|
+
static {
|
|
11
|
+
setComponentTemplate(precompileTemplate("<tbody class={{@theme.tbody}} ...attributes>\n {{#if (has-block)}}\n\n {{#each @data as |rowData index|}}\n {{yield (hash row=(component TBodyRow theme=@theme onClick=@onRowClick columns=@columns)) rowData index}}\n {{/each}}\n\n {{else}}\n\n {{#each @data as |rowData|}}\n <TBodyRow @theme={{@theme}} @onClick={{if @onRowClick (fn this.handleRowClick rowData)}} @columns={{@columns}} as |row|>\n\n {{#each @columns as |column|}}\n <row.cell @class={{column.columnClass}}>\n {{#if column.prop}}\n {{get rowData column.prop}}\n {{else}}\n {{rowData}}\n {{/if}}\n </row.cell>\n {{/each}}\n </TBodyRow>\n {{/each}}\n {{/if}}\n</tbody>", {
|
|
12
|
+
strictMode: true,
|
|
13
|
+
scope: () => ({
|
|
14
|
+
hash,
|
|
15
|
+
TBodyRow,
|
|
16
|
+
fn,
|
|
17
|
+
get
|
|
18
|
+
})
|
|
19
|
+
}), this);
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* Adds a click action to each row, called with the clicked row's data as an argument.
|
|
23
|
+
* Can be used with both the blockless and block invocations.
|
|
24
|
+
*
|
|
25
|
+
* @argument onRowClick
|
|
26
|
+
* @type Function
|
|
27
|
+
*/
|
|
28
|
+
handleRowClick(rowData) {
|
|
29
|
+
this.args.onRowClick?.(rowData);
|
|
30
|
+
}
|
|
31
|
+
static {
|
|
32
|
+
n(this.prototype, "handleRowClick", [action]);
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
export { Body as default };
|
|
37
|
+
//# sourceMappingURL=body.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"body.js","sources":["../../../src/components/yeti-table/body.gjs"],"sourcesContent":["import { action } from '@ember/object';\n\nimport Component from '@glimmer/component';\n\n/**\n Renders a `<tbody>` element and yields the row component, row data and index.\n ```hbs\n <table.body as |body person index|>\n <body.row as |row|>\n <row.cell>\n {{person.firstName}} #{{index}}\n </row.cell>\n <row.cell>\n {{person.lastName}}\n </row.cell>\n <row.cell>\n {{person.points}}\n </row.cell>\n </body.row>\n </table.body>\n ```\n It can also be used as a blockless component to let yeti table automatically\n unroll thee rows for you, based on the `@prop` arguments you passed in to the\n column definition components.\n ```hbs\n <table.body/>\n ```\n Remember that this component's block will be rendered once per each item in the `@data` array.\n\n @class Body\n @yield {object} body\n @yield {Component} body.row - the row component\n @yield {Object} rowData - one item in the data array\n @yield {number} index\n*/\n\n// template imports\nimport { fn, get, hash } from '@ember/helper';\nimport TBodyRow from './tbody/row.gjs';\n\nexport default class Body extends Component {\n <template>\n <tbody class={{@theme.tbody}} ...attributes>\n {{#if (has-block)}}\n\n {{#each @data as |rowData index|}}\n {{yield\n (hash\n row=(component\n TBodyRow theme=@theme onClick=@onRowClick columns=@columns\n )\n )\n rowData\n index\n }}\n {{/each}}\n\n {{else}}\n\n {{#each @data as |rowData|}}\n <TBodyRow\n @theme={{@theme}}\n @onClick={{if @onRowClick (fn this.handleRowClick rowData)}}\n @columns={{@columns}}\n as |row|\n >\n\n {{#each @columns as |column|}}\n <row.cell @class={{column.columnClass}}>\n {{#if column.prop}}\n {{get rowData column.prop}}\n {{else}}\n {{rowData}}\n {{/if}}\n </row.cell>\n {{/each}}\n </TBodyRow>\n {{/each}}\n {{/if}}\n </tbody>\n </template>\n /**\n * Adds a click action to each row, called with the clicked row's data as an argument.\n * Can be used with both the blockless and block invocations.\n *\n * @argument onRowClick\n * @type Function\n */\n\n @action\n handleRowClick(rowData) {\n this.args.onRowClick?.(rowData);\n }\n}\n"],"names":["Body","Component","setComponentTemplate","precompileTemplate","strictMode","scope","hash","TBodyRow","fn","get","handleRowClick","rowData","args","onRowClick","n","prototype","action"],"mappings":";;;;;;;;AAwCe,MAAMA,IAAA,SAAaC,SAAA,CAAA;AAChC,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAAA,kvBAAA,EAuCA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;QAAAC,IAAA;QAAAC,QAAA;QAAAC,EAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACV;;;;;;AAMC;EAGDC,cAAAA,CAAeC,OAAO,EAAE;AACtB,IAAA,IAAI,CAACC,IAAI,CAACC,UAAU,GAAGF,OAAA,CAAA;AACzB,EAAA;AAAA,EAAA;IAAAG,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,gBAAA,EAAA,CAHCC,MAAA,CAAA,CAAA;AAAA;AAIH;;;;"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { action } from '@ember/object';
|
|
2
|
+
import Component from '@glimmer/component';
|
|
3
|
+
import Column from './thead/row/column.js';
|
|
4
|
+
import { hash } from '@ember/helper';
|
|
5
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
6
|
+
import { setComponentTemplate } from '@ember/component';
|
|
7
|
+
import { n } from 'decorator-transforms/runtime-esm';
|
|
8
|
+
|
|
9
|
+
class Header extends Component {
|
|
10
|
+
static {
|
|
11
|
+
setComponentTemplate(precompileTemplate("<thead class={{@theme.thead}} ...attributes>\n <tr class=\"{{@trClass}} {{@theme.theadRow}} {{@theme.row}}\">\n {{yield (hash column=(component THead sortable=@sortable sortSequence=@sortSequence onClick=this.onColumnClickHeader parent=@parent theme=@theme))}}\n </tr>\n</thead>", {
|
|
12
|
+
strictMode: true,
|
|
13
|
+
scope: () => ({
|
|
14
|
+
hash,
|
|
15
|
+
THead: Column
|
|
16
|
+
})
|
|
17
|
+
}), this);
|
|
18
|
+
}
|
|
19
|
+
onColumnClickHeader(column, e) {
|
|
20
|
+
if (this.args.onColumnClick && column.sortable) {
|
|
21
|
+
this.args.onColumnClick(column, e);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
static {
|
|
25
|
+
n(this.prototype, "onColumnClickHeader", [action]);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
export { Header as default };
|
|
30
|
+
//# sourceMappingURL=header.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"header.js","sources":["../../../src/components/yeti-table/header.gjs"],"sourcesContent":["import { action } from '@ember/object';\n\nimport Component from '@glimmer/component';\n\n/**\n Renders a `<thead>` element and yields the column component.\n ```hbs\n <table.header as |header|>\n <header.column @prop=\"firstName\">\n First name\n </header.column>\n <header.column @prop=\"lastName\">\n Last name\n </header.column>\n <header.column @prop=\"points\">\n Points\n </header.column>\n </table.header>\n ```\n\n @class Header\n @yield {object} header\n @yield {Component} header.column the column component\n*/\n\nimport THead from './thead/row/column.gjs';\nimport { hash } from '@ember/helper';\n\nexport default class Header extends Component {\n <template>\n <thead class={{@theme.thead}} ...attributes>\n <tr class=\"{{@trClass}} {{@theme.theadRow}} {{@theme.row}}\">\n {{yield\n (hash\n column=(component\n THead\n sortable=@sortable\n sortSequence=@sortSequence\n onClick=this.onColumnClickHeader\n parent=@parent\n theme=@theme\n )\n )\n }}\n </tr>\n </thead>\n </template>\n @action\n onColumnClickHeader(column, e) {\n if (this.args.onColumnClick && column.sortable) {\n this.args.onColumnClick(column, e);\n }\n }\n}\n"],"names":["Header","Component","setComponentTemplate","precompileTemplate","strictMode","scope","hash","THead","onColumnClickHeader","column","e","args","onColumnClick","sortable","n","prototype","action"],"mappings":";;;;;;;;AA4Be,MAAMA,MAAA,SAAeC,SAAA,CAAA;AAClC,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAAA,6RAAA,EAiBA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;QAAAC,IAAA;AAAAC,eAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AAEVC,EAAAA,mBAAAA,CAAoBC,MAAM,EAAEC,CAAC,EAAE;IAC7B,IAAI,IAAI,CAACC,IAAI,CAACC,aAAa,IAAIH,MAAA,CAAOI,QAAQ,EAAE;MAC9C,IAAI,CAACF,IAAI,CAACC,aAAa,CAACH,MAAA,EAAQC,CAAA,CAAA;AAClC,IAAA;AACF,EAAA;AAAA,EAAA;IAAAI,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,qBAAA,EAAA,CALCC,MAAA,CAAA,CAAA;AAAA;AAMH;;;;"}
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { action } from '@ember/object';
|
|
2
|
+
import { helper } from '@ember/component/helper';
|
|
3
|
+
import Component from '@glimmer/component';
|
|
4
|
+
import { localCopy } from 'tracked-toolbox';
|
|
5
|
+
import { on } from '@ember/modifier';
|
|
6
|
+
import { guidFor } from '@ember/object/internals';
|
|
7
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
8
|
+
import { setComponentTemplate } from '@ember/component';
|
|
9
|
+
import { g, i, n } from 'decorator-transforms/runtime-esm';
|
|
10
|
+
|
|
11
|
+
class Pagination extends Component {
|
|
12
|
+
guid = guidFor(this);
|
|
13
|
+
static {
|
|
14
|
+
setComponentTemplate(precompileTemplate("<div class={{@theme.pagination.controls}} ...attributes>\n {{#if this.showInfo}}\n <div class={{@theme.pagination.info}}>\n Showing\n {{@paginationData.pageStart}}\n to\n {{@paginationData.pageEnd}}\n of\n {{@paginationData.totalRows}}\n entries\n </div>\n {{/if}}\n\n {{#if this.showPageSizeSelector}}\n <div class={{@theme.pagination.pageSize}}>\n <label for=\"page-size-select-{{this.guid}}\">Rows per page:</label>\n <select id=\"page-size-select-{{this.guid}}\" disabled={{@disabled}} {{on \"change\" this.changePageSize}}>\n {{#each this.pageSizes as |pageSize|}}\n <option value={{pageSize}} selected={{this.isPaginationNumberSelected pageSize}}>{{pageSize}}</option>\n {{/each}}\n </select>\n </div>\n {{/if}}\n\n {{#if this.showButtons}}\n <button type=\"button\" class={{@theme.pagination.previous}} disabled={{this.shouldDisablePrevious}} {{on \"click\" @paginationActions.previousPage}}>\n Previous\n </button>\n\n <button type=\"button\" class={{@theme.pagination.next}} disabled={{this.shouldDisableNext}} {{on \"click\" @paginationActions.nextPage}}>\n Next\n </button>\n {{/if}}\n</div>", {
|
|
15
|
+
strictMode: true,
|
|
16
|
+
scope: () => ({
|
|
17
|
+
on
|
|
18
|
+
})
|
|
19
|
+
}), this);
|
|
20
|
+
}
|
|
21
|
+
// theme;
|
|
22
|
+
// paginationData;
|
|
23
|
+
// paginationActions;
|
|
24
|
+
// disabled;
|
|
25
|
+
// helper function used, needed while working with ember <= 4.4. Works without helper function in ember > 4.4
|
|
26
|
+
isPaginationNumberSelected = helper(([number]) => {
|
|
27
|
+
return number === this.args.paginationData.pageSize;
|
|
28
|
+
});
|
|
29
|
+
get shouldDisablePrevious() {
|
|
30
|
+
return this.args.paginationData.isFirstPage || this.args.disabled;
|
|
31
|
+
}
|
|
32
|
+
get shouldDisableNext() {
|
|
33
|
+
return this.args.paginationData.isLastPage || this.args.disabled;
|
|
34
|
+
}
|
|
35
|
+
/**
|
|
36
|
+
* Array of page sizes to populate the page size `<select>`.
|
|
37
|
+
* Particularly useful with an array helper, e.g `@pageSizes={{array 10 12 23 50 100}}`
|
|
38
|
+
* Defaults to `[10, 15, 20, 25]`.
|
|
39
|
+
*
|
|
40
|
+
* @argument pageSizes
|
|
41
|
+
* @type {Number}
|
|
42
|
+
*/
|
|
43
|
+
static {
|
|
44
|
+
g(this.prototype, "pageSizes", [localCopy('args.pageSizes', [10, 15, 20, 25])]);
|
|
45
|
+
}
|
|
46
|
+
#pageSizes = (i(this, "pageSizes"), void 0);
|
|
47
|
+
static {
|
|
48
|
+
g(this.prototype, "showInfo", [localCopy('args.showInfo', true)]);
|
|
49
|
+
}
|
|
50
|
+
#showInfo = (i(this, "showInfo"), void 0);
|
|
51
|
+
/**
|
|
52
|
+
* Used to show/hide some textual information about the current page. Defaults to `true`.
|
|
53
|
+
*
|
|
54
|
+
* @argument showInfo
|
|
55
|
+
* @type {Boolean}
|
|
56
|
+
*/
|
|
57
|
+
static {
|
|
58
|
+
g(this.prototype, "showPageSizeSelector", [localCopy('args.showPageSizeSelector', true)]);
|
|
59
|
+
}
|
|
60
|
+
#showPageSizeSelector = (i(this, "showPageSizeSelector"), void 0);
|
|
61
|
+
/**
|
|
62
|
+
* Used to show/hide the page size selector. Defaults to `true`.
|
|
63
|
+
*
|
|
64
|
+
* @argument showPageSizeSelector
|
|
65
|
+
* @type {Boolean}
|
|
66
|
+
*/
|
|
67
|
+
static {
|
|
68
|
+
g(this.prototype, "showButtons", [localCopy('args.showButtons', true)]);
|
|
69
|
+
}
|
|
70
|
+
#showButtons = (i(this, "showButtons"), void 0);
|
|
71
|
+
/**
|
|
72
|
+
* Used to show/hide the previous and next page buttons. Defaults to `true`.
|
|
73
|
+
*
|
|
74
|
+
* @argument showButtons
|
|
75
|
+
* @type {Boolean}
|
|
76
|
+
*/
|
|
77
|
+
changePageSize(ev) {
|
|
78
|
+
this.args.paginationActions.changePageSize(ev.target.value);
|
|
79
|
+
}
|
|
80
|
+
static {
|
|
81
|
+
n(this.prototype, "changePageSize", [action]);
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
export { Pagination as default };
|
|
86
|
+
//# sourceMappingURL=pagination.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"pagination.js","sources":["../../../src/components/yeti-table/pagination.gjs"],"sourcesContent":["import { action } from '@ember/object';\nimport { helper } from '@ember/component/helper';\nimport Component from '@glimmer/component';\nimport { localCopy } from 'tracked-toolbox';\n\n/**\n Simple pagination controls component that is included to help you get started quickly.\n Yeti Table yields a lot of pagination data, so you shouldn't have a problem\n creating your own pagination controls.\n\n At any rate, this component tries to be as flexible as possible. Some arguments\n are provided to customize how this component behaves.\n\n If you want to render these controls on the table footer, you probably want\n a footer row that always spans all rows. To do that you can use a `colspan` equal\n to the yielded `visibleColumns.length` number. Example:\n\n ```hbs\n <YetiTable @data={{this.data}} @pagination={{true}} as |table|>\n ...\n <table.tfoot as |foot|>\n <foot.row as |row|>\n <row.cell colspan={{table.visibleColumns.length}}>\n <table.pagination/>\n </row.cell>\n </foot.row>\n </table.tfoot>\n </YetiTable>\n ```\n\n @class Pagination\n*/\nimport { on } from '@ember/modifier';\nimport { guidFor } from '@ember/object/internals';\n\nexport default class Pagination extends Component {\n guid = guidFor(this);\n\n <template>\n <div class={{@theme.pagination.controls}} ...attributes>\n {{#if this.showInfo}}\n <div class={{@theme.pagination.info}}>\n Showing\n {{@paginationData.pageStart}}\n to\n {{@paginationData.pageEnd}}\n of\n {{@paginationData.totalRows}}\n entries\n </div>\n {{/if}}\n\n {{#if this.showPageSizeSelector}}\n <div class={{@theme.pagination.pageSize}}>\n <label for=\"page-size-select-{{this.guid}}\">Rows per page:</label>\n <select\n id=\"page-size-select-{{this.guid}}\"\n disabled={{@disabled}}\n {{on \"change\" this.changePageSize}}\n >\n {{#each this.pageSizes as |pageSize|}}\n <option\n value={{pageSize}}\n selected={{this.isPaginationNumberSelected pageSize}}\n >{{pageSize}}</option>\n {{/each}}\n </select>\n </div>\n {{/if}}\n\n {{#if this.showButtons}}\n <button\n type=\"button\"\n class={{@theme.pagination.previous}}\n disabled={{this.shouldDisablePrevious}}\n {{on \"click\" @paginationActions.previousPage}}\n >\n Previous\n </button>\n\n <button\n type=\"button\"\n class={{@theme.pagination.next}}\n disabled={{this.shouldDisableNext}}\n {{on \"click\" @paginationActions.nextPage}}\n >\n Next\n </button>\n {{/if}}\n </div>\n </template>\n // theme;\n\n // paginationData;\n\n // paginationActions;\n\n // disabled;\n\n // helper function used, needed while working with ember <= 4.4. Works without helper function in ember > 4.4\n isPaginationNumberSelected = helper(([number]) => {\n return number === this.args.paginationData.pageSize;\n });\n\n get shouldDisablePrevious() {\n return this.args.paginationData.isFirstPage || this.args.disabled;\n }\n\n get shouldDisableNext() {\n return this.args.paginationData.isLastPage || this.args.disabled;\n }\n\n /**\n * Array of page sizes to populate the page size `<select>`.\n * Particularly useful with an array helper, e.g `@pageSizes={{array 10 12 23 50 100}}`\n * Defaults to `[10, 15, 20, 25]`.\n *\n * @argument pageSizes\n * @type {Number}\n */\n @localCopy('args.pageSizes', [10, 15, 20, 25])\n pageSizes;\n\n /**\n * Used to show/hide some textual information about the current page. Defaults to `true`.\n *\n * @argument showInfo\n * @type {Boolean}\n */\n @localCopy('args.showInfo', true)\n showInfo;\n\n /**\n * Used to show/hide the page size selector. Defaults to `true`.\n *\n * @argument showPageSizeSelector\n * @type {Boolean}\n */\n @localCopy('args.showPageSizeSelector', true)\n showPageSizeSelector;\n\n /**\n * Used to show/hide the previous and next page buttons. Defaults to `true`.\n *\n * @argument showButtons\n * @type {Boolean}\n */\n @localCopy('args.showButtons', true)\n showButtons;\n\n @action\n changePageSize(ev) {\n this.args.paginationActions.changePageSize(ev.target.value);\n }\n}\n"],"names":["Pagination","Component","guid","guidFor","setComponentTemplate","precompileTemplate","strictMode","scope","on","isPaginationNumberSelected","helper","number","args","paginationData","pageSize","shouldDisablePrevious","isFirstPage","disabled","shouldDisableNext","isLastPage","g","prototype","localCopy","i","changePageSize","ev","paginationActions","target","value","n","action"],"mappings":";;;;;;;;;;AAmCe,MAAMA,UAAA,SAAmBC,SAAA,CAAA;AACtCC,EAAAA,IAAA,GAAOC,OAAA,CAAQ,IAAI,CAAA;AAEnB,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAAA,isCAAA,EAoDA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AACV;AAEA;AAEA;AAEA;AAEA;AACAC,EAAAA,0BAAA,GAA6BC,MAAA,CAAO,CAAC,CAACC,MAAA,CAAO,KAAA;IAC3C,OAAOA,WAAW,IAAI,CAACC,IAAI,CAACC,cAAc,CAACC,QAAQ;AACrD,EAAA,CAAA,CAAA;EAEA,IAAIC,qBAAAA,GAAwB;AAC1B,IAAA,OAAO,IAAI,CAACH,IAAI,CAACC,cAAc,CAACG,WAAW,IAAI,IAAI,CAACJ,IAAI,CAACK,QAAQ;AACnE,EAAA;EAEA,IAAIC,iBAAAA,GAAoB;AACtB,IAAA,OAAO,IAAI,CAACN,IAAI,CAACC,cAAc,CAACM,UAAU,IAAI,IAAI,CAACP,IAAI,CAACK,QAAQ;AAClE,EAAA;AAEA;;;;;;;;AAAA,EAAA;AAAAG,IAAAA,CAAA,MAAAC,SAAA,EAAA,WAAA,EAAA,CAQCC,UAAU,gBAAA,EAAkB,CAAC,EAAA,EAAI,EAAA,EAAI,EAAA,EAAI,EAAA,CAAG,CAAA,CAAA,CAAA;AAAA;EAAA,UAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,WAAA,CAAA,EAAA,MAAA;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,UAAA,EAAA,CAS5CC,UAAU,eAAA,EAAiB,IAAA,CAAA,CAAA,CAAA;AAAA;EAAA,SAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,UAAA,CAAA,EAAA,MAAA;AAN5B;;;;;;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,sBAAA,EAAA,CAeCC,UAAU,2BAAA,EAA6B,IAAA,CAAA,CAAA,CAAA;AAAA;EAAA,qBAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,sBAAA,CAAA,EAAA,MAAA;AANxC;;;;;;AAAA,EAAA;IAAAH,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,aAAA,EAAA,CAeCC,UAAU,kBAAA,EAAoB,IAAA,CAAA,CAAA,CAAA;AAAA;EAAA,YAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,aAAA,CAAA,EAAA,MAAA;AAN/B;;;;;;EAUAC,cAAAA,CAAeC,EAAE,EAAE;AACjB,IAAA,IAAI,CAACb,IAAI,CAACc,iBAAiB,CAACF,cAAc,CAACC,EAAA,CAAGE,MAAM,CAACC,KAAK,CAAA;AAC5D,EAAA;AAAA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAR,SAAA,EAAA,gBAAA,EAAA,CAHCS,MAAA,CAAA,CAAA;AAAA;AAIH;;;;"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
2
|
+
import { setComponentTemplate } from '@ember/component';
|
|
3
|
+
import templateOnly from '@ember/component/template-only';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
A simple component that just renders the `<table>` element with the correct
|
|
7
|
+
theme classes.
|
|
8
|
+
|
|
9
|
+
This component should only be needed when using `@renderTableElement={{false}}` to render
|
|
10
|
+
the table element yourself. Please refer to the `@renderTableElement` documentation for
|
|
11
|
+
more information.
|
|
12
|
+
|
|
13
|
+
Example:
|
|
14
|
+
|
|
15
|
+
```hbs
|
|
16
|
+
<YetiTable @data={{this.data}} @pagination={{true}} @renderTableElement={{false}} as |t|>
|
|
17
|
+
|
|
18
|
+
<t.table> {{!-- we render the given table component ourselves --}}
|
|
19
|
+
<t.header as |header|>
|
|
20
|
+
...
|
|
21
|
+
</t.header>
|
|
22
|
+
|
|
23
|
+
<t.body/>
|
|
24
|
+
</t.table>
|
|
25
|
+
|
|
26
|
+
<t.pagination/> {{!-- pagination controls outside the <table> element --}}
|
|
27
|
+
|
|
28
|
+
</YetiTable>
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
@class Table
|
|
32
|
+
*/
|
|
33
|
+
var Table = setComponentTemplate(precompileTemplate("<table class={{@theme.table}} ...attributes>\n {{yield}}\n</table>", {
|
|
34
|
+
strictMode: true
|
|
35
|
+
}), templateOnly());
|
|
36
|
+
|
|
37
|
+
export { Table as default };
|
|
38
|
+
//# sourceMappingURL=table.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"table.js","sources":["../../../src/components/yeti-table/table.gjs"],"sourcesContent":["/**\n A simple component that just renders the `<table>` element with the correct\n theme classes.\n\n This component should only be needed when using `@renderTableElement={{false}}` to render\n the table element yourself. Please refer to the `@renderTableElement` documentation for\n more information.\n\n Example:\n\n ```hbs\n <YetiTable @data={{this.data}} @pagination={{true}} @renderTableElement={{false}} as |t|>\n\n <t.table> {{!-- we render the given table component ourselves --}}\n <t.header as |header|>\n ...\n </t.header>\n\n <t.body/>\n </t.table>\n\n <t.pagination/> {{!-- pagination controls outside the <table> element --}}\n\n </YetiTable>\n ```\n\n @class Table\n*/\n\n<template>\n <table class={{@theme.table}} ...attributes>\n {{yield}}\n </table>\n</template>\n"],"names":["setComponentTemplate","precompileTemplate","strictMode","templateOnly"],"mappings":";;;;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA;AAEA,YAAAA,oBAAA,CAAAC,kBAAA,CAAA,qEAAA,EAIA;EAAAC,UAAA,EAAA;AAAU,CAAA,CAAA,EAAAC,YAAA,EAAA,CAAA;;;;"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import Component from '@glimmer/component';
|
|
2
|
+
import { tracked } from '@glimmer/tracking';
|
|
3
|
+
import { hash } from '@ember/helper';
|
|
4
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
5
|
+
import { setComponentTemplate } from '@ember/component';
|
|
6
|
+
import { g, i } from 'decorator-transforms/runtime-esm';
|
|
7
|
+
|
|
8
|
+
class TBodyCell extends Component {
|
|
9
|
+
static {
|
|
10
|
+
setComponentTemplate(precompileTemplate("{{#if this.column.visible}}\n <td class=\"{{@class}} {{this.column.columnClass}} {{@theme.tbodyCell}}\" ...attributes>\n {{yield (hash prop=this.column.prop)}}\n </td>\n{{/if}}", {
|
|
11
|
+
strictMode: true,
|
|
12
|
+
scope: () => ({
|
|
13
|
+
hash
|
|
14
|
+
})
|
|
15
|
+
}), this);
|
|
16
|
+
}
|
|
17
|
+
static {
|
|
18
|
+
g(this.prototype, "index", [tracked]);
|
|
19
|
+
}
|
|
20
|
+
#index = (i(this, "index"), void 0);
|
|
21
|
+
get column() {
|
|
22
|
+
return this.args.columns[this.index] || {};
|
|
23
|
+
}
|
|
24
|
+
constructor() {
|
|
25
|
+
super(...arguments);
|
|
26
|
+
this.index = this.args.parent?.registerCell(this);
|
|
27
|
+
}
|
|
28
|
+
willDestroy() {
|
|
29
|
+
super.willDestroy(...arguments);
|
|
30
|
+
this.args.parent?.unregisterCell(this);
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
export { TBodyCell as default };
|
|
35
|
+
//# sourceMappingURL=cell.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cell.js","sources":["../../../../../src/components/yeti-table/tbody/row/cell.gjs"],"sourcesContent":["import Component from '@glimmer/component';\nimport { tracked } from '@glimmer/tracking';\n\n/**\n @class TBodyCell\n\n Renders a `<td>` element (if its corresponding column definition has `@visible={{true}}`).\n ```hbs\n <row.cell>\n {{person.firstName}}\n </row.cell>\n\n If the prop name was used when the column header was defined, it is yielded in a hash\n ```hbs\n <row.cell as |column|>\n {{get person column.prop}}\n </row.cell>\n ```\n*/\n\nimport { hash } from '@ember/helper';\n\nexport default class TBodyCell extends Component {\n <template>\n {{#if this.column.visible}}\n <td\n class=\"{{@class}} {{this.column.columnClass}} {{@theme.tbodyCell}}\"\n ...attributes\n >\n {{yield (hash prop=this.column.prop)}}\n </td>\n {{/if}}\n </template>\n\n @tracked\n index;\n\n get column() {\n return this.args.columns[this.index] || {};\n }\n\n constructor() {\n super(...arguments);\n this.index = this.args.parent?.registerCell(this);\n }\n\n willDestroy() {\n super.willDestroy(...arguments);\n this.args.parent?.unregisterCell(this);\n }\n}\n"],"names":["TBodyCell","Component","setComponentTemplate","precompileTemplate","strictMode","scope","hash","g","prototype","tracked","i","column","args","columns","index","constructor","arguments","parent","registerCell","willDestroy","unregisterCell"],"mappings":";;;;;;;AAsBe,MAAMA,SAAA,SAAkBC,SAAA,CAAA;AACrC,EAAA;IAAAC,oBAAA,CAAAC,kBAAA,CAAA,uLAAA,EASA;MAAAC,UAAA,EAAA,IAAA;AAAAC,MAAAA,KAAA,EAAAA,OAAA;AAAAC,QAAAA;AAAA,OAAA;KAAU,CAAA,EAAV,IAAW,CAAA;AAAD;AATA,EAAA;IAAAC,CAAA,CAAA,IAAA,CAAAC,SAAA,EAAA,OAAA,EAAA,CAWTC,OAAA,CAAA,CAAA;AAAA;EAAA,MAAA,IAAAC,CAAA,CAAA,IAAA,EAAA,OAAA,CAAA,EAAA,MAAA;EAGD,IAAIC,MAAAA,GAAS;AACX,IAAA,OAAO,IAAI,CAACC,IAAI,CAACC,OAAO,CAAC,IAAI,CAACC,KAAK,CAAC,IAAI,EAAC;AAC3C,EAAA;AAEAC,EAAAA,WAAAA,GAAc;IACZ,KAAK,CAAA,GAAIC,SAAA,CAAA;AACT,IAAA,IAAI,CAACF,KAAK,GAAG,IAAI,CAACF,IAAI,CAACK,MAAM,EAAEC,YAAA,CAAa,IAAI,CAAA;AAClD,EAAA;AAEAC,EAAAA,WAAAA,GAAc;AACZ,IAAA,KAAK,CAACA,WAAA,CAAA,GAAeH,SAAA,CAAA;IACrB,IAAI,CAACJ,IAAI,CAACK,MAAM,EAAEG,eAAe,IAAI,CAAA;AACvC,EAAA;AACF;;;;"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { action } from '@ember/object';
|
|
2
|
+
import Component from '@glimmer/component';
|
|
3
|
+
import { hash } from '@ember/helper';
|
|
4
|
+
import { on } from '@ember/modifier';
|
|
5
|
+
import TBodyCell from './row/cell.js';
|
|
6
|
+
import { precompileTemplate } from '@ember/template-compilation';
|
|
7
|
+
import { setComponentTemplate } from '@ember/component';
|
|
8
|
+
import { n } from 'decorator-transforms/runtime-esm';
|
|
9
|
+
|
|
10
|
+
class TBodyRow extends Component {
|
|
11
|
+
static {
|
|
12
|
+
setComponentTemplate(precompileTemplate("{{!-- template-lint-disable no-invalid-interactive --}}\n<tr class=\"{{@theme.tbodyRow}} {{@theme.row}}\" {{on \"click\" this.handleClick}} role={{if @onClick \"button\"}} ...attributes>\n {{yield (hash cell=(component Cell theme=@theme parent=this columns=@columns))}}\n</tr>", {
|
|
13
|
+
strictMode: true,
|
|
14
|
+
scope: () => ({
|
|
15
|
+
on,
|
|
16
|
+
hash,
|
|
17
|
+
Cell: TBodyCell
|
|
18
|
+
})
|
|
19
|
+
}), this);
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* Adds a click action to the row.
|
|
23
|
+
*
|
|
24
|
+
* @argument onClick
|
|
25
|
+
* @type Function
|
|
26
|
+
*/
|
|
27
|
+
cells = [];
|
|
28
|
+
registerCell(cell) {
|
|
29
|
+
let index = this.cells.length;
|
|
30
|
+
this.cells.push(cell);
|
|
31
|
+
return index;
|
|
32
|
+
}
|
|
33
|
+
unregisterCell(cell) {
|
|
34
|
+
let cells = this.cells;
|
|
35
|
+
let index = cells.indexOf(cell);
|
|
36
|
+
cells.splice(index, 1);
|
|
37
|
+
}
|
|
38
|
+
handleClick() {
|
|
39
|
+
this.args.onClick?.(...arguments);
|
|
40
|
+
}
|
|
41
|
+
static {
|
|
42
|
+
n(this.prototype, "handleClick", [action]);
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
export { TBodyRow as default };
|
|
47
|
+
//# sourceMappingURL=row.js.map
|