Types

References¶

Visit¶

Re-exports Visit

VisitProps¶

Re-exports VisitProps

Remote¶

Re-exports Remote

RemoteProps¶

Re-exports RemoteProps

BeforeSave¶

Re-exports BeforeSave

Interfaces¶

GraftingSuccessAction¶

Extends¶

Action

Properties¶

Property	Type	Overrides	Defined in
`type`	`string`	`Action.type`	lib/types/actions.ts:12
`payload`	{`pageKey`: `string`;`keyPath`: `string`; }	-	lib/types/actions.ts:13
`payload.pageKey`	`string`	-	lib/types/actions.ts:14
`payload.keyPath`	`string`	-	lib/types/actions.ts:15

GraftingErrorAction¶

Extends¶

Action

Properties¶

Property	Type	Overrides	Defined in
`type`	`string`	`Action.type`	lib/types/actions.ts:20
`payload`	{`pageKey`: `string`;`url`: `string`;`err`: `unknown`;`keyPath`: `string`; }	-	lib/types/actions.ts:21
`payload.pageKey`	`string`	-	lib/types/actions.ts:22
`payload.url`	`string`	-	lib/types/actions.ts:23
`payload.err`	`unknown`	-	lib/types/actions.ts:24
`payload.keyPath`	`string`	-	lib/types/actions.ts:25

ParsedResponse¶

Properties¶

Property	Type	Defined in
`rsp`	`Response`	lib/types/index.ts:102
`json`	`PageResponse`	lib/types/index.ts:103

Defer¶

Defer is a node in the page response thats been intentionally filled with empty or placeholder data for the purposes of fetching it later.

You would typically use it with props_template for parts of a page that you know would be slower to load.

Properties¶

Property	Type	Description	Defined in
`url`	`string`	A url with props_at keypath in the query parameter to indicate how to dig for the data, and where to place the data.	lib/types/index.ts:128
`type`	`"auto"` \| `"manual"`	When set to `auto` Superglue will automatically make the request using the `url`. When set to `manual`, Superglue does nothing, and you would need to manually use `remote` with the `url` to fetch the missing data.	lib/types/index.ts:129
`path`	`string`	A keypath indicates how to dig for the data and where to place the data.	lib/types/index.ts:130
`successAction`	`string`	a user defined action for Superglue to dispatch when auto deferement is successful	lib/types/index.ts:131
`failAction`	`string`	a user defined action for Superglue to dispatch when auto deferement failed	lib/types/index.ts:132

GraftResponse¶

The GraftResponse is a protocol, a shape that is responsible for partial updates using props_template's digging functionality in Superglue. Its meant to be implemented by the server and if you are using superglue_rails, the generators would have generated a props_template layout and view that would shape the graft responses for you.

Properties¶

Property	Type	Description	Defined in
`data`	`JSONMappable`	-	lib/types/index.ts:142
`componentIdentifier`	`string`	-	lib/types/index.ts:143
`assets`	`string`[]	-	lib/types/index.ts:144
`csrfToken?`	`string`	-	lib/types/index.ts:145
`fragments`	`Fragment`[]	-	lib/types/index.ts:146
`defers`	`Defer`[]	-	lib/types/index.ts:147
`slices`	`JSONObject`	-	lib/types/index.ts:148
`renderedAt`	`number`	-	lib/types/index.ts:150
`restoreStrategy`	`RestoreStrategy`	-	lib/types/index.ts:151
`action`	`"graft"`	-	lib/types/index.ts:174
`path`	`string`	Used by superglue to replace the data at that location.	lib/types/index.ts:175

Fragment¶

A Fragment identifies a cross cutting concern, like a shared header or footer.

Properties¶

Property	Type	Description	Defined in
`type`	`string`	A user supplied string identifying a fragment. This is usually created using props_template	lib/types/index.ts:193
`path`	`string`	A Keypath specifying the location of the fragment	lib/types/index.ts:194

SuperglueState¶

A read only state that contains meta information about the current page.

Properties¶

Property	Type	Description	Defined in
`currentPageKey`	`string`	The PageKey of the current page. This can be pass to Remote.	lib/types/index.ts:209
`pathname`	`string`	The pathname of the current url.	lib/types/index.ts:211
`search`	`string`	The query string of the current url.	lib/types/index.ts:213
`hash`	`string`	The hash of the current url.	lib/types/index.ts:215
`csrfToken`	`string`	The Rails csrfToken that you can use for forms.	lib/types/index.ts:217
`assets`	`string`[]	The tracked asset digests.	lib/types/index.ts:219

RootState¶

The root state for a Superglue application. It occupies 2 keys in your app.

Properties¶

Property	Type	Description	Defined in
`superglue`	`SuperglueState`	Caontain readonly metadata about the current page	lib/types/index.ts:228
`pages`	`AllPages`	Every PageResponse that superglue recieves is stored here.	lib/types/index.ts:230

