From f4a4437e3421890479b8ccef4a7f0609e1aa1ed6 Mon Sep 17 00:00:00 2001 From: desig9stein Date: Wed, 27 May 2026 18:01:53 +0300 Subject: [PATCH 1/7] feat(components): add new Feature, CtaArea, and DownloadCard components with styles --- docs/angular/astro.config.ts | 12 +- .../ai/ai-assisted-development-overview.mdx | 2 - .../src/content/en/components/grid/grid.mdx | 4 +- .../content/en/components/grids-and-lists.mdx | 410 ++---------- .../jp/components/general/getting-started.mdx | 18 +- .../content/jp/components/grids-and-lists.mdx | 267 ++------ docs/xplat/astro.config.ts | 16 +- .../en/components/general-getting-started.mdx | 18 +- .../en/components/grids/grids-header.mdx | 628 +++++------------- .../src/content/en/components/grids/grids.mdx | 62 +- .../en/components/layouts/expansion-panel.mdx | 10 +- .../content/en/components/nextjs-usage.mdx | 18 +- .../jp/components/general-getting-started.mdx | 18 +- .../jp/components/grids/grids-header.mdx | 306 ++++----- .../src/content/jp/components/grids/grids.mdx | 56 +- .../content/jp/components/nextjs-usage.mdx | 18 +- src/assets/chrome.svg | 1 + src/assets/edge.svg | 1 + src/assets/firefox.svg | 1 + src/assets/safari.svg | 1 + src/components/mdx/CtaArea/CtaArea.astro | 53 ++ src/components/mdx/CtaArea/CtaArea.scss | 178 +++++ .../mdx/FaqAccordion/FaqAccordion.astro | 31 + .../mdx/FaqAccordion/FaqAccordion.scss | 4 + src/components/mdx/Feature/Feature.astro | 29 + src/components/mdx/Feature/Feature.scss | 80 +++ .../mdx/FeatureList/FeatureList.astro | 7 + .../mdx/FeatureList/FeatureList.scss | 7 + src/components/mdx/cards/DownloadCard.astro | 19 + src/components/mdx/cards/DownloadCard.scss | 39 ++ .../mdx/cards/DownloadCardGroup.astro | 7 + .../mdx/cards/DownloadCardGroup.scss | 8 + src/integration.ts | 7 +- src/styles/ig-theme.scss | 6 + 34 files changed, 991 insertions(+), 1351 deletions(-) create mode 100644 src/assets/chrome.svg create mode 100644 src/assets/edge.svg create mode 100644 src/assets/firefox.svg create mode 100644 src/assets/safari.svg create mode 100644 src/components/mdx/CtaArea/CtaArea.astro create mode 100644 src/components/mdx/CtaArea/CtaArea.scss create mode 100644 src/components/mdx/FaqAccordion/FaqAccordion.astro create mode 100644 src/components/mdx/FaqAccordion/FaqAccordion.scss create mode 100644 src/components/mdx/Feature/Feature.astro create mode 100644 src/components/mdx/Feature/Feature.scss create mode 100644 src/components/mdx/FeatureList/FeatureList.astro create mode 100644 src/components/mdx/FeatureList/FeatureList.scss create mode 100644 src/components/mdx/cards/DownloadCard.astro create mode 100644 src/components/mdx/cards/DownloadCard.scss create mode 100644 src/components/mdx/cards/DownloadCardGroup.astro create mode 100644 src/components/mdx/cards/DownloadCardGroup.scss diff --git a/docs/angular/astro.config.ts b/docs/angular/astro.config.ts index 5b3cdc1cc3..c3215eae83 100644 --- a/docs/angular/astro.config.ts +++ b/docs/angular/astro.config.ts @@ -85,7 +85,17 @@ export default createDocsSite({ { tag: 'link', attrs: { rel: 'icon', href: `${mode !== 'development' ? base : ''}/favicon.ico`, type: 'image/x-icon' } }, ], sidebar: { exclude: [/^internal\//] }, - integrations: [mdx()], + integrations: [ + mdx(), + { + name: 'watch-docs-template', + hooks: { + 'astro:server:setup': ({ server }) => { + server.watcher.add(path.resolve(__dirname, '../../src')); + }, + }, + }, + ], // Expose @/ alias so MDX files can import Sample.astro and peer components. // @xplat-images resolves xplat-sourced MDX image imports to the angular images dir. vite: { diff --git a/docs/angular/src/content/en/components/ai/ai-assisted-development-overview.mdx b/docs/angular/src/content/en/components/ai/ai-assisted-development-overview.mdx index 8df750ab8a..c1dbad6ec9 100644 --- a/docs/angular/src/content/en/components/ai/ai-assisted-development-overview.mdx +++ b/docs/angular/src/content/en/components/ai/ai-assisted-development-overview.mdx @@ -35,9 +35,7 @@ npx igniteui-cli ai-config ``` - Without a version pin, `npx` may pull an older CLI version that does not recognize the `ai-config` subcommand and will instead launch an interactive project-creation prompt, scaffolding a new project inside your existing one. Make sure that you have installed CLI version 16.x. - diff --git a/docs/angular/src/content/en/components/grid/grid.mdx b/docs/angular/src/content/en/components/grid/grid.mdx index 8bbfe4278b..6bdc5afe08 100644 --- a/docs/angular/src/content/en/components/grid/grid.mdx +++ b/docs/angular/src/content/en/components/grid/grid.mdx @@ -134,7 +134,7 @@ The property tells the `igx-grid`

Ignite UI for Angular includes a powerful bootstrap grid like flex-based layout system. Any modern application today is expected to follow a responsive web design approach, meaning it can gracefully adjust layout of HTML elements based on the device size, or from simply resizing the browser. An Angular bootstrap grid layout was the most used approach in the past, but a flex-based layout system like CSS grid has become more popular, as it works in any browser. The Ignite UI for Angular Layout Directive allows vertical and horizontal flow, including content / text wrapping, justification, and alignment. The Ignite UI for Angular grid supports a responsive layout using CSS, giving you the ultimate flexibility in how the grid behaves on resize.

## Angular Grid Styling Configuration -> + The uses **css grid layout**, which is **not supported in IE without prefixing**, consequently it will not render properly. @@ -606,7 +606,7 @@ and interpolate it those in the template.
{{ cell.value }} - {{ cell.row.data['name'] }} + {{ cell.row.data['name'] }} {{ cell.row.data['weight']['molecular'] }}
diff --git a/docs/angular/src/content/en/components/grids-and-lists.mdx b/docs/angular/src/content/en/components/grids-and-lists.mdx index eb2aefbf0a..b01e5cc0ca 100644 --- a/docs/angular/src/content/en/components/grids-and-lists.mdx +++ b/docs/angular/src/content/en/components/grids-and-lists.mdx @@ -6,226 +6,38 @@ license: commercial --- import Sample from 'igniteui-astro-components/components/mdx/Sample.astro'; +import FaqAccordion from 'docs-template/components/mdx/FaqAccordion.astro'; +import CtaArea from 'docs-template/components/mdx/CtaArea.astro'; +import FeatureList from 'docs-template/components/mdx/FeatureList.astro'; +[//]: # (
) - - -
- Ignite UI Logo for developer web applications -
+import Feature from 'docs-template/components/mdx/Feature.astro'; +import CtaArea from 'docs-template/components/mdx/CtaArea.astro'; +import FeatureList from 'docs-template/components/mdx/FeatureList.astro'; +import FaqAccordion from 'docs-template/components/mdx/FaqAccordion.astro'; +import BrowserList from 'docs-template/components/mdx/BrowserList.astro'; # The Fastest {Platform} Grid - {ProductName} provides a complete library of {Platform}-native, Material-based UI components, including the world’s fastest virtualized {Platform} data grid. @@ -213,15 +23,8 @@ h3#excel-library-for-the-angular-grid ~ h3{ In this {Platform} grid example, you can see how users can customize their _data view_ by leveraging the various features built into the grid, like data search and filtering, columns sorting, resizing, pinning and hiding, row selection, export to excel and csv, horizontal and vertical scrolling. We have provided examples for cell templating that includes components like linear progress bar indicator and sparkline. View more features in this [topic](#{PlatformLower}-grid-features). -
- - - - -
- ## What is a {Platform} Grid? The {Platform} data grid is a component used to display tabular data in a series of rows and columns. Data grids, also known as tables, are well known in the desktop world with popular software such as Microsoft Excel. While grids have been available on desktop platforms for a long time, they have recently become part of web app UIs, such as {Platform} UI. Modern grids can be complex and may include a range of functionalities, including data binding, editing, Excel-like filtering, custom sorting, grouping, row reordering, row and column freezing, row aggregation, and exporting to Excel, CSV, and pdf formats. @@ -233,191 +36,152 @@ The {Platform} data grid is a component used to display tabular data in a series ## Key Features -
- The {ProductName} Data Grid is not just for high-volume and real-time data. It is a feature-rich {Platform} grid that gives you capabilities that you would never be able to accomplish with so little code on your own. Here are a few of the data grid’s key features: -
- -
    -
  • - -[**Virtualized Rows and Columns**](grid/virtualization.md) so you can load millions of records - -
    • - -
  • - -[**Inline Editing**](grid/editing.md) with [**Cell**](grid/cell-editing.md), and [**Row**](grid/row-editing.md) Update options - -
    • - -
  • - -[**Inline Editing**](grid/editing.md) with [**Cell**](grid/cell-editing.md) - -
    • - +
      +
    • + [Virtualized Rows and Columns](grid/virtualization.md) so you can load millions of records +
      • -{/*Add back when batch editing is available> -{/*
    • [**Inline Editing**](grid/editing.md) with [**Cell**](grid/cell-editing.md), [**Row**](grid/row-editing.md), and [**Batch**](grid/batch-editing.md) Update options
      • */}*/} +
    • + [Inline Editing](grid/editing.md) with [Cell](grid/cell-editing.md), and [Row](grid/row-editing.md) Update options +
      • -
    • +
    • + [Inline Editing](grid/editing.md) with [Cell](grid/cell-editing.md) +
      • -[**Excel-style Filtering**](grid/excel-style-filtering.md) and full [**Excel Keyboard Navigation**](grid/keyboard-navigation.md) capability + {/*Add back when batch editing is available>*/} + {/*
    • [**Inline Editing**](grid/editing.md) with [**Cell**](grid/cell-editing.md), [**Row**](grid/row-editing.md), and [**Batch**](grid/batch-editing.md) Update options
      • */} - +
    • + [Excel-style Filtering](grid/excel-style-filtering.md) and full [Excel Keyboard Navigation](grid/keyboard-navigation.md) capability +
      • -
    • +
    • + Interactive [Outlook-style Grouping](grid/groupby.md) +
      • -Interactive [**Outlook-style Grouping**](grid/groupby.md) +
    • + [Column Summaries](grid/summaries.md) based on any data in a grid cell or column +
      • - +
    • + [Export to Excel](grid/export-excel.md) +
      • -
    • +
    • + [Size](grid/size.md) to adjust the height and sizing of the rows +
      • -[**Column Summaries**](grid/summaries.md) based on any data in a grid cell or column - - -
    • - -[**Export to Excel**](grid/export-excel.md) - -
      • - -
    • - -[**Size**](grid/size.md) to adjust the height and sizing of the rows - -
      • - -{/*
    • Column templates like [**Sparkline Column**](charts/types/sparkline-chart.md) and Image Column
      • */} + {/*
    • Column templates like [**Sparkline Column**](charts/types/sparkline-chart.md) and Image Column
      • */}
    -
    - ### Data Virtualization and Performance - -
    - Seamlessly scroll through unlimited rows and columns in your {Platform} grid, with the data grid’s column and row level virtualization. With support for local or remote data sources, you get the best performance no matter where your data lives. Your users will experience Excel-like scrolling, with enterprise speed — no lag, screen flicker, or visual delay — giving you the best user experience (UX) without compromising performance. -
    -
    -
    -

    Quick and Easy to Customize, Build and Implement

    -
    -

    The Ignite UI {Platform} Data Grid can handle unlimited rows and columns of data, while providing access to custom templates and real-time data updates. Featuring an intuitive API for easy theming and branding, you can quickly bind to data with minimal code.

    -
    - -
    -
    -
    -
    - -### {Platform} Grid Paging, Sorting, Filtering, & Searching - -
    -
    Animation of filtering capabilities within {Platform} Data Grid
    -
    -

    Allow users to navigate your data set with our default [pager](grid/paging.md) or create your own template to give your own paging experience. With complete support for single and multi-column sorting, full-text [search](grid/search.md) on the grid, and several [advanced filtering](grid/advanced-filtering.md) options, including data-type based [Microsoft Excel-style Filtering](grid/excel-style-filtering.md).

    -
    -
    - -### Inline {Platform} Grid Editing - -
    -
    - Animation of filtering capabilities within {Platform} Data Grid -
    -
    -

    We provide you default [cell templates for editable columns](data-grid.md#cell-editing-template) which are based on the data type of the column. You can define your own custom templates for editable columns and override default behavior for committing and discarding changes in the cell value.

    -
    -
    - -### Keyboard Navigation & Row/Cell Selection - -
    -
    Animation of keyboard navigation functionality within {Platform} Data Grid
    -
    -

    Ensure accessibility compliance and improve usability, enabling Excel-like [keyboard navigation](grid/keyboard-navigation.md) in the {Platform} data grid, using the up, down, right, left, tab, and Enter keys. You can toggle single or multiple row selection in the {Platform} grid using the mouse or keyboard to select or de-select full rows, or use the built-in select all / de-select all checkbox in the grid toolbar to work with row selection. Learn about our most recent enhancements to this feature.

    -
    -
    - -### {Platform} Grid Accessibility & ARIA Support - -
    -
    -Icon representation for ARIA support on the Angular Data Grid Component
    -
    -

    Each of our {Platform} components in {ProductName} has been implemented according to the latest accessibility guidelines and specifications. Our {Platform} components have been tested using OS or Browser provided accessibility technology – screen readers. Our team ensures not only that the guidelines are implemented, but also that the actual content delivered to visually impaired or blind people is actually consumable and user-friendly for them. The {ProductName} data grid is fully accessible with a11y Keyboard accessibility, ARIA, and accessible color palette. Learn more.

    -
    -
    - -### Column Grouping, Pinning, Summaries - -
    -
    Grid of data with column grouping, pinning and summary features enabled for {Platform} Data Grid component
    -
    -

    Group columns or pre-set column groups via mouse interaction, touch or our API, with support for built-in column [summaries](grid/summaries.md) or custom summary templates. Enable users to interactively [hide](grid/column-hiding.md) or [move columns](grid/column-moving.md), with full support for interactive [column pinning](grid/column-pinning.md), during move, drag, and reorder operations.

    -
    -
    - -### Multi-Column Headers - -
    -
    Grid of data with Multi-Column Headers feature enabled on the {Platform} Data Grid component
    -
    -

    Enable [multi-column headers](grid/multi-column-headers.md), allowing you to group columns under a common header. Every column group could be a representation of combinations between other groups or columns, with full support for column pinning, interactive column moving within groups, sorting, and hiding groups.

    -
    -
    - + + + +

    Allow users to navigate your data set with our default [pager](grid/paging.md) or create your own template to give your own paging experience. With complete support for single and multi-column sorting, full-text [search](grid/search.md) on the grid, and several [advanced filtering](grid/advanced-filtering.md) options, including data-type based [Microsoft Excel-style Filtering](grid/excel-style-filtering.md).

    +     + + +

    We provide you default [cell templates for editable columns](data-grid.md#cell-editing-template) which are based on the data type of the column. You can define your own custom templates for editable columns and override default behavior for committing and discarding changes in the cell value.

    +     + + +

    Ensure accessibility compliance and improve usability, enabling Excel-like [keyboard navigation](grid/keyboard-navigation.md) in the {Platform} data grid, using the up, down, right, left, tab, and Enter keys. You can toggle single or multiple row selection in the {Platform} grid using the mouse or keyboard to select or de-select full rows, or use the built-in select all / de-select all checkbox in the grid toolbar to work with row selection. Learn about our most recent enhancements to this feature.

    +     + + +

    Each of our {Platform} components in {ProductName} has been implemented according to the latest accessibility guidelines and specifications. Our {Platform} components have been tested using OS or Browser provided accessibility technology – screen readers. Our team ensures not only that the guidelines are implemented, but also that the actual content delivered to visually impaired or blind people is actually consumable and user-friendly for them. The {ProductName} data grid is fully accessible with a11y Keyboard accessibility, ARIA, and accessible color palette. Learn more.

    +     + + +

    Group columns or pre-set column groups via mouse interaction, touch or our API, with support for built-in column [summaries](grid/summaries.md) or custom summary templates. Enable users to interactively [hide](grid/column-hiding.md) or [move columns](grid/column-moving.md), with full support for interactive [column pinning](grid/column-pinning.md), during move, drag, and reorder operations.

    +     + + +

    Enable [multi-column headers](grid/multi-column-headers.md), allowing you to group columns under a common header. Every column group could be a representation of combinations between other groups or columns, with full support for column pinning, interactive column moving within groups, sorting, and hiding groups.

    +     -### Theming, Styling, & Templating - -
    -
    Animation of different grids design showing the theming and templating capabilities of the Angular Data Grid
    -
    -

    With {ProductName} you can customize cell appearance with CSS or re-template any cell with ng-template to give any cell render appearance. With full support for Material Design, you can customize your branded experience with our simple-to-use theming engine.

    -
    -
    + +

    With {ProductName} you can customize cell appearance with CSS or re-template any cell with ng-template to give any cell render appearance. With full support for Material Design, you can customize your branded experience with our simple-to-use theming engine.

    +         - - - -### Excel Library for the {Platform} Grid - -
    -
    Icon representation of Microsoft Excel-like features on the Angular Data Grid -
    -
    -

    Full support for exporting data grids to XLXS, XLS, TSV or CSV. The {ProductName} [Excel library](excel-library.md) includes 300+ formulas, Table support, Conditional Formatting, Chart creation and more – all without needing Microsoft Excel on the client machine.

    + +
    +

    Full support for exporting data grids to XLXS, XLS, TSV or CSV. The {ProductName} [Excel library](excel-library.md) includes 300+ formulas, Table support, Conditional Formatting, Chart creation and more – all without needing Microsoft Excel on the client machine.

    -
    -
    - + - ## {Platform} Grid Features - -
    -
    +
    • @@ -522,49 +286,22 @@ Seamlessly scroll through unlimited rows and columns in your {Platform} grid, wi {/* -
      ## Adding a Table to a Worksheet diff --git a/docs/angular/src/content/kr/components/excel-library-using-workbooks.md b/docs/angular/src/content/kr/components/excel-library-using-workbooks.md index 36329ca045..64ea8fca54 100644 --- a/docs/angular/src/content/kr/components/excel-library-using-workbooks.md +++ b/docs/angular/src/content/kr/components/excel-library-using-workbooks.md @@ -19,7 +19,6 @@ The Infragistics Excel Engine enables you to save data to and load data from Mic -
      ## Change Default Font diff --git a/docs/angular/src/content/kr/components/excel-library-using-worksheets.md b/docs/angular/src/content/kr/components/excel-library-using-worksheets.md index 12c3cf9d2e..e3243c16dd 100644 --- a/docs/angular/src/content/kr/components/excel-library-using-worksheets.md +++ b/docs/angular/src/content/kr/components/excel-library-using-worksheets.md @@ -19,7 +19,6 @@ The Infragistics Excel Engine's [`worksheet`]({environment:dvApiBaseUrl}/product -
      The following code shows the imports needed to use the code-snippets below: diff --git a/docs/angular/src/content/kr/components/excel-library-working-with-charts.md b/docs/angular/src/content/kr/components/excel-library-working-with-charts.md index bbff92da78..e24e30408c 100644 --- a/docs/angular/src/content/kr/components/excel-library-working-with-charts.md +++ b/docs/angular/src/content/kr/components/excel-library-working-with-charts.md @@ -19,7 +19,6 @@ The Infragistics Excel Engine's [`WorksheetChart`]({environment:dvApiBaseUrl}/pr -
      ## Usage diff --git a/docs/angular/src/content/kr/components/excel-library-working-with-sparklines.md b/docs/angular/src/content/kr/components/excel-library-working-with-sparklines.md index 7f30e528ba..a3df858e13 100644 --- a/docs/angular/src/content/kr/components/excel-library-working-with-sparklines.md +++ b/docs/angular/src/content/kr/components/excel-library-working-with-sparklines.md @@ -18,7 +18,6 @@ The Infragistics Excel Library has support for adding sparklines to an Excel Wor -
      ## Supported Sparklines diff --git a/docs/angular/src/content/kr/components/excel-library.md b/docs/angular/src/content/kr/components/excel-library.md index 4da78b3708..65d287ee3e 100644 --- a/docs/angular/src/content/kr/components/excel-library.md +++ b/docs/angular/src/content/kr/components/excel-library.md @@ -19,7 +19,6 @@ The Infragistics Excel Library allows you to work with spreadsheet data using fa -
      ## Dependencies @@ -98,7 +97,6 @@ ExcelUtility.save(workbook, "fileName"); -
      ## Managing Heap diff --git a/docs/angular/src/content/kr/components/excel_library.md b/docs/angular/src/content/kr/components/excel_library.md index 9361c3b301..9aa973a96c 100644 --- a/docs/angular/src/content/kr/components/excel_library.md +++ b/docs/angular/src/content/kr/components/excel_library.md @@ -16,7 +16,6 @@ The Infragistics Excel Library allows you to work with spreadsheet data using fa github-src="excel/excel-library/overview"> -
      ## Dependencies @@ -92,7 +91,6 @@ var workbook = ExcelUtility.load(file); ExcelUtility.save(workbook, "fileName"); ``` -
      ## Managing Heap diff --git a/docs/angular/src/content/kr/components/excel_library_using_cells.md b/docs/angular/src/content/kr/components/excel_library_using_cells.md index 9bb63cd3e4..a6c6337ce2 100644 --- a/docs/angular/src/content/kr/components/excel_library_using_cells.md +++ b/docs/angular/src/content/kr/components/excel_library_using_cells.md @@ -16,7 +16,6 @@ The [`WorksheetCell`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/ github-src="excel/excel-library/working-with-cells"> -
      ## References diff --git a/docs/angular/src/content/kr/components/excel_library_using_tables.md b/docs/angular/src/content/kr/components/excel_library_using_tables.md index ec6fcc3c1f..bac954bb02 100644 --- a/docs/angular/src/content/kr/components/excel_library_using_tables.md +++ b/docs/angular/src/content/kr/components/excel_library_using_tables.md @@ -18,7 +18,6 @@ The Infragistics Excel Engine's [`WorksheetTable`]({environment:dvApiBaseUrl}/pr --> -
      ## Adding a Table to a Worksheet diff --git a/docs/angular/src/content/kr/components/excel_library_using_workbooks.md b/docs/angular/src/content/kr/components/excel_library_using_workbooks.md index 6be8cfb686..f5208f7fcb 100644 --- a/docs/angular/src/content/kr/components/excel_library_using_workbooks.md +++ b/docs/angular/src/content/kr/components/excel_library_using_workbooks.md @@ -16,7 +16,6 @@ The Infragistics Excel Engine enables you to save data to and load data from Mic github-src="excel/excel-library/operations-on-workbooks"> -
      ## Change Default Font diff --git a/docs/angular/src/content/kr/components/excel_library_using_worksheets.md b/docs/angular/src/content/kr/components/excel_library_using_worksheets.md index 0e59d997cc..9abdaee847 100644 --- a/docs/angular/src/content/kr/components/excel_library_using_worksheets.md +++ b/docs/angular/src/content/kr/components/excel_library_using_worksheets.md @@ -16,7 +16,6 @@ The Infragistics Excel Engine's [`Worksheet`]({environment:dvApiBaseUrl}/product github-src="excel/excel-library/operations-on-worksheets"> -
      The following code shows the imports needed to use the code-snippets below: diff --git a/docs/angular/src/content/kr/components/excel_library_working_with_charts.md b/docs/angular/src/content/kr/components/excel_library_working_with_charts.md index aeb49994fc..6b7f984421 100644 --- a/docs/angular/src/content/kr/components/excel_library_working_with_charts.md +++ b/docs/angular/src/content/kr/components/excel_library_working_with_charts.md @@ -16,7 +16,6 @@ The Infragistics Excel Engine's [`WorksheetChart`]({environment:dvApiBaseUrl}/pr github-src="excel/excel-library/working-with-charts"> -
      ## Usage diff --git a/docs/angular/src/content/kr/components/excel_library_working_with_grids.md b/docs/angular/src/content/kr/components/excel_library_working_with_grids.md index 0e0aeeffe1..a448596f7b 100644 --- a/docs/angular/src/content/kr/components/excel_library_working_with_grids.md +++ b/docs/angular/src/content/kr/components/excel_library_working_with_grids.md @@ -16,7 +16,6 @@ TODO github-src="excel/excel-library/working-with-grids"> -
      ## Usage diff --git a/docs/angular/src/content/kr/components/excel_library_working_with_sparklines.md b/docs/angular/src/content/kr/components/excel_library_working_with_sparklines.md index ece3afe848..bdbbe47548 100644 --- a/docs/angular/src/content/kr/components/excel_library_working_with_sparklines.md +++ b/docs/angular/src/content/kr/components/excel_library_working_with_sparklines.md @@ -16,7 +16,6 @@ The Infragistics Excel Library has support for adding sparklines to an Excel Wor github-src="excel/excel-library/working-with-sparklines"> -
      ## Supported Sparklines diff --git a/docs/angular/src/content/kr/components/expansion-panel.md b/docs/angular/src/content/kr/components/expansion-panel.md index 6f607fbfd2..4dc13ba9fd 100644 --- a/docs/angular/src/content/kr/components/expansion-panel.md +++ b/docs/angular/src/content/kr/components/expansion-panel.md @@ -10,7 +10,6 @@ _language: kr The [`IgxExpansionPanel`]({environment:angularApiUrl}/classes/igxexpansionpanelcomponent.html) is a lightweight component which can be rendered in two states - collapsed or expanded. When collapsed, the panel displays a short summary of its content. The collapsed panel can be toggled using mouse click, or keyboard interactions to display the body completely, containing any additional necessary content.

      -
      ### Expansion Panel Demo @@ -19,7 +18,6 @@ The [`IgxExpansionPanel`]({environment:angularApiUrl}/classes/igxexpansionpanelc iframe-src="{environment:demosBaseUrl}/layouts/expansion-sample-1/" > -
      ## Usage ### Getting Started diff --git a/docs/angular/src/content/kr/components/exporter-csv.md b/docs/angular/src/content/kr/components/exporter-csv.md index cc18a17706..218f96239a 100644 --- a/docs/angular/src/content/kr/components/exporter-csv.md +++ b/docs/angular/src/content/kr/components/exporter-csv.md @@ -12,7 +12,7 @@ _language: kr The IgniteUI CSV Exporter service can export data in a Character Separated Values format from both raw data (array) or from an [**IgxGrid**](grid/grid.md). The exporting functionality is encapsulated in the [`IgxCsvExporterService`]({environment:angularApiUrl}/classes/igxcsvexporterservice.html) class.

      -
      + ### CSV Exporter Demo @@ -22,7 +22,6 @@ The exporting functionality is encapsulated in the [`IgxCsvExporterService`]({en iframe-src="{environment:demosBaseUrl}/services/export-csv/" > -
      To start using the IgniteUI CSV Exporter first import the [`IgxCsvExporterService`]({environment:angularApiUrl}/classes/igxcsvexporterservice.html) in the app.module.ts file and add the service to the `providers` array: @@ -134,7 +133,6 @@ Different export formats have different file extensions and value delimiters. Th | [`CsvFileTypes.TAB`]({environment:angularApiUrl}/enums/csvfiletypes.html#tab) | .tab | Tab | | [`CsvFileTypes.TSV`]({environment:angularApiUrl}/enums/csvfiletypes.html#tsv) | .tsv | Tab | -
      You can also specify a custom delimiter using the [`IgxCsvExporterOptions`]({environment:angularApiUrl}/classes/igxcsvexporteroptions.html) objects's [`valueDelimiter`]({environment:angularApiUrl}/classes/igxcsvexporteroptions.html#valuedelimiter) property. @@ -169,11 +167,10 @@ 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) diff --git a/docs/angular/src/content/kr/components/exporter-excel.md b/docs/angular/src/content/kr/components/exporter-excel.md index 6c4cc65eb3..7ae5dbb8cd 100644 --- a/docs/angular/src/content/kr/components/exporter-excel.md +++ b/docs/angular/src/content/kr/components/exporter-excel.md @@ -11,7 +11,7 @@ _language: kr Ignite UI for Angular의 Excel 내보내기 서비스는 원시 데이터(배열) 또는 [**IgxGrid**](grid/grid.md) 에서 Microsoft® Excel® 형식으로 데이터를 내보내기할 수 있습니다. 내보내기 기능은 [`IgxExcelExporterService`]({environment:angularApiUrl}/classes/igxexcelexporterservice.html) 클래스에 캡슐화되며 데이터는 MS Excel 표 형식으로 내보내기가 됩니다. 이 형식은 필터링, 정렬 등과 같은 기능을 사용할 수 있습니다.

      -
      + ### Excel 내보내기 데모 @@ -21,7 +21,6 @@ Ignite UI for Angular의 Excel 내보내기 서비스는 원시 데이터(배열 iframe-src="{environment:demosBaseUrl}/services/export-excel/" > -
      ### 사용 방법 @@ -152,11 +151,10 @@ Excel 내보내기 서비스에는 아래의 몇 가지 API가 추가로 포함 * [IgxGridComponent API]({environment:angularApiUrl}/classes/igxgridcomponent.html) * [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) -
      + ### 추가 리소스 -
      커뮤니티는 활동적이고 새로운 아이디어를 항상 환영합니다. * [Ignite UI for Angular **Forums**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) diff --git a/docs/angular/src/content/kr/components/exporter-pdf.md b/docs/angular/src/content/kr/components/exporter-pdf.md index 3d7aa7dd8f..17c1c0194b 100644 --- a/docs/angular/src/content/kr/components/exporter-pdf.md +++ b/docs/angular/src/content/kr/components/exporter-pdf.md @@ -11,7 +11,7 @@ license: commercial 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 @@ -22,7 +22,6 @@ The Ignite UI for Angular PDF Exporter service provides powerful functionality t iframe-src="{environment:demosBaseUrl}/services/export-pdf/" alt="Angular PDF Exporter Example"> -
      ## Usage @@ -198,7 +197,6 @@ The following fonts provide excellent Unicode coverage: iframe-src="{environment:demosBaseUrl}/services/export-pdf-custom-font/" alt="Angular PDF Exporter Custom Font Example"> -
      ## Known Limitations @@ -218,11 +216,10 @@ 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) diff --git a/docs/angular/src/content/kr/components/financial-chart-annotations.md b/docs/angular/src/content/kr/components/financial-chart-annotations.md index 5821085873..51cc53f62a 100644 --- a/docs/angular/src/content/kr/components/financial-chart-annotations.md +++ b/docs/angular/src/content/kr/components/financial-chart-annotations.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/annotations"> -
      ## 십자형 레이어 diff --git a/docs/angular/src/content/kr/components/financial-chart-axis-types.md b/docs/angular/src/content/kr/components/financial-chart-axis-types.md index 29abab9833..dfc1183ef0 100644 --- a/docs/angular/src/content/kr/components/financial-chart-axis-types.md +++ b/docs/angular/src/content/kr/components/financial-chart-axis-types.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/axis-types"> -
      기본적으로 레이블을 명시적으로 설정할 필요는 없습니다. 금융 차트는 제공한 데이터 내에서 최초의 적절한 속성을 사용하고 이를 레이블에 사용합니다. @@ -39,7 +38,6 @@ _language: kr ``` -
      ## 축 레이블 @@ -63,7 +61,6 @@ _language: kr ``` -
      ## 축 모드 @@ -90,7 +87,6 @@ Y축의 경우 다음 모드 중에서 선택할 수 있습니다: ``` -
      ## 축 범위 @@ -108,7 +104,6 @@ Y축의 경우 다음 모드 중에서 선택할 수 있습니다: ``` -
      ## 축 축척 @@ -130,7 +125,6 @@ Y축의 경우 다음 모드 중에서 선택할 수 있습니다: ``` -
      ## 축 눈금 @@ -149,7 +143,6 @@ Y축의 경우 다음 모드 중에서 선택할 수 있습니다: ``` -
      ## 축 제목 @@ -172,4 +165,3 @@ Y축의 경우 다음 모드 중에서 선택할 수 있습니다: ``` -
      diff --git a/docs/angular/src/content/kr/components/financial-chart-custom-indicators.md b/docs/angular/src/content/kr/components/financial-chart-custom-indicators.md index 5a7e96e314..93cde04ddf 100644 --- a/docs/angular/src/content/kr/components/financial-chart-custom-indicators.md +++ b/docs/angular/src/content/kr/components/financial-chart-custom-indicators.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/custom-indicators"> -
      [`IgxFinancialChartComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igxfinancialchartcomponent.html)에서 사용자 금융지표를 사용하려면 `customIndicatorNames` 속성에 이름을 추가하고 `applyCustomIndicators` 이벤트에서 해당 값의 계산을 실행합니다. diff --git a/docs/angular/src/content/kr/components/financial-chart-high-frequency.md b/docs/angular/src/content/kr/components/financial-chart-high-frequency.md index f367159346..4cc8aaf816 100644 --- a/docs/angular/src/content/kr/components/financial-chart-high-frequency.md +++ b/docs/angular/src/content/kr/components/financial-chart-high-frequency.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/high-frequency"> -
      ## 코드 예제 @@ -39,11 +38,9 @@ private tick(): void { } ``` -
      ## 추가 리소스 -
      - [차트 퍼포먼스](financial-chart-performance.md) - [대량의 데이터 바인딩](financial-chart-high-volume.md) diff --git a/docs/angular/src/content/kr/components/financial-chart-high-volume.md b/docs/angular/src/content/kr/components/financial-chart-high-volume.md index f90c0a1015..fd94e39eb2 100644 --- a/docs/angular/src/content/kr/components/financial-chart-high-volume.md +++ b/docs/angular/src/content/kr/components/financial-chart-high-volume.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/high-volume"> -
      차트의 퍼포먼스에 영향을 주는 여러 기능 및 Angular 고유 기능이 있으므로 애플리케이션에서 퍼포먼스를 최적화할 때 이를 고려해야 합니다. @@ -48,11 +47,9 @@ export class AppComponent { ``` -
      ## 추가 리소스 -
      - [차트 퍼포먼스](financial-chart-performance.md) - [실시간 데이터 바인딩](financial-chart-high-frequency.md) diff --git a/docs/angular/src/content/kr/components/financial-chart-multiple-data.md b/docs/angular/src/content/kr/components/financial-chart-multiple-data.md index 8faa4d6a3a..be061b5f4f 100644 --- a/docs/angular/src/content/kr/components/financial-chart-multiple-data.md +++ b/docs/angular/src/content/kr/components/financial-chart-multiple-data.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/multiple-data"> -
      각 데이터 소스를 배열에 추가하여 금융 차트에서 복수의 데이터 소스를 작성할 수 있습니다. 다음의 코드 조작은 복수의 데이터 소스를 작성하는 방법을 보여줍니다. @@ -51,11 +50,9 @@ let data: any = [ dataSource1, dataSource2 ] ``` -
      ## 추가 리소스 -
      - [차트 퍼포먼스](financial-chart-performance.md) - [실시간 데이터 바인딩](financial-chart-high-frequency.md) diff --git a/docs/angular/src/content/kr/components/financial-chart-panes.md b/docs/angular/src/content/kr/components/financial-chart-panes.md index 460a5e8a2d..5983d07e86 100644 --- a/docs/angular/src/content/kr/components/financial-chart-panes.md +++ b/docs/angular/src/content/kr/components/financial-chart-panes.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/panes"> -
      다음 창은 금융 차트 컨트롤에서 사용할 수 있습니다: @@ -96,10 +95,8 @@ _language: kr ``` -
      ## 추가 리소스 -
      - [차트 퍼포먼스](financial-chart-performance.md) diff --git a/docs/angular/src/content/kr/components/financial-chart-performance.md b/docs/angular/src/content/kr/components/financial-chart-performance.md index 26ad835f0a..1c95363ab4 100644 --- a/docs/angular/src/content/kr/components/financial-chart-performance.md +++ b/docs/angular/src/content/kr/components/financial-chart-performance.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/performance"> -
      다음의 코드는 금융 차트를 대량의 데이터에 바인딩하는 방법을 보여줍니다. @@ -128,11 +127,9 @@ Callout 주석(`calloutsVisible`) 또는 Final Value 주석(`finalValueAnnotatio - `XAxisStrip` - `YAxisStrip` -
      ## 추가 리소스 -
      - [대량의 데이터 바인딩](financial-chart-high-volume.md) - [실시간 데이터 바인딩](financial-chart-high-frequency.md) diff --git a/docs/angular/src/content/kr/components/financial-chart-tooltip-template.md b/docs/angular/src/content/kr/components/financial-chart-tooltip-template.md index 28980436a9..992b5c0f60 100644 --- a/docs/angular/src/content/kr/components/financial-chart-tooltip-template.md +++ b/docs/angular/src/content/kr/components/financial-chart-tooltip-template.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/tooltip-template"> -
      도구 설명 콘텐츠는 다음의 코드와 같이 도구 설명 템플릿을 생성하여 사용자 정의화됩니다. diff --git a/docs/angular/src/content/kr/components/financial-chart-tooltip-types.md b/docs/angular/src/content/kr/components/financial-chart-tooltip-types.md index 9a60316f98..565d91a853 100644 --- a/docs/angular/src/content/kr/components/financial-chart-tooltip-types.md +++ b/docs/angular/src/content/kr/components/financial-chart-tooltip-types.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/tooltip-types"> -
      ## 도구 설명 유형 diff --git a/docs/angular/src/content/kr/components/financial-chart-trendlines.md b/docs/angular/src/content/kr/components/financial-chart-trendlines.md index 60209756e6..22cb92a040 100644 --- a/docs/angular/src/content/kr/components/financial-chart-trendlines.md +++ b/docs/angular/src/content/kr/components/financial-chart-trendlines.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/trendlines"> -
      ## 탐색 구성 diff --git a/docs/angular/src/content/kr/components/financial-chart.md b/docs/angular/src/content/kr/components/financial-chart.md index e95f628b01..390a964921 100644 --- a/docs/angular/src/content/kr/components/financial-chart.md +++ b/docs/angular/src/content/kr/components/financial-chart.md @@ -18,7 +18,6 @@ _language: kr github-src="charts/financial-chart/overview"> -
      사용자가 데이터를 바인딩하면 차트는 데이터를 시각화하고 해석할 수 있는 다양한 방법을 제공합니다. 가격, 수량, 금융지표를 위한 다양한 표시 모드가 있습니다. 또한, 차트는 레이블 서식 설정을 사용하여 데이터에 컨텍스트를 부여합니다. @@ -67,7 +66,6 @@ import { IgxFinancialChartModule } from "igniteui-angular-charts"; export class AppModule {} ``` -
      ## 사용 방법 diff --git a/docs/angular/src/content/kr/components/general-changelog-dv.md b/docs/angular/src/content/kr/components/general-changelog-dv.md index bf9e6692a1..d11a6ca609 100644 --- a/docs/angular/src/content/kr/components/general-changelog-dv.md +++ b/docs/angular/src/content/kr/components/general-changelog-dv.md @@ -17,17 +17,12 @@ All notable changes for each version of Ignite UI for Angular are documented on -
      ## **Angular 13.1.0 (November 2021)** -
      -
      -
      -
      ### Charts & Maps @@ -62,7 +57,6 @@ This release introduces a few improvements and simplifications to visual design | -------------------- | ------------------- | | #8BDC5C
      #8B5BB1
      #6DB1FF
      #F8A15F
      #EE5879
      #735656
      #F7D262
      #8CE7D9
      #E051A9
      #A8A8B7 | #8BDC5C
      #8961A9
      #6DB1FF
      #82E9D9
      #EA3C63
      #735656
      #F8CE4F
      #A8A8B7
      #E051A9
      #FF903B
      | -
      ## **Angular 11.2.0 (April 2021)** @@ -127,11 +121,8 @@ for example: - Added support for highlighting of the shape series - Added support for some annotation layers for the shape series -
      -
      -
      diff --git a/docs/angular/src/content/kr/components/general/getting-started.md b/docs/angular/src/content/kr/components/general/getting-started.md index 82eab8e113..6afceb734b 100644 --- a/docs/angular/src/content/kr/components/general/getting-started.md +++ b/docs/angular/src/content/kr/components/general/getting-started.md @@ -31,7 +31,6 @@ To get started, you must install both NodeJS and Visual Studio Code on your mach
    -
    ## Installing Ignite UI for Angular @@ -227,13 +226,11 @@ In this article we learned how to create our own Ignite UI for Angular applicati * [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) ## Additional Resources -
    * [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) -
    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) diff --git a/docs/angular/src/content/kr/components/general/localization.md b/docs/angular/src/content/kr/components/general/localization.md index 821bdadf7f..5dfb73d0b5 100644 --- a/docs/angular/src/content/kr/components/general/localization.md +++ b/docs/angular/src/content/kr/components/general/localization.md @@ -102,7 +102,6 @@ public ngOnInit(): void { ## Additional Resources -
    Our community is active and always welcoming to new ideas. diff --git a/docs/angular/src/content/kr/components/geo-map-binding-data-csv.md b/docs/angular/src/content/kr/components/geo-map-binding-data-csv.md index 1e1bc72c92..ccb8426e42 100644 --- a/docs/angular/src/content/kr/components/geo-map-binding-data-csv.md +++ b/docs/angular/src/content/kr/components/geo-map-binding-data-csv.md @@ -19,7 +19,6 @@ With the Ignite UI for Angular map component, you can plot geographic data loade -
    ## Data Example diff --git a/docs/angular/src/content/kr/components/geo-map-binding-data-json-points.md b/docs/angular/src/content/kr/components/geo-map-binding-data-json-points.md index 1e27abfa28..bc7eaebcdf 100644 --- a/docs/angular/src/content/kr/components/geo-map-binding-data-json-points.md +++ b/docs/angular/src/content/kr/components/geo-map-binding-data-json-points.md @@ -19,7 +19,6 @@ With [`IgxGeographicMapComponent`]({environment:dvApiBaseUrl}/products/ignite-ui -
    ## Data Example diff --git a/docs/angular/src/content/kr/components/geo-map-binding-data-model.md b/docs/angular/src/content/kr/components/geo-map-binding-data-model.md index 3d993406e3..a1bc23fa6a 100644 --- a/docs/angular/src/content/kr/components/geo-map-binding-data-model.md +++ b/docs/angular/src/content/kr/components/geo-map-binding-data-model.md @@ -19,7 +19,6 @@ The Ignite UI for Angular map component is designed to display geo-spatial data -
    The following table summarized data structures required for each type of geographic series: diff --git a/docs/angular/src/content/kr/components/geo-map-binding-multiple-shapes.md b/docs/angular/src/content/kr/components/geo-map-binding-multiple-shapes.md index 248fa82af8..9b6e6197e5 100644 --- a/docs/angular/src/content/kr/components/geo-map-binding-multiple-shapes.md +++ b/docs/angular/src/content/kr/components/geo-map-binding-multiple-shapes.md @@ -19,7 +19,6 @@ In the [`IgxGeographicMapComponent`]({environment:dvApiBaseUrl}/products/ignite- -
    This topic takes you step-by-step towards displaying multiple geographic series in the map component. All geographic series plot following geo-spatial data loaded from shape files using the `ShapeDataSource` class. Refer to the [Binding Shape Files](geo-map-binding-shp-file.md) topic for more information about `ShapeDataSource` object. diff --git a/docs/angular/src/content/kr/components/geo-map-binding-multiple-sources.md b/docs/angular/src/content/kr/components/geo-map-binding-multiple-sources.md index 6317ae7789..ce9c9f2c01 100644 --- a/docs/angular/src/content/kr/components/geo-map-binding-multiple-sources.md +++ b/docs/angular/src/content/kr/components/geo-map-binding-multiple-sources.md @@ -19,7 +19,6 @@ In the [`IgxGeographicMapComponent`]({environment:dvApiBaseUrl}/products/ignite- -
    This topic takes you step-by-step towards displaying multiple geographic series that will plot following geo-spatial data: diff --git a/docs/angular/src/content/kr/components/geo-map-binding-shp-file.md b/docs/angular/src/content/kr/components/geo-map-binding-shp-file.md index 8d86b83ff8..dccbfb888b 100644 --- a/docs/angular/src/content/kr/components/geo-map-binding-shp-file.md +++ b/docs/angular/src/content/kr/components/geo-map-binding-shp-file.md @@ -19,7 +19,6 @@ The Ignite UI for Angular map component, the `ShapeDataSource` class loads geo-s -
    The following table explains properties of the `ShapeDataSource` class for loading shape files. diff --git a/docs/angular/src/content/kr/components/geo-map-display-bing-imagery.md b/docs/angular/src/content/kr/components/geo-map-display-bing-imagery.md index 694260943e..0a8979b6f2 100644 --- a/docs/angular/src/content/kr/components/geo-map-display-bing-imagery.md +++ b/docs/angular/src/content/kr/components/geo-map-display-bing-imagery.md @@ -22,7 +22,6 @@ Bing Maps is Microsoft’s® licensed geographic imagery mapping service. This g Angular Bing Maps Imagery -
    ## Code Snippet diff --git a/docs/angular/src/content/kr/components/geo-map-display-esri-imagery.md b/docs/angular/src/content/kr/components/geo-map-display-esri-imagery.md index 7700e309cf..7028ebc5f9 100644 --- a/docs/angular/src/content/kr/components/geo-map-display-esri-imagery.md +++ b/docs/angular/src/content/kr/components/geo-map-display-esri-imagery.md @@ -19,7 +19,6 @@ The [`IgxArcGISOnlineMapImagery`]({environment:dvApiBaseUrl}/products/ignite-ui- -
    ## Code Snippet diff --git a/docs/angular/src/content/kr/components/geo-map-display-heat-imagery.md b/docs/angular/src/content/kr/components/geo-map-display-heat-imagery.md index 2ef59a825f..9035f768ea 100644 --- a/docs/angular/src/content/kr/components/geo-map-display-heat-imagery.md +++ b/docs/angular/src/content/kr/components/geo-map-display-heat-imagery.md @@ -27,7 +27,6 @@ It is highly recommended that you review the [Binding Shape Files with Geo-Spati -
    diff --git a/docs/angular/src/content/kr/components/geo-map-display-osm-imagery.md b/docs/angular/src/content/kr/components/geo-map-display-osm-imagery.md index c2e164e66b..efb9996462 100644 --- a/docs/angular/src/content/kr/components/geo-map-display-osm-imagery.md +++ b/docs/angular/src/content/kr/components/geo-map-display-osm-imagery.md @@ -20,7 +20,6 @@ By the default, the Ignite UI for Angular map component displays geographic imag -
    ## Code Snippet diff --git a/docs/angular/src/content/kr/components/geo-map-navigation.md b/docs/angular/src/content/kr/components/geo-map-navigation.md index 3b59450746..bba67e2a25 100644 --- a/docs/angular/src/content/kr/components/geo-map-navigation.md +++ b/docs/angular/src/content/kr/components/geo-map-navigation.md @@ -19,7 +19,6 @@ Navigation in the [`IgxGeographicMapComponent`]({environment:dvApiBaseUrl}/produ -
    ## Geographic Coordinates diff --git a/docs/angular/src/content/kr/components/geo-map-shape-styling.md b/docs/angular/src/content/kr/components/geo-map-shape-styling.md index 341aeb5fb6..7218c46d75 100644 --- a/docs/angular/src/content/kr/components/geo-map-shape-styling.md +++ b/docs/angular/src/content/kr/components/geo-map-shape-styling.md @@ -19,7 +19,6 @@ This topic explains how to apply custom styling to the [`IgxGeographicShapeSerie -
    ## Required Imports diff --git a/docs/angular/src/content/kr/components/geo-map-type-scatter-area-series.md b/docs/angular/src/content/kr/components/geo-map-type-scatter-area-series.md index bb638f75d2..f842eb1b20 100644 --- a/docs/angular/src/content/kr/components/geo-map-type-scatter-area-series.md +++ b/docs/angular/src/content/kr/components/geo-map-type-scatter-area-series.md @@ -19,7 +19,6 @@ Use the map component's [`IgxGeographicScatterAreaSeriesComponent`]({environment -
    The [`IgxGeographicScatterAreaSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographicscatterareaseriescomponent.html) works a lot like the [`IgxGeographicContourLineSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographiccontourlineseriescomponent.html) except that it represents data as interpolated and colored surface instead of contour lines connecting data points with the same values. diff --git a/docs/angular/src/content/kr/components/geo-map-type-scatter-bubble-series.md b/docs/angular/src/content/kr/components/geo-map-type-scatter-bubble-series.md index b44c4efd46..9d65ad26ba 100644 --- a/docs/angular/src/content/kr/components/geo-map-type-scatter-bubble-series.md +++ b/docs/angular/src/content/kr/components/geo-map-type-scatter-bubble-series.md @@ -19,7 +19,6 @@ Use the map component's [`IgxGeographicProportionalSymbolSeriesComponent`]({envi -
    The demo above shows the [`IgxGeographicProportionalSymbolSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographicproportionalsymbolseriescomponent.html) series and how to specify data binding options of the series. Automatic marker selection is configured along with marker collision avoidance logic, and marker outline and fill colors are specified too. diff --git a/docs/angular/src/content/kr/components/geo-map-type-scatter-contour-series.md b/docs/angular/src/content/kr/components/geo-map-type-scatter-contour-series.md index 311b01de5d..7b26a5fca5 100644 --- a/docs/angular/src/content/kr/components/geo-map-type-scatter-contour-series.md +++ b/docs/angular/src/content/kr/components/geo-map-type-scatter-contour-series.md @@ -19,7 +19,6 @@ Use the map component's [`IgxGeographicContourLineSeriesComponent`]({environment -
    The [`IgxGeographicContourLineSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographiccontourlineseriescomponent.html) works a lot like the [`IgxGeographicScatterAreaSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographicscatterareaseriescomponent.html) except that it represents data as contour lines, colored using a fill scale and the geographic scatter area series, represents data as a surface interpolated using a color scale. diff --git a/docs/angular/src/content/kr/components/geo-map-type-scatter-density-series.md b/docs/angular/src/content/kr/components/geo-map-type-scatter-density-series.md index 6047c7f010..59b8b78466 100644 --- a/docs/angular/src/content/kr/components/geo-map-type-scatter-density-series.md +++ b/docs/angular/src/content/kr/components/geo-map-type-scatter-density-series.md @@ -19,7 +19,6 @@ Use the map component's [`IgxGeographicHighDensityScatterSeriesComponent`]({envi -
    The demo above shows the [`IgxGeographicHighDensityScatterSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographichighdensityscatterseriescomponent.html) series in the map component bound to hundreds or even thousands of data points representing Australia’s population density. The map plot area with more densely populated data points represented as coalescences of red pixels and loosely distributed data points by discrete blue pixels. diff --git a/docs/angular/src/content/kr/components/geo-map-type-scatter-symbol-series.md b/docs/angular/src/content/kr/components/geo-map-type-scatter-symbol-series.md index 60ed661649..6f92fd2c26 100644 --- a/docs/angular/src/content/kr/components/geo-map-type-scatter-symbol-series.md +++ b/docs/angular/src/content/kr/components/geo-map-type-scatter-symbol-series.md @@ -19,7 +19,6 @@ Use the map component's [`IgxGeographicSymbolSeriesComponent`]({environment:dvAp -
    ## Data Requirements diff --git a/docs/angular/src/content/kr/components/geo-map-type-shape-polygon-series.md b/docs/angular/src/content/kr/components/geo-map-type-shape-polygon-series.md index 0a78953fc4..6e3e369c8a 100644 --- a/docs/angular/src/content/kr/components/geo-map-type-shape-polygon-series.md +++ b/docs/angular/src/content/kr/components/geo-map-type-shape-polygon-series.md @@ -19,7 +19,6 @@ Use the map component's [`IgxGeographicShapeSeriesComponent`]({environment:dvApi -
    The [`IgxGeographicShapeSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographicshapeseriescomponent.html) works a lot like the [`IgxGeographicPolylineSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographicpolylineseriescomponent.html) except that geo-spatial data is rendered with polygons instead of polylines. diff --git a/docs/angular/src/content/kr/components/geo-map-type-shape-polyline-series.md b/docs/angular/src/content/kr/components/geo-map-type-shape-polyline-series.md index 5f16bc5f51..1e5ace6d13 100644 --- a/docs/angular/src/content/kr/components/geo-map-type-shape-polyline-series.md +++ b/docs/angular/src/content/kr/components/geo-map-type-shape-polyline-series.md @@ -19,7 +19,6 @@ Use the map component's [`IgxGeographicPolylineSeriesComponent`]({environment:dv -
    The [`IgxGeographicPolylineSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographicpolylineseriescomponent.html) works a lot like the [`IgxGeographicShapeSeriesComponent`]({environment:dvApiBaseUrl}/products/ignite-ui-angular/api/docs/typescript/latest/classes/igniteui_angular_maps.igxgeographicshapeseriescomponent.html) except that geo-spatial data is rendered with polylines instead of polygons. diff --git a/docs/angular/src/content/kr/components/geo-map.md b/docs/angular/src/content/kr/components/geo-map.md index 730c9a7665..605c15726f 100644 --- a/docs/angular/src/content/kr/components/geo-map.md +++ b/docs/angular/src/content/kr/components/geo-map.md @@ -19,7 +19,6 @@ The Ignite UI for Angular map component allows you to display data that contains -
    The map component allows you to render geographic imagery from Bing Maps™, and Open Street Maps. The map provides plotting of tens of thousands of data points, and updates them every few milliseconds so that the control can handle your real-time feeds. @@ -63,7 +62,6 @@ import { IgxMapModule } from "igniteui-angular-maps"; export class AppModule {} ``` -
    ## Usage diff --git a/docs/angular/src/content/kr/components/grid/grid.md b/docs/angular/src/content/kr/components/grid/grid.md index 3d948ba8a2..2df7ec8634 100644 --- a/docs/angular/src/content/kr/components/grid/grid.md +++ b/docs/angular/src/content/kr/components/grid/grid.md @@ -17,7 +17,6 @@ _language: kr iframe-src="{environment:lobDemosBaseUrl}/grid/grid/" > -
    ### 의존성 @@ -435,7 +434,6 @@ See the [Grid Sizing](sizing.md) topic. > [!NOTE] > `igxGrid` uses `igxForOf` directive internally hence all `igxForOf` limitations are valid for `igxGrid`. For more details see [igxForOf Known Issues](../for-of.html#known-limitations) section. -
    ## API 참조 * [IgxGridComponent]({environment:angularApiUrl}/classes/igxgridcomponent.html) @@ -450,7 +448,6 @@ Learn more about creating an Angular data grid in our short tutorial video: > [!Video https://www.youtube.com/embed/Xv_fQVQ8fmM] ## 추가 리소스 -
    * [Grid Sizing](sizing.md) * [가상화 및 성능](virtualization.md) @@ -464,7 +461,6 @@ Learn more about creating an Angular data grid in our short tutorial video: * [선택](selection.md) * [Build CRUD operations with igxGrid](../general/how-to/how-to-perform-crud.md) -
    커뮤니티는 활동적이고 새로운 아이디어를 항상 환영합니다. * [Ignite UI for Angular **포럼**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) diff --git a/docs/angular/src/content/kr/components/grid/groupby.md b/docs/angular/src/content/kr/components/grid/groupby.md index fd6bcebdb4..298921e54b 100644 --- a/docs/angular/src/content/kr/components/grid/groupby.md +++ b/docs/angular/src/content/kr/components/grid/groupby.md @@ -306,7 +306,6 @@ This way, due to Angular's [ViewEncapsulation](https://angular.io/api/core/Compo * [IgxChipComponent 스타일]({environment:sassApiUrl}/themes#function-chip-theme) ### 추가 리소스 -
    * [그리드 개요](grid.md) * [가상화 및 성능](virtualization.md) @@ -318,7 +317,6 @@ This way, due to Angular's [ViewEncapsulation](https://angular.io/api/core/Compo * [열 크기 조정](column-resizing.md) * [선택](selection.md) -
    커뮤니티는 활동적이고 새로운 아이디어를 항상 환영합니다. * [Ignite UI for Angular **포럼**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) diff --git a/docs/angular/src/content/kr/components/grid/paste-excel.md b/docs/angular/src/content/kr/components/grid/paste-excel.md index eab8ce440e..2cb49cede6 100644 --- a/docs/angular/src/content/kr/components/grid/paste-excel.md +++ b/docs/angular/src/content/kr/components/grid/paste-excel.md @@ -28,7 +28,7 @@ Ignite UI for Angular [`IgxGrid`]({environment:angularApiUrl}/classes/igxgridcom iframe-src="{environment:demosBaseUrl}/grid/grid-paste/" > -
    + #### 사용 방법 @@ -133,7 +133,7 @@ Ignite UI for Angular [`IgxGrid`]({environment:angularApiUrl}/classes/igxgridcom } } ``` -
    + #### 붙여넣기 핸들러 지시문 @@ -222,11 +222,9 @@ export class PasteHandler { * [IgxGridComponent]({environment:angularApiUrl}/classes/igxgridcomponent.html) ### 추가 리소스 -
    * [Excel 내보내기](export-excel.md) -
    커뮤니티는 활동적이고 새로운 아이디어를 항상 환영합니다. * [Ignite UI for Angular **포럼**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) diff --git a/docs/angular/src/content/kr/components/grid/selection-based-aggregates.md b/docs/angular/src/content/kr/components/grid/selection-based-aggregates.md index 0abe27082e..602ee70b9c 100644 --- a/docs/angular/src/content/kr/components/grid/selection-based-aggregates.md +++ b/docs/angular/src/content/kr/components/grid/selection-based-aggregates.md @@ -55,7 +55,7 @@ Change the selection to see summaries of the currently selected range. * [IgxGridComponent Styles]({environment:sassApiUrl}/themes#function-grid-theme) ## Additional Resources -
    + * [Grid overview](grid.md) * [Selection Service]({environment:angularApiUrl}/classes/igxgridselectionservice.html) @@ -66,7 +66,6 @@ Change the selection to see summaries of the currently selected range. * [Summaries](summaries.md) * [Paging](paging.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) diff --git a/docs/angular/src/content/kr/components/grids-and-lists.md b/docs/angular/src/content/kr/components/grids-and-lists.md index 0bca2986ae..8e24ee4591 100644 --- a/docs/angular/src/content/kr/components/grids-and-lists.md +++ b/docs/angular/src/content/kr/components/grids-and-lists.md @@ -16,7 +16,7 @@ _language: kr
-
+
diff --git a/docs/angular/src/content/kr/components/hierarchicalgrid/hierarchical-grid.md b/docs/angular/src/content/kr/components/hierarchicalgrid/hierarchical-grid.md index dba1d18c49..462efb7959 100644 --- a/docs/angular/src/content/kr/components/hierarchicalgrid/hierarchical-grid.md +++ b/docs/angular/src/content/kr/components/hierarchicalgrid/hierarchical-grid.md @@ -15,7 +15,6 @@ _language: kr iframe-src="{environment:lobDemosBaseUrl}/hierarchical-grid/hierarchical-grid-resizing/" > -
### 의존성 계층 그리드는 `NgModule`로 내보내기 되므로 애플리케이션에서 `AppModule` 안에 IgxHierarchicalGridModule을 가져와야 합니다. @@ -421,7 +420,6 @@ This way, due to Angular's [ViewEncapsulation](https://angular.io/api/core/Compo * [IgxGridCell]({environment:angularApiUrl}/classes/igxgridcell.html) ### 추가 리소스 -
* [Grid Sizing](sizing.md) * [가상화 및 성능](virtualization.md) @@ -434,7 +432,6 @@ This way, due to Angular's [ViewEncapsulation](https://angular.io/api/core/Compo * [열 크기 조정](column-resizing.md) * [선택](selection.md) -
커뮤니티는 활동적이고 새로운 아이디어를 항상 환영합니다. * [Ignite UI for Angular **포럼**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) diff --git a/docs/angular/src/content/kr/components/hierarchicalgrid/load-on-demand.md b/docs/angular/src/content/kr/components/hierarchicalgrid/load-on-demand.md index 5b8008e35a..29364841a3 100644 --- a/docs/angular/src/content/kr/components/hierarchicalgrid/load-on-demand.md +++ b/docs/angular/src/content/kr/components/hierarchicalgrid/load-on-demand.md @@ -21,7 +21,6 @@ Ignite UI for Angular [`IgxHierarchicalGrid`]({environment:angularApiUrl}/classe iframe-src="{environment:demosBaseUrl}/hierarchical-grid/hierarchical-grid-lod/" > -
### 원격 서비스 공급자 @@ -304,11 +303,9 @@ export class HierarchicalGridLoDSampleComponent implements AfterViewInit { ### 추가 리소스 -
* [계층 그리드 컴포넌트](hierarchical-grid.md) -
커뮤니티는 활동적이고 새로운 아이디어를 항상 환영합니다. * [Ignite UI for Angular **포럼**](https://www.infragistics.com/community/forums/f/ignite-ui-for-angular) diff --git a/docs/angular/src/content/kr/components/icon.md b/docs/angular/src/content/kr/components/icon.md index 9c3521b46f..3003ae3efc 100644 --- a/docs/angular/src/content/kr/components/icon.md +++ b/docs/angular/src/content/kr/components/icon.md @@ -7,7 +7,7 @@ _language: kr ##Icon

The Ignite UI for Angular Icon component unifies icon/font sets so developers can use them interchangeably and add material icons to markup. The component supports custom colors. Icons can be set as inactive.

-
+ ### Icon Demo @@ -18,7 +18,6 @@ _language: kr -
### Dependencies @@ -212,13 +211,11 @@ 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 -
* [IgxIconComponent]({environment:angularApiUrl}/classes/igxiconcomponent.html) * [IgxIconComponent Styles]({environment:sassApiUrl}/themes#function-icon-theme) ## Additional Resources -
Our community is active and always welcoming to new ideas. diff --git a/docs/angular/src/content/kr/components/input-group-reactive-forms.md b/docs/angular/src/content/kr/components/input-group-reactive-forms.md index e9a9f15d06..0367b70a83 100644 --- a/docs/angular/src/content/kr/components/input-group-reactive-forms.md +++ b/docs/angular/src/content/kr/components/input-group-reactive-forms.md @@ -9,7 +9,7 @@ _language: kr

Ignite UI for Angular controls can be easily integrated in Reactive Forms.

-
+ ### Demo The following demo demonstrates [`igx-input-group`]({environment:angularApiUrl}/classes/igxinputgroupcomponent.html), [`igx-select`]({environment:angularApiUrl}/classes/igxselectcomponent.html) and [`igx-combo`]({environment:angularApiUrl}/classes/igxcombocomponent.html) controls being part of the Reactive Form. @@ -20,7 +20,6 @@ The following demo demonstrates [`igx-input-group`]({environment:angularApiUrl}/ iframe-src="{environment:demosBaseUrl}/data-entries/reactive-forms/" > -
### Usage @@ -95,7 +94,6 @@ export class ReactiveFormsSampleComponent { In that case the movie, full name, email and genres form's fields are required and the form won't be submitted, unless they have values. ## Additional Resources -
* [Combo](combo.md) * [Select](select.md) diff --git a/docs/angular/src/content/kr/components/input-group.md b/docs/angular/src/content/kr/components/input-group.md index c9998a93a4..61fbc22277 100644 --- a/docs/angular/src/content/kr/components/input-group.md +++ b/docs/angular/src/content/kr/components/input-group.md @@ -16,7 +16,6 @@ Input groups in the Ignite UI for Angular controls allow developers to create ea iframe-src="{environment:demosBaseUrl}/data-entries/input-group-sample-6/" > -
### Usage The default styling of the Input Group component as well as its complimentary directives follow the text fields specification in the Material Design @@ -64,7 +63,6 @@ Here is how the sample looks:
-
#### Hints Ignite UI for Angular Hint provides a helper text placed below the input. The hint can be placed at the start or at the end of the input. The position of the [`igx-hint`]({environment:angularApiUrl}/classes/igxhintdirective.html) can be set using the [`position`]({environment:angularApiUrl}/classes/igxhintdirective.html#position) property. Let's add a hint to our phone input: @@ -85,7 +83,6 @@ This is how the phone field with hint looks:
-
#### Styling Our inputs could be styled differently by using the [`type`]({environment:angularApiUrl}/classes/igxinputgroupcomponent.html#type) property of the [`igxInputGroup`]({environment:angularApiUrl}/classes/igxinputgroupcomponent.html) component. Currently we support four different ways of styling: line (the default one), box, border and search. This is how they look: diff --git a/docs/angular/src/content/kr/components/label-input.md b/docs/angular/src/content/kr/components/label-input.md index 961d13dd19..6b67a17f2e 100644 --- a/docs/angular/src/content/kr/components/label-input.md +++ b/docs/angular/src/content/kr/components/label-input.md @@ -9,7 +9,6 @@ _language: kr

The Ignite UI for Angular Input and Label directives are used to create single-line or multi-line text elements. They help to cover common scenarios when dealing with form inputs.

-
### Label & Input Demo @@ -18,7 +17,6 @@ The Ignite UI for Angular Input and Label directives are used to create single-l iframe-src="{environment:demosBaseUrl}/data-entries/input-group-sample-2/" > -
### Usage The default styling of the Label and Input directives follows the text fields specification in the Material Design @@ -57,7 +55,6 @@ And the result is:
-
The [`igxInput`]({environment:angularApiUrl}/classes/igxinputdirective.html) directive could be applied to `` and `