@sme.up/ketchup 9.2.0 → 9.3.0

package/dist/types/utils/filters/filters.d.ts

@@ -7,66 +7,66 @@ import { ValueDisplayedValue } from './filters-declarations';
  * @todo Should contain EVERY filtering method in common between filtering types (i.e.: global filters and column menu filters).
  */
 export declare class Filters {
-  /**
-   * Function used to check whether the component is a KupTree or KupDataTable.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @returns {comp is KupTree} Returns true when the component is KupTree.
-   */
-  static isTree(comp: KupDataTable | KupTree): comp is KupTree;
-  isObjFiltrableByInterval(obj: any): boolean;
-  normalizeValue(value: string, smeupObj: any): string;
-  /**
-   * Given a filter value, check if is a negative filter
-   * @param filterValue the filter value to use for check
-   */
-  filterIsNegative(filterValue: string): boolean;
-  /**
-   * Given a value and a filter value, returns if that value matches the filter.
-   *
-   * Web filters can also be expressions: by putting strings between single quotes (') it's possible to activate filter expressions.
-   * Valid syntax:
-   * 'filter' = search for exact phrase;
-   * '' = match when value is empty;
-   * 'filter%' = match when a string starts with "filter";
-   * '%filter' = match when a string ends with "filter";
-   * '%filter%' = match when a string contains "filter".
-   *
-   * It is also possible to negate the expression by prepending "!" in front of the expression.
-   * For example: !'' = value in the cell must not be empty.
-   *
-   * With no expression set, the filter is by default set to '%filter%'.
-   *
-   * @param value - The current value to check.
-   * @param filterValue - The value of the current filter.
-   * @returns false if value or filterValue are empty;
-              true if value contains filterValue;
-              true if value matches special filter created on filterValue;
-              false otherwise.
-   */
-  isFilterCompliantForValue(value: string, filterValue: string): boolean;
-  /**
-   * Given a value and a filter value, returns if that value matches the filter.
-   *
-   * Web filters can also be expressions: by putting strings between single quotes (') it's possible to activate filter expressions.
-   * Valid syntax:
-   * 'filter' = search for exact phrase;
-   * '' = match when value is empty;
-   * 'filter%' = match when a string starts with "filter";
-   * '%filter' = match when a string ends with "filter";
-   * '%filter%' = match when a string contains "filter".
-   *
-   * It is also possible to negate the expression by prepending "!" in front of the expression.
-   * For example: !'' = value in the cell must not be empty.
-   *
-   * With no expression set, the filter is by default set to '%filter%'.
-   *
-   * @param value - The current value to check.
-   * @param parsedFilter - The value of the current filter.
-   * @param ignoreNegativeFlag = false - When set to true, the matcher will ignore the (!) operator; useful for global filter.
-   * @returns True if the filter is empty and the value of the cell is empty, false otherwise.
-   */
-  matchSpecialFilter(value: string, parsedFilter: RegExpMatchArray | null, ignoreNegativeFlag?: boolean): boolean;
-  isFilterCompliantForSimpleValue(valueToCheck: string, obj: any, filterValue: string, interval: string[]): boolean;
-  static valuesArrayContainsValue(values: ValueDisplayedValue[], value: string): boolean;
-  static indexOfValueInValuesArray(values: ValueDisplayedValue[], value: string): number;
+    /**
+     * Function used to check whether the component is a KupTree or KupDataTable.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @returns {comp is KupTree} Returns true when the component is KupTree.
+     */
+    static isTree(comp: KupDataTable | KupTree): comp is KupTree;
+    isObjFiltrableByInterval(obj: any): boolean;
+    normalizeValue(value: string, smeupObj: any): string;
+    /**
+     * Given a filter value, check if is a negative filter
+     * @param filterValue the filter value to use for check
+     */
+    filterIsNegative(filterValue: string): boolean;
+    /**
+     * Given a value and a filter value, returns if that value matches the filter.
+     *
+     * Web filters can also be expressions: by putting strings between single quotes (') it's possible to activate filter expressions.
+     * Valid syntax:
+     * 'filter' = search for exact phrase;
+     * '' = match when value is empty;
+     * 'filter%' = match when a string starts with "filter";
+     * '%filter' = match when a string ends with "filter";
+     * '%filter%' = match when a string contains "filter".
+     *
+     * It is also possible to negate the expression by prepending "!" in front of the expression.
+     * For example: !'' = value in the cell must not be empty.
+     *
+     * With no expression set, the filter is by default set to '%filter%'.
+     *
+     * @param value - The current value to check.
+     * @param filterValue - The value of the current filter.
+     * @returns false if value or filterValue are empty;
+                true if value contains filterValue;
+                true if value matches special filter created on filterValue;
+                false otherwise.
+     */
+    isFilterCompliantForValue(value: string, filterValue: string): boolean;
+    /**
+     * Given a value and a filter value, returns if that value matches the filter.
+     *
+     * Web filters can also be expressions: by putting strings between single quotes (') it's possible to activate filter expressions.
+     * Valid syntax:
+     * 'filter' = search for exact phrase;
+     * '' = match when value is empty;
+     * 'filter%' = match when a string starts with "filter";
+     * '%filter' = match when a string ends with "filter";
+     * '%filter%' = match when a string contains "filter".
+     *
+     * It is also possible to negate the expression by prepending "!" in front of the expression.
+     * For example: !'' = value in the cell must not be empty.
+     *
+     * With no expression set, the filter is by default set to '%filter%'.
+     *
+     * @param value - The current value to check.
+     * @param parsedFilter - The value of the current filter.
+     * @param ignoreNegativeFlag = false - When set to true, the matcher will ignore the (!) operator; useful for global filter.
+     * @returns True if the filter is empty and the value of the cell is empty, false otherwise.
+     */
+    matchSpecialFilter(value: string, parsedFilter: RegExpMatchArray | null, ignoreNegativeFlag?: boolean): boolean;
+    isFilterCompliantForSimpleValue(valueToCheck: string, obj: any, filterValue: string, interval: string[]): boolean;
+    static valuesArrayContainsValue(values: ValueDisplayedValue[], value: string): boolean;
+    static indexOfValueInValuesArray(values: ValueDisplayedValue[], value: string): number;
 }

