@moduix/react 2.1.0 → 2.2.4

package/dist/components/scroll-area/ScrollArea.js

@@ -1,79 +1,79 @@
-import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
-import ScrollArea_module_default from "./ScrollArea.module.js";
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { ScrollArea, useScrollArea, useScrollAreaContext } from "@ark-ui/react/scroll-area";
 import { clsx } from "clsx";
 import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-import { ScrollArea, useScrollArea } from "@ark-ui/react/scroll-area";
-//#region src/components/scroll-area/ScrollArea.tsx
-const ScrollAreaRoot = forwardRef(function ScrollAreaRoot({ className, fade, variant = "hover", ...props }, ref) {
-	return /* @__PURE__ */ jsx(ScrollArea.Root, {
-		ref,
-		"data-slot": "scroll-area-root",
-		"data-fade": fade ? "" : void 0,
-		"data-variant": variant,
-		className: clsx(ScrollArea_module_default.root, normalizeClassName(className)),
-		...props
-	});
+import { normalizeClassName } from "../../internal/normalizeClassName.js";
+import ScrollArea_module from "./ScrollArea.module.js";
+const ScrollArea_ScrollAreaRoot = /*#__PURE__*/ forwardRef(function({ className, fade, variant = 'hover', ...props }, ref) {
+    return /*#__PURE__*/ jsx(ScrollArea.Root, {
+        ref: ref,
+        ...props,
+        "data-slot": "scroll-area-root",
+        "data-fade": fade ? '' : void 0,
+        "data-variant": variant,
+        className: clsx(ScrollArea_module.root, normalizeClassName(className))
+    });
 });
-const ScrollAreaRootProvider = forwardRef(function ScrollAreaRootProvider({ className, fade, variant = "hover", ...props }, ref) {
-	return /* @__PURE__ */ jsx(ScrollArea.RootProvider, {
-		ref,
-		"data-slot": "scroll-area-root-provider",
-		"data-fade": fade ? "" : void 0,
-		"data-variant": variant,
-		className: clsx(ScrollArea_module_default.root, normalizeClassName(className)),
-		...props
-	});
+const ScrollArea_ScrollAreaRootProvider = /*#__PURE__*/ forwardRef(function({ className, fade, variant = 'hover', ...props }, ref) {
+    return /*#__PURE__*/ jsx(ScrollArea.RootProvider, {
+        ref: ref,
+        ...props,
+        "data-slot": "scroll-area-root-provider",
+        "data-fade": fade ? '' : void 0,
+        "data-variant": variant,
+        className: clsx(ScrollArea_module.root, normalizeClassName(className))
+    });
 });
-const ScrollAreaViewport = forwardRef(function ScrollAreaViewport({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(ScrollArea.Viewport, {
-		ref,
-		"data-slot": "scroll-area-viewport",
-		className: clsx(ScrollArea_module_default.viewport, normalizeClassName(className)),
-		...props
-	});
+const ScrollArea_ScrollAreaViewport = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ScrollArea.Viewport, {
+        ref: ref,
+        ...props,
+        "data-slot": "scroll-area-viewport",
+        className: clsx(ScrollArea_module.viewport, normalizeClassName(className))
+    });
 });
-const ScrollAreaContent = forwardRef(function ScrollAreaContent({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(ScrollArea.Content, {
-		ref,
-		"data-slot": "scroll-area-content",
-		className: clsx(ScrollArea_module_default.content, normalizeClassName(className)),
-		...props
-	});
+const ScrollArea_ScrollAreaContent = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ScrollArea.Content, {
+        ref: ref,
+        ...props,
+        "data-slot": "scroll-area-content",
+        className: clsx(ScrollArea_module.content, normalizeClassName(className))
+    });
 });
-const ScrollAreaScrollbar = forwardRef(function ScrollAreaScrollbar({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(ScrollArea.Scrollbar, {
-		ref,
-		"data-slot": "scroll-area-scrollbar",
-		className: clsx(ScrollArea_module_default.scrollbar, normalizeClassName(className)),
-		...props
-	});
+const ScrollArea_ScrollAreaScrollbar = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ScrollArea.Scrollbar, {
+        ref: ref,
+        ...props,
+        "data-slot": "scroll-area-scrollbar",
+        className: clsx(ScrollArea_module.scrollbar, normalizeClassName(className))
+    });
 });
-const ScrollAreaThumb = forwardRef(function ScrollAreaThumb({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(ScrollArea.Thumb, {
-		ref,
-		"data-slot": "scroll-area-thumb",
-		className: clsx(ScrollArea_module_default.thumb, normalizeClassName(className)),
-		...props
-	});
+const ScrollArea_ScrollAreaThumb = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ScrollArea.Thumb, {
+        ref: ref,
+        ...props,
+        "data-slot": "scroll-area-thumb",
+        className: clsx(ScrollArea_module.thumb, normalizeClassName(className))
+    });
 });
-const ScrollAreaCorner = forwardRef(function ScrollAreaCorner({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(ScrollArea.Corner, {
-		ref,
-		"data-slot": "scroll-area-corner",
-		className: clsx(ScrollArea_module_default.corner, normalizeClassName(className)),
-		...props
-	});
+const ScrollArea_ScrollAreaCorner = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(ScrollArea.Corner, {
+        ref: ref,
+        ...props,
+        "data-slot": "scroll-area-corner",
+        className: clsx(ScrollArea_module.corner, normalizeClassName(className))
+    });
 });
-const ScrollArea$1 = Object.assign(ScrollAreaRoot, {
-	Root: ScrollAreaRoot,
-	RootProvider: ScrollAreaRootProvider,
-	Viewport: ScrollAreaViewport,
-	Content: ScrollAreaContent,
-	Scrollbar: ScrollAreaScrollbar,
-	Thumb: ScrollAreaThumb,
-	Corner: ScrollAreaCorner,
-	useScrollArea
+const ScrollArea_ScrollArea = Object.assign(ScrollArea_ScrollAreaRoot, {
+    Root: ScrollArea_ScrollAreaRoot,
+    RootProvider: ScrollArea_ScrollAreaRootProvider,
+    Context: ScrollArea.Context,
+    Viewport: ScrollArea_ScrollAreaViewport,
+    Content: ScrollArea_ScrollAreaContent,
+    Scrollbar: ScrollArea_ScrollAreaScrollbar,
+    Thumb: ScrollArea_ScrollAreaThumb,
+    Corner: ScrollArea_ScrollAreaCorner,
+    useScrollArea: useScrollArea
 });
-//#endregion
-export { ScrollArea$1 as ScrollArea, useScrollArea };
+export { ScrollArea_ScrollArea as ScrollArea, useScrollArea, useScrollAreaContext };

package/dist/components/scroll-area/ScrollArea.module.js

@@ -1,12 +1,10 @@
-import './ScrollArea.css';
-//#region src/components/scroll-area/ScrollArea.module.css
-var ScrollArea_module_default = {
-	"content": "xqtLha_content",
-	"corner": "xqtLha_corner",
-	"root": "xqtLha_root",
-	"scrollbar": "xqtLha_scrollbar",
-	"thumb": "xqtLha_thumb",
-	"viewport": "xqtLha_viewport"
+import "./ScrollArea_module.css";
+const ScrollArea_module = {
+    root: "root-FtAkRy",
+    viewport: "viewport-SrqU1k",
+    content: "content-PFPQ4z",
+    scrollbar: "scrollbar-LN_VI4",
+    thumb: "thumb-eKzpKM",
+    corner: "corner-dcr1vM"
 };
-//#endregion
-export { ScrollArea_module_default as default };
+export default ScrollArea_module;

package/dist/components/scroll-area/ScrollArea_module.css

@@ -0,0 +1,176 @@
+@layer moduix.components {
+  .root-FtAkRy {
+    box-sizing: border-box;
+    width: var(--moduix-scroll-area-width, 100%);
+    height: var(--moduix-scroll-area-height, 100%);
+    min-width: 0;
+    min-height: 0;
+    color: var(--moduix-scroll-area-color, var(--moduix-color-foreground));
+    position: relative;
+  }
+
+  .viewport-SrqU1k {
+    box-sizing: border-box;
+    border-radius: var(--moduix-scroll-area-radius, var(--moduix-radius-md));
+    background-color: var(--moduix-scroll-area-bg, transparent);
+    scrollbar-width: none;
+    --_scroll-area-block-fade-mask: linear-gradient(to bottom,
+      transparent 0,
+      black
+        min(var(--moduix-scroll-area-fade-start-size, var(--moduix-scroll-area-fade-size, var(--moduix-spacing-10))),
+          var(--scroll-area-overflow-y-start, 0px)),
+      black
+        calc(100% -
+            min(var(--moduix-scroll-area-fade-end-size, var(--moduix-scroll-area-fade-size, var(--moduix-spacing-10))),
+              var(--scroll-area-overflow-y-end, 0px))),
+      transparent 100%);
+    outline: 0;
+    width: 100%;
+    min-width: 0;
+    height: 100%;
+    min-height: 0;
+  }
+
+  .viewport-SrqU1k::-webkit-scrollbar {
+    display: none;
+  }
+
+  .root-FtAkRy[data-fade] .viewport-SrqU1k {
+    -webkit-mask-image: var(--_scroll-area-block-fade-mask);
+    mask-image: var(--_scroll-area-block-fade-mask);
+    -webkit-mask-repeat: no-repeat;
+    mask-repeat: no-repeat;
+  }
+
+  .viewport-SrqU1k:focus-visible {
+    outline: var(--moduix-scroll-area-focus-ring-width, var(--moduix-focus-ring-inset-width, var(--moduix-border-width-sm)))
+        solid var(--moduix-scroll-area-focus-ring-color, var(--moduix-color-ring));
+    outline-offset: var(--moduix-scroll-area-focus-ring-offset, var(--moduix-focus-ring-inset-offset));
+  }
+
+  .content-PFPQ4z {
+    box-sizing: border-box;
+    padding: var(--moduix-scroll-area-content-padding, 0);
+    display: block;
+  }
+
+  .scrollbar-LN_VI4 {
+    --_scroll-area-scrollbar-margin: var(--moduix-scroll-area-scrollbar-margin, var(--moduix-spacing-1));
+    --_scroll-area-scrollbar-hit-area-size: var(--moduix-scroll-area-scrollbar-hit-area-size, var(--moduix-spacing-5));
+    box-sizing: border-box;
+    padding: var(--moduix-scroll-area-scrollbar-padding, 0);
+    border-radius: var(--moduix-scroll-area-scrollbar-radius, var(--moduix-radius-md));
+    background-color: var(--moduix-scroll-area-scrollbar-bg, transparent);
+    opacity: var(--moduix-scroll-area-scrollbar-hidden-opacity, 0);
+    pointer-events: none;
+    -webkit-user-select: none;
+    user-select: none;
+    touch-action: none;
+    transition: opacity var(--moduix-scroll-area-transition, var(--moduix-transition-default)),
+      width var(--moduix-scroll-area-thumb-hover-transition, var(--moduix-transition-fast)),
+      height var(--moduix-scroll-area-thumb-hover-transition, var(--moduix-transition-fast));
+    justify-content: center;
+    display: flex;
+    position: absolute;
+  }
+
+  .scrollbar-LN_VI4:before {
+    content: "";
+    position: absolute;
+  }
+
+  .scrollbar-LN_VI4[data-orientation="vertical"] {
+    top: 0;
+    inset-inline-end: 0;
+    bottom: var(--corner-height, 0px);
+    width: var(--moduix-scroll-area-scrollbar-size, var(--moduix-spacing-1));
+    margin-block: var(--_scroll-area-scrollbar-margin);
+    margin-inline-end: var(--_scroll-area-scrollbar-margin);
+  }
+
+  .scrollbar-LN_VI4[data-orientation="vertical"]:before {
+    width: var(--_scroll-area-scrollbar-hit-area-size);
+    height: 100%;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+
+  .scrollbar-LN_VI4[data-orientation="vertical"]:not([data-overflow-y]) {
+    display: none;
+  }
+
+  .scrollbar-LN_VI4[data-orientation="vertical"]:hover, .scrollbar-LN_VI4[data-orientation="vertical"][data-dragging] {
+    width: calc(var(--moduix-scroll-area-scrollbar-size, var(--moduix-spacing-1)) +
+            var(--moduix-scroll-area-thumb-hover-increase, 2px));
+  }
+
+  .scrollbar-LN_VI4[data-orientation="horizontal"] {
+    inset-inline-start: 0;
+    inset-inline-end: var(--corner-width, 0px);
+    height: var(--moduix-scroll-area-scrollbar-size, var(--moduix-spacing-1));
+    margin-inline: var(--_scroll-area-scrollbar-margin);
+    flex-direction: column;
+    margin-block-end: var(--_scroll-area-scrollbar-margin);
+    bottom: 0;
+  }
+
+  .scrollbar-LN_VI4[data-orientation="horizontal"]:before {
+    width: 100%;
+    height: var(--_scroll-area-scrollbar-hit-area-size);
+    bottom: 50%;
+    left: 0;
+    right: 0;
+    transform: translateY(50%);
+  }
+
+  .scrollbar-LN_VI4[data-orientation="horizontal"]:not([data-overflow-x]) {
+    display: none;
+  }
+
+  .scrollbar-LN_VI4[data-orientation="horizontal"]:hover, .scrollbar-LN_VI4[data-orientation="horizontal"][data-dragging] {
+    height: calc(var(--moduix-scroll-area-scrollbar-size, var(--moduix-spacing-1)) +
+            var(--moduix-scroll-area-thumb-hover-increase, 2px));
+  }
+
+  .scrollbar-LN_VI4[data-hover], .scrollbar-LN_VI4[data-scrolling] {
+    opacity: var(--moduix-scroll-area-scrollbar-visible-opacity, 1);
+    pointer-events: auto;
+  }
+
+  .scrollbar-LN_VI4[data-scrolling] {
+    transition-duration: 0s;
+  }
+
+  .root-FtAkRy[data-variant="always"] .scrollbar-LN_VI4 {
+    opacity: var(--moduix-scroll-area-scrollbar-visible-opacity, 1);
+    pointer-events: auto;
+  }
+
+  .thumb-eKzpKM {
+    box-sizing: border-box;
+    border-radius: var(--moduix-scroll-area-thumb-radius, var(--moduix-radius-full));
+    background-color: var(--moduix-scroll-area-thumb-bg, var(--moduix-color-border));
+  }
+
+  .thumb-eKzpKM[data-orientation="vertical"] {
+    width: 100%;
+    min-height: var(--moduix-scroll-area-thumb-min-size, var(--moduix-size-xs));
+  }
+
+  .thumb-eKzpKM[data-orientation="horizontal"] {
+    height: 100%;
+    min-width: var(--moduix-scroll-area-thumb-min-size, var(--moduix-size-xs));
+  }
+
+  .corner-dcr1vM {
+    box-sizing: border-box;
+    background-color: var(--moduix-scroll-area-corner-bg, var(--moduix-scroll-area-scrollbar-bg, transparent));
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .scrollbar-LN_VI4 {
+      transition: none;
+    }
+  }
+}
+

package/dist/components/scroll-area/index.d.ts

@@ -1,2 +1,2 @@
-import { ModuixScrollAreaRootProps, ModuixScrollAreaRootProviderProps, ScrollArea } from "./ScrollArea.js";
-export { type ModuixScrollAreaRootProps, type ModuixScrollAreaRootProviderProps, ScrollArea };
+export { ScrollArea, useScrollArea, useScrollAreaContext } from './ScrollArea.js';
+export type { ModuixScrollAreaRootProps, ModuixScrollAreaRootProviderProps } from './ScrollArea.js';

package/dist/components/scroll-area/index.js

@@ -0,0 +1 @@
+export { ScrollArea, useScrollArea, useScrollAreaContext } from "./ScrollArea.js";

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

@@ -1,25 +1,24 @@
-import { ReactNode } from "react";
-import { SegmentGroup, useSegmentGroup } from "@ark-ui/react/segment-group";
-
-//#region src/components/segment-group/SegmentGroup.d.ts
-declare function SegmentGroupItems({
-  items
-}: {
-  items: readonly {
-    value: string;
-    label: ReactNode;
-    disabled?: boolean;
-  }[];
+import { SegmentGroup as SegmentGroupPrimitive, useSegmentGroup as useSegmentGroupPrimitive, useSegmentGroupContext, useSegmentGroupItemContext } from '@ark-ui/react/segment-group';
+import type { ReactNode } from 'react';
+type SegmentGroupMachineProps = Parameters<typeof useSegmentGroupPrimitive>[0];
+declare function useSegmentGroup(props?: SegmentGroupMachineProps): import("@ark-ui/react/segment-group").UseSegmentGroupReturn;
+declare function SegmentGroupItems({ items, }: {
+    items: readonly {
+        value: string;
+        label: ReactNode;
+        disabled?: boolean;
+    }[];
 }): import("react").JSX.Element[];
-declare const SegmentGroup$1: import("react").ForwardRefExoticComponent<Omit<SegmentGroup.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
-  Root: import("react").ForwardRefExoticComponent<Omit<SegmentGroup.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  RootProvider: import("react").ForwardRefExoticComponent<Omit<SegmentGroup.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Label: import("react").ForwardRefExoticComponent<Omit<SegmentGroup.LabelProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
-  Item: import("react").ForwardRefExoticComponent<Omit<SegmentGroup.ItemProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
-  ItemControl: import("react").ForwardRefExoticComponent<Omit<SegmentGroup.ItemControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  ItemText: import("react").ForwardRefExoticComponent<Omit<SegmentGroup.ItemTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
-  Indicator: import("react").ForwardRefExoticComponent<Omit<SegmentGroup.IndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Items: typeof SegmentGroupItems;
+declare const SegmentGroup: import("react").ForwardRefExoticComponent<Omit<SegmentGroupPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>> & {
+    Root: import("react").ForwardRefExoticComponent<Omit<SegmentGroupPrimitive.RootProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    RootProvider: import("react").ForwardRefExoticComponent<Omit<SegmentGroupPrimitive.RootProviderProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Context: (props: SegmentGroupPrimitive.ContextProps) => ReactNode;
+    ItemContext: (props: SegmentGroupPrimitive.ItemContextProps) => ReactNode;
+    Label: import("react").ForwardRefExoticComponent<Omit<SegmentGroupPrimitive.LabelProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Item: import("react").ForwardRefExoticComponent<Omit<SegmentGroupPrimitive.ItemProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+    ItemControl: import("react").ForwardRefExoticComponent<Omit<SegmentGroupPrimitive.ItemControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ItemText: import("react").ForwardRefExoticComponent<Omit<SegmentGroupPrimitive.ItemTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    Indicator: import("react").ForwardRefExoticComponent<Omit<SegmentGroupPrimitive.IndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Items: typeof SegmentGroupItems;
 };
-//#endregion
-export { SegmentGroup$1 as SegmentGroup, useSegmentGroup };
+export { SegmentGroup, useSegmentGroup, useSegmentGroupContext, useSegmentGroupItemContext };

package/dist/components/segment-group/SegmentGroup.js

@@ -1,91 +1,134 @@
-import { normalizeClassName } from "../../lib/moduix/normalizeClassName.js";
-import SegmentGroup_module_default from "./SegmentGroup.module.js";
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useFieldContext } from "@ark-ui/react/field";
+import { useFieldsetContext } from "@ark-ui/react/fieldset";
+import { SegmentGroup, useSegmentGroup, useSegmentGroupContext, useSegmentGroupItemContext } from "@ark-ui/react/segment-group";
 import { clsx } from "clsx";
 import { Children, cloneElement, forwardRef } from "react";
-import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { SegmentGroup, useSegmentGroup } from "@ark-ui/react/segment-group";
-//#region src/components/segment-group/SegmentGroup.tsx
-const SegmentGroupRoot = forwardRef(function SegmentGroupRoot({ className, orientation = "horizontal", ...props }, ref) {
-	return /* @__PURE__ */ jsx(SegmentGroup.Root, {
-		ref,
-		orientation,
-		"data-slot": "segment-group-root",
-		className: clsx(SegmentGroup_module_default.root, normalizeClassName(className)),
-		...props
-	});
+import { normalizeClassName } from "../../internal/normalizeClassName.js";
+import SegmentGroup_module from "./SegmentGroup.module.js";
+function omitUndefined(props) {
+    return Object.fromEntries(Object.entries(props).filter(([, value])=>void 0 !== value));
+}
+function SegmentGroup_useSegmentGroup(props) {
+    const field = useFieldContext();
+    const fieldset = useFieldsetContext();
+    return useSegmentGroup({
+        disabled: field?.disabled ?? fieldset?.disabled,
+        invalid: field?.invalid ?? fieldset?.invalid,
+        readOnly: field?.readOnly,
+        required: field?.required,
+        ...omitUndefined(props ?? {})
+    });
+}
+const SegmentGroup_SegmentGroupRoot = /*#__PURE__*/ forwardRef(function({ className, defaultValue, disabled, form, id, ids, invalid, name, onValueChange, orientation = 'horizontal', readOnly, required, value, ...props }, ref) {
+    const segmentGroup = SegmentGroup_useSegmentGroup(omitUndefined({
+        defaultValue,
+        disabled,
+        form,
+        id,
+        ids,
+        invalid,
+        name,
+        onValueChange,
+        orientation,
+        readOnly,
+        required,
+        value
+    }));
+    return /*#__PURE__*/ jsx(SegmentGroup.RootProvider, {
+        ref: ref,
+        value: segmentGroup,
+        "data-slot": "segment-group-root",
+        className: clsx(SegmentGroup_module.root, normalizeClassName(className)),
+        ...props
+    });
 });
-const SegmentGroupRootProvider = forwardRef(function SegmentGroupRootProvider({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(SegmentGroup.RootProvider, {
-		ref,
-		"data-slot": "segment-group-root-provider",
-		className: clsx(SegmentGroup_module_default.root, normalizeClassName(className)),
-		...props
-	});
+const SegmentGroup_SegmentGroupRootProvider = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(SegmentGroup.RootProvider, {
+        ref: ref,
+        "data-slot": "segment-group-root-provider",
+        className: clsx(SegmentGroup_module.root, normalizeClassName(className)),
+        ...props
+    });
 });
-const SegmentGroupLabel = forwardRef(function SegmentGroupLabel({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(SegmentGroup.Label, {
-		ref,
-		"data-slot": "segment-group-label",
-		className: clsx(SegmentGroup_module_default.label, normalizeClassName(className)),
-		...props
-	});
+const SegmentGroup_SegmentGroupLabel = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(SegmentGroup.Label, {
+        ref: ref,
+        "data-slot": "segment-group-label",
+        className: clsx(SegmentGroup_module.label, normalizeClassName(className)),
+        ...props
+    });
 });
-const SegmentGroupItem = forwardRef(function SegmentGroupItem({ asChild, children, className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(SegmentGroup.Item, {
-		ref,
-		asChild,
-		"data-slot": "segment-group-item",
-		className: clsx(SegmentGroup_module_default.item, normalizeClassName(className)),
-		...props,
-		children: withItemHiddenInput(children, asChild)
-	});
+const SegmentGroup_SegmentGroupItem = /*#__PURE__*/ forwardRef(function({ asChild, children, className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(SegmentGroup.Item, {
+        ref: ref,
+        asChild: asChild,
+        "data-slot": "segment-group-item",
+        className: clsx(SegmentGroup_module.item, normalizeClassName(className)),
+        ...props,
+        children: withItemHiddenInput(children, asChild)
+    });
 });
-const SegmentGroupItemControl = forwardRef(function SegmentGroupItemControl({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(SegmentGroup.ItemControl, {
-		ref,
-		"data-slot": "segment-group-item-control",
-		className: clsx(SegmentGroup_module_default.itemControl, normalizeClassName(className)),
-		...props
-	});
+const SegmentGroup_SegmentGroupItemControl = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(SegmentGroup.ItemControl, {
+        ref: ref,
+        "data-slot": "segment-group-item-control",
+        className: clsx(SegmentGroup_module.itemControl, normalizeClassName(className)),
+        ...props
+    });
 });
-const SegmentGroupItemText = forwardRef(function SegmentGroupItemText({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(SegmentGroup.ItemText, {
-		ref,
-		"data-slot": "segment-group-item-text",
-		className: clsx(SegmentGroup_module_default.itemText, normalizeClassName(className)),
-		...props
-	});
+const SegmentGroup_SegmentGroupItemText = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(SegmentGroup.ItemText, {
+        ref: ref,
+        "data-slot": "segment-group-item-text",
+        className: clsx(SegmentGroup_module.itemText, normalizeClassName(className)),
+        ...props
+    });
 });
 function withItemHiddenInput(children, asChild) {
-	const hiddenInput = /* @__PURE__ */ jsx(SegmentGroup.ItemHiddenInput, { "data-slot": "segment-group-item-hidden-input" });
-	if (!asChild) return /* @__PURE__ */ jsxs(Fragment$1, { children: [children, hiddenInput] });
-	const child = Children.only(children);
-	return cloneElement(child, {}, child.props.children, hiddenInput);
+    const hiddenInput = /*#__PURE__*/ jsx(SegmentGroup.ItemHiddenInput, {
+        "data-slot": "segment-group-item-hidden-input"
+    });
+    if (!asChild) return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            children,
+            hiddenInput
+        ]
+    });
+    const child = Children.only(children);
+    return /*#__PURE__*/ cloneElement(child, {}, child.props.children, hiddenInput);
 }
-const SegmentGroupIndicator = forwardRef(function SegmentGroupIndicator({ className, ...props }, ref) {
-	return /* @__PURE__ */ jsx(SegmentGroup.Indicator, {
-		ref,
-		"data-slot": "segment-group-indicator",
-		className: clsx(SegmentGroup_module_default.indicator, normalizeClassName(className)),
-		...props
-	});
+const SegmentGroup_SegmentGroupIndicator = /*#__PURE__*/ forwardRef(function({ className, ...props }, ref) {
+    return /*#__PURE__*/ jsx(SegmentGroup.Indicator, {
+        ref: ref,
+        "data-slot": "segment-group-indicator",
+        className: clsx(SegmentGroup_module.indicator, normalizeClassName(className)),
+        ...props
+    });
 });
 function SegmentGroupItems({ items }) {
-	return items.map(({ value, label, disabled }) => /* @__PURE__ */ jsxs(SegmentGroupItem, {
-		value,
-		disabled,
-		children: [/* @__PURE__ */ jsx(SegmentGroupItemText, { children: label }), /* @__PURE__ */ jsx(SegmentGroupItemControl, {})]
-	}, value));
+    return items.map(({ value, label, disabled })=>/*#__PURE__*/ jsxs(SegmentGroup_SegmentGroupItem, {
+            value: value,
+            disabled: disabled,
+            children: [
+                /*#__PURE__*/ jsx(SegmentGroup_SegmentGroupItemText, {
+                    children: label
+                }),
+                /*#__PURE__*/ jsx(SegmentGroup_SegmentGroupItemControl, {})
+            ]
+        }, value));
 }
-const SegmentGroup$1 = Object.assign(SegmentGroupRoot, {
-	Root: SegmentGroupRoot,
-	RootProvider: SegmentGroupRootProvider,
-	Label: SegmentGroupLabel,
-	Item: SegmentGroupItem,
-	ItemControl: SegmentGroupItemControl,
-	ItemText: SegmentGroupItemText,
-	Indicator: SegmentGroupIndicator,
-	Items: SegmentGroupItems
+const SegmentGroup_SegmentGroup = Object.assign(SegmentGroup_SegmentGroupRoot, {
+    Root: SegmentGroup_SegmentGroupRoot,
+    RootProvider: SegmentGroup_SegmentGroupRootProvider,
+    Context: SegmentGroup.Context,
+    ItemContext: SegmentGroup.ItemContext,
+    Label: SegmentGroup_SegmentGroupLabel,
+    Item: SegmentGroup_SegmentGroupItem,
+    ItemControl: SegmentGroup_SegmentGroupItemControl,
+    ItemText: SegmentGroup_SegmentGroupItemText,
+    Indicator: SegmentGroup_SegmentGroupIndicator,
+    Items: SegmentGroupItems
 });
-//#endregion
-export { SegmentGroup$1 as SegmentGroup, useSegmentGroup };
+export { SegmentGroup_SegmentGroup as SegmentGroup, SegmentGroup_useSegmentGroup as useSegmentGroup, useSegmentGroupContext, useSegmentGroupItemContext };