{"id":14990340,"url":"https://github.com/vsm/vsm-box","last_synced_at":"2025-04-12T02:11:09.617Z","repository":{"id":55506191,"uuid":"123934932","full_name":"vsm/vsm-box","owner":"vsm","description":"Web-component for creating \u0026 showing VSM-sentences — Visual Syntax Method","archived":false,"fork":false,"pushed_at":"2021-04-09T14:12:42.000Z","size":2507,"stargazers_count":30,"open_issues_count":3,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-25T21:51:11.281Z","etag":null,"topics":["curation","knowledge-graph","knowledge-graph-construction","knowledge-representation","ontology-search","user-interface","vsm","web-component"],"latest_commit_sha":null,"homepage":"https://vsm.github.io","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"agpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vsm.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":"stcruy","patreon":"stevencruy","custom":["https://paypal.me/stcruy"]}},"created_at":"2018-03-05T14:54:31.000Z","updated_at":"2024-09-04T07:39:23.000Z","dependencies_parsed_at":"2022-08-15T02:00:47.748Z","dependency_job_id":null,"html_url":"https://github.com/vsm/vsm-box","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vsm%2Fvsm-box","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vsm%2Fvsm-box/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vsm%2Fvsm-box/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vsm%2Fvsm-box/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vsm","download_url":"https://codeload.github.com/vsm/vsm-box/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248505928,"owners_count":21115354,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["curation","knowledge-graph","knowledge-graph-construction","knowledge-representation","ontology-search","user-interface","vsm","web-component"],"created_at":"2024-09-24T14:19:54.989Z","updated_at":"2025-04-12T02:11:09.593Z","avatar_url":"https://github.com/vsm.png","language":"JavaScript","funding_links":["https://github.com/sponsors/stcruy","https://patreon.com/stevencruy","https://paypal.me/stcruy"],"categories":[],"sub_categories":[],"readme":"# vsm-box\n\n\u003c!-- badges: start --\u003e\n[![Node.js CI](https://github.com/vsm/vsm-box/workflows/Node.js%20CI/badge.svg)](https://github.com/vsm/vsm-box/actions)\n[![(will become a live badge when codecov can see inside webpack-bundled code)](https://img.shields.io/badge/coverage-high-brightgreen.svg)](https://github.com/vsm/vsm-box/actions)\n[![npm version](https://img.shields.io/npm/v/vsm-box)](https://www.npmjs.com/package/vsm-box)\n[![License](https://img.shields.io/npm/l/vsm-box?color=blue)](#license)\n[![Downloads](https://img.shields.io/npm/dm/vsm-box)](https://www.npmjs.com/package/vsm-box)\n\u003c!-- badges: end --\u003e\n\n## Intro\n\n`vsm-box` is a _web-component_ for entering and showing a _VSM-sentence_.\n\u0026nbsp;–\u0026nbsp; Explanation:\n\n- A **VSM-sentence** is a computer-understandable and potentially\n  natural-looking statement that consists of _VSM-terms_ and _VSM-connectors_.\n  Each term is a one- or few-word text string plus a linked ID.\n  The relation between all terms is clarified with just a small set\n  of connectors.\n\n- **VSM** (Visual Syntax Method) is an intuitive method to represent any knowledge\n  – on any topic, and with any amount of context details – into an elegant form\n  that is easy to understand by both humans and computers.  \n  _In more detail:_  \n  VSM is the combination of a **user-interface** and a **semantic model**,\n  that enables people to represent **diverse** and **context-rich**\n  knowledge with precision, and that enables them\n  to capture this knowledge in a way they find **intuitive** –\n  because it closely corresponds to how a piece of knowledge is represented\n  in the human mind.  \n  VSM is thus a general-purpose method for entering (or 'writing') knowledge in\n  a structured, computable form, and for viewing (or 'reading') it in that form.  \n  See [vsm.github.io](http://vsm.github.io) for all info on VSM.\n\n- A **web-component** is something that can be shown in a web page by simply\n  inserting an HTML-tag, like a `\u003cbutton\u003e`, `\u003cinput\u003e`, or here a `\u003cvsm-box\u003e`.\n\nTarget audience:\n- For web-developers who embed a vsm-box in a web-app: there are many\n  **customization** features to support the needs of various user groups.\n- For end-users: a vsm-box is an elegant and flexible interface\n  for capturing structured information –\n  and esp. easy when they can fill out _VSM-template_ sentences.\n\n\n\u003cbr\u003e\n\n## Intro example – for end users\n\nThis is a vsm-box **animated example**. Here, a user:  \n• enters two terms (linked to an ID),  \n• checks a term's definition etc. by mousehovering so a popup appears,  \n• adds a second connector – but by doing so, creates an unintended meaning\n  ('chicken with fork')  \n  \u0026nbsp; (note also: connectors get auto-sorted for optimal layout),  \n• removes that connector again,  \n• adds the second connector correctly.\n\n\u003cimg src=\"imgs/vsm-box-example.gif\" width=\"600\" alt=\"vsm-box example animation\"\u003e\n\nFor more examples, see [vsm.github.io](http://vsm.github.io).\n\n\n\u003cbr\u003e\n\n## Intro example – for web developers\n\nA concise example of how to place a vsm-box in a web-app is shown on\n[vsm.github.io](http://vsm.github.io), bottom of front page.\n\nMore elaborate examples are in the 'index*.html' files in the\n[src](https://github.com/vsm/vsm-box/tree/master/src) folder\n(see also [Build](#build) below),  \nand in the vsm [demo](https://github.com/vsm/demo) repository\n(which can be used live [here](https://vsm.github.io/demo)).\n\n\n\u003cbr\u003e\n\n## Documentation\n\nSee [Documentation.md](Documentation.md) for full technical details, including:\n\n- VSM-sentence **data-model** (and examples),\n- VsmBox input **props** (i.e. html-attributes),\n- VsmBox **emitted events**,\n- **user interaction**,\n- **customized content** (for term labels, term popups, and autocomplete panel\n  items).\n\n\u003cbr\u003e\n\n## Build\n\nThis project's configuration (webpack + npm + Vue + testing + linting) is as\ndescribed in\n[github.com/stcruy/building-a-reusable-vue-web-component](https://github.com/stcruy/building-a-reusable-vue-web-component).  \n\nThis makes `vsm-box` available as:\n1)\u0026nbsp;a standalone web-component, 2)\u0026nbsp;a slim web-component,\nand 3)\u0026nbsp;a Vue component.\n\nThe latest version's built files are available at [unpkg](https://unpkg.com/browse/vsm-box/dist/):\n- [vsm-box.standalone.min.js](https://unpkg.com/vsm-box/dist/vsm-box.standalone.min.js)\n  \u0026nbsp;(standalone;\n  use it like [here](src/index-prod-standalone.html));\n- [vsm-box.min.js](https://unpkg.com/vsm-box/dist/vsm-box.min.js)\n  \u0026nbsp;(slim, needs Vue etc. as external dependencies;\n  use it like [here](src/index-prod-slim.html)).\n\n\n\u003cbr\u003e\n\n## Creators\n\n- Created by:\n  **[Steven Vercruysse](https://github.com/stcruy)**\n  (designer of VSM, main developer of vsm-box).  \n- Contributions (design suggestions and feedback) by:  \n  [Martin Kuiper](https://github.com/makuintnu) (also project guidance and \n  outreach),\n  [John Zobolas](https://github.com/bblodfon),\n  [Vasundra Touré](https://github.com/vtoure),\n  [Maria K. Andersen](https://github.com/mariakarand).\n\n\n\u003cbr\u003e\n\n## Contributing\n\nSee [Contributing.md](CONTRIBUTING.md) for how to submit pull requests,\nand a standard text on being nice to other contributors.\n\n\n\u003cbr\u003e\n\n## License\n\nThis project is licensed under the [AGPL-3.0 license](LICENSE.md).\n\nThe AGPL license gives you the right to use the vsm-box\nand other vsm modules for free.\nBut if you modify the source code, the goal is that you\nhave to contribute those modifications back to the community.\nSo *GPL makes software stay _virally_ for-free.\n\nNote* however that it is NOT required that applications' code is\npublished if, for entering and/or showing VSM-based information,\nthey use only unchanged, not-augmented vsm modules and/or vsm\ndata formats.\nThe copyleft applies only to the vsm-box and other vsm modules.\nYour application, even though it talks to vsm-box, is a\nseparate program and \"work\".  \n*\u003cspan style=\"font-size:smaller;\"\u003e_(That\nis our interpretation and intention with AGPL, similar to how MongoDB does it.\nIf you know a legally better way to achieve this goal,\nlet us know.)_\u003c/span\u003e\u003cbr\u003e\u003cbr\u003e\n\n\u003e _Why AGPL_  \n\u003e With VSM, we aim for unification of science's efforts towards digital\n\u003e transformation of all its research findings. We want to promote\n\u003e community-building, and move forward with everyone together broadening the\n\u003e application set.  \n\u003e Because the vsm-box software directly reflects the core design of VSM, as a\n\u003e shareable semantic-data / knowledge format, we believe that modifications or\n\u003e enhancements to it must be made public as well. Otherwise a private actor could\n\u003e easily use an \"embrace, extend, extinguish\" approach to privatize an evolving\n\u003e technology that was originally meant to transform our scientific knowledge into\n\u003e a more open digital form.  \n\u003e We are inspired by the copyleft licensing that contributed to the success of\n\u003e Linux-based systems, for the same reason.\n\u003e We may revise this policy, if along the way we would learn that a most\n\u003e permissive license would give more benefit to society.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvsm%2Fvsm-box","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvsm%2Fvsm-box","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvsm%2Fvsm-box/lists"}