Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(UX-1182): Make a monorepo #260

Merged
merged 40 commits into from
Jan 24, 2025
Merged
Show file tree
Hide file tree
Changes from 32 commits
Commits
Show all changes
40 commits
Select commit Hold shift + click to select a range
9247963
buigs
thelukewalton Jan 10, 2025
6619495
chore: Organise repo
thelukewalton Jan 10, 2025
fddb828
chore(automated): Lint commit and format
invalid-email-address Jan 10, 2025
c85c4e2
revert: some name changes
thelukewalton Jan 13, 2025
67d7401
fixes semantics
thelukewalton Jan 13, 2025
d68d0ee
chore: Monorepo
thelukewalton Jan 13, 2025
eed3491
chores
thelukewalton Jan 20, 2025
7e6c531
chore\: update changelog
thelukewalton Jan 20, 2025
185a0a9
rel-ple
thelukewalton Jan 20, 2025
60a62b7
chore: More test utils to utils package and document
thelukewalton Jan 21, 2025
3c6d880
move test files
thelukewalton Jan 21, 2025
55c1602
docs: add changelog
thelukewalton Jan 21, 2025
1ed282e
fix: Pubspec constriants
thelukewalton Jan 21, 2025
c55f1ea
deps: update package deps
thelukewalton Jan 21, 2025
a5034dc
docs: Update example for zeta_flutter components
thelukewalton Jan 21, 2025
65297ef
docs: Fix import issue for tolerant comparator
thelukewalton Jan 21, 2025
59a5fcb
docs: Update zeta icons docs
thelukewalton Jan 21, 2025
19fe19b
docs: update zeta_flutter package docs
thelukewalton Jan 21, 2025
97b2125
docs: Update docs for theme
thelukewalton Jan 21, 2025
d7dd7dd
docs: update example
thelukewalton Jan 21, 2025
0021219
deps: Remove un used dependencies
thelukewalton Jan 21, 2025
cf7c4f3
chore: Update licenses
thelukewalton Jan 21, 2025
70c803d
docs: Curate documentation for zeta_flutter package
thelukewalton Jan 22, 2025
d835e0c
docs: Curate docs for zeta_flutter_theme package
thelukewalton Jan 22, 2025
0ebfc75
docs: Curate docs for zeta_flutter_utils package
thelukewalton Jan 22, 2025
b18380c
docs: Durate docs for zeta_icons package
thelukewalton Jan 22, 2025
caa60d8
chore: Tidy up repo
thelukewalton Jan 22, 2025
11368e3
docs: Update readmes
thelukewalton Jan 22, 2025
d20d2d9
ci: Adding melos test scripts to test all packages and get coverage r…
thelukewalton Jan 22, 2025
2f95095
chore(automated): Lint commit and format
invalid-email-address Jan 22, 2025
4f775ad
ci: Fix script error
thelukewalton Jan 23, 2025
e0ce457
ci: change coverage directory to .coverage
thelukewalton Jan 23, 2025
8737a88
fix melos maybe?
thelukewalton Jan 23, 2025
2bce493
install lcov on linux
thelukewalton Jan 23, 2025
4f78c9c
chore(automated): Lint commit and format
invalid-email-address Jan 23, 2025
4f44925
change sh to bash
thelukewalton Jan 23, 2025
287f0e0
change sed
thelukewalton Jan 23, 2025
2b86f82
add more logs to lcov script
thelukewalton Jan 24, 2025
2302182
add install lcov step
thelukewalton Jan 24, 2025
8900cc8
chore(automated): Lint commit and format
invalid-email-address Jan 24, 2025
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
7 changes: 5 additions & 2 deletions .github/workflows/pull-request.yml
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
name: CI - Pull Request
on:
pull_request_target:
pull_request:
# pull_request_target:

# Pull Request Runs on the same branch will be cancelled
concurrency:
Expand All @@ -25,10 +26,12 @@ jobs:
- run: |
cd widgetbook
flutter pub get
- uses: ZebraDevs/flutter-code-quality@main
- run: dart pub global activate melos
- uses: ZebraDevs/flutter-code-quality@change-test-command
with:
token: ${{secrets.GITHUB_TOKEN}}
coverage-pass-score: "80"
test-command: melos test

check-secret:
runs-on: ubuntu-latest
Expand Down
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -148,3 +148,4 @@ package-lock.json
/coverage
/.coverage
.fvm/
pubspec_overrides.yaml
4 changes: 2 additions & 2 deletions .pubignore
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ example/widgetbook
appium/
test/
build/
coverage/
coverage.sh
.coverage/
scripts/
example/example.iml
example/assets/
example/lib/
Expand Down
6 changes: 5 additions & 1 deletion .release-please-manifest.json
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
{
".": "0.20.2"
"packages/zeta_flutter": "0.20.1",
"packages/zeta_flutter_theme": "0.20.1",
"packages/zeta_flutter_utils": "0.20.1",
"packages/zeta_icons": "0.20.1",
".": "0.20.1"
}
10 changes: 5 additions & 5 deletions LICENSE-3RD-PARTY
Original file line number Diff line number Diff line change
Expand Up @@ -152,15 +152,15 @@ DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
OTHER DEALINGS IN THE FONT SOFTWARE.


