react-spring-carousel 3.0.0-beta090.52 → 3.0.0-beta090.53

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (58) hide show
  1. package/.storybook/main.ts +17 -0
  2. package/.storybook/preview.ts +15 -0
  3. package/README.md +50 -0
  4. package/eslint.config.js +28 -0
  5. package/index.html +13 -0
  6. package/lib/events.ts +39 -0
  7. package/lib/index.tsx +980 -0
  8. package/lib/types.ts +44 -0
  9. package/lib/useEventsModule.ts +51 -0
  10. package/lib/utils.ts +42 -0
  11. package/lib/vite-env.d.ts +1 -0
  12. package/package.json +36 -84
  13. package/src/stories/Button.stories.ts +52 -0
  14. package/src/stories/Button.tsx +48 -0
  15. package/src/stories/Configure.mdx +364 -0
  16. package/src/stories/Main.stories.ts +14 -0
  17. package/src/stories/Main.tsx +87 -0
  18. package/src/stories/assets/accessibility.png +0 -0
  19. package/src/stories/assets/accessibility.svg +1 -0
  20. package/src/stories/assets/addon-library.png +0 -0
  21. package/src/stories/assets/assets.png +0 -0
  22. package/src/stories/assets/avif-test-image.avif +0 -0
  23. package/src/stories/assets/context.png +0 -0
  24. package/src/stories/assets/discord.svg +1 -0
  25. package/src/stories/assets/docs.png +0 -0
  26. package/src/stories/assets/figma-plugin.png +0 -0
  27. package/src/stories/assets/github.svg +1 -0
  28. package/src/stories/assets/share.png +0 -0
  29. package/src/stories/assets/styling.png +0 -0
  30. package/src/stories/assets/testing.png +0 -0
  31. package/src/stories/assets/theming.png +0 -0
  32. package/src/stories/assets/tutorials.svg +1 -0
  33. package/src/stories/assets/youtube.svg +1 -0
  34. package/src/stories/button.css +30 -0
  35. package/src/stories/main.css +37 -0
  36. package/src/storybook.global.styles.css +5 -0
  37. package/tsconfig.app.json +24 -0
  38. package/tsconfig.json +7 -0
  39. package/tsconfig.node.json +22 -0
  40. package/vite.config.ts +30 -0
  41. package/dist/index.cjs.js +0 -28
  42. package/dist/index.cjs.js.map +0 -1
  43. package/dist/index.es.js +0 -1728
  44. package/dist/index.es.js.map +0 -1
  45. package/dist/types/index.d.ts +0 -3
  46. package/dist/types/modules/index.d.ts +0 -1
  47. package/dist/types/modules/useEventsModule.d.ts +0 -5
  48. package/dist/types/modules/useFullscreenModule.d.ts +0 -6
  49. package/dist/types/modules/useThumbsModule.d.ts +0 -6
  50. package/dist/types/types/common.d.ts +0 -36
  51. package/dist/types/types/index.d.ts +0 -4
  52. package/dist/types/types/useEventsModule.types.d.ts +0 -46
  53. package/dist/types/types/useFullscreenModule.types.d.ts +0 -6
  54. package/dist/types/types/useSpringCarousel.types.d.ts +0 -130
  55. package/dist/types/types/useThumbsModule.types.d.ts +0 -9
  56. package/dist/types/types/useTransitionCarousel.types.d.ts +0 -37
  57. package/dist/types/useSpringCarousel.d.ts +0 -12
  58. package/dist/types/useTransitionCarousel.d.ts +0 -5
