solid-ui 2.6.1 → 3.0.0-63a1640

package/dist/create/create.js

@@ -0,0 +1,249 @@
+/*   create.js     UI to craete new objects in the solid-app-set world
+ **
+ */
+import { solidLogicSingleton } from 'solid-logic';
+import * as debug from '../debug';
+import { icons } from '../iconBase';
+import { ensureLoadedProfile, selectWorkspace } from '../login/login';
+import ns from '../ns';
+import * as utils from '../utils';
+import * as widgets from '../widgets';
+const kb = solidLogicSingleton.store;
+/*  newThingUI -- return UI for user to select a new object, folder, etc
+ **
+ ** context must include:  dom, div,
+ **     optional:   folder: NamedNode -- the folder where the thing is bring put
+ **                (suppresses asking for a full URI or workspace)
+ **
+ */
+export function newThingUI(createContext, dataBrowserContext, thePanes) {
+    const dom = createContext.dom;
+    const div = createContext.div;
+    if (createContext.me && !createContext.me.uri) {
+        throw new Error('newThingUI:  Invalid userid: ' + createContext.me);
+    }
+    const iconStyle = 'padding: 0.7em; width: 2em; height: 2em;'; // was: 'padding: 1em; width: 3em; height: 3em;'
+    const star = div.appendChild(dom.createElement('img'));
+    let visible = false; // the inividual tools tools
+    //   noun_272948.svg = black star
+    // noun_34653_green.svg = green plus
+    star.setAttribute('src', icons.iconBase + 'noun_34653_green.svg');
+    star.setAttribute('style', iconStyle);
+    star.setAttribute('title', 'Add another tool');
+    const complain = function complain(message) {
+        const pre = div.appendChild(dom.createElement('pre'));
+        pre.setAttribute('style', 'background-color: pink');
+        pre.appendChild(dom.createTextNode(message));
+    };
+    function styleTheIcons(style) {
+        for (let i = 0; i < iconArray.length; i++) {
+            let st = iconStyle + style;
+            if (iconArray[i].disabled) {
+                // @@ unused
+                st += 'opacity: 0.3;';
+            }
+            iconArray[i].setAttribute('style', st); // eg 'background-color: #ccc;'
+        }
+    }
+    function selectTool(icon) {
+        styleTheIcons('display: none;'); // 'background-color: #ccc;'
+        icon.setAttribute('style', iconStyle + 'background-color: yellow;');
+    }
+    function selectNewTool(_event) {
+        visible = !visible;
+        star.setAttribute('style', iconStyle + (visible ? 'background-color: yellow;' : ''));
+        styleTheIcons(visible ? '' : 'display: none;');
+    }
+    star.addEventListener('click', selectNewTool);
+    function makeNewAppInstance(options) {
+        return new Promise(function (resolve, reject) {
+            let selectUI; // , selectUIParent
+            function callbackWS(ws, newBase) {
+                ensureLoadedProfile(createContext).then(_context => {
+                    const newPaneOptions = Object.assign({
+                        newBase,
+                        folder: options.folder || undefined,
+                        workspace: ws
+                    }, options);
+                    for (const opt in options) {
+                        // get div, dom, me, folder, pane, refreshTable
+                        newPaneOptions[opt] = options[opt];
+                    }
+                    debug.log(`newThingUI: Minting new ${newPaneOptions.pane.name} at ${newPaneOptions.newBase}`);
+                    options.pane
+                        .mintNew(dataBrowserContext, newPaneOptions)
+                        .then(function (newPaneOptions) {
+                        if (!newPaneOptions || !newPaneOptions.newInstance) {
+                            throw new Error('Cannot mint new - missing newInstance');
+                        }
+                        if (newPaneOptions.folder) {
+                            const tail = newPaneOptions.newInstance.uri.slice(newPaneOptions.folder.uri.length);
+                            const isPackage = tail.includes('/');
+                            debug.log('  new thing is packge? ' + isPackage);
+                            if (isPackage) {
+                                kb.add(newPaneOptions.folder, ns.ldp('contains'), kb.sym(newPaneOptions.newBase), newPaneOptions.folder.doc());
+                            }
+                            else {
+                                // single file
+                                kb.add(newPaneOptions.folder, ns.ldp('contains'), newPaneOptions.newInstance, newPaneOptions.folder.doc()); // Ping the patch system?
+                            }
+                            // @ts-ignore @@ TODO check whether refresh can exist here. Either fix type or remove unreachable code
+                            if (newPaneOptions.refreshTarget && newPaneOptions.refreshTarget.refresh) {
+                                // @@ TODO Remove the need to cast as any
+                                ;
+                                newPaneOptions.refreshTarget.refresh(); // Refresh the containing display
+                            }
+                            // selectUI.parentNode.removeChild(selectUI) It removes itself
+                        }
+                        else {
+                            const p = options.div.appendChild(dom.createElement('p'));
+                            p.setAttribute('style', 'font-size: 120%;');
+                            // Make link to new thing
+                            p.innerHTML =
+                                'Your <a target=\'_blank\' href=\'' +
+                                    newPaneOptions.newInstance.uri +
+                                    '\'><b>new ' +
+                                    options.noun +
+                                    '</b></a> is ready to be set up. ' +
+                                    '<br/><br/><a target=\'_blank\' href=\'' +
+                                    newPaneOptions.newInstance.uri +
+                                    '\'>Go to your new ' +
+                                    options.noun +
+                                    '.</a>';
+                            // selectUI.parentNode.removeChild(selectUI) // Clean up
+                            // selectUIParent.removeChild(selectUI) // Clean up
+                        }
+                        selectNewTool(); // toggle star to plain and menu vanish again
+                    })
+                        .catch(function (err) {
+                        complain(err);
+                        reject(err);
+                    });
+                }, err => {
+                    // login fails
+                    complain('Error logging on: ' + err);
+                });
+            } // callbackWS
+            const pa = options.pane;
+            // options.appPathSegment = pa.name // was 'edu.mit.solid.pane.'
+            options.noun = pa.mintClass ? utils.label(pa.mintClass) : pa.name;
+            options.appPathSegment = options.noun.slice(0, 1).toUpperCase() + options.noun.slice(1);
+            if (!options.folder) {
+                // No folder given? Ask user for full URI
+                selectUI = selectWorkspace(dom, {
+                    noun: options.noun,
+                    appPathSegment: options.appPathSegment
+                }, callbackWS);
+                options.div.appendChild(selectUI);
+                // selectUIParent = options.div
+            }
+            else {
+                const gotName = function (name) {
+                    if (!name) {
+                        // selectUIParent.removeChild(selectUI)   itremves itself if cancelled
+                        selectNewTool(); // toggle star to plain and menu vanish again
+                    }
+                    else {
+                        let uri = options.folder.uri;
+                        if (!uri.endsWith('/')) {
+                            uri = uri + '/';
+                        }
+                        uri = uri + encodeURIComponent(name) + '/';
+                        callbackWS(null, uri);
+                    }
+                };
+                widgets
+                    .askName(dom, kb, options.div, ns.foaf('name'), null, options.noun)
+                    .then(gotName);
+                // selectUI = getNameForm(dom, kb, options.noun, gotName)
+                // options.div.appendChild(selectUI)
+                // selectUIParent = options.div
+            }
+        });
+    } // makeNewAppInstance
+    const iconArray = [];
+    const mintingPanes = Object.values(thePanes).filter(pane => pane.mintNew);
+    const mintingClassMap = mintingPanes.reduce((classMap, pane) => {
+        if (pane.mintClass) {
+            classMap[pane.mintClass.uri] = (classMap[pane.mintClass.uri] || 0) + 1;
+        }
+        return classMap;
+    }, {});
+    mintingPanes.forEach(pane => {
+        // @@ TODO Remove the need to cast to any
+        const icon = createContext.div.appendChild(dom.createElement('img'));
+        icon.setAttribute('src', pane.icon);
+        const noun = pane.mintClass
+            ? mintingClassMap[pane.mintClass.uri] > 1
+                ? `${utils.label(pane.mintClass)} (using ${pane.name} pane)`
+                : utils.label(pane.mintClass)
+            : pane.name + ' @@';
+        icon.setAttribute('title', 'Make new ' + noun);
+        icon.setAttribute('style', iconStyle + 'display: none;');
+        iconArray.push(icon);
+        if (!icon.disabled) {
+            icon.addEventListener('click', function (e) {
+                selectTool(icon);
+                makeNewAppInstance({
+                    event: e,
+                    folder: createContext.folder || null,
+                    iconEle: icon,
+                    pane,
+                    noun,
+                    noIndexHTML: true, // do NOT @@ for now write a HTML file
+                    div: createContext.div,
+                    me: createContext.me,
+                    dom: createContext.dom,
+                    refreshTarget: createContext.refreshTarget
+                });
+            });
+        }
+    });
+}
+// Form to get the name of a new thing before we create it
+//
+// Used in contacts for new groups, individuals.
+//
+/*
+function getNameForm (dom, kb, classLabel, gotNameCallback) {
+  const form = dom.createElement('div') // form is broken as HTML behaviour can resurface on js error
+  form.innerHTML = '<p>Name of new ' + classLabel + ':</p>'
+  const namefield = dom.createElement('input')
+  namefield.setAttribute('type', 'text')
+  namefield.setAttribute('size', '30')
+  namefield.setAttribute('style', style.textInputStyle)
+  namefield.setAttribute('maxLength', '2048') // No arbitrary limits
+  namefield.select() // focus next user input
+
+  const gotName = function () {
+    namefield.setAttribute('class', 'pendingedit')
+    namefield.disabled = true
+    continueButton.disabled = true
+    cancel.disabled = true
+    gotNameCallback(true, namefield.value)
+  }
+
+  namefield.addEventListener('keyup', function (e) {
+    if (e.keyCode === 13) {
+      gotName()
+    }
+  }, false)
+  form.appendChild(namefield)
+
+  form.appendChild(dom.createElement('br'))
+
+  const cancel = form.appendChild(widgets.cancelButton(dom))
+  cancel.addEventListener('click', function (e) {
+    form.parentNode.removeChild(form)
+    gotNameCallback(false)
+  }, false)
+
+  const continueButton = form.appendChild(widgets.continueButton(dom))
+  continueButton.addEventListener('click', function (e) {
+    gotName()
+  }, false)
+
+  return form
+}
+*/
+//# sourceMappingURL=create.js.map

