sjmc11 / tourguide-js

TourGuide is a Javascript library for creating user tours and on-boarding steps for your apps.
https://tourguidejs.com
MIT License
616 stars 31 forks source link

Typescript errors on initial import into Vue3 app #25

Closed mharris-np closed 10 months ago

mharris-np commented 10 months ago

On initial import of lib

import "@sjmc11/tourguidejs/src/scss/tour.scss" // Styles
import {TourGuideClient} from "@sjmc11/tourguidejs/src/Tour"

const tour = new TourGuideClient()
ERROR in node_modules/@sjmc11/tourguidejs/src/core/dialog.ts:242:20

TS18048: 'arrowMiddlewareData' is possibly 'undefined'.
    240 |  */
    241 | function arrowStyles(arrowMiddlewareData: MiddlewareData["arrow"], placement: Placement, dialog: TourGuideClient["dialog"]) : object {
  > 242 |     const arrowX = arrowMiddlewareData.x || 0;
        |                    ^^^^^^^^^^^^^^^^^^^
    243 |     const arrowY = arrowMiddlewareData.y || 0;
    244 |     const arrowSize = 10;
    245 |

ERROR in node_modules/@sjmc11/tourguidejs/src/core/dialog.ts:243:20

TS18048: 'arrowMiddlewareData' is possibly 'undefined'.
    241 | function arrowStyles(arrowMiddlewareData: MiddlewareData["arrow"], placement: Placement, dialog: TourGuideClient["dialog"]) : object {
    242 |     const arrowX = arrowMiddlewareData.x || 0;
  > 243 |     const arrowY = arrowMiddlewareData.y || 0;
        |                    ^^^^^^^^^^^^^^^^^^^
    244 |     const arrowSize = 10;
    245 |
    246 |     const staticSide = {

ERROR in node_modules/@sjmc11/tourguidejs/src/core/dialog.ts:261:24

TS18048: 'arrowMiddlewareData' is possibly 'undefined'.
    259 |     const isAtMinWidth = Math.abs(arrowX) <= arrowSize;
    260 |
  > 261 |     const isInCorner = arrowMiddlewareData.centerOffset !== 0 || (
        |                        ^^^^^^^^^^^^^^^^^^^
    262 |         (isAtMinWidth || isAtMaxWidth) &&
    263 |         (isAtMinHeight || isAtMaxHeight)
    264 |     );

ERROR in node_modules/@sjmc11/tourguidejs/src/handlers/handleVisitStep.ts:99:12

TS2774: This condition will always return true since this function is always defined. Did you mean to call it instead?
     97 |         /** Before callbacks **/
     98 |         // If any callbacks exist, set loading state
  >  99 |         if(tgInstance._globalBeforeChangeCallback && stepIndex !== currentStepIndex || currentStep.beforeLeave || nextStep.beforeEnter){
        |            ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    100 |             tgInstance._promiseWaiting = true
    101 |             tgInstance.dialog.classList.add('tg-dialog-loading')
    102 |         }
danidee10 commented 10 months ago

Also hit the same issue. I opened a PR to address it

sjmc11 commented 10 months ago

Thanks for the contribution, I'll merged your PR @danidee10 & will release a new version on NPM shortly. ✌️