---

## Mike Rydstrom

Applies to:

* platform_is.dart
* universal_platform_vm.dart
* universal_platform_web.dart
- platform_is.dart
- universal_platform_vm.dart
- universal_platform_web.dart

https://gist.github.com/rydmike/1771fe24c050ebfe792fa309371154d8

Expand All @@ -184,4 +184,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
SOFTWARE.
191 changes: 27 additions & 164 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,170 +1,33 @@
# Zeta Flutter
# Zeta Flutter monorepo

Zeta is the new, formal, standardized Zebra Design System based off the successes of ZDS (Zebra Design System).

> 🚧 **Note**: This package is in pre-release, and so many aspects are incomplete.

### Prerequisites

```
dart sdk: ">=3.2.0 <4.0.0"
flutter: ">=3.16.0"
```

## Installation

To install `zeta_flutter`, follow the instructions [here](https://pub.dev/packages/zeta_flutter/install).

## Example

An example app can be found in this repo under `/example`. This shows all components in an example app, as well as a widgetbook instance.

## Previewing the components

To view examples of all the components in the library, you can pull this repo and run either the example app or widgetbook instance.

You can also view the latest release at [Zeta](https://zeta-ds.web.app/) or the latest commits to main [here](https://zeta-flutter-main.web.app/).

## Template

If you are starting a new project using Zeta, we recommend starting with [Zeta Flutter Template](https://github.com/zebradevs/zeta_flutter_template). This template project handles the basic app setup, but these steps can also be followed [below](#Usage).

## Usage

Zeta offers flexibility in theming through its `ZetaProvider` widget. Here's a breakdown of its features:

### Setting the Initial Theme Mode

Zeta allows you to specify an initial theme mode for your app, which can be one of the following:

- `ThemeMode.system`: Adheres to the system's theme.
- `ThemeMode.light`: Uses the light theme mode.
- `ThemeMode.dark`: Uses the dark theme mode.

By default, the theme mode is set to `ThemeMode.system`.

```dart
initialThemeMode: ThemeMode.system
```

### Providing Initial Theme Data

You can provide the initial theme data for the app which contains all the theming information. If you don't specify one, it will default to a basic instance of `ZetaThemeData`.

```dart
initialThemeData: ZetaThemeData()
```

### Setting the Initial Contrast

Zeta also lets you define the initial contrast setting for your app. By default, it's set to `ZetaContrast.aa`.

```dart
initialContrast: ZetaContrast.aa
```

### Building Your App with Zeta Theming

The `builder` function is used to construct the widget tree with the provided theming information. This function is expected to receive a `BuildContext`, `ZetaThemeData`, and `ThemeMode` as arguments, and it should return a `Widget`.

```dart
builder: (context, themeData, themeMode) {
// Your app's widget tree here
}
```

### Constructing the ZetaProvider

To tie everything together, use the `ZetaProvider` constructor. The `builder` argument is mandatory, while the others are optional but allow you to set initial values:

```dart
@override
Widget build(BuildContext context) {
return ZetaProvider(
builder: (context, themeData, themeMode) {
final dark = themeData.colorsDark.toScheme();
final light = themeData.colorsLight.toScheme();
return MaterialApp.router(
routerConfig: router,
themeMode: themeMode,
theme: ThemeData(
fontFamily: themeData.fontFamily,
scaffoldBackgroundColor: light.surfaceTertiary,
colorScheme: light,
),
darkTheme: ThemeData(
fontFamily: themeData.fontFamily,
scaffoldBackgroundColor: dark.surfaceTertiary,
colorScheme: dark,
),
);
},
);
}
```

### Customization

#### Creating custom themes

Custom themes can be made by creating `ZetaCustomTheme` objects. `ZetaCustomTheme` can be constructed by passing in a primary or secondary color and, optionally, their dark variants:

```dart
ZetaCustomTheme(
id: 'custom-theme-red',
primary: Colors.red,
primaryDark : // Dark variant here,
secondary: Colors.blue,
secondaryDark: // Dark variant here,
)
```

Color arguments can be of type `ZetaColorSwatch`, `MaterialColor`, or `Color`. If only a `Color` is provided, Zeta will generate a `ZetaColorSwatch`. <b>To have control over every shade of a given color, we reccomend providing either a `ZetaColorSwatch` or a `MaterialColor`.</b>

If a dark variant of a color is not provided, Zeta generate one by inverting the corresponding color swatch.

#### Adding custom themes

Once you have defined the custom themes for your app, give them to the ZetaProvider by passing them through the construtor. You can also initialize the custom theme by setting the `initialTheme` argument to the id of the desired theme.

```dart
ZetaProvider(
initialTheme: 'custom-theme-red'
customThemes: [
ZetaCustomTheme(
id: 'custom-theme-red',
primary: Colors.red,
secondary: Colors.purple
),
ZetaCustomTheme(
id: 'custom-theme-purple',
primary: Colors.purple,
secondary: Colors.green
),
]
)
```

You can also get and set the custom themes via the `ZetaProvider`:

`ZetaProvider.of(context).customThemes`
`ZetaProvider.of(context).setCustomThemes(newCustomThemes)`

#### Changing the custom theme

To change the custom theme, call the `updateCustomTheme` function on `ZetaProvider` with an id corresponding to a `ZetaCustomTheme` object:

`ZetaProvider.of(context).updateCustomTheme('custom-theme-purple')`

If the id provided does not correspond to a given theme, Zeta will fall back to its default theme.

You can fetch the id of the currently applied custom theme via the `Zeta` object:

`Zeta.of(context).customThemeId`

This will return null if no custom theme is in use.

With these configurations, Zeta makes it easy to achieve consistent theming throughout your Flutter application.
This repo contains the source code for all Zeta Flutter packages.

## Packages

<table>
<tr>
<th>Code</th>
<th>Link</th>
</tr>
<tr>
<td><a href='https://github.com/ZebraDevs/zeta_flutter/tree/develop/packages/zeta_flutter'>zeta_flutter (components)</a></td>
<td><a href='https://pub.dev/packages/zeta_flutter'>pub.dev</a></td>
</tr>
<tr>
<td><a href='https://github.com/ZebraDevs/zeta_flutter/tree/develop/packages/zeta_flutter_theme'>zeta_flutter_theme</a></td>
<td><a href='https://pub.dev/packages/zeta_flutter_theme'>pub.dev</a></td>
</tr>
<tr>
<td><a href='https://github.com/ZebraDevs/zeta_flutter/tree/develop/packages/zeta_flutter_utils'>zeta_flutter_theme</a></td>
<td><a href='https://pub.dev/packages/zeta_flutter_utils'>pub.dev</a></td>
</tr>
<tr>
<td><a href='https://github.com/ZebraDevs/zeta_flutter/tree/develop/packages/zeta_icons'>zeta_flutter_icons</a></td>
<td><a href='https://pub.dev/packages/zeta_icons'>pub.dev</a></td>
</tr>
</table>

## Licensing

Expand Down
File renamed without changes.
3 changes: 1 addition & 2 deletions analysis_options.yaml
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
# include: package:zds_analysis/analysis_options_lib_all_files.yaml
include: package:zds_analysis/analysis_options_lib.yaml
include: package:zds_analysis/analysis_options_lib_all_files.yaml
18 changes: 0 additions & 18 deletions dartdoc_options.yaml

This file was deleted.

5 changes: 0 additions & 5 deletions doc/Assets.md

This file was deleted.

3 changes: 0 additions & 3 deletions doc/Components.md

This file was deleted.

3 changes: 0 additions & 3 deletions doc/Theme.md

This file was deleted.

3 changes: 0 additions & 3 deletions doc/Utils.md

This file was deleted.

49 changes: 0 additions & 49 deletions example/example.md

This file was deleted.

2 changes: 0 additions & 2 deletions example/lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,6 @@ class ZetaExample extends StatelessWidget {
@override
Widget build(BuildContext context) {
return ZetaProvider(
// initialContrast: ZetaContrast.aa,
// initialThemeMode: ThemeMode.system,
customThemes: [
ZetaCustomTheme(
id: 'teal',
Expand Down
2 changes: 1 addition & 1 deletion example/lib/pages/assets/icons_example.dart
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ class _IconsExampleState extends State<IconsExample> {
runSpacing: Zeta.of(context).spacing.xl_4,
children: icons.entries.map(
(e) {
final nameArr = (e.key.split('_')).join(' ').capitalize();
final nameArr = (e.key.split('_')).join(' ').capitalize;
return Container(
width: 120,
height: 120,
Expand Down
2 changes: 1 addition & 1 deletion example/lib/pages/theme/radius_example.dart
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ class RadiusExample extends StatelessWidget {
),
padding: EdgeInsets.all(Zeta.of(context).spacing.large),
child: Text(
rad.radiusString.split('.').last.capitalize(),
rad.radiusString.split('.').last.capitalize,
style: ZetaTextStyles.titleMedium.apply(
color: Zeta.of(context).colors.mainDefault,
fontStyle: FontStyle.normal,
Expand Down
Loading