@foi/design-system 0.0.9 → 0.0.11

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.
Files changed (68) hide show
  1. package/README.md +104 -51
  2. package/dist/{RadioGroup-D2s7AY6E.js → RadioGroup-BL2bdmZx.js} +98 -100
  3. package/dist/RadioGroup-BL2bdmZx.js.map +1 -0
  4. package/dist/{RadioGroup.context-zJGC5Sjc.js → RadioGroup.context-BdRgENJJ.js} +149 -99
  5. package/dist/RadioGroup.context-BdRgENJJ.js.map +1 -0
  6. package/dist/{Switch-CKpSiHQK.js → Switch-BS8iwAJ5.js} +630 -637
  7. package/dist/Switch-BS8iwAJ5.js.map +1 -0
  8. package/dist/ThemeProvider-JlN3U_r2.js +39 -0
  9. package/dist/ThemeProvider-JlN3U_r2.js.map +1 -0
  10. package/dist/atoms.d.ts +1 -0
  11. package/dist/atoms.mjs +3 -3
  12. package/dist/components/atoms/Checkbox/Checkbox.interface.d.ts +4 -0
  13. package/dist/components/atoms/Checkbox/index.d.ts +1 -1
  14. package/dist/components/atoms/Icon/Icon.d.ts +10 -0
  15. package/dist/components/atoms/Icon/Icon.emotion.d.ts +2 -0
  16. package/dist/components/atoms/Icon/Icon.interface.d.ts +17 -0
  17. package/dist/components/atoms/Icon/index.d.ts +1 -0
  18. package/dist/{emotion-react-jsx-runtime.browser.esm-BFNmScj4.js → emotion-react-jsx-runtime.browser.esm-ClrpcFMG.js} +169 -167
  19. package/dist/emotion-react-jsx-runtime.browser.esm-ClrpcFMG.js.map +1 -0
  20. package/dist/hocs/ThemeProvider/ThemeProvider.interface.d.ts +2 -2
  21. package/dist/hocs/ThemeProvider/components/Button.d.ts +17 -27
  22. package/dist/hocs/ThemeProvider/components/Checkbox.d.ts +23 -45
  23. package/dist/hocs/ThemeProvider/components/CheckboxGroup.d.ts +11 -14
  24. package/dist/hocs/ThemeProvider/components/CheckboxTree.d.ts +11 -14
  25. package/dist/hocs/ThemeProvider/components/DatePicker.d.ts +23 -45
  26. package/dist/hocs/ThemeProvider/components/DatePickerMenu.d.ts +17 -27
  27. package/dist/hocs/ThemeProvider/components/IconButton.d.ts +20 -28
  28. package/dist/hocs/ThemeProvider/components/Input.d.ts +23 -45
  29. package/dist/hocs/ThemeProvider/components/Radio.d.ts +23 -45
  30. package/dist/hocs/ThemeProvider/components/RadioGroup.d.ts +11 -14
  31. package/dist/hocs/ThemeProvider/components/Select.d.ts +23 -45
  32. package/dist/hocs/ThemeProvider/components/SelectMenu.d.ts +16 -24
  33. package/dist/hocs/ThemeProvider/components/Slider.d.ts +15 -26
  34. package/dist/hocs/ThemeProvider/components/Switch.d.ts +18 -30
  35. package/dist/hocs/ThemeProvider/createComponentStyles.d.ts +2 -1
  36. package/dist/hocs/ThemeProvider/useThemeProvider.hook.d.ts +1 -1
  37. package/dist/hocs.mjs +1 -1
  38. package/dist/index.d.ts +1 -0
  39. package/dist/index.mjs +6 -6
  40. package/dist/molecules.mjs +1 -1
  41. package/dist/theme/dark/components/Button.d.ts +29 -27
  42. package/dist/theme/dark/components/Checkbox.d.ts +117 -54
  43. package/dist/theme/dark/components/CheckboxGroup.d.ts +13 -11
  44. package/dist/theme/dark/components/CheckboxTree.d.ts +12 -10
  45. package/dist/theme/dark/components/DatePicker.d.ts +53 -51
  46. package/dist/theme/dark/components/DatePickerMenu.d.ts +24 -22
  47. package/dist/theme/dark/components/IconButton.d.ts +24 -22
  48. package/dist/theme/dark/components/Input.d.ts +53 -51
  49. package/dist/theme/dark/components/Radio.d.ts +56 -54
  50. package/dist/theme/dark/components/RadioGroup.d.ts +13 -11
  51. package/dist/theme/dark/components/Select.d.ts +53 -51
  52. package/dist/theme/dark/components/SelectMenu.d.ts +23 -21
  53. package/dist/theme/dark/components/Slider.d.ts +41 -39
  54. package/dist/theme/dark/components/Switch.d.ts +49 -47
  55. package/dist/theme/dark/components/index.d.ts +567 -478
  56. package/dist/theme/dark/index.d.ts +567 -478
  57. package/dist/theme/index.d.ts +567 -478
  58. package/dist/{theme-DEqiATmv.js → theme-D18AZjTt.js} +112 -61
  59. package/dist/theme-D18AZjTt.js.map +1 -0
  60. package/dist/theme.mjs +1 -1
  61. package/package.json +1 -4
  62. package/dist/RadioGroup-D2s7AY6E.js.map +0 -1
  63. package/dist/RadioGroup.context-zJGC5Sjc.js.map +0 -1
  64. package/dist/Switch-CKpSiHQK.js.map +0 -1
  65. package/dist/ThemeProvider-oFEpvMxv.js +0 -37
  66. package/dist/ThemeProvider-oFEpvMxv.js.map +0 -1
  67. package/dist/emotion-react-jsx-runtime.browser.esm-BFNmScj4.js.map +0 -1
  68. package/dist/theme-DEqiATmv.js.map +0 -1
