@ark-ui/solid 0.1.0 → 0.3.0

package/dist/filter-props.cjs

@@ -0,0 +1,28 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const propTrap = require('./prop-trap.cjs');
+
+function filterProps(props, predicate) {
+  return new Proxy(
+    {
+      get(property) {
+        return property in props && predicate(property) ? props[property] : void 0;
+      },
+      has(property) {
+        return property in props && predicate(property);
+      },
+      keys() {
+        return Object.keys(props).filter(predicate);
+      }
+    },
+    propTrap.propTraps
+  );
+}
+function mapProps(props, mapper) {
+  return Object.fromEntries(Object.entries(props).map(([key, value]) => [key, mapper(key, value)]));
+}
+
+exports.filterProps = filterProps;
+exports.mapProps = mapProps;

package/dist/filter-props.d.ts

@@ -0,0 +1,2 @@
+export declare function filterProps<T extends object>(props: T, predicate: (key: keyof T) => boolean): T;
+export declare function mapProps(props: Record<string, unknown>, mapper: (key: string, value: unknown) => unknown): Record<string, unknown>;

package/dist/filter-props.mjs

@@ -0,0 +1,23 @@
+import { propTraps } from './prop-trap.mjs';
+
+function filterProps(props, predicate) {
+  return new Proxy(
+    {
+      get(property) {
+        return property in props && predicate(property) ? props[property] : void 0;
+      },
+      has(property) {
+        return property in props && predicate(property);
+      },
+      keys() {
+        return Object.keys(props).filter(predicate);
+      }
+    },
+    propTraps
+  );
+}
+function mapProps(props, mapper) {
+  return Object.fromEntries(Object.entries(props).map(([key, value]) => [key, mapper(key, value)]));
+}
+
+export { filterProps, mapProps };

package/dist/hover-card/hover-card-arrow-tip.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const hoverCardContext = require('./hover-card-context.cjs');
 
 const HoverCardArrowTip = props => {
   const hoverCard = hoverCardContext.useHoverCardContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => hoverCard().arrowTipProps, props));
+  const tipProps = solid.mergeProps(() => hoverCard().arrowTipProps, props);
+  return web.createComponent(factory.ark.div, tipProps);
 };
 
 exports.HoverCardArrowTip = HoverCardArrowTip;

package/dist/hover-card/hover-card-arrow-tip.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useHoverCardContext } from './hover-card-context.mjs';
 
 const HoverCardArrowTip = props => {
   const hoverCard = useHoverCardContext();
-  return createComponent(ark.div, mergeProps(() => hoverCard().arrowTipProps, props));
+  const tipProps = mergeProps(() => hoverCard().arrowTipProps, props);
+  return createComponent(ark.div, tipProps);
 };
 
 export { HoverCardArrowTip };

package/dist/hover-card/hover-card-arrow.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const hoverCardContext = require('./hover-card-context.cjs');
 
 const HoverCardArrow = props => {
   const hoverCard = hoverCardContext.useHoverCardContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => hoverCard().arrowProps, props));
+  const arrowProps = solid.mergeProps(() => hoverCard().arrowProps, props);
+  return web.createComponent(factory.ark.div, arrowProps);
 };
 
 exports.HoverCardArrow = HoverCardArrow;

package/dist/hover-card/hover-card-arrow.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useHoverCardContext } from './hover-card-context.mjs';
 
 const HoverCardArrow = props => {
   const hoverCard = useHoverCardContext();
-  return createComponent(ark.div, mergeProps(() => hoverCard().arrowProps, props));
+  const arrowProps = mergeProps(() => hoverCard().arrowProps, props);
+  return createComponent(ark.div, arrowProps);
 };
 
 export { HoverCardArrow };

package/dist/hover-card/hover-card-content.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const hoverCardContext = require('./hover-card-context.cjs');
 
 const HoverCardContent = props => {
   const hoverCard = hoverCardContext.useHoverCardContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => hoverCard().contentProps, props));
