Merge branch 'main' into fix/tokens-letter-spacing-value

juntossomosmais · Sep 9, 2024 · a16a0a5 · a16a0a5
2 parents 40f063d + 52f2161
commit a16a0a5
Show file tree

Hide file tree

Showing 36 changed files with 1,943 additions and 597 deletions.
diff --git a/.release-please-manifest.json b/.release-please-manifest.json
@@ -1,4 +1,4 @@
 {
-  "packages/core": "2.13.1",
+  "packages/core": "2.16.0",
   "packages/tokens": "1.2.0"
 }
diff --git a/apps/docs-react/.storybook/preview.ts b/apps/docs-react/.storybook/preview.ts
@@ -1,5 +1,5 @@
 import { CustomViewports } from '@atomium/storybook-utils/custom-viewports'
-import DocumentationTemplate from '@atomium/storybook-utils/DocumentationTemplate.mdx'
+import DocumentationTemplate from '@atomium/storybook-utils/templates/DocumentationTemplate.mdx'
 
 import '@atomium/storybook-utils/preview.css'
 

diff --git a/apps/docs-vue/.storybook/preview.ts b/apps/docs-vue/.storybook/preview.ts
@@ -1,5 +1,5 @@
 import { CustomViewports } from '@atomium/storybook-utils/custom-viewports'
-import DocumentationTemplate from '@atomium/storybook-utils/DocumentationTemplate.mdx'
+import DocumentationTemplate from '@atomium/storybook-utils/templates/DocumentationTemplate.mdx'
 
 import '@atomium/storybook-utils/preview.css'
 

diff --git a/apps/docs/.storybook/preview.ts b/apps/docs/.storybook/preview.ts
@@ -1,7 +1,7 @@
 import { defineCustomElements } from '@juntossomosmais/atomium/loader'
 
 import { CustomViewports } from '@atomium/storybook-utils/custom-viewports'
-import DocumentationTemplate from '@atomium/storybook-utils/DocumentationTemplate.mdx'
+import DocumentationTemplate from '@atomium/storybook-utils/templates/DocumentationTemplate.mdx'
 
 import '@atomium/storybook-utils/preview.css'
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -35,17 +35,17 @@
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
-    "@babel/preset-env": "^7.25.3",
+    "@babel/preset-env": "^7.25.4",
     "@babel/preset-react": "^7.24.7",
     "@babel/preset-typescript": "^7.24.7",
-    "@commitlint/cli": "^19.3.0",
-    "@commitlint/config-conventional": "^19.2.2",
-    "@juntossomosmais/linters": "^0.20.0",
-    "@nrwl/workspace": "19.5.4",
+    "@commitlint/cli": "^19.4.1",
+    "@commitlint/config-conventional": "^19.4.1",
+    "@juntossomosmais/linters": "^0.21.0",
+    "@nrwl/workspace": "19.6.4",
     "@rollup/plugin-typescript": "^11.1.6",
     "@stencil/react-output-target": "^0.5.3",
     "@stencil/sass": "^3.0.12",
-    "@stencil/vue-output-target": "^0.8.8",
+    "@stencil/vue-output-target": "^0.8.9",
     "@storybook/addon-a11y": "^7.6.17",
     "@storybook/addon-docs": "^7.6.17",
     "@storybook/addon-essentials": "^7.6.17",
@@ -57,7 +57,7 @@
     "@storybook/theming": "^7.6.17",
     "@storybook/vue3": "^7.6.6",
     "@storybook/vue3-vite": "^7.6.6",
-    "@vitejs/plugin-vue": "^5.1.1",
+    "@vitejs/plugin-vue": "^5.1.3",
     "@storybook/web-components": "^7.6.17",
     "@storybook/web-components-webpack5": "^7.6.17",
     "@testing-library/jest-dom": "^6.4.8",
@@ -76,35 +76,35 @@
     "eslint-import-resolver-typescript": "^3.6.1",
     "eslint-plugin-import": "^2.29.1",
     "eslint-plugin-sonarjs": "^1.0.4",
-    "husky": "^9.1.4",
+    "husky": "^9.1.5",
     "jest": "^27.0.3",
     "jest-cli": "^27.0.3",
-    "lint-staged": "^15.2.7",
-    "lit": "^3.1.4",
+    "lint-staged": "^15.2.10",
+    "lit": "^3.2.0",
     "nx": "19.5.4",
