@sprawlify/svelte 0.0.47 → 0.0.49

package/dist/components/tour/tour-positioner.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface TourPositionerBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface TourPositionerProps extends HTMLProps<'div'>, TourPositionerBaseProps {
+}
+declare const TourPositioner: import("svelte").Component<TourPositionerProps, {}, "ref">;
+type TourPositioner = ReturnType<typeof TourPositioner>;
+export default TourPositioner;

package/dist/components/tour/tour-progress-text.svelte

@@ -0,0 +1,26 @@
+<script module lang="ts">
+  import type { HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface TourProgressTextBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface TourProgressTextProps extends HTMLProps<'div'>, TourProgressTextBaseProps {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useTourContext } from './use-tour-context'
+
+  let { ref = $bindable(null), ...props }: TourProgressTextProps = $props()
+
+  const tour = useTourContext()
+
+  const mergedProps = $derived(mergeProps(tour().getProgressTextProps(), props))
+</script>
+
+<Sprawlify as="div" bind:ref {...mergedProps}>
+  {#if props.children}
+    {@render props.children()}
+  {:else}
+    {tour().getProgressText()}
+  {/if}
+</Sprawlify>

package/dist/components/tour/tour-progress-text.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface TourProgressTextBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface TourProgressTextProps extends HTMLProps<'div'>, TourProgressTextBaseProps {
+}
+declare const TourProgressText: import("svelte").Component<TourProgressTextProps, {}, "ref">;
+type TourProgressText = ReturnType<typeof TourProgressText>;
+export default TourProgressText;

package/dist/components/tour/tour-root.svelte

@@ -0,0 +1,29 @@
+<script lang="ts">
+  import { RenderStrategyPropsProvider, splitRenderStrategyProps } from '../../utils/render-strategy'
+  import type { Snippet } from 'svelte'
+  import { PresenceProvider, splitPresenceProps, usePresence, type UsePresenceProps } from '../presence'
+  import { TourProvider } from './use-tour-context'
+  import type { UseTourReturn } from './use-tour.svelte'
+
+  export interface TourRootBaseProps extends UsePresenceProps {
+    tour: UseTourReturn
+    children?: Snippet
+  }
+  export interface TourRootProps extends TourRootBaseProps {}
+
+  const props: TourRootProps = $props()
+
+  const [presenceProps, localProps] = $derived(splitPresenceProps(props))
+  const [renderStrategyProps] = $derived(splitRenderStrategyProps(presenceProps))
+
+  const presence = usePresence(() => ({
+    present: localProps.tour().open,
+    ...presenceProps,
+  }))
+
+  TourProvider(() => localProps.tour())
+  RenderStrategyPropsProvider(() => renderStrategyProps)
+  PresenceProvider(presence)
+</script>
+
+{@render localProps.children?.()}

package/dist/components/tour/tour-root.svelte.d.ts

@@ -0,0 +1,12 @@
+import type { Snippet } from 'svelte';
+import { type UsePresenceProps } from '../presence';
+import type { UseTourReturn } from './use-tour.svelte';
+export interface TourRootBaseProps extends UsePresenceProps {
+    tour: UseTourReturn;
+    children?: Snippet;
+}
+export interface TourRootProps extends TourRootBaseProps {
+}
+declare const TourRoot: import("svelte").Component<TourRootProps, {}, "">;
+type TourRoot = ReturnType<typeof TourRoot>;
+export default TourRoot;

package/dist/components/tour/tour-spotlight.svelte

@@ -0,0 +1,35 @@
+<script module lang="ts">
+  import type { HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface TourSpotlightBaseProps extends PolymorphicProps<'div'>, RefAttribute {}
+  export interface TourSpotlightProps extends HTMLProps<'div'>, TourSpotlightBaseProps {}
+</script>
+
+<script lang="ts">
+  import { useRenderStrategyPropsContext } from '../../utils/render-strategy'
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { usePresence } from '../presence'
+  import { useTourContext } from './use-tour-context'
+
+  let { ref = $bindable(null), ...props }: TourSpotlightProps = $props()
+
+  const tour = useTourContext()
+  const renderStrategyProps = useRenderStrategyPropsContext()
+
+  const presence = usePresence(() => ({
+    present: tour().open,
+    ...renderStrategyProps,
+  }))
+
+  const mergedProps = $derived(mergeProps(tour().getSpotlightProps(), presence().getPresenceProps(), props))
+  const hidden = $derived(!tour().open || !tour().step?.target?.())
+
+  function setNode(node: Element | null) {
+    presence().setNode(node)
+  }
+</script>
+
+{#if !presence().unmounted}
+  <Sprawlify as="div" bind:ref {...mergedProps} {@attach setNode} {hidden} />
+{/if}

package/dist/components/tour/tour-spotlight.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface TourSpotlightBaseProps extends PolymorphicProps<'div'>, RefAttribute {
+}
+export interface TourSpotlightProps extends HTMLProps<'div'>, TourSpotlightBaseProps {
+}
+declare const TourSpotlight: import("svelte").Component<TourSpotlightProps, {}, "ref">;
+type TourSpotlight = ReturnType<typeof TourSpotlight>;
+export default TourSpotlight;

package/dist/components/tour/tour-title.svelte

@@ -0,0 +1,26 @@
+<script module lang="ts">
+  import type { HTMLProps, PolymorphicProps, RefAttribute } from '../../types'
+
+  export interface TourTitleBaseProps extends PolymorphicProps<'h2'>, RefAttribute {}
+  export interface TourTitleProps extends HTMLProps<'h2'>, TourTitleBaseProps {}
+</script>
+
+<script lang="ts">
+  import { mergeProps } from '../../core'
+  import { Sprawlify } from '../factory'
+  import { useTourContext } from './use-tour-context'
+
+  let { ref = $bindable(null), ...props }: TourTitleProps = $props()
+
+  const tour = useTourContext()
+
+  const mergedProps = $derived(mergeProps(tour().getTitleProps(), props))
+</script>
+
+<Sprawlify as="h2" bind:ref {...mergedProps}>
+  {#if props.children}
+    {@render props.children()}
+  {:else}
+    {tour().step?.title}
+  {/if}
+</Sprawlify>

package/dist/components/tour/tour-title.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { HTMLProps, PolymorphicProps, RefAttribute } from '../../types';
+export interface TourTitleBaseProps extends PolymorphicProps<'h2'>, RefAttribute {
+}
+export interface TourTitleProps extends HTMLProps<'h2'>, TourTitleBaseProps {
+}
+declare const TourTitle: import("svelte").Component<TourTitleProps, {}, "ref">;
+type TourTitle = ReturnType<typeof TourTitle>;
+export default TourTitle;

package/dist/components/tour/tour.d.ts

@@ -0,0 +1,17 @@
+export type { WaitForOptions as WaitOptions } from '@sprawlify/primitives/dom-query';
+export type { FocusOutsideEvent, InteractOutsideEvent, Point, PointerDownOutsideEvent, ProgressTextDetails, StatusChangeDetails, StepAction, StepActionMap, StepActionTriggerProps, StepBaseDetails, StepChangeDetails, StepDetails, StepEffectArgs, StepPlacement, StepStatus, StepType, } from '@sprawlify/primitives/machines/tour';
+export { default as ActionTrigger, type TourActionTriggerBaseProps as ActionTriggerBaseProps, type TourActionTriggerProps as ActionTriggerProps, } from './tour-action-trigger.svelte';
+export { default as Actions } from './tour-actions.svelte';
+export { default as Arrow, type TourArrowBaseProps as ArrowBaseProps, type TourArrowProps as ArrowProps, } from './tour-arrow.svelte';
+export { default as ArrowTip, type TourArrowTipBaseProps as ArrowTipBaseProps, type TourArrowTipProps as ArrowTipProps, } from './tour-arrow-tip.svelte';
+export { default as Backdrop, type TourBackdropBaseProps as BackdropBaseProps, type TourBackdropProps as BackdropProps, } from './tour-backdrop.svelte';
+export { default as CloseTrigger, type TourCloseTriggerBaseProps as CloseTriggerBaseProps, type TourCloseTriggerProps as CloseTriggerProps, } from './tour-close-trigger.svelte';
+export { default as Content, type TourContentBaseProps as ContentBaseProps, type TourContentProps as ContentProps, } from './tour-content.svelte';
+export { default as Context, type TourContextProps as ContextProps } from './tour-context.svelte';
+export { default as Control, type TourControlBaseProps as ControlBaseProps, type TourControlProps as ControlProps, } from './tour-control.svelte';
+export { default as Description, type TourDescriptionBaseProps as DescriptionBaseProps, type TourDescriptionProps as DescriptionProps, } from './tour-description.svelte';
+export { default as Positioner, type TourPositionerBaseProps as PositionerBaseProps, type TourPositionerProps as PositionerProps, } from './tour-positioner.svelte';
+export { default as ProgressText, type TourProgressTextBaseProps as ProgressTextBaseProps, type TourProgressTextProps as ProgressTextProps, } from './tour-progress-text.svelte';
+export { default as Root } from './tour-root.svelte';
+export { default as Spotlight, type TourSpotlightBaseProps as SpotlightBaseProps, type TourSpotlightProps as SpotlightProps, } from './tour-spotlight.svelte';
+export { default as Title, type TourTitleBaseProps as TitleBaseProps, type TourTitleProps as TitleProps, } from './tour-title.svelte';

package/dist/components/tour/tour.js

@@ -0,0 +1,15 @@
+export { default as ActionTrigger, } from './tour-action-trigger.svelte';
+export { default as Actions } from './tour-actions.svelte';
+export { default as Arrow, } from './tour-arrow.svelte';
+export { default as ArrowTip, } from './tour-arrow-tip.svelte';
+export { default as Backdrop, } from './tour-backdrop.svelte';
+export { default as CloseTrigger, } from './tour-close-trigger.svelte';
+export { default as Content, } from './tour-content.svelte';
+export { default as Context } from './tour-context.svelte';
+export { default as Control, } from './tour-control.svelte';
+export { default as Description, } from './tour-description.svelte';
+export { default as Positioner, } from './tour-positioner.svelte';
+export { default as ProgressText, } from './tour-progress-text.svelte';
+export { default as Root } from './tour-root.svelte';
+export { default as Spotlight, } from './tour-spotlight.svelte';
+export { default as Title, } from './tour-title.svelte';

package/dist/components/tour/use-tour-context.d.ts

@@ -0,0 +1,6 @@
+import type { Accessor } from '../../types';
+import type { PropTypes } from '../../core';
+import type * as tour from '@sprawlify/primitives/machines/tour';
+export interface UseTourContext extends Accessor<tour.Api<PropTypes>> {
+}
+export declare const TourProvider: (opts: UseTourContext) => void, useTourContext: (fallback?: UseTourContext | undefined) => UseTourContext;

package/dist/components/tour/use-tour-context.js

@@ -0,0 +1,6 @@
+import { createContext } from '../../utils/create-context';
+export const [TourProvider, useTourContext] = createContext({
+    name: 'TourContext',
+    hookName: 'useTourContext',
+    providerName: '<TourProvider />',
+});

package/dist/components/tour/use-tour.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { Accessor, Optional } from '../../types';
+import { type PropTypes } from '../../core';
+import * as tour from '@sprawlify/primitives/machines/tour';
+import { type MaybeFunction } from '@sprawlify/primitives/utils';
+export interface UseTourProps extends Optional<Omit<tour.Props, 'dir' | 'getRootNode'>, 'id'> {
+}
+export interface UseTourReturn extends Accessor<tour.Api<PropTypes>> {
+}
+export declare const useTour: (props?: MaybeFunction<UseTourProps>) => UseTourReturn;

package/dist/components/tour/use-tour.svelte.js

@@ -0,0 +1,19 @@
+import { useEnvironmentContext, useLocaleContext } from '../../providers';
+import { normalizeProps, useMachine } from '../../core';
+import * as tour from '@sprawlify/primitives/machines/tour';
+import { runIfFn } from '@sprawlify/primitives/utils';
+export const useTour = (props = {}) => {
+    const env = useEnvironmentContext() ?? {};
+    const locale = useLocaleContext() ?? {};
+    const machineProps = $derived.by(() => {
+        const resolvedProps = runIfFn(props);
+        return {
+            dir: locale().dir,
+            getRootNode: env().getRootNode,
+            ...resolvedProps,
+        };
+    });
+    const service = useMachine(tour.machine, () => machineProps);
+    const api = $derived(tour.connect(service, normalizeProps));
+    return () => api;
+};

package/dist/components/tree-view/tree-view-root-provider.svelte

@@ -18,6 +18,7 @@
   ) => Snippet
 </script>
 
+<!-- svelte-ignore state_referenced_locally -->
 <script lang="ts" generics="T extends TreeNode">
   import {
     RenderStrategyPropsProvider,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sprawlify/svelte",
-  "version": "0.0.47",
+  "version": "0.0.49",
   "type": "module",
   "description": "Svelte wrapper for primitives.",
   "author": "sprawlify <npm@sprawlify.com>",
@@ -12,6 +12,11 @@
       "svelte": "./dist/index.js",
       "default": "./dist/index.js"
     },
+    "./anatomy": {
+      "types": "./dist/components/anatomy.d.ts",
+      "svelte": "./dist/components/anatomy.js",
+      "default": "./dist/components/anatomy.js"
+    },
     "./accordion": {
       "types": "./dist/components/accordion/index.d.ts",
       "svelte": "./dist/components/accordion/index.js",
@@ -207,11 +212,106 @@
       "svelte": "./dist/components/presence/index.js",
       "default": "./dist/components/presence/index.js"
     },
+    "./progress": {
+      "types": "./dist/components/progress/index.d.ts",
+      "svelte": "./dist/components/progress/index.js",
+      "default": "./dist/components/progress/index.js"
+    },
+    "./qr-code": {
+      "types": "./dist/components/qr-code/index.d.ts",
+      "svelte": "./dist/components/qr-code/index.js",
+      "default": "./dist/components/qr-code/index.js"
+    },
+    "./radio-group": {
+      "types": "./dist/components/radio-group/index.d.ts",
+      "svelte": "./dist/components/radio-group/index.js",
+      "default": "./dist/components/radio-group/index.js"
+    },
+    "./rating-group": {
+      "types": "./dist/components/rating-group/index.d.ts",
+      "svelte": "./dist/components/rating-group/index.js",
+      "default": "./dist/components/rating-group/index.js"
+    },
+    "./scroll-area": {
+      "types": "./dist/components/scroll-area/index.d.ts",
+      "svelte": "./dist/components/scroll-area/index.js",
+      "default": "./dist/components/scroll-area/index.js"
+    },
+    "./segment-group": {
+      "types": "./dist/components/segment-group/index.d.ts",
+      "svelte": "./dist/components/segment-group/index.js",
+      "default": "./dist/components/segment-group/index.js"
+    },
     "./select": {
       "types": "./dist/components/select/index.d.ts",
       "svelte": "./dist/components/select/index.js",
       "default": "./dist/components/select/index.js"
     },
+    "./signature-pad": {
+      "types": "./dist/components/signature-pad/index.d.ts",
+      "svelte": "./dist/components/signature-pad/index.js",
+      "default": "./dist/components/signature-pad/index.js"
+    },
+    "./slider": {
+      "types": "./dist/components/slider/index.d.ts",
+      "svelte": "./dist/components/slider/index.js",
+      "default": "./dist/components/slider/index.js"
+    },
+    "./splitter": {
+      "types": "./dist/components/splitter/index.d.ts",
+      "svelte": "./dist/components/splitter/index.js",
+      "default": "./dist/components/splitter/index.js"
+    },
+    "./steps": {
+      "types": "./dist/components/steps/index.d.ts",
+      "svelte": "./dist/components/steps/index.js",
+      "default": "./dist/components/steps/index.js"
+    },
+    "./switch": {
+      "types": "./dist/components/switch/index.d.ts",
+      "svelte": "./dist/components/switch/index.js",
+      "default": "./dist/components/switch/index.js"
+    },
+    "./tags-input": {
+      "types": "./dist/components/tags-input/index.d.ts",
+      "svelte": "./dist/components/tags-input/index.js",
+      "default": "./dist/components/tags-input/index.js"
+    },
+    "./tabs": {
+      "types": "./dist/components/tabs/index.d.ts",
+      "svelte": "./dist/components/tabs/index.js",
+      "default": "./dist/components/tabs/index.js"
+    },
+    "./timer": {
+      "types": "./dist/components/timer/index.d.ts",
+      "svelte": "./dist/components/timer/index.js",
+      "default": "./dist/components/timer/index.js"
+    },
+    "./toast": {
+      "types": "./dist/components/toast/index.d.ts",
+      "svelte": "./dist/components/toast/index.js",
+      "default": "./dist/components/toast/index.js"
+    },
+    "./toggle": {
+      "types": "./dist/components/toggle/index.d.ts",
+      "svelte": "./dist/components/toggle/index.js",
+      "default": "./dist/components/toggle/index.js"
+    },
+    "./toggle-group": {
+      "types": "./dist/components/toggle-group/index.d.ts",
+      "svelte": "./dist/components/toggle-group/index.js",
+      "default": "./dist/components/toggle-group/index.js"
+    },
+    "./tooltip": {
+      "types": "./dist/components/tooltip/index.d.ts",
+      "svelte": "./dist/components/tooltip/index.js",
+      "default": "./dist/components/tooltip/index.js"
+    },
+    "./tour": {
+      "types": "./dist/components/tour/index.d.ts",
+      "svelte": "./dist/components/tour/index.js",
+      "default": "./dist/components/tour/index.js"
+    },
     "./tree-view": {
       "types": "./dist/components/tree-view/index.d.ts",
       "svelte": "./dist/components/tree-view/index.js",
@@ -225,7 +325,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@sprawlify/primitives": "0.0.47"
+    "@sprawlify/primitives": "0.0.49"
   },
   "peerDependencies": {
     "svelte": "^5.0.0"