@@ -102,31 +102,32 @@ function is as follows:
102
102
103
103
` DataItem : Record <string , unknown > | unknown []`
104
104
105
- ` ` ` ts
106
- const data = [
107
- {
108
- name: " Deno" ,
109
- repo: { org: " denoland" , name: " deno" },
110
- runsOn: [" Rust" , " TypeScript" ],
111
- },
112
- ];
113
- ` ` `
105
+ ` ` ` ts
106
+ const data = [
107
+ {
108
+ name: " Deno" ,
109
+ repo: { org: " denoland" , name: " deno" },
110
+ runsOn: [" Rust" , " TypeScript" ],
111
+ },
112
+ ];
113
+ ` ` `
114
114
115
115
- ** ` columns ` ** is a list of instructions for how to target and transform the
116
116
data for each column of output. This is also where you can provide an explicit
117
117
header name for the column.
118
118
119
119
` Column ` :
120
+
120
121
- The most essential aspect of a column is accessing the property holding the
121
122
data for that column on each object in the data array. If that member is at
122
123
the top level, ` Column ` can simply be a property accessor, which is either a
123
124
` string ` (if it's a plain object) or a ` number ` (if it's an array).
124
125
125
- ` ` ` ts
126
- const columns = [
127
- " name" ,
128
- ];
129
- ` ` `
126
+ ` ` ` ts
127
+ const columns = [
128
+ " name" ,
129
+ ];
130
+ ` ` `
130
131
131
132
Each property accessor will be used as the header for the column:
132
133
@@ -138,12 +139,12 @@ function is as follows:
138
139
objects/arrays), then a simple property accessor won't work, so an array of
139
140
them will be required.
140
141
141
- ` ` ` ts
142
- const columns = [
143
- [" repo" , " name" ],
144
- [" repo" , " org" ],
145
- ];
146
- ` ` `
142
+ ` ` ` ts
143
+ const columns = [
144
+ [" repo" , " name" ],
145
+ [" repo" , " org" ],
146
+ ];
147
+ ` ` `
147
148
148
149
When using arrays of property accessors, the header names inherit the value
149
150
of the last accessor in each array:
@@ -158,27 +159,29 @@ function is as follows:
158
159
159
160
- ** ` fn ?: (value : any ) => string | Promise <string >` ** is an optional
160
161
function to transform the targeted data into the desired format
162
+
161
163
- ** ` header ?: string ` ** is the optional value to use for the column header
162
164
name
165
+
163
166
- ** ` prop : PropertyAccessor | PropertyAccessor []` ** is the property accessor
164
167
( ` string ` or ` number ` ) or array of property accessors used to access the
165
168
data on each object
166
169
167
- ` ` ` ts
168
- const columns = [
169
- " name" ,
170
- {
171
- prop: [" runsOn" , 0 ],
172
- header: " language 1" ,
173
- fn : (str : string ) => str .toLowerCase (),
174
- },
175
- {
176
- prop: [" runsOn" , 1 ],
177
- header: " language 2" ,
178
- fn : (str : string ) => str .toLowerCase (),
179
- },
180
- ];
181
- ```
170
+ ` ` ` ts
171
+ const columns = [
172
+ " name" ,
173
+ {
174
+ prop: [" runsOn" , 0 ],
175
+ header: " language 1" ,
176
+ fn : (str : string ) => str .toLowerCase (),
177
+ },
178
+ {
179
+ prop: [" runsOn" , 1 ],
180
+ header: " language 2" ,
181
+ fn : (str : string ) => str .toLowerCase (),
182
+ },
183
+ ];
184
+ ```
182
185
183
186
| name | language 1 | language 2 |
184
187
| :-- : | :-------- : | :-------- : |
0 commit comments