Skip to content
Permalink

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: EitanElbaz/ReactGrandTour
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: 0.10.0
Choose a base ref
...
head repository: EitanElbaz/ReactGrandTour
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: main
Choose a head ref
2 contributors

Commits on Oct 14, 2022

  1. Merge tag '0.10.0' into develop 

    no message
    Eitan Elbaz committed Oct 14, 2022
    Copy the full SHA
    5aaf4e8 View commit details

Commits on Jun 27, 2023

  1. component visibility logic

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    7c7ff77 View commit details

  2. reordered step component props

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    0a251ee View commit details

  3. updated tsconfig typings

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    0f94b91 View commit details

  4. start on new playground page

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    386b031 View commit details

  5. updated component visibility prop nesting on main RGT component

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    6360d09 View commit details

  6. examples for hiding components

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    1addd91 View commit details

  7. updated readme

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    c767cb1 View commit details

  8. can hide the element highlight on a step

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    1816915 View commit details

  9. readme + examples

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    f5a41f7 View commit details

  10. added dot hover border + changed dot border colour to dot border

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    62b1d66 View commit details

  11. added close functions to next/prev component props

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    90657ff View commit details

  12. Merge branch 'feature/show_hide_components' into develop

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    e053031 View commit details

  13. bump version

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    0241be3 View commit details

  14. Merge tag '0.11.0' into develop 

    no message
    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    e2317b5 View commit details

  15. Merge branch 'release/0.11.0'

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    8ba575b View commit details

  16. remove console log

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    9b46376 View commit details

  17. conditionally call scroll into view

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    2eab05a View commit details

  18. version

    Eitan Elbaz committed Jun 27, 2023
    Copy the full SHA
    d60a67c View commit details

Commits on Jun 28, 2023

  1. Merge tag '0.11.1' into develop 

    no message
    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    cd9ebc1 View commit details

  2. Merge branch 'release/0.11.1'

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    ae93a15 View commit details

  3. react grand tour component props now include the component overrides

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    93ce52f View commit details

  4. defaulting open to false and letting the effect set the default openi… 

    …ng state
    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    ced6144 View commit details

  5. Merge branch 'feature/auto_open_position' into develop

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    49a876d View commit details

  6. bump versin

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    e90ebd3 View commit details

  7. Merge tag '0.11.2' into develop 

    no message
    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    d9e798f View commit details

  8. Merge branch 'release/0.11.2'

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    af6049e View commit details

  9. no longer forcibly warpping an overriden close button with a button

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    346662f View commit details

  10. rearchitected the close button so it can be fully overriden. Now prov… 

    …ide a positional wrapper you have to use if you want to position your own close button in the same place
    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    fbe76e0 View commit details

  11. updated example

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    a9a51c9 View commit details

  12. Merge branch 'feature/fix_close_button_override' into develop

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    0cf9246 View commit details

  13. bump version

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    0360a92 View commit details

  14. Merge tag '0.12.0' into develop 

    no message
    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    ba41936 View commit details

  15. Merge branch 'release/0.12.0'

    Eitan Elbaz committed Jun 28, 2023
    Copy the full SHA
    2da6486 View commit details

Commits on Jun 29, 2023

  1. clearing track interval correctly

    Eitan Elbaz committed Jun 29, 2023
    Copy the full SHA
    da06487 View commit details

  2. version bump

    Eitan Elbaz committed Jun 29, 2023
    Copy the full SHA
    2b68b82 View commit details

  3. Merge tag '0.13.0' into develop 

    no message
    Eitan Elbaz committed Jun 29, 2023
    Copy the full SHA
    729a53a View commit details

  4. Merge branch 'release/0.13.0'

    Eitan Elbaz committed Jun 29, 2023
    Copy the full SHA
    bb772f1 View commit details

