Nefarious Planetary Meddling

    TypeScript icon, indicating that this package has built-in type declarations

    0.2.1 • Public • Published


    React has a difficult story with web components. Their documentation shows the simplest possible example but more than likely you will want to pass more than strings to your component. If you want to know what the story is without the bindings go here:

    With bindings the web components get wrapped in a React component and then immediately become available as React Components. Some of the advantages of doing this are that you get types for your components. One of the main issues with React is that react does not propertly pass properties to web components. Out of the box React can only pass strings and numbers to components and it cannot listen to custom events. With the bindings the components appear as though they are React components and all properties get passed correctly including functions, objects, and arrays. The bindings also account for custom events by creating a prop called ‘on’. These allow React developers to interact with the web components as though they are React components.

    AnywhereUI components for React

    These are AnyehereUI Web Components specifically build for React.


    The css dependencies should be imported in index.js file

    import "@anywhere-ui/core/dist/anywhere-ui/anywhere-ui.css";


    Add this package to your project:

    npm install @anywhere-ui/react


    yarn add @anywhere-ui/react

    Import the component(s) you want to use:

    import { AnyCheckbox } from "@anywhere-ui/react";

    Use it in your JSX as any React component:

    <AnyCheckbox checked="true" label="React"></AnyCheckbox>


    AnywhereUI Config provides a way to change the properties of components globally across an app. It can set the ripple effect, app mode, animations, and more.

    Global Config

    To override the initial AnywhereUI config for the app, provide a config in setupAnywhereUIReact method in the App.js file.

    import { setupAnywhereUIReact } from "@anywhere-ui/react";
      rippleEffect: true,

    Config Options

    Below is a list of config options that AnywhereUI uses.

    Config Type Default Description
    rippleEffect boolean true If true adds ripple effect to the components.


    npm run build

    How to release a new version

    • Build the core package
    • Run build on this package
    • Publish


    npm i @anywhere-ui/react

    DownloadsWeekly Downloads






    Unpacked Size

    44.2 kB

    Total Files


    Last publish


    • gjovanovicst