From bedce9483dca1a620faf1bf511aa391b754d01b0 Mon Sep 17 00:00:00 2001 From: radkostanev Date: Tue, 21 Jan 2025 08:31:15 +0200 Subject: [PATCH 1/5] chore: wip --- components/button/overview.md | 2 + docs-builder.yml | 107 ++++++++++++++++++++++++++++++++++ 2 files changed, 109 insertions(+) diff --git a/components/button/overview.md b/components/button/overview.md index 45ae3a1e9..80bbe3a05 100644 --- a/components/button/overview.md +++ b/components/button/overview.md @@ -14,6 +14,8 @@ This article introduces the + The Blazor Button provides a variety of styling options through the [built-in themes](slug:themes-overview) and the [button type](slug:button-type). It supports [font icons and images](slug:button-icons) and fires click [events](slug:button-events). ## Creating Blazor Button diff --git a/docs-builder.yml b/docs-builder.yml index ed60ada75..2fcfdc925 100644 --- a/docs-builder.yml +++ b/docs-builder.yml @@ -20,6 +20,113 @@ enable-tabbed-code-blocks: true blazor-repl: true pdf-cover-png-path: ./images/pdf-cover.png +demos: + metaFileName: demo.json + defaultTheme: default-ocean-blue-a11y + uris: + www.telerik.com: https://localhost:7053/ + www.telerik.com/kendo-angular-ui-develop/components/: https://localhost:7053/ + wwwsit.telerik.com: https://localhost:7053/ + wwwsit.telerik.com/kendo-angular-ui-develop/components/: https://localhost:7053/ + default: https://localhost:7053/ + themes: + default-main: + name: Main + group: Default + colors: ['#FFFFFF', '#ff6358', '#424242'] + default-main-dark: + name: Main Dark + group: Default + tags: [dark] + colors: ['#333333', '#ff6358', '#FFFFFF'] + default-ocean-blue: + name: Ocean Blue + group: Default + colors: ['#ffffff', '#0275d8', '#656565'] + default-ocean-blue-a11y: + name: Ocean Blue A11y + group: Default + tags: [accessibility] + colors: ['#ffffff', '#0275d8', '#656565'] + default-nordic: + name: Nordic + group: Default + colors: ['#ffffff', '#01a8c1', '#e7607b'] + default-purple: + name: Purple + group: Default + colors: ['#ffffff', '#bf70cc', '#424242'] + default-turquoise: + name: Turquoise + group: Default + colors: ['#ffffff', '#28bfba', '#424242'] + + bootstrap-main: + name: Main + group: Bootstrap + colors: ['#ffffff', '#0d6efd', '#212529'] + bootstrap-main-dark: + name: Main Dark + tags: [dark] + group: Bootstrap + colors: ['#212529', '#0d6efd', '#ffffff'] + bootstrap-nordic: + name: Nordic + group: Bootstrap + colors: ['#ffffff', '#01a8c1', '#e7607b'] + bootstrap-urban: + name: Urban + group: Bootstrap + colors: ['#ffffff', '#447a99', '#ff804d'] + bootstrap-vintage: + name: Vintage + group: Bootstrap + colors: ['#744662', '#f2efe8', '#90b8c1'] + + material-main: + name: Main + group: Material + colors: ['#ffffff', '#3f51b5', '#424242'] + material-main-dark: + name: Main Dark + tags: [dark] + group: Material + colors: ['#303030', '#3f51b5', '#ffffff'] + material-arctic: + name: Arctic + group: Material + colors: ['#ffffff', '#2196f3', '#455a64'] + material-lime-dark: + name: Lime Dark + tags: [dark] + group: Material + colors: ['#303030', '#8bc34a', '#ffffff'] + material-nova: + name: Nova + group: Material + colors: ['#ffffff', '#e91e63', '#455a64'] + + fluent-main: + name: Main + group: Fluent + colors: ['#ffffff', '#0078D4', '#323130'] + + fluent-main-dark: + name: Main Dark + group: Fluent + colors: ['#323130', '#0078D4', '#ffffff'] + actions: + open-code-sandbox: + name: CodeSandBox + group: Edit in + newWindow: true + iconUri: data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMS41IiB5PSIxLjUiIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgc3Ryb2tlPSIjODJBMDBDIi8+Cjwvc3ZnPgo= + open-stack-blitz: + name: StackBlitz + newWindow: true + group: Edit in + iconUri: data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjAyNzIgNi4xOTU2NUw0LjcxMTk2IDE1TDcuMzIwNjUgOC44MDQzNUgzTDExLjMxNTIgMEw4LjcwNjUyIDYuMTk1NjVIMTMuMDI3MloiIGZpbGw9IiMxMzg5RkQiLz4KPC9zdmc+Cg== + cta-overview: The @Subject component is part of @ProductLink, a professional grade UI library with 110+ native components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial. cta-intro: "@ProductLink is a professional grade UI library with 110+ native components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial." From 0abe12a56700359adbb3b7a459697d7d5693313f Mon Sep 17 00:00:00 2001 From: yanisslav Date: Fri, 21 Mar 2025 14:26:28 +0200 Subject: [PATCH 2/5] chore: fix repl image --- docs-builder.yml | 17 ++---- .../wwwroot/theme-configurator.js | 58 +++++++++++++++++++ 2 files changed, 64 insertions(+), 11 deletions(-) create mode 100644 examples/src/BlazorDocsExamples/BlazorDocsExamples/wwwroot/theme-configurator.js diff --git a/docs-builder.yml b/docs-builder.yml index 2fcfdc925..db7b3333c 100644 --- a/docs-builder.yml +++ b/docs-builder.yml @@ -24,11 +24,11 @@ demos: metaFileName: demo.json defaultTheme: default-ocean-blue-a11y uris: - www.telerik.com: https://localhost:7053/ - www.telerik.com/kendo-angular-ui-develop/components/: https://localhost:7053/ - wwwsit.telerik.com: https://localhost:7053/ - wwwsit.telerik.com/kendo-angular-ui-develop/components/: https://localhost:7053/ - default: https://localhost:7053/ + www.telerik.com: https://localhost:7170/ + www.telerik.com/kendo-angular-ui-develop/components/: https://localhost:7170/ + wwwsit.telerik.com: https://localhost:7170/ + wwwsit.telerik.com/kendo-angular-ui-develop/components/: https://localhost:7170/ + default: https://localhost:7170/ themes: default-main: name: Main @@ -120,12 +120,7 @@ demos: name: CodeSandBox group: Edit in newWindow: true - iconUri: data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3QgeD0iMS41IiB5PSIxLjUiIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgc3Ryb2tlPSIjODJBMDBDIi8+Cjwvc3ZnPgo= - open-stack-blitz: - name: StackBlitz - newWindow: true - group: Edit in - iconUri: data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjAyNzIgNi4xOTU2NUw0LjcxMTk2IDE1TDcuMzIwNjUgOC44MDQzNUgzTDExLjMxNTIgMEw4LjcwNjUyIDYuMTk1NjVIMTMuMDI3MloiIGZpbGw9IiMxMzg5RkQiLz4KPC9zdmc+Cg== + iconUri: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IB2cksfwAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxEAAAsRAX9kX5EAAAGHaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8P3hwYWNrZXQgYmVnaW49J++7vycgaWQ9J1c1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCc/Pg0KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyI+PHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj48cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0idXVpZDpmYWY1YmRkNS1iYTNkLTExZGEtYWQzMS1kMzNkNzUxODJmMWIiIHhtbG5zOnRpZmY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vdGlmZi8xLjAvIj48dGlmZjpPcmllbnRhdGlvbj4xPC90aWZmOk9yaWVudGF0aW9uPjwvcmRmOkRlc2NyaXB0aW9uPjwvcmRmOlJERj48L3g6eG1wbWV0YT4NCjw/eHBhY2tldCBlbmQ9J3cnPz4slJgLAAACRElEQVQ4T3WST2gTQRTGfzO7yW76z/5LpArFih4ECxUL0pNnQfTipcU2qODJepBClYpWUFG0XrwKmtgW/HMQ8SJC9aQnT9JLFWuxajWNxjRNs9ndGQ/bxk1LPxiYN+/7vnkz7wk2QX+GbgF3AS1gMBXn/XoOgAgHlzVydp692ua8GaF3Las1KI8JVWR0vJ1PYU2VQfIHO7TBVEOcjvwiKGeVZIDVBG6BZa0Zyy1y+/keljYYABybIR5rYkTCGbMWw8kBOljSgugWKOf5jM+V9FbSVQZ9czSVBaWn7az0LdAZMblu2BzWPriFVZIGsxYMG0pZXlUMkhlOIxlFg1ZcSie4BzCQ4QiCq9F6Ot08+M7/us1aEAPfOUSUm5E6Or3lIBmpAbfAO+0ykm7jNUB/lnNSM6x9EspbuxZf+oJ6IWgVErQCvwilLBg2PUYNU8lFJvsW2PmwhTt+iVvRxooYADnRxuPsLLvcPBeF4K8dByGhnAOvCLEWeqXiAUE7PfQ6A4AX3RRTrVwrLdHlFrgvTJQwgoqcJai8WgT8MKoOHnXwJdXCSeVywoyBWPtijQrzwqgy6P/G0cEZLM/hg95UUg0J0DtPT/IPbzQ8a96Nb1iY64kboMGwMOTxeYYatvPWbuQg8BtQygtNaLCzQ1JkBGIJ8B2mpZI8Wckw5uRwhaS5wtLBtEXrQAs+EnhJywIEJSfPDTIckJPbmEsnGCo77NceqemvWFIg7WbQmp/FX5zNFjhF0EZzJc9LUWZfupUL410s/wMjztTGtACXSgAAAABJRU5ErkJggg== cta-overview: The @Subject component is part of @ProductLink, a professional grade UI library with 110+ native components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial. cta-intro: "@ProductLink is a professional grade UI library with 110+ native components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial." diff --git a/examples/src/BlazorDocsExamples/BlazorDocsExamples/wwwroot/theme-configurator.js b/examples/src/BlazorDocsExamples/BlazorDocsExamples/wwwroot/theme-configurator.js new file mode 100644 index 000000000..1c71a26ba --- /dev/null +++ b/examples/src/BlazorDocsExamples/BlazorDocsExamples/wwwroot/theme-configurator.js @@ -0,0 +1,58 @@ +const createAppLoadingMessage = (loading) => ({ + type: "loading", + loading +}); + +// Don't show loader +const APP_LOADED_TRUE = createAppLoadingMessage(false); + +// Show loader +const APP_LOADED_FALSE = createAppLoadingMessage(true); + +// Needed for PostMessage allowedOrigin +const uris = { + "https://demos.telerik.com": "https://www.telerik.com", + "https://sitdemos.telerik.com": "https://wwwsit.telerik.com", + "https://localhost:7170": "http://localhost:8000" +} + +window.TelerikMessageService = window.TelerikMessageService || (function () { + return { + init: function (DotNetInstance) { + window.TelerikMessageService.DotNetInstance = DotNetInstance; + window.addEventListener('message', this.onMessage); + }, + dispose: function () { + window.removeEventListener('message', this.onMessage); + }, + appLoaded: function () { + // Limit posting the message to allowed origins only depending on the enviroment + window.parent.postMessage(APP_LOADED_TRUE, uris[window.origin]); + }, + loadTheme: async function (themeId) { + // theme is set entirely in the demo app. + }, + onMessage(event) { + if (!event.origin === uris[window.origin]) { + return; + } + + const eventType = event.data.type; + + if (eventType === 'theme-changed') { + window.parent.postMessage(APP_LOADED_FALSE, uris[window.origin]); + + window.TelerikMessageService.loadTheme(event.data.themeId).then(() => { + + const xurl = (new URL(window.location.toString())); + xurl.searchParams.delete('theme'); + xurl.searchParams.set("theme", event.data.themeId); + + window.history.pushState({}, "", xurl.toString()); + window.location.reload(); + + }); + } + } + } +}()); \ No newline at end of file From 4e32be38ffa6dc3d805446a376adb0afa87752ea Mon Sep 17 00:00:00 2001 From: yanisslav Date: Fri, 28 Mar 2025 08:51:13 +0200 Subject: [PATCH 3/5] chore(docs-builer): fix open editor action name --- docs-builder.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs-builder.yml b/docs-builder.yml index db7b3333c..41787eac1 100644 --- a/docs-builder.yml +++ b/docs-builder.yml @@ -116,8 +116,8 @@ demos: group: Fluent colors: ['#323130', '#0078D4', '#ffffff'] actions: - open-code-sandbox: - name: CodeSandBox + open-repl: + name: Telerik REPL group: Edit in newWindow: true iconUri: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IB2cksfwAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxEAAAsRAX9kX5EAAAGHaVRYdFhNTDpjb20uYWRvYmUueG1wAAAAAAA8P3hwYWNrZXQgYmVnaW49J++7vycgaWQ9J1c1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCc/Pg0KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyI+PHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj48cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0idXVpZDpmYWY1YmRkNS1iYTNkLTExZGEtYWQzMS1kMzNkNzUxODJmMWIiIHhtbG5zOnRpZmY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vdGlmZi8xLjAvIj48dGlmZjpPcmllbnRhdGlvbj4xPC90aWZmOk9yaWVudGF0aW9uPjwvcmRmOkRlc2NyaXB0aW9uPjwvcmRmOlJERj48L3g6eG1wbWV0YT4NCjw/eHBhY2tldCBlbmQ9J3cnPz4slJgLAAACRElEQVQ4T3WST2gTQRTGfzO7yW76z/5LpArFih4ECxUL0pNnQfTipcU2qODJepBClYpWUFG0XrwKmtgW/HMQ8SJC9aQnT9JLFWuxajWNxjRNs9ndGQ/bxk1LPxiYN+/7vnkz7wk2QX+GbgF3AS1gMBXn/XoOgAgHlzVydp692ua8GaF3Las1KI8JVWR0vJ1PYU2VQfIHO7TBVEOcjvwiKGeVZIDVBG6BZa0Zyy1y+/keljYYABybIR5rYkTCGbMWw8kBOljSgugWKOf5jM+V9FbSVQZ9czSVBaWn7az0LdAZMblu2BzWPriFVZIGsxYMG0pZXlUMkhlOIxlFg1ZcSie4BzCQ4QiCq9F6Ot08+M7/us1aEAPfOUSUm5E6Or3lIBmpAbfAO+0ykm7jNUB/lnNSM6x9EspbuxZf+oJ6IWgVErQCvwilLBg2PUYNU8lFJvsW2PmwhTt+iVvRxooYADnRxuPsLLvcPBeF4K8dByGhnAOvCLEWeqXiAUE7PfQ6A4AX3RRTrVwrLdHlFrgvTJQwgoqcJai8WgT8MKoOHnXwJdXCSeVywoyBWPtijQrzwqgy6P/G0cEZLM/hg95UUg0J0DtPT/IPbzQ8a96Nb1iY64kboMGwMOTxeYYatvPWbuQg8BtQygtNaLCzQ1JkBGIJ8B2mpZI8Wckw5uRwhaS5wtLBtEXrQAs+EnhJywIEJSfPDTIckJPbmEsnGCo77NceqemvWFIg7WbQmp/FX5zNFjhF0EZzJc9LUWZfupUL410s/wMjztTGtACXSgAAAABJRU5ErkJggg== From f4fd502a77a4c241453f7c758ff99d5b27c9df7d Mon Sep 17 00:00:00 2001 From: yanisslav Date: Fri, 28 Mar 2025 08:58:44 +0200 Subject: [PATCH 4/5] chore(examples): remove examples project --- .../wwwroot/theme-configurator.js | 58 ------------------- 1 file changed, 58 deletions(-) delete mode 100644 examples/src/BlazorDocsExamples/BlazorDocsExamples/wwwroot/theme-configurator.js diff --git a/examples/src/BlazorDocsExamples/BlazorDocsExamples/wwwroot/theme-configurator.js b/examples/src/BlazorDocsExamples/BlazorDocsExamples/wwwroot/theme-configurator.js deleted file mode 100644 index 1c71a26ba..000000000 --- a/examples/src/BlazorDocsExamples/BlazorDocsExamples/wwwroot/theme-configurator.js +++ /dev/null @@ -1,58 +0,0 @@ -const createAppLoadingMessage = (loading) => ({ - type: "loading", - loading -}); - -// Don't show loader -const APP_LOADED_TRUE = createAppLoadingMessage(false); - -// Show loader -const APP_LOADED_FALSE = createAppLoadingMessage(true); - -// Needed for PostMessage allowedOrigin -const uris = { - "https://demos.telerik.com": "https://www.telerik.com", - "https://sitdemos.telerik.com": "https://wwwsit.telerik.com", - "https://localhost:7170": "http://localhost:8000" -} - -window.TelerikMessageService = window.TelerikMessageService || (function () { - return { - init: function (DotNetInstance) { - window.TelerikMessageService.DotNetInstance = DotNetInstance; - window.addEventListener('message', this.onMessage); - }, - dispose: function () { - window.removeEventListener('message', this.onMessage); - }, - appLoaded: function () { - // Limit posting the message to allowed origins only depending on the enviroment - window.parent.postMessage(APP_LOADED_TRUE, uris[window.origin]); - }, - loadTheme: async function (themeId) { - // theme is set entirely in the demo app. - }, - onMessage(event) { - if (!event.origin === uris[window.origin]) { - return; - } - - const eventType = event.data.type; - - if (eventType === 'theme-changed') { - window.parent.postMessage(APP_LOADED_FALSE, uris[window.origin]); - - window.TelerikMessageService.loadTheme(event.data.themeId).then(() => { - - const xurl = (new URL(window.location.toString())); - xurl.searchParams.delete('theme'); - xurl.searchParams.set("theme", event.data.themeId); - - window.history.pushState({}, "", xurl.toString()); - window.location.reload(); - - }); - } - } - } -}()); \ No newline at end of file From afdc348140762a6f0c6a0f8259695a068b675ab0 Mon Sep 17 00:00:00 2001 From: yanisslav Date: Fri, 11 Apr 2025 10:40:49 +0300 Subject: [PATCH 5/5] chore: show server and client pages --- components/button/overview.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/components/button/overview.md b/components/button/overview.md index 80bbe3a05..56357f24b 100644 --- a/components/button/overview.md +++ b/components/button/overview.md @@ -14,7 +14,9 @@ This article introduces the + + + The Blazor Button provides a variety of styling options through the [built-in themes](slug:themes-overview) and the [button type](slug:button-type). It supports [font icons and images](slug:button-icons) and fires click [events](slug:button-events).