Changelog

Changelog is rather internal in nature. See release notes for the public overview and guidelines. Releases are recorded as git tags in the Github releases page.

Version 4.x.x (`release-v4` branch)

#791
- Description: Bump KDS version to 4.6.0.
- Products impact: -.
- Addresses: -.
- Components: -.
- Breaking: -.
- Impacts a11y: -.
- Guidance: -.

#782
- Description: Update Theme Tokens to the latest specs to comply material design specifications.
- Products impact: Updated API.
- Addresses: learningequality#775.
- Components: -.
- Breaking: yes.
- Impacts a11y: no.
- Guidance: Please update all v_* theme tokens using the mapping posted in learningequality#775.

#786
- Description: Bump KDS version to 4.5.1.
- Products impact: -.
- Addresses: -.
- Components: -.
- Breaking: -.
- Impacts a11y: -.
- Guidance: -.

#784
- Description: Add labelDir prop to control rtl direction of label.
- Products impact: new API.
- Addresses: learningequality/studio#4728.
- Components: KCheckbox, KRadioButton.
- Breaking: no
- Impacts a11y: no.
- Guidance: -.

#767
- Description: Bump KDS version to 4.5.0.
- Products impact: -.
- Addresses: -.
- Components: -.
- Breaking: -.
- Impacts a11y: -.
- Guidance: -.

#744
- Description: Removes internal state management for checked & indeterminate in KCheckbox.
- Products impact: Updated API
- Addresses: learningequality/studio#4636
- Components: KCheckbox
- Breaking: No
- Impacts a11y: No
- Guidance: If you use KCheckbox, it is your responsibility to handle the change event and update whether or not the given checked and indeterminate props reflect the reality that you expect.

#737
- Description: Bump KDS version to 4.4.1.
- Products impact: -.
- Addresses: -.
- Components: -.
- Breaking: -.
- Impacts a11y: -.
- Guidance: -.

#717
- Description: Fix ResizeOserver errors when KListWithOverflow resize very quickly.
- Products impact: bugfix.
- Addresses: Sentry error.
- Components: KListWithOverflow.
- Breaking: no.
- Impacts a11y: no.
- Guidance: -.

#680
- Description: Adds boolean appendToRoot prop to teleport the modal to the body element if true.
- Products impact: new API.
- Addresses: learningequality/kolibri#12447.
- Components: KModal.
- Breaking: no
- Impacts a11y: no
- Guidance:
#680
- Description: Fixes the calculation of overflowed items when changes in the size of the list item slots occur.
- Products impact: bugfix.
- Addresses: learningequality/kolibri#12447.
- Components: KListWithOverflow.
- Breaking: no
- Impacts a11y: no
- Guidance:

#673
- Description: Remove white space below Ktabs
- Products impact: bugfix.
- Addresses: learningequality/kolibri#12297.
- Components: KTabsList, KTabs, KTabsPanel.
- Breaking: no
- **Impacts a11y:**no
- Guidance: .

#629
- Description: Improves the contrast for highlighted text, noted in KTextbox
- Products impact: None
- Addresses: learningequality#629
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#648
- Description: Updates KSelect to include guiding documentation for the events it emits
- Products impact: None
- Addresses: -
- Components: KSelect
- Breaking: no
- Impacts a11y: no
- Guidance: -

#653
- Description: Header "Changelog" text and link updated
- Products impact: -
- Addresses: Replace the "Changelog" link with the "Release notes" link on the KDS documentation website #644
- Components: -
- Breaking: No
- Impacts a11y: No
- Guidance: -

#630
- Description: Updates the svg for the pointsLeafActive, and removes the pointsLeafInactive (which is not used anywhere in Kolibri)
- Products impact: Kolibri (branding)
- Addresses: -
- Components: KIcon and documentation
- Breaking: No
- Impacts a11y: No
- Guidance: -

#627
- Description: Fix missing anchor tag and heading case in KTextbox documentation
- Products impact: None
- Addresses: -
- Components: KTextbox documentation
- Breaking: -
- Impacts a11y: -
- Guidance: -

#604
- Description: Add more examples to KTextbox documentation
- Products impact: None
- Addresses: learningequality#596
- Components: KTextbox documentation
- Breaking: -
- Impacts a11y: -
- Guidance: -

#572
- Description: Add aria-checked property to KCheckbox's <input> element
- Products impact: -
- Addresses: The aria-checked property being set properly improves a11y.
- Components: -
- Breaking: -
- Impacts a11y: yes
- Guidance: -

616
- Description: Fixes KModal not showing content after the initial load
- Products impact: bugfix
- Addresses: learningequality/kolibri#11911 (comment)
- Components: KModal
- Breaking: no
- Impacts a11y: no
- Guidance: -

