@ark-ui/solid/dist/chunk/HNIBOZUS.jsx

A collection of unstyled, accessible UI components for Solid, utilizing state machines for seamless interaction.

import {
  tourAnatomy
} from "./YNAVZVCW.jsx";
import {
  PresenceProvider,
  splitPresenceProps,
  usePresence,
  usePresenceContext
} from "./2P5Y3YCK.jsx";
import {
  composeRefs
} from "./PT2CJE3O.jsx";
import {
  RenderStrategyProvider,
  splitRenderStrategyProps,
  useRenderStrategyContext
} from "./VNMGX67M.jsx";
import {
  createSplitProps
} from "./6WEDGJKQ.jsx";
import {
  ark
} from "./UFYZ7HLU.jsx";
import {
  useEnvironmentContext
} from "./CGW54HAQ.jsx";
import {
  useLocaleContext
} from "./JFOWNFC7.jsx";
import {
  runIfFn
} from "./KGOB2IMX.jsx";
import {
  createContext
} from "./UZJJWJQM.jsx";
import {
  __export
} from "./7IUG3E2V.jsx";

// src/components/tour/tour-action-trigger.tsx
import { mergeProps } from "@zag-js/solid";

// src/components/tour/use-tour-context.ts
var [TourProvider, useTourContext] = createContext({
  hookName: "useTourContext",
  providerName: "<TourProvider />"
});

// src/components/tour/tour-action-trigger.tsx
var TourActionTrigger = (props) => {
  const [actionTriggerProps, localProps] = createSplitProps()(props, ["action"]);
  const tour2 = useTourContext();
  const mergedProps = mergeProps(() => tour2().getActionTriggerProps(actionTriggerProps), localProps);
  return <ark.button {...mergedProps}>{mergedProps.children || actionTriggerProps.action.label}</ark.button>;
};

// src/components/tour/tour-actions.tsx
var TourActions = (props) => {
  const tour2 = useTourContext();
  return props.children(() => tour2().step?.actions ?? []);
};

// src/components/tour/tour-arrow.tsx
import { mergeProps as mergeProps2 } from "@zag-js/solid";
import { Show } from "solid-js";
var TourArrow = (props) => {
  const tour2 = useTourContext();
  const mergedProps = mergeProps2(() => tour2().getArrowProps(), props);
  return <Show when={tour2().step?.arrow}>
      <ark.div {...mergedProps} />
    </Show>;
};

// src/components/tour/tour-arrow-tip.tsx
import { mergeProps as mergeProps3 } from "@zag-js/solid";
var TourArrowTip = (props) => {
  const tour2 = useTourContext();
  const mergedProps = mergeProps3(() => tour2().getArrowTipProps(), props);
  return <ark.div {...mergedProps} />;
};

// src/components/tour/tour-backdrop.tsx
import { mergeProps as mergeProps4 } from "@zag-js/solid";
import { Show as Show2 } from "solid-js";
var TourBackdrop = (props) => {
  const tour2 = useTourContext();
  const renderStrategyProps = useRenderStrategyContext();
  const presence = usePresence(mergeProps4(renderStrategyProps, () => ({ present: tour2().open })));
  const mergedProps = mergeProps4(
    () => tour2().getBackdropProps(),
    () => presence().presenceProps,
    props
  );
  return <Show2 when={!presence().unmounted}>
      <ark.div {...mergedProps} hidden={!tour2().step?.backdrop} ref={composeRefs(presence().ref, props.ref)} />
    </Show2>;
};

// src/components/tour/tour-close-trigger.tsx
import { mergeProps as mergeProps5 } from "@zag-js/solid";
var TourCloseTrigger = (props) => {
  const tour2 = useTourContext();
  const mergedProps = mergeProps5(() => tour2().getCloseTriggerProps(), props);
  return <ark.button {...mergedProps} />;
};

// src/components/tour/tour-content.tsx
import { mergeProps as mergeProps6 } from "@zag-js/solid";
import { Show as Show3 } from "solid-js";
var TourContent = (props) => {
  const tour2 = useTourContext();
  const renderStrategyProps = useRenderStrategyContext();
  const presence = usePresence(mergeProps6(renderStrategyProps, () => ({ present: tour2().open })));
  const mergedProps = mergeProps6(
    () => tour2().getContentProps(),
    () => presence().presenceProps,
    props
  );
  return <Show3 when={!presence().unmounted}>
      <ark.div {...mergedProps} ref={composeRefs(presence().ref, props.ref)} />
    </Show3>;
};

// src/components/tour/tour-context.tsx
var TourContext = (props) => props.children(useTourContext());

// src/components/tour/tour-control.tsx
import { mergeProps as mergeProps7 } from "@zag-js/solid";
var TourControl = (props) => {
  const mergedProps = mergeProps7(() => tourAnatomy.build().control.attrs, props);
  return <ark.div {...mergedProps} />;
};

