• Version 0.6.0
  • Published
  • 77.7 kB
  • 2 dependencies
  • MIT license


npm i framework
yarn add framework
pnpm add framework


Framework for TypeScript applications



function contract

contract: <
Properties extends string,
Page extends Record<Properties, unknown>
>(config: {
page: Page;
model: Pick<Page, KeysOfEffectorApi<Page>>;
}) => void;

    function createBrowserApplication

    createBrowserApplication: (config: {
    ready: Event<void>;
    routes: RouteConfig[];
    domain?: Domain;
    }) => {
    navigation: {
    history: history.History<unknown>;
    historyPush: effector.Effect<string, void, Error>;
    historyPushSearch: effector.Effect<string, void, Error>;
    historyReplace: effector.Effect<string, void, Error>;
    historyChanged: Event<HistoryChange>;
    historyEmitCurrent: Event<void>;
    $redirectTo: effector.Store<string>;

      function createHatch

      createHatch: (config_?: Config | Domain) => Hatch;
      • Events here is an input signal, history should call them when route enters, updates, and exits. Stores is derived from this events and holds specific parameters $opened holds current state of page, if user visited page but not left, it is true

      function createPages

      createPages: (routes: RouteConfig[]) => JSX.Element;

        function getHatch

        getHatch: <T extends React.ComponentType<any>>(
        component: T
        ) => Hatch | undefined;

          function lookupHatch

          lookupHatch: <P>(match: MatchedRoute<P>) => Hatch | undefined;

            function withHatch

            withHatch: <C extends React.ComponentType>(hatch: Hatch, component: C) => C;


              interface Hatch

              interface Hatch {}
              • Hatch is like a Gate, but just for models

              property $opened

              $opened: Store<boolean>;

                property $params

                $params: Store<Record<string, string>>;

                  property $props

                  $props: Store<HatchParams>;

                    property $query

                    $query: Store<Record<string, string>>;

                      property enter

                      enter: Event<HatchParams>;

                        property exit

                        exit: Event<void>;

                          property update

                          update: Event<HatchParams>;

                            interface HatchParams

                            interface HatchParams {}

                              property params

                              params: Record<string, string>;

                                property query

                                query: Record<string, string>;

                                  Package Files (1)

                                  Dependencies (2)

                                  Dev Dependencies (60)

                                  Peer Dependencies (5)


                                  To add a badge like this badgeto your package's README, use the codes available below.

                                  You may also use to create a custom badge linking to

                                  • Markdown
                                  • HTML
                                    <a href=""><img src="" alt=""></a>