@moduix/react 2.1.0 → 2.2.4

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

@@ -1,12 +1,10 @@
-import './SegmentGroup.css';
-//#region src/components/segment-group/SegmentGroup.module.css
-var SegmentGroup_module_default = {
-	"indicator": "_3r0tBa_indicator",
-	"item": "_3r0tBa_item",
-	"itemControl": "_3r0tBa_itemControl",
-	"itemText": "_3r0tBa_itemText",
-	"label": "_3r0tBa_label",
-	"root": "_3r0tBa_root"
+import "./SegmentGroup_module.css";
+const SegmentGroup_module = {
+    root: "root-Bd4lNR",
+    label: "label-shCFGn",
+    item: "item-YWqgii",
+    itemControl: "itemControl-pbg2uY",
+    itemText: "itemText-aBveL1",
+    indicator: "indicator-hgTUcL"
 };
-//#endregion
-export { SegmentGroup_module_default as default };
+export default SegmentGroup_module;

package/dist/components/segment-group/SegmentGroup_module.css

@@ -0,0 +1,123 @@
+@layer moduix.components {
+  .root-Bd4lNR {
+    box-sizing: border-box;
+    isolation: isolate;
+    max-inline-size: var(--moduix-segment-group-max-width, 100%);
+    align-items: stretch;
+    gap: var(--moduix-segment-group-gap, var(--moduix-spacing-1));
+    padding: var(--moduix-segment-group-padding, var(--moduix-spacing-1));
+    border: var(--moduix-segment-group-border-width, var(--moduix-border-width-sm)) solid
+      var(--moduix-segment-group-border-color, var(--moduix-color-border));
+    border-radius: var(--moduix-segment-group-radius, var(--moduix-radius-lg));
+    background-color: var(--moduix-segment-group-bg, var(--moduix-color-muted));
+    color: var(--moduix-segment-group-color, var(--moduix-color-foreground));
+    display: inline-flex;
+    position: relative;
+  }
+
+  .root-Bd4lNR[data-orientation="vertical"] {
+    flex-direction: column;
+    align-items: stretch;
+  }
+
+  .root-Bd4lNR[data-disabled] {
+    opacity: var(--moduix-segment-group-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+
+  .root-Bd4lNR[data-invalid] {
+    border-color: var(--moduix-segment-group-border-color-invalid, var(--moduix-color-destructive));
+  }
+
+  .label-shCFGn {
+    z-index: 1;
+    color: var(--moduix-segment-group-label-color, var(--moduix-segment-group-color, var(--moduix-color-foreground)));
+    font-size: var(--moduix-segment-group-label-font-size, var(--moduix-text-sm));
+    font-weight: var(--moduix-segment-group-label-font-weight, var(--moduix-weight-semibold));
+    line-height: var(--moduix-segment-group-label-line-height, var(--moduix-line-height-text-sm));
+    -webkit-user-select: none;
+    user-select: none;
+    position: relative;
+  }
+
+  .item-YWqgii {
+    box-sizing: border-box;
+    z-index: 1;
+    justify-content: center;
+    align-items: center;
+    gap: var(--moduix-segment-group-item-gap, var(--moduix-spacing-2));
+    min-height: var(--moduix-segment-group-item-height, var(--moduix-size-sm));
+    border-radius: var(--moduix-segment-group-item-radius, var(--moduix-radius-md));
+    padding-inline: var(--moduix-segment-group-item-padding-x, var(--moduix-spacing-3-5));
+    color: var(--moduix-segment-group-item-color, var(--moduix-color-muted-foreground));
+    font-size: var(--moduix-segment-group-item-font-size, var(--moduix-text-sm));
+    font-weight: var(--moduix-segment-group-item-font-weight, var(--moduix-weight-medium));
+    line-height: var(--moduix-segment-group-item-line-height, var(--moduix-line-height-text-sm));
+    -webkit-user-select: none;
+    user-select: none;
+    white-space: nowrap;
+    cursor: pointer;
+    transition: color var(--moduix-segment-group-transition, var(--moduix-transition-default)),
+      opacity var(--moduix-segment-group-transition, var(--moduix-transition-default));
+    outline: 0;
+    display: inline-flex;
+    position: relative;
+  }
+
+  @media (hover: hover) {
+    .item-YWqgii:hover:not([data-readonly], [data-disabled]) {
+      color: var(--moduix-segment-group-item-color-hover, var(--moduix-color-foreground));
+    }
+  }
+
+  .item-YWqgii[data-state="checked"] {
+    color: var(--moduix-segment-group-item-color-checked, var(--moduix-color-foreground));
+  }
+
+  .item-YWqgii[data-focus-visible] {
+    outline: var(--moduix-segment-group-focus-ring-width, var(--moduix-focus-ring-inset-width, var(--moduix-border-width-sm)))
+        solid var(--moduix-segment-group-focus-ring-color, var(--moduix-color-ring));
+    outline-offset: var(--moduix-segment-group-focus-ring-offset, var(--moduix-border-width-sm));
+  }
+
+  .item-YWqgii[data-invalid][data-focus-visible] {
+    outline-color: var(--moduix-segment-group-focus-ring-color-invalid, var(--moduix-color-destructive));
+  }
+
+  .item-YWqgii[data-readonly], .item-YWqgii[data-disabled] {
+    cursor: default;
+  }
+
+  .item-YWqgii[data-disabled] {
+    opacity: var(--moduix-segment-group-item-disabled-opacity, var(--moduix-opacity-disabled));
+  }
+
+  .item-YWqgii[data-orientation="vertical"] {
+    justify-content: flex-start;
+    inline-size: 100%;
+  }
+
+  .itemControl-pbg2uY {
+    display: none;
+  }
+
+  .itemText-aBveL1 {
+    z-index: 1;
+    position: relative;
+  }
+
+  .indicator-hgTUcL {
+    --transition-duration: var(--moduix-segment-group-indicator-transition-duration, var(--moduix-duration-normal));
+    --transition-timing-function: var(--moduix-segment-group-indicator-transition-timing-function, var(--moduix-ease-in-out));
+    z-index: 0;
+    top: var(--top);
+    left: var(--left);
+    width: var(--width);
+    height: var(--height);
+    border-radius: var(--moduix-segment-group-indicator-radius, var(--moduix-radius-md));
+    background-color: var(--moduix-segment-group-indicator-bg, var(--moduix-color-background));
+    box-shadow: var(--moduix-segment-group-indicator-shadow, var(--moduix-shadow-sm));
+    pointer-events: none;
+    position: absolute;
+  }
+}
+

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

@@ -1,2 +1 @@
-import { SegmentGroup, useSegmentGroup } from "./SegmentGroup.js";
-export { SegmentGroup, useSegmentGroup };
+export { SegmentGroup, useSegmentGroup, useSegmentGroupContext, useSegmentGroupItemContext, } from './SegmentGroup.js';

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

@@ -0,0 +1 @@
+export { SegmentGroup, useSegmentGroup, useSegmentGroupContext, useSegmentGroupItemContext } from "./SegmentGroup.js";

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

@@ -1,62 +1,45 @@
-import { OverlayPortalProps } from "../../lib/moduix/overlayPortal.js";
-import { ComponentProps, ReactNode } from "react";
-import { Select, SelectRootComponent, SelectRootProviderComponent } from "@ark-ui/react/select";
-
-//#region src/components/select/Select.d.ts
+import { Select as SelectPrimitive, type SelectRootComponent as ArkSelectRootComponent, type SelectRootProviderComponent as ArkSelectRootProviderComponent, useSelect, useSelectContext, useSelectItemContext } from '@ark-ui/react/select';
+import type { ComponentProps, ReactNode } from 'react';
+import { type OverlayPortalProps } from '../../internal/overlayPortal';
 type SelectNativeFormControl = 'select' | 'input';
 type SelectRootOwnProps = OverlayPortalProps & {
-  nativeFormControl?: SelectNativeFormControl;
+    nativeFormControl?: SelectNativeFormControl;
 };
-type SelectRootComponent$1 = SelectRootComponent<SelectRootOwnProps>;
-type SelectRootProviderComponent$1 = SelectRootProviderComponent<SelectRootOwnProps>;
-type SelectFieldProps = Omit<ComponentProps<typeof Select.Control>, 'asChild' | 'children'> & {
-  clearLabel?: string;
-  indicator?: ReactNode;
-  placeholder?: ComponentProps<typeof Select.ValueText>['placeholder'];
+type SelectRootComponent = ArkSelectRootComponent<SelectRootOwnProps>;
+type SelectRootProviderComponent = ArkSelectRootProviderComponent<SelectRootOwnProps>;
+type SelectFieldProps = Omit<ComponentProps<typeof SelectPrimitive.Control>, 'asChild' | 'children'> & {
+    clearLabel?: string;
+    indicator?: ReactNode;
+    placeholder?: ComponentProps<typeof SelectPrimitive.ValueText>['placeholder'];
 };
-declare function SelectIndicators({
-  className,
-  ...props
-}: ComponentProps<'div'>): import("react").JSX.Element;
-declare function SelectItemTextContent({
-  className,
-  ...props
-}: ComponentProps<'span'>): import("react").JSX.Element;
-declare function SelectItemTextIcon({
-  className,
-  ...props
-}: ComponentProps<'span'>): import("react").JSX.Element;
-declare function SelectItemTextLabel({
-  className,
-  ...props
-}: ComponentProps<'span'>): import("react").JSX.Element;
-declare const Select$1: SelectRootComponent$1 & {
-  Root: SelectRootComponent$1;
-  RootProvider: SelectRootProviderComponent$1;
-  Context: <T extends unknown>(props: Select.ContextProps<T>) => ReactNode;
-  ItemContext: (props: Select.ItemContextProps) => ReactNode;
-  useSelect: <T extends unknown>(props: import("@ark-ui/react/select").UseSelectProps<T>) => import("@ark-ui/react/select").UseSelectReturn<T>;
-  useSelectContext: () => import("@ark-ui/react/select").UseSelectContext<any>;
-  useSelectItemContext: () => import("@ark-ui/react/select").UseSelectItemContext;
-  Label: import("react").ForwardRefExoticComponent<Omit<Select.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
-  Control: import("react").ForwardRefExoticComponent<Omit<Select.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Field: import("react").ForwardRefExoticComponent<Omit<SelectFieldProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Trigger: import("react").ForwardRefExoticComponent<Omit<Select.TriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-  ValueText: import("react").ForwardRefExoticComponent<Omit<Select.ValueTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
-  ClearTrigger: import("react").ForwardRefExoticComponent<Omit<Select.ClearTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-  Indicator: import("react").ForwardRefExoticComponent<Omit<Select.IndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Indicators: typeof SelectIndicators;
-  Positioner: import("react").ForwardRefExoticComponent<Omit<Select.PositionerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Content: import("react").ForwardRefExoticComponent<Omit<Select.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  List: import("react").ForwardRefExoticComponent<Omit<Select.ListProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  ItemGroup: import("react").ForwardRefExoticComponent<Omit<Select.ItemGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  ItemGroupLabel: import("react").ForwardRefExoticComponent<Omit<Select.ItemGroupLabelProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  Item: import("react").ForwardRefExoticComponent<Omit<Select.ItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  ItemText: import("react").ForwardRefExoticComponent<Omit<Select.ItemTextProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  ItemIndicator: import("react").ForwardRefExoticComponent<Omit<Select.ItemIndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
-  ItemTextContent: typeof SelectItemTextContent;
-  ItemTextIcon: typeof SelectItemTextIcon;
-  ItemTextLabel: typeof SelectItemTextLabel;
+declare function SelectItemTextContent({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
+declare function SelectItemTextIcon({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
+declare function SelectItemTextLabel({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
+declare const Select: SelectRootComponent & {
+    Root: SelectRootComponent;
+    RootProvider: SelectRootProviderComponent;
+    Context: <T extends unknown>(props: SelectPrimitive.ContextProps<T>) => ReactNode;
+    ItemContext: (props: SelectPrimitive.ItemContextProps) => ReactNode;
+    useSelect: <T extends unknown>(props: import("@ark-ui/react/select").UseSelectProps<T>) => import("@ark-ui/react/select").UseSelectReturn<T>;
+    useSelectContext: () => import("@ark-ui/react/select").UseSelectContext<any>;
+    useSelectItemContext: () => import("@ark-ui/react/select").UseSelectItemContext;
+    Label: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & import("react").RefAttributes<HTMLLabelElement>>;
+    Control: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ControlProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Field: import("react").ForwardRefExoticComponent<Omit<SelectFieldProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Trigger: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.TriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    ValueText: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ValueTextProps & import("react").RefAttributes<HTMLSpanElement>, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
+    ClearTrigger: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ClearTriggerProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Indicator: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.IndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Positioner: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.PositionerProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Content: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ContentProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    List: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ListProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ItemGroup: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ItemGroupProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ItemGroupLabel: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ItemGroupLabelProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    Item: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ItemProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ItemText: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ItemTextProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ItemIndicator: import("react").ForwardRefExoticComponent<Omit<SelectPrimitive.ItemIndicatorProps & import("react").RefAttributes<HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+    ItemTextContent: typeof SelectItemTextContent;
+    ItemTextIcon: typeof SelectItemTextIcon;
+    ItemTextLabel: typeof SelectItemTextLabel;
 };
-//#endregion
-export { Select$1 as Select };
+export { Select, useSelect, useSelectContext, useSelectItemContext };