reshaped 4.0.3 → 4.1.0

package/dist/components/Checkbox/Checkbox.module.css

@@ -1 +1 @@
-.root{align-items:center;cursor:pointer;display:inline-flex;gap:var(--rs-checkbox-gap);user-select:none;vertical-align:top;-webkit-tap-highlight-color:transparent}@media (hover:hover) and (pointer:fine){.root:hover .decorator{background:var(--rs-color-background-neutral-faded)}}.field{position:relative}.decorator{background:var(--rs-color-background-elevation-base);border:1px solid var(--rs-color-border-neutral);border-radius:var(--rs-radius-small);color:var(--rs-color-on-background-primary);height:var(--rs-checkbox-line-height);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:background-color,border-color;width:var(--rs-checkbox-line-height)}.decorator:before{background:var(--rs-color-on-background-primary);border-radius:var(--rs-radius-circular);content:"";height:1.5px;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:opacity,transform;width:calc(var(--rs-checkbox-line-height) * .5)}.--size-small{--rs-checkbox-line-height:var(--rs-line-height-caption-1);--rs-checkbox-gap:var(--rs-unit-x1-5)}.--size-medium{--rs-checkbox-line-height:var(--rs-line-height-body-2);--rs-checkbox-gap:var(--rs-unit-x2)}.--size-large{--rs-checkbox-line-height:var(--rs-line-height-body-1);--rs-checkbox-gap:var(--rs-unit-x2)}.icon{left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%) scale(0);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:opacity,transform}[data-rs-keyboard] .input:focus+.decorator{outline:var(--rs-outline);outline-offset:var(--rs-outline-width)}.root.--error .decorator{border-color:var(--rs-color-border-critical);border-width:var(--rs-outline-width)}.input:checked+.decorator,.input:indeterminate+.decorator{background:var(--rs-color-background-primary);border-color:var(--rs-color-background-primary)}.input:checked+.decorator .icon,.input:indeterminate+.decorator:before{opacity:1;transform:translate(-50%,-50%) scale(1)}.root.--disabled{color:var(--rs-color-foreground-disabled);cursor:not-allowed}.root.--disabled .decorator{background:var(--rs-color-background-disabled-faded);border-color:var(--rs-color-border-disabled);color:var(--rs-color-foreground-disabled)}.root.--disabled .input:checked+.decorator,.root.--disabled .input:indeterminate+.decorator{background:var(--rs-color-background-disabled);border-color:transparent}.root.--disabled .input:checked+.decorator:before,.root.--disabled .input:indeterminate+.decorator:before{background-color:var(--rs-color-foreground-disabled)}@media (--rs-viewport-m ){.--size-small--m{--rs-checkbox-line-height:var(--rs-line-height-caption-1);--rs-checkbox-gap:var(--rs-unit-x1-5)}.--size-medium--m{--rs-checkbox-line-height:var(--rs-line-height-body-2);--rs-checkbox-gap:var(--rs-unit-x2)}.--size-large--m{--rs-checkbox-line-height:var(--rs-line-height-body-1);--rs-checkbox-gap:var(--rs-unit-x2)}}@media (--rs-viewport-l ){.--size-small--l{--rs-checkbox-line-height:var(--rs-line-height-caption-1);--rs-checkbox-gap:var(--rs-unit-x1-5)}.--size-medium--l{--rs-checkbox-line-height:var(--rs-line-height-body-2);--rs-checkbox-gap:var(--rs-unit-x2)}.--size-large--l{--rs-checkbox-line-height:var(--rs-line-height-body-1);--rs-checkbox-gap:var(--rs-unit-x2)}}@media (--rs-viewport-xl ){.--size-small--xl{--rs-checkbox-line-height:var(--rs-line-height-caption-1);--rs-checkbox-gap:var(--rs-unit-x1-5)}.--size-medium--xl{--rs-checkbox-line-height:var(--rs-line-height-body-2);--rs-checkbox-gap:var(--rs-unit-x2)}.--size-large--xl{--rs-checkbox-line-height:var(--rs-line-height-body-1);--rs-checkbox-gap:var(--rs-unit-x2)}}
+.root{display:inline-flex;gap:var(--rs-checkbox-gap);vertical-align:top;align-items:center;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}@media (hover:hover) and (pointer:fine){.root:hover .decorator{background:var(--rs-color-background-neutral-faded)}}.field{position:relative}.decorator{width:var(--rs-checkbox-line-height);height:var(--rs-checkbox-line-height);border-radius:var(--rs-radius-small);color:var(--rs-color-on-background-primary);border:1px solid var(--rs-color-border-neutral);background:var(--rs-color-background-elevation-base);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:background-color,border-color}.decorator:before{content:"";position:absolute;top:50%;left:50%;height:1.5px;border-radius:var(--rs-radius-circular);width:calc(var(--rs-checkbox-line-height) * .5);background:var(--rs-color-on-background-primary);opacity:0;transform:translate(-50%,-50%) scale(0);transition:var(--rs-duration-fast) var(--rs-easing-standard);transition-property:opacity,transform}.--size-small{--rs-checkbox-line-height:var(--rs-line-height-caption-1);--rs-checkbox-gap:var(--rs-unit-x1-5)}.--size-medium{--rs-checkbox-line-height:var(--rs-line-height-body-2);--rs-checkbox-gap:var(--rs-unit-x2)}.--size-large{--rs-checkbox-line-height:var(--rs-line-height-body-1);--rs-checkbox-gap:var(--rs-unit-x2)}.icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);opacity:0;transition:var(--rs-duration-fast) var(--rs-easing-standard)!important;transition-property:opacity,transform!important}[data-rs-keyboard] .input:focus+.decorator{outline:var(--rs-outline);outline-offset:var(--rs-outline-width)}.root.--error .decorator{border-color:var(--rs-color-border-critical);border-width:var(--rs-outline-width)}.input:checked+.decorator,.input:indeterminate+.decorator{border-color:var(--rs-color-background-primary);background:var(--rs-color-background-primary)}.input:checked+.decorator .icon,.input:indeterminate+.decorator:before{opacity:1;transform:translate(-50%,-50%) scale(1)}.root.--disabled{cursor:not-allowed;color:var(--rs-color-foreground-disabled)}.root.--disabled .decorator{background:var(--rs-color-background-disabled-faded);border-color:var(--rs-color-border-disabled);color:var(--rs-color-foreground-disabled)}.root.--disabled .input:checked+.decorator,.root.--disabled .input:indeterminate+.decorator{background:var(--rs-color-background-disabled);border-color:transparent}.root.--disabled .input:checked+.decorator:before,.root.--disabled .input:indeterminate+.decorator:before{background-color:var(--rs-color-foreground-disabled)}@media (--rs-viewport-m ){.--size-small--m{--rs-checkbox-line-height:var(--rs-line-height-caption-1);--rs-checkbox-gap:var(--rs-unit-x1-5)}.--size-medium--m{--rs-checkbox-line-height:var(--rs-line-height-body-2);--rs-checkbox-gap:var(--rs-unit-x2)}.--size-large--m{--rs-checkbox-line-height:var(--rs-line-height-body-1);--rs-checkbox-gap:var(--rs-unit-x2)}}@media (--rs-viewport-l ){.--size-small--l{--rs-checkbox-line-height:var(--rs-line-height-caption-1);--rs-checkbox-gap:var(--rs-unit-x1-5)}.--size-medium--l{--rs-checkbox-line-height:var(--rs-line-height-body-2);--rs-checkbox-gap:var(--rs-unit-x2)}.--size-large--l{--rs-checkbox-line-height:var(--rs-line-height-body-1);--rs-checkbox-gap:var(--rs-unit-x2)}}@media (--rs-viewport-xl ){.--size-small--xl{--rs-checkbox-line-height:var(--rs-line-height-caption-1);--rs-checkbox-gap:var(--rs-unit-x1-5)}.--size-medium--xl{--rs-checkbox-line-height:var(--rs-line-height-body-2);--rs-checkbox-gap:var(--rs-unit-x2)}.--size-large--xl{--rs-checkbox-line-height:var(--rs-line-height-body-1);--rs-checkbox-gap:var(--rs-unit-x2)}}