+  const contentProps = solid.mergeProps(() => hoverCard().contentProps, props);
+  return web.createComponent(factory.ark.div, contentProps);
 };
 
 exports.HoverCardContent = HoverCardContent;

package/dist/hover-card/hover-card-content.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useHoverCardContext } from './hover-card-context.mjs';
 
 const HoverCardContent = props => {
   const hoverCard = useHoverCardContext();
-  return createComponent(ark.div, mergeProps(() => hoverCard().contentProps, props));
+  const contentProps = mergeProps(() => hoverCard().contentProps, props);
+  return createComponent(ark.div, contentProps);
 };
 
 export { HoverCardContent };

package/dist/hover-card/hover-card-positioner.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const hoverCardContext = require('./hover-card-context.cjs');
 
 const HoverCardPositioner = props => {
   const hoverCard = hoverCardContext.useHoverCardContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => hoverCard().positionerProps, props));
+  const positionerProps = solid.mergeProps(() => hoverCard().positionerProps, props);
+  return web.createComponent(factory.ark.div, positionerProps);
 };
 
 exports.HoverCardPositioner = HoverCardPositioner;

package/dist/hover-card/hover-card-positioner.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useHoverCardContext } from './hover-card-context.mjs';
 
 const HoverCardPositioner = props => {
   const hoverCard = useHoverCardContext();
-  return createComponent(ark.div, mergeProps(() => hoverCard().positionerProps, props));
+  const positionerProps = mergeProps(() => hoverCard().positionerProps, props);
+  return createComponent(ark.div, positionerProps);
 };
 
 export { HoverCardPositioner };

package/dist/hover-card/hover-card-trigger.cjs

@@ -2,22 +2,15 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const solidJs = require('solid-js');
 const web = require('solid-js/web');
-const ssrSpread = require('../ssr-spread.cjs');
+const solid = require('@zag-js/solid');
+const factory = require('../factory.cjs');
 const hoverCardContext = require('./hover-card-context.cjs');
 
 const HoverCardTrigger = props => {
   const hoverCard = hoverCardContext.useHoverCardContext();
-  const triggerProps = hoverCard().triggerProps;
-  const getChildren = solidJs.children(() => ssrSpread.ssrSpread(props.children, triggerProps));
-  solidJs.createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      web.spread(children, triggerProps);
-    }
-  });
-  return getChildren;
+  const triggerProps = solid.mergeProps(() => hoverCard().triggerProps, props);
+  return web.createComponent(factory.ark.button, triggerProps);
 };
 
 exports.HoverCardTrigger = HoverCardTrigger;

package/dist/hover-card/hover-card-trigger.d.ts

@@ -1,5 +1,4 @@
-import type { ChildrenReturn, type JSX } from 'solid-js';
-export type HoverCardTriggerProps = {
-    children: JSX.Element;
-};
-export declare const HoverCardTrigger: (props: HoverCardTriggerProps) => ChildrenReturn;
+import type { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+export type HoverCardTriggerProps = HTMLArkProps<'button'>;
+export declare const HoverCardTrigger: (props: HoverCardTriggerProps) => JSX.Element;

package/dist/hover-card/hover-card-trigger.mjs

@@ -1,19 +1,12 @@
-import { children, createEffect } from 'solid-js';
-import { spread } from 'solid-js/web';
-import { ssrSpread } from '../ssr-spread.mjs';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
 import { useHoverCardContext } from './hover-card-context.mjs';
 
 const HoverCardTrigger = props => {
   const hoverCard = useHoverCardContext();
-  const triggerProps = hoverCard().triggerProps;
-  const getChildren = children(() => ssrSpread(props.children, triggerProps));
-  createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      spread(children, triggerProps);
-    }
-  });
-  return getChildren;
+  const triggerProps = mergeProps(() => hoverCard().triggerProps, props);
+  return createComponent(ark.button, triggerProps);
 };
 
 export { HoverCardTrigger };

package/dist/index.cjs

