xstate-wizards/xstate-wizards

Simplifying massive data collection UI flows with state machines and spawned actors.

xstate-wizards's Issues

Ability to get vanilla XState JSON

I have a bit of familiarity with XState, and while coming up to speed on xstate-wizards, I found it helpful to visualize/simulate the resulting XState state machine using stately.ai. Here's the xstate-react demo on stately.ai.

However, to get vanilla XState JSON I could import in stately, I had to hack a log line into packages/spells/src/machines/createSpell.ts (after the state prepper, before the createMachine call).

Can we refactor this (and/or create a utility function) to get the JSON-serializable object back? Would be good to be able to get back the state machine underlying any spell.

editor is required in TSpellInstructions, but missing in exampleScreener.ts

My entire exampleScreener.ts is red (in vanilla VSCode, see screenshot below).

Argument of type '{ key: string; version: string; config: { initial: string; title: string; exitTo: string; sectionsBar: never[]; }; models: { User: { loader: {}; }; }; schema: { type: "object"; properties: { states: { type: "object"; properties: { ...; }; }; }; }; states: { ...; }; }' is not assignable to parameter of type 'TSpellInstructions'.
  Property 'editor' is missing in type '{ key: string; version: string; config: { initial: string; title: string; exitTo: string; sectionsBar: never[]; }; models: { User: { loader: {}; }; }; schema: { type: "object"; properties: { states: { type: "object"; properties: { ...; }; }; }; }; states: { ...; }; }' but required in type 'TSpellInstructions'.ts(2345)
types.d.ts(221, 5): 'editor' is declared here.

I guess I'm wondering, is editor required? Or should it be optional?

License

I noticed that xstate-wizards doesn't have a LICENSE file, yet. I understand in early development it can be hard to choose. Here's a useful resource on the topic (which could probably be written in xstate-wizards, too): https://choosealicense.com/

I've had quite a bit of experience in this space, and would be happy to chat more on your options. I'd love to see a BSD/MIT, or even Apache. And it's always good to remember you can change it later, as your requirements change, too.

Input Phone Number: Need Better UI Feedback & Validation

@jeff-s-zhou gonna start communicating via Github issues now since I'm using this lib still lol

The "required" validation on phone number input doesn't trigger a red highlight like it does on text fields. So it's less clear that there is a validation issue. Also, it seems like validation for phone numbers isn't bubbling up when it fails to the UI. It only bubbles up when its successful. Feel like we've seen this in the past but not sure if we took a swing at it.

Fresh install demo friction (2023-10-24)

Hey again! So, in my spare time I've been coming up to speed on xstate-wizards.

I got the main screener+interview demo running, but I hit a couple speedbumps on the way. I'm just going to list them off for confirmation these aren't intended behavior or issues due to my environment (Ubuntu 22.04, node 16.15, Chromium 118):

1. Several internal packages were out-of-date from one another, resulting in the pages rendering without fully loading styles, and crystal ball wasn't loading at all.
   • Errors of the form: @xstate-wizards/spellbook has a dependency on @xstate-wizards/wizards-of-react@^0.7.2 but the version of @xstate-wizards/wizards-of-react in the repo is 0.8.5 which is not within range of the depended on version, please update the dependency version.
   • Fix was to bump three internal package.json dependency versions to match the other packages' versions, then rebuild and re-yalcpush.
2. I had to yarn add react-player for examples/react-wizards
   • Seems like it should be a transitive dependency from wizards-of-react's ContentNode. I see it referenced a few places, but no idea why it wasn't getting installed. (I had some ENOENT error.)

Happy to put my fixes in a PR, but I figure if you can reproduce, you can probably just commit the fixes.