New docs: Lit (JavaScript library for web components, 20k stars)
Unified · Split
| @@ -82,6 +82,7 @@ · 81 unmodified lines | |||
| 82 | 'pages/kubernetes', | 82 | 'pages/kubernetes', |
| 83 | 'pages/laravel', | 83 | 'pages/laravel', |
| 84 | 'pages/liquid', | 84 | 'pages/liquid', |
| 85 | 'pages/lit', | ||
| 85 | 'pages/love', | 86 | 'pages/love', |
| 86 | 'pages/lua', | 87 | 'pages/lua', |
| 87 | 'pages/gnu_make', | 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 | ||
