@ark-ui/solid 2.1.0 → 2.1.1

package/esm/index.js

@@ -1,5 +1,5 @@
 import { createComponent, Dynamic, mergeProps, memo, use, template, spread, insert, effect } from 'solid-js/web';
-import { createContext as createContext$1, useContext, splitProps, createSignal, createMemo, createEffect, Show, createUniqueId, Index, children, onCleanup } from 'solid-js';
+import { createContext as createContext$1, useContext, splitProps, createSignal, createMemo, createEffect, Show, createUniqueId, children, Index, onCleanup } from 'solid-js';
 import { useMachine, normalizeProps, mergeProps as mergeProps$1, useActor } from '@zag-js/solid';
 import * as presence from '@zag-js/presence';
 import * as accordion$1 from '@zag-js/accordion';
@@ -7,6 +7,7 @@ import * as avatar$1 from '@zag-js/avatar';
 import { carouselAnatomy, colorPickerAnatomy, datePickerAnatomy, segmentGroupAnatomy, selectAnatomy, treeViewAnatomy } from '@ark-ui/anatomy';
 import * as carousel$1 from '@zag-js/carousel';
 import * as checkbox$1 from '@zag-js/checkbox';
+import * as clipboard$1 from '@zag-js/clipboard';
 import * as colorPicker$1 from '@zag-js/color-picker';
 import * as combobox$1 from '@zag-js/combobox';
 import * as datePicker$1 from '@zag-js/date-picker';
@@ -14,6 +15,7 @@ import * as dialog$1 from '@zag-js/dialog';
 import * as editable$1 from '@zag-js/editable';
 import * as fileUpload$1 from '@zag-js/file-upload';
 import * as hoverCard$1 from '@zag-js/hover-card';
+import { trackLocale, isRTL } from '@zag-js/i18n-utils';
 import * as menu$1 from '@zag-js/menu';
 import * as numberInput$1 from '@zag-js/number-input';
 import * as pagination$1 from '@zag-js/pagination';
@@ -485,6 +487,98 @@ var checkbox = /*#__PURE__*/Object.freeze({
   Root: CheckboxRoot
 });
 
