Permix

Solid Example

A Solid example with signal-based checks and object-aware rules

Purpose

examples/solid mirrors the React and Vue examples but uses Solid primitives. It is the clearest reference for how Permix behaves with signals and effects instead of React state or Vue refs.

What it demonstrates

  • Solid integration with PermixProvider and usePermix
  • createEffect()-driven setup after the current user resolves
  • signal-friendly isReady() and check(...) usage
  • declarative UI gating with the Solid Check component

Core idea

The permission rule is the same ownership check used in the React and Vue samples:

lib/permix.ts
edit: post => post?.authorId === user.id,

The UI reads permissions through signals:

App.tsx
{isReady() ? 'Yes' : 'No'}
{check('post', 'edit', post) ? 'Yes' : 'No'}

Run it

cd examples/solid
pnpm dev

Key files

  • src/lib/permix.ts: Solid Permix instance and generated Check
  • src/hooks/permissions.ts: Solid wrapper around usePermix
  • src/App.tsx: effect-driven setup and per-post checks

When to use it

Use this as the reference implementation when you need Solid-specific ergonomics but the same typed permission model as the React and Vue examples.

Source code

Browse the example on GitHub