Navel Pondering Mantra


    1.3.0-alpha.5 • Public • Published

    Community Project header


    GitHub release (latest SemVer including pre-releases) Snyk

    A community-driven library of useful components for building on New Relic One's programmability platform.

    This library is built on top of and requires the 'nr1' core library available to Nerdpacks as part of running inside of the New Relic One platform, documentation on this underlying library can be found on our developer site

    Table of Contents generated with DocToc



    Install in your project:

    npm install --save @newrelic/nr1-community

    Import the component/utils into your nerdlet:

    import { DetailPanel, EmptyState, Timeline, NerdGraphError, timeRangeToNrql } from '@newrelic/nr1-community';

    Import styles into your styles.scss (or similar):

    @import '~@newrelic/nr1-community/dist/index.css'


    For complete documentation and a demo, please visit Demo and follow the instructions for viewing.


    Screenshot #1


    Screenshot #1


    Screenshot #1

    Funnel (coming soon)

    Screenshot #1


    Screenshot #1



    Screenshot #1

    bytesToSize (coming soon)

    Local Development

    The /demo folder of this project is a Nerdpack that references the local copy of the components. You are able to develop the components and see how they function in a live environment as you develop them!

    1. Open two terminals, navigate both to the root of this repository
    2. In one, start up the demo site with the following commands (Full Demo Info)
      cd demo
      npm install
      nr1 nerdpack:uuid -gf # Only needed the first time
      npm start
    1. In the other, navigate to the root of this repository and run:
      npm install
      npm start

    Note: You're running npm install twice, once for nr1-community and once for the /demo Nerdpack.

    Our bundler will watch for changes in /src and auto-build the library. The Demo Nerdpack will see these changes and perform its own live-reloading, referencing the local copy of the library.

    How do I add my component?

    Add to component library

    1. Fork this repository
    2. Create a new folder under src/components or src/utils with the name of your component (subject to review)
      1. Create a index.js so that the full path looks like src/components/<name of component>/index.js
      2. Create a that will serve as the primary documentation for your component
      3. Create a meta.json and define the props your component requires/accepts
    3. Export your component by adding an export line: export { <name of component> } from './<name of component>'; to src/components/index.js or src/utils/index.js

    Add to demo/examples

    Our goal here is to aggregate helpful information from your component, like the and the meta.json (as some structured documentation of the component) alongside live code examples. We aim to keep each component's page as similar as possible and have a pattern we'd like you to follow, the easiest approach is to reference an existing one, but if you have troubles, open a pull-request as-is and we're happy to assist.

    1. Create a new "page" (folder) in our demo Nerdpack under <location-of-repo>/demo/nerdlets/nr1-community-demo-nerdlet/pages. See existing components for a pattern to follow.
    2. Your component's folder should contain the following:
      1. An index.js
      2. An /examples directory
    3. Export your component's page in <location-of-repo>/demo/nerdlets/nr1-community-demo-nerdlet/pages/index.js like: export { default as FooComponent } from './FooComponent';
    4. Add your component to the "page list" in <location-of-repo>/demo/nerdlets/nr1-community-demo-nerdlet/index.js

    Note: You'll notice us referencing the local components with the @, this isn't new JS magic. We've extended the typical Nerdpack's webpack config with an alias @ for the "src" folder of the library to make imports a little less painful.

    Related work

    New Relic One SDK

    NewRelic Developer Site

    Boilerplate Nerdpack Layouts

    All of these and more can be found on our public Github - Layout template Nerdpacks

    Open Source License

    This project is distributed under the Apache 2 license.


    New Relic has open-sourced this project. This project is provided AS-IS WITHOUT WARRANTY OR DEDICATED SUPPORT. Issues and contributions should be reported to the project here on GitHub.

    We encourage you to bring your experiences and questions to the Explorers Hub where our community members collaborate on solutions and new ideas.


    New Relic hosts and moderates an online forum where customers can interact with New Relic employees as well as other customers to get help and share best practices. Like all official New Relic open source projects, there's a related Community topic in the New Relic Explorers Hub.

    Issues / Enhancement Requests

    Issues and enhancement requests can be submitted in the Issues tab of this repository. Please search for and review the existing open issues before submitting a new issue.


    Contributions are welcome (and if you submit a Enhancement Request, expect to be invited to contribute it yourself 😁). Please review our Contribution Guide.

    Keep in mind that when you submit your pull request, you'll need to sign the CLA via the click-through using CLA-Assistant. If you'd like to execute our corporate CLA, or if you have any questions, please drop us an email at




    npm i @newrelic/nr1-community@1.3.0-alpha.5





    Unpacked Size

    1.13 MB

    Total Files


    Last publish


    • newrelic