package/dist/components/Checkbox/index.js

@@ -1 +1 @@
-export { default } from "./Checkbox.js";
+export { default } from "./Checkbox";

package/dist/components/Checkbox/tests/Checkbox.stories.d.ts

@@ -2,7 +2,7 @@ import { StoryObj } from "@storybook/react-vite";
 import { fn } from "storybook/test";
 declare const _default: {
     title: string;
-    component: import("react").FC<import("./..").CheckboxProps>;
+    component: import("react").FC<import("../../../components/Checkbox").CheckboxProps>;
     parameters: {
         iframe: {
             url: string;

package/dist/components/Checkbox/tests/Checkbox.stories.js

@@ -5,8 +5,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.className = exports.indeterminate = exports.defaultChecked = exports.checked = exports.disabled = exports.error = exports.size = exports.render = void 0;
 const test_1 = require("storybook/test");
-const Checkbox_1 = __importDefault(require("./.."));
-const View_1 = __importDefault(require("../../View"));
+const Checkbox_1 = __importDefault(require("../../../components/Checkbox"));
+const View_1 = __importDefault(require("../../../components/View"));
 const storybook_1 = require("../../../utilities/storybook");
 exports.default = {
     title: "Components/Checkbox",

package/dist/components/CheckboxGroup/CheckboxGroup.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import CheckboxGroupControlled from "./CheckboxGroupControlled.js";
-import CheckboxGroupUncontrolled from "./CheckboxGroupUncontrolled.js";
+import CheckboxGroupControlled from "./CheckboxGroupControlled";
+import CheckboxGroupUncontrolled from "./CheckboxGroupUncontrolled";
 const CheckboxGroup = (props) => {
     const { value } = props;
     if (value !== undefined)

package/dist/components/CheckboxGroup/CheckboxGroup.types.d.ts

@@ -1,5 +1,5 @@
 import type React from "react";
-import type { CheckboxProps } from "../Checkbox";
+import type { CheckboxProps } from "../../components/Checkbox";
 import type * as G from "../../types/global";
 type BaseProps = {
     /** Component id attribute */

package/dist/components/CheckboxGroup/CheckboxGroupControlled.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import Context from "./CheckboxGroup.context.js";
+import Context from "./CheckboxGroup.context";
 const CheckboxGroupControlled = (props) => {
     const { onChange, name, disabled, value, children, hasError } = props;
     const handleChange = (args) => {

package/dist/components/CheckboxGroup/CheckboxGroupUncontrolled.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
-import CheckboxGroupControlled from "./CheckboxGroupControlled.js";
+import CheckboxGroupControlled from "./CheckboxGroupControlled";
 const CheckboxGroupUncontrolled = (props) => {
     const { defaultValue, onChange } = props;
     const [value, setValue] = React.useState(defaultValue || []);

package/dist/components/CheckboxGroup/index.js

@@ -1,2 +1,2 @@
-export { default } from "./CheckboxGroup.js";
-export { useCheckboxGroup } from "./CheckboxGroup.context.js";
+export { default } from "./CheckboxGroup";
+export { useCheckboxGroup } from "./CheckboxGroup.context";

package/dist/components/CheckboxGroup/tests/CheckboxGroup.stories.d.ts

@@ -2,7 +2,7 @@ import { StoryObj } from "@storybook/react-vite";
 import { fn } from "storybook/test";
 declare const _default: {
     title: string;
-    component: import("react").FC<import("./..").CheckboxGroupProps>;
+    component: import("react").FC<import("../../../components/CheckboxGroup").CheckboxGroupProps>;
     parameters: {
         iframe: {
             url: string;

package/dist/components/CheckboxGroup/tests/CheckboxGroup.stories.js

@@ -5,9 +5,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.disabled = exports.defaultValue = exports.value = void 0;
 const test_1 = require("storybook/test");
-const Checkbox_1 = __importDefault(require("../../Checkbox"));
-const CheckboxGroup_1 = __importDefault(require("./.."));
-const View_1 = __importDefault(require("../../View"));
+const Checkbox_1 = __importDefault(require("../../../components/Checkbox"));
+const CheckboxGroup_1 = __importDefault(require("../../../components/CheckboxGroup"));
+const View_1 = __importDefault(require("../../../components/View"));
 exports.default = {
     title: "Components/CheckboxGroup",
     component: CheckboxGroup_1.default,

package/dist/components/Container/Container.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { classNames } from "@reshaped/utilities";
-import View from "../View/index.js";
+import View from "../../components/View";
 import s from "./Container.module.css";
 const Container = (props) => {
     const { children, padding = 4, width, align, justify, height, maxHeight, className, attributes, } = props;

package/dist/components/Container/Container.types.d.ts

@@ -1,6 +1,6 @@
 import type React from "react";
 import type { ClassName } from "@reshaped/utilities";
-import type { ViewProps } from "../View";
+import type { ViewProps } from "../../components/View";
 import type * as G from "../../types/global";
 import type { Attributes } from "../../types/global";
 export type Props = Pick<ViewProps, "align" | "justify" | "height" | "maxHeight"> & {

package/dist/components/Container/index.js

@@ -1 +1 @@
-export { default } from "./Container.js";
+export { default } from "./Container";

package/dist/components/Container/tests/Container.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from "@storybook/react-vite";
 declare const _default: {
     title: string;
-    component: import("react").FC<import("./..").ContainerProps>;
+    component: import("react").FC<import("../../../components/Container").ContainerProps>;
     parameters: {
         iframe: {
             url: string;

package/dist/components/Container/tests/Container.stories.js

@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.className = exports.flex = exports.size = exports.padding = void 0;
 const test_1 = require("storybook/test");
-const Container_1 = __importDefault(require("./.."));
+const Container_1 = __importDefault(require("../../../components/Container"));
 const storybook_1 = require("../../../utilities/storybook");
 exports.default = {
     title: "Utility components/Container",

package/dist/components/ContextMenu/ContextMenu.js

@@ -1,9 +1,9 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
-import DropdownMenu from "../DropdownMenu/index.js";
-import useHandlerRef from "../../hooks/useHandlerRef.js";
-import useScrollLock from "../../hooks/useScrollLock.js";
+import DropdownMenu from "../../components/DropdownMenu";
+import useHandlerRef from "../../hooks/useHandlerRef";
+import useScrollLock from "../../hooks/useScrollLock";
 import s from "./ContextMenu.module.css";
 const ContextMenu = (props) => {
     const { position = "end-top", onOpen, onClose, ...dropdownMenuProps } = props;

package/dist/components/ContextMenu/ContextMenu.types.d.ts

@@ -1,2 +1,2 @@
-import type { DropdownMenuProps } from "../DropdownMenu";
+import type { DropdownMenuProps } from "../../components/DropdownMenu";
 export type Props = Omit<DropdownMenuProps, "active" | "defaultActive">;

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

@@ -1,4 +1,4 @@
-import DropdownMenu from "../DropdownMenu";
+import DropdownMenu from "../../components/DropdownMenu";
 import ContextMenu from "./ContextMenu";
 declare const ContextMenuRoot: typeof ContextMenu & {
     Content: typeof DropdownMenu.Content;

package/dist/components/ContextMenu/index.js

@@ -1,5 +1,5 @@
-import DropdownMenu from "../DropdownMenu/index.js";
-import ContextMenu from "./ContextMenu.js";
+import DropdownMenu from "../../components/DropdownMenu";
+import ContextMenu from "./ContextMenu";
 const ContextMenuRoot = ContextMenu;
 ContextMenuRoot.Content = DropdownMenu.Content;
 ContextMenuRoot.Item = DropdownMenu.Item;

package/dist/components/ContextMenu/tests/ContextMenu.stories.d.ts

@@ -2,7 +2,7 @@ import { StoryObj } from "@storybook/react-vite";
 import { fn } from "storybook/test";
 declare const _default: {
     title: string;
-    component: import("react").FC<import("./..").ContextMenuProps> & {
+    component: import("react").FC<import("../../../components/ContextMenu").ContextMenuProps> & {
         Content: import("react").FC<import("../../DropdownMenu/DropdownMenu.types").ContentProps>;
         Item: import("react").FC<import("../../DropdownMenu/DropdownMenu.types").ItemProps>;
         Section: import("react").FC<import("../../DropdownMenu/DropdownMenu.types").SectionProps>;

package/dist/components/ContextMenu/tests/ContextMenu.stories.js

@@ -5,8 +5,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.menu = exports.handlers = exports.base = void 0;
 const test_1 = require("storybook/test");
-const ContextMenu_1 = __importDefault(require("./.."));
-const View_1 = __importDefault(require("../../View"));
+const ContextMenu_1 = __importDefault(require("../../../components/ContextMenu"));
+const View_1 = __importDefault(require("../../../components/View"));
 const helpers_1 = require("../../../utilities/helpers");
 const storybook_1 = require("../../../utilities/storybook");
 exports.default = {

package/dist/components/Dismissible/Dismissible.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { classNames } from "@reshaped/utilities";
-import Button from "../Button/index.js";
-import IconClose from "../../icons/Close.js";
+import Button from "../../components/Button";
+import IconClose from "../../icons/Close";
 import s from "./Dismissible.module.css";
 const Dismissible = (props) => {
     const { children, align, onClose, hideCloseButton, variant, closeAriaLabel, className, attributes, } = props;

package/dist/components/Dismissible/Dismissible.module.css

@@ -1 +1 @@
-.root{min-height:var(--rs-unit-x5);padding-inline-end:var(--rs-unit-x7);position:relative}.close{inset-block-start:0;inset-inline-end:0;position:absolute;z-index:5}.--hide-close,.--variant-media{padding:0}.--variant-media .close{inset-block-start:var(--rs-unit-x2);inset-inline-end:var(--rs-unit-x2)}.--align-center .close{inset-block-start:50%;transform:translateY(-50%)}
+.root{position:relative;padding-inline-end:var(--rs-unit-x7);min-height:var(--rs-unit-x5)}.close{position:absolute;inset-block-start:0;inset-inline-end:0;z-index:5}.--hide-close,.--variant-media{padding:0}.--variant-media .close{inset-block-start:var(--rs-unit-x2);inset-inline-end:var(--rs-unit-x2)}.--align-center .close{inset-block-start:50%;transform:translateY(-50%)}

package/dist/components/Dismissible/index.js

@@ -1 +1 @@
-export { default } from "./Dismissible.js";
+export { default } from "./Dismissible";

package/dist/components/Dismissible/tests/Dismissible.stories.d.ts

@@ -2,7 +2,7 @@ import { StoryObj } from "@storybook/react-vite";
 import { fn } from "storybook/test";
 declare const _default: {
     title: string;
-    components: import("react").FC<import("./..").DismissibleProps>;
+    components: import("react").FC<import("../../../components/Dismissible").DismissibleProps>;
     parameters: {
         iframe: {
             url: string;

package/dist/components/Dismissible/tests/Dismissible.stories.js

@@ -5,9 +5,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.className = exports.closeAriaLabel = exports.hideCloseButton = exports.align = exports.variant = void 0;
 const test_1 = require("storybook/test");
-const Dismissible_1 = __importDefault(require("./.."));
-const Image_1 = __importDefault(require("../../Image"));
-const View_1 = __importDefault(require("../../View"));
+const Dismissible_1 = __importDefault(require("../../../components/Dismissible"));
+const Image_1 = __importDefault(require("../../../components/Image"));
+const View_1 = __importDefault(require("../../../components/View"));
 const storybook_1 = require("../../../utilities/storybook");
 exports.default = {
     title: "Utility components/Dismissible",

package/dist/components/Divider/Divider.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { classNames } from "@reshaped/utilities";
-import Text from "../Text/index.js";
-import { responsiveClassNames, responsivePropDependency } from "../../utilities/props.js";
-import { resolveMixin } from "../../styles/mixin.js";
+import Text from "../../components/Text";
+import { responsiveClassNames, responsivePropDependency } from "../../utilities/props";
+import { resolveMixin } from "../../styles/mixin";
 import s from "./Divider.module.css";
 const Divider = (props) => {
     const { vertical, blank, children, contentPosition = "center", color, inset, className, attributes, } = props;

package/dist/components/Divider/Divider.module.css

@@ -1 +1 @@
-.root{--rs-divider-color:var(--rs-color-border-neutral-faded);align-items:center;display:flex;gap:var(--rs-unit-x2);vertical-align:top;width:100%}.root:after,.root:before{background:var(--rs-divider-color);flex-grow:1;height:1px}.root:before{content:""}.--color-neutral{--rs-divider-color:var(--rs-color-border-neutral)}.--blank{margin-top:-1px;position:relative}.--vertical{display:inline-flex;flex-direction:column;min-height:100%;width:auto}.--vertical:after,.--vertical:before{height:auto;width:1px}.--vertical:before{content:""}.--vertical:after{content:none}.--vertical.--blank{margin-top:0;margin-inline-start:-1px}.--vertical .label{display:none}.--content-position-center:after,.--content-position-center:before{content:""}.--content-position-start:before{content:none}.--content-position-start:after{content:""}@media (--rs-viewport-m ){.--vertical-true--m{display:inline-flex;flex-direction:column;min-height:100%;width:auto}.--vertical-true--m:after,.--vertical-true--m:before{height:auto;width:1px}.--vertical-true--m:before{content:""}.--vertical-true--m:after{content:none}.--vertical-true--m.--blank{margin-top:0;margin-inline-start:-1px}.--vertical-true--m .label{display:none}.--vertical-false--m{display:flex;flex-direction:row;height:auto;width:100%}.--vertical-false--m:after,.--vertical-false--m:before{height:1px;width:auto}.--vertical-false--m.--blank{margin-top:-1px;margin-inline-start:0}}@media (--rs-viewport-l ){.--vertical-true--l{display:inline-flex;flex-direction:column;min-height:100%;width:auto}.--vertical-true--l:after,.--vertical-true--l:before{height:auto;width:1px}.--vertical-true--l:before{content:""}.--vertical-true--l:after{content:none}.--vertical-true--l.--blank{margin-top:0;margin-inline-start:-1px}.--vertical-true--l .label{display:none}.--vertical-false--l{display:flex;flex-direction:row;height:auto;width:100%}.--vertical-false--l:after,.--vertical-false--l:before{height:1px;width:auto}.--vertical-false--l.--blank{margin-top:-1px;margin-inline-start:0}}@media (--rs-viewport-xl ){.--vertical-true--xl{display:inline-flex;flex-direction:column;min-height:100%;width:auto}.--vertical-true--xl:after,.--vertical-true--xl:before{height:auto;width:1px}.--vertical-true--xl:before{content:""}.--vertical-true--xl:after{content:none}.--vertical-true--xl.--blank{margin-top:0;margin-inline-start:-1px}.--vertical-true--xl .label{display:none}.--vertical-false--xl{display:flex;flex-direction:row;height:auto;width:100%}.--vertical-false--xl:after,.--vertical-false--xl:before{height:1px;width:auto}.--vertical-false--xl.--blank{margin-top:-1px;margin-inline-start:0}}
+.root{--rs-divider-color:var(--rs-color-border-neutral-faded);align-items:center;gap:var(--rs-unit-x2);display:flex;width:100%;vertical-align:top}.root:after,.root:before{flex-grow:1;height:1px;background:var(--rs-divider-color)}.root:before{content:""}.--color-neutral{--rs-divider-color:var(--rs-color-border-neutral)}.--blank{position:relative;margin-top:-1px}.--vertical{min-height:100%;width:auto;display:inline-flex;flex-direction:column}.--vertical:after,.--vertical:before{height:auto;width:1px}.--vertical:before{content:""}.--vertical:after{content:none}.--vertical.--blank{margin-top:0;margin-inline-start:-1px}.--vertical .label{display:none}.--content-position-center:after,.--content-position-center:before{content:""}.--content-position-start:before{content:none}.--content-position-start:after{content:""}@media (--rs-viewport-m ){.--vertical-true--m{min-height:100%;width:auto;display:inline-flex;flex-direction:column}.--vertical-true--m:after,.--vertical-true--m:before{height:auto;width:1px}.--vertical-true--m:before{content:""}.--vertical-true--m:after{content:none}.--vertical-true--m.--blank{margin-top:0;margin-inline-start:-1px}.--vertical-true--m .label{display:none}.--vertical-false--m{width:100%;height:auto;display:flex;flex-direction:row}.--vertical-false--m:after,.--vertical-false--m:before{height:1px;width:auto}.--vertical-false--m.--blank{margin-top:-1px;margin-inline-start:0}}@media (--rs-viewport-l ){.--vertical-true--l{min-height:100%;width:auto;display:inline-flex;flex-direction:column}.--vertical-true--l:after,.--vertical-true--l:before{height:auto;width:1px}.--vertical-true--l:before{content:""}.--vertical-true--l:after{content:none}.--vertical-true--l.--blank{margin-top:0;margin-inline-start:-1px}.--vertical-true--l .label{display:none}.--vertical-false--l{width:100%;height:auto;display:flex;flex-direction:row}.--vertical-false--l:after,.--vertical-false--l:before{height:1px;width:auto}.--vertical-false--l.--blank{margin-top:-1px;margin-inline-start:0}}@media (--rs-viewport-xl ){.--vertical-true--xl{min-height:100%;width:auto;display:inline-flex;flex-direction:column}.--vertical-true--xl:after,.--vertical-true--xl:before{height:auto;width:1px}.--vertical-true--xl:before{content:""}.--vertical-true--xl:after{content:none}.--vertical-true--xl.--blank{margin-top:0;margin-inline-start:-1px}.--vertical-true--xl .label{display:none}.--vertical-false--xl{width:100%;height:auto;display:flex;flex-direction:row}.--vertical-false--xl:after,.--vertical-false--xl:before{height:1px;width:auto}.--vertical-false--xl.--blank{margin-top:-1px;margin-inline-start:0}}

package/dist/components/Divider/index.js

@@ -1 +1 @@
-export { default } from "./Divider.js";
+export { default } from "./Divider";

package/dist/components/Divider/tests/Divider.stories.d.ts

@@ -1,7 +1,7 @@
 import { StoryObj } from "@storybook/react-vite";
 declare const _default: {
     title: string;
-    component: import("react").FC<import("./..").DividerProps>;
+    component: import("react").FC<import("../../../components/Divider").DividerProps>;
     parameters: {
         iframe: {
             url: string;

package/dist/components/Divider/tests/Divider.stories.js

@@ -5,8 +5,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.className = exports.label = exports.offset = exports.vertical = exports.color = exports.rendering = void 0;
 const test_1 = require("storybook/test");
-const Divider_1 = __importDefault(require("./.."));
-const View_1 = __importDefault(require("../../View"));
+const Divider_1 = __importDefault(require("../../../components/Divider"));
+const View_1 = __importDefault(require("../../../components/View"));
 const storybook_1 = require("../../../utilities/storybook");
 exports.default = {
     title: "Components/Divider",

package/dist/components/DropdownMenu/DropdownMenu.js

@@ -1,14 +1,14 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
-import { useFlyoutContext } from "../Flyout/index.js";
-import Icon from "../Icon/index.js";
-import MenuItem from "../MenuItem/index.js";
-import Popover from "../Popover/index.js";
-import useHotkeys from "../../hooks/useHotkeys.js";
-import useRTL from "../../hooks/useRTL.js";
-import * as keys from "../../constants/keys.js";
-import IconChevronRight from "../../icons/ChevronRight.js";
+import { useFlyoutContext } from "../../components/Flyout";
+import Icon from "../../components/Icon";
+import MenuItem from "../../components/MenuItem";
+import Popover from "../../components/Popover";
+import useHotkeys from "../../hooks/useHotkeys";
+import useRTL from "../../hooks/useRTL";
+import * as keys from "../../constants/keys";
+import IconChevronRight from "../../icons/ChevronRight";
 import s from "./DropdownMenu.module.css";
 const DropdownMenuSubContext = React.createContext(null);
 const DropdownMenuSubTriggerContext = React.createContext(false);

package/dist/components/DropdownMenu/DropdownMenu.module.css

@@ -1 +1 @@
-.section+.section{border-top:1px solid var(--rs-color-border-neutral-faded);padding-top:var(--rs-unit-x1)}.item,.section+.section{margin-top:var(--rs-unit-x1)}.item:first-child{margin-top:0}[dir=rtl] .arrow{transform:scaleX(-1)}
+.section+.section{padding-top:var(--rs-unit-x1);border-top:1px solid var(--rs-color-border-neutral-faded)}.item,.section+.section{margin-top:var(--rs-unit-x1)}.item:first-child{margin-top:0}[dir=rtl] .arrow{transform:scaleX(-1)}

package/dist/components/DropdownMenu/DropdownMenu.types.d.ts

@@ -1,7 +1,7 @@
 import type React from "react";
-import type { FlyoutContentProps } from "../Flyout";
-import type { MenuItemProps } from "../MenuItem";
-import type { PopoverInstance, PopoverProps } from "../Popover";
+import type { FlyoutContentProps } from "../../components/Flyout";
+import type { MenuItemProps } from "../../components/MenuItem";
+import type { PopoverInstance, PopoverProps } from "../../components/Popover";
 export type Instance = PopoverInstance;
 export type Props = Pick<PopoverProps, "children" | "position" | "fallbackPositions" | "fallbackAdjustLayout" | "fallbackMinHeight" | "triggerType" | "contentGap" | "contentShift" | "contentMaxHeight" | "contentZIndex" | "onOpen" | "onClose" | "onAfterOpen" | "onAfterClose" | "active" | "defaultActive" | "width" | "disableHideAnimation" | "disableCloseOnOutsideClick" | "instanceRef" | "containerRef" | "positionRef" | "originCoordinates" | "elevation" | "initialFocusRef"> & {
     /** Change component trap focus keyboard behavior and shortcuts */

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

@@ -1,4 +1,4 @@
-import Popover from "../Popover";
+import Popover from "../../components/Popover";
 import DropdownMenu, { DropdownMenuContent, DropdownMenuItem, DropdownMenuSection, DropdownMenuSubMenu, DropdownMenuSubTrigger } from "./DropdownMenu";
 declare const DropdownMenuRoot: typeof DropdownMenu & {
     Dismissible: typeof Popover.Dismissible;

package/dist/components/DropdownMenu/index.js

@@ -1,5 +1,5 @@
-import Popover from "../Popover/index.js";
-import DropdownMenu, { DropdownMenuContent, DropdownMenuItem, DropdownMenuSection, DropdownMenuSubMenu, DropdownMenuSubTrigger, } from "./DropdownMenu.js";
+import Popover from "../../components/Popover";
+import DropdownMenu, { DropdownMenuContent, DropdownMenuItem, DropdownMenuSection, DropdownMenuSubMenu, DropdownMenuSubTrigger, } from "./DropdownMenu";
 const DropdownMenuRoot = DropdownMenu;
 DropdownMenuRoot.Dismissible = Popover.Dismissible;
 DropdownMenuRoot.Trigger = Popover.Trigger;

package/dist/components/DropdownMenu/tests/DropdownMenu.stories.d.ts

@@ -2,7 +2,7 @@ import { StoryObj } from "@storybook/react-vite";
 import { fn } from "storybook/test";
 declare const _default: {
     title: string;
-    component: import("react").FC<import("./..").DropdownMenuProps> & {
+    component: import("react").FC<import("../../../components/DropdownMenu").DropdownMenuProps> & {
         Dismissible: import("react").FC<import("../../Dismissible").DismissibleProps>;
         Trigger: import("react").FC<import("../../Flyout").FlyoutTriggerProps>;
         Content: typeof import("../DropdownMenu").DropdownMenuContent;

package/dist/components/DropdownMenu/tests/DropdownMenu.stories.js

@@ -5,11 +5,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.testTheme = exports.testScroll = exports.className = exports.activeFalse = exports.active = exports.defaultActive = exports.submenu = exports.sections = exports.position = void 0;
 const test_1 = require("storybook/test");
-const Button_1 = __importDefault(require("../../Button"));
-const DropdownMenu_1 = __importDefault(require("./.."));
-const Theme_1 = __importDefault(require("../../Theme"));
-const useTheme_1 = require("../../Theme/useTheme");
-const View_1 = __importDefault(require("../../View"));
+const Button_1 = __importDefault(require("../../../components/Button"));
+const DropdownMenu_1 = __importDefault(require("../../../components/DropdownMenu"));
+const Theme_1 = __importDefault(require("../../../components/Theme"));
+const useTheme_1 = require("../../../components/Theme/useTheme");
+const View_1 = __importDefault(require("../../../components/View"));
 const helpers_1 = require("../../../utilities/helpers");
 const storybook_1 = require("../../../utilities/storybook");
 const Checkmark_1 = __importDefault(require("../../../icons/Checkmark"));

package/dist/components/FileUpload/FileUpload.js

@@ -1,9 +1,9 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { classNames } from "@reshaped/utilities";
-import HiddenVisually from "../HiddenVisually/index.js";
-import View from "../View/index.js";
-import useToggle from "../../hooks/useToggle.js";
+import HiddenVisually from "../../components/HiddenVisually";
+import View from "../../components/View";
+import useToggle from "../../hooks/useToggle";
 import s from "./FileUpload.module.css";
 export const FileUploadTrigger = (props) => {
     const { children } = props;

package/dist/components/FileUpload/FileUpload.types.d.ts

@@ -1,6 +1,6 @@
 import type React from "react";
 import type { ClassName } from "@reshaped/utilities";
-import type { ViewProps } from "../View";
+import type { ViewProps } from "../../components/View";
 import type * as G from "../../types/global";
 import type { Attributes } from "../../types/global";
 export type Props = {

package/dist/components/FileUpload/index.js

@@ -1,4 +1,4 @@
-import FileUpload, { FileUploadTrigger } from "./FileUpload.js";
+import FileUpload, { FileUploadTrigger } from "./FileUpload";
 const FileUploadRoot = FileUpload;
 FileUploadRoot.Trigger = FileUploadTrigger;
 export default FileUploadRoot;

package/dist/components/FileUpload/tests/FileUpload.stories.d.ts

@@ -3,7 +3,7 @@ import React from "react";
 import { fn } from "storybook/test";
 declare const _default: {
     title: string;
-    component: React.FC<import("./..").FileUploadProps> & {
+    component: React.FC<import("../../../components/FileUpload").FileUploadProps> & {
         Trigger: typeof import("../FileUpload").FileUploadTrigger;
     };
     parameters: {

package/dist/components/FileUpload/tests/FileUpload.stories.js

@@ -6,12 +6,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.testWithButton = exports.className = exports.disabled = exports.onChange = exports.height = exports.inline = exports.base = void 0;
 const react_1 = __importDefault(require("react"));
 const test_1 = require("storybook/test");
-const Button_1 = __importDefault(require("../../Button"));
-const FileUpload_1 = __importDefault(require("./.."));
-const Icon_1 = __importDefault(require("../../Icon"));
-const Image_1 = __importDefault(require("../../Image"));
-const Link_1 = __importDefault(require("../../Link"));
-const View_1 = __importDefault(require("../../View"));
+const Button_1 = __importDefault(require("../../../components/Button"));
+const FileUpload_1 = __importDefault(require("../../../components/FileUpload"));
+const Icon_1 = __importDefault(require("../../../components/Icon"));
+const Image_1 = __importDefault(require("../../../components/Image"));
+const Link_1 = __importDefault(require("../../../components/Link"));
+const View_1 = __importDefault(require("../../../components/View"));
 const storybook_1 = require("../../../utilities/storybook");
 const Mic_1 = __importDefault(require("../../../icons/Mic"));
 exports.default = {

package/dist/components/Flyout/Flyout.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import FlyoutControlled from "./FlyoutControlled.js";
-import FlyoutUncontrolled from "./FlyoutUncontrolled.js";
+import FlyoutControlled from "./FlyoutControlled";
+import FlyoutUncontrolled from "./FlyoutUncontrolled";
 const Flyout = (props) => {
     const { active } = props;
     if (typeof active === "boolean")

package/dist/components/Flyout/Flyout.module.css

@@ -1 +1 @@
-.positioner{--rs-flyout-max-h:100%;--rs-flyout-max-w:100%;--rs-flyout-z-index:var(--rs-z-index-absolute);--rs-flyout-origin-x:50%;--rs-flyout-origin-y:50%;display:flex;flex-direction:column;isolation:isolate;pointer-events:none;position:absolute;z-index:var(--rs-flyout-z-index)}.positioner.--hover{pointer-events:all}.positioner.--hover-disabled,.positioner.--hover-disabled .content{pointer-events:none}.content{backface-visibility:hidden;display:flex;flex-direction:column;flex-grow:1;height:100%;max-height:var(--rs-flyout-max-h);max-width:var(--rs-flyout-max-w);opacity:0;outline:none;pointer-events:all;transform:scale(.92) translateY(0);transform-origin:var(--rs-flyout-origin-x) var(--rs-flyout-origin-y);transition:1ms var(--rs-easing-accelerate)}[data-rs-keyboard] .content:focus{box-shadow:var(--rs-outline-shadow)}.positioner.--width-trigger .content{transform:scale(1) translateY(var(--rs-unit-x2))}.positioner.--position-top,.positioner.--position-top-end,.positioner.--position-top-start{--rs-flyout-origin-y:100%}.positioner.--position-bottom,.positioner.--position-bottom-end,.positioner.--position-bottom-start{--rs-flyout-origin-y:0%}.positioner.--position-bottom-start,.positioner.--position-top-start{--rs-flyout-origin-x:0%}.positioner.--position-bottom-end,.positioner.--position-start,.positioner.--position-start-bottom,.positioner.--position-start-top,.positioner.--position-top-end{--rs-flyout-origin-x:100%}.positioner.--position-end,.positioner.--position-end-bottom,.positioner.--position-end-top{--rs-flyout-origin-x:0%}.positioner.--position-end-top,.positioner.--position-start-top{--rs-flyout-origin-y:0%}.positioner.--position-end-bottom,.positioner.--position-start-bottom{--rs-flyout-origin-y:100%}.positioner.--visible .content{opacity:1;transform:scale(1) translateY(0)}.positioner.--animated .content{transition-duration:var(--rs-duration-rapid);transition-property:opacity,transform}.positioner.--animated.--visible .content{transition-duration:var(--rs-duration-fast);transition-timing-function:var(--rs-easing-decelerate)}
+.positioner{--rs-flyout-max-h:100%;--rs-flyout-max-w:100%;--rs-flyout-z-index:var(--rs-z-index-absolute);--rs-flyout-origin-x:50%;--rs-flyout-origin-y:50%;position:absolute;isolation:isolate;z-index:var(--rs-flyout-z-index);display:flex;flex-direction:column;pointer-events:none}.positioner.--hover{pointer-events:all}.positioner.--hover-disabled,.positioner.--hover-disabled .content{pointer-events:none}.content{pointer-events:all;opacity:0;transform:scale(.92) translateY(0);transform-origin:var(--rs-flyout-origin-x) var(--rs-flyout-origin-y);outline:none;height:100%;max-width:var(--rs-flyout-max-w);max-height:var(--rs-flyout-max-h);backface-visibility:hidden;flex-grow:1;display:flex;flex-direction:column;transition:1ms var(--rs-easing-accelerate)}[data-rs-keyboard] .content:focus{box-shadow:var(--rs-outline-shadow)}.positioner.--width-trigger .content{transform:scale(1) translateY(var(--rs-unit-x2))}.positioner.--position-top,.positioner.--position-top-end,.positioner.--position-top-start{--rs-flyout-origin-y:100%}.positioner.--position-bottom,.positioner.--position-bottom-end,.positioner.--position-bottom-start{--rs-flyout-origin-y:0%}.positioner.--position-bottom-start,.positioner.--position-top-start{--rs-flyout-origin-x:0%}.positioner.--position-bottom-end,.positioner.--position-start,.positioner.--position-start-bottom,.positioner.--position-start-top,.positioner.--position-top-end{--rs-flyout-origin-x:100%}.positioner.--position-end,.positioner.--position-end-bottom,.positioner.--position-end-top{--rs-flyout-origin-x:0%}.positioner.--position-end-top,.positioner.--position-start-top{--rs-flyout-origin-y:0%}.positioner.--position-end-bottom,.positioner.--position-start-bottom{--rs-flyout-origin-y:100%}.positioner.--visible .content{opacity:1;transform:scale(1) translateY(0)}.positioner.--animated .content{transition-duration:var(--rs-duration-rapid);transition-property:opacity,transform}.positioner.--animated.--visible .content{transition-duration:var(--rs-duration-fast);transition-timing-function:var(--rs-easing-decelerate)}

package/dist/components/Flyout/FlyoutContent.js

@@ -2,11 +2,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import { classNames } from "@reshaped/utilities";
-import Portal from "../_private/Portal/index.js";
-import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect.js";
-import ScrollArea from "../ScrollArea/index.js";
-import { ContentProvider, useFlyoutContext } from "./Flyout.context.js";
-import cooldown from "./utilities/cooldown.js";
+import Portal from "../../components/_private/Portal";
+import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect";
+import ScrollArea from "../ScrollArea";
+import { ContentProvider, useFlyoutContext } from "./Flyout.context";
+import cooldown from "./utilities/cooldown";
 import s from "./Flyout.module.css";
 const FlyoutContent = (props) => {
     const { children, className, attributes, colorMode } = props;

package/dist/components/Flyout/FlyoutControlled.js

@@ -3,19 +3,19 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
 import { TrapFocus } from "@reshaped/utilities";
 import { checkKeyboardMode, } from "@reshaped/utilities/internal";
-import usePrevious from "../../hooks/_internal/usePrevious.js";
-import useElementId from "../../hooks/useElementId.js";
-import useHandlerRef from "../../hooks/useHandlerRef.js";
-import useHotkeys from "../../hooks/useHotkeys.js";
-import useIsDismissible from "../../hooks/useIsDismissible.js";
-import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect.js";
-import useOnClickOutside from "../../hooks/useOnClickOutside.js";
-import { checkTransitions } from "../../utilities/animation.js";
-import * as timeouts from "./Flyout.constants.js";
-import { Provider, useFlyoutContentContext, useFlyoutContext, useFlyoutTriggerContext, } from "./Flyout.context.js";
-import useFlyout from "./useFlyout.js";
-import cooldown from "./utilities/cooldown.js";
-import { createSafeArea } from "./utilities/safeArea.js";
+import usePrevious from "../../hooks/_internal/usePrevious";
+import useElementId from "../../hooks/useElementId";
+import useHandlerRef from "../../hooks/useHandlerRef";
+import useHotkeys from "../../hooks/useHotkeys";
+import useIsDismissible from "../../hooks/useIsDismissible";
+import useIsomorphicLayoutEffect from "../../hooks/useIsomorphicLayoutEffect";
+import useOnClickOutside from "../../hooks/useOnClickOutside";
+import { checkTransitions } from "../../utilities/animation";
+import * as timeouts from "./Flyout.constants";
+import { Provider, useFlyoutContentContext, useFlyoutContext, useFlyoutTriggerContext, } from "./Flyout.context";
+import useFlyout from "./useFlyout";
+import cooldown from "./utilities/cooldown";
+import { createSafeArea } from "./utilities/safeArea";
 const FlyoutControlled = (props) => {
     const { triggerType = "click", groupTimeouts, onOpen, onClose, onAfterOpen, onAfterClose, children, disabled, fallbackAdjustLayout, fallbackMinHeight, trapFocusMode = "dialog", width, disableHideAnimation, disableContentHover, disableCloseOnOutsideClick, autoFocus = true, originCoordinates, contentGap = 2, contentShift, contentMaxHeight, contentMaxWidth, fallbackPositions, contentZIndex, contentClassName, contentAttributes, scrollableClassName, scrollableAttributes, position: passedPosition, active: passedActive, id: passedId, instanceRef, containerRef, initialFocusRef, positionRef, } = props;
     const onOpenRef = useHandlerRef(onOpen);

package/dist/components/Flyout/FlyoutTrigger.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
-import { TriggerProvider, useFlyoutContext } from "./Flyout.context.js";
+import { TriggerProvider, useFlyoutContext } from "./Flyout.context";
 const FlyoutTrigger = (props) => {
     const { children } = props;
     const { id, triggerElRef, triggerType, flyout, handleFocus, handleBlur, handleTriggerMouseEnter, handleMouseLeave, handleTouchStart, handleClick, trapFocusMode, isSubmenu, } = useFlyoutContext();

package/dist/components/Flyout/FlyoutUncontrolled.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from "react";
-import FlyoutControlled from "./FlyoutControlled.js";
+import FlyoutControlled from "./FlyoutControlled";
 const FlyoutUncontrolled = (props) => {
     const { defaultActive, onClose, onOpen } = props;
     const [active, setActive] = React.useState(defaultActive || false);

package/dist/components/Flyout/index.js

@@ -1,8 +1,8 @@
-import Flyout from "./Flyout.js";
-import FlyoutContent from "./FlyoutContent.js";
-import FlyoutTrigger from "./FlyoutTrigger.js";
+import Flyout from "./Flyout";
+import FlyoutContent from "./FlyoutContent";
+import FlyoutTrigger from "./FlyoutTrigger";
 const FlyoutRoot = Flyout;
 FlyoutRoot.Trigger = FlyoutTrigger;
 FlyoutRoot.Content = FlyoutContent;
 export default FlyoutRoot;
-export { useFlyoutContext } from "./Flyout.context.js";
+export { useFlyoutContext } from "./Flyout.context";