package/dist/create/create.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"create.js","sourceRoot":"","sources":["../../src/create/create.ts"],"names":[],"mappings":"AAAA;;GAEG;AAGH,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAA;AACjD,OAAO,KAAK,KAAK,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAA;AACnC,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAA;AACrE,OAAO,EAAE,MAAM,OAAO,CAAA;AACtB,OAAO,KAAK,KAAK,MAAM,UAAU,CAAA;AACjC,OAAO,KAAK,OAAO,MAAM,YAAY,CAAA;AAGrC,MAAM,EAAE,GAAG,mBAAmB,CAAC,KAAK,CAAA;AAEpC;;;;;;GAMG;AACH,MAAM,UAAU,UAAU,CACxB,aAA4B,EAC5B,kBAAsC,EACtC,QAA+B;IAE/B,MAAM,GAAG,GAAG,aAAa,CAAC,GAAG,CAAA;IAC7B,MAAM,GAAG,GAAG,aAAa,CAAC,GAAG,CAAA;IAC7B,IAAI,aAAa,CAAC,EAAE,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC;QAC9C,MAAM,IAAI,KAAK,CAAC,+BAA+B,GAAG,aAAa,CAAC,EAAE,CAAC,CAAA;IACrE,CAAC;IAED,MAAM,SAAS,GAAG,0CAA0C,CAAA,CAAC,gDAAgD;IAC7G,MAAM,IAAI,GAAG,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAA;IACtD,IAAI,OAAO,GAAG,KAAK,CAAA,CAAC,4BAA4B;IAChD,iCAAiC;IACjC,oCAAoC;IACpC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,KAAK,CAAC,QAAQ,GAAG,sBAAsB,CAAC,CAAA;IACjE,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;IACrC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAA;IAE9C,MAAM,QAAQ,GAAG,SAAS,QAAQ,CAAE,OAAO;QACzC,MAAM,GAAG,GAAG,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAA;QACrD,GAAG,CAAC,YAAY,CAAC,OAAO,EAAE,wBAAwB,CAAC,CAAA;QACnD,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAA;IAC9C,CAAC,CAAA;IAED,SAAS,aAAa,CAAE,KAAK;QAC3B,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;YAC1C,IAAI,EAAE,GAAG,SAAS,GAAG,KAAK,CAAA;YAC1B,IAAI,SAAS,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC;gBAC1B,YAAY;gBACZ,EAAE,IAAI,eAAe,CAAA;YACvB,CAAC;YACD,SAAS,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,EAAE,EAAE,CAAC,CAAA,CAAC,+BAA+B;QACxE,CAAC;IACH,CAAC;IAED,SAAS,UAAU,CAAE,IAAI;QACvB,aAAa,CAAC,gBAAgB,CAAC,CAAA,CAAC,4BAA4B;QAC5D,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,SAAS,GAAG,2BAA2B,CAAC,CAAA;IACrE,CAAC;IAED,SAAS,aAAa,CAAE,MAAO;QAC7B,OAAO,GAAG,CAAC,OAAO,CAAA;QAClB,IAAI,CAAC,YAAY,CACf,OAAO,EACP,SAAS,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,EAAE,CAAC,CACzD,CAAA;QACD,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAA;IAChD,CAAC;IAED,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,aAAa,CAAC,CAAA;IAE7C,SAAS,kBAAkB,CAAE,OAA8B;QACzD,OAAO,IAAI,OAAO,CAAC,UAAU,OAAO,EAAE,MAAM;YAC1C,IAAI,QAAQ,CAAA,CAAC,mBAAmB;YAChC,SAAS,UAAU,CAAE,EAAE,EAAE,OAAO;gBAC9B,mBAAmB,CAAC,aAAa,CAAC,CAAC,IAAI,CACrC,QAAQ,CAAC,EAAE;oBACT,MAAM,cAAc,GAAmB,MAAM,CAAC,MAAM,CAAC;wBACnD,OAAO;wBACP,MAAM,EAAE,OAAO,CAAC,MAAM,IAAI,SAAS;wBACnC,SAAS,EAAE,EAAE;qBACd,EAAE,OAAO,CAAC,CAAA;oBACX,KAAK,MAAM,GAAG,IAAI,OAAO,EAAE,CAAC;wBAC1B,+CAA+C;wBAC/C,cAAc,CAAC,GAAG,CAAC,GAAG,OAAO,CAAC,GAAG,CAAC,CAAA;oBACpC,CAAC;oBACD,KAAK,CAAC,GAAG,CAAC,2BAA2B,cAAc,CAAC,IAAI,CAAC,IAAI,OAAO,cAAc,CAAC,OAAO,EAAE,CAAC,CAAA;oBAC7F,OAAO,CAAC,IAAI;yBACT,OAAQ,CAAC,kBAAkB,EAAE,cAAc,CAAC;yBAC5C,IAAI,CAAC,UAAU,cAAc;wBAC5B,IAAI,CAAC,cAAc,IAAI,CAAC,cAAc,CAAC,WAAW,EAAE,CAAC;4BACnD,MAAM,IAAI,KAAK,CAAC,uCAAuC,CAAC,CAAA;wBAC1D,CAAC;wBACD,IAAI,cAAc,CAAC,MAAM,EAAE,CAAC;4BAC1B,MAAM,IAAI,GAAG,cAAc,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAC/C,cAAc,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CACjC,CAAA;4BACD,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAA;4BACpC,KAAK,CAAC,GAAG,CAAC,yBAAyB,GAAG,SAAS,CAAC,CAAA;4BAChD,IAAI,SAAS,EAAE,CAAC;gCACd,EAAE,CAAC,GAAG,CACJ,cAAc,CAAC,MAAM,EACrB,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,EAClB,EAAE,CAAC,GAAG,CAAC,cAAc,CAAC,OAAO,CAAC,EAC9B,cAAc,CAAC,MAAM,CAAC,GAAG,EAAE,CAC5B,CAAA;4BACH,CAAC;iCAAM,CAAC;gCACN,cAAc;gCACd,EAAE,CAAC,GAAG,CACJ,cAAc,CAAC,MAAM,EACrB,EAAE,CAAC,GAAG,CAAC,UAAU,CAAC,EAClB,cAAc,CAAC,WAAW,EAC1B,cAAc,CAAC,MAAM,CAAC,GAAG,EAAE,CAC5B,CAAA,CAAC,yBAAyB;4BAC7B,CAAC;4BACD,sGAAsG;4BACtG,IAAI,cAAc,CAAC,aAAa,IAAI,cAAc,CAAC,aAAa,CAAC,OAAO,EAAE,CAAC;gCACzE,yCAAyC;gCACzC,CAAC;gCAAC,cAAc,CAAC,aAAqB,CAAC,OAAO,EAAE,CAAA,CAAC,iCAAiC;4BACpF,CAAC;4BACD,8DAA8D;wBAChE,CAAC;6BAAM,CAAC;4BACN,MAAM,CAAC,GAAG,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAA;4BACzD,CAAC,CAAC,YAAY,CAAC,OAAO,EAAE,kBAAkB,CAAC,CAAA;4BAC3C,yBAAyB;4BACzB,CAAC,CAAC,SAAS;gCACT,mCAAmC;oCACnC,cAAc,CAAC,WAAW,CAAC,GAAG;oCAC9B,YAAY;oCACZ,OAAO,CAAC,IAAI;oCACZ,kCAAkC;oCAClC,wCAAwC;oCACxC,cAAc,CAAC,WAAW,CAAC,GAAG;oCAC9B,oBAAoB;oCACpB,OAAO,CAAC,IAAI;oCACZ,OAAO,CAAA;4BACT,wDAAwD;4BACxD,mDAAmD;wBACrD,CAAC;wBACD,aAAa,EAAE,CAAA,CAAC,6CAA6C;oBAC/D,CAAC,CAAC;yBACD,KAAK,CAAC,UAAU,GAAG;wBAClB,QAAQ,CAAC,GAAG,CAAC,CAAA;wBACb,MAAM,CAAC,GAAG,CAAC,CAAA;oBACb,CAAC,CAAC,CAAA;gBACN,CAAC,EACD,GAAG,CAAC,EAAE;oBACJ,cAAc;oBACd,QAAQ,CAAC,oBAAoB,GAAG,GAAG,CAAC,CAAA;gBACtC,CAAC,CACF,CAAA;YACH,CAAC,CAAC,aAAa;YAEf,MAAM,EAAE,GAAG,OAAO,CAAC,IAAI,CAAA;YACvB,gEAAgE;YAChE,OAAO,CAAC,IAAI,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAA;YACjE,OAAO,CAAC,cAAc,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;YAEvF,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC;gBACpB,yCAAyC;gBACzC,QAAQ,GAAG,eAAe,CAAC,GAAG,EAAE;oBAC9B,IAAI,EAAE,OAAO,CAAC,IAAI;oBAClB,cAAc,EAAE,OAAO,CAAC,cAAc;iBACvC,EAAE,UAAU,CAAC,CAAA;gBACd,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAA;gBACjC,+BAA+B;YACjC,CAAC;iBAAM,CAAC;gBACN,MAAM,OAAO,GAAG,UAAU,IAAI;oBAC5B,IAAI,CAAC,IAAI,EAAE,CAAC;wBACV,sEAAsE;wBACtE,aAAa,EAAE,CAAA,CAAC,6CAA6C;oBAC/D,CAAC;yBAAM,CAAC;wBACN,IAAI,GAAG,GAAG,OAAO,CAAC,MAAO,CAAC,GAAG,CAAA;wBAC7B,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;4BACvB,GAAG,GAAG,GAAG,GAAG,GAAG,CAAA;wBACjB,CAAC;wBACD,GAAG,GAAG,GAAG,GAAG,kBAAkB,CAAC,IAAI,CAAC,GAAG,GAAG,CAAA;wBAC1C,UAAU,CAAC,IAAI,EAAE,GAAG,CAAC,CAAA;oBACvB,CAAC;gBACH,CAAC,CAAA;gBACD,OAAO;qBACJ,OAAO,CACN,GAAG,EACH,EAAE,EACF,OAAO,CAAC,GAAG,EACX,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,EACf,IAAI,EACJ,OAAO,CAAC,IAAI,CACb;qBACA,IAAI,CAAC,OAAO,CAAC,CAAA;gBAChB,yDAAyD;gBACzD,oCAAoC;gBACpC,+BAA+B;YACjC,CAAC;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,CAAC,qBAAqB;IAEvB,MAAM,SAAS,GAAe,EAAE,CAAA;IAChC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;IACzE,MAAM,eAAe,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,QAAQ,EAAE,IAAI,EAAE,EAAE;QAC7D,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACnB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAA;QACxE,CAAC;QACD,OAAO,QAAQ,CAAA;IACjB,CAAC,EAAE,EAAE,CAAC,CAAA;IACN,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QAC1B,yCAAyC;QACzC,MAAM,IAAI,GAAQ,aAAa,CAAC,GAAG,CAAC,WAAW,CAAC,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,CAAA;QACzE,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,CAAA;QACnC,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS;YACzB,CAAC,CAAC,eAAe,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,GAAG,CAAC;gBACvC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,WAAW,IAAI,CAAC,IAAI,QAAQ;gBAC5D,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC;YAC/B,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAA;QACrB,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,CAAC,CAAA;QAC9C,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,SAAS,GAAG,gBAAgB,CAAC,CAAA;QACxD,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QACpB,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YACnB,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,UAAU,CAAC;gBACxC,UAAU,CAAC,IAAI,CAAC,CAAA;gBAChB,kBAAkB,CAAC;oBACjB,KAAK,EAAE,CAAC;oBACR,MAAM,EAAE,aAAa,CAAC,MAAM,IAAI,IAAI;oBACpC,OAAO,EAAE,IAAI;oBACb,IAAI;oBACJ,IAAI;oBACJ,WAAW,EAAE,IAAI,EAAE,sCAAsC;oBACzD,GAAG,EAAE,aAAa,CAAC,GAAG;oBACtB,EAAE,EAAE,aAAa,CAAC,EAAE;oBACpB,GAAG,EAAE,aAAa,CAAC,GAAG;oBACtB,aAAa,EAAE,aAAa,CAAC,aAAa;iBAC3C,CAAC,CAAA;YACJ,CAAC,CAAC,CAAA;QACJ,CAAC;IACH,CAAC,CAAC,CAAA;AACJ,CAAC;AAED,0DAA0D;AAC1D,EAAE;AACF,gDAAgD;AAChD,EAAE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyCE"}