Commits on Jul 6, 2023

  1. fixed the tour now closing when a custom onClose function is provid… 

    …ed. `onClose` now allows you to return a boolean to prevent the tour from closing if you wish.
    Eitan Elbaz committed Jul 6, 2023
    Copy the full SHA
    ad9c125 View commit details

  2. version bump

    Eitan Elbaz committed Jul 6, 2023
    Copy the full SHA
    0f689c1 View commit details

  3. Merge tag '0.14.0' into develop 

    no message
    Eitan Elbaz committed Jul 6, 2023
    Copy the full SHA
    b191e50 View commit details

  4. Merge branch 'release/0.14.0'

    Eitan Elbaz committed Jul 6, 2023
    Copy the full SHA
    6e03499 View commit details

Commits on Nov 21, 2023

  1. pulled lint settings into own file

    Eitan Elbaz authored and Eitan Elbaz committed Nov 21, 2023
    Copy the full SHA
    8f0fac4 View commit details

  2. lint fixes

    Eitan Elbaz authored and Eitan Elbaz committed Nov 21, 2023
    Copy the full SHA
    8fd4926 View commit details

  3. using react 18 & updated vite config

    Eitan Elbaz authored and Eitan Elbaz committed Nov 21, 2023
    Copy the full SHA
    36c31ce View commit details

  4. demo broken, but sort of running

    Eitan Elbaz authored and Eitan Elbaz committed Nov 21, 2023
    Copy the full SHA
    241d9a5 View commit details

  5. removed deps

    Eitan Elbaz authored and Eitan Elbaz committed Nov 21, 2023
    Copy the full SHA
    40e9900 View commit details

  6. Merge branch 'feature/version_upgrades' into develop

    Eitan Elbaz authored and Eitan Elbaz committed Nov 21, 2023
    Copy the full SHA
    68c202e View commit details

  7. bump version

    Eitan Elbaz authored and Eitan Elbaz committed Nov 21, 2023
    Copy the full SHA
    591c2fa View commit details

  8. fix build

    Eitan Elbaz authored and Eitan Elbaz committed Nov 21, 2023
    Copy the full SHA
    d094da8 View commit details
