@servicetitan/anvil2 1.45.2 → 1.46.0

package/dist/beta/components/Toolbar/internal/ToolbarItemWrapper.d.ts

@@ -0,0 +1,40 @@
+import { ToolbarItemProps } from '../types';
+/**
+ * Props for the ToolbarItemWrapper component
+ */
+export type ToolbarItemWrapperProps = {
+    /**
+     * Toolbar item configuration without ID (ID is generated internally)
+     */
+    item: Omit<ToolbarItemProps, "id">;
+    /**
+     * The toolbar item component to wrap
+     */
+    children: React.ReactNode;
+    /** Optional override for the intersection observer root element */
+    observerRoot?: Element | null;
+    /** Optional override for visibility change handling */
+    onVisibilityChange?: (isVisible: boolean) => void;
+    /** Optional margin offset for the intersection observer root */
+    rootMargin?: string;
+    /** Optional class name to apply to the wrapper element */
+    className?: string;
+};
+/**
+ * ToolbarItemWrapper manages item visibility and focus behavior within a toolbar.
+ *
+ * Features:
+ * - Intersection observation for overflow detection
+ * - Automatic overflow menu integration in collapse mode
+ * - Focus management and keyboard navigation
+ * - ARIA compliance for accessibility
+ * - Visibility state management
+ * - Proper tab index handling
+ * - Context integration with toolbar state
+ *
+ * @example
+ * <ToolbarItemWrapper item={{ itemType: "button", itemProps: buttonProps }}>
+ *   <ToolbarButton {...buttonProps} />
+ * </ToolbarItemWrapper>
+ */
+export declare const ToolbarItemWrapper: ({ item, children, observerRoot, onVisibilityChange, rootMargin, className, }: ToolbarItemWrapperProps) => import("react/jsx-runtime").JSX.Element;

package/dist/beta/components/Toolbar/internal/ToolbarOverflowContext.d.ts

@@ -0,0 +1,35 @@
+import { RefObject } from 'react';
+import { ToolbarItemProps, ToolbarOverflowTypes } from '../types';
+/**
+ * Context for sharing toolbar state with child components for overflow handling
+ */
+export type ToolbarOverFlowContextProps = {
+    /**
+     * Array of toolbar items that should appear in the overflow menu
+     */
+    overflowItems: ToolbarItemProps[];
+    /**
+     * Function to add an item to the overflow menu
+     */
+    addItem: (element: ToolbarItemProps) => void;
+    /**
+     * Function to remove an item from the overflow menu
+     */
+    removeItem: (element: ToolbarItemProps) => void;
+    /**
+     * Reference to the toolbar container element
+     */
+    toolbarRef: RefObject<HTMLDivElement>;
+    /**
+     * Array of item IDs in their original order
+     */
+    orderedIds?: string[];
+    /**
+     * Overflow behavior type (wrap or collapse)
+     */
+    overflow: ToolbarOverflowTypes;
+};
+/**
+ * Context for managing toolbar overflow state and operations
+ */
+export declare const ToolbarOverflowContext: import('react').Context<ToolbarOverFlowContextProps>;

package/dist/beta/components/Toolbar/internal/ToolbarOverflowMenu.d.ts

@@ -0,0 +1,29 @@
+import { ReactElement } from 'react';
+/**
+ * Props for the ToolbarOverflowMenu component
+ */
+export type ToolbarOverflowMenuProps = {
+    /**
+     * Additional items to display in the overflow menu
+     */
+    additionalItems?: ReactElement[];
+    /**
+     * Direction of the parent toolbar
+     * @default horizontal
+     */
+    direction?: "vertical" | "horizontal";
+};
+/**
+ * ToolbarOverflowMenu component displays toolbar items that don't fit in the main toolbar.
+ *
+ * Features:
+ * - Automatic rendering when items overflow in collapse mode
+ * - Maintains consistent item ordering with the main toolbar
+ * - Preserves item state between toolbar and overflow menu
+ * - Provides accessible navigation with keyboard and screen readers
+ * - Adapts to both horizontal and vertical toolbar layouts
+ * - Context-aware rendering for child components
+ * - Proper ARIA menu semantics
+ * - Keyboard navigation support
+ */
+export declare const ToolbarOverflowMenu: ({ additionalItems, direction, }: ToolbarOverflowMenuProps) => import("react/jsx-runtime").JSX.Element;

package/dist/beta/components/Toolbar/internal/utils/accessibility.d.ts

