Nanoprogrammed Penultimate Musicianship

    @elemental-ui/utils
    TypeScript icon, indicating that this package has built-in type declarations

    0.1.0 • Public • Published

    Utils

    import {
      forwardRefWithAs,
      makeId,
      useClickOutside,
      useId,
      useKeyPress,
    } from '@elemental-ui/utils';

    Use ID

    Create unique IDs in your components.

    const id = useId();
    return id; // "1"

    You can optionally pass in a consumer fallback.

    const id = useId('my-component-id');
    return id; // "my-component-id"

    Use makeId to add a prefix.

    const id = makeId('my-prefix', '4');
    return id; // "my-prefix--4"

    Forward Ref

    React.forwardRef is re-exported from @elemental-ui-alpha/utils as forwardRefWithAs with different type definitions to work with components that have an as prop. It accepts two type arguments, DefaultElementType and Props.

    import { forwardRefWithAs } from '@elemental-ui-alpha/utils';
     
    type Props = {
      color: string;
    };
     
    let Button = forwardRefWithAs<'button', Props>(
      ({ color, as: Tag = 'button', ...props }, ref) => {
        return <Tag css={{ color }} ref={ref} {...props} />;
      }
    );

    Keywords

    none

    Install

    npm i @elemental-ui/utils

    DownloadsWeekly Downloads

    3

    Version

    0.1.0

    License

    none

    Unpacked Size

    35.4 kB

    Total Files

    26

    Last publish

    Collaborators

    • dominikwilkowski
    • dsf-release-bot
    • gwyneplaine
    • jedwatson
    • jossmac
    • mitchellhamilton