@grantbii/design-system 1.7.3 → 1.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/core/atoms/Overlay.d.ts +4 -0
- package/core/atoms/Overlay.js +21 -0
- package/core/atoms/Overlay.js.map +1 -0
- package/core/atoms/index.d.ts +1 -0
- package/core/atoms/index.js +1 -0
- package/core/atoms/index.js.map +1 -1
- package/core/molecules/Modal.js +2 -18
- package/core/molecules/Modal.js.map +1 -1
- package/package.json +18 -16
- package/stories/atoms/Badge.stories.js +3 -0
- package/stories/atoms/Badge.stories.js.map +1 -1
- package/stories/atoms/BrandLogo.stories.js +3 -0
- package/stories/atoms/BrandLogo.stories.js.map +1 -1
- package/stories/atoms/Button.stories.js +3 -0
- package/stories/atoms/Button.stories.js.map +1 -1
- package/stories/atoms/Checkbox.stories.js +3 -0
- package/stories/atoms/Checkbox.stories.js.map +1 -1
- package/stories/atoms/Input.stories.js +3 -0
- package/stories/atoms/Input.stories.js.map +1 -1
- package/stories/atoms/LinkButton.stories.js +3 -0
- package/stories/atoms/LinkButton.stories.js.map +1 -1
- package/stories/atoms/Overlay.stories.d.ts +7 -0
- package/stories/atoms/Overlay.stories.js +20 -0
- package/stories/atoms/Overlay.stories.js.map +1 -0
- package/stories/atoms/Textarea.stories.js +3 -0
- package/stories/atoms/Textarea.stories.js.map +1 -1
- package/stories/molecules/Badges.stories.js +3 -0
- package/stories/molecules/Badges.stories.js.map +1 -1
- package/stories/organisms/YesNoOptions.stories.js +3 -0
- package/stories/organisms/YesNoOptions.stories.js.map +1 -1
- package/stories/templates/LoadingFailedSign.stories.js +3 -0
- package/stories/templates/LoadingFailedSign.stories.js.map +1 -1
- package/tsconfig.tsbuildinfo +1 -1
- package/vitest.config.js +2 -1
- package/vitest.config.js.map +1 -1
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
declare const Overlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
2
|
+
$centerContent?: boolean;
|
|
3
|
+
}>> & string;
|
|
4
|
+
export default Overlay;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
import { Colors } from "../foundations";
|
|
3
|
+
const Overlay = styled.div `
|
|
4
|
+
display: flex;
|
|
5
|
+
flex-direction: column;
|
|
6
|
+
|
|
7
|
+
justify-content: ${({ $centerContent = false }) => $centerContent ? "center" : "normal"};
|
|
8
|
+
align-items: ${({ $centerContent = false }) => $centerContent ? "center" : "normal"};
|
|
9
|
+
|
|
10
|
+
z-index: 9999;
|
|
11
|
+
position: fixed;
|
|
12
|
+
top: 0px;
|
|
13
|
+
left: 0px;
|
|
14
|
+
|
|
15
|
+
width: 100vw;
|
|
16
|
+
height: 100vh;
|
|
17
|
+
|
|
18
|
+
background-color: ${Colors.semantic.overlay};
|
|
19
|
+
`;
|
|
20
|
+
export default Overlay;
|
|
21
|
+
//# sourceMappingURL=Overlay.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Overlay.js","sourceRoot":"","sources":["../../../core/atoms/Overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AAExC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAA8B;;;;qBAInC,CAAC,EAAE,cAAc,GAAG,KAAK,EAAE,EAAE,EAAE,CAChD,cAAc,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ;iBACvB,CAAC,EAAE,cAAc,GAAG,KAAK,EAAE,EAAE,EAAE,CAC5C,cAAc,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ;;;;;;;;;;sBAUlB,MAAM,CAAC,QAAQ,CAAC,OAAO;CAC5C,CAAC;AAEF,eAAe,OAAO,CAAC","sourcesContent":["import styled from \"styled-components\";\nimport { Colors } from \"../foundations\";\n\nconst Overlay = styled.div<{ $centerContent?: boolean }>`\n display: flex;\n flex-direction: column;\n\n justify-content: ${({ $centerContent = false }) =>\n $centerContent ? \"center\" : \"normal\"};\n align-items: ${({ $centerContent = false }) =>\n $centerContent ? \"center\" : \"normal\"};\n\n z-index: 9999;\n position: fixed;\n top: 0px;\n left: 0px;\n\n width: 100vw;\n height: 100vh;\n\n background-color: ${Colors.semantic.overlay};\n`;\n\nexport default Overlay;\n"]}
|
package/core/atoms/index.d.ts
CHANGED
|
@@ -5,5 +5,6 @@ export { default as Checkbox } from "./Checkbox";
|
|
|
5
5
|
export { default as Dropdown, type DropdownProps } from "./Dropdown";
|
|
6
6
|
export { default as Input } from "./Input";
|
|
7
7
|
export { default as LinkButton } from "./LinkButton";
|
|
8
|
+
export { default as Overlay } from "./Overlay";
|
|
8
9
|
export { default as RadioButton } from "./RadioButton";
|
|
9
10
|
export { default as Textarea } from "./Textarea";
|
package/core/atoms/index.js
CHANGED
|
@@ -5,6 +5,7 @@ export { default as Checkbox } from "./Checkbox";
|
|
|
5
5
|
export { default as Dropdown } from "./Dropdown";
|
|
6
6
|
export { default as Input } from "./Input";
|
|
7
7
|
export { default as LinkButton } from "./LinkButton";
|
|
8
|
+
export { default as Overlay } from "./Overlay";
|
|
8
9
|
export { default as RadioButton } from "./RadioButton";
|
|
9
10
|
export { default as Textarea } from "./Textarea";
|
|
10
11
|
//# sourceMappingURL=index.js.map
|
package/core/atoms/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../core/atoms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAmB,MAAM,SAAS,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAsB,MAAM,YAAY,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC","sourcesContent":["export { default as Badge, type BadgeProps } from \"./Badge\";\nexport { default as BrandLogo } from \"./BrandLogo\";\nexport { default as Button } from \"./Button\";\nexport { default as Checkbox } from \"./Checkbox\";\nexport { default as Dropdown, type DropdownProps } from \"./Dropdown\";\nexport { default as Input } from \"./Input\";\nexport { default as LinkButton } from \"./LinkButton\";\nexport { default as RadioButton } from \"./RadioButton\";\nexport { default as Textarea } from \"./Textarea\";\n"]}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../core/atoms/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAmB,MAAM,SAAS,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAsB,MAAM,YAAY,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC","sourcesContent":["export { default as Badge, type BadgeProps } from \"./Badge\";\nexport { default as BrandLogo } from \"./BrandLogo\";\nexport { default as Button } from \"./Button\";\nexport { default as Checkbox } from \"./Checkbox\";\nexport { default as Dropdown, type DropdownProps } from \"./Dropdown\";\nexport { default as Input } from \"./Input\";\nexport { default as LinkButton } from \"./LinkButton\";\nexport { default as Overlay } from \"./Overlay\";\nexport { default as RadioButton } from \"./RadioButton\";\nexport { default as Textarea } from \"./Textarea\";\n"]}
|
package/core/molecules/Modal.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useCallback, useState, } from "react";
|
|
3
3
|
import styled from "styled-components";
|
|
4
|
-
import { Button } from "../atoms";
|
|
4
|
+
import { Button, Overlay } from "../atoms";
|
|
5
5
|
import { Colors, Responsive } from "../foundations";
|
|
6
6
|
import { createPortal } from "react-dom";
|
|
7
|
-
const Modal = ({ header, content, footer, width, height, onClickClose, closeText, }) => createPortal(_jsx(Overlay, { children: _jsxs(ModalWindow, { "$width": width, "$height": height, children: [header ? _jsx(ModalHeader, { children: header }) : _jsx(_Fragment, {}), _jsx(ModalBody, { children: content }), _jsxs(ModalFooter, { children: [onClickClose ? (_jsx(CloseButton, { onClick: onClickClose, closeText: closeText })) : (_jsx(_Fragment, {})), footer ? footer : _jsx(_Fragment, {})] })] }) }), document.body);
|
|
7
|
+
const Modal = ({ header, content, footer, width, height, onClickClose, closeText, }) => createPortal(_jsx(Overlay, { "$centerContent": true, children: _jsxs(ModalWindow, { "$width": width, "$height": height, children: [header ? _jsx(ModalHeader, { children: header }) : _jsx(_Fragment, {}), _jsx(ModalBody, { children: content }), _jsxs(ModalFooter, { children: [onClickClose ? (_jsx(CloseButton, { onClick: onClickClose, closeText: closeText })) : (_jsx(_Fragment, {})), footer ? footer : _jsx(_Fragment, {})] })] }) }), document.body);
|
|
8
8
|
export default Modal;
|
|
9
9
|
export const useModal = () => {
|
|
10
10
|
const [showModal, setShowModal] = useState(false);
|
|
@@ -28,22 +28,6 @@ export const useModal = () => {
|
|
|
28
28
|
closeModal,
|
|
29
29
|
};
|
|
30
30
|
};
|
|
31
|
-
const Overlay = styled.div `
|
|
32
|
-
background-color: ${Colors.semantic.overlay};
|
|
33
|
-
|
|
34
|
-
z-index: 9999;
|
|
35
|
-
position: fixed;
|
|
36
|
-
top: 0px;
|
|
37
|
-
left: 0px;
|
|
38
|
-
|
|
39
|
-
width: 100vw;
|
|
40
|
-
height: 100vh;
|
|
41
|
-
|
|
42
|
-
display: flex;
|
|
43
|
-
flex-direction: column;
|
|
44
|
-
justify-content: center;
|
|
45
|
-
align-items: center;
|
|
46
|
-
`;
|
|
47
31
|
const ModalWindow = styled.div `
|
|
48
32
|
display: flex;
|
|
49
33
|
flex-direction: column;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../core/molecules/Modal.tsx"],"names":[],"mappings":";AAAA,OAAO,EAIL,WAAW,EACX,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"Modal.js","sourceRoot":"","sources":["../../../core/molecules/Modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n type JSX,\n type MouseEventHandler,\n type ReactNode,\n useCallback,\n useState,\n} from \"react\";\nimport styled from \"styled-components\";\nimport { Button, Overlay } from \"../atoms\";\nimport { Colors, Responsive } from \"../foundations\";\nimport { createPortal } from \"react-dom\";\n\ntype ModalProps = {\n header?: ReactNode;\n content: JSX.Element;\n footer?: ReactNode;\n width?: string;\n height?: string;\n onClickClose?: MouseEventHandler<HTMLButtonElement>;\n closeText?: string;\n};\n\nconst Modal = ({\n header,\n content,\n footer,\n width,\n height,\n onClickClose,\n closeText,\n}: ModalProps) =>\n createPortal(\n <Overlay $centerContent>\n <ModalWindow $width={width} $height={height}>\n {header ? <ModalHeader>{header}</ModalHeader> : <></>}\n\n <ModalBody>{content}</ModalBody>\n\n <ModalFooter>\n {onClickClose ? (\n <CloseButton onClick={onClickClose} closeText={closeText} />\n ) : (\n <></>\n )}\n {footer ? footer : <></>}\n </ModalFooter>\n </ModalWindow>\n </Overlay>,\n document.body,\n );\n\nexport default Modal;\n\nexport const useModal = () => {\n const [showModal, setShowModal] = useState(false);\n\n const lockScroll = useCallback(() => {\n document.body.style.overflow = \"hidden\";\n }, []);\n\n const unlockScroll = useCallback(() => {\n document.body.style.overflow = \"initial\";\n }, []);\n\n const openModal = () => {\n setShowModal(true);\n lockScroll();\n };\n\n const closeModal = () => {\n setShowModal(false);\n unlockScroll();\n };\n\n return {\n showModal,\n openModal,\n closeModal,\n };\n};\n\nconst ModalWindow = styled.div<{ $width?: string; $height?: string }>`\n display: flex;\n flex-direction: column;\n\n background-color: ${Colors.base.white};\n\n min-height: 100px;\n max-height: 100vh;\n\n @media (width < ${Responsive.WIDTH_BREAKPOINTS.laptop}) {\n position: fixed;\n bottom: 0px;\n left: 0px;\n\n width: 100%;\n height: 100%;\n\n border-radius: 0px;\n }\n\n @media (width >= ${Responsive.WIDTH_BREAKPOINTS.laptop}) {\n position: static;\n bottom: auto;\n left: auto;\n\n width: ${({ $width }) => $width};\n height: ${({ $height }) => $height};\n\n border-radius: 8px;\n }\n`;\n\nconst ModalHeader = styled.div`\n font-weight: 500;\n font-size: 18px;\n\n padding: 12px 20px;\n border-bottom: 1px solid ${Colors.neutral.grey3};\n`;\n\nconst ModalBody = styled.div`\n display: flex;\n flex-direction: column;\n\n height: 100%;\n padding-top: 12px;\n overflow-y: auto;\n\n > * {\n width: 100%;\n height: 100%;\n min-height: 100px;\n\n padding: 2px 20px;\n border: none;\n }\n`;\n\nconst ModalFooter = styled.div`\n display: flex;\n justify-content: space-between;\n gap: 12px;\n\n padding: 16px 20px;\n`;\n\ntype CloseButtonProps = {\n onClick: MouseEventHandler<HTMLButtonElement>;\n closeText?: string;\n};\n\nconst CloseButton = ({ onClick, closeText = \"Close\" }: CloseButtonProps) => (\n <Button\n label={closeText}\n onClick={onClick}\n backgroundColor={Colors.neutral.grey3}\n color={Colors.typography.blackHigh}\n />\n);\n"]}
|
package/package.json
CHANGED
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@grantbii/design-system",
|
|
3
|
-
"
|
|
3
|
+
"author": "Grantbii",
|
|
4
|
+
"license": "UNLICENSED",
|
|
5
|
+
"version": "1.8.0",
|
|
4
6
|
"description": "Grantbii's Design System",
|
|
5
7
|
"homepage": "https://design.grantbii.com",
|
|
6
8
|
"repository": {
|
|
7
9
|
"type": "git",
|
|
8
10
|
"url": "git+https://github.com/grantbii/design-system.git"
|
|
9
11
|
},
|
|
10
|
-
"license": "UNLICENSED",
|
|
11
12
|
"main": "./index.js",
|
|
12
13
|
"types": "./index.d.ts",
|
|
13
14
|
"scripts": {
|
|
@@ -19,10 +20,10 @@
|
|
|
19
20
|
"build-storybook": "storybook build"
|
|
20
21
|
},
|
|
21
22
|
"dependencies": {
|
|
22
|
-
"@grantbii/ui-core": "1.3.
|
|
23
|
+
"@grantbii/ui-core": "1.3.1",
|
|
23
24
|
"@phosphor-icons/react": "2.1.10",
|
|
24
25
|
"country-flag-icons": "1.5.21",
|
|
25
|
-
"next": "
|
|
26
|
+
"next": "16.0.0",
|
|
26
27
|
"react": "19.2.0",
|
|
27
28
|
"react-dom": "19.2.0",
|
|
28
29
|
"react-dropzone": "14.3.8",
|
|
@@ -32,27 +33,28 @@
|
|
|
32
33
|
"devDependencies": {
|
|
33
34
|
"@chromatic-com/storybook": "4.1.1",
|
|
34
35
|
"@eslint/js": "9.38.0",
|
|
35
|
-
"@next/eslint-plugin-next": "
|
|
36
|
-
"@storybook/addon-a11y": "9.1.
|
|
37
|
-
"@storybook/addon-docs": "9.1.
|
|
38
|
-
"@storybook/addon-onboarding": "9.1.
|
|
39
|
-
"@storybook/addon-vitest": "9.1.
|
|
40
|
-
"@storybook/nextjs-vite": "9.1.
|
|
36
|
+
"@next/eslint-plugin-next": "16.0.0",
|
|
37
|
+
"@storybook/addon-a11y": "9.1.15",
|
|
38
|
+
"@storybook/addon-docs": "9.1.15",
|
|
39
|
+
"@storybook/addon-onboarding": "9.1.15",
|
|
40
|
+
"@storybook/addon-vitest": "9.1.15",
|
|
41
|
+
"@storybook/nextjs-vite": "9.1.15",
|
|
41
42
|
"@types/node": "22.18.0",
|
|
42
43
|
"@types/react": "19.2.2",
|
|
43
44
|
"@types/react-dom": "19.2.2",
|
|
44
|
-
"@vitest/browser": "
|
|
45
|
-
"@vitest/
|
|
45
|
+
"@vitest/browser": "4.0.3",
|
|
46
|
+
"@vitest/browser-playwright": "4.0.3",
|
|
47
|
+
"@vitest/coverage-v8": "4.0.3",
|
|
46
48
|
"eslint": "9.38.0",
|
|
47
|
-
"eslint-config-next": "
|
|
48
|
-
"eslint-plugin-storybook": "9.1.
|
|
49
|
+
"eslint-config-next": "16.0.0",
|
|
50
|
+
"eslint-plugin-storybook": "9.1.15",
|
|
49
51
|
"husky": "9.1.7",
|
|
50
52
|
"lint-staged": "16.2.6",
|
|
51
53
|
"playwright": "1.56.1",
|
|
52
54
|
"prettier": "3.6.2",
|
|
53
|
-
"storybook": "9.1.
|
|
55
|
+
"storybook": "9.1.15",
|
|
54
56
|
"typescript": "5.9.3",
|
|
55
|
-
"vitest": "
|
|
57
|
+
"vitest": "4.0.3"
|
|
56
58
|
},
|
|
57
59
|
"lint-staged": {
|
|
58
60
|
"**/*.{html,css,json,md,yaml}": [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Badge.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC;AAGnC,MAAM,IAAI,GAAuB;IAC/B,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"Badge.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Badge.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC;AAGnC,MAAM,IAAI,GAAuB;IAC/B,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,WAAW,GAAG,OAAO,CAAC;AAC5B,MAAM,QAAQ,GAAG,6CAA6C,CAAC;AAC/D,MAAM,YAAY,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,4BAA4B,CAAC,CAAC;AAE/D,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE;QACJ,KAAK,EAAE,WAAW;KACnB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAU;IACzB,IAAI,EAAE;QACJ,IAAI,EAAE,KAAK,CAAC,eAAe;QAC3B,KAAK,EAAE,WAAW;KACnB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,KAAK,EAAE,WAAW;QAClB,YAAY;KACb;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE;QACJ,KAAK,EAAE,QAAQ;QACf,gBAAgB,EAAE,GAAG;KACtB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAU;IACrC,IAAI,EAAE;QACJ,IAAI,EAAE,KAAK,CAAC,eAAe;QAC3B,KAAK,EAAE,QAAQ;QACf,gBAAgB,EAAE,GAAG;QACrB,YAAY;KACb;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,KAAK,EAAE,UAAU;QACjB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,kBAAkB,CAAC;KACzC;CACF,CAAC","sourcesContent":["import { Badge, Icons } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof Badge> = {\n title: \"Atoms/Badge\",\n component: Badge,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nconst defaultText = \"Badge\";\nconst longText = \"the quick brown fox jumps over the lazy dog\";\nconst onClickClose = () => alert(\"You have closed the badge.\");\n\nexport const TextOnly: Story = {\n args: {\n label: defaultText,\n },\n};\n\nexport const Icon: Story = {\n args: {\n Icon: Icons.SmileyXEyesIcon,\n label: defaultText,\n },\n};\n\nexport const Closeable: Story = {\n args: {\n label: defaultText,\n onClickClose,\n },\n};\n\nexport const LongText: Story = {\n args: {\n label: longText,\n labelWidthPixels: 160,\n },\n};\n\nexport const AlmostEverything: Story = {\n args: {\n Icon: Icons.SmileyXEyesIcon,\n label: longText,\n labelWidthPixels: 160,\n onClickClose,\n },\n};\n\nexport const Clickable: Story = {\n args: {\n label: \"Click Me\",\n onClick: () => alert(\"Clicked on badge\"),\n },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BrandLogo.stories.js","sourceRoot":"","sources":["../../../stories/atoms/BrandLogo.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AAGhC,MAAM,IAAI,GAA2B;IACnC,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,SAAS;IACpB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"BrandLogo.stories.js","sourceRoot":"","sources":["../../../stories/atoms/BrandLogo.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AAGhC,MAAM,IAAI,GAA2B;IACnC,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,SAAS;IACpB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;CACT,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAU;IAC1B,IAAI,EAAE;QACJ,WAAW,EAAE,KAAK;KACnB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,IAAI,GAAU;IACzB,IAAI,EAAE;QACJ,WAAW,EAAE,IAAI;KAClB;CACF,CAAC","sourcesContent":["import { BrandLogo } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof BrandLogo> = {\n title: \"Atoms/Brand Logo\",\n component: BrandLogo,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n args: {},\n};\n\nexport const Light: Story = {\n args: {\n isDarkTheme: false,\n },\n};\n\nexport const Dark: Story = {\n args: {\n isDarkTheme: true,\n },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Button.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC;AAE5C,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,IAAI,GAAwB;IAChC,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,MAAM;IACjB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Button.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,CAAC;AAE5C,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,IAAI,GAAwB;IAChC,KAAK,EAAE,cAAc;IACrB,SAAS,EAAE,MAAM;IACjB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,QAAQ,GAAG;IACf,KAAK,EAAE,QAAQ;IACf,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,iCAAiC,CAAC;CACxD,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE,QAAQ;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,QAAQ,EAAE,KAAK,CAAC,QAAQ;KACzB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,SAAS,EAAE,KAAK,CAAC,SAAS;KAC3B;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,QAAQ,EAAE,KAAK,CAAC,eAAe;QAC/B,SAAS,EAAE,KAAK,CAAC,iBAAiB;KACnC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,SAAS,EAAE,IAAI;QACf,KAAK,EAAE,MAAM,CAAC,UAAU,CAAC,WAAW;KACrC;CACF,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;CAMzB,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAU;IAC1C,IAAI,EAAE;QACJ,WAAW,EAAE,MAAM,CAAC,OAAO,CAAC,KAAK;QACjC,eAAe,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK;QAClC,KAAK,EAAE,MAAM,CAAC,UAAU,CAAC,WAAW;QACpC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,iCAAiC,CAAC;QACvD,KAAK,EAAE,CACL,MAAC,OAAO,eACN,kDAA8B,EAC9B,KAAC,KAAK,CAAC,cAAc,IAAC,IAAI,EAAE,EAAE,GAAI,IAC1B,CACX;KACF;CACF,CAAC","sourcesContent":["import { Button, Colors, Icons } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\nimport styled from \"styled-components\";\n\nconst meta: Meta<typeof Button> = {\n title: \"Atoms/Button\",\n component: Button,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nconst baseArgs = {\n label: \"Button\",\n onClick: () => alert(\"You have clicked on the button.\"),\n};\n\nexport const TextOnly: Story = {\n args: baseArgs,\n};\n\nexport const LeftIcon: Story = {\n args: {\n ...baseArgs,\n LeftIcon: Icons.PlusIcon,\n },\n};\n\nexport const RightIcon: Story = {\n args: {\n ...baseArgs,\n RightIcon: Icons.MinusIcon,\n },\n};\n\nexport const BothIcons: Story = {\n args: {\n ...baseArgs,\n LeftIcon: Icons.SmileyXEyesIcon,\n RightIcon: Icons.SmileyMeltingIcon,\n },\n};\n\nexport const Underline: Story = {\n args: {\n ...baseArgs,\n underline: true,\n color: Colors.typography.blackMedium,\n },\n};\n\nconst Content = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n\n width: 200px;\n`;\n\nexport const GrantObjectivesFilter: Story = {\n args: {\n borderColor: Colors.neutral.grey3,\n backgroundColor: Colors.base.white,\n color: Colors.typography.blackMedium,\n onClick: () => alert(\"You have clicked on the button.\"),\n label: (\n <Content>\n <p>Select grant objectives</p>\n <Icons.CaretRightIcon size={20} />\n </Content>\n ),\n },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Checkbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAG/B,MAAM,IAAI,GAA0B;IAClC,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"Checkbox.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Checkbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAG/B,MAAM,IAAI,GAA0B;IAClC,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,QAAQ,GAAG;IACf,EAAE,EAAE,MAAM;IACV,KAAK,EAAE,sBAAsB;CAC9B,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAU;IAChC,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,WAAW,EAAE,IAAI;KAClB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,WAAW,EAAE,KAAK;KACnB;CACF,CAAC","sourcesContent":["import { Checkbox } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof Checkbox> = {\n title: \"Atoms/Checkbox\",\n component: Checkbox,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nconst baseArgs = {\n id: \"best\",\n label: \"Grantbii is the best\",\n};\n\nexport const LabelBefore: Story = {\n args: {\n ...baseArgs,\n labelBefore: true,\n },\n};\n\nexport const LabelAfter: Story = {\n args: {\n ...baseArgs,\n labelBefore: false,\n },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Input.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAGzD,MAAM,IAAI,GAAuB;IAC/B,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"Input.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Input.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAGzD,MAAM,IAAI,GAAuB;IAC/B,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,KAAK;IAChB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE,EAAE,WAAW,EAAE,WAAW,EAAE;CACnC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAU;IACnC,IAAI,EAAE,EAAE,WAAW,EAAE,cAAc,EAAE,IAAI,EAAE,QAAQ,EAAE;CACtD,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE,EAAE,WAAW,EAAE,kBAAkB,EAAE,IAAI,EAAE,OAAO,EAAE;CACzD,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAU;IAClC,IAAI,EAAE,EAAE,WAAW,EAAE,wBAAwB,EAAE,SAAS,EAAE,EAAE,EAAE;CAC/D,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,IAAI,EAAE;QACJ,WAAW,EAAE,mBAAmB;QAChC,UAAU,EAAE,wBAAwB;QACpC,eAAe,EAAE,gBAAgB,CAAC,QAAQ,CAAC;KAC5C;CACF,CAAC","sourcesContent":["import { Input, mapEnumToOptions } from \"@/.\";\nimport { CostItem } from \"@grantbii/ui-core/grant/enums\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof Input> = {\n title: \"Atoms/Input\",\n component: Input,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const BasicInput: Story = {\n args: { placeholder: \"Type here\" },\n};\n\nexport const NumericalField: Story = {\n args: { placeholder: \"Numbers only\", type: \"number\" },\n};\n\nexport const EmailField: Story = {\n args: { placeholder: \"Enter your email\", type: \"email\" },\n};\n\nexport const MinimumLength: Story = {\n args: { placeholder: \"At least 10 characters\", minLength: 10 },\n};\n\nexport const WithDatalist: Story = {\n args: {\n placeholder: \"Enter a cost item\",\n datalistId: \"supportable-cost-items\",\n datalistOptions: mapEnumToOptions(CostItem),\n },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinkButton.stories.js","sourceRoot":"","sources":["../../../stories/atoms/LinkButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAGhD,MAAM,IAAI,GAA4B;IACpC,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,UAAU;IACrB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"LinkButton.stories.js","sourceRoot":"","sources":["../../../stories/atoms/LinkButton.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAGhD,MAAM,IAAI,GAA4B;IACpC,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,UAAU;IACrB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,QAAQ,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,sBAAsB,EAAE,CAAC;AAEjE,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC;KACxC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC7B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,QAAQ,EAAE,KAAK,CAAC,QAAQ;KACzB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,SAAS,EAAE,KAAK,CAAC,SAAS;KAC3B;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,QAAQ,EAAE,KAAK,CAAC,eAAe;QAC/B,SAAS,EAAE,KAAK,CAAC,iBAAiB;KACnC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC9B,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,SAAS,EAAE,IAAI;QACf,KAAK,EAAE,MAAM,CAAC,UAAU,CAAC,WAAW;KACrC;CACF,CAAC","sourcesContent":["import { Colors, Icons, LinkButton } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof LinkButton> = {\n title: \"Atoms/Link Button\",\n component: LinkButton,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nconst baseArgs = { label: \"Link\", href: \"https://grantbii.com\" };\n\nexport const TextOnly: Story = {\n args: {\n ...baseArgs,\n onClick: () => alert(\"clicked on link\"),\n },\n};\n\nexport const LeftIcon: Story = {\n args: {\n ...baseArgs,\n LeftIcon: Icons.PlusIcon,\n },\n};\n\nexport const RightIcon: Story = {\n args: {\n ...baseArgs,\n RightIcon: Icons.MinusIcon,\n },\n};\n\nexport const BothIcons: Story = {\n args: {\n ...baseArgs,\n LeftIcon: Icons.SmileyXEyesIcon,\n RightIcon: Icons.SmileyMeltingIcon,\n },\n};\n\nexport const Underline: Story = {\n args: {\n ...baseArgs,\n underline: true,\n color: Colors.typography.blackMedium,\n },\n};\n"]}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { Overlay } from "@/.";
|
|
2
|
+
import type { Meta, StoryObj } from "@storybook/nextjs-vite";
|
|
3
|
+
declare const meta: Meta<typeof Overlay>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const Default: Story;
|
|
7
|
+
export declare const CenteredContent: Story;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { Overlay } from "@/.";
|
|
2
|
+
const meta = {
|
|
3
|
+
title: "Atoms/Overlay",
|
|
4
|
+
component: Overlay,
|
|
5
|
+
tags: ["autodocs"],
|
|
6
|
+
parameters: {
|
|
7
|
+
layout: "centered",
|
|
8
|
+
docs: {
|
|
9
|
+
codePanel: true,
|
|
10
|
+
},
|
|
11
|
+
},
|
|
12
|
+
};
|
|
13
|
+
export default meta;
|
|
14
|
+
export const Default = {
|
|
15
|
+
args: { children: "Content" },
|
|
16
|
+
};
|
|
17
|
+
export const CenteredContent = {
|
|
18
|
+
args: { children: "Content", $centerContent: true },
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=Overlay.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Overlay.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Overlay.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AAG9B,MAAM,IAAI,GAAyB;IACjC,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,OAAO;IAClB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE;CAC9B,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAU;IACpC,IAAI,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,IAAI,EAAE;CACpD,CAAC","sourcesContent":["import { Overlay } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof Overlay> = {\n title: \"Atoms/Overlay\",\n component: Overlay,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n args: { children: \"Content\" },\n};\n\nexport const CenteredContent: Story = {\n args: { children: \"Content\", $centerContent: true },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Textarea.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAG/B,MAAM,IAAI,GAA0B;IAClC,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"Textarea.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Textarea.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,KAAK,CAAC;AAG/B,MAAM,IAAI,GAA0B;IAClC,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,IAAI,EAAE,EAAE,WAAW,EAAE,WAAW,EAAE;CACnC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAU;IACnC,IAAI,EAAE,EAAE,WAAW,EAAE,qCAAqC,EAAE,SAAS,EAAE,EAAE,EAAE;CAC5E,CAAC","sourcesContent":["import { Textarea } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof Textarea> = {\n title: \"Atoms/Textarea\",\n component: Textarea,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const BasicExample: Story = {\n args: { placeholder: \"Type here\" },\n};\n\nexport const WithValidation: Story = {\n args: { placeholder: \"Must be at least 10 characters long\", minLength: 10 },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badges.stories.js","sourceRoot":"","sources":["../../../stories/molecules/Badges.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAmB,MAAM,KAAK,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAG1D,MAAM,IAAI,GAAwB;IAChC,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,MAAM;IACjB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"Badges.stories.js","sourceRoot":"","sources":["../../../stories/molecules/Badges.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAmB,MAAM,KAAK,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAG1D,MAAM,IAAI,GAAwB;IAChC,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,MAAM;IACjB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,aAAa,GAAiB,gBAAgB,CAAC,SAAS,CAAC,CAAC;AAEhE,MAAM,CAAC,MAAM,kBAAkB,GAAU;IACvC,IAAI,EAAE;QACJ,aAAa;QACb,UAAU,EAAE,IAAI;QAChB,QAAQ,EAAE,IAAI;KACf;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAU;IACzC,IAAI,EAAE;QACJ,aAAa;QACb,UAAU,EAAE,KAAK;QACjB,QAAQ,EAAE,IAAI;KACf;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAU;IACzC,IAAI,EAAE;QACJ,aAAa;QACb,UAAU,EAAE,IAAI;QAChB,QAAQ,EAAE,KAAK;KAChB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAU;IAC3C,IAAI,EAAE;QACJ,aAAa;QACb,UAAU,EAAE,KAAK;QACjB,QAAQ,EAAE,KAAK;KAChB;CACF,CAAC","sourcesContent":["import { Badges, mapEnumToOptions, type BadgeProps } from \"@/.\";\nimport { Objective } from \"@grantbii/ui-core/grant/enums\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof Badges> = {\n title: \"Molecules/Badges\",\n component: Badges,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nconst allBadgeProps: BadgeProps[] = mapEnumToOptions(Objective);\n\nexport const ScrollableVertical: Story = {\n args: {\n allBadgeProps,\n scrollable: true,\n vertical: true,\n },\n};\n\nexport const UnscrollableVertical: Story = {\n args: {\n allBadgeProps,\n scrollable: false,\n vertical: true,\n },\n};\n\nexport const ScrollableHorizontal: Story = {\n args: {\n allBadgeProps,\n scrollable: true,\n vertical: false,\n },\n};\n\nexport const UnscrollableHorizontal: Story = {\n args: {\n allBadgeProps,\n scrollable: false,\n vertical: false,\n },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YesNoOptions.stories.js","sourceRoot":"","sources":["../../../stories/organisms/YesNoOptions.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,KAAK,CAAC;AAGnC,MAAM,IAAI,GAA8B;IACtC,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,YAAY;IACvB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"YesNoOptions.stories.js","sourceRoot":"","sources":["../../../stories/organisms/YesNoOptions.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,KAAK,CAAC;AAGnC,MAAM,IAAI,GAA8B;IACtC,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,YAAY;IACvB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,QAAQ,GAAG;IACf,IAAI,EAAE,UAAU;IAChB,QAAQ,EAAE,EAAE;IACZ,OAAO,EAAE,EAAE;CACZ,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,QAAQ;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAU;IACpC,IAAI,EAAE;QACJ,GAAG,QAAQ;QACX,WAAW,EAAE,EAAE;KAChB;CACF,CAAC","sourcesContent":["import { YesNoOptions } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof YesNoOptions> = {\n title: \"Organisms/Yes-No Options\",\n component: YesNoOptions,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nconst baseArgs = {\n name: \"question\",\n yesProps: {},\n noProps: {},\n};\n\nexport const YesOrNo: Story = {\n args: baseArgs,\n};\n\nexport const YesOrNoOrUnsure: Story = {\n args: {\n ...baseArgs,\n unsureProps: {},\n },\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoadingFailedSign.stories.js","sourceRoot":"","sources":["../../../stories/templates/LoadingFailedSign.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,KAAK,CAAC;AAGxC,MAAM,IAAI,GAAmC;IAC3C,KAAK,EAAE,+BAA+B;IACtC,SAAS,EAAE,iBAAiB;IAC5B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;
|
|
1
|
+
{"version":3,"file":"LoadingFailedSign.stories.js","sourceRoot":"","sources":["../../../stories/templates/LoadingFailedSign.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,KAAK,CAAC;AAGxC,MAAM,IAAI,GAAmC;IAC3C,KAAK,EAAE,+BAA+B;IACtC,SAAS,EAAE,iBAAiB;IAC5B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,SAAS,EAAE,IAAI;SAChB;KACF;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;CACT,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAU;IAC3B,IAAI,EAAE;QACJ,aAAa,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC;KAC3C;CACF,CAAC","sourcesContent":["import { LoadingFailedSign } from \"@/.\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\n\nconst meta: Meta<typeof LoadingFailedSign> = {\n title: \"Templates/Loading-Failed Sign\",\n component: LoadingFailedSign,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n docs: {\n codePanel: true,\n },\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Default: Story = {\n args: {},\n};\n\nexport const Reload: Story = {\n args: {\n onClickReload: () => alert(\"reloading...\"),\n },\n};\n"]}
|