PageOwnProps¶

Helpful props passed to the page component.

Properties¶

Property	Type	Description	Defined in
`pageKey`	`string`	the pagekey of the current page	lib/types/index.ts:238
`navigateTo`	(`path`: `string`, `options`: {`action`: `SuggestedAction`;`ownProps`: `Record`\<`string`, `unknown`>; }) => `boolean`	-	lib/types/index.ts:239
`visit`	`Visit`	-	lib/types/index.ts:240
`remote`	`Remote`	-	lib/types/index.ts:241

Meta¶

Meta is passed to the Promise when visit or remote resolves and contains additional information for navigation.

Properties¶

Property	Type	Description	Defined in
`pageKey`	`string`	The URL of the response converted to a pageKey. Superglue uses this to persist the VisitResponse to store, when that happens.	lib/types/index.ts:265
`page`	`VisitResponse`	The VisitResponse of the page	lib/types/index.ts:267
`redirected`	`boolean`	Indicates if response was redirected	lib/types/index.ts:269
`rsp`	`Response`	The original response object	lib/types/index.ts:271
`fetchArgs`	`FetchArgs`	The original args passed to fetch.	lib/types/index.ts:273
`componentIdentifier`	`string`	The ComponentIdentifier extracted from the response.	lib/types/index.ts:275
`needsRefresh`	`boolean`	`true` when assets locally are detected to be out of date	lib/types/index.ts:277
`suggestedAction?`	`SuggestedAction`	The SuggestedAction. This can be used for navigation.	lib/types/index.ts:279

Handlers¶

Properties¶

Property	Type	Defined in
`onClick`	(`event`: `MouseEvent`) => `void`	lib/types/index.ts:323
`onSubmit`	(`event`: `Event`) => `void`	lib/types/index.ts:324

HistoryState¶

The state that is saved to history.state. Superglue stores information about the current page so that it can restore the page state when navigating back

Properties¶

Property	Type	Description	Defined in
`superglue`	`true`	Is always `true` so superglue can differentiate pages that have superglue enabled or not	lib/types/index.ts:344
`pageKey`	`string`	The page key in SuperglueState to restore from	lib/types/index.ts:346
`posX`	`number`	The scroll position X of the page	lib/types/index.ts:348
`posY`	`number`	The scroll position Y of the page	lib/types/index.ts:350

BasicRequestInit¶

A variation of RequestInit except the headers must be a regular object

Extends¶

RequestInit

Properties¶

Property	Type	Description	Overrides	Defined in
`headers?`	{}	A Headers object, an object literal, or an array of two-item arrays to set request's headers.	`RequestInit.headers`	lib/types/index.ts:371

Type Aliases¶

FetchArgs¶

FetchArgs: [string, BasicRequestInit]

Tuple of Fetch arguments that Superglue passes to Fetch.

Defined in¶

lib/types/actions.ts:7

PageKey¶

PageKey: string

A PageKey is a combination of a parsed URL's pathname + query string. No hash.

*

Example¶

/posts?foobar=123

Defined in¶

lib/types/index.ts:15

RestoreStrategy¶

RestoreStrategy: "fromCacheOnly" | "revisitOnly" | "fromCacheAndRevisitInBackground"

Defines the behavior when navigating to a page that is already stored on the client. For example, when navigating back.

When the page already exists in the store: - fromCacheOnly - Use the cached page that exists on the store, only. - revisitOnly - Ignore the cache and make a request for the latest page. - fromCacheAndRevisitInBackground - Use the cache version of the page so superglue can optimistically navigate to it, then make an additional request for the latest version.

Defined in¶

lib/types/index.ts:28

SuggestedAction¶

SuggestedAction: "push" | "replace" | "none"

A SuggestedAction is used to tell Superglue to history.push, history.replace or do nothing.

Defined in¶

lib/types/index.ts:37

NavigationAction¶

NavigationAction: SuggestedAction

Defined in¶

lib/types/index.ts:38

ComponentIdentifier¶

ComponentIdentifier: string

An identifier that Superglue will uses to determine which page component to render with your page response.

Defined in¶

lib/types/index.ts:44

Keypath¶

Keypath: string

A keypath is a string representing the location of a piece of data. Superglue uses the keypath to dig for or update data.

Examples¶

Object access

data.header.avatar

Array access

data.body.posts.0.title

Array with lookahead

data.body.posts.post_id=foobar.title

Defined in¶

lib/types/index.ts:68

JSONPrimitive¶

JSONPrimitive: string | number | boolean | null | undefined

A JSON Primitive value

Defined in¶

lib/types/index.ts:75

JSONObject¶

JSONObject: {}

A JSON Object

Index Signature¶

[key: string]: JSONValue

Defined in¶

lib/types/index.ts:80

JSONMappable¶

JSONMappable: JSONValue[] | JSONObject

