UNPKG

@ark-ui/solid

Version:

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

113 lines (101 loc) 3.23 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/avatar/use-avatar-context.ts var [AvatarProvider, useAvatarContext] = createContext({ hookName: "useAvatarContext", providerName: "<AvatarProvider />" }); // src/components/avatar/avatar-context.tsx var AvatarContext = (props) => props.children(useAvatarContext()); // src/components/avatar/avatar-fallback.tsx import { mergeProps } from "@zag-js/solid"; var AvatarFallback = (props) => { const context = useAvatarContext(); const mergedProps = mergeProps(() => context().getFallbackProps(), props); return <ark.span {...mergedProps} />; }; // src/components/avatar/avatar-image.tsx import { mergeProps as mergeProps2 } from "@zag-js/solid"; var AvatarImage = (props) => { const context = useAvatarContext(); const mergedProps = mergeProps2(() => context().getImageProps(), props); return <ark.img {...mergedProps} />; }; // src/components/avatar/avatar-root.tsx import { mergeProps as mergeProps3 } from "@zag-js/solid"; // src/components/avatar/use-avatar.ts import * as avatar from "@zag-js/avatar"; import { normalizeProps, useMachine } from "@zag-js/solid"; import { createMemo, createUniqueId } from "solid-js"; var useAvatar = (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(avatar.machine, machineProps); return createMemo(() => avatar.connect(service, normalizeProps)); }; // src/components/avatar/avatar-root.tsx var AvatarRoot = (props) => { const [useAvatarProps, localProps] = createSplitProps()(props, ["id", "ids", "onStatusChange"]); const context = useAvatar(useAvatarProps); const mergedProps = mergeProps3(() => context().getRootProps(), localProps); return <AvatarProvider value={context}> <ark.div {...mergedProps} /> </AvatarProvider>; }; // src/components/avatar/avatar-root-provider.tsx import { mergeProps as mergeProps4 } from "@zag-js/solid"; var AvatarRootProvider = (props) => { const [{ value: avatar2 }, localProps] = createSplitProps()(props, ["value"]); const mergedProps = mergeProps4(() => avatar2().getRootProps(), localProps); return <AvatarProvider value={avatar2}> <ark.div {...mergedProps} /> </AvatarProvider>; }; // src/components/avatar/avatar.anatomy.ts import { anatomy } from "@zag-js/avatar"; // src/components/avatar/avatar.ts var avatar_exports = {}; __export(avatar_exports, { Context: () => AvatarContext, Fallback: () => AvatarFallback, Image: () => AvatarImage, Root: () => AvatarRoot, RootProvider: () => AvatarRootProvider }); export { useAvatarContext, AvatarContext, AvatarFallback, AvatarImage, useAvatar, AvatarRoot, AvatarRootProvider, anatomy, avatar_exports };