From da31fe85740a5ff7013504c235ff03d42393c75f Mon Sep 17 00:00:00 2001 From: Dmitry Kurmanov Date: Fri, 22 Nov 2024 14:17:43 +0400 Subject: [PATCH] PR: Library: V2: Icons: Issues: move out from core (#9047) --- .../tsconfig.typing.angular.json | 6 +++ build-scripts/survey-core/tsconfig.icons.json | 18 +++++++ .../survey-core/webpack.icons.config.js | 30 +++++++++++ .../tsconfig.typing.jquery-ui.json | 6 +++ .../survey-jquery/tsconfig.typing.jquery.json | 6 +++ build-scripts/survey-js-ui/tsconfig.json | 6 +++ .../tsconfig.typing.ko-ui.json | 6 +++ .../survey-knockout/tsconfig.typing.ko.json | 6 +++ build-scripts/survey-react-ui/tsconfig.json | 6 +++ .../survey-react/tsconfig.typing.react.json | 6 +++ .../survey-vue-ui/tsconfig.typing.vue-ui.json | 6 +++ .../survey-vue/tsconfig.typing.vue.json | 6 +++ build-scripts/tsconfig.json | 28 ++++++++-- build-scripts/tsconfig.tests.json | 6 +++ build-scripts/webpack.common.js | 4 ++ package.json | 5 +- .../survey-angular-ui/src/survey.component.ts | 9 +++- .../src/svgbundle.component.ts | 16 ++++-- packages/survey-core/src/iconsV1.ts | 8 +++ packages/survey-core/src/iconsV2.ts | 8 +++ packages/survey-core/src/settings.ts | 1 - packages/survey-core/src/survey.ts | 12 ----- packages/survey-core/src/svgbundle.ts | 54 +++++++++++++------ packages/survey-core/webpack.config.js | 1 - packages/survey-react-ui/src/reactSurvey.tsx | 9 +++- packages/survey-react-ui/src/svgbundle.tsx | 11 +++- packages/survey-vue3-ui/src/Survey.vue | 12 ++++- packages/survey-vue3-ui/src/SvgBundle.vue | 13 ++++- src/knockout/kosurvey.ts | 9 +++- src/vue/survey.vue | 7 ++- tsconfig.json | 6 +++ 31 files changed, 276 insertions(+), 51 deletions(-) create mode 100644 build-scripts/survey-core/tsconfig.icons.json create mode 100644 build-scripts/survey-core/webpack.icons.config.js create mode 100644 packages/survey-core/src/iconsV1.ts create mode 100644 packages/survey-core/src/iconsV2.ts diff --git a/build-scripts/survey-angular/tsconfig.typing.angular.json b/build-scripts/survey-angular/tsconfig.typing.angular.json index bb47e4645f..cfb849c858 100644 --- a/build-scripts/survey-angular/tsconfig.typing.angular.json +++ b/build-scripts/survey-angular/tsconfig.typing.angular.json @@ -12,6 +12,12 @@ "paths": { "survey-core": [ "../../src/entries/core.ts" + ], + "@coreIconsV1": [ + "../../packages/survey-core/src/iconsV1" + ], + "@coreIconsV2": [ + "../../packages/survey-core/src/iconsV2" ] }, "sourceMap": false, diff --git a/build-scripts/survey-core/tsconfig.icons.json b/build-scripts/survey-core/tsconfig.icons.json new file mode 100644 index 0000000000..f8979f0bad --- /dev/null +++ b/build-scripts/survey-core/tsconfig.icons.json @@ -0,0 +1,18 @@ +{ + "extends": "../tsconfig.json", + "compilerOptions": { + "baseUrl": ".", + "paths": { + "survey-core": [ + "../../build/survey-core" + ] + }, + "declaration": true, + "declarationDir": "../../build/survey-core/icons/" + }, + "include": [ + "../../packages/survey-core/src/iconsV1.ts", + "../../packages/survey-core/src/iconsV2.ts", + ], + "exclude": [], +} \ No newline at end of file diff --git a/build-scripts/survey-core/webpack.icons.config.js b/build-scripts/survey-core/webpack.icons.config.js new file mode 100644 index 0000000000..b0fab92c81 --- /dev/null +++ b/build-scripts/survey-core/webpack.icons.config.js @@ -0,0 +1,30 @@ +"use strict"; + +const webpackCommonConfigCreator = require("../webpack.common"); +const { merge } = require("webpack-merge"); +var FixStyleOnlyEntriesPlugin = require("webpack-fix-style-only-entries"); +var path = require("path"); + +const config = { + entry: { + "iconsV1": path.resolve(__dirname, "../../packages/survey-core/src/iconsV1.ts"), + "iconsV2": path.resolve(__dirname, "../../packages/survey-core/src/iconsV2.ts"), + }, + plugins: [new FixStyleOnlyEntriesPlugin()], + externals: { + "survey-core": { + root: "Survey", + commonjs2: "survey-core", + commonjs: "survey-core", + amd: "survey-core" + } + } +}; + +module.exports = function (options) { + options.platform = ""; + options.libraryName = "SurveyIcons"; + options.tsConfigFile = path.resolve(__dirname, "./tsconfig.icons.json") + + return merge(webpackCommonConfigCreator(options, { "name": "survey-icons" }, "survey.icons", "survey-core/icons"), config); +}; diff --git a/build-scripts/survey-jquery-ui/tsconfig.typing.jquery-ui.json b/build-scripts/survey-jquery-ui/tsconfig.typing.jquery-ui.json index 6c4de79444..0cec6c2970 100644 --- a/build-scripts/survey-jquery-ui/tsconfig.typing.jquery-ui.json +++ b/build-scripts/survey-jquery-ui/tsconfig.typing.jquery-ui.json @@ -12,6 +12,12 @@ "paths": { "survey-core": [ "../../build/survey-core" + ], + "@coreIconsV1": [ + "../../build/survey-core/icons/iconsV1" + ], + "@coreIconsV2": [ + "../../build/survey-core/icons/iconsV2" ] }, "sourceMap": false, diff --git a/build-scripts/survey-jquery/tsconfig.typing.jquery.json b/build-scripts/survey-jquery/tsconfig.typing.jquery.json index fee7db2e5e..e0a2ddfb32 100644 --- a/build-scripts/survey-jquery/tsconfig.typing.jquery.json +++ b/build-scripts/survey-jquery/tsconfig.typing.jquery.json @@ -12,6 +12,12 @@ "paths": { "survey-core": [ "../../src/entries/core.ts" + ], + "@coreIconsV1": [ + "../../packages/survey-core/src/iconsV1" + ], + "@coreIconsV2": [ + "../../packages/survey-core/src/iconsV2" ] }, "sourceMap": false, diff --git a/build-scripts/survey-js-ui/tsconfig.json b/build-scripts/survey-js-ui/tsconfig.json index c9c3d755d5..11c6d6809a 100644 --- a/build-scripts/survey-js-ui/tsconfig.json +++ b/build-scripts/survey-js-ui/tsconfig.json @@ -6,6 +6,12 @@ "survey-core": [ "../../build/survey-core" ], + "@coreIconsV1": [ + "../../build/survey-core/icons/iconsV1" + ], + "@coreIconsV2": [ + "../../build/survey-core/icons/iconsV2" + ] }, "declaration": true, "declarationDir": "../../build/survey-js-ui/typings", diff --git a/build-scripts/survey-knockout-ui/tsconfig.typing.ko-ui.json b/build-scripts/survey-knockout-ui/tsconfig.typing.ko-ui.json index f99a1d7fce..11da4a8903 100644 --- a/build-scripts/survey-knockout-ui/tsconfig.typing.ko-ui.json +++ b/build-scripts/survey-knockout-ui/tsconfig.typing.ko-ui.json @@ -12,6 +12,12 @@ "paths": { "survey-core": [ "../../build/survey-core" + ], + "@coreIconsV1": [ + "../../build/survey-core/icons/iconsV1" + ], + "@coreIconsV2": [ + "../../build/survey-core/icons/iconsV2" ] }, "sourceMap": false, diff --git a/build-scripts/survey-knockout/tsconfig.typing.ko.json b/build-scripts/survey-knockout/tsconfig.typing.ko.json index 04490b253a..b912ced94b 100644 --- a/build-scripts/survey-knockout/tsconfig.typing.ko.json +++ b/build-scripts/survey-knockout/tsconfig.typing.ko.json @@ -12,6 +12,12 @@ "paths": { "survey-core": [ "../../src/entries/core.ts" + ], + "@coreIconsV1": [ + "../../packages/survey-core/src/iconsV1" + ], + "@coreIconsV2": [ + "../../packages/survey-core/src/iconsV2" ] }, "sourceMap": false, diff --git a/build-scripts/survey-react-ui/tsconfig.json b/build-scripts/survey-react-ui/tsconfig.json index 17a7614696..daaf7ceaff 100644 --- a/build-scripts/survey-react-ui/tsconfig.json +++ b/build-scripts/survey-react-ui/tsconfig.json @@ -6,6 +6,12 @@ "paths": { "survey-core": [ "../../build/survey-core" + ], + "@coreIconsV1": [ + "../../build/survey-core/icons/iconsV1" + ], + "@coreIconsV2": [ + "../../build/survey-core/icons/iconsV2" ] }, "declaration": true, diff --git a/build-scripts/survey-react/tsconfig.typing.react.json b/build-scripts/survey-react/tsconfig.typing.react.json index b7584de744..d65c69877e 100644 --- a/build-scripts/survey-react/tsconfig.typing.react.json +++ b/build-scripts/survey-react/tsconfig.typing.react.json @@ -12,6 +12,12 @@ "paths": { "survey-core": [ "../../src/entries/core.ts" + ], + "@coreIconsV1": [ + "../../packages/survey-core/src/iconsV1" + ], + "@coreIconsV2": [ + "../../packages/survey-core/src/iconsV2" ] }, "sourceMap": false, diff --git a/build-scripts/survey-vue-ui/tsconfig.typing.vue-ui.json b/build-scripts/survey-vue-ui/tsconfig.typing.vue-ui.json index 922e879690..e328fa6a55 100644 --- a/build-scripts/survey-vue-ui/tsconfig.typing.vue-ui.json +++ b/build-scripts/survey-vue-ui/tsconfig.typing.vue-ui.json @@ -12,6 +12,12 @@ "paths": { "survey-core": [ "../../build/survey-core" + ], + "@coreIconsV1": [ + "../../build/survey-core/icons/iconsV1" + ], + "@coreIconsV2": [ + "../../build/survey-core/icons/iconsV2" ] }, "types": [ diff --git a/build-scripts/survey-vue/tsconfig.typing.vue.json b/build-scripts/survey-vue/tsconfig.typing.vue.json index fdd067c55f..67ba456416 100644 --- a/build-scripts/survey-vue/tsconfig.typing.vue.json +++ b/build-scripts/survey-vue/tsconfig.typing.vue.json @@ -12,6 +12,12 @@ "paths": { "survey-core": [ "../../src/entries/core.ts" + ], + "@coreIconsV1": [ + "../../packages/survey-core/src/iconsV1" + ], + "@coreIconsV2": [ + "../../packages/survey-core/src/iconsV2" ] }, "types": [ diff --git a/build-scripts/tsconfig.json b/build-scripts/tsconfig.json index e1fc3e14d4..7f57f41527 100644 --- a/build-scripts/tsconfig.json +++ b/build-scripts/tsconfig.json @@ -2,15 +2,33 @@ "compilerOptions": { "target": "es5", "module": "es2015", - "lib": ["DOM", "ES5", "ES6", "ES2015.Promise"], + "lib": [ + "DOM", + "ES5", + "ES6", + "ES2015.Promise" + ], "sourceMap": true, "noImplicitAny": true, "importHelpers": false, "experimentalDecorators": true, "moduleResolution": "node", "allowSyntheticDefaultImports": true, - "jsx": "react" + "jsx": "react", + "baseUrl": ".", + "paths": { + "@coreIconsV1": [ + "../build/survey-core/icons/iconsV1.d.ts" + ], + "@coreIconsV2": [ + "../build/survey-core/icons/iconsV2.d.ts" + ] + } }, - "exclude": ["../src/entries/**/*.ts"], - "include": ["../src/**/*.ts"] -} + "exclude": [ + "../src/entries/**/*.ts" + ], + "include": [ + "../src/**/*.ts" + ] +} \ No newline at end of file diff --git a/build-scripts/tsconfig.tests.json b/build-scripts/tsconfig.tests.json index 9b35cf408c..cd2a3c2866 100644 --- a/build-scripts/tsconfig.tests.json +++ b/build-scripts/tsconfig.tests.json @@ -7,6 +7,12 @@ "survey-core": [ "../src/entries/core.ts" ], + "@coreIconsV1": [ + "../packages/survey-core/src/iconsV1" + ], + "@coreIconsV2": [ + "../packages/survey-core/src/iconsV2" + ], "@legacy/*": [ "../src/*" ] diff --git a/build-scripts/webpack.common.js b/build-scripts/webpack.common.js index 6c437f0b2a..a77fae93d1 100644 --- a/build-scripts/webpack.common.js +++ b/build-scripts/webpack.common.js @@ -123,6 +123,10 @@ module.exports = function (options, packageJson, chunkName, buildFolderName) { resolve: { extensions: [".ts", ".js", ".tsx", ".scss"], plugins: [new TsconfigPathsPlugin({ configFile: options.tsConfigFile || "./tsconfig.json" })], + alias: { + "@coreIconsV1": path.resolve(__dirname, "../build/survey-core/icons/iconsV1.js"), + "@coreIconsV2": path.resolve(__dirname, "../build/survey-core/icons/iconsV2.js"), + }, }, optimization: { minimize: isProductionBuild, diff --git a/package.json b/package.json index 1c2916be6c..29be15affe 100644 --- a/package.json +++ b/package.json @@ -55,13 +55,16 @@ "build_react_ui": "webpack --config ./build-scripts/survey-react-ui/webpack.config.js --env.buildType dev && webpack --config ./build-scripts/survey-react-ui/webpack.config.js --env.buildType prod", "build_vue": "npm run build_vue_dev && npm run build_vue_prod", "build_vue_ui": "webpack --config ./build-scripts/survey-vue-ui/webpack.config.js --env.buildType dev && webpack --config ./build-scripts/survey-vue-ui/webpack.config.js --env.buildType prod", - "build_core": "npm run build_core_dev && npm run build_core_prod && npm run build-themes && rimraf build/survey-core/ts3.4 && downlevel-dts build/survey-core build/survey-core/ts3.4", + "build_core": "npm run build_core_dev && npm run build_core_prod && npm run build-themes && npm run build-icons && rimraf build/survey-core/ts3.4 && downlevel-dts build/survey-core build/survey-core/ts3.4", "build-plugins": "npm run build-plugins-dev && npm run build-plugins-prod", "build-plugins-dev": "concurrently \"webpack --config ./build-scripts/survey-core/webpack.plugins.bootstrap.config.js --env.buildType dev\" \"webpack --config ./build-scripts/survey-core/webpack.plugins.bootstrap.material.config.js --env.buildType dev\"", "build-plugins-prod": "concurrently \"webpack --config ./build-scripts/survey-core/webpack.plugins.bootstrap.config.js --env.buildType prod\" \"webpack --config ./build-scripts/survey-core/webpack.plugins.bootstrap.material.config.js --env.buildType prod\"", "build-themes": "npm run build-themes-dev && npm run build-themes-prod", "build-themes-dev": "webpack --config ./build-scripts/survey-core/webpack.themes.config.js --env.buildType dev", "build-themes-prod": "webpack --config ./build-scripts/survey-core/webpack.themes.config.js --env.buildType prod", + "build-icons": "npm run build-icons-dev && npm run build-icons-prod", + "build-icons-dev": "webpack --config ./build-scripts/survey-core/webpack.icons.config.js --env.buildType dev", + "build-icons-prod": "webpack --config ./build-scripts/survey-core/webpack.icons.config.js --env.buildType prod", "build_i18n": "npm run build_i18n_dev && npm run build_i18n_prod", "build_jquery": "npm run build_jquery_dev && npm run build_jquery_prod", "build_jquery_ui": "npm run build_jquery_ui_dev && npm run build_jquery_ui_prod", diff --git a/packages/survey-angular-ui/src/survey.component.ts b/packages/survey-angular-ui/src/survey.component.ts index 95c83ee52a..42262d81ca 100644 --- a/packages/survey-angular-ui/src/survey.component.ts +++ b/packages/survey-angular-ui/src/survey.component.ts @@ -1,6 +1,13 @@ import { ChangeDetectorRef, Component, Input } from "@angular/core"; -import { SurveyModel } from "survey-core"; +import { SurveyModel, SvgRegistry, addIconsToThemeSet } from "survey-core"; import { BaseAngular } from "./base-angular"; + +import { icons as iconsV1 } from "survey-core/icons/iconsV1"; +import { icons as iconsV2 } from "survey-core/icons/iconsV2"; +addIconsToThemeSet("v1", iconsV1); +addIconsToThemeSet("v2", iconsV2); + +SvgRegistry.registerIcons(iconsV1); @Component({ selector: "survey", template: "" diff --git a/packages/survey-angular-ui/src/svgbundle.component.ts b/packages/survey-angular-ui/src/svgbundle.component.ts index 3c2c4d8d35..8fdda2a501 100644 --- a/packages/survey-angular-ui/src/svgbundle.component.ts +++ b/packages/survey-angular-ui/src/svgbundle.component.ts @@ -1,13 +1,23 @@ import { SvgRegistry } from "survey-core"; -import { Component, ElementRef, OnInit, ViewChild } from "@angular/core"; +import { Component, ElementRef, OnDestroy, OnInit, ViewChild } from "@angular/core"; @Component({ selector: "sv-svg-bundle", template: "", styles: [":host { display: none; }"] }) -export class SvgBundleComponent implements OnInit { +export class SvgBundleComponent implements OnInit, OnDestroy { @ViewChild("svgContainer", { static: true }) svgContainer!: ElementRef; + private onIconsChanged = () => { + if (!!this.svgContainer?.nativeElement) { + this.svgContainer.nativeElement.innerHTML = SvgRegistry.iconsRenderedHtml(); + } + } ngOnInit(): void { - this.svgContainer.nativeElement.innerHTML = SvgRegistry.iconsRenderedHtml(); + this.onIconsChanged(); + SvgRegistry.onIconsChanged.add(this.onIconsChanged); + } + ngOnDestroy(): void { + SvgRegistry.onIconsChanged.remove(this.onIconsChanged); } + } \ No newline at end of file diff --git a/packages/survey-core/src/iconsV1.ts b/packages/survey-core/src/iconsV1.ts new file mode 100644 index 0000000000..4614e173dc --- /dev/null +++ b/packages/survey-core/src/iconsV1.ts @@ -0,0 +1,8 @@ +const path = (require as any).context("./images-v1/", true, /\.svg$/); + +const icons: { [index: string]: string } = {}; +path.keys().forEach((key: string) => { + icons[key.substring(2, key.length - 4).toLowerCase()] = path(key); +}); + +export { icons }; diff --git a/packages/survey-core/src/iconsV2.ts b/packages/survey-core/src/iconsV2.ts new file mode 100644 index 0000000000..0e90de9474 --- /dev/null +++ b/packages/survey-core/src/iconsV2.ts @@ -0,0 +1,8 @@ +const path = (require as any).context("./images-v2/", true, /\.svg$/); + +const icons: { [index: string]: string } = {}; +path.keys().forEach((key: string) => { + icons[key.substring(2, key.length - 4).toLowerCase()] = path(key); +}); + +export { icons }; diff --git a/packages/survey-core/src/settings.ts b/packages/survey-core/src/settings.ts index c56a052465..6fcb0e4a98 100644 --- a/packages/survey-core/src/settings.ts +++ b/packages/survey-core/src/settings.ts @@ -827,5 +827,4 @@ export var settings = { * @see [settings.serialization](https://surveyjs.io/form-library/documentation/api-reference/settings#serialization) */ parseNumber: (stringValue: any, numericValue: number): number => { return numericValue; }, - useLegacyIcons: true }; \ No newline at end of file diff --git a/packages/survey-core/src/survey.ts b/packages/survey-core/src/survey.ts index 578bb0d76b..b76af45454 100644 --- a/packages/survey-core/src/survey.ts +++ b/packages/survey-core/src/survey.ts @@ -83,7 +83,6 @@ import { SurveyTaskManagerModel } from "./surveyTaskManager"; import { ProgressButtons } from "./progress-buttons"; import { TOCModel } from "./surveyToc"; import { DomDocumentHelper, DomWindowHelper } from "./global_variables_utils"; -import { svgBundle, SvgRegistry } from "./svgbundle"; /** * The `SurveyModel` object contains properties and methods that allow you to control the survey and access its elements. @@ -1078,7 +1077,6 @@ export class SurveyModel extends SurveyElementCore }); this.locTitle.onStringChanged.add(() => this.titleIsEmpty = this.locTitle.isEmpty); - this.registerIcons(); } processClosedPopup(question: IQuestion, popupModel: PopupModel): void { @@ -7996,16 +7994,6 @@ export class SurveyModel extends SurveyElementCore } } public questionErrorComponent = "sv-question-error"; - - protected registerIcons() { - let path; - if (settings.useLegacyIcons) { - path = svgBundle.V1; - } else { - path = svgBundle.V2; - } - SvgRegistry.registerIconsFromFolder(path); - } } function isStrCiEqual(a: string, b: string) { diff --git a/packages/survey-core/src/svgbundle.ts b/packages/survey-core/src/svgbundle.ts index 84d2961e82..f22f9f4cd2 100644 --- a/packages/survey-core/src/svgbundle.ts +++ b/packages/survey-core/src/svgbundle.ts @@ -1,9 +1,11 @@ -import { DomDocumentHelper } from "./global_variables_utils"; import { renamedIcons } from "./utils/utils"; +import { DomDocumentHelper } from "./global_variables_utils"; +import { EventBase } from "./base"; -class SvgIconData { - [key: string]: string +interface SvgIconData { + [key: string]: string; } + export class SvgIconRegistry { icons: SvgIconData = {}; private iconPrefix = "icon-"; @@ -17,7 +19,7 @@ export class SvgIconRegistry { this.icons[iconId] = iconSymbolSvg; } public registerIconFromSvgViaElement(iconId: string, iconSvg: string, iconPrefix: string = this.iconPrefix): void { - if(!DomDocumentHelper.isAvailable()) return; + if (!DomDocumentHelper.isAvailable()) return; iconId = this.processId(iconId, iconPrefix); let divSvg = DomDocumentHelper.createElement("div"); divSvg.innerHTML = iconSvg; @@ -39,31 +41,49 @@ export class SvgIconRegistry { iconSvg = iconSvg.trim(); const str = iconSvg.toLowerCase(); - if(str.substring(0, startStr.length) === startStr && - str.substring(str.length - endStr.length, str.length) === endStr) { + if (str.substring(0, startStr.length) === startStr && + str.substring(str.length - endStr.length, str.length) === endStr) { this.registerIconFromSymbol(iconId, ""); + "id=\"" + iconPrefix + iconId + "\" " + + iconSvg.substring(startStr.length, str.length - endStr.length) + + ""); return true; } - else{ + else { return false; } } - public registerIconsFromFolder(r: any) { + // TODO: remove in V2 + public registerIconsFromFolder(r: any): void { r.keys().forEach((key: string) => { this.registerIconFromSvg(key.substring(2, key.length - 4).toLowerCase(), r(key)); }); } - public iconsRenderedHtml() { + public registerIcons(icons: SvgIconData): void { + for (const iconId in icons) { + this.registerIconFromSvg(iconId, icons[iconId]); + } + this.updateMarkup(); + } + public iconsRenderedHtml(): string { return Object.keys(this.icons).map(icon => this.icons[icon]).join(""); } + public updateMarkup(): void { + this.onIconsChanged.fire(this, {}); + } + public onIconsChanged = new EventBase() } -export var SvgRegistry: SvgIconRegistry = new SvgIconRegistry(); -export var SvgBundleViewModel: any; -export var svgBundle: {V1?: string, V2?: string} = {}; -svgBundle.V1 = (require).context("./images-v1", true, /\.svg$/); -svgBundle.V2 = (require).context("./images-v2", true, /\.svg$/); +export const SvgRegistry: SvgIconRegistry = new SvgIconRegistry(); +export const SvgThemeSets: { [index: string]: SvgIconData } = {}; + +export function addIconsToThemeSet(name: string, iconsData: SvgIconData): void { + if(!SvgThemeSets[name]) { + SvgThemeSets[name] = {}; + } + const set = SvgThemeSets[name]; + for (const iconId in iconsData) { + set[iconId] = iconsData[iconId]; + } +} diff --git a/packages/survey-core/webpack.config.js b/packages/survey-core/webpack.config.js index fef1c97ae2..0a147c8156 100644 --- a/packages/survey-core/webpack.config.js +++ b/packages/survey-core/webpack.config.js @@ -52,7 +52,6 @@ var buildPlatformJson = { }; module.exports = function (options) { - debugger; var buildPath = __dirname + "/build/"; var isProductionBuild = options.buildType === "prod"; diff --git a/packages/survey-react-ui/src/reactSurvey.tsx b/packages/survey-react-ui/src/reactSurvey.tsx index 805d7aab93..8bac92edcb 100644 --- a/packages/survey-react-ui/src/reactSurvey.tsx +++ b/packages/survey-react-ui/src/reactSurvey.tsx @@ -1,9 +1,8 @@ import * as React from "react"; -import { Base, Question, PageModel, SurveyError, StylesManager, surveyCss, Helpers, doKey2ClickUp, SvgRegistry, SurveyModel, doKey2ClickBlur, doKey2ClickDown, IAttachKey2clickOptions } from "survey-core"; +import { Base, Question, PageModel, SurveyError, StylesManager, surveyCss, Helpers, doKey2ClickUp, SurveyModel, doKey2ClickBlur, doKey2ClickDown, IAttachKey2clickOptions, SvgRegistry, addIconsToThemeSet } from "survey-core"; import { SurveyPage } from "./page"; import { ISurveyCreator } from "./reactquestion"; import { SurveyElementBase } from "./reactquestion_element"; -import { SurveyLocStringViewer } from "./string-viewer"; import { SurveyHeader } from "./components/survey-header/survey-header"; import { ReactQuestionFactory } from "./reactquestion_factory"; import { ReactElementFactory } from "./element-factory"; @@ -13,6 +12,11 @@ import { ComponentsContainer } from "./components/components-container"; import { SvgBundleComponent } from "./svgbundle"; import { PopupModal } from "./components/popup/popup-modal"; +import { icons as iconsV1 } from "@coreIconsV1"; +import { icons as iconsV2 } from "@coreIconsV2"; +addIconsToThemeSet("v1", iconsV1); +addIconsToThemeSet("v2", iconsV2); +SvgRegistry.registerIcons(iconsV1); export class Survey extends SurveyElementBase implements ISurveyCreator { private previousJSON = {}; @@ -260,6 +264,7 @@ export class Survey extends SurveyElementBase } } } + protected setSurveyEvents() { var self = this; diff --git a/packages/survey-react-ui/src/svgbundle.tsx b/packages/survey-react-ui/src/svgbundle.tsx index d8d326ac6b..8875aef383 100644 --- a/packages/survey-react-ui/src/svgbundle.tsx +++ b/packages/survey-react-ui/src/svgbundle.tsx @@ -9,12 +9,19 @@ export class SvgBundleComponent extends React.Component { super(props); this.containerRef = React.createRef(); } - componentDidMount() { + private onIconsChanged = () => { if (!!this.containerRef.current) { this.containerRef.current.innerHTML = SvgRegistry.iconsRenderedHtml(); } } - render() { + componentDidMount(): void { + this.onIconsChanged(); + SvgRegistry.onIconsChanged.add(this.onIconsChanged); + } + componentWillUnmount(): void { + SvgRegistry.onIconsChanged.remove(this.onIconsChanged); + } + render(): JSX.Element { const svgStyle = { display: "none" }; diff --git a/packages/survey-vue3-ui/src/Survey.vue b/packages/survey-vue3-ui/src/Survey.vue index 7d558074c3..68118d43e7 100644 --- a/packages/survey-vue3-ui/src/Survey.vue +++ b/packages/survey-vue3-ui/src/Survey.vue @@ -127,9 +127,18 @@ + + diff --git a/src/knockout/kosurvey.ts b/src/knockout/kosurvey.ts index eaf7eb209d..7069bae6dd 100644 --- a/src/knockout/kosurvey.ts +++ b/src/knockout/kosurvey.ts @@ -1,6 +1,6 @@ /* eslint-disable no-restricted-globals */ import * as ko from "knockout"; -import { Base, SurveyModel, SvgRegistry, doKey2ClickDown, doKey2ClickUp, doKey2ClickBlur, IAttachKey2clickOptions, settings } from "survey-core"; +import { Base, SurveyModel, doKey2ClickDown, doKey2ClickUp, doKey2ClickBlur, IAttachKey2clickOptions, settings, SvgRegistry, addIconsToThemeSet } from "survey-core"; import { SurveyElement } from "survey-core"; import { koTemplate, SurveyTemplateText } from "./templateText"; import { CustomWidgetCollection } from "survey-core"; @@ -10,6 +10,13 @@ import { ImplementorBase } from "./kobase"; import { getElement } from "survey-core"; import { ILoadFromJSONOptions } from "survey-core"; +import { icons as iconsV1 } from "@coreIconsV1"; +import { icons as iconsV2 } from "@coreIconsV2"; + +addIconsToThemeSet("v1", iconsV1); +addIconsToThemeSet("v2", iconsV2); +SvgRegistry.registerIcons(iconsV1); + CustomWidgetCollection.Instance.onCustomWidgetAdded.add(customWidget => { if (customWidget.widgetJson.isDefaultRender) return; if (!customWidget.htmlTemplate) diff --git a/src/vue/survey.vue b/src/vue/survey.vue index 16dc34842f..75d48662f3 100644 --- a/src/vue/survey.vue +++ b/src/vue/survey.vue @@ -64,9 +64,14 @@