@maggioli-design-system/mds-input-tip 1.4.0 → 1.5.0

package/dist/collection/common/browser.js

@@ -0,0 +1,7 @@
+const isSafari = () => {
+    if (navigator) {
+        return /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
+    }
+    return false;
+};
+export { isSafari, };

package/dist/collection/common/floating-controller.js

@@ -65,6 +65,23 @@ export class FloatingController {
                     return { transformOrigin: 'center top' };
             }
         };
+        this.convertToTransformOrigin = (position) => {
+            const positions = {
+                top: 'center bottom',
+                right: 'left center',
+                bottom: 'center top',
+                left: 'right center',
+                'bottom-end': 'top right',
+                'bottom-start': 'top left',
+                'left-end': 'right bottom',
+                'left-start': 'right top',
+                'right-end': 'left bottom',
+                'right-start': 'left top',
+                'top-end': 'bottom right',
+                'top-start': 'bottom left',
+            };
+            return positions[position];
+        };
         this.calculatePosition = () => {
             if (!this._caller)
                 return;
@@ -99,6 +116,7 @@ export class FloatingController {
                 Object.assign(this._host.style, {
                     left: `${x}px`,
                     top: `${y}px`,
+                    transformOrigin: this.convertToTransformOrigin(placement),
                 });
                 const arrowStyle = {};
                 const arrowPosition = {

package/dist/collection/common/keyboard-manager.js

@@ -22,8 +22,9 @@ export class KeyboardManager {
             this.elements.delete(name);
         };
         this.attachClickBehavior = (name = 'element') => {
-            var _a;
-            (_a = this.elements.get(name)) === null || _a === void 0 ? void 0 : _a.addEventListener('keydown', this.handleClickBehaviorDispatchEvent);
+            var _a, _b;
+            (_a = this.elements.get(name)) === null || _a === void 0 ? void 0 : _a.removeEventListener('keydown', this.handleClickBehaviorDispatchEvent);
+            (_b = this.elements.get(name)) === null || _b === void 0 ? void 0 : _b.addEventListener('keydown', this.handleClickBehaviorDispatchEvent);
         };
         this.detachClickBehavior = (name = 'element') => {
             var _a;

package/dist/collection/type/input-tip.js

@@ -0,0 +1 @@
+export {};

package/dist/documentation.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-03-05T17:39:52",
+  "timestamp": "2025-03-17T17:40:43",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.27.2",

package/dist/stats.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-03-05T17:39:53",
+  "timestamp": "2025-03-17T17:40:44",
   "compiler": {
     "name": "node",
     "version": "22.11.0"
@@ -9,13 +9,14 @@
     "fsNamespace": "mds-input-tip",
     "components": 1,
     "entries": 1,
-    "bundles": 103,
+    "bundles": 105,
     "outputs": [
       {
         "name": "dist-collection",
-        "files": 55,
+        "files": 57,
         "generatedFiles": [
           "./dist/collection/common/aria.js",
+          "./dist/collection/common/browser.js",
           "./dist/collection/common/date.js",
           "./dist/collection/common/device.js",
           "./dist/collection/common/file.js",
@@ -61,6 +62,7 @@
           "./dist/collection/type/floating-ui.js",
           "./dist/collection/type/form-rel.js",
           "./dist/collection/type/header-bar.js",
+          "./dist/collection/type/input-tip.js",
           "./dist/collection/type/input.js",
           "./dist/collection/type/keyboard.js",
           "./dist/collection/type/loading.js",
@@ -478,6 +480,7 @@
   },
   "sourceGraph": {
     "./src/common/aria.ts": [],
+    "./src/common/browser.ts": [],
     "./src/common/date.ts": [],
     "./src/common/device.ts": [],
     "./src/common/file.ts": [],
@@ -540,6 +543,7 @@
     "./src/type/floating-ui.ts": [],
     "./src/type/form-rel.ts": [],
     "./src/type/header-bar.ts": [],
+    "./src/type/input-tip.ts": [],
     "./src/type/input.ts": [],
     "./src/type/keyboard.ts": [],
     "./src/type/loading.ts": [],

package/dist/types/common/browser.d.ts

@@ -0,0 +1,2 @@
+declare const isSafari: () => boolean;
+export { isSafari, };

package/dist/types/common/floating-controller.d.ts

@@ -27,6 +27,7 @@ export declare class FloatingController {
     private readonly arrowInset;
     private readonly arrowTransform;
     private readonly arrowTransformOrigin;
+    private convertToTransformOrigin;
     private readonly calculatePosition;
     updatePosition(): void;
     dismiss(): void;

package/dist/types/common/locale.d.ts

@@ -15,6 +15,6 @@ export declare class Locale {
     lang: (el: HTMLElement) => string;
     update: (doc?: Document | ShadowRoot) => void;
     private pluralize;
-    get: (tag: string | string[], context?: Record<string, string | number>) => string;
+    get: (tag: string | string[], context?: Record<string, string | number | boolean>) => string;
 }
 export {};

package/dist/types/type/input-tip.d.ts

@@ -0,0 +1 @@
+export type InputTipItemVariantType = 'count-almost' | 'count-almost-full' | 'count-empty' | 'count-full' | 'count-incomplete' | 'disabled' | 'readonly' | 'required' | 'required-success' | 'text';

package/documentation.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-03-05T16:16:01",
+  "timestamp": "2025-03-17T17:10:07",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.27.2",
@@ -409,10 +409,10 @@
       "docstring": "",
       "path": "src/components/mds-input-tip/meta/types.ts"
     },
-    "src/components/mds-input-tip-item/meta/types.ts::InputTipItemVariantType": {
-      "declaration": "export type InputTipItemVariantType =\n  | 'required'\n  | 'required-success'\n  | 'disabled'\n  | 'readonly'\n  | 'text'",
+    "src/type/input-tip.ts::InputTipItemVariantType": {
+      "declaration": "export type InputTipItemVariantType =\n  | 'count-almost'\n  | 'count-almost-full'\n  | 'count-empty'\n  | 'count-full'\n  | 'count-incomplete'\n  | 'disabled'\n  | 'readonly'\n  | 'required'\n  | 'required-success'\n  | 'text'",
       "docstring": "",
-      "path": "src/components/mds-input-tip-item/meta/types.ts"
+      "path": "src/type/input-tip.ts"
     },
     "src/components/mds-input-upload/meta/types.ts::AttachmentSort": {
       "declaration": "type AttachmentSort =\n  'status' |\n  'date'",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maggioli-design-system/mds-input-tip",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "mds-input-tip is a web-component from Magma Design System, built with StencilJS, TypeScript, Storybook. It's based on the web-component standard and it's designed to be agnostic from the JavaScript framework you are using.",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -24,7 +24,7 @@
     "test": "stencil test --spec --e2e"
   },
   "dependencies": {
-    "@maggioli-design-system/mds-input-tip-item": "1.4.0",
+    "@maggioli-design-system/mds-input-tip-item": "1.3.0",
     "@maggioli-design-system/styles": "15.9.0",
     "@stencil/core": "4.27.2"
   },

package/src/common/browser.ts

@@ -0,0 +1,10 @@
+const isSafari = (): boolean => {
+  if (navigator) {
+    return /^((?!chrome|android).)*safari/i.test(navigator.userAgent)
+  }
+  return false
+}
+
+export {
+  isSafari,
+}

package/src/common/floating-controller.ts

@@ -7,6 +7,7 @@ import {
   Middleware,
   MiddlewareData,
   offset,
+  Placement,
   shift,
 } from '@floating-ui/dom'
 import { FloatingUIPlacement, FloatingUIStrategy } from '@type/floating-ui'
@@ -138,6 +139,24 @@ export class FloatingController {
     }
   }
 
+  private convertToTransformOrigin = (position: Placement): string => {
+    const positions = {
+      top: 'center bottom',
+      right: 'left center',
+      bottom: 'center top',
+      left: 'right center',
+      'bottom-end': 'top right',
+      'bottom-start': 'top left',
+      'left-end': 'right bottom',
+      'left-start': 'right top',
+      'right-end': 'left bottom',
+      'right-start': 'left top',
+      'top-end': 'bottom right',
+      'top-start': 'bottom left',
+    }
+    return positions[position]
+  }
+
   private readonly calculatePosition = (): void => {
     if (!this._caller) return
 
@@ -181,6 +200,7 @@ export class FloatingController {
       Object.assign(this._host.style, {
         left: `${x}px`,
         top: `${y}px`,
+        transformOrigin: this.convertToTransformOrigin(placement),
       })
 
       const arrowStyle = {}

package/src/common/keyboard-manager.ts

@@ -27,6 +27,7 @@ export class KeyboardManager {
   }
 
   attachClickBehavior = (name = 'element'): void => {
+    this.elements.get(name)?.removeEventListener('keydown', this.handleClickBehaviorDispatchEvent)
     this.elements.get(name)?.addEventListener('keydown', this.handleClickBehaviorDispatchEvent)
   }
 

package/src/common/locale.ts

@@ -52,7 +52,7 @@ export class Locale {
     })
   }
 
-  private pluralize = (tag: string | string[], context: Record<string, string | number>): string => {
+  private pluralize = (tag: string | string[], context: Record<string, string | number | boolean>): string => {
 
     const languagePhrase: string | string[] = this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag]
     const phrases: string[] = []
@@ -81,7 +81,7 @@ export class Locale {
     return render(translatePhrase, context)
   }
 
-  get = (tag: string | string[], context?: Record<string, string | number>): string => {
+  get = (tag: string | string[], context?: Record<string, string | number | boolean>): string => {
     if (context) {
       return this.pluralize(tag, context)
     }

package/src/fixtures/icons.json

@@ -52,6 +52,7 @@
     "mgg/ai-status-suspended",
     "mgg/alerts-pagopa",
     "mgg/anagrafe-nazionale",
+    "mgg/anist",
     "mgg/anpr",
     "mgg/ansc",
     "mgg/area-edificabile",
@@ -361,6 +362,7 @@
     "mi/baseline/eco",
     "mi/baseline/email",
     "mi/baseline/error",
+    "mi/baseline/expand-more",
     "mi/baseline/explore",
     "mi/baseline/favorite",
     "mi/baseline/favorite-border",

package/src/fixtures/iconsauce.json

@@ -32,6 +32,7 @@
     "mgg/ai-status-suspended",
     "mgg/alerts-pagopa",
     "mgg/anagrafe-nazionale",
+    "mgg/anist",
     "mgg/anpr",
     "mgg/ansc",
     "mgg/area-edificabile",

package/src/type/input-tip.ts

@@ -0,0 +1,11 @@
+export type InputTipItemVariantType =
+  | 'count-almost'
+  | 'count-almost-full'
+  | 'count-empty'
+  | 'count-full'
+  | 'count-incomplete'
+  | 'disabled'
+  | 'readonly'
+  | 'required'
+  | 'required-success'
+  | 'text'