welcome-ui 8.1.3 → 8.2.0-alpha.1

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 (244) hide show
  1. package/dist/{AXB53BZF-BOEe01VW.mjs → AXB53BZF-XKOjjeWO.mjs} +3 -3
  2. package/dist/Accordion.mjs +30 -23
  3. package/dist/Alert.mjs +72 -66
  4. package/dist/AspectRatio.mjs +9 -9
  5. package/dist/Avatar.mjs +45 -41
  6. package/dist/{BYC7LY2E-B1IDizRs.mjs → BYC7LY2E-CWSI38FM.mjs} +128 -127
  7. package/dist/Badge.mjs +25 -25
  8. package/dist/Box.mjs +5 -5
  9. package/dist/Breadcrumb.mjs +118 -112
  10. package/dist/Button.mjs +72 -67
  11. package/dist/ButtonGroup.mjs +12 -11
  12. package/dist/Card.mjs +14 -14
  13. package/dist/Checkbox.mjs +2 -2
  14. package/dist/ClearButton.mjs +15 -15
  15. package/dist/CloseButton.mjs +9 -9
  16. package/dist/{CustomInput-IA_gVoXd.mjs → CustomPopper-DezjKb9n.mjs} +1458 -1442
  17. package/dist/DatePicker.mjs +63 -62
  18. package/dist/DateTimePicker.mjs +69 -63
  19. package/dist/DateTimePickerCommon.mjs +1 -1
  20. package/dist/Drawer.mjs +180 -168
  21. package/dist/DropdownMenu.mjs +354 -351
  22. package/dist/Field.mjs +103 -92
  23. package/dist/FieldGroup.mjs +12 -9
  24. package/dist/FileDrop.mjs +316 -295
  25. package/dist/FileUpload.mjs +83 -69
  26. package/dist/Files.mjs +41 -41
  27. package/dist/Flex.mjs +13 -13
  28. package/dist/Grid.mjs +29 -29
  29. package/dist/Hint.mjs +12 -12
  30. package/dist/{ITI7HKP4-EL9KXYBU.mjs → ITI7HKP4-C89kOQb8.mjs} +68 -67
  31. package/dist/Icon.mjs +25 -25
  32. package/dist/Icons.mjs +988 -988
  33. package/dist/IconsFont.mjs +22 -22
  34. package/dist/InputText.mjs +64 -56
  35. package/dist/{JC64G2H7-BzklVBKM.mjs → JC64G2H7-afsomHuH.mjs} +47 -46
  36. package/dist/{KUU7WJ55-CS4NemC6.mjs → KUU7WJ55-CzsjuIMv.mjs} +1 -1
  37. package/dist/LVA2YJMS-C-kJ1lkr.mjs +873 -0
  38. package/dist/Label.mjs +37 -35
  39. package/dist/Link.mjs +32 -28
  40. package/dist/Loader.mjs +20 -16
  41. package/dist/Logo.mjs +55 -42
  42. package/dist/{MTZPJQMC-CMjAwC0N.mjs → MTZPJQMC-TybFZCho.mjs} +2 -2
  43. package/dist/Modal.mjs +263 -244
  44. package/dist/{NLEBE274-QOMV1l7e.mjs → NLEBE274-oSxMftGy.mjs} +9 -9
  45. package/dist/{P2CTZE2T-Cl2w7OLV.mjs → P2CTZE2T-DOT1mNnX.mjs} +49 -48
  46. package/dist/{P4IRICAX-DezbJY4s.mjs → P4IRICAX-CWSZLTGz.mjs} +3 -3
  47. package/dist/Pagination.mjs +105 -103
  48. package/dist/PasswordInput.mjs +35 -34
  49. package/dist/Picker.mjs +36 -34
  50. package/dist/Popover.mjs +106 -99
  51. package/dist/{QYJ6MIDR-Bb0O5xUM.mjs → QYJ6MIDR-DJ-vUdAM.mjs} +31 -30
  52. package/dist/Radio.mjs +52 -46
  53. package/dist/RadioGroup.mjs +47 -47
  54. package/dist/RadioTab.mjs +37 -35
  55. package/dist/{SYRFVSLH-jn06-eLy.mjs → SYRFVSLH-B6m278Vb.mjs} +11 -10
  56. package/dist/Search.mjs +147 -135
  57. package/dist/Select.mjs +348 -330
  58. package/dist/Shape.mjs +9 -9
  59. package/dist/Slider.mjs +353 -326
  60. package/dist/Stack.mjs +24 -23
  61. package/dist/Swiper.mjs +192 -186
  62. package/dist/Table.mjs +23 -23
  63. package/dist/Tabs.mjs +205 -200
  64. package/dist/Tag.mjs +49 -47
  65. package/dist/Text.mjs +20 -20
  66. package/dist/Textarea.mjs +40 -40
  67. package/dist/TimePicker.mjs +59 -58
  68. package/dist/Toast.mjs +135 -128
  69. package/dist/Toggle.mjs +27 -24
  70. package/dist/Tooltip.mjs +103 -99
  71. package/dist/UniversalLink.mjs +15 -15
  72. package/dist/{VEVQD5MH-CuegL0m0.mjs → VEVQD5MH-0w9Y7Ytc.mjs} +3 -3
  73. package/dist/{VGCJ63VH-BMzoZtCu.mjs → VGCJ63VH-C0UPBY-5.mjs} +39 -38
  74. package/dist/VariantIcon.mjs +23 -22
  75. package/dist/WelcomeLoader.mjs +122 -121
  76. package/dist/WuiProvider.mjs +52 -44
  77. package/dist/{X5NMLKT6-CvSCix-_.mjs → X5NMLKT6-BJw3xE-K.mjs} +2 -2
  78. package/dist/{YV4JVR4I-Bh7B7TET.mjs → YV4JVR4I-DPC8mMuG.mjs} +57 -57
  79. package/dist/hide-focus-rings-root-CCXdysih.mjs +15 -0
  80. package/dist/{index-5PUh49rV.mjs → index-62h-enZF.mjs} +62 -61
  81. package/dist/{index-C7zM96J_.mjs → index-BaLGEKs7.mjs} +8 -8
  82. package/dist/index-CYmF7qCH.mjs +11 -0
  83. package/dist/index-C_k-m0Rl.mjs +36 -0
  84. package/dist/index-D8v_VJ9z.mjs +26 -0
  85. package/dist/{index-BNGGwOCo.mjs → index-DAZ1SYdj.mjs} +7 -7
  86. package/dist/index-DpkNUfAS.mjs +11 -0
  87. package/dist/{index-DqBUFsqP.mjs → index-DvzWKxKE.mjs} +7 -7
  88. package/dist/{index-Bkl89twW.mjs → index-QaLwIvZS.mjs} +8 -8
  89. package/dist/{index-BQtDgQBH.mjs → index-SQQQ4dEE.mjs} +8 -8
  90. package/dist/index-i_anpNhw.mjs +66 -0
  91. package/dist/index-wl3X6EM1.mjs +16 -0
  92. package/dist/jsx-runtime-B7I4PJ0H.mjs +613 -0
  93. package/dist/radio-group-C0fUHvam.mjs +52 -0
  94. package/dist/theme.mjs +805 -805
  95. package/dist/types/components/Accordion/index.d.ts +1 -1
  96. package/dist/types/components/Alert/index.d.ts +2 -2
  97. package/dist/types/components/Alert/styles.d.ts +4 -4
  98. package/dist/types/components/Alert/theme.d.ts +4 -4
  99. package/dist/types/components/Avatar/index.d.ts +1 -1
  100. package/dist/types/components/Avatar/styles.d.ts +4 -4
  101. package/dist/types/components/Avatar/theme.d.ts +1 -1
  102. package/dist/types/components/Badge/index.d.ts +2 -2
  103. package/dist/types/components/Badge/styles.d.ts +2 -2
  104. package/dist/types/components/Breadcrumb/Item.d.ts +1 -1
  105. package/dist/types/components/Breadcrumb/index.d.ts +1 -1
  106. package/dist/types/components/Button/index.d.ts +4 -5
  107. package/dist/types/components/Button/theme.d.ts +7 -7
  108. package/dist/types/components/ButtonGroup/index.d.ts +3 -3
  109. package/dist/types/components/Card/Cover.styles.d.ts +2 -2
  110. package/dist/types/components/Card/index.d.ts +2 -3
  111. package/dist/types/components/Checkbox/index.d.ts +2 -2
  112. package/dist/types/components/ClearButton/index.d.ts +4 -5
  113. package/dist/types/components/ClearButton/styles.d.ts +2 -2
  114. package/dist/types/components/CloseButton/styles.d.ts +2 -2
  115. package/dist/types/components/DatePicker/index.d.ts +3 -3
  116. package/dist/types/components/DateTimePicker/index.d.ts +2 -2
  117. package/dist/types/components/DateTimePickerCommon/CustomHeader.d.ts +1 -1
  118. package/dist/types/components/DateTimePickerCommon/CustomInput.d.ts +5 -5
  119. package/dist/types/components/DateTimePickerCommon/CustomPopper.d.ts +1 -1
  120. package/dist/types/components/DateTimePickerCommon/index.d.ts +2 -2
  121. package/dist/types/components/DateTimePickerCommon/utils.d.ts +1 -1
  122. package/dist/types/components/Drawer/AssetDrawer/Header.d.ts +1 -1
  123. package/dist/types/components/Drawer/AssetDrawer/index.d.ts +1 -1
  124. package/dist/types/components/Drawer/index.d.ts +8 -8
  125. package/dist/types/components/Drawer/styles.d.ts +3 -3
  126. package/dist/types/components/Drawer/theme.d.ts +1 -1
  127. package/dist/types/components/DropdownMenu/index.d.ts +4 -4
  128. package/dist/types/components/Field/index.d.ts +8 -8
  129. package/dist/types/components/Field/styles.d.ts +1 -1
  130. package/dist/types/components/Field/utils.d.ts +1 -1
  131. package/dist/types/components/FileDrop/FilePreview.d.ts +2 -2
  132. package/dist/types/components/FileDrop/Message.d.ts +1 -1
  133. package/dist/types/components/FileDrop/index.d.ts +16 -16
  134. package/dist/types/components/FileUpload/index.d.ts +13 -13
  135. package/dist/types/components/Files/index.d.ts +4 -4
  136. package/dist/types/components/Files/types.d.ts +1 -1
  137. package/dist/types/components/Hint/index.d.ts +1 -2
  138. package/dist/types/components/Icon/index.d.ts +3 -3
  139. package/dist/types/components/Icon/styles.d.ts +3 -3
  140. package/dist/types/components/Icon/theme.d.ts +1 -1
  141. package/dist/types/components/Icons/index.d.ts +2 -2
  142. package/dist/types/components/IconsFont/index.d.ts +2 -3
  143. package/dist/types/components/IconsFont/styles.d.ts +1 -1
  144. package/dist/types/components/InputText/index.d.ts +1 -1
  145. package/dist/types/components/InputText/styles.d.ts +1 -1
  146. package/dist/types/components/Label/index.d.ts +2 -3
  147. package/dist/types/components/Link/index.d.ts +3 -3
  148. package/dist/types/components/Link/styles.d.ts +2 -2
  149. package/dist/types/components/Loader/index.d.ts +1 -1
  150. package/dist/types/components/Loader/styles.d.ts +2 -2
  151. package/dist/types/components/Loader/theme.d.ts +2 -2
  152. package/dist/types/components/Logo/Solutions.d.ts +1 -2
  153. package/dist/types/components/Logo/Symbol.d.ts +1 -2
  154. package/dist/types/components/Logo/Wui.d.ts +1 -2
  155. package/dist/types/components/Logo/index.d.ts +5 -5
  156. package/dist/types/components/Modal/Assets/Backdrop.d.ts +4 -5
  157. package/dist/types/components/Modal/Assets/Iframe.d.ts +1 -2
  158. package/dist/types/components/Modal/Assets/index.d.ts +5 -5
  159. package/dist/types/components/Modal/Assets/styles.d.ts +4 -4
  160. package/dist/types/components/Modal/Close.d.ts +1 -2
  161. package/dist/types/components/Modal/Footer.d.ts +1 -1
  162. package/dist/types/components/Modal/Header.d.ts +2 -2
  163. package/dist/types/components/Modal/index.d.ts +11 -11
  164. package/dist/types/components/Modal/styles.d.ts +4 -4
  165. package/dist/types/components/Modal/theme.d.ts +1 -1
  166. package/dist/types/components/Pagination/index.d.ts +2 -2
  167. package/dist/types/components/Pagination/utils.d.ts +1 -1
  168. package/dist/types/components/Popover/Arrow.d.ts +1 -2
  169. package/dist/types/components/Popover/Content.d.ts +2 -3
  170. package/dist/types/components/Popover/Popover.d.ts +4 -5
  171. package/dist/types/components/Popover/PopoverHover.d.ts +3 -4
  172. package/dist/types/components/Popover/Trigger.d.ts +1 -1
  173. package/dist/types/components/Popover/usePopover.d.ts +6 -6
  174. package/dist/types/components/Radio/index.d.ts +5 -5
  175. package/dist/types/components/Radio/styles.d.ts +2 -2
  176. package/dist/types/components/RadioGroup/index.d.ts +2 -2
  177. package/dist/types/components/RadioTab/index.d.ts +2 -2
  178. package/dist/types/components/RadioTab/styles.d.ts +9 -9
  179. package/dist/types/components/Search/index.d.ts +4 -4
  180. package/dist/types/components/Select/index.d.ts +9 -9
  181. package/dist/types/components/Select/styles.d.ts +4 -4
  182. package/dist/types/components/Select/utils.d.ts +4 -4
  183. package/dist/types/components/Shape/index.d.ts +1 -1
  184. package/dist/types/components/Shape/styles.d.ts +2 -2
  185. package/dist/types/components/Slider/Range.d.ts +3 -3
  186. package/dist/types/components/Slider/index.d.ts +2 -2
  187. package/dist/types/components/Slider/styles.d.ts +10 -10
  188. package/dist/types/components/Stack/index.d.ts +1 -1
  189. package/dist/types/components/Swiper/index.d.ts +16 -17
  190. package/dist/types/components/Swiper/styles.d.ts +55 -55
  191. package/dist/types/components/System/index.d.ts +10 -10
  192. package/dist/types/components/Table/index.d.ts +6 -7
  193. package/dist/types/components/Table/styles.d.ts +1 -1
  194. package/dist/types/components/Tabs/ActiveBar.d.ts +5 -5
  195. package/dist/types/components/Tabs/TabList.d.ts +2 -2
  196. package/dist/types/components/Tabs/TabPanel.d.ts +2 -2
  197. package/dist/types/components/Tabs/theme.d.ts +1 -1
  198. package/dist/types/components/Tag/index.d.ts +2 -3
  199. package/dist/types/components/Tag/styles.d.ts +1 -1
  200. package/dist/types/components/Tag/theme.d.ts +2 -2
  201. package/dist/types/components/Text/index.d.ts +2 -2
  202. package/dist/types/components/Textarea/index.d.ts +1 -1
  203. package/dist/types/components/TimePicker/index.d.ts +2 -2
  204. package/dist/types/components/Toast/Growl.d.ts +1 -1
  205. package/dist/types/components/Toast/Snackbar.d.ts +1 -1
  206. package/dist/types/components/Toast/ToastWrapper.d.ts +4 -4
  207. package/dist/types/components/Toast/index.d.ts +5 -5
  208. package/dist/types/components/Toast/styles.d.ts +10 -10
  209. package/dist/types/components/Toast/theme.d.ts +1 -1
  210. package/dist/types/components/Toast/utils.d.ts +13 -13
  211. package/dist/types/components/Toggle/index.d.ts +2 -2
  212. package/dist/types/components/Toggle/theme.d.ts +4 -4
  213. package/dist/types/components/Tooltip/index.d.ts +3 -3
  214. package/dist/types/components/VariantIcon/index.d.ts +1 -1
  215. package/dist/types/components/VariantIcon/styles.d.ts +1 -1
  216. package/dist/types/components/VariantIcon/theme.d.ts +1 -1
  217. package/dist/types/theme/colors.d.ts +3 -3
  218. package/dist/types/theme/dark.d.ts +1 -1
  219. package/dist/types/theme/defaultFields.d.ts +5 -5
  220. package/dist/types/theme/fonts.d.ts +5 -5
  221. package/dist/types/theme/index.d.ts +31 -31
  222. package/dist/types/theme/screens.d.ts +7 -7
  223. package/dist/types/theme/space.d.ts +9 -9
  224. package/dist/types/utils/field-styles.d.ts +2 -2
  225. package/dist/types/utils/index.d.ts +2 -2
  226. package/dist/types/utils/ts-utils.d.ts +1 -1
  227. package/dist/types/utils/use-copy-text.d.ts +1 -1
  228. package/dist/types/utils/use-create-portal.d.ts +1 -1
  229. package/dist/types/utils/wrap-children.d.ts +1 -1
  230. package/dist/{use-viewport-CfklieD-.mjs → use-viewport-CWpjoHXy.mjs} +2 -2
  231. package/dist/utils.mjs +13 -13
  232. package/dist/wrap-children-CzmhoRzd.mjs +13 -0
  233. package/package.json +3 -27
  234. package/dist/LVA2YJMS-DDEmK0pp.mjs +0 -1482
  235. package/dist/hide-focus-rings-root-BNyva1yb.mjs +0 -14
  236. package/dist/index-B0gDDiFm.mjs +0 -66
  237. package/dist/index-B22SHR8h.mjs +0 -26
  238. package/dist/index-CQD9fgf_.mjs +0 -11
  239. package/dist/index-CmsWSKKs.mjs +0 -11
  240. package/dist/index-u1oHKa7X.mjs +0 -16
  241. package/dist/index-wr_b5GSV.mjs +0 -36
  242. package/dist/radio-group-RFyDp0KD.mjs +0 -51
  243. package/dist/wrap-children-aq69jtFP.mjs +0 -12
  244. package/dist/{downshift.esm-D0ns_SQs.mjs → downshift.esm-B7Jil1wW.mjs} +9 -9