@@ -9,6 +9,14 @@ const accordionIcon = require('./accordion/accordion-icon.cjs');
 const accordionItem = require('./accordion/accordion-item.cjs');
 const accordionTrigger = require('./accordion/accordion-trigger.cjs');
 const accordion$1 = require('@zag-js/accordion');
+const carousel = require('./carousel/carousel.cjs');
+const carouselControl = require('./carousel/carousel-control.cjs');
+const carouselNextSlideTrigger = require('./carousel/carousel-next-slide-trigger.cjs');
+const carouselPrevSlideTrigger = require('./carousel/carousel-prev-slide-trigger.cjs');
+const carouselSlide = require('./carousel/carousel-slide.cjs');
+const carouselSlideGroup = require('./carousel/carousel-slide-group.cjs');
+const carouselViewport = require('./carousel/carousel-viewport.cjs');
+const carousel_anatomy = require('./carousel/carousel.anatomy.cjs');
 const checkbox = require('./checkbox/checkbox.cjs');
 const checkboxControl = require('./checkbox/checkbox-control.cjs');
 const checkboxInput = require('./checkbox/checkbox-input.cjs');
@@ -76,6 +84,7 @@ const numberInput$1 = require('@zag-js/number-input');
 const pagination = require('./pagination/pagination.cjs');
 const paginationEllipsis = require('./pagination/pagination-ellipsis.cjs');
 const paginationList = require('./pagination/pagination-list.cjs');
+const paginationListItem = require('./pagination/pagination-list-item.cjs');
 const paginationNextPageTrigger = require('./pagination/pagination-next-page-trigger.cjs');
 const paginationPageTrigger = require('./pagination/pagination-page-trigger.cjs');
 const paginationPrevPageTrigger = require('./pagination/pagination-prev-page-trigger.cjs');
@@ -105,6 +114,16 @@ const radioGroupLabel = require('./radio-group/radio-group-label.cjs');
 const radio$1 = require('@zag-js/radio-group');
 const radioInput = require('./radio-group/radio-input.cjs');
 const radioLabel = require('./radio-group/radio-label.cjs');
+const rangeSlider = require('./range-slider/range-slider.cjs');
+const rangeSliderControl = require('./range-slider/range-slider-control.cjs');
+const rangeSliderLabel = require('./range-slider/range-slider-label.cjs');
+const rangeSliderMarker = require('./range-slider/range-slider-marker.cjs');
+const rangeSliderMarkerGroup = require('./range-slider/range-slider-marker-group.cjs');
+const rangeSliderOutput = require('./range-slider/range-slider-output.cjs');
+const rangeSliderRange = require('./range-slider/range-slider-range.cjs');
+const rangeSliderThumb = require('./range-slider/range-slider-thumb.cjs');
+const rangeSliderTrack = require('./range-slider/range-slider-track.cjs');
+const rangeSlider$1 = require('@zag-js/range-slider');
 const rating = require('./rating-group/rating.cjs');
 const ratingGroup = require('./rating-group/rating-group.cjs');
 const ratingGroupControl = require('./rating-group/rating-group-control.cjs');
@@ -129,6 +148,10 @@ const sliderRange = require('./slider/slider-range.cjs');
 const sliderThumb = require('./slider/slider-thumb.cjs');
 const sliderTrack = require('./slider/slider-track.cjs');
 const slider$1 = require('@zag-js/slider');
+const splitter = require('./splitter/splitter.cjs');
+const splitterPanel = require('./splitter/splitter-panel.cjs');
+const splitterResizeTrigger = require('./splitter/splitter-resize-trigger.cjs');
+const splitter$1 = require('@zag-js/splitter');
 const tabContent = require('./tabs/tab-content.cjs');
 const tabIndicator = require('./tabs/tab-indicator.cjs');
 const tabList = require('./tabs/tab-list.cjs');
@@ -144,6 +167,14 @@ const tagsInputControl = require('./tags-input/tags-input-control.cjs');
 const tagsInputField = require('./tags-input/tags-input-field.cjs');
 const tagsInputLabel = require('./tags-input/tags-input-label.cjs');
 const tagsInput$1 = require('@zag-js/tags-input');
