diff --git a/browser/IgBlazorSamples.Client/wwwroot/index.html b/browser/IgBlazorSamples.Client/wwwroot/index.html index 7e37200185..4c928a931b 100644 --- a/browser/IgBlazorSamples.Client/wwwroot/index.html +++ b/browser/IgBlazorSamples.Client/wwwroot/index.html @@ -197,6 +197,7 @@ + @@ -241,6 +242,7 @@ + diff --git a/samples/layouts/carousel/animations/App.razor b/samples/layouts/carousel/animations/App.razor index ccd6c00e16..5bcc43ef65 100644 --- a/samples/layouts/carousel/animations/App.razor +++ b/samples/layouts/carousel/animations/App.razor @@ -1,58 +1,207 @@ @using IgniteUI.Blazor.Controls -
- Animation type + Animation Slide Fade @@ -60,95 +209,85 @@ igc-card-header {
- Vertical alignment + Vertical
- + + -
- - - Ignite UI for Angular - - -

30+ Material-based Angular components to code speedy web apps faster.

- - - - - - - Visit Page - - - -
+
+
+ 01 +

Slide transition

+

Moves content horizontally or vertically to preserve directional context.

+
Best for sequential browsing320ms
+
+ +
-
- - - Ignite UI for Javascript - - -

A complete JavaScript UI library empowering you to build data-rich responsive web apps.

- - - - - - - Visit Page - - - -
+
+
+ 02 +

Fade transition

+

Cross-fades between slides when the relationship between items is looser.

+
Best for featured content240ms
+
+ +
-
- - - Ultimate UI for ASP.NET - - -

Build full-featured business apps with the most versatile set of ASP.NET AJAX UI controls.

- - - - - - - Visit Page - - - -
+
+
+ 03 +

No transition

+

Updates the active slide immediately for reduced motion or dense workflows.

+
Best for direct state changes0ms
+
+ +
@code { - private IgbCarousel carouselRef; + private bool isCarouselVertical; + private bool isOrientationChanging; + private int orientationChangeVersion; + + private string CarouselCssClass => isOrientationChanging ? "is-orientation-changing" : string.Empty; private void OnSelectChange(IgbSelectItemComponentEventArgs args) { - switch (args.Detail.Value) + carouselRef.AnimationType = args.Detail.Value switch { - case "slide": - this.carouselRef.AnimationType = HorizontalTransitionAnimation.Slide; - break; - case "fade": - this.carouselRef.AnimationType = HorizontalTransitionAnimation.Fade; - break; - default: - this.carouselRef.AnimationType = HorizontalTransitionAnimation.None; - break; - } + "slide" => HorizontalTransitionAnimation.Slide, + "fade" => HorizontalTransitionAnimation.Fade, + _ => HorizontalTransitionAnimation.None + }; } - private void OnSwitchChange(IgbCheckboxChangeEventArgs args) + private async Task OnSwitchChange(IgbCheckboxChangeEventArgs args) { - this.carouselRef.Vertical = args.Detail.Checked; + var changeVersion = ++orientationChangeVersion; + isOrientationChanging = true; + await InvokeAsync(StateHasChanged); + + await Task.Delay(120); + if (changeVersion != orientationChangeVersion) + { + return; + } + + isCarouselVertical = args.Detail.Checked; + await InvokeAsync(StateHasChanged); + + await Task.Delay(16); + if (changeVersion == orientationChangeVersion) + { + isOrientationChanging = false; + await InvokeAsync(StateHasChanged); + } } -} \ No newline at end of file +} diff --git a/samples/layouts/carousel/animations/Program.cs b/samples/layouts/carousel/animations/Program.cs index 17facee3e2..88a05ac909 100644 --- a/samples/layouts/carousel/animations/Program.cs +++ b/samples/layouts/carousel/animations/Program.cs @@ -21,8 +21,6 @@ public static async Task Main(string[] args) // registering Ignite UI modules builder.Services.AddIgniteUIBlazor( typeof(IgbCarouselModule), - typeof(IgbButtonModule), - typeof(IgbCardModule), typeof(IgbSwitchModule), typeof(IgbSelectModule) ); diff --git a/samples/layouts/carousel/components/App.razor b/samples/layouts/carousel/components/App.razor index 555662bab8..935e85de59 100644 --- a/samples/layouts/carousel/components/App.razor +++ b/samples/layouts/carousel/components/App.razor @@ -1,81 +1,431 @@ @using IgniteUI.Blazor.Controls -
- -
- -
- - - - - + +
+ +
+ Featured route +

Coastal weekend

+

Browse curated travel ideas and search directly from the active slide.

+
+ + - Sign In +
+ 3 stops + Sea view + Weekend +
+ Explore -
+ + - -
- -
- - + +
+
+
+ City guide +

Museum night pass

+

Reserve a late gallery visit and keep the event details visible in the active slide.

+
+
+ +
6:30 PM - 10:00 PMNorth wing galleries
+
+ Send event reminder + Notify Me +
+ +
+ + +
+ +
+ Seasonal offer +

Resort day access

+

Build a compact offer configuration that lets users review inclusions before applying a code.

+
+
+
Day pass$89
+ Pool access and spa credit included +
+
Lunch add-on+$18
+ + - Search + Apply Code -
+ +
@code { - - private string person = ""; - private string password = ""; - private string search = ""; + private const string PasswordIcon = """"""; + private const string SearchIcon = """"""; private IgbIcon iconRef; - protected override void OnAfterRender(bool firstRender) + protected override async Task OnAfterRenderAsync(bool firstRender) { - if (this.iconRef != null && firstRender) + if (firstRender && iconRef != null) { - this.iconRef.EnsureReady().ContinueWith(new Action((e) => - { - this.iconRef.RegisterIconFromText("person", person, "material"); ; - this.iconRef.RegisterIconFromText("password", password, "material"); ; - this.iconRef.RegisterIconFromText("search", search, "material"); ; - })); + await iconRef.EnsureReady(); + await iconRef.RegisterIconFromTextAsync("search", SearchIcon, "material"); + await iconRef.RegisterIconFromTextAsync("password", PasswordIcon, "material"); } } -} \ No newline at end of file +} diff --git a/samples/layouts/carousel/components/Program.cs b/samples/layouts/carousel/components/Program.cs index 6124b7ce1f..57904a1c12 100644 --- a/samples/layouts/carousel/components/Program.cs +++ b/samples/layouts/carousel/components/Program.cs @@ -23,7 +23,8 @@ public static async Task Main(string[] args) typeof(IgbCarouselModule), typeof(IgbInputModule), typeof(IgbIconModule), - typeof(IgbButtonModule) + typeof(IgbButtonModule), + typeof(IgbCheckboxModule) ); await builder.Build().RunAsync(); } diff --git a/samples/layouts/carousel/configuration/App.razor b/samples/layouts/carousel/configuration/App.razor new file mode 100644 index 0000000000..b625b1ae33 --- /dev/null +++ b/samples/layouts/carousel/configuration/App.razor @@ -0,0 +1,145 @@ +@using IgniteUI.Blazor.Controls + + + +
+
+ Hide navigation + Hide indicators + Disable loop +
+ + + +
+ 01 +

