@stack-spot/citric-react 0.42.0-beta.0 → 0.42.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 (208) hide show
  1. package/CHANGELOG.md +13 -13
  2. package/dist/citric.css +2849 -3081
  3. package/dist/components/Accordion.d.ts +1 -1
  4. package/dist/components/Accordion.js +1 -1
  5. package/dist/components/Alert.d.ts +1 -1
  6. package/dist/components/Alert.js +1 -1
  7. package/dist/components/AsyncContent.d.ts +1 -1
  8. package/dist/components/AsyncContent.js +1 -1
  9. package/dist/components/Avatar.d.ts +1 -1
  10. package/dist/components/Avatar.js +1 -1
  11. package/dist/components/AvatarGroup.d.ts +1 -1
  12. package/dist/components/AvatarGroup.js +1 -1
  13. package/dist/components/Badge.d.ts +1 -1
  14. package/dist/components/Badge.js +1 -1
  15. package/dist/components/Blockquote.d.ts +1 -1
  16. package/dist/components/Blockquote.js +1 -1
  17. package/dist/components/Breadcrumb.d.ts +1 -1
  18. package/dist/components/Breadcrumb.js +1 -1
  19. package/dist/components/Button.d.ts +1 -1
  20. package/dist/components/Button.js +1 -1
  21. package/dist/components/ButtonLink.d.ts +1 -1
  22. package/dist/components/ButtonLink.js +1 -1
  23. package/dist/components/Card.d.ts +1 -1
  24. package/dist/components/Card.js +1 -1
  25. package/dist/components/Checkbox.d.ts +1 -1
  26. package/dist/components/Checkbox.d.ts.map +1 -1
  27. package/dist/components/Checkbox.js +2 -2
  28. package/dist/components/Checkbox.js.map +1 -1
  29. package/dist/components/CheckboxGroup.d.ts +1 -1
  30. package/dist/components/CheckboxGroup.js +1 -1
  31. package/dist/components/Circle.d.ts +1 -1
  32. package/dist/components/Circle.js +1 -1
  33. package/dist/components/CitricComponent.d.ts +1 -1
  34. package/dist/components/CitricComponent.d.ts.map +1 -1
  35. package/dist/components/Divider.d.ts +1 -1
  36. package/dist/components/Divider.js +1 -1
  37. package/dist/components/ErrorBoundary.d.ts +1 -1
  38. package/dist/components/ErrorBoundary.js +1 -1
  39. package/dist/components/ErrorMessage.d.ts +1 -1
  40. package/dist/components/ErrorMessage.js +1 -1
  41. package/dist/components/FallbackBoundary.d.ts +1 -1
  42. package/dist/components/FallbackBoundary.js +1 -1
  43. package/dist/components/Favorite.d.ts +1 -1
  44. package/dist/components/Favorite.js +1 -1
  45. package/dist/components/FieldGroup.d.ts +1 -1
  46. package/dist/components/FieldGroup.js +1 -1
  47. package/dist/components/Form.d.ts +2 -2
  48. package/dist/components/Form.js +1 -1
  49. package/dist/components/FormGroup.d.ts +1 -1
  50. package/dist/components/FormGroup.js +1 -1
  51. package/dist/components/Icon.d.ts +1 -1
  52. package/dist/components/Icon.js +1 -1
  53. package/dist/components/IconBox.d.ts +3 -3
  54. package/dist/components/IconBox.js +1 -1
  55. package/dist/components/ImageBox.d.ts +3 -3
  56. package/dist/components/ImageBox.js +1 -1
  57. package/dist/components/ImageWithFallback.d.ts +1 -1
  58. package/dist/components/ImageWithFallback.js +1 -1
  59. package/dist/components/Input.d.ts +1 -1
  60. package/dist/components/Input.js +1 -1
  61. package/dist/components/Link.d.ts +1 -1
  62. package/dist/components/Link.js +1 -1
  63. package/dist/components/LoadingPanel.d.ts +1 -1
  64. package/dist/components/LoadingPanel.js +1 -1
  65. package/dist/components/MenuOverlay/Menu.d.ts +1 -1
  66. package/dist/components/MenuOverlay/Menu.js +1 -1
  67. package/dist/components/MenuOverlay/index.d.ts +1 -1
  68. package/dist/components/MenuOverlay/index.js +1 -1
  69. package/dist/components/Overlay/index.d.ts +1 -1
  70. package/dist/components/Overlay/index.js +1 -1
  71. package/dist/components/Pagination.d.ts +1 -1
  72. package/dist/components/Pagination.js +1 -1
  73. package/dist/components/ProgressBar.d.ts +1 -1
  74. package/dist/components/ProgressBar.js +1 -1
  75. package/dist/components/ProgressCircular.d.ts +1 -1
  76. package/dist/components/ProgressCircular.js +1 -1
  77. package/dist/components/RadioGroup.d.ts +1 -1
  78. package/dist/components/RadioGroup.js +1 -1
  79. package/dist/components/Rating.d.ts +1 -1
  80. package/dist/components/Rating.js +1 -1
  81. package/dist/components/Select/MultiSelect.d.ts +1 -1
  82. package/dist/components/Select/MultiSelect.js +1 -1
  83. package/dist/components/Select/RichSelect.d.ts +1 -1
  84. package/dist/components/Select/RichSelect.js +1 -1
  85. package/dist/components/Select/SimpleSelect.d.ts +1 -1
  86. package/dist/components/Select/SimpleSelect.js +1 -1
  87. package/dist/components/Select/index.d.ts +1 -1
  88. package/dist/components/Select/index.js +1 -1
  89. package/dist/components/SelectBox.d.ts +9 -1
  90. package/dist/components/SelectBox.d.ts.map +1 -1
  91. package/dist/components/SelectBox.js +6 -5
  92. package/dist/components/SelectBox.js.map +1 -1
  93. package/dist/components/Skeleton.d.ts +1 -1
  94. package/dist/components/Skeleton.js +1 -1
  95. package/dist/components/Slider.d.ts +1 -1
  96. package/dist/components/Slider.js +1 -1
  97. package/dist/components/SmartTable.d.ts +1 -1
  98. package/dist/components/SmartTable.js +1 -1
  99. package/dist/components/Stepper.d.ts +1 -1
  100. package/dist/components/Stepper.js +1 -1
  101. package/dist/components/Table.d.ts +3 -3
  102. package/dist/components/Table.js +1 -1
  103. package/dist/components/Tabs/index.d.ts +1 -1
  104. package/dist/components/Tabs/index.js +1 -1
  105. package/dist/components/Textarea.d.ts +1 -1
  106. package/dist/components/Textarea.js +1 -1
  107. package/dist/components/Tooltip.d.ts +1 -1
  108. package/dist/components/Tooltip.js +1 -1
  109. package/dist/context/CitricProvider.d.ts +1 -1
  110. package/dist/context/CitricProvider.js +1 -1
  111. package/dist/index.d.ts +1 -1
  112. package/dist/index.d.ts.map +1 -1
  113. package/dist/index.js +1 -1
  114. package/dist/index.js.map +1 -1
  115. package/dist/overlay.js +1 -1
  116. package/dist/theme.css +415 -415
  117. package/dist/utils/css.js +1 -1
  118. package/dist/utils/css.js.map +1 -1
  119. package/package.json +1 -1
  120. package/scripts/build-css.ts +49 -49
  121. package/src/components/Accordion.tsx +130 -130
  122. package/src/components/Alert.tsx +24 -24
  123. package/src/components/AsyncContent.tsx +75 -75
  124. package/src/components/Avatar.tsx +45 -45
  125. package/src/components/AvatarGroup.tsx +49 -49
  126. package/src/components/Badge.tsx +47 -47
  127. package/src/components/Blockquote.tsx +18 -18
  128. package/src/components/Breadcrumb.tsx +33 -33
  129. package/src/components/Button.tsx +105 -105
  130. package/src/components/ButtonLink.tsx +45 -45
  131. package/src/components/Card.tsx +68 -68
  132. package/src/components/Checkbox.tsx +51 -52
  133. package/src/components/CheckboxGroup.tsx +153 -153
  134. package/src/components/Circle.tsx +43 -43
  135. package/src/components/CitricComponent.ts +47 -47
  136. package/src/components/Divider.tsx +24 -24
  137. package/src/components/ErrorBoundary.tsx +75 -75
  138. package/src/components/ErrorMessage.tsx +11 -11
  139. package/src/components/FallbackBoundary.tsx +40 -40
  140. package/src/components/Favorite.tsx +57 -57
  141. package/src/components/FieldGroup.tsx +46 -46
  142. package/src/components/Form.tsx +36 -36
  143. package/src/components/FormGroup.tsx +57 -57
  144. package/src/components/Icon.tsx +35 -35
  145. package/src/components/IconBox.tsx +134 -134
  146. package/src/components/ImageBox.tsx +125 -125
  147. package/src/components/ImageWithFallback.tsx +65 -65
  148. package/src/components/Input.tsx +49 -49
  149. package/src/components/Link.tsx +55 -55
  150. package/src/components/LoadingPanel.tsx +12 -12
  151. package/src/components/MenuOverlay/Menu.tsx +158 -158
  152. package/src/components/MenuOverlay/context.ts +20 -20
  153. package/src/components/MenuOverlay/index.tsx +55 -55
  154. package/src/components/MenuOverlay/keyboard.ts +60 -60
  155. package/src/components/MenuOverlay/types.ts +171 -171
  156. package/src/components/Overlay/context.ts +10 -10
  157. package/src/components/Overlay/index.tsx +182 -182
  158. package/src/components/Overlay/types.ts +75 -75
  159. package/src/components/Pagination.tsx +133 -133
  160. package/src/components/ProgressBar.tsx +45 -45
  161. package/src/components/ProgressCircular.tsx +45 -45
  162. package/src/components/RadioGroup.tsx +147 -147
  163. package/src/components/Rating.tsx +98 -98
  164. package/src/components/Select/MultiSelect.tsx +217 -217
  165. package/src/components/Select/RichSelect.tsx +128 -128
  166. package/src/components/Select/SimpleSelect.tsx +73 -73
  167. package/src/components/Select/hooks.ts +133 -133
  168. package/src/components/Select/index.tsx +35 -35
  169. package/src/components/Select/types.ts +134 -134
  170. package/src/components/SelectBox.tsx +181 -167
  171. package/src/components/Skeleton.tsx +53 -53
  172. package/src/components/Slider.tsx +89 -89
  173. package/src/components/SmartTable.tsx +227 -227
  174. package/src/components/Stepper.tsx +163 -163
  175. package/src/components/Table.tsx +234 -234
  176. package/src/components/Tabs/TabController.ts +54 -54
  177. package/src/components/Tabs/index.tsx +106 -106
  178. package/src/components/Tabs/types.ts +67 -67
  179. package/src/components/Tabs/utils.ts +6 -6
  180. package/src/components/Text.ts +111 -111
  181. package/src/components/Textarea.tsx +27 -27
  182. package/src/components/Tooltip.tsx +83 -83
  183. package/src/components/layout.tsx +101 -101
  184. package/src/context/CitricContext.tsx +4 -4
  185. package/src/context/CitricProvider.tsx +14 -14
  186. package/src/context/hooks.ts +6 -6
  187. package/src/index.ts +58 -59
  188. package/src/overlay.ts +348 -348
  189. package/src/types.ts +235 -235
  190. package/src/utils/ValueController.ts +28 -28
  191. package/src/utils/acessibility.ts +92 -92
  192. package/src/utils/checkbox.ts +121 -121
  193. package/src/utils/css.ts +119 -119
  194. package/src/utils/options.ts +9 -9
  195. package/src/utils/radio.ts +93 -93
  196. package/src/utils/react.ts +6 -6
  197. package/src/utils/time.ts +5 -5
  198. package/tsconfig.json +10 -10
  199. package/dist/components/Autocomplete/Autocomplete.d.ts +0 -211
  200. package/dist/components/Autocomplete/Autocomplete.d.ts.map +0 -1
  201. package/dist/components/Autocomplete/Autocomplete.js +0 -409
  202. package/dist/components/Autocomplete/Autocomplete.js.map +0 -1
  203. package/dist/components/Autocomplete/index.d.ts +0 -3
  204. package/dist/components/Autocomplete/index.d.ts.map +0 -1
  205. package/dist/components/Autocomplete/index.js +0 -2
  206. package/dist/components/Autocomplete/index.js.map +0 -1
  207. package/src/components/Autocomplete/Autocomplete.tsx +0 -794
  208. package/src/components/Autocomplete/index.ts +0 -3
