@ark-ui/vue 5.27.1 → 5.29.0

package/dist/components/image-cropper/use-image-cropper.cjs

@@ -0,0 +1,68 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const imageCropper = require('@zag-js/image-cropper');
+const vue$1 = require('@zag-js/vue');
+const vue = require('vue');
+const useEnvironmentContext = require('../../providers/environment/use-environment-context.cjs');
+const useLocaleContext = require('../../providers/locale/use-locale-context.cjs');
+const cleanProps = require('../../utils/clean-props.cjs');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const imageCropper__namespace = /*#__PURE__*/_interopNamespaceDefault(imageCropper);
+
+const useImageCropper = (props = {}, emit) => {
+  const id = vue.useId();
+  const env = useEnvironmentContext.useEnvironmentContext(useEnvironmentContext.DEFAULT_ENVIRONMENT);
+  const locale = useLocaleContext.useLocaleContext(useLocaleContext.DEFAULT_LOCALE);
+  const context = vue.computed(() => {
+    const localProps = vue.toValue(props);
+    return {
+      id,
+      dir: locale.value.dir,
+      getRootNode: env?.value.getRootNode,
+      ...cleanProps.cleanProps(localProps),
+      onZoomChange(details) {
+        emit?.("zoomChange", details);
+        emit?.("update:zoom", details.zoom);
+        localProps.onZoomChange?.(details);
+      },
+      onRotationChange(details) {
+        emit?.("rotationChange", details);
+        emit?.("update:rotation", details.rotation);
+        localProps.onRotationChange?.(details);
+      },
+      onFlipChange(details) {
+        emit?.("flipChange", details);
+        emit?.("update:flip", details.flip);
+        localProps.onFlipChange?.(details);
+      },
+      onCropChange(details) {
+        emit?.("cropChange", details);
+        emit?.("update:crop", details.crop);
+        localProps.onCropChange?.(details);
+      }
+    };
+  });
+  const service = vue$1.useMachine(imageCropper__namespace.machine, context);
+  return vue.computed(() => imageCropper__namespace.connect(service, vue$1.normalizeProps));
+};
+
+exports.useImageCropper = useImageCropper;

package/dist/components/image-cropper/use-image-cropper.d.cts

@@ -0,0 +1,10 @@
+import { PropTypes } from '@zag-js/vue';
+import { ComputedRef, MaybeRef } from 'vue';
+import { EmitFn, Optional } from '../../types';
+import { RootEmits } from './image-cropper.types';
+import * as imageCropper from '@zag-js/image-cropper';
+export interface UseImageCropperProps extends Optional<Omit<imageCropper.Props, 'dir' | 'getRootNode'>, 'id'> {
+}
+export interface UseImageCropperReturn extends ComputedRef<imageCropper.Api<PropTypes>> {
+}
+export declare const useImageCropper: (props?: MaybeRef<UseImageCropperProps>, emit?: EmitFn<RootEmits>) => ComputedRef<imageCropper.Api<PropTypes>>;

package/dist/components/image-cropper/use-image-cropper.d.ts

@@ -0,0 +1,10 @@
+import { PropTypes } from '@zag-js/vue';
+import { ComputedRef, MaybeRef } from 'vue';
+import { EmitFn, Optional } from '../../types';
+import { RootEmits } from './image-cropper.types';
+import * as imageCropper from '@zag-js/image-cropper';
+export interface UseImageCropperProps extends Optional<Omit<imageCropper.Props, 'dir' | 'getRootNode'>, 'id'> {
+}
+export interface UseImageCropperReturn extends ComputedRef<imageCropper.Api<PropTypes>> {
+}
+export declare const useImageCropper: (props?: MaybeRef<UseImageCropperProps>, emit?: EmitFn<RootEmits>) => ComputedRef<imageCropper.Api<PropTypes>>;

package/dist/components/image-cropper/use-image-cropper.js

@@ -0,0 +1,45 @@
+import * as imageCropper from '@zag-js/image-cropper';
+import { useMachine, normalizeProps } from '@zag-js/vue';
+import { useId, computed, toValue } from 'vue';
+import { useEnvironmentContext, DEFAULT_ENVIRONMENT } from '../../providers/environment/use-environment-context.js';
+import { useLocaleContext, DEFAULT_LOCALE } from '../../providers/locale/use-locale-context.js';
+import { cleanProps } from '../../utils/clean-props.js';
+
+const useImageCropper = (props = {}, emit) => {
+  const id = useId();
+  const env = useEnvironmentContext(DEFAULT_ENVIRONMENT);
+  const locale = useLocaleContext(DEFAULT_LOCALE);
+  const context = computed(() => {
+    const localProps = toValue(props);
+    return {
+      id,
+      dir: locale.value.dir,
+      getRootNode: env?.value.getRootNode,
+      ...cleanProps(localProps),
+      onZoomChange(details) {
+        emit?.("zoomChange", details);
+        emit?.("update:zoom", details.zoom);
+        localProps.onZoomChange?.(details);
+      },
+      onRotationChange(details) {
+        emit?.("rotationChange", details);
+        emit?.("update:rotation", details.rotation);
+        localProps.onRotationChange?.(details);
+      },
+      onFlipChange(details) {
+        emit?.("flipChange", details);
+        emit?.("update:flip", details.flip);
+        localProps.onFlipChange?.(details);
+      },
+      onCropChange(details) {
+        emit?.("cropChange", details);
+        emit?.("update:crop", details.crop);
+        localProps.onCropChange?.(details);
+      }
+    };
+  });
+  const service = useMachine(imageCropper.machine, context);
+  return computed(() => imageCropper.connect(service, normalizeProps));
+};
+
+export { useImageCropper };

