@fidely-ui/react
Version:
Fidely UI is a modern, beautifully crafted React design system powered by Ark UI and Panda CSS, delivering accessible and themeable components for building exceptional web apps
13 lines (12 loc) • 813 B
JavaScript
'use client';
import { PinInput as ArkPinInput } from '@ark-ui/react/pin-input';
import { pinInput, } from '@fidely-ui/styled-system/recipes';
import { makeStyleContext } from '../../system/make-style-context';
const { withSlotProvider, withSlotContext } = makeStyleContext(pinInput);
export const PinInputRootProvider = withSlotProvider(ArkPinInput.RootProvider, 'root');
export const PinInputRoot = withSlotProvider(ArkPinInput.Root, 'root', { forwardProps: ['mask'] });
export const PinInputLabel = withSlotContext(ArkPinInput.Label, 'label');
export const PinInputControl = withSlotContext(ArkPinInput.Control, 'control');
export const PinInputInput = withSlotContext(ArkPinInput.Input, 'input');
export const PinInputHiddenInput = ArkPinInput.HiddenInput;
export const PinInputContext = ArkPinInput.Context;