@@ -1,171 +1,171 @@
1
- import { WithStyle } from '@stack-spot/portal-theme'
2
- import { BaseOverlayProps } from '../Overlay/types'
3
-
4
- interface CustomLabel {
5
- /**
6
- * A unique identifier for this label. This is also used to read this label to screen readers.
7
- */
8
- id: string,
9
- /**
10
- * A custom label that can be made up of any React component.
11
- */
12
- element: React.ReactNode,
13
- }
14
-
15
- interface Action {
16
- /**
17
- * The label of the action.
18
- */
19
- label: string | CustomLabel,
20
- /**
21
- * Function to run on a click.
22
- */
23
- onClick?: (event?: React.MouseEvent) => void,
24
- /**
25
- * URL to open on a click.
26
- */
27
- href?: string,
28
- /**
29
- * Target of the URL to open.
30
- */
31
- target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'],
32
- /**
33
- * Language of the linked document.
34
- */
35
- lang?: React.AnchorHTMLAttributes<HTMLAnchorElement>['lang'],
36
- /**
37
- * Language of the destination URL.
38
- */
39
- hrefLang?: React.AnchorHTMLAttributes<HTMLAnchorElement>['hrefLang'],
40
- /**
41
- * The title of the action.
42
- */
43
- title?: string,
44
- /**
45
- * Whether or not this link/button is disabled.
46
- *
47
- * @default false
48
- */
49
- disabled?: boolean,
50
- }
51
-
52
- interface ItemWithIcon {
53
- /**
54
- * An Icon to appear at the left of the item.
55
- */
56
- icon?: React.ReactElement,
57
- /**
58
- * An Icon to appear at the right of the item.
59
- */
60
- iconRight?: React.ReactElement,
61
- }
62
-
63
- export interface MenuAction extends ItemWithIcon, Action, WithStyle {
64
- /**
65
- * Whether or not this option is currently active.
66
- */
67
- active?: boolean,
68
- }
69
-
70
- interface MenuGroup extends WithStyle {
71
- /**
72
- * If this group is rendered as a section with its items right below it or a collapsible, which requires a click to open a submenu.
73
- */
74
- type?: 'section' | 'collapsible',
75
- /**
76
- * The items of this group.
77
- */
78
- children: MenuItem[],
79
- }
80
-
81
- export interface MenuSection extends MenuGroup {
82
- type: 'section',
83
- /**
84
- * The section's title.
85
- */
86
- label?: string,
87
- }
88
-
89
- export interface MenuCollapsible extends MenuGroup, ItemWithIcon {
90
- type?: 'collapsible',
91
- /**
92
- * The title of the collapsible menu.
93
- */
94
- label: string,
95
- }
96
-
97
- export type MenuItem = MenuSection | MenuCollapsible | MenuAction
98
-
99
- export interface MenuState {
100
- items: MenuItem[],
101
- parent?: MenuState,
102
- label?: string,
103
- }
104
-
105
- export interface BaseMenuProps {
106
- /**
107
- * The options in the menu.
108
- */
109
- items: MenuItem[],
110
- /**
111
- * A header for the menu.
112
- */
113
- header?: React.ReactNode,
114
- /**
115
- * Whether or not to render spaces between the items and the sides of the menu.
116
- *
117
- * @default false
118
- */
119
- spaced?: boolean,
120
- /**
121
- * Wheter or not to render borders.
122
- *
123
- * @default false
124
- */
125
- showBorders?: boolean,
126
- /**
127
- * Whether or not to use rounded corners for each menu item.
128
- *
129
- * @default false
130
- */
131
- roundedItems?: boolean,
132
- /**
133
- * Use 'square' for sharp corners and 'circle' for rounded corners.
134
- *
135
- * @default 'circle'
136
- */
137
- appearance?: 'square' | 'circle',
138
- /**
139
- * The level of the background color. Use this to lighten or darken the background.
140
- *
141
- * @default 300
142
- */
143
- bgLevel?: 300 | 400 | 500 | 600,
144
- /**
145
- * Whether or not to render shadows behind the menu.
146
- *
147
- * @default true
148
- */
149
- showShadows?: boolean,
150
- /**
151
- * A class for the menu element.
152
- */
153
- menuClass?: string,
154
- /**
155
- * Styles for the menu element.
156
- */
157
- menuStyle?: React.CSSProperties,
158
- }
159
-
160
- export type MenuProps = React.JSX.IntrinsicElements['div'] & BaseMenuProps
161
-
162
- export interface BaseMenuOverlayProps extends
163
- BaseMenuProps, Omit<BaseOverlayProps<'div'>, 'tag' | 'onRenderChild' | 'content' | 'triggerOn' | 'reference' | 'children'> {
164
- /**
165
- * A unique id for this menu. If not provided, a random number will be used.
166
- */
167
- id?: string,
168
- children?: React.ReactElement,
169
- }
170
-
171
- export type MenuOverlayProps = Omit<React.JSX.IntrinsicElements['div'], 'content' | 'children'> & BaseMenuOverlayProps
1
+ import { WithStyle } from '@stack-spot/portal-theme'
2
+ import { BaseOverlayProps } from '../Overlay/types'
3
+
4
+ interface CustomLabel {
5
+ /**
6
+ * A unique identifier for this label. This is also used to read this label to screen readers.
7
+ */
8
+ id: string,
9
+ /**
10
+ * A custom label that can be made up of any React component.
11
+ */
12
+ element: React.ReactNode,
13
+ }
14
+
15
+ interface Action {
16
+ /**
17
+ * The label of the action.
18
+ */
19
+ label: string | CustomLabel,
20
+ /**
21
+ * Function to run on a click.
22
+ */
23
+ onClick?: (event?: React.MouseEvent) => void,
24
+ /**
25
+ * URL to open on a click.
26
+ */
27
+ href?: string,
28
+ /**
29
+ * Target of the URL to open.
30
+ */
31
+ target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'],
32
+ /**
33
+ * Language of the linked document.
34
+ */
35
+ lang?: React.AnchorHTMLAttributes<HTMLAnchorElement>['lang'],
36
+ /**
37
+ * Language of the destination URL.
38
+ */
39
+ hrefLang?: React.AnchorHTMLAttributes<HTMLAnchorElement>['hrefLang'],
40
+ /**
41
+ * The title of the action.
42
+ */
43
+ title?: string,
44
+ /**
45
+ * Whether or not this link/button is disabled.
46
+ *
47
+ * @default false
48
+ */
49
+ disabled?: boolean,
50
+ }
51
+
52
+ interface ItemWithIcon {
53
+ /**
54
+ * An Icon to appear at the left of the item.
55
+ */
56
+ icon?: React.ReactElement,
57
+ /**
58
+ * An Icon to appear at the right of the item.
59
+ */
60
+ iconRight?: React.ReactElement,
61
+ }
62
+
63
+ export interface MenuAction extends ItemWithIcon, Action, WithStyle {
64
+ /**
65
+ * Whether or not this option is currently active.
66
+ */
67
+ active?: boolean,
68
+ }
69
+
70
+ interface MenuGroup extends WithStyle {
71
+ /**
72
+ * If this group is rendered as a section with its items right below it or a collapsible, which requires a click to open a submenu.
73
+ */
74
+ type?: 'section' | 'collapsible',
75
+ /**
76
+ * The items of this group.
77
+ */
78
+ children: MenuItem[],
79
+ }
80
+
81
+ export interface MenuSection extends MenuGroup {
82
+ type: 'section',
83
+ /**
84
+ * The section's title.
85
+ */
86
+ label?: string,
87
+ }
88
+
89
+ export interface MenuCollapsible extends MenuGroup, ItemWithIcon {
90
+ type?: 'collapsible',
91
+ /**
92
+ * The title of the collapsible menu.
93
+ */
94
+ label: string,
95
+ }
96
+
97
+ export type MenuItem = MenuSection | MenuCollapsible | MenuAction
98
+
99
+ export interface MenuState {
100
+ items: MenuItem[],
101
+ parent?: MenuState,
102
+ label?: string,
103
+ }
104
+
105
+ export interface BaseMenuProps {
106
+ /**
107
+ * The options in the menu.
108
+ */
109
+ items: MenuItem[],
110
+ /**
111
+ * A header for the menu.
112
+ */
113
+ header?: React.ReactNode,
114
+ /**
115
+ * Whether or not to render spaces between the items and the sides of the menu.
116
+ *
117
+ * @default false
118
+ */
119
+ spaced?: boolean,
120
+ /**
121
+ * Wheter or not to render borders.
122
+ *
123
+ * @default false
124
+ */
125
+ showBorders?: boolean,
126
+ /**
127
+ * Whether or not to use rounded corners for each menu item.
128
+ *
129
+ * @default false
130
+ */
131
+ roundedItems?: boolean,
132
+ /**
133
+ * Use 'square' for sharp corners and 'circle' for rounded corners.
134
+ *
135
+ * @default 'circle'
136
+ */
137
+ appearance?: 'square' | 'circle',
138
+ /**
139
+ * The level of the background color. Use this to lighten or darken the background.
140
+ *
141
+ * @default 300
142
+ */
143
+ bgLevel?: 300 | 400 | 500 | 600,
144
+ /**
145
+ * Whether or not to render shadows behind the menu.
146
+ *
147
+ * @default true
148
+ */
149
+ showShadows?: boolean,
150
+ /**
151
+ * A class for the menu element.
152
+ */
153
+ menuClass?: string,
154
+ /**
155
+ * Styles for the menu element.
156
+ */
157
+ menuStyle?: React.CSSProperties,
158
+ }
159
+
160
+ export type MenuProps = React.JSX.IntrinsicElements['div'] & BaseMenuProps
161
+
162
+ export interface BaseMenuOverlayProps extends
163
+ BaseMenuProps, Omit<BaseOverlayProps<'div'>, 'tag' | 'onRenderChild' | 'content' | 'triggerOn' | 'reference' | 'children'> {
164
+ /**
165
+ * A unique id for this menu. If not provided, a random number will be used.
166
+ */
167
+ id?: string,
168
+ children?: React.ReactElement,
169
+ }
170
+
171
+ export type MenuOverlayProps = Omit<React.JSX.IntrinsicElements['div'], 'content' | 'children'> & BaseMenuOverlayProps
@@ -1,10 +1,10 @@
1
- import { createContext, useContext } from 'react'
2
- import { OverlayController } from './types'
3
-
4
- const context = createContext<OverlayController | undefined>(undefined)
5
-
6
- export const OverlayProvider = context.Provider
7
-
8
- export function useOverlayController() {
9
- return useContext(context)
10
- }
1
+ import { createContext, useContext } from 'react'
2
+ import { OverlayController } from './types'
3
+
4
+ const context = createContext<OverlayController | undefined>(undefined)
5
+
6
+ export const OverlayProvider = context.Provider
7
+
8
+ export function useOverlayController() {
9
+ return useContext(context)
10
+ }