@@ -0,0 +1,26 @@
+import { KeyboardEvent } from 'react';
+/**
+ * Gets all visible focusable elements for a specific toolbar instance.
+ * Filters out hidden items and includes the overflow trigger if present.
+ */
+export declare function getToolbarElements(toolbarElement: HTMLElement): Element[];
+/**
+ * Updates tabindex values for all items in a toolbar.
+ * Sets tabindex="0" for the active item and tabindex="-1" for all others.
+ */
+export declare function updateToolbarItemsTabIndex(toolbarElement: HTMLElement, activeItem?: Element | number): Element | undefined;
+/**
+ * Handles keyboard navigation within the toolbar component following ARIA practices.
+ *
+ * Navigation behavior:
+ * - Left/Right arrows move focus in horizontal toolbars
+ * - Up/Down arrows move focus in vertical toolbars
+ * - Home/End move to first/last items
+ * - Navigation wraps around at the ends
+ * - Only visible items are included in navigation
+ */
+export declare function handleToolbarKeyDown(event: KeyboardEvent<HTMLElement>, toolbarElement: HTMLElement): void;
+/**
+ * Handles keyboard navigation within overflow menu using arrow keys
+ */
+export declare const handleMenuKeyboardNavigation: (event: KeyboardEvent<HTMLUListElement>) => void;

package/dist/beta/components/Toolbar/internal/utils/test.d.ts

@@ -0,0 +1,29 @@
+import { ReactNode } from 'react';
+import { ToolbarOverflowTypes } from '../../types';
+export declare const withOverflowItemContext: (children: ReactNode, isInOverflowMenu?: boolean) => import('react').FunctionComponentElement<import('react').ProviderProps<{
+    isInOverflowMenu: boolean;
+}>>;
+export declare const createMockOverflowContext: (overrides?: {}) => {
+    overflowItems: never[];
+    orderedIds: never[];
+    addItem: import('vitest').Mock<(...args: any[]) => any>;
+    removeItem: import('vitest').Mock<(...args: any[]) => any>;
+    toolbarRef: {
+        current: HTMLDivElement;
+    };
+    overflow: ToolbarOverflowTypes;
+};
+export declare const withToolbarOverflowContext: (children: ReactNode, contextValue?: {
+    overflowItems: never[];
+    orderedIds: never[];
+    addItem: import('vitest').Mock<(...args: any[]) => any>;
+    removeItem: import('vitest').Mock<(...args: any[]) => any>;
+    toolbarRef: {
+        current: HTMLDivElement;
+    };
+    overflow: ToolbarOverflowTypes;
+}) => import('react').FunctionComponentElement<import('react').ProviderProps<import('../ToolbarOverflowContext').ToolbarOverFlowContextProps>>;
+export declare const mockIntersectionObserver: import('vitest').Mock<(...args: any[]) => any>;
+export declare const observerMap: Map<any, any>;
+export declare const createIntersectionEntry: (element: Element, isIntersecting: boolean) => IntersectionObserverEntry;
+export declare const setupIntersectionObserver: () => void;

package/dist/beta/components/Toolbar/types.d.ts

@@ -0,0 +1,50 @@
+import { ButtonAppearance } from '../../../types';
+import { IconProps } from '../../../components/Icon';
+import { ToolbarButtonProps } from './ToolbarButton';
+import { ToolbarButtonLinkProps } from './ToolbarButtonLink';
+import { ToolbarButtonToggleProps } from './ToolbarButtonToggle';
+import { ToolbarSelectProps } from './ToolbarSelect';
+/**
+ * Toolbar overflow options
+ */
+export type ToolbarOverflowTypes = "wrap" | "collapse";
+/**
+ * Toolbar item appearance options
+ */
+export type ToolbarItemAppearance = Extract<ButtonAppearance, "ghost" | "primary">;
+/**
+ * Types of toolbar item
+ */
+export type ToolbarItemTypes = "button" | "buttonToggle" | "buttonLink" | "select";
+/**
+ * Props for item in the toolbar overflow menu
+ */
+export type CombinedToolbarItemProps = ToolbarButtonProps | ToolbarButtonToggleProps | ToolbarButtonLinkProps | ToolbarSelectProps;
+/**
+ * Props for a toolbar item
+ */
+export type ToolbarItemProps = {
+    itemType: ToolbarItemTypes;
+    itemProps: CombinedToolbarItemProps;
+    id?: string;
+};
+/**
+ * TODO:
+ * This should actually be on the Button component itself to enforce the accessibility rules.
+ * This could be a breaking change though, so we should consider moving this to the Button component in the future.
+ *
+ * Generic type that adds accessibility requirements to any base props type.
+ * This enforces proper accessibility for both buttons and toggles.
+ */
+export type WithAriaLabelEnforcement<T> = (T & {
+    children?: never;
+    icon: IconProps["svg"] | {
+        before: IconProps["svg"];
+    } | {
+        after: IconProps["svg"];
+    };
+    "aria-label": string;
+}) | (T & {
+    children: React.ReactNode;
+    "aria-label"?: string;
+});

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

