@navinc/base-react-components/dist/loading-dots.js

Nav's Pattern Library

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { addClassNameTo } from './add-classname-to.js';
import { styledBackwardsCompatibility } from './styled-backwards-compatibility.js';
import { cn } from './cn.js';
import { isKeyOf } from '@navinc/utils';
export const Dot = addClassNameTo('div', /* cn */ 'my-[0.25em] mx-[0.3em] rounded-full h-[0.5em] w-[0.5em] bg-current');
export const DotWrapper = addClassNameTo('div', /* cn */ 'flex');
const Dot1 = addClassNameTo(Dot, /* cn */ 'animate-[fadeOut_1.5s_ease_infinite]');
const Dot2 = addClassNameTo(Dot, /* cn */ 'animate-[fadeOut_1.5s_ease_0.15s_infinite]');
const Dot3 = addClassNameTo(Dot, /* cn */ 'animate-[fadeOut_1.5s_ease_0.3s_infinite]');
export const Wrapper = styledBackwardsCompatibility(DotWrapper);
const colorClassNames = {
    purple: 'text-primary',
    white: 'text-surfaceBright',
};
/**
```
<LoadingDots />
```

To change the color of the LoadingDots

```
<LoadingDots variation="purple">
```

The dots will take on the color assigned via the `variation` property.

*/
export const LoadingDots = styledBackwardsCompatibility((_a) => {
    var { dotColor } = _a, props = __rest(_a, ["dotColor"]);
    return (_jsxs(Wrapper, Object.assign({}, props, { className: cn(isKeyOf(dotColor, colorClassNames) && colorClassNames[dotColor], props.className), children: [_jsx(Dot1, {}), _jsx(Dot2, {}), _jsx(Dot3, {})] })));
});
//# sourceMappingURL=loading-dots.js.map