Document list and card blocks
v0.0.1
Two live blocks list records: doc-workspace-list lists the documents a site publishes, and doc-section-cards lists the pages filed under one page. Three function components draw their parts: doc-workspace-card, doc-pager and doc-notice. A function component holds no query and reads nothing; it draws what it is handed. This reference lists the attributes, defaults and behavior of all five. The blocks that draw one document are in Blocks that read a document.
doc-workspace-list
Lists the active documents the reader may open, paged, as cards. The cards are in the page's HTML, so a crawler is served them. With live_visit on, a reader who arrives by a live navigation sees skeleton cards first, and the cards stream in behind them. A document locked to permissions the reader does not hold is left out. The block declares no page_source and always reads for itself. Give the block an id. The sample pages show it in use. See Show documents on your site.
| Attribute | Type | Default | What it does |
|---|---|---|---|
heading | string | "Documents" | The words above the list. Empty, none are drawn. |
lang | string | "" | Which edition of each document to list. Empty lists one of each, the edition it was written in. A code such as fa lists that language only. all lists every translation. |
lang_param | any | "lang" | The query key the language travels under. A reader's ?lang= replaces lang, and every link carries the key onward. Leave it empty on a site whose language is a path segment. |
per_page | integer | 6 | How many documents one page holds, from 1 to 100. |
sort | string | "order" | order follows the position an editor gave each document. updated puts the most recently changed first. newest puts the most recently started first. |
featured_only | boolean | false | Lists only the documents flagged Featured. |
split_featured | boolean | false | Draws the documents flagged Featured as cards and every other document as a row under others_heading, the featured ones first. Off, every document is a card. |
others_heading | string | "Handbooks & archives" | The words above the rows of the documents that are not featured, when split_featured is on. Empty, none are drawn. |
show_description | boolean | true | Draws each document's summary under its name. |
show_details | boolean | false | Draws each document's version, its number of pages, the languages it is published in on this site and when it last changed. The languages are plain badges, and only for a document published in two or more of them. This adds one read, for the pages of the whole page of documents. |
show_search | boolean | false | Draws a search box above the list that narrows it to the documents whose name or summary holds what the reader typed. The words travel in the page's own query string under search_param, so a search has an address of its own. |
search_param | any | "q" | The query key the search travels under. Empty, the block reads no search from the address. |
show_pager | boolean | true | Draws the pager when there is more than one page. |
base | any | "" | The path the pager and the search write their links to. Empty, both stay on the server, and the page it is on has no URL of its own. |
params | any | {} | The page's own query string, handed through so links keep every key the page had. |
page_param | any | "page" | The query key the page number is written under. Two lists on one page need two keys. A page past the last one, named in the address, answers the site's 404. |
live_visit | boolean | false | True when the reader reached the page by a live navigation, which is a click on a link of the site or Back and Forward. The cards are then read in the background behind skeleton cards. The page knows it as its live_visit assign, which the plugin MishkaDocument.Plugins.LiveVisit sets, so pass live_visit={assigns[:live_visit] == true}. Left false, the cards are drawn with the page. |
doc_base | any | "/docs" | Where documents with no address of their own live. Write the language into it as :lang on a site whose language is a path segment. A document with an address is linked there. |
card | string | "" | The name of a component that draws each document in place of the built-in card. It is handed doc and href, and details when show_details is on. |
skeleton | string | "" | The name of a component that draws each skeleton card, as card does for each document. It draws a card the size of the one named in card, with its text left out, so nothing moves when the cards arrive. It is handed nothing. Empty, the block draws a skeleton of its own card. |
current_user | any | nil | The signed-in reader, handed down by the page. |
With show_details, the version shown is the one a reader lands on: the one marked latest, else the newest published. The page count is the pages the reader may read there, with groups that have no page of their own left out. The last change is the latest of the document, that version and those pages.
The words of the list are attributes:
| Attribute | Default | Where it appears |
|---|---|---|
read_text | "Read" | The link on each card. |
search_text | "Search documentation…" | What the empty search box says, and its name for a screen reader. |
featured_text | "Featured" | The badge on a featured document. Empty, none is drawn. |
locked_text | "Editors" | The badge on a document that only readers holding a permission may open. Empty, none is drawn. |
unlisted_text | "Unlisted" | The badge on a document that asks search engines to leave it out, with a robots noindex. Empty, none is drawn. |
version_text | "v%{version}" | The version line. %{version} is the version a reader lands on. |
pages_text | "%{count} pages" | The page count. |
one_page_text | "%{count} page" | The page count of a document with one page. |
updated_text | "Updated %{date}" | When the document last changed. %{date} is the date in the page's language. Empty, the date is left out. |
first_text, previous_text, next_text, last_text | "First", "Previous", "Next", "Last" | The pager's four steps. |
empty_text | "Nothing published yet." | When no document matches. |
no_match_text | "Nothing matches “%{query}”." | When a reader's search finds no document. %{query} is what they searched for. |
loading_text | "Loading documents…" | What a screen reader hears while the read runs. |
error_text | "The documents could not be loaded." | When the read fails. |
retry_text | "Try again" | The way out of a failed read. |
doc-section-cards
Draws the pages filed under one page as cards, two a row from the sm breakpoint and one under it. Each card holds the page's title, any badges a plugin puts on it, its summary and a link. The summary is the description the page's own SEO gives it, else the start of its text. The block lists the version's approved pages the reader may read, under the parent the contents draw each one under and in their order. A group with no page of its own gives up its pages in its place.
An author places it in a page's text or in one of its notes, and doc-section fills in placed_in, doc_base, lang_param and version_param for it. A marker written inside a code block is shown as text and not drawn.
| Attribute | Type | Default | What it does |
|---|---|---|---|
heading | string | "" | The words above the cards. Empty, none are drawn. |
parent | string | "" | The page whose pages are listed, in the document of the page the block is drawn in: its address, such as headless/tabs, or its slug, which also names a group with no page of its own. Empty, the page the block is drawn in. |
placed_in | string | "" | The id of the page the block is drawn in. doc-section fills it in. An author leaves it empty. |
doc_base | any | "/docs" | Where documents with no address of their own live. doc-section hands it the one it links with. |
lang_param | any | "lang" | The query key the language travels under, written onto every link. |
version_param | any | "v" | The URL key a version number travels under, written onto every link while the version read is not the latest. |
show_description | boolean | true | Draws each page's summary. |
show_badges | boolean | true | Draws the badges a plugin puts on each page, asked on document:page:extras with card: true. Off, the event is not asked. |
empty_text | string | "No pages are filed under this one yet." | When no page under it is readable. |
loading_text | string | "Loading the pages…" | What a screen reader hears while the read runs. |
error_text | string | "The pages could not be loaded." | When the read fails. |
retry_text | string | "Try again" | The way out of a failed read. |
current_user | any | nil | The signed-in reader, handed down by the page. |
The Mishka Chelekom documentation uses it on the pages of its groups, such as Navigations, to list the components under each.
doc-workspace-card
Draws one document as a card: its tile, its name, its summary, the version, pages and last change when handed them, the languages it is published in, and the way into it. The languages are plain badges, drawn only when the document is published in two or more of them on this site. A badge is not a link, because the site's header is where a reader changes language. doc-workspace-list draws each document with the card unless card names another component.
| Attribute | Type | Default | What it does |
|---|---|---|---|
doc | any | nil | The document to draw, as the list read it. Nothing is drawn without one. |
href | any | nil | Where the name and the read link lead. |
details | any | nil | A map with version, pages, languages and updated_at. Nothing of it is drawn without one. languages is a list of language codes, drawn as plain badges only when it holds two or more. |
show_description | boolean | true | Draws the summary under the name. |
variant | string | "card" | card or row. row draws the document as one line of a list: its tile, its name and badges, its summary and, when it is handed details, its number of pages. |
The card also takes read_text, featured_text, locked_text, unlisted_text, version_text, pages_text, one_page_text and updated_text, with the same defaults as in doc-workspace-list.
doc-pager
Draws the pager under a list: first, previous, where the reader is, next and last. With a base it writes links. Without one it writes buttons aimed at the block above it.
| Attribute | Type | Default | What it does |
|---|---|---|---|
page | integer | 1 | The page being read. |
pages | integer | 1 | How many pages there are. Under two, nothing is drawn. |
base | any | "" | The path the links are written to. Empty draws buttons and sends the click to the block above. |
params | any | {} | The page's own query string, kept on every link. |
page_param | any | "page" | The query key the page number is written under. |
role | string | "" | The data-role the pager carries, so the block around it can name its own. |
target | any | nil | Who a button sends its click to. |
The four steps are first_text, previous_text, next_text and last_text, which default to "First", "Previous", "Next" and "Last".
doc-notice
Draws the box a block shows in place of its rows: a pulsing skeleton while it loads, a dashed box when there is nothing, and a red box with a way to ask again when a read failed. Five of the six live blocks draw their states with it. doc-switcher draws a small skeleton and error of its own, to fit the bar it sits in.
| Attribute | Type | Default | What it does |
|---|---|---|---|
tone | string | "empty" | loading, empty or error. |
text | string | "" | What the box says. On a skeleton it is read out to a screen reader and drawn to nobody else. |
role | string | "" | The data-role the box carries. |
quiet | boolean | false | Draws the empty line as plain words rather than a box. |
target | any | nil | Who the Try again button sends its click to. Empty, no button is drawn. |
retry_text | string | "Try again" | What the way out of an error says. |