@ark-ui/react 1.0.1 → 1.2.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 (183) hide show
  1. package/CHANGELOG.md +34 -0
  2. package/README.md +67 -61
  3. package/accordion/accordion.stories.d.ts +0 -1
  4. package/color-picker/color-picker-format-select.cjs +21 -0
  5. package/color-picker/color-picker-format-select.d.ts +6 -0
  6. package/color-picker/color-picker-format-select.mjs +17 -0
  7. package/color-picker/color-picker-format-trigger.cjs +19 -0
  8. package/color-picker/color-picker-format-trigger.d.ts +6 -0
  9. package/color-picker/color-picker-format-trigger.mjs +15 -0
  10. package/color-picker/color-picker-swatch-context.cjs +15 -0
  11. package/color-picker/color-picker-swatch-context.d.ts +6 -0
  12. package/color-picker/color-picker-swatch-context.mjs +10 -0
  13. package/color-picker/color-picker-swatch-indicator.cjs +21 -0
  14. package/color-picker/color-picker-swatch-indicator.d.ts +6 -0
  15. package/color-picker/color-picker-swatch-indicator.mjs +17 -0
  16. package/color-picker/color-picker-swatch-trigger.cjs +4 -1
  17. package/color-picker/color-picker-swatch-trigger.d.ts +1 -5
  18. package/color-picker/color-picker-swatch-trigger.mjs +4 -1
  19. package/color-picker/color-picker-swatch.cjs +4 -3
  20. package/color-picker/color-picker-swatch.mjs +4 -3
  21. package/color-picker/color-picker-transparency-grid.d.ts +2 -5
  22. package/color-picker/color-picker.cjs +4 -2
  23. package/color-picker/color-picker.mjs +4 -2
  24. package/color-picker/index.cjs +10 -0
  25. package/color-picker/index.d.ts +10 -3
  26. package/color-picker/index.mjs +7 -1
  27. package/color-picker/use-color-picker.cjs +1 -1
  28. package/color-picker/use-color-picker.d.ts +4 -1
  29. package/color-picker/use-color-picker.mjs +1 -1
  30. package/combobox/combobox.cjs +1 -1
  31. package/combobox/combobox.d.ts +1 -1
  32. package/combobox/combobox.mjs +1 -1
  33. package/date-picker/date-picker.cjs +2 -2
  34. package/date-picker/date-picker.mjs +2 -2
  35. package/date-picker/date-picker.stories.d.ts +1 -0
  36. package/dialog/dialog-backdrop.cjs +1 -1
  37. package/dialog/dialog-backdrop.mjs +1 -1
  38. package/dialog/dialog.cjs +2 -1
  39. package/dialog/dialog.mjs +2 -1
  40. package/editable/editable.cjs +2 -2
  41. package/editable/editable.mjs +2 -2
  42. package/factory.cjs +1 -2
  43. package/factory.d.ts +1 -1
  44. package/factory.mjs +2 -3
  45. package/factory.test.d.ts +1 -0
  46. package/file-upload/file-upload-context.cjs +15 -0
  47. package/file-upload/file-upload-context.d.ts +6 -0
  48. package/file-upload/file-upload-context.mjs +10 -0
  49. package/file-upload/file-upload-dropzone.cjs +24 -0
  50. package/file-upload/file-upload-dropzone.d.ts +6 -0
  51. package/file-upload/file-upload-dropzone.mjs +20 -0
  52. package/file-upload/file-upload-item-context.cjs +15 -0
  53. package/file-upload/file-upload-item-context.d.ts +6 -0
  54. package/file-upload/file-upload-item-context.mjs +10 -0
  55. package/file-upload/file-upload-item-delete-trigger.cjs +21 -0
  56. package/file-upload/file-upload-item-delete-trigger.d.ts +6 -0
  57. package/file-upload/file-upload-item-delete-trigger.mjs +17 -0
  58. package/file-upload/file-upload-item-group.cjs +24 -0
  59. package/file-upload/file-upload-item-group.d.ts +8 -0
  60. package/file-upload/file-upload-item-group.mjs +20 -0
  61. package/file-upload/file-upload-item-name.cjs +24 -0
  62. package/file-upload/file-upload-item-name.d.ts +6 -0
  63. package/file-upload/file-upload-item-name.mjs +20 -0
  64. package/file-upload/file-upload-item-preview-image.cjs +25 -0
  65. package/file-upload/file-upload-item-preview-image.d.ts +6 -0
  66. package/file-upload/file-upload-item-preview-image.mjs +21 -0
  67. package/file-upload/file-upload-item-preview.cjs +25 -0
  68. package/file-upload/file-upload-item-preview.d.ts +11 -0
  69. package/file-upload/file-upload-item-preview.mjs +21 -0
  70. package/file-upload/file-upload-item-size-text.cjs +24 -0
  71. package/file-upload/file-upload-item-size-text.d.ts +6 -0
  72. package/file-upload/file-upload-item-size-text.mjs +20 -0
  73. package/file-upload/file-upload-item.cjs +24 -0
  74. package/file-upload/file-upload-item.d.ts +8 -0
  75. package/file-upload/file-upload-item.mjs +20 -0
  76. package/file-upload/file-upload-label.cjs +19 -0
  77. package/file-upload/file-upload-label.d.ts +6 -0
  78. package/file-upload/file-upload-label.mjs +15 -0
  79. package/file-upload/file-upload-trigger.cjs +21 -0
  80. package/file-upload/file-upload-trigger.d.ts +6 -0
  81. package/file-upload/file-upload-trigger.mjs +17 -0
  82. package/file-upload/file-upload.cjs +46 -0
  83. package/file-upload/file-upload.d.ts +9 -0
  84. package/file-upload/file-upload.mjs +42 -0
  85. package/file-upload/file-upload.stories.d.ts +7 -0
  86. package/file-upload/file-upload.test.d.ts +1 -0
  87. package/file-upload/index.cjs +43 -0
  88. package/file-upload/index.d.ts +29 -0
  89. package/file-upload/index.mjs +29 -0
  90. package/file-upload/use-file-upload.cjs +48 -0
  91. package/file-upload/use-file-upload.d.ts +8 -0
  92. package/file-upload/use-file-upload.mjs +25 -0
  93. package/hover-card/hover-card.cjs +2 -1
  94. package/hover-card/hover-card.mjs +2 -1
  95. package/index.cjs +74 -42
  96. package/index.d.ts +1 -0
  97. package/index.mjs +18 -2
  98. package/menu/menu.cjs +4 -3
  99. package/menu/menu.mjs +2 -1
  100. package/number-input/index.cjs +3 -3
  101. package/number-input/index.d.ts +1 -1
  102. package/number-input/index.mjs +1 -1
  103. package/number-input/number-input.cjs +5 -3
  104. package/number-input/number-input.d.ts +5 -4
  105. package/number-input/number-input.mjs +5 -3
  106. package/number-input/number-input.stories.d.ts +1 -0
  107. package/package.json +72 -57
  108. package/pagination/pagination-item.cjs +1 -1
  109. package/pagination/pagination-item.mjs +1 -1
  110. package/pagination/pagination.cjs +2 -2
  111. package/pagination/pagination.mjs +2 -2
  112. package/pin-input/index.cjs +3 -3
  113. package/pin-input/index.d.ts +1 -1
  114. package/pin-input/index.mjs +1 -1
  115. package/pin-input/pin-input.cjs +2 -2
  116. package/pin-input/pin-input.mjs +2 -2
  117. package/popover/popover.cjs +2 -1
  118. package/popover/popover.mjs +2 -1
  119. package/portal.cjs +2 -1
  120. package/portal.d.ts +2 -2
  121. package/portal.mjs +2 -1
  122. package/radio-group/radio-group-indicator.cjs +1 -2
  123. package/radio-group/radio-group-indicator.mjs +1 -2
  124. package/radio-group/radio-group-item.d.ts +1 -1
  125. package/radio-group/radio-group.cjs +2 -2
  126. package/radio-group/radio-group.mjs +2 -2
  127. package/radio-group/radio-group.stories.d.ts +1 -1
  128. package/rating-group/rating-group-control.cjs +2 -2
  129. package/rating-group/rating-group-control.mjs +2 -2
  130. package/rating-group/rating-group-item-context.d.ts +2 -2
  131. package/rating-group/rating-group-item.cjs +5 -4
  132. package/rating-group/rating-group-item.mjs +5 -4
  133. package/rating-group/rating-group.cjs +2 -2
  134. package/rating-group/rating-group.mjs +2 -2
  135. package/rating-group/use-rating-group.cjs +4 -4
  136. package/rating-group/use-rating-group.d.ts +4 -4
  137. package/rating-group/use-rating-group.mjs +3 -3
  138. package/segment-group/segment-group-indicator.cjs +2 -2
  139. package/segment-group/segment-group-indicator.mjs +2 -2
  140. package/segment-group/segment-group-item-context.d.ts +1 -13
  141. package/segment-group/segment-group-item-control.cjs +2 -2
  142. package/segment-group/segment-group-item-control.mjs +2 -2
  143. package/segment-group/segment-group-item-text.cjs +2 -2
  144. package/segment-group/segment-group-item-text.mjs +2 -2
  145. package/segment-group/segment-group-item.cjs +3 -3
  146. package/segment-group/segment-group-item.d.ts +3 -2
  147. package/segment-group/segment-group-item.mjs +3 -3
  148. package/segment-group/segment-group-label.cjs +2 -2
  149. package/segment-group/segment-group-label.mjs +2 -2
  150. package/segment-group/segment-group.cjs +4 -4
  151. package/segment-group/segment-group.mjs +4 -4
  152. package/select/select-item-group.cjs +2 -2
  153. package/select/select-item-group.mjs +2 -2
  154. package/select/select.cjs +1 -1
  155. package/select/select.d.ts +1 -1
  156. package/select/select.mjs +1 -1
  157. package/select/select.stories.d.ts +1 -0
  158. package/slider/slider.stories.d.ts +1 -1
  159. package/switch/switch.cjs +2 -2
  160. package/switch/switch.mjs +2 -2
  161. package/toast/create-toaster.cjs +2 -2
  162. package/toast/create-toaster.d.ts +1 -1
  163. package/toast/create-toaster.mjs +2 -2
  164. package/toast/index.cjs +5 -2
  165. package/toast/index.d.ts +6 -4
  166. package/toast/index.mjs +5 -3
  167. package/toast/toast-group.cjs +15 -0
  168. package/toast/toast-group.d.ts +6 -0
  169. package/toast/toast-group.mjs +11 -0
  170. package/tooltip/tooltip.cjs +2 -1
  171. package/tooltip/tooltip.mjs +2 -1
  172. package/use-is-server.cjs +16 -0
  173. package/use-is-server.d.ts +1 -0
  174. package/use-is-server.mjs +12 -0
  175. package/segment-group/segment-group.anatomy.cjs +0 -10
  176. package/segment-group/segment-group.anatomy.d.ts +0 -2
  177. package/segment-group/segment-group.anatomy.mjs +0 -6
  178. /package/number-input/{number-input-field.cjs → number-input-input.cjs} +0 -0
  179. /package/number-input/{number-input-field.d.ts → number-input-input.d.ts} +0 -0
  180. /package/number-input/{number-input-field.mjs → number-input-input.mjs} +0 -0
  181. /package/pin-input/{pin-input-field.cjs → pin-input-input.cjs} +0 -0
  182. /package/pin-input/{pin-input-field.d.ts → pin-input-input.d.ts} +0 -0
  183. /package/pin-input/{pin-input-field.mjs → pin-input-input.mjs} +0 -0
