@grantbii/design-system 1.9.4 → 1.9.6

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.
@@ -60,16 +60,19 @@ export const InputValidation = css `
60
60
 
61
61
  ${({ $hasError = false }) => $hasError
62
62
  ? css `
63
- background-color: ${Colors.base.white};
64
- border: 2px solid ${Colors.accent.red1};
65
- outline: none;
63
+ &:valid {
64
+ background-color: ${Colors.base.white};
65
+ border: 1px solid ${Colors.accent.red1};
66
+ outline: none;
67
+ }
66
68
 
67
- &:focus {
68
- border: 2px solid ${Colors.accent.red1};
69
+ &:valid&:focus {
70
+ background-color: ${Colors.base.white};
71
+ border: 1px solid ${Colors.accent.red1};
69
72
  outline: 1px solid ${Colors.accent.red1};
70
73
  }
71
74
  `
72
- : ""}
75
+ : css ``}
73
76
  `;
74
77
  export const FILE_TYPE_ICON_MAP = {
75
78
  "application/pdf": Icons.FilePdfIcon,
@@ -1 +1 @@
1
- {"version":3,"file":"shared.js","sourceRoot":"","sources":["../../../core/atoms/shared.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAE/C,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAMlC;;;;;;WAMS,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;;;;;;;;qBAQrB,CAAC,EAAE,UAAU,GAAG,KAAK,EAAE,EAAE,EAAE,CAC5C,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM;;WAE1B,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,SAAS,EAAE,EAAE,EAAE,CAAC,MAAM;sBACzC,CAAC,EACnB,UAAU,GAAG,KAAK,EAClB,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,GAC5C,EAAE,EAAE,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,gBAAgB,CAAC;;sBAEjC,CAAC,EAAE,YAAY,GAAG,aAAa,EAAE,EAAE,EAAE,CAAC,YAAY;;CAEvE,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAItC,CAAC;AAMF,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAsB;;wBAEhC,MAAM,CAAC,OAAO,CAAC,KAAK;wBACpB,MAAM,CAAC,OAAO,CAAC,KAAK;;;;;wBAKpB,MAAM,CAAC,IAAI,CAAC,KAAK;wBACjB,MAAM,CAAC,OAAO,CAAC,KAAK;;;;;wBAKpB,MAAM,CAAC,IAAI,CAAC,KAAK;wBACjB,MAAM,CAAC,MAAM,CAAC,KAAK;yBAClB,MAAM,CAAC,MAAM,CAAC,KAAK;;;;wBAIpB,MAAM,CAAC,IAAI,CAAC,KAAK;wBACjB,MAAM,CAAC,MAAM,CAAC,IAAI;;;;;wBAKlB,MAAM,CAAC,IAAI,CAAC,KAAK;wBACjB,MAAM,CAAC,MAAM,CAAC,IAAI;yBACjB,MAAM,CAAC,MAAM,CAAC,IAAI;;;IAGvC,CAAC,EAAE,SAAS,GAAG,KAAK,EAAE,EAAE,EAAE,CAC1B,SAAS;IACP,CAAC,CAAC,GAAG,CAAA;8BACmB,MAAM,CAAC,IAAI,CAAC,KAAK;8BACjB,MAAM,CAAC,MAAM,CAAC,IAAI;;;;gCAIhB,MAAM,CAAC,MAAM,CAAC,IAAI;iCACjB,MAAM,CAAC,MAAM,CAAC,IAAI;;SAE1C;IACH,CAAC,CAAC,EAAE;CACT,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAuC;IACpE,iBAAiB,EAAE,KAAK,CAAC,WAAW;IACpC,WAAW,EAAE,KAAK,CAAC,WAAW;IAC9B,YAAY,EAAE,KAAK,CAAC,WAAW;CAChC,CAAC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Colors, Icons } from \"../foundations\";\n\nexport const BaseButton = styled.div<{\n $underline?: boolean;\n $backgroundColor?: string;\n $borderColor?: string;\n $color?: string;\n $width?: string;\n}>`\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 10px;\n\n width: ${({ $width = \"auto\" }) => $width};\n\n padding: 10px 16px;\n\n font-weight: 500;\n font-size: 14px;\n\n white-space: nowrap;\n text-decoration: ${({ $underline = false }) =>\n $underline ? \"underline\" : \"none\"};\n\n color: ${({ $color = Colors.typography.whiteHigh }) => $color};\n background-color: ${({\n $underline = false,\n $backgroundColor = Colors.main.grantbiiBlue,\n }) => ($underline ? \"transparent\" : $backgroundColor)};\n\n border: 1px solid ${({ $borderColor = \"transparent\" }) => $borderColor};\n border-radius: 8px;\n`;\n\nexport const LabelledInput = styled.div`\n display: flex;\n align-items: center;\n gap: 8px;\n`;\n\nexport type InputValidationProps = {\n $hasError?: boolean;\n};\n\nexport const InputValidation = css<InputValidationProps>`\n &:disabled {\n background-color: ${Colors.neutral.grey4};\n border: 1px solid ${Colors.neutral.grey3};\n outline: none;\n }\n\n &:valid {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.neutral.grey3};\n outline: none;\n }\n\n &:valid&:focus {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.accent.blue1};\n outline: 1px solid ${Colors.accent.blue1};\n }\n\n &:invalid {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.accent.red1};\n outline: none;\n }\n\n &:invalid&:focus {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.accent.red1};\n outline: 1px solid ${Colors.accent.red1};\n }\n\n ${({ $hasError = false }) =>\n $hasError\n ? css`\n background-color: ${Colors.base.white};\n border: 2px solid ${Colors.accent.red1};\n outline: none;\n\n &:focus {\n border: 2px solid ${Colors.accent.red1};\n outline: 1px solid ${Colors.accent.red1};\n }\n `\n : \"\"}\n`;\n\nexport const FILE_TYPE_ICON_MAP: { [mimeType: string]: Icons.Icon } = {\n \"application/pdf\": Icons.FilePdfIcon,\n \"image/png\": Icons.FilePngIcon,\n \"image/jpeg\": Icons.FileJpgIcon,\n};\n"]}
1
+ {"version":3,"file":"shared.js","sourceRoot":"","sources":["../../../core/atoms/shared.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAE/C,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAMlC;;;;;;WAMS,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,EAAE,CAAC,MAAM;;;;;;;;qBAQrB,CAAC,EAAE,UAAU,GAAG,KAAK,EAAE,EAAE,EAAE,CAC5C,UAAU,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM;;WAE1B,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,SAAS,EAAE,EAAE,EAAE,CAAC,MAAM;sBACzC,CAAC,EACnB,UAAU,GAAG,KAAK,EAClB,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,YAAY,GAC5C,EAAE,EAAE,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,gBAAgB,CAAC;;sBAEjC,CAAC,EAAE,YAAY,GAAG,aAAa,EAAE,EAAE,EAAE,CAAC,YAAY;;CAEvE,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAItC,CAAC;AAMF,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,CAAsB;;wBAEhC,MAAM,CAAC,OAAO,CAAC,KAAK;wBACpB,MAAM,CAAC,OAAO,CAAC,KAAK;;;;;wBAKpB,MAAM,CAAC,IAAI,CAAC,KAAK;wBACjB,MAAM,CAAC,OAAO,CAAC,KAAK;;;;;wBAKpB,MAAM,CAAC,IAAI,CAAC,KAAK;wBACjB,MAAM,CAAC,MAAM,CAAC,KAAK;yBAClB,MAAM,CAAC,MAAM,CAAC,KAAK;;;;wBAIpB,MAAM,CAAC,IAAI,CAAC,KAAK;wBACjB,MAAM,CAAC,MAAM,CAAC,IAAI;;;;;wBAKlB,MAAM,CAAC,IAAI,CAAC,KAAK;wBACjB,MAAM,CAAC,MAAM,CAAC,IAAI;yBACjB,MAAM,CAAC,MAAM,CAAC,IAAI;;;IAGvC,CAAC,EAAE,SAAS,GAAG,KAAK,EAAE,EAAE,EAAE,CAC1B,SAAS;IACP,CAAC,CAAC,GAAG,CAAA;;gCAEqB,MAAM,CAAC,IAAI,CAAC,KAAK;gCACjB,MAAM,CAAC,MAAM,CAAC,IAAI;;;;;gCAKlB,MAAM,CAAC,IAAI,CAAC,KAAK;gCACjB,MAAM,CAAC,MAAM,CAAC,IAAI;iCACjB,MAAM,CAAC,MAAM,CAAC,IAAI;;SAE1C;IACH,CAAC,CAAC,GAAG,CAAA,EAAE;CACZ,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAuC;IACpE,iBAAiB,EAAE,KAAK,CAAC,WAAW;IACpC,WAAW,EAAE,KAAK,CAAC,WAAW;IAC9B,YAAY,EAAE,KAAK,CAAC,WAAW;CAChC,CAAC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Colors, Icons } from \"../foundations\";\n\nexport const BaseButton = styled.div<{\n $underline?: boolean;\n $backgroundColor?: string;\n $borderColor?: string;\n $color?: string;\n $width?: string;\n}>`\n display: flex;\n justify-content: center;\n align-items: center;\n gap: 10px;\n\n width: ${({ $width = \"auto\" }) => $width};\n\n padding: 10px 16px;\n\n font-weight: 500;\n font-size: 14px;\n\n white-space: nowrap;\n text-decoration: ${({ $underline = false }) =>\n $underline ? \"underline\" : \"none\"};\n\n color: ${({ $color = Colors.typography.whiteHigh }) => $color};\n background-color: ${({\n $underline = false,\n $backgroundColor = Colors.main.grantbiiBlue,\n }) => ($underline ? \"transparent\" : $backgroundColor)};\n\n border: 1px solid ${({ $borderColor = \"transparent\" }) => $borderColor};\n border-radius: 8px;\n`;\n\nexport const LabelledInput = styled.div`\n display: flex;\n align-items: center;\n gap: 8px;\n`;\n\nexport type InputValidationProps = {\n $hasError?: boolean;\n};\n\nexport const InputValidation = css<InputValidationProps>`\n &:disabled {\n background-color: ${Colors.neutral.grey4};\n border: 1px solid ${Colors.neutral.grey3};\n outline: none;\n }\n\n &:valid {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.neutral.grey3};\n outline: none;\n }\n\n &:valid&:focus {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.accent.blue1};\n outline: 1px solid ${Colors.accent.blue1};\n }\n\n &:invalid {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.accent.red1};\n outline: none;\n }\n\n &:invalid&:focus {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.accent.red1};\n outline: 1px solid ${Colors.accent.red1};\n }\n\n ${({ $hasError = false }) =>\n $hasError\n ? css`\n &:valid {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.accent.red1};\n outline: none;\n }\n\n &:valid&:focus {\n background-color: ${Colors.base.white};\n border: 1px solid ${Colors.accent.red1};\n outline: 1px solid ${Colors.accent.red1};\n }\n `\n : css``}\n`;\n\nexport const FILE_TYPE_ICON_MAP: { [mimeType: string]: Icons.Icon } = {\n \"application/pdf\": Icons.FilePdfIcon,\n \"image/png\": Icons.FilePngIcon,\n \"image/jpeg\": Icons.FileJpgIcon,\n};\n"]}
@@ -1,5 +1,5 @@
1
- import { Location } from "@grantbii/ui-core/grant/enums";
2
- import type { BaseEnumType } from "@grantbii/ui-core/shared/enums";
1
+ import type { BaseEnumType } from "@grantbii/ui-core/enums";
2
+ import { Location } from "@grantbii/ui-core/location/enums";
3
3
  import { Flags, type Option } from "../foundations";
4
4
  export declare const mapEnumToOptions: <EnumType extends BaseEnumType>(enumType: EnumType) => Option[];
5
5
  export declare const LOCATION_FLAG_MAP: {
@@ -1,4 +1,4 @@
1
- import { Location } from "@grantbii/ui-core/grant/enums";
1
+ import { Location } from "@grantbii/ui-core/location/enums";
2
2
  import { Flags } from "../foundations";
3
3
  export const mapEnumToOptions = (enumType) => Object.values(enumType)
4
4
  .filter((value) => value !== enumType.UNKNOWN)
@@ -7,7 +7,12 @@ export const LOCATION_FLAG_MAP = {
7
7
  [Location.SINGAPORE]: Flags.SG,
8
8
  [Location.HONG_KONG]: Flags.HK,
9
9
  [Location.MALAYSIA]: Flags.MY,
10
+ [Location.SOUTH_KOREA]: Flags.KR,
11
+ [Location.JAPAN]: Flags.JP,
12
+ [Location.CHINA]: Flags.CN,
10
13
  [Location.UNITED_KINGDOM]: Flags.GB,
14
+ [Location.UNITED_STATES]: Flags.US,
15
+ [Location.OTHERS]: Flags.SG,
11
16
  [Location.UNKNOWN]: Flags.SG,
12
17
  };
13
18
  //# sourceMappingURL=mappings.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"mappings.js","sourceRoot":"","sources":["../../../core/integrations/mappings.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,OAAO,EAAE,KAAK,EAAe,MAAM,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAC9B,QAAkB,EACR,EAAE,CACZ,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC;KACpB,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,QAAQ,CAAC,OAAO,CAAC;KAC7C,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;AAE/C,MAAM,CAAC,MAAM,iBAAiB,GAE1B;IACF,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,KAAK,CAAC,EAAE;IAC9B,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,KAAK,CAAC,EAAE;IAC9B,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,EAAE;IAC7B,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,EAAE;IACnC,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,EAAE;CAC7B,CAAC","sourcesContent":["import { Location } from \"@grantbii/ui-core/grant/enums\";\nimport type { BaseEnumType } from \"@grantbii/ui-core/shared/enums\";\nimport { Flags, type Option } from \"../foundations\";\n\nexport const mapEnumToOptions = <EnumType extends BaseEnumType>(\n enumType: EnumType,\n): Option[] =>\n Object.values(enumType)\n .filter((value) => value !== enumType.UNKNOWN)\n .map((value) => ({ label: value, value }));\n\nexport const LOCATION_FLAG_MAP: {\n [location in Location]: Flags.FlagComponent;\n} = {\n [Location.SINGAPORE]: Flags.SG,\n [Location.HONG_KONG]: Flags.HK,\n [Location.MALAYSIA]: Flags.MY,\n [Location.UNITED_KINGDOM]: Flags.GB,\n [Location.UNKNOWN]: Flags.SG,\n};\n"]}
1
+ {"version":3,"file":"mappings.js","sourceRoot":"","sources":["../../../core/integrations/mappings.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAC5D,OAAO,EAAE,KAAK,EAAe,MAAM,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAC9B,QAAkB,EACR,EAAE,CACZ,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC;KACpB,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,QAAQ,CAAC,OAAO,CAAC;KAC7C,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC;AAE/C,MAAM,CAAC,MAAM,iBAAiB,GAE1B;IACF,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,KAAK,CAAC,EAAE;IAC9B,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,KAAK,CAAC,EAAE;IAC9B,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,EAAE;IAC7B,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,EAAE;IAChC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE;IAC1B,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE;IAC1B,CAAC,QAAQ,CAAC,cAAc,CAAC,EAAE,KAAK,CAAC,EAAE;IACnC,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,KAAK,CAAC,EAAE;IAClC,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,EAAE;IAC3B,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,KAAK,CAAC,EAAE;CAC7B,CAAC","sourcesContent":["import type { BaseEnumType } from \"@grantbii/ui-core/enums\";\nimport { Location } from \"@grantbii/ui-core/location/enums\";\nimport { Flags, type Option } from \"../foundations\";\n\nexport const mapEnumToOptions = <EnumType extends BaseEnumType>(\n enumType: EnumType,\n): Option[] =>\n Object.values(enumType)\n .filter((value) => value !== enumType.UNKNOWN)\n .map((value) => ({ label: value, value }));\n\nexport const LOCATION_FLAG_MAP: {\n [location in Location]: Flags.FlagComponent;\n} = {\n [Location.SINGAPORE]: Flags.SG,\n [Location.HONG_KONG]: Flags.HK,\n [Location.MALAYSIA]: Flags.MY,\n [Location.SOUTH_KOREA]: Flags.KR,\n [Location.JAPAN]: Flags.JP,\n [Location.CHINA]: Flags.CN,\n [Location.UNITED_KINGDOM]: Flags.GB,\n [Location.UNITED_STATES]: Flags.US,\n [Location.OTHERS]: Flags.SG,\n [Location.UNKNOWN]: Flags.SG,\n};\n"]}
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@grantbii/design-system",
3
3
  "author": "Grantbii",
4
4
  "license": "UNLICENSED",
5
- "version": "1.9.4",
5
+ "version": "1.9.6",
6
6
  "description": "Grantbii's Design System",
7
7
  "homepage": "https://design.grantbii.com",
8
8
  "repository": {
@@ -20,12 +20,12 @@
20
20
  "build-storybook": "storybook build"
21
21
  },
22
22
  "dependencies": {
23
- "@grantbii/ui-core": "1.4.1",
23
+ "@grantbii/ui-core": "1.5.1",
24
24
  "@phosphor-icons/react": "2.1.10",
25
25
  "country-flag-icons": "1.6.4",
26
- "next": "16.0.3",
27
- "react": "19.2.0",
28
- "react-dom": "19.2.0",
26
+ "next": "16.0.7",
27
+ "react": "19.2.1",
28
+ "react-dom": "19.2.1",
29
29
  "react-dropzone": "14.3.8",
30
30
  "react-spinners": "0.17.0",
31
31
  "styled-components": "6.1.19"
@@ -33,28 +33,28 @@
33
33
  "devDependencies": {
34
34
  "@chromatic-com/storybook": "4.1.3",
35
35
  "@eslint/js": "9.39.1",
36
- "@next/eslint-plugin-next": "16.0.3",
37
- "@storybook/addon-a11y": "10.0.8",
38
- "@storybook/addon-docs": "10.0.8",
39
- "@storybook/addon-onboarding": "10.0.8",
40
- "@storybook/addon-vitest": "10.0.8",
41
- "@storybook/nextjs-vite": "10.0.8",
36
+ "@next/eslint-plugin-next": "16.0.7",
37
+ "@storybook/addon-a11y": "10.1.4",
38
+ "@storybook/addon-docs": "10.1.4",
39
+ "@storybook/addon-onboarding": "10.1.4",
40
+ "@storybook/addon-vitest": "10.1.4",
41
+ "@storybook/nextjs-vite": "10.1.4",
42
42
  "@types/node": "22.18.0",
43
- "@types/react": "19.2.6",
43
+ "@types/react": "19.2.7",
44
44
  "@types/react-dom": "19.2.3",
45
- "@vitest/browser": "4.0.13",
46
- "@vitest/browser-playwright": "4.0.13",
47
- "@vitest/coverage-v8": "4.0.13",
45
+ "@vitest/browser": "4.0.15",
46
+ "@vitest/browser-playwright": "4.0.15",
47
+ "@vitest/coverage-v8": "4.0.15",
48
48
  "eslint": "9.39.1",
49
- "eslint-config-next": "16.0.3",
50
- "eslint-plugin-storybook": "10.0.8",
49
+ "eslint-config-next": "16.0.7",
50
+ "eslint-plugin-storybook": "10.1.4",
51
51
  "husky": "9.1.7",
52
52
  "lint-staged": "16.2.7",
53
- "playwright": "1.56.1",
54
- "prettier": "3.6.2",
55
- "storybook": "10.0.8",
53
+ "playwright": "1.57.0",
54
+ "prettier": "3.7.4",
55
+ "storybook": "10.1.4",
56
56
  "typescript": "5.9.3",
57
- "vitest": "4.0.13"
57
+ "vitest": "4.0.15"
58
58
  },
59
59
  "lint-staged": {
60
60
  "**/*.{html,css,json,md,yaml}": [
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { Dropdown, mapEnumToOptions } from "@/.";
3
3
  import { Objective } from "@grantbii/ui-core/grant/enums";
4
- import { parseEnum } from "@grantbii/ui-core/shared/enums";
4
+ import { parseEnum } from "@grantbii/ui-core/enums";
5
5
  import { useState } from "react";
6
6
  const DropdownExample = ({ controlled }) => {
7
7
  const [selectedObjective, setSelectedObjective] = useState(Objective.UNKNOWN);
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Dropdown.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAsB,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAMjC,MAAM,eAAe,GAAG,CAAC,EAAE,UAAU,EAAgB,EAAE,EAAE;IACvD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IAE9E,MAAM,eAAe,GAAkB;QACrC,GAAG,SAAS;QACZ,KAAK,EAAE,iBAAiB,KAAK,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,iBAAiB;QACvE,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAClB,oBAAoB,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;KACjE,CAAC;IAEF,OAAO,KAAC,QAAQ,OAAK,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,GAAI,CAAC;AAC9E,CAAC,CAAC;AAEF,MAAM,SAAS,GAAkB;IAC/B,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC;IACpC,YAAY,EAAE,wBAAwB;CACvC,CAAC;AAEF,MAAM,iBAAiB,GAAkB;IACvC,GAAG,SAAS;IACZ,YAAY,EAAE,EAAE;CACjB,CAAC;AAEF,MAAM,IAAI,GAAiC;IACzC,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,eAAe;IAC1B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE;QACJ,UAAU,EAAE,IAAI;KACjB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,IAAI,EAAE;QACJ,UAAU,EAAE,KAAK;KAClB;CACF,CAAC","sourcesContent":["import { Dropdown, mapEnumToOptions, type DropdownProps } from \"@/.\";\nimport { Objective } from \"@grantbii/ui-core/grant/enums\";\nimport { parseEnum } from \"@grantbii/ui-core/shared/enums\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\nimport { useState } from \"react\";\n\ntype ExampleProps = {\n controlled: boolean;\n};\n\nconst DropdownExample = ({ controlled }: ExampleProps) => {\n const [selectedObjective, setSelectedObjective] = useState(Objective.UNKNOWN);\n\n const controlledProps: DropdownProps = {\n ...baseProps,\n value: selectedObjective === Objective.UNKNOWN ? \"\" : selectedObjective,\n onChange: (event) =>\n setSelectedObjective(parseEnum(event.target.value, Objective)),\n };\n\n return <Dropdown {...(controlled ? controlledProps : uncontrolledProps)} />;\n};\n\nconst baseProps: DropdownProps = {\n options: mapEnumToOptions(Objective),\n defaultLabel: \"Select grant objective\",\n};\n\nconst uncontrolledProps: DropdownProps = {\n ...baseProps,\n defaultValue: \"\",\n};\n\nconst meta: Meta<typeof DropdownExample> = {\n title: \"Atoms/Dropdown\",\n component: DropdownExample,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Controlled: Story = {\n args: {\n controlled: true,\n },\n};\n\nexport const Uncontrolled: Story = {\n args: {\n controlled: false,\n },\n};\n"]}
1
+ {"version":3,"file":"Dropdown.stories.js","sourceRoot":"","sources":["../../../stories/atoms/Dropdown.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAsB,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,SAAS,EAAE,MAAM,+BAA+B,CAAC;AAC1D,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEpD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAMjC,MAAM,eAAe,GAAG,CAAC,EAAE,UAAU,EAAgB,EAAE,EAAE;IACvD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IAE9E,MAAM,eAAe,GAAkB;QACrC,GAAG,SAAS;QACZ,KAAK,EAAE,iBAAiB,KAAK,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,iBAAiB;QACvE,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAClB,oBAAoB,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC;KACjE,CAAC;IAEF,OAAO,KAAC,QAAQ,OAAK,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,GAAI,CAAC;AAC9E,CAAC,CAAC;AAEF,MAAM,SAAS,GAAkB;IAC/B,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC;IACpC,YAAY,EAAE,wBAAwB;CACvC,CAAC;AAEF,MAAM,iBAAiB,GAAkB;IACvC,GAAG,SAAS;IACZ,YAAY,EAAE,EAAE;CACjB,CAAC;AAEF,MAAM,IAAI,GAAiC;IACzC,KAAK,EAAE,gBAAgB;IACvB,SAAS,EAAE,eAAe;IAC1B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE;QACJ,UAAU,EAAE,IAAI;KACjB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,IAAI,EAAE;QACJ,UAAU,EAAE,KAAK;KAClB;CACF,CAAC","sourcesContent":["import { Dropdown, mapEnumToOptions, type DropdownProps } from \"@/.\";\nimport { Objective } from \"@grantbii/ui-core/grant/enums\";\nimport { parseEnum } from \"@grantbii/ui-core/enums\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\nimport { useState } from \"react\";\n\ntype ExampleProps = {\n controlled: boolean;\n};\n\nconst DropdownExample = ({ controlled }: ExampleProps) => {\n const [selectedObjective, setSelectedObjective] = useState(Objective.UNKNOWN);\n\n const controlledProps: DropdownProps = {\n ...baseProps,\n value: selectedObjective === Objective.UNKNOWN ? \"\" : selectedObjective,\n onChange: (event) =>\n setSelectedObjective(parseEnum(event.target.value, Objective)),\n };\n\n return <Dropdown {...(controlled ? controlledProps : uncontrolledProps)} />;\n};\n\nconst baseProps: DropdownProps = {\n options: mapEnumToOptions(Objective),\n defaultLabel: \"Select grant objective\",\n};\n\nconst uncontrolledProps: DropdownProps = {\n ...baseProps,\n defaultValue: \"\",\n};\n\nconst meta: Meta<typeof DropdownExample> = {\n title: \"Atoms/Dropdown\",\n component: DropdownExample,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Controlled: Story = {\n args: {\n controlled: true,\n },\n};\n\nexport const Uncontrolled: Story = {\n args: {\n controlled: false,\n },\n};\n"]}
@@ -8,3 +8,4 @@ export declare const NumericalField: Story;
8
8
  export declare const EmailField: Story;
9
9
  export declare const MinimumLength: Story;
10
10
  export declare const WithDatalist: Story;
11
+ export declare const CustomError: Story;
@@ -31,4 +31,9 @@ export const WithDatalist = {
31
31
  datalistOptions: mapEnumToOptions(CostItem),
32
32
  },
33
33
  };
34
+ export const CustomError = {
35
+ args: {
36
+ $hasError: true,
37
+ },
38
+ };
34
39
  //# sourceMappingURL=Input.stories.js.map
@@ -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;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
+ {"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;AAEF,MAAM,CAAC,MAAM,WAAW,GAAU;IAChC,IAAI,EAAE;QACJ,SAAS,EAAE,IAAI;KAChB;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\nexport const CustomError: Story = {\n args: {\n $hasError: true,\n },\n};\n"]}
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { LOCATION_FLAG_MAP, RadioButtons } from "@/.";
3
- import { Location } from "@grantbii/ui-core/grant/enums";
3
+ import { Location } from "@grantbii/ui-core/location/enums";
4
4
  import { useState } from "react";
5
5
  import styled from "styled-components";
6
6
  const Label = ({ location }) => {
@@ -1 +1 @@
1
- {"version":3,"file":"RadioButtons.stories.js","sourceRoot":"","sources":["../../../stories/molecules/RadioButtons.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,KAAK,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AAEzD,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAMvC,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAc,EAAE,EAAE;IACzC,MAAM,IAAI,GAAG,iBAAiB,CAAC,QAAQ,CAAC,CAAC;IAEzC,OAAO,CACL,MAAC,SAAS,eACR,KAAC,IAAI,IAAC,KAAK,EAAE,EAAE,GAAI,EACnB,sBAAI,QAAQ,GAAK,IACP,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI3B,CAAC;AAMF,MAAM,mBAAmB,GAAG,CAAC,EAAE,UAAU,EAAgB,EAAE,EAAE;IAC3D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAE7D,MAAM,eAAe,GAAG;QACtB,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC;aAC7B,MAAM,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,KAAK,QAAQ,CAAC,OAAO,CAAC;aACnD,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;YAClB,KAAK,EAAE,QAAQ;YACf,KAAK,EAAE,KAAC,KAAK,IAAC,QAAQ,EAAE,QAAQ,GAAI;YACpC,OAAO,EAAE,gBAAgB,KAAK,QAAQ;YACtC,OAAO,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,QAAQ,CAAC;SAC7C,CAAC,CAAC;KACN,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,OAAK,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,GAAI,CACzE,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAAG;IACxB,IAAI,EAAE,UAAU;IAChB,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC;SAC7B,MAAM,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,KAAK,QAAQ,CAAC,OAAO,CAAC;SACnD,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;QAClB,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,KAAC,KAAK,IAAC,QAAQ,EAAE,QAAQ,GAAI;QACpC,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,QAAQ,GAAG,CAAC;KAC/C,CAAC,CAAC;CACN,CAAC;AAEF,MAAM,IAAI,GAAqC;IAC7C,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,mBAAmB;IAC9B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,IAAI,EAAE;QACJ,UAAU,EAAE,KAAK;KAClB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE;QACJ,UAAU,EAAE,IAAI;KACjB;CACF,CAAC","sourcesContent":["import { LOCATION_FLAG_MAP, RadioButtons } from \"@/.\";\nimport { Location } from \"@grantbii/ui-core/grant/enums\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\nimport { useState } from \"react\";\nimport styled from \"styled-components\";\n\ntype LabelProps = {\n location: Location;\n};\n\nconst Label = ({ location }: LabelProps) => {\n const Flag = LOCATION_FLAG_MAP[location];\n\n return (\n <BaseLabel>\n <Flag width={20} />\n <p>{location}</p>\n </BaseLabel>\n );\n};\n\nconst BaseLabel = styled.div`\n display: flex;\n align-items: center;\n gap: 4px;\n`;\n\ntype ExampleProps = {\n controlled: boolean;\n};\n\nconst RadioButtonsExample = ({ controlled }: ExampleProps) => {\n const [selectedLocation, setSelectedLocation] = useState(\"\");\n\n const controlledProps = {\n options: Object.values(Location)\n .filter((location) => location !== Location.UNKNOWN)\n .map((location) => ({\n value: location,\n label: <Label location={location} />,\n checked: selectedLocation === location,\n onClick: () => setSelectedLocation(location),\n })),\n };\n\n return (\n <RadioButtons {...(controlled ? controlledProps : uncontrolledProps)} />\n );\n};\n\nconst uncontrolledProps = {\n name: \"location\",\n options: Object.values(Location)\n .filter((location) => location !== Location.UNKNOWN)\n .map((location) => ({\n value: location,\n label: <Label location={location} />,\n onChange: () => alert(`Selected ${location}!`),\n })),\n};\n\nconst meta: Meta<typeof RadioButtonsExample> = {\n title: \"Molecules/Radio Buttons\",\n component: RadioButtonsExample,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Uncontrolled: Story = {\n args: {\n controlled: false,\n },\n};\n\nexport const Controlled: Story = {\n args: {\n controlled: true,\n },\n};\n"]}
1
+ {"version":3,"file":"RadioButtons.stories.js","sourceRoot":"","sources":["../../../stories/molecules/RadioButtons.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,KAAK,CAAC;AACtD,OAAO,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC;AAE5D,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAMvC,MAAM,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAc,EAAE,EAAE;IACzC,MAAM,IAAI,GAAG,iBAAiB,CAAC,QAAQ,CAAC,CAAC;IAEzC,OAAO,CACL,MAAC,SAAS,eACR,KAAC,IAAI,IAAC,KAAK,EAAE,EAAE,GAAI,EACnB,sBAAI,QAAQ,GAAK,IACP,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI3B,CAAC;AAMF,MAAM,mBAAmB,GAAG,CAAC,EAAE,UAAU,EAAgB,EAAE,EAAE;IAC3D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAE7D,MAAM,eAAe,GAAG;QACtB,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC;aAC7B,MAAM,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,KAAK,QAAQ,CAAC,OAAO,CAAC;aACnD,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;YAClB,KAAK,EAAE,QAAQ;YACf,KAAK,EAAE,KAAC,KAAK,IAAC,QAAQ,EAAE,QAAQ,GAAI;YACpC,OAAO,EAAE,gBAAgB,KAAK,QAAQ;YACtC,OAAO,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,QAAQ,CAAC;SAC7C,CAAC,CAAC;KACN,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,OAAK,CAAC,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,iBAAiB,CAAC,GAAI,CACzE,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAAG;IACxB,IAAI,EAAE,UAAU;IAChB,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,QAAQ,CAAC;SAC7B,MAAM,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,KAAK,QAAQ,CAAC,OAAO,CAAC;SACnD,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;QAClB,KAAK,EAAE,QAAQ;QACf,KAAK,EAAE,KAAC,KAAK,IAAC,QAAQ,EAAE,QAAQ,GAAI;QACpC,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,QAAQ,GAAG,CAAC;KAC/C,CAAC,CAAC;CACN,CAAC;AAEF,MAAM,IAAI,GAAqC;IAC7C,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,mBAAmB;IAC9B,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACF,CAAC;AAEF,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,YAAY,GAAU;IACjC,IAAI,EAAE;QACJ,UAAU,EAAE,KAAK;KAClB;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE;QACJ,UAAU,EAAE,IAAI;KACjB;CACF,CAAC","sourcesContent":["import { LOCATION_FLAG_MAP, RadioButtons } from \"@/.\";\nimport { Location } from \"@grantbii/ui-core/location/enums\";\nimport type { Meta, StoryObj } from \"@storybook/nextjs-vite\";\nimport { useState } from \"react\";\nimport styled from \"styled-components\";\n\ntype LabelProps = {\n location: Location;\n};\n\nconst Label = ({ location }: LabelProps) => {\n const Flag = LOCATION_FLAG_MAP[location];\n\n return (\n <BaseLabel>\n <Flag width={20} />\n <p>{location}</p>\n </BaseLabel>\n );\n};\n\nconst BaseLabel = styled.div`\n display: flex;\n align-items: center;\n gap: 4px;\n`;\n\ntype ExampleProps = {\n controlled: boolean;\n};\n\nconst RadioButtonsExample = ({ controlled }: ExampleProps) => {\n const [selectedLocation, setSelectedLocation] = useState(\"\");\n\n const controlledProps = {\n options: Object.values(Location)\n .filter((location) => location !== Location.UNKNOWN)\n .map((location) => ({\n value: location,\n label: <Label location={location} />,\n checked: selectedLocation === location,\n onClick: () => setSelectedLocation(location),\n })),\n };\n\n return (\n <RadioButtons {...(controlled ? controlledProps : uncontrolledProps)} />\n );\n};\n\nconst uncontrolledProps = {\n name: \"location\",\n options: Object.values(Location)\n .filter((location) => location !== Location.UNKNOWN)\n .map((location) => ({\n value: location,\n label: <Label location={location} />,\n onChange: () => alert(`Selected ${location}!`),\n })),\n};\n\nconst meta: Meta<typeof RadioButtonsExample> = {\n title: \"Molecules/Radio Buttons\",\n component: RadioButtonsExample,\n tags: [\"autodocs\"],\n parameters: {\n layout: \"centered\",\n },\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\nexport const Uncontrolled: Story = {\n args: {\n controlled: false,\n },\n};\n\nexport const Controlled: Story = {\n args: {\n controlled: true,\n },\n};\n"]}