solid-panes 4.4.0 → 4.4.1-test.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.
Files changed (75) hide show
  1. package/README.md +4 -2
  2. package/dist/RDFXMLPane.css +70 -0
  3. package/dist/RDFXMLPane.d.ts +13 -0
  4. package/dist/RDFXMLPane.d.ts.map +1 -0
  5. package/dist/RDFXMLPane.js +46 -5
  6. package/dist/dataContentPane.css +271 -0
  7. package/dist/dataContentPane.d.ts +14 -0
  8. package/dist/dataContentPane.d.ts.map +1 -0
  9. package/dist/dataContentPane.js +68 -101
  10. package/dist/defaultPane.css +97 -0
  11. package/dist/defaultPane.d.ts +14 -0
  12. package/dist/defaultPane.d.ts.map +1 -0
  13. package/dist/defaultPane.js +9 -2
  14. package/dist/form/formPane.css +120 -0
  15. package/dist/form/pane.d.ts +4 -0
  16. package/dist/form/pane.d.ts.map +1 -0
  17. package/dist/form/pane.js +120 -54
  18. package/dist/humanReadablePane.css +129 -0
  19. package/dist/humanReadablePane.d.ts +13 -0
  20. package/dist/humanReadablePane.d.ts.map +1 -0
  21. package/dist/humanReadablePane.js +29 -18
  22. package/dist/icons/signUp.svg +9 -0
  23. package/dist/imagePane.css +4 -0
  24. package/dist/imagePane.d.ts +12 -0
  25. package/dist/imagePane.d.ts.map +1 -0
  26. package/dist/imagePane.js +19 -21
  27. package/dist/internal/internalPane.css +14 -0
  28. package/dist/internal/internalPane.d.ts +1 -0
  29. package/dist/internal/internalPane.d.ts.map +1 -1
  30. package/dist/internal/internalPane.js +5 -6
  31. package/dist/mainPage/header.js +2 -2
  32. package/dist/mainPage/index.d.ts +2 -1
  33. package/dist/mainPage/index.d.ts.map +1 -1
  34. package/dist/mainPage/index.js +23 -0
  35. package/dist/mainPage/menu.d.ts.map +1 -1
  36. package/dist/mainPage/menu.js +29 -2
  37. package/dist/n3Pane.css +49 -0
  38. package/dist/n3Pane.d.ts +13 -0
  39. package/dist/n3Pane.d.ts.map +1 -0
  40. package/dist/n3Pane.js +36 -5
  41. package/dist/outline/manager.js +20 -1
  42. package/dist/pad/padPane.css +6 -2
  43. package/dist/pad/padPane.js +1 -1
  44. package/dist/registerPanes.js +8 -8
  45. package/dist/schedule/schedulePane.css +294 -0
  46. package/dist/schedule/schedulePane.d.ts +23 -0
  47. package/dist/schedule/schedulePane.d.ts.map +1 -0
  48. package/dist/schedule/schedulePane.js +161 -61
  49. package/dist/social/editProfileDetails.d.ts +3 -3
  50. package/dist/social/editProfileDetails.d.ts.map +1 -1
  51. package/dist/social/editProfileDetails.js +222 -127
  52. package/dist/social/icons.d.ts +2 -0
  53. package/dist/social/icons.d.ts.map +1 -1
  54. package/dist/social/icons.js +39 -4
  55. package/dist/social/socialPane.css +838 -178
  56. package/dist/social/socialPane.d.ts.map +1 -1
  57. package/dist/social/socialPane.js +136 -43
  58. package/dist/social/socialSections.d.ts +11 -0
  59. package/dist/social/socialSections.d.ts.map +1 -1
  60. package/dist/social/socialSections.js +138 -62
  61. package/dist/social/spinner.d.ts +3 -0
  62. package/dist/social/spinner.d.ts.map +1 -0
  63. package/dist/social/spinner.js +13 -0
  64. package/dist/social/triage.d.ts +17 -0
  65. package/dist/social/triage.d.ts.map +1 -0
  66. package/dist/social/triage.js +79 -0
  67. package/dist/solid-panes.js +25772 -9576
  68. package/dist/solid-panes.js.map +1 -1
  69. package/dist/solid-panes.min.js +2583 -927
  70. package/dist/solid-panes.min.js.map +1 -1
  71. package/dist/{style → styles}/tabbedtab.css +0 -157
  72. package/dist/styles/utilities.css +5 -0
  73. package/dist/versionInfo.js +13 -13
  74. package/package.json +27 -26
  75. package/dist/icons/signup.png +0 -0