+const toast = require('./toast/toast.cjs');
+const toastCloseTrigger = require('./toast/toast-close-trigger.cjs');
+const toastDescription = require('./toast/toast-description.cjs');
+const toastGroup = require('./toast/toast-group.cjs');
+const toastPlacements = require('./toast/toast-placements.cjs');
+const toastProvider = require('./toast/toast-provider.cjs');
+const toastTitle = require('./toast/toast-title.cjs');
+const toast$1 = require('@zag-js/toast');
 const tooltip = require('./tooltip/tooltip.cjs');
 const pagination$1 = require('@zag-js/pagination');
 const tooltipArrow = require('./tooltip/tooltip-arrow.cjs');
@@ -167,6 +198,14 @@ Object.defineProperty(exports, 'accordionAnatomy', {
 	enumerable: true,
 	get: () => accordion$1.anatomy
 });
+exports.Carousel = carousel.Carousel;
+exports.CarouselControl = carouselControl.CarouselControl;
+exports.CarouselNextSlideTrigger = carouselNextSlideTrigger.CarouselNextSlideTrigger;
+exports.CarouselPrevSlideTrigger = carouselPrevSlideTrigger.CarouselPrevSlideTrigger;
+exports.CarouselSlide = carouselSlide.CarouselSlide;
+exports.CarouselSlideGroup = carouselSlideGroup.CarouselSlideGroup;
+exports.CarouselViewport = carouselViewport.CarouselViewport;
+exports.carouselAnatomy = carousel_anatomy.carouselAnatomy;
 exports.Checkbox = checkbox.Checkbox;
 exports.CheckboxControl = checkboxControl.CheckboxControl;
 exports.CheckboxInput = checkboxInput.CheckboxInput;
