@sme.up/ketchup 6.7.0 → 6.8.0

package/dist/collection/components/kup-rating/kup-rating.js

@@ -6,40 +6,17 @@ import { KupRatingProps, } from './kup-rating-declarations';
 export class KupRating {
   constructor() {
     /*-------------------------------------------------*/
-    /*                   S t a t e s                   */
-    /*-------------------------------------------------*/
-    this.stars = [];
-    /*-------------------------------------------------*/
-    /*                    P r o p s                    */
+    /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
     /**
-     * Custom style of the component.
-     * @default ""
-     * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
+     * Instance of the KupManager class.
      */
+    this.kupManager = kupManagerInstance();
+    this.stars = [];
     this.customStyle = '';
-    /**
-     * Defaults at false. When set to true, the component is disabled.
-     * @default false
-     */
     this.disabled = false;
-    /**
-     * Max number of stars (default 5).
-     * @default 5
-     */
     this.maxValue = 5;
-    /**
-     * Rated stars.
-     * @default 0
-     */
     this.value = 0;
-    /*-------------------------------------------------*/
-    /*       I n t e r n a l   V a r i a b l e s       */
-    /*-------------------------------------------------*/
-    /**
-     * Instance of the KupManager class.
-     */
-    this.kupManager = kupManagerInstance();
   }
   onStarClick(newValue) {
     if (!this.disabled) {

package/dist/collection/components/kup-snackbar/kup-snackbar.js

@@ -7,49 +7,18 @@ import { FButton } from '../../f-components/f-button/f-button';
 export class KupSnackbar {
   constructor() {
     /*-------------------------------------------------*/
-    /*                   S t a t e s                   */
+    /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
     /**
-     * The value of the component.
-     * @default false
+     * Instance of the KupManager class.
      */
+    this.kupManager = kupManagerInstance();
     this.visible = false;
-    /*-------------------------------------------------*/
-    /*                    P r o p s                    */
-    /*-------------------------------------------------*/
-    /**
-     * Set of FButton props to set the action button.
-     * @default null
-     */
     this.actionButton = null;
-    /**
-     * When true, the hide button will be displayed.
-     * @default true
-     */
     this.closeButton = true;
-    /**
-     * Custom style of the component.
-     * @default ""
-     * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
-     */
     this.customStyle = '';
-    /**
-     * Sets the textual content of the snackbar.
-     * @default ''
-     */
     this.text = '';
-    /**
-     * Defaults at null, when set the snackbar will automatically disappear after the specified amount of milliseconds.
-     * @default null
-     */
     this.timeout = null;
-    /*-------------------------------------------------*/
-    /*       I n t e r n a l   V a r i a b l e s       */
-    /*-------------------------------------------------*/
-    /**
-     * Instance of the KupManager class.
-     */
-    this.kupManager = kupManagerInstance();
   }
   onKupActionClick() {
     this.hide();

package/dist/collection/components/kup-spinner/kup-spinner.js

@@ -6,56 +6,20 @@ import { KupSpinnerProps } from './kup-spinner-declarations';
 export class KupSpinner {
   constructor() {
     /*-------------------------------------------------*/
-    /*                    P r o p s                    */
+    /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
     /**
-     * When set to true the spinner is animating.
-     * @default false
+     * Instance of the KupManager class.
      */
+    this.kupManager = kupManagerInstance();
     this.active = false;
-    /**
-     * Decides whether the component is a bar or a spinner.
-     * @default false
-     */
     this.barVariant = false;
-    /**
-     * Custom style of the component.
-     * @default ""
-     * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
-     */
     this.customStyle = '';
-    /**
-     * Width and height of the spinner. For the bar variant, only height.
-     * @default false
-     */
     this.dimensions = null;
-    /**
-     * Places a blend modal over the wrapper to darken the view (or lighten, when the theme is dark).
-     * @default false
-     */
     this.fader = false;
-    /**
-     * The time required for the "fader" to trigger.
-     * @default 3500
-     */
     this.faderTimeout = 3500;
-    /**
-     * When set to true the component will fill the whole viewport.
-     * @default false
-     */
     this.fullScreen = false;
-    /**
-     * Sets the layout of the spinner.
-     * @default 1
-     */
     this.layout = 1;
-    /*-------------------------------------------------*/
-    /*       I n t e r n a l   V a r i a b l e s       */
-    /*-------------------------------------------------*/
-    /**
-     * Instance of the KupManager class.
-     */
-    this.kupManager = kupManagerInstance();
   }
   /*-------------------------------------------------*/
   /*           P u b l i c   M e t h o d s           */

package/dist/collection/components/kup-switch/kup-switch.js

@@ -7,49 +7,18 @@ import { componentWrapperId } from '../../variables/GenericVariables';
 export class KupSwitch {
   constructor() {
     /*-------------------------------------------------*/
-    /*                   S t a t e s                   */
+    /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
     /**
-     * The value of the component.
-     * @default ""
+     * Instance of the KupManager class.
      */
+    this.kupManager = kupManagerInstance();
     this.value = '';
-    /*-------------------------------------------------*/
-    /*                    P r o p s                    */
-    /*-------------------------------------------------*/
-    /**
-     * Defaults at false. When set to true, the component will be set to 'checked'.
-     * @default false
-     */
     this.checked = false;
-    /**
-     * Custom style of the component.
-     * @default ""
-     * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
-     */
     this.customStyle = '';
-    /**
-     * Defaults at false. When set to true, the component is disabled.
-     * @default false
-     */
     this.disabled = false;
-    /**
-     * Defaults at null. When specified, its content will be shown as a label.
-     * @default null
-     */
     this.label = null;
-    /**
-     * Defaults at false. When set to true, the label will be on the left of the component.
-     * @default false
-     */
     this.leadingLabel = false;
-    /*-------------------------------------------------*/
-    /*       I n t e r n a l   V a r i a b l e s       */
-    /*-------------------------------------------------*/
-    /**
-     * Instance of the KupManager class.
-     */
-    this.kupManager = kupManagerInstance();
   }
   onKupBlur() {
     this.kupBlur.emit({

package/dist/collection/components/kup-tab-bar/kup-tab-bar.js

@@ -9,29 +9,6 @@ import { getProps, setProps } from '../../utils/utils';
 import { componentWrapperId } from '../../variables/GenericVariables';
 export class KupTabBar {
   constructor() {
-    /*-------------------------------------------------*/
-    /*                   S t a t e s                   */
-    /*-------------------------------------------------*/
-    this.value = '';
-    /*-------------------------------------------------*/
-    /*                    P r o p s                    */
-    /*-------------------------------------------------*/
-    /**
-     * Custom style of the component.
-     * @default ""
-     * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
-     */
-    this.customStyle = '';
-    /**
-     * List of elements.
-     * @default null
-     */
-    this.data = null;
-    /**
-     * When enabled displays Material's ripple effect on item headers.
-     * @default true
-     */
-    this.ripple = true;
     /*-------------------------------------------------*/
     /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
@@ -43,6 +20,10 @@ export class KupTabBar {
      * Element scrollable on mouse hover.
      */
     this.scrollArea = null;
+    this.value = '';
+    this.customStyle = '';
+    this.data = null;
+    this.ripple = true;
   }
   onKupBlur(i, node) {
     this.kupBlur.emit({
@@ -105,7 +86,6 @@ export class KupTabBar {
   async getSelectedNode() {
     let res = null;
     this.data.forEach((node) => {
-      console.log(this.value, node);
       if (node.id === this.value) {
         res = node;
       }

package/dist/collection/components/kup-text-field/kup-text-field.js

@@ -8,149 +8,36 @@ import { getProps, setProps } from '../../utils/utils';
 import { componentWrapperId } from '../../variables/GenericVariables';
 export class KupTextField {
   constructor() {
-    /*-------------------------------------------------*/
-    /*                   S t a t e s                   */
-    /*-------------------------------------------------*/
     /**
-     * The value of the component.
-     * @default ""
+     * Instance of the KupManager class.
      */
+    this.kupManager = kupManagerInstance();
     this.value = '';
-    /*-------------------------------------------------*/
-    /*                    P r o p s                    */
-    /*-------------------------------------------------*/
-    /**
-     * Custom style of the component.
-     * @default ""
-     * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
-     */
     this.customStyle = '';
-    /**
-     * Number of decimals (should be used when inputType is number).
-     * @default null
-     */
     this.decimals = null;
-    /**
-     * When set to true, the component is disabled.
-     * @default false
-     */
     this.disabled = false;
-    /**
-     * When the text field is part of the autocomplete component and the list is opened, enter key selects the item and doesn't submit.
-     * @default true
-     */
     this.emitSubmitEventOnEnter = true;
-    /**
-     * When set to true, the component will be rendered at full width.
-     * @default false
-     */
     this.fullWidth = false;
-    /**
-     * When set, its content will be shown as a help text below the field.
-     * @default null
-     */
     this.helper = null;
-    /**
-     * When true, the helper will be displayed.
-     * @default true
-     */
     this.helperEnabled = true;
-    /**
-     * When set, the helper will be shown only when the field is focused.
-     * @default false
-     */
     this.helperWhenFocused = false;
-    /**
-     * When set, the text-field will show this icon.
-     * @default null
-     */
     this.icon = null;
-    /**
-     * Sets the initial value of the component
-     * @default ""
-     */
     this.initialValue = '';
-    /**
-     * The HTML inputmode of the input element.
-     * @default null
-     */
     this.inputMode = null;
-    /**
-     * The HTML type of the input element. It has no effect on text areas.
-     * @default "text"
-     */
     this.inputType = 'text';
-    /**
-     * Enables a clear trailing icon.
-     * @default false
-     */
     this.isClearable = false;
-    /**
-     * When set, its content will be shown as a label.
-     * @default null
-     */
     this.label = null;
-    /**
-     * When set to true, the label will be on the left of the component.
-     * @default false
-     */
     this.leadingLabel = false;
-    /**
-     * The HTML max attribute specifies the maximum value for the input element.
-     * Works with the following input types: number, range, date, datetime-local, month, time and week.
-     * @default null
-     */
     this.max = null;
-    /**
-     * When set, the helper will display a character counter.
-     * @default null
-     */
     this.maxLength = null;
-    /**
-     * The HTML min attribute specifies the minimum value for the input element.
-     * Works with the following input types: number, range, date, datetime-local, month, time and week.
-     * @default null
-     */
     this.min = null;
-    /**
-     * The HTML name attribute used for form autocomplete.
-     * @default null
-     */
     this.name = null;
-    /**
-     * When set to true, the component will be rendered as an outlined field.
-     * @default false
-     */
     this.outlined = false;
-    /**
-     * Sets the component to read only state, making it not editable, but interactable. Used in combobox component when it behaves as a select.
-     * @default false
-     */
     this.readOnly = false;
-    /**
-     * The HTML step of the input element. It has effect only with number input type.
-     * @default null
-     */
     this.step = null;
-    /**
-     * When set to true, the component will be rendered as a textarea.
-     * @default false
-     */
     this.textArea = false;
-    /**
-     * When set, the icon will be shown after the text.
-     * @default false
-     */
     this.trailingIcon = false;
-    /**
-     * When set to true, the label will be on the right of the component.
-     * @default false
-     */
     this.trailingLabel = false;
-    /**
-     * Instance of the KupManager class.
-     */
-    this.kupManager = kupManagerInstance();
   }
   onKupBlur(event) {
     const { target } = event;

package/dist/collection/components/kup-time-picker/kup-time-picker.js

@@ -11,49 +11,6 @@ import { KupCardFamily, } from '../kup-card/kup-card-declarations';
 import { KupDynamicPositionPlacement } from '../../managers/kup-dynamic-position/kup-dynamic-position-declarations';
 export class KupTimePicker {
   constructor() {
-    /*-------------------------------------------------*/
-    /*                   S t a t e s                   */
-    /*-------------------------------------------------*/
-    this.value = '';
-    /*-------------------------------------------------*/
-    /*                    P r o p s                    */
-    /*-------------------------------------------------*/
-    /**
-     * When set to true, the drop down menu will display a clock.
-     * @default true
-     */
-    this.clockVariant = true;
-    /**
-     * Custom style of the component.
-     * @default ""
-     * @see https://ketchup.smeup.com/ketchup-showcase/#/customization
-     */
-    this.customStyle = '';
-    /**
-     * Props of the sub-components (time input text field)
-     * @default {}
-     */
-    this.data = {};
-    /**
-     * Defaults at false. When set to true, the component is disabled.
-     * @default false
-     */
-    this.disabled = false;
-    /**
-     * Sets the initial value of the component.
-     * @default ""
-     */
-    this.initialValue = '';
-    /**
-     * Manage seconds.
-     * @default false
-     */
-    this.manageSeconds = false;
-    /**
-     * Minutes step.
-     * @default 10
-     */
-    this.timeMinutesStep = 10;
     /*-------------------------------------------------*/
     /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
@@ -68,6 +25,14 @@ export class KupTimePicker {
     this.textfieldEl = undefined;
     this.pickerKupEl = undefined;
     this.clickCb = null;
+    this.value = '';
+    this.clockVariant = true;
+    this.customStyle = '';
+    this.data = {};
+    this.disabled = false;
+    this.initialValue = '';
+    this.manageSeconds = false;
+    this.timeMinutesStep = 10;
   }
   onKupTimePickerItemClick(e, value) {
     if (e != null) {