package/dist/create/index.js

@@ -0,0 +1,5 @@
+import { newThingUI } from './create';
+export const create = {
+    newThingUI
+};
+//# sourceMappingURL=index.js.map

package/dist/create/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/create/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EACX,MAAM,UAAU,CAAA;AAEjB,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,UAAU;CACX,CAAA"}

package/dist/create/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/create/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/create/types.ts"],"names":[],"mappings":""}

package/dist/debug.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"debug.d.ts","sourceRoot":"","sources":["../src/debug.ts"],"names":[],"mappings":"AAAA,wBAAgB,GAAG,CAAE,GAAG,IAAI,EAAE,GAAG,EAAE,QAElC;AAED,wBAAgB,IAAI,CAAE,GAAG,IAAI,EAAE,GAAG,EAAE,QAEnC;AAED,wBAAgB,KAAK,CAAE,GAAG,IAAI,EAAE,GAAG,EAAE,QAEpC;AAED,wBAAgB,KAAK,CAAE,GAAG,IAAI,EAAE,GAAG,EAAE,QAEpC"}

package/dist/debug.js

@@ -0,0 +1,13 @@
+export function log(...args) {
+    console.log(...args);
+}
+export function warn(...args) {
+    console.warn(...args);
+}
+export function error(...args) {
+    console.error(...args);
+}
+export function trace(...args) {
+    console.trace(...args);
+}
+//# sourceMappingURL=debug.js.map

