Merge pull request #863 from AlexVelezLl/prepare-release-rc11

Update KDS version to 5.0.0-rc11 and fix formatting issues

Author: AlexVelezLl

docs/pages/installation.vue

@@ -11,11 +11,16 @@
       </p>
 
       <!-- eslint-disable -->
+      <!-- prettier-ignore -->
       <DocsShowCode language="javascript">
-        import KThemePlugin from 'kolibri-design-system/lib/KThemePlugin'; import trackInputModality
-        from 'kolibri-design-system/lib/styles/trackInputModality'; import trackMediaType from
-        'kolibri-design-system/lib/styles/trackMediaType'; Vue.use(KThemePlugin);
-        trackInputModality(); trackMediaType();
+        import KThemePlugin from 'kolibri-design-system/lib/KThemePlugin';
+        import trackInputModality from 'kolibri-design-system/lib/styles/trackInputModality';
+        import trackMediaType from 'kolibri-design-system/lib/styles/trackMediaType';
+
+        Vue.use(KThemePlugin);
+
+        trackInputModality();
+        trackMediaType();
       </DocsShowCode>
       <!-- eslint-enable -->
 

docs/pages/kcard.vue

@@ -402,8 +402,15 @@
       </DocsShowCode>
 
       <!-- eslint-disable -->
+      <!-- prettier-ignore -->
       <DocsShowCode language="javascript">
-        export default { methods() { onClick() { console.log('Card clicked'); } }, };
+        export default {
+          methods() {
+            onClick() {
+              console.log('Card clicked');
+            }
+          },
+        };
       </DocsShowCode>
       <!-- eslint-enable -->
 

docs/pages/ktabslist.vue

@@ -72,8 +72,16 @@
       <!-- eslint-disable -->
       <!-- prettier-ignore -->
       <DocsShowCode language="javascript">
-        data() { return { activeTabId: 'tabLessons', tabs: [ { id: 'tabLessons', label: 'Lessons' },
-        { id: 'tabLearners', label: 'Learners' }, { id: 'tabGroups', label: 'Groups' }, ], }; },
+        data() {
+          return {
+            activeTabId: 'tabLessons',
+            tabs: [
+              { id: 'tabLessons', label: 'Lessons' },
+              { id: 'tabLearners', label: 'Learners' },
+              { id: 'tabGroups', label: 'Groups' },
+            ],
+          };
+        },
       </DocsShowCode>
       <!-- eslint-enable -->
     </DocsPageSection>
@@ -96,9 +104,15 @@
       <!-- eslint-disable -->
       <!-- prettier-ignore -->
       <DocsShowCode language="javascript">
-        data() { return { tabs: [ { id: 'tabLessons', label: 'Lessons', to: { path: '/lessons' } },
-        { id: 'tabLearners', label: 'Learners', to: { path: '/learners' } }, { id: 'tabGroups',
-        label: 'Groups', to: { path: '/groups' } }, ], }; },
+        data() {
+          return {
+            tabs: [
+              { id: 'tabLessons', label: 'Lessons', to: { path: '/lessons' } },
+              { id: 'tabLearners', label: 'Learners', to: { path: '/learners' } },
+              { id: 'tabGroups', label: 'Groups', to: { path: '/groups' } },
+            ],
+          };
+        },
       </DocsShowCode>
       <!-- eslint-enable -->
 
@@ -343,7 +357,11 @@
       <!-- eslint-disable -->
       <!-- prettier-ignore -->
       <DocsShowCode language="javascript">
-        icons: { tabLessons: 'lesson', tabLearners: 'person', tabGroups: 'people', },
+        icons: {
+          tabLessons: 'lesson',
+          tabLearners: 'person',
+          tabGroups: 'people',
+        },
       </DocsShowCode>
       <!-- eslint-enable -->
     </DocsPageSection>

docs/pages/layout/index.vue

@@ -121,7 +121,7 @@
         Responsive layouts in the design system are built using reactive JavaScript state in Vue
         components rather than CSS media queries. This is done using
         <DocsLibraryLink component="useKResponsiveWindow" /> when reactive window's size information
-        is needed or <DocsLibraryLink component="KResponsiveElement" /> when reactive component's
+        is needed or <DocsLibraryLink component="useKResponsiveElement" /> when reactive component's
         size information is needed.
       </p>
     </DocsPageSection>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "kolibri-design-system",
-  "version": "5.0.0-rc10",
+  "version": "5.0.0-rc11",
   "private": false,
   "description": "The Kolibri Design System defines common design patterns and code for use in Kolibri applications",
   "repository": {