igniteui-cli 15.2.2 → 15.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commands/build.js +7 -12
- package/package.json +4 -4
- package/templates/blazor/igb/projects/ai-config/files/skills/AGENTS.md +0 -5
- package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-components/SKILL.md +2 -0
- package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-components/references/charts.md +7 -35
- package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-components/references/data-display.md +0 -54
- package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-components/references/feedback.md +0 -38
- package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-components/references/form-controls.md +0 -68
- package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-components/references/layout-manager.md +1 -124
- package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-components/references/layout.md +0 -62
- package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-theming/SKILL.md +1 -1
- package/templates/react/igr-ts/projects/_base/files/package.json +1 -0
- package/templates/react/igr-ts/projects/_base/files/src/app/app.tsx +4 -2
- package/templates/react/igr-ts/projects/_base/files/src/setupTests.ts +12 -0
- package/templates/react/igr-ts/projects/_base/files/styles.css +6 -0
- package/templates/react/igr-ts/projects/_base_with_home/files/index.html +2 -1
- package/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/home.tsx +60 -10
- package/templates/react/igr-ts/projects/_base_with_home/files/src/app/home/style.module.css +79 -20
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-components/SKILL.md +0 -8
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-components/reference/CHARTS-GRIDS.md +6 -36
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-components/reference/COMPONENT-CATALOGUE.md +8 -142
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-components/reference/EVENT-HANDLING.md +2 -0
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-customize-theme/SKILL.md +7 -14
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-customize-theme/reference/CSS-THEMING.md +2 -0
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-customize-theme/reference/MCP-SERVER.md +0 -8
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-generate-from-image-design/SKILL.md +2 -2
- package/templates/react/igr-ts/projects/ai-config/files/skills/igniteui-react-generate-from-image-design/reference/component-mapping.md +60 -74
- package/templates/react/igr-ts/projects/empty/index.js +2 -2
- package/templates/react/igr-ts/projects/side-nav/files/src/app/app-routes.tsx +5 -0
- package/templates/react/igr-ts/projects/side-nav/files/src/app/app.css +82 -0
- package/templates/react/igr-ts/projects/side-nav/files/src/app/app.tsx +104 -0
- package/templates/react/igr-ts/projects/side-nav/files/src/app/home/home.tsx +69 -0
- package/templates/react/igr-ts/projects/side-nav/files/src/app/home/style.module.css +105 -0
- package/templates/react/igr-ts/projects/{top-nav → side-nav}/index.d.ts +2 -2
- package/templates/react/igr-ts/projects/{top-nav → side-nav}/index.js +7 -7
- package/templates/react/igr-ts/projects/side-nav-auth/files/index.html +19 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/app-routes.tsx +24 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/app.css +84 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/app.tsx +124 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/AuthContext.tsx +73 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/AuthGuard.tsx +14 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/components/Login.module.css +93 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/components/Login.tsx +69 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/components/LoginBar.module.css +42 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/components/LoginBar.tsx +44 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/components/LoginDialog.module.css +14 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/components/LoginDialog.tsx +49 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/components/Register.module.css +74 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/components/Register.tsx +67 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/models/external-login.ts +10 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/models/login.ts +4 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/models/register-info.ts +6 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/models/user.ts +19 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/pages/Profile.module.css +87 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/pages/Profile.tsx +42 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/pages/RedirectFacebook.tsx +44 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/pages/RedirectGoogle.tsx +40 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/pages/RedirectMicrosoft.tsx +40 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/services/authentication.ts +37 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/services/external-auth-config.ts +44 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/services/externalAuth.ts +272 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/services/fakeBackend.ts +88 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/services/jwtUtil.ts +10 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/services/pkce.ts +29 -0
- package/templates/react/igr-ts/projects/side-nav-auth/files/src/app/authentication/services/userStore.ts +39 -0
- package/templates/react/igr-ts/projects/side-nav-auth/index.d.ts +15 -0
- package/templates/react/igr-ts/projects/side-nav-auth/index.js +46 -0
- package/templates/react/igr-ts/projects/side-nav-mini/files/src/app/app-routes.tsx +5 -0
- package/templates/react/igr-ts/projects/side-nav-mini/files/src/app/app.css +109 -0
- package/templates/react/igr-ts/projects/side-nav-mini/files/src/app/app.test.tsx +20 -0
- package/templates/react/igr-ts/projects/side-nav-mini/files/src/app/app.tsx +81 -0
- package/templates/react/igr-ts/projects/side-nav-mini/files/src/app/home/home.tsx +69 -0
- package/templates/react/igr-ts/projects/side-nav-mini/files/src/app/home/style.module.css +105 -0
- package/templates/react/igr-ts/projects/side-nav-mini/index.d.ts +15 -0
- package/templates/react/igr-ts/projects/side-nav-mini/index.js +46 -0
- package/templates/react/igr-ts/projects/side-nav-mini-auth/files/src/app/app.css +106 -0
- package/templates/react/igr-ts/projects/side-nav-mini-auth/files/src/app/app.tsx +101 -0
- package/templates/react/igr-ts/projects/side-nav-mini-auth/index.d.ts +15 -0
- package/templates/react/igr-ts/projects/side-nav-mini-auth/index.js +50 -0
- package/templates/webcomponents/igc-ts/projects/_base/files/src/app/app.ts +6 -1
- package/templates/webcomponents/igc-ts/projects/_base/files/styles.css +1 -0
- package/templates/webcomponents/igc-ts/projects/_base_with_home/files/index.html +2 -0
- package/templates/webcomponents/igc-ts/projects/_base_with_home/files/src/app/home/home.ts +103 -9
- package/templates/webcomponents/igc-ts/projects/_base_with_home/files/src/assets/wc.png +0 -0
- package/templates/webcomponents/igc-ts/projects/ai-config/files/skills/igniteui-wc-choose-components/SKILL.md +122 -160
- package/templates/webcomponents/igc-ts/projects/ai-config/files/skills/igniteui-wc-customize-component-theme/SKILL.md +83 -311
- package/templates/webcomponents/igc-ts/projects/ai-config/files/skills/igniteui-wc-customize-component-theme/references/mcp-setup.md +69 -0
- package/templates/webcomponents/igc-ts/projects/ai-config/files/skills/igniteui-wc-generate-from-image-design/SKILL.md +4 -1
- package/templates/webcomponents/igc-ts/projects/ai-config/files/skills/igniteui-wc-generate-from-image-design/references/component-mapping.md +60 -61
- package/templates/webcomponents/igc-ts/projects/ai-config/files/skills/igniteui-wc-generate-from-image-design/references/gotchas.md +15 -11
- package/templates/webcomponents/igc-ts/projects/ai-config/files/skills/igniteui-wc-optimize-bundle-size/SKILL.md +23 -274
- package/templates/webcomponents/igc-ts/projects/empty/index.js +1 -1
- package/templates/webcomponents/igc-ts/projects/side-nav/files/index.html +21 -0
- package/templates/webcomponents/igc-ts/projects/side-nav/files/src/app/app-routing.ts +9 -0
- package/templates/webcomponents/igc-ts/projects/side-nav/files/src/app/app.ts +192 -22
- package/templates/webcomponents/igc-ts/projects/side-nav/files/src/app/home/home.ts +175 -0
- package/templates/webcomponents/igc-ts/projects/side-nav/index.js +1 -1
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/index.html +25 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/app-routing.ts +37 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/app.ts +251 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/login-bar/login-bar.ts +124 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/login-dialog/login-dialog.ts +253 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/models/external-login.ts +10 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/models/login.ts +4 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/models/register-info.ts +6 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/models/user.ts +19 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/services/authentication.ts +37 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/services/external-auth-config.ts +44 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/services/externalAuth.ts +272 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/services/fakeBackend.ts +88 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/services/jwtUtil.ts +10 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/services/pkce.ts +29 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/authentication/services/userStore.ts +39 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/profile/profile.ts +142 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/redirect/redirect-facebook.ts +57 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/redirect/redirect-google.ts +53 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/files/src/app/redirect/redirect-microsoft.ts +53 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/index.d.ts +15 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-auth/index.js +46 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-mini/files/src/app/app-routing.ts +13 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-mini/files/src/app/app.ts +238 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-mini/index.d.ts +14 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-mini/index.js +45 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-mini-auth/files/src/app/app.ts +258 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-mini-auth/index.d.ts +15 -0
- package/templates/webcomponents/igc-ts/projects/side-nav-mini-auth/index.js +50 -0
- package/templates/react/igr-ts/projects/top-nav/files/src/app/app.css +0 -62
- package/templates/react/igr-ts/projects/top-nav/files/src/app/app.tsx +0 -18
- package/templates/react/igr-ts/projects/top-nav/files/src/components/navigation-header/index.tsx +0 -19
- /package/templates/react/igr-ts/projects/{top-nav → side-nav}/files/src/app/app.test.tsx +0 -0
package/lib/commands/build.js
CHANGED
|
@@ -45,7 +45,7 @@ const command = {
|
|
|
45
45
|
t: "screenview",
|
|
46
46
|
cd: "Build"
|
|
47
47
|
});
|
|
48
|
-
command.build(
|
|
48
|
+
yield command.build();
|
|
49
49
|
});
|
|
50
50
|
},
|
|
51
51
|
build() {
|
|
@@ -68,20 +68,15 @@ const command = {
|
|
|
68
68
|
});
|
|
69
69
|
yield cli_core_1.PackageManager.installPackages();
|
|
70
70
|
if (config.project.theme.includes(".less") || config.project.theme.includes(".sass")) {
|
|
71
|
-
|
|
72
|
-
const source = path.join(config.project.igniteuiSource, "/css/themes/", config.project.theme.split(".")[0]);
|
|
71
|
+
const source = path.join(config.project.igniteuiSource, "css", "themes", config.project.theme.split(".")[0]);
|
|
73
72
|
const destination = path.join(config.project.sourceRoot, "themes");
|
|
74
73
|
cli_core_1.Util.ensureDirectoryExists(destination);
|
|
75
|
-
if (
|
|
76
|
-
fs.
|
|
77
|
-
|
|
74
|
+
if (cli_core_1.Util.isDirectory(source)) {
|
|
75
|
+
fs.cpSync(source, destination, { recursive: true, force: true });
|
|
76
|
+
}
|
|
77
|
+
else {
|
|
78
|
+
fs.copyFileSync(source, path.join(destination, path.basename(source)));
|
|
78
79
|
}
|
|
79
|
-
const entries = fs.readdirSync(source, { withFileTypes: true });
|
|
80
|
-
entries.forEach((entry) => {
|
|
81
|
-
const sourcePath = path.join(source, entry.name);
|
|
82
|
-
const destinationPath = path.join(destination, entry.name);
|
|
83
|
-
fs.copyFileSync(sourcePath, destinationPath);
|
|
84
|
-
});
|
|
85
80
|
}
|
|
86
81
|
});
|
|
87
82
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "igniteui-cli",
|
|
3
|
-
"version": "15.
|
|
3
|
+
"version": "15.3.0",
|
|
4
4
|
"description": "CLI tool for creating Ignite UI projects",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"CLI",
|
|
@@ -66,9 +66,9 @@
|
|
|
66
66
|
"all": true
|
|
67
67
|
},
|
|
68
68
|
"dependencies": {
|
|
69
|
-
"@igniteui/angular-templates": "~21.2.
|
|
70
|
-
"@igniteui/cli-core": "~15.
|
|
71
|
-
"@igniteui/mcp-server": "~15.
|
|
69
|
+
"@igniteui/angular-templates": "~21.2.1530",
|
|
70
|
+
"@igniteui/cli-core": "~15.3.0",
|
|
71
|
+
"@igniteui/mcp-server": "~15.3.0",
|
|
72
72
|
"@inquirer/prompts": "^7.9.0",
|
|
73
73
|
"chalk": "^5.3.0",
|
|
74
74
|
"glob": "^11.0.0",
|
|
@@ -58,9 +58,4 @@ You are an expert in C#, Blazor, and scalable web application development. You w
|
|
|
58
58
|
## UI Components
|
|
59
59
|
|
|
60
60
|
- Use `IgniteUI.Blazor.Lite`, `IgniteUI.Blazor.GridLite` for general purpose components and light-weight grid, and `IgniteUI.Blazor` (trial version available publicly as `IgniteUI.Blazor.Trial`) for specialized feature-rich grids and charts. If the project already references full `IgniteUI.Blazor`, do not add `IgniteUI.Blazor.Lite` or `IgniteUI.Blazor.GridLite` unless the user explicitly chooses to switch package strategy.
|
|
61
|
-
- Components use the `Igb` prefix (e.g., `IgbGrid`, `IgbCombo`, `IgbDatePicker`).
|
|
62
|
-
- Every component requires module registration in `Program.cs`: `builder.Services.AddIgniteUIBlazor(typeof(IgbGridModule))`.
|
|
63
|
-
- Add `@using IgniteUI.Blazor.Controls` to `_Imports.razor`.
|
|
64
|
-
- Link a theme stylesheet in the host page (e.g., `_content/IgniteUI.Blazor/themes/light/bootstrap.css`).
|
|
65
|
-
- Add the Ignite UI runtime script before the Blazor framework script in the host page: `<script src="_content/IgniteUI.Blazor/app.bundle.js"></script>`. **If this script is missing, web components will not register and the app will render blank or broken - verify this is present in every new project.**
|
|
66
61
|
- If no Ignite UI package is present, add the package that matches the chosen package strategy.
|
package/templates/blazor/igb/projects/ai-config/files/skills/igniteui-blazor-components/SKILL.md
CHANGED
|
@@ -82,6 +82,8 @@ Base your code and explanation exclusively on what you read. If the reference fi
|
|
|
82
82
|
|
|
83
83
|
## Key Blazor-Specific Notes
|
|
84
84
|
|
|
85
|
+
Add the Ignite UI runtime script before the Blazor framework script in the host page: `<script src="_content/IgniteUI.Blazor/app.bundle.js"></script>`. **If this script is missing, web components will not register and the app will render blank or broken. Verify this is present in every new project.**
|
|
86
|
+
|
|
85
87
|
> **AGENT INSTRUCTION - Module Registration**
|
|
86
88
|
>
|
|
87
89
|
> Every Ignite UI for Blazor component **and its sub-components** has a corresponding module. Register **all** modules for every component used on the page in `Program.cs`:
|
|
@@ -32,14 +32,14 @@ This reference gives high-level guidance on when to use some of the chart types,
|
|
|
32
32
|
|---|---|
|
|
33
33
|
| Simple line/area/column/point/spline/waterfall charts with minimal config | `IgbCategoryChart` |
|
|
34
34
|
| Multiple series types on the same chart, custom axes, annotations | `IgbDataChart` |
|
|
35
|
-
| Candlestick / OHLC financial data with range selector | `IgbFinancialChart`
|
|
35
|
+
| Candlestick / OHLC financial data with range selector | `IgbFinancialChart` |
|
|
36
36
|
| Part-to-whole proportions (slices) | `IgbPieChart` |
|
|
37
37
|
| Donut with center label | `IgbDoughnutChart` |
|
|
38
38
|
| Inline sparkline for tables or cards | `IgbSparkline` |
|
|
39
|
-
| Hierarchical part-to-whole data |
|
|
40
|
-
| Geographic points, shapes, map markers |
|
|
41
|
-
| KPI values, ranges, scales, bullet comparisons |
|
|
42
|
-
| Auto-generated dashboard visualization from data |
|
|
39
|
+
| Hierarchical part-to-whole data | `IgbTreemap` |
|
|
40
|
+
| Geographic points, shapes, map markers | `IgbGeographicMap` |
|
|
41
|
+
| KPI values, ranges, scales, bullet comparisons | `IgbLinearGauge` / `IgbRadialGauge` / `IgbBulletGraph` |
|
|
42
|
+
| Auto-generated dashboard visualization from data | `IgbDashboardTile` |
|
|
43
43
|
|
|
44
44
|
---
|
|
45
45
|
|
|
@@ -66,8 +66,6 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbCategoryChartModule));
|
|
|
66
66
|
}
|
|
67
67
|
```
|
|
68
68
|
|
|
69
|
-
Key attributes: `DataSource`, `ChartType` (`CategoryChartType.Line` / `Area` / `Column` / `Point` / `Spline` / `SplineArea` / `StepLine` / `StepArea` / `Waterfall` / `Auto`), `Height`, `Width`, `YAxisTitle`, `XAxisTitle`, `Brushes`, `Outlines`, `MarkerBrushes`, `IsTransitionInEnabled`, `IsHorizontalZoomEnabled`, `IsVerticalZoomEnabled`.
|
|
70
|
-
|
|
71
69
|
> **AGENT INSTRUCTION:** `CategoryChartType.Bar` does **not** exist. For a horizontal bar-style chart, use `CategoryChartType.Column` (vertical) or switch to `IgbDataChart` with `IgbBarSeries` for true horizontal bars. Never generate `ChartType="CategoryChartType.Bar"`.
|
|
72
70
|
|
|
73
71
|
> **AGENT INSTRUCTION:** `IgbCategoryChart` auto-detects which string or date property in the data to use as X-axis labels. To control which data properties are charted, use `IncludedProperties` or `ExcludedProperties` (string arrays).
|
|
@@ -120,10 +118,6 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbDataChartCoreModule), typeof(IgbDat
|
|
|
120
118
|
}
|
|
121
119
|
```
|
|
122
120
|
|
|
123
|
-
Common axis types: `IgbCategoryXAxis`, `IgbNumericXAxis`, `IgbNumericYAxis`, `IgbCategoryYAxis`, `IgbTimeXAxis`, `IgbOrdinalTimeXAxis`.
|
|
124
|
-
|
|
125
|
-
Common series types: `IgbLineSeries`, `IgbAreaSeries`, `IgbColumnSeries`, `IgbBarSeries`, `IgbSplineSeries`, `IgbBubbleSeries`, `IgbScatterSeries`.
|
|
126
|
-
|
|
127
121
|
Every series must reference its axes by matching `Name` and `XAxisName` / `YAxisName`.
|
|
128
122
|
|
|
129
123
|
> **AGENT INSTRUCTION:** `IgbDataChart` requires separate NuGet module registrations for each category of series. Always check `get_doc` to find the exact module names, for example category, scatter, polar, radial, stacked, or financial modules.
|
|
@@ -132,8 +126,6 @@ Every series must reference its axes by matching `Name` and `XAxisName` / `YAxis
|
|
|
132
126
|
|
|
133
127
|
## Financial / Stock Chart
|
|
134
128
|
|
|
135
|
-
> **Docs:** [Financial Chart](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/charts/types/stock-chart)
|
|
136
|
-
|
|
137
129
|
```csharp
|
|
138
130
|
builder.Services.AddIgniteUIBlazor(typeof(IgbFinancialChartModule));
|
|
139
131
|
```
|
|
@@ -150,14 +142,12 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbFinancialChartModule));
|
|
|
150
142
|
}
|
|
151
143
|
```
|
|
152
144
|
|
|
153
|
-
The data source must contain `Open`, `High`, `Low`, `Close`, and `Volume` numeric fields plus a `Date`/`Time` field.
|
|
145
|
+
The data source must contain `Open`, `High`, `Low`, `Close`, and `Volume` numeric fields plus a `Date`/`Time` field.
|
|
154
146
|
|
|
155
147
|
---
|
|
156
148
|
|
|
157
149
|
## Pie Chart
|
|
158
150
|
|
|
159
|
-
> **Docs:** [Pie Chart](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/charts/types/pie-chart)
|
|
160
|
-
|
|
161
151
|
```csharp
|
|
162
152
|
builder.Services.AddIgniteUIBlazor(typeof(IgbPieChartModule), typeof(IgbItemLegendModule));
|
|
163
153
|
```
|
|
@@ -187,16 +177,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbPieChartModule), typeof(IgbItemLege
|
|
|
187
177
|
}
|
|
188
178
|
```
|
|
189
179
|
|
|
190
|
-
Key attributes: `DataSource`, `LabelMemberPath`, `ValueMemberPath`, `RadiusFactor` (0-1), `StartAngle`, `OthersCategoryThreshold`, `OthersCategoryType`, `LegendLabelMemberPath`, `LegendItemTemplate`.
|
|
191
|
-
|
|
192
|
-
Events: `SliceClick`.
|
|
193
|
-
|
|
194
180
|
---
|
|
195
181
|
|
|
196
182
|
## Donut Chart
|
|
197
183
|
|
|
198
|
-
> **Docs:** [Doughnut Chart](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/charts/types/donut-chart)
|
|
199
|
-
|
|
200
184
|
```csharp
|
|
201
185
|
builder.Services.AddIgniteUIBlazor(typeof(IgbDoughnutChartModule), typeof(IgbRingSeriesModule));
|
|
202
186
|
```
|
|
@@ -215,8 +199,6 @@ Supports multiple `IgbRingSeries` for concentric rings.
|
|
|
215
199
|
|
|
216
200
|
## Sparkline
|
|
217
201
|
|
|
218
|
-
> **Docs:** [Sparkline](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/charts/types/sparkline-chart)
|
|
219
|
-
|
|
220
202
|
```csharp
|
|
221
203
|
builder.Services.AddIgniteUIBlazor(typeof(IgbSparklineModule));
|
|
222
204
|
```
|
|
@@ -231,38 +213,28 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbSparklineModule));
|
|
|
231
213
|
LineThickness="2" />
|
|
232
214
|
```
|
|
233
215
|
|
|
234
|
-
Key attributes: `DataSource`, `ValueMemberPath`, `DisplayType` (`SparklineDisplayType.Line` / `Area` / `Column` / `WinLoss`), `Width`, `Height`, `Brush`, `LineThickness`, `MarkerVisibility`, `FirstMarkerVisibility`, `LastMarkerVisibility`, `HighMarkerVisibility`, `LowMarkerVisibility`.
|
|
235
|
-
|
|
236
216
|
---
|
|
237
217
|
|
|
238
218
|
## Treemap
|
|
239
219
|
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
Use Treemap for hierarchical, weighted, part-to-whole data. Always call `get_doc("treemap-chart")` before writing markup because hierarchy binding, member paths, and layout options are component-specific.
|
|
220
|
+
Always call `get_doc("blazor", "treemap-chart")` before writing markup because hierarchy binding, member paths, and layout options are component-specific.
|
|
243
221
|
|
|
244
222
|
---
|
|
245
223
|
|
|
246
224
|
## Geographic Map
|
|
247
225
|
|
|
248
|
-
> **Docs:** [Geographic Map](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/geo-map-type-scatter-area-series)
|
|
249
|
-
|
|
250
226
|
Use Geographic Map for map backgrounds, shape files, geographic points, bubbles, and marker layers. Do not adapt Data Chart axis or series examples to maps unless the Blazor Geographic Map docs explicitly show the same API.
|
|
251
227
|
|
|
252
228
|
---
|
|
253
229
|
|
|
254
230
|
## Gauges
|
|
255
231
|
|
|
256
|
-
> **Docs:** [Radial Gauge](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/radial-gauge), [Linear Gauge](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/linear-gauge), [Bullet Graph](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/bullet-graph)
|
|
257
|
-
|
|
258
232
|
Use gauges for KPI values, ranges, thresholds, progress-style numeric summaries, and bullet comparisons. Select the exact gauge doc first, then use the MCP-documented property names for ranges, labels, scale, and value binding.
|
|
259
233
|
|
|
260
234
|
---
|
|
261
235
|
|
|
262
236
|
## Dashboard Tile
|
|
263
237
|
|
|
264
|
-
> **Docs:** [Dashboard Tile](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/dashboard-tile)
|
|
265
|
-
|
|
266
238
|
Use Dashboard Tile when the requested component should infer or render compact dashboard visualizations from bound data. Verify supported chart modes and binding shape with MCP before producing code.
|
|
267
239
|
|
|
268
240
|
---
|
|
@@ -27,8 +27,6 @@ This reference gives high-level guidance on data display and action components,
|
|
|
27
27
|
|
|
28
28
|
## Button & Button Group
|
|
29
29
|
|
|
30
|
-
> **Docs:** [Button](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/button), [Button Group](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/button-group)
|
|
31
|
-
|
|
32
30
|
```csharp
|
|
33
31
|
builder.Services.AddIgniteUIBlazor(typeof(IgbButtonModule), typeof(IgbButtonGroupModule));
|
|
34
32
|
```
|
|
@@ -47,16 +45,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbButtonModule), typeof(IgbButtonGrou
|
|
|
47
45
|
</IgbButtonGroup>
|
|
48
46
|
```
|
|
49
47
|
|
|
50
|
-
Key attributes on `IgbButton`: `Variant` (`ButtonVariant.Contained` / `Outlined` / `Flat` / `Fab`), `Disabled`, `DisplayType` (`ButtonBaseType.Button` / `Submit` / `Reset`), `Href` (renders as `<a>`).
|
|
51
|
-
|
|
52
|
-
Key attributes on `IgbButtonGroup`: `Selection` (`ButtonGroupSelection.Single` / `SingleRequired` / `Multiple`), `Alignment` (`ContentOrientation.Horizontal` / `ContentOrientation.Vertical`).
|
|
53
|
-
|
|
54
48
|
---
|
|
55
49
|
|
|
56
50
|
## Icon & Icon Button
|
|
57
51
|
|
|
58
|
-
> **Docs:** [Icon](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/layouts/icon), [Icon Button](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/icon-button)
|
|
59
|
-
|
|
60
52
|
```csharp
|
|
61
53
|
builder.Services.AddIgniteUIBlazor(typeof(IgbIconModule), typeof(IgbIconButtonModule));
|
|
62
54
|
```
|
|
@@ -81,16 +73,12 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbIconModule), typeof(IgbIconButtonMo
|
|
|
81
73
|
}
|
|
82
74
|
```
|
|
83
75
|
|
|
84
|
-
Key attributes: `IconName`, `Collection`, `Mirrored` (for RTL). Size is controlled via CSS `--ig-size: var(--ig-size-small | --ig-size-medium | --ig-size-large)`.
|
|
85
|
-
|
|
86
76
|
> **AGENT INSTRUCTION - Icon Registration:** Icons are registered by name+collection. Registration must happen in `OnAfterRenderAsync(bool firstRender)` after calling `EnsureReady()`. Re-use the same collection name across the app for consistency.
|
|
87
77
|
|
|
88
78
|
---
|
|
89
79
|
|
|
90
80
|
## Card
|
|
91
81
|
|
|
92
|
-
> **Docs:** [Card](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/layouts/card)
|
|
93
|
-
|
|
94
82
|
```csharp
|
|
95
83
|
builder.Services.AddIgniteUIBlazor(typeof(IgbCardModule));
|
|
96
84
|
```
|
|
@@ -115,14 +103,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbCardModule));
|
|
|
115
103
|
</IgbCard>
|
|
116
104
|
```
|
|
117
105
|
|
|
118
|
-
Sub-components: `IgbCardMedia`, `IgbCardHeader`, `IgbCardContent`, `IgbCardActions`. Slots on `IgbCardHeader`: `thumbnail`, `title`, `subtitle`. Slots on `IgbCardActions`: `start` (left-aligned actions) and `end` (right-aligned actions).
|
|
119
|
-
|
|
120
106
|
---
|
|
121
107
|
|
|
122
108
|
## Carousel
|
|
123
109
|
|
|
124
|
-
> **Docs:** [Carousel](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/layouts/carousel)
|
|
125
|
-
|
|
126
110
|
```csharp
|
|
127
111
|
builder.Services.AddIgniteUIBlazor(typeof(IgbCarouselModule));
|
|
128
112
|
```
|
|
@@ -144,8 +128,6 @@ Use Carousel for image/content slides, banners, onboarding panels, or media gall
|
|
|
144
128
|
|
|
145
129
|
## List
|
|
146
130
|
|
|
147
|
-
> **Docs:** [List](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/grids/list)
|
|
148
|
-
|
|
149
131
|
```csharp
|
|
150
132
|
builder.Services.AddIgniteUIBlazor(typeof(IgbListModule), typeof(IgbListItemModule), typeof(IgbListHeaderModule));
|
|
151
133
|
```
|
|
@@ -165,14 +147,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbListModule), typeof(IgbListItemModu
|
|
|
165
147
|
</IgbList>
|
|
166
148
|
```
|
|
167
149
|
|
|
168
|
-
Slots on `IgbListItem`: `start`, `end`, `title`, `subtitle`.
|
|
169
|
-
|
|
170
150
|
---
|
|
171
151
|
|
|
172
152
|
## Avatar
|
|
173
153
|
|
|
174
|
-
> **Docs:** [Avatar](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/layouts/avatar)
|
|
175
|
-
|
|
176
154
|
```csharp
|
|
177
155
|
builder.Services.AddIgniteUIBlazor(typeof(IgbAvatarModule));
|
|
178
156
|
```
|
|
@@ -190,14 +168,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbAvatarModule));
|
|
|
190
168
|
</IgbAvatar>
|
|
191
169
|
```
|
|
192
170
|
|
|
193
|
-
Key attributes: `Src`, `Alt`, `Initials`, `Shape` (`AvatarShape.Circle` / `Square` / `Rounded`). Size is controlled via CSS `--ig-size: var(--ig-size-small | --ig-size-medium | --ig-size-large)`.
|
|
194
|
-
|
|
195
171
|
---
|
|
196
172
|
|
|
197
173
|
## Badge
|
|
198
174
|
|
|
199
|
-
> **Docs:** [Badge](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/badge)
|
|
200
|
-
|
|
201
175
|
```csharp
|
|
202
176
|
builder.Services.AddIgniteUIBlazor(typeof(IgbBadgeModule));
|
|
203
177
|
```
|
|
@@ -207,14 +181,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbBadgeModule));
|
|
|
207
181
|
<IgbBadge Variant="@StyleVariant.Danger" Shape="@BadgeShape.Square" />
|
|
208
182
|
```
|
|
209
183
|
|
|
210
|
-
Key attributes: `Variant` (`StyleVariant.Primary` / `Info` / `Success` / `Warning` / `Danger`), `Shape` (`BadgeShape.Rounded` / `Square`), `Outlined`.
|
|
211
|
-
|
|
212
184
|
---
|
|
213
185
|
|
|
214
186
|
## Chip
|
|
215
187
|
|
|
216
|
-
> **Docs:** [Chip](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/chip)
|
|
217
|
-
|
|
218
188
|
```csharp
|
|
219
189
|
builder.Services.AddIgniteUIBlazor(typeof(IgbChipModule));
|
|
220
190
|
```
|
|
@@ -230,18 +200,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbChipModule));
|
|
|
230
200
|
}
|
|
231
201
|
```
|
|
232
202
|
|
|
233
|
-
Key attributes: `Selectable`, `Selected`, `Removable`, `Disabled`, `Variant` (`StyleVariant.Primary` / `Info` / `Success` / `Warning` / `Danger`).
|
|
234
|
-
|
|
235
|
-
Slots: `start`, `end` (prefix/suffix icons).
|
|
236
|
-
|
|
237
|
-
Events: `Select`, `Remove`.
|
|
238
|
-
|
|
239
203
|
---
|
|
240
204
|
|
|
241
205
|
## Circular Progress
|
|
242
206
|
|
|
243
|
-
> **Docs:** [Circular Progress](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/circular-progress)
|
|
244
|
-
|
|
245
207
|
```csharp
|
|
246
208
|
builder.Services.AddIgniteUIBlazor(typeof(IgbCircularProgressModule));
|
|
247
209
|
```
|
|
@@ -256,14 +218,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbCircularProgressModule));
|
|
|
256
218
|
<IgbCircularProgress Indeterminate="true" />
|
|
257
219
|
```
|
|
258
220
|
|
|
259
|
-
Key attributes: `Value`, `Max`, `Indeterminate`, `AnimationDuration`, `Variant` (`StyleVariant.Primary` / `Info` / `Success` / `Warning` / `Danger`).
|
|
260
|
-
|
|
261
221
|
---
|
|
262
222
|
|
|
263
223
|
## Linear Progress
|
|
264
224
|
|
|
265
|
-
> **Docs:** [Linear Progress](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/linear-progress)
|
|
266
|
-
|
|
267
225
|
```csharp
|
|
268
226
|
builder.Services.AddIgniteUIBlazor(typeof(IgbLinearProgressModule));
|
|
269
227
|
```
|
|
@@ -273,14 +231,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbLinearProgressModule));
|
|
|
273
231
|
<IgbLinearProgress Indeterminate="true" />
|
|
274
232
|
```
|
|
275
233
|
|
|
276
|
-
Key attributes: `Value`, `Max`, `Indeterminate`, `Striped`, `Variant`, `LabelAlign` (`LinearProgressLabelAlign.TopStart` / `Top` / `TopEnd` / `BottomStart` / `Bottom` / `BottomEnd`).
|
|
277
|
-
|
|
278
234
|
---
|
|
279
235
|
|
|
280
236
|
## Dropdown
|
|
281
237
|
|
|
282
|
-
> **Docs:** [Dropdown](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/dropdown)
|
|
283
|
-
|
|
284
238
|
```csharp
|
|
285
239
|
builder.Services.AddIgniteUIBlazor(typeof(IgbDropdownModule));
|
|
286
240
|
```
|
|
@@ -298,14 +252,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbDropdownModule));
|
|
|
298
252
|
|
|
299
253
|
```
|
|
300
254
|
|
|
301
|
-
Key attributes on `IgbDropdown`: `Placement` (`PopoverPlacement.*`), `Flip`, `Distance`, `SameWidth`, `KeepOpenOnOutsideClick`, `KeepOpenOnSelect`. Key attributes on `IgbDropdownItem`: `Value`, `Selected`, `Disabled`. Events on `IgbDropdown`: `Opening`, `Opened`, `Closing`, `Closed`, `Change`.
|
|
302
|
-
|
|
303
255
|
---
|
|
304
256
|
|
|
305
257
|
## Tooltip
|
|
306
258
|
|
|
307
|
-
> **Docs:** [Tooltip](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/tooltip)
|
|
308
|
-
|
|
309
259
|
```csharp
|
|
310
260
|
builder.Services.AddIgniteUIBlazor(typeof(IgbTooltipModule));
|
|
311
261
|
```
|
|
@@ -317,14 +267,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbTooltipModule));
|
|
|
317
267
|
</IgbTooltip>
|
|
318
268
|
```
|
|
319
269
|
|
|
320
|
-
Key attributes: `Anchor` (target element ID string), `Placement` (`PopoverPlacement.Top` / `Bottom` / `Left` / `Right` and start/end variants), `ShowDelay`, `HideDelay`, `ShowTriggers`, `HideTriggers`, `Sticky`, `WithArrow`, `Open`.
|
|
321
|
-
|
|
322
270
|
---
|
|
323
271
|
|
|
324
272
|
## Ripple
|
|
325
273
|
|
|
326
|
-
> **Docs:** [Ripple](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/inputs/ripple)
|
|
327
|
-
|
|
328
274
|
```csharp
|
|
329
275
|
builder.Services.AddIgniteUIBlazor(typeof(IgbRippleModule));
|
|
330
276
|
```
|
|
@@ -18,8 +18,6 @@ This reference gives high-level guidance on feedback and overlay components, the
|
|
|
18
18
|
|
|
19
19
|
## Dialog
|
|
20
20
|
|
|
21
|
-
> **Docs:** [Dialog](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/notifications/dialog)
|
|
22
|
-
|
|
23
21
|
```csharp
|
|
24
22
|
builder.Services.AddIgniteUIBlazor(typeof(IgbDialogModule));
|
|
25
23
|
```
|
|
@@ -50,22 +48,10 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbDialogModule));
|
|
|
50
48
|
}
|
|
51
49
|
```
|
|
52
50
|
|
|
53
|
-
Key attributes: `Title`, `KeepOpenOnEscape` (default: `false`; set `true` to prevent closing on ESC), `CloseOnOutsideClick` (default: `false`), `Open`, `HideDefaultAction`.
|
|
54
|
-
|
|
55
|
-
Slots: `footer` (action buttons). The default slot is the dialog body.
|
|
56
|
-
|
|
57
|
-
Methods: `ShowAsync()`, `HideAsync()`, `ToggleAsync()`.
|
|
58
|
-
|
|
59
|
-
Events: `Closing` (cancellable), `Closed`.
|
|
60
|
-
|
|
61
|
-
CSS parts: `base`, `title`, `footer`, `content`.
|
|
62
|
-
|
|
63
51
|
---
|
|
64
52
|
|
|
65
53
|
## Snackbar
|
|
66
54
|
|
|
67
|
-
> **Docs:** [Snackbar](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/notifications/snackbar)
|
|
68
|
-
|
|
69
55
|
```csharp
|
|
70
56
|
builder.Services.AddIgniteUIBlazor(typeof(IgbSnackbarModule));
|
|
71
57
|
```
|
|
@@ -93,22 +79,12 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbSnackbarModule));
|
|
|
93
79
|
}
|
|
94
80
|
```
|
|
95
81
|
|
|
96
|
-
Key attributes: `DisplayTime` (ms, default 4000; 0 keeps it open), `KeepOpen` (overrides `DisplayTime`), `ActionText` (text for the action button).
|
|
97
|
-
|
|
98
|
-
Methods: `ShowAsync()`, `HideAsync()`.
|
|
99
|
-
|
|
100
|
-
Events: `Action` - fires when the action button is clicked.
|
|
101
|
-
|
|
102
|
-
CSS parts: `base`, `message`, `action`, `action-container`.
|
|
103
|
-
|
|
104
82
|
> **TIP - JS interop shortcut:** Add `id="snackbar"` to `IgbSnackbar` and `onclick="snackbar.show()"` to the trigger button as a lightweight alternative when you don't need C# event handling.
|
|
105
83
|
|
|
106
84
|
---
|
|
107
85
|
|
|
108
86
|
## Toast
|
|
109
87
|
|
|
110
|
-
> **Docs:** [Toast](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/notifications/toast)
|
|
111
|
-
|
|
112
88
|
```csharp
|
|
113
89
|
builder.Services.AddIgniteUIBlazor(typeof(IgbToastModule));
|
|
114
90
|
```
|
|
@@ -126,18 +102,12 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbToastModule));
|
|
|
126
102
|
}
|
|
127
103
|
```
|
|
128
104
|
|
|
129
|
-
Key attributes: `DisplayTime` (ms), `KeepOpen`.
|
|
130
|
-
|
|
131
|
-
Methods: `ShowAsync()`, `HideAsync()`.
|
|
132
|
-
|
|
133
105
|
> **AGENT INSTRUCTION - Toast vs Snackbar:** `IgbToast` is a simple auto-dismissing notification with no action button. Use `IgbSnackbar` when you need an action button (e.g., "Undo"). Check the doc via `get_doc` for the current difference, as these components evolve.
|
|
134
106
|
|
|
135
107
|
---
|
|
136
108
|
|
|
137
109
|
## Banner
|
|
138
110
|
|
|
139
|
-
> **Docs:** [Banner](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/notifications/banner)
|
|
140
|
-
|
|
141
111
|
```csharp
|
|
142
112
|
builder.Services.AddIgniteUIBlazor(typeof(IgbBannerModule));
|
|
143
113
|
```
|
|
@@ -158,14 +128,6 @@ builder.Services.AddIgniteUIBlazor(typeof(IgbBannerModule));
|
|
|
158
128
|
}
|
|
159
129
|
```
|
|
160
130
|
|
|
161
|
-
Slots: `prefix` (icon or image), `actions` (buttons shown at the right or bottom). Default slot = message text.
|
|
162
|
-
|
|
163
|
-
Methods: `ShowAsync()`, `HideAsync()`, `ToggleAsync()`.
|
|
164
|
-
|
|
165
|
-
Events: `Closing` (cancellable), `Closed`.
|
|
166
|
-
|
|
167
|
-
CSS parts: `base`, `spacer`, `message`, `illustration`, `content`, `actions`.
|
|
168
|
-
|
|
169
131
|
---
|
|
170
132
|
|
|
171
133
|
## Key Rules
|