package/.storybook/main.ts ADDED
@@ -0,0 +1,17 @@
1
+ import type { StorybookConfig } from "@storybook/react-vite";
2
+
3
+ const config: StorybookConfig = {
4
+ stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
5
+ addons: [
6
+ "@storybook/addon-onboarding",
7
+ "@storybook/addon-links",
8
+ "@storybook/addon-essentials",
9
+ "@chromatic-com/storybook",
10
+ "@storybook/addon-interactions",
11
+ ],
12
+ framework: {
13
+ name: "@storybook/react-vite",
14
+ options: {},
15
+ },
16
+ };
17
+ export default config;
package/.storybook/preview.ts ADDED
@@ -0,0 +1,15 @@
1
+ import type { Preview } from "@storybook/react";
2
+ import "../src/storybook.global.styles.css";
3
+
4
+ const preview: Preview = {
5
+ parameters: {
6
+ controls: {
7
+ matchers: {
8
+ color: /(background|color)$/i,
9
+ date: /Date$/i,
10
+ },
11
+ },
12
+ },
13
+ };
14
+
15
+ export default preview;
package/README.md ADDED
@@ -0,0 +1,50 @@
1
+ # React + TypeScript + Vite
2
+
3
+ This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
4
+
5
+ Currently, two official plugins are available:
6
+
7
+ - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
8
+ - [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
9
+
10
+ ## Expanding the ESLint configuration
11
+
12
+ If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
13
+
14
+ - Configure the top-level `parserOptions` property like this:
15
+
16
+ ```js
17
+ export default tseslint.config({
18
+ languageOptions: {
19
+ // other options...
20
+ parserOptions: {
21
+ project: ['./tsconfig.node.json', './tsconfig.app.json'],
22
+ tsconfigRootDir: import.meta.dirname,
23
+ },
24
+ },
25
+ })
26
+ ```
27
+
28
+ - Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
29
+ - Optionally add `...tseslint.configs.stylisticTypeChecked`
30
+ - Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
31
+
32
+ ```js
33
+ // eslint.config.js
34
+ import react from 'eslint-plugin-react'
35
+
36
+ export default tseslint.config({
37
+ // Set the react version
38
+ settings: { react: { version: '18.3' } },
39
+ plugins: {
40
+ // Add the react plugin
41
+ react,
42
+ },
43
+ rules: {
44
+ // other rules...
45
+ // Enable its recommended rules
46
+ ...react.configs.recommended.rules,
47
+ ...react.configs['jsx-runtime'].rules,
48
+ },
49
+ })
50
+ ```
package/eslint.config.js ADDED
@@ -0,0 +1,28 @@
1
+ import js from "@eslint/js";
2
+ import globals from "globals";
3
+ import reactHooks from "eslint-plugin-react-hooks";
4
+ import reactRefresh from "eslint-plugin-react-refresh";
5
+ import tseslint from "typescript-eslint";
6
+
7
+ export default tseslint.config(
8
+ { ignores: ["dist"] },
9
+ {
10
+ extends: [js.configs.recommended, ...tseslint.configs.recommended],
11
+ files: ["**/*.{ts,tsx}"],
12
+ languageOptions: {
13
+ ecmaVersion: 2020,
14
+ globals: globals.browser,
15
+ },
16
+ plugins: {
17
+ "react-hooks": reactHooks,
18
+ "react-refresh": reactRefresh,
19
+ },
20
+ rules: {
21
+ ...reactHooks.configs.recommended.rules,
22
+ "react-refresh/only-export-components": [
23
+ "warn",
24
+ { allowConstantExport: true },
25
+ ],
26
+ },
27
+ }
28
+ );
package/index.html ADDED
@@ -0,0 +1,13 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <link rel="icon" type="image/svg+xml" href="/vite.svg" />
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
7
+ <title>Vite + React + TS</title>
8
+ </head>
9
+ <body>
10
+ <div id="root"></div>
11
+ <script type="module" src="/src/main.tsx"></script>
12
+ </body>
13
+ </html>
package/lib/events.ts ADDED
@@ -0,0 +1,39 @@
1
+ import { FullGestureState } from "@use-gesture/react";
2
+
3
+ export type SlideActionType = "drag" | "click";
4
+ export type SlideDirection = "prev" | "next";
5
+
6
+ export type OnDrag = Omit<FullGestureState<"drag">, "event"> & {
7
+ eventName: "onDrag";
8
+ slideActionType: SlideActionType;
9
+ };
10
+ type OnSlideStartChange = {
11
+ eventName: "onSlideStartChange";
12
+ slideDirection: SlideDirection;
13
+ sliceActionType: SlideActionType;
14
+ nextItem: {
15
+ index: number;
16
+ id: string;
17
+ startReached: boolean | undefined;
18
+ endReached: boolean | undefined;
19
+ };
20
+ };
21
+ type OnSlideChangeComplete = {
22
+ eventName: "onSlideChangeComplete";
23
+ slideDirection: SlideDirection;
24
+ sliceActionType: SlideActionType;
25
+ currentItem: {
26
+ index: number;
27
+ id: string;
28
+ startReached: boolean | undefined;
29
+ endReached: boolean | undefined;
30
+ };
31
+ };
32
+
33
+ export type SpringCarouselEvents =
34
+ | OnSlideStartChange
35
+ | OnSlideChangeComplete
36
+ | OnDrag;
37
+ export type SpringCarouselEventsEventHandler = (
38
+ props: SpringCarouselEvents
39
+ ) => void;