@maggioli-design-system/mds-modal 4.11.3 → 4.11.4

package/dist/collection/common/date.js

@@ -0,0 +1,13 @@
+// ISO 8601 date regex allowing optional components (month, day, time)
+const ISO8601RegexString = '^\\d{4}(-\\d{2})?(-\\d{2})?(T\\d{2}(:\\d{2})?(:\\d{2})?(\\.\\d{3})?)?([+-]\\d{2}:\\d{2}|Z)?$';
+const isISO8601Date = (dateString) => {
+    const ISO8601Regex = new RegExp(ISO8601RegexString);
+    return ISO8601Regex.test(dateString);
+};
+const sanitizeISO8601Date = (dateString) => {
+    if (isISO8601Date(dateString)) {
+        return dateString;
+    }
+    return new Date(dateString).toISOString();
+};
+export { sanitizeISO8601Date, isISO8601Date, };

package/dist/collection/common/locale.js

@@ -2,15 +2,19 @@ import Handlebars from "handlebars";
 export class Locale {
     constructor(configData) {
         this.rollbackLanguage = 'en';
+        this.set = (configData) => {
+            this.config = configData;
+        };
         this.lang = (element) => {
             this.closestElement = element.closest('[lang]');
             if (this.closestElement) {
                 if (this.closestElement.lang) {
                     this.language = this.closestElement.lang;
-                    return;
+                    return this.language;
                 }
             }
             this.language = this.rollbackLanguage;
+            return this.language;
         };
         this.pluralize = (tag, context) => {
             const languagePhrase = this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag];
@@ -43,6 +47,8 @@ export class Locale {
             }
             return this.config[this.language] ? this.config[this.language][tag] : this.config[this.rollbackLanguage][tag];
         };
-        this.config = configData;
+        if (configData) {
+            this.set(configData);
+        }
     }
 }

package/dist/collection/dictionary/button.js

@@ -27,4 +27,9 @@ const buttonIconPositionDictionary = [
     'left',
     'right',
 ];
-export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonVariantDictionary, };
+const buttonTypeDictionary = [
+    'button',
+    'submit',
+    'reset',
+];
+export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonTypeDictionary, buttonVariantDictionary, };

package/dist/collection/dictionary/variant.js

@@ -83,8 +83,13 @@ const toneSimpleVariantDictionary = [
     'weak',
     'quiet',
 ];
+const toneSmartVariantDictionary = [
+    'strong',
+    'weak',
+    'ghost',
+];
 const toneMinimalVariantDictionary = [
     'strong',
     'weak',
 ];
-export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };
+export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };

package/dist/collection/type/date.js

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

package/dist/documentation.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2024-09-23T14:58:34",
+  "timestamp": "2024-09-26T10:59:56",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.21.0",

