npm - solid-ui - Versions diffs - 2.4.22-9fa9e801 → 2.4.22-a07bb683 - Mend

solid-ui 2.4.22-9fa9e801 → 2.4.22-a07bb683

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 (13) hide show

package/lib/tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tabs.js","names":["ContainerElement","HTMLElement","TabWidgetElement","TabElement","tabWidget","options","subject","dom","document","orientation","parseInt","backgroundColor","flipped","vertical","onClose","getColors","selectedColor","color","bodyMainStyle","rootElement","createElement","setAttribute","navElement","appendChild","mainElement","tabContainer","tabElement","bodyContainer","corners","cornersPrepped","concat","slice","cornersStyle","join","margins","marginsPrepped","marginsStyle","paddingStyle","tabStyle","unselectedStyle","selectedStyle","shownStyle","hiddenStyle","refresh","orderedSync","startEmpty","children","length","selectedTab","selectedTab0","Array","from","map","tab","firstChild","find","dataset","name","selectedTabURI","uri","selectedTab1","clickMe","click","addCancelButton","onCloseSet","existingCancelButton","querySelector","removeChild","extraTab","classList","add","tabCancelButton","cancelButton","getAttribute","getItems","items","ordered","store","the","predicate","elements","each","makeNewSlot","item","ele","div","ellipsis","textContent","onclick","resetTabStyle","resetBodyStyle","bodyTR","bodyMain","getOrCreateContainerElement","renderMain","asSettings","innerHTML","renderTabSettings","renderTab","label","newBodyMain","slot","i","j","left","right","differ","sameTerm","insertables","newSlot","newBodyDiv","insertBefore","contains","isLight","colorBlend","a","b","mix","ca","cb","res","str","hex","res2","split","h","l","x","total"],"sources":["../src/tabs.ts"],"sourcesContent":["import { cancelButton } from './widgets'\nimport { label } from './utils'\nimport { NamedNode } from 'rdflib'\nimport { store } from 'solid-logic'\n\n/*\n @ignore\n /\nclass ContainerElement extends HTMLElement {\n asSettings?: boolean\n}\n\ntype TabWidgetOptions = {\n backgroundColor?: string;\n dom?: HTMLDocument;\n items?: Array<NamedNode>;\n onClose?: (event: Event) => void;\n ordered?: boolean;\n orientation?: '0' \| '1' \| '2' \| '3';\n predicate?: NamedNode;\n renderMain?: (bodyMain: HTMLElement, subject: NamedNode) => void;\n renderTab?: (tabDiv: HTMLButtonElement, subject: NamedNode) => void;\n renderTabSettings?: (bodyMain: ContainerElement, subject: NamedNode) => void;\n selectedTab?: NamedNode;\n startEmpty?: boolean;\n subject?: NamedNode;\n};\n\nexport class TabWidgetElement extends HTMLElement {\n bodyContainer?: HTMLElement\n refresh?: () => void\n tabContainer?: HTMLElement\n}\n\n/\n @ignore\n /\nclass TabElement extends HTMLElement {\n bodyTR?: HTMLElement\n subject?: NamedNode\n}\n\n/\n Use this widget to generate tabs from triples set in the global store.\n \n [Here you can see examples of the tabs](https://solidos.github.io/solid-ui/examples/tabs/).\n \n It assumes that items to use for tabs will be in a collection by default,\n * e.g.:\n \n ```turtle\n * :subject :predicate ( :item1 :item2 ) .\n * ```\n \n You can override this by setting `ordered: false`, in which case it expects\n * unordered triples:\n \n ```turtle\n * :subject :predicate :item1, :item 2 .\n * ```\n \n Triples that are not ordered in collection are in principle not sorted,\n * which means that tabs could change order every time you render the widget.\n * But in this case the widget will try to sort it in order to keep it\n * consistent.\n \n In both of these cases you need to define options `subject` and `predicate`\n * to tell the widget which triples it should be looking for.\n \n Finally you can set items manually, using the `items` option, e.g.:\n \n ```javascript\n * {\n * items: [\n * namedNode('https://domain.tld/#item1'),\n * namedNode('https://domain.tld/#item2')\n * ]\n * }\n * ```\n \n When you set items manually you do not need to set `subject` and\n * `predicate`.\n \n In any case you probably want to set the renderMain option to specify\n * what should be rendered for the various items, e.g.:\n \n ```javascript\n * {\n * renderMain: (bodyMain, subject) => {\n * bodyMain.innerHTML = renderItem(subject)\n * }\n * }\n * ```\n \n Note: `renderItem` is a custom function that you need to define yourself.\n \n The option `renderTabSettings` allows you to render a custom view in the\n * body container that is shown when you hold the ALT key and click on a\n * tab. It works very much like the `renderMain` option:\n \n ```javascript\n * {\n * renderTabSettings: (bodyMain, subject) => {\n * bodyMain.innerHTML = renderTabSettings(subject)\n * }\n * }\n * ```\n \n Note: `renderTabSettings` is a custom function that you need to define\n * yourself.\n \n By default the widget will try to guess the label by using the\n * [[utils.label]] function. If you want to customize this yourself, you can\n * use the `renderTab` option:\n \n ```javascript\n * {\n * renderTab: (tabDiv, subject) => {\n * tabDiv.innerText = renderTabText(subject)\n * }\n * }\n * ```\n \n Note: `renderTabText` is a custom function you need to define yourself.\n \n The option renderTab is also important if you want to set which tab should\n * be selected once the widget is rendered. By default it will simply select\n * the first tab, but you can override by setting `dataset.name` on the tab\n * and referring to the same string in `selectedTab`:\n \n ```javascript\n * {\n * renderTab: (tabDiv, subject) => {\n * tabDiv.dataset.name = subject.uri\n * },\n * selectedTab: item2.uri\n * }\n * ```\n \n You can apply a color to use for tabs and border of the container by using\n * option `background-color`. This is #ddddcc by default.\n \n You can override the document object that the widget uses to generate DOM\n * elements by setting the option `dom`. This is encouraged to set if you\n * intend your functionality to be used in environments that don't provide\n * a global `document` object.\n \n If you want to render a close button next to the tabs you can set option\n * `onClose` which takes a callback function that is triggered when the\n * button is clicked:\n \n ```javascript\n * {\n * onClose: (event) => {\n * // do something that hides the widget altogether\n * }\n * }\n * ```\n \n The option `orientation` allows you to set which side the tabs should be\n * located: `'0'` = Top, `'1'` = Left, `'2'` = Bottom, `'3'` = Right\n \n If you don't want to render anything in the body container by default,\n * you can set the option `startEmpty` to `true`.\n \n @param options\n /\nexport function tabWidget (options: TabWidgetOptions) {\n const subject = options.subject\n const dom = options.dom \|\| document\n const orientation = parseInt(options.orientation \|\| '0')\n const backgroundColor = options.backgroundColor \|\| '#ddddcc'\n const flipped = orientation & 2\n const vertical = orientation & 1\n const onClose = options.onClose\n\n const [selectedColor, color] = getColors(backgroundColor)\n const bodyMainStyle = `flex: 2; width: auto; height: 100%; border: 0.1em; border-style: solid; border-color: ${selectedColor}; padding: 1em;`\n const rootElement: TabWidgetElement = dom.createElement('div') // 20200117a\n\n rootElement.setAttribute(\n 'style',\n 'display: flex; height: 100%; width: 100%; flex-direction: ' +\n (vertical ? 'row' : 'column') +\n (flipped ? '-reverse;' : ';')\n )\n\n const navElement = rootElement.appendChild(dom.createElement('nav'))\n navElement.setAttribute('style', 'margin: 0;')\n\n const mainElement = rootElement.appendChild(dom.createElement('main'))\n\n mainElement.setAttribute('style', 'margin: 0; width:100%; height: 100%;') // override tabbedtab.css\n const tabContainer = navElement.appendChild(dom.createElement('ul'))\n tabContainer.setAttribute(\n 'style',\n `\n list-style-type: none;\n display: flex;\n height: 100%;\n width: 100%;\n margin: 0;\n padding: 0;\n flex-direction: ${vertical ? 'column' : 'row'}\n `\n )\n\n const tabElement = 'li'\n\n const bodyContainer = mainElement\n rootElement.tabContainer = tabContainer\n rootElement.bodyContainer = bodyContainer\n\n const corners = ['0.2em', '0.2em', '0', '0'] // top left, TR, BR, BL\n const cornersPrepped = corners.concat(corners).slice(orientation, orientation + 4)\n const cornersStyle = `border-radius: ${cornersPrepped.join(' ')};`\n\n const margins = ['0.3em', '0.3em', '0', '0.3em'] // top, right, bottom, left\n const marginsPrepped = margins.concat(margins).slice(orientation, orientation + 4)\n const marginsStyle = `margin: ${marginsPrepped.join(' ')};`\n\n const paddingStyle = `padding: ${marginsPrepped.join(' ')};`\n\n const tabStyle = cornersStyle + `position: relative; padding: 0.7em; max-width: 20em; color: ${color};`\n const unselectedStyle = `${\n tabStyle + marginsStyle\n } opacity: 50%; background-color: ${backgroundColor};`\n const selectedStyle = `${tabStyle + marginsStyle} background-color: ${selectedColor};`\n const shownStyle = 'height: 100%; width: 100%;'\n const hiddenStyle = shownStyle + 'display: none;'\n rootElement.refresh = orderedSync\n orderedSync()\n\n if (!options.startEmpty && tabContainer.children.length && options.selectedTab) {\n const selectedTab0 = Array.from(tabContainer.children) // Version left for compatability with ??\n .map((tab) => tab.firstChild as HTMLElement)\n .find((tab) => tab.dataset.name === options.selectedTab)\n\n const selectedTabURI = options.selectedTab.uri\n const selectedTab1 = Array.from(tabContainer.children)\n // @ts-ignore\n .find(\n (tab) =>\n (tab as TabElement).subject &&\n // @ts-ignore\n (tab as TabElement).subject.uri &&\n // @ts-ignore\n (tab as TabElement).subject.uri === selectedTabURI\n )\n\n const tab = selectedTab1 \|\| selectedTab0 \|\| (tabContainer.children[0] as HTMLButtonElement)\n const clickMe = tab.firstChild\n // @ts-ignore\n if (clickMe) clickMe.click()\n } else if (!options.startEmpty) {\n (tabContainer.children[0].firstChild as HTMLButtonElement).click() // Open first tab\n }\n return rootElement\n\n function addCancelButton (tabContainer) {\n if (tabContainer.dataset.onCloseSet) {\n // @@ TODO: this is only here to make the browser tests work\n // Discussion at https://github.com/solidos/solid-ui/pull/110#issuecomment-527080663\n const existingCancelButton = tabContainer.querySelector('.unstyled')\n tabContainer.removeChild(existingCancelButton)\n }\n const extraTab = dom.createElement(tabElement)\n extraTab.classList.add('unstyled')\n const tabCancelButton = cancelButton(dom, onClose)\n tabCancelButton.setAttribute('style', tabCancelButton.getAttribute('style') + paddingStyle)\n extraTab.appendChild(tabCancelButton)\n tabContainer.appendChild(extraTab)\n tabContainer.dataset.onCloseSet = 'true'\n }\n\n function getItems (): Array<NamedNode> {\n if (options.items) return options.items\n if (options.ordered !== false) {\n // options.ordered defaults to true\n return (store.the(subject, options.predicate) as any).elements\n } else {\n return store.each(subject, options.predicate) as any\n }\n }\n\n function makeNewSlot (item: NamedNode) {\n const ele = dom.createElement(tabElement) as TabElement\n ele.setAttribute('style', unselectedStyle)\n ele.subject = item\n const div = ele.appendChild(dom.createElement('button'))\n div.setAttribute('style', 'background: none; border: none; font: inherit; cursor: pointer')\n const ellipsis = dom.createElement('button')\n ellipsis.textContent = '...'\n ellipsis.setAttribute('style', 'position: absolute; right: 0; bottom: 0; width: 20%; background: none; color: inherit; border: none; padding: 0; font: inherit; cursor: pointer; outline: inherit;')\n\n div.onclick = function () {\n resetTabStyle()\n resetBodyStyle()\n ele.setAttribute('style', selectedStyle)\n if (!ele.bodyTR) return\n ele.bodyTR.setAttribute('style', shownStyle)\n const bodyMain = getOrCreateContainerElement(ele)\n if (options.renderMain && ele.subject && bodyMain.asSettings !== false) {\n bodyMain.innerHTML = 'loading item ...' + item\n options.renderMain(bodyMain, ele.subject)\n bodyMain.asSettings = false\n }\n }\n ellipsis.onclick = function () {\n resetTabStyle()\n resetBodyStyle()\n ele.setAttribute('style', selectedStyle)\n if (!ele.bodyTR) return\n ele.bodyTR.setAttribute('style', shownStyle)\n const bodyMain = getOrCreateContainerElement(ele)\n if (options.renderTabSettings && ele.subject && bodyMain.asSettings !== true) {\n bodyMain.innerHTML = 'loading settings ...' + item\n options.renderTabSettings(bodyMain, ele.subject)\n bodyMain.asSettings = true\n }\n }\n\n if (options.renderTab) {\n options.renderTab(div, item)\n ele.appendChild(ellipsis)\n } else {\n div.innerHTML = label(item)\n ele.appendChild(ellipsis)\n }\n return ele\n\n function getOrCreateContainerElement (ele: TabElement): ContainerElement {\n const bodyMain = ele.bodyTR?.children[0] as ContainerElement\n if (bodyMain) return bodyMain\n const newBodyMain = ele.bodyTR!.appendChild(dom.createElement('main'))\n newBodyMain.setAttribute('style', bodyMainStyle)\n return newBodyMain\n }\n }\n\n // @@ Use common one from utils?\n function orderedSync () {\n const items = getItems()\n let slot: TabElement, i, j, left, right\n let differ = false\n // Find how many match at each end\n for (left = 0; left < tabContainer.children.length; left++) {\n slot = tabContainer.children[left] as TabElement\n if (left >= items.length \|\| (slot.subject && !slot.subject.sameTerm(items[left]))) {\n differ = true\n break\n }\n }\n if (!differ && items.length === tabContainer.children.length) {\n return // The two just match in order: a case to optimize for\n }\n for (right = tabContainer.children.length - 1; right >= 0; right--) {\n slot = tabContainer.children[right] as TabElement\n j = right - tabContainer.children.length + items.length\n if (slot.subject && !slot.subject.sameTerm(items[j])) {\n break\n }\n }\n // The elements left ... right in tabContainer.children do not match\n const insertables = items.slice(left, right - tabContainer.children.length + items.length + 1)\n while (right >= left) {\n // remove extra\n tabContainer.removeChild(tabContainer.children[left])\n bodyContainer.removeChild(bodyContainer.children[left])\n right -= 1\n }\n for (i = 0; i < insertables.length; i++) {\n const newSlot = makeNewSlot(insertables[i])\n const newBodyDiv = dom.createElement('div')\n newSlot.bodyTR = newBodyDiv\n if (left === tabContainer.children.length) {\n // None left of original on right\n tabContainer.appendChild(newSlot)\n bodyContainer.appendChild(newBodyDiv)\n } else {\n tabContainer.insertBefore(newSlot, tabContainer.children[left + i])\n bodyContainer.insertBefore(newBodyDiv, bodyContainer.children[left + i])\n }\n }\n if (onClose) {\n addCancelButton(tabContainer)\n }\n }\n\n function resetTabStyle () {\n for (let i = 0; i < tabContainer.children.length; i++) {\n const tab = tabContainer.children[i]\n if (tab.classList.contains('unstyled')) {\n continue\n } else {\n tab.setAttribute('style', unselectedStyle)\n }\n }\n }\n\n function resetBodyStyle () {\n for (let i = 0; i < bodyContainer.children.length; i++) {\n bodyContainer.children[i].setAttribute('style', hiddenStyle)\n }\n }\n}\n\n/\n @internal\n /\nfunction getColors (backgroundColor: string): [string, string] {\n return isLight(backgroundColor)\n ? [colorBlend(backgroundColor, '#ffffff', 0.3), '#000000']\n : [colorBlend(backgroundColor, '#000000', 0.3), '#ffffff']\n}\n\n/\n @internal\n /\nfunction colorBlend (a: string, b: string, mix: number): string {\n let ca, cb, res\n let str = '#'\n const hex = '0123456789abcdef'\n for (let i = 0; i < 3; i++) {\n ca = parseInt(a.slice(i 2 + 1, i * 2 + 3), 16)\n cb = parseInt(b.slice(i * 2 + 1, i * 2 + 3), 16)\n res = ca * (1.0 - mix) + cb * mix // @@@ rounding\n const res2 = parseInt(('' + res).split('.')[0]) // @@ ugh\n const h = parseInt(('' + res2 / 16).split('.')[0]) // @@ ugh\n const l = parseInt(('' + (res2 % 16)).split('.')[0]) // @@ ugh\n str += hex[h] + hex[l]\n }\n return str\n}\n\n/*\n @internal\n /\nfunction isLight (x: string): boolean {\n let total = 0\n for (let i = 0; i < 3; i++) {\n total += parseInt(x.slice(i 2 + 1, i * 2 + 3), 16)\n }\n return total > 128 * 3\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AAEA;;;;;;AAEA;AACA;AACA;IACMA,gB;;;;;;;;;;;;;;;;;;;;kDAAyBC,W;;IAoBlBC,gB;;;;;;;;;;;;;;;;;;;;;;kDAAyBD,W;AAMtC;AACA;AACA;;;;;IACME,U;;;;;;;;;;;;;;;;;;;;;kDAAmBF,W;AAKzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASG,SAAT,CAAoBC,OAApB,EAA+C;EACpD,IAAMC,OAAO,GAAGD,OAAO,CAACC,OAAxB;EACA,IAAMC,GAAG,GAAGF,OAAO,CAACE,GAAR,IAAeC,QAA3B;EACA,IAAMC,WAAW,GAAGC,QAAQ,CAACL,OAAO,CAACI,WAAR,IAAuB,GAAxB,CAA5B;EACA,IAAME,eAAe,GAAGN,OAAO,CAACM,eAAR,IAA2B,SAAnD;EACA,IAAMC,OAAO,GAAGH,WAAW,GAAG,CAA9B;EACA,IAAMI,QAAQ,GAAGJ,WAAW,GAAG,CAA/B;EACA,IAAMK,OAAO,GAAGT,OAAO,CAACS,OAAxB;;EAEA,iBAA+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"}
1	+ {"version":3,"file":"tabs.js","names":["ContainerElement","HTMLElement","TabWidgetElement","TabElement","tabWidget","options","subject","dom","document","orientation","parseInt","backgroundColor","flipped","vertical","onClose","getColors","selectedColor","color","bodyMainStyle","rootElement","createElement","setAttribute","navElement","appendChild","mainElement","tabContainer","tabElement","bodyContainer","corners","cornersPrepped","concat","slice","cornersStyle","join","margins","marginsPrepped","marginsStyle","paddingStyle","tabStyle","unselectedStyle","selectedStyle","shownStyle","hiddenStyle","refresh","orderedSync","startEmpty","children","length","selectedTab","selectedTab0","Array","from","map","tab","firstChild","find","dataset","name","selectedTabURI","uri","selectedTab1","clickMe","click","addCancelButton","onCloseSet","existingCancelButton","querySelector","removeChild","extraTab","classList","add","tabCancelButton","cancelButton","getAttribute","getItems","items","ordered","store","the","predicate","elements","each","makeNewSlot","item","ele","div","onclick","resetTabStyle","resetBodyStyle","bodyTR","bodyMain","getOrCreateContainerElement","renderMain","asSettings","innerHTML","renderTabSettings","ellipsis","textContent","renderTab","label","newBodyMain","slot","i","j","left","right","differ","sameTerm","insertables","newSlot","newBodyDiv","insertBefore","contains","isLight","colorBlend","a","b","mix","ca","cb","res","str","hex","res2","split","h","l","x","total"],"sources":["../src/tabs.ts"],"sourcesContent":["import { cancelButton } from './widgets'\nimport { label } from './utils'\nimport { NamedNode } from 'rdflib'\nimport { store } from 'solid-logic'\n\n/*\n @ignore\n /\nclass ContainerElement extends HTMLElement {\n asSettings?: boolean\n}\n\ntype TabWidgetOptions = {\n backgroundColor?: string;\n dom?: HTMLDocument;\n items?: Array<NamedNode>;\n onClose?: (event: Event) => void;\n ordered?: boolean;\n orientation?: '0' \| '1' \| '2' \| '3';\n predicate?: NamedNode;\n renderMain?: (bodyMain: HTMLElement, subject: NamedNode) => void;\n renderTab?: (tabDiv: HTMLButtonElement, subject: NamedNode) => void;\n renderTabSettings?: (bodyMain: ContainerElement, subject: NamedNode) => void;\n selectedTab?: NamedNode;\n startEmpty?: boolean;\n subject?: NamedNode;\n};\n\nexport class TabWidgetElement extends HTMLElement {\n bodyContainer?: HTMLElement\n refresh?: () => void\n tabContainer?: HTMLElement\n}\n\n/\n @ignore\n /\nclass TabElement extends HTMLElement {\n bodyTR?: HTMLElement\n subject?: NamedNode\n}\n\n/\n Use this widget to generate tabs from triples set in the global store.\n \n [Here you can see examples of the tabs](https://solidos.github.io/solid-ui/examples/tabs/).\n \n It assumes that items to use for tabs will be in a collection by default,\n * e.g.:\n \n ```turtle\n * :subject :predicate ( :item1 :item2 ) .\n * ```\n \n You can override this by setting `ordered: false`, in which case it expects\n * unordered triples:\n \n ```turtle\n * :subject :predicate :item1, :item 2 .\n * ```\n \n Triples that are not ordered in collection are in principle not sorted,\n * which means that tabs could change order every time you render the widget.\n * But in this case the widget will try to sort it in order to keep it\n * consistent.\n \n In both of these cases you need to define options `subject` and `predicate`\n * to tell the widget which triples it should be looking for.\n \n Finally you can set items manually, using the `items` option, e.g.:\n \n ```javascript\n * {\n * items: [\n * namedNode('https://domain.tld/#item1'),\n * namedNode('https://domain.tld/#item2')\n * ]\n * }\n * ```\n \n When you set items manually you do not need to set `subject` and\n * `predicate`.\n \n In any case you probably want to set the renderMain option to specify\n * what should be rendered for the various items, e.g.:\n \n ```javascript\n * {\n * renderMain: (bodyMain, subject) => {\n * bodyMain.innerHTML = renderItem(subject)\n * }\n * }\n * ```\n \n Note: `renderItem` is a custom function that you need to define yourself.\n \n The option `renderTabSettings` allows you to render a custom view in the\n * body container that is shown when you hold the ALT key and click on a\n * tab. It works very much like the `renderMain` option:\n \n ```javascript\n * {\n * renderTabSettings: (bodyMain, subject) => {\n * bodyMain.innerHTML = renderTabSettings(subject)\n * }\n * }\n * ```\n \n Note: `renderTabSettings` is a custom function that you need to define\n * yourself.\n \n By default the widget will try to guess the label by using the\n * [[utils.label]] function. If you want to customize this yourself, you can\n * use the `renderTab` option:\n \n ```javascript\n * {\n * renderTab: (tabDiv, subject) => {\n * tabDiv.innerText = renderTabText(subject)\n * }\n * }\n * ```\n \n Note: `renderTabText` is a custom function you need to define yourself.\n \n The option renderTab is also important if you want to set which tab should\n * be selected once the widget is rendered. By default it will simply select\n * the first tab, but you can override by setting `dataset.name` on the tab\n * and referring to the same string in `selectedTab`:\n \n ```javascript\n * {\n * renderTab: (tabDiv, subject) => {\n * tabDiv.dataset.name = subject.uri\n * },\n * selectedTab: item2.uri\n * }\n * ```\n \n You can apply a color to use for tabs and border of the container by using\n * option `background-color`. This is #ddddcc by default.\n \n You can override the document object that the widget uses to generate DOM\n * elements by setting the option `dom`. This is encouraged to set if you\n * intend your functionality to be used in environments that don't provide\n * a global `document` object.\n \n If you want to render a close button next to the tabs you can set option\n * `onClose` which takes a callback function that is triggered when the\n * button is clicked:\n \n ```javascript\n * {\n * onClose: (event) => {\n * // do something that hides the widget altogether\n * }\n * }\n * ```\n \n The option `orientation` allows you to set which side the tabs should be\n * located: `'0'` = Top, `'1'` = Left, `'2'` = Bottom, `'3'` = Right\n \n If you don't want to render anything in the body container by default,\n * you can set the option `startEmpty` to `true`.\n \n @param options\n /\nexport function tabWidget (options: TabWidgetOptions) {\n const subject = options.subject\n const dom = options.dom \|\| document\n const orientation = parseInt(options.orientation \|\| '0')\n const backgroundColor = options.backgroundColor \|\| '#ddddcc'\n const flipped = orientation & 2\n const vertical = orientation & 1\n const onClose = options.onClose\n\n const [selectedColor, color] = getColors(backgroundColor)\n const bodyMainStyle = `flex: 2; width: auto; height: 100%; border: 0.1em; border-style: solid; border-color: ${selectedColor}; padding: 1em;`\n const rootElement: TabWidgetElement = dom.createElement('div') // 20200117a\n\n rootElement.setAttribute(\n 'style',\n 'display: flex; height: 100%; width: 100%; flex-direction: ' +\n (vertical ? 'row' : 'column') +\n (flipped ? '-reverse;' : ';')\n )\n\n const navElement = rootElement.appendChild(dom.createElement('nav'))\n navElement.setAttribute('style', 'margin: 0;')\n\n const mainElement = rootElement.appendChild(dom.createElement('main'))\n\n mainElement.setAttribute('style', 'margin: 0; width:100%; height: 100%;') // override tabbedtab.css\n const tabContainer = navElement.appendChild(dom.createElement('ul'))\n tabContainer.setAttribute(\n 'style',\n `\n list-style-type: none;\n display: flex;\n height: 100%;\n width: 100%;\n margin: 0;\n padding: 0;\n flex-direction: ${vertical ? 'column' : 'row'}\n `\n )\n\n const tabElement = 'li'\n\n const bodyContainer = mainElement\n rootElement.tabContainer = tabContainer\n rootElement.bodyContainer = bodyContainer\n\n const corners = ['0.2em', '0.2em', '0', '0'] // top left, TR, BR, BL\n const cornersPrepped = corners.concat(corners).slice(orientation, orientation + 4)\n const cornersStyle = `border-radius: ${cornersPrepped.join(' ')};`\n\n const margins = ['0.3em', '0.3em', '0', '0.3em'] // top, right, bottom, left\n const marginsPrepped = margins.concat(margins).slice(orientation, orientation + 4)\n const marginsStyle = `margin: ${marginsPrepped.join(' ')};`\n\n const paddingStyle = `padding: ${marginsPrepped.join(' ')};`\n\n const tabStyle = cornersStyle + `position: relative; padding: 0.7em; max-width: 20em; color: ${color};`\n const unselectedStyle = `${\n tabStyle + marginsStyle\n } opacity: 50%; background-color: ${backgroundColor};`\n const selectedStyle = `${tabStyle + marginsStyle} background-color: ${selectedColor};`\n const shownStyle = 'height: 100%; width: 100%;'\n const hiddenStyle = shownStyle + 'display: none;'\n rootElement.refresh = orderedSync\n orderedSync()\n\n if (!options.startEmpty && tabContainer.children.length && options.selectedTab) {\n const selectedTab0 = Array.from(tabContainer.children) // Version left for compatability with ??\n .map((tab) => tab.firstChild as HTMLElement)\n .find((tab) => tab.dataset.name === options.selectedTab)\n\n const selectedTabURI = options.selectedTab.uri\n const selectedTab1 = Array.from(tabContainer.children)\n // @ts-ignore\n .find(\n (tab) =>\n (tab as TabElement).subject &&\n // @ts-ignore\n (tab as TabElement).subject.uri &&\n // @ts-ignore\n (tab as TabElement).subject.uri === selectedTabURI\n )\n\n const tab = selectedTab1 \|\| selectedTab0 \|\| (tabContainer.children[0] as HTMLButtonElement)\n const clickMe = tab.firstChild\n // @ts-ignore\n if (clickMe) clickMe.click()\n } else if (!options.startEmpty) {\n (tabContainer.children[0].firstChild as HTMLButtonElement).click() // Open first tab\n }\n return rootElement\n\n function addCancelButton (tabContainer) {\n if (tabContainer.dataset.onCloseSet) {\n // @@ TODO: this is only here to make the browser tests work\n // Discussion at https://github.com/solidos/solid-ui/pull/110#issuecomment-527080663\n const existingCancelButton = tabContainer.querySelector('.unstyled')\n tabContainer.removeChild(existingCancelButton)\n }\n const extraTab = dom.createElement(tabElement)\n extraTab.classList.add('unstyled')\n const tabCancelButton = cancelButton(dom, onClose)\n tabCancelButton.setAttribute('style', tabCancelButton.getAttribute('style') + paddingStyle)\n extraTab.appendChild(tabCancelButton)\n tabContainer.appendChild(extraTab)\n tabContainer.dataset.onCloseSet = 'true'\n }\n\n function getItems (): Array<NamedNode> {\n if (options.items) return options.items\n if (options.ordered !== false) {\n // options.ordered defaults to true\n return (store.the(subject, options.predicate) as any).elements\n } else {\n return store.each(subject, options.predicate) as any\n }\n }\n\n function makeNewSlot (item: NamedNode) {\n const ele = dom.createElement(tabElement) as TabElement\n ele.setAttribute('style', unselectedStyle)\n ele.subject = item\n const div = ele.appendChild(dom.createElement('button'))\n div.setAttribute('style', 'background: none; border: none; font: inherit; cursor: pointer')\n\n div.onclick = function () {\n resetTabStyle()\n resetBodyStyle()\n ele.setAttribute('style', selectedStyle)\n if (!ele.bodyTR) return\n ele.bodyTR.setAttribute('style', shownStyle)\n const bodyMain = getOrCreateContainerElement(ele)\n if (options.renderMain && ele.subject && bodyMain.asSettings !== false) {\n bodyMain.innerHTML = 'loading item ...' + item\n options.renderMain(bodyMain, ele.subject)\n bodyMain.asSettings = false\n }\n }\n\n if (options.renderTabSettings && ele.subject) {\n const ellipsis = dom.createElement('button')\n ellipsis.textContent = '...'\n ellipsis.setAttribute('style', 'position: absolute; right: 0; bottom: 0; width: 20%; background: none; color: inherit; border: none; padding: 0; font: inherit; cursor: pointer; outline: inherit;')\n\n ellipsis.onclick = function () {\n resetTabStyle()\n resetBodyStyle()\n ele.setAttribute('style', selectedStyle)\n if (!ele.bodyTR) return\n ele.bodyTR.setAttribute('style', shownStyle)\n const bodyMain = getOrCreateContainerElement(ele)\n if (options.renderTabSettings && ele.subject && bodyMain.asSettings !== true) {\n bodyMain.innerHTML = 'loading settings ...' + item\n options.renderTabSettings(bodyMain, ele.subject)\n bodyMain.asSettings = true\n }\n }\n ele.appendChild(ellipsis)\n }\n\n if (options.renderTab) {\n options.renderTab(div, item)\n } else {\n div.innerHTML = label(item)\n }\n return ele\n\n function getOrCreateContainerElement (ele: TabElement): ContainerElement {\n const bodyMain = ele.bodyTR?.children[0] as ContainerElement\n if (bodyMain) return bodyMain\n const newBodyMain = ele.bodyTR!.appendChild(dom.createElement('main'))\n newBodyMain.setAttribute('style', bodyMainStyle)\n return newBodyMain\n }\n }\n\n // @@ Use common one from utils?\n function orderedSync () {\n const items = getItems()\n let slot: TabElement, i, j, left, right\n let differ = false\n // Find how many match at each end\n for (left = 0; left < tabContainer.children.length; left++) {\n slot = tabContainer.children[left] as TabElement\n if (left >= items.length \|\| (slot.subject && !slot.subject.sameTerm(items[left]))) {\n differ = true\n break\n }\n }\n if (!differ && items.length === tabContainer.children.length) {\n return // The two just match in order: a case to optimize for\n }\n for (right = tabContainer.children.length - 1; right >= 0; right--) {\n slot = tabContainer.children[right] as TabElement\n j = right - tabContainer.children.length + items.length\n if (slot.subject && !slot.subject.sameTerm(items[j])) {\n break\n }\n }\n // The elements left ... right in tabContainer.children do not match\n const insertables = items.slice(left, right - tabContainer.children.length + items.length + 1)\n while (right >= left) {\n // remove extra\n tabContainer.removeChild(tabContainer.children[left])\n bodyContainer.removeChild(bodyContainer.children[left])\n right -= 1\n }\n for (i = 0; i < insertables.length; i++) {\n const newSlot = makeNewSlot(insertables[i])\n const newBodyDiv = dom.createElement('div')\n newSlot.bodyTR = newBodyDiv\n if (left === tabContainer.children.length) {\n // None left of original on right\n tabContainer.appendChild(newSlot)\n bodyContainer.appendChild(newBodyDiv)\n } else {\n tabContainer.insertBefore(newSlot, tabContainer.children[left + i])\n bodyContainer.insertBefore(newBodyDiv, bodyContainer.children[left + i])\n }\n }\n if (onClose) {\n addCancelButton(tabContainer)\n }\n }\n\n function resetTabStyle () {\n for (let i = 0; i < tabContainer.children.length; i++) {\n const tab = tabContainer.children[i]\n if (tab.classList.contains('unstyled')) {\n continue\n } else {\n tab.setAttribute('style', unselectedStyle)\n }\n }\n }\n\n function resetBodyStyle () {\n for (let i = 0; i < bodyContainer.children.length; i++) {\n bodyContainer.children[i].setAttribute('style', hiddenStyle)\n }\n }\n}\n\n/\n @internal\n /\nfunction getColors (backgroundColor: string): [string, string] {\n return isLight(backgroundColor)\n ? [colorBlend(backgroundColor, '#ffffff', 0.3), '#000000']\n : [colorBlend(backgroundColor, '#000000', 0.3), '#ffffff']\n}\n\n/\n @internal\n /\nfunction colorBlend (a: string, b: string, mix: number): string {\n let ca, cb, res\n let str = '#'\n const hex = '0123456789abcdef'\n for (let i = 0; i < 3; i++) {\n ca = parseInt(a.slice(i 2 + 1, i * 2 + 3), 16)\n cb = parseInt(b.slice(i * 2 + 1, i * 2 + 3), 16)\n res = ca * (1.0 - mix) + cb * mix // @@@ rounding\n const res2 = parseInt(('' + res).split('.')[0]) // @@ ugh\n const h = parseInt(('' + res2 / 16).split('.')[0]) // @@ ugh\n const l = parseInt(('' + (res2 % 16)).split('.')[0]) // @@ ugh\n str += hex[h] + hex[l]\n }\n return str\n}\n\n/*\n @internal\n /\nfunction isLight (x: string): boolean {\n let total = 0\n for (let i = 0; i < 3; i++) {\n total += parseInt(x.slice(i 2 + 1, i * 2 + 3), 16)\n }\n return total > 128 * 3\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AAEA;;;;;;AAEA;AACA;AACA;IACMA,gB;;;;;;;;;;;;;;;;;;;;kDAAyBC,W;;IAoBlBC,gB;;;;;;;;;;;;;;;;;;;;;;kDAAyBD,W;AAMtC;AACA;AACA;;;;;IACME,U;;;;;;;;;;;;;;;;;;;;;kDAAmBF,W;AAKzB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACO,SAASG,SAAT,CAAoBC,OAApB,EAA+C;EACpD,IAAMC,OAAO,GAAGD,OAAO,CAACC,OAAxB;EACA,IAAMC,GAAG,GAAGF,OAAO,CAACE,GAAR,IAAeC,QAA3B;EACA,IAAMC,WAAW,GAAGC,QAAQ,CAACL,OAAO,CAACI,WAAR,IAAuB,GAAxB,CAA5B;EACA,IAAME,eAAe,GAAGN,OAAO,CAACM,eAAR,IAA2B,SAAnD;EACA,IAAMC,OAAO,GAAGH,WAAW,GAAG,CAA9B;EACA,IAAMI,QAAQ,GAAGJ,WAAW,GAAG,CAA/B;EACA,IAAMK,OAAO,GAAGT,OAAO,CAACS,OAAxB;;EAEA,iBAA+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"}

package/lib/versionInfo.js CHANGED Viewed

@@ -5,12 +5,12 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.versionInfo = void 0;
 var versionInfo = {
-  buildTime: '2022-07-04T11:51:02Z',
-  commit: '9fa9e801c7eb2c3eeff41227eb1c1eed7297eace',
+  buildTime: '2022-08-22T15:14:37Z',
+  commit: 'a07bb6833c1ef4b4fd73774ff7524083cabad75d',
   npmInfo: {
     'solid-ui': '2.4.22',
     npm: '8.13.2',
-    node: '14.19.3',
+    node: '14.20.0',
     v8: '8.4.371.23-node.87',
     uv: '1.42.0',
     zlib: '1.2.11',
@@ -19,8 +19,8 @@ var versionInfo = {
     modules: '83',
     nghttp2: '1.42.0',
     napi: '8',
-    llhttp: '2.1.4',
-    openssl: '1.1.1o',
+    llhttp: '2.1.5',
+    openssl: '1.1.1q',
     cldr: '40.0',
     icu: '70.1',
     tz: '2021a3',

package/lib/versionInfo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"versionInfo.js","names":["versionInfo","buildTime","commit","npmInfo","npm","node","v8","uv","zlib","brotli","ares","modules","nghttp2","napi","llhttp","openssl","cldr","icu","tz","unicode"],"sources":["../src/versionInfo.ts"],"sourcesContent":["export const versionInfo = {\n buildTime: '2022-07-~~04T11~~:51:~~02Z~~',\n commit: '~~9fa9e801c7eb2c3eeff41227eb1c1eed7297eace~~',\n npmInfo:\n{\n 'solid-ui': '2.4.22',\n npm: '8.13.2',\n node: '14.19.3',\n v8: '8.4.371.23-node.87',\n uv: '1.42.0',\n zlib: '1.2.11',\n brotli: '1.0.9',\n ares: '1.18.1',\n modules: '83',\n nghttp2: '1.42.0',\n napi: '8',\n llhttp: '2.1.4',\n openssl: '1.1.1o',\n cldr: '40.0',\n icu: '70.1',\n tz: '2021a3',\n unicode: '14.0'\n}\n}\n"],"mappings":";;;;;;AAAO,IAAMA,WAAW,GAAG;EACzBC,SAAS,EAAE,sBADc;EAEzBC,MAAM,EAAE,0CAFiB;EAGzBC,OAAO,EACT;IACE,YAAY,QADd;IAEEC,GAAG,EAAE,QAFP;IAGEC,IAAI,EAAE,SAHR;IAIEC,EAAE,EAAE,oBAJN;IAKEC,EAAE,EAAE,QALN;IAMEC,IAAI,EAAE,QANR;IAOEC,MAAM,EAAE,OAPV;IAQEC,IAAI,EAAE,QARR;IASEC,OAAO,EAAE,IATX;IAUEC,OAAO,EAAE,QAVX;IAWEC,IAAI,EAAE,GAXR;IAYEC,MAAM,EAAE,OAZV;IAaEC,OAAO,EAAE,QAbX;IAcEC,IAAI,EAAE,MAdR;IAeEC,GAAG,EAAE,MAfP;IAgBEC,EAAE,EAAE,QAhBN;IAiBEC,OAAO,EAAE;EAjBX;AAJ2B,CAApB"}
1	+ {"version":3,"file":"versionInfo.js","names":["versionInfo","buildTime","commit","npmInfo","npm","node","v8","uv","zlib","brotli","ares","modules","nghttp2","napi","llhttp","openssl","cldr","icu","tz","unicode"],"sources":["../src/versionInfo.ts"],"sourcesContent":["export const versionInfo = {\n buildTime: '2022-08-22T15:14:37Z',\n commit: 'a07bb6833c1ef4b4fd73774ff7524083cabad75d',\n npmInfo:\n{\n 'solid-ui': '2.4.22',\n npm: '8.13.2',\n node: '14.20.0',\n v8: '8.4.371.23-node.87',\n uv: '1.42.0',\n zlib: '1.2.11',\n brotli: '1.0.9',\n ares: '1.18.1',\n modules: '83',\n nghttp2: '1.42.0',\n napi: '8',\n llhttp: '2.1.5',\n openssl: '1.1.1q',\n cldr: '40.0',\n icu: '70.1',\n tz: '2021a3',\n unicode: '14.0'\n}\n}\n"],"mappings":";;;;;;AAAO,IAAMA,WAAW,GAAG;EACzBC,SAAS,EAAE,sBADc;EAEzBC,MAAM,EAAE,0CAFiB;EAGzBC,OAAO,EACT;IACE,YAAY,QADd;IAEEC,GAAG,EAAE,QAFP;IAGEC,IAAI,EAAE,SAHR;IAIEC,EAAE,EAAE,oBAJN;IAKEC,EAAE,EAAE,QALN;IAMEC,IAAI,EAAE,QANR;IAOEC,MAAM,EAAE,OAPV;IAQEC,IAAI,EAAE,QARR;IASEC,OAAO,EAAE,IATX;IAUEC,OAAO,EAAE,QAVX;IAWEC,IAAI,EAAE,GAXR;IAYEC,MAAM,EAAE,OAZV;IAaEC,OAAO,EAAE,QAbX;IAcEC,IAAI,EAAE,MAdR;IAeEC,GAAG,EAAE,MAfP;IAgBEC,EAAE,EAAE,QAhBN;IAiBEC,OAAO,EAAE;EAjBX;AAJ2B,CAApB"}

package/lib/widgets/forms.js CHANGED Viewed

@@ -1092,7 +1092,7 @@ _fieldFunction.field[ns.ui('Choice').uri] = function (dom, container, already, s
     var possibleProperties;
     possible = kb.each(undefined, ns.rdf('type'), uiFrom, formDoc);
-    for (var x in kb.findMembersNT(uiFrom)) {
+    for (var x in findMembersNT(kb, uiFrom, dataDoc)) {
       possible.push(kb.fromNT(x));
     } // Use rdfs
@@ -1142,6 +1142,7 @@ _fieldFunction.field[ns.ui('Choice').uri] = function (dom, container, already, s
   var multiSelect = kb.any(form, ui('multiselect')); // Optional
+  if (multiSelect) opts.multiSelect = true;
   var selector;
   rhs.refresh = function () {
@@ -1178,7 +1179,31 @@ _fieldFunction.field[ns.ui('Choice').uri] = function (dom, container, already, s
         }
         if (event.action === 'ADD_OPTION') {
-          selectedOptions.push(event.value);
+          var stringValue = event.value + '';
+          if (stringValue.includes('Create new')) {
+            var newObject = newThing(dataDoc);
+            var is = [];
+            is.push($rdf.st(subject, property, kb.sym(newObject), dataDoc));
+            if (uiFrom) is.push($rdf.st(newObject, ns.rdf('type'), kb.sym(uiFrom), dataDoc));
+            if (subForm) {
+              addSubFormChoice(dom, rhs, {}, $rdf.sym(newObject), subForm, dataDoc, function (ok, body) {
+                if (ok) {
+                  kb.updater.update([], is, function (uri, success, errorBody) {
+                    if (!success) rhs.appendChild((0, _error.errorMessageBlock)(dom, 'Error updating select: ' + errorBody));
+                  });
+                  selectedOptions.push(newObject);
+                  if (callbackFunction) callbackFunction(ok, {
+                    widget: 'select',
+                    event: 'new'
+                  });
+                } else {
+                  rhs.appendChild((0, _error.errorMessageBlock)(dom, 'Error updating data in field of select: ' + body));
+                }
+              });
+            }
+          } else selectedOptions.push(event.value);
         }
         selector.update(selectedOptions);
@@ -2063,7 +2088,7 @@ function makeSelectForChoice(dom, container, kb, subject, predicate, inputPossib
       if (opt.selected && opt.AJAR_mint) {
         // not sure if this 'if' is used because I cannot find mintClass
         if (options.mintClass) {
-          var thisForm = promptForNew(dom, kb, subject, predicate, options.mintClass, null, dataDoc, function (ok, body) {
+          var thisForm = promptForNew(dom, kb, subject, predicate, uiFrom, options.subForm, dataDoc, function (ok, body) {
             if (!ok) {
               callbackFunction(ok, body, {
                 change: 'new'
@@ -2098,7 +2123,7 @@ function makeSelectForChoice(dom, container, kb, subject, predicate, inputPossib
     log.info('selectForOptions: data doc = ' + dataDoc);
-    if (select.currentURI && options.subForm) {
+    if (select.currentURI && options.subForm && !options.multiSelect) {
       addSubFormChoice(dom, container, {}, $rdf.sym(select.currentURI), options.subForm, dataDoc, function (ok, body) {
         if (ok) {
           kb.updater.update([], is, function (uri, success, errorBody) {
@@ -2164,5 +2189,69 @@ function containsObject(obj, list) {
   }
   return false;
+} // This functions replaces the findMembersNT (thisClass) from rdflib until we fix: https://github.com/linkeddata/rdflib.js/issues/565
+/**
+ * For anything which has thisClass (or any subclass) as its type,
+ * or is the object of something which has thisClass (or any subclass) as its range,
+ * or subject of something which has thisClass (or any subclass) as its domain
+ * We don't bother doing subproperty (yet?) as it doesn't seem to be used
+ * much.
+ * Get all the Classes of which we can RDFS-infer the subject is a member
+ * @return a hash of URIs
+ */
+function findMembersNT(store, thisClass, quad) {
+  var len2;
+  var len4;
+  var m;
+  var pred;
+  var ref1;
+  var ref2;
+  var ref3;
+  var ref4;
+  var ref5;
+  var st;
+  var u;
+  var seeds = {};
+  seeds[thisClass.toNT()] = true;
+  var members = {};
+  var ref = store.transitiveClosure(seeds, store.rdfFactory.namedNode('http://www.w3.org/2000/01/rdf-schema#subClassOf'), true);
+  for (var t in ref) {
+    ref1 = store.statementsMatching(null, store.rdfFactory.namedNode('http://www.w3.org/1999/02/22-rdf-syntax-ns#type'), store.fromNT(t), quad);
+    for (var i = 0, len = ref1.length; i < len; i++) {
+      st = ref1[i];
+      members[st.subject.toNT()] = st;
+    }
+    ref2 = store.each(null, store.rdfFactory.namedNode('http://www.w3.org/2000/01/rdf-schema#domain'), store.fromNT(t), quad);
+    for (var l = 0, len1 = ref2.length; l < len1; l++) {
+      pred = ref2[l];
+      ref3 = store.statementsMatching(null, pred, null, quad);
+      for (m = 0, len2 = ref3.length; m < len2; m++) {
+        st = ref3[m];
+        members[st.subject.toNT()] = st;
+      }
+    }
+    ref4 = store.each(null, store.rdfFactory.namedNode('http://www.w3.org/2000/01/rdf-schema#range'), store.fromNT(t), quad);
+    for (var q = 0, len3 = ref4.length; q < len3; q++) {
+      pred = ref4[q];
+      ref5 = store.statementsMatching(null, pred, null, quad);
+      for (u = 0, len4 = ref5.length; u < len4; u++) {
+        st = ref5[u];
+        members[st.object.toNT()] = st;
+      }
+    }
+  }
+  return members;
 }
 //# sourceMappingURL=forms.js.map