92 changes: 92 additions & 0 deletions .eslintrc.json
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
{
"ignorePatterns": [
"**/*.d.ts"
],
"globals": {
"JSX": true
},
"extends": [
"eslint:recommended",
"airbnb-typescript",
"airbnb/hooks",
"plugin:@typescript-eslint/recommended",
"plugin:promise/recommended",
"prettier"
],
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaVersion": 7,
"project": "./tsconfig.json",
"projectFolderIgnoreList": [
"./typings/**/*",
"./src/typings/**/*",
"**/typings/**"
]
},
"plugins": [
"@typescript-eslint",
"import",
"unused-imports",
"prettier",
"promise"
],
"rules": {
"prettier/prettier": [
"error",
{
"endOfLine": "auto"
}
],
"react/jsx-props-no-spreading": 0,
"react/prop-types": 0,
"react/require-default-props": 0,
"import/no-duplicates": 0,
"import/prefer-default-export": 0,
"prefer-destructuring": 0,
"react/destructuring-assignment": 0,
"@typescript-eslint/no-explicit-any": 0,
"@typescript-eslint/no-use-before-define": 0,
"eqeqeq": 0,
"import/no-extraneous-dependencies": [
"error",
{
"devDependencies": true
}
],
"@typescript-eslint/explicit-function-return-type": 0,
"@typescript-eslint/explicit-module-boundary-types": 0,
"no-unused-vars": "off",
"@typescript-eslint/no-unused-vars": 0,
"unused-imports/no-unused-imports": 2,
"no-nested-ternary": 0,
"@typescript-eslint/no-shadow": 0,
"@typescript-eslint/no-redeclare": 0,
"@typescript-eslint/no-loop-func": 0,
"jsx-a11y/click-events-have-key-events": 0,
"jsx-a11y/no-static-element-interactions": 0,
"react/jsx-filename-extension": 0,
"arrow-parens": [
"error",
"as-needed",
{
"requireForBlockBody": false
}
],
"import/extensions": [
"error",
"ignorePackages",
{
"js": "never",
"jsx": "never",
"ts": "never",
"tsx": "never"
}
]
},
"settings": {
"import/resolver": {
"typescript": {},
"node": {}
}
}
}
38 changes: 38 additions & 0 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -14,6 +14,7 @@
- [Advanced Usage](#advanced-usage)
- [Fast Moving Objects](#fast-moving-objects)
- [Modal Anchoring](#modal-anchoring)
- [Component Visibility](#component-visibility)
- [Style Overrides](#style-overrides)
- [Overriding With Custom Components](#overriding-with-custom-components)

@@ -151,6 +152,43 @@ Want to highlight an element while anchoring the modal to its parent? No problem
</ReactGrandTour>
```

### Component Visibility

You can force components to be hidden on a per step or per tour basis.

The visibility prop on a step takes precedence over the hidden prop on the `ReactGrandTour` component.

```jsx
export type ComponentVisibility = {
hideCloseButton?: boolean;
hideCurrentStepLabel?: boolean;
hideNextStepButton?: boolean;
hidePreviousStepButton?: boolean;
hideStepButtons?: boolean;
}

<ReactGrandTour
// hides the close button for every step on the tour
hideCloseButton
steps={[
{
// hide the current step label for this particular step
hideCurrentStepLabel: true,
selector: '#my-step-id',
anchorSelector: '#my-step-id-parent',
content: 'Some Content',

// this can only be set on a step
// hide the see through window which wraps around your step's focused html element
// setting this to true will display a backdrop covering your entire screen
hideStepElementHighlight: false,
},
]}
>
<App />
</ReactGrandTour>
```

### Style Overrides

To achieve the look you desire you don't have to override the CSS classes or provide custom components. You can also override a lot of colors using the `stylingOverrides` prop.
175 changes: 40 additions & 135 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,23 +1,29 @@
{
"name": "react-grand-tour",
"version": "0.10.0",
"version": "0.16.0",
"type": "module",
"description": "",
"main": "./dist/main.cjs.js",
"module": "./dist/main.es.js",
"typings": "./dist/index.d.ts",
"main": "./dist/react-grand-tour.umd.cjs",
"module": "./dist/react-grand-tour.js",
"types": "./dist/index.d.ts",
"exports": {
".": {
"import": "./dist/main.es.js",
"require": "./dist/main.cjs.js"
"main": "./dist/react-grand-tour.umd.cjs",
"module": "./dist/react-grand-tour.js",
"types": "./dist/index.d.ts"
}
},
"files": [
"dist"
"dist/**/*.js",
"dist/**/*.d.ts",
"dist/**/*.ts.map",
"dist/**/*.cjs"
],
"scripts": {
"prebuild": "rm -rf dist",
"build": "tsc && vite build",
"doctoc": "doctoc README.md"
"doctoc": "doctoc README.md",
"lint": "eslint src/ --ext ts,tsx"
},
"repository": {
"type": "git",
@@ -30,144 +36,43 @@
},
"homepage": "https://github.com/EitanElbaz/ReactGrandTour",
"dependencies": {
"react-use": "^17.3.1"
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-use": "^17.4.0"
},
"peerDependencies": {
"react": "^17.0.2",
"react-dom": "^17.0.2"
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"@rollup/plugin-typescript": "^8.2.1",
"@types/react": "^17.0.0",
"@types/react-dom": "^17.0.0",
"@types/node": "^18.8.5",
"eslint-config-airbnb": "^18.0.1",
"eslint-config-airbnb-typescript": "^10.0.0",
"eslint-config-prettier": "^6.10.0",
"eslint-config-react-app": "^6.0.0",
"eslint-import-resolver-typescript": "^2.3.0",
"eslint-import-resolver-webpack": "^0.12.1",
"eslint-plugin-flowtype": "^5.2.0",
"eslint-plugin-import": "^2.20.1",
"eslint-plugin-jest": "^24.4.2",
"eslint-plugin-json": "^2.1.0",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.2",
"eslint-plugin-promise": "^4.2.1",
"eslint-plugin-react": "^7.18.3",
"eslint-plugin-react-hooks": "^4.1.2",
"eslint-plugin-testing-library": "^3.9.1",
"eslint-plugin-unused-imports": "^1.1.5",
"prettier": "^2.0.4",
"@types/react": "^17.0.0",
"@types/react-dom": "^18.2.16",
"@typescript-eslint/eslint-plugin": "^6.12.0",
"@typescript-eslint/parser": "^6.12.0",
"@vitejs/plugin-react": "^4.2.0",
"eslint": "^8.54.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-config-airbnb-typescript": "^17.1.0",
"eslint-config-prettier": "^9.0.0",
"eslint-import-resolver-typescript": "^3.6.1",
"eslint-plugin-import": "^2.29.0",
"eslint-plugin-jsx-a11y": "^6.8.0",
"eslint-plugin-prettier": "^5.0.1",
"eslint-plugin-promise": "^6.1.1",
"eslint-plugin-react": "^7.33.2",
"eslint-plugin-react-hooks": "^4.6.0",
"eslint-plugin-unused-imports": "^3.0.0",
"prettier": "^3.1.0",
"rollup-plugin-typescript-paths": "^1.3.0",
"tslib": "^2.4.0",
"vite": "^2.9.9",
"typescript": "^4.2.2"
"tslib": "^2.6.2",
"typescript": "^5.3.2",
"vite": "^4.5.0"
},
"lint-staged": {
"src/**/!(*d.){js,jsx,ts,tsx,json,css,scss,md}": [
"prettier --write"
]
},
"eslintConfig": {
"ignorePatterns": [
"**/*.d.ts"
],
"globals": {
"JSX": true
},
"extends": [
"eslint:recommended",
"plugin:jest/recommended",
"react-app",
"react-app/jest",
"airbnb-typescript",
"airbnb/hooks",
"plugin:@typescript-eslint/recommended",
"plugin:promise/recommended",
"prettier",
"prettier/react",
"prettier/@typescript-eslint"
],
"env": {
"jest/globals": true
},
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaVersion": 7,
"project": "./tsconfig.json",
"projectFolderIgnoreList": [
"./typings/**/*",
"./src/typings/**/*",
"**/typings/**"
]
},
"plugins": [
"@typescript-eslint",
"import",
"unused-imports",
"prettier",
"promise",
"testing-library",
"jest-dom"
],
"rules": {
"prettier/prettier": [
"error",
{
"endOfLine": "auto"
}
],
"react/jsx-props-no-spreading": 0,
"react/prop-types": 0,
"react/require-default-props": 0,
"import/no-duplicates": 0,
"import/prefer-default-export": 0,
"prefer-destructuring": 0,
"react/destructuring-assignment": 0,
"@typescript-eslint/no-explicit-any": 0,
"@typescript-eslint/no-use-before-define": 0,
"eqeqeq": 0,
"import/no-extraneous-dependencies": [
"error",
{
"devDependencies": true
}
],
"@typescript-eslint/explicit-function-return-type": 0,
"@typescript-eslint/explicit-module-boundary-types": 0,
"no-unused-vars": "off",
"@typescript-eslint/no-unused-vars": 0,
"unused-imports/no-unused-imports": 2,
"no-nested-ternary": 0,
"@typescript-eslint/no-shadow": 0,
"@typescript-eslint/no-redeclare": 0,
"@typescript-eslint/no-loop-func": 0,
"jsx-a11y/click-events-have-key-events": 0,
"jsx-a11y/no-static-element-interactions": 0,
"arrow-parens": [
"error",
"as-needed",
{
"requireForBlockBody": false
}
],
"import/extensions": [
"error",
"ignorePackages",
{
"js": "never",
"jsx": "never",
"ts": "never",
"tsx": "never"
}
]
},
"settings": {
"import/resolver": {
"typescript": {},
"node": {}
}
}
}
}
17 changes: 0 additions & 17 deletions playground/config-overrides.js
View file

This file was deleted.

19 changes: 19 additions & 0 deletions playground/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1, width=device-width" />
<!-- Fonts to support Material Design -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap"
/>
<title>Playground</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/index.tsx"></script>
</body>
</html>
Loading