package/dist/components/index.cjs

@@ -48,6 +48,8 @@ const bottomSheetTrigger_vue_vue_type_script_setup_true_lang = require('./bottom
 const useBottomSheet = require('./bottom-sheet/use-bottom-sheet.cjs');
 const useBottomSheetContext = require('./bottom-sheet/use-bottom-sheet-context.cjs');
 const bottomSheet$1 = require('./bottom-sheet/bottom-sheet.cjs');
+const carouselAutoplayIndicator_vue_vue_type_script_setup_true_lang = require('./carousel/carousel-autoplay-indicator.vue.cjs');
+const carouselProgressText_vue_vue_type_script_setup_true_lang = require('./carousel/carousel-progress-text.vue.cjs');
 const carouselAutoplayTrigger_vue_vue_type_script_setup_true_lang = require('./carousel/carousel-autoplay-trigger.vue.cjs');
 const carouselContext_vue_vue_type_script_setup_true_lang = require('./carousel/carousel-context.vue.cjs');
 const carouselControl_vue_vue_type_script_setup_true_lang = require('./carousel/carousel-control.vue.cjs');
@@ -59,9 +61,10 @@ const carouselNextTrigger_vue_vue_type_script_setup_true_lang = require('./carou
 const carouselPrevTrigger_vue_vue_type_script_setup_true_lang = require('./carousel/carousel-prev-trigger.vue.cjs');
 const carouselRootProvider_vue_vue_type_script_setup_true_lang = require('./carousel/carousel-root-provider.vue.cjs');
 const carouselRoot_vue_vue_type_script_setup_true_lang = require('./carousel/carousel-root.vue.cjs');
+const carousel_anatomy = require('./carousel/carousel.anatomy.cjs');
 const useCarousel = require('./carousel/use-carousel.cjs');
 const useCarouselContext = require('./carousel/use-carousel-context.cjs');
-const carousel$1 = require('./carousel/carousel.cjs');
+const carousel = require('./carousel/carousel.cjs');
 const checkboxContext_vue_vue_type_script_setup_true_lang = require('./checkbox/checkbox-context.vue.cjs');
 const checkboxControl_vue_vue_type_script_setup_true_lang = require('./checkbox/checkbox-control.vue.cjs');
 const checkboxGroup_vue_vue_type_script_setup_true_lang = require('./checkbox/checkbox-group.vue.cjs');
@@ -300,6 +303,18 @@ const hoverCardTrigger_vue_vue_type_script_setup_true_lang = require('./hover-ca
 const useHoverCard = require('./hover-card/use-hover-card.cjs');
 const useHoverCardContext = require('./hover-card/use-hover-card-context.cjs');
 const hoverCard$1 = require('./hover-card/hover-card.cjs');
+const imageCropperContext_vue_vue_type_script_setup_true_lang = require('./image-cropper/image-cropper-context.vue.cjs');
+const imageCropperGrid_vue_vue_type_script_setup_true_lang = require('./image-cropper/image-cropper-grid.vue.cjs');
+const imageCropperHandle_vue_vue_type_script_setup_true_lang = require('./image-cropper/image-cropper-handle.vue.cjs');
+const imageCropperImage_vue_vue_type_script_setup_true_lang = require('./image-cropper/image-cropper-image.vue.cjs');
+const imageCropperRoot_vue_vue_type_script_setup_true_lang = require('./image-cropper/image-cropper-root.vue.cjs');
+const imageCropperRootProvider_vue_vue_type_script_setup_true_lang = require('./image-cropper/image-cropper-root-provider.vue.cjs');
+const imageCropperSelection_vue_vue_type_script_setup_true_lang = require('./image-cropper/image-cropper-selection.vue.cjs');
+const imageCropperViewport_vue_vue_type_script_setup_true_lang = require('./image-cropper/image-cropper-viewport.vue.cjs');
+const useImageCropper = require('./image-cropper/use-image-cropper.cjs');
+const useImageCropperContext = require('./image-cropper/use-image-cropper-context.cjs');
+const imageCropper_anatomy = require('./image-cropper/image-cropper.anatomy.cjs');
+const imageCropper = require('./image-cropper/image-cropper.cjs');
 const jsonTreeViewRoot_vue_vue_type_script_setup_true_lang = require('./json-tree-view/json-tree-view-root.vue.cjs');
 const jsonTreeViewRootProvider_vue_vue_type_script_setup_true_lang = require('./json-tree-view/json-tree-view-root-provider.vue.cjs');
 const jsonTreeViewTree_vue_vue_type_script_setup_true_lang = require('./json-tree-view/json-tree-view-tree.vue.cjs');
@@ -549,9 +564,11 @@ const sliderValueText_vue_vue_type_script_setup_true_lang = require('./slider/sl
 const useSlider = require('./slider/use-slider.cjs');
 const useSliderContext = require('./slider/use-slider-context.cjs');
 const slider$1 = require('./slider/slider.cjs');
+const splitter = require('@zag-js/splitter');
 const splitterContext_vue_vue_type_script_setup_true_lang = require('./splitter/splitter-context.vue.cjs');
 const splitterPanel_vue_vue_type_script_setup_true_lang = require('./splitter/splitter-panel.vue.cjs');
 const splitterResizeTrigger_vue_vue_type_script_setup_true_lang = require('./splitter/splitter-resize-trigger.vue.cjs');
+const splitterResizeTriggerIndicator_vue_vue_type_script_setup_true_lang = require('./splitter/splitter-resize-trigger-indicator.vue.cjs');
 const splitterRootProvider_vue_vue_type_script_setup_true_lang = require('./splitter/splitter-root-provider.vue.cjs');
 const splitterRoot_vue_vue_type_script_setup_true_lang = require('./splitter/splitter-root.vue.cjs');
 const useSplitter = require('./splitter/use-splitter.cjs');
@@ -706,7 +723,6 @@ const accordion = require('@zag-js/accordion');
 const angleSlider = require('@zag-js/angle-slider');
 const avatar = require('@zag-js/avatar');
 const bottomSheet = require('@zag-js/bottom-sheet');
-const carousel = require('@zag-js/carousel');
 const clipboard = require('@zag-js/clipboard');
 const collapsible = require('@zag-js/collapsible');
 const dialog = require('@zag-js/dialog');
@@ -729,7 +745,6 @@ const scrollArea = require('@zag-js/scroll-area');
 const select = require('@zag-js/select');
 const signaturepad = require('@zag-js/signature-pad');
 const slider = require('@zag-js/slider');
-const splitter = require('@zag-js/splitter');
 const steps = require('@zag-js/steps');
 const zagSwitch = require('@zag-js/switch');
 const tabs = require('@zag-js/tabs');
@@ -788,6 +803,8 @@ exports.BottomSheetTrigger = bottomSheetTrigger_vue_vue_type_script_setup_true_l
 exports.useBottomSheet = useBottomSheet.useBottomSheet;
 exports.useBottomSheetContext = useBottomSheetContext.useBottomSheetContext;
 exports.BottomSheet = bottomSheet$1;
+exports.CarouselAutoplayIndicator = carouselAutoplayIndicator_vue_vue_type_script_setup_true_lang.default;
+exports.CarouselProgressText = carouselProgressText_vue_vue_type_script_setup_true_lang.default;
 exports.CarouselAutoplayTrigger = carouselAutoplayTrigger_vue_vue_type_script_setup_true_lang.default;
 exports.CarouselContext = carouselContext_vue_vue_type_script_setup_true_lang.default;
 exports.CarouselControl = carouselControl_vue_vue_type_script_setup_true_lang.default;
@@ -799,9 +816,10 @@ exports.CarouselNextTrigger = carouselNextTrigger_vue_vue_type_script_setup_true
 exports.CarouselPrevTrigger = carouselPrevTrigger_vue_vue_type_script_setup_true_lang.default;
 exports.CarouselRootProvider = carouselRootProvider_vue_vue_type_script_setup_true_lang.default;
 exports.CarouselRoot = carouselRoot_vue_vue_type_script_setup_true_lang.default;
+exports.carouselAnatomy = carousel_anatomy.carouselAnatomy;
 exports.useCarousel = useCarousel.useCarousel;
 exports.useCarouselContext = useCarouselContext.useCarouselContext;
-exports.Carousel = carousel$1;
+exports.Carousel = carousel;
 exports.CheckboxContext = checkboxContext_vue_vue_type_script_setup_true_lang.default;
 exports.CheckboxControl = checkboxControl_vue_vue_type_script_setup_true_lang.default;
 exports.CheckboxGroup = checkboxGroup_vue_vue_type_script_setup_true_lang.default;
@@ -1048,6 +1066,18 @@ exports.HoverCardTrigger = hoverCardTrigger_vue_vue_type_script_setup_true_lang.
 exports.useHoverCard = useHoverCard.useHoverCard;
 exports.useHoverCardContext = useHoverCardContext.useHoverCardContext;
 exports.HoverCard = hoverCard$1;
+exports.ImageCropperContext = imageCropperContext_vue_vue_type_script_setup_true_lang.default;
+exports.ImageCropperGrid = imageCropperGrid_vue_vue_type_script_setup_true_lang.default;
+exports.ImageCropperHandle = imageCropperHandle_vue_vue_type_script_setup_true_lang.default;
+exports.ImageCropperImage = imageCropperImage_vue_vue_type_script_setup_true_lang.default;
+exports.ImageCropperRoot = imageCropperRoot_vue_vue_type_script_setup_true_lang.default;
+exports.ImageCropperRootProvider = imageCropperRootProvider_vue_vue_type_script_setup_true_lang.default;
+exports.ImageCropperSelection = imageCropperSelection_vue_vue_type_script_setup_true_lang.default;
+exports.ImageCropperViewport = imageCropperViewport_vue_vue_type_script_setup_true_lang.default;
+exports.useImageCropper = useImageCropper.useImageCropper;
+exports.useImageCropperContext = useImageCropperContext.useImageCropperContext;
+exports.imageCropperAnatomy = imageCropper_anatomy.imageCropperAnatomy;
+exports.ImageCropper = imageCropper;
 exports.JsonTreeViewRoot = jsonTreeViewRoot_vue_vue_type_script_setup_true_lang.default;
 exports.JsonTreeViewRootProvider = jsonTreeViewRootProvider_vue_vue_type_script_setup_true_lang.default;
 exports.JsonTreeViewTree = jsonTreeViewTree_vue_vue_type_script_setup_true_lang.default;
@@ -1298,9 +1328,18 @@ exports.SliderValueText = sliderValueText_vue_vue_type_script_setup_true_lang.de
 exports.useSlider = useSlider.useSlider;
 exports.useSliderContext = useSliderContext.useSliderContext;
 exports.Slider = slider$1;
+Object.defineProperty(exports, "getSplitterLayout", {
+	enumerable: true,
+	get: () => splitter.layout
+});
+Object.defineProperty(exports, "splitterAnatomy", {
+	enumerable: true,
+	get: () => splitter.anatomy
+});
 exports.SplitterContext = splitterContext_vue_vue_type_script_setup_true_lang.default;
 exports.SplitterPanel = splitterPanel_vue_vue_type_script_setup_true_lang.default;
 exports.SplitterResizeTrigger = splitterResizeTrigger_vue_vue_type_script_setup_true_lang.default;
+exports.SplitterResizeTriggerIndicator = splitterResizeTriggerIndicator_vue_vue_type_script_setup_true_lang.default;
 exports.SplitterRootProvider = splitterRootProvider_vue_vue_type_script_setup_true_lang.default;
 exports.SplitterRoot = splitterRoot_vue_vue_type_script_setup_true_lang.default;
 exports.useSplitter = useSplitter.useSplitter;
@@ -1467,10 +1506,6 @@ Object.defineProperty(exports, "bottomSheetAnatomy", {
 	enumerable: true,
 	get: () => bottomSheet.anatomy
 });
-Object.defineProperty(exports, "carouselAnatomy", {
-	enumerable: true,
-	get: () => carousel.anatomy
-});
 Object.defineProperty(exports, "clipboardAnatomy", {
 	enumerable: true,
 	get: () => clipboard.anatomy
@@ -1559,10 +1594,6 @@ Object.defineProperty(exports, "sliderAnatomy", {
 	enumerable: true,
 	get: () => slider.anatomy
 });
-Object.defineProperty(exports, "splitterAnatomy", {
-	enumerable: true,
-	get: () => splitter.anatomy
-});
 Object.defineProperty(exports, "stepsAnatomy", {
 	enumerable: true,
 	get: () => steps.anatomy

package/dist/components/index.d.cts

@@ -24,6 +24,7 @@ export * from './format';
 export * from './frame';
 export * from './highlight';
 export * from './hover-card';
+export * from './image-cropper';
 export * from './json-tree-view';
 export * from './listbox';
 export * from './marquee';

package/dist/components/index.d.ts

@@ -24,6 +24,7 @@ export * from './format';
 export * from './frame';
 export * from './highlight';
 export * from './hover-card';
+export * from './image-cropper';
 export * from './json-tree-view';
 export * from './listbox';
 export * from './marquee';

package/dist/components/index.js

@@ -48,6 +48,8 @@ export { useBottomSheet } from './bottom-sheet/use-bottom-sheet.js';
 export { useBottomSheetContext } from './bottom-sheet/use-bottom-sheet-context.js';
 import * as bottomSheet from './bottom-sheet/bottom-sheet.js';
 export { bottomSheet as BottomSheet };
+export { default as CarouselAutoplayIndicator } from './carousel/carousel-autoplay-indicator.vue.js';
+export { default as CarouselProgressText } from './carousel/carousel-progress-text.vue.js';
 export { default as CarouselAutoplayTrigger } from './carousel/carousel-autoplay-trigger.vue.js';
 export { default as CarouselContext } from './carousel/carousel-context.vue.js';
 export { default as CarouselControl } from './carousel/carousel-control.vue.js';
@@ -59,6 +61,7 @@ export { default as CarouselNextTrigger } from './carousel/carousel-next-trigger
 export { default as CarouselPrevTrigger } from './carousel/carousel-prev-trigger.vue.js';
 export { default as CarouselRootProvider } from './carousel/carousel-root-provider.vue.js';
 export { default as CarouselRoot } from './carousel/carousel-root.vue.js';
+export { carouselAnatomy } from './carousel/carousel.anatomy.js';
 export { useCarousel } from './carousel/use-carousel.js';
 export { useCarouselContext } from './carousel/use-carousel-context.js';
 import * as carousel from './carousel/carousel.js';
@@ -315,6 +318,19 @@ export { useHoverCard } from './hover-card/use-hover-card.js';
 export { useHoverCardContext } from './hover-card/use-hover-card-context.js';
 import * as hoverCard from './hover-card/hover-card.js';
 export { hoverCard as HoverCard };
+export { default as ImageCropperContext } from './image-cropper/image-cropper-context.vue.js';
+export { default as ImageCropperGrid } from './image-cropper/image-cropper-grid.vue.js';
+export { default as ImageCropperHandle } from './image-cropper/image-cropper-handle.vue.js';
+export { default as ImageCropperImage } from './image-cropper/image-cropper-image.vue.js';
+export { default as ImageCropperRoot } from './image-cropper/image-cropper-root.vue.js';
+export { default as ImageCropperRootProvider } from './image-cropper/image-cropper-root-provider.vue.js';
+export { default as ImageCropperSelection } from './image-cropper/image-cropper-selection.vue.js';
+export { default as ImageCropperViewport } from './image-cropper/image-cropper-viewport.vue.js';
+export { useImageCropper } from './image-cropper/use-image-cropper.js';
+export { useImageCropperContext } from './image-cropper/use-image-cropper-context.js';
+export { imageCropperAnatomy } from './image-cropper/image-cropper.anatomy.js';
+import * as imageCropper from './image-cropper/image-cropper.js';
+export { imageCropper as ImageCropper };
 export { default as JsonTreeViewRoot } from './json-tree-view/json-tree-view-root.vue.js';
 export { default as JsonTreeViewRootProvider } from './json-tree-view/json-tree-view-root-provider.vue.js';
 export { default as JsonTreeViewTree } from './json-tree-view/json-tree-view-tree.vue.js';
@@ -582,9 +598,11 @@ export { useSlider } from './slider/use-slider.js';
 export { useSliderContext } from './slider/use-slider-context.js';
 import * as slider from './slider/slider.js';
 export { slider as Slider };
+export { layout as getSplitterLayout, anatomy as splitterAnatomy } from '@zag-js/splitter';
 export { default as SplitterContext } from './splitter/splitter-context.vue.js';
 export { default as SplitterPanel } from './splitter/splitter-panel.vue.js';
 export { default as SplitterResizeTrigger } from './splitter/splitter-resize-trigger.vue.js';
+export { default as SplitterResizeTriggerIndicator } from './splitter/splitter-resize-trigger-indicator.vue.js';
 export { default as SplitterRootProvider } from './splitter/splitter-root-provider.vue.js';
 export { default as SplitterRoot } from './splitter/splitter-root.vue.js';
 export { useSplitter } from './splitter/use-splitter.js';
@@ -751,7 +769,6 @@ export { anatomy as accordionAnatomy } from '@zag-js/accordion';
 export { anatomy as angleSliderAnatomy } from '@zag-js/angle-slider';
 export { anatomy as avatarAnatomy } from '@zag-js/avatar';
 export { anatomy as bottomSheetAnatomy } from '@zag-js/bottom-sheet';
-export { anatomy as carouselAnatomy } from '@zag-js/carousel';
 export { anatomy as clipboardAnatomy } from '@zag-js/clipboard';
 export { anatomy as collapsibleAnatomy } from '@zag-js/collapsible';
 export { anatomy as dialogAnatomy } from '@zag-js/dialog';
@@ -774,7 +791,6 @@ export { anatomy as scrollAreaAnatomy } from '@zag-js/scroll-area';
 export { anatomy as selectAnatomy } from '@zag-js/select';
 export { anatomy as signaturePadAnatomy } from '@zag-js/signature-pad';
 export { anatomy as sliderAnatomy } from '@zag-js/slider';
-export { anatomy as splitterAnatomy } from '@zag-js/splitter';
 export { anatomy as stepsAnatomy } from '@zag-js/steps';
 export { anatomy as switchAnatomy } from '@zag-js/switch';
 export { anatomy as tabsAnatomy } from '@zag-js/tabs';

package/dist/components/listbox/listbox.anatomy.d.cts

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const listboxAnatomy: AnatomyInstance<"root" | "label" | "content" | "valueText" | "input" | "item" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
+export declare const listboxAnatomy: AnatomyInstance<"root" | "itemGroup" | "item" | "label" | "content" | "valueText" | "input" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;

package/dist/components/listbox/listbox.anatomy.d.ts

@@ -1,2 +1,2 @@
 import { AnatomyInstance } from '@zag-js/anatomy';
-export declare const listboxAnatomy: AnatomyInstance<"root" | "label" | "content" | "valueText" | "input" | "item" | "itemGroup" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;
+export declare const listboxAnatomy: AnatomyInstance<"root" | "itemGroup" | "item" | "label" | "content" | "valueText" | "input" | "itemGroupLabel" | "itemIndicator" | "itemText" | "empty">;

package/dist/components/marquee/marquee-content.vue.cjs

@@ -5,19 +5,27 @@ Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toString
 const vue = require('vue');
 const factory = require('../factory.cjs');
 const useForwardExpose = require('../../utils/use-forward-expose.cjs');
+const useScopeId = require('../../utils/use-scope-id.cjs');
 const useMarqueeContext = require('./use-marquee-context.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{ inheritAttrs: false },
   __name: "marquee-content",
   props: {
     asChild: { type: Boolean }
   },
   setup(__props) {
     const marquee = useMarqueeContext.useMarqueeContext();
+    const attrs = vue.useAttrs();
+    const scopeId = useScopeId.useScopeId();
     useForwardExpose.useForwardExpose();
     return (_ctx, _cache) => {
       return vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(Array.from({ length: vue.unref(marquee).contentCount }), (_, index) => {
-        return vue.openBlock(), vue.createBlock(vue.unref(factory.ark).div, vue.mergeProps({ key: index }, { ref_for: true }, vue.unref(marquee).getContentProps({ index }), { "as-child": __props.asChild }), {
+        return vue.openBlock(), vue.createBlock(vue.unref(factory.ark).div, vue.mergeProps({ key: index }, { ref_for: true }, {
+          ...vue.unref(attrs),
+          ...vue.unref(scopeId) ? { [vue.unref(scopeId)]: "" } : {},
+          ...vue.unref(marquee).getContentProps({ index })
+        }, { "as-child": __props.asChild }), {
           default: vue.withCtx(() => [
             vue.renderSlot(_ctx.$slots, "default")
           ]),

package/dist/components/marquee/marquee-content.vue.js

@@ -1,19 +1,27 @@
-import { defineComponent, createElementBlock, openBlock, Fragment, renderList, unref, createBlock, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, useAttrs, createElementBlock, openBlock, Fragment, renderList, unref, createBlock, mergeProps, withCtx, renderSlot } from 'vue';
 import { ark } from '../factory.js';
 import { useForwardExpose } from '../../utils/use-forward-expose.js';
+import { useScopeId } from '../../utils/use-scope-id.js';
 import { useMarqueeContext } from './use-marquee-context.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ inheritAttrs: false },
   __name: "marquee-content",
   props: {
     asChild: { type: Boolean }
   },
   setup(__props) {
     const marquee = useMarqueeContext();
+    const attrs = useAttrs();
+    const scopeId = useScopeId();
     useForwardExpose();
     return (_ctx, _cache) => {
       return openBlock(true), createElementBlock(Fragment, null, renderList(Array.from({ length: unref(marquee).contentCount }), (_, index) => {
-        return openBlock(), createBlock(unref(ark).div, mergeProps({ key: index }, { ref_for: true }, unref(marquee).getContentProps({ index }), { "as-child": __props.asChild }), {
+        return openBlock(), createBlock(unref(ark).div, mergeProps({ key: index }, { ref_for: true }, {
+          ...unref(attrs),
+          ...unref(scopeId) ? { [unref(scopeId)]: "" } : {},
+          ...unref(marquee).getContentProps({ index })
+        }, { "as-child": __props.asChild }), {
           default: withCtx(() => [
             renderSlot(_ctx.$slots, "default")
           ]),

package/dist/components/menu/index.d.cts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails as MenuHighlightChangeDetails, OpenChangeDetails as MenuOpenChangeDetails, SelectionDetails as MenuSelectionDetails, } from '@zag-js/menu';
+export type { FocusOutsideEvent as MenuFocusOutsideEvent, HighlightChangeDetails as MenuHighlightChangeDetails, InteractOutsideEvent as MenuInteractOutsideEvent, OpenChangeDetails as MenuOpenChangeDetails, PointerDownOutsideEvent as MenuPointerDownOutsideEvent, SelectionDetails as MenuSelectionDetails, } from '@zag-js/menu';
 export { default as MenuArrowTip, type MenuArrowTipBaseProps, type MenuArrowTipProps } from './menu-arrow-tip.vue';
 export { default as MenuArrow, type MenuArrowBaseProps, type MenuArrowProps } from './menu-arrow.vue';
 export { default as MenuCheckboxItem, type MenuCheckboxItemBaseProps, type MenuCheckboxItemEmits, type MenuCheckboxItemProps, } from './menu-checkbox-item.vue';

package/dist/components/menu/index.d.ts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails as MenuHighlightChangeDetails, OpenChangeDetails as MenuOpenChangeDetails, SelectionDetails as MenuSelectionDetails, } from '@zag-js/menu';
+export type { FocusOutsideEvent as MenuFocusOutsideEvent, HighlightChangeDetails as MenuHighlightChangeDetails, InteractOutsideEvent as MenuInteractOutsideEvent, OpenChangeDetails as MenuOpenChangeDetails, PointerDownOutsideEvent as MenuPointerDownOutsideEvent, SelectionDetails as MenuSelectionDetails, } from '@zag-js/menu';
 export { default as MenuArrowTip, type MenuArrowTipBaseProps, type MenuArrowTipProps } from './menu-arrow-tip.vue';
 export { default as MenuArrow, type MenuArrowBaseProps, type MenuArrowProps } from './menu-arrow.vue';
 export { default as MenuCheckboxItem, type MenuCheckboxItemBaseProps, type MenuCheckboxItemEmits, type MenuCheckboxItemProps, } from './menu-checkbox-item.vue';

package/dist/components/menu/menu-root.vue.d.cts

@@ -3,7 +3,7 @@ import { PolymorphicProps } from '../factory';
 import { RootEmits, RootProps } from './menu.types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
 import { SelectionDetails, OpenChangeDetails, HighlightChangeDetails } from '@zag-js/menu';
-import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/bottom-sheet';
+import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/interact-outside';
 export interface MenuRootBaseProps extends RootProps, RenderStrategyProps, PolymorphicProps {
 }
 export interface MenuRootProps extends MenuRootBaseProps {

package/dist/components/menu/menu-root.vue.d.ts

@@ -3,7 +3,7 @@ import { PolymorphicProps } from '../factory';
 import { RootEmits, RootProps } from './menu.types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
 import { SelectionDetails, OpenChangeDetails, HighlightChangeDetails } from '@zag-js/menu';
-import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/bottom-sheet';
+import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/interact-outside';
 export interface MenuRootBaseProps extends RootProps, RenderStrategyProps, PolymorphicProps {
 }
 export interface MenuRootProps extends MenuRootBaseProps {

package/dist/components/menu/menu.d.cts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails, OpenChangeDetails, SelectionDetails } from '@zag-js/menu';
+export type { FocusOutsideEvent, HighlightChangeDetails, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, SelectionDetails, } from '@zag-js/menu';
 export { default as ArrowTip, type MenuArrowTipProps as ArrowTipProps, type MenuArrowTipBaseProps as ArrowTipBaseProps, } from './menu-arrow-tip.vue';
 export { default as Arrow, type MenuArrowProps as ArrowProps, type MenuArrowBaseProps as ArrowBaseProps, } from './menu-arrow.vue';
 export { default as CheckboxItem, type MenuCheckboxItemEmits as CheckboxItemEmits, type MenuCheckboxItemBaseProps as CheckboxItemBaseProps, type MenuCheckboxItemProps as CheckboxItemProps, } from './menu-checkbox-item.vue';

package/dist/components/menu/menu.d.ts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails, OpenChangeDetails, SelectionDetails } from '@zag-js/menu';
+export type { FocusOutsideEvent, HighlightChangeDetails, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, SelectionDetails, } from '@zag-js/menu';
 export { default as ArrowTip, type MenuArrowTipProps as ArrowTipProps, type MenuArrowTipBaseProps as ArrowTipBaseProps, } from './menu-arrow-tip.vue';
 export { default as Arrow, type MenuArrowProps as ArrowProps, type MenuArrowBaseProps as ArrowBaseProps, } from './menu-arrow.vue';
 export { default as CheckboxItem, type MenuCheckboxItemEmits as CheckboxItemEmits, type MenuCheckboxItemBaseProps as CheckboxItemBaseProps, type MenuCheckboxItemProps as CheckboxItemProps, } from './menu-checkbox-item.vue';

package/dist/components/popover/index.d.cts

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails as PopoverOpenChangeDetails } from '@zag-js/popover';
+export type { FocusOutsideEvent as PopoverFocusOutsideEvent, InteractOutsideEvent as PopoverInteractOutsideEvent, OpenChangeDetails as PopoverOpenChangeDetails, PointerDownOutsideEvent as PopoverPointerDownOutsideEvent, } from '@zag-js/popover';
 export { default as PopoverAnchor, type PopoverAnchorBaseProps, type PopoverAnchorProps } from './popover-anchor.vue';
 export { default as PopoverArrowTip, type PopoverArrowTipBaseProps, type PopoverArrowTipProps, } from './popover-arrow-tip.vue';
 export { default as PopoverArrow, type PopoverArrowBaseProps, type PopoverArrowProps } from './popover-arrow.vue';

package/dist/components/popover/index.d.ts

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails as PopoverOpenChangeDetails } from '@zag-js/popover';
+export type { FocusOutsideEvent as PopoverFocusOutsideEvent, InteractOutsideEvent as PopoverInteractOutsideEvent, OpenChangeDetails as PopoverOpenChangeDetails, PointerDownOutsideEvent as PopoverPointerDownOutsideEvent, } from '@zag-js/popover';
 export { default as PopoverAnchor, type PopoverAnchorBaseProps, type PopoverAnchorProps } from './popover-anchor.vue';
 export { default as PopoverArrowTip, type PopoverArrowTipBaseProps, type PopoverArrowTipProps, } from './popover-arrow-tip.vue';
 export { default as PopoverArrow, type PopoverArrowBaseProps, type PopoverArrowProps } from './popover-arrow.vue';

package/dist/components/popover/popover-root.vue.d.cts

@@ -2,7 +2,7 @@ import { RenderStrategyProps } from '../../utils/use-render-strategy';
 import { RootEmits, RootProps } from './popover.types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
 import { OpenChangeDetails } from '@zag-js/popover';
-import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/bottom-sheet';
+import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/interact-outside';
 export interface PopoverRootBaseProps extends RootProps, RenderStrategyProps {
 }
 export interface PopoverRootProps extends PopoverRootBaseProps {

package/dist/components/popover/popover-root.vue.d.ts

@@ -2,7 +2,7 @@ import { RenderStrategyProps } from '../../utils/use-render-strategy';
 import { RootEmits, RootProps } from './popover.types';
 import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
 import { OpenChangeDetails } from '@zag-js/popover';
-import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/bottom-sheet';
+import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/interact-outside';
 export interface PopoverRootBaseProps extends RootProps, RenderStrategyProps {
 }
 export interface PopoverRootProps extends PopoverRootBaseProps {

package/dist/components/popover/popover.d.cts

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails } from '@zag-js/popover';
+export type { FocusOutsideEvent, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, } from '@zag-js/popover';
 export { default as Anchor, type PopoverAnchorProps as AnchorProps, type PopoverAnchorBaseProps as AnchorBaseProps, } from './popover-anchor.vue';
 export { default as ArrowTip, type PopoverArrowTipProps as ArrowTipProps, type PopoverArrowTipBaseProps as ArrowTipBaseProps, } from './popover-arrow-tip.vue';
 export { default as Arrow, type PopoverArrowProps as ArrowProps, type PopoverArrowBaseProps as ArrowBaseProps, } from './popover-arrow.vue';

package/dist/components/popover/popover.d.ts

@@ -1,4 +1,4 @@
-export type { OpenChangeDetails } from '@zag-js/popover';
+export type { FocusOutsideEvent, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, } from '@zag-js/popover';
 export { default as Anchor, type PopoverAnchorProps as AnchorProps, type PopoverAnchorBaseProps as AnchorBaseProps, } from './popover-anchor.vue';
 export { default as ArrowTip, type PopoverArrowTipProps as ArrowTipProps, type PopoverArrowTipBaseProps as ArrowTipBaseProps, } from './popover-arrow-tip.vue';
 export { default as Arrow, type PopoverArrowProps as ArrowProps, type PopoverArrowBaseProps as ArrowBaseProps, } from './popover-arrow.vue';

package/dist/components/segment-group/segment-group.anatomy.d.cts

@@ -1,3 +1,3 @@
 import { Anatomy, AnatomyPart } from '@zag-js/anatomy';
-export declare const segmentGroupAnatomy: Anatomy<"root" | "label" | "indicator" | "item" | "itemText" | "itemControl">;
-export declare const parts: Record<"root" | "label" | "indicator" | "item" | "itemText" | "itemControl", AnatomyPart>;
+export declare const segmentGroupAnatomy: Anatomy<"root" | "item" | "indicator" | "label" | "itemText" | "itemControl">;
+export declare const parts: Record<"root" | "item" | "indicator" | "label" | "itemText" | "itemControl", AnatomyPart>;

package/dist/components/segment-group/segment-group.anatomy.d.ts

@@ -1,3 +1,3 @@
 import { Anatomy, AnatomyPart } from '@zag-js/anatomy';
-export declare const segmentGroupAnatomy: Anatomy<"root" | "label" | "indicator" | "item" | "itemText" | "itemControl">;
-export declare const parts: Record<"root" | "label" | "indicator" | "item" | "itemText" | "itemControl", AnatomyPart>;
+export declare const segmentGroupAnatomy: Anatomy<"root" | "item" | "indicator" | "label" | "itemText" | "itemControl">;
+export declare const parts: Record<"root" | "item" | "indicator" | "label" | "itemText" | "itemControl", AnatomyPart>;

package/dist/components/select/index.d.cts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails as SelectHighlightChangeDetails, OpenChangeDetails as SelectOpenChangeDetails, ValueChangeDetails as SelectValueChangeDetails, } from '@zag-js/select';
+export type { FocusOutsideEvent as SelectFocusOutsideEvent, HighlightChangeDetails as SelectHighlightChangeDetails, InteractOutsideEvent as SelectInteractOutsideEvent, OpenChangeDetails as SelectOpenChangeDetails, PointerDownOutsideEvent as SelectPointerDownOutsideEvent, ValueChangeDetails as SelectValueChangeDetails, } from '@zag-js/select';
 export { createListCollection, type CollectionItem, type ListCollection, useListCollection, type UseListCollectionProps, } from '../collection';
 export { default as SelectClearTrigger, type SelectClearTriggerBaseProps, type SelectClearTriggerProps, } from './select-clear-trigger.vue';
 export { default as SelectContent, type SelectContentBaseProps, type SelectContentProps } from './select-content.vue';

package/dist/components/select/index.d.ts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails as SelectHighlightChangeDetails, OpenChangeDetails as SelectOpenChangeDetails, ValueChangeDetails as SelectValueChangeDetails, } from '@zag-js/select';
+export type { FocusOutsideEvent as SelectFocusOutsideEvent, HighlightChangeDetails as SelectHighlightChangeDetails, InteractOutsideEvent as SelectInteractOutsideEvent, OpenChangeDetails as SelectOpenChangeDetails, PointerDownOutsideEvent as SelectPointerDownOutsideEvent, ValueChangeDetails as SelectValueChangeDetails, } from '@zag-js/select';
 export { createListCollection, type CollectionItem, type ListCollection, useListCollection, type UseListCollectionProps, } from '../collection';
 export { default as SelectClearTrigger, type SelectClearTriggerBaseProps, type SelectClearTriggerProps, } from './select-clear-trigger.vue';
 export { default as SelectContent, type SelectContentBaseProps, type SelectContentProps } from './select-content.vue';

package/dist/components/select/select-root.vue.d.cts

@@ -5,7 +5,7 @@ import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { RootProps } from './select.types';
 import { SelectionDetails, ValueChangeDetails, OpenChangeDetails, HighlightChangeDetails } from '@zag-js/select';
-import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/bottom-sheet';
+import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/interact-outside';
 export interface SelectRootBaseProps<T extends CollectionItem> extends RootProps<T>, RenderStrategyProps, PolymorphicProps {
 }
 export interface SelectRootProps<T extends CollectionItem> extends SelectRootBaseProps<T>, 

package/dist/components/select/select-root.vue.d.ts

@@ -5,7 +5,7 @@ import { CollectionItem } from '../collection';
 import { PolymorphicProps } from '../factory';
 import { RootProps } from './select.types';
 import { SelectionDetails, ValueChangeDetails, OpenChangeDetails, HighlightChangeDetails } from '@zag-js/select';
-import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/bottom-sheet';
+import { FocusOutsideEvent, InteractOutsideEvent, PointerDownOutsideEvent } from '@zag-js/interact-outside';
 export interface SelectRootBaseProps<T extends CollectionItem> extends RootProps<T>, RenderStrategyProps, PolymorphicProps {
 }
 export interface SelectRootProps<T extends CollectionItem> extends SelectRootBaseProps<T>, 

package/dist/components/select/select.d.cts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails, OpenChangeDetails, ValueChangeDetails } from '@zag-js/select';
+export type { FocusOutsideEvent, HighlightChangeDetails, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, ValueChangeDetails, } from '@zag-js/select';
 export type { CollectionItem, ListCollection } from '../collection';
 export { default as ClearTrigger, type SelectClearTriggerProps as ClearTriggerProps, type SelectClearTriggerBaseProps as ClearTriggerBaseProps, } from './select-clear-trigger.vue';
 export { default as Content, type SelectContentProps as ContentProps, type SelectContentBaseProps as ContentBaseProps, } from './select-content.vue';

package/dist/components/select/select.d.ts

@@ -1,4 +1,4 @@
-export type { HighlightChangeDetails, OpenChangeDetails, ValueChangeDetails } from '@zag-js/select';
+export type { FocusOutsideEvent, HighlightChangeDetails, InteractOutsideEvent, OpenChangeDetails, PointerDownOutsideEvent, ValueChangeDetails, } from '@zag-js/select';
 export type { CollectionItem, ListCollection } from '../collection';
 export { default as ClearTrigger, type SelectClearTriggerProps as ClearTriggerProps, type SelectClearTriggerBaseProps as ClearTriggerBaseProps, } from './select-clear-trigger.vue';
 export { default as Content, type SelectContentProps as ContentProps, type SelectContentBaseProps as ContentBaseProps, } from './select-content.vue';