Cross platform UI controls for progressive web and hybrid apps (plain JS, jQuery, Angular and React)

Overview

Mobiscroll

What is Mobiscroll?

Mobiscroll is a UI library for progressive webapps and hybrid development. Created with a lot of attention to usability and performance. Mobiscroll Forms ships with 15 customizable controls that you can use for free that are included in this repository. For advanced functionality use Forms with:

Where can I use Mobiscroll?

You can use the controls in web and hybrid/native cross-platform apps. At its core Mobiscroll is framework agnostic, but API variants for jQuery/jQuery Mobile, Angular/Ionic, Angular JS/Ionic 1 and React is available.

Elements

Single and multiline text (live example)

Text fields are the backbone of every form. Use them to capture a wide range of properties from plain text to passwords.

Use labels, icons, placeholders or a combination of them to help users get meaning at a glance. Show/hide functionality built in for password fields.

Select styling (live example)

Similar to the single line input styling, it features a chevron/dropdown arrow to clearly signal the difference between select and text input.

Buttons (live example)

Buttons with different states, styles and alignments. Inline or raised, left aligned, right aligned, centered or justified. Full-width buttons supported as well.

Use it with or without icons.

Segmented control (live example)

Easily lay out two to five options for single and multiple select. Making all options instantly visible lets users make selections with a single interaction instead of at least 3 (tap to open select, do the select, hit set - like for the traditional dropdown).

Checkbox and checklist (live example)

Similar to the native checkbox in functionality, but with a look and feel that fits with the overall user experience and theme. Features description text, checkbox list and disabled styling.

Excellent choice for inline multi-select lists.

Radio button list (live example)

Single select for a list of options. Use it instead of the segmented control if there are more items that would fit in a single line.

Usually a good choice for five options and above. Features disabled styling and optional description.

Switch (live example)

Just like the checkbox, the switch lets users turn options on/off. Can be rendered as a list of fields, like the checkbox list or as a stand-alone control.

Features optional description and disabled styling.

Stepper (live example)

When users need to make small adjustments to values by increasing or decreasing it avoid free-form input and dropdowns. Steppers help in minimizing mistakes, and reduce the number of taps for getting the values right.

Page and typography (live example)

Takes care of setting the background colors, spacing and typographic styling. It makes sure that the content you add shows up nicely on any screen-size.

Slider (live example)

Work your way from a monotone, dropdown heavy form to an easily scannable page by switching controls. Consider using sliders for selecting one or multiple values from a range.

Continuous ranges, steps, floating value display, disabled styling and usage with icons is supported out of the box.

Progress (live example)

Provide visual feedback to the user. Reduce anxiety and help people understand progress with the control. You can also use it as a completness meter to show how the user does on completing a purchase.

With a powerful API control the state, value programtically and restart, pause it if you need to.

Alert, confirm and prompt (live example)

Show alert messages, confirmation dialogs and prompt for focused value entry. With a platform-specific look and feel, you can make your users feel at home and communicate what they actually need to see.

These controls cannot be dismissed by pressing the overlay, avoiding closing it by mistake.

Toast and snackbar (live example)

Keep your users up to date with notifications. Either in form of a toast or a snackbar.

You can optionally provide an action with the message - such as UNDO or RETRY - which will help the user make progress faster towards their goal.

Commercial Components

Date & time pickers

Event calendar

Pickers & dropdowns

Pickers & dropdowns

Gesture enabled responsive list

Documentation

For the complete documentation of Mobiscroll Forms and all products, please visit https://docs.mobiscroll.com

Demos and examples

Getting help

The Mobiscroll team does not provide technical support for Mobiscroll Lite. To get support from the team purchase a license or join the community forums

Release notes

For the complete release history and changelog, visit https://mobiscroll.com/releases

Get in touch

Contact https://mobiscroll.com/contact

Twitter http://twitter.com/mobiscroll

Facebook https://www.facebook.com/mobiscroll

License Information

This project has been released under the Apache License, version 2.0, the text of which is included below. This license applies ONLY to the source of this repository and does not extend to any other Mobiscroll distribution or variant, or any other 3rd party libraries used in a repository. For licensing information about Mobiscroll, see the License Agreements page at mobiscroll.com.

Copyright © 2021 Mobiscroll

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.