@@ -255,6 +294,7 @@ Object.defineProperty(exports, 'numberInputAnatomy', {
 exports.Pagination = pagination.Pagination;
 exports.PaginationEllipsis = paginationEllipsis.PaginationEllipsis;
 exports.PaginationList = paginationList.PaginationList;
+exports.PaginationListItem = paginationListItem.PaginationListItem;
 exports.PaginationNextPageTrigger = paginationNextPageTrigger.PaginationNextPageTrigger;
 exports.PaginationPageTrigger = paginationPageTrigger.PaginationPageTrigger;
 exports.PaginationPrevPageTrigger = paginationPrevPageTrigger.PaginationPrevPageTrigger;
@@ -293,6 +333,19 @@ Object.defineProperty(exports, 'radioGroupAnatomy', {
 });
 exports.RadioInput = radioInput.RadioInput;
 exports.RadioLabel = radioLabel.RadioLabel;
+exports.RangeSlider = rangeSlider.RangeSlider;
+exports.RangeSliderControl = rangeSliderControl.RangeSliderControl;
+exports.RangeSliderLabel = rangeSliderLabel.RangeSliderLabel;
+exports.RangeSliderMarker = rangeSliderMarker.RangeSliderMarker;
+exports.RangeSliderMarkerGroup = rangeSliderMarkerGroup.RangeSliderMarkerGroup;
+exports.RangeSliderOutput = rangeSliderOutput.RangeSliderOutput;
+exports.RangeSliderRange = rangeSliderRange.RangeSliderRange;
+exports.RangeSliderThumb = rangeSliderThumb.RangeSliderThumb;
+exports.RangeSliderTrack = rangeSliderTrack.RangeSliderTrack;
+Object.defineProperty(exports, 'rangeSliderAnatomy', {
+	enumerable: true,
+	get: () => rangeSlider$1.anatomy
+});
 exports.Rating = rating.Rating;
 exports.RatingGroup = ratingGroup.RatingGroup;
 exports.RatingGroupControl = ratingGroupControl.RatingGroupControl;
@@ -326,6 +379,13 @@ Object.defineProperty(exports, 'sliderAnatomy', {
 	enumerable: true,
 	get: () => slider$1.anatomy
 });
+exports.Splitter = splitter.Splitter;
+exports.SplitterPanel = splitterPanel.SplitterPanel;
+exports.SplitterResizeTrigger = splitterResizeTrigger.SplitterResizeTrigger;
+Object.defineProperty(exports, 'splitterAnatomy', {
+	enumerable: true,
+	get: () => splitter$1.anatomy
+});
 exports.TabContent = tabContent.TabContent;
 exports.TabIndicator = tabIndicator.TabIndicator;
 exports.TabList = tabList.TabList;
@@ -347,6 +407,18 @@ Object.defineProperty(exports, 'tagsInputAnatomy', {
 	enumerable: true,
 	get: () => tagsInput$1.anatomy
 });
+exports.Toast = toast.Toast;
+exports.ToastCloseTrigger = toastCloseTrigger.ToastCloseTrigger;
+exports.ToastDescription = toastDescription.ToastDescription;
+exports.ToastGroup = toastGroup.ToastGroup;
+exports.ToastPlacements = toastPlacements.ToastPlacements;
+exports.ToastProvider = toastProvider.ToastProvider;
+exports.useToast = toastProvider.useToast;
+exports.ToastTitle = toastTitle.ToastTitle;
+Object.defineProperty(exports, 'toastAnatomy', {
+	enumerable: true,
+	get: () => toast$1.anatomy
+});
 exports.Tooltip = tooltip.Tooltip;
 Object.defineProperty(exports, 'tooltipAnatomy', {
 	enumerable: true,

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export { createAnatomy } from '@zag-js/anatomy';
 export * from './accordion';
+export * from './carousel';
 export * from './checkbox';
 export * from './combobox';
 export * from './dialog';
@@ -13,9 +14,12 @@ export * from './pin-input';
 export * from './popover';
 export * from './pressable';
 export * from './radio-group';
+export * from './range-slider';
 export * from './rating-group';
 export * from './select';
 export * from './slider';
+export * from './splitter';
 export * from './tabs';
 export * from './tags-input';
+export * from './toast';
 export * from './tooltip';

package/dist/index.mjs

@@ -5,6 +5,14 @@ export { AccordionIcon } from './accordion/accordion-icon.mjs';
 export { AccordionItem } from './accordion/accordion-item.mjs';
 export { AccordionTrigger } from './accordion/accordion-trigger.mjs';
 export { anatomy as accordionAnatomy } from '@zag-js/accordion';
+export { Carousel } from './carousel/carousel.mjs';
+export { CarouselControl } from './carousel/carousel-control.mjs';
+export { CarouselNextSlideTrigger } from './carousel/carousel-next-slide-trigger.mjs';
+export { CarouselPrevSlideTrigger } from './carousel/carousel-prev-slide-trigger.mjs';
+export { CarouselSlide } from './carousel/carousel-slide.mjs';
+export { CarouselSlideGroup } from './carousel/carousel-slide-group.mjs';
+export { CarouselViewport } from './carousel/carousel-viewport.mjs';
+export { carouselAnatomy } from './carousel/carousel.anatomy.mjs';
 export { Checkbox } from './checkbox/checkbox.mjs';
 export { CheckboxControl } from './checkbox/checkbox-control.mjs';
 export { CheckboxInput } from './checkbox/checkbox-input.mjs';
@@ -72,6 +80,7 @@ export { anatomy as numberInputAnatomy } from '@zag-js/number-input';
 export { Pagination } from './pagination/pagination.mjs';
 export { PaginationEllipsis } from './pagination/pagination-ellipsis.mjs';
 export { PaginationList } from './pagination/pagination-list.mjs';
+export { PaginationListItem } from './pagination/pagination-list-item.mjs';
 export { PaginationNextPageTrigger } from './pagination/pagination-next-page-trigger.mjs';
 export { PaginationPageTrigger } from './pagination/pagination-page-trigger.mjs';
 export { PaginationPrevPageTrigger } from './pagination/pagination-prev-page-trigger.mjs';
@@ -101,6 +110,16 @@ export { RadioGroupLabel } from './radio-group/radio-group-label.mjs';
 export { anatomy as radioGroupAnatomy } from '@zag-js/radio-group';
 export { RadioInput } from './radio-group/radio-input.mjs';
 export { RadioLabel } from './radio-group/radio-label.mjs';
+export { RangeSlider } from './range-slider/range-slider.mjs';
+export { RangeSliderControl } from './range-slider/range-slider-control.mjs';
+export { RangeSliderLabel } from './range-slider/range-slider-label.mjs';
+export { RangeSliderMarker } from './range-slider/range-slider-marker.mjs';
+export { RangeSliderMarkerGroup } from './range-slider/range-slider-marker-group.mjs';
+export { RangeSliderOutput } from './range-slider/range-slider-output.mjs';
+export { RangeSliderRange } from './range-slider/range-slider-range.mjs';
+export { RangeSliderThumb } from './range-slider/range-slider-thumb.mjs';
+export { RangeSliderTrack } from './range-slider/range-slider-track.mjs';
+export { anatomy as rangeSliderAnatomy } from '@zag-js/range-slider';
 export { Rating } from './rating-group/rating.mjs';
 export { RatingGroup } from './rating-group/rating-group.mjs';
 export { RatingGroupControl } from './rating-group/rating-group-control.mjs';
@@ -125,6 +144,10 @@ export { SliderRange } from './slider/slider-range.mjs';
 export { SliderThumb } from './slider/slider-thumb.mjs';
 export { SliderTrack } from './slider/slider-track.mjs';
 export { anatomy as sliderAnatomy } from '@zag-js/slider';
+export { Splitter } from './splitter/splitter.mjs';
+export { SplitterPanel } from './splitter/splitter-panel.mjs';
+export { SplitterResizeTrigger } from './splitter/splitter-resize-trigger.mjs';
+export { anatomy as splitterAnatomy } from '@zag-js/splitter';
 export { TabContent } from './tabs/tab-content.mjs';
 export { TabIndicator } from './tabs/tab-indicator.mjs';
 export { TabList } from './tabs/tab-list.mjs';
@@ -140,6 +163,14 @@ export { TagsInputControl } from './tags-input/tags-input-control.mjs';
 export { TagsInputField } from './tags-input/tags-input-field.mjs';
 export { TagsInputLabel } from './tags-input/tags-input-label.mjs';
 export { anatomy as tagsInputAnatomy } from '@zag-js/tags-input';
+export { Toast } from './toast/toast.mjs';
+export { ToastCloseTrigger } from './toast/toast-close-trigger.mjs';
+export { ToastDescription } from './toast/toast-description.mjs';
+export { ToastGroup } from './toast/toast-group.mjs';
+export { ToastPlacements } from './toast/toast-placements.mjs';
+export { ToastProvider, useToast } from './toast/toast-provider.mjs';
+export { ToastTitle } from './toast/toast-title.mjs';
+export { anatomy as toastAnatomy } from '@zag-js/toast';
 export { Tooltip } from './tooltip/tooltip.mjs';
 export { anatomy as tooltipAnatomy } from '@zag-js/pagination';
 export { TooltipArrow } from './tooltip/tooltip-arrow.mjs';

package/dist/menu/menu-arrow-tip.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const menuContext = require('./menu-context.cjs');
 
 const MenuArrowTip = props => {
   const menu = menuContext.useMenuContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => menu?.().arrowTipProps, props));
+  const arrowTipProps = solid.mergeProps(() => menu?.().arrowTipProps, props);
+  return web.createComponent(factory.ark.div, arrowTipProps);
 };
 
 exports.MenuArrowTip = MenuArrowTip;

package/dist/menu/menu-arrow-tip.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
 const MenuArrowTip = props => {
   const menu = useMenuContext();
-  return createComponent(ark.div, mergeProps(() => menu?.().arrowTipProps, props));
+  const arrowTipProps = mergeProps(() => menu?.().arrowTipProps, props);
+  return createComponent(ark.div, arrowTipProps);
 };
 
 export { MenuArrowTip };

package/dist/menu/menu-arrow.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const menuContext = require('./menu-context.cjs');
 
 const MenuArrow = props => {
   const menu = menuContext.useMenuContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => menu?.().arrowProps, props));
+  const arrowProps = solid.mergeProps(() => menu?.().arrowProps, props);
+  return web.createComponent(factory.ark.div, arrowProps);
 };
 
 exports.MenuArrow = MenuArrow;

