Skip to content

Commit af51aa1

Browse files
author
suriyakumar2402
committed
Initial release of the Syncfusion PowerApps Code Components library
1 parent fe48c91 commit af51aa1

File tree

265 files changed

+9198
-2
lines changed

Some content is hidden

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

265 files changed

+9198
-2
lines changed

‎.gitignore

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
# Ignore Node.js dependencies
2+
node_modules/
3+
package-lock.json
4+
yarn.lock
5+
6+
# Ignore compiled output and generated files
7+
obj/
8+
out/
9+
generated/
10+
11+
# Ignore development and editor-related files
12+
/.vscode
13+
/.cache
14+
15+
# Ignore log files
16+
/*.log
17+
18+
# Ignore temporary files
19+
*.tmp
20+
21+
# Ignore all folders with unknown names
22+
/*/
23+
24+
# Allow important files and folders
25+
!/*.json
26+
!/*.js
27+
!/components/
28+
!/docs/
29+
!/.images/

‎CHANGELOG.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# Changelog
2+
3+
## v27.1.48
4+
5+
- Initial release of the Syncfusion PowerApps Code Components library with the following components:
6+
- [Grid](components/grids) `Preview`
7+
- [Chart](components/charts) `Preview`
8+
- [Schedule](components/schedule) `Preview`
9+
- [PdfViewer](components/pdfviewer) `Preview`
10+
- [PivotView](components/pivotview) `Preview`

‎LICENSE

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
Syncfusion Licence
2+
3+
The Essential JS 2 library is part of the Syncfusion Essential Studio program and is available under either the Syncfusion Community License Program or a Syncfusion Commercial License.
4+
5+
Eligibility for the Syncfusion Community License Program requires:
6+
7+
1. Annual gross revenue of less than $1,000,000 USD.
8+
2. Fewer than five (5) developers in your organization.
9+
10+
Additionally, you must agree to comply with Syncfusion's terms and conditions.
11+
12+
Organizations that do not meet these criteria can contact mailto:[email protected] for commercial licensing options.
13+
14+
It is mandatory to obtain either a Community License or a commercial license and to agree to Syncfusion's terms and conditions before using this product.
15+
16+
The complete Syncfusion license agreement, including all terms and conditions, is available at https://www.syncfusion.com/content/downloads/syncfusion_license.pdf.

‎README.md

Lines changed: 118 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,118 @@
1-
# ej2-powerapps-components
2-
This repository features Syncfusion PowerApps components built using the PowerApps Component Framework (PCF). These components offer rich UI elements such as Data Grids, Charts, Schedules, and more, designed to enhance the functionality and flexibility of PowerApps applications.
1+
# Syncfusion PowerApps Code Components
2+
3+
The **Syncfusion PowerApps Code Components** library provides a modern, efficient, and user-friendly suite of components tailored for PowerApps. Built on the [PowerApps Component Framework (PCF)](https://learn.microsoft.com/en-us/power-apps/developer/component-framework/overview), these components seamlessly integrate with Canvas apps, Model-driven apps, and Power Pages (Portals). It offers a rich set of features and functionalities that are essential for any business application, ensuring a streamlined development experience.
4+
5+
## Repository structure
6+
7+
The repository is organized into the following folders:
8+
9+
| Folders | Description |
10+
| -------------------------- | ------------------------------------------------ |
11+
| [`components`](components) | Contains the Syncfusion code components. |
12+
| [`docs`](docs) | Contains the documentation for Syncfusion code components. |
13+
| [`SyncfusionPowerAppsComponents`](SyncfusionPowerAppsComponents) | Contains the generated solution project and solution file with all Syncfusion code components in the **components** folder (Available after running the `npm run pack` command). |
14+
15+
## Components list
16+
17+
The Syncfusion PowerApps Code components library includes the following components, which can be used in supported PowerApps applications:
18+
19+
| Code component | Supported Apps |
20+
| ------------------------ | ----------------------------------------------------------- |
21+
| [Grid](components/grids) `Preview` | ✅ [Local (TestHarness)](docs/grids/getting-started-with-code-component.md) <br/> ✅ [Canvas](docs/grids/getting-started-with-canvas.md) <br/> ✅ [Model-Driven (Form)](docs/grids/getting-started-with-model-driven-form.md) <br/> ✅ [Model-Driven (Custom Pages)](docs/grids/getting-started-with-model-driven-custom-pages.md) <br/> ⬜ PowerPages (Portals) |
22+
| [Chart](components/charts) `Preview` | ✅ [Local (TestHarness)](docs/charts/getting-started-with-code-component.md) <br/> ✅ [Canvas](docs/charts/getting-started-with-canvas.md) <br/> ✅ [Model-Driven (Form)](docs/charts/getting-started-with-model-driven-form.md) <br/> ✅ [Model-Driven (Custom Pages)](docs/charts/getting-started-with-model-driven-custom-pages.md) <br/> ✅ [PowerPages (Portals)](./docs/charts/getting-started-with-power-pages.md) |
23+
| [Schedule](components/schedule) `Preview` | ✅ [Local (TestHarness)](docs/schedule/getting-started-with-code-component.md) <br/> ✅ [Canvas](docs/schedule/getting-started-with-canvas.md) <br/> ✅ [Model-Driven (Form)](docs/schedule/getting-started-with-model-driven-form.md) <br/> ✅ [Model-Driven (Custom Pages)](docs/schedule/getting-started-with-model-driven-custom-pages.md) <br/> ✅ [PowerPages (Portals)](./docs/schedule/getting-started-with-power-pages.md) |
24+
| [PdfViewer](components/pdfviewer) `Preview` | ✅ [Local (TestHarness)](docs/pdfviewer/getting-started-with-code-component.md) <br/> ✅ [Canvas](docs/pdfviewer/getting-started-with-canvas.md) <br/> ✅ [Model-Driven (Form)](docs/pdfviewer/getting-started-with-model-driven-form.md) <br/> ✅ [Model-Driven (Custom Pages)](docs/pdfviewer/getting-started-with-model-driven-custom-pages.md) <br/> ⬜ PowerPages (Portals) |
25+
| [PivotView](components/pivotview) `Preview` | ✅ [Local (TestHarness)](docs/pivotview/getting-started-with-code-component.md) <br/> ✅ [Canvas](docs/pivotview/getting-started-with-canvas.md) <br/> ✅ [Model-Driven (Form)](docs/pivotview/getting-started-with-model-driven-form.md) <br/> ✅ [Model-Driven (Custom Pages)](docs/pivotview/getting-started-with-model-driven-custom-pages.md) <br/> ✅ [PowerPages (Portals)](docs/pivotview/getting-started-with-model-driven-custom-pages.md) <br/>
26+
27+
<em>Anticipate future updates to the component list. \*</em>
28+
29+
## Install the prerequisites
30+
31+
Before starting with the Syncfusion PowerApps Code Components library, ensure the following prerequisites are installed:
32+
33+
- [node.js (>= v18.20.4)](https://nodejs.org/en/download/) (LTS version is recommended)
34+
- [.NET 6.x SDK](https://dotnet.microsoft.com/en-us/download/dotnet/6.0)
35+
- [Microsoft Power Platform CLI](https://learn.microsoft.com/en-us/power-platform/developer/cli/introduction#install-microsoft-power-platform-cli)
36+
- [System requirements for Syncfusion React components](https://ej2.syncfusion.com/react/documentation/system-requirement)
37+
38+
## Clone the repository
39+
40+
Clone the Syncfusion PowerApps components repository to your local machine.
41+
42+
## Creating the Syncfusion code components solution package
43+
44+
To generate a solution project and bundle all Synfusion code components to create a solution package, follow these steps:
45+
46+
1. Open your command prompt and navigate to the [root folder](./) of this project.
47+
48+
> [!IMPORTANT]
49+
> To avoid build failures, ensure that the entire folder path does not contain spaces. For example, instead of a path like C:\Projects\My Project, use C:\Projects\MyProject or C:\Projects\My_Project.
50+
51+
2. Execute the following commands to install dependencies
52+
53+
```bash
54+
npm install
55+
```
56+
57+
3. Place the Syncfusion license key in the [`syncfusion-license.txt`](syncfusion-license.txt) file located in the project's root folder for registration.
58+
59+
> [!NOTE]
60+
> A license banner will be visible if the application is run without a Syncfusion license key. To obtain your Syncfusion license key, visit the [Get license key](https://help.syncfusion.com/common/essential-studio/licensing/licensing-faq/where-can-i-get-a-license-key) page. For detailed instructions on registering the Syncfusion license key, refer to the [registration with license key](https://ej2.syncfusion.com/react/documentation/licensing/license-key-registration#register-the-license-key-with-the-license-file) page.
61+
62+
4. Execute the following command to create & pack the solution package:
63+
64+
```bash
65+
npm run pack
66+
```
67+
68+
The resulting package will be created at [`SyncfusionPowerAppsComponents/bin/Debug/SyncfusionPowerAppsComponents.zip`](SyncfusionPowerAppsComponents/bin/Debug/SyncfusionPowerAppsComponents.zip), containing all Syncfusion code component.
69+
70+
## Deploying the solution package in the PowerApps portal
71+
72+
To deploy the solution package in the PowerApps portal, follow these steps:
73+
74+
1. Before proceeding, verify that the file size limit for email attachments in PowerApps is greater than the size of your solution bundle. For detailed instructions, refer to the [FAQ section](./faq.md#how-to-set-file-size-limit-for-email-attachments-in-powerapps).
75+
76+
2. Update the `Environment` property in [config](./config.json#L2) with PowerApps solution importing environment name from [PowerApps portal](https://make.powerapps.com/).
77+
78+
![Environment PowerApps portal](./docs/images/common/PowerApps-Environment.png)
79+
80+
3. Execute the following command to deploy the solution package in the PowerApps portal in root folder:
81+
82+
```bash
83+
npm run deploy
84+
```
85+
86+
> [!NOTE]
87+
> If you face any difficulties during the automatic importing process, please check the [FAQ](docs/common/faq.md) page for help. For instructions on manually deploying the solution package in the PowerApps portal, visit the [manual deployment](./docs/common/deploy-solution-pack-manually.md) page.
88+
89+
4. After the successful execution of the command, the solution package will be deployed in the [PowerApps portal](https://make.powerapps.com/) under the specified environment in [config](./config.json#L2) as shown below in the opened PowerApps solution page:
90+
91+
![Deployed solution package in PowerApps portal](./docs/images/common/PB-DeploySuccess.png)
92+
93+
## Integrating Syncfusion code components into PowerApps applications
94+
95+
After successfully deploying the solution package, integrate Syncfusion code components into your PowerApps applications. Refer to the [Component List](#components-list) and their accompanying guides for compatible applications.
96+
97+
For instance, for utilizing the Grid code component within a PowerApps Canvas application, refer to the [Canvas](docs/grids/getting-started-with-canvas.md) guide for detailed instructions.
98+
99+
## Testing Syncfusion code components locally (using Test Harness)
100+
101+
To update and test the Syncfusion code components on your local machine, refer to the documentation for setting up `Local (TestHarness)` in the respective code components getting started guides listed in the [Component List](#components-list).
102+
103+
For instance, to test the Grid code component, you can visit the [Local (TestHarness)](docs/grids/getting-started-with-code-component.md) documentation and follow the instructions provided.
104+
105+
## Support
106+
107+
For any questions or assistance, you can:
108+
109+
- Visit the [Syncfusion support portal](https://support.syncfusion.com/).
110+
- Post your queries on the [community forums](https://www.syncfusion.com/forums).
111+
- Renew your subscription by clicking [here](https://www.syncfusion.com/sales/products) or contacting our sales team at <[email protected]>.
112+
- If you have specific feature requests or suggestions, please submit them through our [feedback portal](https://www.syncfusion.com/feedback/react).
113+
114+
## License
115+
116+
For detailed information about the Syncfusion Essential Studio license and copyright, please refer to the [license](LICENSE).
117+
118+
© 2024 Syncfusion, Inc. All Rights Reserved.

‎components/charts/.eslintrc.json

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"es2021": true
5+
},
6+
"extends": [
7+
"eslint:recommended",
8+
"plugin:react/recommended"
9+
],
10+
"globals": {
11+
"ComponentFramework": true
12+
},
13+
"parser": "@typescript-eslint/parser",
14+
"parserOptions": {
15+
"ecmaVersion": 12,
16+
"sourceType": "module"
17+
},
18+
"plugins": [
19+
"@microsoft/power-apps",
20+
"@typescript-eslint"
21+
],
22+
"rules": {
23+
"no-unused-vars": "off"
24+
},
25+
"settings": {
26+
"react": {
27+
"version": "detect"
28+
}
29+
}
30+
}

‎components/charts/.gitignore

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
6+
# generated directory
7+
**/generated
8+
9+
# output directory
10+
/out
11+
12+
# msbuild output directories
13+
/bin
14+
/obj
15+
16+
# MSBuild Binary and Structured Log
17+
*.binlog

