ui-ingredients 0.0.4 → 0.0.6
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +1 -1
- package/dist/accordion/context.svelte.js +1 -1
- package/dist/clipboard/root.svelte +1 -1
- package/dist/combobox/context.svelte.js +3 -3
- package/dist/combobox/root.svelte +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.js +1 -0
- package/dist/number-input/root.svelte +1 -1
- package/dist/radio-group/context.svelte.js +1 -1
- package/dist/select/context.svelte.js +3 -3
- package/dist/slider/context.svelte.js +1 -1
- package/dist/steps/content.svelte +12 -0
- package/dist/steps/content.svelte.d.ts +23 -0
- package/dist/steps/context.svelte.d.ts +10 -0
- package/dist/steps/context.svelte.js +20 -0
- package/dist/steps/index.d.ts +10 -0
- package/dist/steps/index.js +10 -0
- package/dist/steps/indicator.svelte +13 -0
- package/dist/steps/indicator.svelte.d.ts +22 -0
- package/dist/steps/item.svelte +13 -0
- package/dist/steps/item.svelte.d.ts +23 -0
- package/dist/steps/list.svelte +12 -0
- package/dist/steps/list.svelte.d.ts +22 -0
- package/dist/steps/next-trigger.svelte +12 -0
- package/dist/steps/next-trigger.svelte.d.ts +22 -0
- package/dist/steps/prev-trigger.svelte +12 -0
- package/dist/steps/prev-trigger.svelte.d.ts +22 -0
- package/dist/steps/progress.svelte +12 -0
- package/dist/steps/progress.svelte.d.ts +22 -0
- package/dist/steps/root.svelte +38 -0
- package/dist/steps/root.svelte.d.ts +25 -0
- package/dist/steps/separator.svelte +13 -0
- package/dist/steps/separator.svelte.d.ts +22 -0
- package/dist/steps/trigger.svelte +13 -0
- package/dist/steps/trigger.svelte.d.ts +22 -0
- package/dist/types.d.ts +1 -1
- package/package.json +1 -1
- package/dist/steps/.gitkeep +0 -0
package/README.md
CHANGED
@@ -13,7 +13,7 @@ export function useAccordionContext() {
|
|
13
13
|
return getContext('Accordion');
|
14
14
|
}
|
15
15
|
export function setAccordionItemContext(value) {
|
16
|
-
setContext('AccordionItem',
|
16
|
+
setContext('AccordionItem', value);
|
17
17
|
}
|
18
18
|
export function useAccordionItemContext() {
|
19
19
|
return getContext('AccordionItem');
|
@@ -19,19 +19,19 @@ export function createComboboxContext(props) {
|
|
19
19
|
return api;
|
20
20
|
}
|
21
21
|
export function setComboboxContext(value) {
|
22
|
-
setContext('Combobox',
|
22
|
+
setContext('Combobox', value);
|
23
23
|
}
|
24
24
|
export function useComboboxContext() {
|
25
25
|
return getContext('Combobox');
|
26
26
|
}
|
27
27
|
export function setComboboxItemContext(value) {
|
28
|
-
setContext('ComboboxItem',
|
28
|
+
setContext('ComboboxItem', value);
|
29
29
|
}
|
30
30
|
export function useComboboxItemContext() {
|
31
31
|
return getContext('ComboboxItem');
|
32
32
|
}
|
33
33
|
export function setComboboxItemGroupContext(value) {
|
34
|
-
setContext('ComboboxItemGroup',
|
34
|
+
setContext('ComboboxItemGroup', value);
|
35
35
|
}
|
36
36
|
export function useComboboxItemGroupContext() {
|
37
37
|
return getContext('ComboboxItemGroup');
|
package/dist/index.d.ts
CHANGED
@@ -32,6 +32,8 @@ export * as Select from './select/index.js';
|
|
32
32
|
export type { SelectClearTriggerProps, SelectContentProps, SelectControlProps, SelectHiddenSelectProps, SelectIndicatorProps, SelectItemGroupLabelProps, SelectItemGroupProps, SelectItemIndicatorProps, SelectItemProps, SelectItemTextProps, SelectLabelProps, SelectListProps, SelectPositionerProps, SelectProps, SelectTriggerProps, SelectValueTextProps, } from './select/index.js';
|
33
33
|
export * as Slider from './slider/index.js';
|
34
34
|
export type { SliderControlProps, SliderHiddenInputProps, SliderLabelProps, SliderMarkerGroupProps, SliderMarkerProps, SliderProps, SliderRangeProps, SliderThumbProps, SliderTrackProps, SliderValueTextProps, } from './slider/index.js';
|
35
|
+
export * as Steps from './steps/index.js';
|
36
|
+
export type { StepsContentProps, StepsIndicatorProps, StepsItemProps, StepsListProps, StepsNextTriggerProps, StepsPrevTriggerProps, StepsProgressProps, StepsProps, StepsSeparatorProps, StepsTriggerProps, } from './steps/index.js';
|
35
37
|
export * as Switch from './switch/index.js';
|
36
38
|
export type { SwitchControlProps, SwitchHiddenInputProps, SwitchLabelProps, SwitchProps, SwitchThumbProps, } from './switch/index.js';
|
37
39
|
export * as Tabs from './tabs/index.js';
|
package/dist/index.js
CHANGED
@@ -15,6 +15,7 @@ export * as Progress from './progress/index.js';
|
|
15
15
|
export * as RadioGroup from './radio-group/index.js';
|
16
16
|
export * as Select from './select/index.js';
|
17
17
|
export * as Slider from './slider/index.js';
|
18
|
+
export * as Steps from './steps/index.js';
|
18
19
|
export * as Switch from './switch/index.js';
|
19
20
|
export * as Tabs from './tabs/index.js';
|
20
21
|
export * as ToggleGroup from './toggle-group/index.js';
|
@@ -13,7 +13,7 @@ export function useRadioGroupContext() {
|
|
13
13
|
return getContext('RadioGroup');
|
14
14
|
}
|
15
15
|
export function setRadioGroupItemContext(value) {
|
16
|
-
setContext('RadioGroupItem',
|
16
|
+
setContext('RadioGroupItem', value);
|
17
17
|
}
|
18
18
|
export function useRadioGroupItemContext() {
|
19
19
|
return getContext('RadioGroupItem');
|
@@ -19,19 +19,19 @@ export function createSelectContext(props) {
|
|
19
19
|
return api;
|
20
20
|
}
|
21
21
|
export function setSelectContext(value) {
|
22
|
-
setContext('Select',
|
22
|
+
setContext('Select', value);
|
23
23
|
}
|
24
24
|
export function useSelectContext() {
|
25
25
|
return getContext('Select');
|
26
26
|
}
|
27
27
|
export function setSelectItemGroupContext(value) {
|
28
|
-
setContext('SelectItemGroup',
|
28
|
+
setContext('SelectItemGroup', value);
|
29
29
|
}
|
30
30
|
export function useSelectItemGroupContext() {
|
31
31
|
return getContext('SelectItemGroup');
|
32
32
|
}
|
33
33
|
export function setSelectItemContext(value) {
|
34
|
-
setContext('SelectItem',
|
34
|
+
setContext('SelectItem', value);
|
35
35
|
}
|
36
36
|
export function useSelectItemContext() {
|
37
37
|
return getContext('SelectItem');
|
@@ -13,7 +13,7 @@ export function useSliderContext() {
|
|
13
13
|
return getContext('Slider');
|
14
14
|
}
|
15
15
|
export function setSliderThumbContext(value) {
|
16
|
-
setContext('SliderThumb',
|
16
|
+
setContext('SliderThumb', value);
|
17
17
|
}
|
18
18
|
export function useSliderThumbContext() {
|
19
19
|
return getContext('SliderThumb');
|
@@ -0,0 +1,12 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { useStepsContext } from "./context.svelte.js";
|
5
|
+
let { index, children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let attrs = $derived(mergeProps(props, context.getContentProps({ index })));
|
8
|
+
</script>
|
9
|
+
|
10
|
+
<div {...attrs}>
|
11
|
+
{@render children?.()}
|
12
|
+
</div>
|
@@ -0,0 +1,23 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { ItemProps } from '@zag-js/steps';
|
3
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
4
|
+
export interface StepsContentProps extends Assign<SvelteHTMLElements['div'], ItemProps> {
|
5
|
+
}
|
6
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
7
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
8
|
+
$$bindings?: Bindings;
|
9
|
+
} & Exports;
|
10
|
+
(internal: unknown, props: Props & {
|
11
|
+
$$events?: Events;
|
12
|
+
$$slots?: Slots;
|
13
|
+
}): Exports & {
|
14
|
+
$set?: any;
|
15
|
+
$on?: any;
|
16
|
+
};
|
17
|
+
z_$$bindings?: Bindings;
|
18
|
+
}
|
19
|
+
declare const Content: $$__sveltets_2_IsomorphicComponent<StepsContentProps, {
|
20
|
+
[evt: string]: CustomEvent<any>;
|
21
|
+
}, {}, {}, "">;
|
22
|
+
type Content = InstanceType<typeof Content>;
|
23
|
+
export default Content;
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import * as steps from '@zag-js/steps';
|
2
|
+
export interface CreateStepsContextProps extends steps.Context {
|
3
|
+
}
|
4
|
+
export interface CreateStepsContextReturn extends ReturnType<typeof createStepsContext> {
|
5
|
+
}
|
6
|
+
export declare function createStepsContext(props: CreateStepsContextProps): any;
|
7
|
+
export declare function setStepsContext(value: CreateStepsContextReturn): void;
|
8
|
+
export declare function useStepsContext(): CreateStepsContextReturn;
|
9
|
+
export declare function setStepsItemContext(value: steps.ItemProps): void;
|
10
|
+
export declare function useStepsItemContext(): steps.ItemProps;
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import * as steps from '@zag-js/steps';
|
2
|
+
import { normalizeProps, reflect, useMachine } from '@zag-js/svelte';
|
3
|
+
import { getContext, setContext } from 'svelte';
|
4
|
+
export function createStepsContext(props) {
|
5
|
+
const [state, send] = useMachine(steps.machine(props));
|
6
|
+
const api = $derived(reflect(() => steps.connect(state, send, normalizeProps)));
|
7
|
+
return api;
|
8
|
+
}
|
9
|
+
export function setStepsContext(value) {
|
10
|
+
setContext('Steps', value);
|
11
|
+
}
|
12
|
+
export function useStepsContext() {
|
13
|
+
return getContext('Steps');
|
14
|
+
}
|
15
|
+
export function setStepsItemContext(value) {
|
16
|
+
setContext('StepsItem', value);
|
17
|
+
}
|
18
|
+
export function useStepsItemContext() {
|
19
|
+
return getContext('StepsItem');
|
20
|
+
}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
export { default as Content, type StepsContentProps } from './content.svelte';
|
2
|
+
export { default as Indicator, type StepsIndicatorProps } from './indicator.svelte';
|
3
|
+
export { default as Item, type StepsItemProps } from './item.svelte';
|
4
|
+
export { default as List, type StepsListProps } from './list.svelte';
|
5
|
+
export { default as NextTrigger, type StepsNextTriggerProps } from './next-trigger.svelte';
|
6
|
+
export { default as PrevTrigger, type StepsPrevTriggerProps } from './prev-trigger.svelte';
|
7
|
+
export { default as Progress, type StepsProgressProps } from './progress.svelte';
|
8
|
+
export { default as Root, type StepsProps } from './root.svelte';
|
9
|
+
export { default as Separator, type StepsSeparatorProps } from './separator.svelte';
|
10
|
+
export { default as Trigger, type StepsTriggerProps } from './trigger.svelte';
|
@@ -0,0 +1,10 @@
|
|
1
|
+
export { default as Content } from './content.svelte';
|
2
|
+
export { default as Indicator } from './indicator.svelte';
|
3
|
+
export { default as Item } from './item.svelte';
|
4
|
+
export { default as List } from './list.svelte';
|
5
|
+
export { default as NextTrigger } from './next-trigger.svelte';
|
6
|
+
export { default as PrevTrigger } from './prev-trigger.svelte';
|
7
|
+
export { default as Progress } from './progress.svelte';
|
8
|
+
export { default as Root } from './root.svelte';
|
9
|
+
export { default as Separator } from './separator.svelte';
|
10
|
+
export { default as Trigger } from './trigger.svelte';
|
@@ -0,0 +1,13 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { useStepsContext, useStepsItemContext } from "./context.svelte.js";
|
5
|
+
let { children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let itemContext = useStepsItemContext();
|
8
|
+
let attrs = $derived(mergeProps(props, context.getIndicatorProps(itemContext)));
|
9
|
+
</script>
|
10
|
+
|
11
|
+
<div {...attrs}>
|
12
|
+
{@render children?.()}
|
13
|
+
</div>
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
3
|
+
export interface StepsIndicatorProps extends Assign<SvelteHTMLElements['div'], {}> {
|
4
|
+
}
|
5
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
6
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
7
|
+
$$bindings?: Bindings;
|
8
|
+
} & Exports;
|
9
|
+
(internal: unknown, props: Props & {
|
10
|
+
$$events?: Events;
|
11
|
+
$$slots?: Slots;
|
12
|
+
}): Exports & {
|
13
|
+
$set?: any;
|
14
|
+
$on?: any;
|
15
|
+
};
|
16
|
+
z_$$bindings?: Bindings;
|
17
|
+
}
|
18
|
+
declare const Indicator: $$__sveltets_2_IsomorphicComponent<StepsIndicatorProps, {
|
19
|
+
[evt: string]: CustomEvent<any>;
|
20
|
+
}, {}, {}, "">;
|
21
|
+
type Indicator = InstanceType<typeof Indicator>;
|
22
|
+
export default Indicator;
|
@@ -0,0 +1,13 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { setStepsItemContext, useStepsContext } from "./context.svelte.js";
|
5
|
+
let { index, children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let attrs = $derived(mergeProps(props, context.getItemProps({ index })));
|
8
|
+
setStepsItemContext({ index });
|
9
|
+
</script>
|
10
|
+
|
11
|
+
<div {...attrs}>
|
12
|
+
{@render children?.()}
|
13
|
+
</div>
|
@@ -0,0 +1,23 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { ItemProps } from '@zag-js/steps';
|
3
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
4
|
+
export interface StepsItemProps extends Assign<SvelteHTMLElements['div'], ItemProps> {
|
5
|
+
}
|
6
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
7
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
8
|
+
$$bindings?: Bindings;
|
9
|
+
} & Exports;
|
10
|
+
(internal: unknown, props: Props & {
|
11
|
+
$$events?: Events;
|
12
|
+
$$slots?: Slots;
|
13
|
+
}): Exports & {
|
14
|
+
$set?: any;
|
15
|
+
$on?: any;
|
16
|
+
};
|
17
|
+
z_$$bindings?: Bindings;
|
18
|
+
}
|
19
|
+
declare const Item: $$__sveltets_2_IsomorphicComponent<StepsItemProps, {
|
20
|
+
[evt: string]: CustomEvent<any>;
|
21
|
+
}, {}, {}, "">;
|
22
|
+
type Item = InstanceType<typeof Item>;
|
23
|
+
export default Item;
|
@@ -0,0 +1,12 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { useStepsContext } from "./context.svelte.js";
|
5
|
+
let { children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let attrs = $derived(mergeProps(props, context.getListProps()));
|
8
|
+
</script>
|
9
|
+
|
10
|
+
<div {...attrs}>
|
11
|
+
{@render children?.()}
|
12
|
+
</div>
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
3
|
+
export interface StepsListProps extends Assign<SvelteHTMLElements['div'], {}> {
|
4
|
+
}
|
5
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
6
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
7
|
+
$$bindings?: Bindings;
|
8
|
+
} & Exports;
|
9
|
+
(internal: unknown, props: Props & {
|
10
|
+
$$events?: Events;
|
11
|
+
$$slots?: Slots;
|
12
|
+
}): Exports & {
|
13
|
+
$set?: any;
|
14
|
+
$on?: any;
|
15
|
+
};
|
16
|
+
z_$$bindings?: Bindings;
|
17
|
+
}
|
18
|
+
declare const List: $$__sveltets_2_IsomorphicComponent<StepsListProps, {
|
19
|
+
[evt: string]: CustomEvent<any>;
|
20
|
+
}, {}, {}, "">;
|
21
|
+
type List = InstanceType<typeof List>;
|
22
|
+
export default List;
|
@@ -0,0 +1,12 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { useStepsContext } from "./context.svelte.js";
|
5
|
+
let { children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let attrs = $derived(mergeProps(props, context.getNextTriggerProps()));
|
8
|
+
</script>
|
9
|
+
|
10
|
+
<button type="button" {...attrs}>
|
11
|
+
{@render children?.()}
|
12
|
+
</button>
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
3
|
+
export interface StepsNextTriggerProps extends Assign<SvelteHTMLElements['button'], {}> {
|
4
|
+
}
|
5
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
6
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
7
|
+
$$bindings?: Bindings;
|
8
|
+
} & Exports;
|
9
|
+
(internal: unknown, props: Props & {
|
10
|
+
$$events?: Events;
|
11
|
+
$$slots?: Slots;
|
12
|
+
}): Exports & {
|
13
|
+
$set?: any;
|
14
|
+
$on?: any;
|
15
|
+
};
|
16
|
+
z_$$bindings?: Bindings;
|
17
|
+
}
|
18
|
+
declare const NextTrigger: $$__sveltets_2_IsomorphicComponent<StepsNextTriggerProps, {
|
19
|
+
[evt: string]: CustomEvent<any>;
|
20
|
+
}, {}, {}, "">;
|
21
|
+
type NextTrigger = InstanceType<typeof NextTrigger>;
|
22
|
+
export default NextTrigger;
|
@@ -0,0 +1,12 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { useStepsContext } from "./context.svelte.js";
|
5
|
+
let { children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let attrs = $derived(mergeProps(props, context.getPrevTriggerProps()));
|
8
|
+
</script>
|
9
|
+
|
10
|
+
<button type="button" {...attrs}>
|
11
|
+
{@render children?.()}
|
12
|
+
</button>
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
3
|
+
export interface StepsPrevTriggerProps extends Assign<SvelteHTMLElements['button'], {}> {
|
4
|
+
}
|
5
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
6
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
7
|
+
$$bindings?: Bindings;
|
8
|
+
} & Exports;
|
9
|
+
(internal: unknown, props: Props & {
|
10
|
+
$$events?: Events;
|
11
|
+
$$slots?: Slots;
|
12
|
+
}): Exports & {
|
13
|
+
$set?: any;
|
14
|
+
$on?: any;
|
15
|
+
};
|
16
|
+
z_$$bindings?: Bindings;
|
17
|
+
}
|
18
|
+
declare const PrevTrigger: $$__sveltets_2_IsomorphicComponent<StepsPrevTriggerProps, {
|
19
|
+
[evt: string]: CustomEvent<any>;
|
20
|
+
}, {}, {}, "">;
|
21
|
+
type PrevTrigger = InstanceType<typeof PrevTrigger>;
|
22
|
+
export default PrevTrigger;
|
@@ -0,0 +1,12 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { useStepsContext } from "./context.svelte.js";
|
5
|
+
let { children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let attrs = $derived(mergeProps(props, context.getProgressProps()));
|
8
|
+
</script>
|
9
|
+
|
10
|
+
<div {...attrs}>
|
11
|
+
{@render children?.()}
|
12
|
+
</div>
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
3
|
+
export interface StepsProgressProps extends Assign<SvelteHTMLElements['div'], {}> {
|
4
|
+
}
|
5
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
6
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
7
|
+
$$bindings?: Bindings;
|
8
|
+
} & Exports;
|
9
|
+
(internal: unknown, props: Props & {
|
10
|
+
$$events?: Events;
|
11
|
+
$$slots?: Slots;
|
12
|
+
}): Exports & {
|
13
|
+
$set?: any;
|
14
|
+
$on?: any;
|
15
|
+
};
|
16
|
+
z_$$bindings?: Bindings;
|
17
|
+
}
|
18
|
+
declare const Progress: $$__sveltets_2_IsomorphicComponent<StepsProgressProps, {
|
19
|
+
[evt: string]: CustomEvent<any>;
|
20
|
+
}, {}, {}, "">;
|
21
|
+
type Progress = InstanceType<typeof Progress>;
|
22
|
+
export default Progress;
|
@@ -0,0 +1,38 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { uuid } from "../utils.svelte.js";
|
4
|
+
import { mergeProps } from "@zag-js/svelte";
|
5
|
+
import { createStepsContext, setStepsContext } from "./context.svelte.js";
|
6
|
+
let {
|
7
|
+
id = uuid(),
|
8
|
+
ids,
|
9
|
+
dir,
|
10
|
+
step,
|
11
|
+
count,
|
12
|
+
linear,
|
13
|
+
orientation,
|
14
|
+
onStepChange,
|
15
|
+
onStepComplete,
|
16
|
+
getRootNode,
|
17
|
+
children,
|
18
|
+
...props
|
19
|
+
} = $props();
|
20
|
+
let context = createStepsContext({
|
21
|
+
id,
|
22
|
+
ids,
|
23
|
+
dir,
|
24
|
+
step,
|
25
|
+
count,
|
26
|
+
linear,
|
27
|
+
orientation,
|
28
|
+
onStepChange,
|
29
|
+
onStepComplete,
|
30
|
+
getRootNode
|
31
|
+
});
|
32
|
+
let attrs = $derived(mergeProps(props, context.getRootProps()));
|
33
|
+
setStepsContext(context);
|
34
|
+
</script>
|
35
|
+
|
36
|
+
<div {...attrs}>
|
37
|
+
{@render children?.(context)}
|
38
|
+
</div>
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import type { Assign, OptionalId, WithoutChildren } from '../types.js';
|
2
|
+
import type { Snippet } from 'svelte';
|
3
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
4
|
+
import type { CreateStepsContextProps, CreateStepsContextReturn } from './context.svelte.js';
|
5
|
+
export interface StepsProps extends Assign<WithoutChildren<SvelteHTMLElements['div']>, OptionalId<CreateStepsContextProps>> {
|
6
|
+
children?: Snippet<[CreateStepsContextReturn]>;
|
7
|
+
}
|
8
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
9
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
10
|
+
$$bindings?: Bindings;
|
11
|
+
} & Exports;
|
12
|
+
(internal: unknown, props: Props & {
|
13
|
+
$$events?: Events;
|
14
|
+
$$slots?: Slots;
|
15
|
+
}): Exports & {
|
16
|
+
$set?: any;
|
17
|
+
$on?: any;
|
18
|
+
};
|
19
|
+
z_$$bindings?: Bindings;
|
20
|
+
}
|
21
|
+
declare const Root: $$__sveltets_2_IsomorphicComponent<StepsProps, {
|
22
|
+
[evt: string]: CustomEvent<any>;
|
23
|
+
}, {}, {}, "">;
|
24
|
+
type Root = InstanceType<typeof Root>;
|
25
|
+
export default Root;
|
@@ -0,0 +1,13 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { useStepsContext, useStepsItemContext } from "./context.svelte.js";
|
5
|
+
let { children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let itemContext = useStepsItemContext();
|
8
|
+
let attrs = $derived(mergeProps(props, context.getSeparatorProps(itemContext)));
|
9
|
+
</script>
|
10
|
+
|
11
|
+
<div {...attrs}>
|
12
|
+
{@render children?.()}
|
13
|
+
</div>
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
3
|
+
export interface StepsSeparatorProps extends Assign<SvelteHTMLElements['div'], {}> {
|
4
|
+
}
|
5
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
6
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
7
|
+
$$bindings?: Bindings;
|
8
|
+
} & Exports;
|
9
|
+
(internal: unknown, props: Props & {
|
10
|
+
$$events?: Events;
|
11
|
+
$$slots?: Slots;
|
12
|
+
}): Exports & {
|
13
|
+
$set?: any;
|
14
|
+
$on?: any;
|
15
|
+
};
|
16
|
+
z_$$bindings?: Bindings;
|
17
|
+
}
|
18
|
+
declare const Separator: $$__sveltets_2_IsomorphicComponent<StepsSeparatorProps, {
|
19
|
+
[evt: string]: CustomEvent<any>;
|
20
|
+
}, {}, {}, "">;
|
21
|
+
type Separator = InstanceType<typeof Separator>;
|
22
|
+
export default Separator;
|
@@ -0,0 +1,13 @@
|
|
1
|
+
<script lang="ts" context="module"></script>
|
2
|
+
|
3
|
+
<script lang="ts">import { mergeProps } from "@zag-js/svelte";
|
4
|
+
import { useStepsContext, useStepsItemContext } from "./context.svelte.js";
|
5
|
+
let { children, ...props } = $props();
|
6
|
+
let context = useStepsContext();
|
7
|
+
let itemContext = useStepsItemContext();
|
8
|
+
let attrs = $derived(mergeProps(props, context.getTriggerProps(itemContext)));
|
9
|
+
</script>
|
10
|
+
|
11
|
+
<button type="button" {...attrs}>
|
12
|
+
{@render children?.()}
|
13
|
+
</button>
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import type { Assign } from '../types.js';
|
2
|
+
import type { SvelteHTMLElements } from 'svelte/elements';
|
3
|
+
export interface StepsTriggerProps extends Assign<SvelteHTMLElements['button'], {}> {
|
4
|
+
}
|
5
|
+
interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
|
6
|
+
new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
|
7
|
+
$$bindings?: Bindings;
|
8
|
+
} & Exports;
|
9
|
+
(internal: unknown, props: Props & {
|
10
|
+
$$events?: Events;
|
11
|
+
$$slots?: Slots;
|
12
|
+
}): Exports & {
|
13
|
+
$set?: any;
|
14
|
+
$on?: any;
|
15
|
+
};
|
16
|
+
z_$$bindings?: Bindings;
|
17
|
+
}
|
18
|
+
declare const Trigger: $$__sveltets_2_IsomorphicComponent<StepsTriggerProps, {
|
19
|
+
[evt: string]: CustomEvent<any>;
|
20
|
+
}, {}, {}, "">;
|
21
|
+
type Trigger = InstanceType<typeof Trigger>;
|
22
|
+
export default Trigger;
|
package/dist/types.d.ts
CHANGED
package/package.json
CHANGED
package/dist/steps/.gitkeep
DELETED
File without changes
|