{"id":20218669,"url":"https://github.com/jadu/pulsar-react","last_synced_at":"2025-11-28T08:09:41.608Z","repository":{"id":40769289,"uuid":"258545900","full_name":"jadu/pulsar-react","owner":"jadu","description":"Pulsar components for React","archived":false,"fork":false,"pushed_at":"2023-03-21T13:53:00.000Z","size":1525,"stargazers_count":1,"open_issues_count":20,"forks_count":1,"subscribers_count":7,"default_branch":"main","last_synced_at":"2025-01-13T22:33:28.514Z","etag":null,"topics":["jadu","pulsar","react","react-components"],"latest_commit_sha":null,"homepage":"http://pulsar.docs.jadu.net","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/jadu.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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}},"created_at":"2020-04-24T15:08:09.000Z","updated_at":"2023-03-21T13:50:16.000Z","dependencies_parsed_at":"2025-01-13T22:32:06.782Z","dependency_job_id":"f162952c-5989-4f7d-88e8-bc6dad0f5e92","html_url":"https://github.com/jadu/pulsar-react","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jadu%2Fpulsar-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jadu%2Fpulsar-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jadu%2Fpulsar-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/jadu%2Fpulsar-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/jadu","download_url":"https://codeload.github.com/jadu/pulsar-react/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241661019,"owners_count":19998945,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["jadu","pulsar","react","react-components"],"created_at":"2024-11-14T06:39:23.286Z","updated_at":"2025-11-28T08:09:41.563Z","avatar_url":"https://github.com/jadu.png","language":"CSS","readme":"# Pulsar React Components\n\nA collection of Pulsar components implemented using React.\n\n## Form input component support\n\n| Component | Status |\n| --------- | ------ |\n| ButtonGroup | ✅ |\n| Checkbox | ✅ |\n| Choice | ✅ |\n| Color | ✅ |\n| Compound | ✅ (achieved with form group `inline` variant |\n| Content | ✅ |\n| DateInput | ✅ |\n| File | ✅ |\n| Form | ✅ |\n| Hidden | ✅ |\n| InlineCheckbox | ✅ |\n| InlineRadioButton | ✅ |\n| PasswordInput | ✅ |\n| RadioButton | ✅ |\n| Range | ✅ |\n| Select | ✅ |\n| Select2 | ✅ |\n| TextArea | ✅ |\n| TextInput | ✅ |\n| TimeInput | ✅ |\n| ToggleSwitch | ✅ |\n\n## Form structure component support\n\n| Component | Status |\n| --------- | ------ |\n| ErrorBlock | ✅ |\n| ErrorSummary | ✖ |\n| Fieldset | ✅ |\n| FormGroup | ✅ |\n| FormLabel | ✅ |\n| HelpBlock | ✅ |\n\n## HTML component support\n\n| Component | Status |\n| --------- | ------ |\n| Badge | ✅ |\n| Block list | ✖ |\n| Breadcrumb | ✖ |\n| Button | ✅ |\n| Button group | ✅ |\n| Dropdown button | ✅ |\n| Card | ✖ no current Twig helper |\n| Datatable | ✖ |\n| Flash message | ✖ |\n| Icon | ✖ |\n| Label | ✅ |\n| Link | ✅ |\n| Link list | ✅ Achievable by nesting a List\u003eListItem\u003eLink |\n| List | ✅ New OrderedList \u0026 UnorderedList components |\n| Loading spinner | ✖ |\n| Media | ✖ |\n| Metadata | ✖ |\n| Modal | ✖ |\n| Pagination | ✖ |\n| Panel | ✖ |\n| Popover | ✖ |\n| Progress bar | ✖ |\n| Progress list | ✖ |\n| Remove button | ✖ |\n| Status | ✖ |\n| Table | ✖ |\n| Tooltip | ✖ |\n\n# Basic examples\n\n**Button**\n\n```jsx\n  \u003cButton\u003eFoo\u003c/Button\u003e\n```\n\n**Button group (Form)**\n\n```jsx\n\u003cFormGroup buttonGroup labelText=\"Group label\"\u003e\n  \u003cButtonGroupItem type=\"radio\" id=\"foo-1\" name=\"group-1\"\u003eFoo\u003c/ButtonGroupItem\u003e\n  \u003cButtonGroupItem type=\"radio\" id=\"bar-1\" name=\"group-1\"\u003eBar\u003c/ButtonGroupItem\u003e\n  \u003cButtonGroupItem type=\"radio\" id=\"baz-1\" name=\"group-1\"\u003eBaz\u003c/ButtonGroupItem\u003e\n\u003c/FormGroup\u003e\n\n\u003cFormGroup buttonGroup labelText=\"Group label\"\u003e\n  \u003cButtonGroupItem type=\"checkbox\" id=\"foo-1\" name=\"group-1\"\u003eFoo\u003c/ButtonGroupItem\u003e\n  \u003cButtonGroupItem type=\"checkbox\" id=\"bar-1\" name=\"group-1\"\u003eBar\u003c/ButtonGroupItem\u003e\n  \u003cButtonGroupItem type=\"checkbox\" id=\"baz-1\" name=\"group-1\"\u003eBaz\u003c/ButtonGroupItem\u003e\n\u003c/FormGroup\u003e\n```\n\n**Button group (HTML)**\n\n```jsx\n\u003cButtonGroup\u003e\n  \u003cButton\u003eFoo\u003c/Button\u003e\n\u003c/ButtonGroup\u003e\n```\n\n**Checkbox**\n\n```jsx\n\u003cFormGroup checkbox labelText=\"Group label\"\u003e\n  \u003cCheckbox name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Choice**\n\n```jsx\n\u003cFormGroup choiceGroup labelText=\"Assign blame to\"\u003e\n  \u003cChoiceGroupItem type=\"radio\" name=\"choice-1\" value=\"choice-1-sun\"\u003eSunshine\u003c/ChoiceGroupItem\u003e\n  \u003cChoiceGroupItem type=\"radio\" name=\"choice-1\" value=\"choice-1-moon\"\u003eMoonlight\u003c/ChoiceGroupItem\u003e\n  \u003cChoiceGroupItem type=\"radio\" name=\"choice-1\" value=\"choice-1-good\"\u003eGood times\u003c/ChoiceGroupItem\u003e \n  \u003cChoiceGroupItem type=\"radio\" name=\"choice-1\" value=\"choice-1-boog\"\u003eBoogie\u003c/ChoiceGroupItem\u003e\n\u003c/FormGroup\u003e\n```\n\n**Color**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cColorInput name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Compound**\n\n```jsx\n\u003cFormGroup inline labelText=\"Group label\"\u003e\n  \u003cTextInput width={1} name=\"dd\" placeholder=\"DD\" /\u003e\n  \u003cTextInput width={1} name=\"mm\" placeholder=\"MM\" /\u003e\n  \u003cTextInput width={1} name=\"yyyy\" placeholder=\"YYYY\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Content**\n\n```jsx\n\u003cFormGroup content labelText=\"Group label\"\u003e\n  \u003cContent\u003eThis is content\u003c/Content\u003e\n\u003c/FormGroup\u003e\n```\n\n**DateInput**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cDateInput name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Dropdown Button**\n\n```jsx\n\u003cDropdownButton \n  label=\"Menu\"\n  items={[\n    { id: 'chocolate', label: 'Chocolate' },\n    { id: 'strawberry', label: 'Strawberry' },\n    { id: 'vanilla', label: 'Vanilla' }\n  ]}\n/\u003e\n```\n\n**ErrorSummary**\n\nTo do...\n\n**Fieldset**\n\n```jsx\n\u003cFieldset legendText=\"Legend\"\u003e\n\u003c/Fieldset\u003e\n```\n\n**File**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cFileInput name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Form**\n\n```jsx\n\u003cForm\u003e\u003c/Form\u003e\n```\n\n**Hidden**\n\n```jsx\n\u003cHiddenInput name=\"foo\" /\u003e\n```\n\n**InlineCheckbox**\n\n```jsx\n\u003cFormGroup inlineCheckbox\u003e\n  \u003cInlineCheckbox \n    labelText=\"Inline checkbox\"\n    name=\"foo\"\n  /\u003e\n\u003c/FormGroup\u003e\n```\n\n**InlineRadioButton**\n\n```jsx\n\u003cFormGroup inlineRadioButton\u003e\n  \u003cInlineRadioButton \n    labelText=\"Inline radio\"\n    name=\"foo\"\n  /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Label**\n\n```jsx\n\u003cLabel\u003efoo\u003c/Label\u003e\n```\n\n**Link**\n\n```jsx\n\u003cLink href=\"#foo\"\u003eBar\u003c/Link\u003e\n```\n\n**Ordered List**\n\n```jsx\n\u003cOrderedList\u003e\n  \u003cListItem\u003eFoo\u003c/ListItem\u003e\n\u003c/OrderedList\u003e\n```\n\n**PasswordInput**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cPasswordInput name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**RadioButton**\n\n```jsx\n\u003cFormGroup radioButton labelText=\"Radio\"\u003e\n  \u003cRadioButton name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Range**\n\n```jsx\n\u003cFormGroup rangeInput labelText=\"Group label\"\u003e\n  \u003cRangeInput name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Select**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cSelect \n    options=[\n      { value: 'chocolate', label: 'Chocolate' },\n      { value: 'strawberry', label: 'Strawberry' },\n      { value: 'vanilla', label: 'Vanilla' }\n    ]\n  /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Select2**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cSelect2 \n    options=[\n      { value: 'chocolate', label: 'Chocolate' },\n      { value: 'strawberry', label: 'Strawberry' },\n      { value: 'vanilla', label: 'Vanilla' }\n    ]\n  /\u003e\n\u003c/FormGroup\u003e\n```\n\n**TextArea**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cTextArea name=\"foo\"\u003e\u003c/TextArea\u003e\n\u003c/FormGroup\u003e\n```\n\n**TextInput**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cTextInput name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**TimeInput**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cTimeInput name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**ToggleSwitch**\n\n```jsx\n\u003cFormGroup labelText=\"Group label\"\u003e\n  \u003cToggleSwitch name=\"foo\" /\u003e\n\u003c/FormGroup\u003e\n```\n\n**Unordered List**\n\n```jsx\n\u003cUnorderedList\u003e\n  \u003cListItem\u003eFoo\u003c/ListItem\u003e\n\u003c/UnorderedList\u003e\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjadu%2Fpulsar-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjadu%2Fpulsar-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjadu%2Fpulsar-react/lists"}