@@ -0,0 +1,15 @@
1
+ 'use client';
2
+ 'use strict';
3
+
4
+ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
+
6
+ const jsxRuntime = require('react/jsx-runtime');
7
+ const react = require('react');
8
+ const factory = require('../factory.cjs');
9
+
10
+ const ToastGroup = react.forwardRef((props, ref) => {
11
+ return /* @__PURE__ */ jsxRuntime.jsx(factory.ark.ol, { ...props, ref });
12
+ });
13
+ ToastGroup.displayName = "ToastGroup";
14
+
15
+ exports.ToastGroup = ToastGroup;
@@ -0,0 +1,6 @@
1
+ import { ForwardRefExoticComponent, RefAttributes } from 'react';
2
+ /// <reference types="react" />
3
+ import { type HTMLArkProps } from '../factory';
4
+ export interface ToastGroupProps extends HTMLArkProps<'ol'> {
5
+ }
6
+ export declare const ToastGroup: ForwardRefExoticComponent<ToastGroupProps & RefAttributes<HTMLOListElement>>;
@@ -0,0 +1,11 @@
1
+ 'use client';
2
+ import { jsx } from 'react/jsx-runtime';
3
+ import { forwardRef } from 'react';
4
+ import { ark } from '../factory.mjs';
5
+
6
+ const ToastGroup = forwardRef((props, ref) => {
7
+ return /* @__PURE__ */ jsx(ark.ol, { ...props, ref });
8
+ });
9
+ ToastGroup.displayName = "ToastGroup";
10
+
11
+ export { ToastGroup };
@@ -4,6 +4,7 @@
4
4
  Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