Comments
  • Mode bug: clickpick / mixed

    Mode bug: clickpick / mixed

    Hi all,

    1 - If I use mixed mode in adroid and after I click arrow, the value is changing two times. for example if the current value is 24 and after one click on arrow, the value jumps to 26 and it is not possible to select 25 afterwords without scrolling.

    2- in clickpick mode if you click arrows on mobiscroll the value is decreasing, but if you do the same on native pickers value is increasing. Is there any way to configure this.

    Thanks, Have a nice weekend

    opened by aborjinos 10
  • Date issues under firefox

    Date issues under firefox

    Thanks for you work guys, I find your plugin really useful.

    Not sure what exactly is the source of the problem, but under the current version of Firefox developer edition 39.0a2 (2015-04-08) there's a problem with the mobiscroll date demo.

    On your demo page if I choose March, 1981-1984 the only available day number is 1. No errors are reported to console.

    opened by serjrd 9
  • Getting errors in Angular when using the mbsc-datepicker as directive instead of the component.

    Getting errors in Angular when using the mbsc-datepicker as directive instead of the component.

    This error: image

    It is happening every time I change some configuration dinamically (I didn't test all configurations).

    For example, I'm using 2 pickers to set the start and end of an event, when I set the start and change dinamically the "min" of the end, I get this error.

    I tried making a workaround using the range picker to not have to modify the "min", but then I get the error when changing the "controls" dinamically, from ["calendar", "time"] to ["calendar"] when marking the event as allDay. But normally I get the error when the end has been setted, when using the range.

    The error is happening like a loop, so it blocks the platform I'm working on, and it happens only when using the directive.

    I'm using this version of angular and mobiscroll: image

    One observation, when I was using the version 4.10.6, I was only getting a maximum call stack error, when changing the "min" dinamically. Normally the errors occurs when the picker has value, and a configuration has changed, but doesn't matter in what order that was made, and that is true for the v4 and v5.

    bug core 
    opened by luthor77 8
  • Angular doensn't compile with mobiscroll in version 9 rc.8 and newer with Ivy enabled.

    Angular doensn't compile with mobiscroll in version 9 rc.8 and newer with Ivy enabled.

    This error happens:

    ERROR in The target entry-point "@mobiscroll/angular" has missing dependencies:

    • ../src/js/i18n/pt-BR
    • ../src/js/themes/mobiscroll-dark
    • ../src/js/themes/material
    • ../src/js/themes/material-dark
    • ../src/js/themes/auto-theme

    I don't know if this is a problem with Angular or Mobiscroll, and I don't know how to create an repository using the mobiscroll paid version.

    With ivy disabled, it compiles, but the ng test gives the same error.

    I'd be grateful with any help.

    opened by luthor77 7
  • Calendar clear button throws an error

    Calendar clear button throws an error

    This issue occurs when a month/year was navigated on the calendar and after that the clear button was pressed.

    It gives a Uncaught TypeError: Cannot read property 'html' of undefined error.

    bug calendar 
    opened by szily20 7
  • Calendar

    Calendar "onMonthLoaded" not being triggered after clicking on month/year list

    It works as expected if tapping or touching month/year handler buttons, but not if you select from the list that appears if you touch the month/year label. This is the only method I found for doing what I need to do (attach an event every time the month/year change) :( is there any workaround for this? Thanks!

    Example:

    $(el).mobiscroll().calendar({
        onMonthLoaded: function () { console.log("ADASD"); }
    });
    

    yes

    no

    bug calendar 
    opened by LufoX11 7
  • Date wheel scrolling into infinite loop

    Date wheel scrolling into infinite loop

    while selecting the date some time the wheel scrolls into infinite loop.

    Using android 4.1 and date api in scroller mode and phonegap.

    another issue in the video is when we keep tapping on the arrow, suddenly the mobiscroll closes.

    please see the video on the below url.

    https://drive.google.com/file/d/0BwNuEKato6uEbXFtdWdnRW1iZXM/view?usp=sharing

    bug core 
    opened by seycRDTEK 7
  • Feature request: minHour and maxHour on datetime scroller

    Feature request: minHour and maxHour on datetime scroller

    Datetime scroller currently has min/maxDate. It would be nice to have min/maxHour as well. One use case is so that you can only select within valid business hours.

    opened by johnnyshields 7
  • Month shows 0 - 11 on wheel using dateFormat: 'm/d/yy'

    Month shows 0 - 11 on wheel using dateFormat: 'm/d/yy'

    Hello, I downloaded mobiscroll.datetime-2.4.5. If dateFormat for month is m (no leading zero), the available months shown on wheel are from 0 to 11. So if the current date is 3/20/13, date being displayed on wheel is 2/20/13. Tried this dateFormat using the demo html index-jqmwidget-2.4.5.html, the issue is repro.

    bug datetime 
    opened by yyhhoouu 7
  • Calendar/Range on IE9 very slow

    Calendar/Range on IE9 very slow

    Measuring performance on IE9 is very tedious, but before I would like to know if there's known performance issues on IE9. The Calendar seems to open after a very very long time, but the browser either chokes on JS execution or even memory. I will do my best to provision a machine with Windows 7 with IE9 to give more info.

    Any more information on this?

    I'm using the latest Mobiscroll Range component with jQuery.

    opened by Rendez 6
  • infinite wheel

    infinite wheel

    I wonder if it is possible to have an infinite wheel, eg. with an image scroller. So that after the last list entry the first one will show up and vice versa. If it is not possible yet, this should be a feature request

    feature 
    opened by Spica2 6
  • Timeline: inconsistent behaviour when changing timescale

    Timeline: inconsistent behaviour when changing timescale

    Can be reproduced using this example:

    https://demo.mobiscroll.com/jquery/timeline/daily-weekly-monthly-yearly-timeline#

    Set timescale to 4-hours: image

    Set timescale to 12 hours: image

    Now, set the timescale to 24 hours and then back to 12 hours. This 12-hour view is different than the previous : image

    opened by gudleik 0
  • Timeline schedule slot not displaying properly if schedule card has dynamic height

    Timeline schedule slot not displaying properly if schedule card has dynamic height

    I am currently using the Timeline component is there a way that the schedule card is properly rendered if the height is dynamic? Currently our component height is dependent on the contents inside it. I am encountering an issue wherein there are white spaces if the schedule slot has a different height

    Screen Shot 2022-08-31 at 3 16 25 PM

    Another example is the schedule slot overlapping on page loads because the height is different for every schedule slot. Screen Shot 2022-09-01 at 8 57 56 AM 0751.png)

    How can I fix this?

    opened by webdevsyd 0
  • [Popup] Anchored Popup failing in React 18 strict mode

    [Popup] Anchored Popup failing in React 18 strict mode

    Issue

    Anchored Popover element critically fails with React 18 strict mode.

    I started seeing this issue after updating a project to React 18.2.0 and Mobiscroll from 5.17.1 to 5.18.1. Screen Shot 2022-08-12 at 12 42 09 PM

    I reviewed the Mobiscroll 5.18.1 release notes and noticed this bug-fix Screen Shot 2022-08-12 at 12 45 24 PM

    I tried turning off strict mode and now things work as expected.

    Expected Behavior

    Anchored Popover element works as usual with strict mode on.

    opened by HillaryManning 1
  • Tooltip is not closed when new tab is opened and switched to from link on the event

    Tooltip is not closed when new tab is opened and switched to from link on the event

    I have an event in the mbsc-eventcalender that has a link to another site and also displays a tooltip. When clicking the link and then switching back to the eventcalendar the tooltip persists without any info displayed.

    https://user-images.githubusercontent.com/56864140/183434767-c3a41ea4-3005-431e-82c3-a9c0890ce5a9.mp4

    opened by robertreimann 0
  • Date and Time picker issue with voice-over

    Date and Time picker issue with voice-over

    The time picker is not accessible with voice-over. When "swiping" inside the calendar, the scroller for choosing time is not possible to get to without clicking directly in the time scroller. If the user clicks the time scroller, it's not possible to change the time

    Version 5.15.2

    opened by GlenStautland 0
  • Improve mobiscroll interaction with autotesting

    Improve mobiscroll interaction with autotesting

    When writing autotests for applications, mobiscroll tends to be difficult to deal with. Despite opening the modal with the current month active, a click on a date with autotesting tools like Cypress tends to be difficult due to the existence of multiple hidden grids for non-active months. For instance, if I were to use cypress in order to click a date in the current opened month, it would go back, switch the modal to a previous point in time and click the same date in a different month.

    Performing a query on all clickable mbsc-calendar-day objects yield a result of 140 something clickables, despite a month having a maximum of 31 days. I do not understand the need to keep all of this invisible to the user, instead of loading the frontend on a month to month basis off the users selections in the modal.

    We can sidestep this by mandating that the clickable's parent object has the property :visible, but it also creates a larger issue when selecting timespans that overlap two different months.

    opened by MessiasMorten 0
Releases(v4.10.9)
  • v4.10.9(May 17, 2021)

    Changelog

    All

    • Fixed: We fixed the scss deprecation warnings which appeared when used with the new Dart Sass.

    Calendar

    • Fixed: We fixed a bug, that caused an infinite loop exception in Angular, when the calendar's input field was empty and editable. The exception was thrown right after the calendar was opened.

    • Fixed: We fixed a typo in the Italian day name translation.

    Cards

    • Fixed: We fixed an issue, where the themeVariant option used on the Card component was unwillingly passed to a div element, which resulted in a warning in React.

    Datetime

    • Fixed: We fixed a typo in the Italian day name translation (#484).

    Eventcalendar

    • Fixed: We fixed an issue, where the weekDays and yearChange options were not working if specified inside the responsive option.

    • Fixed: We fixed a typo in the Italian day name translation.

    Forms

    • Fixed: We fixed an issue with the Stepper component, where the plus button was not disabled when min was equal to max.

    Numpad

    • Fixed: We improved on the type definitions of the option method. You can now pass options that are specific to the different presets like the decimal or the timespan numpad for example.

    Select

    • Fixed: We fixed an issue where the Select was not properly destroyed if initialized on an input element with data option.

    • Fixed: We fixed an issue where in desktop mode the first option was partly out of view in case of event row numbers (#480).

    Source code(tar.gz)
    Source code(zip)
  • v4.10.8(Jan 22, 2021)

    Changelog 4.10.8

    All

    • Fixed: We fixed a bug, which caused an exception when a picker was closed programmatically right after open.

    Calendar

    • Fixed: We improved the calendar previous and next button listeners to use currentTarget instead of this for Salesforce LWC compatibility.

    Eventcalendar

    • Fixed: We improved the calendar previous and next button listeners to use currentTarget instead of this for Salesforce LWC compatibility.

    • Fixed: We improved the event ordering so that cross-day events not marked as all day will not appear on top.

    • New: We added the eventOrder option to customize the sort order of the events.

    Forms

    • Fixed: We fixed the source code of the collapsible to use an ES6 syntax which works with an Angular app without the need to transpile.

    • Fixed: We fixed an issue with the rating control, where the stars were off in RTL mode on iOS Safari, if value was set programmatically later after initialization.

    • Fixed: We fixed an issue where sometimes toast and snackbar notifications stopped appearing if they were coming in very quickly.

    • Fixed: We fixed the slider component with 2 handles, which were stuck if both initial values were set to the maximum.

    • Fixed: We improved compatibility with Mobiscroll v5, so the v4 form elements appear correctly if v5 styling is also loaded.

    Listview

    • Fixed: We fixed an issue where the touchstart listener was attached to the document instead of the listview container, and it was not possible to stop the touch event propagation, e.g. if the listview is loaded inside a scrollview item, stopPropagation on the touchstart event is needed to prevent the scrollview from moving when a listview item is swiped.

    Numpad

    • Fixed: We fixed an issue where times like 1:08 cannot be entered, since after entering the 0, buttons above 5 were disabled.

    Range

    • Fixed: We improved the calendar previous and next button listeners to use currentTarget instead of this for Salesforce LWC compatibility.

    Changelog 4.10.7

    General

    • Fixed: We fixed the responsive option to work correctly with the theme and themeVariant options.

    Calendar

    • Fixed: We fixed a null pointer exception, which happened from time to time when the picker was closed.

    • Fixed: We fixed a type definitions issue, that lets the colors and the marked option to take a start and an end date instead of just a single date.

    • Fixed: We fixed an iOS theme button positioning issue in case of a full screen calendar, if more than two buttons were used for the picker.

    Cards

    • Fixed: We fixed the cards accordion to work correctly inside a popup.

    Eventcalendar

    • Fixed: We fixed a type definitions issue, that lets the colors and the marked option to take a start and an end date instead of just a single date.

    Forms

    • Fixed: We fixed the multiple handle slider, which broke with the introduction of passive event listeners in v4.10.4.

    • Fixed: We fixed the angular textarea component to update its initial rows when used with reactive forms.

    Navigation

    • Fixed: We fixed the layout propType in react to work without giving a warning when used with numbers.

    • Fixed: Remove outline styling from focused navigation items in Angular/Ionic.

    • Fixed: Never fire the onItemTap event on disabled items.

    • New: We added the optional animTime parameter to the navigate method for specifying the duration of the scroll animation.

    Numpad

    • Fixed: We fixed an issue in the decimal numpad, which caused '0' to appear in the input even though the selected value should have been empty.

    • Fixed: We fixed a bug in the decimal numpad, that didn't let enter all the digits of a number when used in template mode and the initial value was zero.

    • Fixed: We fixed an issue in the decimal numpad that caused the decimal point to be in the wrong place after the initial value was parsed when used in template mode.

    Scrollview

    • Fixed: We fixed the layout propType in react to work without giving a warning when used with numbers.

    • New: We added the optional animTime parameter to the navigate method for specifying the duration of the scroll animation.

    Select

    • Fixed: We fixed an issue which caused an exception if an option value contained more than one qoutation marks (").

    • Fixed: We fixed an error which occured in case of inline select with remote data.

    Range

    • Fixed: We fixed a null pointer exception, which happened from time to time when the picker was closed.

    • Fixed: We fixed a type definitions issue, that lets the colors and the marked option to take a start and an end date instead of just a single date.

    Source code(tar.gz)
    Source code(zip)
  • v4.10.6(Jul 8, 2020)

    Changelog 4.10.6

    General

    • Fixed: We fixed the production build for Angular <=8, which we broke with the implementation of Angular 10 compatibility.

    Changelog 4.10.5

    General

    • Fixed: We fixed an issue which caused an error when used with React SSR (regression introduced in 4.10.4).

    • Fixed: We added a fix to prevent the "Unable to preventDefault inside passive event listener invocation." error in case of all scroller based pickers (regression introduced in 4.10.4).

    • New: We made the necessary type changes for compatibility with Angular 10.

    • New: We exposed the option types for all react components. This helps to extend our components in typescript by creating derived types.

    Calendar

    • Fixed: We fixed the calendar title to show the correct month name in case of week view, when the view contains the selected date.

    Eventcalendar

    • Fixed: We fixed the calendar title to show the correct month name in case of week view, when the view contains the selected date.

    Range

    • Fixed: We fixed the calendar title to show the correct month name in case of week view, when the view contains the selected date.

    Scrollview

    • Fixed: We fixed a bug that resulted in an error if there were no items added to the scrollview.

    Changelog 4.10.4

    General

    • Fixed: We fixed the themeVariant setting, that caused the conrols to remain in dark mode when switching back to the light variant dynamically.

    • Fixed: We fixed the themeVariant in angular components. Now it affects the rendered mbsc-input components as well, not just the pickers.

    • Fixed: We fixed the month names in the Arabic translation.

    • Fixed: We fixed an issue with iOS 13, where not every click event was fired because of the use of non-passive touch event listeners.

    • Fixed: We got rid of violation warnings for not using passive touch event listeners.

    Calendar

    • Fixed: We fixed a bug that prevented the onCellHoverIn and onCellHoverOut events to fire after a day was clicked.

    • Fixed: We fixed a bug which caused a console error if all days on the calendar had a label.

    • Fixed: We fixed the prev / next year navigation when the Jalali calendar system was used.

    • Fixed: We fixed the invalid option to accept the object format for simple rules as well, like { d: '2020-06-15' } or { d: 'w0' }.

    • Fixed: We updated the type definitions of the value prop in react. We added support for the null value, that should be used when the calendar needs to be cleared.

    • Fixed: We fixed the multiple week selection, where limiting the number of selected weeks did not work correctly.

    Eventcalendar

    • Fixed: We fixed a bug that prevented the onCellHoverIn and onCellHoverOut events to fire after a day was clicked.

    • Fixed: We fixed a bug which caused a console error if all days on the calendar had a label.

    • Fixed: We fixed the prev / next year navigation when the Jalali calendar system was used.

    • Fixed: We fixed the invalid option to accept the object format for simple rules as well, like { d: '2020-06-15' } or { d: 'w0' }.

    • Fixed: We fixed a bug where the onPageChange, onPageLoading and onPageLoaded events fired twice when only the event list view was visible.

    Navigation

    • Fixed: We fixed the responsive option, which caused an error when used with the navigation component.

    • Fixed: We fixed a bug where an error was thrown if there were no navigation initially and the snap option was true.

    • Fixed: We added an improvement to make sure the selected item remains in the viewport after resize.

    Numpad

    • Fixed: We fixed a bug that prevented the decimal numpad to set the value to the input element in freeform entry mode when calling the setVal function.

    • Fixed: We fixed a bug that added the decimal separator, when the initial value was an integer.

    Range

    • Fixed: We fixed a bug that prevented the onCellHoverIn and onCellHoverOut events to fire after a day was clicked.

    • Fixed: We fixed a bug which caused a console error if all days on the calendar had a label.

    • Fixed: We fixed the prev / next year navigation when the Jalali calendar system was used.

    • Fixed: We fixed the invalid option to accept the object format for simple rules as well, like { d: '2020-06-15' } or { d: 'w0' }.

    Scroller

    • Fixed: We fixed a bug where scroller wheels mixed up, if multiple scrollers were initialized with the same options object.

    Select

    • Fixed: We added a missing input option for the Angular Select component.

    • Fixed: We fixed a bug that prevented the initial value to show up in the input, when multiple selection and onPush changedetection strategy was used in Angular.

    • Fixed: We fixed an issue with Angular, where single select mode was not working correctly with touchUi: false.

    Changelog 4.10.3

    General

    • Fixed: We removed the dotted outline present at the top of popups and modal pickers in Firefox.

    • Fixed: We fixed an issue that prevented the mobiscroll directives to pop up on the first tap when they were used on ion-input in Ionic 5 / Angular 9.

    Calendar

    • Fixed: We debounced the onCellHoverIn and onCellHoverOut to prevent firing on unintended hover, or during mousedrag.

    • Fixed: We fixed a problem where recurring invalids for month days were not working correctly, when a month day was used which is not present in every month (29, 30, 31).

    • New: Added mbsc-calendar-mark scss color variable allowing to set the default color of the marks.

    • New: We added a feature which allows presenting calendar labels as text only, without colored background, by specifying the background: 'none' property.

    Eventcalendar

    • Fixed: We debounced the onCellHoverIn and onCellHoverOut to prevent firing on unintended hover, or during mousedrag.

    • Fixed: We fixed a problem where recurring invalids for month days were not working correctly, when a month day was used which is not present in every month (29, 30, 31).

    • Fixed: We fixed a rendering issue on iOS 13 WebView, where the month / year picker appeared without a background.

    • New: Added mbsc-calendar-mark scss color variable allowing to set the default color of the marks.

    Forms

    • Fixed: We added a missing type definition for the Slider component in React.

    Listview

    • Fixed: We fixed an issue where the listview was not rendered properly during scroll, inside a scrollable container other than the main window, on iPad OS 13.

    Numpad

    • Fixed: We added proper keyboard support for freeform decimal entry (., +, and - keys).

    Popup

    • Fixed: We fixed a positioning issue where the popup went off screen with the soft keyboard opened on iOS 9.

    Range

    • Fixed: We fixed an issue where the calendar jumped back to the current month in Angular when the mbsc-range-start and mbsc-range-end components were used with a custom set button.

    • Fixed: We debounced the onCellHoverIn and onCellHoverOut to prevent firing on unintended hover, or during mousedrag.

    • Fixed: We fixed a problem where recurring invalids for month days were not working correctly, when a month day was used which is not present in every month (29, 30, 31).

    • New: Added mbsc-calendar-mark scss color variable allowing to set the default color of the marks.

    • New: We added a feature which allows presenting calendar labels as text only, without colored background, by specifying the background: 'none' property.

    Rating

    • Fixed: We fixed a bug that prevented the onChange event to fire on the React Rating component.

    Select

    • Fixed: We increased the filter input font size for the iOS theme to prevent automatic zoom-in on iPhone, when the filter input is focused.
    Source code(tar.gz)
    Source code(zip)
  • 4.10.2(Jan 29, 2020)

    Changelog 4.10.2

    General

    • Fixed: We fixed the icons, that got mixed up in version 4.10.1

    Eventcalendar

    • Fixed: We fixed an issue where the previous and next navigation buttons were not disabled when the min or max boundaries were reached.

    • Fixed: We fixed a memory leak that occured when using the event popover and changing the calendar settings dynamically at the same time.

    • Fixed: We fixed an issue where the event popover was not dismissed when navigating the calendar programmatically.

    Changelog 4.10.1

    General

    • Fixed: We fixed an SSR rendering issue, introduced in 4.10.0 (#474).

    Cards

    • Fixed: We fixed the border color of cards in ios, material and windows themes, to be consistent with the previous versions.

    Eventcalendar

    • Fixed: We fixed a rendering issue which happened on Chrome, when labels were displayed.

    Forms

    • Fixed: We fixed the form background color in ios theme, to be consistent with previous versions.

    • Fixed: We fixed the border color of textfields, to be consistent with previous versions.

    Listview

    • Fixed: We fixed the background color of the listview items and headers, to be consisten with previous versions.

    Changelog 4.10.0

    General

    • New: Added new scss color variables to all components, allowing color customizations across themes and components.

    Calendar

    • New: We added the onCellHoverIn and onCellHoverOut events, allowing to perform custom tasks when calendar days are hovered on desktop, e.g. showing a tooltip.

    • Fixed: We added the missing role="row" attributes on calendar rows for improved accessibility (#473).

    Eventcalendar

    • New: We added the onCellHoverIn and onCellHoverOut events, allowing to perform custom tasks when calendar days are hovered on desktop, e.g. showing a tooltip.

    • Fixed: We added the missing role="row" attributes on calendar rows for improved accessibility (#473).

    • Fixed: We made possible to navigate the event list using the Tab key for improved accessibility.

    Measurements

    • New: We added the decimalSeparator setting to localize the decimal separator charachter.

    Navigation

    • Fixed: We fixed an issue which caused the onItemTap event to fire twice if the navigation control was nested inside a Scrollview.

    Number

    • New: We added the decimalSeparator setting to localize the decimal separator charachter.

    Numpad

    • New: We added the onInput event, which runs every time the value is changed from the UI. This is useful to perform custom tasks when the user is typing the value, e.g. auto-suggest values for quick selection.

    • New: We added the possibility to enter decimal values freely without a pre-defined, fixed scale. This can be enabled through the entryMode setting that accepts template and freeform . The maximum length of the fractional part can be limited by the also newly introduced maxScale that defaults to 4.

    Range

    • New: We added the onCellHoverIn and onCellHoverOut events, allowing to perform custom tasks when calendar days are hovered on desktop, e.g. showing a tooltip.

    • Fixed: We added the missing role="row" attributes on calendar rows for improved accessibility (#473).

    Select

    • Fixed: We fixed the position of the scrollbar in desktop mode and liquid layout (regression introduced in v4.9.1).

    Changelog 4.9.1

    General

    • Fixed: We fixed an issue with scroller pickers, where longer wheel values were cut off, even if there were enough space to display them. The issue was limited to the iOS theme in bubble and center mode.

    • Fixed: We fixed the iOS theme 3D wheels styling to display in perspective in Edge and Firefox as well.

    Forms

    • Fixed: We fixed an issue with the Angular button component, where the click event was fired for disabled buttons, when the button icon was clicked.

    Listview

    • Fixed: We fixed the hierarchical navigation direction and arrow positioning in RTL mode.

    • Fixed: We fixed the list item border styling in RTL mode for the iOS theme.

    • Fixed: We fixed the action menu styling where part of the menu was cut off in recent Chrome versions.

    Optionlist

    • Fixed: We fixed a React Warning that came up in projects where the React Router was used with the Navigation components.
    Source code(tar.gz)
    Source code(zip)
  • v4.9.0(Nov 28, 2019)

    Changelog 4.9.0

    General

    • New: New: We are rolling out support for Angular Ivy and Angular 9 (#470).

    • New: New: We added the themeVariant setting which can be used to set light and dark variants of the selected theme and introduced auto to make switching dynamic based on system settings.

    • Fixed: We increased the width of alerts, confirms and prompts to accomodate longer button texts.

    • Fixed: We fixed the prompt input styling for Mobiscroll and Material themes.

    • Fixed: We fixed a compile error that came up when using the strict typescript compiler option in Angular and Ionic.

    Changelog 4.8.5

    General

    • Fixed: We fixed an issue with IonInputs in react, that required a second tap to open the Mobiscroll components on iOS devices.

    • Fixed: We fixed the readonly setting in the type definitions of Angular and React components.

    • Fixed: We fixed the auto theme to work on iPad with iOS 13 as well.

    Calendar

    • Fixed: We fixed an issue, where the responsive setting caused an infinite loop in inline mode, if the calendar did not fill the full width of the window (#472).

    Color

    • Fixed: We fixed the margin of the selected colors inside the color input in case of multiple selection for Mobiscroll and Material themes.

    Navigation

    • Fixed: Added missing type definitions for the React Router setup function.

    • Fixed: We fixed the popup dissapearing issure present in iOS 12.4 UIWebView.

    Forms

    • Fixed: We fixed a bug that prevented the initially set value to show on the Radio and Segmented components, when using the Reactive Forms in Angular. The problem occured when the Radio and Segmented items were rendered dynamically.

    • Fixed: We fixed an animation bug which occured when closing the mbsc-collapsible.

    Timespan

    • Fixed: We set a more suitable default width to avoid displaying ... on the scroll wheels.
    Source code(tar.gz)
    Source code(zip)
  • v4.8.4(Oct 28, 2019)

    Changelog 4.8.4

    General

    • Fixed: We fixed an issue which caused the modal pickers to close on the first tap in Ionic 1 on Android.

    • Fixed: Fixed a bug in angular, that produced an exception when the components were initially disabled with reactive forms.

    Forms

    • Fixed: We added the missing predefined colors styling for Stepper and Slider components rendered outside of a Form.

    • Fixed: We added the missing predefined colors styling for Checkbox component for the Windows theme.

    • Fixed: Corrected the type definitions for the angular switch component's error setting.

    • Fixed: We fixed a file input bug, where the input was duplicated on every reinitialization.

    • Fixed: We fixed the step-label API of the Slider and Progress components in angular. Only JSON strings were working before where now arrays can be used as well.

    Calendar

    • Fixed: We fixed a swipe animation bug (flickering) on month change on iOS that manifested in bubble mode.

    • Fixed: We fixed the positioning of marks and labels in RTL mode in Chrome.

    Eventcalendar

    • Fixed: We fixed an issue which caused infinite height increase on the calendar if there was a hidden calendar also in the page markup.

    • Fixed: We fixed the positioning of marks and labels in RTL mode in Chrome.

    Range

    • Fixed: We fixed the positioning of marks and labels in RTL mode in Chrome.

    Changelog 4.8.3

    General

    • Fixed: We fixed a major bug introduced in the previous version that caused Angular AOT builds to fail.

    Forms

    • Fixed: We fixed an issue with the readonly property on form components, allowing dynamic binding of the property.

    Select

    • Fixed: We fixed a bug which prevented the styling enhancement of the select element inside Mobiscroll Form.

    Changelog 4.8.2

    Eventcalendar

    • Fixed: Fixed a bug in angular, that caused all invalids, marked, colors or labels to disappear from the calendar when any of these settings were updated asynchronously.

    Navigation

    • New: Added a new setupReactRouter function that enables the navigation component to work with React Router version 5.

    Forms

    • Fixed: We corrected the floating label animation for outline inputs with Mobiscroll and Material themes.

    • Fixed: We added the missing active styling for switch, slider, checkbox and radio buttons for the Material theme.

    • Fixed: We fixed the button hover styling for the Material dark theme.

    • Fixed: We fixed the input-style attribute for Angular checkboxes, which was not taken into account.

    • Fixed: We fixed the floating label on the mbsc-input component in Angular and Ionic, which was not active initially, when the input was focused on pageload.

    • Fixed: We added the missing floating label styling to the slider and progress components with iOS theme.

    • Fixed: We removed the segmented component's background color for box and outline input styling for the iOS theme.

    • Fixed: We fixed a bug in the switch, progress and slider controls, that messed up their styling when their theme was changed dynamically.

    • Fixed: We changed the text color for predefined buttons to white with iOS theme for better readability.

    • Fixed: We fixed a small bug in the case of floating labels: when the input was focused, and the label was clicked, the input briefly lost the focus, causing the label to animate quickly up and down.

    • Fixed: Double initialization of form controls mixed up the styles. We fixed that as well.

    • New: We added the context setting to the Angular Form component. This setting is inherited by the form's child components and makes it easier to deal with Ionic modals stealing back the focus and scrolling when Mobiscroll components pop up.

    • New: We thickened the track bar of the progress and slider for the iOS theme to conform with the new iOS 13 design standards.

    General

    • New: We got rid of the rxjs-compat package dependency in angular and ionic.

    • New: Added new showInput setting for all scroller and calendar based components. Using this setting, an mbsc-input - showing the selected value - can also be rendered when components are displayed in inline mode.

    • Fixed: Updated the type definitions of the option method in all components. The type of the arguments are now defined based on the type of the involved component settings.

    Image

    • Fixed: We fixed the mbsc-image Angular component to correctly display the component in inline as well.

    Page

    • New: We added new typography utility classes for setting line height: mbsc-line-height-xs, mbsc-line-height-s, mbsc-line-height-m, mbsc-line-height-l, mbsc-line-height-xl.

    • New: We added new typography classes for heading, paragraph, list and link styles, which can be used outside of the Page component: mbsc-h1 ... mbsc-h6, mbsc-p, mbsc-a, mbsc-ul, mbsc-ol.

    Select

    • Fixed: Fixed an issue, when the select was used with 'inline' display inside of a Mobiscroll Form Group, the title of the Form Group was not styled properly.

    Range

    • Fixed: Corrected the input styling inside Mobiscroll forms when using the iOS theme. When there are multiple inputs inside the form group, the border of the range input won't expand to the edge.

    Color

    • Fixed: We fixed a bug in the react component that caused the placeholder text not to show in the input.

    • Fixed: Fixed a rendering issue for the color inputs with labels in React.

    Source code(tar.gz)
    Source code(zip)
  • v4.8.1(Sep 4, 2019)

    Changelog 4.8.1

    General

    • New: We added the mbsc-align-justify utility class for justified text align styling.

    Eventcalendar

    • Fixed: We fixed a bug, which caused the eventlist to show only the events of the current day in agenda view, when the list was scrolled.

    • Fixed: We fixed the navigate method to scroll correctly to the specified date in agenda view.

    Forms

    • Fixed: Removed unnecessary box-shadow for Toast and Prompt components.

    • Fixed: Fixed a rendering issue for the icons on inputs with no labels for the iOS theme.

    • Fixed: Corrected the styling of the outline, flat and disabled buttons for the Material theme.

    • Fixed: Removed backgound and border from iOS themed non-text form controls outside of mobiscroll forms.

    • New: We added support for commonly used HTML attributes for the mbsc-textarea component in Angular. The following attributes are supported and passed through to the native input: minlength, maxlength, autocomplete, autocapitalize, autocorrect, spellcheck, autofocus, required, wrap.

    Navigation

    • Fixed: We fixed a bug where the "Show more" menu was not shown correctly on touch devices, just flashed up for a short time.

    Select

    • Fixed: We fixed the filter input styling which broke in the previous release, with the introduction of the standalone form controls.

    Changelog 4.8.0

    Datetime

    • Fixed: We fixed a bug in the editable input field that occurred when the value was deleted manually. Today's date was written back instead of leaving it empty.

    Eventcalendar

    • Fixed: An issue got fixed that happened on month change. If both the first and second day of the month was invalidated, an error was thrown and calendar navigation broke.

    • Fixed: We fixed a rendering issue for the all-day text that happened for certain languages.

    • Fixed: We fixed the event listing for Brazilian timezones that happened during DST months.

    • New: We added the getJson utility function to the event calendar component.

    Forms

    • Fixed: Fixed the autofill underline input styling in the iOS theme.

    • Fixed: Removed text capitalization of the segmented control text in the iOS and Material themes.

    • New: Form controls are now working individually, without the need to wrap them inside a Mobiscroll Form component.

    • New: Added support for disabling 'mbsc-input’ the reactive way not just through the disabled attribute.

    General

    • Fixed: Fixed an issue that broke Angular 8 AOT builds.

    • Fixed: We fixed a bug that broke the compilation process in Angular when using the ES6 modules.

    • Fixed: We fixed the styling of the arrow in bubble display mode for the Windows theme.

    Listview

    • New: We added the getJson utility function to the listview component.

    Scrollview

    • Fixed: We fixed a bug where the input elements placed inside a scrollview were not focusable on touch devices.

    • Fixed: We fixed the Typescript definitions for the scrollview options to allow number type for the layout setting.

    Select

    • Fixed: We fixed autocomplete/filtering when used with Pinyin keyboard on iOS.
    Source code(tar.gz)
    Source code(zip)
  • v4.7.3(Jul 4, 2019)

    Changelog

    Forms

    • Fixed: Made the color of the stepper, snackbar text lighter to improve contrast for certain themes.

    • Fixed: We fixed the background color for the segmented component in pressed state within the iOS theme.

    • Fixed: We fixed a bug where the segmented components items appeared incorrectly in Angular when Bootstrap was also loaded.

    • Fixed: Stacked label position was fixed in case of outline inputs with Mobiscroll theme.

    • New: We added support for commonly used HTML attributes for the mbsc-input component. The following attributes are supported and passed through to the native input: min, max, minlength, maxlength, autocomplete, autocapitalize, autocorrect, spellcheck, autofocus, step, pattern, required, accept, multiple.

    • New: Added support for input type="file". File inputs will be consistently styled with other form elements.

    Listview

    • Fixed: Fixed a bug with the hierarchical listview. Destroy resulted in an error if the listview was displaying a sublevel.

    Numpad

    • Fixed: We fixed the min and max settings to be rounded accordingly to the scale setting.

    Popup

    • Fixed: We fixed a bug that prevented inline event handlers to fire in Mobiscroll for Angular.

    Range

    • Fixed: Fixed the range color that was rendered incorrectly within custom material themes.

    Scrollview

    • Fixed: Fixed flex layout in IE10 and IE11.

    Select

    • Fixed: Fixed floating and stacked label styling in Mobiscroll for React.
    Source code(tar.gz)
    Source code(zip)
  • v4.7.2(Jun 5, 2019)

    Changelog 4.7.2

    General

    • Fixed: Fixed a bug in Angular, that prevented the correct value to be set to the model, when the settings of the component were changed at the same time.

    Forms

    • Fixed: In Angular, the FormGroup component collapsible behavior was not working. The Accordion component was also affected.

    Cards

    • Fixed: The collapsible binding now makes the card components collapsible in angular.

    Color

    • Fixed: Styling fixes for the Windows theme.

    • Fixed: Stacked and floating labels were not working correctly with the iOS theme.

    • Fixed: Moving the slider has thrown an error when the initial color value on the input was not between the defined colors.

    Eventcalendar

    • Fixed: The default inline display mode was not applied initially on the angular component.

    • Fixed: In agenda view, if scrollable event list was enabled, scroll was not working - the event list was constantly re-rendered on scroll.

    Listview

    • Fixed: The actionable setting was missing from type definitions.

    • Fixed: The instance parameter was missing from the onStageChange event handler type definitions.

    • Fixed: The select, deselect, hideLoading and showLoading methods were missing from type definitions.

    Popup

    • Fixed: responsive setting did not work for the Popup component.

    Select

    • Fixed: In Angular, the select directive showed up empty when it was used with option elements instead of data array.

    Changelog 4.7.1

    General

    • Fixed: Angular event listeners that were passed in the options object were not triggered.

    • Fixed: In Angular, if a component's value and options were changed at the same time, the value was not updated correctly.

    Eventcalendar

    • Fixed: If month was changed from the month or year picker, the first date of the month was not selected.

    Forms

    • Fixed: The onChange event of the Slider was not working in React.

    Listview

    • Fixed: The option method was missing from the instance type definitions.

    Timer

    • Fixed: Small styling fixes for the iOS theme desktop mode.

    Timespan

    • Fixed: Small styling fixes for the iOS theme desktop mode.

    Changelog 4.7.0

    General

    • New: Styling was rewritten from Less to Sass, and the scss files are included in the packages as well, making possible to modify the theme colors programatically, without using the theme builder.

    • Fixed: Improved on angular bundle sizes.

    • Fixed: A bunch of type definition issues.

    Forms

    • Fixed: Fixed the Input's floating label styling in Angular, when used with Reactive Forms.

    • Fixed: In React, fixed a bug that killed the Switch components animation when the value was changed programatically.

    • Fixed: Corrected the inset binding of the MbscFormGroup component in angular, to change when a false value is passed to it.

    Listview

    • Fixed: Corrected a bug in react, that triggered an add animation for each listview item on any data operation like add or remove.

    Numpad

    • Fixed: responsive setting did not work.

    Optionlist

    • Fixed: Data attributes for list items are now passed down to the rendered element.
    Source code(tar.gz)
    Source code(zip)
  • v4.6.3(May 6, 2019)

    Changelog 4.6.3

    General

    • Fixed: mobiscroll.platform was missing from typescript definitions.

    Datetime

    • Fixed: Values before min and after max values were not always shown with disabled styling.

    Eventcalendar

    • Fixed: Don't display "all day" for multi-day events on the first and last days, unless allDay property is explicitly set (#464).

    • New: Pass the event object as well to the formatDuration function (#466).

    Forms

    • Fixed: Remove uneccesary shadow from toast and snackbar messages (Material theme).

    • Fixed: Remove background from form group title and button gruoups inside popup (iOS theme).

    • Fixed: Remove max-width from the stacked and floating labels (iOS theme).

    • Fixed: Button shadow was cut off inside button groups (Material theme).

    • Fixed: Input editing did not work on iOS 12.2, inside WkWebView.

    • New: Added the mobiscroll.notification.dismiss() function which will close the active toast or snackbar message.

    Scroller

    • Fixed: Typescript definition fix for width setting, which can be array as well, not just number.

    Changelog 4.6.2

    General

    • Fixed: Inline scrollers did not work correctly in MS Edge/IE, causing the whole page to scroll.

    • Fixed: React components can be used with IonInput in Ionic 4 React.

    • Fixed: Run the resize observer outside of the Angular zone.

    • New: We made it possible to display pickers and popups without overlay, using the showOverlay setting.

    • Changed: We disabled touchpad scroll for calendar views by default (can be enabled using the mousewheel setting).

    Eventcalendar

    • Fixed: Double border styling fix inside the event popover listing, for the iOS theme.

    Navigation

    • Fixed: Badge styling fixed for text-only navigation control.
    Source code(tar.gz)
    Source code(zip)
  • v4.6.1(Mar 29, 2019)

    Changelog 4.6.1

    General

    • Fixed: On iPhone, when showing a toast or snackbar right after closing a modal popup caused the page content to scroll back to the top.

    • Fixed: French translation for Sunday was incorrect (only in form inputs) (#460).

    • Fixed: The styling of Angular components was wrong after changing theme dynamically.

    • Fixed: Angularjs model was not set when the keyboard was used to type the value.

    • Fixed: Added missing i18n property to the type defintions, which enables adding custom language modules.

    • Fixed: Exported component interfaces to enable the usage of react useRef hooks.

    • Fixed: Type definition improvements.

    Calendar

    • Fixed: Using keyboard navigation left and right arrows worked in the reverse direction in RTL mode.

    • Fixed: We fixed a bug where IE11 threw an exception on day selection if the calendar view was refreshed.

    Cards

    • Fixed: Added missing type definitions for html attributes.

    Datetime

    • Fixed: Added missing exports for Date and Time components in react type definitions.

    Eventcalendar

    • Fixed: onEventSelect event argument returned wrong event on calendar label tap, if both labels and event list was used.

    • Fixed: Using keyboard navigation left and right arrows worked in the reverse direction in RTL mode.

    • Fixed: We fixed a bug where IE11 threw an exception on day selection if the calendar view was refreshed.

    • Fixed: In Ionic 1 the onEventSelect was not fired if an event was clicked inside the popover.

    Listview

    • Fixed: The onItemTap event was fired on the touchend event on touch devices, as a consequence, the click event firing afterwards was causing problems in certain use cases, for example immediately closing a popup opened from the onItemTap event handler.

    Range

    • Fixed: Using keyboard navigation left and right arrows worked in the reverse direction in RTL mode.

    • Fixed: We fixed a bug where IE11 threw an exception on day selection if the calendar view was refreshed.

    Select

    • Fixed: When the Select was opened on iPhone, the content was scrolling and flickering, but only if the select element was wrapped inside a label, and the page content was scrollable.

    • Fixed: Added missing filterPlaceholderText and filterEmptyText settings to type definitions.

    Timer

    • Fixed: Wheel labels were not updated when language was changed dynamically.

    Timespan

    • Fixed: Wheel labels were not updated when language was changed dynamically.

    Changelog 4.6.0

    Cards

    • Fixed: We fixed a bug where reinitializing or dynamically updating an option duplicated the collapsible chevron.

    Eventcalendar

    • New: You can now finally use the marked setting along with colored days, they are not mutually exclusive anymore.

    • New: We are rolling out fixed calendar views with scrollable event listing. No more scrolling the whole page and messy workarounds (#452).

    • New: We added support for the pop-over event listing across week and month views. With this we also refactored the code making the file-size a little bit smaller.

    • New: You can now use the formatDuration function to change the text that is used for the event duration.

    • Fixed: We fixed a bug that was showing incorrect event duration for all-day events.

    • Fixed: We fixed a bug that occurred with multiple labels loaded dynamically.

    • Fixed: Links inside event texts weren’t triggered, we fixed that.

    Forms

    • Fixed: We fixed the snackbar control that blocked mouse interactions for elements rendered right next to it.

    • Fixed: We fixed the Angular version rating control since it didn’t work well with fractional values.

    • Fixed: Show properly rounded values for the stepper, in case of decimal steps (e.g. 0.3 instead of 0.30000000000000004).

    General

    • New: We implemented dynamic options binding across all settings in the Angular version.

    • New: Added inputStyle and labelStyle props to react form components: Slider, Progress, Rating, Stepper and Switch. With this you’ll be able to keep consistency across inputs and all these other components too.

    • New: We added input-style and label-style support to all Angular components.

    • New: Typescript definitions landed in the React version of products.

    • Fixed: We fixed the Dutch localization, where some of the day names did not start with capital letters.

    Listview

    • New: onListEnd event was added and is triggered when someone scrolls to the end of the list view. Use this to implement load on demand, show a loading animation and so on.

    • New: We added a loading animation that you can show/hide with the following methods: showLoading and hideLoading. The icon inside the loading content can be specified with the loadingIcon setting and it can be anything from the included icon package.

    • New: Hover styling for list items was added making it more desktop-friendly.

    • New: Native support for item selection was added. This means no more home-baked selected listview item logic.

    • New: We added the animateAddRemove setting to turn animations on/off for adding and removing list items. Useful for turning it off on batch operations.

    • Fixed: We fixed a bug in the dynamic update logic of the context setting. This is needed for the listview to be used correctly within Ionic Framework 4.

    Numpad

    • Fixed: We added the missing preset setting to the MbscNumpadOptions type definitions.

    • Fixed: We exported the preset specific settings (MbscNumpadDateOption, MbscNumpadDecimalOptions...) that were missing in the Angular version.

    • Fixed: We fixed a bug with the thousandsSeparator that messed up values in some cases: 0.0,005 was printed instead of 0.0005.

    • New: We added support for [mbsc-options] to be used with directives. This was only supported within the components before.

    Range

    • New: You can now finally use the marked setting along with colored days, they are not mutually exclusive anymore.

    Select

    • Fixed: Reduce filter input margin for Material theme.

    • New: You can now finally use the marked setting along with colored days, they are not mutually exclusive anymore.

    Changelog 4.5.3

    General

    • Fixed: Controls used as directives on ion-inputs in ionic 4 will show up on the first tap on iOS devices.

    Calendar

    • Fixed: Wrong date was selected on the calendar sometimes, if min or max were specified, and dateFormat did not contain the year (#456).

    • New: Navigate method supports ISO string or moment object too.

    Event Calendar

    • New: updateEvent method added for easier event edit.

    Listview

    • Fixed: There was an exception if remove method was called for an already removed element. The error also occured in Angular, in case of the hierarchical listview, when the host component was destroyed.
    Source code(tar.gz)
    Source code(zip)
  • v4.5.2(Jan 24, 2019)

    Changelog 4.5.2

    General

    • New: Individually control input and label style on a component basis in Angular and React.

    • Fixed: If modal picker was opened from a 3rd party modal dialog (Ionic, Bootstrap) the fight over keeping the focus caused errors. We stepped in to keep the peace.

    Calendar

    • Fixed: We fixed a nasty little bug that we caused with 4.5.1. Month swipe did not work on initial show in center and bubble display mode.

    Forms

    • Fixed: Updating ngModel checkbox value will update the UI accordingly.

    Changelog 4.5.1

    General

    • Fixed: Passing arrow functions to react components now update the components as needed.

    • Fixed: Added missing type definitions for the layout setting.

    Eventcalendar

    • Fixed: A bug got fixed in the redraw method that messed up the calendar layout in RTL mode.

    • Fixed: Bug fixed that showed a wrong date after changing the view dynamically.

    • Fixed: Quick consecutive arrow taps failed if event listing was used. Bug got fixed.

    • Fixed: We fixed the more events label that was not always correctly displayed.

    • Fixed: If popover is set to false, it completely disables the popover, even for more events label.

    Calendar

    • Fixed: redraw method messed up the calendar layout in RTL mode.

    • Fixed: Wrong date was shown after changing number of weeks dynamically.

    Color

    • Fixed: Selectable colors passed by the data prop are now taken into account in react.

    Forms

    • Fixed: We fixed the textarea label alignment for the iOS theme.

    • Fixed: We fixed sticky floating lables that were not behaving on Chrome auto-fill.

    Listview

    • Fixed: The remove method was fixed for hierarchical lists.

    Navigation

    • Fixed: Badges are now supported for dynamically added navigation items in angular.

    Numpad

    • Fixed: We added missing type definitions for formatValue and parseValue.

    Range

    • Fixed: redraw method messed up the calendar layout in RTL mode.

    • Fixed: showSelector can now hide the range start/end tabs for every configuration. This is useful when start and end are handled by two separate inputs.

    Select

    • Fixed: The mbsc-select directive will work on mbsc-dropdown form elements.

    • Fixed: Scroll arrow wheels were fixed. No more hiding values in Mobiscroll theme.

    Source code(tar.gz)
    Source code(zip)
  • v4.5.0(Dec 21, 2018)

    Changelog

    General

    • New: We've improved the usage of development modules within Angular. The components and directives are bundled into separate NgModules so that you can load only what's needed. Steps are made towards full tree-shaking support..

    • Fixed: Various memory leaks were fixed in the Angular JS implementation.

    Calendar

    • Fixed: Weekly repeat still failed in Safari for Sunday in Brasília Time (BRT) timezone. It got fixed.

    • New: Jalali and Hijri calendar systems were introduced besides the already supported Gregorian calendar. The new calendarSystem setting is where you can set 'gregorian', 'jalali' or 'hijri'.

    • New: Year, month and day suffixes were added for Korean and Chinese languages.

    • New: We added support for multiple lables. It is now possible to use the Calendar and display multiple lables instead of just one.

    Datetime

    • Fixed: Weekly repeat still failed in Safari for Sunday in Brasília Time (BRT) timezone. It got fixed.

    • New: Jalali and Hijri calendar systems were introduced besides the already supported Gregorian calendar. The new calendarSystem setting is where you can set 'gregorian', 'jalali' or 'hijri'.

    Eventcalendar

    • Fixed: We fixed the getEvents method. It did not work correctly if a date was passed (regression introduced in v4.4.3).

    • Fixed: Weekly repeat still failed in Safari for Sunday in Brasília Time (BRT) timezone. It got fixed.

    • New: We are introducing a new way to list events. Events as labels is here with multiple day events and multiple labels per day.

    • New: Jalali and Hijri calendar systems were introduced besides the already supported Gregorian calendar. The new calendarSystem setting is where you can set 'gregorian', 'jalali' or 'hijri'.

    Forms

    • Fixed: We fixed a bug where form components didn't lose their styling after className prop changes in React.

    • Fixed: We have improved the spacing of buttons inside button groups.

    Cards

    • Fixed: We improved spacing in the card title. This was especially a problem when an image followed the title.

    Image

    • Fixed: We fixed a nasty memory leak in Angular JS. Dynamically generated items kept building up and cleaned up.

    Range

    • Fixed: Weekly repeat still failed in Safari for Sunday in Brasília Time (BRT) timezone. It got fixed.

    • New: Jalali and Hijri calendar systems were introduced besides the already supported Gregorian calendar. The new calendarSystem setting is where you can set 'gregorian', 'jalali' or 'hijri'.

    • New: We added support for multiple lables. You can now display multiple lables inside the Range picker.

    Scrollview

    • Fixed: Dynamically adding and removing items won't break the scrolling in React.

    Select

    • Fixed: Fixed a typo in the type definitions which further improves usage.

    • Fixed: Another Angular JS memory leak fix. Select options generated with ng-repeat were problematic.

    Numpad

    • Fixed: We added a number of inline settings for numpad presets that were missing in the Angular and React implementation.

    Treelist

    • Fixed: Another leak was plugged for Angular JS. Dynamically generated items won't cause any more trouble.
    Source code(tar.gz)
    Source code(zip)
  • v4.4.3(Dec 21, 2018)

    Changelog

    General

    • Fixed: In certain timezones weekly repeating (w0 ... w6) failed for various settings (invalid, marked, labels, colors, events) in months where daylight saving starts (Date & Time, Calendar, Range, Event Calendar).

    • Fixed: Multiple popup buttons did not wrap in multiple lines and were cut off (Mobiscroll and Material themes).

    • Fixed: AOT builds in angular and ionic won't throw exception when using the forRoot configuration.

    • Changed: Enable 3D scroll on Android 8 and above.

    Calendar

    • Fixed: Added missing type definition for onSetDate.

    Color

    • Fixed: Added missing type definitions for onItemTap and onPreviewItemTap events.

    Eventcalendar

    • Fixed: Added missing property to the onDayChange event argument.

    • Fixed: Added missing type definitions: eventText, eventsText, labelsShort, onSetDate

    Forms

    • Fixed: Floating labels were not updated on programmatic change events triggered by jQuery.

    • Fixed: Fixed the styling when additional elements were between the label and the input.

    • Fixed: Fixed iOS theme input border in autofill field.

    • Fixed: Form components won't re-render when there's no change of inputs.

    • Fixed: The mobiscroll inputs lost their styling in react when their valid state changed.

    Range

    • Fixed: In certain timezones the range selection highlight was incorrect in months where daylight saving starts (#454).

    • Fixed: Added missing type definition for onSetDate.

    Scrollview

    • Fixed: Don't trigger touchend event when the content is scrolled vertically, it might cause exceptions in event handlers attached outside of the scrollview.

    Select

    • Fixed: Select died with an exception, if remote data was used with groups and filtering.

    • Fixed: Added missing type definitions for onFilter event.

    Source code(tar.gz)
    Source code(zip)
  • v4.4.2(Nov 5, 2018)

    Changelog

    General

    • Fixed: Remove high z-index from inline picker controls.

    • Fixed: Remove touch-action: none styling from html / body elements in case of modal popups to prevent forced reflow on document - the styling was moved inside the modal markup.

    Calendar

    • Fixed: Calendar tab styling fixes in inline mode, inside Mobiscroll Page.

    • Fixed: changeTab method should not hide the calendar if tabs are not present.

    • Fixed: Don't focus invalid dates when clicked.

    Cards

    • Fixed: Nested collapsible elements didn't work correctly inside collapsible cards - child collapsibles were also toggled with the parent collapsible.

    Eventcalendar

    • Fixed: Event list styling fixes inside the event popover.

    • Fixed: Selected day was not updated when only event list was displayed. Needed, when views are changed dynamically.

    Forms

    • Fixed: Allow additional css classes to use on the MbscFormGroup, MbscFormGroupTitle, MbscFormGroupContent and MbscAccordion components.

    • Fixed: Nested collapsible elements didn't work correctly - child collapsibles were also toggled with the parent collapsible.

    • Fixed: ENTER key should close the prompt notification when the input is focused.

    Listview

    • Fixed: Ghost click fix for UIWebView on iOS - hierarchical listview navigated 2 levels at once because of the ghost click.

    • Fixed: Floating labels did not render correctly on autofill fields.

    • Fixed: Autofill input field styling was improved.

    • Fixed: For Checkbox, Radio, Switch, Stepper, Progress, Slider and Rating components inputStyle and labelStyle props was not handled correctly in React.

    Page

    • Fixed: Muted button styling changed from color to opacity.

    Popup

    • Fixed: Components can be opened from a popup without the popup being closed.

    Range

    • Fixed: defaultValue: null did not work correctly, today's date was selected for start and end dates.

    Select

    • Fixed: Error was thrown if any of the values contained the " character.

    Navigation

    • Fixed: RTL mode scroll to center worked incorrectly on iOS Safari.

    • Fixed: React NavItems can be used with inline conditions without throwing an error.

    • Fixed: Switching from hamburger navigation to tab or bottom navigation using the responsive setting did not work.

    • Fixed: Update badges on refresh method call as well.

    Treelist

    • Fixed: Variable level treelist was not working correctly when the treelist was used with data (not generated from markup).
    Source code(tar.gz)
    Source code(zip)
  • v4.4.1(Oct 18, 2018)

    Changelog

    General

    • Fixed: Allow Enter and Space keydown events to propagate up from modal popups.

    Calendar

    • New: Calendar layout is automatically recalculated on size or visibility changes, even if there's no resize event.

    • Fixed: firstDay parameter was wrong inside the onPageLoading and onPageLoaded events on initial load, if min was also set and minimum date was inside the initially loaded month.

    Eventcalendar

    • Fixed: firstDay parameter was wrong inside the onPageLoading and onPageLoaded events on initial load, if min was also set and minimum date was inside the initially loaded month. This also caused the initial event list to be inside the wrong date range.

    Listview

    • Fixed: Allow focus on form controls inside listview items.

    Navigation

    • Fixed: Scroll to center worked incorrectly in RTL mode (in case of tab navigation).

    Page

    • Fixed: Added missing exportAs property for the angular component. Now template variables can be set to the page component explicitly.

    Scroller

    • Fixed: The direction argument of the validate function was incorrect in case of wheel item tap.

    Scrollview

    • New: Scrollview layout is automatically recalculated on size or visibility changes, even if there's no resize event.

    • Fixed: Don't activate snap if layout is fixed and itemWidth is specified, because it won't allow to completely scroll to the end.

    Select

    • Fixed: Incorrect button positioning in center mode for filtered select.

    • Fixed: The input setting, that helps to customize the look, is now added to type definitions and documented.

    • Fixed: Dynamic data update failed sometimes when group wheels were present.

    • Fixed: Popup won't close after resize, if used with responsive setting, showOnFocus enabled and inside Mobiscroll Form.

    Forms

    • Fixed: Styling fixes for box and outline styles for checkbox, radio, switch, slider, progress and stepper controls (iOS theme).

    • Fixed: Added missing inset property to the MbscFormGroup propTypes in React.

    • Fixed: There was a bug in React which caused an exception on every text update in the Textarea component.

    • Fixed: Border radius added for box and outline inputs inside a form group inset on iOS theme.

    • Fixed: The Angular Input, Textarea, Dropdown and Rating component can be made readonly with the readonly attribute.

    • Fixed: Don't display border for iOS themed form group title, if input style is box or outline.

    Grid Layout

    • Fixed: Grid container needed border-box box sizing to appear correcty outside an mbsc-page too.
    Source code(tar.gz)
    Source code(zip)
  • v4.4.0(Sep 28, 2018)

    Changelog

    Forms

    • New: New label styles were introduced across all themes. Controlled by the labelStyle setting you can now render inline, stacked and floating labels.

    • New: New input variations were introduced across all themes. With the inputStyle setting you can now render standard, box or outline inputs. These settings translate to select elements as well.

    • New: Proper styling was added for React select elements with the little arrow and everything.

    • Fixed: The disabled cursor was fixed for switch elements.

    • Changed: The react MbscFormGroup, MbscFormGroupTitle and MbscFormGroupContent components were renamed to FormGroup, FormGroupTitle and FormGroupContent. The old naming is deprecated and will be removed in a future release.

    General

    • New: New typography CSS classes were introduced. Text size modifiers, light color modifiers, ordered and unordered list styles were added.

    • Fixed: A small but nasty bug was fixed where the responsive setting caused an infinite loop in inline mode for non full-width components.

    • Fixed: We removed internally used lifecycle hooks from react components, that will be deprecated in upcoming react versions.

    Listview

    • Fixed: A rendering bug was fixed for RTL hierarchical listviews with icons.

    Navigation

    • Fixed: We fixed a bug that caused a React exception on re-rendering whenever another component changed that resided before it in the DOM tree.

    • New: We improved the Navigation component usage for Angular and Ionic Framework by adding support for the RouterLink directive that automatically selects the active route.

    • New: We also improved usage in React. The NavItems now support the same props as the Link component and become selected when the path matches their to prop.

    • New: Responsive breakpoints ware introduced for controlling and configuring various settings based on screen sizes. You can now make the components fully responsive with the new responsive setting.

    Page

    • Fixed: A bug got fixed that caused issues when using the page component with the navigation component in react.

    Popup

    • Fixed: We added a bunch of missing settings to the type definitions. Typescript developers rejoice!

    Range

    • Fixed: We fixed a bug where the date range picker lost the time-part after programmatically setting a value with setVal or by getting updated from the model.

    Scrollview

    • New: Responsive breakpoints ware introduced for controlling and configuring various settings based on screen sizes. You can now make the components fully responsive with the new responsive setting.

    • Fixed: Corrected a typo in the Scrollview components that prevented Proptypes validation.

    • Fixed: We fixed a bug that caused a React exception on re-rendering whenever another component changed that resided before it in the DOM tree.

    Select

    • Fixed: We fixed a bug that broke keyboard navigation and selection for multiple select, filter select and non-touch UI mode.

    • Fixed: We fixed a bug that prevented the usage of custom React components within the Select. You can now use the select on custom inputs or components.

    Source code(tar.gz)
    Source code(zip)
  • v4.3.2(Aug 17, 2018)

    Changelog

    General

    • Fixed: In some cases onBeforeShow was fired multiple times, if handler returned false.

    • Fixed: Disabling a picker control will also disable all associated input fields as well.

    Cards

    • Fixed: Remove fixed height from collapsible on animation end, otherwise layout will be incorrect after resize / orientationchange.

    Eventcalendar

    • Fixed: onEventSelect handler received the wrong date as argument in case of event listing.

    Forms

    • Fixed: Remove fixed height from collapsible on animation end, otherwise layout will be incorrect after resize / orientationchange.

    • Fixed: Toggle switch did not work correctly if tapped directly on switch handle (regression introduced in 4.3.1).

    Treelist

    • Fixed: Variable depth treelist was not working correctly - there was an error when a new hierarchy level was about to appear (regression introduced in 4.3.0).
    Source code(tar.gz)
    Source code(zip)
  • v4.3.0(Jul 26, 2018)

    What's New

    New Component: Grid Layout

    This is probably our biggest release since 4.0. We are introducing a new component: Mobiscroll Grid Layout. It is our full-featured responsive grid system for building flexible layouts.

    Desktop components

    We are launching support for desktop and pointer interaction for all of our mobile components. Scroller components and everything that was previously only available with touch interaction supports actual scrollbars and full interaction with a cursor.

    Responsive breakpoints

    If this wouldn’t be enough we are also introducing responsive breakpoints. You can now pass diffreent settings for diffreent screens, which means it is super easy now to make components show up and behave differently depending where they are being loaded. This works hand in hand with the new desktop support. You can now easily configure a touch UI on mobile and have pointer interaction desktop with a different display mode.

    New languages

    Oh and let’s welcome the new Thai and Ukrainian translations pushing up the supported languages to 37.

    Changelog

    Calendar

    • Fixed: Improved usability by increasing the tappable area around prev/next arrow buttons.
    • Fixed: The default positioning the multiple month view was changed to be more relevant depending on the use-case and defaults, min and max ranges.

    Cards

    • New: Make your cards collapsible with the collapsible feature.
    • New: Collapsible cards can be rendered in an mbsc-accordion container to enable accordion behavior.

    Color

    • Fixed: When used in Ionic framework, the color will will be passed to ion-inputs when selected.

    Eventcalendar

    • Fixed: The event bubble styling was improved for better readability.
    • Fixed: Event bubble positioning was fixed for RTL rendering.
    • Fixed: When used in React, the component will be updated on prop change.

    Forms

    • New: Make form groups and panel collapsible with the new collapsible feature.
    • New: Let form groups act as an accordion by wrapping them in the new accordion component.
    • New: A new Form Group component was added for React and Angular versions.
    • New: The text area can now be programmatically resized through the Javascript and jQuery APIs.
    • Fixed: rows attribute was added to the mbsc-textarea component to control the maximum number of rows.
    • Fixed: The text area will automatically resize itself based on the model and value changes in React and Angular version.

    General

    • New: Enable manual editing of Angular inputs when showOnFocus and showOnTap is false.
    • New: Desktop mode and pointer interaction can now be enabled by setting the touchUi option to false. This simple setting involves a lot of behind the scenes heavy lifting including desktop rendering, positioning and enabling interaction with scrollbars instead of relying on touch UI.
    • New: Responsive breakpoints are introduced for controlling and configuring various settings based on screen sizes. You can now make the components fully responsive with the new responsive setting.
    • Fixed: Bubble positioning was fixed for IE11.
    • Fixed: Using directives in Ionic on ion-input components will behave correctly after data selection.

    Gridlayout

    • New: Brand new responsive grid system was added for create flexible layouts.
    • New: Responsive CSS classes to cover the 12 columns from extra small to extra large screens.

    Languages

    • New: Thai translation was added.
    • New: Ukrainian translation was added.

    Listview

    • Fixed: Sort handles will now be removed when dynamically changing the sortable setting.
    • Fixed: Click events will fire correctly when using the list view on touch devices.
    • Fixed: Add and remove animations were speeded up for a more fluid user experience.

    Numpad

    • Fixed: Decimal value will now be correctly parsed for the dot ('.') thousand separator.
    • Fixed: The decimal preset will accept null as default instead of 0 in Angular.

    Range

    • New: New RangeStart and RangeEnd components were added for React that can be used inside the Range component for greater extensibility.
    • Fixed: Double border rendering issue was fixed for the iOS theme
    • Fixed: The default positioning the multiple month view was changed to be more relevant depending on the use-case and defaults, min and max ranges.

    Select

    • Fixed: Missing filter property was added to the MbscSelectOptions type.

    Treelist

    • Fixed: The selected value coming from the Angular JS model will be correctly set when the list is generated using ng-repeat.
    • Fixed: Wheel labels will be correctly rendered regardless of how the data is being set.

    Widget

    • New: The component was renamed to popup to better describe what it is serving. While the old initialization is still working, it is now deprecated and will be removed in a future version.
    • New: mbsc-no-padding CSS class can now be applied for the component to remove the default padding, using the cssClass setting.
    • Fixed: Dynamically generated form inputs will now be focusable inside the popup.
    • Fixed: Error will not be thrown on close if the DOM changed (siblings or parent no longer present).
    Source code(tar.gz)
    Source code(zip)
  • v4.2.4(Jun 5, 2018)

    Changelog

    General

    • Fixed: jQuery and vanilla js typescript definitions were importing a module from a wrong location.

    Languages

    • Fixed: eventText and eventsText translations were missing from most of the language files.

    Calendar

    • Fixed: Type of the controls setting updated to array in angular.

    • Fixed: Display the month name of the selected date in calendar header on initial show in case of week view, instead of the first day of the visible week.

    • Fixed: Calendar scroll was off by a few pixels after multiple month changes, if the calendar width was fractional.

    Card

    • Fixed: The predefined image styles (avatar, thumbnail, fluid) did not apply if the card wasn't inside of an mbsc-page component.

    Eventcalendar

    • Fixed: Added missing view setting for eventcalendar inline settings.

    • Fixed: eventBubble setting did not work when set to false.

    • Fixed: Event listing threw error if ISO 8601 date strings were passed to event start/end dates.

    Listview

    • Fixed: Sometimes first stage was loaded to soon when swipe direction was changed (from right to left or from left to right).

    Navigation

    • Fixed: onItemTap event was triggered twice if an item was tapped inside the bubble popup (on touch devices).

    Range

    • Fixed: Type of the controls setting updated to array in angular.

    • Fixed: Fixed exception in angular when rangepicker was opened and closed without focusing any element.

    Select

    • Fixed: data setting type updated in react and angular to enable the use of remote datasources.

    • Fixed: Make filtering work with numbers as well.

    • Fixed: onFilter event was not triggered when the filter input clear button was pressed which caused problems on custom filter implementations.

    Source code(tar.gz)
    Source code(zip)
  • v4.2.3(May 15, 2018)

    Changelog

    General

    • Fixed: Form elements did not work inside modal popups - Widget, Select with autocomplete (regression introduced in 4.2.2 by solving ghost click issues in Ionic).
    Source code(tar.gz)
    Source code(zip)
  • v4.2.2(May 15, 2018)

    Changelog

    General

    • Fixed: Injected service modifiers changed to public to avoid AOT builds runtime exceptions.

    • Fixed: In Ionic 1/2/3 popup closed immediately if opened from external button click (using ng-click or click).

    Calendar

    • Fixed: Vertical scroll did not work correctly with the iOS theme.

    • Fixed: Colors, events, labels and marked inline setting types updated to better reflect type support.

    Datetime

    • Fixed: Invalid time ranges did not work, since support for ISO 8601 date strings was introduced (4.2.0).

    • Fixed: Date part was missing in returned ISO 8601 string in case of the compact date & time picker.

    Eventcalendar

    • Fixed: Inline data setting type updated to better reflect type support.

    Forms

    • Fixed: Updating programatically a select's value did not work correctly with jQuery.

    • Fixed: Toast with colors didn't have opacity with iOS, Material and Mobiscroll themes.

    • Fixed: In case of initially long value, the textarea was scrolled to the bottom and navigating with arrow keys did not work.

    Range

    • Fixed: Added missing properties for start and end components, so that Angular AOT build won't fail.

    • Fixed: Angular start and end components initial model value is shown in the inputs.

    Source code(tar.gz)
    Source code(zip)
  • v4.2.1(May 1, 2018)

    Changelog

    Calendar

    • Fixed: Invalids with start and end dates did not work correctly.

    • Fixed: Date parsing fixes - exact dates were handled as days of week due to an incorrect regex.

    • Fixed: Call stopPropagation on month slide, to prevent side effects, like side menu opening.

    Datetime

    • Fixed: Invalids with start and end dates did not work correctly.

    • Fixed: Date parsing fixes - exact dates were handled as days of week due to an incorrect regex.

    Eventcalendar

    • Fixed: Date parsing fixes - exact dates were handled as days of week due to an incorrect regex.

    • Fixed: Call stopPropagation on month slide, to prevent side effects, like side menu opening.

    Range

    • Fixed: Invalids with start and end dates did not work correctly.

    • Fixed: Date parsing fixes - exact dates were handled as days of week due to an incorrect regex.

    • Fixed: Call stopPropagation on month slide, to prevent side effects, like side menu opening.

    Source code(tar.gz)
    Source code(zip)
  • v4.2.0(May 1, 2018)

    Changelog

    General

    • Fixed: Angular components won't throw an error when changing disabled state.

    • Fixed: The encoded accent characters were fixed in localization strings.

    • New: Reusable empty view styling with title and description was added.

    • New: invalid and valid settings are updated automatically in angular, when bound to an array.

    Calendar

    • New: colors, labels and marked settings are updated automatically in angular, when bound to an array.

    • New: Support for ISO 8601 date strings and moment.js objects to pass and retreive dates.

    Color

    • Fixed: Colors weren't updated dynamically through the data setting.

    Datetime

    • New: Support for ISO 8601 date strings and moment.js objects to pass and retreive dates.

    Eventcalendar

    • Fixed: Added missing onEventSelect event emitter and settings to the MbscEventcalendarOptions interface.

    • New: colors, labels and marked settings are updated automatically in angular, when bound to an array.

    • New: Support for ISO 8601 date strings and moment.js objects to pass and retreive dates.

    Forms

    • New: Color presets added to Snackbar and Toast.

    • New: Icon property added to Snackbar button.

    • Fixed: Disabled outline button styling was fixed for the Mobiscroll Dark theme.

    Listview

    • Fixed: There was a styling bug if both sort handle and image was present.

    • Fixed: onSort and onSortChange event parameters were not passed correctly.

    • Fixed: There was an unnecessary top border of the first group header with the iOS theme.

    • Fixed: Listview items can be added dynamically when using hierarchical structures in Angular.

    • Fixed: The background color of the listview (behind the list items) has been updated.

    Navigation

    • Fixed: ng-click was not fired on navigation items when used with Ionic 1.

    • Fixed: Click event was not correctly firing inside hamburger menu popup and "show more" popup.

    Range

    • New: Support for ISO 8601 date strings and moment.js objects to pass and retreive dates.

    Scrollview

    • Fixed: Click event was not correctly firing on elements inside scrollview items.
    Source code(tar.gz)
    Source code(zip)
  • v4.1.1(May 1, 2018)

    Changelog

    General

    • Fixed: Angular npm package metadata was not compatible with Angular version < 5, when using AOT builds.

    Eventcalendar

    • Fixed: "All-day" and "No events" captions localization was not working.

    • Fixed: Event listing was not working in trial version with Angular.

    Range

    • Fixed: startInput and endInput settings were not working in Angular if used on mbsc-input or ion-input components.
    Source code(tar.gz)
    Source code(zip)
  • v4.1.0(Mar 30, 2018)

    Changelog

    General

    • Fixed: Windows theme styling fixes.

    • Fixed: React components look for input elements to initialize on when children are passed.

    • Changed: Moved npm package dependencies to peer dependencies.

    • New: Provide es6 module format as well for the angular npm packages.

    Calendar

    • Fixed: Selected styling was not applied in multiple selection mode with the Bootstrap theme.

    • Fixed: Weekday names were incorrectly aligned in multiple month view and week numbers displayed.

    • Fixed: Various styling updates for iOS including hover state.

    Eventcalendar

    • Fixed: Various styling updates for iOS including hover state.

    • New: Built in event listing for monthly, weekly, daily and custom date ranges.

    • New: Improved styling for larger screens.

    • Changed: Event popover styling improvements.

    Forms

    • Fixed: Carret was not movable on Android Chrome inside an input field.

    • Fixed: Textarea label width was incorrect with the iOS theme.

    Image

    • Fixed: Initialization failed on empty data / empty list.

    Range

    • Fixed: In scroller mode date range validation was incorrect: if the selected start date was after end date, end date was incorrectly modified to the day before start date.

    Scrollview

    • Fixed: Scrolling did not work on iOS9.

    Select

    • Fixed: Remote filtering did not work correctly, only the first filtering request was sent (regression introduced in 4.0.0).

    Numpad

    • Fixed: Placeholders won't be overwritten with empty strings.
    Source code(tar.gz)
    Source code(zip)
  • v4.0.0(Mar 1, 2018)

    Changelog

    General

    • Fixed: Added missing cssClass setting to angular components and directives.

    • Fixed: Disabled draggable state of avatar image and added option to turn it off.

    • Fixed: Removed @type annotations from comments for ngc + tsickle compatibility.

    • New: Improvements to avoid flash of unstyled content (FOUC).

    • New: Windows theme updated to Windows / Windows Phone 10 styling (#407).

    Calendar

    • Fixed: Added missing onPageLoaded, onPageLoading and onPageChange events to the angular and react component.

    • Fixed: Clicking on empty day resulted in error when using the showOuterDays: false setting.

    • Fixed: Showing week numbers messed up the calendar layout.

    • Fixed: Don't dim days from different months in case of week view.

    • Fixed: Counter did not work in multiple selection mode.

    • Fixed: Stopping swipe navigation and disabling prev/next buttons did not work correctly in case of week view.

    • Changed: Days from other months are hidden by default when scroll is vertical.

    Cards

    • Fixed: onClick handler can be passed to react components inside card.

    • Fixed: Listview corners were not rounded inside card on Safari/macOS.

    Color

    • Fixed: undefined value was added to the values array with setVal in multiple selection mode.

    • Fixed: In refine mode the color slider became unstyled during hide animation.

    Eventcalendar

    • Fixed: Changes to events were lost after option method call.

    Eventcalendar

    • Fixed: Added missing allDay event property definition in angular directive

    Listview

    • Fixed: swipeleft and swiperight settings names corrected in angular component.

    Forms

    • New: React form components added.

    • New: Prompt input value is selected by default on show (if any).

    • New: Angular segmented component multiselection works with arrays too.

    • Fixed: Click / tap on switch handle should toggle the switch (regression introduced in 4.0.0-beta3).

    • Fixed: Dropdown destroy was incorrect.

    • Fixed: Multiple slider handle support added to angularjs.

    • Fixed: Stepper and segmented control border styling fix with Material theme on macOS Safari.

    Select

    • Fixed: Filtering did not work after async data update.

    • Fixed: getVal method returned null if selected value was 0.

    • Fixed: null can also be passed initially for the data setting in angular and react components.

    • Fixed: In ionic, the mbsc-data attribute won't crash the select initially, when the model value is not the first data item.

    Scroller

    • New: Added wheel index to event args inside the onChange event.

    • Fixed: Added missing setting definitions for parseValue and formatValue in angular and react

    Timer

    • Fixed: Scroller went crazy when running stopwatch in Angular and AngularJS.

    Navigation

    • Fixed: Badges show up and update automatically on angular navigation items (#443).

    • Fixed: prev and next method toggle parameter wasn't true by default.

    Range

    • Fixed: Auto-correction for min and max ranges should not set dates out of min and max boundaries.
    Source code(tar.gz)
    Source code(zip)
  • v4.0.0-beta3.1(Jan 26, 2018)

    Changelog

    General

    • Fixed: Added missing type defintions for the parseDate and formatDate util functions in the mobiscroll namespace.

    • Fixed: Automatically prevent "Maximum call stack size exceeded" error when pickers are opened from a Bootstrap modal dialog.

    • Fixed: iOS theme 3D scroller wheels were messed up, if wheel was scrolled with trackpad until min or max values.

    • Fixed: Bootstrap 4 compatibility fixes.

    Forms

    • New: Color swatches for radio, switch, checkbox, slider, stepper, and segmented components.

    • New: Added rating component.

    • Fixed: Styles of the outline buttons was not correct with iOS, Material and Windows themes.

    • Fixed: Incorrect styling of inset form groups of iOS theme, when used with Angular.

    • Fixed: Updated value shown in angular dropdown when changed programmatically without ngModel

    • Changed: radio buttons and select appearance in windows theme.

    Calendar

    • New: Added proper keyboard navigation for better accessibility.

    • New: Added onPageChange, onPageLoading, onPageLoaded events to substitute onMonthChange, onMonthLoading and onMonthLoaded, because the naming was not suitable in case of week view. Also, instead of just year and month parameters (which is insufficient in case of week views), the events receive a date object, representing the first day of the view. The old events are still triggered as well, but are considered as deprecated.

    • Fixed: option method resulted in error when called on an inline calendar.

    • Fixed: If icons were used without text within the labels setting, they were displayed in a wrong color with the Mobiscroll and Material themes.

    • Removed: calendarText setting. The dateText is used instead of it.

    • Changed: the calendar-date-time tab configuration is not supported anymore.

    Listview

    • Fixed: Added hierarchical support for listview in angular.

    Languages

    • Fixed: German toText translation.

    • Fixed: Dutch clearText translation.

    Scrollview

    • Fixed: Added missing import statements in React.

    • Fixed: onItemTap event was not fired.

    Select

    • Fixed: With filtering enabled, setVal was not working correctly for 0 or empty string value.

    • Fixed: Dynamic data update did not work when used inside Mobiscroll Form (React only).

    • New: Automatically focus filter input on show.

    Event Calendar

    • New: Be able to mark an event as an all-day event.

    • Fixed: Added missing [options] binding for the Angular component.

    Treelist

    • Fixed: The mbsc-treelist directive generates an input element by default.

    Image

    • Fixed: The mbsc-image directive generates an input element by default.
    Source code(tar.gz)
    Source code(zip)
  • v4.0.0-beta(Dec 1, 2017)

    Changelog

    Core

    • New: Angular components for all Mobiscroll controls were added. Use the components instead of directives to generate Mobiscroll form elements like inputs, selects.

    • New: Scrollview component was added for creating scrollable layouts.

    • New: Navigation component was providing quick solutions for three navigation patterns: tabs, bottom navigation and hamburger menu or drawer navigation.

    • New: New color schemes were added for providing means to create variated UI designs. Primary, secondary, success, danger, warning, info, light and dark are the new schemes that can be used with notes and buttons at the moment.

    • Removed: [Breaking Change] Knockout integration is not maintained anymore. Please use the plain Javascript version instead.

    • Removed: [Breaking Change] ASP.NET MVC server controls are not maintained anymore. Please use a different version of Mobiscroll.

    • Changed: [Breaking Change] Buttons will be rendered in the order they are specified in the buttons setting. This change is applicable to all components where custom buttons are being used.

    Themes

    • Removed: [Breaking Change] jQuery Mobile theme is not maintained anymore. Mobiscroll for jQuery is fully compatible with jQuery Mobile, use any other available theme.

    • Removed: [Breaking Change] Android Holo theme is not maintained anymore. Mobiscroll is supporting Android 4.1+, use any other theme available.

    • Changed: [Breaking Change] wp theme has been renamed to windows. Going forward use windows for the light theme and windows-dark for the dark version.

    • Changed:iOS theme has been improved in several places, including hover effects.

    Menustrip

    • Removed: [Breaking Change] Menustip is not maintained as a stand-alone component. Functionality has been broken out into three focused components. Use the Scrollview, Navigation and Optionlist instead.

    Forms

    • New: Note styling was added for providing inline feedback to users, supporting multiple color schemes.

    • New: Buttons received a makeover with support for outline buttons and they now support multiple color schemes.

    • Changed: [Breaking Change] Slider and Progress modules are now included in the Form module. Make sure to include mobiscroll-form instead of separately using mobiscroll-slider and mobiscroll-progress as before.

    • Fixed: Progress and slider label positioning was fixed for the iOS theme.

    Rating

    • Removed: Rating and grading scroller component is not maintained anymore. Use the Image or Scroller components instead.

    Scrollview

    • New: New component was added to help in creating scrollable layouts. Horizontal scrolling is supported at the moment.

    Optionlist

    • New: The component has been created with the goal of making single and multiple value selection easy in a horizontally scrollable list of icons, labels and their combination. The functionality was available in the Menustrip, which was migrated and the API was simplified.

    Navigation

    • New: The component has functionality that has been broken out of the Menustrip. It provides quick and easy solutions to three common navigation patterns: tabs, bottom navigation and the hamburger menu (use the last one with responsibility)

    Calendar

    • Changed: The calendar view has been completely overhauled. A major refactoring has been performed including code and markup simplification.

    • New: Week view support has been added with the option of displaying and navigating the calendar on a weekly, bi-weekly … basis. Specify the number with the weeks option.

    Range

    • Changed: The calendar view has been completely overhauled. A major refactoring has been performed including code and markup simplification.

    • New: Marked day support has been added. Little colored dots can show up in the Range picker that was only possible in the Calendar and Event Calendar components.

    • New:Week view has been added for supporting compact range picker instances. Specify the number with the weeks option.

    Event calendar

    • Changed: The calendar view has been completely overhauled. A major refactoring has been performed including code and markup simplification.

    • New: Week view has been added for compact event calendar views. Specify the number with the weeks option.

    • New: A new option has been introduced to disable event listings in a pop-up bubble. Turn it off with the eventBubble bool setting.

    Source code(tar.gz)
    Source code(zip)
  • v3.2.6(Nov 6, 2017)

    Changelog

    General

    • New: Support for iPhone X safe regions.

    Calendar

    • Fixed: In bubble display mode arrow was positioned incorrectly with Bootstrap theme in multiple month view.

    Forms

    • Fixed: Prompt dialog promise resolves with null instead of empty string, if Cancel pressed.

    • Fixed: Validation styling fixes for the iOS theme.

    Numpad

    • Fixed: Suffix rendering issue on iOS 11.

    Menustrip

    • Fixed: Fixed navigate method in Angular to work with id attributes of the mbsc-menustrip-items.

    • Fixed: In agnular the menustrip will automatically update the UI without the need to call a manual refresh when items are loaded dynamically.

    Range

    • Fixed: Start/end labels were displayed incorrectly in RTL mode with the iOS theme.

    Rating

    • Fixed: Last star was cut off on iOS theme 3D wheels.

    Select

    • Fixed: getVal only returned group if a separate group wheel was present, did not work in case of group headers.

    • Fixed: onFilter event was not firing with custom filter when the last character was cleared form the filter input.

    Source code(tar.gz)
    Source code(zip)
Owner
Mobiscroll
Customizable HTML5 UI framework for touch devices like smartphones and tablets
Mobiscroll
Grupprojekt för kurserna 'Javascript med Ramverk' och 'Agil Utveckling'

JavaScript-med-Ramverk-Laboration-3 Grupprojektet för kurserna Javascript med Ramverk och Agil Utveckling. Utvecklingsguide För information om hur utv

Svante Jonsson IT-Högskolan 3 May 18, 2022
Hemsida för personer i Sverige som kan och vill erbjuda boende till människor på flykt

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

null 4 May 3, 2022
Kurs-repo för kursen Webbserver och Databaser

Webbserver och databaser This repository is meant for CME students to access exercises and codealongs that happen throughout the course. I hope you wi

null 14 Jan 3, 2023
A jQuery plugin to make your form controls look how you want them to. Now with HTML-5 attributes!

(jQuery) Uniform A jQuery plugin to make your form controls look how you want them to. Now with HTML-5 attributes! Works well with jQuery 1.6+, but we

Audith Softworks 2.2k Jan 2, 2023
A curated collection of resources for learning to build Progressive Web Apps 💪

PWA Resources A curated collection of resources for learning to build Progressive Web Apps ?? Curated and maintained with ♥ by the folks at Shareup. W

Shareup 30 Aug 31, 2022
A Foundation for Scalable Cross-Platform Apps

Electron React Boilerplate uses Electron, React, React Router, Webpack and React Fast Refresh. Install Clone the repo and install dependencies: git cl

Electron React Boilerplate 20.7k Jan 4, 2023
GetOsLocalesCrossPlatform - A cross platform alternative to get locales used on the platform. Works on Node, Electron, NW.js and Browsers

getOsLocalesCrossPlatform A cross platform alternative to get locales used on the platform. Works on Node, Electron, NW.js and Browsers This script is

null 1 Jan 2, 2022
Selectize is the hybrid of a textbox and select box

Selectize is the hybrid of a textbox and select box. It's jQuery based, and it has autocomplete and native-feeling keyboard navigation; useful for tagging, contact lists, etc.

null 12.9k Jan 5, 2023
Tip Tweet is a hybrid dApp that provides a simple way to tip a tweet using Ethereum. Authors can claim their tips using their Twitter account. You only need the tweet URL to tip. 🚀 😎

Tip Tweet Table of Contents About Folder Structure Contract Deveopment Starting the App Usage Contributing About Tip Tweet is hybrid dApp that allows

Dias Junior 23 Nov 15, 2022
Building block for hybrid Deno/Node scaffolding tools

Skaffe—building block for hybrid scaffolding tools This library provides a simple way to copy around files that were shipped with your hybrid Deno/Nod

KnorpelSenf 2 Aug 2, 2022
Smooth mobile touch slider for Mobile WebApp, HTML5 App, Hybrid App

iSlider iSlider is a lightweight, high-performant, no library dependencies cross-platform slide controller. It can help handling most sliding effects,

Baidu BEFE 1.7k Nov 25, 2022
A scalable, high-performance feature management and progressive experimentation platform

Introduction & Our Philosophy FeatBit is a scalable, high-performance Feature Management and Progressive Experimentation platform. Feature Management

null 345 Jan 1, 2023
Access the Nintendo Switch Online and Nintendo Switch Parental Controls app APIs.

Access the Nintendo Switch Online and Nintendo Switch Parental Controls app APIs. Includes Discord Rich Presence, friend notifications and data downloads.

Samuel Elliott 201 Jan 6, 2023
Exposes theming options available in Joy UI by providing color palette and typography controls.

Joy Theme Creator Note: Joy UI is currently in alpha - some things may not be finished or working as expected. This project exposes the theming option

Oliver Benns 10 Dec 28, 2022
Immersive (VR) controls for Three.js

Three.js Immersive Controls Immersive (VR) functionality Movement and rotation with VR controllers (move with left thumbstick, rotate with right thumb

Anthony DePasquale 20 Nov 12, 2022
Flappy Bird is an arcade-style game in which the player controls the bird Faby, which moves persistently to the right

Flappy Bird is an arcade-style game in which the player controls the bird Faby, which moves persistently to the right. The player is tasked with navigating Faby through pairs of pipes that have equally sized gaps placed at random heights. Faby automatically descends and only ascends when the player taps the touchscreen.

Ali Yaghoubi 5 Aug 16, 2022
Examples of how to do query, style, dom, ajax, event etc like jQuery with plain javascript.

You (Might) Don't Need jQuery Frontend environments evolve rapidly nowadays and modern browsers have already implemented a great deal of DOM/BOM APIs

NEFE 20.3k Dec 24, 2022
Plain JavaScript version of jQuery's slideToggle(), slideDown(), & slideUp(), but does not use display: none.

dom-slider It works like jQuery's slideToggle(), slideDown(), & slideUp(), but does not use display: none. Uses CSS3 transitions and element.scrollHei

Brenton Cozby 56 Dec 27, 2022
Progressive Web App (PWA) built in Node.js & Express that automatically reloads/refreshes your browser, web page, and app when developing.

Expresso ☕️ Checks for changes in your source and automatically reloads your browser, or web page, and app window. Makes development easier. Report Bu

Start Rev Technology 3 Oct 6, 2022