Coastal route

+

A compact visual slide for checking navigation and indicators.

+
+ + +
+ 02 +

City guide

+

A second slide makes loop behavior easy to verify.

+
+ + +
+ 03 +

Resort access

+

Use the controls to compare the Carousel configuration states.

+
+ + +
+ +@code { + private bool hideNavigation; + private bool hideIndicators; + private bool disableLoop; + + private void OnHideNavigationChange(IgbCheckboxChangeEventArgs args) + { + hideNavigation = args.Detail.Checked; + } + + private void OnHideIndicatorsChange(IgbCheckboxChangeEventArgs args) + { + hideIndicators = args.Detail.Checked; + } + + private void OnDisableLoopChange(IgbCheckboxChangeEventArgs args) + { + disableLoop = args.Detail.Checked; + } +} diff --git a/samples/layouts/carousel/configuration/BlazorClientApp.csproj b/samples/layouts/carousel/configuration/BlazorClientApp.csproj new file mode 100644 index 0000000000..3db93a181a --- /dev/null +++ b/samples/layouts/carousel/configuration/BlazorClientApp.csproj @@ -0,0 +1,28 @@ + + + + net10.0 + 3.0 + Infragistics.Samples + Infragistics.Samples + + + + 1701;1702,IDE0028,BL0005,0219,CS1998 + + + + + + + + + + + + + + + + + diff --git a/samples/layouts/carousel/configuration/BlazorClientApp.sln b/samples/layouts/carousel/configuration/BlazorClientApp.sln new file mode 100644 index 0000000000..8e75057474 --- /dev/null +++ b/samples/layouts/carousel/configuration/BlazorClientApp.sln @@ -0,0 +1,24 @@ +Microsoft Visual Studio Solution File, Format Version 12.00 +# Visual Studio Version 16 +VisualStudioVersion = 16.0.29613.14 +MinimumVisualStudioVersion = 10.0.40219.1 +Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "BlazorClientApp", "BlazorClientApp.csproj", "{F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}" +EndProject +Global + GlobalSection(SolutionConfigurationPlatforms) = preSolution + Debug|Any CPU = Debug|Any CPU + Release|Any CPU = Release|Any CPU + EndGlobalSection + GlobalSection(ProjectConfigurationPlatforms) = postSolution + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Debug|Any CPU.ActiveCfg = Debug|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Debug|Any CPU.Build.0 = Debug|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Release|Any CPU.ActiveCfg = Release|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Release|Any CPU.Build.0 = Release|Any CPU + EndGlobalSection + GlobalSection(SolutionProperties) = preSolution + HideSolutionNode = FALSE + EndGlobalSection + GlobalSection(ExtensibilityGlobals) = postSolution + SolutionGuid = {FC52AAC8-4488-40AE-9621-75F6BA744B18} + EndGlobalSection +EndGlobal diff --git a/samples/layouts/carousel/configuration/Program.cs b/samples/layouts/carousel/configuration/Program.cs new file mode 100644 index 0000000000..11b858e748 --- /dev/null +++ b/samples/layouts/carousel/configuration/Program.cs @@ -0,0 +1,29 @@ +using System; +using System.Net.Http; +using System.Collections.Generic; +using System.Threading.Tasks; +using System.Text; +using Microsoft.AspNetCore.Components.WebAssembly.Hosting; +using Microsoft.Extensions.Configuration; +using Microsoft.Extensions.DependencyInjection; +using Microsoft.Extensions.Logging; +using IgniteUI.Blazor.Controls; // for registering Ignite UI modules + +namespace Infragistics.Samples +{ + public class Program + { + public static async Task Main(string[] args) + { + var builder = WebAssemblyHostBuilder.CreateDefault(args); + builder.RootComponents.Add("app"); + builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) }); + // registering Ignite UI modules + builder.Services.AddIgniteUIBlazor( + typeof(IgbCarouselModule), + typeof(IgbSwitchModule) + ); + await builder.Build().RunAsync(); + } + } +} diff --git a/samples/layouts/carousel/configuration/Properties/launchSettings.json b/samples/layouts/carousel/configuration/Properties/launchSettings.json new file mode 100644 index 0000000000..468407d277 --- /dev/null +++ b/samples/layouts/carousel/configuration/Properties/launchSettings.json @@ -0,0 +1,27 @@ +{ + "iisSettings": { + "windowsAuthentication": false, + "anonymousAuthentication": true, + "iisExpress": { + "applicationUrl": "http://localhost:4200", + "sslPort": 44385 + } + }, + "profiles": { + "IIS Express": { + "commandName": "IISExpress", + "launchBrowser": true, + "environmentVariables": { + "ASPNETCORE_ENVIRONMENT": "Development" + } + }, + "BlazorClientApp": { + "commandName": "Project", + "launchBrowser": true, + "environmentVariables": { + "ASPNETCORE_ENVIRONMENT": "Development" + }, + "applicationUrl": "https://localhost:5001;http://localhost:4200" + } + } +} diff --git a/samples/layouts/carousel/configuration/README.md b/samples/layouts/carousel/configuration/README.md new file mode 100644 index 0000000000..a30f096530 --- /dev/null +++ b/samples/layouts/carousel/configuration/README.md @@ -0,0 +1,68 @@ + + + +This folder contains implementation of Blazor application with example of Configuration feature using [Carousel](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/general-getting-started.html) component. + + + + + View Docs + + + View Code + + + Run Sample + + + + + +## Branches + +> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-blazor-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-blazor-examples/tree/vnext) branch only when you want to contribute new samples to this repository. + +## Setup + +- instal **.NET SDK** from this [website](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/install) + +## Running App in Visual Studio 2022 + +NOTE: VS 2022 has better code highlighting and error detection than VS Code does. + +- open **Visual Studio 2022** as an administrator + +- open the **BlazorClientApp.sln** solution + +- right click solution and select **Restore NuGet Packages** menu item + +- click **Debug** menu and select **Start Debugging** or press **F5** key + + +## Running App in VS Code + +- open **VS Code** as an administrator + +- open this folder in **VS Code** + +- open a terminal window + +- to restore assemblies, run this command: +```dotnet restore``` + +- to run samples, run this command: +```dotnet watch run``` + +- wait for for message: +**Now listening on: http://localhost:4200** + +- open **http://localhost:4200** in your browser + + +## Resources + +- [Razor Component Models](https://www.codemag.com/article/1911052) +- [Razor Syntax](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#razor-syntax) +- [Getting reference to components](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#capture-references-to-components) diff --git a/samples/layouts/carousel/configuration/_Imports.razor b/samples/layouts/carousel/configuration/_Imports.razor new file mode 100644 index 0000000000..b4bad03986 --- /dev/null +++ b/samples/layouts/carousel/configuration/_Imports.razor @@ -0,0 +1,8 @@ +@using System.Net.Http +@using System.Net.Http.Json +@using Microsoft.AspNetCore.Components.Forms +@using Microsoft.AspNetCore.Components.Routing +@using Microsoft.AspNetCore.Components.Web +@using Microsoft.AspNetCore.Components.WebAssembly.Http +@using Microsoft.JSInterop +@using Infragistics.Samples diff --git a/samples/layouts/carousel/configuration/wwwroot/index.css b/samples/layouts/carousel/configuration/wwwroot/index.css new file mode 100644 index 0000000000..82faeec427 --- /dev/null +++ b/samples/layouts/carousel/configuration/wwwroot/index.css @@ -0,0 +1,4 @@ +/* +CSS styles are loaded from the shared CSS file located at: +https://dl.infragistics.com/x/css//samples/ +*/ \ No newline at end of file diff --git a/samples/layouts/carousel/configuration/wwwroot/index.html b/samples/layouts/carousel/configuration/wwwroot/index.html new file mode 100644 index 0000000000..61d40ad005 --- /dev/null +++ b/samples/layouts/carousel/configuration/wwwroot/index.html @@ -0,0 +1,31 @@ + + + + + + + + + + Samples | IgniteUI for Blazor | Infragistics + + + + + + + + + +
+ An unhandled error has occurred. + Reload + 🗙 +
+ + + + + + + diff --git a/samples/layouts/carousel/overview/App.razor b/samples/layouts/carousel/overview/App.razor index 561e769aca..fc2a67fc57 100644 --- a/samples/layouts/carousel/overview/App.razor +++ b/samples/layouts/carousel/overview/App.razor @@ -7,6 +7,7 @@ .image-container { display: flex; + height: 100%; align-items: center; justify-content: center; } @@ -19,7 +20,7 @@ igc-carousel { margin-inline: auto; max-width: 75%; - height: 400px; + height: 450px; } igc-carousel-slide::part(base) { @@ -53,4 +54,4 @@ @code { -} \ No newline at end of file +} diff --git a/samples/layouts/carousel/styling/App.razor b/samples/layouts/carousel/styling/App.razor new file mode 100644 index 0000000000..a0f976167c --- /dev/null +++ b/samples/layouts/carousel/styling/App.razor @@ -0,0 +1,156 @@ +@using IgniteUI.Blazor.Controls + + + +
+ + + + + +
+ Wonderful coast +
01