package/dist/types/utils/kup-column-menu/kup-column-menu-declarations.d.ts

@@ -2,18 +2,18 @@
  * Component IDs.
  */
 export declare enum KupColumnMenuIds {
-  BUTTON_APPLY = "apply",
-  BUTTON_ADD_COLUMNS = "add",
-  BUTTON_GROUP = "group",
-  BUTTON_NEW = "new",
-  BUTTON_OPEN_IN_NEW = "open-in-new",
-  BUTTON_REMOVE = "remove",
-  BUTTON_SEARCH = "search",
-  CHECKBOX_GLOBAL = "global-checkbox",
-  SWITCH_GROUP = "group",
-  SWITCH_KEY = "key",
-  TEXTFIELD_FILTER = "filter",
-  TEXTFIELD_FORMULA = "formula",
-  TEXTFIELD_FROM = "filter-from",
-  TEXTFIELD_TO = "filter-to"
+    BUTTON_APPLY = "apply",
+    BUTTON_ADD_COLUMNS = "add",
+    BUTTON_GROUP = "group",
+    BUTTON_NEW = "new",
+    BUTTON_OPEN_IN_NEW = "open-in-new",
+    BUTTON_REMOVE = "remove",
+    BUTTON_SEARCH = "search",
+    CHECKBOX_GLOBAL = "global-checkbox",
+    SWITCH_GROUP = "group",
+    SWITCH_KEY = "key",
+    TEXTFIELD_FILTER = "filter",
+    TEXTFIELD_FORMULA = "formula",
+    TEXTFIELD_FROM = "filter-from",
+    TEXTFIELD_TO = "filter-to"
 }

package/dist/types/utils/kup-column-menu/kup-column-menu.d.ts