package/dist/menu/menu-arrow.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
 const MenuArrow = props => {
   const menu = useMenuContext();
-  return createComponent(ark.div, mergeProps(() => menu?.().arrowProps, props));
+  const arrowProps = mergeProps(() => menu?.().arrowProps, props);
+  return createComponent(ark.div, arrowProps);
 };
 
 export { MenuArrow };

package/dist/menu/menu-content.cjs

@@ -3,12 +3,14 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
 const factory = require('../factory.cjs');
 const menuContext = require('./menu-context.cjs');
 
 const MenuContent = props => {
   const menu = menuContext.useMenuContext();
-  return web.createComponent(factory.ark.div, web.mergeProps(() => menu?.()?.contentProps, props));
+  const contentProps = solid.mergeProps(() => menu?.().contentProps, props);
+  return web.createComponent(factory.ark.div, contentProps);
 };
 
 exports.MenuContent = MenuContent;

package/dist/menu/menu-content.mjs

@@ -1,10 +1,12 @@
-import { createComponent, mergeProps } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
 import { ark } from '../factory.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
 const MenuContent = props => {
   const menu = useMenuContext();
-  return createComponent(ark.div, mergeProps(() => menu?.()?.contentProps, props));
+  const contentProps = mergeProps(() => menu?.().contentProps, props);
+  return createComponent(ark.div, contentProps);
 };
 
 export { MenuContent };

