UNPKG

@ark-ui/solid

Version:

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

116 lines (105 loc) 3.42 kB
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/toggle-group/use-toggle-group-context.ts var [ToggleGroupProvider, useToggleGroupContext] = createContext({ hookName: "useToggleGroupContext", providerName: "<ToggleGroupProvider />" }); // src/components/toggle-group/toggle-group-context.tsx var ToggleGroupContext = (props) => props.children(useToggleGroupContext()); // src/components/toggle-group/toggle-group-item.tsx import { mergeProps } from "@zag-js/solid"; var ToggleGroupItem = (props) => { const [toggleProps, restProps] = createSplitProps()(props, ["value", "disabled"]); const api = useToggleGroupContext(); const mergedProps = mergeProps(() => api().getItemProps(toggleProps), restProps); return <ark.button {...mergedProps} />; }; // src/components/toggle-group/toggle-group-root.tsx import { mergeProps as mergeProps2 } from "@zag-js/solid"; // src/components/toggle-group/use-toggle-group.ts import { normalizeProps, useMachine } from "@zag-js/solid"; import * as toggleGroup from "@zag-js/toggle-group"; import { createMemo, createUniqueId } from "solid-js"; var useToggleGroup = (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(toggleGroup.machine, machineProps); return createMemo(() => toggleGroup.connect(service, normalizeProps)); }; // src/components/toggle-group/toggle-group-root.tsx var ToggleGroupRoot = (props) => { const [useToggleGroupProps, restProps] = createSplitProps()(props, [ "defaultValue", "deselectable", "disabled", "id", "ids", "loopFocus", "multiple", "onValueChange", "orientation", "rovingFocus", "value" ]); const api = useToggleGroup(useToggleGroupProps); const mergedProps = mergeProps2(() => api().getRootProps(), restProps); return <ToggleGroupProvider value={api}> <ark.div {...mergedProps} /> </ToggleGroupProvider>; }; // src/components/toggle-group/toggle-group-root-provider.tsx import { mergeProps as mergeProps3 } from "@zag-js/solid"; var ToggleGroupRootProvider = (props) => { const [{ value: toggleGroup2 }, localProps] = createSplitProps()(props, ["value"]); const mergedProps = mergeProps3(() => toggleGroup2().getRootProps(), localProps); return <ToggleGroupProvider value={toggleGroup2}> <ark.div {...mergedProps} /> </ToggleGroupProvider>; }; // src/components/toggle-group/toggle-group.anatomy.ts import { anatomy } from "@zag-js/toggle-group"; // src/components/toggle-group/toggle-group.ts var toggle_group_exports = {}; __export(toggle_group_exports, { Context: () => ToggleGroupContext, Item: () => ToggleGroupItem, Root: () => ToggleGroupRoot, RootProvider: () => ToggleGroupRootProvider }); export { useToggleGroupContext, ToggleGroupContext, ToggleGroupItem, useToggleGroup, ToggleGroupRoot, ToggleGroupRootProvider, anatomy, toggle_group_exports };