5
 
6
6
  const jsxRuntime = require('react/jsx-runtime');
7
+ const react = require('@zag-js/react');
7
8
  require('react');
8
9
  require('../presence/index.cjs');
9
10
  const splitPresenceProps = require('../presence/split-presence-props.cjs');
@@ -16,7 +17,7 @@ const presenceContext = require('../presence/presence-context.cjs');
16
17
  const Tooltip = (props) => {
17
18
  const [presenceProps, { children, ...localProps }] = splitPresenceProps.splitPresenceProps(props);
18
19
  const api = useTooltip.useTooltip(localProps);
19
- const presenceApi = usePresence.usePresence({ ...presenceProps, present: api.isOpen });
20
+ const presenceApi = usePresence.usePresence(react.mergeProps({ present: api.isOpen }, presenceProps));
20
21
  const view = runIfFn.runIfFn(children, api);
21
22
  return /* @__PURE__ */ jsxRuntime.jsx(tooltipContext.TooltipProvider, { value: api, children: /* @__PURE__ */ jsxRuntime.jsx(presenceContext.PresenceProvider, { value: presenceApi, children: view }) });
22
23
  };
@@ -1,5 +1,6 @@
1
1
  'use client';
2
2
  import { jsx } from 'react/jsx-runtime';
3
+ import { mergeProps } from '@zag-js/react';
3
4
  import 'react';
