New docs: Lit (JavaScript library for web components, 20k stars)
Unified · Split
| @@ -82,6 +82,7 @@ · 81 unmodified lines | ||
| 82 | 82 | 'pages/kubernetes', |
| 83 | 83 | 'pages/laravel', |
| 84 | 84 | 'pages/liquid', |
| 85 | + 'pages/lit', | |
| 85 | 86 | 'pages/love', |
| 86 | 87 | 'pages/lua', |
| 87 | 88 | 'pages/gnu_make', |
| @@ -0,0 +1,57 @@ | ||
| 1 | +._lit { | |
| 2 | + @extend %simple; | |
| 3 | + | |
| 4 | + h4 { | |
| 5 | + @extend %block-label, %label-blue; | |
| 6 | + } | |
| 7 | + | |
| 8 | + .view-source { | |
| 9 | + float: right; | |
| 10 | + } | |
| 11 | + .propertyDetails { | |
| 12 | + padding-left: 1.5em; | |
| 13 | + } | |
| 14 | + .heading.property { | |
| 15 | + margin-top: 2em; | |
| 16 | + } | |
| 17 | + .heading.property > h4 { | |
| 18 | + font-weight: 400; | |
| 19 | + } | |
| 20 | + .newKeyword, | |
| 21 | + .readonlyKeyword, | |
| 22 | + .staticKeyword { | |
| 23 | + font-style: italic; | |
| 24 | + } | |
| 25 | + .functionName, | |
| 26 | + .propertyName { | |
| 27 | + font-weight: 700; | |
| 28 | + } | |
| 29 | + aside.litdev-aside { | |
| 30 | + display: flex; | |
| 31 | + border-style: solid; | |
| 32 | + border-width: 1px; | |
| 33 | + padding: 1em 1em 1em 0em; | |
| 34 | + margin: 1em 0; | |
| 35 | + svg { | |
| 36 | + width: 1.5em; | |
| 37 | + margin-inline: 1em; | |
| 38 | + } | |
| 39 | + } | |
| 40 | + litdev-switchable-sample { | |
| 41 | + pre[data-language] { | |
| 42 | + position: relative; | |
| 43 | + } | |
| 44 | + pre[data-language]::before { | |
| 45 | + position: absolute; | |
| 46 | + top: 0; | |
| 47 | + right: 16px; | |
| 48 | + opacity: 0.5; | |
| 49 | + } | |
| 50 | + pre[data-language="js"]::before { | |
| 51 | + content: "JavaScript"; | |
| 52 | + } | |
| 53 | + pre[data-language="ts"]::before { | |
| 54 | + content: "TypeScript"; | |
| 55 | + } | |
| 56 | + } | |
| 57 | +} | |
| @@ -0,0 +1,84 @@ | ||
| 1 | +module Docs | |
| 2 | + class Lit | |
| 3 | + class CleanHtmlFilter < Filter | |
| 4 | + def call | |
| 5 | + | |
| 6 | + css('.offscreen, #inlineToc, a.anchor, [aria-hidden="true"], #prevAndNextLinks').remove | |
| 7 | + | |
| 8 | + css('[tabindex]').remove_attribute('tabindex') | |
| 9 | + | |
| 10 | + # Removing the side navigation. | |
| 11 | + css('#docsNavWrapper, #rhsTocWrapper').remove | |
| 12 | + | |
| 13 | + # Removing this extra div. | |
| 14 | + div = at_css('#articleWrapper') | |
| 15 | + article = div.at_css('article') | |
| 16 | + article.remove_attribute('id') | |
| 17 | + div.replace(article) | |
| 18 | + | |
| 19 | + # Expanding and replacing the <template>, statically. | |
| 20 | + # This code is a hacky incomplete implementation of | |
| 21 | + # https://github.com/lit/lit.dev/blob/main/packages/lit-dev-content/src/components/litdev-aside.ts | |
| 22 | + css('litdev-aside').each do |node| | |
| 23 | + frag = Nokogiri::HTML::DocumentFragment.new(node.document) | |
| 24 | + template = node.at_css('template') | |
| 25 | + aside = template.children.first | |
| 26 | + aside['class'] = 'litdev-aside' | |
| 27 | + frag.add_child(aside) | |
| 28 | + template.remove | |
| 29 | + div = Nokogiri::XML::Node.new('div', @doc) | |
| 30 | + div.add_child(node.children) | |
| 31 | + aside.add_child(div) | |
| 32 | + node.replace(aside) | |
| 33 | + end | |
| 34 | + | |
| 35 | + # Removing the live playground examples. | |
| 36 | + # https://github.com/lit/lit.dev/blob/main/packages/lit-dev-content/src/components/litdev-example.ts | |
| 37 | + # Someday we can try enabling the live examples by adding appropriate code to assets/javascripts/views/pages/. | |
| 38 | + css('litdev-example').each do |node| | |
| 39 | + node.remove | |
| 40 | + end | |
| 41 | + | |
| 42 | + # Cleaning up the preformatted example code. | |
| 43 | + css('pre:has(code[class])').each do |node| | |
| 44 | + lang = node.at_css('code')['class'] | |
| 45 | + lang.sub! /^language-/, '' | |
| 46 | + node.content = node.css('.cm-line').map(&:content).join("\n") | |
| 47 | + node['data-language'] = lang | |
| 48 | + end | |
| 49 | + | |
| 50 | + # Cleaning up example import. | |
| 51 | + css('div.import').each do |node| | |
| 52 | + pre = Nokogiri::XML::Node.new('pre', @doc) | |
| 53 | + pre.content = node.css('.cm-line').map(&:content).join("\n") | |
| 54 | + pre['data-language'] = 'javascript' | |
| 55 | + node.replace(pre) | |
| 56 | + end | |
| 57 | + | |
| 58 | + # Moving the "kind" to inside the header. | |
| 59 | + # Because it looks better this way. | |
| 60 | + css('.kindTag').each do |kindtag| | |
| 61 | + heading = kindtag.parent | |
| 62 | + next unless heading['class'].include? 'heading' | |
| 63 | + h = heading.at_css('h2, h3, h4') | |
| 64 | + h.prepend_child(kindtag) | |
| 65 | + end | |
| 66 | + | |
| 67 | + # View source | |
| 68 | + css('h2 ~ a.viewSourceLink, h3 ~ a.viewSourceLink, h4 ~ a.viewSourceLink').each do |node| | |
| 69 | + node['class'] = 'view-source' | |
| 70 | + node.content = 'Source' | |
| 71 | + node.previous_element << node | |
| 72 | + end | |
| 73 | + | |
| 74 | + css('.mdnIcon').each do |node| | |
| 75 | + parent = node.parent | |
| 76 | + node.remove | |
| 77 | + parent.content = parent.content.strip | |
| 78 | + end | |
| 79 | + | |
| 80 | + doc | |
| 81 | + end | |
| 82 | + end | |
| 83 | + end | |
| 84 | +end | |
| @@ -0,0 +1,72 @@ | ||
| 1 | +module Docs | |
| 2 | + class Lit | |
| 3 | + class EntriesFilter < Docs::EntriesFilter | |
| 4 | + | |
| 5 | + def get_name | |
| 6 | + name = at_css('h1').content.strip | |
| 7 | + end | |
| 8 | + | |
| 9 | + def get_type | |
| 10 | + # The type/category is section name from the sidebar. | |
| 11 | + active = at_css('#docsNav details li.active') | |
| 12 | + return nil unless active | |
| 13 | + summary = active.ancestors('details').first.at_css('summary') | |
| 14 | + return nil unless summary | |
| 15 | + summary.css('[aria-hidden="true"]').remove | |
| 16 | + summary.content.strip | |
| 17 | + end | |
| 18 | + | |
| 19 | + def additional_entries | |
| 20 | + entries = [] | |
| 21 | + | |
| 22 | + # Code for the API reference pages (and other similar pages). | |
| 23 | + scope_name = '' | |
| 24 | + css('.heading > h2[id], .heading > h3[id], .heading > h4[id]').each do |node| | |
| 25 | + name = node.content.strip | |
| 26 | + id = node['id'] | |
| 27 | + # The kindTag has these values: | |
| 28 | + # class, decorator, directive, function, namespace, type, value | |
| 29 | + kind = node.parent.at_css('.kindTag')&.content&.strip | |
| 30 | + | |
| 31 | + if kind | |
| 32 | + # Saving the current "scope", i.e. the current class name. | |
| 33 | + # This is useful to prefix the method/property names, which are defined after this element. | |
| 34 | + scope_name = name | |
| 35 | + name = kind + " " + name | |
| 36 | + else | |
| 37 | + # If this is a method/property, it has a different markup. | |
| 38 | + # Let's extract them and add a prefix for disambiguation. | |
| 39 | + function = node.at_css('.functionName') | |
| 40 | + property = node.at_css('.propertyName') | |
| 41 | + if function | |
| 42 | + # Note how "functions" are actually "methods" of some class. | |
| 43 | + # Bare (top-level) functions are extracted when `.kindTag` is "function". | |
| 44 | + name = scope_name + '.' + function.content.strip | |
| 45 | + kind = 'method' | |
| 46 | + elsif property | |
| 47 | + name = scope_name + '.' + property.content.strip | |
| 48 | + kind = 'property' | |
| 49 | + end | |
| 50 | + end | |
| 51 | + | |
| 52 | + # If we couldn't figure out the kind, this is a header tag that we can ignore. | |
| 53 | + entries << [name, id, kind] if kind | |
| 54 | + end | |
| 55 | + | |
| 56 | + # Code for the Built-in Directives page. | |
| 57 | + # This page has a TOC of the built-in directives, with a clear documentation of each one. | |
| 58 | + # Note that the directives are also indexed in the API reference pages. | |
| 59 | + # Yes, each directive is indexed twice, because each one is documented twice. | |
| 60 | + css('.directory a[href^="#"]').each do |node| | |
| 61 | + name = node.content.strip | |
| 62 | + id = node['href'].sub /^#/, '' | |
| 63 | + # type will be "Built-in directives" | |
| 64 | + type = node.ancestors('article').at_css('h1').content.strip | |
| 65 | + entries << [name, id, type] | |
| 66 | + end | |
| 67 | + | |
| 68 | + entries | |
| 69 | + end | |
| 70 | + end | |
| 71 | + end | |
| 72 | +end | |
| @@ -0,0 +1,55 @@ | ||
| 1 | +module Docs | |
| 2 | + class Lit < UrlScraper | |
| 3 | + self.name = 'Lit' | |
| 4 | + self.slug = 'lit' | |
| 5 | + self.type = 'lit' | |
| 6 | + | |
| 7 | + self.links = { | |
| 8 | + home: 'https://lit.dev/', | |
| 9 | + code: 'https://github.com/lit/lit/' | |
| 10 | + } | |
| 11 | + | |
| 12 | + options[:container] = 'main' | |
| 13 | + | |
| 14 | + options[:max_image_size] = 250_000 | |
| 15 | + | |
| 16 | + # Note: the copyright will change soon due to https://lit.dev/blog/2025-10-14-openjs/ | |
| 17 | + options[:attribution] = <<-HTML | |
| 18 | + © Google LLC<br> | |
| 19 | + Licensed under the Creative Commons Attribution 3.0 Unported License. | |
| 20 | + HTML | |
| 21 | + | |
| 22 | + options[:fix_urls] = ->(url) do | |
| 23 | + # A name without any extension is assumed to be a directory. | |
| 24 | + # example.com/foobar -> example.com/foobar/ | |
| 25 | + url.sub! /(\/[-a-z0-9]+)([#?]|$)/i, '\1/\2' | |
| 26 | + | |
| 27 | + url | |
| 28 | + end | |
| 29 | + | |
| 30 | + # The order of the filters is important. | |
| 31 | + # The entries filter is applied to the raw (mostly) unmodified HTML. | |
| 32 | + # The clean_html filter reformats the HTML to the a more appropriate markup for devdocs. | |
| 33 | + html_filters.push 'lit/entries', 'lit/clean_html' | |
| 34 | + | |
| 35 | + version '3' do | |
| 36 | + self.release = '3.3.1' | |
| 37 | + self.base_url = 'https://lit.dev/docs/' | |
| 38 | + options[:skip_patterns] = [/v\d+\//] | |
| 39 | + end | |
| 40 | + | |
| 41 | + version '2' do | |
| 42 | + self.release = '2.8.0' | |
| 43 | + self.base_url = 'https://lit.dev/docs/v2/' | |
| 44 | + end | |
| 45 | + | |
| 46 | + version '1' do | |
| 47 | + self.release = '1.0.1' | |
| 48 | + self.base_url = 'https://lit.dev/docs/v1/' | |
| 49 | + end | |
| 50 | + | |
| 51 | + def get_latest_version(opts) | |
| 52 | + get_npm_version('lit', opts) | |
| 53 | + end | |
| 54 | + end | |
| 55 | +end | |
Binary file not shown.
Binary file not shown.
| @@ -0,0 +1,3 @@ | ||
| 1 | +https://github.com/lit/lit.dev/blob/main/packages/lit-dev-content/site/images/flame.svg | |
| 2 | +https://github.com/lit/lit.dev/blob/main/packages/lit-dev-content/site/images/icon.svg | |
| 3 | +https://github.com/lit/lit/blob/main/packages/lit/logo.svg | |
