Package Exports

@atlaskit/ds-lib

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@atlaskit/ds-lib) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

DSLib

This is an internal package with common functionality used in the Atlassian Design System Team. This package comes with no support and semver guarantees, your app will break if you use this directly!

Installation

yarn add @atlaskit/ds-lib

API

`noop()`

import noop from '@atlaskit/ds-lib/noop';

noop();

`useLazyRef()`

import useLazyRef from '@atlaskit/ds-lib/use-lazy-ref';

function expensiveFunction() {
  // Value returned after expensive calculations
}

function Component({ onClick }) {
  const ref = useLazyRef(() => expensiveFunction());
  return <button onClick={() => onClick(ref.current)}>Click me!</button>;
}

`useLazyCallback()`

import useLazyCallback from '@atlaskit/ds-lib/use-lazy-callback';

function Component() {
  const callback = useLazyCallback(() => {
    // `callback` always has the same reference.
    // Watch out for its stale closure however!
  });

  return null;
}

`useStateRef()`

import useStateRef from '@atlaskit/ds-lib/use-state-ref';

function Component() {
  const [valueRef, setState] = useStateRef(0);

  // Access the latest value, even inside stale closures.
  console.log(valueRef.current);

  return <div onClick={() => setState(prev => prev + 1)} />;

`useScrollbarWidth()`

import useScrollbarWidth from '@atlaskit/ds-lib/use-scrollbar-width';

function Component() {
  const scrollbar = useScrollbarWidth();

  return (
    // Use the scrollbar width in your styles/as you wish.
    // The ref should be attached to the scrollable element.
    <div id="container" style={{ padding: scrollbar.width }}>
      <div id="scrollable" ref={scrollbar.ref} />
    </div>
  );
}

`warnOnce()`

import warnOnce from '@atlaskit/ds-lib/warn-once';

function Component() {
  // Print the warning messagein in the Web console only once per session.
  if (process.env.NODE_ENV !== 'production') {
    warnOnce('This component has been deprecated.');
  }

  return <div>This component has been deprecated</div>;
}