// src/components/tour/tour-description.tsx
import { mergeProps as mergeProps8 } from "@zag-js/solid";
var TourDescription = (props) => {
  const tour2 = useTourContext();
  const mergedProps = mergeProps8(() => tour2().getDescriptionProps(), props);
  return <ark.div {...mergedProps}>{mergedProps.children || tour2().step?.description}</ark.div>;
};

// src/components/tour/tour-positioner.tsx
import { mergeProps as mergeProps9 } from "@zag-js/solid";
import { Show as Show4 } from "solid-js";
var TourPositioner = (props) => {
  const tour2 = useTourContext();
  const presence = usePresenceContext();
  const mergedProps = mergeProps9(() => tour2().getPositionerProps(), props);
  return <Show4 when={!presence().unmounted}>
      <ark.div {...mergedProps} />
    </Show4>;
};

// src/components/tour/tour-progress-text.tsx
import { mergeProps as mergeProps10 } from "@zag-js/solid";
var TourProgressText = (props) => {
  const tour2 = useTourContext();
  const mergedProps = mergeProps10(() => tour2().getProgressTextProps(), props);
  return <ark.div {...mergedProps}>{mergedProps.children || tour2().getProgressText()}</ark.div>;
};

// src/components/tour/tour-root.tsx
import { mergeProps as mergeProps11 } from "@zag-js/solid";
var TourRoot = (props) => {
  const [presenceProps, rootProps] = splitPresenceProps(props);
  const [renderStrategyProps] = splitRenderStrategyProps(presenceProps);
  const presence = usePresence(mergeProps11(presenceProps, () => ({ present: rootProps.tour().open })));
  return <TourProvider value={rootProps.tour}>
      <RenderStrategyProvider value={renderStrategyProps}>
        <PresenceProvider value={presence}>{rootProps.children}</PresenceProvider>
      </RenderStrategyProvider>
    </TourProvider>;
};

// src/components/tour/tour-spotlight.tsx
import { mergeProps as mergeProps12 } from "@zag-js/solid";
import { Show as Show5 } from "solid-js";
var TourSpotlight = (props) => {
  const tour2 = useTourContext();
  const renderStrategyProps = useRenderStrategyContext();
  const presenceApi = usePresence(mergeProps12(renderStrategyProps, () => ({ present: tour2().open })));
  const mergedProps = mergeProps12(
    () => tour2().getSpotlightProps(),
    () => presenceApi().presenceProps,
    props
  );
  return <Show5 when={!presenceApi().unmounted}>
      <ark.div
    {...mergedProps}
    hidden={!tour2().open || !tour2().step?.target?.()}
    ref={composeRefs(presenceApi().ref, props.ref)}
  />
    </Show5>;
};

// src/components/tour/tour-title.tsx
import { mergeProps as mergeProps13 } from "@zag-js/solid";
var TourTitle = (props) => {
  const tour2 = useTourContext();
  const mergedProps = mergeProps13(() => tour2().getTitleProps(), props);
  return <ark.h2 {...mergedProps}>{mergedProps.children || tour2().step?.title}</ark.h2>;
};

// src/components/tour/use-tour.ts
import { normalizeProps, useMachine } from "@zag-js/solid";
import * as tour from "@zag-js/tour";
import { createMemo, createUniqueId } from "solid-js";
var useTour = (props) => {
  const id = createUniqueId();
  const locale = useLocaleContext();
  const environment = useEnvironmentContext();
  const machineProps = createMemo(() => ({
    id,
    dir: locale().dir,
    getRootNode: environment().getRootNode,
    ...runIfFn(props)
  }));
  const service = useMachine(tour.machine, machineProps);
  return createMemo(() => tour.connect(service, normalizeProps));
};

// src/components/tour/tour.ts
var tour_exports = {};
__export(tour_exports, {
  ActionTrigger: () => TourActionTrigger,
  Actions: () => TourActions,
  Arrow: () => TourArrow,
  ArrowTip: () => TourArrowTip,
  Backdrop: () => TourBackdrop,
  CloseTrigger: () => TourCloseTrigger,
  Content: () => TourContent,
  Context: () => TourContext,
  Control: () => TourControl,
  Description: () => TourDescription,
  Positioner: () => TourPositioner,
  ProgressText: () => TourProgressText,
  Root: () => TourRoot,
  Spotlight: () => TourSpotlight,
  Title: () => TourTitle
});

export {
  useTourContext,
  TourActionTrigger,
  TourActions,
  TourArrow,
  TourArrowTip,
  TourBackdrop,
  TourCloseTrigger,
  TourContent,
  TourContext,
  TourControl,
  TourDescription,
  TourPositioner,
  TourProgressText,
  TourRoot,
  TourSpotlight,
  TourTitle,
  useTour,
  tour_exports
};