616
- Description: Fixes KSelect's missing padding
- Products impact: bugfix
- Addresses: learningequality/kolibri#11911 (comment)
- Components: KSelect
- Breaking: no
- Impacts a11y: no
- Guidance: -

#591
- Description: Added a clearable prop to KTextbox
- Products impact: -
- Addresses: learningequality#584
- Components: KTextbox
- Breaking: no
- Impacts a11y: no
- Guidance: -

#582
- Description: Upgrade popper.js from 1.14.6 to 1.16.1
- Products impact: -
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#599
- Description: Upgrade express from 4.18.2 to 4.19.2
- Products impact: -
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#587
- Description: Rebrands icons in buttons and links
- Products impact: UI
- Addresses: -
- Components: KButton, KRouterLink, KExternalLink
- Breaking: no
- Impacts a11y: -
- Guidance: -

#561
- Description: Update KLogo for new branding guidelines
- Products impact: Enables general use of KLogo for all frontend logo usage. Changes props API for square logo presentation.
- Addresses: Updates logo to new logo, adds all permissible alternates, adds animated form.
- Components: KLogo
- Breaking: Yes
- Impacts a11y: No
- Guidance: Rendering the Kolibri logo can now be done using the KLogo component, as well as the loading animation.

#580
- Description: Remove use of KResponsiveWindowMixin internally
- Products impact: - none
- Addresses: -
- Components: KDateRange, KModal, KPageContainer, KGrid, KFixedGrid, KGridItem, KFixedGridItem
- Breaking: no
- Impacts a11y: no
- Guidance: Updates all components to use the useKResponsiveWindow composable

#415
- Description: Upgrade purecss from 0.6.2 to 2.2.0
- Products impact: Updates for base styling for all elements
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#569
- Description: Upgrade actions/setup-node from 3 to 4
- Products impact: Dependencies
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#576
- Description: Upgrade follow-redirects from 1.15.4 to 1.15.6
- Products impact: Dependencies
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#553
- Description: Upgrade ip from 1.1.5 to 1.1.9
- Products impact: Dependencies
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#559
- Description: Upgrade lodash from 4.17.15 to 4.17.21
- Products impact: Dependencies
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#555
- Description: Add action to notify us on Slack about GH issues comments from contributors community
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#565
- Description: Revert adding engines
- Products impact: Dependencies
- Addresses: KDS not being installable by consumers that don't use Node 10
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#560
- Description: Configure dependabot to run on Wednesday
- Products impact: -
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#558
- Description: Move useKResponsiveWindow from /lib to /lib/composables
- Products impact: Location update
- Addresses: -
- Components: useKResponsiveWindow
- Breaking: yes
- Impacts a11y: -
- Guidance: Update import useKResponsiveWindow from 'kolibri-design-system/lib/useKResponsiveWindow'; from import useKResponsiveWindow from 'kolibri-design-system/lib/composables/useKResponsiveWindow';

#558
- Description: Remove deprecated KResponsiveWindow's mixin documentation page in favor of a new useKResponsiveWindow page
- Products impact: none
- Addresses: -
- Components: KResponsiveWindow
- Breaking: -
- Impacts a11y: -
- Guidance: -

#558
- Description: Adds engines and browserlist to package.json. Pins dependencies to exact version.
- Products impact: Dependencies
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#558
- Description: Internal maintenance tasks: extract common logic to utils, move private composables to /lib/composables and indicate that they are private by _ prefix in their filename. dev docs updates.
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#551
- Description: Updates brand colors, palette colors, and tokens.
  - Breaking changes:
    - Removed palette colors: purple, deeppurple, indigo, brown, cyan, teal, lightgreen, lime, amber, deeporange, bluegrey
    - Removed palette.grey scales: v_300, v_500, v_700, v_900
    - Removed brand and palette scales (except palette.grey): v_50,v_100, v_300, v_500, v_700, v_900
    - Removed content-related tokens: exercise, video, audio, document, html5, slideshow
    - Removed other tokens: appBarFullscreen, appBarFullscreenDark, linkDark
- Other changes:
  - Some existing palette colors look differently
  - Adds new tokens and palette
  - Global styles: <body> background color changed from grey.v_100 to lighter grey.v_50
- Products impact: new API, updated API, deleted API
- Addresses: - learningequality#545
- Components: -
- Breaking: - yes
- Impacts a11y: - no
- Guidance: - Address all breaking changes by searching for removed palette colors, scales, and tokens. Study the updated "Colors" KDS documentation page and replace them by relevant colors/scales/tokens. Also search for any hardcoded hex,rgb(a),hsl(a), or named colors (such as 'white') and theme them instead. Visually check places that use existing palette and adjust scale (you may need to increase it as many colors are lighter). You may also see if there are any minor useful updates to in regards to new tokens (e.g. replacing a palette color with a new token that describes function of the color better). If you use generateGlobalStyles that generates background color for <body> and use grey.v_100 in some components to match the background color, you may need to update it to grey.v_50.

