npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@solid/query-ldflex

v2.11.3

Published

Access Solid data pods using the LDflex language

Downloads

1,269

Readme

LDflex for Solid

Simple access to data in Solid pods through LDflex expressions

npm version Build Status Coverage Status Dependency Status

This library is a configuration of the LDflex language for the Solid ecosystem. It configures LDflex with:

  1. JSON-LD context for Solid
  2. a Solid-authenticated query engine (Comunica or rdflib.js)
  3. useful data paths for Solid

LDflex expressions occur for example on Solid React components, where they make it easy for developers to specify what data they want to show. They can also be used as an expression language in any other Solid project or framework.

Creating data paths

Once you obtain the solid.data object, start writing data paths from the following entry points.

The user entry point

The solid.data.user path can query data about the currently logged in user, such as:

  • solid.data.user.firstName yields the user's first name(s)
  • solid.data.user.email yields the user's email address(es)
  • solid.data.user.friends yields the user's friend(s)
  • solid.data.user.friends.firstName yields the user's friends' first name(s)

The any URL entry point

The solid.data[url] path can query data about any subject by URL, such as:

  • solid.data['https://ruben.verborgh.org/profile/#me'].firstName
  • solid.data['https://ruben.verborgh.org/profile/#me'].email
  • solid.data['https://ruben.verborgh.org/profile/#me'].friends
  • solid.data['https://ruben.verborgh.org/profile/#me'].friends.firstName

Specifying properties

As you can see in the above examples, an LDflex path starts with an entry point and is followed by property names, which can be:

  • abbreviations such as firstName (which expands to http://xmlns.com/foaf/0.1/givenName)
  • prefixed names such as foaf:givenName (which expands to http://xmlns.com/foaf/0.1/givenName)
  • full URLs such as http://xmlns.com/foaf/0.1/givenName

The abbreviations and prefixed names are expanded using a JSON-LD context. You can find some inspiration about what to ask for in this context.

You can access data using any vocabulary you want and, when included in the JSON-LD context, in multiple ways. For example:

  • FOAF:
    • solid.data.user.name
    • solid.data.user.foaf_name
    • solid.data.user.foaf$name
    • solid.data.user['foaf:name']
    • solid.data.user['http://xmlns.com/foaf/0.1/name']
  • vCard:
    • solid.data.user.vcard_fn
    • solid.data.user.vcard$fn
    • solid.data.user['vcard:fn']
    • solid.data.user['http://www.w3.org/2006/vcard/ns#fn']
  • Schema.org:
    • solid.data.user.schema_name
    • solid.data.user.schema$name
    • solid.data.user['schema:name']
    • solid.data.user['http://www.schema.org/name']
  • Custom:
    • solid.data.user['http://example.org/my-ontology/name']

The traditional colon syntax for prefixes (schema:name) can be substituted with an underscore (schema_name) or dollar sign (schema$name). This is because JavaScript keys with a colon require quotes (user['schema:name']) whereas underscores and dollar signs can be used freely (user.schema_name, user.schema$name).

Installation

npm install @solid/query-ldflex

Usage

Within Node.js environments

const { default: data } = require('@solid/query-ldflex');

const ruben = data['https://ruben.verborgh.org/profile/#me'];
showProfile(ruben);

async function showProfile(person) {
  const label = await person.label;
  console.log(`\nNAME: ${label}`);

  console.log('\nTYPES');
  for await (const type of person.type)
    console.log(`  - ${type}`);

  console.log('\nFRIENDS');
  for await (const name of person.friends.firstName)
    console.log(`  - ${name} is a friend`);
}

If, instead of Comunica, you want to use the rdflib.js query engine, install @ldflex/rdflib as a dependency of your project and use

const { default: data } = require('@solid/query-ldflex/lib/exports/rdflib');

When creating browser builds, it can be easier to simply tell webpack to replace @ldflex/comunica by @ldflex/rdflib.

In the browser

<script src="solid-auth-client.bundle.js"></script>
<script src="solid-query-ldflex.bundle.js"></script>
document.addEventListener('DOMContentLoaded', async () => {
  const user = solid.data.user;
  alert(`Welcome, ${await user.firstName}!`);
});

To replace Comunica by rdflib.js, opt for

<script src="solid-auth-client.bundle.js"></script>
<script src="rdflib.min.js"></script>
<script src="solid-query-ldflex.rdflib.js"></script>

Adding a custom JSON-LD context

In addition to the default properties, you might want to support your own:

console.log(solid.data.context);       // the raw default JSON-LD context
await solid.data.context.extend({      // add new JSON-LD context
  con: 'http://www.w3.org/2000/10/swap/pim/contact#',
  preferred: 'con:preferredURI',
});
console.log(await solid.data.context); // the expanded JSON-LD context

// Now we can use both existing and new properties
const ruben = solid.data['https://ruben.verborgh.org/profile/#me'];
console.log(await ruben.name);
console.log(await ruben.preferred);

Be aware though that this leads to expressions that are less portable, because they only work when the additional context is added.

Resolving string expressions

LDflex expressions are actual JavaScript—not strings. There are times when strings are more useful though, such as when building declarative components that take LDflex expressions.

The solid.data object exports a resolve interface that transforms a string expression into an actual LDflex path. This string is appended to solid.data to obtain the resulting path. For example:

  • solid.data.resolve('.user.firstName') becomes the path solid.data.user.firstName
  • solid.data.resolve('["https://example.org/"].label') becomes the path solid.data["https://example.org/"].label

For convenience, the starting dot and quotes inside of brackets can be omitted. If the path is a single URL, quotes and brackets can be omitted. The following strings will all resolve:

  • '.user.firstName'
  • 'user.firstName'
  • '["https://example.org/"].label'
  • '[https://example.org/].label'
  • 'https://example.org/'

License

©2018–present Ruben Verborgh, MIT License.