Skip to content

Commit 3f26098

Browse files
author
Kiwi
committed
chore: 🤖 (setup) create initial files for the library starter
0 parents  commit 3f26098

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

44 files changed

+48223
-0
lines changed

Diff for: ‎.DS_Store

6 KB
Binary file not shown.

Diff for: ‎CHANGELOG.md

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
## [1.0.2](https://github.com/kreuzerk/ng-if-responsive/compare/v1.0.1...v1.0.2) (2022-12-20)
2+
3+
### Bug Fixes
4+
5+
- 🐛 (README) copy README into dist ([af0ccf4](https://github.com/kreuzerk/ng-if-responsive/commit/af0ccf466d80f2df45d9f0789c2e80d53a575073))
6+
7+
## [1.0.1](https://github.com/kreuzerk/ng-if-responsive/compare/v1.0.0...v1.0.1) (2022-12-20)
8+
9+
### Bug Fixes
10+
11+
- 🐛 (showcase) add missing padding ([5f89d80](https://github.com/kreuzerk/ng-if-responsive/commit/5f89d8018a080b46ed5dcc5fce5471c399972385))
12+
- 🐛 (showcase) remove trailing comma and trigger release ([eec4bbc](https://github.com/kreuzerk/ng-if-responsive/commit/eec4bbc4111ce09cb4cb6d2e2c36a7095c9ea7c6))

Diff for: ‎CODE_OF_CONDUCT.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
Contributor Covenant Code of Conduct Our Pledge In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.
2+
3+
Our Standards Examples of behavior that contributes to creating a positive environment include:
4+
5+
Using welcoming and inclusive language Being respectful of differing viewpoints and experiences Gracefully accepting constructive criticism Focusing on what is best for the community Showing empathy towards other community members Examples of unacceptable behavior by participants include:
6+
7+
The use of sexualized language or imagery and unwelcome sexual attention or advances Trolling, insulting/derogatory comments, and personal or political attacks Public or private harassment Publishing others' private information, such as a physical or electronic address, without explicit permission Other conduct which could reasonably be considered inappropriate in a professional setting Our Responsibilities Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
8+
9+
Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
10+
11+
Scope This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.
12+
13+
Enforcement Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at [email protected]. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
14+
15+
Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
16+
17+
Attribution This Code of Conduct is adapted from the Contributor Covenant, version 1.4, available at http://contributor-covenant.org/version/1/4

Diff for: ‎LICENSE.md

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2018
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

Diff for: ‎README.md

+106
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
# ngIfResponsive
2+
3+
<!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
4+
5+
[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors-)
6+
![!Codecov](https://img.shields.io/codecov/c/github/kreuzerk/ng-if-responsive)
7+
8+
<!-- ALL-CONTRIBUTORS-BADGE:END -->
9+
10+
> A simple project that provides helpers to render or remove elements from the DOM based on screen size. Its like `ngIf`, just responsive.
11+
12+
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
13+
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
14+
15+
- [Demo](#demo)
16+
- [Installation](#installation)
17+
- [Usage](#usage)
18+
- [Import](#import)
19+
- [Usage in HTML](#usage-in-html)
20+
- [Pixel breakpoint](#pixel-breakpoint)
21+
- [Configuration usage](#configuration-usage)
22+
- [Contributors ✨](#contributors-)
23+
24+
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
25+
26+
## Demo
27+
28+
Checkout a running demo application at https://kreuzerk.github.io/ng-if-responsive/.
29+
30+
## Installation
31+
32+
To install this project run the following command in a terminal of your choice.
33+
34+
```bash
35+
npm install ng-if-responsive
36+
```
37+
38+
## Usage
39+
40+
The project currently provides two directives. A `ngIfResponsiveRender` and a `ngIfResponsiveRemove` directive. As the name indicates the remove directive is used to remove some elements on certain screen sizes and the render directive is used to render elements on certain screen sizes.
41+
42+
### Import
43+
44+
Both directives are exported as standalone components and can therefore be added to the `imports` array in your module or standalone component.
45+
46+
```typescript
47+
imports: [NgIfResponsiveRemoveDirective, NgIfResponsiveRenderDirective];
48+
```
49+
50+
### Usage in HTML
51+
52+
Both directives can be applied as attribute directives on any given DOM element. Each directive accepts the breakpoint as input. When using the directive there are two options, you can either pass in the width of the screen size in Pixel as a number or you can use a custom key as breakpoint identifier (this has to be configured, via Injection token, see below)
53+
54+
#### Pixel breakpoint
55+
56+
To use a picel as breakpoint you can use the directive in the following way:
57+
58+
```html
59+
<h3 *ngIfResponsiveRemove="640">Hide on screens bigger than sm</h3>
60+
```
61+
62+
#### Configuration usage
63+
64+
If you want to use customized breakpoint identifiers you can define them via the ``RESPONSIVE_NG_IF_CONFIG` injection token. A example configuration inside your `AppModule` or `AppComponent` could look like this.
65+
66+
```typescript
67+
providers: [
68+
{
69+
provide: RESPONSIVE_NG_IF_CONFIG,
70+
useValue: {
71+
sm: 640,
72+
md: 769,
73+
lg: 1024,
74+
xl: 1080,
75+
},
76+
},
77+
];
78+
```
79+
80+
Based on the configuration you can then go ahead and pass one of the keys (`sm`, `md`, `lg`, `xl`) to the directive.
81+
82+
```html
83+
<h3 *ngIfResponsiveRemove="'sm'">Hide on screens bigger than sm</h3>
84+
```
85+
86+
## Contributors ✨
87+
88+
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
89+
90+
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
91+
<!-- prettier-ignore-start -->
92+
<!-- markdownlint-disable -->
93+
<table>
94+
<tbody>
95+
<tr>
96+
<td align="center" valign="top" width="14.28%"><a href="https://medium.com/@kevinkreuzer"><img src="https://avatars.githubusercontent.com/u/5468954?v=4?s=100" width="100px;" alt="Kevin Kreuzer"/><br /><sub><b>Kevin Kreuzer</b></sub></a><br /><a href="https://github.com/kreuzerk/ngIfResponsive/commits?author=kreuzerk" title="Code">💻</a></td>
97+
</tr>
98+
</tbody>
99+
</table>
100+
101+
<!-- markdownlint-restore -->
102+
<!-- prettier-ignore-end -->
103+
104+
<!-- ALL-CONTRIBUTORS-LIST:END -->
105+
106+
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!

Diff for: ‎angular.json

+135
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"version": 1,
4+
"newProjectRoot": "projects",
5+
"projects": {
6+
"ngIfResponsive": {
7+
"projectType": "library",
8+
"root": "projects/ng-if-responsive",
9+
"sourceRoot": "projects/ng-if-responsive/src",
10+
"prefix": "lib",
11+
"architect": {
12+
"build": {
13+
"builder": "@angular-devkit/build-angular:ng-packagr",
14+
"options": {
15+
"project": "projects/ng-if-responsive/ng-package.json"
16+
},
17+
"configurations": {
18+
"production": {
19+
"tsConfig": "projects/ng-if-responsive/tsconfig.lib.prod.json"
20+
},
21+
"development": {
22+
"tsConfig": "projects/ng-if-responsive/tsconfig.lib.json"
23+
}
24+
},
25+
"defaultConfiguration": "production"
26+
},
27+
"test": {
28+
"builder": "@angular-builders/jest:run",
29+
"options": {
30+
"tsConfig": "projects/ng-if-responsive/tsconfig.spec.json"
31+
}
32+
}
33+
}
34+
},
35+
"ngIfResponsiveShowcase": {
36+
"projectType": "application",
37+
"schematics": {
38+
"@schematics/angular:component": {
39+
"style": "scss"
40+
}
41+
},
42+
"root": "projects/ng-if-responsive-showcase",
43+
"sourceRoot": "projects/ng-if-responsive-showcase/src",
44+
"prefix": "app",
45+
"architect": {
46+
"build": {
47+
"builder": "@angular-devkit/build-angular:browser",
48+
"options": {
49+
"outputPath": "dist/ng-if-responsive-showcase",
50+
"index": "projects/ng-if-responsive-showcase/src/index.html",
51+
"main": "projects/ng-if-responsive-showcase/src/main.ts",
52+
"polyfills": "projects/ng-if-responsive-showcase/src/polyfills.ts",
53+
"tsConfig": "projects/ng-if-responsive-showcase/tsconfig.app.json",
54+
"inlineStyleLanguage": "scss",
55+
"assets": [
56+
"projects/ng-if-responsive-showcase/src/favicon.ico",
57+
"projects/ng-if-responsive-showcase/src/assets"
58+
],
59+
"styles": [
60+
"projects/ng-if-responsive-showcase/src/styles.scss"
61+
],
62+
"scripts": []
63+
},
64+
"configurations": {
65+
"production": {
66+
"budgets": [
67+
{
68+
"type": "initial",
69+
"maximumWarning": "500kb",
70+
"maximumError": "1mb"
71+
},
72+
{
73+
"type": "anyComponentStyle",
74+
"maximumWarning": "2kb",
75+
"maximumError": "4kb"
76+
}
77+
],
78+
"fileReplacements": [
79+
{
80+
"replace": "projects/ng-if-responsive-showcase/src/environments/environment.ts",
81+
"with": "projects/ng-if-responsive-showcase/src/environments/environment.prod.ts"
82+
}
83+
],
84+
"outputHashing": "all"
85+
},
86+
"development": {
87+
"buildOptimizer": false,
88+
"optimization": false,
89+
"vendorChunk": true,
90+
"extractLicenses": false,
91+
"sourceMap": true,
92+
"namedChunks": true
93+
}
94+
},
95+
"defaultConfiguration": "production"
96+
},
97+
"serve": {
98+
"builder": "@angular-devkit/build-angular:dev-server",
99+
"configurations": {
100+
"production": {
101+
"browserTarget": "ngIfResponsiveShowcase:build:production"
102+
},
103+
"development": {
104+
"browserTarget": "ngIfResponsiveShowcase:build:development"
105+
}
106+
},
107+
"defaultConfiguration": "development"
108+
},
109+
"extract-i18n": {
110+
"builder": "@angular-devkit/build-angular:extract-i18n",
111+
"options": {
112+
"browserTarget": "ngIfResponsiveShowcase:build"
113+
}
114+
},
115+
"test": {
116+
"builder": "@angular-builders/jest:run",
117+
"options": {
118+
"tsConfig": "projects/ng-if-responsive-showcase/tsconfig.spec.json",
119+
"assets": [
120+
"projects/ng-if-responsive-showcase/src/favicon.ico",
121+
"projects/ng-if-responsive-showcase/src/assets"
122+
],
123+
"styles": [
124+
"projects/ng-if-responsive-showcase/src/styles.scss"
125+
],
126+
"scripts": []
127+
}
128+
}
129+
}
130+
}
131+
},
132+
"cli": {
133+
"analytics": false
134+
}
135+
}

Diff for: ‎jest.config.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports = {
2+
preset: 'jest-preset-angular',
3+
setupFilesAfterEnv: ['<rootDir>../../setup-jest.ts'],
4+
globalSetup: 'jest-preset-angular/global-setup',
5+
};
6+
7+

0 commit comments

Comments
 (0)