package/dist/debug.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"debug.js","sourceRoot":"","sources":["../src/debug.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,GAAG,CAAE,GAAG,IAAW;IACjC,OAAO,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,CAAA;AACtB,CAAC;AAED,MAAM,UAAU,IAAI,CAAE,GAAG,IAAW;IAClC,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAA;AACvB,CAAC;AAED,MAAM,UAAU,KAAK,CAAE,GAAG,IAAW;IACnC,OAAO,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,CAAA;AACxB,CAAC;AAED,MAAM,UAAU,KAAK,CAAE,GAAG,IAAW;IACnC,OAAO,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,CAAA;AACxB,CAAC"}

package/dist/footer/index.js

@@ -0,0 +1,67 @@
+import { authn, authSession } from 'solid-logic';
+import { style } from '../style';
+import { getName, getPod, getPodOwner } from '../utils/headerFooterHelpers';
+const DEFAULT_SOLID_PROJECT_URL = 'https://solidproject.org';
+const DEFAULT_SOLID_PROJECT_NAME = 'solidproject.org';
+/**
+ * Initialize footer component, the footer object returned depends on whether the user is authenticated.
+ * @param store the data store
+ * @returns the footer
+ */
+export async function initFooter(store, options) {
+    const footer = document.getElementById('PageFooter');
+    if (!footer) {
+        return;
+    }
+    const pod = getPod();
+    const podOwner = await getPodOwner(pod, store);
+    rebuildFooter(footer, store, pod, podOwner, options)();
+    authSession.events.on('login', rebuildFooter(footer, store, pod, podOwner, options));
+    authSession.events.on('logout', rebuildFooter(footer, store, pod, podOwner, options));
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function rebuildFooter(footer, store, pod, podOwner, options) {
+    return async () => {
+        const user = authn.currentUser();
+        footer.innerHTML = '';
+        footer.appendChild(await createControllerInfoBlock(store, user, pod, podOwner, options));
+    };
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function createControllerInfoBlock(store, user, pod, podOwner, options) {
+    const profileLinkContainer = document.createElement('div');
+    if (!pod || !podOwner || (user && user.equals(podOwner))) {
+        return profileLinkContainer;
+    }
+    profileLinkContainer.setAttribute('style', style.footer);
+    const podLinkPre = document.createElement('span');
+    podLinkPre.innerText = 'You\'re visiting ';
+    const podLink = document.createElement('a');
+    podLink.href = pod.uri;
+    podLink.innerText = 'the Pod';
+    const profileLinkPre = document.createElement('span');
+    profileLinkPre.innerText = ' controlled by ';
+    const profileLink = document.createElement('a');
+    profileLink.href = podOwner.uri;
+    profileLink.innerText = getName(store, podOwner);
+    const solidProjectLinkPre = document.createElement('span');
+    solidProjectLinkPre.innerText = '. For more info, check out ';
+    const solidProjectLink = document.createElement('a');
+    solidProjectLink.href = options && options.solidProjectUrl ? options.solidProjectUrl : DEFAULT_SOLID_PROJECT_URL;
+    solidProjectLink.innerText = options && options.solidProjectName ? options.solidProjectName : DEFAULT_SOLID_PROJECT_NAME;
+    const solidProjectLinkPost = document.createElement('span');
+    solidProjectLinkPost.innerText = '.';
+    profileLinkContainer.appendChild(podLinkPre);
+    profileLinkContainer.appendChild(podLink);
+    profileLinkContainer.appendChild(profileLinkPre);
+    profileLinkContainer.appendChild(profileLink);
+    profileLinkContainer.appendChild(solidProjectLinkPre);
+    profileLinkContainer.appendChild(solidProjectLink);
+    profileLinkContainer.appendChild(solidProjectLinkPost);
+    return profileLinkContainer;
+}
+//# sourceMappingURL=index.js.map

package/dist/footer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/footer/index.ts"],"names":[],"mappings":"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"}

package/dist/header/empty-profile.js

@@ -0,0 +1,11 @@
+export const emptyProfile = `
+<svg xmlns="http://www.w3.org/2000/svg" width="26" height="26" viewBox="0 0 26 26" fill="none">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M13 25C19.6274 25 25 19.6274 25 13C25 6.37258 19.6274 1 13 1C6.37258 1 1 6.37258 1 13C1 19.6274 6.37258 25 13 25Z" fill="#D8D8D8" stroke="#8B8B8B"/>
+    <mask id="mask0" mask-type="alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="26" height="26">
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M13 25C19.6274 25 25 19.6274 25 13C25 6.37258 19.6274 1 13 1C6.37258 1 1 6.37258 1 13C1 19.6274 6.37258 25 13 25Z" fill="white" stroke="white"/>
+    </mask>
+    <g mask="url(#mask0)">
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M17.0468 10.4586C17.0468 14.4979 15.4281 16.9214 12.9999 16.9214C10.5718 16.9214 8.95298 14.4979 8.95298 10.4586C8.95298 6.41931 12.9999 6.41931 12.9999 6.41931C12.9999 6.41931 17.0468 6.41931 17.0468 10.4586ZM4.09668 23.3842C6.52483 17.7293 12.9999 17.7293 12.9999 17.7293C12.9999 17.7293 19.475 17.7293 21.9031 23.3842C21.9031 23.3842 17.8481 25 12.9999 25C8.15169 25 4.09668 23.3842 4.09668 23.3842Z" fill="#8B8B8B"/>
+    </g>
+</svg>`;
+//# sourceMappingURL=empty-profile.js.map

package/dist/header/empty-profile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-profile.js","sourceRoot":"","sources":["../../src/header/empty-profile.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,YAAY,GAAG;;;;;;;;;OASrB,CAAA"}

package/dist/header/index.js

@@ -0,0 +1,260 @@
+import { icons } from '../index';
+import { authn, authSession } from 'solid-logic';
+import { loginStatusBox } from '../login/login';
+// import { loginStatusBox, authSession, currentUser } from '../authn/authn'
+import * as widgets from '../widgets';
+import { style } from '../style';
+import { emptyProfile } from './empty-profile';
+import { getPod, throttle } from '../utils/headerFooterHelpers';
+/**
+ * menu icons
+*/
+const DEFAULT_HELP_MENU_ICON = icons.iconBase + 'noun_help.svg';
+const DEFAUL_SOLID_ICON_URL = 'https://solidproject.org/assets/img/solid-emblem.svg';
+/**
+ * Initialize header component, the header object returned depends on whether the user is authenticated.
+ * @param store the data store
+ * @param userMenuList a list of menu items when the user is logged in
+ * @param options allow the header to be customized with a personalized logo, help icon and a help menu list of links or buttons.
+ * @returns a header for an authenticated user with menu items given or a login screen
+ */
+export async function initHeader(store, userMenuList, options) {
+    const header = document.getElementById('PageHeader');
+    if (!header) {
+        return;
+    }
+    const pod = getPod();
+    rebuildHeader(header, store, pod, userMenuList, options)();
+    authSession.events.on('logout', rebuildHeader(header, store, pod, userMenuList, options));
+    authSession.events.on('login', rebuildHeader(header, store, pod, userMenuList, options));
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function rebuildHeader(header, store, pod, userMenuList, options) {
+    return async () => {
+        const user = authn.currentUser();
+        header.innerHTML = '';
+        header.appendChild(await createBanner(store, pod, user, userMenuList, options));
+    };
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export async function createBanner(store, pod, user, userMenuList, options) {
+    const podLink = document.createElement('a');
+    podLink.href = pod.uri;
+    podLink.setAttribute('style', style.headerBannerLink);
+    const image = document.createElement('img');
+    if (options) {
+        image.src = options.logo ? options.logo : DEFAUL_SOLID_ICON_URL;
+    }
+    image.setAttribute('style', style.headerBannerIcon);
+    podLink.appendChild(image);
+    const userMenu = user
+        ? await createUserMenu(store, user, userMenuList)
+        : createLoginSignUpButtons();
+    const banner = document.createElement('div');
+    banner.setAttribute('style', style.headerBanner);
+    banner.appendChild(podLink);
+    const leftSideOfHeader = document.createElement('div');
+    leftSideOfHeader.setAttribute('style', style.headerBannerRightMenu);
+    leftSideOfHeader.appendChild(userMenu);
+    if (options && options.helpMenuList) {
+        const helpMenu = createHelpMenu(options, options.helpMenuList);
+        leftSideOfHeader.appendChild(helpMenu);
+    }
+    banner.appendChild(leftSideOfHeader);
+    return banner;
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function createHelpMenu(options, helpMenuItems) {
+    if (!helpMenuItems)
+        return;
+    const helpMenuList = document.createElement('ul');
+    helpMenuList.setAttribute('style', style.headerUserMenuList);
+    helpMenuItems.forEach(function (menuItem) {
+        const menuItemType = menuItem.url ? 'url' : 'onclick';
+        if (menuItemType === 'url') {
+            helpMenuList.appendChild(createUserMenuItem(createUserMenuLink(menuItem.label, menuItem.url, menuItem.target)));
+        }
+        else {
+            helpMenuList.appendChild(createUserMenuItem(createUserMenuButton(menuItem.label, menuItem.onclick)));
+        }
+    });
+    const helpMenu = document.createElement('nav');
+    helpMenu.setAttribute('style', style.headerUserMenuNavigationMenuNotDisplayed);
+    helpMenu.setAttribute('aria-hidden', 'true');
+    helpMenu.setAttribute('id', 'helperNav');
+    helpMenu.appendChild(helpMenuList);
+    const helpMenuContainer = document.createElement('div');
+    helpMenuContainer.setAttribute('style', style.headerBannerUserMenu);
+    helpMenuContainer.appendChild(helpMenu);
+    const helpMenuTrigger = document.createElement('button');
+    helpMenuTrigger.setAttribute('style', style.headerUserMenuTrigger);
+    helpMenuTrigger.type = 'button';
+    const helpMenuIcon = document.createElement('img');
+    helpMenuIcon.src = (options && options.helpIcon) ? options.helpIcon : icons.iconBase + DEFAULT_HELP_MENU_ICON;
+    helpMenuIcon.setAttribute('style', style.headerUserMenuTriggerImg);
+    helpMenuContainer.appendChild(helpMenuTrigger);
+    helpMenuTrigger.appendChild(helpMenuIcon);
+    const throttledMenuToggle = throttle((event) => toggleMenu(event, helpMenuTrigger, helpMenu), 50);
+    helpMenuTrigger.addEventListener('click', throttledMenuToggle);
+    let timer = setTimeout(() => null, 0);
+    helpMenuContainer.addEventListener('mouseover', event => {
+        clearTimeout(timer);
+        throttledMenuToggle(event);
+        const nav = document.getElementById('helperNav');
+        nav === null || nav === void 0 ? void 0 : nav.setAttribute('style', style.headerUserMenuNavigationMenu);
+    });
+    helpMenuContainer.addEventListener('mouseout', event => {
+        timer = setTimeout(() => throttledMenuToggle(event), 200);
+        const nav = document.getElementById('helperNav');
+        nav === null || nav === void 0 ? void 0 : nav.setAttribute('style', style.headerUserMenuNavigationMenuNotDisplayed);
+    });
+    return helpMenuContainer;
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function createLoginSignUpButtons() {
+    const profileLoginButtonPre = document.createElement('div');
+    profileLoginButtonPre.setAttribute('style', style.headerBannerLogin);
+    profileLoginButtonPre.appendChild(loginStatusBox(document, null, {}));
+    return profileLoginButtonPre;
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function createUserMenuButton(label, onClick) {
+    const button = document.createElement('button');
+    button.setAttribute('style', style.headerUserMenuButton);
+    button.onmouseover = function () {
+        button.setAttribute('style', style.headerUserMenuButtonHover);
+    };
+    button.onmouseout = function () {
+        button.setAttribute('style', style.headerUserMenuButton);
+    };
+    button.addEventListener('click', onClick);
+    button.innerText = label;
+    return button;
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function createUserMenuLink(label, href, target) {
+    const link = document.createElement('a');
+    link.setAttribute('style', style.headerUserMenuLink);
+    link.onmouseover = function () {
+        link.setAttribute('style', style.headerUserMenuLinkHover);
+    };
+    link.onmouseout = function () {
+        link.setAttribute('style', style.headerUserMenuLink);
+    };
+    link.href = href;
+    link.innerText = label;
+    if (target)
+        link.target = target;
+    return link;
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export async function createUserMenu(store, user, userMenuList) {
+    const fetcher = store.fetcher;
+    if (fetcher) {
+        // Making sure that Profile is loaded before building menu
+        await fetcher.load(user);
+    }
+    const loggedInMenuList = document.createElement('ul');
+    loggedInMenuList.setAttribute('style', style.headerUserMenuList);
+    if (userMenuList) {
+        userMenuList.forEach(function (menuItem) {
+            const menuItemType = menuItem.url ? 'url' : 'onclick';
+            if (menuItemType === 'url') {
+                loggedInMenuList.appendChild(createUserMenuItem(createUserMenuLink(menuItem.label, menuItem.url, menuItem.target)));
+            }
+            else {
+                loggedInMenuList.appendChild(createUserMenuItem(createUserMenuButton(menuItem.label, menuItem.onclick)));
+            }
+        });
+    }
+    const loggedInMenu = document.createElement('nav');
+    loggedInMenu.setAttribute('style', style.headerUserMenuNavigationMenuNotDisplayed);
+    loggedInMenu.setAttribute('aria-hidden', 'true');
+    loggedInMenu.setAttribute('id', 'loggedInNav');
+    loggedInMenu.appendChild(loggedInMenuList);
+    const loggedInMenuTrigger = document.createElement('button');
+    loggedInMenuTrigger.setAttribute('style', style.headerUserMenuTrigger);
+    loggedInMenuTrigger.type = 'button';
+    const profileImg = getProfileImg(store, user);
+    if (typeof profileImg === 'string') {
+        loggedInMenuTrigger.innerHTML = profileImg;
+    }
+    else {
+        loggedInMenuTrigger.appendChild(profileImg);
+    }
+    const loggedInMenuContainer = document.createElement('div');
+    loggedInMenuContainer.setAttribute('style', style.headerBannerUserMenuNotDisplayed);
+    loggedInMenuContainer.appendChild(loggedInMenuTrigger);
+    loggedInMenuContainer.appendChild(loggedInMenu);
+    const throttledMenuToggle = throttle((event) => toggleMenu(event, loggedInMenuTrigger, loggedInMenu), 50);
+    loggedInMenuTrigger.addEventListener('click', throttledMenuToggle);
+    let timer = setTimeout(() => null, 0);
+    loggedInMenuContainer.addEventListener('mouseover', event => {
+        clearTimeout(timer);
+        throttledMenuToggle(event);
+        const nav = document.getElementById('loggedInNav');
+        nav === null || nav === void 0 ? void 0 : nav.setAttribute('style', style.headerUserMenuNavigationMenu);
+    });
+    loggedInMenuContainer.addEventListener('mouseout', event => {
+        timer = setTimeout(() => throttledMenuToggle(event), 200);
+        const nav = document.getElementById('loggedInNav');
+        nav === null || nav === void 0 ? void 0 : nav.setAttribute('style', style.headerUserMenuNavigationMenuNotDisplayed);
+    });
+    return loggedInMenuContainer;
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function createUserMenuItem(child) {
+    const menuProfileItem = document.createElement('li');
+    menuProfileItem.setAttribute('style', style.headerUserMenuListItem);
+    menuProfileItem.appendChild(child);
+    return menuProfileItem;
+}
+/**
+ * @ignore exporting this only for the unit test
+ */
+export function getProfileImg(store, user) {
+    let profileUrl = null;
+    try {
+        profileUrl = widgets.findImage(user);
+        if (!profileUrl) {
+            return emptyProfile;
+        }
+    }
+    catch {
+        return emptyProfile;
+    }
+    const profileImage = document.createElement('div');
+    profileImage.setAttribute('style', style.headerUserMenuPhoto);
+    profileImage.style.backgroundImage = `url(${profileUrl})`;
+    return profileImage;
+}
+/**
+ * @internal
+ */
+function toggleMenu(event, trigger, menu) {
+    const isExpanded = trigger.getAttribute('aria-expanded') === 'true';
+    const expand = event.type === 'mouseover';
+    const close = event.type === 'mouseout';
+    if ((isExpanded && expand) || (!isExpanded && close)) {
+        return;
+    }
+    trigger.setAttribute('aria-expanded', (!isExpanded).toString());
+    menu.setAttribute('aria-hidden', isExpanded.toString());
+}
+//# sourceMappingURL=index.js.map