chore: release/react 2.7.0 (#3151)

package.json

@@ -72,6 +72,7 @@
     "remark-parse": "^11.0.0",
     "remark-stringify": "^11.0.0",
     "rimraf": "^5.0.0",
+    "rollup-plugin-preserve-directives": "^0.4.0",
     "tailwindcss": "^3.4.3",
     "turbo": "latest",
     "typescript": "^5.4.5",
@@ -81,7 +82,7 @@
   "engines": {
     "npm": ">=8.19.1",
     "yarn": ">=1.22.19",
-    "node": ">=16.0.0 <17.0.0"
+    "node": ">=16.0.0"
   },
   "packageManager": "[email protected]",
   "config": {

packages/sfui/frameworks/react/CHANGELOG.md

@@ -1,5 +1,45 @@
 # @storefront-ui/react
 
+## 2.7.0
+
+### Minor Changes
+
+- [#3148](https://github.com/vuestorefront/storefront-ui/pull/3148) [`34b7107`](https://github.com/vuestorefront/storefront-ui/commit/34b7107053521733301a719822383ea056a96f4c) Thanks [@Razz21](https://github.com/Razz21)! - [CHANGED] Implemented `use client` directive in components:
+  - `SfAccordionItem`
+  - `SfDrawer`
+  - `SfDropdown`
+  - `SfModal`
+  - `SfRatingButton`
+  - `SfScrollable`
+  - `SfSelect`
+  - `SfTextarea`
+  - `SfTooltip`
+
+### Patch Changes
+
+- [#3157](https://github.com/vuestorefront/storefront-ui/pull/3157) [`a9cd099`](https://github.com/vuestorefront/storefront-ui/commit/a9cd09921c29decf8647e486b4ee573cb89d8fe8) Thanks [@Razz21](https://github.com/Razz21)! - [FIXED] Mark SfInput as client component
+
+## 2.7.0-rc.1
+
+### Patch Changes
+
+- [#3157](https://github.com/vuestorefront/storefront-ui/pull/3157) [`a9cd099`](https://github.com/vuestorefront/storefront-ui/commit/a9cd09921c29decf8647e486b4ee573cb89d8fe8) Thanks [@Razz21](https://github.com/Razz21)! - [FIXED] Mark SfInput as client component
+
+## 2.7.0-rc.0
+
+### Minor Changes
+
+- [#3148](https://github.com/vuestorefront/storefront-ui/pull/3148) [`34b7107`](https://github.com/vuestorefront/storefront-ui/commit/34b7107053521733301a719822383ea056a96f4c) Thanks [@Razz21](https://github.com/Razz21)! - [CHANGED] Implemented `use client` directive in components:
+  - `SfAccordionItem`
+  - `SfDrawer`
+  - `SfDropdown`
+  - `SfModal`
+  - `SfRatingButton`
+  - `SfScrollable`
+  - `SfSelect`
+  - `SfTextarea`
+  - `SfTooltip`
+
 ## 2.6.4
 
 ### Patch Changes

packages/sfui/frameworks/react/components/SfAccordionItem/SfAccordionItem.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { forwardRef } from 'react';
 import type { MouseEvent } from 'react';
 import classNames from 'classnames';

packages/sfui/frameworks/react/components/SfDrawer/SfDrawer.tsx

@@ -1,3 +1,4 @@
+'use client';
 import classNames from 'classnames';
 import { useRef } from 'react';
 import { useClickAway } from 'react-use';

packages/sfui/frameworks/react/components/SfDropdown/SfDropdown.tsx

@@ -1,3 +1,4 @@
+'use client';
 import classNames from 'classnames';
 import { useDropdown } from '@storefront-ui/react';
 import type { SfDropdownProps } from '@storefront-ui/react';

packages/sfui/frameworks/react/components/SfInput/SfInput.tsx

@@ -1,3 +1,4 @@
+'use client';
 import classNames from 'classnames';
 import { SfInputSize, useFocusVisible, type SfInputProps, polymorphicForwardRef } from '@storefront-ui/react';
 

packages/sfui/frameworks/react/components/SfModal/SfModal.tsx

@@ -1,3 +1,4 @@
+'use client';
 import classNames from 'classnames';
 import { useRef } from 'react';
 import { useClickAway } from 'react-use';

packages/sfui/frameworks/react/components/SfRatingButton/SfRatingButton.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { useState, type ChangeEvent } from 'react';
 import classnames from 'classnames';
 import {

packages/sfui/frameworks/react/components/SfScrollable/SfScrollable.tsx

@@ -1,3 +1,4 @@
+'use client';
 /* eslint-disable react/require-default-props */
 import { cloneElement, useMemo } from 'react';
 import classNames from 'classnames';

packages/sfui/frameworks/react/components/SfSelect/SfSelect.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { KeyboardEvent, useState } from 'react';
 import classNames from 'classnames';
 import { SfSelectSize, SfIconExpandMore, composeHandlers, useFocusVisible } from '@storefront-ui/react';

packages/sfui/frameworks/react/components/SfTextarea/SfTextarea.tsx

@@ -1,3 +1,4 @@
+'use client';
 import classNames from 'classnames';
 import { SfTextareaSize, useFocusVisible } from '@storefront-ui/react';
 import { forwardRef } from 'react';

packages/sfui/frameworks/react/components/SfTooltip/SfTooltip.tsx

@@ -1,3 +1,4 @@
+'use client';
 import { useTooltip } from '@storefront-ui/react';
 import type { SfTooltipProps } from '@storefront-ui/react';
 

packages/sfui/frameworks/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storefront-ui/react",
-  "version": "2.6.4",
+  "version": "2.7.0",
   "license": "MIT",
   "sideEffects": false,
   "type": "module",

packages/sfui/frameworks/react/vite.config.ts

@@ -3,7 +3,7 @@ import { defineConfig } from 'vite';
 import dts from 'vite-plugin-dts';
 import react from '@vitejs/plugin-react';
 import tsconfigPaths from 'vite-tsconfig-paths';
-
+import preserveDirectives from 'rollup-plugin-preserve-directives';
 import pkg from './package.json';
 
 export default defineConfig({
@@ -36,6 +36,12 @@ export default defineConfig({
         preserveModules: true,
         preserveModulesRoot: './',
       },
+      plugins: [preserveDirectives()],
+      onwarn(warning, warn) {
+        // https://github.com/vitejs/vite-plugin-react/issues/137
+        if (warning.code === 'MODULE_LEVEL_DIRECTIVE') return;
+        warn(warning);
+      },
     },
   },
 });

yarn.lock

@@ -4711,6 +4711,7 @@ __metadata:
     remark-parse: ^11.0.0
     remark-stringify: ^11.0.0
     rimraf: ^5.0.0
+    rollup-plugin-preserve-directives: ^0.4.0
     tailwindcss: ^3.4.3
     turbo: latest
     typescript: ^5.4.5
@@ -20080,6 +20081,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rollup-plugin-preserve-directives@npm:^0.4.0":
+  version: 0.4.0
+  resolution: "rollup-plugin-preserve-directives@npm:0.4.0"
+  dependencies:
+    "@rollup/pluginutils": ^5.1.0
+    magic-string: ^0.30.5
+  peerDependencies:
+    rollup: 2.x || 3.x || 4.x
+  checksum: 457ca1f60d2cdbe5485339dbc4b228bec5684a99b6589c771bc2268ffaeb29dce2d248f83a85da2fbf572a23cc592d7f59e6485369965210df1035f22ce67feb
+  languageName: node
+  linkType: hard
+
 "rollup-plugin-visualizer@npm:^5.12.0":
   version: 5.12.0
   resolution: "rollup-plugin-visualizer@npm:5.12.0"