@codeandfunction/callaloo 1.18.10 → 2.0.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.
Files changed (59) hide show
  1. package/README.md +2 -0
  2. package/package.json +52 -43
  3. package/dist/assets/index.css +0 -1
  4. package/dist/components/Assets/CLIcon.vue.d.ts +0 -13
  5. package/dist/components/Buttons/CLA11yButton.vue.d.ts +0 -37
  6. package/dist/components/Buttons/CLButton.vue.d.ts +0 -247
  7. package/dist/components/Buttons/utils.d.ts +0 -7
  8. package/dist/components/Containers/CLCard.vue.d.ts +0 -44
  9. package/dist/components/Containers/CLDisclosure.vue.d.ts +0 -75
  10. package/dist/components/Containers/Carousel/CLCarousel.vue.d.ts +0 -57
  11. package/dist/components/Containers/Carousel/CLCarouselNavigation.vue.d.ts +0 -21
  12. package/dist/components/Containers/Carousel/CLCarouselSlide.vue.d.ts +0 -17
  13. package/dist/components/Containers/utils.d.ts +0 -7
  14. package/dist/components/Form/CLCheckbox.vue.d.ts +0 -52
  15. package/dist/components/Form/CLFormField.vue.d.ts +0 -23
  16. package/dist/components/Form/CLInput.vue.d.ts +0 -85
  17. package/dist/components/Form/CLInputMessages.vue.d.ts +0 -10
  18. package/dist/components/Form/CLRadioButton.vue.d.ts +0 -52
  19. package/dist/components/Form/CLSelect.vue.d.ts +0 -58
  20. package/dist/components/Form/CLTextArea.vue.d.ts +0 -77
  21. package/dist/components/Form/utils.d.ts +0 -12
  22. package/dist/components/Indicators/CLBadge.vue.d.ts +0 -21
  23. package/dist/components/Indicators/CLBanner.vue.d.ts +0 -12
  24. package/dist/components/Indicators/CLPill.vue.d.ts +0 -26
  25. package/dist/components/Indicators/utils.d.ts +0 -8
  26. package/dist/components/Loading/CLSkeleton.vue.d.ts +0 -20
  27. package/dist/components/Loading/CLSpinner.vue.d.ts +0 -21
  28. package/dist/components/Loading/utils.d.ts +0 -6
  29. package/dist/components/Modals/CLModal.vue.d.ts +0 -44
  30. package/dist/components/Modals/utils.d.ts +0 -1
  31. package/dist/components/Navigation/CLLink.vue.d.ts +0 -45
  32. package/dist/components/Navigation/CLNavLink.vue.d.ts +0 -43
  33. package/dist/components/Navigation/CLNavSection.vue.d.ts +0 -17
  34. package/dist/components/Navigation/utils.d.ts +0 -7
  35. package/dist/components/Popups/CLDropdownMenu.vue.d.ts +0 -291
  36. package/dist/components/Popups/CLToast.vue.d.ts +0 -10
  37. package/dist/components/Popups/utils.d.ts +0 -4
  38. package/dist/components/Table/CLTable.vue.d.ts +0 -46
  39. package/dist/components/Table/CLTableBody.vue.d.ts +0 -17
  40. package/dist/components/Table/CLTableCell.vue.d.ts +0 -41
  41. package/dist/components/Table/CLTableFooter.vue.d.ts +0 -17
  42. package/dist/components/Table/CLTableHeader.vue.d.ts +0 -17
  43. package/dist/components/Table/CLTableNestedCell.vue.d.ts +0 -20
  44. package/dist/components/Table/CLTableRow.vue.d.ts +0 -22
  45. package/dist/components/Table/utils.d.ts +0 -1
  46. package/dist/components/Theme/CLThemeProvider.vue.d.ts +0 -22
  47. package/dist/components/Theme/base-theme.d.ts +0 -188
  48. package/dist/components/Theme/utils.d.ts +0 -21
  49. package/dist/components/Typography/CLHeading.vue.d.ts +0 -64
  50. package/dist/components/Typography/CLText.vue.d.ts +0 -87
  51. package/dist/components/Typography/utils.d.ts +0 -7
  52. package/dist/composables/useDropdown.d.ts +0 -14
  53. package/dist/composables/useEsc.d.ts +0 -9
  54. package/dist/constants.d.ts +0 -22
  55. package/dist/index.d.ts +0 -37
  56. package/dist/index.js +0 -8256
  57. package/dist/index.js.map +0 -1
  58. package/dist/types.d.ts +0 -581
  59. package/dist/utils/helper.d.ts +0 -16
