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

@ui-grid/cell-nav

v4.12.4

Published

This module provides cell navigation functionality to UI-Grid

Downloads

68

Readme

UI-Grid Cell Navigation

The cell navigation plugin for UI-Grid allows you to navigate around the grid using the arrow keys, pg-down and pg-up, enter (moves down), shift-enter (moves up), tab (moves right) and shift-tab (moves left). When combined with the editable feature, the left-right arrow keys will be subsumed when in "deep edit" mode, allowing you to move around within the text you're editing. The tab key and shift-tab keys continue to function.

Getting Started

You can install @ui-grid/cellnav via:

npm i --save @ui-grid/cellnav

Once you install you need to load the respective JS and CSS files as seen bellow:

<link rel="stylesheet" href="/node_modules/@ui-grid/core/css/ui-grid.min.css" type="text/css">
<link rel="stylesheet" href="/node_modules/@ui-grid/cellnav/css/ui-grid.cellnav.min.css" type="text/css">
<script src="/node_modules/@ui-grid/core/js/ui-grid.core.min.js">
<script src="/node_modules/@ui-grid/cellnav/js/ui-grid.cellnav.min.js">

Alternatively, if you are using Webpack or RequireJS to load your dependencies, you can do the following at the top of the file that needs it:

require('@ui-grid/core');
require('@ui-grid/cellnav');

Once you load the file, you need to include 'ui.grid.cellNav' module in your angularJS app's dependencies, and add the ui-grid-cellNav directive to your grid element.

angular.module('myApp', [
    'ui.grid',
    'ui.grid.cellNav'
]);
<div ui-grid="$ctrl.gridOptions" ui-grid-cellNav>

Example

You can find an example of this plugin in action on our website

API Documentation

Documentation for this plugin is provided in the api documentation, but we recommend that you pay special attention to the following:

Issues

You can find issues that are specific to this UI-Grid plugin by looking for the label grid-cellNav in the ui-grid github issues page.

License

MIT