-    "postcss": "^8.4.40",
+    "postcss": "^8.4.44",
     "postcss-scss": "^4.0.9",
     "prettier": "3.3.3",
     "prop-types": "^15.8.1",
     "puppeteer": "^22.15.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "rollup": "^4.19.2",
+    "rollup": "^4.21.2",
     "rollup-plugin-postcss": "^4.0.2",
     "rupture-sass": "^1.0.0",
     "sass": "^1.77.8",
-    "sass-loader": "^16.0.0",
+    "sass-loader": "^16.0.1",
     "storybook": "^7.6.17",
-    "stylelint": "^16.8.1",
+    "stylelint": "^16.9.0",
     "stylelint-config-recommended": "^14.0.1",
     "stylelint-order": "^6.0.4",
-    "stylelint-scss": "^6.4.1",
+    "stylelint-scss": "^6.5.1",
     "ts-jest": "^29.2.4",
     "ts-node": "^10.9.2",
     "tslib": "^2.6.3",
     "typescript": "^5.5.4",
-    "vite": "^5.3.5",
-    "vue": "^3.4.35"
+    "vite": "^5.4.2",
+    "vue": "^3.4.38"
   },
   "lint-staged": {
     "*.{js,jsx,ts,tsx}": [

diff --git a/packages/core/CHANGELOG.md b/packages/core/CHANGELOG.md
@@ -1,5 +1,42 @@
 # Changelog
 
+## [2.16.0](https://github.com/juntossomosmais/atomium/compare/atomium-v2.15.0...atomium-v2.16.0) (2024-08-28)
+
+
+### Features
+
+* **icon:** add white color ([#547](https://github.com/juntossomosmais/atomium/issues/547)) ([651bb20](https://github.com/juntossomosmais/atomium/commit/651bb20159cca6c49d733947739f1cf9e9c3698e))
+
+## [2.15.0](https://github.com/juntossomosmais/atomium/compare/atomium-v2.14.2...atomium-v2.15.0) (2024-08-27)
+
+
+### Features
+
+* **link:** set default color and add size prop ([#545](https://github.com/juntossomosmais/atomium/issues/545)) ([f63b1c7](https://github.com/juntossomosmais/atomium/commit/f63b1c728015bb050c00fc701f4dd4148196edc2))
+
+## [2.14.2](https://github.com/juntossomosmais/atomium/compare/atomium-v2.14.1...atomium-v2.14.2) (2024-08-23)
+
+
+### Bug Fixes
+
+* **alert:** improve position of icon on single line ([#543](https://github.com/juntossomosmais/atomium/issues/543)) ([9c587d6](https://github.com/juntossomosmais/atomium/commit/9c587d6cbd7ab3e2cbe30502ec6a35cfe6ef873a))
+
+## [2.14.1](https://github.com/juntossomosmais/atomium/compare/atomium-v2.14.0...atomium-v2.14.1) (2024-08-22)
+
+
+### Bug Fixes
+
+* **icons:** rename verified outline icon ([#540](https://github.com/juntossomosmais/atomium/issues/540)) ([57e3b51](https://github.com/juntossomosmais/atomium/commit/57e3b517f331fe31d9bab207dd13a6e033575765))
+* **tag:** light tag color ([#542](https://github.com/juntossomosmais/atomium/issues/542)) ([c098357](https://github.com/juntossomosmais/atomium/commit/c098357e0cf1e4b7202febd0398f000a51c92cbc))
+
+## [2.14.0](https://github.com/juntossomosmais/atomium/compare/atomium-v2.13.1...atomium-v2.14.0) (2024-08-16)
+
+
+### Features
+
+* **icons:** add verified icons ([#539](https://github.com/juntossomosmais/atomium/issues/539)) ([f04d310](https://github.com/juntossomosmais/atomium/commit/f04d310243aae09c2465aae04d10875dc7c4dfc7))
+* **modal:** add modal component ([#534](https://github.com/juntossomosmais/atomium/issues/534)) ([f3fc1bb](https://github.com/juntossomosmais/atomium/commit/f3fc1bbe47362a88a0754324160f1e25f2fccc65))
+
 ## [2.13.1](https://github.com/juntossomosmais/atomium/compare/atomium-v2.13.0...atomium-v2.13.1) (2024-08-08)
 
 

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@juntossomosmais/atomium",
-  "version": "2.13.1",
+  "version": "2.16.0",
   "description": "Core of web components for Atomium",
   "repository": {
     "type": "git",

diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts
@@ -6,10 +6,10 @@
  */
 import { HTMLStencilElement, JSXBase } from "@stencil/core/internal";
 import { IconProps } from "./icons";
-import { Color, Mode, TextFieldTypes } from "@ionic/core";
+import { Mode, TextFieldTypes } from "@ionic/core";
 import { IonTypes } from "@ionic/core/dist/types/components";
 export { IconProps } from "./icons";
-export { Color, Mode, TextFieldTypes } from "@ionic/core";
+export { Mode, TextFieldTypes } from "@ionic/core";
 export { IonTypes } from "@ionic/core/dist/types/components";
 export namespace Components {
     interface AtomAlert {
@@ -38,7 +38,10 @@ export namespace Components {
         "disabled"?: boolean;
         "download"?: string;
         "expand"?: 'block';
-        "fill": 'clear' | 'outline' | 'outline-filled' | 'solid';
+        "fill": | 'clear'
+    | 'outline'
+    | 'outline-filled'
+    | 'solid';
         "href"?: string;
         "loading"?: boolean;
         "mode": Mode;
@@ -84,7 +87,7 @@ export namespace Components {
         "fixed"?: boolean;
     }
     interface AtomIcon {
-        "color"?: Color;
+        "color"?: ColorProps;
         "icon"?: IconProps;
         "size"?: Size;
     }
@@ -146,6 +149,7 @@ export namespace Components {
     interface AtomLink {
         "color": 'primary' | 'secondary';
         "loading"?: boolean;
+        "size": 'small' | 'medium' | 'large';
         "type": 'anchor' | 'button';
     }
     interface AtomListSlider {
@@ -154,6 +158,16 @@ export namespace Components {
     }
     interface AtomListSliderItem {
     }
+    interface AtomModal {
+        "alertType"?: 'alert' | 'error';
+        "hasDivider"?: boolean;
+        "hasFooter"?: boolean;
+        "headerTitle"?: string;
+        "primaryText"?: string;
+        "progress"?: number;
+        "secondaryText"?: string;
+        "trigger"?: string;
+    }
     interface AtomSelect {
         "color"?: 'primary' | 'secondary' | 'danger';
         "disabled"?: boolean;
@@ -260,6 +274,10 @@ export interface AtomListSliderCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLAtomListSliderElement;
 }
+export interface AtomModalCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLAtomModalElement;
+}
 export interface AtomSelectCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLAtomSelectElement;
@@ -430,6 +448,27 @@ declare global {
         prototype: HTMLAtomListSliderItemElement;
         new (): HTMLAtomListSliderItemElement;
     };
+    interface HTMLAtomModalElementEventMap {
+        "atomCloseClick": any;
+        "atomDidDismiss": any;
+        "atomDidPresent": any;
+        "atomPrimaryClick": any;
+        "atomSecondaryClick": any;
+    }
+    interface HTMLAtomModalElement extends Components.AtomModal, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLAtomModalElementEventMap>(type: K, listener: (this: HTMLAtomModalElement, ev: AtomModalCustomEvent<HTMLAtomModalElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLAtomModalElementEventMap>(type: K, listener: (this: HTMLAtomModalElement, ev: AtomModalCustomEvent<HTMLAtomModalElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLAtomModalElement: {
+        prototype: HTMLAtomModalElement;
+        new (): HTMLAtomModalElement;
+    };
     interface HTMLAtomSelectElementEventMap {
         "atomBlur": void;
         "atomCancel": void;
@@ -493,6 +532,7 @@ declare global {
         "atom-link": HTMLAtomLinkElement;
         "atom-list-slider": HTMLAtomListSliderElement;
         "atom-list-slider-item": HTMLAtomListSliderItemElement;
+        "atom-modal": HTMLAtomModalElement;
         "atom-select": HTMLAtomSelectElement;
         "atom-tag": HTMLAtomTagElement;
         "atom-textarea": HTMLAtomTextareaElement;
@@ -527,7 +567,10 @@ declare namespace LocalJSX {
         "disabled"?: boolean;
         "download"?: string;
         "expand"?: 'block';
-        "fill"?: 'clear' | 'outline' | 'outline-filled' | 'solid';
+        "fill"?: | 'clear'
+    | 'outline'
+    | 'outline-filled'
+    | 'solid';
         "href"?: string;
         "loading"?: boolean;
         "mode"?: Mode;
@@ -575,7 +618,7 @@ declare namespace LocalJSX {
         "fixed"?: boolean;
     }
     interface AtomIcon {
-        "color"?: Color;
+        "color"?: ColorProps;
         "icon"?: IconProps;
         "size"?: Size;
     }
@@ -639,6 +682,7 @@ declare namespace LocalJSX {
         "color"?: 'primary' | 'secondary';
         "loading"?: boolean;
         "onClick"?: (event: AtomLinkCustomEvent<any>) => void;
+        "size"?: 'small' | 'medium' | 'large';
         "type"?: 'anchor' | 'button';
     }
     interface AtomListSlider {
@@ -649,6 +693,21 @@ declare namespace LocalJSX {
     }
     interface AtomListSliderItem {
     }
+    interface AtomModal {
+        "alertType"?: 'alert' | 'error';
+        "hasDivider"?: boolean;
+        "hasFooter"?: boolean;
+        "headerTitle"?: string;
+        "onAtomCloseClick"?: (event: AtomModalCustomEvent<any>) => void;
+        "onAtomDidDismiss"?: (event: AtomModalCustomEvent<any>) => void;
+        "onAtomDidPresent"?: (event: AtomModalCustomEvent<any>) => void;
+        "onAtomPrimaryClick"?: (event: AtomModalCustomEvent<any>) => void;
+        "onAtomSecondaryClick"?: (event: AtomModalCustomEvent<any>) => void;
+        "primaryText"?: string;
+        "progress"?: number;
+        "secondaryText"?: string;
+        "trigger"?: string;
+    }
     interface AtomSelect {
         "color"?: 'primary' | 'secondary' | 'danger';
         "disabled"?: boolean;
@@ -752,6 +811,7 @@ declare namespace LocalJSX {
         "atom-link": AtomLink;
         "atom-list-slider": AtomListSlider;
         "atom-list-slider-item": AtomListSliderItem;
+        "atom-modal": AtomModal;
         "atom-select": AtomSelect;
         "atom-tag": AtomTag;
         "atom-textarea": AtomTextarea;
@@ -776,6 +836,7 @@ declare module "@stencil/core" {
             "atom-link": LocalJSX.AtomLink & JSXBase.HTMLAttributes<HTMLAtomLinkElement>;
             "atom-list-slider": LocalJSX.AtomListSlider & JSXBase.HTMLAttributes<HTMLAtomListSliderElement>;
             "atom-list-slider-item": LocalJSX.AtomListSliderItem & JSXBase.HTMLAttributes<HTMLAtomListSliderItemElement>;
+            "atom-modal": LocalJSX.AtomModal & JSXBase.HTMLAttributes<HTMLAtomModalElement>;
             "atom-select": LocalJSX.AtomSelect & JSXBase.HTMLAttributes<HTMLAtomSelectElement>;
             "atom-tag": LocalJSX.AtomTag & JSXBase.HTMLAttributes<HTMLAtomTagElement>;
             "atom-textarea": LocalJSX.AtomTextarea & JSXBase.HTMLAttributes<HTMLAtomTextareaElement>;

diff --git a/packages/core/src/components/alert/alert.scss b/packages/core/src/components/alert/alert.scss
@@ -1,5 +1,7 @@
 @import '~@atomium/scss-utils/index';
 
+$min-height-title: var(--spacing-large);
+
 :host {
   --close-size: var(--spacing-xxxlarge);
   --icon-size: var(--spacing-medium);
@@ -75,6 +77,7 @@
 .atom-title {
   font-weight: var(--font-weight-bold);
   margin: 0;
+  min-height: $min-height-title;
 
   &:not(:last-child) {
     margin-bottom: var(--spacing-xsmall);
@@ -118,8 +121,10 @@
 }
 
 .atom-icon {
+  align-items: center;
+  display: flex;
   font-size: var(--icon-size);
-  width: var(--space-large);
+  height: $min-height-title;
 }
 
 .atom-close {