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

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

import {
  splitRenderStrategyProps
} from "./NEBB7COJ.jsx";
import {
  createSplitProps
} from "./6WEDGJKQ.jsx";
import {
  ark
} from "./UFYZ7HLU.jsx";
import {
  useLocaleContext
} from "./YUC6JE7K.jsx";
import {
  useEnvironmentContext
} from "./E2L62MKC.jsx";
import {
  createContext
} from "./TVCIHLER.jsx";
import {
  runIfFn
} from "./KGOB2IMX.jsx";
import {
  __export
} from "./7IUG3E2V.jsx";

// src/components/collapsible/collapsible-content.tsx
import { mergeProps } from "@zag-js/solid";
import { Show } from "solid-js";

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

// src/components/collapsible/collapsible-content.tsx
var CollapsibleContent = (props) => {
  const api = useCollapsibleContext();
  const mergedProps = mergeProps(() => api().getContentProps(), props);
  return <Show when={!api().unmounted}>
      <ark.div {...mergedProps} />
    </Show>;
};

// src/components/collapsible/collapsible-context.tsx
var CollapsibleContext = (props) => props.children(useCollapsibleContext());

// src/components/collapsible/collapsible-root.tsx
import { mergeProps as mergeProps2 } from "@zag-js/solid";

// src/components/collapsible/use-collapsible.ts
import * as collapsible from "@zag-js/collapsible";
import { normalizeProps, useMachine } from "@zag-js/solid";
import { createEffect, createMemo, createSignal, createUniqueId } from "solid-js";
var useCollapsible = (props = {}) => {
  const id = createUniqueId();
  const locale = useLocaleContext();
  const environment = useEnvironmentContext();
  const [renderStrategyProps, collapsibleProps] = splitRenderStrategyProps(runIfFn(props));
  const machineProps = createMemo(() => ({
    id,
    dir: locale().dir,
    getRootNode: environment().getRootNode,
    ...collapsibleProps
  }));
  const service = useMachine(collapsible.machine, machineProps);
  const [wasVisible, setWasVisible] = createSignal(false);
  createEffect(() => {
    const isPresent = api().visible;
    if (isPresent) setWasVisible(true);
  });
  const api = createMemo(() => collapsible.connect(service, normalizeProps));
  return createMemo(() => ({
    ...api(),
    unmounted: !api().visible && !wasVisible() && renderStrategyProps.lazyMount || renderStrategyProps.unmountOnExit && !api().visible && wasVisible()
  }));
};

// src/components/collapsible/collapsible-root.tsx
var CollapsibleRoot = (props) => {
  const [useCollapsibleProps, localProps] = createSplitProps()(props, [
    "defaultOpen",
    "disabled",
    "id",
    "ids",
    "lazyMount",
    "onExitComplete",
    "onOpenChange",
    "open",
    "unmountOnExit"
  ]);
  const api = useCollapsible(useCollapsibleProps);
  const mergedProps = mergeProps2(() => api().getRootProps(), localProps);
  return <CollapsibleProvider value={api}>
      <ark.div {...mergedProps} />
    </CollapsibleProvider>;
};

// src/components/collapsible/collapsible-root-provider.tsx
import { mergeProps as mergeProps3 } from "@zag-js/solid";
var CollapsibleRootProvider = (props) => {
  const [{ value: collapsible2 }, localProps] = createSplitProps()(props, ["value"]);
  const mergedProps = mergeProps3(() => collapsible2().getRootProps(), localProps);
  return <CollapsibleProvider value={collapsible2}>
      <ark.div {...mergedProps} />
    </CollapsibleProvider>;
};

// src/components/collapsible/collapsible-trigger.tsx
import { mergeProps as mergeProps4 } from "@zag-js/solid";
var CollapsibleTrigger = (props) => {
  const api = useCollapsibleContext();
  const mergedProps = mergeProps4(() => api().getTriggerProps(), props);
  return <ark.button {...mergedProps} />;
};

// src/components/collapsible/collapsible-indicator.tsx
import { mergeProps as mergeProps5 } from "@zag-js/solid";
var CollapsibleIndicator = (props) => {
  const collapsible2 = useCollapsibleContext();
  const mergedProps = mergeProps5(() => collapsible2().getIndicatorProps(), props);
  return <ark.div {...mergedProps} />;
};

// src/components/collapsible/collapsible.anatomy.ts
import { anatomy } from "@zag-js/collapsible";

// src/components/collapsible/collapsible.ts
var collapsible_exports = {};
__export(collapsible_exports, {
  Content: () => CollapsibleContent,
  Context: () => CollapsibleContext,
  Indicator: () => CollapsibleIndicator,
  Root: () => CollapsibleRoot,
  RootProvider: () => CollapsibleRootProvider,
  Trigger: () => CollapsibleTrigger
});

export {
  useCollapsibleContext,
  CollapsibleContent,
  CollapsibleContext,
  useCollapsible,
  CollapsibleRoot,
  CollapsibleRootProvider,
  CollapsibleTrigger,
  CollapsibleIndicator,
  anatomy,
  collapsible_exports
};