Use consistent KDS imports across the whole Kolibri

kolibri/core/assets/src/core-app/apiSpec.js

@@ -14,12 +14,6 @@
 
 import vue from 'vue';
 import vuex from 'vuex';
-import UiAlert from 'kolibri-design-system/lib/keen/UiAlert';
-import responsiveWindowMixin from 'kolibri-design-system/lib/KResponsiveWindowMixin';
-import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
-import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
-import useKShow from 'kolibri-design-system/lib/composables/useKShow';
-import UiIconButton from 'kolibri-design-system/lib/keen/UiIconButton'; // temp hack
 import * as vueCompositionApi from '@vue/composition-api';
 import logging from '../logging';
 import * as apiResource from '../api-resource';
@@ -188,8 +182,6 @@ export default {
       MultiPaneLayout,
       CoreFullscreen,
       CoreLogo,
-      UiAlert,
-      UiIconButton,
       UiToolbar,
       PrivacyInfoModal,
       UserTypeDisplay,
@@ -221,16 +213,12 @@ export default {
     },
     router,
     mixins: {
-      responsiveWindowMixin,
-      responsiveElementMixin,
       commonCoreStrings,
       commonTaskStrings,
       commonSyncElements,
       translatedUserKinds,
     },
     composables: {
-      useKResponsiveWindow,
-      useKShow,
       useMinimumKolibriVersion,
       useUser,
       useUserSyncStatus,

kolibri/core/assets/src/views/AppBar.vue

@@ -122,7 +122,7 @@
   import KIconButton from 'kolibri-design-system/lib/buttons-and-links/KIconButton';
   import themeConfig from 'kolibri.themeConfig';
   import { isTouchDevice } from 'kolibri.utils.browserInfo';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import navComponentsMixin from '../mixins/nav-components';
   import SkipNavigationLink from './SkipNavigationLink';
 

kolibri/core/assets/src/views/CorePage/AppBarPage.vue

@@ -62,7 +62,7 @@
   import { throttle } from 'frame-throttle';
   import LanguageSwitcherModal from 'kolibri.coreVue.components.LanguageSwitcherModal';
   import ScrollingHeader from 'kolibri.coreVue.components.ScrollingHeader';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import SideNav from 'kolibri.coreVue.components.SideNav';
   import { LearnerDeviceStatus } from 'kolibri.coreVue.vuex.constants';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';

kolibri/core/assets/src/views/HorizontalNavBarWithOverflowMenu.vue

@@ -49,7 +49,7 @@
   import Navbar from 'kolibri.coreVue.components.Navbar';
   import NavbarLink from 'kolibri.coreVue.components.NavbarLink';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
 
   export default {
     name: 'HorizontalNavBarWithOverflowMenu',

kolibri/core/assets/src/views/InteractionList/index.vue

@@ -23,7 +23,7 @@
 
 <script>
 
-  import responsiveElementMixin from 'kolibri.coreVue.mixins.responsiveElementMixin';
+  import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
   import InteractionItem from './InteractionItem';
 
   export default {

kolibri/core/assets/src/views/MultiPaneLayout.vue

@@ -59,7 +59,7 @@
 <script>
 
   import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
-  import responsiveElementMixin from 'kolibri.coreVue.mixins.responsiveElementMixin';
+  import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
 
   export default {
     name: 'MultiPaneLayout',

kolibri/core/assets/src/views/Navbar/NavbarLink.vue

@@ -28,7 +28,7 @@
 <script>
 
   import { validateLinkObject } from 'kolibri.utils.validators';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
 
   /**
      Links for use inside the Navbar

kolibri/core/assets/src/views/Navbar/index.vue

@@ -17,7 +17,7 @@
 
 <script>
 
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   /**
    * Used for navigation between sub-pages of a top-level Kolibri section
    */

kolibri/core/assets/src/views/SideNav.vue

@@ -240,7 +240,7 @@
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
   import { UserKinds, NavComponentSections } from 'kolibri.coreVue.vuex.constants';
   import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
-  import responsiveElementMixin from 'kolibri.coreVue.mixins.responsiveElementMixin';
+  import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
   import CoreMenu from 'kolibri.coreVue.components.CoreMenu';
   import CoreMenuOption from 'kolibri.coreVue.components.CoreMenuOption';
   import CoreLogo from 'kolibri.coreVue.components.CoreLogo';

kolibri/core/assets/src/views/SlotTruncator.vue

@@ -26,7 +26,7 @@
 <script>
 
   import debounce from 'lodash/debounce';
-  import responsiveElementMixin from 'kolibri.coreVue.mixins.responsiveElementMixin';
+  import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
 
   export default {

kolibri/plugins/coach/assets/src/views/plan/CreateExamPage/SectionEditor.vue

@@ -225,7 +225,7 @@
   import { ref } from 'kolibri.lib.vueCompositionApi';
   import { get } from '@vueuse/core';
   import { enhancedQuizManagementStrings } from 'kolibri-common/strings/enhancedQuizManagementStrings';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import Draggable from 'kolibri.coreVue.components.Draggable';
   import DragContainer from 'kolibri.coreVue.components.DragContainer';
   import DragHandle from 'kolibri.coreVue.components.DragHandle';

kolibri/plugins/coach/assets/src/views/plan/CreateExamPage/TabsWithOverflow.vue

@@ -29,7 +29,7 @@
 
 <script>
 
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
 
   /**
    * @typedef   {Object}    Tab

kolibri/plugins/coach/assets/src/views/plan/CreateExamPage/index.vue

@@ -41,7 +41,7 @@
 
 <script>
 
-  import responsiveWindowMixin from 'kolibri.coreVue.mixins.responsiveWindowMixin';
+  import responsiveWindowMixin from 'kolibri-design-system/lib/KResponsiveWindowMixin';
   import { ref } from 'kolibri.lib.vueCompositionApi';
   import pickBy from 'lodash/pickBy';
   import BottomAppBar from 'kolibri.coreVue.components.BottomAppBar';

kolibri/plugins/coach/assets/src/views/plan/LessonsRootPage/index.vue

@@ -173,7 +173,7 @@
   import CoreTable from 'kolibri.coreVue.components.CoreTable';
   import CatchErrors from 'kolibri.utils.CatchErrors';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import useKShow from 'kolibri.coreVue.composables.useKShow';
+  import useKShow from 'kolibri-design-system/lib/composables/useKShow';
   import bytesForHumans from 'kolibri.utils.bytesForHumans';
   import CoachAppBarPage from '../../CoachAppBarPage';
   import { LessonsPageNames } from '../../../constants/lessonsConstants';

kolibri/plugins/device/assets/src/views/DeviceSettingsPage/index.vue

@@ -360,7 +360,7 @@
   import { availableLanguages, currentLanguage } from 'kolibri.utils.i18n';
   import sortLanguages from 'kolibri.utils.sortLanguages';
   import BottomAppBar from 'kolibri.coreVue.components.BottomAppBar';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import { checkCapability } from 'kolibri.utils.appCapabilities';
   import commonDeviceStrings from '../commonDeviceStrings';
   import DeviceAppBarPage from '../DeviceAppBarPage';

kolibri/plugins/epub_viewer/assets/src/views/EpubRendererIndex.vue

@@ -176,7 +176,7 @@
   import Lockr from 'lockr';
   import FocusLock from 'vue-focus-lock';
   import CoreFullscreen from 'kolibri.coreVue.components.CoreFullscreen';
-  import responsiveElementMixin from 'kolibri.coreVue.mixins.responsiveElementMixin';
+  import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
   import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import iFrameView from './SandboxIFrameView';
   import LoadingScreen from './LoadingScreen';

kolibri/plugins/facility/assets/src/views/DataPage/SyncInterface/index.vue

@@ -121,7 +121,7 @@
     SyncFacilityModalGroup,
   } from 'kolibri.coreVue.componentSets.sync';
   import commonSyncElements from 'kolibri.coreVue.mixins.commonSyncElements';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import { TaskResource, FacilityResource } from 'kolibri.resources';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
   import CoreMenu from 'kolibri.coreVue.components.CoreMenu';

kolibri/plugins/facility/assets/src/views/FacilityConfigPage/index.vue

@@ -213,7 +213,7 @@
 <script>
 
   import { mapActions, mapGetters, mapState } from 'vuex';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import { createTranslator } from 'kolibri.utils.i18n';
 
   import camelCase from 'lodash/camelCase';

kolibri/plugins/facility/assets/src/views/IdentifierTextbox.vue

@@ -24,7 +24,7 @@
 
   import CoreInfoIcon from 'kolibri.coreVue.components.CoreInfoIcon';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
 
   export default {
     name: 'IdentifierTextbox',

kolibri/plugins/learn/assets/src/composables/useCardLayoutSpan.js

@@ -1,5 +1,5 @@
 import { get } from '@vueuse/core';
-import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
 import { computed } from 'kolibri.lib.vueCompositionApi';
 
 export default function useCardLayoutSpan() {

kolibri/plugins/learn/assets/src/my_downloads/views/DownloadsList/index.vue

@@ -143,7 +143,7 @@
   import { computed, getCurrentInstance } from 'kolibri.lib.vueCompositionApi';
   import { get } from '@vueuse/core';
   import { createTranslator } from 'kolibri.utils.i18n';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import useContentLink from '../../../composables/useContentLink';
   import useDevices from '../../../composables/useDevices';
   import useLearningActivities from '../../../composables/useLearningActivities';

kolibri/plugins/learn/assets/src/views/ChannelCardGroupGrid.vue

@@ -25,7 +25,7 @@
 
 <script>
 
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import useCardLayoutSpan from '../composables/useCardLayoutSpan';
   import useContentLink from '../composables/useContentLink';
   import ChannelCard from './ChannelCard';

kolibri/plugins/learn/assets/src/views/ExploreLibrariesPage/LibraryItem.vue

@@ -66,7 +66,7 @@
 <script>
 
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import useContentLink from '../../composables/useContentLink';
   import { KolibriStudioId } from '../../constants';
   import ChannelCardGroupGrid from '../ChannelCardGroupGrid';

kolibri/plugins/learn/assets/src/views/LibraryPage/OtherLibraries.vue

@@ -135,7 +135,7 @@
 
   import { get } from '@vueuse/core';
   import { computed } from 'kolibri.lib.vueCompositionApi';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import coreStrings from 'kolibri.utils.coreStrings';
   import useCardLayoutSpan from '../../composables/useCardLayoutSpan';
   import useContentLink from '../../composables/useContentLink';

kolibri/plugins/learn/assets/src/views/LibraryPage/UnPinnedDevices.vue

@@ -51,7 +51,7 @@
 <script>
 
   import TextTruncatorCss from 'kolibri.coreVue.components.TextTruncatorCss';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
 
   export default {

kolibri/plugins/learn/assets/src/views/LibraryPage/index.vue

@@ -165,7 +165,7 @@
 
   import { onMounted, getCurrentInstance, ref, watch } from 'kolibri.lib.vueCompositionApi';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import useUser from 'kolibri.coreVue.composables.useUser';
   import samePageCheckGenerator from 'kolibri.utils.samePageCheckGenerator';
   import { ContentNodeResource } from 'kolibri.resources';

kolibri/plugins/learn/assets/src/views/QuizRenderer/index.vue

@@ -157,7 +157,7 @@
   import debounce from 'lodash/debounce';
   import BottomAppBar from 'kolibri.coreVue.components.BottomAppBar';
   import UiAlert from 'kolibri-design-system/lib/keen/UiAlert';
-  import UiIconButton from 'kolibri.coreVue.components.UiIconButton';
+  import UiIconButton from 'kolibri-design-system/lib/keen/UiIconButton';
   import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
   import shuffled from 'kolibri.utils.shuffled';

kolibri/plugins/learn/assets/src/views/SearchBox.vue

@@ -59,7 +59,7 @@
 <script>
 
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import responsiveElementMixin from 'kolibri.coreVue.mixins.responsiveElementMixin';
+  import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
 
   export default {
     name: 'SearchBox',

kolibri/plugins/learn/assets/src/views/SearchFiltersPanel/index.vue

@@ -118,7 +118,7 @@
 
   import { NoCategories } from 'kolibri.coreVue.vuex.constants';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import { ref } from 'kolibri.lib.vueCompositionApi';
   import SearchBox from '../SearchBox';
   import SidePanelModal from '../SidePanelModal';

kolibri/plugins/learn/assets/src/views/TopicsPage/TopicsPanelModal.vue

@@ -44,7 +44,7 @@
 
 <script>
 
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
   import commonLearnStrings from '../commonLearnStrings';
   import SidePanelModal from '../SidePanelModal';

kolibri/plugins/media_player/assets/src/views/MediaPlayerIndex.vue

@@ -88,8 +88,8 @@
   import throttle from 'lodash/throttle';
   import { languageIdToCode } from 'kolibri.utils.i18n';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import responsiveElementMixin from 'kolibri.coreVue.mixins.responsiveElementMixin';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import Settings from '../utils/settings';
   import { ReplayButton, ForwardButton } from './customButtons';
   import MediaPlayerFullscreen from './MediaPlayerFullscreen';

kolibri/plugins/pdf_viewer/assets/src/views/PdfRendererIndex.vue

@@ -127,7 +127,7 @@
   // polyfill necessary for recycle list
   import 'intersection-observer';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import CoreFullscreen from 'kolibri.coreVue.components.CoreFullscreen';
   import '../utils/domPolyfills';
   import { EventBus } from '../utils/event_utils';

kolibri/plugins/setup_wizard/assets/src/views/OnboardingStepBase.vue

@@ -144,7 +144,7 @@
   import LanguageSwitcherModal from 'kolibri.coreVue.components.LanguageSwitcherModal';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
   import AppError from 'kolibri-common/components/AppError';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import { availableLanguages, currentLanguage } from 'kolibri.utils.i18n';
   import { FooterMessageTypes } from '../constants';
 

kolibri/plugins/setup_wizard/assets/src/views/SetupWizardIndex.vue

@@ -28,7 +28,7 @@
   import { interpret } from 'xstate';
   import { mapState } from 'vuex';
   import commonCoreStrings from 'kolibri.coreVue.mixins.commonCoreStrings';
-  import useKResponsiveWindow from 'kolibri.coreVue.composables.useKResponsiveWindow';
+  import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
   import { checkCapability } from 'kolibri.utils.appCapabilities';
   import Lockr from 'lockr';
   import { wizardMachine } from '../machines/wizardMachine';

kolibri/plugins/slideshow_viewer/assets/src/views/SlideshowRendererComponent.vue

@@ -80,7 +80,7 @@
   import objectFitImages from 'object-fit-images';
   import client from 'kolibri.client';
 
-  import responsiveElementMixin from 'kolibri.coreVue.mixins.responsiveElementMixin';
+  import responsiveElementMixin from 'kolibri-design-system/lib/KResponsiveElementMixin';
   import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow';
 
   import UiIconButton from 'kolibri-design-system/lib/keen/UiIconButton';