Narcissistic Piano Mover

    ember-casl

    0.1.0 • Public • Published

    ember-casl

    Ember addon for CASL which makes it easy to add permissions in any Ember application.

    This package allows to integrate @casl/ability with Ember application.

    It provides:

    • Ability service that allows you to define CASL ability compatible with Ember tracked properties.
    • Can/Cannot component that allow to hide or show UI elements based on user ability to see them.

    Compatibility

    • Ember.js v3.20 or above
    • Ember CLI v3.20 or above
    • Node.js v10 or above
    • ember-auto-import v2.0 or above

    Installation

    ember install ember-casl
    

    Usage

    Ability Service

    Define ability like regular Ember services by extending AbilityService.

    // services/post-ability.js
    import { tracked } from '@glimmer/tracking';
    import AbilityService from 'ember-casl/services/ability';
    
    export default class PostAbility extends AbilityService {
      @tracked isWriter = false;
    
      get definition() {
        return ({ can, cannot }) => {
          can('read', 'post');
          if (this.isWriter) {
            can('write', 'post');
          } else {
            cannot('write', 'post').because("You're not a writer");
          }
        };
      }
    }

    The definition getter should return a function taking destructured AbilityBuilder as argument (build excluded).

    It allows you to define very complex reactive ability (eg. Ability based on tracked property or another service).

    Your newly created Ability service expose some fields

    Name Type Description
    ability CASL Ability Original CASL Ability
    can Method Wrapper on CASL Ability method can
    cannot Method Wrapper on CASL Ability method cannot
    relevantRuleFor Method Wrapper on CASL Ability method relevantRuleFor

    Then you can use those abilities as regular services in your Ember application.

    // components/dummy.js
    import Component from '@glimmer/component';
    import { inject as service } from '@ember/service';
    
    export default class Dummy Component extends Component {
      @service postAbility;
    
      get canRead() {
        return this.postAbility.can('read', 'post');
      }
    
      get cannotWriteReason() {
        return this.postAbility.relevantRuleFor('read', 'post').reason;
      }
    }

    Can / Cannot Helpers

    You can use can & cannot helpers in your templates.

    {{#if (can 'read' 'post' service='post-ability')}}
      <span>You're a reader</span>
    {{/if}}
    {{#if (cannot 'write' 'post' service='post-ability')}}
      <span>You're not a writer</span>
    {{/if}}

    Positional params are CASL Ability can / cannot arguments. service is the name of the Ember service.

    Contributing

    See the Contributing guide for details.

    License

    This project is licensed under the MIT License.

    Install

    npm i ember-casl

    DownloadsWeekly Downloads

    3

    Version

    0.1.0

    License

    MIT

    Unpacked Size

    13.2 kB

    Total Files

    16

    Last publish

    Collaborators

    • ctjhoa
    • npmjs-concordnow