Coastal retreat

A quiet route along cliffs, beach towns, and open water.

+
+ + + + +
+ Cultural district +
02

Cultural district

Museums, galleries, and historic streets in one walkable plan.

+
+ + + + +
+ Golden beaches +
03

Golden beaches

A sunny itinerary built around swimming, dining, and sunsets.

+
+ + + +
+@code { + private const string ChevronLeft = """"""; + private const string ChevronRight = """"""; + + private IgbIcon iconRef; + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender && iconRef != null) + { + await iconRef.EnsureReady(); + await iconRef.RegisterIconFromTextAsync("chevron-left", ChevronLeft, "carousel"); + await iconRef.RegisterIconFromTextAsync("chevron-right", ChevronRight, "carousel"); + } + } +} \ No newline at end of file diff --git a/samples/layouts/carousel/styling/BlazorClientApp.csproj b/samples/layouts/carousel/styling/BlazorClientApp.csproj new file mode 100644 index 0000000000..3db93a181a --- /dev/null +++ b/samples/layouts/carousel/styling/BlazorClientApp.csproj @@ -0,0 +1,28 @@ + + + + net10.0 + 3.0 + Infragistics.Samples + Infragistics.Samples + + + + 1701;1702,IDE0028,BL0005,0219,CS1998 + + + + + + + + + + + + + + + + + diff --git a/samples/layouts/carousel/styling/BlazorClientApp.sln b/samples/layouts/carousel/styling/BlazorClientApp.sln new file mode 100644 index 0000000000..8e75057474 --- /dev/null +++ b/samples/layouts/carousel/styling/BlazorClientApp.sln @@ -0,0 +1,24 @@ +Microsoft Visual Studio Solution File, Format Version 12.00 +# Visual Studio Version 16 +VisualStudioVersion = 16.0.29613.14 +MinimumVisualStudioVersion = 10.0.40219.1 +Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "BlazorClientApp", "BlazorClientApp.csproj", "{F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}" +EndProject +Global + GlobalSection(SolutionConfigurationPlatforms) = preSolution + Debug|Any CPU = Debug|Any CPU + Release|Any CPU = Release|Any CPU + EndGlobalSection + GlobalSection(ProjectConfigurationPlatforms) = postSolution + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Debug|Any CPU.ActiveCfg = Debug|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Debug|Any CPU.Build.0 = Debug|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Release|Any CPU.ActiveCfg = Release|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Release|Any CPU.Build.0 = Release|Any CPU + EndGlobalSection + GlobalSection(SolutionProperties) = preSolution + HideSolutionNode = FALSE + EndGlobalSection + GlobalSection(ExtensibilityGlobals) = postSolution + SolutionGuid = {FC52AAC8-4488-40AE-9621-75F6BA744B18} + EndGlobalSection +EndGlobal diff --git a/samples/layouts/carousel/styling/Program.cs b/samples/layouts/carousel/styling/Program.cs new file mode 100644 index 0000000000..0e4aeeeba0 --- /dev/null +++ b/samples/layouts/carousel/styling/Program.cs @@ -0,0 +1,29 @@ +using System; +using System.Net.Http; +using System.Collections.Generic; +using System.Threading.Tasks; +using System.Text; +using Microsoft.AspNetCore.Components.WebAssembly.Hosting; +using Microsoft.Extensions.Configuration; +using Microsoft.Extensions.DependencyInjection; +using Microsoft.Extensions.Logging; +using IgniteUI.Blazor.Controls; // for registering Ignite UI modules + +namespace Infragistics.Samples +{ + public class Program + { + public static async Task Main(string[] args) + { + var builder = WebAssemblyHostBuilder.CreateDefault(args); + builder.RootComponents.Add("app"); + builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) }); + // registering Ignite UI modules + builder.Services.AddIgniteUIBlazor( + typeof(IgbCarouselModule), + typeof(IgbIconModule) + ); + await builder.Build().RunAsync(); + } + } +} diff --git a/samples/layouts/carousel/styling/Properties/launchSettings.json b/samples/layouts/carousel/styling/Properties/launchSettings.json new file mode 100644 index 0000000000..468407d277 --- /dev/null +++ b/samples/layouts/carousel/styling/Properties/launchSettings.json @@ -0,0 +1,27 @@ +{ + "iisSettings": { + "windowsAuthentication": false, + "anonymousAuthentication": true, + "iisExpress": { + "applicationUrl": "http://localhost:4200", + "sslPort": 44385 + } + }, + "profiles": { + "IIS Express": { + "commandName": "IISExpress", + "launchBrowser": true, + "environmentVariables": { + "ASPNETCORE_ENVIRONMENT": "Development" + } + }, + "BlazorClientApp": { + "commandName": "Project", + "launchBrowser": true, + "environmentVariables": { + "ASPNETCORE_ENVIRONMENT": "Development" + }, + "applicationUrl": "https://localhost:5001;http://localhost:4200" + } + } +} diff --git a/samples/layouts/carousel/styling/README.md b/samples/layouts/carousel/styling/README.md new file mode 100644 index 0000000000..58220d8f49 --- /dev/null +++ b/samples/layouts/carousel/styling/README.md @@ -0,0 +1,68 @@ + + + +This folder contains implementation of Blazor application with example of Styling feature using [Carousel](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/general-getting-started.html) component. + + + + + View Docs + + + View Code + + + Run Sample + + + + + +## Branches + +> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-blazor-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-blazor-examples/tree/vnext) branch only when you want to contribute new samples to this repository. + +## Setup + +- instal **.NET SDK** from this [website](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/install) + +## Running App in Visual Studio 2022 + +NOTE: VS 2022 has better code highlighting and error detection than VS Code does. + +- open **Visual Studio 2022** as an administrator + +- open the **BlazorClientApp.sln** solution + +- right click solution and select **Restore NuGet Packages** menu item + +- click **Debug** menu and select **Start Debugging** or press **F5** key + + +## Running App in VS Code + +- open **VS Code** as an administrator + +- open this folder in **VS Code** + +- open a terminal window + +- to restore assemblies, run this command: +```dotnet restore``` + +- to run samples, run this command: +```dotnet watch run``` + +- wait for for message: +**Now listening on: http://localhost:4200** + +- open **http://localhost:4200** in your browser + + +## Resources + +- [Razor Component Models](https://www.codemag.com/article/1911052) +- [Razor Syntax](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#razor-syntax) +- [Getting reference to components](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#capture-references-to-components) diff --git a/samples/layouts/carousel/styling/_Imports.razor b/samples/layouts/carousel/styling/_Imports.razor new file mode 100644 index 0000000000..b4bad03986 --- /dev/null +++ b/samples/layouts/carousel/styling/_Imports.razor @@ -0,0 +1,8 @@ +@using System.Net.Http +@using System.Net.Http.Json +@using Microsoft.AspNetCore.Components.Forms +@using Microsoft.AspNetCore.Components.Routing +@using Microsoft.AspNetCore.Components.Web +@using Microsoft.AspNetCore.Components.WebAssembly.Http +@using Microsoft.JSInterop +@using Infragistics.Samples diff --git a/samples/layouts/carousel/styling/wwwroot/index.css b/samples/layouts/carousel/styling/wwwroot/index.css new file mode 100644 index 0000000000..82faeec427 --- /dev/null +++ b/samples/layouts/carousel/styling/wwwroot/index.css @@ -0,0 +1,4 @@ +/* +CSS styles are loaded from the shared CSS file located at: +https://dl.infragistics.com/x/css//samples/ +*/ \ No newline at end of file diff --git a/samples/layouts/carousel/styling/wwwroot/index.html b/samples/layouts/carousel/styling/wwwroot/index.html new file mode 100644 index 0000000000..61d40ad005 --- /dev/null +++ b/samples/layouts/carousel/styling/wwwroot/index.html @@ -0,0 +1,31 @@ + + + + + + + + + + Samples | IgniteUI for Blazor | Infragistics + + + + + + + + + +
+ An unhandled error has occurred. + Reload + 🗙 +
+ + + + + + + diff --git a/samples/layouts/carousel/tailwind-styling/App.razor b/samples/layouts/carousel/tailwind-styling/App.razor new file mode 100644 index 0000000000..60ab9d5dfe --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/App.razor @@ -0,0 +1,63 @@ +@using IgniteUI.Blazor.Controls + +
+ + + + + +
+ Scenic travel destination +
+
01 / ITINERARY