@@ -6,6 +6,9 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.dataContentPane = void 0;
7
7
  var UI = _interopRequireWildcard(require("solid-ui"));
8
8
  var $rdf = _interopRequireWildcard(require("rdflib"));
9
+ var _dompurify = _interopRequireDefault(require("dompurify"));
10
+ require("./dataContentPane.css");
11
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
9
12
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
10
13
  /* Data content Pane
11
14
  **
@@ -40,40 +43,40 @@ const dataContentPane = exports.dataContentPane = {
40
43
  const myDocument = context.dom;
41
44
  // const outliner = context.getOutliner(myDocument)
42
45
  const rep = myDocument.createElement('table');
46
+ rep.classList.add('data-content-pane__table', 'data-content-pane__table--root');
47
+ const isMobileLayout = context.environment?.layout === 'mobile';
43
48
  const sz = $rdf.Serializer(context.session.store);
44
49
  const res = sz.rootSubjects(sts);
45
50
  let roots = res.roots;
46
51
  const subjects = res.subjects;
47
- const loopBreakers = res.loopBreakers;
52
+ const loopBreakers = res.loopBreakers ?? {};
48
53
  for (const x in loopBreakers) {
49
54
  console.log('\tdataContentPane: loopbreaker:' + x);
50
55
  }
51
- const doneBnodes = {}; // For preventing looping
52
- const referencedBnodes = {}; // Bnodes which need to be named alas
53
-
54
- // The property tree for a single subject or anonymous node
55
- function propertyTree(subject) {
56
- // print('Proprty tree for '+subject)
56
+ const doneBnodes = {};
57
+ const referencedBnodes = {};
58
+ function propertyTree(subject, nestingLevel = 0) {
57
59
  const rep = myDocument.createElement('table');
60
+ rep.classList.add('data-content-pane__table', 'data-content-pane__table--property');
58
61
  let lastPred = null;
59
- const sts = subjects[sz.toStr(subject)]; // relevant statements
60
- if (!sts) {
61
- // No statements in tree
62
- rep.appendChild(myDocument.createTextNode('...')); // just empty bnode as object
62
+ const subjectStatements = subjects[sz.toStr(subject)];
63
+ if (!subjectStatements) {
64
+ rep.appendChild(myDocument.createTextNode('...'));
63
65
  return rep;
64
66
  }
65
- sts.sort();
67
+ subjectStatements.sort();
66
68
  let same = 0;
67
- let predicateTD; // The cell which holds the predicate
68
- for (let i = 0; i < sts.length; i++) {
69
- const st = sts[i];
69
+ let predicateTD;
70
+ for (let i = 0; i < subjectStatements.length; i++) {
71
+ const st = subjectStatements[i];
70
72
  const tr = myDocument.createElement('tr');
71
- if (st.predicate.uri !== lastPred) {
72
- if (lastPred && same > 1) {
73
- predicateTD.setAttribute('rowspan', '' + same);
73
+ tr.classList.add('data-content-pane__row--top-aligned', 'data-content-pane__row--property');
74
+ if (st.predicate.uri !== lastPred || isMobileLayout) {
75
+ if (!isMobileLayout && lastPred && same > 1) {
76
+ predicateTD?.setAttribute('rowspan', '' + same);
74
77
  }
75
78
  predicateTD = myDocument.createElement('td');
76
- predicateTD.setAttribute('class', 'pred');
79
+ predicateTD.setAttribute('class', 'data-content-pane__predicate-cell');
77
80
  const anchor = myDocument.createElement('a');
78
81
  anchor.setAttribute('href', st.predicate.uri);
79
82
  anchor.addEventListener('click', UI.widgets.openHrefInOutlineMode, true);
@@ -85,17 +88,19 @@ const dataContentPane = exports.dataContentPane = {
85
88
  }
86
89
  same++;
87
90
  const objectTD = myDocument.createElement('td');
88
- objectTD.appendChild(objectTree(st.object));
91
+ objectTD.classList.add('data-content-pane__value-cell');
92
+ objectTD.appendChild(objectTree(st.object, nestingLevel + 1));
89
93
  tr.appendChild(objectTD);
90
94
  rep.appendChild(tr);
91
95
  }
92
- if (lastPred && same > 1) predicateTD.setAttribute('rowspan', '' + same);
96
+ if (!isMobileLayout && lastPred && same > 1) {
97
+ predicateTD?.setAttribute('rowspan', '' + same);
98
+ }
93
99
  return rep;
94
100
  }
95
-
96
- // Convert a set of statements into a nested tree of tables
97
- function objectTree(obj) {
98
- let res, anchor;
101
+ function objectTree(obj, nestingLevel = 0) {
102
+ let res;
103
+ let anchor;
99
104
  switch (obj.termType) {
100
105
  case 'NamedNode':
101
106
  anchor = myDocument.createElement('a');
@@ -106,36 +111,33 @@ const dataContentPane = exports.dataContentPane = {
106
111
  case 'Literal':
107
112
  if (!obj.datatype || !obj.datatype.uri) {
108
113
  res = myDocument.createElement('div');
109
- res.setAttribute('style', 'white-space: pre-wrap;');
114
+ res.classList.add('data-content-pane__literal');
110
115
  res.textContent = obj.value;
111
116
  return res;
112
117
  } else if (obj.datatype.uri === 'http://www.w3.org/1999/02/22-rdf-syntax-ns#XMLLiteral') {
113
118
  res = myDocument.createElement('div');
114
- res.setAttribute('class', 'embeddedXHTML');
115
- res.innerHTML = obj.value; // Try that @@@ beware embedded dangerous code
119
+ res.classList.add('embeddedXHTML');
120
+ res.innerHTML = _dompurify.default.sanitize(obj.value);
116
121
  return res;
117
122
  }
118
123
  return myDocument.createTextNode(obj.value);
119
- // placeholder - could be smarter,
120
-
121
124
  case 'BlankNode':
122
125
  {
123
126
  if (obj.toNT() in doneBnodes) {
124
- // Break infinite recursion
125
127
  referencedBnodes[obj.toNT()] = true;
126
- const anchor = myDocument.createElement('a');
127
- anchor.setAttribute('href', '#' + obj.toNT().slice(2));
128
- anchor.setAttribute('class', 'bnodeRef');
129
- anchor.textContent = '*' + obj.toNT().slice(3);
130
- return anchor;
128
+ const referenceAnchor = myDocument.createElement('a');
129
+ referenceAnchor.setAttribute('href', '#' + obj.toNT().slice(2));
130
+ referenceAnchor.setAttribute('class', 'bnodeRef');
131
+ referenceAnchor.textContent = '*' + obj.toNT().slice(3);
132
+ return referenceAnchor;
131
133
  }
132
- doneBnodes[obj.toNT()] = true; // Flag to prevent infinite recursion in propertyTree
133
- const newTable = propertyTree(obj);
134
- doneBnodes[obj.toNT()] = newTable; // Track where we mentioned it first
135
- if (UI.utils.ancestor(newTable, 'TABLE') && UI.utils.ancestor(newTable, 'TABLE').style.backgroundColor === 'white') {
136
- newTable.style.backgroundColor = '#eee';
134
+ doneBnodes[obj.toNT()] = true;
135
+ const newTable = propertyTree(obj, nestingLevel);
136
+ doneBnodes[obj.toNT()] = newTable;
137
+ if (nestingLevel % 2 === 1) {
138
+ newTable.classList.add('data-content-pane__nested-table--light');
137
139
  } else {
138
- newTable.style.backgroundColor = 'white';
140
+ newTable.classList.add('data-content-pane__nested-table--dark');
139
141
  }
140
142
  return newTable;
141
143
  }
@@ -145,26 +147,21 @@ const dataContentPane = exports.dataContentPane = {
145
147
  for (let i = 0; i < obj.elements.length; i++) {
146
148
  const tr = myDocument.createElement('tr');
147
149
  res.appendChild(tr);
148
- tr.appendChild(objectTree(obj.elements[i]));
150
+ tr.appendChild(objectTree(obj.elements[i], nestingLevel + 1));
149
151
  }
150
152
  return res;
151
153
  case 'Graph':
152
154
  res = context.session.paneRegistry.byName('dataContents').statementsAsTables(obj.statements, context);
153
- res.setAttribute('class', 'nestedFormula');
155
+ res.setAttribute('class', 'data-content-pane__nested-formula');
154
156
  return res;
155
157
  case 'Variable':
156
- res = myDocument.createTextNode('?' + obj.uri);
157
- return res;
158
+ return myDocument.createTextNode('?' + obj.uri);
158
159
  }
159
160
  throw new Error('Unhandled node type: ' + obj.termType);
160
161
  }
161
-
162
- // roots.sort()
163
-
164
162
  if (initialRoots) {
165
163
  roots = initialRoots.concat(roots.filter(function (x) {
166
164
  for (let i = 0; i < initialRoots.length; i++) {
167
- // Max 2
168
165
  if (x.sameTerm(initialRoots[i])) return false;
169
166
  }
170
167
  return true;
@@ -172,24 +169,25 @@ const dataContentPane = exports.dataContentPane = {
172
169
  }
173
170
  for (let i = 0; i < roots.length; i++) {
174
171
  const tr = myDocument.createElement('tr');
175
- tr.setAttribute('style', `background-color: ${i % 2 === 0 ? '#f0f0f0' : 'white'};`);
172
+ tr.classList.add(i % 2 === 0 ? 'data-content-pane__row--even' : 'data-content-pane__row--odd', 'data-content-pane__row--root');
176
173
  rep.appendChild(tr);
177
174
  const subjectTD = myDocument.createElement('td');
175
+ subjectTD.classList.add('data-content-pane__subject-cell');
178
176
  tr.appendChild(subjectTD);
179
177
  const TDTree = myDocument.createElement('td');
178
+ TDTree.classList.add('data-content-pane__details-cell');
180
179
  tr.appendChild(TDTree);
181
180
  const root = roots[i];
182
181
  if (root.termType === 'BlankNode') {
183
- subjectTD.appendChild(myDocument.createTextNode(UI.utils.label(root))); // Don't recurse!
182
+ subjectTD.appendChild(myDocument.createTextNode(UI.utils.label(root)));
184
183
  } else {
185
- subjectTD.appendChild(objectTree(root)); // won't have tree
184
+ subjectTD.appendChild(objectTree(root, 0));
186
185
  }
187
- TDTree.appendChild(propertyTree(root));
186
+ TDTree.appendChild(propertyTree(root, 0));
188
187
  }
189
188
  for (const bNT in referencedBnodes) {
190
- // Add number to refer to
191
189
  const table = doneBnodes[bNT];
192
- // let tr = myDocument.createElement('tr')
190
+ if (table === true) continue;
193
191
  const anchor = myDocument.createElement('a');
194
192
  anchor.setAttribute('id', bNT.slice(2));
195
193
  anchor.setAttribute('class', 'bnodeDef');
@@ -198,62 +196,31 @@ const dataContentPane = exports.dataContentPane = {
198
196
  }
199
197
  return rep;
200
198
  },
201
- // statementsAsTables
202
- // View the data in a file in user-friendly way
203
199
  render: function (subject, context) {
204
200
  const myDocument = context.dom;
205
- function alternativeRendering() {
206
- const sz = $rdf.Serializer(context.session.store);
207
- const res = sz.rootSubjects(sts);
208
- const roots = res.roots;
209
- const p = {};
210
- p.render = function (s2) {
211
- const div = myDocument.createElement('div');
212
- div.setAttribute('class', 'withinDocumentPane');
213
- const plist = kb.statementsMatching(s2, undefined, undefined, subject);
214
- outliner.appendPropertyTRs(div, plist, false, function (_pred, _inverse) {
215
- return true;
216
- });
217
- return div;
218
- };
219
- for (let i = 0; i < roots.length; i++) {
220
- const tr = myDocument.createElement('TR');
221
- const root = roots[i];
222
- tr.style.verticalAlign = 'top';
223
- const td = outliner.outlineObjectTD(root, undefined, tr);
224
- tr.appendChild(td);
225
- div.appendChild(tr);
226
- outliner.outlineExpand(td, root, {
227
- pane: p
228
- });
229
- }
201
+ function applyEnvironmentAttributes(element) {
202
+ const environment = context.environment ?? {};
203
+ element.dataset.layout = environment.layout ?? 'desktop';
204
+ element.dataset.theme = environment.theme ?? 'light';
205
+ element.dataset.inputMode = environment.inputMode ?? 'pointer';
230
206
  }
231
207
  function mainRendering() {
232
- const initialRoots = []; // Ordering: start with stuff about this doc
208
+ const kb = context.session.store;
209
+ const sts = kb.statementsMatching(undefined, undefined, undefined, subject);
210
+ const initialRoots = [];
233
211
  if (kb.holds(subject, undefined, undefined, subject)) {
234
212
  initialRoots.push(subject);
235
213
  }
236
- // Then about the primary topic of the document if any
237
214
  const ps = kb.any(subject, UI.ns.foaf('primaryTopic'), undefined, subject);
238
- if (ps) initialRoots.push(ps);
215
+ if (ps && (ps.termType === 'NamedNode' || ps.termType === 'BlankNode')) {
216
+ initialRoots.push(ps);
217
+ }
239
218
  div.appendChild(context.session.paneRegistry.byName('dataContents').statementsAsTables(sts, context, initialRoots));
240
219
  }
241
- const outliner = context.getOutliner(myDocument);
242
- const kb = context.session.store;
243
220
  const div = myDocument.createElement('div');
244
- div.setAttribute('class', 'dataContentPane');
245
- // Because of smushing etc, this will not be a copy of the original source
246
- // We could instead either fetch and re-parse the source,
247
- // or we could keep all the pre-smushed triples.
248
- const sts = kb.statementsMatching(undefined, undefined, undefined, subject); // @@ slow with current store!
249
-
250
- // eslint-disable-next-line no-constant-condition
251
- if (false) {
252
- // keep code
253
- alternativeRendering();
254
- } else {
255
- mainRendering();
256
- }
221
+ div.classList.add('dataContentPane', 'data-content-pane');
222
+ applyEnvironmentAttributes(div);
223
+ mainRendering();
257
224
  return div;
258
225
  }
259
226
  };
@@ -0,0 +1,97 @@
1
+ .defaultPane .bottom-border {
2
+ border: 0.2rem solid transparent;
3
+ width: 100%;
4
+ }
5
+
6
+ .defaultPane .bottom-border-active {
7
+ cursor: copy;
8
+ border: 0.2rem solid;
9
+ border-color: var(--color-bottom-border-highlight, rgb(100%, 65%, 0%));
10
+ }
11
+
12
+ .defaultPane {
13
+ --default-pane-predicate-column: 16rem;
14
+ --default-pane-object-indent: 1.75rem;
15
+ }
16
+
17
+ .defaultPane > tr {
18
+ display: grid;
19
+ grid-template-columns: minmax(0, var(--default-pane-predicate-column)) minmax(0, 1fr);
20
+ align-items: flex-start;
21
+ }
22
+
23
+ .defaultPane > tr > td.pred {
24
+ grid-column: 1;
25
+ display: flex;
26
+ align-items: flex-start;
27
+ padding-left: 0 !important;
28
+ box-sizing: border-box;
29
+ min-width: 0;
30
+ }
31
+
32
+ .defaultPane > tr > td.pred > .labelTD {
33
+ flex: 1 1 auto;
34
+ min-width: 0;
35
+ margin: 0;
36
+ padding-top: 0;
37
+ padding-bottom: 0;
38
+ }
39
+
40
+ .defaultPane > tr > td.pred > .iconTD {
41
+ flex: 0 0 auto;
42
+ width: auto;
43
+ margin: 0;
44
+ }
45
+
46
+ .defaultPane > tr > td.obj {
47
+ grid-column: 2;
48
+ min-width: 0;
49
+ box-sizing: border-box;
50
+ align-self: start;
51
+ }
52
+
53
+ .defaultPane > tr > td[colspan='2'] {
54
+ grid-column: 1 / -1;
55
+ }
56
+
57
+ .defaultPane[data-layout='mobile'] > tr {
58
+ grid-template-columns: minmax(0, 1fr);
59
+ }
60
+
61
+ .defaultPane[data-layout='mobile'] > tr > td.pred,
62
+ .defaultPane[data-layout='mobile'] > tr > td.obj {
63
+ display: block;
64
+ grid-column: 1;
65
+ width: 100%;
66
+ box-sizing: border-box;
67
+ }
68
+
69
+ .defaultPane[data-layout='mobile'] > tr > td.pred {
70
+ padding-bottom: var(--spacing-small, 0.1rem);
71
+ }
72
+
73
+ .defaultPane[data-layout='mobile'] > tr > td.obj {
74
+ padding-left: var(--default-pane-object-indent) !important;
75
+ }
76
+
77
+ @media (max-width: 700px) {
78
+ .defaultPane > tr {
79
+ grid-template-columns: minmax(0, 1fr);
80
+ }
81
+
82
+ .defaultPane > tr > td.pred,
83
+ .defaultPane > tr > td.obj {
84
+ display: block;
85
+ grid-column: 1;
86
+ width: 100%;
87
+ box-sizing: border-box;
88
+ }
89
+
90
+ .defaultPane > tr > td.pred {
91
+ padding-bottom: var(--spacing-small, 0.1rem);
92
+ }
93
+
94
+ .defaultPane > tr > td.obj {
95
+ padding-left: var(--default-pane-object-indent) !important;
96
+ }
97
+ }
@@ -0,0 +1,14 @@
1
+ import type { DataBrowserContext } from 'pane-registry';
2
+ import type { BlankNode, Literal, NamedNode } from 'rdflib';
3
+ import './defaultPane.css';
4
+ type DefaultPaneSubject = NamedNode | BlankNode | Literal;
5
+ type DefaultPaneDefinition = {
6
+ icon: string;
7
+ name: string;
8
+ audience: NamedNode[];
9
+ label: (subject: DefaultPaneSubject) => string;
10
+ render: (subject: DefaultPaneSubject, context: DataBrowserContext) => HTMLDivElement;
11
+ };
12
+ export declare const defaultPane: DefaultPaneDefinition;
13
+ export {};
14
+ //# sourceMappingURL=defaultPane.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"defaultPane.d.ts","sourceRoot":"","sources":["../src/defaultPane.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,kBAAkB,EAAqB,MAAM,eAAe,CAAA;AAC1E,OAAO,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,EAAa,MAAM,QAAQ,CAAA;AACtE,OAAO,mBAAmB,CAAA;AAG1B,KAAK,kBAAkB,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAA;AAEzD,KAAK,qBAAqB,GAAG;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,SAAS,EAAE,CAAA;IACrB,KAAK,EAAE,CAAC,OAAO,EAAE,kBAAkB,KAAK,MAAM,CAAA;IAC9C,MAAM,EAAE,CAAC,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,kBAAkB,KAAK,cAAc,CAAA;CACrF,CAAA;AAcD,eAAO,MAAM,WAAW,EAAE,qBAqGzB,CAAA"}
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.defaultPane = void 0;
7
7
  var UI = _interopRequireWildcard(require("solid-ui"));
8
8
  var $rdf = _interopRequireWildcard(require("rdflib"));
9
+ require("./defaultPane.css");
9
10
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
10
11
  /* Default Pane
11
12
  **
@@ -24,6 +25,10 @@ const defaultPane = exports.defaultPane = {
24
25
  },
25
26
  render: function (subject, context) {
26
27
  const dom = context.dom;
28
+ function applyEnvironmentAttributes(element) {
29
+ const environment = context.environment ?? {};
30
+ element.dataset.layout = environment.layout ?? 'desktop';
31
+ }
27
32
  const filter = function (pred, inverse) {
28
33
  if (typeof context.session.paneRegistry.byName('internal').predicates[pred.uri] !== 'undefined') {
29
34
  return false;
@@ -40,16 +45,18 @@ const defaultPane = exports.defaultPane = {
40
45
  subject = kb.canon(subject);
41
46
  const div = dom.createElement('div');
42
47
  div.setAttribute('class', 'defaultPane');
48
+ applyEnvironmentAttributes(div);
43
49
  // appendRemoveIcon(div, subject, div)
44
50
 
45
- let plist = kb.statementsMatching(subject);
51
+ let plist = subject.termType === 'Literal' ? [] : kb.statementsMatching(subject);
46
52
  outliner.appendPropertyTRs(div, plist, false, filter);
47
53
  plist = kb.statementsMatching(undefined, undefined, subject);
48
54
  outliner.appendPropertyTRs(div, plist, true, filter);
55
+ const subjectStatement = subject.termType === 'BlankNode' ? kb.anyStatementMatching(subject) : undefined;
49
56
  if (subject.termType === 'Literal' && subject.value.slice(0, 7) === 'http://') {
50
57
  outliner.appendPropertyTRs(div, [$rdf.st(kb.sym(subject.value), UI.ns.link('uri'), subject)], true, filter);
51
58
  }
52
- if (subject.termType === 'NamedNode' && kb.updater.editable($rdf.Util.uri.docpart(subject.uri), kb) || subject.termType === 'BlankNode' && kb.anyStatementMatching(subject) && kb.anyStatementMatching(subject).why && kb.anyStatementMatching(subject).why.uri && kb.updater.editable(kb.anyStatementMatching(subject).why.uri)
59
+ if (subject.termType === 'NamedNode' && kb.updater.editable($rdf.Util.uri.docpart(subject.uri), kb) || subject.termType === 'BlankNode' && subjectStatement && subjectStatement.why && 'uri' in subjectStatement.why && typeof subjectStatement.why.uri === 'string' && kb.updater.editable(subjectStatement.why.uri)
53
60
  // check the document containing something about of the bnode @@ what about as object?
54
61
  /* ! && HCIoptions["bottom insert highlights"].enabled */) {
55
62
  const holdingTr = dom.createElement('tr'); // these are to minimize required changes
@@ -0,0 +1,120 @@
1
+ .formPane a {
2
+ color: var(--color-text-link, #3b5998);
3
+ text-decoration: none;
4
+ }
5
+
6
+ .formPane a:link {
7
+ color: var(--color-text-link, #3b5998);
8
+ text-decoration: none;
9
+ }
10
+
11
+ .formPane a:visited {
12
+ color: var(--color-text-link-visited, #3b5998);
13
+ text-decoration: none;
14
+ }
15
+
16
+ .formPane a:hover {
17
+ color: var(--color-text-link-hover, #3b5998);
18
+ font-weight: bold;
19
+ }
20
+
21
+ .formPane a:active {
22
+ color: var(--color-text-link-active, #888);
23
+ text-decoration: none;
24
+ }
25
+
26
+ .formPane__message,
27
+ .formPaneMessage {
28
+ color: #666;
29
+ margin: var(--spacing-xs, 0.5em) 0;
30
+ padding: var(--spacing-xs, 0.35em) var(--spacing-xs, 0.5em);
31
+ }
32
+
33
+ .formPane__message--info {
34
+ background-color: var(--color-main-block-bg, #eee);
35
+ }
36
+
37
+ .formPane__message--error {
38
+ background-color: var(--color-log-error-bg, #fee);
39
+ }
40
+
41
+ .formPane__editButton {
42
+ margin-left: auto;
43
+ align-self: center;
44
+ padding: var(--spacing-xs, 0.5rem);
45
+ border: .5rem solid white;
46
+ font-size: 100%;
47
+ float: none;
48
+ }
49
+
50
+ .formPane .formPane__mobileTextareaValue > div {
51
+ display: block;
52
+ min-width: 0;
53
+ position: relative;
54
+ }
55
+
56
+ .formPane .formPane__mobileTextareaValue > div > textarea {
57
+ box-sizing: border-box;
58
+ max-width: 100%;
59
+ min-width: 0;
60
+ width: 100%;
61
+ }
62
+
63
+ .formPane .formPane__mobileTextareaValue > div > button[type='button'] {
64
+ float: none !important;
65
+ position: absolute;
66
+ right: 0;
67
+ top: 0;
68
+ }
69
+
70
+ .formPane[data-layout='mobile'] .formPane__mobileTextareaRow {
71
+ flex-direction: column !important;
72
+ align-items: stretch;
73
+ }
74
+
75
+ .formPane[data-layout='mobile'] .formPane__mobileTextareaLabel {
76
+ width: auto !important;
77
+ padding-bottom: 0;
78
+ }
79
+
80
+ .formPane[data-layout='mobile'] .formPane__mobileTextareaValue {
81
+ box-sizing: border-box;
82
+ min-width: 0;
83
+ padding-right: var(--spacing-sm, 0.75rem);
84
+ width: 100%;
85
+ }
86
+
87
+ .formPane[data-layout='mobile'] .formPane__mobileTextareaValue textarea {
88
+ box-sizing: border-box;
89
+ margin-left: 0 !important;
90
+ margin-right: 0 !important;
91
+ max-width: 100%;
92
+ width: 100%;
93
+ }
94
+
95
+ @media (max-width: 960px) {
96
+ .formPane .formPane__mobileTextareaRow {
97
+ flex-direction: column !important;
98
+ align-items: stretch;
99
+ }
100
+
101
+ .formPane .formPane__mobileTextareaLabel {
102
+ width: auto !important;
103
+ padding-bottom: 0;
104
+ }
105
+
106
+ .formPane .formPane__mobileTextareaValue {
107
+ box-sizing: border-box;
108
+ min-width: 0;
109
+ padding-right: var(--spacing-sm, 0.75rem);
110
+ width: 100%;
111
+ }
112
+
113
+ .formPane .formPane__mobileTextareaValue textarea {
114
+ box-sizing: border-box;
115
+ margin-left: 0 !important;
116
+ margin-right: 0 !important;
117
+ max-width: 100%;
118
+ width: 100%;
119
+ }
120
+ }
@@ -0,0 +1,4 @@
1
+ import type { PaneDefinition } from 'pane-registry';
2
+ import './formPane.css';
3
+ export declare const formPane: PaneDefinition;
4
+ //# sourceMappingURL=pane.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"pane.d.ts","sourceRoot":"","sources":["../../src/form/pane.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAsB,cAAc,EAAE,MAAM,eAAe,CAAA;AAGvE,OAAO,gBAAgB,CAAA;AAsEvB,eAAO,MAAM,QAAQ,EAAE,cAqOtB,CAAA"}