@skeletonlabs/skeleton-svelte 2.0.0-next.1 → 2.0.0-next.3

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 (134) hide show
  1. package/dist/components/accordion/anatomy/content.svelte +32 -0
  2. package/dist/components/accordion/anatomy/content.svelte.d.ts +7 -0
  3. package/dist/components/accordion/anatomy/heading.svelte +33 -0
  4. package/dist/components/accordion/anatomy/heading.svelte.d.ts +13 -0
  5. package/dist/components/accordion/anatomy/indicator.svelte +32 -0
  6. package/dist/components/accordion/anatomy/indicator.svelte.d.ts +7 -0
  7. package/dist/components/accordion/anatomy/item-context.svelte +18 -0
  8. package/dist/components/accordion/anatomy/item-context.svelte.d.ts +8 -0
  9. package/dist/components/accordion/anatomy/item.svelte +41 -0
  10. package/dist/components/accordion/anatomy/item.svelte.d.ts +8 -0
  11. package/dist/components/accordion/anatomy/root-context.svelte +18 -0
  12. package/dist/components/accordion/anatomy/root-context.svelte.d.ts +8 -0
  13. package/dist/components/accordion/anatomy/root.svelte +44 -0
  14. package/dist/components/accordion/anatomy/root.svelte.d.ts +8 -0
  15. package/dist/components/accordion/anatomy/trigger.svelte +32 -0
  16. package/dist/components/accordion/anatomy/trigger.svelte.d.ts +7 -0
  17. package/dist/components/accordion/index.d.ts +11 -2
  18. package/dist/components/accordion/index.js +1 -2
  19. package/dist/components/accordion/modules/anatomy.d.ts +8 -7
  20. package/dist/components/accordion/modules/anatomy.js +16 -13
  21. package/dist/components/accordion/modules/item-context.d.ts +10 -0
  22. package/dist/components/accordion/modules/item-context.js +2 -0
  23. package/dist/components/accordion/modules/root-context.d.ts +9 -0
  24. package/dist/components/accordion/modules/root-context.js +2 -0
  25. package/dist/components/avatar/anatomy/fallback.svelte +28 -0
  26. package/dist/components/avatar/anatomy/fallback.svelte.d.ts +7 -0
  27. package/dist/components/avatar/anatomy/image.svelte +26 -0
  28. package/dist/components/avatar/anatomy/image.svelte.d.ts +7 -0
  29. package/dist/components/avatar/anatomy/root-context.svelte +18 -0
  30. package/dist/components/avatar/anatomy/root-context.svelte.d.ts +8 -0
  31. package/dist/components/avatar/anatomy/root.svelte +41 -0
  32. package/dist/components/avatar/anatomy/root.svelte.d.ts +8 -0
  33. package/dist/components/avatar/index.d.ts +6 -2
  34. package/dist/components/avatar/index.js +1 -2
  35. package/dist/components/avatar/modules/anatomy.d.ts +4 -4
  36. package/dist/components/avatar/modules/anatomy.js +8 -7
  37. package/dist/components/avatar/modules/root-context.d.ts +9 -0
  38. package/dist/components/avatar/modules/root-context.js +2 -0
  39. package/dist/components/progress-linear/anatomy/label.svelte +36 -0
  40. package/dist/components/progress-linear/anatomy/label.svelte.d.ts +7 -0
  41. package/dist/components/progress-linear/anatomy/range.svelte +36 -0
  42. package/dist/components/progress-linear/anatomy/range.svelte.d.ts +7 -0
  43. package/dist/components/progress-linear/anatomy/root-context.svelte +18 -0
  44. package/dist/components/progress-linear/anatomy/root-context.svelte.d.ts +8 -0
  45. package/dist/components/progress-linear/anatomy/root.svelte +53 -0
  46. package/dist/components/progress-linear/anatomy/root.svelte.d.ts +8 -0
  47. package/dist/components/progress-linear/anatomy/track.svelte +28 -0
  48. package/dist/components/progress-linear/anatomy/track.svelte.d.ts +7 -0
  49. package/dist/components/progress-linear/index.d.ts +7 -0
  50. package/dist/components/progress-linear/index.js +1 -0
  51. package/dist/components/progress-linear/modules/anatomy.d.ts +6 -0
  52. package/dist/components/progress-linear/modules/anatomy.js +11 -0
  53. package/dist/components/progress-linear/modules/root-context.d.ts +9 -0
  54. package/dist/components/progress-linear/modules/root-context.js +2 -0
  55. package/dist/components/rating-group/anatomy/control.svelte +26 -0
  56. package/dist/components/rating-group/anatomy/control.svelte.d.ts +7 -0
  57. package/dist/components/rating-group/anatomy/hidden-input.svelte +28 -0
  58. package/dist/components/rating-group/anatomy/hidden-input.svelte.d.ts +7 -0
  59. package/dist/components/rating-group/anatomy/item-context.svelte +18 -0
  60. package/dist/components/rating-group/anatomy/item-context.svelte.d.ts +8 -0
  61. package/dist/components/rating-group/anatomy/item.svelte +86 -0
  62. package/dist/components/rating-group/anatomy/item.svelte.d.ts +27 -0
  63. package/dist/components/rating-group/anatomy/label.svelte +26 -0
  64. package/dist/components/rating-group/anatomy/label.svelte.d.ts +7 -0
  65. package/dist/components/rating-group/anatomy/root-context.svelte +18 -0
  66. package/dist/components/rating-group/anatomy/root-context.svelte.d.ts +8 -0
  67. package/dist/components/rating-group/anatomy/root.svelte +47 -0
  68. package/dist/components/rating-group/anatomy/root.svelte.d.ts +8 -0
  69. package/dist/components/rating-group/index.d.ts +10 -0
  70. package/dist/components/rating-group/index.js +1 -0
  71. package/dist/components/rating-group/modules/anatomy.d.ts +8 -0
  72. package/dist/components/rating-group/modules/anatomy.js +15 -0
  73. package/dist/components/rating-group/modules/item-context.d.ts +9 -0
  74. package/dist/components/rating-group/modules/item-context.js +2 -0
  75. package/dist/components/rating-group/modules/root-context.d.ts +9 -0
  76. package/dist/components/rating-group/modules/root-context.js +2 -0
  77. package/dist/components/tabs/anatomy/content.svelte +31 -0
  78. package/dist/components/tabs/anatomy/content.svelte.d.ts +8 -0
  79. package/dist/components/tabs/anatomy/indicator.svelte +26 -0
  80. package/dist/components/tabs/anatomy/indicator.svelte.d.ts +7 -0
  81. package/dist/components/tabs/anatomy/list.svelte +28 -0
  82. package/dist/components/tabs/anatomy/list.svelte.d.ts +7 -0
  83. package/dist/components/tabs/anatomy/root-context.svelte +18 -0
  84. package/dist/components/tabs/anatomy/root-context.svelte.d.ts +8 -0
  85. package/dist/components/tabs/anatomy/root.svelte +44 -0
  86. package/dist/components/tabs/anatomy/root.svelte.d.ts +8 -0
  87. package/dist/components/tabs/anatomy/trigger.svelte +31 -0
  88. package/dist/components/tabs/anatomy/trigger.svelte.d.ts +8 -0
  89. package/dist/components/tabs/index.d.ts +1 -0
  90. package/dist/components/tabs/index.js +1 -0
  91. package/dist/components/tabs/modules/anatomy.d.ts +7 -0
  92. package/dist/components/tabs/modules/anatomy.js +13 -0
  93. package/dist/components/tabs/modules/root-context.d.ts +9 -0
  94. package/dist/components/tabs/modules/root-context.js +2 -0
  95. package/dist/index.d.ts +5 -2
  96. package/dist/index.js +5 -2
  97. package/dist/internal/components/star-empty.svelte +12 -0
  98. package/dist/internal/components/star-empty.svelte.d.ts +26 -0
  99. package/dist/internal/components/star-full.svelte +12 -0
  100. package/dist/internal/components/star-full.svelte.d.ts +26 -0
  101. package/dist/internal/components/star-half.svelte +19 -0
  102. package/dist/internal/components/star-half.svelte.d.ts +26 -0
  103. package/dist/internal/create-context.d.ts +5 -6
  104. package/dist/internal/create-context.js +10 -9
  105. package/dist/internal/props-with-element.d.ts +3 -0
  106. package/package.json +3 -4
  107. package/dist/components/accordion/anatomy/accordion-content.svelte +0 -28
  108. package/dist/components/accordion/anatomy/accordion-content.svelte.d.ts +0 -4
  109. package/dist/components/accordion/anatomy/accordion-heading.svelte +0 -25
  110. package/dist/components/accordion/anatomy/accordion-heading.svelte.d.ts +0 -4
  111. package/dist/components/accordion/anatomy/accordion-indicator.svelte +0 -28
  112. package/dist/components/accordion/anatomy/accordion-indicator.svelte.d.ts +0 -4
  113. package/dist/components/accordion/anatomy/accordion-item.svelte +0 -34
  114. package/dist/components/accordion/anatomy/accordion-item.svelte.d.ts +0 -4
  115. package/dist/components/accordion/anatomy/accordion-root.svelte +0 -39
  116. package/dist/components/accordion/anatomy/accordion-root.svelte.d.ts +0 -4
  117. package/dist/components/accordion/anatomy/accordion-trigger.svelte +0 -28
  118. package/dist/components/accordion/anatomy/accordion-trigger.svelte.d.ts +0 -4
  119. package/dist/components/accordion/modules/context.d.ts +0 -12
  120. package/dist/components/accordion/modules/context.js +0 -4
  121. package/dist/components/accordion/modules/types.d.ts +0 -29
  122. package/dist/components/accordion/modules/types.js +0 -1
  123. package/dist/components/avatar/anatomy/avatar-fallback.svelte +0 -27
  124. package/dist/components/avatar/anatomy/avatar-fallback.svelte.d.ts +0 -4
  125. package/dist/components/avatar/anatomy/avatar-image.svelte +0 -25
  126. package/dist/components/avatar/anatomy/avatar-image.svelte.d.ts +0 -4
  127. package/dist/components/avatar/anatomy/avatar-root.svelte +0 -39
  128. package/dist/components/avatar/anatomy/avatar-root.svelte.d.ts +0 -4
  129. package/dist/components/avatar/modules/context.d.ts +0 -7
  130. package/dist/components/avatar/modules/context.js +0 -3
  131. package/dist/components/avatar/modules/types.d.ts +0 -14
  132. package/dist/components/avatar/modules/types.js +0 -1
  133. package/dist/internal/create-context-new.d.ts +0 -5
  134. package/dist/internal/create-context-new.js +0 -13