@@ -0,0 +1 @@
+export * from './Toolbar';

package/dist/beta/index.d.ts

@@ -0,0 +1 @@
+export * from './components';

package/dist/beta.d.ts

@@ -0,0 +1,2 @@
+export * from './beta/index'
+export {}

package/dist/beta.js

@@ -0,0 +1,2 @@
+export { T as Toolbar, a as ToolbarButton, c as ToolbarButtonLink, b as ToolbarButtonToggle, e as ToolbarControlGroup, g as ToolbarElement, f as ToolbarSearchField, d as ToolbarSelect } from './Toolbar-D4zuUFhb.js';
+//# sourceMappingURL=beta.js.map

package/dist/beta.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"beta.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/Combobox/ComboboxTypes.d.ts

@@ -284,6 +284,14 @@ export type ComboboxTriggerProps<Item = any> = Omit<TextFieldProps, "disabled" |
     maxRows?: number;
     /** Allows Combobox/Select to display custom-colored Chips */
     selectedItemProps?: (item: Item) => Partial<ChipProps>;
+    /**
+     * Called when the clear (close) button is clicked.
+     * @remarks This prop completely replaces the default clear behavior (reset/selectItem).
+     * Only use this when you need complete control over the combobox state, such as in
+     * FilterSelect components where the implementor manages all item filtering and selection.
+     * This should only be used with the disableFilter prop.
+     */
+    onClear?: () => void;
 } & {
     /** @deprecated use disabled in <Combobox /> */
     disabled?: boolean;

package/dist/components/DateFieldRange/internal/DateFieldRangeCalendar.d.ts

@@ -2,7 +2,7 @@ import { DateTime, WeekdayNumbers } from 'luxon';
 export type DateFieldRangeCalendarProps = {
     startDate: DateTime | null;
     endDate: DateTime | null;
-    onKeyDown: (event: React.KeyboardEvent<HTMLDivElement>) => void;
+    onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;
     onSelection: ({ startDate, endDate, }: {
         startDate: DateTime | null;
         endDate: DateTime | null;

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

@@ -1,4 +1,4 @@
-export { Dialog as default, Dialog, type DialogProps, } from './Dialog';
+export { Dialog as default, Dialog, type DialogProps } from './Dialog';
 export { DialogCancelButton, type DialogCancelButtonProps, } from './DialogCancelButton';
 export { DialogContent, type DialogContentProps } from './DialogContent';
 export { DialogFooter, type DialogFooterProps } from './DialogFooter';

package/dist/{indeterminate_check_box-Bg24oeHy.js → indeterminate_check_box-RY9zr3xS.js}

@@ -1,26 +1,26 @@
 import * as React from 'react';
 
-import './indeterminate_check_box.css';const checkbox = "_checkbox_zshjc_2";
-const wrapper = "_wrapper_zshjc_17";
-const error = "_error_zshjc_97";
-const label = "_label_zshjc_209";
-const legend = "_legend_zshjc_241";
-const children = "_children_zshjc_253";
+import './indeterminate_check_box.css';const checkbox = "_checkbox_19qga_8";
+const wrapper = "_wrapper_19qga_23";
+const error = "_error_19qga_103";
+const label = "_label_19qga_215";
+const legend = "_legend_19qga_247";
+const children = "_children_19qga_259";
 const checkboxStyles = {
 	checkbox: checkbox,
 	wrapper: wrapper,
-	"required-asterisk": "_required-asterisk_zshjc_31",
-	"focus-label": "_focus-label_zshjc_35",
-	"icon-wrapper": "_icon-wrapper_zshjc_41",
-	"helper-wrapper": "_helper-wrapper_zshjc_74",
-	"icon-indeterminate": "_icon-indeterminate_zshjc_79",
-	"icon-unchecked": "_icon-unchecked_zshjc_80",
-	"icon-checked": "_icon-checked_zshjc_81",
+	"required-asterisk": "_required-asterisk_19qga_37",
+	"focus-label": "_focus-label_19qga_41",
+	"icon-wrapper": "_icon-wrapper_19qga_47",
+	"helper-wrapper": "_helper-wrapper_19qga_80",
+	"icon-indeterminate": "_icon-indeterminate_19qga_85",
+	"icon-unchecked": "_icon-unchecked_19qga_86",
+	"icon-checked": "_icon-checked_19qga_87",
 	error: error,
-	"sr-only": "_sr-only_zshjc_195",
-	"checkbox-group": "_checkbox-group_zshjc_209",
+	"sr-only": "_sr-only_19qga_201",
+	"checkbox-group": "_checkbox-group_19qga_215",
 	label: label,
-	"direction-row": "_direction-row_zshjc_209",
+	"direction-row": "_direction-row_19qga_215",
 	legend: legend,
 	children: children
 };
@@ -32,4 +32,4 @@ const SvgCheckBox = (props) => /* @__PURE__ */ React.createElement("svg", { xmln
 const SvgIndeterminateCheckBox = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-3 10H8c-.55 0-1-.45-1-1s.45-1 1-1h8c.55 0 1 .45 1 1s-.45 1-1 1z" }));
 
 export { SvgIndeterminateCheckBox as S, SvgCheckBox as a, SvgCheckBoxOutlineBlank as b, checkboxStyles as c };
-//# sourceMappingURL=indeterminate_check_box-Bg24oeHy.js.map
+//# sourceMappingURL=indeterminate_check_box-RY9zr3xS.js.map

package/dist/{indeterminate_check_box-Bg24oeHy.js.map → indeterminate_check_box-RY9zr3xS.js.map}

@@ -1 +1 @@
-{"version":3,"file":"indeterminate_check_box-Bg24oeHy.js","sources":["../../hammer-icon/mdi/round/check_box_outline_blank.svg","../../hammer-icon/mdi/round/check_box.svg","../../hammer-icon/mdi/round/indeterminate_check_box.svg"],"sourcesContent":["import * as React from \"react\";\nconst SvgCheckBoxOutlineBlank = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M18 19H6c-.55 0-1-.45-1-1V6c0-.55.45-1 1-1h12c.55 0 1 .45 1 1v12c0 .55-.45 1-1 1zm1-16H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\" }));\nexport default SvgCheckBoxOutlineBlank;\n","import * as React from \"react\";\nconst SvgCheckBox = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-8.29 13.29a.996.996 0 0 1-1.41 0L5.71 12.7a.996.996 0 1 1 1.41-1.41L10 14.17l6.88-6.88a.996.996 0 1 1 1.41 1.41l-7.58 7.59z\" }));\nexport default SvgCheckBox;\n","import * as React from \"react\";\nconst SvgIndeterminateCheckBox = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-3 10H8c-.55 0-1-.45-1-1s.45-1 1-1h8c.55 0 1 .45 1 1s-.45 1-1 1z\" }));\nexport default SvgIndeterminateCheckBox;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AACK,MAAC,uBAAuB,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,+JAA+J,EAAE,CAAC;;ACA1Y,MAAC,WAAW,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,2MAA2M,EAAE,CAAC;;ACA1a,MAAC,wBAAwB,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,+IAA+I,EAAE,CAAC;;;;"}
+{"version":3,"file":"indeterminate_check_box-RY9zr3xS.js","sources":["../../hammer-icon/mdi/round/check_box_outline_blank.svg","../../hammer-icon/mdi/round/check_box.svg","../../hammer-icon/mdi/round/indeterminate_check_box.svg"],"sourcesContent":["import * as React from \"react\";\nconst SvgCheckBoxOutlineBlank = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M18 19H6c-.55 0-1-.45-1-1V6c0-.55.45-1 1-1h12c.55 0 1 .45 1 1v12c0 .55-.45 1-1 1zm1-16H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z\" }));\nexport default SvgCheckBoxOutlineBlank;\n","import * as React from \"react\";\nconst SvgCheckBox = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-8.29 13.29a.996.996 0 0 1-1.41 0L5.71 12.7a.996.996 0 1 1 1.41-1.41L10 14.17l6.88-6.88a.996.996 0 1 1 1.41 1.41l-7.58 7.59z\" }));\nexport default SvgCheckBox;\n","import * as React from \"react\";\nconst SvgIndeterminateCheckBox = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", width: \"1em\", height: \"1em\", viewBox: \"0 0 24 24\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-3 10H8c-.55 0-1-.45-1-1s.45-1 1-1h8c.55 0 1 .45 1 1s-.45 1-1 1z\" }));\nexport default SvgIndeterminateCheckBox;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AACK,MAAC,uBAAuB,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,+JAA+J,EAAE,CAAC;;ACA1Y,MAAC,WAAW,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,2MAA2M,EAAE,CAAC;;ACA1a,MAAC,wBAAwB,GAAG,CAAC,KAAK,qBAAqB,KAAK,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,4BAA4B,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,kBAAkB,KAAK,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE,+IAA+I,EAAE,CAAC;;;;"}

package/dist/indeterminate_check_box.css

@@ -1,6 +1,12 @@
 @layer starter, reset, base, state, application;
+/* REVERT LAYER BUGFIX START */
+[data-anv=checkbox-group] > legend {
+  all: revert-layer;
+}
+
+/* REVERT LAYER BUGFIX END */
 @layer reset {
-  ._checkbox_zshjc_2 {
+  ._checkbox_19qga_8 {
     all: unset;
     font-family: var(--font-family-base, "Nunito Sans", sans-serif);
     font-size: 100%;
@@ -15,12 +21,12 @@
   }
 }
 @layer base {
-  ._wrapper_zshjc_17 {
+  ._wrapper_19qga_23 {
     display: inline-flex;
     flex-direction: column;
     gap: 0.25rem;
   }
-  ._checkbox_zshjc_2 {
+  ._checkbox_19qga_8 {
     display: inline-flex;
     align-items: flex-start;
     gap: 0.5rem;
@@ -29,17 +35,17 @@
     font-size: 1rem;
     line-height: 1.5;
   }
-  ._checkbox_zshjc_2 ._required-asterisk_zshjc_31 {
+  ._checkbox_19qga_8 ._required-asterisk_19qga_37 {
     margin-inline-start: 0.25rem;
     color: var(--foreground-color-danger, #e13212);
   }
-  ._checkbox_zshjc_2 ._focus-label_zshjc_35 {
+  ._checkbox_19qga_8 ._focus-label_19qga_41 {
     border-radius: 0.75rem;
     outline: 0 solid var(--focus-ring-color, #0265DC);
     outline-offset: 2px;
     transition: background-color 200ms cubic-bezier(0, 0, 0.4, 1), outline 200ms cubic-bezier(0, 0, 0.4, 1);
   }
-  ._checkbox_zshjc_2 ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8 ._icon-wrapper_19qga_47 {
     display: inline-flex;
     border-radius: 0.3125rem;
     background-color: transparent;
@@ -47,7 +53,7 @@
     position: relative;
     outline: 0 solid var(--focus-ring-color, #0265DC);
   }
-  ._checkbox_zshjc_2 ._icon-wrapper_zshjc_41::before {
+  ._checkbox_19qga_8 ._icon-wrapper_19qga_47::before {
     position: absolute;
     width: 100%;
     height: 100%;
@@ -62,7 +68,7 @@
     pointer-events: none;
     border-radius: inherit;
   }
-  ._checkbox_zshjc_2 input {
+  ._checkbox_19qga_8 input {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
@@ -74,128 +80,128 @@
     white-space: nowrap;
     width: 1px;
   }
-  ._helper-wrapper_zshjc_74 {
+  ._helper-wrapper_19qga_80 {
     margin-inline-start: 2rem;
   }
 }
 @layer state {
-  ._checkbox_zshjc_2 ._icon-indeterminate_zshjc_79,
-  ._checkbox_zshjc_2 ._icon-unchecked_zshjc_80,
-  ._checkbox_zshjc_2 ._icon-checked_zshjc_81 {
+  ._checkbox_19qga_8 ._icon-indeterminate_19qga_85,
+  ._checkbox_19qga_8 ._icon-unchecked_19qga_86,
+  ._checkbox_19qga_8 ._icon-checked_19qga_87 {
     border-radius: 0.1875rem;
   }
-  ._checkbox_zshjc_2 ._icon-checked_zshjc_81,
-  ._checkbox_zshjc_2 ._icon-indeterminate_zshjc_79 {
+  ._checkbox_19qga_8 ._icon-checked_19qga_87,
+  ._checkbox_19qga_8 ._icon-indeterminate_19qga_85 {
     color: var(--checkbox-checked-fill-color-default, #0265DC);
     display: none;
   }
-  ._checkbox_zshjc_2 ._icon-checked_zshjc_81:hover,
-  ._checkbox_zshjc_2 ._icon-indeterminate_zshjc_79:hover {
+  ._checkbox_19qga_8 ._icon-checked_19qga_87:hover,
+  ._checkbox_19qga_8 ._icon-indeterminate_19qga_85:hover {
     color: var(--checkbox-checked-fill-color-hover, rgba(0, 75, 160, 0.8196078431));
   }
-  ._checkbox_zshjc_2 ._icon-checked_zshjc_81:active,
-  ._checkbox_zshjc_2 ._icon-indeterminate_zshjc_79:active {
+  ._checkbox_19qga_8 ._icon-checked_19qga_87:active,
+  ._checkbox_19qga_8 ._icon-indeterminate_19qga_85:active {
     color: var(--checkbox-checked-fill-color-active, rgba(1, 81, 175, 0.7215686275));
   }
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8._error_19qga_103 ._icon-wrapper_19qga_47 {
     outline-color: var(--focus-ring-color-danger, #e13212);
   }
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-indeterminate_zshjc_79,
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-unchecked_zshjc_80,
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-checked_zshjc_81 {
+  ._checkbox_19qga_8._error_19qga_103 ._icon-indeterminate_19qga_85,
+  ._checkbox_19qga_8._error_19qga_103 ._icon-unchecked_19qga_86,
+  ._checkbox_19qga_8._error_19qga_103 ._icon-checked_19qga_87 {
     color: var(--checkbox-checked-error-fill-color-default, #e13212);
   }
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-indeterminate_zshjc_79:hover,
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-unchecked_zshjc_80:hover,
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-checked_zshjc_81:hover {
+  ._checkbox_19qga_8._error_19qga_103 ._icon-indeterminate_19qga_85:hover,
+  ._checkbox_19qga_8._error_19qga_103 ._icon-unchecked_19qga_86:hover,
+  ._checkbox_19qga_8._error_19qga_103 ._icon-checked_19qga_87:hover {
     color: var(--checkbox-checked-error-fill-color-hover, #bf2a00);
   }
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-indeterminate_zshjc_79:active,
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-unchecked_zshjc_80:active,
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-checked_zshjc_81:active {
+  ._checkbox_19qga_8._error_19qga_103 ._icon-indeterminate_19qga_85:active,
+  ._checkbox_19qga_8._error_19qga_103 ._icon-unchecked_19qga_86:active,
+  ._checkbox_19qga_8._error_19qga_103 ._icon-checked_19qga_87:active {
     color: var(--checkbox-checked-error-fill-color-active, #bf2a00);
   }
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-checked_zshjc_81,
-  ._checkbox_zshjc_2._error_zshjc_97 ._icon-indeterminate_zshjc_79 {
+  ._checkbox_19qga_8._error_19qga_103 ._icon-checked_19qga_87,
+  ._checkbox_19qga_8._error_19qga_103 ._icon-indeterminate_19qga_85 {
     display: none;
   }
-  ._checkbox_zshjc_2:hover {
+  ._checkbox_19qga_8:hover {
     cursor: pointer;
   }
-  ._checkbox_zshjc_2:hover:has(input:not(:disabled)) ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8:hover:has(input:not(:disabled)) ._icon-wrapper_19qga_47 {
     background-color: var(--checkbox-unchecked-background-color-hover, rgba(20, 20, 20, 0.0784313725));
   }
-  ._checkbox_zshjc_2:hover:has(input:not(:disabled):checked) ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8:hover:has(input:not(:disabled):checked) ._icon-wrapper_19qga_47 {
     background-color: var(--checkbox-checked-background-color-hover, rgba(2, 101, 220, 0.0784313725));
   }
-  ._checkbox_zshjc_2 input[data-interactive=hover]:not(:disabled) ~ ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8 input[data-interactive=hover]:not(:disabled) ~ ._icon-wrapper_19qga_47 {
     background-color: var(--checkbox-unchecked-background-color-hover, rgba(20, 20, 20, 0.0784313725));
   }
-  ._checkbox_zshjc_2 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_19qga_47 {
     background-color: var(--checkbox-checked-background-color-hover, rgba(2, 101, 220, 0.0784313725));
   }
-  ._checkbox_zshjc_2 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_zshjc_41 ._icon-checked_zshjc_81,
-  ._checkbox_zshjc_2 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_zshjc_41 ._icon-indeterminate_zshjc_79 {
+  ._checkbox_19qga_8 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_19qga_47 ._icon-checked_19qga_87,
+  ._checkbox_19qga_8 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_19qga_47 ._icon-indeterminate_19qga_85 {
     color: var(--checkbox-checked-fill-color-hover, rgba(0, 75, 160, 0.8196078431));
   }
-  ._checkbox_zshjc_2._error_zshjc_97:hover {
+  ._checkbox_19qga_8._error_19qga_103:hover {
     cursor: pointer;
   }
-  ._checkbox_zshjc_2._error_zshjc_97:hover:has(input:not(:disabled)) ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8._error_19qga_103:hover:has(input:not(:disabled)) ._icon-wrapper_19qga_47 {
     background-color: var(--checkbox-unchecked-error-background-color-hover, rgba(225, 50, 18, 0.0588235294));
   }
-  ._checkbox_zshjc_2._error_zshjc_97:hover:has(input:not(:disabled):checked) ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8._error_19qga_103:hover:has(input:not(:disabled):checked) ._icon-wrapper_19qga_47 {
     background-color: var(--checkbox-checked-error-background-color-hover, rgba(225, 50, 18, 0.0588235294));
   }
-  ._checkbox_zshjc_2._error_zshjc_97 input[data-interactive=hover]:not(:disabled) ~ ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8._error_19qga_103 input[data-interactive=hover]:not(:disabled) ~ ._icon-wrapper_19qga_47 {
     background-color: var(--checkbox-unchecked-error-background-color-hover, rgba(225, 50, 18, 0.0588235294));
   }
-  ._checkbox_zshjc_2._error_zshjc_97 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8._error_19qga_103 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_19qga_47 {
     background-color: var(--checkbox-checked-error-background-color-hover, rgba(225, 50, 18, 0.0588235294));
   }
-  ._checkbox_zshjc_2._error_zshjc_97 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_zshjc_41 ._icon-checked_zshjc_81,
-  ._checkbox_zshjc_2._error_zshjc_97 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_zshjc_41 ._icon-indeterminate_zshjc_79 {
+  ._checkbox_19qga_8._error_19qga_103 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_19qga_47 ._icon-checked_19qga_87,
+  ._checkbox_19qga_8._error_19qga_103 input[data-interactive=hover]:not(:disabled):checked ~ ._icon-wrapper_19qga_47 ._icon-indeterminate_19qga_85 {
     color: var(--checkbox-checked-error-fill-color-hover, #bf2a00);
   }
-  ._checkbox_zshjc_2 input:focus-visible ~ ._icon-wrapper_zshjc_41,
-  ._checkbox_zshjc_2 input:focus-visible ~ ._focus-label_zshjc_35 {
+  ._checkbox_19qga_8 input:focus-visible ~ ._icon-wrapper_19qga_47,
+  ._checkbox_19qga_8 input:focus-visible ~ ._focus-label_19qga_41 {
     outline-width: 0.125rem;
   }
-  ._checkbox_zshjc_2 input[data-interactive=focus-visible]:not(:disabled) ~ ._icon-wrapper_zshjc_41,
-  ._checkbox_zshjc_2 input[data-interactive=focus-visible]:not(:disabled) ~ ._focus-label_zshjc_35 {
+  ._checkbox_19qga_8 input[data-interactive=focus-visible]:not(:disabled) ~ ._icon-wrapper_19qga_47,
+  ._checkbox_19qga_8 input[data-interactive=focus-visible]:not(:disabled) ~ ._focus-label_19qga_41 {
     outline-width: 0.125rem;
   }
-  ._checkbox_zshjc_2 input:checked ~ ._icon-wrapper_zshjc_41 ._icon-unchecked_zshjc_80 {
+  ._checkbox_19qga_8 input:checked ~ ._icon-wrapper_19qga_47 ._icon-unchecked_19qga_86 {
     display: none;
   }
-  ._checkbox_zshjc_2 input:checked ~ ._icon-wrapper_zshjc_41 ._icon-checked_zshjc_81 {
+  ._checkbox_19qga_8 input:checked ~ ._icon-wrapper_19qga_47 ._icon-checked_19qga_87 {
     display: inline-flex;
   }
-  ._checkbox_zshjc_2 input:checked:focus-visible ~ ._icon-wrapper_zshjc_41, ._checkbox_zshjc_2 input:checked:focus-visible ~ ._focus-label_zshjc_35 {
+  ._checkbox_19qga_8 input:checked:focus-visible ~ ._icon-wrapper_19qga_47, ._checkbox_19qga_8 input:checked:focus-visible ~ ._focus-label_19qga_41 {
     outline-width: 0.125rem;
   }
-  ._checkbox_zshjc_2 input[aria-checked=mixed] ~ ._icon-wrapper_zshjc_41 ._icon-checked_zshjc_81, ._checkbox_zshjc_2 input[aria-checked=mixed] ~ ._icon-wrapper_zshjc_41 ._icon-unchecked_zshjc_80 {
+  ._checkbox_19qga_8 input[aria-checked=mixed] ~ ._icon-wrapper_19qga_47 ._icon-checked_19qga_87, ._checkbox_19qga_8 input[aria-checked=mixed] ~ ._icon-wrapper_19qga_47 ._icon-unchecked_19qga_86 {
     display: none;
   }
-  ._checkbox_zshjc_2 input[aria-checked=mixed] ~ ._icon-wrapper_zshjc_41 ._icon-indeterminate_zshjc_79 {
+  ._checkbox_19qga_8 input[aria-checked=mixed] ~ ._icon-wrapper_19qga_47 ._icon-indeterminate_19qga_85 {
     display: inline-flex;
   }
-  ._checkbox_zshjc_2:has(input[disabled]) {
+  ._checkbox_19qga_8:has(input[disabled]) {
     opacity: 0.6;
     filter: grayscale(1);
   }
-  ._checkbox_zshjc_2:has(input[disabled]) ._icon-indeterminate_zshjc_79,
-  ._checkbox_zshjc_2:has(input[disabled]) ._icon-unchecked_zshjc_80,
-  ._checkbox_zshjc_2:has(input[disabled]) ._icon-checked_zshjc_81 {
+  ._checkbox_19qga_8:has(input[disabled]) ._icon-indeterminate_19qga_85,
+  ._checkbox_19qga_8:has(input[disabled]) ._icon-unchecked_19qga_86,
+  ._checkbox_19qga_8:has(input[disabled]) ._icon-checked_19qga_87 {
     color: var(--foreground-color-subdued, #737475);
   }
-  ._checkbox_zshjc_2:has(input[disabled]):hover {
+  ._checkbox_19qga_8:has(input[disabled]):hover {
     cursor: not-allowed;
   }
-  ._checkbox_zshjc_2:has(input[disabled]):hover ._icon-wrapper_zshjc_41 {
+  ._checkbox_19qga_8:has(input[disabled]):hover ._icon-wrapper_19qga_47 {
     box-shadow: none;
   }
-  ._sr-only_zshjc_195 {
+  ._sr-only_19qga_201 {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
@@ -209,19 +215,19 @@
   }
 }
 @layer application {
-  ._checkbox-group_zshjc_209 ._label_zshjc_209._direction-row_zshjc_209 {
+  ._checkbox-group_19qga_215 ._label_19qga_215._direction-row_19qga_215 {
     min-height: 1.5rem;
     justify-content: center;
   }
   @media (prefers-reduced-motion: reduce) {
-    ._checkbox_zshjc_2 ._icon-wrapper_zshjc_41 {
+    ._checkbox_19qga_8 ._icon-wrapper_19qga_47 {
       transition-duration: 0.01ms !important;
       transition-property: outline;
     }
   }
 }
 @layer reset {
-  ._checkbox-group_zshjc_209 {
+  ._checkbox-group_19qga_215 {
     all: unset;
     font-family: var(--font-family-base, "Nunito Sans", sans-serif);
     font-size: 100%;
@@ -236,12 +242,12 @@
   }
 }
 @layer base {
-  ._checkbox-group_zshjc_209 {
+  ._checkbox-group_19qga_215 {
     display: inline-flex;
     gap: 0.5rem;
     flex-direction: column;
   }
-  ._checkbox-group_zshjc_209 ._legend_zshjc_241 {
+  ._checkbox-group_19qga_215 ._legend_19qga_247 {
     border: 0;
     clip: rect(0, 0, 0, 0);
     height: 1px;
@@ -253,7 +259,7 @@
     white-space: nowrap;
     width: 1px;
   }
-  ._checkbox-group_zshjc_209 ._children_zshjc_253 {
+  ._checkbox-group_19qga_215 ._children_19qga_259 {
     display: inline-flex;
     gap: 0.5rem;
     flex-direction: column;

package/dist/{index-CqdP5W00.js → index-V5Ez2gq_.js}

@@ -5,7 +5,7 @@ import { forwardRef } from 'react';
 import { c as cx } from './index-tZvMCc77.js';
 import { B as ButtonCompound } from './ButtonCompound-BF2Q6gGX.js';
 
-import './index2.css';const SvgDragIndicator = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" }));
+import './index.css';const SvgDragIndicator = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" }));
 
 const handle = "_handle_z85jk_2";
 const active = "_active_z85jk_24";
@@ -103,4 +103,4 @@ const Dnd = {
 };
 
 export { Dnd as D, DndSortLine as a, DndHandleButton as b, DndHandle as c, styles as s };
-//# sourceMappingURL=index-CqdP5W00.js.map
+//# sourceMappingURL=index-V5Ez2gq_.js.map