package/dist/menu/menu-context-trigger.cjs

@@ -2,20 +2,15 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const solidJs = require('solid-js');
 const web = require('solid-js/web');
+const solid = require('@zag-js/solid');
+const factory = require('../factory.cjs');
 const menuContext = require('./menu-context.cjs');
 
 const MenuContextTrigger = props => {
   const menu = menuContext.useMenuContext();
-  const getChildren = solidJs.children(() => props.children);
-  solidJs.createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      web.spread(children, menu?.()?.contextTriggerProps);
-    }
-  });
-  return getChildren;
+  const triggerProps = solid.mergeProps(() => menu?.().contextTriggerProps, props);
+  return web.createComponent(factory.ark.button, triggerProps);
 };
 
 exports.MenuContextTrigger = MenuContextTrigger;

package/dist/menu/menu-context-trigger.d.ts

@@ -1,5 +1,4 @@
-import type { ChildrenReturn, type JSX } from 'solid-js';
-export type MenuContextTriggerProps = {
-    children: JSX.Element;
-};
-export declare const MenuContextTrigger: (props: MenuContextTriggerProps) => ChildrenReturn;
+import type { JSX } from 'solid-js';
+import { type HTMLArkProps } from '../factory';
+export type MenuContextTriggerProps = HTMLArkProps<'button'>;
+export declare const MenuContextTrigger: (props: MenuContextTriggerProps) => JSX.Element;

package/dist/menu/menu-context-trigger.mjs

@@ -1,17 +1,12 @@
-import { children, createEffect } from 'solid-js';
-import { spread } from 'solid-js/web';
+import { createComponent } from 'solid-js/web';
+import { mergeProps } from '@zag-js/solid';
+import { ark } from '../factory.mjs';
 import { useMenuContext } from './menu-context.mjs';
 
 const MenuContextTrigger = props => {
   const menu = useMenuContext();
-  const getChildren = children(() => props.children);
-  createEffect(() => {
-    const children = getChildren();
-    if (children instanceof HTMLElement) {
-      spread(children, menu?.()?.contextTriggerProps);
-    }
-  });
-  return getChildren;
+  const triggerProps = mergeProps(() => menu?.().contextTriggerProps, props);
+  return createComponent(ark.button, triggerProps);
 };
 
 export { MenuContextTrigger };