orcs-design-system
Version:
TeamForm's Design System, aka: ORCS
103 lines • 2.56 kB
JavaScript
import React from "react";
import Loading from ".";
import Spacer from "../Spacer";
import Box from "../Box";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export default {
title: "Components/Loading",
decorators: [storyFn => /*#__PURE__*/_jsx(Box, {
p: "r",
children: storyFn()
})],
component: Loading
};
export const defaultLoading = () => /*#__PURE__*/_jsx(Loading, {});
defaultLoading.storyName = "Default";
export const largeLoading = () => /*#__PURE__*/_jsx(Loading, {
large: true
});
largeLoading.storyName = "Large";
export const centeredLoading = () => /*#__PURE__*/_jsxs(Spacer, {
p: "r",
children: [/*#__PURE__*/_jsx(Loading, {
centered: true
}), /*#__PURE__*/_jsx(Loading, {
large: true,
centered: true
})]
});
centeredLoading.storyName = "Centered";
export const colouredLoading = () => /*#__PURE__*/_jsx(Loading, {
large: true,
primary: true
});
colouredLoading.storyName = "Coloured";
export const invertedLoading = () => /*#__PURE__*/_jsx(Box, {
bg: "greyDarkest",
p: "r",
children: /*#__PURE__*/_jsxs(Spacer, {
p: "r",
children: [/*#__PURE__*/_jsx(Loading, {
inverted: true
}), /*#__PURE__*/_jsx(Loading, {
large: true,
inverted: true
})]
})
});
invertedLoading.storyName = "Inverted";
export const aiLoading = () => /*#__PURE__*/_jsxs(Spacer, {
p: "r",
children: [/*#__PURE__*/_jsx(Loading, {
variant: "AI"
}), /*#__PURE__*/_jsx(Loading, {
variant: "AI",
large: true
})]
});
aiLoading.storyName = "AI Variant";
export const aiChatLoading = () => /*#__PURE__*/_jsxs(Spacer, {
p: "r",
children: [/*#__PURE__*/_jsx(Loading, {
variant: "AIchat"
}), /*#__PURE__*/_jsx(Loading, {
variant: "AIchat",
large: true
})]
});
aiChatLoading.storyName = "AI Chat Variant";
defaultLoading.__docgenInfo = {
"description": "",
"methods": [],
"displayName": "defaultLoading"
};
largeLoading.__docgenInfo = {
"description": "",
"methods": [],
"displayName": "largeLoading"
};
centeredLoading.__docgenInfo = {
"description": "",
"methods": [],
"displayName": "centeredLoading"
};
colouredLoading.__docgenInfo = {
"description": "",
"methods": [],
"displayName": "colouredLoading"
};
invertedLoading.__docgenInfo = {
"description": "",
"methods": [],
"displayName": "invertedLoading"
};
aiLoading.__docgenInfo = {
"description": "",
"methods": [],
"displayName": "aiLoading"
};
aiChatLoading.__docgenInfo = {
"description": "",
"methods": [],
"displayName": "aiChatLoading"
};