@@ -0,0 +1,10 @@
1
+ export { RatingGroup } from './modules/anatomy';
2
+ export type { RatingGroupRootProps } from './anatomy/root.svelte';
3
+ export type { RatingGroupRootContextProps } from './anatomy/root-context.svelte';
4
+ export type { RatingGroupLabelProps } from './anatomy/label.svelte';
5
+ export type { RatingGroupControlProps } from './anatomy/control.svelte';
6
+ export type { RatingGroupItemProps } from './anatomy/item.svelte';
7
+ export type { RatingGroupItemContextProps } from './anatomy/item-context.svelte';
8
+ export type { RatingGroupHiddenInputProps } from './anatomy/hidden-input.svelte';
9
+ export type { RatingGroupRootContextType as RatingGroupRootContext } from './modules/root-context';
10
+ export type { RatingGroupItemContextType as RatingGroupItemContext } from './modules/item-context';
@@ -0,0 +1 @@
1
+ export { RatingGroup } from './modules/anatomy';
@@ -0,0 +1,8 @@
1
+ export declare const RatingGroup: import("svelte").Component<import("../anatomy/root.svelte").RatingGroupRootProps, {}, ""> & {
2
+ Context: import("svelte").Component<import("../anatomy/root-context.svelte").RatingGroupRootContextProps, {}, "">;
3
+ Label: import("svelte").Component<import("../anatomy/label.svelte").RatingGroupLabelProps, {}, "">;
4
+ Control: import("svelte").Component<import("../anatomy/control.svelte").RatingGroupControlProps, {}, "">;
5
+ Item: import("svelte").Component<import("../anatomy/item.svelte").RatingGroupItemProps, {}, "">;
6
+ ItemContext: import("svelte").Component<import("../anatomy/item-context.svelte").RatingGroupItemContextProps, {}, "">;
7
+ HiddenInput: import("svelte").Component<import("../anatomy/hidden-input.svelte").RatingGroupHiddenInputProps, {}, "">;
8
+ };
@@ -0,0 +1,15 @@
1
+ import Root from '../anatomy/root.svelte';
2
+ import RootContext from '../anatomy/root-context.svelte';
3
+ import Label from '../anatomy/label.svelte';
4
+ import Control from '../anatomy/control.svelte';
5
+ import Item from '../anatomy/item.svelte';
6
+ import ItemContext from '../anatomy/item-context.svelte';
7
+ import HiddenInput from '../anatomy/hidden-input.svelte';
8
+ export const RatingGroup = Object.assign(Root, {
9
+ Context: RootContext,
10
+ Label: Label,
11
+ Control: Control,
12
+ Item: Item,
13
+ ItemContext: ItemContext,
14
+ HiddenInput: HiddenInput
15
+ });
@@ -0,0 +1,9 @@
1
+ import type { ItemState } from '@zag-js/rating-group';
2
+ export interface RatingGroupItemContextType {
3
+ itemState: ItemState;
4
+ }
5
+ export declare const RatingGroupItemContext: {
6
+ key: symbol;
7
+ consume(): RatingGroupItemContextType;
8
+ provide(value: RatingGroupItemContextType): RatingGroupItemContextType;
9
+ };
@@ -0,0 +1,2 @@
1
+ import { createContext } from '../../../internal/create-context';
2
+ export const RatingGroupItemContext = createContext();
@@ -0,0 +1,9 @@
1
+ import type { Api } from '@zag-js/rating-group';
2
+ export interface RatingGroupRootContextType {
3
+ api: Api;
4
+ }
5
+ export declare const RatingGroupRootContext: {
6
+ key: symbol;
7
+ consume(): RatingGroupRootContextType;
8
+ provide(value: RatingGroupRootContextType): RatingGroupRootContextType;
9
+ };
@@ -0,0 +1,2 @@
1
+ import { createContext } from '../../../internal/create-context';
2
+ export const RatingGroupRootContext = createContext();
@@ -0,0 +1,31 @@
1
+ <script lang="ts" module>
2
+ import type { ContentProps } from '@zag-js/tabs';
3
+ import type { HTMLAttributes } from 'svelte/elements';
4
+ import type { PropsWithElement } from '../../../internal/props-with-element';
5
+
6
+ export interface TabsContentProps extends ContentProps, PropsWithElement, HTMLAttributes<HTMLDivElement> {}
7
+ </script>
8
+
9
+ <script lang="ts">
10
+ import { TabsRootContext } from '../modules/root-context';
11
+ import { mergeProps } from '@zag-js/svelte';
12
+ import { classesTabs } from '@skeletonlabs/skeleton-common';
13
+ import { splitContentProps } from '@zag-js/tabs';
14
+
15
+ const props: TabsContentProps = $props();
16
+
17
+ const rootContext = TabsRootContext.consume();
18
+
19
+ const [contentProps, componentProps] = $derived(splitContentProps(props));
20
+ const { element, children, ...restAttributes } = $derived(componentProps);
21
+
22
+ const attributes = $derived(mergeProps(rootContext.api.getContentProps(contentProps), { class: classesTabs.content }, restAttributes));
23
+ </script>
24
+
25
+ {#if element}
26
+ {@render element({ attributes })}
27
+ {:else}
28
+ <div {...attributes}>
29
+ {@render children?.()}
30
+ </div>
31
+ {/if}
@@ -0,0 +1,8 @@
1
+ import type { ContentProps } from '@zag-js/tabs';
2
+ import type { HTMLAttributes } from 'svelte/elements';
3
+ import type { PropsWithElement } from '../../../internal/props-with-element';
4
+ export interface TabsContentProps extends ContentProps, PropsWithElement, HTMLAttributes<HTMLDivElement> {
5
+ }
6
+ declare const Content: import("svelte").Component<TabsContentProps, {}, "">;
7
+ type Content = ReturnType<typeof Content>;
8
+ export default Content;
@@ -0,0 +1,26 @@
1
+ <script lang="ts" module>
2
+ import type { HTMLAttributes } from 'svelte/elements';
3
+ import type { PropsWithElement } from '../../../internal/props-with-element';
4
+
5
+ export interface TabsIndicatorProps extends PropsWithElement, Omit<HTMLAttributes<HTMLDivElement>, 'children'> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import { TabsRootContext } from '../modules/root-context';
10
+ import { mergeProps } from '@zag-js/svelte';
11
+ import { classesTabs } from '@skeletonlabs/skeleton-common';
12
+
13
+ const props: TabsIndicatorProps = $props();
14
+
15
+ const rootContext = TabsRootContext.consume();
16
+
17
+ const { element, ...restAttributes } = $derived(props);
18
+
19
+ const attributes = $derived(mergeProps(rootContext.api.getIndicatorProps(), { class: classesTabs.indicator }, restAttributes));
20
+ </script>
21
+
22
+ {#if element}
23
+ {@render element({ attributes })}
24
+ {:else}
25
+ <div {...attributes}></div>
26
+ {/if}
@@ -0,0 +1,7 @@
1
+ import type { HTMLAttributes } from 'svelte/elements';
2
+ import type { PropsWithElement } from '../../../internal/props-with-element';
3
+ export interface TabsIndicatorProps extends PropsWithElement, Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
4
+ }
5
+ declare const Indicator: import("svelte").Component<TabsIndicatorProps, {}, "">;
6
+ type Indicator = ReturnType<typeof Indicator>;
7
+ export default Indicator;
@@ -0,0 +1,28 @@
1
+ <script lang="ts" module>
2
+ import type { HTMLAttributes } from 'svelte/elements';
3
+ import type { PropsWithElement } from '../../../internal/props-with-element';
4
+
5
+ export interface TabsListProps extends PropsWithElement, HTMLAttributes<HTMLDivElement> {}
6
+ </script>
7
+
8
+ <script lang="ts">
9
+ import { TabsRootContext } from '../modules/root-context';
10
+ import { mergeProps } from '@zag-js/svelte';
11
+ import { classesTabs } from '@skeletonlabs/skeleton-common';
12
+
13
+ const props: TabsListProps = $props();
14
+
15
+ const rootContext = TabsRootContext.consume();
16
+
17
+ const { element, children, ...restAttributes } = $derived(props);
18
+
19
+ const attributes = $derived(mergeProps(rootContext.api.getListProps(), { class: classesTabs.list }, restAttributes));
20
+ </script>
21
+
22
+ {#if element}
23
+ {@render element({ attributes })}
24
+ {:else}
25
+ <div {...attributes}>
26
+ {@render children?.()}
27
+ </div>
28
+ {/if}
@@ -0,0 +1,7 @@
1
+ import type { HTMLAttributes } from 'svelte/elements';
2
+ import type { PropsWithElement } from '../../../internal/props-with-element';
3
+ export interface TabsListProps extends PropsWithElement, HTMLAttributes<HTMLDivElement> {
4
+ }
5
+ declare const List: import("svelte").Component<TabsListProps, {}, "">;
6
+ type List = ReturnType<typeof List>;
7
+ export default List;
@@ -0,0 +1,18 @@
1
+ <script lang="ts" module>
2
+ import type { Snippet } from 'svelte';
3
+ import type { TabsRootContextType } from '../modules/root-context';
4
+
5
+ export interface TabsRootContextProps {
6
+ children: Snippet<[TabsRootContextType]>;
7
+ }
8
+ </script>
9
+
10
+ <script lang="ts">
11
+ import { TabsRootContext } from '../modules/root-context';
12
+
13
+ const props: TabsRootContextProps = $props();
14
+
15
+ const rootContext = TabsRootContext.consume();
16
+ </script>
17
+
18
+ {@render props.children(rootContext)}
@@ -0,0 +1,8 @@
1
+ import type { Snippet } from 'svelte';
2
+ import type { TabsRootContextType } from '../modules/root-context';
3
+ export interface TabsRootContextProps {
4
+ children: Snippet<[TabsRootContextType]>;
5
+ }
6
+ declare const RootContext: import("svelte").Component<TabsRootContextProps, {}, "">;
7
+ type RootContext = ReturnType<typeof RootContext>;
8
+ export default RootContext;
@@ -0,0 +1,44 @@
1
+ <script lang="ts" module>
2
+ import type { Props } from '@zag-js/tabs';
3
+ import type { HTMLAttributes } from 'svelte/elements';
4
+ import type { PropsWithElement } from '../../../internal/props-with-element';
5
+
6
+ export interface TabsRootProps
7
+ extends Omit<Props, 'id'>,
8
+ PropsWithElement,
9
+ Omit<HTMLAttributes<HTMLDivElement>, 'id' | 'defaultValue' | 'dir'> {}
10
+ </script>
11
+
12
+ <script lang="ts">
13
+ import { connect, machine, splitProps } from '@zag-js/tabs';
14
+ import { classesTabs } from '@skeletonlabs/skeleton-common';
15
+ import { useMachine, normalizeProps, mergeProps } from '@zag-js/svelte';
16
+ import { TabsRootContext } from '../modules/root-context';
17
+
18
+ const props: TabsRootProps = $props();
19
+ const [machineProps, componentProps] = $derived(splitProps(props));
20
+ const { element, children, ...restAttributes } = $derived(componentProps);
21
+
22
+ const id = $props.id();
23
+ const service = useMachine(machine, () => ({
24
+ id: id,
25
+ ...machineProps
26
+ }));
27
+ const api = $derived(connect(service, normalizeProps));
28
+
29
+ const attributes = $derived(mergeProps(api.getRootProps(), { class: classesTabs.root }, restAttributes));
30
+
31
+ TabsRootContext.provide({
32
+ get api() {
33
+ return api;
34
+ }
35
+ });
36
+ </script>
37
+
38
+ {#if element}
39
+ {@render element({ attributes })}
40
+ {:else}
41
+ <div {...attributes}>
42
+ {@render children?.()}
43
+ </div>
44
+ {/if}
@@ -0,0 +1,8 @@
1
+ import type { Props } from '@zag-js/tabs';
2
+ import type { HTMLAttributes } from 'svelte/elements';
3
+ import type { PropsWithElement } from '../../../internal/props-with-element';
4
+ export interface TabsRootProps extends Omit<Props, 'id'>, PropsWithElement, Omit<HTMLAttributes<HTMLDivElement>, 'id' | 'defaultValue' | 'dir'> {
5
+ }
6
+ declare const Root: import("svelte").Component<TabsRootProps, {}, "">;
7
+ type Root = ReturnType<typeof Root>;
8
+ export default Root;
@@ -0,0 +1,31 @@
1
+ <script lang="ts" module>
2
+ import type { TriggerProps } from '@zag-js/tabs';
3
+ import type { HTMLButtonAttributes } from 'svelte/elements';
4
+ import type { PropsWithElement } from '../../../internal/props-with-element';
5
+
6
+ export interface TabsTriggerProps extends TriggerProps, PropsWithElement, Omit<HTMLButtonAttributes, 'value' | 'disabled'> {}
7
+ </script>
8
+
9
+ <script lang="ts">
10
+ import { TabsRootContext } from '../modules/root-context';
11
+ import { mergeProps } from '@zag-js/svelte';
12
+ import { classesTabs } from '@skeletonlabs/skeleton-common';
13
+ import { splitTriggerProps } from '@zag-js/tabs';
14
+
15
+ const props: TabsTriggerProps = $props();
16
+
17
+ const rootContext = TabsRootContext.consume();
18
+
19
+ const [triggerProps, componentProps] = $derived(splitTriggerProps(props));
20
+ const { element, children, ...restAttributes } = $derived(componentProps);
21
+
22
+ const attributes = $derived(mergeProps(rootContext.api.getTriggerProps(triggerProps), { class: classesTabs.trigger }, restAttributes));
23
+ </script>
24
+
25
+ {#if element}
26
+ {@render element({ attributes })}
27
+ {:else}
28
+ <button {...attributes}>
29
+ {@render children?.()}
30
+ </button>
31
+ {/if}
@@ -0,0 +1,8 @@
1
+ import type { TriggerProps } from '@zag-js/tabs';
2
+ import type { HTMLButtonAttributes } from 'svelte/elements';
3
+ import type { PropsWithElement } from '../../../internal/props-with-element';
4
+ export interface TabsTriggerProps extends TriggerProps, PropsWithElement, Omit<HTMLButtonAttributes, 'value' | 'disabled'> {
5
+ }
6
+ declare const Trigger: import("svelte").Component<TabsTriggerProps, {}, "">;
7
+ type Trigger = ReturnType<typeof Trigger>;
8
+ export default Trigger;
@@ -0,0 +1 @@
1
+ export * from './modules/anatomy';
@@ -0,0 +1 @@
1
+ export * from './modules/anatomy';
@@ -0,0 +1,7 @@
1
+ export declare const Tabs: import("svelte").Component<import("../anatomy/root.svelte").TabsRootProps, {}, ""> & {
2
+ Context: import("svelte").Component<import("../anatomy/root-context.svelte").TabsRootContextProps, {}, "">;
3
+ List: import("svelte").Component<import("../anatomy/list.svelte").TabsListProps, {}, "">;
4
+ Trigger: import("svelte").Component<import("../anatomy/trigger.svelte").TabsTriggerProps, {}, "">;
5
+ Indicator: import("svelte").Component<import("../anatomy/indicator.svelte").TabsIndicatorProps, {}, "">;
6
+ Content: import("svelte").Component<import("../anatomy/content.svelte").TabsContentProps, {}, "">;
7
+ };
@@ -0,0 +1,13 @@
1
+ import Root from '../anatomy/root.svelte';
2
+ import RootContext from '../anatomy/root-context.svelte';
3
+ import List from '../anatomy/list.svelte';
4
+ import Trigger from '../anatomy/trigger.svelte';
5
+ import Indicator from '../anatomy/indicator.svelte';
6
+ import Content from '../anatomy/content.svelte';
7
+ export const Tabs = Object.assign(Root, {
8
+ Context: RootContext,
9
+ List: List,
10
+ Trigger: Trigger,
11
+ Indicator: Indicator,
12
+ Content: Content
13
+ });
@@ -0,0 +1,9 @@
1
+ import type { Api } from '@zag-js/tabs';
2
+ export interface TabsRootContextType {
3
+ api: Api;
4
+ }
5
+ export declare const TabsRootContext: {
6
+ key: symbol;
7
+ consume(): TabsRootContextType;
8
+ provide(value: TabsRootContextType): TabsRootContextType;
9
+ };
@@ -0,0 +1,2 @@
1
+ import { createContext } from '../../../internal/create-context';
2
+ export const TabsRootContext = createContext();
package/dist/index.d.ts CHANGED
@@ -1,2 +1,5 @@
1
- export * from './components/accordion/index.js';
2
- export * from './components/avatar/index.js';
1
+ export * from './components/accordion/index';
2
+ export * from './components/avatar/index';
3
+ export * from './components/progress-linear/index';
4
+ export * from './components/rating-group/index';
5
+ export * from './components/tabs/index';
package/dist/index.js CHANGED
@@ -1,2 +1,5 @@
1
- export * from './components/accordion/index.js';
2
- export * from './components/avatar/index.js';
1
+ export * from './components/accordion/index';
2
+ export * from './components/avatar/index';
3
+ export * from './components/progress-linear/index';
4
+ export * from './components/rating-group/index';
5
+ export * from './components/tabs/index';
@@ -0,0 +1,12 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24" fill="none" stroke="currentColor" stroke-width="1.5">
2
+ <path
3
+ stroke-linecap="round"
4
+ stroke-linejoin="round"
5
+ d="M11.48 3.499a.562.562 0 0 1 1.04 0l2.125 5.111a.563.563 0 0 0 .475.345
6
+ l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 0 0-.182.557
7
+ l1.285 5.385a.562.562 0 0 1-.84.61l-4.725-2.885a.562.562 0 0 0-.586 0
8
+ L6.982 20.54a.562.562 0 0 1-.84-.61l1.285-5.386a.562.562 0 0 0-.182-.557
9
+ l-4.204-3.602a.562.562 0 0 1 .321-.988l5.518-.442a.563.563 0 0 0 .475-.345
10
+ L11.48 3.5Z"
11
+ />
12
+ </svg>
@@ -0,0 +1,26 @@
1
+ export default StarEmpty;
2
+ type StarEmpty = SvelteComponent<{
3
+ [x: string]: never;
4
+ }, {
5
+ [evt: string]: CustomEvent<any>;
6
+ }, {}> & {
7
+ $$bindings?: string | undefined;
8
+ };
9
+ declare const StarEmpty: $$__sveltets_2_IsomorphicComponent<{
10
+ [x: string]: never;
11
+ }, {
12
+ [evt: string]: CustomEvent<any>;
13
+ }, {}, {}, string>;
14
+ 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> {
15
+ new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
16
+ $$bindings?: Bindings;
17
+ } & Exports;
18
+ (internal: unknown, props: {
19
+ $$events?: Events;
20
+ $$slots?: Slots;
21
+ }): Exports & {
22
+ $set?: any;
23
+ $on?: any;
24
+ };
25
+ z_$$bindings?: Bindings;
26
+ }
@@ -0,0 +1,12 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24" fill="currentColor">
2
+ <path
3
+ fill-rule="evenodd"
4
+ clip-rule="evenodd"
5
+ d="M10.788 3.21c.448-1.077 1.976-1.077 2.424 0l2.082 5.006
6
+ 5.404.434c1.164.093 1.636 1.545.749 2.305l-4.117 3.527
7
+ 1.257 5.273c.271 1.136-.964 2.033-1.96 1.425L12 18.354
8
+ 7.373 21.18c-.996.608-2.231-.29-1.96-1.425l1.257-5.273
9
+ -4.117-3.527c-.887-.76-.415-2.212.749-2.305l5.404-.434
10
+ 2.082-5.005Z"
11
+ />
12
+ </svg>
@@ -0,0 +1,26 @@
1
+ export default StarFull;
2
+ type StarFull = SvelteComponent<{
3
+ [x: string]: never;
4
+ }, {
5
+ [evt: string]: CustomEvent<any>;
6
+ }, {}> & {
7
+ $$bindings?: string | undefined;
8
+ };
9
+ declare const StarFull: $$__sveltets_2_IsomorphicComponent<{
10
+ [x: string]: never;
11
+ }, {
12
+ [evt: string]: CustomEvent<any>;
13
+ }, {}, {}, string>;
14
+ 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> {
15
+ new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
16
+ $$bindings?: Bindings;
17
+ } & Exports;
18
+ (internal: unknown, props: {
19
+ $$events?: Events;
20
+ $$slots?: Slots;
21
+ }): Exports & {
22
+ $set?: any;
23
+ $on?: any;
24
+ };
25
+ z_$$bindings?: Bindings;
26
+ }
@@ -0,0 +1,19 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24" width="24" fill="none" stroke="currentColor" stroke-width="1.5">
2
+ <defs>
3
+ <linearGradient id="half-fill" x1="0%" y1="0%" x2="100%" y2="0%">
4
+ <stop offset="50%" stop-color="currentColor" />
5
+ <stop offset="50%" stop-color="transparent" />
6
+ </linearGradient>
7
+ </defs>
8
+ <path
9
+ fill="url(#half-fill)"
10
+ stroke-linecap="round"
11
+ stroke-linejoin="round"
12
+ d="M11.48 3.499a.562.562 0 0 1 1.04 0l2.125 5.111a.563.563 0 0 0 .475.345
13
+ l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 0 0-.182.557
14
+ l1.285 5.385a.562.562 0 0 1-.84.61l-4.725-2.885a.562.562 0 0 0-.586 0
15
+ L6.982 20.54a.562.562 0 0 1-.84-.61l1.285-5.386a.562.562 0 0 0-.182-.557
16
+ l-4.204-3.602a.562.562 0 0 1 .321-.988l5.518-.442a.563.563 0 0 0 .475-.345
17
+ L11.48 3.5Z"
18
+ />
19
+ </svg>
@@ -0,0 +1,26 @@
1
+ export default StarHalf;
2
+ type StarHalf = SvelteComponent<{
3
+ [x: string]: never;
4
+ }, {
5
+ [evt: string]: CustomEvent<any>;
6
+ }, {}> & {
7
+ $$bindings?: string | undefined;
8
+ };
9
+ declare const StarHalf: $$__sveltets_2_IsomorphicComponent<{
10
+ [x: string]: never;
11
+ }, {
12
+ [evt: string]: CustomEvent<any>;
13
+ }, {}, {}, string>;
14
+ 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> {
15
+ new (options: import("svelte").ComponentConstructorOptions<Props>): import("svelte").SvelteComponent<Props, Events, Slots> & {
16
+ $$bindings?: Bindings;
17
+ } & Exports;
18
+ (internal: unknown, props: {
19
+ $$events?: Events;
20
+ $$slots?: Slots;
21
+ }): Exports & {
22
+ $set?: any;
23
+ $on?: any;
24
+ };
25
+ z_$$bindings?: Bindings;
26
+ }
@@ -1,6 +1,5 @@
1
- /**
2
- * Create a context with a default value
3
- * @param defaultValue The default value that will be returned if the context is not set
4
- * @returns [set, get, key] The setter, getter and key for the context, the getter returns the default value if the context is not set
5
- */
6
- export declare function createContext<T>(defaultValue: T): readonly [(value: T) => T, () => T, symbol];
1
+ export declare function createContext<T>(): {
2
+ key: symbol;
3
+ consume(): T;
4
+ provide(value: T): T;
5
+ };
@@ -1,12 +1,13 @@
1
1
  import { getContext, setContext } from 'svelte';
2
- /**
3
- * Create a context with a default value
4
- * @param defaultValue The default value that will be returned if the context is not set
5
- * @returns [set, get, key] The setter, getter and key for the context, the getter returns the default value if the context is not set
6
- */
7
- export function createContext(defaultValue) {
2
+ export function createContext() {
8
3
  const key = Symbol();
9
- const set = (value) => setContext(key, value);
10
- const get = () => getContext(key) ?? defaultValue;
11
- return [set, get, key];
4
+ return {
5
+ key: key,
6
+ consume() {
7
+ return getContext(key);
8
+ },
9
+ provide(value) {
10
+ return setContext(key, value);
11
+ }
12
+ };
12
13
  }
@@ -1,5 +1,8 @@
1
1
  import type { Snippet } from 'svelte';
2
2
  interface PropsWithElement {
3
+ /**
4
+ * Render the element yourself
5
+ */
3
6
  element?: Snippet<[{
4
7
  attributes: Record<string, unknown>;
5
8
  }]>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skeletonlabs/skeleton-svelte",
3
- "version": "2.0.0-next.1",
3
+ "version": "2.0.0-next.3",
4
4
  "description": "The Svelte package for Skeleton.",
5
5
  "author": "endigo9740 <chris@skeletonlabs.dev>",
6
6
  "types": "./dist/index.d.ts",
@@ -33,13 +33,12 @@
33
33
  "@zag-js/tags-input": "^1.22.1",
34
34
  "@zag-js/toast": "^1.22.1",
35
35
  "@zag-js/tooltip": "^1.22.1",
36
- "@skeletonlabs/skeleton-common": "1.0.0-next.1"
36
+ "@skeletonlabs/skeleton-common": "1.0.0-next.3"
37
37
  },
38
38
  "peerDependencies": {
39
39
  "svelte": "^5.20.0"
40
40
  },
41
41
  "devDependencies": {
42
- "@sveltejs/adapter-auto": "^6.1.0",
43
42
  "@sveltejs/kit": "^2.37.0",
44
43
  "@sveltejs/package": "^2.5.0",
45
44
  "@sveltejs/vite-plugin-svelte": "^6.1.3",
@@ -53,7 +52,7 @@
53
52
  "typescript": "^5.9.2",
54
53
  "vite": "^7.1.3",
55
54
  "vitest": "3.2.4",
56
- "@skeletonlabs/skeleton": "4.0.0-next.1"
55
+ "@skeletonlabs/skeleton": "4.0.0-next.2"
57
56
  },
58
57
  "type": "module",
59
58
  "scripts": {
@@ -1,28 +0,0 @@
1
- <script lang="ts">
2
- import { mergeProps } from '@zag-js/svelte';
3
- import { AccordionItemContext, AccordionRootContext } from '../modules/context.js';
4
- import { classesAccordion } from '@skeletonlabs/skeleton-common';
5
- import type { AccordionContentProps } from '../modules/types.js';
6
-
7
- const rootContext = AccordionRootContext.consume();
8
- const itemContext = AccordionItemContext.consume();
9
- const props: AccordionContentProps = $props();
10
- const { element, children, ...restAttributes } = $derived(props);
11
- const attributes = $derived(
12
- mergeProps(
13
- rootContext.api.getItemContentProps(itemContext.itemProps),
14
- {
15
- class: classesAccordion.content
16
- },
17
- restAttributes
18
- )
19
- );
20
- </script>
21
-
22
- {#if element}
23
- {@render element({ attributes })}
24
- {:else}
25
- <div {...attributes}>
26
- {@render children?.()}
27
- </div>
28
- {/if}
@@ -1,4 +0,0 @@
1
- import type { AccordionContentProps } from '../modules/types.js';
2
- declare const AccordionContent: import("svelte").Component<AccordionContentProps, {}, "">;
3
- type AccordionContent = ReturnType<typeof AccordionContent>;
4
- export default AccordionContent;