Merge pull request #1884 from smeup/dev-to-mas

v9.6.6
smeup · May 7, 2024 · edee9b4 · edee9b4
2 parents 9d3b8c1 + 5909071
commit edee9b4
Show file tree

Hide file tree

Showing 238 changed files with 974 additions and 628 deletions.
diff --git a/packages/ketchup-react/package.json b/packages/ketchup-react/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@sme.up/ketchup-react",
-    "version": "9.6.5",
+    "version": "9.6.6",
     "module": "dist/index.js",
     "typings": "dist/index.d.ts",
     "keywords": [
@@ -20,7 +20,7 @@
     "description": "Ketchup React Components library by smeup",
     "license": "Apache-2.0",
     "dependencies": {
-        "@sme.up/ketchup": "^9.6.5",
+        "@sme.up/ketchup": "^9.6.6",
         "react": "^18.2.0",
         "react-dom": "^18.2.0"
     },

diff --git a/packages/ketchup-showcase/package.json b/packages/ketchup-showcase/package.json
@@ -19,7 +19,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "@sme.up/ketchup": "^9.6.5",
+    "@sme.up/ketchup": "^9.6.6",
     "core-js": "^3.30.2",
     "vue": "^2.6.14",
     "vue-router": "^3.5.1"

diff --git a/packages/ketchup-showcase/src/App.vue b/packages/ketchup-showcase/src/App.vue
@@ -55,8 +55,8 @@
           @kup-tree-nodeselected="treeClick"
         ></kup-tree
         ><div class="version"
-          ><a href="https://github.com/smeup/ketchup/releases/tag/v9.6.5"
-            >v9.6.5</a
+          ><a href="https://github.com/smeup/ketchup/releases/tag/v9.6.6"
+            >v9.6.6</a
           ></div
         ></div
       >

diff --git a/packages/ketchup/package.json b/packages/ketchup/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@sme.up/ketchup",
-    "version": "9.6.5",
+    "version": "9.6.6",
     "keywords": [
         "smeup",
         "KetchUP",
@@ -60,7 +60,7 @@
         "vanilla-picker": "^2.12.1"
     },
     "devDependencies": {
-        "@stencil/core": "^4.12.0",
+        "@stencil/core": "^4.17.2",
         "@stencil/react-output-target": "0.5.3",
         "@stencil/sass": "^3.0.9",
         "jest": "^29.7.0",

diff --git a/packages/ketchup/src/badge.html b/packages/ketchup/src/badge.html
@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Badge</title>
+
+        <script type="module" src="/build/ketchup.esm.js"></script>
+        <script nomodule src="/build/ketchup.js"></script>
+
+        <link
+            href="https://cdn.materialdesignicons.com/4.5.95/css/materialdesignicons.min.css"
+            rel="stylesheet"
+            type="text/css"
+        />
+
+        <link
+            href="https://fonts.googleapis.com/css?family=Lato"
+            rel="stylesheet"
+        />
+
+        <script
+            type="text/javascript"
+            src="https://www.gstatic.com/charts/loader.js"
+        ></script>
+
+        <style>
+            html {
+                background-color: var(--kup-background-color);
+                color: var(--kup-text-color);
+                font-family: var(--kup-font-family);
+                font-size: var(--kup-font-size);
+                padding: 1rem;
+            }
+
+            .badge-container {
+                width: 200px;
+                height: 50px;
+                position: relative;
+                border: 1px solid var(--kup-primary-color);
+            }
+
+            span {
+              display: block;
+              margin: 6px 0 12px;
+            }
+        </style>
+    </head>
+    <body>
+      <script>
+        document.documentElement['ketchupInit'] = {
+            debug: { active: true },
+        };
+    </script>
+        <h3>Badge</h3>
+
+        <h4>Status:</h4>
+
+        <span>Type : info ( Default )</span>
+        <div class="badge-container">
+          <kup-badge text="demo"></kup-badge>
+        </div>
+
+        <span>Type: danger</span>
+        <div class="badge-container">
+          <kup-badge text="demo" type="error"></kup-badge>
+        </div>
+        <span>Type : warning</span>
+        <div class="badge-container">
+          <kup-badge text="demo" type="warning"></kup-badge>
+        </div>
+        <span>Type : success</span>
+        <div class="badge-container">
+          <kup-badge text="demo" type="success"></kup-badge>
+        </div>
+
+        <h4>Position:</h4>
+
+        <span>top left (default)</span>
+        <div class="badge-container">
+          <kup-badge text="demo"></kup-badge>
+        </div>
+        <span>top left</span>
+        <div class="badge-container">
+          <kup-badge text="demo" class="kup-top-right"></kup-badge>
+        </div>
+        <span>bottom right</span>
+        <div class="badge-container">
+          <kup-badge text="demo" class="kup-bottom-right"></kup-badge>
+        </div>
+        <span>bottom left</span>
+        <div class="badge-container">
+          <kup-badge text="demo" class="kup-bottom-left"></kup-badge>
+        </div>
+      </div>
+
+        <script>
+          document.addEventListener('kup-manager-ready', () => {
+              const kupManager = document.documentElement.ketchup;
+              kupManager.theme.set('teal')
+          });
+        </script>
+    </body>
+</html>
diff --git a/packages/ketchup/src/components.d.ts b/packages/ketchup/src/components.d.ts
@@ -9,6 +9,7 @@ import { KupAccordionData, KupAccordionItemSelectedEventPayload } from "./compon
 import { GenericObject, KupEventPayload } from "./types/GenericTypes";
 import { ItemsDisplayMode, KupListEventPayload, KupListNode, KupListRole } from "./components/kup-list/kup-list-declarations";
 import { KupAutocompleteEventPayload, KupAutocompleteIconClickEventPayload } from "./components/kup-autocomplete/kup-autocomplete-declarations";
+import { BadgeType } from "./components/kup-badge/kup-badge-declarations";
 import { KupBoxAutoSelectEventPayload, KupBoxClickEventPayload, KupBoxContextMenuEventPayload, KupBoxData, KupBoxKanban, KupBoxLayout, KupBoxLoadMoreClickEventPayload, KupBoxRow, KupBoxRowActionClickEventPayload, KupBoxSelectedEventPayload, LoadMoreMode } from "./components/kup-box/kup-box-declarations";
 import { KupStore } from "./components/kup-state/kup-store";
 import { KupDataCell, KupDataColumn, KupDataDataset, KupDataNewColumnOptions, KupDataNewColumnTypes, KupDataRowAction } from "./managers/kup-data/kup-data-declarations";
@@ -59,6 +60,7 @@ export { KupAccordionData, KupAccordionItemSelectedEventPayload } from "./compon
 export { GenericObject, KupEventPayload } from "./types/GenericTypes";
 export { ItemsDisplayMode, KupListEventPayload, KupListNode, KupListRole } from "./components/kup-list/kup-list-declarations";
 export { KupAutocompleteEventPayload, KupAutocompleteIconClickEventPayload } from "./components/kup-autocomplete/kup-autocomplete-declarations";
+export { BadgeType } from "./components/kup-badge/kup-badge-declarations";
 export { KupBoxAutoSelectEventPayload, KupBoxClickEventPayload, KupBoxContextMenuEventPayload, KupBoxData, KupBoxKanban, KupBoxLayout, KupBoxLoadMoreClickEventPayload, KupBoxRow, KupBoxRowActionClickEventPayload, KupBoxSelectedEventPayload, LoadMoreMode } from "./components/kup-box/kup-box-declarations";
 export { KupStore } from "./components/kup-state/kup-store";
 export { KupDataCell, KupDataColumn, KupDataDataset, KupDataNewColumnOptions, KupDataNewColumnTypes, KupDataRowAction } from "./managers/kup-data/kup-data-declarations";
@@ -271,6 +273,11 @@ export namespace Components {
           * @default null
          */
         "text": string;
+        /**
+          * The gravity of the badge.
+          * @default BadgeType.INFO
+         */
+        "type": BadgeType;
     }
     interface KupBox {
         /**
@@ -2800,6 +2807,11 @@ export namespace Components {
           * This method is used to trigger a new render of the component.
          */
         "refresh": () => Promise<void>;
+        /**
+          * Credentials sending along with request
+          * @default true
+         */
+        "sendCredentials": boolean;
         /**
           * Sets the props to the component.
           * @param props - Object containing props that will be set to the component.
@@ -5371,6 +5383,11 @@ declare namespace LocalJSX {
           * @default null
          */
         "text"?: string;
+        /**
+          * The gravity of the badge.
+          * @default BadgeType.INFO
+         */
+        "type"?: BadgeType;
     }
     interface KupBox {
         /**
@@ -7435,6 +7452,11 @@ declare namespace LocalJSX {
           * @default null
          */
         "pdfPath"?: string;
+        /**
+          * Credentials sending along with request
+          * @default true
+         */
+        "sendCredentials"?: boolean;
     }
     interface KupPhotoFrame {
         /**

diff --git a/packages/ketchup/src/components/kup-badge/kup-badge-declarations.ts b/packages/ketchup/src/components/kup-badge/kup-badge-declarations.ts
@@ -7,3 +7,10 @@ export enum KupBadgeProps {
     imageData = 'The data of the image displayed inside the badge.Props of the sub-components.',
     text = 'The text displayed inside the badge.Defaults at false. When set to true, the component is disabled.',
 }
+
+export enum BadgeType {
+    SUCCESS = 'success',
+    INFO = 'info',
+    ERROR = 'error',
+    WARNING = 'warning',
+}
diff --git a/packages/ketchup/src/components/kup-badge/kup-badge.tsx b/packages/ketchup/src/components/kup-badge/kup-badge.tsx
@@ -22,7 +22,7 @@ import {
 import { KupThemeColorValues } from '../../managers/kup-theme/kup-theme-declarations';
 import { getProps, setProps } from '../../utils/utils';
 import { componentWrapperId } from '../../variables/GenericVariables';
-import { KupBadgeProps } from './kup-badge-declarations';
+import { BadgeType, KupBadgeProps } from './kup-badge-declarations';
 
 @Component({
     tag: 'kup-badge',
@@ -50,6 +50,11 @@ export class KupBadge {
      * @default null
      */
     @Prop() imageData: GenericObject = null;
+    /**
+     * The gravity of the badge.
+     * @default BadgeType.INFO
+     */
+    @Prop() type: BadgeType = BadgeType.INFO;
     /**
      * The text displayed inside the badge.
      * @default null
@@ -156,7 +161,11 @@ export class KupBadge {
                         this.rootElement as KupComponent
                     )}
                 </style>
-                <div id={componentWrapperId} onClick={() => this.onKupClick()}>
+                <div
+                    id={componentWrapperId}
+                    class={this.type}
+                    onClick={() => this.onKupClick()}
+                >
                     {this.text}
                     {imageEl}
                 </div>

diff --git a/packages/ketchup/src/components/kup-badge/readme.md b/packages/ketchup/src/components/kup-badge/readme.md
@@ -5,11 +5,12 @@
 
 ## Properties
 
-| Property      | Attribute      | Description                                       | Type            | Default |
-| ------------- | -------------- | ------------------------------------------------- | --------------- | ------- |
-| `customStyle` | `custom-style` | Custom style of the component.                    | `string`        | `''`    |
-| `imageData`   | --             | The data of the image displayed inside the badge. | `GenericObject` | `null`  |
-| `text`        | `text`         | The text displayed inside the badge.              | `string`        | `null`  |
+| Property      | Attribute      | Description                                       | Type                                                                          | Default          |
+| ------------- | -------------- | ------------------------------------------------- | ----------------------------------------------------------------------------- | ---------------- |
+| `customStyle` | `custom-style` | Custom style of the component.                    | `string`                                                                      | `''`             |
+| `imageData`   | --             | The data of the image displayed inside the badge. | `GenericObject`                                                               | `null`           |
+| `text`        | `text`         | The text displayed inside the badge.              | `string`                                                                      | `null`           |
+| `type`        | `type`         | The gravity of the badge.                         | `BadgeType.ERROR \| BadgeType.INFO \| BadgeType.SUCCESS \| BadgeType.WARNING` | `BadgeType.INFO` |
 
 
 ## Events

diff --git a/packages/ketchup/src/components/kup-badge/styles/kup-badge-classes.scss b/packages/ketchup/src/components/kup-badge/styles/kup-badge-classes.scss
@@ -26,27 +26,22 @@
   transform: translate(15%, -15%);
 }
 
-:host(.#{$kup-class-danger}) {
-  --kup-badge-primary-color: var(--kup-danger-color);
-  --kup-badge-text-on-primary-color: white;
+#kup-component.error {
+  background-color: var(--kup-error-color-20);
+  color: var(--kup-error-color-70);
 }
 
-:host(.#{$kup-class-info}) {
-  --kup-badge-primary-color: var(--kup-info-color);
-  --kup-badge-text-on-primary-color: white;
+#kup-component.info {
+  background-color: var(--kup-info-color-20);
+  color: var(--kup-info-color-70);
 }
 
-:host(.#{$kup-class-secondary}) {
-  --kup-badge-primary-color: var(--kup-secondary-color);
-  --kup-badge-text-on-primary-color: var(--kup-text-on-secondary-color);
+#kup-component.success {
+  background-color: var(--kup-success-color-20);
+  color: var(--kup-success-color-70);
 }
 
-:host(.#{$kup-class-success}) {
-  --kup-badge-primary-color: var(--kup-success-color);
-  --kup-badge-text-on-primary-color: white;
-}
-
-:host(.#{$kup-class-warning}) {
-  --kup-badge-primary-color: var(--kup-warning-color);
-  --kup-badge-text-on-primary-color: white;
+#kup-component.warning {
+  background-color: var(--kup-warning-color-20);
+  color: var(--kup-warning-color-70);
 }
diff --git a/packages/ketchup/src/components/kup-calendar/kup-calendar.scss b/packages/ketchup/src/components/kup-calendar/kup-calendar.scss
@@ -149,6 +149,10 @@
     padding: 0.25rem;
   }
 
+  .fc-daygrid-dot-event .fc-event-title {
+    white-space: normal;
+  }
+
   .fc-content,
   .fc-divider,
   .fc-list-heading td,
@@ -217,18 +221,18 @@
   .navigation {
     flex-direction: column;
   }
-  .calendar{
+  .calendar {
     height: 100%;
-    .fc-view-harness{
+    .fc-view-harness {
       min-height: 450px;
     }
   }
-  
-  .navigation .navigation__left{
+
+  .navigation .navigation__left {
     font-size: 20px;
     gap: 8px;
   }
-  .navigation .navigation__right .f-chip .chip-set .chip-set__item{
+  .navigation .navigation__right .f-chip .chip-set .chip-set__item {
     font-size: 16px;
   }
 }
diff --git a/packages/ketchup/src/components/kup-card/built-in/kup-card-built-in-2.scss b/packages/ketchup/src/components/kup-card/built-in/kup-card-built-in-2.scss
@@ -13,7 +13,6 @@
 
   .clock {
     box-shadow: var(--kup-box-shadow);
-    width: 300px;
     height: 450px;
     background-color: var(--kup-background-color);
     position: relative;
@@ -42,10 +41,10 @@
     background-color: rgba(var(--kup-text-color-rgb), 0.1);
     width: 250px;
     height: 250px;
+    margin: auto;
     border-radius: 1000px;
     position: relative;
     top: 25px;
-    left: 25px;
     box-sizing: border-box;
     display: none;
     &.visible {

diff --git a/packages/ketchup/src/components/kup-image/assets/svg/ACC.svg b/packages/ketchup/src/components/kup-image/assets/svg/ACC.svg
diff --git a/packages/ketchup/src/components/kup-image/assets/svg/ACP.svg b/packages/ketchup/src/components/kup-image/assets/svg/ACP.svg
diff --git a/packages/ketchup/src/components/kup-image/assets/svg/AML.svg b/packages/ketchup/src/components/kup-image/assets/svg/AML.svg
diff --git a/packages/ketchup/src/components/kup-image/assets/svg/ASD.svg b/packages/ketchup/src/components/kup-image/assets/svg/ASD.svg
diff --git a/packages/ketchup/src/components/kup-image/assets/svg/ATM.svg b/packages/ketchup/src/components/kup-image/assets/svg/ATM.svg
diff --git a/packages/ketchup/src/components/kup-image/assets/svg/BAS.svg b/packages/ketchup/src/components/kup-image/assets/svg/BAS.svg