{"id":33916791,"url":"https://github.com/sul-dlss/sdr_view_components","last_synced_at":"2026-01-13T22:56:30.989Z","repository":{"id":322711953,"uuid":"1090583645","full_name":"sul-dlss/sdr_view_components","owner":"sul-dlss","description":"Re-usable view components for SDR applications","archived":false,"fork":false,"pushed_at":"2026-01-06T16:28:13.000Z","size":303,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-01-13T22:56:13.212Z","etag":null,"topics":["gem","infrastructure","ruby"],"latest_commit_sha":null,"homepage":"https://rubygems.org/gems/sdr_view_components","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sul-dlss.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"MIT-LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-11-05T21:31:36.000Z","updated_at":"2026-01-06T16:28:09.000Z","dependencies_parsed_at":"2026-01-07T16:13:51.016Z","dependency_job_id":null,"html_url":"https://github.com/sul-dlss/sdr_view_components","commit_stats":null,"previous_names":["sul-dlss-labs/sdr-view_components"],"tags_count":10,"template":false,"template_full_name":null,"purl":"pkg:github/sul-dlss/sdr_view_components","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sul-dlss%2Fsdr_view_components","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sul-dlss%2Fsdr_view_components/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sul-dlss%2Fsdr_view_components/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sul-dlss%2Fsdr_view_components/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sul-dlss","download_url":"https://codeload.github.com/sul-dlss/sdr_view_components/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sul-dlss%2Fsdr_view_components/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28405139,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-13T21:51:37.118Z","status":"ssl_error","status_checked_at":"2026-01-13T21:45:14.585Z","response_time":56,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["gem","infrastructure","ruby"],"created_at":"2025-12-12T07:31:03.395Z","updated_at":"2026-01-13T22:56:30.983Z","avatar_url":"https://github.com/sul-dlss.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![CircleCI](https://dl.circleci.com/status-badge/img/gh/sul-dlss/sdr_view_components/tree/main.svg?style=svg)](https://dl.circleci.com/status-badge/redirect/gh/sul-dlss/sdr_view_components/tree/main)\n[![codecov](https://codecov.io/github/sul-dlss/sdr_view_components/graph/badge.svg?token=VGFL92KY3E)](https://codecov.io/github/sul-dlss/sdr_view_components)\n[![Gem Version](https://badge.fury.io/rb/sdr_view_components.svg)](https://badge.fury.io/rb/sdr_view_components)\n\n# SdrViewComponents\n\nA rails gem to provide reusable view components used throughout the SDR applications and implement\ncomponent library assets.\n\n# Installation\n\nAdd to gemfile:\n\n```\ngem 'sdr_view_components'\n```\n\n## Requirements\n\nThis set of components relies on the component library stylesheets, add:\n\n```\n\u003clink rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/gh/sul-dlss/component-library@v2025-09-11/styles/sul.css\"\u003e\n```\n\nwith the most recent date tagged release to your `application.html.erb` layout file.\n\n## Usage\n\n### Add the SUL Header to your application\n\nSupported header variations are `:dark`, `:light`, and `:white` (default is `:light`)\n\n```\n\u003c%= render SdrViewComponents::Structure::HeaderComponent.new(title: 'Test Header', subtitle: 'Test Subtitle', variant: :dark) do |header| %\u003e\n  \u003c% header.with_primary_navigation_link do %\u003e\n    \u003c%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Home', path: '#') %\u003e\n  \u003c% end %\u003e\n  \u003c% header.with_primary_navigation_link do %\u003e\n    \u003c%= render SdrViewComponents::Elements::Navigation::DropdownMenuComponent.new(text: 'Logged in: amcollie-preview-dropdown') do |dropdown| %\u003e\n      \u003c% dropdown.with_item do %\u003e\n        \u003c%= link_to 'Logout', '/Shibboleth.sso/Logout', class: 'dropdown-item' %\u003e\n      \u003c% end %\u003e\n    \u003c% end %\u003e\n    \u003c%# ... all primary nav links %\u003e\n  \u003c% end %\u003e\n  \u003c% header.with_secondary_navigation_link do %\u003e\n    \u003c%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Option', path: '/item1') %\u003e\n    \u003c%# ... all secondary nav links\u003e\n  \u003c% end %\u003e\n\u003c% end %\u003e\n```\n\nThe `:dark` variation supports providing an rgb value via the `background_color` param in order to override the default dark background, for example:\n\n```\n\u003c%= render SdrViewComponents::Structure::HeaderComponent.new(title: 'Test Header', subtitle: 'Test Subtitle', variant: :dark, rgb_color_str: '1, 104, 149') do |header| %\u003e\n\n...\n\n\u003c% end %\u003e\n```\n\nBy default, the SUL Rosette is included in the header, this can be disabled by setting `rosette: false` in the parameter list when instantiating the header.\n\n### Form components\n\nSdrViewComponents provides a wrapper for several [ActionView::Helper::Tags](https://api.rubyonrails.org/v8.1.1/classes/ActionView/Helpers/Tags.html).\n\nCurrently supported tags:\n- Checkbox\n- File\n- RadioButton\n- TextArea\n- TextField\n\n#### Composed form components\n\nSdrViewComponents provides fully composed (label, help text, and validation) instances of the above components as:\n\n- SdrViewComponents::Forms::CheckboxComponent\n- SdrViewComponents::Forms::FileComponent\n- SdrViewComponents::Forms::RadioButtonComponent\n- SdrViewComponents::Forms::TextAreaComponent\n- SdrViewComponents::Forms::TextFieldComponent\n\nAt a minimum, each of these components must be provided wih the `form:` and `field_name:` parameters. Additionally, you can provide prefixed parameters that will be passed the the individual parts of the components:\n\n- `container_`: is used to pass arguments to the surrounding `div` for the component.\n- `input_`: is used to pass arguments to the actual input component.\n- `label_`: is used to pass arguments to the label for the component.\n- `help_`: is used to pass arguments to the help text available for the component.\n- `error_`: is used to pass arguments to the validation output of the component.\n\nTODO:\n- Outline the supported params for each prefix\n- Provide an example instantiation and output\n\n#### Basic form components\n\nEach of the supported components above uses the provided \"basic\" components:\n\n- SdrViewComponents::Forms::BasicCheckboxComponent\n- SdrViewComponents::Forms::BasicFileComponent\n- SdrViewComponents::Forms::BasicRadioButtonComponent\n- SdrViewComponents::Forms::BasicTextAreaComponent\n- SdrViewComponents::Forms::BasicTextFieldComponent\n\nAt a minimum, each of these components must be provided wih the `form:` and `field_name:` parameters. Additionally, you can provide additional parameters that will be passed to the standard ActionView::Helpers::Tag.\n\n### General usage:\n\n```\n\u003c% render SdrViewComponent::....\u003e\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsul-dlss%2Fsdr_view_components","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsul-dlss%2Fsdr_view_components","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsul-dlss%2Fsdr_view_components/lists"}