moduix 0.11.0 → 0.11.2

package/dist/components/NumberField/NumberField.css

@@ -0,0 +1,158 @@
+@layer ui.components {
+  .YMhIBW_root {
+    align-items: flex-start;
+    gap: var(--number-field-gap, var(--spacing-1));
+    width: var(--number-field-width, auto);
+    max-width: var(--number-field-max-width, none);
+    flex-direction: column;
+    display: flex;
+  }
+
+  .YMhIBW_scrubArea {
+    align-items: center;
+    gap: var(--number-field-scrub-area-gap, var(--spacing-2));
+    color: var(--number-field-scrub-area-color, var(--color-foreground));
+    user-select: none;
+    cursor: ew-resize;
+    display: inline-flex;
+
+    &[data-disabled], &[data-readonly] {
+      cursor: default;
+      opacity: var(--number-field-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .YMhIBW_scrubAreaCursor {
+    width: var(--number-field-scrub-area-cursor-size, 1.5rem);
+    height: var(--number-field-scrub-area-cursor-size, 1.5rem);
+    flex-shrink: 0;
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+
+    & > svg {
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  .YMhIBW_group {
+    align-items: stretch;
+    display: inline-flex;
+  }
+
+  .YMhIBW_decrement, .YMhIBW_increment {
+    --_number-field-focus-ring-width: var(--number-field-focus-ring-width, var(--number-field-border-width, var(--border-width-sm)));
+    box-sizing: border-box;
+    width: var(--number-field-control-height, var(--size-lg));
+    min-width: var(--number-field-control-height, var(--size-lg));
+    height: var(--number-field-control-height, var(--size-lg));
+    border: var(--number-field-border-width, var(--border-width-sm))
+      var(--number-field-border-style, solid) var(--number-field-border-color, var(--color-border));
+    background-color: var(--number-field-button-bg, var(--color-background));
+    color: var(--number-field-button-color, var(--color-foreground));
+    user-select: none;
+    cursor: pointer;
+    transition: background-color var(--transition-default),
+      border-color var(--transition-default),
+      color var(--transition-default),
+      opacity var(--transition-default);
+    outline: 0;
+    justify-content: center;
+    align-items: center;
+    margin: 0;
+    padding: 0;
+    display: inline-flex;
+
+    @media (hover: hover) {
+      &:hover {
+        background-color: var(--number-field-button-bg-hover, var(--color-accent));
+      }
+    }
+
+    &:active {
+      background-color: var(--number-field-button-bg-active, var(--number-field-button-bg-hover, var(--color-accent)));
+    }
+
+    &:focus-visible {
+      outline: var(--_number-field-focus-ring-width) solid
+        var(--number-field-focus-ring-color, var(--color-ring));
+      outline-offset: calc(var(--_number-field-focus-ring-width) * -1);
+      z-index: 1;
+    }
+
+    &[data-disabled], &[data-readonly], &:disabled {
+      opacity: var(--number-field-disabled-opacity, var(--opacity-disabled));
+      pointer-events: none;
+    }
+
+    &[data-invalid] {
+      border-color: var(--number-field-border-color-invalid, var(--color-destructive));
+    }
+
+    & > svg {
+      width: var(--number-field-icon-size, .875rem);
+      height: var(--number-field-icon-size, .875rem);
+      flex-shrink: 0;
+    }
+  }
+
+  .YMhIBW_decrement {
+    border-radius: var(--number-field-radius, var(--radius-md)) 0 0
+      var(--number-field-radius, var(--radius-md));
+    border-right: 0;
+  }
+
+  .YMhIBW_increment {
+    border-radius: 0 var(--number-field-radius, var(--radius-md))
+      var(--number-field-radius, var(--radius-md)) 0;
+    border-left: 0;
+  }
+
+  .YMhIBW_input {
+    --_number-field-focus-ring-width: var(--number-field-focus-ring-width, var(--number-field-border-width, var(--border-width-sm)));
+    box-sizing: border-box;
+    width: var(--number-field-input-width, 6rem);
+    height: var(--number-field-control-height, var(--size-lg));
+    border-top: var(--number-field-border-width, var(--border-width-sm))
+      var(--number-field-border-style, solid) var(--number-field-border-color, var(--color-border));
+    border-bottom: var(--number-field-border-width, var(--border-width-sm))
+      var(--number-field-border-style, solid) var(--number-field-border-color, var(--color-border));
+    padding: var(--number-field-input-padding-y, .5rem)
+      var(--number-field-input-padding-x, .75rem);
+    background-color: var(--number-field-input-bg, var(--color-background));
+    color: var(--number-field-input-color, var(--color-foreground));
+    font: inherit;
+    font-size: var(--number-field-input-font-size, var(--text-md));
+    line-height: var(--number-field-input-line-height, var(--line-height-text-md));
+    text-align: center;
+    font-variant-numeric: tabular-nums;
+    outline: var(--_number-field-focus-ring-width) solid transparent;
+    outline-offset: calc(var(--_number-field-focus-ring-width) * -1);
+    transition: border-color var(--transition-default),
+      outline-color var(--transition-default),
+      opacity var(--transition-default);
+    border-left: 0;
+    border-right: 0;
+    border-radius: 0;
+    margin: 0;
+
+    &:focus-visible {
+      outline-color: var(--number-field-focus-ring-color, var(--color-ring));
+      z-index: 1;
+    }
+
+    &[data-invalid] {
+      border-top-color: var(--number-field-border-color-invalid, var(--color-destructive));
+      border-bottom-color: var(--number-field-border-color-invalid, var(--color-destructive));
+    }
+
+    &[data-invalid]:focus-visible {
+      outline-color: var(--number-field-border-color-invalid, var(--color-destructive));
+    }
+
+    &[data-disabled], &[data-readonly] {
+      opacity: var(--number-field-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+}

package/dist/components/NumberField/NumberField.d.ts

@@ -1,15 +1,49 @@
-import { NumberField as NumberFieldPrimitive } from '@base-ui/react/number-field';
-type NumberFieldProps = NumberFieldPrimitive.Root.Props & {
-    decrementLabel?: string;
-    incrementLabel?: string;
+import { NumberField } from "@base-ui/react/number-field";
+
+//#region src/components/NumberField/NumberField.d.ts
+type NumberFieldProps = NumberField.Root.Props & {
+  decrementLabel?: string;
+  incrementLabel?: string;
 };
-declare function NumberFieldRoot({ className, ...props }: NumberFieldPrimitive.Root.Props): import("react").JSX.Element;
-declare function NumberField({ className, children, decrementLabel, incrementLabel, ...props }: NumberFieldProps): import("react").JSX.Element;
-declare function NumberFieldScrubArea({ className, ...props }: NumberFieldPrimitive.ScrubArea.Props): import("react").JSX.Element;
-declare function NumberFieldScrubAreaCursor({ className, children, ...props }: NumberFieldPrimitive.ScrubAreaCursor.Props): import("react").JSX.Element;
-declare function NumberFieldGroup({ className, ...props }: NumberFieldPrimitive.Group.Props): import("react").JSX.Element;
-declare function NumberFieldDecrement({ className, children, 'aria-label': ariaLabel, ...props }: NumberFieldPrimitive.Decrement.Props): import("react").JSX.Element;
-declare function NumberFieldInput({ className, ...props }: NumberFieldPrimitive.Input.Props): import("react").JSX.Element;
-declare function NumberFieldIncrement({ className, children, 'aria-label': ariaLabel, ...props }: NumberFieldPrimitive.Increment.Props): import("react").JSX.Element;
-export { NumberField, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor, NumberFieldGroup, NumberFieldDecrement, NumberFieldInput, NumberFieldIncrement, };
-export type { NumberFieldProps };
+declare function NumberFieldRoot({
+  className,
+  ...props
+}: NumberField.Root.Props): import("react").JSX.Element;
+declare function NumberField$1({
+  className,
+  children,
+  decrementLabel,
+  incrementLabel,
+  ...props
+}: NumberFieldProps): import("react").JSX.Element;
+declare function NumberFieldScrubArea({
+  className,
+  ...props
+}: NumberField.ScrubArea.Props): import("react").JSX.Element;
+declare function NumberFieldScrubAreaCursor({
+  className,
+  children,
+  ...props
+}: NumberField.ScrubAreaCursor.Props): import("react").JSX.Element;
+declare function NumberFieldGroup({
+  className,
+  ...props
+}: NumberField.Group.Props): import("react").JSX.Element;
+declare function NumberFieldDecrement({
+  className,
+  children,
+  'aria-label': ariaLabel,
+  ...props
+}: NumberField.Decrement.Props): import("react").JSX.Element;
+declare function NumberFieldInput({
+  className,
+  ...props
+}: NumberField.Input.Props): import("react").JSX.Element;
+declare function NumberFieldIncrement({
+  className,
+  children,
+  'aria-label': ariaLabel,
+  ...props
+}: NumberField.Increment.Props): import("react").JSX.Element;
+//#endregion
+export { NumberField$1 as NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, type NumberFieldProps, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor };

package/dist/components/NumberField/NumberField.js

@@ -0,0 +1,75 @@
+import { MinusIcon, PlusIcon, ScrubCursorIcon } from "../../icons/ui/Icons.js";
+import { mergeClassName } from "../../utils/mergeClassName.js";
+import NumberField_module_default from "./NumberField.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { NumberField } from "@base-ui/react/number-field";
+//#region src/components/NumberField/NumberField.tsx
+const DEFAULT_DECREMENT_LABEL = "Decrease value";
+const DEFAULT_INCREMENT_LABEL = "Increase value";
+function NumberFieldRoot({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NumberField.Root, {
+		"data-slot": "number-field-root",
+		className: mergeClassName(className, NumberField_module_default.root),
+		...props
+	});
+}
+function NumberField$1({ className, children, decrementLabel = DEFAULT_DECREMENT_LABEL, incrementLabel = DEFAULT_INCREMENT_LABEL, ...props }) {
+	return /* @__PURE__ */ jsxs(NumberFieldRoot, {
+		className,
+		...props,
+		children: [children, /* @__PURE__ */ jsxs(NumberFieldGroup, { children: [
+			/* @__PURE__ */ jsx(NumberFieldDecrement, { "aria-label": decrementLabel }),
+			/* @__PURE__ */ jsx(NumberFieldInput, {}),
+			/* @__PURE__ */ jsx(NumberFieldIncrement, { "aria-label": incrementLabel })
+		] })]
+	});
+}
+function NumberFieldScrubArea({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NumberField.ScrubArea, {
+		"data-slot": "number-field-scrub-area",
+		className: mergeClassName(className, NumberField_module_default.scrubArea),
+		...props
+	});
+}
+function NumberFieldScrubAreaCursor({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx(NumberField.ScrubAreaCursor, {
+		"data-slot": "number-field-scrub-area-cursor",
+		className: mergeClassName(className, NumberField_module_default.scrubAreaCursor),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ScrubCursorIcon, {})
+	});
+}
+function NumberFieldGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NumberField.Group, {
+		"data-slot": "number-field-group",
+		className: mergeClassName(className, NumberField_module_default.group),
+		...props
+	});
+}
+function NumberFieldDecrement({ className, children, "aria-label": ariaLabel = DEFAULT_DECREMENT_LABEL, ...props }) {
+	return /* @__PURE__ */ jsx(NumberField.Decrement, {
+		"data-slot": "number-field-decrement",
+		"aria-label": ariaLabel,
+		className: mergeClassName(className, NumberField_module_default.decrement),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(MinusIcon, {})
+	});
+}
+function NumberFieldInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx(NumberField.Input, {
+		"data-slot": "number-field-input",
+		className: mergeClassName(className, NumberField_module_default.input),
+		...props
+	});
+}
+function NumberFieldIncrement({ className, children, "aria-label": ariaLabel = DEFAULT_INCREMENT_LABEL, ...props }) {
+	return /* @__PURE__ */ jsx(NumberField.Increment, {
+		"data-slot": "number-field-increment",
+		"aria-label": ariaLabel,
+		className: mergeClassName(className, NumberField_module_default.increment),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(PlusIcon, {})
+	});
+}
+//#endregion
+export { NumberField$1 as NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor };

package/dist/components/NumberField/NumberField.module.js

@@ -0,0 +1,13 @@
+import './NumberField.css';
+//#region src/components/NumberField/NumberField.module.css
+var NumberField_module_default = {
+	"decrement": "YMhIBW_decrement",
+	"group": "YMhIBW_group",
+	"increment": "YMhIBW_increment",
+	"input": "YMhIBW_input",
+	"root": "YMhIBW_root",
+	"scrubArea": "YMhIBW_scrubArea",
+	"scrubAreaCursor": "YMhIBW_scrubAreaCursor"
+};
+//#endregion
+export { NumberField_module_default as default };

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

@@ -1,2 +1 @@
-export { NumberField, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor, NumberFieldGroup, NumberFieldDecrement, NumberFieldInput, NumberFieldIncrement, } from './NumberField';
-export type { NumberFieldProps } from './NumberField';
+import { NumberField, NumberFieldDecrement, NumberFieldGroup, NumberFieldIncrement, NumberFieldInput, NumberFieldProps, NumberFieldRoot, NumberFieldScrubArea, NumberFieldScrubAreaCursor } from "./NumberField.js";

package/dist/components/OTPField/OTPField.css

@@ -0,0 +1,78 @@
+@layer ui.components {
+  .aEYTXG_root {
+    align-items: center;
+    gap: var(--otp-field-gap, var(--spacing-2));
+    width: var(--otp-field-width, auto);
+    max-width: var(--otp-field-max-width, none);
+    display: inline-flex;
+
+    &[data-disabled], &[data-readonly] {
+      opacity: var(--otp-field-disabled-opacity, var(--opacity-disabled));
+    }
+  }
+
+  .aEYTXG_input {
+    box-sizing: border-box;
+    width: var(--otp-field-input-width, var(--otp-field-input-size, 2.5rem));
+    min-width: var(--otp-field-input-width, var(--otp-field-input-size, 2.5rem));
+    height: var(--otp-field-input-height, var(--otp-field-input-size, 2.5rem));
+    border: var(--otp-field-border-width, var(--border-width-sm)) solid
+      var(--otp-field-border-color, var(--color-border));
+    border-radius: var(--otp-field-radius, var(--radius-md));
+    padding-block: var(--otp-field-input-padding-y, 0);
+    padding-inline: var(--otp-field-input-padding-x, 0);
+    background-color: var(--otp-field-bg, var(--color-background));
+    color: var(--otp-field-color, var(--color-foreground));
+    font: inherit;
+    font-size: var(--otp-field-font-size, var(--text-lg));
+    font-weight: var(--otp-field-font-weight, var(--weight-medium));
+    line-height: var(--otp-field-line-height, var(--line-height-text-lg));
+    text-align: center;
+    font-variant-numeric: tabular-nums;
+    outline: var(--otp-field-focus-ring-width, var(--otp-field-border-width, var(--border-width-sm)))
+      solid transparent;
+    outline-offset: var(--otp-field-focus-ring-offset, -1px);
+    transition: border-color var(--otp-field-transition, var(--transition-default)),
+      outline-color var(--otp-field-transition, var(--transition-default)),
+      background-color var(--otp-field-transition, var(--transition-default));
+    margin: 0;
+
+    &::placeholder {
+      color: var(--otp-field-placeholder-color, var(--color-muted-foreground));
+    }
+
+    &:focus-visible {
+      outline-color: var(--otp-field-focus-ring-color, var(--color-ring));
+    }
+
+    &[data-filled] {
+      background-color: var(--otp-field-bg-filled, var(--otp-field-bg, var(--color-background)));
+    }
+
+    &[data-invalid] {
+      border-color: var(--otp-field-border-color-invalid, var(--color-destructive));
+    }
+
+    &[data-invalid]:focus-visible {
+      outline-color: var(--otp-field-border-color-invalid, var(--color-destructive));
+    }
+
+    &[data-complete][data-filled] {
+      border-color: var(--otp-field-border-color-complete, var(--otp-field-border-color, var(--color-border)));
+    }
+
+    &[data-disabled], &[data-readonly] {
+      pointer-events: none;
+    }
+  }
+
+  .aEYTXG_separator {
+    width: var(--otp-field-separator-width, var(--otp-field-separator-size, 1rem));
+    height: var(--otp-field-separator-height, var(--otp-field-separator-size, 1rem));
+    color: var(--otp-field-separator-color, var(--color-muted-foreground));
+    flex-shrink: 0;
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+  }
+}

package/dist/components/OTPField/OTPField.d.ts

@@ -1,5 +1,19 @@
-import { OTPFieldPreview as OTPFieldPrimitive } from '@base-ui/react/otp-field';
-declare function OTPField({ children, className, length, ...props }: OTPFieldPrimitive.Root.Props): import("react").JSX.Element;
-declare function OTPFieldInput({ className, ...props }: OTPFieldPrimitive.Input.Props): import("react").JSX.Element;
-declare function OTPFieldSeparator({ className, ...props }: OTPFieldPrimitive.Separator.Props): import("react").JSX.Element;
-export { OTPField, OTPFieldInput, OTPFieldSeparator };
+import { OTPFieldPreview } from "@base-ui/react/otp-field";
+
+//#region src/components/OTPField/OTPField.d.ts
+declare function OTPField({
+  children,
+  className,
+  length,
+  ...props
+}: OTPFieldPreview.Root.Props): import("react").JSX.Element;
+declare function OTPFieldInput({
+  className,
+  ...props
+}: OTPFieldPreview.Input.Props): import("react").JSX.Element;
+declare function OTPFieldSeparator({
+  className,
+  ...props
+}: OTPFieldPreview.Separator.Props): import("react").JSX.Element;
+//#endregion
+export { OTPField, OTPFieldInput, OTPFieldSeparator };

package/dist/components/OTPField/OTPField.js

@@ -0,0 +1,39 @@
+import { mergeClassName } from "../../utils/mergeClassName.js";
+import OTPField_module_default from "./OTPField.module.js";
+import { jsx } from "react/jsx-runtime";
+import { OTPFieldPreview } from "@base-ui/react/otp-field";
+//#region src/components/OTPField/OTPField.tsx
+function OTPField({ children, className, length, ...props }) {
+	return /* @__PURE__ */ jsx(OTPFieldPreview.Root, {
+		"data-slot": "otp-field-root",
+		className: mergeClassName(className, OTPField_module_default.root),
+		length,
+		...props,
+		children: children ?? renderDefaultInputs(length)
+	});
+}
+function OTPFieldInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx(OTPFieldPreview.Input, {
+		"data-slot": "otp-field-input",
+		className: mergeClassName(className, OTPField_module_default.input),
+		...props
+	});
+}
+function OTPFieldSeparator({ className, ...props }) {
+	const { "aria-hidden": ariaHidden = true, role = "presentation", ...separatorProps } = props;
+	return /* @__PURE__ */ jsx(OTPFieldPreview.Separator, {
+		"data-slot": "otp-field-separator",
+		"aria-hidden": ariaHidden,
+		role,
+		className: mergeClassName(className, OTPField_module_default.separator),
+		...separatorProps
+	});
+}
+function getCharacterAriaLabel(index, length) {
+	return index === 0 ? void 0 : `Character ${index + 1} of ${length}`;
+}
+function renderDefaultInputs(length) {
+	return Array.from({ length }, (_, index) => /* @__PURE__ */ jsx(OTPFieldInput, { "aria-label": getCharacterAriaLabel(index, length) }, index));
+}
+//#endregion
+export { OTPField, OTPFieldInput, OTPFieldSeparator };

package/dist/components/OTPField/OTPField.module.js

@@ -0,0 +1,9 @@
+import './OTPField.css';
+//#region src/components/OTPField/OTPField.module.css
+var OTPField_module_default = {
+	"input": "aEYTXG_input",
+	"root": "aEYTXG_root",
+	"separator": "aEYTXG_separator"
+};
+//#endregion
+export { OTPField_module_default as default };

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

@@ -1 +1 @@
-export { OTPField, OTPFieldInput, OTPFieldSeparator } from './OTPField';
+import { OTPField, OTPFieldInput, OTPFieldSeparator } from "./OTPField.js";

package/dist/components/Pagination/Pagination.css

@@ -0,0 +1,103 @@
+@layer ui.components {
+  .Etg_Eq_root {
+    display: flex;
+  }
+
+  .Etg_Eq_content {
+    align-items: center;
+    gap: var(--pagination-gap, var(--spacing-1));
+    display: inline-flex;
+  }
+
+  .Etg_Eq_item {
+    display: inline-flex;
+  }
+
+  .Etg_Eq_link, .Etg_Eq_ellipsis {
+    box-sizing: border-box;
+    min-width: var(--pagination-item-size, var(--size-lg));
+    min-height: var(--pagination-item-size, var(--size-lg));
+    border-radius: var(--pagination-item-radius, var(--radius-md));
+    font-size: var(--pagination-font-size, var(--text-sm));
+    font-weight: var(--pagination-font-weight, var(--weight-medium));
+    line-height: var(--pagination-line-height, var(--line-height-text-sm));
+    justify-content: center;
+    align-items: center;
+    display: inline-flex;
+  }
+
+  .Etg_Eq_link {
+    gap: var(--spacing-2);
+    border: var(--border-width-sm) solid var(--pagination-item-border-color, var(--color-border));
+    padding-inline: var(--pagination-item-padding-inline, .75rem);
+    background-color: var(--pagination-item-bg, var(--color-background));
+    color: var(--pagination-item-color, var(--color-foreground));
+    user-select: none;
+    white-space: nowrap;
+    transition: background-color var(--transition-default),
+      border-color var(--transition-default),
+      color var(--transition-default),
+      opacity var(--transition-default);
+    text-decoration: none;
+
+    @media (hover: hover) {
+      &:hover {
+        background-color: var(--pagination-item-bg-hover, var(--color-accent));
+      }
+    }
+
+    &:focus-visible {
+      outline: var(--border-width-md) solid var(--color-ring);
+      outline-offset: -1px;
+    }
+
+    &[aria-disabled="true"], &[data-disabled], &[disabled] {
+      opacity: var(--pagination-disabled-opacity, var(--opacity-disabled));
+      pointer-events: none;
+    }
+
+    & :where(svg) {
+      width: var(--pagination-icon-size, 1rem);
+      height: var(--pagination-icon-size, 1rem);
+      flex-shrink: 0;
+    }
+  }
+
+  .Etg_Eq_linkActive, .Etg_Eq_link[aria-current="page"] {
+    border-color: var(--pagination-item-border-color-active, var(--color-foreground));
+    background-color: var(--pagination-item-bg-active, var(--color-foreground));
+    color: var(--pagination-item-color-active, var(--color-background));
+
+    @media (hover: hover) {
+      &:hover {
+        background-color: var(--pagination-item-bg-active, var(--color-foreground));
+      }
+    }
+  }
+
+  .Etg_Eq_previous, .Etg_Eq_next {
+    padding-inline: max(var(--pagination-item-padding-inline, .75rem), var(--spacing-3));
+  }
+
+  .Etg_Eq_iconOnly {
+    width: var(--pagination-item-size, var(--size-lg));
+    padding-inline: 0;
+  }
+
+  .Etg_Eq_ellipsis {
+    color: var(--pagination-ellipsis-color, var(--color-muted-foreground));
+    user-select: none;
+  }
+
+  .Etg_Eq_visuallyHidden {
+    clip: rect(0 0 0 0);
+    white-space: nowrap;
+    border: 0;
+    width: 1px;
+    height: 1px;
+    margin: -1px;
+    padding: 0;
+    position: absolute;
+    overflow: hidden;
+  }
+}

package/dist/components/Pagination/Pagination.d.ts

@@ -1,25 +1,63 @@
-import { Toolbar as ToolbarPrimitive } from '@base-ui/react/toolbar';
-import { ComponentProps } from 'react';
-declare function usePagination({ count, page, siblingCount, boundaryCount, }: {
-    count: number;
-    page: number;
-    siblingCount?: number;
-    boundaryCount?: number;
+import { ComponentProps } from "react";
+import { Toolbar } from "@base-ui/react/toolbar";
+
+//#region src/components/Pagination/Pagination.d.ts
+declare function usePagination({
+  count,
+  page,
+  siblingCount,
+  boundaryCount
+}: {
+  count: number;
+  page: number;
+  siblingCount?: number;
+  boundaryCount?: number;
 }): {
-    items: (number | "ellipsis-start" | "ellipsis-end")[];
-    page: number;
-    canNextPage: boolean;
-    canPreviousPage: boolean;
-    nextPage: number;
-    previousPage: number;
+  items: (number | "ellipsis-start" | "ellipsis-end")[];
+  page: number;
+  canNextPage: boolean;
+  canPreviousPage: boolean;
+  nextPage: number;
+  previousPage: number;
 };
-declare function Pagination({ 'aria-label': ariaLabel, className, ...props }: ComponentProps<'nav'>): import("react").JSX.Element;
-declare function PaginationContent({ className, ...props }: ToolbarPrimitive.Root.Props): import("react").JSX.Element;
-declare function PaginationItem({ className, ...props }: ComponentProps<'div'>): import("react").JSX.Element;
-declare function PaginationLink({ className, isActive, render, ...props }: ToolbarPrimitive.Link.Props & {
-    isActive?: boolean;
+declare function Pagination({
+  'aria-label': ariaLabel,
+  className,
+  ...props
+}: ComponentProps<'nav'>): import("react").JSX.Element;
+declare function PaginationContent({
+  className,
+  ...props
+}: Toolbar.Root.Props): import("react").JSX.Element;
+declare function PaginationItem({
+  className,
+  ...props
+}: ComponentProps<'div'>): import("react").JSX.Element;
+declare function PaginationLink({
+  className,
+  isActive,
+  render,
+  ...props
+}: Toolbar.Link.Props & {
+  isActive?: boolean;
 }): import("react").JSX.Element;
-declare function PaginationPrevious({ children, className, render, 'aria-label': ariaLabel, ...props }: ToolbarPrimitive.Link.Props): import("react").JSX.Element;
-declare function PaginationNext({ children, className, render, 'aria-label': ariaLabel, ...props }: ToolbarPrimitive.Link.Props): import("react").JSX.Element;
-declare function PaginationEllipsis({ className, ...props }: ComponentProps<'span'>): import("react").JSX.Element;
-export { Pagination, PaginationContent, PaginationItem, PaginationLink, PaginationPrevious, PaginationNext, PaginationEllipsis, usePagination, };
+declare function PaginationPrevious({
+  children,
+  className,
+  render,
+  'aria-label': ariaLabel,
+  ...props
+}: Toolbar.Link.Props): import("react").JSX.Element;
+declare function PaginationNext({
+  children,
+  className,
+  render,
+  'aria-label': ariaLabel,
+  ...props
+}: Toolbar.Link.Props): import("react").JSX.Element;
+declare function PaginationEllipsis({
+  className,
+  ...props
+}: ComponentProps<'span'>): import("react").JSX.Element;
+//#endregion
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, usePagination };