reshaped 3.9.0-canary.3 → 3.9.0-canary.30

package/dist/hooks/_private/useDrag.js

@@ -4,7 +4,6 @@ import * as keys from "../../constants/keys.js";
 import useHandlerRef from "../useHandlerRef.js";
 import useHotkeys from "../useHotkeys.js";
 import useToggle from "../useToggle.js";
-import { disableUserSelect, enableUserSelect } from "../../utilities/dom/index.js";
 import { disableScroll, enableScroll } from "../../utilities/scroll/index.js";
 const useDrag = (cb, options) => {
     const { disabled, containerRef: passedContainerRef, orientation = "all" } = options || {};
@@ -76,7 +75,6 @@ const useDrag = (cb, options) => {
         const handleDragEnd = () => {
             triggerCompensationRef.current = { x: 0, y: 0 };
             toggle.deactivate();
-            enableUserSelect();
             enableScroll();
         };
         document.addEventListener("touchmove", handleDrag, { passive: true });
@@ -103,7 +101,6 @@ const useDrag = (cb, options) => {
                 y: resolvedEvent.clientY - triggerRect.y,
             };
             toggle.activate();
-            disableUserSelect();
             disableScroll();
         };
         triggerEl.addEventListener("touchstart", handleStart, { passive: true });

package/dist/index.d.ts

@@ -110,6 +110,8 @@ export { default as Grid } from "./components/Grid";
 export type { GridProps, GridItemProps } from "./components/Grid";
 export { default as Hidden } from "./components/Hidden";
 export type { HiddenProps } from "./components/Hidden";
+export { default as HiddenInput } from "./components/HiddenInput";
+export type { HiddenInputProps } from "./components/HiddenInput";
 export { default as HiddenVisually } from "./components/HiddenVisually";
 export type { HiddenVisuallyProps } from "./components/HiddenVisually";
 export { default as Icon } from "./components/Icon";

package/dist/index.js

@@ -57,6 +57,7 @@ export { default as Flyout } from "./components/Flyout/index.js";
 export { default as FormControl } from "./components/FormControl/index.js";
 export { default as Grid } from "./components/Grid/index.js";
 export { default as Hidden } from "./components/Hidden/index.js";
+export { default as HiddenInput } from "./components/HiddenInput/index.js";
 export { default as HiddenVisually } from "./components/HiddenVisually/index.js";
 export { default as Icon } from "./components/Icon/index.js";
 export { default as Image } from "./components/Image/index.js";

package/dist/types/global.d.ts

@@ -7,7 +7,7 @@ export type ClassName = ClassNameValue | ClassNameValue[] | ClassName[];
 export type CSSVariable = `--${string}`;
 export type StyleAttribute = React.CSSProperties | (React.CSSProperties & Record<CSSVariable, string | number | undefined>);
 type DataAttributes = object | Record<`data-${string}`, string | boolean>;
-export type Attributes<TagName extends keyof React.JSX.IntrinsicElements = "div"> = React.JSX.IntrinsicElements[TagName] & DataAttributes & {
+export type Attributes<TagName extends keyof React.JSX.IntrinsicElements | void = void> = (TagName extends keyof React.JSX.IntrinsicElements ? React.JSX.IntrinsicElements[TagName] : React.HTMLAttributes<HTMLElement>) & DataAttributes & {
     style?: StyleAttribute;
 };
 export type Viewport = "s" | "m" | "l" | "xl";

package/dist/utilities/dom/index.d.ts

@@ -1,5 +1,4 @@
 export { getRectFromCoordinates } from "./flyout";
 export { getShadowRoot } from "./shadowDom";
-export { enableUserSelect, disableUserSelect } from "./userSelect";
 export { findParent, findClosestScrollableContainer, findClosestPositionContainer } from "./find";
 export { triggerChangeEvent } from "./event";

package/dist/utilities/dom/index.js

@@ -1,5 +1,4 @@
 export { getRectFromCoordinates } from "./flyout.js";
 export { getShadowRoot } from "./shadowDom.js";
-export { enableUserSelect, disableUserSelect } from "./userSelect.js";
 export { findParent, findClosestScrollableContainer, findClosestPositionContainer } from "./find.js";
 export { triggerChangeEvent } from "./event.js";

package/dist/utilities/scroll/disable.js

@@ -4,10 +4,12 @@ export const preventDefault = (e) => e.preventDefault();
  * without locking the page with overflow
  */
 export const disableScroll = () => {
-    window.addEventListener("wheel", preventDefault);
-    window.addEventListener("touchmove", preventDefault);
+    window.addEventListener("wheel", preventDefault, { passive: false });
+    window.addEventListener("touchmove", preventDefault, { passive: false });
+    document.body.style.userSelect = "none";
 };
 export const enableScroll = () => {
     window.removeEventListener("wheel", preventDefault);
     window.removeEventListener("touchmove", preventDefault);
+    document.body.style.userSelect = "";
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "reshaped",
   "description": "Professionally crafted design system in React & Figma for building products of any scale and complexity",
-  "version": "3.9.0-canary.3",
+  "version": "3.9.0-canary.30",
   "license": "MIT",
   "email": "hello@reshaped.so",
   "homepage": "https://reshaped.so",
@@ -20,7 +20,8 @@
   ],
   "repository": {
     "type": "git",
-    "url": "https://github.com/reshaped-ui/reshaped.git"
+    "url": "https://github.com/reshaped-ui/reshaped.git",
+    "directory": "packages/reshaped"
   },
   "bugs": {
     "url": "https://github.com/reshaped-ui/reshaped/issues"
@@ -77,69 +78,12 @@
   "browserslist": [
     "defaults and not IE 11"
   ],
-  "devDependencies": {
-    "@changesets/cli": "2.29.7",
-    "@commitlint/cli": "20.1.0",
-    "@commitlint/config-conventional": "20.0.0",
-    "@commitlint/types": "20.0.0",
-    "@eslint/js": "9.38.0",
-    "@size-limit/preset-big-lib": "11.2.0",
-    "@storybook/addon-a11y": "10.0.0",
-    "@storybook/addon-docs": "10.0.0",
-    "@storybook/addon-vitest": "10.0.0",
-    "@storybook/react": "10.0.0",
-    "@storybook/react-vite": "10.0.0",
-    "@testing-library/user-event": "14.6.1",
-    "@types/culori": "4.0.1",
-    "@types/events": "3.0.3",
-    "@types/node": "24.9.2",
-    "@types/react": "19.2.2",
-    "@types/react-dom": "19.2.2",
-    "@vitejs/plugin-react": "5.1.0",
-    "@vitest/browser": "4.0.4",
-    "@vitest/browser-playwright": "4.0.4",
-    "@vitest/coverage-istanbul": "4.0.4",
-    "@vitest/coverage-v8": "4.0.4",
-    "chromatic": "13.3.2",
-    "eslint": "9.38.0",
-    "eslint-config-prettier": "10.1.8",
-    "eslint-import-resolver-typescript": "^4.4.4",
-    "eslint-plugin-import": "2.32.0",
-    "eslint-plugin-jsx-a11y": "6.10.2",
-    "eslint-plugin-prettier": "5.5.4",
-    "eslint-plugin-react": "7.37.5",
-    "eslint-plugin-react-hooks": "7.0.1",
-    "lefthook": "2.0.1",
-    "playwright": "1.56.1",
-    "postcss": "8.5.6",
-    "postcss-cli": "11.0.1",
-    "postcss-each": "1.1.0",
-    "postcss-nested": "7.0.2",
-    "prettier": "3.6.2",
-    "react": "18",
-    "react-dom": "18",
-    "react-shadow": "20.6.0",
-    "resolve-tspaths": "0.8.23",
-    "size-limit": "11.2.0",
-    "storybook": "10.0.0",
-    "stylelint": "16.25.0",
-    "stylelint-config-prettier": "9.0.5",
-    "stylelint-config-standard": "39.0.1",
-    "ts-node": "10.9.2",
-    "typescript": "5.9.3",
-    "typescript-eslint": "8.46.2",
-    "vite": "7.1.12",
-    "vite-tsconfig-paths": "5.1.4",
-    "vitest": "4.0.4",
-    "vitest-browser-react": "2.0.2"
-  },
   "peerDependencies": {
     "postcss": "^8",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19"
   },
   "dependencies": {
-    "@changesets/changelog-github": "0.5.1",
     "@csstools/postcss-global-data": "3.1.0",
     "chalk": "4.1.2",
     "commander": "14.0.2",
@@ -148,36 +92,8 @@
     "culori": "4.0.2",
     "postcss-custom-media": "11.0.6"
   },
-  "size-limit": [
-    {
-      "name": "Library / JS",
-      "path": "dist/bundle.js",
-      "webpack": false
-    },
-    {
-      "name": "Library / CSS",
-      "path": "dist/bundle.css",
-      "webpack": false
-    },
-    {
-      "name": "Theming / JS",
-      "path": "dist/tests/themingWithoutDefinition.js",
-      "webpack": true
-    },
-    {
-      "name": "Theming with a default theme definition / JS",
-      "path": "dist/tests/themingWithDefinition.js",
-      "webpack": true
-    }
-  ],
-  "engines": {
-    "node": ">=22"
-  },
   "scripts": {
-    "dev": "storybook dev -p 3001 --disable-telemetry",
     "clean": "sh ./bin/clean.sh",
-    "commit": "git-cz",
-    "changeset": "changeset",
     "build": "pnpm clean && pnpm build:esm && pnpm build:css && pnpm build:bundle",
     "build:themes": "node bin/cli.js theming --config dist/cli/theming/reshaped.config.js --output src/themes",
     "build:esm": "tsc -p tsconfig.esm.json && resolve-tspaths -p tsconfig.esm.json",
@@ -185,19 +101,9 @@
     "build:stories": "tsc -p tsconfig.stories.json && resolve-tspaths -p tsconfig.stories.json",
     "build:bundle": "vite build && cp dist/index.d.ts dist/bundle.d.ts",
     "build:size": "pnpm clean && pnpm build:esm && pnpm build:bundle",
-    "build:storybook": "storybook build -o dist/app --disable-telemetry",
-    "build:chromatic": "STORYBOOK_ENV=chromatic storybook build",
-    "release": "sh ./bin/release.sh",
-    "release:canary": "sh ./bin/release-canary.sh",
     "release:local": "pnpm build && pnpm pack --out reshaped-local.tgz",
-    "chromatic": "chromatic -b build:chromatic --project-token=$(cat .chromatic)",
-    "test:vrt": "pnpm chromatic",
-    "test:vrt:turbo": "pnpm chromatic --only-changed",
     "test:browser": "vitest run --project=storybook",
     "test:unit": "vitest run --project=unit",
-    "test:size": "size-limit",
-    "lint": "pnpm lint:js && pnpm lint:css",
-    "lint:js": "eslint './src/**/*.{ts,tsx}' --fix",
-    "lint:css": "stylelint 'src/**/*.css'"
+    "test:size": "size-limit"
   }
 }

package/README.md

@@ -1,24 +0,0 @@
-# Reshaped
-
-<img width="2400" height="1260" alt="3 0 (1)" src="https://github.com/user-attachments/assets/ef632fe9-9446-430f-b87d-bebebe6fb595" />
-<br /><br />
-
-Reshaped is a library with professionally crafted React & Figma components for building beautiful products or starting your own design system.
-
-<br />
-
-## Documentation
-
-To get started, check out the [Reshaped documentation](https://reshaped.so/docs/getting-started/overview).
-
-## Contributing
-
-Read our [contribution guide](CONTRIBUTING.md) to learn about our principles, development process and testing.
-
-## Maintainers
-
-- Dmitry Belyaev, [@blvdmitry](https://x.com/blvdmitry)
-
-## License
-
-This project is licensed under the terms of the MIT license.

package/dist/components/_private/HiddenInput/HiddenInput.js

@@ -1,10 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { classNames } from "../../../utilities/props.js";
-import s from "./HiddenInput.module.css";
-const HiddenInput = (props) => {
-    const { name, value, type, onChange, onFocus, onBlur, checked, defaultChecked, disabled, className, attributes, } = props;
-    const rootClassNames = classNames(s.root, className);
-    return (_jsx("input", { ...attributes, className: rootClassNames, type: type, name: name, value: value, checked: checked, defaultChecked: defaultChecked, disabled: disabled, onChange: onChange, onFocus: onFocus || attributes?.onFocus, onBlur: onBlur || attributes?.onBlur }));
-};
-HiddenInput.displayName = "HiddenInput";
-export default HiddenInput;

package/dist/components/_private/HiddenInput/HiddenInput.types.d.ts

@@ -1,15 +0,0 @@
-import React from "react";
-import type * as G from "../../../types/global";
-export type Props = {
-    name?: string;
-    value?: string;
-    checked?: boolean;
-    defaultChecked?: boolean;
-    disabled?: boolean;
-    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    onFocus?: (e: React.FocusEvent) => void;
-    onBlur?: (e: React.FocusEvent) => void;
-    type: "checkbox" | "radio";
-    className?: G.ClassName;
-    attributes?: G.Attributes<"input">;
-};

package/dist/utilities/dom/userSelect.d.ts

@@ -1,2 +0,0 @@
-export declare const disableUserSelect: () => void;
-export declare const enableUserSelect: () => void;

package/dist/utilities/dom/userSelect.js

@@ -1,6 +0,0 @@
-export const disableUserSelect = () => {
-    document.body.style.userSelect = "none";
-};
-export const enableUserSelect = () => {
-    document.body.style.userSelect = "";
-};