UNPKG

@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

26 lines (25 loc) 1.76 kB
'use client'; import { Select as ArkSelect } from '@ark-ui/react/select'; import { select, } from '@fidely-ui/styled-system/recipes'; import { makeStyleContext } from '../../system/make-style-context'; const { withSlotProvider, withSlotContext } = makeStyleContext(select); export const SelectRootProvider = withSlotProvider(ArkSelect.RootProvider, 'root'); export const SelectRoot = withSlotProvider(ArkSelect.Root, 'root'); export const SelectControl = withSlotContext(ArkSelect.Control, 'control'); export const SelectContent = withSlotContext(ArkSelect.Content, 'content'); export const SelectClearTrigger = withSlotContext(ArkSelect.ClearTrigger, 'clearTrigger'); export const SelectTrigger = withSlotContext(ArkSelect.Trigger, 'trigger'); export const SelectIndicator = withSlotContext(ArkSelect.Indicator, 'indicator'); export const SelectLabel = withSlotContext(ArkSelect.Label, 'label'); export const SelectItem = withSlotContext(ArkSelect.Item, 'item'); export const SelectItemText = withSlotContext(ArkSelect.ItemText, 'itemText'); export const SelectItemGroup = withSlotContext(ArkSelect.ItemGroup, 'itemGroup'); export const SelectItemGroupLabel = withSlotContext(ArkSelect.ItemGroupLabel, 'itemGroupLabel'); export const SelectItemIndicator = withSlotContext(ArkSelect.ItemIndicator, 'itemIndicator'); export const SelectList = withSlotContext(ArkSelect.List, 'list'); export const SelectPositioner = withSlotContext(ArkSelect.Positioner, 'positioner'); export const SelectValueText = withSlotContext(ArkSelect.ValueText, 'valueText'); // -------------------- Context -------------------- export const SelectContext = ArkSelect.Context; export const SelectItemContext = ArkSelect.ItemContext; export const SelectHiddenSelect = ArkSelect.HiddenSelect;