From db2964c9e659f6c43044cef2d91f6cf45d5062e2 Mon Sep 17 00:00:00 2001 From: Cameron Dutro Date: Tue, 8 Aug 2023 14:21:17 -0700 Subject: [PATCH] Remove legacy docsite (#2193) --- .dockerignore | 1 - .github/dependabot.yml | 14 - .github/release_template.md | 2 +- .github/workflows/docs-production-deploy.yml | 95 - .github/workflows/preview-deploy.yml | 57 - .github/workflows/static-files.yml | 1 - .github/workflows/test.yml | 1 - .gitignore | 9 - .rubocop.yml | 1 - app/components/primer/alpha/action_bar.rb | 7 - app/components/primer/alpha/action_menu.rb | 269 - app/components/primer/alpha/auto_complete.rb | 47 - .../primer/alpha/auto_complete/item.rb | 12 - app/components/primer/alpha/banner.rb | 31 - .../primer/alpha/button_marketing.rb | 12 - app/components/primer/alpha/dialog.rb | 17 - app/components/primer/alpha/dropdown.rb | 105 - app/components/primer/alpha/form_control.rb | 11 - app/components/primer/alpha/hellip_button.rb | 9 - .../primer/alpha/hidden_text_expander.rb | 9 - app/components/primer/alpha/image.rb | 16 - app/components/primer/alpha/image_crop.rb | 11 - app/components/primer/alpha/layout.rb | 118 - app/components/primer/alpha/menu.rb | 19 - app/components/primer/alpha/multi_input.rb | 33 - app/components/primer/alpha/nav_list.rb | 69 - app/components/primer/alpha/navigation/tab.rb | 35 - .../primer/alpha/octicon_symbols.rb | 6 - app/components/primer/alpha/overlay.rb | 14 - .../primer/alpha/segmented_control.rb | 61 - app/components/primer/alpha/tab_container.rb | 18 - app/components/primer/alpha/tab_nav.rb | 63 - app/components/primer/alpha/tab_panels.rb | 16 - app/components/primer/alpha/text_field.rb | 68 - app/components/primer/alpha/toggle_switch.rb | 18 - app/components/primer/alpha/tooltip.rb | 70 +- app/components/primer/alpha/underline_nav.rb | 61 - .../primer/alpha/underline_panels.rb | 19 - app/components/primer/beta/auto_complete.rb | 56 - .../primer/beta/auto_complete/item.rb | 8 - app/components/primer/beta/avatar.rb | 18 - app/components/primer/beta/avatar_stack.rb | 21 - app/components/primer/beta/base_button.rb | 4 - app/components/primer/beta/blankslate.rb | 104 - app/components/primer/beta/border_box.rb | 55 - .../primer/beta/border_box/header.rb | 11 - app/components/primer/beta/breadcrumbs.rb | 7 - app/components/primer/beta/button.rb | 42 - app/components/primer/beta/button_group.rb | 16 - app/components/primer/beta/clipboard_copy.rb | 12 - app/components/primer/beta/close_button.rb | 3 - app/components/primer/beta/counter.rb | 8 - app/components/primer/beta/details.rb | 11 - app/components/primer/beta/flash.rb | 24 +- app/components/primer/beta/heading.rb | 8 - app/components/primer/beta/icon_button.rb | 21 - app/components/primer/beta/label.rb | 20 - app/components/primer/beta/link.rb | 22 - app/components/primer/beta/markdown.rb | 263 +- app/components/primer/beta/octicon.rb | 10 - app/components/primer/beta/popover.rb | 43 - app/components/primer/beta/progress_bar.rb | 23 +- app/components/primer/beta/relative_time.rb | 9 - app/components/primer/beta/spinner.rb | 12 +- app/components/primer/beta/state.rb | 13 - app/components/primer/beta/subhead.rb | 55 - app/components/primer/beta/text.rb | 4 - app/components/primer/beta/timeline_item.rb | 9 - app/components/primer/beta/truncate.rb | 50 - app/components/primer/blankslate_component.rb | 76 - app/components/primer/box.rb | 6 - app/components/primer/button_component.rb | 49 - app/components/primer/conditional_wrapper.rb | 19 +- app/components/primer/icon_button.rb | 30 - app/components/primer/layout_component.rb | 12 - app/components/primer/tooltip.rb | 27 - app/components/primer/truncate.rb | 19 - component_generator.thor | 20 - component_status_migrator.thor | 19 - demo/Gemfile.lock | 3 +- docs/.npmrc | 1 - docs/.prettierrc | 6 - docs/content/adr.md | 3 - docs/content/deprecated.md | 75 - .../accessibility/tooltipped_migration.md | 77 - .../content/guides/primer_button_component.md | 42 - .../content/guides/primer_layout_component.md | 150 - docs/content/guides/primer_local_time.md | 64 - docs/content/guides/primer_time_ago.md | 50 - docs/content/guides/primer_truncate.md | 67 - docs/content/index.md | 54 - docs/content/migration.md | 34 - docs/content/status.md | 33 - docs/content/system-arguments.md | 149 - docs/gatsby-config.js | 18 - docs/package-lock.json | 50383 ---------------- docs/package.json | 24 - docs/postcss.confg.js | 2 - .../components/example.js | 22 - .../gatsby-theme-doctocat/components/head.js | 43 - .../gatsby-theme-doctocat/components/hero.js | 21 - .../components/requires-js-flash.js | 14 - .../components/theme-switcher.js | 54 - .../src/@primer/gatsby-theme-doctocat/nav.yml | 145 - .../primer-components-hero.svg | 1411 - docs/src/component-statuses.js | 103 - lib/primer/accessibility.rb | 2 +- lib/primer/yard.rb | 17 +- lib/primer/yard/legacy_gatsby_backend.rb | 233 - lib/tasks/docs.rake | 207 +- linter_generator.thor | 7 - script/setup | 5 - script/upgrade-primer-css | 4 - templates/component.tt | 4 - templates/linter.tt | 2 +- templates/stable/component.tt | 4 - test/components/preview_test.rb | 2 +- 117 files changed, 23 insertions(+), 56176 deletions(-) delete mode 100644 .github/workflows/docs-production-deploy.yml delete mode 100644 docs/.npmrc delete mode 100644 docs/.prettierrc delete mode 100644 docs/content/adr.md delete mode 100644 docs/content/deprecated.md delete mode 100644 docs/content/guides/accessibility/tooltipped_migration.md delete mode 100644 docs/content/guides/primer_button_component.md delete mode 100644 docs/content/guides/primer_layout_component.md delete mode 100644 docs/content/guides/primer_local_time.md delete mode 100644 docs/content/guides/primer_time_ago.md delete mode 100644 docs/content/guides/primer_truncate.md delete mode 100644 docs/content/index.md delete mode 100644 docs/content/migration.md delete mode 100644 docs/content/status.md delete mode 100644 docs/content/system-arguments.md delete mode 100644 docs/gatsby-config.js delete mode 100644 docs/package-lock.json delete mode 100644 docs/package.json delete mode 100644 docs/postcss.confg.js delete mode 100644 docs/src/@primer/gatsby-theme-doctocat/components/example.js delete mode 100644 docs/src/@primer/gatsby-theme-doctocat/components/head.js delete mode 100644 docs/src/@primer/gatsby-theme-doctocat/components/hero.js delete mode 100644 docs/src/@primer/gatsby-theme-doctocat/components/requires-js-flash.js delete mode 100644 docs/src/@primer/gatsby-theme-doctocat/components/theme-switcher.js delete mode 100644 docs/src/@primer/gatsby-theme-doctocat/nav.yml delete mode 100644 docs/src/@primer/gatsby-theme-doctocat/primer-components-hero.svg delete mode 100644 docs/src/component-statuses.js delete mode 100644 lib/primer/yard/legacy_gatsby_backend.rb diff --git a/.dockerignore b/.dockerignore index a6c785c963..50b114f155 100644 --- a/.dockerignore +++ b/.dockerignore @@ -5,5 +5,4 @@ node_modules/ pkg/ test/ !test/previews/ -docs/ vendor/bundle diff --git a/.github/dependabot.yml b/.github/dependabot.yml index 21ce424501..b68e819dbe 100644 --- a/.github/dependabot.yml +++ b/.github/dependabot.yml @@ -23,20 +23,6 @@ updates: - "npm" allow: - dependency-type: "production" - - package-ecosystem: "npm" - directory: "/docs" - schedule: - interval: "monthly" - labels: - - "dependencies" - - "skip changeset" - - "npm" - allow: - - dependency-type: "production" - ignore: - - dependency-name: "gatsby" - - dependency-name: "react" - - dependency-name: "react-dom" - package-ecosystem: "npm" directory: "/demo" schedule: diff --git a/.github/release_template.md b/.github/release_template.md index 20cb8d05c9..e767c6d0df 100644 --- a/.github/release_template.md +++ b/.github/release_template.md @@ -5,7 +5,7 @@ Please ensure these items are checked before merging. ### 🔎 Smoke test - [ ] All CI checks pass -- [ ] Docs and Lookbook open in a browser +- [ ] Lookbook opens in a browser - [ ] Successful integration test with GitHub.com as a primary consumer of Primer View Components - [ ] Install the npm release candidate in `npm-workspaces/primer/` - [ ] Use `bin/vendor-gem` to update `primer_view_components` gem diff --git a/.github/workflows/docs-production-deploy.yml b/.github/workflows/docs-production-deploy.yml deleted file mode 100644 index 920d86dfb7..0000000000 --- a/.github/workflows/docs-production-deploy.yml +++ /dev/null @@ -1,95 +0,0 @@ -name: Docs Production -on: - workflow_dispatch: - release: - types: [published] - -permissions: - contents: read - pages: write - id-token: write - -jobs: - build: - name: Build - runs-on: ubuntu-latest - steps: - - name: Checkout default branch - uses: actions/checkout@v3 - with: - version: 14 - path: 'primer_view_components' - - name: Checkout primer/design - uses: actions/checkout@v3 - with: - version: 14 - repository: 'primer/design' - path: 'primer_design' - - - name: Setup Ruby - uses: ruby/setup-ruby@v1 - with: - ruby-version: '3.2' - bundler-cache: true - - - name: Set up Node - uses: actions/setup-node@v3 - with: - node-version: 16 - cache: 'npm' - cache-dependency-path: | - primer_view_components/package-lock.json - primer_view_components/docs/package-lock.json - primer_design/package-lock.json - - - uses: actions/cache@v3 - with: - path: | - primer_view_components/node_modules - primer_view_components/docs/node_modules - primer_view_components/vendor/bundle - key: gems-build-pvc-${{ hashFiles('**/Gemfile.lock') }}-${{ hashFiles('**/package-json.lock') }} - - - name: Install Ruby dependencies - working-directory: ./primer_view_components - run: | - bundle config path vendor/bundle - bundle install --jobs 3 --retry 3 - - - name: Install JavaScript dependencies - working-directory: ./primer_view_components - run: npm i && cd docs && npm i - - - name: Generate static files - working-directory: ./primer_view_components - run: bundle exec rake utilities:build docs:build docs:generate_nav_redirects static:dump - env: - PRIMER_DESIGN_REPO_PATH: "${{ github.workspace }}/primer_design" - - - name: Build - working-directory: ./primer_view_components - run: npm run build:docs - - - name: Archive build output - working-directory: ./primer_view_components - run: 'tar --dereference --directory docs/public -cvf artifact.tar .' - - - name: Upload artifact - uses: actions/upload-artifact@v3 - with: - name: github-pages - path: ./primer_view_components/artifact.tar - - deploy: - name: Deploy - runs-on: ubuntu-latest - needs: build - environment: - name: github-pages - url: ${{ steps.deployment.outputs.page_url }} - steps: - - name: Deploy to GitHub Pages - id: deployment - uses: actions/deploy-pages@v2 - with: - preview: false diff --git a/.github/workflows/preview-deploy.yml b/.github/workflows/preview-deploy.yml index 2cb996c0b1..af89351074 100644 --- a/.github/workflows/preview-deploy.yml +++ b/.github/workflows/preview-deploy.yml @@ -105,60 +105,3 @@ jobs: dockerRegistryUsername="GitHubActions" dockerRegistryPassword="${{ secrets.AZURE_ACR_PASSWORD }}" railsMasterKey="${{ secrets.RAILS_MASTER_KEY }}" - docs_build: - if: ${{ github.event.pull_request.head.repo.full_name == 'primer/view_components' }} - name: Docs Build - runs-on: ubuntu-latest - steps: - - name: Checkout default branch - uses: actions/checkout@v3 - with: - version: 14 - - - name: Setup Ruby - uses: ruby/setup-ruby@v1 - with: - ruby-version: '3.2' - bundler-cache: true - - - name: Setup Node - uses: actions/setup-node@v3 - with: - node-version: 16 - cache: 'npm' - cache-dependency-path: | - package-lock.json - docs/package-lock.json - - - name: Install dependencies - run: npm ci && cd docs && npm ci && cd .. - - - name: Generate static files - run: bundle exec rake utilities:build docs:build static:dump - - - name: Build - run: npm run build:docs:preview - - - name: Archive build output - run: 'tar --dereference --directory docs/public -cvf artifact.tar .' - - - name: Upload artifact - uses: actions/upload-artifact@v3 - with: - name: github-pages - path: artifact.tar - docs_deploy: - name: Docs Deploy - runs-on: ubuntu-latest - needs: docs_build - environment: - name: github-pages - url: ${{ steps.deployment.outputs.page_url }} - outputs: - deployment_url: ${{ steps.deployment.outputs.page_url }} - steps: - - name: Deploy to GitHub Pages - id: deployment - uses: actions/deploy-pages@v2 - with: - preview: true diff --git a/.github/workflows/static-files.yml b/.github/workflows/static-files.yml index 1c9081e6b6..38c4a49836 100644 --- a/.github/workflows/static-files.yml +++ b/.github/workflows/static-files.yml @@ -37,7 +37,6 @@ jobs: bundle exec rake utilities:build bundle exec rake docs:build bundle exec rake static:dump - bundle exec rake docs:build_lookbook_pages - uses: stefanzweifel/git-auto-commit-action@v4 with: commit_message: Generating static files diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index 3d74738e1c..6ed5a9ad19 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -36,7 +36,6 @@ jobs: demo/package-lock.json - name: Build run: | - bundle exec rake docs:preview npm ci cd demo && npm ci - name: Test diff --git a/.gitignore b/.gitignore index d2900227c9..f48032404c 100644 --- a/.gitignore +++ b/.gitignore @@ -18,19 +18,10 @@ demo/app/assets/stylesheets/primer* # Generated by lib/tasks/docs.rake /.yardoc /doc -previews/docs/ test/snapshots/ -test/snapshots/docs/ demo/test/snapshots/ previews/pages/*.md.erb previews/pages/forms/inputs/*.md.erb -docs/content/adr/ -docs/content/components/ - -# Docs site Gatsby build -docs/.cache/ -docs/public/ -docs/static/ # Ignore nested node_modules, we commit the root node_modules **/node_modules/ diff --git a/.rubocop.yml b/.rubocop.yml index 78525bce4b..2639bba850 100644 --- a/.rubocop.yml +++ b/.rubocop.yml @@ -12,7 +12,6 @@ AllCops: - "demo/**/*" - "**/vendor/**/*" - "**/node_modules/**/*" - - "test/previews/docs/**/*" TargetRubyVersion: 2.6 Style/ClassAndModuleChildren: diff --git a/app/components/primer/alpha/action_bar.rb b/app/components/primer/alpha/action_bar.rb index 97d741b495..0812a4ca68 100644 --- a/app/components/primer/alpha/action_bar.rb +++ b/app/components/primer/alpha/action_bar.rb @@ -33,13 +33,6 @@ class ActionBar < Primer::Component } } - # @example Default - # - # <%= render(Primer::Alpha::ActionBar.new) do |component| %> - # <% component.with_item_icon_button(icon: :search, label: "Search") - # <% component.with_item_icon_button(icon: :pencil, label: "Edit") %> - # <% end %> - # # @param size [Symbol] <%= one_of(Primer::Alpha::ActionBar::SIZE_OPTIONS) %> # @param overflow_menu [Boolean] Whether to render the overflow menu. # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> diff --git a/app/components/primer/alpha/action_menu.rb b/app/components/primer/alpha/action_menu.rb index 79cca27cea..be7c767708 100644 --- a/app/components/primer/alpha/action_menu.rb +++ b/app/components/primer/alpha/action_menu.rb @@ -27,275 +27,6 @@ class ActionMenu < Primer::Component alias preload? preload - # @example Default - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-0") do |c| %> - # <% c.with_show_button { "Menu" } %> - # <% c.with_item(tag: :a, href: "https://primer.style/design/") do %> - # Primer Design - # <% end %> - # <% c.with_item(tag: :button, type: "button", onclick: "() => {}") do %> - # Quote Reply - # <% end %> - # <% c.with_item(tag: :"clipboard-copy", value: "Text to copy") do %> - # Copy Text - # <% end %> - # <% c.with_item(href: "https://google.com", form_arguments: { name: "foo", value: "bar", method: :post }) do %> - # Submit form - # <% end %> - # <% end %> - # - # @example With caret - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-1") do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Menu - # <% end %> - # <% c.with_item(tag: :a, href: "https://primer.style/design/") do %> - # Primer Design - # <% end %> - # <% c.with_item(tag: :button, type: "button") do %> - # Quote Reply - # <% end %> - # <% c.with_item(tag: :"clipboard-copy", value: "Text to copy") do %> - # Copy Text - # <% end %> - # <% end %> - # - # @example With `IconButton` trigger - # @description - # Set `icon:` to the octicon you want to use. Always provide an accessible name for the menu by setting `aria-label`. - # @code - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-2") do |c| %> - # <% c.with_show_button(icon: :"kebab-horizontal", "aria-label": "Menu") %> - # <% c.with_item(tag: :a, href: "https://primer.style/design/") do %> - # Primer Design Link - # <% end %> - # <% c.with_item(tag: :button, type: "button") do %> - # Quote Reply - # <% end %> - # <% c.with_item(tag: :"clipboard-copy", value: "Text to copy") do %> - # Copy Text - # <% end %> - # <% end %> - # - # @example With divider - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-3") do |c| %> - # <% c.with_show_button(icon: :"kebab-horizontal", "aria-label": "Menu") %> - # <% c.with_item(tag: :a, href: "https://primer.style/design/") do %> - # Primer Design Link - # <% end %> - # <% c.with_item(tag: :button, type: "button") do %> - # Quote Reply - # <% end %> - # <% c.with_divider %> - # <% c.with_item(tag: :"clipboard-copy", value: "Text to copy") do %> - # Copy Text - # <% end %> - # <% end %> - # - # @example With danger item - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-4") do |c| %> - # <% c.with_show_button(icon: :"kebab-horizontal", "aria-label": "Menu") %> - # <% c.with_item(tag: :a, href: "https://primer.style/design/") do %> - # Primer Design Link - # <% end %> - # <% c.with_item(tag: :button, type: "button") do %> - # Quote Reply - # <% end %> - # <% c.with_item(tag: :"clipboard-copy", value: "Text to copy") do %> - # Copy Text - # <% end %> - # <% c.with_item(tag: :button, type: "button", scheme: :danger) do %> - # Delete - # <% end %> - # <% end %> - # - # @example With center align - # @description - # Align the menu to the center of the trigger button - # @code - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-5", anchor_align: :center, anchor_side: :outside_top) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside top - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-6", anchor_align: :center, anchor_side: :outside_left) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside left - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-7", anchor_align: :center, anchor_side: :outside_right) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside right - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-8", anchor_align: :center, anchor_side: :outside_bottom) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside bottom - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # - # @example With start align - # @description - # Align the menu to the start of the trigger button - # @code - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-9", anchor_align: :start, anchor_side: :outside_top) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside top - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-10", anchor_align: :start, anchor_side: :outside_left) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside left - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-11", anchor_align: :start, anchor_side: :outside_right) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside right - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-12", anchor_align: :start, anchor_side: :outside_bottom) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside bottom - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # - # @example With end align - # @description - # Align the menu to the end of the trigger button - # @code - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-13", anchor_align: :end, anchor_side: :outside_top) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside top - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-14", anchor_align: :end, anchor_side: :outside_left) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside left - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-15", anchor_align: :end, anchor_side: :outside_right) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside right - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-16", anchor_align: :end, anchor_side: :outside_bottom) do |c| %> - # <% c.with_show_button do |button| %> - # <% button.with_trailing_action_icon(icon: "triangle-down") %> - # Outside bottom - # <% end %> - # <% c.with_item do %> - # Item 1 that does something - # <% end %> - # <% c.with_item do %> - # Item 2 that does another thing - # <% end %> - # <% end %> - # - # @example With deferred menu content loaded with an `include-fragment` - # <%= render Primer::Alpha::ActionMenu.new(menu_id: "my-action-menu-17", src: "/") do |c| %> - # <% c.with_show_button(icon: :"kebab-horizontal", "aria-label": "Menu") %> - # <% end %> - # - # @example Using a single-select ActionMenu as a form input - # <%= form_with(url: action_menu_form_action_path) do |f| %> - # <%= render(Primer::Alpha::ActionMenu.new(select_variant: :single, dynamic_label: true, dynamic_label_prefix: "Strategy", form_arguments: { builder: f, name: "foo" })) do |menu| %> - # <% menu.with_show_button { "Strategy" } %> - # <% menu.with_item(label: "Fast forward", data: { value: "fast_forward" }) %> - # <% menu.with_item(label: "Recursive", data: { value: "recursive" }) %> - # <% menu.with_item(label: "Ours", data: { value: "ours" }) %> - # <% menu.with_item(label: "Resolve", data: { value: "resolve" }) %> - # <% end %> - # <% end %> - # - # @example Using a multi-select ActionMenu as a form input - # <%= form_with(url: action_menu_form_action_path) do |f| %> - # <%= render(Primer::Alpha::ActionMenu.new(select_variant: :multiple, form_arguments: { builder: f, name: "foo" })) do |menu| %> - # <% menu.with_show_button { "Strategy" } %> - # <% menu.with_item(label: "Fast forward", data: { value: "fast_forward" }) %> - # <% menu.with_item(label: "Recursive", data: { value: "recursive" }) %> - # <% menu.with_item(label: "Ours", data: { value: "ours" }) %> - # <% menu.with_item(label: "Resolve", data: { value: "resolve" }) %> - # <% end %> - # <% end %> - # # @param menu_id [String] Id of the menu. # @param anchor_align [Symbol] <%= one_of(Primer::Alpha::Overlay::ANCHOR_ALIGN_OPTIONS) %>. # @param anchor_side [Symbol] <%= one_of(Primer::Alpha::Overlay::ANCHOR_SIDE_OPTIONS) %>. diff --git a/app/components/primer/alpha/auto_complete.rb b/app/components/primer/alpha/auto_complete.rb index 96e720eecd..c05cf9ada1 100644 --- a/app/components/primer/alpha/auto_complete.rb +++ b/app/components/primer/alpha/auto_complete.rb @@ -62,53 +62,6 @@ class AutoComplete < Primer::Component Primer::BaseComponent.new(**sanitized_args) } - # @example Default - # @description - # Labels are stacked by default. - # @code - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/view-components/rails-app/auto_complete?version=alpha", input_id: "fruits-input--default", list_id: "fruits-popup--default")) %> - # - # @example With inline label - # @description - # Labels can be inline by setting `is_label_inline: true`. However, labels will always become stacked on smaller screen sizes. - # @code - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/view-components/rails-app/auto_complete?version=alpha", is_label_inline: true, input_id: "fruits-input--inline-label", list_id: "fruits-popup--inline-label")) %> - # - # @example With non-visible label - # @description - # A non-visible label may be rendered with `is_label_visible: false`, but it is highly discouraged. See <%= link_to_accessibility %>. - # @code - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/view-components/rails-app/auto_complete?version=alpha", input_id: "fruits-input--non-visible-label", list_id: "fruits-popup--non-visible-label", is_label_visible: false)) %> - # - # @example With icon - # @description - # To display a search icon, set `with_icon` to `true`. - # @code - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/view-components/rails-app/auto_complete?version=alpha", list_id: "fruits-popup--icon", input_id: "fruits-input--icon", with_icon: true)) %> - # - # @example With icon and non-visible label - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/view-components/rails-app/auto_complete?version=alpha", list_id: "fruits-popup--icon-no-label", input_id: "fruits-input--icon-no-label", with_icon: true, is_label_visible: false)) %> - # - # @example With clear button - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/view-components/rails-app/auto_complete?version=alpha", input_id: "fruits-input--clear", list_id: "fruits-popup--clear", is_clearable: true)) %> - # - # @example With custom classes for the input - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/view-components/rails-app/auto_complete?version=alpha", input_id: "fruits-input--custom-input", list_id: "fruits-popup--custom-input")) do |component| %> - # <% component.with_input(classes: "custom-class") %> - # <% end %> - # - # @example With custom classes for the results - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/view-components/rails-app/auto_complete?version=alpha", input_id: "fruits-input--custom-results", list_id: "fruits-popup--custom-results")) do |component| %> - # <% component.with_results(classes: "custom-class") do %> - # <%= render(Primer::Alpha::AutoComplete::Item.new(selected: true, value: "apple")) do %> - # Apple - # <% end %> - # <%= render(Primer::Alpha::AutoComplete::Item.new(value: "orange")) do %> - # Orange - # <% end %> - # <% end %> - # <% end %> - # # @param label_text [String] The label of the input. # @param src [String] The route to query. # @param input_id [String] Id of the input element. diff --git a/app/components/primer/alpha/auto_complete/item.rb b/app/components/primer/alpha/auto_complete/item.rb index 60e92dd31c..e42c1d898c 100644 --- a/app/components/primer/alpha/auto_complete/item.rb +++ b/app/components/primer/alpha/auto_complete/item.rb @@ -7,18 +7,6 @@ class AutoComplete class Item < Primer::Component status :deprecated - # @example Default - # <%= render(Primer::Alpha::AutoComplete.new(label_text: "Fruits", src: "/auto_complete", input_id: "fruits-input--custom-results", list_id: "fruits-popup--custom-results")) do |component| %> - # <% component.results(classes: "custom-class") do %> - # <%= render(Primer::Alpha::AutoComplete::Item.new(selected: true, value: "apple")) do %> - # Apple - # <% end %> - # <%= render(Primer::Alpha::AutoComplete::Item.new(value: "orange")) do %> - # Orange - # <% end %> - # <% end %> - # <% end %> - # # @param value [String] Value of the item. # @param selected [Boolean] Whether the item is selected. # @param disabled [Boolean] Whether the item is disabled. diff --git a/app/components/primer/alpha/banner.rb b/app/components/primer/alpha/banner.rb index fb4bbf69ea..7097672e0e 100644 --- a/app/components/primer/alpha/banner.rb +++ b/app/components/primer/alpha/banner.rb @@ -55,37 +55,6 @@ class Banner < Primer::Component :hide ].freeze - # @example Schemes - #
- # <%= render(Primer::Alpha::Banner.new) { "This is a banner message!" } %> - # <%= render(Primer::Alpha::Banner.new(scheme: :warning)) { "This is a warning banner!" } %> - # <%= render(Primer::Alpha::Banner.new(scheme: :danger)) { "This is a danger banner!" } %> - # <%= render(Primer::Alpha::Banner.new(scheme: :success)) { "This is a success banner!" } %> - #
- # - # @example Full width - # <%= render(Primer::Alpha::Banner.new(full: true)) { "This is a full width banner!" } %> - # - # @example Dismissible - # <%= render(Primer::Alpha::Banner.new(dismissible: :remove)) { "This is a dismissible banner!" } %> - # - # @example Custom icon - # <%= render(Primer::Alpha::Banner.new(icon: :people)) { "This is a banner with a custom icon!" } %> - # - # @example With action button - # <%= render(Primer::Alpha::Banner.new) do |component| %> - # This is a banner with an action button! - # <% component.with_action_button(size: :small) { "Take action" } %> - # <% end %> - # - # @example With custom action - # <%= render(Primer::Alpha::Banner.new) do |component| %> - # Comment saved! - # <% component.with_action_content do %> - # <%= render(Primer::IconButton.new(icon: :pencil, mr: 1, "aria-label": "Edit")) %> - # <% end %> - # <% end %> - # # @param full [Boolean] Whether the component should take up the full width of the screen. # @param full_when_narrow [Boolean] Whether the component should take up the full width of the screen when rendered inside smaller viewports. # @param dismiss_scheme [Symbol] Whether the component can be dismissed with an "x" button. <%= one_of(Primer::Alpha::Banner::DISMISS_SCHEMES) %> diff --git a/app/components/primer/alpha/button_marketing.rb b/app/components/primer/alpha/button_marketing.rb index d325596341..98bb9aa591 100644 --- a/app/components/primer/alpha/button_marketing.rb +++ b/app/components/primer/alpha/button_marketing.rb @@ -26,18 +26,6 @@ class ButtonMarketing < Primer::Component DEFAULT_TYPE = :button TYPE_OPTIONS = [DEFAULT_TYPE, :submit].freeze - # @example Schemes - # <%= render(Primer::Alpha::ButtonMarketing.new(mr: 2)) { "Default" } %> - # <%= render(Primer::Alpha::ButtonMarketing.new(scheme: :primary, mr: 2)) { "Primary" } %> - # <%= render(Primer::Alpha::ButtonMarketing.new(scheme: :outline)) { "Outline" } %> - #
- # <%= render(Primer::Alpha::ButtonMarketing.new(scheme: :transparent)) { "Transparent" } %> - #
- # - # @example Sizes - # <%= render(Primer::Alpha::ButtonMarketing.new(mr: 2)) { "Default" } %> - # <%= render(Primer::Alpha::ButtonMarketing.new(variant: :large)) { "Large" } %> - # # @param scheme [Symbol] <%= one_of(Primer::Alpha::ButtonMarketing::SCHEME_OPTIONS) %> # @param variant [Symbol] <%= one_of(Primer::Alpha::ButtonMarketing::VARIANT_OPTIONS) %> # @param tag [Symbol] <%= one_of(Primer::Alpha::ButtonMarketing::TAG_OPTIONS) %> diff --git a/app/components/primer/alpha/dialog.rb b/app/components/primer/alpha/dialog.rb index 679aefc8c7..fefd62f419 100644 --- a/app/components/primer/alpha/dialog.rb +++ b/app/components/primer/alpha/dialog.rb @@ -97,23 +97,6 @@ class Dialog < Primer::Component # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> renders_one :footer, "Footer" - # @example Dialog with Cancel and Submit buttons - # @description - # An ID is provided which enables wiring of the open and close buttons to the dialog. - # @code - # <%= render(Primer::Alpha::Dialog.new( - # title: "Dialog Example", - # id: "my-dialog", - # )) do |d| %> - # <% d.with_show_button { "Show Dialog" } %> - # <% d.with_body do %> - #

Some content

- # <% end %> - # <% d.with_footer do %> - # <%= render(Primer::ButtonComponent.new(data: { "close-dialog-id": "my-dialog" })) { "Cancel" } %> - # <%= render(Primer::ButtonComponent.new(scheme: :primary)) { "Submit" } %> - # <% end %> - # <% end %> # @param id [String] The id of the dialog. # @param title [String] Describes the content of the dialog. # @param subtitle [String] Provides additional context for the dialog, also setting the `aria-describedby` attribute. diff --git a/app/components/primer/alpha/dropdown.rb b/app/components/primer/alpha/dropdown.rb index f605dcbf91..ffa537f478 100644 --- a/app/components/primer/alpha/dropdown.rb +++ b/app/components/primer/alpha/dropdown.rb @@ -26,111 +26,6 @@ class Dropdown < Primer::Component # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> renders_one :menu, "Primer::Alpha::Dropdown::Menu" - # @example Default - # <%= render(Primer::Alpha::Dropdown.new) do |component| %> - # <% component.with_button do %> - # Dropdown - # <% end %> - # - # <% component.with_menu(header: "Options") do |menu| - # menu.with_item { "Item 1" } - # menu.with_item { "Item 2" } - # menu.with_item { "Item 3" } - # end %> - # <% end %> - # - # @example With dividers - # - # @description - # Dividers can be used to separate a group of items. They don't have any content. - # @code - # <%= render(Primer::Alpha::Dropdown.new) do |component| %> - # <% component.with_button do %> - # Dropdown - # <% end %> - # - # <% component.with_menu(header: "Options") do |menu| - # menu.with_item { "Item 1" } - # menu.with_item { "Item 2" } - # menu.with_item(divider: true) - # menu.with_item { "Item 3" } - # menu.with_item { "Item 4" } - # menu.with_item(divider: true) - # menu.with_item { "Item 5" } - # menu.with_item { "Item 6" } - # end %> - # <% end %> - # - # @example With direction - # <%= render(Primer::Alpha::Dropdown.new(display: :inline_block)) do |component| %> - # <% component.with_button do %> - # Dropdown - # <% end %> - # - # <% component.with_menu(header: "Options", direction: :s) do |menu| - # menu.with_item { "Item 1" } - # menu.with_item { "Item 2" } - # menu.with_item { "Item 3" } - # menu.with_item { "Item 4" } - # end %> - # <% end %> - # - # @example With caret - # <%= render(Primer::Alpha::Dropdown.new(with_caret: true)) do |component| %> - # <% component.with_button do %> - # Dropdown - # <% end %> - # - # <% component.with_menu(header: "Options") do |menu| - # menu.with_item { "Item 1" } - # menu.with_item { "Item 2" } - # menu.with_item { "Item 3" } - # menu.with_item { "Item 4" } - # end %> - # <% end %> - # - # @example Customizing the button - # <%= render(Primer::Alpha::Dropdown.new) do |component| %> - # <% component.with_button(scheme: :primary, size: :small) do %> - # Dropdown - # <% end %> - # - # <% component.with_menu(header: "Options") do |menu| - # menu.with_item { "Item 1" } - # menu.with_item { "Item 2" } - # menu.with_item { "Item 3" } - # menu.with_item { "Item 4" } - # end %> - # <% end %> - # - # @example Menu as list - # <%= render(Primer::Alpha::Dropdown.new) do |component| %> - # <% component.with_button do %> - # Dropdown - # <% end %> - # - # <% component.with_menu(as: :list, header: "Options") do |menu| - # menu.with_item { "Item 1" } - # menu.with_item { "Item 2" } - # menu.with_item(divider: true) - # menu.with_item { "Item 3" } - # menu.with_item { "Item 4" } - # end %> - # <% end %> - # - # @example Customizing menu items - # <%= render(Primer::Alpha::Dropdown.new) do |component| %> - # <% component.with_button do %> - # Dropdown - # <% end %> - # - # <% component.with_menu(header: "Options") do |menu| - # menu.with_item(tag: :button) { "Item 1" } - # menu.with_item(classes: "custom-class") { "Item 2" } - # menu.with_item { "Item 3" } - # end %> - # <% end %> - # # @param overlay [Symbol] <%= one_of(Primer::Beta::Details::OVERLAY_MAPPINGS.keys) %> # @param with_caret [Boolean] Whether or not a caret should be rendered in the button. # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> diff --git a/app/components/primer/alpha/form_control.rb b/app/components/primer/alpha/form_control.rb index e1491b261b..66c4b9dbe4 100644 --- a/app/components/primer/alpha/form_control.rb +++ b/app/components/primer/alpha/form_control.rb @@ -10,17 +10,6 @@ class FormControl < Primer::Component # Note that this slot takes precedence over the `caption:` argument in the constructor. renders_one :caption - # @example Default - # <%= render(Primer::Alpha::FormControl.new(label: "Best character")) do |component| %> - # <% component.with_input do |input_arguments| %> - # <%= render(Primer::Alpha::SegmentedControl.new("aria-label": "Best character", **input_arguments)) do |seg| %> - # <% seg.with_item(label: "Han Solo") %> - # <% seg.with_item(label: "Luke Skywalker") %> - # <% seg.with_item(label: "Leia Organa") %> - # <% end %> - # <% end %> - # <% end %> - # # @param label [String] Label text displayed above the input. # @param caption [String] Describes the field and what sort of input it expects. Displayed below the input. Note that the `caption` slot is also available and takes precedence over this argument when provided. # @param validation_message [String] A string displayed in red between the caption and the input indicating the input's contents are invalid. diff --git a/app/components/primer/alpha/hellip_button.rb b/app/components/primer/alpha/hellip_button.rb index 7110c5572b..37b7914d65 100644 --- a/app/components/primer/alpha/hellip_button.rb +++ b/app/components/primer/alpha/hellip_button.rb @@ -9,15 +9,6 @@ module Alpha # * This button is displaying a hellip as its content (The three dots character). Therefore a label is needed for screen readers. # * Set the attribute `aria-label` on the system arguments. E.g. `Primer::Alpha::HellipButton.new("aria-label": "Expand next part")` class HellipButton < Primer::Component - # @example Default - # <%= render(Primer::Alpha::HellipButton.new("aria-label": "No effect")) %> - # - # @example Inline - # <%= render(Primer::Alpha::HellipButton.new(inline: true, "aria-label": "No effect")) %> - # - # @example Styling the button - # <%= render(Primer::Alpha::HellipButton.new(p: 1, classes: "custom-class", "aria-label": "No effect")) %> - # # @param inline [Boolean] Whether or not the button is inline. # @param disabled [Boolean] Whether or not the button is disabled. # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> diff --git a/app/components/primer/alpha/hidden_text_expander.rb b/app/components/primer/alpha/hidden_text_expander.rb index b2729ae52f..b24fd16a49 100644 --- a/app/components/primer/alpha/hidden_text_expander.rb +++ b/app/components/primer/alpha/hidden_text_expander.rb @@ -12,15 +12,6 @@ module Alpha class HiddenTextExpander < Primer::Component status :alpha - # @example Default - # <%= render(Primer::Alpha::HiddenTextExpander.new("aria-label": "No effect")) %> - # - # @example Inline - # <%= render(Primer::Alpha::HiddenTextExpander.new(inline: true, "aria-label": "No effect")) %> - # - # @example Styling the button - # <%= render(Primer::Alpha::HiddenTextExpander.new("aria-label": "No effect", button_arguments: { p: 1, classes: "custom-class" })) %> - # # @param inline [Boolean] Whether or not the expander is inline. # @param button_arguments [Hash] <%= link_to_system_arguments_docs %> for the button element. # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> diff --git a/app/components/primer/alpha/image.rb b/app/components/primer/alpha/image.rb index ce6fbae80d..01de89bfaa 100644 --- a/app/components/primer/alpha/image.rb +++ b/app/components/primer/alpha/image.rb @@ -9,22 +9,6 @@ module Alpha class Image < Primer::Component status :alpha - # @example Default - # - # <%= render(Primer::Alpha::Image.new(src: Primer::ExampleImage::BASE64_SRC, alt: "GitHub")) %> - # - # @example Helper - # - # <%= primer_image(src: Primer::ExampleImage::BASE64_SRC, alt: "GitHub") %> - # - # @example Lazy loading - # - # <%= render(Primer::Alpha::Image.new(src: Primer::ExampleImage::BASE64_SRC, alt: "GitHub", lazy: true)) %> - # - # @example Custom size - # - # <%= render(Primer::Alpha::Image.new(src: Primer::ExampleImage::BASE64_SRC, alt: "GitHub", height: 100, width: 100)) %> - # # @param src [String] The source url of the image. # @param alt [String] Specifies an alternate text for the image. # @param lazy [Boolean] Whether or not to lazily load the image. diff --git a/app/components/primer/alpha/image_crop.rb b/app/components/primer/alpha/image_crop.rb index f4283303f3..41edacc9b3 100644 --- a/app/components/primer/alpha/image_crop.rb +++ b/app/components/primer/alpha/image_crop.rb @@ -14,17 +14,6 @@ class ImageCrop < Primer::Component Primer::BaseComponent.new(**system_arguments) } - # @example Simple cropper - # <%= render(Primer::Alpha::ImageCrop.new(src: Primer::ExampleImage::BASE64_SRC)) %> - # - # @example Square cropper - # <%= render(Primer::Alpha::ImageCrop.new(src: Primer::ExampleImage::BASE64_SRC, rounded: false)) %> - # - # @example Cropper with a custom loader - # <%= render(Primer::Alpha::ImageCrop.new(src: Primer::ExampleImage::BASE64_SRC, rounded: false)) do |cropper| %> - # <% cropper.with_loading(style: "width: 120px").with_content("Loading...") %> - # <% end %> - # # @param src [String] The path of the image to crop. # @param rounded [Boolean] If the crop mask should be a circle. Defaults to true. # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> diff --git a/app/components/primer/alpha/layout.rb b/app/components/primer/alpha/layout.rb index cfd3bc31d9..6f3047200d 100644 --- a/app/components/primer/alpha/layout.rb +++ b/app/components/primer/alpha/layout.rb @@ -79,124 +79,6 @@ class Layout < Primer::Component Primer::Alpha::Layout::Sidebar.new(**system_arguments) } - # @example Default - # - # <%= render(Primer::Alpha::Layout.new) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(border: true) { "Sidebar" } %> - # <% end %> - # - # @example Main widths - # - # @description - # When `full`, the main column will stretch to cover all the available width. - # Otherwise, the main column will try to be centered in the screen; it may appear aligned to the left when there isn't enough space. - # - # Use smaller maximum widths in the main column to facilitate interface scanning and reading. - # - # When flowing as a row, `Main` takes the full width. - # - # @code - # <%= render(Primer::Alpha::Layout.new) do |component| %> - # <% component.with_main(width: :full, border: true) { "Main" } %> - # <% component.with_sidebar(border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(mt: 5)) do |component| %> - # <% component.with_main(width: :md, border: true) { "Main" } %> - # <% component.with_sidebar(border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(mt: 5)) do |component| %> - # <% component.with_main(width: :lg, border: true) { "Main" } %> - # <% component.with_sidebar(border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(mt: 5)) do |component| %> - # <% component.with_main(width: :xl, border: true) { "Main" } %> - # <% component.with_sidebar(border: true) { "Sidebar" } %> - # <% end %> - # - # @example Sidebar widths - # - # @description - # Sets the sidebar width. The width is predetermined according to the breakpoint instead of it being percentage-based. - # - # - `default`: [md: 256px, lg: 296px, xl: 320px] - # - `narrow`: [md: 240px, lg: 256px, xl: 296px] - # - `wide`: [md: 296px, lg: 320px, xl: 344px] - # - # When flowing as a row, `Sidebar` takes the full width. - # - # @code - # <%= render(Primer::Alpha::Layout.new) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(width: :default, border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(mt: 5)) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(width: :narrow, border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(mt: 5)) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(width: :wide, border: true) { "Sidebar" } %> - # <% end %> - # - # @example Sidebar placement - # - # @description - # Use `start` for sidebars that manipulate local navigation, while right-aligned `end` is useful for metadata and other auxiliary information. - # - # @code - # <%= render(Primer::Alpha::Layout.new) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(col_placement: :start, border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new( mt: 5)) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(col_placement: :end, border: true) { "Sidebar" } %> - # <% end %> - # - # @example Sidebar placement as row - # - # @description - # When flowing as a row, whether the sidebar is rendered first or last in the layout, or, if it's entirely hidden from the user. - # - # When `hidden`, make sure the experience is not degraded on smaller screens, and the user can still access the sidebar content somehow. - # For instance, the user may not see a Settings navigation sidebar when drilled down on a page, but they can still navigate to the Settings - # landing page to interact with the local navigation. - # - # @code - # <%= render(Primer::Alpha::Layout.new) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(row_placement: :start, border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(mt: 5)) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(row_placement: :end, border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(mt: 5)) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(row_placement: :none, border: true) { "Sidebar" } %> - # <% end %> - # - # @example Changing when to render `Layout` as columns - # - # @description - # You can specify when the `Layout` should change from rows into columns. - # Any screen size before this breakpoint will render the `Layout` in stacked rows. - # - # @code - # <%= render(Primer::Alpha::Layout.new(stacking_breakpoint: :sm)) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(stacking_breakpoint: :md, mt: 5)) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(border: true) { "Sidebar" } %> - # <% end %> - # <%= render(Primer::Alpha::Layout.new(stacking_breakpoint: :lg, mt: 5)) do |component| %> - # <% component.with_main(border: true) { "Main" } %> - # <% component.with_sidebar(border: true) { "Sidebar" } %> - # <% end %> - # # @param stacking_breakpoint [Symbol] When the `Layout` should change from rows into columns. <%= one_of(Primer::Alpha::Layout::STACKING_BREAKPOINT_OPTIONS) %> # @param first_in_source [Symbol] Which element to render first in the HTML. This will change the keyboard navigation order. <%= one_of(Primer::Alpha::Layout::FIRST_IN_SOURCE_OPTIONS) %> # @param gutter [Symbol] The amount of space between the main section and the sidebar. <%= one_of(Primer::Alpha::Layout::GUTTER_OPTIONS) %> diff --git a/app/components/primer/alpha/menu.rb b/app/components/primer/alpha/menu.rb index f5bcd84cd9..e103f755be 100644 --- a/app/components/primer/alpha/menu.rb +++ b/app/components/primer/alpha/menu.rb @@ -39,25 +39,6 @@ class Menu < Primer::Component Primer::BaseComponent.new(**system_arguments) } - # @example Default - # <%= render(Primer::Alpha::Menu.new) do |component| %> - # <% component.with_heading(tag: :h2) do %> - # Heading - # <% end %> - # <% component.with_item(selected: true, href: "#url") do %> - # Item 1 - # <% end %> - # <% component.with_item(href: "#url") do %> - # <%= render(Primer::Beta::Octicon.new("check")) %> - # With Icon - # <% end %> - # <% component.with_item(href: "#url") do %> - # <%= render(Primer::Beta::Octicon.new("check")) %> - # With Icon and Counter - # <%= render(Primer::Beta::Counter.new(count: 25)) %> - # <% end %> - # <% end %> - # # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> def initialize(**system_arguments) @system_arguments = deny_tag_argument(**system_arguments) diff --git a/app/components/primer/alpha/multi_input.rb b/app/components/primer/alpha/multi_input.rb index 05be913753..b614023ef1 100644 --- a/app/components/primer/alpha/multi_input.rb +++ b/app/components/primer/alpha/multi_input.rb @@ -42,39 +42,6 @@ class MultiInput < Primer::Component # @!method initialize # - # @example Default - # <%= render(Primer::Alpha::Select.new(name: :dietary_pref, label: "Dietary preference")) do |c| %> - # <% c.option(label: "Meatatarian", value: "meatatarian") %> - # <% c.option(label: "Vegetarian", value: "vegetarian") %> - # <% end %> - # - # <%= render(Primer::Alpha::MultiInput.new(name: :dish, label: "Select dish")) do |c| %> - # <% c.select_list(name: :meatatarian) do |list| %> - # <% list.option(label: "Steak", value: "steak") %> - # <% list.option(label: "Salmon", value: "salmon") %> - # <% end %> - # <% c.select_list(name: :vegetarian, hidden: true) do |list| %> - # <% list.option(label: "Portobello mushroom", value: "portobello") %> - # <% list.option(label: "Tofu curry", value: "tofu") %> - # <% end %> - # <% end %> - # - # - # # @macro form_input_arguments end end diff --git a/app/components/primer/alpha/nav_list.rb b/app/components/primer/alpha/nav_list.rb index f9f31a2f90..6ee3e04bb3 100644 --- a/app/components/primer/alpha/nav_list.rb +++ b/app/components/primer/alpha/nav_list.rb @@ -99,75 +99,6 @@ def self.custom_element_name } } - # @example Items and headings - # - # <%= render(Primer::Alpha::NavList.new(aria: { label: "Settings" }, selected_item_id: :personal_info)) do |component| %> - # <% component.with_item(label: "General", selected_by_ids: :general, href: "/settings/general") %> - # <% component.with_group do |group| %> - # <% group.with_heading(title: "Account Settings") %> - # <% group.with_item(label: "Personal Information", selected_by_ids: :personal_info, href: "/account/info") %> - # <% group.with_item(label: "Password", selected_by_ids: :password, href: "/account/password") %> - # <% group.with_item(label: "Billing info", selected_by_ids: :billing, href: "/account/billing") %> - # <% end %> - # <% end %> - # - # @example Leading and trailing visuals - # - # <%= render(Primer::Alpha::NavList.new(aria: { label: "Settings" }, selected_item_id: :personal_info)) do |component| %> - # <% component.with_group do |group| %> - # <% group.with_heading(title: "Account Settings") %> - # <% group.with_avatar_item(src: "https://github.com/github.png", username: "person", selected_by_ids: :personal_info, href: "/account/info") %> - # <% group.with_item(label: "Notifications", selected_by_ids: :notifications, href: "/account/notifications") do |item| %> - # <% item.with_leading_visual_icon(icon: :bell) %> - # <% item.with_trailing_visual_counter(count: 15) %> - # <% end %> - # <% group.with_item(label: "Billing info", selected_by_ids: :billing, href: "/account/billing") do |item| %> - # <% item.with_leading_visual_icon(icon: :package) %> - # <% item.with_trailing_visual_icon(icon: :"dot-fill", color: :attention) %> - # <% end %> - # <% end %> - # <% end %> - # - # @example Expandable sub items - # - # <%= render(Primer::Alpha::NavList.new(aria: { label: "Settings" }, selected_item_id: :email_notifications)) do |component| %> - # <% component.with_group do |group| %> - # <% group.with_heading(title: "Account Settings") %> - # <% group.with_item(label: "Notification settings") do |item| %> - # <% item.with_leading_visual_icon(icon: :bell) %> - # <% item.with_item(label: "Email", selected_by_ids: :email_notifications, href: "/account/notifications/email") do |subitem| %> - # <% subitem.with_trailing_visual_icon(icon: :mail) %> - # <% end %> - # <% item.with_item(label: "SMS", selected_by_ids: :sms_notifications, href: "/account/notifications/sms") do |subitem| %> - # <% subitem.with_trailing_visual_icon(icon: :"device-mobile") %> - # <% end %> - # <% end %> - # <% group.with_item(label: "Messages") do |item| %> - # <% item.with_leading_visual_icon(icon: :bookmark) %> - # <% item.with_item(label: "Inbox", href: "/account/messages/inbox") do |subitem| %> - # <% subitem.with_trailing_visual_counter(count: 10) %> - # <% end %> - # <% item.with_item(label: "Organizer", href: "/account/messages/organizer") do |subitem| %> - # <% subitem.with_trailing_visual_label(scheme: :primary) { "New" } %> - # <% end %> - # <% end %> - # <% end %> - # <% end %> - # - # @example Trailing action - # - # <%= render(Primer::Alpha::NavList.new(aria: { label: "Foods" })) do |component| %> - # <% component.with_group do |group| %> - # <% group.with_heading(title: "My Favorite Foods") %> - # <% group.with_item(label: "Popplers", selected_by_ids: :popplers, href: "/foods/popplers") do |item| %> - # <% item.with_trailing_action(icon: "plus", "aria-label": "Add new food", size: :medium) %> - # <% end %> - # <% group.with_item(label: "Slurm", selected_by_ids: :slurm, href: "/foods/slurm") do |item| %> - # <% item.with_trailing_action(icon: "plus", "aria-label": "Add new food", size: :medium) %> - # <% end %> - # <% end %> - # <% end %> - # # @param selected_item_id [Symbol] The ID of the currently selected item. The default is `nil`, meaning no item is selected. # @param system_arguments [Hash] <%= link_to_system_arguments_docs %> def initialize(selected_item_id: nil, **system_arguments) diff --git a/app/components/primer/alpha/navigation/tab.rb b/app/components/primer/alpha/navigation/tab.rb index 1154bcbb1e..1703892bf9 100644 --- a/app/components/primer/alpha/navigation/tab.rb +++ b/app/components/primer/alpha/navigation/tab.rb @@ -65,41 +65,6 @@ class Tab < Primer::Component attr_reader :selected - # @example Default - # <%= render(Primer::Alpha::Navigation::Tab.new(selected: true)) do |component| %> - # <% component.with_text { "Selected" } %> - # <% end %> - # <%= render(Primer::Alpha::Navigation::Tab.new) do |component| %> - # <% component.with_text { "Not selected" } %> - # <% end %> - # - # @example With icons and counters - # <%= render(Primer::Alpha::Navigation::Tab.new) do |component| %> - # <% component.with_icon(:star) %> - # <% component.with_text { "Tab" } %> - # <% end %> - # <%= render(Primer::Alpha::Navigation::Tab.new) do |component| %> - # <% component.with_icon(:star) %> - # <% component.with_text { "Tab" } %> - # <% component.with_counter(count: 10) %> - # <% end %> - # <%= render(Primer::Alpha::Navigation::Tab.new) do |component| %> - # <% component.with_text { "Tab" } %> - # <% component.with_counter(count: 10) %> - # <% end %> - # - # @example Inside a list - # <%= render(Primer::Alpha::Navigation::Tab.new(list: true)) do |component| %> - # <% component.with_text { "Tab" } %> - # <% end %> - # - # @example With custom HTML - # <%= render(Primer::Alpha::Navigation::Tab.new) do %> - #
- # This is my custom HTML - #
- # <% end %> - # # @param list [Boolean] Whether the Tab is an item in a `