@ark-ui/solid/dist/chunk/M3S2UEA7.js

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

import { usePresenceContext, splitPresenceProps, usePresence, PresenceProvider } from './FW6EZLZL.js';
import { composeRefs } from './ROP6QZQ7.js';
import { splitRenderStrategyProps, RenderStrategyProvider, useRenderStrategyContext } from './GUFIKGZ6.js';
import { createSplitProps } from './ZMHI4GDJ.js';
import { ark } from './EPLBB4QN.js';
import { useEnvironmentContext } from './5QLLQM7E.js';
import { useLocaleContext } from './RVOPDSQY.js';
import { runIfFn } from './DT73WLR4.js';
import { createContext } from './THN5C4U6.js';
import { __export } from './ESLJRKWD.js';
import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
import { Show, createUniqueId, createMemo } from 'solid-js';
import * as bottomSheet from '@zag-js/bottom-sheet';

// src/components/bottom-sheet/use-bottom-sheet-context.ts
var [BottomSheetProvider, useBottomSheetContext] = createContext({
  hookName: "useBottomSheetContext",
  providerName: "<BottomSheetProvider />"
});

// src/components/bottom-sheet/bottom-sheet-backdrop.tsx
var BottomSheetBackdrop = (props) => {
  const bottomSheet2 = useBottomSheetContext();
  const renderStrategyProps = useRenderStrategyContext();
  const presence = usePresence(mergeProps(renderStrategyProps, () => ({
    present: bottomSheet2().open
  })));
  const mergedProps = mergeProps(() => bottomSheet2().getBackdropProps(), () => presence().presenceProps, props);
  return createComponent(Show, {
    get when() {
      return !presence().unmounted;
    },
    get children() {
      return createComponent(ark.div, mergeProps$1(mergedProps, {
        ref(r$) {
          var _ref$ = composeRefs(presence().ref, props.ref);
          typeof _ref$ === "function" && _ref$(r$);
        }
      }));
    }
  });
};
var BottomSheetCloseTrigger = (props) => {
  const context = useBottomSheetContext();
  const mergedProps = mergeProps(() => context().getCloseTriggerProps(), props);
  return createComponent(ark.button, mergedProps);
};
var BottomSheetContent = (props) => {
  const [contentProps, localProps] = createSplitProps()(props, ["draggable"]);
  const bottomSheet2 = useBottomSheetContext();
  const presence = usePresenceContext();
  const mergedProps = mergeProps(() => bottomSheet2().getContentProps({
    draggable: true,
    ...contentProps
  }), () => presence().presenceProps, localProps);
  return createComponent(Show, {
    get when() {
      return !presence().unmounted;
    },
    get children() {
      return createComponent(ark.div, mergeProps$1(mergedProps, {
        ref(r$) {
          var _ref$ = composeRefs(presence().ref, localProps.ref);
          typeof _ref$ === "function" && _ref$(r$);
        }
      }));
    }
  });
};

// src/components/bottom-sheet/bottom-sheet-context.tsx
var BottomSheetContext = (props) => props.children(useBottomSheetContext());
var BottomSheetGrabber = (props) => {
  const bottomSheet2 = useBottomSheetContext();
  const mergedProps = mergeProps(() => bottomSheet2().getGrabberProps(), props);
  return createComponent(ark.div, mergedProps);
};
var BottomSheetGrabberIndicator = (props) => {
  const bottomSheet2 = useBottomSheetContext();
  const mergedProps = mergeProps(() => bottomSheet2().getGrabberIndicatorProps(), props);
  return createComponent(ark.div, mergedProps);
};
var useBottomSheet = (props) => {
  const locale = useLocaleContext();
  const environment = useEnvironmentContext();
  const id = createUniqueId();
  const machineProps = createMemo(() => ({
    id,
    dir: locale().dir,
    getRootNode: environment().getRootNode,
    ...runIfFn(props)
  }));
  const service = useMachine(bottomSheet.machine, machineProps);
  return createMemo(() => bottomSheet.connect(service, normalizeProps));
};