@@ -13,130 +13,130 @@ import { KupObj } from '../../managers/kup-objects/kup-objects-declarations';
  * @module KupColumnMenu
  */
 export declare class KupColumnMenu {
-  clickCb: KupManagerClickCb;
-  filtersColumnMenuInstance: FiltersColumnMenu;
-  filtersRowsInstance: FiltersRows;
-  /**
-   * Function called by the component when the column menu must be opened.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {string} column - Name of the column.
-   */
-  open(comp: KupDataTable | KupTree, column: string): void;
-  /**
-   * Function called by the component when the column menu must be closed.
-   * @param {HTMLKupCardElement} card - Column menu card.
-   */
-  close(card: HTMLKupCardElement): void;
-  /**
-   * Function called to reposition the column menu card to the appropriate column.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   */
-  reposition(comp: KupDataTable | KupTree, card: HTMLKupCardElement): void;
-  /**
-   * Function called by the column menu card to prepare its 'data' prop.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @param {KupCardData} currentData - 'data' prop of the column menu card when it's already initialized.
-   * @returns {GenericObject} 'data' prop of the column menu card.
-   */
-  prepData(comp: KupDataTable | KupTree, column: KupDataColumn, currentData?: KupCardData): KupCardData;
-  /**
-   * Handles the column menu's button prop.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @returns {GenericObject[]} Buttons props.
-   */
-  prepButton(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
-  /**
-   * Handles the column menu's checkbox prop.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @returns {GenericObject[]} Checkboxes props.
-   */
-  prepCheckbox(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
-  /**
-   * Handles the column menu's chip prop.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @returns {GenericObject[]} Chips props (only 1 is handled).
-   */
-  prepChip(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
-  /**
-   * Handles the column menu's switch prop.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @param {KupObj[]} objs - Column's objs.
-   * @returns {GenericObject[]} Switches props.
-   */
-  prepSwitch(comp: KupDataTable | KupTree, column: KupDataColumn, objs: KupObj[]): GenericObject[];
-  /**
-   * Handles the column menu's tabbar prop.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @returns {GenericObject[]} Tab bar props.
-   */
-  prepTabBar(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
-  /**
-   * Handles the column menu's textfield prop.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @returns {GenericObject[]} Text fields props.
-   */
-  prepTextfield(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
-  /**
-   * Handles the column menu's interval textfields props (number column type).
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {Column} column - Column of the menu.
-   * @returns {GenericObject[]} Text fields props.
-   */
-  prepIntervalTextfield(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
-  /**
-   * Handles the column menu's interval timepicker props (time column type).
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @returns {GenericObject[]} Time picker fields props.
-   */
-  prepIntervalTimePicker(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
-  /**
-   * Handles the column menu's interval datepicker props (date/timestamp column type).
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @returns {GenericObject[]} Date picker fields props.
-   */
-  prepIntervalDatePicker(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
-  /**
-   * Function called by the column menu card when a kup-card-event is received.
-   * @param {CustomEvent} cardEvent - kup-card-event emitted by the column menu.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   */
-  eventHandlers(cardEvent: CustomEvent, comp: KupDataTable | KupTree): void;
-  /**
-   * Triggered when the text filter changes.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {string} value - New value of the filter.
-   * @param {KupDataColumn} column - Column of the menu.
-   */
-  textfieldChange(comp: KupDataTable | KupTree, value: string, column: KupDataColumn): void;
-  intervalChange(comp: KupDataTable | KupTree, value: string, column: KupDataColumn, index: FilterInterval, needNormalize: boolean, suffix?: string): void;
-  saveTextualFilters(comp: KupDataTable | KupTree, column: KupDataColumn): void;
-  /**
-   * Triggered when the checkbox list changes.
-   * @param {KupDataTable | KupTree} comp - Component using the column menu.
-   * @param {boolean} checked - State of the changed checkbox.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @param {string} filterValue - Value used to filter.
-   */
-  checkboxChange(comp: KupDataTable | KupTree, checked: boolean, column: KupDataColumn, filterValueItem: ValueDisplayedValue): void;
-  /**
-   * Toggles the grouping of the given column.
-   * @param {KupDataTable} comp - Component using the column menu.
-   * @param {Column} column - Column of the menu.
-   */
-  toggleGroup(comp: KupDataTable, column: string): void;
-  /**
-   * Sets the given column as key for the table.
-   * @param {KupDataTable} comp - Component using the column menu.
-   * @param {KupDataColumn} column - Column of the menu.
-   * @param {string} value - The status of the switch.
-   */
-  setKey(comp: KupDataTable, column: string, value: string): void;
+    clickCb: KupManagerClickCb;
+    filtersColumnMenuInstance: FiltersColumnMenu;
+    filtersRowsInstance: FiltersRows;
+    /**
+     * Function called by the component when the column menu must be opened.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {string} column - Name of the column.
+     */
+    open(comp: KupDataTable | KupTree, column: string): void;
+    /**
+     * Function called by the component when the column menu must be closed.
+     * @param {HTMLKupCardElement} card - Column menu card.
+     */
+    close(card: HTMLKupCardElement): void;
+    /**
+     * Function called to reposition the column menu card to the appropriate column.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     */
+    reposition(comp: KupDataTable | KupTree, card: HTMLKupCardElement): void;
+    /**
+     * Function called by the column menu card to prepare its 'data' prop.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @param {KupCardData} currentData - 'data' prop of the column menu card when it's already initialized.
+     * @returns {GenericObject} 'data' prop of the column menu card.
+     */
+    prepData(comp: KupDataTable | KupTree, column: KupDataColumn, currentData?: KupCardData): KupCardData;
+    /**
+     * Handles the column menu's button prop.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @returns {GenericObject[]} Buttons props.
+     */
+    prepButton(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
+    /**
+     * Handles the column menu's checkbox prop.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @returns {GenericObject[]} Checkboxes props.
+     */
+    prepCheckbox(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
+    /**
+     * Handles the column menu's chip prop.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @returns {GenericObject[]} Chips props (only 1 is handled).
+     */
+    prepChip(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
+    /**
+     * Handles the column menu's switch prop.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @param {KupObj[]} objs - Column's objs.
+     * @returns {GenericObject[]} Switches props.
+     */
+    prepSwitch(comp: KupDataTable | KupTree, column: KupDataColumn, objs: KupObj[]): GenericObject[];
+    /**
+     * Handles the column menu's tabbar prop.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @returns {GenericObject[]} Tab bar props.
+     */
+    prepTabBar(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
+    /**
+     * Handles the column menu's textfield prop.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @returns {GenericObject[]} Text fields props.
+     */
+    prepTextfield(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
+    /**
+     * Handles the column menu's interval textfields props (number column type).
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {Column} column - Column of the menu.
+     * @returns {GenericObject[]} Text fields props.
+     */
+    prepIntervalTextfield(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
+    /**
+     * Handles the column menu's interval timepicker props (time column type).
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @returns {GenericObject[]} Time picker fields props.
+     */
+    prepIntervalTimePicker(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
+    /**
+     * Handles the column menu's interval datepicker props (date/timestamp column type).
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @returns {GenericObject[]} Date picker fields props.
+     */
+    prepIntervalDatePicker(comp: KupDataTable | KupTree, column: KupDataColumn): GenericObject[];
+    /**
+     * Function called by the column menu card when a kup-card-event is received.
+     * @param {CustomEvent} cardEvent - kup-card-event emitted by the column menu.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     */
+    eventHandlers(cardEvent: CustomEvent, comp: KupDataTable | KupTree): void;
+    /**
+     * Triggered when the text filter changes.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {string} value - New value of the filter.
+     * @param {KupDataColumn} column - Column of the menu.
+     */
+    textfieldChange(comp: KupDataTable | KupTree, value: string, column: KupDataColumn): void;
+    intervalChange(comp: KupDataTable | KupTree, value: string, column: KupDataColumn, index: FilterInterval, needNormalize: boolean, suffix?: string): void;
+    saveTextualFilters(comp: KupDataTable | KupTree, column: KupDataColumn): void;
+    /**
+     * Triggered when the checkbox list changes.
+     * @param {KupDataTable | KupTree} comp - Component using the column menu.
+     * @param {boolean} checked - State of the changed checkbox.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @param {string} filterValue - Value used to filter.
+     */
+    checkboxChange(comp: KupDataTable | KupTree, checked: boolean, column: KupDataColumn, filterValueItem: ValueDisplayedValue): void;
+    /**
+     * Toggles the grouping of the given column.
+     * @param {KupDataTable} comp - Component using the column menu.
+     * @param {Column} column - Column of the menu.
+     */
+    toggleGroup(comp: KupDataTable, column: string): void;
+    /**
+     * Sets the given column as key for the table.
+     * @param {KupDataTable} comp - Component using the column menu.
+     * @param {KupDataColumn} column - Column of the menu.
+     * @param {string} value - The status of the switch.
+     */
+    setKey(comp: KupDataTable, column: string, value: string): void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@sme.up/ketchup",
-    "version": "9.2.0",
+    "version": "9.3.0",
     "keywords": [
         "smeup",
         "KetchUP",
@@ -35,9 +35,7 @@
         "test:speccov": "rimraf target && npm run build:setup && stencil test --spec --coverage",
         "test:e2e": "npm run build:setup && stencil test --e2e",
         "test": "npm run build:setup && stencil test --spec --e2e",
-        "test.watch": "npm run build:setup && stencil test --spec --e2e --watchAll",
-        "react:dev": "npx link ../../../gantt-component && cd ../../../gantt-component && npx link ../ketchup/packages/ketchup/node_modules/react ../ketchup/packages/ketchup/node_modules/react-dom && cd ../ketchup/packages/ketchup",
-        "jenkins:react:dev": "npx link ../../../GanttComponent-Develop-Continuum && cd ../../../GanttComponent-Develop-Continuum && npx link ../KetchUP-Develop-Continuum/packages/ketchup/node_modules/react ../KetchUP-Develop-Continuum/packages/ketchup/node_modules/react-dom && cd ../KetchUP-Develop-Continuum/packages/ketchup"
+        "test.watch": "npm run build:setup && stencil test --spec --e2e --watchAll"
     },
     "dependencies": {
         "@fullcalendar/core": "^6.1.8",
@@ -48,30 +46,28 @@
         "@material/form-field": "^14.0.0",
         "@material/ripple": "^14.0.0",
         "@material/textfield": "^14.0.0",
-        "@sme.up/gantt-component": "^1.3.30",
         "d3-shape": "^3.2.0",
         "dayjs": "^1.11.7",
         "echarts": "^5.4.2",
+        "hex-to-css-filter": "^5.4.0",
         "html2canvas": "^1.4.1",
         "interactjs": "1.10.12",
         "jquery": "^3.7.0",
         "numeral": "^2.0.6",
-        "react": "^18.2.0",
-        "react-dom": "^18.2.0",
         "resize-observer": "^1.0.4",
         "vanilla-picker": "^2.12.1"
     },
     "devDependencies": {
-        "@stencil/core": "^4.4.0",
+        "@stencil/core": "^4.8.1",
         "@stencil/react-output-target": "0.5.3",
-        "@stencil/sass": "^3.0.6",
-        "jest": "^27.4.5",
-        "jest-cli": "^27.4.5",
-        "jest-html-reporter": "^3.7.1",
-        "jest-junit": "^15.0.0",
-        "puppeteer": "^20.4.0",
-        "rimraf": "^5.0.1",
-        "sass": "^1.62.1"
+        "@stencil/sass": "^3.0.7",
+        "jest": "^29.7.0",
+        "jest-cli": "^29.7.0",
+        "jest-html-reporter": "^3.10.2",
+        "jest-junit": "^16.0.0",
+        "puppeteer": "^21.6.0",
+        "rimraf": "^5.0.5",
+        "sass": "^1.69.5"
     },
     "repository": {
         "type": "git",

package/dist/cjs/f-button-9ccadd52.js

@@ -1,105 +0,0 @@
-'use strict';
-
-const index = require('./index-d8e5eb5f.js');
-const fButtonDeclarations = require('./f-button-declarations-3fd791a8.js');
-const fImage = require('./f-image-66a3c3c1.js');
-
-/*-------------------------------------------------*/
-/*                C o m p o n e n t                */
-/*-------------------------------------------------*/
-const FButton = (props, children) => {
-  if (!props.styling) {
-    props.styling = fButtonDeclarations.FButtonStyling.RAISED;
-  }
-  if (!props.label && !props.icon) {
-    return;
-  }
-  const isIconButton = !!(props.styling.toLowerCase() === fButtonDeclarations.FButtonStyling.ICON ||
-    (props.styling.toLowerCase() === fButtonDeclarations.FButtonStyling.RAISED &&
-      props.icon &&
-      (props.label === null || props.label === undefined)));
-  return (index.h("div", Object.assign({ class: `f-button ${props.danger ? 'kup-danger' : ''} ${props.fullHeight ? 'kup-full-height' : ''} ${props.fullWidth ? 'kup-full-width' : ''} ${props.info ? 'kup-info' : ''} ${props.large ? 'kup-large' : ''} ${props.pulsating ? 'kup-pulsating' : ''}  ${props.shaped ? 'kup-shaped' : ''} ${props.secondary ? 'kup-secondary' : ''} ${props.slim ? 'kup-slim' : ''} ${props.success ? 'kup-success' : ''} ${props.warning ? 'kup-warning' : ''} ${props.wrapperClass ? props.wrapperClass : ''}` }, props.dataSet, { id: props.id, title: props.title }),
-    isIconButton ? renderIconButton(props) : renderButton(props),
-    children));
-};
-/*-------------------------------------------------*/
-/*                  M e t h o d s                  */
-/*-------------------------------------------------*/
-function renderButton(props) {
-  const isFlat = props.styling.toLowerCase() === fButtonDeclarations.FButtonStyling.FLAT;
-  const isFloating = props.styling.toLowerCase() === fButtonDeclarations.FButtonStyling.FLOATING;
-  const isIcon = props.styling.toLowerCase() === fButtonDeclarations.FButtonStyling.ICON;
-  const isOutlined = props.styling.toLowerCase() === fButtonDeclarations.FButtonStyling.OUTLINED;
-  const isRaised = !isFlat && !isFloating && !isOutlined && !isIcon ? true : false;
-  const propsFImage = {
-    color: props.disabled
-      ? `var(--kup_button_disabled_color)`
-      : isOutlined || isFlat
-        ? `var(--kup_button_primary_color)`
-        : `var(--kup_button_text_on_primary_color)`,
-    resource: props.icon,
-    sizeX: isFloating ? '1.75em' : '1.475em',
-    sizeY: isFloating ? '1.75em' : '1.475em',
-    wrapperClass: 'button__icon kup-icon',
-  };
-  if (props.showSpinner)
-    propsFImage.wrapperClass += ' content--hidden';
-  const classObj = {
-    button: true,
-    'button--disabled': props.disabled ? true : false,
-    'button--floating': isFloating ? true : false,
-    'button--outlined': isOutlined ? true : false,
-    'button--raised': isRaised ? true : false,
-    'button--no-label': !props.label || props.label === ' ' ? true : false,
-    'button--with-spinner': props.showSpinner && !props.disabled ? true : false,
-  };
-  const classLabelObj = {
-    button__label: true,
-    'content--hidden': props.showSpinner && !props.disabled ? true : false,
-  };
-  const styleSpinnerContainer = {
-    '--kup_button_spinner_height': propsFImage.sizeY,
-  };
-  return (index.h("button", { type: props.buttonType ? props.buttonType : 'button', class: classObj, disabled: props.disabled, onBlur: props.onBlur, onClick: props.onClick, onFocus: props.onFocus, style: styleSpinnerContainer, "aria-label": props.title },
-    props.trailingIcon
-      ? [
-        index.h("span", { class: classLabelObj }, props.label),
-        props.icon ? index.h(fImage.FImage, Object.assign({}, propsFImage)) : undefined,
-      ]
-      : [
-        props.icon ? index.h(fImage.FImage, Object.assign({}, propsFImage)) : undefined,
-        index.h("span", { class: classLabelObj }, props.label),
-      ],
-    props.showSpinner && !props.disabled ? (index.h("div", { class: "button__spinner-container" },
-      index.h("slot", { name: "spinner" }))) : undefined));
-}
-function renderIconButton(props) {
-  const propsFImage = {
-    color: props.disabled
-      ? `var(--kup_button_disabled_color)`
-      : `var(--kup_button_primary_color)`,
-    sizeX: props.large ? 'calc(1.75em * 1.5)' : '1.75em',
-    sizeY: props.large ? 'calc(1.75em * 1.5)' : '1.75em',
-  };
-  const classObj = {
-    'icon-button': true,
-    'button--disabled': props.disabled ? true : false,
-    'icon-button--on': props.toggable && props.checked ? true : false,
-    toggable: props.toggable ? true : false,
-    'button--with-spinner': props.showSpinner && !props.disabled ? true : false,
-  };
-  const styleSpinnerContainer = {
-    '--kup_button_spinner_height': propsFImage.sizeY,
-    '--kup_button_spinner_width': propsFImage.sizeX,
-  };
-  const iconOff = props.iconOff
-    ? props.iconOff
-    : props.icon + '_border';
-  return (index.h("button", { type: props.buttonType ? props.buttonType : 'button', class: classObj, disabled: props.disabled, onClick: props.onClick, style: styleSpinnerContainer, value: props.checked ? 'on' : 'off', "aria-label": props.title },
-    !props.showSpinner || props.disabled ? (index.h(fImage.FImage, Object.assign({}, propsFImage, { resource: props.toggable && !props.checked ? iconOff : props.icon, wrapperClass: `icon-button__icon kup-icon` }))) : null,
-    props.toggable && !props.showSpinner ? (index.h(fImage.FImage, Object.assign({}, propsFImage, { resource: props.icon, wrapperClass: `icon-button__icon icon-button__icon--on kup-icon` }))) : null,
-    props.showSpinner && !props.disabled ? (index.h("div", { class: "icon-button__spinner-container" },
-      index.h("slot", { name: "spinner" }))) : undefined));
-}
-
-exports.FButton = FButton;