@maggioli-design-system/mds-table-row 3.1.0 → 4.1.0

package/documentation.json

@@ -0,0 +1,53 @@
+{
+  "timestamp": "2023-04-14T09:57:39",
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "2.22.3",
+    "typescriptVersion": "4.9.4"
+  },
+  "components": [
+    {
+      "filePath": "./src/components/mds-table-row/mds-table-row.tsx",
+      "encapsulation": "shadow",
+      "tag": "mds-table-row",
+      "readme": "# mds-table-row\n\n\n",
+      "docs": "",
+      "docsTags": [],
+      "usage": {},
+      "props": [
+        {
+          "name": "interactive",
+          "type": "boolean",
+          "mutable": true,
+          "attr": "interactive",
+          "reflectToAttr": true,
+          "docs": "",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        }
+      ],
+      "methods": [],
+      "events": [],
+      "listeners": [
+        {
+          "event": "mdsTableInteractiveChange",
+          "target": "document",
+          "capture": false,
+          "passive": false
+        }
+      ],
+      "styles": [],
+      "slots": [],
+      "parts": [],
+      "dependents": [],
+      "dependencies": [],
+      "dependencyGraph": {}
+    }
+  ]
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@maggioli-design-system/mds-table-row",
-  "version": "3.1.0",
+  "version": "4.1.0",
   "description": "mds-table-row is a web-component from Maggioli Design System Magma, 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",
@@ -12,6 +12,7 @@
   "unpkg": "dist/mds-table-row/mds-table-row.esm.js",
   "files": [
     "dist/",
+    "documentation.json",
     "loader/",
     "readme.md",
     "src/",
@@ -22,9 +23,9 @@
     "prepublishOnly": "npm run build"
   },
   "dependencies": {
-    "@maggioli-design-system/mds-table-cell": "^3.1.0",
-    "@maggioli-design-system/styles": "^10.0.1",
-    "@stencil/core": "^2.22.1"
+    "@maggioli-design-system/mds-table-cell": "^4.1.0",
+    "@maggioli-design-system/styles": "^11.4.0",
+    "@stencil/core": "^2.22.3"
   },
   "license": "MIT",
   "author": {
@@ -38,10 +39,15 @@
       "email": "andrea.pruccoli@maggioli.it",
       "role": "Software Engineer"
     },
+    {
+      "name": "Nicola Tamburini",
+      "email": "nicola.tamburini@maggioli.it",
+      "role": "Software Engineer"
+    },
     {
       "name": "Vittorio Vittori",
       "email": "vittorio.vittori@maggioli.it",
-      "role": "UX UI Designer"
+      "role": "Product Designer"
     }
   ]
 }

package/src/common/aria.ts

@@ -7,12 +7,12 @@ const hash = (s: string): string => {
 }
 
 const unslugName = (name: string): string => {
-  return name.split('/').slice(-1).pop().replace(/-/g, ' ')
+  return name.split('/')?.slice(-1).pop()?.replace(/-/g, ' ') ?? name
 }
 
 const setAttributeIfEmpty = (element: HTMLElement, attribute: string, value: string): string => {
   if (element.hasAttribute(attribute)) {
-    return element.getAttribute(attribute)
+    return element.getAttribute(attribute) ?? ''
   }
   element.setAttribute(attribute, value)
   return value

package/src/common/keyboard-manager.ts

@@ -0,0 +1,46 @@
+export class KeyboardManager {
+  private escapeCallback: () => void
+  private elements = []
+
+  private handleClickBehaviorDispatchEvent = (event: KeyboardEvent): void => {
+    if (event.code === 'Space' || event.code === 'Enter' || event.code === 'NumpadEnter') {
+      (event.target as HTMLElement).click()
+    }
+  }
+
+  private handleEscapeBehaviorDispatchEvent = (event: KeyboardEvent): void => {
+    if (event.code === 'Escape' && this.escapeCallback) {
+      this.escapeCallback()
+    }
+  }
+
+  addElement = (el: HTMLElement, name = 'element'): void => {
+    this.elements[name] = el
+  }
+
+  attachClickBehavior = (name = 'element'): void => {
+    if (this.elements[name]) {
+      this.elements[name].addEventListener('keydown', this.handleClickBehaviorDispatchEvent)
+    }
+  }
+
+  detachClickBehavior = (name = 'element'): void => {
+    if (this.elements[name]) {
+      this.elements[name].removeEventListener('keydown', this.handleClickBehaviorDispatchEvent)
+    }
+  }
+
+  attachEscapeBehavior = (callBack: () => void): void => {
+    this.escapeCallback = callBack
+    if (typeof window !== undefined) {
+      window.addEventListener('keydown', this.handleEscapeBehaviorDispatchEvent.bind(this))
+    }
+  }
+
+  detachEscapeBehavior = (): void => {
+    this.escapeCallback = () => {return}
+    if (typeof window !== undefined) {
+      window.removeEventListener('keydown', this.handleEscapeBehaviorDispatchEvent.bind(this))
+    }
+  }
+}

package/src/components/mds-table-row/mds-table-row.css

@@ -4,7 +4,7 @@
   @apply table-row;
 }
 
