@ark-ui/react 0.0.0-rc-20230601121459 → 0.0.0-rc-20230601215329

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 (13) hide show
  1. package/dist/pagination/pagination.cjs +1 -0
  2. package/dist/pagination/pagination.d.ts +1 -0
  3. package/dist/pagination/pagination.mjs +1 -0
  4. package/dist/pagination/use-pagination.cjs +8 -3
  5. package/dist/pagination/use-pagination.d.ts +3 -1
  6. package/dist/pagination/use-pagination.mjs +8 -3
  7. package/dist/splitter/splitter.cjs +1 -0
  8. package/dist/splitter/splitter.d.ts +9 -3
  9. package/dist/splitter/splitter.mjs +1 -0
  10. package/dist/splitter/use-splitter.cjs +28 -4
  11. package/dist/splitter/use-splitter.d.ts +8 -6
  12. package/dist/splitter/use-splitter.mjs +10 -5
  13. package/package.json +33 -33
package/dist/pagination/pagination.cjs CHANGED
@@ -16,6 +16,7 @@ const Pagination = forwardRef.forwardRef((props, ref) => {
16
16
  props,
17
17
  [
18
18
  "count",
19
+ "defaultPage",
19
20
  "dir",
20
21
  "getRootNode",
21
22
  "id",
package/dist/pagination/pagination.d.ts CHANGED
@@ -297,5 +297,6 @@ export declare const Pagination: ForwardRefExoticComponent<{
297
297
  count: number;
298
298
  pageSize?: number | undefined;
299
299
  siblingCount?: number | undefined;
300
+ defaultPage?: number | undefined;
300
301
  children: ReactNode | ((pages: UsePaginationReturn) => ReactNode);
301
302
  }>;
package/dist/pagination/pagination.mjs CHANGED
@@ -12,6 +12,7 @@ const Pagination = forwardRef((props, ref) => {
12
12
  props,
13
13
  [
14
14
  "count",
15
+ "defaultPage",
15
16
  "dir",
16
17
  "getRootNode",
17
18
  "id",
package/dist/pagination/use-pagination.cjs CHANGED
@@ -28,12 +28,17 @@ const pagination__namespace = /*#__PURE__*/_interopNamespaceDefault(pagination);
28
28
 
29
29
  const usePagination = (props) => {
30
30
  const getRootNode = environmentContext.useEnvironmentContext();
31
- const context = {
31
+ const initialContext = {
32
32
  id: React.useId(),
33
33
  getRootNode,
34
- ...props
34
+ ...props,
35
+ page: props.defaultPage
36
+ };
37
+ const context = {
38
+ ...initialContext,
39
+ page: props.page
35
40
  };
36
- const [state, send] = react.useMachine(pagination__namespace.machine(context), { context });
41
+ const [state, send] = react.useMachine(pagination__namespace.machine(initialContext), { context });
37
42
  return pagination__namespace.connect(state, send, react.normalizeProps);
38
43
  };
39
44
 
package/dist/pagination/use-pagination.d.ts CHANGED
@@ -2,7 +2,9 @@ import type { HTMLAttributes } from 'react';
2
2
  import type { PaginationRange, EllipsisProps, PageTriggerProps } from '@zag-js/pagination/dist/pagination.types';
3
3
  import * as pagination from '@zag-js/pagination';
4
4
  import { type Optional } from '../types';
5
- export type UsePaginationProps = Optional<pagination.Context, 'id'>;
5
+ export type UsePaginationProps = Optional<pagination.Context, 'id'> & {
6
+ defaultPage?: pagination.Context['page'];
7
+ };
6
8
  export declare const usePagination: (props: UsePaginationProps) => {
7
9
  page: number;
8
10
  totalPages: number;
package/dist/pagination/use-pagination.mjs CHANGED
@@ -5,12 +5,17 @@ import { useEnvironmentContext } from '../environment/environment-context.mjs';
5
5
 
6
6
  const usePagination = (props) => {
7
7
  const getRootNode = useEnvironmentContext();
8
- const context = {
8
+ const initialContext = {
9
9
  id: useId(),
10
10
  getRootNode,
11
- ...props
11
+ ...props,
12
+ page: props.defaultPage
13
+ };
14
+ const context = {
15
+ ...initialContext,
16
+ page: props.page
12
17
  };
13
- const [state, send] = useMachine(pagination.machine(context), { context });
18
+ const [state, send] = useMachine(pagination.machine(initialContext), { context });
14
19
  return pagination.connect(state, send, normalizeProps);
15
20
  };
16
21
 
package/dist/splitter/splitter.cjs CHANGED
@@ -15,6 +15,7 @@ const Splitter = forwardRef.forwardRef((props, ref) => {
15
15
  const [useSplitterProps, { children, ...divProps }] = createSplitProps.createSplitProps()(
16
16
  props,
17
17
  [
18
+ "defaultSize",
18
19
  "dir",
19
20
  "getRootNode",
20
21
  "id",
package/dist/splitter/splitter.d.ts CHANGED
@@ -3,9 +3,9 @@ import type { ForwardRefExoticComponent, CSSProperties, LegacyRef, Key, AriaRole
3
3
  import { type HTMLArkProps } from '../factory';
4
4
  import type { Assign } from '../types';
5
5
  import { type UseSplitterProps, type UseSplitterReturn } from './use-splitter';
6
- export type SplitterProps = Assign<HTMLArkProps<'div'>, Assign<UseSplitterProps, {
6
+ export type SplitterProps = Assign<HTMLArkProps<'div'>, UseSplitterProps & {
7
7
  children?: ReactNode | ((state: UseSplitterReturn) => ReactNode);
8
- }>>;
8
+ }>;
9
9
  export declare const Splitter: ForwardRefExoticComponent<{
10
10
  slot?: string | undefined;
11
11
  style?: CSSProperties | undefined;
@@ -269,8 +269,8 @@ export declare const Splitter: ForwardRefExoticComponent<{
269
269
  onAnimationIterationCapture?: AnimationEventHandler<HTMLDivElement> | undefined;
270
270
  onTransitionEnd?: TransitionEventHandler<HTMLDivElement> | undefined;
271
271
  onTransitionEndCapture?: TransitionEventHandler<HTMLDivElement> | undefined;
272
- dir?: "ltr" | "rtl" | undefined;
273
272
  id?: string | undefined;
273
+ dir?: "ltr" | "rtl" | undefined;
274
274
  onResize?: ((details: {
275
275
  size: {
276
276
  id: PanelId;
@@ -313,5 +313,11 @@ export declare const Splitter: ForwardRefExoticComponent<{
313
313
  }[];
314
314
  activeHandleId: string | null;
315
315
  }) => void) | undefined;
316
+ defaultSize?: {
317
+ id: PanelId;
318
+ size?: number | undefined;
319
+ minSize?: number | undefined;
320
+ maxSize?: number | undefined;
321
+ }[] | undefined;
316
322
  children?: ReactNode | ((state: UseSplitterReturn) => ReactNode);
317
323
  }>;
package/dist/splitter/splitter.mjs CHANGED
@@ -11,6 +11,7 @@ const Splitter = forwardRef((props, ref) => {
11
11
  const [useSplitterProps, { children, ...divProps }] = createSplitProps()(
12
12
  props,
13
13
  [
14
+ "defaultSize",
14
15
  "dir",
15
16
  "getRootNode",
16
17
  "id",
package/dist/splitter/use-splitter.cjs CHANGED
@@ -7,15 +7,39 @@ const splitter = require('@zag-js/splitter');
7
7
  const React = require('react');
8
8
  const environmentContext = require('../environment/environment-context.cjs');
9
9
 
10
+ function _interopNamespaceDefault(e) {
11
+ const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
12
+ if (e) {
13
+ for (const k in e) {
14
+ if (k !== 'default') {
15
+ const d = Object.getOwnPropertyDescriptor(e, k);
16
+ Object.defineProperty(n, k, d.get ? d : {
17
+ enumerable: true,
18
+ get: () => e[k]
19
+ });
20
+ }
21
+ }
22
+ }
23
+ n.default = e;
24
+ return Object.freeze(n);
25
+ }
26
+
27
+ const splitter__namespace = /*#__PURE__*/_interopNamespaceDefault(splitter);
28
+
10
29
  const useSplitter = (props) => {
11
30
  const getRootNode = environmentContext.useEnvironmentContext();
12
- const context = {
31
+ const initialContext = {
13
32
  id: React.useId(),
14
33
  getRootNode,
15
- ...props
34
+ ...props,
35
+ size: props.defaultSize
36
+ };
37
+ const context = {
38
+ ...initialContext,
39
+ size: props.size
16
40
  };
17
- const [state, send] = react.useMachine(splitter.machine(context), { context });
18
- return splitter.connect(state, send, react.normalizeProps);
41
+ const [state, send] = react.useMachine(splitter__namespace.machine(initialContext), { context });
42
+ return splitter__namespace.connect(state, send, react.normalizeProps);
19
43
  };
20
44
 
21
45
  exports.useSplitter = useSplitter;
package/dist/splitter/use-splitter.d.ts CHANGED
@@ -1,8 +1,10 @@
1
1
  import type { HTMLAttributes } from 'react';
2
- import type { PanelId, ResizeTriggerProps, PanelProps } from '@zag-js/splitter/dist/splitter.types';
3
- import { type Context } from '@zag-js/splitter';
2
+ import type { PanelId } from '@zag-js/splitter/dist/splitter.types';
3
+ import * as splitter from '@zag-js/splitter';
4
4
  import { type Optional } from '../types';
5
- export type UseSplitterProps = Optional<Context, 'id'>;
5
+ export type UseSplitterProps = Optional<splitter.Context, 'id'> & {
6
+ defaultSize?: splitter.Context['size'];
7
+ };
6
8
  export type UseSplitterReturn = ReturnType<typeof useSplitter>;
7
9
  export declare const useSplitter: (props: UseSplitterProps) => {
8
10
  isFocused: boolean;
@@ -14,7 +16,7 @@ export declare const useSplitter: (props: UseSplitterProps) => {
14
16
  setToMinSize(id: PanelId): void;
15
17
  setToMaxSize(id: PanelId): void;
16
18
  setSize(id: PanelId, size: number): void;
17
- getResizeTriggerState(props: ResizeTriggerProps): {
19
+ getResizeTriggerState(props: splitter.ResizeTriggerProps): {
18
20
  isDisabled: boolean;
19
21
  isFocused: boolean;
20
22
  panelIds: string[];
@@ -23,6 +25,6 @@ export declare const useSplitter: (props: UseSplitterProps) => {
23
25
  value: number;
24
26
  };
25
27
  rootProps: HTMLAttributes<HTMLElement>;
26
- getPanelProps(props: PanelProps): HTMLAttributes<HTMLElement>;
27
- getResizeTriggerProps(props: ResizeTriggerProps): HTMLAttributes<HTMLElement>;
28
+ getPanelProps(props: splitter.PanelProps): HTMLAttributes<HTMLElement>;
29
+ getResizeTriggerProps(props: splitter.ResizeTriggerProps): HTMLAttributes<HTMLElement>;
28
30
  };
package/dist/splitter/use-splitter.mjs CHANGED
@@ -1,17 +1,22 @@
1
1
  import { useMachine, normalizeProps } from '@zag-js/react';
2
- import { machine, connect } from '@zag-js/splitter';
2
+ import * as splitter from '@zag-js/splitter';
3
3
  import { useId } from 'react';
4
4
  import { useEnvironmentContext } from '../environment/environment-context.mjs';
5
5
 
6
6
  const useSplitter = (props) => {
7
7
  const getRootNode = useEnvironmentContext();
8
- const context = {
8
+ const initialContext = {
9
9
  id: useId(),
10
10
  getRootNode,
11
- ...props
11
+ ...props,
12
+ size: props.defaultSize
13
+ };
14
+ const context = {
15
+ ...initialContext,
16
+ size: props.size
12
17
  };
13
- const [state, send] = useMachine(machine(context), { context });
14
- return connect(state, send, normalizeProps);
18
+ const [state, send] = useMachine(splitter.machine(initialContext), { context });
19
+ return splitter.connect(state, send, normalizeProps);
15
20
  };
16
21
 
17
22
  export { useSplitter };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ark-ui/react",
3
- "version": "0.0.0-rc-20230601121459",
3
+ "version": "0.0.0-rc-20230601215329",
4
4
  "description": "A collection of unstyled, accessible UI components for React, utilizing state machines for seamless interaction.",
5
5
  "keywords": [
6
6
  "react",
@@ -50,37 +50,37 @@
50
50
  "url": "https://github.com/chakra-ui/ark/issues"
51
51
  },
52
52
  "dependencies": {
53
- "@zag-js/accordion": "0.10.1",
54
- "@zag-js/anatomy": "0.10.1",
55
- "@zag-js/avatar": "0.10.1",
56
- "@zag-js/carousel": "0.10.1",
57
- "@zag-js/color-picker": "0.10.1",
58
- "@zag-js/checkbox": "0.10.1",
59
- "@zag-js/combobox": "0.10.1",
60
- "@zag-js/date-picker": "0.10.1",
61
- "@zag-js/dialog": "0.10.1",
62
- "@zag-js/editable": "0.10.1",
63
- "@zag-js/hover-card": "0.10.1",
64
- "@zag-js/menu": "0.10.1",
65
- "@zag-js/number-input": "0.10.1",
66
- "@zag-js/pagination": "0.10.1",
67
- "@zag-js/pin-input": "0.10.1",
68
- "@zag-js/popover": "0.10.1",
69
- "@zag-js/pressable": "0.10.1",
70
- "@zag-js/radio-group": "0.10.1",
71
- "@zag-js/range-slider": "0.10.1",
72
- "@zag-js/rating-group": "0.10.1",
73
- "@zag-js/react": "0.10.1",
74
- "@zag-js/select": "0.10.1",
75
- "@zag-js/slider": "0.10.1",
76
- "@zag-js/splitter": "0.10.1",
77
- "@zag-js/switch": "0.10.1",
78
- "@zag-js/tabs": "0.10.1",
79
- "@zag-js/tags-input": "0.10.1",
80
- "@zag-js/toast": "0.10.1",
81
- "@zag-js/tooltip": "0.10.1",
82
- "@zag-js/transition": "0.10.1",
83
- "@zag-js/types": "0.10.1"
53
+ "@zag-js/accordion": "0.10.2",
54
+ "@zag-js/anatomy": "0.10.2",
55
+ "@zag-js/avatar": "0.10.2",
56
+ "@zag-js/carousel": "0.10.2",
57
+ "@zag-js/color-picker": "0.10.2",
58
+ "@zag-js/checkbox": "0.10.2",
59
+ "@zag-js/combobox": "0.10.2",
60
+ "@zag-js/date-picker": "0.10.2",
61
+ "@zag-js/dialog": "0.10.2",
62
+ "@zag-js/editable": "0.10.2",
63
+ "@zag-js/hover-card": "0.10.2",
64
+ "@zag-js/menu": "0.10.2",
65
+ "@zag-js/number-input": "0.10.2",
66
+ "@zag-js/pagination": "0.10.2",
67
+ "@zag-js/pin-input": "0.10.2",
68
+ "@zag-js/popover": "0.10.2",
69
+ "@zag-js/pressable": "0.10.2",
70
+ "@zag-js/radio-group": "0.10.2",
71
+ "@zag-js/range-slider": "0.10.2",
72
+ "@zag-js/rating-group": "0.10.2",
73
+ "@zag-js/react": "0.10.2",
74
+ "@zag-js/select": "0.10.2",
75
+ "@zag-js/slider": "0.10.2",
76
+ "@zag-js/splitter": "0.10.2",
77
+ "@zag-js/switch": "0.10.2",
78
+ "@zag-js/tabs": "0.10.2",
79
+ "@zag-js/tags-input": "0.10.2",
80
+ "@zag-js/toast": "0.10.2",
81
+ "@zag-js/tooltip": "0.10.2",
82
+ "@zag-js/transition": "0.10.2",
83
+ "@zag-js/types": "0.10.2"
84
84
  },
85
85
  "devDependencies": {
86
86
  "@testing-library/dom": "9.3.0",
@@ -105,7 +105,7 @@
105
105
  "react-dom": "18.2.0",
106
106
  "react-frame-component": "5.2.6",
107
107
  "resize-observer-polyfill": "1.5.1",
108
- "typescript": "5.0.4",
108
+ "typescript": "5.1.3",
109
109
  "vite": "4.3.9",
110
110
  "vite-plugin-dts": "2.3.0",
111
111
  "vitest": "0.31.4",