@@ -1,26 +1,26 @@
1
1
  export declare const POSITION_STYLE: {
2
- 'top-left': {
3
- top: number;
4
- left: number;
5
- };
6
- 'top-center': {
7
- top: number;
2
+ 'bottom-center': {
3
+ bottom: number;
8
4
  left: string;
9
5
  };
10
- 'top-right': {
11
- top: number;
12
- right: number;
13
- };
14
6
  'bottom-left': {
15
7
  bottom: number;
16
8
  left: number;
17
9
  };
18
- 'bottom-center': {
10
+ 'bottom-right': {
19
11
  bottom: number;
12
+ right: number;
13
+ };
14
+ 'top-center': {
20
15
  left: string;
16
+ top: number;
21
17
  };
22
- 'bottom-right': {
23
- bottom: number;
18
+ 'top-left': {
19
+ left: number;
20
+ top: number;
21
+ };
22
+ 'top-right': {
24
23
  right: number;
24
+ top: number;
25
25
  };
26
26
  };
@@ -1,7 +1,7 @@
1
- import { Size } from './theme';
2
1
  import { CheckboxProps } from '../Checkbox';
3
2
  import { CreateWuiProps } from '../System';
4
- export type ToggleOptions = Omit<CheckboxProps, 'Component' | 'iconPlacement' | 'indeterminate' | 'hasIcon' | 'transparent' | 'isClearable'> & {
3
+ import { Size } from './theme';
4
+ export type ToggleOptions = Omit<CheckboxProps, 'Component' | 'hasIcon' | 'iconPlacement' | 'indeterminate' | 'isClearable' | 'transparent'> & {
5
5
  checkedIcon?: JSX.Element;
6
6
  size?: Size;
7
7
  uncheckedIcon?: JSX.Element;
@@ -1,11 +1,11 @@
1
1
  import { CSSObject } from '@xstyled/styled-components';
2
2
  import { ThemeValues } from '../../theme';
3
3
  export type Size = 'xs' | 'sm' | 'md';
4
- type State = 'default' | 'checked' | 'disabled';
5
4
  export type ThemeToggles = {
6
- after: Record<State | 'sizes', CSSObject>;
7
- icon: Record<'sizes' | 'position', CSSObject>;
8
- item: Record<State | 'sizes', CSSObject>;
5
+ after: Record<'sizes' | State, CSSObject>;
6
+ icon: Record<'position' | 'sizes', CSSObject>;
7
+ item: Record<'sizes' | State, CSSObject>;
9
8
  };
9
+ type State = 'checked' | 'default' | 'disabled';
10
10
  export declare const getToggles: (theme: ThemeValues) => ThemeToggles;
11
11
  export {};
@@ -1,11 +1,11 @@
1
1
  import { default as React } from 'react';
2
2
  import { CreateWuiProps } from '../System';
3
3
  import * as Ariakit from '@ariakit/react';
4
- export type TooltipOptions = {
4
+ export type TooltipOptions = Pick<Ariakit.TooltipOptions, 'gutter'> & Pick<Ariakit.TooltipStoreProps, 'placement'> & {
5
5
  children: React.ReactNode;
6
- content: string | JSX.Element;
6
+ content: JSX.Element | string;
7
7
  fixed?: boolean;
8
8
  withArrow?: boolean;
9
- } & Pick<Ariakit.TooltipStoreProps, 'placement'> & Pick<Ariakit.TooltipOptions, 'gutter'>;
9
+ };
10
10
  export type TooltipProps = CreateWuiProps<'div', TooltipOptions>;
11
11
  export declare const Tooltip: import('../System').CreateWuiComponent<"div", TooltipProps>;
@@ -1,5 +1,5 @@
1
- import { Size, Variant } from './theme';
2
1
  import { CreateWuiProps } from '../System';
2
+ import { Size, Variant } from './theme';
3
3
  export interface VariantIconOptions {
4
4
  icon?: JSX.Element;
5
5
  size?: Size;
@@ -1,4 +1,4 @@
1
1
  import { VariantIconOptions } from '.';
2
2
  export declare const VariantIcon: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>> & import('@xstyled/system').SystemProps<import('@xstyled/system').Theme>, {
3
- variant: VariantIconOptions["variant"] | string;
3
+ variant: string | VariantIconOptions["variant"];
4
4
  }>> & string;
@@ -1,6 +1,6 @@
1
1
  import { CSSObject } from '@xstyled/styled-components';
2
2
  import { ThemeValues } from '../../theme';
3
3
  export type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
4
- export type Variant = 'danger' | 'warning' | 'success' | 'info' | 'default' | 'ai';
5
4
  export type ThemeVariantIcon = Record<Variant, CSSObject>;
5
+ export type Variant = 'ai' | 'danger' | 'default' | 'info' | 'success' | 'warning';
6
6
  export declare const getVariantIcon: (theme: ThemeValues) => ThemeVariantIcon;
@@ -100,6 +100,7 @@ declare const palette: {
100
100
  'yellow-90': string;
101
101
  };
102
102
  export declare const getColors: (systemColors: typeof palette) => {
103
+ overlay: string;
103
104
  'primary-10': string;
104
105
  'primary-20': string;
105
106
  'primary-30': string;
@@ -115,7 +116,6 @@ export declare const getColors: (systemColors: typeof palette) => {
115
116
  'secondary-pink': string;
116
117
  'secondary-teal': string;
117
118
  'secondary-violet': string;
118
- overlay: string;
119
119
  'beige-10': string;
120
120
  'beige-20': string;
121
121
  'beige-30': string;
@@ -217,6 +217,7 @@ export declare const getColors: (systemColors: typeof palette) => {
217
217
  'yellow-90': string;
218
218
  };
219
219
  export declare const colors: {
220
+ overlay: string;
220
221
  'primary-10': string;
221
222
  'primary-20': string;
222
223
  'primary-30': string;
@@ -232,7 +233,6 @@ export declare const colors: {
232
233
  'secondary-pink': string;
233
234
  'secondary-teal': string;
234
235
  'secondary-violet': string;
235
- overlay: string;
236
236
  'beige-10': string;
237
237
  'beige-20': string;
238
238
  'beige-30': string;
@@ -333,7 +333,6 @@ export declare const colors: {
333
333
  'yellow-80': string;
334
334
  'yellow-90': string;
335
335
  };
336
- export type ThemeColors = typeof colors;
337
336
  declare const enum SecondaryColors {
338
337
  'blue' = 0,
339
338
  'green' = 1,
@@ -342,5 +341,6 @@ declare const enum SecondaryColors {
342
341
  'teal' = 4,
343
342
  'violet' = 5
344
343
  }
344
+ export type ThemeColors = typeof colors;
345
345
  export type ThemeSecondaryColors = keyof typeof SecondaryColors;
346
346
  export {};
@@ -1,6 +1,6 @@
1
1
  import { ThemeValues } from '.';
2
2
  type RecursivePartial<T> = {
3
- [P in keyof T]?: T[P] | RecursivePartial<T[P]>;
3
+ [P in keyof T]?: RecursivePartial<T[P]> | T[P];
4
4
  };
5
5
  export declare const colorsDark: ThemeValues['colors'];
6
6
  export declare const darkTheme: RecursivePartial<ThemeValues>;
@@ -1,11 +1,6 @@
1
1
  import { CSSObject } from '@xstyled/styled-components';
2
2
  import { DefaultFieldStylesProps } from '../utils/field-styles';
3
3
  import { ThemeValues } from '.';
4
- type VariantsTheme = {
5
- danger: CSSObject;
6
- success: CSSObject;
7
- warning: CSSObject;
8
- };
9
4
  export type ThemeDefaultFields = {
10
5
  checkableField: {
11
6
  checked: CSSObject;
@@ -35,5 +30,10 @@ export type ThemeDefaultFields = {
35
30
  sizes: Record<DefaultFieldStylesProps['size'], CSSObject>;
36
31
  variants: VariantsTheme;
37
32
  };
33
+ type VariantsTheme = {
34
+ danger: CSSObject;
35
+ success: CSSObject;
36
+ warning: CSSObject;
37
+ };
38
38
  export declare const getDefaultFields: (theme: ThemeValues) => ThemeDefaultFields;
39
39
  export {};
@@ -1,4 +1,9 @@
1
1
  import { ThemeValues } from '.';
2
+ export type ThemeFontFaces = {
3
+ 'welcome-font': FontFace[];
4
+ 'welcome-icon-font': FontFace[];
5
+ 'work-sans': FontFace[];
6
+ };
2
7
  type FontFace = {
3
8
  display?: FontDisplay;
4
9
  extensions?: string[];
@@ -9,10 +14,5 @@ type FontFace = {
9
14
  url: string;
10
15
  weight?: string;
11
16
  };
12
- export type ThemeFontFaces = {
13
- 'welcome-font': FontFace[];
14
- 'welcome-icon-font': FontFace[];
15
- 'work-sans': FontFace[];
16
- };
17
17
  export declare const fontFaces: (theme: ThemeValues) => ThemeFontFaces;
18
18
  export {};
@@ -6,16 +6,16 @@ import { ThemeBadges } from '../components/Badge/theme';
6
6
  import { ThemeBreadcrumbs } from '../components/Breadcrumb/theme';
7
7
  import { ThemeButtons } from '../components/Button/theme';
8
8
  import { ThemeCards } from '../components/Card/theme';
9
- import { ThemeDateTimePickerCommon } from '../components/DateTimePickerCommon/theme';
10
9
  import { ThemeCheckboxes } from '../components/Checkbox/theme';
10
+ import { ThemeDateTimePickerCommon } from '../components/DateTimePickerCommon/theme';
11
11
  import { ThemeDrawers } from '../components/Drawer/theme';
12
12
  import { ThemeDropdownMenu } from '../components/DropdownMenu/theme';
13
13
  import { ThemeFileDrops } from '../components/FileDrop/theme';
14
14
  import { ThemeHints } from '../components/Hint/theme';
15
+ import { ThemeIcons } from '../components/Icon/theme';
15
16
  import { ThemeLabels } from '../components/Label/theme';
16
17
  import { ThemeLinks } from '../components/Link/theme';
17
18
  import { ThemeLoaders } from '../components/Loader/theme';
18
- import { ThemeIcons } from '../components/Icon/theme';
19
19
  import { ThemeModals } from '../components/Modal/theme';
20
20
  import { ThemePagination } from '../components/Pagination/theme';
21
21
  import { ThemePopovers } from '../components/Popover/theme';
@@ -31,24 +31,33 @@ import { ThemeToasts } from '../components/Toast/theme';
31
31
  import { ThemeToggles } from '../components/Toggle/theme';
32
32
  import { ThemeTooltips } from '../components/Tooltip/theme';
33
33
  import { ThemeVariantIcon } from '../components/VariantIcon/theme';
34
- import { darkTheme } from './dark';
34
+ import { ThemeBorderWidths } from './borders';
35
35
  import { ThemeColors } from './colors';
36
+ import { darkTheme } from './dark';
37
+ import { ThemeDefaultFields } from './defaultFields';
38
+ import { ThemeFocus } from './focus';
36
39
  import { ThemeFontFaces } from './fonts';
37
- import { ThemeFonts, ThemeFontSizes, ThemeFontWeights, ThemeLetterSpacings, ThemeLineHeights, ThemeTexts, ThemeTextsFontColors, ThemeTextsFontFamily, ThemeTextsFontWeights, ThemeTextsTextTransform } from './typography';
38
- import { ThemeTimingFunction, ThemeTransitions } from './transitions';
39
- import { ThemeUnderline } from './underline';
40
40
  import { ThemeRadii } from './radii';
41
- import { ThemeBorderWidths } from './borders';
42
41
  import { ThemeScreens } from './screens';
42
+ import { ThemeSelection } from './selection';
43
43
  import { ThemeShadows } from './shadows';
44
44
  import { ThemeSpace } from './space';
45
- import { ThemeSelection } from './selection';
46
- import { ThemeFocus } from './focus';
47
- import { ThemeDefaultFields } from './defaultFields';
48
- type OverrideKeys = 'colors' | 'radii' | 'borderWidths' | 'fontSizes' | 'lineHeights' | 'fontWeights' | 'letterSpacings' | 'fonts' | 'sizes' | 'screens' | 'space' | 'shadows' | 'texts';
49
- type XStyledTheme = Omit<XStyledDefaultTheme, OverrideKeys>;
50
- type StyledComponentsTheme = Omit<StyledComponentDefaultTheme, OverrideKeys>;
51
- export interface ThemeValues extends XStyledTheme, StyledComponentsTheme {
45
+ import { ThemeTimingFunction, ThemeTransitions } from './transitions';
46
+ import { ThemeFonts, ThemeFontSizes, ThemeFontWeights, ThemeLetterSpacings, ThemeLineHeights, ThemeTexts, ThemeTextsFontColors, ThemeTextsFontFamily, ThemeTextsFontWeights, ThemeTextsTextTransform } from './typography';
47
+ import { ThemeUnderline } from './underline';
48
+ export type ThemeColorTokens = keyof ThemeColors;
49
+ export type ThemeFontsUrl = 'https://cdn.welcome-ui.com/fonts' | 'https://cdn.welcometothejungle.com/fonts' | string;
50
+ export type ThemeProps = {
51
+ [param: string]: unknown;
52
+ defaultFontFamily?: string;
53
+ defaultFontSize?: number;
54
+ defaultLetterSpacing?: string;
55
+ defaultLineHeight?: number;
56
+ fontsUrl?: ThemeFontsUrl;
57
+ headingFontFamily?: string;
58
+ iconFontFamily?: string;
59
+ };
60
+ export interface ThemeValues extends StyledComponentsTheme, XStyledTheme {
52
61
  accordions: ThemeAccordions;
53
62
  alerts: ThemeAlerts;
54
63
  avatars: ThemeAvatars;
@@ -68,10 +77,10 @@ export interface ThemeValues extends XStyledTheme, StyledComponentsTheme {
68
77
  fileDrops: ThemeFileDrops;
69
78
  focus: ThemeFocus;
70
79
  fontFaces: ThemeFontFaces;
71
- fontSizes: ThemeFontSizes;
72
- fontWeights: ThemeFontWeights;
73
80
  fonts: ThemeFonts;
81
+ fontSizes: ThemeFontSizes;
74
82
  fontsUrl: ThemeFontsUrl;
83
+ fontWeights: ThemeFontWeights;
75
84
  hints: ThemeHints;
76
85
  icons: ThemeIcons;
77
86
  inset: ThemeSpace;
@@ -102,12 +111,12 @@ export interface ThemeValues extends XStyledTheme, StyledComponentsTheme {
102
111
  textsFontWeights: ThemeTextsFontWeights;
103
112
  textsTextTransform: ThemeTextsTextTransform;
104
113
  timingFunction: ThemeTimingFunction;
105
- toEm: (int: number) => string;
106
- toPx: (int: number) => string;
107
- toRem: (int: number) => string;
108
114
  toasts: ThemeToasts;
115
+ toEm: (int: number) => string;
109
116
  toggles: ThemeToggles;
110
117
  tooltips: ThemeTooltips;
118
+ toPx: (int: number) => string;
119
+ toRem: (int: number) => string;
111
120
  transformers: {
112
121
  border: (value: CSSScalar) => CSSScalar;
113
122
  px: (value: CSSScalar) => CSSScalar;
@@ -116,17 +125,8 @@ export interface ThemeValues extends XStyledTheme, StyledComponentsTheme {
116
125
  underline: ThemeUnderline;
117
126
  variantIcon: ThemeVariantIcon;
118
127
  }
119
- export type ThemeFontsUrl = 'https://cdn.welcome-ui.com/fonts' | 'https://cdn.welcometothejungle.com/fonts' | string;
120
- export type ThemeColorTokens = keyof ThemeColors;
121
- export type ThemeProps = {
122
- [param: string]: unknown;
123
- defaultFontFamily?: string;
124
- defaultFontSize?: number;
125
- defaultLetterSpacing?: string;
126
- defaultLineHeight?: number;
127
- fontsUrl?: ThemeFontsUrl;
128
- headingFontFamily?: string;
129
- iconFontFamily?: string;
130
- };
128
+ type OverrideKeys = 'borderWidths' | 'colors' | 'fonts' | 'fontSizes' | 'fontWeights' | 'letterSpacings' | 'lineHeights' | 'radii' | 'screens' | 'shadows' | 'sizes' | 'space' | 'texts';
129
+ type StyledComponentsTheme = Omit<StyledComponentDefaultTheme, OverrideKeys>;
130
+ type XStyledTheme = Omit<XStyledDefaultTheme, OverrideKeys>;
131
131
  export declare const createTheme: (options?: ThemeProps) => ThemeValues;
132
132
  export { darkTheme };
@@ -1,13 +1,13 @@
1
1
  export type ThemeScreens = {
2
- [key: string]: number;
3
- [key: number]: number;
4
- '3xl': number;
5
- '4xl': number;
6
- lg: number;
7
- md: number;
2
+ xs: number;
8
3
  sm: number;
4
+ md: number;
5
+ lg: number;
9
6
  xl: number;
10
- xs: number;
11
7
  xxl: number;
8
+ '3xl': number;
9
+ '4xl': number;
10
+ [key: string]: number;
11
+ [key: number]: number;
12
12
  };
13
13
  export declare const screens: ThemeScreens;
@@ -1,18 +1,18 @@
1
1
  import { ThemeValues } from '.';
2
2
  export type ThemeSpace = {
3
- [key: string]: string;
4
- [key: number]: string;
3
+ xxs: string;
4
+ xs: string;
5
+ sm: string;
6
+ md: string;
7
+ lg: string;
8
+ xl: string;
9
+ xxl: string;
5
10
  '3xl': string;
6
11
  '4xl': string;
7
12
  '5xl': string;
8
13
  '6xl': string;
9
14
  '7xl': string;
10
- lg: string;
11
- md: string;
12
- sm: string;
13
- xl: string;
14
- xs: string;
15
- xxl: string;
16
- xxs: string;
15
+ [key: string]: string;
16
+ [key: number]: string;
17
17
  };
18
18
  export declare const getSpace: (theme: ThemeValues) => ThemeSpace;
@@ -1,12 +1,12 @@
1
1
  import { css } from '@xstyled/styled-components';
2
- export type DefaultFieldIconSize = 'sm' | 'xs';
2
+ export type DefaultFieldIconSize = 'xs' | 'sm';
3
3
  export type Size = 'xs' | 'sm' | 'md' | 'lg';
4
4
  export declare const FIELD_ICON_SIZE: {
5
5
  [key in Size]: DefaultFieldIconSize;
6
6
  };
7
7
  export type DefaultFieldStylesProps = Partial<{
8
8
  hasIcon?: boolean;
9
- iconPlacement?: 'right' | 'left' | 'both';
9
+ iconPlacement?: 'both' | 'left' | 'right';
10
10
  isClearable?: boolean;
11
11
  size: Size;
12
12
  transparent?: boolean;
@@ -1,10 +1,10 @@
1
+ export * from './field-styles';
1
2
  export * from './format-bytes';
2
3
  export * from './hex-to-rgba';
3
- export * from './field-styles';
4
4
  export * from './overflow-ellipsis';
5
5
  export * from './throttle';
6
+ export * from './ts-utils';
6
7
  export * from './use-copy-text';
7
8
  export * from './use-fork-ref';
8
9
  export * from './use-isomorphic-layout-effect';
9
10
  export * from './use-viewport';
10
- export * from './ts-utils';
@@ -16,4 +16,4 @@
16
16
  * const bg: color = 'yellow'
17
17
  * const bg: color = '#FFF'
18
18
  */
19
- export type LiteralUnion<T, U = string> = T | (U & Record<never, never>);
19
+ export type LiteralUnion<T, U = string> = (Record<never, never> & U) | T;
@@ -1,4 +1,4 @@
1
- type Content = React.RefObject<HTMLElement | HTMLInputElement> | number | string;
1
+ type Content = number | React.RefObject<HTMLElement | HTMLInputElement> | string;
2
2
  type Timeout = number;
3
3
  type useCopyTextReturn = [() => void, boolean];
4
4
  export declare function useCopyText(content: Content, timeout: Timeout): useCopyTextReturn;
@@ -1,4 +1,4 @@
1
1
  /**
2
2
  * Hook that mimic the React createPortal function in order to make it SSR friendly
3
3
  */
4
- export declare function useCreatePortal(disable?: boolean): ((children: React.ReactNode) => any) | ((children: React.ReactNode, container?: Element | DocumentFragment, key?: string | null) => import('react').ReactPortal);
4
+ export declare function useCreatePortal(disable?: boolean): ((children: React.ReactNode) => any) | ((children: React.ReactNode, container?: DocumentFragment | Element, key?: null | string) => import('react').ReactPortal);
@@ -1 +1 @@
1
- export declare const wrapChildren: (children?: string | JSX.Element) => unknown;
1
+ export declare const wrapChildren: (children?: JSX.Element | string) => unknown;
@@ -4,9 +4,9 @@ import { u as o } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
4
4
  function w() {
5
5
  const [t, e] = n({ height: void 0, width: void 0 });
6
6
  return o(() => {
7
- e({ width: window.innerWidth, height: window.innerHeight });
7
+ e({ height: window.innerHeight, width: window.innerWidth });
8
8
  function i() {
9
- e({ width: window.innerWidth, height: window.innerHeight });
9
+ e({ height: window.innerHeight, width: window.innerWidth });
10
10
  }
11
11
  return window.addEventListener("resize", i), () => window.removeEventListener("resize", i);
12
12
  }, []), t;
package/dist/utils.mjs CHANGED
@@ -1,28 +1,28 @@
1
1
  "use client";
2
- import { f as y } from "./format-bytes-gST0dTWd.mjs";
3
- import { h as C } from "./hex-to-rgba-BIDK-3ab.mjs";
4
- import { F as S, d as T } from "./field-styles-CfVLcVQp.mjs";
2
+ import { F as y, d } from "./field-styles-CfVLcVQp.mjs";
3
+ import { f as E } from "./format-bytes-gST0dTWd.mjs";
4
+ import { h as T } from "./hex-to-rgba-BIDK-3ab.mjs";
5
5
  import { o as h } from "./overflow-ellipsis-DGV5Kgt-.mjs";
6
6
  import { t as L } from "./throttle-BDBzFeFj.mjs";
7
- import { useState as p, useCallback as a } from "react";
8
- import { c as i } from "./index-BhcLigYU.mjs";
7
+ import { c as p } from "./index-BhcLigYU.mjs";
8
+ import { useState as a, useCallback as i } from "react";
9
9
  import { s as g, u as v } from "./use-fork-ref-CUZErtAC.mjs";
10
10
  import { u as k } from "./use-isomorphic-layout-effect-Izr-e2pi.mjs";
11
- import { u as B } from "./use-viewport-CfklieD-.mjs";
11
+ import { u as B } from "./use-viewport-CWpjoHXy.mjs";
12
12
  function c(e, r) {
13
- const [s, t] = p();
14
- return [a(() => {
13
+ const [s, t] = a();
14
+ return [i(() => {
15
15
  let o;
16
16
  typeof e == "number" || typeof e == "string" ? o = e.toString() : e.current instanceof HTMLInputElement ? o = e.current.value : e.current instanceof HTMLElement && (o = e.current.textContent);
17
- const f = i(o);
17
+ const f = p(o);
18
18
  t(f), r && setTimeout(t, r);
19
19
  }, [e, r]), s];
20
20
  }
21
21
  export {
22
- S as FIELD_ICON_SIZE,
23
- T as defaultFieldStyles,
24
- y as formatBytes,
25
- C as hexToRGBA,
22
+ y as FIELD_ICON_SIZE,
23
+ d as defaultFieldStyles,
24
+ E as formatBytes,
25
+ T as hexToRGBA,
26
26
  h as overflowEllipsis,
27
27
  g as setRef,
28
28
  L as throttle,
@@ -0,0 +1,13 @@
1
+ "use client";
2
+ import { j as t } from "./jsx-runtime-B7I4PJ0H.mjs";
3
+ import n from "react";
4
+ const p = (e) => n.Children.toArray(e).map(
5
+ (r) => (
6
+ // eslint-disable-next-line @typescript-eslint/ban-ts-comment
7
+ /* @ts-ignore */
8
+ ["number", "string"].includes(typeof r) ? /* @__PURE__ */ t.jsx("span", { children: r }, r) : r
9
+ )
10
+ );
11
+ export {
12
+ p as w
13
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "welcome-ui",
3
- "version": "8.1.3",
3
+ "version": "8.2.0-alpha.1",
4
4
  "description": "Customizable design system with react • styled-components • styled-system and ariakit.",
5
5
  "files": [
6
6
  "dist"
@@ -70,16 +70,6 @@
70
70
  "react-hot-toast": "^2.4.1"
71
71
  },
72
72
  "devDependencies": {
73
- "@babel/cli": "7.25.9",
74
- "@babel/core": "7.26.10",
75
- "@babel/eslint-parser": "^7.25.1",
76
- "@babel/plugin-proposal-class-properties": "7.18.6",
77
- "@babel/plugin-proposal-optional-chaining": "7.21.0",
78
- "@babel/plugin-transform-modules-commonjs": "7.26.3",
79
- "@babel/plugin-transform-runtime": "^7.25.4",
80
- "@babel/preset-env": "^7.26.0",
81
- "@babel/preset-react": "^7.26.3",
82
- "@babel/preset-typescript": "^7.22.11",
83
73
  "@testing-library/dom": "^10.4.0",
84
74
  "@testing-library/jest-dom": "^6.6.3",
85
75
  "@testing-library/react": "^16.2.0",
@@ -87,36 +77,22 @@
87
77
  "@types/lodash.capitalize": "^4.2.9",
88
78
  "@types/lodash.debounce": "^4.0.6",
89
79
  "@types/lodash.range": "^3.2.9",
90
- "@types/node": "22.13.4",
91
80
  "@types/ramda": "^0.30.2",
92
- "@types/react": "18.3.12",
93
81
  "@types/react-datepicker": "^4.15.0",
94
- "@types/react-dom": "18.3.1",
95
- "@xstyled/styled-components": "^4.0.0",
96
- "babel-plugin-annotate-pure-calls": "^0.4.0",
97
- "babel-plugin-styled-components": "^2.1.4",
98
- "babel-plugin-transform-async-to-promises": "^0.8.18",
99
- "babel-preset-vite": "^1.1.3",
100
82
  "jsdom": "^26.0.0",
101
83
  "ramda": "^0.30.1",
102
- "react": "^18.3.1",
103
84
  "release-it": "^18.1.2",
85
+ "rollup": "^4.39.0",
104
86
  "rollup-preserve-directives": "^1.1.3",
105
- "styled-components": "^6.1.15",
106
- "typescript": "^5.6.3",
107
87
  "vite": "^6.2.1",
108
88
  "vite-plugin-dts": "^4.5.3",
109
89
  "vite-plugin-static-copy": "^2.3.0",
110
- "vitest": "^3.0.8",
111
- "wttj-config": "3.1.2"
90
+ "vitest": "^3.0.8"
112
91
  },
113
92
  "peerDependencies": {
114
93
  "@xstyled/styled-components": "^4.0.0",
115
94
  "react": "^18.3.1",
116
95
  "styled-components": "^6.1.15"
117
96
  },
118
- "resolutions": {
119
- "@babel/traverse": ">=7.23.2"
120
- },
121
97
  "homepage": "https://welcome-ui.com"
122
98
  }