Skip to content

Commit 4330dd0

Browse files
authored
Merge pull request #127 from mbektasbbg/datagrid_widget
non-jupyter FeatherGrid usable as standalone grid or jupyter widget
2 parents 3e778e7 + 39e0ef4 commit 4330dd0

24 files changed

+1633
-830
lines changed

css/datagrid.css

Lines changed: 0 additions & 58 deletions
This file was deleted.

package-lock.json

Lines changed: 38 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
"files": [
1212
"lib/**/*.js",
1313
"dist/*.js",
14-
"css/*.css"
14+
"style/**/*.*"
1515
],
1616
"homepage": "https://github.com/QuantStack/ipydatagrid",
1717
"bugs": {
@@ -33,7 +33,8 @@
3333
"build:labextension": "npm run clean:labextension && mkdirp datagrid/labextension && cd datagrid/labextension && npm pack ../..",
3434
"build:lib": "tsc",
3535
"build:nbextension": "webpack -p",
36-
"build:all": "npm run build:labextension && npm run build:nbextension",
36+
"build:widget-examples": "cd widget-examples/basic && webpack -p",
37+
"build:all": "npm run build:labextension && npm run build:nbextension && npm run build:widget-examples",
3738
"clean": "npm run clean:lib && npm run clean:nbextension",
3839
"clean:lib": "rimraf lib",
3940
"clean:labextension": "rimraf datagrid/labextension",
@@ -92,7 +93,8 @@
9293
"ts-loader": "^6.0.4",
9394
"typescript": "~3.6.4",
9495
"webpack": "^4.20.2",
95-
"webpack-cli": "^3.1.2"
96+
"webpack-cli": "^3.1.2",
97+
"svg-url-loader": "~3.0.3"
9698
},
9799
"jupyterlab": {
98100
"extension": "lib/plugin"

src/core/filterMenu.ts

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -423,7 +423,7 @@ export class InteractiveFilterDialog extends BoxPanel {
423423
{
424424
className: '', style: {
425425
paddingLeft: '5px',
426-
color: 'var(--jp-ui-font-color0,black)'
426+
color: 'var(--ipydatagrid-filter-dlg-textcolor,black)'
427427
}
428428
},
429429
(this._mode === 'condition')
@@ -446,7 +446,7 @@ export class InteractiveFilterDialog extends BoxPanel {
446446
style: {
447447
marginRight: '5px',
448448
width: '200px',
449-
background: 'var(--jp-layout-color0,black)',
449+
background: 'var(--ipydatagrid-filter-dlg-bgcolor,white)',
450450
visibility: (
451451
this._filterOperator === 'empty'
452452
|| this._filterOperator === 'notempty'
@@ -481,7 +481,7 @@ export class InteractiveFilterDialog extends BoxPanel {
481481
style: {
482482
width: '60px',
483483
padding: '1px',
484-
border: '1px solid var(--jp-border-color0, #bdbdbd)'
484+
border: '1px solid var(--ipydatagrid-menu-border-color, #bdbdbd)'
485485
},
486486
onclick: this.applyFilter.bind(this)
487487
}, 'Apply')
@@ -502,14 +502,14 @@ export class InteractiveFilterDialog extends BoxPanel {
502502
{
503503
className: 'widget-text', style: {
504504
paddingLeft: '5px',
505-
color: 'var(--jp-ui-font-color0,black)',
505+
color: 'var(--ipydatagrid-filter-dlg-textcolor,black)',
506506
}
507507
},
508508
h.input({
509509
style: {
510510
marginRight: '5px',
511511
width: '75px',
512-
background: 'var(--jp-layout-color0,black)'
512+
background: 'var(--ipydatagrid-filter-dlg-bgcolor,white)'
513513
},
514514
// Assigning a random key ensures that this element is always
515515
// rerendered
@@ -533,7 +533,7 @@ export class InteractiveFilterDialog extends BoxPanel {
533533
style: {
534534
marginRight: '5px',
535535
width: '75px',
536-
background: 'var(--jp-layout-color0,black)'
536+
background: 'var(--ipydatagrid-filter-dlg-bgcolor,white)'
537537
},
538538
// Assigning a random key ensures that this element is always
539539
// rerendered
@@ -559,7 +559,7 @@ export class InteractiveFilterDialog extends BoxPanel {
559559
style: {
560560
width: '60px',
561561
padding: '1px',
562-
border: '1px solid var(--jp-border-color0, #bdbdbd)'
562+
border: '1px solid var(--ipydatagrid-menu-border-color, #bdbdbd)'
563563
},
564564
onclick: this.applyFilter.bind(this)
565565
}, 'Apply')
@@ -603,7 +603,7 @@ export class InteractiveFilterDialog extends BoxPanel {
603603
width: '200px',
604604
height: '200px',
605605
margin: '5px',
606-
background: 'var(--jp-layout-color0,white)'
606+
background: 'var(--ipydatagrid-filter-dlg-bgcolor,white)'
607607
},
608608
onchange: (evt) => {
609609
let selectElem = <HTMLSelectElement>evt.srcElement;
@@ -652,7 +652,7 @@ export class InteractiveFilterDialog extends BoxPanel {
652652
style: {
653653
width: '200px',
654654
fontSize: '12px',
655-
background: 'var(--jp-layout-color0,black)'
655+
background: 'var(--ipydatagrid-filter-dlg-bgcolor,white)'
656656
},
657657
// Assigning a random key ensures that this element is always
658658
// rerendered
@@ -686,7 +686,7 @@ export class InteractiveFilterDialog extends BoxPanel {
686686
className: 'jupyter-widgets jupyter-button widget-button',
687687
style: {
688688
width: '60px',
689-
border: '1px solid var(--jp-border-color0, #bdbdbd)'
689+
border: '1px solid var(--ipydatagrid-menu-border-color, #bdbdbd)'
690690
},
691691
onclick: this.applyFilter.bind(this)
692692
}, 'Apply')

src/core/gridContextMenu.ts

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ namespace GridContextMenu {
8686
* This is primarily here for demo purposes to demonstrate how we may want to
8787
* manage context menus.
8888
*/
89-
export class IPyDataGridContextMenu extends GridContextMenu {
89+
export class FeatherGridContextMenu extends GridContextMenu {
9090
/**
9191
* Opens the context menu in reponse to the `cellClick` signal of the
9292
* data grid.
@@ -100,7 +100,7 @@ export class IPyDataGridContextMenu extends GridContextMenu {
100100
this._menu.clearItems();
101101

102102
// Create the args that will be provided to the commands' .execute() method
103-
const args: IPyDataGridContextMenu.CommandArgs = {
103+
const args: FeatherGridContextMenu.CommandArgs = {
104104
region: hit.region as DataModel.CellRegion,
105105
rowIndex: hit.row,
106106
columnIndex: hit.column,
@@ -112,59 +112,59 @@ export class IPyDataGridContextMenu extends GridContextMenu {
112112
switch (hit.region) {
113113
case 'column-header':
114114
this._menu.addItem({
115-
command: IPyDataGridContextMenu.CommandID.SortAscending,
115+
command: FeatherGridContextMenu.CommandID.SortAscending,
116116
args: args
117117
});
118118
this._menu.addItem({
119-
command: IPyDataGridContextMenu.CommandID.SortDescending,
119+
command: FeatherGridContextMenu.CommandID.SortDescending,
120120
args: args
121121
});
122122
this._menu.addItem({
123-
command: IPyDataGridContextMenu.CommandID.OpenFilterByConditionDialog,
123+
command: FeatherGridContextMenu.CommandID.OpenFilterByConditionDialog,
124124
args: args
125125
});
126126
this._menu.addItem({
127-
command: IPyDataGridContextMenu.CommandID.OpenFilterByValueDialog,
127+
command: FeatherGridContextMenu.CommandID.OpenFilterByValueDialog,
128128
args: args
129129
});
130130
this._menu.addItem({
131-
command: IPyDataGridContextMenu.CommandID.ClearThisFilter,
131+
command: FeatherGridContextMenu.CommandID.ClearThisFilter,
132132
args: args
133133
});
134134
this._menu.addItem({
135-
command: IPyDataGridContextMenu.CommandID.ClearFiltersInAllColumns,
135+
command: FeatherGridContextMenu.CommandID.ClearFiltersInAllColumns,
136136
args: args
137137
});
138138
break;
139139
case 'corner-header':
140140
this._menu.addItem({
141-
command: IPyDataGridContextMenu.CommandID.SortAscending,
141+
command: FeatherGridContextMenu.CommandID.SortAscending,
142142
args: args
143143
});
144144
this._menu.addItem({
145-
command: IPyDataGridContextMenu.CommandID.SortDescending,
145+
command: FeatherGridContextMenu.CommandID.SortDescending,
146146
args: args
147147
});
148148
this._menu.addItem({
149-
command: IPyDataGridContextMenu.CommandID.OpenFilterByConditionDialog,
149+
command: FeatherGridContextMenu.CommandID.OpenFilterByConditionDialog,
150150
args: args
151151
});
152152
this._menu.addItem({
153-
command: IPyDataGridContextMenu.CommandID.OpenFilterByValueDialog,
153+
command: FeatherGridContextMenu.CommandID.OpenFilterByValueDialog,
154154
args: args
155155
});
156156
this._menu.addItem({
157-
command: IPyDataGridContextMenu.CommandID.ClearThisFilter,
157+
command: FeatherGridContextMenu.CommandID.ClearThisFilter,
158158
args: args
159159
});
160160
this._menu.addItem({
161-
command: IPyDataGridContextMenu.CommandID.ClearFiltersInAllColumns,
161+
command: FeatherGridContextMenu.CommandID.ClearFiltersInAllColumns,
162162
args: args
163163
});
164164
break;
165165
case 'body':
166166
this._menu.addItem({
167-
command: IPyDataGridContextMenu.CommandID.RevertGrid,
167+
command: FeatherGridContextMenu.CommandID.RevertGrid,
168168
args: args
169169
});
170170
break;
@@ -180,7 +180,7 @@ export class IPyDataGridContextMenu extends GridContextMenu {
180180
/**
181181
* The namespace for the `IPyDataGridContextMenu` class statics.
182182
*/
183-
export namespace IPyDataGridContextMenu {
183+
export namespace FeatherGridContextMenu {
184184

185185
/**
186186
* An options object for initializing a context menu.

src/core/viewbasedjsonmodel.ts

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -217,6 +217,45 @@ export class ViewBasedJSONModel extends MutableDataModel {
217217
return true;
218218
}
219219

220+
public columnNameToIndex(name: string): number {
221+
const schema = this.dataset.schema;
222+
const primaryKeysLength = schema.primaryKey.length - 1;
223+
224+
let index = -1;
225+
226+
if (schema.primaryKey.includes(name)) {
227+
index = schema.primaryKey.indexOf(name);
228+
} else {
229+
const fields = schema.fields;
230+
231+
fields.forEach((value, i) => {
232+
if (value.name == name) {
233+
index = i - primaryKeysLength;
234+
}
235+
})
236+
}
237+
return index;
238+
}
239+
240+
public columnIndexToName(index: number, region: DataModel.CellRegion): string {
241+
let schema = this.dataset.schema;
242+
if (region == 'row-header') {
243+
return schema.primaryKey[index];
244+
} else {
245+
return schema.fields[schema.primaryKey.length + index - 1].name;
246+
}
247+
}
248+
249+
public columnNameToRegion(name: string): DataModel.ColumnRegion {
250+
let schema = this.dataset.schema;
251+
252+
if (schema.primaryKey.includes(name)) {
253+
return 'row-header';
254+
} else {
255+
return 'body';
256+
}
257+
}
258+
220259
/**
221260
* Get the current View for the model.
222261
*/

0 commit comments

Comments
 (0)