A JSON Object or an array of values

Defined in¶

lib/types/index.ts:87

JSONKeyable¶

JSONKeyable: JSONObject[] | JSONObject

A array of JSON key value objects or a JSON Object

Defined in¶

lib/types/index.ts:92

JSONValue¶

JSONValue: JSONPrimitive | JSONMappable

A primitive or a mappable object

Defined in¶

lib/types/index.ts:97

VisitResponse¶

VisitResponse: {data: JSONMappable;componentIdentifier: ComponentIdentifier;assets: string[];csrfToken: string;fragments: Fragment[];defers: Defer[];slices: JSONObject;renderedAt: number;restoreStrategy: RestoreStrategy; }

The VisitResponse is a protocol, a shape that is responsible for full page visits in Superglue. Its meant to be implemented by the server and if you are using superglue_rails, the generators would have generated a props_template layout and view that would shape the visit responses for you.

Type declaration¶

Name	Type	Defined in
`data`	`JSONMappable`	lib/types/index.ts:142
`componentIdentifier`	`ComponentIdentifier`	lib/types/index.ts:143
`assets`	`string`[]	lib/types/index.ts:144
`csrfToken`?	`string`	lib/types/index.ts:145
`fragments`	`Fragment`[]	lib/types/index.ts:146
`defers`	`Defer`[]	lib/types/index.ts:147
`slices`	`JSONObject`	lib/types/index.ts:148
`renderedAt`	`number`	lib/types/index.ts:150
`restoreStrategy`	`RestoreStrategy`	lib/types/index.ts:151

Defined in¶

lib/types/index.ts:141

Page¶

Page: VisitResponse & {savedAt: number;pageKey: PageKey; }

A Page is a VisitResponse that's been saved to the store

Type declaration¶

Name	Type	Defined in
`savedAt`	`number`	lib/types/index.ts:158
`pageKey`	`PageKey`	lib/types/index.ts:159

Defined in¶

lib/types/index.ts:157

PageResponse¶

PageResponse: GraftResponse | VisitResponse

A PageResponse can be either a GraftResponse or a VisitResponse. Its meant to be implemented by the server and if you are using superglue_rails, the generators will handle both cases.

Defined in¶

lib/types/index.ts:183

AllPages¶

AllPages: Record\<PageKey, Page>

The store where all page responses are stored indexed by PageKey. You are encouraged to mutate the Pages in this store.

Defined in¶

lib/types/index.ts:201

Content¶

Content: PageOwnProps & {[key: string]: unknown; pageKey: PageKey;fragments: Fragment[];csrfToken: string; }

Your Page's content in the data node in VisitResponse merged with additional helpers

Type declaration¶

Name	Type	Defined in
`pageKey`	`PageKey`	lib/types/index.ts:249
`fragments`	`Fragment`[]	lib/types/index.ts:250
`csrfToken`?	`string`	lib/types/index.ts:251

Defined in¶

lib/types/index.ts:248

VisitCreator()¶

VisitCreator: (input: string | PageKey, options: VisitProps) => MetaThunk

VisitCreator is a Redux action creator that returns a thunk. Use this to build the Visit function. Typically its already generated in application_visit.js

Parameters¶

Parameter	Type
`input`	`string` \| `PageKey`
`options`	`VisitProps`

Returns¶

MetaThunk

Defined in¶

lib/types/index.ts:288

RemoteCreator()¶

RemoteCreator: (input: string | PageKey, options: RemoteProps) => MetaThunk

RemoteCreator is a Redux action creator that returns a thunk. Use this to build the Remote function. Typically its already generated in application_visit.js

Parameters¶

Parameter	Type
`input`	`string` \| `PageKey`
`options`	`RemoteProps`

Returns¶

MetaThunk

Defined in¶

lib/types/index.ts:297

Dispatch¶

Dispatch: ThunkDispatch\<RootState, undefined, Action>

Defined in¶

lib/types/index.ts:302

SuperglueStore¶

SuperglueStore: EnhancedStore\<RootState, Action, Tuple\<[StoreEnhancer\<{dispatch: Dispatch; }>, StoreEnhancer]>>

A Store created with Redux Toolkit's configureStore setup with reducers from Superglue. If you are using superglue_rails this would have been generated for you in store.js and setup correctly in application.js

Defined in¶

lib/types/index.ts:309

UJSHandlers()¶

UJSHandlers: ({ ujsAttributePrefix, visit, remote, }: {ujsAttributePrefix: string;visit: Visit;remote: Remote; }) => Handlers

Parameters¶

Parameter	Type
`{ ujsAttributePrefix, visit, remote, }`	`object`
`{ ujsAttributePrefix, visit, remote, }.ujsAttributePrefix`	`string`
`{ ujsAttributePrefix, visit, remote, }.visit`	`Visit`
`{ ujsAttributePrefix, visit, remote, }.remote`	`Remote`