@@ -1,188 +0,0 @@
1
- import { CLTheme, CLThemeConfig } from '../../index';
2
- export declare const DEFAULT_THEME: CLThemeConfig;
3
- export declare enum COLOR_KEYS {
4
- focusBorder = 600,
5
- focusShadow = 100,
6
- outlineBorderBase = 300,
7
- outlineBorderHover = 700,
8
- outlineBgHover = 100,
9
- solidBgBase = 100,
10
- solidBgDark = 900,
11
- solidBgDarkHover = 700,
12
- solidBgDarkBorder = 500,
13
- solidBgDisabled = 100,
14
- solidBgLight = 100,
15
- solidBgLightHover = 200,
16
- solidBgLightBorder = 300,
17
- solidBgHover = 200,
18
- solidBorderBase = 300,
19
- solidBorderDisabled = 200,
20
- text = 800,
21
- textDark = 100,
22
- textDarkHover = 200,
23
- textDisabled = 300,
24
- textHover = 900,
25
- textLight = 800,
26
- textLightHover = 900
27
- }
28
- export declare const setupTheme: (config?: CLThemeConfig) => void;
29
- export declare const useTheme: () => {
30
- colors: import('vue').Ref<{
31
- primary?: {
32
- 100?: string | undefined;
33
- 200?: string | undefined;
34
- 300?: string | undefined;
35
- 400?: string | undefined;
36
- 500?: string | undefined;
37
- 600?: string | undefined;
38
- 700?: string | undefined;
39
- 800?: string | undefined;
40
- 900?: string | undefined;
41
- } | undefined;
42
- secondary?: {
43
- 100?: string | undefined;
44
- 200?: string | undefined;
45
- 300?: string | undefined;
46
- 400?: string | undefined;
47
- 500?: string | undefined;
48
- 600?: string | undefined;
49
- 700?: string | undefined;
50
- 800?: string | undefined;
51
- 900?: string | undefined;
52
- } | undefined;
53
- neutral?: {
54
- 100?: string | undefined;
55
- 200?: string | undefined;
56
- 300?: string | undefined;
57
- 400?: string | undefined;
58
- 500?: string | undefined;
59
- 600?: string | undefined;
60
- 700?: string | undefined;
61
- 800?: string | undefined;
62
- 900?: string | undefined;
63
- } | undefined;
64
- danger?: {
65
- 100?: string | undefined;
66
- 200?: string | undefined;
67
- 300?: string | undefined;
68
- 400?: string | undefined;
69
- 500?: string | undefined;
70
- 600?: string | undefined;
71
- 700?: string | undefined;
72
- 800?: string | undefined;
73
- 900?: string | undefined;
74
- } | undefined;
75
- warning?: {
76
- 100?: string | undefined;
77
- 200?: string | undefined;
78
- 300?: string | undefined;
79
- 400?: string | undefined;
80
- 500?: string | undefined;
81
- 600?: string | undefined;
82
- 700?: string | undefined;
83
- 800?: string | undefined;
84
- 900?: string | undefined;
85
- } | undefined;
86
- success?: {
87
- 100?: string | undefined;
88
- 200?: string | undefined;
89
- 300?: string | undefined;
90
- 400?: string | undefined;
91
- 500?: string | undefined;
92
- 600?: string | undefined;
93
- 700?: string | undefined;
94
- 800?: string | undefined;
95
- 900?: string | undefined;
96
- } | undefined;
97
- info?: {
98
- 100?: string | undefined;
99
- 200?: string | undefined;
100
- 300?: string | undefined;
101
- 400?: string | undefined;
102
- 500?: string | undefined;
103
- 600?: string | undefined;
104
- 700?: string | undefined;
105
- 800?: string | undefined;
106
- 900?: string | undefined;
107
- } | undefined;
108
- }, CLTheme | {
109
- primary?: {
110
- 100?: string | undefined;
111
- 200?: string | undefined;
112
- 300?: string | undefined;
113
- 400?: string | undefined;
114
- 500?: string | undefined;
115
- 600?: string | undefined;
116
- 700?: string | undefined;
117
- 800?: string | undefined;
118
- 900?: string | undefined;
119
- } | undefined;
120
- secondary?: {
121
- 100?: string | undefined;
122
- 200?: string | undefined;
123
- 300?: string | undefined;
124
- 400?: string | undefined;
125
- 500?: string | undefined;
126
- 600?: string | undefined;
127
- 700?: string | undefined;
128
- 800?: string | undefined;
129
- 900?: string | undefined;
130
- } | undefined;
131
- neutral?: {
132
- 100?: string | undefined;
133
- 200?: string | undefined;
134
- 300?: string | undefined;
135
- 400?: string | undefined;
136
- 500?: string | undefined;
137
- 600?: string | undefined;
138
- 700?: string | undefined;
139
- 800?: string | undefined;
140
- 900?: string | undefined;
141
- } | undefined;
142
- danger?: {
143
- 100?: string | undefined;
144
- 200?: string | undefined;
145
- 300?: string | undefined;
146
- 400?: string | undefined;
147
- 500?: string | undefined;
148
- 600?: string | undefined;
149
- 700?: string | undefined;
150
- 800?: string | undefined;
151
- 900?: string | undefined;
152
- } | undefined;
153
- warning?: {
154
- 100?: string | undefined;
155
- 200?: string | undefined;
156
- 300?: string | undefined;
157
- 400?: string | undefined;
158
- 500?: string | undefined;
159
- 600?: string | undefined;
160
- 700?: string | undefined;
161
- 800?: string | undefined;
162
- 900?: string | undefined;
163
- } | undefined;
164
- success?: {
165
- 100?: string | undefined;
166
- 200?: string | undefined;
167
- 300?: string | undefined;
168
- 400?: string | undefined;
169
- 500?: string | undefined;
170
- 600?: string | undefined;
171
- 700?: string | undefined;
172
- 800?: string | undefined;
173
- 900?: string | undefined;
174
- } | undefined;
175
- info?: {
176
- 100?: string | undefined;
177
- 200?: string | undefined;
178
- 300?: string | undefined;
179
- 400?: string | undefined;
180
- 500?: string | undefined;
181
- 600?: string | undefined;
182
- 700?: string | undefined;
183
- 800?: string | undefined;
184
- 900?: string | undefined;
185
- } | undefined;
186
- }>;
187
- updateBaseColors: (config: CLThemeConfig) => void;
188
- };
@@ -1,21 +0,0 @@
1
- import { CLThemeKeys, CLThemes } from '../../index';
2
- export declare const baseContentBox: () => string;
3
- interface BaseFormElementProps {
4
- borderColor?: string;
5
- placeholderColor?: string;
6
- }
7
- export declare const baseFormElement: ({ borderColor, placeholderColor, }: BaseFormElementProps) => string;
8
- export declare const css: (template: TemplateStringsArray, ...args: any[]) => string;
9
- export declare const cx: (...classNames: any[]) => string;
10
- interface FocusProps {
11
- borderColor?: string;
12
- outlineWidth?: string;
13
- outlineOffset?: string;
14
- outlineColor?: string;
15
- shadowWidth?: string;
16
- shadowColor?: string;
17
- }
18
- export declare const focusTheme: ({ borderColor, outlineWidth, outlineOffset, outlineColor, shadowWidth, shadowColor, }: FocusProps) => string;
19
- export declare const getThemeKeys: (theme: CLThemes) => CLThemeKeys;
20
- export declare const getOutlineColor: (outlineColor: string) => CLThemeKeys;
21
- export {};
@@ -1,64 +0,0 @@
1
- import { PropType } from 'vue';
2
- import { CLAlign, CLHeadingLevels, CLHeadingTypes, CLHeadingThemes, CLThemes } from '../../index';
3
- /**
4
- * The `<CLHeading />` component renders text as a heading element.
5
- */
6
- declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
7
- /** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left` */
8
- align: {
9
- type: PropType<CLAlign>;
10
- default: CLAlign;
11
- };
12
- /** Set the heading level. The property can be one of `CLHeadingLevels`, e.g. `CLHeadingLevels.H1` */
13
- level: {
14
- type: PropType<CLHeadingLevels>;
15
- };
16
- /** Sets a custom ID used for unit tests. */
17
- testId: {
18
- type: StringConstructor;
19
- default: string;
20
- };
21
- /** Set the theme of the heading. The property can be one of `CLHeadingThemes`, e.g. `CLThemes.Dark` */
22
- theme: {
23
- type: PropType<CLHeadingThemes>;
24
- default: CLThemes;
25
- };
26
- /** Set the type of the heading. The property can be one of `CLHeadingTypes`, e.g. `CLHeadingTypes.Title` */
27
- type: {
28
- type: PropType<CLHeadingTypes>;
29
- default: CLHeadingTypes;
30
- };
31
- }>, {}, {}, {}, {
32
- getLevel(): CLHeadingLevels;
33
- }, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
34
- /** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left` */
35
- align: {
36
- type: PropType<CLAlign>;
37
- default: CLAlign;
38
- };
39
- /** Set the heading level. The property can be one of `CLHeadingLevels`, e.g. `CLHeadingLevels.H1` */
40
- level: {
41
- type: PropType<CLHeadingLevels>;
42
- };
43
- /** Sets a custom ID used for unit tests. */
44
- testId: {
45
- type: StringConstructor;
46
- default: string;
47
- };
48
- /** Set the theme of the heading. The property can be one of `CLHeadingThemes`, e.g. `CLThemes.Dark` */
49
- theme: {
50
- type: PropType<CLHeadingThemes>;
51
- default: CLThemes;
52
- };
53
- /** Set the type of the heading. The property can be one of `CLHeadingTypes`, e.g. `CLHeadingTypes.Title` */
54
- type: {
55
- type: PropType<CLHeadingTypes>;
56
- default: CLHeadingTypes;
57
- };
58
- }>> & Readonly<{}>, {
59
- theme: CLHeadingThemes;
60
- testId: string;
61
- type: CLHeadingTypes;
62
- align: CLAlign;
63
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
64
- export default _default;
@@ -1,87 +0,0 @@
1
- import { PropType } from 'vue';
2
- import { CLAlign, CLTextHtmlTags, CLTextThemes, CLTextTypes, CLThemes } from '../../index';
3
- /**
4
- * The `<CLText />` component renders a text element.
5
- */
6
- declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
7
- /** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left` */
8
- align: {
9
- type: PropType<CLAlign>;
10
- default: CLAlign;
11
- };
12
- /** Set the HTML tag of the text element. The property can be one of `CLTextHtmlTags`, e.g. `p`. */
13
- as: {
14
- type: PropType<CLTextHtmlTags>;
15
- default: string;
16
- };
17
- /** Rendered a bolded text. */
18
- label: {
19
- type: BooleanConstructor;
20
- default: boolean;
21
- };
22
- /** Set the text type. The property can be one of `CLTextTypes`, e.g. `Body`. */
23
- type: {
24
- type: PropType<CLTextTypes>;
25
- default: CLTextTypes;
26
- };
27
- /** Sets a custom ID used for unit tests. */
28
- testId: {
29
- type: StringConstructor;
30
- default: string;
31
- };
32
- /** Set the text theme. The property can be one of `CLTextThemes`, e.g. `CLThemes.Dark`. */
33
- theme: {
34
- type: PropType<CLTextThemes>;
35
- default: CLThemes;
36
- };
37
- /** When set to `true`, truncate the text if it overflows its container. */
38
- truncate: {
39
- type: BooleanConstructor;
40
- default: boolean;
41
- };
42
- }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
43
- /** Set the horizontal alignment of content. The property can be one of `CLAlign`, e.g. `CLAlign.Left` */
44
- align: {
45
- type: PropType<CLAlign>;
46
- default: CLAlign;
47
- };
48
- /** Set the HTML tag of the text element. The property can be one of `CLTextHtmlTags`, e.g. `p`. */
49
- as: {
50
- type: PropType<CLTextHtmlTags>;
51
- default: string;
52
- };
53
- /** Rendered a bolded text. */
54
- label: {
55
- type: BooleanConstructor;
56
- default: boolean;
57
- };
58
- /** Set the text type. The property can be one of `CLTextTypes`, e.g. `Body`. */
59
- type: {
60
- type: PropType<CLTextTypes>;
61
- default: CLTextTypes;
62
- };
63
- /** Sets a custom ID used for unit tests. */
64
- testId: {
65
- type: StringConstructor;
66
- default: string;
67
- };
68
- /** Set the text theme. The property can be one of `CLTextThemes`, e.g. `CLThemes.Dark`. */
69
- theme: {
70
- type: PropType<CLTextThemes>;
71
- default: CLThemes;
72
- };
73
- /** When set to `true`, truncate the text if it overflows its container. */
74
- truncate: {
75
- type: BooleanConstructor;
76
- default: boolean;
77
- };
78
- }>> & Readonly<{}>, {
79
- label: boolean;
80
- theme: CLTextThemes;
81
- testId: string;
82
- type: CLTextTypes;
83
- align: CLAlign;
84
- as: CLTextHtmlTags;
85
- truncate: boolean;
86
- }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
87
- export default _default;
@@ -1,7 +0,0 @@
1
- import { CLThemes } from '../../index';
2
- interface TextThemeProps {
3
- color?: CLThemes;
4
- component: string;
5
- }
6
- export declare const textTheme: ({ color, component, }: TextThemeProps) => string;
7
- export {};
@@ -1,14 +0,0 @@
1
- import { Ref } from 'vue';
2
- interface Props {
3
- triggerRef?: Ref<HTMLButtonElement | undefined>;
4
- dropdownRef?: Ref<HTMLElement | undefined>;
5
- openDropdownHandler?: () => void;
6
- closeDropdownHandler?: () => void;
7
- }
8
- export declare const useDropdown: ({ triggerRef, dropdownRef, openDropdownHandler, closeDropdownHandler, }: Props) => {
9
- open: Ref<boolean, boolean>;
10
- toggleDropdown: () => void;
11
- closeDropdown: () => void;
12
- clearEventListeners: () => void;
13
- };
14
- export {};
@@ -1,9 +0,0 @@
1
- import { Ref } from 'vue';
2
- interface Props {
3
- escHandler?: () => void;
4
- triggerRef?: Ref<HTMLElement | undefined>;
5
- }
6
- export declare const useEsc: ({ escHandler, triggerRef }: Props) => {
7
- clearEventListeners: () => void;
8
- };
9
- export {};
@@ -1,22 +0,0 @@
1
- import { CLIconSizes, CLTextTypes } from './index';
2
- export declare const DecoratorIconSize: {
3
- tiny: CLIconSizes;
4
- small: CLIconSizes;
5
- medium: CLIconSizes;
6
- large: CLIconSizes;
7
- xlarge: CLIconSizes;
8
- };
9
- export declare const InputLabelSizes: {
10
- tiny: CLTextTypes;
11
- small: CLTextTypes;
12
- medium: CLTextTypes;
13
- large: CLTextTypes;
14
- xlarge: CLTextTypes;
15
- };
16
- export declare const LabelSizes: {
17
- tiny: CLTextTypes;
18
- small: CLTextTypes;
19
- medium: CLTextTypes;
20
- large: CLTextTypes;
21
- xlarge: CLTextTypes;
22
- };
package/dist/index.d.ts DELETED
@@ -1,37 +0,0 @@
1
- export { Align as CLAlign, BorderRadius as CLBorderRadius, ButtonTypes as CLButtonTypes, CardTypes as CLCardTypes, DarkMode as CLDarkMode, HeadingLevels as CLHeadingLevels, HeadingTypes as CLHeadingTypes, IconSizes as CLIconSizes, IconNames as CLIconNames, InputTypes as CLInputTypes, LinkTarget as CLLinkTarget, Orientation as CLOrientation, Order as CLOrder, PaginationType as CLPaginationType, Placement as CLPlacement, Position as CLPosition, Sizes as CLSizes, TableTypes as CLTableTypes, TextTypes as CLTextTypes, Themes as CLThemes, } from './types';
2
- export type { BadgeThemes as CLBadgeThemes, BannerProps as CLBannerProps, CardProps as CLCardProps, HeadingThemes as CLHeadingThemes, InputThemes as CLInputThemes, GenericFunction as CLGenericFunction, GenericFocusFunction as CLGenericFocusFunction, MessageThemes as CLMessageThemes, NavItem as CLNavItem, PillThemes as CLPillThemes, Option as CLOption, SimpleThemes as CLSimpleThemes, SpinnerThemes as CLSpinnerThemes, Theme as CLTheme, ThemeConfig as CLThemeConfig, ThemeKeys as CLThemeKeys, TextThemes as CLTextThemes, TextHtmlTags as CLTextHtmlTags, ToastProps as CLToastProps, ToastThemes as CLToastThemes, } from './types';
3
- export { default as CLA11yButton } from './components/Buttons/CLA11yButton.vue';
4
- export { default as CLBadge } from './components/Indicators/CLBadge.vue';
5
- export { default as CLBanner } from './components/Indicators/CLBanner.vue';
6
- export { default as CLButton } from './components/Buttons/CLButton.vue';
7
- export { default as CLCard } from './components/Containers/CLCard.vue';
8
- export { default as CLCarousel } from './components/Containers/Carousel/CLCarousel.vue';
9
- export { default as CLCarouselSlide } from './components/Containers/Carousel/CLCarouselSlide.vue';
10
- export { default as CLCheckbox } from './components/Form/CLCheckbox.vue';
11
- export { default as CLDisclosure } from './components/Containers/CLDisclosure.vue';
12
- export { default as CLFormField } from './components/Form/CLFormField.vue';
13
- export { default as CLHeading } from './components/Typography/CLHeading.vue';
14
- export { default as CLIcon } from './components/Assets/CLIcon.vue';
15
- export { default as CLInput } from './components/Form/CLInput.vue';
16
- export { default as CLLink } from './components/Navigation/CLLink.vue';
17
- export { default as CLDropdownMenu } from './components/Popups/CLDropdownMenu.vue';
18
- export { default as CLModal } from './components/Modals/CLModal.vue';
19
- export { default as CLNavLink } from './components/Navigation/CLNavLink.vue';
20
- export { default as CLNavSection } from './components/Navigation/CLNavSection.vue';
21
- export { default as CLPill } from './components/Indicators/CLPill.vue';
22
- export { default as CLRadioButton } from './components/Form/CLRadioButton.vue';
23
- export { default as CLSelect } from './components/Form/CLSelect.vue';
24
- export { default as CLSkeleton } from './components/Loading/CLSkeleton.vue';
25
- export { default as CLSpinner } from './components/Loading/CLSpinner.vue';
26
- export { default as CLTable } from './components/Table/CLTable.vue';
27
- export { default as CLTableBody } from './components/Table/CLTableBody.vue';
28
- export { default as CLTableCell } from './components/Table/CLTableCell.vue';
29
- export { default as CLTableFooter } from './components/Table/CLTableFooter.vue';
30
- export { default as CLTableHeader } from './components/Table/CLTableHeader.vue';
31
- export { default as CLTableNestedCell } from './components/Table/CLTableNestedCell.vue';
32
- export { default as CLTableRow } from './components/Table/CLTableRow.vue';
33
- export { default as CLText } from './components/Typography/CLText.vue';
34
- export { default as CLTextArea } from './components/Form/CLTextArea.vue';
35
- export { default as CLThemeProvider } from './components/Theme/CLThemeProvider.vue';
36
- export { default as CLToast } from './components/Popups/CLToast.vue';
37
- export { DEFAULT_THEME, useTheme } from './components/Theme/base-theme';