package/dist/theme/dark/components/Radio.d.ts CHANGED
@@ -1,59 +1,61 @@
1
1
  declare const component: {
2
2
  readonly RADIO: {
3
- readonly ROOT: {
4
- readonly 'border-radius': "4px";
5
- };
6
- readonly EVENTS: {
7
- readonly ENABLED: {
8
- readonly 'color-primary': string;
9
- readonly 'color-secondary': string;
10
- readonly 'icon-color': string;
11
- readonly 'background-color': "transparent";
12
- readonly 'border-color': string;
13
- readonly 'border-width': "2px";
14
- readonly 'border-style': "solid";
15
- };
16
- readonly VALUE: {
17
- readonly 'icon-color': string;
18
- readonly 'border-color': string;
19
- };
20
- readonly HOVER: {
21
- readonly 'shadow-color': string;
22
- };
23
- readonly ACTIVE: {
24
- readonly 'shadow-color': string;
25
- };
26
- readonly FOCUS: {
27
- readonly 'outline-color': string;
28
- readonly 'outline-width': "1px";
29
- readonly 'outline-style': "solid";
30
- readonly 'outline-offset': "2px";
31
- };
32
- readonly ERROR: {
33
- readonly 'background-color': "transparent";
34
- readonly 'color-secondary': string;
35
- readonly 'border-color': string;
36
- };
37
- readonly ERROR_VALUE: {
38
- readonly 'icon-color': string;
39
- readonly 'background-color': string;
40
- };
41
- readonly ERROR_HOVER: {
42
- readonly 'shadow-color': string;
43
- };
44
- readonly ERROR_ACTIVE: {
45
- readonly 'shadow-color': string;
46
- };
47
- readonly ERROR_FOCUS: {
48
- readonly 'outline-color': string;
49
- };
50
- readonly DISABLED: {
51
- readonly 'background-color': "transparent";
52
- readonly 'color-secondary': string;
53
- readonly 'border-color': string;
54
- };
55
- readonly DISABLED_VALUE: {
56
- readonly 'icon-color': string;
3
+ readonly DEFAULT: {
4
+ readonly ROOT: {
5
+ readonly 'border-radius': "4px";
6
+ };
7
+ readonly EVENTS: {
8
+ readonly ENABLED: {
9
+ readonly 'color-primary': string;
10
+ readonly 'color-secondary': string;
11
+ readonly 'icon-color': string;
12
+ readonly 'background-color': "transparent";
13
+ readonly 'border-color': string;
14
+ readonly 'border-width': "2px";
15
+ readonly 'border-style': "solid";
16
+ };
17
+ readonly VALUE: {
18
+ readonly 'icon-color': string;
19
+ readonly 'border-color': string;
20
+ };
21
+ readonly HOVER: {
22
+ readonly 'shadow-color': string;
23
+ };
24
+ readonly ACTIVE: {
25
+ readonly 'shadow-color': string;
26
+ };
27
+ readonly FOCUS: {
28
+ readonly 'outline-color': string;
29
+ readonly 'outline-width': "1px";
30
+ readonly 'outline-style': "solid";
31
+ readonly 'outline-offset': "2px";
32
+ };
33
+ readonly ERROR: {
34
+ readonly 'background-color': "transparent";
35
+ readonly 'color-secondary': string;
36
+ readonly 'border-color': string;
37
+ };
38
+ readonly ERROR_VALUE: {
39
+ readonly 'icon-color': string;
40
+ readonly 'background-color': string;
41
+ };
42
+ readonly ERROR_HOVER: {
43
+ readonly 'shadow-color': string;
44
+ };
45
+ readonly ERROR_ACTIVE: {
46
+ readonly 'shadow-color': string;
47
+ };
48
+ readonly ERROR_FOCUS: {
49
+ readonly 'outline-color': string;
50
+ };
51
+ readonly DISABLED: {
52
+ readonly 'background-color': "transparent";
53
+ readonly 'color-secondary': string;
54
+ readonly 'border-color': string;
55
+ };
56
+ readonly DISABLED_VALUE: {
57
+ readonly 'icon-color': string;
58
+ };
57
59
  };
58
60
  };
59
61
  };
package/dist/theme/dark/components/RadioGroup.d.ts CHANGED
@@ -1,16 +1,18 @@
1
1
  declare const component: {
2
2
  readonly RADIOGROUP: {
3
- readonly EVENTS: {
4
- readonly ENABLED: {
5
- readonly 'color-primary': string;
6
- readonly 'color-secondary': string;
7
- };
8
- readonly ERROR: {
9
- readonly 'color-primary': string;
10
- readonly 'color-secondary': string;
11
- };
12
- readonly DISABLED: {
13
- readonly 'color-secondary': string;
3
+ readonly DEFAULT: {
4
+ readonly EVENTS: {
5
+ readonly ENABLED: {
6
+ readonly 'color-primary': string;
7
+ readonly 'color-secondary': string;
8
+ };
9
+ readonly ERROR: {
10
+ readonly 'color-primary': string;
11
+ readonly 'color-secondary': string;
12
+ };
13
+ readonly DISABLED: {
14
+ readonly 'color-secondary': string;
15
+ };
14
16
  };
15
17
  };
16
18
  };
package/dist/theme/dark/components/Select.d.ts CHANGED
@@ -1,57 +1,59 @@
1
1
  declare const component: {
2
2
  readonly SELECT: {
3
- readonly ROOT: {
4
- readonly 'border-radius': "4px";
5
- };
6
- readonly EVENTS: {
7
- readonly ENABLED: {
8
- readonly 'background-color': "transparent";
9
- readonly 'color-primary': string;
10
- readonly 'color-secondary': string;
11
- readonly 'color-tertiary': string;
12
- readonly 'border-color': string;
13
- readonly 'border-width': "2px";
14
- readonly 'border-style': "solid";
15
- };
16
- readonly VALUE: {
17
- readonly 'border-color': string;
18
- };
19
- readonly HOVER: {
20
- readonly 'border-color': string;
21
- };
22
- readonly ACTIVE: {
23
- readonly 'border-color': string;
24
- };
25
- readonly FOCUS: {
26
- readonly 'border-color': string;
27
- };
28
- readonly ERROR: {
29
- readonly 'background-color': "transparent";
30
- readonly 'color-primary': string;
31
- readonly 'color-secondary': string;
32
- readonly 'color-tertiary': string;
33
- readonly 'border-color': string;
34
- };
35
- readonly ERROR_VALUE: {
36
- readonly 'border-color': string;
37
- };
38
- readonly ERROR_HOVER: {
39
- readonly 'border-color': string;
40
- };
41
- readonly ERROR_ACTIVE: {
42
- readonly 'border-color': string;
43
- };
44
- readonly ERROR_FOCUS: {
45
- readonly 'border-color': string;
46
- };
47
- readonly DISABLED: {
48
- readonly 'background-color': "transparent";
49
- readonly 'color-primary': string;
50
- readonly 'color-secondary': string;
51
- readonly 'color-tertiary': string;
52
- readonly 'border-color': string;
3
+ readonly DEFAULT: {
4
+ readonly ROOT: {
5
+ readonly 'border-radius': "4px";
6
+ };
7
+ readonly EVENTS: {
8
+ readonly ENABLED: {
9
+ readonly 'background-color': "transparent";
10
+ readonly 'color-primary': string;
11
+ readonly 'color-secondary': string;
12
+ readonly 'color-tertiary': string;
13
+ readonly 'border-color': string;
14
+ readonly 'border-width': "2px";
15
+ readonly 'border-style': "solid";
16
+ };
17
+ readonly VALUE: {
18
+ readonly 'border-color': string;
19
+ };
20
+ readonly HOVER: {
21
+ readonly 'border-color': string;
22
+ };
23
+ readonly ACTIVE: {
24
+ readonly 'border-color': string;
25
+ };
26
+ readonly FOCUS: {
27
+ readonly 'border-color': string;
28
+ };
29
+ readonly ERROR: {
30
+ readonly 'background-color': "transparent";
31
+ readonly 'color-primary': string;
32
+ readonly 'color-secondary': string;
33
+ readonly 'color-tertiary': string;
34
+ readonly 'border-color': string;
35
+ };
36
+ readonly ERROR_VALUE: {
37
+ readonly 'border-color': string;
38
+ };
39
+ readonly ERROR_HOVER: {
40
+ readonly 'border-color': string;
41
+ };
42
+ readonly ERROR_ACTIVE: {
43
+ readonly 'border-color': string;
44
+ };
45
+ readonly ERROR_FOCUS: {
46
+ readonly 'border-color': string;
47
+ };
48
+ readonly DISABLED: {
49
+ readonly 'background-color': "transparent";
50
+ readonly 'color-primary': string;
51
+ readonly 'color-secondary': string;
52
+ readonly 'color-tertiary': string;
53
+ readonly 'border-color': string;
54
+ };
55
+ readonly DISABLED_VALUE: {};
53
56
  };
54
- readonly DISABLED_VALUE: {};
55
57
  };
56
58
  };
57
59
  };
package/dist/theme/dark/components/SelectMenu.d.ts CHANGED
@@ -1,28 +1,30 @@
1
1
  declare const component: {
2
2
  readonly SELECTMENU: {
3
- readonly ROOT: {
4
- readonly 'background-color': string;
5
- readonly 'border-radius': "4px";
6
- readonly top: "4px";
7
- };
8
- readonly EVENTS: {
9
- readonly ENABLED: {
10
- readonly 'background-color': "transparent";
11
- readonly 'color-primary': string;
12
- readonly 'color-secondary': string;
13
- readonly 'color-tertiary': string;
14
- };
15
- readonly VALUE: {
16
- readonly 'background-color': string;
17
- };
18
- readonly HOVER: {
3
+ readonly DEFAULT: {
4
+ readonly ROOT: {
19
5
  readonly 'background-color': string;
6
+ readonly 'border-radius': "4px";
7
+ readonly top: "4px";
20
8
  };
21
- readonly ACTIVE: {
22
- readonly 'background-color': string;
23
- };
24
- readonly FOCUS: {
25
- readonly 'background-color': string;
9
+ readonly EVENTS: {
10
+ readonly ENABLED: {
11
+ readonly 'background-color': "transparent";
12
+ readonly 'color-primary': string;
13
+ readonly 'color-secondary': string;
14
+ readonly 'color-tertiary': string;
15
+ };
16
+ readonly VALUE: {
17
+ readonly 'background-color': string;
18
+ };
19
+ readonly HOVER: {
20
+ readonly 'background-color': string;
21
+ };
22
+ readonly ACTIVE: {
23
+ readonly 'background-color': string;
24
+ };
25
+ readonly FOCUS: {
26
+ readonly 'background-color': string;
27
+ };
26
28
  };
27
29
  };
28
30
  };
package/dist/theme/dark/components/Slider.d.ts CHANGED
@@ -1,44 +1,46 @@
1
1
  declare const component: {
2
2
  readonly SLIDER: {
3
- readonly EVENTS: {
4
- readonly ENABLED: {
5
- readonly 'icon-color': string;
6
- readonly 'icon-background-color': string;
7
- readonly 'background-color': string;
8
- readonly 'border-color': string;
9
- readonly 'border-width': "2px";
10
- readonly 'border-style': "solid";
11
- };
12
- readonly VALUE: {
13
- readonly 'background-color': string;
14
- };
15
- readonly HOVER: {
16
- readonly 'background-color': string;
17
- };
18
- readonly ACTIVE: {
19
- readonly 'background-color': string;
20
- };
21
- readonly FOCUS: {
22
- readonly 'outline-color': string;
23
- readonly 'outline-width': "1px";
24
- readonly 'outline-style': "solid";
25
- readonly 'outline-offset': "2px";
26
- };
27
- readonly DISABLED: {
28
- readonly 'icon-color': string;
29
- readonly 'icon-background-color': string;
30
- readonly 'background-color': string;
31
- readonly 'border-color': string;
32
- readonly 'border-width': "2px";
33
- readonly 'border-style': "solid";
34
- };
35
- readonly DISABLED_VALUE: {
36
- readonly 'icon-color': string;
37
- readonly 'icon-background-color': string;
38
- readonly 'background-color': string;
39
- readonly 'border-color': string;
40
- readonly 'border-width': "2px";
41
- readonly 'border-style': "solid";
3
+ readonly DEFAULT: {
4
+ readonly EVENTS: {
5
+ readonly ENABLED: {
6
+ readonly 'icon-color': string;
7
+ readonly 'icon-background-color': string;
8
+ readonly 'background-color': string;
9
+ readonly 'border-color': string;
10
+ readonly 'border-width': "2px";
11
+ readonly 'border-style': "solid";
12
+ };
13
+ readonly VALUE: {
14
+ readonly 'background-color': string;
15
+ };
16
+ readonly HOVER: {
17
+ readonly 'background-color': string;
18
+ };
19
+ readonly ACTIVE: {
20
+ readonly 'background-color': string;
21
+ };
22
+ readonly FOCUS: {
23
+ readonly 'outline-color': string;
24
+ readonly 'outline-width': "1px";
25
+ readonly 'outline-style': "solid";
26
+ readonly 'outline-offset': "2px";
27
+ };
28
+ readonly DISABLED: {
29
+ readonly 'icon-color': string;
30
+ readonly 'icon-background-color': string;
31
+ readonly 'background-color': string;
32
+ readonly 'border-color': string;
33
+ readonly 'border-width': "2px";
34
+ readonly 'border-style': "solid";
35
+ };
36
+ readonly DISABLED_VALUE: {
37
+ readonly 'icon-color': string;
38
+ readonly 'icon-background-color': string;
39
+ readonly 'background-color': string;
40
+ readonly 'border-color': string;
41
+ readonly 'border-width': "2px";
42
+ readonly 'border-style': "solid";
43
+ };
42
44
  };
43
45
  };
44
46
  };
package/dist/theme/dark/components/Switch.d.ts CHANGED
@@ -1,53 +1,55 @@
1
1
  declare const component: {
2
2
  readonly SWITCH: {
3
- readonly ROOT: {
4
- readonly 'border-radius': "12px";
5
- };
6
- readonly EVENTS: {
7
- readonly ENABLED: {
8
- readonly 'color-primary': string;
9
- readonly 'color-secondary': string;
10
- readonly 'icon-color': string;
11
- readonly 'icon-background-color': string;
12
- readonly 'background-color': "transparent";
13
- readonly 'border-color': string;
14
- readonly 'border-width': "2px";
15
- readonly 'border-style': "solid";
16
- };
17
- readonly VALUE: {
18
- readonly 'icon-color': string;
19
- readonly 'icon-background-color': string;
20
- readonly 'background-color': string;
21
- readonly 'border-color': string;
22
- };
23
- readonly HOVER: {
24
- readonly 'shadow-color': string;
25
- };
26
- readonly ACTIVE: {
27
- readonly 'shadow-color': string;
28
- };
29
- readonly FOCUS: {
30
- readonly 'outline-color': string;
31
- readonly 'outline-width': "1px";
32
- readonly 'outline-style': "solid";
33
- readonly 'outline-offset': "2px";
34
- };
35
- readonly DISABLED: {
36
- readonly 'icon-color': string;
37
- readonly 'icon-background-color': string;
38
- readonly 'background-color': "transparent";
39
- readonly 'color-secondary': string;
40
- readonly 'border-color': string;
41
- readonly 'border-width': "2px";
42
- readonly 'border-style': "solid";
3
+ readonly DEFAULT: {
4
+ readonly ROOT: {
5
+ readonly 'border-radius': "12px";
43
6
  };
44
- readonly DISABLED_VALUE: {
45
- readonly 'icon-color': string;
46
- readonly 'icon-background-color': string;
47
- readonly 'background-color': string;
48
- readonly 'border-color': string;
49
- readonly 'border-width': "2px";
50
- readonly 'border-style': "solid";
7
+ readonly EVENTS: {
8
+ readonly ENABLED: {
9
+ readonly 'color-primary': string;
10
+ readonly 'color-secondary': string;
11
+ readonly 'icon-color': string;
12
+ readonly 'icon-background-color': string;
13
+ readonly 'background-color': "transparent";
14
+ readonly 'border-color': string;
15
+ readonly 'border-width': "2px";
16
+ readonly 'border-style': "solid";
17
+ };
18
+ readonly VALUE: {
19
+ readonly 'icon-color': string;
20
+ readonly 'icon-background-color': string;
21
+ readonly 'background-color': string;
22
+ readonly 'border-color': string;
23
+ };
24
+ readonly HOVER: {
25
+ readonly 'shadow-color': string;
26
+ };
27
+ readonly ACTIVE: {
28
+ readonly 'shadow-color': string;
29
+ };
30
+ readonly FOCUS: {
31
+ readonly 'outline-color': string;
32
+ readonly 'outline-width': "1px";
33
+ readonly 'outline-style': "solid";
34
+ readonly 'outline-offset': "2px";
35
+ };
36
+ readonly DISABLED: {
37
+ readonly 'icon-color': string;
38
+ readonly 'icon-background-color': string;
39
+ readonly 'background-color': "transparent";
40
+ readonly 'color-secondary': string;
41
+ readonly 'border-color': string;
42
+ readonly 'border-width': "2px";
43
+ readonly 'border-style': "solid";
44
+ };
45
+ readonly DISABLED_VALUE: {
46
+ readonly 'icon-color': string;
47
+ readonly 'icon-background-color': string;
48
+ readonly 'background-color': string;
49
+ readonly 'border-color': string;
50
+ readonly 'border-width': "2px";
51
+ readonly 'border-style': "solid";
52
+ };
51
53
  };
52
54
  };
53
55
  };