ep_data_tables 0.0.7 → 0.0.9

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 (3) hide show
  1. package/package.json +1 -1
  2. package/static/css/datatables-editor.css +69 -108
  3. package/static/js/client_hooks.js +1096 -977
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ep_data_tables",
3
- "version": "0.0.7",
3
+ "version": "0.0.9",
4
4
  "description": "BETA - etherpad tables plugin, compatible with other character/line based styling and other features",
5
5
  "author": {
6
6
  "name": "DCastelone",
package/static/css/datatables-editor.css CHANGED
@@ -1,167 +1,128 @@
1
- /*
2
- * CSS rules specifically for styling tables within the Etherpad editor iframe.
3
- */
4
-
5
- /* Prevent default background highlight on the TD itself if an author class is present */
6
1
  .dataTable td[class*="author-"] {
7
- background-color: transparent !important;
8
- border: 1px solid transparent; /* Maintain border for consistency if needed */
2
+ background-color: transparent !important;
3
+ border: 1px solid transparent;
9
4
  }
10
5
 
11
- /* Ensure the author span (added by acePostWriteDomLineHTML) displays correctly */
12
6
  .dataTable td span[data-author-span="true"] {
13
- display: inline;
14
- text-decoration: none !important; /* Remove potential underlines */
15
- /* Text color should ideally be inherited or applied dynamically if Etherpad supports it,
16
- otherwise, it might need to be handled explicitly in acePostWriteDomLineHTML if this CSS isn't sufficient.
17
- The aceSetAuthorStyle hook returning true aims to stop the default background color,
18
- allowing text color styling (potentially handled by core etherpad based on author class) to take precedence. */
7
+ display: inline;
8
+ text-decoration: none !important;
19
9
  }
20
10
 
21
- /* NEW STYLES FOR ATTRIBUTE-BASED TABLES */
22
-
23
- /* Applied directly to the rendered table */
24
11
  .dataTable {
25
- width: 100%; /* Ensure table takes full width */
26
- border-collapse: collapse; /* Collapse borders */
27
- table-layout: fixed; /* Ensure equal column widths unless specified */
28
- /* margin-bottom: 1px; */ /* REMOVED - Likely caused gaps between rows */
29
- border: 1px solid black; /* Apply border to the table itself */
30
- border-top: none; /* REMOVE top border to prevent double lines between rows */
12
+ width: 100%;
13
+ border-collapse: collapse;
14
+ table-layout: fixed;
15
+ border: 1px solid black;
16
+ border-top: none;
31
17
  }
32
18
 
33
- /* Restore top border ONLY for the first table row in a block */
34
19
  .dataTable.dataTable-first-row {
35
- border-top: 1px solid black;
20
+ border-top: 1px solid black;
36
21
  }
37
22
 
38
- /* Style the table rows */
23
+
39
24
  .dataTable tr {
40
- height: 36px; /* Set fixed row height */
41
- min-height: 36px; /* Ensure minimum row height */
25
+ height: 36px;
26
+ min-height: 36px;
42
27
  }
43
28
 
44
29
  .dataTable td {
45
- /* border: 1px solid black !important; */ /* REMOVED - Moved to .dataTable */
46
- /* min-height: 36px; */ /* REMOVED - Moved to .dataTable tr */
47
- vertical-align: top; /* Align content to top */
48
- word-wrap: break-word; /* Wrap long words */
49
- /* Padding will be kept inline via JS for now */
50
- /* Add internal cell borders if desired (looks better with collapsed borders) */
51
- border-left: 1px solid black;
52
- border-right: 1px solid black;
30
+ vertical-align: top;
31
+ white-space: normal;
32
+ word-break: break-word;
33
+ overflow-wrap: anywhere;
34
+ border-left: 1px solid black;
35
+ border-right: 1px solid black;
36
+ }
37
+
38
+ .dataTable td * {
39
+ white-space: inherit;
40
+ word-break: inherit;
41
+ overflow-wrap: inherit;
53
42
  }
54
43
 
55
- /* Remove outer border from first/last cells if table border is set */
56
44
  .dataTable td:first-child {
57
- border-left: none;
45
+ border-left: none;
58
46
  }
59
47
  .dataTable td:last-child {
60
- border-right: none;
48
+ border-right: none;
61
49
  }
62
50
 
63
- /* Style the line DIV as a table row */
64
- /* Commenting out previous attempt as block/inline-block above is simpler for now
65
- .ep-table-row {
66
- display: table-row !important;
67
- width: 100%;
68
- }
69
- */
70
-
71
- /* Style the cell wrapper spans as table cells */
72
- /* Commenting out previous attempt
73
- .ep-table-cell {
74
- display: table-cell !important;
75
- padding: 2px 4px;
76
- border: 1px solid #ccc;
77
- vertical-align: inherit;
78
- height: auto;
79
- }
80
- */
81
51
 
82
- /* Ensure delimiters themselves are not visible */
83
52
  .table-cell-delimiter {
84
- display: none !important;
53
+ display: none !important;
85
54
  }
86
55
 
87
56
  .ep-table-row-line > .list-bullet,
88
57
  .list-table-row > .list-bullet {
89
- display: none !important;
58
+ display: none !important;
90
59
  }
91
60
 
92
- /* Hide the injected delimiter span */
93
61
  .ep-data_tables-delim {
94
- font-size:0;
95
- line-height:0;
96
- color:transparent;
97
- pointer-events:none;
98
- user-select:none;
99
- caret-color:transparent;
62
+ font-size:0;
63
+ line-height:0;
64
+ color:transparent;
65
+ pointer-events:none;
66
+ user-select:none;
67
+ caret-color:transparent;
100
68
  }
101
69
 
102
- /* NEW: Column resize handle styles */
103
70
  .ep-data_tables-resize-handle {
104
- position: absolute;
105
- top: 0;
106
- right: -2px;
107
- width: 4px;
108
- height: 100%;
109
- cursor: col-resize;
110
- background: transparent;
111
- z-index: 10;
112
- opacity: 0;
113
- transition: opacity 0.2s ease;
71
+ position: absolute;
72
+ top: 0;
73
+ right: -2px;
74
+ width: 4px;
75
+ height: 100%;
76
+ cursor: col-resize;
77
+ background: transparent;
78
+ z-index: 10;
79
+ opacity: 0;
80
+ transition: opacity 0.2s ease;
114
81
  }
115
82
 
116
83
 
117
-
118
- /* Show resize handles on hover */
119
84
  .dataTable tr:first-child td:hover .ep-data_tables-resize-handle,
120
85
  .dataTable tr:first-child .ep-data_tables-resize-handle:hover {
121
- opacity: 0.3;
122
- background: #007cff;
86
+ opacity: 0.3;
87
+ background: #007cff;
123
88
  }
124
89
 
125
- /* Visual feedback during resize */
126
90
  .dataTable.ep-data_tables-resizing {
127
- user-select: none;
128
- -webkit-user-select: none;
129
- -moz-user-select: none;
130
- -ms-user-select: none;
131
- pointer-events: none; /* Prevent other interactions during resize */
91
+ user-select: none;
92
+ -webkit-user-select: none;
93
+ -moz-user-select: none;
94
+ -ms-user-select: none;
95
+ pointer-events: none;
132
96
  }
133
97
 
134
98
  .dataTable.ep-data_tables-resizing td {
135
- transition: none !important;
136
- pointer-events: none; /* Prevent cell interactions during resize */
99
+ transition: none !important;
100
+ pointer-events: none;
137
101
  }
138
102
 
139
103
  .dataTable.ep-data_tables-resizing .ep-data_tables-resize-handle {
140
- opacity: 0.7 !important;
141
- background: #007cff !important;
142
- pointer-events: auto; /* Keep resize handle interactive */
104
+ opacity: 0.7 !important;
105
+ background: #007cff !important;
106
+ pointer-events: auto;
143
107
  }
144
108
 
145
- /* Improve resize handle visibility on first row */
146
109
  .dataTable.dataTable-first-row tr:first-child td {
147
- position: relative;
110
+ position: relative;
148
111
  }
149
112
 
150
- /* Ensure resize handles don't interfere with text selection */
151
113
  .ep-data_tables-resize-handle:hover {
152
- background: #007cff !important;
153
- opacity: 0.5 !important;
114
+ background: #007cff !important;
115
+ opacity: 0.5 !important;
154
116
  }
155
117
 
156
- /* Add a visual indicator during resize */
157
118
  .dataTable.ep-data_tables-resizing::after {
158
- content: '';
159
- position: absolute;
160
- top: 0;
161
- left: 0;
162
- right: 0;
163
- bottom: 0;
164
- background: rgba(0, 124, 255, 0.05);
165
- pointer-events: none;
166
- z-index: 5;
119
+ content: '';
120
+ position: absolute;
121
+ top: 0;
122
+ left: 0;
123
+ right: 0;
124
+ bottom: 0;
125
+ background: rgba(0, 124, 255, 0.05);
126
+ pointer-events: none;
127
+ z-index: 5;
167
128
  }