#531
- Description: Remove unused keen-ui dependency
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

Version 3.x.x (`release-v3` branch)

#583
- Description: KDropdownMenu menu support to show context menus with isContextMenu prop.
- Products impact: new API.
- Addresses: learningequality#571, learningequality/studio#4403.
- Components: KDropdownMenu.
- Breaking: no.
- Impacts a11y: no.
- Guidance: -.
#583
- Description: New useKContextMenu private composable
- Products impact: - .
- Addresses: - .
- Components: - .
- Breaking: - .
- Impacts a11y: - .
- Guidance: -.
#583
- Description: Expose the event object as second argument on KDropdownMenu's select event.
- Products impact: updated API.
- Addresses: - .
- Components: KDropdownMenu.
- Breaking: no.
- Impacts a11y: no.
- Guidance: -.
#583
- Description: KDropdownMenu menu support to show a header slot.
- Products impact: new API.
- Addresses: - .
- Components: KDropdownMenu.
- Breaking: no.
- Impacts a11y: no.
- Guidance: -.

#611
- Description: Adds a new maxWidth prop
- Products impact: new API
- Addresses: learningequality#595
- Components: KTooltip
- Breaking: no
- Impacts a11y: no
- Guidance: -

#612
- Description: Prevent KListWithOverflow hidden elements from taking up space on the screen.
- Products impact: bugfix.
- Addresses: - .
- Components: KListWithOverflow.
- Breaking: no.
- Impacts a11y: no.
- Guidance: - .
#612
- Description: Scope the styles of the KListWithOverflow component.
- Products impact: bugfix.
- Addresses: - .
- Components: KListWithOverflow.
- Breaking: no.
- Impacts a11y: no.
- Guidance: - .

