diff --git a/browser/public/index.html b/browser/public/index.html index e2c3eb276..fc7edbbbb 100644 --- a/browser/public/index.html +++ b/browser/public/index.html @@ -966,6 +966,7 @@ Hiding Panes Overview Proximity Dock + Split Pane Fixed Size Styling Toggle Inner Dock Updating Panes diff --git a/package-lock.json b/package-lock.json index bb4c5768f..ace86ee78 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20,7 +20,7 @@ "@webcomponents/webcomponentsjs": "2.3.0", "core-js": "^3.6.5", "file-saver": "^2.0.2", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "igniteui-webcomponents": "5.1.2", "igniteui-webcomponents-charts": "5.1.0", "igniteui-webcomponents-core": "5.1.0", @@ -4177,16 +4177,6 @@ "node": ">=8" } }, - "node_modules/bindings": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/bindings/-/bindings-1.5.0.tgz", - "integrity": "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ==", - "dev": true, - "optional": true, - "dependencies": { - "file-uri-to-path": "1.0.0" - } - }, "node_modules/blocking-elements": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/blocking-elements/-/blocking-elements-0.1.1.tgz", @@ -6916,13 +6906,6 @@ "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz", "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==" }, - "node_modules/file-uri-to-path": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz", - "integrity": "sha512-0Zt+s3L7Vf1biwWZ29aARiVYLx7iMGnEUl9x33fbB/j3jR81u/O2LbqK+Bm1CDSNDKVtJ/YjwY7TUd5SkeLQLw==", - "dev": true, - "optional": true - }, "node_modules/fill-range": { "version": "7.0.1", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", @@ -7648,20 +7631,6 @@ "integrity": "sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==", "dev": true }, - "node_modules/fsevents": { - "version": "2.3.3", - "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", - "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", - "dev": true, - "hasInstallScript": true, - "optional": true, - "os": [ - "darwin" - ], - "engines": { - "node": "^8.16.0 || ^10.6.0 || >=11.0.0" - } - }, "node_modules/function-bind": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", @@ -7942,25 +7911,6 @@ "node": ">=0.10.0" } }, - "node_modules/glob-watcher/node_modules/fsevents": { - "version": "1.2.13", - "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.2.13.tgz", - "integrity": "sha512-oWb1Z6mkHIskLzEJ/XWX0srkpkTQ7vaopMQkyaEIoq0fmtFVxOthb8cCxeT+p3ynTdkk/RZwbgG4brR5BeWECw==", - "deprecated": "The v1 package contains DANGEROUS / INSECURE binaries. Upgrade to safe fsevents v2", - "dev": true, - "hasInstallScript": true, - "optional": true, - "os": [ - "darwin" - ], - "dependencies": { - "bindings": "^1.5.0", - "nan": "^2.12.1" - }, - "engines": { - "node": ">= 4.0" - } - }, "node_modules/glob-watcher/node_modules/glob-parent": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz", @@ -8770,9 +8720,9 @@ } }, "node_modules/igniteui-dockmanager": { - "version": "1.15.2", - "resolved": "https://registry.npmjs.org/igniteui-dockmanager/-/igniteui-dockmanager-1.15.2.tgz", - "integrity": "sha512-FtcWCbHhWfTuVZ1ltaiZstu88/O6NYny6BzkgVNELoLa/oqHCktjL6JoMTOC4a/QwDpoP3AMi+UmbvkQrE0fRQ==", + "version": "1.16.0-beta.5", + "resolved": "https://registry.npmjs.org/igniteui-dockmanager/-/igniteui-dockmanager-1.16.0-beta.5.tgz", + "integrity": "sha512-3a6UPb5edtIoEcIRhfpnrmrD1z9gub6FUoQPFxpSlc0nOZgN/Ci4aySlxYMPIahG+mbQ2z65axv2gryGTzpqRQ==", "dependencies": { "igniteui-trial-watermark": "^1.0.3" } @@ -10687,13 +10637,6 @@ "integrity": "sha512-r65nCZhrbXXb6dXOACihYApHw2Q6pV0M3V0PSxd74N0+D8nzAdEAITq2oAjA1jVnKI+tGvEBUpqiMh0+rW6zDQ==", "dev": true }, - "node_modules/nan": { - "version": "2.19.0", - "resolved": "https://registry.npmjs.org/nan/-/nan-2.19.0.tgz", - "integrity": "sha512-nO1xXxfh/RWNxfd/XPfbIfFk5vgLsAxUR9y5O0cHMJu/AW9U95JLXqthYHjEp+8gQ5p96K9jUp8nbVOxCdRbtw==", - "dev": true, - "optional": true - }, "node_modules/nanoid": { "version": "3.3.7", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz", diff --git a/package.json b/package.json index 1f6bcba37..c612659e6 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "@webcomponents/webcomponentsjs": "2.3.0", "core-js": "^3.6.5", "file-saver": "^2.0.2", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "igniteui-webcomponents": "5.1.2", "igniteui-webcomponents-charts": "5.1.0", "igniteui-webcomponents-core": "5.1.0", diff --git a/samples/layouts/dock-manager/add-content-runtime/package.json b/samples/layouts/dock-manager/add-content-runtime/package.json index 0e62202d2..330895480 100644 --- a/samples/layouts/dock-manager/add-content-runtime/package.json +++ b/samples/layouts/dock-manager/add-content-runtime/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "lit-html": "^3.2.0", "tslib": "^2.0.0" }, diff --git a/samples/layouts/dock-manager/contained-in-boundaries/package.json b/samples/layouts/dock-manager/contained-in-boundaries/package.json index ea302ad75..bf46fd67d 100644 --- a/samples/layouts/dock-manager/contained-in-boundaries/package.json +++ b/samples/layouts/dock-manager/contained-in-boundaries/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "lit-html": "^3.2.0", "tslib": "^2.0.0" }, diff --git a/samples/layouts/dock-manager/customize-buttons/package.json b/samples/layouts/dock-manager/customize-buttons/package.json index e2dded034..763d0ae91 100644 --- a/samples/layouts/dock-manager/customize-buttons/package.json +++ b/samples/layouts/dock-manager/customize-buttons/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "lit-html": "^3.2.0", "tslib": "^2.0.0" }, diff --git a/samples/layouts/dock-manager/embedding-frames/package.json b/samples/layouts/dock-manager/embedding-frames/package.json index 27c582f4c..f0545fe21 100644 --- a/samples/layouts/dock-manager/embedding-frames/package.json +++ b/samples/layouts/dock-manager/embedding-frames/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "igniteui-webcomponents-core": "5.1.0", "lit-html": "^3.2.0", "tslib": "^2.0.0" diff --git a/samples/layouts/dock-manager/focus-panes/package.json b/samples/layouts/dock-manager/focus-panes/package.json index 0e62202d2..330895480 100644 --- a/samples/layouts/dock-manager/focus-panes/package.json +++ b/samples/layouts/dock-manager/focus-panes/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "lit-html": "^3.2.0", "tslib": "^2.0.0" }, diff --git a/samples/layouts/dock-manager/hide-pane-headers/package.json b/samples/layouts/dock-manager/hide-pane-headers/package.json index 0e62202d2..330895480 100644 --- a/samples/layouts/dock-manager/hide-pane-headers/package.json +++ b/samples/layouts/dock-manager/hide-pane-headers/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "lit-html": "^3.2.0", "tslib": "^2.0.0" }, diff --git a/samples/layouts/dock-manager/hiding-panes/package.json b/samples/layouts/dock-manager/hiding-panes/package.json index 6990bff70..35af18ae9 100644 --- a/samples/layouts/dock-manager/hiding-panes/package.json +++ b/samples/layouts/dock-manager/hiding-panes/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "igniteui-webcomponents-core": "5.1.0", "lit-html": "^3.2.0", "tslib": "^2.0.0" diff --git a/samples/layouts/dock-manager/overview/package.json b/samples/layouts/dock-manager/overview/package.json index 0218b1c80..bfcda370e 100644 --- a/samples/layouts/dock-manager/overview/package.json +++ b/samples/layouts/dock-manager/overview/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "igniteui-webcomponents-core": "5.1.0", "lit-html": "^3.2.0", "tslib": "^2.0.0" diff --git a/samples/layouts/dock-manager/proximity-dock/package.json b/samples/layouts/dock-manager/proximity-dock/package.json index 953331cde..45efe3d07 100644 --- a/samples/layouts/dock-manager/proximity-dock/package.json +++ b/samples/layouts/dock-manager/proximity-dock/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "lit-html": "^3.2.0", "tslib": "^2.0.0" }, diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/.prettierrc b/samples/layouts/dock-manager/split-pane-fixed-size/.prettierrc new file mode 100644 index 000000000..15a7c7c6c --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/.prettierrc @@ -0,0 +1,11 @@ +{ + "printWidth": 250, + "tabWidth": 4, + "useTabs": false, + "semi": true, + "singleQuote": false, + "trailingComma": "none", + "bracketSpacing": true, + "jsxBracketSameLine": false, + "fluid": false +} \ No newline at end of file diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/ReadMe.md b/samples/layouts/dock-manager/split-pane-fixed-size/ReadMe.md new file mode 100644 index 000000000..73a5aaa36 --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/ReadMe.md @@ -0,0 +1,56 @@ + + + +This folder contains implementation of Web Components application with example of Split Pane Fixed Size feature using [Dock Manager](https://infragistics.com/webcomponentssite/components/general-getting-started.html) component. + + + + + + View Docs + + + View Code + + + Run Sample + + + Run Sample + + + + +## Branches + +> **_NOTE:_** You should use [master](https://github.com/IgniteUI/igniteui-angular-examples/tree/master) branch of this repository if you want to run samples on your computer. Use the [vnext](https://github.com/IgniteUI/igniteui-angular-examples/tree/vnext) branch only when you want to contribute new samples to this repository. + +## Instructions + +To set up this project locally, execute these commands: + +``` +git clone https://github.com/IgniteUI/igniteui-wc-examples.git +git checkout master +cd ./igniteui-wc-examples +cd ./samples/layouts/dock-manager/split-pane-fixed-size +``` + +open above folder in VS Code or type: +``` +code . +``` + +In terminal window, run: + +``` +npm install +npm run start +``` + +Then open http://localhost:4200/ in your browser + + +## Learn More + +To learn more about **Ignite UI for Web Components**, check out the [Web Components documentation](https://infragistics.com/webcomponentssite/components/general-getting-started.html). diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/index.html b/samples/layouts/dock-manager/split-pane-fixed-size/index.html new file mode 100644 index 000000000..c67c38b88 --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/index.html @@ -0,0 +1,30 @@ + + + + DockManagerSplitPaneFixedSize + + + + + + + + + + +
+
+ +
Relative size: 400
+
Relative size: 200
+
Fixed size: 400 px
+
Fixed size: 200 px
+
Floating pane
+
+
+
+ + + <% if (false) { %><% } %> + + diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/package.json b/samples/layouts/dock-manager/split-pane-fixed-size/package.json new file mode 100644 index 000000000..dc80fc489 --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/package.json @@ -0,0 +1,58 @@ +{ + "name": "wc-dock-manager-split-pane-fixed-size", + "version": "1.0.0", + "description": "This project provides example of Dock Manager Split Pane Fixed Size using IgniteUI for Web Components", + "main": "src/index.ts", + "scripts": { + "build": "npm run build:prod", + "build:dev": "webpack --mode development --config ./webpack.config.js --progress --color --display-error-details", + "build:prod": "webpack --env.NODE_ENV=production --mode production --config ./webpack.config.js --progress --color --display-error-details --bail", + "serve:dev": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --mode development --config ./webpack.config.js --hot --progress --open", + "serve:prod": "webpack-dev-server --env.NODE_ENV=production --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/", + "start": "npm run serve:dev", + "build:legacy": "npm run build:prod:legacy", + "build:dev:legacy": "webpack --env.legacy=true --mode development --config ./webpack.config.js --progress --color --display-error-details", + "build:prod:legacy": "webpack --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --progress --color --display-error-details --bail", + "serve:dev:legacy": "node --max-old-space-size=8192 node_modules/webpack-dev-server/bin/webpack-dev-server.js --env.legacy=true --mode development --config ./webpack.config.js --hot --progress --open", + "serve:prod:legacy": "webpack-dev-server --env.NODE_ENV=production --env.legacy=true --mode production --config ./webpack.config.js --port 3000 --host 0.0.0.0 --hot --progress --open --content-base dist/", + "start:legacy": "npm run serve:dev:legacy" + }, + "author": "Infragistics", + "dependencies": { + "@webcomponents/custom-elements": "^1.4.1", + "@webcomponents/template": "^1.4.2", + "babel-runtime": "^6.26.0", + "core-js": "^3.6.5", + "igniteui-dockmanager": "1.16.0-beta.5", + "lit-html": "^3.2.0", + "tslib": "^2.0.0" + }, + "devDependencies": { + "@babel/cli": "^7.8.3", + "@babel/core": "^7.8.3", + "@babel/plugin-proposal-class-properties": "^7.8.3", + "@babel/plugin-transform-runtime": "^7.10.0", + "@babel/preset-env": "^7.8.3", + "@babel/preset-typescript": "^7.8.3", + "@types/source-map": "^0.5.7", + "babel-loader": "^8.1.0", + "babel-plugin-transform-custom-element-classes": "^0.1.0", + "css-loader": "^1.0.0", + "csv-loader": "^3.0.2", + "file-loader": "^4.2.0", + "fork-ts-checker-webpack-plugin": "^4.1.5", + "html-webpack-plugin": "^4.3.0", + "parcel-bundler": "^1.6.1", + "source-map": "^0.7.3", + "style-loader": "^0.22.1", + "tsconfig-paths-webpack-plugin": "^4.0.0", + "typescript": "^4.4.4", + "webpack": "^5.96.1", + "webpack-cli": "^4.10.0", + "webpack-dev-server": "^4.11.1", + "worker-loader": "^3.0.8", + "xml-loader": "^1.2.1" + }, + "license": "", + "homepage": "." +} diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/sandbox.config.json b/samples/layouts/dock-manager/split-pane-fixed-size/sandbox.config.json new file mode 100644 index 000000000..5c5b54fe2 --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/sandbox.config.json @@ -0,0 +1,7 @@ +{ + "infiniteLoopProtection": false, + "hardReloadOnChange": false, + "view": "browser", + "template": "parcel" +} + \ No newline at end of file diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/src/DockManagerStyles.css b/samples/layouts/dock-manager/split-pane-fixed-size/src/DockManagerStyles.css new file mode 100644 index 000000000..f73747ac5 --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/src/DockManagerStyles.css @@ -0,0 +1,9 @@ + +igc-dockmanager > div { + padding: 0.5rem; + height: calc(100% - 1rem); + width: calc(100% - 1rem); + display: flex; + flex-direction: column; + /* background: orange; */ +} diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/src/index.css b/samples/layouts/dock-manager/split-pane-fixed-size/src/index.css new file mode 100644 index 000000000..0fe936871 --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/src/index.css @@ -0,0 +1,2 @@ +/* shared styles are loaded from: */ +/* https://static.infragistics.com/xplatform/css/samples */ \ No newline at end of file diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/src/index.ts b/samples/layouts/dock-manager/split-pane-fixed-size/src/index.ts new file mode 100644 index 000000000..5382983e6 --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/src/index.ts @@ -0,0 +1,85 @@ +import './DockManagerStyles.css' +import { defineCustomElements } from 'igniteui-dockmanager/loader'; +import { + IgcDockManagerPaneType, + IgcSplitPaneOrientation, + IgcDockManagerComponent +} from 'igniteui-dockmanager'; + +defineCustomElements(); + +export class DockManagerSplitPaneFixedSize { + private dockManager: IgcDockManagerComponent; + + constructor() { + this.dockManager = document.getElementById('dockManager') as IgcDockManagerComponent; + this.dockManager.dir = 'ltr'; + + this.dockManager.layout = { + rootPane: { + type: IgcDockManagerPaneType.splitPane, + orientation: IgcSplitPaneOrientation.vertical, + useFixedSize: true, + panes: [ + { + type: IgcDockManagerPaneType.splitPane, + orientation: IgcSplitPaneOrientation.horizontal, + size: 300, // Size will be applied in pixels + panes: [ + { + type: IgcDockManagerPaneType.contentPane, + contentId: 'content1', + header: 'Pane 1', + size: 400 // Size will be relative to siblings + }, + { + type: IgcDockManagerPaneType.contentPane, + contentId: 'content2', + header: 'Pane 2', + size: 200 // Size will be relative to siblings + } + ] + }, + { + type: IgcDockManagerPaneType.splitPane, + orientation: IgcSplitPaneOrientation.horizontal, + size: 200, // Size will be applied in pixels + useFixedSize: true, + panes: [ + { + type: IgcDockManagerPaneType.contentPane, + contentId: 'content3', + header: 'Pane 3', + size: 400 // Size will be applied in pixels + }, + { + type: IgcDockManagerPaneType.contentPane, + contentId: 'content4', + header: 'Pane 4', + size: 200 // Size will be applied in pixels + } + ] + } + ] + }, + floatingPanes: [ + { + type: IgcDockManagerPaneType.splitPane, + orientation: IgcSplitPaneOrientation.horizontal, + floatingLocation: { x: 250, y: 100 }, + floatingWidth: 250, + floatingHeight: 150, + panes: [ + { + type: IgcDockManagerPaneType.contentPane, + contentId: "content5", + header: "Pane 5" + } + ] + } + ] + }; + } +} + +new DockManagerSplitPaneFixedSize(); diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/tsconfig.json b/samples/layouts/dock-manager/split-pane-fixed-size/tsconfig.json new file mode 100644 index 000000000..de23257dd --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/tsconfig.json @@ -0,0 +1,20 @@ +{ + "compilerOptions": { + "noImplicitReturns": true, + "esModuleInterop": true, + "noImplicitAny": true, + "declarationDir": "dist/types", + "moduleResolution": "node", + "declaration": true, + "target": "es2015", + "module": "es2015", + "strict": true + }, + "include": [ + "src/**/*" + ], + "exclude": [ + "node_modules", + "dist" + ] +} \ No newline at end of file diff --git a/samples/layouts/dock-manager/split-pane-fixed-size/webpack.config.js b/samples/layouts/dock-manager/split-pane-fixed-size/webpack.config.js new file mode 100644 index 000000000..9d11a6155 --- /dev/null +++ b/samples/layouts/dock-manager/split-pane-fixed-size/webpack.config.js @@ -0,0 +1,105 @@ +const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); +const HtmlWebpackPlugin = require('html-webpack-plugin'); +const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin'); +const path = require('path'); +const webpack = require('webpack'); + +module.exports = env => { + const nodeEnv = process.env.NODE_ENV || 'development'; + const isProd = nodeEnv === 'production'; + const isLegacy = !!process.env.legacy && !(process.env.legacy == "false"); + console.log(">> webpack nodeEnv=" + nodeEnv); + console.log(">> webpack isProd=" + isProd); + console.log(">> webpack isLegacy=" + isLegacy); + const presets = [ + ["@babel/preset-env", { + "useBuiltIns": "usage", + "corejs": 3, + "targets": { + "browsers": isLegacy ? ["defaults"] : [ + "last 2 Chrome versions", + "last 2 Safari versions", + "last 2 iOS versions", + "last 2 Firefox versions", + "last 2 Edge versions"] + } + }], + "@babel/preset-typescript" + ]; + + return { + entry: isLegacy ? [ + path.resolve(__dirname, 'node_modules/@webcomponents/custom-elements'), + path.resolve(__dirname, 'node_modules/@webcomponents/template'), + path.resolve(__dirname, 'src') + ] : path.resolve(__dirname, 'src'), + devtool: isProd ? false : 'source-map', + output: { + filename: isProd ? '[fullhash].bundle.js' : '[fullhash].bundle.js', + globalObject: 'this', + path: path.resolve(__dirname, 'dist'), + }, + + resolve: { + mainFields: ['esm2015', 'module', 'main'], + extensions: ['.ts', '.js', '.json'], + plugins: [new TsconfigPathsPlugin({ + configFile: './tsconfig.json', + extensions: ['.ts', '.js'], + mainFields: ['esm2015', 'module', 'main'] + })] + }, + + module: { + rules: [ + { test: /\.(png|svg|jpg|gif)$/, use: ['file-loader'] }, + { test: /\.(csv|tsv)$/, use: ['csv-loader'] }, + { test: /\.xml$/, use: ['xml-loader'] }, + { test: /\.css$/, sideEffects: true, use: ['style-loader', 'css-loader'] }, + { + test: /worker\.(ts|js)$/, + use: [ + { loader: 'worker-loader' }, + { + loader: 'babel-loader', options: { + "compact": isProd ? true : false, + "presets": presets, + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-transform-runtime" + ] + } + } + ] + }, + { + test: /\.(ts|js)$/, loader: 'babel-loader', + options: { + "compact": isProd ? true : false, + "presets": presets, + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-transform-runtime" + ] + }, + exclude: + function (modulePath) { + return /node_modules/.test(modulePath) && + !/igniteui-webcomponents/.test(modulePath) && + !/lit-html/.test(modulePath); + } + }], + }, + + plugins: [ + new webpack.DefinePlugin({ + 'process.env.NODE_ENV': JSON.stringify(nodeEnv) + }), + new HtmlWebpackPlugin({ + title: 'for-cs', + template: 'index.html' + }), + new ForkTsCheckerWebpackPlugin() + ] + }; +}; diff --git a/samples/layouts/dock-manager/styling/package.json b/samples/layouts/dock-manager/styling/package.json index 6406fd3a4..60dc91542 100644 --- a/samples/layouts/dock-manager/styling/package.json +++ b/samples/layouts/dock-manager/styling/package.json @@ -24,7 +24,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "igniteui-webcomponents": "5.1.2", "igniteui-webcomponents-core": "5.1.0", "lit-html": "^3.2.0", diff --git a/samples/layouts/dock-manager/toggle-inner-dock/package.json b/samples/layouts/dock-manager/toggle-inner-dock/package.json index f03b4cc69..37a9aaa5f 100644 --- a/samples/layouts/dock-manager/toggle-inner-dock/package.json +++ b/samples/layouts/dock-manager/toggle-inner-dock/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "lit-html": "^3.2.0", "tslib": "^2.0.0" }, diff --git a/samples/layouts/dock-manager/updating-panes/package.json b/samples/layouts/dock-manager/updating-panes/package.json index 8b37b826a..481cc4ca0 100644 --- a/samples/layouts/dock-manager/updating-panes/package.json +++ b/samples/layouts/dock-manager/updating-panes/package.json @@ -23,7 +23,7 @@ "@webcomponents/template": "^1.4.2", "babel-runtime": "^6.26.0", "core-js": "^3.6.5", - "igniteui-dockmanager": "1.15.2", + "igniteui-dockmanager": "1.16.0-beta.5", "igniteui-webcomponents-charts": "5.1.0", "igniteui-webcomponents-core": "5.1.0", "igniteui-webcomponents-gauges": "5.1.0",