{"id":19509864,"url":"https://github.com/steamclock/nicecomponents","last_synced_at":"2025-12-11T22:52:24.106Z","repository":{"id":38188109,"uuid":"329440675","full_name":"steamclock/niceComponents","owner":"steamclock","description":"A collection of useful UI components for SwiftUI","archived":false,"fork":false,"pushed_at":"2025-02-28T17:19:05.000Z","size":1255,"stargazers_count":20,"open_issues_count":18,"forks_count":1,"subscribers_count":10,"default_branch":"main","last_synced_at":"2025-03-28T11:01:39.985Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Swift","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/steamclock.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","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":"2021-01-13T21:54:48.000Z","updated_at":"2025-02-28T17:12:50.000Z","dependencies_parsed_at":"2023-11-14T21:31:40.837Z","dependency_job_id":"aa053d26-b25e-4db1-aaad-79bbc1e3168d","html_url":"https://github.com/steamclock/niceComponents","commit_stats":null,"previous_names":["steamclock/nicecomponents","steamclock/nice_components"],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamclock%2FniceComponents","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamclock%2FniceComponents/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamclock%2FniceComponents/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamclock%2FniceComponents/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/steamclock","download_url":"https://codeload.github.com/steamclock/niceComponents/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250926834,"owners_count":21509045,"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":[],"created_at":"2024-11-10T23:13:37.609Z","updated_at":"2025-12-11T22:52:24.051Z","avatar_url":"https://github.com/steamclock.png","language":"Swift","funding_links":[],"categories":[],"sub_categories":[],"readme":"![NiceComponents](nice_components.png)\n\nNiceComponents is a simple library with some nice looking SwiftUI components to get your next project started. 🚀\n\nJumpstart your prototypes with some sensible default components, then come back later and customize the look and feel of your app exactly how you want – all in one place.\n\n![](preview.png)\n\n## Usage\n\n### Example Project\n\nYou can clone and run the example project to see examples of all the default components, plus a little sample of a more customized sign in screen, and demos of how to customize each component.\n\n### Prototyping\n\nWhen you're just starting out with your project, you should be able to get some reasonable results by just dropping in our components straight out of the box.\n\nNiceComponents are made up of a couple fundamental pieces:\n- **Components** are the Views you'll construct and the bits that your users will see, like `NiceButton` or `NiceText`.\n- **Styles** are the set of colors, fonts, etc that describe a specific components, like a Primary button or some Detail text.\n- **Themes** are interfaces that describe a set of colors, fonts, etc needed to describe a component.\n\n```swift\nimport NiceComponents\n\nstruct DemoView: View {\n    var body: some View {\n        NiceText(\"I'm a nice big title!\", style: .screenTitle)\n        \n        NiceButton(\"And I'm a nice little button\", style: .primary) {\n            doTheThing()\n        }\n    }\n}\n```\n\nWe provide the following text and button styles to get you started:\n\n![](textAndButtonStyles.jpg)\n\n### Customizing Components\n\nOnce you're ready to start putting your own touch on components, you've got a couple options, based on how much you'd like to change.\n\n#### Setting a Global Config at Startup\n\nIf you'd like to change _all_ instances of a component, or change global variables like your ColorTheme or ColorStyle we recommend creating a custom config that you can set when your app first starts. Note that you once you've set this config once, you'll be unable to update it.\n\nIn the case of multiple customizations applying to the same component, the _most specific_ one will take precedence.\n\n```swift\nimport NiceComponents\n\n@main struct ExampleApp: App {\n   init() {\n        var newConfig = Config()\n       \n       newConfig.bodyTextStyle = NiceTextStyle(\n           color: Color(hex: \"FFA71A\"),\n           size: 16\n       )\n       Config.current = newConfig\n   }\n}\n```\n\n#### Extending an Existing Component\n\nIf you want to create a new component, or extend an existing one, all you need to do is add a new Style:\n\n```swift\nextension NiceTextStyle {\n    static var bodyBold: NiceTextStyle {\n        Config.current.bodyTextStyle\n            .with(weight: .bold)\n    }\n}\n\n```\n\n#### Customizing a Single Instance of a Component\n\nIf you just need to change something for a one-off UI element, each Style comes with a handy mutator function to allow you to customize it.\n\n```swift\n    NiceText(\n        \"Customize it with `with`\", \n        style: .body.with(weight: .semibold)\n    )\n\n    NiceText(\n        \"Customize it with `with`\", \n        style: NiceTextStyle(\n            color: Color(hex: \"FFA71A\")\n            with: .body,\n            font: \"Impact\",\n            size: 20\n        )\n    )\n}\n\n```\n\n### Setting a Color Palette\n\nIn addition to being able to customize or extend each of the pre-set styles provided by NiceComponents, we provide two ways to change your color palette.\n\nYou can set a ColorTheme and/or ColorStyle when you create your custom Config by passing them into the constructor.\n\n\n#### ColorTheme\n\nOf the two options, ColorTheme is the more general option, allowing you to change colors that are applied to a variety of different components and places at once. The naming and usage here is indluenced heavily by the [wonderful Material Design palettes](https://m2.material.io/design/color/the-color-system.html).\n\nColorTheme takes the colors declared in your asset catalog and gives them a semantic meaning not tied to specific UI elements. \n\nWe recommend declaring your colors in an Asset Catalog and pulling them in from there to make supporting light and dark mode a breeze. \n\n#### ColorStyle\n\nColorStyle describes the colors applied to all components by default semantically, changes here will take precedence over changes made to a ColorTheme, though will default to your ColorTheme if not specified.\n\nIn most cases, you'll probably be fine just changing your ColorTheme and allowing those changes to cascade into the different UI elements, but if you need a little more control over what colors things like specific buttons are, this is your place to do it.\n\n#### Customizing your TextStyle\n\nIf you want to globally change the font in your app, you can change the Config's textStyle, and all the preset styles will respect your new styling.\n\nNote that only `bodyText` will use the default `textStyle` size and weight.\n\n\n### Installation\n\nNiceComponents is available through **[Swift Package Manager](https://swift.org/package-manager/)**. To install it, follow these steps:\n\n1. In Xcode, click **File**, then **Swift Package Manager**, then **Add Package Dependency**\n2. Choose your project\n3. Enter this URL in the search bar `git@github.com:steamclock/niceComponents.git`\n\n#### Building with CI\n\nSince NiceComponents uses some macros to automatically generate initializers for some classes, you may need to add `-skipMacroValidation` to your `xcodebuild` call to make it work.\n\n### Migrating from Nice Components 1.0\n\nGiven the size and scope of changes from Nice Components 1 to 2, migrating may be a somewhat big process. The good news, a lot of that work can be done with good ol' Find and Replace.\n\nTo migrate, you'll want to:\n1. Change any references to Components like PrimaryButton, BodyText, etc to use NiceText and NiceButton\n2. Change any custom Components you've created into custom styles, extending either NiceTextStyle or NiceButtonStyle\n3. Update your Config to use the new NiceButtonStyle and NiceTextStyles.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsteamclock%2Fnicecomponents","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsteamclock%2Fnicecomponents","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsteamclock%2Fnicecomponents/lists"}