Skip to content

Commit 96521e6

Browse files
pavlo-poimanovpavlo-poimanov
authored
Merge branch 'main' into revert-unused-feature
2 parents a64b459 + 75777aa commit 96521e6

File tree

45 files changed

+918
-44
lines changed

Some content is hidden

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

45 files changed

+918
-44
lines changed

‎.npmrc‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
11
max-old-space-size=16384
2+
registry=https://registry.npmjs.org/

‎docs/CHANGELOG.md‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
# Changelog
22

3+
## [19.0.0] 📅 2025-09-30
4+
### Added
5+
- `@nova-ui/bits` | Added colorpicker
6+
- `@nova-ui/bits` | Added nui-tab heading is accessible with keyboard
7+
8+
## [17.0.1] 📅 2025-07-31
9+
### Added
10+
- `@nova-ui/dashboards` | Added ability to globaly disable refreshers
11+
312
## [17.0.0] 📅 2025-04-20
413
### Angular upgrade 17
514

‎packages/bits/demo/src/components/app/app-routing.module.ts‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,10 @@ const appRoutes: Routes = [
6262
path: "chips",
6363
loadChildren: async () => import("../demo/chips/chips.module"),
6464
},
65+
{
66+
path: "color-picker",
67+
loadChildren: async () => import("../demo/color-picker/color-picker.module"),
68+
},
6569
{
6670
path: "combobox",
6771
loadChildren: async () => import("../demo/combobox/combobox.module"),

‎packages/bits/demo/src/components/demo/color-picker/color-picker-basic/color-picker-basic.example.component.html‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<form [formGroup]="myForm">
2+
<nui-color-picker
3+
formControlName="backgroundColor"
4+
[colors]="colors"
5+
>
6+
</nui-color-picker>
7+
</form>
8+
9+
<p class="my-3">You selected: {{ myForm.get('backgroundColor')?.value }}</p>

‎packages/bits/demo/src/components/demo/color-picker/color-picker-basic/color-picker-basic.example.component.ts‎

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
2+
//
3+
// Permission is hereby granted, free of charge, to any person obtaining a copy
4+
// of this software and associated documentation files (the "Software"), to
5+
// deal in the Software without restriction, including without limitation the
6+
// rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
7+
// sell copies of the Software, and to permit persons to whom the Software is
8+
// furnished to do so, subject to the following conditions:
9+
//
10+
// The above copyright notice and this permission notice shall be included in
11+
// all copies or substantial portions of the Software.
12+
//
13+
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14+
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15+
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16+
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17+
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18+
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19+
// THE SOFTWARE.
20+
21+
import { Component } from "@angular/core";
22+
import {
23+
FormBuilder,
24+
FormControl,
25+
FormGroup,
26+
} from "@angular/forms";
27+
28+
const CHART_PALETTE_CS1: string[] = [
29+
"var(--nui-color-bg-secondary)",
30+
"var(--nui-color-chart-one)",
31+
"var(--nui-color-chart-two)",
32+
"var(--nui-color-chart-three)",
33+
"var(--nui-color-chart-four)",
34+
"var(--nui-color-chart-five)",
35+
"var(--nui-color-chart-six)",
36+
"var(--nui-color-chart-seven)",
37+
"var(--nui-color-chart-eight)",
38+
"var(--nui-color-chart-nine)",
39+
"var(--nui-color-chart-ten)",
40+
];
41+
42+
@Component({
43+
selector: "nui-color-picker-basic-example",
44+
templateUrl: "./color-picker-basic.example.component.html",
45+
styles: [],
46+
standalone: false,
47+
})
48+
export class ColorPickerBasicExampleComponent {
49+
public myForm: FormGroup<{ backgroundColor: FormControl<string | null> }>;
50+
public colors: string[] = CHART_PALETTE_CS1;
51+
52+
constructor(
53+
private formBuilder: FormBuilder
54+
) {}
55+
56+
public ngOnInit(): void {
57+
this.myForm = this.formBuilder.group({
58+
backgroundColor: [this.colors[0]],
59+
});
60+
}
61+
}

‎packages/bits/demo/src/components/demo/color-picker/color-picker-docs/color-picker-docs.example.component.html‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<h2>Required Modules</h2>
2+
<ul>
3+
<li>
4+
<code>NuiColorPickerModule</code>
5+
</li>
6+
</ul>
7+
8+
<h2>Basic Usage with color</h2>
9+
<p>
10+
<code>&lt;nui-color-picker&gt;</code> is a basic color picker input component.
11+
Use the <code>colors</code> or <code>colorPalette</code> input to control the
12+
colors which will be displayed. Use the <code>cols</code> input to control the
13+
number of columns in the palette.
14+
</p>
15+
16+
<nui-example-wrapper filenamePrefix="color-picker-basic" exampleTitle="Basic Usage">
17+
<nui-color-picker-basic-example></nui-color-picker-basic-example>
18+
</nui-example-wrapper>
19+
20+
<h2>Usage with <code>IPaletteColor</code></h2>
21+
<p>Interface <code>IPaletteColor</code> will provide additional information about color name in tooltip</p>
22+
<nui-example-wrapper filenamePrefix="color-picker-palette" exampleTitle="Usage with palette">
23+
<nui-color-picker-palette-example></nui-color-picker-palette-example>
24+
</nui-example-wrapper>
25+
26+
27+
<h2>Usage with color select</h2>
28+
<p>Usage with color select will provide name of all colors in palete</p>
29+
<nui-example-wrapper filenamePrefix="color-picker-select" exampleTitle="Usage with color select">
30+
<nui-color-picker-select-example></nui-color-picker-select-example>
31+
</nui-example-wrapper>

‎packages/bits/demo/src/components/demo/color-picker/color-picker-docs/color-picker-docs.example.component.ts‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
2+
//
3+
// Permission is hereby granted, free of charge, to any person obtaining a copy
4+
// of this software and associated documentation files (the "Software"), to
5+
// deal in the Software without restriction, including without limitation the
6+
// rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
7+
// sell copies of the Software, and to permit persons to whom the Software is
8+
// furnished to do so, subject to the following conditions:
9+
//
10+
// The above copyright notice and this permission notice shall be included in
11+
// all copies or substantial portions of the Software.
12+
//
13+
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14+
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15+
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16+
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17+
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18+
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19+
// THE SOFTWARE.
20+
21+
import { Component } from "@angular/core";
22+
23+
@Component({
24+
selector: "nui-color-picker-docs-example",
25+
templateUrl: "./color-picker-docs.example.component.html",
26+
standalone: false,
27+
})
28+
export class ColorPickerExampleComponent {}

‎packages/bits/demo/src/components/demo/color-picker/color-picker-palette/color-picker-palette.example.component.html‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<form [formGroup]="myForm">
2+
<nui-color-picker
3+
formControlName="backgroundColor"
4+
[colorPalette]="colorPalette"
5+
>
6+
</nui-color-picker>
7+
</form>
8+
9+
<p class="my-3">You selected: {{ myForm.get('backgroundColor')?.value }}</p>

‎packages/bits/demo/src/components/demo/color-picker/color-picker-palette/color-picker-palette.example.component.ts‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
2+
//
3+
// Permission is hereby granted, free of charge, to any person obtaining a copy
4+
// of this software and associated documentation files (the "Software"), to
5+
// deal in the Software without restriction, including without limitation the
6+
// rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
7+
// sell copies of the Software, and to permit persons to whom the Software is
8+
// furnished to do so, subject to the following conditions:
9+
//
10+
// The above copyright notice and this permission notice shall be included in
11+
// all copies or substantial portions of the Software.
12+
//
13+
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14+
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15+
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16+
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17+
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18+
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19+
// THE SOFTWARE.
20+
21+
import { Component } from "@angular/core";
22+
import {
23+
FormBuilder,
24+
FormControl,
25+
FormGroup,
26+
} from "@angular/forms";
27+
import { HTML_COLORS, IPaletteColor } from "../../../../../../src/constants/color-picker.constants";
28+
29+
30+
@Component({
31+
selector: "nui-color-picker-palette-example",
32+
templateUrl: "./color-picker-palette.example.component.html",
33+
styles: [],
34+
standalone: false,
35+
})
36+
export class ColorPickerPaletteExampleComponent {
37+
public myForm: FormGroup<{ backgroundColor: FormControl<string | null> }>;
38+
public colorPalette: IPaletteColor[] = Array.from(HTML_COLORS.entries())
39+
.map(([label, color]) => ({label,color}));
40+
41+
42+
constructor(
43+
private formBuilder: FormBuilder
44+
) {}
45+
46+
public ngOnInit(): void {
47+
this.myForm = this.formBuilder.group({
48+
backgroundColor: [""],
49+
});
50+
}
51+
}

‎packages/bits/demo/src/components/demo/color-picker/color-picker-select/color-picker-select.example.component.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<form [formGroup]="myForm">
2+
<nui-color-picker
3+
formControlName="backgroundColor"
4+
[colorPalette]="colorPalette"
5+
[isSelect]="true"
6+
>
7+
</nui-color-picker>
8+
</form>
9+
10+
<p class="my-3">You selected: {{ myForm.get('backgroundColor')?.value.label}} -> {{ myForm.get('backgroundColor')?.value.color}}</p>

0 commit comments

Comments
 (0)