-:host ( [interactive]:hover ) {
+:host( [interactive]:hover ) {
 
   --mds-table-cell-background: var(--mds-table-cell-background-hover, theme('colors.tone-neutral'));
 }

package/src/components/mds-table-row/mds-table-row.tsx

@@ -8,7 +8,7 @@ export class MdsTableRow {
 
   @Prop({ mutable: true, reflect: true }) interactive: boolean
 
-  @Listen('tableInteractive', { target: 'body' })
+  @Listen('mdsTableInteractiveChange', { target: 'document' })
   tableInteractiveHandler (event: CustomEvent<boolean>): void {
     this.interactive = event.detail
   }

package/src/dictionary/icon.ts

@@ -1,5 +1,9 @@
 import jsonIconsDictionary from '../fixtures/icons.json'
+import jsonMggIconsDictionary from '../fixtures/iconsauce.json'
 const iconsDictionary = jsonIconsDictionary
+const mggIconsDictionary = jsonMggIconsDictionary
+
 export {
   iconsDictionary,
+  mggIconsDictionary,
 }

package/src/dictionary/typography.ts

@@ -23,6 +23,11 @@ const typographyVariationsDictionary = [
   'code',
 ]
 
+const typographyReadingVariationsDictionary = [
+  'info',
+  'read',
+]
+
 const typographyMonoDictionary = [
   'snippet',
   'hack',
@@ -66,11 +71,12 @@ const typographyTooltipDictionary = [
 
 export {
   typographyDictionary,
-  typographyVariationsDictionary,
-  typographyMonoDictionary,
-  typographyTitleDictionary,
   typographyInfoDictionary,
+  typographyReadingVariationsDictionary,
+  typographyMonoDictionary,
   typographyReadDictionary,
   typographySmallerDictionary,
+  typographyTitleDictionary,
   typographyTooltipDictionary,
+  typographyVariationsDictionary,
 }

package/src/fixtures/icons.json

@@ -10,6 +10,179 @@
     "mdi/map-marker",
     "mdi/replay",
     "mdi/vector-curve",
+    "mgg/abitazione-principale",
+    "mgg/action-hide-down-side",
+    "mgg/action-hide-left-side",
+    "mgg/action-hide-right-side",
+    "mgg/action-hide-sidebar-left",
+    "mgg/action-hide-sidebar-right",
+    "mgg/action-show-down-side",
+    "mgg/action-show-left-side",
+    "mgg/action-show-right-side",
+    "mgg/action-show-sidebar-left",
+    "mgg/action-show-sidebar-right",
+    "mgg/add-document-settings",
+    "mgg/additional-contents",
+    "mgg/address-book-off",
+    "mgg/address-book-on",
+    "mgg/adv-denied",
+    "mgg/area-edificabile",
+    "mgg/area-weather",
+    "mgg/box-multiple",
+    "mgg/breadcrumb",
+    "mgg/calendar-euro",
+    "mgg/calendar-multiple",
+    "mgg/calendar-schedule",
+    "mgg/car-license",
+    "mgg/card-stamping",
+    "mgg/checklist",
+    "mgg/checklist-settings",
+    "mgg/citizenship",
+    "mgg/city-bin",
+    "mgg/copy-paste",
+    "mgg/data-analytics-alt",
+    "mgg/data-analytics-search",
+    "mgg/data-analytics-time",
+    "mgg/data-category-alt",
+    "mgg/data-civil-union",
+    "mgg/data-death-civil-union",
+    "mgg/data-death-marriage",
+    "mgg/data-end-civil-union",
+    "mgg/data-end-marriage",
+    "mgg/dataset",
+    "mgg/document-magic",
+    "mgg/document-rename",
+    "mgg/electronic-document",
+    "mgg/email-open-check",
+    "mgg/email-open-off",
+    "mgg/face-to-face-meeting",
+    "mgg/farmer",
+    "mgg/field",
+    "mgg/file-download",
+    "mgg/file-folder-tree",
+    "mgg/file-folder-tree-open",
+    "mgg/file-import",
+    "mgg/file-odt",
+    "mgg/file-rtf",
+    "mgg/file-settings-alt",
+    "mgg/file-stack",
+    "mgg/file-stack-alt",
+    "mgg/file-sub",
+    "mgg/file-type-document-attachment",
+    "mgg/file-type-document-multiple-attachment",
+    "mgg/file-type-document-rubber-stamp",
+    "mgg/file-type-home",
+    "mgg/file-type-pdf",
+    "mgg/file-type-success",
+    "mgg/file-type-warning",
+    "mgg/finance-euro-cashback",
+    "mgg/fit-horizontal",
+    "mgg/fit-vertical",
+    "mgg/fullscreen-on-alt",
+    "mgg/google-check-small",
+    "mgg/google-place-item",
+    "mgg/heart",
+    "mgg/heart-outline",
+    "mgg/historic-building",
+    "mgg/historic-building-unusable",
+    "mgg/home-hammer",
+    "mgg/home-number",
+    "mgg/inagibile",
+    "mgg/input-calendar-costs",
+    "mgg/input-calendar-period",
+    "mgg/input-calendar-time",
+    "mgg/isbn",
+    "mgg/judge-hammer",
+    "mgg/land-registry",
+    "mgg/layers",
+    "mgg/list-dot",
+    "mgg/logo-girasole-camuno",
+    "mgg/logo-gpl",
+    "mgg/logo-ilibro",
+    "mgg/map-marker-settings",
+    "mgg/military-draft",
+    "mgg/money-bag-settings",
+    "mgg/money-on-hand",
+    "mgg/move-down",
+    "mgg/move-left",
+    "mgg/move-right",
+    "mgg/move-row-down",
+    "mgg/move-row-up",
+    "mgg/move-up",
+    "mgg/multiple-payments",
+    "mgg/national-document",
+    "mgg/national-document-off",
+    "mgg/order-return-down-left-to-right",
+    "mgg/order-return-down-left-to-up",
+    "mgg/order-return-down-right-to-left",
+    "mgg/order-return-down-right-to-up",
+    "mgg/order-return-up-left-to-down",
+    "mgg/order-return-up-left-to-right",
+    "mgg/order-return-up-right-to-down",
+    "mgg/order-return-up-right-to-left",
+    "mgg/order-zigzag-down-left-to-right",
+    "mgg/order-zigzag-down-left-to-up",
+    "mgg/order-zigzag-down-right-to-left",
+    "mgg/order-zigzag-down-right-to-up",
+    "mgg/order-zigzag-up-left-to-down",
+    "mgg/order-zigzag-up-left-to-right",
+    "mgg/order-zigzag-up-right-to-down",
+    "mgg/order-zigzag-up-right-to-left",
+    "mgg/other-properties",
+    "mgg/other-properties-off",
+    "mgg/partial-wall",
+    "mgg/payment-settings",
+    "mgg/places-green",
+    "mgg/places-green-doc",
+    "mgg/places-green-history",
+    "mgg/places-green-info",
+    "mgg/places-holiday-beach",
+    "mgg/places-market",
+    "mgg/places-park",
+    "mgg/places-park-alt",
+    "mgg/places-store-access-denied",
+    "mgg/property-owner",
+    "mgg/relevance",
+    "mgg/reporting-abuse",
+    "mgg/residency-permit",
+    "mgg/rubber-stamp",
+    "mgg/rurale",
+    "mgg/search-maggioli",
+    "mgg/send-progress",
+    "mgg/settings-attachment",
+    "mgg/sign-shop",
+    "mgg/square-viewfinder",
+    "mgg/stamp",
+    "mgg/status-progress-a-quarter",
+    "mgg/status-progress-complete",
+    "mgg/status-progress-half",
+    "mgg/status-progress-three-quarter",
+    "mgg/stuck-codes",
+    "mgg/tea-light",
+    "mgg/terminal",
+    "mgg/todo",
+    "mgg/todo-completed",
+    "mgg/todo-completed-re-executable",
+    "mgg/todo-in-charge-by-me",
+    "mgg/todo-in-charge-by-others",
+    "mgg/todo-in-evaluation",
+    "mgg/todo-in-evaluation-by-others",
+    "mgg/todo-incoming-in-charge",
+    "mgg/todo-incoming-rejected",
+    "mgg/todo-pause",
+    "mgg/todo-running-completed",
+    "mgg/todo-suspended",
+    "mgg/traffic-cone",
+    "mgg/trending-down",
+    "mgg/tributes",
+    "mgg/urban-city",
+    "mgg/user-dead",
+    "mgg/user-family",
+    "mgg/user-location",
+    "mgg/user-location-off",
+    "mgg/view-chart-gantt",
+    "mgg/view-side-by-side",
+    "mgg/work-book",
     "mi/baseline/account-balance",
     "mi/baseline/account-balance-wallet",
     "mi/baseline/adobe",
@@ -29,6 +202,7 @@
     "mi/baseline/css",
     "mi/baseline/description",
     "mi/baseline/done",
+    "mi/baseline/downhill-skiing",
     "mi/baseline/eco",
     "mi/baseline/email",
     "mi/baseline/error",
@@ -47,6 +221,7 @@
     "mi/baseline/navigate-next",
     "mi/baseline/panorama",
     "mi/baseline/person",
+    "mi/baseline/pets",
     "mi/baseline/radio-button-checked",
     "mi/baseline/radio-button-unchecked",
     "mi/baseline/route",

package/src/fixtures/iconsauce.json

@@ -0,0 +1,175 @@
+[
+    "mgg/abitazione-principale",
+    "mgg/action-hide-down-side",
+    "mgg/action-hide-left-side",
+    "mgg/action-hide-right-side",
+    "mgg/action-hide-sidebar-left",
+    "mgg/action-hide-sidebar-right",
+    "mgg/action-show-down-side",
+    "mgg/action-show-left-side",
+    "mgg/action-show-right-side",
+    "mgg/action-show-sidebar-left",
+    "mgg/action-show-sidebar-right",
+    "mgg/add-document-settings",
+    "mgg/additional-contents",
+    "mgg/address-book-off",
+    "mgg/address-book-on",
+    "mgg/adv-denied",
+    "mgg/area-edificabile",
+    "mgg/area-weather",
+    "mgg/box-multiple",
+    "mgg/breadcrumb",
+    "mgg/calendar-euro",
+    "mgg/calendar-multiple",
+    "mgg/calendar-schedule",
+    "mgg/car-license",
+    "mgg/card-stamping",
+    "mgg/checklist-settings",
+    "mgg/checklist",
+    "mgg/citizenship",
+    "mgg/city-bin",
+    "mgg/copy-paste",
+    "mgg/data-analytics-alt",
+    "mgg/data-analytics-search",
+    "mgg/data-analytics-time",
+    "mgg/data-category-alt",
+    "mgg/data-civil-union",
+    "mgg/data-death-civil-union",
+    "mgg/data-death-marriage",
+    "mgg/data-end-civil-union",
+    "mgg/data-end-marriage",
+    "mgg/dataset",
+    "mgg/document-magic",
+    "mgg/document-rename",
+    "mgg/electronic-document",
+    "mgg/email-open-check",
+    "mgg/email-open-off",
+    "mgg/face-to-face-meeting",
+    "mgg/farmer",
+    "mgg/field",
+    "mgg/file-download",
+    "mgg/file-folder-tree-open",
+    "mgg/file-folder-tree",
+    "mgg/file-import",
+    "mgg/file-odt",
+    "mgg/file-rtf",
+    "mgg/file-settings-alt",
+    "mgg/file-stack-alt",
+    "mgg/file-stack",
+    "mgg/file-sub",
+    "mgg/file-type-document-attachment",
+    "mgg/file-type-document-multiple-attachment",
+    "mgg/file-type-document-rubber-stamp",
+    "mgg/file-type-home",
+    "mgg/file-type-pdf",
+    "mgg/file-type-success",
+    "mgg/file-type-warning",
+    "mgg/finance-euro-cashback",
+    "mgg/fit-horizontal",
+    "mgg/fit-vertical",
+    "mgg/fullscreen-on-alt",
+    "mgg/google-check-small",
+    "mgg/google-place-item",
+    "mgg/heart-outline",
+    "mgg/heart",
+    "mgg/historic-building-unusable",
+    "mgg/historic-building",
+    "mgg/home-hammer",
+    "mgg/home-number",
+    "mgg/inagibile",
+    "mgg/input-calendar-costs",
+    "mgg/input-calendar-period",
+    "mgg/input-calendar-time",
+    "mgg/isbn",
+    "mgg/judge-hammer",
+    "mgg/land-registry",
+    "mgg/layers",
+    "mgg/list-dot",
+    "mgg/logo-girasole-camuno",
+    "mgg/logo-gpl",
+    "mgg/logo-ilibro",
+    "mgg/map-marker-settings",
+    "mgg/military-draft",
+    "mgg/money-bag-settings",
+    "mgg/money-on-hand",
+    "mgg/move-down",
+    "mgg/move-left",
+    "mgg/move-right",
+    "mgg/move-row-down",
+    "mgg/move-row-up",
+    "mgg/move-up",
+    "mgg/multiple-payments",
+    "mgg/national-document-off",
+    "mgg/national-document",
+    "mgg/order-return-down-left-to-right",
+    "mgg/order-return-down-left-to-up",
+    "mgg/order-return-down-right-to-left",
+    "mgg/order-return-down-right-to-up",
+    "mgg/order-return-up-left-to-down",
+    "mgg/order-return-up-left-to-right",
+    "mgg/order-return-up-right-to-down",
+    "mgg/order-return-up-right-to-left",
+    "mgg/order-zigzag-down-left-to-right",
+    "mgg/order-zigzag-down-left-to-up",
+    "mgg/order-zigzag-down-right-to-left",
+    "mgg/order-zigzag-down-right-to-up",
+    "mgg/order-zigzag-up-left-to-down",
+    "mgg/order-zigzag-up-left-to-right",
+    "mgg/order-zigzag-up-right-to-down",
+    "mgg/order-zigzag-up-right-to-left",
+    "mgg/other-properties-off",
+    "mgg/other-properties",
+    "mgg/partial-wall",
+    "mgg/payment-settings",
+    "mgg/places-green-doc",
+    "mgg/places-green-history",
+    "mgg/places-green-info",
+    "mgg/places-green",
+    "mgg/places-holiday-beach",
+    "mgg/places-market",
+    "mgg/places-park-alt",
+    "mgg/places-park",
+    "mgg/places-store-access-denied",
+    "mgg/property-owner",
+    "mgg/relevance",
+    "mgg/reporting-abuse",
+    "mgg/residency-permit",
+    "mgg/rubber-stamp",
+    "mgg/rurale",
+    "mgg/search-maggioli",
+    "mgg/send-progress",
+    "mgg/settings-attachment",
+    "mgg/sign-shop",
+    "mgg/square-viewfinder",
+    "mgg/stamp",
+    "mgg/status-progress-a-quarter",
+    "mgg/status-progress-complete",
+    "mgg/status-progress-half",
+    "mgg/status-progress-three-quarter",
+    "mgg/stuck-codes",
+    "mgg/tea-light",
+    "mgg/terminal",
+    "mgg/todo-completed-re-executable",
+    "mgg/todo-completed",
+    "mgg/todo-in-charge-by-me",
+    "mgg/todo-in-charge-by-others",
+    "mgg/todo-in-evaluation-by-others",
+    "mgg/todo-in-evaluation",
+    "mgg/todo-incoming-in-charge",
+    "mgg/todo-incoming-rejected",
+    "mgg/todo-pause",
+    "mgg/todo-running-completed",
+    "mgg/todo-suspended",
+    "mgg/todo",
+    "mgg/traffic-cone",
+    "mgg/trending-down",
+    "mgg/tributes",
+    "mgg/urban-city",
+    "mgg/user-dead",
+    "mgg/user-family",
+    "mgg/user-location-off",
+    "mgg/user-location",
+    "mgg/view-chart-gantt",
+    "mgg/view-side-by-side",
+    "mgg/work-book"
+]

package/src/interface/input-value.ts

@@ -1,4 +1,4 @@
-import { InputValueType } from '../types/input-value-type'
+import { InputValueType } from '@type/input-value-type'
 
 export interface InputValue {
   value: InputValueType

package/src/tailwind/components.css

@@ -1,3 +1,4 @@
+@import '~@maggioli-design-system/styles/dist/tailwind/components.css';
 @tailwind components;
 
 @layer components {

package/src/{types → type}/typography.ts

@@ -21,6 +21,10 @@ export type TypographyVariants =
   | 'read'
   | 'code'
 
+export type TypographyReadingVariants =
+  | 'info'
+  | 'read'
+
 export type TypographyTitleType =
   | 'action'
   | 'h1'

package/www/build/mds-table-row.esm.js

@@ -1 +1 @@
-import{p as e,b as t}from"./p-f26de3ab.js";export{s as setNonce}from"./p-f26de3ab.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((e=>t([["p-4c63953c",[[1,"mds-table-row",{interactive:[1540]},[[16,"tableInteractive","tableInteractiveHandler"]]]]]],e)));
+import{p as e,b as t}from"./p-426bd1f3.js";export{s as setNonce}from"./p-426bd1f3.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((e=>t([["p-30a6116a",[[1,"mds-table-row",{interactive:[1540]},[[4,"mdsTableInteractiveChange","tableInteractiveHandler"]]]]]],e)));

package/www/build/mds-table-row.js

@@ -115,7 +115,7 @@ DOMTokenList
   var resourcesUrl = scriptElm ? scriptElm.getAttribute('data-resources-url') || scriptElm.src : '';
   var start = function() {
     // if src is not present then origin is "null", and new URL() throws TypeError: Failed to construct 'URL': Invalid base URL
-    var url = new URL('./p-e6313d30.system.js', new URL(resourcesUrl, window.location.origin !== 'null' ? window.location.origin : undefined));
+    var url = new URL('./p-29cf76f2.system.js', new URL(resourcesUrl, window.location.origin !== 'null' ? window.location.origin : undefined));
     System.import(url.href);
   };