Scenic getaway

A flexible travel plan built around memorable views and time to explore.

+
3 days8 stopsFlexible dates
+
Scenic routeFlexible pace
+ View itinerary +
+
+ + + + +
+ Mountain trail ride +
+
02 / ITINERARY

Mountain trail ride

A high-energy route through rugged terrain, with technical descents and open trail views.

+
1 day12 kmAdvanced
+
Mountain bikeTrail ride
+ View itinerary +
+
+ + + + +
+ Weekend escape +
+
03 / ITINERARY

Weekend escape

A short break with unhurried moments, fresh perspectives, and room to recharge.

+
Weekend5 highlightsYear round
+
UnwindGo at your pace
+ View itinerary +
+
+ + + +
+@code { + private const string ChevronLeft = """"""; + private const string ChevronRight = """"""; + + private IgbIcon iconRef; + + protected override async Task OnAfterRenderAsync(bool firstRender) + { + if (firstRender && iconRef != null) + { + await iconRef.EnsureReady(); + await iconRef.RegisterIconFromTextAsync("chevron-left", ChevronLeft, "carousel"); + await iconRef.RegisterIconFromTextAsync("chevron-right", ChevronRight, "carousel"); + } + } +} \ No newline at end of file diff --git a/samples/layouts/carousel/tailwind-styling/BlazorClientApp.csproj b/samples/layouts/carousel/tailwind-styling/BlazorClientApp.csproj new file mode 100644 index 0000000000..dba9a23e8a --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/BlazorClientApp.csproj @@ -0,0 +1,33 @@ + + + + net10.0 + 3.0 + Infragistics.Samples + Infragistics.Samples + + + + 1701;1702,IDE0028,BL0005,0219,CS1998 + + + + + + + + + + + + + + + + + + + + + + diff --git a/samples/layouts/carousel/tailwind-styling/BlazorClientApp.sln b/samples/layouts/carousel/tailwind-styling/BlazorClientApp.sln new file mode 100644 index 0000000000..8e75057474 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/BlazorClientApp.sln @@ -0,0 +1,24 @@ +Microsoft Visual Studio Solution File, Format Version 12.00 +# Visual Studio Version 16 +VisualStudioVersion = 16.0.29613.14 +MinimumVisualStudioVersion = 10.0.40219.1 +Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "BlazorClientApp", "BlazorClientApp.csproj", "{F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}" +EndProject +Global + GlobalSection(SolutionConfigurationPlatforms) = preSolution + Debug|Any CPU = Debug|Any CPU + Release|Any CPU = Release|Any CPU + EndGlobalSection + GlobalSection(ProjectConfigurationPlatforms) = postSolution + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Debug|Any CPU.ActiveCfg = Debug|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Debug|Any CPU.Build.0 = Debug|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Release|Any CPU.ActiveCfg = Release|Any CPU + {F69CC3F0-BCD1-4CE6-9F39-CBED14E7FA78}.Release|Any CPU.Build.0 = Release|Any CPU + EndGlobalSection + GlobalSection(SolutionProperties) = preSolution + HideSolutionNode = FALSE + EndGlobalSection + GlobalSection(ExtensibilityGlobals) = postSolution + SolutionGuid = {FC52AAC8-4488-40AE-9621-75F6BA744B18} + EndGlobalSection +EndGlobal diff --git a/samples/layouts/carousel/tailwind-styling/Program.cs b/samples/layouts/carousel/tailwind-styling/Program.cs new file mode 100644 index 0000000000..722a902fd5 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/Program.cs @@ -0,0 +1,30 @@ +using System; +using System.Net.Http; +using System.Collections.Generic; +using System.Threading.Tasks; +using System.Text; +using Microsoft.AspNetCore.Components.WebAssembly.Hosting; +using Microsoft.Extensions.Configuration; +using Microsoft.Extensions.DependencyInjection; +using Microsoft.Extensions.Logging; +using IgniteUI.Blazor.Controls; // for registering Ignite UI modules + +namespace Infragistics.Samples +{ + public class Program + { + public static async Task Main(string[] args) + { + var builder = WebAssemblyHostBuilder.CreateDefault(args); + builder.RootComponents.Add("app"); + builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) }); + // registering Ignite UI modules + builder.Services.AddIgniteUIBlazor( + typeof(IgbButtonModule), + typeof(IgbCarouselModule), + typeof(IgbIconModule) + ); + await builder.Build().RunAsync(); + } + } +} diff --git a/samples/layouts/carousel/tailwind-styling/Properties/launchSettings.json b/samples/layouts/carousel/tailwind-styling/Properties/launchSettings.json new file mode 100644 index 0000000000..468407d277 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/Properties/launchSettings.json @@ -0,0 +1,27 @@ +{ + "iisSettings": { + "windowsAuthentication": false, + "anonymousAuthentication": true, + "iisExpress": { + "applicationUrl": "http://localhost:4200", + "sslPort": 44385 + } + }, + "profiles": { + "IIS Express": { + "commandName": "IISExpress", + "launchBrowser": true, + "environmentVariables": { + "ASPNETCORE_ENVIRONMENT": "Development" + } + }, + "BlazorClientApp": { + "commandName": "Project", + "launchBrowser": true, + "environmentVariables": { + "ASPNETCORE_ENVIRONMENT": "Development" + }, + "applicationUrl": "https://localhost:5001;http://localhost:4200" + } + } +} diff --git a/samples/layouts/carousel/tailwind-styling/README.md b/samples/layouts/carousel/tailwind-styling/README.md new file mode 100644 index 0000000000..15e714cdd3 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/README.md @@ -0,0 +1,68 @@ + + + +This folder contains implementation of Blazor application with example of Tailwind Styling feature using [Carousel](https://www.infragistics.com/products/ignite-ui-blazor/blazor/components/general-getting-started.html) component. + + + + + View Docs + + + View Code + + + Run Sample + + + + + +## Branches + +> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-blazor-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-blazor-examples/tree/vnext) branch only when you want to contribute new samples to this repository. + +## Setup + +- instal **.NET SDK** from this [website](https://dotnet.microsoft.com/learn/aspnet/blazor-tutorial/install) + +## Running App in Visual Studio 2022 + +NOTE: VS 2022 has better code highlighting and error detection than VS Code does. + +- open **Visual Studio 2022** as an administrator + +- open the **BlazorClientApp.sln** solution + +- right click solution and select **Restore NuGet Packages** menu item + +- click **Debug** menu and select **Start Debugging** or press **F5** key + + +## Running App in VS Code + +- open **VS Code** as an administrator + +- open this folder in **VS Code** + +- open a terminal window + +- to restore assemblies, run this command: +```dotnet restore``` + +- to run samples, run this command: +```dotnet watch run``` + +- wait for for message: +**Now listening on: http://localhost:4200** + +- open **http://localhost:4200** in your browser + + +## Resources + +- [Razor Component Models](https://www.codemag.com/article/1911052) +- [Razor Syntax](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#razor-syntax) +- [Getting reference to components](https://docs.microsoft.com/en-us/aspnet/core/blazor/components/?view=aspnetcore-3.1#capture-references-to-components) diff --git a/samples/layouts/carousel/tailwind-styling/_Imports.razor b/samples/layouts/carousel/tailwind-styling/_Imports.razor new file mode 100644 index 0000000000..b4bad03986 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/_Imports.razor @@ -0,0 +1,8 @@ +@using System.Net.Http +@using System.Net.Http.Json +@using Microsoft.AspNetCore.Components.Forms +@using Microsoft.AspNetCore.Components.Routing +@using Microsoft.AspNetCore.Components.Web +@using Microsoft.AspNetCore.Components.WebAssembly.Http +@using Microsoft.JSInterop +@using Infragistics.Samples diff --git a/samples/layouts/carousel/tailwind-styling/package-lock.json b/samples/layouts/carousel/tailwind-styling/package-lock.json new file mode 100644 index 0000000000..8b1d6ee9ae --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/package-lock.json @@ -0,0 +1,1028 @@ +{ + "name": "blazor-carousel-tailwind-styling", + "version": "1.0.0", + "lockfileVersion": 3, + "requires": true, + "packages": { + "": { + "name": "blazor-carousel-tailwind-styling", + "version": "1.0.0", + "devDependencies": { + "tailwindcss": "^3.4.19" + } + }, + "node_modules/@alloc/quick-lru": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz", + "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@jridgewell/gen-mapping": { + "version": "0.3.13", + "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz", + "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@jridgewell/sourcemap-codec": "^1.5.0", + "@jridgewell/trace-mapping": "^0.3.24" + } + }, + "node_modules/@jridgewell/resolve-uri": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz", + "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6.0.0" + } + }, + "node_modules/@jridgewell/sourcemap-codec": { + "version": "1.5.5", + "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz", + "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==", + "dev": true, + "license": "MIT" + }, + "node_modules/@jridgewell/trace-mapping": { + "version": "0.3.31", + "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.31.tgz", + "integrity": "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@jridgewell/resolve-uri": "^3.1.0", + "@jridgewell/sourcemap-codec": "^1.4.14" + } + }, + "node_modules/@nodelib/fs.scandir": { + "version": "2.1.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", + "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.stat": "2.0.5", + "run-parallel": "^1.1.9" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.stat": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz", + "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 8" + } + }, + "node_modules/@nodelib/fs.walk": { + "version": "1.2.8", + "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz", + "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.scandir": "2.1.5", + "fastq": "^1.6.0" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/any-promise": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz", + "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==", + "dev": true, + "license": "MIT" + }, + "node_modules/anymatch": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz", + "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==", + "dev": true, + "license": "ISC", + "dependencies": { + "normalize-path": "^3.0.0", + "picomatch": "^2.0.4" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/arg": { + "version": "5.0.2", + "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz", + "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==", + "dev": true, + "license": "MIT" + }, + "node_modules/binary-extensions": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz", + "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/braces": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz", + "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==", + "dev": true, + "license": "MIT", + "dependencies": { + "fill-range": "^7.1.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/camelcase-css": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz", + "integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 6" + } + }, + "node_modules/chokidar": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", + "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==", + "dev": true, + "license": "MIT", + "dependencies": { + "anymatch": "~3.1.2", + "braces": "~3.0.2", + "glob-parent": "~5.1.2", + "is-binary-path": "~2.1.0", + "is-glob": "~4.0.1", + "normalize-path": "~3.0.0", + "readdirp": "~3.6.0" + }, + "engines": { + "node": ">= 8.10.0" + }, + "funding": { + "url": "https://paulmillr.com/funding/" + }, + "optionalDependencies": { + "fsevents": "~2.3.2" + } + }, + "node_modules/chokidar/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "license": "ISC", + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/commander": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz", + "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 6" + } + }, + "node_modules/cssesc": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", + "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==", + "dev": true, + "license": "MIT", + "bin": { + "cssesc": "bin/cssesc" + }, + "engines": { + "node": ">=4" + } + }, + "node_modules/didyoumean": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz", + "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==", + "dev": true, + "license": "Apache-2.0" + }, + "node_modules/dlv": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz", + "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==", + "dev": true, + "license": "MIT" + }, + "node_modules/es-errors": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz", + "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/fast-glob": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz", + "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.8" + }, + "engines": { + "node": ">=8.6.0" + } + }, + "node_modules/fast-glob/node_modules/glob-parent": { + "version": "5.1.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz", + "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==", + "dev": true, + "license": "ISC", + "dependencies": { + "is-glob": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, + "node_modules/fastq": { + "version": "1.20.1", + "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz", + "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==", + "dev": true, + "license": "ISC", + "dependencies": { + "reusify": "^1.0.4" + } + }, + "node_modules/fill-range": { + "version": "7.1.1", + "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz", + "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==", + "dev": true, + "license": "MIT", + "dependencies": { + "to-regex-range": "^5.0.1" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/fsevents": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", + "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", + "dev": true, + "hasInstallScript": true, + "license": "MIT", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": "^8.16.0 || ^10.6.0 || >=11.0.0" + } + }, + "node_modules/function-bind": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", + "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", + "dev": true, + "license": "MIT", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/glob-parent": { + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz", + "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==", + "dev": true, + "license": "ISC", + "dependencies": { + "is-glob": "^4.0.3" + }, + "engines": { + "node": ">=10.13.0" + } + }, + "node_modules/hasown": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.4.tgz", + "integrity": "sha512-T2UbfbBEF32wiepXIsMlTW9+dDYC6wMh/t/vYA4tuOMKqWz/n3vr1NFSxQiyP+zk2mXsoMA/i/7qV6LKut1t1A==", + "dev": true, + "license": "MIT", + "dependencies": { + "function-bind": "^1.1.2" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/is-binary-path": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", + "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "dev": true, + "license": "MIT", + "dependencies": { + "binary-extensions": "^2.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/is-core-module": { + "version": "2.16.2", + "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.2.tgz", + "integrity": "sha512-evOr8xfXKxE6qSR0hSXL2r3sd7ALj8+7jQEUvPYcm5sgZFdJ+AYzT6yNmJenvIYQBgIGwfwz08sL8zoL7yq2BA==", + "dev": true, + "license": "MIT", + "dependencies": { + "hasown": "^2.0.3" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-extglob": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", + "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-glob": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", + "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-extglob": "^2.1.1" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-number": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.12.0" + } + }, + "node_modules/jiti": { + "version": "1.21.7", + "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz", + "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==", + "dev": true, + "license": "MIT", + "bin": { + "jiti": "bin/jiti.js" + } + }, + "node_modules/lilconfig": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz", + "integrity": "sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/antonk52" + } + }, + "node_modules/lines-and-columns": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz", + "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==", + "dev": true, + "license": "MIT" + }, + "node_modules/merge2": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", + "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 8" + } + }, + "node_modules/micromatch": { + "version": "4.0.8", + "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz", + "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==", + "dev": true, + "license": "MIT", + "dependencies": { + "braces": "^3.0.3", + "picomatch": "^2.3.1" + }, + "engines": { + "node": ">=8.6" + } + }, + "node_modules/mz": { + "version": "2.7.0", + "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz", + "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "any-promise": "^1.0.0", + "object-assign": "^4.0.1", + "thenify-all": "^1.0.0" + } + }, + "node_modules/nanoid": { + "version": "3.3.17", + "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.17.tgz", + "integrity": "sha512-xQLf0A3HOMlgHq0n247/LRuAOYmB7dXJ/DvAxGvsSBij45XtBSmQycu+F8ODbHwns/XyFZagyL1+J0Offw1E0g==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "bin": { + "nanoid": "bin/nanoid.cjs" + }, + "engines": { + "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1" + } + }, + "node_modules/normalize-path": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", + "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/object-assign": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", + "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/object-hash": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz", + "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 6" + } + }, + "node_modules/path-parse": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz", + "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==", + "dev": true, + "license": "MIT" + }, + "node_modules/picocolors": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz", + "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==", + "dev": true, + "license": "ISC" + }, + "node_modules/picomatch": { + "version": "2.3.2", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz", + "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8.6" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, + "node_modules/pify": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz", + "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/pirates": { + "version": "4.0.7", + "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.7.tgz", + "integrity": "sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 6" + } + }, + "node_modules/postcss": { + "version": "8.5.25", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.25.tgz", + "integrity": "sha512-DTPx3RWSSnWyzLxQnlH0rJP+EW5ekl16ZU4/psbIhA0e53kJfdgaN5vKM+xP7yJtXVu+nfdVFmlgFDEKAe4Pyw==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "nanoid": "^3.3.16", + "picocolors": "^1.1.1", + "source-map-js": "^1.2.1" + }, + "engines": { + "node": "^10 || ^12 || >=14" + } + }, + "node_modules/postcss-import": { + "version": "15.1.0", + "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz", + "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==", + "dev": true, + "license": "MIT", + "dependencies": { + "postcss-value-parser": "^4.0.0", + "read-cache": "^1.0.0", + "resolve": "^1.1.7" + }, + "engines": { + "node": ">=14.0.0" + }, + "peerDependencies": { + "postcss": "^8.0.0" + } + }, + "node_modules/postcss-js": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.1.0.tgz", + "integrity": "sha512-oIAOTqgIo7q2EOwbhb8UalYePMvYoIeRY2YKntdpFQXNosSu3vLrniGgmH9OKs/qAkfoj5oB3le/7mINW1LCfw==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "camelcase-css": "^2.0.1" + }, + "engines": { + "node": "^12 || ^14 || >= 16" + }, + "peerDependencies": { + "postcss": "^8.4.21" + } + }, + "node_modules/postcss-load-config": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-6.0.1.tgz", + "integrity": "sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "lilconfig": "^3.1.1" + }, + "engines": { + "node": ">= 18" + }, + "peerDependencies": { + "jiti": ">=1.21.0", + "postcss": ">=8.0.9", + "tsx": "^4.8.1", + "yaml": "^2.4.2" + }, + "peerDependenciesMeta": { + "jiti": { + "optional": true + }, + "postcss": { + "optional": true + }, + "tsx": { + "optional": true + }, + "yaml": { + "optional": true + } + } + }, + "node_modules/postcss-nested": { + "version": "6.2.0", + "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.2.0.tgz", + "integrity": "sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==", + "dev": true, + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "postcss-selector-parser": "^6.1.1" + }, + "engines": { + "node": ">=12.0" + }, + "peerDependencies": { + "postcss": "^8.2.14" + } + }, + "node_modules/postcss-selector-parser": { + "version": "6.1.4", + "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.4.tgz", + "integrity": "sha512-bIoJLOmjCO1S9XdY/DcnR5hJxvrDir1PbGChrzXG3vw0/FOliy/fA3dmdhQ441kah4gKv+TwckGzex6wNS5cnQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "cssesc": "^3.0.0", + "util-deprecate": "^1.0.2" + }, + "engines": { + "node": ">=4" + } + }, + "node_modules/postcss-value-parser": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/queue-microtask": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", + "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT" + }, + "node_modules/read-cache": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", + "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==", + "dev": true, + "license": "MIT", + "dependencies": { + "pify": "^2.3.0" + } + }, + "node_modules/readdirp": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", + "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "dev": true, + "license": "MIT", + "dependencies": { + "picomatch": "^2.2.1" + }, + "engines": { + "node": ">=8.10.0" + } + }, + "node_modules/resolve": { + "version": "1.22.12", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.12.tgz", + "integrity": "sha512-TyeJ1zif53BPfHootBGwPRYT1RUt6oGWsaQr8UyZW/eAm9bKoijtvruSDEmZHm92CwS9nj7/fWttqPCgzep8CA==", + "dev": true, + "license": "MIT", + "dependencies": { + "es-errors": "^1.3.0", + "is-core-module": "^2.16.1", + "path-parse": "^1.0.7", + "supports-preserve-symlinks-flag": "^1.0.0" + }, + "bin": { + "resolve": "bin/resolve" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/reusify": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz", + "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==", + "dev": true, + "license": "MIT", + "engines": { + "iojs": ">=1.0.0", + "node": ">=0.10.0" + } + }, + "node_modules/run-parallel": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz", + "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==", + "dev": true, + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/feross" + }, + { + "type": "patreon", + "url": "https://www.patreon.com/feross" + }, + { + "type": "consulting", + "url": "https://feross.org/support" + } + ], + "license": "MIT", + "dependencies": { + "queue-microtask": "^1.2.2" + } + }, + "node_modules/source-map-js": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz", + "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==", + "dev": true, + "license": "BSD-3-Clause", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/sucrase": { + "version": "3.35.1", + "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.1.tgz", + "integrity": "sha512-DhuTmvZWux4H1UOnWMB3sk0sbaCVOoQZjv8u1rDoTV0HTdGem9hkAZtl4JZy8P2z4Bg0nT+YMeOFyVr4zcG5Tw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@jridgewell/gen-mapping": "^0.3.2", + "commander": "^4.0.0", + "lines-and-columns": "^1.1.6", + "mz": "^2.7.0", + "pirates": "^4.0.1", + "tinyglobby": "^0.2.11", + "ts-interface-checker": "^0.1.9" + }, + "bin": { + "sucrase": "bin/sucrase", + "sucrase-node": "bin/sucrase-node" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + } + }, + "node_modules/supports-preserve-symlinks-flag": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", + "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/tailwindcss": { + "version": "3.4.19", + "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.19.tgz", + "integrity": "sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@alloc/quick-lru": "^5.2.0", + "arg": "^5.0.2", + "chokidar": "^3.6.0", + "didyoumean": "^1.2.2", + "dlv": "^1.1.3", + "fast-glob": "^3.3.2", + "glob-parent": "^6.0.2", + "is-glob": "^4.0.3", + "jiti": "^1.21.7", + "lilconfig": "^3.1.3", + "micromatch": "^4.0.8", + "normalize-path": "^3.0.0", + "object-hash": "^3.0.0", + "picocolors": "^1.1.1", + "postcss": "^8.4.47", + "postcss-import": "^15.1.0", + "postcss-js": "^4.0.1", + "postcss-load-config": "^4.0.2 || ^5.0 || ^6.0", + "postcss-nested": "^6.2.0", + "postcss-selector-parser": "^6.1.2", + "resolve": "^1.22.8", + "sucrase": "^3.35.0" + }, + "bin": { + "tailwind": "lib/cli.js", + "tailwindcss": "lib/cli.js" + }, + "engines": { + "node": ">=14.0.0" + } + }, + "node_modules/thenify": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz", + "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==", + "dev": true, + "license": "MIT", + "dependencies": { + "any-promise": "^1.0.0" + } + }, + "node_modules/thenify-all": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz", + "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==", + "dev": true, + "license": "MIT", + "dependencies": { + "thenify": ">= 3.1.0 < 4" + }, + "engines": { + "node": ">=0.8" + } + }, + "node_modules/tinyglobby": { + "version": "0.2.17", + "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.17.tgz", + "integrity": "sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==", + "dev": true, + "license": "MIT", + "dependencies": { + "fdir": "^6.5.0", + "picomatch": "^4.0.4" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/SuperchupuDev" + } + }, + "node_modules/tinyglobby/node_modules/fdir": { + "version": "6.5.0", + "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz", + "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12.0.0" + }, + "peerDependencies": { + "picomatch": "^3 || ^4" + }, + "peerDependenciesMeta": { + "picomatch": { + "optional": true + } + } + }, + "node_modules/tinyglobby/node_modules/picomatch": { + "version": "4.0.5", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.5.tgz", + "integrity": "sha512-RvwwcruNjI1ncT5xRakeyS9Lf8lcItv34KD+aif+VH9kduAyfYBipGh12274xtenIPZ119/R9BdTBa8gAwSh0A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/jonschlinkert" + } + }, + "node_modules/to-regex-range": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", + "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-number": "^7.0.0" + }, + "engines": { + "node": ">=8.0" + } + }, + "node_modules/ts-interface-checker": { + "version": "0.1.13", + "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz", + "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==", + "dev": true, + "license": "Apache-2.0" + }, + "node_modules/util-deprecate": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", + "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==", + "dev": true, + "license": "MIT" + } + } +} diff --git a/samples/layouts/carousel/tailwind-styling/package.json b/samples/layouts/carousel/tailwind-styling/package.json new file mode 100644 index 0000000000..6c119b2fd0 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/package.json @@ -0,0 +1,12 @@ +{ + "name": "blazor-carousel-tailwind-styling", + "version": "1.0.0", + "private": true, + "scripts": { + "build:css": "tailwindcss -i ./src/index.css -o ./wwwroot/index.css --minify", + "watch:css": "tailwindcss -i ./src/index.css -o ./wwwroot/index.css --watch" + }, + "devDependencies": { + "tailwindcss": "^3.4.19" + } +} diff --git a/samples/layouts/carousel/tailwind-styling/src/index.css b/samples/layouts/carousel/tailwind-styling/src/index.css new file mode 100644 index 0000000000..0e617811b3 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/src/index.css @@ -0,0 +1,27 @@ +@tailwind utilities; + +.styled-carousel::part(indicators) { + gap: 8px; + padding: 6px 10px; + border-radius: 999px; + background: rgba(255, 255, 255, 0.82); + box-shadow: 0 6px 16px rgba(11, 31, 53, 0.16); +} + +.styled-carousel::part(previous), +.styled-carousel::part(next) { + display: grid; + width: 40px; + height: 40px; + place-items: center; + border-radius: 50%; + color: var(--ig-gray-800); + background: rgba(255, 255, 255, 0.88); + box-shadow: 0 6px 16px rgba(11, 31, 53, 0.22); +} + +.carousel-navigation-button igc-icon { + width: 20px; + height: 20px; + color: inherit; +} \ No newline at end of file diff --git a/samples/layouts/carousel/tailwind-styling/tailwind.config.cjs b/samples/layouts/carousel/tailwind-styling/tailwind.config.cjs new file mode 100644 index 0000000000..df9ea88a01 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/tailwind.config.cjs @@ -0,0 +1,6 @@ +module.exports = { + content: ["./App.razor"], + corePlugins: { + preflight: false, + }, +}; diff --git a/samples/layouts/carousel/tailwind-styling/wwwroot/index.css b/samples/layouts/carousel/tailwind-styling/wwwroot/index.css new file mode 100644 index 0000000000..75369b4c12 --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/wwwroot/index.css @@ -0,0 +1 @@ +.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.mb-0{margin-bottom:0}.mb-2{margin-bottom:.5rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.block{display:block}.flex{display:flex}.grid{display:grid}.inline-grid{display:inline-grid}.h-5{height:1.25rem}.h-52{height:13rem}.h-\[430px\]{height:430px}.h-\[9px\]{height:9px}.h-full{height:100%}.w-5{width:1.25rem}.w-\[9px\]{width:9px}.w-full{width:100%}.max-w-\[960px\]{max-width:960px}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.content-center{align-content:center}.gap-2{gap:.5rem}.gap-5{gap:1.25rem}.divide-x>:not([hidden])~:not([hidden]){--tw-divide-x-reverse:0;border-right-width:calc(1px*var(--tw-divide-x-reverse));border-left-width:calc(1px*(1 - var(--tw-divide-x-reverse)))}.divide-\[var\(--ig-gray-300\)\]>:not([hidden])~:not([hidden]){border-color:var(--ig-gray-300)}.overflow-hidden{overflow:hidden}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.border{border-width:1px}.border-2{border-width:2px}.border-y{border-top-width:1px;border-bottom-width:1px}.border-\[var\(--ig-gray-300\)\]{border-color:var(--ig-gray-300)}.border-\[var\(--ig-gray-600\)\]{border-color:var(--ig-gray-600)}.border-\[var\(--ig-primary-500\)\]{border-color:var(--ig-primary-500)}.bg-\[var\(--ig-gray-100\)\]{background-color:var(--ig-gray-100)}.bg-\[var\(--ig-primary-500\)\]{background-color:var(--ig-primary-500)}.bg-\[var\(--ig-surface-500\)\]{background-color:var(--ig-surface-500)}.bg-transparent{background-color:transparent}.object-cover{-o-object-fit:cover;object-fit:cover}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.pl-8{padding-left:2rem}.pr-24{padding-right:6rem}.text-center{text-align:center}.text-2xl{font-size:1.5rem;line-height:2rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.leading-none{line-height:1}.leading-snug{line-height:1.375}.leading-tight{line-height:1.25}.text-\[var\(--ig-gray-700\)\]{color:var(--ig-gray-700)}.text-\[var\(--ig-gray-900\)\]{color:var(--ig-gray-900)}.text-\[var\(--ig-primary-600\)\]{color:var(--ig-primary-600)}.styled-carousel::part(indicators){gap:8px;padding:6px 10px;border-radius:999px;background:hsla(0,0%,100%,.82);box-shadow:0 6px 16px rgba(11,31,53,.16)}.styled-carousel::part(next),.styled-carousel::part(previous){display:grid;width:40px;height:40px;place-items:center;border-radius:50%;color:var(--ig-gray-800);background:hsla(0,0%,100%,.88);box-shadow:0 6px 16px rgba(11,31,53,.22)}.carousel-navigation-button igc-icon{width:20px;height:20px;color:inherit}.first\:pl-0:first-child{padding-left:0}.last\:pr-0:last-child{padding-right:0}@media (min-width:768px){.md\:h-full{height:100%}.md\:grid-cols-\[1\.15fr_0\.85fr\]{grid-template-columns:1.15fr .85fr}} \ No newline at end of file diff --git a/samples/layouts/carousel/tailwind-styling/wwwroot/index.html b/samples/layouts/carousel/tailwind-styling/wwwroot/index.html new file mode 100644 index 0000000000..29d92f41ea --- /dev/null +++ b/samples/layouts/carousel/tailwind-styling/wwwroot/index.html @@ -0,0 +1,32 @@ + + + + + + + + + + Avatar Tailwind Styling | IgniteUI for Blazor | Infragistics + + + + + + + + + + +
+ An unhandled error has occurred. + Reload + 🗙 +
+ + + + + + + diff --git a/samples/layouts/carousel/thumbnail/App.razor b/samples/layouts/carousel/thumbnail/App.razor index c00e0eeaac..9987f8e857 100644 --- a/samples/layouts/carousel/thumbnail/App.razor +++ b/samples/layouts/carousel/thumbnail/App.razor @@ -2,7 +2,8 @@