+const [ClipboardProvider, useClipboardContext] = createContext({
+  hookName: 'useClipboardContext',
+  providerName: '<ClipboardProvider />'
+});
+
+const ClipboardControl = props => {
+  const api = useClipboardContext();
+  const mergedProps = mergeProps$1(() => api().controlProps, props);
+  return createComponent(ark.div, mergedProps);
+};
+
+const ClipboardIndicator = props => {
+  const [indicatorProps, localProps] = createSplitProps()(props, ['copied']);
+  const api = useClipboardContext();
+  const mergedProps = mergeProps$1(api().getIndicatorProps({
+    copied: api().isCopied
+  }), localProps);
+  const getChildren = children(() => localProps.children);
+  return createComponent(ark.div, mergeProps(mergedProps, {
+    get children() {
+      return createComponent(Show, {
+        get when() {
+          return api().isCopied;
+        },
+        get fallback() {
+          return getChildren();
+        },
+        get children() {
+          return indicatorProps.copied;
+        }
+      });
+    }
+  }));
+};
+
+const ClipboardInput = props => {
+  const api = useClipboardContext();
+  const mergedProps = mergeProps$1(() => api().inputProps, props);
+  return createComponent(ark.input, mergedProps);
+};
+
+const ClipboardLabel = props => {
+  const api = useClipboardContext();
+  const mergedProps = mergeProps$1(() => api().labelProps, props);
+  return createComponent(ark.label, mergedProps);
+};
+
+const useClipboard = props => {
+  const getRootNode = useEnvironmentContext();
+  const context = mergeProps$1({
+    id: createUniqueId(),
+    getRootNode
+  }, props);
+  const [state, send] = useMachine(clipboard$1.machine(context), {
+    context
+  });
+  return createMemo(() => clipboard$1.connect(state, send, normalizeProps));
+};
+
+const ClipboardRoot = props => {
+  const [useClipboardProps, localProps] = createSplitProps()(props, ['getRootNode', 'id', 'ids', 'value', 'timeout', 'onCopyStatusChange']);
+  const api = useClipboard(useClipboardProps);
+  const mergedProps = mergeProps$1(() => api().rootProps, localProps);
+  const getChildren = () => runIfFn(localProps.children, api);
+  return createComponent(ClipboardProvider, {
+    value: api,
+    get children() {
+      return createComponent(ark.div, mergeProps(mergedProps, {
+        get children() {
+          return getChildren();
+        }
+      }));
+    }
+  });
+};
+
+const ClipboardTrigger = props => {
+  const api = useClipboardContext();
+  const mergedProps = mergeProps$1(() => api().triggerProps, props);
+  return createComponent(ark.button, mergedProps);
+};
+
+var clipboard = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Control: ClipboardControl,
+  Indicator: ClipboardIndicator,
+  Input: ClipboardInput,
+  Label: ClipboardLabel,
+  Root: ClipboardRoot,
+  Trigger: ClipboardTrigger
+});
+
 const [ColorPickerAreaProvider, useColorPickerAreaContext] = createContext({
   hookName: 'useColorPickerAreaContext',
   providerName: '<ColorPickerAreaProvider />'
@@ -1768,6 +1862,42 @@ var hoverCard = /*#__PURE__*/Object.freeze({
   Trigger: HoverCardTrigger
 });
 
+const [LocaleContextProvider, useLocaleContext] = createContext({
+  hookName: 'useEnvironmentContext',
+  providerName: '<EnvironmentProvider />',
+  strict: false,
+  defaultValue: () => ({
+    dir: 'ltr',
+    locale: 'en-US'
+  })
+});
+
+const LocaleProvider = props => {
+  const [localeProps, restProps] = splitProps(props, ['locale', 'defaultLocale']);
+  const [locale, setLocale] = createSignal(localeProps.defaultLocale || localeProps.locale || 'en-US');
+  const getRootNode = useEnvironmentContext();
+  createEffect(() => {
+    const cleanup = trackLocale({
+      locale: localeProps.locale,
+      getRootNode,
+      onLocaleChange(locale) {
+        setLocale(locale.locale);
+      }
+    });
+    onCleanup(cleanup);
+  });
+  const context = createMemo(() => ({
+    locale: locale(),
+    dir: isRTL(locale()) ? 'rtl' : 'ltr'
+  }));
+  return createComponent(LocaleContextProvider, {
+    value: context,
+    get children() {
+      return restProps.children;
+    }
+  });
+};
+
 const [MenuProvider, useMenuContext] = createContext({
   hookName: 'useMenuContext',
   providerName: '<MenuProvider />',
@@ -3728,5 +3858,5 @@ var treeView = /*#__PURE__*/Object.freeze({
   Tree: TreeViewTree
 });
 
-export { accordion as Accordion, AccordionItem, AccordionItemContent, AccordionItemIndicator, AccordionItemTrigger, AccordionRoot, avatar as Avatar, AvatarFallback, AvatarImage, AvatarRoot, carousel as Carousel, CarouselControl, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup, CarouselNextTrigger, CarouselPrevTrigger, CarouselRoot, CarouselViewport, checkbox as Checkbox, CheckboxControl, CheckboxIndicator, CheckboxLabel, CheckboxRoot, colorPicker as ColorPicker, ColorPickerArea, ColorPickerAreaBackground, ColorPickerAreaThumb, ColorPickerChannelInput, ColorPickerChannelSlider, ColorPickerChannelSliderThumb, ColorPickerChannelSliderTrack, ColorPickerContent, ColorPickerControl, ColorPickerEyeDropperTrigger, ColorPickerFormatSelect, ColorPickerFormatTrigger, ColorPickerLabel, ColorPickerPositioner, ColorPickerRoot, ColorPickerSwatch, ColorPickerSwatchGroup, ColorPickerSwatchIndicator, ColorPickerSwatchTrigger, ColorPickerTransparencyGrid, ColorPickerTrigger, ColorPickerValueText, ColorPickerView, combobox as Combobox, ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxItemGroup, ComboboxItemGroupLabel, ComboboxItemIndicator, ComboboxItemText, ComboboxLabel, ComboboxPositioner, ComboboxRoot, ComboboxTrigger, datePicker as DatePicker, DatePickerClearTrigger, DatePickerContent, DatePickerControl, DatePickerInput, DatePickerLabel, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerPositioner, DatePickerPresetTrigger, DatePickerPrevTrigger, DatePickerRangeText, DatePickerRoot, DatePickerTable, DatePickerTableBody, DatePickerTableCell, DatePickerTableCellTrigger, DatePickerTableHead, DatePickerTableHeader, DatePickerTableRow, DatePickerTrigger, DatePickerView, DatePickerViewControl, DatePickerViewTrigger, DatePickerYearSelect, dialog as Dialog, DialogBackdrop, DialogCloseTrigger, DialogContent, DialogDescription, DialogPositioner, DialogRoot, DialogTitle, DialogTrigger, editable as Editable, EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableRoot, EditableSubmitTrigger, Environment, fileUpload as FileUpload, FileUploadDropzone, FileUploadItem, FileUploadItemDeleteTrigger, FileUploadItemGroup, FileUploadItemName, FileUploadItemPreview, FileUploadItemPreviewImage, FileUploadItemSizeText, FileUploadLabel, FileUploadRoot, FileUploadTrigger, hoverCard as HoverCard, HoverCardArrow, HoverCardArrowTip, HoverCardContent, HoverCardPositioner, HoverCardRoot, HoverCardTrigger, menu as Menu, MenuArrow, MenuArrowTip, MenuContent, MenuContextTrigger, MenuItem, MenuItemGroup, MenuItemGroupLabel, MenuOptionItem, MenuPositioner, MenuRoot, MenuSeparator, MenuTrigger, MenuTriggerItem, numberInput as NumberInput, NumberInputControl, NumberInputDecrementTrigger, NumberInputIncrementTrigger, NumberInputInput, NumberInputLabel, NumberInputRoot, NumberInputScrubber, pagination as Pagination, PaginationEllipsis, PaginationItem, PaginationNextTrigger, PaginationPrevTrigger, PaginationRoot, pinInput as PinInput, PinInputControl, PinInputInput, PinInputLabel, PinInputRoot, popover as Popover, PopoverAnchor, PopoverArrow, PopoverArrowTip, PopoverCloseTrigger, PopoverContent, PopoverDescription, PopoverIndicator, PopoverPositioner, PopoverRoot, PopoverTitle, PopoverTrigger, Presence, PresencePropsProvider, PresenceProvider, progress as Progress, ProgressCircle, ProgressCircleRange, ProgressCircleTrack, ProgressLabel, ProgressRange, ProgressRoot, ProgressTrack, ProgressValueText, ProgressView, radioGroup as RadioGroup, RadioGroupIndicator, RadioGroupItem, RadioGroupItemControl, RadioGroupItemText, RadioGroupLabel, RadioGroupRoot, ratingGroup as RatingGroup, RatingGroupControl, RatingGroupItem, RatingGroupLabel, RatingGroupRoot, segmentGroup as SegmentGroup, SegmentGroupIndicator, SegmentGroupItem, SegmentGroupItemControl, SegmentGroupItemText, SegmentGroupLabel, SegmentGroupRoot, select as Select, SelectClearTrigger, SelectContent, SelectControl, SelectIndicator, SelectItem, SelectItemGroup, SelectItemGroupLabel, SelectItemIndicator, SelectItemText, SelectLabel, SelectPositioner, SelectRoot, SelectTrigger, SelectValueText, slider as Slider, SliderControl, SliderLabel, SliderMarker, SliderMarkerGroup, SliderRange, SliderRoot, SliderThumb, SliderTrack, SliderValueText, splitter as Splitter, SplitterPanel, SplitterResizeTrigger, SplitterRoot, _switch as Switch, SwitchControl, SwitchLabel, SwitchRoot, SwitchThumb, TabContent, TabIndicator, TabList, TabTrigger, tabs as Tabs, TabsRoot, tagsInput as TagsInput, TagsInputClearTrigger, TagsInputControl, TagsInputInput, TagsInputItem, TagsInputItemDeleteTrigger, TagsInputItemInput, TagsInputItemPreview, TagsInputItemText, TagsInputLabel, TagsInputRoot, toast as Toast, ToastCloseTrigger, ToastDescription, ToastGroup, ToastRoot, ToastTitle, toggleGroup as ToggleGroup, ToggleGroupItem, ToggleGroupRoot, tooltip as Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipRoot, TooltipTrigger, treeView as TreeView, TreeViewBranch, TreeViewBranchContent, TreeViewBranchControl, TreeViewBranchIndicator, TreeViewBranchText, TreeViewBranchTrigger, TreeViewItem, TreeViewItemIndicator, TreeViewItemText, TreeViewLabel, TreeViewRoot, TreeViewTree, ark, createToaster, splitPresenceProps, useAccordionContext, useAccordionItemContext, useAvatarContext, useCarouselContext, useCheckboxContext, useColorPickerAreaContext, useColorPickerChannelSliderContext, useColorPickerContext, useComboboxContext, useDatePickerContext, useDatePickerTableCellContext, useDatePickerTableContext, useDatePickerViewContext, useDialogContext, useEditableContext, useEnvironmentContext, useFileUploadContext, useHoverCardContext, useMenuContext, useNumberInputContext, usePaginationContext, usePinInputContext, usePopoverContext, usePresence, usePresenceContext, usePresencePropsContext, useProgressContext, useRadioGroupContext, useRadioGroupItemContext, useRatingGroupContext, useRatingGroupItemContext, useSegmentGroupContext, useSegmentGroupItemContext, useSelectContext, useSelectItemContext, useSliderContext, useSplitterContext, useSwitchContext, useTabsContext, useTagsInputContext, useTagsInputItemContext, useToggleGroupContext, useTooltipContext, useTreeViewContext, withAsProp };
+export { accordion as Accordion, AccordionItem, AccordionItemContent, AccordionItemIndicator, AccordionItemTrigger, AccordionRoot, avatar as Avatar, AvatarFallback, AvatarImage, AvatarRoot, carousel as Carousel, CarouselControl, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup, CarouselNextTrigger, CarouselPrevTrigger, CarouselRoot, CarouselViewport, checkbox as Checkbox, CheckboxControl, CheckboxIndicator, CheckboxLabel, CheckboxRoot, clipboard as Clipboard, ClipboardControl, ClipboardIndicator, ClipboardInput, ClipboardLabel, ClipboardRoot, ClipboardTrigger, colorPicker as ColorPicker, ColorPickerArea, ColorPickerAreaBackground, ColorPickerAreaThumb, ColorPickerChannelInput, ColorPickerChannelSlider, ColorPickerChannelSliderThumb, ColorPickerChannelSliderTrack, ColorPickerContent, ColorPickerControl, ColorPickerEyeDropperTrigger, ColorPickerFormatSelect, ColorPickerFormatTrigger, ColorPickerLabel, ColorPickerPositioner, ColorPickerRoot, ColorPickerSwatch, ColorPickerSwatchGroup, ColorPickerSwatchIndicator, ColorPickerSwatchTrigger, ColorPickerTransparencyGrid, ColorPickerTrigger, ColorPickerValueText, ColorPickerView, combobox as Combobox, ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItem, ComboboxItemGroup, ComboboxItemGroupLabel, ComboboxItemIndicator, ComboboxItemText, ComboboxLabel, ComboboxPositioner, ComboboxRoot, ComboboxTrigger, datePicker as DatePicker, DatePickerClearTrigger, DatePickerContent, DatePickerControl, DatePickerInput, DatePickerLabel, DatePickerMonthSelect, DatePickerNextTrigger, DatePickerPositioner, DatePickerPresetTrigger, DatePickerPrevTrigger, DatePickerRangeText, DatePickerRoot, DatePickerTable, DatePickerTableBody, DatePickerTableCell, DatePickerTableCellTrigger, DatePickerTableHead, DatePickerTableHeader, DatePickerTableRow, DatePickerTrigger, DatePickerView, DatePickerViewControl, DatePickerViewTrigger, DatePickerYearSelect, dialog as Dialog, DialogBackdrop, DialogCloseTrigger, DialogContent, DialogDescription, DialogPositioner, DialogRoot, DialogTitle, DialogTrigger, editable as Editable, EditableArea, EditableCancelTrigger, EditableControl, EditableEditTrigger, EditableInput, EditableLabel, EditablePreview, EditableRoot, EditableSubmitTrigger, Environment, fileUpload as FileUpload, FileUploadDropzone, FileUploadItem, FileUploadItemDeleteTrigger, FileUploadItemGroup, FileUploadItemName, FileUploadItemPreview, FileUploadItemPreviewImage, FileUploadItemSizeText, FileUploadLabel, FileUploadRoot, FileUploadTrigger, hoverCard as HoverCard, HoverCardArrow, HoverCardArrowTip, HoverCardContent, HoverCardPositioner, HoverCardRoot, HoverCardTrigger, LocaleProvider, menu as Menu, MenuArrow, MenuArrowTip, MenuContent, MenuContextTrigger, MenuItem, MenuItemGroup, MenuItemGroupLabel, MenuOptionItem, MenuPositioner, MenuRoot, MenuSeparator, MenuTrigger, MenuTriggerItem, numberInput as NumberInput, NumberInputControl, NumberInputDecrementTrigger, NumberInputIncrementTrigger, NumberInputInput, NumberInputLabel, NumberInputRoot, NumberInputScrubber, pagination as Pagination, PaginationEllipsis, PaginationItem, PaginationNextTrigger, PaginationPrevTrigger, PaginationRoot, pinInput as PinInput, PinInputControl, PinInputInput, PinInputLabel, PinInputRoot, popover as Popover, PopoverAnchor, PopoverArrow, PopoverArrowTip, PopoverCloseTrigger, PopoverContent, PopoverDescription, PopoverIndicator, PopoverPositioner, PopoverRoot, PopoverTitle, PopoverTrigger, Presence, PresencePropsProvider, PresenceProvider, progress as Progress, ProgressCircle, ProgressCircleRange, ProgressCircleTrack, ProgressLabel, ProgressRange, ProgressRoot, ProgressTrack, ProgressValueText, ProgressView, radioGroup as RadioGroup, RadioGroupIndicator, RadioGroupItem, RadioGroupItemControl, RadioGroupItemText, RadioGroupLabel, RadioGroupRoot, ratingGroup as RatingGroup, RatingGroupControl, RatingGroupItem, RatingGroupLabel, RatingGroupRoot, segmentGroup as SegmentGroup, SegmentGroupIndicator, SegmentGroupItem, SegmentGroupItemControl, SegmentGroupItemText, SegmentGroupLabel, SegmentGroupRoot, select as Select, SelectClearTrigger, SelectContent, SelectControl, SelectIndicator, SelectItem, SelectItemGroup, SelectItemGroupLabel, SelectItemIndicator, SelectItemText, SelectLabel, SelectPositioner, SelectRoot, SelectTrigger, SelectValueText, slider as Slider, SliderControl, SliderLabel, SliderMarker, SliderMarkerGroup, SliderRange, SliderRoot, SliderThumb, SliderTrack, SliderValueText, splitter as Splitter, SplitterPanel, SplitterResizeTrigger, SplitterRoot, _switch as Switch, SwitchControl, SwitchLabel, SwitchRoot, SwitchThumb, TabContent, TabIndicator, TabList, TabTrigger, tabs as Tabs, TabsRoot, tagsInput as TagsInput, TagsInputClearTrigger, TagsInputControl, TagsInputInput, TagsInputItem, TagsInputItemDeleteTrigger, TagsInputItemInput, TagsInputItemPreview, TagsInputItemText, TagsInputLabel, TagsInputRoot, toast as Toast, ToastCloseTrigger, ToastDescription, ToastGroup, ToastRoot, ToastTitle, toggleGroup as ToggleGroup, ToggleGroupItem, ToggleGroupRoot, tooltip as Tooltip, TooltipArrow, TooltipArrowTip, TooltipContent, TooltipPositioner, TooltipRoot, TooltipTrigger, treeView as TreeView, TreeViewBranch, TreeViewBranchContent, TreeViewBranchControl, TreeViewBranchIndicator, TreeViewBranchText, TreeViewBranchTrigger, TreeViewItem, TreeViewItemIndicator, TreeViewItemText, TreeViewLabel, TreeViewRoot, TreeViewTree, ark, createToaster, splitPresenceProps, useAccordionContext, useAccordionItemContext, useAvatarContext, useCarouselContext, useCheckboxContext, useClipboardContext, useColorPickerAreaContext, useColorPickerChannelSliderContext, useColorPickerContext, useComboboxContext, useDatePickerContext, useDatePickerTableCellContext, useDatePickerTableContext, useDatePickerViewContext, useDialogContext, useEditableContext, useEnvironmentContext, useFileUploadContext, useHoverCardContext, useLocaleContext, useMenuContext, useNumberInputContext, usePaginationContext, usePinInputContext, usePopoverContext, usePresence, usePresenceContext, usePresencePropsContext, useProgressContext, useRadioGroupContext, useRadioGroupItemContext, useRatingGroupContext, useRatingGroupItemContext, useSegmentGroupContext, useSegmentGroupItemContext, useSelectContext, useSelectItemContext, useSliderContext, useSplitterContext, useSwitchContext, useTabsContext, useTagsInputContext, useTagsInputItemContext, useToggleGroupContext, useTooltipContext, useTreeViewContext, withAsProp };
 //# sourceMappingURL=index.js.map