switz / driver Goto Github PK

Would be nice to build a simple website for basic docs, & I can host it.

Something off the shelf works fine.

Very often we have multiple boolean flags to represent a component and a single finite state does not reflect the UI we want to build. How might we design a more flexible driver to handle nested finite states?

const card = driver({
  states: {
    USER: {
      ADMIN: isAdmin,
      MEMBER: isMember,
      LOGGEDOUT: true,
    },
    CARD: {
      IS_DELETED: card.status === 'deleted',
    }
  },
});

Jotting down some notes, need to think more here.

Calling driver.debug({ ... should spit out an array of every possible computed state. This takes every state key and marks it as true once.

so you can basically craft "storybooks"/matrices of every state by doing:

const vals = driver.debug({ ... });

return vals.map((val) => <div key={val.activeState}>
  <h3>{val.activeState}</h3>
  <DownloadButton text={val.text} isDisabled={val.isDisabled} />
</div>);

Would be nice to memoize the library, hopefully with minimal bundle size increase