// src/components/bottom-sheet/bottom-sheet-root.tsx
var BottomSheetRoot = (props) => {
  const [presenceProps, bottomSheetProps] = splitPresenceProps(props);
  const [renderStrategyProps] = splitRenderStrategyProps(presenceProps);
  const [useBottomSheetProps, localProps] = createSplitProps()(bottomSheetProps, ["id", "ids", "open", "defaultOpen", "onOpenChange", "closeOnInteractOutside", "closeOnEscape", "snapPoints", "swipeVelocityThreshold", "closeThreshold", "preventDragOnScroll", "activeSnapPoint", "defaultActiveSnapPoint", "onActiveSnapPointChange", "modal", "trapFocus", "restoreFocus", "preventScroll", "initialFocusEl", "finalFocusEl", "role", "onInteractOutside", "onEscapeKeyDown", "onPointerDownOutside", "onFocusOutside", "onRequestDismiss"]);
  const bottomSheet2 = useBottomSheet(useBottomSheetProps);
  const presence = usePresence(mergeProps(presenceProps, () => ({
    present: bottomSheet2().open
  })));
  return createComponent(BottomSheetProvider, {
    value: bottomSheet2,
    get children() {
      return createComponent(RenderStrategyProvider, {
        value: renderStrategyProps,
        get children() {
          return createComponent(PresenceProvider, {
            value: presence,
            get children() {
              return localProps.children;
            }
          });
        }
      });
    }
  });
};
var BottomSheetRootProvider = (props) => {
  const [presenceProps, bottomSheetProps] = splitPresenceProps(props);
  const [renderStrategyProps] = splitRenderStrategyProps(presenceProps);
  const presence = usePresence(mergeProps(() => ({
    present: bottomSheetProps.value().open
  }), presenceProps));
  return createComponent(BottomSheetProvider, {
    get value() {
      return bottomSheetProps.value;
    },
    get children() {
      return createComponent(RenderStrategyProvider, {
        value: renderStrategyProps,
        get children() {
          return createComponent(PresenceProvider, {
            value: presence,
            get children() {
              return bottomSheetProps.children;
            }
          });
        }
      });
    }
  });
};
var BottomSheetTitle = (props) => {
  const bottomSheet2 = useBottomSheetContext();
  const mergedProps = mergeProps(() => bottomSheet2().getTitleProps(), props);
  return createComponent(ark.h2, mergedProps);
};
var BottomSheetTrigger = (props) => {
  const bottomSheet2 = useBottomSheetContext();
  const presence = usePresenceContext();
  const mergedProps = mergeProps(() => bottomSheet2().getTriggerProps(), () => ({
    "aria-controls": presence().unmounted && null
  }), props);
  return createComponent(ark.button, mergedProps);
};

// src/components/bottom-sheet/bottom-sheet.ts
var bottom_sheet_exports = {};
__export(bottom_sheet_exports, {
  Backdrop: () => BottomSheetBackdrop,
  CloseTrigger: () => BottomSheetCloseTrigger,
  Content: () => BottomSheetContent,
  Context: () => BottomSheetContext,
  Grabber: () => BottomSheetGrabber,
  GrabberIndicator: () => BottomSheetGrabberIndicator,
  Root: () => BottomSheetRoot,
  RootProvider: () => BottomSheetRootProvider,
  Title: () => BottomSheetTitle,
  Trigger: () => BottomSheetTrigger
});

export { BottomSheetBackdrop, BottomSheetCloseTrigger, BottomSheetContent, BottomSheetContext, BottomSheetGrabber, BottomSheetGrabberIndicator, BottomSheetRoot, BottomSheetRootProvider, BottomSheetTitle, BottomSheetTrigger, bottom_sheet_exports, useBottomSheet, useBottomSheetContext };