4
5
  import '../presence/index.mjs';
5
6
  import { splitPresenceProps } from '../presence/split-presence-props.mjs';
@@ -12,7 +13,7 @@ import { PresenceProvider } from '../presence/presence-context.mjs';
12
13
  const Tooltip = (props) => {
13
14
  const [presenceProps, { children, ...localProps }] = splitPresenceProps(props);
14
15
  const api = useTooltip(localProps);
15
- const presenceApi = usePresence({ ...presenceProps, present: api.isOpen });
16
+ const presenceApi = usePresence(mergeProps({ present: api.isOpen }, presenceProps));
16
17
  const view = runIfFn(children, api);
17
18
  return /* @__PURE__ */ jsx(TooltipProvider, { value: api, children: /* @__PURE__ */ jsx(PresenceProvider, { value: presenceApi, children: view }) });
18
19
  };
@@ -0,0 +1,16 @@
1
+ 'use client';
2
+ 'use strict';
3
+
4
+ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
+
6
+ const react = require('react');
7
+
8
+ const useIsServer = () => {
9
+ const [isServer, setServer] = react.useState(true);
10
+ react.useEffect(() => {
11
+ setServer(false);
12
+ }, []);
13
+ return isServer;
14
+ };
15
+
16
+ exports.useIsServer = useIsServer;
@@ -0,0 +1 @@
1
+ export declare const useIsServer: () => boolean;
@@ -0,0 +1,12 @@
1
+ 'use client';
2
+ import { useState, useEffect } from 'react';
3
+
4
+ const useIsServer = () => {
5
+ const [isServer, setServer] = useState(true);
6
+ useEffect(() => {
7
+ setServer(false);
8
+ }, []);
9
+ return isServer;
10
+ };
11
+
12
+ export { useIsServer };
@@ -1,10 +0,0 @@
1
- 'use client';
2
- 'use strict';
3
-
4
- Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
5
-
6
- const anatomy = require('@ark-ui/anatomy');
7
-
8
- const parts = anatomy.segmentGroupAnatomy.build();
9
-
10
- exports.parts = parts;
@@ -1,2 +0,0 @@
1
- import { type AnatomyPart } from '@ark-ui/anatomy';
2
- export declare const parts: Record<'root' | 'label' | 'item' | 'itemText' | 'itemControl' | 'indicator', AnatomyPart>;
@@ -1,6 +0,0 @@
1
- 'use client';
2
- import { segmentGroupAnatomy } from '@ark-ui/anatomy';
3
-
4
- const parts = segmentGroupAnatomy.build();
5
-
6
- export { parts };