[##603]
- Description: Adds thumps down icon that is needed in Studio for search recomendation work.
- Products impact: New Icon
- Addresses: #4450
- Components: N/A
- Breaking: No
- Impacts a11y: No
- Guidance: [#603]: learningequality#603
#605
- Description: Adds the dropup icon
- Products impact: New icon
- Addresses: learningequality#594
- Components: -
- Breaking: no
- Impacts a11y: -
- Guidance: -

#586
- Description: Adds a new prop constrainToScrollParent to KDropdownMenu to allow overriding of its popover flipping behavior.
- Products impact: Bugfix
- Addresses: #432
- Components: KDropdownMenu
- Breaking: no
- Impacts a11y: no
- Guidance: Use the constrainToScrollParent prop to override the default popover flipping behavior of the KDropdownMenu component prop where necessary.

#573
- Description: More precise calculation of list with in KListWithOverflow.
- Products impact: bugfix.
- Addresses: -.
- Components: KListWithOverflow.
- Breaking: no.
- Impacts a11y: no.
- Guidance: -.

#552
- Description: New KListWithOverflow component.
- Products impact: new API.
- Addresses: learningequality#556, learningequality/studio#3423, learningequality/kolibri#11923.
- Components: KListWithOverflow.
- Breaking: no.
- Impacts a11y: no.
- Guidance: -.

#552
- Description: New useKResponsiveElement private composable, KResponsiveElementMixin translated to this composable.
- Products impact: -.
- Addresses: -.
- Components: -.
- Breaking: no.
- Impacts a11y: no.
- Guidance: -.

#538
- Description: Complete KImg implementation
- Products impact: new API
- Addresses: learningequality#368
- Components: KImg
- Breaking: no
- Impacts a11y: yes
- Guidance: One of the benefits of using KImg is that it throws a11y related warnings

#557
- Description: Updates development documentation in regards to linking products development servers to local KDS
- Products impact: -
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#542
- Description: Adds a new sort icon
- Products impact: New icon
- Addresses: learningequality/studio#4426
- Components: -
- Breaking: no
- Impacts a11y: -
- Guidance: -

#542
- Description: Updates documentation for icons to the new process, adds clear guidelines
- Products impact: None
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#543
- Description: Added new Icons to support Studio Usability Enhancements
- Products impact: new API
- Addresses: learningequality/studio#3425
- Components: KIcon
- Breaking: no
- Impacts a11y: no
- Guidance: Consumers can now access these icons: activities, attribution, audience, categories, levels, rename

#541
- Description: Add a GitHub Actions workflow to publish a new release on npm
- Products impact: none
- Addresses: learningequality#532
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#535
- Description: Added text prop in the KToolTip component as an alternative to the slot
- Products impact: Choose from - bugfix
- Addresses: #221
- Components: KToolTip
- Breaking: no
- Impacts a11y: no
- Guidance: -

#522
- Description: Upgrades github-actions/cache dependency
- Products impact: Dev dependency upgrade
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#518
- Description: Add testing for KImg component
- Products impact: none
- Addresses: learningequality#512
- Components: -
- Breaking: no
- Impacts a11y: no -
- Guidance: -

#521
- Description: Move date-fns dependency to depencies rather than dev-dependencies.
- Products impact: bugfix
- Addresses: N/A
- Components: KDateRange/KDateInput
- Breaking: no
- Impacts a11y: no
- Guidance: ~

#509
- Description: Introduces appearanceOverrides prop for the KImg component
- Products impact: new API
- Addresses: learningequality#371
- Components: KImg
- Breaking: No
- Impacts a11y: No
- Guidance: -

#516
- Description: Upgrades follow-redirects dependency
- Products impact: Dependency upgrade
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#508
- Description: Update Github maintained github actions to latest versions
- Products impact: -
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#502
- Description: Add dispatching of 'error' event when failed to load image for 'KImg'
- Products impact: new API
- Addresses: learningequality#372
- Components: KImg
- Breaking: no
- Impacts a11y: yes
- Guidance: Allows the consumer to hook into the lifecycle of 'KImg' and handle the cases when the image fails to load

#505
- Description: Added custom implementation of GH action that checks that changelog is updated in each pull request
- Products impact: none
- Addresses: learningequality#481
- Components: -
- Breaking:
- Impacts a11y:
- Guidance: -

#493
- Description: Changed the value of z-index of KDropdownMenu to 99.
- Products impact: Bugfix
- Addresses: learningequality#486
- Components: KDropdownMenu
- Breaking: No
- Impacts a11y: No
- Guidance: -

#500
- Description: Upgrades vue-router dependency
- Products impact: Dependency upgrade
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#421
- Description: Upgrades kolibri-tools dependency and removes KDS' circular dependency on itself
- Products impact: Dependency upgrade
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#499
- Description: Upgrades @babel/traverse dependency to address security vulnerability
- Products impact: Dependency upgrade
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#467
- Description: Upgrades word-wrap dependency to address security vulnerability
- Products impact: Dependency upgrade
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#483
- Description: Upgrades browserify-sign dependency to address security vulnerability
- Products impact: Dependency upgrade
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#494
- Description: Update contributing guidelines
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#492
- Description: Add autofocus directive on KRadioButton to fix autofocus behavior on dynamic rendering.
- Products impact: bugfix
- Addresses: learningequality#489
- Components: KRadioButton
- Breaking: no
- Impacts a11y: yes
- Guidance: Add "autofocus" prop on KRadioButton. This change improves keyboard navigation on forms where a KRadioButton jumps into the DOM.

#497
- Description: KDropdownMenu now emits a @tab event when the user hits the [Tab] key and a @close event when the menu is closed programmatically. Additionally, a new icon for Expand All was added and can be used just like any other icon with the "expandAll" name.
- Products impact: updated API
- Addresses: -
- Components: KDropdownMenu
- Breaking: No
- Impacts a11y: yes
- Guidance: The @tab event can be used for more precise focus management as the popover by default could end up sending focus to the root HTML element by default. Note that the browser event is passed to the handler function, so you may need/want to call preventDefault() on that event depending on your use case.
#491
- Description: Replaced setTimeout with requestAnimationFrames in tests for useKWindowDimensions and useKResponsiveWindow
- Products impact: -
- Addresses: learningequality#480
- Components: none
- Breaking: no
- Impacts a11y: no
- Guidance: -
#478
- Description: Changed _dev-only to dev-only
- Products impact: -
- Addresses: learningequality#474
- Components: none
- Breaking: no
- Impacts a11y: no
- Guidance: -
#482
- Description: Changed develop branch to main branch in Readme
- Products impact: -
- Addresses: learningequality#479
- Components: none
- Breaking: no
- Impacts a11y: no
- Guidance: -
#485
- Description: Updated KRadioButton 'value' prop to 'buttonValue'
- Products impact: Updated API
- Addresses: learningequality#379
- Components: KRadioButton
- Breaking: Yes
- Impacts a11y:
- Guidance: KRadioButton 'value' prop is deprecated. Please use the 'buttonValue' prop instead.

Version 2.0.0

#464
- Description: Add KTextTruncator
- Products impact: new API
- Addresses: learningequality#450
- Components: KTextTruncator
- Breaking: no
- Impacts a11y: no
- Guidance: -

#460
- Description: Add KLogo
- Products impact: new API
- Addresses: learningequality#373
- Components: KLogo
- Breaking: no
- Impacts a11y: no
- Guidance: -

#470
- Description: Fix bug and add test guard in MediaQuery implementation
- Products impact: none
- Addresses: -
- Components: none
- Breaking: no
- Impacts a11y: no
- Guidance: -

#469
- Description: Throttle the resize listener handler
- Products impact: updated API
- Addresses: learningequality#461
- Components: useKResponsiveWindow
- Breaking: no
- Impacts a11y: no
- Guidance: -

#472
- Description: Fix useKShow bug and add tests
- Products impact: bugfix
- Addresses: -
- Components: useKShow
- Breaking: no
- Impacts a11y: no
- Guidance: -

#463
- Description: Add deprecation warning for KResponsiveWindowMixin
- Products impact: updated API
- Addresses: learningequality#459
- Components: KResponsiveWindowMixin
- Breaking: no
- Impacts a11y: no
- Guidance: useKResponsiveWindow composable should be used instead

#462
- Description: Fix internal links in design system documentation
- Products impact: none
- Addresses: learningequality#423
- Components: none
- Breaking: no
- Impacts a11y: no
- Guidance: -

#453
- Description: Fix sidepanel opening in Kolibri Library page after resizing window
- Products impact: bugfix
- Addresses: learningequality/kolibri#11212
- Components: useKResponsiveWindow (composable)
- Breaking: no
- Impacts a11y: no
- Guidance: -

#449
- Description: Fix textbox being unexpectedly focused after the first page load
- Products impact: bugfix
- Addresses: learningequality/kolibri#9077
- Components: KTextbox
- Breaking: no
- Impacts a11y: yes
- Guidance: -

#450
- Description: Add new changelog and GH action to check that the changelog is updated in each pull request
- Products impact: -
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#448
- Description: Adds KTransition
- Products impact: new API
- Addresses: -
- Components: KTransition
- Breaking: no
- Impacts a11y: no
- Guidance: Exposes predefined set of transitions built on top of Vue's <transition>

#448
- Description: Add a new prop, disableDefaultTransition, to KCircularLoader
- Products impact: new API
- Addresses: -
- Components: KCircularLoader
- Breaking: no
- Impacts a11y: no
- Guidance: You can use the new prop to prevent from glitches when using the loader in tandem with another component, both of them wrapped in a transition

#448
- Description: Rename KCircularLoader's show prop to shouldShow
- Products impact: updated API
- Addresses: -
- Components: KCircularLoader
- Breaking: yes
- Impacts a11y: no
- Guidance: If you use show prop on KCircularLoader, rename it to shouldShow

#448
- Description: Add useKShow composable. Related refactoring of KCircularLoader.
- Products impact: new API
- Addresses: -
- Components: useKShow, KCircularLoader
- Breaking: no
- Impacts a11y: no
- Guidance: -

#447
- Description: Improve contributing guidelines and add a playground page for developers
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#446
- Description: Fixes icon components' color property not being applied for some custom icons by removing hardcoded fill color from svg files. Affected icons: computerScienceResource, currentEventsResource, diversityResource, entrepreneurshipResource, environmentResource, financialLiteracyResource, historyResource, learningSkillsResource, literacyResource, logicCriticalThinkingResource, mathematicsResource, mentalHealthResource, readingAndWritingResource, sciencesResource, skillsResource
- Products impact: bugfix
- Addresses: learningequality#395
- Components: KIcon, KIconButton, KLabeledIcon
- Breaking: no
- Impacts a11y: no
- Guidance: -

#446
- Description: KIcon throws a warning about color prop not being applied for icons that are supposed to have fixed colors
- Products impact: new API
- Addresses: learningequality#395
- Components: KIcon, KIconButton, KLabeledIcon
- Breaking: no
- Impacts a11y: no
- Guidance: -

#443
- Description: Update inputs within KDateRange to type date and add support for RTL languages
- Products impact: bugfix
- Addresses: learningequality#442
- Components: KDateRange
- Breaking: no
- Impacts a11y: no
- Guidance: -

#436
- Description: Remove KContentRenderer component
- Products impact: removed API
- Addresses: -
- Components: KContentRenderer
- Breaking: yes
- Impacts a11y: no
- Guidance: Import KContentRendered from Kolibri repository

#437
- Description: Update README with our approach to vendored Keen UI files + add installation step to yarn link guidelines
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#433
- Description: Add new props, minVisibleTime and show, to KCircularLoader to allow it being displayed for a desired minimum amount of time
- Products impact: new API
- Addresses: -
- Components: KCircularLoader
- Breaking: no
- Impacts a11y: no
- Guidance: -

#429
- Description: Allows KSelect to extend outside of KModal
- Products impact: bugfix
- Addresses: learningequality#324
- Components: KSelect, KModal
- Breaking: no
- Impacts a11y: no
- Guidance: Some core calculations were tweaked so it would be wise to preview KModal and KSelect for regressions

#427
- Description: Display the months of the year within the KDateCalendar in the correct language
- Products impact: bugfix
- Addresses: -
- Components: KDateRange
- Breaking: no
- Impacts a11y: yes
- Guidance: -

#426
- Description: Add 'click' event to KTabsList
- Products impact: new API
- Addresses: -
- Components: KTabsList
- Breaking: no
- Impacts a11y: no
- Guidance: -

#426
- Description: Fix KTabsList focus state
- Products impact: bugfix
- Addresses: -
- Components: KTabsList, KTabs
- Breaking: no
- Impacts a11y: no
- Guidance: -

#425
- Description: Adds pinned and notPinned icons
- Products impact: new API
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#425
- Description: Updates cloud icon to outline style
- Products impact: updated API
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#424
- Description: Adds laptop, cloud and wifi icons
- Products impact: new API
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: no
- Guidance: -

#420
- Description: Fix randomly missing focus ring
- Products impact: bugfix
- Addresses: -
- Components: -
- Breaking: no
- Impacts a11y: yes
- Guidance: -

#420
- Description: Add KTabs, KTabsList, and KTabsPanel components
- Products impact: new API
- Addresses: learningequality#385
- Components: KTabs, KTabsList, KTabsPanel
- Breaking: no
- Impacts a11y: yes
- Guidance: -

#403
- Description: Add KOptionalText
- Products impact: new API
- Addresses: learningequality#285
- Components: KOptionalText
- Breaking: no
- Impacts a11y: no
- Guidance: -

#387
- Description: Fix KDropdownMenu causing the window to scroll to the top on the menu button click
- Products impact: bugfix
- Addresses: learningequality/kolibri#9833 (comment)
- Components: KDropdownMenu
- Breaking: no
- Impacts a11y: no
- Guidance: -

#406
- Description: Fixes months displayed at the turn of a year in KDateRange, removes font-family, and fixes console warnings
- Products impact: bugfix
- Addresses: learningequality#405
- Components: KDateRange
- Breaking: no
- Impacts a11y: no
- Guidance: -

#404
- Description: Initial implementation of KImg component
- Products impact: new API
- Addresses: learningequality#369
- Components: KImg
- Breaking: no
- Impacts a11y: no
- Guidance: -

#402
- Description: Fixes partially hidden KSelect's dropdown menu when there is not enough space below the button. The menu will now show above the button in such a scenario.
- Products impact: bugfix
- Addresses: learningequality/kolibri#7752
- Components: KSelect
- Breaking: no
- Impacts a11y: no
- Guidance: -

#378
- Description: Fix KDropdownMenu not showing after its refactor in #346 by adding missing template tags to KButton
- Products impact: bugfix
- Addresses: learningequality/kolibri#9754
- Components: KDropdownMenu, KButton
- Breaking: no
- Impacts a11y: no
- Guidance: -

#384
- Description: Add KDateRange component
- Products impact: new API
- Addresses: learningequality#360
- Components: KDateRange
- Breaking: no
- Impacts a11y: no
- Guidance: -

#393
- Description: Update developers documentation to not include deleting KDS from package.json
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#400
- Description: Fix useKWindowDimension's resize event listener not being properly removed
- Products impact: bugfix
- Addresses: learningequality#398
- Components: useKWindowDimension
- Breaking: no
- Impacts a11y: no
- Guidance: -

#401
- Description: KBreadcrumbs's links to intermediary items can be optionally disabled by omitting the link attribute, or making it falsey
- Products impact: new API
- Addresses: -
- Components: KBreadcrumbs
- Breaking: no
- Impacts a11y: no
- Guidance: -

#380
- Description: Wraps KRadioButton' label instead of truncating it. Adds a new prop, truncateLabel, that turns on truncating rather than wrapping.
- Products impact: updated API
- Addresses: learningequality#350
- Components: KRadioButton
- Breaking: yes
- Impacts a11y: no
- Guidance: Examine places where KRadioButton is used and see whether the new default behavior (wrapping) is problematic. If needed, you can set truncateLabel to true to retain the previous default behavior (truncating).

#380
- Description: Add the showLabel prop to KRadioButton to determine whether a label should be displayed. Relatedly, make label prop optional.
- Products impact: new API
- Addresses: learningequality#349
- Components: KRadioButton
- Breaking: no
- Impacts a11y: no
- Guidance: -

#380
- Description: KRadioButton emits 'blur' event on blur
- Products impact: new API
- Addresses: learningequality#349
- Components: KRadioButton
- Breaking: no
- Impacts a11y: no
- Guidance: -

#377
- Description: Add useKResponsiveWindow composable
- Products impact: new API
- Addresses: learningequality#288
- Components: useKResponsiveWindow
- Breaking: no
- Impacts a11y: no
- Guidance: -

#353
- Description: Update README.md guidance on yarn link
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#367
- Description: Better naming of the changelog section
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#358
- Description: Improves DocsShowCode component layout
- Products impact: none
- Addresses: -
- Components: -
- Breaking: -
- Impacts a11y: -
- Guidance: -

#357
- Description: Bind all attributes to navigation element within KBreadcrumbs
- Products impact: updated API
- Addresses: -
- Components: KBreadcrumbs
- Breaking: no
- Impacts a11y: yes
- Guidance: Even though this is a general update that allows all KBreadcrumbs attributes to be passed right to its <nav>, we intially did it to support adding aria-label easily. Whenever you use KBreadcrumbs, consider improving a11y through ariaLabel attribute on KBreadcrumbs.

#361
- Description: Fixes 'Property or method "disabled" is not defined on the instance but referenced during render.' raised by KDropdownMenu. Related to updates introduced in #346.
- Products impact: bugfix
- Addresses: -
- Components: KDropdownMenu
- Breaking: no
- Impacts a11y: no
- Guidance: -

#361
- Description: KButton exposes hasDropdown prop which will show the dropdown arrow icon in a button. Related to updates introduced in #346.
- Products impact: updated API
- Addresses: -
- Components: KButton
- Breaking: no
- Impacts a11y: no
- Guidance: -

#346
- Description: KButton: The default slot doesn't take precedence over the text prop anymore. The slot's content will be rendered above text when both are provided.
- Products impact: updated API
- Addresses: learningequality#164, learningequality#136
- Components: KButton
- Breaking: yes
- Impacts a11y: no
- Guidance: If you use KButton's default slot simultaneously with the text prop, the button most likely won't render as expected. You might need to add some kind of a custom condition to resolve that.

#346
- Description: KDropdownMenu has a new prop hasIcons which controls whether or not the options display an icon.
- Products impact: new API
- Addresses: -
- Components: KDropdownMenu
- Breaking: no
- Impacts a11y: no
- Guidance: -

#346
- Description: KDropdownMenu no longer contains a button. All props related to buttons were removed from KDropdownMenu, namely text, appearance, and disabled. KButton and KIconButton has a new #menu slot in which KDropdownMenu can be placed.
- Products impact: updated API
- Addresses: learningequality#164
- Components: KDropdownMenu
- Breaking: yes
- Impacts a11y: no
- Guidance: Place KDropdownMenu into KButton's or KIconButton's menu slot and move text, appearance, and disabled props from KDropdownMenu to KButton/KIconButton. See an example in the documentation. Visit "Props" and "Slots" sections of these components' documentation pages for more details.

#355
- Description: Moves KSelect from Kolibri to KDS
- Products impact: new API
- Addresses: learningequality#339
- Components: KSelect
- Breaking: no
- Impacts a11y: no
- Guidance: -

#351
- Description: Wrap KCheckbox default slot's content in <label>
- Products impact: updated API
- Addresses: learningequality#347
- Components: KCheckbox
- Breaking: yes
- Impacts a11y: yes
- Guidance: Even though this will fix all places where we forgot to wrap the default's slot content in <label>, it will cause problems in places we didn't forget to do so as there will now be two <label>s wrapping the label content. Therefore, check all places where KCheckbox is used and if you see <label> in its default slot, remove it.

Version 1.4.x

#185 - Handle arrow key navigation and improve focusOutline
#338 - Allow for new 'nav' slot inline in the toolbar
#362 - Add documentation pages for 'KResponsiveWindow' and 'KResponsiveElement'
#364 - Fixes 'Missing focus ring around password inputs' while navigating with keyboard.

Version 1.3.1

#309 - Add jest testing environment to KDS
#311 - Add tests for KRouterLink
#313 - Add tests for KButton
#315 - Add tests for KCheckbox
#320 - Add tests for KModal
#322 - Add tests for KTextbox

Version 1.3.0

#291 - When tracking input modality with trackInputModality, modality is set to keyboard only when the TAB key is pressed
#292 - Add KBreadcrumbs page to the components documentation
#292 - Optimize KBreadcrumbs to use all space available
#292 - Fix KBreadcrumbs items vertical alignment
#292 - Fix KBreadcrumbs items not collapsing when there are more instances on a page

Version 1.2.1

#279 - Fix vertical shifting of KTextbox

Version 1.2.0

#281 - Allow KModal to take a size in pixels
#278 - Adds timer icon
#275 - Renames some icons: socialScienceResource -> socialSciencesResource, mathResource -> mathematicsResource, scienceResource -> sciencesResource, readingWritingResource -> readingAndWritingResource

Version 1.1.0

Added

#270 - New icons for Kolibri 0.15
#272 - Enable 'Loaders' documentation page which was previously hidden

Version 1.0.0

Added

#116, #255 - Changelog
#204 - pointsLeaf icon
#217 - copyToClipboard, infoPrimary, home, unpublishedChange, publishedResource icons
#236 - Learning activity icons
#231 - incorrectReport, registeredKDP, and superadmin icons
#229 - warningIncomplete icon
#150, #152 - KRouterLink - icon, iconAfter and replace props
#199 - KCheckbox - description prop
#137, #142 - KExternalLink - openInNewTab prop
#224 - KContentRenderer - timeSpent, duration, forceTimeBasedProgress, and durationBased props
#108 - App bar documentation
#133 - Documentation about using icons in reStructuredText
#134, #174 - Glossary and anchor links
#165 - Documentation for library components:
- KButton
- KRouterLink
- KExternalLink
- KButtonGroup
- KIconButton
#184 - Imperative verb guidance for modals and page headers
#188 - Menu offset guidelines
#194 - Filters pattern page for:
- Dropdown menus
- Text input dropdowns
- Text filters
- Checkbox lists
#250 - Documentation for design system release process

Changed

#140 - Material design icons is no longer a direct dependency (only a dev dependency) which should reduce timeout errors for products depending on KDS
#143 - KExternalLink - Updated icons and margins for RTL support
#139, #240 - KTextbox - Changed background color and error text color
#153 - KButton - Updated basic-link spacing and color between icons
#223 - Improved component API documentation
#229 - Renamed publishedResource icon to unpublishedResource
#192 - Updated design principles wording
#144 - Updated page headers
#186 - Updated KCheckbox and KSwitch examples

Removed

#243 - KContentRenderer - Removed download_url from mixin

Fixed

#227 - Global styles - Focus outline no longer shows when hovering over elements
#191 - KTextbox - Keyboard-input focus outlines are the standard blue focus
#195 - KRouterLink - Fixed text-wrapping in Safari so child takes full width of parent
#199 - KCheckbox - Updated label display if both slot and label are given
#180 - KDropdownMenu - Removed need to hit tab twice when using keyboard to open dropdown
#145 - KIconButton - Fixed distortion occurring with resized windows by adding minWidth
#191 - KSwitch - Fixed keyboard-input focus outlines so they are the standard blue focus
#195 - KLabeledIcon - Fixed text-wrapping in Safari so child takes full width of parent
#200 - Design system - Fixed keyboard focus rings in examples
#209 - Design system - Fixed sidebar vertical scrolling
#256 - KTextBox - Fixed autofocus error

Version 0.2.1

Added

#95 - Design principles documentation
#97 - Errors documentation
#105 - Switches documentation
#106 - Menu documentation
#110 - email, sidebar, and add icons
#252 - a11y, alternativeRoute, disconnected, forwardRounded, and restart icons
#104 - Support for exporting icons to reStructuredText user documentation

Changed

#121 - Updated clipboard icon
#93 - Fixed regression related to external links opening in new tabs

Removed

#251 - duplicate and copyToClipboard icon aliases removed in favor of copy
#251 - domain icon alias removed because it was the same icon as facility

Fixed

#95, #122 - Fixed z-order bug in icon button
#112, #114, #115 - Documentation bugs and improvements

Version 0.2.0

This was the first release of the Design System, with documentation written in a Nuxt-based statically-generated site. The focus was on migrating components out of the Kolibri and making them reusable in a shared component library.

Version 0.1.0

The design system was originally based on a set of internal Kolibri components and their use as documented in the Kolibri Style Guide, which was first introduced into the Kolibri code base in version 0.6. This remained until version 0.13 after which the content was migrated to the current site.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

CHANGELOG.md

CHANGELOG.md

Changelog

Version 4.x.x (`release-v4` branch)

Version 3.x.x (`release-v3` branch)

Version 2.0.0

Version 1.4.x

Version 1.3.1

Version 1.3.0

Version 1.2.1

Version 1.2.0

Version 1.1.0

Added

Version 1.0.0

Added

Changed

Removed

Fixed

Version 0.2.1

Added

Changed

Removed

Fixed

Version 0.2.0

Version 0.1.0

Files

CHANGELOG.md

Latest commit

History

CHANGELOG.md

File metadata and controls

Changelog

Version 4.x.x (release-v4 branch)

Version 3.x.x (release-v3 branch)

Version 2.0.0

Version 1.4.x

Version 1.3.1

Version 1.3.0

Version 1.2.1

Version 1.2.0

Version 1.1.0

Added

Version 1.0.0

Added

Changed

Removed

Fixed

Version 0.2.1

Added

Changed

Removed

Fixed

Version 0.2.0

Version 0.1.0

Version 4.x.x (`release-v4` branch)

Version 3.x.x (`release-v3` branch)