From 4a5556a00c4c8ea1374a0041afd96d3d847fd58a Mon Sep 17 00:00:00 2001 From: RivaIvanova Date: Fri, 7 Nov 2025 16:49:19 +0200 Subject: [PATCH 01/39] feat(tooltip): add show/hide triggers section --- en/components/tooltip.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/en/components/tooltip.md b/en/components/tooltip.md index a32ef4f779..fbf2311054 100644 --- a/en/components/tooltip.md +++ b/en/components/tooltip.md @@ -284,6 +284,18 @@ What if we want to control the amount of time that should pass before showing an > [!NOTE] > The built-in UI interaction behavior of the [`IgxTooltipTargetDirective`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) works by taking [`showDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showDelay) and [`hideDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideDelay) property values into account. Showing and hiding the tooltip through the API or the API of the [`IgxTooltipDirective`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) does NOT take the [`showDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showDelay) and [`hideDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideDelay) property values into account. If necessary, such logic would have to be implemented manually according to the application's specifics. +### Triggers + +By default, the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) is triggered only while hovering over the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html). However, you can change this behavior using the [`showTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showTriggers) and [`hideTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideTriggers) properties, which allow you to control when the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) appears and disappears. These properties accept event names as values—such as `click`, `focus`, or `keypress`—letting you trigger the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) in different scenarios. + + + + +> [!NOTE] +> Setting [`showTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showTriggers) and [`hideTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideTriggers) only has effect when interacting with the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html), not the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) itself. Default event triggers for the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) are `pointerenter` and `pointerleave`. + ### Overlay configuration Both the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) and [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) directives use the [`IgxOverlayService`](overlay.md) to open and close the respective tooltip element. From ec7ecab0a8783f710e861f10e5299572744c5e93 Mon Sep 17 00:00:00 2001 From: RivaIvanova Date: Fri, 14 Nov 2025 16:47:31 +0200 Subject: [PATCH 02/39] fix(tooltip): remove spaces --- en/components/tooltip.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/en/components/tooltip.md b/en/components/tooltip.md index 4efaf32aa9..a45821c05f 100644 --- a/en/components/tooltip.md +++ b/en/components/tooltip.md @@ -288,9 +288,9 @@ What if we want to control the amount of time that should pass before showing an By default, the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) is triggered only while hovering over the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html). However, you can change this behavior using the [`showTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showTriggers) and [`hideTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideTriggers) properties, which allow you to control when the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) appears and disappears. These properties accept event names as values—such as `click`, `focus`, or `keypress`—letting you trigger the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) in different scenarios. - + > [!NOTE] From 56852666a52eea34e56eff54083062ff5948ff40 Mon Sep 17 00:00:00 2001 From: tfsbuild Date: Wed, 7 Jan 2026 02:03:34 +0200 Subject: [PATCH 03/39] Adding changes from build igniteui-xplat-docs-to-angular-docs-EN_2026.1.7.1 --- en/components/inputs/color-editor.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/en/components/inputs/color-editor.md b/en/components/inputs/color-editor.md index 2ad182dc9e..6dd4c67d94 100644 --- a/en/components/inputs/color-editor.md +++ b/en/components/inputs/color-editor.md @@ -13,7 +13,7 @@ The Ignite UI for Angular Color Editor is a lightweight color picker component. ## Angular Color Editor Example - From 26b8b6958201aa27a7559b2082ff2209dacb8485 Mon Sep 17 00:00:00 2001 From: tfsbuild Date: Tue, 13 Jan 2026 19:04:22 -0500 Subject: [PATCH 04/39] Adding changes from build igniteui-xplat-docs-to-angular-docs-JP+KR_2026.1.14.1 --- jp/components/inputs/color-editor.md | 2 +- jp/images/dockmanager-edge-docking.jpg | Bin 0 -> 107529 bytes 2 files changed, 1 insertion(+), 1 deletion(-) create mode 100644 jp/images/dockmanager-edge-docking.jpg diff --git a/jp/components/inputs/color-editor.md b/jp/components/inputs/color-editor.md index 35162399ed..582f59863a 100644 --- a/jp/components/inputs/color-editor.md +++ b/jp/components/inputs/color-editor.md @@ -14,7 +14,7 @@ Ignite UI for Angular Color Editor は軽量のカラー ピッカー コンポ ## Angular Color Editor の例 - diff --git a/jp/images/dockmanager-edge-docking.jpg b/jp/images/dockmanager-edge-docking.jpg new file mode 100644 index 0000000000000000000000000000000000000000..86210db8e222eb33e7ca16e36d39656c79d58d33 GIT binary patch literal 107529 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 literal 0 HcmV?d00001 From cae2ffb0693cab99e1454932b02d07cd71855b2a Mon Sep 17 00:00:00 2001 From: RivaIvanova Date: Mon, 2 Feb 2026 14:59:11 +0200 Subject: [PATCH 05/39] docs(tooltip): fix API links --- en/components/tooltip.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/en/components/tooltip.md b/en/components/tooltip.md index 450736a13b..905ea85fd8 100644 --- a/en/components/tooltip.md +++ b/en/components/tooltip.md @@ -45,7 +45,7 @@ import { IgxTooltipModule } from 'igniteui-angular/tooltip'; export class AppModule {} ``` -Alternatively, as of `16.0.0` you can import the `IgxTooltipDirective` as a standalone dependency, or use the [`IGX_TOOLTIP_DIRECTIVES`](https://github.com/IgniteUI/igniteui-angular/blob/master/projects/igniteui-angular/src/lib/directives/tooltip/public_api.ts) token to import the component and all of its supporting components and directives. +Alternatively, as of `16.0.0` you can import the `IgxTooltipDirective` as a standalone dependency, or use the [`IGX_TOOLTIP_DIRECTIVES`](https://github.com/IgniteUI/igniteui-angular/blob/master/projects/igniteui-angular/directives/src/directives/tooltip/public_api.ts) token to import the component and all of its supporting components and directives. ```typescript // home.component.ts @@ -284,14 +284,14 @@ In the following example, you can see how we create descriptive tooltips by usin ### Show/Hide delay settings -What if we want to control the amount of time that should pass before showing and hiding the tooltip? For this purpose we can use the [`showDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showDelay) and the [`hideDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideDelay) properties of the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) directive. Both properties are of type **number** and take time in milliseconds. +What if we want to control the amount of time that should pass before showing and hiding the tooltip? For this purpose we can use the [`showDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showdelay) and the [`hideDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hidedelay) properties of the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) directive. Both properties are of type **number** and take time in milliseconds. > [!NOTE] -> The built-in UI interaction behavior of the [`IgxTooltipTargetDirective`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) works by taking [`showDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showDelay) and [`hideDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideDelay) property values into account. Showing and hiding the tooltip through the API or the API of the [`IgxTooltipDirective`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) does NOT take the [`showDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showDelay) and [`hideDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideDelay) property values into account. If necessary, such logic would have to be implemented manually according to the application's specifics. +> The built-in UI interaction behavior of the [`IgxTooltipTargetDirective`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) works by taking [`showDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showdelay) and [`hideDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hidedelay) property values into account. Showing and hiding the tooltip through the API or the API of the [`IgxTooltipDirective`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) does NOT take the [`showDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showdelay) and [`hideDelay`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hidedelay) property values into account. If necessary, such logic would have to be implemented manually according to the application's specifics. ### Triggers -By default, the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) is triggered only while hovering over the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html). However, you can change this behavior using the [`showTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showTriggers) and [`hideTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideTriggers) properties, which allow you to control when the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) appears and disappears. These properties accept event names as values—such as `click`, `focus`, or `keypress`—letting you trigger the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) in different scenarios. +By default, the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) is triggered only while hovering over the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html). However, you can change this behavior using the [`showTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showtriggers) and [`hideTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hidetriggers) properties, which allow you to control when the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) appears and disappears. These properties accept event names as values—such as `click`, `focus`, or `keypress`—letting you trigger the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) in different scenarios. > [!NOTE] -> Setting [`showTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showTriggers) and [`hideTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hideTriggers) only has effect when interacting with the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html), not the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) itself. Default event triggers for the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) are `pointerenter` and `pointerleave`. +> Setting [`showTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#showtriggers) and [`hideTriggers`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hidetriggers) only has effect when interacting with the [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html), not the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) itself. Default event triggers for the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) are `pointerenter` and `pointerleave`. ### Overlay configuration Both the [`igxTooltip`]({environment:angularApiUrl}/classes/igxtooltipdirective.html) and [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) directives use the [`IgxOverlayService`](overlay.md) to open and close the respective tooltip element. -The [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) directive exposes a [`positionSettings`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#positionSettings) property, which can be used to customize the animations of our tooltip, its position in the UI and a lot more! If this property is not set, then default position settings will be used. +The [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) directive exposes a [`positionSettings`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#positionsettings) property, which can be used to customize the animations of our tooltip, its position in the UI and a lot more! If this property is not set, then default position settings will be used. To further customize the tooltip, use the [`overlaySettings`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#overlaysettings) property (inherited from the [`igxToggleAction`]({environment:angularApiUrl}/classes/igxtoggleactiondirective.html)). @@ -350,7 +350,7 @@ You can make the tooltip "sticky" using the [`sticky`]({environment:angularApiUr
Her name is Madelyn James
``` -To customize the default close button, use the [`closeButtonTemplate`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#closebuttontemplate) property. +To customize the default close button, use the [`closeButtonTemplate`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#closetemplate) property. ```html @@ -414,7 +414,7 @@ To customize the arrow's position, you can override the `positionArrow(arrow: HT For example: ```ts -export class CustomStrategy extends TooltipPositioningStrategy { +export class CustomStrategy extends TooltipPositionStrategy { constructor(settings?: PositionSettings) { super(settings); } @@ -563,7 +563,7 @@ Extra care should be taken in the following scenarios: | Limitation | Description| | ----------------------------------- | ---------- | -| Custom position strategy with arrow | The [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) directive uses the `TooltipPositionStrategy` to position the tooltip and arrow element. If a custom [`positionStrategy`]({environment:angularApiUrl}/interfaces/overlaysettings.html#positioningStrategy) is used and [`hasArrow`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hasarrow) is set to `true`, the custom strategy should extend the `TooltipPositionStrategy`. Otherwise, the arrow will not be displayed.| +| Custom position strategy with arrow | The [`igxTooltipTarget`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html) directive uses the [`TooltipPositionStrategy`]({environment:angularApiUrl}/classes/tooltippositionstrategy.html) to position the tooltip and arrow element. If a custom [`positionStrategy`]({environment:angularApiUrl}/interfaces/overlaysettings.html#positionstrategy) is used and [`hasArrow`]({environment:angularApiUrl}/classes/igxtooltiptargetdirective.html#hasarrow) is set to `true`, the custom strategy should extend the [`TooltipPositionStrategy`]({environment:angularApiUrl}/classes/tooltippositionstrategy.html). Otherwise, the arrow will not be displayed.| ## API References From a442a838b27a8011f3ffbecfd42f0771e3a1d288 Mon Sep 17 00:00:00 2001 From: MonikaKirkova Date: Tue, 3 Feb 2026 18:57:06 +0200 Subject: [PATCH 06/39] docs(combo): update keyboard navigation section --- en/components/combo.md | 12 ++++++++++-- en/components/simple-combo.md | 8 +++++++- 2 files changed, 17 insertions(+), 3 deletions(-) diff --git a/en/components/combo.md b/en/components/combo.md index fcc19a2326..eb196d3b67 100644 --- a/en/components/combo.md +++ b/en/components/combo.md @@ -248,6 +248,16 @@ When combobox is closed and focused: - `ArrowDown` or `Alt` + `ArrowDown` will open the combobox's drop down and will move focus to the search input. +- `Esc` will clear the selected value(s) while keeping focus on the combobox. + +- `Tab` will move the focus to the next focusable element outside the combobox. + +When combobox is opened: + +- `Esc` will close the list and keep the focus on the combobox. + +- `Tab` will close the list and move focus to the next focusable element. + When combobox is opened and search input is focused: - `ArrowUp` or `Alt` + `ArrowUp` will close the combobox's drop down and will move focus to the closed combobox. @@ -271,8 +281,6 @@ When combobox is opened and list item is focused: - `Enter` will confirm the already selected items and will close the list. -- `Esc` will close the list. - When combobox is opened, allow custom values are enabled and add item button is focused: - `Enter` will add a new item with `valueKey` and `displayKey` equal to the text in the search input and will select the new item. diff --git a/en/components/simple-combo.md b/en/components/simple-combo.md index 1ee8f5b3bc..2a45e1efa6 100644 --- a/en/components/simple-combo.md +++ b/en/components/simple-combo.md @@ -209,6 +209,10 @@ When the simple combobox is closed and focused: - `ArrowDown` or `Alt` + `ArrowDown` will open the simple combobox's dropdown. +- `Esc` will clear the selected value while keeping focus on the combobox. + +- `Tab` will move the focus to the next focusable element outside the combobox. + > [!NOTE] > Any other key stroke will be handled by the input. @@ -226,7 +230,9 @@ When the simple combobox is opened and an item in the list is focused: - `Enter` will select/deselect the active list item and will close the list. -- `Esc` will close the list. +- `Esc` will close the list and keep the focus on the combobox. + +- `Tab` will close the list and move focus to the next focusable element. When the simple combobox is opened and allow custom values are enabled, and add item button is focused: From 6a3a2e0335f86ffdca5603175d6f12dc7a3bf409 Mon Sep 17 00:00:00 2001 From: tfsbuild Date: Tue, 3 Feb 2026 19:19:41 -0500 Subject: [PATCH 07/39] Adding changes from build igniteui-xplat-docs-to-angular-docs-JP+KR_2026.2.4.1 --- jp/components/general-changelog-dv.md | 4 ++++ jp/components/inputs/color-editor.md | 2 +- jp/images/dockmanager-edge-docking.jpg | Bin 0 -> 107529 bytes 3 files changed, 5 insertions(+), 1 deletion(-) create mode 100644 jp/images/dockmanager-edge-docking.jpg diff --git a/jp/components/general-changelog-dv.md b/jp/components/general-changelog-dv.md index f89296613a..426e8bcead 100644 --- a/jp/components/general-changelog-dv.md +++ b/jp/components/general-changelog-dv.md @@ -17,6 +17,10 @@ Ignite UI for Angular の各バージョンのすべての重要な変更は、 - [Ignite UI for Angular 変更ログ (GitHub)](https://github.com/IgniteUI/igniteui-angular/blob/master) +## **21.0.0 (January 2026)** + +- Angular 21 のサポート。 + ## **20.2.1 (December 2025)** ### バグ修正 diff --git a/jp/components/inputs/color-editor.md b/jp/components/inputs/color-editor.md index 35162399ed..582f59863a 100644 --- a/jp/components/inputs/color-editor.md +++ b/jp/components/inputs/color-editor.md @@ -14,7 +14,7 @@ Ignite UI for Angular Color Editor は軽量のカラー ピッカー コンポ ## Angular Color Editor の例 - diff --git a/jp/images/dockmanager-edge-docking.jpg b/jp/images/dockmanager-edge-docking.jpg new file mode 100644 index 0000000000000000000000000000000000000000..86210db8e222eb33e7ca16e36d39656c79d58d33 GIT binary patch literal 107529 zcmeFa1zc5Gzdw9vMGz&VLFo{XZVoZDfHWLRrCYi=A|i4mq@}w{x1nlaY{?03jeCfIb5MK=4VB z7zhaw@#Yu!K?Z(NZlRzcBcq_Bp`qTwK*zwigMQ}@=3VT2n0N2ry>sW@gM0UJaPjc) zFtG3m9^evSo)ow;DXY7AVdTtBt&GSn^6N-djRbq&*TzulvBf5Rs9QkkM}Dg@EV;97y+(Q690PVv8uEy|BTdVDq|#D;k_s*l?SY zU1=BZrENd@11gSr>b;w({XDb3H?cSWt(pBgvESx30m48+02UAFJ_roD!hwT))NSA( zG1Ad%Br!OssUHqP&tJTL$6s)X>I(#9pggtf=f}7gWY9l6IOQ5or}YZMN$(UB3l753 z^%5tC6bWX5cze_}ZO;d{q69NY8J*NE41rGXMQ_!iZ6Zs+Q zG<1#wd@1LOg6m;cet`BlW9$G9`dt(GZuT~KO}`2b`eFh-jXp%DJ0G@Q!Fr)kxC#gT zz70IDItA@(b%29j_rXDXoNKs>N7=JoWQ_^>y>QU)8#$nVAfI_3UCO3v{ih$q{XyIx zoco>5`JonmsD&Ro_lH6I0~Gn87JjIOA8O%;TKJ(BzVpF;I1xWQwEsKYU-j>U1IekA zSeJ*P*Qex*5@XQS)P$2Sa1ha#zCc*01^8e<;bIONK>Pv@iVuO#B3+sw@-fJLhJ$*g z!8=~p9G1Smibo3Qi2RTKtj@b5iz`|6i?Gk{SwLC^1HbGnJbK_6Fu=#<`lIA~2Y ztjti--VF~|QI~Kn9x9Hj`Vm)A9Q5;{>eekfs<7`lY=>E%!0;76?x6yk#6@Q1Mk^Y~ zPDxu^+}N7xpyOi$QKSpi^K2NZG}R&K8FH99?>rC-BfGz6d7x?HN#E}f)2y^*ow0GR z_o3oYxCAZPQGXwDB>5)V#RoVj5f+#V1j#hOQ+ij(D)t~naoqp-kaN7B!n&5iDIxfh z>te0*a3%jqSgDksJZpckC`{NEAuaPUT`~;x{lVB#BfWR0g_}%h=#qP$iTG&^pT)gy z8?GdFdZFiSlW!P@%{v9C;UHRs#o6<{LO7_84v~DT-ap}x+1VTpLIh|9%lDpF2rMNh z)-b=FtI_Zx+m!EZv_~VP(qudgDV#PwHR$V1b@YDk8}R;v(;zrVpL6su5lcB4Mu!vw z2YqV2Du;u{b5irIul31~XW<~D{E$zF^E|#sS85Q77-Q;#Ww$0@x^6^)0 zzc(R|7blG*us2iFIj8X2f@9XJ4s#F9r-pt$c#)nXQBqjct;D}k&;B|AGk+wF-wo{V}P zeeO_S5x`7sOoyxs;X?RAT^v}m@LDJ_Idg3ymF!`^g#)pBjQOU0MUbFl)jRT}f=Evu zXXred&!M1}{D3|9TLB5-PkfH45#~IzGugv@lQ{Vhmm95@0r^wP7Clol$Vk*Gi1w>o(znpqM|boi6>4->qAHz+4Q(CglTDq zPSO&wz-I=HTl*|OavS2%9vX4_>>Y3 zdSv|`FdFPSP?;k>5Q9%dZH5`d=O`fW8$N!-;~YC=t2<2^2B@S(3|B7XEdhuucNpEp z`gi8~Ij;moy9^hYB!s{=6hSqu1j?gcYv`|Ct%~#4XGn`LbTiygeDaTidMaLhs0;+P zpX40PlVfVQJM59n(C(20-zssbsb;}MrGnIfN4jnie>z?yA%Ch~-G}gTcup!`>j=MZHCJ&vjG} z4!U!vweH>?x9{^k&w%-(zS7R&!RImJwegyHMg~SfT?drUHe|Ls7LgAVB?}aF%`YTG zNA*xIMXVmh+b6Waq_$FAs92*Gv3x`-E-UBkbe-m$J+aoV1qQHZzYvYS<qM+&{wnY) zhtW2U&!a=C&=)s9=L=OonSRP>4*;BM`B#AA2K~2>;7<$@f}n0?IccmJ(Rz8aMSP}U z>{$I2!wGtNvpfHSplXw#ZFUL(`vVMp_(;X<*azV5Zt!&-z~y~D^cEd~YsU<9$u;c# zLgu@@msFnMJ#N2($>xc7e(9!=rfAFj$n;4F!SsvUwP`Ldg2yWLPh{rwNe(mtn{%)9 z)bsA8!YJhsYxY{XYpxpm8EXRd3)&81$1Mw+6R%$PQFS1fl$U!cm$`8chLv`sGRZ7k z?bvUEi`p$Y5*Z?!`uHC`PvmMLY;hJCQTG!Gml)Thd6TZ%l368 zh4VXlk)*0$BfmbSE$7LhN)uf5bJy9!o)jzJGrac7DDY)Eq6Zh}GVfTBKpE%aoCr0hQAcyu7WYhSIw+QlVeYBYot$caA--rpiOw zNCo=#wOzj9erw?-!SHT%KM)S$+mmdP(^A_D^0%-A(or}j&@o%;w16_-`6veh#b2{z=BvOxBrO<4G*5R3Dbw7HVduMeuyrUT;Q>f<97D08y7@AE!m z4M;T(oEp{7a%XlCkj>nLu)sQ-j;4BAm zmDN5vvf(z}OVUAR0iJUeqKLGYiy9t|ch<-#1#1VN4lFxKJj;Ci)tr9rAhg@QJE@oZ zoxyOIz{aE>uQ~hAzv6O0vnY`4g|19`#PN7*qsEl8lN#hSRgEX$)mjGV}WY znD6&lJ?hkZKH+^#D3_KqzaA!UxwRGz^Vgya2Pi=#P`=bQZ!+OPP zY4}W-sGwJVk#UZh<$)tz71ki-O{^1dNy^lX1fk9;%0l zW0EK_D{Bn#K^d3AgPs`E?%=XhsC!k~fX+A^WTvAx&J-psP(;oV9+mn$hsN=3J0;$s z2QEVBd>pQ`USpMR=>3D11Y^9S_?Y8|+6SAk{T*`W53OXJyF$hDolu|XxA^C2B@w!g zNm&}ibZ=oQZC#=49}~B~JdIT^?iVH$!s*xh>WSBX7)8U)rZN82Vvu~1&P&#lC(rCp z7%4e=gWpk+(sFtrEq7XGL^GjF8&`Eb-dx5;DLl1nL%M|``{6VMX z^wdgWwzD;jFM{@B-#%kq8aJJ7(_Dt4g!=&ZT6P4!wS8Wt@Z^+J4w;!1W3AKO@s*l& z@#gV(e}mL~UjScHqp+q2a-sL&1wF)3$Q6{1%8w0yXitcj$KxhxWT@oXtv#8R&G*#M zvXgv4Ky|}UGC~fY&`$hGGK@jyUu?*K;+10;?^q{?48OIEuwqp=QghZ(nScMK`-Qev zZ83_wf&Z>~y1zcH;}LI;yrPmnV)_=%@k+Qq1k@QYv$vC)gl(%97pp$@`s&BI{=4t5yrkmVu?hNJUVN0eI ziSp_|a;6mRdro!6M5#2Q<)leDufwZRQl*dSa|2~BMDHQN*Pb4(x_ z^4~(1K?0{|^K$Af^%&NNaYUnA(QnJSLa2mZN`}jRnhw-h(Go=w$<7ft2*X_^9`&?1W&9ND z0>xo6$3skJaLdY~iC@?ULLMTVx!7qWh#yZd>W~jPEm+9#t0A?tnVX!&FoAGokmWhK z<>*Y5gp|lM@}vabHV`OA)O-&@8mWzkfjak?(=tu@1Wq8j!8FxwggO!TdP!IwQX%<% z^g+gmm+Arhcm?Z)oez*5pU1SjhO<8Qax5y|>a|0hTAi9yMsGttekH+fkL!}S=~8!4 z9PxWGq4-t63$4>}w5yTA*BG|b%pdozFrzaZ_Hst*`rK-nYTs}{`b!d&W`V~lkr6F1Y)sU0X=MzXe<`J5*&U0LkPNipz-X_Q>YIywfnqw}@QC10lG zs{<)ee}k)T+QXVA{yg^!xv1$;sC(BahSZI8Tg!=ljsQ0~=PfHl2#oSBs&-g$F#+1Z ztM5-e)$hI5fBF10Tvno^2Kx#7Q}lB6;M!_ri_m7}(x9$5{4!fp8lObVywL*OVMmFM zkc^4iTg?(&e#;$JO7iCVwy>_CXW>$4SeKj9pBR?kBMpt>CN5U4iKZIm`y>ZzaEoFM zL?rgn-$uVJfFS!!xA=}D`fb`k6rP-FbcJv(nUKe^IjHAE4*FV2A@+K%<2hM(CG{Cp zNyQ!C!02)V-V~VV?UM|`L7NNUt6Qo>zX!N7T5Ks*f-o3e0mh*MIQdg|X&V}2{9V4m z;S{h-l;?+pO&y^Yk3eh7yYu2&Z+eKm-&UU0S1F^N4Z%TU^@o#i5Gl~}h#Y4Mr<|Z- z%(JPfylm9xQnVy$t;Z}^TtEa4dVUm|XIft?b-C?LyL@zMw%!^q&Bh=b!Y%fw=H1-u zfCH%gQPu_%vDg8P(}A;MQ1#~NNd2!jA8v??s)=UM@=QmSs73zvHS{GMG-!S41R!-y zqA)A)2-XQc93+BAYSx~5=8qK<2)d~ACM)Uvrgsj+GXsIB;2IJaY~Z>X4oaUr-GPI2 zgZ^)BisA}iYTP!uNCDqaK;j&=l{Qm)MThsBkm9N8me4R!AHMj@Rsq<1QyPiZn2^?s z`YYFU%DyI>Y`+SC#6bKpf1@{qfo?vza%rhc@7tJ~xC4qz?4p1Qq$cLM%699Sy4V#E z5tOUno4u}mxp8i_nHTRU8ng`%a+63scKDoFwdCQ}P_tK)9VOSRyUsazx!~QFM7P-C z9CD1(g~AJoFB#-^;E{YR)B?96=oS#R)2%X-iR7-W?3U-W-2SFCxV=<0qfK{b&{CFq z=~?@7wWW2M>BOl$q~)1HH7zdyOGb0~^SFB|f@{9{@9iI7Zr*C-q}eL0$zXV;K2=et z9Z>67c)i;!t-S8~pp#R`>JI7b4KZXrjE^~$SFDT#xfahyn3*~w_+sd($&8b9VK3`X z>P3`WK1-jZoAg#ekJhV{b&#_gjwq8$l%+Ls*?I^SUIB#C`;9X;DV4dhp{AlmY^;nW zi#!Wu=>zVcbh>8kaZUin?uLU5BEXxr3Kw92yeV=jwLNCTr2HC#l0av19j^D~b9POH zp3=oTO%vR#0Q6V>J?c5>TT?H~0IC>SgD$M$pkj4tZ8#_t4#GnVO*nHMuO{DGE^BXPxp&y#2 zQ58CY;pdr3Mw@ixRzB~NCAi$o9P;;Hy2dM@ev9qkk96IO$NV8_+m!0S6*Fb|M)MT> z)=i#iof~aoI03Vq+KPB>)kKm?&+T4L9~;^@fuON?#{8Or%NR}ao~64&de^mfohcE| zk!wPKmW8}0Cr+X4O{ONv{5ryruO*L+XsJS*`7d;ho+HvOL0d{A8|uoTVbCkr2=FZ` zTSkx6xD1{f22JV+%*8d=WC}(OxuwrM4O+z`aeAhWfu;rr8D`HErky#?yKe*Q>h$^2 zGdwP1E#6^Czk80fb@}kpoK8u}JCrj{oiLMPAyXVd7^zQbB=VU17o{2Yiz*&reVb8O zl0jf41jGA9DXYyDznhz9_O#v(Yq+*wmbaNk=cHtcQu-?ex5+L>wz6#bj2%&gXCZ{R z&Fa>zS?&`Bh-Yc~^%3Pk6-Gkj=w51n37E|o%I!mNQCA<};KupwY-W|aG_qt#3%ehp z_nW%!|4lR4#?e^frTunJ{@Yc3sQM)i~;Bj z$f(nA4BP{R;?nIUVl6@?1#{ZVP~^Ws!;OR&c!Ohj&;-;*3evZ$##asKu5YYYl>U4~ zjT+cw40mzc_B{i?UGr( z1&M}$AX7PWl_oC<1@Gl~?>DoIuBk3p%hsc8 z7#uWng0*1y)_ zYlJc4rr)W1$=~im_&?R+lO?@8@p*fe$#AT7RYxM#z?gP7uhv}dYD0o%jm;C#n!i`R zqxK#hOtEYyn^fYzsAt>@H-}QutXQ0QbG={5_3l7+-_iie|B>emFq-Y%^ls&RXZqx> zt(3p$=D6~j2fJH$DvRS4@J90kHD6=z%M0DGd7*k^T{$=edbBy6))A^CU}{(1jl+H+ zqx1?73h8sYpJcSgH`IS>sPAB1g5#Y~39NsL^5A8K=vhtS&vKG2!xo~*!2Ifi9V1hd z@+(4x!Yn*de*~{JhT4eGm8rx79yGAi;9g$Bw}f*by?6r@H_SxD$MI#X%)a#|2L}?o zwq+lQtp@vj@<4^=u^0+{J?`74#xo<<$e6d{J!JI0+_3)cUJ}UEu(Y6Jf?_Y>shcctHYd1yr(X`q1R*Gpqtmqd{SAk)XJeyFc@69u|7w3GFpdiLg0x@T$JXPFa;{ zJN)rB*`m#J5GkvY;E+vwVGL>s)8Qj4pP$B8c>ynKH21>?ayDaYZUE^5^V%e6ke8n% z#m>5cx<%C_J2$$R{zxbxWvfhiWv=jNqcboAxe8a=nbJ6HVWh?H?g$7A31VmLm&)5b zS1HV8I!QA)2MP^zV=_4VWJ<`D_J(B?i z4aM<3!Dch^*;=AoG)JEp$d6t?Bv}qy6eX0?4%v!r&^7Fx#Y>a$a0TyA@8#}$~P4;0@=z*kny+G{8Z*wohrUO{%(5} zJdi*5(qEkD;aUpr#!^^i>i8(Ze)Ge>6^YBp;hLl&pLwX-k(W7H+ML6%|78ii%5g=V zB5g{?--8Rxw*SNxD`r3cUFG{FHy1Hx)sfQ2N1DtuQsek5+dTPIyI~1zV@pX&tl9;3 z@|7R_1lE_JJ3v&~gErKZ(WwP(vDvOLDMVaxIFSCuNT67gpo-iUGYfOKpw+$ z4=LzNTE4W9(fBA{N64e<$o8_}^Lsq!qdeI2)LKfJ$L{kN_AaY%RMbp19qN4= zwIp|p32xS!$xODEc*8R+DNc~N{dl3O^;0EfQV)YPmBzEPLM^`DL2&&W}iQ+zM8R>SXTNcvKbdDPm8=ejgJ zqj^O!iI8*azs&sW9a7nHCaO{$)D{+tEs8ZB$sck2 zMX+)rmCm^K!HJ8T+78&OX0(P}XE?!L9xQPVl#V@U^Udb#_gx%cR9E&M=2D}4LTKk4 z5+{Ihi1bS^rdKb+V7!^kro5~}z?9<}ewV@h^FlBbLCv!9C)az3MI~dGoox+kLe?E+ zoWzb5rG~m1BwiY%JkZ;|*bR3HsV8GB;ZBh8W&HOGzZa8-DKy zjQ7>XzU|8)Zrd}i0k9|>=O#bQ-?Iix1Hr8+#$(xvk; z#{wS*sc}f=Lp@n8mWEn5lS>$sQfRXvo3arTY-e{<^7&O9x#cX`<}TmPN0#bV4^u=B z4|Aiv@PCp!X>z&wesDM^U0}fb`29+F3g@@+LDk=6$+hq|31Wo#yQBwB3@m#yn(n!b z1{YW?U6YJTY7+e-SVzu&x{lu@$hdqifVvp%R;in!6;(N{YZ3MOBOtnOq=TET*gnR0+HHAyih# zWbbm;_s$%%HfA}ghxfHeD`u|4*=o|iX*1no46tN=uwLo;F42R!{*5qn1{Z2x1|9bI zFjE;$v98Ij&(qs^X?PJuSR~QcruvRREkEwnpr{y0QLIsM0S(R+I}2l<>K2XQ=VGWc z9K=u+-MC}N2T?KO$In6ER^VEY*os9TuL$k%neDUDc=+Jq-Sl+WbmV)tpGF5M$IY-D zd2{T?`T(cz#%49jZxyFAM$iLPSJL>;O6*kSq{}8gA3ap9D)6|YV5REv+!jT}liHTn z316SB5zMyE-e;%f(A!Gc@X)a1bKV^t3F&kd16?=RS`I#wVyA=+Y}qXuueX~vhP^(k z+frA0c~WX->~a$mx0)d^bs-$Dn(WaQjBVOCp)1UjWV#HmJ{a%t^^Da%*>V2 zz(tf6sWm$#X^NJ#PxF$HB$~Vf_uwVh!hGizxf$B0X}5Bu?4xDKE56n1n&q`5P*>r% z8Isy4rx#oSxM?R;)-F?$vpRc;brD%@bAmRjms&=;M5Uy{+(jL2nKoF5D;y}xkOiLu zK=WR{+O5m>U=KM5i29|^V*qs(LDxi!n;$NT2gX~MCR*Ye z4~}y0Xxzwfp_O@BPE)6WJQ06eFTm(lS<^vl;I`Z?E*3!Tik}6|D{W$*MQXV{Y(2_4 zqlT&{~k`tHDoonCaeJb}Trx7gQ z6f#O1&h3WhKj8AN_s(3gR6lxyWVyoMJZfJ!J;2-O5uQ)Jm zd29vn+B;LV^y!1YMR(N|J+MgeyqW@Vs-}aik@i`P$9vAuEC3Vs8}bT+P}74-R!Yhk z%8Qq4oM`&>r|tEMST>;Tc~!mr`jb|@(=lhzP&Ml`z=yOt{c`D?Yj$z;IAGl^Y`g1D zmiwk3d7+h1czIg$@_0s$`|ul>fdc@)P#kV0bEuNyK35y_?Zm@<;j2Ah`w}30qtng% z+U)9Ab#Ty@%pv*#9CQ|4zjXp6!POI$u>}SfGnzcKzPQqSFr4pnGf%*E_Er8MJt#h> zk1RhI5g}X?F0S-SFgwUsi2PE0kkgI7R(+v6zu2gVQG0!B{{0K}r^~@q(qi;2!uknm zhL@hfkFO~&@oFjvN)@mLm?-tp_qC)7y%W?5EK}K|_9UCJ(41-Z`4#S+=7{%gr|PVu zCP8tr*;a|)6e9&pi%{$};avhB&v1RE-dJnZLN3cBiL@FH?A& z*1Lth*_Mp$Dv5&}~}J9(x#1TP?ajq?S*}DCC%x9T&Ai9Sb=e1Dm8@q0aAT5bE#yALzR5TF=kE z}n2!d(T3I*1xo^nILWG-E}VbY0t;2u8%VStX-te8WYF0&P<8%L}pu5LPC=4 zXsLV_N9fV%<^sN74gc(??qr+4Xr03WIBktfhcI|*Mrf>BhU-|A#tEp>Ykp1gjJ zSy(=3!DPQ_JK3f7Iaj*ki02uqb3yE35XL4Pge}DFE;{0lzo5UnG5NGgj{KQ9ze-J{ zTBX!bRBE6_Q;Z0DD)Rz+s4$t=ZtsFM%&P8@*$m>|NK9J80x>`C@WcAPcrjB4s~+WT z>4TIvPef=1u7!&A_}m{2T3?f2_svl5?!Z_^o9n2D55tEa?ujvqvzAIbdW6qo==(F0 z1hJS1wzzuW3j?XoM8x2*Ck=#T?;>EJ9GVzQS|Qy*Ab%jBn9G_?*I0m@Qx4SB_Z!8qqHma!pBw@#i(H3IV9?eO{QzOYO3*3kMYe0K&mcnf}5(5wx5p( z@?i%`rj+q-Nt7*Cs6Td6@@}+p7MiDhU7`U=0Rbx*IfPMaonWFOI>iEp{}pj!q?AzFDNPs&S`$6U0K- za>?_<0eNE;QAZzu7&U1xk)e9)kdn=ggYxG|#G+RKJj}OC{JxO?uRb&IS|-QrwB&k7 zt)wQuofu>C=;&MDoorvB_&BRQV8*qtBaF?4#>=~-mYK5}e)fJzZJ9OK{!G6{jN)ES zkDFRIu5#?Oq$8b(vYLnnq^ZtuW~Pl*t2EdlwQFAh)^QPN(>D@EqR-eKHL4V5i3=7B zS`JZAE>YSH371+#+aZZA*GDKX{fQED=*ldjlJIKEdpi(Q#UKr`)WOVQp)#0+99c)_4N$!ASFu<0lGP4z z?=H?~45tDL5~M|L{4rHd>oXKxAYz0M6r{>&Wk;7^zA1oi0=e2Xn%BH~$Z$}bn%?;W z^pHA#q@v(=r|+nocbdsboXb^C!&BXPcR9BrK4fXH@0(Qxmb;iA7ZgtVj=kaWL+|NL zsIl?VL3`~^zK8U+s#tcx`u#`eYB`g!JNk)$(yJ$UL1la2s~5%XC||xiWbn9cNX>BU zBp&nqWU>D0xZ~uPa|87ZchMo{k_6Cc$Z;pwqHNI0$k()CrjS){2pye$yN=Zvy%l0f zw%Aff?yagR5K$DW;$?(wOpN}Z&Ej}dD|!}IqKEOpF4yds=vl?%&sSB;j}BzAjP6wU z&x_EKf@o?K=6k>D-J11mKexc=lTQ$=J@NG%b#kCCDz53hdlL1@KN7R&+tNMOfeI;o zJ(5%Kv97}XiLW`-Q>$C|W+jTL8Y~h_9iEGM3=5njN)F86pGM7N5$h;e&hOx^O)NLv zsnaOgJk2oBUbMN@Q#kr2DH4 z?mgk{%9c4&FG|5piGyYcO+w1ooN4n14<=Nu^};EAJUA{noda}p~d>Ecg7=+ z*67g&dD5FfoEpucB)#DGR*z|hnH_SpoTOf=N^Kp>q`g6DIONaaZi+`Ab!WO@omso4 z>(lRl7}Mf7Fus<)!kD@BZMoJjg0xL093@sCX|kNzPwZh@bAr7cnB2aedq&+28MT|$*>Z!H(LDDWg=xfIuw4_Q8{Dv9UM(d;*XnP~G# zr5dn(o_oWKtnPhjdX-YTgF3m9(I|u+qgd8&^}<_ar1bsFOb?BVqClofxXbJ+A)}9? zcWA77t=43-Ir6IpA~6iJ`;-Bq*_m@7G!b3?i|5dG#L@cA1t4iHGoN_3coD6s=~Qb@ zeZ=$2MCs*$nBj{IN|Xz^q1*>NCuH8VROd*#h6@Tr?kcBR>66Yet$fCBSuUB2CCM`I zed~rvhhb9l$gkU)4OAaVA6d zgh9P$RvO?MKAQTwgHFh3{YC;t&DX)94D{k8Hs%~R>9!OK7c(+KF zRG40weoSGREutZdvaOcBlP$D`(|kY6_qiVCn^TRaS-;4@~ysM zbN+&&HfchoCpN0Y7hwAy$K$%=mbcLcEGM?UVXS~tx| z;qt`a(*os%=5%o~Y#Am<0o01c3Z{JUz*aob(b^1FY)|PWF|1RgJXJZ+DpA)Pp|SPQ zMdLPR6tnkFVTyfzv8VHhhft8=L8;%0rVQqWU9gf&yn#j3WQ9IQww#J-U@R#|f4AJD zXk)ueNzU5z=4H(m{?AiTqMlIka1BdChhD(|i`Tdy9>kJ7o(}q-di<#gxgVJ%!YGXmi(yAOd&#Go&St?dtGx51bWOp6 zPXd`&z zwiJ`F)IuJt*9e9!uh`|S$9KMhce5R^K)L53>s9{sCbdJDjkQ}{E8@XvE`(CdT`6E@ z)-Q;)TrgByIOx6*>3Ti(C86DXoRVASV`icUrc9)2ipy<9%y$^?X0o?F9Z_#mc*_O7 z$0>J5P0m_EXOo+ZNDYNB3QKQNieCVe18icY{w)~GWs-Q&LII7`L*2kG*qu} zkH!~A%zA;J_qTY*8`Bb-ut=cr1=lwD_F`zWt2i!#_uMSTw6nUj zIe+~G}IL*-a)yOV@QOzda4MMMc z9Q{xh5nk_$Q(2|GUVM1>s>ghoE)h%M)OuG|^3*QR46<_^QLvzZZAM2?G2*b9WMi|8 z6pTHus)(?Po^pt{X8+f(D&tvmtZnx!0*MNrXTJ!p7Kd744o?n^A;YtXJOU+?gH}T8 z@b}kv0z(gMOSq*v*v4D1>hT6tn9Omyio%G8Rw>F<%)6gQ(rrF_08AVM2 zOWbW=lo3Tt2#9k;_$7wHn_Nep`aOn$)>Nt%$>ZtR{!2)sZ-8QOy*D4kAI2 z)gAzFZTdfO?W4aN3cCqY|9Wsqjr_#$)iypkP8?*|o%BXJ@F|uA9@_Eavy1-4QQAvJ zE7-Jp^v3fwkwf0<9BC#!^FaP5Yv$^bQK@ANk{!OF;a|l$2IIC>%)J+O(ODy_KG8#; z6qn)#`%>~c%jg!#n{1)zX{pUCy7b>t98A8KXF0a^E%&bviGz^PO0|s%28vvR>10%` zMtsick}G(fJwci2syy5SI^ui%bZT0WZ#ISi3{1VXYgZv_i zR4-2^(tYwxpLQGOu0?{4tKV{Qr!Nq&aiOYu;gP?+#+`O{)ASH~wl@kBcou*(8H1_2 zfMljx7{S_#ZdlPGy=`8f>=n-hl#5rVe@*F4)I6PRA%eb5e~jgux0C#!6NjV(eT9;t z#a5#4>Na8itjeik(uR8cojBy<`==7h%rTZ`9fi=WCvRV=gd`~tJX~_f?|^}pFXeVm zN`{f`{(S4$HHynUTT^?dIQ?@_*+$|?+HpQQUZ!S|sHgS|lj-ESqm)+dIc6;|p*6=-?s{zJl@`qR z=Rdj-?1DX^Hd*%j;tsk^(8DOHams7Dpob(jA7|IZw^EGj)He$Undr!3O++n(8;DcC zyj{$IinvO+Dgf;4C`{7Y#Nu1!)D%b2DL=GQ_2!P&g@-s%|FA|ohF2eH$1FW%JbU0m zp}WVf<7mq@?Vy09D_p;&VDf8)3? zH)S@eb=KFISXs1=qDLZ*F+rlu`hpZ6?z2ZZe;v0c)`;&(GHg^;URdQEw^VGXi4Z6r z{7O^9K{1}ssLG5E39Tg_t-tP(v)aMes;$J@f$fivgSQ#Jyg@JeysUBW7G)CNY6MW( zq~p^(5+)$F2!3!{54<3zxpf$4cFtX9dhbmDom6ldgD|BVx%=qn{(ne_jq1cGp3azF ziJcm-t)sY8Y=dfkuF~qtMZwj)nn`*LBw1S}JSuGBsrPnOLIG~;Ak9xq`(we^`;|jI|=@rf-)^&T1HxBVcP^ zk?Or#j2d;=Fcz_5eD*8L!~Jho|wtCLFkezdp`dn8~??> z2>BlUtwyOhZ40!#Fw)I)j1yM7Ef~Tl%k^ADQS#H zm39m1oK6ZrnFR^dY)#9$aSf6ql?T_7VP{__Sb?ZV(I4@|zv~?9dlUb=Z2AA<%{cx? z@d$u5k^Uvq|NZMz3pqDl$me>KmApQH^gFz7{szALFRw?Qsop*=P&=3pK)xjO9JP|~ z0rAti2Rz$B5&(p65ER3P(d9e@2J*WtE&g5Szsp6aC%{2n!*Gyw{e@C3;-`;5qVV0{ zbyogQUWca)6gz)Z-MO-XULg-xW#vHI7*4J$>aX9JAcgNLT>2OSbftxZL?K(|u-~7X zyu68M0lBHae!Ux5e8@sh^_}BDvuR*i^AA4#yNLaLKMW(^r4zGD&1HZYr6pWBDqP)C z>73UOTst%aUirou`XT*)tO)rb{r@&i@I(6lWs`>=(hpS1{jmK%Z2u42|HJkp{L%LQ ze|`SL_W!W`Kal@_>W@kQThgqd%BcjYm51iwg16Aq@R^jT+a(>flV97lt^YHv{};lH z_B$`I2KfI&j0!G1fRuCi8t%=OmZ|@t_w=)8l{2j;X|_?2@X0uE=#)9RvNz(Qa1@rW z2|4bIH+0ie0zxvWiT{xg_V?QUIZY4~p1dGrMn3l$98|(E$Gc>o9j5K{Q;UoiFw(!V zSIT$(quI2|aQzaV8yuvq2fW(PfzWYEdo2oVDl&=#xamxerOnR2J1=2<2n?0r&ns%x ztLg%WhxNcudP%cVm%hE7fK@+MR1|T*>v1oi4y;iri8hzu7#v3V*TC6dtjyn2$COW0 zsSZhoHIC@Wv*@4`xIG>8M@@$*MDzWzIUwy7hT>6d$YVj0jUlFAy}LE=Ukc`1f8mwVg?J3vX zS-$}G-Ut_ruB;bV9KZ;$>iX7o`^%J_dNwtgTE9&s+fyLy5c1|f)fs=-6De~8KlsY; zvRsX6f7fid{vWQ-JM~CBi>h^dy#EPN)Zs~{KiU59`-hnE}%A=^Q zrMteEhutP(dF6;wCvI7JIm%%ZCM^L{4IJIBbXRowNHsslLC^#O#Z`w^_AO?I>l9B% zIAf%b-w$vbPEE~??56eNGk%gUpbE3Fw^tN@ZuMuurT62eZZOoOz9xui1I ze0y!YclLuC^EP(n9w&w04p7g$GH0k>6Jc>(MR6%Rv#?zI{H@%WG7=1I{7X~9h&Zbf zJuT{<>zznZ`rRV7l=AAd$0%kI)8%!lHmjR!tD5^6%S{WHF+E#?Ms*RcAUmB2L_Mzm*GjT)?UrZZ2P?msE_j<6Fwj zR_{uP{~~QhNxu(ms^)xOGM}z@hr~%T1;{+l#V7fR8<&-0SLy@`^RzV!I=DG*bk!?r zUGN@1IsUk5ANJ`q#YP_c^}beO5O3C`rt_ zmcoJHoh`RA15Un7&RaisSB9Vl+iHZ|wP`jiWaAao46yHOU262Z>O*lFv5Li2Y!G*o zu4D^Y>rZXl*z)0>_{ve$6~iRzY9)9^n z%Vp^Oi*`Y(xQ?xETR!s<4{8-*lbWQyfZ7Kc($SZI37Wop!KW|tsL<4cd7vG15W~~^ z*JWj0oWqT?Dr0IvXBreOHA_%6QW8hM+ztAJUV!VgY)RnXi6X%#19= ziqeTF4lSc9(%f|@k@j1?`S+Q|A$Qa3svmi+j2Sx@UaOg5rd?Bl{%pwO_8OtbHQ3}U zCP@Zx&3ERBMkH|#lowvhi%NHeNIczN_}rS4QB1Fq94x;8j1(0>ObPU<#(9+7qn})^ zmxaB_^AF{ni=HCSlF5AGmX1&ji~>FD!(o8Y$#IVn8_l-kuZYlyv-L%skezffN=H;e zfB&esi~fz&WYHaKqoWs*BiehWPwmxO;deLVzNE*u#|kK-#I8xwE9?cJpSxp&#iRKB z&vNvE>eCwTIu}(*i?|Zp0bFC}S6pL6YK?yBD`J8AT?ms>slcM12|gdsYWLQM=f$m8 zw-Vo`Dyq$+A7E7UUK4Y2sMc`C*0dWKBH)SM> z_2>+uvjld%dT+n4RR5#HVJd!##tETwN5}|JVqm0-k zCHc-#R2#Q%@W95`y=vMF=~ijR86Qk#)tA}E6FPP z&Kka|Tq9N&resg2f zn>$&)_XFw^Wo*aef}RqwyT6%8Rx$oO0f9WCnqdo2O|&HG&h^HN!GAT8EPP?%f)5nh z!;}#9i%lePvg7Vfa#9@4js9ssd1NZ64g>qyN~SGzmo3KRM(oxwKKTUhtQJ=oLVUs7 zIKgL1@aUldWS9;wp8$dPJ^yk_|>t-pde8qoS^JBDJWCn`}_2fJCv&J$M!r6{S*~m+i_%W%jbCFMl(i9F;U?w?$ZkAL!29 zxf-No8f;O}KN!F=p3tYr!WpeQ!KwRhkj*;R4IfmKb5)F7u?^0OqF_q|7^}@}L&qAE z8&cUEnja;k^QKegP^pfL(UDHzM=X;gW>{Ppda_N3CyJSanu7Og&I94Zvnmm#|Mb2< zWebaR6Cr6UQQjO?C=uD?6FlMHd}>n4V+^n~cl~L_h3E<{@y?_inrpo<8MUT5BV+=q9EjxxO20?wa-v3^m&)?AsSz5Cq8=b zwfoGbZCwxMPiJ!x;7ph{&V@jtiDHtVGr<uL<%;XZ;_rPTueP_ znRIz2-56IH?KyLgRIvC^hfMTb%}KN><-?dki75@4;Qgi6lhC1Q+m@Ai zjdIx%_Z4V<`-`5Y_=;jvAt6083g}(>sq4Af^eb%ohp>1E1DILJ+={v3FlJQseat-# z23aXW39=k#`aF@ZCX)*{)AZr|wEN9Zl$hsF!2=#-ni?_(n>C)qV08^Z-tqg{qOXv`;Nk zdbL{B@Jv$36G2oWBlZk0Dc4RwSp9L{#Y-5=)9PX_+`P253hr-o(+5aA`s#9hTZ+Bi0FszY*MX80NdVT)iKOI~#L3dX z+!Q}Krhb1Q*^YTL)%*$uxk z&@}N;JB$+b5P<*3&Piory^S(?N_BZZ&s(>tTT8@<|Aq685IJ?v+qa-z%csT`~6nx5_H3SAI^LE@OoKYGXy%)Xtb(A3Uo?0j*CM_m(eCv`SaXfpB%e6V;_Dy(f;N?c>A#bjL-i)mMmtRb3I(y;07&TsG zx`<=-?{fgaWy9t7+mGhjZ|=?l900`fpVYULSa}kUQ?NMc=CCeM_UT+-yMi5-P`6-h zq3lzZowLWo&LUJbrE}gi-|cbrD55|hAvp(ag`soG(b_NKC8{UNqfFGI*%7~l=rNxYtvwP%VbcrR46 zcXA6{e`-aF4r4pvYsmDK?4a|*&qf3}DeK!(>gT9bxDRdvC~~DLX=Lq388W<^Uj_t- zx&3NkiXr!PHW*I!zF_%?!ZYKlmDx6Y489X0PsT&0RR6m z2Y?$iq^T^VXB5l*X19b#q$fnpHIxl|pkHXsvywAR8W1A8xfBT|h z+JJxYAu`%L{Sdkv1fRD&j=z5A%(GcFL3|X((-F3h99Q9C+Fx#s?^M?=DW18TDh3dV z2oV9-B2r_UTAMod**kIESaM&ox@$Wl_dILXP$!`@oM07a~|G%$wq3DTETUr_|T^7)Pmb zLrTxoaLYGwHh9?b)lVWM-HeF7pd*u(6TZf; z-H;hmV|1_c%Uqt-!u9^}g&K^~wZI1NOFN0A+g0+B1@>aLU#V+k{xWmPOy})~Z(N0C zWTuICX#A8&Pd$ney?EVe!ja2dZ-p(9CJ#vGAV(=sr-`x^)#2N(QDXNgj_pk1GA|Fd zH;OAtx7yA>(v+HPnV)e+XQm66xKO43g6bEBCgAiwiX@nuMvSqgAg(C4zFuHPcyF2WzcI%RuT<2j3bM2A)g~2+f?4hmtbH*hnqSu<4dw;`q*d2 zskDRbg~^LuzcAwb*+$^c9)m~8dD_Y_QW2cf=JN~Z4KG5tF0@gWh-nL>&4TKwhN?xN z%!asL%7v*L(`v=;nR`V=Z9Vw$Ff)gQf~(BQ)q$vek8tFip^4Sm}51JL#4 zL#U_5&rnZAEt8G&T=h6-y|~b>fT+_i+K-Uytx(QK2PY*&R-eMb>J!Sb9IDV;9!tQs zSg@vTNEXMhz$uI9CSC9@dE}Fwf=JG4uJF?F+lF-(Cp#~Q$p{vNR~Oko;9nkRLH14N zEzAuyhYB$dc3N1m4zLwnOu3Eq&wR*OEF?Ff_|yl*6&02QGk!0=L?+?eR5I9m0-0=i zNNUrAH~^K}Y{41Nm;#TF8CIUA79Jbe;mwh;b|At3Qh;O3Df{? zf*N$Y3JXSY;yQPzK@<4=c)4s=-~jP$EDsEi9xuY3z9Kk2-erU1EK165n0v$$Vepl) zhVa0~i~2ZumKhZVbV<0b!D}n8uRtGBSLr|p?tB#-B1PTfT$s|^tohKA(S>A*vIE=R zAqh)1JokZLix66we%0?nwUzpBD;zy5AP#w56?ijgs{v{p%qCrzgv3@G0vuKjlzsID zVmHN4kf3$?Yp3KXkcT5~4lTpL^W+l;a$(jk7eKL_!A#-C5qkc5E z3Ht+2+as)+>uRNk5_}w31Ow)jr!!3JAeYo4+}q^pM3wf%EV>vb;{fn?l+z1=Em@O$ z4Jw8X3uF4;_5g85{UH}k_qH+$U#%ngey0{lbScdlsU95D32ZWrEljnS?LP)f0f5Ea zW8&2is{1ay1E22H^Te~gdU-|DOMXX_Aj>(=YG|Kv{1*j$IN5$yj#L#AmbK?ioNQ3)#Bb*U<1b1qhZnU zfo>T(ysjN%xvVWX0|zK)hKmmg#CD$6b`>QsI(MlwO~BXV^a1o!E2_tQeh` z#|X@6Klo-Xy4vckQ}uM>JvRiXmo!#kRf*4vE~TUdvwY*x!oUwlKeLIqq9grb4GFI> zNz3SQ%gxbuVKTP>!+DTjI$sK{m}??$_@ z>DgoEk6w(%INADIF?K^gK6=zK8OP%@p4w=48D~DWJfEnwS-)#`nS8f5NJI|u_7H!l z(>0fzAyqKI?#OemL6mcbqX$5Or4Z-`t;u#0w>nqf?3>W`A4P4L3_v$#dOCr6?dyfV z4En#6FCdM2=V}?Ohcc@*K%2gB0^tMb;A6xC;3hR?6( z6DK?F4g^Z~CSZ7|^%@?er%N4{o$7k(zJ8lrp9rbIJwU;vQcTRjKpi z76+w+SU3w`O_w0Az+rwlnQYz7G~E)-AX^!$@(FeM-&MuS(*7 zZyVxh0P`cY^y(NJwkyf?>lXX206`@cXwC+3$MWxHYRf(<4vQ3B8RFP_2lg^@Z1Fi8 z&a~>olu&NH9spjA3j6%DV(@w-W1J1OL7ycjZ9qf=Wd?YFc;!p?)|W{g`UstPyZ&115`Dx6TpH%p zD9zruT_Z7iAr}+K7ipGf$xCh26$#Kh9Fv=~+k%y7z_5M^!Qyt!%J?jU;@5)UYvR09 zC-QuKGn?Bwq@^R+p)Vq6ztW!pj1Om;J1n$Lge5`IZHD=2*=zuP1zqF$dtdn;{_QiV z3S}K#6Tb01Q`zxZ8y%J^2`7O1na^+n&flb3wMtp%hFwgEd|?3R{1sA%aY~EOA+e6z zg9Br<>eDQlChxXpSukBn(ZnyXu&od!ak-ZexpP>}=B9FokAZt*)%JGG&M}8#Dm*V4 z!)&OI;H+;@MW9rjz>YmjXXNVXlw<-M^W@=M{u)WJQ}GgaZZVso4s-Bo+aymPrgSF2 zNdD=G9u|RknO6<`4X9urb_)foL=MAt1L)%dl`FfHFL&6c_?Igb5y!zDIhQ23KD>|q z*j85RMdOGy|GeT7Ucx)3Q{!%mUtbzv>m{?EpJ6U2$TXu6qxYLa*=1zhYqhx-k}8Du zLE%dtJy@s}4O8eCTd}&-?xD8{+mo)*NGFPilImGnn{Y>|JWVzs&9tY;^h=~v7m*A# zU@1nQX8{tPfVPBx8HWaVsi#1X?li=0 zede?6_ubEP%%%9B<$Oe9ZD#A!-7ooJX6Y8%VA=9Q!NR=HU`DeZS#<7^{Aa*rP6?8! zX&^pL-YhG{%-ya$I)XAJU3SS6+D3JE0$x~!P;T1dE~x*AcY&ft1=R~X^OpFDZhkt0 zeoz>Bx#2jV=crlx=+Eat{zBLk;M1#*S4(6XyV_-rQugr>KPO73o)4?B6ryN|HY)Po zivtk!!UrHlMVU)g{hE)u?e$XRay#vTsj z4yC_8CO?GGococDLwo?rl#GR{y+jo54sa1lC;!>g`nO*HAD;60e&XjJ-Y5E(_Cfz! zlloWR_aC6RJo+s_7iIwXB+MLpA3)UzT*i`?N8dc>zw`EY0~Z+tG-Ur?IC2f(?7pVN z?iKKB-{rry|3}~PU)%qOwha0w7wCU&|C`N!yZx{2XW#j6-2ZRf|Ev1vzZ$>)x9|UN z-2YpN<^LFV`B{JV+k5|;^Z&{I{=Yf@R~qEM?tT1kZTDY&-+yiYoBjUd+e3nuV@_={ z8wQ%&SD1Utp7&{lwEqQW^mqIs|Fjy%p{rqG#w6ejF5d1KWL|0r_DjqpS(h{E?HesF zdkI|he*;;?UHL1@(G{%f-?1?!=4s%`R}Mhkae#5PwR+ z#FhqKPv<=5d{&j%kymTkP}03t zrl`?A3#{w6ZxejbX|e#rvcxg}#HCbl(;Oqv^5s?$HF2?-Ot|@cf&YUY;`v0sX@ufF$qNGTxEzYgoVM%DbB2!~Da#4^yip!0echNO=e`SKP>{Ih3e{Ur#Ec zvpo;D;#_)Zuw}a7OWdP%pAc}e4K6^x?84*G3FlqPvLI)v806;}hLZFy18U+IsY)z|5zu<)w#dJ+oEZIrI=Softoi~vqPR!*>=aEH3*~3`b zOf0V%hT-g-qZfHq|wEm+H^luON^pzSgX619l z^H&R%$+8^w&qu!QH8V{wx$p*Gcu!}%Yj(Y3d93+?+UWtC7n22EH~3fRC{wIdHG}K|!;K_COX#;c59; zsXVt-QtUkuHLAsQrTMx{LM>C_f>VuR_#sA!!HZOxtiuJ~;uiFDvr~GZ%Ccd670!yq z@9SQ#lassUg3d_4TiF68B^;X6iGKzlq-+5l)J(T~ZSBmxR)Gsi%G_Miu$9S)5Oxb^ zN;-C{PJk49{5Y@FWuC@&iqZNg2LrR<15jq*{xM|gT4w4M7kV)%TZuP#_&H8u2`sCw zaYnPPoFt5bjt3`~B*0+i6TLO&2KdmwgAIZTog%zhRSda9uAV<+@QLQNMY_5D$Krya zxrUERfzqwOcsbXVEIR~izK3k7$zFT26FwyMSkQYpmZW||)6ZEU*H(zGK9UnBW@$ll zyy%`_Ptdm}{@$GEORL|!9 z&soM628FHRQ8`^%Y$3MD=OmeDK1Va-GILr_<7LF`)VsFW`OM)|t_$FsLAAGfK53VC z!txv8Sg&V(Tzpp24R}UQt-8uFlge7GT@5O<&$pfCV%n!;<53^P$T?ofS4|{d9RsbB~;LcPWn&g)meIynTYW{VGT*Nq`s6W&*Z(N##mz9S>!@c{W z=lB=U6s?!=tOC;U{wB#%)B)t$t-*2M6RPR96WC`(J9*Br!o zS&XW7zgsf_lchKGH#ASp$bj*`5#!gl|#u4Gnqz4O@((s{Q)0p-{@vo!gs>-ocs zE`tGKj5xOGV9^D?eFteOHA}9ElsN~Ck9A-kfSU`6$ls8SAk5>xs8tMtS<%Z{mOWX# zYXcAl`>2rJtM01s@JQ3HckgUo7|u_tws4QpI?Py|Rt_zjh&PlRdt+{$J#3Oj*QxVD zhvn$0`B(^@!kc`O7WXgV@}D;_mn@mEnJ8;mFwy$5)-qrqse&j zdgRj6>IcQidC10x?sv0D^$8t(wm^!76_cR(Xy;xFV7G!(EgH(!&oCwZVjxc_^XNDf zW>l?Jgga-$o!9{Z2RXCEUoE6-joFPmriq!b?w@%HaHUUy5vTu%DA$?3=R>m5FN>%o z##G_&_7X<HwOIW`_yTaK-O6$Vr@+_sH-TMp4GC*bB!Yvr+mhBRX7N~qz%ewLvU6f$8AdJ}msETuU(~sT4tG8kkWSO&fsAh9H8dNJsD{0%6#NxP+fBRP3G+D zHJnYPt|$k?nGWP(crhKjVx%X~7|zFi{{&!H;kou$R%;-#P1bMJnzFee z-4hWLtwLoiE2h@$_nKG15#Z90Dcyxy^*1JYai55mz*&iBXY8sRSQCnptsEmX3QinG z5PF~B-2ft|_i5ZajyV5kejGeeF6@!^b0qhlZo*m4KuvEv$l!l3z$(i>r|YA0-4ien zmS$L|FSdM2w^!JxBLxLOcFFjUjV7p+;kW}?{JWlq!VK_Nt+q@8(|EY;=;Le%Sej3a$pzK~OXDRM z$EZVj#!P&j-m=aE+A2_LH+?ejozsBtd=4egNQPYSGkjxU?{jjL*o`XteVDT>n`T0H4U1h)$$*?zdI*DWG_BUcXQwA3MoI zpv1C;1~sxMJv5f&?E2Hvb?{U5Im{-LO({|Iw2Ej){k_lSPap`4@%A+v&Sn> zB=trxM%mEr=G_$SolN*BHLn~j9A4&L{!BE?p);MiT#YU`ndf-(3A3KTvvp2m z=ZH^bf+OS8FGvr1gW%6|PbE5ukQx?dh%px?7DPvRn!m>*-6pB=ShHlTZ#~Xmv{(RBJTyltCw+T$;1D4@B2@LQq4tB@GpM9kL})C!TCb;i z3i0u)daQb1FG)oty;r!(M!~s_9RG^9$|(niAJiAJ$Fe8>J_l9&LauGozyLBMH_Mk zaMutbc>pNn??x1|sUm?;^|rVaK|(|A^lJ6SBIK9E)|@M z6rJ;HzmjfoV>chblaQzRWxO}eXH!hRk%|8hJf!iMOkDn+7@~9ShT3HTxpBQG@`@@B zrxVR6P8rw)+_F=(PIpn1fZhRjlFh%}3TmdGmbJ}G%RnUo3FkJh5k5<&8Nn$*KF3En z3c%|V3$ltHHC+BG|D>Q1muye)O{gyZ6qg%_?;@DJ3Y)O3QFZR)TL5NyY-512-+xg* z2>6&kggX~uN%<1LQucp1!e7(S4{i^69?iiG>U0q{5^*QXR?rxKQ^TN83+8h{ZLb8K}b z>ZgN7wh0JMk?=#LORQQj7}%aFDXz%ho5rX@A{UeDTYACer7)+Q*xNZF`-?n@d&wtU z;~G+A()4$7*{6KUU25$O=B67Bb!)l9=fiYU3(>wpaageua-H|!$h3E6DYXSi7Hm@b z^0?*4QA`3fkb^YJZ_AYu?2QBv$NSGFz|83EGuP#D5i4_*k+9 zd6vt3Y{gPfs~13SIKHz;-4TAj6laQmso-OHhVO(3C&V-1=vm3g~_t^PBsm74O04!Nv$XVpH=$0o|rF@9S<)y{Yi9b9@sGI2Cpld3EXNJ zzKkTGgKKxr0`5&dTKP#sJk1;hTez?XU<+lT5 zp3~x8Ba)i8G{^kl{s5JG4BC#};OtN}tA?BUyqIDA6p=7oD~2r6g`Ca{$QA5?*-^*& zM5l*is5HWaufKN~n+dZfKneDakK<5~_`0Lw?({c7Z`k5U)ci%s_IFTcV3J;58bG@O znz5P17UIE@pFC}|`YEzB$=@m~c}~S8>-Y8Z;NO!4jBlSQ!w{9z^`A)Su)KIWTA+{I zT3$NC$sbZ{YwAX@VD)Bbr?Hu+qwRJAOOJMGK#%$2LTUPJthXA@{V7Lw+}L2CL85V^h_XW8sdSsd2C@{_nAd@hpX z9gPhT!VpQepT_iiTMz?Ok-ha}!ft197K!<7FO7N&_0JjR%_d-reT-j2&iCvTjl;19 zEH;`iloK+fRw6mSSp^gmysgdH1wYh-D*CL)_3)MGtEX~d65In`aMUwt#{D?j5F_#h z@v%+3>&J3Lq}GDXp6TbYryV)ibfepw1u}u3b>tBYdcPS% z&sV&VuJuwr`v5SvIVpJW2YJQOZ_lOuY7Cipn7Et}rvaF?J;o@RO5^D@>-Tm698lB# zzHUdY3GT2!^cVOKas`-};M3=6s^#MH z;Ag74k`EIV_+QD@>@zoK*_j@eBda8vSchXXi zw~9)8gpoxUmZMi-veq<9S9*A)JJIQaRRLa98ivJht}hM5-BmI8)dsGFSigSwsip0M zrz^bgozCmKR}wI2sVa4IF&67+hk?ljRs-x+$r8KHX#Dm=4}%er(95Z27Z;0vmi4_t z7Yt}KlT_u04(FE47?HD^8RT-$Mps0%lzvT*MsW-D%a0Cs9bB5NH{GSOte1wwdw`tA zPQtelJ2=>aOx8-d|26TsL%KZ?U6j;IIJNv0p(_2=8U06U_eaiGXF17ulihwYor$LLrVNQNu?quI6ZaNB^Jo2Z_NS9d8kC+= z4CQ#lz=}_6o)>DKh?&YmFKAk;3?j}Ni!f_2p}LS3z@ykM4j~@Z6K>JS|Ry zfy5?DIM%*ur$^vADUF}y&9z?D8 zY=esyu&%Tp%~n)tg{V(zweXespu)$ju*wDU{NNZp+DQ9nZGa6FN#$D(J}v2{CWxor zG=G@BA|*WvR2hSc!VbTbTm!KEkqVr2S|tY`ALra^ne+E_9m5)%v~M|P0t)O7Qp=sW z{0Y$+1vRE2ejPjpt9XmZcNoIcA+tmFq0aNVyYAXf=tva zZkG5vx-$b8ic#4Pdf>j@vGctz)jtQ&ArxD0-bQiKT!*k31j+=K>DmyB;uT#=l&Q`)tByAU!B8X#X3= z)4=#0*aY$P*yGZ`m3j62%!ZYBpT*k_QJyXKKNQ>syvmQ6#r|YvpDUTCubY&`1w zgNV#w=w>hN6Y+E?A}(YzWl}H4QwX7n4Sv0(@;PBT#S%8JAqfWOk}kYRlLIwH09qsh?D9WsVJev*>d8ml-j$L}bv&p~REy57p{toW{LXN9{CH+I+ zd~Obz3B9=qhl``BTh5>gbI#jepp}h>(8>(R*P0Sk;m_(wfAyI1Zx@q?w9{npbP^%* z>9?zDdclgH|AHjRPD-&lBw3e%K;24m#cv`;jr`>?K5H{8$uKSabwASCO?)?;1CiZw zYw(RjLQUtK4Qb1$oSj^8SpEVQLF*8S@RP4g+!zlX3Wi0UsfU zr1nQZUH|B*Ef?CUJ`AT~!rX(9Fbi2ABmCC<1@J`wdrd3ga{sefBDHRmi6i@EPFJ*X zJB)(AB!L0UWB3T0Ro}(Cd%}d08Ro=!OB;ILs^iwVQ*>9mhI-cp_A$j=#4TbzpD11) z#hFH|o8D}gv3@(Ao(Wyxc&A+!z+x&TmEzAVt{}^GaZ;Z5Q$K!59R+Ykq>1!Q<_>kK z_MEuKX%kB*^q~_|Y&!=JQ=gC`Z}*+F)l0)fNPKC=#HW0)p$~zS+miZOORlbGR(yHU zi)_^h+?hsJmDav`j) zNR>bdKTuBj?zy87Uxz}!OqdUC|bb>f(t3HA<-zGflMDbt?U9caP!C zv$F0Vr7AZ|NMmEAE26#i!BM9R3&Rq~Wk^!|d>;m>4=|BKx-k7xIOR^2oo>Z_KbEp& zT(2G^=413^6841}&pc1n#ARnd>#G1lp;pk`%?aR{l>QI!O#F*;W`XnU^XwsW06Fp% zEv^-#rrAL0IWx%qqu~uO@EA7p9|PF_2sZe?KK?Pd;lr18f1AXa%&EEC4(UOT)JsLq zx7RueQWfJ6odb~8jYDl6++Y8=|B2H3LpV9<@+ofXNI$Z&VwFxkEaLlvPx#G=8CQi( zz_S?{$6oI!l{){iPcG3cUChdcA*%G&AAB-;rec}26d=k2 z>bUWgnQ*N3))_5iw-Er&@`q)+ik=ZJI^=B2`01}4;~$@geFvKPeJ>(CqNu3sf|U7I{33HPLnD*DQaDqegiCCwg1$rIia%qzG4A# z0K%HVb1Np#AAoGM_cGP<|FrM*N3;8Xas0#C-=kJrXL^v`U(ufEKX^mQqdrV2KRk{9 zU{Di5`)ppPct<PUW3@t3W~-)ec+Z{$rqax!3^+6w>xO zYOhRL9e_LzgFN2t7GFSuW~u4o|7wbkW?oim8_2{XOMhox4Sf<*rxE!?W^S3m0yX=S;`emT}ErSv`Vm zN^HuYHQq?t5d#^!gt~;qt^3?=ze9P&;EI9KUP55L!ikrW5|L^EgJj}7>5=$J#Ys4_ zkLmBe8ir<*-$ViL{#m$McP{~L;zYZ|ng6S4nb+VXGPcTB;oAMj!JlGZ12nu@Prgfx z{%!*GcV0*IU8bS-U3mDX83hjg)&IpGOA7h`bTxB$8z6z&KAq|Cy^deo5x!k7bJ5wa zG`8@Wq~T@oy8}=*0H}^<)kp#i>&Ln0pX+wb2m|kDulPc;hbs1&*!}KcX^HluQM}B^ zT`}-zgeWzSHq~RTf-l-1GG%0;wGxFYOX6kr6lhkZ*A@vZ;#;jEUy^KzsjLLj=k33B zL{w_8oZO^%yWd7jdYj$!HhXy&hK;-8l5A?MbS^s_9>99+82-` zqw1h-HlHt6Jul&9fXt$iC`moiNo4iifYzPd0ZDy#Uz@A2n=V(0Prd~?X1f4m=!cyA zD;55+HuwbSJ$>-Zr&WI;IaMN3}46S1VOjk zh5&!~n0*uK()>AYqY7{~oIW6AG_r(tZ%6w}VvFct;Qn6rrV`WJlUubrIe@3a0-j2E zY_A9KO+XLx-}Un2c&sntk{q_M5ExD^3|FlTc<_qpF2y31krgJ^Ap8N|EC_nN~`&7d{}XTvCy3SCG4B z0}nuc?FXRKlQ9RNJ1z&HFKnXwTv|`};>-X?-3I)s9Eo-J?A@LFfRC*fy8USx_>cB4 zH4E)OSplZ#G?BZ87~_4`POOD`P3;bgb9txW{Ym!}E}Y$wXcyrzo<5`za4uT&MK|VD z&Zj?ky{pjP#jUKJ-*25rwCEFwfDD*6N9_J~(q#3x&NkW}C7NX4&C}LShNov8fX0?d zwm(<26ofZ5TRPI3M-Y&UUcjklp@h_k5G4an=$}q}|7HX}5_SN(Wwql2@Z72sva+|H zAqP}|apf-b4||8C-z@3>!R-&Q8lb5Cdj+&>qsUc;Ob6)q5x)a)%FIuGbWT*j00B2_ z&}&D6$MUHdsftU};g58AJqwHQ@np~Me^sB#<8<614QmE^HX#iZ#{9OxUx1s{H0L%BrrXI zdnx+G0!Rv~38EJspW1X7o!1?McRjuoKjRwn{)Aac6#0QgGA@1!a^5K_)K(l1y^~>8@k)|bA z^YdRxkm}KoFpbzsZHK6T1yCHBte|N3>+Rqhq-W(k;vON}5Nru- zF%9nUk5SaPLHI`4EBAy(kY0wlK9jOan)s9*!<L4hEXjk)KE)4Gc;F{D{B5~8PgHtdXd`<3DmOocj@PJyMrsyl4ghfip#`UoN z;3Ktz(}-J%6iVwMVc49|lrc7CjDx)jSJF&{AzoOKXTI^QhKASGx{q0AxMT|+s3{<>K4?=-z=b$0a?yWwyM??$#N|*?H-u3Cxu^5 z9{p@z;vFn21P$hQ2_A)ra~#1(ZxHqKM2uQd+>S%O-3t)P^wlU>p+V1YcV{KJPrK^n;v}-6t9e_C^Qqy@;~D}Hx)#Jo47HkLV{0zU zz#h_fZx@H}PAC#F92$c!MZ<}pWjQ#6aI3Gty^BMJL$)M(QhIhypAJBmZb$OWx1<`b zvpUAQzKo<$J$gie&q#zL+GltM=a0u?=P@4z3qoW~+_by*sk@hOyH8f*wl|A_nD!|9 zekb4>tNQng*q6Z*`_~93(4WfKbj%!#j}La3m%OT}9e?(k#1bjJc3yN}n6+XSfDByI za)S6pYfZsAr4s8LDxM#Jh&_JVq?7B)u3k&=8i}0hn(v?IY|wGsio2>`clvYcRU^Mg zy2H;rF7660Nj$f=khl|Tq4Xe1OP;)U=q{4^;;`fE*WxN^9JHYqJQK;U*o`grG?P`i zj_=bfr3N}69`{RjIr8m8f~icBuYS_Zdd!Xktu{O>bQsPhnOkw%5q!)}$(x+noIcaN zyqCKS4nuWx-Q$?3OnpoHaZuH76?86a3vF?Bx+rRgxo+9HWGpw2i^X|iN%>MtqAoRw zoRp})D=(0HF~~>&IaQSQ-Z_=1{RY})zFojRa+ZMzC045yl!>f|0wHd8vK#OXq~(?S z?WQSt2cW<@(b5&4?c%CRa-hJ19gvDmyY(|KvDnhjop7k%P;5lZ-f>XcW|u| z$vpjpT>?)LEX&mkJh2K#D(^384cD!mfi!+joQWGEu^I=S_+6>(14AQYKw3#s6~IVF z{x!U5*<~Dn>Yyw8C8GP!P0>zStc0xq6|Gi1JX1D%LL5P~l>P8y4vUDtdDtoCu9SBL zPLm{7?lAcNBxUf?%;ryVWS4Zs)b2i(*^TXfFaJtH>CT&Svet zn26qf8IVx6$wI$uJkRepL)>2AF1(Z_If5N%D(Vw`UM_l0MMlhC;sQT(UD3j9ph0B^cC;XpIk6wxL-QDxhn zK-1JD`jV)t#OKc2i+A3On5FB{CE9cenT>}RyJ*(8d91}%yY2QP)2Gy5l&urGKj9sw zxqIVLs#iPXFJuZHS&mgGv24{Fiafto>Ou2`b*07E#DYbF`{Qm7F0}E5NYNN-)j!eE zrWH*keySFXM0iTGT;9SoJFd*yB2M%6Mh4)>H;)rqIVtt&oBQOW zMrENMv}6+J9}_X^5nKG7!Gs!|GsDj(lxl#WoODb;Qr%{ZuS= z))l$ytby!i*uPh3b;%glm+~@Y&$DWDv9YLdc->iTeL|aEzm7j0;>wEY zlf=Cv+ay(`y?EbfROj|GZrnkfRqRH(lK7@b`ZTWx1ukTi#5=np$7-T1SR)GEnnoA> zij8EcrgX%eE7p!7wMs;MsHW@W(gDajIhghWrhJ7ezF4&uAv{jIsd+#Uw}&1> zZW9dxsXx(S`K51&57>K%4DW+PH{nj+j{3vr%Slytxd^2O?gnl)jzc%P=({i%N7xq( ztdA&Pbsu1=ahYvR62$F>vC{6BTOe0CB-U~Mz)pq431}aa?1N84Byajcmtuq5-IKIx za~F;-Q%S&J!~(+B97@a*;dLfLC?1};T@Qd86G66x|L%VGg91Z{T?Wu1sS#=k|C46t z&l}G_2*Uj@UU%-hoqz$diE4keVh4^j{yU|O|0l2cQIGN1@9Gg5A;>!Thy7Cd{pVQA z*FdfM;SbN*Uy}V0m40d6eKKD$qP=|qE#3J2!IzoGwre6xkC~XVSvPx^f;UD=`z~j? ze4576{(tP9cU)6z*6)L$C`F|AqM$Sp=^aF*iwHtON9jdCdM66fn}C3X-fKW==peoK zBE3oPy~n%p9MAF0ICEy^o%!7N-p~9&k{x#TPWFDvde-`_@476KH$J+du^^sEv)VtcybDR4uKh?sbefC>LK(D?G$kUdAO zfDbw@>?;Tg{Dm^)F`wRp?jFP=(eV+hAxLTH^xZ>#hNMc}UrI;*2fUR(MAU}a&dZ24 z*ScBGHrH8BkH&&IL}G3B{@r%%zwLPcc)((aDmqsjZt~Glq1=&MpWKa4ATqt!{I4WF ze-*>{8*z)@ZGMzV2SeloyQwYK^Q%Lt`bR%(IM@pFImNvfCJ=Six5!lOHnvBz2P1Hc z6hE<}OXGTxs>-9?kfIsJ-in`=_Yl5TpGE(6FHvVSuwGuUk1h1!wcEN_j<{*BvX5dy zrS~v^dV|0;gu^!o{lW+=Tr}e^A{St|$sfYLT6=B;j#d{X9+ha)iuqv!A8wH{1vWcX zU6`a&$wa3|*&lO-FCNq00^S+6zZ+@12*}C-;A-lUub};2=!XmwQ|hC01mHdOKWltk zq8qfdx|HO%jq~Wc1LmK9j;6?@X=4X`-FgeJDgPoq{+IXSe^#zG=|Z~!>q~iw%AP5N z!rRIJ*Pw*&vB-b+nK8dD6f2qe0>?7&4>j$-+ib5xK8frQMj}grc(7@4F7uCDiM|&% z?4lj~^_0s9XOgJpU<&KO59mS70EUS_M=kMBU~1+U_9b{3A4pXcRFLfJIAhcRZeDJ{ z+a)4$j9pV#%Fi63VkBKM#-p4P9<+I>#c|kh&kALQT|$(w?DT4Es8cZ^tjunJ-Adzhdl6bU zwV>T^Zcy33o?cqyOzx`-2_2FE8+{0Pe_I;Oqe+z3uTV>FF0Fbyy>XrPlX3P6zi@~} zN^6c5RDYbSau|ETCpn;{=Dxx%9?D{kiGO|ms% zA0JD3<=^C_@99uerwy7olQ_~PD$F|SZcJA!buOKCu#M7@bq#CFQo6@uLk+c0s0BfU z=A8X&e5ML{-rAnaD-94o4O$qT)HSo}yb*JeigWj0zB`aDceH-4m@k3)s^eLMLgTw_%*a!+#t#)PQy3#x0&ls zL;@?x;;wGzR^_%kW=N)+sM%!-O*B}G(a?6CpUhCI8@J&OlQbCxSFTlzEh5!67@e~= zi@Vda;_|aZ6PJ0)1G_d0RcjCN)<^}EWht&NUaB;#Lz0vodCqP6$YvhJH-xAxmzTPa z)-@}KP7*xBGCLzNPv6)Wn<8B(+>%x1OPHn7VG_v;ntq5pZ=jvw$9y5VJoFxkf8Z zM^Sq0SK<`J4^|BOvY@`R>jDHaIiwo-GO7>G00+P!D~@TzVzU7du`q?({6xrE-_UQO^Nx@KZ)d^LrGxZUxN;gCJ4J?n!iiu`O1wea|7=_TkFj z_141b0X^6dOK-B<25p^gLbGV26S0pVYl=g`5T=>o6U4y!Oq4mT-#ltUh_%3t#7 zq!dTJJ~od9>B9IU+ig?Pqg3wPa^lexf4NXj#|;`by2OEkqUW)VQj}7ZS?NC2EW&Sc zCXKfpXd6#ziK8WLd^(EZCpaUkmb73Q+-^gzxU z(2<*~Huyuc1r;u>Xu0$k5j)=DYym0|bqiS+SX#E#jggpAT}w|Gb^9Q48~>4+tnBWb z%7Uq>zj|rFv$4me6BIsft60HZ<@~$x?ph>+Hk$Y;oN;w`(-@U`$cqxH4LrJh2IVPUS{osGc(KUCR(L4QV=O z(ve8MPkiZWPgv4bF*ciD4yR+7$7ox3#EL7*=Jy4G2$Xq?O&!@HfKu{=R+Y=*%{ESK zp%ERxJQwQj$Amdj-EB(i;SqoX=geKZvzFVslp|}VIM?xrPP%k%fe-=VH;*p7MMx-a z1I)DsM!>^wF(F_EKkL*!I0eKZ%su}+4lE~7Yk96zTvC6O{gvfV?hR|ZM^8*J*1RFn z9Tm(YSC}S!NpYpV#NfYXzWJeoNH_F}G@O}Ik>RFF6zK!x%}#qIf2CucSN);3d?}{A z3Szc|wRd>1gNj)kJGqjD2>J(qu?v85@fot%BP#JIfJ=uo`z^&p2tLfcf@>)YW;PIM z$-)1|4Xzi(z*-Qm>VI-e9^E5<(Cp{fYNdQTDB7CBLiSI}%Ste5}=; zPKdv{7Fe$ff1$>{V3zE}9?T>iI{YmPS53T*{~JFk%GsID{Ew9)(dG4Y6EK98NlimyUb7N`(NUqH zr~gEBk&wsJ1%Fny+lS+*xiL6R)Sl4$z$_>}Rhllpk(}4wK4ehZ>H!Jn>&s5!1i<)r zmRGZY+%~V?tVfbk$bb3@LYs0CIdaxdG+`g>w8uhR?>6b^4WaA4HC^D*>*cTtn|pD@ zoRhb9YBufRr~_M1ai1lB-8D3+GamI0zli&4t)OMx{yHH=pX1Yt6Rh6l`JSxn3&*1fWvd$&uyJAK>*J6qnO?xF^4S$E55UYeV|+>~la zl$my9hpAXA&y{+%c}L*A*j3U4mZM?4eyP>s*eIuIm~BzrweYr$W|NJ#t}r{nkxr%1 zvXE(Nv?&KjgBw>(dBmiYEnM1yWr#?p&7JPCu+sB+`G;=BV)gOZ_twmix74+}&7W^` zo$b~=H!uidys3h8dE-SQh!qqwY)h4j6)P=vx~9xddm)BrvO}%*duuPjgS|a6hAgwz317M* zNy6#P%i0dm<~ZJ=joS!kIV)#Xv(P&_OSimrEiOMm7rHM`72f0!UmK5G%<6|TD+Q@L z$&J;!v^38>Q9fF#yrXd)cTCJfAOj5GF|T6eEJghh`#IqoATcQN)F z7!h&>pSg_z0w!^!PGV*bbnajZSsuKcQffH z0F+awfN)(ousQ*XmBE-U zethV1K|KNM11qsVkqTc>Pvk{AK`%@?($=zGa|cjd-z#xaEl2F~tnt;7WQ9rThmY^; z!j^Jocg%DzN@eFgOo`>CLkON&DjSS_ZquaFkK(zkH_k4)uErl;udZ$`=1m6z>cX3b zE=bMok#fD&Ta~jWZ(|A|_lYP^*?H_Uro#4#x6w%GywdQBayNpjo6drM9BgqYVWOO0 zYH_Ud739-s^CWyWVoqnz zi8AJD>*X~s9(~N6Em!8KXO*KKpORC$kbXk{bP}WI1L7e zR0pB75IR>USN(D4twLtDZgj$8e)H506D1{}zNr#88rezuZo`UQPFAIgGVob>+2U8w zE*Erc6FHFg;17(#`=Wn_URE{}4QHV<0ByesiIY>!>9l$&d2!cGWlUklqyv$6$=TOu zIXXgucqo*Yfx?Cx{D@&cbAO`Kr1N)f>1VL9+^k}KQZ;%OCWZGFw<01<4)SY0++Tyr zq+4gnQ4YKzd5I3fRqL0!<@=4Ka_z3PAWR8T6!zX*^^`N2$U;rqm*uQ=gmw`%#vsO4 z_5~0Ffr=pseM$;>q+)K`m&7|PTO<-cAz$Q*cwbR_<6 z&=YBN&UHnLJDppv)aMDKbsb;zHCVn&oiru1S5~IjdK(rg%Dx$CIlp!T{&#i2Y=+7S;IZ!E@itqR4yXx+wpt>b zNe1-Xt<|&S>f;u!XFdCpUkJ4PD?s!AbN7l0e<5Q9Qv!A}I%<`9;kS-pjsI(dU#-t` zEDXbCwY@bF7hw)R>pZ>w>I!3fa!28v>6~aUDWPm|7werN&JA=CHCUSRyuF!U;MEar ztK8IALqlWlW?DgH$);KIbS;6!9u)WiimShN2UtjDyd{9ZB86x6`=@6H%7iL&@)Oq} z0;b!_4i;j6Z|u+Ef%VXK;xh?mb!mjDgGPC{fw^~IK`gHXkNh(urI=KMA{Gtx)DCAl zQqpb>WfhzE?lXE2I@Ya^S;WJkm?K!`ZN&4_C*X)^&cdeX5cB)-fX=6l1}t#E z+9ww}AD{+H-XAu-E-KRe6g$Cef|Y4ZdmlXjD`3a;$|S8|E6JQ?qlsyl4(}Xg*PQa6 z3SxqI&0}BW%doA8Rai*o6VbtlmT8-*a1U- zAWX14+|YRgke?Z;2Ok@skj3Te6ufVVPJUiSI$KnHO|Syoe7Te`Cn5K}ibM*`DwLc% znxaGfZjPhSim8!X_tnRXl&kDrD;9h=_-JBojBl$Gq<2!==J#7hR=!hEAkXl)q4(6S zXg`E}qX5w}WM?oe2DntjFl5xa2UCs}gr3ML>2|C=nr|nE5rDO#=mNPX)}CU$GgXX9 zZd+rJjnx1QNRJ0eKjaJjH+T4PiJ04hG5Qi%HUNI(VOT`C*yc28)w&b#M?H z=nlld0t9WXSaDhKxb~z<>UQjPgWHO-$ayQHRr*UQ&P_}fGw&I5+dK=ts|e`F6F&af z5PtSLYxF$;=>ZsXQ2s(C+t+eY%?4kMAS(g@u!BuWu ztCs`p#VE@0*@C;tySYif07MyHD;@Sup#)IKIJw+QzJe)iKckpS zqVU~EbktzDZBwB|gw%XEK_sUtxL(p% zH;hTS_)UXyz>$s5XGx90#c5Qc7P+wqpwI?SI{Nn+6enn{^CN>|$a;gs!|iFWXe+2H zD*|gawI_m^ca#R_ch=efEKhTxe^+^+0DgC0?y8kJjQ4^YaNK8PN-otzUW6;HV!QO4Ry;pSnP2JBI4xaM&TcnX#Gueq$Y;yecs9sRv?BPQwnZ?jg(l3?dd<`_R#&6&GF8fK;;C(oJRg*QA)QfdMp90y35tK8 z4iSOBE75+WRC4n6VD0{V3=DHuyA$P`scNxk_hXxfmfcn~9QaHo}`FntZU zU&W?2h^O9K0=P>iCLKMy^KH(0Iz@VxWE@m}?505}js~+qZB`5JVfTxrUD})Xv?Fqt zLd-nBY&27c>;2lbme#%-x&ZHLo(n%TxJID`_U(@SxGeu$ui=@}^CMEuA&A`^0p7~h zjQ)JVb7pN7w2>IQ=W_Zg<1FyH3amUazs=+`?x96&i&?q@etxE_zjvolW5Ev>^rCCI zRNz>cfMXa$QY1rmQA_56BnD0kBx+YYA4hte!5RQ0TrO-<njmiLUJ2ttS#V@~A#FtrgaE=BDxiN)rQ`+2w_c^mlA{HnamTNlUTPEJU%7zV z)s@SvHpm*qd~n#j6_jqsGFj{Ss>(N~jB^!8n+IxT8p0+*S4g69Ze{Lu;!cRsPlQXK z486+aWmXrH?teQmHn0emrm+ZzaU6qVy|ViF8+quq$j?lM(lUmuh(Obp`#B^9dJn3s z*fcRCiqwr3T?X_*4HcAa8C|mZgw*G$1J!b3t+e+6c~Wig9QjzRBX%OEo|_Yk2uEE_2&A*cC9sl|4zg7}oxthJYf^9r}ft_1seA1aH_> z1M=gR7#?tppXMo(kQK%0uLiYU8uI%6y0_O{wz$)MSg1zkmWrXCVs6L2-S45fkAEQj zXgY1U*jyr3@q3R#Q1~-#NMKbb71);X$Xx*9&Q@XXEjWW<1x4hHsuvuTSl`8E)%`L6 z<7F6D5a4F(t@U2tk!!S>K-VaJoS6e0wh#!+oyJ3yYjOJhakbNKgu~KWko$Se5)GqD z&gq88C8TZE$f)ITu~OgMn7MidSy4wunGS(dm`rk|UrO2YfGEz9PxL5Auk1>8$-|Jy zEqGpuXpCd_@qpjT9FrK1E@WK~A)(cTccki%z4kGVQ9xjkmfg7 zkdN0(D-Tq61w;ivb=RzOaZ~DW3$nvzE*5=yM{bK>K_l3ge)O>ZiL2*AMBf0Ihaf^N zr2M_Xb9q9Y%$3*YkxO;CB6u8eAqHkSZnkx-I*#y_x}p#2UAgtNsiw`2SUHzU=?<3F z!A}+l$YfomvoUt$*;mBIc&RAbAh+k0CXGcDB+dTzwm*uq&L?;@hVWBjdX`qv>wNh{iSMkP1U35VAgJ54F#>L?IpoxotB66z{vL-tZj zImQjXOWpL5R*cTiBbx&9G>h;7C8##LL5M)A94aIF-sL#yQ&|oj zn_#Y<$d22C&*F4AG4kC_!;iPllA=0>}#4F+LG*uHHBYK|f!!q#(If zvTR*aRKllO$>`+x{7;@KmR%GMT@($5x0f5uQP;6U$vCADa&++%B-DY*1DIUn0c{Za zfS|$bU#rfWR%^`@1YJGdkH%J98XJ3^eti*i0=|2{sw44+exQ+Q)b6dlPiaQE*#cg? zI+Y6Yb{QH8{{*6Pe)B5{D6fp6PWZr-8_+02NHJAC#^E883Pv_A};>n~ZJ6|`;^fdl%kzOWam<4_rL>CZ2|+>ZHy|9!RD7w?Y( zk~3=jch$|JPRq{GkGcG$4O+jzmf>?dW^?izx!4x!z}(u&%&y{0x0(`_UOcEJw9ZPsOyJ{5Pg=&!A0-G-8yAlxjQ3^1 z2B$Zb744~B34qx&`lLqXBUnCYNKP{9LOexf-;dk0$I*OlA(ty1I z_F7Kv3%;Gt&Uqqj*?|4|t??rij{!i>E8bjlPIjpb{`^K|rXb@IIW-e(I*a9eN3i7y zq61214rh%tsIQ>RvS&X!*j1A&J{z zxD6L`+&7r1(3?>aj7gX%))&J|nbWy0}m#h}1!ymF*2%Ue;YT-m_JEBKE1k!+Kh$uJaOkH6cyN%GXmd=n5c&x)*!tyB&* zRxm&Gd?IoAc1N6Y1>zNN>bkx&&gbTc!~0SG6k%bT>ijNlnpsYWPL-uJNo7juMjMPo zC6pdZW!0q+Ufb*t_3zwp{0pMIG~jdo)7s7LQy*q)cQ5{@G*B|q?%HV;X*!jJolL|cyg>nVrgufpg^PZ z*31_J?S~Gz(Qt05A(b|E_w-^r*B7?F&HMI!k|OB^l8)q3uM+li{eX6#f1p9jY#wYU zC1fgLpzqrjP;wo#p8;p+OeZpyV0Sl>6meyZwWqb~`abG^<6P%}0|!eA3i8(^m{Yyj zu%tYWB$(AUBQO}6+^wR+sDT0S+W4Ohen0y^EyD{hQ1C+rpe#7bYhI9I?*qckoW?H# z)?O5uIea+_Z{PKn2t8=Y4fUIhH5Pl~MaYl^+viIyhp~Bv*Y34uOhkPy#8WTh8kn|i z=6bR#C!6|mKO8&dF5JDb zz*1>HHRQ`lfsio2#iYlI#j;ou*ZdxrWKto`Q4LTiG&Sle1*(0tki7Ct*j7XxstN{aq8>xiyFX}RXl_mWl4ZBSFnasuM$9TID2AR%w2jHUn|ur2GoEkC5P7Rpl(kL}5>DvI$F_IDE>HZ+QA5te zmMioABX%I^Vc+ROpBW;-a<~n7q2YS*D0dZ@*>%1dY=5Di#eIMO6DZh;@L>k%`E~aQ zKQvK$lY7a{5)>Y)cxvs}j^CYIhNusK^E2iW1C|+Ap0hM$-KTpl#PQg`0I>ciT64W8 zvo%#xn>&Oh_xItt%Gyf0Ozb5=v&K1TpD&Bt7vWM1l0%fpPUO;3A8lnFa5s&zlau?d z%Ve$RsJxIC59e#9b^x;%hVeiGa3=x7Ww-g`_sNTvse}jQyu)bplcH&V@hg7z%YODA zt}=udWEl1a2*iD}Gk=dj!^<1Kf}*mKQ_zD{vwl25>shVTZS;C7nyoV@d%wMug5l!u z{v$e*~DIprPw#oh*L;Jw0F`}wsi8dOP>Zy#Y{lJikMUah!>EH=WU}m0xXSfwSM{1 zxRXt>@}A3U7isNWyOn7!j;}?@tGS)dY69)6iMO9b&dFV$g7oHk&c8i%m(G9Zo}(Nd z{#yUJ=w+2lSHD2~j|>}_XXFVSwIUlzIH zB9K}?^Vv*Lz%>hM(4H~Xfi;ZvJoIUg#M>G4NcX-Q(!7|HRs5wmzN2OfiL*G~p=zV@ z)|7cZXu~*IFK0=R?XM~>u8^vPJSpu^#R;eoaDh^RYqnSyRkY{|2QBuZZuZ(TaK=6; zcwb&xbSlHpO#={jLYgOM5#}OuZNtdRXDh`Zhxj*@a&yrWl8wY_Q+{_1`zpDzg#sI^ zyuELSI+ynGj=#Ug@lkg{7bDkUQxhK9C`aBPovmtIU_#_n1^1uCG9z1Cn(BDHZvpE(PBBiAKiBfq2f?p+7nx4gWwRp<@9rv1h%aa85~Ihz3< zHlwjck+^7!ypKYz35ob%Y}H)X)^JF!1yCCH~6!*#HbstcRItVnA zi3D?wVcH>L zXM;u=9tYxsTFa7kP(haNl3eX)M*cI0es>0Dhh2zgu?-u*A4yp5-E|Ri>x(2cI`hw% z+i4>C!o7vE;?#qlcOT^eMkG>e^(fW+g=%7~^$Ql-?vl zAB)+%@k=ZufomojCzU;d57$OkqKH1Zuuv_-yK<@}&ox}&jaUOhc1p>f8F zOhM6SnxF)~RZh5CzefLbb$*n&8NKHAdne>TYW1fWz+eTX&5z{0NnvGX;Qz7*LFW#cs=x$lN@1oVsHee=eI9Z(KEJ zl4>|-@7X1(T}(L7x|{hGC7j8$@#iOt!h>U`)Z05X8#oK5)JhUzvXze%J9Y1>+YXUK?se;eM~Lwu+O|#to*HZsl6-~+|7h{FpZJDI@{gmlP3P%@34BI(8?$x(cQLxoDTOn$@(whXUZ|AD5gTv>j|%mkuC zJdX2T*&K6>o*`Up8?$jZjyk@++&tXE!ZycL%}=c^l1Y`;Q#9033XM8~>!tOf-!Mno zO5hv-AyT_nm}U%vSBE4oL*8|}W-b?g_SKJ?86ms76m*2kMu&wJWMwk!FGxKn5bXQT zAzm#0VZ`K^95?sSNk+8I-OX|cIdA*r09WG455bRtN|;w^M^nAeHKsP8Yju@*2R8jK zk|{1ce!~rRA4fD;=KIC5EL+Ln8h?3NY8fX@r<)a?r}TaI*R(&20<;~iKW<}50iVC}-MsnP zGhrjdR72VRg!IsGdD1a&ZQ^?YPPV)bw z{Qqyi#u5453LB#TO@eR!$AG`;?+fxlgE^!i96GJtmHoS%O;HW-?{sKy1}`f7$x0gq zu%oX?{Jw}DT-QYkL(V^)bt?Rx!p_Gi~s5K|DAUA zSFXbEZSE&7!(qT#=xRkgv6}b4BSZ1`KKZw<{ceR9^DLtj@2#b2AauT({C$Nv%;8Go zuTg5ZMp|7CvupR0-$?wPQx$?We=?BM>9-w$p{|d5_Z-E9<|MsZ|WK)0b>k9kr zn?Zm32E}z(vGy7A%!bV_-6j+$Gu2{7)+gqvLf`rm5a={&UQHL1ABn*G$?bpTCJ4LSS6ejt4y z=^}p$+QYw!Jl5V${&7E)_s@_&947ep-4d=S$p0J8mL^X)QN((;gqV>GyJJiebr`_# zfi1pwg5NtAN~*ZQ-)Q=de`SxAK?EnME8$}?0!qE{y7WkXU5JS-Wy7PrWS@Kc0s=b&`kEIa3F_ia8=XH z>M&%HYv9?#7ynOKFTB+Ovbh>Jr@7i0n=8nAke?99v-l6d;yW40h@nNR+24ci@h>s@ zlGc3Y2C$rAyVL+A8N252%USagIGn%>X!Fm3Ae5VY2av)2+b(KKPp?>f-%a7%!{Yo{ zgbhiUDh~SZ{uh_(5?liNOvCX!@gg+uVbt=OSHg!yQoC*!)|R1C|^N897Xbn{VqVV=RX{V`iK4g zJ!g9yr(W?vi_v03i-%m*{<>tk3_}9e)EYT-v-LQ5EBW-w)aj0!?isU;AE@*9<|pzI z&^^`AFNo9?W&C&d|G||BniF?tcBBw|n-xJy`|$)^{GSRzFeFuUJ^x2mt0^XG443E$ z!TK%PFPVtdLIWy%c41y-PmZliUP5b$&zL1tvQi>WE1q6?2^&hOy2l383eeulP}dq1 zSp?kQH}j5^m+$V5CYiFDfHKdk0JdKDFj7o=D+M_@So3X<^dsfGkEaR;)CWeF@(vE* zzrZI%>VntT)h}ohWKd7lQ=C&ySMPHe2!39b4ejnmipc|w(HZ;;T_S!4>{gHLq<--g zWbm39YGE?OlKs?=Ij3hK% z6Itv1_DvA~7rsdx;EJuDut0_Z`Ci0G)%1*m^ot)|nD+TAsG)8cU_eD=e?zaRC#NGv zfy?*hSE4kt{Hee>jJaNjHYv%EspV&(iGRm?f-9>?iEGf+CBXk++XE5#cODRxdI7E(Sc4k!7wUP^`pj(SLE)ZB)R_eBBX-Uv%#2JrU%tD1!f%b z%BQwt`GATjgZFmre!}%pzj+thZP~gwfrtebOpW3J`VvvPkBp2=iA$#>S4N>#0nS5M zB1O=8X8$n(sY=sS!NbQy_iyu#Ke<$>d)0cxhZAL)021u-;5?a=)w_m>QyX)|DLg#& z?T~eMh8(9ADb1@Jbtqc*KSk#+k5;kIsrs$fXy2T`ZjUB8GX|YheN5j*7;%}5L4%(&WX z4czR#XWM?eJgCv5{f_0XCq~MPlR>dZgNjJOB2Vme^xSOjywyLme&`dJ+EP}cm+H&n?b6Xku zq9BE3ce@tb7ROw=4{;OmkbMb{Q&&``hP2~de%FeQgU6d?vACkbTI%74EsHl_3nP+3 z)UDk4sT@gC0l(3~!5U$ZXhr(xD=U(B)W^@Y6YXoc|R*hATaGWDWU}<(v zunCYxr#=Dp{3<6T$_0CnOWj|a&={7MF8py+qL?dy2cp8xX+lgM>}CZe+ZzQOkd;$v z7g0j|W~kma=l$jxP3dsXbv449X7kN#@?lL+q|D>J>|Q&G6D~|L9ff3QI}}XSxncTY zo@-L-53t_34A0SNp%ccrCrN@Xc(S(#1N|@aIRU<>t98lxow8EkcWoWv_z#&z)E>U~ zQs71oOckCgZ{7=QPrwi{JV;(c4m!6d|Hn77`85$|kKw$)*bZom5-}p%v(+@9KUS={ zD63(3z_u)Ie5?fVa+1&|PyjywRE)nZiT;hRQ5GTEJNIS3g0v+84sx!0*=gP}36M>d zmkfNjVbRA@+uebPrw-1uJazGSCis||x4NH|6_u5Tlr&<>o41nl34&B~=?5T*N9l^P zdDtr@C${4_nes3AiUMzw$5xh%DxrpQ1c{rPz?37((z|stM#iQ-cU9ajDfiV265j*j z#nft_wifHAt{jOxJ+m6^!1CO~js&SKXH zS6v*VeDlbE(@sjdiEYjwb`N0F^yl-nldCN*w8tWD6!fBLqyxl87C4Yvab4369y zt5c&2aZNRzBci>G_rm#YxYA72yo;wE800*BIdQa}XN}S>7!QyNKG%|V7x57cAYZwPE-u$cN?tesXict9h`la!r;!sJn8PC`W+4*d=rd%h96sy;F5fVF41eM6Wj9 z21YZA=MwpEUcZqz(z!~%G1jmfFhq+BGs(kMrNiK2%t}gAcllMVaIgm)DK%%dsG59WT zo_7DVew4fzXy%cciiabf}>S$zx2*w%d?7Hl!n8sF|Z;tl*Rdb7?qqKJ!OPK7T5B74s z<@?udqDk)Nm?ahzB19>;54L^g0ztLPPw#^$JueArH&NX|91X&?9fa$Zz2&zw-=|?a zEA0+a9S@uhJ;ig|G^V582(k_~>`yNCmM;lvkhnV+sEB)=8x0kMm@;1@wfU2Xw><<; zUgUKp8)qMzeW)DSMAQd>g7`#QXf?avrd^0w9+BU_PLp47ar&X&9LuKUq^t}O$`Zq+ z&hNp6fA_Pvtu1z75rP;m<;J7bFA)+L83}r!@((V{Ds#!*>sRmJxXYTL9xd>etsV1x z_}Ks%=oop@t$LI{3zuy~V)w(%Y${Cc3RzsdMH(7ji8aQC=dg{9J#^=t34EBv zKmtPPfzZ!Vd&|1cc8WBNiZA!tW~l0xNAMn|u2)MerD_DkTqn<{-6H|5UBr`iy01Z7 zYaI@el`o-t82kLQf~s4lb=90h(aHmBX*}y>O*>=btwj4;Q5dy&LZ;M6(&kUpyUT#% z*Mk(O9g_tLo(?|qtfu`6`rK)I&OES+{;3+h_Y5^n`bE-cw9)PG^e~q|T7h>cw?BkB zpzgp|K+G*j=A%$;a!vWI)%u7Y6aMf%l#Gcd(bN4&yaLfkm`&}N%lM$mJgB`Zsd1ez0S9+W2C=rD1FaK+-?efuRF1ce_aUP3yhBT++?@V| zQkqR0$T>b^D~ zLp~O75XOr2+Hz0raKR8Yt{;M8B2 z*~8EQL@odZ>_4;i`X8<5l;zZsqL7+>z$dVW4_^60vB89Yl_~r)?fO4G$$g*f{_Hth z4RYpr7f7EjfG$1E8vLQ`@H19V0MOQ(k>s}}|Fq#h>fi+G)*0lT0`|^m_!1$|t$yQ& zrO{a<`L`Fmw}$H>{D(dk;z7|C#j@-7IyzouWF@i zwznE74-#ia@W#z~u{y4Ou3WSR3Vx_+7ZH{Y3e&id^xrwoncrsCXeA}Z>KSWU4p}oD z%fw>HyV|o^X|WyIh~$Wt-L7i(sN_pDu}D@OGahv<+R>23%ZxCl(sSeCzLa|f9d51G z++;y!tPMia$_i&*-9~uq%dbTY&J+cLrycWOeyFR>V4;W!(B*4H6^_Zt&LcDiYtiQS z7*+)d>70<>V}V~4NC^_Oc+qs92dAr&WA;%Eo-po_L3`6MHEzl_8qx4jvO?eO-u36j z5tFK5Zk2;zHjGU)yfue~LSZI{XN~-bb%p8e)T5QfM?6kKXAu@u(PliKLmu6Fq`6}6 zEyBhc%8&IFz261`bSqrpn z`;+cg!KBJ!8UFozeq~%I*PaII!8}Pcb1RA+5}00U!_1Wy<3O!+uT$@k{@f zVg6squDB>~_is-G{%y$p7gYuSK%V%IDg;7PnTtZgzZ&XlKhAdgTloN8n2SI`>)Hy* z`+uz}b!*Cvx((=CgV&^vJYlA^hfU~1A6dSH>nR0}$WpvA?$?$R)KV{*?{ZR9m3cRw z+;UBMFHeSGg12I&n>$rpQD&4jg#u;L&z*VcPSXgnu(!vv;h28)I6vbx;78o_Bv67p zbB&vn7I@P<1cTT;m-x=0qx~{8Y zMFk6y4kDchNC_PgHBAi!1fTDoL5DXBI-aA2hM@6L<1w!bk^se;IoDVGH z%$`|m_Fik9eVud74z+)=ULccB1ScGiq$v?g5if=L@neIrQ+2M{DnDB}!HbEG`YmHCex~)@2dQJ6dBD z6igx1{vs;zeyslHwLAPe^Ig?3%2(gd?DS8gz!wYrNUv z?C|DZqpuxg{xb4{J3zUhs^haYZ_X!QV;x@*?k)*oO;t_%*`Nu!@9y$E|0{{wvf+0p z?q0R?UwOfYg>e_QXuP3|>Zz(pz1gg2WO3|qgrdoLQMr%Hb%>AB6ym(gZ5ChrDFaH* zbXN)t@JvpvvfpRAxgnWHCMF|tL}|I4i>%R`YK;~3<-^Q}j%e0eW81^S!{~kkT^&bhj+#yDcF~1CgV~L-MY-LWxopg?dV=yumHhl>b$MN2A@lLR ziDDm{$fmdDt_c$B8BFyTLY#xb0A=|A&Rodk(zp3rP(V;wmHy`0Pa)NY{gf^My(-)^QX$Pfy>mA&J}$?9Uylu!Lq> zax-X-q`(^rRM3_R`6rSNGt~)CExx<*wF)laFA^;-@4l~dWrP`3TGP^Vnwtv@TuLx< zU#agYwg&iqAf~B`H9dG*Zg4yRZU2YW^B+~#JoF8fQ98^oE?q8M|K_)4>(5hT`FZ;s z$ECp@n*9SCG>G(g0@0>2I2(WhCM5=(~vqPpd00_-_B0Syw=tQAm}{ruc~w@OyK^hfnxHte=zm#pUS zt=VZLM0t{T3>uhsKcvP)kyV*h(y`gms@P8?PEst3sM;_00^8m|Ur-@9PUg^JPBM-0 zvO8H`+YGM=V?d(6-7tus=6Y0K6-SwR>C{kGQ4UY}rI+UDfdc@^%HlJw?9CS0kEOl$ zP8|`?I_D-gd90`82%}{`ot6;d!e|pQ4@#v;_ot)Df7(6NU=L{u1P0xXwj7{!;S8~z z{lI_(cu5!$jG-aelM>2hra?x zW`pS@OwZNIsY-YS$fy9ZDi8Sa-DmonyP>s9R@B511r}t4HytuQ84?tZ?nvV*ox5S0 zmJ5f1*!_OHFG3P5ZZ1$20C!{W_$cD;MTY^VKmf(>>*3E%73J@Mi$vuED*_xFf+e*} z&65J*=sfXyF)4(cRQu@lM!l?vNMWQ(xVu!xjA{Qp;}Itmas0>;Q!W@x|MzkHN4oqe zw(nCH3{cM|BO}tGBpl7j$TSs(%X{ej_BjQiY+l6h5;?AeF~f%wN<&&BK5W)O-fP#4 z^j@!;4_R9@z>G{*yGczzHKS&X_@cxjK*KD``xHiyRm%;9C4BL=_4}Ccrui-n-sZsR z(|zW}^)87Jf^b9yI_dEHX)nVR-04JGBTNS2Tm2%-IY#;JL z%?pE(G_{q%T^gxa^U>Bit-4hei*V%YDPByCoKuZvn<4iJtlV)C@fBchkw{&R$ukfO z{E}5GfYY0b8n>i0N+9YzZn0IiOQzw&H3dM$Cm+nBTy#~-Jkv$X{ls6@dE_b>q=91O zIc8avEV&IN16tI{SK&c5Ow3rubiVr)n&5E=03QDUC%ot0m3>h#{5>T1=jRB>(S%K@U!;lk521Q4G$J3J1|(+C1Sex_DIG?h#E@S z(aBHJ2e{H}Vn8wDy$OP#g;!!D9W6xG2N!Pv8kgXx{^kQCPbJ8M>D_{j0W-P8$P>#X zQ4tJqlW9*{NlYs&CR?1lN{h9Boo#uR-c#O0%+|MHW?4BPg4O1E=`gOvNJXe18kVU< zt%gf7vbC{!&2X+&g{S7LVON)My4nV#^UtBVlE22Af}$t>Xt7S3th3P%9@Icn233VO zX-m%2iZhTJL+r-|T-4)O2mnhiNA=IE_a~1Je7EfC&NE_j#c~N(7=}qD8;(}bzFTuw zfNDfR$f+)#>!b~U_%PyBju3_p(P4J>LZvbHtz!)6p1dawg^xXlIp@dH615-eC!c;( zliY*a80pmwR}(efN2!!ymo1!sLHOE52fXlrB|*Pl zA{uW(+apa8ld7<@n7OUO^~0X6B96}1BW3)o&2vNjLy5OpCXv1lO* zarLu+bs1-)vBt|b)ucSYBp}k${K>tY#V|3y9n=cr4IuVWRNS@3p zpg|xQaR8^6cGR95>&?Hi7AG!PhR`nAC;N@wm8hC29q2}|HUR1zoyK(0% z(?9}N&V{Gh!B-l5HH!7ou&FeaY1t@BLoa(Gkmj{seM@QQAbrHC3;Eo2RgNnqH_acF z=|2z~A%zH-Ui1hF(F;@FC#Wz3CMC#;ShzFUD7C*xUG2TVXe|57z5^ikThQZ*7r52Q zPDvoEmQv|W&wnZ>?^PSMIPWLV)~9=_-y+tjAnViPRvOI}d-^*E7;L8;G;LgtMP9!a z(C<(`R%D?X!H1+;XIoFCQnzIkYT-4u{hFOMT@*3q=xoH}R_GoLaY|#3L1KaPW=3k1 zk;rJRiaaFcdg9Q`Ye5YyAQNkbeb4EC`V*57>MKZTq^#I}PoU_K!kkEL#jdFbAE)JG z3U*ljL)C-^*|FVOGVz> z>Y1HCL0pc?Qe2dadz>8_qsZ3MkDw{`d!T8-rYYd7J^Vl`^15o})JqL*@){M{>Xmq~ z=oQsZsK#JB*a;()qE*I=;N*zjsSk6}9k#qRZ#|Fk2*vUghtO&dJgVko#$R*sVspE3 zIyb8p3_8+cz9hj2t&a{Hc{-U&@8?*JQ}LR2 zH9W*GJX($U{fc8hBw6)txDe{6}XV*z8iE*TvI9 zni^Pw<(xXPmiF_jQDA@qomKbRlhX~H8NFbYtZpEI%IzgkB$zySEXs6gxapwpu87Ci zEdS@=w*y%KTO`skcJ0;Hoh*>N_Pg%2oi8o=5O+4Hym_%vA9P$#E^bh&3#K<0Cn)Qj zv&GMP8UG?gp0j^f1;P0?zq8Y)S<}m9vr0Eb7OwTEw5=hx@{bO??Rt&t?PkR(_p|^k z;R!&CEaI$vwXXozB+Be(4v;&zi_E9li*FE%TGRo4mdP|G?PS(mDBx|zU3@dfu11|$ zn4M+tx~tvP2d->o?XBrY9eK9i_^trGJV!GQmPJJ<PCrEI*J65Z;<_lWpZ z>1(@u)*F2*Sl7lTe+DRWI+H4RNE`u6PgLm{WBDgc73L?Kd63@Vk=fc)f?*{o_qI%6q zs+E}^;E}J02@19mYKHa{(%>ASK(ofS1}-IRMpW)Me_}T^H(qzd_JER`LCQ?`jJv3Y zn>eXlU+cB0o1P=^N8FJ&rnejnIL8{Ss!@o%5lqWwCapbIPES)ArO@?4(1*z?|9Khg z`f$o;qT@xNqJHJ(_ovnVul#19^rHyW+3MUF2{!U=|)3}(nGo@(o@;m8de!~C!CZo`ic#_1E@>E(%5N2^T}Ub$p6Vv zT~|kO)8Q}Krh8756ZVZ$TLv{pn5(}2G3hg`A-H{);I&N-#;e)MzA*El^95WFuGhj^ ztcn-8RYA-6Y}qJ8pYgksyz8w4d^zTc(^5`k`8*{+D(q5;*+$XkfX)f`Cxx^a7YbH4 zv8KH^nuCAFuYQDduR7r1X`QPDzD0$Q7?7yvlvCaZRmuT;-h?|r@+S`gK;PGG^jCQD zG5%zr$EPn`XU&lVCvYL3xaPfcZwuBcBO<)6-sEV#)*qNOp9KofQC_HH&gi$oM!Tot zderrDt(*LXE~Y5|}bl*6$yvZYY}cN^RqymV{0ECaHz<~kP6H!UNvN*G(B&b z&DE_VrVxxH2%3dz8b?$sO<3S#PEH1*6&o&=HgwxTckuQ&y}x&%FmPbye$7kHa{IZn z@r28b#sKv&p~anf9~9BwB=XXP<4L0ra=HD2@vo-QCCO$@PhIQN)Vb>-$fJ`}>RZTb ziOGw6k7klUxnDI_-qqL2n@TIT@PKvkkHQ|)N!++2@1uc!pMG(8fskad*05#i(P+D1 z-5WWI-Yqfy`950Ki!ch>cZsY#``bA4=T$uvbR)c=#t z8dFhzesY{k=L`QLf@k!ar%q6|@}yK#n)Lm;QC&fqaC(8A(~;v1{fg4&iAB}|l-C1c zeCJurSi_{eK^}=EL5=sR-#e+31ix_xAKeQQre$Ndo3)oYA$jQyqrD|rcZ=|L%uy1Y zw*ksv3656O=SU^4o}!?}l0eU4j;txT@}(${r2aFmA72?eqXzRf}F3B6hRv1hD-&%0M3 z&wm}t0EY%$fU*L7!Owr{1|uOuiG?BwqP*|q03o8WclI9*^J0gjCn9d@4GYJbv^=Lz z4(c8Uz1N*xVC`FV#lRgnL+pS#9B0#t?F!o#2BvCu=T=KaIxW6&C#KYr!t}}t;bpsL zB=QVba)}W1)amQynG#$8U9cn+dNx2SB!p)wcpbT$aJQ@|24y7fbZpjvl5&(6<@b2= z<60Bjj0T)<=JQYaG$h8ADb^#TH!?W}0H)p}cYfae|Jh>=lR(ozT&?DE8vF`Phj~6X z2M5KAfCqAMhQe--+T{>hoR9*jv!^?%d3@zmRofm>y5Rt}w|+Qe#c+y* zfYNlsT>oR0Z`IRiYVV|}WIkl@K&NnuXE^VM?q=r*fadkiFr)wQjkenZ_V0S+r!0#T z_+#8zW+;w)LX}JD^18V>#ZBrjta5dK4EhY#3xSu5?lMh!Du&Eft2udVuJk4QM8G z5BiS!H8ZN;6q(A-<%|N zqQQ!tp`8)Y+;S8X<1SwX1zdw(7cPBOHGoL<-aTtvc#9b^l;RKZhd?(oFY$~cl*qXr zsXG7+lCUsYD(mq?Oh;zebAXdq-c2m~LRm7dGNtKUGY632Mq;f}ik>u-1j>|)1HwZ9 zM}Ig#?MY#k_!J-bXc|5JRyxtqkhE}V`S^Hg1Wxxf_balORnU`|)zhD^H*Sp6W-fR1 zee(h&o_*$aC_F}N(?XQPY3GNVPz4L;=(mnZ!<KMLLM$-7L{%yHIb41(h5+DG@{7*u}n{6tr{D=iRuT{r0GGOvv_t zBrR!vy`wg6P%I}lPgr|ZpL*uWM%;px?Q?(%f8f!Z+O|@_BpY46Hh+Gt9RBF}$uLNy zh&-(ZDW9XwSpCKgMlZ_4#pVPSb+ztR=V9q)o6E1wKc7y2uwK@?<$0FT90%oB0l}RqXOaXZC*e zkBr_FD?!9$Te(o(SI1GWifJjPsAZadw~!^l@j-fVwRm0^lA_dlW>ldy1|+s9;-u;# zRBPl;8(wM|0(;U@8Pw)&w5GZ7!+Db50|$}1oLdKd;u;A}t9qoOdieHd-p@v;vhD94 zQU&bH&A#n1fDq1+`=$=rG7pg3oBePdxrD-?hN3`;QMIG(c5at1{|!`Rt)Y@Ci{3?eecH4se9)gS4VleXYYVWK)$IX>d6e^(mgv z{=_7vhjhZayvhJk^O#lscb5VO=0u(u3yp|TSg7T)#|5@1mkK%xcQfx`?%c z0cn!$ZS&TuPaFae2=mED=ne)yF0y0BlXJ$8}5`UY9{6+P%q&WZ423uHZK z6b5|cWZSxH)>J=9BExi_3n%D3&qDXh)RliMS%r#u7S4foGe{ATK?3amENlGyx`uI}$yJPCY7F#%U`l(8>Rk7w z)sJmvW<2`b&gc0dSx}o<6DuKRBl-algj)oK8^D4ENirfskl9!(M+Fk}O}gP657*3) zKWyTtSglZvSc@F*SqWQp)dXpvH^s%WkH=DKe%x5hovdo3wjSz?{o}ntRDz zdiKjclFZgYpKHvdvZZVXj%c^c_&;%Dm!g z5^^IwRnh1mE_4AeJC}60iqhur+>rZDt%Z)l+YaBT`Vxi{|aatRva};C~BOOdbHGmVbS48&3=WML;K%B6cXtOTjA9x4s^RiX6H$wCwmEJdw z0`&ZZtj%1woUrs{nIJHbRZ8*Y=iTdHe0)IMCNb)BE#WiPqOCSBF%iRqA$OsgTLIzc zG>O(bT}S(N^4ytrI{lm2E2I4b>pohgC7YbM^a==qRT8b_E&4Q?iK%lj5%dYHZSan@rEFoIdq0+a(2%h`@jKDx?V`e2P+z-KxI2eeKxKF{WMOt zI0DDl2pbJg=`AYctu*X;iP!96<51|xrOi$Z%`&&)7?xMZM;o{hEp~Mk+DRf$&P~Q% zYm+-NtSfw*-CZ}=aM=9AZuD<NNzXjPU1@xc@2 zYvLNw#!{R*$->!aZhivooB=V#KS(YL`Ru2KZxprlck7dbj zDYK3fLa=SJ!lt^}Lob~LVbqbkY65+3By?BtRD-%JH5{lgsG^qxkr zs=P7{fj)75$1;&bHlG<#rZn>ILza>0Z)A)9GfKkW4=?l(00X|3EA=cxXZcZ0z;r-# zx=@Cw&I2XD5fk`*g}AkE-t&u*N7!WrR#=Oy+Yq#+`J9I!rnlssF3LF6GsR>q47LbT znKs5*cAK;MRMEwyr&dMt`Q0tL=|Tf3DGZ!zdpBcd#Z4>10wa0?7Nm>EZ$Fz9q^x3c zhoper9SZgbAGWlFaAfOK4Mm#QRsq}Frz-&WxYknXN?+JqZN57vk+dbSu9oO=0@1m8 zJJCdbFbc;GB!slTln{PS4#4C63}N#vt8Ka;7&>qVEkSboK5C?=xq^8cyGSoBFgBah z?Rkxr{Po6$Yg*S78tHxaGYu8_$%BmOLPG~gV?0x5(`&bYaB(77xK$skO&aepoE`;c z&UuPRkwDA+b&1Q2l>*UkCGTN|N?*TsBo!)$LPZhc-3p5gi8=Yv*$dTkO#_w5qK6~H z&|DSA&;P|Rxz`Zkc;)fWt88+k)b#!m0hU~aAHjL52kN`kN@va zE_|P6;Nj*?#6J+W)MglGAQr-1i;r^xA@JV=OT;9E18#ejJ5QE@c7e#n$w{@rRndL1 z1PGw_e*F9290`+KnXiA9f4~Fy>Y?x(K#cp>$AS?t7tJ&a>fe110mdposQ+@VZ}qRv zhy6-m_dRC(!OtWAQqTI&O!Pnf`oF)x|FLUxKmfAt`rS7RosbiN54%NI|G}#5|5sl_ z7Cv7m*8!-;0i?@&Kg4f_p;K=jXK<5G0?Lbzu?at7$$vMc{*~*0Gj;&}%^>`ZU2@55 zKYZ_JKm6Z*{J$9o{>rNUm23XPqoIGh{(nPt@Nd`u+x7QG-TuFr3jf>n|91U;Hf1`aKNt^x_jq!uy&sDxbJB zZzcs14Bz-TW@qM~Yj}0CMPgVzc#N6%HP#6S?=G}(4rH}KjBkP8r>O?>N9Zk1X^sbv zx=IK{pIA-5>9FxD!HMx2wF(gUlaPE4b-0#^7ji*i4q@b2Auo2h z$VjO)@{?YDAN~#lQmTV?%$*V`PVnM0S0B)5R@+vPa?;1MG{L}@4joZ=xz7m+Ky&W9 z)S;#wL^Z$v=!zXp!#L>2yHD{PSAJWmUQc86pgb+P<4FOXMOOU(q-Dkf{&5#B%b%`o z_26nT)U#CAdox-JZ*>G)I`@CT1uCJBH(QIY@-$|#SV!;c@46~C(yR=~VN%Upw3?)U&jt@0}Qpa^mH8A}tmE z;$x}B<+>^CvNY3?IY@lH#*@1x#7Hz(#vgv?pTGZqeH_Jlv~BmW^`OX*DhIWXY>hG0 zT_P9pG&($)1jGJrx=gQ%q(h6rBE|AU_y(5wn}pDZ+bp|2>_od zLFnj{i`BIO#y~SMdNDY`U~~mPT&LVSg}3>&C_>6Occ?IpL`_-g7RMr#&HM9 zn5CfM!fzx_)SPv4L}Pn3gpaZEwZ9R|0E;H&CAw)z{XES3JEj0&p#ik)KNtW}C-Sn~ z8HuRw&muB6=8(LL`1)K_W_)B(8ZRXjT2spCO@+;kT@bVv?RhLNngx8m-o4B~EWcr3 z@=^M!En#XVL+3S8o>79wp+d-6)9?gFvDSWn8Z0ZDnvxdtG>!g#)=V{3-o#;;_*7EyRB#=-f4Fwv*7f9fJH0ifCU57EFEvan4tcL78@y<8AR6wIr~>tIulF!FTiI0Z@m`_+obHhMGXRW<4b zn3-aUNO1UfgVnkgbh>^gjTtz<&nbvuQdktRAn#uoRVeecwT&0>?`icwx)kFtYQe+z zB}UI3POj`^D=9Zt%YIVbqL*L3X$)Pl9%pot|IGcSAz*GwwdEWTpvEMw{x~ImBT?BT zgl7qn0#kJ6*>Fc5#D!ZJMk5Q-0Dvl&CT3vwMD5!e{->ZfDe0)I^9@1|%CypD@P@Vi z@(6fv-GO444A;I)H=_;mq~w}01G1jOQ=gOjEy{#^Gu6`*A0_9-GFP27B08ZYcrN+N zu?>suBjH&uK`(mj57AaCh;~Pb27-<`ai~RUY4b4&(XyzBlIanuUiT-M96T``*@kNl z7GlbF(t8#Oh25{eDO=+a%9SN)moQGu`J7WH3w4^$2!rY^)Pah2QLjA#2kpTY8lx6^ zY8lN@#Wj)y2}L#w&;wiX>LG&mYn$2Exo^&fAPCEHZko;q^J*)JG^n^~1R`&xy9Ho|jX*)A~tkB2-WRSrR+@Zg5pJ{HMVc zcMy&6-(R224 zmeCxsD7_Z!9LeTY?1Vhkv?Lk14gTS zH>;#0eqw7uSpE#H$q0X4$JjPOghTIerrQg)IOYop;Est;L3yUAkF_IZ46G8<+46l2 zQ0$!Dw<|i$x6`BfFeMnwrk6#@enDTE$|@_Q_&H6A0LNJWvdvAGqB3I*e65_-wQIKx zah_y2D9T}U{85HxxF}m7&l?i^B46=}Y|yms!;fb?wD^VnEn?oyGY~%wyNe(%AklKM z0n|-wabHgF`0#XQ_BtEDqK(SvgNBh-bh}6z;$KG6#J>n>D8yF`lg$sMWlB`b7y$rP z@=|ca1&-Ns&E~9&sn>VrYn+F%N0i2wYOhyb9Vd%EJB^+IC!N|J!QPcv)g>QaR+MV0 zTe=xmGVsv6*@LSgNB>#H?)+yGC8O?%>xBx$cHT1zD8pgZK6mcx zi@6w&v|3-QfXnT~QHPk(t=6gzBZ^$ZEiW3*6Z6Lk&2tcv$`LWPqCq@>E_bZZ+Z^e~ z5GjwMw_e%+V9p#lf=hltfqt`{5Sfr}@r6)P|0FLwR)TI4VJK>GebhPa(4G3ock0;b z(am5V=hY2F`RFGjhWa<@=eyuK$kg~HND{ooQr3$<#0u;z24IkKTmj&8xV8O1w9R~|mK0AzRR|0pyZcnuEL z3v63CmNgB*MtXLZT@1UboWf6S_t8nP>D~^$wk1#Yg}{@MQVxmad8)L`9H^UZDcKUG zf%MJO(hO-T@IkIykssZf#K}}Tpd?1(rjouwlZg^ix^pGFSXzDO?M4-Oc2)1p$2rAM z`4u#F)~P<7IdKYobh73$`cs8ub_K1+cl?mWY4`B^73W(-HN%@L0Wg5&+~afI1~(k* znDK6RsZ^M;d5Lx8DnfcQ1$x<-X5*_W9yonQP?Jg;r*aH}dvQ6hH7CJ7hTUj+jL)pZ842jDU9d%CwbZeHs{p>C)7fDAyhh&QR8kIp}yXosnWx`lLjG zvj_(*b*?xlS!F+GibJbZzJnwSpLqt2$J-Ysq}`>m^rGMoQOEy^-<-vI`rtM&a0?c_VXXX?&tAOx za%s-gYCkyd%}+W!3o0!H@MR7=4G5e1aEkihR|2K z$N)wOsXOn^l&-LKDZ_$=pBlDl`xFZ4T+Kv}nv&JkcjmB8Ro87^Eu2~A zntO4xjB{1hC*|7DUR3Xgabl&2f1tbYy3h_}L}Ag6Po8rD9a?$;%O z%&P#nRWEe7MHpKiJo>=&hPm+`@^uPyl?#~2B!At0dy$`N1zrxI9Ih8ByrE>I2kyzY zUE;sLZ3b9M)ZEH$%taO|6xXl?tYMFQ(&>5|)ljfK)!jZo*8);t_Xw)3$n-1>mOm-u zk!4+ia8Z=100yqZ2uPJO&W-eMkmnX9sSbt7EIw@!Gg;;sLC#eySir{60LMS7+xy+S zv^%Hd3>FnWVzhXyZv`H{gq9&s%2HgYjZNbyw4#OsGe>sNb*s$aN{rQIZEe>mrp$npIO=h;|&$rrbhB`6i!4mqAJEip>DdxR+Hc2M4Sg? zODqe)+DTh3IC&vdqQLA-I%}sDlud_9Fgjzx>fFLMZT7XPk^GlErohcz-1tQ&M13}wBh81$I!mworpZJ8?q>#pgN zxRA9@bn7mbCK`~f2hR8p-~VT2gxa9uXrIEsd{Ap@rbpVA2LRFY({u^GVA}@3t7HVB zs-GDEVGNZ+x4Q)i?dQZmCA!D~))NwKx!L+xRRt%vsnOl8N3#K-X^z*kf-@c=kz54b zb1W0Mgw#GZTtWHahFA4juW7oHEoDAlh_YY~w*xW-45p(5E4DehmuxidQMrg^A7f}> z6_~1n6!>t4Tka4RNKyjp1s8no43#7mgosa96j53C)QzHQB?0t%Iz%MI^598qGQl7* zSADe%8%|$`r@1f&u!w|VWzMSCWvIj`IPAP9xCI)23KbW?me%W_t14#-2paPU`;@Rwnp6w@g!5MCgwH<-(Lkuw{CO&$T)zI+NQhi;- zk!i$+Iq=ps+DK#BEqPE{j`CYTOZrvN`qtD*CVs)s4igV#+R+B1oaZw>cfv*Yy?QkX z^q}?+0yWe>?dF0Q-yU~3E;n#e5qhjolTx4dfk=qd_1T*OURqn+z1EI|p#zLm#!nr= zj_Api1&0E8(OfjXgXa%mweS0N>zpf$^{`2iz8`L2dp{~<*I~&t($p_K(1)r=rwMOR z16z(!2~5mS_|J2J0RHnURy068yruH#ibmls1hl5OC$6Go7XrHO8ES3M?_JbH-F3D7 zz_#|6q`}<5DfbT%G$HTFwt41C>ztMQ4t5A@cjhn#v1_3<+x;$kQY1NLG&sJDaI3a>2nI26Ex*}-BGq;$R!-%53RAh0tsg^O+Cd-3C*C-h949eH} z#!hUQ@hpbOiR{}8HWv&6Xk~&RMRtynj{}*#lW@Rv_`g_YNUF8ByotDdUSKM%${d)p z6q8Ie0YOZi?98M%pLKiQkL>HfhqZ_XYcDP$BEcxUKGYPG(XKhrAwH`DAgfiO>++va z5*KxCdN%X6kE{!?7e3=)_a8BOcR0K6HSZ^d>Uub)vo%>CLW3iBL@*>PD$KCT?O{VT zI#U*Ay4{S5%ZAD#<*&!_Sid&qYp%->hqUzou<_cMSL4&#=Wy;_0%^DVx53G-y%?{< zR?knZJZ=ckt*;|OI0XwGL^=(QQ>13fuSD!OUeu--hESp=2}#4iT6pdfoJFKj;U>f?GZ-EK7d3klahSi^$T$;il3 z3@3KM)8YK*fuaZJKp{EGJDDfR`(CN zS&i>Y9Bt@$SD~Bdw^i36XWq$Q33!tQ#uCKcV z)Y);`r<3c`(P^}jay&2!nOH^X!)?eBJSSVWJlI83x9qvLMBxjQVTwi(()8C&x?UxA zuP_SHHXP0}U3+YfBP7%mi?i*_zuE$;#P2bkcrXAZ7jfB7(Fs=I;jjk|MVjsHXuNf{ZU~lRCMxUzj)XM zGNw#Vl2OmQV`CyrA5F`Zz=@DikWH(*8YX51Y|+?c8r5*oeLag=1BhH9ZQgKTBv>=G z{noQEdR&kc9XAmk73!NJu0$?C3j{O()6V?fCq%E)RpiT)JL;Dlsf-|XT8Lv#N;g^^ zMlounTj*w>XQ8*b#{v@BO-x>x)pj#N1G@7qG1SCG0|LA8h&%p+a45XUiWzVF8)xh%>$v)w_73oo@U*fb_0iRozHxU)8>y4g>vDu49p zO4TLqlH)Xi18urwQfTisQPT%K!a2#eTfi_D*C{J4SddA&boW^PzWytWR`G#SrJeFn zn#?^!PGxk&$t3`h6FYu?jU)_T59Xm95+j^MsV?s(q`+$_buY%j#SK-in>gIS5xA(_@Q=R+AAZ=pyvQOM;B?z zRKw}qSdQ6)27z`Fw}PA*W5r|l`KYZhK?K>uv0;nHK#zwL(vGFq;qD*%s#Juwt(4 zVtWsHO%EpIIHNdoQn#~v4&z!aJivbK#@l6h4Hr9&)7NZ6DLC|jmM>1Py}|2ZUZ~^I z%bkT+Y>(Dw6Vxs=W}-74LhfHTPM*CL&A{ryd(=8x6=Qelw_0L9RrgJ4^rfp+hdLvvHUp8mk5Gb{3FSjYH(|xzdHZ)J zFC>L1mY6qY&e*mDTfJWijjE83o0&>6ZYD?wu#a3>YW3ln$U5XanOGjEAjZ4em13)W z9xLk9CT9umg$XysM{B@nB%)u~0NbEO8S3^6+0ZvO#DMH&CK#ZobRvs>8S{K9oL0pTM%`1f1T{7_Y2%3$dOg%kF za|^4zY6<}8Fwr%;d~-+2GG*?moWXwFfXwS+KP9a;?ONxlJ}t-A5E^9&Yw+6;mG1-y z@QE*lYU1{?ysN53S^!{kIOx4C1RVr1GUG$BAJ?t~Xhb&aA}6!XLZ7(2kuhe@00L_9 zOW{Fu>S~6ts_sv_=9#dcbT~5 z+r*?q@unt`LV#`O;TA!qgqT*MmhgaUA{!jPJHmf-38KH$XEuF`c`g`C(8AzTvGP~p zZVv==AUd`zfT8$Lqk~j1iteYRh2k2EjN5H`1v4w?3ydRM^(D-6lGG`Vdo53*u9pN&yyV&fd*~c=sE9=i=~e962kFk8sSyhR-B16$)Hw7fTrI#t z$^O&c=I=Kxh|~_7u?FtKjpra!w55vVu^MG(L7ImG7p>alcv3S=yG|dL4ObaVd=6I; zbO^tc0^(YTe(Ts^$1%cA!+xwM1s)cti(gcPpjH)F`S;b&#eLHF$v`B6F&UfLn!{YgRUAhKfJ+8; zEa`060Z^c()i%ZDI!HE;W0nwIXjz<~M?_X;W70ve=TH_* zNEJw!USQo#i4U7`8JQ(0!_D`YpgACCS<$}UFgKEL;ms;Df?X*FYOXsWsB`M>9{7MP zy|*&+^E%~vHVhYaSveE3&Mo-7-BeapegrTrzNj&T?1Fq2eh2b7MRN-S9MzELTNE!` zvWZdP{K}enStAIH|*-z1_TC^)|CcMJHGf9u^-V z65+7of$m^MokIX+pxM7Ixcz<%>-;Xh3<(n%lsj2qaYTk6WV!3(0%94qzW(CTdfFcWInR5d8_?k>Y$*_QkvrRMkC ztGQuqzCpm59DMxr0oMCV`fo_fGQygFAcC000o_K|UFB4t^^<^d>Y6ejX}Y;5X$qW| z9@%0C zyw(TQRzK{it?r!Jm1F&7->x1ja9IBL2mZaJe`qxOa`!+Lzo#Ph=76PKpkag;Ko*cElEXfLyxjma~r^bFY@nV#hE0 z7@0poLDvIT@b9*k0I0eA8hks&>6d-dGV^UayQ%)yUuZD`ad>NK`w*3uEq%s2-FP2! z)!hqaB255lNbeMW>G?lJ1p-w7 literal 0 HcmV?d00001 From 8b88abc83ee2e832a65d7bbdf689f18ed201e05e Mon Sep 17 00:00:00 2001 From: Stamen Stoychev Date: Wed, 4 Feb 2026 18:09:48 +0200 Subject: [PATCH 08/39] refactor(grid-lite): grid-lite overview rearrangement suggestion (#6363) --- en/components/grid-lite/overview.md | 82 +++++------------------------ 1 file changed, 12 insertions(+), 70 deletions(-) diff --git a/en/components/grid-lite/overview.md b/en/components/grid-lite/overview.md index 0bd740ead5..8add1da4e4 100644 --- a/en/components/grid-lite/overview.md +++ b/en/components/grid-lite/overview.md @@ -11,64 +11,11 @@ namespace: Infragistics.Controls The Ignite UI for Angular Grid Lite component is part of Infragistics’ new open-source UI component set that will be actively supported and maintained. It is open-source JavaScript data grid built as a Web Component, which means you can use it dependency-free with or without a web framework. There are 50+ OSS controls now available under the MIT license across Angular, React, Blazor, and Web Components. -The Angular Grid Lite delivers essential data-display functionality with minimal overhead and the performance users expect. It is designed for developers who need fast, lightweight data presentation without the complexity of an enterprise grid. +The Angular Grid Lite delivers essential data-display functionality with minimal overhead and the performance users expect. It is designed for developers who need fast, lightweight data presentation without the complexity of an enterprise grid. To serve this purpose it it comes with the following column-based features: sorting, filtering, hiding, resizing and a variety of pre-defined data types. Blazing-fast performance is delivered with the use of row virtualization. In addition, the component supports keyboard navigation and theming through the [Ignite UI Theming Framework](../themes.md). -Angular Grid Lite features: - -- Column Filtering -- Hiding -- Resizing -- Sorting -- Row Virtualization -- Accessibility -- Themes and Styling -- Column Data Types - -## Installation and Setup - -### Installation -To install GridLite, go to the root folder of your project (where `package.json` is located) and run the following command using npm: - -```cmd -npm install igniteui-grid-lite --save -``` - -Or using yarn: - -```cmd -yarn add igniteui-grid-lite -``` - -### Using Grid Lite in your Angular code - -In the file where you want to use Grid Lite, import and register it before your component class is declared: - -```typescript -import { IgcGridLite } from 'igniteui-grid-lite'; - -IgcGridLite.register(); -``` - -You also need to add `CUSTOM_ELEMENTS_SCHEMA` because we are working with web components for Grid Lite - -```typescript -@Component({ - selector: 'app-grid-lite', - templateUrl: './grid-lite.component.html', - styleUrls: ['./grid-lite.component.scss'], - imports: [CommonModule], - schemas: [CUSTOM_ELEMENTS_SCHEMA] -}) -``` - -Finally add the `` element to your markup: +Grid Lite controls are completely free, MIT licensed, as a part of our initiative to make Ignite UI more open, transparent, and accessible. However, if your project scales and grows in complexity and functionality, and you require an enterprise-grade application, we have an upgrade strategy for transitioning from the Grid Lite to the full-featured and advanced Data Grid. -```html - - -``` +Angular supports custom elements, so you can use Grid Lite with ease. ## Grid Lite in Action @@ -77,11 +24,7 @@ Finally add the `` element to your markup: iframe-src="{environment:demosBaseUrl}/grid-lite/overview/" alt="Angular Grid Lite App Sample Main"> -Grid Lite controls are completely free, MIT licensed, as a part of our initiative to make Ignite UI more open, transparent, and accessible. However, if your project scales and grows in complexity and functionality, and you require an enterprise-grade application, we have an upgrade strategy for transitioning from the Grid Lite to the full-featured and advanced Data Grid. - -Angular supports custom elements, so you can use Grid Lite with ease. - -## Installation +## Installation and Setup To add Grid Lite to your Angular application, install the package from npm. @@ -89,8 +32,6 @@ To add Grid Lite to your Angular application, install the package from npm. npm install igniteui-grid-lite ``` -## Configuration - Before starting the application, make sure to import and pass the custom element schema as shown below. ```typescript @@ -115,29 +56,30 @@ export class AppComponent { columns: ColumnConfiguration = [...]; products: Products[] = [...]; } - ``` -## Performance Built In +## Features + +### Performance Built In Row-level virtualization allows you to render unlimited amounts of data with smooth scrolling. -## Automatic Column Types +### Automatic Column Types Column types are automatically generated base on your data source with built-in filtering based on column type. -## Custom Column Templates +### Custom Column Templates Deliver any type of UX with column templates. Anything you imagine can render in a grid column! -## Interactive Features +### Interactive Features All the core interactive features your users expect, like column filtering, column hiding, column resizing, columns sorting, and more! -## Beautiful UX & Branding +### Beautiful UX & Branding Built-in theme support for Bootstrap, Material & Fluent, plus endless branding options in color palettes, fonts, elevation, display density & more. -## Rich Keyboard Navigation +### Rich Keyboard Navigation Full Excel-style keyboard navigation gives user the experience they expect with high-performance keyboard navigation. From 25c7420cfc38f68ee168f1872f77d1f945815e2d Mon Sep 17 00:00:00 2001 From: igdmdimitrov <49060557+igdmdimitrov@users.noreply.github.com> Date: Thu, 5 Feb 2026 11:18:38 +0200 Subject: [PATCH 09/39] chore(*): fix headings level and text mismatches across pages (#6357) --- en/components/combo-features.md | 2 +- en/components/combo-remote.md | 2 +- en/components/combo-templates.md | 3 ++- en/components/combo.md | 2 +- en/components/dialog.md | 2 +- en/components/drop-down.md | 2 +- en/components/exporter-csv.md | 2 +- en/components/grids_templates/cascading-combos.md | 2 +- en/components/hierarchicalgrid/load-on-demand.md | 4 ++-- en/components/simple-combo.md | 2 +- en/components/treegrid/groupby.md | 4 ++-- en/components/treegrid/load-on-demand.md | 4 ++-- kr/components/autocomplete.md | 2 +- kr/components/avatar.md | 4 ++-- kr/components/badge.md | 4 ++-- kr/components/button-group.md | 4 ++-- kr/components/button.md | 4 ++-- kr/components/card.md | 2 +- kr/components/checkbox.md | 4 ++-- kr/components/combo.md | 2 +- kr/components/data-chart-axis-annotations.md | 2 +- kr/components/dialog.md | 4 ++-- kr/components/display-density.md | 4 ++-- kr/components/divider.md | 4 ++-- kr/components/drop-down.md | 4 ++-- kr/components/exporter-csv.md | 4 ++-- kr/components/financial-chart.md | 2 +- kr/components/general/localization.md | 2 +- kr/components/grid/selection-based-aggregates.md | 4 ++-- kr/components/grids_templates/collapsible-column-groups.md | 4 ++-- kr/components/grids_templates/keyboard-navigation.md | 4 ++-- kr/components/grids_templates/row-pinning.md | 4 ++-- kr/components/grids_templates/sizing.md | 4 ++-- kr/components/grids_templates/state-persistence.md | 4 ++-- kr/components/icon.md | 4 ++-- kr/components/input-group.md | 4 ++-- kr/components/label-input.md | 4 ++-- kr/components/layout.md | 2 +- kr/components/list.md | 4 ++-- kr/components/mask.md | 4 ++-- kr/components/material-icons-extended.md | 2 +- kr/components/month-picker.md | 4 ++-- kr/components/navbar.md | 4 ++-- kr/components/radio-button.md | 4 ++-- kr/components/ripple.md | 4 ++-- kr/components/simple-combo.md | 2 +- kr/components/slider/slider-ticks.md | 2 +- kr/components/slider/slider.md | 2 +- kr/components/snackbar.md | 2 +- kr/components/splitter.md | 2 +- kr/components/switch.md | 2 +- kr/components/tabbar.md | 4 ++-- kr/components/tabs.md | 4 ++-- kr/components/texthighlight.md | 2 +- kr/components/themes/component-themes.md | 2 +- kr/components/themes/examples.md | 2 +- kr/components/themes/global-theme.md | 2 +- kr/components/themes/index.md | 2 +- kr/components/themes/palette.md | 2 +- kr/components/themes/schemas.md | 2 +- kr/components/themes/theming-demo.md | 2 +- kr/components/time-picker.md | 4 ++-- kr/components/toast.md | 2 +- kr/components/toggle.md | 2 +- kr/components/tooltip.md | 4 ++-- 65 files changed, 98 insertions(+), 97 deletions(-) diff --git a/en/components/combo-features.md b/en/components/combo-features.md index 54152ae132..15d5ba4d0a 100644 --- a/en/components/combo-features.md +++ b/en/components/combo-features.md @@ -215,7 +215,7 @@ export class ComboDemo {
-## API Summary +## API References
diff --git a/en/components/combo-remote.md b/en/components/combo-remote.md index 1a46bf6aa6..f1c2352044 100644 --- a/en/components/combo-remote.md +++ b/en/components/combo-remote.md @@ -229,7 +229,7 @@ When using a combobox bound to remote data loaded in chunks and dealing with a m When the combobox is bound to remote data, setting value/selected items through API will only take into account the items that are loaded in the current chunk. If you want to set an initial value, make sure those specific items are loaded before selecting. -## API Summary +## API References
diff --git a/en/components/combo-templates.md b/en/components/combo-templates.md index 398bd6b69b..b60f22ebc2 100644 --- a/en/components/combo-templates.md +++ b/en/components/combo-templates.md @@ -154,7 +154,8 @@ When used with templates, the `igxComboClearIcon` and the `igxComboToggleIcon` s ``` -## API Summary +## API References +
diff --git a/en/components/combo.md b/en/components/combo.md index eb196d3b67..e73228470b 100644 --- a/en/components/combo.md +++ b/en/components/combo.md @@ -458,7 +458,7 @@ At the end your combo should look like this: > [!NOTE] > The combobox uses `igxForOf` directive internally hence all `igxForOf` limitations are valid for the combobox. For more details see [`igxForOf Known Issues`](for-of.md#known-limitations) section. -## API Summary +## API References
diff --git a/en/components/dialog.md b/en/components/dialog.md index 344c90e9fd..59c810d746 100644 --- a/en/components/dialog.md +++ b/en/components/dialog.md @@ -361,7 +361,7 @@ The last step is to **include** the component theme in our application.
-## API Summary +## API References
diff --git a/en/components/drop-down.md b/en/components/drop-down.md index 9119f123c1..08dfae8287 100644 --- a/en/components/drop-down.md +++ b/en/components/drop-down.md @@ -653,7 +653,7 @@ The last step is to pass the custom drop-down theme to a class or element select
-## API Summary +## API References - [IgxDropDownComponent]({environment:angularApiUrl}/classes/igxdropdowncomponent.html) - [IgxDropDownComponent Styles]({environment:sassApiUrl}/themes#function-drop-down-theme) diff --git a/en/components/exporter-csv.md b/en/components/exporter-csv.md index 3d85609645..159b2b0ecd 100644 --- a/en/components/exporter-csv.md +++ b/en/components/exporter-csv.md @@ -164,7 +164,7 @@ this.csvExportService.export(this.igxGrid1, new IgxCsvExporterOptions('ExportedD When you are exporting data from [**IgxGrid**](grid/grid.md) the export process takes in account features like row filtering and column hiding and exports only the data visible in the grid. You can configure the exporter service to include filtered rows or hidden columns by setting properties on the [`IgxCsvExporterOptions`]({environment:angularApiUrl}/classes/igxcsvexporteroptions.html) object. These properties are described in the table below. -## API Summary +## API References The CSV Exporter service has a few more APIs to explore, which are listed below. diff --git a/en/components/grids_templates/cascading-combos.md b/en/components/grids_templates/cascading-combos.md index 9d8eedef28..20aca0ca05 100644 --- a/en/components/grids_templates/cascading-combos.md +++ b/en/components/grids_templates/cascading-combos.md @@ -86,7 +86,7 @@ The [`id`]({environment:angularApiUrl}/classes/igxlinearprogressbarcomponent.htm ``` -## API Summary +## API References
diff --git a/en/components/hierarchicalgrid/load-on-demand.md b/en/components/hierarchicalgrid/load-on-demand.md index d993352052..ed5c1e2e69 100644 --- a/en/components/hierarchicalgrid/load-on-demand.md +++ b/en/components/hierarchicalgrid/load-on-demand.md @@ -212,12 +212,12 @@ private buildUrl(event: IGridCreatedEventArgs) { } ```` -### API References +## API References - [IgxHierarchicalGridComponent]({environment:angularApiUrl}/classes/igxhierarchicalgridcomponent.html) - [IgxRowIslandComponent]({environment:angularApiUrl}/classes/igxrowislandcomponent.html) -### Additional Resources +## Additional Resources
diff --git a/en/components/simple-combo.md b/en/components/simple-combo.md index 2a45e1efa6..0bcffb0f88 100644 --- a/en/components/simple-combo.md +++ b/en/components/simple-combo.md @@ -406,7 +406,7 @@ The last step is to include the component's theme. > [!NOTE] > The simple combobox uses `igxForOf` directive internally hence all `igxForOf` limitations are valid for the simple combobox. For more details see [igxForOf Known Issues](for-of.md#known-limitations) section. -## API Summary +## API References
diff --git a/en/components/treegrid/groupby.md b/en/components/treegrid/groupby.md index 3a160fc561..d5da770138 100644 --- a/en/components/treegrid/groupby.md +++ b/en/components/treegrid/groupby.md @@ -173,14 +173,14 @@ private reloadData() { |--- |--- | |Grouping is not updated with batch editing | When using Tree Grid Group By with batch editing enabled (`batchEditing=true`), the grouping is not automatically updated when editing column values that are used for grouping. The grouping will only be updated after committing the transaction. | -### API References +## API References
- [IgxTreeGridComponent]({environment:angularApiUrl}/classes/igxtreegridcomponent.html) - [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) -### Additional Resources +## Additional Resources
diff --git a/en/components/treegrid/load-on-demand.md b/en/components/treegrid/load-on-demand.md index be72a80c32..6f8f380f1d 100644 --- a/en/components/treegrid/load-on-demand.md +++ b/en/components/treegrid/load-on-demand.md @@ -67,14 +67,14 @@ If you want to provide your own custom loading indicator, you may create an ng-t ``` -### API References +## API References
- [IgxTreeGridComponent]({environment:angularApiUrl}/classes/igxtreegridcomponent.html) - [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) -### Additional Resources +## Additional Resources
diff --git a/kr/components/autocomplete.md b/kr/components/autocomplete.md index 1813373f6a..d649d887d2 100644 --- a/kr/components/autocomplete.md +++ b/kr/components/autocomplete.md @@ -244,7 +244,7 @@ For the purpose of the sample there is a delay in the data loading, in order to * [IgxDropDownComponent]({environment:angularApiUrl}/classes/igxdropdowncomponent.html) * [IgxInputGroup]({environment:angularApiUrl}/classes/igxinputgroupcomponent.html) -### Additional Resources +## Additional Resources
* [IgxDropDownComponent](drop-down.md) diff --git a/kr/components/avatar.md b/kr/components/avatar.md index b19a269ccc..2ef33f85de 100644 --- a/kr/components/avatar.md +++ b/kr/components/avatar.md @@ -102,13 +102,13 @@ Analogically, the avatar can display an icon via the [`icon`]({environment:angul ``` -### API References +## API References
* [IgxAvatarComponent]({environment:angularApiUrl}/classes/igxavatarcomponent.html) * [IgxAvatarComponent Styles]({environment:sassApiUrl}/themes#function-avatar-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/badge.md b/kr/components/badge.md index f32f05d09f..7d5a7ca535 100644 --- a/kr/components/badge.md +++ b/kr/components/badge.md @@ -213,7 +213,7 @@ If the sample is configured properly, a list of members should be displayed and -### API References +## API References
* [IgxAvatarComponent]({environment:angularApiUrl}/classes/igxavatarcomponent.html) @@ -223,7 +223,7 @@ If the sample is configured properly, a list of members should be displayed and * [IgxListItemComponent]({environment:angularApiUrl}/classes/igxlistitemcomponent.html) * [Type]({environment:angularApiUrl}/enums/type.html) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/button-group.md b/kr/components/button-group.md index 02dd629bfd..802ec59326 100644 --- a/kr/components/button-group.md +++ b/kr/components/button-group.md @@ -218,14 +218,14 @@ public ngOnInit() { -### API References +## API References
* [IgxButtonDirective]({environment:angularApiUrl}/classes/igxbuttondirective.html) * [IgxButtonGroupComponent]({environment:angularApiUrl}/classes/igxbuttongroupcomponent.html) * [IgxButtonGroup Styles]({environment:sassApiUrl}/themes#function-button-group-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/button.md b/kr/components/button.md index b1fa7da995..0c0dc644f4 100644 --- a/kr/components/button.md +++ b/kr/components/button.md @@ -183,14 +183,14 @@ And the final result:
-### API References +## API References
* [IgxButtonDirective]({environment:angularApiUrl}/classes/igxbuttondirective.html) * [IgxButton Styles]({environment:sassApiUrl}/themes#function-button-theme) * [IgxRippleDirective]({environment:angularApiUrl}/classes/igxrippledirective.html) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/card.md b/kr/components/card.md index ae95f87afb..5d21b1b422 100644 --- a/kr/components/card.md +++ b/kr/components/card.md @@ -209,7 +209,7 @@ Styles:
-### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/checkbox.md b/kr/components/checkbox.md index ff8d26a924..dce871fa15 100644 --- a/kr/components/checkbox.md +++ b/kr/components/checkbox.md @@ -87,14 +87,14 @@ The final result would be something like that: -### API References +## API References
* [IgxCheckboxComponent]({environment:angularApiUrl}/classes/igxcheckboxcomponent.html) * [IgxCheckboxComponent Styles]({environment:sassApiUrl}/themes#function-checkbox-theme) * [LabelPosition]({environment:angularApiUrl}/enums/labelposition.html) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/combo.md b/kr/components/combo.md index e4bf5d6e61..f9c03ff532 100644 --- a/kr/components/combo.md +++ b/kr/components/combo.md @@ -123,7 +123,7 @@ When igxCombo is opened, allow custom values are enabled and add item button is > [!NOTE] > `igxCombo` uses `igxForOf` directive internally hence all `igxForOf` limitations are valid for `igxCombo`. For more details see [igxForOf Known Issues](for-of.html#known-limitations) section. -### Additional Resources +## Additional Resources
* [Combo Features](combo-features.md) diff --git a/kr/components/data-chart-axis-annotations.md b/kr/components/data-chart-axis-annotations.md index 7a64fa1909..7a7a6847eb 100644 --- a/kr/components/data-chart-axis-annotations.md +++ b/kr/components/data-chart-axis-annotations.md @@ -52,7 +52,7 @@ This code demonstrates how to create a Ignite UI for Angular data chart with eac ``` -### Additional Resources +## Additional Resources - [Data Chart Series Annotations](data-chart-series-annotations.md) - [Value Overlay](data-chart-value-overlay.md) diff --git a/kr/components/dialog.md b/kr/components/dialog.md index 5b46fa0376..30a626325c 100644 --- a/kr/components/dialog.md +++ b/kr/components/dialog.md @@ -156,7 +156,7 @@ Dialog title area can be customized using `igxDialogTitle` directive or `igx-dia
-### API Summary +## API References
* [IgxDialogComponent]({environment:angularApiUrl}/classes/igxdialogcomponent.html) @@ -164,7 +164,7 @@ Dialog title area can be customized using `igxDialogTitle` directive or `igx-dia * [IgxOverlay]({environment:angularApiUrl}/interfaces/overlaysettings.html) * [IgxOverlay Styles]({environment:sassApiUrl}/themes#function-overlay-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/display-density.md b/kr/components/display-density.md index 114fd3b070..708192b193 100644 --- a/kr/components/display-density.md +++ b/kr/components/display-density.md @@ -45,7 +45,7 @@ To set the display density explicitly for a control, use the [`displayDensity`]( ... ``` -### API References +## API References
* [DisplayDensity]({environment:angularApiUrl}/enums/displaydensity.html) @@ -53,7 +53,7 @@ To set the display density explicitly for a control, use the [`displayDensity`]( * [IDisplayDensityOptions]({environment:angularApiUrl}/interfaces/idisplaydensityoptions.html) * [DisplayDensityToken]({environment:angularApiUrl}/index.html#displaydensitytoken) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/divider.md b/kr/components/divider.md index 9ebc42cb16..f623c22606 100644 --- a/kr/components/divider.md +++ b/kr/components/divider.md @@ -77,13 +77,13 @@ To inset the divider, set the `middle` attribute of the divider to `true` and pr If the value of the `middle` attribute is set to a falsy value, or if the attribute is omitted altoghether, the divider will set in only on the left. -### API References +## API References
* [IgxDividerDirective]({environment:angularApiUrl}/classes/igxdividerdirective.html) * [IgxDividerDirective Styles]({environment:sassApiUrl}/themes#function-divider-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/drop-down.md b/kr/components/drop-down.md index 5219a0d190..8161a67bd8 100644 --- a/kr/components/drop-down.md +++ b/kr/components/drop-down.md @@ -392,14 +392,14 @@ When [allowItemsFocus]({environment:angularApiUrl}/classes/igxdropdowncomponent.
-### API Summary +## API References * [IgxDropDownComponent]({environment:angularApiUrl}/classes/igxdropdowncomponent.html) * [IgxDropDownComponent Styles]({environment:sassApiUrl}/themes#function-drop-down-theme) * [IgxDropDownItemComponent]({environment:angularApiUrl}/classes/igxdropdownitemcomponent.html). * [IgxOverlay]({environment:angularApiUrl}/interfaces/overlaysettings.html) * [IgxOverlay Styles]({environment:sassApiUrl}/themes#function-overlay-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/exporter-csv.md b/kr/components/exporter-csv.md index 6ed07cef10..689f8238ff 100644 --- a/kr/components/exporter-csv.md +++ b/kr/components/exporter-csv.md @@ -157,7 +157,7 @@ this.csvExportService.export(this.igxGrid1, new IgxCsvExporterOptions("ExportedD When you are exporting data from [**IgxGrid**](grid/grid.md) the export process takes in account features like row filtering and column hiding and exports only the data visible in the grid. You can configure the exporter service to include filtered rows or hidden columns by setting properties on the [`IgxCsvExporterOptions`]({environment:angularApiUrl}/classes/igxcsvexporteroptions.html) object. These properties are described in the table below. -### API Summary +## API References The CSV Exporter service has a few more APIs to explore, which are listed below. @@ -171,7 +171,7 @@ Additional components that were used:
-### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/financial-chart.md b/kr/components/financial-chart.md index 6bc2f12a38..c4f50f2a20 100644 --- a/kr/components/financial-chart.md +++ b/kr/components/financial-chart.md @@ -121,7 +121,7 @@ let data = [ ``` -### Additional Resources +## Additional Resources - [Binding Multiple Sources](financial-chart-multiple-data.md) - [Binding High Volume Data](financial-chart-high-volume.md) diff --git a/kr/components/general/localization.md b/kr/components/general/localization.md index 297a96351b..1694e1fff7 100644 --- a/kr/components/general/localization.md +++ b/kr/components/general/localization.md @@ -100,7 +100,7 @@ public ngOnInit(): void { } ``` -### Additional Resources +## Additional Resources
diff --git a/kr/components/grid/selection-based-aggregates.md b/kr/components/grid/selection-based-aggregates.md index 0854d360a3..eb548349c0 100644 --- a/kr/components/grid/selection-based-aggregates.md +++ b/kr/components/grid/selection-based-aggregates.md @@ -48,13 +48,13 @@ Change the selection to see summaries of the currently selected range. -### API References +## API References * [IgxGridComponent API]({environment:angularApiUrl}/classes/igxgridcomponent.html) * [IgxGridCell API]({environment:angularApiUrl}/classes/igxgridcell.html) * [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) -### Additional Resources +## Additional Resources
* [Grid overview](grid.md) diff --git a/kr/components/grids_templates/collapsible-column-groups.md b/kr/components/grids_templates/collapsible-column-groups.md index 0655fce6ea..736f14f3fe 100644 --- a/kr/components/grids_templates/collapsible-column-groups.md +++ b/kr/components/grids_templates/collapsible-column-groups.md @@ -137,14 +137,14 @@ Another way to achieve this behavior is to use the igxCollapsibleIndicator direc > hidden and you have a group defined where the same column should be shown, the column will be shown. -### API References +## API References
* [IgxColumnComponent]({environment:angularApiUrl}/classes/igxcolumncomponent.html) * [IgxGridComponent]({environment:angularApiUrl}/classes/igxgridcomponent.html) * [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) -### Additional Resources +## Additional Resources
* [Grid overview](grid.md) diff --git a/kr/components/grids_templates/keyboard-navigation.md b/kr/components/grids_templates/keyboard-navigation.md index d2a1a6c666..3effd488a2 100644 --- a/kr/components/grids_templates/keyboard-navigation.md +++ b/kr/components/grids_templates/keyboard-navigation.md @@ -227,11 +227,11 @@ You can try the `actions below` in order to observe the custom keyboard navigati |--- |--- | | Navigating inside grid with scrollable parent container. | If the grid is positioned inside a scrollable parent container and the user navigates inside the grid, it will not scroll the parent container if there are cells out of view.| -### API References +## API References * [@@igxNameComponent API]({environment:angularApiUrl}/classes/@@igTypeDoc.html) * [@@igxNameComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) -### Additional Resources +## Additional Resources
* [@@igComponent overview](@@igMainTopic.md) diff --git a/kr/components/grids_templates/row-pinning.md b/kr/components/grids_templates/row-pinning.md index bf901e9396..b1dd96a082 100644 --- a/kr/components/grids_templates/row-pinning.md +++ b/kr/components/grids_templates/row-pinning.md @@ -470,7 +470,7 @@ If the component is using an [`Emulated`](themes/sass/component-themes.md#view-e } -### API References +## API References * [@@igxNameComponent]({environment:angularApiUrl}/classes/@@igTypeDoc.html) * [IgxGridRow]({environment:angularApiUrl}/classes/igxgridrow.html) * [IgxTreeGridRow]({environment:angularApiUrl}/classes/igxtreegridrow.html) @@ -478,7 +478,7 @@ If the component is using an [`Emulated`](themes/sass/component-themes.md#view-e * [RowType]({environment:angularApiUrl}/interfaces/RowType.html) * [@@igxNameComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) -### Additional Resources +## Additional Resources
* [@@igComponent overview](@@igMainTopic.md) diff --git a/kr/components/grids_templates/sizing.md b/kr/components/grids_templates/sizing.md index dac4a7e371..e9c8ca3685 100644 --- a/kr/components/grids_templates/sizing.md +++ b/kr/components/grids_templates/sizing.md @@ -259,13 +259,13 @@ The difference is that for the child grid, when `height` is set to percentages, --- } -### API References +## API References * [@@igxNameComponent API]({environment:angularApiUrl}/classes/@@igTypeDoc.html) @@if (igxName !== 'IgxTreeGrid') {* [IgxGridRow API]({environment:angularApiUrl}/classes/igxgridrow.html)}@@if (igxName === 'IgxTreeGrid') {* [IgxTreeGridRow API]({environment:angularApiUrl}/classes/igxtreegridrow.html)} * [@@igxNameComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) -### Additional Resources +## Additional Resources
* [@@igComponent overview](@@igMainTopic.md) diff --git a/kr/components/grids_templates/state-persistence.md b/kr/components/grids_templates/state-persistence.md index 499583d137..a52a8c9c3e 100644 --- a/kr/components/grids_templates/state-persistence.md +++ b/kr/components/grids_templates/state-persistence.md @@ -131,13 +131,13 @@ public initColumns(column: IgxColumnComponent) {
-### API References +## API References * [IgxGridComponent]({environment:angularApiUrl}/classes/igxgridcomponent.html) * [IgxGridStateDirective]({environment:angularApiUrl}/classes/igxgridstatedirective.html) -### Additional Resources +## Additional Resources
* [@@igComponent overview](@@igMainTopic.md) diff --git a/kr/components/icon.md b/kr/components/icon.md index 75027db11c..f0695b5006 100644 --- a/kr/components/icon.md +++ b/kr/components/icon.md @@ -211,13 +211,13 @@ This way, due to Angular's [ViewEncapsulation](https://angular.io/api/core/Compo * The [`IgxIconComponent`]({environment:angularApiUrl}/classes/igxiconcomponent.html) `iconName` property is deprecated. To set the icon name for 'material' icons, place the name of the icon between the opening and closing tags. For 'Font Awesome' and SVG icons, use the `name` property. -### API References +## API References
* [IgxIconComponent]({environment:angularApiUrl}/classes/igxiconcomponent.html) * [IgxIconComponent Styles]({environment:sassApiUrl}/themes#function-icon-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/input-group.md b/kr/components/input-group.md index bb7a416225..35cde1e616 100644 --- a/kr/components/input-group.md +++ b/kr/components/input-group.md @@ -97,13 +97,13 @@ Our inputs could be styled differently by using the [`type`]({environment:angula -### API References +## API References * [IgxHintDirective]({environment:angularApiUrl}/classes/igxhintdirective.html) * [IgxInputDirective]({environment:angularApiUrl}/classes/igxinputdirective.html) * [IgxInputGroupComponent]({environment:angularApiUrl}/classes/igxinputgroupcomponent.html) * [IgxInputGroupComponent Styles]({environment:sassApiUrl}/themes#function-input-group-theme) -### Additional Resources +## Additional Resources Related topics: * [Reactive Forms Integration](angular-reactive-form-validation.md) diff --git a/kr/components/label-input.md b/kr/components/label-input.md index f3344addab..9b27be8c18 100644 --- a/kr/components/label-input.md +++ b/kr/components/label-input.md @@ -100,11 +100,11 @@ and in our markup: ### Input Group You can read about the Input Group component in a separate topic [here](input-group.md). -### API References +## API References * [IgxInputDirective]({environment:angularApiUrl}/classes/igxinputdirective.html) * [IgxInputGroupComponent]({environment:angularApiUrl}/classes/igxinputgroupcomponent.html) -### Additional Resources +## Additional Resources Related topics: * [Input Group](input-group.md) diff --git a/kr/components/layout.md b/kr/components/layout.md index 3dc29e119e..a20aa62d23 100644 --- a/kr/components/layout.md +++ b/kr/components/layout.md @@ -32,7 +32,7 @@ Use the [`igxFlex`]({environment:angularApiUrl}/classes/igxflexdirective.html) d
-### API References +## API References
* [IgxLayoutDirective]({environment:angularApiUrl}/classes/igxlayoutdirective.html) diff --git a/kr/components/list.md b/kr/components/list.md index 05ceefb2c8..2b33768286 100644 --- a/kr/components/list.md +++ b/kr/components/list.md @@ -626,7 +626,7 @@ public selectItem(item) {
-### API References +## API References In this article we covered a lot of ground with the list component. We created a list of contact items. Used some additional Ignite UI for Angular components inside our list items, like avatars and icons. Created some custom item layout and styled it. Finally, we added list filtering. The list component has a few more APIs to explore, which are listed below. @@ -643,7 +643,7 @@ Additional components that were used:
-### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/mask.md b/kr/components/mask.md index 4e82dfb551..7d61f48ecd 100644 --- a/kr/components/mask.md +++ b/kr/components/mask.md @@ -287,7 +287,7 @@ value = null; -### API References +## API References
* [IgxInputDirective]({environment:angularApiUrl}/classes/igxinputdirective.html) @@ -295,7 +295,7 @@ value = null; * [IgxMaskDirective]({environment:angularApiUrl}/classes/igxmaskdirective.html) * [IgxSnackbarComponent]({environment:angularApiUrl}/classes/igxsnackbarcomponent.html) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/material-icons-extended.md b/kr/components/material-icons-extended.md index 11e4058930..1c6498d6ae 100644 --- a/kr/components/material-icons-extended.md +++ b/kr/components/material-icons-extended.md @@ -71,7 +71,7 @@ To use the icons in your component template: For more info and other types of usages, goo to our * [GitHub repo](https://github.com/IgniteUI/material-icons-extended). -### Additional Resources +## Additional Resources
[`IgxIconService`]({environment:angularApiUrl}/classes/igxiconservice.html) diff --git a/kr/components/month-picker.md b/kr/components/month-picker.md index fbb4e87cdc..e9ce504e94 100644 --- a/kr/components/month-picker.md +++ b/kr/components/month-picker.md @@ -158,7 +158,7 @@ Here is an example of localizing the month picker component: - Enter key to select the currently focused month and close the view, - Tab key to navigate through the months. -### API References +## API References
* [IgxMonthPickerComponent]({environment:angularApiUrl}/classes/igxmonthpickercomponent.html) @@ -167,7 +167,7 @@ Here is an example of localizing the month picker component:
-### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/navbar.md b/kr/components/navbar.md index 7d4c7d956a..11dcd1a6c6 100644 --- a/kr/components/navbar.md +++ b/kr/components/navbar.md @@ -144,7 +144,7 @@ Finally, this is how our navbar should look like with its custom action icon: > [!NOTE] > If [`igx-action-icon`]({environment:angularApiUrl}/classes/igxactionicondirective.html) is provided, the default [`actionButtonIcon`]({environment:angularApiUrl}/classes/igxnavbarcomponent.html#actionbuttonicon) will not be used. -### API References +## API References In this article we show a few scenarios where the navbar component may come in handy. The APIs, we used to achieve them, are listed in the links below. @@ -160,7 +160,7 @@ Styles: * [`IgxNavbarComponent Styles`]({environment:sassApiUrl}/themes#function-navbar-theme) * [`IgxIconComponent Styles`]({environment:sassApiUrl}/themes#function-icon-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/radio-button.md b/kr/components/radio-button.md index 65cce8a90b..02ec9bf16e 100644 --- a/kr/components/radio-button.md +++ b/kr/components/radio-button.md @@ -148,14 +148,14 @@ Note that, setting the [`igx-radio-group`]({environment:angularApiUrl}/classes/i public fruits = ["Apple", "Mango", "Banana", "Orange"]; ``` -### API References +## API References
* [IgxRadioComponent]({environment:angularApiUrl}/classes/igxradiocomponent.html) * [IgxRadioGroupDirective]({environment:angularApiUrl}/classes/igxradiogroupdirective.html) * [IgxRadioComponent Styles]({environment:sassApiUrl}/themes#function-radio-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/ripple.md b/kr/components/ripple.md index 34d89deef2..2aebba383c 100644 --- a/kr/components/ripple.md +++ b/kr/components/ripple.md @@ -204,13 +204,13 @@ This way, due to Angular's [ViewEncapsulation](https://angular.io/api/core/Compo -### API References +## API References
* [IgxRippleDirective]({environment:angularApiUrl}/classes/igxrippledirective.html) * [IgxRipple Styles]({environment:sassApiUrl}/themes#function-ripple-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/simple-combo.md b/kr/components/simple-combo.md index 523ac75647..662ba56ef0 100644 --- a/kr/components/simple-combo.md +++ b/kr/components/simple-combo.md @@ -336,7 +336,7 @@ The last step is to include the component's theme. > [!NOTE] > The simple combobox uses `igxForOf` directive internally hence all `igxForOf` limitations are valid for the simple combobox. For more details see [igxForOf Known Issues](for-of.md#known-limitations) section. -## API Summary +## API References
* [IgxSimpleComboComponent]({environment:angularApiUrl}/classes/igxsimplecombocomponent.html) diff --git a/kr/components/slider/slider-ticks.md b/kr/components/slider/slider-ticks.md index 775109c738..571f378391 100644 --- a/kr/components/slider/slider-ticks.md +++ b/kr/components/slider/slider-ticks.md @@ -231,7 +231,7 @@ From the **tackLabel** callback above, we can see that every **primary** tick ** -### API References +## API References
* [IgxSliderComponent]({environment:angularApiUrl}/classes/igxslidercomponent.html) diff --git a/kr/components/slider/slider.md b/kr/components/slider/slider.md index b36fb9f2a1..819ef931dd 100644 --- a/kr/components/slider/slider.md +++ b/kr/components/slider/slider.md @@ -271,7 +271,7 @@ The [context]({environment:angularApiUrl}/classes/igxslidercomponent.html#contex ``` -### API References +## API References
* [IgxSliderComponent]({environment:angularApiUrl}/classes/igxslidercomponent.html) diff --git a/kr/components/snackbar.md b/kr/components/snackbar.md index 4f5c70b43d..065d60139b 100644 --- a/kr/components/snackbar.md +++ b/kr/components/snackbar.md @@ -238,7 +238,7 @@ public restore() {
-### API References +## API References In this article we learned how to use and configure the [`IgxSnackbarComponent`]({environment:angularApiUrl}/classes/igxsnackbarcomponent.html). For more details in regards its API, take a look at the links below: * [`IgxSnackbarComponent`]({environment:angularApiUrl}/classes/igxsnackbarcomponent.html) diff --git a/kr/components/splitter.md b/kr/components/splitter.md index dc1ffe3dc6..4a9587ef01 100644 --- a/kr/components/splitter.md +++ b/kr/components/splitter.md @@ -203,7 +203,7 @@ This is the final result from applying your new theme. -### API References +## API References
* [IgxSplitterComponent]({environment:angularApiUrl}/classes/igxsplittercomponent.html) diff --git a/kr/components/switch.md b/kr/components/switch.md index 80102cac4f..3df799f14d 100644 --- a/kr/components/switch.md +++ b/kr/components/switch.md @@ -80,7 +80,7 @@ The final result would be something like that: -### API References +## API References
* [IgxSwitchComponent]({environment:angularApiUrl}/classes/igxswitchcomponent.html) diff --git a/kr/components/tabbar.md b/kr/components/tabbar.md index 74ac3cf89c..c1c7a1ab4c 100644 --- a/kr/components/tabbar.md +++ b/kr/components/tabbar.md @@ -339,7 +339,7 @@ And don't forget to include the following CSS definitions in order for the appli You can see the result of the code above at the beginning of this article in the [Bottom Navigation Demo](#bottom-navigation-demo) section. -### API References +## API References
* [IgxAvatarComponent]({environment:angularApiUrl}/classes/igxavatarcomponent.html) @@ -351,7 +351,7 @@ You can see the result of the code above at the beginning of this article in the * [IgxTabComponent]({environment:angularApiUrl}/classes/igxtabcomponent.html) * [IgxTabPanelComponent]({environment:angularApiUrl}/classes/igxtabpanelcomponent.html) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/tabs.md b/kr/components/tabs.md index 9fff6f0202..4d5bf4d7b2 100644 --- a/kr/components/tabs.md +++ b/kr/components/tabs.md @@ -384,7 +384,7 @@ const routes: Routes = [ -### API References +## API References
* [IgxAvatarComponent]({environment:angularApiUrl}/classes/igxavatarcomponent.html) @@ -396,7 +396,7 @@ const routes: Routes = [ * [IgxTabsGroupComponent]({environment:angularApiUrl}/classes/igxtabsgroupcomponent.html) * [IgxTabItemComponent]({environment:angularApiUrl}/classes/igxtabitemcomponent.html) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/texthighlight.md b/kr/components/texthighlight.md index 84c4fe214c..fd13aad448 100644 --- a/kr/components/texthighlight.md +++ b/kr/components/texthighlight.md @@ -281,7 +281,7 @@ Additional components that were used: * [`IgxInputGroupComponent Styles`]({environment:sassApiUrl}/themes#function-input-group-theme)
-### Additional Resources +## Additional Resources * [Grid Search](grid/search.md)
diff --git a/kr/components/themes/component-themes.md b/kr/components/themes/component-themes.md index 8ea6efb6db..a68eb78915 100644 --- a/kr/components/themes/component-themes.md +++ b/kr/components/themes/component-themes.md @@ -210,7 +210,7 @@ As a bonus, any Ignite UI for Angular theme built with the `$igx-legacy-support`
-### Additional Resources +## Additional Resources
Learn how to configure a global theme: diff --git a/kr/components/themes/examples.md b/kr/components/themes/examples.md index f1dcf10086..612d63f5fc 100644 --- a/kr/components/themes/examples.md +++ b/kr/components/themes/examples.md @@ -321,7 +321,7 @@ Now we can easily change our defined themes with only a `click` event: * [IgxInputGroupComponent Styles]({environment:sassApiUrl}/themes#function-input-group-theme) * [IgxOverlay Styles]({environment:sassApiUrl}/themes#function-overlay-theme) -### Additional Resources +## Additional Resources
* [Global Theme](global-theme.md) diff --git a/kr/components/themes/global-theme.md b/kr/components/themes/global-theme.md index 7472492dc9..5a49b0b676 100644 --- a/kr/components/themes/global-theme.md +++ b/kr/components/themes/global-theme.md @@ -98,7 +98,7 @@ The general rule of thumb regarding what the value of `$legacy-support` should b
-### Additional Resources +## Additional Resources
Learn how to create individual component themes: diff --git a/kr/components/themes/index.md b/kr/components/themes/index.md index 838337251d..f763b08562 100644 --- a/kr/components/themes/index.md +++ b/kr/components/themes/index.md @@ -42,7 +42,7 @@ Finally, we have component themes. Palettes and Schemas wouldn't do much good on Typography is a separate module in our Sass theming framework, which is decoupled from the component themes. Although we have a default typeface of choice, we really want to give you the power to style your application in every single way. Typography is such an important part of that. We provide a method for changing the font family, the sizes and weights for headings, subheadings, buttons, body text, etc. in your app.
-### Additional Resources +## Additional Resources
Learn how to create themes: diff --git a/kr/components/themes/palette.md b/kr/components/themes/palette.md index 56ada04107..098b3cf72f 100644 --- a/kr/components/themes/palette.md +++ b/kr/components/themes/palette.md @@ -125,7 +125,7 @@ The above code will generate CSS classes for each color variant in the palette. * [Getting Contrast Colors]({environment:sassApiUrl}/palettes#function-contrast-color) * [Generating Color Classes]({environment:sassApiUrl}/utilities#mixin-color-classes) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/themes/schemas.md b/kr/components/themes/schemas.md index 384775329a..745a4ced77 100644 --- a/kr/components/themes/schemas.md +++ b/kr/components/themes/schemas.md @@ -126,7 +126,7 @@ Another great feature of theme schemas is that you can have as many as you want * [Global Theme]({environment:sassApiUrl}/themes#mixin-theme) * [Avatar Theme]({environment:sassApiUrl}/themes#function-avatar-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/themes/theming-demo.md b/kr/components/themes/theming-demo.md index f42e1c043d..ec325b7c7e 100644 --- a/kr/components/themes/theming-demo.md +++ b/kr/components/themes/theming-demo.md @@ -321,7 +321,7 @@ Now we can easily change our defined themes with only a `click` event: * [IgxInputGroupComponent Styles]({environment:sassApiUrl}/themes#function-input-group-theme) * [IgxOverlay Styles]({environment:sassApiUrl}/themes#function-overlay-theme) -### Additional Resources +## Additional Resources
* [Global Theme](global-theme.md) diff --git a/kr/components/time-picker.md b/kr/components/time-picker.md index 9da0d71afd..51ade63efe 100644 --- a/kr/components/time-picker.md +++ b/kr/components/time-picker.md @@ -342,7 +342,7 @@ The result is as follows:
-### API References +## API References
* [IgxIconComponent]({environment:angularApiUrl}/classes/igxiconcomponent.html) @@ -353,7 +353,7 @@ The result is as follows: * [IgxOverlayService]({environment:angularApiUrl}/classes/igxoverlayservice.html) * [IgxOverlay Styles]({environment:sassApiUrl}/themes#function-overlay-theme) -### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. diff --git a/kr/components/toast.md b/kr/components/toast.md index e1c206e295..6fb4fd3d79 100644 --- a/kr/components/toast.md +++ b/kr/components/toast.md @@ -124,7 +124,7 @@ public open(toast) {
-### API References +## API References In this article we learned how to use and configure the [`IgxToastComponent`]({environment:angularApiUrl}/classes/igxtoastcomponent.html). For more details in regards its API, take a look at the links below: * [`IgxToastComponent`]({environment:angularApiUrl}/classes/igxtoastcomponent.html) diff --git a/kr/components/toggle.md b/kr/components/toggle.md index 21858dc2b6..030874e3b1 100644 --- a/kr/components/toggle.md +++ b/kr/components/toggle.md @@ -237,7 +237,7 @@ This allows to provide the `outlet` templates variable as a setting to the toggl ``` -## API Summary +## API References In this article we covered the details of how to use Toggle directive. We created a content which would possible to be hidden or shown by invoking programmatically methods which determine this behaviour. Furthermore we added another helping directive which controls automatically this same behaviour by giving it the appropriate toggle reference. In the end we have registered our [**igxToggle**]({environment:angularApiUrl}/classes/igxtoggledirective.html) directive in the **igxNavigationService** provider by giving it an ID, which we then provided to our helping **igxToggleAction** directive. diff --git a/kr/components/tooltip.md b/kr/components/tooltip.md index 9914ebe501..075e7961dd 100644 --- a/kr/components/tooltip.md +++ b/kr/components/tooltip.md @@ -333,7 +333,7 @@ Extra care should be taken in the following scenarios: - The tooltip is used with a manually implemented behavior (e.g. manually show/hide) instead of the built-in one. - The target element is unfocusable. -### API References +## API References In this article we learned how to create, configure and style awesome tooltips for the elements on our page! We also used some additional Ignite UI for Angular components like icons, avatars and cards to improve on the design of our application! The respective APIs are listed below: @@ -363,7 +363,7 @@ Styles:
-### Additional Resources +## Additional Resources
Our community is active and always welcoming to new ideas. From ffe3f127cd3baac166c59e44fa4c9be10a611b0b Mon Sep 17 00:00:00 2001 From: Rumyana Andriova <54146583+randriova@users.noreply.github.com> Date: Thu, 5 Feb 2026 13:03:38 +0200 Subject: [PATCH 10/39] Update JA topics for #6361 and #6357, other small fixes (#6365) --- jp/components/combo-features.md | 2 +- jp/components/combo-remote.md | 2 +- jp/components/combo-templates.md | 2 +- jp/components/combo.md | 14 +++++++++++--- jp/components/dialog.md | 2 +- jp/components/exporter-csv.md | 2 +- jp/components/grids_templates/cascading-combos.md | 2 +- .../grids_templates/remote-data-operations.md | 2 +- jp/components/hierarchicalgrid/load-on-demand.md | 4 ++-- jp/components/inputs/color-editor.md | 2 +- jp/components/navbar.md | 2 +- jp/components/overlay.md | 2 +- jp/components/simple-combo.md | 10 ++++++++-- jp/components/slider/slider-ticks.md | 4 ++-- jp/components/transaction-classes.md | 6 +++--- jp/components/transaction.md | 2 +- jp/components/treegrid/groupby.md | 6 +++--- jp/components/treegrid/load-on-demand.md | 4 ++-- 18 files changed, 42 insertions(+), 28 deletions(-) diff --git a/jp/components/combo-features.md b/jp/components/combo-features.md index 11035e574f..ddc63f98e2 100644 --- a/jp/components/combo-features.md +++ b/jp/components/combo-features.md @@ -216,7 +216,7 @@ export class ComboDemo {
-## API まとめ +## API リファレンス
diff --git a/jp/components/combo-remote.md b/jp/components/combo-remote.md index 76f4773ce3..01aa12a30a 100644 --- a/jp/components/combo-remote.md +++ b/jp/components/combo-remote.md @@ -231,7 +231,7 @@ export class ComboRemoteComponent implements OnInit { コンボボックスがリモートデータにバインドされている場合、APIを介して値/選択項目を設定すると、現在のチャンクにロードされた項目のみが考慮されます。初期値を設定したい場合は、選択する前にそれらの特定の項目がロードされていることを確認してください。 -## API まとめ +## API リファレンス
diff --git a/jp/components/combo-templates.md b/jp/components/combo-templates.md index eba5f79697..aa125968fb 100644 --- a/jp/components/combo-templates.md +++ b/jp/components/combo-templates.md @@ -155,7 +155,7 @@ export class AppModule {} ``` -## API まとめ +## API リファレンス
diff --git a/jp/components/combo.md b/jp/components/combo.md index 3cff7ef4e2..18c791c213 100644 --- a/jp/components/combo.md +++ b/jp/components/combo.md @@ -247,6 +247,16 @@ public singleSelection(event: IComboSelectionChangeEventArgs) { コンボボックスを閉じてフォーカスされている場合: - `下矢印`または `Alt` キー + `下矢印`はコンボボックス ドロップダウンを開き、検索入力にフォーカスを移動します。 +- `Esc` キーは、コンボボックスにフォーカスを保持したまま、選択された値をクリアします。 + +- `Tab` キーは、コンボボックスの外部にある次のフォーカス可能な要素へフォーカスを移動します。 + +コンボボックスが開いている場合: + +- `Esc` キーは、リストを閉じてコンボボックスにフォーカスを保持します。 + +- `Tab` キーは、リストを閉じて次のフォーカス可能な要素にフォーカスを移動します。 + コンボボックスを開いて検索入力にフォーカスがある場合: - `上矢印`または `Alt` キー + `上矢印`はコンボボックス ドロップダウンを閉じ、フォーカスを閉じたコンボボックスに移動します。 @@ -268,8 +278,6 @@ public singleSelection(event: IComboSelectionChangeEventArgs) { - `Enter` キーはすでに選択した項目を確定し、リストを閉じます。 -- `Esc` キーはリストを閉じます。 - コンボボックスを開くと、カスタム値が有効になり、項目の追加ボタンがフォーカスされます。 - `Enter` キーは、検索入力のテキストと等しい `valueKey` と `displayKey` を持つ新しい項目を追加し、その項目を選択します。 @@ -447,7 +455,7 @@ class="!light-combo > [!NOTE] > コンボボックスは内部で `igxForOf` ディレクティブを使用するため、すべての `igxForOf` の制限がコンボボックスで有効です。詳細については、[`igxForOf 既知の制限`](for-of.md#既知の制限)セクションを参照してください。 -## API まとめ +## API リファレンス
diff --git a/jp/components/dialog.md b/jp/components/dialog.md index c6f356c540..61d1e2fd4e 100644 --- a/jp/components/dialog.md +++ b/jp/components/dialog.md @@ -361,7 +361,7 @@ $custom-button: contained-button-theme(
-## API まとめ +## API リファレンス
diff --git a/jp/components/exporter-csv.md b/jp/components/exporter-csv.md index 470439808d..91eea4ff1d 100644 --- a/jp/components/exporter-csv.md +++ b/jp/components/exporter-csv.md @@ -163,7 +163,7 @@ this.csvExportService.export(this.igxGrid1, new IgxCsvExporterOptions('ExportedD [**IgxGrid**](grid/grid.md) からのデータのエクスポートで、エクスポート処理は行フィルタリングおよび列の非表示などの機能に応じてグリッドで表示されるデータのみをエクスポートします。[`IgxCsvExporterOptions`]({environment:angularApiUrl}/classes/igxcsvexporteroptions.html) オブジェクトのプロパティを設定し、エクスポーター サービスを構成してフィルターした行または非表示の列を含むことができます。このプロパティは以下の表で説明します。 -## API まとめ +## API リファレンス 以下は、CSV Exporter サービスのその他の API です。 diff --git a/jp/components/grids_templates/cascading-combos.md b/jp/components/grids_templates/cascading-combos.md index 8564f63021..c83cb8b277 100644 --- a/jp/components/grids_templates/cascading-combos.md +++ b/jp/components/grids_templates/cascading-combos.md @@ -87,7 +87,7 @@ public countryChanging(event: IComboSelectionChangeEventArgs) { ``` -## API まとめ +## API リファレンス
diff --git a/jp/components/grids_templates/remote-data-operations.md b/jp/components/grids_templates/remote-data-operations.md index fa8befce14..7c014f9259 100644 --- a/jp/components/grids_templates/remote-data-operations.md +++ b/jp/components/grids_templates/remote-data-operations.md @@ -898,7 +898,7 @@ public paginate(page: number, recalculate = false) { ### 一括編集のリモート ページング -これまでの例で、リモート データで @@igxName を設定する方法を説明しました。次に、[一括編集のトピック](batch-editing.md)に従ってグリッドのバッチ編集を有効にします。 +これまでの例で、リモート データで @@igxName を設定する方法を説明しました。次に、[一括編集のトピック](batch-editing.md)に従ってグリッドの一括編集を有効にします。 サンプルを続行する前に、現在のユースケースを明確します。ページネーションを実行すると、グリッドには現在のページのデータのみが含まれます。新しい行を追加すると、(一括編集により) 新しく追加された行はグリッドに含まれる現在のデータと連結されます。したがって、サーバーが指定されたページのデータを返さない場合、グリッドのデータソースは新しく追加された行のみで構成され、グリッドは定義されたページ設定 (page、perPage) に基づいてページを作成します。 diff --git a/jp/components/hierarchicalgrid/load-on-demand.md b/jp/components/hierarchicalgrid/load-on-demand.md index 71b56a1feb..a86f14ffe5 100644 --- a/jp/components/hierarchicalgrid/load-on-demand.md +++ b/jp/components/hierarchicalgrid/load-on-demand.md @@ -215,12 +215,12 @@ private buildUrl(event: IGridCreatedEventArgs) { } ```` -### API リファレンス +## API リファレンス - [IgxHierarchicalGridComponent]({environment:angularApiUrl}/classes/igxhierarchicalgridcomponent.html) - [IgxRowIslandComponent]({environment:angularApiUrl}/classes/igxrowislandcomponent.html) -### その他のリソース +## その他のリソース
diff --git a/jp/components/inputs/color-editor.md b/jp/components/inputs/color-editor.md index 35162399ed..582f59863a 100644 --- a/jp/components/inputs/color-editor.md +++ b/jp/components/inputs/color-editor.md @@ -14,7 +14,7 @@ Ignite UI for Angular Color Editor は軽量のカラー ピッカー コンポ ## Angular Color Editor の例 - diff --git a/jp/components/navbar.md b/jp/components/navbar.md index ee2a7a36a1..5f433b6862 100644 --- a/jp/components/navbar.md +++ b/jp/components/navbar.md @@ -399,7 +399,7 @@ $custom-navbar-theme: navbar-theme( - [IgxIconComponent テーマ]({environment:sassApiUrl}/themes#function-icon-theme) - [IgxButtonComponent テーマ]({environment:sassApiUrl}/themes#function-button-theme) -### その他のリソース +## その他のリソース
コミュニティに参加して新しいアイデアをご提案ください。 diff --git a/jp/components/overlay.md b/jp/components/overlay.md index b7c0234f3f..7e862bab3e 100644 --- a/jp/components/overlay.md +++ b/jp/components/overlay.md @@ -358,7 +358,7 @@ export class ExampleComponent { - [IgxOverlayService]({environment:angularApiUrl}/classes/igxoverlayservice.html) - [IgxOverlay スタイル]({environment:sassApiUrl}/themes#function-overlay-theme) -### その他のリソース +## その他のリソース - [配置方法](overlay-position.md) - [スクロール方法](overlay-scroll.md) diff --git a/jp/components/simple-combo.md b/jp/components/simple-combo.md index 58012cf869..e6604943c4 100644 --- a/jp/components/simple-combo.md +++ b/jp/components/simple-combo.md @@ -209,6 +209,10 @@ Simple ComboBox は、選択が変更されるたびに [selectionChanging]({env Simple ComboBox を閉じてフォーカスを合わせると、次のようになります: - `ArrowDown` または `Alt + ArrowDown` は、Simple ComboBox のドロップダウンを開きます。 +- `Esc` キーは、コンボボックスにフォーカスを保持したまま、選択された値をクリアします。 + +- `Tab` キーは、コンボボックスの外部にある次のフォーカス可能な要素へフォーカスを移動します。 + > [!NOTE] > その他のキー ストロークはすべて入力によって処理されます。 @@ -225,7 +229,9 @@ Simple ComboBox が開かれ、リスト項目がフォーカスされている - `Enter` を押すと、アクティブなリスト項目が選択/選択解除され、リストが閉じます。 -- `Esc` はリストを閉じます。 +- `Esc` キーは、リストを閉じてコンボボックスにフォーカスを保持します。 + +- `Tab` キーは、リストを閉じて次のフォーカス可能な要素にフォーカスを移動します。 コンボボックスを開くと、カスタム値が有効になり、項目の追加ボタンがフォーカスされます。 @@ -400,7 +406,7 @@ $custom-drop-down-theme: drop-down-theme( > [!NOTE] > Simple ComboBox は内部で `igxForOf` ディレクティブを使用するため、すべての `igxForOf` 制限は Simple ComboBox に対して有効です。詳細については、[igxForOf 既知の制限](for-of.md#既知の制限) の既知の問題のセクションを参照してください。 -## API まとめ +## API リファレンス
diff --git a/jp/components/slider/slider-ticks.md b/jp/components/slider/slider-ticks.md index cacb762ab9..503d27fbb0 100644 --- a/jp/components/slider/slider-ticks.md +++ b/jp/components/slider/slider-ticks.md @@ -9,7 +9,7 @@ _language: ja ### 使用方法 -### API リファレンス +## API リファレンス
@@ -19,7 +19,7 @@ _language: ja - [SliderType]({environment:angularApiUrl}/enums/slidertype.html) -### その他のリソース +## その他のリソース - [Slider の概要](slider.md) diff --git a/jp/components/transaction-classes.md b/jp/components/transaction-classes.md index ad82b0704a..7c3ec52094 100644 --- a/jp/components/transaction-classes.md +++ b/jp/components/transaction-classes.md @@ -1,6 +1,6 @@ --- title: 一括編集 | トランザクション サービス | Ignite UI for Angular | インフラジスティックス -_description: コンポーネントで Angular CRUD 操作を実行するときにバッチ編集を実装できるトランザクション サービスクラスの階層について学びます。 +_description: コンポーネントで Angular CRUD 操作を実行するときに一括編集を実装できるトランザクション サービスクラスの階層について学びます。 _keywords: batch editing, igniteui for angular, infragistics, 一括編集, _language: ja --- @@ -49,7 +49,7 @@ _language: ja [`igxTransactionService`]({environment:angularApiUrl}/classes/igxtransactionservice.html) には元に戻すスタックが含まれ、元に戻す/やり直し機能を利用できます。Undo スタックは、実際にはトランザクションの配列を含む配列です。[`igxTransactionService`]({environment:angularApiUrl}/classes/igxtransactionservice.html) 使用時に、元に戻すスタックにトランザクションがある場合は、[`canUndo`]({environment:angularApiUrl}/classes/igxtransactionservice.html#canUndo) アクセサーを確認できます。ある場合 [`undo`]({environment:angularApiUrl}/classes/igxtransactionservice.html#undo) メソッドを使用して最後のトランザクションを削除し、[`redo`]({environment:angularApiUrl}/classes/igxtransactionservice.html#redo) で最後に元に戻したトランザクションを適用します。 -以下のトピックで、バッチ編集を使用した igxGrid の実装方法の詳細な例を見つけることができます。 +以下のトピックで、一括編集を使用した igxGrid の実装方法の詳細な例を見つけることができます。 - [Grid 一括編集](grid/batch-editing.md) @@ -69,7 +69,7 @@ _language: ja } ``` -以下は、[`igxTreeGrid`]({environment:angularApiUrl}/classes/igxtreegridcomponent.html) と [`igxHierarchicalGrid`]({environment:angularApiUrl}/classes/igxhierarchicalgridcomponent.html) でバッチ編集を実装する方法の詳細な例を含むトピックです。 +以下は、[`igxTreeGrid`]({environment:angularApiUrl}/classes/igxtreegridcomponent.html) と [`igxHierarchicalGrid`]({environment:angularApiUrl}/classes/igxhierarchicalgridcomponent.html) で一括編集を実装する方法の詳細な例を含むトピックです。 - [Tree Grid 一括編集](treegrid/batch-editing.md) - [Hierarchical Grid 一括編集](hierarchicalgrid/batch-editing.md) diff --git a/jp/components/transaction.md b/jp/components/transaction.md index dbcf6c6e1e..049dd52c53 100644 --- a/jp/components/transaction.md +++ b/jp/components/transaction.md @@ -1,6 +1,6 @@ --- title: 一括編集 | Angular Crud | Ignite UI for Angular | インフラジスティックス -_description: Ignite UI Angular トランザクション サービスを使用して、バッチ編集を簡単に実装し、コンポーネントで Angular CRUD 操作を実行します。 +_description: Ignite UI Angular トランザクション サービスを使用して、一括編集を簡単に実装し、コンポーネントで Angular CRUD 操作を実行します。 _keywords: batch editing, igniteui for angular, infragistics, 一括編集, _language: ja --- diff --git a/jp/components/treegrid/groupby.md b/jp/components/treegrid/groupby.md index fc3652b41d..2c5a22d01c 100644 --- a/jp/components/treegrid/groupby.md +++ b/jp/components/treegrid/groupby.md @@ -170,16 +170,16 @@ private reloadData() { |制限|説明| |--- |--- | -|バッチ編集でグループ化が更新されない | バッチ編集を有効にした (`batchEditing=true`) Tree Grid グループ化を使用する場合、グループ化に使用される列の値を編集してもグループ化は自動的に更新されません。グループ化は、トランザクションをコミットした後にのみ更新されます。| +|一括編集でグループ化が更新されない | 一括編集を有効にした (`batchEditing=true`) Tree Grid グループ化を使用する場合、グループ化に使用される列の値を編集してもグループ化は自動的に更新されません。グループ化は、トランザクションをコミットした後にのみ更新されます。| -### API リファレンス +## API リファレンス
- [IgxTreeGridComponent]({environment:angularApiUrl}/classes/igxtreegridcomponent.html) - [IgxGridComponent スタイル]({environment:sassApiUrl}/themes#function-grid-theme) -### その他のリソース +## その他のリソース
diff --git a/jp/components/treegrid/load-on-demand.md b/jp/components/treegrid/load-on-demand.md index 7cf15241b3..49fb5310b0 100644 --- a/jp/components/treegrid/load-on-demand.md +++ b/jp/components/treegrid/load-on-demand.md @@ -68,14 +68,14 @@ public loadChildren = (parentID: any, done: (children: any[]) => void) => { ``` -### API リファレンス +## API リファレンス
- [IgxTreeGridComponent]({environment:angularApiUrl}/classes/igxtreegridcomponent.html) - [IgxGridComponent スタイル]({environment:sassApiUrl}/themes#function-grid-theme) -### その他のリソース +## その他のリソース
From e51e063ae590fee67af6184e6f3b97a6de3ebbe6 Mon Sep 17 00:00:00 2001 From: Svetoslav Krastev Date: Thu, 5 Feb 2026 17:48:53 +0200 Subject: [PATCH 11/39] docs(localization): Update localiation topic with new functionality and mark old one as legacy. (#6236) --- cspell.json | 3 +- en/components/general/localization.md | 320 +++++++++++++++++- en/components/grids_templates/column-types.md | 4 +- en/components/toc.yml | 2 +- 4 files changed, 321 insertions(+), 8 deletions(-) diff --git a/cspell.json b/cspell.json index b21f8d961b..00413704ce 100644 --- a/cspell.json +++ b/cspell.json @@ -258,6 +258,7 @@ "INPC", "batchediting", "updateparameters", - "alldata" + "alldata", + "subtag" ] } diff --git a/en/components/general/localization.md b/en/components/general/localization.md index 55596bbac8..07de230e69 100644 --- a/en/components/general/localization.md +++ b/en/components/general/localization.md @@ -6,22 +6,332 @@ _keywords: Ignite UI for Angular, UI controls, Angular widgets, web widgets, UI # Localization (i18n) +## Localization (i18n) + +>Note: As of 20.2.0 this is the recommended way of applying localization to the Ignite UI for Angular components. + +With this new localization we provide more features with less requirements for the localization strings and it includes formatting for all available locales, based on `Intl`. + +Currently, Ignite UI for Angular ships with resource strings for the following languages: `Bulgarian`, `Czech`, `Danish`, `Dutch`, `English`, `French`, `German`, `Hungarian`, `Italian`, `Japanese`, `Korean`, `Norwegian`, `Polish`, `Portuguese`, `Romanian`, `Spanish`, `Swedish`, `Turkish`, `Traditional Chinese (zh-Hant)` and `Simplified Chinese (zh-Hans)`. These are available via the `igniteui-angular-i18n` package, except for English which comes as a default localization in `igniteui-angular`. + +### Angular Localization Example + + + + +>Note: Hindi (HI) included in the sample is only for illustrational purposes and to emphasize on the possibility to pass a custom localization object. In this sample, it contains only several localized strings for the summary. More details at [Custom localized resource strings](#custom-localized-resource-strings) section below. + +### Locale + +By locale, we will refer to the general strings defining the different languages and regions on Earth. In our case they are based on the [BCP 47](https://developer.mozilla.org/en-US/docs/Glossary/BCP_47_language_tag) tag definition and most of the basic ones are described in the [IANA Language Subtag Registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) and for a list of languages you can also `refer to [ISO 639 language standard](https://www.loc.gov/standards/iso639-2/). + +It affects both the formatting of the dates and numbers and the localized resource strings that our components use. The default locale for the Ignite UI for Angular components is `en-US`. + +There are several ways that you can set locale. Either globally or per component. + +#### Global API + +You can set the locale that will be used globally using the `setCurrentI18n` method, that comes from the `igniteui-angular` package. It will affect both formatting and resource strings used in all of our components. + +```ts +setCurrentI18n('de'); +``` + +We support the full range of possible locales supported by `Intl`. If you provide a locale that is not valid or supported, it will use the default `en-US` locale for the time being, until you change it to a valid one. + +In general you should register your resources under the languages, regions and scripts for the tags you plan to use, so that your components are localized as well. For more see [Regions and Scripts](#regions-and-scripts) section. + +#### `lang` attribute + +With this approach we have the ability to set localization through the `lang` global attribute of the `HTML` tag. This attribute is being watched and if it is changed, all rendered components will update their resource strings to the currently set language. All rules regarding the tag used apply as described above. + +> Note: This works only on root level and will not work for inner elements on the page. + +```html + + + My app + + + +``` + +#### Angular API + +You can use also Angular's built in [LOCALE_ID](https://angular.dev/api/core/LOCALE_ID) token to set the locale for the whole application. The tag provided will work the same way for our components compared to how our API handles. + +#### Per component + +Each component will also have its own `locale` property, that you can specify and it will then not be affected by the global locale. + +```html + + + + +``` + +### Formatting + +Locale like mentioned affects the formatting in all Ignite UI for Angular components that render dates, numbers and some strings related to them. Previously you had to import [Angular's global variants](https://angular.dev/guide/i18n/import-global-variants) of the locale data they provide in order to be able to use it in your app. This is no longer the case and this comes built in our localization by default and you won't need to import and register anything for it to work. + +Since we are just introducing this feature, the Angular's way is still available and very much working as before and is still the default way, if you are already using it. + +If you are just starting though, you will only need to add the `provideIgniteIntl()` method to your app config, which will make sure that you use the new formatting, even if you have the Angular's locale data imported: + +```ts +export const appConfig: ApplicationConfig = { + providers: [ + //... + provideIgniteIntl() + ] +}; +``` + +#### Date formats + +Components like the IgxGrid or IgxDatePicker allow for specifying date format (for the grid per column). The lists bellow show the available options that you can set or build your own custom format. + +Available predefined format options: + +| Option | Equivalent to | Examples (given in en-US locale) | +| ------ | --------------| --------------------------------| +| 'short' | 'M/d/yy, h:mm a' | 6/15/15, 9:03 AM | +| 'medium' | 'MMM d, y, h:mm:ss a' | Jun 15, 2015, 9:03:01 AM | +| 'long' | 'MMMM d, y, h:mm:ss a z' | June 15, 2015 at 9:03:01 AM GMT+1 | +| 'full' | 'EEEE, MMMM d, y, h:mm:ss a zzzz' | Monday, June 15, 2015 at 9:03:01 AM GMT+01:00 | +| 'shortDate' | 'M/d/yy' | 6/15/15 | +| 'mediumDate' | 'MMM d, y' | Jun 15, 2015 | +| 'longDate' | 'MMMM d, y' | June 15, 2015 | +| 'fullDate' | 'EEEE, MMMM d, y' | Monday, June 15, 2015 | +| 'shortTime' | 'h:mm a' | 9:03 AM | +| 'mediumTime' | 'h:mm:ss a' | 9:03:01 AM | +| 'longTime' | 'h:mm:ss a z' | 9:03:01 AM GMT+1 | +| 'fullTime' | 'h:mm:ss a zzzz' | 9:03:01 AM GMT+01:00 | + +Custom format options: + +| Date field | Value | Description | Example | +|-|-|-|-| +| Weekday | c, cc, ccc, E, EE, EEE | Short version of the weekday | Tue | +| | cccc, EEEE | Long version of the weekday | Tuesday | +| | ccccc, EEEEE | Narrow version of the weekday | T | +| Day| d | Numeric display (single digit when possible) | 1, 10 | +| | dd | 2-digit always (zero padded) | 01, 10 | +| Month | M, L | Numeric display (single digit when possible) | 8, 12 | +| | MM, LL | 2-digit always (zero padded) | 08, 12 | +| | MMM, LLL | Short month name | Oct | +| | MMMM, LLLL | Long month name | October | +| | MMMMM, LLLLL | Narrow month name | O | +| Year | y, yyy, yyyy | Numeric display | 1, 24, 632, 2025 | +| | yy | 2-digit display (zero padded when possible) | 01, 24, 32, 25 | +| ISO 8601 year | Y, YYY, YYYY | Numeric display | 1, 24, 632, 2025 | +| | YY | 2-digit display (zero padded when possible) | 01, 24, 32, 25 | +| Era | G, GG, GGG | Short display | AD, BC | +| | GGGG | Long display | Anno Domini, Before Christ| +| | GGGGG | Narrow display | A, B | +| Minute | m | Numeric (single digit when possible) | 1, 5, 22 | +| | mm | 2-digit display (zero padded)| 01, 05, 22 | +| Hour 1-12 | h | Numeric (single digit when possible) | 8, 12 | +| | hh | 2-digit (zero padded) | 08, 13 | +| Hour 0-23 | H | Numeric (single digit when possible) | 8, 21 | +| | HH | 2-digit (zero padded)| 08, 21 | +| Hour 0-11 | K | Numeric (single digit when possible) | 0, 11 | +| | KK | 2-digit (zero padded) | 00, 11 | +| Second | s | Numeric (single digit when possible) | 0...59 | +| | ss | 2-digit (zero padded) | 00...59 | +| Fractional seconds | S | Numeric for 1 digit | 0...9 | +| | SS | Numeric for 2 digits | 00...99 | +| | SSS | Numeric for 3 digits | 000...999 | +| Period of time - abbreviated | a, t | Lower case always | am, pm | +| | aa, aaa, tt, ttt | Upper case always | AM, PM | +| | aaaa, tttt | Case based on locale | am, pm, AM, PM | +| | aaaaa, ttttt | Narrow lower case always | a, p | +| Period of time - extended | b, bb, bbb, B, BB, BBB | Short display. Based on `Intl` locale | en-GB: at night | +| | bbbb, BBBB | Long display. Based on `Intl` locale| en-GB: at night | +| | bbbbb, BBBBB | Narrow display. Based on `Intl` locale | en-GB: at night | +| Timezone | z, zz, zzz, Z, ZZ, ZZZ, O, OO, OOO | Short display | GMT+4 | +| | zzzz, ZZZZ, OOOO | Long display | GMT+0430 | + +### Localized resource strings + +All components in Ignite UI for Angular render in English by default and they can be rendered in any of the listed languages at the top as well. There are three ways you can achieve that globally and one way per component. For any language that is not currently available, custom translation can be provided for each resource string that is available through our API. + +The translations for the component strings are stored in resource strings and they will need to be registered in our localization system so that the component can use them. + +To achieve that, you first need to install the `igniteui-angular-i18n` package, which contains the localized resource strings for all languages: + +``` +npm install igniteui-angular-i18n --save-dev +``` + +After that you will need to register each language you would like to have available to them. Lets say German and Japanese: + +```ts +import { IgxResourceStringsDE, IgxResourceStringsJA } from 'igniteui-angular-i18n'; + +registerI18n(IgxResourceStringsDE, 'de'); +registerI18n(IgxResourceStringsJA, 'ja'); +``` + +You will also need to provide to which locale they will apply to. If not a valid tag is provided, it will set the resources for the default 'en-US' locale. + +#### Regions and scripts + +We take into account the `language + region` or `language + script` from the locale you used to register your resources, since these are the most commonly used. They are separated by `-` and region/script are usually defined on a second or third position. For example, `en-US` and `en-GB` or `en-Latn`. + +If you do not use region or script, the resources you register will apply to all locales that use the `en` language, for example. That is unless you define resources for the regions and scripts as well. Then only for those you have not defined, will return the resources for `en` in this case. + +The script for us has higher priority than the region when registering resources. We recommend in general to use either region or script, without mixing them and using both at the same time. That way it is easier to manage and know which one you have available and should be used, based on the locale you set. + +Anyway, if you happen to use them both, lets take for example the `en` language with `GB` region and `Latn` script. If you define resources for both region and script like `en-GB` and `en-Latn`, and later on you set your locale, having both region and script to `en-Latn-GB`, we will take the resources from the script one first. If it is not available, then we will return the available region, unless you explicitly set your locale to `en-Latn`, of course. If you have for none of them registered resources, we will take the default for `en` if available. + +### Customize a component + +If you would like to have specific component in your app use either the already registered resources globally but with different localization or completely replace the resource strings for it, you can do that the following way. + +#### Language and formatting + +If you would like to set different from the global localization for a component, you can do that by setting the `locale` property. This will affect the language of the resource strings used as well as the formatting, since they are tied together. + +With this approach you should already have the available resource strings globally registered: + +```ts +import { IgxResourceStringsJA } from 'igniteui-angular-i18n'; + +registerI18n(IgxResourceStringsJA, 'ja'); +``` + +By setting the `locale` property of the component, this will override the global locale currently in use: + +```html + + + + +``` + +##### Language only + +If you would like to change only the language of the component, without changing the locale, you can even set the resource strings of each component using the `resourceStrings` property, which will override the globally used ones: + +```html + + + + +``` + +You will need to make sure you use the correct resource string type for the component you would like to override it with. Each component has its own set of resource strings. In this case for the grid in German: + +```ts +import { GridResourceStringsDE } from 'igniteui-angular-i18n'; + +// Inside App Component: +public resourcesDE = GridResourceStringsDE; +``` + +### Custom localized resource strings + +If you would like to localize your app, but we do not provide resource strings for the language you use and would like to provide your own translation, you can always provide custom resource string. You can do that globally or per component(using the `resourceStrings` property). + +>Note: Feel free to contribute to the [`igniteui-i18n-resources`](https://github.com/IgniteUI/igniteui-i18n/tree/master/projects/igniteui-i18n-resources) package with more languages. The `igniteui-angular-i18n` are based on them. + +You can use the provided `IResourceStrings` type for all components to get typings for the resource stings used: + +```ts +import { IResourceStrings } from 'igniteui-angular'; + +export const customResourcesForAll: IResourceStrings = { + //... +}; +registerI18n(customResourcesForAll, 'custom'); +``` + +Or for a specific component separately, in this case the grids: + +```ts +import { IGridResourceStrings } from 'igniteui-angular'; + +export const customGridResources: IGridResourceStrings = { + grid_summary_count: 'गणना', + grid_summary_min: 'न्यून', + grid_summary_max: 'अधिक', + grid_summary_sum: 'योग', + grid_summary_average: 'औसत' +}; + +``` + +You can even mix however you want the already existing resource strings with the ones you want to customize, even for the default English language: + +```ts +import { IResourceStrings, CalendarResourceStringsEN, DatePickerResourceStringsEN } from 'igniteui-angular'; + +export const customResources: IResourceStrings = Object.assign( + {}, + CalendarResourceStringsEN, + DatePickerResourceStringsEN, + { + grid_summary_count: 'Custom count', + grid_summary_min: 'Minium', + grid_summary_max: 'Maximum', + grid_summary_sum: 'Custom summary' + } +); +registerI18n(customResources, 'en'); + +``` + +>Note: The last examples set only specific resource strings. This means that the rest will default to English, if they are not available for the components in use to get. + +### Available resource strings + +- [IgxResourceStringsBG](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/BG/resources.ts) +- [IgxResourceStringsCS](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/CS/resources.ts) +- [IgxResourceStringsDA](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/DA/resources.ts) +- [IgxResourceStringsDE](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/DE/resources.ts) +- [IgxResourceStringsES](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/ES/resources.ts) +- [IgxResourceStringsFR](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/FR/resources.ts) +- [IgxResourceStringsHU](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/HU/resources.ts) +- [IgxResourceStringsIT](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/IT/resources.ts) +- [IgxResourceStringsJA](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/JA/resources.ts) +- [IgxResourceStringsKO](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/KO/resources.ts) +- [IgxResourceStringsNB](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/NB/resources.ts) +- [IgxResourceStringsNL](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/NL/resources.ts) +- [IgxResourceStringsPL](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/PL/resources.ts) +- [IgxResourceStringsPT](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/PT/resources.ts) +- [IgxResourceStringsRO](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/RO/resources.ts) +- [IgxResourceStringsSV](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/SV/resources.ts) +- [IgxResourceStringsTR](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/TR/resources.ts) +- [IgxResourceStringsZHHANS](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/ZH-HANS/resources.ts) +- [IgxResourceStringsZHHANT](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/ZH-HANT/resources.ts) + + +## Legacy Localization (i18n) + +>Note: This is an old way of handling localization as of 20.2.0. We recommend using the new way above. This will still work until further notice. + Currently, Ignite UI for Angular ships with resource strings for the following languages and scripts: Bulgarian, Czech, Danish, Dutch, English, French, German, Hungarian, Italian, Japanese, Korean, Norwegian, Polish, Portuguese, Romanian, Spanish, Swedish, Turkish, Traditional Chinese (zh-Hant) and Simplified Chinese (zh-Hans). These are available via the `igniteui-angular-i18n` package, except for English which comes as a default localization in `igniteui-angular`. With only a few lines of code, users can easily change the localization strings in Ignite UI for Angular components. -## Angular Localization Example +### Angular Localization Example >Note: Hindi (HI) included in the sample is only for illustrational purposes and to emphasize on the possibility to pass a custom localization object. In this sample, it contains only several localized strings for the summary. More details at [Utilize own localized resources](#utilize-own-localized-resources) section below. -## Usage +### Usage ### Load localized resources from npm package @@ -95,7 +405,7 @@ export class AppComponent implements OnInit { >Note: Feel free to contribute to the [`igniteui-angular-i18n`](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n) package with more languages! -### Utilize own localized resources +#### Utilize own localized resources `changei18n` function expects an `IResourceStrings` object. If the language you want to use is not available in the `igniteui-angular-i18n` package, or simply want to change a particular string, you can pass a custom object containing your string resources for the language and components you need. This will change the global i18n for the igniteui-angular components. @@ -154,7 +464,7 @@ export class AppComponent implements OnInit { } ``` -### Localize specific strings for a specific instance of a component +#### Localize specific strings for a specific instance of a component If only a single `igx-grid` instance should be localized, there is a way. The `resourceStrings` property should be used and it should be set to a new instance of `IGridResourceStrings` type. diff --git a/en/components/grids_templates/column-types.md b/en/components/grids_templates/column-types.md index 1aa5d98462..774f2b5c5c 100644 --- a/en/components/grids_templates/column-types.md +++ b/en/components/grids_templates/column-types.md @@ -77,9 +77,11 @@ public formatOptions = this.options; The appearance of the date portions will be set (e.g. day, month, year) based on [`locale`]({environment:angularApiUrl}/classes/igxgridcomponent.html#locale) format or [`pipeArgs`]({environment:angularApiUrl}/classes/igxcolumncomponent.html#pipeArgs) input. The pipe arguments can be used to specify a custom [date format](https://angular.io/api/common/DatePipe#pre-defined-format-options) or [timezone](https://angular.io/api/common/DatePipe#parameters): -- **format** - The default value for formatting the date is 'mediumDate'. Other available options are 'short', 'long', 'shortDate', 'fullDate', 'longTime', 'fulLTime' and etc. This is a full list of all available [pre-defined format options](https://angular.io/api/common/DatePipe#pre-defined-format-options). +- **format** - The default value for formatting the date is 'mediumDate'. Other available options are 'short', 'long', 'shortDate', 'fullDate', 'longTime', 'fullTime' and etc. This is a full list of all available [pre-defined Angular format options](https://angular.io/api/common/DatePipe#pre-defined-format-options) (legacy). - **timezone** - The user's local system timezone is the default value. The timezone offset or standard GMT/UTC or continental US timezone abbreviation can also be passed. Different timezone examples which will display the corresponding time of the location anywhere in the world: + > Note: Since 20.2.x, if you have the Angular localization disabled, the list of available format options can be found in our new [localization topic](../general/localization.md#formatting). + ```ts public formatDateOptions = { diff --git a/en/components/toc.yml b/en/components/toc.yml index 2248b4bdbc..24a8ca9647 100644 --- a/en/components/toc.yml +++ b/en/components/toc.yml @@ -13,7 +13,7 @@ - name: Localization (i18n) href: general/localization.md new: false - updated: false + updated: true - name: Getting started href: general/getting-started.md new: false From 44fb1a3716639842709ff31f689b43e605d225f0 Mon Sep 17 00:00:00 2001 From: skrustev Date: Fri, 6 Feb 2026 16:02:53 +0200 Subject: [PATCH 12/39] fix(localization): Update Angular version and tweak some descriptions. --- en/components/general/localization.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/en/components/general/localization.md b/en/components/general/localization.md index 07de230e69..358f319d87 100644 --- a/en/components/general/localization.md +++ b/en/components/general/localization.md @@ -8,9 +8,9 @@ _keywords: Ignite UI for Angular, UI controls, Angular widgets, web widgets, UI ## Localization (i18n) ->Note: As of 20.2.0 this is the recommended way of applying localization to the Ignite UI for Angular components. +>Note: As of 21.1.0 this is the recommended way of applying localization to the Ignite UI for Angular components. -With this new localization we provide more features with less requirements for the localization strings and it includes formatting for all available locales, based on `Intl`. +With our new localization we introduce more features with less requirements for both our localization strings and formatting for all available locales. The formatting is now based on the standards introduced by the `Intl` API. Currently, Ignite UI for Angular ships with resource strings for the following languages: `Bulgarian`, `Czech`, `Danish`, `Dutch`, `English`, `French`, `German`, `Hungarian`, `Italian`, `Japanese`, `Korean`, `Norwegian`, `Polish`, `Portuguese`, `Romanian`, `Spanish`, `Swedish`, `Turkish`, `Traditional Chinese (zh-Hant)` and `Simplified Chinese (zh-Hans)`. These are available via the `igniteui-angular-i18n` package, except for English which comes as a default localization in `igniteui-angular`. @@ -35,7 +35,7 @@ There are several ways that you can set locale. Either globally or per component #### Global API -You can set the locale that will be used globally using the `setCurrentI18n` method, that comes from the `igniteui-angular` package. It will affect both formatting and resource strings used in all of our components. +You can set the locale that will be used globally using the `setCurrentI18n` method, that comes from the `igniteui-angular` package. It will affect both formatting and registered resource strings used in all of our components. For more on resource strings see [Localized resource strings](#localized-resource-strings) ```ts setCurrentI18n('de'); From c0a0dd06437057a018eda80bb9d9edb70585925b Mon Sep 17 00:00:00 2001 From: Rumyana Andriova <54146583+randriova@users.noreply.github.com> Date: Mon, 9 Feb 2026 14:42:39 +0200 Subject: [PATCH 13/39] docs(*): update JA topics for #6358, #6363 and #6236 --- jp/components/general/localization.md | 322 +++++++++++++++++++++++++- jp/components/grid-lite/overview.md | 38 ++- 2 files changed, 330 insertions(+), 30 deletions(-) diff --git a/jp/components/general/localization.md b/jp/components/general/localization.md index 73facbcce3..bd61532359 100644 --- a/jp/components/general/localization.md +++ b/jp/components/general/localization.md @@ -7,11 +7,15 @@ _language: ja # ローカライズ (i18n) -現在、Ignite UI for Angular は、次の言語とスクリプトのリソース文字列で出荷されます: ブルガリア語、チェコ語、デンマーク語、オランダ語、英語、フランス語、ドイツ語、ハンガリー語、イタリア語、日本語、韓国語、ノルウェー語、ポーランド語、ポルトガル語、ルーマニア語、スペイン語、スウェーデン語、トルコ語、繁体字中国語、簡体字中国語。これらは、`igniteui-angular` のデフォルトのローカライズとして提供される英語を除き、`igniteui-angular-i18n` パッケージ経由で利用できます。 +## ローカライズ (i18n) -最小限のコードで Ignite UI for Angular コンポーネントの文字列を簡単にローカライズできます。 +>注: 20.2.0 以降、これが Ignite UI for Angular コンポーネントにローカライズを適用する推奨方法です。 + +この新しいローカライズでは、ローカライズ文字列の要件を減らしながらより多くの機能を提供し、`Intl` に基づいた利用可能なすべてのロケールの書式設定が含まれています。 -## Angular ローカライズの例 +現在、Ignite UI for Angular は次の言語のリソース文字列を提供しています: `ブルガリア語`、`チェコ語`、`デンマーク語`、`オランダ語`、`英語`、`フランス語`、`ドイツ語`、`ハンガリー語`、`イタリア語`、`日本語`、`韓国語`、`ノルウェー語`、`ポーランド語`、`ポルトガル語`、`ルーマニア語`、`スペイン語`、`スウェーデン語`、`トルコ語`、`繁体字中国語`、`簡体字中国語`。これらは、`igniteui-angular` のデフォルトのローカライズとして提供される英語を除き、`igniteui-angular-i18n` パッケージ経由で利用できます。 + +### Angular ローカライズの例 +>注: サンプルに含まれているヒンディー語 (HI) は、説明のみを目的としており、カスタム ローカライズ オブジェクトを渡す可能性を強調するためのものです。このサンプルでは、集計用にローカライズされたいくつかの文字列のみが含まれています。詳細については、以下の[カスタム ローカライズ リソース文字列](#カスタム-ローカライズ-リソース文字列)セクションをご覧ください。 + +### ロケール + +ロケールとは、地球上のさまざまな言語と地域を定義する一般的な文字列を指します。この場合、[BCP 47](https://developer.mozilla.org/en-US/docs/Glossary/BCP_47_language_tag) タグ定義に基づいており、基本的なものの多くは [IANA Language Subtag Registry](https://www.iana.org/assignments/language-subtag-registry/language-subtag-registry) で説明されています。言語のリストについては、[ISO 639 言語標準](https://www.loc.gov/standards/iso639-2/)も参照してください。 + +これは、日付と数値の書式設定と、コンポーネントが使用するローカライズされたリソース文字列の両方に影響します。Ignite UI for Angular コンポーネントのデフォルトのロケールは `en-US` です。 + +ロケールを設定する方法はいくつかあります。グローバルに設定するか、コンポーネントごとに設定できます。 + +#### グローバル API + +`igniteui-angular` パッケージから提供される `setCurrentI18n` メソッドを使用して、グローバルに使用されるロケールを設定できます。これは、すべてのコンポーネントで使用される書式設定とリソース文字列の両方に影響します。 + +```ts +setCurrentI18n('de'); +``` + +`Intl` でサポートされている可能なロケールの全範囲をサポートしています。有効またはサポートされていないロケールを指定した場合、有効なロケールに変更するまで、デフォルトの `en-US` ロケールが使用されます。 + +一般的に、コンポーネントもローカライズされるように、使用する予定のタグの言語、地域、およびスクリプトの下にリソースを登録する必要があります。詳細については、[地域と文字](#地域と文字)セクションを参照してください。 + +#### `lang` 属性 + +この方法では、`HTML` タグの `lang` グローバル属性を通じてローカライズを設定できます。この属性は監視されており、変更されると、レンダリングされたすべてのコンポーネントが現在設定されている言語にリソース文字列を更新します。使用されるタグに関するすべてのルールは、上記の説明と同様に適用されます。 + +> 注: これはルート レベルでのみ機能し、ページ上の内部要素では機能しません。 + +```html + + + My app + + + +``` + +#### Angular API + +Angular の組み込み [LOCALE_ID](https://angular.dev/api/core/LOCALE_ID) トークンを使用して、アプリケーション全体のロケールを設定することもできます。提供されたタグは、API の処理方法と比較して、コンポーネントに対して同じように機能します。 + +#### コンポーネントごと + +各コンポーネントには独自の `locale` プロパティもあり、これを指定すると、グローバルロケールの影響を受けなくなります。 + +```html + + + + +``` + +### 書式設定 + +ロケールは、前述のように、日付、数値、およびそれらに関連する一部の文字列をレンダリングするすべての Ignite UI for Angular コンポーネントの書式設定に影響します。以前は、アプリで使用できるようにするために、Angular が提供する[グローバル バリアント](https://angular.dev/guide/i18n/import-global-variants)のロケール データをインポートする必要がありました。これはもう必要なく、デフォルトでローカライズに組み込まれているため、動作させるために何もインポートして登録する必要はありません。 + +この機能を導入したばかりなので、Angular の方法は引き続き利用可能で、以前と同様に非常にうまく機能しており、すでに使用している場合は依然としてデフォルトの方法です。 + +ただし、これから始める場合は、アプリ構成に `provideIgniteIntl()` メソッドを追加するだけで済みます。これにより、Angular のロケール データをインポートしている場合でも、新しい書式設定を使用することが保証されます: + +```ts +export const appConfig: ApplicationConfig = { + providers: [ + //... + provideIgniteIntl() + ] +}; +``` + +#### 日付の書式 + +IgxGrid や IgxDatePicker などのコンポーネントでは、日付書式を指定できます (グリッドの場合は列ごと)。以下のリストは、設定可能な利用可能なオプション、または独自のカスタム書式を構築するために使用できるオプションを示しています。 + +利用可能な事前定義書式オプション: + +| オプション | 相当形式 | 例 (en-US ロケールの場合) | +| ------ | --------------| --------------------------------| +| 'short' | 'M/d/yy, h:mm a' | 6/15/15, 9:03 AM | +| 'medium' | 'MMM d, y, h:mm:ss a' | Jun 15, 2015, 9:03:01 AM | +| 'long' | 'MMMM d, y, h:mm:ss a z' | June 15, 2015 at 9:03:01 AM GMT+1 | +| 'full' | 'EEEE, MMMM d, y, h:mm:ss a zzzz' | Monday, June 15, 2015 at 9:03:01 AM GMT+01:00 | +| 'shortDate' | 'M/d/yy' | 6/15/15 | +| 'mediumDate' | 'MMM d, y' | Jun 15, 2015 | +| 'longDate' | 'MMMM d, y' | June 15, 2015 | +| 'fullDate' | 'EEEE, MMMM d, y' | Monday, June 15, 2015 | +| 'shortTime' | 'h:mm a' | 9:03 AM | +| 'mediumTime' | 'h:mm:ss a' | 9:03:01 AM | +| 'longTime' | 'h:mm:ss a z' | 9:03:01 AM GMT+1 | +| 'fullTime' | 'h:mm:ss a zzzz' | 9:03:01 AM GMT+01:00 | + +カスタム形式オプション: + +| 日付フィールド | 値 | 説明 | 例 | +|-|-|-|-| +| 曜日 | c, cc, ccc, E, EE, EEE | 曜日の短縮表示 | Tue | +| | cccc, EEEE | 曜日の完全表示 | Tuesday | +| | ccccc, EEEEE | 曜日の最小表示 | T | +| 日| d | 数値表示 (可能な場合は 1 桁) | 1, 10 | +| | dd | 常に 2 桁表示 (ゼロ埋め)| 01, 10 | +| 月 | M, L | 数値表示 (可能な場合は 1 桁) | 8, 12 | +| | MM, LL | 常に 2 桁表示 (ゼロ埋め)| 08, 12 | +| | MMM, LLL | 月名の短縮表示 | Oct | +| | MMMM, LLLL | 月名の完全表示 | October | +| | MMMMM, LLLLL | 月名の最小表示 | O | +| 年 | y, yyy, yyyy | 数値表示 | 1, 24, 632, 2025 | +| | yy | 2 桁表示 (可能な場合はゼロ埋め) | 01, 24, 32, 25 | +| ISO 8601 年 | Y, YYY, YYYY | 数値表示 | 1, 24, 632, 2025 | +| | YY | 2 桁表示 (可能な場合はゼロ埋め) | 01, 24, 32, 25 | +| 年代 | G, GG, GGG | 短縮表示 | AD, BC | +| | GGGG | 完全表示 | Anno Domini, Before Christ| +| | GGGGG | 最小表示 | A, B | +| 分 | m | 数値表示 (可能な場合は 1 桁) | 1, 5, 22 | +| | mm | 2 桁表示 (ゼロ埋め)| 01, 05, 22 | +| 時 (0-11) | h | 数値表示 (可能な場合は 1 桁) | 8, 12 | +| | hh | 2 桁表示 (ゼロ埋め) | 08, 13 | +| 時 (0-23) | H | 数値表示 (可能な場合は 1 桁) | 8, 21 | +| | HH | 2 桁表示 (ゼロ埋め)| 08, 21 | +| 時 (0-11) | K | 数値表示 (可能な場合は 1 桁) | 0, 11 | +| | KK | 2 桁表示 (ゼロ埋め) | 00, 11 | +| 秒 | s | 数値表示 (可能な場合は 1 桁) | 0...59 | +| | ss | 2 桁表示 (ゼロ埋め) | 00...59 | +| 小数秒 | S | 1 桁の数値表示 | 0...9 | +| | SS | 2 桁の数値表示 | 00...99 | +| | SSS | 3 桁の数値表示 | 000...999 | +| 時間帯 - 省略形 | a, t | 常に小文字 | am, pm | +| | aa, aaa, tt, ttt | 常に大文字 | AM, PM | +| | aaaa, tttt | ロケールに基づく大文字/小文字 | am, pm, AM, PM | +| | aaaaa, ttttt | 常に小文字の最小表示 | a, p | +| 時間帯 - 拡張 | b, bb, bbb, B, BB, BBB |短縮表示 (Intl ロケールに基づく) | en-GB: at night | +| | bbbb, BBBB | 完全表示 (Intl ロケールに基づく)| en-GB: at night | +| | bbbbb, BBBBB | 最小表示 (Intl ロケールに基づく) | en-GB: at night | +| タイムゾーン | z, zz, zzz, Z, ZZ, ZZZ, O, OO, OOO | 短縮表示 | GMT+4 | +| | zzzz, ZZZZ, OOOO | 完全表示 | GMT+0430 | + +### ローカライズされたリソース文字列 + +Ignite UI for Angular のすべてのコンポーネントは、デフォルトで英語でレンダリングされ、上部にリストされている任意の言語でレンダリングすることもできます。グローバルに実現する方法が 3 つあり、コンポーネントごとに実現する方法が 1 つあります。現在利用できない言語の場合、API を通じて利用可能な各リソース文字列にカスタム翻訳を提供できます。 + +コンポーネント文字列の翻訳はリソース文字列に格納されており、コンポーネントが使用できるように、ローカライズ システムに登録する必要があります。 + +これを実現するには、まず、すべての言語のローカライズされたリソース文字列を含む `igniteui-angular-i18n` パッケージをインストールする必要があります: + +``` +npm install igniteui-angular-i18n --save-dev +``` + +その後、利用可能にしたい各言語を登録する必要があります。ドイツ語と日本語を例にします: + +```ts +import { IgxResourceStringsDE, IgxResourceStringsJA } from 'igniteui-angular-i18n'; + +registerI18n(IgxResourceStringsDE, 'de'); +registerI18n(IgxResourceStringsJA, 'ja'); +``` + +また、それらが適用されるロケールも指定する必要があります。有効なタグが提供されていない場合、デフォルトの 'en-US' ロケールのリソースが設定されます。 + +#### 地域と文字 + +リソースの登録に使用したロケールから `言語 + 地域` または `言語 + 文字` を考慮します。これらが最も一般的に使用されるためです。これらは `-` で区切られ、地域/文字は通常 2 番目または 3 番目の位置に定義されます。たとえば、`en-US` と `en-GB`、または `en-Latn` です。 + +地域または文字を使用しない場合、登録したリソースは、たとえば `en` 言語を使用するすべてのロケールに適用されます。ただし、地域と文字のリソースも定義している場合を除きます。その場合、定義していないもののみが、この場合は `en` のリソースを返します。 + +文字は、リソースを登録する際に地域よりも優先度が高くなります。一般的には、両方を同時に混在させて使用せず、地域または文字のいずれかを使用することをお勧めします。そうすることで、設定したロケールに基づいて、どれが利用可能で使用すべきかを管理し、把握しやすくなります。 + +両方を使用する場合、たとえば `GB` 地域と `Latn` 文字を持つ `en` 言語を例にします。`en-GB` と `en-Latn` のように地域と文字の両方のリソースを定義し、後で地域と文字の両方を `en-Latn-GB` に設定してロケールを設定すると、最初に文字のリソースを取得します。それが利用できない場合は、利用可能な地域を返します。もちろん、明示的にロケールを `en-Latn` に設定した場合を除きます。どちらにもリソースが登録されていない場合は、利用可能であれば `en` のデフォルトを取得します。 + +### コンポーネントのカスタマイズ + +アプリ内の特定のコンポーネントで、グローバルに登録されたリソースを使用しながら異なるローカライズを使用したい場合、またはそのリソース文字列を完全に置き換えたい場合は、次の方法で実行できます。 + +#### 言語と書式設定 + +コンポーネントにグローバル ローカライズとは異なるものを設定したい場合は、`locale` プロパティを設定することで実行できます。これらは結びついているため、使用されるリソース文字列の言語と書式設定の両方に影響します。 + +この方法では、利用可能なリソース文字列をグローバルに既に登録しておく必要があります: + +```ts +import { IgxResourceStringsJA } from 'igniteui-angular-i18n'; + +registerI18n(IgxResourceStringsJA, 'ja'); +``` + +コンポーネントの `locale` プロパティを設定することで、現在使用中のグローバル ロケールをオーバーライドします: + +```html + + + + +``` + +##### 言語のみ + +ロケールを変更せずにコンポーネントの言語のみを変更したい場合は、`resourceStrings` プロパティを使用して各コンポーネントのリソース文字列を設定することもできます。これにより、グローバルに使用されているものをオーバーライドします: + +```html + + + + +``` + +オーバーライドしたいコンポーネントに正しいリソース文字列タイプを使用していることを確認する必要があります。各コンポーネントには独自のリソース文字列セットがあります。この場合、グリッドのドイツ語: + +```ts +import { GridResourceStringsDE } from 'igniteui-angular-i18n'; + +// Inside App Component: +public resourcesDE = GridResourceStringsDE; +``` + +### カスタム ローカライズされたリソース文字列 + +アプリをローカライズしたいが、使用している言語のリソース文字列が提供されておらず、独自の翻訳を提供したい場合は、いつでもカスタム リソース文字列を提供できます。これはグローバルに、またはコンポーネントごとに (`resourceStrings` プロパティを使用して) 実行できます。 + +>注: より多くの言語を含む [`igniteui-i18n-resources`](https://github.com/IgniteUI/igniteui-i18n/tree/master/projects/igniteui-i18n-resources) パッケージに自由にコントリビュートしてください。`igniteui-angular-i18n` はこれらに基づいています。 + +すべてのコンポーネントに提供されている `IResourceStrings` タイプを使用して、使用されるリソース文字列の型指定を取得できます: + +```ts +import { IResourceStrings } from 'igniteui-angular'; + +export const customResourcesForAll: IResourceStrings = { + //... +}; +registerI18n(customResourcesForAll, 'custom'); +``` + +または、特定のコンポーネントを個別に、この場合はグリッド: + +```ts +import { IGridResourceStrings } from 'igniteui-angular'; + +export const customGridResources: IGridResourceStrings = { + grid_summary_count: 'गणना', + grid_summary_min: 'न्यून', + grid_summary_max: 'अधिक', + grid_summary_sum: 'योग', + grid_summary_average: 'औसत' +}; + +``` + +デフォルトのリソース文字列と、デフォルトの英語でもカスタマイズしたいものを、好きなように混在させることもできます: + +```ts +import { IResourceStrings, CalendarResourceStringsEN, DatePickerResourceStringsEN } from 'igniteui-angular'; + +export const customResources: IResourceStrings = Object.assign( + {}, + CalendarResourceStringsEN, + DatePickerResourceStringsEN, + { + grid_summary_count: 'Custom count', + grid_summary_min: 'Minium', + grid_summary_max: 'Maximum', + grid_summary_sum: 'Custom summary' + } +); +registerI18n(customResources, 'en'); + +``` + +>注: 最後の例では、特定のリソース文字列のみを設定しています。つまり、残りは、使用中のコンポーネントで取得できない場合、デフォルトで英語になります。 + +### 利用可能なリソース文字列 + +- [IgxResourceStringsBG](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/BG/resources.ts) +- [IgxResourceStringsCS](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/CS/resources.ts) +- [IgxResourceStringsDA](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/DA/resources.ts) +- [IgxResourceStringsDE](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/DE/resources.ts) +- [IgxResourceStringsES](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/ES/resources.ts) +- [IgxResourceStringsFR](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/FR/resources.ts) +- [IgxResourceStringsHU](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/HU/resources.ts) +- [IgxResourceStringsIT](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/IT/resources.ts) +- [IgxResourceStringsJA](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/JA/resources.ts) +- [IgxResourceStringsKO](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/KO/resources.ts) +- [IgxResourceStringsNB](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/NB/resources.ts) +- [IgxResourceStringsNL](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/NL/resources.ts) +- [IgxResourceStringsPL](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/PL/resources.ts) +- [IgxResourceStringsPT](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/PT/resources.ts) +- [IgxResourceStringsRO](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/RO/resources.ts) +- [IgxResourceStringsSV](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/SV/resources.ts) +- [IgxResourceStringsTR](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/TR/resources.ts) +- [IgxResourceStringsZHHANS](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/ZH-HANS/resources.ts) +- [IgxResourceStringsZHHANT](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n/src/i18n/ZH-HANT/resources.ts) + + +## レガシー ローカライズ (i18n) + +>注: これは 20.2.0 以降の古いローカライズ処理方法です。上記の新しい方法を使用することをお勧めします。これは、今後の通知があるまで引き続き機能します。 + +現在、Ignite UI for Angular は、次の言語と文字のリソース文字列を提供しています: ブルガリア語、チェコ語、デンマーク語、オランダ語、英語、フランス語、ドイツ語、ハンガリー語、イタリア語、日本語、韓国語、ノルウェー語、ポーランド語、ポルトガル語、ルーマニア語、スペイン語、スウェーデン語、トルコ語、繁体字中国語、簡体字中国語。これらは、`igniteui-angular` のデフォルトのローカライズとして提供される英語を除き、`igniteui-angular-i18n` パッケージ経由で利用できます。 + +最小限のコードで Ignite UI for Angular コンポーネントの文字列を簡単にローカライズできます。 + +### Angular ローカライズの例 + + + + >注: サンプルに含まれているヒンディー語 (HI) は、説明のみを目的としており、カスタム ローカライズ オブジェクトを渡す可能性を強調するためのものです。このサンプルでは、集計用にローカライズされたいくつかの文字列のみが含まれています。詳細については、以下の[独自のローカライズされたリソースを使用する](#独自のローカライズされたリソースを活用する)セクションを参照してください。 ## 使用方法 @@ -94,9 +404,9 @@ export class AppComponent implements OnInit { } ``` ->注: より多くの言語を含む [`igniteui-angular-i18n`](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n) パッケージに自由にコントリビュート してください。 +>注: より多くの言語を含む [`igniteui-angular-i18n`](https://github.com/IgniteUI/igniteui-angular/tree/master/projects/igniteui-angular-i18n) パッケージに自由にコントリビュートしてください。 -### 独自のローカライズされたリソースを活用する +#### 独自のローカライズされたリソースを活用する `changei18n` 関数は `IResourceStrings` オブジェクトを必要とします。使用したい言語が `igniteui-angular-i18n` パッケージで利用できない場合、または単に特定の文字列を変更したい場合は、必要な言語とコンポーネントの文字列リソースを含むカスタム オブジェクトを渡すことができます。これにより、igniteui-angular コンポーネントのグローバル i18n が変更されます。 @@ -155,7 +465,7 @@ export class AppComponent implements OnInit { } ``` -### コンポーネントの特定のインスタンスの文字列をローカライズ +#### コンポーネントの特定のインスタンスの文字列をローカライズ 単一の `igx-grid` インスタンスのみをローカライズする方法があります。`resourceStrings` プロパティを使用し `IGridResourceStrings` の新しいインスタンスを設定します。 diff --git a/jp/components/grid-lite/overview.md b/jp/components/grid-lite/overview.md index 4bbb375fc5..9a11b98387 100644 --- a/jp/components/grid-lite/overview.md +++ b/jp/components/grid-lite/overview.md @@ -12,29 +12,20 @@ _language: ja Ignite UI for Angular Grid Lite コンポーネントは、インフラジスティックスの新しいオープン ソース UI コンポーネント セットの一部であり、今後も継続的にサポートおよびメンテナンスされます。これはオープン ソースの JavaScript データ グリッドで、Web コンポーネントとして構築されているため、Web フレームワークの有無に関係なく依存関係なしで使用できます。現在、Angular、React、Blazor、Web Components 向けに 50 以上の OSS コントロールが MIT ライセンスのもとで利用可能です。 -Angular Grid Lite は、必要最小限のオーバーヘッドで本質的なデータ表示機能を提供し、ユーザーが期待するパフォーマンスを実現します。これは、エンタープライズ グリッドの複雑さを避けつつ、高速で軽量なデータ表示を必要とする開発者向けに設計されています。 +Angular Grid Lite は、必要最小限のオーバーヘッドで本質的なデータ表示機能を提供し、ユーザーが期待するパフォーマンスを実現します。これは、エンタープライズ グリッドの複雑さを避けつつ、高速で軽量なデータ表示を必要とする開発者向けに設計されています。この目的のために、次の列ベースの機能が提供されています: ソート、フィルタリング、非表示、サイズ変更、およびさまざまな事前定義されたデータ タイプ。行仮想化を使用することで、非常に高速なパフォーマンスが実現されます。さらに、コンポーネントはキーボード ナビゲーションと [Ignite UI のテーマ フレームワーク](../themes.md)を通じたテーマ化をサポートしています。 -Angular Grid Lite の機能: +Grid Lite コントロールは完全に無料で、MIT ライセンスの下で提供されており、Ignite UI をよりオープンで透明性が高く、アクセスしやすいものにするための取り組みの一環です。しかし、プロジェクトが拡大し、複雑さや機能が増し、エンタープライズ グレードのアプリケーションが必要になった場合には、Grid Lite からフル機能で高度な Data Grid へ移行するためのアップグレード戦略をご用意しています。 -- 列フィルタリング -- 非表示 -- サイズ変更 -- ソート -- 行仮想化 -- ユーザー補助 -- テーマとスタイル設定 -- 列のデータ タイプ +Angular はカスタム要素をサポートしているため、Grid Lite を容易に利用できます。 + +## Grid Lite の動作 -Grid Lite コントロールは完全に無料で、MIT ライセンスの下で提供されており、Ignite UI をよりオープンで透明性が高く、アクセスしやすいものにするための取り組みの一環です。しかし、プロジェクトが拡大し、複雑さや機能が増し、エンタープライズ グレードのアプリケーションが必要になった場合には、Grid Lite からフル機能で高度な Data Grid へ移行するためのアップグレード戦略をご用意しています。 - -Angular はカスタム要素をサポートしているため、Grid Lite を容易に利用できます。 - -## インストール +## インストールとセットアップ Grid Lite を Angular アプリケーションに追加するには、npm からパッケージをインストールします。 @@ -42,8 +33,6 @@ Grid Lite を Angular アプリケーションに追加するには、npm から npm install igniteui-grid-lite ``` -## 構成 - アプリケーションを開始する前に、以下のようにカスタム要素スキーマをインポートして渡すことを確認してください。 ```typescript @@ -68,29 +57,30 @@ export class AppComponent { columns: ColumnConfiguration = [...]; products: Products[] = [...]; } - ``` -## パフォーマンス内蔵 +## 機能 + +### パフォーマンス内蔵 行レベルの仮想化により、無制限のデータをスムーズなスクロールでレンダリングできます。 -## 自動列タイプ +### 自動列タイプ 列タイプはデータ ソースに基づいて自動生成され、列タイプに応じたフィルタリング機能が組み込まれています。 -## カスタム列テンプレート +### カスタム列テンプレート 列テンプレートを使用して、あらゆるタイプの UX を提供できます。想像したものはすべて、グリッドの列内にレンダリング可能です! -## インタラクティブ機能 +### インタラクティブ機能 ユーザーが期待するすべてのコアなインタラクティブ機能を提供します。列のフィルタリング、列の非表示、列のリサイズ、列のソートなどが含まれます。 -## 美しい UX とブランディング +### 美しい UX とブランディング Bootstrap、Material、Fluent 向けの組み込みテーマ ポートに加え、カラー パレット、フォント、エレベーション、表示密度など無限のブランディング オプションがあります。 -## 高度なキーボード ナビゲーション +### 高度なキーボード ナビゲーション Excel スタイルのフル キーボード ナビゲーションにより、ユーザーは期待通りの操作体験を得られます。高パフォーマンスなキーボード操作が可能です。 From dc4156a8223757bec025e36f4e687b280857868c Mon Sep 17 00:00:00 2001 From: skrustev Date: Fri, 13 Feb 2026 16:24:13 +0200 Subject: [PATCH 14/39] fix(localization): Update version for legacy localization. --- en/components/general/localization.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/en/components/general/localization.md b/en/components/general/localization.md index 358f319d87..92edcdc9fb 100644 --- a/en/components/general/localization.md +++ b/en/components/general/localization.md @@ -314,7 +314,7 @@ registerI18n(customResources, 'en'); ## Legacy Localization (i18n) ->Note: This is an old way of handling localization as of 20.2.0. We recommend using the new way above. This will still work until further notice. +>Note: This is an old way of handling localization that was recommended until 21.0.x. We suggest using the new available way above if you are using newer versions. This will still work until further notice. Currently, Ignite UI for Angular ships with resource strings for the following languages and scripts: Bulgarian, Czech, Danish, Dutch, English, French, German, Hungarian, Italian, Japanese, Korean, Norwegian, Polish, Portuguese, Romanian, Spanish, Swedish, Turkish, Traditional Chinese (zh-Hant) and Simplified Chinese (zh-Hans). These are available via the `igniteui-angular-i18n` package, except for English which comes as a default localization in `igniteui-angular`. From 66c7ccdd68ca33500052f6b4999fcfd7930286a6 Mon Sep 17 00:00:00 2001 From: Radoslav Mirchev <52001020+radomirchev@users.noreply.github.com> Date: Fri, 13 Feb 2026 17:20:11 +0200 Subject: [PATCH 15/39] Merge pull request #6369 from IgniteUI/rmirchev/update-grid-lite-marketing-talk (docs): update-docs-marketing --- en/components/grid-lite/overview.md | 34 ++++++++++++++++++++++------- 1 file changed, 26 insertions(+), 8 deletions(-) diff --git a/en/components/grid-lite/overview.md b/en/components/grid-lite/overview.md index 8add1da4e4..0005b46b5c 100644 --- a/en/components/grid-lite/overview.md +++ b/en/components/grid-lite/overview.md @@ -1,5 +1,5 @@ --- -title: Angular Grid Lite Overview | Ignite UI for Angular | MIT license +title: Free Angular Data Grid (Open Source) - Ignite UI Grid Lite | MIT license _description: Create apps with our open-source Angular Grid Lite. It’s lightweight and packed with essential features - filtering, hiding, sorting, and more. Try now. _keywords: overview, {Platform}, {ComponentKeywords}, {ProductName}, Infragistics _license: MIT @@ -7,13 +7,15 @@ mentionedTypes: [{ComponentApiMembers}] namespace: Infragistics.Controls --- -# Open Source JavaScript Grid for Any Project +# Free & Open-Source Angular Data Grid (Grid Lite) -The Ignite UI for Angular Grid Lite component is part of Infragistics’ new open-source UI component set that will be actively supported and maintained. It is open-source JavaScript data grid built as a Web Component, which means you can use it dependency-free with or without a web framework. There are 50+ OSS controls now available under the MIT license across Angular, React, Blazor, and Web Components. +The Ignite UI for Angular Grid Lite is a lightweight, high-performance Angular data grid that’s free to use, open-source, and built for modern Angular applications. -The Angular Grid Lite delivers essential data-display functionality with minimal overhead and the performance users expect. It is designed for developers who need fast, lightweight data presentation without the complexity of an enterprise grid. To serve this purpose it it comes with the following column-based features: sorting, filtering, hiding, resizing and a variety of pre-defined data types. Blazing-fast performance is delivered with the use of row virtualization. In addition, the component supports keyboard navigation and theming through the [Ignite UI Theming Framework](../themes.md). +This free Angular data grid is open-source JavaScript data grid built as a Web Component, which means you can use it dependency-free with or without a web framework. It delivers essential data-display functionality with minimal overhead and the performance users expect. The Angular Grid Lite is designed for developers who need fast and lightweight data presentation. -Grid Lite controls are completely free, MIT licensed, as a part of our initiative to make Ignite UI more open, transparent, and accessible. However, if your project scales and grows in complexity and functionality, and you require an enterprise-grade application, we have an upgrade strategy for transitioning from the Grid Lite to the full-featured and advanced Data Grid. +## What You Get with our Free Angular Data Grid + +Our free, open-source Angular Grid Lite comes with the following column-based features: sorting, filtering, hiding, resizing and a variety of pre-defined data types. Blazing-fast performance is delivered with the use of row virtualization. In addition, the component supports keyboard navigation and theming through the [Ignite UI Theming Framework](../themes.md). Angular supports custom elements, so you can use Grid Lite with ease. @@ -62,7 +64,7 @@ export class AppComponent { ### Performance Built In -Row-level virtualization allows you to render unlimited amounts of data with smooth scrolling. +When you use our Angular data grid for free, you are enabled to implement row-level virtualization. This allows you to render unlimited amounts of data with smooth scrolling. ### Automatic Column Types @@ -70,7 +72,7 @@ Column types are automatically generated base on your data source with built-in ### Custom Column Templates -Deliver any type of UX with column templates. Anything you imagine can render in a grid column! +With our Angular data grid open-source control you can also deliver any type of UX with column templates. Anything you imagine can render in a grid column! ### Interactive Features @@ -78,8 +80,24 @@ All the core interactive features your users expect, like column filtering, colu ### Beautiful UX & Branding -Built-in theme support for Bootstrap, Material & Fluent, plus endless branding options in color palettes, fonts, elevation, display density & more. +This free Angular data grid (Grid Lite) comes with built-in theme support for Bootstrap, Material & Fluent, plus endless branding options in color palettes, fonts, elevation, display density & more. ### Rich Keyboard Navigation Full Excel-style keyboard navigation gives user the experience they expect with high-performance keyboard navigation. + +## Is Grid Lite a Free & Open-Source Angular Data Grid? + +Yes. Ignite UI Grid Lite is a free, open-source Angular data grid released under the MIT license. You can use it in commercial or personal projects with no licensing fees. It is part of our initiative to make Ignite UI more open, transparent, and accessible. + +- MIT-licensed + +- Free for commercial use + +- Community-driven development + +- No feature gating + +However, if your project scales and grows in complexity and functionality, and you require an enterprise-grade application, we have a seamless upgrade strategy. It will make the transitioning from the free Angular data grid (Grid Lite) to the full-featured and advanced Data Grid simpler and faster. + +Angular supports custom elements, so you can use Grid Lite with ease. From 751689fe2f6df292f7e05a4b99e751057cf0a5a7 Mon Sep 17 00:00:00 2001 From: Rumyana Andriova <54146583+randriova@users.noreply.github.com> Date: Tue, 17 Feb 2026 13:33:32 +0200 Subject: [PATCH 16/39] docs(*): Update JA Grid Lite Getting started #6369 --- jp/components/grid-lite/overview.md | 34 ++++++++++++++----- jp/components/grids_templates/column-types.md | 4 ++- jp/components/toc.yml | 2 +- 3 files changed, 30 insertions(+), 10 deletions(-) diff --git a/jp/components/grid-lite/overview.md b/jp/components/grid-lite/overview.md index 9a11b98387..fc9a157311 100644 --- a/jp/components/grid-lite/overview.md +++ b/jp/components/grid-lite/overview.md @@ -1,5 +1,5 @@ --- -title: Angular Grid Lite の概要 | Ignite UI for Angular | MIT ライセンス +title: 無料の Angular Data Grid (オープン ソース) - Ignite UI Grid Lite | MIT ライセンス _description: オープン ソースの Grid Lite を使用してアプリを作成できます。軽量でありながら、フィルタリング、非表示、ソート など、必要な機能がすべて搭載されています。今すぐお試しください。 _keywords: 概要, {Platform}, {ComponentKeywords}, {ProductName}, インフラジスティックス _license: MIT @@ -8,13 +8,15 @@ namespace: Infragistics.Controls _language: ja --- -# あらゆるプロジェクトに対応するオープン ソース JavaScript Grid +# 無料のオープン ソース Angular データ グリッド (Grid Lite) -Ignite UI for Angular Grid Lite コンポーネントは、インフラジスティックスの新しいオープン ソース UI コンポーネント セットの一部であり、今後も継続的にサポートおよびメンテナンスされます。これはオープン ソースの JavaScript データ グリッドで、Web コンポーネントとして構築されているため、Web フレームワークの有無に関係なく依存関係なしで使用できます。現在、Angular、React、Blazor、Web Components 向けに 50 以上の OSS コントロールが MIT ライセンスのもとで利用可能です。 +Ignite UI for Angular Grid Lite は、軽量で高パフォーマンスな Angular データ グリッドであり、無料で使用でき、オープン ソースで、最新の {Platform} アプリケーション向けに構築されています。 -Angular Grid Lite は、必要最小限のオーバーヘッドで本質的なデータ表示機能を提供し、ユーザーが期待するパフォーマンスを実現します。これは、エンタープライズ グリッドの複雑さを避けつつ、高速で軽量なデータ表示を必要とする開発者向けに設計されています。この目的のために、次の列ベースの機能が提供されています: ソート、フィルタリング、非表示、サイズ変更、およびさまざまな事前定義されたデータ タイプ。行仮想化を使用することで、非常に高速なパフォーマンスが実現されます。さらに、コンポーネントはキーボード ナビゲーションと [Ignite UI のテーマ フレームワーク](../themes.md)を通じたテーマ化をサポートしています。 +この無料の Angular データ グリッドはオープン ソースの JavaScript データ グリッドで、Web コンポーネントとして構築されているため、Web フレームワークの有無に関係なく依存関係なしで使用できます。必要最小限のオーバーヘッドで本質的なデータ表示機能を提供し、ユーザーが期待するパフォーマンスを実現します。Angular Grid Lite は、高速で軽量なデータ表示を必要とする開発者向けに設計されています。 -Grid Lite コントロールは完全に無料で、MIT ライセンスの下で提供されており、Ignite UI をよりオープンで透明性が高く、アクセスしやすいものにするための取り組みの一環です。しかし、プロジェクトが拡大し、複雑さや機能が増し、エンタープライズ グレードのアプリケーションが必要になった場合には、Grid Lite からフル機能で高度な Data Grid へ移行するためのアップグレード戦略をご用意しています。 +## 無料 Angular データ グリッドで利用可能な機能 + +無料のオープン ソース Angular Grid Lite には、次の列ベースの機能が含まれています: ソート、フィルタリング、非表示、サイズ変更、およびさまざまな事前定義されたデータ タイプ。行仮想化を使用することで、非常に高速なパフォーマンスが実現されます。さらに、コンポーネントはキーボード ナビゲーションと [Ignite UI のテーマ フレームワーク](../themes.md)を通じたテーマ化をサポートしています。 Angular はカスタム要素をサポートしているため、Grid Lite を容易に利用できます。 @@ -63,7 +65,7 @@ export class AppComponent { ### パフォーマンス内蔵 -行レベルの仮想化により、無制限のデータをスムーズなスクロールでレンダリングできます。 +無料で提供される Angular データ グリッドを使用すると、行レベルの仮想化を実装できます。これにより、無制限のデータをスムーズなスクロールでレンダリングできます。 ### 自動列タイプ @@ -71,7 +73,7 @@ export class AppComponent { ### カスタム列テンプレート -列テンプレートを使用して、あらゆるタイプの UX を提供できます。想像したものはすべて、グリッドの列内にレンダリング可能です! +オープン ソースの Angular データ グリッド コントロールでは、列テンプレートを使用してあらゆる種類の UX を提供できます。想像したものはすべて、グリッドの列内にレンダリング可能です! ### インタラクティブ機能 @@ -79,8 +81,24 @@ export class AppComponent { ### 美しい UX とブランディング -Bootstrap、Material、Fluent 向けの組み込みテーマ ポートに加え、カラー パレット、フォント、エレベーション、表示密度など無限のブランディング オプションがあります。 +この無料の Angular データ グリッド (Grid Lite) には、Bootstrap、Material、Fluent 向けの組み込みテーマ サポートが含まれており、カラー パレット、フォント、エレベーション、表示密度など、無限のブランディング オプションがあります。 ### 高度なキーボード ナビゲーション Excel スタイルのフル キーボード ナビゲーションにより、ユーザーは期待通りの操作体験を得られます。高パフォーマンスなキーボード操作が可能です。 + +## Grid Lite は無料のオープン ソース Angular データ グリッドですか? + +はい。Ignite UI Grid Lite は、MIT ライセンスのもとでリリースされた無料のオープン ソース Angular データ グリッドです。ライセンス料なしで、商用またはパーソナル プロジェクトで使用できます。これは、Ignite UI をよりオープンで透明性が高く、アクセスしやすいものにするための取り組みの一環です。 + +- MIT ライセンス + +- 商用利用無料 + +- コミュニティ主導の開発 + +- 機能制限なし + +ただし、プロジェクトの規模が拡大し、複雑さと機能が増大し、エンタープライズ グレードのアプリケーションが必要になった場合、シームレスなアップグレード戦略が用意されています。これにより、無料の Angular データ グリッド (Grid Lite) からフル機能の高度なデータ グリッドへの移行がよりシンプルかつ迅速になります。 + +Angular はカスタム要素をサポートしているため、Grid Lite を容易に利用できます。 diff --git a/jp/components/grids_templates/column-types.md b/jp/components/grids_templates/column-types.md index 500b783271..6c4ac55b84 100644 --- a/jp/components/grids_templates/column-types.md +++ b/jp/components/grids_templates/column-types.md @@ -74,9 +74,11 @@ public formatOptions = this.options; ### DateTime、Date と Time 日付部分の外観は、[`locale`]({environment:angularApiUrl}/classes/igxgridcomponent.html#locale) の形式または [`pipeArgs`]({environment:angularApiUrl}/classes/igxcolumncomponent.html#pipeArgs) 入力に基づいて設定されます (例: 日、月、年)。Pipe 引数はカスタム[日付書式](https://angular.io/api/common/DatePipe#pre-defined-format-options)または[タイムゾーン](https://angular.io/api/common/DatePipe#parameters)を指定するために使用できます。 -- **format** - 日付の書式設定のデフォルト値は 'mediumDate' です。その他の利用可能なオプションは 'short'、'long'、'shortDate'、'fullDate'、'longTime'、'fullTime' などです。以下は利用可能なすべての[定義済みの書式オプション](https://angular.io/api/common/DatePipe#pre-defined-format-options)の完全なリストです。 +- **format** - 日付の書式設定のデフォルト値は 'mediumDate' です。その他の利用可能なオプションは 'short'、'long'、'shortDate'、'fullDate'、'longTime'、'fullTime' などです。以下は利用可能なすべての[定義済みの書式オプション](https://angular.io/api/common/DatePipe#pre-defined-format-options) (レガシー) の完全なリストです。 - **timezone** - ユーザーのローカル システム タイムゾーンがデフォルト値です。タイムゾーン オフセットまたは標準の UTC/GMT または米国本土のタイムゾーンの略語も渡すことができます。世界の任意の場所の対応する時間を表示するさまざまなタイムゾーンの例: +> 注: 20.2.x 以降、Angular のローカリゼーションを無効にしている場合、利用可能な形式オプションの一覧は新しい[ローカライズ トピック](../general/localization.md#書式設定)を参照してください。 + ```ts public formatDateOptions = { diff --git a/jp/components/toc.yml b/jp/components/toc.yml index 59d2c2f6f5..1b54f30e02 100644 --- a/jp/components/toc.yml +++ b/jp/components/toc.yml @@ -14,7 +14,7 @@ - name: ローカライズ href: general/localization.md new: false - updated: false + updated: true - name: 作業の開始 href: general/getting-started.md new: false From 766ac689f5e939ac7405571e6e33af44ace3716d Mon Sep 17 00:00:00 2001 From: Stamen Stoychev Date: Thu, 19 Feb 2026 11:44:12 +0200 Subject: [PATCH 17/39] feat(cd): introducing github actions cd --- .github/workflows/build-en.yml | 103 ++++++++++++++++++++ .github/workflows/build-jp-kr.yml | 113 ++++++++++++++++++++++ azure-pipelines/azure-pipelines-en.yml | 12 +-- azure-pipelines/azure-pipelines-jp-kr.yml | 11 +-- 4 files changed, 218 insertions(+), 21 deletions(-) create mode 100644 .github/workflows/build-en.yml create mode 100644 .github/workflows/build-jp-kr.yml diff --git a/.github/workflows/build-en.yml b/.github/workflows/build-en.yml new file mode 100644 index 0000000000..c9ac1bc2e8 --- /dev/null +++ b/.github/workflows/build-en.yml @@ -0,0 +1,103 @@ +name: Build English Documentation + +permissions: + contents: write + +on: + push: + branches: + - vnext + - master + paths-ignore: + - '**/jp/**' + - '**/kr/**' + workflow_dispatch: + inputs: + branch: + description: 'Branch to checkout' + type: string + default: '' + isVerbose: + description: 'Get verbose output from steps - where configurable' + type: boolean + default: false + shouldCleanPostExecution: + description: 'Clean all pipeline dirs after the pipeline finishes?' + type: boolean + default: true + +env: + BUILD_TYPE: ${{ github.ref_name == 'master' && 'production' || 'staging' }} + TARGET_REF: ${{ github.event.inputs.branch && (startsWith(github.event.inputs.branch, 'refs/') && github.event.inputs.branch || format('refs/heads/{0}', github.event.inputs.branch)) || github.ref }} + +jobs: + build: + name: Build Job + runs-on: ubuntu-latest + + steps: + - name: Checkout repository + uses: actions/checkout@v4 + with: + ref: ${{ env.TARGET_REF }} + clean: true + fetch-tags: true + fetch-depth: 0 + + - name: Setup Node.js 20.x + uses: actions/setup-node@v4 + with: + node-version: '20.x' + + - name: Setup .NET Core SDK 6.x + uses: actions/setup-dotnet@v4 + with: + dotnet-version: '6.x' + + - name: Install dependencies + run: npm ci --production=false ${{ github.event.inputs.isVerbose == 'true' && '--verbose' || '' }} + + - name: Build English documentation + run: npm run build-${{ env.BUILD_TYPE }} -- --lang=en ${{ github.event.inputs.isVerbose == 'true' && '--verbose' || '' }} + + - name: Package English build + run: | + cd en/_site + zip -r ../../${{ env.BUILD_TYPE }}_en.zip . + cd ../.. + + - name: Upload artifact + uses: actions/upload-artifact@v4 + with: + name: IgniteUIDocFX-en + path: ${{ env.BUILD_TYPE }}_en.zip + retention-days: 1 + + - name: Clean workspace + if: ${{ github.event.inputs.shouldCleanPostExecution == 'true' || github.event_name == 'push' }} + run: | + git clean -ffdx + git reset --hard + + - name: Trigger Deploy Workflow in IgniteUI Actions + uses: actions/github-script@v8 + with: + github-token: ${{ secrets.CLASSIC_PAT_GITHUB }} + script: | + await github.rest.repos.createDispatchEvent({ + owner: 'IgniteUI', + repo: 'igniteui-actions', + event_type: 'igniteui-docfx-cd', + client_payload: { + calling_branch: "${{ env.TARGET_REF }}", + repository: "${{ github.repository }}", + run_id: "${{ github.run_id }}", + artifact_name: "IgniteUIDocFX-en", + base_href: "angularsite", + platform: "angular", + locale: "en", + ref: "${{ github.ref }}", + sha: "${{ github.sha }}", + branch: '${{ github.ref_name }}', + } + }); diff --git a/.github/workflows/build-jp-kr.yml b/.github/workflows/build-jp-kr.yml new file mode 100644 index 0000000000..56f28bd024 --- /dev/null +++ b/.github/workflows/build-jp-kr.yml @@ -0,0 +1,113 @@ +name: Build Japanese and Korean Documentation + +permissions: + contents: write + +on: + push: + branches: + - vnext + - master + paths-ignore: + - '**/en/**' + workflow_dispatch: + inputs: + branch: + description: 'Branch to checkout' + type: string + default: '' + isVerbose: + description: 'Get verbose output from steps - where configurable' + type: boolean + default: false + shouldCleanPostExecution: + description: 'Clean all pipeline dirs after the pipeline finishes?' + type: boolean + default: true + +env: + BUILD_TYPE: ${{ github.ref_name == 'master' && 'production' || 'staging' }} + TARGET_REF: ${{ github.event.inputs.branch && (startsWith(github.event.inputs.branch, 'refs/') && github.event.inputs.branch || format('refs/heads/{0}', github.event.inputs.branch)) || github.ref }} + +jobs: + build: + name: Build Job + runs-on: ubuntu-latest + + steps: + - name: Checkout repository + uses: actions/checkout@v4 + with: + ref: ${{ env.TARGET_REF }} + clean: true + fetch-tags: true + fetch-depth: 0 + + - name: Setup Node.js 20.x + uses: actions/setup-node@v4 + with: + node-version: '20.x' + + - name: Setup .NET Core SDK 6.x + uses: actions/setup-dotnet@v4 + with: + dotnet-version: '6.x' + + - name: Install dependencies + run: npm ci --production=false ${{ github.event.inputs.isVerbose == 'true' && '--verbose' || '' }} + + - name: Build Japanese documentation + run: npm run build-${{ env.BUILD_TYPE }} -- --lang=jp ${{ github.event.inputs.isVerbose == 'true' && '--verbose' || '' }} + + - name: Package Japanese build + run: | + cd jp/_site + zip -r ../../${{ env.BUILD_TYPE }}_jp.zip . + cd ../.. + + - name: Build Korean documentation + run: npm run build-${{ env.BUILD_TYPE }} -- --lang=kr ${{ github.event.inputs.isVerbose == 'true' && '--verbose' || '' }} + + - name: Package Korean build + run: | + cd kr/_site + zip -r ../../${{ env.BUILD_TYPE }}_kr.zip . + cd ../.. + + - name: Upload artifacts + uses: actions/upload-artifact@v4 + with: + name: IgniteUIDocFX-jp-kr + path: | + ${{ env.BUILD_TYPE }}_jp.zip + ${{ env.BUILD_TYPE }}_kr.zip + retention-days: 1 + + - name: Clean workspace + if: ${{ github.event.inputs.shouldCleanPostExecution == 'true' || github.event_name == 'push' }} + run: | + git clean -ffdx + git reset --hard + + - name: Trigger Deploy Workflow in IgniteUI Actions + uses: actions/github-script@v8 + with: + github-token: ${{ secrets.CLASSIC_PAT_GITHUB }} + script: | + await github.rest.repos.createDispatchEvent({ + owner: 'IgniteUI', + repo: 'igniteui-actions', + event_type: 'igniteui-docfx-cd', + client_payload: { + calling_branch: "${{ env.TARGET_REF }}", + repository: "${{ github.repository }}", + run_id: "${{ github.run_id }}", + artifact_name: "IgniteUIDocFX-jp", + base_href: "angularsite", + platform: "angular", + locale: "jp", + ref: "${{ github.ref }}", + sha: "${{ github.sha }}", + branch: '${{ github.ref_name }}', + } + }); diff --git a/azure-pipelines/azure-pipelines-en.yml b/azure-pipelines/azure-pipelines-en.yml index 0c238bec8d..529316bfcb 100644 --- a/azure-pipelines/azure-pipelines-en.yml +++ b/azure-pipelines/azure-pipelines-en.yml @@ -1,14 +1,4 @@ -trigger: - branches: - include: - - vnext - - master - paths: - exclude: - - '**/jp/*' - - '**/kr/*' - -# This pipeline is meant to build specific branches for deployment. It's not meant to be a part of PR validation. Ensure that this pipeline is reserved for deployment purposes. +trigger: none pr: none name: $(BuildDefinitionName)_$(Year:yyyy).$(Month).$(DayOfMonth)$(Rev:.r) diff --git a/azure-pipelines/azure-pipelines-jp-kr.yml b/azure-pipelines/azure-pipelines-jp-kr.yml index 4120e29250..f433dc9c82 100644 --- a/azure-pipelines/azure-pipelines-jp-kr.yml +++ b/azure-pipelines/azure-pipelines-jp-kr.yml @@ -1,13 +1,4 @@ -trigger: - branches: - include: - - vnext - - master - paths: - exclude: - - '**/en/*' - -# This pipeline is meant to build specific branches for deployment. It's not meant to be a part of PR validation. Ensure that this pipeline is reserved for deployment purposes. +trigger: none pr: none name: $(BuildDefinitionName)_$(Year:yyyy).$(Month).$(DayOfMonth)$(Rev:.r) From eb539da09692f7bc7c5f795bd74e0c40da778cc8 Mon Sep 17 00:00:00 2001 From: Stamen Stoychev Date: Thu, 19 Feb 2026 13:52:51 +0200 Subject: [PATCH 18/39] fix(cd): changing deploy name to match folder instead of app (#6373) --- .github/workflows/build-en.yml | 2 +- .github/workflows/build-jp-kr.yml | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/.github/workflows/build-en.yml b/.github/workflows/build-en.yml index c9ac1bc2e8..f7eaa33c05 100644 --- a/.github/workflows/build-en.yml +++ b/.github/workflows/build-en.yml @@ -93,7 +93,7 @@ jobs: repository: "${{ github.repository }}", run_id: "${{ github.run_id }}", artifact_name: "IgniteUIDocFX-en", - base_href: "angularsite", + base_href: "angular-samples", platform: "angular", locale: "en", ref: "${{ github.ref }}", diff --git a/.github/workflows/build-jp-kr.yml b/.github/workflows/build-jp-kr.yml index 56f28bd024..d7f155b935 100644 --- a/.github/workflows/build-jp-kr.yml +++ b/.github/workflows/build-jp-kr.yml @@ -80,7 +80,7 @@ jobs: name: IgniteUIDocFX-jp-kr path: | ${{ env.BUILD_TYPE }}_jp.zip - ${{ env.BUILD_TYPE }}_kr.zip +# ${{ env.BUILD_TYPE }}_kr.zip retention-days: 1 - name: Clean workspace @@ -102,8 +102,8 @@ jobs: calling_branch: "${{ env.TARGET_REF }}", repository: "${{ github.repository }}", run_id: "${{ github.run_id }}", - artifact_name: "IgniteUIDocFX-jp", - base_href: "angularsite", + artifact_name: "IgniteUIDocFX-jp-kr", + base_href: "angular-samples", platform: "angular", locale: "jp", ref: "${{ github.ref }}", From 4006536c496dedb16712babf6b8b1da1f088acb8 Mon Sep 17 00:00:00 2001 From: Copilot <198982749+Copilot@users.noreply.github.com> Date: Thu, 19 Feb 2026 16:32:57 +0200 Subject: [PATCH 19/39] Update Angular grid-lite docs for v0.3.x breaking changes (#6354) * docs(grid-lite): update topics for 0.3.1+ package breaking changes Co-authored-by: damyanpetev <3198469+damyanpetev@users.noreply.github.com> * docs(grid-lite): revert excessive changes, fix inaccuracies & adjust content --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: damyanpetev <3198469+damyanpetev@users.noreply.github.com> Co-authored-by: damyanpetev Co-authored-by: Stamen Stoychev --- en/components/grid-lite/binding.md | 13 ++- en/components/grid-lite/cell-template.md | 50 ++++---- .../grid-lite/column-configuration.md | 72 +++++------- en/components/grid-lite/filtering.md | 37 +++--- en/components/grid-lite/header-template.md | 24 ++-- en/components/grid-lite/overview.md | 8 +- en/components/grid-lite/sorting.md | 109 ++++++++---------- 7 files changed, 153 insertions(+), 160 deletions(-) diff --git a/en/components/grid-lite/binding.md b/en/components/grid-lite/binding.md index 8a64aa5088..e832fb17db 100644 --- a/en/components/grid-lite/binding.md +++ b/en/components/grid-lite/binding.md @@ -21,19 +21,20 @@ The component supports changing its data source at runtime. If the new source ha grid.data = [...{ /** records follow */ }]; +``` -// Update the column configuration to represent the new data. -grid.columns = [...]; +```html + + + + ``` -If the grid has **`autoGenerate`** enabled, it will "_infer_" the new column configuration only if the old one is reset. +If the grid has `autoGenerate` enabled, it will "_infer_" the new column configuration automatically when the data changes. ```typescript grid.autoGenerate = true; -/** Reset the previous column collection */ -grid.columns = []; - /** After the new binding the grid will infer the column collection from the bound data. */ grid.data = []; ``` diff --git a/en/components/grid-lite/cell-template.md b/en/components/grid-lite/cell-template.md index 1032a79096..8d9a72ce3f 100644 --- a/en/components/grid-lite/cell-template.md +++ b/en/components/grid-lite/cell-template.md @@ -9,16 +9,22 @@ namespace: Infragistics.Controls # Column Cell Template -By default, the grid uses the key of the column to render the value as a string inside the cell. This is fine for basic scenarios, but if you want to customize the rendered output or the final output is a combination of different data fields, you should use a cell template renderer. +By default, the grid uses the field of the column to render the value as a string inside the cell. This is fine for basic scenarios, but if you want to customize the rendered output or the final output is a combination of different data fields, you can customize the cell template. -To achieve that, set the **`cellTemplate`** property of the column. +To achieve that, set the `cellTemplate` property of the column. ```typescript -{ - cellTemplate?: (params: GridLiteCellContext) => TemplateResult; +protected cellTemplate(params: IgcCellContext) { + // return template result } ``` +```html + + + +``` + ## Use as a Formatter Function For the simple scenario where some formatting is required, one can just return the formatted value. Here is an example for displaying a number value to a locale currency format: @@ -26,12 +32,8 @@ For the simple scenario where some formatting is required, one can just return t ```typescript const { format: asCurrency } = new Intl.NumberFormat('en-EN', { style: 'currency', currency: 'EUR' }); -{ - ... - /** Return the custom currency format for a value `value = 123456.789` */ - cellTemplate: (params) => asCurrency(params.value) // => "€123,456.79" - ... -} +/** Return the custom currency format for a value `value = 123456.789` */ +protected cellTemplate = (params) => asCurrency(params.value); // => "€123,456.79" ``` You can combine values different fields from the data source as well. @@ -41,12 +43,14 @@ Refer to the API documentation for **`GridLiteCellContext`** for more informatio ```typescript const { format: asCurrency } = new Intl.NumberFormat('en-EN', { style: 'currency', currency: 'EUR' }); -{ - ... - /** Return the custom currency format for an order of 10 items where the price is 99.99 */ - cellTemplate: ({value, row}) => asCurrency(value * row.data.count) // => "€999.90" - ... -} +/** Return the custom currency format for an order of 10 items where the price is 99.99 */ +protected cellTemplate = ({value, row}) => asCurrency(value * row.data.count); // => "€999.90" +``` + +```html + + + ``` ## Custom DOM Templates @@ -64,12 +68,14 @@ You can template any standard DOM elements as well as web components from other // Import the `html` tag function from the Lit package. import { html } from "lit"; -{ - key: 'rating', - // Use another web component to represent the `rating` value in the grid - cellTemplate: ({ value }) => html`` - ... -} +// Use another web component to represent the `rating` value in the grid +protected cellTemplate = ({ value }) => html``; +``` + +```html + + + ``` >[!NOTE] diff --git a/en/components/grid-lite/column-configuration.md b/en/components/grid-lite/column-configuration.md index a2f51698ab..74a315570c 100644 --- a/en/components/grid-lite/column-configuration.md +++ b/en/components/grid-lite/column-configuration.md @@ -9,23 +9,22 @@ namespace: Infragistics.Controls # Column Configuration -The columns are defined with the **`columns`** property which has the type **`ColumnConfiguration[]`**. **`key`** is the only required property for the **`ColumnConfiguration`** as the column identifier. It is also the property that is used to map and render the relevant data in the grid rows. - -```typescript -const accountColumn: ColumnConfiguration = { - key: 'account', - - /* Additional configuration follows */ - ... -}; +Columns are defined declaratively using column child components within the grid. The `field` property is the only required for a column, as it serves as the column identifier. It is also the property that is used to map and render the relevant data in the grid rows. + +```html + + + + ``` ->[!NOTE] ->As a rule of thumb, the **column** prop should keep the same reference between renders. The columns are designed to be definitions and to rarely change once the grid is mounted, unless explicitly requested. Otherwise, you take the risk of losing state such as width, renderers, etc. and additional render cycles which may lead to performance degradation. Depending on the technology stack which you use, you can create the array outside the appropriate render function/mechanism or memoize it. - ## Configuration Based on the Data Source -The grid supports inferring the column configuration based on the provided data source. It tries to infer the appropriate **`key`** and **`type`** props based on records in the data. +The grid supports inferring the column configuration based on the provided data source when `autoGenerate` is set to true. It tries to infer the appropriate `field` and `dataType` based on records in the data. ```typescript const data: Record[] = [ @@ -34,18 +33,18 @@ const data: Record[] = [ ]; ``` -```xml - +```html + ``` -The previous snippet will result in the following column configuration for the grid: +The previous snippet will result in the grid automatically creating columns equivalent to: -```typescript -[ - { key: 'entryId', type: 'string' }, - { key: 'source', type: 'string' }, - { key: 'ts', type: 'number' }, -]; +```html + + + + + ``` Useful for a quick render of some data without any additional customizations. @@ -55,7 +54,7 @@ Useful for a quick render of some data without any additional customizations. ## Additional Column Configuration -The column configuration object exposes several more properties: +The column exposes several more properties for customization: ### Column Width @@ -63,37 +62,28 @@ By default, the columns have a width of `minmax(136px, 1fr)` which translates to 1 part of the available space in the Grid Lite. This way the columns are fluid and responsive accommodating for changes in the grid width. -To change the width of column, use the **`width`** property of the **`ColumnConfiguration`** object. +To change the width of column, use the `width` property of the column. -```typescript -{ - ... - width: '250px' -} +```html + ``` The property accepts valid CSS length units. ### Hiding Columns -Columns can be hidden/shown by setting the **hidden** property to of the column configuration object. +Columns can be hidden/shown by setting the `hidden` property of the column. -```typescript -{ - ..., - hidden: true -} +```html + ``` ### Column Resize -Each column of the Grid Lite component can be configured to be resizable by setting the **`resizable`** property in the column definition. +Each column of the Grid Lite component can be configured to be resizable by setting the `resizable` property of the column element. -```typescript -{ - ... - resizable: true -} +```html + ``` If a column is set to be resizable, you can drag the right size of the column header to either increase/decrease the column width. Double-clicking on the resize area will trigger auto-sizing of the column where it will try set its width according to the largest content of its cells/header. diff --git a/en/components/grid-lite/filtering.md b/en/components/grid-lite/filtering.md index 3344ee8537..3a21920b2c 100644 --- a/en/components/grid-lite/filtering.md +++ b/en/components/grid-lite/filtering.md @@ -9,29 +9,30 @@ namespace: Infragistics.Controls # Angular Grid Lite Filter Operations -The Grid Lite supports filtering operations on its data source. Data filtering is controlled on per-column level, allowing you to have filterable and non-filterable columns. By default, filtering on a column is disabled unless explicitly configured with the **`filter`** property of the column configuration object. +The Grid Lite supports filtering operations on its data source. Data filtering is controlled on per-column level, allowing you to have filterable and non-filterable columns. By default, filtering on a column is disabled unless explicitly configured with the `filterable` property of the column configuration object. -```typescript -{ - key: 'price', - filter: true -} +```html + ``` -The **`filter`** property can be either a simple boolean or a -**`ColumnFilterConfiguration`** object which exposes additional configuration options: +You can also control whether the filter operations for string columns should be case sensitive by using the `filteringCaseSensitive` property or `filtering-case-sensitive` attribute: + +```html + +``` + +You can also set these properties programmatically: ```typescript -{ - key: 'price', - filter: { - /** - * For string data types controls whether the filter operations for this column will be case sensitive. - * By default, filter operations for string types are case insensitive. - */ - caseSensitive: true; - } -} +column.filterable = true; +column.filteringCaseSensitive = true; ``` ``` >[!NOTE] ->When **`headerTemplate`** is provided, **`headerText`** is ignored. +>When `headerTemplate` is provided, `header` is ignored. ## Customization via Header Template @@ -32,12 +29,17 @@ Similar to the cell template, you can also pass a custom template renderer and c ```typescript import { html } from 'lit'; -{ - key: 'rating', - headerTemplate: () => html`

⭐ Rating ⭐

`, +protected headerTemplate(_params: IgcHeaderContext) { + return html`

⭐ Rating ⭐

`; } ``` +```html + + + +``` + diff --git a/en/components/grid-lite/overview.md b/en/components/grid-lite/overview.md index 0005b46b5c..045c81b42e 100644 --- a/en/components/grid-lite/overview.md +++ b/en/components/grid-lite/overview.md @@ -40,7 +40,7 @@ Before starting the application, make sure to import and pass the custom element // app.component.ts import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; -import { IgcGridLite, ColumnConfiguration } from 'igniteui-grid-lite'; +import { IgcGridLite } from 'igniteui-grid-lite'; IgcGridLite.register(); @@ -49,13 +49,15 @@ IgcGridLite.register(); schemas: [CUSTOM_ELEMENTS_SCHEMA] template: `
- + + + +
` }) export class AppComponent { - columns: ColumnConfiguration = [...]; products: Products[] = [...]; } ``` diff --git a/en/components/grid-lite/sorting.md b/en/components/grid-lite/sorting.md index 8b5c16ffd5..2606a0d8b8 100644 --- a/en/components/grid-lite/sorting.md +++ b/en/components/grid-lite/sorting.md @@ -9,34 +9,36 @@ namespace: Infragistics.Controls # Sort Operations -The Grid Lite supports sorting operations on its data source. Data sorting is controlled on per-column level, allowing you to have sortable and non-sortable columns, while the grid itself controls certain sort behaviors. By default, sorting on a column is disabled unless explicitly configured with the **`sort`** property of the column configuration object. +The Grid Lite supports sorting operations on its data source. Data sorting is controlled on per-column level, allowing you to have sortable and non-sortable columns, while the grid itself controls certain sort behaviors. By default, sorting on a column is disabled unless explicitly configured with the `sortable` property of the column. -```typescript -{ - key: 'price', - sort: true -} +```html + +``` + +You can also control whether the sort operations for string columns should be case sensitive by using the `sortingCaseSensitive` property or `sorting-case-sensitive` attribute. + +```html + ``` -The **`sort`** property can be either a simple boolean or a **`ColumnSortConfiguration`** object which exposes additional configuration options: +For custom comparison logic, set the `sortConfiguration` property with a `comparer` function: ```typescript -{ - key: 'name', - sort: { - /** - * For string data types controls whether the sort operations for this column will be case sensitive. - * By default, sort operations for string types are case insensitive. - */ - caseSensitive: true, - /** - * Custom comparer function which will be used for sort operations for this column. - * - * In the following sample, we compare the `name` values based on their length. - */ - comparer: (a, b) => a.length - b.length - } -} +column.sortable = true; +column.sortConfiguration = { + /** + * Custom comparer function which will be used for sort operations for this column. + * In the following sample, we compare the `name` values based on their length. + */ + comparer: (a, b) => a.length - b.length +}; ``` [!NOTE] @@ -57,28 +59,19 @@ grid.sortConfiguration = { multiple: false, triState: true }; ### Tri-State Sorting -Additionally, the Grid Lite component supports tri-state sorting and it is enabled by default. Depending on the configured **`triState`** -value for the grid **`sortConfiguration`** property, end-users will cycle through the following states, - -- **Tri-State Enabled** - - - ```typescript - ascending -> descending -> none -> ascending - ``` +The Grid Lite component tri-state sorting and it is always enabled. End-users will cycle through the following direction states when clicking on sortable column headers: -- **Tri-State Disabled** - - - ```typescript - ascending -> descending -> ascending - ``` +```text +ascending -> descending -> none -> ascending +``` -where **`none`** is the initial state of the data, that is to say with no sorting applied by the grid. +where `none` is the initial state of the data, that is to say with no sorting applied by the grid. ### Sorting Indicators When multi-column sort is enabled, the column headers will display a sorting indicator, which is a number representing the order in which the sorting operations were applied. -The following sample shows the grid **`sortConfiguration`** combinations and how they reflect in the grid. +The following sample shows the grid `sortingOptions` property and how it controls the grid sorting behavior. = { +type SortingExpression = { /** * The `key` of the target column for the sort operation. */ @@ -117,9 +110,9 @@ an end-user interacts with the component. See below for additional information. ## Sort API -The Grid Lite component exposes two main approaches for applying sort operations from its API. Either through the **`GridLite.sort()`**/**`GridLite.clearSort()`** methods or through the **`Grid.Lite.sortExpressions`** property. +The Grid Lite component exposes two main approaches for applying sort operations from its API. Either through the `sort()`/`clearSort()` methods or through the `sortingExpressions` property. -The **`sort()`** method accepts either a single expression or an array of sort expression and then sorts the grid data based on those expressions. +The `sort()` method accepts either a single expression or an array of sort expression and then sorts the grid data based on those expressions. ```typescript // Single @@ -132,7 +125,7 @@ grid.sort([ ]); ``` -The **`clearSort()`** method, as the name implies, clears the sort state of a single column or the whole grid component, depending +The `clearSort()` method, as the name implies, clears the sort state of a single column or the whole grid component, depending on the passed arguments. ```typescript @@ -145,41 +138,39 @@ grid.clearSort(); ### Initial Sorting State -The **`sortExpressions`** property is very similar in behavior to the **`sort()`** method call. It exposes a declarative way to control +The `sortingExpressions` property is very similar in behavior to the `sort()` method call. It exposes a declarative way to control sort state in the grid, but the most useful property is the ability to set initial sort state when the Grid Lite is first rendered. -For example here is a Lit-based sample: +For example: ```typescript -{ - sortState: SortExpression[] = [ +protected sortState: SortingExpression[] = [ { key: 'price', direction: 'descending' }, { key: 'name', direction: 'ascending', caseSensitive: true }, - ]; +]; +``` - render() { - return html`` - } -} +```html + ``` It can be used to get the current sort state of the component and do additional processing depending on another state in your application. ```typescript -const state = grid.sortExpressions; +const state = grid.sortingExpressions; // Save the current sort state saveUserSortState(state); ``` ## Events -When a sorting operation is performed through the UI, the component emits a custom **`sorting`** event. The **`detail`** property is the sort expression which will be applied by the Grid Lite. The event is cancellable and if cancelled will stop the current sort operation. +When a sorting operation is performed through the UI, the component emits a custom `sorting` event. The `detail` property is the sort expression which will be applied by the Grid Lite. The event is cancellable and if cancelled will stop the current sort operation. -After the grid applies the new sorting state, a **`sorted`** event is emitted. It contains the expression which was used in the last sort operation and it is not cancellable. +After the grid applies the new sorting state, a `sorted` event is emitted. It contains the expression which was used in the last sort operation and it is not cancellable. ```typescript -grid.addEventListener('sorting', (event: CustomEvent>) => { ... }); -grid.addEventListener('sorted', (event: CustomEvent>) => { ... }); +grid.addEventListener('sorting', (event: CustomEvent>) => { ... }); +grid.addEventListener('sorted', (event: CustomEvent>) => { ... }); ``` In the following sample, when you try to sort the **Name** and **Rating** columns, the operation will be cancelled. Watch the event log below to see it in action. From ec4865962ca45fd868372280b0ecbe37cfdf982a Mon Sep 17 00:00:00 2001 From: Rumyana Andriova <54146583+randriova@users.noreply.github.com> Date: Fri, 20 Feb 2026 15:57:21 +0200 Subject: [PATCH 20/39] docs(*): Update JA docs - breaking changes - #6354 --- jp/components/grid-lite/binding.md | 13 ++- jp/components/grid-lite/cell-template.md | 50 ++++---- .../grid-lite/column-configuration.md | 74 ++++++------ jp/components/grid-lite/filtering.md | 36 +++--- jp/components/grid-lite/header-template.md | 24 ++-- jp/components/grid-lite/overview.md | 8 +- jp/components/grid-lite/sorting.md | 107 ++++++++---------- 7 files changed, 153 insertions(+), 159 deletions(-) diff --git a/jp/components/grid-lite/binding.md b/jp/components/grid-lite/binding.md index 243b723496..953ba95d76 100644 --- a/jp/components/grid-lite/binding.md +++ b/jp/components/grid-lite/binding.md @@ -22,19 +22,20 @@ Grid Lite は、データ ソースとしてプレーン オブジェクトの grid.data = [...{ /** レコードが続きます */ }]; +``` -// 新しいデータを反映するように列の構成を更新します。 -grid.columns = [...]; +```html + + + + ``` -グリッドで **`autoGenerate`** 有効になっている場合、古い列設定をリセットした場合にのみ、新しい列設定を「推測します」。 +グリッドで `autoGenerate` が有効になっている場合、データが変更されると新しい列の構成が自動的に「推測されます」。 ```typescript grid.autoGenerate = true; -/** 列定義 */ -grid.columns = []; - /** 新しいバインディング後、グリッドはバインドされたデータから列コレクションを推論します。 */ grid.data = []; ``` diff --git a/jp/components/grid-lite/cell-template.md b/jp/components/grid-lite/cell-template.md index 45a82da3d6..3bda2fd76d 100644 --- a/jp/components/grid-lite/cell-template.md +++ b/jp/components/grid-lite/cell-template.md @@ -10,16 +10,22 @@ _language: ja # 列セル テンプレート -デフォルトでは、グリッドは列のキーを使用してセル内の値を文字列としてレンダリングします。基本的なシナリオではこれで問題ありませんが、レンダリング結果をカスタマイズしたい場合や、最終出力が異なるデータ フィールドの組み合わせである場合は、セル テンプレート レンダラーを使用します。 +デフォルトでは、グリッドは列のフィールドを使用してセル内の値を文字列としてレンダリングします。これは基本的なシナリオでは問題ありませんが、レンダリングされる出力をカスタマイズしたい場合や、最終的な出力が異なるデータ フィールドの組み合わせである場合は、セル テンプレートをカスタマイズできます。 -列の **`cellTemplate`** プロパティを設定することで、これを実現できます。 +列の `cellTemplate` プロパティを設定することで、これを実現できます。 ```typescript -{ - cellTemplate?: (params: GridLiteCellContext) => TemplateResult; +protected cellTemplate(params: IgcCellContext) { + // テンプレートの結果を返す } ``` +```html + + + +``` + ## フォーマッタ関数として使用する 簡単なシナリオでは、必要に応じてフォーマット済みの値を返すだけで済みます。以下は数値をロケール通貨形式で表示する例です。 @@ -27,12 +33,8 @@ _language: ja ```typescript const { format: asCurrency } = new Intl.NumberFormat('en-EN', { style: 'currency', currency: 'EUR' }); -{ - ... - /** 値 `value = 123456.789` に対してカスタム通貨形式を返します。 */ - cellTemplate: (params) => asCurrency(params.value) // => "€123,456.79" - ... -} +/** 値 `value = 123456.789` に対してカスタム通貨形式を返します。 */ +protected cellTemplate = (params) => asCurrency(params.value); // => "€123,456.79" ``` データ ソース内の異なるフィールドの値を組み合わせることも可能です。 @@ -42,12 +44,14 @@ Refer to the API documentation for **`GridLiteCellContext`** for more informatio ```typescript const { format: asCurrency } = new Intl.NumberFormat('en-EN', { style: 'currency', currency: 'EUR' }); -{ - ... - /** 価格が 99.99 の品目 10 個の注文に対してカスタム通貨形式を返します。 */ - cellTemplate: ({value, row}) => asCurrency(value * row.data.count) // => "€999.90" - ... -} +/** 価格が 99.99 の品目 10 個の注文に対してカスタム通貨形式を返します。 */ +protected cellTemplate = ({value, row}) => asCurrency(value * row.data.count); // => "€999.90" +``` + +```html + + + ``` ## カスタム DOM テンプレート @@ -62,12 +66,14 @@ const { format: asCurrency } = new Intl.NumberFormat('en-EN', { style: 'currency // Lit パッケージから `html` タグ関数をインポートします。 import { html } from "lit"; -{ - key: 'rating', - // グリッド内の `rating` 値を表すために別の Web コンポーネントを使用します。 - cellTemplate: ({ value }) => html`` - ... -} +// グリッド内の `rating` 値を表すために別の Web コンポーネントを使用します。 +protected cellTemplate = ({ value }) => html``; +``` + +```html + + + ``` >[!NOTE] diff --git a/jp/components/grid-lite/column-configuration.md b/jp/components/grid-lite/column-configuration.md index ddedff195a..0b52eb9d51 100644 --- a/jp/components/grid-lite/column-configuration.md +++ b/jp/components/grid-lite/column-configuration.md @@ -10,23 +10,22 @@ _language: ja # 列の構成 -列は **`columns`** プロパティで定義され、タイプは **`ColumnConfiguration[]`** です。**`key`** は、列識別子として **`ColumnConfiguration`** に唯一必要なプロパティです。グリッド行内の関連データをマッピングしてレンダリングするためにも使用されます。 - -```typescript -const accountColumn: ColumnConfiguration = { - key: 'account', - - /* 追加の構成が続きます */ - ... -}; +列は、グリッド内の列子コンポーネントを使用して宣言的に定義されます。`field` プロパティは、列識別子として機能するため、列に必須の唯一のプロパティです。グリッド行内の関連データをマッピングしてレンダリングするためにも使用されます。 + +```html + + + + ``` ->[!NOTE] ->原則として、**Column** プロパティはレンダリング間で同じ参照を保持すべきです。列は定義として扱われ、グリッドのマウント後に変更するのは明示的に必要な場合のみが推奨されます。不要な変更を行うと、幅やレンダラーなどの状態が失われたり、追加のレンダー サイクルが発生してパフォーマンス低下につながる可能性があります。使用する技術スタックに応じて、配列を適切なレンダリング関数の外で作成するか、メモ化してください。 - ## データ ソースに基づく設定 -グリッドは提供されたデータ ソースに基づき、列設定を推測できます。データ レコードに基づき適切な **`key`** と **`type`** プロパティを推測します。 +グリッドは、`autoGenerate` が true に設定されている場合、提供されたデータ ソースに基づいて列の構成を推測することをサポートします。データ内のレコードに基づいて、適切な `field` および `dataType` プロパティを推測しようとします。 ```typescript const data: Record[] = [ @@ -35,18 +34,18 @@ const data: Record[] = [ ]; ``` -```xml - +```html + ``` -前のスニペットを実行すると、グリッドの列構成は次のようになります: +前のスニペットでは、グリッドは次と同等の列を自動的に作成します: -```typescript -[ - { key: 'entryId', type: 'string' }, - { key: 'source', type: 'string' }, - { key: 'ts', type: 'number' }, -]; +```html + + + + + ``` 追加のカスタマイズを行わずに一部のデータをすばやくレンダリングする場合に便利です。 @@ -56,43 +55,34 @@ const data: Record[] = [ ## 追加の列設定 -列構成オブジェクトは、さらにいくつかのプロパティを公開します。 +列は、さらにいくつかのプロパティを公開します。 ### 列の幅 デフォルトでは列幅は `minmax(136px, 1fr)` で、最小 136px、最大は Grid Lite の利用可能幅の 1 単位です。この方法により、列は流動的でレスポンシブになり、グリッド幅の変更に対応できます。 -列の幅を変更するには、**`ColumnConfiguration`** オブジェクトの **`width`** プロパティを使用します。 +列の幅を変更するには、列の `width` プロパティを使用します。 -```typescript -{ - ... - width: '250px' -} +```html + ``` このプロパティは有効な CSS 長さ単位を受け入れます. ### 列の非表示 -列を非表示/表示するには、列構成オブジェクトの **hidden** プロパティを設定します。 +列の `hidden` プロパティを設定することで、列を非表示/表示できます。 -```typescript -{ - ..., - hidden: true -} +```html + ``` -### Column Resize +### 列のリサイズ -Grid Lite コンポーネントの各列は、列定義で **`resizable`** プロパティを設定することでサイズ変更可能にできます。 +Grid Lite コンポーネントの各列は、列要素の `resizable` プロパティを設定することで、サイズ変更可能に構成できます。 -```typescript -{ - ... - resizable: true -} +```html + ``` 列がサイズ変更可能に設定されている場合、列ヘッダー右端をドラッグして幅を増減できます。リサイズ領域をダブルクリックすると、自動調整がトリガーされ、セルやヘッダーの最大コンテンツに合わせて幅が設定されます。 diff --git a/jp/components/grid-lite/filtering.md b/jp/components/grid-lite/filtering.md index 02d733d07c..69c553c25d 100644 --- a/jp/components/grid-lite/filtering.md +++ b/jp/components/grid-lite/filtering.md @@ -10,28 +10,30 @@ _language: ja # Angular Grid Lite フィルター操作 -Grid Lite は、データ ソースでのフィルター操作をサポートします。データ フィルタリングは列ごとに制御されるため、フィルタリング可能な列とフィルタリング不可能な列を設定できます。デフォルトでは、列構成オブジェクトの **`filter`** プロパティで明示的に構成されない限り、列のフィルタリングは無効になっています。 +Grid Lite は、データ ソースでのフィルター操作をサポートします。データ フィルタリングは列ごとに制御されるため、フィルタリング可能な列とフィルタリング不可能な列を設定できます。デフォルトでは、列構成オブジェクトの `filterable` プロパティで明示的に構成されない限り、列のフィルタリングは無効になっています。 -```typescript -{ - key: 'price', - filter: true -} +```html + ``` -**`filter`** プロパティは、単純なブール値、または追加の構成オプションを公開する **`ColumnFilterConfiguration`** オブジェクトのいずれかになります。 +`filteringCaseSensitive` プロパティまたは `filtering-case-sensitive` 属性を使用して、文字列列のフィルター操作で大文字と小文字を区別するかどうかを制御することもできます: + +```html + +``` + +これらのプロパティはプログラムで設定することもできます。 ```typescript -{ - key: 'price', - filter: { - /** - * string データ タイプの場合、この列のフィルター操作で大文字と小文字を区別するかどうかを制御します。 - * 既定では、string タイプのフィルター操作は大文字と小文字を区別しません。 - */ - caseSensitive: true; - } -} +column.filterable = true; +column.filteringCaseSensitive = true; ``` ``` >[!NOTE] ->**`headerTemplate`** が指定されている場合、**`headerText`** は無視されます。 +>`headerTemplate` が指定されている場合、`header` は無視されます。 ## ヘッダー テンプレートによるカスタマイズ @@ -33,12 +30,17 @@ _language: ja ```typescript import { html } from 'lit'; -{ - key: 'rating', - headerTemplate: () => html`

⭐ Rating ⭐

`, +protected headerTemplate(_params: IgcHeaderContext) { + return html`

⭐ Rating ⭐

`; } ``` +```html + + + +``` + diff --git a/jp/components/grid-lite/overview.md b/jp/components/grid-lite/overview.md index fc9a157311..cd1d546216 100644 --- a/jp/components/grid-lite/overview.md +++ b/jp/components/grid-lite/overview.md @@ -41,7 +41,7 @@ npm install igniteui-grid-lite // app.component.ts import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; -import { IgcGridLite, ColumnConfiguration } from 'igniteui-grid-lite'; +import { IgcGridLite } from 'igniteui-grid-lite'; IgcGridLite.register(); @@ -50,13 +50,15 @@ IgcGridLite.register(); schemas: [CUSTOM_ELEMENTS_SCHEMA] template: `
- + + + +
` }) export class AppComponent { - columns: ColumnConfiguration = [...]; products: Products[] = [...]; } ``` diff --git a/jp/components/grid-lite/sorting.md b/jp/components/grid-lite/sorting.md index 563379fbb9..1356ebedfa 100644 --- a/jp/components/grid-lite/sorting.md +++ b/jp/components/grid-lite/sorting.md @@ -10,34 +10,36 @@ _language: ja # ソート操作 -Grid Lite はデータ ソースに対してソート操作をサポートします。ソートは列単位で制御され、ソート可能な列とソート不可の列を設定できます。グリッド自体も特定のソート動作を制御します。デフォルトでは、**`sort`** プロパティで明示的に設定されない限り、列のソートは無効です。 +Grid Lite はデータ ソースに対してソート操作をサポートします。ソートは列単位で制御され、ソート可能な列とソート不可の列を設定できます。グリッド自体も特定のソート動作を制御します。デフォルトでは、`sortable` プロパティで明示的に設定されない限り、列のソートは無効です。 -```typescript -{ - key: 'price', - sort: true -} +```html + +``` + +`sortingCaseSensitive` プロパティまたは `sorting-case-sensitive` 属性を使用して、文字列列のソート操作で大文字と小文字を区別するかどうかを制御することもできます。 + +```html + ``` -**`sort`** プロパティは、単純なブール値、または追加の構成オプションを公開する **`ColumnSortConfiguration`** オブジェクトのいずれかになります。 +カスタム比較ロジックの場合は、`comparer` 関数を使用して `sortConfiguration` プロパティを設定します: ```typescript -{ - key: 'name', - sort: { - /** - * string データ タイプの場合、この列のソート操作で大文字と小文字を区別するかどうかを制御します。 - * 既定では、string タイプのソート操作は大文字と小文字を区別しません。 - */ - caseSensitive: true, - /** - * この列のソート操作に使用されるカスタム比較関数を指定します。 - * - * 次のサンプルでは、`name` の値をその長さに基づいて比較します。 - */ - comparer: (a, b) => a.length - b.length - } -} +column.sortable = true; +column.sortConfiguration = { + /** + * この列のソート操作に使用されるカスタム比較関数を指定します。 + * 次のサンプルでは、`name` の値をその長さに基づいて比較します。 + */ + comparer: (a, b) => a.length - b.length +}; ``` [!NOTE] @@ -58,20 +60,11 @@ grid.sortConfiguration = { multiple: false, triState: true }; ### 3 状態ソート -さらに、Grid Lite は 3 状態ソートをサポートし、デフォルトで有効です。グリッドの **`sortConfiguration`** プロパティの **`triState 設定に応じて、ユーザーは次の状態を循環します:`** +Grid Lite コンポーネントは 3 状態ソートをサポートしており、常に有効になっています。エンド ユーザーはソート可能な列ヘッダーをクリックすると、次の方向状態を順番に切り替えます: - -- **3 状態有効** - - - ```typescript - ascending -> descending -> none -> ascending - ``` - -- **3 状態無効** - - - ```typescript - ascending -> descending -> ascending - ``` +```text +ascending -> descending -> none -> ascending +``` `none` はデータの初期状態で、グリッドによるソートが適用されていません。 @@ -79,7 +72,7 @@ grid.sortConfiguration = { multiple: false, triState: true }; 複数列ソートが有効な場合、列ヘッダーにはソートインジケーターが表示されます。これはソート操作が適用された順序を示す番号です。 -次のサンプルは、グリッドの **`sortConfiguration`** の組み合わせと、その反映例を示します。 +次のサンプルは、グリッドの `sortingOptions` プロパティと、それがグリッドのソート動作を制御する方法を示しています。 = { +type SortingExpression = { /** * ソート操作の対象列の `key`。 */ @@ -117,9 +110,9 @@ type SortExpression = { ## ソート API -Grid Lite は、ソート操作を API から適用するために 2 つの方法を提供します。**`GridLite.sort()`**/**`GridLite.clearSort()`** メソッドを使用するか、**`Grid.Lite.sortExpressions`** プロパティを使用します。 +Grid Lite は、ソート操作を API から適用するために 2 つの方法を提供します。`sort()`/`clearSort()` メソッドを使用するか、`sortingExpressions` プロパティを使用します。 -The **`sort()`** メソッドは、単一式または複数のソート式の配列を受け取り、それらに基づいてグリッド データをソートします。 +The `sort()` メソッドは、単一式または複数のソート式の配列を受け取り、それらに基づいてグリッド データをソートします。 ```typescript // 単一 @@ -132,7 +125,7 @@ grid.sort([ ]); ``` -The **`clearSort()`** メソッドは、その名の通り、単一列またはグリッド全体のソート状態をクリアします。引数に応じて挙動が変わります。 +The `clearSort()` メソッドは、その名の通り、単一列またはグリッド全体のソート状態をクリアします。引数に応じて挙動が変わります。 ```typescript // `price` 列のソート状態をクリアします。 @@ -144,40 +137,38 @@ grid.clearSort(); ### 初期のソート状態 -**`sortExpressions`** プロパティは **`sort()`** メソッド呼び出しと同様の動作をします。これはグリッド内のソート状態を制御する宣言的な方法を公開していますが、最も便利なプロパティは、Grid Lite が最初にレンダリングされるときに初期ソート状態を設定できることです。 +`sortingExpressions` プロパティは `sort()` メソッド呼び出しと同様の動作をします。これはグリッド内のソート状態を制御する宣言的な方法を公開していますが、最も便利なプロパティは、Grid Lite が最初にレンダリングされるときに初期ソート状態を設定できることです。 -たとえば、Lit ベースのサンプルを次に示します。 +例: ```typescript -{ - sortState: SortExpression[] = [ +protected sortState: SortingExpression[] = [ { key: 'price', direction: 'descending' }, { key: 'name', direction: 'ascending', caseSensitive: true }, - ]; +]; +``` - render() { - return html`` - } -} +```html + ``` これを使用すると、コンポーネントの現在のソート状態を取得し、アプリケーション内の別の状態に応じて追加の処理を実行できます。 ```typescript -const state = grid.sortExpressions; +const state = grid.sortingExpressions; // 現在のソート状態を保存します saveUserSortState(state); ``` ## イベント -UI を通じてソート操作が実行されると、コンポーネントはカスタム **`sorting`** イベントを発行します。**`detail`** プロパティには Gird Lite が適用するソート式が含まれます。イベントはキャンセル可能で、キャンセルすると現在のソート操作が停止します。 +UI を通じてソート操作が実行されると、コンポーネントはカスタム `sorting` イベントを発行します。`detail` プロパティには Gird Lite が適用するソート式が含まれます。イベントはキャンセル可能で、キャンセルすると現在のソート操作が停止します。 -グリッドが新しいソート状態を適用した後、**`sorted`** イベントが発行されます。最後のソート操作で使用された式を含み、キャンセルはできません。 +グリッドが新しいソート状態を適用した後、`sorted` イベントが発行されます。最後のソート操作で使用された式を含み、キャンセルはできません。 ```typescript -grid.addEventListener('sorting', (event: CustomEvent>) => { ... }); -grid.addEventListener('sorted', (event: CustomEvent>) => { ... }); +grid.addEventListener('sorting', (event: CustomEvent>) => { ... }); +grid.addEventListener('sorted', (event: CustomEvent>) => { ... }); ``` 次のサンプルでは、**Name** と **Rating** 列のソートを試みると操作がキャンセルされます。下記のイベント ログで動作を確認してください。 From 2b0e5c05feb6b4da04736b528f1d7c1cf350d65f Mon Sep 17 00:00:00 2001 From: Galina Edinakova Date: Fri, 20 Feb 2026 17:14:31 +0200 Subject: [PATCH 21/39] feat(PDF): Adding a section for the new custom font option. (#6370) --- cspell.json | 1 + en/components/exporter-pdf.md | 83 ++++++++++++ en/components/toc.yml | 3 +- jp/components/exporter-pdf.md | 84 +++++++++++++ kr/components/exporter-pdf.md | 229 ++++++++++++++++++++++++++++++++++ 5 files changed, 399 insertions(+), 1 deletion(-) create mode 100644 kr/components/exporter-pdf.md diff --git a/cspell.json b/cspell.json index 00413704ce..92337f7824 100644 --- a/cspell.json +++ b/cspell.json @@ -249,6 +249,7 @@ "artboard", "antumbra", "NOAA", + "Noto", "coalescences", "Lambo", "valuekey", diff --git a/en/components/exporter-pdf.md b/en/components/exporter-pdf.md index bf502a691e..e9f2e52c3d 100644 --- a/en/components/exporter-pdf.md +++ b/en/components/exporter-pdf.md @@ -100,6 +100,7 @@ The [`IgxPdfExporterOptions`]({environment:angularApiUrl}/classes/igxpdfexporter - **pageSize**: Specifies the page size (`a3`, `a4`, `a5`, `letter`, `legal`, etc.). Default is `a4`. - **showTableBorders**: Determines whether to display table borders. Default is `true`. - **fontSize**: Sets the font size for the table content. Default is `10`. +- **customFont**: Specifies a custom TrueType font (TTF) for Unicode character support. Required when exporting data containing non-Latin characters. The following example demonstrates how to configure these options: @@ -117,6 +118,88 @@ public exportButtonHandler() { } ``` +### Custom Font Configuration for Unicode Support + +By default, the PDF exporter uses the built-in Helvetica font, which only supports basic Latin characters. If your data contains non-Latin characters (such as Cyrillic, Chinese, Japanese, Arabic, Hebrew, or special symbols), you must provide a custom TrueType font (TTF) using the `customFont` property. + +The font data must be provided as a Base64-encoded string of the TTF file contents. You can optionally provide a separate bold variant for header styling. + +#### Converting TTF Files to Base64 + +To convert a TTF file to Base64, use Node.js: + +```javascript +const fs = require('fs'); +const fontData = fs.readFileSync('path/to/font.ttf'); +const base64 = fontData.toString('base64'); +fs.writeFileSync('font-base64.ts', `export const MY_FONT = '${base64}';`); +``` + +Alternatively, you can use an online Base64 encoder tool to convert your TTF file. + +#### Example: Basic Custom Font Usage + +```typescript +// fonts/noto-sans.ts +export const NOTO_SANS_REGULAR = 'AAEAAAATAQAABAAwR0...[base64-encoded font data]...'; + +// component.ts +import { NOTO_SANS_REGULAR } from './fonts/noto-sans'; + +public exportButtonHandler() { + const options = new IgxPdfExporterOptions('ExportedDataFile'); + options.customFont = { + name: 'NotoSans', + data: NOTO_SANS_REGULAR + }; + + this.pdfExportService.exportData(this.localData, options); +} +``` + +#### Example: Custom Font with Bold Variant + +```typescript +// fonts/noto-sans.ts +export const NOTO_SANS_REGULAR = 'AAEAAAATAQAABAAwR0...[base64-encoded regular font]...'; +export const NOTO_SANS_BOLD = 'BBFAAAAUBQAACAAxS1...[base64-encoded bold font]...'; + +// component.ts +import { NOTO_SANS_REGULAR, NOTO_SANS_BOLD } from './fonts/noto-sans'; + +public exportButtonHandler() { + const options = new IgxPdfExporterOptions('ExportedDataFile'); + options.customFont = { + name: 'NotoSans', + data: NOTO_SANS_REGULAR, + bold: { + name: 'NotoSans-Bold', + data: NOTO_SANS_BOLD + } + }; + + this.pdfExportService.export(this.igxGrid1, options); +} +``` + +#### Recommended Fonts for Unicode Support + +The following fonts provide excellent Unicode coverage: + +- **Noto Sans**: Covers most Unicode scripts — [Google Fonts](https://fonts.google.com/noto/specimen/Noto+Sans) +- **Arial Unicode MS**: Comprehensive Unicode character support +- **Source Han Sans**: Excellent CJK (Chinese, Japanese, Korean) support + +### Demo + + + + +
+ ## Known Limitations | Limitation | Description | diff --git a/en/components/toc.yml b/en/components/toc.yml index 24a8ca9647..2c3f28edad 100644 --- a/en/components/toc.yml +++ b/en/components/toc.yml @@ -1454,7 +1454,8 @@ premium: true - name: PDF Exporter href: exporter-pdf.md - new: true + new: false + updated: true premium: true - name: Transaction Service href: transaction.md diff --git a/jp/components/exporter-pdf.md b/jp/components/exporter-pdf.md index fb4dd70a25..5a998f6773 100644 --- a/jp/components/exporter-pdf.md +++ b/jp/components/exporter-pdf.md @@ -101,6 +101,7 @@ this.pdfExportService.export(this.igxGrid1, new IgxPdfExporterOptions('ExportedD - **pageSize**: ページ サイズ (`a3`、`a4`、`a5`、`letter`、`legal` など) を指定します。デフォルトは `a4` です。 - **showTableBorders**: テーブルの境界線を表示するかどうかを決定します。デフォルトは `true` です。 - **fontSize**: テーブル コンテンツのフォント サイズを設定します。デフォルトは `10` です。 +- **customFont**: Specifies a custom TrueType font (TTF) for Unicode character support. Required when exporting data containing non-Latin characters. 次の例は、これらのオプションを構成する方法を示しています。 @@ -118,6 +119,89 @@ public exportButtonHandler() { } ``` +### Custom Font Configuration for Unicode Support + +By default, the PDF exporter uses the built-in Helvetica font, which only supports basic Latin characters. If your data contains non-Latin characters (such as Cyrillic, Chinese, Japanese, Arabic, Hebrew, or special symbols), you must provide a custom TrueType font (TTF) using the `customFont` property. + +The font data must be provided as a Base64-encoded string of the TTF file contents. You can optionally provide a separate bold variant for header styling. + +#### Converting TTF Files to Base64 + +To convert a TTF file to Base64, use Node.js: + +```javascript +const fs = require('fs'); +const fontData = fs.readFileSync('path/to/font.ttf'); +const base64 = fontData.toString('base64'); +fs.writeFileSync('font-base64.ts', `export const MY_FONT = '${base64}';`); +``` + +Alternatively, you can use an online Base64 encoder tool to convert your TTF file. + +#### Example: Basic Custom Font Usage + +```typescript +// fonts/noto-sans.ts +export const NOTO_SANS_REGULAR = 'AAEAAAATAQAABAAwR0...[base64-encoded font data]...'; + +// component.ts +import { NOTO_SANS_REGULAR } from './fonts/noto-sans'; + +public exportButtonHandler() { + const options = new IgxPdfExporterOptions('ExportedDataFile'); + options.customFont = { + name: 'NotoSans', + data: NOTO_SANS_REGULAR + }; + + this.pdfExportService.exportData(this.localData, options); +} +``` + +#### Example: Custom Font with Bold Variant + +```typescript +// fonts/noto-sans.ts +export const NOTO_SANS_REGULAR = 'AAEAAAATAQAABAAwR0...[base64-encoded regular font]...'; +export const NOTO_SANS_BOLD = 'BBFAAAAUBQAACAAxS1...[base64-encoded bold font]...'; + +// component.ts +import { NOTO_SANS_REGULAR, NOTO_SANS_BOLD } from './fonts/noto-sans'; + +public exportButtonHandler() { + const options = new IgxPdfExporterOptions('ExportedDataFile'); + options.customFont = { + name: 'NotoSans', + data: NOTO_SANS_REGULAR, + bold: { + name: 'NotoSans-Bold', + data: NOTO_SANS_BOLD + } + }; + + this.pdfExportService.export(this.igxGrid1, options); +} +``` + +#### Recommended Fonts for Unicode Support + +The following fonts provide excellent Unicode coverage: + +- **Noto Sans**: Covers most Unicode scripts — [Google Fonts](https://fonts.google.com/noto/specimen/Noto+Sans) +- **Arial Unicode MS**: Comprehensive Unicode character support +- **Source Han Sans**: Excellent CJK (Chinese, Japanese, Korean) support + +### Demo + + + + +
+ + ## 既知の制限 | 制限 | 説明 | diff --git a/kr/components/exporter-pdf.md b/kr/components/exporter-pdf.md new file mode 100644 index 0000000000..e9f2e52c3d --- /dev/null +++ b/kr/components/exporter-pdf.md @@ -0,0 +1,229 @@ +--- +title: Export to PDF Component - Native Angular | Ignite UI for Angular +_description: Users can export their data for offline presentation can do so in PDF format with the Export to PDF Ignite UI for Angular component. +_keywords: Ignite UI for Angular, UI controls, Angular widgets, web widgets, UI widgets, Angular, Native Angular Controls, Native Angular Components Suite, Native Angular Controls, Native Angular Components Library, Angular Grid, Angular Data Grid, Angular Grid Control, Angular Grid Component, PDF Export, Angular PDF Component, Angular Export PDF +_license: commercial +--- + +# PDF Exporter + +

+ +The Ignite UI for Angular PDF Exporter service provides powerful functionality to export data in PDF format from various sources, including raw data arrays and advanced grid components such as [**IgxGrid**](grid/grid.md), [**IgxTreeGrid**](treegrid/tree-grid.md), [**IgxHierarchicalGrid**](hierarchicalgrid/hierarchical-grid.md), and [**IgxPivotGrid**](pivotGrid/pivot-grid.md). The exporting functionality is encapsulated in the [`IgxPdfExporterService`]({environment:angularApiUrl}/classes/igxpdfexporterservice.html) class, which enables seamless data export to PDF format with comprehensive features including multi-page document support, automatic page breaks, and customizable formatting options. +

+
+ +## Angular PDF Exporter Example + + + + + +
+ +## Usage + +To start using the Ignite UI PDF Exporter, first import the [`IgxPdfExporterService`]({environment:angularApiUrl}/classes/igxpdfexporterservice.html) into your component: + +```typescript +import { IgxPdfExporterService } from 'igniteui-angular/grids/core'; + +// import { IgxPdfExporterService } from '@infragistics/igniteui-angular/grids/core'; for licensed package + +@Component({ + ... +}) +export class AppComponent { ... } +``` + +To initiate an export process, you can use a button click handler in your component's template. + +```html + +``` + +You can access the [`IgxPdfExporterService`]({environment:angularApiUrl}/classes/igxpdfexporterservice.html) by using the `inject` function. To export data in PDF format, you need to invoke the exporter service's [`exportData`]({environment:angularApiUrl}/classes/igxpdfexporterservice.html#exportdata) method. This method accepts the data you want to export as its first argument, and an [`IgxPdfExporterOptions`]({environment:angularApiUrl}/classes/igxpdfexporteroptions.html) instance as its second argument, which allows you to configure the export process. + +Here is the code that will execute the export process in the component's TypeScript file: + +```typescript +// component.ts + +... +import { Component, inject, signal } from '@angular/core'; +import { IgxPdfExporterService, IgxPdfExporterOptions } from 'igniteui-angular/grids/core'; + +// import { IgxPdfExporterService, IgxPdfExporterOptions } from '@infragistics/igniteui-angular/grids/core'; for licensed package +... + +public localData = signal([ + { Name: 'Eric Ridley', Age: '26' }, + { Name: 'Alanis Brook', Age: '22' }, + { Name: 'Jonathan Morris', Age: '23' } +]); + +private pdfExportService = inject(IgxPdfExporterService); + +public exportButtonHandler() { + this.pdfExportService.exportData(this.localData, new IgxPdfExporterOptions('ExportedDataFile')); +} + +``` + +If all went well, you should see an export button. When pressed, it will trigger the export process and the browser will download a file named "ExportedDataFile.pdf" which contains the data from the `localData` array in PDF format. + +## Customizing the Exported Content + +In the above examples, the PDF Exporter service exports all available data. However, there are situations where you may want to skip exporting a row or an entire column. To achieve this, you can subscribe to the [`columnExporting`]({environment:angularApiUrl}/classes/igxpdfexporterservice.html#columnexporting) and/or [`rowExporting`]({environment:angularApiUrl}/classes/igxpdfexporterservice.html#rowexporting) events, which are fired for each column and/or each row respectively. You can then cancel the export by setting the event argument object's [`cancel`]({environment:angularApiUrl}/interfaces/irowexportingeventargs.html#cancel) property to `true`. + +The following example excludes a column from the export if its header is "Age" and its index is 1: + +```typescript +// component.ts + +this.pdfExportService.columnExporting.subscribe((args: IColumnExportingEventArgs) => { + if (args.header == 'Age' && args.columnIndex == 1) { + args.cancel = true; + } +}); +this.pdfExportService.export(this.igxGrid1, new IgxPdfExporterOptions('ExportedDataFile')); +``` + +## PDF Export Options + +The [`IgxPdfExporterOptions`]({environment:angularApiUrl}/classes/igxpdfexporteroptions.html) class provides several properties to customize the PDF export: + +- **pageOrientation**: Specifies the page orientation (`portrait` or `landscape`). Default is `landscape`. +- **pageSize**: Specifies the page size (`a3`, `a4`, `a5`, `letter`, `legal`, etc.). Default is `a4`. +- **showTableBorders**: Determines whether to display table borders. Default is `true`. +- **fontSize**: Sets the font size for the table content. Default is `10`. +- **customFont**: Specifies a custom TrueType font (TTF) for Unicode character support. Required when exporting data containing non-Latin characters. + +The following example demonstrates how to configure these options: + +```typescript +// component.ts + +public exportButtonHandler() { + const options = new IgxPdfExporterOptions('ExportedDataFile'); + options.pageOrientation = 'portrait'; + options.pageSize = 'letter'; + options.showTableBorders = true; + options.fontSize = 12; + + this.pdfExportService.exportData(this.localData, options); +} +``` + +### Custom Font Configuration for Unicode Support + +By default, the PDF exporter uses the built-in Helvetica font, which only supports basic Latin characters. If your data contains non-Latin characters (such as Cyrillic, Chinese, Japanese, Arabic, Hebrew, or special symbols), you must provide a custom TrueType font (TTF) using the `customFont` property. + +The font data must be provided as a Base64-encoded string of the TTF file contents. You can optionally provide a separate bold variant for header styling. + +#### Converting TTF Files to Base64 + +To convert a TTF file to Base64, use Node.js: + +```javascript +const fs = require('fs'); +const fontData = fs.readFileSync('path/to/font.ttf'); +const base64 = fontData.toString('base64'); +fs.writeFileSync('font-base64.ts', `export const MY_FONT = '${base64}';`); +``` + +Alternatively, you can use an online Base64 encoder tool to convert your TTF file. + +#### Example: Basic Custom Font Usage + +```typescript +// fonts/noto-sans.ts +export const NOTO_SANS_REGULAR = 'AAEAAAATAQAABAAwR0...[base64-encoded font data]...'; + +// component.ts +import { NOTO_SANS_REGULAR } from './fonts/noto-sans'; + +public exportButtonHandler() { + const options = new IgxPdfExporterOptions('ExportedDataFile'); + options.customFont = { + name: 'NotoSans', + data: NOTO_SANS_REGULAR + }; + + this.pdfExportService.exportData(this.localData, options); +} +``` + +#### Example: Custom Font with Bold Variant + +```typescript +// fonts/noto-sans.ts +export const NOTO_SANS_REGULAR = 'AAEAAAATAQAABAAwR0...[base64-encoded regular font]...'; +export const NOTO_SANS_BOLD = 'BBFAAAAUBQAACAAxS1...[base64-encoded bold font]...'; + +// component.ts +import { NOTO_SANS_REGULAR, NOTO_SANS_BOLD } from './fonts/noto-sans'; + +public exportButtonHandler() { + const options = new IgxPdfExporterOptions('ExportedDataFile'); + options.customFont = { + name: 'NotoSans', + data: NOTO_SANS_REGULAR, + bold: { + name: 'NotoSans-Bold', + data: NOTO_SANS_BOLD + } + }; + + this.pdfExportService.export(this.igxGrid1, options); +} +``` + +#### Recommended Fonts for Unicode Support + +The following fonts provide excellent Unicode coverage: + +- **Noto Sans**: Covers most Unicode scripts — [Google Fonts](https://fonts.google.com/noto/specimen/Noto+Sans) +- **Arial Unicode MS**: Comprehensive Unicode character support +- **Source Han Sans**: Excellent CJK (Chinese, Japanese, Korean) support + +### Demo + + + + +
+ +## Known Limitations + +| Limitation | Description | +|---|---| +| Wide PDF layouts | Very wide grids can force PDF columns to shrink to fit the page. Apply explicit column widths or hide low‑priority fields before exporting to keep the document legible. | + +## API References + +The PDF Exporter service has a few more APIs to explore, which are listed below. + +- [`IgxPdfExporterService API`]({environment:angularApiUrl}/classes/igxpdfexporterservice.html) +- [`IgxPdfExporterOptions API`]({environment:angularApiUrl}/classes/igxpdfexporteroptions.html) + +Additional components that were used: + +- [IgxGridComponent API]({environment:angularApiUrl}/classes/igxgridcomponent.html) +- [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) + +
+ +## Additional Resources + +
+Our community is active and always welcoming to new ideas. + +- [Ignite UI for Angular **Forums**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) +- [Ignite UI for Angular **GitHub**](https://github.com/IgniteUI/igniteui-angular) \ No newline at end of file From 63f21bf6dfeb43bd69794df1dfc18360df6dcc4d Mon Sep 17 00:00:00 2001 From: zdrawku Date: Mon, 23 Feb 2026 08:02:36 +0200 Subject: [PATCH 22/39] feat(docs): add AI-Assisted Development section and links across components --- .../general/ai-assisted-development.md | 169 ++++++++++++++++++ en/components/general/getting-started.md | 7 + en/components/grid/grid.md | 1 + .../hierarchicalgrid/hierarchical-grid.md | 1 + en/components/pivotGrid/pivot-grid.md | 1 + en/components/toc.yml | 3 + en/components/treegrid/tree-grid.md | 1 + 7 files changed, 183 insertions(+) create mode 100644 en/components/general/ai-assisted-development.md diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md new file mode 100644 index 0000000000..257e729801 --- /dev/null +++ b/en/components/general/ai-assisted-development.md @@ -0,0 +1,169 @@ +--- +title: AI-Assisted Development | Copilot Skills | Ignite UI for Angular | Infragistics +_description: Learn how to use Copilot Skills to supercharge AI-assisted development with Ignite UI for Angular components, grids, data operations, and theming. +_keywords: ignite ui for angular, copilot skills, ai assisted development, github copilot, cursor, windsurf, claude, jetbrains ai +--- + +# AI-Assisted Development + +Ignite UI for Angular ships with **Copilot Skills** — structured knowledge files that teach AI coding assistants (GitHub Copilot, Cursor, Windsurf, Claude, JetBrains AI, etc.) how to work with Ignite UI for Angular. These skill files provide context-aware guidance on components, grids, data operations, and theming, enabling your AI assistant to generate accurate, idiomatic code that follows best practices. + +## Available Skills + +The skill files live in the [`skills/`](https://github.com/IgniteUI/igniteui-angular/tree/master/skills) directory of the Ignite UI for Angular repository: + +| Skill | Path | Description | +|:------|:-----|:------------| +| Components & Layout | [`skills/igniteui-angular-components/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-components/SKILL.md) | Standalone components, form controls, overlays, layout | +| Data Grids | [`skills/igniteui-angular-grids/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md) | Grid, Tree Grid, Hierarchical Grid, Pivot Grid | +| Grid Data Operations | [`skills/igniteui-angular-grid-data-operations/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grid-data-operations/SKILL.md) | Sorting, filtering, grouping, paging, remote data, state management | +| Theming & Styling | [`skills/igniteui-angular-theming/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md) | Palettes, typography, elevations, component themes, MCP server | + +There are two ways to use skills with your AI assistant: [create a persistent IDE agent](#approach-1-create-a-persistent-ide-agent) that always applies them automatically, or [download and load them manually](#approach-2-download-and-load-skills-manually) into your preferred IDE on demand. + +## Approach 1: Create a Persistent IDE Agent + +This approach wires the skills permanently into your project so that every AI session automatically follows the Ignite UI for Angular guidelines — no copy-pasting required. + +### GitHub Copilot (VS Code) + +GitHub Copilot reads custom instructions from a `.github/copilot-instructions.md` file at the root of your repository. To create a persistent agent: + +1. Create (or open) `.github/copilot-instructions.md` in your project root. +2. Add a reference or paste the relevant skill content into that file. For example: + +```markdown +# Copilot Instructions + +This project uses Ignite UI for Angular. Follow the guidelines in the skill files below: + +- Components & Layout: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-components/SKILL.md +- Data Grids: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md +- Grid Data Operations: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grid-data-operations/SKILL.md +- Theming & Styling: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md +``` + +3. Alternatively, paste the full content of the relevant `SKILL.md` files directly into `copilot-instructions.md` for fully offline, self-contained instructions. +4. Copilot will now apply these instructions automatically on every chat and inline suggestion in VS Code. + +### Cursor + +Cursor supports persistent project rules through a `.cursorrules` file or the `.cursor/rules/` directory: + +1. Create `.cursorrules` in your project root (or `.cursor/rules/igniteui.md` for a named rule). +2. Paste the contents of the desired `SKILL.md` files into that file. For example: + +``` +# Ignite UI for Angular Rules + + + +``` + +3. Cursor will include these rules in every AI request automatically. You can also use the `@rules` mention in chat to reference a specific rule on demand. + +### Windsurf + +Windsurf reads persistent rules from a `.windsurfrules` file at the project root: + +1. Create `.windsurfrules` in your project root. +2. Paste the contents of the relevant `SKILL.md` files into it. +3. Every Cascade AI session in Windsurf will now include these as persistent instructions. + +### JetBrains IDEs (WebStorm, IntelliJ) + +JetBrains AI Assistant supports project-level prompts that are applied to every AI interaction: + +1. Open **Settings** (or **Preferences** on macOS) → **Tools** → **AI Assistant** → **Project-level prompt**. +2. Paste the contents of the relevant `SKILL.md` files into the prompt field. +3. Click **Apply**. The AI Assistant will now follow these instructions for all requests inside the project. + +### Claude Code + +Claude Code supports a `CLAUDE.md` file at the project root as persistent agent instructions: + +1. Create `CLAUDE.md` in your project root. +2. Paste the contents of the relevant `SKILL.md` files into it. For example: + +```markdown +# Project Instructions + +This project uses Ignite UI for Angular. Always follow these guidelines: + + +``` + +3. Claude Code will automatically read `CLAUDE.md` at the start of every session. + +--- + +## Approach 2: Download and Load Skills Manually + +Use this approach when you want to load a specific skill on demand, without permanently modifying project configuration files. + +### Step 1: Get the Skill Files + +**Option B — Download individual files** + +Each skill file can be downloaded directly from GitHub. Open the raw file URL in your browser and save it, or use `curl`: + +```bash +# Components & Layout +curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-components/SKILL.md + +# Data Grids +curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-grids/SKILL.md + +# Grid Data Operations +curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-grid-data-operations/SKILL.md + +# Theming & Styling +curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-theming/SKILL.md +``` + +**Option B — Use the installed npm package** + +If Ignite UI for Angular is already installed in your project, the skill files are available under `node_modules`: + +``` +node_modules/igniteui-angular/skills/igniteui-angular-components/SKILL.md +node_modules/igniteui-angular/skills/igniteui-angular-grids/SKILL.md +node_modules/igniteui-angular/skills/igniteui-angular-grid-data-operations/SKILL.md +node_modules/igniteui-angular/skills/igniteui-angular-theming/SKILL.md +``` + +### Step 2: Load the Skill into Your IDE + +Once you have the files, open them and load them into your AI assistant: + +| IDE / Tool | How to load | +|:-----------|:------------| +| **VS Code + GitHub Copilot** | Use `#file:path/to/SKILL.md` in the Copilot Chat input to attach it as context for that session. | +| **Cursor** | Drag the `SKILL.md` file into the chat window, or type `@file` and select it. | +| **Windsurf** | Attach the file using the **+** button in the Cascade chat panel. | +| **JetBrains AI Assistant** | Click the paperclip icon in the AI chat to attach the file as context. | +| **Claude Desktop** | Drag the file into the chat or add it to the project knowledge base via **Project → Add Content**. | +| **Other assistants** | Open the `SKILL.md` file, copy its full contents, and paste them into the system prompt or at the top of your first message. | + +--- + +## Theming MCP Server + +The **Theming skill** includes setup instructions for the `igniteui-theming` MCP server, which gives AI assistants access to live theming tools such as palette generation and component theme scaffolding. See the [Theming skill file](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md) for configuration steps for VS Code, Cursor, Claude Desktop, and JetBrains IDEs. + +For more information on theming, refer to the [Ignite UI for Angular Theming](../themes.md) documentation and the [How to Customize Theme](./how-to/how-to-customize-theme.md) walkthrough. + +## Additional Resources + +
+ +- [Getting Started with Ignite UI for Angular](getting-started.md) +- [Angular Schematics & Ignite UI CLI](cli-overview.md) +- [How to Use Standalone Components](how-to/how-to-use-standalone-components.md) +- [Code Splitting and Multiple Entry Points](code-splitting-and-multiple-entry-points.md) + +
+Our community is active and always welcoming to new ideas. + +- [Ignite UI for Angular **Forums**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) +- [Ignite UI for Angular **GitHub**](https://github.com/IgniteUI/igniteui-angular) diff --git a/en/components/general/getting-started.md b/en/components/general/getting-started.md index 10b0b923c1..9242761837 100644 --- a/en/components/general/getting-started.md +++ b/en/components/general/getting-started.md @@ -302,10 +302,17 @@ In this article we learned how to create our own Ignite UI for Angular applicati - [IgxGridComponent]({environment:angularApiUrl}/classes/igxgridcomponent.html) - [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) +## AI-Assisted Development + +Ignite UI for Angular ships with **Copilot Skills** — structured knowledge files that teach AI coding assistants (GitHub Copilot, Cursor, Windsurf, Claude, JetBrains AI, etc.) how to work with the library. Skills cover components, data grids, grid data operations, and theming. + +Learn more in the [AI-Assisted Development](ai-assisted-development.md) topic. + ## Additional Resources
+- [AI-Assisted Development](ai-assisted-development.md) - [Ignite UI CLI](https://github.com/IgniteUI/igniteui-cli) - [Ignite UI CLI Commands](https://github.com/IgniteUI/igniteui-cli/wiki#available-commands) - [Grid overview](../grid/grid.md) diff --git a/en/components/grid/grid.md b/en/components/grid/grid.md index a1e495e0da..9a36724d77 100644 --- a/en/components/grid/grid.md +++ b/en/components/grid/grid.md @@ -875,6 +875,7 @@ Learn more about creating an Angular data grid in our short tutorial video: - [Selection](selection.md) - [Column Data Types](column-types.md#default-template) - [Build CRUD operations with igxGrid](../general/how-to/how-to-perform-crud.md) +- [AI-Assisted Development](../general/ai-assisted-development.md) — Copilot Skills for grids, data operations, and theming
Our community is active and always welcoming to new ideas. diff --git a/en/components/hierarchicalgrid/hierarchical-grid.md b/en/components/hierarchicalgrid/hierarchical-grid.md index 853c016cc5..8ee29a9990 100644 --- a/en/components/hierarchicalgrid/hierarchical-grid.md +++ b/en/components/hierarchicalgrid/hierarchical-grid.md @@ -431,6 +431,7 @@ platformBrowserDynamic() - [Column Pinning](column-pinning.md) - [Column Resizing](column-resizing.md) - [Selection](selection.md) +- [AI-Assisted Development](../general/ai-assisted-development.md) — Copilot Skills for grids, data operations, and theming
Our community is active and always welcoming to new ideas. diff --git a/en/components/pivotGrid/pivot-grid.md b/en/components/pivotGrid/pivot-grid.md index 12d6c2d22a..36830153ec 100644 --- a/en/components/pivotGrid/pivot-grid.md +++ b/en/components/pivotGrid/pivot-grid.md @@ -346,6 +346,7 @@ This feature allows developers to quickly create a pivot view without manually s - [Angular Pivot Grid Features](pivot-grid-features.md) - [Angular Pivot Grid Custom Aggregations](pivot-grid-custom.md) +- [AI-Assisted Development](../general/ai-assisted-development.md) — Copilot Skills for grids, data operations, and theming
Our community is active and always welcoming to new ideas. diff --git a/en/components/toc.yml b/en/components/toc.yml index 2c3f28edad..9ad030316f 100644 --- a/en/components/toc.yml +++ b/en/components/toc.yml @@ -53,6 +53,9 @@ - name: Use Standalone Components href: general/how-to/how-to-use-standalone-components.md updated: false +- name: AI-Assisted Development + href: general/ai-assisted-development.md + new: true - name: Angular Schematics & Ignite UI CLI href: general/cli-overview.md sortable: false diff --git a/en/components/treegrid/tree-grid.md b/en/components/treegrid/tree-grid.md index 4408879cf3..0c03b8e977 100644 --- a/en/components/treegrid/tree-grid.md +++ b/en/components/treegrid/tree-grid.md @@ -406,6 +406,7 @@ platformBrowserDynamic() - [Grid Sizing](sizing.md) - [Data Grid](../grid/grid.md) - [Row Editing](row-editing.md) +- [AI-Assisted Development](../general/ai-assisted-development.md) — Copilot Skills for grids, data operations, and theming
Our community is active and always welcoming to new ideas. From 39f91b10ab2bde30b6baf24554aee7ad8f24beea Mon Sep 17 00:00:00 2001 From: zdrawku Date: Mon, 23 Feb 2026 14:34:46 +0200 Subject: [PATCH 23/39] fix(docs): correct formatting in AI-Assisted Development instructions --- .../general/ai-assisted-development.md | 36 +++++++++---------- 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 257e729801..50602a8bf8 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -32,16 +32,16 @@ GitHub Copilot reads custom instructions from a `.github/copilot-instructions.md 1. Create (or open) `.github/copilot-instructions.md` in your project root. 2. Add a reference or paste the relevant skill content into that file. For example: -```markdown -# Copilot Instructions + ```markdown + # Copilot Instructions -This project uses Ignite UI for Angular. Follow the guidelines in the skill files below: + This project uses Ignite UI for Angular. Follow the guidelines in the skill files below: -- Components & Layout: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-components/SKILL.md -- Data Grids: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md -- Grid Data Operations: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grid-data-operations/SKILL.md -- Theming & Styling: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md -``` + - Components & Layout: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-components/SKILL.md + - Data Grids: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md + - Grid Data Operations: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grid-data-operations/SKILL.md + - Theming & Styling: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md + ``` 3. Alternatively, paste the full content of the relevant `SKILL.md` files directly into `copilot-instructions.md` for fully offline, self-contained instructions. 4. Copilot will now apply these instructions automatically on every chat and inline suggestion in VS Code. @@ -53,12 +53,12 @@ Cursor supports persistent project rules through a `.cursorrules` file or the `. 1. Create `.cursorrules` in your project root (or `.cursor/rules/igniteui.md` for a named rule). 2. Paste the contents of the desired `SKILL.md` files into that file. For example: -``` -# Ignite UI for Angular Rules + ``` + # Ignite UI for Angular Rules - - -``` + + + ``` 3. Cursor will include these rules in every AI request automatically. You can also use the `@rules` mention in chat to reference a specific rule on demand. @@ -85,13 +85,13 @@ Claude Code supports a `CLAUDE.md` file at the project root as persistent agent 1. Create `CLAUDE.md` in your project root. 2. Paste the contents of the relevant `SKILL.md` files into it. For example: -```markdown -# Project Instructions + ```markdown + # Project Instructions -This project uses Ignite UI for Angular. Always follow these guidelines: + This project uses Ignite UI for Angular. Always follow these guidelines: - -``` + + ``` 3. Claude Code will automatically read `CLAUDE.md` at the start of every session. From 89ce7f7b225130728120f897b219e555ee1c4376 Mon Sep 17 00:00:00 2001 From: Simeon Simeonoff Date: Mon, 23 Feb 2026 15:20:47 +0200 Subject: [PATCH 24/39] docs(themes): include theming MCP topic --- .../general/ai-assisted-development.md | 2 +- en/components/themes/mcp.md | 344 ++++++++++++++++++ en/components/toc.yml | 5 +- 3 files changed, 349 insertions(+), 2 deletions(-) create mode 100644 en/components/themes/mcp.md diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 50602a8bf8..19b69323f6 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -151,7 +151,7 @@ Once you have the files, open them and load them into your AI assistant: The **Theming skill** includes setup instructions for the `igniteui-theming` MCP server, which gives AI assistants access to live theming tools such as palette generation and component theme scaffolding. See the [Theming skill file](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md) for configuration steps for VS Code, Cursor, Claude Desktop, and JetBrains IDEs. -For more information on theming, refer to the [Ignite UI for Angular Theming](../themes.md) documentation and the [How to Customize Theme](./how-to/how-to-customize-theme.md) walkthrough. +For more information on the Theming MCP, refer to the [Ignite UI Theming MCP](../themes/mcp.md) documentation. ## Additional Resources diff --git a/en/components/themes/mcp.md b/en/components/themes/mcp.md new file mode 100644 index 0000000000..737a05df4e --- /dev/null +++ b/en/components/themes/mcp.md @@ -0,0 +1,344 @@ +--- +title: Ignite UI Theming MCP | Ignite UI for Angular +_description: Ignite UI for Angular ships with the Ignite UI Theming MCP server that allows you to create custom themes, palettes, typography, and elevations for your Angular applications. Learn how to use the MCP server to generate and apply custom themes that match your brand and design requirements. +_keywords: Ignite UI for Angular, UI controls, Angular widgets, web widgets, UI widgets, Angular, Native Angular Components Suite, Native Angular Controls, Native Angular Components Library, Artificial Intelligence, AI, MCP, Model Context Protocol, Theming, Custom Themes, Palettes, Typography, Elevations +--- + +# Ignite UI Theming MCP + +

The Ignite UI Theming MCP is a Model Context Protocol (MCP) server that enables AI assistants to generate production-ready theming code for Ignite UI applications. MCP is an open standard that lets AI assistants call specialized tools provided by external servers. Connect the Ignite UI Theming MCP to your editor or desktop AI client and describe what you want — the assistant does the rest.

+ +
+ +## Overview + +Instead of writing Sass theming code by hand, you can describe your theming intent in plain language and let an AI assistant generate the correct code for you. The MCP server gives the AI the knowledge and tools it needs to produce accurate theming code — including palettes with proper shade generation, typography, elevations, component design token overrides, and more. + +The server supports all four Ignite UI design systems — **Material**, **Bootstrap**, **Fluent**, and **Indigo** — in both light and dark variants. While this guide focuses on Angular, the MCP server also works with **Ignite UI for Web Components**, **React**, and **Blazor**. The `detect_platform` tool reads your `package.json` and selects the correct import paths and selectors automatically. + +Most tools can produce either **Sass** or **CSS** output. Sass output is the default and integrates with the `igniteui-theming` Sass module. CSS output generates ready-to-use CSS custom properties and can be used **without a local Sass toolchain** — the server compiles it for you. + +**Example prompts to try once connected:** + +> _"Create a complete Material Design dark theme for my Angular app with primary #2563eb and coral secondary #f97316."_ + +> _"What design tokens are available for the button component? Customize it with my brand purple #8b5cf6."_ + +> _"My brand guidelines specify exact hex values for every primary shade — create a custom palette with those explicit values."_ + +> _"Make the calendar component use smaller spacing."_ + +## Prerequisites + +Before configuring the MCP server, make sure you have: + +- **Node.js** (v18 or later) installed — this provides the `npx` command used to launch the server. +- A project with an **Ignite UI package** listed as a dependency in `package.json`. For Angular, this is `igniteui-angular` (v15.0 or later). The server also supports `igniteui-webcomponents`, `igniteui-react`, and `igniteui-blazor`. +- An **AI client with MCP support** — for example, VS Code with GitHub Copilot, Cursor, Claude Desktop, Claude Code, or a JetBrains IDE with the AI Assistant plugin. + +If you do not have `igniteui-angular` installed yet, run: + +```bash +ng add igniteui-angular +``` + +## Setup + +The MCP server is bundled with the `igniteui-theming` package and launched via `npx`. No separate installation is needed beyond having an Ignite UI package already in your project. + +The canonical launch command is: + +```bash +npx -y igniteui-theming igniteui-theming-mcp +``` + +> [!NOTE] +> The `-y` flag tells `npx` to auto-confirm the package download prompt so the server can start without manual intervention. + +Choose your AI client below for the specific configuration steps. + +### VS Code + +GitHub Copilot in VS Code supports MCP servers through a workspace-level configuration file. Create or edit `.vscode/mcp.json` in your project root: + +```json +{ + "servers": { + "igniteui-theming": { + "command": "npx", + "args": ["-y", "igniteui-theming", "igniteui-theming-mcp"] + } + } +} +``` + +Once saved, open the GitHub Copilot chat panel, switch to **Agent** mode, and the Ignite UI Theming tools will be available. + +> [!NOTE] +> MCP support in VS Code requires GitHub Copilot and VS Code 1.99 or later. + +### Cursor + +Cursor supports project-scoped MCP configuration. Create or edit `.cursor/mcp.json` in your project root: + +```json +{ + "mcpServers": { + "igniteui-theming": { + "command": "npx", + "args": ["-y", "igniteui-theming", "igniteui-theming-mcp"] + } + } +} +``` + +The server will be picked up automatically when you open a new Cursor chat session. + +> [!NOTE] +> You can also configure MCP servers globally via **Settings → MCP** in Cursor. + +### Claude Desktop + +Add the server to your Claude Desktop configuration file: + +- **macOS**: `~/Library/Application Support/Claude/claude_desktop_config.json` +- **Windows**: `%APPDATA%\Claude\claude_desktop_config.json` + +```json +{ + "mcpServers": { + "igniteui-theming": { + "command": "npx", + "args": ["-y", "igniteui-theming", "igniteui-theming-mcp"] + } + } +} +``` + +Restart Claude Desktop after saving. You will see an MCP server indicator (slider icon) in the chat input area, confirming that MCP tools are active. + +### Claude Code + +Claude Code supports MCP servers through its CLI and a project-scoped `.mcp.json` file. To share the configuration with your team, create or edit `.mcp.json` in your project root: + +```json +{ + "mcpServers": { + "igniteui-theming": { + "command": "npx", + "args": ["-y", "igniteui-theming", "igniteui-theming-mcp"] + } + } +} +``` + +Alternatively, you can add the server via the command line for your local environment only: + +```bash +claude mcp add igniteui-theming -- npx -y igniteui-theming igniteui-theming-mcp +``` + +Use the `/mcp` command inside Claude Code to verify the server is connected. + +### JetBrains IDEs + +JetBrains AI Assistant supports MCP servers through the IDE settings: + +1. Open **Settings** (or **Preferences** on macOS). +2. Navigate to **Tools → AI Assistant → Model Context Protocol (MCP)**. +3. Click **+ Add** and choose **As JSON** or use the form fields. +4. Enter the following configuration: + +```json +{ + "mcpServers": { + "igniteui-theming": { + "command": "npx", + "args": ["-y", "igniteui-theming", "igniteui-theming-mcp"] + } + } +} +``` + +5. Click **OK** and restart the AI Assistant. + +> [!NOTE] +> MCP support requires the AI Assistant plugin to be installed and enabled in your JetBrains IDE. + +### Other MCP Clients + +For any other MCP-compatible client, use the STDIO transport with the following command and arguments: + +- **Command**: `npx` +- **Arguments**: `-y`, `igniteui-theming`, `igniteui-theming-mcp` + +## Customizing AI Behavior with Project Rules + +This section is optional. It is aimed at teams that want to fine-tune _how_ the AI generates theming code to match their existing codebase conventions. + +Editors like VS Code and Cursor let you provide project-level instruction files that shape how the AI behaves. The MCP server already teaches the AI _which tools to call and in what order_ — you do not need to repeat that. Instead, use these instruction files to encode your **project's design decisions, code conventions, and file organization** so the AI produces code that fits your codebase on the first try. + +### VS Code (`.github/copilot-instructions.md`) + +```markdown +## Theming Conventions + +### Sass Code Style +- Use `@use` / `@forward` — never `@import`. +- Extract repeated color values into Sass variables (e.g., `$brand-hover: #a78bfa`). +- Prefer setting primary design tokens over overriding many dependent tokens. + For example, setting `$foreground` on a flat button automatically derives + `$hover-background`, `$focus-background`, and `$active-background`. +- Keep component overrides scoped — use the component's default selector + (e.g., `.igx-button--flat`) unless a narrower scope is needed. +``` + +### Cursor (`.cursor/rules/theming.mdc`) + +```markdown +--- +description: Ignite UI for Angular theming conventions +globs: ["**/*.scss", "**/styles/**"] +--- + +## Project Theming Rules + +### Code conventions +- `@use` / `@forward` only — no `@import`. +- Extract shared colors into variables; do not repeat hex literals. +- Prefer primary tokens — let dependent tokens derive automatically. +- One component override per file. Name the file after the component. +- Comment every override with the design rationale. +- Never hard-code gray shades for text — use palette grays so dark mode works. +- For dark mode, only the palette changes. Component overrides stay the same. +``` + +> [!NOTE] +> Both files are committed to source control, so every team member gets the same AI behavior without manual setup. Adapt the brand colors, design system, and file paths to match your project. + +## Available Tools + +The MCP server exposes a set of tools that the AI uses automatically based on your prompts. You never need to call them directly — just describe what you want. + +To see the current full list of tools and their parameters at any time, ask your AI assistant: + +> _"What tools does the Ignite UI Theming MCP provide?"_ + +Here is a brief overview of each tool: + +| Tool | Description | +|------|-------------| +| `detect_platform` | Reads `package.json` and identifies whether the project uses Ignite UI for Angular, Web Components, React, or Blazor. Selects the correct import paths and component selectors for all subsequent tools. | +| `create_palette` | Generates a color palette with automatic shade variants (50–900, A100–A700) from your base brand colors. Accepts an `output` parameter (`sass` or `css`) and a `designSystem` to select the schema. | +| `create_custom_palette` | Fine-grained palette creation — specify exact hex values for every shade when automatic generation is not suitable. | +| `create_typography` | Sets up a font family and type scale for a given design system. | +| `create_elevations` | Configures box-shadow elevation levels (0–24) for Material or Indigo design systems. | +| `create_theme` | One-shot complete theme: palette + typography + elevations, ready to include in your `styles.scss`. Accepts a `designSystem` (`material`, `bootstrap`, `fluent`, or `indigo`) and `variant` (`light` or `dark`). | +| `set_size` | Sets `--ig-size` globally or for a specific component (`small`, `medium`, or `large`). | +| `set_spacing` | Sets `--ig-spacing` (and optionally inline/block overrides) globally or per component. | +| `set_roundness` | Sets `--ig-radius-factor` (0 = square, 1 = fully round) globally or per component. | +| `get_component_design_tokens` | Returns all available design tokens for a component — always call this before `create_component_theme`. | +| `create_component_theme` | Generates Sass or CSS to customize a component's tokens (colors, borders, etc.). Accepts a `variant` (`light` or `dark`) to select the correct schema. | +| `get_color` | Returns a CSS variable reference for a palette color, e.g. `var(--ig-primary-500)`. Supports optional contrast and opacity parameters. | +| `read_resource` | Reads built-in reference resources organized into four categories: platform configs (6), palette/typography/elevation presets (5), color guidance (7), and layout/spacing docs (8). | + +> [!NOTE] +> For compound components (e.g., `combo`, `select`, `grid`), `get_component_design_tokens` returns a list of related child themes instead of a flat token list. For example, querying `grid` may return child themes such as `grid`, `grid-toolbar`, `grid-filtering`, and `paginator`. The AI will generate a separate `create_component_theme` call for each child theme using the appropriate scoped selector. + +> [!NOTE] +> If your project uses the licensed `@infragistics/igniteui-angular` package, tell the AI so it can set the `licensed` parameter on palette, theme, and component tools. This adjusts the generated import paths accordingly. + +## Example Scenarios + +The following scenarios show what you can ask the AI to do once the MCP server is connected. + +### New Project Theme + +> _"I'm starting a new Angular project with Ignite UI. Create a complete Material Design light theme with primary #2563eb, secondary #f97316, and Roboto font."_ + +The AI will call `create_theme` and return a ready-to-use `styles.scss` file. The generated output will look similar to this: + +```scss +/* styles.scss */ +@use 'igniteui-angular/theming' as *; + +$my-palette: palette( + $primary: #2563eb, + $secondary: #f97316, + $surface: #fff, + $gray: #9e9e9e, +); + +$my-typography: typography( + $font-family: 'Roboto, sans-serif', +); + +@include core(); +@include typography($my-typography); +@include theme($my-palette, $schema: $light-material-schema); +``` + +### Dark Mode Variant + +> _"I need a dark mode version of my existing theme. Keep the same primary blue but use a dark surface #121212."_ + +### Brand-Exact Color Shades + +> _"Our design system specifies exact hex values for all 14 shades of our primary green. I'll paste the values — create a custom palette."_ + +The AI will call `create_custom_palette` with `mode: "explicit"` for the primary color and auto-generate the rest. See [Palettes](./palettes.md) for more detail on shade generation. + +### Component-Level Customization + +> _"Style the flat button with a purple background #8b5cf6 and white text, with a lighter purple #a78bfa on hover."_ + +The AI will call `get_component_design_tokens` first to discover valid token names, then call `create_component_theme` with the correct values. + +### Layout Adjustments + +> _"The calendar feels bloated — reduce its spacing, and make all components slightly smaller."_ + +The AI will call `set_spacing` scoped to the calendar component and `set_size` at the `:root` level. + +## Troubleshooting + +**Platform not detected** + +If `detect_platform` returns `null` or `generic`, make sure your `package.json` lists an Ignite UI package (e.g., `igniteui-angular`, `igniteui-webcomponents`) as a dependency. You can also tell the AI explicitly: _"Use the Angular platform."_ + +**Luminance warning on colors** + +If the AI warns about color luminance, it means the chosen color is too light or too dark for automatic shade generation to work well. Either pick a mid-range color or ask the AI to use `create_custom_palette` with explicit shade values instead. + +**Surface color mismatch** + +For light themes use a light surface (e.g., `#fafafa`). For dark themes use a dark surface (e.g., `#121212`). Mismatched surface colors cause the AI to emit a warning. + +**Generated Sass does not compile** + +Ensure `igniteui-angular` and `igniteui-theming` are installed: + +```bash +ng add igniteui-angular +``` + +Also confirm that `core()` is called before any other theming mixin in your `styles.scss`. See [Theming with Sass](./sass/index.md) for the correct file setup. + +## Additional Resources + +Related topics: + +- [Theming Overview](./index.md) +- [Palettes](./palettes.md) +- [Typography](./typography.md) +- [Elevations](./elevations.md) +- [Spacing](./spacing.md) +- [Roundness](./roundness.md) +- [Theming with Sass](./sass/index.md) + +
+ +Our community is active and always welcoming to new ideas. + +- [Ignite UI for Angular **Forums**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) +- [Ignite UI for Angular **GitHub**](https://github.com/IgniteUI/igniteui-angular) diff --git a/en/components/toc.yml b/en/components/toc.yml index 9ad030316f..d1c68e6814 100644 --- a/en/components/toc.yml +++ b/en/components/toc.yml @@ -1162,6 +1162,9 @@ href: display-density.md - name: Spacing href: themes/spacing.md + new: false +- name: Theming MCP + href: themes/mcp.md new: true - name: Sass new: false @@ -1216,7 +1219,7 @@ items: - name: Using Tailwind Custom Classes href: themes/misc/tailwind-classes.md - new: true + new: false - name: Printing styles href: themes/misc/printing-styles.md new: false From 508efd2b38b038cfcaf3d3d415ae451147d9fbd3 Mon Sep 17 00:00:00 2001 From: zdrawku Date: Mon, 23 Feb 2026 15:38:44 +0200 Subject: [PATCH 25/39] fix(docs): correct JSON formatting in MCP server configuration example --- en/components/themes/mcp.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/en/components/themes/mcp.md b/en/components/themes/mcp.md index 737a05df4e..5271ed2812 100644 --- a/en/components/themes/mcp.md +++ b/en/components/themes/mcp.md @@ -149,16 +149,16 @@ JetBrains AI Assistant supports MCP servers through the IDE settings: 3. Click **+ Add** and choose **As JSON** or use the form fields. 4. Enter the following configuration: -```json -{ - "mcpServers": { - "igniteui-theming": { - "command": "npx", - "args": ["-y", "igniteui-theming", "igniteui-theming-mcp"] + ```json + { + "mcpServers": { + "igniteui-theming": { + "command": "npx", + "args": ["-y", "igniteui-theming", "igniteui-theming-mcp"] + } + } } - } -} -``` + ``` 5. Click **OK** and restart the AI Assistant. From d66a29b08c1bb9f80fcc5d990ba09eb81491d0e0 Mon Sep 17 00:00:00 2001 From: Simeon Simeonoff Date: Mon, 23 Feb 2026 15:52:17 +0200 Subject: [PATCH 26/39] refactor(theming): add info on MCP version resolution --- en/components/themes/mcp.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/en/components/themes/mcp.md b/en/components/themes/mcp.md index 5271ed2812..f5f15e9327 100644 --- a/en/components/themes/mcp.md +++ b/en/components/themes/mcp.md @@ -55,6 +55,12 @@ npx -y igniteui-theming igniteui-theming-mcp > [!NOTE] > The `-y` flag tells `npx` to auto-confirm the package download prompt so the server can start without manual intervention. +### How version resolution works + +Because `igniteui-theming` is a dependency of `igniteui-angular`, it is already present in your `node_modules` after `npm install`. When you run the launch command above, `npx` detects the locally installed copy and runs it directly — no network request is made. This means the MCP server version always stays in sync with the rest of your Ignite UI packages. + +If you run the command outside a project (or before running `npm install`), `npx -y` downloads the **latest** version from npm into a temporary cache instead. The server will still start, but `detect_platform` will return `generic` since there is no `package.json` to inspect. + Choose your AI client below for the specific configuration steps. ### VS Code From d755613952d6d4be9387a7f162b04b676c6eb1e2 Mon Sep 17 00:00:00 2001 From: zdrawku Date: Mon, 23 Feb 2026 18:11:02 +0200 Subject: [PATCH 27/39] feat(docs): add instructions for using general Agent Skills configuration in AI-Assisted Development --- .../general/ai-assisted-development.md | 22 +++++++++++++++++++ 1 file changed, 22 insertions(+) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 19b69323f6..9344ef50a8 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -95,6 +95,28 @@ Claude Code supports a `CLAUDE.md` file at the project root as persistent agent 3. Claude Code will automatically read `CLAUDE.md` at the start of every session. +### General AI Agents + +Alternatively, one can use a general Agent Skills config so your Agent can easilly discover and load skills automatically on demand: + +1. Create a `.agents/skills/` directory in your project root. +2. Copy the skill directories from `igniteui-angular/skills/` repository into `.agents/skills/`: + + ``` + .agents/ + skills/ + igniteui-angular-components/ + igniteui-angular-grids/ + igniteui-angular-grid-data-operations/ + igniteui-angular-theming/ + ``` + +3. The Agent will now discover these skills and load the relevant one automatically based on the context of your request. + +> **Tip for VS Code:** VS Code searches for skills in `.github/skills/`, `.claude/skills/`, and `.agents/skills/` by default. You can configure additional locations using the `chat.agentSkillsLocations` setting. + +> **Tip:** VS Code searches for skills in `.github/skills/`, `.claude/skills/`, and `.agents/skills/` by default. You can configure additional locations using the `chat.agentSkillsLocations` setting. + --- ## Approach 2: Download and Load Skills Manually From ac9663d2705310e8a8832a36be9beb91167c83f5 Mon Sep 17 00:00:00 2001 From: zdrawku Date: Mon, 23 Feb 2026 18:14:53 +0200 Subject: [PATCH 28/39] fix(docs): update references from Copilot Skills to Agent Skills in AI-Assisted Development documentation --- .../general/ai-assisted-development.md | 31 ++++++++++++++++--- en/components/general/getting-started.md | 2 +- en/components/grid/grid.md | 2 +- .../hierarchicalgrid/hierarchical-grid.md | 2 +- en/components/pivotGrid/pivot-grid.md | 2 +- en/components/treegrid/tree-grid.md | 2 +- 6 files changed, 31 insertions(+), 10 deletions(-) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 9344ef50a8..51259b409b 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -1,12 +1,12 @@ --- -title: AI-Assisted Development | Copilot Skills | Ignite UI for Angular | Infragistics -_description: Learn how to use Copilot Skills to supercharge AI-assisted development with Ignite UI for Angular components, grids, data operations, and theming. +title: AI-Assisted Development | AI Skills | Ignite UI for Angular | Infragistics +_description: Learn how to use Agent Skills to supercharge AI-assisted development with Ignite UI for Angular components, grids, data operations, and theming. _keywords: ignite ui for angular, copilot skills, ai assisted development, github copilot, cursor, windsurf, claude, jetbrains ai --- # AI-Assisted Development -Ignite UI for Angular ships with **Copilot Skills** — structured knowledge files that teach AI coding assistants (GitHub Copilot, Cursor, Windsurf, Claude, JetBrains AI, etc.) how to work with Ignite UI for Angular. These skill files provide context-aware guidance on components, grids, data operations, and theming, enabling your AI assistant to generate accurate, idiomatic code that follows best practices. +Ignite UI for Angular ships with **Agent Skills** — structured knowledge files that teach AI coding assistants (GitHub Copilot, Cursor, Windsurf, Claude, JetBrains AI, etc.) how to work with Ignite UI for Angular. These skill files provide context-aware guidance on components, grids, data operations, and theming, enabling your AI assistant to generate accurate, idiomatic code that follows best practices. ## Available Skills @@ -125,7 +125,7 @@ Use this approach when you want to load a specific skill on demand, without perm ### Step 1: Get the Skill Files -**Option B — Download individual files** +**Option A — Download individual files** Each skill file can be downloaded directly from GitHub. Open the raw file URL in your browser and save it, or use `curl`: @@ -145,7 +145,28 @@ curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skill **Option B — Use the installed npm package** -If Ignite UI for Angular is already installed in your project, the skill files are available under `node_modules`: +If Ignite UI for Angular is already installed in your project, the skill files are available under `node_modules`. To copy them into your project (e.g. for use with General AI Agents under `.agents/skills/`), run: + +```bash +# macOS / Linux +cp -r node_modules/igniteui-angular/skills/. .agents/skills/ +``` + +```powershell +# Windows (PowerShell) +Copy-Item -Recurse node_modules\igniteui-angular\skills\* .agents\skills\ +``` + +Or copy individual skill directories as needed: + +```bash +cp -r node_modules/igniteui-angular/skills/igniteui-angular-components .agents/skills/ +cp -r node_modules/igniteui-angular/skills/igniteui-angular-grids .agents/skills/ +cp -r node_modules/igniteui-angular/skills/igniteui-angular-grid-data-operations .agents/skills/ +cp -r node_modules/igniteui-angular/skills/igniteui-angular-theming .agents/skills/ +``` + +The skill files are located at: ``` node_modules/igniteui-angular/skills/igniteui-angular-components/SKILL.md diff --git a/en/components/general/getting-started.md b/en/components/general/getting-started.md index 9242761837..2cd668c3b6 100644 --- a/en/components/general/getting-started.md +++ b/en/components/general/getting-started.md @@ -304,7 +304,7 @@ In this article we learned how to create our own Ignite UI for Angular applicati ## AI-Assisted Development -Ignite UI for Angular ships with **Copilot Skills** — structured knowledge files that teach AI coding assistants (GitHub Copilot, Cursor, Windsurf, Claude, JetBrains AI, etc.) how to work with the library. Skills cover components, data grids, grid data operations, and theming. +Ignite UI for Angular ships with **Agent Skills** — structured knowledge files that teach AI coding assistants (GitHub Copilot, Cursor, Windsurf, Claude, JetBrains AI, etc.) how to work with the library. Skills cover components, data grids, grid data operations, and theming. Learn more in the [AI-Assisted Development](ai-assisted-development.md) topic. diff --git a/en/components/grid/grid.md b/en/components/grid/grid.md index 9a36724d77..752d75d6ef 100644 --- a/en/components/grid/grid.md +++ b/en/components/grid/grid.md @@ -875,7 +875,7 @@ Learn more about creating an Angular data grid in our short tutorial video: - [Selection](selection.md) - [Column Data Types](column-types.md#default-template) - [Build CRUD operations with igxGrid](../general/how-to/how-to-perform-crud.md) -- [AI-Assisted Development](../general/ai-assisted-development.md) — Copilot Skills for grids, data operations, and theming +- [AI-Assisted Development](../general/ai-assisted-development.md) — Agent Skills for grids, data operations, and theming
Our community is active and always welcoming to new ideas. diff --git a/en/components/hierarchicalgrid/hierarchical-grid.md b/en/components/hierarchicalgrid/hierarchical-grid.md index 8ee29a9990..fdf760f285 100644 --- a/en/components/hierarchicalgrid/hierarchical-grid.md +++ b/en/components/hierarchicalgrid/hierarchical-grid.md @@ -431,7 +431,7 @@ platformBrowserDynamic() - [Column Pinning](column-pinning.md) - [Column Resizing](column-resizing.md) - [Selection](selection.md) -- [AI-Assisted Development](../general/ai-assisted-development.md) — Copilot Skills for grids, data operations, and theming +- [AI-Assisted Development](../general/ai-assisted-development.md) — Agent Skills for grids, data operations, and theming
Our community is active and always welcoming to new ideas. diff --git a/en/components/pivotGrid/pivot-grid.md b/en/components/pivotGrid/pivot-grid.md index 36830153ec..b75cb2bd97 100644 --- a/en/components/pivotGrid/pivot-grid.md +++ b/en/components/pivotGrid/pivot-grid.md @@ -346,7 +346,7 @@ This feature allows developers to quickly create a pivot view without manually s - [Angular Pivot Grid Features](pivot-grid-features.md) - [Angular Pivot Grid Custom Aggregations](pivot-grid-custom.md) -- [AI-Assisted Development](../general/ai-assisted-development.md) — Copilot Skills for grids, data operations, and theming +- [AI-Assisted Development](../general/ai-assisted-development.md) — Agent Skills for grids, data operations, and theming
Our community is active and always welcoming to new ideas. diff --git a/en/components/treegrid/tree-grid.md b/en/components/treegrid/tree-grid.md index 0c03b8e977..71f12a48fe 100644 --- a/en/components/treegrid/tree-grid.md +++ b/en/components/treegrid/tree-grid.md @@ -406,7 +406,7 @@ platformBrowserDynamic() - [Grid Sizing](sizing.md) - [Data Grid](../grid/grid.md) - [Row Editing](row-editing.md) -- [AI-Assisted Development](../general/ai-assisted-development.md) — Copilot Skills for grids, data operations, and theming +- [AI-Assisted Development](../general/ai-assisted-development.md) — Agent Skills for grids, data operations, and theming
Our community is active and always welcoming to new ideas. From 7da648a0cced399b5deb8bc685d753af73f2331b Mon Sep 17 00:00:00 2001 From: zdrawku Date: Mon, 23 Feb 2026 18:15:38 +0200 Subject: [PATCH 29/39] Merge branch 'zkolev/update-getting-started' of https://github.com/IgniteUI/igniteui-docfx into zkolev/update-getting-started From f44515ee9fb90b98357a75e2b567a7862004517d Mon Sep 17 00:00:00 2001 From: zdrawku Date: Mon, 23 Feb 2026 18:27:12 +0200 Subject: [PATCH 30/39] fix(docs): correct spelling of "easily" --- en/components/general/ai-assisted-development.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 51259b409b..85a0fdc161 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -97,7 +97,7 @@ Claude Code supports a `CLAUDE.md` file at the project root as persistent agent ### General AI Agents -Alternatively, one can use a general Agent Skills config so your Agent can easilly discover and load skills automatically on demand: +Alternatively, one can use a general Agent Skills config so your Agent can easily discover and load skills automatically on demand: 1. Create a `.agents/skills/` directory in your project root. 2. Copy the skill directories from `igniteui-angular/skills/` repository into `.agents/skills/`: From b9797b7cd2190938af133db37999787d766ce0cb Mon Sep 17 00:00:00 2001 From: Maria Tsvyatkova Date: Tue, 24 Feb 2026 09:46:59 +0200 Subject: [PATCH 31/39] fix(dockmanager): use defineComponents (#6379) --- en/components/dock-manager.md | 6 +-- jp/components/dock-manager.md | 6 +-- kr/components/dock-manager.md | 77 +++++++++++++++++++++++++++++++++++ kr/components/toc.yml | 5 +++ 4 files changed, 88 insertions(+), 6 deletions(-) create mode 100644 kr/components/dock-manager.md diff --git a/en/components/dock-manager.md b/en/components/dock-manager.md index ca9dc75dfa..84ef4f7b45 100644 --- a/en/components/dock-manager.md +++ b/en/components/dock-manager.md @@ -45,11 +45,11 @@ import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; export class AppModule {} ``` -Next, one should call the `defineCustomElements()` function in the `main.ts` file: +Next, one should call the `defineComponents()` function in the `main.ts` file: ```typescript import { AppModule } from './app/app.module'; -import { defineCustomElements } from 'igniteui-dockmanager/loader'; +import { defineComponents } from 'igniteui-dockmanager'; import { enableProdMode } from '@angular/core'; import { environment } from '.environments/environment'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; @@ -61,7 +61,7 @@ if (environment.production) { platformBrowserDynamic().bootstrapModule(AppModule) .catch(err => console.log(err)); -defineCustomElements(); +defineComponents(IgcDockManagerComponent); ``` This is it, you are now ready to use the Dock Manager component in an Angular component template. To do so simply use its tag name: diff --git a/jp/components/dock-manager.md b/jp/components/dock-manager.md index a7313ffd9d..e8960dc63a 100644 --- a/jp/components/dock-manager.md +++ b/jp/components/dock-manager.md @@ -45,11 +45,11 @@ import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; export class AppModule {} ``` -`main.ts` ファイルの `defineCustomElements()` 関数を呼び出します。 +`main.ts` ファイルの `defineComponents()` 関数を呼び出します。 ```typescript import { AppModule } from './app/app.module'; -import { defineCustomElements } from 'igniteui-dockmanager/loader'; +import { defineComponents } from 'igniteui-dockmanager'; import { enableProdMode } from '@angular/core'; import { environment } from '.environments/environment'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; @@ -61,7 +61,7 @@ if (environment.production) { platformBrowserDynamic().bootstrapModule(AppModule) .catch(err => console.log(err)); -defineCustomElements(); +defineComponents(IgcDockManagerComponent); ``` Angular コンポーネント テンプレートで Dock Manager コンポーネントを使用する準備ができました。タグ名を使用します。 diff --git a/kr/components/dock-manager.md b/kr/components/dock-manager.md new file mode 100644 index 0000000000..52fa115dad --- /dev/null +++ b/kr/components/dock-manager.md @@ -0,0 +1,77 @@ +--- +title: Manage Angular Page Layout | Dock Manager | Ignite UI | Infragistics +_description: Learn how the Dock Manager lets you customize the layout of your Angular application via panes that can be pinned, resized, moved, and hidden. +_keywords: manage angular page layout, Ignite UI for Angular, Infragistics +_license: commercial +_language: kr +--- + +# Dock Manager + +The Ignite UI Dock Manager component provides means to manage the layout of your application through panes, allowing your end-users to customize it further by pinning, resizing, moving and hiding panes. + +## Angular Dock Manager Example + + + + + + +
+ + +## Usage + +The Dock Manager is a standard [web component](https://developer.mozilla.org/en-US/docs/Web/Web_Components) and as such can be used in an Angular application. + +Follow the steps below to add the Dock Manager package to your Angular project and set it up in order to use the component. + +First, install the `igniteui-dockmanager` package + +```cmd +npm install igniteui-dockmanager +``` + +Then, include the `CUSTOM_ELEMENTS_SCHEMA` schema in the `AppModule`: + +```typescript +import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; + +@NgModule({ + ... + schemas: [CUSTOM_ELEMENTS_SCHEMA] +}) +export class AppModule {} +``` + +Next, one should call the `defineComponents()` function in the `main.ts` file: + +```typescript +import { AppModule } from './app/app.module'; +import { defineComponents } from 'igniteui-dockmanager'; +import { enableProdMode } from '@angular/core'; +import { environment } from '.environments/environment'; +import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; + +if (environment.production) { + enableProdMode(); +} + +platformBrowserDynamic().bootstrapModule(AppModule) + .catch(err => console.log(err)); + +defineComponents(IgcDockManagerComponent); +``` + +This is it, you are now ready to use the Dock Manager component in an Angular component template. To do so simply use its tag name: + +```html + + +``` + +For further information on the usage of the Dock Manager component, you can check out [this topic]({environment:infragisticsBaseUrl}/products/ignite-ui-web-components/web-components/components/dock-manager.html). + +For a more advanced example of the usage of the Dock Manager component with panes hosting various Ignite UI for Angular components, see this version of the [data analysis sample](./general/data-analysis.md#data-analysis-with-dockmanager). diff --git a/kr/components/toc.yml b/kr/components/toc.yml index 0b9be62314..0b753cfaca 100644 --- a/kr/components/toc.yml +++ b/kr/components/toc.yml @@ -892,6 +892,11 @@ - name: Expansion Panel href: expansion-panel.md new: true +- name: Dock Manager + href: dock-manager.md + new: false + updated: false + premium: true - name: Notifications header: true - name: Banner From dcc3e0990925f2e4ee19c1b51d2dc288eb7b8cdb Mon Sep 17 00:00:00 2001 From: zdrawku Date: Tue, 24 Feb 2026 12:14:30 +0200 Subject: [PATCH 32/39] feat(docs): add platform-specific instructions for copying skill files in AI-Assisted Development --- .../general/ai-assisted-development.md | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 85a0fdc161..9629144312 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -159,6 +159,8 @@ Copy-Item -Recurse node_modules\igniteui-angular\skills\* .agents\skills\ Or copy individual skill directories as needed: +**macOS / Linux** + ```bash cp -r node_modules/igniteui-angular/skills/igniteui-angular-components .agents/skills/ cp -r node_modules/igniteui-angular/skills/igniteui-angular-grids .agents/skills/ @@ -166,6 +168,24 @@ cp -r node_modules/igniteui-angular/skills/igniteui-angular-grid-data-operations cp -r node_modules/igniteui-angular/skills/igniteui-angular-theming .agents/skills/ ``` +**Windows (PowerShell)** + +```powershell +Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-components .agents\skills\ +Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-grids .agents\skills\ +Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-grid-data-operations .agents\skills\ +Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-theming .agents\skills\ +``` + +**Windows (Command Prompt)** + +```cmd +xcopy /E /I node_modules\igniteui-angular\skills\igniteui-angular-components .agents\skills\igniteui-angular-components +xcopy /E /I node_modules\igniteui-angular\skills\igniteui-angular-grids .agents\skills\igniteui-angular-grids +xcopy /E /I node_modules\igniteui-angular\skills\igniteui-angular-grid-data-operations .agents\skills\igniteui-angular-grid-data-operations +xcopy /E /I node_modules\igniteui-angular\skills\igniteui-angular-theming .agents\skills\igniteui-angular-theming +``` + The skill files are located at: ``` From 92052cfd3dc10e795ea0334e607bfdf85c349d3f Mon Sep 17 00:00:00 2001 From: zdrawku Date: Tue, 24 Feb 2026 12:18:25 +0200 Subject: [PATCH 33/39] fix(docs): consolidate Data Grids and Grid Data Operations skills into a single entry in AI-Assisted Development documentation --- .../general/ai-assisted-development.md | 36 +++++++++++-------- 1 file changed, 22 insertions(+), 14 deletions(-) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 9629144312..6a0ccd969f 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -15,8 +15,7 @@ The skill files live in the [`skills/`](https://github.com/IgniteUI/igniteui-ang | Skill | Path | Description | |:------|:-----|:------------| | Components & Layout | [`skills/igniteui-angular-components/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-components/SKILL.md) | Standalone components, form controls, overlays, layout | -| Data Grids | [`skills/igniteui-angular-grids/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md) | Grid, Tree Grid, Hierarchical Grid, Pivot Grid | -| Grid Data Operations | [`skills/igniteui-angular-grid-data-operations/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grid-data-operations/SKILL.md) | Sorting, filtering, grouping, paging, remote data, state management | +| Data Grids | [`skills/igniteui-angular-grids/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md) | Grid, Tree Grid, Hierarchical Grid, Pivot Grid, sorting, filtering, grouping, paging, remote data | | Theming & Styling | [`skills/igniteui-angular-theming/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md) | Palettes, typography, elevations, component themes, MCP server | There are two ways to use skills with your AI assistant: [create a persistent IDE agent](#approach-1-create-a-persistent-ide-agent) that always applies them automatically, or [download and load them manually](#approach-2-download-and-load-skills-manually) into your preferred IDE on demand. @@ -39,7 +38,6 @@ GitHub Copilot reads custom instructions from a `.github/copilot-instructions.md - Components & Layout: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-components/SKILL.md - Data Grids: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md - - Grid Data Operations: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grid-data-operations/SKILL.md - Theming & Styling: https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md ``` @@ -107,7 +105,6 @@ Alternatively, one can use a general Agent Skills config so your Agent can easil skills/ igniteui-angular-components/ igniteui-angular-grids/ - igniteui-angular-grid-data-operations/ igniteui-angular-theming/ ``` @@ -119,13 +116,13 @@ Alternatively, one can use a general Agent Skills config so your Agent can easil --- -## Approach 2: Download and Load Skills Manually +## Approach 2: Download and Load the Skills Use this approach when you want to load a specific skill on demand, without permanently modifying project configuration files. ### Step 1: Get the Skill Files -**Option A — Download individual files** +#### **Option A — Download individual files** Each skill file can be downloaded directly from GitHub. Open the raw file URL in your browser and save it, or use `curl`: @@ -136,14 +133,11 @@ curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skill # Data Grids curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-grids/SKILL.md -# Grid Data Operations -curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-grid-data-operations/SKILL.md - # Theming & Styling curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-theming/SKILL.md ``` -**Option B — Use the installed npm package** +#### **Option B — Use the installed npm package** If Ignite UI for Angular is already installed in your project, the skill files are available under `node_modules`. To copy them into your project (e.g. for use with General AI Agents under `.agents/skills/`), run: @@ -164,7 +158,6 @@ Or copy individual skill directories as needed: ```bash cp -r node_modules/igniteui-angular/skills/igniteui-angular-components .agents/skills/ cp -r node_modules/igniteui-angular/skills/igniteui-angular-grids .agents/skills/ -cp -r node_modules/igniteui-angular/skills/igniteui-angular-grid-data-operations .agents/skills/ cp -r node_modules/igniteui-angular/skills/igniteui-angular-theming .agents/skills/ ``` @@ -173,7 +166,6 @@ cp -r node_modules/igniteui-angular/skills/igniteui-angular-theming .agents/skil ```powershell Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-components .agents\skills\ Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-grids .agents\skills\ -Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-grid-data-operations .agents\skills\ Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-theming .agents\skills\ ``` @@ -182,7 +174,6 @@ Copy-Item -Recurse node_modules\igniteui-angular\skills\igniteui-angular-theming ```cmd xcopy /E /I node_modules\igniteui-angular\skills\igniteui-angular-components .agents\skills\igniteui-angular-components xcopy /E /I node_modules\igniteui-angular\skills\igniteui-angular-grids .agents\skills\igniteui-angular-grids -xcopy /E /I node_modules\igniteui-angular\skills\igniteui-angular-grid-data-operations .agents\skills\igniteui-angular-grid-data-operations xcopy /E /I node_modules\igniteui-angular\skills\igniteui-angular-theming .agents\skills\igniteui-angular-theming ``` @@ -191,10 +182,27 @@ The skill files are located at: ``` node_modules/igniteui-angular/skills/igniteui-angular-components/SKILL.md node_modules/igniteui-angular/skills/igniteui-angular-grids/SKILL.md -node_modules/igniteui-angular/skills/igniteui-angular-grid-data-operations/SKILL.md node_modules/igniteui-angular/skills/igniteui-angular-theming/SKILL.md ``` +#### **Option C — Use the `npx skills` CLI** + +The `skills` CLI is an interactive tool that downloads and installs skills directly into your project. Run the following command in your project root: + +```bash +npx skills add IgniteUI/igniteui-angular +``` + +The CLI will guide you through a series of prompts to: + +1. Select which skills to install (components, grids, and theming). +2. Choose the target location for the skill files in your project (e.g. `.agents/skills/`, `.github/skills/`). +3. Download and write the selected skill files automatically. + +Once complete, the skills are ready to use — no manual file copying required. + +> **Note:** Requires Node.js and an internet connection. The command fetches the latest skill files from the [IgniteUI/igniteui-angular](https://github.com/IgniteUI/igniteui-angular) repository. + ### Step 2: Load the Skill into Your IDE Once you have the files, open them and load them into your AI assistant: From 178e8443faa87c6bf40580e1465d9bfcbb673d03 Mon Sep 17 00:00:00 2001 From: Stamen Stoychev Date: Tue, 24 Feb 2026 14:53:07 +0200 Subject: [PATCH 34/39] chore(*): fixing in-topic link --- en/components/general/ai-assisted-development.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 6a0ccd969f..14a0ec148e 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -18,7 +18,7 @@ The skill files live in the [`skills/`](https://github.com/IgniteUI/igniteui-ang | Data Grids | [`skills/igniteui-angular-grids/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md) | Grid, Tree Grid, Hierarchical Grid, Pivot Grid, sorting, filtering, grouping, paging, remote data | | Theming & Styling | [`skills/igniteui-angular-theming/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md) | Palettes, typography, elevations, component themes, MCP server | -There are two ways to use skills with your AI assistant: [create a persistent IDE agent](#approach-1-create-a-persistent-ide-agent) that always applies them automatically, or [download and load them manually](#approach-2-download-and-load-skills-manually) into your preferred IDE on demand. +There are two ways to use skills with your AI assistant: [create a persistent IDE agent](#approach-1-create-a-persistent-ide-agent) that always applies them automatically, or [download and load them manually](#approach-2-download-and-load-the-skills) into your preferred IDE on demand. ## Approach 1: Create a Persistent IDE Agent From ef961db5ce8963b7bd27a8cfd2dd639401520840 Mon Sep 17 00:00:00 2001 From: Stamen Stoychev Date: Tue, 24 Feb 2026 16:03:41 +0200 Subject: [PATCH 35/39] fix(toc): moving ai content in its own section --- en/components/toc.yml | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/en/components/toc.yml b/en/components/toc.yml index d1c68e6814..04882fc734 100644 --- a/en/components/toc.yml +++ b/en/components/toc.yml @@ -1,3 +1,10 @@ +- name: AI-Assisted Development + href: general/ai-assisted-development.md + new: true + header: true +- name: Theming MCP + href: themes/mcp.md + new: true - name: General header: true sortable: true @@ -53,9 +60,6 @@ - name: Use Standalone Components href: general/how-to/how-to-use-standalone-components.md updated: false -- name: AI-Assisted Development - href: general/ai-assisted-development.md - new: true - name: Angular Schematics & Ignite UI CLI href: general/cli-overview.md sortable: false @@ -1163,9 +1167,6 @@ - name: Spacing href: themes/spacing.md new: false -- name: Theming MCP - href: themes/mcp.md - new: true - name: Sass new: false items: From f030274ae72a51aa4faaefa4bdafd30bf1a50c4f Mon Sep 17 00:00:00 2001 From: Rumyana Andriova <54146583+randriova@users.noreply.github.com> Date: Tue, 24 Feb 2026 16:07:10 +0200 Subject: [PATCH 36/39] docs(*): JA - update PDF exporter entry #6370 --- jp/components/exporter-pdf.md | 32 ++++++++++++++++---------------- jp/components/toc.yml | 3 ++- 2 files changed, 18 insertions(+), 17 deletions(-) diff --git a/jp/components/exporter-pdf.md b/jp/components/exporter-pdf.md index 5a998f6773..e8d5368750 100644 --- a/jp/components/exporter-pdf.md +++ b/jp/components/exporter-pdf.md @@ -101,7 +101,7 @@ this.pdfExportService.export(this.igxGrid1, new IgxPdfExporterOptions('ExportedD - **pageSize**: ページ サイズ (`a3`、`a4`、`a5`、`letter`、`legal` など) を指定します。デフォルトは `a4` です。 - **showTableBorders**: テーブルの境界線を表示するかどうかを決定します。デフォルトは `true` です。 - **fontSize**: テーブル コンテンツのフォント サイズを設定します。デフォルトは `10` です。 -- **customFont**: Specifies a custom TrueType font (TTF) for Unicode character support. Required when exporting data containing non-Latin characters. +- **customFont**: Unicode 文字サポート用のカスタム TrueType フォント (TTF) を指定します。ラテン文字以外の文字を含むデータをエクスポートする場合に必要です。 次の例は、これらのオプションを構成する方法を示しています。 @@ -119,15 +119,15 @@ public exportButtonHandler() { } ``` -### Custom Font Configuration for Unicode Support +### Unicode サポート用のカスタム フォント構成 -By default, the PDF exporter uses the built-in Helvetica font, which only supports basic Latin characters. If your data contains non-Latin characters (such as Cyrillic, Chinese, Japanese, Arabic, Hebrew, or special symbols), you must provide a custom TrueType font (TTF) using the `customFont` property. +デフォルトでは、PDF エクスポーターは組み込みの Helvetica フォントを使用します。このフォントは基本的なラテン文字のみをサポートしています。データにラテン文字以外の文字 (キリル文字、中国語、日本語、アラビア語、ヘブライ語、特殊記号など) が含まれている場合は、`customFont` プロパティを使用してカスタム TrueType フォント (TTF) を提供する必要があります。 -The font data must be provided as a Base64-encoded string of the TTF file contents. You can optionally provide a separate bold variant for header styling. +フォント データは、TTF ファイルの内容を Base64 エンコードした文字列として提供する必要があります。ヘッダーのスタイル設定用に、別途太字バリアントを提供することもできます。 -#### Converting TTF Files to Base64 +#### TTF ファイルを Base64 に変換 -To convert a TTF file to Base64, use Node.js: +TTF ファイルを Base64 に変換するには、Node.js を使用します: ```javascript const fs = require('fs'); @@ -136,9 +136,9 @@ const base64 = fontData.toString('base64'); fs.writeFileSync('font-base64.ts', `export const MY_FONT = '${base64}';`); ``` -Alternatively, you can use an online Base64 encoder tool to convert your TTF file. +または、オンラインの Base64 エンコーダー ツールを使用して TTF ファイルを変換することもできます。 -#### Example: Basic Custom Font Usage +#### 例: 基本的なカスタム フォントの使用方法 ```typescript // fonts/noto-sans.ts @@ -158,7 +158,7 @@ public exportButtonHandler() { } ``` -#### Example: Custom Font with Bold Variant +#### 例: 太字バリアント付きカスタム フォント ```typescript // fonts/noto-sans.ts @@ -183,20 +183,20 @@ public exportButtonHandler() { } ``` -#### Recommended Fonts for Unicode Support +#### Unicode サポートの推奨フォント -The following fonts provide excellent Unicode coverage: +以下のフォントは優れた Unicode カバレッジを提供します: -- **Noto Sans**: Covers most Unicode scripts — [Google Fonts](https://fonts.google.com/noto/specimen/Noto+Sans) -- **Arial Unicode MS**: Comprehensive Unicode character support -- **Source Han Sans**: Excellent CJK (Chinese, Japanese, Korean) support +- **Noto Sans**: ほとんどの Unicode スクリプトをカバー - [Google Fonts](https://fonts.google.com/noto/specimen/Noto+Sans) +- **Arial Unicode MS**: 包括的な Unicode 文字サポート +- **Source Han Sans**: 優れた CJK (中国語、日本語、韓国語) サポート -### Demo +### デモ + iframe-src="{environment:demosBaseUrl}/services/export-pdf-custom-font/" alt="Angular PDF エクスポーター カスタム フォントの例">
diff --git a/jp/components/toc.yml b/jp/components/toc.yml index 1b54f30e02..8f52e60c52 100644 --- a/jp/components/toc.yml +++ b/jp/components/toc.yml @@ -1457,7 +1457,8 @@ premium: true - name: PDF エクスポーター href: exporter-pdf.md - new: true + new: false + updated: true premium: true - name: トランザクション サービス href: transaction.md From d5a5c6d12dc0238f7c5cfb6f2e404eb197c6f0c0 Mon Sep 17 00:00:00 2001 From: zdrawku Date: Tue, 24 Feb 2026 17:35:16 +0200 Subject: [PATCH 37/39] feat(docs): update AI skills installation instructions with new CLI options --- .../general/ai-assisted-development.md | 41 +++++++++++++++++-- 1 file changed, 38 insertions(+), 3 deletions(-) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index 14a0ec148e..eb61dae36c 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -124,9 +124,15 @@ Use this approach when you want to load a specific skill on demand, without perm #### **Option A — Download individual files** -Each skill file can be downloaded directly from GitHub. Open the raw file URL in your browser and save it, or use `curl`: +Each skill file can be downloaded directly from GitHub. First, create the `.agents/skills/` directory in your project root, then download the files into it: ```bash +# Create the .agents/skills directory +mkdir -p .agents/skills + +# Download skill files into .agents/skills/ +cd .agents/skills + # Components & Layout curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-components/SKILL.md @@ -137,7 +143,36 @@ curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skill curl -O https://raw.githubusercontent.com/IgniteUI/igniteui-angular/master/skills/igniteui-angular-theming/SKILL.md ``` -#### **Option B — Use the installed npm package** +The skill files will now be available in `.agents/skills/` and will be automatically discovered by compatible AI assistants. + + +#### **Option B — Use the `gemini skills` CLI** + +The `gemini skills install` command installs skills directly from a Git repository. It supports two scopes: + +- **User scope** (default) — installs skills globally for your user account, making them available across all projects. Skills are placed in `~/.gemini/skills/` or `~/.agents/skills/`. +- **Workspace scope** — installs skills locally into the current project directory under `.agents/skills/`, scoping them to that project only. + +**Install to user scope (default):** + +```bash +gemini skills install https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-components +gemini skills install https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-grids +gemini skills install https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-theming +``` + +**Install to workspace scope:** + +```bash +gemini skills install --scope workspace https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-components +gemini skills install --scope workspace https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-grids +gemini skills install --scope workspace https://github.com/IgniteUI/igniteui-angular.git --path skills/igniteui-angular-theming +``` + +Once installed, the skill files are available in the respective location and will be automatically discovered by compatible AI assistants. + + +#### **Option C — Use the installed npm package** If Ignite UI for Angular is already installed in your project, the skill files are available under `node_modules`. To copy them into your project (e.g. for use with General AI Agents under `.agents/skills/`), run: @@ -185,7 +220,7 @@ node_modules/igniteui-angular/skills/igniteui-angular-grids/SKILL.md node_modules/igniteui-angular/skills/igniteui-angular-theming/SKILL.md ``` -#### **Option C — Use the `npx skills` CLI** +#### **Option D — Use the `npx skills` CLI** The `skills` CLI is an interactive tool that downloads and installs skills directly into your project. Run the following command in your project root: From 95251eaa16b81ef465a7ca62bf757871ebaf8dc5 Mon Sep 17 00:00:00 2001 From: zdrawku Date: Tue, 24 Feb 2026 18:04:21 +0200 Subject: [PATCH 38/39] feat(docs): add note on automatic skill discovery in Ignite UI for Angular 21.1.0 --- en/components/general/ai-assisted-development.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/en/components/general/ai-assisted-development.md b/en/components/general/ai-assisted-development.md index eb61dae36c..d03639abc6 100644 --- a/en/components/general/ai-assisted-development.md +++ b/en/components/general/ai-assisted-development.md @@ -18,6 +18,8 @@ The skill files live in the [`skills/`](https://github.com/IgniteUI/igniteui-ang | Data Grids | [`skills/igniteui-angular-grids/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-grids/SKILL.md) | Grid, Tree Grid, Hierarchical Grid, Pivot Grid, sorting, filtering, grouping, paging, remote data | | Theming & Styling | [`skills/igniteui-angular-theming/SKILL.md`](https://github.com/IgniteUI/igniteui-angular/blob/master/skills/igniteui-angular-theming/SKILL.md) | Palettes, typography, elevations, component themes, MCP server | +> **Note:** Starting with Ignite UI for Angular **21.1.0**, these skills are automatically discovered when placed in your agent's skills path (e.g., `.claude/skills`, `.agents/skills`, `.cursor/rules/`). This release ships with an optional migration to add these skills to your project automatically. + There are two ways to use skills with your AI assistant: [create a persistent IDE agent](#approach-1-create-a-persistent-ide-agent) that always applies them automatically, or [download and load them manually](#approach-2-download-and-load-the-skills) into your preferred IDE on demand. ## Approach 1: Create a Persistent IDE Agent From 62061bf279a3b36a8a6327044769abb283e8c9f2 Mon Sep 17 00:00:00 2001 From: zdrawku Date: Tue, 24 Feb 2026 18:04:44 +0200 Subject: [PATCH 39/39] Merge branch 'zkolev/update-getting-started' of https://github.com/IgniteUI/igniteui-docfx into zkolev/update-getting-started