From 4b5afc4a378b35f2ce39c203a711a981a9764f5e Mon Sep 17 00:00:00 2001 From: siddhantCodes Date: Mon, 14 Oct 2024 22:32:27 +0530 Subject: [PATCH] Add `id` and ability to copy link of each section of spec --- .fastn/config.json | 100 +++++++++++++++++++++++++++++++++++++++++- FASTN.ftd | 8 +++- ds.ftd | 15 +++++++ eds.ftd | 106 +++++++++++++++++++++++++++++++++++++++++++++ index.ftd | 5 ++- overview.ftd | 59 +++++++++++-------------- p1.ftd | 26 ++++++----- 7 files changed, 273 insertions(+), 46 deletions(-) create mode 100644 ds.ftd create mode 100644 eds.ftd diff --git a/.fastn/config.json b/.fastn/config.json index a781a6d..02cc411 100644 --- a/.fastn/config.json +++ b/.fastn/config.json @@ -1,5 +1,5 @@ { - "package": "fast-nspec", + "package": "fastn-spec.fifthtry.site", "all_packages": { "app-switcher.fifthtry.site": { "files": { @@ -17282,6 +17282,32 @@ "zip_url": "https://fifthtry.com/ft2/api/site/download?site-slug=inter-typography", "checksum": "61C43A01DEAA5B4540B9B6B843249881BB90D68C8BE5DE085BA1B2756A3D0D5F" }, + "lato-font.fifthtry.site": { + "files": { + "FASTN.ftd": { + "name": "FASTN.ftd", + "checksum": "0AF42D0A57EE4092A39EF1922E78181263FEA6216290E8CE9DE0AAD5748423EC", + "size": 5509 + }, + "README.md": { + "name": "README.md", + "checksum": "BC787B67F90323471FAFC4649BF27BC7A979EC84EF2704CA1F4883EA1EDE8DC5", + "size": 966 + }, + "custom.ftd": { + "name": "custom.ftd", + "checksum": "8161CE3D38D51321845491ECCF1B194A7E318BC1CF4F1BA0111F4D19C23731CA", + "size": 4996 + }, + "index.ftd": { + "name": "index.ftd", + "checksum": "23B8AE5012951E753E941D892B7BB74629310D714BFAED9A41B4F94DFC4C65C3", + "size": 2146 + } + }, + "zip_url": "https://fifthtry.com/ft2/api/site/download?site-slug=lato-font", + "checksum": "0DED0EDF55852E760A2C09E50EBBBE4508915A28E499DB2BA22649E6F4CAD45B" + }, "manrope-font.fifthtry.site": { "files": { "FASTN.ftd": { @@ -17298,6 +17324,52 @@ "zip_url": "https://fifthtry.com/ft2/api/site/download?site-slug=manrope-font", "checksum": "DAB07152B3198E530D4CADDA3DB98DD8CC10A324554EA1344D6BF9FCC2F85A3F" }, + "midnight-storm-typography.fifthtry.site": { + "files": { + "Changelog.md": { + "name": "Changelog.md", + "checksum": "3D8E5A54B51EC6632C7FDE92E3F413EB236290753673E8BF66AA4CD7A3B9A06F", + "size": 336 + }, + "FASTN.ftd": { + "name": "FASTN.ftd", + "checksum": "8402FCF8EFC13B9391729BC44FFA66B7A4E168DAC8A7609D3B8D9239B070BD68", + "size": 389 + }, + "LICENSE.md": { + "name": "LICENSE.md", + "checksum": "A95364C3842F2C439BD629F65E304A2850239B443596467254EE96E71CA213DD", + "size": 1498 + }, + "README.md": { + "name": "README.md", + "checksum": "7A5E46B6892D6A106463F03661BB7B7B64D8D4A5773733732B51ED26A090AF55", + "size": 1405 + }, + "fastn-typography.ftd": { + "name": "fastn-typography.ftd", + "checksum": "90C74114F286E69341572D40347FC483D6B7C4511C6CA41635A9A0D3CC10B72C", + "size": 8922 + }, + "index.ftd": { + "name": "index.ftd", + "checksum": "5EF2FC8842D30B5F911AD536E438E01398886EB3E25AB3550CB93848552B0F35", + "size": 13006 + }, + "static/midnight-strom-typography-dark-example.png": { + "name": "static/midnight-strom-typography-dark-example.png", + "checksum": "7A9C984A6BF29B53CEE2A6D298120CD0001ED789C6964EA2216F55AE75C93213", + "size": 90460 + }, + "static/midnight-strom-typography-example.png": { + "name": "static/midnight-strom-typography-example.png", + "checksum": "39EA8EF3A6125A0BEF45AA0E02E1E7AA58528D077F63AE5F5EEBFDB3BC8511A3", + "size": 88793 + } + }, + "zip_url": "https://fifthtry.com/ft2/api/site/download?site-slug=midnight-storm-typography", + "checksum": "5E96175CCE023A8F37DA15CF99D3CD8F848F0D117E93D5920E69E31A38F4D7C7" + }, "package-doc.fifthtry.site": { "files": { "FASTN.ftd": { @@ -18566,6 +18638,32 @@ "zip_url": "https://fifthtry.com/ft2/api/site/download?site-slug=site-doc", "checksum": "1D9A320B3585C780F8A1EAF4809C280BB8DDAC8CECCB0CC4041E4F15E07352BA" }, + "source-code-pro-font.fifthtry.site": { + "files": { + "FASTN.ftd": { + "name": "FASTN.ftd", + "checksum": "40B10C8BE03DFBFD10C8B84FFF848AB06635E04ADAFE3514B7D2F1CEBC4506CB", + "size": 29014 + }, + "README.md": { + "name": "README.md", + "checksum": "A7B1129859E44C42353835F88C1D828789EBBF91E0438235DA1402B6F858F7D5", + "size": 1045 + }, + "custom.ftd": { + "name": "custom.ftd", + "checksum": "828B9EF8A69F5297697EF3DBD91E04FD31B9D6F016561B9AA7B7820F37F3A5E6", + "size": 6991 + }, + "index.ftd": { + "name": "index.ftd", + "checksum": "3CA5A121F01529A6DCB689128B436ECA75A825832DD4E41A0DD66029793DB16A", + "size": 2483 + } + }, + "zip_url": "https://fifthtry.com/ft2/api/site/download?site-slug=source-code-pro-font", + "checksum": "0B291C3959F3B057B6EEDB6547E4D73034B1E85A47FF52AD3E2AA43FA228F3C4" + }, "svg-icons.fifthtry.site": { "files": { "FASTN.ftd": { diff --git a/FASTN.ftd b/FASTN.ftd index b432959..d52b14d 100644 --- a/FASTN.ftd +++ b/FASTN.ftd @@ -1,9 +1,15 @@ -- import: fastn --- fastn.package: fast-nspec +-- fastn.package: fastn-spec.fifthtry.site -- fastn.dependency: design-system.fifthtry.site +provided-via: fastn-spec.fifthtry.site/ds + +-- fastn.dependency: dark-flame-cs.fifthtry.site +-- fastn.dependency: midnight-storm-typography.fifthtry.site +-- fastn.dependency: svg-icons.fifthtry.site -- fastn.auto-import: design-system.fifthtry.site as ds +-- fastn.auto-import: fastn-spec.fifthtry.site/eds as eds -- fastn.auto-import: fastn/processors as pr diff --git a/ds.ftd b/ds.ftd new file mode 100644 index 0000000..e2764e1 --- /dev/null +++ b/ds.ftd @@ -0,0 +1,15 @@ +-- import: design-system.fifthtry.site +export: borders, button, icon-button, primary-button, toggle-image-link, secondary-button, circle-text-button, phosphor-icon-button, inline-row, footer-link, copyright-text, page-widths, header-link, page, heading-hero, heading-medium, heading-small, heading-tiny, copy-large, copy-regular, copy-small, fine-print, source-code, link, section-row, section-column, column, element-radius, radius, row, flush, gap, hv, spaces, border-data, border-bottom, alert, container, text-input, danger-button, checkbox, link-button, floater, copy-to-clipboard-text, copy-to-clipboard-icon, label-text, package-info, storybook, code, heading-large, +exposing: page-widths + + +-- page-widths widths: +regular.px: 1140 +narrow.px: 800 +wide.px: 1340 + +-- import: dark-flame-cs.fifthtry.site as dark-flame +-- import: midnight-storm-typography.fifthtry.site as typography + +-- ftd.color-scheme colors: $dark-flame.main +-- ftd.type-data types: $typography.types diff --git a/eds.ftd b/eds.ftd new file mode 100644 index 0000000..536c852 --- /dev/null +++ b/eds.ftd @@ -0,0 +1,106 @@ +-- import: svg-icons.fifthtry.site/phosphor + +-- string current-url: +$processor$: pr.current-url + +-- component heading-large-id: +caption text: +string id: +optional ds.gap margin: +ftd.color color: $ds.colors.text-strong +optional string link: +ftd.text-style list style: +optional body content: +private string slug: $url(a = $heading-large-id.id) +private boolean $copied: false + +-- ftd.column: + +-- ftd.row: +id: $heading-large-id.id +align-content: left + +-- phosphor.light: clipboard +size: 32 +if: { !heading-large-id.copied } +$on-click$: $ftd.copy-to-clipboard(a = $heading-large-id.slug) +$on-click$: $ftd.set-bool($a = $heading-large-id.copied, v = true) + +-- phosphor.light: clipboard-text +size: 32 +if: { heading-large-id.copied } +$on-click$: $ftd.copy-to-clipboard(a = $heading-large-id.slug) +$on-click$: $ftd.set-bool($a = $heading-large-id.copied, v = false) + + +-- ds.heading-large: $heading-large-id.text +margin: $heading-large-id.margin +color: $heading-large-id.color +link: $heading-large-id.link +style: $heading-large-id.style + + +-- end: ftd.row + +-- ds.copy-regular: +if: { heading-large-id.content } + +$heading-large-id.content + +-- end: ftd.column + +-- end: heading-large-id + +-- component heading-medium-id: +caption text: +string id: +optional ds.gap margin: +ftd.color color: $ds.colors.text-strong +optional string link: +ftd.text-style list style: +private string slug: $url(a = $heading-medium-id.id) +private boolean $copied: false +optional body content: + +-- ftd.column: + +-- ftd.row: +id: $heading-medium-id.id +align-content: left + +-- phosphor.light: clipboard +size: 32 +if: { !heading-medium-id.copied } +$on-click$: $ftd.copy-to-clipboard(a = $heading-medium-id.slug) +$on-click$: $ftd.set-bool($a = $heading-medium-id.copied, v = true) + +-- phosphor.light: clipboard-text +size: 32 +if: { heading-medium-id.copied } +$on-click$: $ftd.copy-to-clipboard(a = $heading-medium-id.slug) +$on-click$: $ftd.set-bool($a = $heading-medium-id.copied, v = false) + + +-- ds.heading-medium: $heading-medium-id.text +margin: $heading-medium-id.margin +color: $heading-medium-id.color +link: $heading-medium-id.link +style: $heading-medium-id.style + +-- end: ftd.row + +-- ds.copy-regular: +if: { heading-medium-id.content } + +$heading-medium-id.content + +-- end: ftd.column + +-- end: heading-medium-id + + +-- string url(a): +string a: +string current_url: $current-url + +"https://fastn-spec.fifthtry.site" + current_url + "#" + a diff --git a/index.ftd b/index.ftd index 470d878..74409cf 100644 --- a/index.ftd +++ b/index.ftd @@ -25,7 +25,10 @@ Currently there is only [one implementation of implementation can be derived using this spec. --- ds.heading-large: Table of Contents +-- eds.heading-large-id: Table of Contents +id: table-of-contents + +-- ds.copy-regular: - [Overview](/overview/) - [`ftd::p1` grammar](/p1/) diff --git a/overview.ftd b/overview.ftd index f09c24c..a207953 100644 --- a/overview.ftd +++ b/overview.ftd @@ -5,9 +5,8 @@ align-content: left inset: $ds.spaces.inset-wide.large --- ds.heading-large: Purpose Of The Language - --- ds.copy-regular: +-- eds.heading-large-id: Purpose Of The Language +id: purpose `fastn` language is a HTTP / User Interface language. A `fastn` program is a fullstack web application. The HTTP part, and the User Interface, can be implemented in many ways. The @@ -28,9 +27,8 @@ Instead of JSON authors can chose to return YML etc also, further, a UI also has data, so instead of getting the UI, the client can do content negotiation, and request the backing data as JSON or YML etc as well. --- ds.heading-large: Target - --- ds.copy-regular: +-- eds.heading-large-id: Target +id: target `fastn` programs are invoked with a target. The target can be `stdio` for pure text output, `terminal` for ncurses based terminal UI, `web` for Web Browsers, `windows`, `osx`, `linux`, @@ -43,43 +41,38 @@ program can use `target` as a switch to provide different UI for different targe on all supported `fastn` targets. Each target can also specify its own components, and are only available on that target. --- ds.heading-large: Target Specific Libraries - --- ds.copy-regular: +-- eds.heading-large-id: Target Specific Libraries +id: target-specification-libraries Target can also specify libraries that are available only on that target. There is a target native way to define UI components, and library functions, that are available when using that target. fastn ui components can use these target specific components, and fastn user defined functions can call target specific functions. --- ds.heading-large: Target Neutral Vs Target Dependent Code - --- ds.copy-regular: +-- eds.heading-large-id: Target Neutral Vs Target Dependent Code +id: target-neutral-vs-target-dependant-code When writing code, authors can write target neutral code, or target dependent code. Most programs would use target neutral code, and only use target dependent code when absolutely necessary. --- ds.heading-large: Main `fastn` Package - --- ds.copy-regular: +-- eds.heading-large-id: Main `fastn` Package +id: main-fastn-package `fastn` code is organised as packages. There is a main package, which is the entrypoint of the `fastn` program. The main package is the package that is invoked when the `fastn` program is run. --- ds.heading-large: File Path Based Routing - --- ds.copy-regular: +-- eds.heading-large-id: File Path Based Routing +id: file-path-based-routing `fastn` programs take route, and other request input, as parameter. The `route` or `path` is converted to a file path, and the file path is used to find the `fastn` module within the fastn package. --- ds.heading-large: Dynamic Routes - --- ds.copy-regular: +-- eds.heading-large-id: Dynamic Routes +id: dynamic-routes `fastn` package can have dynamic routes. The dynamic routes are specified in `FASTN.ftd` file, and the dynamic routes are used to find the `fastn` module within the package. @@ -88,9 +81,8 @@ The dynamic routes can contain wildcards, and the wildcards are used to extract from the route, and these values are passed to the `fastn` module. --- ds.heading-large: `fastn` Package - --- ds.copy-regular: +-- eds.heading-large-id: `fastn` Package +id: fastn-package `fastn` compiler works at package level. `fastn` files have an extension, `.ftd` and they are organised into `fastn` packages. Each `fastn` package has a mandatory `FASTN.ftd` file at the @@ -107,7 +99,8 @@ lang: ftd \-- import: fastn \-- fastn.package: hello-world --- ds.heading-large: `fastn` modules +-- eds.heading-large-id: `fastn` modules +id: fastn-modules Any ftd file in a fastn package is a "fastn module". A fastn package is composed of zero or more modules, and zero or more static files. @@ -119,25 +112,25 @@ lang: ftd \-- ftd.module foo: ;; --- ds.heading-large: `p-script` +-- eds.heading-large-id: `p-script` +id: p-script The `fastn` files are composed of "sections", described in 02-p1 chapter. Each --- ds.heading-large: Comments - --- ds.heading-large: Line Comments +-- eds.heading-large-id: Comments +id: comments --- ds.copy-regular: +-- eds.heading-large-id: Line Comments +id: line-comments `fastn` uses `;;` as line comment character. Everything from the first ``;;` till the end of line is comment. Comments can be escaped by prefixing a backslash character: `\;;`. Literal backslash can be inserted by putting two backslashes, `\\`. --- ds.heading-large: Structural Comments - --- ds.copy-regular: +-- eds.heading-large-id: Structural Comments +id: structural-comments Entire "section" can be commented out by adding a `/` in the front of the section, e.g., diff --git a/p1.ftd b/p1.ftd index ceebc9d..b731aa2 100644 --- a/p1.ftd +++ b/p1.ftd @@ -8,7 +8,8 @@ inset: $ds.spaces.inset-wide.large `fastn` is based on a low-level grammar called `ftd::p1` grammar. --- ds.heading-large: `section` +-- eds.heading-large-id: `section` +id: section A `ftd::p1` file is composed of "sections". A section looks like this: @@ -24,13 +25,12 @@ the body of the first section \-- something: yo: 42 --- ds.copy-regular: - Each section starts with `-- `. The section has these properties: --- ds.heading-medium: `section kind` +-- eds.heading-medium-id: `section kind` +id: secition-kind The section kind can be define after `-- ` and before the section name. This is optional parameter. @@ -58,7 +58,8 @@ lang: ftd --- ds.heading-medium: `section name` +-- eds.heading-medium-id: `section name` +id: section-name The section name is the only **mandatory parameter** for a section. Name starts after `-- ` or section kind if present, and ends with the first `:`. Trailing @@ -72,7 +73,8 @@ hash(`#`), and hyphens(`-`). Colon terminates the section name. Leading and trailing whitespaces are not considered part of the section name. --- ds.heading-medium: `section caption` +-- eds.heading-medium-id: `section caption` +id: section-caption What comes after `:` in the section line, till the end of the first line is called the `caption` of the section. @@ -84,7 +86,8 @@ the second section does not have a caption. Leading and trailing whitespaces are not considered part of the caption. --- ds.heading-medium: `section headers` +-- eds.heading-medium-id: `section headers` +id: section-headers After the "section line" (the first line that starts with `-- `), zero or more section headers can be passed. Header can be passed in two ways: `inline` and @@ -176,7 +179,8 @@ next-foo-header: 1 In this case the `sidebar` header to `foo` is a block header, and it ends at the `end: sidebar` --- ds.heading-medium: `section body` +-- eds.heading-medium-id: `section body` +id: section-body Like header, body can be passed in two ways: `inline` and `block` The body is optional. @@ -230,7 +234,8 @@ Unlike `header`, `body` doesn't accept list of sections as value. --- ds.heading-large: `sub-section` +-- eds.heading-large-id: `sub-section` +id: sub-section A section can contain zero or more `sub-sections`: @@ -261,7 +266,8 @@ In above example, `some-section` section has two `sub-section`s, with names and the second one has a body, `subsection2 body`. --- ds.heading-large: Programmatic Access +-- eds.heading-large-id: Programmatic Access +id: programmatic-access `ftd::p11` module in `ftd` crate can be used to read `ftd.p1` files. Wrappers of this crate in Python and other programming languages would hopefully come soon.