‎components/charts/SfChart/ControlManifest.Input.xml

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<manifest>
3+
<control namespace="Syncfusion" constructor="SfChart" version="27.1.48" display-name-key="SfChart" description-key="SfChart_Desc_Key" control-type="virtual">
4+
<!--external-service-usage node declares whether this 3rd party PCF control is using external service or not, if yes, this control will be considered as premium and please also add the external domain it is using.
5+
If it is not using any external service, please set the enabled="false" and DO NOT add any domain below. The "enabled" will be false by default.
6+
Example1:
7+
<external-service-usage enabled="true">
8+
<domain>www.Microsoft.com</domain>
9+
</external-service-usage>
10+
Example2:
11+
<external-service-usage enabled="false">
12+
</external-service-usage>
13+
-->
14+
<external-service-usage enabled="false">
15+
<!--UNCOMMENT TO ADD EXTERNAL DOMAINS
16+
<domain></domain>
17+
<domain></domain>
18+
-->
19+
</external-service-usage>
20+
21+
<!-- Chart DataSource Property -->
22+
<data-set name="DataSource" display-name-key="DataSource"></data-set>
23+
24+
<!-- Chart Series & Title Property -->
25+
<property name="Series" of-type="Multiple" default-value="" display-name-key="Series" description-key="Series_Desc_Key" usage="input" required="false" />
26+
<property name="SeriesType" of-type="Enum" default-value="Line" display-name-key="SeriesType" description-key="SeriesType_Desc_Key" usage="input" required="false">
27+
<value name="Line" display-name-key="Line">Line</value>
28+
<value name="Column" display-name-key="Column">Column</value>
29+
<value name="Area" display-name-key="Area">Area</value>
30+
<value name="Bar" display-name-key="Bar">Bar</value>
31+
<value name="Histogram" display-name-key="Histogram">Histogram</value>
32+
<value name="StackingColumn" display-name-key="StackingColumn">StackingColumn</value>
33+
<value name="StackingArea" display-name-key="StackingArea">StackingArea</value>
34+
<value name="StackingStepArea" display-name-key="StackingStepArea">StackingStepArea</value>
35+
<value name="StackingLine" display-name-key="StackingLine">StackingLine</value>
36+
<value name="StackingBar" display-name-key="StackingBar">StackingBar</value>
37+
<value name="StepLine" display-name-key="StepLine">StepLine</value>
38+
<value name="StepArea" display-name-key="StepArea">StepArea</value>
39+
<value name="SplineArea" display-name-key="SplineArea">SplineArea</value>
40+
<value name="Scatter" display-name-key="Scatter">Scatter</value>
41+
<value name="Spline" display-name-key="Spline">Spline</value>
42+
<value name="StackingColumn100" display-name-key="StackingColumn100">StackingColumn100</value>
43+
<value name="StackingBar100" display-name-key="StackingBar100">StackingBar100</value>
44+
<value name="StackingLine100" display-name-key="StackingLine100">StackingLine100</value>
45+
<value name="StackingArea100" display-name-key="StackingArea100">StackingArea100</value>
46+
<value name="RangeColumn" display-name-key="RangeColumn">RangeColumn</value>
47+
<value name="RangeStepArea" display-name-key="RangeStepArea">RangeStepArea</value>
48+
<value name="Hilo" display-name-key="Hilo">Hilo</value>
49+
<value name="HiloOpenClose" display-name-key="HiloOpenClose">HiloOpenClose</value>
50+
<value name="Waterfall" display-name-key="Waterfall">Waterfall</value>
51+
<value name="RangeArea" display-name-key="RangeArea">RangeArea</value>
52+
<value name="SplineRangeArea" display-name-key="SplineRangeArea">SplineRangeArea</value>
53+
<value name="Pareto" display-name-key="Pareto">Pareto</value>
54+
</property>
55+
<property name="Title" of-type="SingleLine.Text" default-value="" display-name-key="Title" description-key="Title_Desc_Key" usage="input" required="false" />
56+
57+
<!-- Chart Primary X Axis Property -->
58+
<property name="PrimaryXAxisType" of-type="Enum" default-value="Double" display-name-key="PrimaryXAxisType" description-key="PrimaryXAxisType_Desc_Key" usage="input" required="false">
59+
<value name="Double" display-name-key="Double">Double</value>
60+
<value name="DateTime" display-name-key="DateTime">DateTime</value>
61+
<value name="Category" display-name-key="Category">Category</value>
62+
<value name="Logarithmic" display-name-key="Logarithmic">Logarithmic</value>
63+
<value name="DateTimeCategory" display-name-key="DateTimeCategory">DateTimeCategory</value>
64+
</property>
65+
66+
<property name="EnableCrosshair" of-type="TwoOptions" default-value="false" display-name-key="EnableCrosshair" description-key="EnableCrosshair_Desc_Key" usage="input" required="false" />
67+
<property name="EnableTooltip" of-type="TwoOptions" default-value="false" display-name-key="EnableTooltip" description-key="EnableTooltip_Desc_Key" usage="input" required="false" />
68+
<property name="EnableCrosshairTooltip" of-type="TwoOptions" default-value="false" display-name-key="EnableCrosshairTooltip" description-key="EnableCrosshairTooltip_Desc_Key" usage="input" required="false" />
69+
<property name="EnableLegendVisibility" of-type="TwoOptions" default-value="true" display-name-key="EnableLegendVisibility" description-key="EnableLegendVisibility_Desc_Key" usage="input" required="false" />
70+
71+
<!-- Chart Zoom Properties -->
72+
<property name="EnableMouseWheelZooming" of-type="TwoOptions" default-value="false" display-name-key="EnableMouseWheelZooming" description-key="EnableMouseWheelZooming_Desc_Key" usage="input" required="false" />
73+
<property name="EnablePinchZooming" of-type="TwoOptions" default-value="false" display-name-key="EnablePinchZooming" description-key="EnablePinchZooming_Desc_Key" usage="input" required="false" />
74+
<property name="EnableSelectionZooming" of-type="TwoOptions" default-value="false" display-name-key="EnableSelectionZooming" description-key="EnableSelectionZooming_Desc_Key" usage="input" required="false" />
75+
<property name="Height" of-type="Whole.None" default-value="200" display-name-key="Height" description-key="Height_Desc_Key" usage="input" required="false" />
76+
77+
<!-- Chart Events Property -->
78+
<property name="EventName" of-type="SingleLine.Text" display-name-key="EventName" description-key="EventName_Desc_Key" usage="output" default-value="" />
79+
<property name="OnError" of-type="SingleLine.Text" display-name-key="OnError" description-key="OnError_Desc_Key" usage="output" default-value="" />
80+
81+
<resources>
82+
<code path="index.ts" order="1" />
83+
<platform-library name="React" version="16.8.6" />
84+
<resx path="strings/SfChart.1033.resx" version="1.0.0" />
85+
<css path="styles/theme.css" order="1" />
86+
</resources>
87+
<!-- UNCOMMENT TO ENABLE THE SPECIFIED API
88+
<feature-usage>
89+
<uses-feature name="Device.captureAudio" required="true" />
90+
<uses-feature name="Device.captureImage" required="true" />
91+
<uses-feature name="Device.captureVideo" required="true" />
92+
<uses-feature name="Device.getBarcodeValue" required="true" />
93+
<uses-feature name="Device.getCurrentPosition" required="true" />
94+
<uses-feature name="Device.pickFile" required="true" />
95+
<uses-feature name="Utility" required="true" />
96+
<uses-feature name="WebAPI" required="true" />
97+
</feature-usage>
98+
-->
99+
</control>
100+
</manifest>

0 commit comments

Comments
 (0)