package/dist/stats.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2024-09-23T14:58:34",
+  "timestamp": "2024-09-26T10:59:56",
   "compiler": {
     "name": "node",
     "version": "20.10.0"
@@ -9,13 +9,14 @@
     "fsNamespace": "mds-modal",
     "components": 1,
     "entries": 1,
-    "bundles": 92,
+    "bundles": 94,
     "outputs": [
       {
         "name": "dist-collection",
-        "files": 44,
+        "files": 46,
         "generatedFiles": [
           "./dist/collection/common/aria.js",
+          "./dist/collection/common/date.js",
           "./dist/collection/common/file.js",
           "./dist/collection/common/icon.js",
           "./dist/collection/common/keyboard-manager.js",
@@ -48,6 +49,7 @@
           "./dist/collection/interface/input-value.js",
           "./dist/collection/type/autocomplete.js",
           "./dist/collection/type/button.js",
+          "./dist/collection/type/date.js",
           "./dist/collection/type/file-types.js",
           "./dist/collection/type/floating-ui.js",
           "./dist/collection/type/form-rel.js",
@@ -627,6 +629,7 @@
   },
   "sourceGraph": {
     "./src/common/aria.ts": [],
+    "./src/common/date.ts": [],
     "./src/common/file.ts": [],
     "./src/common/icon.ts": [],
     "./src/common/keyboard-manager.ts": [],
@@ -673,6 +676,7 @@
     "./src/interface/input-value.ts": [],
     "./src/type/autocomplete.ts": [],
     "./src/type/button.ts": [],
+    "./src/type/date.ts": [],
     "./src/type/file-types.ts": [],
     "./src/type/floating-ui.ts": [],
     "./src/type/form-rel.ts": [],

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

@@ -0,0 +1,4 @@
+import { ISO8601Date } from '@type/date';
+declare const isISO8601Date: (dateString: string) => boolean;
+declare const sanitizeISO8601Date: (dateString: string) => ISO8601Date;
+export { sanitizeISO8601Date, isISO8601Date, };

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

@@ -9,8 +9,9 @@ export declare class Locale {
     language: string;
     config: LocaleConfig;
     closestElement: HTMLElement;
-    constructor(configData: LocaleConfig);
-    lang: (element: HTMLElement) => void;
+    constructor(configData?: LocaleConfig);
+    set: (configData: LocaleConfig) => void;
+    lang: (element: HTMLElement) => string;
     private pluralize;
     get: (tag: string | string[], context?: Record<string, string | number>) => string;
 }

package/dist/types/dictionary/button.d.ts

@@ -3,4 +3,5 @@ declare const buttonToneVariantDictionary: string[];
 declare const buttonTargetDictionary: string[];
 declare const buttonSizeDictionary: string[];
 declare const buttonIconPositionDictionary: string[];
-export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonVariantDictionary, };
+declare const buttonTypeDictionary: string[];
+export { buttonIconPositionDictionary, buttonSizeDictionary, buttonTargetDictionary, buttonToneVariantDictionary, buttonTypeDictionary, buttonVariantDictionary, };

package/dist/types/dictionary/variant.d.ts

@@ -7,5 +7,6 @@ declare const themeLabelVariantDictionary: string[];
 declare const toneVariantDictionary: string[];
 declare const toneActionVariantDictionary: string[];
 declare const toneSimpleVariantDictionary: string[];
+declare const toneSmartVariantDictionary: string[];
 declare const toneMinimalVariantDictionary: string[];
-export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneVariantDictionary, };
+export { themeFullVariantAvatarDictionary, themeFullVariantDictionary, themeLabelVariantDictionary, themeLuminanceVariantDictionary, themeStatusVariantDictionary, themeVariantDictionary, toneActionVariantDictionary, toneMinimalVariantDictionary, toneSimpleVariantDictionary, toneSmartVariantDictionary, toneVariantDictionary, };

package/dist/types/type/date.d.ts

@@ -0,0 +1,5 @@
+type ISO8601DateFormat<K, T> = K & {
+    __isISO8601DateFormat: T;
+};
+type ISO8601Date = ISO8601DateFormat<string, 'ISO8601Date'>;
+export { ISO8601Date, };

package/dist/types/type/variant.d.ts

@@ -8,5 +8,5 @@ export type ActionVariantType = 'primary' | 'dark' | 'light';
 export type StateVariantType = 'disabled' | 'focused' | 'readonly';
 export type ToneActionVariantType = 'primary' | 'secondary' | 'tertiary' | 'strong' | 'weak' | 'ghost' | 'quiet';
 export type ToneVariantType = 'strong' | 'weak' | 'ghost' | 'quiet';
-export type ToneSimpleVariantType = 'strong' | 'weak' | 'quiet';
+export type ToneSimpleVariantType = 'quiet' | 'strong' | 'weak';
 export type ToneMinimalVariantType = 'strong' | 'weak';

package/documentation.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2024-09-23T14:34:29",
+  "timestamp": "2024-09-26T07:00:37",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.21.0",
@@ -252,8 +252,8 @@
       "docstring": "",
       "path": "src/type/variant.ts"
     },
-    "src/type/variant.ts::ToneSimpleVariantType": {
-      "declaration": "export type ToneSimpleVariantType =\n  | 'strong'\n  | 'weak'\n  | 'quiet'",
+    "src/type/variant.ts::ToneVariantType": {
+      "declaration": "export type ToneVariantType =\n  | 'strong' // background strong\n  | 'weak' // background weak\n  | 'ghost' // bordered\n  | 'quiet'",
       "docstring": "",
       "path": "src/type/variant.ts"
     },
@@ -277,6 +277,11 @@
       "docstring": "",
       "path": "src/type/variant.ts"
     },
+    "src/type/variant.ts::ToneSimpleVariantType": {
+      "declaration": "export type ToneSimpleVariantType =\n  | 'quiet'\n  | 'strong'\n  | 'weak'",
+      "docstring": "",
+      "path": "src/type/variant.ts"
+    },
     "src/components/mds-benchmark-bar/meta/types.ts::BenchmarkBarTypographyType": {
       "declaration": "export type BenchmarkBarTypographyType =\n  | 'option'\n  | 'label'",
       "docstring": "",
@@ -317,11 +322,6 @@
       "docstring": "",
       "path": "src/type/button.ts"
     },
-    "src/type/variant.ts::ToneVariantType": {
-      "declaration": "export type ToneVariantType =\n  | 'strong' // background strong\n  | 'weak' // background weak\n  | 'ghost' // bordered\n  | 'quiet'",
-      "docstring": "",
-      "path": "src/type/variant.ts"
-    },
     "src/type/button.ts::ButtonSizeType": {
       "declaration": "export type ButtonSizeType =\n  | 'sm'\n  | 'md'\n  | 'lg'\n  | 'xl'",
       "docstring": "",
@@ -597,6 +597,16 @@
       "docstring": "",
       "path": "src/components/mds-progress/meta/types.ts"
     },
+    "src/type/date.ts::ISO8601Date": {
+      "declaration": "type ISO8601Date = ISO8601DateFormat<string, 'ISO8601Date'>",
+      "docstring": "",
+      "path": "src/type/date.ts"
+    },
+    "src/components/mds-push-notification/meta/types.ts::NotificationDateFormatType": {
+      "declaration": "string",
+      "docstring": "",
+      "path": "src/components/mds-push-notification/meta/types.ts"
+    },
     "src/components/mds-push-notification/meta/types.ts::NotificationPreviewType": {
       "declaration": "export type NotificationPreviewType =\n  | 'avatar'\n  | 'image'",
       "docstring": "",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maggioli-design-system/mds-modal",
-  "version": "4.11.3",
+  "version": "4.11.4",
   "description": "mds-modal 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 JavaScirpt 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-button": "5.0.0",
+    "@maggioli-design-system/mds-button": "5.1.0",
     "@maggioli-design-system/styles": "15.3.2",
     "@stencil/core": "4.21.0",
     "clsx": "2.1.0"

package/readme.md

@@ -39,19 +39,6 @@ This is a web-component from Maggioli Design System [Magma](https://magma.maggio
 | `"window"` |             |
 
 
-## CSS Custom Properties
-
-| Name                            | Description                                                                                                                                        |
-| ------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `--mds-modal-close-icon-color`  | Set the color of the close icon button to the top left.                                                                                            |
-| `--mds-modal-overlay-color`     | Set the overlay color of the background when the component is opened, this property can be inherited from `globals.css` in `styles^8.0.0`.         |
-| `--mds-modal-overlay-opacity`   | Set the overlay color opacity of the background when the component is opened, this property can be inherited from `globals.css` in `styles^8.0.0`. |
-| `--mds-modal-window-background` | Set the background color of the window                                                                                                             |
-| `--mds-modal-window-overflow`   | Set the overflow of the window                                                                                                                     |
-| `--mds-modal-window-shadow`     | Set the box shadow of the window                                                                                                                   |
-| `--mds-modal-z-index`           | Set the z-index of the window when the component is opened                                                                                         |
-
-
 ## Dependencies
 
 ### Used by

package/src/common/date.ts

@@ -0,0 +1,21 @@
+import { ISO8601Date } from '@type/date'
+
+// ISO 8601 date regex allowing optional components (month, day, time)
+const ISO8601RegexString = '^\\d{4}(-\\d{2})?(-\\d{2})?(T\\d{2}(:\\d{2})?(:\\d{2})?(\\.\\d{3})?)?([+-]\\d{2}:\\d{2}|Z)?$'
+
+const isISO8601Date = (dateString: string): boolean => {
+  const ISO8601Regex = new RegExp(ISO8601RegexString)
+  return ISO8601Regex.test(dateString)
+}
+
+const sanitizeISO8601Date = (dateString: string): ISO8601Date => {
+  if (isISO8601Date(dateString)) {
+    return dateString as ISO8601Date
+  }
+  return new Date(dateString).toISOString() as ISO8601Date
+}
+
+export {
+  sanitizeISO8601Date,
+  isISO8601Date,
+}

package/src/common/locale.ts

@@ -13,22 +13,28 @@ export class Locale {
   config: LocaleConfig
   closestElement:HTMLElement
 
-  constructor (configData: LocaleConfig) {
+  constructor (configData?: LocaleConfig) {
+    if (configData) {
+      this.set(configData)
+    }
+  }
+
+  set = (configData: LocaleConfig): void => {
     this.config = configData
   }
 
-  lang = (element: HTMLElement): void => {
+  lang = (element: HTMLElement): string => {
     this.closestElement = element.closest('[lang]') as HTMLElement
 
-    
     if (this.closestElement) {
       if (this.closestElement.lang) {
         this.language = this.closestElement.lang
-        return
+        return this.language
       }
     }
 
     this.language = this.rollbackLanguage
+    return this.language
   }
 
   private pluralize = (tag: string | string[], context: Record<string, string | number>): string => {

package/src/dictionary/button.ts

@@ -32,10 +32,17 @@ const buttonIconPositionDictionary = [
   'right',
 ]
 
+const buttonTypeDictionary = [
+  'button',
+  'submit',
+  'reset',
+]
+
 export {
   buttonIconPositionDictionary,
   buttonSizeDictionary,
   buttonTargetDictionary,
   buttonToneVariantDictionary,
+  buttonTypeDictionary,
   buttonVariantDictionary,
 }

package/src/dictionary/variant.ts

@@ -92,6 +92,12 @@ const toneSimpleVariantDictionary = [
   'quiet',
 ]
 
+const toneSmartVariantDictionary = [
+  'strong',
+  'weak',
+  'ghost',
+]
+
 const toneMinimalVariantDictionary = [
   'strong',
   'weak',
@@ -107,5 +113,6 @@ export {
   toneActionVariantDictionary,
   toneMinimalVariantDictionary,
   toneSimpleVariantDictionary,
+  toneSmartVariantDictionary,
   toneVariantDictionary,
 }

package/src/type/date.ts

@@ -0,0 +1,10 @@
+type ISO8601DateFormat<K, T> = K & { __isISO8601DateFormat: T };
+
+// Defines a branded type for the date ISO 8601 string
+type ISO8601Date = ISO8601DateFormat<string, 'ISO8601Date'>
+
+// const validDate: ISO8601Date = sanitizeISO8601Date('2024-09-24T15:30:00Z')
+
+export {
+  ISO8601Date,
+}

package/src/type/variant.ts

@@ -90,9 +90,9 @@ export type ToneVariantType =
   | 'quiet' // no background, no border
 
 export type ToneSimpleVariantType =
+  | 'quiet'
   | 'strong'
   | 'weak'
-  | 'quiet'
 
 export type ToneMinimalVariantType =
 | 'strong'